/* ============================================================
   AUTO-GENERATED — do not edit site.css directly.
   Sources: fonts.css + style.css + gv-redesign.css
   Rebuild: node scripts/build-site-css.mjs
   ============================================================ */
/* --- fonts.css --- */
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(../fonts/DMSans-italic-300-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(../fonts/DMSans-italic-300-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(../fonts/DMSans-normal-300-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(../fonts/DMSans-normal-300-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/DMSans-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/DMSans-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/DMSans-normal-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/DMSans-normal-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Instrument Serif';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/InstrumentSerif-italic-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Instrument Serif';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/InstrumentSerif-italic-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/InstrumentSerif-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/InstrumentSerif-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --- style.css --- */
/* ============================================================
   Greeta Voice - Landing (v2 redesign)
   After edits: node scripts/build-site-css.mjs  (pages load css/site.css)
   ============================================================ */

:root {
  --bg:    #08080c;
  --bg2:   #0f0f15;
  --bg3:   #16161f;
  --border:  rgba(255,255,255,0.07);
  --border2: rgba(255,255,255,0.14);
  --text:  #faf9ff;
  --muted: #b8b5c9;
  --dim:   #7a768f;
  --accent:  #c8a8ff;
  --accent2: #8b5cf6;
  --green:    #34d399;
  --green-bg: rgba(52,211,153,0.08);
  --red:      #f87171;
  --legal-text: #e8e5f1;
  --serif: 'Instrument Serif', Georgia, serif;
  --sans:  'DM Sans', system-ui, sans-serif;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --transition: 0.18s ease;
  --max: 1800px;
  --gutter: clamp(1rem, 2vw, 1.5rem);
}

/* The semantic hidden state must win over component display declarations. */
[hidden] { display: none !important; }

.chat-booking-card {
  margin: 1.5rem 0 2.5rem;
  padding: 1.5rem 1.75rem;
  border: 1px solid var(--border);
  background: var(--bg3);
  border-radius: 12px;
  max-width: 40rem;
}
.chat-booking-example {
  margin: 0 0 .4rem;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--accent);
}
.chat-booking-salon {
  font-family: var(--serif);
  font-size: 1.5rem;
  margin: 0 0 .5rem;
  color: var(--text);
}
.chat-booking-cta {
  font-size: 1.1rem;
  font-weight: 500;
  margin: 0 0 1rem;
  color: var(--text);
}
.chat-booking-phone {
  font-variant-numeric: tabular-nums;
  letter-spacing: .02em;
  color: var(--accent);
}
.chat-booking-disclosure {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--muted);
}
.salon-guidance {
  margin: 2rem 0 1.5rem;
  padding: 1.35rem 1.5rem;
  border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  background: var(--bg3);
  border-radius: 12px;
}
.salon-guidance h2 {
  margin-top: 0;
  font-size: 1.35rem;
}
.salon-guidance h3 {
  margin-top: 1.15rem;
}
.salon-guidance p:last-child,
.salon-guidance ul:last-child {
  margin-bottom: 0;
}
.salon-activate-note {
  margin: 1.25rem 0 1.5rem;
  padding: 1rem 1.15rem;
  border-radius: 10px;
  border: 1px solid rgba(200,168,255,.28);
  background: rgba(200,168,255,.08);
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--text);
}
body.light-mode .salon-activate-note {
  border-color: rgba(200,99,61,.28);
  background: rgba(200,99,61,.08);
}
.salon-activate-note strong.status-off {
  color: var(--accent);
  letter-spacing: .02em;
}
.salon-activate-steps {
  list-style: none;
  margin: 1rem 0 1.35rem;
  padding: 0;
  display: grid;
  gap: 0;
  border-top: 1px solid var(--border);
}
.salon-activate-steps > li {
  display: grid;
  grid-template-columns: 2.5rem 1fr;
  gap: .85rem;
  padding: 1rem 0;
  border-bottom: 1px solid var(--border);
}
.salon-activate-steps .sa-n {
  font-family: var(--serif);
  font-size: 1.35rem;
  color: var(--accent);
  line-height: 1.1;
}
.salon-activate-steps h4 {
  margin: 0 0 .3rem;
  font-size: .98rem;
  font-weight: 500;
}
.salon-activate-steps p {
  margin: 0;
  font-size: 14px;
  color: var(--muted);
  line-height: 1.55;
}
.salon-activate-steps a.salon-proof-email {
  color: var(--accent);
}
.affiliate-page .affiliate-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 1.5rem 0 2rem;
  align-items: center;
}
.affiliate-page .affiliate-partner-cross {
  margin: 0.5rem 0 1.5rem;
  font-size: 0.95rem;
}
.affiliate-page .affiliate-partner-cross a {
  color: var(--accent);
  text-underline-offset: 3px;
}
.partner-form .partner-consent-label {
  display: flex;
  gap: 0.6rem;
  align-items: flex-start;
  font-size: 0.9rem;
  color: var(--muted);
  line-height: 1.45;
  margin: 0.25rem 0 0.5rem;
}
.partner-form .partner-consent-label input {
  margin-top: 0.25rem;
}
.partner-form-state.is-success { color: var(--accent); }
.partner-form-state.is-error { color: #e86a6a; }
.affiliate-page .affiliate-cta-row .btn-primary-lg,
.affiliate-page .affiliate-cta-row .btn-ghost-lg {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  text-decoration: none;
}
/* Beat `.legal-content a { color: var(--accent) }` — same color as the CTA fill
   made "Join as Affiliate" invisible on the purple/terracotta button. */
.affiliate-page .legal-content .affiliate-cta-row a.btn-primary-lg {
  color: var(--cta-text, #08080c);
}
.affiliate-page .legal-content .affiliate-cta-row a.btn-ghost-lg {
  color: var(--muted);
}
.affiliate-page .legal-content .affiliate-cta-row a.btn-ghost-lg:hover {
  color: var(--text);
}
body.light-mode .affiliate-page .legal-content .affiliate-cta-row a.btn-primary-lg {
  color: var(--cta-text, #ffffff);
}
body.light-mode .affiliate-page .legal-content .affiliate-cta-row a.btn-ghost-lg {
  color: var(--heading);
}
body.light-mode .affiliate-page .legal-content .affiliate-cta-row a.btn-ghost-lg:hover {
  color: var(--accent);
}
.salon-activate-sample {
  margin: .65rem 0 0;
  padding: .85rem 1rem;
  border-radius: 8px;
  border: 1px dashed var(--border2);
  background: var(--bg);
  font: 13.5px/1.55 var(--sans);
  color: var(--text);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  user-select: all;
}
.salon-channels {
  margin: .55rem 0 0;
  padding: 0;
  list-style: none;
  font-size: 14px;
  line-height: 1.65;
  color: var(--muted);
}
.salon-channels li {
  display: list-item;
  list-style: disc;
  margin-left: 1.15rem;
  padding: 0;
  border: 0;
  background: none;
  grid-template-columns: unset;
  gap: unset;
}
.salon-channels li::before {
  content: none;
}
.salon-check-list {
  margin: .5rem 0 0;
  padding-left: 1.15rem;
  font-size: 14px;
  color: var(--muted);
  line-height: 1.55;
}
.salon-check-list li { margin-bottom: .35rem; }
.salon-check-list li:last-child { margin-bottom: 0; }
.salon-send-proof {
  margin: .9rem 0 0;
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--text);
}
.salon-send-proof a,
a.salon-proof-email {
  color: var(--accent);
  border-bottom: 1px solid transparent;
}
.salon-send-proof a:hover,
a.salon-proof-email:hover {
  border-bottom-color: var(--accent);
}
.salon-active-badge {
  display: inline-block;
  margin-top: .35rem;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--green);
  border: 1px solid rgba(52,211,153,.35);
  background: var(--green-bg);
  border-radius: 6px;
  padding: 4px 10px;
}

body.light-mode {
  --bg:        #FBF4EC;
  --bg-alt:    #FFFFFF;
  --bg2:       #FFFFFF;
  --bg3:       #F0D9CD;
  --border:    #E7DCCF;
  --border2:   #E7DCCF;
  --heading:   #3A2433;
  --text:      #3A2433;
  --muted:     #5E4A56;
  --dim:       #8A7380;
  --accent:    #C8633D;
  --accent2:   #A8522F;
  --plum:      #3A2433;
  --blush:     #F0D9CD;
  --gold:      #C9A24B;
  --green:     #C8633D;
  --green-bg:  rgba(200, 99, 61, 0.1);
  --legal-text:#4A3542;
  --serif:     Georgia, 'Times New Roman', Times, serif;
  --sans:      system-ui, Arial, Helvetica, sans-serif;
  --card-shadow: 0 24px 60px rgba(58, 36, 51, 0.1);
  --cta-text:  #FFFFFF;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  transition: background var(--transition), color var(--transition);
}
img { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }
button { cursor: pointer; font-family: inherit; }
h1 em, h2 em { font-style: italic; color: var(--accent); }

.eyebrow {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: .75rem;
}
.section-sub {
  font-size: 16px;
  color: var(--muted);
  font-weight: 300;
  max-width: 540px;
  line-height: 1.65;
}

@keyframes pulse { 0%,100% { opacity:1; } 50% { opacity:.45; } }
@keyframes fadeUp { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }

/* Buttons */
.btn-primary {
  font-size: 13px; font-weight: 600;
  color: var(--cta-text, #08080c); background: var(--accent);
  border: none; border-radius: var(--radius-sm);
  padding: 9px 18px; transition: transform var(--transition), filter var(--transition);
  display: inline-block; white-space: nowrap;
}
.btn-primary:hover { filter: brightness(1.08); transform: translateY(-1px); }

.btn-primary-lg {
  font-size: 15px; font-weight: 700;
  color: var(--cta-text, #08080c); background: var(--accent);
  border: none; border-radius: var(--radius-md);
  padding: 14px 28px; transition: transform var(--transition), filter var(--transition);
  display: inline-block;
  box-shadow: 0 0 0 1px rgba(200,168,255,.2), 0 12px 32px rgba(139,92,246,.22);
}
.btn-primary-lg:hover { filter: brightness(1.06); transform: translateY(-1px); }

.btn-ghost-lg {
  font-size: 15px; color: var(--muted);
  background: transparent; border: 1px solid var(--border2);
  border-radius: var(--radius-md); padding: 14px 22px;
  transition: border-color var(--transition), color var(--transition);
}
.btn-ghost-lg:hover { border-color: var(--accent); color: var(--text); }

.btn-theme {
  width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid var(--border); background: transparent;
  display: flex; align-items: center; justify-content: center;
}

.lang-toggle {
  display: flex; background: var(--bg3);
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 3px; gap: 2px;
}
.lang-btn {
  font-size: 12px; font-weight: 500; padding: 4px 10px;
  border: none; border-radius: 6px; background: transparent; color: var(--muted);
}
.lang-btn.active { background: var(--bg2); color: var(--text); border: 1px solid var(--border2); }

.badge-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--green); box-shadow: 0 0 8px var(--green);
  animation: pulse 2s ease infinite;
}

/* Announce */
.announce-bar {
  display: flex; align-items: center; justify-content: center;
  gap: 1rem; flex-wrap: wrap; padding: 10px 1.25rem;
  font-size: 13px; color: var(--muted);
  background: linear-gradient(90deg, rgba(139,92,246,.14), rgba(200,168,255,.05));
  border-bottom: 1px solid var(--border);
}
.announce-cta { color: var(--accent); font-weight: 600; }
.announce-cta:hover { text-decoration: underline; }

/* Nav */
.site-nav, nav {
  position: sticky; top: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 var(--gutter);
  min-height: 64px;
  height: auto;
  max-width: none;
  background: rgba(8,8,12,.88); backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
}
body.light-mode .site-nav, body.light-mode nav { background: rgba(255,255,255,.92); }

.logo { font-family: var(--serif); font-size: 22px; flex-shrink: 0; }
.logo em { font-style: normal; color: var(--accent); }

.nav-links { display: flex; align-items: center; gap: clamp(0.85rem, 1.4vw, 1.75rem); list-style: none; flex-wrap: nowrap; }
.nav-links a { font-size: 13.5px; color: var(--muted); transition: color var(--transition); white-space: nowrap; }
.nav-links a:hover { color: var(--text); }

.nav-dropdown { position: relative; }
.nav-dropdown-trigger {
  appearance: none; background: transparent; border: 0;
  font-size: 13.5px; color: var(--muted); padding: 18px 0;
}
.nav-dropdown:hover .nav-dropdown-trigger,
.nav-dropdown:focus-within .nav-dropdown-trigger { color: var(--text); }
.nav-dropdown-menu {
  position: absolute; top: calc(100% - 4px); left: 50%;
  min-width: 210px; padding: 8px; background: var(--bg2);
  border: 1px solid var(--border2); border-radius: var(--radius-md);
  box-shadow: 0 20px 40px rgba(0,0,0,.35);
  opacity: 0; pointer-events: none; visibility: hidden;
  transform: translate(-50%, 8px); transition: all var(--transition);
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu {
  opacity: 1; pointer-events: auto; visibility: visible; transform: translate(-50%, 0);
}
.nav-dropdown-menu a {
  display: block; padding: 9px 10px; border-radius: var(--radius-sm);
  font-size: 13px; color: var(--text);
}
.nav-dropdown-menu a:hover { background: var(--bg3); color: var(--accent); }

.nav-drawer {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  justify-content: space-between;
  gap: 1rem;
  min-width: 0;
  margin-left: clamp(0.75rem, 2.5vw, 2rem);
}
.nav-right { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }

.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: transparent;
  flex-shrink: 0;
}
.nav-toggle-bar {
  display: block;
  width: 18px;
  height: 2px;
  margin: 0 auto;
  background: var(--text);
  border-radius: 1px;
  transition: transform var(--transition), opacity var(--transition);
}
.site-nav.nav-open .nav-toggle-bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.site-nav.nav-open .nav-toggle-bar:nth-child(2) { opacity: 0; }
.site-nav.nav-open .nav-toggle-bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.nav-dropdown.dropdown-open .nav-dropdown-menu,
.footer-dropdown.dropdown-open .footer-dropdown-menu {
  opacity: 1; pointer-events: auto; visibility: visible;
}
.nav-dropdown.dropdown-open .nav-dropdown-menu { transform: translate(-50%, 0); }
.footer-dropdown.dropdown-open .footer-dropdown-menu { transform: translateY(0); }

.visually-hidden {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Hero */
.hero-v2 {
  --hero-fade: 8, 8, 12;            /* rgb of the hero background used for photo blending */
  --hero-tint: 139, 92, 246;        /* brand purple cast over the photo */
  position: relative;
  isolation: isolate;
  max-width: none;
  width: 100%;
  margin: 0;
  padding: 3.5rem var(--gutter) 3.5rem clamp(1.35rem, 3.2vw, 2.5rem);
  min-height: 600px;
  display: grid; grid-template-columns: minmax(380px, 1.7fr) minmax(0, 0.8fr);
  gap: 1rem; align-items: center;
}
.hero-v2::before {
  content: ''; position: absolute; top: 0; left: -10%;
  width: 70%; height: 100%;
  background: radial-gradient(ellipse at 35% 45%, rgba(139,92,246,.14), transparent 62%);
  pointer-events: none; z-index: -1;
}
.hero-copy {
  position: relative;
  z-index: 3;
  padding-left: clamp(0.35rem, 1.4vw, 1.15rem);
  padding-right: 1.75rem;
  margin-right: 0.5rem;
  max-width: min(64rem, 100%);
}
.hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--bg2); border: 1px solid var(--border2);
  border-radius: 99px; padding: 6px 14px;
  font-size: 12px; color: var(--muted); margin-bottom: 1.25rem;
}
.hero-v2 h1 {
  font-family: var(--serif);
  font-size: clamp(42px, 5.2vw, 60px);
  line-height: 1.06; letter-spacing: -1.25px; margin-bottom: 1.15rem;
  text-wrap: balance;
  max-width: none;
  padding-right: 0.75rem;
}
.hero-sub {
  font-size: 16.5px; color: var(--muted); font-weight: 300; line-height: 1.7;
  margin-bottom: 1.6rem; max-width: 42rem;
  text-wrap: pretty;
}
.hero-revenue-tag {
  font-family: var(--serif); font-size: clamp(18px, 2.2vw, 22px);
  line-height: 1.35; color: var(--text); margin-bottom: .85rem; max-width: 480px;
}
.hero-revenue-tag em, .hero-v2 h1 em { font-style: italic; color: var(--accent); }
.hero-highlights {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 1.25rem;
  padding: 0;
}
.hero-highlights li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 11px;
  border-radius: 999px;
  background: #e8f8f0;
  color: #0f6b45;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  border: 1px solid rgba(15, 107, 69, 0.12);
}
.hero-highlights li svg {
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  color: #0f6b45;
}
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: .8rem; }
.hero-actions .btn-primary-lg,
.hero-actions .btn-ghost-lg { min-height: 48px; display: inline-flex; align-items: center; }
.hero-voice-demo {
  background: transparent;
  color: var(--accent);
  border: 1px solid var(--accent);
  box-shadow: none;
  font: inherit;
  cursor: pointer;
}

