/* ==========================================================================
   ReRoot Master Design System
   Single source of truth for all production presentation.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Inter:wght@400;500&display=swap');

/* -------------------------------------------------------------------------- */
/* Tokens                                                                     */
/* -------------------------------------------------------------------------- */

:root {
  /* Color */
  --rr-bg: #FAFAF8;
  --rr-bg-alt: #F2F0EB;
  --rr-surface: #FFFFFF;
  --rr-ink: #1C1C1C;
  --rr-muted: #5A5A5A;
  --rr-navy: #24364B;
  --rr-navy-hover: #1E2D3F;
  --rr-bronze: #8B7355;
  --rr-bronze-hover: #756045;
  --rr-line: rgba(28, 28, 28, 0.08);
  --rr-line-strong: rgba(28, 28, 28, 0.14);
  --rr-on-dark: #FAFAF8;
  --rr-on-dark-muted: rgba(250, 250, 248, 0.82);

  /* Typography roles */
  --rr-font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --rr-font-body: 'Inter', system-ui, -apple-system, sans-serif;

  /* Spacing */
  --rr-space-xs: 10px;
  --rr-space-sm: 20px;
  --rr-space-md: 32px;
  --rr-space-lg: 52px;
  --rr-space-xl: 88px;
  --rr-gap: 18px;
  --rr-gap-lg: 28px;
  --rr-card-pad: 20px;
  --rr-card-pad-lg: 28px;

  /* Layout */
  --rr-max: 1180px;
  --rr-prose: 720px;
  --rr-legal: 760px;
  --rr-header-h: 84px;
  --rr-radius: 10px;
  --rr-radius-lg: 14px;
  --rr-shadow: 0 8px 32px rgba(36, 54, 75, 0.05);
  --rr-shadow-hover: 0 12px 40px rgba(36, 54, 75, 0.08);

  /* Hero overlay - editorial, lighter */
  --rr-hero-overlay: linear-gradient(
    105deg,
    rgba(28, 28, 28, 0.48) 0%,
    rgba(28, 28, 28, 0.24) 52%,
    rgba(28, 28, 28, 0.38) 100%
  );
}

/* -------------------------------------------------------------------------- */
/* Reset & base                                                               */
/* -------------------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }

html {
  font-size: 16px;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: var(--rr-font-body);
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.7;
  color: var(--rr-ink);
  background: var(--rr-bg);
  -webkit-font-smoothing: antialiased;
}

img, video { max-width: 100%; height: auto; display: block; }

a { color: var(--rr-navy); text-decoration: none; }
a:hover, a:focus-visible { color: var(--rr-bronze); }

h1, h2 {
  font-family: var(--rr-font-display);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -0.02em;
  color: var(--rr-ink);
  margin: 0 0 var(--rr-space-sm);
}

h3, h4, h5, h6 {
  font-family: var(--rr-font-body);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: -0.01em;
  color: var(--rr-ink);
  margin: 0 0 var(--rr-space-sm);
}

h1 { font-size: clamp(2.5rem, 6vw, 4.25rem); margin-bottom: var(--rr-space-md); }
h2 { font-size: clamp(1.875rem, 3.8vw, 2.75rem); margin-bottom: var(--rr-space-sm); }
h3 { font-size: clamp(1.125rem, 2vw, 1.375rem); }

p { margin: 0 0 var(--rr-space-sm); color: var(--rr-muted); line-height: 1.72; }
ul, ol { margin: 0 0 var(--rr-space-sm); padding-left: 1.35rem; color: var(--rr-muted); line-height: 1.72; }
li { margin-bottom: 0.65rem; }

strong, b { font-weight: 500; color: var(--rr-ink); }

.muted { color: var(--rr-muted); }

/* -------------------------------------------------------------------------- */
/* Layout                                                                     */
/* -------------------------------------------------------------------------- */

.rr-container,
.content-wrap,
.header-shell,
.footer-inner,
.main-narrow,
.quiz-container,
.plan-doc,
.account-main,
.success-panel,
.restore-card,
.destinations-grid-wrap {
  width: min(100%, var(--rr-max));
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--rr-space-md);
  padding-right: var(--rr-space-md);
}

.rr-section {
  padding-top: var(--rr-space-lg);
  padding-bottom: var(--rr-space-lg);
}

@media (min-width: 901px) {
  .rr-section {
    padding-top: var(--rr-space-xl);
    padding-bottom: var(--rr-space-xl);
  }
}

.section-intro,
.section-header {
  max-width: var(--rr-prose);
  margin-bottom: var(--rr-space-md);
}

.section-intro h2,
.section-header h2 {
  margin-bottom: var(--rr-space-sm);
}

.section-intro .section-lead,
.section-header p {
  margin-top: var(--rr-space-xs);
}

.section-lead {
  font-size: 1.125rem;
  line-height: 1.75;
  max-width: var(--rr-prose);
}

.section-kicker,
.cliff-eyebrow,
.conversion-type-eyebrow {
  display: inline-block;
  font-family: var(--rr-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--rr-bronze);
  margin-bottom: var(--rr-space-sm);
}

.section-intro.centered,
.section-header.centered {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.section-intro.centered .section-lead,
.section-header.centered p {
  margin-left: auto;
  margin-right: auto;
}

/* -------------------------------------------------------------------------- */
/* Header & navigation                                                        */
/* -------------------------------------------------------------------------- */

#site-header.site-header-v1 {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--rr-bg);
  border-bottom: 1px solid var(--rr-line);
}

#site-header .header-shell {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--rr-space-sm);
  min-height: var(--rr-header-h);
  padding-top: 0;
  padding-bottom: 0;
}

#site-header .logo-wordmark {
  font-family: var(--rr-font-body);
  font-size: clamp(1.125rem, 2vw, 1.3125rem);
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: none;
  color: var(--rr-ink);
  line-height: 1;
}

#site-header .site-nav-desktop {
  display: none;
  align-items: center;
  gap: 6px;
}

#site-header .site-nav-desktop a {
  font-family: var(--rr-font-body);
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--rr-muted);
  padding: 10px 16px;
  border-radius: var(--rr-radius);
}

#site-header .site-nav-desktop a:hover,
#site-header .site-nav-desktop a:focus-visible,
#site-header .site-nav-desktop a.active {
  color: var(--rr-ink);
  background: rgba(36, 54, 75, 0.05);
}

#site-header .header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

#site-header .nav-auth {
  display: none;
  align-items: center;
  gap: 10px;
}

#site-header .menu-btn,
#site-header .nav-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 12px 18px;
  border: 1px solid var(--rr-line-strong);
  border-radius: var(--rr-radius);
  background: var(--rr-surface);
  color: var(--rr-ink);
  font-family: var(--rr-font-body);
  font-size: 0.9375rem;
  font-weight: 500;
  cursor: pointer;
}

#site-header .menu-lines {
  position: relative;
  display: inline-block;
  width: 16px;
  height: 10px;
  border-top: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
}

#site-header .menu-lines::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  border-top: 1.5px solid currentColor;
  transform: translateY(-50%);
}

/* Mobile menu - solid, never transparent */
#site-header .rr-mobile-panel {
  display: none;
}

#site-header .rr-mobile-panel.rr-open {
  display: flex;
  position: fixed;
  inset: 0;
  z-index: 2000;
  flex-direction: column;
  gap: var(--rr-space-sm);
  padding: var(--rr-space-md) var(--rr-space-sm);
  background: var(--rr-surface);
  color: var(--rr-ink);
  overflow-y: auto;
}

body.rr-menu-open { overflow: hidden; }

#site-header .rr-mobile-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: var(--rr-space-sm);
  border-bottom: 1px solid var(--rr-line);
}

#site-header .rr-mobile-brand {
  font-family: var(--rr-font-body);
  font-size: 1.125rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--rr-ink);
}

#site-header .rr-mobile-close {
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid var(--rr-line-strong);
  border-radius: var(--rr-radius);
  background: var(--rr-bg);
  color: var(--rr-ink);
  font-family: var(--rr-font-body);
  font-size: 0.9375rem;
  font-weight: 500;
  cursor: pointer;
}

#site-header .rr-mobile-list {
  display: grid;
  gap: 12px;
  padding-top: var(--rr-space-xs);
}

#site-header .rr-mobile-link {
  display: flex;
  align-items: center;
  min-height: 52px;
  padding: 14px 18px;
  border: none;
  border-radius: var(--rr-radius);
  background: var(--rr-bg);
  color: var(--rr-muted);
  font-size: 1rem;
  font-weight: 500;
}

#site-header .rr-mobile-link.rr-active {
  color: var(--rr-ink);
  background: rgba(36, 54, 75, 0.06);
}

