:root{
  --ink:#12100c; --muted:#5d564a; --line:#e5ded1; --paper:#fffdf8;
  --cream:#f7f1e5;
  --gold:#e8a817;
  --gold-dk:#c98908;
  --gold-bright:#ffc933;
  --gold-hover:#ffd54a;
  --deep:#171410;
  --radius:14px; --wrap:1120px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);
  font:16px/1.65 "Georgia","Iowan Old Style",serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.brand,.btn,.eyebrow,label,input,select,button,.price,.big{
  font-family:"Helvetica Neue",Inter,system-ui,-apple-system,sans-serif}
h1{font-size:clamp(30px,5vw,50px);line-height:1.12;letter-spacing:-.02em;margin:.2em 0 .4em}
h2{font-size:clamp(22px,3vw,31px);letter-spacing:-.01em;margin:0 0 .7em}
h3{font-size:18px;margin:0 0 .4em}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px}

/* nav */
.nav{position:sticky;top:0;z-index:30;display:flex;align-items:center;
  justify-content:space-between;gap:16px;padding:12px 22px;
  background:rgba(255,253,248,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;letter-spacing:.12em;font-size:14px}
.brand img{width:30px;height:30px;object-fit:contain}
.nav nav{display:flex;align-items:center;gap:22px}
.nav nav a{text-decoration:none;font-size:14px;color:var(--muted);font-family:Inter,system-ui,sans-serif}
.nav nav a.on,.nav nav a:hover{color:var(--ink)}
.burger{display:none}

.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--deep);
  color:#fff;text-decoration:none;padding:13px 26px;border-radius:999px;font-size:14px;
  font-weight:600;line-height:1.2;text-align:center;border:1px solid var(--deep);
  cursor:pointer;transition:.15s}
.btn:hover{background:var(--gold-dk);border-color:var(--gold-dk)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{background:var(--cream);color:var(--ink)}
.btn.small{padding:9px 18px}
.btn.wide{width:100%;padding:16px}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* hero */
.hero{background:linear-gradient(180deg,var(--cream),var(--paper));
  border-bottom:1px solid var(--line);padding:56px 0 64px}
.herogrid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-dk);margin:0}
.lede{font-size:18px;color:var(--muted);max-width:52ch}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0 14px}
.trust{font-size:13px;color:var(--muted);margin:0}
.herofig{position:relative}
.herofig>img{border-radius:var(--radius);box-shadow:0 22px 60px rgba(23,20,16,.18)}
.pricecard{position:absolute;right:-10px;bottom:-26px;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);padding:16px 20px;box-shadow:0 14px 34px rgba(23,20,16,.12);text-align:center}
.pl{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-dk);margin:0 0 4px}
.price{margin:0;font-size:15px;color:var(--muted)}
.price b{font-size:26px;color:var(--ink);margin-left:8px}
.pricetag{color:#1d7a44;font-weight:700;font-size:13px;margin:6px 0 0;
  font-family:Inter,system-ui,sans-serif}
.cd{font-size:12px;color:var(--muted);margin:6px 0 0;font-variant-numeric:tabular-nums;
  font-family:Inter,system-ui,sans-serif}

/* bands */
.band{padding:64px 0}
.band.alt{background:var(--cream);max-width:none;padding-left:0;padding-right:0}
.band.alt>*{max-width:var(--wrap);margin-inline:auto;padding-inline:22px}
.narrow{max-width:760px}
.steps{list-style:none;counter-reset:s;padding:0;margin:0;display:grid;
  grid-template-columns:repeat(4,1fr);gap:26px}
