/* ==========================================================================
   حياة طفلي (Hayat Tifli) — Official Design System & Stylesheet
   Version: 1.1.0
   Brand Palette: Brand Green (#2E9B2B), Dark Green (#247B2C), Soft Coral (#F4A38C),
                  Coral Pink (#FF7174), Warm Cream (#FFF9ED), Teal (#16877E)
   ========================================================================== */

@font-face { font-family: 'Cairo'; font-style: normal; font-weight: 200 1000; font-display: swap; src: url('/assets/fonts/cairo-variable.woff2') format('woff2'); }

:root {
  --brand-green: #2E9B2B;
  --dark-green: #247B2C;
  --light-green: #8BD436;
  --soft-coral: #F4A38C;
  --coral-pink: #FF7174;
  --warm-cream: #FFF9ED;
  --cream-alt: #FBF6EB;
  --teal: #16877E;
  --teal-light: #E0F5F3;
  --deep-slate: #24343B;
  --muted-slate: #5E7166;
  --border-light: #E7EFE4;
  --bg-card: #FFFFFF;
  --shadow-sm: 0 4px 12px rgba(36, 52, 59, 0.05);
  --shadow-md: 0 10px 30px rgba(46, 155, 43, 0.08);
  --shadow-lg: 0 20px 45px rgba(36, 52, 59, 0.12);
  --shadow-glow: 0 0 35px rgba(139, 212, 54, 0.25);
  --radius-full: 9999px;
  --radius-xl: 28px;
  --radius-lg: 20px;
  --radius-md: 14px;
  --radius-sm: 8px;
  --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

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

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

body {
  font-family: 'Cairo', 'Tajawal', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  direction: rtl;
  text-align: right;
  background-color: var(--warm-cream);
  color: var(--deep-slate);
  line-height: 1.7;
  overflow-x: hidden;
  position: relative;
}

/* Background Subtle Gradient Blobs */
.bg-decor {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
  z-index: -1;
  pointer-events: none;
  opacity: 0.45;
}
.bg-decor-1 {
  width: 450px;
  height: 450px;
  background: radial-gradient(circle, #8BD436 0%, #2E9B2B 100%);
  top: -100px;
  right: -100px;
}
.bg-decor-2 {
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, #F4A38C 0%, #FF7174 100%);
  top: 600px;
  left: -150px;
}
.bg-decor-3 {
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, #E0F5F3 0%, #16877E 100%);
  bottom: 800px;
  right: -100px;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Cairo', sans-serif;
  color: var(--deep-slate);
  font-weight: 800;
  line-height: 1.3;
}

p {
  color: var(--muted-slate);
  font-size: 1.05rem;
}

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

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

/* Container */
.container {
  width: 100%;
  max-width: 1240px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
}

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 28px;
  font-size: 1.05rem;
  font-weight: 700;
  border-radius: var(--radius-full);
  cursor: pointer;
  border: 2px solid transparent;
  transition: var(--transition-normal);
  text-align: center;
  white-space: nowrap;
}

.btn-primary {
  background: linear-gradient(135deg, var(--brand-green) 0%, var(--dark-green) 100%);
  color: #FFFFFF;
  box-shadow: 0 8px 22px rgba(46, 155, 43, 0.28);
}
.btn-primary:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(46, 155, 43, 0.38);
  background: linear-gradient(135deg, #35b032 0%, #247B2C 100%);
}

.btn-secondary {
  background: #FFFFFF;
  color: var(--dark-green);
  border-color: var(--border-light);
  box-shadow: var(--shadow-sm);
}
.btn-secondary:hover {
  border-color: var(--brand-green);
  color: var(--brand-green);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

.btn-coral {
  background: linear-gradient(135deg, var(--soft-coral) 0%, var(--coral-pink) 100%);
  color: #FFFFFF;
  box-shadow: 0 8px 22px rgba(255, 113, 116, 0.28);
}
.btn-coral:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(255, 113, 116, 0.38);
}

.btn-store {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  background: #1e292e;
  color: #FFFFFF;
  padding: 11px 24px;
  border-radius: var(--radius-lg);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15);
  transition: var(--transition-normal);
}
.btn-store:hover {
  background: #12191c;
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.25);
  color: #FFFFFF;
}
.btn-store svg {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
}
.btn-store-text {
  display: flex;
  flex-direction: column;
  text-align: right;
  line-height: 1.2;
}
.btn-store-text span:first-child {
  font-size: 0.72rem;
  color: #A0B2A6;
  font-weight: 500;
}
.btn-store-text span:last-child {
  font-size: 1.15rem;
  font-weight: 800;
  color: #FFFFFF;
}

/* Badges */
.badge-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 18px;
  background-color: rgba(46, 155, 43, 0.1);
  color: var(--dark-green);
  border: 1px solid rgba(46, 155, 43, 0.2);
  border-radius: var(--radius-full);
  font-size: 0.9rem;
  font-weight: 700;
}
.badge-pill.coral {
  background-color: rgba(255, 113, 116, 0.1);
  color: #D84A4D;
  border-color: rgba(255, 113, 116, 0.25);
}

/* Header & Navbar */
.site-header {
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background: rgba(255, 249, 237, 0.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(231, 239, 228, 0.8);
  transition: var(--transition-normal);
}
.site-header.scrolled {
  background: rgba(255, 255, 255, 0.97);
  box-shadow: var(--shadow-sm);
}
.nav-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 84px;
}
.brand-logo {
  display: flex;
  align-items: center;
  gap: 12px;
}
.brand-logo img.logo-img {
  height: 52px;
  width: auto;
  object-fit: contain;
}
.nav-links {
  display: flex;
  align-items: center;
  gap: 28px;
  list-style: none;
}
.nav-link {
  font-size: 1.02rem;
  font-weight: 700;
  color: var(--deep-slate);
  position: relative;
  padding: 6px 2px;
}
.nav-link:hover, .nav-link.active {
  color: var(--brand-green);
}
.nav-link::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0;
  height: 2.5px;
  background: var(--brand-green);
  border-radius: var(--radius-full);
  transition: var(--transition-fast);
}
.nav-link:hover::after, .nav-link.active::after {
  width: 100%;
}
.nav-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}
.menu-toggle {
  display: none;
  background: none;
  border: none;
  font-size: 1.7rem;
  color: var(--deep-slate);
  cursor: pointer;
  padding: 6px;
}

/* Mobile Nav Drawer */
.mobile-nav {
  display: none;
  position: fixed;
  top: 84px;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.98);
  backdrop-filter: blur(16px);
  padding: 30px 24px;
  z-index: 999;
  flex-direction: column;
  gap: 20px;
  overflow-y: auto;
  border-top: 1px solid var(--border-light);
}
.mobile-nav.open {
  display: flex;
}
.mobile-nav .nav-link {
  font-size: 1.25rem;
  padding: 12px 0;
  border-bottom: 1px solid var(--border-light);
}

/* Hero Section */
.hero-section {
  padding: 60px 0 90px;
  position: relative;
  overflow: hidden;
}
.hero-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 50px;
  align-items: center;
}
.hero-content {
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.hero-title {
  font-size: 3.2rem;
  line-height: 1.22;
  font-weight: 900;
  color: var(--deep-slate);
}
.hero-title .highlight {
  background: linear-gradient(135deg, var(--brand-green) 0%, var(--dark-green) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.hero-description {
  font-size: 1.22rem;
  color: var(--muted-slate);
  line-height: 1.75;
}
.hero-cta-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-top: 10px;
}
.hero-trust-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 20px;
  margin-top: 14px;
  padding-top: 20px;
  border-top: 1px dashed rgba(94, 113, 102, 0.25);
}
.trust-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--deep-slate);
}
.trust-icon {
  width: 22px;
  height: 22px;
  color: var(--brand-green);
}

/* Phone Mockup */
.hero-visual {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.phone-mockup-wrapper {
  position: relative;
  width: 320px;
  max-width: 100%;
}
.phone-case {
  background: #1E292E;
  border-radius: 46px;
  padding: 12px;
  box-shadow: 0 25px 60px rgba(36, 52, 59, 0.25), 0 0 0 4px #364952;
  position: relative;
}
.phone-screen {
  background: #FFFFFF;
  border-radius: 36px;
  overflow: hidden;
  position: relative;
  aspect-ratio: 1080 / 2280;
}
.phone-screen img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.phone-notch {
  position: absolute;
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
  width: 90px;
  height: 18px;
  background: #1E292E;
  border-radius: 12px;
  z-index: 10;
}

/* Floating feature cards around mockup */
.float-card {
  position: absolute;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  padding: 12px 18px;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 700;
  font-size: 0.92rem;
  border: 1px solid var(--border-light);
  animation: floatAnim 4s ease-in-out infinite alternate;
  z-index: 15;
}
.float-card-1 {
  top: 15%;
  right: -30px;
  animation-delay: 0s;
}
.float-card-2 {
  bottom: 18%;
  left: -35px;
  animation-delay: 2s;
}
.float-card-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--warm-cream);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
}

