/* Dark top section: the logo bar, the headline and the application sit on one near-black panel.
   The headline and the section titles use Archivo (expanded, Black) with a green fade. */
:root{--dark:#0f1a0d;--on-dark:#e8f3e1;--on-dark-soft:#cfdcc7}
header{background:var(--dark)}
header .brand .brand-name,header .brand .brand-ai{color:#fff}
.hero,.progress,.apply{background:var(--dark);box-shadow:0 0 0 100vmax var(--dark);clip-path:inset(0 -100vmax)}
.hero{padding:26px 0 30px}
.qualifier{background:none;color:var(--green);text-transform:uppercase;letter-spacing:.12em;font-size:16px;margin-bottom:14px}
.hero h1{font-stretch:125%;font-weight:900;line-height:1.02;background:linear-gradient(180deg,#c5f49d 0%,#6fbf45 60%,#3f8f2c 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero h1 .sub{font-family:var(--body);font-stretch:100%;-webkit-text-fill-color:var(--on-dark);margin-top:12px}
.progress{background:#2b3a26;margin:0;outline:8px solid var(--dark)}
.progress i{background:#8fd25a}
.apply{margin-top:0;padding-top:60px;padding-bottom:110px;color:var(--on-dark)}
.apply .nav{bottom:32px}
.apply .prompt,.apply .prompt .num,.apply #counter,.apply .enter-note,.apply .nav{color:var(--on-dark-soft)}
.apply .option{background:#18261a;border-color:#3f6b33;color:var(--on-dark)}
.apply .option:hover,.apply .option:has(input:checked){background:#24391f;border-color:#8fd25a}
.apply .text-input{background:transparent;color:#fff;border-color:#6b7d62}
.apply .text-input::placeholder{color:#7d8c75}
.apply .consent{color:var(--on-dark-soft)}
.apply .consent a{color:var(--green)}
.apply .iti.ph{color:#fff}
.apply .ph .iti__selected-dial-code{color:var(--on-dark)}
.apply .bp-legend,.apply .bp-zone,.apply .bp-hint{color:var(--on-dark-soft)}
.apply .bp-picked{color:#fff}
.apply .bp-msg,.apply .ph-err{color:#ff8a80}
.apply .bp-problem p{color:var(--on-dark)}
.apply .bp-problem a{color:var(--green)}
.about h2,.proof h2{font-stretch:125%;font-weight:900;text-transform:uppercase;font-size:clamp(26px,3.6vw,40px);line-height:1.05;text-wrap:balance;background:linear-gradient(180deg,#8fd25a 0%,#3f8f2c 55%,#245a1b 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
/* brand.css sets every element's font with !important, so the two Archivo headings need the same. */
html body .hero h1,html body .about h2,html body .proof h2{font-family:'Archivo',Arial,sans-serif!important}
html body .hero h1 .sub{font-family:var(--site-font)!important}
header .brand .brand-mark{width:26px;height:26px}
header .brand .brand-name{font-size:15px}
header .brand{gap:8px}