/* Moda makeover (approved 14/10/2026): brochure style. Loaded after site.css / results.css; only restyles, no markup or behaviour changes.
   Navy photo header, Hanken Grotesk (self-hosted), teal #0B6B63, 6px radius, white cards with thin borders on a pale grey page. */
@font-face{font-family:"Hanken Grotesk";src:url(/aix/img/hanken-grotesk.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
:root{--teal:#0B6B63;--ink:#0f1117;--muted:#475569;--card:#fff;--line:#e2e8f0;--navy:#0a1222;--navy2:#16233e;--r:6px}
body{font-family:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:#f6f7fb;color:var(--ink)}
/* header: compact navy band with the brochure photo behind it */
header{background:linear-gradient(180deg,rgba(10,18,34,.80),rgba(10,18,34,.94)),#0a1222 url(/aix/img/band-sm.webp) center 30%/cover no-repeat;border-bottom:0}
.logo,header a.logo{color:#fff}.logo .x{color:#2dd4bf}
/* start page hero */
.hero{background-color:#0a1222}
.hero::before{background:linear-gradient(180deg,rgba(10,18,34,.35) 0%,rgba(10,18,34,.62) 40%,rgba(10,18,34,.95) 80%)}
.eyebrow{color:#5eead4}.hero .eyebrow::after{content:"";display:block;width:44px;height:3px;background:#2dd4bf;border-radius:2px;margin:10px 0 2px}
@media (min-width:900px){.hero::before{background:linear-gradient(90deg,#0a1222 0%,rgba(10,18,34,.92) 32%,rgba(10,18,34,.5) 55%,rgba(10,18,34,.05) 78%)}}
/* cards */
.card,.facts li{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:none}
.facts .ico,.facts svg{width:26px;height:26px}.facts li{padding-left:58px}.facts .ico{left:18px;top:20px}
@media (min-width:900px){.facts li{padding-left:58px}.facts .ico{left:20px;top:18px}.facts .ico,.facts svg{width:26px;height:26px}}
.card.back{background:#eef6f5;border:1px solid var(--teal)}
/* buttons and fields */
.btn{border-radius:var(--r)}.btn.sec{border-width:1.5px}
input,select,textarea{border-radius:var(--r);border-color:#cbd5e1}
.ctick{border-radius:var(--r);background:#eef6f5;border-width:1.5px}
.tag{border-radius:var(--r);background:#eef6f5}
.err{border-radius:var(--r)}
/* footer */
footer{background:var(--navy)}footer .copy{color:#94a3b8}
/* results page */
.rhero{border-radius:var(--r);background:linear-gradient(180deg,rgba(10,18,34,.72),rgba(10,18,34,.95)),#0a1222 url(/aix/img/band-sm.webp) center 30%/cover no-repeat}
.rhero::after{display:none}
@media (min-width:900px){.rhero{background-image:linear-gradient(180deg,rgba(10,18,34,.72),rgba(10,18,34,.95)),url(/aix/img/band.webp)}}
.area,.ctx,.lock{border-radius:var(--r);box-shadow:none}.area{border-color:var(--line)}.ctx{background:#fff;border:1px solid var(--line)}
.lock{background:#fff;border-color:#cbd5e1}
.step{border-radius:var(--r);background:#eef6f5}
.chip{border-radius:var(--r);padding:5px 12px}
.chip.hi{background:#fbecee;color:#9f1239}.chip.ty{background:#fdf3e7;color:#9a4a07}.chip.lo{background:#eef6f5;color:#0B6B63}
.area .num{color:#64748b}
.valid{border-radius:var(--r);background:#fdf3e7;border:1px solid #f0c27a;border-left:4px solid #b45309}
/* start page: logo sits on the hero photo, as in the design */
body:has(#home:not(.hide)) header{position:absolute;left:0;right:0;top:0;z-index:2;background:transparent}
body:has(#home:not(.hide)) main{position:relative}
@media (min-width:900px){body:has(#home:not(.hide)) .hero-in{padding-top:76px}}

/* DQ-4 on its own: neutral note (14/10/2026) */
.valid.gentle{background:#f3f6f6;border:1px solid #d3dedd;border-left:4px solid #5d7472}.valid.gentle b{color:#1d2b2a}.valid.gentle p{color:#3b4a49}