:root {
  /* Brand Color Palette */
  --color-bg-main: #FFF4F8;
  --color-bg-cream: #FFF9F1;
  --color-primary: #FF5FA2;
  --color-cta: #E7357A;
  --color-deep-rose: #B51F5D;
  --color-blush: #FFD8E8;
  --color-pale-pink: #FFEAF2;
  --color-text-dark: #211D21;
  --color-text-gray: #746B72;
  --color-teal: #5AC6B8;
  --color-white: #FFFFFF;

  /* Typography */
  --font-heading: 'Fraunces', serif;
  --font-body: 'Inter', sans-serif;
  
  /* Shadows */
  --shadow-soft: 0 4px 20px rgba(255, 95, 162, 0.08);
  --shadow-float: 0 10px 30px rgba(231, 53, 122, 0.15);
  --shadow-card: 0 8px 16px rgba(0, 0, 0, 0.04);
  --shadow-btn: 0 4px 14px rgba(231, 53, 122, 0.4);

  /* Transitions */
  --transition-smooth: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  --transition-fast: 0.15s ease;
  
  /* Radii */
  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --radius-xl: 2rem;
  --radius-pill: 9999px;
  --radius-blob-1: 60% 40% 30% 70% / 60% 30% 70% 40%;
  --radius-blob-2: 30% 60% 70% 40% / 50% 60% 30% 60%;

  /* Mobile safe area */
  --safe-area-bottom: env(safe-area-inset-bottom, 0px);
}

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  -webkit-tap-highlight-color: transparent;
}

html, body {
  max-width: 100vw;
  overflow-x: clip;
  font-family: var(--font-body);
  background-color: var(--color-bg-main);
  color: var(--color-text-dark);
  line-height: 1.6;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color: var(--color-text-dark);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--transition-fast);
}

button {
  font-family: inherit;
  cursor: pointer;
  border: none;
  background: none;
}

img {
  max-width: 100%;
  height: auto;
}

/* Utilities */
.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.25rem;
}

@media (min-width: 768px) {
  .container {
    padding: 0 1.5rem;
  }
}

.text-center { text-align: center; }
.text-primary { color: var(--color-primary); }
.text-cta { color: var(--color-cta); }
.text-deep { color: var(--color-deep-rose); }

.bgCream { background-color: var(--color-bg-cream); }
.bgPalePink { background-color: var(--color-pale-pink); }
.bgLight { background-color: var(--color-white); }

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.875rem 1.5rem;
  font-weight: 600;
  font-size: 1rem;
  border-radius: var(--radius-pill);
  transition: all var(--transition-smooth);
  text-decoration: none;
  min-height: 48px;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .btn {
    padding: 0.875rem 2rem;
    font-size: 1.125rem;
  }
}

.btn-primary {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-cta) 100%);
  color: var(--color-white);
  box-shadow: var(--shadow-btn);
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.btn-primary:hover, .btn-primary:active {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 8px 20px rgba(231, 53, 122, 0.5);
  background: linear-gradient(135deg, #ff71ae 0%, #f04488 100%);
  color: white;
}

.btn-secondary {
  background-color: var(--color-white);
  color: var(--color-cta);
  border: 2px solid var(--color-blush);
  box-shadow: var(--shadow-card);
}

.btn-secondary:hover, .btn-secondary:active {
  border-color: var(--color-cta);
  background-color: var(--color-pale-pink);
  transform: translateY(-2px);
  color: var(--color-cta);
}

.btn-large {
  padding: 1rem 1.75rem;
  font-size: 1.0625rem;
}

@media (min-width: 768px) {
  .btn-large {
    padding: 1.25rem 2.5rem;
    font-size: 1.25rem;
  }
}

/* UI Elements */
.glass-card {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid var(--color-white);
  box-shadow: var(--shadow-soft);
  border-radius: var(--radius-lg);
}

/* Animations */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(15px); }
  to { opacity: 1; transform: translateY(0); }
}

.animate-fade-in {
  animation: fadeIn 0.8s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}

/* Mobile sticky CTA */
.mobile-sticky-cta {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.97);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  padding: 0.75rem 1.25rem;
  padding-bottom: calc(0.75rem + var(--safe-area-bottom));
  box-shadow: 0 -4px 20px rgba(231, 53, 122, 0.12);
  z-index: 100;
  border-top: 1px solid var(--color-blush);
}

.mobile-sticky-cta-inner {
  display: flex;
  gap: 0.75rem;
  max-width: 500px;
  margin: 0 auto;
}

.mobile-sticky-cta .btn {
  flex: 1;
  padding: 0.75rem 0.875rem;
  font-size: 0.9375rem;
}

@media (max-width: 768px) {
  .mobile-sticky-cta {
    display: block;
  }
  body {
    padding-bottom: calc(76px + var(--safe-area-bottom));
  }
}

/* Header */
.header {
  position: sticky;
  top: 0;
  z-index: 50;
  padding: 0.875rem 0;
  background: rgba(255, 255, 255, 0.97);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--color-blush);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}
@media (min-width: 768px) {
  .header { padding: 1rem 0; }
}

.header-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.logo {
  position: relative;
  z-index: 100;
  height: 40px;
  width: 140px;
  display: flex;
  align-items: center;
}
@media (min-width: 992px) {
  .logo { height: 50px; width: 180px; }
}

.logo img {
  position: absolute;
  top: -20px;
  left: 0;
  width: 180px;
  max-width: none;
  max-height: none;
  filter: drop-shadow(0 10px 15px rgba(231, 53, 122, 0.25));
  transition: transform var(--transition-smooth);
  transform-origin: top left;
}
@media (min-width: 992px) {
  .logo img { width: 230px; top: -28px; }
}
.logo img:hover { transform: scale(1.02); }

/* Desktop nav */
.nav { display: none; }
@media (min-width: 992px) {
  .nav {
    display: flex;
    align-items: center;
  }
  .nav ul {
    display: flex;
    gap: 2rem;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
  }
}
.nav a {
  font-weight: 500;
  color: var(--color-text-dark);
}
.nav a:hover { color: var(--color-cta); }

.desktop-actions { display: none !important; }
@media (min-width: 992px) {
  .desktop-actions { display: flex !important; }
}

.mobile-actions { display: flex !important; }
@media (min-width: 992px) {
  .mobile-actions { display: none !important; }
}

/* Mobile Call Button */
.mobileCallBtn {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-cta) 100%);
  color: var(--color-white);
  font-weight: 700;
  font-size: 0.875rem;
  padding: 0.5rem 1rem;
  border-radius: var(--radius-pill);
  text-decoration: none;
  box-shadow: var(--shadow-btn);
  min-height: 40px;
}

/* Hamburger */
.hamburger {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  border-radius: var(--radius-sm);
  transition: background var(--transition-fast);
}
.hamburger:hover { background: var(--color-pale-pink); }
.hamburgerLine {
  width: 22px;
  height: 2px;
  background: var(--color-deep-rose);
  border-radius: 2px;
  transition: all var(--transition-smooth);
  transform-origin: center;
}
.hamburgerOpen .hamburgerLine:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburgerOpen .hamburgerLine:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hamburgerOpen .hamburgerLine:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile Menu */
.mobile-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: rgba(255, 255, 255, 0.98);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--color-blush);
  box-shadow: 0 8px 30px rgba(231, 53, 122, 0.12);
  padding: 1rem 0 1.5rem 0;
  animation: slideDown 0.2s ease forwards;
}
.mobile-menu.is-active { display: block; }
@keyframes slideDown {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}
.mobile-menu ul {
  list-style: none;
  padding: 0 1.25rem;
}
.mobile-menu li { border-bottom: 1px solid var(--color-blush); }
.mobile-menu li:last-child { border-bottom: none; }
.mobile-menu a {
  display: block;
  padding: 0.875rem 0;
  font-weight: 600;
  color: var(--color-text-dark);
  font-size: 1.0625rem;
}
.mobile-menu a:hover, .mobile-menu a:active { color: var(--color-cta); }
.mobile-menu .btn {
  margin: 1rem 1.25rem 0 1.25rem;
  width: calc(100% - 2.5rem);
}

/* Sections */
.section { padding: 3.5rem 0; }
@media (min-width: 768px) { .section { padding: 6rem 0; } }

.sectionHeader {
  text-align: center;
  max-width: 600px;
  margin: 0 auto 2.5rem auto;
}
@media (min-width: 768px) { .sectionHeader { margin: 0 auto 4rem auto; } }

.sectionHeader h2 {
  font-size: 2rem;
  margin-bottom: 0.75rem;
}
@media (min-width: 480px) { .sectionHeader h2 { font-size: 2.5rem; } }
@media (min-width: 768px) { .sectionHeader h2 { font-size: 3rem; margin-bottom: 1rem; } }

.sectionHeader p {
  font-size: 1rem;
  color: var(--color-text-gray);
}
@media (min-width: 768px) { .sectionHeader p { font-size: 1.125rem; } }

/* Hero */
.heroSection {
  position: relative;
  padding: 3rem 0 4rem 0;
  overflow: hidden;
}
@media (min-width: 768px) { .heroSection { padding: 6rem 0 8rem 0; } }

.heroContainer {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  align-items: center;
}
.heroContent, .heroImageWrapper {
  min-width: 0; /* Prevents flex/grid blowouts from large content */
}
@media (min-width: 768px) {
  .heroContainer { grid-template-columns: 1.1fr 0.9fr; gap: 3rem; }
  .heroContent { grid-column: 1; }
  .heroImageWrapper { grid-column: 2; order: unset; }
}
@media (min-width: 992px) {
  .heroContainer { grid-template-columns: 1.1fr 0.9fr; gap: 4rem; }
}

