@import url('assets/fonts.css');
:root { --green:#054824;--cream:#fff9ef;--paper:#fffdf8;--lime:#e4e83b;--ink:#06482f;--muted:#52685a;--line:#cdd5c8;--soft:#eff1e6;--display:'Anton',Impact,'Arial Narrow',sans-serif;--body:'Poppins',Arial,sans-serif }
* { box-sizing:border-box }
html { scroll-behavior:smooth;scroll-padding-top:30px }
body { margin:0;background:var(--cream);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased }
button,input,select { font:inherit }
button,a,input,select,summary { -webkit-tap-highlight-color:transparent }
button,a { touch-action:manipulation }
button { cursor:pointer;color:inherit }
a { color:inherit;text-decoration:none }
button:disabled { cursor:not-allowed;opacity:.45 }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible { outline:3px solid #7a8c1f;outline-offset:4px }
button svg { width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6 }
h1,h2,h3,h4,p,figure { margin:0 }
img { display:block;max-width:100% }
[hidden] { display:none!important }
.wrap { width:min(1320px,calc(100% - 100px));margin-inline:auto }

/* The same compact display / geometric sans pairing as pokerrito.com. */
.site-header { background:var(--green);color:var(--cream) }
.header-inner { min-height:100px;display:flex;align-items:center;justify-content:space-between;gap:35px }
.brand { width:150px;flex-shrink:0 }
.brand img { width:100%;height:auto }
.main-nav { display:flex;gap:32px;align-items:center }
.main-nav a { font-size:15px;font-weight:600;line-height:1.3;padding:9px 0;border-bottom:2px solid transparent }
.main-nav a[aria-current] { border-bottom-color:var(--lime) }
.main-nav a:hover { color:var(--lime) }
.order-link { display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:48px;padding:13px 28px;background:var(--lime);border-radius:30px;color:var(--green);font-size:12px;font-weight:700;line-height:1.4 }
.order-link { min-width:174px }
.order-link:hover { background:#d4da28 }
.hero { display:grid;grid-template-columns:1.25fr 1fr;gap:48px;align-items:center;padding-block:34px }
.eyebrow { font-size:10px;font-weight:600;letter-spacing:2px;line-height:1.5 }
.hero h1 { font-family:var(--display);font-size:clamp(44px,4.8vw,68px);font-weight:400;line-height:1.02;letter-spacing:-.6px;margin:12px 0 14px }
.hero-description { font-size:14px;line-height:1.75;max-width:520px;color:var(--muted) }
.hero-photo { height:230px;position:relative;overflow:hidden;background:#6b7b61;border-radius:10px }
.hero-photo img { width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:50% 67% }
.hero-photo figcaption { position:absolute;left:23px;bottom:18px;color:white;font-size:10px;font-weight:600;letter-spacing:2px;text-shadow:0 1px 6px #001c18 }
.menu-section { padding-block:6px 65px;scroll-margin-top:20px }
.text-button { border:0;background:none;padding:0;font-size:11px;display:inline-flex;align-items:center;gap:16px;text-align:left;line-height:1.5 }
.text-button span { font-size:21px;line-height:1 }
.text-button:hover { text-decoration:underline;text-underline-offset:4px }
.filter-chip { border:1px solid #b8c7b1;background:var(--soft);border-radius:22px;padding:6px 12px;font-size:11px }
.filter-chip span[aria-hidden] { margin-left:9px }
.empty-state { padding:60px 25px;border-bottom:1px solid var(--line);text-align:center }
.empty-state h3 { font-family:var(--display);font-size:32px;font-weight:400;text-transform:uppercase;line-height:1.2;margin-bottom:12px }
.empty-state p { font-size:12px;color:var(--muted);margin-bottom:24px }
.pill-button { border:1px solid var(--green);border-radius:30px;background:var(--green);color:var(--cream);padding:12px 25px;font-size:12px;font-weight:500 }
.pill-button:hover { background:#0b6135 }
.information { display:grid;grid-template-columns:1fr 2fr;gap:60px;border-top:1px solid var(--line);padding-block:45px 58px }
.information h2 { font-family:var(--display);font-size:46px;line-height:1.06;font-weight:400 }
.info-details details { border-bottom:1px solid var(--line);margin-bottom:16px;padding-bottom:16px }
.info-details summary { display:flex;align-items:center;justify-content:space-between;gap:16px;list-style:none;font-size:13px;font-weight:500;cursor:pointer }
.info-details summary::-webkit-details-marker { display:none }
.info-details summary span { font-size:20px;font-weight:400 }
.info-details p { font-size:11px;line-height:1.9;color:var(--muted);margin-top:14px;max-width:730px }
footer { background:var(--green);color:var(--cream);padding-block:43px 24px }
.footer-main { display:flex;justify-content:space-between;align-items:center;gap:40px;padding-bottom:36px }
.footer-brand { display:block;width:165px }
.footer-brand img { width:100%;height:auto }
.footer-main p { font-size:11px;margin-top:14px;color:#e1eadc }
.footer-main nav { display:flex;gap:25px;flex-wrap:wrap }
.footer-main a:not(.footer-brand) { font-size:12px }
.footer-main a:hover,.footer-bottom a:hover { text-decoration:underline;text-underline-offset:4px }
.footer-bottom { border-top:1px solid #ffffff35;padding-top:20px;display:flex;justify-content:space-between;gap:15px;font-size:10px;color:#d5e0cd }
.footer-bottom>div { display:flex;gap:20px }

/* Nutrition remains a working tool, with a persistent estimate while building. */
dialog { border:0;padding:0;background:var(--paper);color:var(--ink);width:min(1010px,calc(100% - 48px));max-height:90dvh;border-radius:12px;box-shadow:0 20px 85px #001e1835;overscroll-behavior:contain }
dialog::backdrop { background:#052d22aa;backdrop-filter:blur(3px) }
body:has(dialog[open]) { overflow:hidden }
#item-dialog { overflow:visible }
#item-content { max-height:90dvh;overflow:auto;overscroll-behavior:contain;border-radius:12px }
.close-button { position:absolute;top:15px;right:15px;z-index:4;width:33px;height:33px;border-radius:50%;border:1px solid #c8d4bf;background:var(--paper);font-size:25px;line-height:1;display:flex;justify-content:center;align-items:center }
.item-detail { display:grid;grid-template-columns:32% 68%;min-height:480px }
.detail-aside { background:#e8eadf;padding:35px 24px }
.detail-aside img { width:100%;height:auto;margin:25px 0 }
.detail-category { font-family:var(--display);font-size:33px;line-height:1.1;text-transform:uppercase;font-weight:400;margin-top:15px }
.detail-body { padding:40px 35px 28px;min-width:0 }
.detail-body h2 { font-family:var(--display);font-size:43px;font-weight:400;text-transform:uppercase;line-height:1.1;letter-spacing:-.3px;padding-right:25px }
.detail-description { font-size:12px;line-height:1.9;color:var(--muted);margin:16px 0 22px }
.nutrition-panel { position:sticky;top:0;z-index:2;border:1px solid #becdb3;border-radius:3px;background:#f0f3e6;padding:18px;margin-block:20px }
.nutrition-label { display:flex;justify-content:space-between;gap:12px;padding-right:20px;font-size:9px;letter-spacing:1px;font-weight:600 }
.nutrition-label>span:last-child { font-size:9px;letter-spacing:0;font-weight:400;color:var(--muted);text-align:right }
.nutrition-values { display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;margin-top:15px;font-variant-numeric:tabular-nums }
.nutrition-values>div { border-left:1px solid #cbd4bf;padding-left:13px }
.nutrition-values>div:first-child { border:0;padding-left:0 }
.nutrition-values b { display:block;font-size:28px;line-height:1.2;font-weight:500;letter-spacing:-.8px }
.nutrition-values .cal-value { font-weight:600 }
.nutrition-values small { font-size:9px;color:var(--muted) }
.nutrition-footnote { font-size:10px;color:var(--muted);line-height:1.8;margin-top:14px }
.detail-subtitle { font-size:11px;line-height:1.6;letter-spacing:.8px;text-transform:uppercase;font-weight:600;margin:25px 0 12px }
.allergen-tags { display:flex;gap:6px;flex-wrap:wrap }
.allergen-tags span { font-size:10px;line-height:1.5;padding:4px 8px;border:1px solid var(--line);border-radius:2px }
.unknown-note { font-size:10px;line-height:1.8;color:var(--muted);margin-top:9px }
.modifier-group { border:0;border-top:1px solid var(--line);margin:20px 0 0;padding:14px 0 0;min-width:0 }
.modifier-group legend { float:left;width:100%;padding:0 0 10px;font-size:12px;font-weight:500 }
.modifier-group legend small { font-size:10px;color:var(--muted);display:block;font-weight:400;margin-top:4px }
.modifier-reset { border:0;background:none;padding:5px 0;font-size:10px;margin-top:5px;text-decoration:underline;text-underline-offset:3px }
.detail-foot { border-top:1px solid var(--line);margin-top:26px;padding-top:18px;font-size:11px;line-height:1.8;color:var(--muted) }
#filter-dialog { width:min(665px,calc(100% - 40px)) }
.filter-dialog-content,.practices-content { padding:42px }
.filter-dialog-content h2,.practices-content h2 { font-family:var(--display);font-weight:400;font-size:39px;line-height:1.15;padding-right:20px }
.filter-explanation,.practices-content>p { font-size:12px;line-height:1.9;color:var(--muted);margin:18px 0 }
.filter-group { margin-top:25px }
.filter-group h3 { font-size:14px;font-weight:600 }
.filter-group>p { font-size:11px;color:var(--muted);margin-top:5px }
.filter-caution { font-size:10px;line-height:1.9;padding:14px 17px;background:var(--soft);margin-top:26px;border-left:2px solid #93a17a }
.filter-actions { display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:25px }
.sr-only { position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0 }
.skip-link { position:fixed;top:-80px;left:20px;z-index:10;background:var(--lime);padding:10px 20px;color:var(--green) }
.skip-link:focus { top:10px }

@media(min-width:1500px) {
  .hero h1 { font-size:72px }
  .hero-photo { height:250px }
}

@media(max-width:1150px) {
  .wrap { width:calc(100% - 64px) }
  .hero { gap:36px }
  .hero-photo { height:210px }
  .main-nav { gap:22px }
  .main-nav a { font-size:13px }
  .order-link { min-width:150px }
}

@media(max-width:850px) {
  .header-inner { min-height:88px;gap:20px }
  .brand { width:127px }
  .main-nav { gap:16px }
  .main-nav a { font-size:11px }
  .order-link { min-width:125px;font-size:10px;min-height:42px;padding:12px 18px }
  .hero { gap:25px;padding-block:28px }
  .hero h1 { font-size:46px }
  .hero-description { font-size:13px }
  .hero-photo { height:180px }
  .hero .eyebrow { font-size:9px;letter-spacing:1.5px }
  .footer-main { gap:25px;flex-wrap:wrap }
  .footer-main nav { gap:18px }
  .footer-main a:not(.footer-brand) { font-size:11px }
  .information { gap:30px }
  .information h2 { font-size:40px }
  .item-detail { grid-template-columns:29% 71% }
  .detail-aside { padding:30px 18px }
  .detail-body { padding:40px 25px 25px }
  .detail-category { font-size:29px }
}

@media(max-width:700px) {
  .wrap { width:calc(100% - 36px) }
  .header-inner { min-height:78px;gap:15px }
  .brand { width:121px }
  .main-nav { margin-left:auto }
  .main-nav a { display:none }
  .main-nav a[aria-current] { display:block;font-size:11px;border:0;padding:0 }
  .order-link { min-width:108px;min-height:36px;padding:10px 13px;font-size:9px }
  .hero { grid-template-columns:1fr;gap:16px;padding-block:22px 18px }
  .hero h1 { font-size:clamp(38px,10.5vw,50px);line-height:1.02;margin:10px 0 10px;letter-spacing:-.4px }
  .hero .eyebrow { font-size:9px }
  .hero-description { font-size:13px;line-height:1.7 }
  .hero-photo { height:120px;border-radius:8px }
  .hero-photo img { object-position:50% 67% }
  .hero-photo figcaption { left:17px;bottom:13px;font-size:8px;letter-spacing:1.6px }
  .menu-section { padding-block:4px 40px }
  .information { grid-template-columns:1fr;gap:25px;padding-block:30px 34px }
  .information h2 { font-size:36px }
  .information h2 br { display:none }
  .info-details summary { font-size:11px;line-height:1.6 }
  .info-details p { font-size:10px }
  .info-details details { margin-bottom:15px;padding-bottom:15px }
  footer { padding-block:31px 20px }
  .footer-main { align-items:flex-start;gap:26px;padding-bottom:28px }
  .footer-brand { width:135px }
  .footer-main p { font-size:9px;margin-top:11px }
  .footer-main nav { display:flex;flex-direction:column;gap:9px }
  .footer-main a:not(.footer-brand) { font-size:10px }
  .footer-main>a:last-child { display:none }
  .footer-bottom { font-size:8px;padding-top:17px;align-items:start }
  .footer-bottom>div { gap:13px }
  .item-detail { display:block }
  .detail-aside { display:flex;align-items:center;gap:19px;padding:22px;min-height:120px }
  .detail-aside img { width:40%;height:auto;margin:0 }
  .aside-text { padding-right:8px }
  .detail-category { font-size:28px;line-height:1.1;margin-top:10px }
  .detail-body { padding:25px 22px }
  .detail-body h2 { font-size:36px }
  .detail-description { font-size:11px;margin-block:13px 18px;line-height:1.8 }
  .nutrition-panel { padding:14px;margin-block:17px }
  .nutrition-label { font-size:8px;letter-spacing:.8px;gap:8px;padding-right:18px }
  .nutrition-label>span:last-child { font-size:8px;max-width:125px }
  .nutrition-values { margin-top:13px;grid-template-columns:1.18fr 1fr 1fr 1fr }
  .nutrition-values>div { padding-left:9px }
  .nutrition-values b { font-size:24px }
  .nutrition-values small { font-size:8px }
  .nutrition-footnote { font-size:9px;margin-top:12px }
  .modifier-group legend { font-size:11px }
  .modifier-group legend small { font-size:9px }
  .detail-subtitle { font-size:10px }
  .detail-foot { font-size:11px }
  dialog { width:calc(100% - 20px);max-height:94dvh }
  #item-content { max-height:94dvh }
  .close-button { width:30px;height:30px;top:10px;right:10px }
  .filter-dialog-content,.practices-content { padding:32px 23px }
  .filter-dialog-content h2,.practices-content h2 { font-size:33px }
  .filter-explanation,.practices-content>p { font-size:11px }
  .filter-caution { font-size:9px;padding:13px }
  .filter-actions .text-button { font-size:10px }
  #filter-dialog { width:calc(100% - 24px) }
}

@media(max-width:380px) {
  .brand { width:108px }
  .header-inner { gap:11px }
  .order-link { min-width:98px;font-size:8px }
  .main-nav a[aria-current] { font-size:10px }
  .hero h1 { font-size:38px }
}

@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto }
  * { animation:none!important;transition:none!important }
}

@media(min-width:701px) {
  .detail-aside { position:sticky;top:0;align-self:start;height:100%;max-height:90dvh }
}
#chart-dialog { width:min(820px,calc(100% - 40px)) }
#chart-dialog .practices-content { max-height:90dvh;overflow:auto }
.chart-heading { font-size:14px;font-weight:600;margin-top:28px }
.chart-group h3 { font-family:var(--display);font-weight:400;font-size:22px;letter-spacing:.2px;margin:28px 0 6px;padding-bottom:8px;border-bottom:1px solid var(--ink) }
.chart-row { display:grid;grid-template-columns:1.3fr 1.2fr 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:11px;line-height:1.6 }
.chart-name b { font-weight:600;font-size:12px }
.chart-name em { font-style:normal;font-size:9px;font-weight:600;color:#a33a12;margin-left:4px;text-transform:uppercase }
.chart-row small { display:block;font-size:10px;color:var(--muted);margin-top:3px }
.chart-label { display:none }
.chart-none { color:var(--muted) }

@media(max-width:700px) {
  .chart-row { grid-template-columns:1fr;gap:6px }
  .chart-label { display:block;font-size:9px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);margin-bottom:3px }
  #chart-dialog { width:calc(100% - 24px) }
  #chart-dialog .practices-content { max-height:94dvh }
}

/* Sticky search, filters and category chips; simple cards; pill options. */
.menu-bar { position:sticky;top:0;z-index:5;background:var(--cream);padding-top:14px;border-bottom:1px solid var(--line);margin-bottom:26px }
.toolbar { display:flex;gap:10px;align-items:center }
.search { display:flex;align-items:center;gap:12px;flex:1;min-height:46px;padding-inline:18px;border:1px solid #a9b9a7;background:var(--paper);border-radius:999px }
.search svg { width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;flex-shrink:0 }
.search input { width:100%;min-width:0;min-height:44px;border:0;outline:0!important;background:none;color:var(--green);font-size:14px }
.search input::placeholder { color:#69786a }
.search:focus-within { outline:2px solid var(--green);outline-offset:2px }
.filter-button { position:relative;display:flex;align-items:center;gap:8px;min-height:46px;padding:0 18px;border:1px solid var(--green);border-radius:999px;background:none;font-size:13px;font-weight:500;white-space:nowrap }
.filter-button:hover { background:var(--soft) }
.filter-button svg circle { fill:var(--cream) }
#filter-count { border-radius:50%;min-width:20px;height:20px;background:var(--green);color:var(--cream);font-size:11px;line-height:20px;text-align:center }
.category-chips { display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-block:12px 14px }
.category-chips::-webkit-scrollbar { display:none }
.category-button { flex-shrink:0;white-space:nowrap;border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:8px 16px;font-size:13px;line-height:1.3 }
.category-button:hover { border-color:var(--green) }
.category-button.active { background:var(--green);border-color:var(--green);color:var(--cream);font-weight:500 }
.active-filters { display:flex;gap:8px;flex-wrap:wrap }
.active-filters:has(button) { margin:-10px 0 22px }
.item-group+.item-group { margin-top:48px }
.group-heading { display:flex;align-items:baseline;justify-content:space-between;gap:15px;margin-bottom:18px }
.group-heading h3 { font-family:var(--display);font-size:30px;line-height:1.2;text-transform:uppercase;font-weight:400 }
.group-heading p { font-size:12px;text-align:right;color:var(--muted) }
.card-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 22px }
.menu-card { display:flex;flex-direction:column;width:100%;text-align:left;border:0;padding:0;background:none }
.card-image { aspect-ratio:1.3;background:#e9e7e1;overflow:hidden;border-radius:10px }
.card-image img { width:100%;height:100%;object-fit:cover;transition:transform .3s }
.menu-card:hover .card-image img { transform:scale(1.03) }
.card-body { display:flex;flex-direction:column;gap:3px;padding-top:12px }
.menu-card h4 { font-size:15px;line-height:1.35;font-weight:600;letter-spacing:-.2px }
.menu-card:hover h4 { text-decoration:underline;text-underline-offset:4px }
.card-kcal { display:flex;align-items:baseline;flex-wrap:wrap;gap:0 5px;font-size:13px;color:var(--muted) }
.card-kcal b { font-size:22px;font-weight:600;letter-spacing:-.5px;color:var(--ink);font-variant-numeric:tabular-nums }
.card-meta { font-size:12px;line-height:1.6;color:var(--muted) }
.modifier-list { clear:both;display:flex;flex-wrap:wrap;gap:8px }
.modifier-option,.filter-choice { display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 15px;border:1px solid #c3cfba;border-radius:999px;background:var(--paper);font-size:13px;line-height:1.3;cursor:pointer }
.modifier-option:hover,.filter-choice:hover { border-color:var(--green) }
.modifier-option:has(input:checked),.filter-choice:has(input:checked) { background:var(--green);border-color:var(--green);color:var(--cream) }
.modifier-option:has(input:focus-visible),.filter-choice:has(input:focus-visible) { outline:3px solid #7a8c1f;outline-offset:2px }
.modifier-option:has(input:disabled) { opacity:.45;cursor:not-allowed }
.modifier-cal { font-size:11px;color:var(--muted);white-space:nowrap }
.modifier-option.has-excluded { border-style:dashed;border-color:#b5562f;background:#fbeee6 }
.modifier-warn { font-size:11px;font-weight:600;color:#9a3f1b;white-space:nowrap }
.modifier-option:has(input:checked) .modifier-warn { color:#ffd9c7 }
.modifier-option:has(input:checked) .modifier-cal { color:#d9e4c4 }
.modifier-note { font-size:11px;line-height:1.6;color:var(--muted);margin-top:9px }
.modifier-note:empty { display:none }
.filter-options { display:flex;flex-wrap:wrap;gap:8px;margin-top:13px }
.size-group .modifier-list { display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:0;padding:3px;border:1px solid #c3cfba;border-radius:999px;background:var(--paper);max-width:420px }
.size-group .modifier-option { justify-content:center;border:0;min-height:38px;background:none }
.size-group .modifier-cal { display:none }

@media(max-width:1150px) {
  .card-grid { grid-template-columns:repeat(3,minmax(0,1fr)) }
}

@media(max-width:700px) {
  .menu-bar { padding-top:10px;margin-bottom:20px }
  .toolbar { gap:8px }
  .search { min-height:44px;padding-inline:15px }
  .search input { min-height:42px;font-size:14px }
  .filter-button { width:44px;min-height:44px;padding:0;justify-content:center }
  .button-label { display:none }
  #filter-count { position:absolute;top:-5px;right:-5px }
  .category-chips { margin-right:-18px;padding-right:18px;padding-block:10px 12px }
  .category-button { font-size:12px;padding:7px 14px }
  .group-heading h3 { font-size:26px }
  .group-heading p { font-size:11px;max-width:150px }
  .item-group+.item-group { margin-top:36px }
  .card-grid { grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px }
  .card-image { aspect-ratio:1.12;border-radius:8px }
  .card-body { padding-top:10px }
  .menu-card h4 { font-size:14px }
  .card-kcal { font-size:12px }
  .card-kcal b { font-size:20px }
  .card-meta { font-size:11px }
  .modifier-option,.filter-choice { font-size:12px;padding:7px 13px;min-height:38px }
}


/* Allergens directly under the item description */
.detail-allergens { margin:-6px 0 22px }
.detail-allergens .detail-subtitle { margin-top:0 }
.detail-allergens .allergen-tags span { font-size:12px;font-weight:600;padding:5px 11px;border:0;border-radius:999px;background:var(--green);color:var(--cream) }
.also-contains { font-size:12px;line-height:1.7;color:var(--muted);margin:10px 0 0 }
.also-contains:empty { display:none }
