/* AI Vaping holding site: tokens and look taken from the design prototype (ink, lime, stone; condensed uppercase headings; square, flat, no shadows). No external fonts or scripts. */
:root{
  --ink:#111110; --paper:#fff; --lime:#C8FF00; --stone:#EAEAE7;
  --line:rgb(17 17 16 / .14); --line-dark:rgb(255 255 255 / .2);
  --muted:#5C5C58; --muted-dark:rgb(255 255 255 / .72);
  --f-head:"Barlow Condensed","Arial Narrow","Roboto Condensed",Arial,sans-serif;
  --f-body:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --wrap:1100px; --gut:clamp(16px,3vw,40px);
  --ease:cubic-bezier(.2,.7,.2,1);
  --t-h1:clamp(40px,6vw,80px);
  --t-h2:clamp(30px,3.8vw,48px);
  --t-h3:clamp(22px,2.2vw,28px);
  --s-section:clamp(48px,6vw,88px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--f-body)}
a{color:inherit}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,p,dl,dd,dt{margin:0}
::selection{background:var(--lime);color:var(--ink)}
:focus-visible{outline:3px solid var(--lime);outline-offset:2px;box-shadow:0 0 0 5px var(--ink)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.skip{position:absolute;left:-999px;top:0;background:var(--lime);color:var(--ink);padding:10px 14px;z-index:99}
.skip:focus{left:8px;top:8px}

/* header */
.header{background:var(--ink);color:var(--paper)}
.header__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 32px;padding-top:16px;padding-bottom:16px}
.logo{font:700 30px/1 var(--f-head);letter-spacing:.02em;text-transform:uppercase;color:var(--lime);text-decoration:none}
.logo span{color:var(--paper);margin-left:.12em}
.nav{display:flex;gap:28px}
.nav a{display:inline-block;padding:10px 0;font:700 16px/1 var(--f-head);letter-spacing:.07em;text-transform:uppercase;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 2px no-repeat;transition:background-size .25s var(--ease)}
.nav a:hover,.nav a[aria-current]{background-size:100% 2px}
.nav a[aria-current]{color:var(--lime)}

/* sections: neighbours always differ (white, stone, one ink band) */
.section{padding:var(--s-section) 0;background:var(--paper)}
.section--stone{background:var(--stone)}
.section--ink{background:var(--ink);color:var(--paper)}
h1{font:700 var(--t-h1)/.95 var(--f-head);text-transform:uppercase;letter-spacing:-.005em;max-width:20ch;text-wrap:balance}
h2{font:700 var(--t-h2)/1 var(--f-head);text-transform:uppercase;letter-spacing:-.005em;margin-bottom:24px}
h3{font:700 var(--t-h3)/1.05 var(--f-head);text-transform:uppercase}
.lead{max-width:62ch;margin-top:24px;font-size:clamp(18px,1.6vw,21px);line-height:1.5}
.eyebrow,.meta,.tag{font:700 12px/1.4 var(--f-body);letter-spacing:.08em;text-transform:uppercase}
.crumb{margin-bottom:20px;color:var(--muted)}
.crumb a{display:inline-block;padding:6px 0}
.meta{margin-top:28px;max-width:70ch;color:var(--muted)}
.meta strong{color:var(--ink)}
.note{margin-top:20px;max-width:62ch;padding:12px 16px;border-left:6px solid var(--lime);background:var(--stone)}
.contact{margin-top:28px;font-weight:700}
.prose p{max-width:68ch}
.prose p+p,.prose p+ul,.prose ul+p{margin-top:16px}
.prose a,.link{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}
.prose a:hover,.link:hover{background:var(--lime)}
.section--ink a:hover{background:transparent}

/* status chips */
.tag{display:inline-block;padding:5px 9px;background:var(--ink);color:var(--lime);vertical-align:middle}
.tag--set{background:var(--lime);color:var(--ink);outline:1.5px solid var(--ink);outline-offset:-1.5px}
.tag--open{background:transparent;color:var(--ink);outline:1.5px solid var(--ink);outline-offset:-1.5px}

