/* Shared application of the approved brand, after existing layout rules. */
body{font-family:var(--font-body);background:var(--color-bg);color:var(--color-ink);line-height:1.5}
h1,h2,h3,.offer h3,.brand{font-family:var(--font-heading)}
h1,h2{font-weight:800}h3{font-weight:700}
h2{font-size:44px;line-height:48px;letter-spacing:-1.5px}
.home-main .hero h1{font-size:clamp(48px,5.2vw,72px);line-height:1.0556;letter-spacing:-2px}
.brand{display:inline-flex;flex-shrink:0;align-items:center;line-height:1;letter-spacing:0}
.brand-logo{display:block;width:180px;height:auto;max-width:100%;object-fit:contain}
.marketing-header{position:sticky;top:0;align-items:center;background:var(--color-bg);border-bottom:1px solid var(--color-border);padding-top:14px;padding-bottom:14px}
.marketing-header .brand{margin-right:6px}
.button,.outline-button,.service-choice button,input:not([type=checkbox]),select,textarea{border-radius:var(--radius-control)}
.button,.outline-button{min-height:48px;transition:background var(--motion-fast),box-shadow var(--motion-fast),border-color var(--motion-fast)}
.button{background:var(--color-ink);color:var(--color-bg)}
.button:hover{background:var(--color-primary)}
.button.white{background:var(--color-bg);color:var(--color-ink)}
.button.white:hover{background:var(--color-sage)}
.button:disabled,.outline-button:disabled{transform:none;box-shadow:none;cursor:not-allowed}
:is(a,button,input,textarea,select):focus-visible{outline:2px solid var(--color-primary);outline-offset:3px}
input[type=checkbox],input[type=radio]{accent-color:var(--color-primary)}
.product-card,.menu-preview-card,.article-card,.recipe-card,.related-grid>a,.offer,.basket,.delivery-box,.order-card,.account-entry,.image-note{border-radius:var(--radius-card)}
.product-card,.menu-preview-card{background:var(--color-bg);border:1px solid var(--color-border)}
.product-card .product-photo,.menu-preview-card>div{aspect-ratio:4/3}
.product-photo img{aspect-ratio:4/3;height:auto;object-fit:cover}
.product-card h3,.menu-preview-card h3{font-size:24px;line-height:30px;font-weight:700}
.product-price,.price,.checkout-allocation,.order-content>strong,.metrics strong{font-variant-numeric:tabular-nums}
.basket,.delivery-box,.admin-panel,.admin-list article,.admin-topbar,.admin-edit,.account-entry,form{background:var(--color-surface)}
.admin-shell{background:var(--color-bg)}
.admin-sidebar{background:var(--color-ink)}
.admin-sidebar .brand,.site-footer .brand{background:var(--color-bg);padding:8px 12px;border-radius:var(--radius-control)}
.admin-sidebar .brand-logo{width:164px}
.admin-sidebar :is(a,button):focus-visible,.site-footer a:focus-visible{outline-color:var(--color-accent)}
.admin-panel h2,.basket h2,.delivery-box h2,.business-panel h2,.account-profile h2,.admin-edit h2{font-size:24px;line-height:30px;letter-spacing:-.5px}
.site-footer .brand-logo{width:180px}
.site-footer{background:var(--color-ink)}
/* The contact introduction sits on dark green; the adjacent form stays light. */
.home-main .contact{background:var(--color-ink)}
.home-main .contact .contact-intro{color:var(--color-on-ink)}
.home-main .contact .contact-intro h2{color:var(--color-on-ink)}
.home-main .contact .contact-intro h2 span{color:var(--color-accent)}
.home-main .contact .contact-intro>p,
.home-main .contact .contact-intro .contact-note{color:var(--color-on-dark-muted)}
.home-main .contact form{color:var(--color-ink);background:var(--color-surface)}
.food-label .brand-logo,.print-document>.brand .brand-logo{width:140px}
.image-note{background:var(--color-surface);box-shadow:var(--shadow-card);border:1px solid var(--color-border)}
/* Tinted glass for the two service offers, requested on 24 October. */
.home-main .offers{position:relative;isolation:isolate}
.home-main .offers::before{
  content:'';position:absolute;inset:-24px;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse at 10% 12%,#D2E1C7,transparent 56%),radial-gradient(ellipse at 90% 85%,#FFD3A0,transparent 58%);
  filter:blur(22px);border-radius:48px;
}
.home-main .offer{
  position:relative;border:1px solid rgb(255 255 255 / .60);
  box-shadow:0 18px 44px rgb(32 61 43 / .13),inset 0 1px 0 rgb(255 255 255 / .65),inset 0 -1px 0 rgb(255 255 255 / .10);
}
.home-main .offer.blue{color:var(--color-on-ink);background:linear-gradient(130deg,rgb(255 255 255 / .16),transparent 45%,rgb(255 255 255 / .05)),var(--color-ink)}
.home-main .offer.orange{color:var(--color-ink);background:linear-gradient(130deg,rgb(255 255 255 / .34),transparent 54%,rgb(255 255 255 / .08)),var(--color-accent)}
.home-main .offer.blue li{border-bottom-color:rgb(255 255 255 / .22)}
.home-main .offer.orange li{border-bottom-color:rgb(32 61 43 / .18)}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .marketing-header,.image-note{background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border-color:var(--glass-border)}
  .home-main .offer{backdrop-filter:blur(18px) saturate(115%);-webkit-backdrop-filter:blur(18px) saturate(115%)}
  .home-main .offer.blue{background:linear-gradient(130deg,rgb(255 255 255 / .16),transparent 45%,rgb(255 255 255 / .05)),rgb(32 61 43 / .94)}
  .home-main .offer.orange{background:linear-gradient(130deg,rgb(255 255 255 / .34),transparent 54%,rgb(255 255 255 / .08)),rgb(255 130 19 / .94)}
}
@media(prefers-reduced-transparency:reduce){
  .marketing-header,.image-note{background:var(--color-bg);backdrop-filter:none;-webkit-backdrop-filter:none;border-color:var(--color-border)}
  .home-main .offers::before{display:none}
  .home-main .offer{backdrop-filter:none;-webkit-backdrop-filter:none}
  .home-main .offer.blue{background:var(--color-ink)}
  .home-main .offer.orange{background:var(--color-accent)}
}
@media(min-width:1440px){.home-main .hero,.section{max-width:calc(var(--content-width) + 96px);padding-left:48px;padding-right:48px}}
@media(min-width:721px) and (max-width:1000px){.menu-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){
  h2{font-size:30px;line-height:36px;letter-spacing:-.7px}
  .home-main .hero h1{font-size:40px;line-height:44px;letter-spacing:-1px}
  .brand-logo{width:160px}
  .marketing-header{flex-wrap:wrap;gap:12px;padding:12px 20px;align-items:center}
  .marketing-header>.button.small{display:inline-flex;order:5;flex:1 1 100%;margin:0;min-height:44px}
  .marketing-header .account-link{margin-left:auto;font-size:13px}
  .marketing-header .menu{margin-left:0}
  .product-card h3,.menu-preview-card h3{font-size:22px;line-height:28px}
  .menu-preview-grid{grid-template-columns:1fr}
}
@media(max-width:380px){.marketing-header .brand-logo{width:140px}.marketing-header .account-link{gap:4px}.marketing-header{gap:8px}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .button,.outline-button,.menu-preview-card{transition:none}
}