/* oncas.css: pagina /loja/oncas/ e dialogo (prefixo .on-) */
.on-crumb{font-family:var(--font-sans);font-size:var(--step--1);color:var(--text-2)}
.on-crumb ol{display:flex;flex-wrap:wrap;align-items:center;margin:0;padding:0;list-style:none}
.on-crumb li+li::before{content:"›";margin-inline:.6rem;color:var(--text-3)}
.on-crumb a{display:inline-flex;align-items:center;min-height:44px;color:var(--text-2)}
.on-crumb+.on-head{margin-top:var(--space-2xs)}
.on-crumb a:hover{color:var(--accent)}
.on-crumb [aria-current]{color:var(--text)}
.on{padding-top:var(--space-xs);padding-bottom:var(--space-m)}
.on-sci{font-style:italic;font-weight:300;white-space:nowrap}
.on-lede{margin-top:var(--space-s)}
.on-sec{margin-top:var(--space-xl)}
.on-p{max-width:var(--measure);margin-top:var(--space-xs);color:var(--text-2)}
.nw{white-space:nowrap}
.on-p--vals{margin-top:var(--space-s);color:var(--text)}
.on-p--next{margin-top:var(--space-xs);color:var(--text);font-size:var(--step-1)}
.on-sizes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:var(--gutter);margin-top:var(--space-m);max-width:48rem}
.on-size{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:var(--space-2xs);padding:var(--space-xs);border:1px solid var(--line);background:var(--surface)}
.on-box{display:block;width:calc(var(--h)*.8%);aspect-ratio:calc(var(--h)/var(--w));border:1px solid var(--line-strong);background:var(--bg)}
.on-size__x{display:flex;flex-direction:column;gap:var(--space-3xs)}
.on-size__t{font-family:var(--font-sans);font-size:var(--step--1);font-weight:500;color:var(--text-2)}
.on-size__t,.on-rs label{word-spacing:.2em}
.on-size__c{color:var(--accent);font-weight:600}
.on-size__v{font-family:var(--font-display);font-size:var(--step-2);line-height:1.1;color:var(--text);white-space:nowrap}
@media (max-width:39.999rem){
  .on-sizes{grid-template-columns:minmax(0,1fr);align-items:stretch}
  .on-size{flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--space-s)}
  .on-box{flex:none;width:calc(var(--w)*.05rem);height:calc(var(--h)*.05rem);aspect-ratio:auto;margin-inline:calc((3.5rem - var(--w)*.05rem)/2)}
}
.on-next{margin-top:var(--space-m);padding-top:var(--space-s);border-top:1px solid var(--line);max-width:48rem}
.on-contacts{display:flex;flex-wrap:wrap;gap:var(--space-s) var(--space-m);margin-top:var(--space-xs)}
.on-contacts li{display:flex;flex-direction:column;gap:var(--space-3xs);min-width:0}
.on-btn{gap:.6rem;min-height:48px;max-width:100%}
.on-btn svg{flex:none}
.on-txt{font-family:var(--font-sans);font-size:var(--step--1);color:var(--text-2);overflow-wrap:anywhere}
.on-js:empty{display:none}
.on-note{max-width:var(--measure);margin-top:var(--space-s);font-family:var(--font-sans);font-size:var(--step--1);color:var(--text-3)}
.on-hint{margin-bottom:var(--space-s)}
.on-cap{margin-top:var(--space-2xs);font-family:var(--font-sans);font-size:var(--step--1);line-height:1.4;color:var(--text-2)}
@media (max-width:39.999rem){.on-cap{padding-inline:var(--margin)}}
@media (scripting:none){.on-hint{display:none}}