@keyframes floatAnim {
  0% { transform: translateY(0); }
  100% { transform: translateY(-12px); }
}

/* Stats Ribbon */
.stats-ribbon {
  background: #FFFFFF;
  border-radius: var(--radius-xl);
  padding: 40px 30px;
  box-shadow: var(--shadow-md);
  margin: -30px auto 80px;
  position: relative;
  z-index: 20;
  border: 1px solid var(--border-light);
}
.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  text-align: center;
}
.stat-box {
  position: relative;
}
.stat-box:not(:last-child)::after {
  content: '';
  position: absolute;
  left: -15px;
  top: 15%;
  height: 70%;
  width: 1px;
  background: var(--border-light);
}
.stat-number {
  font-size: 2.5rem;
  font-weight: 900;
  color: var(--brand-green);
  line-height: 1.1;
  margin-bottom: 6px;
}
.stat-number.coral {
  color: var(--coral-pink);
}
.stat-number.teal {
  color: var(--teal);
}
.stat-label {
  font-size: 1rem;
  color: var(--deep-slate);
  font-weight: 700;
}
.stat-sub {
  font-size: 0.82rem;
  color: var(--muted-slate);
  margin-top: 4px;
}

/* Section Common */
.section {
  padding: 80px 0;
  position: relative;
}
.section-header {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 55px;
}
.section-subtitle {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--brand-green);
  margin-bottom: 8px;
  display: inline-block;
}
.section-title {
  font-size: 2.4rem;
  font-weight: 800;
  color: var(--deep-slate);
  margin-bottom: 16px;
  line-height: 1.3;
}
.section-desc {
  font-size: 1.15rem;
  color: var(--muted-slate);
}

/* Features Grid */
.features-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
.feature-card {
  background: #FFFFFF;
  border-radius: var(--radius-xl);
  padding: 34px 28px;
  border: 1px solid var(--border-light);
  box-shadow: var(--shadow-sm);
  transition: var(--transition-normal);
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
  overflow: hidden;
}
.feature-card:hover {
  transform: translateY(-8px);
  box-shadow: var(--shadow-md);
  border-color: rgba(46, 155, 43, 0.3);
}
.feature-card::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 5px;
  background: linear-gradient(90deg, var(--brand-green), var(--light-green));
  opacity: 0;
  transition: var(--transition-fast);
}
.feature-card:hover::before {
  opacity: 1;
}
.feature-card.coral::before {
  background: linear-gradient(90deg, var(--soft-coral), var(--coral-pink));
}
.feature-card.teal::before {
  background: linear-gradient(90deg, var(--teal), #5cd4ca);
}
.feature-icon-wrapper {
  width: 64px;
  height: 64px;
  border-radius: var(--radius-lg);
  background: rgba(46, 155, 43, 0.1);
  color: var(--brand-green);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.8rem;
  flex-shrink: 0;
}
.feature-card.coral .feature-icon-wrapper {
  background: rgba(255, 113, 116, 0.12);
  color: var(--coral-pink);
}
.feature-card.teal .feature-icon-wrapper {
  background: rgba(22, 135, 126, 0.12);
  color: var(--teal);
}
.feature-title {
  font-size: 1.35rem;
  font-weight: 800;
  color: var(--deep-slate);
}
.feature-text {
  font-size: 1rem;
  color: var(--muted-slate);
  line-height: 1.65;
}

/* Interactive Calculator Preview Section */
.calc-section {
  background: linear-gradient(180deg, #FFFFFF 0%, var(--warm-cream) 100%);
  border-radius: var(--radius-xl);
  padding: 60px 40px;
  border: 1px solid var(--border-light);
  box-shadow: var(--shadow-md);
  margin: 60px auto;
}
.calc-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
}
.calc-form {
  background: #FFFFFF;
  padding: 30px;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--border-light);
}
.form-group {
  margin-bottom: 20px;
}
.form-label {
  display: block;
  font-weight: 700;
  margin-bottom: 8px;
  color: var(--deep-slate);
}
.form-control {
  width: 100%;
  padding: 13px 18px;
  border: 1.5px solid #D5E2D2;
  border-radius: var(--radius-md);
  font-family: inherit;
  font-size: 1rem;
  background-color: #FAFDF9;
  color: var(--deep-slate);
  transition: var(--transition-fast);
}
.form-control:focus {
  outline: none;
  border-color: var(--brand-green);
  background-color: #FFFFFF;
  box-shadow: 0 0 0 4px rgba(46, 155, 43, 0.12);
}
.calc-result-box {
  background: linear-gradient(135deg, rgba(46, 155, 43, 0.08) 0%, rgba(139, 212, 54, 0.08) 100%);
  border: 1.5px dashed var(--brand-green);
  border-radius: var(--radius-lg);
  padding: 24px;
  text-align: center;
}
.calc-result-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--dark-green);
}
.calc-result-val {
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--brand-green);
  margin: 10px 0;
}
.calc-result-sub {
  font-size: 0.95rem;
  color: var(--muted-slate);
}

/* Screenshots Showcase Section */
.showcase-slider {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding: 20px 10px 40px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--brand-green) #E7EFE4;
}
.showcase-slider::-webkit-scrollbar {
  height: 8px;
}
.showcase-slider::-webkit-scrollbar-thumb {
  background: var(--brand-green);
  border-radius: 4px;
}
.showcase-item {
  flex: 0 0 260px;
  scroll-snap-align: center;
  background: #FFFFFF;
  border-radius: var(--radius-lg);
  padding: 14px;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--border-light);
  transition: var(--transition-normal);
  text-align: center;
}
.showcase-item:hover {
  transform: translateY(-8px);
  box-shadow: var(--shadow-lg);
  border-color: var(--brand-green);
}
.showcase-item img {
  border-radius: var(--radius-md);
  width: 100%;
  height: auto;
  margin-bottom: 12px;
}
.showcase-caption {
  font-weight: 800;
  font-size: 1rem;
  color: var(--deep-slate);
  margin-bottom: 4px;
}
.showcase-desc {
  font-size: 0.85rem;
  color: var(--muted-slate);
}

/* Compliance & Security Banner */
.compliance-section {
  background: #FFFFFF;
  border-radius: var(--radius-xl);
  padding: 50px 40px;
  border: 1px solid var(--border-light);
  box-shadow: var(--shadow-md);
  margin: 60px 0;
}
.compliance-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 40px;
  align-items: center;
}
.compliance-badges-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.compliance-badge-card {
  background: #F8FAF7;
  border: 1px solid #E2EDE0;
  border-radius: var(--radius-lg);
  padding: 18px;
  display: flex;
  align-items: center;
  gap: 14px;
}
.compliance-badge-card svg {
  width: 32px;
  height: 32px;
  color: var(--brand-green);
  flex-shrink: 0;
}
.compliance-badge-info h4 {
  font-size: 1rem;
  font-weight: 800;
  color: var(--deep-slate);
}
.compliance-badge-info p {
  font-size: 0.82rem;
  color: var(--muted-slate);
  line-height: 1.35;
  margin: 0;
}

/* FAQ Accordion */
.faq-list {
  max-width: 840px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.faq-item {
  background: #FFFFFF;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border-light);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition: var(--transition-fast);
}
.faq-item.active {
  border-color: var(--brand-green);
  box-shadow: var(--shadow-md);
}
.faq-question {
  padding: 22px 28px;
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--deep-slate);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  user-select: none;
}
.faq-icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--warm-cream);
  color: var(--brand-green);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 1.2rem;
  transition: var(--transition-fast);
  flex-shrink: 0;
}
.faq-item.active .faq-icon {
  transform: rotate(45deg);
  background: var(--brand-green);
  color: #FFFFFF;
}
.faq-answer {
  display: none;
  padding: 0 28px 24px;
  font-size: 1.05rem;
  color: var(--muted-slate);
  line-height: 1.75;
}
.faq-item.active .faq-answer {
  display: block;
}

/* CTA Download Section */
.cta-banner {
  background: linear-gradient(135deg, #1E292E 0%, #2A3B42 100%);
  border-radius: var(--radius-xl);
  padding: 70px 50px;
  color: #FFFFFF;
  box-shadow: var(--shadow-lg);
  margin: 60px 0 80px;
  position: relative;
  overflow: hidden;
}
.cta-banner::before {
  content: '';
  position: absolute;
  width: 350px;
  height: 350px;
  background: radial-gradient(circle, rgba(46, 155, 43, 0.45) 0%, transparent 70%);
  top: -100px;
  left: -80px;
  border-radius: 50%;
}
.cta-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 40px;
  align-items: center;
  position: relative;
  z-index: 5;
}
.cta-title {
  font-size: 2.6rem;
  font-weight: 900;
  color: #FFFFFF;
  line-height: 1.25;
  margin-bottom: 18px;
}
.cta-desc {
  font-size: 1.15rem;
  color: #B5C9BD;
  margin-bottom: 28px;
  line-height: 1.7;
}
.cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
.cta-visual {
  display: flex;
  justify-content: center;
}
.cta-visual img {
  max-height: 280px;
  width: auto;
  filter: drop-shadow(0 20px 30px rgba(0, 0, 0, 0.4));
}

