/* page-tantara.css — extracted from design handoff */
.shero{position:relative;color:#fff;background:var(--p900);overflow:hidden}
.shero .bg{position:absolute;inset:0;background:url('album/jubile90_04.jpg') center 35%/cover}
.shero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(28,4,46,.96) 0%,rgba(59,10,92,.75) 55%,rgba(59,10,92,.2) 100%)}
.shero .wrap{position:relative;padding-top:100px;padding-bottom:90px}
.pill{display:inline-block;background:var(--gold);color:var(--p900);font-weight:900;font-size:14px;padding:9px 18px;border-radius:999px;letter-spacing:.04em}
.shero .kick{font:600 12.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-top:28px}
.shero h1{font-size:clamp(40px,6vw,80px);font-weight:900;letter-spacing:-.02em;line-height:1;margin:14px 0 16px;max-width:15ch}
.shero .tr{font-style:italic;font-weight:700;color:#e3d6f1;font-size:21px}
.band{background:var(--p700);color:#fff}
.band .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.band div div{padding:34px 24px;text-align:center;border-right:1px solid rgba(255,255,255,.14)}
.band div div:last-child{border-right:0}
.band b{display:block;font-size:56px;font-weight:900;color:var(--gold);line-height:1}
.band span{font-size:14.5px;color:#e3d6f1}
.story{display:grid;grid-template-columns:1.25fr .9fr;gap:56px}
.story h2{font-size:15px;font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--p500);margin:0 0 14px;display:flex;gap:10px;align-items:center}
.story h2::after{content:"";height:3px;width:40px;background:var(--gold)}
.story .lead{font-size:19px;color:var(--ink);margin-bottom:16px}
.story .em{color:var(--p500);font-weight:900}
.steps{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:0}
.steps li{display:grid;grid-template-columns:44px 120px 1fr;gap:14px;align-items:start;padding:16px 0;border-top:1px solid var(--line)}
.steps .n{width:36px;height:36px;border-radius:50%;background:var(--p700);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900}
.steps li:nth-child(even) .n{background:var(--p300)}
.steps b{color:var(--p700);font-size:17px;padding-top:6px}
.steps p{color:var(--ink2);padding-top:6px}
.side{background:var(--p50);border-radius:10px;padding:30px;align-self:start;position:sticky;top:96px}
.side h3{font-size:15px;font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--p500);margin-bottom:18px}
.chg{display:grid;gap:18px}
.chg div{display:grid;grid-template-columns:14px 1fr;gap:12px}
.chg i{width:12px;height:12px;border-radius:50%;background:var(--gold);margin-top:6px}
.chg b{color:var(--p700);font-size:17px}
.chg p{font-size:15px;color:var(--ink2)}
.next{background:var(--p700);color:#fff;border-radius:8px;padding:22px;margin-top:24px}
.next b{font-size:18px}
.next p{color:#d9c6ef;font-style:italic;margin-top:6px;font-size:15px}
.strip{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:56px}
.strip figure{margin:0;position:relative;border-radius:6px;overflow:hidden;aspect-ratio:4/3}
.strip img{width:100%;height:100%;object-fit:cover}
.strip figcaption{position:absolute;left:0;right:0;bottom:0;padding:24px 12px 10px;background:linear-gradient(0deg,rgba(77,0,110,.9),transparent);color:#fff;font-weight:900;font-size:14.5px}
.coh{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:26px}
.coh span{font:600 11.5px var(--mono);letter-spacing:.14em;color:var(--mute);text-transform:uppercase}
.coh em{font-style:normal;background:var(--p700);color:#fff;font-weight:900;font-size:13px;padding:6px 14px;border-radius:999px}
.coh small{color:var(--ink2);font-size:14px;margin-right:10px}
/* Story 2 */
.s2{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.s2 .ph{border-radius:10px;overflow:hidden;position:relative}
.s2 .ph img{width:100%;aspect-ratio:4/5;object-fit:cover}
.s2 .ph .pill{position:absolute;top:18px;left:18px}
.s2 h3{font-size:clamp(30px,3.6vw,46px);font-weight:900;color:var(--p700);line-height:1.05;margin:16px 0 18px}
.s2 .body p{margin-bottom:14px;color:var(--ink2)}
.s2 .body p:first-of-type::first-letter{font-size:64px;float:left;line-height:.85;font-weight:900;color:var(--p500);margin:6px 10px 0 0}
.quote{border-left:5px solid var(--gold);padding:6px 0 6px 22px;font-size:22px;font-weight:900;color:var(--p700);font-style:italic;margin:24px 0}
.learn{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
.learn div{background:#fff;border:1px solid var(--line);border-radius:6px;padding:14px 16px;font-size:15px;font-weight:700;color:var(--ink)}
.learn div::before{content:"●";color:var(--gold);margin-right:8px}
/* more */
.more{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.mcard{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px;display:flex;flex-direction:column}
.mcard .k{font:600 11.5px var(--mono);letter-spacing:.14em;color:var(--p500);text-transform:uppercase}
.mcard b{font-size:48px;font-weight:900;color:var(--p700);line-height:1;margin:14px 0 6px}
.mcard h4{font-size:19px;font-weight:900;margin-bottom:8px}
.mcard p{color:var(--ink2);font-size:15px;margin-bottom:18px}
.mcard a{margin-top:auto;font-weight:900;text-decoration:none}
.fiche{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
@media (max-width:1000px){
  .story,.s2{grid-template-columns:1fr}.side{position:static}
  .band .wrap{grid-template-columns:1fr 1fr}.band div div:nth-child(2){border-right:0}
  .strip{grid-template-columns:repeat(3,1fr)}
  .more{grid-template-columns:1fr}
  .steps li{grid-template-columns:44px 1fr}.steps p{grid-column:2}
}