/* Caya Diamonds — estilo do site (off-white, preto e branco) */
@font-face{font-family:"Archivo";src:url(fonts/archivo-latin-wdth-normal.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:"Archivo";src:url(fonts/archivo-latin-ext-wdth-normal.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap;unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Fragment Mono";src:url(fonts/fragment-mono-latin-400-normal.woff2) format("woff2");font-display:swap}

:root{
  --fundo:#F5F5F3; --branco:#FFFFFF; --linha:#DCDCD8; --linha-forte:#1A1A1A;
  --preto:#141414; --texto-2:#4F4F4C; --cinza:#6E6E6A;
  --ease:cubic-bezier(.16,1,.3,1);
  --g:clamp(20px,5vw,96px);
  --respiro:clamp(72px,10vw,150px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
body{background:var(--fundo);color:var(--preto);font:300 15px/1.6 "Archivo",system-ui,sans-serif;
  font-variant-numeric:tabular-nums lining-nums;-webkit-font-smoothing:antialiased;overflow-x:clip}
::selection{background:var(--preto);color:var(--fundo)}
img{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
a{color:inherit;text-underline-offset:.25em;text-decoration-thickness:1px}
:focus-visible{outline:1px solid var(--preto);outline-offset:4px}
.mono{font-family:inherit;font-weight:400;letter-spacing:.02em}
.pequeno{font-size:11px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;font-stretch:110%;color:var(--cinza)}

/* ---------- cabecalho ---------- */
.topo{position:sticky;top:0;z-index:20;background:rgba(245,245,243,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--linha)}
.topo-in{display:flex;align-items:center;gap:clamp(24px,4vw,64px);padding:22px var(--g)}
.marca{display:block;flex:none}
.marca img{height:20px;width:auto;filter:brightness(0)}
.indice{display:flex;gap:clamp(20px,3vw,44px);flex:1;overflow-x:auto;scrollbar-width:none}
.indice::-webkit-scrollbar{display:none}
.indice a{font-size:11px;font-weight:400;font-stretch:110%;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;white-space:nowrap;
  padding:6px 0;border-bottom:1px solid transparent;color:var(--texto-2)}
.indice a[aria-current="true"],.indice a:hover{color:var(--preto);border-bottom-color:var(--preto)}
.sacola-btn{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:11px;font-weight:400;font-stretch:110%;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap}
.sacola-btn .mono{min-width:20px;height:20px;display:inline-grid;place-items:center;background:var(--preto);color:var(--fundo);border-radius:10px;font-size:10px;padding:0 6px;letter-spacing:0}

/* ---------- abertura ---------- */
.abre{padding:clamp(48px,6vw,96px) var(--g) clamp(48px,6vw,96px);text-align:center}
.abre h1{font-weight:300;font-stretch:108%;font-size:clamp(22px,2.2vw,30px);line-height:1.35;letter-spacing:-.005em;max-width:30ch;margin:0 auto;text-wrap:balance}

/* ---------- o lote ---------- */
.lote{margin:0 var(--g) var(--respiro)}
.lote-cab{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px 56px;align-items:end;padding-bottom:20px;margin-bottom:clamp(32px,4vw,56px);border-bottom:1px solid var(--linha-forte)}
.lote-cab h2{font-weight:300;font-stretch:112%;font-size:clamp(24px,2.2vw,32px);line-height:1.1;letter-spacing:.01em}
.lote-cab .linha{color:var(--texto-2);font-size:14px;max-width:56ch;margin-top:8px}
.lote-cab dl{display:flex;gap:36px;flex-wrap:wrap;justify-content:flex-end}
.lote-cab dl div{display:grid;gap:4px}
.lote-cab dt{font-size:10px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--cinza);font-stretch:110%}
.lote-cab dd{font-size:13px;font-weight:400;white-space:nowrap}

.forro{position:relative}
.pecas{display:grid;gap:clamp(28px,3.4vw,56px) clamp(20px,2.6vw,40px);grid-template-columns:repeat(4,minmax(0,1fr));max-width:1240px}

/* ---------- a peca ---------- */
.peca{display:flex;flex-direction:column}
.foto{position:relative;aspect-ratio:4/5;background:#C4C2BE;overflow:hidden}
.foto img{width:100%;height:100%;object-fit:cover;transition:opacity .35s var(--ease),transform 1.2s var(--ease)}
.foto img.troca{opacity:.2}
.peca:hover .foto img{transform:scale(1.025)}
.peca-corpo{padding:16px 0 0;display:flex;flex-direction:column;gap:14px;flex:1}
.peca-nome{display:flex;justify-content:space-between;align-items:baseline;gap:14px}
.peca-nome h3{font-weight:400;font-stretch:105%;font-size:15px;line-height:1.3}
.peca-nome h3 .pequeno{display:block;margin-bottom:5px}
.peca-nome .mono{font-size:14px;white-space:nowrap}
.escolhas{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
.ouro-b{width:18px;height:18px;border-radius:50%;border:1px solid rgba(20,20,20,.2);transition:transform .2s var(--ease)}
.ouro-b:hover{transform:scale(1.1)}
.ouro-b[aria-pressed="true"]{box-shadow:0 0 0 2px var(--fundo),0 0 0 3px var(--preto)}
.eixo:has(.ouro-b){gap:10px}
.eixo{display:flex;gap:4px;flex-wrap:wrap}
.opc{font-size:11px;font-weight:400;letter-spacing:.06em;padding:5px 9px;border:1px solid var(--linha);background:transparent;transition:border-color .2s,background .2s,color .2s}
.opc:hover{border-color:var(--preto)}
.opc[aria-pressed="true"]{border-color:var(--preto);background:var(--preto);color:var(--fundo)}
.acao{margin-top:auto;padding:11px 0;border:0;border-bottom:1px solid var(--preto);font-size:11px;font-weight:400;font-stretch:110%;letter-spacing:.18em;text-transform:uppercase;
  display:flex;justify-content:space-between;align-items:center;text-decoration:none;transition:padding .3s var(--ease),background .3s var(--ease),color .3s}
.acao:hover,.acao.ok{background:var(--preto);color:var(--fundo);padding-inline:12px}
.acao svg{width:14px;height:14px}

/* ---------- Caya Colors ---------- */
.colors{display:grid;grid-template-columns:minmax(0,400px) minmax(0,440px);gap:clamp(32px,6vw,110px);align-items:start;max-width:1240px}
.painel{display:flex;flex-direction:column;gap:clamp(26px,2.6vw,34px)}
.painel .peca-nome h3{font-size:clamp(18px,1.5vw,21px)}
.painel .peca-nome .mono{font-size:clamp(17px,1.4vw,20px)}
.painel .resumo{font-size:14px;color:var(--texto-2);max-width:38ch;margin-top:-12px}
.rot{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}
.rot b{font-weight:400;font-size:13px}

.regua{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--linha)}
.regua button{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:10px;padding:16px 4px 11px;min-height:84px;
  border-right:1px solid var(--linha);background:var(--branco);transition:background .25s var(--ease),color .25s}
.regua button:last-child{border-right:0}
.regua .pedra{border-radius:50%;background:radial-gradient(circle at 38% 32%,#fff 0 24%,#EEEEEE 25% 50%,#CFCFCF 51% 100%);box-shadow:0 0 0 1px #8A8A8A}
.regua .mono{font-size:11px;letter-spacing:.06em}
.regua button:hover{background:var(--fundo)}
.regua button[aria-pressed="true"]{background:var(--preto);color:var(--fundo)}
.regua button[aria-pressed="true"] .pedra{box-shadow:0 0 0 1px var(--fundo)}

.bandas{display:flex;gap:12px;flex-wrap:wrap}
.bandas button{width:30px;height:30px;border-radius:50%;border:1px solid rgba(20,20,20,.18);transition:transform .25s var(--ease)}
.bandas button:hover{transform:scale(1.08)}
.bandas button[aria-pressed="true"]{box-shadow:0 0 0 3px var(--fundo),0 0 0 4px var(--preto)}
.painel .acao{padding:15px 18px;border:1px solid var(--preto);background:var(--preto);color:var(--fundo)}
.painel .acao:hover{background:transparent;color:var(--preto);padding-inline:18px}

/* ---------- sacola ---------- */
.sacola{position:fixed;inset:0 0 0 auto;width:min(420px,100%);background:var(--fundo);z-index:40;display:flex;flex-direction:column;
  box-shadow:-30px 0 60px -30px rgba(0,0,0,.35);transform:translateX(105%);transition:transform .45s var(--ease);visibility:hidden}
.sacola[data-aberta="true"]{transform:none;visibility:visible}
.veu{position:fixed;inset:0;background:rgba(20,20,20,.25);z-index:39;opacity:0;pointer-events:none;transition:opacity .3s}
.veu[data-aberta="true"]{opacity:1;pointer-events:auto}
.sacola header{display:flex;justify-content:space-between;align-items:center;padding:22px 26px;border-bottom:1px solid var(--linha)}
.sacola header h2{font-size:11px;font-weight:400;letter-spacing:.18em;text-transform:uppercase}
.sacola .lista{flex:1;overflow:auto;padding:8px 26px}
.item{display:grid;grid-template-columns:52px 1fr auto;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--linha)}
.item img{width:52px;height:65px;object-fit:cover}
.item b{font-weight:400;display:block}
.item small{display:block;color:var(--cinza);font-size:12px}
.item .rm{font-size:11px;color:var(--cinza);text-decoration:underline;margin-top:4px}
.vazia{padding:40px 0;color:var(--texto-2)}
.sacola footer{padding:22px 26px 28px;border-top:1px solid var(--linha);display:grid;gap:14px}
.sacola footer .tot{display:flex;justify-content:space-between;align-items:baseline}
.sacola footer .tot .mono{font-size:18px}
.fechar-pedido{display:block;text-align:center;padding:15px;background:var(--preto);color:var(--fundo);text-decoration:none;
  font-size:11px;font-weight:400;letter-spacing:.18em;text-transform:uppercase}
.fechar-pedido[aria-disabled="true"]{opacity:.3;pointer-events:none}
.sacola footer p{font-size:12px;color:var(--cinza)}
.x{width:36px;height:36px;display:grid;place-items:center}
.x svg{width:16px;height:16px}

/* ---------- rodape ---------- */
.rodape{padding:clamp(48px,6vw,88px) var(--g);border-top:1px solid var(--linha);background:var(--branco);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:36px;font-size:13px;color:var(--texto-2)}
.rodape b{display:block;color:var(--preto);font-size:11px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;margin-bottom:12px}
.rodape img{height:36px;width:auto;margin-bottom:16px;filter:brightness(0)}

/* ---------- entrada: as pecas sobem de leve, uma vez ---------- */
@media (prefers-reduced-motion:no-preference){
  .js .lote.dobrado .forro{opacity:0;transform:translateY(18px)}
  .js .forro{transition:opacity .9s var(--ease),transform 1.1s var(--ease)}
}

/* ---------- telas menores ---------- */
@media (max-width:1100px){
  .lote-cab{grid-template-columns:minmax(0,1fr)}
  .lote-cab dl{justify-content:flex-start}
  .pecas{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:860px){
  .topo-in{flex-wrap:wrap;row-gap:12px}
  .indice{order:3;flex-basis:100%}
  .colors{grid-template-columns:minmax(0,1fr);max-width:460px}
  .pecas{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lote-cab dl{gap:14px 28px}
}
@media (max-width:420px){
  .longo{display:none}
  .pecas{gap:28px 14px}
  .peca-nome{flex-direction:column;gap:4px}
}

/* certificado GIA */
.gia{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--preto)}
.gia[hidden]{display:none}

/* links da lista para a pagina da peca */
a.foto{display:block}
.nome-link{text-decoration:none}
.nome-link:hover{text-decoration:underline}

/* ---------- banner do topo ---------- */
.banner{padding:0 0 clamp(8px,1.4vw,18px)}
.banner-fotos{position:relative;aspect-ratio:21/9;overflow:hidden;background:#C4C2BE}
.banner-slide{position:absolute;inset:0;opacity:0;transition:opacity 1.4s var(--ease);pointer-events:none}
.banner-slide.ativo{opacity:1;pointer-events:auto}
.banner-slide img{width:100%;height:100%;object-fit:cover}
@media (prefers-reduced-motion:no-preference){
  .banner-slide img{transform:scale(1.035);transition:transform 7s linear}
  .banner-slide.ativo img{transform:none}
}
.banner-legenda{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:16px var(--g) 0}
.banner-nome{display:flex;gap:16px;align-items:baseline;min-width:0;white-space:nowrap;text-decoration:none;font-size:11px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;font-stretch:110%}
.banner-nome span:first-child{overflow:hidden;text-overflow:ellipsis}
.banner-nome .ver{color:var(--cinza);border-bottom:1px solid currentColor;padding-bottom:2px}
.banner-nome:hover .ver{color:var(--preto)}
.banner-controles{display:flex;align-items:center;gap:18px}
.banner-marcas{display:flex;gap:6px}
.banner-marcas button{width:28px;height:20px;display:flex;align-items:center}
.banner-marcas i{display:block;width:100%;height:1px;background:var(--linha);position:relative;overflow:hidden}
.banner-marcas i::after{content:"";position:absolute;inset:0;background:var(--preto);transform:scaleX(0);transform-origin:left}
.banner-marcas [aria-current="true"] i::after{transform:scaleX(1)}
.rodando .banner-marcas [aria-current="true"] i::after{transform:scaleX(0);animation:enche var(--tempo,6s) linear forwards}
@keyframes enche{to{transform:scaleX(1)}}
.banner-pausa{width:28px;height:28px;display:grid;place-items:center}
.banner-pausa svg{width:14px;height:14px}
@media (max-width:760px){
  .banner-fotos{aspect-ratio:16/9}
  .banner-marcas{display:none}
  .banner-legenda{padding-top:12px}
}

/* ---------- fotos editoriais nas colecoes ---------- */
.editorial{margin:0;display:flex;flex-direction:column;gap:12px}
.editorial img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;background:#C4C2BE}
.colors{grid-template-columns:minmax(0,340px) minmax(0,400px) minmax(0,340px);gap:clamp(28px,4.6vw,80px)}
.colors .editorial{align-self:start}
.colors>.painel{align-self:center}
.collection{margin-top:clamp(64px,8vw,112px)}
.todas-cores{list-style:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.todas-cores li{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:11px;letter-spacing:.06em;color:var(--texto-2)}
.todas-cores i{display:block;width:30px;height:30px;border-radius:50%;border:1px solid rgba(20,20,20,.18)}

/* ---------- a caixa Caya ---------- */
.caixa{margin:0 var(--g) var(--respiro);display:grid;grid-template-columns:minmax(0,420px) minmax(0,400px);gap:clamp(32px,7vw,120px);
  align-items:center;justify-content:center;padding-top:clamp(48px,6vw,88px);background:linear-gradient(var(--linha-forte),var(--linha-forte)) top/100% 1px no-repeat}
.caixa figure{margin:0}
.caixa img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.caixa-texto{display:flex;flex-direction:column;gap:16px;max-width:36ch}
.caixa-texto h2{font-weight:300;font-stretch:112%;font-size:clamp(24px,2.2vw,32px);line-height:1.15}
.caixa-texto p{color:var(--texto-2)}
.caixa-texto .acao{margin-top:12px;align-self:stretch}

@media (max-width:1100px){
  .colors{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr);gap:clamp(20px,3vw,40px)}
}
@media (min-width:761px) and (max-width:940px){
  .colors{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);max-width:none}
  .colors .editorial{grid-column:1 / -1}
  .colors .editorial img{aspect-ratio:16/9;object-position:50% 47%}
}
@media (max-width:860px){
  .caixa{grid-template-columns:minmax(0,1fr);max-width:460px;margin-inline:auto}
}

/* =========================================================
   CELULAR: escala propria, mais compacta (vale por ultimo)
   ========================================================= */
@media (max-width:760px){
  :root{--g:18px;--respiro:56px}
  body{font-size:14px}

  /* cabecalho */
  .topo-in{padding:14px var(--g) 10px;row-gap:10px}
  .marca img{height:16px}
  .indice{gap:18px}
  .indice a{font-size:11px;letter-spacing:.14em;padding:4px 0}
  .sacola-btn{font-size:11px;letter-spacing:.14em;gap:8px}

  /* abertura */
  .abre{padding:30px var(--g) 34px}
  .abre h1{font-size:17px;line-height:1.45;max-width:30ch}

  /* colecao: titulo e descricao; os dados ficam nas pecas */
  .lote-cab{padding-bottom:12px;margin-bottom:20px;gap:0}
  .lote-cab h2{font-size:22px}
  .lote-cab .linha{font-size:13px;margin-top:4px}
  .lote-cab dl{display:none}

  /* grade de pecas */
  .pecas{gap:26px 12px}
  .peca-corpo{padding-top:10px;gap:9px}
  .peca-nome{flex-direction:column;gap:3px}
  .peca-nome h3{font-size:13px}
  .peca-nome h3 .pequeno{margin-bottom:3px}
  .peca-nome .mono{font-size:13px}
  .escolhas{gap:8px 12px}
  .opc{font-size:11px;padding:4px 7px}
  .ouro-b{width:16px;height:16px}
  .acao{padding:8px 0}
  .editorial{gap:8px}

  /* Caya Colors: foto e nome lado a lado, escolhas embaixo */
  .colors{grid-template-columns:minmax(0,42%) minmax(0,1fr);column-gap:16px;row-gap:18px;max-width:none;align-items:start}
  .colors>.foto{grid-row:1 / span 2}
  .colors .painel{display:contents}
  .colors .painel .peca-nome{grid-column:2;align-self:end}
  .colors .painel .peca-nome h3{font-size:16px}
  .colors .painel .peca-nome .mono{font-size:15px}
  .colors .painel .resumo{grid-column:2;margin:0;font-size:13px;align-self:start}
  .colors .painel>div:not(.peca-nome),.colors .painel>.acao{grid-column:1 / -1}
  .colors .editorial{grid-column:1 / -1;margin-top:6px}
  .colors .editorial img{aspect-ratio:4/3;object-position:50% 47%}
  .regua button{min-height:66px;padding:12px 2px 8px;gap:7px}
  .bandas{gap:10px}
  .bandas button{width:26px;height:26px}
  .painel .acao{padding:13px 16px}
  .rot{margin-bottom:9px}

  /* caixa */
  .caixa{grid-template-columns:minmax(0,40%) minmax(0,1fr);gap:18px;max-width:none;margin:0 var(--g) var(--respiro);padding-top:32px;align-items:center}
  .caixa-texto{gap:8px}
  .caixa-texto h2{font-size:22px}
  .caixa-texto p{font-size:13px}
  .caixa-texto .acao{margin-top:4px}

  /* rodape */
  .rodape{padding:34px var(--g);gap:24px;font-size:13px}
  .rodape img{height:28px;margin-bottom:10px}

  /* sacola */
  .sacola header,.sacola footer{padding-inline:20px}
  .sacola .lista{padding-inline:20px}
}

@media (max-width:760px){
  .collection{margin-top:48px}
  .todas-cores{grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}
  .todas-cores i{width:24px;height:24px}
  .todas-cores li{font-size:11px;letter-spacing:0}
}

/* ---------- preferencia de ouro ---------- */
.ouro-pref{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:400;font-stretch:110%;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;margin-left:auto}
.ouro-pref i{display:block;width:14px;height:14px;border-radius:50%;border:1px solid rgba(20,20,20,.25)}
.ouro-pref+.sacola-btn{margin-left:0}
.pref{margin:auto;border:0;padding:clamp(28px,4vw,48px);width:min(440px,calc(100% - 36px));background:var(--fundo);color:var(--preto);
  box-shadow:0 30px 80px -30px rgba(0,0,0,.45)}
.pref::backdrop{background:rgba(20,20,20,.32);backdrop-filter:blur(2px)}
.pref[open]{animation:pref-entra .5s var(--ease)}
@keyframes pref-entra{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.pref h2:focus{outline:none}
.pref h2{font-weight:300;font-stretch:110%;font-size:clamp(22px,2.2vw,28px);line-height:1.2;padding-right:28px}
.pref p{color:var(--texto-2);font-size:14px;margin-top:10px;max-width:34ch}
.pref-x{position:absolute;top:14px;right:14px}
.pref-opcoes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:28px}
.pref-opcoes button{display:flex;flex-direction:column;align-items:center;gap:14px;padding:24px 10px 20px;border:1px solid var(--linha);background:var(--branco);
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-stretch:110%;transition:border-color .25s var(--ease)}
.pref-opcoes button:hover,.pref-opcoes button[aria-pressed="true"]{border-color:var(--preto)}
.pref-opcoes i{display:block;width:44px;height:44px;border-radius:50%;border:1px solid rgba(20,20,20,.18)}
@media (prefers-reduced-motion:reduce){.pref[open]{animation:none}}
@media (max-width:760px){
  .ouro-pref{font-size:11px;letter-spacing:.14em;gap:6px}
  .ouro-pref span{display:none}
  .ouro-pref i{width:16px;height:16px}
  .pref-opcoes{gap:8px}
}

/* ---------- medida do aro na sacola ---------- */
.item .aros{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:8px 14px;padding-top:4px}
.aro{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cinza)}
.aro select{font:inherit;font-size:13px;letter-spacing:0;text-transform:none;color:var(--preto);background:var(--branco);border:1px solid var(--linha);
  padding:7px 30px 7px 10px;appearance:none;-webkit-appearance:none;border-radius:0;
  background-image:linear-gradient(45deg,transparent 50%,var(--preto) 50%),linear-gradient(135deg,var(--preto) 50%,transparent 50%);
  background-position:calc(100% - 15px) 52%,calc(100% - 10px) 52%;background-size:5px 5px;background-repeat:no-repeat;cursor:pointer}
.aro select:focus-visible{outline:1px solid var(--preto);outline-offset:2px}
.aro select:invalid,.aro select:has(option[value=""]:checked){color:var(--cinza)}
.falta-aro{color:var(--preto)!important;font-size:12px}
.dica-aro{font-size:12px;color:var(--texto-2);padding:4px 0 12px}

/* foto da modelo alta + 4 pecas em 2x2 (Halo) */
.pecas.com-ed4{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1100px}
.pecas.com-ed4 .editorial{grid-row:span 2;display:flex;flex-direction:column}
.pecas.com-ed4 .editorial img{flex:1;aspect-ratio:auto;height:100%;min-height:0;object-position:50% 38%}
@media (max-width:860px){
  .pecas.com-ed4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pecas.com-ed4 .editorial{grid-column:1 / -1;grid-row:auto}
  .pecas.com-ed4 .editorial img{flex:none;aspect-ratio:4/5;height:auto}
}

.rodape .empresa{margin-top:14px;font-size:12px;color:var(--cinza);line-height:1.7}

/* bloco de atendimento: botao principal */
.atendimento .acao{background:var(--preto);color:var(--fundo);padding:15px 18px;border:1px solid var(--preto)}
.atendimento .acao:hover{background:transparent;color:var(--preto);padding-inline:18px}

/* botao Medir aro no topo */
.medir-aro{display:flex;align-items:center;gap:8px;margin-left:auto;font-size:11px;font-weight:400;font-stretch:110%;letter-spacing:.18em;text-transform:uppercase;
  white-space:nowrap;text-decoration:none;padding:7px 12px;border:1px solid var(--preto)}
.medir-aro svg{width:15px;height:15px}
.medir-aro:hover{background:var(--preto);color:var(--fundo)}
.medir-aro+.ouro-pref{margin-left:0}
@media (max-width:760px){
  .medir-aro{padding:5px 8px;gap:6px;letter-spacing:.1em}
}
.usar-medido{margin-left:8px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--preto);padding:2px 0}
.link-medir{align-self:center;font-size:12px;color:var(--texto-2)}

/* pagamento na sacola */
.pagar{display:block;width:100%;text-align:center;padding:16px;background:var(--preto);color:var(--fundo);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-stretch:110%}
.pagar[hidden]{display:none}
.pagar:disabled{opacity:.3;cursor:not-allowed}
.fechar-pedido.secundario{background:transparent;color:var(--preto);border:1px solid var(--preto)}
.erro-pag{font-size:12px;color:var(--preto)!important}
.sacola footer .frete{display:flex;justify-content:space-between;font-size:13px;color:var(--texto-2)}
.parcela{font-size:13px;color:var(--texto-2);margin-top:-6px}
.sacola footer .parcela{margin-top:-10px;text-align:right;font-size:12px}