:root {
  --font-main: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans Devanagari", "Nirmala UI", Arial, sans-serif;
  --radius-xl: 34px;
  --radius-lg: 24px;
  --radius-md: 18px;
  --header-height: 78px;
  --max-width: 1160px;
  --ease: cubic-bezier(.2,.8,.2,1);
}

html[data-theme="saffron"] {
  --bg: #fff5e8;
  --bg-2: #ffe6c2;
  --surface: rgba(255, 255, 255, .72);
  --surface-strong: rgba(255, 250, 240, .92);
  --text: #321604;
  --muted: #754b2a;
  --soft: #8b6a4a;
  --border: rgba(184, 93, 0, .22);
  --primary: #e86f00;
  --primary-2: #ff9f1c;
  --accent: #9a3412;
  --green: #2f7d32;
  --shadow: 0 24px 70px rgba(166, 87, 15, .18);
  --shadow-strong: 0 34px 100px rgba(180, 83, 9, .28);
}

html[data-theme="sandal"] {
  --bg: #fbf1db;
  --bg-2: #ead7b7;
  --surface: rgba(255, 252, 242, .74);
  --surface-strong: rgba(255, 252, 242, .94);
  --text: #2a1707;
  --muted: #6d5438;
  --soft: #7c684f;
  --border: rgba(132, 82, 28, .25);
  --primary: #b45309;
  --primary-2: #d99a2b;
  --accent: #7c2d12;
  --green: #5c7c2f;
  --shadow: 0 24px 70px rgba(111, 78, 34, .18);
  --shadow-strong: 0 34px 100px rgba(120, 76, 24, .27);
}

html[data-theme="night"] {
  --bg: #160b07;
  --bg-2: #2a140b;
  --surface: rgba(45, 23, 13, .66);
  --surface-strong: rgba(34, 17, 10, .94);
  --text: #fff3df;
  --muted: #d6b88f;
  --soft: #b9936d;
  --border: rgba(255, 168, 60, .26);
  --primary: #ff8a00;
  --primary-2: #ffd166;
  --accent: #f97316;
  --green: #83c678;
  --shadow: 0 24px 70px rgba(0, 0, 0, .32);
  --shadow-strong: 0 34px 120px rgba(255, 132, 0, .16);
}

