/* In the Tri · chalkboard theme for /food-trucks (redesign 2026.10.08).
   Loaded only on that page, after site.css and growth.css, and scoped to
   body.food-trucks so nothing else on the site changes. The page reads as a
   truck's order window: striped awning, wood-framed chalkboard menu, and a
   paper order ticket. Cream cards from site.css (rally listings, signup)
   are left as paper on purpose. */
body.food-trucks{
  --lot:#151A17; --board:#22312B; --board-2:#1C2924; --wood:#7A5634; --wood-sh:#5C3F25;
  --chalk:#F3EFE4; --chalk-soft:#C9D0C6; --chalk-faint:rgba(243,239,228,.28);
  --mustard:#F2B33D; --mustard-sh:#A5741A; --ketchup:#C8412E; --ticket:#FBF7EC;
  --sign:'Bungee','Lilita One',Georgia,serif; --hand:'Caveat','Lobster',cursive;
  background:var(--lot); color:var(--chalk);
}
body.food-trucks::before{ opacity:.2; mix-blend-mode:normal; }
.food-trucks main a{ text-underline-offset:3px; color:var(--chalk); }
.food-trucks main a:hover{ color:var(--mustard); }
.food-trucks a:focus-visible, .food-trucks button:focus-visible{ outline:3px solid var(--mustard); outline-offset:3px; }