.voice-demo-dialog {
  position: fixed;
  inset: 0;
  margin: auto;
  width: min(92vw, 540px);
  max-height: min(90vh, 720px);
  padding: 0;
  border: 1px solid rgba(167, 139, 250, .35);
  border-radius: 24px;
  color: var(--text);
  background: var(--bg);
  box-shadow: 0 28px 90px rgba(8, 5, 20, .46);
  overflow-y: auto;
}
.voice-demo-dialog::backdrop { background: rgba(8, 5, 20, .72); backdrop-filter: blur(6px); }
.voice-demo-card { position: relative; padding: clamp(24px, 5vw, 38px); text-align: center; }
.voice-demo-close {
  position: absolute; top: 13px; right: 15px; width: 40px; height: 40px; border: 0;
  border-radius: 999px; color: var(--dim); background: transparent; font-size: 29px; line-height: 1; cursor: pointer;
}
.voice-demo-close:hover { color: var(--text); background: rgba(127, 127, 127, .12); }
.voice-demo-kicker { color: var(--accent); font-size: 11px; font-weight: 700; letter-spacing: .18em; }
.voice-demo-card h2 { margin: 9px 0 8px; font-family: 'Instrument Serif', serif; font-size: clamp(34px, 7vw, 48px); font-weight: 400; }
.voice-demo-lead { margin: 0 auto 22px; max-width: 410px; color: var(--dim); line-height: 1.55; }
.voice-demo-languages { display: flex; justify-content: center; gap: 8px; margin: 0 0 24px; padding: 0; border: 0; }
.voice-demo-languages legend { width: 100%; margin-bottom: 9px; color: var(--dim); font-size: 12px; }
.voice-demo-languages input { position: absolute; opacity: 0; pointer-events: none; }
.voice-demo-languages span {
  display: block; min-width: 88px; padding: 10px 13px; border: 1px solid var(--border); border-radius: 999px;
  color: var(--dim); background: var(--card); font-size: 13px; font-weight: 600; cursor: pointer;
}
.voice-demo-languages input:focus-visible + span { outline: 3px solid rgba(167, 139, 250, .45); outline-offset: 2px; }
.voice-demo-languages input:checked + span { border-color: var(--accent); color: var(--accent); background: rgba(167, 139, 250, .12); }
.voice-demo-recording-option { max-width: 430px; margin: -10px auto 18px; text-align: left; }
.voice-demo-recording-option label { display: flex; align-items: center; justify-content: center; gap: 9px; color: var(--text); font-size: 13px; font-weight: 600; cursor: pointer; }
.voice-demo-recording-option input { width: 17px; height: 17px; accent-color: var(--accent); }
.voice-demo-recording-option p { margin: 8px 0 0; color: var(--dim); font-size: 10.5px; line-height: 1.45; text-align: center; }
.voice-demo-live { margin: 4px 0 18px; }
.voice-demo-pulse { display: flex; align-items: center; justify-content: center; gap: 6px; height: 48px; }
.voice-demo-pulse span { width: 5px; height: 16px; border-radius: 8px; background: var(--accent); animation: voice-wave .8s ease-in-out infinite alternate; }
.voice-demo-pulse span:nth-child(2), .voice-demo-pulse span:nth-child(4) { animation-delay: -.35s; }
.voice-demo-pulse span:nth-child(3) { animation-delay: -.6s; }
@keyframes voice-wave { to { height: 42px; opacity: .55; } }
.voice-demo-timer { margin: 5px 0; font-variant-numeric: tabular-nums; font-size: 30px; font-weight: 600; letter-spacing: .06em; }
.voice-demo-status { min-height: 22px; margin: 8px 0; color: var(--dim); font-size: 14px; }
.voice-demo-status.is-error { color: #e3546b; }
.voice-demo-status.is-warning { color: #d99318; font-weight: 600; }
.voice-demo-actions { display: flex; justify-content: center; }
.voice-demo-start { border: 0; cursor: pointer; }
.voice-demo-start:disabled { opacity: .55; cursor: wait; }
.voice-demo-end { min-height: 50px; padding: 0 27px; border: 0; border-radius: 999px; color: #fff; background: #d64055; font: inherit; font-weight: 600; cursor: pointer; }
.voice-demo-results { display: grid; gap: 14px; max-width: 440px; margin: 18px auto 0; text-align: left; }
.voice-demo-results h3 { margin: 0 0 8px; font-size: 13px; color: var(--text); }
.voice-demo-results audio { display: block; width: 100%; height: 38px; margin-bottom: 8px; }
.voice-demo-results pre { max-height: 170px; overflow: auto; margin: 0 0 8px; padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--card); color: var(--text); font: 12px/1.55 var(--sans); white-space: pre-wrap; overflow-wrap: anywhere; }
.voice-demo-download { display: inline-flex; color: var(--accent); font-size: 12px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.voice-demo-usage { min-height: 20px; margin: 14px 0 0; color: var(--accent); font-size: 13px; font-weight: 600; }
.voice-demo-privacy { margin: 14px 0 0; color: var(--dim); font-size: 11px; line-height: 1.5; }
.ai-sms-demo-dialog { width: min(94vw, 760px); max-height: min(92vh, 820px); }
.ai-sms-demo-card { max-width: 760px; text-align: left; }
.ai-sms-demo-card h2, .ai-sms-demo-card .voice-demo-kicker, .ai-sms-demo-card .voice-demo-lead { text-align: center; }
.ai-sms-demo-guide { margin: 0 auto; padding: 14px 16px; border: 1px solid var(--border); border-radius: 14px; background: rgba(167, 139, 250, .06); }
.ai-sms-demo-guide-title { margin: 0 0 8px; font-size: 13px; font-weight: 700; }
.ai-sms-demo-example { display: block; width: 100%; border: 0; border-radius: 10px; padding: 10px 12px; color: var(--text); background: rgba(53, 126, 83, .28); text-align: left; font: inherit; cursor: pointer; }
.ai-sms-demo-example:hover, .ai-sms-demo-example:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.ai-sms-demo-guide-copy { margin: 10px 0 0; color: var(--dim); font-size: 14px; line-height: 1.5; }
.ai-sms-demo-services { margin: 9px 0 0; color: var(--dim); font-size: 12px; line-height: 1.45; }
.ai-sms-demo-thread { display: grid; align-content: start; gap: 10px; min-height: 170px; max-height: 290px; overflow-y: auto; margin: 18px 0 14px; padding: 4px; }
.ai-sms-demo-remaining { margin: 0 0 10px; color: var(--dim); font-size: 13px; font-weight: 600; }
.ai-sms-demo-status-limit { color: #ff4d76; font-weight: 700; text-shadow: 0 0 6px rgba(255, 53, 104, .85), 0 0 18px rgba(255, 53, 104, .55); }
.ai-sms-demo-message { max-width: 84%; padding: 11px 13px; border: 1px solid var(--border); border-radius: 14px; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
.ai-sms-demo-message.user { justify-self: end; background: rgba(53, 126, 83, .28); }
.ai-sms-demo-message.agent { justify-self: start; background: var(--card); }
.ai-sms-demo-form { display: flex; gap: 9px; }
.ai-sms-demo-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.ai-sms-demo-form input { flex: 1; min-width: 0; border: 1px solid var(--border); border-radius: 12px; padding: 12px; color: var(--text); background: var(--card); font: inherit; }
.ai-sms-demo-form button { border: 0; cursor: pointer; }
@media (max-width: 520px) { .ai-sms-demo-form { flex-direction: column; } .ai-sms-demo-form button { min-height: 44px; } .ai-sms-demo-guide { padding: 12px; } }
body.voice-demo-open { overflow: hidden; }
@media (max-width: 520px) {
  .voice-demo-card { padding: 28px 18px 22px; }
  .voice-demo-languages { gap: 5px; }
  .voice-demo-languages span { min-width: 0; padding: 9px 11px; }
}
@media (prefers-reduced-motion: reduce) { .voice-demo-pulse span { animation: none; } }
.hero-voice-demo:hover {
  background: rgba(167, 139, 250, 0.12);
  filter: none;
}
.hero-voice-demo-note {
  margin: -.35rem 0 .55rem;
  color: var(--accent);
  font-weight: 500;
}
.cta-micro {
  font-size: 13px; color: var(--dim); margin: 0; max-width: 540px; line-height: 1.5;
}
.hero-proof { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 16px; }
.hero-proof li {
  font-size: 12.5px; color: var(--dim);
  padding-left: 14px; position: relative;
}
.hero-proof li::before {
  content: ''; position: absolute; left: 0; top: 7px;
  width: 5px; height: 5px; border-radius: 50%; background: var(--green);
}

/* Hero visual (full-bleed salon photo + floating booking UI)
   The photo leaves the grid column and bleeds to the right edge of the
   viewport. Its left edge and bottom dissolve into the hero background via
   a CSS mask, so there is no card, border or rectangular frame. */
.hero-visual {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 54%;
  right: min(0px, calc(50% - 50vw));
  z-index: 1;
  min-height: 0;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  overflow: visible;
  animation: fadeUp .6s ease both;
  pointer-events: none;
}
.hero-visual-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: 92% 36%;
  border-radius: 0;
  filter: saturate(0.96) contrast(1.02);
  /* Left fade into the dark background + soft top/bottom dissolve. */
  -webkit-mask-image:
    linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 18%, #000 42%, #000 100%),
    linear-gradient(180deg, transparent 0%, #000 14%, #000 80%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 18%, #000 42%, #000 100%),
    linear-gradient(180deg, transparent 0%, #000 14%, #000 80%, transparent 100%);
  mask-composite: intersect;
}
.hero-visual::after {
  /* Theme tint: keeps the dark identity over the photo, adds purple cast,
     and darkens the corners where floating UI sits. */
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(var(--hero-fade), .9) 0%, rgba(var(--hero-fade), .45) 22%, rgba(var(--hero-fade), 0) 48%),
    linear-gradient(180deg, rgba(var(--hero-fade), .35) 0%, rgba(var(--hero-fade), 0) 26%, rgba(var(--hero-fade), 0) 62%, rgba(var(--hero-fade), .75) 100%),
    linear-gradient(160deg, rgba(var(--hero-tint), .22) 0%, rgba(var(--hero-tint), 0) 55%);
}
.hero-call-stack,
.hero-booking-card { pointer-events: auto; }
/* Thread sits in the dark fade between hero copy and the stylist — Greeta
   on the left of that gap, client reply below (messenger incoming). */
.hero-call-stack {
  position: absolute;
  top: 8%;
  left: -28%;
  right: auto;
  width: min(268px, 44%);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 18px;
  z-index: 2;
}
.hero-call-bubble {
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  align-self: flex-start;
  width: min(248px, 96%);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  z-index: 2;
}
.hero-call-bubble-main {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 12px 14px;
  background: rgba(255,255,255,0.96);
  color: #1a1a1f;
  border-radius: 18px 18px 18px 6px;
  box-shadow: 0 10px 30px rgba(0,0,0,.18);
}
.hero-call-icon {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #e8f8f0;
  color: #0f6b45;
}
.hero-call-bubble-main p {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  font-weight: 500;
}
.hero-client-bubble {
  align-self: flex-end;
  width: fit-content;
  max-width: 88%;
  margin-top: 14px;
  margin-left: auto;
  margin-right: -42%;
  transform: translate(108px, 6px);
}
.hero-client-bubble-main {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  flex-direction: row-reverse;
  padding: 10px 12px;
  background: rgba(15, 107, 69, 0.96);
  color: #fff;
  border-radius: 18px 18px 6px 18px;
  box-shadow: 0 10px 30px rgba(0,0,0,.18);
}
.hero-client-icon {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.18);
  color: #fff;
}
.hero-client-bubble-main p {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  font-weight: 500;
  text-align: right;
}
.hero-booking-card {
  /* Aligns under Greeta's incoming bubble in the left fade zone. */
  position: absolute;
  left: -8%;
  right: auto;
  bottom: 14%;
  width: min(188px, calc(100% - 32px));
  padding: 10px;
  background: rgba(255,255,255,0.97);
  border-radius: 14px;
  box-shadow: 0 10px 26px rgba(0,0,0,.2);
  z-index: 2;
}
.hero-booking-check {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #0f6b45;
  color: #fff;
  margin-bottom: 6px;
}
.hero-booking-check svg {
  width: 12px;
  height: 12px;
}
.hero-booking-title {
  margin: 0 0 3px;
  font-size: 12.5px;
  font-weight: 700;
  color: #121218;
}
.hero-booking-detail {
  margin: 0 0 8px;
  font-size: 11px;
  line-height: 1.35;
  color: #5a5768;
}
.hero-booking-cta {
  display: block;
  text-align: center;
  padding: 6px 8px;
  border-radius: 8px;
  background: #0f6b45;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
}

/* Laptop / mid desktop (incl. 15" ~1280–1440): keep overlays on the photo
   so they never collide with the headline or CTAs. */
@media (max-width: 1500px) and (min-width: 961px) {
  .hero-v2 {
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.9fr);
    min-height: 0;
    padding: 2.75rem var(--gutter) 2.75rem clamp(1rem, 2.4vw, 2rem);
    gap: 0.75rem;
  }
  .hero-copy {
    max-width: min(38rem, 100%);
    padding-left: clamp(0.25rem, 1vw, 0.85rem);
    padding-right: 1rem;
    margin-right: 0;
  }
  .hero-v2 h1 {
    font-size: clamp(34px, 3.5vw, 48px);
    letter-spacing: -1px;
    margin-bottom: 0.9rem;
    padding-right: 0;
  }
  .hero-badge { margin-bottom: 0.9rem; }
  .hero-highlights { margin-bottom: 0.95rem; gap: 6px; }
  .hero-highlights li { font-size: 11.5px; padding: 5px 10px; }
  .hero-sub {
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 1.2rem;
    max-width: 34rem;
  }
  .hero-actions { gap: 8px; margin-bottom: 0.65rem; }
  .hero-actions .btn-primary-lg,
  .hero-actions .btn-ghost-lg {
    min-height: 42px;
    padding: 10px 16px;
    font-size: 13.5px;
  }
  .hero-visual { left: 56%; }
  .hero-visual-photo {
    object-position: 90% 36%;
    -webkit-mask-image:
      linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 20%, #000 46%, #000 100%),
      linear-gradient(180deg, transparent 0%, #000 14%, #000 80%, transparent 100%);
    mask-image:
      linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 20%, #000 46%, #000 100%),
      linear-gradient(180deg, transparent 0%, #000 14%, #000 80%, transparent 100%);
  }
  .hero-call-stack {
    top: 10%;
    left: 4%;
    right: auto;
    width: min(236px, 58%);
    gap: 14px;
  }
  .hero-call-bubble { width: min(220px, 96%); }
  .hero-client-bubble {
    max-width: 82%;
    margin-right: 0;
    margin-top: 10px;
    transform: translate(36px, 4px);
  }
  .hero-booking-card {
    left: 10%;
    right: auto;
    bottom: 11%;
    width: min(168px, 46%);
  }
}

/* Tighter band for common 13–15" laptop widths. */
@media (max-width: 1366px) and (min-width: 961px) {
  .hero-v2 {
    grid-template-columns: minmax(0, 1.2fr) minmax(240px, 0.88fr);
    padding-top: 2.25rem;
    padding-bottom: 2.25rem;
  }
  .hero-copy { max-width: min(40rem, 100%); }
  .hero-v2 h1 { font-size: clamp(32px, 3.3vw, 42px); }
  .hero-visual { left: 58%; }
  .hero-call-stack { left: 6%; width: min(220px, 56%); }
  .hero-client-bubble { transform: translate(28px, 4px); }
  .hero-booking-card { left: 12%; bottom: 10%; width: min(158px, 44%); }
  .hero-actions .btn-primary-lg,
  .hero-actions .btn-ghost-lg {
    padding: 9px 14px;
    font-size: 13px;
  }
}

/* Short laptop viewports (e.g. 1366×768): shrink vertical rhythm. */
@media (max-height: 860px) and (min-width: 961px) {
  .hero-v2 {
    min-height: 0;
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
  }
  .hero-badge { margin-bottom: 0.65rem; }
  .hero-v2 h1 { margin-bottom: 0.7rem; }
  .hero-highlights { margin-bottom: 0.75rem; }
  .hero-sub { margin-bottom: 0.95rem; }
  .hero-call-stack { top: 8%; gap: 10px; }
  .hero-booking-card { bottom: 8%; }
}

/* Mobile / small tablet: stack - copy first, then the photo flowing in
   from the bottom of the dark hero (still frameless). */
@media (max-width: 960px) {
  .hero-v2 { min-height: 0; padding-bottom: 0; row-gap: 1.5rem; }
  .hero-copy { padding-right: 0; padding-left: 0; }
  .hero-visual {
    position: relative;
    inset: auto;
    left: 0; right: 0;
    height: 460px;
    /* Match section gutters so the full-bleed photo doesn’t cause horizontal scroll */
    margin: 0 calc(-1 * var(--gutter));
    width: calc(100% + (2 * var(--gutter)));
  }
  .hero-visual-photo {
    object-position: 68% 30%;
    -webkit-mask-image:
      linear-gradient(180deg, transparent 0%, rgba(0,0,0,.6) 18%, #000 40%, #000 82%, transparent 100%);
    -webkit-mask-composite: source-over;
    mask-image:
      linear-gradient(180deg, transparent 0%, rgba(0,0,0,.6) 18%, #000 40%, #000 82%, transparent 100%);
    mask-composite: add;
  }
  .hero-visual::after {
    background:
      linear-gradient(180deg, rgba(var(--hero-fade), .85) 0%, rgba(var(--hero-fade), 0) 32%, rgba(var(--hero-fade), 0) 60%, rgba(var(--hero-fade), .8) 100%),
      linear-gradient(160deg, rgba(var(--hero-tint), .2) 0%, rgba(var(--hero-tint), 0) 55%);
  }
  .hero-visual-photo { object-position: 88% 28%; }
  .hero-call-stack { top: 7%; left: 1rem; right: auto; width: min(268px, 64%); }
  .hero-call-bubble { width: min(232px, 96%); }
  .hero-client-bubble { max-width: 78%; margin-right: -8%; margin-top: 12px; transform: translate(28px, 4px); }
  .hero-booking-card { left: 1.25rem; right: auto; bottom: 7%; width: min(178px, 46%); }
}
@media (max-width: 600px) {
  .hero-visual { height: 440px; }
  .hero-visual-photo { object-position: 90% 22%; }
  .hero-call-stack { top: 5%; left: .75rem; right: auto; width: min(248px, 72%); }
  .hero-call-bubble { width: min(210px, 96%); }
  .hero-client-bubble { max-width: 80%; margin-right: -4%; margin-top: 10px; transform: translate(20px, 4px); }
  .hero-call-bubble-main p,
  .hero-client-bubble-main p { font-size: 12.5px; }
  .hero-booking-card { width: min(168px, 52%); bottom: 6%; padding: 9px; }
}

/* Call card */
.call-card-v2 {
  background: var(--bg2); border: 1px solid var(--border2);
  border-radius: var(--radius-xl); overflow: hidden;
  box-shadow: 0 24px 60px rgba(0,0,0,.35);
  animation: fadeUp .5s ease both;
}
.call-card-header {
  display: flex; align-items: center; gap: 8px;
  padding: 14px 16px; border-bottom: 1px solid var(--border); background: var(--bg3);
}
.call-dots { display: flex; gap: 5px; }
.call-dots span { width: 10px; height: 10px; border-radius: 50%; }
.call-dots span:nth-child(1) { background: #ff5f57; }
.call-dots span:nth-child(2) { background: #febc2e; }
.call-dots span:nth-child(3) { background: #28c840; }
.call-live { margin-left: auto; display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--green); }
.call-body { padding: 16px; display: flex; flex-direction: column; gap: 10px; min-height: 260px; }
.msg { font-size: 13.5px; line-height: 1.55; padding: 10px 14px; border-radius: 14px; max-width: 90%; }
.msg.ai { background: var(--bg3); border: 1px solid var(--border); border-radius: 14px 14px 14px 4px; }
.msg.client {
  background: rgba(200,168,255,.1); border: 1px solid rgba(200,168,255,.18);
  color: var(--accent); border-radius: 14px 14px 4px 14px; align-self: flex-end;
}
.call-footer {
  padding: 12px 16px; border-top: 1px solid var(--border);
  display: flex; justify-content: flex-end; align-items: center;
}
.call-lang-pill {
  font-size: 11px; padding: 4px 10px; border-radius: 99px;
  background: rgba(200,168,255,.08); border: 1px solid rgba(200,168,255,.18); color: var(--accent);
}

/* Stats */
.stats-bar-v2 { border-block: 1px solid var(--border); background: var(--bg2); }
.stats-inner { max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); display: grid; grid-template-columns: repeat(4,1fr); }
.stat-item { padding: 1.5rem 1.25rem; text-align: center; border-right: 1px solid var(--border); }
.stat-item:last-child { border-right: none; }
.stat-num { font-family: var(--serif); font-size: 30px; letter-spacing: -1px; display: block; }
.stat-label { font-size: 12px; color: var(--dim); margin-top: 2px; }

/* Replace stack */
.replace-section {
  padding: 4.5rem 1.5rem;
  border-bottom: 1px solid var(--border);
}
.replace-inner { max-width: var(--max); margin: 0 auto; }
.replace-inner h2 {
  font-family: var(--serif); font-size: clamp(30px, 3.5vw, 40px);
  line-height: 1.12; letter-spacing: -.5px; margin-bottom: .75rem;
}
.replace-list {
  list-style: none; display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px;
  margin-top: 1.75rem;
}
.replace-list li {
  position: relative; padding: .9rem 1rem .9rem 2.5rem;
  border-radius: var(--radius-md);
  background: var(--bg2); border: 1px solid var(--border);
  font-size: 14px; color: var(--muted); text-decoration: line-through;
  text-decoration-color: rgba(248,113,113,.55);
}
.replace-list li::before {
  content: '\2715'; position: absolute; left: .85rem; top: .9rem;
  color: var(--red); font-size: 12px; font-weight: 700;
}
.replace-foot {
  margin-top: 1.25rem; font-size: 14px; color: var(--text); font-weight: 500;
}

/* Dashboard & App */
.apps-section {
  padding: 4.5rem var(--gutter);
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, transparent, rgba(99,102,241,.04));
}
.apps-inner { max-width: var(--max); margin: 0 auto; text-align: center; }
.apps-inner h2 {
  font-family: var(--serif); font-size: clamp(30px, 3.5vw, 40px);
  line-height: 1.12; letter-spacing: -.5px; margin-bottom: .75rem;
}
.apps-inner .section-sub { margin: 0 auto 2rem; max-width: 640px; }
.apps-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px;
  text-align: left;
}
.apps-card {
  padding: 1.5rem; border-radius: var(--radius-lg);
  background: var(--bg2); border: 1px solid var(--border);
  display: flex; flex-direction: column; gap: .65rem;
}
.apps-icon { font-size: 28px; line-height: 1; }
.apps-card h3 { font-size: 18px; margin: 0; }
.apps-card p { font-size: 14px; color: var(--muted); font-weight: 300; line-height: 1.65; margin: 0; }
.apps-card .btn-primary { margin-top: auto; align-self: flex-start; }
.apps-platforms {
  margin-top: auto; font-size: 13px; font-weight: 500; color: var(--green);
  padding: .55rem .85rem; border-radius: var(--radius-md);
  background: var(--green-bg); border: 1px solid rgba(52,211,153,.2);
  align-self: flex-start;
}

/* Problem */
.problem-section { padding: 5rem var(--gutter); }
.problem-inner { max-width: var(--max); margin: 0 auto; }
.problem-inner h2 {
  font-family: var(--serif); font-size: clamp(32px, 4vw, 44px);
  line-height: 1.1; letter-spacing: -.5px; margin-bottom: .75rem;
}
.problem-grid {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-top: 2rem;
}
.problem-card {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 1.35rem;
}
.problem-icon { font-size: 24px; display: block; margin-bottom: .75rem; }
.problem-card h3 { font-size: 15px; margin-bottom: .35rem; }
.problem-card p { font-size: 13.5px; color: var(--muted); font-weight: 300; line-height: 1.55; }
.problem-cta-wrap {
  margin-top: 2.75rem;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 4.05rem 5.25rem;
  position: relative;
  padding: 1.25rem 0;
}
.problem-demo-cta {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  z-index: 1;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: none;
  padding: 20px 48px;
  border: none;
  border-radius: 16px;
  cursor: pointer;
  animation:
    problemCtaBounce 2.6s ease-in-out infinite;
}
.problem-demo-cta::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    115deg,
    transparent 0%,
    transparent 35%,
    rgba(255, 255, 255, .7) 48%,
    rgba(255, 255, 255, .25) 54%,
    transparent 65%,
    transparent 100%
  );
  transform: translateX(-130%);
  animation: problemCtaShine 2.1s ease-in-out infinite;
  pointer-events: none;
}
.problem-demo-cta:hover {
  filter: brightness(1.1) saturate(1.08);
  transform: translateY(-3px) scale(1.05);
  animation-play-state: paused;
}
.problem-voice-demo {
  color: #021a12;
  background: linear-gradient(135deg, #5dffb0 0%, #14f195 40%, #00d68f 100%);
  box-shadow:
    0 0 0 2px rgba(20, 241, 149, .6),
    0 12px 36px rgba(0, 200, 120, .45),
    0 0 60px rgba(20, 241, 149, .4);
  animation:
    problemCtaGlowGreen 1.8s ease-in-out infinite,
    problemCtaBounce 2.6s ease-in-out infinite;
}
.problem-voice-demo:hover {
  box-shadow:
    0 0 0 2px rgba(20, 241, 149, .85),
    0 18px 44px rgba(0, 200, 120, .55),
    0 0 80px rgba(20, 241, 149, .55);
}
.problem-ai-sms-demo {
  color: #1a1a00;
  background: linear-gradient(135deg, #ffff66 0%, #f5ff00 40%, #e6ff00 100%);
  box-shadow:
    0 0 0 2px rgba(255, 255, 80, .75),
    0 12px 36px rgba(220, 255, 0, .45),
    0 0 64px rgba(245, 255, 0, .5);
  animation:
    problemCtaGlowYellow 1.8s ease-in-out infinite,
    problemCtaBounce 2.6s ease-in-out infinite;
  animation-delay: 0s, .35s;
}
.problem-ai-sms-demo:hover {
  box-shadow:
    0 0 0 2px rgba(255, 255, 120, .95),
    0 18px 44px rgba(220, 255, 0, .6),
    0 0 90px rgba(245, 255, 0, .7);
}
@keyframes problemCtaGlowGreen {
  0%, 100% {
    box-shadow:
      0 0 0 2px rgba(20, 241, 149, .45),
      0 12px 32px rgba(0, 200, 120, .4),
      0 0 48px rgba(20, 241, 149, .32);
  }
  50% {
    box-shadow:
      0 0 0 2px rgba(20, 241, 149, .85),
      0 16px 42px rgba(0, 200, 120, .58),
      0 0 78px rgba(20, 241, 149, .55);
  }
}
@keyframes problemCtaGlowYellow {
  0%, 100% {
    box-shadow:
      0 0 0 2px rgba(255, 255, 80, .55),
      0 12px 32px rgba(220, 255, 0, .4),
      0 0 48px rgba(245, 255, 0, .38);
  }
  50% {
    box-shadow:
      0 0 0 2px rgba(255, 255, 140, .95),
      0 16px 42px rgba(220, 255, 0, .65),
      0 0 82px rgba(245, 255, 0, .7);
  }
}
@keyframes problemCtaBounce {
  0%, 70%, 100% { transform: translateY(0) scale(1); }
  80% { transform: translateY(-5px) scale(1.035); }
  88% { transform: translateY(0) scale(1); }
  94% { transform: translateY(-2px) scale(1.015); }
}
@keyframes problemCtaShine {
  0%, 25% { transform: translateX(-130%); }
  55%, 100% { transform: translateX(130%); }
}
body.light-mode .problem-demo-cta.problem-voice-demo {
  color: #00331f !important;
  background: linear-gradient(135deg, #00ff9c 0%, #00e676 45%, #00c853 100%) !important;
  box-shadow:
    0 0 0 3px rgba(0, 200, 83, .55),
    0 16px 40px rgba(0, 180, 80, .42),
    0 0 72px rgba(0, 230, 118, .5) !important;
}
body.light-mode .problem-demo-cta.problem-ai-sms-demo {
  color: #222200 !important;
  background: linear-gradient(135deg, #ffff4d 0%, #f0ff00 42%, #d4ff00 100%) !important;
  box-shadow:
    0 0 0 3px rgba(212, 255, 0, .65),
    0 16px 40px rgba(200, 230, 0, .45),
    0 0 76px rgba(240, 255, 0, .55) !important;
}
@media (prefers-reduced-motion: reduce) {
  .problem-demo-cta,
  .problem-demo-cta::before,
  .problem-voice-demo,
  .problem-ai-sms-demo {
    animation: none;
  }
}

/* Features bento */
.features-section {
  padding: 5rem var(--gutter);
  background: linear-gradient(180deg, transparent, rgba(139,92,246,.04), transparent);
}
.features-inner { max-width: var(--max); margin: 0 auto; }
.section-head {
  display: grid; grid-template-columns: 1fr 1fr; gap: 2rem;
  align-items: end; margin-bottom: 2rem;
}
.section-head h2 {
  font-family: var(--serif); font-size: clamp(30px, 3.5vw, 42px);
  line-height: 1.12; letter-spacing: -.5px;
}
.bento-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;
}
.bento-grid-9 .bento-card { min-height: 148px; }
.bento-card {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 1.25rem;
  transition: border-color var(--transition), transform var(--transition);
}
.bento-card:hover { border-color: var(--border2); transform: translateY(-2px); }
.bento-wide { grid-column: span 2; }
.bento-accent {
  background: linear-gradient(145deg, var(--bg2), rgba(139,92,246,.08));
  border-color: rgba(200,168,255,.2);
}
.bento-icon { font-size: 22px; display: block; margin-bottom: .65rem; }
.bento-card h3 { font-size: 15px; margin-bottom: .35rem; }
.bento-card p { font-size: 13.5px; color: var(--muted); font-weight: 300; line-height: 1.55; }

/* Industry verticals */
.verticals-block { margin-top: 2.5rem; padding-top: 2rem; border-top: 1px solid var(--border); }
.verticals-head { margin-bottom: 1.25rem; }
.verticals-head h3 {
  font-family: var(--serif); font-size: clamp(22px, 2.5vw, 28px);
  letter-spacing: -.3px; margin-bottom: .35rem;
}
.verticals-notify {
  font-size: 14px; color: var(--muted); font-weight: 300; margin-top: .5rem;
}
.verticals-notify a {
  color: var(--accent); font-weight: 600; text-decoration: underline;
  text-underline-offset: 3px;
}
.vertical-grid {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px;
}
.vertical-grid-photos {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}
.vertical-grid-soon {
  grid-template-columns: repeat(2, minmax(0, 220px));
  gap: 12px;
  margin-top: 12px;
  justify-content: start;
}
.vertical-card {
  position: relative; border-radius: var(--radius-lg); overflow: hidden;
  border: 1px solid var(--border); background: var(--bg2);
  min-height: 148px; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: .75rem;
  padding: 1.25rem .75rem 1rem;
  transition: transform var(--transition), box-shadow var(--transition);
}
.vertical-card.vertical-photo {
  align-items: stretch;
  justify-content: flex-start;
  gap: 0;
  padding: 0;
  min-height: 0;
  background: var(--bg2);
}
.vertical-photo-wrap {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--bg3);
}
.vertical-photo-wrap img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s ease;
}
.vertical-card.vertical-live:hover .vertical-photo-wrap img {
  transform: scale(1.04);
}
.vertical-copy {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  padding: .9rem .95rem 1.05rem;
}
.vertical-sub {
  font-size: 12.5px;
  color: var(--muted);
  font-weight: 300;
  line-height: 1.4;
}
.vertical-card.vertical-live:hover {
  transform: translateY(-4px);
  box-shadow: var(--card-shadow, 0 16px 40px rgba(0,0,0,.2));
}
.vertical-card.vertical-soon { opacity: .78; }
.vertical-icon-wrap {
  width: 72px; height: 72px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--bg3); border: 1px solid var(--border2);
  color: var(--text);
}
.vertical-soon .vertical-icon-wrap { color: var(--muted); }
.vertical-icon { width: 44px; height: 44px; }
.vertical-name {
  position: relative; z-index: 1;
  font-size: 14px; font-weight: 600; text-align: left; line-height: 1.3;
}
.vertical-soon .vertical-name { text-align: center; font-size: 12.5px; }
.coming-soon-badge {
  position: absolute; top: 10px; right: 10px; z-index: 2;
  font-size: 10px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
  padding: 4px 8px; border-radius: 99px;
  background: rgba(255,255,255,.92); color: var(--plum, var(--text));
  border: 1px solid var(--border);
}
body:not(.light-mode) .coming-soon-badge {
  background: rgba(22,22,31,.9); color: var(--accent); border-color: var(--border2);
}

.beauty-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 1.5rem; }
.beauty-chip {
  font-size: 12.5px; padding: 7px 14px; border-radius: 99px;
  background: var(--bg3); border: 1px solid var(--border2); color: var(--muted);
}

/* How */
.how-section-v2 { padding: 5rem var(--gutter); border-top: 1px solid var(--border); }
.how-inner { max-width: var(--max); margin: 0 auto; }
.how-inner h2 {
  font-family: var(--serif); font-size: clamp(30px, 3.5vw, 40px);
  letter-spacing: -.5px; margin-bottom: .5rem;
}
.ecosystem-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 2rem 0 2.75rem;
}
.ecosystem-card {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: .35rem;
  min-width: 0;
}
.ecosystem-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--accent);
}
.ecosystem-card h3 {
  font-size: 15px;
  margin: 0;
  line-height: 1.3;
}
.ecosystem-card p {
  font-size: 13px;
  color: var(--muted);
  font-weight: 300;
  line-height: 1.5;
  margin: 0 0 .5rem;
  flex: 1;
}
.ecosystem-link {
  font-size: 13px;
  font-weight: 600;
  color: var(--accent);
  text-decoration: none;
}
.ecosystem-link:hover { text-decoration: underline; }
.how-start-title {
  font-family: var(--serif);
  font-size: clamp(22px, 2.5vw, 28px);
  margin: 0 0 .35rem;
  letter-spacing: -.3px;
}
.how-start-sub { margin: 0 0 0; max-width: 40rem; }
.steps-row {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-top: 1.25rem;
}
.step-card {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 1.35rem;
}
.step-num {
  width: 28px; height: 28px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 600; color: var(--accent);
  background: rgba(200,168,255,.1); border: 1px solid rgba(200,168,255,.2);
  margin-bottom: .85rem;
}
.step-card h3 { font-size: 15px; margin-bottom: .35rem; }
.step-card p { font-size: 13.5px; color: var(--muted); font-weight: 300; line-height: 1.55; }
.mid-cta {
  margin-top: 2.5rem; padding: 1.75rem;
  border-radius: var(--radius-lg);
  background: var(--bg2); border: 1px solid var(--border2);
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: 1rem;
}
.mid-cta p { font-size: 15px; color: var(--muted); max-width: 420px; font-weight: 300; }
.mid-cta .cta-micro { margin: .5rem 0 0; }