#site-header .rr-mobile-panel .nav-auth {
  display: grid;
  gap: 10px;
  margin-top: auto;
  padding-top: var(--rr-space-sm);
  border-top: 1px solid var(--rr-line);
}

#site-header .nav-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 14px 24px;
  border-radius: var(--rr-radius);
  background: var(--rr-navy);
  color: var(--rr-on-dark);
  font-family: var(--rr-font-body);
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  white-space: nowrap;
}

#site-header .nav-cta-btn:hover,
#site-header .nav-cta-btn:focus-visible {
  background: var(--rr-navy-hover);
  color: var(--rr-on-dark);
}

#site-header .nav-auth-link,
#site-header .nav-auth-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 18px;
  border: 1px solid var(--rr-line-strong);
  border-radius: var(--rr-radius);
  background: var(--rr-surface);
  color: var(--rr-ink);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
}

#site-header .nav-plan-pill {
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(139, 115, 85, 0.1);
  color: var(--rr-bronze);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

@media (min-width: 901px) {
  #site-header .site-nav-desktop { display: flex; }
  #site-header .nav-auth { display: flex; }
  #site-header .menu-btn,
  #site-header .nav-toggle { display: none; }
  #site-header .rr-mobile-panel { display: none !important; }
}

/* -------------------------------------------------------------------------- */
/* Footer                                                                     */
/* -------------------------------------------------------------------------- */

#site-footer.site-footer-v1 {
  background: var(--rr-bg-alt);
  border-top: 1px solid var(--rr-line);
  padding: var(--rr-space-xl) var(--rr-space-md) var(--rr-space-lg);
  color: var(--rr-ink);
}

#site-footer .footer-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: var(--rr-space-md);
  margin-bottom: var(--rr-space-md);
}

#site-footer .footer-brand-name {
  font-family: var(--rr-font-body);
  font-size: clamp(1.125rem, 2vw, 1.3125rem);
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: none;
  color: var(--rr-ink);
  margin-bottom: 14px;
}

#site-footer .footer-mission {
  color: var(--rr-muted);
  font-size: 1rem;
  line-height: 1.72;
  max-width: 380px;
}

#site-footer .footer-group-label {
  font-family: var(--rr-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--rr-bronze);
  margin-bottom: 14px;
}

#site-footer .footer-links {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#site-footer .footer-links a {
  color: var(--rr-ink);
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
}

#site-footer .footer-links a:hover { color: var(--rr-bronze); }

#site-footer .footer-bottom {
  border-top: 1px solid var(--rr-line);
  padding-top: var(--rr-space-sm);
}

#site-footer .footer-copy {
  font-size: 0.8125rem;
  color: var(--rr-muted);
  line-height: 1.55;
  margin: 0;
}

@media (max-width: 768px) {
  #site-footer .footer-grid { grid-template-columns: 1fr; }
}

/* -------------------------------------------------------------------------- */
/* Buttons                                                                    */
/* -------------------------------------------------------------------------- */

.btn-primary,
.home-hero-cta-primary,
.btn-plan,
button.btn-primary,
a.btn-primary,
.stripe-checkout.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 52px;
  padding: 14px 28px;
  border: none;
  border-radius: var(--rr-radius);
  background: var(--rr-navy);
  color: var(--rr-on-dark);
  font-family: var(--rr-font-body);
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.2s ease;
}

.btn-secondary,
button.btn-secondary,
a.btn-secondary,
.stripe-checkout.btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 52px;
  padding: 14px 28px;
  border: 1px solid var(--rr-line-strong);
  border-radius: var(--rr-radius);
  background: var(--rr-surface);
  color: var(--rr-ink);
  font-family: var(--rr-font-body);
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  text-decoration: none;
  cursor: pointer;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.btn-primary:hover,
.btn-primary:focus-visible,
.home-hero-cta-primary:hover,
.btn-plan:hover,
button.btn-primary:hover,
a.btn-primary:hover,
.stripe-checkout.btn-primary:hover {
  background: var(--rr-navy-hover);
  color: var(--rr-on-dark);
}

.btn-secondary:hover,
.btn-secondary:focus-visible,
button.btn-secondary:hover,
a.btn-secondary:hover,
.stripe-checkout.btn-secondary:hover {
  border-color: var(--rr-navy);
  background: rgba(36, 54, 75, 0.04);
  color: var(--rr-ink);
}

.btn-block {
  display: flex;
  width: 100%;
}

.cta-button-group,
.cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
}

/* -------------------------------------------------------------------------- */
/* Cards                                                                      */
/* -------------------------------------------------------------------------- */

.rr-card,
.cliff-card,
.experience-form-card,
.experience-result-card,
.locked-card,
.price-card,
.faq-item,
.report-card,
.quiz-container,
.account-card,
.success-panel,
.restore-card,
.conversion-upgrade-card,
.conversion-future-self-card,
.conversion-comparison-scorecard,
.conversion-report-cover,
.conversion-share-card,
.conversion-locked-card,
.conversion-top-match-hero,
.reroot-loading-card {
  background: var(--rr-surface);
  border: 1px solid var(--rr-line);
  border-radius: var(--rr-radius-lg);
  box-shadow: var(--rr-shadow);
  padding: var(--rr-card-pad);
}

@media (min-width: 768px) {
  .rr-card,
  .cliff-card,
  .experience-form-card,
  .experience-result-card,
  .locked-card,
  .price-card,
  .faq-item,
  .report-card,
  .quiz-container,
  .account-card,
  .success-panel,
  .restore-card,
  .conversion-upgrade-card,
  .conversion-future-self-card,
  .conversion-comparison-scorecard,
  .conversion-report-cover,
  .conversion-share-card,
  .conversion-locked-card,
  .conversion-top-match-hero,
  .reroot-loading-card {
    padding: var(--rr-card-pad-lg);
  }
}

.rr-card-grid,
.cliff-card-grid,
.locked-grid,
.experience-form-grid,
.preview-grid,
.pricing-grid,
.pricing-grid-v2,
.faq-grid,
.home-destinations-grid,
.home-types-grid,
.home-plans-teaser {
  display: grid;
  gap: var(--rr-gap);
}

@media (min-width: 768px) {
  .rr-card-grid,
  .cliff-card-grid,
  .locked-grid,
  .preview-grid,
  .pricing-grid,
  .pricing-grid-v2,
  .faq-grid,
  .home-destinations-grid,
  .home-types-grid,
  .home-plans-teaser {
    gap: var(--rr-gap-lg);
  }
}

.price-card.featured,
.price-card-premium,
.premium-annual-card {
  border-color: rgba(139, 115, 85, 0.35);
  box-shadow: var(--rr-shadow-hover);
}

.price-badge,
.preview-badge {
  display: inline-block;
  font-family: var(--rr-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rr-bronze);
  margin-bottom: 10px;
}

.price {
  font-family: var(--rr-font-body);
  font-size: 2.125rem;
  font-weight: 500;
  color: var(--rr-ink);
  letter-spacing: -0.02em;
}
.price span { font-size: 1rem; color: var(--rr-muted); }

/* -------------------------------------------------------------------------- */
/* Forms                                                                      */
/* -------------------------------------------------------------------------- */

input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="number"],
select,
textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--rr-line-strong);
  border-radius: var(--rr-radius);
  background: var(--rr-surface);
  color: var(--rr-ink);
  font-family: var(--rr-font-body);
  font-size: 1rem;
  line-height: 1.5;
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--rr-navy);
  box-shadow: 0 0 0 3px rgba(36, 54, 75, 0.12);
}

label {
  display: block;
  margin-bottom: 6px;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--rr-ink);
}

.form-grid {
  display: grid;
  gap: var(--rr-space-sm);
  max-width: 560px;
  margin: 0 auto;
}

.form-status-message.is-error,
.form-status.is-error {
  color: #9b2c2c;
  background: rgba(155, 44, 44, 0.06);
  border: 1px solid rgba(155, 44, 44, 0.15);
  border-radius: var(--rr-radius);
  padding: 12px;
}

.form-status-message.is-success,
.form-status.is-success {
  color: var(--rr-navy);
  background: rgba(36, 54, 75, 0.06);
  border: 1px solid rgba(36, 54, 75, 0.12);
  border-radius: var(--rr-radius);
  padding: 12px;
}

/* -------------------------------------------------------------------------- */
/* Hero - edge to edge                                                        */
/* -------------------------------------------------------------------------- */

.home-hero {
  position: relative;
  width: 100%;
  min-height: clamp(620px, 92vh, 900px);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: var(--rr-navy);
}

.home-hero__media {
  position: absolute;
  inset: 0;
}

.home-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-hero__overlay {
  position: absolute;
  inset: 0;
  background: var(--rr-hero-overlay);
}

.home-hero__content {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: var(--rr-max);
  margin: 0 auto;
  padding: calc(var(--rr-header-h) + 56px) var(--rr-space-md) var(--rr-space-xl);
}

