/* legacy page content on the home-v2 system. loads after skin-v2.css (generated colours) */

.sv {
  --bg: #08080c; --surface: #14141b; --surface-2: #1b1b24; --line: rgba(255, 255, 255, .09);
  --text: #f4f4f6; --muted: #b4b4c0; --lime: #c1f63a; --lime-soft: #daff7c; --on-lime: #121a00;
  --radius: 22px; --ease: cubic-bezier(.22, 1, .36, 1);
  color: var(--text); font-family: 'Polin', 'Heebo', sans-serif;
}
.sv main {
  color: var(--text); background-color: var(--bg);
  background-image: linear-gradient(rgba(255, 255, 255, .022) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .022) 1px, transparent 1px);
  background-size: 48px 48px;
}
.sv h1, .sv h2, .sv h3, .sv h4, .sv strong, .sv b { color: var(--text); }
.sv a:focus-visible, .sv button:focus-visible, .sv summary:focus-visible, .sv input:focus-visible, .sv select:focus-visible, .sv textarea:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }

/* hero: big centred statement, no stock person */
.sv .hero { position: relative; isolation: isolate; overflow: hidden; margin-top: -118px; padding: calc(118px + clamp(32px, 5vw, 72px)) 24px clamp(48px, 6vw, 88px); text-align: center; background: var(--bg); }
.sv .hero::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(760px 380px at 50% 100%, rgba(159, 227, 58, .16), transparent 70%);
}
.sv .hero::after {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px);
  background-size: 64px 64px; mask-image: radial-gradient(ellipse 70% 80% at 50% 40%, #000 25%, transparent 80%);
}
.sv .hero .stage, .sv .hero .spark, .sv .hero .orb { display: none !important; }
.sv .hero-copy { display: grid; justify-items: center; gap: 20px; max-width: 980px; margin: 0 auto; }
.sv .hero h1, .sv .hero.hero-slot h1, .sv .hero.hero-quiet h1 {
  margin: 0; max-width: 20ch; font-size: clamp(38px, 5.6vw, 80px); line-height: 1.02; font-weight: 800; letter-spacing: -.022em; text-wrap: balance; color: var(--text);
}
.sv .hero .lead { margin: 0; max-width: 62ch; font-size: clamp(17px, 1.4vw, 20px); line-height: 1.6; color: var(--muted); text-wrap: pretty; }
.sv .hero .pill { background: rgba(255, 255, 255, .04); border: 1px solid var(--line); color: var(--muted); }
.sv .hero-actions { margin-top: 6px; }
.sv .hero h1 { margin: 0 !important; }
.sv .hero.hero-quiet h1 { font-size: clamp(32px, 4.2vw, 60px); max-width: 24ch; }
.sv .hero.hero-quiet { padding-bottom: clamp(36px, 4vw, 56px); }

