/* =========================================================
   10. RESPONSIVE  (desktop-first; breakpoints 1280 / 1024 / 768 / 480 / 380)
   ========================================================= */

@media (max-width:1280px){
  .primary-nav__list a{padding-inline:10px;font-size:.93rem}
  .process{grid-template-columns:repeat(4,minmax(0,1fr))}
  .process__track{display:none}
  .why__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* Tablet landscape and below: drawer navigation */
@media (max-width:1024px){
  :root{--header-h:72px;--header-h-compact:62px}
  .menu-toggle{display:inline-grid}
  .primary-nav{
    position:fixed;inset-block:0;inset-inline-start:0;z-index:70;width:min(86vw,380px);
    background:var(--white);box-shadow:var(--sh-3);
    padding:calc(env(safe-area-inset-top,0px) + 16px) 20px calc(env(safe-area-inset-bottom,0px) + 24px);
    display:flex;flex-direction:column;
    transform:translateX(100%);visibility:hidden;
    transition:transform var(--d-ui) var(--ease-out),visibility 0s linear var(--d-ui);
    overflow-y:auto;
    background-image:repeating-linear-gradient(var(--lean-grad),transparent 0 46px,rgba(18,107,255,.05) 46px 47px);
  }
  .primary-nav.is-open{transform:none;visibility:visible;transition:transform var(--d-ui) var(--ease-out),visibility 0s}
  .primary-nav__head{display:flex;align-items:center;justify-content:space-between;padding-bottom:16px;margin-bottom:8px;border-bottom:1px solid var(--line)}
  .primary-nav__title{font-weight:600;color:var(--muted);font-size:var(--fs-sm)}
  .primary-nav__list{flex-direction:column;align-items:stretch;gap:2px}
  .primary-nav__list a{padding:14px 12px;font-size:1.05rem;gap:14px}
  .primary-nav__list a .i{width:20px;height:20px}
  .primary-nav__list a.is-active{background:var(--blue-50);box-shadow:inset -2px 0 0 var(--blue)}
  .primary-nav__indicator{display:none}
  .primary-nav__foot{display:grid;gap:8px;margin-top:auto;padding-top:24px;border-top:1px solid var(--line);font-size:var(--fs-sm);color:var(--muted);text-align:right}

  .hero__grid{grid-template-columns:1fr}
  .hero__copy{max-width:680px}
  .hero__visual{max-width:560px;width:100%}
  .hero__l{width:min(90vw,620px);inset-inline-end:-24vw;top:auto;bottom:-10%}

  .about__grid{grid-template-columns:1fr;align-items:start}
  .bento{grid-template-columns:repeat(2,minmax(0,1fr))}
  .card--erp{grid-row:auto}
  .split{grid-template-columns:1fr}
  .split__aside{position:static}
  .oracle__grid{grid-template-columns:1fr}
  .oracle__feature{min-height:260px}
  .infra__grid{grid-template-columns:1fr}
  .stack{max-width:520px}
  .hub{grid-template-columns:1fr}
  .hub__diagram{max-width:380px}
  .support{grid-template-columns:1fr}
  .support__list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .why__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .why__item--lead{grid-column:1/-1;grid-row:auto;min-height:220px}
  .contact__grid{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .footer__brand{grid-column:1/-1}

  /* Story: no pinning on tablets and phones */
  .story{height:auto;padding-block:calc(var(--section-y) + 30px) var(--section-y)}
  .story__sticky{position:relative;height:auto;display:block}
  .story__grid{grid-template-columns:1fr;padding-top:0}
  .story__art{order:-1;justify-self:start}
  .story__svg{width:160px}
}

@media (max-width:768px){
  :root{--fs-body:1rem}
  .process{grid-template-columns:repeat(2,minmax(0,1fr))}
  .process__step:last-child{grid-column:1/-1}
  .oracle__list{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .metric{padding-block:18px}
  .story__art{display:none}
}

/* Phones */
@media (max-width:560px){
  .hero{padding-bottom:64px}
  .hero__actions{flex-direction:column;align-items:stretch}
  .hero__actions .btn{width:100%}
  .hero__domains{margin-top:var(--s-6);row-gap:8px}
  .hero__visual{margin-inline-end:0}
  .ops{padding:18px 16px 0}
  .ops__list li{grid-template-columns:auto 1fr 56px;gap:10px;padding:11px 2px}
  .ops__base{margin-inline:-16px;padding-inline:16px}
  .ops__links{display:none}
  .hero__foot-bar{inset-inline-start:12%;inset-inline-end:0}
  .hero__l{opacity:.12}

  .bento{grid-template-columns:1fr}
  .card--erp,.card--custom{grid-column:auto}
  .erp-map{grid-template-columns:repeat(2,minmax(0,1fr))}

  .row{padding-inline:4px;gap:14px}
  .tags li{width:100%}
  .stack__layer{margin-inline-end:calc(var(--i) * 12px);padding-inline:20px 24px;min-height:56px;font-size:var(--fs-sm)}
  .hub__diagram{max-width:300px}
  .hub__list{grid-template-columns:1fr}
  .support__list{grid-template-columns:1fr}
  .why__grid{grid-template-columns:1fr}
  .form__grid{grid-template-columns:1fr}
  .form__actions .btn{width:100%}
  .footer__grid{grid-template-columns:1fr}
  .footer__bottom{flex-direction:column;align-items:flex-start}
  .metric dd{font-size:2.4rem}
}

@media (max-width:380px){
  :root{--gutter:18px}
  .brand__type{font-size:1.08rem}
  .hero__title{font-size:2.05rem}
  .process{grid-template-columns:1fr}
  .process__step:last-child{grid-column:auto}
  .metric:nth-child(even){padding-inline-start:14px}
}

/* Large desktops */
@media (min-width:1600px){
  :root{--container:1320px}
}

/* =========================================================
   REDUCED MOTION — content stays fully usable
   ========================================================= */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0ms!important}
  .js [data-reveal],.js [data-hero],.js .mask-line>span,.js [data-draw]{opacity:1!important;transform:none!important}
  .js .hero__l use{stroke-dashoffset:0}
  .js .ops__list em::after,.js .hero__foot-bar{transform:none}
  [data-parallax]{transform:none!important}
  .story{height:auto;padding-block:var(--section-y)}
  .story__sticky{position:relative;height:auto}
  .story__path,.story__swoosh{stroke-dashoffset:0!important}
  .story__stages li{opacity:1}
}