/* Final CTA */
.final-cta-section {
  padding: 4.5rem 1.5rem;
  border-top: 1px solid var(--border);
  background: linear-gradient(180deg, transparent, rgba(139,92,246,.06));
}
.final-cta-inner {
  max-width: 640px; margin: 0 auto; text-align: center;
}
.final-cta-inner h2 {
  font-family: var(--serif); font-size: clamp(28px, 3.5vw, 38px);
  letter-spacing: -.5px; margin-bottom: .75rem;
}
.final-cta-inner .section-sub { margin: 0 auto 1.5rem; text-align: center; }
.final-cta-inner .cta-micro { margin-top: .85rem; }

/* Dashboard preview */
.dashboard-preview-section {
  padding: 5rem var(--gutter) 2.5rem;
  border-top: 1px solid var(--border);
  background: linear-gradient(180deg, transparent, rgba(139,92,246,.03));
}
.dashboard-preview-section + .apps-section {
  padding-top: 0;
  border-top: none;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(139,92,246,.03), rgba(99,102,241,.04));
}
.dashboard-preview-inner {
  max-width: var(--max); margin: 0 auto;
  display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr);
  gap: 2.5rem; align-items: center;
}
.dashboard-preview-copy h2 {
  font-family: var(--serif); font-size: clamp(28px, 3.2vw, 38px);
  line-height: 1.12; letter-spacing: -.4px; margin-bottom: .65rem;
}
.dashboard-preview-points {
  list-style: none; margin-top: 1.25rem; display: flex; flex-direction: column; gap: .55rem;
}
.dashboard-preview-points li {
  font-size: 14px; color: var(--muted); font-weight: 300;
  padding-left: 1.35rem; position: relative;
}
.dashboard-preview-points li::before {
  content: ''; position: absolute; left: 0; top: .3em;
  width: 14px; height: 14px; border-radius: 50%;
  background: #e8f8f0;
  box-shadow: inset 0 0 0 1px rgba(15, 107, 69, 0.18);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f6b45' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  background-size: 9px 9px;
  background-repeat: no-repeat;
  background-position: center;
}
.browser-frame {
  border-radius: var(--radius-xl);
  border: 1px solid var(--border2);
  overflow: hidden;
  box-shadow: 0 32px 80px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.04);
}
.browser-chrome {
  display: flex; align-items: center;
  padding: 10px 14px; background: #2a2438; border-bottom: 1px solid rgba(255,255,255,.08);
}
.browser-dots { display: flex; gap: 6px; }
.browser-dots span {
  width: 10px; height: 10px; border-radius: 50%;
  background: rgba(255,255,255,.15);
}
.browser-dots span:nth-child(1) { background: #ff5f57; }
.browser-dots span:nth-child(2) { background: #febc2e; }
.browser-dots span:nth-child(3) { background: #28c840; }
.dashboard-mock {
  display: grid; grid-template-columns: 162px 1fr;
  min-height: 460px; background: #120f18; color: #eceaf3;
  font-size: 11px;
}
.dm-sidebar {
  border-right: 1px solid rgba(255,255,255,.07);
  padding: 10px 8px; background: #0e0c14;
  display: flex; flex-direction: column; gap: 8px; min-height: 100%;
}
.dm-brand strong { display: block; font-size: 11px; line-height: 1.3; }
.dm-brand span { font-size: 9px; color: rgba(255,255,255,.45); line-height: 1.35; }
.dm-clock {
  font-size: 9px; color: rgba(255,255,255,.5);
  padding: 6px 8px; border-radius: 8px; background: rgba(255,255,255,.04);
}
.dm-nav { display: flex; flex-direction: column; gap: 2px; flex: 1; min-height: 0; }
.dm-nav-item {
  font-size: 9px; padding: 5px 7px; border-radius: 7px; color: rgba(255,255,255,.55);
  line-height: 1.25; white-space: nowrap;
}
.dm-nav-item.active {
  background: rgba(139,92,246,.22); color: #d8c4ff; border: 1px solid rgba(167,139,250,.25);
}
.dm-nav-signout {
  margin-top: auto; font-size: 9px; padding: 6px 7px; border-radius: 7px;
  color: rgba(255,255,255,.4); border-top: 1px solid rgba(255,255,255,.06);
  padding-top: 10px;
}
.dm-main { padding: 14px 16px 16px; overflow: hidden; }
.dm-title { font-size: 18px; font-weight: 600; margin-bottom: 2px; }
.dm-subtitle { font-size: 10px; color: rgba(255,255,255,.45); }
.dm-banner {
  margin: 10px 0 12px; padding: 7px 10px; border-radius: 8px;
  background: rgba(251,191,36,.12); border: 1px solid rgba(251,191,36,.28);
  color: #fcd34d; font-size: 10px; line-height: 1.4;
}
.dm-kpis {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px;
}
.dm-kpi {
  padding: 8px 10px; border-radius: 10px;
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07);
}
.dm-kpi-accent { border-color: rgba(167,139,250,.25); background: rgba(139,92,246,.1); }
.dm-kpi-label { display: block; font-size: 8.5px; color: rgba(255,255,255,.45); margin-bottom: 4px; }
.dm-kpi strong { font-size: 16px; font-weight: 600; color: #fff; }
.dm-panels { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.dm-panel {
  border-radius: 10px; background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07); padding: 10px; min-height: 160px;
}
.dm-panel-head {
  font-size: 10px; font-weight: 600; margin-bottom: 8px; color: rgba(255,255,255,.75);
}
.dm-call-row { padding: 8px 0; border-top: 1px solid rgba(255,255,255,.06); }
.dm-call-row:first-of-type { border-top: none; padding-top: 0; }
.dm-call-meta { display: flex; gap: 8px; margin-bottom: 4px; color: rgba(255,255,255,.45); font-size: 9px; }
.dm-tag {
  display: inline-block; font-size: 8px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .04em; padding: 2px 6px; border-radius: 99px; margin-bottom: 4px;
}
.dm-tag-muted { background: rgba(255,255,255,.08); color: rgba(255,255,255,.55); }
.dm-tag-booked { background: rgba(52,211,153,.15); color: #6ee7b7; }
.dm-summary { font-size: 9.5px; line-height: 1.45; color: rgba(255,255,255,.65); }
.dm-staff-tabs { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 8px; }
.dm-staff-tabs span {
  font-size: 8px; padding: 3px 7px; border-radius: 99px;
  background: rgba(255,255,255,.06); color: rgba(255,255,255,.5);
}
.dm-staff-tabs span.active { background: rgba(139,92,246,.25); color: #ddd6fe; }
.dm-appt-row {
  display: grid; grid-template-columns: 72px 1fr auto; gap: 6px; align-items: start;
  padding: 7px 0; border-top: 1px solid rgba(255,255,255,.06); font-size: 9.5px;
}
.dm-appt-row:first-of-type { border-top: none; }
.dm-appt-time { color: rgba(255,255,255,.45); }
.dm-appt-staff { color: #c4b5fd; margin-left: 4px; }
.dm-appt-price { color: rgba(255,255,255,.7); font-weight: 600; }
.dashboard-preview-caption {
  text-align: center; font-size: 11px; color: var(--dim);
  padding: 10px 12px; background: var(--bg2); border-top: 1px solid var(--border);
}

/* Integrations */
.integrations-v2 {
  padding: 4rem var(--gutter); background: var(--bg2);
  border-block: 1px solid var(--border);
}
.integrations-inner { max-width: var(--max); margin: 0 auto; }
.integrations-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: clamp(1.25rem, 3vw, 2.5rem);
}
.integrations-copy {
  flex: 0 1 260px;
  min-width: min(100%, 200px);
  max-width: 260px;
}
.integrations-copy .eyebrow { margin-bottom: .55rem; }
.integrations-inner h2,
.integrations-copy h2 {
  font-family: var(--serif); font-size: clamp(26px, 3vw, 34px);
  margin-bottom: .65rem; line-height: 1.15; letter-spacing: -.4px;
}
.integration-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.integration-grid-4 { grid-template-columns: repeat(2, 1fr); margin-top: 1.25rem; }
.integration-grid-wrap {
  flex: 1 1 0;
  min-width: min(100%, 280px);
  width: auto;
  container-type: inline-size;
}
.integration-grid-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 0;
  width: 100%;
}
.integration-sub { margin-bottom: 0; max-width: 420px; }
.integrations-copy .integration-sub { color: var(--muted); font-weight: 300; }
.integration-footnote {
  margin-top: 1.25rem; font-size: 13px; color: var(--dim); font-weight: 300;
}
.integration-card {
  background: var(--bg3); border: 1px solid var(--border);
  border-radius: var(--radius-md); padding: 1.15rem;
  position: relative;
  min-width: 0;
}
.integration-card-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: .8rem .75rem;
  min-height: 72px;
  overflow: hidden;
}
.integration-logo {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid rgba(255,255,255,.18);
  color: var(--text);
  overflow: hidden;
}
.integration-logo svg,
.integration-logo img {
  width: 26px;
  height: 26px;
  display: block;
  flex: 0 0 auto;
  object-fit: contain;
}
.integration-logo-square svg { width: 24px; height: 24px; }
.integration-logo-google {
  background: #fff;
  padding: 0;
}
.integration-logo-google img {
  width: 32px;
  height: 32px;
}
.integration-logo-greeta svg { width: 24px; height: 24px; }
.integration-text { min-width: 0; flex: 1 1 auto; }
.integration-card-soon { opacity: .85; }
.integration-brand {
  display: inline-block; font-size: 10px; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase;
  padding: 3px 8px; border-radius: 6px; margin-bottom: 8px;
  background: var(--bg2); border: 1px solid var(--border);
  color: var(--dim);
}
.integration-brand-square { color: #006aff; border-color: rgba(0,106,255,.25); background: rgba(0,106,255,.06); }
.integration-brand-google { color: #4285f4; border-color: rgba(66,133,244,.25); background: rgba(66,133,244,.06); }
.integration-brand-greeta { color: var(--accent); border-color: rgba(200,168,255,.25); }
.integration-brand-more { font-size: 14px; padding: 2px 10px; }
.integration-title {
  font-size: 13.5px; font-weight: 600; margin-bottom: 2px; line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.integration-card-row .integration-sub {
  font-size: 12px;
  color: var(--muted);
  font-weight: 300;
  line-height: 1.35;
  max-width: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.integration-card-featured {
  border-color: var(--accent);
  background: linear-gradient(135deg, var(--bg3) 0%, rgba(200, 99, 61, 0.08) 100%);
}
body.light-mode .integration-card-featured {
  border-color: #C8633D;
  background: linear-gradient(135deg, #FFFBF7 0%, rgba(200, 99, 61, 0.06) 100%);
}
body.light-mode .integration-logo {
  border-color: var(--border);
}
@container (max-width: 880px) {
  .integration-grid-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container (max-width: 380px) {
  .integration-grid-row { grid-template-columns: 1fr; }
}
@media (max-width: 1100px) {
  .integrations-copy { max-width: none; flex: 1 1 100%; }
  .integration-grid-wrap { flex: 1 1 100%; }
  .integration-grid-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .integration-grid-row { grid-template-columns: 1fr; }
  .integration-card-row { min-height: 64px; padding: .75rem .85rem; }
}

/* Reviews */
.reviews-v2 { padding: 5rem var(--gutter); }
.reviews-inner { max-width: var(--max); margin: 0 auto; }
.reviews-inner h2 {
  font-family: var(--serif); font-size: clamp(30px, 3.5vw, 40px);
  line-height: 1.12; margin-bottom: 2rem;
}
.testimonials-v2 { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.tcard {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 1.35rem;
  display: flex; flex-direction: column;
}
.trating span { color: #facc15; font-size: 13px; }
.tquote {
  font-family: Georgia, serif; font-style: italic;
  font-size: 14px; line-height: 1.65; margin: .75rem 0 1rem; flex: 1;
}
.tauthor { display: flex; align-items: center; gap: 10px; }
.tavatar {
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(200,168,255,.1); border: 1px solid rgba(200,168,255,.2);
  color: var(--accent); font-size: 11px; font-weight: 600;
  display: flex; align-items: center; justify-content: center;
}
.tname { font-size: 13px; font-weight: 500; }
.tbiz { font-size: 11.5px; color: var(--dim); }

/* FAQ */
.faq-section { padding: 5rem var(--gutter); border-top: 1px solid var(--border); }
.faq-inner { max-width: 1025px; margin: 0 auto; }
.faq-inner h2 {
  font-family: var(--serif); font-size: clamp(28px, 3vw, 36px);
  margin-bottom: 1.5rem;
}
.faq-list { display: flex; flex-direction: column; gap: 8px; }
.faq-item {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: var(--radius-md); padding: 0 1rem;
}
.faq-item summary {
  cursor: pointer; padding: 1rem 0; font-size: 15px; font-weight: 500;
  list-style: none; display: flex; justify-content: space-between; align-items: center;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: '+'; color: var(--accent); font-size: 18px; }
.faq-item[open] summary::after { content: '\2212'; color: var(--accent); font-size: 18px; }
.faq-item p {
  padding-bottom: 1rem; font-size: 14px; color: var(--muted);
  font-weight: 300; line-height: 1.6;
}

/* Newsletter */
.newsletter-section {
  padding: 4rem 1.5rem; text-align: center;
  background: var(--bg2); border-top: 1px solid var(--border);
}
.newsletter-inner h2 {
  font-family: var(--serif); font-size: clamp(24px, 3vw, 32px); margin-bottom: .35rem;
}
.newsletter-inner > p { color: var(--muted); font-weight: 300; margin-bottom: 1.25rem; }
.newsletter-form {
  display: flex; gap: 8px; max-width: 420px; margin: 0 auto; justify-content: center;
}
.field-input, .phone-input {
  flex: 1; font-size: 15px; background: var(--bg3);
  border: 1px solid var(--border2); border-radius: var(--radius-md);
  padding: 12px 14px; color: var(--text); outline: none;
}
.field-input:focus, .phone-input:focus { border-color: rgba(200,168,255,.45); }
.btn-call {
  font-size: 14px; font-weight: 700; color: var(--cta-text, #08080c);
  background: var(--accent); border: none;
  border-radius: var(--radius-md); padding: 12px 20px; white-space: nowrap;
}
.newsletter-note { font-size: 12px; color: var(--dim); margin-top: .75rem; }
.newsletter-note a { color: var(--accent); }
.newsletter-state { margin-top: .75rem; font-size: 14px; }

.contact-section {
  scroll-margin-top: 5.5rem;
  padding: 4rem var(--gutter) 5rem;
  border-top: 1px solid var(--border);
}
.contact-inner {
  max-width: 560px;
  margin: 0 auto;
}
.contact-inner h2 {
  font-family: var(--serif);
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  font-weight: 400;
  margin: .5rem 0 1rem;
}
.contact-inner > p { color: var(--muted); font-weight: 300; margin-bottom: 1.25rem; }
.contact-form {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
.field-label {
  font-size: 13px;
  color: var(--muted);
  font-weight: 500;
}
.field-textarea {
  min-height: 120px;
  resize: vertical;
  line-height: 1.5;
}
.contact-state { margin-top: .75rem; font-size: 14px; }
.contact-state.is-error,
.newsletter-state.is-error,
.form-state.is-error { color: var(--red); }
.contact-state.is-success,
.newsletter-state.is-success,
.form-state.is-success { color: var(--green); }
#contact-email-display { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }

/* Lang message stacks (was inline display/flexDirection in main.js) */
.msg-lang-stack {
  display: flex;
  flex-direction: column;
}
.msg-lang-stack[hidden] { display: none !important; }

/* Footer */
.site-footer, footer {
  max-width: var(--max); margin: 0 auto;
  padding: 2rem var(--gutter) 2.5rem;
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: 1rem;
  border-top: 1px solid var(--border);
}
.footer-links { display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem; }
.footer-link,
.footer-dropdown-trigger {
  display: inline-flex;
  align-items: center;
  appearance: none;
  background: transparent;
  border: 0;
  padding: 0;
  margin: 0;
  font: inherit;
  font-size: 13.5px;
  line-height: 1.35;
  color: var(--muted);
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
}
.footer-link:hover,
.footer-dropdown-trigger:hover,
.footer-dropdown:focus-within .footer-dropdown-trigger { color: var(--text); }
.footer-dropdown { position: relative; }
.footer-dropdown-menu {
  position: absolute; bottom: calc(100% + 8px); left: 0;
  min-width: 240px; padding: 8px; background: var(--bg2);
  border: 1px solid var(--border2); border-radius: var(--radius-md);
  box-shadow: 0 16px 40px rgba(0,0,0,.35);
  opacity: 0; pointer-events: none; visibility: hidden;
  transform: translateY(6px); transition: all var(--transition); z-index: 50;
}
.footer-dropdown:hover .footer-dropdown-menu,
.footer-dropdown:focus-within .footer-dropdown-menu {
  opacity: 1; pointer-events: auto; visibility: visible; transform: translateY(0);
}
.footer-dropdown-menu a {
  display: block; padding: 9px 10px; border-radius: var(--radius-sm);
  font-size: 13px; color: var(--text);
}
.footer-dropdown-menu a:hover { background: var(--bg3); color: var(--accent); }
.footer-doc-version {
  display: block; padding: 0 10px 6px; font-size: 11px; color: var(--dim);
  border-top: 1px solid var(--border); margin-top: 4px; padding-top: 8px;
}
.footer-copy { font-size: 13px; color: var(--dim); }

/* Legal pages (unchanged essentials) */
.legal-page { max-width: 1220px; margin: 0 auto; padding: 5rem 2.5rem; }
.legal-page.is-min-viewport { min-height: 65vh; }
.legal-page h1 {
  font-family: var(--serif); font-size: clamp(38px,5vw,58px);
  line-height: 1.05; letter-spacing: -1px; margin-bottom: .75rem;
}
.legal-content .legal-doc-title {
  font-family: var(--serif); font-size: clamp(38px,5vw,58px);
  line-height: 1.05; letter-spacing: -1px; margin-bottom: .75rem;
  font-weight: inherit; color: var(--text);
}
body.light-mode .legal-content .legal-doc-title { color: var(--heading); }
.legal-meta { font-size: 14px; color: var(--muted); margin-bottom: 2.5rem; }
.legal-content { color: var(--legal-text); font-weight: 300; }
.legal-content h2 {
  font-family: var(--serif); font-size: 28px; color: var(--text);
  margin: 2.25rem 0 .75rem;
}
.legal-content p { margin-bottom: 1rem; }
.legal-content ul { margin: .25rem 0 1.25rem 1.2rem; }
.legal-content h3 {
  font-size: 1.05rem; font-weight: 500; margin: 1.25rem 0 .5rem; color: var(--text);
}
.legal-content hr { border: none; border-top: 1px solid var(--border); margin: 2rem 0; }
.legal-table-wrap { overflow-x: auto; margin: 1rem 0 1.5rem; }
.legal-table {
  width: 100%; border-collapse: collapse; font-size: 14px;
}
.legal-table th, .legal-table td {
  border: 1px solid var(--border); padding: .55rem .65rem; text-align: left; vertical-align: top;
}
.legal-table th { background: var(--bg3); font-weight: 500; }
.legal-content a { color: var(--accent); }
.legal-sms-note {
  max-width: 1220px; margin: 1rem auto 0; padding: 0 2.5rem;
  font-size: 12px; color: var(--dim); line-height: 1.5;
}

/* ============================================================
   Light mode
   ============================================================ */
body.light-mode {
  font-family: var(--sans);
}

body.light-mode h1,
body.light-mode h2,
body.light-mode h3,
body.light-mode .hero-v2 h1,
body.light-mode .problem-inner h2,
body.light-mode .section-head h2,
body.light-mode .how-inner h2,
body.light-mode .replace-inner h2,
body.light-mode .apps-inner h2,
body.light-mode .final-cta-inner h2,
body.light-mode .integrations-inner h2,
body.light-mode .reviews-inner h2,
body.light-mode .faq-inner h2,
body.light-mode .newsletter-inner h2,
body.light-mode .legal-page h1,
body.light-mode .legal-content h2 {
  color: var(--heading);
  font-family: var(--serif);
}

body.light-mode h1 em,
body.light-mode h2 em {
  color: var(--accent);
  font-style: italic;
}

body.light-mode .logo em {
  color: var(--accent);
}

/* CTA pills */
body.light-mode .btn-primary,
body.light-mode .btn-primary-lg,
body.light-mode .btn-call {
  border-radius: 999px;
  color: var(--cta-text);
  background: var(--accent);
  box-shadow: 0 8px 24px rgba(200, 99, 61, 0.22);
}

body.light-mode .btn-primary-lg:hover,
body.light-mode .btn-primary:hover,
body.light-mode .btn-call:hover {
  filter: brightness(1.05);
  background: var(--accent2);
}

body.light-mode .btn-ghost-lg {
  border-radius: 999px;
  border-color: var(--border);
  color: var(--heading);
}

body.light-mode .btn-ghost-lg:hover {
  border-color: var(--accent);
  color: var(--accent);
}

/* Nav & announce */
body.light-mode .site-nav,
body.light-mode nav {
  background: rgba(251, 244, 236, 0.92);
  border-bottom-color: var(--border);
}

body.light-mode .announce-bar {
  background: linear-gradient(90deg, rgba(240, 217, 205, 0.9), rgba(251, 244, 236, 0.95));
  border-bottom-color: var(--border);
}

body.light-mode .announce-cta,
body.light-mode .nav-dropdown-menu a:hover,
body.light-mode .newsletter-note a,
body.light-mode .footer-links a:hover {
  color: var(--accent);
}

body.light-mode .nav-dropdown-menu {
  background: var(--bg-alt);
  box-shadow: var(--card-shadow);
}

body.light-mode .lang-toggle {
  background: var(--blush);
  border-color: var(--border);
}

body.light-mode .lang-btn.active {
  background: var(--bg-alt);
  color: var(--heading);
  border-color: var(--border);
}

/* Hero */
body.light-mode .hero-v2 {
  --hero-fade: 251, 244, 236;
  --hero-tint: 200, 99, 61;
}
body.light-mode .hero-v2::before {
  background: radial-gradient(ellipse at 35% 45%, rgba(240, 217, 205, 0.55), transparent 62%);
}

body.light-mode .hero-badge {
  background: var(--blush);
  border-color: var(--border);
  color: var(--muted);
}

body.light-mode .hero-sub,
body.light-mode .hero-revenue-tag,
body.light-mode .section-sub,
body.light-mode .problem-card p,
body.light-mode .bento-card p,
body.light-mode .step-card p,
body.light-mode .integration-sub,
body.light-mode .faq-item p,
body.light-mode .mid-cta p {
  color: var(--muted);
}

body.light-mode .hero-proof li {
  color: var(--dim);
}
body.light-mode .vertical-card { border-color: var(--border); background: var(--bg-alt); box-shadow: var(--card-shadow); }
body.light-mode .vertical-icon-wrap { background: var(--blush); border-color: var(--border); color: var(--plum); }
body.light-mode .dashboard-preview-section {
  background: linear-gradient(180deg, var(--bg), var(--blush));
}
body.light-mode .browser-frame {
  box-shadow: var(--card-shadow), 0 0 0 1px var(--border);
}
body.light-mode .dashboard-preview-caption { background: var(--bg-alt); }

body.light-mode .badge-dot {
  background: var(--accent);
  box-shadow: 0 0 8px rgba(200, 99, 61, 0.45);
}

/* Phone / call card */
body.light-mode .call-card-v2 {
  background: var(--bg-alt);
  border-color: var(--border);
  box-shadow: var(--card-shadow);
}

body.light-mode .call-card-header {
  background: var(--blush);
  border-bottom-color: var(--border);
}

body.light-mode .call-body {
  background: var(--bg-alt);
}

body.light-mode .msg.ai {
  background: var(--plum);
  border-color: var(--plum);
  color: #FFFFFF;
}

body.light-mode .msg.client {
  background: var(--blush);
  border-color: var(--border);
  color: var(--heading);
}

body.light-mode .call-lang-pill {
  background: var(--blush);
  border-color: var(--border);
  color: var(--heading);
}

body.light-mode .call-live {
  color: var(--accent);
}

/* Stats */
body.light-mode .stat-num {
  color: var(--accent);
  font-family: var(--serif);
}

/* Alternating section backgrounds: cream */
body.light-mode .hero-v2,
body.light-mode .problem-section,
body.light-mode .how-section-v2,
body.light-mode .reviews-v2,
body.light-mode .newsletter-section {
  background: var(--bg);
}

body.light-mode .stats-bar-v2,
body.light-mode .features-section,
body.light-mode .integrations-v2,
body.light-mode .faq-section,
body.light-mode .site-footer,
body.light-mode footer {
  background: var(--bg-alt);
}

body.light-mode .features-section {
  background-image: none;
}

body.light-mode .stats-bar-v2,
body.light-mode .how-section-v2,
body.light-mode .integrations-v2,
body.light-mode .faq-section {
  border-color: var(--border);
}

/* Cards */
body.light-mode .problem-card,
body.light-mode .bento-card,
body.light-mode .step-card,
body.light-mode .integration-card,
body.light-mode .tcard,
body.light-mode .faq-item,
body.light-mode .mid-cta {
  background: var(--bg-alt);
  border-color: var(--border);
  box-shadow: var(--card-shadow);
  border-radius: var(--radius-lg);
}

body.light-mode .bento-accent {
  background: linear-gradient(145deg, var(--bg-alt), var(--blush));
  border-color: var(--border);
}

body.light-mode .bento-card:hover {
  border-color: rgba(200, 99, 61, 0.35);
}

/* Chips */
body.light-mode .beauty-chip {
  background: var(--blush);
  border-color: var(--border);
  color: var(--heading);
  border-radius: 999px;
}

/* Step numbers */
body.light-mode .step-num {
  color: var(--accent);
  background: rgba(200, 99, 61, 0.12);
  border-color: rgba(200, 99, 61, 0.25);
}

/* Mid CTA */
body.light-mode .mid-cta {
  background: var(--plum);
  border-color: var(--plum);
  box-shadow: var(--card-shadow);
}

body.light-mode .mid-cta p {
  color: rgba(255, 255, 255, 0.82);
}

body.light-mode .mid-cta .btn-primary-lg {
  background: var(--accent);
  box-shadow: 0 0 0 2px rgba(201, 162, 75, 0.45), 0 8px 24px rgba(0, 0, 0, 0.15);
}

/* Reviews */
body.light-mode .trating span {
  color: var(--gold);
}

body.light-mode .tavatar {
  background: var(--blush);
  border-color: var(--border);
  color: var(--accent);
}

body.light-mode .tquote {
  color: var(--heading);
}

/* FAQ */
body.light-mode .faq-item summary {
  color: var(--heading);
}

body.light-mode .faq-item summary::after {
  color: var(--accent);
}

/* Form fields */
body.light-mode .field-input,
body.light-mode .phone-input {
  background: var(--bg-alt);
  border-color: var(--border);
  color: var(--heading);
  border-radius: 999px;
}

body.light-mode .field-input:focus,
body.light-mode .phone-input:focus {
  border-color: rgba(200, 99, 61, 0.55);
}

body.light-mode .field-textarea,
body.light-mode .contact-form .field-input {
  border-radius: var(--radius-md);
  background: var(--bg3);
}

body.light-mode .field-textarea {
  min-height: 120px;
  resize: vertical;
}

body.light-mode .eyebrow {
  color: var(--accent);
}

body.light-mode .stat-label,
body.light-mode .tbiz,
body.light-mode .footer-copy {
  color: var(--dim);
}

body.light-mode .footer-dropdown-menu {
  background: var(--bg-alt); box-shadow: var(--card-shadow);
}

body.light-mode .footer-links a {
  color: var(--muted);
}

/* Responsive */
@media (max-width: 960px) {
  .hero-v2 { grid-template-columns: 1fr; padding: 2.5rem var(--gutter) 0; }
  .section-head { grid-template-columns: 1fr; }
  .bento-wide { grid-column: span 1; }
  .bento-grid { grid-template-columns: 1fr 1fr; }
  .problem-grid, .steps-row, .integration-grid, .integration-grid-4, .testimonials-v2 { grid-template-columns: 1fr; }
  .vertical-grid { grid-template-columns: repeat(3, 1fr); }
  .vertical-grid-photos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .vertical-grid-soon { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-preview-inner { grid-template-columns: 1fr; }
  .dashboard-mock { grid-template-columns: 1fr; }
  .dm-sidebar { display: none; }
  .dm-kpis { grid-template-columns: repeat(2, 1fr); }
  .dm-panels { grid-template-columns: 1fr; }
  .stats-inner { grid-template-columns: 1fr 1fr; }
  .stat-item:nth-child(2) { border-right: none; }
  .replace-list { grid-template-columns: 1fr; }
  .apps-grid { grid-template-columns: 1fr; }
}

@media (max-width: 1024px) {
  .nav-toggle { display: flex; }
  .site-nav { flex-wrap: wrap; }
  .nav-drawer {
    order: 4;
    flex: 1 1 100%;
    flex-basis: 100%;
    display: none;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    margin-left: 0;
    padding: 0 0 1rem;
    border-top: 1px solid var(--border);
    margin-top: .5rem;
  }
  .site-nav.nav-open .nav-drawer { display: flex; }
  .nav-drawer .nav-links {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
    padding-top: .35rem;
  }
  .nav-drawer .nav-links a,
  .nav-drawer .nav-dropdown-trigger {
    display: block;
    padding: 8px 0;
    font-size: 15px;
    line-height: 1.35;
  }
  .nav-drawer .nav-right {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 12px;
    width: 100%;
    margin-top: .75rem;
    padding-top: .85rem;
    border-top: 1px solid var(--border);
  }
  .nav-drawer .nav-right .lang-toggle {
    justify-content: flex-start;
  }
  .nav-drawer .nav-right .btn-theme {
    justify-self: end;
  }
  .nav-drawer .nav-right .btn-primary,
  .nav-drawer .nav-right .btn-ghost-lg {
    grid-column: 1 / -1;
    width: 100%;
    text-align: center;
    box-sizing: border-box;
    margin-right: 0 !important;
  }
  .nav-dropdown { width: 100%; }
  /* Accordion: ignore desktop hover/focus-within; only .dropdown-open shows links */
  .nav-dropdown:hover .nav-dropdown-menu,
  .nav-dropdown:focus-within .nav-dropdown-menu {
    opacity: 1;
    visibility: hidden;
    pointer-events: none;
    transform: none;
    max-height: 0;
    display: none;
  }
  .nav-dropdown-menu {
    display: none;
    position: static;
    transform: none;
    opacity: 1;
    visibility: hidden;
    pointer-events: none;
    max-height: 0;
    overflow: hidden;
    padding: 0;
    margin: 0;
    border: none;
    box-shadow: none;
    background: transparent;
  }
  .nav-dropdown.dropdown-open .nav-dropdown-menu,
  .nav-dropdown.dropdown-open:hover .nav-dropdown-menu,
  .nav-dropdown.dropdown-open:focus-within .nav-dropdown-menu {
    display: block;
    visibility: visible;
    pointer-events: auto;
    max-height: min(70vh, 520px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0 0 8px 12px;
    transform: none;
  }
  .call-card-v2 { display: none; }
  .bento-grid { grid-template-columns: 1fr; }
  .vertical-grid { grid-template-columns: 1fr 1fr; }
  .vertical-grid-photos { grid-template-columns: 1fr 1fr; }
  .vertical-grid-soon { grid-template-columns: 1fr 1fr; max-width: none; }
  .mid-cta { flex-direction: column; align-items: flex-start; }
  .newsletter-form { flex-direction: column; }
  .site-footer, footer { flex-direction: column; text-align: center; }
  .announce-bar { font-size: 12px; }
}

@media (max-width: 768px) {
  .site-nav {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 12px;
    row-gap: 0;
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .logo { font-size: 18px; grid-column: 1; grid-row: 1; }
  .nav-toggle { grid-column: 2; grid-row: 1; margin-left: 0; }
  .nav-drawer { grid-column: 1 / -1; grid-row: 2; }
}

/* SMS Chat Booking demo on homepage */
.sms-chat-section {
  padding: 5rem var(--gutter);
  border-top: 1px solid var(--border);
  background: var(--bg);
}
.sms-chat-inner { max-width: var(--max); margin: 0 auto; }
.sms-chat-head {
  display: block;
  margin-bottom: 2.5rem;
}
.sms-chat-section .eyebrow {
  font-size: 15.4px; /* 11px + 40% */
}
.sms-chat-layout {
  display: grid;
  grid-template-columns: minmax(260px, 340px) 1fr;
  gap: 2rem 2.5rem;
  align-items: start;
}
.sms-phone {
  background: var(--bg2);
  border: 1px solid var(--border2);
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(0,0,0,.35);
}
.sms-phone-status {
  text-align: center;
  padding: 14px 16px 12px;
  border-bottom: 1px solid var(--border);
  background: var(--bg3);
}
.sms-phone-carrier {
  display: block; font-size: 11px; color: var(--dim); margin-bottom: 4px;
}
.sms-phone-contact {
  display: block; font-size: 15px; font-weight: 500; color: var(--text);
}
.sms-phone-number {
  display: block; font-size: 12px; color: var(--accent); margin-top: 2px;
  font-variant-numeric: tabular-nums;
}
.sms-thread {
  padding: 14px 12px 18px;
  display: flex; flex-direction: column; gap: 8px;
  min-height: 320px;
}
.sms-bubble {
  font-size: 13px; line-height: 1.45;
  padding: 9px 12px; max-width: 92%;
  border-radius: 18px;
}
.sms-bubble.sms-in {
  align-self: flex-start;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.14);
  border-bottom-left-radius: 4px;
  color: var(--text);
}
.sms-bubble.sms-out {
  align-self: flex-end;
  background: rgba(52, 199, 89, .18);
  border: 1px solid rgba(52, 199, 89, .28);
  color: var(--text);
  border-bottom-right-radius: 4px;
}
.sms-chat-copy { padding-top: .25rem; }
.sms-benefit-list {
  list-style: none;
  margin: 0 0 1.35rem;
  padding: 0;
  display: grid;
  gap: 8px;
  width: max-content;
  max-width: min(22rem, 100%);
}
.sms-benefit-list li {
  position: relative;
  padding: .65rem .85rem .65rem 2.35rem;
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  color: var(--text);
  width: max-content;
  max-width: 100%;
  box-sizing: border-box;
}
.sms-benefit-list li::before {
  content: '';
  position: absolute;
  left: .85rem;
  top: 50%;
  width: 14px;
  height: 14px;
  margin-top: -7px;
  border-radius: 50%;
  background: #e8f8f0;
  box-shadow: inset 0 0 0 1px rgba(15, 107, 69, 0.18);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f6b45' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  background-size: 9px 9px;
  background-repeat: no-repeat;
  background-position: center;
}
.sms-disclosure-label {
  font-size: 12px; text-transform: uppercase; letter-spacing: .06em;
  color: var(--dim); margin: 0 0 .65rem;
}
.sms-disclosure-block {
  font-size: 14px; line-height: 1.55; color: var(--muted);
  padding: 1.1rem 1.25rem;
  border: 1px solid var(--border);
  background: var(--bg3);
  border-radius: 12px;
  margin: 0 0 1rem;
  max-width: 36rem;
}
.sms-chat-note {
  font-size: 12.5px; color: var(--dim); margin: 0 0 1.25rem;
}
.sms-chat-copy .btn-primary-lg { display: inline-flex; }

@media (max-width: 800px) {
  .sms-chat-layout { grid-template-columns: 1fr; }
  .sms-phone { max-width: 360px; margin: 0 auto; }
}

/* Homepage Greeta Book preview */
.home-book-section {
  padding: 5rem var(--gutter);
  border-top: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(139,92,246,.04), transparent);
}
.home-book-inner {
  max-width: var(--max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 2.5rem;
  align-items: center;
}
.home-book-copy .section-sub { max-width: 36rem; margin: 0 0 1.25rem; }
.home-book-points {
  list-style: none;
  margin: 0 0 1.35rem;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 14px;
}
.home-book-points li {
  font-size: 13.5px;
  color: var(--muted);
  font-weight: 400;
  padding-left: 1.35rem;
  position: relative;
}
.home-book-points li::before {
  content: '';
  position: absolute;
  left: 0;
  top: .2em;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #e8f8f0;
  box-shadow: inset 0 0 0 1px rgba(15, 107, 69, 0.18);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f6b45' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  background-size: 9px 9px;
  background-repeat: no-repeat;
  background-position: center;
}
.home-book-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 1.15rem;
}
.home-book-phones {
  transform: scale(.92);
  transform-origin: center center;
}
@media (max-width: 960px) {
  .home-book-inner { grid-template-columns: 1fr; }
  .home-book-visual { order: -1; max-width: 420px; margin: 0 auto; }
  .ecosystem-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .home-book-points { grid-template-columns: 1fr; }
  .ecosystem-grid { grid-template-columns: 1fr; }
}

/* Product promo pages */
.product-page {
  overflow: hidden;
  margin-top: 0;
  padding-top: 0;
}
.product-hero {
  position: relative;
  min-height: min(88vh, 780px);
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 2.5rem;
  align-items: center;
  max-width: var(--max);
  margin: 0 auto;
  padding: 2rem var(--gutter) 3.25rem;
}
.product-hero::before {
  content: '';
  position: absolute;
  inset: -10% -20% auto;
  height: 70%;
  background:
    radial-gradient(ellipse 50% 60% at 15% 40%, rgba(200,168,255,.18), transparent 70%),
    radial-gradient(ellipse 45% 55% at 85% 20%, rgba(52,211,153,.08), transparent 65%);
  pointer-events: none;
  z-index: 0;
}
.product-hero-copy,
.product-hero-visual {
  position: relative;
  z-index: 1;
}
.product-hero-visual .app-phones {
  margin-left: auto;
  margin-right: 0;
}
.product-hero-visual .app-phones-shots {
  min-height: 540px;
  width: min(100%, 460px);
}
.product-brand {
  font-family: var(--serif);
  font-size: clamp(3.2rem, 7vw, 5.2rem);
  line-height: .95;
  letter-spacing: -.02em;
  margin: 0 0 1.1rem;
}
.product-brand em {
  font-style: italic;
  color: var(--accent);
}
.product-hero h1,
.product-hero h2 {
  font-family: var(--serif);
  font-weight: 400;
  line-height: 1.15;
  margin: 0 0 .75rem;
  max-width: 22ch;
}
.product-hero h1 {
  font-size: clamp(1.8rem, 3.5vw, 2.6rem);
}
.product-hero h2 {
  font-size: clamp(1.55rem, 3vw, 2.1rem);
  line-height: 1.2;
  margin: 0 0 .9rem;
}
.product-hero-lead {
  font-size: 17px;
  color: var(--muted);
  font-weight: 300;
  line-height: 1.7;
  margin: 0 0 1.75rem;
  max-width: 47.5rem;
}
.product-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: .85rem;
}
.product-hero-actions.is-centered {
  justify-content: center;
}
.product-hero-actions.is-centered-wrap {
  justify-content: center;
  flex-wrap: wrap;
  gap: .75rem;
}
.product-micro {
  font-size: 13px;
  color: var(--dim);
  margin: 0;
}
.product-phone {
  width: min(100%, 300px);
  margin-left: auto;
  border: 1px solid var(--border2);
  border-radius: 28px;
  background: linear-gradient(165deg, var(--bg3), var(--bg2));
  padding: 14px 12px 18px;
  box-shadow: 0 30px 80px rgba(0,0,0,.35);
}
.product-phone-bar {
  height: 10px;
  width: 36%;
  margin: 0 auto 14px;
  border-radius: 999px;
  background: var(--border2);
}
.product-phone-screen {
  border-radius: 18px;
  background: var(--bg);
  border: 1px solid var(--border);
  padding: 14px;
  min-height: 380px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pp-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--bg2);
  border: 1px solid var(--border);
  font-size: 13px;
}
.pp-row strong { font-weight: 500; }
.pp-row span { color: var(--muted); font-size: 12px; }
.pp-pill {
  align-self: flex-start;
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--accent);
  border: 1px solid rgba(200,168,255,.3);
  border-radius: 999px;
  padding: 4px 10px;
}
.pp-cta-fake {
  margin-top: auto;
  text-align: center;
  padding: 11px;
  border-radius: 12px;
  background: var(--accent);
  color: #120f1a;
  font-size: 13px;
  font-weight: 600;
}
.product-dash {
  border: 1px solid var(--border2);
  border-radius: 18px;
  background: var(--bg2);
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0,0,0,.35);
}
.product-dash-top {
  display: flex;
  gap: 6px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  background: var(--bg3);
}
.product-dash-top i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--border2);
  display: block;
}
.product-dash-body {
  display: grid;
  grid-template-columns: 120px 1fr;
  min-height: 340px;
}
.product-dash-side {
  padding: 14px 10px;
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 11px;
  color: var(--dim);
}
.product-dash-side .is-active {
  color: var(--accent);
}
.product-dash-main {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.pd-metric {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.pd-metric div {
  padding: 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.pd-metric strong {
  display: block;
  font-family: var(--serif);
  font-size: 1.6rem;
  line-height: 1;
  margin-bottom: 4px;
}
.pd-metric span {
  font-size: 12px;
  color: var(--muted);
}
.pd-call {
  padding: 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg);
  font-size: 13px;
}
.pd-call em {
  color: var(--green);
  font-style: normal;
  font-size: 12px;
}
.product-section {
  max-width: var(--max);
  margin: 0 auto;
  padding: 3.5rem var(--gutter);
}
.product-section h2 {
  font-family: var(--serif);
  font-size: clamp(2rem, 4vw, 2.75rem);
  font-weight: 400;
  line-height: 1.15;
  margin: 0 0 .75rem;
  max-width: 18ch;
}
.product-section > p {
  color: var(--muted);
  max-width: 50rem;
  margin: 0 0 2rem;
  font-weight: 300;
}
.product-features h2 {
  max-width: 22ch;
}
.product-features > p {
  max-width: 42rem;
  line-height: 1.6;
  font-size: 15.5px;
}
.product-features .product-feature-list li h3 {
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -.01em;
  margin-bottom: .35rem;
}
.product-features .product-feature-list li p {
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--muted);
  font-weight: 300;
}
.product-steps {
  list-style: none;
  display: grid;
  gap: 0;
  border-top: 1px solid var(--border);
}
.product-steps li {
  display: grid;
  grid-template-columns: 4rem 1fr;
  gap: 1.25rem;
  padding: 1.35rem 0;
  border-bottom: 1px solid var(--border);
}
.product-steps .step-n {
  font-family: var(--serif);
  font-size: 1.75rem;
  color: var(--accent);
  line-height: 1;
}
.product-steps h3 {
  font-size: 1.05rem;
  font-weight: 500;
  margin: 0 0 .35rem;
}
.product-steps p {
  margin: 0;
  color: var(--muted);
  font-size: 14.5px;
  line-height: 1.6;
  max-width: 42rem;
}
.product-feature-list {
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem 2.5rem;
}
.product-feature-list li h3 {
  font-size: 1rem;
  font-weight: 500;
  margin: 0 0 .35rem;
}
.product-feature-list li p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.55;
}
.product-band {
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  background:
    radial-gradient(ellipse 60% 80% at 50% 100%, rgba(200,168,255,.1), transparent 70%),
    var(--bg2);
}
.product-band-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 3.75rem var(--gutter);
  text-align: center;
}
.product-band-inner h2 {
  font-family: var(--serif);
  font-size: clamp(2rem, 4vw, 2.8rem);
  font-weight: 400;
  margin: 0 0 .75rem;
}
.product-band-inner p {
  color: var(--muted);
  max-width: 34rem;
  margin: 0 auto 1.5rem;
  font-weight: 300;
}
.product-related {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  justify-content: center;
  font-size: 14px;
}
.product-related a {
  color: var(--accent);
  border-bottom: 1px solid transparent;
}
.product-related a:hover {
  border-bottom-color: var(--accent);
}
body.light-mode .product-hero::before {
  background:
    radial-gradient(ellipse 50% 60% at 15% 40%, rgba(200,99,61,.12), transparent 70%),
    radial-gradient(ellipse 45% 55% at 85% 20%, rgba(201,162,75,.1), transparent 65%);
}
body.light-mode .pp-cta-fake {
  color: #fff;
}
@media (max-width: 900px) {
  :root {
    --gutter: 1rem;
  }
  .product-hero {
    grid-template-columns: 1fr;
    min-height: 0;
    padding-top: 1.75rem;
    align-items: start;
  }
  .product-hero-visual .app-phones {
    margin: 0 auto 1.5rem;
  }
  .product-phone,
  .product-dash {
    margin: 0 auto;
    width: 100%;
    max-width: 360px;
  }
  .product-feature-list {
    grid-template-columns: 1fr;
  }
  .product-dash-body {
    grid-template-columns: 1fr;
  }
  .product-dash-side {
    flex-direction: row;
    flex-wrap: wrap;
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }
}

/* Small-screen footer menus stay within the viewport, including while hidden. */
@media (max-width: 480px) {
  .footer-dropdown-menu { position: fixed; left: 16px; right: 16px; bottom: 20px; min-width: 0; width: auto; max-height: 60vh; overflow-y: auto; }
}
.footer-address { font-style: normal; font-size: 12px; color: var(--muted); line-height: 1.6; }

/* Pricing */
.pricing-section {
  padding: 5rem var(--gutter);
  background: var(--bg);
  border-top: 1px solid var(--border);
}
.pricing-inner {
  max-width: var(--max);
  margin: 0 auto;
}
.pricing-inner > .section-sub,
.pricing-inner > #sub-pricing {
  max-width: 780px;
  margin: 0 0 2.5rem;
  color: var(--muted);
  font-weight: 300;
  line-height: 1.65;
  white-space: nowrap;
}
.pricing-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 2.5rem;
}
.pricing-card {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.5rem;
  background: var(--bg2);
  border: 1px solid var(--border2);
  border-radius: var(--radius-xl);
}
.pricing-card-featured {
  border-color: rgba(200, 168, 255, 0.45);
  box-shadow: 0 0 0 1px rgba(200, 168, 255, 0.18), 0 18px 50px rgba(139, 92, 246, 0.12);
}
.pricing-badge {
  display: inline-flex;
  align-self: flex-start;
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  background: rgba(200, 168, 255, 0.18);
  border: 1px solid rgba(200, 168, 255, 0.4);
  border-radius: 999px;
  padding: 5px 10px;
}
.pricing-badge-green {
  color: #6ee7b7;
  background: rgba(52, 211, 153, 0.2);
  border-color: rgba(52, 211, 153, 0.5);
}
body.light-mode .pricing-badge-green {
  color: #0b5c3a;
  background: #d8f5e8;
  border-color: rgba(15, 107, 69, 0.28);
}
.pricing-amount {
  font-family: var(--serif);
  font-size: 40px;
  letter-spacing: -1px;
  line-height: 1;
}
.pricing-amount span {
  font-family: var(--sans);
  font-size: 15px;
  font-weight: 400;
  color: var(--dim);
  letter-spacing: 0;
}
.pricing-annual {
  font-size: 13px;
  color: var(--dim);
}
.pricing-features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0.25rem 0 0.75rem;
  flex: 1;
}
.pricing-features li {
  position: relative;
  padding-left: 1.15rem;
  font-size: 14px;
  color: var(--muted);
  font-weight: 300;
}
.pricing-features li::before {
  content: '';
  position: absolute;
  left: 0; top: 8px;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--accent);
}
.pricing-features li strong { font-weight: 600; color: var(--text); }
.pricing-card .btn-primary { align-self: stretch; text-align: center; }
.pricing-enterprise {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 1.35rem 1.5rem;
  margin-bottom: 2.5rem;
  background: var(--bg2);
  border: 1px solid var(--border2);
  border-radius: var(--radius-xl);
}
.pricing-enterprise-copy h3 {
  font-family: var(--serif);
  font-size: 24px;
  margin: 0.4rem 0 0.45rem;
}
.pricing-enterprise-copy p { color: var(--muted); font-weight: 300; max-width: 560px; }
.pricing-matrix-wrap { margin-bottom: 1.5rem; }
.pricing-matrix-title {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 0.85rem;
}
.pricing-matrix-scroll {
  overflow-x: auto;
  border: 1px solid var(--border2);
  border-radius: var(--radius-lg);
  background: var(--bg2);
}
.pricing-matrix {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
  font-size: 13.5px;
}
.pricing-matrix th,
.pricing-matrix td {
  padding: 0.75rem 1rem;
  text-align: left;
  border-bottom: 1px solid var(--border);
  color: var(--muted);
}
.pricing-matrix th { color: var(--text); font-weight: 600; }
.pricing-footnotes {
  font-size: 13px;
  color: var(--dim);
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.pricing-page .pricing-inner h1 {
  font-family: var(--serif);
  font-size: clamp(2rem, 4vw, 2.8rem);
  font-weight: 400;
  line-height: 1.15;
  margin: .35rem 0 1rem;
}
.pricing-page .pricing-inner > #pricing-page-lead {
  max-width: 40rem;
  margin: 0 0 2rem;
  color: var(--muted);
  font-weight: 300;
  line-height: 1.65;
  white-space: normal;
}
.pricing-page-cta {
  display: flex;
  justify-content: center;
  margin: 2.5rem 0 .5rem;
}
.pricing-source {
  font-size: 12px;
  color: var(--dim);
  margin: .75rem 0 0;
}
.pricing-source code {
  font-size: 11px;
}
#pricing-home-link {
  padding: 8px 14px;
  font-size: 13px;
}
@media (max-width: 900px) {
  #pricing-home-link { display: none; }
}
@media (max-width: 900px) {
  .pricing-cards { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .pricing-inner > .section-sub,
  .pricing-inner > #sub-pricing {
    white-space: normal;
    max-width: 100%;
  }
}
@media (max-width: 720px) {
  .pricing-enterprise { flex-direction: column; align-items: flex-start; }
}

/* Enterprise inquiry modal (pricing CTA — not #contact demo form) */
.enterprise-inquiry-dialog {
  position: fixed;
  inset: 0;
  margin: auto;
  width: min(96vw, 48rem);
  max-height: min(92vh, 48rem);
  padding: 0;
  border: 1px solid rgba(167, 139, 250, .35);
  border-radius: 24px;
  color: var(--text);
  background: var(--bg);
  box-shadow: 0 28px 90px rgba(8, 5, 20, .46);
  overflow-y: auto;
}
.enterprise-inquiry-dialog::backdrop {
  background: rgba(8, 5, 20, .72);
  backdrop-filter: blur(6px);
}
.enterprise-inquiry-card {
  position: relative;
  padding: clamp(22px, 4vw, 34px);
  text-align: left;
}
.enterprise-inquiry-card h2 {
  margin: 0 40px 8px 0;
  font-family: 'Instrument Serif', serif;
  font-size: clamp(28px, 5vw, 40px);
  font-weight: 400;
}
.enterprise-inquiry-desc {
  margin: 0 0 18px;
  color: var(--dim);
  line-height: 1.5;
}
.enterprise-inquiry-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 14px;
  margin: 0 0 14px;
  align-items: stretch;
}
.ei-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  color: var(--dim);
  font-size: 13px;
}
.ei-field select,
.ei-field input,
.ei-field textarea {
  margin-top: auto;
  width: 100%;
  min-height: 42px;
  padding: 10px 12px;
  border: 1px solid var(--border2);
  border-radius: 12px;
  color: var(--text);
  background-color: var(--bg3);
  font: inherit;
  color-scheme: dark;
}
.ei-field select {
  /* Windows/Chrome: selected value + open list inherit opaque surfaces */
  appearance: auto;
}
.ei-field select option,
.ei-field select optgroup {
  background-color: var(--bg2);
  color: var(--text);
}
.ei-field textarea { min-height: 110px; resize: vertical; }
.enterprise-inquiry-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 16px;
  flex-wrap: wrap;
}
.ei-state {
  margin: 10px 0 0;
  font-size: 13px;
  color: var(--muted);
}
.ei-state.ei-state-error { color: #f87171; }
body.light-mode .enterprise-inquiry-dialog {
  border-color: var(--border);
  background: var(--bg-alt);
  color-scheme: light;
  box-shadow: var(--card-shadow);
}
body.light-mode .enterprise-inquiry-dialog::backdrop {
  background: rgba(58, 36, 51, .45);
}
body.light-mode .ei-field select,
body.light-mode .ei-field input,
body.light-mode .ei-field textarea {
  background-color: var(--bg-alt);
  border-color: var(--border);
  color: var(--heading);
  color-scheme: light;
}
body.light-mode .ei-field select option,
body.light-mode .ei-field select optgroup {
  background-color: #ffffff;
  color: var(--heading);
}
@media (max-width: 720px) {
  .enterprise-inquiry-grid { grid-template-columns: 1fr; }
}

/* App showcase (Greeta Book + Greeta Voice mobile) */
.app-icon-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 1.4rem;
  max-width: 520px;
}
.app-icon-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}
.app-icon-bubble {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(200, 168, 255, 0.12);
  border: 1px solid rgba(200, 168, 255, 0.22);
  color: var(--accent);
}
.app-icon-item strong {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  line-height: 1.2;
}
.app-icon-item span {
  font-size: 12px;
  color: var(--dim);
  line-height: 1.35;
  font-weight: 300;
}
.store-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 1.1rem;
}
.store-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 10px;
  background: #121218;
  color: #faf9ff;
  border: 1px solid rgba(255,255,255,0.12);
  font-size: 12px;
  line-height: 1.2;
  text-decoration: none;
}
a.store-badge:hover {
  border-color: rgba(167,139,250,.45);
}
.store-badge small {
  display: block;
  font-size: 10px;
  color: #9a97a8;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.store-badge b { font-size: 13.5px; font-weight: 600; }
.app-phones {
  position: relative;
  min-height: 520px;
  margin-left: auto;
  width: min(100%, 420px);
}
.app-phone {
  position: absolute;
  width: 230px;
  border-radius: 32px;
  background: #1a1a22;
  padding: 10px 8px 12px;
  box-shadow: 0 24px 60px rgba(0,0,0,.4);
  border: 1px solid rgba(255,255,255,0.08);
}
.app-phone-front { left: 0; top: 0; z-index: 2; }
.app-phone-back { right: 0; top: 56px; z-index: 1; transform: rotate(5deg); }
.app-phone-shot {
  padding: 0;
  overflow: hidden;
  background: #12121a;
  width: 240px;
  box-shadow:
    0 28px 70px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,255,255,0.16),
    0 0 40px rgba(139, 92, 246, 0.12);
}
.app-phone-shot img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 32px;
  filter: brightness(1.08) contrast(1.04) saturate(1.05);
}
.app-phones-shots {
  min-height: 560px;
  width: min(100%, 460px);
}
.app-phones-shots .app-phone-front { left: 0; top: 0; }
.app-phones-shots .app-phone-back { right: 0; top: 48px; }
.app-phone-notch {
  width: 72px;
  height: 8px;
  border-radius: 999px;
  background: #2a2a34;
  margin: 4px auto 8px;
}
.app-screen {
  background: #f7f5fb;
  color: #1a1623;
  border-radius: 22px;
  min-height: 430px;
  padding: 12px 12px 14px;
  font-family: var(--sans);
}
.app-status {
  font-size: 11px;
  font-weight: 600;
  text-align: center;
  color: #5a5566;
  margin-bottom: 8px;
}
.app-screen-brand {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #7c5cbf;
  margin: 0 0 8px;
}
.app-hi { font-size: 20px; margin: 0 0 2px; letter-spacing: -.03em; }
.app-hi-sub { font-size: 12px; color: #6b6576; margin: 0 0 12px; }
.app-tiles {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin-bottom: 10px;
}
.app-tile {
  background: #fff;
  border-radius: 10px;
  padding: 8px 6px;
  text-align: center;
  font-size: 10px;
  font-weight: 600;
  color: #3a3544;
  box-shadow: 0 1px 0 rgba(26,22,35,0.06);
}
.app-tile i {
  display: block;
  width: 100%;
  height: 28px;
  border-radius: 6px;
  margin-bottom: 6px;
  background: linear-gradient(145deg, #e8e0f6, #d4c4f0);
}
.app-cta-fake {
  display: block;
  text-align: center;
  background: #8b5cf6;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  border-radius: 999px;
  padding: 9px 10px;
  margin-bottom: 12px;
}
.app-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 9px 0;
  border-top: 1px solid #ece7f3;
  font-size: 12px;
}
.app-row strong { font-weight: 600; }
.app-row span { color: #7a7486; font-size: 11px; }
.app-tabs {
  display: flex;
  gap: 12px;
  font-size: 11px;
  font-weight: 600;
  margin: 0 0 8px;
  color: #9a94a6;
}
.app-tabs .is-on { color: #8b5cf6; border-bottom: 2px solid #8b5cf6; padding-bottom: 3px; }
.app-appt {
  background: #fff;
  border-radius: 12px;
  padding: 10px;
  margin-bottom: 8px;
  box-shadow: 0 1px 0 rgba(26,22,35,0.05);
}
.app-appt b { display: block; font-size: 12.5px; margin-bottom: 2px; }
.app-appt em { display: block; font-size: 11px; color: #6b6576; font-style: normal; margin-bottom: 8px; }
.app-appt-actions { display: flex; gap: 8px; font-size: 11px; font-weight: 600; }
.app-appt-actions .ok { color: #8b5cf6; }
.app-appt-actions .no { color: #c45b6a; }
.app-note {
  position: absolute;
  right: -8px;
  bottom: -18px;
  background: #fff;
  color: #1a1623;
  border-radius: 14px;
  padding: 10px 12px;
  font-size: 12px;
  font-weight: 600;
  box-shadow: 0 12px 30px rgba(0,0,0,.18);
  z-index: 3;
  max-width: 150px;
}
.app-note span { color: #8b5cf6; }
.app-note-line {
  background: none;
  box-shadow: none;
  border-radius: 0;
  padding: 0;
  max-width: none;
  white-space: nowrap;
  color: var(--green);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -.01em;
  right: 0;
  bottom: -8px;
}
.app-showcase {
  max-width: var(--max);
  margin: 0 auto;
  padding: 2rem var(--gutter) 4rem;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 2.5rem;
  align-items: center;
  border-top: 1px solid var(--border);
}
.app-showcase-copy h2 {
  font-family: var(--serif);
  font-size: clamp(1.7rem, 3vw, 2.3rem);
  line-height: 1.15;
  margin: 0 0 .75rem;
}
.app-showcase-copy p {
  color: var(--muted);
  font-weight: 300;
  line-height: 1.65;
  margin: 0 0 1.25rem;
  max-width: 38rem;
}
.product-hero.product-hero-app {
  align-items: center;
}
.product-hero.product-hero-app h2 { max-width: 16ch; }
body.light-mode .app-icon-bubble {
  background: rgba(200, 99, 61, 0.1);
  border-color: var(--border);
  color: var(--accent);
}
body.light-mode .store-badge {
  background: var(--heading);
  color: #fff;
}
@media (max-width: 900px) {
  .app-phones { min-height: 480px; margin: 1rem auto 2rem; }
  .app-phone { width: 200px; }
  .app-phone-shot { width: 210px; }
  .app-phones-shots { min-height: 500px; }
  .app-screen { min-height: 380px; }
  .app-icon-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .app-showcase { grid-template-columns: 1fr; padding: 2rem 1.5rem 3rem; }
}

/* Affiliate earnings / kit (2026-10-12) */
.affiliate-earnings-wrap{overflow-x:auto;margin:1rem 0 1.25rem}
.affiliate-earnings-table{width:100%;border-collapse:collapse;font-size:.95rem}
.affiliate-earnings-table th,.affiliate-earnings-table td{text-align:left;padding:.7rem .55rem;border-bottom:1px solid color-mix(in srgb,currentColor 12%,transparent);vertical-align:top}
.affiliate-earnings-table th{font-weight:600}
.affiliate-earnings-table code{font-size:.9em;opacity:.9}
.affiliate-earnings-note{font-size:.92rem;opacity:.85;margin-bottom:1.75rem}
.affiliate-kit-grid{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));margin:1rem 0 1.5rem}
.affiliate-kit-col h3{margin:0 0 .5rem;font-size:1.05rem}
.affiliate-post{margin:0 0 1.1rem}
.affiliate-post h4{margin:0 0 .4rem;font-size:1rem}
.affiliate-post-body{white-space:pre-wrap}
.affiliate-copy-hint{font-size:.9rem;opacity:.85;margin:0 0 .75rem}
.affiliate-faq-list{margin:1rem 0 1.5rem}

/* --- gv-redesign.css --- */
/* ============================================================
   gv-redesign.css — production styles for the conversion redesign.
   Every block is tagged with its change number (see CHANGES.md).
   Bundled into css/site.css after style.css — run:
     node scripts/build-site-css.mjs
   ============================================================ */

/* #33 Contrast: --dim (#7a768f ≈ 4.4:1 on #08080c) raised to ≈ 7:1; light-mode --dim raised too */
:root { --dim: #a29eb8; }
body.light-mode { --dim: #6b5663; }
.cta-micro { font-size: 13.5px; color: var(--muted); }
.dashboard-preview-caption { font-size: 12.5px; color: var(--muted); }
.sms-chat-note, .verticals-notify, .footer-copy, .footer-doc-version { color: var(--muted); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* PLACEHOLDER text (always visible: it must be replaced before launch) */
.gv-placeholder-text {
  font-size: 13px; line-height: 1.5; color: #f5d68a !important;
  background: rgba(245, 214, 138, .07); border: 1px dashed rgba(245, 214, 138, .5);
  border-radius: 8px; padding: .5rem .7rem; margin: .5rem 0;
}
span.gv-placeholder-text { display: inline; padding: .1rem .35rem; margin: 0; }
.gv-placeholder-text code { font-size: 12px; color: #fff3cf; }
body.light-mode .gv-placeholder-text { color: #7a5600 !important; background: #fff6dc; border-color: #d9b24c; }
/* Collapsible chat transcripts (Hear Greeta + SMS text-back) */
.hear-chat .hear-msg.is-chat-hidden,
.chat-expand-extra.is-chat-hidden { display: none; }
.chat-expand-wrap, .sms-real-more { margin: .7rem 0 0; text-align: center; }
.chat-expand-wrap .js-chat-expand,
.sms-real-more .js-chat-expand {
  appearance: none; background: none; border: 0; padding: 0; cursor: pointer;
  font: inherit; color: var(--accent); font-weight: 500; text-decoration: none;
}
.chat-expand-wrap .js-chat-expand:hover,
.sms-real-more .js-chat-expand:hover { text-decoration: underline; text-underline-offset: 3px; }
.sms-chat-layout-benefits { grid-template-columns: minmax(0, 1fr); max-width: 40rem; }
.np-plan-note { margin: .85rem 0 0; font-size: 15px; color: var(--text); }
.np-plan-note strong { color: var(--accent); font-weight: 600; }

/* Shared inline SVG line icons (#9, #19) */
.gv-icon { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.gv-icon-lg { width: 26px; height: 26px; color: var(--accent); }
.problem-icon, .bento-icon { font-size: 0; line-height: 0; }



/* #5 hero text links */
.hero-text-links { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: .9rem; font-size: 14.5px; }
.hero-text-links a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.hero-text-links span { color: var(--dim); }

/* #8 Trust strip (replaces stats bar) */
.trust-strip { border-block: 1px solid var(--border); background: var(--bg2); padding: 1.1rem var(--gutter); }
.trust-strip-list {
  list-style: none; max-width: var(--max); margin: 0 auto;
  display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem 2rem;
}
.trust-strip-list li { display: flex; align-items: center; gap: .5rem; font-size: 14px; color: var(--text); font-weight: 500; }
.trust-strip-list .gv-icon { color: var(--accent); }

/* #11 Problem demo buttons: brand-coloured, no infinite bounce/glow */
.problem-cta-wrap { gap: 1rem; padding: 1.5rem 0 0; }
.problem-demo-cta, .problem-demo-cta.problem-voice-demo, .problem-demo-cta.problem-ai-sms-demo {
  animation: none !important; font-size: 16px; font-weight: 700; padding: 14px 30px; border-radius: var(--radius-md);
  box-shadow: none; transform: none;
}
.problem-demo-cta::before { display: none; }
.problem-demo-cta.problem-voice-demo { background: var(--accent); color: var(--cta-text, #08080c); }
.problem-demo-cta.problem-ai-sms-demo { background: transparent; color: var(--text); border: 1px solid var(--border2); }
.problem-demo-cta:hover { transform: translateY(-1px); filter: brightness(1.06); box-shadow: none; }
body.light-mode .problem-demo-cta.problem-voice-demo { background: var(--accent); color: #fff; box-shadow: none; }
body.light-mode .problem-demo-cta.problem-ai-sms-demo { background: transparent; color: var(--text); box-shadow: none; }

/* #10 ROI calculator */
.roi-card {
  margin-top: 2rem; display: grid; grid-template-columns: 1fr 1.2fr 1fr; gap: 1.5rem; align-items: center;
  background: linear-gradient(145deg, var(--bg2), rgba(139,92,246,.08));
  border: 1px solid rgba(200,168,255,.22); border-radius: var(--radius-xl); padding: 1.6rem;
}
.roi-copy h3 { font-family: var(--serif); font-weight: 400; font-size: 26px; line-height: 1.15; margin-bottom: .4rem; }
.roi-copy p { color: var(--muted); font-size: 14px; }
.roi-form { display: grid; gap: .7rem; }
.roi-field { display: grid; grid-template-columns: 1fr 96px; align-items: center; gap: .75rem; font-size: 14px; color: var(--muted); }
.roi-field input {
  width: 100%; font: inherit; font-size: 16px; color: var(--text); background: var(--bg);
  border: 1px solid var(--border2); border-radius: var(--radius-sm); padding: .5rem .6rem; text-align: right;
}
.roi-field input:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.roi-result { text-align: left; }
.roi-result-label { font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: var(--accent); font-weight: 600; }
.roi-result-num { font-family: var(--serif); font-size: clamp(38px, 4vw, 52px); line-height: 1.05; margin: .2rem 0 .4rem; }
.roi-per { font-family: var(--sans); font-size: 15px; color: var(--muted); margin-left: .25rem; }
.roi-result-compare { font-size: 14px; color: var(--muted); }
.roi-result-compare strong { color: var(--text); }
.roi-note { font-size: 12px; color: var(--dim); margin-top: .5rem; }
.roi-page-section { padding-top: 0; }
.roi-card-page {
  margin-top: 0;
  grid-template-columns: 1fr 1.15fr 1fr;
  max-width: var(--max);
  margin-inline: auto;
}
.roi-card-page .roi-copy h2 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(26px, 3vw, 34px);
  line-height: 1.15;
  margin: 0 0 .4rem;
}
.roi-open-full {
  display: inline-block;
  margin-top: .85rem;
  font-size: 14px;
  font-weight: 600;
  color: var(--accent);
  text-decoration: none;
}
.roi-open-full:hover { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 900px) {
  .roi-card-page { grid-template-columns: 1fr; }
}

/* #12 Hear Greeta — single centered column (~800px) */
.hear-section { padding: 5rem var(--gutter); border-top: 1px solid var(--border); background: linear-gradient(180deg, rgba(139,92,246,.05), transparent); }
.hear-inner { max-width: var(--max); margin: 0 auto; }
.hear-inner h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(30px, 3.5vw, 42px); line-height: 1.12; margin-bottom: .75rem; }
.hear-stack { display: grid; gap: 1.25rem; margin-top: 2rem; max-width: 800px; margin-left: auto; margin-right: auto; width: 100%; }
.hear-player-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: .85rem 1rem;
  background: transparent;
}
.hear-player {
  flex: 1 1 280px; min-width: 0;
  background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1rem 1.1rem;
}
.hear-player-head { display: flex; align-items: center; gap: .6rem; font-size: 15px; margin-bottom: .5rem; }
.hear-lang { font-size: 11px; font-weight: 700; letter-spacing: .08em; color: var(--accent); border: 1px solid rgba(200,168,255,.35); border-radius: 6px; padding: 2px 6px; }
.hear-audio-slot audio { width: 100%; }
.hear-call-actions {
  display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; justify-content: flex-end;
  flex: 0 1 auto; margin: 0;
}
.hear-section.is-transcript-expanded .hear-player-row {
  position: sticky;
  top: calc(64px + 16px); /* site-nav min-height + 16px */
  z-index: 40;
  padding: .5rem .65rem;
  margin: 0 -.65rem;
  border-radius: var(--radius-md);
  background: var(--bg);
  box-shadow: 0 8px 20px rgba(0, 0, 0, .18);
}
body.light-mode .hear-section.is-transcript-expanded .hear-player-row {
  background: var(--bg);
  box-shadow: 0 8px 20px rgba(0, 0, 0, .08);
}
.hear-transcript { background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1.2rem; display: grid; gap: .75rem; }
.hear-transcript-label { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: var(--accent); font-weight: 600; }
.hear-line { display: grid; gap: .2rem; max-width: 92%; }
.hear-line p { font-size: 14.5px; padding: .65rem .85rem; border-radius: 14px; background: var(--bg3); border: 1px solid var(--border); }
.hear-line-caller { justify-self: end; text-align: right; }
.hear-line-caller p { background: rgba(52,211,153,.1); border-color: rgba(52,211,153,.25); }
.hear-who { font-size: 12px; color: var(--muted); }
.hear-booking-card { position: static !important; transform: none !important; margin: .25rem 0 0; max-width: 340px; animation: none !important; opacity: 1 !important; }
@media (max-width: 768px) {
  .hear-player-row { flex-direction: column; align-items: stretch; }
  .hear-call-actions { justify-content: stretch; width: 100%; }
  .hear-call-actions .btn-ghost-lg { width: 100%; justify-content: center; }
  .hear-section.is-transcript-expanded .hear-player-row { top: calc(64px + 12px); }
}
@media (max-width: 390px) {
  .hear-stack { gap: 1rem; }
  .hear-player { padding: .85rem .9rem; }
}

/* #13 How it works (moved) */
.how-section-v2 .how-start-title { font-family: var(--serif); font-weight: 400; font-size: clamp(30px, 3.5vw, 42px); line-height: 1.12; margin: 0 0 .5rem; }
ol.steps-row { list-style: none; padding: 0; }

/* #16 App showcase */
.showcase-section { padding: 5rem var(--gutter); border-top: 1px solid var(--border); }
.showcase-inner { max-width: var(--max); margin: 0 auto; }
.showcase-inner > h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(30px, 3.5vw, 42px); line-height: 1.12; margin-bottom: .75rem; max-width: 900px; }
.showcase-inner > .section-sub { max-width: 720px; }
.showcase-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; margin-top: 2rem; }
.showcase-card {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; align-items: center;
  background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius-xl); padding: 1.4rem;
}
.showcase-shots { display: flex; gap: .6rem; justify-content: center; }
.showcase-shots img { width: 48%; height: auto; border-radius: 18px; border: 1px solid var(--border2); box-shadow: 0 20px 50px rgba(0,0,0,.45); }
.showcase-shots img + img { margin-top: 2.2rem; }
.showcase-kicker { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: var(--accent); font-weight: 600; margin-bottom: .3rem; }
.showcase-copy h3 { font-family: var(--serif); font-weight: 400; font-size: 28px; margin-bottom: .6rem; }
.showcase-points { list-style: none; display: grid; gap: .4rem; margin-bottom: 1rem; }
.showcase-points li { position: relative; padding-left: 1.4rem; font-size: 14px; color: var(--muted); }
.showcase-points li::before { content: ''; position: absolute; left: 0; top: .45em; width: 10px; height: 6px; border-left: 2px solid var(--green); border-bottom: 2px solid var(--green); transform: rotate(-45deg); }
.showcase-copy .store-badges { margin-bottom: .9rem; }
.showcase-link { color: var(--accent); font-size: 14px; font-weight: 600; }
.showcase-web {
  display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-top: 1.25rem;
  background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1.1rem 1.3rem;
}
.showcase-web > div { flex: 1 1 280px; }
.showcase-web h3 { font-size: 16px; margin-bottom: .2rem; }
.showcase-web p { font-size: 14px; color: var(--muted); }

/* #17 dashboard mock title is no longer a heading */
p.dm-title { font-weight: 600; }

/* #18 Why Greeta comparison */
.compare-section { padding: 5rem var(--gutter); border-top: 1px solid var(--border); }
.compare-inner { max-width: 1375px; margin: 0 auto; }
.compare-inner h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(30px, 3.5vw, 42px); line-height: 1.12; margin-bottom: .75rem; }
.compare-scroll { overflow-x: auto; margin-top: 1.75rem; border: 1px solid var(--border); border-radius: var(--radius-lg); }
.compare-table { width: 100%; border-collapse: collapse; min-width: 640px; font-size: 14px; }
.compare-table th, .compare-table td { padding: .8rem .9rem; border-bottom: 1px solid var(--border); text-align: center; }
.compare-table tbody th { text-align: left; font-weight: 400; color: var(--text); }
.compare-table thead th { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 600; }
.compare-table tr:last-child th, .compare-table tr:last-child td { border-bottom: 0; }
.compare-table .compare-us { background: rgba(139,92,246,.1); color: var(--text); }
.compare-table thead .compare-us { color: var(--accent); }
.compare-table .yes { color: var(--green); font-weight: 700; font-size: 16px; }
.compare-table .no { color: var(--red); opacity: .8; }
.compare-table .mid { color: var(--muted); font-size: 13px; }

/* #19 Features: 6 cards, details/summary (accordion on mobile) */
.bento-grid-6 .bento-card { min-height: 0; }
details.bento-card > summary { list-style: none; cursor: default; display: block; }
details.bento-card > summary::-webkit-details-marker { display: none; }
details.bento-card .bento-icon { margin-bottom: .65rem; }

/* #21 Trust & compliance */
.trust-section { padding: 5rem var(--gutter); border-top: 1px solid var(--border); background: var(--bg2); }
.trust-inner { max-width: var(--max); margin: 0 auto; }
.trust-inner h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(30px, 3.5vw, 42px); line-height: 1.12; margin-bottom: 1.75rem; }
.trust-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.trust-card { background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1.25rem; display: grid; gap: .45rem; align-content: start; }
.trust-card h3 { font-size: 15px; }
.trust-card p { font-size: 13.5px; color: var(--muted); line-height: 1.55; }
.trust-card .trust-src a { font-size: 12.5px; color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }

/* #22 Founder */
.founder-section { padding: 5rem var(--gutter); border-top: 1px solid var(--border); }
.founder-inner { max-width: 960px; margin: 0 auto; display: grid; grid-template-columns: 180px 1fr; gap: 2rem; align-items: start; }
.founder-photo { width: 180px; height: 180px; border-radius: 50%; border: 1px dashed rgba(245,214,138,.6); display: grid; place-items: center; color: #f5d68a; font-size: 13px; background: rgba(245,214,138,.05); }
.founder-h2 { font-family: var(--serif); font-size: 26px !important; font-weight: 400; }
.founder-contact { margin-top: .9rem; font-size: 14.5px; color: var(--muted); }
.founder-contact a { color: var(--accent); }
.founder-legal { margin-top: .4rem; font-size: 13px; color: var(--dim); }

/* Co-founder profile */
.founder-profile .founder-inner {
  max-width: 1080px;
  grid-template-columns: minmax(240px, 360px) minmax(0, 1fr);
  gap: clamp(2.25rem, 5vw, 4.75rem);
  align-items: center;
}
.founder-profile .founder-photo {
  width: 100%;
  max-width: 360px;
  height: auto;
  margin: 0;
  border-radius: 22px;
  border: 1px solid rgba(200, 168, 255, .32);
  background: transparent;
  overflow: hidden;
  box-shadow: 0 22px 50px rgba(0, 0, 0, .32);
  color: inherit;
  display: block;
}
.founder-profile .founder-photo img {
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center 22%;
}
.founder-profile .founder-name {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(36px, 4vw, 52px);
  line-height: 1.05;
  letter-spacing: -.02em;
  margin: 0;
  color: var(--text);
}
.founder-profile .founder-role {
  margin: .75rem 0 0;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--accent);
}
.founder-profile .founder-lead {
  margin: 1.35rem 0 0;
  max-width: 38rem;
  font-size: 18px;
  line-height: 1.65;
  color: var(--text);
}
.founder-profile .founder-body {
  margin: .9rem 0 0;
  max-width: 38rem;
  font-size: 16.5px;
  line-height: 1.7;
  font-weight: 300;
  color: var(--muted);
}
.founder-profile .founder-contact {
  margin-top: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .7rem 1.35rem;
}
.founder-profile .founder-contact-link {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  white-space: nowrap;
  font-size: 14.5px;
  line-height: 1.3;
}
.founder-profile .founder-contact-link .gv-icon { width: 15px; height: 15px; }
.founder-profile .founder-legal {
  margin-top: .85rem;
  font-size: 12px;
  line-height: 1.45;
  color: var(--dim);
}
body.light-mode .founder-profile .founder-photo {
  border-color: rgba(139, 92, 246, .35);
  box-shadow: 0 16px 40px rgba(40, 24, 64, .12);
}

/* #23 testimonials now semantic figure/blockquote */
.testimonials figure { margin: 0; }

/* #25 Setup offer */
.setup-offer {
  display: flex; align-items: center; gap: .9rem; margin: 1.25rem 0 1.75rem; padding: .95rem 1.2rem;
  border: 1px solid rgba(52,211,153,.35); background: var(--green-bg); border-radius: var(--radius-lg); font-size: 15px;
}
.setup-offer .gv-icon-lg { color: var(--green); }
.setup-offer s { color: var(--dim); }
.setup-offer b { color: var(--green); }

/* #28 Final CTA actions */
.final-cta-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; }

/* #30 Footer legal block */
.footer-legal { flex-basis: 100%; order: 3; font-style: normal; font-size: 13px; line-height: 1.6; color: var(--muted); }
.footer-legal a { color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.site-footer .footer-copy { order: 4; }

/* Mobile: Affiliate stays a plain nav link (never blends with CTA) */
@media (max-width: 1024px) {
  .nav-drawer #nav-affiliate,
  .nav-drawer .nav-text-link {
    display: block;
    width: auto;
    max-width: none;
    margin: 0;
    padding: 8px 0;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--text);
    font-weight: 400;
    font-size: 15px;
    line-height: 1.35;
    text-align: left;
  }
  .nav-drawer #nav-affiliate:hover,
  .nav-drawer .nav-text-link:hover {
    color: var(--accent);
    background: transparent;
  }
}

/* #31 Sticky mobile CTA */
.sticky-cta { display: none; }
@media (max-width: 760px) {
  .sticky-cta:not([hidden]) {
    display: flex; gap: .5rem; position: fixed; z-index: 900; left: 0; right: 0; bottom: 0;
    padding: .6rem .75rem calc(.6rem + env(safe-area-inset-bottom));
    background: rgba(8,8,12,.92); backdrop-filter: blur(10px); border-top: 1px solid var(--border2);
  }
  .sticky-cta .btn-primary-lg { flex: 1; text-align: center; padding: 12px 14px; font-size: 15px; }
  .sticky-cta .btn-ghost-lg { padding: 12px 14px; font-size: 14px; }
  body.light-mode .sticky-cta:not([hidden]) { background: rgba(255,255,255,.94); }
  body.has-sticky-cta { padding-bottom: 72px; }
}

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .roi-card { grid-template-columns: 1fr 1fr; }
  .roi-copy { grid-column: 1 / -1; }
  .showcase-grid { grid-template-columns: 1fr; }
  .trust-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  /* Mobile hero: tighter so the primary CTA is visible on the first screen */
  .hero-v2 h1 { font-size: clamp(34px, 9vw, 44px) !important; }
  .hero-actions .btn-primary-lg { flex: 1 1 100%; justify-content: center; }
  .roi-card { grid-template-columns: 1fr; padding: 1.2rem; }
  .roi-field { grid-template-columns: 1fr 84px; }
  .showcase-card { grid-template-columns: 1fr; }
  .showcase-shots img { width: 42%; }
  .trust-grid { grid-template-columns: 1fr; }
  .founder-inner { grid-template-columns: 1fr; }
  .founder-photo { width: 120px; height: 120px; }
  .founder-profile .founder-inner { grid-template-columns: 1fr; align-items: start; gap: 1.75rem; }
  .founder-profile .founder-photo { width: min(100%, 300px); max-width: 300px; height: auto; }
  .founder-profile .founder-contact { flex-direction: column; align-items: flex-start; gap: .6rem; }
  .trust-strip-list { justify-content: flex-start; gap: .55rem 1.2rem; }
  .trust-strip-list li { font-size: 13px; }
  /* #19 accordion on phones */
  details.bento-card > summary { cursor: pointer; display: flex; align-items: center; gap: .75rem; }
  details.bento-card > summary .bento-icon { margin: 0; }
  details.bento-card > summary h3 { margin: 0; flex: 1; }
  details.bento-card > summary::after { content: '+'; font-size: 20px; color: var(--accent); line-height: 1; }
  details.bento-card[open] > summary::after { content: '−'; }
  details.bento-card[open] > p { margin-top: .6rem; }
  .bento-card { padding: .95rem 1.1rem; }
}
@media (max-width: 760px) { body.has-sticky-cta .gv-cookie-settings { bottom: 88px; right: 12px; left: auto; } }


html, body { overflow-x: clip; }

/* ============================================================
   v2 — #38 missed-call text-back card, #44/#45 nav + footer,
   #46 industry links, N1–N14 new SEO pages, C1, G3
   ============================================================ */

/* #38 Missed-call text-back (homepage AI SMS section) + shared SMS thread */
.textback-card {
  display: grid; grid-template-columns: 1.1fr .9fr; gap: 2rem; align-items: center;
  margin: 0 0 2.5rem; padding: 1.75rem; border-radius: 20px;
  border: 1px solid rgba(200,168,255,.28);
  background: radial-gradient(ellipse 70% 90% at 0% 0%, rgba(200,168,255,.12), transparent 70%), var(--bg2);
}
.textback-kicker {
  display: inline-block; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; font-weight: 600;
  color: var(--accent); border: 1px solid rgba(200,168,255,.35); border-radius: 999px; padding: 4px 10px; margin-bottom: .9rem;
}
.textback-copy h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(1.5rem, 2.6vw, 2rem); line-height: 1.15; margin: 0 0 .6rem; }
.textback-copy > p { color: var(--muted); font-weight: 300; line-height: 1.65; margin: 0 0 1rem; max-width: 36rem; }
.textback-points { list-style: none; padding: 0; margin: 0 0 1.1rem; display: grid; gap: .45rem; }
.textback-points li { position: relative; padding-left: 1.5rem; font-size: 14.5px; }
.textback-points li::before { content: '✓'; position: absolute; left: 0; color: var(--green); font-weight: 700; }
.textback-link, .np-more a { color: var(--accent); font-weight: 500; text-decoration: none; }
.textback-link:hover, .np-more a:hover { text-decoration: underline; text-underline-offset: 3px; }
.textback-thread {
  display: flex; flex-direction: column; gap: 8px; padding: 16px 14px; border-radius: 22px;
  border: 1px solid var(--border2); background: var(--bg); box-shadow: 0 24px 60px rgba(0,0,0,.28);
  max-width: 400px; width: 100%; margin-left: auto;
}
.tb-event {
  align-self: center; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--red);
  background: rgba(248,113,113,.08); border: 1px solid rgba(248,113,113,.25); border-radius: 999px; padding: 4px 10px; margin: 2px 0 4px;
}
.tb-event .gv-icon { width: 14px; height: 14px; }
.np-thread .tb-event:not(:first-child) { color: var(--muted); background: transparent; border-color: var(--border); }
.tb-note { margin: 6px 0 0; font-size: 11.5px; color: var(--muted); text-align: center; }
body.light-mode .textback-thread { background: #fff; }
body.light-mode .sms-bubble.sms-in { background: rgba(0,0,0,.05); border-color: rgba(0,0,0,.1); }

/* #46 industry card links */
.vertical-link { display: inline-block; margin-top: .45rem; font-size: 13px; color: var(--accent); text-decoration: none; font-weight: 500; }
.vertical-link:hover { text-decoration: underline; text-underline-offset: 3px; }

/* #44 longer menus (desktop flyouts only — mobile accordion uses display/max-height above) */
@media (min-width: 1025px) {
  .nav-dropdown-menu { max-height: min(70vh, 520px); overflow-y: auto; }
}

/* #45 footer SEO link columns */
.footer-seo {
  flex-basis: 100%; order: 2; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem 2rem;
  padding: 1.5rem 0 .5rem; margin-top: .5rem; border-top: 1px solid var(--border);
}
.footer-seo-col { display: flex; flex-direction: column; gap: .45rem; min-width: 0; }
.footer-seo-title { margin: 0 0 .2rem; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--dim); font-weight: 600; }
.footer-seo a { color: var(--muted); font-size: 13.5px; text-decoration: none; line-height: 1.4; }
.footer-seo a:hover { color: var(--accent); }

/* N1–N14 new pages */
.np-crumbs { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; font-size: 12.5px; color: var(--muted); margin: 0 0 1.1rem; }
.np-crumbs a { color: var(--muted); text-decoration: none; }
.np-crumbs a:hover { color: var(--accent); }
.np-crumbs [aria-current] { color: var(--text); }
.np-crumb-sep { opacity: .5; }
.np-page .product-hero { min-height: 0; padding-top: 7rem; padding-bottom: 3rem; }
.np-page .product-hero h1 { max-width: 24ch; }
.product-hero.is-solo { grid-template-columns: 1fr; }
.product-hero.is-solo .product-hero-copy { max-width: 65rem; }
.product-hero.is-solo h1 { max-width: 30ch; font-size: clamp(2rem, 4vw, 3rem); }
.np-hero-img img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 22px; border: 1px solid var(--border2); box-shadow: 0 30px 80px rgba(0,0,0,.35); display: block; }
.np-meta { font-size: 13px; color: var(--muted); margin: 0; }
.np-sync { display: grid; grid-template-columns: 1fr; gap: 12px; max-width: 420px; margin-left: auto; }
.np-sync-node { border: 1px solid var(--border2); background: var(--bg2); border-radius: 18px; padding: 1.1rem 1.25rem; display: flex; flex-direction: column; gap: 2px; }
.np-sync-node strong { font-family: var(--serif); font-weight: 400; font-size: 1.6rem; }
.np-sync-node small { color: var(--muted); font-size: 13px; }
.np-sync-node.is-greeta { border-color: rgba(200,168,255,.4); background: radial-gradient(ellipse 80% 90% at 0% 0%, rgba(200,168,255,.14), transparent 70%), var(--bg2); }
.np-sync-node.is-greeta strong { color: var(--accent); }
.np-sync-arrows { display: flex; flex-direction: column; gap: 6px; padding: 0 1.25rem; font-size: 13.5px; color: var(--text); }
.np-sync-arrows span { padding: 6px 10px; border-left: 2px solid var(--accent); }
.np-langs { display: flex; flex-direction: column; gap: 10px; max-width: 420px; margin-left: auto; }
.np-lang-bubble { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 16px; border: 1px solid var(--border2); background: var(--bg2); font-size: 14.5px; line-height: 1.45; }
.np-lang-tag { flex: none; font-size: 11px; font-weight: 700; letter-spacing: .06em; color: #120f1a; background: var(--accent); border-radius: 6px; padding: 3px 6px; }
.np-prose { max-width: 57.5rem; }
/* Blog articles: widen with the viewport (~60vw) but never thinner than the site prose rail. */
.np-article-page .product-hero.is-solo .product-hero-copy,
.np-article-page .np-prose.np-article {
  max-width: min(100%, max(57.5rem, 60vw));
}
.np-prose p, .np-prose li { color: var(--muted); font-weight: 300; line-height: 1.75; font-size: 16px; }
.np-prose p { margin: 0 0 1rem; }
.np-prose strong { color: var(--text); font-weight: 500; }
.np-prose a, .np-faq .faq-item a { color: var(--accent); text-underline-offset: 3px; }
.np-article h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(1.5rem, 2.8vw, 2rem); line-height: 1.2; margin: 2.25rem 0 .75rem; max-width: none; }
.np-article h2:first-child { margin-top: 0; }
.np-article ul, .np-article ol { margin: 0 0 1.25rem; padding-left: 1.25rem; display: grid; gap: .5rem; }
.np-article-section { padding-top: 1rem; }
.np-formula {
  font-size: 17px !important; color: var(--text) !important; font-weight: 400 !important; line-height: 1.6;
  border-left: 3px solid var(--accent); background: var(--bg2); border-radius: 0 14px 14px 0; padding: 1rem 1.25rem;
}
.np-example { border: 1px dashed var(--border2); border-radius: 12px; padding: .8rem 1rem; font-size: 14.5px !important; }
.np-example::before { content: 'ℹ︎ '; color: var(--accent); }
.np-note { margin: 0; }
.np-ph-section { padding-top: 0; padding-bottom: 1rem; }
.np-table-wrap, .np-compare { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--border); border-radius: 16px; margin: 0 0 1.25rem; }
.np-table { width: 100%; min-width: 620px; border-collapse: collapse; font-size: 14px; }
.np-table th, .np-table td { padding: .75rem .9rem; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; color: var(--muted); font-weight: 300; }
.np-table thead th { font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--dim); font-weight: 600; }
.np-table tbody th { color: var(--text); font-weight: 500; }
.np-table tr:last-child th, .np-table tr:last-child td { border-bottom: 0; }
.np-compare-table { min-width: 560px; }
.np-compare-table td, .np-compare-table tbody th { text-align: left; font-size: 14px; }
.np-compare-table td { color: var(--muted); }
.np-compare-table td.compare-us { color: var(--text); }
.np-table-note { font-size: 13px; color: var(--muted); margin: 0; }
.np-cards, .np-posts { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
.np-cards a, .np-posts a {
  display: flex; flex-direction: column; gap: .4rem; height: 100%; padding: 1.1rem 1.2rem; border-radius: 16px;
  border: 1px solid var(--border); background: var(--bg2); color: var(--text); text-decoration: none; transition: border-color .2s, transform .2s;
}
.np-cards a:hover, .np-posts a:hover { border-color: rgba(200,168,255,.45); transform: translateY(-2px); }
.np-cards strong { font-weight: 500; }
.np-cards span { font-size: 13.5px; color: var(--muted); line-height: 1.5; }
.np-posts { grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); gap: 18px; }
.np-posts a { padding: 1.6rem; }
.np-posts h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(1.4rem, 2.4vw, 1.8rem); line-height: 1.2; margin: 0; max-width: none; }
.np-posts p { color: var(--muted); font-weight: 300; line-height: 1.6; margin: 0; }
.np-post-kicker { font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); font-weight: 600; }
.np-post-more { margin-top: auto; padding-top: .5rem; color: var(--accent); font-weight: 500; font-size: 14px; }
.np-band-actions { justify-content: center; }
.np-faq { border-top: 0; padding-top: 2rem; }
.np-c1 { margin: 1.5rem 0; padding: 1rem 1.25rem; border: 1px solid rgba(200,168,255,.3); border-radius: 14px; }
.np-c1 h2 { margin-top: 0; }
.np-more { margin: 1.25rem 0 0; }