/* Footer */
.site-footer {
  background: #172125;
  color: #A0B2A6;
  padding: 80px 0 35px;
  border-top: 1px solid #233137;
}
.footer-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  justify-content: center;
  margin: 28px 0 18px;
  padding: 16px 0;
  border-top: 1px solid #233137;
}
.seo-tag {
  font-size: 0.82rem;
  color: #8da473;
  direction: rtl;
  background: #1e2c31;
  padding: 4px 10px;
  border-radius: 6px;
  border: 1px solid #2a3d44;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
  gap: 40px;
  margin-bottom: 50px;
}
.footer-brand p {
  color: #8E9F94;
  margin: 18px 0 24px;
  font-size: 0.98rem;
  line-height: 1.7;
}
.footer-title {
  font-size: 1.15rem;
  font-weight: 800;
  color: #FFFFFF;
  margin-bottom: 22px;
  position: relative;
  padding-bottom: 8px;
}
.footer-title::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 32px;
  height: 2.5px;
  background: var(--brand-green);
  border-radius: var(--radius-full);
}
.footer-links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.footer-link {
  color: #9FB2A5;
  font-size: 0.95rem;
  transition: var(--transition-fast);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.footer-link:hover {
  color: #FFFFFF;
  padding-right: 6px;
}
.footer-social-row {
  display: flex;
  gap: 12px;
}
.social-icon-btn {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #233137;
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--transition-fast);
}
.social-icon-btn:hover {
  background: var(--brand-green);
  transform: translateY(-3px);
  color: #FFFFFF;
}
.footer-bottom {
  border-top: 1px solid #233137;
  padding-top: 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
  font-size: 0.9rem;
  color: #798D80;
}
.footer-bottom a {
  color: #9FB2A5;
}
.footer-bottom a:hover {
  color: #FFFFFF;
}

/* Inner Pages (Privacy, Terms, About, Contact) */
.page-hero {
  background: linear-gradient(135deg, rgba(46, 155, 43, 0.08) 0%, rgba(255, 113, 116, 0.06) 100%);
  padding: 60px 0 45px;
  border-bottom: 1px solid var(--border-light);
  margin-bottom: 50px;
}
.page-hero-title {
  font-size: 2.6rem;
  font-weight: 900;
  color: var(--deep-slate);
  margin-bottom: 12px;
}
.page-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.95rem;
  color: var(--muted-slate);
}
.page-breadcrumbs a:hover {
  color: var(--brand-green);
}
.legal-content-card {
  background: #FFFFFF;
  border-radius: var(--radius-xl);
  padding: 50px 45px;
  border: 1px solid var(--border-light);
  box-shadow: var(--shadow-sm);
  margin-bottom: 70px;
  line-height: 1.85;
}
.legal-content-card h2 {
  font-size: 1.6rem;
  color: var(--deep-slate);
  margin: 36px 0 16px;
  padding-bottom: 8px;
  border-bottom: 2px solid #EFF6EC;
}
.legal-content-card h3 {
  font-size: 1.25rem;
  color: var(--dark-green);
  margin: 24px 0 12px;
}
.legal-content-card p {
  margin-bottom: 16px;
  font-size: 1.05rem;
}
.legal-content-card ul, .legal-content-card ol {
  margin: 16px 28px 24px 0;
  color: var(--muted-slate);
  font-size: 1.02rem;
}
.legal-content-card li {
  margin-bottom: 10px;
}
.legal-alert {
  background: #FFF5F5;
  border-right: 4px solid var(--coral-pink);
  padding: 18px 22px;
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  margin: 24px 0;
  color: #7A282A;
}
.legal-alert.info {
  background: #F0F9F8;
  border-right-color: var(--teal);
  color: #0E5550;
}
.legal-alert.success {
  background: #F2F9EE;
  border-right-color: var(--brand-green);
  color: #1A5E18;
}

/* Contact Form */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 40px;
  margin-bottom: 70px;
}
.contact-info-card {
  background: #FFFFFF;
  border-radius: var(--radius-xl);
  padding: 40px 32px;
  border: 1px solid var(--border-light);
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.contact-item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.contact-icon {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-md);
  background: rgba(46, 155, 43, 0.1);
  color: var(--brand-green);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  flex-shrink: 0;
}
.contact-text h4 {
  font-size: 1.05rem;
  margin-bottom: 4px;
}
.contact-text p, .contact-text a {
  font-size: 0.95rem;
  color: var(--muted-slate);
}
.contact-form-card {
  background: #FFFFFF;
  border-radius: var(--radius-xl);
  padding: 40px 36px;
  border: 1px solid var(--border-light);
  box-shadow: var(--shadow-sm);
}

