/* Alba 3D · "o fio", edição de Natal
   O filamento da logo conduz a página e as peças surgem camada por camada.
   Paleta de Natal tirada das próprias peças: verde da árvore, marrom do tronco, dourado, gelo acinzentado, vermelho, branco e nude. */
:root{
  --marfim:#F7F5F1; --estudio:#E9E8E4; --areia:#E8D8CA; --salvia:#DCDDD9; --terracota:#B3312E; --dourado:#B58A45;
  --oliva:#24402F; --oliva2:#1C3325; --grafite:#2B2420; --texto2:#5D5650; --oliva-txt:#2D5A3D; --terra-txt:#A3272A;
  --tronco:#5B3B28; --gelo:#B9B8B1; --nude:#E2C6B2; --branco:#FBFAF8;
  --display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --body:Manrope,"Helvetica Neue",Arial,system-ui,sans-serif;
  --mola:cubic-bezier(.34,1.45,.64,1); --suave:cubic-bezier(.22,1,.36,1);
  --gut-l:max(clamp(16px,5vw,72px),env(safe-area-inset-left,0px));
  --gut-r:max(clamp(16px,5vw,72px),env(safe-area-inset-right,0px));
  color-scheme:light;
}
html,body{background:var(--estudio)}
body{margin:0;font-family:var(--body);color:var(--grafite);-webkit-font-smoothing:antialiased;overflow-x:clip}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--estudio)}
*{box-sizing:border-box}
img{max-width:100%;display:block}
h1,h2,h3,p{margin:0}
h1,h2,h3{text-wrap:balance}
a{color:inherit}
:focus-visible{outline:2px solid var(--dourado);outline-offset:3px;border-radius:6px}
.wrap{width:100%;max-width:1240px;margin-inline:auto;padding-left:var(--gut-l);padding-right:var(--gut-r)}
.it{font-family:var(--display);font-style:italic;font-weight:400}
.rot{font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;font-weight:700;color:var(--oliva-txt)}
.h2{font-family:var(--display);font-weight:300;font-size:clamp(44px,5.6vw,84px);line-height:.98;letter-spacing:-.01em}
.h2 .it{color:var(--oliva-txt)}
.lead{font-size:17px;line-height:1.7;color:var(--texto2);max-width:44ch}

/* botões */
.btn{display:inline-flex;align-items:center;gap:12px;min-height:52px;padding:0 8px 0 24px;border-radius:999px;font:600 15px/1 var(--body);text-decoration:none;border:0;cursor:pointer;transition:transform .35s var(--suave)}
.btn:hover{transform:translateY(-2px)}
.btn .seta{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;transition:transform .4s var(--mola)}
.btn:hover .seta{transform:rotate(-45deg)}
.btn-escuro{background:var(--grafite);color:var(--marfim)}
.btn-escuro .seta{background:var(--terracota);color:var(--branco)}
.btn-claro{background:var(--marfim);color:var(--grafite)}
.btn-claro .seta{background:var(--terracota);color:var(--branco)}
.btn-terra{background:var(--terracota);color:var(--branco)}
.btn-terra .seta{background:var(--grafite);color:var(--marfim)}
.btn-linha{border:1px solid rgba(47,47,47,.3);background:transparent;color:var(--grafite);padding:0 24px}

/* o fio que acompanha a rolagem (como o eixo da impressora) */
.eixo{position:fixed;left:calc(18px + env(safe-area-inset-left,0px));top:0;bottom:0;width:2px;z-index:40;pointer-events:none}
.eixo i{position:absolute;left:0;top:0;width:2px;height:100%;background:var(--dourado);transform-origin:50% 0;transform:scaleY(var(--p,0));opacity:.8}
.eixo b{position:absolute;left:-4px;top:calc(var(--p,0) * 100%);width:10px;height:10px;margin-top:-5px;border-radius:50%;background:var(--dourado);box-shadow:0 0 0 4px rgba(181,138,69,.18)}

/* topo */
.topo{position:absolute;top:calc(22px + env(safe-area-inset-top,0px));left:var(--gut-l);right:var(--gut-r);z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px}
.topo .logo img{height:40px;width:auto}
.topo nav{display:flex;gap:30px}
.topo nav a{position:relative;font-size:14px;font-weight:500;text-decoration:none;padding:12px 0}
.topo nav a::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:1px;background:var(--dourado);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--suave)}
.topo nav a:hover::after{transform:scaleX(1);transform-origin:left}
.sacola{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 5px 0 18px;border-radius:999px;border:0;background:var(--grafite);color:var(--marfim);text-decoration:none;font-size:14px;font-weight:600;transition:transform .35s var(--suave)}
.sacola .zap-ico{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--terracota);color:var(--branco);font-style:normal;transition:transform .4s var(--mola)}
.sacola:hover .zap-ico{transform:rotate(-12deg) scale(1.06)}
.sacola svg{flex:none}