.home-hero__content h1 {
  color: var(--rr-on-dark);
  max-width: 12ch;
  font-weight: 500;
  font-size: clamp(2.75rem, 7vw, 4.75rem);
  line-height: 1.06;
  margin-bottom: var(--rr-space-md);
}

.home-hero__content p {
  color: var(--rr-on-dark-muted);
  max-width: 540px;
  font-size: 1.125rem;
  line-height: 1.75;
  margin-bottom: var(--rr-space-lg);
}

.home-hero .btn-primary {
  background: var(--rr-surface);
  color: var(--rr-navy);
}

.home-hero .btn-primary:hover {
  background: var(--rr-on-dark);
  color: var(--rr-navy);
}

/* Editorial page hero (JS-injected inner pages) */
.editorial-page-hero {
  width: 100%;
}

.rr-hero-shell,
.rr-hero-frame {
  width: 100%;
}

.rr-hero-frame {
  position: relative;
  min-height: clamp(400px, 58vh, 560px);
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}

.editorial-page-hero-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.editorial-page-hero-overlay {
  position: absolute;
  inset: 0;
  background: var(--rr-hero-overlay);
}

.editorial-page-hero-inner {
  position: relative;
  z-index: 1;
  width: min(100%, var(--rr-max));
  margin: 0 auto;
  padding: calc(var(--rr-header-h) + 40px) var(--rr-space-md) var(--rr-space-lg);
}

.editorial-hero-eyebrow {
  font-family: var(--rr-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(250, 250, 248, 0.75);
  margin: 0 0 var(--rr-space-sm);
}

.editorial-hero-title {
  font-family: var(--rr-font-display);
  font-weight: 500;
  font-size: clamp(2.25rem, 5.5vw, 3.75rem);
  line-height: 1.08;
  letter-spacing: -0.02em;
  color: var(--rr-on-dark);
  margin: 0 0 var(--rr-space-sm);
}

.editorial-hero-subtitle {
  font-family: var(--rr-font-body);
  font-size: 1.125rem;
  line-height: 1.75;
  color: var(--rr-on-dark-muted);
  max-width: var(--rr-prose);
  margin: 0 0 var(--rr-space-md);
}

.editorial-hero-cta-primary {
  background: var(--rr-surface);
  color: var(--rr-navy);
}

.editorial-hero-cta-primary:hover {
  background: var(--rr-on-dark);
  color: var(--rr-navy);
}

.editorial-hero-cta-secondary {
  border: 1px solid rgba(250, 250, 248, 0.45);
  background: transparent;
  color: var(--rr-on-dark);
}

.editorial-hero-cta-secondary:hover {
  background: rgba(250, 250, 248, 0.12);
  color: var(--rr-on-dark);
}

/* Static editorial hero shell (fallback) */
.editorial-hero-shell {
  background: var(--rr-bg);
  border-bottom: 1px solid var(--rr-line);
  padding: calc(var(--rr-header-h) + var(--rr-space-lg)) var(--rr-space-md) var(--rr-space-lg);
}

.editorial-hero-shell .editorial-hero-title {
  color: var(--rr-ink);
}

.editorial-hero-shell .editorial-hero-subtitle {
  color: var(--rr-muted);
}

.editorial-hero-shell .editorial-hero-eyebrow {
  color: var(--rr-bronze);
}

/* -------------------------------------------------------------------------- */
/* Homepage sections                                                          */
/* -------------------------------------------------------------------------- */

.home-thrive-grid {
  display: grid;
  gap: var(--rr-gap);
}

@media (min-width: 768px) {
  .home-thrive-grid { grid-template-columns: repeat(2, 1fr); }
}

.experience-form-card {
  padding: var(--rr-card-pad-lg);
}

.experience-form-grid {
  gap: var(--rr-gap);
}

@media (min-width: 768px) {
  .experience-form-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--rr-gap-lg);
  }
}

@media (min-width: 901px) {
  .experience-form-grid { grid-template-columns: repeat(4, 1fr); }
}

.experience-field {
  padding: var(--rr-space-md);
  background: var(--rr-bg);
  border: none;
  border-radius: var(--rr-radius);
}

.experience-field span {
  display: block;
  font-family: var(--rr-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rr-bronze);
  margin-bottom: 10px;
}

.experience-field strong {
  display: block;
  font-weight: 500;
  color: var(--rr-ink);
  font-size: 1rem;
  line-height: 1.45;
}

.experience-result-grid {
  display: grid;
  gap: var(--rr-gap-lg);
  align-items: stretch;
}

@media (min-width: 901px) {
  .experience-result-grid { grid-template-columns: 1fr 1fr; }
}

.experience-result-image {
  position: relative;
  border-radius: var(--rr-radius-lg);
  overflow: hidden;
  min-height: 360px;
}

.experience-result-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  min-height: 360px;
}

.experience-score {
  position: absolute;
  bottom: var(--rr-space-sm);
  left: var(--rr-space-sm);
  padding: 10px 16px;
  border-radius: 999px;
  background: var(--rr-navy);
  color: var(--rr-on-dark);
  font-family: var(--rr-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.home-destination-card,
.home-type-card {
  overflow: hidden;
  padding: 0;
  border: none;
  box-shadow: var(--rr-shadow);
}

.home-destination-card__img,
.home-type-card__img {
  aspect-ratio: 16 / 10;
  overflow: hidden;
}

.home-destination-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-destination-card__body,
.home-type-card__body {
  padding: var(--rr-card-pad-lg);
}

.home-destination-card__body h3,
.home-type-card__body h3 {
  margin-bottom: var(--rr-space-xs);
}

.home-destination-card__body p,
.home-type-card__body p {
  margin-bottom: var(--rr-space-md);
  font-size: 1rem;
  line-height: 1.72;
}

.home-destination-card__meta {
  font-family: var(--rr-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rr-bronze);
  margin-bottom: 8px;
}

.experience-result-card {
  padding: var(--rr-card-pad-lg);
}

.experience-result-card h3 {
  margin-bottom: var(--rr-space-sm);
}

.experience-result-card p,
.experience-result-card ul {
  margin-bottom: var(--rr-space-md);
}

.home-plan-teaser {
  text-align: center;
}

.home-plan-teaser .price {
  margin: 12px 0;
}

.home-faq .faq-item h3 {
  font-size: 1.125rem;
  margin-bottom: 8px;
}

.disclaimer-inline,
.home-entertainment-note,
.pricing-legal-notice,
.digital-product-notice {
  font-size: 0.875rem;
  color: var(--rr-muted);
  line-height: 1.6;
}

/* -------------------------------------------------------------------------- */
/* Results page - premium product feel                                        */
/* -------------------------------------------------------------------------- */

body.results-page {
  background: var(--rr-bg);
}

.results-page .main-narrow {
  padding-top: var(--rr-space-lg);
  padding-bottom: var(--rr-space-xl);
}

.conversion-type-reveal {
  background: var(--rr-navy);
  color: var(--rr-on-dark);
  border-radius: var(--rr-radius-lg);
  padding: var(--rr-space-xl) var(--rr-space-md);
  margin-bottom: var(--rr-space-xl);
  text-align: center;
  border: none;
  box-shadow: var(--rr-shadow-hover);
}

.conversion-type-reveal .conversion-type-eyebrow {
  color: rgba(250, 250, 248, 0.65);
}

.conversion-type-name {
  display: block;
  font-family: var(--rr-font-display);
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 500;
  color: var(--rr-on-dark);
  margin: 12px 0;
}

.conversion-type-tagline,
.conversion-type-body {
  color: var(--rr-on-dark-muted);
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}

.conversion-type-reveal strong,
.conversion-type-reveal b {
  color: var(--rr-on-dark);
}

.conversion-trait-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin-top: var(--rr-space-md);
}

.conversion-trait-chip {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  min-width: 148px;
  padding: 14px 18px;
  border-radius: var(--rr-radius);
  background: rgba(250, 250, 248, 0.1);
  border: 1px solid rgba(250, 250, 248, 0.18);
  color: var(--rr-on-dark-muted);
  text-align: left;
}

.conversion-trait-chip-label {
  font-family: var(--rr-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(250, 250, 248, 0.72);
}

.conversion-trait-chip-value {
  font-family: var(--rr-font-body);
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.45;
  color: var(--rr-on-dark);
}

.conversion-trait-icon {
  font-size: 1rem;
  line-height: 1;
  margin-bottom: 2px;
}

.conversion-section-title {
  font-family: var(--rr-font-display);
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  color: var(--rr-ink);
  margin-bottom: var(--rr-space-sm);
  margin-top: var(--rr-space-lg);
}

.conversion-city-comparison,
.conversion-life-upgrade,
.conversion-future-self,
.conversion-top-match,
.conversion-thrive-section,
.conversion-report-preview {
  margin-bottom: var(--rr-space-xl);
}

.conversion-section-lead {
  color: var(--rr-muted);
  margin-bottom: var(--rr-space-md);
  max-width: var(--rr-prose);
  font-size: 1.0625rem;
  line-height: 1.72;
}

.conversion-top-match-hero {
  position: relative;
  padding: 0;
  overflow: hidden;
  min-height: 420px;
  border: none;
}

.conversion-top-match-hero img {
  width: 100%;
  height: 100%;
  min-height: 420px;
  object-fit: cover;
}

.conversion-top-match-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: var(--rr-card-pad-lg);
  background: linear-gradient(180deg, transparent 15%, rgba(28, 28, 28, 0.78) 100%);
}

.conversion-top-match-overlay * {
  color: var(--rr-on-dark);
}

.conversion-match-rank {
  font-family: var(--rr-font-display);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 500;
  margin: 0 0 6px;
}

.conversion-match-score {
  font-family: var(--rr-font-body);
  font-size: 1.125rem;
  font-weight: 500;
  color: var(--rr-on-dark-muted);
}

.conversion-top-match-meta {
  font-family: var(--rr-font-body);
  font-size: 1rem;
  color: var(--rr-on-dark-muted);
  margin: 8px 0 0;
}

.conversion-top-match-body {
  padding: var(--rr-card-pad-lg);
}

.conversion-top-match-body h3 {
  font-size: clamp(1.25rem, 2.5vw, 1.625rem);
  margin-bottom: var(--rr-space-sm);
}

.conversion-why-fit {
  font-size: 1.0625rem;
  line-height: 1.72;
  margin-bottom: var(--rr-space-md);
}

.conversion-lifestyle-highlights {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: var(--rr-space-md);
}

.conversion-highlight-tag {
  display: inline-flex;
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--rr-bg);
  color: var(--rr-ink);
  font-size: 0.875rem;
  font-weight: 500;
}

