/* ═══════════════════════════════════════════════════════════════
   Her India — Grav theme
   Merged stylesheet for home, preorder and legal page templates.
   Fonts: Cormorant Garamond · Cinzel · DM Sans (Google Fonts)
   ═══════════════════════════════════════════════════════════════ */

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

:root {
  --steel: #4a7a9b;
  --steel-dark: #2d5a7a;
  --steel-light: #e8f1f7;
  --steel-mid: #6e9db8;
  --cream: #faf7f2;
  --cream-warm: #f5efe4;
  --gold: #c9a84c;
  --gold-light: #e8d4a0;
  --gold-dark: #8a6a1e;
  --text-dark: #1a1a1a;
  --text-mid: #4a4a4a;
  --text-light: #7a7a7a;
}

html { scroll-behavior: smooth; }

body.marketing {
  font-family: 'DM Sans', sans-serif;
  background: var(--cream);
  color: var(--text-dark);
  overflow-x: hidden;
}

/* ── BUTTONS (shared) ── */
.btn-primary {
  font-family: 'Cinzel', serif;
  font-size: 11px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  padding: 16px 40px;
  background: var(--gold);
  color: white;
  text-decoration: none;
  transition: all 0.3s;
  display: inline-block;
  border: none;
  cursor: pointer;
}

.btn-primary:hover {
  background: var(--gold-dark);
  transform: translateY(-2px);
}

.btn-secondary {
  font-family: 'Cinzel', serif;
  font-size: 11px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  padding: 15px 40px;
  border: 1px solid rgba(255,255,255,0.4);
  color: white;
  text-decoration: none;
  transition: all 0.3s;
  display: inline-block;
}

.btn-secondary:hover {
  border-color: white;
  background: rgba(255,255,255,0.1);
}

/* ── SHARED SECTION TYPE ── */
.section-label {
  font-family: 'Cinzel', serif;
  font-size: 10px;
  letter-spacing: 3.5px;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
  display: block;
}

.section-heading {
  font-family: 'Cormorant Garamond', serif;
  font-size: 56px;
  font-weight: 300;
  color: var(--steel-dark);
  line-height: 1.05;
  margin-bottom: 28px;
}

.section-heading em { font-style: italic; color: var(--steel); }

/* ── HERO ── */
.hero {
  min-height: 100vh;
  background: var(--steel);
  display: grid;
  grid-template-columns: 1fr 1fr;
  position: relative;
  overflow: hidden;
}

.hero-pattern {
  position: absolute;
  inset: 0;
  opacity: 0.05;
  background-image:
    radial-gradient(circle at 20% 50%, white 1px, transparent 1px),
    radial-gradient(circle at 80% 20%, white 1px, transparent 1px),
    radial-gradient(circle at 50% 80%, white 1px, transparent 1px);
  background-size: 80px 80px, 60px 60px, 100px 100px;
}

.hero-left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 130px 80px 80px;
  position: relative;
  z-index: 2;
}

.hero-eyebrow {
  font-family: 'Cinzel', serif;
  font-size: 10px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--gold-light);
  margin-bottom: 24px;
  opacity: 0;
  animation: fadeUp 0.8s 0.1s ease forwards;
}

.hero-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 88px;
  font-weight: 300;
  line-height: 0.88;
  color: white;
  margin-bottom: 16px;
  opacity: 0;
  animation: fadeUp 0.8s 0.25s ease forwards;
}

.hero-title em {
  font-style: italic;
  color: var(--gold-light);
  display: block;
  font-size: 56px;
  margin-bottom: 8px;
}

.hero-divider {
  width: 80px;
  height: 1px;
  background: var(--gold);
  margin-bottom: 36px;
  opacity: 0;
  animation: fadeUp 0.8s 0.4s ease forwards;
}

.hero-subtitle {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px;
  font-weight: 300;
  font-style: italic;
  color: rgba(255,255,255,0.75);
  margin-bottom: 48px;
  line-height: 1.55;
  max-width: 420px;
  opacity: 0;
  animation: fadeUp 0.8s 0.45s ease forwards;
}

.hero-subtitle strong {
  color: white;
  font-weight: 400;
  font-style: normal;
}

.hero-btns {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  opacity: 0;
  animation: fadeUp 0.8s 0.6s ease forwards;
}

.hero-right {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px;
  z-index: 2;
}

.book-mockup {
  width: 100%;
  max-width: 550px;
  opacity: 0;
  animation: fadeUp 0.9s 0.7s ease forwards;
}

.book-cover-img {
  width: 100%;
  display: block;
  transform: perspective(900px) rotateY(-8deg) rotateX(2deg);
  box-shadow: 24px 24px 70px rgba(0,0,0,0.35);
}

/* ── STATS BAR ── */
.stats-bar {
  background: var(--steel-dark);
  padding: 0;
  overflow: hidden;
  white-space: nowrap;
}