/* herói */
.heroi{position:relative;background:var(--estudio);overflow:clip}
.heroi-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(16px,3vw,48px);min-height:min(100vh,940px);padding-top:calc(110px + env(safe-area-inset-top,0px));padding-bottom:56px}
.h1{font-family:var(--display);font-weight:300;font-size:clamp(60px,8.6vw,146px);line-height:.9;letter-spacing:-.02em;margin-top:20px}
.h1 .l:nth-child(2){line-height:1.08;margin-top:-.1em}
.h1 .l{display:block;overflow:clip;padding:0 .06em .3em 0;margin-bottom:-.3em}
.h1 .l>span{display:block;animation:linha 1.1s var(--suave) both}
.h1 .l:nth-child(2)>span{animation-delay:.12s}
.h1 .it{color:var(--terra-txt)}
@keyframes linha{from{transform:translateY(108%)}}
.surge{animation:surge 1s var(--suave) .35s both}
@keyframes surge{from{opacity:0;transform:translateY(18px)}}
.heroi p.txt{margin-top:26px;font-size:18px;line-height:1.65;color:var(--texto2);max-width:36ch}
.acoes{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}
.palco{position:relative;width:min(560px,100%);justify-self:center;aspect-ratio:4/5}
.palco .simb{position:absolute;left:4.6%;top:20.9%;width:90.5%;height:auto;overflow:visible;pointer-events:none}
.palco .simb path{fill:none;stroke:var(--dourado);stroke-width:1.4;stroke-linecap:round;opacity:.55;stroke-dasharray:1;stroke-dashoffset:1;animation:traca 1.4s cubic-bezier(.6,0,.2,1) both}
@keyframes traca{to{stroke-dashoffset:0}}
.palco .imprime{position:absolute;inset:0;background:transparent;overflow:visible}
.palco .imprime img.final,.palco .imprime canvas,.palco .imprime .bico{scale:1}
.cor-atual{position:absolute;left:50%;bottom:-6px;translate:-50% 0;display:flex;align-items:center;gap:10px;font-size:13px;color:var(--texto2);white-space:nowrap}
.cor-atual i{width:14px;height:14px;border-radius:50%;background:var(--terracota);transition:background-color .5s;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}

/* entrando no fio: a logo começa inteira e a rolagem entra nela */
.fio{position:relative;height:62vh;height:62svh;min-height:420px;max-height:640px;background:var(--oliva)}
.fio-palco{position:relative;height:100%;overflow:clip;background:var(--oliva)}
.fio-palco svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.fio-palco path{fill:none;stroke:var(--estudio);stroke-linecap:round;stroke-linejoin:round}
.fio-txt{position:absolute;left:0;right:0;text-align:center;padding-inline:20px;pointer-events:none}
.fio-txt p{font-family:var(--display);font-weight:300;font-size:clamp(36px,5.2vw,80px);line-height:1}
.fio-a{bottom:7%;color:var(--marfim)}
.fio-a small{display:block;margin-top:14px;font-family:var(--body);font-size:15px;color:rgba(246,237,225,.75)}
.fio-b{top:50%;translate:0 -50%;color:var(--grafite);opacity:0}
.fio-b .it{color:var(--terra-txt)}

/* imagens que aparecem camada por camada */
.camadas{position:relative}
.camadas.espera{clip-path:inset(100% 0 0 0)}
.camadas.imprime{clip-path:inset(0 0 0 0);transition:clip-path 1.5s steps(26,end)}
.camadas.imprime::after{content:"";position:absolute;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,var(--dourado),transparent);box-shadow:0 0 12px rgba(181,138,69,.8);animation:bico 1.5s steps(26,end) forwards;pointer-events:none;z-index:2}
@keyframes bico{from{bottom:0;opacity:1}96%{bottom:100%;opacity:1}to{bottom:100%;opacity:0}}
.surgir{transition:opacity .9s var(--suave),transform .9s var(--suave)}
.surgir.espera{opacity:0;transform:translateY(36px)}

