/* Silent Service Advocacy — The 30-Year War landing
   Palette: Shadow Grey #1D2331 · Platinum #F2F3F5 · Tangerine #E12E1D
   Gold #FFD902 · Digital Blue #0A70F7 · Ground #0e141b */

*{box-sizing:border-box;}
html,body{margin:0;background:#0e141b;scroll-behavior:smooth;}
#vh-root{background:#0e141b;font-family:'Poppins',sans-serif;font-weight:300;color:#F2F3F5;}
a{color:#0A70F7;text-decoration:none;}
a:hover{color:#F2F3F5;}
img{max-width:100%;}

/* ── reveal / rise animations ── */
@keyframes riseB{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.riseB{animation:riseB .7s ease-out both;}
@keyframes revealUp{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
[data-reveal].in{animation:revealUp .6s ease-out both;}
#vh-root.rm [data-reveal]{animation:none !important;}
@media(prefers-reduced-motion:reduce){.riseB,[data-reveal].in{animation:none !important;}}

/* ── header ── */
#vh-header{position:sticky;top:0;z-index:60;display:flex;align-items:center;justify-content:space-between;
  padding:20px 7vw;gap:20px;transition:background .3s ease,backdrop-filter .3s ease,border-color .3s ease;
  border-bottom:1px solid transparent;}
#vh-header.scrolled{background:rgba(14,20,27,.86);backdrop-filter:blur(12px);border-bottom-color:rgba(242,243,245,.1);}
.brand{display:flex;align-items:center;gap:16px;}
.brand-logo{height:30px;width:auto;display:block;}
.brand-sub{font-family:'Bebas Neue',sans-serif;letter-spacing:.3em;font-size:13px;color:rgba(242,243,245,.65);
  border-left:1px solid rgba(242,243,245,.2);padding-left:16px;}
.nav{display:flex;gap:34px;align-items:center;font-size:14px;}
.vh-nav-links{display:flex;gap:34px;align-items:center;}
.vh-nav-links a{color:rgba(242,243,245,.8);white-space:nowrap;}
@media(max-width:1080px){.vh-nav-links{display:none;}}

/* ── buttons ── */
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;
  font-family:'Poppins',sans-serif;font-weight:500;cursor:pointer;white-space:nowrap;text-align:center;
  border:1px solid transparent;background:transparent;transition:background .2s ease;}
.btn-primary{border-color:#0A70F7;color:#F2F3F5;}
.btn-primary:hover{background:rgba(10,112,247,.14);color:#F2F3F5;}
.btn-ghost{border-color:rgba(242,243,245,.35);color:#F2F3F5;}
.btn-ghost:hover{background:rgba(242,243,245,.08);color:#F2F3F5;}
.btn-sm{height:40px;padding:0 22px;font-size:14px;flex-shrink:0;}
.btn-lg{height:52px;padding:0 32px;font-size:16px;flex-shrink:0;}

/* ── layout helpers ── */
.sec{padding:clamp(96px,15vh,190px) 7vw;scroll-margin-top:84px;}
.sec-light{background:#F2F3F5;color:#1D2331;}
.sec-dark{background:#1D2331;}
.sec-ground{background:#0e141b;}
.wrap{max-width:1180px;margin:0 auto;}
.wrap-narrow{max-width:760px;margin:0 auto;}
.wrap-mid{max-width:800px;margin:0 auto;}
.wrap-vote{max-width:1080px;margin:0 auto;position:relative;}
.wrap-reg{max-width:820px;margin:0 auto;position:relative;}
.wrap-faq{max-width:840px;margin:0 auto;}
.center{text-align:center;}
.mx-auto{margin-left:auto;margin-right:auto;}
.mb-sm{margin-bottom:22px;}
.mb-md{margin-bottom:24px;}
.mb-lg{margin-bottom:40px;}
.mt-sm{margin-top:16px;}
.mt-lg{margin-top:30px;}
.w-24{max-width:24ch;}
.w-48{max-width:48ch;}
.w-52{max-width:52ch;}
.w-56{max-width:56ch;}
.w-58{max-width:58ch;}
.w-62{max-width:62ch;}

/* ── shared type ── */
.eyebrow{font-family:'Bebas Neue',sans-serif;letter-spacing:.4em;font-size:14px;}
.eyebrow-red{color:#E12E1D;}
.eyebrow-gold{color:#FFD902;}
.h2{font-family:'Sora',sans-serif;font-weight:800;font-size:clamp(30px,4vw,56px);line-height:1.06;
  letter-spacing:-.015em;margin:0;text-wrap:balance;}
.h2-tight{max-width:20ch;}
.h2-xl{font-size:clamp(32px,4.6vw,64px);line-height:1.03;letter-spacing:-.02em;}
.h2.ink,.ink{color:#1D2331;}
.para-dark{font-size:clamp(16px,1.5vw,20px);line-height:1.75;color:rgba(242,243,245,.72);margin:26px 0 0;}
.para-faint{font-size:clamp(15px,1.3vw,17px);line-height:1.7;color:rgba(242,243,245,.55);margin:22px 0 0;}
.para-ink{font-size:clamp(16px,1.5vw,20px);line-height:1.75;color:rgba(29,35,49,.74);margin:24px 0 0;}

/* ── hero ── */
.hero{min-height:88vh;display:flex;flex-direction:column;justify-content:center;
  padding:8vh 7vw 14vh;position:relative;overflow:hidden;}
.hero-marble{position:absolute;right:-10vw;top:-12vh;height:130vh;opacity:.05;pointer-events:none;}
.hero-inner{max-width:1100px;margin:0 auto;text-align:center;position:relative;}
.hero .eyebrow{letter-spacing:.5em;font-size:15px;margin-bottom:34px;}
.hero-h1{margin:0;}
.hero-line{display:block;font-family:'Sora',sans-serif;font-weight:800;font-size:clamp(38px,5.4vw,80px);
  line-height:1.04;letter-spacing:-.025em;text-wrap:balance;}
.hero-line-gold{color:#FFD902;margin-top:10px;}
.hero-lede{font-size:clamp(16px,1.5vw,20px);line-height:1.7;color:rgba(242,243,245,.72);
  max-width:52ch;margin:36px auto 0;}
.hero-cta{display:flex;gap:16px;align-items:center;justify-content:center;margin-top:44px;flex-wrap:wrap;}
.hero-tag{margin-top:64px;font-family:'Bebas Neue',sans-serif;letter-spacing:.3em;font-size:12px;color:rgba(242,243,245,.4);}

/* ── opening (excerpt) ── */
.lead-para{font-family:'Sora',sans-serif;font-weight:700;font-size:clamp(24px,3vw,38px);line-height:1.2;
  letter-spacing:-.015em;color:#1D2331;margin:0;text-wrap:balance;}
.body-para{font-size:clamp(17px,1.6vw,21px);line-height:1.85;color:rgba(29,35,49,.74);margin:28px 0 0;}
.pull{font-family:'Sora',sans-serif;font-weight:600;color:#E12E1D;}
.pull-red.pull-narrow{font-size:clamp(19px,2.1vw,27px);line-height:1.35;margin:48px 0;max-width:26ch;}
.pull-red.pull-wide{font-size:clamp(22px,2.6vw,34px);line-height:1.3;margin:52px 0;max-width:24ch;}
.stmt{font-family:'Sora',sans-serif;font-weight:700;font-size:clamp(21px,2.3vw,30px);line-height:1.3;color:#1D2331;margin:32px 0 0;}
.em-ink{font-style:normal;color:#1D2331;}
.em-ink-light{font-style:normal;color:#F2F3F5;}
.excerpt-mark{display:flex;align-items:center;gap:10px;margin-top:52px;}
.dot{border-radius:50%;}
.dot-red{width:11px;height:11px;background:#E12E1D;}
.dot-gold{width:8px;height:8px;background:#FFD902;}
.excerpt-label{font-family:'Bebas Neue',sans-serif;letter-spacing:.24em;font-size:13px;color:rgba(29,35,49,.55);margin-left:6px;}

/* ── book ── */
.booksec{display:grid;grid-template-columns:.85fr 1.15fr;gap:6vw;align-items:center;}
.book-covers{display:flex;gap:18px;justify-content:center;align-items:flex-start;}
.book-fig{margin:0;flex:1;max-width:220px;}
.book-fig img{display:block;width:100%;height:auto;border-radius:5px;
  box-shadow:0 24px 50px rgba(29,35,49,.32);border:1px solid rgba(29,35,49,.12);}
.book-fig figcaption{font-family:'Bebas Neue',sans-serif;letter-spacing:.2em;font-size:11px;
  color:rgba(29,35,49,.55);text-align:center;margin-top:10px;}
.meta-grid{display:grid;grid-template-columns:auto 1fr;column-gap:20px;row-gap:10px;margin-top:30px;max-width:46ch;align-items:baseline;}
.meta-key{font-family:'Poppins',sans-serif;font-weight:700;color:#0A70F7;font-size:12px;letter-spacing:.1em;}
.meta-val{font-size:15px;line-height:1.45;color:rgba(29,35,49,.78);}
.link-strong{color:#0A70F7;font-weight:500;}
.ded{font-family:'Sora',sans-serif;font-weight:600;font-style:italic;font-size:clamp(16px,1.5vw,19px);
  line-height:1.5;color:#1D2331;margin:28px 0 0;max-width:44ch;}

/* ── vote ── */
.vote-sec{position:relative;overflow:hidden;}
.vote-lines{position:absolute;inset:0;pointer-events:none;
  background-image:repeating-linear-gradient(180deg,rgba(242,243,245,.045) 0 1px,transparent 1px 70px);}
.ss-vote-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px);margin-top:56px;align-items:start;}
.vote-col{display:flex;flex-direction:column;gap:24px;}
.vote-card{position:relative;border-radius:10px;overflow:hidden;
  box-shadow:0 30px 60px rgba(0,0,0,.5);border:1px solid rgba(242,243,245,.1);}
.vote-card img{display:block;width:100%;height:auto;}
.vote-pick{position:absolute;top:14px;left:14px;background:#FFD902;color:#1D2331;
  font-family:'Bebas Neue',sans-serif;letter-spacing:.14em;font-size:13px;padding:5px 12px 3px;border-radius:3px;}
.vote-meta{text-align:center;}
.vote-title{font-family:'Sora',sans-serif;font-weight:700;font-size:18px;color:#F2F3F5;margin-top:8px;}
.vote-sub{font-size:13px;line-height:1.7;color:rgba(242,243,245,.55);margin:14px auto 0;max-width:34ch;}
.vote-btn{height:50px;padding:0 28px;font-size:15px;align-self:center;min-width:194px;}

/* ── survey form ── */
.survey-form{max-width:720px;margin:52px auto 0;background:rgba(242,243,245,.04);
  border:1px solid rgba(242,243,245,.12);border-radius:20px;padding:clamp(24px,4vw,40px);}
.survey-head{font-family:'Sora',sans-serif;font-weight:700;font-size:clamp(19px,2.2vw,24px);color:#F2F3F5;}
.survey-sub{font-size:14.5px;line-height:1.6;color:rgba(242,243,245,.66);margin:8px 0 26px;}
.ss-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.field{height:50px;padding:0 16px;border-radius:10px;border:1px solid rgba(242,243,245,.2);
  background:rgba(242,243,245,.06);color:#F2F3F5;font-family:'Poppins',sans-serif;font-weight:300;
  font-size:15px;outline:none;width:100%;}
.field:focus{border-color:#0A70F7;}
.field::placeholder{color:rgba(242,243,245,.45);}
.select{padding:0 12px;}
.select:invalid{color:rgba(242,243,245,.45);}
.select option{color:#1D2331;}
.field-label{display:block;}
.field-cap{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  color:rgba(242,243,245,.5);margin-bottom:7px;}
.textarea{display:block;height:auto;padding:14px 16px;line-height:1.55;resize:vertical;margin-top:16px;}
.checks{display:flex;flex-direction:column;gap:14px;margin-top:22px;}
.check{display:flex;align-items:flex-start;gap:12px;font-size:14.5px;line-height:1.5;
  color:rgba(242,243,245,.78);cursor:pointer;}
.check input{width:18px;height:18px;margin-top:2px;accent-color:#0A70F7;flex-shrink:0;}
.check-fine{font-size:13.5px;color:rgba(242,243,245,.62);}
.fineprint{font-size:12.5px;line-height:1.55;color:rgba(242,243,245,.45);margin-top:18px;max-width:60ch;}
.survey-form .fineprint{margin-top:18px;}

/* ── survey done / tally ── */
.survey-done{max-width:640px;margin:52px auto 0;text-align:center;background:rgba(242,243,245,.04);
  border:1px solid rgba(242,243,245,.12);border-radius:20px;padding:clamp(28px,4vw,44px);}
.done-h3{font-family:'Sora',sans-serif;font-weight:800;font-size:clamp(22px,2.6vw,32px);color:#F2F3F5;margin:14px 0 0;}
.done-sub{font-size:15px;line-height:1.6;color:rgba(242,243,245,.68);margin:14px 0 30px;}
.tally{text-align:left;display:flex;flex-direction:column;gap:18px;}
.tally-row{display:flex;justify-content:space-between;font-size:13px;color:rgba(242,243,245,.8);margin-bottom:6px;}
.tally-track{height:10px;border-radius:6px;background:rgba(242,243,245,.1);overflow:hidden;}
.tally-bar{height:100%;width:0;transition:width .5s ease;}
.tally-bar-gold{background:#FFD902;}
.tally-bar-red{background:#E12E1D;}
.survey-done .fineprint{margin-top:22px;}

/* ── thirty / why ── */
.why-lead{font-family:'Sora',sans-serif;font-weight:600;font-size:clamp(22px,2.8vw,38px);line-height:1.25;
  letter-spacing:-.01em;color:#1D2331;margin:0;text-wrap:balance;}

/* ── register ── */
.register-sec{background:radial-gradient(120% 130% at 82% 12%,#232c40 0%,#1D2331 58%);
  padding:clamp(120px,18vh,220px) 7vw;position:relative;overflow:hidden;}
.reg-eyebrow{letter-spacing:.42em;font-size:15px;}
.reg-form{display:inline-flex;align-items:center;background:rgba(242,243,245,.08);
  border:1px solid rgba(242,243,245,.2);border-radius:999px;padding:7px 7px 7px 24px;gap:10px;
  margin:40px auto 0;flex-wrap:wrap;justify-content:center;}
.reg-input{background:transparent;border:none;outline:none;color:#F2F3F5;
  font-family:'Poppins',sans-serif;font-size:16px;width:240px;}
.reg-input::placeholder{color:rgba(242,243,245,.45);}
.reg-btn{height:48px;padding:0 30px;font-size:16px;}
.hp{position:absolute;left:-5000px;}
.reg-fine{font-size:11px;color:rgba(242,243,245,.5);margin-top:18px;}

/* ── trust pillars ── */
.sb-4{display:grid;grid-template-columns:repeat(4,1fr);gap:44px 36px;margin-top:80px;}
.pillar{border-left:2px solid #0A70F7;padding:6px 0 6px 20px;}
.pillar-h{font-family:'Sora',sans-serif;font-weight:700;font-size:18px;margin:0 0 10px;color:#1D2331;}
.pillar-p{font-size:14.5px;line-height:1.6;color:rgba(29,35,49,.7);margin:0;}

/* ── faq ── */
.vh-faq{border-top:1px solid rgba(242,243,245,.14);padding:24px 0;}
.vh-faq-last{border-bottom:1px solid rgba(242,243,245,.14);}
.vh-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;
  gap:20px;font-family:'Sora',sans-serif;font-weight:600;font-size:clamp(17px,1.8vw,21px);color:#F2F3F5;}
.vh-faq summary::-webkit-details-marker{display:none;}
.vh-q-plus{color:#E12E1D;font-size:26px;transition:transform .25s ease;line-height:1;}
.vh-faq[open] .vh-q-plus{transform:rotate(45deg);}
.faq-a{font-size:15.5px;line-height:1.7;color:rgba(242,243,245,.7);margin:16px 0 0;max-width:70ch;}

/* ── footer ── */
.footer{background:#0a0e14;padding:clamp(48px,7vh,88px) 7vw 40px;border-top:1px solid rgba(242,243,245,.08);}
.footer-top{max-width:1180px;margin:0 auto;display:flex;justify-content:space-between;gap:40px;
  flex-wrap:wrap;align-items:flex-start;}
.footer-brand{max-width:32ch;}
.footer-logo{height:32px;width:auto;display:block;margin-bottom:18px;}
.footer-blurb{font-size:13.5px;line-height:1.6;color:rgba(242,243,245,.5);margin:16px 0 0;}
.footer-cols{display:flex;gap:56px;flex-wrap:wrap;}
.footer-col{display:flex;flex-direction:column;gap:12px;font-size:14px;}
.footer-cap{font-size:12px;letter-spacing:.2em;color:rgba(242,243,245,.4);text-transform:uppercase;}
.footer-col a{color:rgba(242,243,245,.75);}
.footer-bottom{max-width:1180px;margin:44px auto 0;padding-top:22px;border-top:1px solid rgba(242,243,245,.08);
  display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:12.5px;color:rgba(242,243,245,.42);}
.footer-legal{max-width:74ch;}

/* ── responsive ── */
@media(max-width:880px){.sb-4{grid-template-columns:1fr 1fr;}.booksec{grid-template-columns:1fr;}}
@media(max-width:720px){.ss-vote-grid{grid-template-columns:1fr;}.ss-form-grid{grid-template-columns:1fr;}}

/* ── mobile: single sign-up, button outside the field box ── */
@media(max-width:720px){
  /* remove the header sign-up (register lives in the page body) */
  #vh-header .btn-sm{display:none;}
  /* register pill unwraps: input on top, full-width button beneath */
  .reg-form{display:flex;flex-direction:column;align-items:stretch;gap:12px;
    background:transparent;border:none;border-radius:0;padding:0;width:100%;max-width:420px;}
  .reg-input{width:100%;height:52px;padding:0 18px;border-radius:12px;
    border:1px solid rgba(242,243,245,.24);background:rgba(242,243,245,.06);}
  .reg-btn{width:100%;height:52px;}
}


/* ── GPU acceleration for smooth fast-scroll (no reflow-heavy props) ── */
.hero, section, .card, .vote-card, img, .animate-on-scroll {
  will-change: transform, opacity;
  transform: translateZ(0);
  backface-visibility: hidden;
  perspective: 1000px;
}
/* prevent layout shift while images load */
img { content-visibility: auto; }

/* ── centered-wrapper text alignment (centered contexts only) ── */
.center, .wrap-reg { text-align: center; }
.center h1, .center h2, .center h3, .center p, .center .eyebrow,
.wrap-reg h1, .wrap-reg h2, .wrap-reg h3, .wrap-reg p, .wrap-reg .eyebrow { text-align: center; }
/* keep intentionally left-aligned blocks left */
.tally, .survey-form, .survey-form * { text-align: left; }
/* centre the max-width blocks themselves — mx-auto is otherwise overridden
   by component margin shorthands (.para-dark{margin:26px 0 0}, .h2{margin:0}).
   Doubled class raises specificity so auto margins always win. */
.mx-auto.mx-auto { margin-left: auto; margin-right: auto; }