.stats-track {
  display: inline-flex;
  align-items: center;
  animation: marquee 28s linear infinite;
  padding: 22px 0;
}

.stats-bar:hover .stats-track {
  animation-play-state: paused;
}

@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

.stat-item {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 0 52px;
  border-right: 1px solid rgba(255,255,255,0.1);
}

.stat-item:last-child { border-right: none; }

.stat-number {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  font-weight: 300;
  color: var(--gold-light);
  line-height: 1;
}

.stat-label {
  font-family: 'Cinzel', serif;
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
}

.stat-dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--gold);
  opacity: 0.6;
  flex-shrink: 0;
}

/* ── ABOUT ── */
.about-section {
  padding: 110px 80px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
}

.about-body {
  font-size: 16px;
  line-height: 1.85;
  color: var(--text-mid);
  margin-bottom: 22px;
}

.about-signature {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 24px;
  color: var(--steel);
  margin-top: 8px;
}

.about-author-name {
  font-family: 'Cinzel', serif;
  font-size: 11px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--text-light);
  margin-top: 28px;
  display: block;
}

.about-instagram {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 14px;
  text-decoration: none;
  color: var(--steel);
  font-family: 'Cinzel', serif;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  transition: color 0.3s;
}

.about-instagram:hover { color: var(--steel-dark); }

.about-instagram svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex-shrink: 0;
}

.about-visual {
  aspect-ratio: 0.82;
  background: var(--steel-light);
  position: relative;
  overflow: hidden;
}

.about-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.about-circle {
  position: absolute;
  width: 130px;
  height: 130px;
  border-radius: 50%;
  background: var(--gold-light);
  opacity: 0.25;
  bottom: -20px;
  right: -20px;
}

/* ── GUIDES ── */
.guides-section {
  background: var(--cream-warm);
  padding: 110px 60px;
}

.guides-header {
  text-align: center;
  margin-bottom: 72px;
}

.guides-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 36px;
  max-width: 1100px;
  margin: 0 auto;
}

.guide-card {
  background: white;
  transition: transform 0.4s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.4s;
  position: relative;
  overflow: hidden;
}

.guide-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 28px 70px rgba(74,122,155,0.16);
}

.guide-cover-img {
  width: 100%;
  aspect-ratio: 0.8;
  object-fit: cover;
  display: block;
}

.guide-body {
  padding: 28px 28px 32px;
}

.guide-badge {
  display: inline-block;
  font-family: 'Cinzel', serif;
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 5px 12px;
  background: var(--steel-light);
  color: var(--steel-dark);
  margin-bottom: 14px;
}

.guide-badge.soon {
  background: #f5efe4;
  color: #8a6a1e;
}

.guide-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 27px;
  font-weight: 400;
  color: var(--steel-dark);
  line-height: 1.15;
  margin-bottom: 4px;
}

.guide-subtitle {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 15px;
  font-weight: 300;
  color: var(--text-light);
  margin-bottom: 12px;
  display: block;
}

.guide-desc {
  font-size: 14px;
  line-height: 1.75;
  color: var(--text-mid);
  margin-bottom: 22px;
}

.guide-highlights {
  list-style: none;
  margin-bottom: 28px;
}

.guide-highlights li {
  font-size: 13px;
  color: var(--text-mid);
  padding: 5px 0;
  position: relative;
  line-height: 1.4;
  border-bottom: 1px solid rgba(74,122,155,0.07);
}

.guide-highlights li:last-child { border-bottom: none; }

.guide-quote {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 15px;
  color: var(--steel);
  margin-bottom: 0;
}

.guide-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 20px;
  border-top: 1px solid rgba(74,122,155,0.12);
}

.guide-price {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  font-weight: 300;
  color: var(--steel-dark);
  line-height: 1;
}

.guide-price small {
  font-family: 'DM Sans', sans-serif;
  font-size: 11px;
  color: var(--text-light);
  display: block;
  margin-top: 3px;
}

.guide-btn {
  font-family: 'Cinzel', serif;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 12px 22px;
  background: var(--steel);
  color: white;
  border: none;
  cursor: pointer;
  transition: all 0.3s;
  text-decoration: none;
  display: inline-block;
}

.guide-btn:hover {
  background: var(--steel-dark);
  transform: translateY(-1px);
}

.guide-btn.disabled {
  background: #bbb;
  cursor: default;
}

.guide-btn.disabled:hover {
  background: #bbb;
  transform: none;
}

/* ── FEATURES ── */
.features-section {
  padding: 110px 80px;
  max-width: 1100px;
  margin: 0 auto;
}

.features-header { text-align: center; margin-bottom: 72px; }

.features-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 44px;
}

.feature-item { text-align: center; }

.feature-icon {
  width: 58px;
  height: 58px;
  border: 1px solid rgba(74,122,155,0.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  color: var(--steel);
  font-size: 22px;
}

.feature-icon svg {
  width: 24px;
  height: 24px;
}

.feature-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px;
  font-weight: 400;
  color: var(--steel-dark);
  margin-bottom: 10px;
}