/* vitrine de natal: arcos sobre uma prateleira */
.vitrine{padding-block:140px 120px;background:var(--estudio)}
.vit-topo{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:48px;align-items:end}
.prateleira{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2.4vw,32px);align-items:end;margin-top:72px;padding-bottom:0}
.prateleira::after{display:none}
.item{display:flex;flex-direction:column;gap:16px;text-decoration:none;color:var(--grafite)}
.arco{position:relative;overflow:clip;border-radius:999px 999px 18px 18px;background:var(--areia)}
.arco img{width:100%;height:100%;object-fit:cover;object-position:50% 100%;transition:transform 1.2s var(--suave);transform-origin:50% 100%}
.item:hover .arco img{transform:scale(1.05)}
.item .arco{aspect-ratio:4/5}
.legenda{min-height:96px;display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding-top:8px}
.legenda h3{font-family:var(--display);font-weight:500;font-size:clamp(24px,2.2vw,32px);line-height:1.05}
.legenda p{font-size:14px;color:var(--texto2);margin-top:6px}
.legenda span{font-weight:700;font-size:15px;white-space:nowrap}
.vit-rodape{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-top:40px}
.vit-rodape p{font-size:14px;color:var(--texto2)}

/* camada por camada: a mesma peça crescendo */
.processo{padding-block:140px 130px;background:var(--areia)}
.proc-grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,30px);margin-top:64px;align-items:end}
.etapa{display:flex;flex-direction:column;gap:18px}
.etapa .arco{aspect-ratio:3/3.7;background:var(--estudio)}
.etapa .arco img,.etapa .arco canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%}
.etapa .arco canvas{opacity:0;transition:opacity .4s}
.etapa .arco canvas.on{opacity:1}
.etapa small{font-size:11.5px;letter-spacing:.2em;color:var(--terra-txt);font-weight:700}
.etapa h3{font-family:var(--display);font-weight:500;font-size:clamp(28px,2.6vw,36px);line-height:1.05}
.etapa p{font-size:15px;line-height:1.65;color:var(--texto2)}
.assin{margin-top:56px;text-align:center;font-family:var(--display);font-style:italic;font-size:clamp(26px,2.6vw,36px);color:var(--terra-txt)}

