/* Self-hosted fonts (no external Google Fonts request — avoids sending
   visitor IPs to Google, a common GDPR issue for German sites) */
@font-face{
  font-family:'Anton'; font-style:normal; font-weight:400; font-display:swap;
  src:url('../assets/fonts/anton-400.woff2') format('woff2');
}
@font-face{
  font-family:'Inter'; font-style:normal; font-weight:100 900; font-display:swap;
  src:url('../assets/fonts/inter-var.woff2') format('woff2-variations'), url('../assets/fonts/inter-var.woff2') format('woff2');
}

:root{
  --bg:#07070b;
  --bg-soft:#0e0f15;
  --panel:rgba(255,255,255,0.045);
  --panel-strong:rgba(255,255,255,0.08);
  --border:rgba(255,255,255,0.09);
  --red:#ff4d2e;
  --red-2:#ff8a3d;
  --red-deep:#c92a1c;
  --red-glow:#ff8a5c;
  --blue:#3fa9ff;
  --blue-2:#6a5bff;
  --text:#f4f5f7;
  --text-dim:#a2a8b4;
  --text-dim2:#6b7280;
  --radius:18px;
  --container:1180px;
  --grad-primary:linear-gradient(135deg, var(--red-2), var(--red) 55%, var(--red-deep));
  --grad-accent-text:linear-gradient(100deg, var(--red-2), var(--red) 45%, var(--blue-2));
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; background:var(--bg);}
body{
  font-family:'Inter',sans-serif;
  background:
    radial-gradient(ellipse 900px 600px at 85% -8%, rgba(63,169,255,0.10), transparent 60%),
    radial-gradient(ellipse 900px 700px at -10% 10%, rgba(255,77,46,0.10), transparent 55%),
    var(--bg);
  color:var(--text);
  overflow-x:hidden;
  line-height:1.6;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
h1,h2,h3{font-family:'Anton',sans-serif; font-weight:400; letter-spacing:0.5px; text-transform:uppercase; line-height:1.05;}

.container{max-width:var(--container); margin:0 auto; padding:0 32px;}

/* PRELOADER */
#preloader{
  position:fixed; inset:0; background:#08090b; z-index:9999;
  display:flex; align-items:center; justify-content:center;
  transition:opacity .6s ease, visibility .6s ease;
}
#preloader.hidden{opacity:0; visibility:hidden; pointer-events:none;}
.preloader-logo{
  font-family:'Anton',sans-serif; font-size:3rem; letter-spacing:4px; color:var(--red);
  animation:pulseLogo 1.1s ease-in-out infinite;
  text-shadow:0 0 30px rgba(255,77,46,.6);
}
@keyframes pulseLogo{0%,100%{opacity:.5; transform:scale(.96)} 50%{opacity:1; transform:scale(1.03)}}

/* CURSOR GLOW */
#cursor-glow{
  position:fixed; width:420px; height:420px; border-radius:50%; pointer-events:none; z-index:2;
  background:radial-gradient(circle, rgba(255,77,46,.10), transparent 70%);
  transform:translate(-50%,-50%); left:50%; top:30%;
  transition:opacity .3s ease; opacity:0;
}

