:root{--strength:#3a6332;--running:#a82223;--nutrition:#b99b45}
.tria-film{--film-top:100px;background:#e3e7dc;color:#243528;width:100%;position:relative}
.tria-film.is-scrollable{height:calc(100svh + 1250px)}
.tria-film-stage{position:relative;background:#e3e7dc;padding:0;overflow:hidden}
.is-scrollable .tria-film-stage{position:sticky;top:var(--film-top)}
.tria-film-picture{position:relative;width:100%;height:min(56.25vw,calc(100svh - var(--film-top) - 112px));background:#1d3027}
.tria-film-picture img,.tria-film-picture video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;border:0}
.tria-film-picture video{opacity:0;pointer-events:none}
.is-ready .tria-film-picture video{opacity:1}
.tria-film-caption{min-height:104px;padding:20px clamp(20px,5vw,80px);display:flex;align-items:center;justify-content:space-between;gap:20px}
.tria-film-caption p{font:600 clamp(16px,2vw,25px)/1.3 'Manrope',sans-serif;letter-spacing:-.04em;margin:0;color:#243528}
.tria-film-caption>div{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex-shrink:0}
.tria-film-status{font-size:11px;letter-spacing:.04em}
.tria-film-caption button{font:inherit;font-size:11px;color:#344b38;border:0;border-bottom:1px solid #70816d;background:transparent;padding:3px 0;cursor:pointer}
.tria-film-progress{height:3px;background:#cdd6c4}
.tria-film-progress i{display:block;height:100%;background:#3a6332;transform:scaleX(0);transform-origin:left}
.hero.tria-film-intro{display:block;min-height:0;padding-top:65px;padding-bottom:65px;background:#f4f1e9}
.tria-film-intro .hero-copy{max-width:840px;margin:auto;text-align:center}
.tria-film-intro .hero-actions{justify-content:center}
.tria-film-intro h1{font-size:clamp(38px,5vw,72px)}
.pillar.red-card{background:#e0e7d7!important;border-color:#bdcdb6!important;color:#294a28}
.pillar.orange-card{background:#f0ded8!important;border-color:#d6b3a8!important;color:#702c27}
.pillar.green-card{background:#eee7c9!important;border-color:#d6c788!important;color:#665624}
.red-card .pillar-icon{color:var(--strength)}
.orange-card .pillar-icon{color:var(--running)}
.green-card .pillar-icon{color:#796322}
.ribbon .red,.week-preview .red{background:var(--strength)!important}
.ribbon .orange,.week-preview .orange{background:var(--running)!important}
.ribbon .green,.week-preview .green{background:var(--nutrition)!important}
.day[data-kind='strength']{background:#3a633212;border-left-color:var(--strength)}
.day[data-kind='strength'] .day-badge{background:var(--strength)}
.day[data-kind='run'],.day[data-kind='walk']{background:#a822230c;border-left-color:var(--running)}
.day[data-kind='run'] .day-badge,.day[data-kind='walk'] .day-badge{background:var(--running);color:#fff}
.meal{border-left:3px solid var(--nutrition)}
@media(max-width:700px){.tria-film{--film-top:78px}.tria-film.is-scrollable{height:calc(65svh + 850px)}.tria-film-picture{height:56.25vw}.tria-film-caption{padding:24px 20px;min-height:140px;display:block}.tria-film-caption>div{margin-top:20px;align-items:flex-start}.tria-film-caption p{font-size:19px;max-width:300px}.hero.tria-film-intro{padding:40px 22px}.tria-film-intro .hero-actions{flex-wrap:wrap}}

/* Fixed geometry: scrolling never changes the image scale. */
body:has(#landing:not([hidden]))>.header{position:absolute;inset:0 0 auto;z-index:5;max-width:none;border:0;color:#f0f3e9;background:linear-gradient(#162c2d99,transparent)}
body:has(#landing:not([hidden]))>.header .button{color:#f0f3e9;border-color:#e0ebdb66;background:#142c2533}
.tria-film{background:#1c332c}
.tria-film-stage{height:100svh;overflow:hidden;background:#1c332c}
.tria-film.is-scrollable{height:calc(100svh + 1200px)}
.is-scrollable .tria-film-stage{top:0}
.tria-film-picture{height:100%;width:100%;background:#1c332c}
.tria-film-picture img,.tria-film-picture canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.tria-film-picture canvas{opacity:0}
.is-ready .tria-film-picture canvas{opacity:1}
.tria-film-controls{position:absolute;bottom:35px;left:6%;right:6%;display:flex;align-items:center;justify-content:space-between;color:#f1f4e8;font-size:11px;text-shadow:0 1px 5px #000}
.tria-film-controls button{font:inherit;background:#18302788;border:1px solid #d4dfcc77;border-radius:30px;padding:10px 15px;color:#f1f4e8}
.tria-film-progress{position:absolute;bottom:0;left:0;right:0;background:#a3b4a544}
.tria-film-progress i{background:#cbd8af}
body{--paper:#dce3d6;--ink:#203c32;--muted:#53695c;--line:#adbcaa;background:var(--paper)}
.hero.tria-film-intro{max-width:none;background:linear-gradient(#1c332c,#29483b);color:#e8eee0;padding:70px 6% 90px}
.tria-film-phrase{text-align:center;font:500 clamp(17px,2.2vw,28px)/1.4 Manrope,sans-serif;letter-spacing:-.7px;color:#c5d2b4;margin:0 auto 70px}
.tria-film-intro .eyebrow{justify-content:center;color:#b5c9ad}
.tria-film-intro em{color:#bdcf9f}
.tria-film-intro .intro{margin-inline:auto;color:#d1dcc7}
.tria-film-intro .subtle{color:#c2d0b9}
.tria-film-intro .button{background:#bdcf9f;color:#203c32;border-color:#bdcf9f}
.tria-film-intro .text-button{color:#dbe6cf}
.ribbon{background:#29483b;color:#dbe6cf;border-color:#57705b}
.section-heading h2 span{color:#647e67}
.week-preview,.panel{background:#e6ebdf;border-color:#a9bca6;box-shadow:0 14px 45px #203c3209}
.week-preview{transform:none}
.pricing{background:#b7c8b3}
.price-card{background:#e7eddf;border-color:#92a78a}
.pillar{border-radius:16px;border:1px solid}
.pillar.red-card{background:#36553d!important;color:#e7eddf;border-color:#53744e!important}
.pillar.orange-card{background:#793e35!important;color:#fae9db;border-color:#8e5549!important}
.pillar.green-card{background:#c2ac67!important;color:#343e28;border-color:#ac9652!important}
.pillar .pillar-icon{color:inherit}
footer{background:#203c32;color:#dce6cf}
footer small{color:#adbea4}
@media(max-width:700px){
 .tria-film.is-scrollable{height:calc(100svh + 850px)}
 .tria-film-picture{height:100%;background:linear-gradient(#657f78,#1c332c)}
 .tria-film-picture img,.tria-film-picture canvas{object-fit:contain}
 .tria-film-controls{bottom:30px}
 .hero.tria-film-intro{padding:45px 22px 60px}
 .tria-film-phrase{margin-bottom:45px}
}