html[data-theme="lotus"] {
  --bg: #fff1f2;
  --bg-2: #ffe4e6;
  --surface: rgba(255, 255, 255, .74);
  --surface-strong: rgba(255, 250, 252, .94);
  --text: #3b0716;
  --muted: #7f3850;
  --soft: #8a5f70;
  --border: rgba(190, 18, 60, .18);
  --primary: #e11d48;
  --primary-2: #fb923c;
  --accent: #9f1239;
  --green: #2f7d32;
  --shadow: 0 24px 70px rgba(190, 18, 60, .14);
  --shadow-strong: 0 34px 100px rgba(190, 18, 60, .22);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--font-main);
  color: var(--text);
  background: radial-gradient(circle at top left, var(--bg-2), var(--bg) 42%, var(--bg) 100%);
  overflow-x: hidden;
}
body::selection { background: var(--primary); color: #fff; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
img { max-width: 100%; display: block; }
.container { width: min(100% - 32px, var(--max-width)); margin: 0 auto; }
.section { padding: clamp(54px, 8vw, 92px) 0; }

.skip-link {
  position: fixed; left: 16px; top: -80px; z-index: 1000;
  padding: .75rem 1rem; border-radius: 999px; background: var(--surface-strong); color: var(--text); border: 1px solid var(--border);
}
.skip-link:focus { top: 16px; }
.site-bg { position: fixed; inset: 0; z-index: -2; pointer-events: none; overflow: hidden; }
.vedic-grid {
  position: absolute; inset: 0;
  background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px), radial-gradient(circle at 50% 10%, rgba(255,255,255,.35), transparent 36%);
  background-size: 52px 52px, 52px 52px, 100% 100%;
  mask-image: linear-gradient(to bottom, #000, transparent 85%);
  opacity: .4;
}
.sun-disc {
  position: absolute; width: 44vw; aspect-ratio: 1; border-radius: 50%;
  right: -16vw; top: -18vw;
  background: repeating-conic-gradient(from 0deg, rgba(255, 142, 0, .11) 0 7deg, transparent 7deg 14deg), radial-gradient(circle, rgba(255, 169, 32, .26), transparent 64%);
  animation: slowSpin 48s linear infinite;
}
.soft-glow { position: absolute; width: 520px; aspect-ratio: 1; border-radius: 999px; filter: blur(60px); opacity: .35; }
.glow-a { left: -180px; top: 12vh; background: var(--primary-2); }
.glow-b { right: -170px; bottom: 8vh; background: var(--primary); }
.paper-grain { position: absolute; inset: 0; opacity: .08; background-image: radial-gradient(circle at 20% 20%, #000 0 1px, transparent 1px); background-size: 18px 18px; }

.site-header {
  position: sticky; top: 0; z-index: 99; height: var(--header-height);
  display: flex; align-items: center;
  background: color-mix(in srgb, var(--surface-strong), transparent 10%);
  border-bottom: 1px solid var(--border);
  backdrop-filter: blur(18px);
}
.nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; height: 100%; }
.brand { display: inline-flex; align-items: center; min-width: 178px; }
.nav-links { display: flex; align-items: center; gap: .35rem; }
.nav-links a { padding: .72rem .9rem; border-radius: 999px; color: var(--muted); font-weight: 850; font-size: .95rem; }
.nav-links a:hover, .nav-links a.active { color: var(--text); background: rgba(255,255,255,.28); }
.nav-links .nav-cta { color: #fff; background: linear-gradient(135deg, var(--primary), var(--accent)); box-shadow: 0 14px 34px rgba(232, 111, 0, .22); }
.nav-actions { display: flex; align-items: center; gap: .5rem; order: 2; }
.nav-links { order: 3; }
.icon-btn, .nav-toggle {
  min-width: 42px; height: 42px; display: inline-grid; place-items: center;
  border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: var(--text); cursor: pointer;
  box-shadow: 0 10px 28px rgba(0,0,0,.06);
}
.icon-btn { padding: 0 .8rem; font-weight: 900; }
.nav-toggle { display: none; gap: 4px; }
.nav-toggle span { width: 17px; height: 2px; border-radius: 9px; background: var(--text); display: block; }

.hero { padding: clamp(40px, 7vw, 78px) 0 30px; min-height: calc(100svh - var(--header-height)); display: grid; align-items: center; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, .85fr); gap: clamp(2rem, 6vw, 5rem); align-items: center; }
.eyebrow { margin: 0 0 1rem; display: inline-flex; align-items: center; gap: .6rem; color: var(--accent); font-weight: 1000; letter-spacing: .02em; }
.eyebrow span { width: 42px; height: 2px; border-radius: 99px; background: linear-gradient(90deg, var(--primary), var(--primary-2)); box-shadow: 0 0 18px var(--primary); }
.eyebrow em { font-style: normal; }
.hero h1, h2 { margin: 0; letter-spacing: -.055em; line-height: .98; }
.hero h1 { max-width: 820px; font-size: clamp(3.15rem, 8.3vw, 6.75rem); }
h2 { font-size: clamp(2.05rem, 4.4vw, 4.35rem); }
.hero-subtitle, .section-head p, .finder p, .contact-card p { color: var(--muted); font-size: clamp(1rem, 1.7vw, 1.2rem); line-height: 1.75; max-width: 720px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .9rem; margin: 1.55rem 0 1rem; }
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 48px; padding: .9rem 1.1rem; border-radius: 999px; border: 1px solid var(--border);
  font-weight: 1000; cursor: pointer; transition: transform .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease);
}
.btn:hover { transform: translateY(-2px); }
.btn-primary { color: #fff; background: linear-gradient(135deg, var(--primary), var(--accent)); box-shadow: 0 18px 38px rgba(232, 111, 0, .23); }
.btn-secondary, .btn-card { color: var(--text); background: var(--surface); box-shadow: 0 12px 32px rgba(0,0,0,.06); }
.quick-proof { display: flex; flex-wrap: wrap; gap: .65rem; }
.quick-proof span, .strip-grid span {
  padding: .55rem .8rem; border-radius: 999px; background: var(--surface); color: var(--muted); border: 1px solid var(--border); font-weight: 850;
}

.hero-scene { position: relative; min-height: 520px; perspective: 1100px; transform-style: preserve-3d; display: grid; place-items: center; }
.mandala-3d { position: absolute; width: min(86vw, 430px); aspect-ratio: 1; transform: rotateX(64deg) rotateZ(-18deg); transform-style: preserve-3d; }
.mandala-3d span { position: absolute; inset: 0; border-radius: 50%; border: 2px solid color-mix(in srgb, var(--primary), transparent 50%); box-shadow: 0 0 38px color-mix(in srgb, var(--primary), transparent 74%); animation: slowSpin 24s linear infinite; }
.mandala-3d span:nth-child(2) { inset: 11%; border-style: dashed; animation-duration: 32s; animation-direction: reverse; }
.mandala-3d span:nth-child(3) { inset: 22%; border-color: color-mix(in srgb, var(--green), transparent 46%); animation-duration: 20s; }
.mandala-3d span:nth-child(4) { inset: 34%; background: radial-gradient(circle, color-mix(in srgb, var(--primary-2), transparent 30%), transparent 70%); border: 0; filter: blur(6px); }
.vedic-stack { position: relative; width: min(100%, 440px); height: 360px; transform-style: preserve-3d; transform: rotateX(58deg) rotateZ(-36deg); transition: transform .22s var(--ease); }
.layer-card {
  position: absolute; left: 50%; top: 50%; width: 250px; min-height: 112px; padding: 1rem;
  border-radius: 24px; border: 1px solid var(--border); background: linear-gradient(135deg, var(--surface-strong), color-mix(in srgb, var(--surface), transparent 6%));
  box-shadow: var(--shadow-strong); transform-style: preserve-3d; display: grid; align-content: center; gap: .35rem;
}
.layer-card small { color: var(--muted); font-weight: 900; }
.layer-card strong { font-size: 1.2rem; color: var(--text); }
.layer-one { transform: translate3d(-70%, -70%, 72px); }
.layer-two { transform: translate3d(-25%, -45%, 118px); }
.layer-three { transform: translate3d(-56%, -10%, 164px); }
.layer-four { transform: translate3d(-10%, 16%, 210px); }
.orbit-chip { position: absolute; padding: .62rem .85rem; border-radius: 999px; background: var(--surface-strong); border: 1px solid var(--border); font-weight: 1000; box-shadow: var(--shadow); animation: floatY 4s ease-in-out infinite; }
.chip-a { left: 3%; top: 21%; }
.chip-b { right: 3%; top: 28%; animation-delay: .5s; }
.chip-c { right: 14%; bottom: 12%; animation-delay: 1s; }

.compact-strip { padding: 10px 0 24px; }
.strip-grid { display: flex; gap: .6rem; flex-wrap: wrap; justify-content: center; }
.compact-panel, .service-shell, .process-card, .contact-card {
  border: 1px solid var(--border); border-radius: var(--radius-xl); background: var(--surface); box-shadow: var(--shadow); backdrop-filter: blur(18px);
}
.finder-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 1.2rem; padding: clamp(1rem, 3vw, 2rem); align-items: center; }
.finder h2, .compact-head h2 { max-width: 880px; }
.finder-buttons { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1rem; }
.choice, .service-tab {
  border: 1px solid var(--border); background: var(--surface-strong); color: var(--text); border-radius: 999px; cursor: pointer; font-weight: 1000;
}
.choice { padding: .72rem .95rem; }
.choice.active, .service-tab.active { color: #fff; background: linear-gradient(135deg, var(--primary), var(--accent)); box-shadow: 0 18px 36px rgba(232,111,0,.18); }
.recommendation-card { min-height: 235px; padding: 1.2rem; border-radius: 28px; background: linear-gradient(135deg, var(--surface-strong), color-mix(in srgb, var(--primary-2), transparent 86%)); border: 1px solid var(--border); box-shadow: inset 0 1px 0 rgba(255,255,255,.32); }
.recommendation-card h3 { margin: 0 0 .4rem; font-size: clamp(1.5rem, 3vw, 2.45rem); letter-spacing: -.04em; }
.recommendation-card p { margin: .45rem 0; }
.recommendation-card ul { margin: .9rem 0; padding-left: 1.15rem; color: var(--muted); }

.section-head { margin-bottom: 1.2rem; }
.compact-head { display: grid; gap: .35rem; }
.service-shell { display: grid; grid-template-columns: 260px 1fr; overflow: hidden; }
.service-tabs { display: grid; gap: .5rem; padding: 1rem; background: color-mix(in srgb, var(--primary-2), transparent 87%); border-right: 1px solid var(--border); }
.service-tab { display: flex; align-items: center; gap: .65rem; padding: .85rem; border-radius: 18px; text-align: left; }
.service-tab b { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 12px; background: rgba(255,255,255,.35); }
.service-detail { min-height: 380px; padding: clamp(1rem, 3vw, 2rem); transform-style: preserve-3d; }
.service-detail h3 { margin: 0; font-size: clamp(1.9rem, 4vw, 3.5rem); letter-spacing: -.05em; line-height: 1; }
.service-detail .service-price { display: inline-flex; margin: .8rem 0; padding: .5rem .75rem; border-radius: 999px; color: #fff; background: linear-gradient(135deg, var(--primary), var(--accent)); font-weight: 1000; }
.service-detail p { color: var(--muted); line-height: 1.75; font-size: 1.05rem; max-width: 800px; }
.detail-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin: 1rem 0; }
.detail-grid div { border: 1px solid var(--border); border-radius: 18px; padding: .9rem; background: var(--surface-strong); transform: translateZ(28px); }
.detail-grid b { display: block; color: var(--accent); margin-bottom: .35rem; }

.package-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.package-card, .mini-card, .steps-grid article, .faq-list details {
  border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow); backdrop-filter: blur(16px);
}
.package-card { padding: 1.15rem; transform-style: preserve-3d; transition: transform .2s var(--ease); }
.package-card.featured { background: linear-gradient(135deg, color-mix(in srgb, var(--primary-2), transparent 76%), var(--surface)); border-color: color-mix(in srgb, var(--primary), transparent 45%); }
.package-card p { margin: 0; color: var(--accent); font-weight: 1000; text-transform: uppercase; font-size: .78rem; }
.package-card h3 { margin: .55rem 0 .3rem; font-size: 1.45rem; line-height: 1.1; }
.package-card strong { font-size: 2rem; letter-spacing: -.05em; }
.package-card ul { color: var(--muted); padding-left: 1.15rem; min-height: 92px; }
.package-card .btn { width: 100%; }

