html.guia-raiz{--fundo:#CFD8C4;--tinta:#1E2A1B;--acento:#8A381F;--ponto:#C9744B;--fam:"Fraunces";--fvs:"wght" 600,"opsz" 72,"SOFT" 50,"WONK" 0}
.guia{--bom:#2F6B3F;--serif:var(--fam),"Serif Reserva",Georgia,serif;font-family:var(--sans)}
.guia [hidden]{display:none!important}
.guia ::selection{background:var(--tinta);color:var(--fundo)}
.guia main{display:grid;gap:10px;padding:0 10px}
.guia .sec{margin:0;padding:clamp(56px,8vw,112px) clamp(16px,3vw,40px);border-radius:0;background:none;border-top:1px solid var(--linha)}
.guia a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}
.guia code{font:400 .86em var(--mono)}
.guia :focus-visible{outline:2px solid var(--tinta);outline-offset:3px}

/* topo */
.gt{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;gap:clamp(28px,5vw,80px);min-height:calc(100svh - 2 * var(--moldura) - 82px);padding:clamp(28px,5vw,64px) clamp(16px,3vw,40px)}
.gt__texto{display:grid;grid-template-columns:minmax(0,1fr);gap:26px;justify-items:start}
.gt__t{max-width:13ch;margin:0;font:400 clamp(46px,6vw,92px)/1 var(--serif);font-variation-settings:var(--fvs);letter-spacing:-.025em;text-wrap:balance}
.gt__lead{max-width:46ch;margin:0;font:400 clamp(16px,1.3vw,18px)/1.55 var(--sans);color:var(--suave);text-wrap:pretty}
.gt__botoes{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;margin-top:4px}
.gt__cta{position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;gap:10px;min-height:54px;padding:0 24px 0 28px;border-radius:999px;background:var(--tinta);color:var(--fundo)!important;font:600 15px var(--sans);text-decoration:none;transition:transform .3s var(--curva),background-color .3s var(--curva)}
.gt__cta svg,.mu__seta svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.gt__cta svg{transition:transform .35s var(--curva)}
.gt__cta::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%);transform:translateX(-120%);animation:g-brilho 3.6s var(--curva) 1.6s infinite}
@keyframes g-brilho{0%,55%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
@media (hover:hover) and (pointer:fine){.gt__cta:hover{background-color:color-mix(in srgb,var(--tinta) 84%,var(--fundo))}.gt__cta:hover svg{transform:translateX(4px)}.gt__sec:hover{text-decoration-color:currentColor}}
.gt__cta:active{transform:scale(.97)}
.gt__sec{display:inline-flex;align-items:center;min-height:44px;font:500 15px var(--sans);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--tinta) 35%,transparent);transition:text-decoration-color .25s}

