:root{
  --bg:#FFFFFF;
  --bg-2:#F4F4F4;
  --hair:#DCDCDC;
  --tick:#B4B4B4;
  --text:#0B0B0B;
  --dim:#6B6B6B;
  --orange:#C24E00;--orange-2:#E0761F;
  --orange-ink:#FFFFFF;
  --hex:rgba(11,11,11,.055);
  --ghost:#A8A8A8;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0B0B0B;
    --bg-2:#151515;
    --hair:#242424;
    --tick:#3D3D3D;
    --text:#FFFFFF;
    --dim:#969696;
    --orange:#FF6A00;--orange-2:#FF9147;
    --orange-ink:#0B0B0B;
    --hex:rgba(255,255,255,.055);
    --ghost:#6E6E6E;
  }
}
:root[data-theme="dark"]{
  --bg:#0B0B0B;
  --bg-2:#151515;
  --hair:#242424;
  --tick:#3D3D3D;
  --text:#FFFFFF;
  --dim:#969696;
  --orange:#FF6A00;--orange-2:#FF9147;
  --orange-ink:#0B0B0B;
  --hex:rgba(255,255,255,.055);
  --ghost:#6E6E6E;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
/* Der Kopf klebt oben. Ohne diesen Abstand springt jeder Anker so weit,
   dass die Ueberschrift des Ziels darunter verschwindet. */
[id]{scroll-margin-top:88px}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-weight:400;font-size:16px;line-height:1.65;overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
h1,h2{font-family:"Archivo Black","Archivo",Impact,sans-serif;font-weight:400;line-height:1.05;margin:0;letter-spacing:-.022em}
h3{font-family:"Barlow Condensed",sans-serif;font-weight:700;margin:0;line-height:1.14;letter-spacing:.005em}
h1{font-size:clamp(2.2rem,6.1vw,3.85rem)}
h2{font-size:clamp(1.65rem,4.1vw,2.65rem)}
h3{font-size:1.45rem}
p{margin:0}

.wrap{width:100%;max-width:1160px;margin:0 auto;padding:0 22px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

/* tracked technical label — brand device */
.tag{
  font-family:"Barlow Condensed",sans-serif;font-weight:700;
  font-size:.92rem;letter-spacing:.17em;text-transform:uppercase;color:var(--dim);
}
.tag .dot{color:var(--orange);margin:0 .5em}
.num{font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:.98rem;letter-spacing:.17em;color:var(--orange)}

/* orange rule — brand device */
.rule{width:96px;height:3px;background:var(--orange);margin-bottom:18px}


/* framed box with crosshair corners — brand device */
.frame{position:relative;padding:36px 32px 34px}
.frame::before{content:"";position:absolute;inset:9px;border:1px solid var(--hair);pointer-events:none}
.frame::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(var(--tick),var(--tick)),linear-gradient(var(--tick),var(--tick)),
    linear-gradient(var(--tick),var(--tick)),linear-gradient(var(--tick),var(--tick)),
    linear-gradient(var(--tick),var(--tick)),linear-gradient(var(--tick),var(--tick)),
    linear-gradient(var(--tick),var(--tick)),linear-gradient(var(--tick),var(--tick));
  background-repeat:no-repeat;
  background-size:17px 1px,1px 17px,17px 1px,1px 17px,17px 1px,1px 17px,17px 1px,1px 17px;
  background-position:
    left 1px top 9px, left 9px top 1px,
    right 1px top 9px, right 9px top 1px,
    left 1px bottom 9px, left 9px bottom 1px,
    right 1px bottom 9px, right 9px bottom 1px;
}

.btn{
  display:inline-flex;align-items:center;justify-content:center;text-align:center;
  font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:1.1rem;letter-spacing:.09em;text-transform:uppercase;
  padding:13px 26px;text-decoration:none;border:1px solid transparent;cursor:pointer;
}
.btn-solid{background:linear-gradient(90deg,var(--orange),var(--orange-2));color:#fff}
.btn-solid:hover{filter:brightness(1.1)}
.btn-line{border-color:var(--hair);color:var(--text)}
.btn-line:hover{border-color:var(--orange);color:var(--orange)}
.btn-lg{padding:16px 34px;font-size:1.08rem}

/* ---------- header ---------- */
.site-head{position:sticky;top:0;z-index:60;background:var(--bg);border-bottom:1px solid var(--hair)}
.head{display:flex;align-items:center;gap:22px;min-height:70px}
.logo{display:flex;align-items:center;gap:11px;text-decoration:none}
.logo svg{width:32px;height:32px;flex:none;color:var(--text)}
.logo-type{font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:1.72rem;letter-spacing:.01em;line-height:1}
.logo-type i{font-style:normal;color:var(--orange)}
.nav{display:flex;gap:18px;margin-left:auto;font-size:.87rem;white-space:nowrap}
.nav a{text-decoration:none;color:var(--dim)}
.nav a:hover{color:var(--text)}
.head-cta{display:flex;gap:14px;margin-left:auto;align-items:center}
.head-cta .btn{white-space:nowrap}

/* ---------- hero ---------- */
.hero,.final{
  background-image:url("__BGPATH__");
  background-size:cover;background-repeat:no-repeat;background-position:center top;
  --text:#FFFFFF;--dim:#A2A7AA;--hair:rgba(255,255,255,.15);--tick:rgba(255,255,255,.32);
  color:#FFFFFF;
}
.final{background-position:center bottom}
@media (max-width:700px){.hero,.final{background-position:28% bottom}}
.hero{position:relative;padding:92px 0 64px;border-bottom:1px solid var(--hair);overflow:hidden}
.hero .wrap{position:relative;z-index:2}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:end}
.hero-grid>*,.cover>*,.dealer>*{min-width:0}
.cover .chip{font-size:.9rem;padding:6px 10px}
.hero h1{margin:20px 0 26px;max-width:12ch}
.hero-sub{font-size:1.2rem;color:var(--dim);max-width:46ch;margin-bottom:34px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:18px}
.hero-more{margin-bottom:30px}
.hero-more a{color:var(--dim);font-size:.96rem;text-underline-offset:4px}
.hero-more a:hover{color:var(--orange)}
.hero-tags{padding-top:22px;border-top:1px solid var(--hair)}

.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--hair);margin-top:56px}
.stat{padding:22px 22px 0 0}
.stat-v{font-family:"Archivo Black",sans-serif;font-weight:400;font-size:1.8rem;line-height:1;letter-spacing:-.02em}
.stat-l{font-family:"Barlow Condensed",sans-serif;font-weight:600;font-size:.94rem;letter-spacing:.06em;color:var(--dim);margin-top:9px;line-height:1.3;text-wrap:balance}