/* buttons */
.sv .hero .choose, .sv .btn, .sv button.btn, .sv a.cta, .sv button.cta, .sv .journey-actions a, .sv .product-contact a, .sv .checkout-submit, .sv .go {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; padding: 0 24px; border-radius: 999px;
  font: inherit; font-weight: 700; font-size: 16px; cursor: pointer; text-decoration: none;
  background: #c6ec5c; color: var(--on-lime) !important; border: 1px solid #c6ec5c; box-shadow: none;
  transition: background-color .2s, border-color .2s, transform .3s var(--ease);
}
.sv .hero .choose:hover, .sv .btn:hover, .sv a.cta:hover, .sv button.cta:hover, .sv .journey-actions a:hover, .sv .checkout-submit:hover { background: #d3f66f; border-color: #d3f66f; transform: translateY(-2px); }
.sv .hero .choose.ghost, .sv .btn.ghost, .sv .btn.light, .sv .journey-actions a.ghost, .sv .journey-actions a + a, .sv .product-contact a + a {
  background: rgba(255, 255, 255, .03); color: var(--text) !important; border-color: rgba(255, 255, 255, .22);
}
.sv .hero .choose.ghost:hover, .sv .btn.ghost:hover, .sv .journey-actions a + a:hover { background: rgba(193, 246, 58, .1); border-color: var(--lime-soft); }
.sv .btn:disabled, .sv button.cta:disabled, .sv .checkout-submit:disabled { opacity: .45; transform: none; cursor: default; }

/* sheet: no white card, just the page */
.sv .sheet { background: transparent; border-radius: 0; margin-top: 0 !important; padding: 8px 0 clamp(72px, 9vw, 120px) !important; color: var(--text); }
.sv .hero.hero-slot + .sheet { margin-top: 0; padding-top: 8px; }
.sv .wrap { max-width: 1240px; padding-inline: 24px; }
.sv .crumbs { font-size: 14px; color: var(--muted); margin-bottom: 28px; }
.sv .crumbs a { color: var(--muted); }
.sv .crumbs a:hover { color: var(--lime); }

/* type */
.sv .sheet h2, .sv .section-heading h2, .sv .journey-heading h2 { font-size: clamp(28px, 3.2vw, 46px); line-height: 1.1; font-weight: 800; letter-spacing: -.015em; }
.sv .sheet h3 { font-size: clamp(19px, 1.5vw, 22px); line-height: 1.3; font-weight: 700; }
.sv .sheet p, .sv .sheet li { color: var(--muted); }
.sv .sheet li strong, .sv .sheet p strong { color: var(--text); }
.sv .eyebrow, .sv .product-page .eyebrow { color: var(--lime-soft); font-weight: 700; letter-spacing: .01em; }
.sv .section-heading, .sv .journey-heading { margin-block: clamp(56px, 7vw, 96px) 28px; }
.sv .product-section:first-child .section-heading, .sv .journey-page > .journey-heading:first-child { margin-top: 24px; }
.sv .num, .sv .bidi { color: inherit; }

/* cards */
.sv .journey-card, .sv .card, .sv .feature-tile, .sv .benefit, .sv .use-case, .sv .step, .sv .gcard, .sv .acard, .sv .state,
.sv .compare, .sv .journey-feature, .sv .journey-aside, .sv .auth-card, .sv .checkout-section, .sv .pcard, .sv .tile {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); color: var(--text); box-shadow: none;
}
.sv a.journey-card, .sv .journey-links a, .sv .product-related a { transition: border-color .3s, transform .45s var(--ease); }
.sv a.journey-card:hover, .sv .journey-links a:hover, .sv .product-related a:hover { border-color: rgba(218, 255, 124, .5); transform: translateY(-4px); }
.sv .journey-links a span, .sv .journey-text-link, .sv .product-text-link { color: var(--lime); font-weight: 700; }
.sv .benefit-icon, .sv .journey-icon, .sv .step-number {
  background: rgba(193, 246, 58, .1); color: var(--lime); border: 1px solid rgba(193, 246, 58, .28); box-shadow: none;
}
.sv .step-number { font-weight: 800; }
.sv .feature-tile strong, .sv .spec-row strong { color: var(--text); }

.sv aside h2, .sv .journey-aside h2, .sv .sheet aside h2 { font-size: clamp(22px, 2vw, 30px); }

/* checklists */
.sv .journey-checklist li, .sv .points li { color: var(--text); border-color: var(--line); }
.sv .journey-checklist li::before, .sv .plan li::before { color: var(--lime); }

/* plans */
.sv .plan { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: none; }
.sv .plan.is-current, .sv .plan.summary { border-color: rgba(193, 246, 58, .55); background: linear-gradient(180deg, rgba(193, 246, 58, .1), rgba(193, 246, 58, .02) 60%), var(--surface); }
.sv .plan .sum, .sv .price { color: var(--text); font-weight: 800; }
.sv .plans-wrap, .sv .category-plans { background: transparent; color: var(--text); }
.sv .plan a.cta, .sv .plan button.cta { width: 100%; }

/* tables */
.sv .table-scroll { border: 1px solid var(--line); border-radius: var(--radius); overflow: auto; background: var(--surface); }
.sv .compare { padding: 0; overflow: hidden; }
.sv .compare .table-scroll { border: 0; border-radius: 0; }
.sv .table th, .sv .table td { padding: 16px 20px; color: var(--text); border-bottom: 1px solid var(--line); vertical-align: top; }
.sv .table tr:last-child td { border-bottom: 0; }
.sv .table th { color: var(--muted); font-size: 14px; font-weight: 700; }
.sv .table td:first-child { font-weight: 700; }
.sv .table td + td { color: var(--muted); }
.sv .table tr { transition: background-color .2s; }
.sv .table tbody tr:hover { background: rgba(255, 255, 255, .025); }

/* faq */
.sv .faq details, .sv .product-faq details, .sv .journey-faq details, .sv .sheet > .wrap details { border: 0; border-top: 1px solid var(--line); padding: 0; background: transparent; border-radius: 0; }
.sv .faq summary, .sv .product-faq summary, .sv .journey-faq summary, .sv .sheet details > summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; gap: 16px; padding: 22px 0; font-size: 19px; font-weight: 700; color: var(--text); transition: color .25s;
}
.sv details > summary::-webkit-details-marker { display: none; }
.sv .sheet details > summary::before { content: ''; flex: none; width: 10px; height: 10px; background: var(--lime); }
.sv .sheet details > summary::after { content: '+'; margin-inline-start: auto; color: rgba(255, 255, 255, .4); font-size: 24px; font-weight: 400; line-height: 1; transition: transform .35s var(--ease), color .25s; }
.sv .sheet details[open] > summary::after { transform: rotate(45deg); color: var(--lime); }
.sv .sheet details > summary:hover { color: var(--lime-soft); }
.sv .sheet details > p, .sv .sheet details > div { padding: 0 0 22px 26px; padding-inline: 26px 0; color: var(--muted); max-width: 70ch; }
.sv .faq h2 { margin-bottom: 18px; }

