/* Breakpoints and reduced-motion overrides — must load last */
/* mobile */
@media (max-width:960px){
  /* top/right + an explicit vh height, NOT bottom:0. header.scrolled/header.solid
     apply backdrop-filter, which makes header a new containing block for its
     position:fixed descendants (same family as transform/filter/perspective).
     With bottom:0, nav's height would then resolve against header's own ~80px
     box instead of the viewport, collapsing the drawer to a sliver. vh/dvh
     units bypass that because they're always viewport-relative regardless of
     containing block. */
  nav{position:fixed;top:0;right:0;height:100vh;height:100dvh;width:min(78vw,340px);
    background:var(--forest);flex-direction:column;padding:90px 30px 30px;
    overflow-y:auto;transform:translateX(100%);transition:.4s;box-shadow:var(--shadow)}
  nav.open{transform:none}
  nav ul{flex-direction:column;gap:22px;align-items:flex-start}
  nav a{color:#f2efe2 !important;font-size:1.05rem}
  nav .has-sub{width:100%}
  nav .sub{position:static;opacity:1;visibility:visible;transform:none;margin:8px 0 0;padding:0 0 0 16px;
    min-width:0;background:transparent;border:0;border-left:1px solid rgba(255,255,255,.18);
    border-radius:0;box-shadow:none;gap:4px}
  nav .sub a{padding:6px 0;font-size:.95rem}
  nav .sub a:hover{background:transparent}
  .sub-caret{display:none}
  .menu-toggle{display:block}
  .about-grid,.c-grid{grid-template-columns:1fr;gap:40px}
  .roots-grid{grid-template-columns:1fr;gap:36px}
  .roots-visual{position:static;margin-bottom:10px}
  .grind-big{width:150px;height:160px}
  .product-grid,.product-grid.two,.q-grid,.t-grid,.grid-4,.stats{grid-template-columns:repeat(2,1fr)}
  .team-grid{grid-template-columns:1fr}
  .page-banner{padding:150px 0 64px}
  .about-media .badge{left:-14px;bottom:-24px}
}
@media (max-width:560px){
  .product-grid,.product-grid.two,.q-grid,.t-grid,.grid-4,.stats{grid-template-columns:1fr}
  .pad{padding:80px 0}
  .hero-content{padding:120px 0 80px}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001s !important;transition-duration:.001s !important}
  .reveal{opacity:1;transform:none}
}