/* CQ Forklift Doctor (CAAMS) landing page: tokens and base styles */
@font-face{font-family:"Biryani";src:url(../fonts/biryani-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Biryani";src:url(../fonts/biryani-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Biryani";src:url(../fonts/biryani-800.woff2) format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"Lato";src:url(../fonts/lato-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Lato";src:url(../fonts/lato-700.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  --navy:#252f4c;
  --navy-deep:#1a2238;
  --navy-soft:#34406a;
  --orange:#ef7a1c;
  --orange-hot:#fe6d02;
  --orange-light:#ffab66; /* labels on navy */
  --orange-deep:#bf5508; /* button fill on white, 4.7:1 with white text */
  --orange-ink:#a84f06;   /* orange text on white, 4.6:1 */
  --ink:#1d2333;
  --body:#3c4356;
  --muted:#5f6679;
  --line:#dfe2ea;
  --cream:#f5f4f0;
  --white:#fff;
  --font-head:"Biryani",Arial,sans-serif;
  --font-body:"Lato",Arial,sans-serif;
  --radius:6px;
  --shadow:0 10px 30px rgba(26,34,56,.12);
}

[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);font-size:1.0625rem;line-height:1.65;color:var(--body);background:var(--white)}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
button{cursor:pointer}

h1,h2,h3,h4{font-family:var(--font-head);color:var(--ink);line-height:1.15;margin:0 0 .6em;font-weight:800;letter-spacing:-.01em}
h1{font-size:clamp(2rem,4.2vw,3.25rem)}
h2{font-size:clamp(1.55rem,3vw,2.35rem)}
h3{font-size:1.2rem;font-weight:700}
p{margin:0 0 1em;max-width:640px}
.label{font-family:var(--font-head);font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--orange-ink);margin:0 0 .6rem}

.container{width:100%;max-width:1200px;margin:0 auto;padding:0 1.5rem}
.container--narrow{max-width:860px}
.section{padding:4.25rem 0}
.section--cream{background:var(--cream)}
.section--navy{background:var(--navy);color:rgba(255,255,255,.88)}
.section--navy h2,.section--navy h3{color:#fff}
.section--navy .label{color:var(--orange-light)}
.section__head{text-align:center;margin:0 auto 2.25rem;max-width:760px}
.section__head p,.section__head .label,.section__head h2{max-width:none;margin-left:auto;margin-right:auto}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font-family:var(--font-head);font-weight:800;font-size:1rem;line-height:1;padding:1rem 1.6rem;border-radius:var(--radius);border:2px solid transparent;text-decoration:none;transition:transform .2s,box-shadow .2s,background .2s;white-space:nowrap}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.18)}
.btn--orange{background:var(--orange);color:var(--navy-deep)}
.btn--orange:hover{background:var(--orange-hot)}
.btn--deep{background:var(--orange-deep);color:#fff}
.btn--deep:hover{background:#a84a06}
.btn--white{background:#fff;color:var(--navy)}
.btn--navy{background:var(--navy);color:#fff}
.btn svg{width:18px;height:18px;flex:none}

.fade-up{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.fade-up.visible{opacity:1;transform:none}

@media (max-width:900px){.section{padding:3.5rem 0}}
@media (max-width:600px){
  body{font-size:1rem}
  .section{padding:2.75rem 0}
  .section__head{margin-bottom:1.5rem}
  .container{padding:0 1rem}
  h2{font-size:1.5rem}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.fade-up{opacity:1;transform:none;transition:none}}
