/* Movimento progressivo: o conteúdo permanece legível sem JavaScript. */
.brand{display:inline-flex;align-items:center;flex-shrink:0;padding:0;font-size:inherit;letter-spacing:normal;line-height:1}
.brand-logo{width:122px;height:auto;object-fit:contain;max-height:76px}
.footer-top .brand-logo{width:155px;max-height:none}
.studio-header .brand-logo{width:104px;max-height:64px}
.scroll-story{--camera-x:57deg;--camera-z:-26deg;--lid-lift:225px;--lid-slide:-58px;--lid-opacity:0;--cue-travel:0px;--scatter:0;--model-scale:1;--story-progress:0;background:#111a16;color:var(--paper);position:relative;isolation:isolate}
.story-pin{position:relative;display:grid;grid-template-columns:39% 61%;padding:80px var(--space) 120px;align-items:center;min-height:740px;gap:0}
.story-copy{position:relative;z-index:3;min-width:0}
.story-copy>.eyebrow{color:#d6b69b;font-size:9px;margin-bottom:23px}
#story-heading{font-size:26px;letter-spacing:-.035em;line-height:1.3;color:#a9b5a4;font-weight:400;margin-bottom:35px}
.story-chapter-index{display:none;align-items:center;gap:12px;font-size:9px;color:#9cab96;margin-bottom:21px}
.story-current{color:var(--accent);font-size:14px}.story-index-line{height:1px;width:50px;background:#72866b55}
.story-step{margin-bottom:30px;max-width:365px}
.story-step h3{font-size:57px;line-height:1.08;font-weight:500;letter-spacing:-.055em;margin:0 0 22px}
.story-step p{font-size:12px;color:#b7c1b1;line-height:1.85;max-width:320px}
.story-collection-link{color:#f1bc99;font-size:10px;gap:12px;min-height:44px;max-width:100%}
.story-collection-link svg{width:17px}
.story-stage{position:relative;min-width:0;width:100%;height:520px;overflow-x:clip;overflow-y:visible;perspective:1200px;perspective-origin:50% 50%;z-index:1;--model-scale:.88}
.story-orbit{position:absolute;inset:3% 0;border:1px solid #8caa7922;border-radius:50%;background:radial-gradient(ellipse,#78996813,transparent 67%);transform:rotateZ(var(--ring-turn,0deg));pointer-events:none}
.story-backdrop-word{position:absolute;left:8%;top:20%;font-size:clamp(110px,13vw,190px);font-weight:800;letter-spacing:-.07em;-webkit-text-stroke:1px #c1d3b414;color:transparent;pointer-events:none}
.scene-fallback{position:absolute;width:100%;height:100%;object-fit:contain}
.scene-label{position:absolute;bottom:12px;left:0;right:0;text-align:center;font-size:8px;letter-spacing:.19em;color:#a2b296;z-index:2}
.scene-model{position:absolute;left:50%;top:62%;width:540px;height:300px;margin:-150px 0 0 -270px;transform:scale(var(--model-scale));transform-style:preserve-3d;pointer-events:none;display:none}
[data-render="3d"] .scene-model{display:block}[data-render="3d"] .scene-fallback{display:none}
.table-world{position:relative;width:540px;height:300px;transform-style:preserve-3d;transform:rotateX(var(--camera-x)) rotateZ(var(--camera-z));transform-origin:50% 50%}
.table-floor{position:absolute;left:-15px;top:-15px;width:570px;height:330px;background:radial-gradient(ellipse,#000b,transparent 72%);transform:translateZ(-5px);border-radius:50%}
.solid{position:absolute;width:var(--w);height:var(--d);transform-style:preserve-3d;--surface:#8f7154;--front:#634b36;--side:#3f382c}
.solid-face{position:absolute;display:block;backface-visibility:visible;border:1px solid #181c171c}
.solid-top{width:100%;height:100%;background:var(--surface);transform:translateZ(var(--h))}
.solid-front,.solid-back{width:100%;height:var(--h);background:var(--front);transform-origin:top;transform:rotateX(90deg)}
.solid-front{top:100%}.solid-back{top:0}
.solid-left,.solid-right{width:var(--h);height:100%;background:var(--side);transform-origin:left;transform:rotateY(-90deg)}
.solid-left{left:0}.solid-right{left:100%}
.table-leg{--surface:#39443a;--front:linear-gradient(90deg,#333e34,#4a5346 50%,#2d382f);--side:#28352b}
.table-body{--surface:#3f4d3f;--front:linear-gradient(0deg,#314135,#56604f);--side:linear-gradient(90deg,#28372d,#4a5746)}
.table-body .solid-front:after{content:'';position:absolute;left:22px;right:22px;height:1px;top:12px;background:#b6b99855}
.table-rail{--surface:linear-gradient(90deg,#a27e51,#bc9462,#907044);--front:#7a5b37;--side:#654d31}
.table-felt{position:absolute;inset:19px;background:radial-gradient(ellipse at 45% 30%,#3b7464,#285849 65%,#214b3f);transform:translateZ(173px);border:3px solid #234d40;box-shadow:inset 0 0 22px #0e2e2455}
.table-pocket{position:absolute;width:16px;height:16px;border-radius:50%;background:#0a1611;border:2px solid #514331;transform:translateZ(186px);box-shadow:inset 0 3px 4px #000b}
.table-diamond{position:absolute;width:5px;height:5px;background:#ddd6ae;transform:translateZ(186px) rotateZ(45deg)}
.table-lid{left:-4px;top:-4px;transform:translate3d(var(--lid-slide),-10px,calc(186px + var(--lid-lift)));--surface:linear-gradient(115deg,#b3a38b,#d1c4ac 42%,#d9ccb5 60%,#b5a68e);--front:#948367;--side:#7b705a;opacity:var(--lid-opacity)}
.table-lid .solid-top{box-shadow:inset 0 0 0 1px #eee6cf99,inset 0 0 0 5px #9b8a6c44;background-image:linear-gradient(115deg,#b3a38b,#d1c4ac 42%,#d9ccb5 60%,#b5a68e)}
.table-lid .solid-top:after{content:'';position:absolute;top:3px;bottom:3px;left:50%;width:1px;background:#84745c66}
.billiard-ball{--ball-color:#e6e3d9;position:absolute;width:17px;height:17px;left:var(--bx,100px);top:var(--by,140px);border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff9,transparent 40%),radial-gradient(circle at 35% 30%,var(--ball-color) 25%,#111 145%);transform:translate3d(calc(var(--scatter) * var(--dx,0px)),calc(var(--scatter) * var(--dy,0px)),184px) rotateZ(calc(-1 * var(--camera-z))) rotateX(calc(-1 * var(--camera-x)));box-shadow:2px 3px 4px #0005;display:grid;place-items:center}
.billiard-ball b{background:#efeee5;color:#20291f;border-radius:50%;height:8px;width:8px;font:600 6px/8px Arial;text-align:center}
.billiard-ball.striped{border-top:4px solid #f2eddd;border-bottom:4px solid #f2eddd}
.cue-ball{left:80px;top:140px;transform:translate3d(var(--cue-travel),0,184px) rotateZ(calc(-1 * var(--camera-z))) rotateX(calc(-1 * var(--camera-x)))}
.story-bottom{grid-column:1/-1;display:grid;grid-template-columns:1fr auto;align-items:center;gap:20px;position:absolute;bottom:30px;left:var(--space);right:var(--space);z-index:4}
.story-chapter-nav{display:flex;gap:24px;align-items:center}.story-chapter-nav button{font-size:10px;color:#a7b49e;min-height:44px;display:flex;align-items:center;gap:10px;padding:8px 0;position:relative}.story-chapter-nav button>span{font-size:8px;color:#94a38a}.story-chapter-nav button[aria-current="step"]{color:var(--paper)}.story-chapter-nav button[aria-current="step"]:after{content:'';position:absolute;bottom:2px;left:0;right:0;height:1px;background:var(--accent)}
.story-scroll-hint{display:none;align-items:center;gap:10px;font-size:9px;color:#bdc8b3}.story-scroll-hint svg{width:15px;height:15px;transform:rotate(90deg)}
.story-illustration-note{font-size:8px;color:#98a58e;grid-column:1/-1;line-height:1.6;margin-top:3px}
.story-progress{height:1px;background:#ffffff20;grid-column:1/-1}.story-progress>span{display:block;width:100%;height:1px;background:var(--accent);transform:scaleX(var(--story-progress));transform-origin:left}
.scroll-story.is-enhanced{height:440svh;min-height:2800px}
.is-enhanced .story-pin{position:sticky;top:92px;height:calc(100svh - 92px);min-height:570px;padding-top:48px;padding-bottom:145px}
.is-enhanced .story-stage{height:min(520px,64svh)}
.is-enhanced .story-steps{position:relative;min-height:225px}
.is-enhanced .story-step{position:absolute;left:0;top:0;opacity:0;transform:translateY(16px);transition:opacity .24s ease,transform .24s ease;pointer-events:none;margin:0}
.is-enhanced .story-step.is-active{opacity:1;transform:none;pointer-events:auto}
.is-enhanced .story-step h3{font-size:clamp(65px,6.8vw,100px)}
.is-enhanced .story-chapter-index{display:flex}.is-enhanced .story-scroll-hint{display:flex}
.will-reveal{opacity:.2;transform:translate3d(0,22px,0);transition:opacity .65s ease,transform .65s ease}.will-reveal.is-revealed{opacity:1;transform:none}
.hero-product{transition:none;transform-origin:50% 55%;will-change:transform}
.hero-product:hover{transform:rotate(-4deg)}
#experience-image{transition:none}
@media(min-width:1700px){.story-stage{--model-scale:1.05}.story-pin{grid-template-columns:40% 60%}}
@media(max-width:1100px){.story-stage{--model-scale:.72}.story-pin{grid-template-columns:43% 57%}.story-step p{font-size:11px}.story-collection-link{font-size:9px}.is-enhanced .story-steps{min-height:220px}}
@media(max-width:767px){
 .brand-logo{width:96px;max-height:58px}.footer-top .brand-logo{width:125px}.studio-header .brand-logo{width:76px;max-height:48px}
 .story-pin{grid-template-columns:1fr;padding:55px var(--space) 140px;min-height:0;align-content:start}
 .story-copy>.eyebrow{font-size:8px;letter-spacing:.12em;margin-bottom:14px}
 #story-heading{font-size:20px;margin-bottom:22px}#story-heading br:after{content:" "}
 .story-step h3{font-size:45px;margin-bottom:13px}.story-step p{font-size:11px;max-width:340px}
 .story-stage{--model-scale:.48;height:330px;margin-top:25px;perspective:1100px;perspective-origin:50% 55%}
 .scene-model{top:62%}.story-backdrop-word{font-size:105px;left:5%;top:26%}.story-orbit{inset:0 -10px}
 .scene-label{bottom:0;font-size:6px;letter-spacing:.13em}
 .story-bottom{bottom:24px;gap:14px;grid-template-columns:1fr}
 .story-chapter-nav{gap:0;justify-content:space-between}.story-chapter-nav button{font-size:9px;gap:7px}.story-chapter-nav button>span{font-size:7px}
 .story-scroll-hint{display:none!important}.story-illustration-note{font-size:7px;max-width:290px;grid-column:auto}
 .scroll-story.is-enhanced{height:260svh;min-height:1500px}
 .is-enhanced .story-pin{top:76px;height:calc(100svh - 76px);min-height:560px;padding-top:28px;padding-bottom:128px;grid-template-rows:auto minmax(230px,1fr)}
 .is-enhanced .story-copy>.eyebrow{margin-bottom:10px}.is-enhanced #story-heading{font-size:17px;margin-bottom:17px}
 .story-chapter-index{font-size:8px;margin-bottom:12px}.story-current{font-size:12px}
 .is-enhanced .story-step h3{font-size:55px;margin-bottom:13px}
 .is-enhanced .story-steps{min-height:155px}.is-enhanced .story-step{max-width:100%}.is-enhanced .story-step p{font-size:11px;max-width:330px}
 .is-enhanced .story-stage{height:100%;max-height:360px;min-height:230px;margin:0;--model-scale:.4}
 .is-enhanced .story-collection-link{font-size:9px;min-height:36px;margin-top:0}
}
@media(max-width:370px){.story-stage{--model-scale:.4}.is-enhanced .story-stage{--model-scale:.4}.brand-logo{width:85px}.story-copy>.eyebrow{font-size:7px}.story-collection-link{font-size:8px}}
/* Em tela baixa, não prender uma cena maior que a área disponível. */
@media(max-height:560px) and (max-width:767px){.scroll-story.is-enhanced{height:auto;min-height:0}.is-enhanced .story-pin{position:relative;top:auto;height:auto;min-height:0;padding-top:45px;grid-template-rows:auto 280px}.is-enhanced .story-step{position:relative;opacity:1;transform:none;margin-bottom:30px;pointer-events:auto}.is-enhanced .story-step h3{font-size:40px}.is-enhanced .story-steps{min-height:0}.is-enhanced .story-chapter-index{display:none}.is-enhanced .story-stage{height:280px;--model-scale:.44}}
@media(prefers-reduced-motion:reduce){
 .scroll-story,.scroll-story.is-enhanced{height:auto;min-height:0}
 .story-pin,.is-enhanced .story-pin{position:relative;top:auto;height:auto;min-height:0}
 .story-step,.is-enhanced .story-step{position:relative;opacity:1;transform:none;margin-bottom:28px;pointer-events:auto}
 .story-chapter-index,.story-scroll-hint{display:none!important}
 .will-reveal{opacity:1;transform:none;transition:none}
 .hero-product{will-change:auto}
}
@media print{.scroll-story,.scroll-story.is-enhanced{height:auto;min-height:0}.story-pin,.is-enhanced .story-pin{position:relative;top:0;height:auto}.story-step,.is-enhanced .story-step{position:relative;opacity:1;transform:none;visibility:visible}.scene-model{display:none!important}.scene-fallback{display:block!important}}
/* O rodapé da narrativa fica no fluxo quando os capítulos são leitura estática. */
.story-bottom{grid-column:auto}
.scroll-story:not(.is-enhanced) .story-pin{padding-bottom:40px}
.scroll-story:not(.is-enhanced) .story-bottom{position:relative;left:auto;right:auto;bottom:auto;grid-column:1/-1;margin-top:42px}
/* Prime: dois pedestais e tampo bipartido; alternativa CSS ao renderizador WebGL2. */
.solid-bottom{width:100%;height:100%;background:var(--side);transform:rotateX(180deg)}
.table-leg{--surface:#dce2df;--front:linear-gradient(100deg,#8f9c98,#c1cac7 24%,#e0e5e1 70%,#abb7b0);--side:linear-gradient(90deg,#7e8e87,#a4b3a9 40%,#c9d2cb)}
.prime-plinth{--surface:#c7d0cc;--front:linear-gradient(#edf1ea,#71837b,#c0cac4);--side:#778d80}
.prime-recess{--surface:#202d27;--front:#202c27;--side:#17231e}
.table-body{--surface:#dfe6df;--front:linear-gradient(0deg,#a1b0a7,#d1dad2 30%,#e8ece5 80%,#c2cfc2);--side:linear-gradient(90deg,#93a69b,#c8d2c9)}
.table-rail{--surface:linear-gradient(100deg,#c7d1cd,#f4f5ec 45%,#a9b8b0 75%,#e0e5df);--front:linear-gradient(#e5ece4,#899b92 20%,#eaf0e8 30%,#c5cfc5);--side:#95a99c}
.table-felt{background:radial-gradient(ellipse at 40% 20%,#397cad,#1a5b8b 65%,#18466b);border-color:#1a4c74;box-shadow:inset 0 0 22px #071e3f80}
.table-lid{top:-4px;--surface:linear-gradient(115deg,#c8d2ca,#f5f5e9 40%,#e5e9dd 65%,#adbdb1);--front:linear-gradient(#f7f7ec,#acbcb1);--side:#becbc0;transform-origin:50% 50%;}
.table-lid-left{left:-4px;transform:translate3d(calc(-1 * var(--lid-spread)),0,calc(186px + var(--lid-lift))) rotateY(var(--lid-angle)) rotateZ(var(--lid-yaw))}
.table-lid-right{left:271px;transform:translate3d(var(--lid-spread),0,calc(186px + var(--lid-lift))) rotateY(calc(-1 * var(--lid-angle))) rotateZ(calc(-1 * var(--lid-yaw)))}
.table-lid .solid-top{background:var(--surface);box-shadow:inset 0 0 0 1px #f1f6ed,inset 0 0 0 3px #b9c8b82e}
.table-lid .solid-top:after{left:0;right:0;top:0;bottom:0;width:auto;background:linear-gradient(115deg,transparent 15%,#fff7 35%,transparent 46%,#fff3 65%,transparent 75%)}
[data-finish="satin"] .table-lid .solid-top:after{opacity:.22;filter:blur(4px)}
.prime-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:2;pointer-events:none;mask-image:radial-gradient(ellipse at 50% 53%,#000 50%,#000c 72%,transparent 99%)}
[data-renderer="webgl"] .scene-model{display:none}
[data-renderer="webgl"] .story-backdrop-word{opacity:.25}
.scene-label{z-index:3;pointer-events:none}
.prime-material-control{position:absolute;right:var(--space);top:34px;z-index:5;display:flex;align-items:center;gap:5px;border:1px solid #82947b40;padding:4px;border-radius:30px;background:#16211bd9}
.prime-material-control>span{font-size:7px;letter-spacing:.13em;color:#adbca0;padding:0 12px}
.prime-material-control button{padding:10px 16px;min-height:36px;font-size:10px;border-radius:30px;color:#b7c6ad}
.prime-material-control button[aria-pressed="true"]{background:#d8dfcc;color:#22301f}
@media(max-width:767px){.prime-material-control{top:auto;bottom:140px;right:50%;transform:translateX(50%);gap:3px;white-space:nowrap}.prime-material-control>span{font-size:6px;padding:0 8px}.prime-material-control button{font-size:9px;padding:9px 12px;min-height:34px}.scene-label{bottom:48px;font-size:6px}.is-enhanced .story-stage{min-height:230px}.prime-canvas{mask-image:radial-gradient(ellipse at 50% 48%,#000 55%,#000c 73%,transparent 99%)}}
.scroll-story:not(.is-enhanced) .prime-material-control{position:relative;right:auto;top:auto;bottom:auto;transform:none;justify-self:start;align-self:center;margin-top:30px;grid-column:1;grid-row:2}
.scroll-story:not(.is-enhanced) .story-stage{grid-column:2;grid-row:1/3}
@media(max-width:767px){.scroll-story:not(.is-enhanced) .prime-material-control{grid-row:auto;grid-column:1;justify-self:center;margin-top:30px}.scroll-story:not(.is-enhanced) .story-stage{grid-row:auto;grid-column:1}.scroll-story:not(.is-enhanced) .scene-label{bottom:0}}

.prime-canvas{mask-image:none}

@media(max-width:767px){.scene-label{bottom:-15px}.scroll-story:not(.is-enhanced) .scene-label{bottom:0}}
/* O próximo capítulo entra sem sobrepor duas palavras durante a troca. */
.is-enhanced .story-step:not(.is-active){visibility:hidden;transition:none}
@media(prefers-reduced-motion:reduce){.is-enhanced .story-step{visibility:visible}}
/* Tampo com rotação invertida e folga para não atravessar a mesa. */
.table-lid-left{transform:translate3d(calc(-1 * var(--lid-spread)),0,calc(186px + var(--lid-lift) + var(--lid-clearance,0px))) rotateY(calc(-1 * var(--lid-angle))) rotateZ(calc(-1 * var(--lid-yaw)))}
.table-lid-right{transform:translate3d(var(--lid-spread),0,calc(186px + var(--lid-lift) + var(--lid-clearance,0px))) rotateY(var(--lid-angle)) rotateZ(var(--lid-yaw))}
.css-dinner{position:absolute;inset:0;transform-style:preserve-3d;opacity:var(--dinner-opacity,1)}
.css-dinner-plate{position:absolute;width:62px;height:62px;margin:-31px;transform:translateZ(199px);border-radius:50%;background:radial-gradient(ellipse,#fafafa 45%,#c9c9c9 51%,#fff 58%,#bbb 65%,#fff 70%);box-shadow:0 4px 8px #0005}
/* iPhone/Safari com barras: viewport de ~600-760 px de altura mantém a animação, com texto mais compacto para dar espaço à mesa 3D */
@media(max-height:760px) and (min-height:561px) and (max-width:767px){.is-enhanced .story-copy h2{font-size:22px}.is-enhanced .story-step h3{font-size:32px}.is-enhanced .story-step p{font-size:12px;line-height:1.45}.is-enhanced .story-collection-link,.is-enhanced .story-illustration-note,.is-enhanced .story-scroll-hint{display:none}.is-enhanced .story-pin{padding-top:16px;padding-bottom:90px}.is-enhanced .story-stage{min-height:260px}}

/* Quatro cadeiras ilustrativas acompanham a visibilidade do jantar. */
.css-chair{position:absolute;transform-style:preserve-3d}
.css-chair i{position:absolute;display:block;box-sizing:border-box;border-radius:5px;background:linear-gradient(110deg,#b4a089,#85715b);border:1px solid #bca88e}
.css-chair .css-chair-seat{width:102px;height:88px;margin:-44px -51px;border-radius:24px;box-shadow:0 5px 0 #514131;transform:translateZ(105px)}
.css-chair .css-chair-back{width:114px;height:94px;margin:-47px -57px;border-radius:38px 38px 24px 24px;box-shadow:inset 0 0 14px #5f4c3966;transform:translateZ(158px) rotateX(90deg)}
.css-chair .css-chair-leg{width:7px;height:105px;margin:-52.5px -3.5px;border-radius:2px;background:#6e583a;clip-path:polygon(20% 0,80% 0,65% 100%,35% 100%);transform:translateZ(52.5px) rotateX(90deg)}