/* ============================================================
   v5-kit.css — Terawatt v5 unified component system
   ------------------------------------------------------------
   ONE set of components, driven entirely by the palette tokens
   (--tw-bg / -fg / -mark / -line / -slogan-fg / -data-bg + the
   Inter Tight / Inter / JetBrains Mono stack). Drop any block on
   any page, give the section a .tw-pal-* class, and it inherits
   that page's colour scheme automatically.

   Replaces the per-page "cycle" CSS in page-v4-*.php:
     .v5-bcard + .v5-appcard + .v5-pillar      -> .v5-card  (one card)
     .v5-peakband + .v5-cloudband + .v5-billband -> .v5-section--band (one band)
     hero one-offs                              -> .v5-hero
     5x ad-hoc buttons                          -> .v5-btn / .v5-cta-card / .v5-cta-bar
   Restores the final-system rule: every section eyebrow carries
   its sub-brand mark.
   ============================================================ */

:root{
  --v5-ease: cubic-bezier(.2,.7,.2,1); /* @kind other */
  --v5-rhythm: clamp(72px, 9vw, 128px); /* @kind spacing */
  --v5-radius: 8px;
}

/* on-mark text colour (buttons / badges sitting on the accent fill) */
.tw-pal-master-saffron,.tw-pal-solar-bone,.tw-pal-solar-hi,.tw-pal-solar-dark,.tw-pal-bone-warm{ --v5-on-mark:#1A1D21; }
.tw-pal-peak-light,.tw-pal-peak-dark{ --v5-on-mark:#FFFFFF; }
.tw-pal-cloud-night,.tw-pal-cloud-day{ --v5-on-mark:#08233B; }

/* ============================================================
   SECTION CHASSIS  (two modes: panel + band)
   ============================================================ */
.v5-section{ position:relative; padding:var(--v5-rhythm) 0; background:var(--tw-bg); color:var(--tw-fg); overflow:hidden; }
.v5-section + .v5-section{ border-top:1px solid var(--tw-line); }
.v5-section .cont{ position:relative; z-index:1; }

/* full-bleed photographic band */
.v5-section--band{ isolation:isolate; }
.v5-section__media{ position:absolute; inset:0; z-index:-2; }
.v5-section__media img{ width:100%; height:100%; object-fit:cover; display:block; filter:saturate(.9) contrast(1.02); }
.v5-section__fallback{ position:absolute; inset:0; z-index:-3; background:var(--tw-bg); }
.v5-section__scrim{ position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg, rgba(12,14,16,.82) 0%, rgba(12,14,16,.60) 35%, rgba(12,14,16,.80) 75%, rgba(12,14,16,.93) 100%); }

/* large faint sub-brand mark anchored in the corner (final-system "watermark") */
.v5-section__wm{ position:absolute; top:clamp(24px,5vw,72px); right:clamp(16px,4vw,64px);
  width:clamp(120px,16vw,260px); height:auto; color:var(--tw-mark); opacity:.06; pointer-events:none; z-index:0; }
.v5-section--band .v5-section__wm{ opacity:.12; }

/* ============================================================
   SECTION HEAD  (eyebrow carries its mark)
   ============================================================ */
.v5-head{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.45fr); gap:clamp(24px,5vw,80px); align-items:end; }
.v5-head--stack{ grid-template-columns:1fr; gap:18px; }
@media(max-width:980px){ .v5-head{ grid-template-columns:1fr; gap:20px; } }

.v5-eyebrow{ display:inline-flex; align-items:center; gap:10px; font-family:var(--tw-font-mono);
  font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--tw-slogan-fg); margin:0 0 18px; }
.v5-eyebrow__mark{ width:18px; height:18px; flex:none; color:var(--tw-mark); }
.v5-eyebrow b{ font-weight:500; font-style:normal; color:var(--tw-mark); }   /* index, e.g. SOL · 02 */
.v5-eyebrow em{ font-style:normal; color:var(--tw-fg); }

.v5-h2{ font-family:var(--tw-font-display); font-weight:800; letter-spacing:-.045em; line-height:.98;
  font-size:clamp(2rem,4.6vw,3.625rem); margin:0; text-wrap:balance; max-width:22ch; color:var(--tw-fg); }
