/* /beta homepage (2026-09-26). Builds on pricing-v3.css (.pv tokens and components); only the
   homepage-specific blocks live here, all scoped under .pv.ph. */

/* hero: copy left, live sample right */
.pv.ph .ph-hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:48px;align-items:center;padding:64px 0 40px}
.pv.ph .ph-hero-copy{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.pv.ph .ph-hero .pv-h1{font-size:clamp(36px,5vw,58px);text-align:left}
.pv.ph .ph-hero .pv-lead{text-align:left}
.pv.ph .ph-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.pv.ph .ph-ctas .pv-btn{width:auto;padding:14px 22px;font-size:16px}
.pv.ph .ph-micro{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--mute)}
.pv.ph .ph-micro li{margin:0;padding:0}
.pv.ph .ph-micro li::before{content:"\2713";color:var(--green);font-weight:700;margin-right:6px}
.pv.ph .ph-live{box-shadow:0 30px 60px -30px rgba(13,61,42,.35)}

/* newsroom proof strip */
.pv.ph .ph-news{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0;margin-bottom:8px}
.pv.ph .ph-news-h{font:500 12px/1 "Geist Mono",ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);text-align:center;margin-bottom:16px}
.pv.ph .ph-news ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 28px}
.pv.ph .ph-news li{margin:0;padding:0;display:flex;flex-direction:column;align-items:center;gap:2px}
.pv.ph .ph-news li::before{content:none}
.pv.ph .ph-news b{font-size:17px;font-weight:700;letter-spacing:-.01em;color:var(--ink)}
.pv.ph .ph-news span{font-size:12px;color:var(--mute);font-variant-numeric:tabular-nums}

/* problem cards */
.pv.ph .ph-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:36px}
.pv.ph .ph-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:26px}
.pv.ph .ph-num{font:500 12px/1 "Geist Mono",ui-monospace,monospace;color:var(--green);letter-spacing:.1em}
.pv.ph .ph-card h3{font-size:19px;font-weight:700;margin:12px 0 8px}
.pv.ph .ph-card p{margin:0;color:var(--mute);font-size:15px}
.pv.ph .ph-bridge{text-align:center;font-size:18px;color:var(--body);margin:32px auto 0;max-width:720px;text-wrap:balance}
.pv.ph .ph-bridge strong{color:var(--ink)}

