.mantras-page {
  --mantra-cream:#fff9ee;
  --mantra-paper:#fffdf8;
  --mantra-gold:#e6aa52;
  --mantra-deep:#3c2926;
  --mantra-wine:#6b3034;
  color:#4b3b35;
  background:var(--mantra-cream);
}

.mantra-header { color:#fffaf0; }
.mantra-header .nav-cta { border-color:rgba(255,250,240,.65); }

.mantra-hero {
  position:relative;
  display:grid;
  grid-template-columns:1.12fr .88fr;
  align-items:center;
  gap:70px;
  min-height:650px;
  overflow:hidden;
  padding:145px max(6vw,calc((100vw - 1180px)/2)) 90px;
  color:#fffaf0;
  background:
    radial-gradient(circle at 78% 32%,rgba(255,190,92,.34),transparent 24%),
    radial-gradient(circle at 15% 92%,rgba(180,73,59,.24),transparent 29%),
    linear-gradient(125deg,var(--mantra-deep),var(--mantra-wine));
}
.mantra-hero::after {
  content:"";
  position:absolute;
  right:-130px;
  bottom:-290px;
  width:520px;
  height:520px;
  border:1px solid rgba(255,216,151,.32);
  border-radius:50%;
  box-shadow:0 0 0 70px rgba(255,216,151,.045),0 0 0 140px rgba(255,216,151,.025);
}
.mantra-hero-copy { position:relative; z-index:1; }
.mantra-hero .back-link { display:inline-block; margin-bottom:42px; color:#ffc970; font-weight:700; text-decoration:none; }
.mantra-hero .eyebrow { color:#ffc970; }
.mantra-hero h1 { color:#fffaf0; }
.mantra-hero h1 em { color:#ffc970; }
.mantra-hero-copy>p:last-child { max-width:660px; margin:28px 0 0; color:rgba(255,250,240,.86); font-size:1.15rem; }

.mantra-hero .mantra-logo-orbit {
  --orbit-color:#ffd28a;
  --orbit-bg:#3d2927;
  --logo-x:0%;
  --logo-y:0%;
  z-index:1;
  width:min(100%,520px);
  background:radial-gradient(circle,rgba(255,208,126,.18) 0 44%,rgba(255,255,255,.035) 45% 63%,transparent 64%);
}
.mantra-hero .mantra-logo-orbit::before { inset:3% 8% 12% 2%; border-color:rgba(255,218,151,.38); }
.mantra-hero .mantra-logo-orbit::after { inset:16% 3% 5% 19%; border-color:rgba(255,248,235,.25); }
.mantra-hero .mantra-logo-orbit>img {
  width:62%;
  object-fit:contain;
  filter:drop-shadow(0 22px 34px rgba(255,183,76,.22));
}
.mantra-hero .mantra-logo-orbit .orbit-runner span {
  color:#4a2e2b;
  background:#ffd789;
  border-color:rgba(255,255,255,.28);
  box-shadow:0 10px 28px rgba(22,10,9,.25);
}
.mantra-logo-orbit .orbit-runner:nth-of-type(1){--speed:29s;--delay:-7s;inset:1% 9% 17% 0}
.mantra-logo-orbit .orbit-runner:nth-of-type(2){--speed:21s;--delay:-13s;inset:17% 0 4% 22%;animation-direction:reverse}
.mantra-logo-orbit .orbit-runner:nth-of-type(2) span{animation-direction:reverse}
.mantra-logo-orbit .orbit-runner:nth-of-type(3){--speed:37s;--delay:-2s;inset:8% 19% 0 3%}
.mantra-logo-orbit .orbit-runner:nth-of-type(4){--speed:25s;--delay:-18s;inset:23% 7% 12% 1%;animation-direction:reverse}
.mantra-logo-orbit .orbit-runner:nth-of-type(4) span{animation-direction:reverse}
.mantra-logo-orbit .orbit-runner:nth-of-type(5){--speed:42s;--delay:-29s;inset:4% 2% 22% 15%}
.mantra-logo-orbit .orbit-runner:nth-of-type(6){--speed:31s;--delay:-11s;inset:19% 18% 2% 0;animation-direction:reverse}
.mantra-logo-orbit .orbit-runner:nth-of-type(6) span{animation-direction:reverse}
.mantra-logo-orbit .orbit-runner:nth-of-type(7){--speed:34s;--delay:-24s;inset:0 22% 15% 8%}
.mantra-logo-orbit .orbit-runner:nth-of-type(8){--speed:46s;--delay:-35s;inset:26% 1% 3% 13%;animation-direction:reverse}
.mantra-logo-orbit .orbit-runner:nth-of-type(8) span{animation-direction:reverse}

.mantra-session { padding:105px max(6vw,calc((100vw - 1180px)/2)) 120px; }
.session-heading { max-width:900px; margin:0 auto 70px; text-align:center; }
.session-number,.session-date { margin:0; color:#a75d4b; font-size:.8rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.session-date { margin-top:6px; color:#7d6a62; letter-spacing:.08em; }
.session-heading h2 { margin-top:20px; color:var(--mantra-deep); }
.session-heading blockquote { max-width:720px; margin:24px auto 0; color:#9a5d40; font-size:clamp(1.35rem,2.7vw,2rem); font-style:italic; line-height:1.35; }

.session-content { display:grid; grid-template-columns:minmax(280px,420px) minmax(0,1fr); gap:76px; align-items:start; }
.mantra-card { position:sticky; top:28px; margin:0; }
.mantra-card img { width:100%; border-radius:210px 210px 28px 28px; box-shadow:0 28px 65px rgba(82,48,38,.2); }
.mantra-explanation { display:grid; gap:28px; }
.mantra-explanation section { padding:36px 38px; border:1px solid rgba(121,73,59,.13); border-radius:30px 9px 30px 9px; background:rgba(255,253,248,.94); box-shadow:0 18px 42px rgba(107,56,42,.075); }
.mantra-explanation section:nth-child(even) { border-radius:9px 30px 9px 30px; }
.mantra-explanation h3 { margin:0 0 18px; color:var(--mantra-deep); font-family:"Playfair Display",serif; font-size:clamp(1.7rem,3vw,2.35rem); line-height:1.15; }
.mantra-explanation p { margin:0 0 17px; }
.mantra-explanation p:last-child { margin-bottom:0; }
.word-meanings { display:grid; gap:10px; margin:22px 0; }
.word-meanings div { display:grid; grid-template-columns:82px 1fr; gap:15px; padding:13px 16px; border-left:3px solid var(--mantra-gold); background:#fff6e7; }
.word-meanings dt { color:#8a4e38; font-weight:700; }
.word-meanings dd { margin:0; }
.mantra-explanation .session-intention { color:#fff8eb; border:0; background:linear-gradient(140deg,var(--mantra-deep),var(--mantra-wine)); }
.session-intention h3 { color:#ffd28a; }
.closing-intention { margin-top:25px!important; padding-top:22px; border-top:1px solid rgba(255,226,177,.25); color:#ffdca2; font-family:"Playfair Display",serif; font-size:1.25rem; }

.mantra-explanation .session-playlist {
  padding:42px 38px;
  border-color:rgba(154,93,64,.2);
  background:linear-gradient(145deg,#fffdf8,#fff2dd);
}
.playlist-kicker {
  margin:0 0 7px!important;
  color:#a75d4b;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.session-playlist>p:not(.playlist-kicker) { color:#725f57; }
.playlist-list {
  display:grid;
  gap:10px;
  margin:27px 0 0;
  padding:0;
  list-style:none;
  counter-reset:playlist;
}
.playlist-list li {
  counter-increment:playlist;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:center;
  gap:12px;
  min-height:72px;
  padding:12px 15px;
  border:1px solid rgba(121,73,59,.12);
  border-radius:15px;
  background:rgba(255,255,255,.72);
}
.playlist-list li::before {
  content:counter(playlist,decimal-leading-zero);
  color:#b36b4f;
  font-family:"Playfair Display",serif;
  font-size:1.05rem;
}
.playlist-list li.has-link { grid-template-columns:38px minmax(0,1fr) auto; }
.playlist-list li>div { display:grid; gap:2px; }
.playlist-list strong { color:#4a302c; font-size:1rem; }
.playlist-list li>div span { color:#806d64; font-size:.9rem; line-height:1.4; }
.playlist-list a {
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:9px 12px;
  border-radius:999px;
  color:#fffaf0;
  background:#8c4540;
  font-size:.78rem;
  font-weight:700;
  line-height:1.2;
  text-decoration:none;
  white-space:nowrap;
  transition:transform .2s ease,background .2s ease;
}
.playlist-list a:hover,.playlist-list a:focus-visible { transform:translateY(-2px); background:#6b3034; }
.playlist-list a:focus-visible { outline:3px solid rgba(230,170,82,.45); outline-offset:2px; }

.meditation-page .mantra-doorway {
  display:grid;
  grid-template-columns:1fr 330px;
  align-items:center;
  gap:75px;
  padding:96px max(6vw,calc((100vw - 1180px)/2));
  background:linear-gradient(135deg,#fff7e7,#f2dcc8);
}
.meditation-page .mantra-doorway>div { max-width:720px; }
.meditation-page .mantra-doorway h2 { color:#3c2926; }
.meditation-page .mantra-doorway h2 em { color:#a45242; }
.meditation-page .mantra-doorway p:not(.eyebrow) { max-width:670px; margin:24px 0 30px; font-size:1.1rem; }
.meditation-page .mantra-doorway figure { margin:0; }
.meditation-page .mantra-doorway img { width:100%; border-radius:165px 165px 22px 22px; box-shadow:0 22px 54px rgba(92,49,38,.18); }

@media(max-width:900px) {
  .mantra-header { color:#fffaf0; }
  .mantra-hero { grid-template-columns:1fr; padding-top:135px; }
  .mantra-hero .mantra-logo-orbit { width:min(520px,86vw); }
  .session-content { grid-template-columns:minmax(250px,330px) minmax(0,1fr); gap:38px; }
  .meditation-page .mantra-doorway { grid-template-columns:1fr 260px; gap:42px; }
}

@media(max-width:650px) {
  .mantra-hero { min-height:auto; padding:125px 20px 70px; }
  .mantra-hero h1 { font-size:3.15rem; }
  .mantra-hero .mantra-logo-orbit { width:min(360px,88vw); }
  .mantra-hero .mantra-logo-orbit .orbit-runner span { padding:6px 9px; font-size:.58rem; letter-spacing:.045em; }
  .mantra-session { padding:75px 20px 90px; }
  .session-heading { margin-bottom:45px; }
  .session-content { grid-template-columns:1fr; }
  .mantra-card { position:static; width:min(100%,390px); margin:0 auto; }
  .mantra-card img { border-radius:150px 150px 24px 24px; }
  .mantra-explanation section { padding:28px 23px; }
  .mantra-explanation .session-playlist { padding:31px 22px; }
  .word-meanings div { grid-template-columns:1fr; gap:2px; }
  .playlist-list li,.playlist-list li.has-link { grid-template-columns:32px minmax(0,1fr); }
  .playlist-list a { grid-column:2; justify-self:start; margin-top:5px; }
  .meditation-page .mantra-doorway { grid-template-columns:1fr; padding:76px 20px; text-align:center; }
  .meditation-page .mantra-doorway p:not(.eyebrow) { margin-right:auto; margin-left:auto; }
  .meditation-page .mantra-doorway figure { width:min(280px,76vw); margin:0 auto; }
}
