/* ═══════════════════════════════════════════════════════════════
   RINZARA-OVERHAUL.CSS — Rinzara (rinzara.com)
   Visual voice: "the screening room / creative studio." Gallery-
   forward, output-first, on a SOFTER warm-charcoal dark canvas
   (#1c1a1f, not near-black — operator 2026-06-08). Prism palette:
   magenta #db2777 / amber #f59e0b / violet + coral spectrum.
   Type: Syne display · Geist body · Space Mono labels.

   Forked from the Lucreya (gtm) overhaul system + converted from
   its light-body editorial scheme to this dark theme: --ink is now
   the LIGHT text/heading color, dark section backgrounds use --deep.
   Reuses the proven component classes (eyebrow, cred-strip, metric
   grid, cards, badges, mock, tape, carousel .stage/.slide, .band).
   The signature bake-off GALLERY component is added on top (output
   grid + scoring table + verdict + capture rail). Calibrated to
   ENTERPRISE-GRADE-STANDARD 10-pattern bar.
   ═══════════════════════════════════════════════════════════════ */

:root{
  /* RINZARA — dark "screening room" theme. Softer warm-charcoal canvas
     (operator: "slightly dark, not close to black"), prism magenta/amber
     accents. --ink is now the LIGHT text/heading color; the dark section
     backgrounds (hero/method/tape-head/etc.) use --deep, NOT --ink. */
  --ink:#f4f1f5;          /* light text + headings (on dark body) */
  --ink-2:#201e24;        /* a raised dark surface (cred-strip etc.) */
  --deep:#161418;         /* the deepest section bg (hero/method rooms) */
  --paper:#1c1a1f;        /* BODY canvas — warm charcoal, off-black */
  --card:#252229;         /* raised panel surface */
  --card-2:#2b2830;       /* hover/elevated panel */
  --line:#35313b;         /* hairline border on dark */
  --line-2:#2b2830;       /* subtler fill/border */
  --text:#d8d3de;         /* body text */
  --text-dim:#aaa3b3;     /* secondary text */
  --text-faint:#8a8294;   /* faint mono labels */
  --accent:#db2777;       /* magenta (primary) */
  --accent-light:rgba(219,39,119,.16);  /* dark magenta wash (active/tint bg) */
  --accent-hover:#ec4899;
  --cyan:#f59e0b;         /* amber (secondary) — name kept for engine compat */
  --cyan-light:rgba(245,158,11,.15);     /* dark amber wash */
  --violet:#8b5cf6;       /* spectrum violet */
  --coral:#fb7185;        /* spectrum coral */
  --up:#34d399;           /* brighter green for dark */
  --down:#fb7185;
  --display:'Syne','Bricolage Grotesque',Georgia,serif;
  --body:'Geist','Inter',system-ui,-apple-system,sans-serif;
  --mono:'Space Mono','JetBrains Mono','SFMono-Regular',monospace;
  --radius:14px;
  --shadow-sm:0 1px 2px rgba(0,0,0,.35);
  --shadow-md:0 10px 34px rgba(0,0,0,.5);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--body);color:var(--text);background:var(--paper);
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit}
em{font-style:italic}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;letter-spacing:-.02em;color:var(--ink);margin:0}

/* ── TRUST RIBBON ────────────────────────────────────────────── */
.trust-ribbon{background:var(--deep);color:#d4d4dd;font-family:var(--mono);
  font-size:11.5px;letter-spacing:.02em;display:flex;flex-wrap:wrap;gap:1.5rem;
  justify-content:center;align-items:center;padding:.55rem 1.5rem}