/* how it works */
.pv.ph .ph-steps{list-style:none;counter-reset:ph;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.pv.ph .ph-steps li{counter-increment:ph;margin:0;padding:0 0 0 56px;position:relative}
.pv.ph .ph-steps li::before{content:counter(ph);position:absolute;left:0;top:0;width:40px;height:40px;border-radius:50%;background:var(--green-soft);color:var(--green-d);font-weight:800;display:flex;align-items:center;justify-content:center}
.pv.ph .ph-steps b{font-size:19px;color:var(--ink)}
.pv.ph .ph-steps p{margin:6px 0 0;color:var(--mute);font-size:15px}

/* coverage check, centred */
.pv.ph .ph-cov{max-width:760px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.pv.ph .ph-center{margin:0 auto;text-align:center}
.pv.ph .ph-cov .pv-search{width:100%;max-width:560px}
.pv.ph .ph-cov .pv-res{width:100%;max-width:560px;text-align:center}
.pv.ph .ph-cov .pv-sub{text-align:center}
.pv.ph .ph-chips{justify-content:center}

/* offer stack */
.pv.ph .ph-offer{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:0;border-radius:20px;overflow:hidden;background:var(--dark);color:#e7f1ec}
.pv.ph .ph-offer-l{padding:44px}
.pv.ph .ph-offer-l h2{color:#fff;font-size:clamp(26px,3vw,36px);line-height:1.1;letter-spacing:-.03em;font-weight:800;margin:0 0 22px;text-wrap:balance}
.pv.ph .ph-offer-l .pv-eyebrow{color:#6ee7a8}
.pv.ph .ph-stack{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;font-size:16px;color:#cfe0d7}
.pv.ph .ph-stack li{display:block;position:relative;margin:0;padding:0 0 0 26px}
.pv.ph .ph-stack li::before{content:"\2713";color:#6ee7a8;font-weight:800;position:absolute;left:0;top:0}
.pv.ph .ph-stack b{color:#fff}
.pv.ph .ph-offer-r{background:var(--forest);padding:44px 36px;display:flex;flex-direction:column;gap:12px;justify-content:center}
.pv.ph .ph-was{display:flex;flex-direction:column;gap:2px;font-size:13px;color:#9fb8ab}
.pv.ph .ph-was s{font-size:22px;font-weight:700;color:#9fb8ab}
.pv.ph .ph-now{display:flex;flex-direction:column;gap:2px;margin-top:6px}
.pv.ph .ph-now span{font-size:13px;color:#6ee7a8;font-weight:600}
.pv.ph .ph-now b{font-size:56px;line-height:1;font-weight:800;letter-spacing:-.04em;color:#fff}
.pv.ph .ph-now small{font-size:18px;font-weight:500;color:#9fb8ab}
.pv.ph .ph-now-sub{font-size:14px;color:#cfe0d7;margin-bottom:6px}
.pv.ph .ph-team{margin:6px 0 0;font-size:13px;color:#9fb8ab;line-height:1.5}
.pv.ph .ph-team b{color:#fff}
.pv.ph .ph-team a{color:#6ee7a8}

@media (max-width:900px){
  .pv.ph .ph-hero{grid-template-columns:minmax(0,1fr);gap:32px;padding-top:40px}
  .pv.ph .ph-cards,.pv.ph .ph-steps{grid-template-columns:minmax(0,1fr)}
  .pv.ph .ph-offer{grid-template-columns:minmax(0,1fr)}
  .pv.ph .ph-offer-l,.pv.ph .ph-offer-r{padding:28px 22px}
}
@media (max-width:520px){
  .pv.ph .ph-ctas .pv-btn{width:100%}
  .pv.ph .ph-news ul{gap:10px 18px}
}
@media (max-width:520px){
  .pv.ph{padding:0 8px}
  .pv.ph .ph-live .pv-row:nth-of-type(n+6){display:none}
}

/* ---- Brand navy for large blocks (Ryan 2026-09-26): logo navy #0F172A as a gradient; green only for CTAs and highlights ---- */
.pv.ph .ph-offer{background:radial-gradient(120% 120% at 100% 0%,rgba(16,185,129,.16) 0%,rgba(16,185,129,0) 42%),linear-gradient(135deg,#0F172A 0%,#131d33 55%,#1E293B 100%);color:#e2e8f0}
.pv.ph .ph-offer-r{background:rgba(255,255,255,.04);border-left:1px solid rgba(255,255,255,.08)}
.pv.ph .ph-offer-l .pv-eyebrow,.pv.ph .ph-now span,.pv.ph .ph-team a{color:#34d399}
.pv.ph .ph-stack{color:#cbd5e1}
.pv.ph .ph-stack li::before{color:#34d399}
.pv.ph .ph-was,.pv.ph .ph-was s,.pv.ph .ph-now small,.pv.ph .ph-team{color:#94a3b8}
.pv.ph .ph-now-sub{color:#cbd5e1}

/* hero card footer: the social platforms we carry (2026-09-26) */
.pv.ph .ph-live-f{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:14px 18px;border-top:1px solid var(--line);background:linear-gradient(180deg,#fbfcfb,#f5f8f6)}
.pv.ph .ph-live-f span{font-size:12px;font-weight:600;color:var(--mute);margin-right:auto}
.pv.ph .ph-live-f a{width:34px;height:34px;border-radius:10px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;transition:transform .15s,box-shadow .15s}
.pv.ph .ph-live-f a:hover{transform:translateY(-2px);box-shadow:0 8px 18px -10px rgba(15,23,42,.35)}
.pv.ph .ph-live-f iconify-icon{font-size:17px}
/* coverage check: green CTA shown only after a check has returned (2026-09-26) */
.pv.ph .ph-cov-cta{width:100%;max-width:560px}
.pv.ph .ph-cov-cta .pv-btn{width:100%;padding:14px;font-size:16px}
/* outlet strip: names only, no per-outlet counts (2026-09-26) */
.pv.ph .ph-news ul{gap:14px 34px}
.pv.ph .ph-news b{font-size:18px;color:#334155}

/* ---- Rotating hero (2026-09-27): audience word + second line + live card swap together ---- */
.ph-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.ph-rot-w{display:inline-block;color:inherit;position:relative;white-space:nowrap}
.ph-rot-w::after{content:"";position:absolute;left:0;right:0;bottom:.04em;height:.12em;border-radius:3px;background:#12b76a;opacity:.55}
.ph-rot-l{display:block}
.ph-rot-w{display:inline-block}
.ph-rot-t{display:block;white-space:nowrap}
@media (max-width:640px){.ph-rot-t{white-space:normal}}
.ph-rot-w.in,.ph-rot-t.in{animation:phIn .42s cubic-bezier(.2,.8,.2,1) both}
.ph-rot-t.in{animation-delay:.06s}
.ph-rot-w.out,.ph-rot-t.out{animation:phOut .22s ease-in both}
@keyframes phIn{from{opacity:0;transform:translateY(.35em);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
@keyframes phOut{to{opacity:0;transform:translateY(-.3em);filter:blur(2px)}}
.ph-live-t{white-space:nowrap}
.ph-live-t b{font-weight:600}
.ph-pulse{display:inline-block;vertical-align:middle;margin:-2px 7px 0 0;width:7px;height:7px;border-radius:50%;background:#12b76a;box-shadow:0 0 0 0 rgba(18,183,106,.5);animation:phPulse 2s infinite;flex:none}
@keyframes phPulse{70%{box-shadow:0 0 0 7px rgba(18,183,106,0)}100%{box-shadow:0 0 0 0 rgba(18,183,106,0)}}
.ph-rows{min-height:348px}
.ph-row.in{animation:phRow .45s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d,0ms)}
.ph-row.out{animation:phRowOut .2s ease-in both;animation-delay:calc(var(--d,0ms) / 3)}
@keyframes phRowOut{to{opacity:.45;transform:translateY(-3px)}}
@keyframes phRow{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.ph-dots{display:flex;justify-content:center;gap:6px;padding:10px 0 2px}
.ph-dots button{width:7px;height:7px;border-radius:999px;border:0;padding:0;background:var(--line,#dfe6e2);cursor:pointer;transition:width .3s,background .3s}
.ph-dots button.on{width:20px;background:#12b76a}
.ph-live-f a{transition:transform .25s,opacity .25s}
.ph-live-f a.on{transform:scale(1.18)}
@media (prefers-reduced-motion: reduce){.ph-rot-w.in,.ph-rot-t.in,.ph-rot-w.out,.ph-rot-t.out,.ph-row.in,.ph-row.out,.ph-pulse{animation:none}}
@media (max-width:640px){.ph-rows{min-height:0}}

/* Rotator: the card height varies a little per audience; pin it to the top so it never drifts (2026-09-27). */
@media (min-width:900px){.ph-hero .ph-live{align-self:start;margin-top:8px}}

/* Rotator rows: brand icons for the profiles on file, next to the name (2026-09-27). */
.ph-soc{display:inline-flex;gap:5px;margin-left:7px;vertical-align:-2px}
.ph-soc iconify-icon{font-size:13px;opacity:.95}
.ph-row .n > div{margin-top:1px}
.ph-row .ph-sub{color:var(--mute,#64748b);font-size:12.5px}
@media (max-width:640px){.ph-rows .ph-row:nth-child(n+5){display:none}}

/* Hero lead: savings link scrolls to the offer comparison (2026-09-27). */
.ph-save{display:inline-flex;align-items:center;gap:4px;color:var(--green-d,#0b7a46);font-weight:600;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:4px;white-space:nowrap}
.ph-save:hover{text-decoration-style:solid}
.ph-save iconify-icon{font-size:.9em;transition:transform .2s}
.ph-save:hover iconify-icon{transform:translateY(2px)}
@media (max-width:640px){.ph-save{white-space:normal;display:inline}}
#offer{scroll-margin-top:90px}

/* Newsroom strip preview cards (2026-09-27). */
.ph-nr{position:relative}
.ph-nr-b{border:0;background:none;padding:4px 2px;font:inherit;font-weight:700;color:inherit;cursor:pointer;border-bottom:2px dotted transparent;transition:border-color .15s,color .15s}
.ph-nr-b:hover,.ph-nr.on .ph-nr-b,.ph-nr-b:focus-visible{border-bottom-color:#12b76a;outline:0}
.ph-nr-card{position:absolute;z-index:40;top:calc(100% + 10px);left:50%;transform:translateX(calc(-50% + var(--shift,0px)));width:340px;max-width:calc(100vw - 24px);
  background:var(--card,#fff);border:1px solid var(--line,#e2e8f0);border-radius:14px;box-shadow:0 24px 50px -18px rgba(15,23,42,.35);padding:6px 0 0;text-align:left;
  font-size:13px;letter-spacing:normal;text-transform:none;font-weight:400}
.ph-nr-card::before{content:"";position:absolute;top:-6px;left:calc(50% - var(--shift,0px) - 6px);width:12px;height:12px;background:inherit;border-left:1px solid var(--line,#e2e8f0);border-top:1px solid var(--line,#e2e8f0);transform:rotate(45deg)}
.ph-nr-card::after{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.ph-nr-h{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 16px 10px;border-bottom:1px solid var(--line,#eef1ef)}
.ph-nr-h b{font-size:15px;color:var(--ink,#0f172a)}
.ph-nr-h span:not(.ph-soc){display:block;font-size:12px;color:var(--mute,#64748b)}
.ph-nr-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 16px;border-bottom:1px solid var(--line,#f1f5f3)}
.ph-nr-row .n{min-width:0}
.ph-nr-row .n b{color:var(--ink,#0f172a);font-weight:600}
.ph-nr-row .n iconify-icon{font-size:12px;margin-left:5px;vertical-align:-1px}
.ph-nr-row .n span{display:block;color:var(--mute,#64748b);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}
.ph-nr-row .m{flex:none;font-size:11px;color:#94a3b8;letter-spacing:.05em;display:flex;align-items:center;gap:6px}
.ph-nr-row .m em{font-style:normal;font-size:10.5px;font-weight:600;color:#0c8f52;background:#e8f7ef;border-radius:999px;padding:2px 7px;letter-spacing:0}
.ph-nr-go{display:block;padding:11px 16px;font-weight:600;color:#0c8f52;text-decoration:none;border-radius:0 0 14px 14px}
.ph-nr-go:hover{background:#f2faf6}
@media (max-width:640px){.ph-nr-card{position:fixed;left:12px;right:12px;top:auto;bottom:16px;width:auto;transform:none}.ph-nr-card::before{display:none}}
html.dark .ph-nr-row .m em{background:#0e2a24;color:#6ee7b7}
html.dark .ph-nr-go{color:#34d399}
html.dark .ph-nr-go:hover{background:#0e2a24}
html.dark .ph-nr-card{box-shadow:0 24px 50px -18px rgba(0,0,0,.6)}
