/* Copied from extra.css. url() paths are relative to the site root. */
/* FP-0019 r1 Sipps On Wheels: "signal". Food-truck fish, wings & tacos, built the r4/r5 way.
   Their signature is the traffic light they put next to their name on Instagram, so the one bold move is a
   red / amber / green signal band plus giant condensed Anton headlines on an asphalt-black hero.
   White page, one red accent for links/buttons, amber only as a background for dark text.
   Colors come from content.json tokens (var(--c-*)); the three signal colors are the only raw hex here. */
.layout-signal{--sig-red:#C8102E;--sig-amber:#FFB81C;--sig-green:#1E9E4A;font-size:1.0625rem;line-height:1.6}
.layout-signal h1,.layout-signal h2,.layout-signal h3{font-weight:400;text-transform:uppercase;letter-spacing:.01em;text-wrap:balance}
.layout-signal h1{font-size:clamp(2.6rem,12.5vw,5rem);line-height:.98}
.layout-signal h2{font-size:clamp(1.9rem,8vw,3rem);line-height:1.02}
.layout-signal h3{font-size:1.35rem;line-height:1.15;letter-spacing:.02em}
.layout-signal section{padding-block:2.75rem}
.layout-signal p{max-width:40rem}
.layout-signal .section-intro{max-width:34rem}

/* the signal band: three bars, under the header and above the footer */
.layout-signal .site-header,.layout-signal .site-footer{position:relative}
.layout-signal .site-header::after,.layout-signal .site-footer::before{content:"";position:absolute;left:0;right:0;height:8px;
  background:linear-gradient(90deg,var(--sig-red) 0 33.33%,var(--sig-amber) 33.33% 66.66%,var(--sig-green) 66.66% 100%)}
.layout-signal .site-header::after{bottom:-8px}
.layout-signal .site-footer::before{top:0}

/* header: white, logo or name, nav wraps on phones (r1c: no cut-off at 320/360) */
.layout-signal .site-header{background:#fff;border-bottom:0;z-index:5}
.layout-signal .site-header .wrap{padding-block:.6rem .4rem;row-gap:.2rem}
.layout-signal .brand{font-family:var(--f-heading);text-transform:uppercase;font-size:1.5rem;letter-spacing:.02em;color:var(--c-text)}
.layout-signal .brand-wordmark img{--logo-h:40px}
.layout-signal .site-header .btn-order{border-radius:4px;font-weight:700}
.layout-signal .site-nav a{font-weight:700;font-size:1rem;text-transform:uppercase;letter-spacing:.04em}
.layout-signal .site-nav a[aria-current="page"]{color:var(--c-text);text-decoration:underline;text-decoration-color:var(--sig-red);text-decoration-thickness:3px;text-underline-offset:.35em}
@media (max-width:47.99rem){
  /* r1c: the whole nav fits: it wraps onto a second row if needed, tighter gap, every link a >=44px tap target */
  .layout-signal .site-nav{width:100%}
  .layout-signal .site-nav ul{flex-wrap:wrap;gap:0 .85rem;padding:0}
  .layout-signal .site-nav a{white-space:nowrap;min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;padding:.2rem .1rem}
}
@media (max-width:23rem){.layout-signal .site-nav ul{gap:0 .6rem}.layout-signal .site-nav a{font-size:.95rem;letter-spacing:.03em}}

/* buttons: square-ish, heavy, thumb-sized */
.layout-signal .btn{border-radius:4px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;min-height:52px;padding-inline:1.4rem;touch-action:manipulation}
.layout-signal .btn-primary{background:var(--c-primary);color:var(--c-on-primary,#fff)}
.layout-signal .hero .btn-secondary{color:var(--c-hero-text,#fff);border-color:currentColor;background:transparent}

/* hero: asphalt black, giant type; photo edge to edge on phones, side by side on desktop */
.layout-signal .hero{padding:0;background:var(--c-hero-bg);color:var(--c-hero-text)}
.layout-signal .hero h1{color:var(--c-hero-text)}
.layout-signal .hero .eyebrow{font-weight:700;font-size:1rem;color:var(--sig-amber);text-transform:none;letter-spacing:0;margin-bottom:.4rem}
.layout-signal .hero .wrap{display:grid;gap:1.4rem;padding-block:2.25rem 2.5rem}
.layout-signal .hero picture{order:-1;margin:-2.25rem -1.25rem 0}
.layout-signal .hero-art{width:100%;max-width:none;aspect-ratio:4/3;object-fit:cover}
.layout-signal .hero p.lead{font-size:1.15rem;opacity:.92;max-width:32rem}
@media (min-width:52rem){
  .layout-signal .hero .wrap{grid-template-columns:1fr 1.15fr;gap:3.5rem;align-items:center;padding-block:3.5rem}
  .layout-signal .hero picture{order:2;margin:0}
  .layout-signal .hero-art{border-radius:var(--radius);aspect-ratio:3/2}
}

/* today at the truck: amber band, live open/closed light */
.layout-signal .today-strip{background:var(--c-accent);color:var(--c-on-accent);padding-block:1.8rem 2rem}
.layout-signal .today-strip h2{color:var(--c-on-accent);font-size:clamp(1.7rem,7vw,2.4rem);margin-bottom:.35rem}
.layout-signal .today-strip .wrap{display:grid;gap:1rem 3rem}
@media (min-width:52rem){.layout-signal .today-strip .wrap{grid-template-columns:1.1fr 1fr;align-items:start}}
.layout-signal .today-now{font-weight:700;font-size:1.2rem;margin:0 0 .6rem}
.layout-signal .today-now:not([hidden]){display:flex;align-items:center;gap:.55rem}
.layout-signal .today-now::before{content:"";flex:none;width:.95rem;height:.95rem;border-radius:50%;background:var(--sig-red);box-shadow:0 0 0 3px #141414}
.layout-signal .today-now.is-open::before{background:var(--sig-green)}
.layout-signal .today-strip .today-now,.layout-signal .today-strip .today-now.is-open,.layout-signal .today-strip .today-now.is-closed,.layout-signal .today-strip .tz,.layout-signal .today-strip .hours th,.layout-signal .today-strip .hours td{color:var(--c-on-accent)}
.layout-signal .hours tr.is-today th,.layout-signal .hours tr.is-today td{box-shadow:none;border-color:#141414}
.layout-signal .hours{font-variant-numeric:tabular-nums;max-width:26rem}
.layout-signal .hours th{font-weight:700}
.layout-signal .hours td{text-align:right;white-space:nowrap}
.layout-signal .hours tr.is-today{background:rgba(255,255,255,.45)}
.layout-signal .today-strip .tz{font-size:.95rem}
.layout-signal .today-strip address{font-style:normal;font-weight:700;font-size:1.15rem;margin-bottom:.7rem}
.layout-signal .today-place{margin:0 0 .7rem;font-weight:700}
.layout-signal .today-dir{margin:0}
.layout-signal .today-strip .btn-secondary{background:#141414;color:#fff;border-color:#141414;min-height:48px}

/* dated specials: ticket card with a red edge; whole block disappears when nothing is current */
.layout-signal #specials{background:#fff;padding-block:2.25rem 2rem}
.layout-signal #specials .specials{gap:1rem}
.layout-signal #specials .special{background:var(--c-tag-bg);border:2px solid #141414;border-left:10px solid var(--sig-red);border-radius:var(--radius);box-shadow:none}
.layout-signal #specials .when{font-weight:700;color:var(--c-text);font-size:1rem;margin-bottom:.25rem}

/* gallery: 2-up squares on phones, 3 across on desktop */
.layout-signal #gallery{background:var(--c-hero-bg);color:var(--c-hero-text)}
.layout-signal #gallery h2{color:var(--c-hero-text)}
.layout-signal .gallery{grid-template-columns:1fr 1fr;gap:.6rem}
@media (min-width:52rem){.layout-signal .gallery{grid-template-columns:repeat(3,1fr);gap:1rem}}
.layout-signal .gallery img{aspect-ratio:1;object-fit:cover;border-radius:var(--radius)}
.layout-signal .gallery figcaption{font-size:1rem;line-height:1.35;color:var(--c-hero-text);opacity:.9}

/* about */
.layout-signal #about{background:var(--c-surface)}
.layout-signal #about img{border-radius:var(--radius)}

/* follow strip */
.layout-signal .strip-sec{padding-block:1.6rem 1.8rem;border-block:1px solid var(--c-border)}
.layout-signal .strip-sec h2{font-size:1.6rem;margin-bottom:.4rem}

/* contact */
.layout-signal .link-list a{border-radius:4px;background:#fff;justify-content:flex-start;font-weight:700}
.layout-signal .link-list a:hover{border-color:var(--c-text)}

/* footer */
.layout-signal .site-footer{padding-top:calc(8px + 1.5rem);font-size:1rem}

/* menu page: board-style headings, no prices */
.layout-signal .menu-head{padding-block:2rem .75rem}
.layout-signal .menu-order a{display:inline-flex;align-items:center;min-height:44px;color:var(--c-link);font-weight:700}
.layout-signal .cat-nav{background:#fff;box-shadow:none}
.layout-signal .cat-nav a{background:#fff;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.layout-signal .cat-nav a[aria-current="true"]{background:#141414;border-color:#141414;color:#fff}
.layout-signal .menu-cat h2{margin-bottom:.25rem;border-bottom:6px solid var(--sig-amber);display:inline-block;padding-bottom:.1rem}
.layout-signal .item{border-bottom:1px solid var(--c-border);padding-block:1.1rem}
.layout-signal .item h3{font-size:1.3rem}
.layout-signal .item .desc{font-size:1rem}

@media (prefers-reduced-motion:reduce){.layout-signal *{transition:none!important;animation:none!important}}

/* r1d: real weekly hours from Google (30 Oct) — the r1b one-line hours styling is gone; normal table again. */
.layout-signal #visit .hours{max-width:24rem}
.layout-signal #visit .hours td{text-align:right;white-space:nowrap}
.layout-signal #visit .tz{margin-top:.6rem;font-size:.95rem;opacity:.85}
/* r1c: hours line in the hero + location section (map, truck photo, pop-up note) */
.layout-signal .hero .hero-hours{font-weight:700;font-size:1.05rem;color:var(--sig-amber);max-width:32rem;margin:.9rem 0 0}
.layout-signal #visit .location-note{max-width:32rem}
.layout-signal #visit .map-embed{border-radius:4px}
.layout-signal #visit .map-embed iframe{height:300px}
@media (min-width:52rem){.layout-signal #visit .map-embed iframe{height:360px}}
.layout-signal #visit .visit-photo img{border-radius:4px;aspect-ratio:3/2;object-fit:cover;height:auto}
/* r1d: open-now line, rating, Good to know, home QR, DoorDash button */
.layout-signal #visit .today-now{font-size:1.15rem;margin:.1rem 0 .5rem}
.layout-signal #visit .today-now::before{box-shadow:0 0 0 2px #141414}
.layout-signal .hero .hero-rating a{color:var(--c-hero-text);text-decoration-color:var(--sig-amber)}
.layout-signal .hero .hero-rating .star{color:var(--sig-amber)}
.layout-signal #visit .good-to-know{margin:.25rem 0 1rem}
.layout-signal .home-qr{border-radius:4px;background:#fff;border:2px solid #141414}
.layout-signal .home-qr figcaption strong{font-family:var(--f-heading);text-transform:uppercase;letter-spacing:.03em;font-size:1.25rem}
.layout-signal .hero .btn-row{flex-wrap:wrap}
/* r1d: today row in the white Hours block keeps a red marker (strip rule above removes it) */
.layout-signal #visit .hours tr.is-today th{box-shadow:inset 4px 0 0 var(--sig-red)}
/* r1e: Today's spot box: amber band under the hero, red pin badge, map on the right (desktop) / below (phone) */
.layout-signal .todays-spot{background:var(--sig-amber);color:#141414;border-bottom:3px solid #141414;padding-block:1.6rem 1.9rem}
.layout-signal .todays-spot h2{color:#141414;font-size:clamp(1.8rem,7.5vw,2.6rem);display:flex;align-items:center;gap:.6rem}
.layout-signal .todays-spot h2::before{content:"";flex:none;width:1rem;height:1rem;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--sig-red);box-shadow:0 0 0 3px #141414}
.layout-signal .todays-spot .spot-label{font-family:var(--font-body,inherit);text-transform:uppercase;letter-spacing:.04em;font-size:1rem}
.layout-signal .todays-spot address{font-weight:700;font-size:1.2rem}
.layout-signal .todays-spot .btn-primary{background:#141414;color:#fff}
.layout-signal .todays-spot .map-embed{border:3px solid #141414;border-radius:4px}
.layout-signal .todays-spot .map-embed iframe{height:260px}
@media (min-width:52rem){.layout-signal .todays-spot .map-embed iframe{height:300px}}
.layout-signal #visit .spot-ref a{font-weight:700}
