/* Paramus Moving — design system. See DESIGN.md.
   NOT the Mills system: cool paper (not cream), royal blue (not slate navy), gothic display over
   serif body (Mills is the inverse), signal red reserved for the tag device and the primary CTA.
   The numbered inventory tag is the signature — everything accounted for, including the company. */
:root{
  --royal:#24409A;
  --royal-d:#182C6E;
  --ink:#111827;
  --paper:#F7F8FA;
  --steel:#49535F;
  --line:#D8DDE4;
  --red:#C8102E;
  --red-d:#A00D25;
  --kraft:#E9DFCE;
  --kraft-d:#D9C9AC;
  --white:#fff;
  --shadow:0 1px 2px rgba(17,24,39,.05),0 10px 30px rgba(24,44,110,.08);
  --shadow-lg:0 6px 18px rgba(24,44,110,.10),0 26px 60px rgba(24,44,110,.12);
  --r:10px;
  --wrap:1200px;
  --d:"Archivo",system-ui,sans-serif;
  --s:"Source Serif 4",Georgia,serif;
  --m:"IBM Plex Mono",ui-monospace,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:140px}
body{margin:0;background:var(--white);color:var(--ink);
  font:400 17.5px/1.7 var(--s);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--royal);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:var(--d);font-weight:800;color:var(--royal);line-height:1.05;
  letter-spacing:-.01em;margin:0 0 .5em;text-wrap:balance}
