/* Thoughtful Thursday v4 — actual-asset-first presentation.
   DLS Vidya provides the shell. The Thoughtful Thursday visual experience is carried
   by the real published carousel assets rather than recreated web approximations. */
:root {
  --tt-ivory: #fffdf8;
  --tt-blush: #fde7e6;
  --tt-mint: #eef4e8;
  --tt-green: #0C6C1C;
  --tt-pink: #F03C70;
  --tt-text: #263126;
  --tt-muted: #687069;
  --tt-script: "Caveat Brush", "Brush Script MT", cursive;
  --tt-question: "Rosario", "Montserrat", sans-serif;
}

body.tt-page { background: #fffdf9; color: var(--tt-text); }
.tt-page .site-header { background: rgba(255,255,255,.985); }
.tt-page .quick-nav .nav-link[aria-current="page"] { color: var(--pink) !important; position: relative; }
.tt-page .quick-nav .nav-link[aria-current="page"]::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -8px; height: 2px;
  border-radius: 999px; background: var(--pink);
}
.tt-kicker { margin:0 0 8px; color:var(--tt-pink); font:800 11px/1.2 "Montserrat",sans-serif; letter-spacing:.14em; text-transform:uppercase; }
.tt-text-link { color:var(--tt-pink); font-weight:800; text-decoration:none; }
.tt-text-link:hover,.tt-text-link:focus-visible { color:var(--tt-green); }

/* LANDING — intentionally compact. Sticky site header already occupies its own space,
   so there is no artificial top padding. */