.conversion-comparison-scorecard,
.conversion-upgrade-card,
.conversion-future-self-card,
.conversion-locked-card,
.conversion-report-cover,
.conversion-share-card {
  margin-bottom: var(--rr-space-md);
}

.conversion-score-row {
  display: grid;
  gap: var(--rr-space-sm);
}

@media (min-width: 640px) {
  .conversion-score-row { grid-template-columns: 1fr auto 1fr; align-items: center; }
}

.conversion-score-block {
  padding: var(--rr-card-pad);
  background: var(--rr-bg);
  border-radius: var(--rr-radius);
  text-align: center;
}

@media (min-width: 768px) {
  .conversion-score-block { padding: var(--rr-card-pad-lg); }
}

.conversion-score-label {
  display: block;
  font-family: var(--rr-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rr-bronze);
  margin-bottom: 8px;
}

.conversion-score-city {
  display: block;
  font-family: var(--rr-font-body);
  font-size: clamp(1.25rem, 2.5vw, 1.625rem);
  font-weight: 500;
  color: var(--rr-ink);
  margin: 8px 0;
  line-height: 1.25;
}

.conversion-score-value {
  color: var(--rr-muted);
  font-size: 1rem;
  line-height: 1.5;
}

.conversion-score-vs {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  color: var(--rr-bronze);
}

.conversion-improvement-pill {
  display: inline-flex;
  margin-top: var(--rr-space-md);
  padding: 10px 18px;
  border-radius: 999px;
  background: rgba(36, 54, 75, 0.08);
  color: var(--rr-navy);
  font-size: 0.9375rem;
  font-weight: 500;
}

.conversion-comparison-scorecard {
  text-align: center;
}

.conversion-upgrade-card,
.conversion-future-self-card {
  font-size: 1.0625rem;
  line-height: 1.72;
}

.conversion-future-self-card p {
  margin: 0;
  font-size: 1.0625rem;
  line-height: 1.72;
}

.conversion-thrive-grid {
  display: grid;
  gap: var(--rr-gap-lg);
}

@media (min-width: 640px) {
  .conversion-thrive-grid { grid-template-columns: repeat(2, 1fr); }
}

.conversion-thrive-card {
  padding: var(--rr-card-pad-lg);
  background: var(--rr-surface);
  border-radius: var(--rr-radius-lg);
  box-shadow: var(--rr-shadow);
  border: none;
}

.conversion-thrive-label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rr-bronze);
  margin-bottom: 8px;
}

.conversion-thrive-value {
  display: block;
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--rr-ink);
}

.conversion-locked-grid {
  display: grid;
  gap: var(--rr-gap-lg);
}

@media (min-width: 640px) {
  .conversion-locked-grid { grid-template-columns: repeat(2, 1fr); }
}

.conversion-locked-card {
  position: relative;
  overflow: hidden;
  min-height: 200px;
  padding: var(--rr-card-pad-lg);
}

.conversion-locked-card.has-image {
  padding: 0;
  min-height: 240px;
}

.conversion-locked-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  filter: brightness(0.55);
}

.conversion-locked-content {
  position: relative;
  z-index: 1;
  padding: var(--rr-card-pad-lg);
  color: var(--rr-on-dark);
}

.conversion-locked-badge {
  display: inline-block;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rr-on-dark-muted);
  margin-bottom: 8px;
}

.conversion-report-title {
  font-family: var(--rr-font-display);
  font-size: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: var(--rr-space-sm);
}

.conversion-report-label {
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rr-bronze);
  margin-bottom: 8px;
}

.conversion-report-meta,
.conversion-report-includes {
  font-size: 1rem;
  line-height: 1.72;
}

.conversion-share-card {
  text-align: center;
}

.conversion-share-type {
  font-family: var(--rr-font-display);
  font-size: clamp(1.5rem, 3vw, 2rem);
  color: var(--rr-ink);
  margin: 8px 0;
}

.conversion-share-city,
.conversion-share-score {
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--rr-muted);
}

.conversion-final-cta {
  background: var(--rr-navy);
  color: var(--rr-on-dark);
  border-radius: var(--rr-radius-lg);
  padding: var(--rr-space-xl) var(--rr-space-md);
  text-align: center;
  margin: var(--rr-space-xl) 0;
}

.conversion-final-cta h2,
.conversion-final-cta p {
  color: var(--rr-on-dark-muted);
}

.conversion-final-cta h2 {
  color: var(--rr-on-dark);
  margin-bottom: var(--rr-space-sm);
}

.conversion-final-cta .btn-primary {
  margin-top: var(--rr-space-md);
}

.conversion-upgrade-row {
  margin-bottom: 14px;
}

.conversion-upgrade-head {
  display: flex;
  justify-content: space-between;
  margin-bottom: 6px;
  font-size: 0.875rem;
  color: var(--rr-ink);
}

.conversion-upgrade-track {
  height: 4px;
  background: var(--rr-line);
  border-radius: 999px;
  overflow: hidden;
}

.conversion-upgrade-fill {
  height: 100%;
  background: var(--rr-navy);
}

.conversion-locked-card {
  opacity: 0.92;
}

.conversion-locked-card .locked-label {
  font-size: 0.6875rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rr-bronze);
}

.city-grid,
.destinations-grid,
#matches-grid {
  display: grid;
  gap: var(--rr-gap-lg);
}

@media (min-width: 640px) {
  .city-grid, .destinations-grid, #matches-grid { grid-template-columns: repeat(2, 1fr); }
}

.city-card,
.destination-card {
  overflow: hidden;
  padding: 0;
  border-radius: var(--rr-radius-lg);
  border: 1px solid var(--rr-line);
  background: var(--rr-surface);
  box-shadow: var(--rr-shadow);
}

.city-card img,
.destination-card img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.city-card .city-card-body,
.destination-card .destination-card-body {
  padding: var(--rr-space-sm) var(--rr-space-md) var(--rr-space-md);
}

/* -------------------------------------------------------------------------- */
/* Quiz                                                                       */
/* -------------------------------------------------------------------------- */

.quiz-shell {
  padding-top: var(--rr-space-lg);
  padding-bottom: var(--rr-space-xl);
}

.progress {
  height: 3px;
  background: var(--rr-line);
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: var(--rr-space-md);
}

.progress-fill {
  height: 100%;
  background: var(--rr-navy);
  transition: width 0.3s ease;
}

.question {
  font-family: var(--rr-font-display);
  font-size: clamp(1.35rem, 3vw, 1.75rem);
  color: var(--rr-ink);
  margin-bottom: var(--rr-space-md);
}