.eyebrow {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-deep-rose);
  margin-bottom: 0.875rem;
  padding: 0.25rem 0.875rem;
  background-color: rgba(181, 31, 93, 0.1);
  border-radius: var(--radius-pill);
}
@media (min-width: 768px) { .eyebrow { font-size: 0.875rem; margin-bottom: 1rem; padding: 0.25rem 1rem; } }

.headline { font-size: 2.75rem; margin-bottom: 1.125rem; line-height: 1.1; }
@media (min-width: 480px) { .headline { font-size: 3.25rem; } }
@media (min-width: 768px) { .headline { font-size: 4rem; margin-bottom: 1.5rem; } }
@media (min-width: 992px) { .headline { font-size: 4.5rem; } }

.subheadline { font-size: 1.0625rem; color: var(--color-text-gray); margin-bottom: 1.25rem; line-height: 1.7; margin-left: auto; margin-right: auto; }
@media (min-width: 768px) { .subheadline { font-size: 1.25rem; margin-bottom: 1.5rem; max-width: 90%; } }

.trustLine { font-size: 0.875rem; font-weight: 600; color: var(--color-text-dark); margin-bottom: 2rem; line-height: 2; }
@media (min-width: 768px) { .trustLine { font-size: 0.95rem; margin-bottom: 2.5rem; } }

.ctaButtons { display: flex; gap: 0.75rem; flex-wrap: wrap; }
@media (max-width: 400px) {
  .ctaButtons { flex-direction: column; }
  .ctaButtons .btn { width: 100%; text-align: center; }
}

.heroImageWrapper { position: relative; order: 2; }
@media (min-width: 992px) { .heroImageWrapper { order: unset; } }

.imageCollage { position: relative; width: 100%; height: 280px; }
@media (min-width: 480px) { .imageCollage { height: 340px; } }
@media (min-width: 768px) { .imageCollage { height: 420px; } }
@media (min-width: 992px) { .imageCollage { height: 500px; } }

.mainImage {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-float);
}

.floatingCard {
  position: absolute;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 0.625rem 0.875rem;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-soft);
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border: 1px solid var(--color-white);
}
@media (min-width: 768px) { .floatingCard { padding: 1rem; gap: 0.75rem; } }

.floatingCard strong { display: block; font-size: 0.75rem; color: var(--color-deep-rose); }
.floatingCard p { font-size: 0.7rem; color: var(--color-text-gray); margin: 0; }
@media (min-width: 768px) {
  .floatingCard strong { font-size: 0.9rem; }
  .floatingCard p { font-size: 0.8rem; }
}

.floatIcon {
  font-size: 1.125rem;
  background: var(--color-pale-pink);
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  flex-shrink: 0;
}
@media (min-width: 768px) { .floatIcon { font-size: 1.5rem; width: 40px; height: 40px; } }

.floatTopRight { top: -12px; right: -8px; }
@media (min-width: 768px) { .floatTopRight { top: -20px; right: -20px; } }

.floatBottomLeft { bottom: 12px; left: -8px; }
@media (min-width: 768px) { .floatBottomLeft { bottom: 20px; left: -30px; } }

.floatBottomRight { bottom: -16px; right: -8px; }
@media (min-width: 768px) { .floatBottomRight { bottom: -30px; right: -10px; } }

/* Trust Strip */
.trustStrip {
  background-color: var(--color-white);
  padding: 1.25rem 0;
  border-top: 1px solid var(--color-blush);
  border-bottom: 1px solid var(--color-blush);
  position: relative;
  z-index: 10;
}
@media (min-width: 768px) { .trustStrip { padding: 2rem 0; } }

.trustStripContainer {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.875rem 1rem;
}
@media (min-width: 640px) { .trustStripContainer { grid-template-columns: repeat(4, 1fr); gap: 1rem; } }
@media (min-width: 768px) {
  .trustStripContainer { display: flex; justify-content: space-around; flex-wrap: wrap; gap: 2rem; }
}

.trustItem { display: flex; align-items: center; gap: 0.4rem; font-weight: 600; font-size: 0.8rem; color: var(--color-text-dark); }
@media (min-width: 768px) { .trustItem { gap: 0.5rem; font-size: 1rem; } }

/* Pricing */
.pricingGrid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; align-items: center; }
@media (min-width: 640px) { .pricingGrid { grid-template-columns: 1fr 1fr; gap: 1.5rem; } }
@media (min-width: 992px) { .pricingGrid { grid-template-columns: repeat(3, 1fr); gap: 2rem; } }
@media (min-width: 640px) and (max-width: 991px) { .pricingCardFeatured { grid-column: 1 / -1; } }

.pricingCard {
  background: var(--color-white);
  border-radius: var(--radius-lg);
  padding: 2rem 1.5rem;
  position: relative;
  box-shadow: var(--shadow-card);
  border: 1px solid var(--color-blush);
  transition: transform var(--transition-smooth);
}
@media (min-width: 768px) { .pricingCard { padding: 3rem 2rem; } }
.pricingCard:hover { transform: translateY(-5px); box-shadow: var(--shadow-soft); }

.pricingCardFeatured { border: 2px solid var(--color-primary); box-shadow: var(--shadow-float); }
@media (min-width: 992px) {
  .pricingCardFeatured { transform: scale(1.05); }
  .pricingCardFeatured:hover { transform: scale(1.05) translateY(-5px); }
}

.pricingRibbon {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  background: var(--color-deep-rose);
  color: var(--color-white);
  padding: 0.25rem 1rem;
  border-radius: var(--radius-pill);
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
}
@media (min-width: 768px) { .pricingRibbon { font-size: 0.75rem; } }

.pricingIcon { font-size: 2.25rem; margin-bottom: 0.75rem; text-align: center; }
.pricingIcon img {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 auto;
}
@media (min-width: 768px) { 
  .pricingIcon { font-size: 3rem; margin-bottom: 1rem; } 
  .pricingIcon img {
    width: 120px;
    height: 120px;
  }
}

.pricingCard h3 { text-align: center; font-size: 1.25rem; margin-bottom: 0.75rem; }
@media (min-width: 768px) { .pricingCard h3 { font-size: 1.5rem; margin-bottom: 1rem; } }

.price { text-align: center; font-size: 2.75rem; font-weight: 700; font-family: var(--font-heading); color: var(--color-cta); margin-bottom: 1.5rem; }
@media (min-width: 768px) { .price { font-size: 3.5rem; margin-bottom: 2rem; } }

.pricingList { list-style: none; margin-bottom: 1.5rem; }
@media (min-width: 768px) { .pricingList { margin-bottom: 2rem; } }
.pricingList li { margin-bottom: 0.6rem; color: var(--color-text-gray); font-size: 0.875rem; }
@media (min-width: 768px) { .pricingList li { margin-bottom: 0.75rem; font-size: 0.95rem; } }
.pricingCard .btn { width: 100%; }

/* Steps & Features */
.stepsGrid { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media (min-width: 640px) { .stepsGrid { grid-template-columns: repeat(3, 1fr); gap: 2.5rem; } }
@media (min-width: 768px) { .stepsGrid { gap: 3rem; } }

.stepCard { text-align: center; position: relative; display: flex; align-items: flex-start; gap: 1rem; text-align: left; }
@media (min-width: 640px) { .stepCard { flex-direction: column; align-items: center; text-align: center; gap: 0; } }

.stepNumber {
  width: 3.5rem;
  height: 3.5rem;
  min-width: 3.5rem;
  margin: 0;
  background-color: var(--color-pale-pink);
  color: var(--color-cta);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  font-family: var(--font-heading);
  font-weight: 700;
}
@media (min-width: 640px) { .stepNumber { width: 4rem; height: 4rem; min-width: 4rem; margin: 0 auto 1.5rem auto; font-size: 1.5rem; } }

.stepCard h3 { margin-bottom: 0.5rem; font-size: 1.0625rem; }
@media (min-width: 768px) { .stepCard h3 { margin-bottom: 1rem; font-size: 1.25rem; } }
.stepCard p { font-size: 0.9375rem; color: var(--color-text-gray); }

.featuresGrid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 640px) { .featuresGrid { grid-template-columns: 1fr 1fr; gap: 1.5rem; } }
@media (min-width: 992px) { .featuresGrid { grid-template-columns: repeat(3, 1fr); gap: 2rem; } }

.featureCard { background: var(--color-white); padding: 2rem 1.5rem; border-radius: var(--radius-lg); box-shadow: var(--shadow-card); display: flex; flex-direction: row; align-items: flex-start; gap: 1rem; }
@media (min-width: 640px) { .featureCard { flex-direction: column; padding: 2.5rem 2rem; gap: 0; } }
@media (min-width: 992px) { .featureCard { padding: 3rem 2rem; } }

.featureIcon {
  font-size: 1.75rem;
  background: var(--color-bg-main);
  width: 56px;
  height: 56px;
  min-width: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
  margin-bottom: 0;
  overflow: hidden;
}
.featureIcon img { width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 640px) { .featureIcon { font-size: 2.5rem; width: 80px; height: 80px; min-width: 80px; margin-bottom: 1.5rem; } }

.featureCard h3 { font-size: 1.0625rem; margin-bottom: 0.5rem; }
@media (min-width: 768px) { .featureCard h3 { font-size: 1.25rem; margin-bottom: 1rem; } }
.featureCard p { color: var(--color-text-gray); font-size: 0.9375rem; }

