/* Fazenda roasting experience — scoped to this section. */
.roastery{--roast-cream:#f3eedd;--roast-muted:#b9bea9;--roast-line:rgba(243,238,221,.19);position:relative;isolation:isolate;overflow:hidden;background:#20271e;color:var(--roast-cream);padding:clamp(3.5rem,7vw,7rem) clamp(1rem,4.2vw,5rem) 1.5rem;scroll-margin-top:6rem}
.roastery__inner{max-width:1400px;margin:0 auto}
.roastery__header{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);align-items:end;gap:clamp(2rem,6vw,6rem);margin-bottom:clamp(2.5rem,4vw,4rem)}
.roastery__eyebrow,.roastery__story-eyebrow,.roastery__chapter{font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;font-weight:650;line-height:1.5}
.roastery__eyebrow{display:flex;align-items:center;gap:.7rem;color:#c3c8b5;margin-bottom:1.7rem}
.roastery__eyebrow>span{height:6px;width:6px;border-radius:50%;background:#c3ac7a;box-shadow:0 0 0 4px #c3ac7a14;flex-shrink:0}
.roastery .roastery__header h2{font-size:clamp(3.5rem,7.2vw,7.4rem);line-height:.94;font-weight:380;letter-spacing:-.055em;max-width:11ch;text-wrap:initial}
.roastery__header h2 em{font-weight:350;color:#c6cbb3}
.roastery__introduction{padding-bottom:.35rem;max-width:25rem}
.roastery__introduction>p{font-size:clamp(.98rem,1.25vw,1.14rem);line-height:1.7;color:#e0e1d2}
.roastery__introduction>span{display:block;font-size:.65rem;letter-spacing:.08em;color:#aab39f;margin-top:1.35rem}
.roastery__experience{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr);gap:clamp(1.7rem,4.3vw,4.7rem);align-items:start}
.roastery__visual{min-width:0}
.roastery__viewport{height:clamp(460px,47vw,630px);width:100%;position:relative;overflow:hidden;isolation:isolate;border:1px solid var(--roast-line);background:radial-gradient(ellipse at 49% 35%,#39402e 0,#2a3125 43%,#1b221a 95%)}
.roastery__viewport::after{content:"";position:absolute;z-index:0;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 94%,#8e8c5f12,transparent 47%)}
.roastery__canvas,.roastery__poster{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .6s ease}
.roastery__poster{z-index:1;opacity:1;pointer-events:none}
.roastery__canvas{z-index:2;opacity:0;touch-action:pan-y;outline-offset:-5px}
.roastery[data-render-ready] .roastery__canvas{opacity:1}
.roastery[data-render-ready] .roastery__poster{opacity:0}
.roastery__scene-heading{position:absolute;z-index:3;inset:1.3rem 1.5rem auto;display:flex;justify-content:space-between;gap:1rem;pointer-events:none;color:#c2c6b3;font-size:.55rem;font-weight:550;letter-spacing:.16em;text-transform:uppercase}
.roastery__scene-heading>span:last-child{color:#8d997f;white-space:nowrap}
.roastery__scene-footer{position:absolute;z-index:3;inset:auto 1.5rem 1.3rem;pointer-events:none}
.roastery__scene-footer>p{max-width:23rem;font-size:.7rem;color:#c7ccbc;letter-spacing:.015em;line-height:1.5;margin-bottom:1rem;text-shadow:0 1px 5px #171d16}
.roastery__progress{display:flex;gap:5px;width:114px}
.roastery__progress>span{display:block;width:24px;height:2px;background:#f3eedd26;transition:background .4s ease}
.roastery__progress>span.is-current{background:#d0ba8c}
.roastery__progress>span.is-complete{background:#f3eedd60}
.roastery__toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:66px;padding-block:.7rem}
.roastery__hint{display:flex;align-items:center;gap:.5rem;color:#a6af99;font-size:.65rem;white-space:nowrap}
.roastery__hint>span{font-size:1rem;line-height:1}
.roastery__controls{display:flex;gap:.4rem;align-items:center}
.roastery__control{display:flex;align-items:center;justify-content:center;gap:.45rem;min-height:40px;background:transparent;border:1px solid transparent;border-radius:2px;padding:.4rem .7rem;color:#e0e3d3;font-size:.7rem;line-height:1.4;white-space:nowrap;transition:border-color .2s ease,background .2s ease}
.roastery__control:hover:not(:disabled),.roastery__control[aria-pressed="true"]{background:#f3eedd09;border-color:var(--roast-line)}
.roastery__control:disabled{opacity:.42;cursor:default}
.roastery__control svg{stroke:currentColor;stroke-width:1;fill:none;flex-shrink:0}
.roastery__control [data-roaster-play-icon]{fill:currentColor;stroke:none}
.roastery__story{padding-top:.3rem;min-width:0}
.roastery__story-eyebrow{color:#adb7a0;margin-bottom:1.25rem;font-size:.59rem}
.roastery__steps{list-style:none;border-top:1px solid var(--roast-line)}
.roastery__step{border-bottom:1px solid var(--roast-line)}
.roastery__step-button{display:grid;grid-template-columns:26px 1fr 16px;align-items:center;gap:.8rem;width:100%;padding:1.15rem 0;background:transparent;border:0;text-align:left;color:#b6bea9;font-size:clamp(.85rem,1.08vw,1rem);font-weight:500;line-height:1.4;transition:color .2s ease}
.roastery__step-button:hover,.roastery__step-button[aria-expanded="true"]{color:var(--roast-cream)}
.roastery__step-number{color:#949f86;font-size:.62rem;letter-spacing:.055em;font-weight:400}
.roastery__step-button[aria-expanded="true"] .roastery__step-number{color:#cfba8b}
.roastery__step-symbol{font-size:1.2rem;font-weight:300;line-height:1;color:#a1aa94;text-align:right}
.roastery__step-panel{padding:.5rem 0 1.8rem 2.4rem;max-width:27rem}
.roastery__step-panel[hidden]{display:none}
.roastery__chapter{font-size:.52rem;color:#b7a378;letter-spacing:.14em;margin-bottom:.65rem}
.roastery .roastery__step-panel h3{font-size:clamp(1.7rem,2.4vw,2.6rem);font-weight:370;line-height:1.1;letter-spacing:-.035em;max-width:12.5ch;text-wrap:initial;margin-bottom:1rem}
.roastery__step-panel>p:last-child{font-size:.8rem;line-height:1.85;color:#bfc6b3;max-width:34ch}
.roastery__footer{margin-top:clamp(1.3rem,2.4vw,2.5rem);padding-block:1.25rem .2rem;border-top:1px solid var(--roast-line);display:flex;justify-content:space-between;align-items:center;gap:1.2rem}
.roastery__footer>p{font-size:.62rem;line-height:1.6;color:#a0ab96}
.roastery__story-link{display:flex;gap:1.2rem;align-items:center;color:#e6e8da;font-size:.7rem;border-bottom:1px solid #d1d6bd55;padding-bottom:.3rem;transition:color .2s ease,border-color .2s ease}
.roastery__story-link:hover{color:#cfba8b;border-color:currentColor}
.roastery__story-link>span{font-size:1rem}
.roastery__live{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:1700px){.roastery__experience{grid-template-columns:minmax(0,1.65fr) minmax(0,1fr)}}
@media(max-width:1050px){.roastery__experience{grid-template-columns:minmax(0,1.45fr) minmax(265px,1fr);gap:1.8rem}.roastery__viewport{height:490px}.roastery__toolbar{align-items:flex-start;flex-direction:column;gap:.35rem}.roastery__controls{gap:.2rem}.roastery__control{padding-inline:.5rem}.roastery__step-panel{padding-left:0}.roastery__step-panel h3{max-width:13ch}}
@media(max-width:760px){.roastery{padding:3.5rem 1.1rem 1.4rem}.roastery__header{grid-template-columns:1fr;gap:1.4rem;margin-bottom:2rem}.roastery .roastery__header h2{font-size:clamp(3.4rem,11vw,5rem)}.roastery__eyebrow{font-size:.55rem;margin-bottom:1.35rem}.roastery__introduction{max-width:25rem}.roastery__introduction>p{font-size:.87rem;line-height:1.7}.roastery__introduction>span{font-size:.57rem;margin-top:.85rem}.roastery__experience{grid-template-columns:1fr;gap:1.4rem}.roastery__viewport{height:clamp(325px,86vw,500px)}.roastery__scene-heading{inset:1rem 1rem auto;font-size:.48rem}.roastery__scene-footer{inset:auto 1rem 1rem}.roastery__scene-footer>p{font-size:.62rem;margin-bottom:.7rem;max-width:25ch}.roastery__toolbar{flex-direction:row;align-items:center;min-height:58px;gap:.4rem}.roastery__hint{font-size:.56rem;gap:.3rem}.roastery__hint>span{font-size:.8rem}.roastery__control{font-size:.6875rem;gap:.35rem;padding-inline:.3rem;min-height:44px}.roastery__control svg{width:12px}.roastery__story-eyebrow{font-size:.55rem;margin-bottom:.9rem}.roastery__step-button{padding:1rem 0;font-size:.91rem;grid-template-columns:22px 1fr 16px;gap:.6rem}.roastery__step-panel{padding:.3rem 0 1.6rem 2rem;max-width:30rem}.roastery .roastery__step-panel h3{font-size:2rem;max-width:16ch;margin-bottom:.8rem}.roastery__step-panel>p:last-child{font-size:.79rem;line-height:1.8;max-width:36ch}.roastery__chapter{font-size:.5rem}.roastery__footer{margin-top:1.8rem;align-items:flex-start;gap:.9rem;flex-direction:column;padding-top:1rem}.roastery__footer>p{font-size:.57rem}.roastery__story-link{font-size:.67rem}}
@media(max-width:360px){.roastery{padding-inline:.8rem}.roastery__hint{max-width:4rem;white-space:normal;font-size:.53rem}.roastery__control{font-size:.65rem}}
@media(prefers-reduced-motion:reduce){.roastery__canvas,.roastery__poster,.roastery__progress>span,.roastery__control,.roastery__step-button,.roastery__story-link{transition:none}}
.roastery[data-render-ready] .roastery__canvas{cursor:grab}
.roastery[data-render-ready] .roastery__canvas:active{cursor:grabbing}
.roastery :is(button,a,canvas):focus-visible{outline:2px solid #d0ba8c;outline-offset:4px}
.roastery canvas:focus-visible{outline-offset:-5px}
