/* ==========================================================================
   NEO APPLET — Mobile & tablet layer (loads last).
   Section logic on small screens, everywhere:
     1 heading (kicker + title)  →  2 image / media  →  3 text  →  4 explore link
   Desktop layouts are untouched; everything below applies at <= 900px only.
   ========================================================================== */

/* explore links added to sections (all sizes) */
.delivery__foot{ margin-top:var(--s-7); }
.one__copy > .link, .who__copy > .link, .engineer__copy > .link{ margin-top:var(--s-6); }

/* ---------- global safety (all small screens) ---------- */
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
img, video, svg{ max-width:100%; }
.container{ padding-inline:max(var(--gutter), env(safe-area-inset-left)) max(var(--gutter), env(safe-area-inset-right)); }
.footer a, .map-addr, .chan__list a{ overflow-wrap:anywhere; }
.wa-float{ right:max(16px, env(safe-area-inset-right)); bottom:max(16px, env(safe-area-inset-bottom)); }
.to-top{ bottom:max(18px, calc(env(safe-area-inset-bottom) + 8px)); }

@media (pointer:coarse){
  .btn{ min-height:48px; }
  .link{ min-height:44px; display:inline-flex; align-items:center; }
  .group__list a, .idxrow, .reg__row, .steps li{ min-height:48px; }
  .filter button, .filter [role="tab"], .filter .chip{ min-height:44px; }
  input, select, textarea{ font-size:16px; }      /* stops iOS zoom-on-focus */
  .menu a{ min-height:48px; }
}

/* ---------- <= 900px : heading → image → text → explore ---------- */
@media (max-width:900px){

  /* shared: a copy block + a media block become one ordered stack */
  .what__grid, .one__grid, .who__grid, .believe__grid, .engineer__grid, .account__top, .map-block{
    display:grid; grid-template-columns:minmax(0,1fr); gap:var(--s-5);
  }
  .what__copy, .one__copy, .who__copy, .believe__main, .engineer__copy, .account__copy, .map-copy, .chap__copy{ display:contents; }

  /* the kicker sits tight above its heading */
  .what__copy > .kicker, .one__copy > .kicker, .who__copy > .kicker, .believe__main > .kicker,
  .engineer__copy > .kicker, .account__copy > .kicker, .map-copy > .kicker{ order:1; margin:0 0 calc(var(--s-3) * -1); }
  .what__copy > h2, .one__copy > h2, .who__copy > h2, .believe__main > h2,
  .engineer__copy > h2, .account__copy > h2, .map-copy > h2{ order:2; margin:0; max-width:none; }

  /* media comes straight after the heading */
  .what__fig, .one__media, .who__fig, .believe__fig, .engineer__media, .account__fig, .map-frame{ order:3; margin:0; }

  /* text, then lists, then the explore link */
  .what__copy > .lede, .one__copy > .lede, .who__copy > .lede, .engineer__copy > .lede, .account__copy > .lede{ order:4; margin:0; }
  .map-addr{ order:4; margin:0; }
  .believe__main > .principles, .one__copy > .pillars, .who__copy > .spec, .engineer__copy > .steps{ order:5; margin:0 !important; }
  .what__copy > .link, .one__copy > .link, .who__copy > .link, .engineer__copy > .link,
  .account__copy > .link, .map-copy > .link{ order:6; margin:0 !important; justify-self:start; }

  /* media frames: comfortable crops on phones and tablets */
  .what__fig .media, .who__fig .media{ aspect-ratio:4/3; }
  .one__media, .engineer__media{ aspect-ratio:4/3; }
  .believe__fig{ order:3; min-height:0; aspect-ratio:4/3; }
  .account__fig .media{ aspect-ratio:4/3; }
  .map-frame{ aspect-ratio:4/3; }

  /* home — core systems groups: heading → image → list */
  .group{ display:flex; flex-direction:column; gap:0; }
  .group__head{ order:1; margin:0 0 var(--s-4); }
  .group__media{ order:2; margin:0 0 var(--s-4); }
  .group__list{ order:3; }

  /* services — chapters: label + title → image → description → scope → enquire */
  .chap, .chap--flip, .chap--pos{ display:grid; grid-template-columns:minmax(0,1fr); gap:var(--s-5); }
  .chap__copy > .chap__no{ order:1; margin:0 0 calc(var(--s-4) * -1); }
  .chap__copy > h3{ order:2; margin:0; }
  .chap__media, .chap--flip .chap__media{ order:3; margin:0; aspect-ratio:16/10; }
  .chap__copy > .chap__desc{ order:4; margin:0; max-width:none; }
  .chap__copy > .chap__scope{ order:5; margin:0; }
  .chap__copy > .link{ order:6; margin:0 !important; justify-self:start; }
  .chap__copy > *:not(.chap__no):not(h3):not(.chap__desc):not(.chap__scope):not(.link){ order:5; }

  /* every section: calmer vertical rhythm on small screens */
  .sec-head{ margin-bottom:var(--s-6); }
}

/* ---------- tablet portrait (561–900px): use the width, keep the order ---------- */
@media (min-width:561px) and (max-width:900px){
  .hero__actions{ gap:var(--s-3); }
  .groups{ gap:var(--gap-md); }
  .what__fig .media, .who__fig .media, .one__media, .engineer__media, .believe__fig, .account__fig .media{ aspect-ratio:16/9; }
}