/* Split Layout */
.splitLayout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: center;
}
.splitContent, .splitImage {
  min-width: 0;
}
@media (min-width: 768px) {
  .splitLayout {
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
  }
}
.splitImage { position: relative; }
.splitImage img { border-radius: var(--radius-blob-2); width: 100%; }
.splitContent h2 { font-size: 2rem; margin-bottom: 1.125rem; }
@media (min-width: 480px) { .splitContent h2 { font-size: 2.5rem; } }
@media (min-width: 768px) { .splitContent h2 { font-size: 3rem; margin-bottom: 1.5rem; } }
.splitContent p { font-size: 1rem; color: var(--color-text-gray); margin-bottom: 1.25rem; }
@media (min-width: 768px) { .splitContent p { font-size: 1.125rem; margin-bottom: 1.5rem; } }

/* City Grid */
.cityGrid { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem; }
.cityCard { background: var(--color-white); padding: 0.75rem 1.375rem; border-radius: var(--radius-pill); font-weight: 600; font-size: 0.9375rem; color: var(--color-cta); border: 1px solid var(--color-blush); box-shadow: var(--shadow-card); }
@media (min-width: 768px) { .cityCard { padding: 1rem 2rem; font-size: 1rem; } }

/* Reviews */
.reviewsGrid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 768px) { .reviewsGrid { grid-template-columns: 1fr 1fr; gap: 2rem; } }
.reviewCard { background: var(--color-bg-cream); padding: 2rem 1.5rem; border-radius: var(--radius-lg); border: 1px solid var(--color-blush); position: relative; }
@media (min-width: 768px) { .reviewCard { padding: 3rem; } }
.stars { color: var(--color-primary); font-size: 1.25rem; margin-bottom: 0.875rem; }
@media (min-width: 768px) { .stars { font-size: 1.5rem; margin-bottom: 1rem; } }
.reviewCard p { font-size: 1rem; font-style: italic; margin-bottom: 1.25rem; line-height: 1.8; color: var(--color-text-gray); }
@media (min-width: 768px) { .reviewCard p { font-size: 1.125rem; margin-bottom: 1.5rem; } }
.reviewAuthor { font-weight: 700; color: var(--color-deep-rose); font-family: var(--font-heading); font-size: 0.9375rem; }

/* FAQ */
.faqList { max-width: 800px; margin: 0 auto; }
.faqItem { background: var(--color-white); padding: 1.5rem; border-radius: var(--radius-md); margin-bottom: 0.875rem; box-shadow: var(--shadow-card); border-left: 4px solid var(--color-primary); }
@media (min-width: 768px) { .faqItem { padding: 2rem; margin-bottom: 1rem; } }
.faqItem h3 { margin-bottom: 0.5rem; font-size: 1.0625rem; }
@media (min-width: 768px) { .faqItem h3 { font-size: 1.25rem; } }
.faqItem p { color: var(--color-text-gray); font-size: 0.9375rem; }

/* Final CTA */
.finalCta { background: linear-gradient(135deg, var(--color-cta) 0%, var(--color-deep-rose) 100%); padding: 3rem 0; color: var(--color-white); overflow: hidden; }
@media (min-width: 768px) { .finalCta { padding: 4rem 0; } }
.finalCtaContainer {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  align-items: stretch;
}
@media (min-width: 900px) {
  .finalCtaContainer {
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    gap: 3.5rem;
  }
}
.finalCtaCompact { max-width: 1040px; }
.finalCtaContent { width: 100%; max-width: 500px; flex: 1 1 0; min-width: 0; }
.finalCtaForm { width: 100%; flex: 0 0 450px; max-width: 450px; min-width: 360px; }
.finalCtaFormCard { max-width: none; width: 100%; }
.finalCtaContent .eyebrow { background: rgba(255,255,255,0.18); color: var(--color-white); margin-bottom: 1rem; }
.finalCtaContent h2 { color: var(--color-white); font-size: 2.25rem; margin-bottom: 0.875rem; }
@media (min-width: 480px) { .finalCtaContent h2 { font-size: 2.75rem; } }
@media (min-width: 768px) { .finalCtaContent h2 { font-size: 3.1rem; margin-bottom: 1rem; } }
.finalCtaContent p { font-size: 1rem; opacity: 0.92; max-width: 34rem; }
@media (min-width: 768px) { .finalCtaContent p { font-size: 1.15rem; } }
@media (max-width: 899px) {
  .finalCtaForm { max-width: none; min-width: 0; flex-basis: auto; }
}

/* Form Styles */
.form-wrap {
  padding: 1.5rem 1.25rem;
  border-radius: var(--radius-lg);
  width: 100%;
  max-width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.6);
  box-shadow: var(--shadow-float);
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: var(--color-text-dark);
}
@media (min-width: 480px) { .form-wrap { padding: 1.75rem 1.5rem; } }
@media (min-width: 768px) { .form-wrap { padding: 2rem 1.75rem; max-width: 450px; } }
.form-wrap input, .form-wrap textarea, .form-wrap select {
  width: 100%;
  padding: 0.6rem 0.875rem;
  border: 2px solid var(--color-blush);
  border-radius: var(--radius-md);
  margin-bottom: 0;
  font-family: inherit;
  font-size: 0.95rem;
  background-color: var(--color-white);
  transition: all var(--transition-fast);
}
.form-wrap textarea {
  height: 80px;
  min-height: 80px;
  resize: vertical;
}
.form-wrap input:focus, .form-wrap textarea:focus, .form-wrap select:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-pale-pink);
}

.form-wrap p {
  margin-bottom: 0.5rem;
}
.form-wrap br {
  display: none;
}
.form-wrap label {
  display: block;
  font-weight: 600;
  color: var(--color-deep-rose);
  margin-bottom: 0.2rem;
  font-size: 0.85rem;
}
.form-wrap .wpcf7-form-control-wrap {
  display: block;
  margin-bottom: 0;
}
.form-wrap input[type="submit"] {
  background-color: var(--color-primary);
  color: var(--color-white);
  font-weight: 700;
  font-size: 1.1rem;
  border: none;
  cursor: pointer;
  margin-top: 0.5rem;
  padding: 1rem 2rem;
  border-radius: var(--radius-pill);
  transition: all var(--transition-fast);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.form-wrap input[type="submit"]:hover {
  background-color: var(--color-primary-dark);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(216, 27, 96, 0.3);
}
.wpcf7-not-valid-tip {
  color: var(--color-primary);
  font-size: 0.85rem;
  margin-top: -0.5rem;
  margin-bottom: 1rem;
  display: block;
}
.wpcf7-response-output {
  border-radius: var(--radius-sm);
  padding: 1rem !important;
  margin-top: 1rem !important;
}

/* Footer */
.footer { background: var(--color-white); padding: 3rem 0 2rem 0; }
@media (min-width: 768px) { .footer { padding: 4rem 0 2rem 0; } }
.footerGrid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-bottom: 2.5rem; }
@media (min-width: 768px) { .footerGrid { grid-template-columns: 2fr 1fr 1fr; gap: 4rem; margin-bottom: 4rem; } }
.footerBrand { grid-column: 1 / -1; font-size: 1.75rem; color: var(--color-deep-rose); margin-bottom: 0.5rem; }
@media (min-width: 768px) { .footerBrand { grid-column: auto; font-size: 2rem; margin-bottom: 1rem; } }
.footerHeading { font-size: 1.0625rem; margin-bottom: 1rem; }
@media (min-width: 768px) { .footerHeading { font-size: 1.25rem; margin-bottom: 1.5rem; } }
.footerText { color: var(--color-text-gray); margin-bottom: 0.5rem; font-size: 0.9375rem; }
.footerLinks { list-style: none; }
.footerLinks li { margin-bottom: 0.625rem; }
.footerLinks a { color: var(--color-text-gray); font-size: 0.9375rem; }
.footerLinks a:hover { color: var(--color-cta); }
.footerGridNoQuickLinks { grid-template-columns: 1fr; }
@media (min-width: 768px) { .footerGridNoQuickLinks { grid-template-columns: 2fr 1fr; } }
.footerBottom { text-align: center; padding-top: 1.5rem; border-top: 1px solid var(--color-blush); color: var(--color-text-gray); font-size: 0.8125rem; }
@media (min-width: 768px) { .footerBottom { padding-top: 2rem; font-size: 0.875rem; } }

/* Page Headers */
.page-header { padding: 4rem 0 3rem 0; text-align: center; background: var(--color-bg-cream); border-bottom: 1px solid var(--color-blush); }
@media (min-width: 768px) { .page-header { padding: 6rem 0 4rem 0; } }
.page-header h1 { font-size: 2.75rem; margin-bottom: 1rem; line-height: 1.1; }
@media (min-width: 768px) { .page-header h1 { font-size: 4rem; } }

/* Contact / Content Sections */
.content-area { padding: 3rem 1.25rem; max-width: 800px; margin: 0 auto; }
@media (min-width: 768px) { .content-area { padding: 4rem 0; } }

