/* ═══════════════════════════════════════════════════
   layer1.css — shared styles for all Layer 1 pages
   ═══════════════════════════════════════════════════ */

:root {
  --bg:        #06060E;
  --gold:      #C9A84C;
  --gold-soft: #E8D199;
  --gold-deep: #8B6014;
  --text:      #D4C5A0;
  --dim:       #8A7E60;
  --line:      rgba(201,168,76,.18);
  --facet:     #C9A84C; /* overridden per page via inline <style> */
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: "Cormorant Garamond", serif;
  font-size: 20px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  min-height: 100vh;
}

/* ── atmosphere ── */
#stars    { position:fixed; inset:0; z-index:0; pointer-events:none; }
.vignette { position:fixed; inset:0; z-index:1; pointer-events:none;
  background: radial-gradient(ellipse at center,
    rgba(6,6,14,0) 38%, rgba(6,6,14,.5) 75%, rgba(6,6,14,.93) 100%); }
.grain    { position:fixed; inset:0; z-index:2; pointer-events:none;
  opacity:.045; mix-blend-mode:overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* ── fixed chrome ── */
#mast {
  position:fixed; top:24px; left:26px; z-index:6;
  font-family:"Cinzel",serif; font-size:.68rem; letter-spacing:.36em;
  text-transform:uppercase; color:rgba(201,168,76,.45);
}

#back {
  position:fixed; top:18px; right:22px; z-index:6;
  font-family:"Cinzel",serif; font-size:.6rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--dim); text-decoration:none;
  border:1px solid var(--line); padding:.48rem .9rem; border-radius:999px;
  transition:color .4s, border-color .4s;
}
#back:hover { color:var(--gold-soft); border-color:var(--gold); }

#langsw {
  position:fixed; top:48px; left:26px; z-index:6;
  display:flex; align-items:center; gap:8px; opacity:.7;
}
.langbtn {
  background:none; border:none; cursor:pointer; font-family:"Cinzel",serif;
  font-size:.66rem; letter-spacing:.16em; color:rgba(201,168,76,.45);
  padding:2px; transition:color .4s;
}
.langbtn.on { color:var(--gold-soft); }
.langbtn[data-l="hi"] {
  font-family:"Noto Serif Devanagari",serif; letter-spacing:0; font-size:.82rem;
}
#langsw .lsep { color:rgba(201,168,76,.3); font-size:.7rem; }

/* ── main layout ── */
main {
  position:relative; z-index:3;
  max-width:780px; margin:0 auto; padding:0 28px 10vh;
}

/* ── hero ── */
.hero {
  min-height:100svh;
  display:flex; flex-direction:column; align-items:center;
  justify-content:center; text-align:center;
  padding:100px 0 60px;
}

.orb {
  width:clamp(70px,12vw,110px); height:clamp(70px,12vw,110px);
  border-radius:50%;
  background:radial-gradient(circle, var(--facet) 0%, transparent 68%);
  filter:blur(clamp(12px,2.5vw,22px));
  animation:breathe 5s ease-in-out infinite, fadein 2s ease .2s both;
  margin-bottom:clamp(20px,4vh,44px);
}
@keyframes breathe {
  0%,100% { transform:scale(.88); opacity:.5; }
  50%      { transform:scale(1.12); opacity:.95; }
}

.numeral {
  font-family:"Cinzel",serif; font-size:.72rem; letter-spacing:.46em;
  text-transform:uppercase; color:var(--facet);
  animation:rise 1.4s ease .6s both; margin-bottom:1rem;
}

.hero-title {
  font-family:"Cormorant Garamond",serif; font-weight:500; font-style:italic;
  font-size:clamp(2.1rem,6.8vw,3.7rem); line-height:1.18;
  color:var(--gold-soft);
  text-shadow:0 0 52px rgba(201,168,76,.22);
  max-width:16ch; text-wrap:balance;
  animation:rise 1.6s ease .9s both; margin-bottom:.8rem;
}

.hero-sub {
  font-size:clamp(1.1rem,2.6vw,1.26rem); color:var(--text); max-width:44ch;
  animation:rise 1.6s ease 1.2s both;
  margin-bottom:clamp(28px,5vh,52px);
}