.feature-desc {
  font-size: 14px;
  line-height: 1.75;
  color: var(--text-light);
}

/* ── TESTIMONIAL ── */
.testimonial-section {
  background: var(--steel);
  padding: 110px 80px;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.testimonial-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle at 10% 90%, rgba(255,255,255,0.025) 1px, transparent 1px),
    radial-gradient(circle at 90% 10%, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 60px 60px, 80px 80px;
}

.testimonial-mark {
  font-family: 'Cormorant Garamond', serif;
  font-size: 130px;
  color: rgba(201,168,76,0.18);
  line-height: 0.55;
  margin-bottom: 36px;
  display: block;
  position: relative;
  z-index: 2;
}

.testimonial-text {
  font-family: 'Cormorant Garamond', serif;
  font-size: 36px;
  font-weight: 300;
  font-style: italic;
  color: white;
  max-width: 820px;
  margin: 0 auto 36px;
  line-height: 1.45;
  position: relative;
  z-index: 2;
}

.testimonial-author {
  font-family: 'Cinzel', serif;
  font-size: 11px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--gold-light);
  position: relative;
  z-index: 2;
}

/* ── CTA ── */
.cta-section {
  background: var(--cream-warm);
  padding: 100px 80px;
  text-align: center;
}

.cta-heading {
  font-family: 'Cormorant Garamond', serif;
  font-size: 60px;
  font-weight: 300;
  color: var(--steel-dark);
  margin-bottom: 20px;
  line-height: 1.05;
}

.cta-heading em { font-style: italic; }

.cta-sub {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 20px;
  color: var(--text-light);
  margin-bottom: 48px;
}

.cta-divider {
  width: 60px;
  height: 1px;
  background: var(--gold);
  margin: 0 auto 48px;
}

.cta-note {
  font-family: 'Cinzel', serif;
  font-size: 12px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--steel);
  opacity: 0.7;
}

/* ═══ PRE-ORDER PAGE ═══ */

.po-hero {
  background: var(--steel);
  padding: 172px 40px 110px;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.po-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: 0.05;
  background-image:
    radial-gradient(circle at 15% 20%, white 1.5px, transparent 1.5px),
    radial-gradient(circle at 85% 75%, white 1.5px, transparent 1.5px);
  background-size: 70px 70px, 90px 90px;
}

.po-hero-inner { position: relative; z-index: 2; max-width: 760px; margin: 0 auto; }

.po-eyebrow {
  font-family: 'Cinzel', serif;
  font-size: 10px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--gold-light);
  margin-bottom: 26px;
  display: block;
}

.po-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 64px;
  font-weight: 300;
  line-height: 1.02;
  color: white;
  margin-bottom: 10px;
}

.po-title em {
  font-style: italic;
  color: var(--gold-light);
  display: block;
  font-size: 52px;
  margin-top: 6px;
}

.po-hero-divider { width: 80px; height: 1px; background: var(--gold); margin: 34px auto; }

.po-hero-sub {
  font-family: 'Cormorant Garamond', serif;
  font-size: 23px;
  font-weight: 300;
  font-style: italic;
  color: rgba(255,255,255,0.78);
  line-height: 1.55;
  max-width: 560px;
  margin: 0 auto 46px;
}

.po-hero-btns { display: flex; gap: 20px; flex-wrap: wrap; justify-content: center; }

.po-intro { padding: 100px 40px 70px; max-width: 720px; margin: 0 auto; text-align: center; }

.po-intro-body {
  font-size: 17px;
  line-height: 1.9;
  color: var(--text-mid);
  margin-bottom: 34px;
}

.po-launch-note {
  display: inline-block;
  background: var(--steel-light);
  border: 1px solid rgba(74,122,155,0.2);
  padding: 20px 30px;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 20px;
  color: var(--steel-dark);
  line-height: 1.5;
}

.po-launch-note strong { font-style: normal; font-weight: 600; color: var(--steel); }

.po-benefits { padding: 30px 40px 110px; max-width: 1100px; margin: 0 auto; }

.po-benefits-header { text-align: center; margin-bottom: 68px; }

.po-benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px; }

.po-card {
  background: white;
  border: 1px solid rgba(74,122,155,0.14);
  border-top: 2px solid var(--gold);
  padding: 44px 34px;
  text-align: left;
  transition: transform 0.3s, box-shadow 0.3s;
}

.po-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(45,90,122,0.09); }

.po-card-num {
  font-family: 'Cinzel', serif;
  font-size: 12px;
  letter-spacing: 3px;
  color: var(--gold);
  display: block;
  margin-bottom: 22px;
}

.po-card-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 27px;
  font-weight: 400;
  color: var(--steel-dark);
  line-height: 1.2;
  margin-bottom: 14px;
}

