/* Boi Riscado look (marca v2, 2026-10): the new logo's ink and cream, Jost titles, the hand-drawn risco and the
   everyday bull (maps/boi.mjs) in taupe with the picked cut in wine. Only for pages without a shop theme: every
   rule starts with :root:not([data-loja]), so a themed shop (TBEEF) never sees it (tests/marca.test.mjs checks).
   Jost is self-hosted (SIL OFL 1.1, license in assets/fonts); a font face loads only where a rule uses it. */
@font-face{font-family:Jost;font-style:normal;font-weight:100 900;font-display:swap;src:url('./assets/fonts/jost-latin-wght-normal.woff2') format('woff2')}

:root:not([data-loja]){
 --paper:#f3efea;--surface:#fbf9f6;--ink:#34302c;--muted:#6b645c;--border:#e2dbd1;--tint:#efe2de;--creme-escuro:#e9e3da;
 --wine:#702e32;--wine-dark:#542125;--titulo:Jost,'DM Sans',system-ui,sans-serif;
 --dianteiro:#cdbfaf;--costas:#b3a290;--barriga:#e4dbd0;--traseiro:#7f6f60;--boi-fora:#9c8e80;--boi-em-falta:#d8d2c8;
}
:root:not([data-loja]) body{background:var(--paper);color:var(--ink)}

/* Header: the shop's name in the title face; on a page with no shop, the wordmark. */
:root:not([data-loja]) .brand.is-shop{font:700 23px/1.1 var(--titulo);letter-spacing:-.02em;color:var(--ink)}
:root:not([data-loja]) .brand:not(.is-shop)>*{display:none}
:root:not([data-loja]) .brand:not(.is-shop)::before{content:"";display:block;width:116px;height:31px;background:url('/assets/marca/boiriscado.svg') left center/contain no-repeat}

/* Title, with the logo's risco under "o seu corte?", in ink like the logo. */
:root:not([data-loja]) .counter-title{font:700 clamp(2.5rem,9vw,3.25rem)/1.06 var(--titulo);letter-spacing:-.02em;color:var(--ink);margin:6px 0 22px}
:root:not([data-loja]) .counter-title span{position:relative;white-space:nowrap;color:inherit}
:root:not([data-loja]) .counter-title span::after{content:"";position:absolute;left:-3%;right:-3%;bottom:-.16em;height:.24em;background:var(--ink);pointer-events:none;-webkit-mask:url('/assets/marca/risco.svg') center/100% 100% no-repeat;mask:url('/assets/marca/risco.svg') center/100% 100% no-repeat}

/* Search. */
:root:not([data-loja]) #page-explorar .search{background:var(--creme-escuro);border:0;border-radius:18px}
:root:not([data-loja]) #page-explorar .search [data-icon]{color:var(--ink)}
:root:not([data-loja]) #page-explorar .search:focus-within{box-shadow:0 0 0 2px var(--wine)}
:root:not([data-loja]) #search::placeholder{color:var(--muted);opacity:1}

/* The bull: taupe parts from cream to ink; head, hooves and far legs are not cuts. Hover and the picked cut share the
   one wine, so the cut keeps its colour from the drawing to the sheet. */