/* Booking / Contact form + copy layouts */
.formContentLayout {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  align-items: stretch;
}
@media (min-width: 900px) {
  .formContentLayout {
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 3.5rem;
  }
}
.formContentLayout .form-panel {
  max-width: none;
  width: 100%;
  flex: 0 0 430px;
  min-width: 340px;
}
.form-copy {
  width: 100%;
  max-width: 560px;
  flex: 1 1 0;
  min-width: 0;
  align-self: flex-start;
}
.form-copy h2 {
  font-size: 2rem;
  margin-bottom: 0.75rem;
}
@media (min-width: 768px) {
  .form-copy h2 { font-size: 2.75rem; }
}
.form-copy p {
  color: var(--color-text-gray);
  margin-bottom: 1rem;
}
.form-copy .lead-copy {
  color: var(--color-deep-rose);
  font-weight: 700;
  font-size: 1.125rem;
}
.form-copy a {
  color: var(--color-primary);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.form-copy-list {
  list-style: none;
  margin: 1.25rem 0 1.75rem 0;
  padding: 0;
  display: grid;
  gap: 0.75rem;
}
.form-copy-list li {
  position: relative;
  padding-left: 1.75rem;
  color: var(--color-text-dark);
}
.form-copy-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--color-cta);
  font-weight: 800;
}
.trustStack {
  display: grid;
  gap: 1rem;
  margin-top: 1.5rem;
}
.trustStack .trustItem {
  align-items: flex-start;
  padding: 1rem;
  border: 1px solid var(--color-blush);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: var(--shadow-card);
}
.trustStack .trustIcon {
  font-size: 1.5rem;
  line-height: 1;
}
.trustStack h3 {
  font-size: 1.05rem;
  margin-bottom: 0.25rem;
}
.trustStack p,
.form-copy-notes p {
  margin: 0;
  font-size: 0.95rem;
}
.form-copy-notes {
  max-width: none;
  padding: 0;
  margin: 1.25rem 0 0 0;
}
.infoCardsGrid {
  display: grid;
  gap: 1rem;
  margin-top: 1.5rem;
}
.infoCard {
  display: block;
  padding: 1.5rem;
}
.infoCard h3 {
  margin-bottom: 0.5rem;
}
.infoCard h3:not(:first-child) {
  margin-top: 1.25rem;
}
.infoCard p {
  margin-bottom: 0.4rem;
}
@media (max-width: 899px) {
  .formContentLayout .form-panel { min-width: 0; flex-basis: auto; }
  .form-copy { max-width: none; }
}

.whyPinkGeneratedImage {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-float);
  border: 1px solid var(--color-blush);
  display: block;
}

/* Mobile containment fixes: keep the existing desktop format, but prevent
   fixed-width cards/buttons/forms from creating sideways scrolling on phones. */
@media (max-width: 767px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  body {
    position: relative;
  }

  .container,
  .header-container,
  .heroContainer,
  .pricingGrid,
  .featuresGrid,
  .stepsGrid,
  .splitLayout,
  .reviewsGrid,
  .formContentLayout,
  .finalCtaContainer,
  .footerGrid,
  .content-area,
  .page-header,
  .section {
    max-width: 100%;
    min-width: 0;
  }

  .section {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .header {
    min-height: 74px;
    overflow: visible;
  }

  .header-container {
    gap: 0.75rem;
  }

  .logo {
    width: clamp(118px, 38vw, 150px);
    height: 46px;
    flex: 0 1 auto;
  }

  .logo img {
    width: clamp(150px, 48vw, 178px);
    top: -14px;
    left: 0;
  }

  .header-actions,
  .mobile-actions {
    min-width: 0;
    flex-shrink: 1;
  }

  .mobileCallBtn {
    max-width: 42vw;
    padding: 0.5rem 0.75rem;
    font-size: 0.8125rem;
    white-space: nowrap;
  }

  .headline,
  .page-header h1,
  .sectionHeader h2,
  .splitContent h2,
  .finalCtaContent h2,
  .footerBrand {
    overflow-wrap: anywhere;
    word-break: normal;
  }

  .headline {
    font-size: clamp(2.25rem, 12vw, 3rem);
  }

  .page-header h1 {
    font-size: clamp(2.1rem, 10vw, 3rem);
  }

  .sectionHeader h2,
  .splitContent h2,
  .finalCtaContent h2,
  .footerBrand {
    font-size: clamp(1.85rem, 8vw, 2.45rem);
  }

  .subheadline,
  .trustLine,
  .pricingList li,
  .featureCard p,
  .stepCard p,
  .reviewCard p,
  .form-copy p,
  .footerText {
    overflow-wrap: anywhere;
  }

  .ctaButtons {
    flex-direction: column;
    align-items: stretch;
  }

  .btn,
  .btn-large,
  .pricingCard .btn,
  .form-wrap input[type="submit"] {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    white-space: normal;
    text-align: center;
    line-height: 1.2;
  }

  .pricingGrid,
  .featuresGrid,
  .stepsGrid,
  .trustStripContainer,
  .footerGrid {
    grid-template-columns: 1fr !important;
  }

  .pricingCard,
  .featureCard,
  .reviewCard,
  .faqItem,
  .form-wrap,
  .infoCard {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .pricingCard {
    padding: 1.75rem 1.125rem;
  }

  .pricingRibbon {
    max-width: calc(100% - 2rem);
    white-space: normal;
    text-align: center;
  }

  .price {
    font-size: clamp(2.5rem, 13vw, 3.25rem);
  }

  .featureCard,
  .stepCard,
  .trustStack .trustItem {
    align-items: flex-start;
  }

  .floatingCard {
    max-width: calc(100% - 1.5rem);
  }

  .floatTopRight,
  .floatBottomRight {
    right: 0;
  }

  .floatBottomLeft {
    left: 0;
  }

  .splitImage img,
  .mainImage,
  .whyPinkGeneratedImage {
    max-width: 100%;
  }

  .finalCtaForm,
  .formContentLayout .form-panel,
  .form-copy {
    flex: 1 1 auto;
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .form-wrap input,
  .form-wrap textarea,
  .form-wrap select {
    max-width: 100%;
    min-width: 0;
  }

  .serviceAreaColumns {
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }

  .extendedLocationsNote {
    margin-top: 1rem;
    color: var(--color-text-gray);
  }
}

@media (max-width: 380px) {
  .container {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .mobile-sticky-cta {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }

  .mobile-sticky-cta-inner {
    gap: 0.5rem;
  }

  .mobile-sticky-cta .btn {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    font-size: 0.875rem;
  }

  .mobileCallBtn {
    max-width: 38vw;
    padding-left: 0.625rem;
    padding-right: 0.625rem;
  }
}

/* Pink Shield Landing Page */
.shieldLanding {
  background:
    radial-gradient(circle at 12% 0%, rgba(255, 216, 232, 0.95), transparent 30rem),
    linear-gradient(180deg, #fff6f9 0%, #fff9f1 46%, #ffffff 100%);
  color: var(--color-text-dark);
  overflow-x: clip;
}

.slHero {
  position: relative;
  overflow: hidden;
  padding: 3.5rem 0 4rem;
  isolation: isolate;
}

.slHeroGlow {
  position: absolute;
  z-index: -2;
  border-radius: 999px;
  filter: blur(10px);
  opacity: 0.8;
}

.slHeroGlowOne {
  width: 36rem;
  height: 36rem;
  left: -16rem;
  top: -15rem;
  background: radial-gradient(circle, rgba(255, 95, 162, 0.28), transparent 64%);
}

.slHeroGlowTwo {
  width: 44rem;
  height: 44rem;
  right: -22rem;
  bottom: -24rem;
  background: radial-gradient(circle, rgba(218, 176, 85, 0.22), transparent 60%);
}

.slHeroVideoShell {
  position: absolute;
  inset: 0;
  z-index: -3;
  opacity: 0.2;
  pointer-events: none;
}

.slHeroVideoShell::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #fff6f9 0%, rgba(255, 246, 249, 0.86) 46%, rgba(255, 246, 249, 0.55) 100%);
}

.slHeroVideo {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.slHeroGrid,
.slHowGrid,
.slValueGrid,
.slCostGrid,
.slEnrollGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  align-items: center;
}

.slHeroCopy {
  max-width: 760px;
}

.slEyebrow {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 1rem;
  padding: 0.45rem 0.9rem;
  border: 1px solid rgba(231, 53, 122, 0.16);
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.78);
  color: var(--color-deep-rose);
  font-size: 0.75rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  box-shadow: var(--shadow-soft);
}

.slHero h1 {
  max-width: 780px;
  margin-bottom: 1rem;
  font-size: clamp(2.65rem, 12vw, 5.9rem);
  line-height: 0.94;
  letter-spacing: -0.04em;
}

.slHeroLead {
  max-width: 640px;
  margin-bottom: 1.5rem;
  color: var(--color-text-gray);
  font-size: 1.08rem;
  line-height: 1.72;
}

.slHeroCtas {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.85rem;
}

.slHeroCtas .btn {
  width: 100%;
}

.slMicroProof {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.55rem;
  margin-top: 1.35rem;
  color: var(--color-text-dark);
  font-size: 0.92rem;
  font-weight: 800;
}

.slMicroProof span {
  padding: 0.65rem 0.85rem;
  border: 1px solid var(--color-blush);
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.72);
}

.slOfferCard {
  position: relative;
  overflow: hidden;
  width: 100%;
  border: 1px solid rgba(214, 182, 108, 0.65);
  border-radius: 2rem;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(255, 244, 248, 0.94));
  box-shadow: 0 30px 80px rgba(181, 31, 93, 0.18);
  padding: 2rem 1.25rem;
}

.slCardShine {
  position: absolute;
  inset: -40% auto auto -30%;
  width: 70%;
  height: 120%;
  transform: rotate(16deg);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.72), transparent);
  animation: slShine 6s ease-in-out infinite;
}

.slCardKicker,
.slPerDay {
  position: relative;
  color: var(--color-text-gray);
  font-weight: 800;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.09em;
}

.slCardKicker {
  font-size: 0.78rem;
}