.po-card-desc { font-size: 15px; line-height: 1.75; color: var(--text-light); }

.po-waitlist { background: var(--cream-warm); padding: 100px 40px; }

.po-form-wrap { max-width: 560px; margin: 0 auto; text-align: center; }

.po-form-card {
  background: white;
  border: 1px solid rgba(74,122,155,0.16);
  padding: 56px 48px;
  margin-top: 40px;
  text-align: left;
  box-shadow: 0 20px 50px rgba(45,90,122,0.07);
}

.po-field { margin-bottom: 22px; }

.po-field label {
  font-family: 'Cinzel', serif;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--text-mid);
  display: block;
  margin-bottom: 9px;
}

.po-field input {
  width: 100%;
  font-family: 'DM Sans', sans-serif;
  font-size: 16px;
  color: var(--text-dark);
  background: var(--cream);
  border: 1px solid rgba(74,122,155,0.22);
  padding: 15px 16px;
  transition: border-color 0.3s, box-shadow 0.3s;
}

.po-field input::placeholder { color: #b3ada3; }

.po-field input:focus {
  outline: none;
  border-color: var(--steel);
  box-shadow: 0 0 0 3px rgba(74,122,155,0.12);
}

.po-submit { width: 100%; padding: 18px; margin-top: 6px; font-size: 12px; }

.po-legal {
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--text-light);
  margin-top: 22px;
}

.po-legal a { color: var(--steel); text-decoration: underline; text-underline-offset: 2px; }

.po-assurance {
  font-family: 'Cinzel', serif;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--steel);
  opacity: 0.7;
  margin-top: 26px;
  text-align: center;
}

/* ═══ LEGAL / CONTENT PAGES ═══ */

.legal-header {
  background: var(--steel);
  padding: 156px 40px 76px;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.legal-header::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: 0.05;
  background-image:
    radial-gradient(circle at 15% 20%, white 1.5px, transparent 1.5px),
    radial-gradient(circle at 85% 75%, white 1.5px, transparent 1.5px);
  background-size: 70px 70px, 90px 90px;
}

.legal-header-inner { position: relative; z-index: 2; }

.legal-eyebrow {
  font-family: 'Cinzel', serif;
  font-size: 10px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--gold-light);
  margin-bottom: 22px;
  display: block;
}

.legal-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 60px;
  font-weight: 300;
  line-height: 1.05;
  color: white;
}

.legal-header-divider { width: 70px; height: 1px; background: var(--gold); margin: 28px auto 0; }

.legal-date {
  font-family: 'Cinzel', serif;
  font-size: 11px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  margin-top: 22px;
}

.legal-content { max-width: 760px; margin: 0 auto; padding: 84px 40px 100px; }

.legal-intro {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 21px;
  line-height: 1.6;
  color: var(--steel-dark);
  margin-bottom: 20px;
}

/* Markdown-rendered content inside legal/default pages */
.legal-content h2,
.content-page h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 34px;
  font-weight: 400;
  color: var(--steel-dark);
  line-height: 1.15;
  margin: 58px 0 26px;
}

.legal-content h2:first-child,
.content-page h2:first-child { margin-top: 0; }

.legal-content h3,
.content-page h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 24px;
  font-weight: 400;
  color: var(--steel);
  line-height: 1.2;
  margin: 34px 0 16px;
}

.legal-content hr,
.content-page hr {
  height: 1px;
  background: rgba(201,168,76,0.35);
  border: none;
  margin: 56px 0;
}

.legal-content p,
.content-page p {
  font-size: 16px;
  line-height: 1.85;
  color: var(--text-mid);
  margin-bottom: 20px;
}

.legal-content p strong,
.content-page p strong { color: var(--text-dark); font-weight: 500; }

.legal-content a,
.content-page a {
  color: var(--steel);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.legal-content a:hover,
.content-page a:hover { color: var(--steel-dark); }

.legal-content ul,
.content-page ul {
  list-style: none;
  margin: 0 0 20px;
  padding: 0;
}

.legal-content ul li,
.content-page ul li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 12px;
  font-size: 16px;
  line-height: 1.7;
  color: var(--text-mid);
}

.legal-content ul li::before,
.content-page ul li::before {
  content: '';
  position: absolute;
  left: 4px;
  top: 11px;
  width: 6px;
  height: 6px;
  background: var(--gold);
  border-radius: 50%;
}

.legal-content ol,
.content-page ol {
  list-style: none;
  margin: 0 0 20px;
  padding: 0;
  counter-reset: legalitem;
}

.legal-content ol li,
.content-page ol li {
  position: relative;
  padding-left: 42px;
  margin-bottom: 18px;
  font-size: 16px;
  line-height: 1.75;
  color: var(--text-mid);
  counter-increment: legalitem;
}