@media (max-width: 960px) {
  .textback-card { grid-template-columns: 1fr; padding: 1.25rem; }
  .textback-thread { margin: 0 auto; }
  .np-page .product-hero { grid-template-columns: 1fr; padding-top: 6rem; }
  .np-sync, .np-langs { margin: 0 auto; }
  .footer-seo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .np-page .product-hero { padding-top: 5.5rem; gap: 1.75rem; }
  .np-page .product-hero .app-phones-shots { min-height: 420px; }
  .np-prose p, .np-prose li { font-size: 15.5px; }
  .np-posts { grid-template-columns: 1fr; }
}

/* v2: style.css styles every <nav> like the site header — reset for breadcrumbs (N1–N14) and footer links (#45) */
body nav.np-crumbs, body nav.footer-seo, body.light-mode nav.np-crumbs, body.light-mode nav.footer-seo {
  position: static; z-index: auto; min-height: 0; max-width: none; background: none; backdrop-filter: none; -webkit-backdrop-filter: none;
  border-bottom: 0; box-shadow: none;
}
body nav.np-crumbs { display: flex; justify-content: flex-start; padding: 0; }
body nav.footer-seo { display: grid; justify-content: initial; align-items: start; padding: 1.5rem 0 .5rem; }
.np-page .product-hero { padding-top: 2.5rem; }
@media (max-width: 960px) { .np-page .product-hero { padding-top: 2rem; } }
@media (max-width: 760px) { .np-page .product-hero { padding-top: 1.5rem; } }