/* personalizados */
.perso{padding-block:140px 140px;background:var(--oliva);color:var(--marfim);position:relative;overflow:clip}
.perso .rot{color:#C9D6C9}
.perso .h2 .it{color:#E7B8A6}
.perso .lead{color:rgba(246,237,225,.78)}
.perso-grade{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(40px,6vw,88px);align-items:center}
.perso-simb{position:absolute;right:-6%;top:-10%;width:min(760px,80vw);opacity:.12;pointer-events:none}
.perso-simb path{fill:none;stroke:var(--marfim);stroke-width:1;stroke-linecap:round}
.passos3{list-style:none;padding:0;margin:30px 0 0;display:flex;flex-wrap:wrap;gap:10px 18px;font-size:14px;color:rgba(246,237,225,.75)}
.passos3 b{color:var(--marfim)}
.editor{position:relative;background:var(--areia);color:var(--grafite);border-radius:32px;padding:clamp(18px,3vw,32px);display:flex;flex-direction:column;gap:22px;box-shadow:0 40px 80px -40px rgba(0,0,0,.6)}
.mostra{position:relative;background:var(--marfim);border-radius:24px;height:320px;display:grid;place-items:center;overflow:clip}
.obj{position:relative;display:flex;flex-direction:column;align-items:center;max-width:90%;animation:sobe 5s ease-in-out infinite alternate}
@keyframes sobe{to{transform:translateY(-10px)}}
.p-arco{position:relative;width:300px;max-width:100%;height:170px;border-radius:150px 150px 0 0;transition:background-color .6s;background-image:linear-gradient(90deg,rgba(0,0,0,.16),rgba(0,0,0,0) 25%,rgba(255,255,255,.18) 45%,rgba(0,0,0,0) 70%,rgba(0,0,0,.18)),repeating-linear-gradient(90deg,rgba(0,0,0,.09) 0 2px,rgba(255,255,255,.06) 2px 8px)}
.p-arco i{position:absolute;left:50%;bottom:0;transform:translateX(-50%);border:2px solid rgba(0,0,0,.09);border-bottom:0;border-radius:999px 999px 0 0}
.placa{position:relative;overflow:clip;width:340px;max-width:100%;height:92px;border-radius:6px 6px 10px 10px;display:grid;place-items:center;transition:background-color .6s;box-shadow:0 30px 40px -24px rgba(47,47,47,.55),inset 0 1px 0 rgba(255,255,255,.35);background-image:repeating-linear-gradient(180deg,rgba(0,0,0,.05) 0 1px,transparent 1px 4px)}
.placa span{font-family:var(--display);font-weight:600;letter-spacing:.14em;text-transform:uppercase;transition:color .6s,font-size .3s;white-space:nowrap}
.brilho-p{position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);animation:passa 4.5s ease-in-out infinite;pointer-events:none;mix-blend-mode:soft-light}
@keyframes passa{0%,40%{transform:translateX(-100%)}80%,100%{transform:translateX(100%)}}
.campo{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:700}
.campo input{font:500 18px var(--body);color:var(--grafite);background:var(--marfim);border:1px solid rgba(47,47,47,.15);border-radius:14px;padding:0 16px;min-height:52px;width:100%}
.cores{display:flex;gap:8px;flex-wrap:wrap}
.cor{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 16px 0 8px;border-radius:999px;border:1px solid rgba(47,47,47,.2);background:transparent;cursor:pointer;font:500 14px var(--body);color:var(--grafite);transition:background .3s,border-color .3s}
.cor[aria-pressed="true"]{border-color:var(--grafite);background:var(--marfim)}
.cor b{width:26px;height:26px;border-radius:50%;border:1px solid rgba(47,47,47,.25)}

/* quatro jeitos: cartas empilhadas */
.ofertas{padding-block:140px 90px;background:var(--estudio)}
.pilha{margin-top:56px;display:flex;flex-direction:column;gap:22px}
.carta{position:sticky;top:calc(80px + var(--i,0) * 14px);min-height:min(540px,74vh);border-radius:36px;overflow:clip;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);transform:scale(var(--s,1));transform-origin:50% 0;box-shadow:0 -20px 50px -30px rgba(0,0,0,.3)}
.carta .lado{padding:clamp(28px,4vw,56px);display:flex;flex-direction:column;justify-content:space-between;gap:28px}
.carta h3{font-family:var(--display);font-weight:400;font-size:clamp(40px,4.6vw,72px);line-height:.95}
.carta p{font-size:16px;line-height:1.65;max-width:38ch}
.carta ul{list-style:none;padding:0;margin:18px 0 0;display:flex;flex-direction:column;gap:8px;font-size:14px}
.carta li{display:flex;gap:10px;align-items:center}
.carta li::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.6}
.carta .imgs{position:relative;overflow:clip}
.carta .imgs img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 46%}
.c-terra{background:var(--terracota);color:var(--branco)}
.c-salvia{background:var(--salvia);color:var(--grafite)}
.c-oliva{background:var(--oliva);color:var(--marfim)}
.c-grafite{background:var(--grafite);color:var(--marfim)}
.carta .rot{color:inherit;opacity:.8}

/* experiência */
.exp{padding-block:140px 130px;background:var(--estudio)}
.exp-grade{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:center}
.exp-fotos{position:relative;height:clamp(360px,40vw,540px)}
.exp-fotos .a{position:absolute;left:0;top:0;width:72%;aspect-ratio:4/3.1;border-radius:28px;overflow:clip;box-shadow:0 40px 70px -40px rgba(47,47,47,.5)}
.exp-fotos .b{position:absolute;right:0;bottom:0;width:46%;aspect-ratio:3/3.7;border-radius:999px 999px 24px 24px;overflow:clip;border:8px solid var(--salvia);box-shadow:0 40px 70px -40px rgba(47,47,47,.5)}
.exp-fotos img{width:100%;height:100%;object-fit:cover}
.frase{font-family:var(--display);font-style:italic;font-weight:300;font-size:clamp(38px,4.4vw,64px);line-height:1.06}
.frase .w{opacity:var(--o,1);transition:opacity .25s linear}

/* dúvidas */
.duvidas{padding-block:130px 120px;background:var(--estudio)}
.duv-grade{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;align-items:start}
.faq{display:flex;flex-direction:column}
.faq details{border-top:1px solid rgba(47,47,47,.14)}
.faq details:last-child{border-bottom:1px solid rgba(47,47,47,.14)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:72px;font-family:var(--display);font-size:clamp(22px,2vw,28px);font-weight:500}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{width:32px;height:32px;flex:none;border-radius:50%;border:1px solid rgba(47,47,47,.3);display:grid;place-items:center;font-style:normal;font-family:var(--body);font-size:18px;transition:transform .4s var(--mola),background-color .3s}
.faq details[open] summary i{transform:rotate(45deg);background:var(--terracota);border-color:var(--terracota);color:var(--branco)}
.faq p{padding:0 0 24px;font-size:15px;line-height:1.7;color:var(--texto2);max-width:60ch}