h1{font-size:clamp(40px,5.6vw,68px);font-weight:900;font-stretch:106%}
h2{font-size:clamp(28px,3.4vw,42px)}
h3{font-size:20px;letter-spacing:0}
p{margin:0 0 1em}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 26px}
:focus-visible{outline:3px solid var(--red);outline-offset:2px;border-radius:3px}
.skip{position:absolute;left:-9999px;top:0;background:var(--royal);color:#fff;padding:10px 16px}
.skip:focus{left:12px;top:12px;z-index:999}

/* ---------- the tag ---------- */
.tag{display:inline-flex;align-items:center;font:600 12.5px/1 var(--m);letter-spacing:.04em;
  padding:6px 10px;border-radius:6px;white-space:nowrap;
  border:1.5px solid var(--red);color:var(--red);background:#fff;
  box-shadow:2px 2px 0 rgba(200,16,46,.14)}
.tag-line{border-color:rgba(255,255,255,.55);color:#fff;background:transparent;box-shadow:none;
  font-size:11.5px;padding:4px 8px}
.tag-royal{border-color:var(--royal);color:var(--royal);box-shadow:2px 2px 0 rgba(36,64,154,.14)}
.tag-invert{border-color:rgba(255,255,255,.7);color:#fff;background:transparent;box-shadow:none}
a.tag:hover{text-decoration:none;background:var(--red);color:#fff}
a.tag-invert:hover{background:#fff;color:var(--royal)}

/* ---------- buttons ---------- */
.btn{display:inline-block;font:700 15.5px/1 var(--d);letter-spacing:.01em;padding:16px 26px;
  border-radius:8px;border:1.5px solid transparent;cursor:pointer}
.btn:hover{text-decoration:none}
.btn-red{background:var(--red);color:#fff;box-shadow:0 4px 14px rgba(200,16,46,.28)}
.btn-red:hover{background:var(--red-d)}
.btn-royal{background:var(--royal);color:#fff}
.btn-royal:hover{background:var(--royal-d)}
.btn-line{border-color:var(--royal);color:var(--royal);background:transparent}
.btn-line:hover{background:var(--royal);color:#fff}
.btn-ghost{border-color:rgba(255,255,255,.6);color:#fff}
.btn-ghost:hover{background:#fff;color:var(--royal)}

/* ---------- topline + header ---------- */
.topline{background:var(--royal-d);color:#fff;font-family:var(--d);font-size:13px}
.topline-in{display:flex;justify-content:space-between;align-items:center;gap:14px;min-height:44px;
  flex-wrap:wrap;padding-top:5px;padding-bottom:5px}
.tl-tags{display:flex;gap:7px;flex-wrap:wrap}
.tl-r{display:flex;align-items:center;gap:16px}
.tl-hrs{color:rgba(255,255,255,.75)}
.tl-ph{font-weight:800;color:#fff;font-size:15px}
.hd{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.97);
  backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--line)}
.hd-in{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:78px}
.brand{display:flex;align-items:center;gap:12px}
.brand:hover{text-decoration:none}
.brand-mark{display:flex;align-items:center;justify-content:center;width:46px;height:46px;
  background:var(--royal);color:#fff;font:900 26px/1 var(--d);font-style:italic;border-radius:9px;
  box-shadow:3px 3px 0 var(--red)}
.brand-t{display:flex;flex-direction:column;line-height:1.15}
.brand-t b{font:800 20px/1.1 var(--d);color:var(--royal)}
.brand-t i{font:500 11px/1.3 var(--m);font-style:normal;color:var(--steel);letter-spacing:.06em;
  text-transform:uppercase;margin-top:3px}
.nv>ul{display:flex;list-style:none;margin:0;padding:0;gap:2px;font-family:var(--d)}
.nv>ul>li{position:relative}
.nv>ul>li>a{display:block;padding:12px 13px;font-weight:600;font-size:15.5px;color:var(--ink);
  border-radius:8px}
.nv>ul>li>a:hover,.nv>ul>li>a.on{color:var(--royal);background:var(--paper);text-decoration:none}
.nv-home{display:none}
.dd{position:absolute;top:100%;left:0;min-width:250px;background:#fff;border:1px solid var(--line);
  border-radius:10px;box-shadow:var(--shadow-lg);padding:8px;opacity:0;visibility:hidden;
  transform:translateY(6px);transition:.16s ease}
.dd::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.nv>ul>li.has:hover .dd,.nv>ul>li.has:focus-within .dd{opacity:1;visibility:visible;transform:none}
.dd ul{list-style:none;margin:0;padding:0}
.dd a{display:block;padding:10px 12px;border-radius:7px;font-size:15px;color:var(--ink)}
.dd a:hover{background:var(--paper);color:var(--royal);text-decoration:none}
.nv-cta{margin-left:10px}
.burger{display:none;flex-direction:column;justify-content:center;gap:5px;background:none;border:0;
  padding:10px;cursor:pointer;min-width:44px;min-height:44px}
.burger span{width:24px;height:2.5px;background:var(--royal);border-radius:2px}

/* ---------- hero ---------- */
.hero{background:var(--royal);color:#fff;position:relative;overflow:hidden}
/* road-line texture: a single dashed centre line, not a photo we don't have yet */
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.16;
  background-image:repeating-linear-gradient(105deg,transparent 0 46px,rgba(255,255,255,.9) 46px 52px,transparent 52px 240px)}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(900px 600px at 88% 0%,rgba(200,16,46,.35),transparent 62%),
             radial-gradient(700px 500px at 0% 100%,rgba(24,44,110,.8),transparent 66%)}
.hero-in{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr .9fr;gap:56px;
  align-items:center;padding:86px 0 92px}
.hero h1{color:#fff}
.hero .kicker{display:inline-flex;gap:8px;margin-bottom:20px}
.hero-lead{font-size:19px;line-height:1.65;color:rgba(255,255,255,.92);max-width:56ch}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.hero-note{font:500 13.5px/1.5 var(--m);color:rgba(255,255,255,.75);margin-top:20px}
.hero-note a{color:#fff;text-decoration:underline}
.hero-card{background:#fff;border-radius:14px;box-shadow:var(--shadow-lg);padding:30px 28px;
  color:var(--ink)}
.hero-card h2{font-size:21px;margin-bottom:16px}
.hero-card ul{list-style:none;margin:0;padding:0;display:grid;gap:13px}
.hero-card li{display:flex;gap:12px;align-items:flex-start;font-size:16px;line-height:1.55}
.hero-card .tag{flex:0 0 auto;margin-top:1px}
.hero-card .hc-foot{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--line);
  font-size:15px;color:var(--steel)}

/* ---------- sections ---------- */
.sec{padding:84px 0}
.sec-paper{background:var(--paper)}
.sec-royal{background:var(--royal);color:#fff}
.sec-royal h2,.sec-royal h3{color:#fff}
.sec-royal p{color:rgba(255,255,255,.92)}
.sec-kraft{background:var(--kraft)}
.sec-head{max-width:820px;margin-bottom:46px}
.sec-head .tag{margin-bottom:14px}
.sec-lead{font-size:18.5px;color:var(--steel);line-height:1.7}
.sec-royal .sec-lead{color:rgba(255,255,255,.85)}

/* ---------- service cards ---------- */
.svc{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.svc a{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 24px;
  color:var(--ink);display:flex;flex-direction:column;gap:10px;transition:.18s ease;
  position:relative}
.svc a:hover{text-decoration:none;transform:translateY(-3px);box-shadow:var(--shadow-lg);
  border-color:var(--royal)}
.svc h3{margin:0;color:var(--royal)}
.svc p{margin:0;font-size:15.5px;color:var(--steel);flex:1}
.svc .more{font:700 14px var(--d);color:var(--red)}

/* ---------- process steps as tags ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;counter-reset:step}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 24px;
  box-shadow:var(--shadow)}
.step .tag{margin-bottom:14px}
.step h3{color:var(--ink)}
.step p{font-size:15.5px;color:var(--steel);margin:0}

/* ---------- checklist ---------- */
.list{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:16px;max-width:880px}
.list li{display:flex;gap:14px;align-items:flex-start}
.list .tag{flex:0 0 auto;margin-top:2px}
.list b{display:block;font-family:var(--d);font-weight:700;color:var(--royal);margin-bottom:2px}
.list span{font-size:16px;color:var(--steel);line-height:1.6}

/* ---------- forms ---------- */
.frm{background:#fff;border:1px solid var(--line);border-radius:12px;padding:28px 26px;
  box-shadow:var(--shadow)}
.frm label{display:block;font:600 14px var(--d);color:var(--ink);margin-bottom:14px}
.frm input,.frm select,.frm textarea{display:block;width:100%;margin-top:6px;padding:13px 14px;
  font:400 16px var(--s);color:var(--ink);background:#fff;border:1.5px solid #98A2B0;
  border-radius:8px}
.frm input:focus-visible,.frm textarea:focus-visible{outline:3px solid var(--red);outline-offset:1px}
.frm .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.frm .hp{position:absolute;left:-9999px;top:-9999px}
.frm-note{font-size:14px;color:var(--steel);margin:14px 0 0}

/* ---------- footer ---------- */
.ft{background:#0E1830;color:rgba(255,255,255,.85);padding:64px 0 40px;font-size:15.5px}
.ft a{color:rgba(255,255,255,.88)}
.ft-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:44px}
.ft-name{font:800 22px var(--d);color:#fff;margin-bottom:8px}
.ft-line{color:rgba(255,255,255,.75);max-width:44ch}
.ft-ph a{font:800 20px var(--d);color:#fff}
.ft-col h2{font:700 13px var(--d);letter-spacing:.12em;text-transform:uppercase;
  color:var(--kraft-d);margin:0 0 14px}
.ft-col ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.ft-verify{margin-top:44px;padding-top:26px;border-top:1px solid rgba(255,255,255,.16)}
.ft-verify-h{font:600 13.5px var(--m);color:rgba(255,255,255,.7);margin-bottom:10px}
.ft-verify-tags{display:flex;gap:9px;flex-wrap:wrap;margin:0}
.ft-legal{margin-top:26px;font-size:13.5px;color:rgba(255,255,255,.55)}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .hero-in{grid-template-columns:1fr;gap:40px;padding:60px 0 66px}
  .svc,.steps{grid-template-columns:1fr 1fr}
  .ft-grid{grid-template-columns:1fr 1fr}
  .burger{display:flex;position:relative;z-index:80}
  .nv{position:fixed;top:0;right:0;bottom:0;width:min(340px,88vw);background:#fff;
    padding:20px 20px calc(110px + env(safe-area-inset-bottom));overflow-y:auto;
    overscroll-behavior:contain;transform:translateX(105%);visibility:hidden;
    transition:transform .22s ease,visibility .22s;box-shadow:var(--shadow-lg);z-index:70}
  .nv.open{transform:none;visibility:visible}
  .nv-home{display:flex;align-items:center;gap:11px;padding:2px 0 16px 2px;margin:0 52px 8px 0;
    border-bottom:2px solid var(--line)}
  .nv-home span{display:flex;flex-direction:column;line-height:1.15}
  .nv-home b{font:800 18px var(--d);color:var(--royal)}
  .nv-home i{font:500 11px var(--m);font-style:normal;color:var(--steel);text-transform:uppercase}
  .nv>ul{flex-direction:column;gap:0}
  .nv>ul>li>a{padding:14px 8px;font-size:17px;border-bottom:1px solid var(--line);border-radius:0}
  .dd{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;
    min-width:0;padding:2px 0 8px 8px}
  .nv-cta{margin:18px 0 0;width:100%;text-align:center}
}
@media (max-width:640px){
  .topline .tl-hrs,.topline .tl-tags{display:none}
  .topline-in{justify-content:center}
  .svc,.steps,.frm .row,.ft-grid{grid-template-columns:1fr}
  .sec{padding:56px 0}
  h1{font-size:clamp(34px,9vw,44px)}
  .wrap{padding:0 18px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
