@font-face{font-family:"Barlow Condensed";font-weight:800;font-display:swap;src:url(fonts/barlow-condensed-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:700;font-display:swap;src:url(fonts/barlow-condensed-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:400;font-display:swap;src:url(fonts/barlow-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:600;font-display:swap;src:url(fonts/barlow-latin-600-normal.woff2) format("woff2")}
:root{--ink:#171612;--milk:#FFFDF4;--muted:#5E594C;--line:rgba(23,22,18,.14);--accent:#F7C948}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--milk);color:var(--ink);font-family:"Barlow",system-ui,sans-serif;font-size:18px;line-height:1.5}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.head{padding:72px 20px 40px}
.logo{font-family:"Barlow Condensed";font-weight:800;font-size:44px;line-height:1;margin:0 0 40px;letter-spacing:-.01em}
.logo::after{content:"";display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--accent);margin-left:4px}
h1{font-family:"Barlow Condensed";font-weight:800;font-size:clamp(42px,6vw,72px);line-height:.95;margin:0;max-width:18ch}
.lead{font-size:20px;color:#2b2a25;margin:18px 0 0;max-width:48ch}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;padding-bottom:64px}
.card{display:flex;flex-direction:column;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:transform .15s ease,box-shadow .15s ease}
.card:hover{transform:translateY(-3px);box-shadow:0 18px 30px -18px rgba(23,22,18,.35)}
.card img{width:100%;aspect-ratio:10/9;object-fit:contain;background:#F2EEE0;padding:18px}
.card-body{display:flex;flex-direction:column;gap:6px;padding:20px 22px 24px}
.card-name{font-family:"Barlow Condensed";font-weight:700;font-size:28px;line-height:1.05}
.card-desc{color:var(--muted);font-size:16px}
.card-price{font-weight:600;margin-top:6px}
.empty{color:var(--muted)}
.foot{border-top:1px solid var(--line);padding-top:24px;padding-bottom:40px;color:var(--muted);font-size:14px}
@media (prefers-reduced-motion:reduce){.card{transition:none}}