:root { --navy:#213345; --blue:#0075ba; --panel:#0d2948; --soft:#5a6b7d; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:#fff; }
body { margin:0; background:#fff; color:var(--navy); font-family:Inter,Arial,sans-serif; }
.distributor-site { width:min(100%,1536px); margin:0 auto; overflow:hidden; background:#fff; }
.distributor-site > main { padding-top:var(--contact-nav-normal); }
.distributor-hero {
  position:relative;
  height:432px;
  /* The Figma image fill uses the upper part of the source: keep the
     driver's full face and the cab framing rather than centring the crop. */
  background:url("assets/distributor/raw-4.webp") center 18% / cover no-repeat;
}
.distributor-hero::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(9,30,52,.1),rgba(9,30,52,0) 58%); pointer-events:none; }
.distributor-hero-panel { position:absolute; z-index:1; top:78px; right:16px; width:576px; min-height:266px; padding:28px 35px; background:rgba(13,41,72,.82); color:#fff; }
.eyebrow { margin:0; color:#59abe9; font-size:10px; line-height:18px; font-weight:700; }
.distributor-hero h1 { margin:7px 0 12px; color:#fff; font-size:36px; line-height:1.07; letter-spacing:-1px; }
.hero-copy { width:432px; margin:0 0 17px; color:#e8f2ff; font-size:14px; line-height:1.45; }
.blue-button,.white-button { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:45px; padding:0 17px; color:#fff; background:#0075ba; font-size:12px; font-weight:700; text-decoration:none; transition:background-color .18s ease-out,color .18s ease-out; }
.blue-button:hover { background:#008cc7; }.blue-button span,.white-button span,.directory-contact span,.card-copy a span { font-size:17px; line-height:1; }
.distributor-directory { min-height:832px; margin-top:-14px; padding:90px 122px 0; background:#fff; }
.blue-eyebrow { color:#006eae; }
.distributor-directory h2 { margin:7px 0 13px; font-size:34px; line-height:1.12; letter-spacing:-.8px; }
.directory-intro { max-width:832px; margin:0; color:var(--soft); font-size:14px; line-height:1.45; }
.directory-line { height:2px; margin-top:31px; background:#c7d3df; }
.distributor-cards { display:grid; grid-template-columns:1fr 1fr; gap:51px; margin-top:34px; }
.distributor-card { position:relative; min-height:280px; border-left:5px solid #0075ba; padding:18px 28px; background:#fff; display:flex; align-items:center; justify-content:space-between; }
.card-copy { min-width:0; }.region { margin:0 0 9px; color:#0075ba; font-size:12px; font-weight:700; }.distributor-card h3 { margin:0; font-size:20px; line-height:1.2; }.authorised { margin:7px 0 22px; color:#5b6d7e; font-size:9px; font-weight:700; }.contact-detail { margin:0 0 13px; font-size:11px; line-height:1.3; }.address { margin:0; color:#5a6b7d; font-size:11px; line-height:1.4; }.card-copy a { display:inline-flex; gap:6px; margin-top:23px; color:#0075ba; font-size:11px; font-weight:700; text-decoration:none; }.card-copy a:hover,.directory-contact:hover { color:#008cc7; }.distributor-card img { width:175px; height:205px; margin:0 0 0 18px; object-fit:contain; }.distributor-card img.dovac-logo { width:270px; height:150px; margin-right:0; }
.distributor-card--dogussan { min-height:320px; }
.distributor-card img.dogussan-logo { width:245px; height:96px; margin-right:0; }
.card-copy .inline-contact-link { display:inline; margin:0; color:inherit; font-size:inherit; font-weight:400; text-decoration:none; }
.card-copy .inline-contact-link:hover { color:#0075ba; text-decoration:underline; }
.directory-note { margin:42px 0 10px; color:var(--soft); font-size:12px; }.directory-contact { color:#006eae; font-size:12px; font-weight:700; text-decoration:none; }
.distributor-cta { min-height:270px; margin:0 43px; padding:56px 75px; display:flex; align-items:center; justify-content:space-between; /* Keep the two Figma fills independent: the gradient occupies the complete
   CTA, while only the photo is vertically cropped to its recorded source window. */ background-image:linear-gradient(90deg,rgba(0,0,0,.8) 0%,rgba(102,102,102,0) 52.4%,rgba(102,102,102,0) 100%),url("assets/distributor/raw-10.webp"); background-position:center center,center -5vw; background-size:100% 100%,100% auto; background-repeat:no-repeat,no-repeat; color:#fff; }.distributor-cta h2 { margin:0 0 8px; color:#fff; font-size:28px; line-height:1.1; letter-spacing:-.5px; }.distributor-cta p { margin:0; color:#e5f0fb; font-size:13px; line-height:1.45; }.white-button { min-width:181px; color:#07517f; background:#fff; }.white-button:hover { color:#fff; background:#0075ba; }
.distributor-footer { position:relative; min-height:570px; margin-top:40px; padding:188px 82px 54px; overflow:hidden; background:#f0f0f0; clip-path:polygon(0 8%,100% 20%,100% 100%,0 100%); }.footer-links { display:flex; gap:90px; }.footer-links section { display:flex; flex-direction:column; }.footer-links h2 { margin:0 0 22px; font-size:22px; line-height:1.25; }.footer-links a { margin-bottom:5px; color:#003f64; font-size:16px; line-height:1.55; text-decoration:none; }.footer-links a:hover { color:#008cc7; }.footer-brand { position:absolute; top:216px; right:92px; width:340px; }.footer-brand>img { width:100%; height:auto; }.socials { display:flex; justify-content:flex-end; gap:21px; margin-top:44px; }.socials img { display:block; width:24px; height:24px; }.copyright { position:absolute; bottom:34px; right:82px; left:82px; margin:0; padding-top:17px; border-top:1px solid #8d949c; color:#003f64; font-size:13px; }
@media (max-width:1000px) { .distributor-site { width:100%; }.distributor-hero { height:540px; }.distributor-hero-panel { right:24px; bottom:30px; top:auto; width:min(576px,calc(100% - 48px)); }.distributor-directory { min-height:auto; margin:0; padding:70px 6vw; }.distributor-cards { grid-template-columns:1fr; gap:22px; }.distributor-cta { margin:0; padding:54px 6vw; }.distributor-footer { padding:145px 30px 60px; clip-path:polygon(0 4%,100% 12%,100% 100%,0 100%); }.footer-brand { position:static; width:280px; margin:50px 0 0; }.copyright { right:30px; left:30px; } }
@media (max-width:600px) { .distributor-hero { height:500px; }.distributor-hero-panel { padding:24px; }.distributor-hero h1 { font-size:31px; }.hero-copy { width:auto; }.distributor-directory h2 { font-size:29px; }.distributor-card { padding:20px; }.distributor-card img { width:120px; height:144px; margin:0; }.distributor-card img.dovac-logo { width:190px; height:106px; } .distributor-card--dogussan { flex-direction:column; align-items:flex-start; } .distributor-card img.dogussan-logo { align-self:center; width:min(280px,100%); height:78px; margin:24px 0 0; }.distributor-cta { flex-direction:column; align-items:flex-start; gap:25px; }.distributor-cta h2 { font-size:25px; }.distributor-cta p br { display:none; }.footer-links { flex-direction:column; gap:30px; } }