/* NAV */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 40px;
  background:rgba(8,9,11,0.35);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,0.06);
  transition:background .35s ease, padding .35s ease;
}
.nav.scrolled{background:rgba(8,9,11,0.82); padding:12px 40px;}
.nav-brand{display:flex; align-items:center; gap:10px; font-family:'Anton',sans-serif; font-size:1.05rem; letter-spacing:1px;}
.nav-logo{width:34px; height:34px; border-radius:8px; object-fit:cover;}
.nav-brand em{font-style:normal; color:var(--red);}
.nav-links{display:flex; gap:34px; font-size:.92rem; font-weight:500; color:var(--text-dim);}
.nav-links a{position:relative; transition:color .25s;}
.nav-links a:hover{color:var(--text);}
.nav-links a::after{
  content:''; position:absolute; left:0; bottom:-6px; width:0; height:1px; background:var(--red);
  transition:width .25s ease;
}
.nav-links a:hover::after{width:100%;}
.nav-cta{
  background:var(--grad-primary); color:#fff; padding:10px 20px; border-radius:100px; font-weight:600; font-size:.88rem;
  box-shadow:0 0 0 rgba(255,77,46,.5); transition:box-shadow .3s, transform .3s;
  white-space:nowrap;
}
.nav-cta:hover{box-shadow:0 0 24px rgba(255,77,46,.55); transform:translateY(-1px);}
.nav-burger{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px;}
.nav-burger span{width:24px; height:2px; background:#fff; display:block;}

/* HERO — dusk highway scene */
#hero{
  position:relative; height:100vh; min-height:640px; display:flex; align-items:center; justify-content:center;
  overflow:hidden; background:#0a0d14;
}
.hero-bg{
  position:absolute; inset:0; z-index:0;
  background:linear-gradient(180deg,
    #060a12 0%, #0d1626 26%, #1f3247 42%, #6b5240 54%,
    #e08a4c 61%, #ffbd7a 65%, #7a4326 67%, #140d0c 78%, #08090b 100%);
}
.hero-bg::before{
  content:''; position:absolute; inset:-2px;
  background-image:radial-gradient(rgba(255,255,255,0.55) 1px, transparent 1.4px);
  background-size:46px 46px;
  opacity:.18;
  mask-image:linear-gradient(180deg, black 0%, black 55%, transparent 62%);
  animation:driftDots 50s linear infinite;
}
@keyframes driftDots{from{background-position:0 0;} to{background-position:-460px -230px;}}
.hero-bg::after{
  content:''; position:absolute; left:50%; top:63%; width:min(1100px,90vw); height:280px;
  transform:translate(-50%,-50%); border-radius:50%;
  background:radial-gradient(ellipse, rgba(255,178,110,.65), rgba(255,138,61,.18) 55%, transparent 75%);
  filter:blur(6px);
}
.hero-vignette{
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(180deg, rgba(6,8,12,0.2) 0%, rgba(8,9,11,0) 32%, rgba(8,9,11,0.22) 66%, rgba(8,9,11,0.95) 100%);
}
.hero-grid-overlay{
  position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.3;
  background-image:linear-gradient(rgba(61,123,255,0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(61,123,255,0.07) 1px, transparent 1px);
  background-size:52px 52px;
  mask-image:radial-gradient(ellipse at 50% 55%, black 25%, transparent 70%);
}
#hero-canvas{position:absolute; inset:0; z-index:1; width:100%; height:100%;}
.hero-content{position:relative; z-index:3; text-align:center; max-width:880px; padding:0 24px;}
.eyebrow{
  display:inline-block; font-size:.82rem; letter-spacing:2px; text-transform:uppercase; color:var(--text-dim);
  border:1px solid var(--border); padding:7px 18px; border-radius:100px; margin-bottom:26px; backdrop-filter:blur(8px);
}
.hero-title{font-size:clamp(2.6rem, 8vw, 6.2rem); color:#fff; display:flex; flex-direction:column; gap:2px;}
.hero-title .accent{
  background:var(--grad-accent-text); -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 0 34px rgba(255,77,46,.35));
}
.hero-sub{max-width:600px; margin:26px auto 0; color:var(--text-dim); font-size:1.08rem;}
.hero-actions{display:flex; gap:16px; justify-content:center; margin-top:38px; flex-wrap:wrap;}

.btn{
  padding:15px 30px; border-radius:100px; font-weight:600; font-size:.95rem; display:inline-block;
  transition:transform .3s ease, box-shadow .3s ease, background .3s ease;
}
.btn-primary{background:var(--grad-primary); color:#fff; box-shadow:0 8px 30px rgba(255,77,46,.28);}
.btn-primary:hover{transform:translateY(-3px); box-shadow:0 14px 40px rgba(255,77,46,.42);}
.btn-ghost{border:1px solid rgba(255,255,255,.18); color:#fff; backdrop-filter:blur(8px);}
.btn-ghost:hover{background:rgba(255,255,255,.08); transform:translateY(-3px);}

.hero-story{
  position:absolute; inset:0; z-index:3; display:flex; align-items:center; justify-content:center;
  pointer-events:none; text-align:center; padding:0 24px;
}
.story-line{
  position:absolute; opacity:0; font-family:'Anton',sans-serif; text-transform:uppercase;
  font-size:clamp(1.8rem, 5vw, 3.4rem); color:#fff; max-width:820px;
  text-shadow:0 0 40px rgba(0,0,0,.6);
}

.scroll-indicator{
  position:absolute; bottom:34px; left:50%; transform:translateX(-50%); z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:8px; font-size:.72rem; letter-spacing:2px;
  text-transform:uppercase; color:var(--text-dim2);
}
.scroll-indicator span{
  width:1px; height:34px; background:linear-gradient(180deg, var(--red), transparent);
  position:relative; overflow:hidden;
}
.scroll-indicator span::after{
  content:''; position:absolute; top:-100%; left:0; width:100%; height:100%; background:#fff;
  animation:scrollLine 1.8s ease-in-out infinite;
}
@keyframes scrollLine{0%{top:-100%} 60%{top:100%} 100%{top:100%}}

/* SECTIONS */
.section{padding:130px 0; position:relative;}
.section-dark{background:var(--bg-soft); border-top:1px solid var(--border); border-bottom:1px solid var(--border);}
.tag{
  color:var(--red); font-weight:700; letter-spacing:2px; text-transform:uppercase; font-size:.8rem; margin-bottom:16px;
}
.section-title{font-size:clamp(2rem, 4.2vw, 3.4rem); margin-bottom:26px; color:#fff;}
.accent-text{
  background:var(--grad-accent-text); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.section-lead{max-width:680px; color:var(--text-dim); font-size:1.08rem; margin-bottom:20px;}

/* ABOUT */
.about-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:70px; align-items:start; margin-top:20px;}
.about-text p{color:var(--text-dim); font-size:1.06rem; margin-bottom:20px;}
.about-stats{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.stat-card{
  background:var(--panel); border:1px solid var(--border); border-radius:var(--radius); padding:28px 22px;
  transition:transform .3s ease, border-color .3s ease;
}
.stat-card:hover{transform:translateY(-4px); border-color:rgba(255,77,46,.4);}
.stat-number{
  font-family:'Anton',sans-serif; font-size:2.4rem; display:block;
  background:var(--grad-accent-text); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.stat-label{color:var(--text-dim); font-size:.88rem; margin-top:6px; display:block;}

/* SERVICES */
.cards-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:26px; margin-top:20px;}
.service-card{
  background:var(--panel); border:1px solid var(--border); border-radius:var(--radius); padding:36px 30px;
  transition:transform .4s ease, border-color .4s ease, background .4s ease;
  display:flex; flex-direction:column;
}
.service-card:hover{transform:translateY(-8px); border-color:rgba(255,77,46,.35); background:var(--panel-strong);}
.service-icon{font-size:2rem; margin-bottom:18px;}
.service-card h3{font-size:1.5rem; color:#fff; margin-bottom:14px;}
.service-lead{color:var(--text-dim); margin-bottom:16px;}
.check-list li{
  color:var(--text-dim); font-size:.95rem; padding:9px 0 9px 26px; position:relative; border-top:1px solid rgba(255,255,255,.06);
}
.check-list li:first-child{border-top:none;}
.check-list li::before{
  content:'✓'; position:absolute; left:0; top:9px; color:var(--red); font-weight:700;
}
.emoji-list li{padding-left:30px;}
.emoji-list li::before{content:none;}
.emoji-list li span{position:absolute; left:0;}

.service-card-featured{padding:0; overflow:hidden;}
.service-image{width:100%; height:190px; background-size:cover; background-position:center;}
.service-body{padding:30px 30px 36px;}
.service-body p{color:var(--text-dim); font-size:.95rem; margin-bottom:16px;}

.service-card-focus{position:relative; border-color:rgba(255,77,46,.3); background:linear-gradient(160deg, rgba(255,77,46,0.07), var(--panel));}
.focus-badge{
  position:absolute; top:20px; right:20px; background:var(--grad-primary); color:#fff;
  font-size:.68rem; font-weight:700; letter-spacing:1px; text-transform:uppercase;
  padding:5px 12px; border-radius:100px;
}

.cards-grid-compact{grid-template-columns:repeat(3, 1fr); margin-top:22px;}
.service-card-compact{padding:28px 26px;}
.service-card-compact .service-icon{font-size:1.7rem; margin-bottom:14px;}
.service-card-compact h3{font-size:1.15rem; margin-bottom:10px;}
.service-card-compact p{color:var(--text-dim); font-size:.92rem;}

/* FLEET */
.fleet-grid{display:grid; grid-template-columns:1fr 1fr; gap:26px; margin-top:50px;}
.fleet-card{
  border-radius:var(--radius); overflow:hidden; border:1px solid var(--border); background:var(--panel);
  position:relative;
}
.fleet-card img{width:100%; height:340px; object-fit:cover; transition:transform .6s ease;}
.fleet-card:hover img{transform:scale(1.06);}
.fleet-card figcaption{
  padding:16px 20px; color:var(--text-dim); font-size:.92rem; border-top:1px solid var(--border);
}
.tilt-card{will-change:transform; transform-style:preserve-3d; transition:transform .15s ease-out, border-color .3s;}
.tilt-card:hover{border-color:rgba(255,77,46,.35);}

/* PRICING */
.pricing-layout{display:grid; grid-template-columns:.9fr 1.1fr; gap:60px; align-items:center;}
.pricing-heading p{color:var(--text-dim); margin:18px 0 28px; max-width:420px;}
.pricing-card{
  background:linear-gradient(155deg, rgba(255,77,46,0.08), rgba(255,255,255,0.03));
  border:1px solid rgba(255,77,46,.25); border-radius:24px; padding:44px 40px;
}
.pricing-card h3{font-family:'Anton',sans-serif; font-size:1.5rem; color:#fff; margin-bottom:6px; text-transform:uppercase;}
.pricing-note{color:var(--text-dim); font-size:.92rem; margin-bottom:22px;}
.price-list li{
  display:flex; justify-content:space-between; align-items:baseline; gap:20px;
  padding:16px 0; border-top:1px solid rgba(255,255,255,.08); font-size:.98rem; color:var(--text-dim);
}
.price-list li strong{color:#fff; font-family:'Anton',sans-serif; font-size:1.4rem; white-space:nowrap;}
.pricing-divider{
  margin:28px 0 16px; text-transform:uppercase; letter-spacing:1.5px; font-size:.78rem; color:var(--red); font-weight:700;
}
.pricing-fineprint{color:var(--text-dim2); font-size:.82rem; margin-top:16px;}

/* CONTACT */
.contact-card{
  margin-top:40px; display:grid; grid-template-columns:repeat(3,1fr); gap:0;
  background:var(--panel); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden;
}
.contact-item{
  padding:44px 30px; text-align:center; border-left:1px solid var(--border);
  display:flex; flex-direction:column; gap:12px; align-items:center;
}
.contact-item:first-child{border-left:none;}
.contact-label{color:var(--text-dim); font-size:.82rem; text-transform:uppercase; letter-spacing:1.5px;}
.contact-value{font-size:1.15rem; font-weight:600; color:#fff; transition:color .25s;}
.contact-item .contact-value:hover{color:var(--red);}
.contact-social{display:flex; flex-direction:column; align-items:center; gap:8px; color:#fff;}

/* CONTACT FORM */
.contact-form-wrap{margin-top:34px;}
.contact-form{
  background:var(--panel); border:1px solid var(--border); border-radius:var(--radius);
  padding:40px clamp(24px, 5vw, 48px); max-width:760px; margin:0 auto;
}
.contact-form h3{font-family:'Anton',sans-serif; text-transform:uppercase; color:#fff; font-size:1.4rem; margin-bottom:10px;}
.contact-form-lead{color:var(--text-dim); font-size:.95rem; margin-bottom:28px;}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.form-row{display:flex; flex-direction:column; gap:8px; margin-bottom:18px;}
.form-row label{color:var(--text-dim); font-size:.82rem; text-transform:uppercase; letter-spacing:1px;}
.form-row input, .form-row select, .form-row textarea{
  background:rgba(255,255,255,0.05); border:1px solid var(--border); border-radius:10px;
  padding:13px 16px; color:#fff; font-family:'Inter',sans-serif; font-size:.98rem;
  transition:border-color .25s, background .25s;
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus{
  outline:none; border-color:var(--red); background:rgba(255,255,255,0.08);
}
.form-row select option{background:#14151b; color:#fff;}
.form-row textarea{resize:vertical; font-family:'Inter',sans-serif;}
.form-consent{
  display:flex; align-items:flex-start; gap:10px; margin:6px 0 18px; cursor:pointer;
  color:var(--text-dim); font-size:.86rem; line-height:1.5;
}
.form-consent input{margin-top:4px; width:16px; height:16px; flex-shrink:0; accent-color:var(--red); cursor:pointer;}
.form-consent a{color:#fff; text-decoration:underline; text-underline-offset:2px;}
.form-consent a:hover{color:var(--red);}
.form-submit{width:100%; text-align:center; border:none; cursor:pointer; margin-top:6px; font-size:1rem;}
.form-submit:disabled{opacity:.7; cursor:default; transform:none !important;}
.form-note{color:var(--text-dim2); font-size:.82rem; margin-top:14px; text-align:center;}
.form-status{margin-top:16px; text-align:center; font-size:.92rem; min-height:1.2em;}
.form-status.is-success{color:#4ade80;}
.form-status.is-error{color:#ff6a5c;}

/* FOOTER */
.footer{background:var(--bg-soft); border-top:1px solid var(--border); padding:70px 0 0;}
.footer-grid{display:grid; grid-template-columns:1fr 1fr; gap:40px; padding-bottom:50px;}
.footer-logo{width:56px; height:56px; border-radius:12px; margin-bottom:14px;}
.footer-tagline{color:var(--text-dim); font-family:'Anton',sans-serif; text-transform:uppercase; letter-spacing:1px;}
.footer-impressum h4{color:var(--red); text-transform:uppercase; letter-spacing:1.5px; font-size:.82rem; margin-bottom:14px;}
.footer-impressum p{color:var(--text-dim); font-size:.92rem; margin-bottom:10px;}
.footer-impressum a:hover{color:var(--red);}
.footer-bottom{
  text-align:center; padding:22px 0; border-top:1px solid var(--border); color:var(--text-dim2); font-size:.82rem;
}
.footer-bottom a{color:var(--text-dim2); text-decoration:underline; text-underline-offset:2px;}
.footer-bottom a:hover{color:var(--red);}

/* REVEAL ANIMATION (JS-driven via GSAP, CSS fallback state) */
.reveal-up{opacity:0; transform:translateY(36px);}

/* RESPONSIVE */
@media (max-width:980px){
  .nav-links{display:none;}
  .nav-burger{display:flex;}
  .about-grid, .pricing-layout{grid-template-columns:1fr; gap:40px;}
  .cards-grid{grid-template-columns:1fr;}
  .fleet-grid{grid-template-columns:1fr;}
  .contact-card{grid-template-columns:1fr;}
  .contact-item{border-left:none; border-top:1px solid var(--border);}
  .contact-item:first-child{border-top:none;}
  .footer-grid{grid-template-columns:1fr;}
  .section{padding:90px 0;}
  .form-grid{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .nav{padding:14px 20px;}
  .nav-cta{display:none;}
  .container{padding:0 22px;}
  .about-stats{grid-template-columns:1fr 1fr;}
}

/* LEGAL PAGES (Datenschutz, Impressum) */
.legal-hero{padding:150px 0 40px; background:var(--bg);}
.legal-body{padding-top:0;}
.legal-hero .tag{margin-bottom:14px;}
.legal-hero .section-title{margin-bottom:0;}
.legal-content{max-width:820px; padding:20px 0 100px;}
.legal-content h2{
  font-family:'Anton',sans-serif; text-transform:uppercase; color:#fff; letter-spacing:.5px;
  font-size:1.5rem; margin:44px 0 16px;
}
.legal-content h2:first-child{margin-top:0;}
.legal-content h3{color:var(--red); font-size:1.05rem; margin:26px 0 10px; font-weight:700;}
.legal-content p{color:var(--text-dim); font-size:.98rem; margin-bottom:14px;}
.legal-content ul{margin:0 0 14px; padding-left:22px;}
.legal-content li{color:var(--text-dim); font-size:.98rem; margin-bottom:8px; list-style:disc;}
.legal-content a{color:#fff; text-decoration:underline; text-underline-offset:2px;}
.legal-content a:hover{color:var(--red);}
.legal-content strong{color:#fff;}
.legal-content .legal-updated{color:var(--text-dim2); font-size:.85rem; margin-top:40px; padding-top:20px; border-top:1px solid var(--border);}