.hero-intro {
  font-size:clamp(1.12rem,2.7vw,1.28rem); line-height:1.92;
  color:var(--text); max-width:56ch;
  animation:rise 1.6s ease 1.5s both;
  text-align:left;
}
.hero-intro em { color:var(--gold-soft); font-style:italic; }

@keyframes rise    { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:none} }
@keyframes fadein  { to{opacity:1} }

/* ── divider ── */
.section-divider {
  border:none; border-top:1px solid var(--line); margin:8vh 0;
}

/* ── topics ── */
.topics-label {
  font-family:"Cinzel",serif; font-size:.7rem; letter-spacing:.4em;
  text-transform:uppercase; color:var(--gold-deep); margin-bottom:2.6rem;
}

.topic {
  padding:1.3rem 0 1.3rem 1.6rem;
  border-left:1px solid var(--facet);
  margin-bottom:2rem;
  opacity:0; transform:translateY(18px);
  transition:opacity .9s ease, transform .9s ease;
}
.topic.in { opacity:1; transform:none; }

.topic-title {
  font-family:"Cinzel",serif; font-weight:500;
  font-size:clamp(1.04rem,2.8vw,1.18rem); letter-spacing:.04em;
  color:var(--gold-soft); margin-bottom:.6rem;
}

.topic-body {
  font-size:clamp(1.06rem,2.6vw,1.18rem); line-height:1.88;
  color:var(--text); max-width:58ch;
}
.topic-body em { color:var(--gold-soft); font-style:italic; }

/* ── verse ── */
.verse {
  text-align:center; padding:8vh 0;
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  margin:8vh 0;
}
.verse blockquote {
  font-family:"IM Fell English",serif; font-style:italic;
  font-size:clamp(1.35rem,4.2vw,2rem); line-height:1.6;
  color:var(--gold-soft); max-width:24ch; margin:0 auto;
  text-shadow:0 0 40px rgba(201,168,76,.2);
}
.verse cite {
  display:block; margin-top:1.5rem;
  font-family:"Cinzel",serif; font-style:normal;
  font-size:.64rem; letter-spacing:.3em; text-transform:uppercase;
  color:var(--gold);
}

/* ── footer ── */
.page-footer { text-align:center; padding:4vh 0 6vh; }
.footer-mark {
  font-family:"Cinzel",serif; letter-spacing:.34em; text-transform:uppercase;
  font-size:.72rem; color:var(--gold); margin-bottom:.8rem;
}
.footer-note { font-style:italic; color:var(--dim); font-size:.92rem; }

/* ── scroll cue ── */
#scroll-cue {
  position:fixed; bottom:7vh; left:50%; transform:translateX(-50%);
  z-index:5; display:flex; flex-direction:column; align-items:center; gap:.55rem;
  pointer-events:none; opacity:1; transition:opacity .9s ease;
}
#scroll-cue.hidden { opacity:0; }
#scroll-cue .sc-label {
  font-family:"Cinzel",serif; font-size:.56rem;
  letter-spacing:.3em; text-transform:uppercase; color:rgba(201,168,76,.52);
}
#scroll-cue .sc-arrow {
  width:18px; height:18px;
  border-right:1px solid rgba(201,168,76,.4);
  border-bottom:1px solid rgba(201,168,76,.4);
  transform:rotate(45deg);
  animation:scrollBounce 1.9s ease-in-out infinite;
}
@keyframes scrollBounce {
  0%,100% { transform:rotate(45deg) translateY(0);   opacity:.4; }
  50%      { transform:rotate(45deg) translateY(6px); opacity:.88; }
}

/* ── mast as home link ── */
#mast a { color:inherit; text-decoration:none; }
#mast a:hover { color:var(--gold-soft); }