/* dated list */
.timeline{border-bottom:1px solid var(--line)}
.timeline li{display:grid;grid-template-columns:minmax(150px,210px) minmax(0,1fr);gap:8px 32px;padding:26px 0;border-top:1px solid var(--line)}
.date{font:700 clamp(24px,2.4vw,32px)/1.05 var(--f-head);text-transform:uppercase}
.date .tag{display:block;margin-top:10px;width:max-content;max-width:100%}
.timeline h3{margin-bottom:10px}
.timeline p{max-width:66ch}
.timeline p+p{margin-top:10px}
.sub{margin:48px 0 20px}
h2+.sub{margin-top:0}

/* facts list */
.facts{border-bottom:1px solid var(--line)}
.facts>div{display:grid;grid-template-columns:minmax(150px,210px) minmax(0,1fr);gap:6px 32px;padding:18px 0;border-top:1px solid var(--line)}
.facts dt{font:700 12px/1.5 var(--f-body);letter-spacing:.08em;text-transform:uppercase;padding-top:4px}
.facts dd{max-width:66ch}
.facts dd+dd{margin-top:8px}

/* numbered list */
.steps{counter-reset:s;max-width:66ch;margin-top:20px}
.steps li{counter-increment:s;position:relative;padding:14px 0 14px 56px;border-top:1px solid var(--line)}
.steps li::before{content:counter(s);position:absolute;left:0;top:10px;font:700 34px/1 var(--f-head);color:var(--ink)}
.steps li:last-child{border-bottom:1px solid var(--line)}

/* cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:20px}
.card{display:flex;flex-direction:column;gap:12px;padding:24px;background:var(--paper);color:var(--ink);border:2px solid var(--ink);text-decoration:none;transition:background-color .2s var(--ease)}
a.card:hover{background:var(--lime)}
.card h2,.card h3{margin:0}
.card .meta{margin-top:auto;padding-top:8px}
.section--stone .card{border-color:var(--ink)}
.section--ink .card{background:transparent;color:var(--paper);border:1px solid var(--line-dark);border-top:6px solid var(--lime)}
.section--ink a.card:hover{background:var(--lime);color:var(--ink)}
.section--ink .card .meta{color:var(--muted-dark)}
.section--ink a.card:hover .meta{color:var(--ink)}
.card--plain{border-color:var(--line)}
.card--plain h3{font-size:clamp(22px,2vw,26px)}

.fine{margin-top:16px;max-width:62ch;color:var(--muted-dark)}

/* sources */
.sources li{padding:10px 0;border-top:1px solid var(--line);max-width:80ch}
.sources li:last-child{border-bottom:1px solid var(--line)}
.sources .src{color:var(--muted);font-size:15px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;border:2px solid var(--ink);border-radius:0;background:var(--ink);color:var(--lime);font:700 18px/1 var(--f-head);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;transition:background-color .2s var(--ease),color .2s var(--ease)}
.btn:hover{background:var(--paper);color:var(--ink)}
.btn--ghost{background:transparent;color:var(--ink)}
.btn--ghost:hover{background:var(--ink);color:var(--lime)}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}

/* footer */
.footer{background:var(--ink);color:var(--paper);padding:56px 0 28px}
.footer__grid{display:grid;grid-template-columns:5fr 3fr;gap:32px}
.footer h2{font:700 13px/1 var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--lime);margin-bottom:14px}
.footer li{color:var(--muted-dark)}
.footer li a{display:inline-block;padding:5px 0;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1.5px no-repeat;transition:background-size .25s var(--ease)}
.footer li a:hover{background-size:100% 1.5px;color:var(--paper)}
.logo--lg{font-size:40px}
.footer__warn{margin-top:18px;max-width:38ch;padding:12px 14px;border:1px solid var(--line-dark);font-size:15px}
.footer__legal{margin-top:40px;padding-top:20px;border-top:1px solid var(--line-dark);font-size:14px;color:var(--muted-dark)}

@media (max-width:720px){
  body{font-size:16px}
  .timeline li,.facts>div{grid-template-columns:1fr;gap:6px}
  .date .tag{display:inline-block;margin:0 0 0 8px}
  .footer__grid{grid-template-columns:1fr}
  .header__in{gap:4px 24px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
