:root { --ink:#242424; --muted:#595752; --green:#183e32; --line:#d9d6d0; --surface:#eeece8; --paper:#fffcf7; --rail:94px; --serif:Georgia,'Times New Roman',serif; }
* { box-sizing:border-box; letter-spacing:0; }
html { background:var(--paper); scroll-behavior:auto; }
body { margin:0; color:var(--ink); background:var(--paper); font:14px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
[hidden] { display:none !important; }
:focus-visible { outline:2px solid var(--green); outline-offset:4px; }
img { display:block; max-width:100%; }
.page { max-width:1240px; margin:0 auto; padding-bottom:calc(80px + env(safe-area-inset-bottom)); }
.catalog-top { padding:20px 16px 14px; border-bottom:1px solid var(--line); background:var(--paper); }
.shop-name { margin:0; text-align:center; font:26px/1.2 var(--serif); color:var(--green); }
.catalog-body { display:grid; grid-template-columns:var(--rail) minmax(0,1fr); min-height:calc(100svh - 260px); }
.category-rail { border-right:1px solid var(--line); background:var(--paper); padding:10px 0; align-self:start; position:sticky; top:0; }
.rail-link { display:flex; align-items:center; min-height:66px; padding:12px 10px; font-size:12px; line-height:1.45; border-left:3px solid transparent; color:var(--muted); }
.rail-link[aria-current] { border-left-color:var(--green); background:var(--ink); color:#fff; font-weight:600; }
.catalog-pane { min-width:0; padding:18px 12px 24px; }
h1 { margin:0 0 16px; font:28px/1.15 var(--serif); color:var(--ink); overflow-wrap:break-word; }
h1:focus { outline:none; }
h2 { font:20px/1.25 var(--serif); margin:22px 0 4px; }
.catalog-banner { width:100%; height:auto; aspect-ratio:2.6; object-fit:cover; border-radius:4px; margin-bottom:22px; }
.collection-grid,.brand-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); list-style:none; gap:22px 12px; margin:0; padding:0; }
.collection-grid li,.brand-grid li { min-width:0; }
.collection-tile,.brand-link { display:grid; grid-template-columns:minmax(0,1fr); gap:9px; align-content:start; width:100%; }
.tile-photo,.brand-photo { width:100%; height:auto; aspect-ratio:1; object-fit:contain; border-radius:4px; background:#f7f8f6; }
.brand-photo.is-logo { padding:14px; background:#fafbf9; }
.brand-wordmark { display:grid; place-items:center; padding:12px; text-align:center; font:17px/1.3 var(--serif); overflow-wrap:anywhere; }
.image-placeholder { display:grid; place-items:center; padding:10px; color:var(--muted); text-align:center; font-size:11px; }
.tile-name,.brand-name { min-width:0; font-size:12px; line-height:1.4; text-align:center; overflow-wrap:anywhere; }
.collection-tile:hover,.brand-link:hover { color:var(--green); }
.collection-tile:hover img,.brand-link:hover img { outline:1px solid #c7d5cc; }
.other-collections { display:grid; grid-template-columns:1fr; margin-top:22px; border-top:1px solid var(--line); padding-top:10px; }
.text-link { padding:10px 0; font-size:12px; color:var(--muted); }
.text-link::after,.all-brands::after,.live-albums-link::after { content:'\2192'; margin-left:8px; }
.all-brands,.live-albums-link { display:block; padding:14px 0; color:var(--green); font-size:12px; }
.live-albums-link { margin-top:14px; border-top:1px solid var(--line); }
.back-link { display:inline-flex; align-items:center; min-height:36px; margin-bottom:8px; font-size:12px; color:var(--green); }
.back-link::before { content:'\2190'; margin-right:8px; }
.result-count { margin:0 0 16px; color:var(--muted); font-size:12px; }
.brand-section { scroll-margin-top:16px; }
.brand-section + .brand-section { margin-top:28px; padding-top:20px; border-top:1px solid var(--line); }
.collection-heading { margin-bottom:14px; }
.collection-heading h2 { margin:0; font-size:20px; overflow-wrap:anywhere; }
.brand-section .brand-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px 10px; }
.more-brands { display:block; margin:12px 0 0 auto; min-height:44px; }
.live-albums-section h2 { margin:0 0 14px; }
.brand-section .brand-photo { background:var(--surface); border:0; border-radius:2px; }
.brand-section .brand-photo.is-logo { padding:8px; }
.brand-section .brand-wordmark { font-size:13px; padding:6px; }
.empty-state { padding:24px 0; font-size:13px; color:var(--muted); }
.text-command { border:0; background:none; padding:10px 0; text-decoration:underline; color:var(--green); cursor:pointer; }
.muted { color:var(--muted); font-size:12px; text-align:center; }
.catalog-bottom { position:fixed; z-index:10; bottom:0; left:0; right:0; max-width:1240px; margin:auto; padding:8px 12px calc(8px + env(safe-area-inset-bottom)); display:grid; grid-template-columns:2fr 1fr; border-top:1px solid var(--line); background:var(--surface); }
.catalog-links { display:grid; grid-template-columns:1fr 1fr; list-style:none; margin:0; padding:0; }
.catalog-bottom a { min-height:48px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; font-size:11px; color:var(--muted); }
.catalog-bottom a[aria-current],.catalog-bottom a:hover,.catalog-bottom .catalog-whatsapp { color:var(--green); }
.catalog-bottom svg { width:22px; height:22px; }
.home-services { padding:24px 16px 22px; border-top:1px solid var(--line); background:#fff; }
.home-services h2 { margin:0 0 8px; font-size:18px; }
.service-links { display:flex; flex-wrap:wrap; gap:4px 20px; font-size:12px; color:var(--muted); }
.service-links a { padding:7px 0; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:absolute; top:-80px; z-index:20; background:white; padding:12px; }
.skip-link:focus { top:0; }
@media(min-width:768px) {
  :root { --rail:170px; }
  .catalog-top { display:flex; justify-content:center; align-items:center; padding:24px 28px; }
  .shop-name { margin:0; font-size:28px; }
  .brand-section .brand-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px 20px; }
  .rail-link { font-size:14px; padding:16px 20px; }
  .catalog-pane { padding:28px 32px 36px; }
  .catalog-banner { aspect-ratio:3.5; max-height:250px; }
  .collection-grid,.brand-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 20px; }
  .tile-name,.brand-name { font-size:14px; }
  .other-collections { grid-template-columns:repeat(2,1fr); }
  .home-services { padding:24px 28px; }
}
@media(min-width:1100px) { .brand-section .brand-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:359px) { :root { --rail:80px; } .rail-link { font-size:11px; padding-left:8px; } .catalog-pane { padding:16px 10px; } .collection-grid,.brand-grid { gap:20px 8px; } h1 { font-size:25px; } .shop-name { font-size:24px; } }