.options .option,
#options button {
  display: block;
  width: 100%;
  text-align: left;
  min-height: 48px;
  padding: 14px 16px;
  margin-bottom: 10px;
  border: 1px solid var(--rr-line);
  border-radius: var(--rr-radius);
  background: var(--rr-surface);
  color: var(--rr-ink);
  font-family: var(--rr-font-body);
  font-size: 1rem;
  cursor: pointer;
}

.options .option:hover,
.options .option.selected,
#options button:hover,
#options button.selected {
  border-color: var(--rr-navy);
  background: rgba(36, 54, 75, 0.04);
}

/* -------------------------------------------------------------------------- */
/* Cities library                                                             */
/* -------------------------------------------------------------------------- */

.city-journal-list {
  display: grid;
  gap: var(--rr-gap-lg);
}

@media (min-width: 768px) {
  .city-journal-list { grid-template-columns: repeat(2, 1fr); }
}

.city-journal-entry {
  display: flex;
  flex-direction: column;
  background: var(--rr-surface);
  border-radius: var(--rr-radius-lg);
  overflow: hidden;
  box-shadow: var(--rr-shadow);
  border: none;
}

.city-journal-media {
  aspect-ratio: 16 / 10;
  overflow: hidden;
}

.city-journal-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.35s ease;
}

.city-journal-entry:hover .city-journal-media img {
  transform: scale(1.02);
}

.city-journal-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: var(--rr-card-pad-lg);
  gap: 0;
}

.city-journal-country {
  font-family: var(--rr-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rr-bronze);
  margin: 0 0 10px;
}

.city-journal-name {
  font-family: var(--rr-font-body);
  font-size: clamp(1.25rem, 2.2vw, 1.5rem);
  font-weight: 500;
  color: var(--rr-ink);
  margin: 0 0 var(--rr-space-sm);
  line-height: 1.25;
}

.city-journal-desc {
  font-size: 1rem;
  line-height: 1.72;
  color: var(--rr-muted);
  margin: 0 0 var(--rr-space-md);
  flex: 1;
}

.city-journal-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: var(--rr-space-md);
}

.city-chip {
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--rr-bg);
  color: var(--rr-ink);
  font-family: var(--rr-font-body);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.3;
}

.city-journal-link {
  align-self: flex-start;
  margin-top: auto;
}

/* -------------------------------------------------------------------------- */
/* Legal & policy                                                             */
/* -------------------------------------------------------------------------- */

.legal-page {
  max-width: var(--rr-legal);
  margin: 0 auto;
  padding: var(--rr-space-lg) var(--rr-space-md) var(--rr-space-xl);
}

.legal-page h1 { margin-bottom: var(--rr-space-md); }
.legal-page h2 {
  margin-top: var(--rr-space-lg);
  font-size: 1.35rem;
}

/* -------------------------------------------------------------------------- */
/* Loading overlay                                                            */
/* -------------------------------------------------------------------------- */

.reroot-loading-overlay {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(250, 250, 248, 0.94);
}

.reroot-loading-overlay.is-hidden { display: none; }

.reroot-loading-spinner {
  width: 36px;
  height: 36px;
  margin: 0 auto 16px;
  border: 2px solid var(--rr-line);
  border-top-color: var(--rr-navy);
  border-radius: 50%;
  animation: rr-spin 0.8s linear infinite;
}

@keyframes rr-spin { to { transform: rotate(360deg); } }

.reroot-loading-title {
  font-family: var(--rr-font-display);
  font-size: 1.35rem;
  color: var(--rr-ink);
  margin-bottom: 8px;
}

.reroot-loading-copy { color: var(--rr-muted); font-size: 0.9375rem; }

/* -------------------------------------------------------------------------- */
/* Utilities & legacy class bridges                                           */
/* -------------------------------------------------------------------------- */

.section-v1,
.home-section,
.section-block,
.pricing-section,
.editorial-content-shell,
.destinations-library,
.main-form {
  padding-top: var(--rr-space-lg);
  padding-bottom: var(--rr-space-lg);
}

@media (min-width: 901px) {
  .section-v1,
  .home-section,
  .section-block,
  .pricing-section,
  .editorial-content-shell,
  .destinations-library,
  .main-form {
    padding-top: var(--rr-space-xl);
    padding-bottom: var(--rr-space-xl);
  }
}

.bg-alt { background: var(--rr-bg-alt); }

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

/* Hide deprecated logo images */
#site-header .logo-mark,
#site-header .logo-image,
#site-header .header-brand img { display: none; }

/* Ask ReRoot page */
.ask-shell { max-width: var(--rr-max); margin: 0 auto; padding: var(--rr-space-lg) var(--rr-space-md); }

/* Calculator */
.calculator-panel { max-width: var(--rr-max); margin: 0 auto; padding: var(--rr-space-lg) var(--rr-space-md); }

/* Account */
.account-main { padding-top: var(--rr-space-lg); padding-bottom: var(--rr-space-xl); }

/* Premium grid */
@media (min-width: 768px) {
  .home-destinations-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 901px) {
  .pricing-grid-v2 { grid-template-columns: repeat(3, 1fr); }
  .cliff-card-grid { grid-template-columns: repeat(3, 1fr); }
  .faq-grid { grid-template-columns: repeat(2, 1fr); }
  .home-types-grid { grid-template-columns: repeat(2, 1fr); }
  .home-plans-teaser { grid-template-columns: repeat(3, 1fr); }
  .locked-grid { grid-template-columns: repeat(3, 1fr); }
  .preview-grid { grid-template-columns: repeat(2, 1fr); }
}

.locked-card {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 120px;
}

.locked-card span {
  font-family: var(--rr-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rr-bronze);
}

.conversion-score-note {
  font-size: 0.8125rem;
  color: var(--rr-muted);
  margin-top: 12px;
}

.conversion-free-only,
.conversion-paid-only { /* visibility controlled by JS */ }

.personality { margin: var(--rr-space-lg) 0; }

.results-bottom-actions { margin-top: var(--rr-space-lg); }

.results-destinations-intro {
  margin: var(--rr-space-xl) 0 var(--rr-space-md);
}

.results-destinations-intro h2 { margin-bottom: var(--rr-space-sm); }

.results-destinations-intro p {
  font-size: 1.0625rem;
  line-height: 1.72;
}

/* About page - editorial journal */
.about-editorial-page .section-intro {
  margin-bottom: var(--rr-space-lg);
}

.about-editorial-page .section-intro h2 {
  max-width: 820px;
}

.home-bg-soft {
  background: var(--rr-bg-alt);
}

.editorial-split-panels {
  display: grid;
  gap: var(--rr-gap-lg);
}

@media (min-width: 768px) {
  .editorial-split-panels { grid-template-columns: repeat(2, 1fr); }
}

.editorial-life-panel {
  background: var(--rr-surface);
  border-radius: var(--rr-radius-lg);
  box-shadow: var(--rr-shadow);
  padding: var(--rr-card-pad-lg);
  border: none;
}

.cliff-card-body {
  padding: var(--rr-card-pad-lg);
}

.cliff-card {
  border: none;
}

.cliff-card .cliff-card-body h3 {
  margin-bottom: var(--rr-space-sm);
}

.cliff-card .cliff-card-body p {
  margin-bottom: 0;
  font-size: 1rem;
  line-height: 1.72;
}

.home-steps-grid,
.editorial-steps {
  display: grid;
  gap: var(--rr-gap-lg);
}

@media (min-width: 768px) {
  .home-steps-grid,
  .editorial-steps { grid-template-columns: repeat(3, 1fr); }
}

.home-step-card,
.editorial-step {
  display: flex;
  gap: var(--rr-space-sm);
  padding: var(--rr-card-pad-lg);
  background: var(--rr-surface);
  border-radius: var(--rr-radius-lg);
  box-shadow: var(--rr-shadow);
  border: none;
}

.home-step-num {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--rr-navy);
  color: var(--rr-on-dark);
  font-family: var(--rr-font-body);
  font-size: 0.9375rem;
  font-weight: 500;
}

.sample-profile-card,
.editorial-profile-block {
  display: grid;
  gap: var(--rr-space-md);
  padding: var(--rr-card-pad-lg);
  background: var(--rr-surface);
  border-radius: var(--rr-radius-lg);
  box-shadow: var(--rr-shadow);
  border: none;
}

@media (min-width: 768px) {
  .sample-profile-card,
  .editorial-profile-block { grid-template-columns: 220px 1fr; align-items: start; }
}

.sample-profile-type {
  display: block;
  font-family: var(--rr-font-body);
  font-size: 1.25rem;
  font-weight: 500;
  color: var(--rr-ink);
  line-height: 1.35;
  margin-top: 8px;
}

.sample-profile-card p,
.editorial-profile-block p {
  font-size: 1.0625rem;
  line-height: 1.75;
  margin-bottom: var(--rr-space-sm);
}