.process-card { padding: clamp(1rem, 3vw, 2rem); display: grid; grid-template-columns: .7fr 1.3fr; gap: 1rem; align-items: center; }
.steps-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; }
.steps-grid article { padding: 1rem; }
.steps-grid b, .mini-card span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 14px; color: #fff; background: linear-gradient(135deg, var(--primary), var(--accent)); box-shadow: 0 14px 28px rgba(232,111,0,.22); }
.steps-grid h3, .mini-card h3 { margin: .75rem 0 .35rem; }
.steps-grid p, .mini-card p, .faq-list p, .contact-card p, .footer-grid p, .footer-grid a, .footer-grid span { color: var(--muted); line-height: 1.65; }
.mini-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .9rem; }
.mini-card { padding: 1rem; }

.faq-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: 1.2rem; align-items: start; }
.faq-list { display: grid; gap: .65rem; }
.faq-list details { padding: .95rem 1rem; }
summary { cursor: pointer; font-weight: 1000; color: var(--text); }
summary::marker { color: var(--primary); }

.contact-card { padding: clamp(1rem, 3vw, 2rem); display: grid; grid-template-columns: .8fr 1.2fr; gap: 1rem; align-items: start; }
.lead-form { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.lead-form label { display: grid; gap: .35rem; font-weight: 900; color: var(--text); }
.lead-form label:nth-child(4), .lead-form button, .lead-form .form-note { grid-column: 1 / -1; }
.lead-form input, .lead-form select, .lead-form textarea { width: 100%; border: 1px solid var(--border); border-radius: 16px; padding: .82rem .9rem; color: var(--text); background: var(--surface-strong); outline: none; }
.lead-form input:focus, .lead-form select:focus, .lead-form textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary), transparent 82%); }
.form-note { margin: 0; font-size: .9rem; }

