:root { --navy:#1e2523; --blue:#176b55; --coral:#e34830; --orange:#dba23a; --cream:#fff8ef; --ink:#252826; --line:#ddd6cc; font-family:"DM Sans",system-ui,sans-serif; color:var(--ink); background:var(--cream); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; }
a { color:inherit; text-decoration:none; }
img { display:block; width:100%; height:100%; object-fit:cover; }
.site-header { position:sticky; top:0; z-index:50; min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:8px 30px; background:rgba(243,242,239,.95); border-bottom:1px solid rgba(37,38,37,.12); backdrop-filter:blur(18px); }
.header-brand img { width:188px; height:auto; object-fit:contain; }
.main-nav { display:flex; align-items:center; gap:22px; font-size:14px; font-weight:600; }
.main-nav a { white-space:nowrap; }
.header-cta { border-radius:8px; padding:13px 18px; background:var(--coral); color:#fff; }
.menu-toggle { display:none; min-height:40px; border:1px solid var(--line); border-radius:8px; padding:0 14px; background:#fff; font:inherit; font-weight:700; }
.hero-shell { padding:22px; background:var(--cream); }
.hero-media { position:relative; min-height:calc(100vh - 120px); overflow:hidden; border-radius:8px; color:#fff; }
.hero-media>img,.hero-overlay { position:absolute; inset:0; }
.hero-overlay { background:rgba(16,22,20,.58); }
.hero-top { position:absolute; top:30px; right:34px; left:34px; z-index:2; display:flex; align-items:center; justify-content:flex-end; }
.hero-top img { width:200px; height:auto; padding:7px; background:rgba(243,242,239,.9); object-fit:contain; }
.hero-top a { border-radius:8px; padding:20px 30px; background:var(--coral); font-weight:700; text-transform:uppercase; }
.hero-content { position:absolute; right:6%; bottom:15%; left:6%; z-index:2; max-width:930px; }
.hero-content>p:first-child,.section-heading>p,.quote-intro>p { margin:0 0 14px; color:var(--orange); font-size:13px; font-weight:700; }
.hero-content h1 { margin:0; font-size:64px; line-height:1.02; letter-spacing:0; }
.hero-actions { display:flex; gap:14px; margin-top:34px; }
.hero-actions a { min-height:60px; display:inline-flex; align-items:center; justify-content:center; border-radius:8px; padding:0 28px; font-weight:700; text-transform:uppercase; }
.phone-button { background:var(--navy); }
.primary-button { background:var(--coral); }
.benefits-section,.missions-section,.faq-section { padding:110px max(28px,calc((100% - 1160px)/2)); }
.section-heading { max-width:850px; margin-bottom:56px; }
.section-heading h2 { margin:0; font-size:55px; line-height:1.04; letter-spacing:0; }
.section-heading h2 span { color:var(--blue); }
.benefit-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.benefit-grid article { min-height:230px; border:1px solid var(--line); border-radius:8px; padding:28px; background:#fff; }
.benefit-grid strong { color:var(--coral); }
.benefit-grid h3 { margin:26px 0 10px; font-size:23px; }
.benefit-grid p,.mission-list p { margin:0; color:#70716d; font-size:16px; line-height:1.65; }
.section-button { min-height:56px; display:inline-flex; align-items:center; justify-content:center; margin-top:34px; border-radius:8px; padding:0 24px; background:var(--coral); color:#fff; font-weight:700; text-transform:uppercase; }
.trust-section { padding:48px 28px; background:var(--blue); color:#fff; text-align:center; }
.trust-section p { margin:0 0 24px; font-size:14px; font-weight:700; text-transform:uppercase; }
.trust-section div { display:flex; justify-content:center; gap:42px; flex-wrap:wrap; }
.trust-section strong { font-size:19px; }
.trust-section .client-list { width:min(1160px,100%); margin:0 auto; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; align-items:stretch; }
.trust-section .client-logo { width:100%; min-width:0; max-width:none; height:104px; display:grid; place-items:center; overflow:hidden; border:1px solid rgba(255,255,255,.22); border-radius:7px; padding:20px 16px; background:#fff; }
.trust-section .client-logo img { display:block; width:100%; max-width:100%; height:100%; max-height:100%; object-fit:contain; object-position:center; }
.trust-section .client-logo:nth-child(2) img,
.trust-section .client-logo:nth-child(6) img { max-width:88%; }
.trust-section .client-wordmark strong { color:#202624; font-size:17px; line-height:1.1; letter-spacing:0; }
.trust-section .venue-wordmark strong { max-width:150px; font-size:15px; }
.offers-section { padding:110px max(28px,calc((100% - 1160px)/2)); background:var(--navy); color:#fff; }
.section-heading.light h2 span { color:#91c8b8; }
.offer-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.offer-grid article { border-radius:8px; overflow:hidden; background:#29312f; }
.offer-grid img { height:270px; }
.offer-grid article>div { min-height:190px; padding:24px; }
.offer-grid p { margin:0 0 10px; color:var(--orange); font-size:12px; font-weight:700; }
.offer-grid h3 { margin:0 0 10px; font-size:24px; }
.offer-grid span { color:#c5c6cf; line-height:1.5; }
.light-button { background:var(--orange); color:var(--navy); }
.onepage-catalogue { padding:110px max(28px,calc((100% - 1160px)/2)); background:var(--cream); }
.onepage-catalogue .finder-panel { margin-bottom:28px; border:1px solid var(--line); border-radius:8px; padding:16px; background:#fff; box-shadow:none; }
.onepage-catalogue .truck-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.onepage-catalogue .truck-card { border:0; border-radius:8px; box-shadow:0 14px 34px rgba(23,24,39,.09); }
.onepage-catalogue .truck-media { height:240px; }
.onepage-catalogue .truck-body { padding:22px; }
.onepage-catalogue .truck-body h3 { font-size:24px; }
.onepage-catalogue .card-action { border-radius:8px; }
.mission-list { display:grid; gap:0; }
.mission-list article { display:grid; grid-template-columns:80px 1fr; gap:22px; border-top:1px solid var(--line); padding:36px 0; }
.mission-list article:last-child { border-bottom:1px solid var(--line); }
.mission-list strong { color:var(--blue); font-size:36px; }
.mission-list h3 { margin:0 0 10px; font-size:27px; }
.steps-section { display:grid; grid-template-columns:1fr 1fr; min-height:760px; background:var(--navy); color:#fff; }
.steps-photo { min-height:680px; }
.steps-content { padding:80px 7%; }
.steps-content .section-heading { margin-bottom:34px; }
.steps-content ol { margin:0; padding:0; list-style:none; }
.steps-content li { display:grid; grid-template-columns:48px 1fr; gap:18px; border-top:1px solid rgba(255,255,255,.18); padding:22px 0; }
.steps-content li:last-child { border-bottom:1px solid rgba(255,255,255,.18); }
.steps-content li>strong { width:38px; height:38px; display:grid; place-items:center; border-radius:50%; background:var(--orange); color:var(--navy); }
.steps-content h3 { margin:0 0 6px; font-size:20px; }
.steps-content li p { margin:0; color:#c5c6cf; line-height:1.5; }
.faq-section { background:#fff; }
.sub-hero { padding:100px max(28px,calc((100% - 1160px)/2)); background:var(--navy); color:#fff; }
.sub-hero>p { margin:0 0 14px; color:var(--orange); font-size:13px; font-weight:700; }
.sub-hero h1 { max-width:900px; margin:0 0 22px; font-size:58px; line-height:1.03; letter-spacing:0; }
.sub-hero>span { display:block; max-width:760px; color:#c9cad2; font-size:18px; line-height:1.65; }
.quote-hero { background:var(--blue); }
.quote-page { padding-top:80px; }
.service-points { display:grid; gap:12px; margin:30px 0 0; padding:0; list-style:none; }
.service-points li { border-left:3px solid var(--orange); padding:5px 0 5px 14px; font-weight:700; }
.standalone-steps { min-height:720px; }
.faq-page { min-height:580px; }
.faq-list { max-width:900px; }
.faq-list details { border-top:1px solid var(--line); padding:23px 0; }
.faq-list details:last-child { border-bottom:1px solid var(--line); }
.faq-list summary { cursor:pointer; font-size:19px; font-weight:700; }
.faq-list p { max-width:720px; color:#70716d; line-height:1.65; }
.quote-section { display:grid; grid-template-columns:.8fr 1.2fr; gap:60px; padding:100px max(28px,calc((100% - 1160px)/2)); background:var(--blue); color:#fff; }
.quote-intro { align-self:start; position:sticky; top:108px; }
.quote-intro h2 { margin:0 0 22px; font-size:43px; line-height:1.05; letter-spacing:0; }
.quote-intro span { color:#dce9e4; line-height:1.65; }
.quote-form { display:grid; gap:14px; border-radius:8px; padding:32px; background:#fff; color:var(--ink); }
.form-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
label { display:grid; gap:6px; color:#696a67; font-size:13px; font-weight:700; }
input,select,textarea { width:100%; border:1px solid #d1d1cc; border-radius:7px; padding:12px; background:#fff; color:var(--ink); font:inherit; }
.consent { display:flex; gap:9px; align-items:flex-start; font-weight:500; line-height:1.4; }
.consent input { width:auto; margin-top:3px; }
.quote-form button { min-height:54px; border:0; border-radius:8px; background:var(--coral); color:#fff; font:inherit; font-weight:700; text-transform:uppercase; }
.quote-form>p { min-height:22px; margin:0; color:#176b55; font-weight:700; }
footer { display:flex; align-items:center; justify-content:space-between; gap:30px; padding:38px max(28px,calc((100% - 1160px)/2)); background:#131816; color:#d0d6d3; }
footer img { width:190px; height:auto; padding:7px; background:var(--cream); object-fit:contain; }
footer div { display:flex; gap:18px; }
.onepage-footer { display:block; padding:0; background:#131816; color:#d0d6d3; }
.onepage-footer .footer-main { width:min(1160px,calc(100% - 56px)); margin:0 auto; display:grid; grid-template-columns:1.5fr .7fr .7fr; gap:72px; padding:70px 0 54px; }
.onepage-footer .footer-brand-block { display:block; }
.onepage-footer .footer-brand-block img { width:185px; height:auto; margin-bottom:24px; padding:7px; background:var(--cream); object-fit:contain; }
.onepage-footer .footer-brand-block p { max-width:430px; margin:0 0 24px; color:#aeb0ba; font-size:16px; line-height:1.65; }
.onepage-footer .footer-cta { min-height:48px; display:inline-flex; align-items:center; justify-content:center; border-radius:8px; padding:0 20px; background:var(--coral); color:#fff; font-weight:700; }
.onepage-footer .footer-column { display:grid; align-content:start; gap:14px; }
.onepage-footer .footer-column strong { margin-bottom:7px; color:var(--orange); font-size:13px; text-transform:uppercase; }
.onepage-footer .footer-column a { color:#e1e2e6; font-size:15px; }
.onepage-footer .footer-column a:hover { color:#fff; }
.onepage-footer .footer-bottom { width:min(1160px,calc(100% - 56px)); margin:0 auto; display:flex; justify-content:space-between; gap:24px; border-top:1px solid rgba(255,255,255,.13); padding:24px 0 30px; color:#8e9099; font-size:13px; }

/* Charbon premium: dark depth with warm, legible accents. */
.charbon-premium { background:#343b39; color:#f7f5ef; }
.charbon-premium::before { content:""; position:fixed; inset:0; z-index:0; pointer-events:none; background:#343b39; }
.charbon-premium>header,
.charbon-premium>main,
.charbon-premium>footer { position:relative; z-index:1; }
@keyframes premium-shape-drift {
  0%,100% { transform:translate3d(-8%,0,0) rotate(-3deg); }
  50% { transform:translate3d(10%,4%,0) rotate(2deg); }
}
@keyframes premium-shape-drift-reverse {
  0%,100% { transform:translate3d(12%,4%,0) rotate(2deg); }
  50% { transform:translate3d(-10%,-3%,0) rotate(-2deg); }
}
.charbon-premium .site-header { background:rgba(47,55,52,.94); border-bottom-color:rgba(255,255,255,.14); color:#f7f5ef; }
.charbon-premium .main-nav a:not(.header-cta) { color:#f7f5ef; }
.charbon-premium .header-brand img { padding:0; background:transparent; }
.charbon-premium .hero-shell { background:rgba(52,59,57,.88); }
.charbon-premium .benefits-section,
.charbon-premium .faq-section { background:rgba(52,59,57,.88); }
.charbon-premium .missions-section,
.charbon-premium .onepage-catalogue { background:rgba(59,68,65,.9); }
.charbon-premium .benefits-section,
.charbon-premium .faq-section,
.charbon-premium .missions-section,
.charbon-premium .onepage-catalogue,
.charbon-premium .offers-section,
.charbon-premium .steps-section {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background-image:none;
  animation:none;
}
.charbon-premium .benefits-section::before,
.charbon-premium .faq-section::before,
.charbon-premium .missions-section::before,
.charbon-premium .onepage-catalogue::before,
.charbon-premium .offers-section::before,
.charbon-premium .steps-section::before { content:""; position:absolute; z-index:-1; top:-28%; right:-22%; width:78%; height:150%; pointer-events:none; clip-path:polygon(18% 0,100% 12%,82% 100%,0 78%); background:rgba(145,200,184,.09); animation:premium-shape-drift 18s ease-in-out infinite; }
.charbon-premium .benefits-section::after,
.charbon-premium .faq-section::after,
.charbon-premium .missions-section::after,
.charbon-premium .onepage-catalogue::after,
.charbon-premium .offers-section::after,
.charbon-premium .steps-section::after { content:""; position:absolute; z-index:-1; bottom:-40%; left:-24%; width:62%; height:100%; pointer-events:none; clip-path:polygon(0 28%,88% 0,100% 70%,18% 100%); background:rgba(219,162,58,.055); animation:premium-shape-drift-reverse 22s ease-in-out infinite; }
.charbon-premium .missions-section::before,
.charbon-premium .offers-section::before { right:auto; left:-18%; animation-name:premium-shape-drift-reverse; }
.charbon-premium .missions-section::after,
.charbon-premium .offers-section::after { right:-20%; left:auto; animation-name:premium-shape-drift; }
.charbon-premium .section-heading h2 span,
.charbon-premium .mission-list strong { color:#91c8b8; }
.charbon-premium .benefit-grid article { border-color:rgba(255,255,255,.17); background:#424b48; }
.charbon-premium .benefit-grid p,
.charbon-premium .mission-list p,
.charbon-premium .faq-list p { color:#e0e5e2; }
.charbon-premium .faq-list summary { color:#fff; }
.charbon-premium .mission-list article,
.charbon-premium .faq-list details { border-color:rgba(255,255,255,.15); }
.charbon-premium .onepage-catalogue .finder-panel { border-color:rgba(255,255,255,.17); background:#46504c; }
.charbon-premium .onepage-catalogue .finder-panel label { color:#f1f3f1; }
.charbon-premium .onepage-catalogue .truck-card { border:1px solid rgba(255,255,255,.13); background:#46504c; box-shadow:0 18px 38px rgba(0,0,0,.16); }
.charbon-premium .onepage-catalogue .truck-body { background:#46504c; }
.charbon-premium .onepage-catalogue .truck-body h3 { color:#f4f2ec; }
.charbon-premium .onepage-catalogue .truck-body p { color:#e0e5e2; }
.charbon-premium .onepage-catalogue .truck-meta { color:#b8dece; }
.charbon-premium .onepage-catalogue .truck-meta span { background:#34443e; }
.charbon-premium .onepage-catalogue .card-action { border-color:#91c8b8; background:transparent; color:#d7eee5; }
.charbon-premium .onepage-catalogue .card-action:hover { background:#91c8b8; color:#29302e; }
.charbon-premium .onepage-catalogue .empty-state { border-color:rgba(255,255,255,.22); background:#46504c; color:#d2d8d5; }
.charbon-premium .offers-section,
.charbon-premium .steps-section { background:rgba(45,53,50,.92); }
.charbon-premium .offer-grid article { background:#3d4743; }
.charbon-premium .offer-grid span,
.charbon-premium .steps-content li p { color:#e0e5e2; }
.charbon-premium .trust-section,
.charbon-premium .quote-section { background:rgba(49,89,78,.94); }
.charbon-premium .quote-form { box-shadow:0 24px 60px rgba(0,0,0,.22); }
.charbon-premium .onepage-footer { border-top:1px solid rgba(255,255,255,.1); background:#252c29; }
.charbon-premium .onepage-footer .footer-brand-block img { padding:0; background:transparent; }
@media (prefers-reduced-motion:reduce) {
  .charbon-premium::before,
  .charbon-premium .benefits-section::before,
  .charbon-premium .benefits-section::after,
  .charbon-premium .faq-section::before,
  .charbon-premium .faq-section::after,
  .charbon-premium .missions-section::before,
  .charbon-premium .missions-section::after,
  .charbon-premium .onepage-catalogue::before,
  .charbon-premium .onepage-catalogue::after,
  .charbon-premium .offers-section::before,
  .charbon-premium .offers-section::after,
  .charbon-premium .steps-section::before,
  .charbon-premium .steps-section::after { animation:none; }
}
@media (max-width:900px) {
  .site-header { padding:9px 16px; }
  .header-brand img { width:145px; }
  .menu-toggle { display:inline-flex; align-items:center; margin-left:auto; }
  .main-nav { position:absolute; top:100%; right:0; left:0; display:none; align-items:stretch; padding:14px 16px 18px; background:var(--cream); box-shadow:0 18px 38px rgba(30,37,35,.18); }
  .charbon-premium .main-nav { background:#343b39; }
  .charbon-premium .menu-toggle { border-color:rgba(255,255,255,.2); background:#46504c; color:#fff; }
  .main-nav.is-open { display:grid; }
  .main-nav a { padding:10px 0; }
  .header-cta { padding:12px 14px !important; }
  .hero-shell { padding:0; }
  .hero-media { min-height:800px; border-radius:0; }
  .hero-top { display:none; }
  .hero-content { bottom:16%; }
  .hero-content h1 { font-size:48px; }
  .hero-actions { flex-direction:column; }
  .hero-actions a { width:100%; }
  .benefits-section,.missions-section,.faq-section,.offers-section { padding:78px 18px; }
  .onepage-catalogue { padding:78px 18px; }
  .onepage-catalogue .truck-grid { grid-template-columns:1fr; }
  .sub-hero { padding:72px 18px; }
  .sub-hero h1 { font-size:42px; }
  .section-heading h2 { font-size:40px; }
  .benefit-grid,.offer-grid,.steps-section,.quote-section { grid-template-columns:1fr; }
  .trust-section .client-list { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .trust-section .client-logo { height:94px; padding:17px 13px; }
  .steps-photo { min-height:430px; }
  .steps-content { padding:70px 18px; }
  .quote-section { gap:40px; padding:78px 18px; }
  .quote-intro { position:static; }
  .quote-form { padding:24px; }
  .form-row { grid-template-columns:1fr; }
  footer { align-items:flex-start; flex-direction:column; }
  footer div { flex-direction:column; gap:10px; }
  .onepage-footer .footer-main { width:calc(100% - 36px); grid-template-columns:1fr; gap:40px; padding:54px 0 42px; }
  .onepage-footer .footer-bottom { width:calc(100% - 36px); flex-direction:column; gap:10px; }
}
@media (max-width:560px) {
  .trust-section { padding-right:16px; padding-left:16px; }
  .trust-section .client-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .trust-section .client-logo { height:86px; padding:16px 12px; }
  .trust-section .client-wordmark strong { font-size:14px; }
  .trust-section .venue-wordmark strong { font-size:12px; }
}