.home-final-cta,
.cliff-final-cta {
  background: var(--rr-navy);
  color: var(--rr-on-dark);
  padding: var(--rr-space-xl) var(--rr-space-md);
  text-align: center;
}

.home-final-cta h2,
.cliff-final-cta h2 {
  color: var(--rr-on-dark);
  margin-bottom: var(--rr-space-sm);
}

.home-final-cta p,
.cliff-final-cta p {
  color: var(--rr-on-dark-muted);
  font-size: 1.0625rem;
  line-height: 1.72;
  max-width: var(--rr-prose);
  margin: 0 auto var(--rr-space-md);
}

.home-final-cta .cliff-eyebrow,
.cliff-final-cta .cliff-eyebrow {
  color: rgba(250, 250, 248, 0.65);
}

.home-final-cta .btn-primary,
.cliff-final-cta .btn-primary {
  background: var(--rr-surface);
  color: var(--rr-navy);
}

/* Premium / membership page */
.pricing-section {
  padding-bottom: var(--rr-space-xl);
}

.premium-benefits-section .section-header,
.premium-preview-section .section-header,
.premium-membership-options .section-header,
.premium-faq-section .section-header {
  margin-bottom: var(--rr-space-lg);
  max-width: var(--rr-prose);
}

.premium-benefits-section .section-header p,
.premium-membership-options .section-header p {
  font-size: 1.0625rem;
  line-height: 1.72;
}

.price-card ul {
  margin: var(--rr-space-md) 0;
  padding-left: 1.25rem;
}

.price-card li {
  font-size: 1rem;
  line-height: 1.65;
  margin-bottom: 0.75rem;
}

.price-sub {
  font-size: 1rem;
  line-height: 1.65;
  margin-bottom: var(--rr-space-sm);
}

.pricing-legal-notice {
  margin-bottom: var(--rr-space-lg);
  font-size: 0.9375rem;
  line-height: 1.65;
  max-width: var(--rr-prose);
}

.premium-preview-actions {
  margin-top: var(--rr-space-md);
}

.report-card {
  margin-top: var(--rr-space-xl);
  padding: var(--rr-card-pad-lg);
}

.report-card h2 {
  margin-bottom: var(--rr-space-sm);
}

.faq-item {
  padding: var(--rr-card-pad-lg);
  border: none;
}

.faq-item h3 {
  margin-bottom: var(--rr-space-xs);
}

.faq-item p {
  margin: 0;
  font-size: 1rem;
  line-height: 1.72;
}

.home-plan-teaser {
  padding: var(--rr-card-pad-lg);
}

.home-type-card__body {
  padding: var(--rr-card-pad-lg);
}

/* Mobile generous spacing */
@media (max-width: 480px) {
  :root {
    --rr-space-md: 24px;
    --rr-space-lg: 40px;
    --rr-space-xl: 64px;
    --rr-gap: 18px;
    --rr-card-pad: 20px;
  }

  .rr-container,
  .content-wrap,
  .header-shell,
  .footer-inner,
  .main-narrow,
  .quiz-container,
  .plan-doc,
  .account-main,
  .success-panel,
  .restore-card,
  .destinations-grid-wrap {
    padding-left: 20px;
    padding-right: 20px;
  }

  #site-header .site-nav-desktop { display: none; }
  #site-header .nav-auth { display: none; }
  #site-header .menu-btn,
  #site-header .nav-toggle { display: inline-flex; }

  .home-hero__content h1 {
    max-width: 100%;
    font-size: clamp(2.25rem, 10vw, 3rem);
  }

  .editorial-page-hero-inner {
    padding-bottom: var(--rr-space-lg);
  }

  .editorial-hero-title {
    font-size: clamp(2rem, 9vw, 2.75rem);
  }

  .city-journal-body,
  .cliff-card-body,
  .price-card,
  .faq-item {
    padding: var(--rr-card-pad);
  }

  .cta-button-group,
  .cta-row {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .cta-button-group .btn-primary,
  .cta-button-group .btn-secondary,
  .cta-row .btn-primary,
  .cta-row .btn-secondary {
    width: 100%;
  }

  .conversion-type-reveal {
    padding: var(--rr-space-lg) var(--rr-space-sm);
  }

  .home-step-card,
  .editorial-step {
    flex-direction: column;
  }
}

body.results-page .main-narrow {
  padding-top: var(--rr-space-lg);
  padding-bottom: var(--rr-space-xl);
}

/* -------------------------------------------------------------------------- */
/* Shared utility aliases                                                     */
/* -------------------------------------------------------------------------- */

.glass-card {
  background: var(--rr-surface);
  border: none;
  border-radius: var(--rr-radius-lg);
  box-shadow: var(--rr-shadow);
  padding: var(--rr-card-pad-lg);
}

.btn-dark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 14px 28px;
  border: none;
  border-radius: var(--rr-radius);
  background: var(--rr-ink);
  color: var(--rr-on-dark);
  font-family: var(--rr-font-body);
  font-size: 0.9375rem;
  font-weight: 500;
  cursor: pointer;
}

.btn-dark:hover,
.btn-dark:focus-visible {
  background: #111;
  color: var(--rr-on-dark);
}

/* -------------------------------------------------------------------------- */
/* City detail page                                                           */
/* -------------------------------------------------------------------------- */

.city-detail-shell {
  padding: 0;
}

.city-detail-hero {
  position: relative;
  width: 100%;
  min-height: clamp(480px, 72vh, 720px);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: var(--rr-navy);
}

.city-detail-hero__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.city-detail-hero__overlay {
  position: absolute;
  inset: 0;
  background: var(--rr-hero-overlay);
}

.city-detail-hero__content {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: calc(var(--rr-header-h) + 40px) var(--rr-space-md) var(--rr-space-xl);
}

.city-detail-country {
  font-family: var(--rr-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(250, 250, 248, 0.75);
  margin: 0 0 12px;
}

.city-detail-name {
  font-family: var(--rr-font-display);
  font-size: clamp(2.5rem, 6vw, 4rem);
  font-weight: 500;
  line-height: 1.06;
  color: var(--rr-on-dark);
  margin: 0 0 var(--rr-space-sm);
}

.city-detail-vibe {
  font-size: 1.125rem;
  line-height: 1.65;
  color: var(--rr-on-dark-muted);
  margin: 0 0 var(--rr-space-sm);
}

.city-detail-lead {
  max-width: 640px;
  font-size: 1.0625rem;
  line-height: 1.72;
  color: var(--rr-on-dark-muted);
  margin: 0 0 var(--rr-space-md);
}

.city-detail-actions {
  margin-top: var(--rr-space-sm);
}

.city-detail-body {
  padding-top: var(--rr-space-lg);
  padding-bottom: var(--rr-space-xl);
}

.city-detail-signals {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--rr-gap);
  margin-bottom: var(--rr-space-lg);
}

.city-detail-signal {
  padding: var(--rr-card-pad);
  background: var(--rr-surface);
  border-radius: var(--rr-radius-lg);
  box-shadow: var(--rr-shadow);
}

.city-detail-signal span {
  display: block;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rr-bronze);
  margin-bottom: 8px;
}

.city-detail-signal strong {
  display: block;
  font-family: var(--rr-font-body);
  font-size: 1rem;
  font-weight: 500;
  color: var(--rr-ink);
  line-height: 1.4;
}

.city-detail-summary {
  margin-bottom: var(--rr-space-lg);
}

.city-detail-match {
  margin-bottom: var(--rr-space-lg);
  border-left: 3px solid var(--rr-bronze);
}

.city-detail-grid {
  display: grid;
  gap: var(--rr-gap-lg);
}

.city-detail-card h2 {
  font-family: var(--rr-font-body);
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 500;
  margin-bottom: var(--rr-space-sm);
}

.city-detail-card p,
.city-detail-card li {
  font-size: 1rem;
  line-height: 1.72;
}

.city-detail-list {
  margin: 0;
  padding-left: 1.25rem;
}

.city-detail-list li {
  margin-bottom: 0.65rem;
}

.city-detail-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.city-saturday-grid p {
  margin-bottom: var(--rr-space-sm);
}

.city-saturday-label {
  display: inline-block;
  min-width: 88px;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rr-bronze);
}

.city-detail-related {
  margin-top: var(--rr-space-xl);
  padding-top: var(--rr-space-lg);
  border-top: 1px solid var(--rr-line);
}

.city-related-grid {
  display: grid;
  gap: var(--rr-gap-lg);
}

@media (min-width: 640px) {
  .city-related-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 901px) {
  .city-related-grid { grid-template-columns: repeat(3, 1fr); }
}

.city-related-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: var(--rr-card-pad-lg);
  background: var(--rr-surface);
  border-radius: var(--rr-radius-lg);
  box-shadow: var(--rr-shadow);
  text-decoration: none;
  color: var(--rr-ink);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

