:root{--bg:#fff8eb;--surface:#fffdf8;--ink:#2b251f;--muted:#746a60;--line:#ddd2c3;--coral:#e95f43;--yellow:#f2c75c;--green:#47664b;--green-mid:#afc69a;--lilac:#dccdec;--dark:#201c18;--display:Fraunces,Georgia,serif;--body:"DM Sans",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);line-height:1.6;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,select{font:inherit}.container{width:min(1280px,calc(100% - 40px));margin:auto}
.header{position:sticky;top:0;z-index:50;background:rgba(255,248,235,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:10px;flex:0 0 auto}.brand-logo{width:184px;height:auto;object-fit:contain}.navlinks{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}.navlinks a{padding:10px 11px;border-radius:12px;color:var(--muted);font-size:13px;font-weight:700}.navlinks a:hover,.navlinks a:focus-visible{background:#f4eee5;color:var(--coral)}.navbtn{background:var(--coral);color:#fff;padding:12px 16px;border-radius:999px;font-size:12px;font-weight:800}
.section{padding:80px 0}.head{display:flex;justify-content:space-between;align-items:flex-end;gap:38px;margin-bottom:34px}.head>div{max-width:760px}.head>p{max-width:390px;color:var(--muted);margin:0}.eyebrow{display:inline-flex;align-items:center;gap:7px;background:var(--yellow);padding:7px 12px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.05em;color:var(--ink);margin-bottom:14px;text-transform:uppercase}.head h1,.legal h1,.tool-card-main h1{font:600 58px/1.02 var(--display)!important;letter-spacing:-.02em!important;color:var(--ink);margin:0!important}.crumb{display:flex;align-items:center;gap:7px;flex-wrap:wrap;color:var(--muted);font-size:13px;margin-bottom:24px}.crumb a{color:var(--coral);font-weight:800}
.toolgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.tool-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:20px;overflow:hidden;min-width:0;box-shadow:0 12px 30px rgba(66,47,26,.07);transition:transform .2s ease,box-shadow .2s ease}.tool-card:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(66,47,26,.11)}.card-image{width:100%;height:210px;object-fit:cover}.tool-card .tag{align-self:flex-start;margin:16px 18px 0;background:var(--yellow);border-radius:999px;padding:6px 10px;font-size:10px;font-weight:800;text-transform:uppercase}.tool-card h3{font:400 26px/1.08 var(--display);margin:12px 18px 8px}.tool-card p{color:var(--muted);font-size:13px;margin:0 18px 18px}.tool-card .go{margin-top:auto;border-top:1px solid var(--line);padding:13px 18px;color:var(--coral);font-size:12px;font-weight:800}
.tool-copy,.tool-card-main,.legal{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:28px}.tool-copy h2,.legal h2{font:600 31px/1.08 var(--display);margin:0 0 12px}.tool-copy p,.legal p{color:var(--muted);font-size:15px}.tool-copy .actions{display:flex;gap:10px;flex-wrap:wrap}.btn{border:0;border-radius:999px;padding:12px 17px;font-size:13px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:7px;cursor:pointer}.btn-accent{background:var(--coral);color:#fff}.btn-light{background:var(--surface);border:1px solid var(--line);color:var(--ink)}
.search{display:flex;align-items:center;gap:10px;background:var(--surface);border:1.5px solid var(--line);border-radius:18px;height:56px;padding:0 16px;margin-bottom:14px}.search span{font-size:20px;color:var(--muted)}.search input{width:100%;border:0;outline:0;background:transparent;font-size:15px}.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.qchip{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:8px 12px;font-size:12px;font-weight:800}.qchip:hover,.qchip.active{background:var(--yellow);border-color:var(--yellow)}
.shopping-list{display:flex;flex-direction:column;gap:8px}.shopping-list .notice,.notice{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:14px;color:var(--muted);font-size:13px}
.tool-card-main{max-width:850px;margin:auto}.tool-card-main .lead,.legal .lead{font-size:18px;color:var(--muted)}.legal{max-width:900px;margin:auto}.legal h1{margin-bottom:24px!important}.legal h2{margin-top:30px}.legal h2:first-of-type{margin-top:0}
#recipes-intro{margin-top:14px;color:var(--muted);font-size:14px}
@media(max-width:1100px){.toolgrid{grid-template-columns:repeat(3,minmax(0,1fr))}.head h1,.legal h1,.tool-card-main h1{font-size:50px!important}.navlinks{gap:2px}.navlinks a{font-size:12px}}
@media(max-width:800px){.nav{min-height:64px;flex-wrap:wrap;padding-block:10px}.brand-logo{width:155px}.navlinks{display:flex;order:3;width:100%;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px}.navlinks a{white-space:nowrap}.navbtn{display:none}.head{display:block}.head>p{margin-top:16px}.section{padding:56px 0}.toolgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.head h1,.legal h1,.tool-card-main h1{font-size:44px!important}.tool-copy,.tool-card-main,.legal{padding:22px}.card-image{height:190px}}
@media(max-width:520px){.toolgrid{grid-template-columns:1fr}.container{width:calc(100% - 40px)}.brand-logo{width:145px}.head h1,.legal h1,.tool-card-main h1{font-size:39px!important}.tool-card h3{font-size:24px}}

/* Unified ToolZeroo Kitchen brand mark for legacy/content routes */
.brand{display:flex;align-items:center;gap:10px}
.brand-logo{display:none!important}
.brand::before{content:"t*";width:40px;height:40px;display:grid;place-items:center;flex:0 0 40px;border-radius:50%;background:#e95f43;color:#2b251f;font:700 24px/1 Georgia,serif;letter-spacing:-.08em}
.brand::after{content:"Toolzeroo Kitchen";font:700 22px/1 var(--display);letter-spacing:-.02em;color:var(--ink)}
@media(max-width:800px){.brand::before{width:34px;height:34px;flex-basis:34px;font-size:21px}.brand::after{font-size:19px}}

.brand::before{content:"";width:40px;height:40px;background:#e95f43 url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAIOElEQVRYR61Ya2wcVxX+7ux417Oz6/eukxC/8sB1vGpA+QFCVG3TSrh1W0qLlPwAhFSpiB+IqhJI0D+AkBASCIQq8RBBAiI1lCCqOhBTSCEqUlGkIjVOnNjBteOsSfbhtb2P2d3Znbno3tmZvTM7azsWx1rPzL3nnvvdc75z7p0htJKh2IPoC/OoJ29DX5yHkVyBqWmgWgkGpaCdCtAfQ6BvAB3DY1DGJ6E8MIm9CLkfgAxE+dKfob19kYNhQilQMQyU6yZ00+QACWE9xOpkOgBCA3GoEwnsf+40grE4/q8AGTBt5vccmC2VugGtbqJqGDAbbQwXM8bxiWI3UKu/76GTuwa6I0Dt0kWULpx3PFauGyjU6tBNas1L3SBc4EjTi7YqETy67/nTHOyeARZ/92vHaxXDRJEBM0wHk3fiFs+JrnOgNdfEJD71ND70uRdwXwBZSLd++gPUFue5sbxeQ6lmtADzkxYPwhN3x+PUca4yfAhHX/kuAmoYXpFaWgBs/vDbHFzdNJEuV3cNrlUapCMCcNvVtNlWXv0Ayz/+ns94H4AsrKx81EwT2UoNdZO2BUd29F4TmWODuc3xKHHGFG/MIXn2DLYFWHn3MudcvQGOlQxR7MULToD32RF7LBWBibEW3WqppWdnsD57wR9gPZtBcea85blyDaYPOK9HiNDPnlkSXdsooWoIY4kbGNOZy+UFwAJkCtx74xzPgRaA2sx51NfTVlh9wTFphMeH86ZJ8Z33lvCTq8v41c07VrsrnFZS/GJ+Fa/O3UayVIHZ6BYiDr1YRPqPr7kBMu9V/nUZGyysbNROZEOrF69uFLBR1VGnJmqG6Qo5A0YYJwlgwPrlKjX8M5XD60t3eW0VZ13/y58cL8q290o1k+8MDDF1jDqLbwuONnSvpLYc0h8f6LL6Kfguc+m/63hzOYX94RBKDAyl+Nn8Ki/27P5j8R6MRBXHNtsyN9+aQd+zpywPVm/NY0vX3cT3Zp+PUEF3cbPEecv+JvoiVj8BJAkIgEA3KJbyGu5pVT6uapiY6FHx9Y8e5uC8Qcq9ZSWLVFuYRzGVgshrZng78YK+tVVGTq/x9iFVQawzaNGVedAEHj7Qi+9/4sM4PhAV+EZxpFvF0W7F16aWL/ITk8SOSyW97lrBdmH1NpuUea/glJqRiMI9yXjGwmeXqvcyeby/XoBMCKaGYwhAwpsrKfw7U3AZtfOTJWr59jLk8uoKqqZFalHJDrFXRPITKzexsFlyxnd3yrh8N4elfBkLGwVIhOCVE0dwdT0PCQTTw3FMj8Z4+9+SWRT1uisJnVsClG5eg1xJp9olqSPOAhukt3lXMSgWN4v4z5bmePfiaoZrMO8xkQiQLJRx+vABJAcrODHQxfs/MzrIfy2OIM1LhXmwlLnn1++LsEYpVgtlvJ/L4+amhtv5JjA7xAyXBIrukIyJ3iiO90WQ6I9yjg+GQ84c7aIktldLJci1Ysmt0LgS4aoZBn4+fwfLhTKvWaIeFYr6QbUTjx3sx0RPFANKhwOc8bTFUe6drjmv0FjXipDtas47PQo8CwEsbJVwY6PY0LN2hJ5QEOM9YWQrOj7Y0vjAE7FuPLSvzxWm3YqtKyYh251kqihAqUlye9t0wFLgaFcYH+mP8t1gvEfFg/1R9IWCYEfXV6+tcEWWuWPdCkij0m9XP21xSo6PsPZAWIUsKSoHKPawHcDxAgHUDhlfToy4MtjiGuF7Nwszy0o1EGgBJ3qG7ACKeu5DsUFI4dExp9Emup8FXw4RYIuXCQITJqJBucVzf01m8c0ri7i0tu5rRxR7flsnEItBij6Q2BVX/EKmG9Ta6NkWRwFVDrj6s2Ud527dRUqr4kp6k/PZa8fv2W5ThsYgdY6MWQ27QCmGif1MfhyyBrKrSAF2EPjR3ArfNhk/Px7v4TXRL3PbSeRYAlLXsQQnI+eOMJr4uF3kEPuFJAIlEODJw0BodcM5DV1YTiNdtg4gw9FOPHqgX3wDbZkHHn52DMQRnUhYp5n41FPWpIIBL5lF19siEav4ElDIkoS5XBF5vY6zt9Ywm8xw0JEOGS8lDrnLV5tkcaJDwcHxOdi/wSeecQHwi7ZfGwUw2R/hBtmh4DeLSbz87g38Yy3X+ARC8aXJIfR2Wsnjjorbojh/gBDse+5UEyALcWzqaUux+arQYsAP5CP7+3hN5Cdmvgdbej1BGV9JjPFdpQmnQQ6fPU6k0cDDj/IS43pxN7QSrn31RX51BvlwkomIn7D36GoNZ24msVQo81p4fCCCT48O8vC6oDgG3cVSXHw4PojD7CW+P9b6ZSE1ewFrZ3/JR3gXafOjnVDhjrg8JoxyGW2CtDVkCTj04ktQP/mI/3vx4NRTiH3KCrVX/MARgU+kYcwqN3aPwGoi8Md+2xPsBCWCoelnXeB8vywMff4FRCYSbbloi+MhwuOwDeUbz768tkYpcgD7jhxFz6kv7u7bzOGXvwGlUcD5aYe2m4M6FxGS37rEPiqUqa6gjHjiQfR+7Vv3//ntzm/PIDs70zKhTSXSeG5noC1vKRAKSOjt7EDksWlET30Be/6AmXvn71g7/xr0bNoa4OW6Vxo7UjuVoCRB7Qgg3NUFdfp5qI8/ie1kR4BMKpk0Un84h/V33naVBOJB4ZwlRYsNnZAkIcyAyRKUk9NQn/ksJKX1e+CeANpSzaSQfeN15K/PoZzNgNhVmYlQMnhGSwRBQhCUA+iUJASjESgnn0D48Sd3BcyW+wIoSnXhOko3rqOeXIGeycBgFChrIAyYqkJWVXQcHEXH+CTkgyMIjh/byaSv/A/5lwUtVPS6uQAAAA50RVh0U29mdHdhcmUARmlnbWGesZZjAAAAAElFTkSuQmCC") center/40px 40px no-repeat}.brand::after{content:"Toolzeroo Kitchen"}


/* Final visual polish — remove legacy raster header branding everywhere this stylesheet is used. */
.brand::before{
  content:"✦";
  width:40px;height:40px;display:grid;place-items:center;flex:0 0 40px;
  border-radius:50%;background:#e95f43;color:#fff;
  font:700 18px/1 Georgia,serif;
  letter-spacing:0;
}
.brand-logo,.brand-mark img{display:none!important}
.brand::after{content:"Toolzeroo Kitchen";color:#e95f43}
@media(max-width:800px){
  .brand::before{width:34px;height:34px;flex-basis:34px;font-size:16px}
  .brand::after{font-size:19px}
}


/* Brand logo correction: replace legacy/synthetic marks with the approved red ToolZeroo wordmark. */
.brand-logo,.brand-mark,.brand-name{display:none!important}
.brand{display:flex;align-items:center;gap:0;min-width:205px}
.brand::before{
  content:""!important;
  display:block;
  width:205px;height:46px;flex:0 0 205px;
  background:url("/brand/toolzeroo-logo-red.svg?v=1") center/contain no-repeat!important;
}
.brand::after{content:none!important}
.footer-logo{content:url("/brand/toolzeroo-logo-red.svg?v=1")!important;width:205px!important;height:auto!important;max-width:100%;object-fit:contain}
@media(max-width:800px){
  .brand{min-width:170px}
  .brand::before{width:170px;height:38px;flex-basis:170px}
  .footer-logo{width:170px!important}
}


/* Final ToolZeroo* brand + footer standardization. */
.brand{display:inline-flex!important;align-items:center!important;gap:0!important;width:190px!important;min-width:190px!important;height:58px!important}
.brand-logo,.brand-mark,.brand-name{display:none!important}
.brand::before{
  content:""!important;display:block!important;width:190px!important;height:58px!important;
  background:url("/brand/toolzeroo-logo-web-400x125.png?v=2") center/contain no-repeat!important;
}
.footer{
  margin-top:64px!important;
  border-top:1px solid var(--line)!important;
  background:var(--bg)!important;
  backdrop-filter:none!important;
  color:var(--ink)!important;
  padding:64px 0 28px!important;
}
.footer:before{display:none!important}
.footgrid{grid-template-columns:1.45fr .78fr .78fr .82fr!important;gap:48px!important}
.footer-brand{display:inline-flex!important;width:190px!important;height:58px!important}
.footer-logo{display:none!important}
.footer-brand::before{
  content:""!important;display:block!important;width:190px!important;height:58px!important;
  background:url("/brand/toolzeroo-logo-web-400x125.png?v=2") center/contain no-repeat!important;
}
.footer p{color:var(--muted)!important;font-size:13px!important;line-height:1.6!important}
.footer h4{color:var(--coral)!important;font-size:11px!important;letter-spacing:.08em!important;margin:0 0 14px!important}
.footer a{color:var(--ink)!important;font-size:13px!important;margin:0 0 10px!important}
.footer .bottom{border-top:1px solid var(--line)!important;margin-top:40px!important;padding-top:18px!important;color:var(--muted)!important;font-size:12px!important}
@media(max-width:800px){
  .brand{width:165px!important;min-width:165px!important;height:52px!important}
  .brand::before{width:165px!important;height:52px!important}
  .footgrid{grid-template-columns:1fr 1fr!important;gap:30px 24px!important}
  .footer-brand,.footer-brand::before{width:165px!important;height:52px!important}
}
@media(max-width:520px){
  .brand{width:155px!important;min-width:155px!important;height:48px!important}
  .brand::before{width:155px!important;height:48px!important}
  .footgrid{grid-template-columns:1fr!important}
}


/* Final footer palette: black background across all content/editorial pages. */
.footer{
  background:#000!important;
  color:#fff!important;
  border-top-color:#000!important;
}
.footer p{color:#d8d2ca!important}
.footer h4{color:#f2c75c!important}
.footer a{color:#fff!important}
.footer a:hover{color:#f2c75c!important}
.footer .bottom{border-top-color:rgba(255,255,255,.18)!important;color:#cfc7bf!important}

/* Kitchen logo treatment — official ToolZeroo wordmark with site-matched black icon. */
.brand{position:relative!important;overflow:visible!important}
.brand::before{
  content:""!important;position:absolute!important;left:0!important;top:50%!important;transform:translateY(-50%)!important;
  width:40px!important;height:40px!important;border-radius:50%!important;background:#111!important;z-index:2!important;
}
.brand::after{
  content:"✦"!important;position:absolute!important;left:0!important;top:50%!important;transform:translateY(-53%)!important;
  width:40px!important;height:40px!important;display:grid!important;place-items:center!important;
  color:#fff!important;font-family:Arial,sans-serif!important;font-size:19px!important;line-height:1!important;z-index:3!important;
}
.brand-logo{display:block!important;width:190px!important;height:47px!important;object-fit:contain!important;position:relative!important;z-index:1!important}
.footer-brand{position:relative!important;overflow:visible!important}
.footer-brand::before{
  content:""!important;position:absolute!important;left:0!important;top:50%!important;transform:translateY(-50%)!important;
  width:40px!important;height:40px!important;border-radius:50%!important;background:#e95f43!important;z-index:2!important;
}
.footer-brand::after{
  content:"✦"!important;position:absolute!important;left:0!important;top:50%!important;transform:translateY(-53%)!important;
  width:40px!important;height:40px!important;display:grid!important;place-items:center!important;color:#fff!important;
  font-family:Arial,sans-serif!important;font-size:19px!important;line-height:1!important;z-index:3!important;
}
@media(max-width:800px){
  .brand-logo{width:165px!important;height:42px!important}
  .brand::before,.brand::after,.footer-brand::before,.footer-brand::after{width:36px!important;height:36px!important}
  .brand::after,.footer-brand::after{font-size:17px!important}
}

/* FINAL KITCHEN LOGO: one unified lockup, no layered/pseudo duplicate branding. */
.brand{
  width:190px!important;min-width:190px!important;height:50px!important;display:block!important;position:relative!important;
  background:url("/brand/toolzeroo-kitchen-logo.svg?v=1") center/190px 50px no-repeat!important;
}
.brand>*{display:none!important}
.brand::before,.brand::after{content:none!important;display:none!important}
.footer-brand{
  width:190px!important;height:50px!important;display:block!important;position:relative!important;
  background:url("/brand/toolzeroo-kitchen-logo-footer.svg?v=1") left center/190px 50px no-repeat!important;
}
.footer-brand>*{display:none!important}
.footer-brand::before,.footer-brand::after{content:none!important;display:none!important}
@media(max-width:800px){
  .brand{width:165px!important;min-width:165px!important;height:44px!important;background-size:165px 44px!important}
  .footer-brand{width:165px!important;height:44px!important;background-size:165px 44px!important}
}

/* Final Figma logo sizing hook. The logo asset is supplied from the Figma brand file. */
.site-fair-logo,.tz-home-brand,.tz-brand,.tz-plan-brand,.brand{
  display:block;
}

/* Exact Figma logo exports */
.brand{
  width:200px!important;min-width:200px!important;height:46px!important;
  display:block!important;background:url("/brand/toolzeroo-kitchen-figma-black.png?v=2") center/200px 46px no-repeat!important;
}
.brand>*{display:none!important}
.brand::before,.brand::after{content:none!important;display:none!important}
.footer-brand{
  width:200px!important;height:46px!important;display:block!important;
  background:url("/brand/toolzeroo-kitchen-footer-light.png?v=1") left center/200px 46px no-repeat!important;
}
.footer-brand>*{display:none!important}
.footer-brand::before,.footer-brand::after{content:none!important;display:none!important}

/* Footer Figma logo: transparent wrapper, exact light artwork. */
.footer-brand{background-color:transparent!important;box-shadow:none!important}

/* Final transparent Figma footer logo — no embedded/background box. */
.footer-brand{
  background-color:transparent!important;
  background-image:url("/brand/toolzeroo-kitchen-footer-light.png?v=1")!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:200px 46px!important;
  box-shadow:none!important;
}

/* Footer logo: reuse the verified transparent black Figma logo and invert it for the black footer. */
.footer-brand{
  background-color:transparent!important;
  background-image:url("/brand/toolzeroo-kitchen-figma-black.png?v=3")!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:200px 46px!important;
  filter:invert(1)!important;
  box-shadow:none!important;
}

/* === FINAL KITCHEN HEADER — matches the approved site-wide header === */
.header{
  height:76px!important;
  min-height:76px!important;
  background:#fff8eb!important;
  border-bottom:1px solid #ddd2c3!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  position:sticky!important;
  top:0!important;
  z-index:100!important;
}
.header .container.nav{
  width:100%!important;
  max-width:1440px!important;
  height:76px!important;
  min-height:76px!important;
  margin:0 auto!important;
  padding:0 58px!important;
  display:grid!important;
  grid-template-columns:200px minmax(0,1fr) 200px!important;
  align-items:center!important;
  column-gap:32px!important;
}
.header .brand{
  width:200px!important;
  min-width:200px!important;
  height:46px!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  background:url("/brand/toolzeroo-kitchen-figma-black.png?v=3") center/200px 46px no-repeat!important;
}
.header .brand>*,
.header .brand-logo,
.header .brand-mark,
.header .brand-name{
  display:none!important;
}
.header .navlinks{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:34px!important;
  margin:0!important;
  padding:0!important;
  flex-wrap:nowrap!important;
}
.header .navlinks a{
  display:block!important;
  padding:0!important;
  margin:0!important;
  background:none!important;
  border:0!important;
  border-radius:0!important;
  color:#2b251f!important;
  font:600 14px/1.2 "DM Sans",ui-sans-serif,system-ui,sans-serif!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  transform:none!important;
  box-shadow:none!important;
}
.header .navlinks a:hover{
  background:none!important;
  color:#e95f43!important;
  transform:none!important;
}
.header .navbtn{
  justify-self:end!important;
  width:auto!important;
  margin:0!important;
  padding:14px 22px!important;
  background:#e95f43!important;
  color:#fff!important;
  border:0!important;
  border-radius:999px!important;
  font:800 14px/1.2 "DM Sans",ui-sans-serif,system-ui,sans-serif!important;
  white-space:nowrap!important;
  box-shadow:none!important;
}
@media(max-width:900px){
  .header .container.nav{
    grid-template-columns:170px 1fr!important;
    width:100%!important;
    padding:0 20px!important;
  }
  .header,.header .container.nav{
    height:64px!important;
    min-height:64px!important;
  }
  .header .navlinks{
    display:flex!important;
    justify-content:flex-end!important;
    gap:16px!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }
  .header .navlinks::-webkit-scrollbar{display:none!important}
  .header .navlinks a{font-size:12px!important}
  .header .navbtn{display:none!important}
  .header .brand{
    width:170px!important;
    min-width:170px!important;
    height:39px!important;
    background-size:170px 39px!important;
  }
}

/* Footer columns on content pages (ingredient, category, guides, about, legal, recipes): the base grid rules are not loaded on these pages, so the four columns stacked and the links ran together on one line. */
.footgrid{display:grid!important;align-items:start}
.footgrid a{display:block}
@media(max-width:800px){.footgrid{grid-template-columns:1fr 1fr!important;gap:28px!important}}
@media(max-width:520px){.footgrid{grid-template-columns:1fr!important}}

/* Ingredient hubs and guide collections */
.hub-section{margin-bottom:22px}
.hub-section p{line-height:1.6}
.hub-section a:not(.btn){color:var(--coral);font-weight:700}
.hub-lead{font-size:18px;line-height:1.55;color:var(--ink);max-width:820px;margin:0 0 26px}
.hub-tips{margin:0;padding-left:20px;color:var(--muted);font-size:15px;line-height:1.6}
.hub-tips li{margin-bottom:8px}
.hub-sources{font-size:13px!important;margin:14px 0 0}
.hub-pick{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:26px;align-items:center}
.hub-pick h2 a{color:var(--ink)}
.hub-pick-meta{font-weight:700;color:var(--ink)!important}
.hub-pick-image{width:100%;height:auto;border-radius:16px;object-fit:cover;aspect-ratio:3/2}
.hub-grid-title{font:600 28px/1.1 var(--display);margin:34px 0 14px}
.hub-group-intro{color:var(--muted);margin:-4px 0 16px;max-width:760px}
.hub-group{margin-bottom:10px}
@media (max-width:760px){.hub-pick{grid-template-columns:1fr}.hub-pick-image{order:-1}.hub-lead{font-size:16px}.hub-grid-title{font-size:24px}}

/* Phones: the nav scrolls sideways beside the logo. Right-aligned (flex-end) overflow can't be
   scrolled back to its start, which hid the first links. Start it on the left, and give it
   more room on small phones. */
@media(max-width:900px){
  .header .navlinks{justify-content:flex-start!important;padding-right:4px!important}
}
@media(max-width:480px){
  .header .container.nav{grid-template-columns:128px minmax(0,1fr)!important;gap:14px!important;padding:0 14px!important}
  .header .brand{width:128px!important;min-width:128px!important;height:30px!important;background-size:128px 30px!important}
  .header .brand::before{width:128px!important;height:30px!important;flex-basis:128px!important}
}