.slHeroPrice {
  position: relative;
  color: var(--color-cta);
  font-family: var(--font-heading);
  font-size: clamp(5rem, 22vw, 7.4rem);
  font-weight: 800;
  line-height: 0.96;
  text-align: center;
  text-shadow: 0 8px 24px rgba(231, 53, 122, 0.14);
}

.slPerDay {
  max-width: 290px;
  margin: 0.8rem auto 0;
  font-size: 0.88rem;
  line-height: 1.5;
  text-transform: none;
  letter-spacing: 0;
}

.slOfferDivider {
  height: 1px;
  margin: 1.35rem 0;
  background: linear-gradient(90deg, transparent, rgba(214, 182, 108, 0.8), transparent);
}

.slOfferRows {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.75rem 1rem;
  margin-bottom: 1.4rem;
  font-size: 0.96rem;
}

.slOfferRows span { color: var(--color-text-gray); }
.slOfferRows strong { color: var(--color-deep-rose); text-align: right; }
.slFullButton { width: 100%; }

.slTrustStrip {
  position: relative;
  z-index: 2;
  border-block: 1px solid rgba(255, 216, 232, 0.95);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 18px 50px rgba(181, 31, 93, 0.08);
}

.slTrustStripInner {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  padding-block: 1rem;
}

.slTrustStripInner span {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 216, 232, 0.8);
  border-radius: var(--radius-pill);
  background: linear-gradient(135deg, #fff, #fff6f9);
  color: var(--color-deep-rose);
  font-size: 0.9rem;
  font-weight: 900;
  text-align: center;
}

.slHowSection {
  background:
    radial-gradient(circle at 12% 24%, rgba(255, 216, 232, 0.7), transparent 20rem),
    #ffffff;
}

.slHowCopy { max-width: 960px; margin: 0 auto; text-align: center; }

.slStepsGrid {
  display: grid;
  gap: 1rem;
  margin-top: 1.5rem;
}

.slStepCard {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem;
  align-items: start;
  border: 1px solid rgba(255, 216, 232, 0.95);
  border-radius: 1.4rem;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--shadow-card);
  padding: 1.15rem;
}

.slStepCard > strong {
  display: grid;
  width: 3.1rem;
  height: 3.1rem;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--color-primary), var(--color-cta));
  color: white;
  font-family: var(--font-heading);
  font-size: 1.35rem;
  box-shadow: var(--shadow-btn);
}

.slStepCard h3 {
  margin-bottom: 0.25rem;
  color: var(--color-deep-rose);
  font-size: 1.25rem;
}

.slStepCard p {
  color: var(--color-text-gray);
  font-weight: 700;
  line-height: 1.55;
}

