:root {
  --ink: #17212b;
  --muted: #64748b;
  --line: #d8e0e8;
  --panel: #ffffff;
  --bg: #f4f7fa;
  --brand: #ef7d00;
  --brand-dark: #a95100;
  --ok: #16803a;
  --warn: #a15c00;
  --bad: #b42318;
  --navy: #102a43;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif; color: var(--ink); background: var(--bg); }
a { color: #075985; }
button, input, select { font: inherit; }
button { cursor: pointer; }
.topbar { min-height: 64px; background: var(--navy); color: white; display: flex; align-items: center; justify-content: space-between; padding: 12px 24px; position: sticky; top: 0; z-index: 100; }
.brand { display: flex; align-items: center; gap: 12px; font-weight: 800; letter-spacing: .03em; }
.brand-mark { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; background: var(--brand); color: white; }
.container { width: min(1200px, calc(100% - 32px)); margin: 24px auto 48px; }
.narrow { width: min(520px, calc(100% - 32px)); margin: 8vh auto; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 20px; box-shadow: 0 5px 18px rgba(15, 23, 42, .06); }
.grid { display: grid; gap: 18px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
label { display: grid; gap: 7px; font-weight: 650; }
input, select { width: 100%; border: 1px solid #bdc8d4; border-radius: 9px; padding: 10px 12px; background: white; }
input:focus, select:focus { outline: 3px solid rgba(239, 125, 0, .18); border-color: var(--brand); }
.btn { border: 0; border-radius: 9px; padding: 10px 14px; font-weight: 750; background: #e6edf3; color: var(--ink); }
.btn-primary { background: var(--brand); color: white; }
.btn-primary:hover { background: var(--brand-dark); }
.btn-dark { background: var(--navy); color: white; }
.btn-danger { background: #fee4e2; color: var(--bad); }
.btn:disabled { cursor: not-allowed; opacity: .5; }
.actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.muted { color: var(--muted); }
.small { font-size: .88rem; }
.status { display: inline-flex; align-items: center; gap: 6px; padding: 5px 9px; border-radius: 999px; font-size: .82rem; font-weight: 750; background: #e9eef4; }
.status.signed, .status.closed, .status.ready { background: #dcfae6; color: var(--ok); }
.status.pending, .status.draft { background: #fff0d5; color: var(--warn); }
.status.in_signing { background: #dff1ff; color: #075985; }
.alert { padding: 12px 14px; border-radius: 9px; background: #eaf2f8; border: 1px solid #c9dbe8; }
.alert.error { background: #fff1f0; border-color: #f8c7c3; color: var(--bad); }
.alert.success { background: #e8f8ed; border-color: #bce6c8; color: var(--ok); }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 11px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
th { color: var(--muted); font-size: .82rem; text-transform: uppercase; letter-spacing: .04em; }
.signer-row { display: grid; grid-template-columns: 1.4fr 1fr 1.2fr 1fr auto; gap: 10px; margin-bottom: 10px; align-items: end; }
.section-title { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-bottom: 14px; }
.section-title h1, .section-title h2 { margin: 0; }
.login-logo { width: 72px; height: 72px; margin: 0 auto 18px; background: var(--brand); color: white; border-radius: 18px; display: grid; place-items: center; font-weight: 900; font-size: 1.4rem; }
.pdf-workspace { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 18px; align-items: start; }
.sidebar { position: sticky; top: 82px; max-height: calc(100vh - 100px); overflow: auto; }
.signer-tool { border: 2px solid transparent; border-radius: 10px; padding: 10px; margin-bottom: 9px; background: #f6f8fb; cursor: pointer; }
.signer-tool.selected { border-color: var(--brand); background: #fff7ed; }
.pdf-pages { display: grid; gap: 20px; justify-items: center; }
.pdf-page { position: relative; background: white; box-shadow: 0 8px 25px rgba(0,0,0,.15); touch-action: none; }
.pdf-page canvas { display: block; max-width: 100%; height: auto; }
.signature-box { position: absolute; min-width: 90px; min-height: 48px; border: 2px dashed var(--brand); background: rgba(255, 247, 237, .88); resize: both; overflow: hidden; border-radius: 6px; touch-action: none; }
.signature-box .box-head { background: rgba(16, 42, 67, .92); color: white; padding: 3px 6px; font-size: 11px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: move; }
.signature-box .box-body { padding: 5px; font-size: 10px; color: #334155; }
.preview-note { border-left: 4px solid var(--brand); padding-left: 10px; }
.doc-meta { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }
.meta-box { background: #f8fafc; border: 1px solid var(--line); border-radius: 10px; padding: 10px; }
.meta-box strong { display: block; font-size: .78rem; color: var(--muted); text-transform: uppercase; margin-bottom: 4px; }
.pdf-frame { width: 100%; min-height: 70vh; border: 1px solid var(--line); border-radius: 10px; background: white; }
.hash { word-break: break-all; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .78rem; }
.verify-hero { text-align: center; padding: 26px; }
.verify-icon { width: 74px; height: 74px; border-radius: 50%; display: grid; place-items: center; margin: 0 auto 12px; background: #dcfae6; color: var(--ok); font-size: 2rem; }
.signature-image-preview { max-width: 360px; max-height: 130px; object-fit: contain; display: none; border: 1px solid var(--line); background: white; padding: 8px; border-radius: 8px; }
hr { border: 0; border-top: 1px solid var(--line); margin: 20px 0; }
@media (max-width: 900px) {
  .grid-2, .grid-3, .doc-meta { grid-template-columns: 1fr; }
  .pdf-workspace { grid-template-columns: 1fr; }
  .sidebar { position: static; max-height: none; }
  .signer-row { grid-template-columns: 1fr; padding: 12px; border: 1px solid var(--line); border-radius: 10px; }
}
.qr-tool { border-style: dashed; }
.qr-placement-box { position:absolute; min-width:82px; min-height:82px; border:2px dashed #0f766e; background:rgba(236,253,245,.9); resize:both; overflow:hidden; border-radius:6px; touch-action:none; z-index:4; }
.qr-placement-box .qr-box-head { background:rgba(15,118,110,.94); color:white; padding:3px 6px; font-size:11px; font-weight:800; cursor:move; text-align:center; }
.qr-placement-box .qr-box-body { padding:7px 5px; font-size:10px; color:#134e4a; text-align:center; }
.fixed-box { resize: none !important; }
.signature-status-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:14px; }
.signature-status-card { border:1px solid var(--line); border-radius:12px; padding:14px; background:#fbfdff; min-width:0; }
.technical-details { margin-top:12px; border-top:1px solid var(--line); padding-top:10px; }
.technical-details summary { cursor:pointer; font-weight:750; color:#075985; margin-bottom:10px; }
.technical-details label { margin-top:10px; }
textarea { width:100%; min-height:92px; resize:vertical; border:1px solid #bdc8d4; border-radius:8px; padding:9px; font:12px/1.35 ui-monospace,SFMono-Regular,Menlo,monospace; word-break:break-all; }
code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; background:#eef2f6; padding:2px 5px; border-radius:4px; }
.text-error { color:var(--bad); }

/* v0.2.6: verificador priorizado y LF adaptativo/orientado */
.alert.warning { background:#fff7e6; border-color:#f2d39a; color:#7a4a00; }
.signature-status-card.signed-card { background:rgba(220,250,230,.58); border-color:#a8dfb8; }
.signature-status-card.pending-card { background:rgba(255,240,213,.58); border-color:#efd39d; }
.signature-status-card .signer-name { display:block; font-size:1.08rem; line-height:1.25; color:#102a43; }
.signer-directory-form { gap:12px; }
.signer-row-directory { grid-template-columns:minmax(260px,1.4fr) minmax(220px,1fr) minmax(210px,1fr) auto; align-items:end; padding:12px; border:1px solid var(--line); border-radius:12px; background:#fbfdff; }
.signer-row-directory .manual-signer-fields { display:grid; grid-template-columns:1.2fr .9fr 1.2fr; gap:10px; grid-column:1 / -2; }
.saved-signer-summary { padding:11px 12px; border-radius:9px; background:#eef5fb; border:1px solid #d2e2ef; min-height:48px; }
.row-inactive { opacity:.62; }
.nav-active { box-shadow:inset 0 -3px 0 var(--brand); }
@media (max-width:900px){.signer-row-directory{grid-template-columns:1fr}.signer-row-directory .manual-signer-fields{grid-template-columns:1fr;grid-column:auto}.signer-directory-form{grid-template-columns:1fr}}

.signer-tool.disabled { opacity:.62; cursor:not-allowed; }

.signature-certification-note{margin:4px 0 10px;padding:7px 9px;border-left:3px solid #3a9a63;background:rgba(220,250,230,.55);font-size:.83rem;color:#24583a;}

/* v0.2.7: visor con zoom para colocación precisa */
.pdf-workspace { min-width: 0; }
.pdf-viewer-column { min-width: 0; overflow: auto; max-height: calc(100vh - 92px); padding-bottom: 16px; }
.pdf-zoom-toolbar { position: sticky; top: 0; z-index: 25; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 10px; margin-bottom: 12px; background: rgba(244,247,250,.96); border: 1px solid var(--line); border-radius: 10px; backdrop-filter: blur(4px); }
.pdf-zoom-toolbar select { width: auto; min-width: 130px; padding: 8px 10px; }
.pdf-pages { width: max-content; min-width: 100%; }

/* v0.3.8: navegación consolidada y colocación visual de firma/QR */
.topbar { background: #0ea5e9; color: #082f49; }
.topbar .brand { color: #062d43; }
.topnav { justify-content: flex-end; }
.nav-link { appearance: none; border: 0; background: transparent; color: #083344; text-decoration: none; font-weight: 800; padding: 9px 8px; border-radius: 8px; line-height: 1; }
.nav-link:hover { background: rgba(255,255,255,.42); color: #082f49; }
.nav-link.nav-active { color: #7c2d12; box-shadow: inset 0 -3px 0 #f97316; background: rgba(255,255,255,.28); }
.nav-button { cursor: pointer; }
.user-chip { color: #083344; background: rgba(255,255,255,.45); padding: 7px 10px; border-radius: 999px; font-weight: 750; }
.documents-toolbar { display:grid; grid-template-columns:2fr 1fr 1fr; gap:12px; margin:14px 0; }
.user-form .password-fields { grid-column: 1 / -1; }
.input-action { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.checkbox-label { display:flex; gap:9px; align-items:flex-start; font-weight:600; }
.checkbox-label input { width:auto; margin-top:3px; }

.placement-instructions { padding:13px; border-radius:12px; background:#eff8ff; border:1px solid #b9dcf5; }
.placement-instructions ol { margin:9px 0 0; padding-left:20px; font-size:.9rem; line-height:1.55; }
.placement-legend { display:grid; gap:6px; margin:12px 0 18px; }
.legend-item { display:block; border-radius:8px; padding:7px 9px; font-size:.78rem; font-weight:800; border:1px solid transparent; }
.legend-item.pending { background:#fff4b8; border-color:#eab308; color:#713f12; }
.legend-item.saved { background:#ffedd5; border-color:#f97316; color:#7c2d12; }
.legend-item.signed { background:#dcfce7; border-color:#22c55e; color:#166534; }

.placement-tool { display:flex; gap:10px; align-items:center; border:2px solid; min-height:70px; transition:transform .15s ease,box-shadow .15s ease,background .15s ease; }
.placement-tool:not(.locked):hover { transform:translateY(-1px); box-shadow:0 7px 16px rgba(15,23,42,.12); }
.placement-tool .tool-icon { width:40px; height:40px; border-radius:10px; display:grid; place-items:center; flex:0 0 auto; font-weight:900; background:rgba(255,255,255,.72); border:1px solid rgba(15,23,42,.14); }
.placement-tool .tool-content { min-width:0; }
.placement-tool .tool-state { margin-top:4px; font-size:.8rem; font-weight:900; text-transform:uppercase; letter-spacing:.025em; }
.placement-tool.state-pending { background:#fff4b8; border-color:#eab308; color:#713f12; }
.placement-tool.state-saved { background:#ffedd5; border-color:#f97316; color:#7c2d12; }
.placement-tool.state-signed { background:#dcfce7; border-color:#22c55e; color:#166534; }
.placement-tool.selected { outline:4px solid rgba(234,179,8,.28); border-color:#a16207; box-shadow:0 0 0 2px #fff inset; }
.placement-tool.locked { cursor:not-allowed; }
.placement-tool.state-signed.locked { opacity:1; }
.active-tool-hint { margin-left:auto; padding:8px 10px; border-radius:8px; background:#eef2f7; color:#475569; font-size:.86rem; font-weight:700; }
.active-tool-hint.active { background:#fff4b8; color:#713f12; border:1px solid #eab308; }

.placement-visual { position:absolute; z-index:5; overflow:hidden; box-sizing:border-box; border:2px dashed transparent; border-radius:5px; touch-action:none; user-select:none; cursor:move; opacity:.84; background:rgba(255,255,255,.78); box-shadow:0 2px 6px rgba(15,23,42,.12); }
.placement-visual:hover { opacity:.96; outline:2px solid rgba(14,165,233,.65); }
.placement-visual.state-pending { border-color:#eab308; background:rgba(254,249,195,.78); }
.placement-visual.state-saved { border-color:#f97316; background:rgba(255,237,213,.76); }
.placement-visual.state-signed { border-color:#22c55e; background:rgba(220,252,231,.82); cursor:default; opacity:.92; }
.placement-ghost { z-index:15; pointer-events:none; opacity:.62; border:2px dashed #0ea5e9; background:rgba(224,242,254,.45); box-shadow:0 0 0 3px rgba(14,165,233,.15); }
.signature-box,.qr-placement-box { min-width:0; min-height:0; resize:none; }
.signature-preview { width:100%; height:100%; padding:0; display:flex; flex-direction:column; justify-content:center; align-items:stretch; color:#0f172a; line-height:1; text-align:right; overflow:hidden; box-sizing:border-box; font-family:Helvetica,Arial,sans-serif; }
.signature-preview-line { flex:0 0 auto; width:100%; line-height:1.22; white-space:nowrap; overflow:hidden; text-overflow:clip; text-align:right; }
.btn-success { background:#16a34a; border-color:#15803d; color:#fff; font-weight:900; box-shadow:0 4px 12px rgba(22,163,74,.22); }
.btn-success:hover:not(:disabled) { background:#15803d; }
.btn-success:disabled { background:#dcfce7; border-color:#86efac; color:#64748b; box-shadow:none; cursor:not-allowed; }
.compact-preview { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:clamp(6px,.9vw,9px); }
.lf-preview { justify-content:center; }
.qr-preview { width:100%; height:100%; padding:4px; display:grid; grid-template-rows:minmax(0,1fr) auto; place-items:center; gap:2px; color:#0f172a; font-size:clamp(6px,.8vw,9px); font-weight:800; text-align:center; }
.qr-preview img { width:100%; height:100%; min-height:0; object-fit:contain; image-rendering:pixelated; }
.collapsible-card { padding:0; }
.collapsible-summary { cursor:pointer; padding:18px 20px; font-size:1.15rem; font-weight:850; }
.collapsible-card > p,.collapsible-card > div { margin-left:20px; margin-right:20px; }
.collapsible-card > div:last-child { margin-bottom:20px; }

@media (max-width: 900px) {
  .topbar { align-items:flex-start; gap:10px; flex-direction:column; }
  .topnav { width:100%; justify-content:flex-start; overflow-x:auto; flex-wrap:nowrap; padding-bottom:3px; }
  .nav-link { white-space:nowrap; }
  .documents-toolbar { grid-template-columns:1fr; }
  .active-tool-hint { width:100%; margin-left:0; }
}

/* Visor público de documento firmado; compatible con v0.3.14 */
.signed-view-body { background:#e9eef4; min-height:100vh; }
.signed-view-topbar { position:sticky; top:0; z-index:40; }
.signed-view-actions { display:flex; gap:8px; align-items:center; }
.signed-view-shell { display:grid; grid-template-columns:minmax(0,1fr) 400px; min-height:calc(100vh - 66px); }
.signed-view-workspace { min-width:0; padding:16px; overflow:auto; }
.signed-view-toolbar { display:flex; justify-content:space-between; align-items:center; gap:14px; background:white; border:1px solid #dbe4ee; border-radius:12px; padding:12px 14px; margin-bottom:10px; box-shadow:0 3px 12px rgba(15,23,42,.06); }
.zoom-controls { display:flex; align-items:center; gap:6px; }
.zoom-controls select { width:auto; min-width:84px; padding:8px; }
.integrity-banner { padding:12px 14px; border-radius:10px; font-weight:800; margin-bottom:12px; border:1px solid; }
.integrity-banner.checking { background:#eef2ff; border-color:#818cf8; color:#3730a3; }
.integrity-banner.success { background:#dcfce7; border-color:#22c55e; color:#166534; }
.integrity-banner.warning { background:#fff7d6; border-color:#eab308; color:#713f12; }
.integrity-banner.error { background:#fee2e2; border-color:#ef4444; color:#991b1b; }
.signed-pdf-pages { display:flex; flex-direction:column; align-items:center; gap:18px; min-height:65vh; overflow:auto; padding:8px 4px 28px; }
.signed-pdf-page { position:relative; flex:0 0 auto; background:white; box-shadow:0 8px 24px rgba(15,23,42,.18); }
.signed-pdf-page canvas { display:block; }
.signed-field-overlay { position:absolute; z-index:5; border:2px solid transparent; background:transparent; padding:0; cursor:pointer; border-radius:5px; transition:background .15s,border-color .15s,box-shadow .15s; }
.signed-field-overlay:hover,.signed-field-overlay:focus-visible { border-color:#f59e0b; background:rgba(245,158,11,.10); box-shadow:0 0 0 4px rgba(245,158,11,.18); outline:none; }
.signed-field-overlay.active { border-color:#16a34a; background:rgba(22,163,74,.08); box-shadow:0 0 0 4px rgba(22,163,74,.16); }
.signed-field-overlay span { position:absolute; right:-9px; top:-9px; width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:#0f2a43; color:white; font-size:11px; font-weight:900; box-shadow:0 2px 6px rgba(15,23,42,.3); }
.signed-signature-panel { position:sticky; top:66px; height:calc(100vh - 66px); overflow:auto; background:white; border-left:1px solid #d7e0ea; padding:20px; box-shadow:-5px 0 18px rgba(15,23,42,.08); }
.signature-panel-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding-bottom:14px; border-bottom:1px solid #e2e8f0; }
.signature-panel-head h1 { font-size:1.25rem; margin:3px 0 0; color:#0f2a43; }
.eyebrow { color:#64748b; text-transform:uppercase; letter-spacing:.08em; font-size:.72rem; font-weight:900; }
.panel-close { display:none; border:0; background:transparent; font-size:30px; line-height:1; cursor:pointer; color:#64748b; }
.signed-signer-list { display:grid; gap:8px; margin:16px 0; }
.signed-signer-item { width:100%; display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:9px; text-align:left; border:1px solid #dbe4ee; background:#f8fafc; border-radius:10px; padding:9px; cursor:pointer; color:#0f172a; }
.signed-signer-item:hover,.signed-signer-item.active { border-color:#f59e0b; background:#fff8e7; }
.signed-signer-item small { display:block; color:#64748b; margin-top:2px; }
.signer-number { width:30px; height:30px; border-radius:50%; display:grid; place-items:center; background:#0f2a43; color:white; font-weight:900; }
.signature-validity { font-size:.68rem; font-weight:900; text-transform:uppercase; border-radius:999px; padding:4px 7px; white-space:nowrap; }
.signature-validity.valid { background:#dcfce7; color:#166534; }.signature-validity.warning { background:#fff7d6; color:#854d0e; }.signature-validity.invalid { background:#fee2e2; color:#991b1b; }
.signature-details-empty { padding:18px; border:1px dashed #94a3b8; border-radius:10px; color:#64748b; text-align:center; }
.signature-verdict { display:flex; gap:10px; align-items:center; border:1px solid; border-radius:11px; padding:12px; margin-bottom:14px; }
.signature-verdict.valid { background:#ecfdf5; color:#166534; border-color:#22c55e; }.signature-verdict.warning { background:#fffbeb; color:#854d0e; border-color:#f59e0b; }.signature-verdict.invalid { background:#fef2f2; color:#991b1b; border-color:#ef4444; }
.signature-verdict small { display:block; margin-top:3px; font-weight:500; }.verdict-icon { width:30px; height:30px; border-radius:50%; display:grid; place-items:center; background:currentColor; color:white; font-weight:900; }
.signature-detail-section { border:1px solid #e2e8f0; border-radius:10px; overflow:hidden; margin-bottom:12px; }
.signature-detail-section h2 { font-size:.9rem; margin:0; padding:9px 11px; background:#f1f5f9; color:#0f2a43; }
.signature-detail-row { display:grid; gap:4px; padding:9px 11px; border-top:1px solid #edf2f7; }
.signature-detail-row span { color:#64748b; font-size:.76rem; font-weight:700; }.signature-detail-row strong { font-size:.88rem; overflow-wrap:anywhere; }
.signed-view-error { position:fixed; left:50%; bottom:18px; transform:translateX(-50%); z-index:100; max-width:min(680px,90vw); }
@media (max-width:980px){
  .signed-view-shell { display:block; }.signed-view-workspace { padding:10px; }.signed-signature-panel { position:fixed; z-index:80; left:0; right:0; bottom:0; top:auto; height:min(78vh,720px); transform:translateY(105%); transition:transform .2s ease; border-left:0; border-top:1px solid #cbd5e1; border-radius:18px 18px 0 0; }
  .signed-signature-panel.open { transform:translateY(0); }.panel-close { display:block; }.signed-view-toolbar { align-items:flex-start; }.signature-validity { display:none; }
}
@media (max-width:620px){.signed-view-actions .btn { padding:8px 9px; font-size:.8rem; }.signed-view-toolbar { display:grid; }.signed-view-toolbar .zoom-controls { justify-content:flex-end; }.signed-pdf-pages { align-items:flex-start; }.signed-signer-item { grid-template-columns:32px minmax(0,1fr); }.signature-validity { display:none; }}

/* v0.3.13: página pública de acceso y sección Acerca de */
html { scroll-behavior: smooth; }
.landing-body { background:#f4f7fa; }
.landing-header {
  position:sticky;
  top:0;
  z-index:120;
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  padding:12px max(24px, calc((100vw - 1180px) / 2));
  color:#fff;
  background:rgba(16,42,67,.97);
  border-bottom:1px solid rgba(255,255,255,.12);
  box-shadow:0 8px 24px rgba(15,23,42,.16);
  backdrop-filter:blur(10px);
}
.landing-brand { display:flex; align-items:center; gap:11px; color:#fff; text-decoration:none; min-width:0; }
.landing-brand-mark { width:44px; height:44px; flex:0 0 44px; display:grid; place-items:center; border-radius:12px; background:var(--brand); font-weight:950; letter-spacing:-.03em; }
.landing-brand strong { display:block; font-size:1.08rem; letter-spacing:.02em; }
.landing-brand small { display:block; margin-top:1px; color:#cbd5e1; font-size:.72rem; font-weight:650; }
.landing-nav { display:flex; align-items:center; gap:7px; }
.landing-nav a { color:#e2e8f0; text-decoration:none; font-weight:800; padding:9px 12px; border-radius:9px; }
.landing-nav a:hover,.landing-nav a:focus-visible { background:rgba(255,255,255,.11); color:#fff; outline:none; }
.landing-nav .landing-nav-cta { background:var(--brand); color:#fff; }
.landing-nav .landing-nav-cta:hover { background:var(--brand-dark); }

.landing-hero {
  width:min(1180px, calc(100% - 36px));
  min-height:calc(100vh - 72px);
  margin:0 auto;
  padding:72px 0 66px;
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(340px,.75fr);
  gap:clamp(34px,6vw,82px);
  align-items:center;
  position:relative;
}
.landing-hero::before {
  content:"";
  position:absolute;
  z-index:-1;
  width:430px;
  height:430px;
  right:4%;
  top:6%;
  border-radius:50%;
  background:radial-gradient(circle, rgba(239,125,0,.17), rgba(239,125,0,0) 68%);
}
.landing-eyebrow { margin:0 0 10px; color:var(--brand-dark); font-size:.78rem; font-weight:950; text-transform:uppercase; letter-spacing:.13em; }
.landing-hero h1 { max-width:760px; margin:0; color:var(--navy); font-size:clamp(2.55rem,5.4vw,5.25rem); line-height:.94; letter-spacing:-.055em; }
.landing-subtitle { margin:22px 0 10px; color:#243b53; font-size:clamp(1.2rem,2.2vw,1.65rem); line-height:1.3; font-weight:850; }
.landing-lead { max-width:720px; margin:0; color:#526579; font-size:1.04rem; line-height:1.72; }
.landing-hero-actions { display:flex; gap:11px; flex-wrap:wrap; margin-top:27px; }
.landing-primary-action,.landing-secondary-action { padding:12px 17px; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; }
.landing-secondary-action { background:#fff; color:var(--navy); border:1px solid #cbd5e1; }
.landing-secondary-action:hover { background:#edf2f7; }
.landing-trust-row { display:flex; flex-wrap:wrap; gap:9px 16px; margin-top:24px; color:#334e68; font-size:.9rem; font-weight:800; }
.landing-trust-row span { display:inline-flex; align-items:center; gap:5px; }

.landing-login-card { scroll-margin-top:96px; padding:30px; border-top:5px solid var(--brand); box-shadow:0 18px 44px rgba(15,23,42,.13); }
.landing-login-card .login-logo { margin-bottom:15px; }
.landing-login-card h2 { margin:0 0 7px; text-align:center; color:var(--navy); font-size:1.55rem; }
.landing-login-card > p { margin:0 0 22px; text-align:center; line-height:1.5; }
.login-message { min-height:1px; margin-top:14px; }

.landing-section { padding:82px max(18px, calc((100vw - 1180px) / 2)); scroll-margin-top:70px; }
.landing-about { background:#fff; border-top:1px solid #e2e8f0; border-bottom:1px solid #e2e8f0; }
.landing-section-heading { max-width:760px; margin:0 auto 36px; text-align:center; }
.landing-section-heading h2 { margin:0; color:var(--navy); font-size:clamp(2rem,4vw,3.25rem); letter-spacing:-.035em; }
.landing-section-heading > p:last-child { margin:13px auto 0; color:#64748b; font-size:1.03rem; line-height:1.65; }
.feature-accordion { max-width:980px; margin:0 auto; display:grid; gap:13px; }
.feature-item { background:#f8fafc; border:1px solid #dbe4ee; border-radius:14px; overflow:hidden; transition:border-color .15s,box-shadow .15s,background .15s; }
.feature-item[open] { background:#fff; border-color:#f6b464; box-shadow:0 9px 24px rgba(15,23,42,.07); }
.feature-item summary { list-style:none; cursor:pointer; display:grid; grid-template-columns:48px minmax(0,1fr) 22px; align-items:center; gap:13px; padding:17px 19px; }
.feature-item summary::-webkit-details-marker { display:none; }
.feature-item summary::after { content:"+"; color:var(--brand); font-size:1.55rem; font-weight:800; line-height:1; text-align:center; }
.feature-item[open] summary::after { content:"−"; }
.feature-icon { width:46px; height:46px; display:grid; place-items:center; border-radius:12px; background:#102a43; color:#fff; font-size:.72rem; font-weight:950; letter-spacing:.04em; }
.feature-item summary strong { display:block; color:#172b4d; font-size:1.05rem; }
.feature-item summary small { display:block; margin-top:3px; color:#64748b; font-weight:600; }
.feature-content { padding:0 21px 20px 80px; color:#475569; line-height:1.65; }
.feature-content p { margin:0 0 10px; }
.feature-content ul { margin:8px 0 0; padding-left:19px; }
.feature-content li + li { margin-top:6px; }

.workflow-section { background:linear-gradient(180deg,#f4f7fa 0%,#edf2f7 100%); }
.workflow-grid { list-style:none; width:min(1180px,100%); margin:0 auto; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.workflow-step { position:relative; min-height:230px; padding:24px 20px 21px; background:#fff; border:1px solid #dbe4ee; border-radius:15px; box-shadow:0 7px 20px rgba(15,23,42,.055); }
.workflow-step:not(:last-child)::after { content:"→"; position:absolute; z-index:2; right:-14px; top:35px; width:28px; height:28px; border-radius:50%; display:grid; place-items:center; background:var(--brand); color:#fff; font-weight:950; box-shadow:0 4px 10px rgba(239,125,0,.3); }
.workflow-number { width:42px; height:42px; display:grid; place-items:center; border-radius:11px; background:#fff3e4; color:var(--brand-dark); font-size:1.1rem; font-weight:950; }
.workflow-step h3 { margin:18px 0 8px; color:var(--navy); font-size:1.08rem; }
.workflow-step p { margin:0; color:#64748b; line-height:1.58; font-size:.93rem; }

.landing-footer { min-height:88px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:22px max(24px, calc((100vw - 1180px) / 2)); background:#102a43; color:#cbd5e1; }
.landing-footer p { margin:0; font-size:.88rem; }
.landing-footer a { color:#fff; font-weight:800; text-decoration:none; }

@media (max-width:920px) {
  .landing-header { padding-left:18px; padding-right:18px; }
  .landing-hero { grid-template-columns:1fr; padding-top:52px; min-height:auto; }
  .landing-hero-copy { text-align:center; }
  .landing-lead { margin-left:auto; margin-right:auto; }
  .landing-hero-actions,.landing-trust-row { justify-content:center; }
  .landing-login-card { width:min(520px,100%); margin:0 auto; }
  .workflow-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .workflow-step:nth-child(2)::after { display:none; }
}
@media (max-width:620px) {
  .landing-header { position:static; align-items:flex-start; flex-direction:column; gap:11px; }
  .landing-nav { width:100%; overflow-x:auto; justify-content:flex-start; }
  .landing-nav a { white-space:nowrap; }
  .landing-brand small { display:none; }
  .landing-hero { width:min(100% - 28px,1180px); padding:44px 0 48px; gap:35px; }
  .landing-hero h1 { font-size:clamp(2.25rem,13vw,3.2rem); }
  .landing-login-card { padding:23px 18px; }
  .landing-section { padding:62px 14px; }
  .feature-item summary { grid-template-columns:42px minmax(0,1fr) 18px; padding:15px 13px; gap:10px; }
  .feature-icon { width:40px; height:40px; }
  .feature-content { padding:0 15px 17px; }
  .workflow-grid { grid-template-columns:1fr; }
  .workflow-step { min-height:0; }
  .workflow-step::after { display:none !important; }
  .landing-footer { flex-direction:column; align-items:flex-start; }
}