@font-face{font-family:"Big Shoulders";src:url(../fonts/big-shoulders-display-900.woff2) format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:"Big Shoulders";src:url(../fonts/big-shoulders-display-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Figtree";src:url(../fonts/figtree-wght.woff2) format("woff2");font-weight:300 900;font-display:swap}

:root{
  --chile:#A51E14; --chile-dk:#7E150E;
  --agave:#0D3B2C; --agave-2:#145240;
  --masa:#FFF3DD; --masa-2:#F9DFB4;
  --marigold:#FFB81C; --marigold-dk:#E89E00;
  --ink:#1E1410;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px; --s9:96px;
  --display:"Big Shoulders","Arial Narrow",Impact,sans-serif;
  --body:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  --wrap:1180px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
body{margin:0;background:#FFFFFF;color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.5}
h1,h2,h3{margin:0;font-family:var(--display);font-weight:900;line-height:.95;text-transform:uppercase;letter-spacing:.01em}
p{margin:0}
a{color:inherit}
:focus-visible{outline:3px solid var(--marigold);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:var(--s4);top:-60px;background:var(--ink);color:var(--masa);padding:var(--s3) var(--s4);z-index:10}
.skip:focus{top:var(--s4)}
section[id]{scroll-margin-top:64px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--s5)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:var(--s3) var(--s5);font-family:var(--body);font-weight:800;font-size:16px;text-decoration:none;border:2px solid transparent;border-radius:999px;transition:transform .15s ease,background-color .15s ease,color .15s ease,box-shadow .15s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 4px 0 var(--ink)}
.btn:active{transform:translateY(0);box-shadow:none}
.btn-small{min-height:44px;padding:var(--s2) var(--s4);font-size:15px;background:var(--marigold);color:var(--ink)}
.btn-small:hover{background:var(--masa)}
.btn-cream{background:var(--masa);color:var(--chile-dk)}
.btn-cream:hover{background:var(--marigold);color:var(--ink)}
.btn-line{border-color:var(--masa);color:var(--masa)}
.btn-line:hover{background:var(--masa);color:var(--chile-dk)}
.btn-red{background:var(--chile);color:var(--masa)}
.btn-red:hover{background:var(--ink)}
.btn-ink{background:var(--ink);color:var(--masa)}
.btn-ink:hover{background:var(--agave)}
.btn-marigold{background:var(--marigold);color:var(--ink)}
.btn-marigold:hover{background:var(--masa)}

/* header */
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:var(--s4);padding:var(--s2) var(--s5);background:var(--chile);color:var(--masa)}
.wordmark{font-family:var(--display);font-weight:900;font-size:30px;text-transform:uppercase;text-decoration:none;letter-spacing:.04em;line-height:44px}
.top ul{display:flex;align-items:center;gap:var(--s4);list-style:none;margin:0;padding:0}
.top li a:not(.btn){display:inline-flex;align-items:center;min-height:44px;padding:0 var(--s2);font-weight:700;text-underline-offset:4px}
.top li a:not(.btn):hover{text-decoration-thickness:3px;color:var(--marigold)}

/* hero */
.hero{position:relative;overflow:hidden;background:var(--chile);color:var(--masa);padding:var(--s7) 0 var(--s8)}
.soundhole{position:absolute;right:-200px;bottom:-240px;width:420px;height:420px;border-radius:50%;background:var(--agave);box-shadow:0 0 0 14px var(--chile),0 0 0 26px var(--marigold)}
.strings{position:absolute;z-index:1;top:0;bottom:0;right:40px;width:150px;display:flex;justify-content:space-between;transform:skewX(-8deg);pointer-events:none}
.strings span{display:block;width:2px;background:var(--masa);opacity:.35}
.strings span:nth-child(-n+3){width:3px}
.hero-inner{position:relative;z-index:2}
.hero h1{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s3)}
.h1-big{font-size:clamp(76px,22vw,220px);line-height:.82}
.h1-strip{display:inline-block;background:var(--marigold);color:var(--ink);font-size:clamp(34px,9.5vw,80px);padding:var(--s2) var(--s4) 6px;transform:rotate(-2.5deg);transform-origin:left center;margin-left:var(--s1);line-height:1}
.lede{max-width:34ch;margin-top:var(--s6);font-size:19px;line-height:1.45;font-weight:500}
.hero-cta{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s6)}

