/* Angarum Media — shared brand stylesheet (extracted from index.html for multi-page reuse) */
/* =========================================================
   Angarum Media — Brand stylesheet (inline)
   Editorial-luxe agency. Dark canvas, Royal Gold accents, calm motion.
   ========================================================= */
:root {
  --ink-900:#050505; --ink-800:#0B1220; --ink-700:#111827; --ink-600:#1F2937;
  --forest:#0F3F35; --forest-d:#0A2E27;
  --emerald:#04695A; --emerald-d:#034D43;   /* zomorodi — brighter than forest */
  --canvas:#FFFFFF;                          /* page background — pure white */
  --canvas-alt:#F6F6F3;                      /* neutral warm off-white (no green tint) */
  --cream:#FAF8F5; --silver:#E5E7EB;          /* cream kept for legacy text use on dark */
  --teal:#006D5B; --teal-br:#0B7B63;
  --gold:#D4AF37; --gold-soft:#B8954D;
  --terra:#B86A3E;
  --ease-luxe:cubic-bezier(0.16,1,0.3,1);
  --shadow-elev:0 30px 80px -30px rgba(0,0,0,0.6), 0 1px 0 rgba(255,255,255,0.04) inset;
}
*{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; min-width:0; }
html{
  scroll-behavior:smooth; scroll-padding-top:80px;
  overflow-x:clip;
  background:var(--canvas);
}
body{
  /* White default — clean editorial canvas. Section punctuation in ink or emerald. */
  background:var(--canvas);
  color:#0F3F35;
  font-family:'Poppins',system-ui,sans-serif;
  font-weight:300;
  line-height:1.6;
  overflow-x:clip;
  max-width:100vw;
}
/* Belt + braces: enforce no horizontal overflow */
img, video, svg, iframe{ max-width:100%; height:auto; }
section, div, article, aside, header, footer, main, nav{ max-width:100%; }

/* --- Typography --- */
.font-display{ font-family:'Playfair Display',Georgia,serif; }
.display-2xl{ font-family:'Playfair Display',serif;font-weight:400;line-height:.95;letter-spacing:-.03em;font-size:clamp(3.5rem,7vw + 1rem,9rem); }
.display-xl { font-family:'Playfair Display',serif;font-weight:400;line-height:1.0;letter-spacing:-.025em;font-size:clamp(2.75rem,5vw + 1rem,6rem); }
.display-lg { font-family:'Playfair Display',serif;font-weight:400;line-height:1.05;letter-spacing:-.02em;font-size:clamp(2.25rem,4vw + 1rem,4.5rem); }
.display-md { font-family:'Playfair Display',serif;font-weight:400;line-height:1.1;letter-spacing:-.015em;font-size:clamp(1.75rem,2.5vw + 1rem,3.25rem); }
.display-sm { font-family:'Playfair Display',serif;font-weight:400;line-height:1.15;letter-spacing:-.01em;font-size:clamp(1.5rem,1.6vw + 1rem,2.25rem); }
.body-lg{ font-size:clamp(1.05rem,.4vw + 1rem,1.25rem);line-height:1.65;font-weight:300; }

.eyebrow{
  font-family:'Poppins',sans-serif;font-weight:500;font-size:.7rem;
  text-transform:uppercase;letter-spacing:.22em;color:var(--gold);
  display:inline-flex;align-items:center;gap:.75rem;
}
.eyebrow::before{ content:'';display:inline-block;width:28px;height:1px;background:var(--gold);opacity:.7; }
.serif-italic{ font-family:'Playfair Display',serif;font-style:italic;font-weight:400; }