.sticky-whatsapp { position: fixed; right: 18px; bottom: 18px; z-index: 80; color: #fff; background: linear-gradient(135deg, #15803d, var(--green)); border-radius: 999px; padding: .9rem 1rem; font-weight: 1000; box-shadow: 0 18px 45px rgba(21,128,61,.28); }
.site-footer { padding: 44px 0 22px; border-top: 1px solid var(--border); background: color-mix(in srgb, var(--surface), transparent 25%); }
.footer-grid { display: grid; grid-template-columns: 1.2fr .8fr .7fr; gap: 1rem; }
.footer-grid h2 { margin: 0 0 .55rem; }
.footer-bottom { margin-top: 1.4rem; padding-top: 1rem; border-top: 1px solid var(--border); display: flex; justify-content: space-between; gap: 1rem; color: var(--soft); }

@keyframes slowSpin { to { transform: rotate(360deg); } }
@keyframes floatY { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }

@media (max-width: 980px) {
  .nav-toggle { display: inline-grid; }
  .nav-links { position: fixed; inset: var(--header-height) 16px auto 16px; display: grid; padding: .8rem; border-radius: 24px; background: var(--surface-strong); border: 1px solid var(--border); box-shadow: var(--shadow-strong); opacity: 0; transform: translateY(-8px); pointer-events: none; transition: .2s var(--ease); }
  .nav-links.is-open { opacity: 1; transform: translateY(0); pointer-events: auto; }
  .hero-grid, .finder-grid, .process-card, .faq-grid, .contact-card { grid-template-columns: 1fr; }
  .hero { min-height: auto; }
  .hero-scene { min-height: 430px; }
  .service-shell { grid-template-columns: 1fr; }
  .service-tabs { grid-template-columns: repeat(5, minmax(120px, 1fr)); overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--border); }
  .package-grid, .mini-grid { grid-template-columns: 1fr 1fr; }
  .steps-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 680px) {
  :root { --header-height: 68px; }
  .container { width: min(100% - 22px, var(--max-width)); }
  .section { padding: 54px 0; }
  .brand { min-width: 138px; }
  .brand img { width: 178px; height: auto; object-fit: contain; filter: drop-shadow(0 8px 22px rgba(0,0,0,.14)); }
  .icon-btn { min-width: 38px; height: 38px; padding: 0 .62rem; font-size: .82rem; }
  .hero h1 { font-size: clamp(2.55rem, 14vw, 4.1rem); }
  .hero-actions .btn, .sticky-whatsapp { width: calc(100% - 36px); left: 18px; right: 18px; }
  .hero-scene { min-height: 340px; }
  .vedic-stack { transform: rotateX(56deg) rotateZ(-34deg) scale(.78); }
  .mandala-3d { width: 320px; }
  .layer-card { width: 225px; }
  .chip-a { left: 1%; top: 18%; }
  .chip-b { right: 1%; top: 20%; }
  .chip-c { right: 8%; bottom: 8%; }
  .strip-grid { justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; padding-bottom: .2rem; }
  .service-tabs { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(142px, 1fr); }
  .detail-grid, .package-grid, .mini-grid, .steps-grid, .footer-grid, .lead-form { grid-template-columns: 1fr; }
  .lead-form label:nth-child(4), .lead-form button, .lead-form .form-note { grid-column: auto; }
  .footer-bottom { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .001ms !important; }
  .vedic-stack, .mandala-3d { transform: none !important; }
}