/* section titles */
.sec-title{font-size:clamp(44px,12vw,88px)}
.sec-sub{margin-top:var(--s3);font-size:17px;max-width:46ch}

/* locations */
.locations{padding:var(--s8) 0;background:var(--marigold)}
.locations .sec-title{color:var(--ink)}
.picker{display:none;grid-template-columns:repeat(3,1fr);margin-top:var(--s6);background:var(--ink);border-radius:16px;padding:var(--s1);gap:var(--s1)}
.js .picker{display:grid}
.picker button{min-height:56px;padding:var(--s2);border:0;border-radius:12px;background:transparent;color:var(--masa);font-family:var(--body);font-weight:800;font-size:15px;line-height:1.3;cursor:pointer;transition:background-color .15s ease,color .15s ease,transform .15s ease}
.picker button:hover{background:var(--agave);transform:translateY(-1px)}
.picker button[aria-selected="true"]{background:var(--marigold);color:var(--ink)}
.loc-list{display:grid;gap:var(--s5);margin-top:var(--s5)}
.loc{background:var(--masa);border-radius:20px;padding:var(--s5)}
.js .loc{display:none}
.js .loc.is-on{display:block}
.loc h3{font-size:36px;color:var(--ink)}
.loc-area{margin-top:var(--s2);font-weight:700;color:var(--chile-dk)}
.loc address{font-style:normal;font-size:19px;font-weight:600;margin-top:var(--s4);line-height:1.4}
.status{margin-top:var(--s3);font-weight:800;font-size:16px;min-height:0}
.status:empty{display:none}
.status.open{color:var(--agave)}
.status.closed{color:var(--chile-dk)}
.status::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:var(--s2);background:currentColor;vertical-align:1px}
.hours{width:100%;border-collapse:collapse;margin-top:var(--s4);font-size:16px}
.hours th,.hours td{padding:var(--s2) 0;border-top:1px solid rgba(30,20,16,.25);text-align:left;vertical-align:top}
.hours th{font-weight:700;padding-right:var(--s4);white-space:nowrap}
.hours td{text-align:right}
.loc-cta{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s5)}
.loc-cta .btn{flex:1 1 auto}

