/* PV8 public acquisition page
   The signed-in product keeps the original modernist design system. This
   stylesheet is scoped to .pv8-welcome and creates one continuous visitor
   journey without changing registration, login or screening behaviour. */

.pv8-welcome {
  --landing-max:1180px;
  background:#f3f6f4;
  color:#14231f;
  font-family:"IBM Plex Sans","Instrument Sans",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
}
.pv8-welcome * { scroll-margin-top:84px; }
.pv8-welcome .pv8-skip-link {
  background:#fff;
  border:2px solid #116b55;
  color:#102a24;
  left:14px;
  padding:10px 14px;
  position:fixed;
  top:12px;
  transform:translateY(-160%);
  z-index:10000;
}
.pv8-welcome .pv8-skip-link:focus { transform:translateY(0); }

/* A quiet header: registration is primary, authentication is available but
   no longer consumes the first screen with three form controls. */
.pv8-welcome > header {
  align-items:center;
  background:rgba(255,255,255,.94);
  border-bottom:1px solid #d7dfdb;
  box-shadow:none;
  display:flex;
  flex-wrap:nowrap;
  gap:22px;
  min-height:68px;
  padding:10px max(20px,calc((100vw - var(--landing-max))/2));
  position:sticky;
  top:0;
  z-index:1000;
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
}
.pv8-welcome .pv8-brand { flex:0 0 auto; }
.pv8-welcome .pv8-brand h1 {
  color:#102a24;
  font-family:"Instrument Sans","IBM Plex Sans",system-ui,sans-serif;
  font-size:23px;
  font-weight:700;
  letter-spacing:-.04em;
}
.pv8-welcome .pv8-brand h1 span { color:#116b55; }
.pv8-welcome .pv8-tagline { color:#6c7b76; }
.pv8-welcome .landing-nav {
  align-items:center;
  display:flex;
  gap:4px;
  margin-left:auto;
}
.pv8-welcome .landing-nav > a {
  border-radius:7px;
  color:#455751;
  font-size:13px;
  font-weight:550;
  padding:9px 11px;
  text-decoration:none;
}
.pv8-welcome .landing-nav > a:hover { background:#eaf4f0; color:#084f40; }
.pv8-welcome .landing-register {
  font-size:13px;
  min-height:40px;
  padding:9px 16px;
}
.pv8-welcome .landing-login { position:relative; }
.pv8-welcome .landing-login > summary {
  border-radius:7px;
  color:#27473e;
  cursor:pointer;
  font-size:13px;
  font-weight:650;
  list-style:none;
  padding:9px 11px;
}
.pv8-welcome .landing-login > summary::-webkit-details-marker { display:none; }
.pv8-welcome .landing-login > summary:hover,
.pv8-welcome .landing-login[open] > summary { background:#eaf4f0; }
.pv8-welcome .landing-login-popover {
  background:#fff;
  border:1px solid #d7dfdb;
  border-radius:10px;
  box-shadow:0 18px 44px rgba(15,42,35,.14);
  min-width:310px;
  padding:15px;
  position:absolute;
  right:0;
  top:calc(100% + 9px);
}
.pv8-welcome .landing-login-popover .header-login {
  display:grid;
  gap:9px;
  margin:0;
  width:100%;
}
.pv8-welcome .landing-login-popover .header-login input {
  border:1px solid #bcc9c4;
  min-height:42px;
  width:100%;
}
.pv8-welcome .landing-login-links {
  border-top:1px solid #e7ece9;
  display:flex;
  justify-content:space-between;
  margin-top:12px;
  padding-top:10px;
}
.pv8-welcome .landing-login-links a { color:#116b55; font-size:12px; }
.pv8-welcome .landing-login-links #hSso {
  border-left:1px solid #e7ece9;
  border-right:1px solid #e7ece9;
  margin:0 8px;
  padding:0 10px;
}

/* First screen: one narrative, one action, no left-card/right-card framing. */
.pv8-welcome .hero {
  background:
    radial-gradient(circle at 88% 4%,rgba(117,174,151,.16),transparent 28rem),
    linear-gradient(180deg,#fbfcfb 0%,#f3f6f4 100%);
  border-bottom:0;
  padding:clamp(44px,5.5vw,74px) max(20px,calc((100vw - var(--landing-max))/2)) clamp(24px,2vw,32px);
}
.pv8-welcome .hero-grid { display:block; }
.pv8-welcome .hero-copy {
  display:block;
  max-width:var(--landing-max);
}
.pv8-welcome .hero-opening {
  display:block;
}
.pv8-welcome .hero-opening-copy { max-width:1100px; min-width:0; }
.pv8-welcome .hero h1 {
  color:#102a24;
  font-family:"Instrument Sans","IBM Plex Sans",system-ui,sans-serif;
  font-size:clamp(46px,5.8vw,74px);
  font-weight:520;
  letter-spacing:-.055em;
  line-height:.98;
  margin:0 0 24px;
  max-width:1080px;
  text-wrap:balance;
}
.pv8-welcome .hero p.hero-lede {
  color:#455751;
  font-size:clamp(17px,2vw,21px);
  line-height:1.55;
  max-width:860px;
}
.pv8-welcome .hero-route-line {
  color:#315b4e;
  display:flex;
  flex-wrap:wrap;
  font-size:12px;
  font-weight:650;
  gap:8px 20px;
  margin-top:20px;
}
/* The hero now carries one explicit ".route-plus" element per block (static,
   not animated — only the word flips). The old span::before "+" added a ghost
   plus to EVERY span in the row (block, plus, word, even PV), rendering "+ + +".
   Removed 2026-09-04; the single separator lives in the markup/JS. */
.pv8-welcome .hero-cta-row { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.pv8-welcome .hero-cta-row .cta { min-width:178px; text-align:center; }
.pv8-welcome .landing-proofline {
  color:#60706a;
  display:flex;
  flex-wrap:wrap;
  font-size:12px;
  gap:8px 22px;
  margin-top:18px;
}
.pv8-welcome .landing-proofline span::before {
  color:#0b7355;
  content:"✓";
  font-weight:800;
  margin-right:7px;
}
.pv8-welcome .teaser-embed {
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  color:#14231f;
  margin-top:clamp(22px,3vw,34px);
  overflow:visible !important;
  padding:0 !important;
}
.pv8-welcome .teaser-embed::after { display:none !important; }
.pv8-welcome .teaser-embed h2 {
  color:#102a24 !important;
  font-family:"Instrument Sans","IBM Plex Sans",system-ui,sans-serif;
  font-size:clamp(26px,3vw,36px) !important;
  font-weight:540;
  letter-spacing:-.045em !important;
  line-height:1.05 !important;
  max-width:800px !important;
}
.pv8-welcome .teaser-embed > .muted-line {
  color:#53635e !important;
  font-size:15px !important;
  max-width:790px !important;
}
.pv8-welcome .teaser-embed > .muted-line strong { color:#173d33 !important; }
.pv8-welcome .teaser-form {
  background:#fff !important;
  border:1px solid #aebeb8 !important;
  border-radius:10px !important;
  box-shadow:0 14px 38px rgba(15,42,35,.09) !important;
  margin:25px 0 10px !important;
  max-width:900px;
  padding:7px !important;
}
.pv8-welcome .teaser-form:focus-within {
  border-color:#116b55 !important;
  box-shadow:0 0 0 4px rgba(17,107,85,.10),0 14px 38px rgba(15,42,35,.09) !important;
}
.pv8-welcome .teaser-example {
  background:#fff;
  border:1px solid #aebeb8;
  border-radius:7px;
  color:#116b55;
  cursor:pointer;
  font:650 12.5px "IBM Plex Sans",system-ui,sans-serif;
  min-height:40px;
  padding:9px 13px;
  text-decoration:none;
}
.pv8-welcome .teaser-example:hover { border-color:#116b55; }
.pv8-welcome .teaser-example:disabled { cursor:wait; opacity:.65; }
.pv8-welcome .teaser-demo {
  align-items:end;
  display:flex;
  gap:18px;
  justify-content:space-between;
  margin-top:15px;
  max-width:900px;
}
.pv8-welcome .teaser-demo>label { color:#27473e; display:grid; gap:2px; }
.pv8-welcome .teaser-demo>label b { font-size:13.5px; }
.pv8-welcome .teaser-demo>label span { color:#60706a; font-size:12px; line-height:1.4; }
.pv8-welcome .teaser-demo-controls { display:flex; flex:0 0 auto; gap:7px; }
.pv8-welcome .teaser-demo select {
  background:#fff;
  border:1px solid #aebeb8;
  border-radius:7px;
  color:#27473e;
  font:600 12.5px "IBM Plex Sans",system-ui,sans-serif;
  min-height:40px;
  padding:8px 34px 8px 11px;
}
.pv8-welcome #teaserResults {
  border-radius:12px !important;
  box-shadow:0 16px 42px rgba(15,42,35,.08) !important;
}

/* The visitor journey reads as one document. Structure comes from rhythm and
   dividers, not disconnected panels. */
.pv8-welcome .modules,
.pv8-welcome #accountPanel {
  border-bottom:0;
  padding:clamp(58px,8vw,102px) max(20px,calc((100vw - var(--landing-max))/2));
}
.pv8-welcome .modules h2 {
  font-family:"Instrument Sans","IBM Plex Sans",system-ui,sans-serif;
  font-size:clamp(32px,4.5vw,54px);
  font-weight:530;
  letter-spacing:-.045em;
  line-height:1.05;
  max-width:850px;
  text-wrap:balance;
}
.pv8-welcome .modules { background:#f3f6f4; }
.pv8-welcome #opportunities { padding-top:clamp(28px,2.5vw,36px); }
.pv8-welcome .modules:nth-of-type(even) { background:#fff; }
.pv8-welcome .modules > .muted-line,
.pv8-welcome .modules > p { color:#53635e; font-size:15px; line-height:1.65; margin:16px 0 28px !important; max-width:820px; }
.pv8-welcome .mod-grid {
  border-top:1px solid #cdd8d3;
  display:grid;
  gap:0;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.pv8-welcome .mod {
  background:transparent;
  border:0;
  border-bottom:1px solid #cdd8d3;
  border-radius:0;
  box-shadow:none;
  min-height:0;
  padding:24px 28px 24px 0;
}
.pv8-welcome .mod:nth-child(even) { border-left:1px solid #cdd8d3; padding-left:28px; }
.pv8-welcome .mod .mod-ico { height:22px; margin-bottom:12px; width:22px; }
.pv8-welcome .mod b { color:#173d33; font-size:15px; }
.pv8-welcome .mod p { color:#60706a; font-size:13px; line-height:1.55; }
.pv8-welcome .landing-inline-cta {
  align-items:center;
  border-bottom:1px solid #cdd8d3;
  display:flex;
  gap:20px;
  justify-content:space-between;
  padding:24px 0;
}
.pv8-welcome .landing-inline-cta p { color:#53635e; font-size:13px; max-width:700px; }

/* Pricing stays scannable as a conventional side-by-side comparison. */
.pv8-welcome #pricing { background:#eaf4f0; }
.pv8-welcome .price-grid {
  align-items:stretch;
  display:grid;
  gap:14px;
  grid-template-columns:repeat(5,minmax(0,1fr));
}
.pv8-welcome .price-card,
.pv8-welcome .price-card.featured {
  align-items:stretch;
  background:#fff;
  border:1px solid #b8cbc3;
  border-radius:10px;
  box-shadow:0 8px 24px rgba(16,42,36,.06);
  display:flex;
  gap:0;
  padding:22px 18px;
}
.pv8-welcome .price-card.featured { border:2px solid #116b55; box-shadow:0 10px 28px rgba(17,107,85,.12); }
.pv8-welcome .price-card > b { font-size:16px; min-height:58px; }
.pv8-welcome .price-card .price { margin:12px 0 10px; min-height:63px; }
.pv8-welcome .price-card .price span { font-size:25px; }
.pv8-welcome .price-card ul { flex:1; margin:0 0 18px; }
.pv8-welcome .price-card .cta { align-self:stretch; max-width:none; padding:11px 14px; }

/* Account creation is the natural final chapter of the page. */
.pv8-welcome #accountPanel { background:#fff; }
.pv8-welcome #accountPanel .panel-cols { gap:clamp(38px,6vw,82px); }
.pv8-welcome #accountPanel .panel-cols > div + div {
  border-left:1px solid #d7dfdb;
  padding-left:clamp(32px,5vw,70px);
}
.pv8-welcome #accountPanel h3 { color:#102a24; font-size:clamp(22px,3vw,34px); letter-spacing:-.03em; }
.pv8-welcome #accountPanel form input,
.pv8-welcome #accountPanel form select { border:1px solid #aebeb8; border-radius:7px; min-height:44px; }
.pv8-welcome footer { background:#102a24; color:#a9c0b8; padding:32px 20px; }
.pv8-welcome footer a { color:#d7ebe4; }

@media (max-width:1120px) {
  .pv8-welcome .price-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (max-width:980px) {
  .pv8-welcome .hero-opening-copy { max-width:860px; }
}

@media (max-width:900px) {
  .pv8-welcome .pv8-tagline,
  .pv8-welcome .landing-nav > a:not([href="#teaser"]) { display:none; }
  .pv8-welcome .conversion-steps { grid-template-columns:1fr; }
  .pv8-welcome .conversion-step {
    border-left:0;
    border-top:1px solid #cdd8d3;
    padding-left:0;
  }
  .pv8-welcome .conversion-step:first-child { border-top:0; }
  .pv8-welcome .conversion-step { border-top-color:rgba(255,255,255,.2); }
  .pv8-welcome .price-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:680px) {
  .pv8-welcome > header { gap:8px; min-height:62px; padding:9px 14px; }
  .pv8-welcome .pv8-brand h1 { font-size:21px; }
  .pv8-welcome .landing-nav > a { display:none; }
  .pv8-welcome .landing-register { font-size:12px; padding:8px 10px; }
  .pv8-welcome .landing-login-popover { position:fixed; left:14px; right:14px; top:70px; }
  .pv8-welcome .hero { padding-left:18px; padding-right:18px; padding-top:48px; }
  .pv8-welcome .hero-grid { display:block !important; }
  .pv8-welcome .hero-copy { display:block !important; }
  .pv8-welcome .hero h1 { font-size:clamp(42px,13vw,60px); }
  .pv8-welcome .hero-opening { gap:22px; }
  .pv8-welcome .hero-cta-row { clear:both; margin-top:24px; position:relative; }
  .pv8-welcome .teaser-form { grid-template-columns:1fr !important; }
  .pv8-welcome .teaser-demo { align-items:stretch; flex-direction:column; gap:9px; }
  .pv8-welcome .teaser-demo-controls { display:grid; grid-template-columns:1fr; }
  .pv8-welcome .teaser-demo select,
  .pv8-welcome .teaser-example { width:100%; }
  .pv8-welcome .conversion-action,
  .pv8-welcome .landing-inline-cta { align-items:flex-start; flex-direction:column; }
  .pv8-welcome .mod-grid { grid-template-columns:1fr; }
  .pv8-welcome .mod:nth-child(even) { border-left:0; padding-left:0; }
  .pv8-welcome .price-grid { grid-template-columns:1fr; }
  .pv8-welcome .price-card,
  .pv8-welcome .price-card.featured { padding:20px; }
  .pv8-welcome .price-card > b,
  .pv8-welcome .price-card .price { min-height:0; }
  .pv8-welcome #accountPanel .panel-cols > div + div { border-left:0; border-top:1px solid #d7dfdb; padding-left:0; padding-top:34px; }
}

@media (prefers-reduced-motion:reduce) {
  .pv8-welcome * { scroll-behavior:auto !important; }
}

/* ============ Module value-route bar (isometric plant + flowing cards) ===== */
/* Overlay model: the array sits over the left of the card stage so the cards
   flow out of — and dissolve back into — the PV module (no hard divider). */
.pv8-welcome .module-bar { margin:10px 0 6px; position:relative; }
.pv8-welcome .module-bar-stage { position:relative; }
.pv8-welcome .module-bar-visual {
  left:-24px; pointer-events:none; position:absolute; top:50%;
  transform:translateY(-50%); width:clamp(280px,40%,430px); z-index:3;
}
.pv8-welcome .module-bar-visual svg { display:block; height:auto; width:100%; }
.pv8-welcome .mbf-track { padding-left:14px; }
.pv8-welcome .mbf-head {
  align-items:center; display:flex; justify-content:flex-end; margin-bottom:12px;
}
.pv8-welcome .mbf-count { color:#53635e; font-size:13px; font-weight:600; }
.pv8-welcome .mbf-count b { color:#116b55; font-variant-numeric:tabular-nums; }
.pv8-welcome .mbf-ctrls { display:flex; gap:6px; }
.pv8-welcome .mbf-btn {
  align-items:center; background:#fff; border:1px solid #cfdad6; border-radius:8px;
  color:#116b55; cursor:pointer; display:inline-flex; font-size:15px; height:34px;
  justify-content:center; line-height:1; transition:background .15s,border-color .15s; width:34px;
}
.pv8-welcome .mbf-btn:hover { background:#eaf4f0; border-color:#116b55; }
.pv8-welcome .mbf-btn:focus-visible { outline:2px solid #116b55; outline-offset:2px; }
/* Clip only sideways; let cards keep their hover-lift + shadow top and bottom
   (overflow-x:clip does not force the y-axis to auto the way hidden does). */
.pv8-welcome .mbf-viewport { overflow-x:clip; overflow-y:visible; padding:10px 0; position:relative; }
.pv8-welcome .mbf-viewport::before,
.pv8-welcome .mbf-viewport::after {
  bottom:0; content:""; pointer-events:none; position:absolute; top:0; width:40px; z-index:2;
}
.pv8-welcome .mbf-viewport::before { background:linear-gradient(90deg,#f6f8f6 30%,rgba(246,248,246,0)); left:0; width:clamp(260px,38%,400px); }
.pv8-welcome .mbf-viewport::after  { background:linear-gradient(270deg,#f6f8f6,rgba(246,248,246,0)); right:0; }
/* even-index sibling on a white section still needs a matching fade */
.pv8-welcome .modules:nth-of-type(even) .mbf-viewport::before { background:linear-gradient(90deg,#fff 52%,rgba(255,255,255,0)); }
.pv8-welcome .modules:nth-of-type(even) .mbf-viewport::after  { background:linear-gradient(270deg,#fff,rgba(255,255,255,0)); }
.pv8-welcome .mbf-track { display:flex; gap:14px; will-change:transform; border-top:0; }
/* deep selectors so these beat the base .mod / .mod:nth-child(even) grid rules */
.pv8-welcome .module-bar-stage .mbf-track .mbf-card {
  background:#fff; border:1px solid #dde6e1; border-radius:12px; box-shadow:none;
  box-sizing:border-box; color:inherit; display:flex; flex:0 0 258px; flex-direction:column;
  gap:6px; min-height:0; padding:16px 16px 14px; text-decoration:none;
  transition:transform .25s ease, box-shadow .25s ease, border-color .2s ease;
}
.pv8-welcome .module-bar-stage .mbf-track .mbf-card:nth-child(even) {
  border-left:1px solid #dde6e1; padding-left:16px;      /* neutralise the grid divider rule */
}
.pv8-welcome .module-bar-stage .mbf-track .mbf-card:hover,
.pv8-welcome .module-bar-stage .mbf-track .mbf-card.mbf-focused {
  border-color:#116b55; transform:translateY(-3px); box-shadow:0 14px 30px rgba(12,39,32,.13);
}
.pv8-welcome .mbf-card .mod-ico { margin-bottom:4px; }
.pv8-welcome .mbf-card b { color:#173d33; font-size:14px; }
.pv8-welcome .mbf-card p { color:#60706a; flex:1; font-size:12.5px; line-height:1.5; margin:0; }
.pv8-welcome .mbf-card .mbf-sample {
  border-top:1px solid #dce6e1; color:#116b55; display:block; font-size:12px;
  font-weight:700; letter-spacing:.01em; margin-top:8px; padding-top:10px;
}
.pv8-welcome .mbf-card:hover .mbf-sample { text-decoration:underline; }
.pv8-welcome .mbf-hint { color:#7c8b86; font-size:11px; margin-top:10px; }

/* Downstairs: four catchy feature blocks. */
.pv8-welcome .feature-bar {
  border-top:1px solid #cdd8d3; display:grid; grid-template-columns:repeat(4,1fr); margin-top:26px;
}
.pv8-welcome .feature { border-right:1px solid #cdd8d3; padding:20px 22px 18px 0; }
.pv8-welcome .feature:last-child { border-right:0; }
.pv8-welcome .feature:not(:first-child) { padding-left:22px; }
.pv8-welcome .feature .f-ico {
  display:block; fill:none; height:22px; margin-bottom:10px; stroke:#116b55;
  stroke-linecap:round; stroke-linejoin:round; stroke-width:1.7; width:22px;
}
.pv8-welcome .feature b { color:#173d33; display:block; font-size:14px; margin-bottom:5px; }
.pv8-welcome .feature p { color:#60706a; font-size:12.5px; line-height:1.5; margin:0; }

@media (max-width:820px) {
  .pv8-welcome .module-bar-visual { width:42%; }
  .pv8-welcome .mbf-viewport::before { width:42%; }
  .pv8-welcome .feature-bar { grid-template-columns:1fr 1fr; }
  .pv8-welcome .feature:nth-child(2) { border-right:0; }
  .pv8-welcome .feature { padding-right:18px; }
}
@media (max-width:560px) {
  .pv8-welcome .module-bar-visual { display:none; }
  .pv8-welcome .mbf-viewport::before { width:40px; background:linear-gradient(90deg,#f3f6f4,rgba(243,246,244,0)); }
  .pv8-welcome .modules:nth-of-type(even) .mbf-viewport::before { background:linear-gradient(90deg,#fff,rgba(255,255,255,0)); }
  .pv8-welcome .mbf-track { padding-left:0; }
  .pv8-welcome .feature-bar { grid-template-columns:1fr; }
  .pv8-welcome .feature { border-right:0; padding:16px 0; border-bottom:1px solid #cdd8d3; }
  .pv8-welcome .feature:last-child { border-bottom:0; }
}
@media (prefers-reduced-motion:reduce) {
  .pv8-welcome .module-bar-stage .mbf-track .mbf-card { transition:none; }
}

/* ============ PV8 Watch — retention section on the landing ============= */
.pv8-welcome .watch-landing .watch-land-grid {
  display:grid; gap:20px; grid-template-columns:1fr 1fr; margin:6px 0 18px;
}
.pv8-welcome .watch-land-msg, .pv8-welcome .watch-land-loop {
  background:#fff; border:1px solid #dde6e1; border-radius:14px; padding:20px 22px;
}
.pv8-welcome .watch-eyebrow {
  color:#116b55; font-size:11px; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase;
}
.pv8-welcome .watch-big { color:#12241d; font-size:19px; line-height:1.4; margin:10px 0 12px; }
.pv8-welcome .watch-big b { color:#116b55; }
.pv8-welcome .watch-counts { list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.pv8-welcome .watch-counts li { color:#3a4a44; font-size:14px; }
.pv8-welcome .watch-counts b { color:#12241d; font-variant-numeric:tabular-nums; }
.pv8-welcome .watch-note { color:#7c8b86; display:block; font-size:11.5px; margin-top:12px; }
.pv8-welcome .watch-land-loop ol { margin:10px 0 0; padding-left:20px; }
.pv8-welcome .watch-land-loop li { color:#455751; font-size:14px; line-height:1.5; margin:7px 0; }
.pv8-welcome .watch-land-loop em { color:#12241d; font-style:normal; font-weight:650; }
.pv8-welcome .watch-families { display:flex; flex-wrap:wrap; gap:8px; margin:4px 0 16px; }
.pv8-welcome .watch-families span {
  background:#eef4f1; border:1px solid #d7e4dd; border-radius:999px; color:#2b5346;
  font-size:12px; font-weight:600; padding:5px 12px;
}
.pv8-welcome .watch-close {
  border-left:3px solid #116b55; color:#3a4a44; font-size:15px; line-height:1.55;
  max-width:820px; padding:4px 0 4px 16px;
}
@media (max-width:760px) { .pv8-welcome .watch-landing .watch-land-grid { grid-template-columns:1fr; } }