/* ---------- ledger ---------- */
.ledger{position:relative;background:rgba(11,11,11,.78);backdrop-filter:blur(8px)}
.ledger-head{display:flex;align-items:center;gap:10px;padding-bottom:14px;border-bottom:1px solid var(--hair)}
.live{width:7px;height:7px;background:var(--orange);flex:none;animation:blink 2.2s ease-in-out infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
.ledger-title{font-family:"Barlow Condensed",sans-serif;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:1.05rem}
.ledger-scroll{overflow-x:auto}
table{border-collapse:collapse;width:100%;min-width:330px}
.ledger td{padding:14px 14px 14px 0;border-bottom:1px solid var(--hair);font-size:.9rem;vertical-align:middle}
.ledger tr:last-child td{border-bottom:0}
.c-time{font-family:"Barlow Condensed",sans-serif;font-weight:600;font-size:.98rem;letter-spacing:.05em;color:var(--dim)}
.c-ecu{font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:.98rem;letter-spacing:.05em;color:var(--orange);text-align:right;padding-right:0!important;white-space:nowrap}
.c-car{font-weight:400}
.fresh{animation:fresh .6s ease-out}
@keyframes fresh{from{background:rgba(255,106,0,.18)}to{background:transparent}}

/* ---------- sections ---------- */
section{padding:96px 0;position:relative}
.band{border-bottom:1px solid var(--hair)}
.sec-head{margin-bottom:52px;max-width:60ch}
.sec-head h2{margin:14px 0 16px}
.sec-head p{color:var(--dim);font-size:1.08rem;max-width:56ch}

.grid6{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.cell h3{margin:14px 0 10px}
.cell p{color:var(--dim);font-size:.96rem;max-width:42ch}

/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.step{padding:26px 26px 26px 0;border-top:2px solid var(--text)}
.step:not(:last-child){border-right:1px solid var(--hair);padding-right:26px}
.step:not(:first-child){padding-left:26px}
.step h3{margin:14px 0 10px}
.step p{color:var(--dim);font-size:.94rem}

/* coverage */
.cover{display:grid;grid-template-columns:1fr 1fr 1fr;gap:40px}
.cover h3{margin-bottom:18px}
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip{font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:.95rem;letter-spacing:.07em;padding:7px 12px;border:1px solid var(--hair);color:var(--dim)}
.chip-more{border-style:dashed;color:var(--ghost);text-transform:none;letter-spacing:.04em;font-weight:600}
.cover-note{margin-top:20px;font-size:.9rem;color:var(--dim)}

/* dealer list */
.dealer{display:grid;grid-template-columns:.95fr 1.05fr;gap:60px;align-items:start}
.dlist{border-top:1px solid var(--hair)}
.drow{display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:baseline;padding:20px 0;border-bottom:1px solid var(--hair)}
.drow h3{font-size:1.32rem;margin-bottom:6px}
.drow p{color:var(--dim);font-size:.93rem;max-width:44ch}

/* access */
.paths{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.path h3{font-size:1.95rem;margin:14px 0 12px}
.path>p{color:var(--dim);margin-bottom:22px;max-width:40ch}
.path ul{list-style:none;padding:0;margin:0 0 28px}
.path li{font-size:.94rem;color:var(--dim);padding:10px 0 10px 22px;border-bottom:1px solid var(--hair);position:relative}
.path li::before{content:"";position:absolute;left:0;top:19px;width:7px;height:7px;background:var(--orange)}
.path li:last-child{border-bottom:0}

/* faq */
.faq{max-width:78ch}
details{border-bottom:1px solid var(--hair)}
summary{
  cursor:pointer;list-style:none;padding:24px 40px 24px 0;position:relative;
  font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:1.62rem;line-height:1.18;
}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:6px;top:21px;color:var(--orange);font-family:"Inter",sans-serif;font-weight:400;font-size:1.6rem;line-height:1}
details[open] summary::after{content:"–"}
details p{padding:0 0 26px;color:var(--dim);max-width:66ch;font-size:.98rem}

/* final */
.final{position:relative;overflow:hidden;padding:104px 0 96px}
.final .wrap{position:relative;z-index:2}
.final-single{max-width:34rem}
.final h2{margin-bottom:20px;max-width:14ch}
.final-sub{color:var(--dim);max-width:44ch;margin-bottom:30px}

/* footer */
footer{border-top:1px solid var(--hair);padding:56px 0 40px;font-size:.9rem;color:var(--dim)}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px;margin-bottom:44px}
.fgrid h4{font-family:"Barlow Condensed",sans-serif;font-weight:600;font-size:1rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text);margin:0 0 16px}
.flinks{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.flinks a{text-decoration:none}
.flinks a:hover{color:var(--orange)}
.fbottom{border-top:1px solid var(--hair);padding-top:24px;display:grid;gap:12px;font-size:.8rem;line-height:1.6}
.claim{font-family:"Barlow Condensed",sans-serif;font-weight:600;font-size:.95rem;letter-spacing:.17em;text-transform:uppercase;color:var(--dim)}

/* ---------- language switcher ---------- */
.langpick{position:relative}
.langpick summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;gap:6px;
  font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:1.05rem;
  letter-spacing:.09em;text-transform:uppercase;color:var(--dim);
  padding:12px 12px;border:1px solid var(--hair);
}
.langpick summary::-webkit-details-marker{display:none}
.langpick summary::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px)}
.langpick summary:hover{color:var(--text);border-color:var(--orange)}
.langpick[open] summary{color:var(--text);border-color:var(--orange)}
.langmenu{
  position:absolute;right:0;top:calc(100% + 6px);z-index:70;min-width:168px;
  background:var(--bg);border:1px solid var(--hair);padding:6px 0;
  box-shadow:0 10px 30px rgba(0,0,0,.28);
}
.langmenu a{
  display:flex;justify-content:space-between;gap:14px;padding:9px 14px;
  text-decoration:none;font-size:.94rem;color:var(--dim);
}
.langmenu a:hover{background:var(--bg-2);color:var(--text)}
.langmenu a[aria-current="true"]{color:var(--orange)}
.langmenu a i{font-style:normal;font-family:"Barlow Condensed",sans-serif;font-weight:700;letter-spacing:.1em;opacity:.7}