.legal-content ol li::before,
.content-page ol li::before {
  content: counter(legalitem);
  position: absolute;
  left: 0; top: 1px;
  width: 26px; height: 26px;
  border: 1px solid rgba(74,122,155,0.35);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Cinzel', serif;
  font-size: 11px;
  color: var(--steel);
}

.legal-note {
  background: var(--steel-light);
  border: 1px solid rgba(74,122,155,0.2);
  border-left: 3px solid var(--gold);
  padding: 24px 28px;
  margin: 26px 0;
  font-size: 16px;
  line-height: 1.7;
  color: var(--steel-dark);
}

.legal-basis {
  font-size: 15px;
  line-height: 1.75;
  color: var(--text-mid);
  padding: 14px 20px;
  background: rgba(74,122,155,0.06);
  border-left: 2px solid var(--steel-mid);
  margin: 0 0 22px;
}

.legal-basis strong { color: var(--steel-dark); font-weight: 600; }

/* Simple content pages (thank-you etc.) */
.content-page { max-width: 760px; margin: 0 auto; padding: 156px 40px 100px; }

/* ── ANIMATIONS ── */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── RESPONSIVE ── */
@media (max-width: 900px) {
  .site nav { gap: 14px; }
  .nav-links { display: none; }

  .hero { grid-template-columns: 1fr; }
  .hero-left { padding: 100px 32px 40px; }
  .hero-title { font-size: 60px; }
  .hero-title em { font-size: 42px; }
  .hero-right { min-height: 380px; padding-bottom: 40px; }
  .book-mockup { max-width: 400px; }

  .about-section { grid-template-columns: 1fr; padding: 60px 32px; gap: 40px; }
  .about-visual { max-height: 300px; }

  .guides-section { padding: 80px 24px; }
  .guides-grid { grid-template-columns: 1fr; max-width: 420px; }

  .features-section { padding: 80px 32px; }
  .features-grid { grid-template-columns: 1fr 1fr; gap: 32px; }

  .testimonial-section { padding: 80px 32px; }
  .testimonial-text { font-size: 26px; }

  .cta-section { padding: 80px 32px; }
  .cta-heading { font-size: 44px; }

  .po-hero { padding: 140px 26px 80px; }
  .po-title { font-size: 44px; }
  .po-title em { font-size: 34px; }
  .po-hero-sub { font-size: 20px; }
  .po-intro { padding: 70px 26px 50px; }
  .po-benefits { padding: 20px 26px 80px; }
  .po-benefits-grid { grid-template-columns: 1fr; max-width: 420px; margin: 0 auto; }
  .po-waitlist { padding: 80px 24px; }
  .po-form-card { padding: 40px 26px; }

  .section-heading { font-size: 44px; }
  .legal-header { padding: 130px 26px 60px; }
  .legal-title { font-size: 42px; }
  .legal-content { padding: 60px 26px 80px; }
  .legal-content h2, .content-page h2 { font-size: 28px; }
  .content-page { padding: 130px 26px 80px; }
  footer.site { padding: 0; }
  .footer-grid { grid-template-columns: 1fr; gap: 40px; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; scroll-behavior: auto !important; }
  .hero-eyebrow, .hero-title, .hero-divider, .hero-subtitle, .hero-btns, .book-mockup {
    animation: none !important;
    opacity: 1 !important;
  }
  .stats-track { animation: none !important; }
}

/* ═══ BLOG DESIGN (new) ═══ */
/* ═══════════════════════════════════════════════════════════════
   BLOG DESIGN SYSTEM — merged from the Her India Blog Template
   samples (article + index). Same tokens, two page layouts.
   ═══════════════════════════════════════════════════════════════ */