/* Responsive Breakpoints */
@media (max-width: 1024px) {
  .hero-grid {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .hero-content {
    align-items: center;
  }
  .hero-title {
    font-size: 2.7rem;
  }
  .hero-cta-group {
    justify-content: center;
  }
  .hero-trust-row {
    justify-content: center;
  }
  .features-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .calc-grid, .compliance-grid, .cta-grid, .contact-grid {
    grid-template-columns: 1fr;
  }
  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .float-card-1 {
    right: 0;
  }
  .float-card-2 {
    left: 0;
  }
}

@media (max-width: 768px) {
  .nav-links, .nav-actions .btn {
    display: none;
  }
  .menu-toggle {
    display: block;
  }
  .hero-title {
    font-size: 2.2rem;
  }
  .stats-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
  .stat-box:not(:last-child)::after {
    display: none;
  }
  .features-grid {
    grid-template-columns: 1fr;
  }
  .compliance-badges-grid {
    grid-template-columns: 1fr;
  }
  .footer-grid {
    grid-template-columns: 1fr;
  }
  .legal-content-card {
    padding: 30px 20px;
  }
  .cta-banner {
    padding: 45px 25px;
  }
  .cta-title {
    font-size: 2rem;
  }
}

/* Author display rules must preserve unavailable download controls. */
[hidden] { display: none !important; }

/* Website 1.1.0 — quiet editorial layout, shared accessibility, local typography. */
:root{--brand-green:#23744b;--dark-green:#185537;--deep-slate:#253f35;--muted-slate:#596a60;--warm-cream:#fcfaf5;--border-light:#dfe7dc}
[hidden]{display:none!important}button,input,select,textarea{font:inherit}button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #a1512e;outline-offset:5px}main:focus{outline:none}html{scroll-padding-top:110px}section[id]{scroll-margin-top:100px}body{overflow-x:clip}a{text-underline-offset:5px}p{line-height:1.9}.container{max-width:1200px}.bg-decor{display:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.skip-link{position:fixed;top:10px;right:16px;padding:12px 22px;background:#fff;color:#185537;border:2px solid;z-index:9999;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}
.site-header{position:sticky;top:0;background:rgba(252,250,245,.97);backdrop-filter:blur(14px);border-bottom:1px solid #e5e8de;box-shadow:none;z-index:100}.site-header.scrolled{background:#fcfaf5;box-shadow:0 5px 25px #253f350a}.nav-wrapper{min-height:92px;gap:32px;padding:12px 0}.logo-img{width:144px;height:auto;max-height:54px;object-fit:contain}.nav-links{gap:25px}.nav-link{font-size:.93rem;font-weight:650}.btn{border-radius:10px;padding:12px 21px;font-size:.94rem;white-space:normal;min-height:48px;line-height:1.6}.btn-primary{background:var(--brand-green);box-shadow:none}.btn-primary:hover{background:var(--dark-green);box-shadow:none;transform:translateY(-2px)}.nav-actions .btn{font-size:.85rem;padding:10px 16px}.btn svg,.text-link svg{width:19px;height:19px;flex:none}.menu-toggle{border:1px solid var(--border-light);border-radius:10px;min-width:46px;min-height:46px;align-items:center;justify-content:center}.mobile-nav{position:fixed;top:92px;left:0;right:0;max-height:calc(100dvh - 92px);overflow:auto;padding:22px 24px;background:var(--warm-cream);box-shadow:0 15px 25px #253f3515;z-index:99;transition:none}.mobile-nav.open{display:flex;visibility:visible;opacity:1;transform:none}.mobile-nav a{padding:10px 8px;border-bottom:1px solid var(--border-light)}
.home-hero{padding:66px 0 76px;overflow:hidden;background:radial-gradient(ellipse at 15% 40%,#edf1e3 0,transparent 53%)}.home-hero-grid{display:grid;grid-template-columns:1.07fr 1fr;gap:60px;align-items:center}.eyebrow{display:inline-flex;gap:9px;align-items:center;font-size:.86rem;font-weight:700;letter-spacing:0;color:var(--brand-green);margin-bottom:19px}.eyebrow svg{width:19px;height:19px}.hero-copy h1{font-size:clamp(2.7rem,4.7vw,4.1rem);font-weight:750;line-height:1.5;letter-spacing:-1.5px;margin-bottom:20px}.hero-copy h1 span{color:var(--brand-green)}.hero-lead{font-size:1.12rem;max-width:520px;line-height:2.1}.hero-buttons{display:flex;align-items:center;gap:25px;margin:30px 0 12px;flex-wrap:wrap}.btn-store{border-radius:12px;gap:13px;box-shadow:none;padding:13px 21px;background:#253f35;min-height:64px}.btn-store svg{width:24px;height:24px}.btn-store-text{gap:4px}.btn-store-text span:first-child{color:#d5e4da;font-size:.72rem}.btn-store-text span:last-child{font-family:Arial,sans-serif;font-weight:600;font-size:1.2rem}.btn-store>svg:last-child{width:18px;margin-inline-start:8px}.text-link{display:inline-flex;align-items:center;gap:9px;color:var(--brand-green);font-weight:700;font-size:.95rem}.text-link:hover{text-decoration:underline}.store-note{font-size:.74rem;line-height:1.9;color:#647469;max-width:480px}.store-note a{text-decoration:underline}.hero-promises{display:flex;gap:17px;flex-wrap:wrap;margin-top:24px;padding-top:20px;border-top:1px solid #d9e0d3;font-size:.74rem;color:#526356}.hero-promises span{display:flex;gap:4px;align-items:center}.hero-promises svg{width:16px;height:16px;color:var(--brand-green)}
.hero-composition{position:relative;display:flex;justify-content:center;align-items:center;min-height:550px}.hero-orbit{width:440px;height:440px;border-radius:50%;position:absolute;background:#e7eddc;border:1px solid #d3ddc9;outline:1px solid #dde5d3;outline-offset:23px}.device-preview{position:relative;width:242px;border:7px solid #293e34;border-radius:32px;overflow:hidden;box-shadow:-20px 28px 50px #2b4e3426;transform:rotate(-5deg);background:#fff;margin:0}.device-preview img{width:100%;height:auto}.hero-word{position:absolute;top:5px;right:14px;z-index:1;color:#7e8f69;font-size:1rem;transform:rotate(9deg)}.moment-label{position:absolute;bottom:46px;right:-8px;background:#fffefa;border:1px solid #e1e6d9;border-radius:14px;padding:17px;display:flex;gap:12px;align-items:center;box-shadow:0 9px 25px #304c3510}.moment-label>span{background:#f8e5dc;color:#aa6047;display:grid;place-items:center;border-radius:50%;width:45px;height:45px}.moment-label strong{display:block;font-size:.85rem}.moment-label small{font-size:.7rem;color:var(--muted-slate)}.leaf{position:absolute;width:60px;height:100px;background:#9fb987;border-radius:70% 0 70% 0;transform:rotate(28deg);bottom:74px;left:27px}.leaf-two{width:40px;height:70px;left:0;bottom:61px;transform:rotate(-24deg);background:#c4d2ac}
.journey-strip{background:#f0f2e9;border-block:1px solid #e4e7da;padding:24px 0}.journey-strip .container{display:flex;align-items:center;justify-content:space-between;gap:20px}.journey-strip span{font-size:.85rem;color:#68785d}.journey-strip p{font-size:1.1rem;font-weight:650;color:#465d41;display:flex;gap:32px;align-items:center}.journey-strip i{font-style:normal;font-size:1rem;color:#8da473}
.section{padding:86px 0}h2{font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.65;font-weight:750;letter-spacing:-.6px}.section-heading{display:grid;grid-template-columns:1.2fr 1fr;gap:90px;align-items:end;margin-bottom:42px}.section-heading p{font-size:1rem;max-width:440px;padding-bottom:8px}.care-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.care-card{padding:30px 27px;border:1px solid #e3e7dc;border-radius:18px;background:#fffefa}.care-card h3{font-size:1.12rem;line-height:1.7;margin:18px 0 9px}.care-card p{font-size:.9rem;line-height:1.9}.care-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#e8efdf;color:#3a713b}.blue .care-icon{background:#e5eff3;color:#367590}.rose .care-icon{background:#f5e4e7;color:#a65270}.peach .care-icon{background:#f9eada;color:#a06d35}.sage .care-icon{background:#e6eeeb;color:#3c796a}.lavender .care-icon{background:#ece6f3;color:#7d5d9f}.section-footnote{font-size:.78rem;margin-top:24px;color:#687469}.soft-section{background:#f3f1e9}.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:86px;align-items:center}.story-copy>p{margin:22px 0;font-size:1rem}.story-list{list-style:none;display:grid;gap:14px;font-size:.87rem;color:#4e6355;margin:24px 0 30px}.story-list li{display:flex;gap:12px}.story-list svg{width:18px;height:18px;flex:none;margin-top:5px;color:var(--brand-green)}.screen-pair{display:flex;gap:14px;align-items:start;flex-wrap:wrap;justify-content:center}.screen-pair figure{width:calc(33.333% - 10px);min-width:110px;margin:0;background:#fff;border:1px solid #d5dbd0;padding:6px;border-radius:18px;overflow:hidden;box-shadow:0 15px 35px #263e3510;transition:transform .25s ease}.screen-pair figure:hover{transform:translateY(-4px)}.screen-pair figure:nth-child(1){margin-top:0}.screen-pair figure:nth-child(2){margin-top:24px}.screen-pair figure:nth-child(3){margin-top:48px}.screen-pair img{border-radius:13px;width:100%;height:auto;display:block}.screen-pair figcaption{text-align:center;font-size:.76rem;font-weight:650;padding:8px 4px;color:#253f35}.screen-pair>p{font-size:.72rem;text-align:center;flex-basis:100%;color:#596a60;margin-top:8px}.store-showcase-container{margin-top:48px}.store-showcase-card{background:#fff;border:1px solid #dbe2d6;border-radius:24px;padding:36px 32px;box-shadow:0 18px 40px #253f350d;text-align:center}.store-showcase-header{max-width:680px;margin:0 auto 26px}.store-showcase-header h3{font-size:1.55rem;font-weight:750;color:#185537;margin:10px 0 12px;line-height:1.5}.store-showcase-header p{font-size:.96rem;color:#49584e;line-height:1.8}.store-showcase-figure{margin:0;border-radius:18px;overflow:hidden;border:1px solid #dbe2d6;box-shadow:0 12px 30px #253f3512;background:#f8faf6}.store-showcase-figure img{width:100%;height:auto;display:block}.store-showcase-figure figcaption{font-size:.82rem;font-weight:600;color:#596a60;padding:12px;background:#fcfaf5;border-top:1px solid #e5ebd9;text-align:center}.about-hero-img{margin:0 0 28px;border-radius:20px;overflow:hidden;border:1px solid #dbe2d6;box-shadow:0 12px 32px #253f350f}.about-hero-img img{width:100%;height:auto;display:block}
.due-date-panel{background:#f4f1e6;border:1px solid #e5decb;border-radius:24px;display:grid;grid-template-columns:1fr 1.05fr;gap:70px;padding:48px}.calculator-intro>p{margin:17px 0;font-size:.96rem}.calculator-disclosure{border-right:3px solid #ab9469;padding-right:14px;color:#776b54;font-size:.8rem;line-height:1.9;margin:22px 0}.small-link{font-size:.78rem}.calc-form{padding:28px;box-shadow:none;border-radius:16px}.calc-form .btn{width:100%;margin-top:20px}.form-control{min-width:0;min-height:50px;border-radius:9px;background:#fff;font-size:1rem}.form-label{font-size:.9rem}.form-hint{font-size:.76rem!important;margin-top:10px!important;line-height:1.8;color:#67766b}.form-error{color:#a12e36;font-size:.83rem;margin-top:12px}.form-error:empty{display:none}.calc-result-box{margin-top:15px;border:1px solid #bdd3b8;background:#eaf2e3;padding:22px;border-radius:16px}.calc-result-val{font-size:1.6rem}.calc-result-sub{font-size:.8rem;margin-top:8px}
.privacy-section{background:#edf2e9}.privacy-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:100px;align-items:center}.privacy-grid>div>p{font-size:1rem;margin:20px 0}.privacy-symbol{border-radius:50% 50% 24px 24px;background:#dce7d2;min-height:330px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;color:#476e3c;border:1px solid #c5d6b7}.privacy-symbol>svg{width:95px;height:95px;stroke-width:1}.privacy-symbol span{text-align:center;line-height:1.9;font-weight:600}.privacy-links{display:flex;flex-wrap:wrap;gap:20px;align-items:center;margin-top:26px}.privacy-grid .privacy-caption{font-size:.74rem;color:#657461}.faq-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:75px}.faq-layout>div>p{margin-top:23px;font-size:.93rem}.faq-list{gap:0;margin:0;max-width:none;display:block}.faq-item{border:0;border-bottom:1px solid #dce3d7;border-radius:0;background:transparent;box-shadow:none}.faq-item summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 0;font-size:.97rem;font-weight:650}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary>span{font-size:1.4rem;color:#5d7c52;font-family:Arial,sans-serif;flex:none}.faq-item[open] summary>span{transform:rotate(45deg)}.faq-body{padding:0 0 24px;color:var(--muted-slate);font-size:.9rem;line-height:2}.faq-body a{color:var(--brand-green);text-decoration:underline}
.download-section{padding:5px 0 70px}.download-panel{display:grid;grid-template-columns:82px 1fr auto;gap:28px;align-items:center;border-radius:24px;background:#e8efde;padding:38px 32px}.download-panel>img{border-radius:22px}.download-panel .eyebrow{margin-bottom:8px}.download-panel h2{font-size:1.5rem;letter-spacing:0}.download-panel p{font-size:.88rem;margin-top:7px}.download-panel .store-note,.store-availability{font-size:.73rem!important}.download-action{display:flex;flex-direction:column;gap:16px;align-items:center}.download-action .text-link{font-size:.8rem}.site-footer{background:#203d30;color:#d0decf;border:0;padding:55px 0 25px}.footer-grid{grid-template-columns:1.25fr .8fr 1fr 1.2fr;gap:35px;margin-bottom:40px}.footer-brand>img{background:#fcfaf5;border-radius:7px;padding:7px;width:150px;height:auto}.footer-brand p,.site-footer p{color:#c0d0bf;font-size:.83rem;line-height:2}.footer-links a{font-size:.84rem;color:#d1dfce}.footer-links a:hover,.footer-email:hover{color:#fff;text-decoration:underline}.footer-title{font-size:.93rem;margin-bottom:14px}.footer-title::after{display:none}.footer-email{font-size:.86rem;overflow-wrap:anywhere;display:inline-block;margin-bottom:15px;color:#e2ecdc}.footer-bottom{border-color:#49614e;padding-top:22px}.footer-bottom p{font-size:.75rem}.footer-legal-links{display:flex;justify-content:center;gap:12px 24px;flex-wrap:wrap;margin:10px 0 24px;font-size:.83rem}.footer-legal-links a:hover{text-decoration:underline}.page-hero{background:#f0f2e9;margin-bottom:36px;padding:40px 0}.page-hero-title{font-size:2.15rem;margin-top:20px}.page-intro{max-width:760px;font-size:1rem}.legal-content-card{padding:38px;overflow-wrap:anywhere}.legal-content-card h1{font-size:2rem;line-height:1.6}.legal-content-card a{color:var(--brand-green);text-decoration:underline}.legal-content-card p{font-size:1rem}.contact-card-title{font-size:1.3rem}.contact-text h3{font-size:1rem;margin-bottom:6px}.contact-submit{width:100%;margin-top:10px}.contact-text a{overflow-wrap:anywhere}.error-page{min-height:80vh;padding:60px 24px;display:grid;place-items:center}.error-card{max-width:650px;text-align:center;padding:40px;background:#fff;border:1px solid var(--border-light);border-radius:24px}.error-code{font-size:6rem;font-weight:800;color:var(--brand-green);line-height:1.3}.error-card h1{font-size:1.8rem;margin:20px 0}.error-actions{display:flex;gap:15px;flex-wrap:wrap;justify-content:center;margin-top:25px}

/* Promotional Award Badge */
.hero-award-badge{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(135deg,rgba(35,116,75,.12) 0%,rgba(217,169,74,.22) 100%);border:1px solid rgba(217,169,74,.5);color:#174a30;padding:8px 18px;border-radius:999px;font-size:.88rem;font-weight:750;margin-bottom:18px;box-shadow:0 4px 15px rgba(35,116,75,.08);line-height:1.5}
.hero-award-badge .badge-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:#d9a94a;color:#fff;font-size:.8rem;line-height:1;flex-shrink:0}

/* Pregnancy Calculator Day-Month-Year Controls */
.date-input-group{position:relative;display:flex;align-items:center;width:100%}
.date-input-group .form-control{padding-left:48px;padding-right:16px;direction:ltr;text-align:right;font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.date-input-group .form-control::placeholder{direction:rtl;text-align:right;color:#8c9b8f;font-size:.92rem}
.format-badge{display:inline-block;background:#e8efde;color:var(--brand-green);font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:6px;margin-right:6px}
.date-picker-btn{position:absolute;left:8px;top:50%;transform:translateY(-50%);width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:transparent;border:none;color:var(--brand-green);cursor:pointer;padding:0;z-index:1;transition:background-color .2s,color .2s}
.date-picker-btn:hover{background-color:#eaf2e3;color:var(--dark-green)}
.native-date-hidden{position:absolute;left:8px;top:50%;transform:translateY(-50%);width:34px;height:34px;opacity:0;cursor:pointer;z-index:2;margin:0;padding:0;border:0}
.calc-result-formatted{font-size:1.05rem;font-weight:700;color:var(--dark-green);margin-top:6px;direction:ltr;text-align:center}
.calc-date-num{font-size:1.15rem;font-weight:700;color:var(--dark-green);display:inline-block;margin-right:8px}

/* Footer Social Links */
.footer-social-wrap{margin-top:20px}
.social-heading{display:block;font-size:.82rem;font-weight:700;color:#d1dfce;margin-bottom:12px}
.footer-social-links{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.social-btn{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:8px;font-size:.78rem;font-weight:650;color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);text-decoration:none;transition:all .2s ease}
.social-btn:hover{transform:translateY(-2px);color:#fff;text-decoration:none}
.social-btn svg{width:16px;height:16px;flex-shrink:0}
.social-btn.facebook-btn:hover{background:#1877f2;border-color:#1877f2}
.social-btn.tiktok-btn:hover{background:#000000;border-color:#fe2c55;box-shadow:0 0 10px rgba(254,44,85,.35)}
.social-btn.youtube-btn:hover{background:#ff0000;border-color:#ff0000}
.social-btn.play-btn:hover{background:#23744b;border-color:#34a853}

/* Discreet SEO Tags */
.discreet-tags{opacity:.38;font-size:.68rem;margin:12px 0 6px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;transition:opacity .3s ease}
.discreet-tags:hover{opacity:.75}
@media(min-width:1001px){.nav-links{display:flex}.menu-toggle{display:none}.mobile-nav{display:none!important}}
@media(max-width:1000px){.nav-links{display:none}.menu-toggle{display:flex}.nav-actions .btn{display:none}.nav-wrapper{min-height:78px;padding:13px 0}.mobile-nav{top:78px;max-height:calc(100dvh - 78px)}.home-hero-grid{gap:30px}.hero-copy h1{font-size:3rem}.hero-composition{min-height:500px}.hero-orbit{width:320px;height:320px}.moment-label{right:-18px;padding:12px;bottom:22px}.hero-word{right:4px;top:8px}.journey-strip p{gap:20px;font-size:.95rem}.story-grid{gap:40px}.section-heading{gap:35px}.due-date-panel{gap:30px;padding:32px}.privacy-grid{gap:55px}.faq-layout{gap:40px}.download-panel{grid-template-columns:75px 1fr}.download-action{grid-column:2;align-items:start;flex-direction:row}.footer-grid{grid-template-columns:1fr 1fr}.contact-grid{grid-template-columns:1fr}}
@media(max-width:700px){.container{padding-inline:21px}.home-hero{padding:37px 0 45px}.home-hero-grid{grid-template-columns:1fr;gap:28px}.hero-copy h1{font-size:2.65rem;letter-spacing:-1px;line-height:1.5}.hero-lead{font-size:1rem}.hero-buttons{gap:20px;margin-top:25px}.hero-buttons .text-link{font-size:.83rem}.hero-promises{font-size:.69rem;gap:12px}.hero-composition{min-height:470px;max-width:400px;width:100%;margin:auto}.device-preview{width:210px}.hero-orbit{width:310px;height:310px}.moment-label{right:0;bottom:25px}.moment-label strong{font-size:.74rem}.moment-label small{font-size:.65rem}.hero-word{right:10px;top:15px}.leaf-one{left:35px}.leaf-two{left:15px}.journey-strip{padding:23px 0}.journey-strip .container{display:block;text-align:center}.journey-strip p{gap:12px;justify-content:center;font-size:.76rem;margin-top:8px;flex-wrap:wrap}.section{padding:54px 0}.section-heading{grid-template-columns:1fr;gap:17px;margin-bottom:28px}.section-heading p{font-size:.92rem}.eyebrow{font-size:.8rem;margin-bottom:13px}h2{font-size:1.95rem}.care-grid{grid-template-columns:1fr 1fr;gap:12px}.care-card{padding:22px 17px;border-radius:13px}.care-card h3{font-size:.94rem;margin-top:16px}.care-card p{font-size:.81rem;line-height:1.9}.care-icon{width:41px;height:41px;border-radius:12px}.story-grid,.privacy-grid,.faq-layout{grid-template-columns:1fr;gap:35px}.story-list{font-size:.81rem}.screen-pair{max-width:420px;margin:auto}.screen-pair figure:nth-child(2){margin-top:14px}.screen-pair figure:nth-child(3){margin-top:28px}.store-showcase-container{margin-top:32px}.store-showcase-card{padding:22px 16px;border-radius:18px}.store-showcase-header h3{font-size:1.25rem}.store-showcase-header p{font-size:.88rem}.about-hero-img{margin-bottom:20px;border-radius:14px}.due-date-panel{grid-template-columns:1fr;padding:27px 20px;gap:26px;border-radius:19px}.calc-form{padding:22px 18px}.calculator-disclosure{font-size:.76rem}.calculator-intro h2 br{display:none}.privacy-symbol{min-height:220px;max-width:270px;width:100%;margin:auto;gap:15px}.privacy-symbol>svg{width:65px;height:65px}.privacy-symbol span{font-size:.85rem}.privacy-grid>div>p{font-size:.93rem}.privacy-links{gap:18px}.faq-layout{gap:22px}.faq-item summary{font-size:.88rem;padding:19px 0}.faq-body{font-size:.85rem}.download-section{padding:0 21px 45px}.download-panel{grid-template-columns:65px 1fr;padding:25px;gap:18px}.download-panel h2{font-size:1.2rem}.download-panel>div:not(.download-action){grid-column:1/-1}.download-panel>img{width:65px}.download-action{grid-column:1/-1;flex-direction:column;align-items:stretch}.download-action .btn-store{justify-content:center}.download-action .text-link{justify-content:center}.site-footer{padding-top:40px}.footer-grid{gap:32px 20px}.footer-brand{grid-column:1/-1}.footer-title{font-size:.86rem}.footer-links a{font-size:.78rem}.footer-email{font-size:.78rem}.footer-grid>div:last-child{grid-column:1/-1}.footer-bottom{gap:6px}.page-hero-title{font-size:1.8rem}.page-hero{padding:30px 0}.legal-content-card{padding:25px 20px;margin-bottom:40px}.legal-content-card h1{font-size:1.65rem}.legal-content-card p{font-size:.95rem}.contact-form-card,.contact-info-card{padding:25px 20px}.error-card{padding:30px 20px}.error-actions{flex-direction:column}.error-code{font-size:5rem}}
@media(max-width:360px){.care-grid{grid-template-columns:1fr}.hero-copy h1{font-size:2.35rem}.hero-composition{transform:scale(.94);transform-origin:center}.hero-buttons{gap:15px}.journey-strip p{gap:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Website 1.3.0: the public face of the app's warm visual system. */
:root{
  --brand-green:#2d7775;--dark-green:#205e5c;--deep-slate:#263741;
  --muted-slate:#5f6d72;--warm-cream:#fbf8f2;--border-light:#e7e1d6;
  --app-honey:#edc16b;--app-honey-soft:#faefd6;--app-rose:#a0536b;
  --app-green:#3d755d;--app-blue:#356e88;
}
body{background:var(--warm-cream);color:var(--deep-slate)}
::selection{background:var(--app-honey);color:var(--deep-slate)}
.site-header,.site-header.scrolled{background:rgba(251,248,242,.96);border-bottom-color:var(--border-light);box-shadow:0 8px 28px #2637410a}
.nav-wrapper{min-height:84px}
.nav-link{color:var(--deep-slate)}
.nav-link:hover,.nav-link.active{color:var(--dark-green)}
.logo-img{max-height:58px}
.btn-primary{background:var(--app-honey);color:#533817;border:1px solid #d9a84a;box-shadow:0 6px 0 #b7833470,0 14px 22px #82571918;font-weight:800}
.btn-primary:hover{background:#f3cb80;color:#533817;box-shadow:0 4px 0 #b7833470,0 16px 24px #82571922}
.btn-store{background:#263741;border:1px solid #263741;box-shadow:0 12px 26px #26374125}
.btn-store:hover{background:#35535b;box-shadow:0 16px 28px #26374130}
.text-link,.eyebrow,.small-link{color:var(--dark-green)}
.home-hero{position:relative;padding:74px 0 82px;background:radial-gradient(circle at 13% 48%,#dff0ea 0,transparent 34%),radial-gradient(circle at 80% 4%,#faefd6 0,transparent 34%),var(--warm-cream)}
.home-hero::before{content:"";position:absolute;inset:0 0 auto;height:8px;background:linear-gradient(90deg,#edc16b 0 25%,#3d755d 25% 50%,#a0536b 50% 75%,#356e88 75%)}
.home-hero-grid{gap:72px}
.hero-copy h1{font-weight:850;line-height:1.36;letter-spacing:-1.2px}
.hero-copy h1 span{color:var(--dark-green)}
.hero-lead{color:#4e6269;font-size:1.08rem;line-height:2;max-width:560px}
.hero-award-badge{background:#fff9e9;border:1px solid #e9cf96;color:#6d4a1e;box-shadow:0 5px 16px #82571912}
.hero-award-badge .badge-icon{background:var(--app-honey);color:#694916}
.hero-promises{border-top-color:#dddfd5;color:#50656a}
.hero-orbit{background:radial-gradient(circle at 35% 30%,#fff5dd,#e7f1e9 65%,#d4e6e1);border-color:#d6e2d8;outline-color:#e6dfcc}
.hero-word{color:#8a6644}
.device-preview{border-color:#263741;box-shadow:-17px 29px 46px #26374130,0 0 0 9px #ffffffa6}
.moment-label{background:#fff;border-color:var(--border-light);box-shadow:0 16px 35px #26374118}
.moment-label>span{background:#fbe8e9;color:var(--app-rose)}
.leaf{background:#7cae94}.leaf-two{background:#c7dbca}
.journey-strip{background:#f7eacb;border-color:#e6d6b4}
.journey-strip p{color:#60491f}.journey-strip i{color:#a56c46}
.section-heading h2,.story-copy h2,.calculator-intro h2,.privacy-grid h2,.faq-layout h2{color:var(--deep-slate)}
.care-card{position:relative;background:#fff;border-color:var(--border-light);border-radius:22px;box-shadow:0 10px 24px #2637410a;transition:transform .2s ease,box-shadow .2s ease}
.care-card:hover{transform:translateY(-4px);box-shadow:0 18px 32px #26374118}
.care-card::before{content:"";position:absolute;inset:0 0 auto;height:5px;border-radius:22px 22px 0 0;background:var(--app-green)}
.care-card.blue::before{background:var(--app-blue)}.care-card.rose::before{background:var(--app-rose)}
.care-card.peach::before{background:#b77b36}.care-card.sage::before{background:var(--brand-green)}.care-card.lavender::before{background:#8566a4}
.care-icon{border-radius:16px;background:#e8f3ef;color:var(--app-green)}
.soft-section{background:#f4f1ea}
.screen-pair figure{border-color:var(--border-light);box-shadow:0 18px 35px #26374116}
.store-showcase-card,.calc-form,.contact-info-card,.contact-form-card,.legal-content-card{border-color:var(--border-light);box-shadow:0 16px 35px #26374110;border-radius:22px}
.due-date-panel{background:linear-gradient(135deg,#faefd6,#f8f4e8);border-color:#e9d9b8}
.form-control{border-color:#bac4bc;border-radius:18px;min-height:54px}
.form-control:focus{border-color:var(--dark-green)}
.calc-result-box{background:#e8f3ef;border-color:#a4c9bd}
.privacy-section{background:#e8f3ef}
.privacy-symbol{background:radial-gradient(circle at 30% 20%,#fff,#d6e9e3);border-color:#b9d6cd;color:var(--dark-green)}
.faq-item summary{min-height:72px}
.download-panel{background:linear-gradient(110deg,#f7e8c9,#e8f3ef);border:1px solid #e5dbc7;box-shadow:0 16px 36px #26374112}
.site-footer{background:#263e3e}.footer-brand>img{border-radius:14px}
.page-hero{background:linear-gradient(120deg,#faefd6,#e8f3ef)}
.error-card{box-shadow:0 20px 40px #26374113}
@media(max-width:1000px){.home-hero-grid{gap:34px}.home-hero{padding-block:48px 58px}}
@media(max-width:700px){.home-hero{padding-block:36px 48px}.home-hero-grid{gap:24px}.hero-copy h1{font-size:clamp(2.25rem,9vw,3rem)}.hero-award-badge{font-size:.75rem;line-height:1.8}.hero-orbit{background:radial-gradient(circle at 35% 30%,#fff5dd,#e7f1e9 70%)}.section{padding-block:62px}.care-card{padding:26px 23px}.due-date-panel{padding:27px 20px}.download-panel{padding:26px 22px}}
@media(prefers-reduced-motion:reduce){.care-card:hover{transform:none}}


/* ==========================================================================
   حياة طفلي — Enhanced Privacy Policy & Legal Document Design System
   ========================================================================== */

.privacy-page-main {
  padding-block: 2.5rem 4rem;
}

.policy-meta-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  margin-top: 16px;
  margin-bottom: 24px;
}

.policy-meta-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: 9999px;
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1;
}

.policy-meta-pill.version {
  background: #eef7eb;
  color: var(--dark-green);
  border: 1px solid #cbe5c3;
}

.policy-meta-pill.effective {
  background: #eef2f6;
  color: #334155;
  border: 1px solid #cbd5e1;
}

.policy-meta-pill.status {
  background: #e0f2fe;
  color: #0369a1;
  border: 1px solid #bae6fd;
}

.policy-meta-pill.print-btn {
  background: #ffffff;
  color: var(--deep-slate);
  border: 1px solid #d1d5db;
  cursor: pointer;
  transition: var(--transition-fast);
}

.policy-meta-pill.print-btn:hover {
  background: #f8fafc;
  border-color: var(--brand-green);
  color: var(--brand-green);
}

/* Privacy Highlights Summary */
.policy-highlights {
  background: linear-gradient(135deg, #fdfbf7, #f4f8f4);
  border: 1px solid #d9e7d5;
  border-radius: 20px;
  padding: 28px 24px;
  margin-bottom: 32px;
  box-shadow: 0 4px 18px rgba(36, 52, 59, 0.04);
}

.policy-highlights-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--dark-green);
  margin-bottom: 18px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.policy-highlights-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px;
}

.policy-highlight-card {
  background: #ffffff;
  border: 1px solid #e2ede0;
  border-radius: 14px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.policy-highlight-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(46, 155, 43, 0.08);
  border-color: var(--brand-green);
}

.highlight-icon-wrap {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: #eaf5e7;
  color: var(--brand-green);
  display: flex;
  align-items: center;
  justify-content: center;
}

.policy-highlight-card strong {
  font-size: 0.95rem;
  color: var(--deep-slate);
}

.policy-highlight-card p {
  font-size: 0.84rem;
  color: var(--muted-slate);
  line-height: 1.6;
  margin: 0;
}

/* Search Bar */
.policy-search-wrap {
  position: relative;
  margin-bottom: 24px;
}

.policy-search-input {
  width: 100%;
  padding: 14px 48px 14px 20px;
  font-size: 0.98rem;
  font-family: inherit;
  border: 1px solid #d4ded3;
  border-radius: 16px;
  background: #ffffff;
  color: var(--deep-slate);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
  transition: border-color 0.2s, box-shadow 0.2s;
}

.policy-search-input:focus {
  outline: none;
  border-color: var(--brand-green);
  box-shadow: 0 0 0 4px rgba(46, 155, 43, 0.12);
}

.policy-search-icon {
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  color: #7a8c80;
  pointer-events: none;
}

.policy-search-stats {
  font-size: 0.85rem;
  color: var(--muted-slate);
  margin-top: 8px;
  padding-inline: 8px;
}

/* Table of Contents */
.policy-toc-card {
  background: #ffffff;
  border: 1px solid var(--border-light);
  border-radius: 18px;
  padding: 24px;
  margin-bottom: 32px;
  box-shadow: var(--shadow-sm);
}

.policy-toc-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  user-select: none;
}

.policy-toc-header h2 {
  font-size: 1.15rem;
  color: var(--deep-slate);
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.toc-toggle-icon {
  transition: transform 0.25s ease;
}

.policy-toc-card.collapsed .toc-toggle-icon {
  transform: rotate(180deg);
}

.policy-toc-card.collapsed .policy-toc-grid {
  display: none;
}

.policy-toc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 10px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid #f0f4ee;
}

.toc-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 10px;
  font-size: 0.88rem;
  color: var(--muted-slate);
  text-decoration: none;
  background: #fafbfa;
  border: 1px solid transparent;
  transition: all 0.2s;
}

.toc-link:hover, .toc-link.active {
  background: #eef6ec;
  color: var(--dark-green);
  border-color: #cbe5c3;
  font-weight: 600;
}

.toc-num {
  font-size: 0.78rem;
  font-weight: 700;
  background: #e2ede0;
  color: var(--dark-green);
  padding: 2px 7px;
  border-radius: 6px;
  line-height: 1.3;
}

/* Policy Section Cards */
.policy-section-card {
  background: #ffffff;
  border: 1px solid #e1e9de;
  border-radius: 20px;
  padding: 32px;
  margin-bottom: 24px;
  box-shadow: 0 4px 18px rgba(36, 52, 59, 0.03);
  transition: border-color 0.2s, box-shadow 0.2s;
  scroll-margin-top: 90px;
}

.policy-section-card:hover {
  border-color: #c6dcc1;
  box-shadow: 0 8px 26px rgba(46, 155, 43, 0.06);
}

.policy-section-card:target {
  border-color: var(--brand-green);
  box-shadow: 0 0 0 3px rgba(46, 155, 43, 0.15);
}

.policy-card-header {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 20px;
  padding-bottom: 14px;
  border-bottom: 1.5px solid #f0f4ee;
}

.policy-section-card h2 {
  font-size: 1.35rem;
  font-weight: 750;
  color: var(--deep-slate);
  line-height: 1.5;
  margin: 0;
}

.section-num-badge {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  background: linear-gradient(135deg, #e8f4e5, #d9ecd5);
  color: var(--dark-green);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 1rem;
  box-shadow: 0 2px 6px rgba(46, 155, 43, 0.12);
}

.policy-section-card p {
  font-size: 1.04rem;
  line-height: 2;
  color: #2b3e37;
  margin-bottom: 16px;
}

.policy-section-card p:last-child {
  margin-bottom: 0;
}

/* Links & Anchors */
.legal-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #176d54;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: #8acbb7;
  text-underline-offset: 4px;
  transition: all 0.2s ease;
  word-break: break-word;
}

.legal-link:hover {
  color: #0b4535;
  text-decoration-color: #176d54;
  background: #eef8f5;
  border-radius: 4px;
  padding-inline: 4px;
}

.legal-link svg {
  flex-shrink: 0;
  opacity: 0.8;
  margin-top: 1px;
}

.legal-email-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f0f6ff;
  color: #0b57d0;
  border: 1px solid #cfe2ff;
  padding: 3px 12px;
  border-radius: 8px;
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  direction: ltr;
  unicode-bidi: isolate;
  transition: all 0.2s;
}

.legal-email-pill:hover {
  background: #e0edff;
  border-color: #0b57d0;
  color: #0842a0;
  transform: translateY(-1px);
}

.tech-tag {
  display: inline-block;
  background: #f1f5f9;
  color: #334155;
  border: 1px solid #cbd5e1;
  padding: 2px 8px;
  border-radius: 6px;
  font-weight: 600;
  font-size: 0.88rem;
  direction: ltr;
  unicode-bidi: isolate;
}

/* Third-Party Services Directory Grid (Section 16) */
.provider-directory {
  margin: 24px 0 16px;
  background: #fafcfa;
  border: 1px solid #dde7db;
  border-radius: 16px;
  padding: 22px;
}

.provider-directory-title {
  font-size: 1.12rem;
  font-weight: 700;
  color: var(--deep-slate);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.provider-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
}

.provider-card {
  background: #ffffff;
  border: 1px solid #e1ebde;
  border-radius: 14px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 14px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02);
  transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
}

.provider-card:hover {
  transform: translateY(-2px);
  border-color: var(--brand-green);
  box-shadow: 0 6px 18px rgba(46, 155, 43, 0.08);
}

.provider-card-top {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.provider-card-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: #f1f7ee;
  color: var(--dark-green);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.provider-card-info h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--deep-slate);
  margin: 0 0 4px;
}

.provider-card-info p {
  font-size: 0.84rem;
  color: var(--muted-slate);
  line-height: 1.5;
  margin: 0;
}

.provider-card-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 9px 14px;
  background: #eef6ec;
  color: var(--dark-green);
  border: 1px solid #cbe5c3;
  border-radius: 10px;
  font-weight: 600;
  font-size: 0.88rem;
  text-decoration: none;
  transition: all 0.2s;
}

.provider-card-btn:hover {
  background: var(--dark-green);
  color: #ffffff;
  border-color: var(--dark-green);
}

.provider-url-preview {
  font-family: monospace;
  font-size: 0.74rem;
  color: #64748b;
  direction: ltr;
  text-align: left;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: #f8fafc;
  padding: 4px 8px;
  border-radius: 6px;
  border: 1px solid #e2e8f0;
}

/* Callout & Action Boxes */
.policy-callout {
  background: linear-gradient(135deg, #f8fbf6, #f0f7ec);
  border: 1px solid #cce2c6;
  border-right: 5px solid var(--brand-green);
  border-radius: 14px;
  padding: 20px 24px;
  margin: 20px 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.policy-callout-text h3 {
  font-size: 1.05rem;
  color: var(--dark-green);
  margin: 0 0 4px;
}

.policy-callout-text p {
  font-size: 0.92rem;
  color: #3b5046;
  margin: 0;
  line-height: 1.6;
}

.policy-callout-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  background: var(--brand-green);
  color: #ffffff !important;
  font-weight: 600;
  font-size: 0.92rem;
  border-radius: 12px;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(46, 155, 43, 0.2);
  transition: all 0.2s ease;
  white-space: nowrap;
}

.policy-callout-btn:hover {
  background: var(--dark-green);
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(46, 155, 43, 0.3);
}

/* Floating Back to Top Button */
.back-to-top {
  position: fixed;
  bottom: 28px;
  left: 28px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--dark-green);
  color: #ffffff;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: all 0.25s ease;
  z-index: 99;
}

.back-to-top.visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.back-to-top:hover {
  background: var(--brand-green);
  transform: translateY(-3px);
  box-shadow: 0 8px 25px rgba(46, 155, 43, 0.35);
}

/* Print Styles */
@media print {
  .site-header, .site-footer, .policy-toc-card, .policy-search-wrap,
  .policy-meta-pill.print-btn, .back-to-top, .skip-link, .nav-actions {
    display: none !important;
  }
  .privacy-page-main {
    padding: 0 !important;
  }
  .policy-section-card {
    box-shadow: none !important;
    border: 1px solid #ccc !important;
    page-break-inside: avoid;
    margin-bottom: 20px !important;
  }
  .policy-highlights {
    border: 1px solid #ccc !important;
    box-shadow: none !important;
  }
  a {
    text-decoration: none !important;
    color: #000 !important;
  }
}

@media (max-width: 768px) {
  .policy-section-card {
    padding: 22px 18px;
  }
  .policy-section-card h2 {
    font-size: 1.18rem;
  }
  .section-num-badge {
    width: 32px;
    height: 32px;
    font-size: 0.88rem;
  }
  .policy-highlights {
    padding: 20px 16px;
  }
  .policy-callout {
    flex-direction: column;
    align-items: flex-start;
  }
  .policy-callout-btn {
    width: 100%;
    justify-content: center;
  }
  .back-to-top {
    bottom: 20px;
    left: 20px;
    width: 42px;
    height: 42px;
  }
}

/* ==========================================================================
   Video Tour Section & Smartphone Mockup (v1.3.2)
   ========================================================================== */
.video-tour-section {
  position: relative;
  padding: 85px 0 95px;
  background: radial-gradient(ellipse at 88% 22%, #eaf4f0 0%, transparent 48%),
              radial-gradient(ellipse at 12% 78%, #faeed4 0%, transparent 48%),
              var(--warm-cream);
  border-top: 1px solid var(--border-light);
  border-bottom: 1px solid var(--border-light);
  overflow: hidden;
}

.video-tour-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 65px;
  align-items: center;
}

.video-tour-copy {
  display: flex;
  flex-direction: column;
}

.video-tour-copy h2 {
  font-size: clamp(2rem, 3.4vw, 2.85rem);
  font-weight: 850;
  line-height: 1.35;
  letter-spacing: -0.8px;
  color: var(--deep-slate);
  margin: 12px 0 18px;
}

.video-tour-copy h2 span {
  color: var(--dark-green);
}

.video-lead {
  font-size: 1.05rem;
  line-height: 2;
  color: #4e6269;
  max-width: 580px;
  margin-bottom: 28px;
}

.video-highlights-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 32px;
}

.highlight-item {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 14px 18px;
  background: #ffffff;
  border: 1px solid var(--border-light);
  border-radius: 16px;
  box-shadow: 0 4px 14px rgba(38, 55, 65, 0.04);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.highlight-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(38, 55, 65, 0.08);
  border-color: #d8cebe;
}

.highlight-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

.highlight-icon.green {
  background: #eaf6ea;
  color: var(--dark-green);
}

.highlight-icon.blue {
  background: #e8f2f8;
  color: #2b6c8f;
}

.highlight-icon.rose {
  background: #fdf0f2;
  color: var(--app-rose);
}

.highlight-icon.peach {
  background: #fdf5e8;
  color: #9c6819;
}

.highlight-item strong {
  display: block;
  font-size: 0.98rem;
  color: var(--deep-slate);
  font-weight: 750;
  margin-bottom: 3px;
}

.highlight-item p {
  font-size: 0.86rem;
  line-height: 1.7;
  color: var(--muted-slate);
  margin: 0;
}

.video-actions {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
}

.btn-play-trigger {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}

.btn-play-trigger svg {
  width: 20px;
  height: 20px;
}

/* Hero Video Tour Button */
.btn-hero-video {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  padding: 12px 20px;
  background: #ffffff;
  border: 1.5px solid #dcd4c6;
  border-radius: 12px;
  font-weight: 750;
  font-size: 0.94rem;
  color: var(--deep-slate);
  text-decoration: none;
  min-height: 54px;
  box-shadow: 0 4px 16px rgba(38, 55, 65, 0.06);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.btn-hero-video:hover {
  transform: translateY(-2px);
  color: var(--dark-green);
  border-color: var(--dark-green);
  box-shadow: 0 8px 24px rgba(38, 55, 65, 0.12);
  text-decoration: none;
}

.hero-play-icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #eaf5f0;
  color: var(--dark-green);
  display: grid;
  place-items: center;
  transition: transform 0.2s ease, background 0.2s ease;
}

.btn-hero-video:hover .hero-play-icon {
  background: var(--dark-green);
  color: #ffffff;
  transform: scale(1.08);
}

/* Smartphone Mockup */
.video-tour-mockup-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.phone-frame-container {
  position: relative;
  width: 100%;
  max-width: 330px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.phone-glow {
  position: absolute;
  inset: -15px;
  background: radial-gradient(circle, rgba(45, 119, 117, 0.25) 0%, rgba(237, 193, 107, 0.18) 45%, transparent 70%);
  border-radius: 52px;
  filter: blur(20px);
  z-index: 0;
  pointer-events: none;
}

.phone-frame {
  position: relative;
  z-index: 1;
  width: 100%;
  aspect-ratio: 9 / 16;
  background: #10191f;
  border: 11px solid #263741;
  border-radius: 44px;
  box-shadow: 0 25px 60px rgba(38, 55, 65, 0.25),
              0 0 0 1px rgba(255, 255, 255, 0.35),
              inset 0 0 0 2px rgba(0, 0, 0, 0.4);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.phone-notch {
  position: absolute;
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
  width: 82px;
  height: 18px;
  background: #10191f;
  border-radius: 12px;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  pointer-events: none;
}

.notch-speaker {
  width: 38px;
  height: 4px;
  background: #2b3b44;
  border-radius: 3px;
}

.notch-camera {
  width: 8px;
  height: 8px;
  background: #1c2b33;
  border: 1.5px solid #2b3b44;
  border-radius: 50%;
}

.phone-screen {
  position: relative;
  width: 100%;
  height: 100%;
  background: #000;
  overflow: hidden;
}

.phone-screen video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  background: #000;
}

/* Custom Play Overlay */
.video-overlay-play {
  position: absolute;
  inset: 0;
  background: rgba(16, 25, 31, 0.42);
  backdrop-filter: blur(2px);
  border: none;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  z-index: 5;
  transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  color: #ffffff;
  padding: 20px;
}

.video-overlay-play.playing {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.play-btn-circle {
  position: relative;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: var(--app-honey);
  color: #533817;
  display: grid;
  place-items: center;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35),
              0 0 0 6px rgba(237, 193, 107, 0.3);
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), background 0.2s ease;
}

.video-overlay-play:hover .play-btn-circle {
  transform: scale(1.1);
  background: #f7d388;
}

.play-ripple {
  position: absolute;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  border: 2px solid var(--app-honey);
  animation: playPulse 2.2s infinite cubic-bezier(0.25, 1, 0.5, 1);
  pointer-events: none;
}

@keyframes playPulse {
  0% { transform: scale(1); opacity: 0.9; }
  100% { transform: scale(1.7); opacity: 0; }
}

.play-caption {
  font-family: inherit;
  font-size: 0.92rem;
  font-weight: 750;
  color: #ffffff;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
  background: rgba(0, 0, 0, 0.45);
  padding: 6px 14px;
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.video-meta-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  padding: 8px 16px;
  background: #ffffff;
  border: 1px solid var(--border-light);
  border-radius: 20px;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--deep-slate);
  box-shadow: 0 4px 14px rgba(38, 55, 65, 0.05);
}

.badge-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--dark-green);
  animation: pulseDot 2s infinite;
}

@keyframes pulseDot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.85); }
}

/* Responsive adjustments for Video Tour */
@media (max-width: 1000px) {
  .video-tour-grid {
    grid-template-columns: 1fr;
    gap: 45px;
  }
  .video-tour-copy {
    text-align: center;
    align-items: center;
  }
  .video-lead {
    margin-inline: auto;
  }
  .highlight-item {
    text-align: right;
  }
  .video-actions {
    justify-content: center;
  }
  .phone-frame-container {
    max-width: 300px;
  }
}

@media (max-width: 700px) {
  .video-tour-section {
    padding: 55px 0 65px;
  }
  .video-tour-copy h2 {
    font-size: 1.85rem;
  }
  .video-lead {
    font-size: 0.95rem;
  }
  .highlight-item {
    padding: 12px 14px;
    gap: 12px;
  }
  .highlight-icon {
    width: 38px;
    height: 38px;
  }
  .highlight-item strong {
    font-size: 0.9rem;
  }
  .highlight-item p {
    font-size: 0.8rem;
  }
  .phone-frame-container {
    max-width: 275px;
  }
  .phone-frame {
    border-width: 9px;
    border-radius: 36px;
  }
  .btn-hero-video {
    width: 100%;
    justify-content: center;
  }
}