/* ---------- application form ---------- */
.apply-call{font-size:2.05rem;color:var(--orange);margin-bottom:14px;max-width:16ch}
.applyform{display:grid;gap:16px;margin-top:6px}
.fld2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fld{display:grid;gap:7px}
.fld>span{
  font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:.9rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--dim);
}
.fld>span i{font-style:normal;font-weight:600;letter-spacing:.08em;opacity:.65}
.fld input,.fld select,.fld textarea{
  font-family:"Inter",sans-serif;font-size:.97rem;color:var(--text);
  background:rgba(255,255,255,.04);border:1px solid var(--hair);border-radius:0;
  padding:11px 13px;width:100%;
}
.fld textarea{resize:vertical;min-height:76px}
.fld select{appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--dim) 50%),linear-gradient(135deg,var(--dim) 50%,transparent 50%);
  background-position:calc(100% - 19px) 50%,calc(100% - 13px) 50%;
  background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:38px}
.fld select option{background:#151515;color:#fff}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--orange);outline:none}
.consent{display:flex;gap:11px;align-items:flex-start;font-size:.89rem;color:var(--dim);line-height:1.5}
.consent input{margin-top:3px;flex:none;width:16px;height:16px;accent-color:var(--orange)}
.consent a{color:var(--orange)}
.applyform button{width:100%;margin-top:4px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.sent{
  border-left:3px solid var(--orange);padding:14px 0 14px 16px;margin-bottom:22px;
  font-size:.96rem;color:var(--text);
}

@media (max-width:1200px){
  .nav{display:none}
}
@media (max-width:960px){
  .head-cta .btn-line{display:none}
}
@media (max-width:960px){
  .hero-grid,.dealer{grid-template-columns:1fr;gap:44px}
  .cover{grid-template-columns:1fr 1fr;gap:34px}
  .cover>*:first-child{grid-column:1/-1}
  .steps{grid-template-columns:1fr 1fr}
  .step:nth-child(2){border-right:0}
  .step:nth-child(odd){padding-left:0}
  .step:nth-child(even){padding-left:26px;border-left:1px solid var(--hair)}
  .curve{display:none}
  .fgrid{grid-template-columns:1fr 1fr}
}
@media (max-width:700px){
  .langpick summary{padding:10px 8px;font-size:.92rem}
  .head{gap:12px;min-height:62px}
  [id]{scroll-margin-top:76px}
  .logo svg{width:26px;height:26px}
  .logo-type{font-size:1.4rem}
  .head-cta .btn{padding:11px 14px;font-size:.98rem}
  .hero,.final{background-size:1100px auto}
  .hero{background-position:left top}
  .final{background-position:left bottom}
}
@media (max-width:560px){
  .head{gap:10px}
  .head-cta .btn{padding:10px 13px;font-size:.95rem}
  .logo-type{display:none}
  .hero-actions{flex-direction:column;align-items:stretch}
  .hero-actions .btn{width:100%}
  section,.final{padding:64px 0}
  .hero{padding:58px 0 46px}
  .stats{grid-template-columns:1fr 1fr}
  .grid6,.paths,.fld2{grid-template-columns:1fr}
  .cover{grid-template-columns:1fr;gap:38px}
  .cover>*:first-child{grid-column:auto}
  .steps{grid-template-columns:1fr}
  .step{border-right:0!important;border-left:0!important;padding-left:0!important;padding-right:0}
  .frame{padding:32px 24px}
  .fgrid{grid-template-columns:1fr}
  h1{font-size:clamp(1.95rem,8.6vw,2.7rem)}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}
/* ---- Rechtsseiten ------------------------------------------------------- */
.legal-page{padding:52px 0 96px}
.legal-crumb{margin-bottom:26px;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px}
.legal-crumb a{text-decoration:none}
.legal-home{font-family:"Barlow Condensed",sans-serif;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;font-size:.95rem;color:var(--text);
  border-bottom:1px solid var(--hair);padding-bottom:3px}
.legal-home:hover{color:var(--orange);border-color:var(--orange)}
.legal-where{color:var(--dim)}
.legal-where a{color:var(--dim)}
.legal-where a:hover{color:var(--orange)}
/* Untergrenze so, dass "Geschäftsbedingungen" bei 360 px in eine Zeile
   passt — Archivo Black ist breit, und ein hart abgeschnittenes Wort in
   der Ueberschrift sieht nach Fehler aus. */
.legal-page h1{font-size:clamp(1.5rem,4.6vw,3rem);max-width:22ch;margin:0 0 12px;overflow-wrap:break-word}
.legal-meta{color:var(--dim);font-size:.92rem;margin:0 0 22px}
.legal-page .rule{margin-bottom:44px}

.legal-body{max-width:72ch;font-size:1.02rem;line-height:1.75;color:var(--text);overflow-wrap:break-word}
.legal-body>*:first-child{margin-top:0}
.legal-body h2{font-family:"Archivo Black",sans-serif;font-weight:400;font-size:1.45rem;
  line-height:1.25;letter-spacing:-.01em;margin:48px 0 14px}
.legal-body h3{font-family:"Barlow Condensed",sans-serif;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;font-size:1.05rem;margin:32px 0 10px}
.legal-body h4{font-weight:600;font-size:1rem;margin:24px 0 8px}
.legal-body p{margin:0 0 16px}
.legal-body ul,.legal-body ol{margin:0 0 18px;padding-left:22px}
.legal-body li{margin-bottom:8px}
.legal-body li::marker{color:var(--orange)}
.legal-body a{color:var(--orange);text-underline-offset:3px}
.legal-body strong,.legal-body b{font-weight:600}
.legal-body address{font-style:normal}
.legal-body hr{border:0;border-top:1px solid var(--hair);margin:34px 0}
.legal-body blockquote{margin:0 0 18px;padding-left:16px;border-left:3px solid var(--hair);color:var(--dim)}
.legal-body table{border-collapse:collapse;width:100%;margin:0 0 20px;font-size:.95rem}
.legal-body th,.legal-body td{border:1px solid var(--hair);padding:9px 12px;text-align:left;vertical-align:top}
.legal-body th{font-family:"Barlow Condensed",sans-serif;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--dim)}
.legal-body img{max-width:100%;height:auto}

.legal-draft{border-left:3px solid var(--orange);padding:13px 0 13px 16px;margin:0 0 30px;
  color:var(--dim);font-size:.95rem}

.legal-list{list-style:none;margin:0;padding:0;max-width:72ch}
.legal-list li{border-top:1px solid var(--hair);padding:18px 0}
.legal-list li:last-child{border-bottom:1px solid var(--hair)}
.legal-list a{font-family:"Barlow Condensed",sans-serif;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;font-size:1.12rem;color:var(--text);text-decoration:none}
.legal-list a:hover{color:var(--orange)}

.legal-nav{margin-top:72px;padding-top:32px;border-top:1px solid var(--hair)}
.legal-nav h2{font-family:"Barlow Condensed",sans-serif;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;font-size:.9rem;color:var(--dim);margin:0 0 16px}
.legal-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 26px}
.legal-nav a{color:var(--text);text-decoration:none;border-bottom:1px solid var(--hair);padding-bottom:2px}
.legal-nav a:hover{color:var(--orange);border-color:var(--orange)}
.legal-nav a[aria-current]{color:var(--orange);border-color:var(--orange)}

.legal-back{margin-top:40px}
.legal-back .btn{gap:.55em}

@media (max-width:560px){
  .legal-page{padding:34px 0 66px}
  .legal-body{font-size:1rem}
  .legal-body table{display:block;overflow-x:auto}
  /* Auf schmalen Geraeten trennen statt ueberlaufen. Die Sprache steht im
     lang-Attribut, der Browser trennt also nach den Regeln der jeweiligen
     Sprache — noetig vor allem fuer deutsche Komposita wie
     "Verbraucherstreitbeilegungsgesetz". */
  .legal-page h1,.legal-body{hyphens:auto}
}