main.tt-stories {
  --tt-primary:#1f6b4a; --tt-primary-dark:#155238;
  --tt-warm:#f7f4ef; --tt-warm-border:#e6dfd2;
  --tt-text:#141414; --tt-muted:#5a5a5a;
  --tt-accent:#d4a76a; --tt-navy:#0a1633;
  display:block; background:#fff; color:var(--tt-text);
}
main.tt-stories *, main.tt-stories *::before, main.tt-stories *::after { box-sizing:border-box; }

.tt-stories__hero { padding:88px 24px 44px !important; background:linear-gradient(180deg,#fff 0%,var(--tt-warm) 100%); text-align:center !important; }
.tt-stories__badge { display:inline-block; padding:7px 20px; background:var(--tt-primary); color:#fff !important; border-radius:999px; font-size:12px !important; font-weight:700 !important; letter-spacing:.15em; text-transform:uppercase; margin:0 0 24px !important; line-height:1.4 !important; }
.tt-stories__title { font-size:clamp(36px,5.6vw,64px) !important; font-weight:800 !important; line-height:1.05 !important; color:var(--tt-text) !important; margin:0 auto 18px !important; max-width:860px; letter-spacing:-.03em; text-align:center !important; }
.tt-stories__lede { font-size:17px !important; line-height:1.6 !important; color:var(--tt-muted) !important; margin:0 auto !important; max-width:640px; text-align:center !important; }
.tt-stories__count { margin:18px auto 0 !important; font-size:14px !important; font-weight:700 !important; color:var(--tt-primary) !important; text-align:center !important; min-height:1.4em; }

.tt-stories__section { padding:44px 24px 80px !important; background:var(--tt-warm); }
.tt-stories__section--learn { background:#fff; padding-top:80px !important; }
.tt-stories__wrap { max-width:1200px; margin:0 auto; }
.tt-stories__h2 { font-size:clamp(28px,3.6vw,40px) !important; font-weight:800 !important; line-height:1.15 !important; color:var(--tt-text) !important; text-align:center !important; margin:0 0 10px !important; letter-spacing:-.02em; }
.tt-stories__sub { font-size:16px !important; line-height:1.6 !important; color:var(--tt-muted) !important; text-align:center !important; margin:0 auto 32px !important; max-width:620px; }

.tt-stories__filters { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin:0 auto 36px; max-width:1000px; }
.tt-chip { appearance:none; -webkit-appearance:none; border:1px solid var(--tt-warm-border); background:#fff; color:var(--tt-text) !important; padding:10px 18px; border-radius:999px; font-family:inherit; font-size:14px !important; font-weight:700 !important; line-height:1.2 !important; cursor:pointer; transition:background .2s, color .2s, border-color .2s, transform .2s; }
.tt-chip:hover { border-color:var(--tt-primary); transform:translateY(-1px); }
.tt-chip:focus-visible { outline:3px solid var(--tt-accent); outline-offset:2px; }
.tt-chip[aria-pressed="true"] { background:var(--tt-primary); border-color:var(--tt-primary); color:#fff !important; }
.tt-chip__n { opacity:.6; font-weight:600; margin-left:6px; }

.tt-stories__grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:28px; }

.tt-vcard { background:#fff; border-radius:18px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.07); display:flex; flex-direction:column; text-align:center; }
.tt-stories__section--learn .tt-vcard { box-shadow:0 0 0 1px var(--tt-warm-border), 0 10px 30px rgba(0,0,0,.05); }
.tt-vcard__media { position:relative; aspect-ratio:16/9; background:var(--tt-navy); }
.tt-vcard__play { position:absolute; inset:0; width:100%; height:100%; padding:0; border:0; margin:0; cursor:pointer; background:#000; display:block; overflow:hidden; }
.tt-vcard__play:focus-visible { outline:3px solid var(--tt-accent); outline-offset:-3px; }
.tt-vcard__play img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease, opacity .3s ease; }
.tt-vcard__play:hover img { transform:scale(1.04); opacity:.88; }
.tt-vcard__icon { position:absolute; z-index:2; left:50%; top:50%; width:62px; height:62px; margin:-31px 0 0 -31px; border-radius:50%; background:rgba(31,107,74,.92); display:grid; place-items:center; box-shadow:0 8px 24px rgba(0,0,0,.3); transition:transform .2s ease; }
.tt-vcard__play.is-tall::before { content:""; position:absolute; inset:-10%; background:var(--thumb) center / var(--zoom) auto no-repeat; filter:blur(18px) brightness(.8) saturate(1.2); }
.tt-vcard__play.is-tall img { position:relative; z-index:1; clip-path:inset(0 var(--cr) 0 var(--cl)); }
.tt-vcard__play:hover .tt-vcard__icon { transform:scale(1.08); }
.tt-vcard__icon svg { width:24px; height:24px; margin-left:4px; fill:#fff; }
.tt-vcard iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.tt-vcard__body { padding:18px 20px 22px; display:flex; flex-direction:column; gap:12px; flex:1; }
.tt-vcard__title { font-size:17px !important; font-weight:700 !important; line-height:1.35 !important; color:var(--tt-text) !important; margin:0 !important; text-align:center !important; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.tt-vcard__tags { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; margin-top:auto; }
.tt-tag { font-size:12px !important; font-weight:700 !important; line-height:1.3 !important; padding:4px 10px; border-radius:999px; background:var(--tt-warm); color:var(--tt-primary) !important; }

.tt-stories__more { display:flex; justify-content:center; margin-top:40px; }
.tt-stories__more[hidden] { display:none; }
.tt-sbtn { display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:14px 28px; border-radius:999px; font-family:inherit; font-size:15px !important; font-weight:700 !important; line-height:1.2 !important; text-decoration:none !important; cursor:pointer; border:2px solid transparent; transition:transform .2s, box-shadow .2s, background .2s, color .2s; }
.tt-sbtn:focus-visible { outline:3px solid var(--tt-accent); outline-offset:2px; }
.tt-sbtn--ghost { background:#fff; color:var(--tt-primary) !important; border-color:var(--tt-primary); }
.tt-sbtn--ghost:hover { background:var(--tt-primary); color:#fff !important; }
.tt-sbtn--primary { background:var(--tt-accent); color:var(--tt-text) !important; }
.tt-sbtn--primary:hover { transform:translateY(-2px); box-shadow:0 12px 24px rgba(212,167,106,.35); }
.tt-sbtn--youtube { background:#ff0000; color:#fff !important; }
.tt-sbtn--youtube:hover { background:#c40000; transform:translateY(-2px); }
.tt-sbtn svg { width:20px; height:20px; fill:currentColor; }

.tt-stories__disclaimer { max-width:760px; margin:44px auto 0 !important; text-align:center !important; font-size:13px !important; line-height:1.6 !important; color:var(--tt-muted) !important; font-style:italic; }
.tt-stories__status { text-align:center !important; color:var(--tt-muted) !important; font-size:15px !important; margin:24px auto !important; }
.tt-stories__status a { color:var(--tt-primary) !important; font-weight:700; }

.tt-stories__cta { padding:80px 24px 88px !important; background:var(--tt-navy); text-align:center !important; }
.tt-stories__cta .tt-stories__h2 { color:#fff !important; }
.tt-stories__cta .tt-stories__sub { color:rgba(255,255,255,.72) !important; margin-bottom:0 !important; }
.tt-stories__ctas { display:flex; flex-wrap:wrap; justify-content:center; gap:14px; margin-top:30px; }

@media (max-width:900px) {
  .tt-stories__grid { grid-template-columns:repeat(2, 1fr); gap:20px; }
  .tt-stories__hero { padding:64px 20px 36px !important; }
}
@media (max-width:560px) {
  .tt-stories__grid { grid-template-columns:1fr; }
  .tt-stories__section { padding:36px 16px 64px !important; }
  .tt-stories__section--learn { padding-top:64px !important; }
  .tt-stories__filters { gap:8px; }
  .tt-chip { padding:9px 14px; font-size:13px !important; }
  .tt-stories__ctas .tt-sbtn { width:100%; }
}
@media (prefers-reduced-motion: reduce) {
  main.tt-stories * { transition:none !important; }
}