a.city-related-card:hover {
  box-shadow: var(--rr-shadow-hover);
  transform: translateY(-2px);
  color: var(--rr-ink);
}

.city-related-name {
  font-family: var(--rr-font-body);
  font-size: 1.125rem;
  font-weight: 500;
}

.city-related-country {
  font-size: 0.875rem;
  color: var(--rr-muted);
}

.city-detail-empty {
  padding: var(--rr-space-xl) var(--rr-space-md);
  text-align: center;
}

.city-detail-disclaimer {
  margin-top: var(--rr-space-lg);
}

/* -------------------------------------------------------------------------- */
/* Account page                                                               */
/* -------------------------------------------------------------------------- */

.account-main .content-wrap {
  display: grid;
  gap: var(--rr-gap-lg);
}

.account-card {
  padding: var(--rr-card-pad-lg);
  border: none;
}

.account-card h3 {
  margin-bottom: var(--rr-space-sm);
}

.account-empty-note,
.account-welcome,
.account-plan-line,
.account-delete-intro,
.account-delete-note {
  font-size: 1rem;
  line-height: 1.72;
  margin-bottom: var(--rr-space-sm);
}

.auth-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: var(--rr-space-md) 0;
}

.auth-tab {
  min-height: 44px;
  padding: 10px 18px;
  border: 1px solid var(--rr-line-strong);
  border-radius: var(--rr-radius);
  background: var(--rr-bg);
  color: var(--rr-muted);
  font-family: var(--rr-font-body);
  font-size: 0.9375rem;
  font-weight: 500;
  cursor: pointer;
}

.auth-tab.is-active {
  background: var(--rr-surface);
  color: var(--rr-ink);
  border-color: var(--rr-navy);
}

.auth-panel {
  margin-top: var(--rr-space-sm);
}

.account-form {
  display: grid;
  gap: var(--rr-space-sm);
  max-width: 480px;
}

.account-form label {
  font-size: 0.9375rem;
  margin-bottom: 8px;
}

.account-status {
  margin-top: var(--rr-space-sm);
  font-size: 0.9375rem;
  line-height: 1.65;
}

.account-status.is-success { color: var(--rr-navy); }
.account-status.is-error { color: #9b2c2c; }

.account-actions {
  margin: var(--rr-space-md) 0;
}

.account-saved-section {
  margin-top: var(--rr-space-md);
  padding-top: var(--rr-space-md);
  border-top: 1px solid var(--rr-line);
}

.account-delete-card {
  margin-top: var(--rr-space-sm);
}

.btn-delete-account {
  min-height: 48px;
  padding: 12px 20px;
  border: 1px solid rgba(155, 44, 44, 0.35);
  border-radius: var(--rr-radius);
  background: rgba(155, 44, 44, 0.06);
  color: #9b2c2c;
  font-family: var(--rr-font-body);
  font-size: 0.9375rem;
  font-weight: 500;
  cursor: pointer;
}

.account-delete-modal {
  position: fixed;
  inset: 0;
  z-index: 4000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--rr-space-md);
}

.account-delete-modal[hidden] { display: none; }

.account-delete-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(28, 28, 28, 0.45);
}

.account-delete-modal-panel {
  position: relative;
  z-index: 1;
  width: min(100%, 520px);
  padding: var(--rr-card-pad-lg);
  background: var(--rr-surface);
  border-radius: var(--rr-radius-lg);
  box-shadow: var(--rr-shadow-hover);
}

.account-delete-modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
  border: none;
  background: transparent;
  font-size: 1.5rem;
  color: var(--rr-muted);
  cursor: pointer;
}

.account-delete-modal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: var(--rr-space-md);
}

.home-disclaimer-line {
  font-size: 0.9375rem;
  color: var(--rr-muted);
  line-height: 1.65;
}

/* -------------------------------------------------------------------------- */
/* Ask ReRoot page                                                            */
/* -------------------------------------------------------------------------- */

.ask-page {
  padding: var(--rr-space-lg) var(--rr-space-md) var(--rr-space-xl);
}

.ask-reroot-card {
  background: var(--rr-surface);
  border: none;
  border-radius: var(--rr-radius-lg);
  box-shadow: var(--rr-shadow);
  overflow: hidden;
}

.ask-reroot-page-card {
  max-width: var(--rr-max);
  margin: 0 auto;
}

.ask-reroot-card-head {
  padding: var(--rr-card-pad-lg);
  background: var(--rr-bg);
  border-bottom: 1px solid var(--rr-line);
}

.ask-reroot-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.ask-reroot-title {
  margin: 0;
  font-family: var(--rr-font-body);
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
  font-weight: 500;
  color: var(--rr-ink);
}

.ask-premium-badge {
  display: inline-flex;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(139, 115, 85, 0.1);
  color: var(--rr-bronze);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.ask-reroot-lead {
  margin: 0;
  font-size: 1rem;
  line-height: 1.72;
  color: var(--rr-muted);
  max-width: 62ch;
}

.ask-reroot-panel {
  padding: var(--rr-card-pad-lg);
}

.ask-input-label {
  display: block;
  margin-bottom: 8px;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--rr-ink);
}

.ask-reroot-input {
  width: 100%;
  min-height: 120px;
  padding: 16px 18px;
  border-radius: var(--rr-radius);
  border: 1px solid var(--rr-line-strong);
  background: var(--rr-surface);
  color: var(--rr-ink);
  font-family: var(--rr-font-body);
  font-size: 1rem;
  line-height: 1.65;
  resize: vertical;
}

.ask-reroot-input:focus {
  outline: none;
  border-color: var(--rr-navy);
  box-shadow: 0 0 0 3px rgba(36, 54, 75, 0.12);
}

.ask-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.ask-chip,
.ask-example-btn {
  appearance: none;
  border: 1px solid var(--rr-line-strong);
  background: var(--rr-bg);
  color: var(--rr-ink);
  border-radius: 999px;
  padding: 10px 14px;
  font-family: var(--rr-font-body);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.35;
  cursor: pointer;
  text-align: left;
}

.ask-chip:hover,
.ask-example-btn:hover {
  border-color: var(--rr-navy);
  background: rgba(36, 54, 75, 0.04);
}

.ask-reroot-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: var(--rr-space-md);
}

.ask-usage-note {
  font-size: 0.9375rem;
  color: var(--rr-muted);
}

.ask-reroot-status {
  min-height: 1.25rem;
  margin-top: 12px;
  font-size: 0.9375rem;
  color: var(--rr-bronze);
}

.ask-reroot-answer {
  display: none;
  margin-top: var(--rr-space-md);
  padding: var(--rr-card-pad-lg);
  border-radius: var(--rr-radius-lg);
  background: var(--rr-bg);
}

.ask-reroot-answer.is-visible { display: block; }

.ask-answer-block + .ask-answer-block {
  margin-top: var(--rr-space-md);
  padding-top: var(--rr-space-md);
  border-top: 1px solid var(--rr-line);
}

.ask-answer-block h3 {
  margin: 0 0 8px;
  font-family: var(--rr-font-body);
  font-size: 1.0625rem;
  font-weight: 500;
  color: var(--rr-ink);
}

.ask-answer-block p,
.ask-answer-block li {
  font-size: 1rem;
  line-height: 1.72;
  color: var(--rr-muted);
}

.ask-answer-note {
  background: var(--rr-surface);
  border-radius: var(--rr-radius);
  padding: var(--rr-space-sm);
}

.ask-disclaimer {
  margin: var(--rr-space-md) 0 0;
  padding-top: var(--rr-space-sm);
  border-top: 1px solid var(--rr-line);
  font-size: 0.875rem;
  line-height: 1.65;
  color: var(--rr-muted);
}

.ask-reroot-upsell,
.ask-quiz-note {
  margin-top: var(--rr-space-md);
  padding: var(--rr-card-pad);
  border-radius: var(--rr-radius-lg);
  background: var(--rr-bg);
}

.ask-example-list {
  list-style: none;
  padding: 0;
  display: grid;
  gap: 10px;
  margin: 0;
}

.ask-example-btn { width: 100%; }

/* -------------------------------------------------------------------------- */
/* Calculator page                                                            */
/* -------------------------------------------------------------------------- */

.calculator-page {
  max-width: var(--rr-max);
  margin: 0 auto;
  padding: var(--rr-space-lg) var(--rr-space-md) var(--rr-space-xl);
}

.calculator-intro {
  margin-bottom: var(--rr-space-lg);
  max-width: var(--rr-prose);
}

.calculator-eyebrow {
  font-family: var(--rr-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--rr-bronze);
  margin-bottom: var(--rr-space-sm);
}

.calculator-intro h1 {
  margin-bottom: var(--rr-space-sm);
}