/* dialogo: palco da foto + painel; 2 colunas em telas largas */
html.on-open{overflow:hidden}
.on-dlg{position:fixed;inset:0;z-index:var(--z-lightbox);width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;background:var(--overlay);color:var(--text);overflow-y:auto;overscroll-behavior:contain}
@supports (height:100dvh){.on-dlg{height:100dvh}}
.on-dlg[open]{display:flex;flex-direction:column}
.on-dlg::backdrop{background:transparent}
.on-stage{flex:none;display:grid;place-items:center;height:min(56vh,100vw);min-height:12rem;padding:4.5rem var(--space-xs) .5rem;touch-action:pan-y}
.on-img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;-webkit-user-drag:none;user-select:none}
.on-panel{flex:1 0 auto;display:flex;flex-direction:column;gap:var(--space-xs);width:100%;max-width:32rem;margin-inline:auto;padding:var(--space-xs) var(--margin) var(--space-m)}
.on-bar{position:fixed;z-index:2;top:0;left:0;right:0;display:flex;align-items:center;gap:.25rem;padding:.5rem .75rem;background:linear-gradient(var(--overlay),transparent)}
.on-count{margin-right:auto;font-size:var(--step--1);color:var(--text-2)}
.on-prev{order:-1}
.on-prev,.on-next-b{margin-right:0}
.on-bar .on-count{order:0;margin:0 auto 0 0}
.on-ib{display:grid;place-items:center;width:48px;height:48px;padding:0;border:1px solid var(--line-strong);border-radius:var(--radius-s);background:rgba(14,13,11,.6);color:var(--text)}
.on-ib:hover{color:var(--accent);border-color:var(--accent)}
.on-dcap{font-family:var(--font-display);font-size:var(--step-1);line-height:1.25;color:var(--text);text-wrap:balance}
.on-rg{border:0;margin:0;padding:0}
.on-rs{display:flex;flex-direction:column;gap:var(--space-2xs);margin-top:var(--space-2xs)}
.on-rs input{position:absolute;opacity:0;width:1px;height:1px}
.on-rs label{display:flex;align-items:center;min-height:48px;padding:0 1rem;border:1px solid var(--line-strong);border-radius:var(--radius-s);font-size:var(--step--1);font-weight:500;color:var(--text-2);cursor:pointer}
.on-rs label:hover{border-color:var(--accent);color:var(--accent)}
.on-rs input:checked+label{background:var(--text);border-color:var(--text);color:var(--bg)}
.on-rs input:focus-visible+label{outline:var(--focus-ring);outline-offset:var(--focus-offset)}
.on-val{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem .75rem;font-size:var(--step--1);color:var(--text-2)}
.on-val__v{font-family:var(--font-display);font-size:var(--step-2);font-weight:400;line-height:1.1;color:var(--text);white-space:nowrap}
.on-go{gap:.6rem;min-height:52px}
.on-mail{align-self:flex-start;display:inline-flex;align-items:center;min-height:44px;font-size:var(--step--1);font-weight:500;letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--text)}
.on-fine{font-size:var(--step--1);color:var(--text-3)}
@media (min-width:56rem){
  .on-dlg[open]{display:grid;grid-template-columns:minmax(0,1fr) 24rem;overflow:hidden}
  .on-stage{height:100%;padding:4.5rem var(--space-s) var(--space-s)}
  .on-panel{max-width:none;margin:0;justify-content:center;padding:5rem var(--space-m) var(--space-m) var(--space-s);overflow-y:auto}
  .on-bar{left:auto;width:24rem;background:none}
}
@media (orientation:landscape) and (max-height:32rem) and (max-width:55.999rem){
  .on-dlg[open]{display:grid;grid-template-columns:minmax(0,1fr) 18rem;overflow:hidden}
  .on-stage{height:100%;padding:3.5rem .5rem .5rem}
  .on-panel{padding:4rem var(--space-xs) var(--space-xs);overflow-y:auto}
  .on-bar{left:auto;width:18rem;background:none}
}

/* contatos montados por JS; sem JS, so o link do Instagram */
.on-fb{margin-top:var(--space-xs)}
@media (scripting:enabled){.on-fb{display:none}}
@media (scripting:none){.on-contacts{display:none}}
.on-usd{margin-top:var(--space-3xs);font-size:var(--step--1)}