/* ---------- phones (<= 560px) ---------- */
@media (max-width:560px){
  :root{ --sec-y:clamp(56px, 14vw, 72px); }
  .hero__title{ overflow-wrap:break-word; hyphens:manual; }
  .hero__actions .btn{ width:100%; }
  .cta__actions .btn{ width:100%; }
  .footer__grid{ gap:var(--s-6); }
  .proof__feature{ gap:var(--s-5); }
  .path{ padding-left:var(--s-5); }
}

/* ---------- very small phones (<= 360px) ---------- */
@media (max-width:360px){
  :root{ --gutter:16px; }
  .hero__title{ font-size:clamp(2rem, 9.4vw, 2.4rem); }
  h2{ font-size:clamp(1.65rem, 8vw, 2rem); }
  .brand-word{ font-size:.95rem; }
  .btn{ padding-inline:16px; letter-spacing:.06em; }
  .spec > div{ grid-template-columns:1fr; }
}

/* ---------- short landscape phones ---------- */
@media (max-height:480px) and (orientation:landscape){
  .hero{ min-height:0; }
  .hero__body{ padding-block:var(--s-7); }
  .menu{ overflow-y:auto; }
}

/* section header rows never push past the screen */
.act__head{ flex-wrap:wrap; }
.act__head h2{ min-width:0; flex:1 1 12ch; }
.group__head{ flex-wrap:wrap; }
.group__head h3{ min-width:0; }
.group{ align-items:stretch; }

/* ==========================================================================
   Round 2 — header, partner marquee, accountability order, stat rows
   ========================================================================== */

/* ---- header: brand and Request-a-quote never collide ---- */
.header-inner{ grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); }
.brand{ flex-shrink:0; }
.brand-word{ white-space:nowrap; }
.brand-word b, .brand-word i{ white-space:nowrap; }
@media (max-width:1040px){ .header-inner{ grid-template-columns:minmax(0,1fr) auto; } }
@media (max-width:700px){
  .header-actions .btn--primary{ display:none; }     /* the quote button lives in the menu on phones/small tablets */
  .brand-word i{ display:none; }
  .header-actions{ gap:0; }
}
@media (max-width:360px){ .brand-word b{ font-size:1rem; } .brand img{ height:30px; } }

/* ---- partner names: right-to-left marquee (desktop keeps the static row) ---- */
.rail__marquee{ display:none; }
@media (max-width:900px){
  .rail__in{ display:block; }
  .rail__label{ display:block; margin-bottom:var(--s-4); white-space:normal; }
  .rail__marks{                                   /* kept for screen readers, hidden visually */
    position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap;
  }
  .rail__in{ position:relative; }
  .rail__marquee{
    display:block; overflow:hidden; margin-inline:calc(var(--gutter) * -1);
    -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
            mask-image:linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
  }
  .rail__track{ display:flex; width:max-content; animation:railScroll 26s linear infinite; will-change:transform; }
  .rail__set{ display:flex; align-items:center; flex:none; }
  .rail__set span{
    position:relative; padding-inline:var(--s-6); font-family:var(--font-mono); font-size:.8rem; letter-spacing:.16em;
    color:var(--ink-soft); white-space:nowrap;
  }
  .rail__set span::after{
    content:""; position:absolute; right:-2px; top:50%; width:4px; height:4px; margin-top:-2px;
    background:var(--brass); transform:rotate(45deg); opacity:.8;
  }
  .rail__marquee:hover .rail__track{ animation-play-state:paused; }
}
@keyframes railScroll{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(-50%,0,0); } }
@media (prefers-reduced-motion:reduce){
  .rail__track{ animation:none; }
  .rail__marquee{ overflow-x:auto; -webkit-mask-image:none; mask-image:none; scrollbar-width:none; }
  .rail__marquee::-webkit-scrollbar{ display:none; }
}

/* ---- accountability (home): heading → statements → link ---- */
@media (max-width:900px){
  .acct__grid{ display:grid; grid-template-columns:minmax(0,1fr); gap:var(--s-5); }
  .acct__lead{ display:contents; }
  .acct__lead > .kicker{ order:1; margin:0 0 calc(var(--s-3) * -1); }
  .acct__lead > h2{ order:2; margin:0; }
  .acct__list{ order:3; }
  .acct__lead > .link{ order:4; margin:var(--s-2) 0 0 !important; justify-self:start; }
}

/* ---- about: proof numbers as a tidy stat row ---- */
@media (max-width:900px){
  .proofline{
    display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:0; margin-top:var(--s-7);
    border-top:1px solid var(--line-strong); border-bottom:1px solid var(--line-strong);
  }
  .proofline li{ display:flex; flex-direction:column; align-items:flex-start; gap:var(--s-2); padding:var(--s-5) var(--s-4); }
  .proofline li + li{ border-left:1px solid var(--line); }
  .proofline li:first-child{ padding-left:0; }
  .proofline b{ font-size:clamp(1.7rem, 1.2rem + 1.8vw, 2.3rem); line-height:1; }
  .proofline span{ font-size:.66rem; line-height:1.5; letter-spacing:.1em; overflow-wrap:anywhere; }
}
@media (max-width:560px){
  .proofline{ grid-template-columns:1fr; }
  .proofline li{ flex-direction:row; align-items:baseline; gap:var(--s-5); padding:var(--s-4) 0; }
  .proofline li + li{ border-left:0; border-top:1px solid var(--line); }
  .proofline b{ flex:0 0 5.2rem; font-size:1.8rem; }
  .proofline span{ font-size:.72rem; }
}