:root{
  --red:#D60000;
  --red-dark:#A80000;
  --black:#111110;
  --gray:#5B5B57;
  --gray-light:#8B8A82;
  --border:#E2E0D9;
  --bg:#FFFFFF;
  --bg-off:#FAFAF7;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;
  color:var(--black);
  background:var(--bg);
  line-height:1.5;
}
img{max-width:100%; display:block;}
a{color:inherit;}
.wrap{max-width:1080px; margin:0 auto; padding:0 24px;}

/* ===== top bar ===== */
.topbar{background:var(--black); color:#fff; font-size:14px; text-align:center; padding:8px 16px;}
.topbar a{color:#fff; text-decoration:none; font-weight:700;}

/* ===== header ===== */
header.site{padding:16px 0; border-bottom:4px solid var(--red);}
header.site .wrap{display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;}
header.site .logo img{height:36px; width:auto;}
.header-contact{font-size:14px; color:var(--gray); white-space:nowrap;}
.header-contact a{text-decoration:none; color:var(--gray); font-weight:600;}
.header-contact a:hover{color:var(--red);}
.header-contact .sep{margin:0 8px; color:var(--border);}
nav.site-nav{display:flex; gap:26px; flex-wrap:wrap; margin-left:auto;}
nav.site-nav a{text-decoration:none; font-weight:700; font-size:15px; text-transform:uppercase; letter-spacing:.03em; color:var(--black);}
nav.site-nav a:hover{color:var(--red);}
.nav-cta{
  display:inline-block; background:var(--red); color:#fff !important; font-weight:700;
  font-size:14px; text-transform:uppercase; letter-spacing:.03em; padding:10px 20px; border-radius:4px; text-decoration:none;
}

/* ===== hero ===== */
.hero{background:var(--bg-off); padding:48px 0 40px; text-align:center;}
.hero .eyebrow{color:var(--red); font-weight:700; font-size:16px; letter-spacing:.14em; text-transform:uppercase;}
.hero h1{
  margin-top:14px; font-size:56px; font-weight:800; line-height:1.05; letter-spacing:-.01em;
}
.hero p.sub{margin:22px auto 0; max-width:600px; font-size:19px; color:var(--gray);}
.btn-row{margin-top:34px; display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}
.stat-row{margin-top:40px; display:flex; gap:12px 30px; justify-content:center; flex-wrap:wrap;}
.stat{display:flex; align-items:center; gap:9px; font-size:14px; font-weight:700; text-transform:uppercase; letter-spacing:.02em; color:var(--black);}
.stat .dot{width:7px; height:7px; border-radius:50%; background:var(--red); flex:none;}
.btn{
  display:inline-flex; align-items:center; gap:10px; font-weight:700; font-size:17px;
  padding:16px 30px; border-radius:6px; text-decoration:none; text-transform:uppercase; letter-spacing:.02em;
}
.btn-primary{background:#25D366; color:#fff;}
.btn-secondary{background:transparent; color:var(--black); border:2px solid var(--black);}

/* ===== stripe ===== */
.stripe{background:var(--black); border-top:4px solid var(--red); border-bottom:4px solid var(--red); padding:18px 0; text-align:center;}
.stripe span{color:#fff; font-weight:700; font-size:20px; letter-spacing:.05em; text-transform:uppercase;}

/* ===== services ===== */
.services{padding:48px 0; text-align:center;}
.services h2{font-size:32px; font-weight:800;}
.services .grid{
  margin-top:40px; display:grid; grid-template-columns:repeat(4,1fr); gap:20px;
}
.service-card{padding:28px 12px; border:1px solid var(--border); border-radius:10px;}
.service-card svg{width:44px; height:44px; stroke:var(--black); margin:0 auto 14px; display:block;}
.service-card .lbl{font-weight:700; font-size:16px; text-transform:uppercase; letter-spacing:.02em;}
.service-card .txt{margin-top:8px; font-size:14px; color:var(--gray);}

.fleet-highlight{
  margin-top:24px; background:var(--black); color:#fff; border-radius:12px;
  padding:30px 32px; display:flex; align-items:flex-start; gap:24px; text-align:left;
  border-left:6px solid var(--red);
}
.fleet-highlight svg{width:44px; height:44px; stroke:var(--red); flex:none; margin-top:4px;}
.fleet-tag{font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--red);}
.fleet-h{margin-top:6px; font-size:20px; font-weight:800;}
.fleet-p{margin-top:10px; font-size:15px; line-height:1.55; color:rgba(255,255,255,.75); max-width:640px;}

/* ===== steps ===== */
.steps{background:var(--bg-off); padding:64px 0; text-align:center;}
.steps h2{font-size:32px; font-weight:800;}
.steps-grid{margin-top:40px; display:grid; grid-template-columns:repeat(4,1fr); gap:24px; text-align:left;}
.step{position:relative; padding-top:8px;}
.step .num{
  width:36px; height:36px; border-radius:50%; background:var(--black); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:16px; margin-bottom:14px;
}
.step .lbl{font-weight:800; font-size:17px; margin-bottom:6px;}
.step .txt{font-size:14px; color:var(--gray); line-height:1.5;}

/* ===== brands ===== */
.brands{padding:0 0 48px; text-align:center;}
.brands .lbl{font-size:14px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--gray-light);}
.brands .logos{margin-top:26px; display:flex; align-items:center; justify-content:center; gap:34px; flex-wrap:wrap;}
.brands .logos img{max-height:34px; max-width:110px; width:auto; height:auto;}
.brands .logos img.kumho{border-radius:4px;}

/* ===== why us ===== */
.why{background:var(--bg-off); padding:48px 0; text-align:center;}
.why h2{font-size:28px; font-weight:800;}
.why ul{margin:24px auto 0; padding:0; list-style:none; display:inline-flex; flex-direction:column; gap:12px; text-align:left;}
.why li{display:flex; gap:12px; font-size:16px;}
.why li .dot{width:8px; height:8px; border-radius:50%; background:var(--red); margin-top:8px; flex:none;}

/* ===== CTA ===== */
.cta{background:var(--red); color:#fff; padding:48px 0; text-align:center;}
.cta h2{font-size:38px; font-weight:800; text-transform:uppercase;}
.cta p{margin-top:14px; font-size:18px; opacity:.92; max-width:560px; margin-left:auto; margin-right:auto;}
.cta .btn-row{margin-top:30px;}
.cta .btn-primary{background:#fff; color:var(--red);}
.cta .qr{
  margin:34px auto 0; background:#fff; border-radius:14px; padding:20px; width:260px; text-align:center;
}
.cta .qr img{width:220px; height:220px; margin:0 auto;}
.cta .qr .tag{margin-top:8px; font-size:12px; font-weight:700; text-transform:uppercase; color:var(--black); letter-spacing:.03em;}

/* ===== booking form ===== */
.booking{
  margin:36px auto 0; max-width:480px; background:#fff; border-radius:14px; padding:28px;
  text-align:left; color:var(--black);
}
.booking-row{margin-bottom:16px;}
.booking-row.two{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.booking label{display:block; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--gray); margin-bottom:6px;}
.booking input, .booking select, .booking textarea{
  width:100%; padding:12px 14px; border:1px solid var(--border); border-radius:6px; font-size:15px; font-family:inherit; color:var(--black);
}
.booking textarea{resize:vertical;}
.booking input:focus, .booking select:focus, .booking textarea:focus{outline:2px solid var(--red); outline-offset:1px;}

/* ===== contact ===== */
.contact{padding:64px 0; text-align:center;}
.contact h2{font-size:32px; font-weight:800;}
.contact .grid{margin-top:36px; display:grid; grid-template-columns:repeat(3,1fr); gap:24px; text-align:left;}
.contact-card{border:1px solid var(--border); border-radius:10px; padding:24px;}
.contact-card .lbl{font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--gray-light);}
.contact-card .val{margin-top:10px; font-size:18px; font-weight:700;}
.contact-card a{text-decoration:none; color:var(--red);}

/* ===== footer ===== */
footer.site{background:var(--bg-off); color:var(--gray); padding:48px 0 24px; border-top:4px solid var(--red);}
.footer-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:32px;}
.footer-col{display:flex; flex-direction:column; gap:10px; font-size:14px;}
.footer-col img{height:32px; width:auto; display:block; margin-bottom:4px; align-self:flex-start;}
.footer-col p{color:var(--gray); font-size:13px; line-height:1.5; max-width:260px;}
.footer-h{font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--gray-light); margin-bottom:4px;}
.footer-col a, .footer-col .plain{text-decoration:none; color:var(--black);}
.footer-col a:hover{color:var(--red);}
.payments{margin-top:32px; padding-top:24px; border-top:1px solid var(--border); text-align:center;}
.payments .footer-h{margin-bottom:14px;}
.payment-badges{display:flex; gap:12px; justify-content:center; flex-wrap:wrap;}
.payment-badge{
  display:inline-flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--border);
  border-radius:8px; padding:11px 18px; font-size:14px; font-weight:700; color:var(--black);
}
.payment-badge svg{width:20px; height:20px; stroke:var(--black);}
.payment-badge img{height:22px; width:auto; max-width:60px;}
.payment-badge-logos img{height:20px;}
.payment-badge-logos img:not(:last-child){margin-right:2px;}
footer.site .copy{font-size:13px; color:var(--gray-light); text-align:center; margin-top:28px; padding-top:20px; border-top:1px solid var(--border);}

