/* ===== Seren — Light Minimal Theme ===== */

:root {
  --white: #ffffff;
  --off-white: #f7f8fc;
  --light-gray: #e4e7ef;
  --mid-gray: #6b7280;
  --dark: #111827;
  --accent: #4ecdc4;
  --accent-light: #d0f5f0;
  --accent-dark: #3ab5ad;
  --forest: #0f172a;
  --forest-mid: #1e293b;
  --font-heading: 'Cormorant Garamond', serif;
  --font-body: 'Outfit', sans-serif;
  --max-width: 1140px;
  --transition: 0.3s ease;
  --deep: #0a0a12;
  --ink: #0a0d18;
  --border: rgba(255, 255, 255, 0.08);
  --teal: #4ecdc4;
  --text-bright: #f0eefc;
  --text-muted: rgba(242, 240, 250, 0.55);
  --text-mid: rgba(242, 240, 250, 0.82);

  /* Category palettes — single source of truth (F12) */
  --cat-teal-1: #0d3d4a;
  --cat-teal-2: #1a5568;
  --cat-teal-3: #0f4c5c;
  --cat-teal-orb-1: #06b6d4;
  --cat-teal-orb-2: #22d3ee;

  --cat-green-1: #064e3b;
  --cat-green-2: #065f46;
  --cat-green-3: #047857;
  --cat-green-orb-1: #10b981;
  --cat-green-orb-2: #34d399;

  --cat-purple-1: #1e1b4b;
  --cat-purple-2: #312e81;
  --cat-purple-3: #3730a3;
  --cat-purple-orb-1: #818cf8;
  --cat-purple-orb-2: #a78bfa;

  --cat-amber-1: #451a03;
  --cat-amber-2: #78350f;
  --cat-amber-3: #92400e;
  --cat-amber-orb-1: #f59e0b;
  --cat-amber-orb-2: #fbbf24;
}

/* Reset */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; overscroll-behavior-y: contain; }

body {
  font-family: var(--font-body);
  color: #f0eefc;
  background: #0a0a12;
  line-height: 1.7;
  font-size: 16px;
  /* Light text on dark renders soft under macOS subpixel-AA — force
     grayscale smoothing so nav + small heavy labels stay crisp. */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

a { color: #7c8cf5; text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--accent); }

img { max-width: 100%; display: block; }

.container { max-width: var(--max-width); margin: 0 auto; padding: 0 24px; }

/* Nav rules live in _includes/nav-css.njk (inline <style>) — do not duplicate here */

/* ---- Hero ---- */
.hero {
  padding: 160px 0 100px;
  text-align: center;
  background: transparent;
}
.hero h1 {
  font-size: 3.5rem; font-weight: 700; letter-spacing: -1px;
  margin-bottom: 20px; line-height: 1.15;
}
.hero h1 span { color: var(--accent); }

/* ---- Hero Background Images ---- */
.hero-bg {
  position: relative;
  background-size: cover;
  background-position: center;
}
.hero-bg::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.35) 60%, transparent 100%);
  z-index: 1;
}
.hero-bg::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0;
  height: 120px;
  background: transparent;
  z-index: 1;
}
.hero-bg .container { position: relative; z-index: 2; }
.hero-bg h1, .hero-bg p { color: #fff !important; }
.hero-bg p { opacity: 1 !important; }
.hero-bg h1 span { color: var(--accent-light); }

.hero p {
  font-size: 1.2rem; color: rgba(240,238,252,0.55); max-width: 560px;
  margin: 0 auto 40px;
}

/* ---- Buttons ---- */
.btn {
  display: inline-block; padding: 14px 32px; border-radius: 50px;
  font-family: 'Outfit', sans-serif; font-weight: 600; font-size: 1rem; cursor: pointer;
  transition: all var(--transition); border: none;
}

/* ---- Promo Banner ---- */
.promo-banner {
  background: var(--forest); color: var(--white); text-align: center;
  padding: 10px 16px; font-size: 0.85rem; font-weight: 500;
}
.promo-banner a {
  color: var(--accent-light); text-decoration: underline; margin-left: 8px;
}
.promo-banner a:hover { color: var(--white); }

/* ---- Newsletter ---- */
.newsletter-form {
  display: flex; gap: 8px; margin-top: 12px;
}
.newsletter-form input {
  flex: 1; padding: 10px 14px; border-radius: 50px;
  border: 1px solid rgba(255,255,255,0.2); background: rgba(255,255,255,0.1);
  color: var(--white); font-size: 0.85rem; font-family: var(--font-body);
}
.newsletter-form input::placeholder { color: rgba(255,255,255,0.4); }
.newsletter-form input:focus { outline: none; border-color: var(--accent); }
.newsletter-form button {
  padding: 10px 20px; border-radius: 50px; border: none;
  background: var(--accent); color: var(--white); font-weight: 600;
  font-size: 0.85rem; cursor: pointer; transition: background var(--transition);
}
.newsletter-form button:hover { background: var(--accent-dark); }

/* ---- Daily Quote ---- */
.daily-quote {
  text-align: center; padding: 60px 24px;
  background: transparent; border-top: none;
  border-bottom: none;
}
.daily-quote blockquote {
  font-size: 1.4rem; color: #f0eefc;
  max-width: 640px; margin: 0 auto 12px; line-height: 1.6;
}
.daily-quote cite {
  font-size: 0.9rem; color: rgba(240,238,252,0.5); font-style: normal;
}
.btn-primary {
  background: var(--accent); color: var(--white);
}
.btn-primary:hover { background: var(--accent-dark); color: var(--white); }
.btn-outline {
  background: transparent; border: 2px solid var(--accent);
  color: var(--accent-dark);
}
.btn-outline:hover { background: var(--accent); color: var(--white); }
.btn-group { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

/* ---- Sections ---- */
section { padding: 100px 0; }

.section-header {
  text-align: center; margin-bottom: 60px;
}
.section-header h2 {
  font-size: 2.2rem; font-weight: 700; margin-bottom: 12px; color: #f0eefc;
}
.section-header p {
  color: rgba(240,238,252,0.55); font-size: 1.05rem; max-width: 520px; margin: 0 auto;
}

/* ---- Feature Grid ---- */
.feature-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px;
}
.feature-card {
  background: transparent; border-radius: 12px; padding: 40px 32px;
  border: none;
  transition: transform var(--transition);
}
.feature-card:hover {
  transform: translateY(-2px);
}
.feature-icon {
  width: 56px; height: 56px; background: rgba(124,108,240,0.12);
  border-radius: 14px; display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem; margin-bottom: 20px;
}
.feature-icon svg {
  width: 28px; height: 28px; stroke-width: 1.75;
}
.feature-accent {
  width: 32px; height: 3px; background: var(--accent);
  border-radius: 2px; margin-bottom: 20px;
}
.feature-card h3 { font-size: 1.2rem; margin-bottom: 10px; color: #f0eefc; }
.feature-card p { color: rgba(240,238,252,0.55); font-size: 0.95rem; }

/* ---- App Download ---- */
.app-section { text-align: center; }
.store-badges { display: flex; gap: 16px; justify-content: center; margin-top: 32px; }
.store-badge {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--dark); color: var(--white); padding: 14px 28px;
  border-radius: 10px; font-size: 0.95rem; font-weight: 500;
  transition: background var(--transition);
}
.store-badge:hover { background: #343a40; color: var(--white); }
.store-badge .badge-icon { font-size: 1.5rem; }

/* ---- Video Grid ---- */
.video-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px;
}
.video-card {
  border-radius: 12px; overflow: hidden;
  border: none;
  background: transparent;
}
.video-card iframe {
  width: 100%; aspect-ratio: 16/9; border: none; display: block;
}
.video-card .video-info { padding: 20px; }
.video-card h3 { font-size: 1.05rem; margin-bottom: 6px; }
.video-card p { color: var(--mid-gray); font-size: 0.9rem; }

/* ---- Testimonials ---- */
.testimonial-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px;
}
.testimonial {
  background: transparent; border: none;
  border-radius: 12px; padding: 32px;
}
.testimonial p { margin-bottom: 16px; color: rgba(255,255,255,0.9); }
.testimonial .author { font-weight: 600; font-size: 0.9rem; color: var(--mid-gray); }