.tt-main { width:min(1160px, calc(100% - 40px)); margin:0 auto; padding:26px 0 24px; }
.tt-intro {
  position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1.35fr) minmax(220px,.65fr);
  gap:28px; align-items:center; min-height:330px; padding:36px clamp(30px,4.5vw,56px);
  background:var(--tt-ivory); border-radius:28px; box-shadow:0 14px 38px rgba(38,49,39,.055);
}
.tt-intro::before,.tt-intro::after { content:""; position:absolute; pointer-events:none; border-radius:50%; opacity:.64; }
.tt-intro::before { width:280px; height:170px; left:-100px; top:-72px; background:#f7cbca; }
.tt-intro::after { width:300px; height:180px; right:-105px; bottom:-78px; background:#e4eddc; }
.tt-intro-copy{ position:relative; z-index:2; }
.tt-intro h1 { margin:0; color:#0b5f2d; font:400 clamp(54px,6vw,78px)/.95 var(--tt-script); }
.tt-tagline { margin:11px 0 0; color:var(--tt-green); font:700 clamp(21px,2.1vw,29px)/1.15 "Atkinson Hyperlegible", "Montserrat", sans-serif; }
.tt-intro-line { max-width:650px; margin:16px 0 0; color:#3d493f; font-size:14px; line-height:1.55; }
.tt-intro-note { max-width:650px; margin:7px 0 0; color:#6b736c; font-size:12px; line-height:1.5; }
.tt-intro-note strong { color:var(--tt-green); }
.tt-hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:16px; margin-top:21px; }









.tt-resource-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px 16px; margin-top:14px; }
.tt-resource-actions .btn { padding:10px 17px; font-size:12px; }
.tt-resource-link { color:var(--tt-pink); font-size:11px; font-weight:800; text-decoration:none; border-bottom:1px solid rgba(240,60,112,.3); }
.tt-resource-link:hover,.tt-resource-link:focus-visible { color:var(--tt-green); border-color:rgba(12,108,28,.35); }
.tt-library-whisper { margin:0; padding-left:18px; border-left:2px solid rgba(240,60,112,.28); color:#707770; font-size:11px; line-height:1.55; }
.tt-library-whisper strong { color:var(--tt-green); }

/* EPISODE — actual published carousel images; no recreated cards, no sidebars. */
.tt-deck-main { width:min(1100px, calc(100% - 34px)); margin:0 auto; padding:14px 0 16px; }
.tt-deck-topline { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:7px; }
.tt-back-link { color:var(--tt-green); font:800 15px/1.3 "Montserrat", sans-serif; text-decoration:none; display:inline-flex; align-items:center; gap:4px; padding:6px 2px; }
.tt-back-link:hover,.tt-back-link:focus-visible { color:var(--tt-pink); }
.tt-deck-cue { color:#7a807a; font-size:10px; font-weight:600; }
.tt-deck-shell { display:grid; grid-template-columns:42px minmax(0,1fr) 42px; gap:12px; align-items:center; justify-items:center; }
.tt-deck-viewport {
  width:auto; height:min(70vh, 690px); aspect-ratio:4/5; position:relative; overflow:hidden; background:var(--tt-ivory);
  border-radius:18px; box-shadow:0 15px 40px rgba(35,49,39,.11); outline:none;
}
.tt-deck-viewport:focus-visible { box-shadow:0 0 0 3px rgba(240,60,112,.2),0 15px 40px rgba(35,49,39,.11); }
.tt-deck-track { position:absolute; inset:0; }
.tt-deck-slide { position:absolute; inset:0; margin:0; opacity:0; visibility:hidden; transform:translateX(14px); transition:opacity 180ms ease,transform 180ms ease,visibility 180ms ease; }
.tt-deck-slide.is-active { opacity:1; visibility:visible; transform:none; z-index:2; }
.tt-deck-slide img { width:100%; height:100%; object-fit:contain; display:block; background:var(--tt-ivory); }
.tt-deck-arrow { width:38px; height:38px; border-radius:50%; border:1px solid rgba(12,108,28,.18); background:#fff; color:var(--tt-green); font-size:18px; cursor:pointer; box-shadow:0 6px 18px rgba(39,52,42,.06); }
.tt-deck-arrow:hover,.tt-deck-arrow:focus-visible { background:var(--tt-green); color:#fff; }
.tt-deck-controls { display:flex; align-items:center; justify-content:center; gap:12px; margin-top:8px; min-height:24px; }
.tt-story-dots { display:flex; align-items:center; gap:7px; }
.tt-story-dot { width:8px; height:8px; padding:0; border:0; border-radius:50%; background:#d7dfd3; cursor:pointer; }
.tt-story-dot.is-active { width:20px; border-radius:999px; background:var(--tt-pink); }
.tt-deck-controls p { margin:0; color:#747b75; font-size:10px; font-weight:700; }






@media (max-width:900px) {
  .tt-main { width:min(100% - 28px, 760px); padding-top:18px; }
  .tt-intro { grid-template-columns:1fr 180px; min-height:300px; padding:30px; }
  
  
  
  .tt-library-whisper { grid-column:1/-1; border-left:0; border-top:1px solid rgba(240,60,112,.18); padding:12px 0 0; }
  .tt-deck-viewport { height:min(68vh,640px); }
}

@media (max-width:680px) {
  .tt-main { width:calc(100% - 22px); padding:12px 0 18px; }
  .tt-intro { grid-template-columns:1fr; min-height:0; padding:26px 22px 20px; gap:10px; text-align:center; }
  .tt-intro h1 { font-size:clamp(45px,15vw,62px); }
  .tt-tagline { font-size:20px; }
  .tt-intro-line,.tt-intro-note { margin-left:auto; margin-right:auto; }
  .tt-hero-actions { justify-content:center; }
  
  
  
  
  
  
  
  .tt-resource-actions { gap:9px 12px; }
  .tt-resource-actions .btn { padding:9px 12px; }
  .tt-resource-link { font-size:10px; }
  .tt-library-whisper { display:none; }

  .tt-deck-main { width:100%; padding:8px 0 10px; }
  .tt-deck-topline { padding:0 13px; }
  .tt-deck-cue { display:none; }
  .tt-deck-shell { grid-template-columns:1fr; gap:0; }
  .tt-deck-viewport { width:min(92vw,520px); height:auto; aspect-ratio:4/5; border-radius:14px; }
  .tt-deck-arrow { position:absolute; z-index:5; top:50%; transform:translateY(-50%); width:35px; height:35px; background:rgba(255,255,255,.88); }
  .tt-deck-prev { left:8px; } .tt-deck-next { right:8px; }
  .tt-deck-shell { position:relative; }
  
}

@media (prefers-reduced-motion:reduce) {
  .tt-deck-slide { transition:none; }
}

/* Thoughtful Thursday v5 — two-episode library, compact enough to invite reflection rather than scrolling. */
.tt-landing .tt-intro {
  min-height: 286px;
  padding-top: 30px;
  padding-bottom: 30px;
}
.tt-landing .tt-intro-line { font-size: 13px; margin-top: 13px; }
.tt-landing .tt-intro-note { font-size: 11.5px; }


.tt-episode-library { margin-top:18px; padding:20px 22px 18px; background:#fff; border-radius:22px; box-shadow:0 10px 28px rgba(38,49,39,.045); }
.tt-library-heading { display:flex; justify-content:space-between; gap:28px; align-items:end; margin-bottom:16px; }
.tt-library-heading h2 { margin:3px 0 0; color:var(--tt-green); font:700 clamp(24px,2.5vw,32px)/1.08 var(--tt-question); }
.tt-library-heading > p { max-width:430px; margin:0; color:#687069; font-size:11px; line-height:1.5; }
.tt-episode-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.tt-episode-card { min-width:0; display:grid; grid-template-columns:118px minmax(0,1fr); gap:17px; align-items:center; padding:13px; border:1px solid rgba(12,108,28,.10); border-radius:17px; background:#fffdf9; }
.tt-episode-card.tt-episode-latest { border-color:rgba(240,60,112,.20); background:linear-gradient(115deg,#fffdf9 0%,#fff7f8 100%); }
.tt-episode-cover { width:112px; aspect-ratio:4/5; display:block; overflow:hidden; border-radius:11px; box-shadow:0 7px 18px rgba(39,53,42,.10); }
.tt-episode-cover img { width:100%; height:100%; object-fit:cover; display:block; }
.tt-episode-copy h3 { margin:4px 0 5px; color:var(--tt-green); font:700 clamp(19px,1.75vw,24px)/1.08 var(--tt-question); }
.tt-episode-copy > p:not(.tt-kicker) { margin:0; color:#687069; font-size:10.5px; line-height:1.45; }
.tt-episode-copy .tt-resource-actions { margin-top:11px; gap:9px 11px; }
.tt-episode-copy .tt-resource-actions .btn { padding:8px 11px; font-size:10.5px; }
.tt-episode-copy .tt-resource-link { font-size:9.5px; }
.tt-episode-library > .tt-library-whisper { margin:13px 0 0; padding:9px 0 0; border-left:0; border-top:1px solid rgba(240,60,112,.13); text-align:center; font-size:10px; }

@media (max-width:900px) {
  .tt-library-heading { align-items:start; }
  .tt-episode-grid { grid-template-columns:1fr; }
  .tt-episode-card { grid-template-columns:104px 1fr; }
  .tt-episode-cover { width:100px; }
}
@media (max-width:680px) {
  .tt-landing .tt-intro { min-height:0; }
  .tt-episode-library { margin-top:12px; padding:16px 12px 13px; }
  .tt-library-heading { display:block; margin-bottom:13px; }
  .tt-library-heading > p { margin-top:6px; font-size:10.5px; }
  .tt-episode-card { grid-template-columns:86px 1fr; gap:12px; padding:10px; }
  .tt-episode-cover { width:82px; }
  .tt-episode-copy h3 { font-size:18px; }
  .tt-episode-copy > p:not(.tt-kicker) { display:none; }
  .tt-episode-copy .tt-resource-actions { margin-top:8px; }
}

/* ===== v6: spacing-safe, reel-faithful Thoughtful Thursday shell =====
   The global DLS Vidya header is fixed. These pages therefore reserve the full
   header height before beginning the reflection experience. */
.tt-sr-only {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

/* Use the exact published Thoughtful Thursday lockup rather than approximating Playlist Script. */




/* Fixed-header clearance. Keep content close to the header, but never underneath it. */
.tt-main {
  width:min(1160px, calc(100% - 40px));
  margin:0 auto;
  padding:128px 0 22px;
}
.tt-deck-main {
  width:min(1100px, calc(100% - 34px));
  margin:0 auto;
  padding:122px 0 14px;
}

/* Landing stays compact enough to scan without becoming another long article. */
.tt-landing .tt-intro {
  min-height:220px;
  padding:20px clamp(24px,3.7vw,44px);
  grid-template-columns:minmax(0,1.48fr) minmax(160px,.52fr);
  gap:20px;
}
.tt-landing .tt-intro-line {
  margin-top:9px;
  font-size:12.5px;
  line-height:1.45;
}

.tt-landing .tt-hero-actions { margin-top:13px; }
.tt-landing .tt-hero-actions .btn { padding:10px 16px; font-size:12px; }
.tt-landing .tt-text-link { font-size:11px; }

.tt-episode-library {
  margin-top:12px;
  padding:16px 18px 14px;
}
.tt-library-heading { margin-bottom:12px; }
.tt-library-heading h2 { font-size:clamp(22px,2.2vw,29px); }
.tt-library-heading > p { font-size:10.5px; }
.tt-episode-card {
  grid-template-columns:102px minmax(0,1fr);
  gap:14px;
  padding:10px;
}
.tt-episode-cover { width:96px; }
.tt-episode-copy h3 { font-size:clamp(18px,1.55vw,22px); }
.tt-episode-copy .tt-resource-actions { margin-top:8px; }
.tt-episode-library > .tt-library-whisper { margin-top:9px; padding-top:7px; }

/* Size the reel so the complete slide, controls and resources stay visible on typical laptops. */
.tt-deck-viewport {
  height:min(64svh, 650px);
  max-height:650px;
}
.tt-deck-topline { margin-bottom:6px; }
.tt-deck-controls { margin-top:6px; }


@media (max-width:1180px) {
  .tt-main { padding-top:110px; }
  .tt-deck-main { padding-top:106px; }
}
@media (max-width:900px) {
  .tt-landing .tt-intro {
    grid-template-columns:minmax(0,1fr) 145px;
    min-height:205px;
    padding:18px 22px;
  }
  
  
}
@media (max-width:760px) {
  .tt-main { width:calc(100% - 22px); padding:86px 0 16px; }
  .tt-deck-main { width:100%; padding:84px 0 10px; }
  .tt-landing .tt-intro {
    grid-template-columns:1fr 96px;
    min-height:0;
    padding:18px 16px;
    gap:10px;
    text-align:left;
  }
  
  
  .tt-landing .tt-intro-line { margin-top:7px; font-size:11.5px; }
  
  
  
  .tt-landing .tt-hero-actions { grid-column:1 / -1; margin-top:8px; }
  .tt-episode-library { margin-top:10px; }
  .tt-deck-viewport { width:min(88vw,500px); height:auto; aspect-ratio:4/5; }
}
@media (max-width:520px) {
  .tt-landing .tt-intro { grid-template-columns:1fr; text-align:center; }
  
  
  .tt-landing .tt-intro-line { margin-inline:auto; }
  
  .tt-landing .tt-hero-actions { justify-content:center; }
  .tt-library-heading > p { display:none; }
  .tt-episode-card { grid-template-columns:78px 1fr; }
  .tt-episode-cover { width:74px; }
  .tt-episode-copy h3 { font-size:17px; }
}

/* Final fixed-header guard: the base site has high-specificity !important offsets on tablet/mobile. */
.tt-page .page > main.tt-main { padding-top:128px !important; }
.tt-page .page > main.tt-deck-main { padding-top:122px !important; }
@media (max-width:1180px) {
  .tt-page .page > main.tt-main { padding-top:102px !important; }
  .tt-page .page > main.tt-deck-main { padding-top:98px !important; }
}
@media (max-width:760px) {
  .tt-page .page > main.tt-main { padding-top:86px !important; }
  .tt-page .page > main.tt-deck-main { padding-top:84px !important; }
}

/* Specificity match for the base site's final header-offset rules. */
html body.tt-page .page > main.tt-main { padding-top:128px !important; }
html body.tt-page .page > main.tt-deck-main { padding-top:122px !important; }
@media (max-width:1180px) {
  html body.tt-page .page > main.tt-main { padding-top:102px !important; }
  html body.tt-page .page > main.tt-deck-main { padding-top:98px !important; }
}
@media (max-width:760px) {
  html body.tt-page .page > main.tt-main { padding-top:86px !important; }
  html body.tt-page .page > main.tt-deck-main { padding-top:84px !important; }
}

/* ===== v7: settled Thoughtful Thursday web treatment =====
   - Questions worth growing with remains the only series line.
   - The published TT masthead is used as artwork so Playlist Script stays exact.
   - Perspective Peach is identified with the Canva Caveat Brush treatment + arrow.
   - The episode itself stays image-first; the website supplies navigation/resources only.
   - Fixed-header clearance is measured from the real rendered header at every viewport. */

:root {
  --tt-header-gap: 16px;
}

/* Real header-height clearance: this intentionally supersedes all older hard-coded guards. */
html body.tt-page .page > main.tt-main,
html body.tt-page .page > main.tt-deck-main {
  padding-top: calc(var(--site-header-height, 108px) + var(--tt-header-gap)) !important;
}

.tt-landing .tt-intro {
  min-height: 278px;
  padding: 28px clamp(30px, 4vw, 48px);
  grid-template-columns: minmax(0, 1.5fr) minmax(185px, .5fr);
  gap: clamp(24px, 3vw, 38px);
  align-items: center;
}



.tt-landing .tt-intro-line {
  max-width: 620px;
  margin-top: 12px;
  font-size: 13px;
  line-height: 1.52;
}

.tt-landing .tt-hero-actions {
  margin-top: 17px;
  gap: 15px;
}





/* Caveat Brush identification used in the original Canva artwork. */






/* Keep the library visibly secondary to the reflective hero. */
.tt-episode-library {
  margin-top: 14px;
  padding: 17px 19px 15px;
}

.tt-library-heading {
  margin-bottom: 13px;
}

/* Individual episodes: keep the published 4:5 art as the experience. */
.tt-deck-main {
  --tt-deck-max: 650px;
}

.tt-deck-viewport {
  height: min(64svh, var(--tt-deck-max));
  max-height: var(--tt-deck-max);
}

.tt-deck-topline, .tt-deck-controls{
  position: relative;
  z-index: 2;
}

/* Homepage bridge: preserve the calmer v4 composition, remove extra slogan,
   and attach the same Peach signature treatment used on the TT landing page. */


















@media (max-width: 1180px) {
  :root { --tt-header-gap: 14px; }
  .tt-landing .tt-intro {
    grid-template-columns: minmax(0, 1fr) 155px;
    min-height: 250px;
    padding: 24px 28px;
  }
  
  
  
  
}

@media (max-width: 900px) {
  
  
  
  
  
}

@media (max-width: 760px) {
  :root { --tt-header-gap: 11px; }

  .tt-main { width: calc(100% - 22px); }
  .tt-deck-main { width: 100%; }

  .tt-landing .tt-intro {
    grid-template-columns: minmax(0, 1fr) 95px;
    min-height: 0;
    padding: 18px 17px;
    gap: 12px;
    text-align: left;
  }

  
  .tt-landing .tt-intro-line { margin-top: 7px; font-size: 11.5px; }
  .tt-landing .tt-hero-actions { grid-column: 1 / -1; margin-top: 10px; }
  
  
  

  .tt-deck-viewport {
    width: min(88vw, 500px);
    height: auto;
    max-height: none;
    aspect-ratio: 4 / 5;
  }

  
  
  
  
  
  
}

@media (max-width: 520px) {
  .tt-landing .tt-intro {
    grid-template-columns: 1fr;
    text-align: center;
  }
  
  .tt-landing .tt-intro-line { margin-inline: auto; }
  
  .tt-landing .tt-hero-actions { justify-content: center; }
}

/* ===== Thoughtful Thursday v10: landing + episode responsive finish ===== */
:root { --tt-header-gap: 12px; }
html body.tt-page .page > main.tt-main,
html body.tt-page .page > main.tt-deck-main {
  padding-top: calc(var(--site-header-height, 96px) + var(--tt-header-gap)) !important;
}

/* Landing hero: quiet web shell, no decorative corner blobs. */
















/* Library: balanced padding and clean two-column cards on desktop/tablet. */
.tt-episode-library {
  margin-top:16px !important;
  padding:24px 26px 22px !important;
  border-radius:24px !important;
}
.tt-library-heading { margin-bottom:18px !important; align-items:end; }
.tt-library-heading h2 { margin-top:4px; }
.tt-library-heading > p { font-size:11.5px; }
.tt-episode-grid { gap:18px !important; }
.tt-episode-card {
  grid-template-columns:112px minmax(0,1fr) !important;
  gap:18px !important;
  align-items:center !important;
  padding:15px 17px !important;
  border-radius:19px !important;
}
.tt-episode-cover { width:106px !important; border-radius:13px !important; }
.tt-episode-copy h3 { margin:5px 0 6px; font-size:clamp(18px,1.65vw,23px) !important; }
.tt-episode-copy .tt-resource-actions { margin-top:10px !important; }
.tt-episode-library > .tt-library-whisper { margin-top:14px !important; padding-top:10px !important; }

/* Episode viewer: compact, centered, and intentionally image-first. */
.tt-episode-page .page { min-height:100svh; display:flex; flex-direction:column; }
.tt-episode-page .tt-deck-main { flex:1 0 auto; }
.tt-deck-main { width:min(1080px,calc(100% - 30px)); padding-bottom:12px !important; }
.tt-deck-topline { margin:0 auto 8px; max-width:760px; }
.tt-deck-shell { grid-template-columns:40px minmax(0,1fr) 40px; gap:12px; }
.tt-deck-viewport {
  width:auto;
  height:min(63svh,620px) !important;
  max-height:620px !important;
  aspect-ratio:4/5;
  border-radius:18px;
  box-shadow:0 14px 34px rgba(35,49,39,.10);
}
.tt-deck-arrow { width:36px; height:36px; font-size:17px; }
.tt-deck-controls { margin-top:8px; gap:11px; }



@media (max-width:980px) {
  
  
  
  
  
  
  

  .tt-episode-library { padding:22px !important; }
  .tt-episode-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .tt-episode-card { grid-template-columns:92px minmax(0,1fr) !important; gap:14px !important; padding:13px !important; }
  .tt-episode-cover { width:86px !important; }
  .tt-episode-copy h3 { font-size:18px !important; }

  .tt-deck-viewport { height:min(62svh,590px) !important; max-height:590px !important; }
}

@media (max-width:760px) {
  :root { --tt-header-gap:10px; }
  .tt-main { width:calc(100% - 20px) !important; }
  
  
  
  
  
  
  
  
  
  

  .tt-episode-library { padding:18px 14px 16px !important; }
  .tt-library-heading { display:block !important; margin-bottom:14px !important; text-align:left; }
  .tt-library-heading > p { display:block !important; margin-top:7px !important; }
  .tt-episode-grid { grid-template-columns:1fr !important; gap:12px !important; }
  .tt-episode-card { grid-template-columns:84px minmax(0,1fr) !important; gap:13px !important; padding:12px !important; }
  .tt-episode-cover { width:80px !important; }
  .tt-episode-copy h3 { font-size:17px !important; }

  html body.tt-page .page > main.tt-deck-main { padding-top:calc(var(--site-header-height,78px) + 9px) !important; }
  .tt-deck-main { width:100% !important; padding-left:0 !important; padding-right:0 !important; }
  .tt-deck-topline { width:min(92vw,430px); margin:0 auto 7px; }
  .tt-deck-shell { grid-template-columns:1fr; position:relative; gap:0; }
  .tt-deck-viewport {
    width:min(84vw,430px) !important;
    height:auto !important;
    max-height:none !important;
    aspect-ratio:4/5;
    border-radius:15px;
  }
  .tt-deck-arrow {
    position:absolute;
    z-index:5;
    top:50%;
    transform:translateY(-50%);
    width:32px;
    height:32px;
    background:rgba(255,255,255,.92);
    box-shadow:0 4px 14px rgba(35,49,39,.10);
  }
  .tt-deck-prev { left:max(7px,calc(50% - min(42vw,215px) - 6px)); }
  .tt-deck-next { right:max(7px,calc(50% - min(42vw,215px) - 6px)); }
  .tt-deck-controls { margin-top:7px; }
  .tt-deck-cue { display:none; }
  
  
  
  
}

@media (max-width:480px) {
  
  
  
  
  
  
  
  
  .tt-episode-card { grid-template-columns:72px minmax(0,1fr) !important; gap:11px !important; }
  .tt-episode-cover { width:68px !important; }
  .tt-episode-copy h3 { font-size:16px !important; }
  .tt-episode-copy .tt-resource-actions .btn { padding:8px 10px !important; }
  .tt-deck-viewport { width:min(82vw,360px) !important; }
  
}
/* v10.1: keep Peach clear of episode titles in the stacked covers. */


@media (max-width:980px){
  
  
  
}
@media (max-width:760px){
  
  
  
}
@media (max-width:480px){
  
  
  
}
/* v10.2: keep carousel arrows visually attached to the reel on desktop/tablet. */
@media (min-width:761px) {
  .tt-deck-shell {
    grid-template-columns: 40px auto 40px !important;
    justify-content: center !important;
    gap: 14px !important;
  }
}

/* ===== v11: Thoughtful Thursday landing + episode scale refinement ===== */
/* Hero uses the same fan language as the DLS Vidya homepage. */
















/* Library breathing room. */
.tt-episode-library { padding:28px 30px 26px !important; }
.tt-library-heading { margin-bottom:20px !important; }
.tt-episode-grid { gap:20px !important; }
.tt-episode-card { padding:17px 18px !important; gap:18px !important; }

/* Desktop reels should feel like the main content, not a thumbnail in whitespace. */
@media (min-width: 1025px) {
  .tt-deck-main { width:min(1220px,calc(100% - 34px)) !important; }
  .tt-deck-topline { max-width:880px !important; }
  .tt-deck-viewport {
    height:min(76svh,700px) !important;
    max-height:700px !important;
  }
  .tt-deck-shell { gap:16px !important; }
  .tt-deck-arrow { width:40px !important; height:40px !important; font-size:18px !important; }
  
}

/* Tablet: stack hero instead of compressing title and cards side-by-side. */
@media (max-width: 1024px) {
  
  
  
  
  
  
  
  
  
  

  .tt-deck-viewport {
    height:min(66svh,680px) !important;
    max-height:680px !important;
    width:auto !important;
  }
  .tt-deck-shell {
    grid-template-columns:40px auto 40px !important;
    justify-content:center !important;
    gap:14px !important;
  }
  .tt-deck-arrow {
    position:static !important;
    transform:none !important;
    width:38px !important;
    height:38px !important;
  }
}

@media (max-width: 760px) {
  
  
  
  
  
  
  
  
  

  .tt-episode-library { padding:20px 15px 18px !important; }
  .tt-episode-card { padding:13px !important; }

  .tt-deck-shell { grid-template-columns:1fr !important; position:relative !important; gap:0 !important; }
  .tt-deck-viewport {
    width:min(88vw,390px) !important;
    height:auto !important;
    max-height:none !important;
    aspect-ratio:4/5;
  }
  .tt-deck-arrow {
    position:absolute !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    width:34px !important;
    height:34px !important;
  }
  .tt-deck-prev { left:max(4px,calc(50% - min(44vw,195px) - 3px)) !important; }
  .tt-deck-next { right:max(4px,calc(50% - min(44vw,195px) - 3px)) !important; }
}

@media (max-width: 420px) {
  
  
  
  
  .tt-deck-viewport { width:min(90vw,360px) !important; }
}

/* v11.1 — Peach is a deliberate mascot, not a tiny spacer between cards. */



@media (max-width:1024px){
  
  
  
}
@media (max-width:760px){
  
  
  
}
@media (max-width:420px){
  
  
  
}

/* ===== v12 micro-adjustment: bring the fan up; nest Peach lower into it ===== */


@media (max-width: 1024px) {
  
  
}
@media (max-width: 760px) {
  
  
}
@media (max-width: 420px) {
  
  
}

/* v12.1 — tighten mascot/fan relationship after visual review. */


@media (max-width: 1024px) {
  
  
}
@media (max-width: 760px) {
  
  
}
@media (max-width: 420px) {
  
  
}

/* ===== v13: Use the approved composite artwork as a single visual asset ===== */
.tt-intro-v13 {
  grid-template-columns: minmax(0, 1.16fr) minmax(380px, 480px) !important;
  gap: clamp(34px, 4vw, 62px) !important;
  align-items: center !important;
  min-height: 470px !important;
  padding: clamp(34px, 4vw, 50px) !important;
}
.tt-intro-v13::before,
.tt-intro-v13::after { display: none !important; content: none !important; }
.tt-intro-v13 .tt-intro-copy { min-width: 0; }
.tt-intro-v13 .tt-series-masthead {
  width: min(100%, 760px) !important;
  height: auto !important;
  margin: 0 !important;
}
.tt-intro-v13 .tt-tagline {
  font-size: clamp(21px, 2vw, 28px) !important;
  line-height: 1.16 !important;
  margin: 10px 0 0 !important;
}
.tt-intro-v13 .tt-intro-line {
  font-size: clamp(15px, 1.2vw, 17px) !important;
  margin-top: 18px !important;
  max-width: 670px !important;
}
.tt-intro-v13 .tt-intro-note {
  font-size: clamp(13.5px, 1vw, 15px) !important;
  margin-top: 14px !important;
  max-width: 700px !important;
}
.tt-intro-v13 .tt-hero-actions { margin-top: 26px !important; }
.tt-intro-v13 .tt-composite-visual {
  width: 100% !important;
  max-width: 480px !important;
  height: auto !important;
  justify-self: end !important;
  align-self: center !important;
  overflow: visible !important;
  display: block !important;
}
.tt-intro-v13 .tt-composite-image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 16px 24px rgba(38,50,41,.10));
}
@media (max-width: 1024px) {
  .tt-intro-v13 {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
    padding: 34px !important;
    gap: 24px !important;
    text-align: left !important;
  }
  .tt-intro-v13 .tt-intro-copy { max-width: 760px; }
  .tt-intro-v13 .tt-series-masthead { width: min(100%,650px) !important; margin-inline: 0 !important; }
  .tt-intro-v13 .tt-tagline { font-size: clamp(21px,3vw,26px) !important; margin-inline: 0 !important; }
  .tt-intro-v13 .tt-intro-line,
  .tt-intro-v13 .tt-intro-note { margin-left: 0 !important; margin-right: 0 !important; }
  .tt-intro-v13 .tt-hero-actions { justify-content: flex-start !important; }
  .tt-intro-v13 .tt-composite-visual { max-width: 440px !important; justify-self: center !important; }
}
@media (max-width: 760px) {
  .tt-intro-v13 {
    padding: 26px 20px 24px !important;
    gap: 20px !important;
    text-align: center !important;
  }
  .tt-intro-v13 .tt-series-masthead { width: 100% !important; margin-inline: auto !important; }
  .tt-intro-v13 .tt-tagline { font-size: clamp(19px,5.5vw,23px) !important; margin-inline: auto !important; }
  .tt-intro-v13 .tt-intro-line,
  .tt-intro-v13 .tt-intro-note { font-size: 13px !important; margin-left: auto !important; margin-right: auto !important; }
  .tt-intro-v13 .tt-hero-actions { justify-content: center !important; }
  .tt-intro-v13 .tt-composite-visual { max-width: 330px !important; }
}
@media (max-width: 420px) {
  .tt-intro-v13 .tt-composite-visual { max-width: 292px !important; }
}

/* ===== v16: episode continuation layer =====
   The published slides remain the main experience. Social links are the public
   conversation path; the reflection sheet is the private reflection path. */





.tt-section-eyebrow {
  margin: 0 0 4px;
  color: var(--tt-pink);
  font: 800 10px/1.2 "Montserrat", sans-serif;
  letter-spacing: .09em;
  text-transform: uppercase;
}





.tt-reflection-button {
  width: 100%;
  min-height: 40px;
  padding: 10px 13px !important;
  text-align: center;
  font-size: 11px !important;
}

.tt-text-version {
  width: min(880px, calc(100% - 20px));
  margin: 10px auto 0;
  border-top: 1px solid rgba(12,108,28,.12);
  border-bottom: 1px solid rgba(12,108,28,.12);
  background: rgba(255,255,255,.45);
}
.tt-text-version summary {
  list-style: none;
  cursor: pointer;
  padding: 11px 4px;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  color: var(--tt-green);
  font: 800 11.5px/1.3 "Montserrat", sans-serif;
}
.tt-text-version summary::-webkit-details-marker { display: none; }
.tt-text-version summary::after {
  content: "+";
  color: var(--tt-pink);
  font-size: 18px;
  line-height: .8;
  margin-left: auto;
}
.tt-text-version[open] summary::after { content: "−"; }
.tt-text-version summary small {
  color: #7c837d;
  font-size: 10px;
  font-weight: 500;
  margin-left: auto;
}
.tt-transcript-list {
  padding: 2px 4px 14px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 8px 18px;
}
.tt-transcript-slide {
  padding: 9px 0;
  border-top: 1px solid rgba(12,108,28,.08);
}
.tt-transcript-slide h3 {
  margin: 0 0 4px;
  color: var(--tt-pink);
  font: 800 9.5px/1.2 "Montserrat", sans-serif;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.tt-transcript-slide p {
  margin: 0;
  color: #4e584f;
  font: 500 11px/1.48 "Atkinson Hyperlegible", sans-serif;
}

.tt-episode-nav {
  width: min(880px, calc(100% - 20px));
  margin: 9px auto 2px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 10px;
}
.tt-episode-nav-link {
  color: var(--tt-pink);
  font: 800 15px/1.3 "Montserrat", sans-serif;
  text-decoration: none;
  padding: 9px 4px;
}
.tt-episode-nav-link:hover,
.tt-episode-nav-link:focus-visible { color: var(--tt-green); }
.tt-episode-nav-prev { justify-self: start; }
.tt-episode-nav-next { justify-self: end; }
.tt-episode-nav-library {
  justify-self: center;
  color: var(--tt-green);
}

/* The older four-link resource strip is no longer part of the public episode experience. */


@media (max-width: 900px) {
  
  
  
  .tt-reflection-button { width: auto; min-width: 165px; }
  .tt-text-version,
  .tt-episode-nav { width: min(760px, calc(100% - 24px)); }
}

@media (max-width: 760px) {
  .tt-text-version, .tt-episode-nav{ width: min(92vw, 430px); }
  
  
  
  
  
  .tt-reflection-button { width: 100%; min-width: 0; }
  
  
  .tt-text-version summary { padding: 12px 2px; }
  .tt-text-version summary small { display: none; }
  .tt-transcript-list { grid-template-columns: 1fr; padding-bottom: 12px; }
  .tt-episode-nav { margin-top: 8px; }
  .tt-episode-nav-link { font-size: 14px; }
}

@media (max-width: 430px) {
  
  
  .tt-episode-nav { grid-template-columns: 1fr auto 1fr; gap: 6px; }
  .tt-episode-nav-link { font-size: 13.5px; }
}

/* ===== v17: desktop episode companion + icon social links ===== */
.tt-episode-page .tt-deck-main {
  width:min(1320px,calc(100% - 36px)) !important;
}
.tt-episode-desktop-layout {
  display:grid;
  grid-template-columns:minmax(620px,760px) minmax(360px,430px);
  gap:clamp(30px,3.2vw,48px);
  justify-content:center;
  align-items:start;
}
.tt-episode-stage { min-width:0; }
.tt-episode-stage .tt-deck-shell {
  grid-template-columns:42px auto 42px !important;
  gap:14px !important;
  justify-content:center !important;
}
.tt-episode-stage .tt-deck-viewport {
  width:auto !important;
  height:min(76svh,760px) !important;
  max-height:760px !important;
  aspect-ratio:4/5 !important;
}
.tt-episode-stage .tt-deck-controls {
  margin-top:9px;
}
.tt-episode-companion {
  min-width:0;
  align-self:start;
  display:grid;
  gap:12px;
  padding-top:4px;
}
.tt-companion-heading {
  padding:2px 2px 6px;
}
.tt-companion-heading h2 {
  margin:5px 0 0;
  color:var(--tt-green);
  font:700 clamp(24px,2vw,31px)/1.08 "Cormorant Garamond",serif;
}

.tt-continuation-group {
  display:grid;
  gap:10px;
}
.tt-continuation-heading {
  display:none;
}
.tt-companion-block {
  border:1px solid rgba(12,108,28,.12);
  border-radius:18px;
  background:rgba(255,255,255,.86);
  box-shadow:0 8px 20px rgba(35,49,39,.05);
  padding:15px 16px;
}
.tt-companion-social {
  background:linear-gradient(135deg,rgba(253,234,240,.64),rgba(255,255,255,.96));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.tt-companion-reflect {
  background:linear-gradient(135deg,rgba(238,246,234,.88),rgba(255,255,255,.96));
}
.tt-companion-block h3 {
  margin:0;
  color:var(--tt-green);
  font:700 19px/1.12 "Cormorant Garamond",serif;
}
.tt-companion-block p:not(.tt-section-eyebrow) {
  margin:5px 0 0;
  color:#687168;
  font:500 11px/1.45 "Montserrat",sans-serif;
}
.tt-social-icons {
  display:flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
}
.tt-social-icon {
  width:42px;
  height:42px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(240,60,112,.22);
  background:#fff;
  color:var(--tt-pink);
  text-decoration:none;
  transition:transform .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease;
}
.tt-social-icon svg { width:20px; height:20px; stroke:currentColor; stroke-width:1.8; fill:none; }
.tt-social-icon .tt-icon-fill { fill:currentColor; stroke:none; }
.tt-social-icon:hover,.tt-social-icon:focus-visible {
  color:var(--tt-green);
  border-color:rgba(12,108,28,.32);
  box-shadow:0 5px 14px rgba(12,108,28,.09);
  transform:translateY(-1px);
}
.tt-companion-reflect .tt-reflection-button {
  display:flex;
  align-items:center;
  justify-content:center;
  margin-top:12px;
  width:100%;
  min-height:42px;
}
.tt-episode-companion .tt-text-version {
  width:100%;
  margin:0;
  border:1px solid rgba(12,108,28,.12);
  border-radius:16px;
  background:rgba(255,255,255,.72);
  overflow:hidden;
}
.tt-episode-companion .tt-text-version summary { padding:13px 14px; }
.tt-episode-companion .tt-transcript-list {
  grid-template-columns:1fr;
  padding:0 14px 14px;
  max-height:48svh;
  overflow:auto;
}
.tt-episode-companion .tt-transcript-slide { padding:9px 0; }
.tt-episode-companion .tt-episode-nav {
  width:100%;
  margin:0;
  padding:2px 2px 0;
}


@media (max-width:1099px) {
  .tt-episode-page .tt-deck-main { width:100% !important; }
  .tt-episode-desktop-layout {
    grid-template-columns:1fr;
    gap:14px;
  }
  .tt-episode-stage .tt-deck-viewport {
    height:min(66svh,680px) !important;
    max-height:680px !important;
  }
  .tt-episode-companion {
    width:min(760px,calc(100% - 24px));
    margin:0 auto;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }
  .tt-companion-heading { grid-column:1 / -1; }
  .tt-continuation-group {
    grid-column:1 / -1;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }
  .tt-continuation-heading {
    grid-column:1 / -1;
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:14px;
    padding:2px 4px 0;
  }
  .tt-continuation-heading p { margin:0; }
  .tt-continuation-heading > p:last-child {
    color:#687168;
    font:500 11px/1.4 "Montserrat",sans-serif;
  }
  .tt-episode-companion .tt-text-version,
  .tt-episode-companion .tt-episode-nav { grid-column:1 / -1; }
  .tt-episode-companion .tt-transcript-list { grid-template-columns:repeat(2,minmax(0,1fr)); max-height:none; overflow:visible; }
}

@media (max-width:760px) {
  .tt-episode-desktop-layout { gap:10px; }
  .tt-episode-stage .tt-deck-shell { grid-template-columns:1fr !important; gap:0 !important; }
  .tt-episode-stage .tt-deck-viewport {
    width:min(84vw,430px) !important;
    height:auto !important;
    max-height:none !important;
  }
  .tt-episode-companion {
    width:min(92vw,430px);
    grid-template-columns:1fr;
    gap:9px;
  }
  .tt-companion-heading { padding:2px 0 3px; text-align:left; }
  .tt-continuation-group {
    grid-template-columns:1fr;
    gap:8px;
  }
  .tt-continuation-heading {
    display:block;
    padding:2px 1px 1px;
    text-align:left;
  }
  .tt-continuation-heading > p:last-child {
    margin-top:3px;
    font-size:10.5px;
  }
  .tt-companion-heading h2 { font-size:22px; }
  .tt-companion-block { padding:13px 14px; border-radius:14px; }
  .tt-companion-social { flex-direction:row; }
  .tt-social-icon { width:40px; height:40px; }
  .tt-episode-companion .tt-text-version,
  .tt-episode-companion .tt-episode-nav { grid-column:auto; }
  .tt-episode-companion .tt-transcript-list { grid-template-columns:1fr; }
  .tt-episode-companion .tt-text-version summary small { display:none; }
  .tt-episode-companion .tt-episode-nav { margin-top:0; }
}

@media (max-width:430px) {
  .tt-companion-social { align-items:flex-start; }
  .tt-social-icons { gap:6px; }
  .tt-social-icon { width:38px; height:38px; }
  .tt-social-icon svg { width:18px; height:18px; }
}
@media (min-width:1100px) {
  .tt-episode-page .tt-deck-topline {
    width:min(1240px,100%) !important;
    max-width:none !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
}

/* ===== v21: contextual footer for individual Thoughtful Thursday episodes ===== */
.tt-experience-footer {
  position: relative;
  z-index: 1;
  width: calc(100% - 2rem);
  max-width: 1180px;
  margin: clamp(1.25rem, 2.8vw, 2rem) auto 0;
  padding: 1.35rem clamp(1rem, 3vw, 2rem) 2.1rem;
  border-top: 1px solid rgba(12, 108, 28, 0.14);
  color: #5d6b61;
  font-family: "Montserrat", "Avenir", "Helvetica Neue", Arial, sans-serif;
  text-align: center;
  line-height: 1.55;
}
.tt-experience-footer p {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}
.tt-experience-footer .tt-footer-message {
  margin-top: 0;
  margin-bottom: .45rem;
  color: var(--tt-green);
  font-size: clamp(.92rem, 1vw, 1rem);
  font-weight: 700;
}
.tt-experience-footer .tt-footer-privacy-note {
  margin-top: 0;
  margin-bottom: .55rem;
  font-size: clamp(.76rem, .86vw, .86rem);
}
.tt-experience-footer .tt-footer-brand {
  margin-top: 0;
  margin-bottom: 0;
  color: #5d6b61;
  font-size: clamp(.75rem, .84vw, .84rem);
  font-weight: 600;
}
.tt-experience-footer .tt-footer-copyright,
.tt-experience-footer .tt-footer-tagline-line { display: inline; }
.tt-experience-footer .tt-footer-tagline-line::before { content: " · "; }
.tt-experience-footer a {
  color: var(--tt-green);
  font-weight: 700;
  text-underline-offset: .18em;
}
.tt-experience-footer a:hover,
.tt-experience-footer a:focus-visible { color: var(--tt-pink); }
.tt-experience-footer a:focus-visible {
  outline: 3px solid rgba(240,60,112,.25);
  outline-offset: 3px;
  border-radius: 3px;
}
@media (max-width:760px) {
  .tt-experience-footer {
    width: calc(100% - 1.2rem);
    margin-top: 1rem;
    padding: 1rem .85rem 1.5rem;
  }
  .tt-experience-footer .tt-footer-message { font-size: .88rem; }
  .tt-experience-footer .tt-footer-privacy-note,
  .tt-experience-footer .tt-footer-brand { font-size: .73rem; }
  .tt-experience-footer .tt-footer-copyright,
  .tt-experience-footer .tt-footer-tagline-line { display:block; }
  .tt-experience-footer .tt-footer-tagline-line { margin-top:.12rem; }
  .tt-experience-footer .tt-footer-tagline-line::before { content:""; }
}


/* v24: make episode navigation clearly tappable/readable without turning it into heavy buttons. */
.tt-back-link:hover, .tt-back-link:focus-visible,
.tt-episode-nav-link:hover, .tt-episode-nav-link:focus-visible {
  text-decoration: underline;
  text-underline-offset: 3px;
}
@media (max-width:760px){
  .tt-back-link { font-size:14px; min-height:44px; padding:7px 2px; }
  .tt-episode-nav-link { min-height:44px; display:inline-flex; align-items:center; }
}