/* o quadro da mudança */
.mu{display:grid;gap:18px;width:min(100%,500px);justify-self:center;padding:clamp(20px,2.4vw,30px);border:1px solid var(--vidro-borda);border-radius:26px;background:var(--vidro);-webkit-backdrop-filter:var(--desfoque);backdrop-filter:var(--desfoque);box-shadow:inset 0 1px 0 var(--brilho),0 40px 80px -46px rgba(20,28,18,.55),0 14px 30px -24px rgba(20,28,18,.35);rotate:1.5deg;transition:rotate 1.4s var(--curva)}
.mu.vista{rotate:0deg}
.mu__topo{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding-bottom:16px;border-bottom:1px solid var(--linha)}
.mu__loja{display:grid;gap:2px}
.mu__loja small{font:400 10px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--suave)}
.mu__loja b{font:400 24px/1 var(--serif);font-variation-settings:var(--fvs)}
.mu__loja--nova{text-align:right}
.mu__seta{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--tinta);color:var(--fundo)}
.mu__lista{display:grid;gap:12px;margin:0;padding:0;list-style:none;counter-reset:none}
.mu__lista li{display:grid;grid-template-columns:minmax(0,9.5em) minmax(0,1fr) 22px;align-items:center;gap:14px;font:500 14px var(--sans);color:color-mix(in srgb,var(--tinta) 55%,var(--fundo));transition:color .5s var(--curva)}
.mu__lista li.ok{color:var(--tinta)}
.mu__trilho{position:relative;height:2px;border-radius:2px;background:color-mix(in srgb,var(--tinta) 14%,transparent)}
.mu__trilho i{position:absolute;inset:0;border-radius:inherit;background:var(--tinta);clip-path:inset(0 100% 0 0);transition:clip-path .8s var(--curva)}
.mu__trilho::after{content:"";position:absolute;top:50%;left:0;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:var(--ponto);box-shadow:0 0 0 4px color-mix(in srgb,var(--ponto) 22%,transparent);opacity:0;transition:left .8s var(--curva),opacity .3s}
.ok .mu__trilho i{clip-path:inset(0)}
.ok .mu__trilho::after{left:calc(100% - 9px);opacity:1}
.mu__lista li.ok.fim .mu__trilho::after{opacity:0}
.mu__ok{display:grid;place-items:center;width:22px;height:22px;border:1.5px solid color-mix(in srgb,var(--tinta) 28%,transparent);border-radius:50%;transition:background .35s .5s,border-color .35s .5s}
.mu__ok svg{width:14px;height:14px;fill:none;stroke:var(--fundo);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mu__ok path{stroke-dasharray:14;stroke-dashoffset:14;transition:stroke-dashoffset .4s var(--curva) .65s}
.ok .mu__ok{border-color:var(--bom);background:var(--bom)}
.ok .mu__ok path{stroke-dashoffset:0}
.mu__url{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:14px 16px;border-radius:16px;background:color-mix(in srgb,var(--fundo) 62%,transparent)}
.mu__url code{font:400 12px var(--mono);white-space:nowrap}
.mu__velha{color:var(--suave);transition:text-decoration-color .4s;text-decoration:line-through;text-decoration-color:transparent}
.mu__url.ok .mu__velha{text-decoration-color:currentColor}
.mu__301{padding:3px 8px;border-radius:999px;background:var(--acento);color:#F6EFE6;font:600 11px var(--mono);scale:.6;opacity:0;transition:scale .45s cubic-bezier(.3,1.6,.5,1) .2s,opacity .2s .2s}
.mu__nova{clip-path:inset(0 100% 0 0);transition:clip-path .7s var(--curva) .45s}
.mu__url.ok .mu__301{scale:1;opacity:1}
.mu__url.ok .mu__nova{clip-path:inset(0)}
.mu__dns{display:flex;align-items:center;justify-content:space-between;gap:12px;font:400 12px var(--mono)}
.mu__chave{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:3px;border:1px solid var(--linha);border-radius:999px;background:color-mix(in srgb,var(--fundo) 55%,transparent)}
.mu__chave small{position:relative;z-index:1;padding:6px 12px;font:500 11px var(--sans);text-align:center;transition:color .5s var(--curva)}
.mu__chave small:first-of-type{color:var(--fundo)}
.mu__chave i{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:999px;background:var(--tinta);transition:translate .7s var(--curva)}
.mu__dns.ok .mu__chave i{translate:100% 0}
.mu__dns.ok .mu__chave small:first-of-type{color:inherit}
.mu__dns.ok .mu__chave small:last-of-type{color:var(--fundo)}

/* seções de leitura */
.gs{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,5vw,88px);align-items:start}
.gs__cab{position:sticky;top:96px;display:grid;gap:18px}
.gs__t{max-width:16ch;margin:0;font:400 clamp(36px,4.4vw,64px)/1.02 var(--serif);font-variation-settings:var(--fvs);letter-spacing:-.02em;text-wrap:balance}
.gs__lead{max-width:40ch;margin:0;font:400 16px/1.55 var(--sans);color:var(--suave);text-wrap:pretty}
.gs__lista{display:grid;margin:0;border-top:1px solid var(--linha)}
.gs__lista>div{display:grid;grid-template-columns:46px minmax(0,1fr);gap:6px 20px;padding:24px 0;border-bottom:1px solid var(--linha)}
.gs__lista dt{display:contents;font:600 17px/1.35 var(--sans)}
.gs__nome{grid-column:2;align-self:end}
.gs__lista dd{grid-column:2;max-width:62ch;margin:0;font:400 16px/1.6 var(--sans);color:var(--suave);text-wrap:pretty}
.gs__destaque dt{color:var(--acento)}

/* passos */
.gc{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(36px,5vw,64px)}
.gc .gs__t{max-width:18ch}
.gc__passos{--feito:0;position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px;margin:0;padding:54px 0 0;list-style:none;counter-reset:passo}
.gc__passos::before,.gc__passos::after{content:"";position:absolute;top:17px;left:18px;right:18px;height:2px;border-radius:2px;background:color-mix(in srgb,var(--tinta) 14%,transparent)}
.gc__passos::after{background:var(--tinta);transform-origin:left;transform:scaleX(var(--feito));transition:transform 1.8s var(--curva)}
.gc__passos li{position:relative;z-index:1;display:grid;align-content:start;gap:8px;counter-increment:passo}
.gc__passos li::before{content:counter(passo);position:absolute;top:-54px;left:0;display:grid;place-items:center;width:36px;height:36px;border:2px solid var(--tinta);border-radius:50%;background:#D6DECB;box-sizing:border-box;font:600 13px/1 var(--mono);color:var(--tinta);transition:background-color .4s var(--curva) calc(var(--i) * .3s + .2s),color .4s var(--curva) calc(var(--i) * .3s + .2s)}
.gc__passos.vista li::before{background:var(--tinta);color:var(--fundo)}
.gc__passos b{font:400 26px/1.08 var(--serif);font-variation-settings:var(--fvs)}
.gc__passos span{max-width:30ch;font:400 15px/1.55 var(--sans);color:var(--suave);text-wrap:pretty}
.gc__virada b{color:var(--acento)}
.gc__virada::before{border-color:var(--acento)!important;color:var(--acento)!important}
.gc__passos.vista .gc__virada::before{background:var(--acento);color:#F6EFE6!important}

/* ícones */
.ico{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.gs__ico{grid-row:1/3;display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:color-mix(in srgb,var(--tinta) 7%,transparent);color:var(--tinta);transition:background-color .35s var(--curva),color .35s var(--curva),rotate .5s var(--curva)}
.gs__lista>div:hover .gs__ico{background:var(--tinta);color:var(--fundo);rotate:-6deg}
.gs__destaque .gs__ico{background:var(--acento);color:#F6EFE6}

/* teste do endereço */
.ur{display:grid;gap:10px;margin-top:20px;padding:18px;border:1px solid var(--vidro-borda);border-radius:20px;background:var(--vidro);-webkit-backdrop-filter:var(--desfoque);backdrop-filter:var(--desfoque);box-shadow:inset 0 1px 0 var(--brilho),var(--sombra);color:var(--tinta)}
.ur__t{font:600 14px var(--sans)}
.ur__de,.ur__para{display:flex;align-items:center;gap:10px;min-height:50px;padding:0 8px 0 14px;border-radius:14px}
.ur__de{border:1px solid var(--linha);background:color-mix(in srgb,var(--fundo) 70%,transparent);transition:border-color .25s,box-shadow .25s}
.ur__de:focus-within{border-color:var(--tinta);box-shadow:0 0 0 3px color-mix(in srgb,var(--tinta) 10%,transparent)}
.ur__de input{flex:1;min-width:0;height:48px;padding:0;border:0;background:none;color:var(--tinta);font:400 14px var(--mono);caret-color:var(--acento);outline:none}
.ur__de input::placeholder{color:color-mix(in srgb,var(--tinta) 55%,var(--fundo))}
.ur__para{background:var(--tinta);color:var(--fundo)}
.ur__para code{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.ur__tag{flex:none;order:2;margin-left:auto;padding:3px 8px;border-radius:999px;background:color-mix(in srgb,var(--tinta) 9%,transparent);font:500 10px var(--mono);text-transform:uppercase;letter-spacing:.05em}
.ur__tag--nova{background:color-mix(in srgb,var(--fundo) 18%,transparent)}
.ur__meio{display:flex;align-items:center;gap:8px;padding:0 20px}
.ur__meio i{flex:1;height:0;border-top:1.5px dashed color-mix(in srgb,var(--tinta) 30%,transparent)}
.ur__301{padding:3px 10px;border-radius:999px;background:var(--acento);color:#F6EFE6;font:600 11px var(--mono)}
.ur.trocou .ur__301{animation:carimbo .55s cubic-bezier(.3,1.6,.5,1)}
.ur.trocou .ur__para code{animation:revela .6s var(--curva)}
@keyframes carimbo{0%{scale:.5;opacity:0}100%{scale:1;opacity:1}}
@keyframes revela{0%{clip-path:inset(0 100% 0 0)}100%{clip-path:inset(0)}}
.ur__nota{font:400 13px/1.45 var(--sans);color:var(--suave)}

/* monte a sua mudança */
.cf__qtd{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:10px 16px}
.cf__qtd label{font:400 12px var(--mono);text-transform:uppercase;color:var(--suave)}
.cf__qtd output{font:400 30px/1 var(--serif);font-variation-settings:var(--fvs)}
.cf__qtd input{--p:42.86%;grid-column:1/-1;width:100%;height:28px;margin:0;background:none;-webkit-appearance:none;appearance:none;cursor:pointer}
.cf__qtd input::-webkit-slider-runnable-track{height:6px;border-radius:6px;background:linear-gradient(var(--tinta),var(--tinta)) 0/var(--p) 100% no-repeat,color-mix(in srgb,var(--tinta) 14%,transparent)}
.cf__qtd input::-moz-range-track{height:6px;border-radius:6px;background:color-mix(in srgb,var(--tinta) 14%,transparent)}
.cf__qtd input::-moz-range-progress{height:6px;border-radius:6px;background:var(--tinta)}
.cf__qtd input::-webkit-slider-thumb{width:26px;height:26px;margin-top:-10px;border:3px solid #D6DECB;border-radius:50%;background:var(--tinta);box-shadow:0 4px 12px -4px rgba(20,28,18,.5);-webkit-appearance:none;appearance:none;transition:scale .25s var(--curva)}
.cf__qtd input::-moz-range-thumb{width:20px;height:20px;border:3px solid #D6DECB;border-radius:50%;background:var(--tinta)}
.cf__qtd input:active::-webkit-slider-thumb{scale:1.15}
.cf__qtd input:focus-visible{outline:none}
.cf__qtd input:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px color-mix(in srgb,var(--tinta) 22%,transparent)}
.cf__fichas span{gap:8px;padding:0 16px 0 12px}
.cf__fichas .ico{width:18px;height:18px}
.cf__fichas input:checked+span .ico{animation:pula-ico .45s var(--curva)}
@keyframes pula-ico{40%{scale:1.3;rotate:-8deg}}
.cf__mais{font-size:15px}
.vp .pd__itens li.sai{animation:sai-item .3s var(--curva) forwards}
@keyframes sai-item{to{opacity:0;translate:12px 0}}
.vp__mini .ico{width:24px;height:24px}

/* perguntas */
.gp{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,5vw,88px);align-items:start}
.gp__lista{border-top:1px solid var(--linha)}
.gp__item{border-bottom:1px solid var(--linha)}
.gp__item summary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:64px;padding:16px 0;font:600 17px/1.35 var(--sans);list-style:none;cursor:pointer}
.gp__item summary::-webkit-details-marker{display:none}
.gp__item summary i{position:relative;flex:none;width:32px;height:32px;border:1px solid var(--linha);border-radius:50%;transition:rotate .45s var(--curva),background-color .25s,border-color .25s}
.gp__item summary i::before,.gp__item summary i::after{content:"";position:absolute;top:50%;left:50%;width:12px;height:1.5px;margin:-.75px 0 0 -6px;border-radius:2px;background:currentColor}
.gp__item summary i::after{rotate:90deg;transition:rotate .45s var(--curva)}
.gp__item[open] summary i{rotate:180deg;border-color:var(--tinta)}
.gp__item[open] summary i::after{rotate:0deg}
@media (hover:hover) and (pointer:fine){.gp__item summary:hover i{border-color:var(--tinta);background-color:color-mix(in srgb,var(--tinta) 6%,transparent)}}
.gp__item p{max-width:60ch;margin:0;padding:0 48px 24px 0;font:400 16px/1.6 var(--sans);color:var(--suave);text-wrap:pretty}
.gp__item::details-content{block-size:0;overflow:clip;transition:block-size .5s var(--curva),content-visibility .5s allow-discrete}
.gp__item[open]::details-content{block-size:auto}
@supports (interpolate-size:allow-keywords){:root{interpolate-size:allow-keywords}}

/* pedido, no molde da sacola da home */
.vp .pd__grade{margin-top:0;align-items:center}
.vp .pd__info{gap:22px}
.vp__lead{max-width:44ch;margin:0;font:400 17px/1.5 var(--sans);color:var(--suave);text-wrap:pretty}
.vp .pd__sacola{position:relative;top:auto;right:auto;bottom:auto;z-index:auto;width:auto;transform:none;visibility:visible;overflow:visible;transition:none}
.vp .pd__itens li{grid-template-columns:auto 1fr}
.vp__mini{grid-row:1/3;display:grid;place-items:center;width:52px;height:52px;border-radius:12px;background:var(--tinta);color:var(--fundo)}
.vp .pd__finalizar:disabled{opacity:.6;cursor:progress}
.vp .pd__campo textarea::placeholder,.vp .pd__campo input::placeholder{color:color-mix(in srgb,var(--tinta) 55%,var(--fundo))}
.guia .rodape{align-items:center;text-align:center}

@media (max-width:900px){
  .guia main{padding:0 6px;gap:6px}
  .guia .barra__nav{display:none}
  .guia .barra{grid-template-columns:1fr auto}
  .gt{grid-template-columns:1fr;min-height:0;padding:28px 12px 40px;gap:36px}
  .gt__t{font-size:clamp(42px,11.5vw,64px)}
  .mu{rotate:0deg}
  .mu__lista li{grid-template-columns:minmax(0,8.6em) minmax(0,1fr) 22px;gap:10px}
  .gs,.gp{grid-template-columns:1fr}
  .gs__cab{position:static}
  .gs__lista>div{grid-template-columns:40px minmax(0,1fr);gap:4px 16px}
  .gs__ico{width:40px;height:40px;border-radius:12px}
  .gc__passos{grid-template-columns:1fr;gap:30px;padding:0 0 0 52px}
  .gc__passos::before,.gc__passos::after{top:18px;bottom:18px;left:17px;right:auto;width:2px;height:auto}
  .gc__passos::after{transform-origin:top;transform:scaleY(var(--feito))}
  .gc__passos li::before{top:-4px;left:-52px}
  .ur__meio{padding:0 14px}
  .gp__item p{padding-right:0}
}
@media (prefers-reduced-motion:reduce){
  .gt__cta::before,.ur.trocou *,.cf__fichas .ico,.vp .pd__itens li{animation:none!important}
  .gc__passos li::before,.gs__ico{transition:none}
  .mu,.mu *,.mu *::before,.mu *::after,.gc__passos::after,.gp__item::details-content,.gp__item summary i,.gp__item summary i::after{transition:none!important}
}