.v5-h2 em{ font-style:normal; color:var(--tw-mark); }
.v5-lede{ font-size:clamp(1rem,1.3vw,1.1875rem); line-height:1.55; color:var(--tw-slogan-fg); max-width:56ch; margin:0; text-wrap:pretty; }
.v5-lede strong{ color:var(--tw-fg); font-weight:600; }
.v5-prose{ font-size:1.0625rem; line-height:1.62; color:var(--tw-fg); text-wrap:pretty; }
.v5-prose strong, .v5-prose em{ color:var(--tw-mark); font-weight:500; font-style:normal; }
.v5-prose a{ color:var(--tw-mark); font-weight:500; text-decoration:none; }
.v5-prose a:hover{ text-decoration:underline; }
.v5-prose > * + *{ margin-top:1.15em; }
.v5-prose h2{ font-family:var(--tw-font-display); font-weight:700; letter-spacing:-.03em;
  font-size:clamp(1.375rem,2.4vw,1.875rem); line-height:1.15; margin:1.8em 0 .5em; color:var(--tw-fg); }
.v5-prose h3{ font-family:var(--tw-font-display); font-weight:700; font-size:1.25rem; margin:1.6em 0 .4em; color:var(--tw-fg); }
.v5-prose ul, .v5-prose ol{ padding-left:1.3em; }
.v5-prose li + li{ margin-top:.4em; }
.v5-prose img{ max-width:100%; height:auto; border-radius:4px; }
.v5-prose blockquote{ margin:1.5em 0; padding:4px 0 4px 22px; border-left:3px solid var(--tw-mark); color:var(--tw-fg); font-style:italic; }
.v5-prose code{ font-family:var(--tw-font-mono); font-size:.9em; background:var(--tw-data-bg); padding:2px 6px; border-radius:3px; }