/* ---- Contact Form ---- */
.contact-form {
  max-width: 600px; margin: 0 auto;
}
.form-group { margin-bottom: 24px; }
.form-group label {
  display: block; font-weight: 600; font-size: 0.9rem;
  margin-bottom: 8px; color: #f0eefc;
}
.form-group input,
.form-group textarea,
.form-group select {
  width: 100%; padding: 14px 16px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.1); font-size: 1rem;
  font-family: var(--font-body); transition: border-color var(--transition);
  background: rgba(255,255,255,0.06); color: #f0eefc;
}
.form-group input:focus,
.form-group textarea:focus {
  outline: none; border-color: var(--accent);
}
.form-group textarea { resize: vertical; min-height: 140px; }

/* ---- CTA Banner ---- */
.cta-banner {
  background: rgba(255,255,255,0.03) !important;
  border-top: 1px solid rgba(255,255,255,0.06);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  color: #f0eefc; text-align: center; padding: 80px 0;
}
.cta-banner h2 { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 2rem; margin-bottom: 12px; }
.cta-banner p { font-family: 'Outfit', sans-serif; opacity: 0.9; margin-bottom: 32px; font-size: 1.1rem; }
.cta-banner .btn { background: #f0eefc; color: var(--accent); }
.cta-banner .btn:hover { background: rgba(240,238,252,0.85); }

/* ---- Footer ---- */
.hb-footer{border-top:1px solid rgba(255,255,255,0.08);padding:72px 24px 46px;position:relative;background:rgba(6,8,16,0.97);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.hb-footer__inner{max-width:1260px;margin:0 auto;display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:56px}
.hb-footer__brand{display:flex;flex-direction:column;gap:14px}
.hb-footer__logo{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:1.5rem;color:var(--text-bright);letter-spacing:.02em}
.hb-footer__tagline{font-weight:300;font-size:0.88rem;line-height:1.55;color:rgba(242,240,250,.72);max-width:330px}
.hb-footer__col-title{font-weight:600;font-size:0.72rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(242,240,250,.68);margin-bottom:14px}
.hb-footer__links{list-style:none;display:flex;flex-direction:column;gap:12px}
.hb-footer__links a{font-weight:300;font-size:0.88rem;line-height:1.35;color:rgba(242,240,250,.7);text-decoration:none;transition:color .2s ease}
.hb-footer__links a:hover{color:var(--teal)}
.hb-footer__live-link{display:inline-flex;align-items:center;gap:10px;width:fit-content;margin-top:2px;padding:9px 12px 9px 10px;border:1px solid rgba(78,205,196,0.28);border-radius:999px;background:rgba(78,205,196,0.07);color:#f0eefc;text-decoration:none;font-family:'Outfit',sans-serif;font-size:0.84rem;font-weight:500;line-height:1;letter-spacing:0.01em;transition:background .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease}
.hb-footer__live-link:hover{background:rgba(78,205,196,0.12);border-color:rgba(78,205,196,0.48);box-shadow:0 10px 24px rgba(0,0,0,0.22);transform:translateY(-1px)}
.hb-footer__live-status{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:999px;background:rgba(78,205,196,0.14);color:#4ecdc4;font-size:0.66rem;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;white-space:nowrap}
.nav-live-dot{width:7px;height:7px;border-radius:50%;background:#4ecdc4;box-shadow:0 0 0 0 rgba(78,205,196,0.65),0 0 12px rgba(78,205,196,0.65);animation:livePulse 1.8s ease-out infinite;flex:0 0 7px}
.hb-footer__bottom{max-width:1260px;margin:40px auto 0;padding-top:28px;border-top:1px solid rgba(255,255,255,0.08);display:flex;justify-content:space-between;align-items:center}
.hb-footer__copy{font-weight:300;font-size:0.78rem;color:rgba(255,255,255,0.48)}
.hb-footer__back-top{font-weight:400;font-size:0.8rem;color:rgba(242,240,250,.62);text-decoration:none;display:flex;align-items:center;gap:8px;transition:color .2s ease}
.hb-footer__back-top:hover{color:var(--teal)}
.hb-footer__back-top svg{width:12px;height:12px;fill:currentColor}
.hb-footer__social{display:flex;gap:12px;margin-top:16px}
.hb-footer__social-link{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:rgba(242,240,250,0.5);transition:all 0.3s ease}
.hb-footer__social-link:hover{border-color:rgba(78,205,196,0.3);background:rgba(78,205,196,0.08);color:#4ecdc4;transform:translateY(-2px)}
@keyframes livePulse{0%{box-shadow:0 0 0 0 rgba(78,205,196,0.55),0 0 12px rgba(78,205,196,0.55)}70%{box-shadow:0 0 0 7px rgba(78,205,196,0),0 0 12px rgba(78,205,196,0.42)}100%{box-shadow:0 0 0 0 rgba(78,205,196,0),0 0 12px rgba(78,205,196,0.5)}}
.footer-app-badge{display:inline-flex;align-items:center;gap:12px;margin-top:16px;padding:13px 23px 13px 18px;border-radius:12px;border:1.5px solid rgba(255,255,255,0.28);background:rgba(255,255,255,0.09);color:#fff;text-decoration:none;transition:all .3s ease;width:fit-content}
.footer-app-badge:hover{border-color:rgba(255,255,255,0.5);background:rgba(255,255,255,0.14);transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,0.3)}
.footer-app-badge svg{flex-shrink:0}
.footer-app-badge__text{display:flex;flex-direction:column;line-height:1.2;font-weight:500;font-size:1.08rem;letter-spacing:.01em}
.footer-app-badge__text small{font-size:.68rem;font-weight:300;letter-spacing:.04em;opacity:0.85}
.footer-app-badge--android{opacity:0.5;cursor:default;pointer-events:none;margin-top:8px}
.footer-disclaimer {
  text-align: center; font-size: 0.72rem; line-height: 1.55;
  color: rgba(255,255,255,0.5); max-width: 720px; margin: 0 auto 24px;
  padding-top: 24px; border-top: 1px solid rgba(255,255,255,0.08);
}

/* ---- Volume Controls Row (narrator + ambient, below scrub bar) ---- */
.vol-row{display:flex;flex-direction:column;gap:24px;margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,0.05)}
.vol-row__heading{font-family:'Cormorant',serif;font-size:0.95rem;color:rgba(255,255,255,0.55);letter-spacing:0.04em;text-align:center;margin-bottom:-8px}
.vol-row__control{display:flex;align-items:center;gap:10px;min-height:44px}
.vol-row__icon{flex-shrink:0;fill:none;stroke:rgba(255,255,255,0.4);stroke-width:1.5}
.vol-row__label{flex-shrink:0;font-size:0.72rem;color:rgba(255,255,255,0.45);letter-spacing:0.03em;min-width:62px;font-family:'Outfit',sans-serif}
.vol-row__slider{flex:1;position:relative;height:44px;display:flex;align-items:center;cursor:pointer}
.vol-row__slider::before{content:'';position:absolute;left:0;right:0;height:6px;background:rgba(255,255,255,0.1);border-radius:3px;top:50%;transform:translateY(-50%)}
.vol-row__slider--disabled{opacity:0.3;cursor:default;pointer-events:none}
.vol-row__fill{position:absolute;left:0;height:6px;background:#4ecdc4;border-radius:3px;top:50%;transform:translateY(-50%);width:50%;pointer-events:none;z-index:1}
.vol-row__thumb{position:absolute;top:50%;transform:translate(-50%,-50%);width:22px;height:22px;background:#4ecdc4;border-radius:50%;left:50%;opacity:0.5;transition:opacity .15s;pointer-events:none;box-shadow:0 0 8px rgba(78,205,196,0.5);z-index:1}
.vol-row__slider:hover .vol-row__thumb,.vol-row__slider.active .vol-row__thumb{opacity:1}
.vol-row__toggle{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:none;border:1px solid rgba(255,255,255,0.12);cursor:pointer;color:rgba(255,255,255,0.4);flex-shrink:0;transition:all 0.2s;padding:0;position:relative;touch-action:manipulation}
.vol-row__toggle::after{content:'';position:absolute;inset:-8px;border-radius:50%}
.vol-row__toggle--on{color:#4ecdc4;border-color:rgba(78,205,196,0.3)}
.vol-row__toggle:hover{border-color:rgba(78,205,196,0.5)}
.vol-row__toggle svg{width:14px;height:14px;fill:currentColor}
/* Range input: transparent via colors (NOT opacity:0 — iOS Safari excludes opacity:0 from hit testing).
   fill/thumb divs sit above (z-index:1) as pure visuals; pointer-events:none on them lets
   touches pass through to this element. */
.vol-row__range{position:absolute;inset:0;width:100%;height:100%;cursor:pointer;margin:0;z-index:0;-webkit-appearance:none;appearance:none;background:transparent;border:none;outline:none}
.vol-row__range::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;background:transparent;box-shadow:none;border:none}
.vol-row__range::-webkit-slider-runnable-track{background:transparent;border:none;height:6px}
.vol-row__range::-moz-range-thumb{background:transparent;border:none;width:22px;height:22px}
.vol-row__range::-moz-range-track{background:transparent;border:none}
.speed-value{flex-shrink:0;font-size:0.72rem;color:rgba(255,255,255,0.55);letter-spacing:0.02em;min-width:38px;text-align:right;font-family:'Outfit',sans-serif;font-variant-numeric:tabular-nums}
.sleep-timer__options{display:flex;gap:6px;flex:1}
.sleep-timer__btn{padding:6px 12px;border-radius:20px;border:1px solid rgba(255,255,255,0.1);background:none;color:rgba(255,255,255,0.4);font-size:0.68rem;font-family:'Outfit',sans-serif;cursor:pointer;transition:all 0.2s;letter-spacing:0.02em}
.sleep-timer__btn:hover{border-color:rgba(78,205,196,0.4);color:rgba(255,255,255,0.7)}
.sleep-timer__btn--active{background:rgba(78,205,196,0.15);border-color:rgba(78,205,196,0.4);color:#4ecdc4}
.sleep-timer__countdown{flex-shrink:0;font-size:0.72rem;color:rgba(78,205,196,0.7);font-family:'Outfit',sans-serif;font-variant-numeric:tabular-nums;min-width:38px;text-align:right;display:none}

/* ---- Custom Player Scrub Bar (single source of truth) ---- */
.custom-player{display:flex;align-items:center;gap:10px;padding:0}
.cp-play{width:36px;height:36px;border-radius:50%;background:rgba(78,205,196,0.1);border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:all .25s;color:#4ecdc4}
.cp-play:hover{background:rgba(78,205,196,0.2);transform:scale(1.05)}
.cp-seek{flex:1;min-width:0;position:relative;height:44px;display:flex;align-items:center;cursor:pointer;touch-action:none}
.cp-seek::before{content:'';position:absolute;left:0;right:0;height:4px;background:rgba(255,255,255,0.1);border-radius:2px;top:50%;transform:translateY(-50%)}
.cp-seek__fill{position:absolute;left:0;height:4px;background:#4ecdc4;border-radius:2px;top:50%;transform:translateY(-50%);width:0%;pointer-events:none}
.cp-seek__thumb{position:absolute;top:50%;transform:translate(-50%,-50%);width:3px;height:28px;background:#4ecdc4;border-radius:2px;left:0%;opacity:0;transition:opacity .15s;pointer-events:none;box-shadow:0 0 6px rgba(78,205,196,0.5)}
.cp-seek__thumb::before{content:'';position:absolute;top:-4px;left:50%;transform:translateX(-50%);width:14px;height:14px;background:#4ecdc4;border-radius:50%;box-shadow:0 0 8px rgba(78,205,196,0.6)}
.cp-seek:hover .cp-seek__thumb,.cp-seek.active .cp-seek__thumb{opacity:1}
.cp-time{font-size:.65rem;color:var(--text-muted);white-space:nowrap;font-variant-numeric:tabular-nums;font-family:'Outfit',sans-serif;flex-shrink:0;opacity:0.7}



/* ---- Filter Bar ---- */
.filter-bar {
  display: flex; gap: 8px; flex-wrap: wrap; justify-content: center;
}
.filter-btn {
  padding: 8px 20px; border-radius: 50px; border: 1px solid rgba(255,255,255,0.08);
  background: transparent; color: rgba(240,238,252,0.5); font-size: 0.9rem;
  font-weight: 500; cursor: pointer; transition: all var(--transition);
  font-family: var(--font-body);
}
.filter-btn:hover { border-color: rgba(124,108,240,0.4); color: #f0eefc; }
.filter-btn.active {
  background: var(--accent); color: var(--white); border-color: var(--accent);
}

/* ---- Sessions Grid ---- */
.sessions-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px;
}
.session-card {
  background: transparent; border-radius: 12px; overflow: hidden;
  border: none;
  transition: transform var(--transition);
}
.session-card:hover {
  transform: translateY(-2px);
}
.session-thumb {
  height: 120px; display: flex; align-items: center; justify-content: center;
  position: relative; overflow: hidden; border-radius: 8px;
}
.session-thumb::before {
  content: ''; position: absolute; inset: 0;
  background: rgba(0,0,0,0.3);
  pointer-events: none; transition: background 0.3s ease;
}
.session-card:hover .session-thumb::before {
  background: rgba(0,0,0,0.4);
}
.session-thumb::after {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(255,255,255,0.95);
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='%234f6df5'%3E%3Cpolygon points='5 3 19 12 5 21 5 3'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 55% 50%;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}
.session-emoji { display: none; }
.session-badge {
  position: absolute; top: 12px; right: 12px; padding: 4px 12px;
  border-radius: 50px; font-size: 0.75rem; font-weight: 600;
}
.badge-free { background: var(--accent); color: var(--white); }
.badge-locked { background: rgba(0,0,0,0.5); color: var(--white); }
.session-info { padding: 20px; }
.session-info h3 { font-size: 1.1rem; margin-bottom: 6px; color: #f0eefc; }
.session-meta {
  display: flex; gap: 12px; font-size: 0.8rem; color: rgba(240,238,252,0.4);
  margin-bottom: 8px;
}
.session-info p { color: rgba(240,238,252,0.55); font-size: 0.9rem; }
.session-locked { opacity: 0.75; }

/* ---- Sound Grid ---- */
.sound-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px;
}
.sound-card {
  background: rgba(0, 0, 0, 0.6); border-radius: 12px; padding: 24px;
  border: none; text-align: center;
  transition: transform var(--transition);
  position: relative;
}
.sound-card:hover {
  transform: translateY(-2px);
}
.sound-icon { display: none; }
.sound-scene {
  width: 100%; height: 140px; border-radius: 10px;
  display: flex; align-items: flex-end; justify-content: flex-start;
  padding: 16px; margin-bottom: 12px;
  background-size: cover; position: relative; overflow: hidden;
}
.sound-title {
  color: #fff; font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.25rem; font-weight: 700; text-shadow: 0 2px 12px rgba(0,0,0,0.5);
  line-height: 1.2;
}
.sound-meta {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 4px;
}
.sound-card h3 { font-size: 1rem; margin-bottom: 6px; color: #f0eefc; }
.sound-category-tag {
  display: inline-block; font-size: 0.75rem; color: var(--mid-gray);
  background: transparent; padding: 2px 10px; border-radius: 50px;
}
.sound-locked { opacity: 0.7; }
.sound-lock-overlay {
  margin-top: 12px; display: flex; flex-direction: column; align-items: center;
}
.sound-lock-overlay > span { font-size: 1.5rem; }

/* ---- Lock Badge ---- */
.lock-badge {
  position: absolute; top: 12px; right: 12px;
  background: rgba(255,255,255,0.95);
  padding: 8px 12px;
  border-radius: 20px;
  font-size: 0.7rem;
  font-weight: 700;
  display: flex; align-items: center; gap: 6px;
  justify-content: center; z-index: 2;
  box-shadow: 0 2px 8px rgba(0,0,0,0.25);
  color: #1a1a2e;
}
.lock-badge svg { stroke: #b8860b; width: 14px; height: 14px; }

/* ---- Animations ---- */
.fade-in {
  opacity: 0; transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.fade-in.visible { opacity: 1; transform: translateY(0); }

/* ---- Responsive ---- */
@media (max-width: 768px) {
  /* -- All inline grids stack on mobile -- */
  [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }

  /* -- Class-based grids -- */
  .feature-grid, .testimonial-grid { grid-template-columns: 1fr !important; }
  .video-grid { grid-template-columns: 1fr; }
  .sessions-grid { grid-template-columns: 1fr; }
  .sound-grid { grid-template-columns: 1fr; }
  .stats-bar { grid-template-columns: repeat(2, 1fr) !important; gap: 20px !important; }
  .research-grid { grid-template-columns: 1fr !important; }
  .lifestyle-grid { grid-template-columns: 1fr !important; }

  /* -- Hero sections -- */
  section[style*="min-height"] {
    min-height: 260px !important;
  }
  h1[style*="font-size"] {
    font-size: 2rem !important;
  }
  h2[style*="font-size"] {
    font-size: 1.5rem !important;
  }
  .hero h1 { font-size: 2.2rem; }
  .hero { padding: 120px 0 60px; }

  /* -- Section spacing -- */
  section { padding: 60px 0; }
  .section-header { margin-bottom: 32px; }
  .section-header h2 { font-size: 1.6rem; }

  /* -- CTA banner -- */
  .cta-banner h2 { font-size: 1.5rem; }
  .cta-banner p { font-size: 0.95rem; }
  .cta-banner .btn { width: 100%; max-width: 280px; }

  /* -- Footer -- */
  .hb-footer__inner { grid-template-columns: repeat(2, 1fr); }
  .hb-footer__bottom { flex-direction: column; gap: 12px; text-align: center; }
  .newsletter-form { flex-direction: column; }
  .newsletter-form input { width: 100%; }
  .newsletter-form button { width: 100%; }

  /* -- Paragraphs with large inline font -- */
  p[style*="font-size:1.1"],
  p[style*="font-size:1.15"],
  p[style*="font-size: 1.1"],
  p[style*="font-size: 1.15"] {
    font-size: 1rem !important;
  }
}

/* -- Small phones -- */
@media (max-width: 480px) {
  .container { padding: 0 16px; }
  section[style*="min-height"] { min-height: 220px !important; }
  h1[style*="font-size"] { font-size: 1.7rem !important; }
  .hero h1 { font-size: 1.8rem; }
  .section-header h2 { font-size: 1.4rem; }
  .stats-bar { grid-template-columns: 1fr !important; }
  .lifestyle-grid { grid-template-columns: 1fr !important; }
  .hb-footer__inner { grid-template-columns: 1fr 1fr; gap: 32px 24px; }
  .hb-footer__brand { grid-column: 1 / -1; }
}

/* ═══ ARTICLE PAGES ═══ */
.hero{position:relative;padding:120px 24px 60px;text-align:center;overflow:hidden}
.hero::before{content:'';position:absolute;inset:0;background:linear-gradient(145deg, #1e1b4b 0%, #312e81 40%, #3730a3 100%);opacity:.6;z-index:0}
.hero::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,transparent 60%,var(--deep) 100%);z-index:1;pointer-events:none}
.hero__orb{position:absolute;width:300px;height:300px;border-radius:50%;background:rgba(167,139,250,0.12);filter:blur(80px);top:-60px;left:50%;transform:translateX(-50%);z-index:0;pointer-events:none}
.hero__inner{position:relative;z-index:2;max-width:680px;margin:0 auto}
.hero__back{display:flex;width:fit-content;margin:0 auto 20px;align-items:center;gap:6px;font-weight:400;font-size:.78rem;color:rgba(201,188,255,0.92);text-decoration:none;position:relative;z-index:3;transition:color .3s ease}
.hero__back:hover{color:#fff}
.hero__back svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.75}
.hero__topic{display:inline-flex;align-items:center;gap:8px;font-weight:400;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(167,139,250,0.7);padding:5px 14px;border-radius:20px;border:1px solid rgba(167,139,250,0.15);background:rgba(167,139,250,0.06);margin-bottom:16px;position:relative;z-index:3}
.hero__meta{font-weight:300;font-size:.76rem;color:rgba(255,255,255,0.35);margin-bottom:14px}
.hero h1{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(1.8rem,4.5vw,2.8rem);line-height:1.2;margin-bottom:16px}
.hero__desc{font-weight:200;font-size:.92rem;color:var(--text-muted);line-height:1.8;max-width:580px;margin:0 auto}
.art{max-width:680px;margin:0 auto;padding:48px 24px 60px}
.art__block{margin-bottom:36px}
.art__subhead{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1.2rem;line-height:1.35;margin-bottom:10px;color:var(--text-bright)}
.art__para{font-weight:400;font-size:.95rem;line-height:1.85;color:var(--text-mid)}
.art-nav{display:flex;gap:16px;max-width:680px;margin:0 auto;padding:0 24px 80px}
.art-nav__link{flex:1;padding:20px;border-radius:14px;background:var(--ink);border:1px solid var(--border);text-decoration:none;color:#fff;transition:border-color .3s ease,transform .3s ease}
.art-nav__link:hover{border-color:rgba(167,139,250,0.2);transform:translateY(-2px)}
.art-nav__link--next{text-align:right}
.art-nav__dir{display:block;font-weight:300;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(167,139,250,0.5);margin-bottom:6px}
.art-nav__title{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1rem;line-height:1.3;color:var(--text-mid)}
.back-learn{text-align:center;padding:0 24px 80px}
.back-learn a{display:inline-flex;align-items:center;gap:8px;font-weight:300;font-size:.78rem;color:rgba(167,139,250,0.5);text-decoration:none;padding:10px 20px;border-radius:40px;border:1px solid var(--border);transition:all .3s ease}
.back-learn a:hover{color:rgba(167,139,250,0.8);border-color:rgba(167,139,250,0.2)}
.back-learn a svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5}
@media(max-width:600px){
  .art-nav{flex-direction:column}
  .art-nav__link--next{text-align:left}
}
.art-disclaimer{max-width:680px;margin:0 auto;padding:0 24px 40px}
.art-disclaimer__inner{background:var(--ink);border:1px solid var(--border);border-radius:12px;padding:20px 24px}
.art-disclaimer__title{font-weight:400;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px}
.art-disclaimer__text{font-weight:200;font-size:.74rem;line-height:1.65;color:rgba(242,240,250,0.3)}
.art-references{max-width:680px;margin:0 auto;padding:0 24px 40px}
.art-references__title{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1rem;color:var(--text-bright);margin-bottom:14px}
.art-ref{font-weight:200;font-size:.74rem;line-height:1.65;color:var(--text-muted);margin-bottom:8px;padding-left:20px;text-indent:-20px}
.art-ref em{font-style:normal;color:var(--text-mid)}
.art-cta{max-width:680px;margin:0 auto;padding:8px 24px 32px}
.art-cta__kicker{display:block;font-weight:300;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(167,139,250,0.5);margin-bottom:10px}
.art-cta__link{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;border-radius:14px;background:var(--ink);border:1px solid rgba(167,139,250,0.18);text-decoration:none;transition:border-color .3s ease,transform .3s ease}
.art-cta__link:hover{border-color:rgba(167,139,250,0.4);transform:translateY(-2px)}
.art-cta__label{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1.15rem;color:var(--text-bright)}
.art-cta__arrow{color:rgba(167,139,250,0.8);font-size:1.1rem;flex-shrink:0}
.art-subscribe{max-width:680px;margin:0 auto;padding:0 24px 44px;text-align:center}
.art-subscribe__pill{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 26px;border-radius:40px;background:#4ecdc4;color:#060810;font-family:'Outfit',sans-serif;font-weight:500;font-size:.85rem;letter-spacing:.01em;text-decoration:none;transition:all .3s ease}
.art-subscribe__pill:hover{background:#5ed8d0;transform:translateY(-1px);box-shadow:0 4px 16px rgba(78,205,196,0.25)}

/* ═══ NEW ARTICLE STRUCTURE (Applied Psychology v2) ═══ */
/* Covers .article + .ax-article variants used by the post-Feb-2026 articles. */

/* Hero variants used by the new articles */
.hero__orb--1{left:30%;top:-80px}
.hero__orb--2{left:auto;right:18%;top:30%;background:rgba(78,205,196,0.10)}
.ax-hero{position:relative;padding:120px 24px 60px;text-align:center;overflow:hidden}
.ax-hero::before{content:'';position:absolute;inset:0;background:linear-gradient(145deg, #1e1b4b 0%, #312e81 40%, #3730a3 100%);opacity:.6;z-index:0}
.ax-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,transparent 60%,var(--deep) 100%);z-index:1;pointer-events:none}
.ax-hero > *{position:relative;z-index:2}
.ax-hero__orb{position:absolute;width:300px;height:300px;border-radius:50%;background:rgba(167,139,250,0.12);filter:blur(80px);top:-60px;left:50%;transform:translateX(-50%);z-index:0;pointer-events:none}
.ax-hero__orb--1{left:25%}
.ax-hero__orb--2{left:auto;right:15%;top:25%;background:rgba(78,205,196,0.10)}
.ax-hero__back{display:flex;width:fit-content;margin:0 auto 20px;align-items:center;gap:6px;font-weight:400;font-size:.78rem;color:rgba(201,188,255,0.92);text-decoration:none;position:relative;z-index:3;transition:color .3s ease}
.ax-hero__back:hover{color:#fff}
.ax-hero__back svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.75}
.ax-hero__topic{display:inline-flex;align-items:center;gap:8px;font-weight:400;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(167,139,250,0.7);padding:5px 14px;border-radius:20px;border:1px solid rgba(167,139,250,0.15);background:rgba(167,139,250,0.06);margin-bottom:16px;position:relative;z-index:3}
.ax-hero__meta{font-weight:300;font-size:.76rem;color:rgba(255,255,255,0.35);margin-top:14px}
.ax-hero h1{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(1.8rem,4.5vw,2.8rem);line-height:1.2;margin-bottom:16px;max-width:680px;margin-left:auto;margin-right:auto}

/* Article body container */
.article, .ax-article{max-width:680px;margin:0 auto;padding:48px 24px 60px;font-family:'Outfit',sans-serif}
.article > p, .ax-article > p{font-weight:400;font-size:.95rem;line-height:1.85;color:var(--text-mid);margin-bottom:18px}
.article > h2, .ax-article > h2{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1.55rem;line-height:1.3;margin:40px 0 16px;color:var(--text-bright)}
.article > h3, .ax-article > h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1.2rem;line-height:1.35;margin:28px 0 12px;color:var(--text-bright)}
.article em, .ax-article em{font-style:italic;color:var(--text-bright)}
.article strong, .ax-article strong{font-weight:500;color:var(--text-bright)}
.article a, .ax-article a{color:var(--teal);text-decoration:underline;text-decoration-color:rgba(78,205,196,0.4);text-underline-offset:3px;transition:text-decoration-color .3s ease}
.article a:hover, .ax-article a:hover{text-decoration-color:var(--teal)}

.lede, .ax-lede{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:1.15rem;line-height:1.7;color:var(--text-bright);margin-bottom:36px;border-left:2px solid rgba(167,139,250,0.3);padding-left:20px}

/* Cite-box — researcher / study quote */
.cite-box, .ax-cite-box{display:flex;gap:16px;background:var(--ink);border:1px solid rgba(167,139,250,0.12);border-radius:14px;padding:20px 24px;margin:28px 0}
.cite-box__icon, .ax-cite-box__icon{flex-shrink:0;width:32px;height:32px;border-radius:50%;background:rgba(167,139,250,0.08);display:flex;align-items:center;justify-content:center;color:rgba(167,139,250,0.7)}
.cite-box__icon svg, .ax-cite-box__icon svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5}
.cite-box__text, .ax-cite-box__text{font-weight:300;font-size:.86rem;line-height:1.7;color:var(--text-mid)}
.cite-box__text strong, .ax-cite-box__text strong{color:var(--text-bright);font-weight:500}
.cite-box__text em, .ax-cite-box__text em{color:var(--text-bright)}

/* Concept — key concept callout */
.concept, .ax-concept{background:rgba(78,205,196,0.04);border:1px solid rgba(78,205,196,0.14);border-radius:14px;padding:22px 24px;margin:28px 0}
.concept__label, .ax-concept__label{display:block;font-weight:400;font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;color:var(--teal);margin-bottom:10px;opacity:.7}
.concept p, .ax-concept p{font-weight:300;font-size:.88rem;line-height:1.7;color:var(--text-mid);margin-bottom:0}

/* Pull quote */
.pull, .ax-pull{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:1.4rem;line-height:1.5;color:var(--text-bright);text-align:center;padding:40px 24px;margin:32px 0;border-top:1px solid rgba(255,255,255,0.06);border-bottom:1px solid rgba(255,255,255,0.06)}
.pull p, .ax-pull p{font-size:inherit;color:inherit;margin-bottom:0;font-family:inherit;font-weight:inherit;line-height:inherit}
.pull cite, .ax-pull cite{display:block;font-family:'Outfit',sans-serif;font-style:normal;font-weight:300;font-size:.74rem;color:var(--text-muted);margin-top:14px;letter-spacing:.04em}

/* Try today */
.try, .ax-try{background:linear-gradient(145deg, rgba(78,205,196,0.06), rgba(167,139,250,0.04));border:1px solid rgba(78,205,196,0.18);border-radius:18px;padding:28px 28px 32px;margin:36px 0}
.try__label, .ax-try__label{display:block;font-weight:400;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--teal);margin-bottom:8px}
.try__title, .ax-try__title{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1.3rem;line-height:1.3;color:var(--text-bright);margin-bottom:18px}
.try ol.steps{list-style:none;counter-reset:step;padding:0;margin:0}
.steps{list-style:none;padding:0;margin:0}
.steps li{counter-increment:step;display:flex;gap:14px;margin-bottom:14px;align-items:flex-start}
.steps li::before{content:counter(step);flex-shrink:0;width:24px;height:24px;border-radius:50%;background:rgba(78,205,196,0.12);color:var(--teal);font-weight:500;font-size:.78rem;display:flex;align-items:center;justify-content:center;margin-top:2px}
.steps__text{font-weight:300;font-size:.86rem;line-height:1.7;color:var(--text-mid)}
.steps__text strong{color:var(--text-bright);font-weight:500}
.ax-try__item{display:flex;gap:14px;margin-bottom:14px;align-items:flex-start}
.ax-try__num{flex-shrink:0;width:24px;height:24px;border-radius:50%;background:rgba(78,205,196,0.12);color:var(--teal);font-weight:500;font-size:.78rem;display:flex;align-items:center;justify-content:center;margin-top:2px}
.ax-try__text{font-weight:300;font-size:.86rem;line-height:1.7;color:var(--text-mid)}
.ax-try__text strong{color:var(--text-bright);font-weight:500}

/* Narrative — alternative-story rewrite */
.narrative{background:var(--ink);border:1px solid rgba(255,255,255,0.06);border-radius:14px;padding:22px 24px;margin:24px 0}
.narrative__label{display:block;font-weight:400;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px}
.narrative__before{font-weight:300;font-size:.88rem;line-height:1.65;color:rgba(244,114,182,0.85);font-style:italic;border-left:2px solid rgba(244,114,182,0.3);padding-left:14px}
.narrative__after{font-weight:300;font-size:.88rem;line-height:1.65;color:rgba(78,205,196,0.95);font-style:italic;border-left:2px solid rgba(78,205,196,0.4);padding-left:14px}

/* Domain (post-traumatic-growth) */
.domain{background:var(--ink);border:1px solid rgba(255,255,255,0.06);border-radius:14px;padding:22px 24px;margin:18px 0}
.domain__name{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1.05rem;color:var(--text-bright);margin-bottom:8px}
.domain__desc{font-weight:300;font-size:.86rem;line-height:1.65;color:var(--text-mid)}

/* Distortion (cognitive-distortions) */
.distortion{background:var(--ink);border:1px solid rgba(251,191,36,0.12);border-radius:14px;padding:22px 24px;margin:18px 0}
.distortion__name{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1.05rem;color:rgba(251,191,36,0.85);margin-bottom:8px}
.distortion__def{font-weight:300;font-size:.86rem;line-height:1.65;color:var(--text-mid);margin-bottom:10px}
.distortion__example{font-weight:300;font-size:.82rem;line-height:1.6;color:rgba(244,114,182,0.7);font-style:italic;padding-top:8px;border-top:1px solid rgba(255,255,255,0.06)}

/* Spectrum (emotional-granularity) */
.spectrum{background:var(--ink);border:1px solid rgba(255,255,255,0.06);border-radius:14px;padding:22px 24px;margin:18px 0}
.spectrum__label{display:block;font-weight:400;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);margin-bottom:10px}
.spectrum__row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.spectrum__word{font-weight:300;font-size:.82rem;padding:4px 12px;border-radius:20px;background:rgba(167,139,250,0.06);border:1px solid rgba(167,139,250,0.12);color:var(--text-mid)}

/* Horseman (gottman-ratio) */
.horseman{background:var(--ink);border:1px solid rgba(244,114,182,0.12);border-radius:14px;padding:22px 24px;margin:18px 0}
.horseman__name{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1.05rem;color:rgba(244,114,182,0.85);margin-bottom:8px}
.horseman__desc{font-weight:300;font-size:.86rem;line-height:1.65;color:var(--text-mid);margin-bottom:10px}
.horseman__antidote{font-weight:300;font-size:.82rem;color:var(--teal);padding-top:10px;border-top:1px solid rgba(255,255,255,0.06)}

/* Signal (learned-helplessness) */
.signal{background:var(--ink);border:1px solid rgba(255,255,255,0.06);border-radius:14px;padding:22px 24px;margin:18px 0}
.signal__phrase{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1rem;color:var(--text-bright);margin-bottom:6px}
.signal__meaning{font-weight:300;font-size:.84rem;line-height:1.65;color:var(--text-mid)}

/* Contrast (motivation-overrated) */
.contrast{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,0.06);border-radius:14px;overflow:hidden;margin:24px 0}
.contrast__side{background:var(--ink);padding:22px 24px}
.contrast__label{display:block;font-weight:400;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;margin-bottom:8px}
.contrast__label--weak{color:rgba(244,114,182,0.7)}
.contrast__label--strong{color:var(--teal)}
.contrast__text{font-weight:300;font-size:.86rem;line-height:1.65;color:var(--text-mid)}
@media(max-width:600px){.contrast{grid-template-columns:1fr}}

/* References (new, no .art- prefix) */
.references{max-width:680px;margin:0 auto;padding:0 24px 40px}
.ax-references{max-width:680px;margin:0 auto;padding:0 24px 40px}
.references__title, .ax-references__title{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1rem;color:var(--text-bright);margin-bottom:14px}
.ref, .ax-ref{font-weight:300;font-size:.74rem;line-height:1.65;color:var(--text-muted);margin-bottom:8px;padding-left:20px;text-indent:-20px}
.ref em, .ax-ref em{font-style:normal;color:var(--text-mid)}
.ref a, .ax-ref a{color:var(--text-muted);text-decoration:underline;text-underline-offset:2px}

/* Disclaimer (new, no .art- prefix) */
.disclaimer, .ax-disclaimer{max-width:680px;margin:0 auto;padding:0 24px 40px}
.disclaimer__inner, .ax-disclaimer__inner{background:var(--ink);border:1px solid rgba(255,255,255,0.06);border-radius:12px;padding:20px 24px}
.disclaimer__title, .ax-disclaimer__title{font-weight:400;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px}
.disclaimer__text, .ax-disclaimer__text{font-weight:300;font-size:.78rem;line-height:1.65;color:rgba(242,240,250,0.4)}

/* Related articles */
.related, .ax-related{max-width:1080px;margin:0 auto;padding:40px 24px 80px;border-top:1px solid rgba(255,255,255,0.06)}
.related__title, .ax-related__title{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1.2rem;color:var(--text-bright);margin-bottom:20px;text-align:center}
.related__grid, .ax-related__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;max-width:760px;margin:0 auto}
.related__card, .ax-related__card{background:var(--ink);border:1px solid rgba(255,255,255,0.06);border-radius:14px;padding:22px;text-decoration:none;color:#fff;transition:transform .3s ease, border-color .3s ease}
.related__card:hover, .ax-related__card:hover{transform:translateY(-3px);border-color:rgba(167,139,250,0.18)}
.related__card-topic{font-weight:400;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(167,139,250,0.65);margin-bottom:10px}
.related__card-title{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1.05rem;line-height:1.3;color:var(--text-bright);margin-bottom:8px}
.related__card-meta{font-weight:300;font-size:.7rem;color:var(--text-muted)}

/* Decorative separator */
.ax-sep{height:1px;background:linear-gradient(90deg,transparent,rgba(167,139,250,0.2),transparent);margin:32px auto;max-width:200px}

/* ═══ Premium Gate ═══ */
.premium-gate{position:fixed;inset:0;z-index:50;display:none;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:linear-gradient(to bottom,rgba(6,8,16,0.85) 0%,rgba(6,8,16,0.45) 40%,rgba(6,8,16,0.35) 60%,rgba(6,8,16,0.85) 100%);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);padding:24px}
.premium-gate__icon{width:64px;height:64px;border-radius:50%;background:rgba(78,205,196,0.08);border:1px solid rgba(78,205,196,0.2);display:flex;align-items:center;justify-content:center;margin-bottom:24px}
.premium-gate__icon svg{width:28px;height:28px;fill:none;stroke:#4ecdc4;stroke-width:1.5}
.premium-gate__title{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(1.6rem,4vw,2.2rem);color:#f2f0fa;margin-bottom:12px}
.premium-gate__desc{font-weight:200;font-size:.88rem;line-height:1.7;color:rgba(242,240,250,0.55);max-width:420px;margin-bottom:28px}
.premium-gate__btn{display:inline-flex;align-items:center;gap:8px;font-family:'Outfit',sans-serif;font-weight:400;font-size:.9rem;letter-spacing:.04em;padding:14px 36px;border-radius:60px;color:#060810;background:linear-gradient(135deg,#4ecdc4,#6dd5c8);text-decoration:none;border:none;cursor:pointer;transition:all .4s cubic-bezier(.22,1,.36,1)}
.premium-gate__btn:hover{transform:translateY(-2px);box-shadow:0 8px 40px rgba(78,205,196,0.25)}
.premium-gate__price{font-weight:300;font-size:.78rem;color:rgba(242,240,250,0.5);margin-top:10px;margin-bottom:0}
.premium-gate__login{font-weight:200;font-size:.78rem;color:rgba(242,240,250,0.4);margin-top:16px}
.premium-gate__login a{color:#4ecdc4;text-decoration:underline}
body.is-premium .premium-gate{display:none!important}
body.is-premium .nav-cta--subscribe{display:none!important}

/* Shared lounge route/support cards: keep artwork edges clean on mobile. */
.mf-link::after{content:none!important}