/* menu */
.menu{background:var(--agave);color:var(--masa);padding:var(--s8) 0}
.menu .sec-title{color:var(--marigold)}
.taco-board{margin-top:var(--s6);background:var(--marigold);color:var(--ink);border-radius:20px;padding:var(--s5)}
.taco-board h3{font-size:64px;line-height:.9}
.board-note{margin-top:var(--s3);font-weight:600}
.meats{list-style:none;margin:var(--s4) 0 0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s2)}
.meats li{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:26px;line-height:1;background:var(--ink);color:var(--marigold);padding:var(--s2) var(--s3) 6px;border-radius:8px}
.menu-groups{margin-top:var(--s6);border-top:2px solid var(--masa)}
.menu-groups details{border-bottom:2px solid var(--masa)}
.menu-groups summary{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);min-height:64px;padding:var(--s3) 0;cursor:pointer;list-style:none}
.menu-groups summary::-webkit-details-marker{display:none}
.menu-groups summary h3{font-size:34px;transition:color .15s ease}
.menu-groups summary::after{content:"+";flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--masa);color:var(--agave);font-weight:900;font-size:28px;line-height:1;transition:transform .2s ease,background-color .15s ease}
.menu-groups details[open] summary::after{content:"\2212"}
.menu-groups summary:hover h3{color:var(--marigold)}
.menu-groups summary:hover::after{background:var(--marigold);transform:rotate(90deg)}
.menu-groups dl{margin:0 0 var(--s5);padding:0}
.menu-groups dt{font-weight:800;font-size:19px;margin-top:var(--s4)}
.menu-groups dt:first-child{margin-top:0}
.menu-groups dd{margin:var(--s1) 0 0;max-width:56ch;color:#F3E6CC}
.lunch{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s2) var(--s4);margin-top:var(--s6);padding:var(--s4) var(--s5);background:var(--agave-2);border-radius:16px}
.lunch-label{font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:14px;color:var(--marigold)}
.lunch-time{font-family:var(--display);font-weight:900;font-size:34px;line-height:1}
.lunch-note{font-size:16px}
.menu-full{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3);margin-top:var(--s6)}
.menu-full .btn-red:hover{background:var(--masa);color:var(--chile-dk)}
.demo-note{font-size:15px;color:#F3E6CC}

/* photos */
.photos{padding:var(--s8) 0}
.photos .sec-title{color:var(--chile)}
.frames{list-style:none;margin:var(--s6) 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.frame{position:relative;display:flex;flex-direction:column;justify-content:space-between;aspect-ratio:4/5;padding:var(--s4);border-radius:20px;background:var(--masa-2)}
.f1{grid-column:1 / -1;aspect-ratio:16/11}
.f2{background:#F6D3A0}
.f3{background:#E9EFE2}
.frame-no{font-family:var(--display);font-weight:900;font-size:40px;line-height:1;color:var(--chile)}
.frame-cap{font-weight:800;font-size:16px;background:#FFFFFF;align-self:flex-start;padding:var(--s2) var(--s3);border-radius:999px}

/* truck */
.truck{background:var(--chile);color:var(--masa);padding:var(--s8) 0}
.truck h2{font-size:clamp(44px,11.5vw,84px);max-width:14ch}
.truck p{margin-top:var(--s4);font-size:18px;max-width:40ch}
.truck .btn{margin-top:var(--s5);justify-self:start}

/* family */
.family{padding:var(--s8) 0}
.family .sec-title{color:var(--agave)}
.family blockquote{position:relative;margin:var(--s5) 0 0;padding:var(--s7) 0 0}
.family blockquote::before{content:"\201C";position:absolute;top:0;left:0;font-family:var(--display);font-weight:900;font-size:120px;line-height:.8;color:var(--chile)}
.family blockquote p{font-size:clamp(22px,5.6vw,36px);font-weight:700;line-height:1.35;max-width:30ch}

/* footer */
.foot{background:var(--ink);color:var(--masa);padding:var(--s7) 0 var(--s6);font-size:16px}
.foot-name{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:34px;line-height:1}
.foot ul{list-style:none;margin:var(--s4) 0;padding:0}
.foot a{display:inline-flex;align-items:center;min-height:44px;text-underline-offset:4px}
.foot a:hover{color:var(--marigold);text-decoration-thickness:3px}
.foot .demo{margin-top:var(--s5);font-size:13px;color:#CDBFA8}

/* desktop */
@media (min-width:900px){
  .js .picker{display:none}
  .js .loc{display:flex}
  body{font-size:18px}
  .wrap{padding:0 var(--s7)}
  .top{padding:var(--s3) var(--s7)}
  .hero{padding:var(--s9) 0}
  .soundhole{right:-60px;bottom:-200px;width:640px;height:640px}
  .strings{right:180px;width:230px}
  .lede{font-size:22px}
  .loc-list{grid-template-columns:repeat(3,1fr);margin-top:var(--s6)}
  .loc{display:flex;flex-direction:column}
  .loc-cta{margin-top:auto;padding-top:var(--s5)}
  .menu .wrap{display:grid;grid-template-columns:5fr 7fr;column-gap:var(--s8);align-items:start}
  .menu .sec-title,.menu .sec-sub{grid-column:1 / -1}
  .taco-board{grid-column:1;grid-row:3 / span 3}
  .menu-groups{grid-column:2;grid-row:3}
  .lunch{grid-column:2;grid-row:4}
  .menu-full{grid-column:2;grid-row:5}
  .frames{grid-template-columns:2fr 1fr 1fr;gap:var(--s5)}
  .f1{grid-column:auto;aspect-ratio:auto}
  .truck-inner{display:grid;grid-template-columns:3fr 2fr;column-gap:var(--s8);align-items:end}
  .truck h2{grid-row:1 / span 2}
  .truck p{margin-top:0}
  .foot .wrap{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--s7)}
  .foot .demo{grid-column:1 / -1}
}