/* City Edge Catering: base styles shared by the order pages (tokens, buttons, nav).
   Copied from the homepage's inline base styles so the order pages match it. */
:root{
--color-bg:#F3ECDF;--color-surface:#FCF8F1;--color-text:#33291E;--color-text-muted:#5A4B39;
--color-accent:#A63F27;--color-olive:#4D5A29;--xmas-green:#1F4A35;--xmas-green-2:#2C6247;--xmas-red:#B3261E;--xmas-gold:#F2C14E;--color-neutral:#E4D8C4;--color-sand:#EEE4D2;--color-cream:#FBF6EC;
--color-ink:#2D241A;--color-on-ink:#C9BAA6;--color-on-ink-soft:#A89A88;--color-amber:#E8A15C;--color-accent-dark:#8F3520;
--t-logo-sm:1.25rem;--t-logo:1.6rem;
--maxw:1160px;--pad:clamp(4.5rem,9vw,8rem);--radius:18px;
/* sizes for older readers: the root is 18px (112.5%), and nothing is under 16px */
--t-2xs:.9rem;--t-xs:.94rem;--t-sm:1rem;--t-base:1.06rem;--t-md:1.2rem;--t-lg:1.3rem;
--t-h3:clamp(1.35rem,2.6vw,1.8rem);--t-h2:clamp(1.75rem,3.8vw,2.8rem);--t-h1:clamp(2rem,4.4vw,3.5rem);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:112.5%;-webkit-text-size-adjust:100%}
body{background:var(--color-bg);color:var(--color-text);font-family:'DM Sans',system-ui,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased;position:relative}
body::before{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
h1,h2,h3,h4{font-family:'Bricolage Grotesque',system-ui,sans-serif;line-height:1.04;font-weight:600;letter-spacing:-0.02em}
img{max-width:100%;display:block}
[hidden]{display:none!important}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--color-accent);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:clamp(1.3rem,4vw,2.2rem);position:relative;z-index:2}
.eyebrow{font-size:var(--t-2xs);font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--color-accent)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:'DM Sans',sans-serif;font-weight:600;font-size:var(--t-sm);padding:.9rem 1.6rem;border-radius:999px;cursor:pointer;transition:transform .22s ease,background .22s ease,color .22s ease;border:1.5px solid transparent}
.btn-terra{background:var(--color-accent);color:#fff}
.btn-terra:hover{transform:translateY(-2px);background:#8F3520}
.btn-cream{background:var(--color-cream);color:var(--color-text);border-color:var(--color-neutral)}
.btn-cream:hover{transform:translateY(-2px);background:#fff}
.btn-outline{border-color:currentColor}
.btn-outline:hover{background:var(--color-text);color:var(--color-cream);border-color:var(--color-text)}

/* NAV */
#nav{position:sticky;top:0;z-index:50;background:rgba(45,36,26,.94);backdrop-filter:blur(10px);border-bottom:1px solid rgba(232,161,92,.18);transition:box-shadow .3s ease}
#nav .logo{color:var(--color-cream)}
#nav .logo span{color:#E8A15C}
#nav .logo em{color:var(--color-on-ink-soft)}
#nav.lifted{box-shadow:0 12px 30px -18px rgba(43,30,20,.85)}
.nav-in{display:flex;align-items:center;justify-content:space-between;min-height:74px;gap:.7rem;flex-wrap:nowrap}
.logo{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:var(--t-logo);white-space:nowrap;line-height:1.05;display:block}
.logo em{display:block;font-family:'DM Sans',sans-serif;font-style:normal;font-size:var(--t-2xs);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--color-text-muted);margin-top:.22rem}
.logo span{color:var(--color-accent)}
.nav-links{display:flex;gap:2rem;align-items:center}
.nav-links a{font-size:var(--t-sm);font-weight:500;color:#C9BAA6;transition:color .2s;white-space:nowrap}
.nav-links a:hover{color:#fff}
.nav-cta{display:flex;gap:.6rem;align-items:center}
.nav-phone{display:inline-flex;align-items:center;gap:.5rem;font-weight:600;font-size:var(--t-sm);white-space:nowrap;color:var(--color-cream);border:1.5px solid rgba(232,161,92,.35);border-radius:999px;padding:.62rem 1.1rem;transition:border-color .2s ease}
.nav-phone:hover{border-color:#E8A15C}
.nav-phone svg{width:15px;height:15px;color:#E8A15C}

/* LOGO: "City Edge Catering". On a phone it stacks on two lines (the <br class="lb">)
   so the phone and order buttons keep their full size beside it. */
.logo .lb{display:none}
.logo{letter-spacing:-0.01em}
@media (max-width:640px){
  .logo .lb{display:inline}
  .logo{font-size:var(--t-logo-sm);line-height:1}
}

/* tap targets: 48px or more for every button and link that acts */
.btn{min-height:48px}
.nav-phone{min-height:48px;min-width:48px;justify-content:center}

/* FOOTER, shared by every page */
.site-foot{background:var(--color-ink);color:var(--color-on-ink);position:relative;z-index:2}
.foot-in{display:grid;grid-template-columns:1.2fr 1.4fr 1fr 1fr;gap:2rem;align-items:start;padding-block:clamp(2.6rem,5vw,3.6rem) 1.6rem}
.site-foot h3,.site-foot .foot-in .logo{font-size:var(--t-lg);line-height:1.3;color:#fff;margin:0 0 .5rem;min-height:0}
.site-foot p,.site-foot a{font-size:var(--t-sm);line-height:1.5;margin:0;overflow-wrap:anywhere}
.site-foot .foot-in p,.site-foot .foot-in a:not(.logo){display:block;padding-block:.3rem}
.site-foot a:hover{color:#fff}
.site-foot .foot-in .logo{color:var(--color-cream)}
.site-foot .logo .lb{display:none}
.foot-legal{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;justify-content:space-between;align-items:center;border-top:1px solid rgba(232,161,92,.18);padding-block:1.2rem 1.6rem}
.foot-legal p,.foot-legal a{margin:0;font-size:var(--t-2xs);color:var(--color-on-ink-soft)}
.foot-legal a{text-decoration:underline;text-underline-offset:3px;color:var(--color-on-ink);min-height:48px;display:inline-flex;align-items:center}
@media (max-width:900px){.foot-in{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.foot-in{grid-template-columns:1fr;gap:1.4rem}}

/* PROGRESS: 1 Choose · 2 Your details · 3 Send request */
.progress{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .5rem;font-size:var(--t-sm);font-weight:600;color:var(--color-text-muted);margin:0 0 1rem}
.progress li{display:inline-flex;align-items:center;gap:.45rem}
.progress li+li::before{content:"";width:18px;height:2px;border-radius:2px;background:var(--color-neutral);margin-right:.1rem}
.progress b{display:inline-flex;align-items:center;justify-content:center;width:1.7em;height:1.7em;border-radius:999px;border:2px solid currentColor;font-size:var(--t-2xs);line-height:1}
.progress [aria-current]{color:var(--color-text)}
.progress [aria-current] b{background:var(--color-accent);border-color:var(--color-accent);color:#fff}
.progress .done{color:var(--color-olive)}
@media (max-width:640px){
  .progress{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem;text-align:center;font-size:var(--t-2xs)}
  .progress li{flex-direction:column;gap:.3rem;line-height:1.2}
  .progress li+li::before{display:none}
}

.foot-links{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.4rem 1.2rem}
.spidee-credit{display:inline-flex;align-items:center;gap:.4rem;text-decoration:none;vertical-align:middle;transition:color .2s}
.spidee-credit img{width:15px;height:14px;display:block}
.foot-legal .spidee-credit{text-decoration:none}
.foot-legal .spidee-credit:hover{color:#fff}