/* --- Gradient & foil text --- */
.text-gradient-royal{
  background:linear-gradient(135deg,#F4E7BF 0%,var(--gold) 40%,var(--teal-br) 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.text-gradient-foil{
  background:linear-gradient(100deg,#B8954D 0%,#D4AF37 18%,#F4E7BF 28%,#FFF7D9 33%,#F4E7BF 38%,#D4AF37 48%,#B8954D 70%,#D4AF37 100%);
  background-size:220% 100%;background-position:0% 50%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  animation:foil-shimmer 6s linear infinite;
}
@keyframes foil-shimmer{ 0%{background-position:0% 50%} 100%{background-position:-220% 50%} }

/* --- Atmospheric backgrounds --- */
.bg-canvas{
  background:
    radial-gradient(60% 50% at 20% 0%,rgba(0,109,91,.18) 0%,transparent 60%),
    radial-gradient(50% 60% at 95% 30%,rgba(212,175,55,.10) 0%,transparent 60%),
    radial-gradient(80% 70% at 50% 110%,rgba(11,123,99,.15) 0%,transparent 70%),
    var(--ink-700);
}
.bg-canvas-soft{
  background:radial-gradient(50% 40% at 10% 10%,rgba(212,175,55,.06) 0%,transparent 60%),var(--ink-700);
}

/* --- "Cream" sections — class name kept for backward compat, render WHITE. --- */
.section-cream{ background:var(--canvas); color:#0F3F35; }
.section-cream.alt{ background:var(--canvas-alt); }   /* slight tint for tonal alternation */
.section-cream.typo{ position:relative; overflow:hidden; }  /* enables ::before bg typography */
.section-cream .eyebrow{ color:var(--teal); }
.section-cream .eyebrow::before{ background:var(--teal); }
.section-cream .display-2xl,
.section-cream .display-xl,
.section-cream .display-lg,
.section-cream .display-md,
.section-cream .display-sm{ color:#0F3F35; }
/* Cream-section overrides for dark-mode utility classes. Keep the markup
   identical to the dark sections; just remap text/border tones on cream. */
.section-cream .text-ink-50{ color:#0F3F35; }
.section-cream .text-ink-50\/85,
.section-cream .text-ink-50\/80,
.section-cream .text-ink-50\/75,
.section-cream .text-ink-50\/70{ color:rgba(15,63,53,.85); }
.section-cream .text-ink-50\/65,
.section-cream .text-ink-50\/60{ color:rgba(15,63,53,.72); }
.section-cream .text-ink-50\/55,
.section-cream .text-ink-50\/50,
.section-cream .text-ink-50\/45{ color:rgba(15,63,53,.58); }
.section-cream .text-ink-50\/40,
.section-cream .text-ink-50\/35,
.section-cream .text-ink-50\/30{ color:rgba(15,63,53,.4); }
.section-cream .border-gold-400\/30,
.section-cream .border-gold-400\/25,
.section-cream .border-gold-400\/22{ border-color:rgba(15,63,53,.2); }
.section-cream .border-gold-400\/15,
.section-cream .border-gold-400\/12,
.section-cream .border-gold-400\/10{ border-color:rgba(15,63,53,.1); }
.section-cream .text-gold-400{ color:var(--teal); }
.section-cream .text-gold-400\/90,
.section-cream .text-gold-400\/85,
.section-cream .text-gold-400\/80{ color:var(--teal-br); }
.section-cream .bg-ink-900\/40{ background:rgba(15,63,53,.06); }
.section-cream .bg-canvas-soft{ background:transparent; }
.section-cream .glass{
  background:rgba(255,255,255,.72);
  border-color:rgba(0,109,91,.20);
  box-shadow:
    0 30px 80px -30px rgba(15,63,53,.22),
    0 1px 0 rgba(255,255,255,.6) inset,
    inset 0 0 0 1px rgba(212,175,55,.10);
  position:relative;
}
/* Subtle gold corner accents on the form/insight-letter glass card */
.section-cream .glass::before,
.section-cream .glass::after{
  content:'';position:absolute;width:28px;height:28px;
  border:1px solid rgba(212,175,55,.55);
  pointer-events:none;
}
.section-cream .glass::before{ top:-1px;left:-1px;border-right:0;border-bottom:0; }
.section-cream .glass::after{ bottom:-1px;right:-1px;border-left:0;border-top:0; }
.section-cream .amc-input,
.section-cream .amc-select,
.section-cream .amc-textarea{
  background:rgba(255,255,255,.85);
  border-color:rgba(0,109,91,.22);
  color:#0F3F35;
}
.section-cream .amc-input::placeholder,
.section-cream .amc-textarea::placeholder{ color:rgba(15,63,53,.4); }
.section-cream .amc-input:focus,
.section-cream .amc-select:focus,
.section-cream .amc-textarea:focus{
  border-color:var(--teal);background:#fff;
  box-shadow:0 0 0 3px rgba(212,175,55,.18);
}
.section-cream .amc-label{ color:var(--teal); }
.section-cream .chip{
  border-color:rgba(0,109,91,.28);color:rgba(15,63,53,.85);
  background:rgba(255,255,255,.55);
}
.section-cream .chip:hover{ border-color:var(--teal);color:var(--teal); }
.section-cream .chip.is-on{
  background:var(--teal);color:var(--gold);
  border-color:var(--teal);
}
/* Keep btn-primary GOLD even on cream — primary CTA must stay consistent.
   The teal+gold combo on cream comes from teal field accents + gold submit button. */
.section-cream .royal-divider{ color:var(--teal);opacity:.55; }
.section-cream .royal-divider::before,
.section-cream .royal-divider::after{
  background:linear-gradient(90deg,transparent,var(--teal),transparent);
}
.section-cream .royal-divider .dot{ background:var(--teal);box-shadow:0 0 0 3px rgba(0,109,91,.12); }
.section-cream .text-gradient-foil{
  background:linear-gradient(100deg,#0B7B63 0%,#006D5B 30%,#0F3F35 55%,#006D5B 80%,#0B7B63 100%);
  background-size:220% 100%;background-position:0% 50%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.section-cream .step-row{ border-bottom-color:rgba(15,63,53,.12); }
.section-cream .step-row:hover{ border-bottom-color:rgba(15,63,53,.3); }
.section-cream .step-num{ color:var(--teal); }
.section-cream .quote-card{
  background:rgba(255,255,255,.7);
  border-color:rgba(15,63,53,.12);
}
.section-cream .quote-card::before{ color:rgba(15,63,53,.3); }
.section-cream .quote-card .body{ color:#0F3F35; }
.section-cream .quote-card .who .avatar{
  background:linear-gradient(135deg,var(--teal),#005C4D);
  color:var(--gold);
  border-color:rgba(212,175,55,.5);
}
.section-cream .quote-card .who .name{ color:#0F3F35; }
.section-cream .quote-card .who .role{ color:rgba(15,63,53,.55); }
.section-cream .lux-card{
  background:rgba(255,255,255,.6);
  border-color:rgba(15,63,53,.12);
}
.section-cream .lux-card::before{ background:var(--teal); }
.section-cream .bleed-numeral{
  background:linear-gradient(180deg,rgba(15,63,53,.18) 0%,rgba(15,63,53,0) 100%);
  -webkit-background-clip:text;background-clip:text;
}
.section-cream .btn-ghost{ border-color:rgba(15,63,53,.25);color:#0F3F35; }
.section-cream .btn-ghost:hover{ border-color:var(--teal);color:var(--teal); }
.section-cream .tier-card{
  background:rgba(255,255,255,.75);
  border-color:rgba(15,63,53,.14);
}
.section-cream .tier-card:hover{ border-color:rgba(0,109,91,.4); }
.section-cream .tier-card.featured{
  border-color:rgba(0,109,91,.55);
  background:rgba(255,255,255,.92);
  box-shadow:0 30px 80px -30px rgba(0,109,91,.25);
}
.section-cream .tier-card.featured::before{
  background:var(--teal);color:var(--cream);
}
.section-cream .tier-card .tier-name,
.section-cream .tier-card .tier-price{ color:#0F3F35; }
.section-cream .tier-card .tier-from,
.section-cream .tier-card .tier-unit{ color:var(--teal); }
.section-cream .tier-card ul li{ color:rgba(15,63,53,.78); }
.section-cream .tier-card ul li::before{ background:var(--teal); }
.section-cream .stat-num{ color:var(--teal); }
.section-cream .practice-row{ border-top-color:rgba(15,63,53,.10); }
.section-cream .practice-row .num{ -webkit-text-stroke:1px rgba(0,109,91,.5); }
.section-cream .practice-row:hover .num{ -webkit-text-stroke-color:rgba(0,109,91,.85); }
.section-cream .royal-road-svg .road-base{ stroke:rgba(0,109,91,.15); }
.section-cream .royal-road-svg .station-dot{ fill:var(--teal); }
.section-cream .royal-road-svg .station text{ fill:#0F3F35; }
.section-cream .pull-quote::before{ color:var(--teal); }
.section-cream .depth-frame::before,
.section-cream .depth-frame::after{ border-color:rgba(0,109,91,.4); }

/* invert-dark — opt OUT of cream overrides for a dark inner card sitting on a cream section */
.section-cream .invert-dark .display-2xl,
.section-cream .invert-dark .display-xl,
.section-cream .invert-dark .display-lg,
.section-cream .invert-dark .display-md,
.section-cream .invert-dark .display-sm{ color:#FAF8F5; }
.section-cream .invert-dark .text-ink-50{ color:#FAF8F5; }
.section-cream .invert-dark .text-ink-50\/85,
.section-cream .invert-dark .text-ink-50\/80,
.section-cream .invert-dark .text-ink-50\/75,
.section-cream .invert-dark .text-ink-50\/70{ color:rgba(250,248,245,.82); }
.section-cream .invert-dark .text-ink-50\/65,
.section-cream .invert-dark .text-ink-50\/60{ color:rgba(250,248,245,.7); }
.section-cream .invert-dark .text-ink-50\/55,
.section-cream .invert-dark .text-ink-50\/50,
.section-cream .invert-dark .text-ink-50\/45{ color:rgba(250,248,245,.55); }
.section-cream .invert-dark .text-ink-50\/40,
.section-cream .invert-dark .text-ink-50\/35,
.section-cream .invert-dark .text-ink-50\/30{ color:rgba(250,248,245,.35); }
.section-cream .invert-dark .text-gold-400{ color:#D4AF37; }
.section-cream .invert-dark .text-gold-400\/90,
.section-cream .invert-dark .text-gold-400\/85,
.section-cream .invert-dark .text-gold-400\/80{ color:rgba(212,175,55,.85); }
.section-cream .invert-dark .border-gold-400\/30,
.section-cream .invert-dark .border-gold-400\/25,
.section-cream .invert-dark .border-gold-400\/22{ border-color:rgba(212,175,55,.3); }
.section-cream .invert-dark .border-gold-400\/15,
.section-cream .invert-dark .border-gold-400\/12,
.section-cream .invert-dark .border-gold-400\/10{ border-color:rgba(212,175,55,.15); }
.section-cream .invert-dark .bg-ink-900\/40{ background:rgba(5,5,5,.4); }
.section-cream .invert-dark .eyebrow{ color:#D4AF37; }
.section-cream .invert-dark .eyebrow::before{ background:#D4AF37; }
.section-cream .invert-dark .text-gradient-foil{
  background:linear-gradient(100deg,#B8954D 0%,#D4AF37 18%,#F4E7BF 28%,#FFF7D9 33%,#F4E7BF 38%,#D4AF37 48%,#B8954D 70%,#D4AF37 100%);
  background-size:220% 100%;background-position:0% 50%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}

/* --- FAQ accordion --- */
.faq-row{
  border-bottom:1px solid rgba(15,63,53,.12);
  transition:border-color 400ms var(--ease-luxe);
}
.faq-row:first-child{ border-top:1px solid rgba(15,63,53,.12); }
.faq-row[open]{ border-bottom-color:rgba(0,109,91,.5); }
.faq-row summary{
  list-style:none;
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
  padding:1.6rem 0;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.faq-row summary::-webkit-details-marker{ display:none; }
.faq-row .faq-q{
  font-family:'Playfair Display',serif; font-weight:400;
  font-size:clamp(1.1rem,1.6vw,1.4rem); line-height:1.3;
  color:#0F3F35;
  transition:color 400ms var(--ease-luxe);
}
.faq-row summary:hover .faq-q{ color:var(--teal); }
.faq-row .faq-icon{
  color:var(--teal);
  transition:transform 400ms var(--ease-luxe);
  flex-shrink:0;
}
.faq-row[open] .faq-icon{ transform:rotate(45deg); }
.faq-row .faq-a{
  padding:0 0 1.8rem 0;
  font-family:'Poppins',sans-serif; font-weight:300;
  font-size:.98rem; line-height:1.7;
  color:rgba(15,63,53,.78);
  max-width:60ch;
  animation:faq-open .5s var(--ease-luxe);
}
.faq-row .faq-a a{
  color:var(--teal); border-bottom:1px solid rgba(0,109,91,.3);
  transition:border-color 300ms;
}
.faq-row .faq-a a:hover{ border-bottom-color:var(--teal); }
@keyframes faq-open{
  from{ opacity:0; transform:translateY(-6px); }
  to  { opacity:1; transform:translateY(0); }
}

/* --- Glass --- */
.glass{
  background:rgba(15,63,53,.40);
  border:1px solid rgba(212,175,55,.18);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:var(--shadow-elev);
}
.glass-soft{
  background:rgba(250,248,245,.04);
  border:1px solid rgba(250,248,245,.08);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}

/* --- Divider --- */
.royal-divider{ display:flex;align-items:center;gap:14px;color:var(--gold);opacity:.65; }
.royal-divider::before,.royal-divider::after{ content:'';height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--gold),transparent); }
.royal-divider .dot{ width:6px;height:6px;border-radius:999px;background:var(--gold);box-shadow:0 0 0 3px rgba(212,175,55,.15); }

/* --- Buttons --- */
.btn{
  display:inline-flex;align-items:center;gap:.65rem;
  padding:.95rem 1.7rem;font-family:'Poppins',sans-serif;font-weight:500;font-size:.85rem;
  letter-spacing:.08em;text-transform:uppercase;border-radius:999px;
  transition:all 600ms var(--ease-luxe);cursor:pointer;border:1px solid transparent;white-space:nowrap;
}
.btn-primary{ background:var(--gold);color:var(--teal);box-shadow:0 10px 30px -10px rgba(212,175,55,.45); }
.btn-primary:hover{ background:#E2C265;color:#005C4D;transform:translateY(-3px);box-shadow:0 16px 40px -10px rgba(212,175,55,.55); }
.btn-ghost{ border-color:rgba(250,248,245,.22);color:var(--cream);background:transparent; }
.btn-ghost:hover{ border-color:var(--gold);color:var(--gold);transform:translateY(-3px); }
.section-cream .btn-ghost{ border-color:rgba(15,63,53,.25);color:#0F3F35; }
.section-cream .btn-ghost:hover{ border-color:var(--teal);color:var(--teal); }

/* --- Lux card --- */
.lux-card{
  position:relative;padding:2.25rem 2rem;
  background:linear-gradient(180deg,rgba(15,63,53,.35),rgba(10,46,39,.45));
  border:1px solid rgba(212,175,55,.14);border-radius:4px;overflow:hidden;
  transition:transform 700ms var(--ease-luxe),border-color 700ms var(--ease-luxe);
}
.lux-card::before{
  content:'';position:absolute;top:0;left:0;width:56px;height:1px;background:var(--gold);
  transition:width 700ms var(--ease-luxe);
}
.lux-card:hover{ transform:translateY(-6px);border-color:rgba(212,175,55,.4); }
.lux-card:hover::before{ width:100%; }

/* --- Nav --- Clean WHITE bar (matches the live WordPress header). Always visible, always readable.
   Brand priority: emerald-teal + royal gold accents on white; ink navy text. */
.site-nav{
  position:fixed;inset:0 0 auto 0;z-index:50;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid #E5E7EB;
  box-shadow:0 1px 0 rgba(17,24,39,.02);
  transition:box-shadow 400ms var(--ease-luxe), background 400ms var(--ease-luxe);
}
.site-nav.scrolled{
  background:rgba(255,255,255,.98);
  box-shadow:0 10px 30px -18px rgba(17,24,39,.22);
}
.nav-link{
  position:relative;font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;
  color:#1F2937;
  padding:.5rem 0;transition:color 400ms var(--ease-luxe);
}
.nav-link::after{
  content:'';position:absolute;left:0;bottom:-2px;width:0;height:1px;background:var(--teal-br);
  transition:width 400ms var(--ease-luxe);
}
.nav-link:hover,.nav-link.active{ color:var(--teal-br); }
.nav-link.active::after,.nav-link:hover::after{ width:100%; }
.nav-phone{ color:rgba(31,41,55,.72); transition:color 400ms var(--ease-luxe); }
.nav-phone:hover{ color:var(--teal-br); }
.nav-burger{ color:#1F2937; }

/* Compact variant of btn-primary for the nav (same DNA, slightly smaller padding) */
.btn-primary.btn-sm{
  padding:.6rem 1.2rem;
  font-size:.7rem;
  letter-spacing:.18em;
}

/* --- Mobile menu drawer --- */
.mobile-drawer{
  position:fixed;inset:0;z-index:60;background:rgba(5,5,5,.96);
  display:none;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;
  opacity:0;transition:opacity 500ms var(--ease-luxe);
}
.mobile-drawer.open{ display:flex;opacity:1; }
.mobile-drawer a{
  font-family:'Playfair Display',serif;font-size:2rem;color:var(--cream);
  transition:color 300ms;
}
.mobile-drawer a:hover{ color:var(--gold); }

/* --- Persian zigzag divider --- */
/* Old patterned zigzag — kept for backward compat but no longer used. */
.persian-border{ display:none; }

/* New luxe divider — thin gold hairline with a centered diamond ornament */
.luxe-divider{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto;
  max-width:1480px;
  padding:1.5rem 0;
  pointer-events:none;
}
.luxe-divider::before,
.luxe-divider::after{
  content:'';flex:1;height:1px;max-width:42%;
  background:linear-gradient(90deg,transparent,rgba(212,175,55,.45),transparent);
}
.luxe-divider .luxe-mark{
  flex-shrink:0;
  width:14px;height:14px;
  margin:0 1.2rem;
  border:1px solid rgba(212,175,55,.6);
  background:rgba(212,175,55,.08);
  transform:rotate(45deg);
  box-shadow:0 0 0 4px rgba(212,175,55,.06);
}
.section-cream .luxe-divider .luxe-mark{
  border-color:rgba(0,109,91,.55);
  background:rgba(0,109,91,.06);
  box-shadow:0 0 0 4px rgba(0,109,91,.05);
}
.section-cream .luxe-divider::before,
.section-cream .luxe-divider::after{
  background:linear-gradient(90deg,transparent,rgba(0,109,91,.35),transparent);
}

/* --- Hero --- */
.hero-stage{ position:relative;overflow:hidden;background:#050505; }
.hero-video{
  position:absolute;inset:0;z-index:0;
  width:100%;height:100%;
  object-fit:cover;
  filter:saturate(1.05) contrast(1.05);
  /* darken slightly so headline is always readable */
  opacity:.85;
}
.hero-sky{
  position:absolute;inset:0;z-index:1;
  background:
    radial-gradient(120% 70% at 50% 0%,rgba(212,175,55,.10) 0%,transparent 55%),
    radial-gradient(80% 60% at 80% 30%,rgba(11,123,99,.10) 0%,transparent 60%),
    radial-gradient(60% 70% at 10% 50%,rgba(184,106,62,.06) 0%,transparent 65%);
  pointer-events:none;
}
.hero-particle{
  position:absolute;border-radius:999px;
  background:radial-gradient(circle,rgba(244,231,191,.9) 0%,rgba(212,175,55,0) 70%);
  pointer-events:none;z-index:1;filter:blur(.4px);
  animation:particle-drift 18s linear infinite;
}
@keyframes particle-drift{
  0%{ transform:translateY(20vh) translateX(0) scale(.6);opacity:0; }
  10%{ opacity:1; } 90%{ opacity:1; }
  100%{ transform:translateY(-30vh) translateX(30px) scale(1);opacity:0; }
}
.persepolis-silhouette{
  position:absolute;bottom:-2px;left:0;right:0;width:100%;height:auto;z-index:2;
  pointer-events:none;opacity:.85;
}
.hero-vignette{
  position:absolute;inset:0;z-index:3;pointer-events:none;
  background:
    radial-gradient(140% 90% at 50% 40%,transparent 35%,rgba(0,0,0,.75) 100%),
    linear-gradient(180deg,rgba(5,5,5,.35) 0%,transparent 25%,transparent 60%,rgba(5,5,5,.95) 100%);
}
.headline-bleed{
  font-family:'Playfair Display',serif;font-weight:400;
  letter-spacing:-.035em;line-height:.88;font-size:clamp(2.8rem,9vw,8rem);
}
.headline-bleed .row-1,.headline-bleed .row-2{ display:block; }
.headline-bleed .row-2{ font-style:italic;font-size:clamp(3rem,10vw,9rem);margin-top:-.05em; }
@media (max-width:768px){
  .headline-bleed{ font-size:clamp(2.6rem,11vw,5rem);line-height:.95; }
  .headline-bleed .row-2{ font-size:clamp(2.8rem,12vw,5.5rem); }
}
.scroll-indicator{
  position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);
  z-index:5;display:flex;flex-direction:column;align-items:center;gap:.8rem;
  color:rgba(250,248,245,.6);font-size:.65rem;letter-spacing:.4em;text-transform:uppercase;
}
.scroll-indicator .line{
  width:1px;height:56px;background:linear-gradient(180deg,rgba(212,175,55,.7),transparent);
  position:relative;overflow:hidden;
}
.scroll-indicator .line::after{
  content:'';position:absolute;top:-50%;left:0;width:100%;height:50%;
  background:linear-gradient(180deg,transparent,#D4AF37);
  animation:scroll-drop 2.4s cubic-bezier(.6,0,.4,1) infinite;
}
@keyframes scroll-drop{ 0%{top:-50%} 100%{top:110%} }

/* =========================================================
   MARQUEE SYSTEM — single track, content duplicated inline,
   item margin-right used for gap. Animation: translate exactly -50%.
   Because every item has identical margin-right, 50% = 1 full set width.
   Pattern proven across thousands of production sites.
   ========================================================= */
.marquee{
  position:relative;
  overflow:hidden;
  width:100%;
  max-width:100vw;
}
.marquee-track{
  display:flex;
  align-items:center;
  width:max-content;
  animation:marquee-scroll var(--marquee-duration,60s) linear infinite;
  will-change:transform;
}
.marquee-track > *{
  flex-shrink:0;
  white-space:nowrap;
  margin-right:var(--marquee-gap,4rem);
}
@keyframes marquee-scroll{
  0%   { transform:translate3d(0,0,0); }
  100% { transform:translate3d(-50%,0,0); }
}
@media (prefers-reduced-motion:reduce){
  .marquee-track{ animation:none; }
}

/* --- Stats marquee (sormei / dark navy) — FAST, NARROW. Studio-wide numbers --- */
.marquee.stats{
  background:#0B1220;
  border-top:1px solid rgba(212,175,55,.10);
  border-bottom:1px solid rgba(212,175,55,.10);
  --marquee-duration:48s;   /* faster */
  --marquee-gap:3.5rem;
  padding:.85rem 0;          /* narrower */
}
.marquee.stats::before{ left:0;background:linear-gradient(90deg,#0B1220,rgba(11,18,32,0)); }
.marquee.stats::after{ right:0;background:linear-gradient(270deg,#0B1220,rgba(11,18,32,0)); }
.stat-pill{
  display:inline-flex; align-items:baseline; gap:.6rem;
  font-family:'Poppins',sans-serif; font-size:.78rem;
  flex-shrink:0; white-space:nowrap;
}
.stat-pill .stat-tag{
  font-size:.6rem; letter-spacing:.22em; text-transform:uppercase;
  color:#0B7B63; font-weight:500;
}
.stat-pill .stat-val{
  font-family:'Playfair Display',serif; font-style:italic;
  font-size:1.1rem; color:#D4AF37; font-weight:500;
}
.stat-pill .stat-unit{
  font-size:.7rem; color:rgba(250,248,245,.55); letter-spacing:.05em;
}
.stat-diamond{
  display:inline-block; width:5px; height:5px; border-radius:1px;
  background:#D4AF37; opacity:.55; transform:rotate(45deg);
  flex-shrink:0;
}

/* --- Main ticker (sabz / deep teal) — SERVICES keywords --- */
.marquee.ticker{
  background:#082720;
  color:#D4AF37;
  border-top:1px solid rgba(212,175,55,.18);
  border-bottom:1px solid rgba(212,175,55,.18);
  box-shadow:inset 0 1px 0 rgba(212,175,55,.06), inset 0 -1px 0 rgba(212,175,55,.06);
  --marquee-duration:80s;
  --marquee-gap:4rem;
  padding:1.4rem 0;
}
/* --- Emerald marquee (sabz zomorodi) — SLOW, TALL. Pairs UNDER .marquee.stats --- */
.marquee.emerald{
  background:linear-gradient(180deg, var(--emerald) 0%, var(--emerald-d) 100%);
  border-top:1px solid rgba(212,175,55,.12);
  border-bottom:1px solid rgba(212,175,55,.18);
  box-shadow:inset 0 1px 0 rgba(212,175,55,.05);
  --marquee-duration:140s;   /* much slower */
  --marquee-gap:5.5rem;
  padding:1.55rem 0;          /* taller / wider band */
}
.marquee.emerald::before{ left:0; background:linear-gradient(90deg, var(--emerald), rgba(4,105,90,0)); }
.marquee.emerald::after{ right:0; background:linear-gradient(270deg, var(--emerald-d), rgba(3,77,67,0)); }
.marquee.emerald .stat-pill .stat-val{
  font-family:'Playfair Display',serif; font-style:italic;
  font-size:1.15rem; color:#F4E7BF;
}
.marquee.emerald .stat-pill .stat-unit{
  font-size:.72rem; color:rgba(244,231,191,.65); letter-spacing:.06em;
}
.marquee.emerald .stat-pill{ font-size:.82rem; }
/* Stacked-marquee wrapper for the two-bar pattern */
.marquee-stack{ display:flex; flex-direction:column; }
.marquee-stack > .marquee + .marquee{ border-top:0; }

.marquee.ticker::before{ left:0;background:linear-gradient(90deg,#082720,rgba(8,39,32,0)); }
.marquee.ticker::after{ right:0;background:linear-gradient(270deg,#082720,rgba(8,39,32,0)); }
.ticker-item{
  font-family:'Playfair Display',serif; font-style:italic;
  font-size:clamp(1.2rem,1.8vw,1.7rem); letter-spacing:-.01em;
  flex-shrink:0; white-space:nowrap;
}
.ticker-ornament{
  width:.9em; height:.9em; flex-shrink:0; opacity:.5;
}

@media (max-width:768px){
  .marquee.stats{ --marquee-gap:1.6rem; padding:.75rem 0; }
  .stat-pill .stat-tag{ display:none; }
  .stat-pill .stat-val{ font-size:1rem; }
  .stat-pill .stat-unit{ font-size:.65rem; }
  .marquee.ticker{ --marquee-gap:2.5rem; padding:1.1rem 0; }
  .ticker-item{ font-size:1.05rem; }
}

/* --- Royal Road --- */
.royal-road-svg{ width:100%;height:auto;display:block; }
.royal-road-svg .road-base{
  fill:none;stroke:rgba(212,175,55,.15);stroke-width:2.5;stroke-dasharray:8 6;
}
.royal-road-svg .road-line{
  fill:none;stroke:#D4AF37;stroke-width:2.4;stroke-linecap:round;
  stroke-dasharray:2200;stroke-dashoffset:2200;
  transition:stroke-dashoffset 100ms linear;
  filter:drop-shadow(0 0 10px rgba(212,175,55,.35));
}
.royal-road-svg .station{ opacity:.35;transition:opacity 700ms var(--ease-luxe); }
.royal-road-svg .station.lit{ opacity:1; }
.royal-road-svg .station-dot{ fill:#D4AF37; }
.royal-road-svg .station.lit .station-dot{ filter:drop-shadow(0 0 8px rgba(212,175,55,.85)); }
.royal-road-rider{ pointer-events:none;filter:drop-shadow(0 6px 18px rgba(212,175,55,.55)); }

/* --- Practice rows --- */
.practice-row{ position:relative;padding:clamp(4rem,8vw,8rem) 0;border-top:1px solid rgba(212,175,55,.12); }
.practice-row .num{
  font-family:'Playfair Display',serif;font-size:clamp(2.5rem,4vw,4.5rem);line-height:1;
  color:transparent;-webkit-text-stroke:1px rgba(212,175,55,.55);letter-spacing:-.04em;
  overflow:visible; white-space:nowrap;
}
.practice-row:hover .num{ -webkit-text-stroke-color:rgba(212,175,55,.9); }

/* --- Bleed numeral --- */
.bleed-numeral{
  font-family:'Playfair Display',serif;font-style:italic;font-weight:400;
  font-size:clamp(8rem,22vw,22rem);line-height:.85;
  background:linear-gradient(180deg,rgba(212,175,55,.18) 0%,rgba(212,175,55,0) 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  user-select:none;pointer-events:none;
}
.section-cream .bleed-numeral{
  background:linear-gradient(180deg,rgba(15,63,53,.18) 0%,rgba(15,63,53,0) 100%);
  -webkit-background-clip:text;background-clip:text;
}

/* --- Pull quote --- */
.pull-quote{
  font-family:'Playfair Display',serif;font-style:italic;font-weight:400;
  font-size:clamp(2rem,5vw,4rem);line-height:1.1;letter-spacing:-.015em;
}
.pull-quote::before{
  content:'\201C';font-size:1.2em;line-height:.6;color:var(--gold);
  display:inline-block;margin-right:.18em;vertical-align:-.2em;
}

/* --- Snap rail --- */
.h-snap-rail{
  display:flex;gap:clamp(1.5rem,3vw,3rem);overflow-x:auto;
  scroll-snap-type:x mandatory;scroll-padding:0 max(1.25rem,5vw);
  padding:0 max(1.25rem,5vw) 1.5rem;scrollbar-width:none;cursor:grab;
}
.h-snap-rail::-webkit-scrollbar{ display:none; }
.h-snap-rail:active{ cursor:grabbing; }
.h-snap-item{ flex:0 0 min(80vw,540px);scroll-snap-align:start;position:relative; }

/* --- Depth frame ornament --- */
.depth-frame{ position:relative; }
.depth-frame::before,.depth-frame::after{
  content:'';position:absolute;width:24px;height:24px;
  border:1px solid rgba(212,175,55,.55);pointer-events:none;
}
.depth-frame::before{ top:-6px;left:-6px;border-right:0;border-bottom:0; }
.depth-frame::after{ bottom:-6px;right:-6px;border-left:0;border-top:0; }

/* --- Stat number --- */
.stat-num{
  font-family:'Playfair Display',serif;font-size:clamp(2.5rem,4vw,4rem);
  line-height:1;color:var(--gold);letter-spacing:-.02em;
}

/* --- Reveal --- */
.reveal{ opacity:0;transform:translateY(28px);transition:opacity 1100ms var(--ease-luxe),transform 1100ms var(--ease-luxe); }
.reveal.in{ opacity:1;transform:translateY(0); }
.reveal-delay-1{ transition-delay:120ms; }
.reveal-delay-2{ transition-delay:240ms; }
.reveal-delay-3{ transition-delay:360ms; }

/* --- Cinematic reel video section --- */
.reel-stage{ position:relative;height:clamp(70vh,90vh,920px);overflow:hidden;background:#050505; }
.reel-stage video{ position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.05) contrast(1.05); }
.reel-stage::after{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(120% 70% at 50% 50%,transparent 30%,rgba(0,0,0,.85) 100%),
    linear-gradient(180deg,rgba(5,5,5,.45) 0%,transparent 30%,transparent 70%,rgba(5,5,5,.85) 100%);
}
.reel-stage .reel-copy{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;z-index:2;padding:0 1.5rem;
}

/* --- Process step --- */
.step-row{
  display:grid;grid-template-columns:auto 1fr;gap:1.8rem;
  padding:2rem 0;border-bottom:1px solid rgba(212,175,55,.12);
  transition:border-color 600ms var(--ease-luxe);
}
.step-row:hover{ border-bottom-color:rgba(212,175,55,.35); }
.step-row .step-num{
  font-family:'Playfair Display',serif;font-style:italic;font-size:clamp(2rem,3vw,3rem);
  color:var(--gold);line-height:1;min-width:4ch;
}

/* --- Pricing tier card --- */
.tier-card{
  position:relative;padding:2.5rem 2rem;border:1px solid rgba(212,175,55,.18);
  background:linear-gradient(180deg,rgba(15,63,53,.35),rgba(10,46,39,.45));border-radius:4px;
  transition:transform 700ms var(--ease-luxe),border-color 700ms var(--ease-luxe);
  display:flex;flex-direction:column;
}
.tier-card:hover{ transform:translateY(-6px);border-color:rgba(212,175,55,.45); }
.tier-card.featured{ border-color:rgba(212,175,55,.65);background:linear-gradient(180deg,rgba(15,63,53,.55),rgba(10,46,39,.65)); }
.tier-card.featured::before{
  content:'Most engaged';position:absolute;top:-12px;left:50%;transform:translateX(-50%);
  font-family:'Poppins',sans-serif;font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;
  color:var(--ink-900);background:var(--gold);padding:.3rem .9rem;border-radius:999px;white-space:nowrap;
}
.tier-card .tier-name{ font-family:'Playfair Display',serif;font-size:1.6rem;font-style:italic;color:var(--cream); }
.tier-card .tier-from{ font-family:'Poppins',sans-serif;font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-top:1rem; }
.tier-card .tier-price{ font-family:'Playfair Display',serif;font-size:2.6rem;color:var(--cream);margin-top:.5rem;line-height:1; }
.tier-card .tier-unit{ font-family:'Poppins',sans-serif;font-size:.75rem;color:rgba(250,248,245,.55);margin-left:.4rem; }
.tier-card ul{ margin-top:1.8rem;display:flex;flex-direction:column;gap:.85rem;flex:1; }
.tier-card ul li{ display:flex;gap:.7rem;font-size:.92rem;color:rgba(250,248,245,.85);line-height:1.45; }
.tier-card ul li::before{ content:'';display:inline-block;width:6px;height:6px;border-radius:999px;background:var(--gold);margin-top:.55rem;flex-shrink:0; }

/* --- Testimonial quote card --- */
.quote-card{
  background:rgba(15,63,53,.30);border:1px solid rgba(212,175,55,.15);
  padding:2.2rem;border-radius:4px;position:relative;backdrop-filter:blur(8px);
}
.quote-card::before{
  content:'\201C';font-family:'Playfair Display',serif;font-size:5rem;line-height:.6;
  color:var(--gold);position:absolute;top:1rem;left:1.4rem;opacity:.35;pointer-events:none;
}
.quote-card .body{ font-family:'Playfair Display',serif;font-style:italic;font-size:1.15rem;line-height:1.5;color:var(--cream);position:relative;z-index:1; }
.quote-card .who{ display:flex;align-items:center;gap:1rem;margin-top:1.6rem; }
.quote-card .who .avatar{
  width:44px;height:44px;border-radius:999px;
  background:linear-gradient(135deg,var(--teal-br),var(--teal));
  border:1px solid rgba(212,175,55,.45);display:grid;place-items:center;
  font-family:'Playfair Display',serif;font-style:italic;color:var(--gold);font-size:1.2rem;
}
.quote-card .who .name{ font-size:.95rem;color:var(--cream); }
.quote-card .who .role{ font-size:.78rem;color:rgba(250,248,245,.6); }

/* --- Contact form: teal background card with gold accents --- */
.contact-form{
  position:relative;
  background:linear-gradient(160deg, #0A2E27 0%, #0F3F35 55%, #082720 100%);
  border:1px solid rgba(212,175,55,.25);
  box-shadow:
    0 40px 90px -30px rgba(15,63,53,.45),
    inset 0 1px 0 rgba(212,175,55,.08);
}
.contact-form::before,
.contact-form::after{
  content:'';position:absolute;width:30px;height:30px;
  border:1px solid rgba(212,175,55,.7);
  pointer-events:none;
}
.contact-form::before{ top:-1px;left:-1px;border-right:0;border-bottom:0; }
.contact-form::after{ bottom:-1px;right:-1px;border-left:0;border-top:0; }
.contact-form .amc-label{ color:var(--gold); }
.contact-form .amc-input,
.contact-form .amc-select,
.contact-form .amc-textarea{
  background:#ffffff;
  border:1px solid rgba(212,175,55,.30);
  color:#0F3F35;
}
.contact-form .amc-input::placeholder,
.contact-form .amc-textarea::placeholder{ color:rgba(15,63,53,.45); }
.contact-form .amc-select{ color:#0F3F35; }
.contact-form .amc-input:focus,
.contact-form .amc-select:focus,
.contact-form .amc-textarea:focus{
  border-color:var(--gold);
  background:#ffffff;
  box-shadow:0 0 0 3px rgba(212,175,55,.20);
}
.contact-form .chip{
  border-color:rgba(212,175,55,.35);
  color:rgba(250,248,245,.85);
  background:transparent;
}
.contact-form .chip:hover{ border-color:var(--gold);color:var(--gold); }
.contact-form .chip.is-on{
  background:var(--gold);color:var(--teal);border-color:var(--gold);
}
.contact-form .text-ink-50\/45,
.contact-form p{ color:rgba(250,248,245,.55); }

/* --- Standard input styles (for Insight Letter newsletter etc.) --- */
.amc-input,.amc-select,.amc-textarea{
  width:100%;padding:1rem 1.1rem;background:rgba(5,5,5,.45);
  border:1px solid rgba(212,175,55,.22);border-radius:4px;color:var(--cream);
  font-family:'Poppins',sans-serif;font-size:.95rem;font-weight:300;
  transition:border-color 500ms var(--ease-luxe),background 500ms var(--ease-luxe);
}
.amc-input::placeholder,.amc-textarea::placeholder{ color:rgba(250,248,245,.4); }
.amc-input:focus,.amc-select:focus,.amc-textarea:focus{
  outline:none;border-color:var(--gold);background:rgba(5,5,5,.65);
}
.amc-label{
  font-family:'Poppins',sans-serif;font-size:.7rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--gold);margin-bottom:.5rem;display:block;
}
.chip-group{ display:flex;flex-wrap:wrap;gap:.55rem; }
.chip{
  display:inline-flex;align-items:center;gap:.4rem;padding:.55rem 1rem;
  border:1px solid rgba(212,175,55,.3);border-radius:999px;
  font-size:.78rem;color:rgba(250,248,245,.85);cursor:pointer;
  transition:all 400ms var(--ease-luxe);user-select:none;background:transparent;
}
.chip:hover{ border-color:var(--gold);color:var(--gold); }
.chip input{ position:absolute;opacity:0;pointer-events:none; }
.chip.is-on{ background:var(--gold);color:var(--ink-900);border-color:var(--gold); }

/* --- Floating Action Buttons (fab-stack) — Van Galaxy-style pulse + idle fade --- */
.fab-stack{
  position:fixed;
  right:1.1rem;
  bottom:calc(env(safe-area-inset-bottom,0) + 1.4rem);
  z-index:60;
  display:none;
  flex-direction:column;
  gap:.85rem;
  align-items:flex-end;
  animation:fab-rise .8s 1s both ease-out;
  transition:opacity 1.2s ease;
}
@media (max-width:768px){
  .fab-stack{ display:flex; }
  footer.site-footer{ padding-bottom:5.5rem; }
}
@media (min-width:768px){
  /* On desktop too: just the chat circle, calmer, no call */
  .fab-stack{ display:flex; right:1.6rem; bottom:1.8rem; gap:.85rem; }
  .fab-stack .fab-call{ display:none; }
}
.fab-stack.fab-idle{ opacity:.10; }
.fab-stack.fab-idle:hover,
.fab-stack.fab-idle:focus-within{ opacity:1; }
.fab-stack.fab-idle .fab-btn{ animation-play-state:paused; }

@keyframes fab-rise{
  from{ opacity:0; transform:translateY(20px) scale(.85); }
  to  { opacity:1; transform:translateY(0) scale(1); }
}
@keyframes fab-pulse-gold{
  0%   { box-shadow:0 0 0 0 rgba(212,175,55,.6), 0 10px 22px -6px rgba(0,0,0,.5); }
  70%  { box-shadow:0 0 0 18px rgba(212,175,55,0), 0 10px 22px -6px rgba(0,0,0,.5); }
  100% { box-shadow:0 0 0 0 rgba(212,175,55,0), 0 10px 22px -6px rgba(0,0,0,.5); }
}
@keyframes fab-pulse-teal{
  0%   { box-shadow:0 0 0 0 rgba(0,109,91,.65), 0 10px 22px -6px rgba(0,0,0,.5); }
  70%  { box-shadow:0 0 0 18px rgba(0,109,91,0), 0 10px 22px -6px rgba(0,0,0,.5); }
  100% { box-shadow:0 0 0 0 rgba(0,109,91,0), 0 10px 22px -6px rgba(0,0,0,.5); }
}
.fab-btn{
  position:relative;display:flex;align-items:center;justify-content:center;
  width:54px;height:54px;border-radius:9999px;
  color:#fff;text-decoration:none;
  transition:transform .25s cubic-bezier(.34,1.56,.64,1);
  -webkit-tap-highlight-color:transparent;
}
.fab-btn:hover{ transform:scale(1.08) translateY(-2px); }
.fab-btn:active{ transform:scale(.96); }
.fab-btn svg{ width:22px;height:22px; }
/* Reversed dyo — gold bg + teal icon, teal bg + gold icon */
.fab-call{
  background:linear-gradient(135deg,#E2C265 0%,#C09A2A 100%);
  color:#006D5B; /* teal icon on gold */
  animation:fab-pulse-gold 2.4s infinite;
}
.fab-chat{
  background:linear-gradient(135deg,#0B7B63 0%,#006D5B 100%);
  color:#D4AF37; /* gold icon on teal */
  animation:fab-pulse-teal 2.4s .4s infinite;
}
.fab-label{
  position:absolute;right:64px;top:50%;
  transform:translateY(-50%) translateX(8px);
  background:rgba(11,18,32,.95);color:#FAF8F5;
  font-family:'Poppins',sans-serif;font-size:11px;font-weight:500;
  letter-spacing:.05em;padding:6px 12px;border-radius:6px;
  white-space:nowrap;opacity:0;pointer-events:none;
  transition:opacity .2s,transform .2s;
  box-shadow:0 4px 12px rgba(0,0,0,.3);
}
.fab-label::after{
  content:'';position:absolute;right:-5px;top:50%;
  transform:translateY(-50%);
  border:5px solid transparent;
  border-left-color:rgba(11,18,32,.95);
}
@media (hover:hover){
  .fab-btn:hover .fab-label{ opacity:1; transform:translateY(-50%) translateX(0); }
}
@media (prefers-reduced-motion:reduce){
  .fab-call, .fab-chat, .fab-stack{ animation:none; }
}

/* --- Misc --- */
.no-scrollbar::-webkit-scrollbar{ display:none; }
.no-scrollbar{ scrollbar-width:none; }
::selection{ background:rgba(212,175,55,.35);color:var(--cream); }

/* --- Reduced motion --- */
@media (prefers-reduced-motion:reduce){
  .text-gradient-foil{ animation:none; }
  .hero-particle{ animation:none;opacity:.4; }
  .ticker-track{ animation:none; }
  .scroll-indicator .line::after{ animation:none; }
  html{ scroll-behavior:auto; }
}

/* =========================================================
   MOBILE-SPECIFIC TUNING
   ========================================================= */
@media (max-width:768px){
  /* Tighter sticky nav scroll-padding on mobile */
  html{ scroll-padding-top:64px; }

  /* GLOBAL: ensure every section's content has comfortable side padding.
     This is the safety net so nothing ever touches the phone edge. */
  section, footer{ padding-left:0; padding-right:0; }
  section > div, footer > div,
  section > .max-w-\[1480px\], footer > .max-w-\[1480px\]{
    padding-left:1.25rem !important;
    padding-right:1.25rem !important;
  }

  /* Hero — reclaim vertical space, never overflow */
  .hero-stage{ min-height:auto; }
  .scroll-indicator{ display:none; }
  .persepolis-silhouette{ opacity:.5; }
  .eyebrow-vertical{ display:none; }

  /* Royal Road SVG is built for wide screens; on mobile we show the
     three station cards below (already responsive) instead. */
  .royal-road-svg{ display:none; }
  .royal-road-mobile-rule{ display:flex; }

  /* Practice rows — give the giant numeral breathing room from the heading */
  .practice-row{ padding:2.5rem 0;display:flex !important;flex-direction:column;gap:1.5rem; }
  .practice-row > *{ width:100%; }
  .practice-row .num{
    font-size:3rem; opacity:.7;
    margin-bottom:.5rem;
    display:block;
    text-align:left !important;
  }

  /* Bleed numerals — quieter on small screens */
  .bleed-numeral{ font-size:clamp(5rem,18vw,8rem); opacity:.85; }

  /* Stat band — single column on very small */
  .stat-num{ font-size:2.2rem; }

  /* Pull quote slightly smaller */
  .pull-quote{ font-size:clamp(1.6rem,6vw,2.4rem); }

  /* Cinematic reel — shorter on mobile to keep flow */
  .reel-stage{ height:60vh; min-height:420px; }

  /* Contact form — tighter padding */
  .contact-form{ padding:1.5rem !important; }
}

@media (max-width:480px){
  /* Very small phones: prevent any chance of headline overflow */
  .headline-bleed{ font-size:clamp(2.1rem,9.5vw,3.4rem); line-height:1; }
  .headline-bleed .row-2{ font-size:clamp(2.2rem,10vw,3.6rem); }
  .tier-card{ padding:2rem 1.5rem; }
  .tier-card .tier-price{ font-size:2.2rem; }
  .display-2xl{ font-size:clamp(2.6rem,9vw,4rem); }
  .display-xl{ font-size:clamp(2.2rem,8vw,3.4rem); }
  .display-lg{ font-size:clamp(1.9rem,7vw,2.8rem); }
  /* Tier "Most engaged" pill — keep above the card edge */
  .tier-card.featured::before{ font-size:.55rem; padding:.25rem .7rem; }
}

/* Hidden by default — only shown on mobile to replace the road SVG */
.royal-road-mobile-rule{
  display:none;
  align-items:center;
  justify-content:center;
  gap:1rem;
  padding:2rem 0 0;
  color:var(--gold);
  font-family:'Playfair Display',serif;
  font-style:italic;
}
.royal-road-mobile-rule .dot{
  width:6px;height:6px;border-radius:999px;background:var(--gold);
  box-shadow:0 0 0 4px rgba(212,175,55,.12);
}
.royal-road-mobile-rule .line{
  flex:1;height:1px;max-width:80px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}

/* =========================================================
   .section-ink — DARK PUNCTUATION SECTION (used 1-2x per page max)
   Cream is default; .section-ink is the contrast inversion used
   for high-impact moments (proof, manifesto, hero punch).
   ========================================================= */
.section-ink{
  background:var(--ink-700);
  color:var(--cream);
  position:relative;
}
.section-ink.alt{ background:var(--ink-800); }
.section-ink.grad{
  background:
    radial-gradient(60% 50% at 18% 0%,rgba(0,109,91,.22) 0%,transparent 60%),
    radial-gradient(50% 60% at 95% 30%,rgba(212,175,55,.14) 0%,transparent 60%),
    radial-gradient(80% 70% at 50% 110%,rgba(11,123,99,.18) 0%,transparent 70%),
    var(--ink-700);
}
.section-ink .eyebrow{ color:var(--gold); }
.section-ink .eyebrow::before{ background:var(--gold); }
.section-ink .display-2xl,
.section-ink .display-xl,
.section-ink .display-lg,
.section-ink .display-md,
.section-ink .display-sm{ color:var(--cream); }
.section-ink p{ color:rgba(250,248,245,.78); }
.section-ink a{ color:var(--gold); }
.section-ink .text-gradient-foil{
  background:linear-gradient(100deg,#B8954D 0%,#D4AF37 18%,#F4E7BF 28%,#FFF7D9 33%,#F4E7BF 38%,#D4AF37 48%,#B8954D 70%,#D4AF37 100%);
  background-size:220% 100%; background-position:0% 50%;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  animation:foil-shimmer 6s linear infinite;
}

/* =========================================================
   .section-cream.typo — cream section with BG TYPOGRAPHY
   Pass the giant word as data-bgword="GOOGLE ADS"; positioned
   subtly behind content as editorial-luxe decoration.
   ========================================================= */
.section-cream.typo::before{
  content:attr(data-bgword);
  position:absolute;
  bottom:-5%;
  right:-3%;
  font-family:'Playfair Display',Georgia,serif;
  font-style:italic;
  font-weight:400;
  font-size:clamp(8rem, 22vw, 22rem);
  line-height:.85;
  color:rgba(0,109,91,.06);
  letter-spacing:-.04em;
  pointer-events:none;
  white-space:nowrap;
  z-index:0;
  user-select:none;
}
.section-cream.typo.left::before{
  right:auto; left:-3%; bottom:auto; top:-5%;
}
.section-cream.typo > *{ position:relative; z-index:1; }

/* =========================================================
   .section-cream.graphic — cream section with background SVG art
   Pass class .compass / .grid / .relief to pick the pattern.
   ========================================================= */
.section-cream.graphic{ position:relative; overflow:hidden; }
.section-cream.graphic::before{
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
  opacity:.05;
}
.section-cream.graphic.compass::before{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='320' height='320' viewBox='0 0 320 320'><circle cx='160' cy='160' r='110' fill='none' stroke='%23006D5B' stroke-width='.7'/><circle cx='160' cy='160' r='70' fill='none' stroke='%23006D5B' stroke-width='.6'/><circle cx='160' cy='160' r='30' fill='none' stroke='%23006D5B' stroke-width='.5'/><path d='M50 160 L270 160 M160 50 L160 270 M85 85 L235 235 M235 85 L85 235' stroke='%23006D5B' stroke-width='.4'/></svg>");
  background-size:380px;
  background-position:center;
}
.section-cream.graphic.grid::before{
  background-image:linear-gradient(0deg,rgba(0,109,91,.4) 1px,transparent 1px),linear-gradient(90deg,rgba(0,109,91,.4) 1px,transparent 1px);
  background-size:48px 48px;
  opacity:.07;
}
.section-cream.graphic.relief::before{
  background-image:url("../bg-relief.webp");
  background-size:cover; background-position:center;
  opacity:.08;
  filter:sepia(.3);
}
.section-cream.graphic > *{ position:relative; z-index:1; }

/* =========================================================
   .btn-primary — true royal-gold, slightly richer foil on cream
   ========================================================= */
.btn-primary.foil{
  background:linear-gradient(135deg,#E2C265 0%,#D4AF37 35%,#F4E7BF 50%,#D4AF37 65%,#B8954D 100%);
  background-size:200% 100%;
  background-position:0% 50%;
  transition:background-position 700ms var(--ease-luxe), transform 400ms var(--ease-luxe), box-shadow 400ms var(--ease-luxe);
}
.btn-primary.foil:hover{ background-position:100% 50%; }


/* =========================================================
   .section-teal — DARK FOREST PUNCTUATION (brand teal variant)
   Sibling of .section-ink. Use ONE of either per page max.
   ========================================================= */
.section-teal{
  background:var(--forest);
  color:var(--cream);
  position:relative;
}
.section-teal.alt{ background:var(--forest-d); }
.section-teal.grad{
  background:
    radial-gradient(60% 50% at 18% 0%,rgba(212,175,55,.15) 0%,transparent 60%),
    radial-gradient(55% 65% at 95% 30%,rgba(11,123,99,.45) 0%,transparent 60%),
    radial-gradient(80% 70% at 50% 110%,rgba(0,109,91,.35) 0%,transparent 70%),
    var(--forest);
}
.section-teal .eyebrow{ color:var(--gold); }
.section-teal .eyebrow::before{ background:var(--gold); }
.section-teal .display-2xl,
.section-teal .display-xl,
.section-teal .display-lg,
.section-teal .display-md,
.section-teal .display-sm{ color:var(--cream); }
.section-teal p{ color:rgba(250,248,245,.82); }
.section-teal a{ color:var(--gold); }
.section-teal .text-gradient-foil{
  background:linear-gradient(100deg,#B8954D 0%,#D4AF37 18%,#F4E7BF 28%,#FFF7D9 33%,#F4E7BF 38%,#D4AF37 48%,#B8954D 70%,#D4AF37 100%);
  background-size:220% 100%; background-position:0% 50%;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  animation:foil-shimmer 6s linear infinite;
}