/* fim: assinatura oficial */
.fim{background:var(--oliva);color:var(--marfim);padding-block:130px 36px;text-align:center;position:relative;overflow:clip}
.fim .h2 .it{color:#E7B8A6}
.fim .acoes{justify-content:center}
.fim .assinatura{width:min(300px,62vw);margin:96px auto 0}
.rod{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin-top:80px;text-align:left;font-size:14px}
.rod strong{display:block;font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:#C9D6C9;margin-bottom:12px}
.rod a,.rod span{display:block;color:rgba(246,237,225,.8);text-decoration:none;padding:3px 0}
.rod a:hover{color:#fff}
.news{display:flex;gap:8px;flex-wrap:wrap}
.news input{flex:1 1 160px;min-width:0;min-height:48px;border-radius:999px;border:1px solid rgba(246,237,225,.3);background:transparent;padding:0 16px;font:400 15px var(--body);color:var(--marfim)}
.news input::placeholder{color:rgba(246,237,225,.55)}
.rod-fim{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:48px;padding-top:22px;border-top:1px solid rgba(246,237,225,.16);font-size:12px;color:rgba(246,237,225,.65);text-align:left}

@media (max-width:980px){
  .topo nav{display:none}
  .eixo{display:none}
  .heroi-in,.vit-topo,.perso-grade,.exp-grade,.duv-grade{grid-template-columns:minmax(0,1fr)}
  .heroi-in{padding-top:calc(100px + env(safe-area-inset-top,0px));gap:28px}
  .palco{width:min(420px,92%)}
  .prateleira{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:72%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;margin-inline:calc(var(--gut-l) * -1) calc(var(--gut-r) * -1);padding-inline:var(--gut-l) var(--gut-r);scrollbar-width:none}
  .prateleira::-webkit-scrollbar{display:none}
  .prateleira::after{display:none}
  .item{scroll-snap-align:start}
  .proc-grade{grid-template-columns:minmax(0,1fr)}
  .etapa{display:grid;grid-template-columns:42% minmax(0,1fr);gap:18px;align-items:center}
  .carta{grid-template-columns:minmax(0,1fr);min-height:auto}
  .carta .imgs{height:240px;order:-1}
  .rod{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
@media (max-width:560px){
  .topo .logo img{height:32px}
  .sacola span{display:none}
  .rod{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .camadas.espera,.surgir.espera{clip-path:none;opacity:1;transform:none}
  .palco .simb path{stroke-dashoffset:0}
}

/* ---------- impressão: render final + mapa de altura + bico ---------- */
.imprime{position:relative;overflow:clip;background:var(--gelo)}
.imprime img.final,.imprime canvas,.imprime .bico{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%}
.imprime canvas{opacity:0;transition:opacity .35s}
.imprime canvas.on{opacity:1}
.imprime .bico{pointer-events:none;opacity:0;will-change:transform;object-fit:fill}
.palco-leg{position:absolute;left:50%;bottom:-38px;translate:-50% 0;font-size:13px;color:var(--texto2);white-space:nowrap;text-decoration:none;z-index:2;background:var(--estudio);padding:6px 14px;border-radius:999px;box-shadow:0 0 0 6px var(--estudio)}
.palco-leg b{font-weight:600;color:var(--grafite)}
.etapa .arco.imprime{aspect-ratio:4/5}
.item .arco.imprime{aspect-ratio:4/5!important}
.arco .final{transition:transform 1.2s var(--suave)}
.preco-cons{font-size:13px!important;font-weight:600!important;color:var(--terra-txt)}

/* ---------- loja ---------- */
.topo.fixo{position:sticky;top:0;left:auto;right:auto;padding:16px var(--gut-r) 16px var(--gut-l);background:rgba(233,232,228,.97);border-bottom:1px solid rgba(43,36,32,.08)}
.loja-topo{padding-block:72px 28px}
.loja-topo .h2{font-size:clamp(46px,6vw,92px)}
.filtros{position:sticky;top:73px;z-index:15;background:var(--estudio);padding-block:14px;border-bottom:1px solid rgba(43,36,32,.08)}
.filtros .wrap{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.filtros .wrap::-webkit-scrollbar{display:none}
.chip{flex:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(43,36,32,.18);background:transparent;font:500 14px var(--body);color:var(--grafite);cursor:pointer;text-decoration:none}
.chip[aria-pressed="true"]{background:var(--grafite);color:var(--branco);border-color:var(--grafite)}
.chip small{font-size:12px;opacity:.85}
.linha-bloco{padding-block:56px 24px;scroll-margin-top:140px}
.linha-cab{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:28px}
.linha-cab h2{font-family:var(--display);font-weight:400;font-size:clamp(38px,4.2vw,60px);line-height:1}
.linha-cab p{font-size:15px;color:var(--texto2);max-width:46ch}
.grade{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2vw,26px)}
.card{display:flex;flex-direction:column;gap:12px;text-decoration:none;color:var(--grafite)}
.card .foto{position:relative;aspect-ratio:4/5;border-radius:999px 999px 18px 18px;overflow:clip;background:var(--gelo)}
.card .foto img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--suave)}
.card:hover .foto img{transform:scale(1.045)}
.card h3{font-family:var(--display);font-weight:500;font-size:clamp(20px,1.7vw,24px);line-height:1.1}
.card p{font-size:13px;color:var(--texto2)}
.card .foto.sem{display:grid;place-items:center;background:var(--oliva);color:var(--marfim);text-align:center;padding:24px}
.card .foto.sem span{font-family:var(--display);font-style:italic;font-size:22px;line-height:1.15}
.card .foto.sem small{display:block;margin-top:10px;font:600 11px var(--body);letter-spacing:.18em;text-transform:uppercase;color:#C9D6C9}

/* ---------- produto ---------- */
.prod{padding-block:48px 110px}
.prod-grade{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(28px,5vw,80px);align-items:start}
.prod .imprime{aspect-ratio:4/5;border-radius:999px 999px 28px 28px;box-shadow:0 50px 90px -50px rgba(43,36,32,.5)}
.prod .imprime.sem{display:grid;place-items:center;background:var(--oliva);color:var(--marfim);text-align:center;padding:40px}
.prod-info{position:sticky;top:110px;display:flex;flex-direction:column;gap:22px}
.trilha{font-size:13px;color:var(--texto2)}
.trilha a{text-decoration:none}
.trilha a:hover{text-decoration:underline}
.prod h1{font-family:var(--display);font-weight:400;font-size:clamp(40px,4.6vw,68px);line-height:.98;letter-spacing:-.01em}
.prod .desc{font-size:17px;line-height:1.7;color:var(--texto2)}
.notas{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;font-size:14px;line-height:1.5}
.notas li{display:flex;gap:12px}
.notas li::before{content:"";flex:none;width:7px;height:7px;margin-top:7px;border-radius:50%;background:var(--dourado)}
.btn-zap{background:#1F7A4D;color:#fff}
.btn-zap .seta{background:rgba(255,255,255,.18);color:#fff}
.legenda-imp{font-size:12.5px;color:var(--texto2);margin-top:14px;text-align:center}
.relacionados{padding-block:20px 120px}

@media (max-width:980px){
  .grade{grid-template-columns:repeat(2,minmax(0,1fr))}
  .prod-grade{grid-template-columns:minmax(0,1fr)}
  .prod-info{position:static}
  .filtros{top:65px}
  .topo.fixo nav{display:none}
}
@media (max-width:560px){
  .grade{gap:12px}
  .card h3{font-size:18px}
}
.c-nude{background:var(--nude);color:var(--grafite)}
.carta .imgs{background:var(--gelo)}

.card .foto img{object-position:50% 100%}
@media (max-width:980px){.carta .imgs{height:auto;aspect-ratio:1/1}.carta .imgs img{object-position:50% 46%}}

/* ---------- galeria do produto: impressão + fotos reais ---------- */
.galeria{position:relative}
.gal-trilho{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:999px 999px 28px 28px;box-shadow:0 50px 90px -50px rgba(43,36,32,.5)}
.gal-trilho::-webkit-scrollbar{display:none}
.gal-trilho>*{flex:0 0 100%;scroll-snap-align:start;aspect-ratio:4/5;position:relative}
.prod .gal-trilho .imprime{border-radius:0;box-shadow:none}
.gal-foto{background:var(--gelo);display:grid;place-items:center;overflow:clip}
.gal-foto img{width:100%;height:100%;object-fit:cover}
.gal-seta{position:absolute;top:50%;translate:0 -50%;z-index:3;width:48px;height:48px;border-radius:50%;border:0;background:rgba(251,250,248,.92);color:var(--grafite);display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 30px -12px rgba(0,0,0,.45);transition:transform .3s var(--mola),opacity .3s}
.gal-seta:hover{transform:scale(1.08)}
.gal-seta[disabled]{opacity:0;pointer-events:none}
.gal-seta.esq{left:12px}.gal-seta.dir{right:12px}
.gal-pontos{display:flex;justify-content:center;gap:8px;margin-top:16px}
.gal-pontos button{width:9px;height:9px;padding:0;border-radius:50%;border:0;background:rgba(43,36,32,.22);cursor:pointer;transition:background .3s,transform .3s}
.gal-pontos button[aria-current="true"]{background:var(--terracota);transform:scale(1.25)}
.gal-leg{font-size:12.5px;color:var(--texto2);margin-top:10px;text-align:center;min-height:1.4em}
.gal-dica{position:absolute;right:16px;bottom:16px;z-index:3;display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:rgba(43,36,32,.78);color:var(--branco);font-size:12.5px;font-weight:600;pointer-events:none;animation:dica 2.6s var(--suave) 1.2s both}
@keyframes dica{0%{opacity:0;transform:translateX(10px)}15%,80%{opacity:1;transform:none}100%{opacity:0}}

/* ---------- transição entre páginas ---------- */
.cortina{position:fixed;inset:0;z-index:100;background:var(--estudio);display:grid;place-items:center;pointer-events:none;opacity:0;transition:opacity .38s var(--suave)}
.cortina svg{width:min(120px,26vw);overflow:visible}
.cortina path{fill:none;stroke:var(--dourado);stroke-width:2.4;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.cortina.on{opacity:1;pointer-events:auto}
.cortina.on path{animation:traca 1s cubic-bezier(.6,0,.2,1) both}
html.entrando .cortina{opacity:1}
main,.heroi{animation:entra .6s var(--suave) both}
@keyframes entra{from{opacity:0}}

/* ---------- filamentos que correm na rolagem ---------- */
.filamentos{position:relative;height:clamp(120px,16vw,220px);margin-block:-20px;pointer-events:none;overflow:visible}
.filamentos svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.filamentos path{fill:none;stroke-width:4;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:var(--d,1)}
.heroi .fios{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.heroi .fios path{fill:none;stroke-width:1.6;stroke-dasharray:1;stroke-dashoffset:1;animation:traca 2.8s cubic-bezier(.6,0,.2,1) forwards}
@media (prefers-reduced-motion:reduce){body{animation:none}.filamentos path{stroke-dashoffset:0}}

/* cartas: escurecer com camada própria (sem filtro, que repinta a cada quadro) */
.carta::after{content:"";position:absolute;inset:0;background:#120E0B;opacity:var(--esc,0);pointer-events:none;border-radius:inherit;z-index:3}
.carta{will-change:transform}
/* impressão renderizada em 3D: pose final + vídeo/sequência por cima */
.imprime video,.imprime img.anim{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%;opacity:0;transition:opacity .45s var(--suave);pointer-events:none}
.imprime.tocando video,.imprime.tocando img.anim{opacity:1}
.palco .imprime img.anim,.palco .imprime img.final{object-fit:contain}
@media (prefers-reduced-motion:reduce){.imprime video,.imprime img.anim{display:none}}
.heroi-anim img.final{transition:opacity .45s var(--suave)}
.heroi-anim.tocando img.final{opacity:0}
.item:hover .arco video{transform:scale(1.05)}
.arco video{transition:transform 1.2s var(--suave),opacity .45s var(--suave);transform-origin:50% 100%}

/* WhatsApp: verde da árvore (identidade) e botão flutuante */
:root{--verde-zap:#2E6B47;--verde-zap-escuro:#24402F}
@media (max-width:980px){.sacola span{display:inline}}
@media (max-width:640px){.sacola{padding:0 16px;min-height:42px;font-size:13px}.sacola .zap-ico{display:none}}
.zap-flutua{position:fixed;right:max(18px,env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:60;display:flex;align-items:center;gap:10px;height:56px;padding:0 20px 0 16px;border-radius:999px;background:var(--verde-zap);color:#FBFAF8;text-decoration:none;font-size:14px;font-weight:600;box-shadow:0 18px 40px -16px rgba(20,36,26,.8),0 0 0 1px rgba(255,255,255,.08) inset;transform:translateY(120%);opacity:0;transition:transform .5s var(--suave),opacity .5s var(--suave),background .3s}
.zap-flutua.on{transform:none;opacity:1}
.zap-flutua:hover{background:var(--verde-zap-escuro)}
.zap-flutua svg{width:24px;height:24px;flex:none}
.zap-flutua::before{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(46,107,71,.55);animation:zap-pulso 2.8s 1.5s infinite}
@keyframes zap-pulso{0%{box-shadow:0 0 0 0 rgba(46,107,71,.5)}70%{box-shadow:0 0 0 16px rgba(46,107,71,0)}100%{box-shadow:0 0 0 0 rgba(46,107,71,0)}}
@media (max-width:640px){.zap-flutua{width:56px;padding:0;justify-content:center}.zap-flutua span{display:none}}
@media (prefers-reduced-motion:reduce){.zap-flutua::before{animation:none}}
.politica{padding-block:72px 96px}
.politica .wrap{max-width:760px}
.politica h2{font-family:var(--display);font-weight:400;font-size:clamp(26px,3vw,34px);margin:42px 0 12px}
.politica p,.politica li{font-size:16px;line-height:1.75;color:var(--texto2)}
.politica ul{padding-left:20px}
.rod-fim a{color:inherit}
@media (max-width:640px){.fim{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}}

/* linhas de filamento que preenchem o "Cada fio, uma camada" */
.fio-palco .fio-fios{position:absolute;inset:auto 0;left:0;width:100%;height:30%;pointer-events:none;overflow:visible}
.fio-palco .fios-cima{top:4%}
.fio-palco .fios-baixo{bottom:4%}
.fio-palco .fio-fios path{fill:none;stroke-width:4;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.fio-palco .fio-fios path:nth-child(1){stroke:#B3312E}
.fio-palco .fio-fios path:nth-child(2){stroke:#2D5A3D}
.fio-palco .fio-fios path:nth-child(3){stroke:#B58A45}
.fio-palco .fio-fios path:nth-child(4){stroke:#E2C6B2}
@media (max-width:640px){.fio-palco .fio-fios{height:24%}.fio-palco .fio-fios path{stroke-width:3}}

/* ---------- acessibilidade ---------- */
.pular{position:fixed;left:16px;top:-80px;z-index:200;background:var(--grafite);color:var(--marfim);padding:12px 18px;border-radius:999px;font-weight:600;text-decoration:none;transition:top .2s}
.pular:focus{top:calc(12px + env(safe-area-inset-top,0px))}
:focus{outline:none}
:focus-visible{outline:3px solid #B3312E;outline-offset:3px;border-radius:6px}
.fim :focus-visible,.fio :focus-visible,.perso :focus-visible{outline-color:#F2C9A8}
.so-leitor{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}

/* ---------- aviso de cookies (botões com o mesmo peso) ---------- */
.cookies{position:fixed;left:max(16px,env(safe-area-inset-left,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:120;width:min(440px,calc(100vw - 32px));background:var(--grafite);color:var(--marfim);border-radius:22px;padding:20px 20px 18px;box-shadow:0 30px 60px -24px rgba(20,16,12,.6);font-size:14px;line-height:1.6}
.cookies[hidden]{display:none}
.cookies p{margin:0}
.cookies a{color:#F2C9A8}
.cookies-bts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.ck-bt{min-height:46px;border-radius:999px;border:1px solid rgba(246,237,225,.55);background:transparent;color:var(--marfim);font:600 15px var(--body);cursor:pointer}
.ck-bt:hover{background:rgba(246,237,225,.1)}
@media (max-width:640px){.cookies{left:12px;right:12px;width:auto;bottom:calc(84px + env(safe-area-inset-bottom,0px))}}
.link-ck{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer;text-align:left}
.fim .link-ck{text-decoration:none;opacity:.85}
.fim .link-ck:hover{opacity:1}

/* ---------- novidades protegidas ---------- */
.armadilha{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.news-aviso{margin-top:10px;font-size:12.5px;line-height:1.55;color:rgba(246,237,225,.78)}
.news-aviso a{color:inherit}
.news-msg{margin-top:6px;font-size:13px;min-height:1.4em}
.news input[aria-invalid="true"]{border-color:#F2A49A}

/* ---------- oferta na página de produto ---------- */
.oferta{margin:4px 0 6px;border-top:1px solid rgba(43,36,32,.12)}
.oferta div{display:grid;grid-template-columns:110px 1fr;gap:14px;padding:12px 0;border-bottom:1px solid rgba(43,36,32,.12)}
.oferta dt{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--oliva-txt)}
.oferta dd{margin:0;font-size:14.5px;line-height:1.6;color:var(--texto2)}
.rod-fim span:first-child{max-width:62ch}
.politica ol{padding-left:20px}
.politica p a,.politica li a,.politica .link-ck{color:var(--terra-txt)}