/* ===========================================================
   CallyFaith Nigeria Ltd — design system v2
   =========================================================== */
:root{
  --cf-red:#CE1B28;
  --cf-red-dark:#93121c;
  --cf-red-bright:#ff3b48;
  --cf-ink:#0B0C0E;
  --cf-ink-2:#16181c;
  --cf-ink-soft:#4a4f57;
  --cf-bg:#F8F6F2;
  --cf-bg-alt:#EFEAE1;
  --cf-blue:#1E73BE;
  --cf-white:#ffffff;
  --cf-border:#e4ded2;
  --font-heading:'Archivo', system-ui, sans-serif;
  --font-body:'IBM Plex Sans', system-ui, sans-serif;
  --shadow-sm:0 2px 10px rgba(11,12,14,.06);
  --shadow-md:0 16px 40px rgba(11,12,14,.12);
  --shadow-lg:0 30px 70px rgba(11,12,14,.22);
  --radius:12px;
  --radius-sm:9px;
  --ease:cubic-bezier(.16,1,.3,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
html, body{overflow-x:hidden; max-width:100%;}
body{
  font-family:var(--font-body);
  color:var(--cf-ink);
  background:var(--cf-bg);
  line-height:1.6;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
}
p{line-height:1.7;}
h1,h2,h3,h4,h5,h6{
  font-family:var(--font-heading);
  font-weight:700;
  color:var(--cf-ink);
  letter-spacing:-.02em;
  line-height:1.08;
}
a{color:var(--cf-red); text-decoration:none;}
a:hover{color:var(--cf-red-dark);}
img{display:block;}

/* Noise-grain texture for dark sections — cheap, no image asset needed */
.grain{position:relative;}
.grain::before{
  content:''; position:absolute; inset:0; pointer-events:none; z-index:1; opacity:.05; mix-blend-mode:overlay;
  background-image:radial-gradient(rgba(255,255,255,.9) 1px, transparent 1px);
  background-size:3px 3px;
}

/* ---------- Preloader ---------- */
.preloader{
  position:fixed; inset:0; z-index:9999; background:var(--cf-ink);
  display:flex; align-items:center; justify-content:center;
  opacity:1; transition:opacity .5s ease, visibility .5s ease;
}
.preloader.is-hidden{opacity:0; visibility:hidden; pointer-events:none;}
.preloader-inner{display:flex; flex-direction:column; align-items:center; gap:1.25rem;}
.preloader-logo{height:48px; width:auto; animation:preloaderPulse 1.6s ease-in-out infinite;}
.preloader-bar{width:140px; height:3px; border-radius:999px; background:rgba(255,255,255,.12); overflow:hidden;}
.preloader-bar span{
  display:block; width:40%; height:100%; border-radius:999px; background:var(--cf-red-bright);
  animation:preloaderSlide 1.2s ease-in-out infinite;
}
@keyframes preloaderPulse{0%,100%{opacity:1; transform:scale(1);} 50%{opacity:.7; transform:scale(.94);}}
@keyframes preloaderSlide{
  0%{transform:translateX(-120%);}
  50%{transform:translateX(80%);}
  100%{transform:translateX(280%);}
}

.skip-link{
  position:absolute; left:-999px; top:0; background:var(--cf-ink); color:#fff;
  padding:.75rem 1.25rem; z-index:2000; border-radius:0 0 8px 0;
}
.skip-link:focus{left:0;}

/* ---------- Topbar ---------- */
.topbar{background:var(--cf-ink); color:#cfd3d8; font-size:.85rem;}
.topbar-inner{display:flex; justify-content:space-between; align-items:center; padding:.5rem 0;}
.topbar-contacts a, .topbar-contacts span{color:#cfd3d8; margin-right:1.5rem;}
.topbar-contacts a:hover{color:#fff;}
.topbar-social a{color:#cfd3d8; margin-left:.9rem; font-size:1rem;}
.topbar-social a:hover{color:var(--cf-red);}

/* ---------- Header / nav ---------- */
.site-header{
  background:rgba(248,246,242,.85);
  backdrop-filter:saturate(180%) blur(10px);
  position:sticky; top:0; z-index:1030;
  box-shadow:0 1px 0 var(--cf-border);
  transition:background .35s var(--ease), box-shadow .35s var(--ease);
}
.site-header.is-scrolled{box-shadow:var(--shadow-sm);}

/* Transparent-over-hero mode (home page only): nav floats over the dark hero
   with light text until the user scrolls, then crossfades to the normal solid bar. */
body.has-hero-nav .site-header{
  background:transparent; box-shadow:none; position:fixed; top:0; left:0; right:0;
}
body.has-hero-nav .site-header .navbar-nav .nav-link{color:#fff;}
body.has-hero-nav .site-header .navbar-toggler-icon{filter:invert(1);}
body.has-hero-nav .site-header.is-scrolled{
  background:rgba(248,246,242,.9); box-shadow:var(--shadow-sm);
}
body.has-hero-nav .site-header.is-scrolled .navbar-nav .nav-link{color:var(--cf-ink);}
body.has-hero-nav .site-header.is-scrolled .navbar-toggler-icon{filter:none;}
body.has-hero-nav .site-header .navbar-nav .nav-link.active,
body.has-hero-nav .site-header .navbar-nav .nav-link:hover{color:var(--cf-red-bright);}
body.has-hero-nav main{padding-top:0;}
body.has-hero-nav .topbar{display:none !important;}

.navbar{padding:.85rem 0;}
.navbar-nav{gap:.1rem;}
.navbar-nav .nav-link{
  position:relative; font-family:var(--font-heading); font-weight:600; font-size:.82rem;
  letter-spacing:.05em; text-transform:uppercase;
  color:var(--cf-ink); padding:.6rem .85rem !important; transition:color .2s ease;
}
.navbar-nav .nav-link::after{
  content:''; position:absolute; left:.85rem; right:.85rem; bottom:.15rem; height:2px;
  background:var(--cf-red); transform:scaleX(0); transform-origin:left; transition:transform .25s var(--ease);
}
.navbar-nav .nav-link.active, .navbar-nav .nav-link:hover{color:var(--cf-red);}
.navbar-nav .nav-link.active::after, .navbar-nav .nav-link:hover::after{transform:scaleX(1);}
.navbar-nav .nav-item.dropdown .nav-link::after{display:none;}
.nav-cta-divider{width:1px; height:26px; background:var(--cf-border); margin:0 .5rem;}
.dropdown-menu{border:none; box-shadow:var(--shadow-md); border-radius:var(--radius-sm); padding:.5rem;}
.dropdown-item{border-radius:6px; padding:.55rem .9rem; font-weight:500; font-size:.92rem;}
.dropdown-item:hover, .dropdown-item:focus{background:var(--cf-bg); color:var(--cf-red);}

/* ---------- Mobile nav: custom animated toggler + full-screen menu ----------
   A dropdown card reads as "styled Bootstrap default" no matter how much you
   tune it. A full-screen panel is a deliberate, considered piece of UI. */
.navbar-toggler-bars{position:relative; width:22px; height:16px; display:block;}
.navbar-toggler-bars span{
  position:absolute; left:0; width:100%; height:2px; border-radius:2px; background:var(--cf-ink);
  transition:transform .3s var(--ease), opacity .2s ease, top .3s var(--ease), background .2s ease;
}
.navbar-toggler-bars span:nth-child(1){top:0;}
.navbar-toggler-bars span:nth-child(2){top:7px;}
.navbar-toggler-bars span:nth-child(3){top:14px;}
body.has-hero-nav .site-header:not(.is-scrolled) .navbar-toggler-bars span{background:#fff;}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-bars span{background:#fff;}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-bars span:nth-child(1){top:7px; transform:rotate(45deg);}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-bars span:nth-child(2){opacity:0;}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-bars span:nth-child(3){top:7px; transform:rotate(-45deg);}

@media (max-width:991.98px){
  .navbar-toggler{border:0; background:transparent; padding:.4rem; box-shadow:none !important; z-index:1021; position:relative;}

  .navbar-collapse{
    position:fixed; inset:0; z-index:1015; background:var(--cf-ink);
    padding:6.5rem 1.75rem 2.5rem; flex-direction:column; overflow-y:auto;
    /* Bootstrap's collapse JS animates height via an inline style, which fights a
       fixed full-screen panel — pin an explicit viewport height instead and
       animate opacity/visibility for the show/hide transition. */
    height:100vh !important; height:100dvh !important;
    opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s ease;
  }
  .navbar-collapse.show, .navbar-collapse.collapsing{opacity:1; visibility:visible; display:flex !important;}
  .navbar-nav{flex:1; gap:0; counter-reset:navitem;}
  .navbar-nav .nav-item{border-bottom:1px solid rgba(255,255,255,.12);}
  .navbar-nav .nav-item:last-of-type{border-bottom:none;}
  .navbar-nav .nav-link{
    counter-increment:navitem;
    font-size:1.6rem; font-weight:700; padding:1rem 0 !important;
    color:#fff !important; display:flex; align-items:baseline; gap:.85rem;
  }
  .navbar-nav .nav-link::before{
    content:counter(navitem, decimal-leading-zero); font-family:var(--font-heading); font-weight:700;
    font-size:.85rem; letter-spacing:.03em; color:var(--cf-red-bright);
  }
  .navbar-nav .nav-link::after{display:none;}
  .navbar-nav .nav-link.active{color:var(--cf-red-bright) !important;}

  .dropdown-menu{
    position:static !important; box-shadow:none; border-radius:0; background:transparent;
    padding:0 0 .85rem 2.15rem; margin:0;
  }
  .dropdown-item{color:#c7cbd1; font-size:1rem; padding:.5rem 0; background:transparent;}
  .dropdown-item:hover, .dropdown-item:focus{background:transparent; color:#fff;}
  .dropdown-divider{border-color:rgba(255,255,255,.15);}

  .nav-cta-divider{display:none;}
  li.nav-item.ms-lg-2{
    margin-top:1.5rem; padding-top:1.5rem; border-top:1px solid rgba(255,255,255,.12); border-bottom:none;
  }
  li.nav-item.ms-lg-2 .btn-brand{display:flex; justify-content:center; width:100%;}

  .mobile-nav-contact{margin-top:1.5rem; display:flex; flex-direction:column; gap:.65rem;}
  .mobile-nav-contact a{
    color:#9aa0a7; font-size:.9rem; display:flex; align-items:center; gap:.6rem; text-decoration:none;
  }
  .mobile-nav-contact a:hover{color:#fff;}
}

.btn-brand, .btn-outline-brand, .btn-light-outline{
  font-family:var(--font-heading); font-weight:700; font-size:.85rem;
  letter-spacing:.03em; border-radius:var(--radius-sm); display:inline-flex; align-items:center;
  padding:.8rem 1.5rem; line-height:1; border:1.5px solid transparent;
}
.btn-brand i, .btn-outline-brand i, .btn-light-outline i{transition:transform .25s var(--ease);}
.btn-brand:hover i, .btn-outline-brand:hover i, .btn-light-outline:hover i{transform:translateX(3px);}

.btn-brand{
  position:relative; background:var(--cf-red); color:#fff; border-color:var(--cf-red);
  box-shadow:inset 0 0 0 0 #000;
  transition:background .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.btn-brand:hover{background:var(--cf-red-dark); border-color:var(--cf-red-dark); color:#fff; box-shadow:var(--shadow-md);}
.btn-outline-brand{
  border-color:var(--cf-ink); color:var(--cf-ink);
  transition:background .2s ease, color .2s ease;
}
.btn-outline-brand:hover{background:var(--cf-ink); color:#fff;}
.btn-light-outline{
  border-color:rgba(255,255,255,.5); color:#fff;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.btn-light-outline:hover{background:#fff; color:var(--cf-ink); border-color:#fff;}

/* Magnetic wrapper: JS nudges the inner element toward the cursor within this box */
.magnetic{display:inline-block;}
.magnetic a, .magnetic button{will-change:transform;}

/* ---------- Hero (full-bleed cinematic) ---------- */
.hero{
  position:relative; overflow:hidden; color:#fff;
  min-height:100vh; display:flex; flex-direction:column; justify-content:flex-end;
  background:var(--cf-ink);
}
.hero-media{position:absolute; inset:0; z-index:0;}
.hero-media img{width:100%; height:100%; object-fit:cover; object-position:center 35%;}
.hero-media::after{
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(11,12,14,.55) 0%, rgba(11,12,14,.35) 30%, rgba(11,12,14,.75) 78%, #0B0C0E 100%),
    linear-gradient(90deg, rgba(11,12,14,.92) 0%, rgba(11,12,14,.35) 55%, rgba(11,12,14,.15) 100%);
}
.hero-inner{position:relative; z-index:2; padding:9rem 0 3.5rem;}
.hero-eyebrow{
  display:flex; align-items:center; gap:.6rem; color:#fff; font-weight:700; font-size:.78rem;
  letter-spacing:.14em; text-transform:uppercase; max-width:100%;
}
.hero-eyebrow span{min-width:0;}
.hero-eyebrow::before{content:''; width:28px; height:2px; background:var(--cf-red-bright); display:inline-block;}
.hero-title{
  font-size:clamp(2.6rem, 7vw, 5.6rem); color:#fff; margin:1.25rem 0 1.4rem; line-height:.98;
  letter-spacing:-.03em; max-width:16ch;
}
.hero-title .hero-rotate-group{white-space:nowrap;}
.hero-title .hero-rotate{
  color:var(--cf-red-bright); position:relative; display:inline-block; transition:opacity .25s ease;
}
.hero-lede{color:#c7cbd1; font-size:1.15rem; max-width:520px; line-height:1.6;}
.hero-actions{margin-top:2.25rem;}
.hero-scroll-cue{
  position:absolute; right:2.5rem; bottom:2.5rem; z-index:2; display:flex; align-items:center; gap:.75rem;
  color:#9aa0a7; font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; writing-mode:vertical-rl;
}
.hero-scroll-cue .line{width:1px; height:56px; background:linear-gradient(#fff, transparent); animation:scrollcue 2.2s ease-in-out infinite;}
@keyframes scrollcue{0%{transform:scaleY(0); transform-origin:top;} 50%{transform:scaleY(1); transform-origin:top;} 51%{transform-origin:bottom;} 100%{transform:scaleY(0); transform-origin:bottom;}}

/* Marquee ticker strip directly under the hero */
.marquee-strip{background:var(--cf-red); color:#fff; overflow:hidden; position:relative; z-index:2; margin-top:1rem;}
.marquee-track{display:flex; width:max-content; animation:marquee 28s linear infinite;}
.marquee-track span{
  display:inline-flex; align-items:center; white-space:nowrap; padding:.75rem 2rem;
  font-family:var(--font-heading); font-weight:700; font-size:.85rem; letter-spacing:.1em; text-transform:uppercase;
}
.marquee-track span::after{content:'•'; margin-left:2rem; opacity:.6;}
@keyframes marquee{from{transform:translateX(0);} to{transform:translateX(-50%);}}

/* ---------- Stats band (full-width dark) ---------- */
.stats-band{background:var(--cf-ink); color:#fff; padding:4rem 0;}
.stats-band .stat-block{text-align:center; padding:0 1rem; position:relative;}
.stats-band .stat-block:not(:last-child)::after{
  content:''; position:absolute; right:0; top:10%; bottom:10%; width:1px; background:rgba(255,255,255,.12);
}
.hero-stat-num{font-family:var(--font-heading); font-weight:800; font-size:clamp(2.2rem,4vw,3.4rem); color:#fff; letter-spacing:-.02em;}
.hero-stat-label{color:#9aa0a7; font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; margin-top:.35rem;}

/* ---------- Sections ---------- */
.section{padding:5rem 0;}
.section-alt{background:var(--cf-bg-alt);}
.section-dark{background:var(--cf-ink); color:#e6e8ea;}
.section-dark h1,.section-dark h2,.section-dark h3,.section-dark h4{color:#fff;}
.eyebrow{
  display:inline-block; font-family:var(--font-heading); font-weight:700; font-size:.8rem;
  letter-spacing:.08em; text-transform:uppercase; color:var(--cf-red); margin-bottom:.6rem;
}
.section-title{font-size:clamp(1.7rem, 3vw, 2.4rem); margin-bottom:1rem;}
.section-lede{color:var(--cf-ink-soft); max-width:680px;}

/* ---------- Cards ---------- */
/* Flat at rest (border only, no shadow) — shadow appears only on hover as
   feedback, not as a permanent "floating card" effect used on every element. */
.card-surface{
  background:#fff; border-radius:var(--radius); box-shadow:none;
  border:1px solid var(--cf-border); transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.card-surface:hover{transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:transparent;}

.service-card{
  position:relative; padding:2.1rem 1.75rem 1.9rem; height:100%; overflow:hidden;
}
.service-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--cf-border);
  transition:background .25s ease;
}
.service-card:hover::before{background:var(--cf-red);}
.service-card .service-icon{
  width:52px; height:52px; border-radius:var(--radius-sm); background:rgba(206,27,40,.1); color:var(--cf-red);
  display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:1.25rem;
}
.service-card img.service-thumb{width:100%; height:170px; object-fit:cover; border-radius:var(--radius-sm); margin-bottom:1.25rem;}
.service-card p{line-height:1.55;}

.vehicle-card{
  overflow:hidden; height:100%; display:flex; flex-direction:column; background:#fff;
  border-radius:var(--radius); border:1px solid var(--cf-border); box-shadow:none;
  transition:box-shadow .3s ease, border-color .3s ease;
}
.vehicle-card:hover{box-shadow:var(--shadow-md); border-color:transparent;}
.vehicle-card .vehicle-media{position:relative; aspect-ratio:4/3; overflow:hidden; background:#eee;}
.vehicle-card .vehicle-media img{width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease), filter .5s ease;}
.vehicle-card:hover .vehicle-media img{transform:scale(1.08); filter:brightness(.85);}
.vehicle-card .vehicle-arrow{
  position:absolute; right:1rem; bottom:1rem; width:44px; height:44px; border-radius:50%; background:#fff;
  color:var(--cf-ink); display:flex; align-items:center; justify-content:center; font-size:1.1rem;
  opacity:0; transform:translateY(10px) scale(.85); transition:all .35s var(--ease);
}
.vehicle-card:hover .vehicle-arrow{opacity:1; transform:translateY(0) scale(1);}
.vehicle-card .vehicle-cat{
  color:var(--cf-red); font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em;
  display:block; margin-bottom:.5rem;
}
.vehicle-card .vehicle-body{padding:1.4rem 1.4rem 1.6rem; flex:1; display:flex; flex-direction:column;}
.vehicle-card h3{font-size:1.2rem; margin-bottom:.5rem;}
.vehicle-card p{color:var(--cf-ink-soft); font-size:.92rem; line-height:1.55; flex:1;}
.vehicle-card .vehicle-link{font-family:var(--font-heading); font-weight:700; font-size:.88rem; margin-top:.75rem; display:inline-flex; align-items:center; gap:.4rem;}

.team-card{text-align:center; padding:1.9rem 1.25rem;}
.team-photo{width:112px; height:112px; border-radius:50%; object-fit:cover; margin:0 auto 1.1rem; border:3px solid var(--cf-bg-alt);}
.team-card h3{font-size:1.05rem; margin-bottom:.15rem;}
.team-card p{line-height:1.5;}
.team-position{color:var(--cf-red); font-weight:600; font-size:.88rem; margin-bottom:.6rem;}
.team-social a{color:var(--cf-ink-soft); margin:0 .35rem; font-size:1rem;}
.team-social a:hover{color:var(--cf-red);}

/* ---------- Editorial pull-quote ---------- */
.pull-quote{position:relative; max-width:900px;}
.pull-quote .quote-mark{
  font-family:var(--font-heading); font-size:7rem; line-height:1; color:var(--cf-red); opacity:.25;
  position:absolute; top:-2.5rem; left:-1.5rem; z-index:0; user-select:none;
}
.pull-quote blockquote{
  position:relative; z-index:1; font-family:var(--font-heading); font-weight:600; margin:0;
  font-size:clamp(1.4rem, 2.6vw, 2.1rem); line-height:1.35; letter-spacing:-.01em;
}
.pull-quote figcaption{margin-top:1.5rem; color:var(--cf-ink-soft); font-size:.95rem;}
.pull-quote figcaption strong{color:var(--cf-ink); font-family:var(--font-heading);}

/* ---------- Angled section divider ---------- */
.angle-top{clip-path:polygon(0 3.5vw, 100% 0, 100% 100%, 0 100%);}
.angle-bottom{clip-path:polygon(0 0, 100% 0, 100% calc(100% - 3.5vw), 0 100%);}

/* ---------- Content boxes (migrated content) ---------- */
.content-box h4{font-size:1.2rem; margin-bottom:.6rem;}
.content-box .text-link{display:inline-block; margin-top:.6rem; font-weight:700; font-family:var(--font-heading);}
.icon-list{list-style:none; padding:0; margin:0;}
.icon-list li{display:flex; align-items:flex-start; gap:.75rem; margin-bottom:1rem;}
.icon-list li i{color:var(--cf-red); font-size:1.2rem; margin-top:.15rem;}
.vehicle-features table{width:100%; border-collapse:collapse;}
.vehicle-features table td{padding:.6rem .75rem; border-bottom:1px solid var(--cf-border);}
.vehicle-features table td:first-child{font-weight:600; color:var(--cf-ink-soft); width:45%;}
.vehicle-features .featuresTableWrapper{overflow-x:auto;}

/* ---------- Spec table (structured) ---------- */
.spec-table{width:100%; border-collapse:collapse; background:#fff; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm);}
.spec-table tr:nth-child(odd){background:var(--cf-bg-alt);}
.spec-table td{padding:.75rem 1.1rem; font-size:.94rem;}
.spec-table td:first-child{font-weight:700; color:var(--cf-ink); width:45%;}

/* ---------- Accordion (goals & objectives) ---------- */
.accordion-button{font-family:var(--font-heading); font-weight:700;}
.accordion-button:not(.collapsed){background:rgba(206,27,40,.06); color:var(--cf-red-dark);}
.accordion-button:focus{box-shadow:0 0 0 .2rem rgba(206,27,40,.15);}

/* ---------- Gallery / lightbox ---------- */
.gallery-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(220px,1fr)); gap:1rem;}
.gallery-item{border-radius:var(--radius); overflow:hidden; cursor:pointer; aspect-ratio:4/3; position:relative;}
.gallery-item img{width:100%; height:100%; object-fit:cover; transition:transform .35s ease;}
.gallery-item:hover img{transform:scale(1.08);}
.lightbox-overlay{
  position:fixed; inset:0; background:rgba(10,12,14,.92); z-index:2000;
  display:none; align-items:center; justify-content:center; padding:2rem;
}
.lightbox-overlay.is-open{display:flex;}
.lightbox-overlay img{max-width:90vw; max-height:85vh; border-radius:8px; box-shadow:var(--shadow-lg);}
.lightbox-close, .lightbox-nav{
  position:absolute; background:rgba(255,255,255,.12); color:#fff; border:none; border-radius:50%;
  width:46px; height:46px; font-size:1.4rem; display:flex; align-items:center; justify-content:center;
}
.lightbox-close{top:1.5rem; right:1.5rem;}
.lightbox-nav.prev{left:1.5rem; top:50%; transform:translateY(-50%);}
.lightbox-nav.next{right:1.5rem; top:50%; transform:translateY(-50%);}
.lightbox-nav:hover, .lightbox-close:hover{background:var(--cf-red);}

/* ---------- Forms ---------- */
.form-surface{background:#fff; border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:2rem; border:1px solid var(--cf-border);}
.form-control, .form-select{
  border-radius:8px; border:1.5px solid var(--cf-border); padding:.65rem .9rem; font-size:.95rem;
}
.form-control:focus, .form-select:focus{border-color:var(--cf-red); box-shadow:0 0 0 .2rem rgba(206,27,40,.12);}
.form-label{font-weight:600; font-size:.88rem; margin-bottom:.35rem;}
.form-feedback{border-radius:10px; padding:.9rem 1.1rem; font-size:.92rem; margin-top:1rem;}
.form-feedback.success{background:#e7f6ec; color:#1e7d3c; border:1px solid #bfe6cb;}
.form-feedback.error{background:#fdecec; color:#b3261e; border:1px solid #f6c7c5;}
.honeypot-field{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}

/* ---------- Footer ---------- */
.site-footer{background:var(--cf-ink); color:#c6cad0; padding:4rem 0 1.5rem; margin-top:0;}
.footer-mission{color:#9aa0a7; font-size:.9rem; max-width:360px;}
.footer-heading{color:#fff; font-family:var(--font-heading); font-weight:700; font-size:.9rem; text-transform:uppercase; letter-spacing:.04em; margin-bottom:1rem;}
.footer-links{list-style:none; padding:0; margin:0;}
.footer-links li{margin-bottom:.65rem; font-size:.92rem; color:#9aa0a7;}
.footer-links a{color:#c6cad0;}
.footer-links a:hover{color:var(--cf-red);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1); margin-top:2.5rem; padding-top:1.5rem; font-size:.85rem; color:#787e85; text-align:center;}

/* ---------- WhatsApp FAB ---------- */
.whatsapp-fab{
  position:fixed; bottom:1.5rem; right:1.5rem; width:58px; height:58px; border-radius:50%;
  background:#25D366; color:#fff; display:flex; align-items:center; justify-content:center;
  font-size:1.7rem; box-shadow:var(--shadow-lg); z-index:1040; transition:transform .2s ease;
}
.whatsapp-fab:hover{transform:scale(1.08); color:#fff;}

/* ---------- Breadcrumb ---------- */
.cf-breadcrumb{background:var(--cf-bg-alt); padding:1rem 0;}
.cf-breadcrumb ol{margin:0;}

/* ---------- Utilities ---------- */
.text-brand{color:var(--cf-red) !important;}
.bg-soft{background:var(--cf-bg-alt);}
.rounded-xl{border-radius:var(--radius) !important;}

@media (max-width:991.98px){
  .section{padding:3.5rem 0;}
  .hero{min-height:92vh;}
  .hero-inner{padding:7rem 0 3.5rem;}
  .hero-scroll-cue{display:none;}
  .stats-band .stat-block:not(:last-child)::after{display:none;}
  .stats-band .stat-block{margin-bottom:1.5rem;}
  .pull-quote .quote-mark{font-size:5rem; top:-2rem; left:-.5rem;}
}

@media (max-width:575.98px){
  .hero-title{max-width:none;}

  /* Several labels/captions were sized fine on desktop but drop below
     comfortable reading size on a phone — raise the floor here rather
     than leave them shrunk to their desktop values. */
  body{font-size:16.5px;}
  small, .small{font-size:.9em;}
  .eyebrow, .hero-eyebrow{font-size:.85rem;}
  .hero-stat-label{font-size:.82rem;}
  .vehicle-card .vehicle-cat{font-size:.78rem;}
  .team-position{font-size:.9rem;}
  .footer-links li{font-size:.95rem;}
  .footer-mission{font-size:.92rem;}
  .form-label{font-size:.92rem;}
  .form-feedback{font-size:.95rem;}
  .dropdown-item{font-size:.95rem;}
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
}