.steps li b{display:block;font-family:Inter,system-ui,sans-serif;font-size:15px;margin-bottom:6px}
.steps li p{margin:0;color:var(--muted);font-size:15px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.card p{margin:0;color:var(--muted);font-size:15px}
.notes p{border-left:3px solid var(--gold);padding-left:16px;color:var(--muted);max-width:70ch}
.notes b{color:var(--ink)}
.prices{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:0 0 40px}
.pcard{border:1px solid var(--line);border-radius:var(--radius);padding:26px;background:var(--cream);text-align:center}
.pcard .big{font-size:34px;margin:6px 0;font-weight:700}
.pcard p:last-child{color:var(--muted);margin:0;font-size:14px}
.ticks{padding-left:0;list-style:none}
.ticks li{position:relative;padding-left:26px;margin-bottom:9px;color:var(--muted)}
.ticks li::before{content:"";position:absolute;left:4px;top:.62em;width:7px;height:7px;
  background:var(--gold);border-radius:50%}

/* form */
.form{display:grid;gap:20px;margin-top:30px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}
.row3 select:disabled{opacity:.55;cursor:not-allowed}
@media(max-width:620px){.row3{grid-template-columns:1fr}}
.langpick{padding:16px 18px;border:2px solid var(--gold);border-radius:var(--radius);
  background:linear-gradient(180deg,#fffdf6,#fff);box-shadow:0 8px 24px rgba(184,134,11,.08)}
.langpick select{font-size:16px;font-weight:600}
.hint{display:block;margin-top:6px;font-size:12px;font-weight:400;color:var(--muted);line-height:1.45}
input,select{width:100%;margin-top:7px;padding:13px 14px;border:1px solid var(--line);
  border-radius:10px;background:#fff;font-size:15px;color:var(--ink);font-weight:400}
input:focus,select:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:transparent}
.ac{position:relative}
.suggest{position:absolute;z-index:20;left:0;right:0;top:100%;margin:4px 0 0;padding:0;
  list-style:none;background:#fff;border:1px solid var(--line);border-radius:10px;
  max-height:210px;overflow:auto;box-shadow:0 12px 30px rgba(23,20,16,.12)}
.suggest li{padding:10px 14px;cursor:pointer;font-size:14px;font-weight:400;color:var(--ink)}
.suggest li:hover,.suggest li.sel{background:var(--cream)}
.drop{border:2px dashed var(--line);border-radius:var(--radius);padding:26px;text-align:center;
  cursor:pointer;background:var(--cream);transition:.15s}
.drop:hover,.drop.over{border-color:var(--gold);background:#fff}
.dropinner b{display:block;font-size:16px;color:var(--ink);margin-bottom:6px}
.dropinner small{display:block;color:var(--muted);font-weight:400;max-width:46ch;margin:0 auto 10px;line-height:1.5}
.dropinner em{font-style:normal;font-size:13px;color:var(--gold-dk)}
#preview{max-height:190px;margin:14px auto 0;border-radius:10px}
.coupon{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end}
.coupon .cmsg{grid-column:1/-1;margin:0;font-size:13px;font-family:Inter,sans-serif}
.cmsg.ok{color:#1d7a44}.cmsg.no{color:#b03030}
.pricebar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  background:var(--cream);border:1px solid var(--line);border-radius:10px;padding:14px 18px;
  font-family:Inter,system-ui,sans-serif;font-size:15px}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:400;line-height:1.5}
.check input{width:auto;margin:3px 0 0}
.err,.warn{color:#b03030;font-size:14px;background:#fdf2f2;border:1px solid #f0d5d5;
  padding:12px 14px;border-radius:10px;font-family:Inter,sans-serif}

/* status */
.status .spinner{width:48px;height:48px;border:4px solid var(--line);
  border-top-color:var(--gold);border-radius:50%;animation:spin 1s linear infinite;margin:32px auto 16px}
@keyframes spin{to{transform:rotate(360deg)}}
.fine{font-size:13px;color:var(--muted)}

/* footer */
.foot{background:var(--deep);color:#cdc6ba;margin-top:40px;padding:48px 0 26px;font-size:14px}
.footgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:36px}
.foot h4{color:#fff;font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 12px}
.foot a{display:block;color:#cdc6ba;text-decoration:none;margin-bottom:7px}
.foot a:hover{color:#fff}
.flogo{width:40px;filter:brightness(0) invert(1);opacity:.9;margin-bottom:12px}
.foot .fine{color:#8f887c;border-top:1px solid #2d2823;padding-top:18px;margin-top:34px;max-width:var(--wrap)}
.copy{text-align:center;color:#6f695f;font-size:12px;margin:14px 0 0}

@media(max-width:900px){
  .herogrid,.cards,.prices,.footgrid{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .pricecard{position:static;margin-top:18px}
  .band{padding:44px 0}
  .burger{display:flex;flex-direction:column;gap:5px;cursor:pointer;padding:8px}
  .burger span{width:22px;height:2px;background:var(--ink);display:block}
  .nav nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;
    align-items:flex-start;gap:0;background:var(--paper);border-bottom:1px solid var(--line);padding:8px 22px 16px}
  #navtoggle:checked~nav{display:flex}
  .nav nav a{padding:11px 0;font-size:16px;width:100%}
}
@media(max-width:620px){
  .row,.steps,.coupon{grid-template-columns:1fr}
  .coupon .btn{width:100%}
}

/* ============================================================
   Rich visual layer — dark hero, technology panels, imagery
   ============================================================ */

.dark{background:var(--deep);color:#efe9dd}
.dark h1,.dark h2,.dark h3{color:#fff}
.dark .lede,.dark p{color:#b8b0a2}
.dark .btn.ghost{color:#fff;border-color:#3a342c}
.dark .btn.ghost:hover{background:#241f19;color:#fff}

/* --- cinematic hero --- */
.chero{position:relative;overflow:hidden;background:#0b0907;color:#fff;
  min-height:min(88vh,760px);display:flex;align-items:center}
.chero .bg{position:absolute;inset:0;z-index:0}
.chero .bg img{width:100%;height:100%;object-fit:cover;opacity:.55;
  transform:scale(1.06);animation:drift 26s ease-in-out infinite alternate}
@keyframes drift{to{transform:scale(1.14) translate3d(-2%,-1%,0)}}
.chero .bg::after{content:"";position:absolute;inset:0;
  background:radial-gradient(120% 90% at 72% 45%,rgba(11,9,7,0) 0%,rgba(11,9,7,.55) 42%,rgba(11,9,7,.96) 78%),
             linear-gradient(90deg,rgba(11,9,7,.97) 0%,rgba(11,9,7,.78) 42%,rgba(11,9,7,.2) 100%)}
.chero .wrap{position:relative;z-index:2;width:100%;padding-block:70px}
.chero .inner{max-width:640px}
.chero h1{color:#fff;text-shadow:0 2px 30px rgba(0,0,0,.5)}
.chero .lede{color:#cfc7b9}
.slogan{font-family:Inter,system-ui,sans-serif;font-size:13px;letter-spacing:.3em;
  text-transform:uppercase;color:var(--gold);margin:0 0 18px;display:flex;align-items:center;gap:12px}
.slogan::after{content:"";height:1px;flex:1;max-width:120px;
  background:linear-gradient(90deg,var(--gold),transparent)}

/* the scanning ring sitting over the iris */
.scanring{position:absolute;right:6%;top:50%;transform:translateY(-50%);
  width:min(38vw,420px);aspect-ratio:1;z-index:1;pointer-events:none}
.scanring i{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(184,145,47,.35)}
.scanring i:nth-child(2){inset:11%;border-color:rgba(184,145,47,.55);
  animation:pulse 3.4s ease-in-out infinite}
.scanring i:nth-child(3){inset:24%;border-style:dashed;border-color:rgba(255,255,255,.28);
  animation:spin 22s linear infinite}
.scanring i:nth-child(4){inset:38%;border-color:rgba(184,145,47,.7)}
@keyframes pulse{50%{transform:scale(1.06);opacity:.55}}
.scanline{position:absolute;left:8%;right:8%;top:50%;height:2px;border-radius:2px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
  box-shadow:0 0 18px 2px rgba(184,145,47,.55);animation:sweep 3.6s ease-in-out infinite}
@keyframes sweep{0%,100%{transform:translateY(-150px);opacity:.15}50%{transform:translateY(150px);opacity:1}}
@media(prefers-reduced-motion:reduce){
  .chero .bg img,.scanring i,.scanline{animation:none}
}

.hstats{display:flex;gap:34px;flex-wrap:wrap;margin-top:34px;
  border-top:1px solid rgba(255,255,255,.14);padding-top:22px}
.hstats div b{display:block;font-family:Inter,system-ui,sans-serif;font-size:26px;color:#fff;line-height:1.1}
.hstats div span{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#9b9385}

/* --- marquee trust strip --- */
.strip{background:var(--cream);border-block:1px solid var(--line);padding:16px 0}
.strip .wrap{display:flex;gap:38px;flex-wrap:wrap;justify-content:center;
  font-family:Inter,system-ui,sans-serif;font-size:13px;color:var(--muted);letter-spacing:.04em}
.strip span{display:flex;align-items:center;gap:8px}
.strip span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold)}

/* --- section heading --- */
.shead{max-width:62ch;margin-bottom:38px}
.shead .eyebrow{margin-bottom:10px}
.shead p{color:var(--muted);font-size:17px;margin:0}

/* --- technology panels --- */
.tech{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.tpanel{position:relative;border-radius:var(--radius);overflow:hidden;
  background:#151210;min-height:330px;display:flex;flex-direction:column;justify-content:flex-end}
.tpanel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:.42;transition:.5s ease}
.tpanel:hover img{opacity:.6;transform:scale(1.05)}
.tpanel::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(21,18,16,.15),rgba(21,18,16,.94))}
.tpanel .tin{position:relative;z-index:2;padding:24px}
.tpanel .num{font-family:Inter,sans-serif;font-size:11px;letter-spacing:.2em;color:var(--gold)}
.tpanel h3{color:#fff;margin:8px 0 8px}
.tpanel p{color:#b4aca0;font-size:14.5px;margin:0}

/* --- steps with imagery --- */
.fsteps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;list-style:none;padding:0;margin:0}
.fstep{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.fstep .ph{height:130px;overflow:hidden;background:var(--cream)}
.fstep .ph img{width:100%;height:100%;object-fit:cover}
.fstep .tx{padding:18px}
.fstep b{display:block;font-family:Inter,sans-serif;font-size:11px;letter-spacing:.18em;
  color:var(--gold-dk);margin-bottom:7px}
.fstep h3{font-size:16px;margin-bottom:6px}
.fstep p{margin:0;color:var(--muted);font-size:14.5px}

/* --- feature cards with icon photo --- */
.fcards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.fcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:24px;transition:.2s}
.fcard:hover{border-color:var(--gold);box-shadow:0 10px 30px rgba(23,20,16,.07);transform:translateY(-2px)}
.fcard .ic{width:54px;height:54px;border-radius:12px;overflow:hidden;margin-bottom:14px;
  border:1px solid var(--line)}
.fcard .ic img{width:100%;height:100%;object-fit:cover}
.fcard p{margin:0;color:var(--muted);font-size:15px}

/* --- split feature (image + text) --- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center}
.split.flip .sfig{order:2}
.sfig{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3}
.sfig img{width:100%;height:100%;object-fit:cover}
.sfig .tag{position:absolute;left:16px;bottom:16px;background:rgba(11,9,7,.82);color:#fff;
  font-family:Inter,sans-serif;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  padding:8px 14px;border-radius:999px;backdrop-filter:blur(6px)}

/* --- stages --- */
.stages{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.stage{border-radius:var(--radius);overflow:hidden;position:relative;min-height:260px;
  display:flex;align-items:flex-end;background:#151210}
.stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;transition:.5s}
.stage:hover img{opacity:.72;transform:scale(1.04)}
.stage::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 30%,rgba(11,9,7,.92))}
.stage .sin{position:relative;z-index:2;padding:22px}
.stage h3{color:#fff;margin-bottom:4px}
.stage p{color:#bdb5a8;font-size:14px;margin:0}

/* --- sample preview --- */
.sample{display:grid;grid-template-columns:.9fr 1.1fr;gap:52px;align-items:center}
.sample .cov{border-radius:var(--radius);overflow:hidden;box-shadow:0 26px 60px rgba(11,9,7,.4);
  transform:rotate(-1.5deg);transition:.4s}
.sample .cov:hover{transform:rotate(0) scale(1.02)}
.slist{list-style:none;padding:0;margin:0;columns:2;column-gap:28px}
.slist li{position:relative;padding-left:22px;margin-bottom:10px;color:var(--muted);
  font-size:15px;break-inside:avoid}
.slist li::before{content:"";position:absolute;left:2px;top:.6em;width:6px;height:6px;
  border-radius:50%;background:var(--gold)}
.dark .slist li{color:#b8b0a2}

/* --- final cta --- */
.finale{position:relative;overflow:hidden;text-align:center;padding:86px 0}
.finale img.bgi{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5}
.finale::after{content:"";position:absolute;inset:0;background:rgba(11,9,7,.52)}
.finale .wrap{position:relative;z-index:2}
.finale h2{color:#fff;margin-bottom:14px}
.finale p{color:#c6bfb2;max-width:56ch;margin:0 auto 26px}

@media(max-width:980px){
  .tech,.fsteps,.fcards,.stages{grid-template-columns:1fr 1fr}
  .split,.sample{grid-template-columns:1fr;gap:28px}
  .split.flip .sfig{order:0}
  .scanring{display:none}
  .chero .bg::after{background:linear-gradient(180deg,rgba(11,9,7,.72),rgba(11,9,7,.94))}
}
@media(max-width:620px){
  .tech,.fsteps,.fcards,.stages{grid-template-columns:1fr}
  .slist{columns:1}
  .hstats{gap:22px}
  .hstats div b{font-size:22px}
}

/* --- brand lockup with slogan --- */
.brand span{display:flex;flex-direction:column;line-height:1.1}
.brand em{font-style:normal;font-size:8.5px;letter-spacing:.22em;color:var(--gold-dk);
  font-weight:500;margin-top:3px}
.fslogan{color:var(--gold)!important;font-family:Inter,system-ui,sans-serif;font-size:11px;
  letter-spacing:.24em;text-transform:uppercase;margin:0 0 10px}

/* ghost button on any dark photographic ground */
.chero .btn.ghost,.finale .btn.ghost{color:#fff;border-color:rgba(255,255,255,.4);
  background:rgba(255,255,255,.06);backdrop-filter:blur(4px)}
.chero .btn.ghost:hover,.finale .btn.ghost:hover{background:rgba(255,255,255,.16);color:#fff}

/* primary button needs to lift off a dark ground, not sink into it */
.dark .btn,.finale .btn{
  background:linear-gradient(180deg,var(--gold-bright) 0%,var(--gold) 100%);
  border-color:var(--gold-bright);color:#12100c;
  box-shadow:0 8px 24px rgba(255,185,40,.42)}
.dark .btn:hover,.finale .btn:hover{
  background:linear-gradient(180deg,var(--gold-hover) 0%,var(--gold-bright) 100%);
  border-color:var(--gold-hover);color:#12100c;
  box-shadow:0 10px 28px rgba(255,200,60,.5)}
.finale .slogan{justify-content:center}
.finale .slogan::after,.finale .slogan::before{content:"";height:1px;flex:0 0 90px;
  background:linear-gradient(90deg,transparent,var(--gold))}
.finale .slogan::after{background:linear-gradient(90deg,var(--gold),transparent)}
/* the logo already has its own dark ground - inverting it produced a white box */
.flogo{filter:none;width:52px;border-radius:8px}

/* --- page header band (report / business) --- */
.phead{position:relative;overflow:hidden;background:#0b0907;color:#fff;padding:66px 0 58px}
.phead .bgi{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.34}
.phead::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(11,9,7,.95),rgba(11,9,7,.6))}
.phead .wrap{position:relative;z-index:2}
.phead h1{color:#fff;margin-top:0}
.phead .lede{color:#c6bfb2}

/* --- report form layout --- */
.formgrid{display:grid;grid-template-columns:1.5fr .85fr;gap:44px;align-items:start}
.aside{display:grid;gap:20px;position:sticky;top:92px}
.acard{border:1px solid var(--line);border-radius:var(--radius);padding:22px;background:var(--cream)}
.acard h3{font-size:16px}
.acard .ticks li{font-size:14.5px;margin-bottom:7px}
.acard .fine{margin:14px 0 0;border-top:1px solid var(--line);padding-top:12px}
.acard.dark2{background:#151210;border-color:#151210;padding:0;overflow:hidden;position:relative}
.acard.dark2 img{width:100%;height:130px;object-fit:cover;opacity:.5}
.acard.dark2 .acin{padding:20px}
.acard.dark2 h3{color:#fff}
.acard.dark2 p{color:#b4aca0;font-size:14.5px;margin:0}
.dicon{display:block;width:62px;height:62px;border-radius:50%;overflow:hidden;margin:0 auto 14px;
  border:2px solid var(--gold-bright);box-shadow:0 0 0 5px rgba(255,185,40,.2)}
.dicon img{width:100%;height:100%;object-fit:cover}
@media(max-width:980px){
  .formgrid{grid-template-columns:1fr;gap:30px}
  .aside{position:static}
}

.pcard.gold{background:var(--deep);border-color:var(--deep);color:#fff}
.pcard.gold h3,.pcard.gold .big{color:#fff}
.pcard.gold p:last-child{color:#9b9385}

/* --- logo slogan in the hero --- */
.subslogan{font-family:Inter,system-ui,sans-serif;font-size:11px;letter-spacing:.34em;
  text-transform:uppercase;color:rgba(255,255,255,.55);margin:-8px 0 20px}

/* --- five pillars --- */
.pillars{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.pillar{position:relative;border-radius:var(--radius);overflow:hidden;background:#151210;
  min-height:340px;display:flex;align-items:flex-end}
.pillar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:.4;transition:.5s ease}
.pillar:hover img{opacity:.62;transform:scale(1.06)}
.pillar::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(21,18,16,.25) 20%,rgba(21,18,16,.95))}
.pillar .pin{position:relative;z-index:2;padding:20px}
.pno{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
  border-radius:50%;border:1px solid var(--gold);color:var(--gold);
  font-family:Inter,sans-serif;font-size:11px;letter-spacing:.04em;margin-bottom:12px}
.pillar h3{color:#fff;font-size:15.5px;line-height:1.3;margin-bottom:7px}
.pillar p{color:#aca496;font-size:13.5px;margin:0;line-height:1.5}

/* --- citations --- */
.cites{list-style:none;padding:0;margin:0 0 22px}
.cites li{position:relative;padding-left:20px;margin-bottom:11px;color:var(--muted);font-size:15px}
.cites li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;
  border-radius:50%;background:var(--gold)}
.cites b{color:var(--ink)}
.disclose{background:#fff;border:1px solid var(--line);border-left:3px solid var(--gold);
  border-radius:8px;padding:16px 18px;font-size:14.5px;margin:0}

/* dark-section list ticks stay readable */
.dark .ticks li{color:#b8b0a2}
.dark .ticks li b{color:#fff}

@media(max-width:1100px){.pillars{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.pillars{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.pillars{grid-template-columns:1fr}}

/* ============================================================
   eye2i-style layer: navy hero + wave, checklist, age cards, stats
   ============================================================ */
:root{--navy:#0d1a33;--navy2:#132248}

.e2hero{position:relative;overflow:hidden;background:var(--navy);color:#fff;
  padding:76px 0 130px}
.e2hero .bg{position:absolute;inset:0;z-index:0}
.e2hero .bg img{width:100%;height:100%;object-fit:cover;opacity:.62;
  transform:scale(1.06);animation:drift 26s ease-in-out infinite alternate}
.e2hero .bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,var(--navy) 14%,rgba(13,26,51,.62) 46%,rgba(13,26,51,.22) 78%,rgba(13,26,51,.12) 100%)}
.e2herogrid{position:relative;z-index:2}
.e2herogrid>div{max-width:700px}
.e2hero h1{color:#fff;font-size:clamp(30px,4.6vw,48px);margin:.25em 0 .45em}
.e2hero .lede{color:#c7cee0}
.e2hero .lede.sub{color:var(--gold);font-weight:600;font-family:Inter,system-ui,sans-serif;
  font-size:15px;letter-spacing:.02em;margin-top:-6px}
.e2hero .slogan{color:var(--gold)}
.e2hero .btn.ghost{color:#fff;border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.06)}
.e2hero .btn.ghost:hover{background:rgba(255,255,255,.16)}
.e2hero .wave{position:absolute;left:0;right:0;bottom:-2px;width:100%;height:90px;z-index:2}
.e2hero .wave path{fill:var(--paper)}

.shead.center{max-width:64ch;margin-inline:auto;text-align:center}
.shead.center p{margin-inline:auto}
.center{text-align:center;margin-top:8px}

/* checklist grid ("Why Iris Analysis" style) */
.checkgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:36px 0 30px}
.chk{display:flex;align-items:center;gap:10px;background:var(--cream);
  border:1px solid var(--line);border-radius:10px;padding:14px 16px;
  font-family:Inter,system-ui,sans-serif;font-size:14.5px;font-weight:500}
.ck{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;
  border-radius:50%;background:var(--gold);color:#12100c;font-size:12px;flex:none}

/* age-stage cards */
.agecards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.agecard{position:relative;border-radius:var(--radius);overflow:hidden;min-height:210px;
  display:flex;align-items:flex-end;background:#151210}
.agecard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:.5;transition:.5s}
.agecard:hover img{opacity:.68;transform:scale(1.05)}
.agecard::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 25%,rgba(11,9,7,.93))}
.agecard .ain{position:relative;z-index:2;padding:18px}
.agecard b{color:var(--gold);font-family:Inter,sans-serif;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase}
.agecard h3{color:#fff;font-size:17px;margin:4px 0 6px}
.agecard p{color:#bdb5a8;font-size:13.5px;margin:0}

/* stat counter strip */
.stats{background:var(--navy);padding:44px 0}
.statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center}
.statgrid b{display:block;font-family:Inter,system-ui,sans-serif;font-size:38px;
  color:var(--gold);font-weight:700;line-height:1}
.statgrid span{display:block;margin-top:8px;color:#aeb6cc;font-size:13px;
  font-family:Inter,sans-serif;letter-spacing:.04em}

@media(max-width:980px){
  .checkgrid{grid-template-columns:1fr 1fr}
  .agecards{grid-template-columns:1fr 1fr}
  .statgrid{grid-template-columns:1fr 1fr;gap:28px}
}
@media(max-width:620px){
  .checkgrid,.agecards{grid-template-columns:1fr}
  .statgrid{grid-template-columns:1fr 1fr}
  .e2hero{padding:56px 0 100px}
}

/* ============================================================
   Engagement layer: glowing CTA, live counter, value cards, testimonials
   ============================================================ */

/* glowing primary CTA — impossible to miss */
.btn-glow{position:relative;
  background:linear-gradient(180deg,var(--gold-bright) 0%,var(--gold) 100%);
  border-color:var(--gold-bright);
  color:#12100c;font-size:17px;font-weight:800;letter-spacing:.01em;
  padding:18px 38px;
  box-shadow:0 12px 32px rgba(255,185,40,.48),0 0 0 1px rgba(255,220,100,.35) inset}
.btn-glow:hover{
  background:linear-gradient(180deg,var(--gold-hover) 0%,var(--gold-bright) 100%);
  border-color:var(--gold-hover);color:#12100c;
  box-shadow:0 14px 36px rgba(255,200,60,.55),0 0 0 1px rgba(255,230,120,.45) inset}
.btn-glow::after{content:"";position:absolute;inset:-6px;border-radius:999px;
  border:2px solid rgba(255,200,60,.75);animation:btnpulse 2.2s ease-out infinite}
@keyframes btnpulse{
  0%{transform:scale(.96);opacity:.9}
  70%{transform:scale(1.18);opacity:0}
  100%{opacity:0}
}
@media(prefers-reduced-motion:reduce){.btn-glow::after{animation:none}}

/* live counter under the hero CTA */
.livecount{display:inline-flex;align-items:center;gap:8px;margin:16px 0 0;
  font-family:Inter,system-ui,sans-serif;font-size:13px;color:#cfc7b9}
.livecount .dot{width:7px;height:7px;border-radius:50%;background:#3fce74;
  box-shadow:0 0 0 0 rgba(63,206,116,.6);animation:dotping 1.8s ease-out infinite}
@keyframes dotping{
  0%{box-shadow:0 0 0 0 rgba(63,206,116,.55)}
  70%{box-shadow:0 0 0 7px rgba(63,206,116,0)}
  100%{box-shadow:0 0 0 0 rgba(63,206,116,0)}
}

/* report value cards */
.valuecards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.vcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:24px;text-align:left;transition:.2s}
.vcard:hover{border-color:var(--gold);box-shadow:0 10px 28px rgba(23,20,16,.07);transform:translateY(-2px)}
.vic{font-size:28px;display:block;margin-bottom:12px}
.vcard h3{font-size:16px;margin-bottom:6px}
.vcard p{margin:0;color:var(--muted);font-size:14.5px}

/* testimonials: right-to-left infinite marquee */
.testisec{overflow:hidden}
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mtrack{display:flex;gap:20px;width:max-content;animation:marquee 38s linear infinite}
.marquee:hover .mtrack{animation-play-state:paused}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.mtrack{animation:none;overflow-x:auto}}

.tcard{flex:0 0 300px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:22px;display:flex;flex-direction:column;gap:12px}
.tav{width:38px;height:38px;border-radius:50%;color:#fff;font-weight:700;
  display:flex;align-items:center;justify-content:center;font-family:Inter,sans-serif;font-size:15px}
.tquote{margin:0;color:var(--ink);font-size:14.5px;line-height:1.55;flex:1}
.tname{margin:0;font-family:Inter,system-ui,sans-serif;font-size:12.5px;font-weight:600;color:var(--muted)}
.tname span{font-weight:400}

.temptystate{text-align:center;background:var(--cream);border:1px dashed var(--line);
  border-radius:var(--radius);padding:40px 24px}
.temptystate p{color:var(--muted);margin:0 0 16px}

@media(max-width:980px){.valuecards{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.valuecards{grid-template-columns:1fr}.tcard{flex-basis:250px}}

/* nav CTA: white text on the dark pill, gold border to catch the eye */
.nav .btn.small{color:#12100c;background:linear-gradient(180deg,var(--gold-bright),var(--gold));
  border:1.5px solid var(--gold-bright);box-shadow:0 4px 14px rgba(255,185,40,.35)}
.nav .btn.small:hover{color:#12100c;background:linear-gradient(180deg,var(--gold-hover),var(--gold-bright));
  border-color:var(--gold-hover)}

.hint{display:block;margin-top:6px;font-size:12px;font-weight:400;color:var(--muted)}