/* =========================================================
   RESPONSIVE STABILITY PATCH — added without changing copy,
   links, contact details, domain, colors, logo, JS or layout intent.
   Fixes mobile/tablet overflow and improves 320px–1440px layouts.
   ========================================================= */

html {
  width: 100%;
  max-width: 100%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  overflow-x: clip;
}

body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

@supports not (overflow: clip) {
  html,
  body {
    overflow-x: hidden;
  }
}

body *,
body *::before,
body *::after {
  min-width: 0;
}

img,
svg,
video,
canvas,
iframe {
  max-width: 100%;
  height: auto;
}

.hero-copy,
.hero-scene,
.finder-grid > *,
.service-detail,
.package-card,
.process-card > *,
.faq-grid > *,
.contact-card > *,
.footer-grid > * {
  min-width: 0;
}

.hero h1,
h2,
h3,
p,
a,
button,
li,
summary,
span,
strong {
  overflow-wrap: break-word;
}

.hero h1,
h2,
.service-detail h3,
.recommendation-card h3 {
  text-wrap: balance;
}

.nav-links,
.service-tabs,
.strip-grid,
.finder-buttons {
  -webkit-overflow-scrolling: touch;
}

.btn,
.choice,
.service-tab,
.nav-links a,
.icon-btn,
.nav-toggle {
  touch-action: manipulation;
}

