:root{
  --navy:#0A1C34; --ink:#0A1C34; --muted:#5B6B7B; --line:#DEE6EE; --mist:#EBF2F8;
  --orange:#F45419; --orange-d:#D22D19; --blue:#146EBE;
  --display:"Archivo",system-ui,sans-serif; --body:"Inter",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font-family:var(--body);color:var(--ink);background:#fff;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:var(--blue)}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:860px;margin:0 auto;padding:0 24px}

.nav{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav .wrap{max-width:1180px;display:flex;align-items:center;justify-content:space-between;height:68px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand img{height:40px;width:auto}
.brand span{font:900 1.05rem/1 var(--display);font-stretch:118%;font-style:italic;letter-spacing:.02em}
.brand span b{color:var(--orange)}
.brand small{display:block;font:600 .58rem/1 var(--display);letter-spacing:.42em;color:var(--muted);font-style:normal;margin-top:3px}
.back{font:700 .8rem/1 var(--display);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--ink);padding:11px 18px;border:2px solid var(--navy);border-radius:999px;transition:.2s}
.back:hover{background:var(--navy);color:#fff}

.hero{background:linear-gradient(120deg,var(--navy),#12305a);color:#fff;padding:64px 0 56px;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(-62deg,transparent 0 46px,rgba(255,255,255,.04) 46px 48px)}
.hero .wrap{position:relative}
.eyebrow{font:700 .75rem/1 var(--display);letter-spacing:.22em;text-transform:uppercase;color:#FF8A5C}
h1{font:900 clamp(2rem,5vw,3rem)/1.05 var(--display);font-stretch:112%;font-style:italic;text-transform:uppercase;margin:12px 0 14px}
.updated{color:#B7C4D3;font-size:.92rem}

main{padding:56px 0 80px}
.intro{font-size:1.05rem;color:#34465A;padding:22px 24px;background:var(--mist);border-left:4px solid var(--orange);border-radius:0 12px 12px 0;margin-bottom:36px}
.toc{border:1px solid var(--line);border-radius:14px;padding:22px 26px;margin-bottom:44px}
.toc h2{margin:0 0 10px;font-size:.8rem;letter-spacing:.18em}
.toc ol{padding-left:20px;columns:2;column-gap:32px;font-size:.93rem}
.toc a{color:var(--ink);text-decoration:none}
.toc a:hover{color:var(--orange)}
main h2{font:800 1.2rem/1.3 var(--display);text-transform:uppercase;letter-spacing:.02em;margin:40px 0 12px}
main h3{font:700 1rem/1.4 var(--display);margin:22px 0 8px}
main p,main li{color:#34465A}
main p+p{margin-top:12px}
main ul,main ol.list{padding-left:22px;margin:10px 0}
main li{margin:6px 0}
.contact-box{margin-top:44px;padding:26px;border-radius:14px;background:var(--navy);color:#fff}
.contact-box h2{margin-top:0;color:#fff}
.contact-box p{color:#C9D5E2}
.contact-box a{color:#FF8A5C;font-weight:600}

footer{background:#060F1D;color:#9FB1C4;padding:30px 0;font-size:.85rem}
footer .wrap{max-width:1180px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px}
footer nav{display:flex;flex-wrap:wrap;gap:20px}
footer a{color:#9FB1C4;text-decoration:none}
footer a:hover,footer a[aria-current]{color:#fff}

@media (max-width:600px){
  .wrap{padding:0 16px}
  .toc ol{columns:1}
  .back{padding:9px 14px;font-size:.72rem}
  .brand small{letter-spacing:.3em}
}
.toc li{margin:0 0 6px;break-inside:avoid}