/* forms */
.sv input:not([type=checkbox]):not([type=radio]), .sv select, .sv textarea {
  font: inherit; color: var(--text); background: #0e0e14; border: 1px solid rgba(255, 255, 255, .14); border-radius: 14px;
}
.sv input::placeholder, .sv textarea::placeholder { color: rgba(180, 180, 192, .6); }
.sv input:focus, .sv select:focus, .sv textarea:focus { border-color: rgba(193, 246, 58, .55); outline: 0; box-shadow: 0 0 0 4px rgba(193, 246, 58, .08); }
.sv label { color: var(--text); }
.sv input[type=checkbox], .sv input[type=radio] { accent-color: var(--lime); }
.sv .cycles label, .sv .opts label { background: rgba(255, 255, 255, .03); border-color: rgba(255, 255, 255, .14); color: var(--text); transition: border-color .2s, background-color .2s; }
.sv .cycles label:has(input:checked), .sv .opts label:has(input:checked) { background: rgba(193, 246, 58, .12); border-color: rgba(193, 246, 58, .55); color: var(--lime-soft); }
.sv .summary { background: var(--surface); border: 1px solid rgba(193, 246, 58, .4); color: var(--text); }
.sv .field .err, .sv .err { color: #ff8a9b; }

/* product page nav */
.sv .product-nav { border-color: var(--line); }
.sv .product-nav a { background: rgba(255, 255, 255, .03); border-color: var(--line); color: var(--muted); }
.sv .product-nav a:hover { color: var(--lime-soft); border-color: rgba(193, 246, 58, .45); }

/* reading pages (kb, legal) */
.sv .reading-page, .sv .prose { max-width: 760px; margin-inline: auto; }
.sv .prose { font-size: 18px; line-height: 1.85; color: #dcdce2; }
.sv .prose p, .sv .prose li { color: #dcdce2; }
.sv .prose h2 { font-size: clamp(24px, 2.4vw, 32px); margin: 44px 0 14px; }
.sv .prose h3 { font-size: 21px; margin: 32px 0 10px; }
.sv .prose a, .sv .sheet p a, .sv .sheet li a:not(.cta):not(.btn) { color: var(--lime-soft); text-decoration: underline; text-decoration-color: rgba(218, 255, 124, .4); text-underline-offset: 3px; }
.sv .prose a:hover, .sv .sheet p a:hover { text-decoration-color: var(--lime-soft); }
.sv .prose img { border-radius: 16px; border: 1px solid var(--line); }
.sv .prose code { background: var(--surface-2); color: var(--lime-soft); border-radius: 6px; padding: 2px 6px; font-size: .9em; }
.sv .prose pre { background: #0e0e14; border: 1px solid var(--line); border-radius: 14px; padding: 16px; overflow: auto; direction: ltr; text-align: left; }
.sv .prose ol, .sv .prose ul { padding-inline-start: 1.3em; }
.sv .prose li::marker { color: var(--lime); }
.sv .warn, .sv .alert, .sv .journey-note, .sv .note.warn { background: rgba(255, 210, 122, .08); border: 1px solid rgba(255, 210, 122, .3); color: #ffe2a8; border-radius: 14px; }
.sv .alert-info, .sv .journey-note { background: rgba(193, 246, 58, .06); border-color: rgba(193, 246, 58, .28); color: #e8ffb8; }
.sv .knowledge-cards a, .sv .knowledge-toolbar input { background: var(--surface); border-color: var(--line); }

/* google reviews block */
.sv .gstars { color: var(--lime); }
.sv .gnm { color: var(--text); }
.sv .gsrc { color: var(--muted); }

/* domains */
.sv .domain-tld, .sv .domain-price { color: var(--text); }

@media (max-width: 760px) {
  .sv .hero { padding-inline: 16px; }
  .sv .wrap { padding-inline: 16px; }
  .sv .hero-actions { width: 100%; }
  .sv .hero-actions .choose { flex: 1 1 auto; }
  .sv .table th, .sv .table td { padding: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .sv *, .sv *::before, .sv *::after { transition: none !important; }
}