/* ── facet navigation ── */
.facet-nav {
  margin:7vh 0 5vh; text-align:center;
}
.facet-nav-label {
  font-family:"Cinzel",serif; font-size:.6rem;
  letter-spacing:.4em; text-transform:uppercase;
  color:var(--gold-deep); margin-bottom:1.5rem;
}
.facet-chips {
  display:flex; flex-wrap:wrap; gap:.55rem;
  justify-content:center; margin-bottom:2.8rem;
}
.facet-chip {
  font-family:"Cinzel",serif; font-size:.58rem;
  letter-spacing:.12em; text-transform:uppercase;
  text-decoration:none; padding:.38rem .95rem;
  border:1px solid rgba(201,168,76,.18); border-radius:999px;
  color:var(--dim);
  transition:color .3s, border-color .3s;
}
.facet-chip:hover { color:var(--gold-soft); border-color:rgba(201,168,76,.48); }
.facet-chip.current {
  color:var(--facet); border-color:var(--facet);
  opacity:.75; pointer-events:none; cursor:default;
}
.facet-next-wrap { display:block; margin-bottom:.5rem; }
.facet-next-eyebrow {
  font-family:"Cinzel",serif; font-size:.56rem;
  letter-spacing:.32em; text-transform:uppercase;
  color:var(--dim); margin-bottom:.6rem;
}
.facet-next {
  display:inline-flex; align-items:center; gap:.6rem;
  text-decoration:none;
  font-family:"Cormorant Garamond",serif; font-style:italic;
  font-size:clamp(1.15rem,3vw,1.5rem);
  color:var(--gold-soft);
  border-bottom:1px solid rgba(201,168,76,.22);
  padding-bottom:.28rem;
  transition:color .3s, border-color .3s;
}
.facet-next:hover { color:var(--gold); border-color:rgba(201,168,76,.65); }

/* ── email notify section ── */
.notify-section {
  margin:4vh 0 5vh; text-align:center;
}
.notify-card {
  display:inline-block; width:100%; max-width:500px;
  background:rgba(201,168,76,.04);
  border:1px solid rgba(201,168,76,.16); border-radius:14px;
  padding:clamp(28px,5vw,50px) clamp(22px,5vw,48px);
}
.notify-eyebrow {
  font-family:"Cinzel",serif; font-size:.6rem;
  letter-spacing:.36em; text-transform:uppercase;
  color:var(--facet); margin-bottom:1rem;
}
.notify-title {
  font-family:"Cormorant Garamond",serif; font-weight:500; font-style:italic;
  font-size:clamp(1.15rem,3vw,1.45rem); line-height:1.38;
  color:var(--gold-soft); margin-bottom:.65rem;
}
.notify-sub {
  font-size:.96rem; color:var(--dim); line-height:1.72; margin-bottom:1.8rem;
}
.notify-form {
  display:flex; gap:.6rem; justify-content:center; flex-wrap:wrap;
}
.notify-input {
  flex:1; min-width:0; max-width:250px;
  padding:.6rem 1.05rem;
  font-family:"Cormorant Garamond",serif; font-size:1rem;
  color:var(--gold-soft);
  background:rgba(6,6,14,.72);
  border:1px solid rgba(201,168,76,.22); border-radius:999px;
  outline:none; transition:border-color .35s;
}
.notify-input::placeholder { color:var(--dim); opacity:.65; }
.notify-input:focus { border-color:rgba(201,168,76,.52); }
.notify-btn {
  padding:.6rem 1.45rem;
  font-family:"Cinzel",serif; font-size:.6rem;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--bg); background:var(--gold);
  border:none; border-radius:999px;
  cursor:pointer; white-space:nowrap;
  transition:background .28s, transform .2s;
}
.notify-btn:hover { background:var(--gold-soft); transform:scale(1.03); }
.notify-msg {
  margin-top:1rem; min-height:1.5em;
  font-size:.9rem; font-style:italic; color:var(--facet);
}

/* ── Hindi overrides ── */
body.lang-hi .numeral, body.lang-hi .hero-title, body.lang-hi .hero-sub,
body.lang-hi .hero-intro, body.lang-hi .topics-label, body.lang-hi .topic-title,
body.lang-hi .topic-body, body.lang-hi .verse blockquote, body.lang-hi .verse cite,
body.lang-hi #back, body.lang-hi #mast, body.lang-hi .footer-mark, body.lang-hi .footer-note {
  font-family:"Kohinoor Devanagari","Noto Serif Devanagari","Devanagari Sangam MN",serif !important;
  letter-spacing:.02em !important; text-transform:none !important; font-style:normal !important;
}

/* ── reduced motion ── */
@media (prefers-reduced-motion:reduce) {
  * { animation:none !important; }
  .orb, .numeral, .hero-title, .hero-sub, .hero-intro { opacity:1; transform:none; }
  .topic { opacity:1; transform:none; }
}

/* ── mobile ── */
@media (max-width:600px) {
  main { padding:0 18px 10vh; }
  .hero { padding:80px 0 48px; }
  #mast { font-size:.6rem; letter-spacing:.28em; }
}