/* Inline form (data-tw-form) status message — set by tw-forms.js. */
.tw-form-status{ margin:12px 0 0; font-family:var(--tw-font-mono); font-size:12px; letter-spacing:.04em; line-height:1.5; }
.tw-form-status.is-ok{ color:var(--tw-mark); }
.tw-form-status.is-err{ color:#F26B1F; }

/* ============================================================
   THE UNIFIED CARD  (replaces bcard / appcard / pillar)
   ============================================================ */
.v5-cards{ display:grid; grid-template-columns:repeat(var(--cols,3),1fr); gap:clamp(18px,2.4vw,28px);
  margin-top:clamp(40px,5vw,64px); align-items:stretch; }
@media(max-width:980px){
  .v5-cards{ grid-template-columns:1fr; }
  /* Stack the card on small screens: the photo gets its own visible block
     instead of sitting behind the gradient + full-height text overlay.
     Deliberately NO aspect-ratio anywhere in the mobile path — on iOS Safari
     the desktop card (height from aspect-ratio + absolute children only)
     collapsed to 0px and the whole grid vanished. Height comes from normal
     flow: the image's own ratio (capped) + the static body. */
  .v5-card{ aspect-ratio:auto; }
  .v5-card__media{ position:static; }
  .v5-card__media img{ height:auto; max-height:300px; object-fit:cover; }
  .v5-card::after{ display:none; }
  .v5-card__body{ position:static; }
}
/* Desktop safety net for engines without aspect-ratio support. */
@supports not (aspect-ratio: 4 / 5){
  .v5-card{ min-height:520px; }
}

.v5-card{ position:relative; display:block; text-decoration:none; color:inherit;
  border-radius:var(--v5-radius); overflow:hidden; aspect-ratio:var(--card-ar,4/5); background:#15171A;
  transition:transform .2s var(--v5-ease); }
a.v5-card:hover{ transform:translateY(-3px); }
.v5-card__media{ position:absolute; inset:0; }
.v5-card__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.v5-card::after{ content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.16) 30%, rgba(0,0,0,.60) 60%, rgba(8,9,10,.94) 100%); }
.v5-card__body{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:22px;
  display:flex; flex-direction:column; gap:8px; color:#F4F1EC; }
.v5-card__tag{ font-family:var(--tw-font-mono); font-size:10px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--card-accent); font-weight:600; display:inline-flex; align-items:center; gap:8px; }
.v5-card__tag .m{ width:14px; height:14px; flex:none; color:var(--card-accent); }
.v5-card__title{ font-family:var(--tw-font-display); font-weight:800; letter-spacing:-.025em;
  font-size:1.4375rem; line-height:1.06; margin:0; color:#FFFFFF; text-wrap:balance; }
.v5-card__meta{ display:flex; flex-wrap:wrap; gap:14px; font-family:var(--tw-font-mono); font-size:9.5px;
  letter-spacing:.16em; text-transform:uppercase; color:rgba(244,241,236,.72); }
.v5-card__meta span{ display:inline-flex; align-items:center; gap:6px; }
.v5-card__meta span::before{ content:""; width:5px; height:5px; border-radius:50%; background:var(--card-accent); }
.v5-card__desc{ font-size:.875rem; line-height:1.5; color:rgba(244,241,236,.85); margin:0; }
.v5-card__desc strong{ color:#FFFFFF; font-weight:600; }
.v5-card__feats{ list-style:none; padding:0; margin:2px 0 0; display:flex; flex-direction:column; gap:5px; }
.v5-card__feats li{ font-family:var(--tw-font-mono); font-size:10.5px; letter-spacing:.05em;
  color:rgba(244,241,236,.78); padding-left:14px; position:relative; }
.v5-card__feats li::before{ content:"—"; position:absolute; left:0; color:var(--card-accent); }
.v5-card__cta{ margin-top:4px; font-family:var(--tw-font-body); font-weight:600; font-size:.875rem;
  color:var(--card-accent); display:inline-flex; gap:6px; align-items:center; }
.v5-card__cta::after{ content:"→"; transition:transform .2s var(--v5-ease); }
a.v5-card:hover .v5-card__cta::after{ transform:translateX(4px); }

/* per-sub-brand accents — set via data-accent="solar|peak|cloud" on the card */
[data-accent="solar"]{ --card-accent:#F2C94C; }
[data-accent="peak"]{  --card-accent:#F4956A; }
[data-accent="cloud"]{ --card-accent:#4DD3FF; }

/* panel variant — no photo, bordered data card with top accent bar */
.v5-card--panel{ aspect-ratio:auto; background:var(--tw-data-bg); border:1px solid var(--tw-line); }
.v5-card--panel::after{ display:none; }
.v5-card--panel::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--card-accent); z-index:3; }
.v5-card--panel .v5-card__body{ position:static; color:var(--tw-fg); padding:clamp(22px,3vw,30px); gap:12px; }
.v5-card--panel .v5-card__title{ color:var(--tw-fg); }
.v5-card--panel .v5-card__desc{ color:var(--tw-slogan-fg); }
.v5-card--panel .v5-card__feats li{ color:var(--tw-slogan-fg); }

/* ============================================================
   HERO  (one system; router or stat aside)
   ============================================================ */
.v5-hero{ position:relative; isolation:isolate; min-height:clamp(560px,80vh,840px); display:flex; align-items:flex-end;
  padding:clamp(116px,15vw,176px) 0 clamp(48px,7vw,88px); overflow:hidden; background:var(--tw-bg); color:#F4F1EC; }
.v5-hero__media{ position:absolute; inset:0; z-index:-3; }
.v5-hero__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.v5-hero__scrim{ position:absolute; inset:0; z-index:-2;
  background:linear-gradient(90deg, rgba(10,12,14,.84) 0%, rgba(10,12,14,.55) 44%, rgba(10,12,14,.12) 100%),
             linear-gradient(180deg, rgba(10,12,14,.20) 0%, rgba(10,12,14,.72) 100%); }
.v5-hero__grid{ display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:clamp(32px,5vw,72px); align-items:end; }
@media(max-width:980px){ .v5-hero__grid{ grid-template-columns:1fr; } }
.v5-hero .v5-eyebrow{ color:rgba(244,241,236,.78); }
.v5-hero .v5-eyebrow em{ color:#FFFFFF; }
.v5-hero h1{ font-family:var(--tw-font-display); font-weight:800; font-size:clamp(2.25rem,5.4vw,4.25rem);
  letter-spacing:-.045em; line-height:1.0; margin:18px 0 0; color:#F4F1EC; text-wrap:balance; max-width:19ch; }
.v5-hero h1 .mark{ color:var(--tw-mark); }
.v5-hero__lede{ margin:20px 0 0; font-size:clamp(1rem,1.3vw,1.1875rem); line-height:1.55; color:rgba(244,241,236,.86); max-width:54ch; text-wrap:pretty; }
.v5-hero__cta{ margin-top:28px; display:flex; gap:12px; flex-wrap:wrap; }

.v5-hero__card{ background:rgba(14,16,18,.62); border:1px solid rgba(244,241,236,.2); border-radius:var(--v5-radius);
  backdrop-filter:blur(12px) saturate(160%); -webkit-backdrop-filter:blur(12px) saturate(160%); overflow:hidden; }
.v5-hero__card-top{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:13px 18px;
  border-bottom:1px solid rgba(244,241,236,.16); font-family:var(--tw-font-mono); font-size:10px; letter-spacing:.2em;
  text-transform:uppercase; color:rgba(244,241,236,.7); }
.v5-hero__card-top .d{ width:6px; height:6px; border-radius:50%; background:var(--tw-mark); display:inline-block; margin-right:8px; }
.v5-hero__router a{ display:block; padding:14px 18px; text-decoration:none; color:inherit; border-bottom:1px solid rgba(244,241,236,.12); transition:background .2s var(--v5-ease); }
.v5-hero__router a:last-child{ border-bottom:0; }
.v5-hero__router a:hover{ background:rgba(244,241,236,.05); }
.v5-hero__router .k{ font-family:var(--tw-font-mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; margin-bottom:5px; }
.v5-hero__router .v{ font-family:var(--tw-font-display); font-weight:700; font-size:1rem; letter-spacing:-.02em; color:#F4F1EC; line-height:1.2; }
.v5-hero__stat{ display:flex; justify-content:space-between; gap:18px; padding:20px 18px; }
.v5-hero__stat .num{ font-family:var(--tw-font-display); font-weight:800; letter-spacing:-.04em; font-size:clamp(1.75rem,3vw,2.5rem); line-height:1; color:#F4F1EC; }
.v5-hero__stat .num .u{ font-size:.42em; opacity:.7; margin-left:4px; font-weight:600; }
.v5-hero__stat .label{ font-family:var(--tw-font-mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:rgba(244,241,236,.7); margin-top:6px; }

/* ============================================================
   CTA SYSTEM  (one button language + promo card + closer bar)
   ============================================================ */
.v5-btn{ font-family:var(--tw-font-body); font-weight:600; font-size:.9375rem; line-height:1; letter-spacing:0;
  padding:14px 22px; border-radius:3px; border:1px solid var(--tw-line); color:var(--tw-fg); text-decoration:none;
  display:inline-flex; align-items:center; gap:10px; cursor:pointer; background:transparent; transition:all .2s var(--v5-ease); }
.v5-btn svg{ width:14px; height:14px; }
.v5-btn:hover{ border-color:var(--tw-mark); color:var(--tw-mark); }
.v5-btn--primary{ background:var(--tw-mark); color:var(--v5-on-mark,#1A1D21); border-color:var(--tw-mark); }
.v5-btn--primary:hover{ filter:brightness(1.08); color:var(--v5-on-mark,#1A1D21); border-color:var(--tw-mark); }
.v5-cta-row{ display:flex; gap:10px; flex-wrap:wrap; }

.v5-cta-card{ background:var(--tw-data-bg); border:1px solid var(--tw-line); border-radius:var(--v5-radius);
  padding:clamp(26px,3vw,34px); display:flex; flex-direction:column; gap:16px; position:relative; overflow:hidden; }
.v5-cta-card__top{ display:flex; justify-content:space-between; align-items:center; gap:16px; padding-bottom:14px; border-bottom:1px solid var(--tw-line); }
.v5-cta-card__lbl{ font-family:var(--tw-font-mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--tw-mark); display:inline-flex; align-items:center; gap:8px; }
.v5-cta-card__lbl::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--tw-mark); }
.v5-cta-card__badge{ font-family:var(--tw-font-mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; background:var(--tw-mark); color:var(--v5-on-mark,#1A1D21); padding:3px 10px; border-radius:99px; font-weight:600; }
.v5-cta-card h3{ font-family:var(--tw-font-display); font-weight:800; letter-spacing:-.025em; font-size:1.5rem; line-height:1.08; margin:0; color:var(--tw-fg); }
.v5-cta-card p{ font-size:.9375rem; line-height:1.55; color:var(--tw-slogan-fg); margin:0; }
.v5-cta-card .tiers{ font-family:var(--tw-font-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--tw-slogan-fg); }

.v5-cta-bar{ margin-top:clamp(40px,5vw,56px); padding:clamp(22px,3vw,30px); border:1px solid var(--tw-line); background:var(--tw-data-bg);
  border-radius:var(--v5-radius); display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; }
.v5-cta-bar__t{ font-family:var(--tw-font-display); font-weight:700; font-size:1.3rem; letter-spacing:-.02em; color:var(--tw-fg); }
.v5-cta-bar__t em{ font-style:normal; color:var(--tw-mark); }

/* ============================================================
   DATA KIT
   ============================================================ */
/* big-number stat row */
.v5-stats{ display:flex; flex-wrap:wrap; gap:clamp(24px,4vw,56px); }
.v5-stat .big{ font-family:var(--tw-font-display); font-weight:800; font-size:clamp(1.875rem,3vw,2.5rem); letter-spacing:-.04em; line-height:1; color:var(--tw-mark); display:block; }
.v5-stat .lbl{ font-family:var(--tw-font-mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--tw-slogan-fg); margin-top:6px; display:block; }

/* spec strip (k / v / u cells) */
.v5-specs{ display:grid; grid-template-columns:repeat(var(--spec-cols,4),1fr); gap:12px; }
@media(max-width:780px){ .v5-specs{ grid-template-columns:repeat(2,1fr); } }
.v5-spec{ padding:14px 16px; border:1px solid var(--tw-line); background:var(--tw-data-bg); border-radius:4px; }
.v5-spec .k{ font-family:var(--tw-font-mono); font-size:9.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--tw-slogan-fg); display:block; }
.v5-spec .v{ font-family:var(--tw-font-display); font-weight:700; font-size:1.0625rem; letter-spacing:-.02em; color:var(--tw-fg); margin-top:4px; display:block; }
.v5-spec .u{ font-family:var(--tw-font-mono); font-size:9.5px; color:var(--tw-slogan-fg); display:block; }

/* tile grid (modes / data cards) */
.v5-tiles{ display:grid; grid-template-columns:repeat(var(--tile-cols,2),1fr); gap:14px; }
@media(max-width:680px){ .v5-tiles{ grid-template-columns:1fr; } }
.v5-tile{ padding:18px; border:1px solid var(--tw-line); background:var(--tw-data-bg); border-radius:4px; display:flex; flex-direction:column; gap:8px; }
.v5-tile__head{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.v5-tile .n{ font-family:var(--tw-font-mono); font-size:9.5px; letter-spacing:.22em; color:var(--tw-mark); font-weight:500; }
.v5-tile .save{ font-family:var(--tw-font-display); font-weight:800; font-size:.9375rem; color:var(--tw-mark); white-space:nowrap; }
.v5-tile h4{ font-family:var(--tw-font-display); font-weight:700; letter-spacing:-.02em; font-size:1.0625rem; line-height:1.15; margin:0; color:var(--tw-fg); }
.v5-tile p{ font-size:.875rem; line-height:1.5; color:var(--tw-slogan-fg); margin:0; }
.v5-tile p strong{ color:var(--tw-fg); font-weight:600; }

/* numbered rows (anatomy / steps) */
.v5-rows{ display:flex; flex-direction:column; gap:12px; }
.v5-row{ display:grid; grid-template-columns:38px 1fr; gap:14px; padding:14px 16px; border:1px solid var(--tw-line); background:var(--tw-data-bg); border-radius:4px; }
.v5-row .n{ font-family:var(--tw-font-mono); font-weight:600; color:var(--tw-mark); font-size:.875rem; }
.v5-row h4{ font-family:var(--tw-font-display); font-size:1rem; letter-spacing:-.02em; margin:0 0 4px; color:var(--tw-fg); }
.v5-row p{ font-size:.875rem; line-height:1.5; color:var(--tw-slogan-fg); margin:0; }

/* features (borderless, top-rule) */
.v5-feats{ display:grid; grid-template-columns:repeat(var(--feat-cols,2),1fr); gap:18px 28px; }
@media(max-width:560px){ .v5-feats{ grid-template-columns:1fr; } }
.v5-feat{ display:flex; flex-direction:column; gap:6px; padding-top:18px; border-top:1px solid var(--tw-line); }
.v5-feat .ic{ font-family:var(--tw-font-mono); font-size:9.5px; letter-spacing:.22em; color:var(--tw-mark); text-transform:uppercase; font-weight:500; }
.v5-feat h4{ font-family:var(--tw-font-display); font-weight:700; font-size:1rem; letter-spacing:-.015em; margin:0; color:var(--tw-fg); }
.v5-feat p{ font-size:.875rem; line-height:1.5; color:var(--tw-slogan-fg); margin:0; }

/* callout / takeaway */
.v5-callout{ padding:16px 20px; background:color-mix(in srgb, var(--tw-mark) 10%, transparent); border-left:2px solid var(--tw-mark); border-radius:0 3px 3px 0; font-size:.9375rem; line-height:1.55; color:var(--tw-fg); }
.v5-callout strong{ color:var(--tw-mark); font-weight:600; }

/* definition rows (what we don't do) */
.v5-deflist{ display:flex; flex-direction:column; border-top:1px solid var(--tw-line); }
.v5-defrow{ display:grid; grid-template-columns:80px minmax(0,1.1fr) minmax(0,1.6fr); gap:clamp(20px,3vw,40px); padding:24px 0; border-bottom:1px solid var(--tw-line); align-items:start; }
@media(max-width:880px){ .v5-defrow{ grid-template-columns:1fr; gap:8px; } }
.v5-defrow .n{ font-family:var(--tw-font-mono); font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--tw-slogan-fg); }
.v5-defrow h3{ font-family:var(--tw-font-display); font-weight:700; font-size:1.25rem; letter-spacing:-.025em; line-height:1.15; margin:0; color:var(--tw-fg); }
.v5-defrow h3 span{ color:var(--tw-mark); font-weight:800; }
.v5-defrow p{ font-size:.9375rem; line-height:1.55; color:var(--tw-slogan-fg); margin:0; }
.v5-defrow p strong{ color:var(--tw-fg); font-weight:600; }

/* layout helpers */
.v5-split{ display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:clamp(28px,4vw,72px); align-items:start; margin-top:clamp(32px,4vw,48px); }
.v5-split--even{ grid-template-columns:1fr 1fr; }
@media(max-width:980px){ .v5-split,.v5-split--even{ grid-template-columns:1fr; } }
.v5-defns{ display:flex; flex-direction:column; border-top:1px solid var(--tw-line); }
.v5-defns > div{ display:grid; grid-template-columns:130px 1fr; gap:14px; padding:14px 0; border-bottom:1px solid var(--tw-line); font-family:var(--tw-font-mono); font-size:12px; }
.v5-defns dt,.v5-defns .k{ color:var(--tw-slogan-fg); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; }
.v5-defns dd,.v5-defns .v{ color:var(--tw-fg); font-weight:500; margin:0; }

/* ticked list (tiers / bullets) */
.v5-list{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px; font-size:.9375rem; line-height:1.5; color:var(--tw-slogan-fg); }
.v5-list li{ padding-left:20px; position:relative; }
.v5-list li::before{ content:""; position:absolute; left:0; top:.5em; width:7px; height:7px; background:var(--tw-mark); }
.v5-price{ margin-top:auto; padding-top:14px; border-top:1px solid var(--tw-line); font-family:var(--tw-font-display); font-weight:700; font-size:1.125rem; letter-spacing:-.02em; color:var(--tw-fg); }
.v5-card--panel .v5-list,.v5-card--panel .v5-price{ }
.v5-card--panel.is-featured{ border-color:var(--tw-mark); }

/* upload dropbox (bill) — token-driven, works on light or dark */
.v5-dropbox{ border:1.5px dashed color-mix(in srgb, var(--tw-mark) 55%, transparent); border-radius:8px; padding:32px 24px; text-align:center;
  background:var(--tw-data-bg); display:flex; flex-direction:column; gap:12px; align-items:center; }
.v5-dropbox .di{ width:46px; height:46px; border:1.5px solid var(--tw-mark); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--tw-mark); }
.v5-dropbox .di svg{ width:20px; height:20px; }
.v5-dropbox .dt{ font-family:var(--tw-font-display); font-weight:700; font-size:1.25rem; letter-spacing:-.02em; color:var(--tw-fg); }
.v5-dropbox .ds{ font-size:.875rem; color:var(--tw-slogan-fg); max-width:36ch; line-height:1.5; }
.v5-dropbox .df{ font-family:var(--tw-font-mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--tw-slogan-fg); }

/* review-only: cloud palette toggle */
.v5-cloudopt{ position:fixed; top:80px; right:18px; z-index:120; display:flex; align-items:center; gap:8px; padding:8px 10px;
  background:rgba(14,16,18,.86); border:1px solid rgba(244,241,236,.2); border-radius:99px; backdrop-filter:blur(10px);
  font-family:var(--tw-font-mono); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:rgba(244,241,236,.7); }
.v5-cloudopt button{ font:inherit; cursor:pointer; padding:6px 11px; border-radius:99px; border:1px solid transparent; background:transparent; color:rgba(244,241,236,.7); }
.v5-cloudopt button.is-on{ background:var(--tw-mark,#4DD3FF); color:#08233B; }
@media(max-width:680px){ .v5-cloudopt{ display:none; } }