:root{
  --bg:#f5f6f6; --surface:#ffffff; --sand:#eef2f4; --line:#d6dee3;
  --ink:#1d2a33; --soft:#5a6a75;
  --steel:#4a7a9b; --steel-ink:#3f6d8f; --gold:#c9a84c; --gold-soft:#f5ecd6;
  --head:#1d2a33; --blue:#4a7a9b; --on-blue:#fdfaf4; --hdr:#fdfbf7; --pill-fg:#8a6d22;
  --band:#18262f; --band-fg:#eef2f4; --band-soft:#9fb1bd;
  --f-display:"Cormorant Garamond", Georgia, "Times New Roman", serif;
  --f-label:"Cinzel", Georgia, serif;
  --f-body:"DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono:"DM Mono", ui-monospace, Menlo, monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#111a20; --surface:#17232b; --sand:#1c2b34; --line:#2c3d48;
  --ink:#e6ecef; --soft:#9fb1bd; --head:#e6ecef; --blue:#2c536c; --on-blue:#f1f4f6; --hdr:#171f25; --pill-fg:#e0c57a;
  --steel:#7fb0cf; --steel-ink:#9cc4de; --gold:#d8bb67; --gold-soft:#2a2717;
  --band:#0b1216; --band-fg:#e6ecef; --band-soft:#8ea2ae; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#111a20; --surface:#17232b; --sand:#1c2b34; --line:#2c3d48;
  --ink:#e6ecef; --soft:#9fb1bd; --head:#e6ecef; --blue:#2c536c; --on-blue:#f1f4f6; --hdr:#171f25; --pill-fg:#e0c57a;
  --steel:#7fb0cf; --steel-ink:#9cc4de; --gold:#d8bb67; --gold-soft:#2a2717;
  --band:#0b1216; --band-fg:#e6ecef; --band-soft:#8ea2ae; color-scheme:dark}

body:not(.marketing){
  background:var(--bg); color:var(--ink);
  font-family:var(--f-body); font-size:17px; line-height:1.68; margin:0;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--steel-ink);text-underline-offset:3px}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.wrap{max-width:680px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.wrap.wide{max-width:1120px}

/* ── site chrome: light header, dark band footer ── */
.site{background:var(--hdr);border-bottom:1px solid var(--line)}
.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:18px;flex-wrap:wrap}
.logo{font-family:var(--f-display);font-style:italic;font-weight:500;font-size:25px;color:var(--steel-ink);text-decoration:none}
.site nav{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.site nav a{color:var(--soft);font-family:var(--f-label);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none}
.site nav a[aria-current]{color:var(--steel-ink)}
.site nav a.browse{color:var(--steel-ink);border:1px solid var(--gold);padding:8px 14px}
.site nav a.browse:hover{background:var(--gold-soft)}

footer.site{background:var(--band);color:var(--band-soft);font-size:13px}
footer.site .wrap{padding-block:30px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
footer.site a{color:var(--band-soft)}
footer.site a:hover{color:var(--band-fg)}
footer.site .foot-legal{display:flex;gap:16px;flex-wrap:wrap}

/* ── article page ── */
body:not(.marketing) main{padding-block:28px 64px}
.crumbs{font-size:13px;color:var(--soft);display:flex;flex-wrap:wrap;gap:6px}
.crumbs a{color:var(--soft)}
.eyebrow{font-family:var(--f-label);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-top:28px}
h1{font-family:var(--f-display);font-weight:600;font-size:clamp(34px,6vw,48px);line-height:1.08;margin:6px 0 16px;text-wrap:balance;color:var(--head)}
h2{font-family:var(--f-display);font-weight:600;font-size:30px;line-height:1.15;margin:0 0 12px;text-wrap:balance;color:var(--head)}
h3{font-family:var(--f-body);font-weight:600;font-size:17px;margin:0 0 4px;color:var(--ink)}
.meta{display:flex;flex-wrap:wrap;gap:4px 18px;font-size:13.5px;color:var(--soft);padding-bottom:20px;border-bottom:1px solid var(--line)}
.meta b{font-weight:600;color:var(--ink)}
.article{display:flex;flex-direction:column;gap:40px;margin-top:28px}
.article p{margin:0}
.article section{display:flex;flex-direction:column;gap:12px}
.article ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.article li::marker{color:var(--gold)}
.lead{font-size:19px;line-height:1.6}

.quick{background:var(--sand);border-left:3px solid var(--steel);padding:20px 22px;display:flex;flex-direction:column;gap:10px}
.quick .k{font-family:var(--f-label);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--steel-ink)}
.quick .verdict{font-family:var(--f-display);font-size:24px;font-weight:600;line-height:1.2;color:var(--head)}

figure{margin:0;display:flex;flex-direction:column;gap:8px}
figure img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;max-width:100%}
figcaption{font-size:13px;color:var(--soft)}
.hero-fig{margin-top:20px}
.hero-fig figcaption{text-align:right;font-size:12px}

.cta-block{background:var(--blue);color:var(--on-blue);padding:28px 26px;display:grid;gap:14px;position:relative}
.cta-block::before{content:"";position:absolute;inset:8px;border:1px solid color-mix(in srgb,var(--on-blue) 30%,transparent);pointer-events:none}
.cta-block .k{font-family:var(--f-label);font-size:12px;letter-spacing:.18em;text-transform:uppercase;opacity:.85}
.cta-block h2{color:var(--on-blue);margin:0}
.cta-block p{margin:0;color:color-mix(in srgb,var(--on-blue) 86%,transparent)}
.cta-block .btn{justify-self:start;display:inline-block;background:var(--on-blue);color:var(--steel-ink);font-weight:600;font-family:var(--f-label);font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:12px 22px;text-decoration:none}
.cta-block small{color:color-mix(in srgb,var(--on-blue) 75%,transparent);font-size:12.5px}

.faq{display:flex;flex-direction:column;gap:0}
.faq h2{margin-bottom:12px}
.faq details{border-top:1px solid var(--line)}
.faq details:last-of-type{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0}
.faq summary::-webkit-details-marker{display:none}
.faq summary h3{margin:0}
.faq summary::after{content:"+";font-family:var(--f-display);font-size:26px;line-height:1;color:var(--steel-ink);flex:none;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 32px 16px 0;margin:0}
@media (prefers-reduced-motion:reduce){.faq summary::after{transition:none}}