.trust-ribbon strong{color:#fff;font-weight:600}
.trust-ribbon .dot{display:inline-block;width:6px;height:6px;border-radius:50%;
  background:var(--up);margin-right:.45rem;vertical-align:middle;
  box-shadow:0 0 0 3px rgba(22,163,74,.20)}

/* ── SHELL ───────────────────────────────────────────────────── */
.shell{display:grid;grid-template-columns:248px 1fr;max-width: min(1440px, 100%); min-width: 0;margin:0 auto;
  align-items:start}
.side{position:sticky;top:0;align-self:start;height:100vh;overflow-y:auto;
  padding:1.5rem 1.1rem;border-right:1px solid var(--line);background:var(--paper)}
.body{min-width:0;padding:0 0 4rem}

/* brand */
.brand-mark{font-family:var(--display);font-size:1.5rem;font-weight:800;
  text-decoration:none;color:var(--ink);letter-spacing:-.03em;display:inline-flex;align-items:center;gap:.55rem}
.brand-mark span{color:inherit}
.brand-mark:hover .rin-mark i:nth-child(1){transform:translate(-5px,3px) rotate(-18deg)}
.brand-mark:hover .rin-mark i:nth-child(3){transform:translate(5px,-3px) rotate(18deg)}
/* Rinzara prism mark — three fanned spectrum panes (coral → magenta → violet),
   light splitting through a prism. Static fanned stagger + glow-breathing
   (NOT transform-animated, so :hover can widen the fan cleanly). aria-hidden. */
.rin-mark{position:relative;width:28px;height:28px;flex:none;display:inline-block;vertical-align:middle}
.rin-mark i{position:absolute;inset:2px;border-radius:6px;transition:transform .42s cubic-bezier(.2,.8,.2,1)}
.rin-mark i:nth-child(1){background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.45),transparent 48%),linear-gradient(140deg,#fb7185,#f43f5e);transform:translate(-3px,2px) rotate(-12deg);box-shadow:0 3px 11px rgba(251,113,133,.5);animation:rin-glow 4.6s ease-in-out infinite}
.rin-mark i:nth-child(2){background:radial-gradient(circle at 50% 30%,rgba(255,255,255,.5),transparent 50%),linear-gradient(140deg,#db2777,#be185c);box-shadow:0 4px 13px rgba(219,39,119,.55);animation:rin-glow 4.6s ease-in-out .3s infinite}
.rin-mark i:nth-child(3){background:radial-gradient(circle at 68% 72%,rgba(255,255,255,.34),transparent 50%),linear-gradient(140deg,#a855f7,#7c3aed);transform:translate(3px,-2px) rotate(12deg);box-shadow:0 3px 11px rgba(139,92,246,.5);animation:rin-glow 4.6s ease-in-out .6s infinite}
@keyframes rin-glow{0%,100%{filter:brightness(1) saturate(1)}50%{filter:brightness(1.2) saturate(1.15)}}
@media(prefers-reduced-motion:reduce){.rin-mark i{animation:none}}
/* Wordmark — single-tone light ink (no two-tone split, per visual standard §4). */
.rin-word{color:var(--ink);font-weight:800;letter-spacing:-.03em}

/* shared system/legal page wrapper (on-brand, readable) */
.page-narrow{max-width:780px;margin:0 auto;padding:2.8rem 1.5rem 4rem}
.page-narrow .eyebrow{margin-bottom:.6rem}
.page-narrow h1{font-family:var(--display);font-size:clamp(2rem,4.4vw,2.9rem);line-height:1.06;letter-spacing:-.02em;color:var(--ink);margin:0 0 .5rem}
.page-narrow h2{font-family:var(--display);font-size:1.32rem;letter-spacing:-.01em;color:var(--ink);margin:2.1rem 0 .6rem}
.page-narrow h3{font-family:var(--display);font-size:1.08rem;color:var(--ink);margin:1.4rem 0 .4rem}
.page-narrow p,.page-narrow li{color:var(--text-dim);line-height:1.72}
.page-narrow .lead{font-size:1.08rem;color:var(--text-dim);max-width:60ch}
.page-narrow ul,.page-narrow ol{margin:.6rem 0 1.1rem 1.25rem}
.page-narrow li{margin:.3rem 0}
.page-narrow a{color:var(--accent);text-decoration:none}
.page-narrow a:hover{text-decoration:underline}
.page-narrow strong{color:var(--ink)}
.page-narrow hr{border:0;border-top:1px solid var(--line);margin:2rem 0}
.brand-tag{font-family:var(--mono);font-size:10px;text-transform:uppercase;
  letter-spacing:.14em;color:var(--text-faint);margin-top:.35rem}

/* nav */
.nav-section{margin-top:1.6rem}
.nav-label{font-family:var(--mono);font-size:10px;text-transform:uppercase;
  letter-spacing:.16em;color:var(--text-faint);margin-bottom:.6rem;padding-left:.25rem}
.nav-label .count{color:var(--accent)}
.nav-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.12rem}
.nav-list a{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--text-dim);
  font-size:.875rem;font-weight:500;padding:.5rem .6rem;border-radius:8px;transition:all .15s}
.nav-list a:hover{color:var(--ink);background:var(--line-2)}
.nav-list a.active{color:var(--accent);background:var(--accent-light);font-weight:600}
.nav-list .ic{width:16px;height:16px;flex:0 0 16px}
.nav-list .tool-item{font-family:var(--mono);font-size:.8rem;color:var(--text-dim)}
.nav-list .tool-item:hover{color:var(--accent)}

/* ── LIVE TAPE (signature component) ─────────────────────────── */
.tape{margin-top:1.7rem;border:1px solid var(--line);border-radius:10px;
  background:var(--card);overflow:hidden;box-shadow:var(--shadow-sm)}
.tape-head{display:flex;align-items:center;justify-content:space-between;
  padding:.6rem .75rem;border-bottom:1px solid var(--line-2);background:var(--deep);}
.tape-title{font-family:var(--mono);font-size:9.5px;text-transform:uppercase;
  letter-spacing:.12em;color:#c7c7d1}
.tape-live{font-family:var(--mono);font-size:9px;font-weight:600;color:#fff;
  background:var(--accent-fill,var(--accent));border-radius:100px;padding:.12rem .45rem;display:flex;
  align-items:center;gap:.3rem}
.tape-live::before{content:"";width:5px;height:5px;border-radius:50%;background:#fff;
  animation:pulse 1.8s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.tape-row{display:grid;grid-template-columns:1fr auto auto;gap:.5rem;align-items:center;
  padding:.5rem .75rem;font-family:var(--mono);font-size:11.5px;border-bottom:1px solid var(--line-2)}
.tape-row:last-child{border-bottom:0}
.tape-row .t-name{color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tape-row .t-px{color:var(--ink);font-weight:600;text-align:right}
.tape-row .t-d{font-size:10px;font-weight:600;text-align:right;min-width:34px}
.t-d.up{color:var(--up)} .t-d.down{color:var(--down)} .t-d.flat{color:var(--text-faint)}
.tape-foot{padding:.5rem .75rem;font-family:var(--mono);font-size:9.5px;color:var(--text-faint);
  border-top:1px solid var(--line-2)}
.tape-foot a{color:var(--accent);text-decoration:none}

/* ── EYEBROW (universal section signature) ───────────────────── */
.eyebrow{font-family:var(--mono);font-size:10.5px;text-transform:uppercase;
  letter-spacing:.18em;color:var(--accent);display:inline-flex;align-items:center;gap:.6rem}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--accent-fill,var(--accent));opacity:.5}
.eyebrow.dot::before{width:7px;height:7px;border-radius:50%;background:var(--accent-fill,var(--accent));opacity:1}
.eyebrow.cyan{color:var(--cyan)} .eyebrow.cyan::before{background:var(--cyan)}

/* ── HERO (dark terminal screen) ─────────────────────────────── */
.hero{position:relative;background:var(--deep);color:#fff;overflow:hidden;
  padding:4.5rem 3rem 4rem;border-bottom:1px solid var(--line)}
.hero::before{content:"";position:absolute;inset:0;
  background:radial-gradient(120% 120% at 78% 8%,rgba(219,39,119,.30),transparent 55%),
             radial-gradient(90% 90% at 12% 100%,rgba(245,158,11,.16),transparent 60%),
             radial-gradient(70% 70% at 50% 120%,rgba(139,92,246,.14),transparent 60%)}
.hero::after{content:"";position:absolute;inset:0;opacity:.4;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:42px 42px;mask-image:radial-gradient(circle at 60% 30%,#000,transparent 80%)}
.hero-content{position:relative;max-width:780px}
.hero .eyebrow{color:#f9a8d4}
.hero .eyebrow::before{background:#f9a8d4;opacity:.7}
.hero-title{font-size:clamp(2.4rem,5vw,3.5rem);line-height:1.04;font-weight:800;
  color:#fff;margin:1.1rem 0 0;letter-spacing:-.03em}
.hero-title em{color:#f9a8d4;font-style:italic;display:block}
.hero-sub{font-size:1.075rem;line-height:1.6;color:#c7c7d1;max-width:600px;margin:1.4rem 0 0}
.hero-actions{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:2rem}
.btn{display:inline-flex;align-items:center;gap:.4rem;font-weight:600;font-size:.95rem;
  text-decoration:none;padding:.85rem 1.6rem;border-radius:9px;transition:all .18s;cursor:pointer;border:0}
.btn-primary{background:var(--accent-fill,var(--accent));color:#fff;box-shadow:0 6px 22px rgba(79,70,229,.4)}
.btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px)}
.btn-ghost{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.18)}
.btn-ghost:hover{background:rgba(255,255,255,.12)}
.hero-foot{position:relative;font-family:var(--mono);font-size:11px;color:#8b8b97;margin-top:1.8rem}

/* ── CRED STRIP ──────────────────────────────────────────────── */
.cred-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  background:var(--ink-2);border-bottom:1px solid var(--line)}
.cred-cell{display:flex;align-items:flex-start;gap:.7rem;padding:1.1rem 1.5rem;
  border-right:1px solid rgba(255,255,255,.06)}
.cred-cell:last-child{border-right:0}
.cred-cell .ic{width:20px;height:20px;color:var(--accent);flex:0 0 20px;margin-top:.1rem}
.cred-cell .label{font-family:var(--mono);font-size:9.5px;text-transform:uppercase;
  letter-spacing:.12em;color:#8b8b97}
.cred-cell .value{font-size:.82rem;color:#e4e4ea;font-weight:500;line-height:1.35;margin-top:.2rem}

/* ── REGION ──────────────────────────────────────────────────── */
.region{padding:3.5rem 3rem 0;max-width:1180px}
.region-head{display:flex;justify-content:space-between;align-items:flex-end;
  gap:1rem;margin-bottom:1.6rem;flex-wrap:wrap}
.region-title{font-size:clamp(1.6rem,3vw,2.1rem);line-height:1.1;margin-top:.6rem}
.region-title em{color:var(--accent)}
.region-link{font-family:var(--mono);font-size:.8rem;color:var(--accent);text-decoration:none;
  white-space:nowrap;font-weight:600}
.region-link:hover{text-decoration:underline}

/* ── ANCHOR CTA + MOCK ───────────────────────────────────────── */
.anchor-cta{display:grid;grid-template-columns:1.05fr .95fr;gap:0;margin:3.5rem 3rem 0;
  max-width:1180px;border:1px solid var(--line);border-radius:16px;overflow:hidden;
  background:var(--card);box-shadow:var(--shadow-md)}
.anchor-pitch{padding:2.2rem 2.2rem;background:linear-gradient(160deg,var(--accent),#6d28d9)}
.anchor-pitch .eyebrow{color:rgba(255,255,255,.85)}
.anchor-pitch .eyebrow::before{background:rgba(255,255,255,.7)}
.anchor-pitch h3{color:#fff;font-size:1.55rem;line-height:1.12;margin:.9rem 0}
.anchor-pitch h3 em{color:#e9d5ff}
.anchor-pitch p{color:rgba(255,255,255,.85);font-size:.92rem;margin:0 0 1.2rem}
.anchor-meta{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.4rem}
.anchor-meta span{font-family:var(--mono);font-size:10.5px;color:#fff;
  background:rgba(255,255,255,.14);border-radius:100px;padding:.28rem .6rem}
.anchor-pitch .btn-primary{background:#fff;color:var(--accent);box-shadow:none}
.anchor-pitch .btn-primary:hover{background:#f1f1ff;transform:translateY(-2px)}
.anchor-mock{padding:1.8rem;background:var(--deep);display:flex;flex-direction:column;justify-content:center}
.mock-head{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.12em;
  color:#8b8b97;margin-bottom:.9rem;display:flex;align-items:center;gap:.5rem}
.mock-head::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--cyan)}
.mock-row{display:flex;justify-content:space-between;gap:1rem;font-family:var(--mono);
  font-size:12.5px;padding:.6rem 0;border-bottom:1px solid rgba(255,255,255,.07);color:#d4d4dd}
.mock-row .v{color:var(--cyan);font-weight:600;white-space:nowrap}
.mock-row.total{border-bottom:0;border-top:1px solid rgba(255,255,255,.18);margin-top:.3rem;
  padding-top:.8rem;color:#fff;font-weight:600}
.mock-row.total .v{color:#f9a8d4}
.mock-note{font-family:var(--mono);font-size:10px;color:#8b8b97;margin-top:.9rem;line-height:1.5}

/* ── CATEGORY GRID ───────────────────────────────────────────── */
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.cat{display:block;text-decoration:none;background:var(--card);border:1px solid var(--line);
  border-top:3px solid var(--c,var(--accent));border-radius:var(--radius);padding:1.3rem 1.35rem;
  transition:all .2s;box-shadow:var(--shadow-sm)}
.cat:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--line)}
.cat-eye{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.1em;
  color:var(--text-dim);display:flex;align-items:center;gap:.45rem}
.cat-eye-dot{width:8px;height:8px;border-radius:50%;background:var(--c,var(--accent))}
.cat h4{font-size:1.08rem;margin:.6rem 0 .5rem;line-height:1.25;color:var(--ink)}
.cat p{font-size:.85rem;color:var(--text-dim);line-height:1.5;margin:0}
.cat-foot{display:flex;justify-content:space-between;align-items:center;margin-top:1rem;
  font-family:var(--mono);font-size:11px;color:var(--text-faint)}
.cat-foot .arrow{color:var(--accent);font-weight:600}

/* ── METHOD / METRIC GRID ────────────────────────────────────── */
.method{margin:4rem 3rem 0;max-width:1180px;background:var(--deep);border-radius:18px;
  padding:2.6rem 2.6rem;display:grid;grid-template-columns:.85fr 1.15fr;gap:2.5rem;
  align-items:center;color:#fff}
.method-pitch .eyebrow{color:#f9a8d4} .method-pitch .eyebrow::before{background:#f9a8d4}
.method-pitch h3{color:#fff;font-size:1.7rem;line-height:1.12;margin:.8rem 0}
.method-pitch h3 em{color:#f9a8d4}
.method-pitch p{color:#c7c7d1;font-size:.92rem;line-height:1.6;margin:0 0 1.1rem}
.method-pitch .read-link{font-family:var(--mono);font-size:.82rem;color:#f9a8d4;
  text-decoration:none;font-weight:600}
.method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.9rem}
.metric{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
  border-radius:10px;padding:1rem .95rem}
.metric-num{font-family:var(--mono);font-size:1.5rem;font-weight:600;color:#fff;line-height:1}
.metric-num em{font-size:.7rem;color:#8b8b97;font-style:normal}
.metric-name{font-family:var(--display);font-weight:700;font-size:.98rem;margin:.45rem 0 .25rem;color:#fff}
.metric-desc{font-size:.78rem;color:#9b9ba7;line-height:1.4}

/* ── REVIEW GRID ─────────────────────────────────────────────── */
.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
.review{display:block;text-decoration:none;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden;transition:all .2s;box-shadow:var(--shadow-sm)}
.review:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.review.featured{grid-row:span 2}
.review-top{height:6px;background:linear-gradient(90deg,var(--accent),var(--cyan))}
.review-body{padding:1.3rem 1.35rem}
.review-eye{display:flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:10px;
  text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);margin-bottom:.6rem}
.score-badge{background:var(--accent-fill,var(--accent));color:#fff;font-weight:600;border-radius:6px;
  padding:.12rem .45rem;letter-spacing:0}
.type-badge{border-radius:6px;padding:.12rem .45rem;font-weight:600;letter-spacing:.04em}
.type-badge.roundup{background:var(--accent-light);color:var(--accent)}
.type-badge.comparison{background:var(--cyan-light);color:var(--cyan)}
.type-badge.guide{background:#f3e8ff;color:var(--violet)}
.review h4{font-size:1.12rem;line-height:1.22;margin:0 0 .5rem;color:var(--ink)}
.review.featured h4{font-size:1.35rem}
.review p{font-size:.86rem;color:var(--text-dim);line-height:1.5;margin:0}
.review-meta{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:1rem;font-family:var(--mono);
  font-size:10.5px;color:var(--text-faint)}

/* ── ADVISORY / METHODOLOGY CARDS ────────────────────────────── */
.advisory{margin:4rem 3rem 0;max-width:1180px}
.advisory-lede{font-size:1rem;color:var(--text-dim);line-height:1.65;max-width:760px;margin:1rem 0 1.8rem}
.adv-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.adv{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem;display:flex;gap:.9rem}
.adv-badge{flex:0 0 46px;height:46px;border-radius:9px;display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:11px;font-weight:700;color:#fff;
  background:linear-gradient(135deg,var(--accent),var(--violet))}
.adv-name{font-family:var(--display);font-weight:700;font-size:.98rem;color:var(--ink)}
.adv-cred{font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:.1em;
  color:var(--cyan);margin:.2rem 0 .4rem}
.adv-bio{font-size:.8rem;color:var(--text-dim);line-height:1.5}

/* ── NEWSLETTER ──────────────────────────────────────────────── */
.newsletter{margin:4rem 3rem 0;max-width:1180px;background:var(--deep);border-radius:18px;
  padding:2.6rem;display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:center;color:#fff}
.newsletter h3{color:#fff;font-size:1.5rem;line-height:1.15;margin:0 0 .6rem}
.newsletter h3 em{color:#f9a8d4}
.newsletter p{color:#c7c7d1;font-size:.9rem;line-height:1.6;margin:0}
.news-form{display:flex;gap:.6rem;flex-wrap:wrap}
.news-form input{flex:1;min-width:200px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);
  border-radius:9px;padding:.8rem 1rem;color:#fff;font-family:var(--body);font-size:.92rem}
.news-form input::placeholder{color:#8b8b97}
.news-form button{background:var(--accent-fill,var(--accent));color:#fff;border:0;border-radius:9px;padding:.8rem 1.4rem;
  font-weight:600;font-size:.92rem;cursor:pointer;font-family:var(--body)}
.news-form button:hover{background:var(--accent-hover)}
.news-meta{font-family:var(--mono);font-size:10.5px;color:#8b8b97;margin-top:.9rem}

/* ── AD ZONE ─────────────────────────────────────────────────── */
.ad-zone{margin:3rem auto 0;max-width:1180px;padding:0 3rem}

/* ── RESPONSIVE ──────────────────────────────────────────────── */
@media(max-width:1080px){
  .shell{grid-template-columns:1fr}
  .side{position:static;height:auto;border-right:0;border-bottom:1px solid var(--line);
    display:grid;grid-template-columns:1fr 1fr;gap:1rem 2rem}
  .tape{grid-column:1/-1}
  .cred-strip{grid-template-columns:repeat(2,1fr)}
  .cred-cell:nth-child(2){border-right:0}
  .anchor-cta,.method,.newsletter{grid-template-columns:1fr}
  .cat-grid,.review-grid,.method-grid,.adv-cards{grid-template-columns:repeat(2,1fr)}
  .review.featured{grid-row:auto}
}
@media(max-width:640px){
  .hero{padding:3rem 1.5rem}
  .region,.anchor-cta,.method,.advisory,.newsletter,.ad-zone{margin-left:1.25rem;margin-right:1.25rem;
    padding-left:0;padding-right:0}
  .region{padding-left:0;padding-right:0}
  .cred-strip{grid-template-columns:1fr}.cred-cell{border-right:0}
  .cat-grid,.review-grid,.method-grid,.adv-cards{grid-template-columns:1fr}
  .side{grid-template-columns:1fr}
}

/* ═══════════════════════════════════════════════════════════════
   DEPTH + MOTION LAYER — eye-gravity engineered onto capture / ROI
   / CTR surfaces. Restraint everywhere else: motion lives only here.
   ═══════════════════════════════════════════════════════════════ */

/* ── TOP STOCK TICKER (CTR / impressions magnet) ─────────────── */
.ticker{background:var(--ink-2);border-bottom:1px solid rgba(255,255,255,.06);
  overflow:hidden;position:relative;white-space:nowrap;display:flex;align-items:center}
.ticker::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,var(--ink-2),transparent 6%,transparent 94%,var(--ink-2))}
.ticker-label{flex:0 0 auto;z-index:2;background:var(--accent-fill,var(--accent));color:#fff;font-family:var(--mono);
  font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  padding:.5rem .8rem;display:flex;align-items:center;gap:.4rem}
.ticker-label::before{content:"";width:6px;height:6px;border-radius:50%;background:#fff;animation:pulse 1.6s infinite}
.ticker-track{display:inline-flex;align-items:center;gap:2.2rem;padding-left:2.2rem;
  animation:ticker-scroll 38s linear infinite;will-change:transform}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-item{font-family:var(--mono);font-size:11.5px;color:#c7c7d1;display:inline-flex;
  align-items:center;gap:.5rem}
.ticker-item .tk{color:#fff;font-weight:500}
.ticker-item .px{color:#f9a8d4}
.ticker-item .up{color:var(--up)} .ticker-item .down{color:var(--down)} .ticker-item .flat{color:#71717a}
@keyframes ticker-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── HERO aurora drift + isolated CTA shimmer (ROI) ──────────── */
.hero::before{animation:aurora 14s ease-in-out infinite alternate}
@keyframes aurora{
  0%{background:radial-gradient(120% 120% at 78% 8%,rgba(79,70,229,.38),transparent 55%),radial-gradient(90% 90% at 12% 100%,rgba(8,145,178,.18),transparent 60%)}
  100%{background:radial-gradient(120% 120% at 62% 22%,rgba(79,70,229,.30),transparent 58%),radial-gradient(95% 95% at 24% 92%,rgba(124,58,237,.22),transparent 62%)}
}
.btn-glow{position:relative;overflow:hidden;
  box-shadow:0 6px 22px rgba(79,70,229,.45),0 0 0 0 rgba(79,70,229,.5);
  animation:cta-pulse 2.8s ease-in-out infinite}
@keyframes cta-pulse{
  0%,100%{box-shadow:0 6px 22px rgba(79,70,229,.40),0 0 0 0 rgba(79,70,229,.45)}
  50%{box-shadow:0 8px 30px rgba(79,70,229,.60),0 0 0 6px rgba(79,70,229,0)}
}
.btn-glow::after{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);
  transform:skewX(-18deg);animation:shimmer 3.4s ease-in-out infinite}
@keyframes shimmer{0%{left:-120%}55%{left:130%}100%{left:130%}}

/* ── COUNT-UP STAT (life on the numbers) ─────────────────────── */
.cred-cell .value[data-count]{font-variant-numeric:tabular-nums}

/* ── DELTA PULSE on the tape ─────────────────────────────────── */
.t-d.up,.t-d.down{animation:delta-flash 4s ease-in-out infinite}
@keyframes delta-flash{0%,92%,100%{opacity:1}96%{opacity:.25}}

/* ── FEATURED-SHELF SHOWCASE (forked launchkits picker → ROI) ── */
.showcase{margin:3.5rem 3rem 0;max-width:1180px}
.showcase-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;
  margin-bottom:1.3rem;flex-wrap:wrap}
.showcase-title{font-size:clamp(1.6rem,3vw,2.1rem);line-height:1.1;margin-top:.6rem}
.showcase-title em{color:var(--accent)}
.picker{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.1rem}
.chip{font-family:var(--mono);font-size:11.5px;font-weight:500;color:var(--text-dim);
  background:var(--card);border:1px solid var(--line);border-radius:100px;padding:.45rem .9rem;
  cursor:pointer;transition:all .18s;display:inline-flex;align-items:center;gap:.4rem}
.chip:hover{border-color:var(--accent);color:var(--accent)}
.chip[aria-selected="true"]{background:var(--accent-fill,var(--accent));border-color:var(--accent);color:#fff}
.chip .dot{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.8}
.stage{position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--line);
  background:var(--deep);box-shadow:var(--shadow-md);min-height:340px}
.stage-top{height:5px;background:linear-gradient(90deg,var(--accent),var(--cyan),var(--violet));background-size:200% 100%;animation:slide-grad 6s linear infinite}
@keyframes slide-grad{to{background-position:200% 0}}
.slide{display:none;grid-template-columns:1.15fr .85fr;gap:0}
.slide.active{display:grid;animation:fade-in .5s ease}
@keyframes fade-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.slide-info{padding:2.2rem 2.3rem;position:relative;z-index:2}
.slide-info .eyebrow{color:#f9a8d4}.slide-info .eyebrow::before{background:#f9a8d4}
.slide-badges{display:flex;align-items:center;gap:.5rem;margin:1rem 0 .2rem}
.slide-score{background:var(--accent-fill,var(--accent));color:#fff;font-family:var(--mono);font-weight:600;font-size:12px;border-radius:7px;padding:.2rem .55rem}
.slide-info h3{color:#fff;font-size:1.7rem;line-height:1.14;margin:.7rem 0 .8rem}
.slide-info p{color:#c7c7d1;font-size:.92rem;line-height:1.6;margin:0 0 1.2rem;max-width:46ch}
.slide-tools{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.4rem}
.slide-tools span{font-family:var(--mono);font-size:10.5px;color:#d4d4dd;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:.25rem .55rem}
.slide-actions{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center}
.slide-actions .btn-primary{box-shadow:0 6px 20px rgba(79,70,229,.4)}
.slot-pill{font-family:var(--mono);font-size:10.5px;color:#fff;border:1px dashed rgba(165,180,252,.6);
  border-radius:100px;padding:.35rem .7rem;display:inline-flex;align-items:center;gap:.4rem}
.slot-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--cyan);animation:pulse 1.8s infinite}
.slide-visual{position:relative;background:linear-gradient(160deg,rgba(79,70,229,.22),rgba(8,145,178,.12));
  display:flex;align-items:center;justify-content:center;overflow:hidden}
.slide-visual::before{content:"";position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:30px 30px;mask-image:radial-gradient(circle at 60% 50%,#000,transparent 75%)}
.mini-tape{position:relative;z-index:2;width:78%;background:rgba(11,13,18,.72);border:1px solid rgba(255,255,255,.12);
  border-radius:12px;padding:.5rem .3rem;backdrop-filter:blur(4px)}
.mini-tape .mt-row{display:grid;grid-template-columns:1fr auto auto;gap:.5rem;padding:.4rem .7rem;
  font-family:var(--mono);font-size:11px;color:#d4d4dd;border-bottom:1px solid rgba(255,255,255,.06)}
.mini-tape .mt-row:last-child{border-bottom:0}
.mini-tape .mt-row .v{color:#f9a8d4;font-weight:600;text-align:right}
.mini-tape .mt-row .b{color:var(--cyan);font-weight:600;text-align:right}
.picker-dots{display:flex;gap:.4rem;justify-content:center;margin-top:1rem}
.picker-dots button{width:7px;height:7px;border-radius:50%;border:0;background:var(--line);cursor:pointer;padding:0;transition:all .2s}
.picker-dots button[aria-selected="true"]{background:var(--accent-fill,var(--accent));width:20px;border-radius:100px}

/* ── INLINE CAPTURE BAR (capture surface, mid-page) ──────────── */
.capture-bar{margin:3.5rem 3rem 0;max-width:1180px;position:relative;border-radius:16px;
  padding:1.6rem 1.8rem;background:linear-gradient(120deg,#1b1840,#161418 60%);overflow:hidden;
  display:grid;grid-template-columns:1fr auto;gap:1.2rem;align-items:center}
.capture-bar::before{content:"";position:absolute;inset:-1px;border-radius:17px;padding:1px;
  background:linear-gradient(120deg,var(--accent),var(--cyan),var(--accent));background-size:200% 100%;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;animation:slide-grad 5s linear infinite;opacity:.9}
.capture-copy{position:relative;z-index:2}
.capture-copy .eyebrow{color:#f9a8d4}.capture-copy .eyebrow::before{background:#f9a8d4}
.capture-copy h3{color:#fff;font-size:1.25rem;line-height:1.2;margin:.5rem 0 .25rem}
.capture-copy p{color:#b9b9c6;font-size:.85rem;margin:0}
.capture-form{position:relative;z-index:2;display:flex;gap:.5rem;flex-wrap:wrap}
.capture-form input{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:9px;
  padding:.75rem .95rem;color:#fff;font-family:var(--body);font-size:.9rem;min-width:210px}
.capture-form input::placeholder{color:#8b8b97}

/* ── card hover glow rings (CTR on browse + review cards) ─────── */
.cat:hover,.review:hover{box-shadow:0 12px 34px rgba(79,70,229,.18),0 0 0 1px rgba(79,70,229,.25)}
.cat .arrow,.region-link{transition:transform .18s}
.cat:hover .arrow{transform:translateX(4px)}

/* ── SCROLL REVEAL ───────────────────────────────────────────── */
[data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease}
[data-reveal].in{opacity:1;transform:none}

@media(max-width:1080px){
  .showcase,.capture-bar{margin-left:1.25rem;margin-right:1.25rem}
  .slide{grid-template-columns:1fr}
  .slide-visual{min-height:200px;padding:1.5rem 0}
  .capture-bar{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .ticker-track,.hero::before,.btn-glow,.btn-glow::after,.t-d.up,.t-d.down,
  .stage-top,.capture-bar::before,.slot-pill::before,.ticker-label::before,.tape-live::before{animation:none!important}
  [data-reveal]{opacity:1;transform:none}
}

/* ═══════════════════════════════════════════════════════════════
   STRUCTURAL VARIANCE LAYER — each section its own geometry + "room".
   Full-bleed bands alternate light/dark; grids give way to triptychs,
   process scales, manifestos, and frame-breaking objects. Density down,
   focal contrast up.
   ═══════════════════════════════════════════════════════════════ */

/* full-bleed band primitive (spans the content column edge to edge) */
.band{margin:0;padding:5rem 3rem}
.band-inner{max-width:1180px;margin:0 auto}
.band.dark{background:var(--deep);color:#fff}
.band.dark .region-title,.band.dark h2,.band.dark h3{color:#fff}
.band.ink-soft{background:linear-gradient(180deg,#201e24,#161418)}
.band-lead{font-size:1.05rem;line-height:1.65;color:var(--text-dim);max-width:680px}
.band.dark .band-lead{color:#b9b9c6}

/* give breathing room: larger gaps between major moments */
.region,.anchor-cta,.showcase,.method,.advisory,.newsletter,.capture-bar{margin-top:5rem}

/* ── ANCHOR: frame-breaking floating tilted mock ─────────────── */
.anchor-cta{overflow:visible;border:0;background:transparent;box-shadow:none;
  grid-template-columns:1.02fr .98fr;align-items:center;gap:0;position:relative}
.anchor-pitch{border-radius:18px;padding:2.6rem 2.4rem;box-shadow:0 20px 50px rgba(79,70,229,.28);position:relative;z-index:1}
.anchor-mock{position:relative;z-index:3;margin-left:-3.5rem;border-radius:16px;
  transform:rotate(-2.2deg);box-shadow:0 30px 70px rgba(11,13,18,.45);border:1px solid rgba(255,255,255,.1);
  transition:transform .35s ease}
.anchor-mock:hover{transform:rotate(0deg) translateY(-4px)}
.anchor-mock::after{content:"OPTIMIZER OUTPUT";position:absolute;top:-10px;right:14px;font-family:var(--mono);
  font-size:9px;letter-spacing:.14em;color:#fff;background:var(--cyan);border-radius:100px;padding:.2rem .6rem}
@media(max-width:1080px){.anchor-mock{margin-left:0;transform:none}.anchor-cta{gap:1rem}}

/* ── BROWSE: full-bleed triptych of vertical "doors" ─────────── */
.doors{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
.door{position:relative;min-height:300px;border-radius:16px;overflow:hidden;text-decoration:none;
  display:flex;flex-direction:column;justify-content:flex-end;padding:1.8rem;color:#fff;
  transition:transform .35s ease,box-shadow .35s ease;isolation:isolate}
.door::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--g)}
.door::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(11,13,18,.05) 0%,rgba(11,13,18,.55) 70%,rgba(11,13,18,.8) 100%)}
.door-grid{position:absolute;inset:0;z-index:-1;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
  background-size:34px 34px;mask-image:radial-gradient(circle at 70% 25%,#000,transparent 78%)}
.door:hover{transform:translateY(-6px);box-shadow:0 26px 60px rgba(11,13,18,.4)}
.door-tag{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.14em;
  color:rgba(255,255,255,.85);position:absolute;top:1.6rem;left:1.8rem;display:flex;align-items:center;gap:.5rem}
.door-num{position:absolute;top:1.2rem;right:1.7rem;font-family:var(--mono);font-size:3.4rem;font-weight:700;
  color:rgba(255,255,255,.14);line-height:1}
.door h3{font-size:1.45rem;line-height:1.12;margin:0 0 .5rem;color:#fff}
.door p{font-size:.86rem;color:rgba(255,255,255,.82);line-height:1.5;margin:0 0 1rem;max-width:34ch}
.door-foot{display:flex;align-items:center;gap:.6rem;font-family:var(--mono);font-size:11px;color:rgba(255,255,255,.9)}
.door-foot .chev{transition:transform .25s}.door:hover .door-foot .chev{transform:translateX(5px)}
.door-stat{font-weight:600}
@media(max-width:880px){.doors{grid-template-columns:1fr}.door{min-height:220px}}

/* ── METHOD: horizontal process scale (1 -> 6) ───────────────── */
.scale{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:0;margin-top:2.5rem}
.scale::before{content:"";position:absolute;top:22px;left:6%;right:6%;height:2px;
  background:linear-gradient(90deg,var(--accent),var(--cyan));opacity:.55}
.scale-node{position:relative;padding:0 .8rem;text-align:center}
.scale-num{width:46px;height:46px;border-radius:50%;margin:0 auto;display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-weight:600;font-size:1.05rem;color:#fff;background:var(--deep);
  border:2px solid var(--accent);position:relative;z-index:2}
.scale-node:nth-child(n+4) .scale-num{border-color:var(--cyan)}
.scale-name{font-family:var(--display);font-weight:700;font-size:.98rem;color:#fff;margin:.9rem 0 .3rem}
.scale-desc{font-size:.76rem;color:#9b9ba7;line-height:1.4}
.scale-head{max-width:620px}
@media(max-width:880px){.scale{grid-template-columns:repeat(2,1fr);gap:1.6rem 0}.scale::before{display:none}}

/* ── ADVISORY: asymmetric manifesto ──────────────────────────── */
.manifesto{display:grid;grid-template-columns:1.15fr .85fr;gap:3.5rem;align-items:start}
.manifesto-statement{font-family:var(--display);font-weight:700;font-size:clamp(1.7rem,3.4vw,2.6rem);
  line-height:1.14;letter-spacing:-.02em;color:var(--ink)}
.manifesto-statement em{color:var(--accent)}
.manifesto-sub{font-size:.95rem;color:var(--text-dim);line-height:1.65;margin-top:1.2rem;max-width:46ch}
.manifesto-sub a{color:var(--accent);font-weight:600;text-decoration:none}
.manifesto-list{display:flex;flex-direction:column;gap:0}
.mf-item{display:grid;grid-template-columns:auto 1fr;gap:1rem;padding:1.2rem 0;border-top:1px solid var(--line)}
.mf-item:last-child{border-bottom:1px solid var(--line)}
.mf-num{font-family:var(--mono);font-size:.85rem;font-weight:600;color:var(--accent)}
.mf-name{font-family:var(--display);font-weight:700;font-size:1.02rem;color:var(--ink)}
.mf-cred{font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:var(--cyan);margin:.15rem 0 .35rem}
.mf-body{font-size:.84rem;color:var(--text-dim);line-height:1.5}
@media(max-width:880px){.manifesto{grid-template-columns:1fr;gap:1.8rem}}

/* slim single-line capture seam (low density) */
.capture-seam{margin-top:5rem;padding:1.5rem 3rem;background:linear-gradient(120deg,#1b1840,#161418 70%);
  position:relative;overflow:hidden}
.capture-seam::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--accent),var(--cyan))}
.capture-seam-inner{max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.capture-seam .cs-copy{color:#fff;font-size:1rem;font-weight:500}
.capture-seam .cs-copy span{color:#f9a8d4;font-family:var(--mono);font-size:11px;display:block;margin-top:.2rem;text-transform:uppercase;letter-spacing:.1em}
.capture-seam .capture-form{flex:0 0 auto}

/* trust strip relocated into the footer (injected by gtm-extras on every page) */
.trust-footer{flex-basis:100%;order:-1;display:flex;flex-wrap:wrap;gap:1.25rem 1.75rem;justify-content:center;
  padding:0 0 1.1rem;margin-bottom:.4rem;border-bottom:1px solid var(--line);
  font-family:var(--mono);font-size:10.5px;letter-spacing:.02em;color:var(--text-dim)}
.trust-footer strong{color:var(--ink);font-weight:600}
.trust-footer .dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--up);
  margin-right:.4rem;vertical-align:middle;box-shadow:0 0 0 3px rgba(22,163,74,.18)}

/* ── RELATED ARTICLES (engine-rendered into #related-articles) ── */
.related-articles{max-width:760px;margin:3.25rem auto 0;padding:1.75rem 1.25rem 0;border-top:1px solid var(--line)}
.related-articles h2{font-family:var(--display);font-size:1.3rem;margin:0 0 1rem;color:var(--ink)}
.related-articles-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:.7rem}
.related-articles-list li{margin:0}
.related-articles-list a{display:flex;align-items:center;gap:.7rem;padding:.85rem 1rem;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);text-decoration:none;color:var(--ink);font-weight:600;font-size:.94rem;line-height:1.3;transition:border-color .15s ease,color .15s ease,transform .15s ease}
.related-articles-list a:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}
.related-articles-list img{border-radius:6px;flex:none}


/* ════════════════════════════════════════════════════════════
   THE FINE PRINT  --  shared series + converting-link components
   Implements LATTICE-INTERNAL-LINKING-DOCTRINE (peak-desire, visually
   dominant, one surgical next-step) + RINZARA-SERIES-THE-FINE-PRINT
   (badge, sibling-chain, follow-hook). Token-bound; renders on every
   page that loads rinzara-overhaul.css. Zero em-dashes. Added 2026-06-09.
   ════════════════════════════════════════════════════════════ */

/* Series eyebrow badge -- the investigative-identity signal (links to the hub) */
.tfp-badge{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.13em;color:#f9a8d4;text-decoration:none;background:var(--accent-light);border:1px solid rgba(219,39,119,.35);border-radius:999px;padding:.32rem .8rem .32rem .55rem;transition:border-color .18s,color .18s}
.tfp-badge:hover{border-color:var(--accent);color:#fff}
.tfp-badge .dot{width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--cyan));box-shadow:0 0 8px rgba(219,39,119,.7);flex:none}
.tfp-badge .sep{opacity:.45;font-weight:400}
.tfp-badge .tag{color:#fff;letter-spacing:.08em}

/* In-context converting link -- the ONE dominant next-step at peak desire.
   It is an <a>; weighted as the visually-obvious move. */
.tfp-bridge{display:block;text-decoration:none;position:relative;margin:1.9rem 0;padding:1.1rem 1.3rem 1.1rem 1.4rem;background:linear-gradient(135deg,rgba(219,39,119,.13),rgba(219,39,119,.03));border:1px solid rgba(219,39,119,.4);border-left:3px solid var(--accent);border-radius:0 14px 14px 0;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
.tfp-bridge:hover{transform:translateX(3px);border-color:var(--accent);box-shadow:var(--shadow-md)}
.tfp-bridge .k{font-family:var(--mono);font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--accent-hover);display:block;margin-bottom:.32rem}
.tfp-bridge .q{display:block;font-family:var(--display);font-weight:800;font-size:1.12rem;color:#fff;line-height:1.28;margin:0 0 .28rem}
.tfp-bridge .q::after{content:"\2192";color:var(--accent);font-family:var(--body);font-weight:700;display:inline-block;margin-left:.4rem;transition:transform .16s}
.tfp-bridge:hover .q::after{transform:translateX(4px)}
.tfp-bridge .d{display:block;font-size:.9rem;color:var(--text-dim);line-height:1.55;margin:0;max-width:64ch}
/* cross-network variant -- amber-weighted (signals a hop to a sister property) */
.tfp-bridge.net{background:linear-gradient(135deg,rgba(245,158,11,.12),rgba(245,158,11,.03));border-color:rgba(245,158,11,.4);border-left-color:var(--cyan)}
.tfp-bridge.net .k{color:var(--cyan)}
.tfp-bridge.net .q::after{color:var(--cyan)}

/* Continue The Fine Print -- the sibling-series chain at the completion-pause */
.tfp-continue{margin:2.4rem 0 0;padding:1.5rem 1.5rem 1.6rem;background:var(--deep);border:1px solid var(--line);border-radius:16px;position:relative;overflow:hidden}
.tfp-continue::before{content:"";position:absolute;top:0;bottom:0;left:0;width:3px;background:linear-gradient(180deg,var(--accent),var(--cyan))}
.tfp-continue .hd{display:flex;align-items:center;gap:.55rem;margin:0 0 .25rem}
.tfp-continue .hd .dot{width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--cyan));box-shadow:0 0 9px rgba(219,39,119,.7);flex:none}
.tfp-continue .hd h2,.tfp-continue .hd h3{font-family:var(--display);font-weight:800;font-size:1.18rem;color:#fff;margin:0;letter-spacing:-.01em}
.tfp-continue .lede{font-size:.86rem;color:var(--text-dim);margin:.1rem 0 1.1rem;line-height:1.5;max-width:64ch}
.tfp-chain{display:grid;grid-template-columns:repeat(auto-fit,minmax(218px,1fr));gap:.8rem}
.tfp-ep{display:block;text-decoration:none;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:1rem 1.05rem;transition:transform .15s,border-color .15s}
.tfp-ep:hover{transform:translateY(-2px);border-color:var(--accent)}
.tfp-ep .n{display:block;font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-hover)}
.tfp-ep .t{display:block;font-family:var(--display);font-weight:700;font-size:.96rem;color:#fff;line-height:1.28;margin:.32rem 0 .25rem}
.tfp-ep .s{display:block;font-size:.8rem;color:var(--text-dim);line-height:1.45;margin:0}

/* Follow the series -- capture hook (wired by rinzara-extras.js .email-micro pattern) */
.tfp-follow{margin-top:1.15rem;padding-top:1.15rem;border-top:1px solid var(--line)}
.tfp-follow p{font-size:.85rem;color:var(--text-dim);margin:0 0 .6rem;line-height:1.5}
.tfp-follow p strong{color:#fff}
.tfp-follow .email-micro{display:flex;gap:.5rem;flex-wrap:wrap;margin:0;align-items:center}
.tfp-follow .email-micro-icon{display:none}
.tfp-follow .email-micro-text{display:none}
.tfp-follow .email-micro-input{flex:1;min-width:200px;background:rgba(0,0,0,.32);border:1px solid var(--line);border-radius:9px;padding:.66rem .82rem;color:#fff;font-family:var(--body);font-size:.88rem}
.tfp-follow .email-micro-input:focus{outline:0;border-color:var(--accent)}
.tfp-follow .email-micro-btn{font-family:var(--mono);font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:#fff;background:linear-gradient(135deg,var(--accent),var(--cyan));border:0;border-radius:9px;padding:.66rem 1.05rem;cursor:pointer;white-space:nowrap;transition:transform .15s}
.tfp-follow .email-micro-btn:hover{transform:translateY(-1px)}
@media(max-width:600px){.tfp-chain{grid-template-columns:1fr}}


/* ══════════════════════════════════════════════════════════════════════
   VISUAL DIGESTIBILITY LAYER (.rz-wrap, canonized 2026-06-30)
   Rinzara-palette port of the dark #lc-art system: magenta #db2777 +
   amber #f59e0b on charcoal. Same component class vocabulary network-wide;
   per-article bespoke graphics add the CONTENT, this provides STYLE + motion.
   ══════════════════════════════════════════════════════════════════════ */
.rz-wrap .reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
.rz-wrap .reveal.in{opacity:1;transform:none}
.rz-wrap .lc-illus{position:relative;z-index:1;max-width:560px;margin:1.6rem auto .5rem;display:block}
.rz-wrap .lc-illus svg{width:100%;height:auto;display:block;filter:drop-shadow(0 12px 30px rgba(219,39,119,.24))}
.rz-wrap .lc-illus .wb{transform-origin:center bottom;animation:rzPulse 2.6s ease-in-out infinite}
@keyframes rzPulse{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.45)}}
.rz-wrap .lc-body p.lede,.rz-wrap p.lede{font-size:1.14rem;line-height:1.74;color:var(--ink)}
.rz-wrap main h2{position:relative;padding-left:1.05rem}
.rz-wrap main h2::before{content:"";position:absolute;left:0;top:.16em;bottom:.16em;width:5px;border-radius:3px;background:linear-gradient(180deg,#db2777,#f59e0b)}
.rz-wrap .pq{margin:2.1rem 0;padding:.3rem 0 .3rem 1.5rem;border-left:4px solid var(--accent);font-family:var(--display);font-weight:700;font-size:clamp(1.2rem,2.5vw,1.62rem);line-height:1.36;color:var(--ink);letter-spacing:-.015em}
.rz-wrap .pq .hl{background:linear-gradient(90deg,#f472b6,#fbbf24);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.rz-wrap .pq .src{display:block;margin-top:.55rem;font-family:var(--mono);font-size:.68rem;font-weight:400;letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint)}
.rz-wrap .key{display:flex;gap:.9rem;align-items:flex-start;margin:1.7rem 0;padding:1.05rem 1.2rem;background:linear-gradient(135deg,rgba(219,39,119,.14),rgba(245,158,11,.07));border:1px solid rgba(219,39,119,.3);border-radius:13px}
.rz-wrap .key .ic{flex:none;width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#db2777,#f59e0b);font-family:var(--display);font-weight:800;color:#fff;font-size:1rem}
.rz-wrap .key .kt{margin:0;color:var(--text);font-size:.93rem;line-height:1.62}
.rz-wrap .key .kt b{color:var(--ink);font-family:var(--display)}
.rz-wrap .lc-split{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:1.6rem 0;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.rz-wrap .lc-split figcaption{grid-column:1/-1;order:2;font-size:.78rem;color:var(--text-dim);line-height:1.55;padding:.85rem 1.2rem;background:var(--deep);border-top:1px solid var(--line)}
.rz-wrap .lc-split .pane{padding:1.25rem 1.3rem;position:relative;background:var(--card)}
.rz-wrap .lc-split .ent{background:linear-gradient(160deg,rgba(219,39,119,.1),var(--card))}
.rz-wrap .lc-split .ss{background:linear-gradient(160deg,rgba(245,158,11,.09),var(--card));border-left:1px solid var(--line)}
.rz-wrap .lc-split .ph{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;margin:0 0 .2rem;font-weight:700}
.rz-wrap .lc-split .ent .ph{color:#f472b6}
.rz-wrap .lc-split .ss .ph{color:#fbbf24}
.rz-wrap .lc-split .sub{font-size:.74rem;color:var(--text-faint);margin:0 0 .85rem}
.rz-wrap .lc-split .chips{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.85rem}
.rz-wrap .lc-split .chip{font-family:var(--mono);font-size:10px;color:var(--text);background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:5px;padding:.22rem .52rem}
.rz-wrap .lc-split .pr{font-family:var(--display);font-weight:800;font-size:1.2rem;margin:.1rem 0 .55rem;letter-spacing:-.02em;color:var(--ink)}
.rz-wrap .lc-split .ent .pr{color:#f9a8d4}
.rz-wrap .lc-split .ss .pr{color:#fcd34d}
.rz-wrap .lc-split .tags{margin:0;font-size:.82rem;color:var(--text-dim);line-height:1.85}
.rz-wrap .lc-split .tags .t{display:flex;align-items:flex-start;gap:.45rem}
.rz-wrap .lc-split .tags .t::before{content:"";width:5px;height:5px;border-radius:50%;flex:none;margin-top:.5em}
.rz-wrap .lc-split .ent .tags .t::before{background:#db2777}
.rz-wrap .lc-split .ss .tags .t::before{background:#f59e0b}
.rz-wrap .shot{margin:1.7rem 0;border:1px solid var(--line);border-radius:13px;overflow:hidden;background:var(--card)}
.rz-wrap .shot .bar{display:flex;align-items:center;gap:.5rem;padding:.55rem .85rem;background:var(--deep);border-bottom:1px solid var(--line)}
.rz-wrap .shot .bar i{width:9px;height:9px;border-radius:50%;background:#46414e;display:inline-block}
.rz-wrap .shot .bar .u{margin-left:.6rem;font-family:var(--mono);font-size:11px;color:var(--text-faint)}
.rz-wrap .shot img{display:block;width:100%;height:auto}
.rz-wrap .shot figcaption{font-size:.78rem;color:var(--text-faint);line-height:1.5;padding:.7rem .95rem;border-top:1px solid var(--line)}
@media(prefers-reduced-motion:reduce){.rz-wrap .reveal{opacity:1;transform:none;transition:none}.rz-wrap .lc-illus .wb{animation:none}}
@media(max-width:680px){.rz-wrap .lc-split{grid-template-columns:1fr}.rz-wrap .lc-split .ss{border-left:0;border-top:1px solid var(--line)}}


/* === RESPONSIVE TABLES (network heal 2026-07-30) === */
/* Wide comparison tables were pushing article pages into horizontal scroll on mobile (measured at
   390px by lattice-core/scripts/render-audit.mjs). Give the table its own scroll container so the
   PAGE never scrolls sideways, while thead/tbody stay display:table so the columns do not collapse
   and the table remains readable. Both rules are required; the first alone destroys the layout. */
table.data-table, table.pricing-table, table.capability-matrix, table.comparison-table,
.article-body table, main table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
table.data-table > thead, table.data-table > tbody,
table.pricing-table > thead, table.pricing-table > tbody,
table.capability-matrix > thead, table.capability-matrix > tbody,
table.comparison-table > thead, table.comparison-table > tbody,
.article-body table > thead, .article-body table > tbody,
main table > thead, main table > tbody {
  display: table;
  width: 100%;
  min-width: max-content;
}


/* === RESPONSIVE TABLES v2 (network heal 2026-07-30) === */
/* Wide comparison tables push article pages into horizontal scroll on mobile (measured at 390px by
   lattice-core/scripts/render-audit.mjs). Give every table its own scroll container so the PAGE
   never scrolls sideways, while thead/tbody stay display:table so the columns do not collapse and
   the table stays readable. BOTH rules are required; the first alone destroys the layout.
   Deliberately generic: the network uses 15+ distinct table class names and an explicit list has
   already been outrun once. */
table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
table > thead, table > tbody, table > tfoot {
  display: table;
  width: 100%;
  min-width: max-content;
}


/* === RESPONSIVE TABLES v3 (network heal 2026-07-30) === */
/* Wide comparison tables push article pages into horizontal scroll on mobile (measured at 390px by
   lattice-core/scripts/render-audit.mjs). Give every table its own scroll container so the PAGE
   never scrolls sideways, while thead/tbody stay display:table so the columns do not collapse and
   the table stays readable. BOTH rules are required; the first alone destroys the layout.
   Deliberately generic: the network uses 15+ distinct table class names and an explicit list has
   already been outrun once. */
table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
table > thead, table > tbody, table > tfoot {
  display: table;
  width: 100%;
  min-width: max-content;
}

/* Form controls must not outgrow their container either. The newsletter capture ships an email
   input with an inline `min-width:200px`, which together with its padding and the Subscribe button
   pushed three nesyona article pages 5px past a 390px viewport. A hard min-width on a flex child is
   the classic cause, and it is inline on the element, so only a max-width guard reaches it. */
input, select, textarea, button, img, video, iframe, pre {
  max-width: 100%;
}


/* === RESPONSIVE TABLES v4 (network heal 2026-07-30) === */
/* Wide comparison tables push article pages into horizontal scroll on mobile (measured at 390px by
   lattice-core/scripts/render-audit.mjs). Give every table its own scroll container so the PAGE
   never scrolls sideways, while thead/tbody stay display:table so the columns do not collapse and
   the table stays readable. BOTH rules are required; the first alone destroys the layout.
   Deliberately generic: the network uses 15+ distinct table class names and an explicit list has
   already been outrun once. */
table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
table > thead, table > tbody, table > tfoot {
  display: table;
  width: 100%;
  min-width: max-content;
}

/* Form controls must not outgrow their container either. The newsletter capture ships an email
   input with an inline `min-width:200px`, which together with its padding and the Subscribe button
   pushed three nesyona article pages 5px past a 390px viewport. A hard min-width on a flex child is
   the classic cause, and it is inline on the element, so only a max-width guard reaches it. */
input, select, textarea, button, img, video, iframe, pre {
  max-width: 100%;
}

/* max-width alone does not reach this one. The email input carries an INLINE `min-width:200px`, and
   an inline style beats a stylesheet rule, so the flex row stays wider than its parent and the page
   keeps scrolling 5px. A min-width floor on a flex child is the standard cause of exactly this, and
   `!important` is the only lever that reaches an inline declaration — used deliberately here and
   scoped to one control rather than sprayed across the sheet. */
form input[type="email"] {
  min-width: 0 !important;
}


/* === RESPONSIVE TABLES v5 (network heal 2026-07-30) === */
/* Wide comparison tables push article pages into horizontal scroll on mobile (measured at 390px by
   lattice-core/scripts/render-audit.mjs). Give every table its own scroll container so the PAGE
   never scrolls sideways, while thead/tbody stay display:table so the columns do not collapse and
   the table stays readable. BOTH rules are required; the first alone destroys the layout.
   Deliberately generic: the network uses 15+ distinct table class names and an explicit list has
   already been outrun once. */
table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
table > thead, table > tbody, table > tfoot {
  display: table;
  width: 100%;
  min-width: max-content;
}

/* Form controls must not outgrow their container either. The newsletter capture ships an email
   input with an inline `min-width:200px`, which together with its padding and the Subscribe button
   pushed three nesyona article pages 5px past a 390px viewport. A hard min-width on a flex child is
   the classic cause, and it is inline on the element, so only a max-width guard reaches it. */
input, select, textarea, button, img, video, iframe, pre {
  max-width: 100%;
}

/* max-width alone does not reach this one. The email input carries an INLINE `min-width:200px`, and
   an inline style beats a stylesheet rule, so the flex row stays wider than its parent and the page
   keeps scrolling 5px. A min-width floor on a flex child is the standard cause of exactly this, and
   `!important` is the only lever that reaches an inline declaration — used deliberately here and
   scoped to one control rather than sprayed across the sheet. */
form input[type="email"] {
  min-width: 0 !important;
}

/* Long unbroken links. On LensPOV the widest element on four pages was an <a> at 547-678px against
   a 390px viewport: raw URLs used as citation link text, which have no spaces to wrap at, so the
   browser lets them run past the edge and the whole page scrolls sideways. The U3 citation campaign
   adds MORE external links, so this gets worse as the network gets better sourced unless it is
   fixed at the stylesheet. */
a, code, kbd, samp {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* `.rz-eye` renders var(--accent) #db2777 on the dark surface #1c1a1f = 3.75:1.
   ⛔ --accent is not retuned: it is a FILL elsewhere on this property, and text-on-dark and
   white-on-fill need opposite directions. #f72c86 gives 4.65 on that surface.
   ⚠️ Written as `span.rz-eye` (0,1,1) rather than `.rz-eye` (0,1,0): the failing declaration lives
   in an INLINE <style> block in the page, which beats an external sheet on source order, so equal
   specificity would have lost silently. */
span.rz-eye { color: #f72c86; }
