/* Connected chapters: the person gives way to the device through native scrolling. */
.welcome-loader { display:none; position:fixed; inset:0; z-index:20000; background:#101114; color:#ffe5db; align-items:center; justify-content:center; flex-direction:column; gap:16px; font:14px/1.5 system-ui,sans-serif; touch-action:none; }
.welcome-loading .welcome-loader { display:flex; }
.welcome-loading body > :not(.welcome-loader) { visibility:hidden; }
.welcome-loading .welcome-intro { animation:none; }
.welcome-spinner { width:32px; height:32px; border:2px solid #393c44; border-top-color:#ff6b35; border-radius:50%; animation:welcome-spin .8s linear infinite; }
@keyframes welcome-spin { to { transform:rotate(360deg); } }
.cinematic-welcome { --welcome-text:#fffaf7; --welcome-detail:#ffe5db; --welcome-accent:#ff976f; }
.home-restyle main .cinematic-welcome :is(h1,h2) { color:var(--welcome-text); }
.home-restyle.welcome-entering .header-main { transition:none; }
.cinematic-welcome { background:#101114; }
/* The last reading stretch dissolves the film into the page surface below. */
.cinematic-outro { display:none; }
.cinematic-enhanced .cinematic-outro { display:block; position:absolute; inset:0; z-index:2; background:#101114; opacity:0; pointer-events:none; }
.cinematic-welcome .cinematic-poster { object-position:center top; }
.cinematic-welcome.cinematic-enhanced .cinematic-poster { visibility:visible; }
.cinematic-welcome .cinematic-chapter h1 { font-size:clamp(40px,4.5vw,68px); line-height:1.07; letter-spacing:-.04em; max-width:17ch; margin:24px 0; }
.cinematic-welcome h1 span { display:block; color:var(--welcome-accent); }
.cinematic-welcome .home-location { color:var(--welcome-accent); letter-spacing:.07em; }
.welcome-description { color:var(--welcome-detail); max-width:35ch; line-height:1.7; margin-bottom:28px; font-size:16px; }
.cinematic-welcome .home-button-dark { background:#ff6b35; border:1px solid var(--welcome-accent); transition:background-color 180ms ease,border-color 180ms ease; }
.cinematic-welcome .home-button-dark:is(:hover,:focus-visible) { background:var(--welcome-detail); border-color:var(--welcome-detail); }
.cinematic-welcome .cinematic-meter::before { background:var(--welcome-accent); }
.cinematic-welcome :is(a,button):focus-visible { outline-color:var(--welcome-detail); }
.cinematic-welcome .cinematic-chapter { width:43%; }
.cinematic-welcome .cinematic-shade { background:linear-gradient(90deg,rgba(20,18,16,.86),rgba(20,18,16,.32) 36%,transparent 65%); }
.home-restyle.welcome-in-view #backToTop { visibility:hidden; opacity:0; pointer-events:none; }
.welcome-ready [data-chapter="opening"] .welcome-intro { animation:welcome-arrive .75s cubic-bezier(.23,1,.32,1) both; }
.cinematic-welcome .cinematic-computer h2 { font-size:clamp(36px,4vw,58px); line-height:1.12; letter-spacing:-.035em; max-width:18ch; }
.cinematic-welcome .cinematic-computer h2 span { display:block; color:var(--welcome-accent); }
.cinematic-welcome .cinematic-stage[data-copy-side="right"] .cinematic-shade { background:linear-gradient(270deg,rgba(20,18,16,.94),rgba(20,18,16,.88) 44%,transparent 78%); }
@keyframes welcome-arrive { from { opacity:0; transform:translate3d(-32px,22px,0); } to { opacity:1; transform:translate3d(0,0,0); } }
.cinematic-welcome:not(.cinematic-enhanced) .cinematic-chapter { width:100%; }
.cinematic-welcome:not(.cinematic-enhanced) .cinematic-poster { width:100%; object-fit:cover; }
.cinematic-welcome:not(.cinematic-enhanced) .welcome-description { color:var(--welcome-detail); }
@media(max-width:767px) {
 .cinematic-welcome .cinematic-poster { object-position:center; }
 .cinematic-welcome.cinematic-enhanced .cinematic-chapter { width:100%; top:20px; }
 .cinematic-welcome .cinematic-chapter h1 { font-size:clamp(28px,8vw,36px); max-width:22ch; line-height:1.08; margin:12px 0 18px; }
 .cinematic-welcome .home-location { font-size:11px; margin:0; }
 .cinematic-welcome.cinematic-enhanced .welcome-description { display:none; }
 .cinematic-welcome.cinematic-enhanced .cinematic-computer .welcome-description { display:block; font-size:14px; line-height:1.6; max-width:32ch; margin-bottom:20px; }
 .cinematic-welcome .cinematic-computer h2 { font-size:clamp(28px,8vw,36px); line-height:1.12; margin:12px 0 18px; }
 .cinematic-welcome .cinematic-stage[data-copy-side="right"] .cinematic-shade { background:linear-gradient(180deg,rgba(20,18,16,.94),rgba(20,18,16,.90) 55%,rgba(20,18,16,.15) 85%); }
 .cinematic-welcome .cinematic-shade { background:linear-gradient(180deg,rgba(20,18,16,.85),rgba(20,18,16,.3) 28%,transparent 46%); }
}
@media(max-width:767px) and (max-height:700px) {
 .cinematic-welcome.cinematic-enhanced .cinematic-chapter { top:12px; }
 .cinematic-welcome .cinematic-chapter h1 { font-size:28px; margin:8px 0 12px; }
 .cinematic-welcome .cinematic-computer h2 { font-size:28px; margin:8px 0 12px; }
}
@media(min-width:768px) and (max-height:700px) {
 .cinematic-welcome .cinematic-chapter h1 { font-size:clamp(36px,3.5vw,48px); margin:16px 0; }
 .cinematic-welcome .welcome-description { font-size:14px; margin-bottom:20px; }
 .cinematic-welcome .cinematic-computer h2 { font-size:clamp(32px,3.5vw,46px); margin:16px 0; }
}
@media(prefers-reduced-motion:reduce) { .welcome-ready .welcome-intro, .welcome-spinner { animation:none; } }

/* Clean frame: while the film owns the viewport it runs edge to edge under a transparent
   header; floating site widgets step aside and the controls read as a film timeline. */
.cinematic-welcome.cinematic-enhanced .cinematic-stage { top:0; height:100svh; }
.cinematic-welcome.cinematic-enhanced .cinematic-chapter { top:calc(50% + var(--story-header) / 2); }
.home-restyle .header { transition:background-color 300ms ease, border-color 300ms ease; }
.home-restyle .header::before { content:''; position:absolute; inset:0 0 -56px; z-index:-1; background:linear-gradient(180deg,rgba(16,17,20,.8),rgba(16,17,20,0)); opacity:0; transition:opacity 300ms ease; pointer-events:none; }
.home-restyle.welcome-in-view .header, .home-restyle.welcome-in-view .header-main { background:transparent; border-color:transparent; box-shadow:none; }
.home-restyle.welcome-in-view .header::before { opacity:1; }
.home-restyle .whatsapp-sticky { transition:opacity 300ms ease, transform 300ms ease, visibility 300ms; }
.home-restyle.welcome-in-view .whatsapp-sticky { opacity:0; visibility:hidden; transform:translateY(16px); pointer-events:none; }
.cinematic-timeline { justify-content:flex-start; gap:24px; font:13px/1.2 Inter,sans-serif; color:#ffe5db; text-shadow:0 1px 12px rgba(16,17,20,.7); }
.cinematic-timeline::before { content:''; position:absolute; left:-50vw; right:-50vw; bottom:-24px; height:156px; z-index:-1; background:linear-gradient(0deg,rgba(16,17,20,.86) 0%,rgba(16,17,20,.6) 45%,rgba(16,17,20,0) 100%); pointer-events:none; }
.cinematic-timeline .cinematic-meter { flex:none; width:120px; height:2px; background:rgba(255,229,219,.25); }
.cinematic-chapters { display:flex; gap:24px; margin:0; padding:0; list-style:none; }
.cinematic-chapters button { display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0; border:0; background:none; font:inherit; color:rgba(255,229,219,.8); transition:color 180ms ease; }
.cinematic-chapters b { font-weight:600; font-variant-numeric:tabular-nums; }
.cinematic-chapters button[aria-current] { color:#fffaf7; }
.cinematic-chapters button[aria-current] b { color:#ff976f; }
.cinematic-timeline .cinematic-skip { display:inline-flex; align-items:center; gap:8px; margin-left:auto; min-height:44px; padding:0; border:0; border-radius:0; background:none; font:inherit; color:#ffe5db; }
.cinematic-timeline :is(button):focus-visible { outline:2px solid #ffe5db; outline-offset:4px; }
@media(hover:hover) and (pointer:fine) { .cinematic-chapters button:hover, .cinematic-timeline .cinematic-skip:hover { color:#fffaf7; } }
/* Consent stays available without covering the opening copy: one slim row above the timeline. */
.home-restyle #cookie-banner { left:auto !important; right:96px !important; bottom:76px !important; transform:none !important; width:auto !important; max-width:calc(100% - 32px) !important; margin:0 !important; }
.home-restyle #cookie-banner .card { border-radius:8px !important; background:rgba(16,17,20,.94) !important; }
.home-restyle #cookie-banner .card-body { padding:10px 12px 10px 16px !important; }
.home-restyle #cookie-banner .card-body > div { flex-direction:row !important; align-items:center !important; gap:16px !important; }
.home-restyle #cookie-banner strong { display:inline !important; font-size:13px; font-weight:500 !important; margin:0 !important; }
.home-restyle #cookie-banner strong i { display:none; }
.home-restyle #cookie-banner small { display:block; font-size:0 !important; margin-top:2px; }
.home-restyle #cookie-banner small a { font-size:12px; }
.home-restyle #cookie-banner .ms-md-3 { margin-left:0 !important; }
@media(max-width:767px) {
 .cinematic-welcome.cinematic-enhanced .cinematic-chapter { top:calc(var(--story-header) + 16px); }
 .cinematic-timeline { gap:12px; font-size:12px; }
 .cinematic-timeline .cinematic-meter { width:40px; }
 .cinematic-chapters button:not([aria-current]) span { display:none; }
 .cinematic-chapters { gap:12px; }
 .home-restyle #cookie-banner { left:16px !important; bottom:64px !important; }
 .home-restyle #cookie-banner .card-body > div { flex-direction:column !important; align-items:stretch !important; gap:10px !important; }
}
@media(max-width:767px) and (max-height:700px) {
 .cinematic-welcome.cinematic-enhanced .cinematic-chapter { top:calc(var(--story-header) + 8px); }
}
/* One lens over every clip: blacks lifted to the page graphite so film and page share a
   surface, a soft vignette, and a fine grain that makes separately generated clips read
   as one camera. The grain moves by transform only, and only while the film is on screen. */
.cinematic-grade { display:none; }
/* No z-index here or on the canvas: a stacking context would isolate the blends from the film. */
.cinematic-welcome.cinematic-enhanced .cinematic-canvas { z-index:auto; }
.cinematic-enhanced .cinematic-grade { display:block; position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.cinematic-grade::before { content:''; position:absolute; inset:0; background:#101114; mix-blend-mode:lighten; }
.cinematic-grade::after { content:''; position:absolute; inset:0; background:radial-gradient(125% 95% at 50% 45%,rgba(16,17,20,0) 52%,rgba(16,17,20,.5) 100%); }
.cinematic-grade > i { position:absolute; inset:-10%; background:url(../../img/home/film-grain.png) 0 0 / 160px 160px; opacity:.09; mix-blend-mode:overlay; animation:film-grain 1s steps(1) infinite paused; will-change:transform; }
.home-restyle.welcome-in-view .cinematic-grade > i { animation-play-state:running; }
@keyframes film-grain { 0% { transform:translate(0,0); } 12% { transform:translate(-5%,3%); } 25% { transform:translate(4%,-6%); } 37% { transform:translate(-7%,-2%); } 50% { transform:translate(3%,7%); } 62% { transform:translate(-3%,-5%); } 75% { transform:translate(6%,2%); } 87% { transform:translate(-2%,6%); } }
@media(prefers-reduced-motion:reduce) { .cinematic-grade > i { animation:none; } }
/* Chapter 03, the handover: copy on the quiet counter side, same voice as chapter 02. */
.cinematic-welcome .cinematic-delivery h2 { font-size:clamp(36px,4vw,58px); line-height:1.12; letter-spacing:-.035em; max-width:18ch; }
.cinematic-welcome .cinematic-delivery h2 span { display:block; color:var(--welcome-accent); }
.cinematic-welcome[data-chapter="delivery-reading"] .cinematic-shade { background:linear-gradient(90deg,rgba(20,18,16,.94),rgba(20,18,16,.85) 40%,transparent 72%); }
@media(max-width:767px) {
 .cinematic-welcome.cinematic-enhanced .cinematic-delivery .welcome-description { display:block; font-size:14px; line-height:1.6; max-width:32ch; margin-bottom:20px; }
 .cinematic-welcome .cinematic-delivery h2 { font-size:clamp(28px,8vw,36px); line-height:1.12; margin:12px 0 18px; }
 .cinematic-welcome[data-chapter="delivery-reading"] .cinematic-shade { background:linear-gradient(180deg,rgba(20,18,16,.94),rgba(20,18,16,.88) 50%,rgba(20,18,16,.15) 80%); }
}
@media(max-width:767px) and (max-height:700px) { .cinematic-welcome .cinematic-delivery h2 { font-size:28px; margin:8px 0 12px; } }
@media(min-width:768px) and (max-height:700px) { .cinematic-welcome .cinematic-delivery h2 { font-size:clamp(32px,3.5vw,46px); margin:16px 0; } }
/* Chapter 04: the isolated phone turns on the page graphite; three short steps on the left. */
.cinematic-welcome .cinematic-choosing h2 { font-size:clamp(40px,4.6vw,68px); line-height:1.04; letter-spacing:-.04em; max-width:12ch; }
.cinematic-welcome .cinematic-choosing h2 span { display:block; color:var(--welcome-accent); }
.cinematic-choosing .home-actions { gap:12px; }
.cinematic-skip-arrow { font-size:18px; line-height:1; }
/* The reading pose leaves the scene alone: copy on the left, and what is in the shop today
   (current flyer first, then live stock) on one open shelf along the floor of the frame. */
.cinematic-choosing .home-actions { align-items:stretch; }
.cinematic-choosing .home-button { min-height:52px; padding-block:0; }
.cinematic-welcome.cinematic-enhanced .cinematic-choosing.has-shelf { top:var(--story-header,84px); bottom:112px; transform:none; width:100%; max-width:none; }
.cinematic-enhanced .has-shelf .welcome-intro { display:flex; flex-direction:column; height:100%; }
.cinematic-enhanced .has-shelf .cinematic-choosing-copy { width:43%; max-width:560px; margin-block:auto; }
.cinematic-shelf { position:relative; margin-top:40px; }
.cinematic-enhanced .cinematic-shelf::before { content:''; position:absolute; z-index:-1; left:-50vw; right:-50vw; top:-96px; bottom:-140px; background:linear-gradient(0deg,rgba(16,17,20,.96) 50%,rgba(16,17,20,0)); pointer-events:none; }
.home-restyle main .cinematic-shelf-title { margin:0 0 64px; font-family:inherit; font-size:12px; font-weight:400; letter-spacing:0; color:#bfc2c9; }
.cinematic-shelf-list { display:flex; align-items:stretch; gap:16px; margin:0; padding:0; list-style:none; }
.cinematic-shelf-list > li { display:flex; flex:1 1 0; min-width:0; }
.cinematic-shelf-list > .cinematic-shelf-flyer { flex-grow:1.7; }
/* The shelf brings its own floor shade, so the timeline's taller wash steps back here. */
.cinematic-welcome[data-chapter^="choosing"] .cinematic-timeline::before { height:64px; }
.cinematic-shelf-item { position:relative; display:flex; align-items:center; gap:14px; width:100%; min-height:100px; padding:12px 14px 12px 12px; color:var(--welcome-text); text-decoration:none; background:#17191e; border:1px solid #393c44; border-radius:4px; transition:border-color 180ms ease-out, background-color 180ms ease-out; }
.cinematic-shelf-thumb { position:relative; display:grid; place-items:center; flex:none; width:74px; height:74px; overflow:hidden; background:#202228; border-radius:4px; }
.cinematic-shelf-thumb img { display:block; width:100%; height:100%; object-fit:contain; padding:6px; }
.cinematic-shelf-thumb > i { color:var(--welcome-accent); font-size:32px; }
.cinematic-shelf-grade { position:absolute; right:4px; bottom:4px; min-width:24px; padding:2px 5px; border-radius:4px; background:#101114; color:var(--welcome-text); font-size:11px; font-weight:600; line-height:1.3; text-align:center; }
.cinematic-shelf-details { display:flex; flex-direction:column; gap:3px; flex:1; min-width:0; }
.cinematic-shelf-kind { color:var(--welcome-accent); font-size:11px; font-variant-numeric:tabular-nums; }
.cinematic-shelf-name { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; color:#d5d8dc; font-size:13px; line-height:1.4; overflow-wrap:anywhere; }
.cinematic-shelf-details strong { margin-top:2px; font-family:Poppins,sans-serif; font-size:20px; font-weight:600; line-height:1.2; letter-spacing:-.01em; color:var(--welcome-text); font-variant-numeric:tabular-nums; white-space:nowrap; }
.cinematic-shelf-item:focus-visible { outline:2px solid var(--welcome-accent); outline-offset:4px; }
/* The current flyer is the one loud object: an orange offer card with its cover pinned above it. */
.cinematic-shelf-flyer .cinematic-shelf-item { padding-left:148px; background:#ff6b35; border-color:#ff6b35; color:#17191e; }
.cinematic-shelf-flyer :is(.cinematic-shelf-kind,.cinematic-shelf-name,.cinematic-shelf-cta) { color:#17191e; }
.cinematic-shelf-flyer .cinematic-shelf-kind { font-weight:500; }
.home-restyle main .cinematic-shelf-flyer .cinematic-shelf-name { -webkit-line-clamp:1; font-family:Poppins,sans-serif; font-size:20px; font-weight:600; line-height:1.25; letter-spacing:-.015em; }
.cinematic-shelf-cta { display:inline-flex; align-items:center; gap:8px; margin-top:4px; font-size:13px; font-weight:600; }
.cinematic-shelf-cover { position:absolute; left:16px; bottom:12px; display:grid; place-items:center; width:116px; height:162px; overflow:hidden; background:#202228; border-radius:4px; box-shadow:0 18px 36px rgba(16,17,20,.95), 0 2px 6px rgba(16,17,20,.95); transform:rotate(-4deg); transform-origin:50% 100%; transition:transform 260ms cubic-bezier(.23,1,.32,1); }
.cinematic-shelf-cover img { display:block; width:100%; height:100%; object-fit:cover; }
.cinematic-shelf-cover > i { color:var(--welcome-accent); font-size:40px; }
@media(hover:hover) and (pointer:fine) {
 .cinematic-shelf-product:hover { border-color:var(--welcome-accent); background:#202228; }
 .cinematic-shelf-flyer .cinematic-shelf-item:hover { background:#ffe5db; border-color:#ffe5db; }
 .cinematic-shelf-flyer .cinematic-shelf-item:hover .cinematic-shelf-cover { transform:rotate(-1deg) translateY(-6px); }
}
@media(min-width:1101px) and (max-width:1360px) {
 .cinematic-shelf-list { gap:12px; }
 .cinematic-shelf-item { gap:10px; padding:10px; }
 .cinematic-shelf-thumb { width:56px; height:56px; }
 .cinematic-shelf-thumb > i { font-size:26px; }
 .cinematic-shelf-cover { left:12px; width:100px; height:140px; }
 .cinematic-shelf-flyer .cinematic-shelf-item { padding-left:124px; }
 .cinematic-shelf-details strong, .home-restyle main .cinematic-shelf-flyer .cinematic-shelf-name { font-size:18px; }
}
/* Narrower stages scroll the shelf sideways; the cover then sits inside its card. */
.cinematic-welcome:not(.cinematic-enhanced) .cinematic-shelf-list { overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; overscroll-behavior-x:contain; }
@media(max-width:1100px) {
 .cinematic-shelf-list { overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; overscroll-behavior-x:contain; }
 .cinematic-shelf-list::-webkit-scrollbar { display:none; }
}
@media(max-width:1100px) { .cinematic-shelf-list > li { flex:0 0 230px; scroll-snap-align:start; } .cinematic-shelf-list > .cinematic-shelf-flyer { flex-basis:300px; } }
.cinematic-welcome:not(.cinematic-enhanced) .cinematic-shelf-list > li { flex:0 0 230px; scroll-snap-align:start; }
.cinematic-welcome:not(.cinematic-enhanced) .cinematic-shelf-list > .cinematic-shelf-flyer { flex-basis:300px; }
@media(max-width:1100px) {
 .home-restyle main .cinematic-shelf-title { margin-bottom:14px; }
 .cinematic-shelf-flyer .cinematic-shelf-item { padding-left:12px; }
 .cinematic-shelf-cover { position:static; flex:none; width:58px; height:80px; box-shadow:0 6px 14px rgba(16,17,20,.6); transform:rotate(-3deg); }
}
.home-restyle main .cinematic-welcome:not(.cinematic-enhanced) .cinematic-shelf-title { margin-bottom:14px; }
.cinematic-welcome:not(.cinematic-enhanced) .cinematic-shelf-flyer .cinematic-shelf-item { padding-left:12px; }
.cinematic-welcome:not(.cinematic-enhanced) .cinematic-shelf-cover { position:static; flex:none; width:58px; height:80px; transform:rotate(-3deg); }
@media(min-width:768px) and (max-height:700px) {
 .cinematic-welcome.cinematic-enhanced .cinematic-choosing.has-shelf { bottom:96px; }
 .cinematic-shelf { margin-top:24px; }
 .home-restyle main .cinematic-shelf-title { margin-bottom:46px; }
 .cinematic-shelf-item { min-height:84px; }
 .cinematic-shelf-thumb { width:60px; height:60px; }
 .cinematic-shelf-cover { width:92px; height:128px; }
 .cinematic-shelf-flyer .cinematic-shelf-item { padding-left:122px; }
 .cinematic-shelf-details strong, .home-restyle main .cinematic-shelf-flyer .cinematic-shelf-name { font-size:18px; }
}
@media(min-width:768px) and (max-width:1100px) and (max-height:700px) { .home-restyle main .cinematic-shelf-title { margin-bottom:14px; } .cinematic-shelf-flyer .cinematic-shelf-item { padding-left:12px; } .cinematic-shelf-cover { width:52px; height:72px; } }
@media(max-width:767px) {
 .cinematic-welcome.cinematic-enhanced .cinematic-choosing.has-shelf { top:calc(var(--story-header,64px) + 8px); bottom:auto; }
 .cinematic-enhanced .has-shelf .welcome-intro { height:auto; }
 .cinematic-enhanced .has-shelf .cinematic-choosing-copy { width:100%; margin:0; }
 .cinematic-shelf { margin-top:22px; }
 .cinematic-enhanced .cinematic-shelf::before { display:none; }
 .home-restyle main .cinematic-shelf-title { margin-bottom:10px; }
 .cinematic-shelf-list { gap:10px; margin-right:-20px; padding-right:20px; }
 .cinematic-shelf-list > li { flex-basis:212px; }
 .cinematic-shelf-list > .cinematic-shelf-flyer { flex-basis:252px; }
 .cinematic-shelf-item { gap:10px; min-height:84px; padding:10px; }
 .cinematic-shelf-thumb { width:56px; height:56px; }
 .cinematic-shelf-thumb > i { font-size:26px; }
 .cinematic-shelf-cover { width:48px; height:66px; }
 .cinematic-shelf-name { font-size:12px; }
 .cinematic-shelf-details strong, .home-restyle main .cinematic-shelf-flyer .cinematic-shelf-name { font-size:17px; }
}
@media(prefers-reduced-motion:reduce) { .cinematic-shelf-cover { transform:none; transition:none; } .cinematic-shelf-item { transition:none; } }
/* A photographic memory: the real founders' cutout, an opening year and a reversible return to color. */
.cinematic-welcome.cinematic-enhanced .cinematic-human { width:100%; max-width:none; }
.cinematic-human .welcome-intro { display:grid; grid-template-columns:.85fr 1.15fr; align-items:center; gap:48px; }
.cinematic-welcome .cinematic-human h2 { font-size:clamp(32px,3.8vw,56px); line-height:1.12; letter-spacing:-.035em; max-width:18ch; margin:20px 0; }
.cinematic-human h2 span { display:block; }
.cinematic-human .welcome-description { max-width:37ch; }
.cinematic-human-photo { margin:0; min-width:0; }
.cinematic-human-photo img { display:block; width:100%; height:auto; border-radius:4px; }
.cinematic-human-photo figcaption { color:#bfc2c9; font-size:12px; line-height:1.5; margin-top:14px; max-width:54ch; }
.founders-memory { position:relative; padding-top:56px; transform:translate3d(0,var(--memory-lift,0px),0) scale(var(--memory-scale,1)); transform-origin:50% 80%; }
.founders-year { position:absolute; top:0; left:50%; transform:translate3d(-50%,var(--memory-year-offset,0px),0); color:#bfc2c9; opacity:.16; font-family:Poppins,sans-serif; font-size:clamp(96px,18vw,240px); font-weight:600; line-height:1; letter-spacing:-.04em; pointer-events:none; user-select:none; }
.founders-portraits { position:relative; mask-image:linear-gradient(#000 0%,#000 76%,transparent 100%); }
.cinematic-human-photo .founders-portraits img { border-radius:0; }
.founders-monochrome { filter:grayscale(1) sepia(.08) contrast(.96); opacity:var(--memory-old,0); }
.founders-portraits .founders-color { position:absolute; inset:0; width:100%; height:100%; opacity:calc(var(--memory-color,1) * var(--memory-old,0)); }
.founders-present { position:absolute; bottom:0; left:0; width:100%; opacity:var(--memory-now,1); }
.founders-blend-canvas { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.has-founders-webgl .founders-monochrome,.has-founders-webgl .founders-color,.has-founders-webgl .founders-present { opacity:0; }
.cinematic-welcome:not(.cinematic-enhanced) .founders-monochrome,.cinematic-welcome:not(.cinematic-enhanced) .founders-color { display:none; }
.cinematic-welcome:not(.cinematic-enhanced) .founders-present { position:relative; }
.cinematic-human-photo:has(.founders-memory) figcaption { margin-top:-20px; position:relative; text-align:center; }
@media(min-width:768px) and (max-height:700px) {
 .cinematic-human .welcome-intro { gap:40px; }
 .cinematic-welcome .cinematic-human h2 { font-size:36px; margin:12px 0; }
 .cinematic-human .welcome-description { font-size:14px; margin-bottom:18px; }
 .cinematic-human-photo { max-width:540px; justify-self:end; }
 .founders-memory { padding-top:40px; }
}
@media(max-width:767px) {
 .cinematic-human .welcome-intro { grid-template-columns:1fr; gap:24px; }
 .cinematic-welcome .cinematic-human h2 { font-size:clamp(28px,7.6vw,36px); margin:10px 0 14px; }
 .cinematic-welcome.cinematic-enhanced .cinematic-human .welcome-description { display:block; font-size:14px; line-height:1.6; margin-bottom:18px; }
 .cinematic-human-photo { width:100%; max-width:400px; }
 .founders-memory { padding-top:40px; }
 .founders-year { font-size:clamp(96px,30vw,160px); }
 .cinematic-human-photo figcaption { font-size:11px; margin-top:10px; }
 .cinematic-human .home-button { padding:12px 16px; font-size:12px; }
 .cinematic-timeline { gap:12px; }
 .cinematic-chapters { gap:12px; }
}
@media(max-width:767px) and (max-height:760px) {
 .cinematic-human .welcome-intro { gap:18px; }
 .cinematic-welcome .cinematic-human h2 { font-size:28px; margin:8px 0 10px; }
 .cinematic-welcome.cinematic-enhanced .cinematic-human .welcome-description { font-size:13px; line-height:1.5; margin-bottom:12px; }
 .cinematic-human-photo { max-width:300px; }
 .founders-memory { padding-top:32px; }
 .cinematic-human-photo figcaption { max-width:36ch; }
}
@media(prefers-reduced-motion:reduce) { .founders-memory { transform:none; } .founders-year { transform:translateX(-50%); } .founders-present { opacity:1; } }
@media(max-width:767px) {
 .cinematic-welcome.cinematic-enhanced .cinematic-choosing .welcome-description { display:block; font-size:14px; line-height:1.6; max-width:30ch; margin-bottom:16px; }
 .cinematic-welcome .cinematic-choosing h2 { font-size:clamp(32px,9vw,40px); margin:10px 0 14px; }
 .cinematic-choosing .home-actions { gap:8px; }
 .cinematic-choosing .home-button { min-height:44px; padding:0 16px; font-size:12px; }
}
/* Five chapter targets remain available on small phones; the labelled skip uses its arrow. */
@media(max-width:479px) {
 .cinematic-timeline { gap:10px; }
 .cinematic-timeline .cinematic-meter { position:absolute; top:-8px; left:0; width:100%; }
 .cinematic-chapters { gap:8px; }
 .cinematic-timeline .cinematic-skip { font-size:0; min-width:44px; justify-content:center; gap:0; }
 .cinematic-timeline .cinematic-skip-arrow { font-size:18px; }
}
.cinematic-welcome .cinematic-step h2 { font-size:clamp(40px,4.6vw,68px); line-height:1.04; letter-spacing:-.04em; max-width:12ch; }
.cinematic-welcome .cinematic-step h2 span { display:block; color:var(--welcome-accent); }
.cinematic-welcome .cinematic-step .home-location { font-variant-numeric:tabular-nums; }
.cinematic-welcome:not(.cinematic-enhanced) .cinematic-step:not([data-chapter="repair-3"]) { padding-bottom:0; }
@media(max-width:767px) {
 .cinematic-welcome.cinematic-enhanced .cinematic-step .welcome-description { display:block; font-size:14px; line-height:1.6; max-width:30ch; margin-bottom:16px; }
 .cinematic-welcome .cinematic-step h2 { font-size:clamp(32px,9vw,40px); margin:10px 0 14px; }
}