.calculator-subtitle {
  font-size: 1.0625rem;
  line-height: 1.72;
  color: var(--rr-muted);
}

.calculator-lock-card,
.calculator-form,
.calculator-results {
  padding: var(--rr-card-pad-lg);
  background: var(--rr-surface);
  border-radius: var(--rr-radius-lg);
  box-shadow: var(--rr-shadow);
  border: none;
  margin-bottom: var(--rr-space-lg);
}

.calculator-lock-card {
  text-align: center;
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}

.calculator-lock-icon {
  font-size: 2rem;
  margin-bottom: var(--rr-space-sm);
}

.calculator-lock-copy,
.calculator-secondary-link {
  font-size: 1rem;
  line-height: 1.72;
  color: var(--rr-muted);
  margin-bottom: var(--rr-space-md);
}

.calculator-form h2 {
  font-family: var(--rr-font-body);
  font-size: 1.25rem;
  font-weight: 500;
  margin-bottom: var(--rr-space-md);
}

.calculator-form {
  display: grid;
  gap: var(--rr-space-sm);
}

.calc-field label {
  font-size: 0.9375rem;
  margin-bottom: 8px;
}

.calc-hint {
  margin: 6px 0 0;
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--rr-muted);
}

.calculator-footer-disclaimer {
  margin-top: var(--rr-space-md);
}

/* -------------------------------------------------------------------------- */
/* Plan page                                                                  */
/* -------------------------------------------------------------------------- */

@media print {
  .no-print { display: none !important; }
  body { background: #fff; }
  .plan-section { break-inside: avoid; page-break-inside: avoid; }
}

.plan-doc {
  padding-top: var(--rr-space-lg);
  padding-bottom: var(--rr-space-xl);
}

.plan-hero,
.plan-section {
  padding: var(--rr-space-lg) 0;
  border-top: 1px solid var(--rr-line);
}

.plan-hero {
  border-top: none;
  padding-top: var(--rr-space-md);
}

.plan-hero h1 {
  margin-bottom: var(--rr-space-sm);
}

.plan-section h2 {
  margin-bottom: var(--rr-space-sm);
}

.plan-section p,
.plan-section li {
  font-size: 1rem;
  line-height: 1.72;
}

.plan-city-row {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: var(--rr-space-sm);
  padding: var(--rr-space-md) 0;
  border-bottom: 1px solid var(--rr-line);
  align-items: start;
}

.plan-city-row:last-child { border-bottom: none; }

.plan-rank {
  width: 38px;
  height: 38px;
  border: 1px solid var(--rr-line-strong);
  border-radius: 999px;
  display: grid;
  place-items: center;
  color: var(--rr-bronze);
  font-family: var(--rr-font-body);
  font-weight: 500;
  font-size: 0.875rem;
}

.fit-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: var(--rr-gap);
}

.fit-item {
  padding: var(--rr-card-pad);
  background: var(--rr-bg);
  border-radius: var(--rr-radius);
}

.fit-item strong {
  display: block;
  margin-bottom: 6px;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rr-bronze);
}

.pros-cons-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--rr-gap-lg);
}

.plan-gate {
  text-align: center;
  padding: var(--rr-space-xl) 0;
  max-width: var(--rr-prose);
  margin: 0 auto;
}

.plan-gate-link {
  margin-top: var(--rr-space-md);
}

.plan-gate-copy {
  max-width: 480px;
  margin: 0.75rem auto 1.25rem;
}

.plan-actions {
  margin-top: var(--rr-space-lg);
}

.success-steps {
  padding-left: 1.25rem;
  line-height: 1.72;
}

.success-steps li {
  margin-bottom: 0.65rem;
}

.premium-success-panel h1 {
  margin-bottom: var(--rr-space-sm);
}

/* -------------------------------------------------------------------------- */
/* Restore & success pages                                                    */
/* -------------------------------------------------------------------------- */

.restore-main,
.main-form {
  padding-top: var(--rr-space-lg);
  padding-bottom: var(--rr-space-xl);
}

.restore-card h1 {
  margin-bottom: var(--rr-space-sm);
}

.restore-card h2 {
  font-family: var(--rr-font-body);
  font-size: 1.25rem;
  font-weight: 500;
  margin: var(--rr-space-lg) 0 var(--rr-space-sm);
}

.restore-card p,
.restore-card li {
  font-size: 1rem;
  line-height: 1.72;
}

.restore-card ul {
  padding-left: 1.25rem;
  margin-bottom: var(--rr-space-md);
}

.restore-card code {
  font-size: 0.875rem;
  word-break: break-all;
}

.success-panel {
  padding: var(--rr-card-pad-lg);
  border: none;
}

.success-panel h1 {
  margin-bottom: var(--rr-space-sm);
}

.contact-alt-line {
  text-align: center;
  margin-top: var(--rr-space-md);
  color: var(--rr-muted);
  font-size: 1rem;
  line-height: 1.65;
}

.support-unlock-page {
  max-width: var(--rr-prose);
  margin: var(--rr-space-xl) auto;
  padding: var(--rr-space-md);
  text-align: center;
  font-size: 1rem;
  line-height: 1.72;
}

@media (max-width: 640px) {
  .pros-cons-grid { grid-template-columns: 1fr; }
  .plan-city-row { grid-template-columns: 1fr; }
  .city-detail-signals { grid-template-columns: 1fr 1fr; }
  .ask-reroot-card-head,
  .ask-reroot-panel { padding: var(--rr-card-pad); }
  .ask-reroot-actions { flex-direction: column; align-items: stretch; }
  .ask-reroot-submit { width: 100%; }
}

/* -------------------------------------------------------------------------- */
/* Ask ReRoot visibility - homepage, premium, results, account                */
/* -------------------------------------------------------------------------- */

.home-ask-section {
  background: var(--rr-bg-alt);
}

.home-ask-section .section-intro {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.home-ask-prompts,
.premium-ask-prompts {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin: var(--rr-space-md) auto var(--rr-space-lg);
  max-width: 900px;
}

.ask-feature-chip {
  display: inline-flex;
  align-items: center;
  padding: 11px 16px;
  border-radius: 999px;
  border: 1px solid var(--rr-line-strong);
  background: var(--rr-surface);
  color: var(--rr-ink);
  font-size: 0.9375rem;
  line-height: 1.45;
}

.premium-ask-feature {
  margin: var(--rr-space-xl) 0;
  padding: var(--rr-space-lg) var(--rr-card-pad-lg);
  background: var(--rr-bg-alt);
  border-radius: var(--rr-radius-lg);
}

.premium-ask-feature .section-header {
  max-width: 720px;
  margin-bottom: var(--rr-space-md);
}

.premium-ask-actions {
  margin-top: var(--rr-space-md);
}

.results-ask-promo {
  margin: var(--rr-space-lg) 0;
  padding: var(--rr-card-pad-lg);
}

.results-ask-promo .conversion-section-title {
  margin-bottom: var(--rr-space-xs);
}

.results-ask-promo-note {
  margin: var(--rr-space-sm) 0 var(--rr-space-md);
  font-size: 0.9375rem;
  color: var(--rr-bronze);
  line-height: 1.65;
}

.results-ask-promo-actions {
  margin-top: var(--rr-space-sm);
}

.account-premium-tools {
  margin-top: var(--rr-space-md);
  padding: var(--rr-card-pad-lg);
}

.account-premium-tools h3 {
  margin-bottom: var(--rr-space-xs);
}

.account-tools-list {
  margin: 0 0 var(--rr-space-md);
  padding-left: 1.25rem;
  color: var(--rr-muted);
  line-height: 1.75;
}

.account-tools-actions {
  margin-top: var(--rr-space-sm);
}

.ask-page-inner {
  padding-top: var(--rr-space-md);
  padding-bottom: var(--rr-space-lg);
}

.ask-page .ask-reroot-page-card {
  margin-top: var(--rr-space-sm);
}

@media (max-width: 640px) {
  .home-ask-prompts,
  .premium-ask-prompts {
    gap: 10px;
    margin-bottom: var(--rr-space-md);
  }

  .ask-feature-chip {
    font-size: 0.875rem;
    padding: 10px 14px;
  }

  .premium-ask-feature {
    padding: var(--rr-card-pad);
    margin: var(--rr-space-lg) 0;
  }

  .results-ask-promo {
    padding: var(--rr-card-pad);
  }

  .results-ask-promo-actions,
  .account-tools-actions,
  .premium-ask-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .results-ask-promo-actions .btn-primary,
  .results-ask-promo-actions .btn-secondary,
  .account-tools-actions .btn-primary,
  .account-tools-actions .btn-secondary,
  .premium-ask-actions .btn-primary,
  .premium-ask-actions .btn-secondary {
    width: 100%;
    text-align: center;
  }
}