@charset "utf-8";
/* Naireen · responsive.css — breakpoints and reduced motion — always last */

/* ---------- responsive ---------- */
@media (max-width:980px){
  .split,.seal-grid,.agent-grid{grid-template-columns:minmax(0,1fr)}
  .svc{grid-template-columns:minmax(0,1fr)}
  .agent-grid{gap:30px}
  .phone{order:-1}
  .nav-links{display:none}
  #hero{padding-top:calc(var(--nav) + 24vh)}
}
@media (max-width:620px){
  body{font-size:16px}
  .stats{grid-template-columns:1fr; gap:10px}
  .stat{display:flex; align-items:baseline; gap:12px}
  .stat b{font-size:22px} .stat span{margin-top:0}
  .form{grid-template-columns:minmax(0,1fr)}
  .chap{display:none}
  .flowbox{width:100%}
  #hero{padding-top:calc(var(--nav) + 30vh)}
  #cta{padding-top:calc(var(--nav) + 26vh)}
  .ch{min-height:auto; padding-block:clamp(76px,11vh,110px)}
  .dunes{min-height:88svh}
}
@media (prefers-reduced-motion:reduce){
  :root{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important}
  .js .rv{opacity:1; transform:none}
  .js .w{opacity:1; transform:none}
  .js .msg{display:block}
  #manifest span{opacity:1}
  .flow li{opacity:1}
}