/* nav and footer go to night, like the parking lot */
.food-trucks .nav{ background:#0F1311; border-bottom:1px solid #2A332E; }
.food-trucks .brand span{ color:var(--chalk); }
.food-trucks .brand span::after{ color:#9AA59C; }
.food-trucks .nav-links a{ color:var(--chalk-soft); }
.food-trucks .nav-links a:hover{ border-color:var(--chalk-soft); }
.food-trucks .nav-links .btn-orange, .food-trucks .signup .btn-orange{ background:var(--mustard); border-color:var(--mustard); color:#1B1A14; }
.food-trucks .nav-links .btn-orange:hover, .food-trucks .signup .btn-orange:hover{ background:#F6C55F; filter:none; }
.food-trucks .footer{ background:#0F1311; border-top:1px solid #2A332E; color:var(--chalk-soft); }
.food-trucks .footer-links a, .food-trucks .footer-contact a{ color:var(--chalk); }
.food-trucks .footer-links a:hover{ color:var(--mustard); }
.food-trucks .footer-legal{ border-top-color:#2A332E; }
.food-trucks .partners-row{ background:#0F1311; border-top:1px solid #2A332E; }
.food-trucks .partners-names a, .food-trucks .partners-names span{ color:var(--mustard); }
.food-trucks .partners-how{ color:var(--chalk-soft); }

/* shared board: chalk on slate in a wood frame */
.food-trucks main{ padding-top:22px; }
.ft-board{ background:var(--board); border:14px solid var(--wood); border-radius:6px;
  box-shadow:inset 0 0 0 2px var(--wood-sh), inset 0 0 80px rgba(0,0,0,.35), 0 18px 40px -20px rgba(0,0,0,.8); }

/* ---- hero: the order window ---------------------------------------------- */
.ft-awning{ height:44px; border-radius:12px 12px 0 0;
  background:repeating-linear-gradient(90deg,var(--ketchup) 0 56px,var(--chalk) 56px 112px); }
.ft-awning::after{ content:""; display:block; height:26px; position:relative; top:44px; margin-bottom:-26px; z-index:1;
  background:
    radial-gradient(circle at 28px 0,var(--ketchup) 0 26px,transparent 27px) 0 0/112px 26px repeat-x,
    radial-gradient(circle at 84px 0,var(--chalk) 0 26px,transparent 27px) 0 0/112px 26px repeat-x; }
.ft-hero{ display:grid; grid-template-columns:minmax(0,1fr) 330px; align-items:center; gap:44px; padding:58px 48px 44px; border-top-width:10px; border-radius:0 0 6px 6px; }
.ft-hero-copy{ min-width:0; }
.ft-eyebrow{ font-family:var(--hand); font-weight:700; font-size:32px; color:var(--mustard); margin-bottom:10px; transform:rotate(-2deg); transform-origin:left; }
.ft-hero h1{ font-family:var(--sign); font-weight:400; font-size:58px; line-height:1.02; margin:0; letter-spacing:.01em; color:var(--chalk); }
.ft-hero h1 span{ display:block; font-size:30px; margin-top:8px; color:var(--chalk-soft); }
.ft-intro{ max-width:500px; font-size:17px; line-height:1.55; color:var(--chalk-soft); margin:18px 0 22px; }
.food-trucks main .ft-directory-link{ display:inline-flex; align-items:center; gap:12px; min-height:48px; padding:12px 24px; border-radius:10px;
  background:var(--mustard); color:#1B1A14; font-size:16px; font-weight:800; text-decoration:none; box-shadow:0 4px 0 var(--mustard-sh); }
.food-trucks main .ft-directory-link:hover{ background:#F6C55F; color:#1B1A14; }
.ft-directory-link span{ font-size:18px; }

/* the paper order ticket */
.ft-ticket{ background:var(--ticket); color:#1F1D18; border-radius:4px; padding:24px 24px 20px; transform:rotate(2deg);
  box-shadow:0 18px 30px rgba(0,0,0,.45); display:flex; flex-direction:column; gap:12px; }
.ft-ticket-top{ display:flex; justify-content:space-between; font-family:var(--sign); font-size:14px; letter-spacing:.06em; color:var(--ketchup);
  padding-bottom:12px; border-bottom:2px dashed #B9B2A0; }
.ft-ticket-day{ font-family:var(--hand); font-weight:700; font-size:30px; line-height:1; margin:0; }
.ft-ticket-stats{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.ft-ticket-stats div{ background:#1F1D18; color:var(--ticket); border-radius:6px; padding:12px 14px; display:flex; flex-direction:column; gap:2px; }
.ft-ticket-stats b{ font-family:var(--sign); font-weight:400; font-size:36px; line-height:1; }
.ft-ticket-stats span{ font-size:13px; font-weight:700; }
.ft-ticket-today{ margin:0; font-size:14px; font-weight:600; color:#4A463C; }
.ft-ticket-today b{ color:#1F1D18; }
.ft-weather{ display:flex; gap:10px; align-items:flex-start; margin:0; padding-top:12px; border-top:2px dashed #B9B2A0; font-size:13px; line-height:1.5; color:#4A463C; }
.ft-weather strong{ color:#1F1D18; }
.ft-weather svg{ flex:none; width:19px; height:19px; margin-top:1px; fill:none; stroke:var(--ketchup); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

.food-trucks .list-ask{ font-size:14px; margin:22px 0 0; font-weight:500; color:var(--chalk-soft); }
.food-trucks main .list-ask a{ color:var(--mustard); font-weight:700; }

/* ---- the menu board ------------------------------------------------------ */
.ft-board-head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px 24px; margin:40px 0 18px; }
.ft-chalk{ font-family:var(--hand); font-weight:700; font-size:28px; color:var(--mustard); }
.ft-board-head h2{ font-family:var(--sign); font-weight:400; font-size:38px; line-height:1.1; margin:2px 0 0; color:var(--chalk); }
.ft-days{ display:flex; flex-wrap:wrap; gap:8px; }
.food-trucks main .ft-days a{ min-width:64px; min-height:56px; padding:6px 10px; border:2px solid var(--chalk-faint); border-radius:10px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; text-decoration:none; color:var(--chalk); }
.food-trucks main .ft-days a:first-child{ background:var(--mustard); border-color:var(--mustard); color:#1B1A14; }
.food-trucks main .ft-days a:hover{ border-color:var(--mustard); }
.ft-days span{ font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.ft-days b{ font-family:var(--sign); font-weight:400; font-size:20px; line-height:1; }

.ft-schedule{ padding:30px 44px 40px; display:flex; flex-direction:column; gap:34px; }
.ft-day{ scroll-margin-top:95px; }
.ft-schedule .day-head{ display:flex; align-items:center; gap:16px; font-family:var(--sign); font-weight:400; font-size:24px; color:var(--chalk);
  margin:0; padding:0 0 12px; border:0; border-bottom:3px solid rgba(243,239,228,.55); }
.ft-rows{ display:flex; flex-direction:column; }
.ft-stop{ display:grid; grid-template-columns:214px minmax(0,1fr); column-gap:20px; padding:16px 0; border-bottom:1px dashed var(--chalk-faint); overflow-wrap:anywhere; }
.ft-time{ grid-row:1 / span 2; display:flex; align-items:flex-start; gap:8px; font-family:var(--hand); font-weight:700; font-size:25px; line-height:1.1; color:var(--mustard); }
.ft-time svg{ flex:none; width:18px; height:18px; margin-top:4px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
.ft-stop-main{ min-width:0; }
.ft-stop h3{ font-family:var(--body); font-size:20px; font-weight:800; line-height:1.25; margin:0; color:var(--chalk); }
.food-trucks main .ft-stop h3 a{ display:inline-block; color:var(--chalk); text-decoration:none; padding:4px 0; }
.ft-stop h3 a::after{ content:" ↗"; font-size:15px; color:var(--mustard); white-space:nowrap; }
.food-trucks main .ft-stop h3 a:hover{ text-decoration:underline; color:var(--chalk); }
.ft-food{ font-size:14px; line-height:1.5; margin:0 0 4px; color:var(--chalk-soft); }
.ft-place{ font-size:15px; font-weight:600; line-height:1.5; margin:0; color:var(--chalk); }
.ft-source{ grid-column:2; padding-top:6px; font-size:12.5px; line-height:1.5; color:#A9B2A7; }
.food-trucks main .ft-source a{ color:var(--chalk-soft); padding:6px 0; }
.ft-schedule .ev-all{ text-align:left; border:2px dashed var(--chalk-faint); padding:22px; line-height:1.6; color:var(--chalk-soft); }

/* ---- section heads, rallies, directory ----------------------------------- */
.food-trucks .ft-section-head{ border-top:2px dashed var(--chalk-faint); padding:30px 0 14px; margin-top:34px; }
.food-trucks .kicker{ color:var(--mustard); }
.food-trucks .ft-section-head h2{ font-family:var(--sign); font-weight:400; font-size:32px; margin:8px 0 10px; color:var(--chalk); }
.food-trucks .page-head p{ color:var(--chalk-soft); font-size:15px; max-width:720px; }
.food-trucks main .page-head p a{ color:var(--mustard); }
.food-trucks main .ev, .food-trucks main .ev a{ color:var(--ink); }
.food-trucks .day-head{ color:var(--chalk); border-bottom-color:var(--chalk-faint); }
#directory{ scroll-margin-top:95px; }
.ft-directory{ display:grid; grid-template-columns:minmax(0,1fr); gap:30px; padding:26px 40px 36px; margin-bottom:10px; }
.ft-area-group{ min-width:0; }
.ft-area{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; font-family:var(--sign); font-weight:400; font-size:21px; line-height:1.2;
  color:var(--chalk); margin:0 0 4px; padding-bottom:10px; border-bottom:3px solid rgba(243,239,228,.55); }
.ft-area span{ font-family:var(--hand); font-weight:700; font-size:24px; color:var(--mustard); }
.ft-dir{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 26px; list-style:none; padding:0; margin:0; }
.ft-dir li{ display:flex; flex-direction:column; padding:6px 0 10px; border-bottom:1px dashed var(--chalk-faint); overflow-wrap:anywhere; }
.food-trucks main .ft-dir a{ display:block; padding:6px 0; font-size:15px; font-weight:700; line-height:1.4; color:var(--chalk); text-decoration:none; }
.food-trucks main .ft-dir a:hover{ color:var(--mustard); text-decoration:underline; }
.ft-dir span{ font-size:13px; line-height:1.5; color:var(--chalk-soft); }
.food-trucks .page-head .footer-links a{ color:var(--chalk); }
.food-trucks .page-head .footer-links a:hover{ color:var(--mustard); }

@media (max-width:850px){
  .ft-hero{ grid-template-columns:minmax(0,1fr); gap:34px; padding:44px 30px 36px; }
  .ft-ticket{ max-width:380px; }
  .ft-hero h1{ font-size:48px; }
  .ft-hero h1 span{ font-size:26px; }
  .ft-schedule{ padding:24px 26px 32px; }
  .ft-dir{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ft-directory{ padding:22px 26px 30px; }
}
@media (max-width:600px){
  .food-trucks main{ padding:14px 12px 0; }
  .food-trucks .nav{ padding:10px 12px; gap:8px; }
  .food-trucks .brand{ gap:6px; }
  .food-trucks .brand img{ width:36px; height:36px; }
  .food-trucks .brand span{ font-size:22px; white-space:nowrap; }
  .food-trucks .nav-links{ gap:0; }
  .food-trucks .nav-links a{ padding-left:6px; padding-right:6px; }
  .ft-board{ border-width:8px; }
  .ft-awning{ height:30px; border-radius:8px 8px 0 0; background-size:auto; background:repeating-linear-gradient(90deg,var(--ketchup) 0 40px,var(--chalk) 40px 80px); }
  .ft-awning::after{ top:30px; height:18px; margin-bottom:-18px;
    background:
      radial-gradient(circle at 20px 0,var(--ketchup) 0 18px,transparent 19px) 0 0/80px 18px repeat-x,
      radial-gradient(circle at 60px 0,var(--chalk) 0 18px,transparent 19px) 0 0/80px 18px repeat-x; }
  .ft-hero{ padding:36px 18px 30px; border-top-width:8px; }
  .ft-eyebrow{ font-size:26px; }
  .ft-hero h1{ font-size:36px; }
  .ft-hero h1 span{ font-size:21px; }
  .ft-intro{ font-size:16px; margin:14px 0 18px; }
  .food-trucks main .ft-directory-link{ display:flex; justify-content:center; }
  .ft-ticket{ transform:rotate(1deg); padding:20px 18px 18px; }
  .ft-board-head{ margin-top:32px; }
  .ft-board-head h2{ font-size:30px; }
  .ft-days{ display:grid; grid-template-columns:repeat(auto-fill,minmax(52px,1fr)); width:100%; gap:6px; }
  .food-trucks main .ft-days a{ min-width:0; padding:6px 2px; }
  .ft-schedule{ padding:18px 16px 26px; gap:28px; }
  .ft-schedule .day-head{ font-size:20px; }
  .ft-stop{ grid-template-columns:minmax(0,1fr); padding:14px 0; }
  .ft-time{ grid-row:auto; font-size:23px; margin-bottom:2px; }
  .ft-source{ grid-column:1; }
  .ft-stop h3{ font-size:19px; }
  .food-trucks .ft-section-head h2{ font-size:26px; }
  .ft-directory{ padding:18px 16px 24px; gap:24px; }
  .ft-dir{ grid-template-columns:minmax(0,1fr); }
  .ft-day, #directory{ scroll-margin-top:85px; }
}
@media (max-width:360px){
  .food-trucks .brand span{ font-size:19px; }
  .food-trucks .brand img{ width:30px; height:30px; }
  .food-trucks .nav-links a{ padding-left:4px; padding-right:4px; }
  .ft-hero h1{ font-size:31px; }
}
@media (prefers-reduced-motion:reduce){
  .ft-eyebrow, .ft-ticket{ transform:none; }
}