/* ===== simple pages (Impressum/Datenschutz) ===== */
.legal{padding:56px 0 80px; max-width:760px;}
.legal h1{font-size:36px; font-weight:800; margin-bottom:28px;}
.legal h2{font-size:20px; font-weight:800; margin:32px 0 10px;}
.legal p, .legal li{font-size:16px; color:#3A3A38; margin-bottom:10px;}
.legal .fill{background:#FFF6D8; border:1px dashed #C7A400; color:#6B5900; padding:2px 8px; border-radius:4px; font-weight:700;}

/* ===== mobile ===== */
@media (max-width:860px){
  .hero h1{font-size:38px;}
  .services .grid{grid-template-columns:repeat(2,1fr);}
  .fleet-highlight{flex-direction:column; gap:14px;}
  .steps-grid{grid-template-columns:1fr 1fr; gap:28px;}
  .why .wrap{grid-template-columns:1fr;}
  .contact .grid{grid-template-columns:1fr;}
  nav.site-nav{display:none;}
  .header-contact{display:none;}
  .footer-grid{grid-template-columns:1fr 1fr; text-align:left;}
}
@media (max-width:520px){
  .steps-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr; text-align:center;}
  .footer-col p{max-width:none; margin:0 auto;}
  .footer-col img{align-self:center;}
}