/* ============================================================
   Nityaveda — site-wide night theme. Loaded AFTER styles.css on
   every page except the homepage (which uses home2.css).
   Carries the immersive homepage language across the site:
   night paper, moonlit hairlines, open content over boxed cards,
   time-of-day accents kept from the phase engine.
   ============================================================ */

:root{
  --paper:#08081A; --paper2:#0E0C26; --card:rgba(255,255,255,.045);
  --ink:#F4EFFF; --ink2:rgba(244,239,255,.66);
  --line:rgba(255,255,255,.12); --hair:rgba(255,255,255,.26);
  --r:14px;
  --shadow:0 30px 70px -34px rgba(0,0,0,.85);
  --shadow-sm:0 16px 40px -26px rgba(0,0,0,.75);
  /* moonlight accent, fixed: matches the homepage and overrides the
     time-of-day phase engine (html-level inline values lose to this) */
  --accent:#C3CEEC !important;
  --accent2:#DEE5F8 !important;
  --wash:rgba(186,200,240,.12) !important;
  --washsoft:rgba(186,200,240,.05) !important;
  --glow:rgba(186,200,240,.3) !important;
}
html{background-color:var(--paper)}
body{background-color:var(--paper);color:var(--ink);
  background-image:radial-gradient(70% 50% at 85% -10%, var(--washsoft), transparent 60%)}
input::placeholder,textarea::placeholder{color:rgba(244,239,255,.5)}
.kaal-seg .lab{font-weight:600;text-shadow:0 1px 6px rgba(0,0,0,.55)}

/* eyebrows speak in the site's own voice, not the kicker default */
.eyebrow,.tm-eyebrow,.feat-tag .k{
  font-family:"Fraunces","Fraunces-fallback",serif !important;font-style:italic;font-weight:430;
  text-transform:none !important;letter-spacing:.02em !important;font-size:1.02rem !important}

/* quiet the warm aura blobs, but the moonlight petals drift back in */
.nv-aura{display:none !important}

/* drifting moonlight petals: a fixed field behind all content, every page */
.nv-petals{position:fixed;inset:0;z-index:4;pointer-events:none;overflow:hidden}
.nv-petal{position:absolute;top:-6%;pointer-events:none;border-radius:62% 0 62% 0;
  opacity:0;will-change:transform,opacity;
  filter:blur(.2px) drop-shadow(0 0 8px rgba(186,200,240,.55));
  animation:nvfall linear forwards}
@keyframes nvfall{
  0%{opacity:0;transform:translateY(-14px) translateX(0) rotate(0)}
  10%{opacity:1}
  90%{opacity:1}
  100%{opacity:0;transform:translateY(108vh) translateX(56px) rotate(320deg)}}
@media(prefers-reduced-motion:reduce){.nv-petals{display:none}}
body.gita-playing .nv-petals{opacity:0;transition:opacity 1s ease}
.sec-head.center h2::after{display:none}
.idea::before,.breath::before,.today-mantra::before{display:none}