.slVideoSection {
  background:
    radial-gradient(circle at 84% 18%, rgba(255, 216, 232, 0.95), transparent 22rem),
    linear-gradient(180deg, #fff9f1 0%, #ffffff 100%);
}

.slVideoStage {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.25rem;
  align-items: center;
}

.slVideoCopy { max-width: 620px; }
.slVideoCopy .btn { margin-top: 1.5rem; }

.slVideoFeature {
  position: relative;
  overflow: hidden;
  width: min(100%, 360px);
  margin: 0 auto;
  border: 1px solid rgba(214, 182, 108, 0.5);
  border-radius: 2.2rem;
  background: linear-gradient(145deg, #fff, #fff0f6);
  box-shadow: 0 28px 80px rgba(181, 31, 93, 0.16);
  padding: 0.75rem;
}

.slVideoBadge {
  position: absolute;
  top: 1.25rem;
  left: 1.25rem;
  z-index: 2;
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.92);
  color: var(--color-deep-rose);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  padding: 0.5rem 0.8rem;
  text-transform: uppercase;
  box-shadow: var(--shadow-soft);
}

.slFeatureVideo {
  display: block;
  width: 100%;
  aspect-ratio: 9 / 16;
  border-radius: 1.65rem;
  background: #211d21;
  object-fit: cover;
}

.slVideoFeature p {
  padding: 0.85rem 0.55rem 0.25rem;
  color: var(--color-text-dark);
  font-weight: 800;
  line-height: 1.5;
  text-align: center;
}

.slUrgencyBand {
  border-block: 1px solid rgba(255, 216, 232, 0.95);
  background: linear-gradient(90deg, #b51f5d, #e7357a);
  color: white;
}

.slUrgencyInner {
  display: grid;
  gap: 0.5rem;
  padding-block: 1rem;
}

.slUrgencyInner strong {
  font-family: var(--font-heading);
  font-size: 1.25rem;
}

.slUrgencyInner span { opacity: 0.92; }

.slSection { padding: 4rem 0; }
.slValueSection { background: linear-gradient(180deg, #ffffff 0%, #fff9f1 100%); }

.slStickyVisual img {
  width: 100%;
  border-radius: 2rem;
  box-shadow: 0 26px 70px rgba(181, 31, 93, 0.16);
}

.slValueCopy h2,
.slHowCopy h2,
.slVideoCopy h2,
.slSectionHeading h2,
.slCostSection h2,
.slEnrollCopy h2,
.slFaqItem h3,
.slFinalCta h2 {
  margin-bottom: 1rem;
  font-size: clamp(2.1rem, 8vw, 4.3rem);
  line-height: 1;
  letter-spacing: -0.05em;
}

.slValueCopy h2 span,
.slCostSection h2 { color: var(--color-cta); }

.slValueCopy p,
.slHowCopy p,
.slVideoCopy p,
.slSectionHeading p,
.slCostSection p,
.slEnrollCopy p,
.slFaqItem p {
  color: var(--color-text-gray);
  font-size: 1.03rem;
  line-height: 1.75;
}

.slValueMath {
  display: grid;
  gap: 0.75rem;
  margin-top: 1.5rem;
}

.slValueMath div {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  border: 1px solid var(--color-blush);
  border-radius: 1.1rem;
  background: rgba(255, 255, 255, 0.86);
}

.slValueMath span { color: var(--color-text-gray); }
.slValueMath strong { color: var(--color-deep-rose); font-size: 1.08rem; }
.slValueMath .slTotalRow { border-color: rgba(181, 31, 93, 0.24); background: #fff0f5; }
.slValueMath .slInvestRow { border-color: rgba(214, 182, 108, 0.5); background: linear-gradient(90deg, #fff9f1, #ffe5b6); }

.slIncludesSection { background: #fff6f9; }

.slSectionHeading {
  max-width: 760px;
  margin: 0 auto 2rem;
  text-align: center;
}

.slIncludesGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

.slIncludeCard {
  display: grid;
  gap: 0.35rem;
  min-height: 142px;
  align-content: center;
  border: 1px solid rgba(255, 216, 232, 0.95);
  border-radius: 1.4rem;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: var(--shadow-card);
  padding: 1.35rem;
}

.slIncludeIcon {
  display: inline-grid;
  width: 3.4rem;
  height: 3.4rem;
  place-items: center;
  border-radius: 1.2rem;
  background: linear-gradient(135deg, #fff4f8, #ffe3ef);
  font-size: 2rem;
  box-shadow: inset 0 0 0 1px rgba(231, 53, 122, 0.08);
}

.slIncludeCard strong {
  color: var(--color-cta);
  font-family: var(--font-heading);
  font-size: 2rem;
  line-height: 1;
}

.slIncludeCard span {
  color: var(--color-text-dark);
  font-weight: 800;
  line-height: 1.35;
}

.slAddOnNote {
  width: fit-content;
  margin: 1.5rem auto 0;
  padding: 0.85rem 1.15rem;
  border-radius: var(--radius-pill);
  background: #fff;
  color: var(--color-deep-rose);
  font-weight: 900;
  text-align: center;
  box-shadow: var(--shadow-soft);
}

.slCostSection {
  padding: 4rem 0;
  background: linear-gradient(135deg, #211d21 0%, #66183b 100%);
  color: white;
}

.slCostSection .slEyebrow {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.18);
  color: #ffd8e8;
}

.slCostSection h2,
.slCostSection p { color: white; }

.slPromiseCard {
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 1.8rem;
  background: rgba(255, 255, 255, 0.1);
  padding: 1.5rem;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.18);
}

.slPromiseCard span {
  display: block;
  margin-bottom: 0.75rem;
  color: #ffd8e8;
  font-family: var(--font-heading);
  font-size: 1.55rem;
  font-weight: 800;
  line-height: 1.15;
}

.slPromiseCard p { color: rgba(255, 255, 255, 0.86); }

.slEnrollSection {
  background:
    radial-gradient(circle at 90% 20%, rgba(255, 216, 232, 0.75), transparent 22rem),
    #fff9f1;
}

.slAnchorShim {
  position: relative;
  top: -110px;
  display: block;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.slTimeline {
  display: grid;
  gap: 0.9rem;
  margin-top: 1.5rem;
}

.slTimeline div {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.8rem;
  align-items: center;
  padding: 1rem;
  border-radius: 1.1rem;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid var(--color-blush);
}

.slTimeline strong {
  color: var(--color-cta);
  font-family: var(--font-heading);
  font-size: 1.6rem;
}

.slTimeline span {
  color: var(--color-text-dark);
  font-weight: 800;
}

.slFormShell { display: grid; width: 100%; gap: 1rem; }
.slEnrollmentStatus {
  display: grid;
  gap: 0.35rem;
  border: 1px solid rgba(181, 31, 93, 0.22);
  border-radius: 1.35rem;
  background: linear-gradient(135deg, #ffffff, #fff0f6);
  box-shadow: var(--shadow-soft);
  padding: 1rem 1.15rem;
  text-align: center;
}
.slEnrollmentStatus span {
  color: var(--color-text-gray);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.slEnrollmentStatus strong {
  color: var(--color-cta);
  font-family: var(--font-heading);
  font-size: 1.65rem;
  line-height: 1;
}
.slEnrollmentForm { max-width: none; }
.slEnrollmentForm h3 { color: var(--color-deep-rose); margin-bottom: 0.5rem; }
.slEnrollmentForm > p { color: var(--color-text-gray); margin-bottom: 1.25rem; }

.slGuidelinesSection { background: white; }

.slGuidelinesGrid {
  display: grid;
  gap: 0.85rem;
}

.slGuideline {
  border: 1px solid var(--color-blush);
  border-radius: 1rem;
  background: #fff9f1;
  color: var(--color-text-dark);
  padding: 1rem;
  font-weight: 700;
}

.slAftercareNote {
  margin-top: 1.25rem;
  color: var(--color-text-gray);
  font-size: 0.92rem;
  font-style: italic;
  text-align: center;
}

.slFaqSection { background: linear-gradient(180deg, #fff9f1 0%, #ffffff 100%); }
.slFaqGrid { display: grid; gap: 1rem; }
.slFaqItem {
  border: 1px solid rgba(255, 216, 232, 0.95);
  border-radius: 1.4rem;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--shadow-card);
  padding: 1.25rem;
}
.slFaqItem h3 {
  color: var(--color-deep-rose);
  font-size: 1.35rem;
  line-height: 1.18;
  letter-spacing: -0.03em;
}

.slFinalCta {
  padding: 4rem 0;
  background: linear-gradient(135deg, var(--color-cta), var(--color-deep-rose));
  color: white;
  text-align: center;
}

.slFinalCta p,
.slFinalCta h2 { color: white; }

.slFinalCta p {
  margin-bottom: 0.8rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.slFinalCta .btn-primary {
  background: white;
  color: var(--color-cta);
}

@keyframes slShine {
  0%, 45% { transform: translateX(-140%) rotate(16deg); }
  70%, 100% { transform: translateX(250%) rotate(16deg); }
}

@media (min-width: 560px) {
  .slHeroCtas { display: flex; }
  .slHeroCtas .btn { width: auto; }
  .slMicroProof { grid-template-columns: repeat(3, max-content); }
  .slTrustStripInner { grid-template-columns: repeat(2, 1fr); }
  .slIncludesGrid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 768px) {
  .slHero { padding: 6rem 0 7rem; }
  .slHeroGrid,
  .slValueGrid,
  .slCostGrid,
  .slEnrollGrid {
    grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
    gap: 4rem;
  }
  .slOfferCard { padding: 2.4rem; }
  .slStepsGrid { grid-template-columns: repeat(3, 1fr); }
  .slVideoStage { grid-template-columns: minmax(0, 1fr) minmax(280px, 380px); gap: 4rem; }
  .slUrgencyInner { grid-template-columns: auto 1fr; align-items: center; gap: 1.25rem; }
  .slSection { padding: 6rem 0; }
  .slIncludesGrid { grid-template-columns: repeat(3, 1fr); }
  .slGuidelinesGrid { grid-template-columns: repeat(2, 1fr); }
  .slFaqGrid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 992px) {
  .slHeroVideoShell { opacity: 0.42; }
  .slHeroVideoShell::after { background: linear-gradient(90deg, #fff6f9 0%, rgba(255, 246, 249, 0.8) 38%, rgba(255, 246, 249, 0.18) 100%); }
  .slHeroGrid { grid-template-columns: minmax(0, 1.15fr) minmax(370px, 0.85fr); }
  .slTrustStripInner { grid-template-columns: repeat(4, 1fr); }
  .slOfferCard { transform: translateY(1rem) rotate(1.4deg); }
  .slStickyVisual { position: sticky; top: 110px; }
}

@media (prefers-reduced-motion: no-preference) and (min-width: 992px) {
  .slHeroCopy,
  .slHowCopy,
  .slStepCard,
  .slVideoFeature,
  .slOfferCard,
  .slStickyVisual,
  .slValueCopy,
  .slIncludeCard,
  .slPromiseCard,
  .slFormShell,
  .slFaqItem {
    animation: slRiseIn both;
    animation-timeline: view();
    animation-range: entry 0% cover 32%;
  }
}

@keyframes slRiseIn {
  from { opacity: 0; transform: translateY(46px) scale(0.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 767px) {
  .slHero { padding-top: 2.3rem; }
  .slHero h1 { font-size: clamp(2.45rem, 13vw, 4rem); }
  .slOfferCard { order: -1; }
  .slStickyVisual picture { display: block; max-width: 430px; margin: 0 auto; }
}

/* Pink Shield live WordPress layout hardening */

@media (min-width: 992px) {
  .header-container { gap: 1rem; }
  .logo { width: 190px; }
  .logo img { width: 185px; top: -18px; }
  .nav ul { gap: 1.15rem; }
  .nav a { font-size: 0.98rem; white-space: nowrap; }
  .desktop-actions { gap: 0.65rem !important; flex-shrink: 0; }
  .desktop-actions a[href^="tel"] { white-space: nowrap; }
  .desktop-actions .btn { padding: 0.5rem 1.15rem !important; font-size: 0.96rem !important; }
}

.shieldLanding .container,
.shieldLanding .slContainer {
  display: block;
  width: 100% !important;
  max-width: 1120px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 1.25rem !important;
  padding-left: 1.25rem !important;
}

.shieldLanding .slHero {
  min-height: auto !important;
  padding: clamp(3rem, 6vw, 6rem) 0 !important;
}

.shieldLanding .slHeroGrid,
.shieldLanding .slVideoStage,
.shieldLanding .slValueGrid,
.shieldLanding .slCostGrid,
.shieldLanding .slEnrollGrid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: clamp(1.75rem, 4vw, 4rem) !important;
  align-items: center !important;
}

.shieldLanding .slHeroGrid {
  grid-template-areas: "copy" "offer" !important;
}

.shieldLanding .slHeroCopy {
  grid-area: copy !important;
  width: 100% !important;
  max-width: 720px !important;
  justify-self: start !important;
  text-align: left !important;
}

.shieldLanding .slOfferCard {
  grid-area: offer !important;
  width: 100% !important;
  max-width: 420px !important;
  justify-self: stretch !important;
  align-self: center !important;
  order: 0 !important;
  transform: none !important;
}

.shieldLanding .slHero h1 {
  max-width: 760px !important;
  font-size: clamp(3rem, 7vw, 5.35rem) !important;
  line-height: 0.95 !important;
}

.shieldLanding .slHeroCtas,
.shieldLanding .slMicroProof {
  justify-content: start !important;
}

.shieldLanding .slTrustStripInner {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0.75rem !important;
}

.shieldLanding .slHowSection,
.shieldLanding .slSection,
.shieldLanding .slCostSection,
.shieldLanding .slFinalCta {
  padding-top: clamp(3.25rem, 6vw, 5.75rem) !important;
  padding-bottom: clamp(3.25rem, 6vw, 5.75rem) !important;
}

.shieldLanding .slVideoStage {
  grid-template-areas: "copy" "video" !important;
}

.shieldLanding .slVideoCopy {
  grid-area: copy !important;
  max-width: 620px !important;
  justify-self: start !important;
  text-align: left !important;
}

.shieldLanding .slVideoFeature {
  grid-area: video !important;
  width: min(100%, 340px) !important;
  justify-self: center !important;
  margin: 0 auto !important;
}

.shieldLanding .slFeatureVideo {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 9 / 16 !important;
  object-fit: cover !important;
}

@media (min-width: 560px) {
  .shieldLanding .slHeroCtas { display: flex !important; }
  .shieldLanding .slMicroProof { grid-template-columns: repeat(3, max-content) !important; }
  .shieldLanding .slTrustStripInner { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (min-width: 900px) {
  .shieldLanding .slHeroGrid {
    grid-template-columns: minmax(0, 1.12fr) minmax(330px, 0.88fr) !important;
    grid-template-areas: "copy offer" !important;
  }

  .shieldLanding .slOfferCard {
    justify-self: end !important;
  }

  .shieldLanding .slTrustStripInner {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  .shieldLanding .slStepsGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .shieldLanding .slVideoStage {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px) !important;
    grid-template-areas: "copy video" !important;
  }

  .shieldLanding .slVideoFeature {
    justify-self: end !important;
  }

  .shieldLanding .slValueGrid,
  .shieldLanding .slCostGrid,
  .shieldLanding .slEnrollGrid {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.95fr) !important;
  }
}

/* Service Area conversion funnels */
.serviceFunnel {
  background: var(--color-white);
  color: var(--color-text-dark);
}

.serviceFunnel .saEyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.9rem;
  color: var(--color-cta);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.saHero {
  position: relative;
  overflow: hidden;
  padding: clamp(3.5rem, 7vw, 7rem) 0 clamp(3rem, 6vw, 6rem);
  background:
    radial-gradient(circle at 12% 12%, rgba(255, 216, 232, 0.95), transparent 34%),
    linear-gradient(135deg, #fff7fa 0%, #fff9f1 52%, #ffffff 100%);
}

.saHeroGlow {
  position: absolute;
  pointer-events: none;
  border-radius: 999px;
  filter: blur(4px);
  opacity: 0.7;
}

.saHeroGlowOne {
  width: 280px;
  height: 280px;
  top: -110px;
  right: 12%;
  background: rgba(255, 95, 162, 0.14);
}

.saHeroGlowTwo {
  width: 210px;
  height: 210px;
  bottom: -100px;
  left: 8%;
  background: rgba(90, 198, 184, 0.12);
}

.saHeroGrid {
  position: relative;
  display: grid;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
}

.saHeroCopy {
  max-width: 720px;
}

.saHero h1 {
  max-width: 760px;
  margin: 0 0 1.25rem;
  color: var(--color-text-dark);
  font-size: clamp(2.75rem, 8vw, 5.75rem);
  line-height: 0.96;
  letter-spacing: -0.055em;
}

.saHero p {
  max-width: 690px;
  margin: 0;
  color: #5e5360;
  font-size: clamp(1.08rem, 2vw, 1.32rem);
  line-height: 1.7;
}

.saHeroActions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
  margin-top: 1.9rem;
}

.saComfortPills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 1.35rem;
}

.saComfortPills span,
.saMiniTrust span {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(231, 53, 122, 0.16);
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.78);
  color: var(--color-deep-rose);
  font-size: 0.86rem;
  font-weight: 800;
  padding: 0.52rem 0.78rem;
  box-shadow: 0 8px 24px rgba(231, 53, 122, 0.06);
}

.saHeroVisual {
  position: relative;
  width: min(100%, 560px);
  justify-self: center;
}

.saHeroImage,
.saSplitVisual img {
  display: block;
  width: 100%;
  border: 8px solid rgba(255, 255, 255, 0.92);
  border-radius: 2.25rem;
  box-shadow: 0 28px 70px rgba(181, 31, 93, 0.18);
  object-fit: cover;
}

.saHeroImage {
  aspect-ratio: 4 / 3;
}

.saFloatingNote {
  position: absolute;
  max-width: 220px;
  border: 1px solid rgba(255, 216, 232, 0.95);
  border-radius: 1.15rem;
  background: rgba(255, 255, 255, 0.94);
  color: var(--color-deep-rose);
  font-weight: 900;
  line-height: 1.25;
  padding: 0.85rem 1rem;
  box-shadow: var(--shadow-float);
}

.saFloatingNoteTop { top: 1rem; right: -0.8rem; }
.saFloatingNoteBottom { bottom: 1rem; left: -0.8rem; }

.saTrustStrip {
  padding: 1rem 0;
  background: var(--color-deep-rose);
  color: white;
}

.saTrustStripInner {
  display: grid;
  gap: 0.65rem;
}

.saTrustStripInner span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.09);
  font-weight: 850;
  text-align: center;
}

.saSection {
  padding: clamp(3.5rem, 7vw, 6.25rem) 0;
}

.saSectionHeader {
  max-width: 760px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
  text-align: center;
}

.saSectionHeader h2,
.saSplitCopy h2,
.saPainCopy h2,
.saPainCard h2,
.saScheduleCopy h2,
.saUrgencyInner h2 {
  margin: 0 0 0.85rem;
  font-size: clamp(2rem, 4.8vw, 3.65rem);
  line-height: 1.02;
  letter-spacing: -0.045em;
}

.saSectionHeader p,
.saSplitCopy p,
.saPainCopy p,
.saPainCard p,
.saScheduleCopy p,
.saUrgencyInner p {
  color: var(--color-text-gray);
  font-size: 1.08rem;
  line-height: 1.78;
}

.saStateGrid {
  display: grid;
  gap: 1rem;
}

.saStateCard,
.saStepCard,
.saIncludedCard,
.saPainCard,
.saFormShell {
  border: 1px solid rgba(255, 216, 232, 0.9);
  border-radius: 1.55rem;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-card);
}

.saStateCard {
  position: relative;
  overflow: hidden;
  display: block;
  min-height: 230px;
  padding: 1.35rem;
  transition: transform var(--transition-smooth), box-shadow var(--transition-smooth), border-color var(--transition-smooth);
}

.saStateCard::after {
  content: "";
  position: absolute;
  inset: auto -30px -55px auto;
  width: 145px;
  height: 145px;
  border-radius: 999px;
  background: rgba(255, 95, 162, 0.09);
}

.saStateCard:hover {
  border-color: rgba(231, 53, 122, 0.35);
  box-shadow: 0 22px 50px rgba(231, 53, 122, 0.13);
  transform: translateY(-5px);
}

.saStateAbbr {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 1rem;
  background: linear-gradient(135deg, var(--color-primary), var(--color-cta));
  color: white;
  font-weight: 950;
  letter-spacing: 0.05em;
  box-shadow: var(--shadow-btn);
}

.saStateCard h3 {
  margin: 1.1rem 0 0.55rem;
  font-size: 1.55rem;
}

.saStateCard p {
  color: var(--color-text-gray);
  line-height: 1.62;
}

.saTextButton {
  display: inline-flex;
  margin-top: 1rem;
  color: var(--color-cta);
  font-weight: 900;
}

.saStepsGrid,
.saIncludedGrid,
.saFaqGrid {
  display: grid;
  gap: 1rem;
}

.saStepCard,
.saIncludedCard {
  padding: 1.35rem;
}

.saStepCard strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-bottom: 1rem;
  border-radius: 50%;
  background: var(--color-pale-pink);
  color: var(--color-cta);
  font-family: var(--font-heading);
  font-size: 1.35rem;
}

.saStepCard h3,
.saIncludedCard h3,
.saFaqItem h3 {
  color: var(--color-deep-rose);
  font-size: 1.28rem;
}

.saStepCard p,
.saIncludedCard p {
  margin-top: 0.55rem;
  color: var(--color-text-gray);
}

.saSectionCta {
  margin-top: 2rem;
  text-align: center;
}

.saSplitGrid,
.saPainGrid,
.saScheduleGrid,
.saUrgencyInner {
  display: grid;
  gap: clamp(1.6rem, 4vw, 3.75rem);
  align-items: center;
}

.saSplitVisual img {
  aspect-ratio: 4 / 3;
}

.saCheckList {
  display: grid;
  gap: 0.72rem;
  margin: 1.25rem 0 1.6rem;
  padding: 0;
  list-style: none;
}

.saCheckList li {
  position: relative;
  padding-left: 1.85rem;
  color: #4d444d;
  font-weight: 650;
}

.saCheckList li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--color-cta);
  font-weight: 950;
}

.saIncludedCard span:first-child {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  margin-bottom: 1rem;
  border-radius: 1rem;
  background: #fff7fa;
  box-shadow: inset 0 0 0 1px rgba(255, 216, 232, 0.9);
  font-size: 1.45rem;
}

.saUrgencyBand {
  background: linear-gradient(135deg, var(--color-deep-rose), var(--color-cta));
  color: white;
}

.saUrgencyBand .saEyebrow,
.saUrgencyBand h2,
.saUrgencyBand p {
  color: white;
}

.saUrgencyBand .btn-primary {
  background: white;
  color: var(--color-cta);
  box-shadow: 0 18px 34px rgba(80, 0, 38, 0.18);
}

.saPainCard {
  padding: clamp(1.35rem, 4vw, 2.3rem);
  background: linear-gradient(135deg, #fff9f1 0%, #fff 100%);
}

.saCityGrid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
}

.saCityPill {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  border: 1px solid rgba(255, 216, 232, 0.95);
  border-radius: var(--radius-pill);
  background: white;
  color: var(--color-deep-rose);
  font-weight: 850;
  padding: 0.55rem 0.95rem;
  box-shadow: var(--shadow-card);
}

.saAvailabilityNote {
  max-width: 720px;
  margin: 1.5rem auto 0;
  color: var(--color-text-gray);
  font-style: italic;
  text-align: center;
}

.saFaqItem {
  background: white;
}

.saInternalLinks {
  padding: 1.3rem 0;
  background: #fff7fa;
}

.saInternalLinksInner {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  justify-content: center;
}

.saInternalLinksInner span {
  color: var(--color-text-gray);
  font-weight: 900;
}

.saInternalLinksInner a {
  border: 1px solid rgba(231, 53, 122, 0.18);
  border-radius: var(--radius-pill);
  background: white;
  color: var(--color-cta);
  font-weight: 850;
  padding: 0.48rem 0.8rem;
}

.saScheduleSection {
  background:
    radial-gradient(circle at 85% 10%, rgba(255, 216, 232, 0.85), transparent 30%),
    linear-gradient(135deg, #fff9f1 0%, #fff4f8 100%);
}

.saScheduleCopy {
  align-self: start;
}

.saMiniTrust {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-top: 1.2rem;
}

.saFormShell {
  padding: clamp(1rem, 3vw, 1.65rem);
  box-shadow: 0 24px 55px rgba(181, 31, 93, 0.12);
}

.saFormShell .wpcf7 form,
.saFormShell form {
  display: grid;
  gap: 0.9rem;
}

.saFormShell label,
.saFormShell .wpcf7-form-control-wrap {
  display: block;
}

.saFormShell input:not([type="submit"]),
.saFormShell select,
.saFormShell textarea {
  width: 100%;
  min-height: 48px;
  border: 1px solid rgba(181, 31, 93, 0.16);
  border-radius: 0.85rem;
  background: #fff;
  color: var(--color-text-dark);
  font: inherit;
  padding: 0.8rem 0.95rem;
}

.saFormShell textarea {
  min-height: 120px;
  resize: vertical;
}

.saFormShell input[type="submit"],
.saFormShell button[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  border: 0;
  border-radius: var(--radius-pill);
  background: linear-gradient(135deg, var(--color-primary), var(--color-cta));
  color: white;
  font-weight: 900;
  padding: 0.9rem 1.5rem;
  box-shadow: var(--shadow-btn);
  cursor: pointer;
}

.saFormFallbackNote {
  margin-top: 1rem;
  color: var(--color-text-gray);
  font-size: 0.95rem;
}

.saFormFallbackNote a {
  color: var(--color-cta);
  font-weight: 850;
}

@media (min-width: 640px) {
  .saStateGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .saStepsGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .saIncludedGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .saFaqGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .saTrustStripInner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 900px) {
  .saHeroGrid,
  .saSplitGrid,
  .saPainGrid,
  .saScheduleGrid {
    grid-template-columns: minmax(0, 1.05fr) minmax(330px, 0.95fr);
  }

  .saStateHero .saHeroGrid {
    grid-template-columns: minmax(0, 1.02fr) minmax(360px, 0.98fr);
  }

  .saStateGrid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .saStepsGrid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .saIncludedGrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .saTrustStripInner { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .saUrgencyInner { grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1fr) auto; }
  .saScheduleCopy { position: sticky; top: 110px; }
}

@media (max-width: 700px) {
  .saHero { padding-top: 2.6rem; }
  .saHeroActions .btn { width: 100%; }
  .saHeroVisual { width: min(100%, 430px); }
  .saFloatingNote {
    position: static;
    display: inline-flex;
    margin: 0.75rem 0.35rem 0 0;
    font-size: 0.9rem;
  }
  .saStateCard { min-height: auto; }
  .saInternalLinksInner { justify-content: flex-start; }
}

/* Service Area layout safety rails
   These scoped rules keep future state/service pages from inheriting older
   hero/header spacing rules that can flip columns, push the image below the
   fold, or let the oversized logo overlap the funnel headline. */
body.tpc-service-funnel-page .header {
  isolation: isolate;
}

body.tpc-service-funnel-page .header-container {
  min-height: 58px;
}

body.tpc-service-funnel-page .logo {
  height: auto;
  min-height: 52px;
  width: clamp(140px, 18vw, 190px);
  overflow: visible;
}

body.tpc-service-funnel-page .logo img {
  position: static !important;
  display: block;
  width: min(100%, 190px) !important;
  max-width: 100% !important;
  max-height: 72px !important;
  object-fit: contain;
  transform-origin: center left;
}

.header + .serviceFunnel .saHero,
body.tpc-service-funnel-page .serviceFunnel .saHero {
  min-height: auto !important;
  padding-top: clamp(4.75rem, 7vw, 7rem) !important;
  padding-bottom: clamp(3.25rem, 6vw, 5.75rem) !important;
  overflow: clip !important;
}

.serviceFunnel .saHeroGrid {
  display: grid !important;
  grid-template-areas:
    "copy"
    "visual" !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: clamp(1.75rem, 4vw, 3.5rem) !important;
  align-items: center !important;
}

.serviceFunnel .saHeroCopy {
  grid-area: copy !important;
  align-self: center !important;
  justify-self: start !important;
  max-width: 760px !important;
  margin: 0 !important;
}

.serviceFunnel .saHeroVisual {
  grid-area: visual !important;
  align-self: center !important;
  justify-self: center !important;
  width: min(100%, 560px) !important;
  margin: 0 !important;
}

.serviceFunnel .saHero h1 {
  max-width: 760px;
  font-size: clamp(2.65rem, 6.4vw, 5.15rem) !important;
  line-height: 0.98 !important;
  text-wrap: balance;
}

@media (min-width: 900px) {
  .serviceFunnel .saHeroGrid {
    grid-template-areas: "copy visual" !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(340px, 0.95fr) !important;
  }

  .serviceFunnel .saHeroCopy {
    justify-self: start !important;
  }

  .serviceFunnel .saHeroVisual {
    justify-self: end !important;
  }
}

@media (max-width: 700px) {
  body.tpc-service-funnel-page .header-container {
    min-height: 50px;
  }

  body.tpc-service-funnel-page .logo {
    min-height: 44px;
    width: min(42vw, 150px);
  }

  body.tpc-service-funnel-page .logo img {
    max-height: 56px !important;
  }

  .header + .serviceFunnel .saHero,
  body.tpc-service-funnel-page .serviceFunnel .saHero {
    padding-top: 3.25rem !important;
  }
}

/* Service Area section spacing guardrails v2 */
body.tpc-service-funnel-page .serviceFunnel .saSection {
  min-height: 0 !important;
  padding-top: clamp(3.75rem, 6vw, 5.75rem) !important;
  padding-bottom: clamp(3.75rem, 6vw, 5.75rem) !important;
  overflow: clip;
}

body.tpc-service-funnel-page .serviceFunnel .saStatePickerSection {
  padding-bottom: clamp(2.75rem, 5vw, 4.5rem) !important;
}

.serviceFunnel .saMapSection {
  padding-top: clamp(2rem, 4vw, 3.5rem) !important;
  background:
    radial-gradient(circle at 86% 18%, rgba(255, 216, 232, 0.85), transparent 32%),
    linear-gradient(135deg, #ffffff 0%, #fff9f1 100%);
}

.serviceFunnel .saMapGrid {
  display: grid !important;
  grid-template-areas:
    "copy"
    "map" !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: clamp(1.4rem, 4vw, 3.25rem) !important;
  align-items: center !important;
}

.serviceFunnel .saMapCopy {
  grid-area: copy !important;
  max-width: 560px;
}

.serviceFunnel .saMapCopy h2 {
  margin: 0 0 0.85rem;
  font-size: clamp(2rem, 4.5vw, 3.35rem);
  line-height: 1.02;
  letter-spacing: -0.045em;
}

.serviceFunnel .saMapCopy p {
  margin-bottom: 1.4rem;
  color: var(--color-text-gray);
  font-size: 1.08rem;
  line-height: 1.75;
}

.serviceFunnel .saMapCard {
  grid-area: map !important;
  margin: 0 !important;
  border: 1px solid rgba(255, 216, 232, 0.92);
  border-radius: 2rem;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 28px 70px rgba(181, 31, 93, 0.12);
  overflow: hidden;
}

.serviceFunnel .saMapCard img {
  display: block;
  width: 100%;
  height: auto;
}

.serviceFunnel .saMapCard figcaption {
  margin: 0;
  padding: 0.85rem 1rem 1rem;
  color: var(--color-text-gray);
  font-size: 0.92rem;
  line-height: 1.45;
  text-align: center;
}

.serviceFunnel .saSplitGrid,
.serviceFunnel .saScheduleGrid,
.serviceFunnel .saUrgencyInner {
  align-items: center !important;
}

.serviceFunnel .saSplitGrid {
  grid-template-areas:
    "copy"
    "visual" !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

.serviceFunnel .saSplitCopy {
  grid-area: copy !important;
  align-self: center !important;
  max-width: 650px;
}

.serviceFunnel .saSplitVisual {
  grid-area: visual !important;
  align-self: center !important;
  justify-self: center !important;
  width: min(100%, 560px);
}

.serviceFunnel .saSplitVisual img {
  display: block;
  width: 100%;
}

.serviceFunnel .saUrgencyBand {
  padding-top: clamp(3.5rem, 5vw, 5rem) !important;
  padding-bottom: clamp(3.5rem, 5vw, 5rem) !important;
}

.serviceFunnel .saUrgencyInner {
  grid-template-areas:
    "copy"
    "text"
    "cta" !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: clamp(1rem, 3vw, 2.5rem) !important;
}

.serviceFunnel .saUrgencyInner > div {
  grid-area: copy !important;
  max-width: 620px;
}

.serviceFunnel .saUrgencyInner > p {
  grid-area: text !important;
  max-width: 680px;
  margin: 0 !important;
}

.serviceFunnel .saUrgencyInner > .btn {
  grid-area: cta !important;
  justify-self: start !important;
}

.serviceFunnel .saUrgencyInner h2 {
  max-width: 620px;
  font-size: clamp(2rem, 4.1vw, 3.35rem) !important;
  line-height: 1.02 !important;
  text-wrap: balance;
}

.serviceFunnel .saScheduleGrid {
  grid-template-areas:
    "copy"
    "form" !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: start !important;
}

.serviceFunnel .saScheduleCopy {
  grid-area: copy !important;
  position: static !important;
  top: auto !important;
  max-width: 620px;
}

.serviceFunnel .saFormShell {
  grid-area: form !important;
  width: 100%;
  max-width: 640px;
}

@media (min-width: 900px) {
  .serviceFunnel .saMapGrid {
    grid-template-areas: "copy map" !important;
    grid-template-columns: minmax(280px, 0.65fr) minmax(0, 1.35fr) !important;
  }

  .serviceFunnel .saSplitGrid {
    grid-template-areas: "copy visual" !important;
    grid-template-columns: minmax(0, 0.98fr) minmax(360px, 1.02fr) !important;
  }

  .serviceFunnel .saSplitVisual {
    justify-self: end !important;
  }

  .serviceFunnel .saUrgencyInner {
    grid-template-areas: "copy text cta" !important;
    grid-template-columns: minmax(380px, 0.95fr) minmax(360px, 1.1fr) auto !important;
  }

  .serviceFunnel .saUrgencyInner > .btn {
    justify-self: end !important;
  }

  .serviceFunnel .saScheduleGrid {
    grid-template-areas: "copy form" !important;
    grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1fr) !important;
  }

  .serviceFunnel .saFormShell {
    justify-self: end !important;
  }
}

@media (max-width: 700px) {
  body.tpc-service-funnel-page .serviceFunnel .saSection {
    padding-top: 3.25rem !important;
    padding-bottom: 3.25rem !important;
  }

  .serviceFunnel .saMapCard {
    border-radius: 1.35rem;
  }
}