.author-box{display:grid;grid-template-columns:76px 1fr;gap:18px;align-items:start;background:var(--surface);border:1px solid var(--line);padding:20px}
.avatar{width:76px;height:76px;background:var(--sand);display:grid;place-items:center;font-family:var(--f-display);font-size:30px;color:var(--steel-ink);border:1px solid var(--line)}
.author-box .name{font-family:var(--f-display);font-size:22px;font-weight:600;line-height:1.2;color:var(--head)}
.author-box p{font-size:15px;color:var(--soft);margin:6px 0 0}

.next{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.card{background:var(--surface);border:1px solid var(--line);padding:16px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:6px}
.card .k{font-family:var(--f-label);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.card .t{font-family:var(--f-display);font-size:20px;font-weight:600;line-height:1.2;color:var(--head)}
.card:hover{border-color:var(--steel)}

.cluster{border-top:2px solid var(--ink);padding-top:16px}
.cluster h2{font-size:26px}
.cluster ul{list-style:none;padding:0;margin:0;columns:2 220px;column-gap:28px}
.cluster li{break-inside:avoid;padding:4px 0;font-size:15px}
.cluster li[aria-current] a{color:var(--ink);font-weight:600;text-decoration:none}

/* ── three-column article layout ── */
.layout{max-width:1320px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"content" "right" "left";gap:48px}
.layout > .wrap{grid-area:content;padding:0;max-width:680px;width:100%;margin:0 auto;min-width:0}
.rail{min-width:0;display:flex;flex-direction:column;gap:28px;max-width:680px;width:100%;margin:0 auto}
.rail-left{grid-area:left}
.rail-right{grid-area:right}
@media (min-width:1180px){
  .layout{grid-template-columns:230px minmax(0,680px) 270px;grid-template-areas:"left content right";justify-content:center;gap:44px}
  .rail{max-width:none;margin:0;padding-top:120px}
  .sticky{position:sticky;top:calc(env(safe-area-inset-top,0px) + 24px)}
}
.rail-k{font-family:var(--f-label);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--soft);padding-bottom:8px;border-bottom:1px solid var(--line);margin-bottom:10px;display:block}
.search input{width:100%;font:inherit;font-size:15px;padding:10px 12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:0}
.search input:focus{outline:2px solid var(--steel);outline-offset:0}
.results{list-style:none;padding:0;margin:10px 0 0;display:flex;flex-direction:column;gap:2px}
.results a,.rail-list a{display:block;padding:6px 0;font-size:14.5px;line-height:1.4;text-decoration:none;color:var(--ink)}
.results a:hover,.rail-list a:hover{color:var(--steel-ink)}
.results .empty{font-size:14px;color:var(--soft);padding:6px 0}
.rail-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column}
.rail-list li + li{border-top:1px solid var(--line)}
.rail-list.thumbs a{display:grid;grid-template-columns:64px 1fr;gap:12px;align-items:center;padding:10px 0}
.rail-list.thumbs img{width:64px;height:48px;object-fit:cover;display:block;max-width:100%}
.rail-list.thumbs span{min-width:0}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tags a{font-size:13px;padding:4px 10px;border:1px solid var(--line);text-decoration:none;color:var(--ink);background:var(--surface)}
.tags a:hover{border-color:var(--steel)}
.mini-author{display:grid;grid-template-columns:52px 1fr;gap:12px;align-items:center}
.mini-author .avatar{width:52px;height:52px;font-size:22px}
.mini-author b{font-family:var(--f-display);font-size:19px;font-weight:600;display:block;line-height:1.2;color:var(--head)}
.mini-author span{font-size:13.5px;color:var(--soft);line-height:1.45;display:block}
.mini-author a{font-size:13.5px}
.guides{display:flex;flex-direction:column;gap:10px}
.guide{background:var(--surface);color:var(--ink);border:1px solid var(--line);padding:16px;display:flex;flex-direction:column;gap:6px;border-top:2px solid var(--gold)}
.guide .gk{align-self:flex-start;background:var(--gold-soft);color:var(--pill-fg);padding:3px 8px;font-family:var(--f-label);font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.guide b{font-family:var(--f-display);font-size:20px;font-weight:600;line-height:1.15;color:var(--steel-ink)}
.guide span{font-size:13px;color:var(--soft);line-height:1.45}
.guide .buy{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px}
.guide .price{font-family:var(--f-display);font-size:22px;font-weight:600;color:var(--ink)}
.guide a{background:var(--blue);color:#fff;border:0;font-family:var(--f-label);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;padding:8px 12px;text-decoration:none}

/* ── blog index page ── */
.blog-main{padding-block:44px 72px}
.intro{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:32px;align-items:end}
.intro p{margin:0;font-size:18px;color:var(--soft);max-width:560px}
.intro .search label{display:block;font-family:var(--f-label);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--soft);margin-bottom:6px}
@media (max-width:760px){.intro{grid-template-columns:1fr}}

.tabs-wrap{margin-top:32px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:thin}
.tabs{display:flex;gap:4px;min-width:max-content}
.tabs a{display:flex;align-items:center;gap:6px;padding:12px 14px;font-size:14.5px;font-weight:500;color:var(--soft);text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tabs a:hover{color:var(--ink)}
.tabs a[aria-current]{color:var(--ink);border-bottom-color:var(--gold)}
.tabs .n{font-family:var(--f-mono);font-size:11.5px;color:var(--soft);font-variant-numeric:tabular-nums}

.status{font-size:13.5px;color:var(--soft);margin:18px 0 0}

.featured{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:0;margin-top:22px;background:var(--surface);border:1px solid var(--line);text-decoration:none;color:var(--ink)}
.featured img{width:100%;height:100%;min-height:280px;object-fit:cover;display:block;max-width:100%}
.featured .body{padding:28px 30px;display:flex;flex-direction:column;justify-content:center;gap:10px;min-width:0}
.featured h2{font-size:clamp(28px,3.4vw,38px);line-height:1.1;margin:0}
.featured p{margin:0;color:var(--soft)}
.featured:hover h2{color:var(--steel-ink)}
@media (max-width:760px){.featured{grid-template-columns:1fr}.featured img{min-height:0;aspect-ratio:3/2;height:auto}}

.kicker{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12.5px;color:var(--soft)}
.cat{font-family:var(--f-label);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}

.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 24px;margin-top:28px}
@media (max-width:900px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.grid{grid-template-columns:1fr}}
.post-card{display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--ink);min-width:0}
.post-card img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;max-width:100%}
.post-card h3{font-family:var(--f-display);font-size:23px;font-weight:600;line-height:1.15;margin:0;color:var(--head);text-wrap:balance}
.post-card:hover h3{color:var(--steel-ink)}