/* ---------- inner page heads : consistent scale and air, under the living sky ---------- */
.method-hero{position:relative;
  background:
    radial-gradient(110% 130% at 76% -20%, var(--nsky-glow,rgba(60,74,142,.24)), transparent 56%),
    linear-gradient(180deg, var(--nsky-mid,#0C0A24) 0%, var(--nsky-bot,#15123A) 46%, var(--paper) 100%);
  transition:background 2s ease}
.ribbon{background:var(--nsky-top,rgba(5,5,14,.92))}

/* ---------- ribbon ---------- */
.ribbon{background:rgba(5,5,14,.92);border-bottom:1px solid var(--line);color:var(--ink2)}
.ribbon:hover{background:rgba(12,12,30,.95);filter:none}
.ribbon b,.ribbon-cta{color:var(--ink);font-weight:600}
.ribbon-dot{background:var(--accent);box-shadow:none}

/* ---------- nav ---------- */
.nav{background:rgba(8,8,26,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.brand{color:var(--ink)}
.brand .om{background:none;-webkit-background-clip:initial;background-clip:initial;
  -webkit-text-fill-color:var(--accent);color:var(--accent)}
.navlinks{color:var(--ink2)}
.navlinks a:hover{color:var(--ink)}
.navlinks .cta{background:transparent;border:0;color:var(--accent);
  box-shadow:none;animation:none}
.navlinks .cta:hover{background:var(--accent);color:#0A0A18;filter:none}
.mobile-menu{background:var(--paper2);box-shadow:0 20px 40px -24px rgba(0,0,0,.7)}
.mobile-menu a:hover,.mobile-menu a:focus{color:var(--ink)}
.menubtn{background:transparent}
.menubtn .mb-bar{background:var(--ink)}

/* ---------- inner-page hero : one steady night, lit by the hour's accent ---------- */
.hero{animation:none;
  background:
    radial-gradient(80% 60% at 72% -4%, var(--wash), transparent 60%),
    linear-gradient(180deg,#05050F 0%,#0C0A24 58%,#15123A 100%)}
.hero::after{animation:none;opacity:.5}
.hero h1 em{animation:none;color:var(--accent2);text-shadow:0 2px 34px rgba(0,0,0,.4)}
.hills{color:rgba(4,4,14,.9)}

/* ---------- cards become quiet dark panels ---------- */
.kaal-item{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;box-shadow:none;padding:16px 2px}
.kaal-item.good{border-top-color:var(--hair);box-shadow:none}
.kaal-item.now{border-color:var(--line);background:linear-gradient(90deg,rgba(255,255,255,.06),transparent 70%)}
.kaal-item.now .nm::after{color:var(--accent);border-color:var(--hair)}
.kaal-bar{background:rgba(255,255,255,.04);border:1px solid var(--line)}
.kaal-nowmark{background:var(--ink);box-shadow:0 0 0 3px rgba(8,8,26,.7)}
.yoga{background:var(--card)}
.daily{background:rgba(10,9,28,.8);border:1px solid var(--line);box-shadow:var(--shadow)}

/* ---------- buttons : flat accent or ghost, no gradients ---------- */
.cf-send,#starGo,.nvgeo,#breathBtn{background:var(--accent);color:#0A0A18;box-shadow:none}
.cf-send:hover,#starGo:hover,.nvgeo:hover{filter:brightness(1.1);transform:none}
.cal-yr[aria-selected="true"]{background:var(--accent);color:#0A0A18;box-shadow:none}
.wheel button[aria-selected="true"]{background:var(--accent);color:#0A0A18;border-color:transparent}
.badge.rare{background:transparent;color:var(--accent);border:0;border-radius:0;padding:0;letter-spacing:.14em}
.playmantra:hover{background:var(--accent);color:#0A0A18;border-color:transparent}
.playmantra.on{background:var(--accent);color:#0A0A18}
.geo-btn:hover,.playom:hover{background:var(--accent);color:#0A0A18;border-color:transparent}

/* ---------- forms ---------- */
.contact-form{background:var(--card);box-shadow:none}
.contact-form input,.contact-form textarea{background:rgba(255,255,255,.06);color:var(--ink)}
.star-fields input,.star-fields select{background:rgba(255,255,255,.06);color:var(--ink);border-color:var(--hair)}
.kaal select,.geo-btn,.lp-loc select,.sun-demo select{background:rgba(255,255,255,.06);color:var(--ink);border-color:var(--line)}

/* ---------- place chooser ---------- */
.nvveil{background:rgba(2,2,8,.6)}
.nvplace{background:var(--paper2);box-shadow:0 30px 80px -22px rgba(0,0,0,.8)}
.nvchips button{background:rgba(255,255,255,.06);color:var(--ink);border-color:var(--hair)}

/* ---------- calendar tags : same hues, lifted for the dark ---------- */
.cal-tag.t-e{color:#8FD4E2;background:rgba(47,125,143,.18);border-color:rgba(143,212,226,.32)}
.cal-tag.t-p{color:#E8CC7A;background:rgba(201,168,76,.16);border-color:rgba(232,204,122,.32)}
.cal-tag.t-a{color:#BCC1DE;background:rgba(150,156,196,.14);border-color:rgba(188,193,222,.3)}
.cal-tag.t-f{color:#F0A28A;background:rgba(176,67,42,.18);border-color:rgba(240,162,138,.32)}
.vtab td.vy{color:#79CC9E}
.vtab td.vn{color:#F0A28A}

/* ---------- footer : flat night, no gradient text ---------- */
footer{background:#05050F;border-top:1px solid var(--line)}
.foot .brand .om{background:none;-webkit-background-clip:initial;background-clip:initial;
  -webkit-text-fill-color:var(--accent);color:var(--accent)}
.foot .dev{color:var(--ink2)}

/* ---------- chapter playback : cinema mode ---------- */
/* shlokas become subtitles set into the picture, no chrome */
.shloka-cues{right:0;left:0;top:auto;bottom:7vh;transform:none;width:auto;
  display:grid;justify-items:center;padding:0 18px}
.shloka-cue{background:transparent;border:0;border-radius:0;box-shadow:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  max-width:640px;text-align:center;padding:0;
  transform:translateY(12px);transition:opacity 1.1s ease,transform 1.1s ease}
.shloka-cue.show{transform:none}
.shloka-cue .sc-dev{color:#FFDCA6;font-size:1.5rem;line-height:1.6;
  text-shadow:0 2px 18px rgba(0,0,0,.85),0 0 44px rgba(0,0,0,.6)}
.shloka-cue .sc-en{color:#F7F3FF;font-size:1.08rem;
  text-shadow:0 2px 14px rgba(0,0,0,.85)}
.shloka-cue .sc-src{color:rgba(244,239,255,.72);text-shadow:0 1px 8px rgba(0,0,0,.8)}
@media (max-width:1024px){
  .shloka-cue{max-width:560px;padding:0}
  .shloka-cue .sc-dev{font-size:1.22rem}
  .shloka-cue .sc-en{font-size:.98rem}
}

/* the lights go down while the chapter plays */
.ribbon,.nav,.scene-copy,section,footer{transition:opacity 1.4s ease}
body.gita-playing .ribbon,body.gita-playing .nav{opacity:.15}
body.gita-playing .scene-copy{opacity:.08}
body.gita-playing section,body.gita-playing footer{opacity:.1}
/* when paused, lift the cinema dimming so the reader can scroll back and read */
body.gita-playing.gita-paused .ribbon,body.gita-playing.gita-paused .nav,
body.gita-playing.gita-paused .scene-copy,
body.gita-playing.gita-paused section,body.gita-playing.gita-paused footer{opacity:1}

/* ---------- living light in the chapter scene ---------- */
/* battlefield haze drifts through the midground */
.scene-haze{position:absolute;left:-12%;right:-12%;top:24%;height:36%;z-index:2;
  pointer-events:none;mix-blend-mode:screen;opacity:.10;filter:blur(14px);
  background:
    radial-gradient(34% 70% at 22% 55%,rgba(150,170,220,.7),transparent 70%),
    radial-gradient(30% 64% at 58% 45%,rgba(170,160,210,.55),transparent 70%),
    radial-gradient(36% 72% at 86% 58%,rgba(140,160,215,.6),transparent 70%)}
@media (prefers-reduced-motion: no-preference){
  .scene-haze{animation:gHaze 75s ease-in-out infinite alternate}
  @keyframes gHaze{
    from{transform:translateX(-2.5%) translateY(0)}
    to{transform:translateX(2.5%) translateY(-1.5%)}}
}

/* ---------- gita chapter scene : the photo belongs to the sky ---------- */
.gita-scene{background:linear-gradient(180deg,var(--paper) 0%,#16103A 48%,#241646 82%,#2A1750 100%)}
.scene-stage{max-width:none;margin:24px auto 0;background:transparent;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.55) 9%,#000 22%);
  mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.55) 9%,#000 22%)}
.scene-stage::before{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;
  background:linear-gradient(0deg,var(--paper) 0,rgba(8,8,26,0) 20%)}

/* ---------- focus visibility ---------- */
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible{
  outline:2px solid var(--accent);outline-offset:3px}

/* ============================================================
   De-box pass : the card chrome goes; content sits open on the
   night with hairline rules, matching the homepage language.
   ============================================================ */

/* idea / yoga / weekday / doorway grids → open columns under hairlines */
.idea,.yoga,.pillar,.door,.daypanel{
  background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;
  box-shadow:none;padding:24px 0 6px;transition:border-color .25s ease}
.idea:hover,.pillar:hover,.daypanel:hover,.door:hover{
  transform:none;box-shadow:none;border-top-color:var(--hair)}
.ideas,.yogas,.door-grid{gap:26px 44px}
.pillars{gap:26px 44px}
.pillar .num{background:transparent;border:1px solid var(--accent);color:var(--accent);
  box-shadow:none;width:40px;height:40px;border-radius:50%}

/* gita spotlight block */
.gita{background:transparent;border:0;border-radius:0;
  border-top:1px solid var(--hair);border-bottom:1px solid var(--line);padding:34px 0}

/* accordions (upcoming days, mantra list) → hairline rows */
.up,.mantra{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;box-shadow:none}
.up:hover,.mantra:hover{transform:none;box-shadow:none}
.upcoming,.mantras{gap:0}
.up:last-child,.mantra:last-child{border-bottom:1px solid var(--line)}
.up .hd{padding:16px 2px}
.mantra .hd{padding:15px 2px}
.up .det{padding:0 2px 18px 62px}
.mantra .det{padding:0 2px 18px}

/* practice */
.practice-grid > .breath{position:sticky;top:96px}
@media(max-width:880px){.practice-grid > .breath{position:static}}
.breath{background:transparent;border:0;border-radius:0;border-top:1px solid var(--line);padding:30px 0 0}
.today-mantra{background:transparent;border:0;border-radius:0;
  border-top:1px solid var(--hair);border-bottom:1px solid var(--line);padding:34px 8px 30px}

/* live panchang lab */
.lab{background:transparent;border:0;border-radius:0;padding:0;box-shadow:none}
.lp-limb{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:18px 2px 0}
.lp-grid{gap:18px 38px}
.ro{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:14px 2px 0}
.readout{gap:16px 32px}
.sun-demo{background:transparent;border:0;border-radius:0;border-top:1px solid var(--line);padding:24px 0 0;box-shadow:none}
.src{background:transparent;border:0;border-radius:0;border-top:1px solid var(--line);padding:20px 2px 0}
.formula{background:rgba(255,255,255,.04);border-color:var(--line)}
.limits p{border-left-color:var(--hair)}

/* calendar */
.cal-month{background:transparent;border:0;border-top:1px solid var(--hair);border-radius:0;
  box-shadow:none;padding:18px 2px 8px}
.cal-grid{gap:24px 42px}
.cal-note{background:transparent;border:0;border-left:2px solid var(--accent);border-radius:0}
.cal-years{background:transparent;border:0;border-radius:0;border-bottom:1px solid var(--line);padding:0;gap:26px}
.cal-yr{border-radius:0;padding:0 2px 12px;margin-bottom:-1px;border-bottom:2px solid transparent}
.cal-yr[aria-selected="true"]{background:transparent;color:#fff;box-shadow:none;border-bottom-color:var(--accent)}

/* your star */
.star-card,.star-c,.star-result{background:transparent;border:0;border-radius:0;box-shadow:none}
.star-card{border-top:1px solid var(--line);padding:26px 0 0;margin-bottom:34px}
.star-c{border-top:1px solid var(--line);padding:30px 0 8px}
.skyband{border:1px solid var(--line);border-radius:12px}
.star-fact{background:transparent;border:0;border-radius:0;border-left:2px solid var(--hair);padding:4px 0 4px 20px}

/* contact */
.contact-form{background:transparent;border:0;border-radius:0;padding:0;backdrop-filter:none;-webkit-backdrop-filter:none}

/* gita reading care note */
.care-note{background:transparent;border-radius:0;box-shadow:none}

/* daily card + tabs (any page that carries them) → open with underline tabs */
.daily{background:transparent;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.tabpane{padding:30px 2px}
.daytabs{display:inline-flex;gap:28px;border-bottom:1px solid var(--line)}
.daytab{flex:none;padding:0 2px 12px;color:var(--ink2)}
.daytab+.daytab{border-left:0}
.daytab[aria-selected="true"]{color:#fff}

/* ---------- spacing : let the page breathe ---------- */
section{padding:96px 0}
.hero + section{padding-top:56px}
.method-hero + section{padding-top:48px}
.nav + section{padding-top:56px}
.sec-head{margin-bottom:54px}
.method-hero{padding:72px 0 16px}

/* tabs never wrap */
.daytab,.cal-yr{white-space:nowrap}

/* ---------- hero : match the ideas hero exactly across all inner pages ---------- */
.method-hero{text-align:left;padding:0}
.method-hero .wrap.narrow{max-width:1180px;margin:0 auto;padding:64px 32px 84px}
.method-hero .hero-eyebrow{justify-content:flex-start;gap:14px;margin-bottom:22px}
.method-hero .hero-eyebrow .rule:last-child{display:none}
.method-hero .hero-eyebrow .rule{width:42px;background:var(--accent);opacity:.55}
.method-hero .hero-eyebrow .eyebrow{font-family:"Fraunces","Fraunces-fallback",Georgia,serif;font-style:italic;
  font-weight:430;font-size:1.04rem;letter-spacing:.01em;text-transform:none;color:var(--accent2)}
.method-hero h1{font-family:"Fraunces","Fraunces-fallback",Georgia,serif;font-weight:330;
  font-size:clamp(2.7rem,6.4vw,5.2rem);line-height:.98;letter-spacing:-.018em;
  margin:0 0 26px;max-width:17ch;color:#fff;text-shadow:0 2px 50px rgba(0,0,0,.5)}
.method-hero h1 em{font-style:italic;color:var(--accent)}
.method-hero .hero-sub{text-align:left;margin:0;max-width:50ch;
  font-size:clamp(1.06rem,1.5vw,1.24rem);line-height:1.6;color:var(--ink2)}
.method-hero + section{padding-top:8px}
@media(max-width:680px){.method-hero .wrap.narrow{padding:52px 22px 60px}}

/* section-head eyebrows italic to match the hero */
section .sec-head .eyebrow{font-family:"Fraunces","Fraunces-fallback",Georgia,serif;font-style:italic;
  font-weight:430;font-size:1.0rem;letter-spacing:.02em;text-transform:none;color:var(--accent2)}

/* content frame on the plain (method-hero) pages: hero keeps its own narrow edge */
body:not([class]) .method-hero .wrap.narrow{padding:64px 32px 84px}
@media(max-width:680px){
  body:not([class]) .method-hero .wrap.narrow{padding:52px 22px 60px}
}

/* ============================================================
   Mobile optimisation: comfortable tap targets and readable
   labels at phone widths. Most visitors are on a phone.
   ============================================================ */
@media(max-width:680px){
  /* footer links: give them room to tap */
  .footlinks{display:flex;flex-wrap:wrap;gap:6px 22px}
  .footlinks a{display:inline-flex;align-items:center;min-height:44px;padding:4px 2px}
  /* day tabs: taller hit area */
  .daytab{min-height:44px;display:inline-flex;align-items:center}
  /* the kaal day-shape bar: bigger labels, taller bar so 8 windows read */
  .kaal-bar{height:54px}
  .kaal-seg .lab{font-size:.66rem;letter-spacing:.04em}
  /* the 'Today's sky' scroll link and similar small links: easier to tap */
  .h2-scroll,.kaal-now,.lp-geo{min-height:44px;display:inline-flex;align-items:center}
  /* ribbon: a touch larger so the location line is legible */
  .ribbon{font-size:.78rem;min-height:42px}
}
@media(max-width:420px){
  /* very narrow phones: drop the smallest kaal labels rather than crush them,
     the legend below names every window in full */
  .kaal-seg.gulika .lab,.kaal-seg.yama .lab{font-size:.6rem}
}
/* ============================================================
   Site consistency + mobile (audit pass)
   One container width and one section rhythm across the site, so
   pages stop reading as separate builds. Story pages keep their own
   widths because their sections are class-scoped (g2- / v2- / scene).
   ============================================================ */
.wrap{max-width:1240px;padding:0 28px}
body:not([class]) .wrap{max-width:1240px;padding:0 28px}

@media(max-width:900px){
  .wrap,body:not([class]) .wrap{padding:0 22px}
}
@media(max-width:680px){
  .wrap,body:not([class]) .wrap{padding:0 18px}
  section{padding:58px 0}
  .nav .row{padding:10px 0}
}
@media(max-width:420px){
  .wrap,body:not([class]) .wrap{padding:0 16px}
}

/* ---- nv-next: one clear continue per page (journey spine) ---- */
.nv-next{padding:8px 0 18px;margin-top:42px}
.nv-next .wrap{border-top:1px solid var(--line);padding-top:38px}
.nv-next-k{display:block;font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink2);margin-bottom:18px}
a.nv-next-go{display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px 22px;text-decoration:none;padding:6px 0;transition:transform .3s ease}
a.nv-next-go:hover{transform:translateX(6px)}
.nv-next-t{grid-column:1;font-family:'Fraunces',Georgia,serif;font-weight:430;font-size:clamp(1.7rem,3.4vw,2.4rem);line-height:1.12;color:var(--ink)}
.nv-next-d{grid-column:1;color:var(--ink2);font-size:1.02rem;line-height:1.55;margin-top:9px;max-width:50ch}
.nv-next-arr{grid-column:2;grid-row:1 / span 2;align-self:center;color:var(--accent);font-size:1.7rem;line-height:1;transition:transform .3s ease}
a.nv-next-go:hover .nv-next-arr{transform:translateX(6px)}
@media(max-width:640px){.nv-next .wrap{padding-top:30px}.nv-next-t{font-size:clamp(1.5rem,6vw,2rem)}.nv-next-arr{font-size:1.4rem}}