/* #36b Mobile: long ES/PL benefit labels widened the SMS grid column (content cut off on the right) */
.sms-chat-layout > * { min-width: 0; }
.sms-benefit-list { grid-template-columns: minmax(0, 1fr); }

/* ============================================================
   v3 (10.10.2026)
   ============================================================ */
/* #6 ROI calculator — native spinners hidden, custom −/+ steppers (no overlap on any width) */
.roi-field input[type="number"] { -moz-appearance: textfield; appearance: textfield; }
.roi-field input::-webkit-outer-spin-button,
.roi-field input::-webkit-inner-spin-button { -webkit-appearance: none; appearance: none; margin: 0; display: none; }
.roi-field { grid-template-columns: minmax(0, 1fr) auto; gap: .75rem 1rem; }
.roi-field > label { font-size: 14px; line-height: 1.35; color: var(--muted); cursor: pointer; }
.roi-stepper { display: inline-flex; align-items: stretch; height: 46px; border: 1px solid var(--border2); border-radius: 12px; background: var(--bg); overflow: hidden; }
.roi-stepper:focus-within { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(200,168,255,.25); }
.roi-step { width: 46px; flex: 0 0 46px; border: 0; background: var(--bg3); color: var(--text); font: 500 22px/1 var(--sans); cursor: pointer; touch-action: manipulation; user-select: none; transition: background var(--transition); }
.roi-step:hover { background: rgba(139,92,246,.3); }
.roi-step:active { background: rgba(139,92,246,.5); }
.roi-step:focus-visible { outline: 2px solid var(--accent); outline-offset: -3px; }
.roi-input-wrap { display: flex; align-items: center; justify-content: center; gap: 3px; min-width: 92px; padding: 0 .5rem; }
.roi-field .roi-input { width: 5ch; min-width: 0; padding: 0; border: 0; background: transparent; text-align: center; font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--text); }
.roi-field .roi-input:focus-visible { outline: none; }
.roi-unit { font-size: 15px; font-weight: 600; color: var(--muted); }
body.light-mode .roi-step { background: #efeaf8; color: #1b1824; }
@media (max-width: 760px) {
  .roi-field { grid-template-columns: 1fr; gap: .4rem; }
  .roi-stepper { width: 100%; height: 50px; }
  .roi-step { flex-basis: 56px; width: 56px; }
  .roi-input-wrap { flex: 1; }
}

/* #7 Hear Greeta — chat-style transcript (client right/grey, Greeta left/purple) */
.hear-sample-note { font-size: 12.5px; color: var(--muted); margin: -.25rem 0 .25rem; }
.hear-chat { display: grid; gap: .65rem; }
.hear-msg { display: grid; gap: .2rem; max-width: 88%; transition: opacity .2s ease; }
.hear-msg.is-dimmed { opacity: .42; }
.hear-msg.is-active { opacity: 1; }
.hear-msg.is-active p { box-shadow: 0 0 0 2px var(--accent, #8b5cf6); }
.hear-meta { font-size: 11.5px; color: var(--dim); letter-spacing: .02em; }
.hear-msg p { margin: 0; font-size: 14.5px; line-height: 1.5; padding: .65rem .95rem; border-radius: 18px; overflow-wrap: anywhere; }
.hear-msg-tr {
  display: block;
  margin: .15rem .2rem 0;
  padding: 0 .75rem;
  font-size: 12px;
  line-height: 1.4;
  font-weight: 300;
  color: var(--muted);
}
.hear-msg-client .hear-msg-tr { text-align: left; }
.hear-msg-ai { justify-self: start; }
.hear-msg-ai p { background: linear-gradient(145deg, #7c3aed, #8b5cf6); color: #fff; border-bottom-left-radius: 5px; }
.hear-msg-client { justify-self: end; text-align: right; }
.hear-msg-client p { background: #2b2a36; color: var(--text); border-bottom-right-radius: 5px; text-align: left; }
body.light-mode .hear-msg-client p { background: #e7e4ef; color: #1b1824; }
.hear-transcript .hear-booking-card { margin-top: .5rem; }
.np-transcript { max-width: 780px; margin-top: 1rem; }
.np-transcript-section .np-transcript { background: var(--bg2); }

/* #10 support phone in the contact section */
.contact-phone { margin: .35rem 0 1.1rem; color: var(--muted); font-size: 15px; }
.contact-phone a { color: var(--accent); text-decoration: none; font-weight: 600; }
.contact-phone a:hover { text-decoration: underline; text-underline-offset: 3px; }
.integrations-more { text-align: center; margin: 1.25rem 0 0; }
/* industries hub cards */
.np-industry-cards { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.np-links-section > p { color: var(--muted); max-width: 62ch; }


/* V32-1 ROI steppers: identical width; value centred in a fixed slot; unit in its own fixed slot (never shifts the digits) */
.roi-stepper { width: 208px; justify-self: end; height: 48px; }
.roi-step { width: 46px; flex: 0 0 46px; }
.roi-input-wrap { flex: 1 1 auto; min-width: 0; display: grid; grid-template-columns: minmax(16px, 1fr) 4.6ch minmax(16px, 1fr); align-items: center; gap: 0; padding: 0; }
.roi-field .roi-input { width: 100%; grid-column: 2; grid-row: 1; text-align: center; padding: 0; margin: 0; height: 100%; line-height: 1; font-size: 18px; box-sizing: border-box; }
.roi-unit { line-height: 1; display: block; min-width: 0; }
.roi-unit-pre { grid-column: 1; grid-row: 1; text-align: right; padding-right: 2px; }
.roi-unit-after { grid-column: 3; grid-row: 1; text-align: left; padding-left: 2px; }
.roi-field { align-items: center; }
@media (max-width: 760px) {
  .roi-field { grid-template-columns: 1fr; gap: .4rem; }
  .roi-stepper { width: 100%; justify-self: stretch; height: 50px; }
  .roi-step { width: 56px; flex: 0 0 56px; }
}
/* V32-3 transcript bubbles: never break/ligate/hyphenate inside a word */
.hear-chat p, .sms-real-chat p { hyphens: none; -webkit-hyphens: none; word-break: normal; overflow-wrap: break-word; font-variant-ligatures: none; font-feature-settings: "liga" 0, "clig" 0, "dlig" 0; }
.gv-nb { white-space: nowrap; }
/* V32-5 real SMS conversation */
.sms-real { width: 100%; max-width: 460px; padding: 1rem 1rem 1.05rem; border: 1px solid var(--border2); border-radius: 22px; background: var(--bg2); box-shadow: 0 24px 60px rgba(0,0,0,.25); text-align: left; }
.sms-real-head { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: 0 .2rem .7rem; margin-bottom: .85rem; border-bottom: 1px solid var(--border); font-size: 12px; color: var(--muted); }
.sms-real-head strong { color: var(--text); font-size: 14px; font-weight: 600; }
.sms-real .hear-chat { gap: .6rem; }
.sms-real .hear-msg { max-width: 94%; }
.sms-real .hear-msg p { font-size: 14px; line-height: 1.45; }
.sms-real-note { margin: .85rem 0 0; text-align: center; }
.sms-real-more { margin: .7rem 0 0; text-align: center; font-size: 14px; }
.sms-real-excerpt { margin-left: auto; }
.product-hero-visual .sms-real { margin-left: auto; margin-right: auto; }
.np-c1 .sms-real { margin: 1rem 0 .5rem; }
@media (max-width: 760px) { .sms-real-excerpt { margin: 0 auto; } .sms-real .hear-msg { max-width: 96%; } }
body.light-mode .sms-real { background: #fff; box-shadow: 0 12px 34px rgba(30,20,60,.1); }
.product-hero:has(.sms-real), .np-hero:has(.sms-real) { align-items: center; }


.salon-activate-steps h3 { margin: 0 0 .3rem; font-size: .98rem; font-weight: 500; }

/* Hear Greeta layout lives in the single-column .hear-stack rules above */