/* Tablet and small laptop adjustments */
@media (max-width: 1120px) {
  :root {
    --max-width: 960px;
  }

  .container {
    width: min(100% - 28px, var(--max-width));
  }

  .hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(320px, .78fr);
    gap: clamp(1.5rem, 4vw, 3rem);
  }

  .hero h1 {
    font-size: clamp(3rem, 7.3vw, 5.8rem);
  }

  .hero-scene {
    min-height: 470px;
    overflow: visible;
  }

  .vedic-stack {
    width: min(100%, 390px);
  }

  .layer-card {
    width: 230px;
  }
}

/* Tablets: stack hero and convert dense grids to readable columns */
@media (max-width: 980px) {
  .site-header {
    height: var(--header-height);
  }

  .nav {
    position: relative;
  }

  .brand {
    min-width: 0;
    max-width: min(44vw, 178px);
    flex: 0 1 auto;
  }

  .brand img {
    width: min(44vw, 178px);
    max-height: 48px;
    object-fit: contain;
  }

  .nav-actions {
    margin-left: auto;
    flex: 0 0 auto;
  }

  .nav-links {
    z-index: 120;
    max-height: calc(100svh - var(--header-height) - 24px);
    overflow-y: auto;
  }

  .nav-links a {
    width: 100%;
  }

  .hero {
    padding-top: clamp(34px, 6vw, 56px);
  }

  .hero-grid,
  .finder-grid,
  .process-card,
  .faq-grid,
  .contact-card {
    grid-template-columns: 1fr !important;
  }

  .hero-copy {
    max-width: 780px;
  }

  .hero h1 {
    max-width: 760px;
    font-size: clamp(3.1rem, 9vw, 5.25rem);
  }

  .hero-subtitle {
    max-width: 720px;
  }

  .hero-scene {
    width: 100%;
    min-height: 390px;
    margin-top: .25rem;
    overflow: hidden;
  }

  .mandala-3d {
    width: min(78vw, 400px);
  }

  .vedic-stack {
    width: min(86vw, 390px);
    height: 320px;
  }

  .layer-card {
    width: min(58vw, 230px);
    min-height: 102px;
  }

  .orbit-chip {
    font-size: .82rem;
    padding: .52rem .72rem;
  }

  .service-shell {
    grid-template-columns: 1fr !important;
  }

  .service-tabs {
    display: flex;
    gap: .55rem;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    padding: .8rem;
  }

  .service-tabs::-webkit-scrollbar,
  .strip-grid::-webkit-scrollbar {
    height: 0;
  }

  .service-tab {
    flex: 0 0 min(190px, 46vw);
    scroll-snap-align: start;
  }

  .service-detail {
    min-height: auto;
  }

  .detail-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .package-grid,
  .mini-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .steps-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lead-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Phones */
@media (max-width: 680px) {
  :root {
    --header-height: 64px;
    --radius-xl: 24px;
    --radius-lg: 18px;
    --radius-md: 14px;
  }

  body {
    padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px));
  }

  .container {
    width: min(100% - 20px, var(--max-width));
  }

  .section {
    padding: 42px 0;
  }

  .site-header {
    min-height: var(--header-height);
  }

  .nav {
    gap: .45rem;
  }

  .brand {
    max-width: min(46vw, 150px);
  }

  .brand img {
    width: min(46vw, 150px) !important;
    max-height: 40px;
  }

  .compact-actions,
  .nav-actions {
    gap: .4rem;
  }

  .icon-btn,
  .nav-toggle {
    min-width: 38px;
    height: 38px;
  }

  .icon-btn {
    max-width: 84px;
    padding: 0 .58rem;
    font-size: .78rem;
    white-space: nowrap;
  }

  .nav-toggle {
    width: 38px;
  }

  .nav-links {
    inset: calc(var(--header-height) + 8px) 10px auto 10px;
    border-radius: 18px;
    padding: .65rem;
  }

  .nav-links a {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: .7rem .82rem;
  }

  .hero {
    min-height: auto !important;
    padding: 30px 0 20px;
    align-items: start;
  }

  .hero-grid {
    gap: .9rem;
  }

  .eyebrow {
    gap: .45rem;
    margin-bottom: .7rem;
    font-size: .82rem;
  }

  .eyebrow span {
    width: 30px;
  }

  .hero h1 {
    max-width: 100%;
    font-size: clamp(2.18rem, 11.6vw, 3.45rem) !important;
    line-height: 1.035;
    letter-spacing: -.048em;
  }

  h2 {
    font-size: clamp(1.86rem, 9.2vw, 2.8rem) !important;
    line-height: 1.04;
    letter-spacing: -.046em;
  }

  .hero-subtitle,
  .section-head p,
  .finder p,
  .contact-card p,
  .service-detail p {
    font-size: .98rem;
    line-height: 1.62;
  }

  .hero-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: .65rem;
    margin: 1rem 0 .8rem;
  }

  .hero-actions .btn {
    width: 100%;
    left: auto;
    right: auto;
  }

  .btn {
    width: auto;
    min-height: 46px;
    padding: .82rem .95rem;
    font-size: .94rem;
    text-align: center;
  }

  .quick-proof {
    gap: .45rem;
  }

  .quick-proof span,
  .strip-grid span {
    padding: .46rem .62rem;
    font-size: .78rem;
    white-space: nowrap;
  }

  .hero-scene {
    min-height: 300px;
    margin-top: -6px;
    overflow: hidden;
  }

  .mandala-3d {
    width: min(90vw, 300px) !important;
  }

  .vedic-stack {
    width: 300px;
    height: 250px;
    transform: rotateX(56deg) rotateZ(-34deg) scale(.68) !important;
    transform-origin: center;
  }

  .layer-card {
    width: 202px;
    min-height: 88px;
    padding: .75rem;
    border-radius: 18px;
  }

  .layer-card strong {
    font-size: 1rem;
  }

  .layer-card small {
    font-size: .74rem;
  }

  .orbit-chip {
    font-size: .68rem;
    padding: .42rem .58rem;
  }

  .chip-a {
    left: 2%;
    top: 17%;
  }

  .chip-b {
    right: 2%;
    top: 17%;
  }

  .chip-c {
    right: 9%;
    bottom: 9%;
  }

  .compact-strip {
    padding: 4px 0 14px;
  }

  .strip-grid {
    justify-content: flex-start;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: .25rem;
    scroll-snap-type: x proximity;
  }

  .strip-grid span {
    flex: 0 0 auto;
    scroll-snap-align: start;
  }

  .compact-panel,
  .service-shell,
  .process-card,
  .contact-card {
    border-radius: 22px;
  }

  .finder-grid,
  .process-card,
  .contact-card {
    padding: 1rem;
  }

  .finder-buttons {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
  }

  .choice {
    width: 100%;
    padding: .68rem .55rem;
    font-size: .86rem;
  }

  .recommendation-card {
    min-height: auto;
    padding: 1rem;
    border-radius: 20px;
  }

  .recommendation-card h3 {
    font-size: clamp(1.35rem, 7vw, 2rem);
  }

  .recommendation-card .btn,
  .service-detail .btn,
  .package-card .btn,
  .lead-form .btn {
    width: 100%;
  }

  .section-head {
    margin-bottom: .85rem;
  }

  .service-tabs {
    padding: .65rem;
    gap: .45rem;
    grid-template-columns: none !important;
    grid-auto-flow: unset;
  }

  .service-tab {
    flex: 0 0 142px;
    padding: .65rem;
    border-radius: 15px;
    font-size: .85rem;
  }

  .service-tab b {
    width: 29px;
    height: 29px;
    border-radius: 10px;
    font-size: .75rem;
  }

  .service-detail {
    padding: 1rem;
  }

  .service-detail h3 {
    font-size: clamp(1.55rem, 8vw, 2.45rem) !important;
    line-height: 1.04;
  }

  .detail-grid,
  .package-grid,
  .mini-grid,
  .steps-grid,
  .footer-grid,
  .lead-form {
    grid-template-columns: 1fr !important;
  }

  .detail-grid {
    gap: .55rem;
  }

  .detail-grid div {
    padding: .75rem;
    transform: none;
  }

  .package-grid,
  .mini-grid,
  .steps-grid {
    gap: .75rem;
  }

  .package-card,
  .mini-card,
  .steps-grid article,
  .faq-list details {
    border-radius: 18px;
  }

  .package-card {
    padding: .95rem;
  }

  .package-card h3 {
    font-size: 1.25rem;
  }

  .package-card strong {
    font-size: 1.65rem;
  }

  .package-card ul {
    min-height: 0;
    margin: .75rem 0 1rem;
  }

  .steps-grid article,
  .mini-card {
    padding: .9rem;
  }

  .faq-list details {
    padding: .85rem .9rem;
  }

  summary {
    line-height: 1.35;
  }

  .lead-form label:nth-child(4),
  .lead-form button,
  .lead-form .form-note {
    grid-column: auto !important;
  }

  .lead-form input,
  .lead-form select,
  .lead-form textarea {
    min-height: 44px;
    border-radius: 14px;
    padding: .78rem .82rem;
  }

  .site-footer {
    padding-bottom: calc(98px + env(safe-area-inset-bottom, 0px));
  }

  .footer-grid {
    gap: 1.2rem;
  }

  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
  }

  .sticky-whatsapp {
    left: 14px !important;
    right: 14px !important;
    bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    width: auto !important;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: .84rem 1rem;
  }
}

