/* ZIVVY MARKETING SKIN — the zivvy.ai site foundation, from the REAL site.css
   (verbatim reference: ui_kits/marketing/source/site.css). Every value below is
   copied from it; nothing is derived anymore. Scoped under .zv-marketing so the
   site grammar (.btn, .textlink, type scale, tokens) cannot collide with the
   platform stylesheet's classes of the same name. @font-face lives in fonts.css.
   Omitted on purpose: cross-document view-transition rules (page-global — they
   would dip EVERY consumer page through dark) and the .passbadge dev chrome. */
.zv-marketing{
  --primary-500:#6a0dad; --primary-600:#5a0b93; /* site purple — differs from the platform scale */
  --tertiary-500:#ffd700;
  --gold-safe-warm:#916713; /* AA at 19px bold on cream */
  --gold-deep:#7A5610;      /* 5.96:1 on --white-luxury — gold that carries text on light */
  --cool-500:#85a4d5; --cool-deep:#4f6a97;
  --black-luxury:#0F0F0F; --black-hero:#060D0D; --black-raised:#150c21;
  --white-luxury:#F8F2E8; --white-utility:#FAFAFA;
  --text-on-dark:#FFFFFF;
  --text-on-dark-muted:rgba(255,255,255,0.70);
  --text-on-dark-faint:rgba(255,255,255,0.52);
  --text-muted-light:rgba(15,15,15,0.65);
  --border-subtle:rgba(15,15,15,0.08);
  --border-dark:rgba(255,255,255,0.12);
  --font-display:"Archivo","Helvetica Neue",Helvetica,Arial,sans-serif;
  --font-text:"Archivo","Helvetica Neue",Helvetica,Arial,sans-serif;
  --font-accent:"Caveat","Archivo",sans-serif;
  --type-display-xl:clamp(3rem,5.6vw,4rem);
  --type-display-lg:clamp(2.5rem,4.6vw,3.25rem);
  --type-display-md:clamp(2rem,3.6vw,2.75rem);
  --type-display-sm:clamp(1.6rem,2.6vw,2rem);
  --shadow-slide:0 1px 0 rgba(15,15,15,.06), 0 8px 24px rgba(58,3,79,.10);
  --motion-base:300ms; /* @kind other */ --motion-slow:500ms; /* @kind other */
  --ease:cubic-bezier(0.2,0.8,0.2,1); /* @kind other */
  --maxw:1344px;
  /* Homepage section grounds (literals from the live index.html — not in site.css) */
  --night-problem:#170e20;
  --night-rooms:#10091a;
  --night-promise:#0b0613;
  /* Component skin variables, hoisted to the theme scope (values from site.css;
     dark sections override them per surface) */
  --ch:16px;
  --receipt-bg:#fff;
  --receipt-border:var(--border-subtle);
  --receipt-rule:var(--border-subtle);
  --receipt-shadow:0 4px 24px rgba(15,15,15,.06);
  --receipt-heading:currentColor;
  --receipt-accent:var(--gold-safe-warm);
  --receipt-quote-ink:var(--black-luxury);
  --receipt-quote-size:16.5px;
  --receipt-muted:var(--text-muted-light);
  --receipt-faint:var(--text-muted-light);
  font-family:var(--font-text);font-weight:400;color:var(--black-luxury);background:var(--white-luxury);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased;
}
.zv-marketing a{color:inherit;text-decoration:none}
.zv-marketing .wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,4vw,64px)}
.zv-marketing .eyebrow{display:inline-block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.15em}
.zv-marketing .eyebrow.gold{color:var(--tertiary-500)}
.zv-marketing .eyebrow.purple{color:var(--primary-500)}
.zv-marketing .eyebrow.gold-warm{color:var(--gold-safe-warm)}
/* lowercase = hero + closer only; mid-page headings sentence case. */
.zv-marketing h2,.zv-marketing h3{font-family:var(--font-display);letter-spacing:-0.02em}
.zv-marketing h1{font-family:var(--font-display);letter-spacing:-0.03em}
.zv-marketing .hero h1{text-wrap:balance}
/* Emergence */
.zv-marketing .rise{opacity:0;transform:translateY(16px);transition:opacity var(--motion-slow) var(--ease),transform var(--motion-slow) var(--ease)}
.zv-marketing .rise.in{opacity:1;transform:none}
.zv-marketing .scale-in{opacity:0;transform:scale(.98);transform-origin:center;transition:opacity var(--motion-slow) var(--ease),transform var(--motion-slow) var(--ease);will-change:opacity,transform}
.zv-marketing .scale-in.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.zv-marketing .rise,.zv-marketing .scale-in{opacity:1;transform:none;transition:none}}
/* Buttons — one primary door per surface; the secondary CTA is a text link, never a second button */
.zv-marketing .btn{display:inline-block;font-family:var(--font-text);font-size:16px;font-weight:700;letter-spacing:.02em;padding:16px 30px;cursor:pointer;transition:transform var(--motion-base) var(--ease),background var(--motion-base) var(--ease);height:auto;min-width:0;border:none;border-radius:0}
.zv-marketing .btn:hover{transform:translateY(-2px)}
.zv-marketing .btn-gold{background:var(--tertiary-500);color:var(--black-hero);clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
.zv-marketing .btn-purple{background:var(--primary-500);color:#fff}
.zv-marketing .btn-purple:hover{background:var(--primary-600)}
.zv-marketing .btn-ghost-dark{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.35)}
.zv-marketing .btn-ghost-dark:hover{border-color:#fff}
.zv-marketing .hero .walk,.zv-marketing .final .walk{font-size:15px;color:var(--text-on-dark-faint)}
.zv-marketing .hero .walk a,.zv-marketing .final .walk a{color:#fff;font-weight:700;border-bottom:1.5px solid rgba(255,255,255,.35);transition:border-color var(--motion-base) var(--ease)}
.zv-marketing .hero .walk a:hover,.zv-marketing .final .walk a:hover{border-bottom-color:#fff}
.zv-marketing .walk-light{font-size:15px;color:var(--text-muted-light)}
.zv-marketing .walk-light a{color:var(--black-luxury);font-weight:700;border-bottom:1.5px solid rgba(15,15,15,.3);transition:border-color var(--motion-base) var(--ease)}
.zv-marketing .walk-light a:hover{border-bottom-color:var(--black-luxury)}
/* Inline text links — purple on light, gold on dark */
.zv-marketing .textlink{font-weight:700;color:var(--primary-500);border-bottom:2px solid rgba(106,13,173,.25);padding-bottom:2px;transition:border-color var(--motion-base) var(--ease)}
.zv-marketing .textlink:hover{border-color:var(--primary-500)}
.zv-marketing .textlink.on-dark{color:var(--tertiary-500);border-color:rgba(255,215,0,.3)}
.zv-marketing .textlink.on-dark:hover{border-color:var(--tertiary-500)}
/* Room-page grammar */
.zv-marketing .roomticks{display:inline-flex;align-items:center;gap:5px;margin-left:14px;vertical-align:middle}
.zv-marketing .roomticks span{display:block;width:16px;height:3px;background:var(--cool-500);opacity:.6}
.zv-marketing .roomticks[data-room="1"] span:nth-child(1),.zv-marketing .roomticks[data-room="2"] span:nth-child(2),.zv-marketing .roomticks[data-room="3"] span:nth-child(3),.zv-marketing .roomticks[data-room="4"] span:nth-child(4){width:26px;background:var(--tertiary-500);opacity:1}
.zv-marketing .diag-line b{color:var(--text-on-dark);font-weight:600}
.zv-marketing .leakrows{margin-top:clamp(30px,3.6vw,42px)}
.zv-marketing .leakrow{display:grid;grid-template-columns:82px minmax(0,4fr) minmax(0,7fr);gap:clamp(14px,2.4vw,32px);padding:15px 0;border-top:1px solid rgba(133,164,213,.2);align-items:baseline}
@media(max-width:1023px){.zv-marketing .leakrow{grid-template-columns:1fr;gap:4px;padding:14px 0}}
.zv-marketing .leak-num{font-size:11.5px;font-weight:700;letter-spacing:.15em;color:var(--cool-deep)}
.zv-marketing .leakrow h3{font-size:17px;font-weight:700;letter-spacing:-0.01em;line-height:1.3;color:var(--black-luxury)}
.zv-marketing .leakrow p{font-size:14.5px;line-height:1.6;color:var(--text-muted-light)}
.zv-marketing .fixgrid{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:20px;margin-top:clamp(40px,5vw,56px)}
@media(max-width:1023px){.zv-marketing .fixgrid{grid-template-columns:1fr;grid-auto-rows:auto}}
.zv-marketing .fixcard{position:relative;background:rgba(255,255,255,.14);padding:clamp(27px,3vw,39px);clip-path:polygon(var(--ch) 0,100% 0,100% calc(100% - var(--ch)),calc(100% - var(--ch)) 100%,0 100%,0 var(--ch))}
.zv-marketing .fixcard::before{content:"";position:absolute;inset:1px;background:var(--black-raised);clip-path:polygon(15px 0,100% 0,100% calc(100% - 15px),calc(100% - 15px) 100%,0 100%,0 15px);pointer-events:none}
.zv-marketing .fixcard>*{position:relative}
.zv-marketing .fix-num{display:block;font-family:var(--font-display);font-size:clamp(1.75rem,2.6vw,2.25rem);font-weight:900;letter-spacing:-0.02em;line-height:1;color:var(--tertiary-500)}
.zv-marketing .fixcard h3{font-size:20px;font-weight:700;letter-spacing:-0.01em;line-height:1.3;color:#fff;margin:14px 0 10px}
.zv-marketing .fixcard p{font-size:16px;line-height:1.62;color:var(--text-on-dark-muted)}
/* Room-card gold seam on hover/focus */
.zv-marketing a.door{position:relative;overflow:hidden}
.zv-marketing a.door::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;opacity:0;pointer-events:none;transition:opacity 180ms ease;background:linear-gradient(to bottom,var(--tertiary-500) 0%,var(--tertiary-500) 35%,rgba(255,215,0,.25) 100%)}
.zv-marketing a.door:hover::before,.zv-marketing a.door:focus-visible::before{opacity:1}
/* Owner-story receipt / filecard — light default, dark grounds override the variables */
.zv-marketing .receipt,.zv-marketing .filecard{padding:clamp(28px,3.5vw,44px);display:flex;flex-direction:column}
.zv-marketing .receipt{background:var(--receipt-bg);border:1px solid var(--receipt-border);box-shadow:var(--receipt-shadow)}
.zv-marketing .receipt .rhead,.zv-marketing .filecard .rhead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:16px;border-bottom:1px solid var(--receipt-rule);padding-bottom:16px;margin-bottom:22px}
.zv-marketing .receipt .school,.zv-marketing .filecard .school{font-family:var(--font-display);font-weight:700;font-size:19px;letter-spacing:-0.01em;color:var(--receipt-heading)}
.zv-marketing .receipt .meta,.zv-marketing .filecard .meta{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--receipt-faint);white-space:nowrap}
.zv-marketing .receipt .opened,.zv-marketing .filecard .opened{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--receipt-accent);margin-bottom:10px}
.zv-marketing .receipt .num,.zv-marketing .filecard .num{font-family:var(--font-display);font-size:clamp(2rem,3.6vw,2.6rem);font-weight:900;letter-spacing:-0.025em;color:var(--receipt-accent);line-height:1.05}
.zv-marketing .receipt .numsub,.zv-marketing .filecard .numsub{font-size:15px;color:var(--receipt-muted);margin-top:8px;margin-bottom:22px}
.zv-marketing .receipt blockquote,.zv-marketing .filecard blockquote{font-size:var(--receipt-quote-size);line-height:1.6;color:var(--receipt-quote-ink);border-left:3px solid var(--receipt-accent);padding-left:18px;margin-top:auto}
.zv-marketing .receipt cite,.zv-marketing .filecard cite{display:block;font-style:normal;font-size:13.5px;color:var(--receipt-faint);margin-top:10px}
