/* Colón & Asociados — hoja de estilos del sitio
   Concepto: firma de consultoría sobria. Azul marino institucional para bandas,
   azul del monograma CA como color de marca y dorado discreto solo para filetes y acentos.
   Tema claro deliberado (imagen corporativa); todos los colores salen de estos tokens. */
:root{
  --navy:#142B4A; --navy-2:#1C3A60; --brand:#3D4E82; --brand-strong:#2C3B6A; --brand-soft:#EAEEF7;
  --gold:#C8A96B; --gold-ink:#8A6A2C; --gold-soft:#F6F0E3;
  --bg:#FFFFFF; --bg-alt:#F3F6F9; --surface:#FFFFFF; --ink:#142B4A; --text:#334155; --muted:#5B6678; --line:#DDE3EA;
  --on-navy:#F3F6F9; --on-navy-muted:#B8C4D6; --on-navy-line:rgba(243,246,249,.18);
  --ok:#2F7A55; --warn:#A8641B; --error:#B42318; --wa:#1F8F4E;
  --f-display:"Libre Caslon Text", "Times New Roman", Georgia, serif;
  --f-body:"Public Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --f-mono:"IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --r:6px; --wrap:1180px;
  --shadow:0 1px 2px rgba(20,43,74,.06), 0 6px 20px rgba(20,43,74,.07);
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:88px; -webkit-text-size-adjust:100%}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} *{transition:none!important; animation:none!important} }
body{margin:0; background:var(--bg); color:var(--text); font-family:var(--f-body); font-size:16.5px; line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden}
body::before{content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top,0px); z-index:60; background:var(--surface)}
img{max-width:100%; height:auto}
[hidden]{display:none!important}
a{color:var(--brand); text-underline-offset:3px}
a:hover{color:var(--brand-strong)}
h1,h2,h3,h4{font-family:var(--f-display); font-weight:400; line-height:1.2; text-wrap:balance; margin:0; color:var(--ink)}
h1{font-size:clamp(2rem, 1.3rem + 3vw, 3.3rem)}
h2{font-size:clamp(1.7rem, 1.2rem + 1.8vw, 2.45rem)}
h3{font-size:1.22rem}
p{margin:0}
ul,ol{margin:0}
.wrap{max-width:var(--wrap); margin:0 auto; padding-left:max(16px, env(safe-area-inset-left,0px)); padding-right:max(16px, env(safe-area-inset-right,0px))}
@media (min-width:720px){ .wrap{padding-left:max(28px, env(safe-area-inset-left,0px)); padding-right:max(28px, env(safe-area-inset-right,0px))} }
.narrow{max-width:780px}
.skip{position:absolute; left:-9999px; top:8px; z-index:100; background:var(--navy); color:#fff; padding:10px 14px; border-radius:var(--r)}
.skip:focus{left:12px}
:focus-visible{outline:3px solid var(--brand); outline-offset:3px}
.eyebrow{display:inline-flex; align-items:center; gap:10px; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; font-weight:600; color:var(--brand)}
.eyebrow::before{content:""; width:28px; height:1px; background:var(--gold)}
.lede{color:var(--muted); font-size:1.1rem; max-width:64ch}
section{padding-block:clamp(56px, 8vw, 100px)}
.alt{background:var(--bg-alt)}
.sec-head{display:grid; gap:14px; margin-bottom:40px; max-width:780px}
.sec-head.row{max-width:none; grid-template-columns:1fr auto; align-items:end; gap:20px}
@media (max-width:720px){ .sec-head.row{grid-template-columns:1fr} }
.svg-i{width:22px; height:22px; flex:none}

/* Botones */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:9px; font:600 .98rem/1.1 var(--f-body); padding:14px 22px; border-radius:var(--r); text-decoration:none; border:1.5px solid transparent; cursor:pointer; transition:background .2s, color .2s, border-color .2s; min-height:48px; text-align:center}
.btn .svg-i{width:18px; height:18px}
.btn-primary{background:var(--brand); color:#fff}
.btn-primary:hover{background:var(--brand-strong); color:#fff}
.btn-gold{background:var(--gold); color:var(--navy)}
.btn-gold:hover{background:#D6BC86; color:var(--navy)}
.btn-ghost{border-color:var(--line); color:var(--ink); background:var(--surface)}
.btn-ghost:hover{border-color:var(--brand); color:var(--brand)}
.btn-light{border-color:var(--on-navy-line); color:var(--on-navy); background:transparent}
.btn-light:hover{border-color:var(--gold); color:#fff}
.btn-wa{background:var(--wa); color:#fff}
.btn-wa:hover{background:#187A41; color:#fff}
.link-arrow{display:inline-flex; align-items:center; gap:6px; font-weight:600; text-decoration:none}
.link-arrow .svg-i{width:16px; height:16px; transition:transform .2s}
.link-arrow:hover .svg-i{transform:translateX(3px)}

/* Encabezado */
.topbar{position:sticky; top:env(safe-area-inset-top,0px); z-index:50; background:rgba(255,255,255,.96); backdrop-filter:saturate(1.4) blur(10px); border-bottom:1px solid var(--line)}
.topbar .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; height:76px}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--ink); min-width:0}
.brand img{width:48px; height:auto; display:block}
.brand-text{display:grid; line-height:1.1}
.brand-name{font-family:var(--f-display); font-size:1.12rem; letter-spacing:.06em; white-space:nowrap; color:var(--ink)}
.brand-sub{font-size:.6rem; letter-spacing:.3em; text-transform:uppercase; color:var(--muted); white-space:nowrap; margin-top:3px}
.nav{display:flex; align-items:center; gap:2px}
.nav a{color:var(--ink); text-decoration:none; font-weight:500; font-size:.94rem; padding:10px 11px; border-radius:var(--r); position:relative}
.nav a:hover{color:var(--brand); background:var(--brand-soft)}
.nav a[aria-current="page"]{color:var(--brand)}
.nav a[aria-current="page"]::after{content:""; position:absolute; left:11px; right:11px; bottom:4px; height:2px; background:var(--gold)}
.nav a.btn{margin-left:10px; color:#fff; padding:11px 18px; min-height:44px; font-size:.92rem}
.nav a.btn:hover{background:var(--brand-strong); color:#fff}
.menu-btn{display:none; width:46px; height:46px; border-radius:var(--r); border:1px solid var(--line); background:var(--surface); color:var(--ink); cursor:pointer; align-items:center; justify-content:center}
@media (max-width:1060px){
  .menu-btn{display:inline-flex}
  .nav{position:fixed; top:calc(76px + env(safe-area-inset-top,0px)); left:0; right:0; max-height:calc(100dvh - 76px); overflow:auto; flex-direction:column; align-items:stretch; gap:0; background:var(--surface); border-bottom:1px solid var(--line); box-shadow:var(--shadow); padding:8px max(16px, env(safe-area-inset-right,0px)) 20px max(16px, env(safe-area-inset-left,0px)); transform:translateY(-8px); opacity:0; visibility:hidden; transition:opacity .2s, transform .2s, visibility .2s}
  .nav.open{transform:none; opacity:1; visibility:visible}
  .nav a{padding:15px 10px; font-size:1.04rem; border-bottom:1px solid var(--line); border-radius:0}
  .nav a[aria-current="page"]::after{left:0; right:auto; top:14px; bottom:14px; width:3px; height:auto}
  .nav a.btn{margin:14px 0 0; border-radius:var(--r); border-bottom:0; justify-content:center}
}
@media (max-width:420px){ .brand-sub{letter-spacing:.18em} .brand-name{font-size:1rem} .brand img{width:42px} }

/* Hero */
.hero{background:var(--navy); color:var(--on-navy); position:relative; overflow:hidden; padding-block:clamp(52px, 8vw, 104px)}
.hero::before{content:""; position:absolute; inset:0; background:repeating-linear-gradient(0deg, transparent 0 39px, rgba(200,169,107,.07) 39px 40px); pointer-events:none}
.hero .wrap{position:relative; display:grid; grid-template-columns:1.08fr .92fr; gap:clamp(32px, 5vw, 72px); align-items:center}
.hero-copy{display:grid; gap:22px; min-width:0}
.hero h1{color:#fff; letter-spacing:-.005em}
.hero .eyebrow{color:var(--gold)}
.hero .lede{color:var(--on-navy-muted); font-size:1.14rem}
.hero-ctas{display:flex; flex-wrap:wrap; gap:12px; margin-top:4px}
.hero-facts{display:flex; flex-wrap:wrap; gap:10px 24px; color:var(--on-navy-muted); font-size:.92rem; padding:0; list-style:none}
.hero-facts li{display:inline-flex; align-items:center; gap:8px}
.hero-facts .svg-i{width:18px; height:18px; color:var(--gold)}
.hero-media{min-width:0}
.hero-photo{border-radius:var(--r); overflow:hidden; box-shadow:0 20px 50px rgba(0,0,0,.35); aspect-ratio:4/3; background:var(--navy-2)}
.hero-photo img{width:100%; height:100%; object-fit:cover; display:block}
@media (max-width:920px){ .hero .wrap{grid-template-columns:1fr} }
@media (max-width:480px){ .hero-ctas .btn{flex:1 1 100%} }
.page-hero{background:var(--navy); color:var(--on-navy); padding-block:clamp(40px, 6vw, 72px)}
.page-hero h1{color:#fff; font-size:clamp(1.9rem, 1.3rem + 2.4vw, 2.9rem)}
.page-hero .lede{color:var(--on-navy-muted); margin-top:14px}
.page-hero .eyebrow{color:var(--gold); margin-bottom:12px}
.crumbs{font-size:.86rem; margin-bottom:18px; color:var(--on-navy-muted)}
.crumbs ol{list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:6px}
.crumbs li+li::before{content:"/"; margin-right:6px; opacity:.6}
.crumbs a{color:var(--on-navy); text-decoration:none}
.crumbs a:hover{text-decoration:underline; color:#fff}

/* Estado financiero ilustrativo */
.ledger{background:var(--surface); color:var(--text); border:1px solid var(--line); border-radius:var(--r); box-shadow:0 20px 50px rgba(0,0,0,.28); padding:26px 26px 20px; min-width:0; max-width:520px; justify-self:center; width:100%; margin:0}
.ledger-head{display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px 12px; align-items:flex-start; border-bottom:2px solid var(--ink); padding-bottom:12px; margin-bottom:6px}
.ledger-head b{font-family:var(--f-display); font-weight:400; font-size:1.15rem; display:block; color:var(--ink)}
.ledger-head small{color:var(--muted); font-size:.8rem}
.tag{font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; font-weight:600; color:var(--brand); background:var(--brand-soft); padding:5px 9px; border-radius:3px; white-space:nowrap}
.ledger table{width:100%; border-collapse:collapse; font-size:.92rem}
.ledger td{padding:9px 0; border-bottom:1px solid var(--line)}
.ledger td.n{text-align:right; font-family:var(--f-mono); font-variant-numeric:tabular-nums; white-space:nowrap; padding-left:12px; color:var(--ink)}
.ledger tr.sub td{color:var(--muted); font-size:.85rem; padding-left:12px}
.ledger tr.total td{font-weight:700; border-bottom:3px double var(--ink); color:var(--ink)}
.ledger .note{font-size:.76rem; color:var(--muted); margin-top:16px; display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap}
.stamp{transform:rotate(-6deg); border:2px solid var(--ok); color:var(--ok); font:600 .72rem/1.15 var(--f-body); letter-spacing:.14em; text-transform:uppercase; padding:7px 12px; border-radius:4px; text-align:center; opacity:.85}
.stamp b{display:block; font-size:.95rem; letter-spacing:.08em}
@media (max-width:480px){ .ledger{padding:20px 18px 18px} }

/* Tarjetas de servicio */
.grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px}
.grid.two{grid-template-columns:repeat(2, minmax(0,1fr))}
.grid.four{grid-template-columns:repeat(4, minmax(0,1fr))}
@media (max-width:1000px){ .grid, .grid.four{grid-template-columns:repeat(2, minmax(0,1fr))} }
@media (max-width:640px){ .grid, .grid.two, .grid.four{grid-template-columns:1fr} }
.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:26px; display:flex; flex-direction:column; gap:12px; transition:border-color .2s, box-shadow .2s; position:relative; min-width:0}
.card:hover{border-color:#C3CCDA; box-shadow:var(--shadow)}
.card .ic{width:46px; height:46px; border-radius:var(--r); background:var(--brand-soft); color:var(--brand); display:grid; place-items:center}
.card h3 a{color:inherit; text-decoration:none}
.card h3 a::after{content:""; position:absolute; inset:0}
.card p{color:var(--muted); font-size:.96rem}
.card .link-arrow{margin-top:auto; padding-top:6px; position:relative}
.card.svc{border-top:3px solid var(--navy)}
.card.svc:hover{border-top-color:var(--gold)}
.meta-line{display:flex; flex-wrap:wrap; gap:6px 14px; font-size:.82rem; color:var(--muted)}
.meta-line .cat{color:var(--brand); font-weight:600; text-transform:uppercase; letter-spacing:.08em; font-size:.74rem}

/* Firma */
.firm{display:grid; grid-template-columns:.95fr 1.05fr; gap:clamp(32px,5vw,72px); align-items:start}
.firm > *{min-width:0}
@media (max-width:920px){ .firm{grid-template-columns:1fr} }
.pillars{display:grid; gap:0; border-top:1px solid var(--line)}
.pillar{display:grid; grid-template-columns:44px 1fr; gap:16px; padding:20px 0; border-bottom:1px solid var(--line)}
.pillar .ic{width:44px; height:44px; border-radius:var(--r); background:var(--gold-soft); color:var(--gold-ink); display:grid; place-items:center}
.pillar p{color:var(--muted); font-size:.95rem; margin-top:4px}
.pending{border:1.5px dashed #C9B07C; background:var(--gold-soft); color:var(--gold-ink); border-radius:var(--r); padding:12px 14px; font-size:.86rem; margin-top:8px; color:#6E5420}
.pending b{color:#6E5420}

/* Biblioteca destacada */
.lib-band{background:var(--navy); color:var(--on-navy); position:relative; overflow:hidden}
.lib-band::before{content:""; position:absolute; inset:0 0 auto; height:3px; background:var(--gold)}
.lib-band h2{color:#fff}
.lib-band .eyebrow{color:var(--gold)}
.lib-band .lede{color:var(--on-navy-muted)}
.searchbox{display:flex; gap:10px; max-width:760px; margin-top:28px; flex-wrap:wrap}
.searchbox label{position:absolute; left:-9999px}
.searchbox input{flex:1 1 280px; min-width:0; font:400 1.05rem var(--f-body); padding:15px 16px; border-radius:var(--r); border:1px solid var(--line); background:#fff; color:var(--ink); min-height:52px}
.searchbox input:focus{outline:3px solid var(--gold); outline-offset:1px}
.searchbox .btn{min-height:52px}
.lib-cats{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; margin-top:36px}
@media (max-width:1000px){ .lib-cats{grid-template-columns:repeat(2, minmax(0,1fr))} }
@media (max-width:520px){ .lib-cats{grid-template-columns:1fr} }
.lib-cat{display:flex; align-items:center; gap:14px; padding:16px 18px; border:1px solid var(--on-navy-line); border-radius:var(--r); color:var(--on-navy); text-decoration:none; transition:border-color .2s, background .2s; min-width:0}
.lib-cat:hover{border-color:var(--gold); background:rgba(255,255,255,.04); color:#fff}
.lib-cat .svg-i{color:var(--gold)}
.lib-cat b{display:block; font-weight:600; font-size:.97rem}
.lib-cat small{color:var(--on-navy-muted); font-size:.8rem}
.lib-band .foot{display:flex; flex-wrap:wrap; gap:16px 24px; align-items:center; margin-top:32px}
.lib-band .foot p{color:var(--on-navy-muted); font-size:.86rem; max-width:60ch}

/* CTA */
.cta-band{background:var(--bg-alt); border-top:1px solid var(--line)}
.cta{display:grid; grid-template-columns:1fr auto; gap:28px; align-items:center; background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--gold); border-radius:var(--r); padding:clamp(26px,4vw,44px)}
.cta p{color:var(--muted); margin-top:10px; max-width:60ch}
@media (max-width:760px){ .cta{grid-template-columns:1fr} }

/* Calendario fiscal (sin cambios de lógica) */
.panel{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:26px}
.panel h3{margin-bottom:6px}
.panel > p{color:var(--muted); font-size:.93rem; margin-bottom:18px}
.tax-grid{display:grid; grid-template-columns:1fr 1fr; gap:22px; align-items:start}
@media (max-width:900px){ .tax-grid{grid-template-columns:1fr} }
.tax-grid > *{min-width:0}
.laws{list-style:none; padding:0; margin:0; display:grid}
.laws li{display:grid; grid-template-columns:110px 1fr; gap:14px; padding:12px 0; border-top:1px solid var(--line); font-size:.93rem}
.laws li:first-child{border-top:0}
.laws b{font-family:var(--f-mono); font-weight:500; color:var(--brand); font-size:.86rem}
@media (max-width:440px){ .laws li{grid-template-columns:1fr; gap:2px} }
.next{display:flex; gap:16px; align-items:center; background:var(--navy); color:#fff; border-radius:var(--r); padding:16px 18px; margin-bottom:14px}
.next .days{font-family:var(--f-display); font-size:2.4rem; line-height:1; min-width:2ch; text-align:center; color:var(--gold)}
.next small{display:block; opacity:.85; font-size:.8rem; letter-spacing:.06em; text-transform:uppercase}
.next b{display:block; font-size:1.02rem}
.cal{list-style:none; margin:0; padding:0; display:grid}
.cal li{display:grid; grid-template-columns:66px 1fr auto; gap:14px; align-items:center; padding:12px 0; border-top:1px solid var(--line)}
.cal .date{font-family:var(--f-mono); font-variant-numeric:tabular-nums; text-align:center; border:1px solid var(--line); border-radius:var(--r); padding:6px 0; line-height:1.15; color:var(--ink)}
.cal .date b{display:block; font-size:1.2rem; font-weight:500}
.cal .date small{font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted)}
.cal .what b{display:block; font-size:.95rem; color:var(--ink)}
.cal .what span{font-size:.84rem; color:var(--muted)}
.pill{font-size:.75rem; font-weight:600; padding:5px 10px; border-radius:999px; white-space:nowrap; background:var(--brand-soft); color:var(--brand)}
.pill.soon{background:#F8ECDD; color:#874B10}
.cal-note{font-size:.8rem; color:var(--muted); margin-top:12px}
@media (max-width:440px){ .cal li{grid-template-columns:58px 1fr} .cal .pill{grid-column:2; justify-self:start} }

/* NIIF comparación */
.toggle{display:inline-flex; background:var(--bg-alt); border:1px solid var(--line); border-radius:var(--r); padding:4px; margin-bottom:18px; flex-wrap:wrap}
.toggle button{font:600 .9rem var(--f-body); border:0; background:transparent; color:var(--muted); padding:10px 16px; border-radius:4px; cursor:pointer; min-height:42px}
.toggle button[aria-selected="true"]{background:var(--brand); color:#fff}
.compare{border:1px solid var(--line); border-radius:var(--r); overflow:hidden}
.compare dl{margin:0; display:grid}
.compare .row{display:grid; grid-template-columns:minmax(120px, .8fr) 1.4fr; border-bottom:1px solid var(--line)}
.compare .row:last-child{border-bottom:0}
.compare dt, .compare dd{margin:0; padding:14px 18px}
.compare dt{font-weight:600; font-size:.88rem; color:var(--muted); background:var(--bg-alt)}
.compare dd{font-size:.95rem}
@media (max-width:520px){ .compare .row{grid-template-columns:1fr} .compare dt{padding-bottom:6px} .compare dd{padding-top:6px} }

/* Contenido largo (servicios, artículos, legales) */
.content-grid{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:clamp(28px,4vw,56px); align-items:start}
@media (max-width:960px){ .content-grid{grid-template-columns:1fr} }
.prose{max-width:72ch; min-width:0}
.prose > * + *{margin-top:1.05em}
.prose h2{font-size:1.65rem; margin-top:1.8em}
.prose h3{font-size:1.25rem; margin-top:1.5em}
.prose ul, .prose ol{padding-left:1.3em}
.prose li + li{margin-top:.4em}
.prose table{width:100%; border-collapse:collapse; font-size:.94rem}
.prose th, .prose td{text-align:left; padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:top}
.prose th{background:var(--bg-alt); color:var(--ink); font-weight:600}
.table-scroll{overflow-x:auto}
.checks{list-style:none; padding:0!important; display:grid; gap:10px}
.checks li{display:grid; grid-template-columns:24px 1fr; gap:10px; margin:0!important}
.checks .svg-i{width:20px; height:20px; color:var(--ok); margin-top:3px}
.aside{display:grid; gap:18px; position:sticky; top:100px}
@media (max-width:960px){ .aside{position:static} }
.box{border:1px solid var(--line); border-radius:var(--r); padding:22px; background:var(--surface)}
.box h3{font-size:1.1rem; margin-bottom:10px}
.box p{color:var(--muted); font-size:.93rem}
.box.navy{background:var(--navy); border-color:var(--navy); color:var(--on-navy)}
.box.navy h3{color:#fff}
.box.navy p{color:var(--on-navy-muted)}
.box ul{list-style:none; padding:0; display:grid; gap:8px; font-size:.93rem}
.notice{border-left:4px solid var(--gold); background:var(--gold-soft); padding:14px 18px; border-radius:0 var(--r) var(--r) 0; color:#5F4A1F; font-size:.92rem}
.notice.draft{border-left-color:var(--warn); background:#FBEFE3; color:#6B3E0E}
.steps{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); border-top:2px solid var(--navy)}
.step{padding:22px 22px 0 0; display:grid; gap:8px; align-content:start}
.step + .step{padding-left:22px; border-left:1px solid var(--line)}
.step .num{font-family:var(--f-mono); color:var(--gold-ink); font-size:.85rem}
.step p{color:var(--muted); font-size:.94rem}
@media (max-width:900px){ .steps{grid-template-columns:1fr 1fr} .step:nth-child(3){padding-left:0; border-left:0} .step{padding-bottom:22px} }
@media (max-width:540px){ .steps{grid-template-columns:1fr} .step, .step + .step{padding-left:0; border-left:0; border-bottom:1px solid var(--line)} }
.values{display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:18px}
@media (max-width:1000px){ .values{grid-template-columns:repeat(3, minmax(0,1fr))} }
@media (max-width:700px){ .values{grid-template-columns:1fr 1fr} }
@media (max-width:440px){ .values{grid-template-columns:1fr} }
.value{border-top:2px solid var(--gold); padding-top:16px; display:grid; gap:8px; align-content:start}
.value .svg-i{color:var(--brand)}
.value p{color:var(--muted); font-size:.93rem}

/* FAQ */
.faq{display:grid; gap:10px}
.faq details{background:var(--surface); border:1px solid var(--line); border-radius:var(--r)}
.faq summary{cursor:pointer; list-style:none; padding:18px 20px; font-weight:600; color:var(--ink); display:flex; justify-content:space-between; gap:16px; align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; font:400 1.5rem/1 var(--f-body); color:var(--gold-ink); transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 20px 18px; color:var(--muted)}

/* Formularios */
.form{background:var(--bg-alt); border:1px solid var(--line); border-radius:var(--r); padding:clamp(20px,3vw,32px); display:grid; gap:16px}
.frow{display:grid; grid-template-columns:1fr 1fr; gap:16px}
@media (max-width:560px){ .frow{grid-template-columns:1fr} }
.field{display:grid; gap:6px; min-width:0; align-content:start}
label{font-weight:600; font-size:.9rem; color:var(--ink)}
label .opt{color:var(--muted); font-weight:400}
input, select, textarea{font:400 1rem var(--f-body); color:var(--ink); background:#fff; border:1px solid #C9D1DC; border-radius:var(--r); padding:12px 14px; width:100%; min-height:48px}
textarea{min-height:130px; resize:vertical}
input:focus, select:focus, textarea:focus{outline:none; border-color:var(--brand); box-shadow:0 0 0 3px rgba(61,78,130,.2)}
.field.err input, .field.err select, .field.err textarea{border-color:var(--error)}
.errmsg{color:var(--error); font-size:.84rem}
.errmsg:empty{display:none}
.consent{display:grid; grid-template-columns:22px 1fr; gap:10px; align-items:start; font-weight:400; font-size:.88rem; color:var(--text)}
.consent input{width:20px; height:20px; min-height:0; margin-top:2px}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.form-foot{display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between}
.form-foot small{color:var(--muted); font-size:.84rem; max-width:44ch}
.status{border-radius:var(--r); padding:14px 16px; font-size:.94rem; display:grid; gap:10px}
.status.ok{border:1px solid #A9D3BC; background:#EEF8F2; color:#1E5A3C}
.status.bad{border:1px solid #F0B4AE; background:#FDF0EF; color:#7A1D14}
.cinfo{display:grid; gap:16px; margin-top:24px}
.cinfo .item{display:grid; grid-template-columns:44px 1fr; gap:14px; align-items:center}
.cinfo .ic{width:44px; height:44px; border-radius:var(--r); background:var(--brand-soft); color:var(--brand); display:grid; place-items:center}
.cinfo small{display:block; color:var(--muted); font-size:.8rem}
.cinfo a, .cinfo .v{color:var(--ink); font-weight:600; text-decoration:none}
.cinfo a:hover{color:var(--brand)}
.chipbtn{margin-left:8px; font:600 .78rem var(--f-body); border:1px solid var(--line); background:#fff; color:var(--ink); padding:6px 10px; border-radius:4px; cursor:pointer; text-decoration:none; display:inline-block}
.chipbtn:hover{border-color:var(--brand); color:var(--brand)}

/* Biblioteca: catálogo */
.lib-layout{display:grid; grid-template-columns:270px minmax(0,1fr); gap:32px; align-items:start}
@media (max-width:960px){ .lib-layout{grid-template-columns:1fr} }
.filters{border:1px solid var(--line); border-radius:var(--r); background:var(--surface); position:sticky; top:96px}
@media (max-width:960px){ .filters{position:static} }
.filters summary{list-style:none; cursor:pointer; padding:14px 18px; font-weight:600; color:var(--ink); display:flex; justify-content:space-between; align-items:center}
.filters summary::-webkit-details-marker{display:none}
.filters summary::after{content:"▾"; color:var(--muted)}
.filters[open] summary::after{content:"▴"}
@media (min-width:961px){ .filters summary{pointer-events:none} .filters summary::after{content:""} }
.filters .inner{padding:0 18px 18px; display:grid; gap:14px}
.filters select{min-height:44px; padding:9px 12px; font-size:.94rem}
.filters .reset{background:none; border:0; color:var(--brand); font:600 .9rem var(--f-body); cursor:pointer; padding:8px 0; text-align:left}
.results-head{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; margin-bottom:16px}
.results-head p{color:var(--muted); font-size:.94rem}
.results-head select{width:auto; min-height:42px; padding:8px 12px; font-size:.92rem}
.doclist{list-style:none; padding:0; margin:0; display:grid; gap:12px}
.doc{border:1px solid var(--line); border-radius:var(--r); padding:18px 20px; background:var(--surface); display:grid; gap:8px; position:relative; min-width:0}
.doc:hover{border-color:#C3CCDA; box-shadow:var(--shadow)}
.doc h3{font-size:1.1rem}
.doc h3 a{color:var(--ink); text-decoration:none}
.doc h3 a::after{content:""; position:absolute; inset:0}
.doc h3 a:hover{color:var(--brand)}
.doc p{color:var(--muted); font-size:.93rem}
.badges{display:flex; flex-wrap:wrap; gap:6px}
.badge{font-size:.74rem; font-weight:600; padding:4px 9px; border-radius:3px; background:var(--bg-alt); color:var(--text); border:1px solid var(--line); white-space:nowrap}
.badge.type{background:var(--brand-soft); color:var(--brand); border-color:transparent}
.badge.status-unverified{background:#FBF3E4; color:#7A5514; border-color:#EBD7B0}
.badge.status-ok{background:#EEF8F2; color:#1E5A3C; border-color:#BFE0CC}
.badge.status-bad{background:#FDF0EF; color:#7A1D14; border-color:#F0B4AE}
.badge.own{background:var(--navy); color:#fff; border-color:var(--navy)}
.badge.secondary{background:#fff; color:var(--muted)}
.pager{display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-top:24px}
.pager button{min-width:44px; min-height:44px; border:1px solid var(--line); background:#fff; border-radius:var(--r); font:600 .92rem var(--f-body); color:var(--ink); cursor:pointer; padding:0 12px}
.pager button[aria-current="page"]{background:var(--brand); color:#fff; border-color:var(--brand)}
.pager button:disabled{opacity:.45; cursor:default}
.empty{border:1px dashed #C9D1DC; border-radius:var(--r); padding:28px; text-align:center; color:var(--muted)}
.catgrid{display:grid; grid-template-columns:repeat(auto-fill, minmax(208px, 1fr)); gap:14px}
.catcard{display:grid; grid-template-columns:44px 1fr; gap:14px; padding:18px; border:1px solid var(--line); border-radius:var(--r); text-decoration:none; color:var(--text); background:var(--surface); transition:border-color .2s, box-shadow .2s}
.catcard:hover{border-color:var(--brand); box-shadow:var(--shadow)}
.catcard .ic{width:44px; height:44px; border-radius:var(--r); background:var(--brand-soft); color:var(--brand); display:grid; place-items:center}
.catcard b{display:block; color:var(--ink); font-weight:600}
.catcard small{color:var(--muted); font-size:.83rem; line-height:1.45; display:block; margin-top:2px}
.catcard .count{font-family:var(--f-mono); font-size:.78rem; color:var(--gold-ink); margin-top:6px; display:block}
.metatable{width:100%; border-collapse:collapse; font-size:.94rem}
.metatable th{width:38%; text-align:left; font-weight:600; color:var(--muted); padding:11px 14px 11px 0; border-bottom:1px solid var(--line); vertical-align:top}
.metatable td{padding:11px 0; border-bottom:1px solid var(--line); color:var(--ink); word-break:break-word}
@media (max-width:520px){ .metatable th, .metatable td{display:block; width:auto; padding:6px 0} .metatable th{border-bottom:0; padding-top:12px} }
.actions{display:flex; flex-wrap:wrap; gap:12px}

/* Pie */
footer.site{background:var(--navy); color:var(--on-navy-muted); padding-block:56px 28px; font-size:.92rem}
footer.site .cols{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px}
@media (max-width:900px){ footer.site .cols{grid-template-columns:1fr 1fr} }
@media (max-width:520px){ footer.site .cols{grid-template-columns:1fr} }
footer.site .brand{color:#fff}
footer.site .brand-name{color:#fff}
footer.site .brand-sub{color:var(--on-navy-muted)}
footer.site h2{font:600 .78rem/1.2 var(--f-body); letter-spacing:.14em; text-transform:uppercase; color:var(--gold); margin-bottom:14px}
footer.site ul{list-style:none; padding:0; display:grid; gap:9px}
footer.site a{color:var(--on-navy); text-decoration:none}
footer.site a:hover{color:#fff; text-decoration:underline}
footer.site .about{margin-top:16px; max-width:38ch}
footer.site .bottom{border-top:1px solid var(--on-navy-line); margin-top:40px; padding-top:20px; display:flex; flex-wrap:wrap; gap:10px 24px; justify-content:space-between}
footer.site .legal{display:flex; flex-wrap:wrap; gap:6px 18px}

/* Flotantes */
.fab{position:fixed; right:calc(18px + env(safe-area-inset-right,0px)); bottom:calc(18px + env(safe-area-inset-bottom,0px)); z-index:40; width:58px; height:58px; border-radius:50%; background:var(--wa); color:#fff; display:grid; place-items:center; box-shadow:0 8px 24px rgba(0,0,0,.25); text-decoration:none; transition:transform .2s}
.fab:hover{transform:scale(1.06); color:#fff}
.fab svg{width:28px; height:28px}
.toast{position:fixed; left:50%; bottom:calc(24px + env(safe-area-inset-bottom,0px)); transform:translateX(-50%); background:var(--navy); color:#fff; padding:10px 18px; border-radius:var(--r); font-size:.9rem; z-index:70}
.center{text-align:center}
.mt-0{margin-top:0}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}

/* ---- Biblioteca académica (v3) ---- */
.lib-subnav{background:var(--surface); border-bottom:1px solid var(--line)}
.lib-subnav .wrap{display:flex; gap:4px; overflow-x:auto; scrollbar-width:thin}
.lib-subnav a{flex:none; padding:14px 14px 12px; font-weight:600; font-size:.92rem; color:var(--ink); text-decoration:none; border-bottom:3px solid transparent; white-space:nowrap}
.lib-subnav a:hover{color:var(--brand)}
.lib-subnav a[aria-current="page"]{color:var(--brand); border-bottom-color:var(--gold)}
.mission-strip{margin-top:24px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px 32px; align-items:center; padding:22px 24px; border:1px solid var(--line); border-left:4px solid var(--gold); border-radius:var(--r); background:var(--bg-alt)}
.mission-strip p{margin-top:8px; color:var(--text); max-width:78ch}
.mission-strip p.small{font-size:.9rem; color:var(--muted)}
.mission-strip .actions{flex-direction:column; align-items:flex-start}
@media (max-width:820px){ .mission-strip{grid-template-columns:1fr} .mission-strip .actions{flex-direction:row; align-items:center} }
.levels{list-style:none; padding:0; margin:0 0 8px; display:grid; gap:10px}
.levels li{display:grid; grid-template-columns:230px minmax(0,1fr); gap:14px; align-items:start; padding:12px 0; border-bottom:1px solid var(--line); font-size:.95rem}
.levels .badge{justify-self:start}
@media (max-width:600px){ .levels li{grid-template-columns:1fr; gap:6px} }
.independence{margin-top:18px; padding:14px 18px; border:1px solid var(--line); border-radius:var(--r); background:var(--surface); font-size:.9rem; color:var(--muted); line-height:1.6}
.independence strong{color:var(--ink)}
.aside .independence{margin-top:0}
.linkonly{padding:14px 18px; border-radius:var(--r); background:var(--brand-soft); color:var(--brand-strong); font-size:.95rem}
.badge.lvl-a{background:#EAF2FB; color:#1D4E89; border-color:#C7DAF0}
.badge.lvl-b{background:#EEF0F8; color:#3D4E82; border-color:#D3D8EC}
.badge.lvl-d{background:#EEF8F2; color:#1E5A3C; border-color:#BFE0CC}
.badge-inline{font-weight:600; color:var(--ink)}
.doc.own-doc{border-left:4px solid var(--navy)}
.muted{color:var(--muted)}
.metatable small.muted{display:inline-block; margin-top:4px; line-height:1.5}
.report-link{font-size:.92rem; color:var(--muted)}
.report-link:hover{color:var(--brand)}
.service-note{background:var(--bg-alt)}
.service-note h3{font-size:1rem}
.sortfield{grid-auto-flow:column; align-items:center; gap:8px}
@media (max-width:480px){ .sortfield{grid-auto-flow:row} .results-head select{width:100%} }
.prose.mission p{font-size:1.08rem}
.glossary{margin:0; display:grid; gap:0; border-top:1px solid var(--line)}
.glossary dt{font-weight:700; color:var(--ink); padding-top:14px}
.glossary dd{margin:4px 0 0; padding-bottom:14px; border-bottom:1px solid var(--line); color:var(--text)}
details.solution{border:1px solid var(--line); border-radius:var(--r); background:var(--surface); margin-top:12px}
details.solution > summary{cursor:pointer; padding:14px 18px; font-weight:600; color:var(--ink)}
details.solution[open] > summary{border-bottom:1px solid var(--line)}
details.solution > *:not(summary){padding-left:18px; padding-right:18px}
details.solution > :last-child{padding-bottom:16px}
.prose td.num, .prose th.num{text-align:right; font-family:var(--f-mono); font-variant-numeric:tabular-nums; white-space:nowrap}
.lib-subnav + section{padding-top:clamp(32px, 4vw, 48px)}
details.solution > * + *{margin-top:.9em}
details.solution h3{font-size:1.15rem; margin-top:1.1em}
details.solution > summary + *{margin-top:14px}

/* ---------- Biblioteca Digital Educativa: centro de formación ---------- */
.box-title{font-family:var(--f-display); font-size:1.15rem; margin:0 0 12px; color:var(--ink)}
.box ul{padding-left:1.1em; margin:0 0 12px}
.box li + li{margin-top:.35em}
.welcome-desc{max-width:72ch; margin:0 0 26px; color:var(--text)}
.access-grid{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:16px}
@media (max-width:1000px){ .access-grid{grid-template-columns:repeat(2, minmax(0,1fr))} }
@media (max-width:560px){ .access-grid{grid-template-columns:1fr} }
.access-card{display:flex; flex-direction:column; gap:8px; padding:22px; border:1px solid var(--line); border-top:3px solid var(--navy); border-radius:var(--r); background:var(--surface); color:var(--text); text-decoration:none; transition:border-color .2s, box-shadow .2s}
.access-card:hover, .access-card:focus-visible{border-top-color:var(--gold); box-shadow:var(--shadow); color:var(--text)}
.access-card b{font-family:var(--f-display); font-weight:400; font-size:1.18rem; color:var(--ink); line-height:1.25}
.access-card > span:not(.ic):not(.link-arrow){font-size:.93rem; color:var(--muted)}
.access-card .ic{width:44px; height:44px; border-radius:var(--r); background:var(--brand-soft); color:var(--brand); display:grid; place-items:center}
.access-card .link-arrow{margin-top:auto; color:var(--brand)}
.chips{display:flex; flex-wrap:wrap; gap:8px}
.chip-link{display:inline-flex; align-items:center; gap:6px; padding:8px 14px; min-height:40px; border:1px solid var(--line); border-radius:999px; background:var(--surface); color:var(--ink); text-decoration:none; font-size:.92rem}
.chip-link small{color:var(--muted)}
.chip-link:hover{border-color:var(--brand); color:var(--brand)}
.declaracion{margin-top:24px; padding:16px 20px; border:1px solid var(--line); border-left:4px solid var(--navy); border-radius:var(--r); background:var(--bg-alt); font-size:.93rem; color:var(--text); line-height:1.6}
.declaracion strong{color:var(--ink)}
.declaracion p{margin:0}
.declaracion p + p{margin-top:8px}
.mini-guides{display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:12px}
@media (max-width:1100px){ .mini-guides{grid-template-columns:repeat(3, minmax(0,1fr))} }
@media (max-width:720px){ .mini-guides{grid-template-columns:repeat(2, minmax(0,1fr))} }
@media (max-width:420px){ .mini-guides{grid-template-columns:1fr} }
.mini-guide{display:flex; flex-direction:column; gap:6px; padding:16px; border:1px solid var(--line); border-radius:var(--r); background:var(--surface); text-decoration:none; color:var(--ink)}
.mini-guide:hover{border-color:var(--brand); box-shadow:var(--shadow)}
.mini-guide b{font-weight:600; font-size:.95rem; line-height:1.35}
.mini-guide small{color:var(--muted); font-size:.82rem}
.guide-num{font-family:var(--f-mono); font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color:var(--gold-ink)}
.guide-card{border-top:3px solid var(--navy)}
.grid-docs{grid-template-columns:repeat(2, minmax(0,1fr))}
@media (max-width:820px){ .grid-docs{grid-template-columns:1fr} }
.notice.pendiente{border-left-color:var(--warn); background:#FBF3E4; color:#6B3E0E}
.portada{border:1px solid var(--line); border-top:6px solid var(--navy); border-radius:var(--r); padding:26px; background:linear-gradient(180deg, var(--bg-alt), var(--surface))}
.portada-firma{display:flex; align-items:center; gap:14px; padding-bottom:16px; border-bottom:1px solid var(--gold)}
.portada-firma img{width:60px; height:auto}
.portada-firma b{display:block; font-family:var(--f-display); font-weight:400; letter-spacing:.08em; color:var(--ink); font-size:1.1rem}
.portada-firma span{display:block; font-size:.78rem; letter-spacing:.18em; color:var(--muted)}
.portada-tipo{margin-top:18px!important; font-family:var(--f-mono); font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; color:var(--gold-ink)}
.portada-titulo{margin-top:6px!important; font-family:var(--f-display); font-size:1.6rem; line-height:1.25; color:var(--ink)}
.portada-meta{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; margin:18px 0 0}
@media (max-width:640px){ .portada-meta{grid-template-columns:repeat(2, minmax(0,1fr))} }
.portada-meta dt, .ex-meta dt, .verif-meta dt, .tpl-meta dt{font-size:.74rem; text-transform:uppercase; letter-spacing:.06em; color:var(--muted)}
.portada-meta dd, .ex-meta dd, .verif-meta dd, .tpl-meta dd{margin:2px 0 0; color:var(--ink); font-size:.94rem}
.portada-aviso{margin-top:16px!important; font-size:.85rem; color:var(--muted)}
.toc-box, .objetivos{border:1px solid var(--line); border-radius:var(--r); padding:18px 22px; background:var(--surface)}
.toc-box ol{margin:0; padding-left:0; list-style:none}
.ejemplo{border:1px solid var(--line); border-left:4px solid var(--brand); border-radius:0 var(--r) var(--r) 0; padding:14px 18px; background:var(--brand-soft)}
.ejemplo-titulo{font-weight:600; color:var(--ink); margin:0 0 4px}
.ejemplo p{margin:0}
details.solution{border:1px solid var(--line); border-radius:var(--r); padding:0 16px; background:var(--surface)}
details.solution > summary{cursor:pointer; padding:12px 0; font-weight:600; color:var(--ink); min-height:44px}
details.solution[open] > summary{border-bottom:1px solid var(--line); margin-bottom:12px}
details.solution > *:last-child{margin-bottom:14px}
.verif{margin-top:2em; border-top:1px solid var(--line); padding-top:4px}
.verif-meta, .ex-meta, .tpl-meta{display:flex; flex-wrap:wrap; gap:12px 28px; margin:0}
.prevnext{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:2em}
.prevnext a{display:block; padding:14px 16px; border:1px solid var(--line); border-radius:var(--r); text-decoration:none; color:var(--ink)}
.prevnext a.next{text-align:right}
.prevnext small{display:block; color:var(--muted); font-size:.8rem}
.prevnext a:hover{border-color:var(--brand)}
@media (max-width:560px){ .prevnext{grid-template-columns:1fr} .prevnext a.next{text-align:left} }
.ex-area{margin-top:44px}
.ex-form{border:1px solid var(--line); border-radius:var(--r); padding:20px; background:var(--bg-alt); display:grid; gap:16px}
.ex-q{border:0; margin:0; padding:0; min-width:0}
.ex-q > label, .ex-q > legend{display:block; font-weight:600; color:var(--ink); margin-bottom:6px; padding:0}
.ex-row{display:flex; flex-wrap:wrap; gap:8px 12px; align-items:center}
.ex-row input{font:400 1rem var(--f-mono); padding:10px 12px; min-height:44px; width:min(240px, 100%); border:1px solid var(--line); border-radius:var(--r); background:#fff; color:var(--ink)}
.ex-row input:focus, .ex-opt input:focus-visible{outline:3px solid var(--gold); outline-offset:1px}
.ex-opts{display:grid; gap:6px}
.ex-opt{display:flex; gap:10px; align-items:flex-start; padding:8px 12px; border:1px solid var(--line); border-radius:var(--r); background:#fff; cursor:pointer; min-height:44px}
.ex-opt input{margin-top:5px}
.ex-fb{font-size:.92rem; font-weight:600}
.ex-fb.ok, .quiz-fb.ok{color:var(--ok)}
.ex-fb.bad, .quiz-fb.bad{color:var(--error)}
.ex-q.is-ok input[type=text]{border-color:var(--ok)}
.ex-q.is-bad input[type=text]{border-color:var(--error)}
.ex-score{font-weight:600; color:var(--ink); margin:0}
.quiz{min-width:0}
.quiz-intro, .quiz-stage{border:1px solid var(--line); border-radius:var(--r); padding:24px; background:var(--surface)}
.quiz-progress{font-family:var(--f-mono); font-size:.82rem; color:var(--muted); margin:0 0 6px}
.quiz-bar{height:6px; border-radius:3px; background:var(--bg-alt); overflow:hidden; margin-bottom:18px}
.quiz-bar span{display:block; height:100%; background:var(--brand); transition:width .3s}
.quiz-q{font-family:var(--f-display); font-size:1.3rem; color:var(--ink); line-height:1.35; margin:0 0 14px}
.quiz-opts{display:grid; gap:8px; border:0; padding:0; margin:0}
.quiz-opt{display:flex; gap:10px; align-items:flex-start; padding:12px 14px; border:1px solid var(--line); border-radius:var(--r); cursor:pointer; min-height:48px}
.quiz-opt input{margin-top:5px}
.quiz-opt.correct{border-color:var(--ok); background:#EEF8F2}
.quiz-opt.wrong{border-color:var(--error); background:#FDEEEC}
.quiz-fb{margin-top:14px; padding:12px 14px; border-radius:var(--r); background:var(--bg-alt); font-size:.95rem}
.quiz-actions{display:flex; flex-wrap:wrap; gap:10px; margin-top:16px}
.quiz-result{text-align:center}
.quiz-score{font-family:var(--f-display); font-size:3rem; color:var(--ink); line-height:1; margin:10px 0}
.quiz-fallback li + li{margin-top:16px}
.tpl{scroll-margin-top:96px}
.tpl:target{border-color:var(--gold); box-shadow:0 0 0 3px var(--gold-soft)}
.tpl .actions{display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:auto}
.tpl details.solution{margin:0}
.quiz-opt input[type=radio], .ex-opt input[type=radio]{width:18px; height:18px; min-height:0; flex:0 0 18px; padding:0; margin:4px 0 0; accent-color:var(--brand); border-radius:50%}
.quiz-opt span, .ex-opt span{text-align:left; flex:1}

/* ---------- Portada (hero con fotografía) ---------- */
.hero-v2{padding:0; display:flex; flex-direction:column; min-height:max(540px, min(720px, calc(100vh - 76px))); background:var(--navy)}
.hero-v2::before{display:none}
.hero-v2 .hero-bg{position:absolute; inset:0 0 0 auto; width:56%; z-index:0}
.hero-v2 .hero-bg picture, .hero-v2 .hero-bg img{display:block; width:100%; height:100%}
.hero-v2 .hero-bg img{object-fit:cover; object-position:40% 55%}
.hero-v2 .hero-bg::after{content:""; position:absolute; inset:0; background:
  linear-gradient(90deg, var(--navy) 0%, rgba(20,43,74,.8) 10%, rgba(20,43,74,.3) 26%, rgba(20,43,74,0) 44%),
  linear-gradient(0deg, rgba(20,43,74,.92) 0%, rgba(20,43,74,.35) 22%, rgba(20,43,74,0) 40%)}
.hero-v2 .wrap{display:block; position:relative; z-index:1; width:100%}
.hero-v2 .hero-inner{flex:1; display:flex; align-items:center; justify-content:flex-start; padding-block:clamp(44px, 6vw, 80px) 32px}
.hero-v2 .hero-copy{max-width:580px; margin:0; gap:22px}
.hero-eyebrow{display:inline-flex; align-items:center; gap:16px; letter-spacing:.2em}
.hero-eyebrow::before{content:""; width:56px; height:1px; background:var(--gold); flex:none}
.hero-v2 h1{font-size:clamp(2.2rem, 1.3rem + 3vw, 3.6rem); line-height:1.08; letter-spacing:-.01em; text-shadow:0 2px 24px rgba(10,22,40,.35)}
.hero-v2 h1 .accent{color:var(--gold); display:block}
.hero-v2 .lede{color:#D3DCE8; max-width:52ch}
.hero-v2 .btn-gold{box-shadow:0 10px 26px rgba(200,169,107,.28)}
.hero-v2 .btn-gold .svg-i:last-child{transition:transform .2s}
.hero-v2 .btn-gold:hover .svg-i:last-child{transform:translateX(3px)}
.hero-strip{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); border-top:1px solid var(--on-navy-line); margin-bottom:8px}
.hero-strip a{display:flex; align-items:center; justify-content:center; gap:14px; padding:22px 12px; color:var(--on-navy); text-decoration:none; font-size:1.02rem; position:relative; transition:color .2s}
.hero-strip a + a::before{content:""; position:absolute; left:0; top:22%; bottom:22%; width:1px; background:var(--gold); opacity:.7}
.hero-strip .svg-i{width:30px; height:30px; stroke-width:1.4; color:#fff; transition:color .2s, transform .2s}
.hero-strip a:hover, .hero-strip a:focus-visible{color:var(--gold)}
.hero-strip a:hover .svg-i{color:var(--gold); transform:translateY(-2px)}
@media (max-width:1100px) and (min-width:821px){ .hero-v2 .hero-bg{width:50%} .hero-v2 .hero-copy{max-width:470px} }
@media (max-width:820px){
  .hero-v2{min-height:0}
  .hero-v2 .hero-bg{position:relative; inset:auto; width:100%; height:clamp(230px, 58vw, 400px)}
  .hero-v2 .hero-bg img{object-position:50% 50%}
  .hero-v2 .hero-bg::after{background:linear-gradient(180deg, rgba(20,43,74,0) 45%, rgba(20,43,74,.75) 80%, var(--navy) 100%)}
  .hero-v2 .hero-inner{padding-block:0 32px; margin-top:-44px}
  .hero-strip{grid-template-columns:repeat(2, minmax(0,1fr))}
  .hero-strip a{justify-content:flex-start; padding:18px 12px; font-size:.95rem}
  .hero-strip a + a::before{display:none}
  .hero-strip a:nth-child(n+3){border-top:1px solid var(--on-navy-line)}
  .hero-strip a:nth-child(even){border-left:1px solid var(--on-navy-line)}
  .hero-strip .svg-i{width:24px; height:24px}
}
@media (max-width:380px){ .hero-strip a{gap:10px; padding:16px 8px; font-size:.88rem} }
@media (max-width:820px){ .hero-v2 .hero-inner{margin-top:-24px} }
@media (max-width:520px){ .hero-eyebrow{letter-spacing:.12em; font-size:.72rem} .hero-eyebrow::before{width:28px} .hero-strip a{gap:10px} .hero-strip a span{line-height:1.3} }