/* Very small phones: 320px–380px */
@media (max-width: 380px) {
  .container {
    width: min(100% - 16px, var(--max-width));
  }

  .brand {
    max-width: 132px;
  }

  .brand img {
    width: 132px !important;
    max-height: 36px;
  }

  .icon-btn {
    max-width: 76px;
    padding: 0 .5rem;
    font-size: .72rem;
  }

  .nav-toggle {
    min-width: 36px;
    width: 36px;
    height: 36px;
  }

  .hero h1 {
    font-size: clamp(1.95rem, 11vw, 2.6rem) !important;
  }

  h2 {
    font-size: clamp(1.62rem, 8.8vw, 2.25rem) !important;
  }

  .hero-scene {
    min-height: 260px;
  }

  .vedic-stack {
    width: 270px;
    height: 220px;
    transform: rotateX(56deg) rotateZ(-34deg) scale(.58) !important;
  }

  .mandala-3d {
    width: 260px !important;
  }

  .layer-card {
    width: 184px;
    min-height: 82px;
  }

  .orbit-chip {
    font-size: .62rem;
  }

  .finder-buttons {
    grid-template-columns: 1fr 1fr;
  }

  .service-tab {
    flex-basis: 130px;
  }
}

/* Wide phones / landscape phones */
@media (max-width: 860px) and (orientation: landscape) {
  .hero {
    min-height: auto;
  }

  .hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(260px, .8fr) !important;
    align-items: center;
  }

  .hero h1 {
    font-size: clamp(2.35rem, 6vw, 3.8rem) !important;
  }

  .hero-scene {
    min-height: 300px;
  }

  .vedic-stack {
    transform: rotateX(56deg) rotateZ(-34deg) scale(.62) !important;
  }
}
.auth-section{padding-top:calc(var(--header-height) + 42px)}.auth-card{display:grid;grid-template-columns:1fr minmax(320px,.8fr);gap:24px;align-items:start;padding:28px;border:1px solid var(--border);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow);backdrop-filter:blur(18px)}.hidden-form{display:none!important}.security .mini-card{min-height:210px}@media(max-width:860px){.auth-card{grid-template-columns:1fr}.nav .nav-links{display:flex;position:static;transform:none;opacity:1;pointer-events:auto;flex-direction:row;background:transparent;border:0;padding:0}.auth-section{padding-top:calc(var(--header-height) + 20px)}}@media(max-width:560px){.auth-card{padding:18px}.auth-card h1{font-size:2rem}.nav .nav-links a:not(.nav-cta){display:none}}