@font-face{font-family:"Noto Sans";font-weight:400;font-display:swap;src:url(NotoSans-Regular.woff2) format("woff2")}
@font-face{font-family:"Noto Sans";font-weight:700;font-display:swap;src:url(NotoSans-Bold.woff2) format("woff2")}
@font-face{font-family:"Noto Sans Display";font-weight:800;font-display:swap;src:url(NotoSansDisplay-ExtraBold.woff2) format("woff2")}
:root{--ot-deep-navy:#0F2D4A;--ot-mountain-blue:#3E7FB1;--ot-forest-green:#3E8B5E;--ot-sunrise-amber:#F4C430;--ot-warm-orange:#E57E3A;--ot-warm-ivory:#F6F4EC;
--font-display:"Noto Sans Display","Noto Sans",sans-serif;--font-text:"Noto Sans",sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ot-warm-ivory);color:var(--ot-deep-navy);font:400 1.0625rem/1.65 var(--font-text)}
a{color:var(--ot-deep-navy);text-decoration-thickness:.12em;text-underline-offset:.18em}
a:hover{color:#0a2036}
:focus-visible{outline:3px solid var(--ot-warm-orange);outline-offset:3px}
.skip{position:absolute;left:-999px;top:0;background:var(--ot-sunrise-amber);color:var(--ot-deep-navy);padding:.6rem 1rem;font-weight:700;z-index:10}
.skip:focus{left:0}
header.bar{background:var(--ot-deep-navy);color:var(--ot-warm-ivory)}
header.bar .in{max-width:68rem;margin:0 auto;padding:.9rem 1.25rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
header.bar img{height:4.2rem;width:auto;display:block}
nav a{color:var(--ot-warm-ivory);font-weight:700;text-decoration:none;margin-left:1.25rem}
nav a:hover{color:var(--ot-sunrise-amber);text-decoration:underline}
.hero{position:relative;background:var(--ot-deep-navy) url(hero.webp) center/cover;color:var(--ot-warm-ivory)}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,45,74,.92) 0%,rgba(15,45,74,.72) 55%,rgba(15,45,74,.35) 100%)}
.hero .in{position:relative;max-width:68rem;margin:0 auto;padding:5.5rem 1.25rem 6rem}
h1,h2,h3{font-family:var(--font-display);font-weight:800;line-height:1.15;margin:0 0 .6em}
.hero h1{font-size:clamp(2.4rem,6vw,4rem);max-width:16ch}
.hero p{font-size:1.25rem;max-width:36rem;margin:0 0 1.75rem}
.btn{display:inline-block;background:var(--ot-sunrise-amber);color:var(--ot-deep-navy);font-weight:700;text-decoration:none;padding:.85rem 1.6rem;border-radius:999px}
.btn:hover{background:var(--ot-warm-orange);color:var(--ot-deep-navy)}
main .in,footer .in{max-width:68rem;margin:0 auto;padding:0 1.25rem}
section{padding:3.5rem 0}
section h2{font-size:clamp(1.6rem,3.5vw,2.2rem)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1.25rem;margin-top:1.5rem}
.card{background:#fff;border-left:.35rem solid var(--ot-sunrise-amber);padding:1.25rem 1.4rem;border-radius:.4rem}
.card h3{font-size:1.2rem;margin-bottom:.4em}
.card p{margin:0}
.band{background:var(--ot-deep-navy);color:var(--ot-warm-ivory)}
.band a{color:var(--ot-sunrise-amber)}
.band .btn{color:var(--ot-deep-navy)}
.doc{max-width:46rem;margin:0 auto;padding:3rem 1.25rem 4rem}
.doc h1{font-size:clamp(2rem,5vw,2.8rem)}
.doc h2{font-size:1.5rem;margin-top:2.2rem}
.doc li{margin:.35rem 0}
.doc code{background:#fff;padding:.1rem .35rem;border-radius:.25rem;font-size:.92em;word-break:break-all}
.muted{opacity:.85;font-size:.95rem}
footer{background:var(--ot-deep-navy);color:var(--ot-warm-ivory);padding:2rem 0;font-size:.95rem}
footer a{color:var(--ot-warm-ivory)}
@media(max-width:34rem){nav a{margin-left:.9rem}header.bar img{height:3.4rem}.hero .in{padding:3.5rem 1.25rem 4rem}}
