.sr-only { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0 0 0 0) !important; white-space:nowrap !important; border:0 !important; }
/* Five-ellipse distributed diagram: centers on small inner circle */
.pain-venn-five { position:relative; max-width:540px; margin:1.6rem auto 2.3rem; aspect-ratio:1 / 1; }
.pain-venn-five .circle {
  position:absolute;
  width:78%; height:34%; border-radius:50%;
  opacity:.72;
  mix-blend-mode:multiply;
  transition:transform .45s ease, opacity .45s ease;
  background:transparent;
  /* JS will set left/top for center positioning */
  transform:rotate(var(--rot,0deg));
}
/* Per-ellipse rotation + colors */
.pain-venn-five .circle.fragmentation { --rot:90deg;   border:2px solid rgba(79,70,229,.85);  background-color:rgba(79,70,229,.12); }
.pain-venn-five .circle.exposure     { --rot:72deg;  border:2px solid rgba(236,72,153,.85); background-color:rgba(236,72,153,.12); }
.pain-venn-five .circle.visibility    { --rot:144deg; border:2px solid rgba(124,58,237,.85); background-color:rgba(124,58,237,.12); }
.pain-venn-five .circle.audit         { --rot:216deg; border:2px solid rgba(14,165,233,.85);  background-color:rgba(14,165,233,.12); }
.pain-venn-five .circle.fatigue       { --rot:288deg; border:2px solid rgba(234,179,8,.85);   background-color:rgba(234,179,8,.12); }
.pain-venn-five .center-solution { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:140px; height:140px; border-radius:50%; background:linear-gradient(135deg,#ffffff,#f5f8ff); box-shadow:0 8px 26px -10px rgba(0,0,0,.35), 0 0 0 1px rgba(79,70,229,.35); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.4rem; text-align:center; padding:.7rem .75rem; }
.center-solution .logo { font:700 .8rem/1 var(--font-sans); letter-spacing:.18em; text-transform:uppercase; background:linear-gradient(90deg,#4f46e5,#7c3aed 55%,#ec4899); -webkit-background-clip:text; color:transparent; }
.center-solution .tag { font:600 .65rem/1.2 var(--font-sans); color:#64748b; }
[data-theme="dark"] .pain-venn-five .circle { filter:brightness(1.08); }
[data-theme="dark"] .pain-venn-five .center-solution { background:linear-gradient(135deg,#0f141a,#1b2531); box-shadow:0 8px 26px -10px rgba(0,0,0,.7), 0 0 0 1px rgba(124,58,237,.5); }
.pain-points { display:grid; gap:.65rem; margin:0 0 1.6rem; padding:0; list-style:none; max-width:760px; margin-left:auto; margin-right:auto; }
.pain-points li { position:relative; padding-left:1.15rem; font-size:.78rem; line-height:1.45; color:#475569; cursor:default; }
.pain-points li .point-label { font-weight:600; letter-spacing:.05em; }
.pain-points li::before { content:""; position:absolute; left:0; top:.55em; width:10px; height:10px; border-radius:50%; background:#4f46e5; box-shadow:0 0 0 2px rgba(79,70,229,.25); }
.pain-points li[data-circle="exposure"]::before { background:#ec4899; box-shadow:0 0 0 2px rgba(236,72,153,.25); }
.pain-points li[data-circle="visibility"]::before { background:#7c3aed; box-shadow:0 0 0 2px rgba(124,58,237,.25); }
.pain-points li[data-circle="audit"]::before { background:#0ea5e9; box-shadow:0 0 0 2px rgba(14,165,233,.25); }
.pain-points li[data-circle="fatigue"]::before { background:#eab308; box-shadow:0 0 0 2px rgba(234,179,8,.25); }
[data-theme="dark"] .pain-points li { color:#cbd5e1; }
@media (min-width:800px){
  .pain-points { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (prefers-reduced-motion:no-preference){
  .pain-venn-five .circle, .center-solution { transition:transform .45s ease, opacity .45s ease; }
  .pain-points li { transition:color .25s ease; }
  .pain-points li:hover { color:#0f172a; }
  [data-theme="dark"] .pain-points li:hover { color:#ffffff; }
}
.pain-points li:focus-visible { outline:2px solid var(--color-accent); outline-offset:3px; border-radius:6px; }
/* Highlight interactions (JS will add .active) */
.pain-venn-five .circle { opacity:.72; }
.pain-venn-five .circle.active { opacity:1; transform:rotate(var(--rot,0deg)) scale(1.06); }
.pain-points li.active { color:#0f172a; font-weight:600; }
[data-theme="dark"] .pain-points li.active { color:#fafafa; }

/* External pain labels with connector lines */
.pain-venn-five .pain-label { position:absolute; width:150px; max-width:160px; font-size:.65rem; line-height:1.3; background:#ffffff; border:1px solid #e2e8f0; padding:.55rem .6rem .6rem; border-radius:12px; box-shadow:0 4px 12px -6px rgba(0,0,0,.25); cursor:default; display:grid; grid-template-columns:12px 1fr; grid-template-areas:"dot head" "body body"; column-gap:.45rem; align-items:center; }
[data-theme="dark"] .pain-venn-five .pain-label { background:#121a24; border:1px solid rgba(255,255,255,.08); box-shadow:0 4px 14px -6px rgba(0,0,0,.6); }
.pain-venn-five .pain-label .label-head { font:600 .55rem/1 var(--font-sans); letter-spacing:.12em; text-transform:uppercase; color:#64748b; grid-area:head; }
[data-theme="dark"] .pain-venn-five .pain-label .label-head { color:#94a3b8; }
.pain-venn-five .pain-label .label-body { font-size:.62rem; color:#475569; grid-area:body; margin-top:.25rem; }
[data-theme="dark"] .pain-venn-five .pain-label .label-body { color:#cbd5e1; }
.pain-venn-five .pain-label::before { content:""; width:10px; height:10px; border-radius:50%; background:#4f46e5; box-shadow:0 0 0 2px rgba(79,70,229,.25); grid-area:dot; }
.pain-venn-five .pain-label.exposure::before { background:#ec4899; box-shadow:0 0 0 2px rgba(236,72,153,.25); }
.pain-venn-five .pain-label.visibility::before { background:#7c3aed; box-shadow:0 0 0 2px rgba(124,58,237,.25); }
.pain-venn-five .pain-label.audit::before { background:#0ea5e9; box-shadow:0 0 0 2px rgba(14,165,233,.25); }
.pain-venn-five .pain-label.fatigue::before { background:#eab308; box-shadow:0 0 0 2px rgba(234,179,8,.25); }
/* Connector lines removed */
.pain-venn-five .pain-label::after,
.pain-venn-five .pain-label.exposure::after,
.pain-venn-five .pain-label.visibility::after,
.pain-venn-five .pain-label.audit::after,
.pain-venn-five .pain-label.fatigue::after { display:none; }
/* Positions */
.pain-venn-five .pain-label.fragmentation { top:4%; left:8%; }
.pain-venn-five .pain-label.exposure { top:4%; right:8%; }
.pain-venn-five .pain-label.visibility { top:50%; right:2%; transform:translateY(-50%); }
.pain-venn-five .pain-label.audit { bottom:6%; right:12%; }
.pain-venn-five .pain-label.fatigue { bottom:6%; left:10%; }
/* Adjust connector lines orientation for right-side labels */
.pain-venn-five .pain-label.exposure::after { left:auto; right:-58px; }
.pain-venn-five .pain-label.visibility::after { left:auto; right:-62px; width:64px; }
.pain-venn-five .pain-label.audit::after { left:auto; right:-58px; }
/* Bottom-left fatigue line stays default (left) */
@media (max-width:740px){
  .pain-venn-five .pain-label { position:static; width:100%; max-width:none; margin:.5rem 0; box-shadow:0 2px 6px -4px rgba(0,0,0,.25); }
  .pain-venn-five { aspect-ratio:1 / 0.75; }
  .pain-venn-five .pain-label::after { display:none; }
  .pain-venn-five .pain-label.fragmentation,
  .pain-venn-five .pain-label.exposure,
  .pain-venn-five .pain-label.visibility,
  .pain-venn-five .pain-label.audit,
  .pain-venn-five .pain-label.fatigue { top:auto; left:auto; right:auto; bottom:auto; transform:none; }
}
@media (prefers-reduced-motion:no-preference){
  .pain-venn-five .pain-label { transition:box-shadow .25s ease, transform .25s ease; }
  .pain-venn-five .pain-label:hover { transform:translateY(-3px); box-shadow:0 8px 18px -6px rgba(0,0,0,.35); }
}
.pain-venn-five .pain-label.active { outline:2px solid var(--color-accent); outline-offset:2px; }
/* Value Proposition Section */
.value-prop-section { background:linear-gradient(90deg,rgba(99,102,241,.04),rgba(236,72,153,.03)); padding:clamp(2.6rem,7vw,4.2rem) 0; }
.value-prop-wrapper { max-width:1160px; margin:0 auto; padding:0 1.2rem; }
.value-prop-cols { display:grid; grid-template-columns:1fr 1.2fr; gap:3.2rem; align-items:start; }
.value-prop-left { display:flex; flex-direction:column; gap:2.2rem; justify-content:center; }
.value-prop-right { display:flex; flex-direction:column; gap:1.2rem; }
.value-prop-section h2 { font-size:clamp(1.7rem,3vw,2.2rem); font-weight:700; margin:0 0 1.2rem; letter-spacing:.5px; color:#1e293b; }
[data-theme="dark"] .value-prop-section h2 { color:#fafafa; }
.value-prop-stats { display:flex; gap:1.2rem; flex-wrap:wrap; }
.stat-block { background:#f1f5f9; border:1px solid #e2e8f0; border-radius:14px; padding:1.1rem 1.3rem; min-width:160px; flex:1 1 160px; display:flex; flex-direction:column; align-items:flex-start; box-shadow:0 2px 8px -4px rgba(99,102,241,.07); }
[data-theme="dark"] .stat-block { background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.15); color:var(--color-text-dim); }
.stat-label { font-size:.78rem; font-weight:600; color:#64748b; margin-bottom:.3rem; letter-spacing:.04em; }
.stat-main { font-size:1.25rem; font-weight:700; color:#4f46e5; margin-bottom:.2rem; }
.stat-sub { font-size:.8rem; color:#475569; }
[data-theme="dark"] .stat-main { color:#a96bff; }
.value-prop-h3 { font-size:1.1rem; font-weight:700; margin:0 0 .7rem; letter-spacing:.04em; color:#4f46e5; }
.value-prop-lead { font-size:.98rem; color:#334155; margin-bottom:1.1rem; }
[data-theme="dark"] .value-prop-lead { color:#d5dbe3; }
.value-prop-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:1.2rem; font-size:.97rem; }
.value-prop-list li { background:none; border:none; padding:0; }
.value-prop-arrow { display:block; margin-top:.5rem; font-size:.92rem; color:#4f46e5; font-weight:600; letter-spacing:.02em; }
[data-theme="dark"] .value-prop-arrow { color:#a96bff; }
.value-prop-microtag { margin:2.2rem auto 0; text-align:center; font-size:.85rem; color:#64748b; opacity:.88; max-width:520px; }
[data-theme="dark"] .value-prop-microtag { color:#94a3b8; opacity:.85; }
@media (max-width:900px){
  .value-prop-cols { grid-template-columns:1fr; gap:2.2rem; }
  .value-prop-left, .value-prop-right { align-items:center; text-align:center; }
  .value-prop-stats { justify-content:center; }
}
/* Marketing / Landing & Pricing Styles */
:root {
  /* Light, calm hero gradient (Stripe-inspired) */
  --grad-hero: radial-gradient(circle at 22% 28%, rgba(99,102,241,.18), rgba(255,255,255,0) 55%),
               radial-gradient(circle at 78% 62%, rgba(236,72,153,.16), rgba(255,255,255,0) 60%),
               linear-gradient(145deg,#ffffff 0%, #f5f8ff 60%, #ffffff 100%);
  --card-bg: var(--color-surface, #151b23);
  --pricing-accent: linear-gradient(135deg,#4f8bff,#7869ff 60%,#a96bff);
  --grid-fg: rgba(255,255,255,0.04);
  --grid-fg-strong: rgba(255,255,255,0.07);
}

/* Dark theme restores original richer contrast gradient */
[data-theme="dark"] {
  --grad-hero: radial-gradient(circle at 30% 20%, rgba(120,140,255,.35), rgba(30,30,60,0) 60%),
               linear-gradient(145deg, #0d1117 0%, #101826 60%, #0d1117 100%);
}

.hero { position:relative; padding: clamp(3.2rem, 8vw, 6.2rem) clamp(1.4rem, 4vw, 3.4rem) 3.2rem; text-align:center; background:transparent; overflow:hidden; }
/* Layout container only now – no glass panel */
.hero-content { margin:0 auto; max-width:1040px; padding:0 1.4rem; }
.hero h1 { font-size: clamp(2.35rem, 5.3vw, 3.55rem); line-height:1.06; margin:0 0 1.1rem; letter-spacing:-.5px; font-weight:700; color:#0f172a; }
[data-theme="dark"] .hero h1 { color:#fafafa; }
.hero h1 .gradient { background:linear-gradient(90deg,#4f46e5,#7c3aed,#ec4899); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero p.lede { max-width:780px; margin:0 auto 2rem; font-size: clamp(1.075rem,1.45vw,1.26rem); line-height:1.5; color:#475569; font-weight:400; }
[data-theme="dark"] .hero p.lede { color:#d5dbe3; }
/* Remove previous text shadows for cleaner, crisper text */
.hero h1, .hero p.lede { text-shadow:none; }
.hero .cta-row { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.hero .cta-row .button.primary { background:var(--color-accent); color:#fff; }
.hero .meta-badges { margin-top:2.1rem; display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.hero .meta-badges .badge { font:600 11px/1 var(--font-sans); letter-spacing:.07em; text-transform:uppercase; background:#f1f5f9; border:1px solid #e2e8f0; padding:.55rem .7rem; border-radius:999px; color:#475569; }
[data-theme="dark"] .hero .meta-badges .badge { background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.15); color:var(--color-text-dim); backdrop-filter:none; }

/* Signup form replacing legacy CTAs */
.hero .signup-form { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:0 auto 1.75rem; max-width:620px; }
.hero .signup-form input[type=email] { flex:1 1 260px; min-width:240px; padding:.85rem 1rem; border:1px solid #cbd5e1; border-radius:12px; font:500 .9rem/1.1 var(--font-sans); background:#fff; color:#0f172a; box-shadow:0 2px 4px rgba(0,0,0,.04); transition:border-color .2s, box-shadow .2s; }
.hero .signup-form input[type=email]:focus { outline:2px solid var(--color-accent); outline-offset:2px; border-color:var(--color-accent); box-shadow:0 0 0 3px rgba(99,102,241,.25); }
[data-theme="dark"] .hero .signup-form input[type=email] { background:#0f141a; border:1px solid #334155; color:#e2e8f0; box-shadow:0 2px 4px rgba(0,0,0,.6); }
[data-theme="dark"] .hero .signup-form input[type=email]:focus { box-shadow:0 0 0 3px rgba(120,120,255,.35); }
.hero .signup-form button { padding:.9rem 1.4rem; border-radius:12px; font:600 .85rem/1 var(--font-sans); letter-spacing:.05em; display:inline-flex; align-items:center; gap:.5rem; }
@media (max-width:560px){
  .hero .signup-form { flex-direction:column; }
  .hero .signup-form input[type=email] { width:100%; min-width:0; flex:0 0 auto; }
  .hero .signup-form button { width:100%; }
  /* Reduce vertical padding so input height matches desktop proportion */
  .hero .signup-form input[type=email] { padding:.65rem .95rem; }
}

.hero .signup-footnote { margin: -.9rem auto 2.1rem; font:500 .68rem/1.5 var(--font-sans); letter-spacing:.04em; color:#64748b; opacity:.9; }
[data-theme="dark"] .hero .signup-footnote { color:#94a3b8; opacity:.85; }

.section { padding: clamp(2.8rem, 7vw, 4.4rem) clamp(1.2rem, 4vw, 3rem); }
.section.narrow { max-width:1160px; margin:0 auto; }
.section h2 { font-size: clamp(1.8rem,3.2vw,2.3rem); margin:0 0 1.2rem; letter-spacing:.5px; }

/* Removed obsolete .pricing-bg-wrapper (markup no longer uses it) */

.features-grid { display:grid; gap:26px; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); margin-top:1.6rem; }
.feature-card { background:var(--card-bg); border:1px solid var(--color-border); border-radius:18px; padding:1.2rem 1.15rem 1.35rem; position:relative; overflow:hidden; }
.feature-card h3 { margin:0 0 .4rem; font-size:1.02rem; letter-spacing:.3px; }
.feature-card p { margin:0; font-size:.85rem; line-height:1.35; color:var(--color-text-dim); }

/* How it works stage styling */
.features-grid.how-it-works { counter-reset: hiw; }
.feature-card.stage { padding-top:1.4rem; }
.feature-card.stage .stage-number {
  --size: 40px;
  width:var(--size); height:var(--size);
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,#4f8bff,#7869ff 60%,#a96bff);
  color:#fff; font:600 0.85rem/1 var(--font-sans);
  border-radius:12px; /* squircle pill */
  box-shadow:0 4px 10px -4px rgba(80,120,255,.45), 0 0 0 1px rgba(255,255,255,.08) inset;
  margin:0 0 .9rem; letter-spacing:.5px; position:relative; isolation:isolate;
}
.feature-card.stage .stage-number::after {
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none;
  background:linear-gradient(140deg,#ffffff55,#ffffff05);
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  opacity:.8;
}
@media (prefers-reduced-motion:no-preference){
  .feature-card.stage { transition:transform .25s ease, box-shadow .25s ease; }
  .feature-card.stage:hover { transform:translateY(-4px); box-shadow:0 10px 22px -6px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.04) inset; }
}

.pricing-overview { margin-top:2rem; display:flex; flex-wrap:wrap; gap:28px; justify-content:center; }
/* Ensure up to four cards per row within 1160px container (260*4 + gaps = 1124) */
.price-card { flex:0 1 260px; }
@media (min-width:1300px){
  /* Allow slight growth on very wide screens without breaking 4-column rhythm */
  .price-card { flex:0 1 230px; }
}
@media (max-width:680px){
  .price-card { flex:0 1 240px; }
}
.price-card { display:flex; flex-direction:column; background:var(--card-bg); border:1px solid var(--color-border); border-radius:20px; padding:1.5rem 1.35rem 1.65rem; position:relative; box-shadow:0 2px 4px rgba(0,0,0,.3), 0 0 0 1px rgba(255,255,255,.02) inset; transition:box-shadow .25s, transform .25s, border-color .25s; }
.price-card.highlight {
  /* Accessibility tweak: remove intense gradient fill that reduced legibility */
  background: var(--card-bg);
  border:1px solid rgba(120,150,255,.55);
  box-shadow:0 6px 20px -6px rgba(80,120,255,.35), 0 0 0 1px rgba(255,255,255,.05) inset;
  position:relative;
}
.price-card.highlight::before {
  /* Subtle gradient ring accent (keeps interior neutral for contrast) */
  content:"";
  position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none;
  background:linear-gradient(140deg,#4f8bff,#7869ff 60%,#a96bff);
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}
.price-card.highlight:hover { box-shadow:0 10px 28px -6px rgba(80,120,255,.48), 0 0 0 1px rgba(255,255,255,.06) inset; }
.price-card:hover { transform:translateY(-3px); box-shadow:0 6px 22px -6px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.05) inset; }
.price-card.highlight:hover { box-shadow:0 8px 28px -6px rgba(90,140,255,.6), 0 0 0 1px rgba(255,255,255,.06) inset; }
.price-card:focus-within, .price-card:focus { outline:2px solid var(--color-accent); outline-offset:3px; }
.price-card[tabindex] { cursor:pointer; }

/* Ribbon badge for highlighted tier (redesigned: remove 45deg tilt, adopt pill badge) */
/* Simplified ribbon: subtle pill, reduced visual weight */
/* Centered badge (non-overlapping) */
/* Highlight badge sits above card, not impacting layout */
.price-card.highlight { position:relative; }
.price-card.highlight .ribbon {
  position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  display:inline-flex; align-items:center; justify-content:center;
  background:#ffffff; /* neutral base for contrast */
  color:#1e3a8a;
  font:600 10px/1 var(--font-sans);
  padding:5px 14px; border-radius:14px;
  letter-spacing:.09em; text-transform:uppercase;
  border:1px solid rgba(79,139,255,.35);
  box-shadow:0 4px 10px -4px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.6) inset;
  pointer-events:none; /* avoid blocking clicks */
  background:linear-gradient(180deg,#ffffff,#f5f8ff);
}
[data-theme="dark"] .price-card.highlight .ribbon {
  background:linear-gradient(180deg,#0f141a,#101b26);
  color:#93c5fd;
  border:1px solid rgba(79,139,255,.45);
  box-shadow:0 4px 10px -4px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.06) inset;
}
.price-card.highlight .ribbon span { letter-spacing:.09em; }
@media (prefers-reduced-motion:no-preference){
  .price-card.highlight .ribbon { transition:box-shadow .25s, background .25s; }
  .price-card.highlight:hover .ribbon { box-shadow:0 6px 14px -4px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.7) inset; }
}
.price-card h3 { margin:0 0 .6rem; font-size:1.05rem; letter-spacing:.4px; }
.price-card .tagline { font-size:.7rem; letter-spacing:.15em; text-transform:uppercase; font-weight:600; color:var(--color-text-dim); margin-bottom:.75rem; }
.price { font:600 1.8rem/1 var(--font-sans); margin-bottom:.3rem; }
.price small { font-size:.55em; font-weight:500; color:var(--color-text-dim); }
.price-card h3,
.price-card .tagline,
.price-card .price,
.price-card .subprice,
.price-card p[aria-label="Plan limits"],
.price-card .actions { text-align:center; }
/* Slightly increased tracking for centered uppercase tagline for optical balance */
.price-card .tagline { letter-spacing:.18em; }
.price-card ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.5rem; font-size:.75rem; line-height:1.3; flex-grow:1; }
.price-card ul li { display:flex; gap:.4rem; }
.price-card ul li svg { flex-shrink:0; margin-top:2px; color:var(--color-ok); }
.price-card .actions { margin-top:auto; }
.price-card .actions .button { width:100%; }

.comparison-link { text-align:center; margin-top:1.6rem; font-size:.8rem; }

.footer { padding:2.5rem 1rem 3.5rem; text-align:center; font-size:.72rem; color:var(--color-text-dim); }

/* Origin / brand narrative enhancements */
.hero .lede-secondary { max-width:720px; margin: -1.1rem auto 1.4rem; font:500 .72rem/1.35 var(--font-sans); letter-spacing:.08em; text-transform:uppercase; color:#64748b; opacity:.78; }
[data-theme="dark"] .hero .lede-secondary { color:#94a3b8; opacity:.85; }

.origin-band { position:relative; padding:.85rem 1rem; background:linear-gradient(90deg, rgba(99,102,241,.07), rgba(120,70,255,.05)); border-top:1px solid rgba(99,102,241,.18); border-bottom:1px solid rgba(99,102,241,.12); font-size:.7rem; letter-spacing:.04em; }
.origin-inner { max-width:1040px; margin:0 auto; display:flex; flex-wrap:wrap; gap:.45rem; align-items:center; color:#475569; }
.origin-inner strong { font-weight:600; color:#1e293b; }
[data-theme="dark"] .origin-band { background:linear-gradient(90deg, rgba(99,102,241,.15), rgba(120,70,255,.12)); border-top:1px solid rgba(255,255,255,.08); border-bottom:1px solid rgba(255,255,255,.06); }
[data-theme="dark"] .origin-inner { color:#cbd5e1; }
[data-theme="dark"] .origin-inner strong { color:#f8fafc; }

@media (max-width: 760px){
  .hero { padding-top:3.5rem; }
  .hero .meta-badges { margin-top:1.6rem; }
}
@media (max-width: 360px){
  .hero { padding:2.1rem 1rem 2.4rem; }
  .hero h1 { font-size: clamp(1.9rem, 7vw, 2.4rem); }
  .hero p.lede { font-size: clamp(.95rem, 4.2vw, 1.05rem); }
}

/* Removed WHY REPOD legacy section selectors (landing variant deprecated). */

/* Audience & Pain sections refined (no backgrounds, minimal accents) */
.section h2.decorated::after {
  content:""; display:block; width:64px; height:4px; margin:.55rem 0 0;
  border-radius:4px; background:linear-gradient(90deg,#4f46e5,#7c3aed 55%,#ec4899);
}
.bullets { list-style:none; margin:.2rem 0 0; padding:0; display:grid; gap:.65rem; }
.bullets.three { grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
.bullets.five { grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); }
.bullets li { position:relative; padding-left:1.05rem; font-size:.8rem; line-height:1.45; color:#475569; }
[data-theme="dark"] .bullets li { color:#94a3b8; }
.bullets li::before { content:""; position:absolute; left:0; top:.55em; width:8px; height:8px; border-radius:50%; background:linear-gradient(135deg,#4f8bff,#7869ff 60%,#a96bff); }
.bullets.who-for-list { display:flex; flex-direction:column; gap:.85rem; margin-top:.6rem; }
.bullets.who-for-list li { padding-left:1.1rem; font-size:.82rem; }
.bullets.who-for-list li { padding-left:1.1rem; font-size:.9rem; }
.wf-role { font-weight:600; color:#0f172a; }
.wf-role { font-weight:600; color:#0f172a; font-size:.95em; }
.bullets.who-for-list li::before { top:.5em; box-shadow:0 0 0 3px rgba(79,70,229,.18); }
.wf-role { font-weight:600; color:#0f172a; }
[data-theme="dark"] .wf-role { color:#fafafa; }
.microtag { display:inline-block; font:600 .55rem/1 var(--font-sans); letter-spacing:.12em; padding:.35rem .55rem; border-radius:999px; background:#f1f5f9; color:#475569; margin:.3rem 0 .8rem; }
[data-theme="dark"] .microtag { background:rgba(255,255,255,.08); color:#cbd5e1; }
.microtag.warn { background:#fff7ed; color:#c2410c; }
[data-theme="dark"] .microtag.warn { background:rgba(255,120,60,.12); color:#ffb38a; }
.section + .section { padding-top:2.2rem; }

/* Audience editorial cards */
.audience-cards { display:flex; flex-wrap:wrap; gap:1rem; margin:.9rem 0 0; }
.audience-card { flex:1 1 240px; min-width:230px; border:1px solid var(--color-border); border-radius:18px; padding:.9rem .95rem 1rem; background:var(--card-bg); position:relative; overflow:hidden; }
.audience-card::before { content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:linear-gradient(180deg,#4f46e5,#7c3aed 55%,#ec4899); opacity:.28; }
.role-badge { display:inline-block; font:600 .6rem/1 var(--font-sans); letter-spacing:.08em; padding:.4rem .65rem .42rem; border-radius:999px; background:#f1f5f9; color:#475569; margin:0 0 .55rem; box-shadow:0 1px 2px rgba(0,0,0,.06); }
[data-theme="dark"] .role-badge { background:#1e293b; color:#94a3b8; }
.audience-card .pain { margin:0 0 .55rem; font-size:.74rem; line-height:1.35; color:#475569; font-weight:500; letter-spacing:.02em; }
.audience-card .resolution { margin:0; font-size:.7rem; line-height:1.35; color:#0f6848; font-weight:500; display:flex; align-items:flex-start; gap:.35rem; }
.audience-card .resolution svg { margin-top:2px; color:#0f6848; }
[data-theme="dark"] .audience-card .pain { color:#94a3b8; }
[data-theme="dark"] .audience-card .resolution { color:#34d399; }
[data-theme="dark"] .audience-card .resolution svg { color:#34d399; }
@media (prefers-reduced-motion:no-preference){
  .audience-card { transition:box-shadow .25s ease, transform .25s ease; }
  .audience-card:hover { transform:translateY(-3px); box-shadow:0 8px 20px -6px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.05) inset; }
}

/* Pain timeline */
.timeline { position:relative; margin:1.2rem 0 2.4rem; padding-left:1.6rem; }
.timeline::before { content:""; position:absolute; left:.5rem; top:.2rem; bottom:.2rem; width:2px; background:linear-gradient(180deg,#4f46e5,#7c3aed 55%,#ec4899); border-radius:2px; }
.timeline li { list-style:none; margin:0 0 1.25rem; position:relative; }
.timeline li:last-child { margin-bottom:0; }
.timeline li::before { content:""; position:absolute; left:-1.05rem; top:.45rem; width:12px; height:12px; border-radius:50%; background:#fff; box-shadow:0 0 0 3px rgba(79,70,229,.25); }
[data-theme="dark"] .timeline li::before { background:#0f141a; }
.timeline h3 { margin:0 0 .35rem; font-size:.7rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:#64748b; }
[data-theme="dark"] .timeline h3 { color:#94a3b8; }
.timeline p { margin:0; font-size:.78rem; line-height:1.45; color:#475569; }
[data-theme="dark"] .timeline p { color:#cbd5e1; }

/* Pain Venn Diagram */
.pain-venn { position:relative; max-width:680px; margin:1.4rem auto 2.6rem; aspect-ratio:1 / 0.62; }
.pain-venn .circle { position:absolute; width:48%; height:78%; top:10%; left:6%; border-radius:50%; background:radial-gradient(circle at 40% 40%, rgba(79,70,229,.55), rgba(79,70,229,.0) 65%); mix-blend-mode:multiply; filter:saturate(110%); }
.pain-venn .circle.exposure { left:26%; background:radial-gradient(circle at 50% 45%, rgba(236,72,153,.55), rgba(236,72,153,.0) 65%); }
.pain-venn .circle.visibility { left:46%; background:radial-gradient(circle at 60% 45%, rgba(124,58,237,.55), rgba(124,58,237,.0) 65%); }
.pain-venn .center-user { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:120px; height:120px; border-radius:50%; background:linear-gradient(135deg,#ffffff,#f5f8ff); box-shadow:0 6px 18px -6px rgba(0,0,0,.25), 0 0 0 1px rgba(79,70,229,.35); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.35rem; text-align:center; padding:.6rem .7rem; }
.center-user .label { font:600 .6rem/1 var(--font-sans); letter-spacing:.14em; text-transform:uppercase; color:#64748b; }
.center-user .need { font:600 .7rem/1.15 var(--font-sans); color:#4f46e5; }
[data-theme="dark"] .pain-venn .circle { filter:brightness(1.05); }
[data-theme="dark"] .pain-venn .center-user { background:linear-gradient(135deg,#0f141a,#18202b); box-shadow:0 6px 18px -6px rgba(0,0,0,.65), 0 0 0 1px rgba(124,58,237,.45); }
.pain-legend { display:flex; flex-wrap:wrap; gap:1rem; justify-content:center; margin:-.5rem 0 1.2rem; }
.pain-legend .legend-item { display:flex; align-items:center; gap:.45rem; font-size:.65rem; letter-spacing:.06em; font-weight:600; color:#64748b; }
.pain-legend .swatch { width:14px; height:14px; border-radius:4px; background:linear-gradient(135deg,#4f46e5,#4f46e5); box-shadow:0 0 0 1px rgba(0,0,0,.15); }
.pain-legend .swatch.exposure { background:linear-gradient(135deg,#ec4899,#ec4899); }
.pain-legend .swatch.visibility { background:linear-gradient(135deg,#7c3aed,#7c3aed); }
[data-theme="dark"] .pain-legend .legend-item { color:#94a3b8; }
@media (max-width:720px){
  .pain-venn { aspect-ratio:1 / 0.85; }
  .pain-venn .circle { width:54%; height:80%; top:8%; }
  .pain-venn .center-user { width:110px; height:110px; }
  .pain-venn-five .circle { width:60%; height:60%; }
}
@media (prefers-reduced-motion: no-preference){
  .pain-venn .circle { transition:opacity .5s ease, transform .5s ease; }
  .pain-venn:hover .circle { transform:scale(1.03); }
}