:root:not([data-loja]) .cow-outline{fill:var(--dianteiro)}
:root:not([data-loja]) .cow-head,:root:not([data-loja]) .cow-hoof{fill:var(--boi-fora)}
:root:not([data-loja]) .cow-tuft{fill:var(--traseiro)}
:root:not([data-loja]) .cow-shadow{fill:var(--barriga)}
:root:not([data-loja]) .cow-edge{stroke:var(--traseiro)}
:root:not([data-loja]) .map-zone path{stroke:var(--paper)}
:root:not([data-loja]) .map-zone text{fill:var(--ink)}
:root:not([data-loja]) .map-zone.is-out path{fill:var(--boi-em-falta)}
:root:not([data-loja]) .map-zone.is-out text{fill:var(--muted)}
:root:not([data-loja]) .map-zone:hover path,:root:not([data-loja]) .map-zone.selected path{fill:var(--wine)}
:root:not([data-loja]) .map-zone[data-part=Traseiro] text,:root:not([data-loja]) .map-zone:hover text,:root:not([data-loja]) .map-zone.selected text{fill:#fff}
:root:not([data-loja]) .map-zone[data-zone=rabada] text{fill:var(--ink)}
:root:not([data-loja]) .map-zone[data-zone=rabada].selected text{fill:var(--wine)}
:root:not([data-loja]) .map-zone:focus-visible path{stroke:var(--ink);stroke-width:1.4}

/* Cut sheet (cut-sheet.mjs, fichaMarca): one phone screen; the rest under "Mais sobre este corte". */
:root:not([data-loja]) #cut-sheet.ficha{background:var(--surface);color:var(--ink)}
:root:not([data-loja]) .ficha-loja{margin:0 0 4px;font-size:14px;font-weight:600;color:var(--muted)}
:root:not([data-loja]) .ficha-topo{align-items:flex-start;gap:12px}
:root:not([data-loja]) #cut-sheet.ficha #sheet-title{font:700 36px/1.05 var(--titulo);letter-spacing:-.02em;margin:0}
:root:not([data-loja]) .ficha-sub{margin:4px 0 0;font-size:15px;color:var(--muted)}
:root:not([data-loja]) .ficha-topo .icon-button{width:44px;height:44px;flex-shrink:0;display:grid;place-items:center;border:0;border-radius:50%;background:var(--creme-escuro);color:var(--ink)}
:root:not([data-loja]) #cut-sheet.ficha .sheet-out{margin:12px 0 0}
:root:not([data-loja]) #cut-sheet.ficha .sheet-locator{margin-top:14px;background:var(--paper);border-radius:18px;padding:8px 14px}
:root:not([data-loja]) .cow-locator path{opacity:1;stroke:none}
:root:not([data-loja]) .cow-locator [data-part]{stroke:var(--paper);stroke-width:1.1}
:root:not([data-loja]) .cow-locator .cow-outline{fill:var(--dianteiro)}
:root:not([data-loja]) .cow-locator .cow-edge{stroke:var(--traseiro)}
:root:not([data-loja]) .cow-locator path.is-here{fill:var(--wine);stroke:var(--paper)}
:root:not([data-loja]) .ficha-onde{margin-top:16px}
:root:not([data-loja]) .ficha-bloco{margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}
:root:not([data-loja]) .ficha-rotulo{margin:0 0 6px;font:600 14px/1.4 var(--sans);color:var(--muted)}
:root:not([data-loja]) #cut-sheet.ficha .where-text{margin:0;font-size:17px;line-height:1.45}
:root:not([data-loja]) #cut-sheet.ficha .method-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0}
:root:not([data-loja]) #cut-sheet.ficha .method-tags span{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;background:var(--creme-escuro);color:var(--ink);font-size:15px}
:root:not([data-loja]) #cut-sheet.ficha .sheet-siblings{margin:0}
:root:not([data-loja]) #cut-sheet.ficha .sheet-siblings button{min-height:40px;font-size:15px;background:var(--surface)}
:root:not([data-loja]) #cut-sheet.ficha .sheet-siblings button[aria-pressed=true]{background:var(--wine);color:#fff}
:root:not([data-loja]) .ficha-mais{margin-top:18px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}
:root:not([data-loja]) .ficha-mais summary{display:flex;align-items:center;justify-content:space-between;min-height:54px;padding:0 16px;font-size:16px;font-weight:600;cursor:pointer;list-style:none}
:root:not([data-loja]) .ficha-mais summary::-webkit-details-marker{display:none}
:root:not([data-loja]) .ficha-mais summary::after{content:"";width:8px;height:8px;margin:-4px 4px 0 12px;border-right:2px solid;border-bottom:2px solid;transform:rotate(45deg)}
:root:not([data-loja]) .ficha-mais[open] summary::after{margin-top:4px;transform:rotate(-135deg)}
:root:not([data-loja]) .ficha-mais summary:focus-visible{outline:2px solid var(--wine);outline-offset:2px;border-radius:14px}
:root:not([data-loja]) .ficha-mais>div{padding:2px 16px 16px}
:root:not([data-loja]) .ficha-mais .ficha-rotulo{margin-top:14px}
:root:not([data-loja]) .ficha-mais .ficha-rotulo:first-child{margin-top:0}
:root:not([data-loja]) .ficha-mais p{margin:0;font-size:16px;line-height:1.5}
:root:not([data-loja]) .ficha-mais .where-myth{margin-top:14px;padding:12px 14px;border-radius:14px;background:var(--tint);font-size:15px}
:root:not([data-loja]) .ficha-mais .sheet-source{margin-top:14px;font-size:13px;color:var(--muted)}
:root:not([data-loja]) .ficha-fonte{display:inline-block;margin-top:14px;font-size:13px;color:var(--wine);text-decoration:underline}
:root:not([data-loja]) .ficha-vizinhos{margin:18px 0 4px}
:root:not([data-loja]) .ficha-vizinhos p{margin:0 0 8px;font-size:14px;font-weight:600;color:var(--muted)}
:root:not([data-loja]) .ficha-vizinhos div{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-right:-24px;padding-right:24px}
:root:not([data-loja]) .ficha-vizinhos div::-webkit-scrollbar{display:none}
:root:not([data-loja]) .ficha-vizinhos button{flex-shrink:0;display:inline-flex;align-items:center;gap:5px;min-height:40px;padding:0 14px;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--ink);font:inherit;font-size:15px;white-space:nowrap;cursor:pointer}
:root:not([data-loja]) .ficha-vizinhos b{color:var(--wine);font-weight:600}
/* With a WhatsApp number, the button stays in reach at the bottom while the sheet scrolls. */
:root:not([data-loja]) #cut-sheet.ficha .sheet-actions{position:sticky;bottom:0;margin:12px -24px 0;padding:24px 24px 4px;background:linear-gradient(rgba(251,249,246,0),var(--surface) 34%)}

/* About dialog and footer: the wordmark signs the page. */
:root:not([data-loja]) #info-dialog h2{font:700 24px/1.2 var(--titulo);letter-spacing:-.01em}
:root:not([data-loja]) .counter-footer{color:var(--muted)}
:root:not([data-loja]) .counter-footer span{display:inline-block;width:70px;height:19px;vertical-align:-5px;font-size:0;background:url('/assets/marca/boiriscado.svg') center/contain no-repeat}