.band{grid-column:1/-1;background:var(--blue);color:var(--on-blue);padding:28px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;position:relative}
.band::before{content:"";position:absolute;inset:8px;border:1px solid color-mix(in srgb,var(--on-blue) 30%,transparent);pointer-events:none}
.band .k{font-family:var(--f-label);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;opacity:.85}
.band h2{color:var(--on-blue);margin:4px 0 6px;font-size:30px;line-height:1.1}
.band p{margin:0;color:color-mix(in srgb,var(--on-blue) 86%,transparent)}
.band a{position:relative;background:var(--on-blue);color:var(--steel-ink);font-family:var(--f-label);font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;padding:13px 20px;text-decoration:none;white-space:nowrap}
@media (max-width:640px){.band{grid-template-columns:1fr}.band a{justify-self:start}}

.more{display:flex;justify-content:center;margin-top:36px}
.more a,.more button{font-family:var(--f-label);font-size:12px;letter-spacing:.14em;text-transform:uppercase;background:transparent;color:var(--steel-ink);border:1px solid var(--steel);padding:12px 22px;cursor:pointer;text-decoration:none;display:inline-block}
.more a:hover,.more button:hover{background:var(--steel);color:#fff}

.dest{margin-top:64px;display:flex;flex-direction:column;gap:14px}
.dest h2{font-size:32px;margin:0}
.dest-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.dest-row a{background:var(--surface);border:1px solid var(--line);padding:16px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:4px}
.dest-row a b{font-family:var(--f-display);font-size:22px;font-weight:600;color:var(--head)}
.dest-row a span{font-size:13px;color:var(--soft)}
.dest-row a.soon{opacity:.6}
.dest-row a:hover{border-color:var(--steel)}
.dest-row > span{background:var(--surface);border:1px solid var(--line);padding:16px;display:flex;flex-direction:column;gap:4px;opacity:.6}
.dest-row > span b{font-family:var(--f-display);font-size:22px;font-weight:600;color:var(--head)}
.dest-row > span span{font-size:13px;color:var(--soft)}

/* ── responsive ── */
@media (max-width:480px){
  body{font-size:16px}
  .author-box{grid-template-columns:1fr}
  h2{font-size:26px}
  .site .wrap{padding-block:14px}
  .site nav{gap:14px}
}

/* index extras */
.empty{grid-column:1/-1;padding:32px 0;color:var(--soft);margin:0}
figure figcaption{font-size:13px;color:var(--soft)}
@media (max-width:900px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.featured{grid-template-columns:1fr}.featured img{min-height:0;aspect-ratio:3/2;height:auto}}
@media (max-width:640px){.band{grid-template-columns:1fr}.band a{justify-self:start}}
@media (max-width:560px){.grid{grid-template-columns:1fr}}