/* Lokal gehostete Schrift für Titel/Preis (OFL, kein Consent nötig) */
@font-face{
  font-family:'Barlow Condensed';font-style:normal;font-weight:900;font-display:swap;
  src:url('/assets/fonts/barlow-condensed-900-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Barlow Condensed';font-style:normal;font-weight:900;font-display:swap;
  src:url('/assets/fonts/barlow-condensed-900-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+1E00-1E9F,U+2020,U+20A0-20AB,U+2C60-2C7F,U+A720-A7FF;
}

/* =====================================================================
   AHSW Fahrzeugdatenbank — Basis-Stylesheet
   Design-Tokens von autohaus-suedwest-leipzig.de übernommen.
   ===================================================================== */
@font-face{
  font-family:'Barlow Condensed';font-style:normal;font-weight:800;font-display:swap;
  src:url('/assets/fonts/barlow-condensed-800-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Barlow Condensed';font-style:normal;font-weight:800;font-display:swap;
  src:url('/assets/fonts/barlow-condensed-800-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+1E00-1E9F,U+2020,U+20A0-20AB,U+2C60-2C7F,U+A720-A7FF;
}

@font-face{
  font-family:'Source Sans 3';font-style:normal;font-weight:700 900;font-display:swap;
  src:url('/assets/fonts/source-sans3-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Source Sans 3';font-style:normal;font-weight:700 900;font-display:swap;
  src:url('/assets/fonts/source-sans3-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+1E00-1E9F,U+2020,U+20A0-20AB,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  --btn-bg:#f4f5f8; --btn-bg-hover:#e8eaef; --btn-bd:#b3b9c3; --btn-fg:#2d2d2d; --rot:#c7081b;
  --rot-dark:#a30616;
  --dunkel:#2d2d2d;
  --dunkel-2:#292929;
  --grau:#808080;
  --grau-hell:#e4e4e4;
  --bg:#f0f0f0;
  --weiss:#ffffff;
  --schatten:0 2px 10px rgba(0,0,0,.08);
  --radius:6px;
  --font:'Source Sans Pro','Segoe UI',Arial,Helvetica,sans-serif;
  --font-display:'Barlow Condensed','Arial Narrow',var(--font);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--font);
  color:var(--dunkel);
  background:var(--bg);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--rot);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}

/* --- Kopf/Fuß --- */
.site-header{
  background:var(--dunkel-2);
  color:#fff;
  padding:.75rem 1rem;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:.5rem;
}
.site-header .brand{display:flex;align-items:center;gap:.6rem;font-weight:700;font-size:1.15rem;color:#fff}
.site-header .brand .accent{color:var(--rot)}
.site-footer{
  background:var(--dunkel-2);color:#bbb;padding:1.25rem 1rem;margin-top:2rem;
  font-size:.9rem;text-align:center;
}
.site-footer a{color:#ddd}

/* --- Layout --- */
.container{max-width:1200px;margin:0 auto;padding:1rem}
.center-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.5rem}

/* --- Buttons --- */
/* Einheitliches Button-Bild: dunkelgrau, weiße Schrift, roter Rand nur links */
.btn{
  display:inline-block;background:var(--btn-bg);color:var(--btn-fg);
  border:1px solid var(--btn-bd);
  border-left:3px solid var(--rot);
  padding:.42rem .85rem .42rem .75rem;   /* links um die Randbreite gekürzt */
  border-radius:var(--radius);font-size:.9rem;font-weight:600;line-height:1.3;
  cursor:pointer;transition:background .15s ease,border-color .15s ease;text-align:center;
}
.btn:hover{background:var(--btn-bg-hover);border-color:#98a0ad;
  border-left-color:var(--rot);text-decoration:none;color:var(--btn-fg)}
.btn:focus-visible{outline:2px solid var(--rot);outline-offset:2px}
.btn[disabled],.btn.is-off{opacity:.45;cursor:default}

/* Varianten erben Farbe und Rand — sie unterscheiden sich nur in der Größe */
.btn--ghost{background:var(--btn-bg);color:var(--btn-fg);border:1px solid var(--btn-bd);border-left:3px solid var(--rot)}
.btn--ghost:hover{background:var(--btn-bg-hover);border-color:#98a0ad;border-left-color:var(--rot);color:var(--btn-fg)}
.btn--block{display:block;width:100%}

/* --- Karten/Formulare --- */
.card{background:#fff;border-radius:var(--radius);box-shadow:var(--schatten);padding:1.75rem}
.form-group{margin-bottom:1.1rem}
.form-group label{display:block;font-weight:600;margin-bottom:.35rem;font-size:.95rem}
.form-control{
  width:100%;padding:.7rem .85rem;border:2px solid var(--grau-hell);border-radius:var(--radius);
  font-size:1rem;font-family:inherit;background:#fff;
}
.form-control:focus{outline:none;border-color:var(--rot);box-shadow:0 0 0 3px rgba(199,8,27,.08)}
/* Dropdowns exakt wie Eingabefelder (eigener Pfeil statt System-Look) */
select.form-control{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;background-color:#fff;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23808080' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat;background-position:right .8rem center;padding-right:2.3rem;line-height:1.35;
}
select.form-control::-ms-expand{display:none}
input[type=file].form-control{padding:.55rem .6rem;font-size:.9rem;background:#fff}
textarea.form-control{line-height:1.5}
.hint{color:var(--grau);font-size:.85rem;margin-top:.3rem}

/* --- Meldungen --- */
.alert{padding:.85rem 1rem;border-radius:var(--radius);margin-bottom:1rem;font-size:.95rem}
.alert--error{background:#fdecec;color:#8a1010;border:1px solid #f3b6b6}
.alert--ok{background:#eaf7ec;color:#1c6b2a;border:1px solid #b6dfbd}
.alert--info{background:#eef4fb;color:#1c4b7a;border:1px solid #b6cef3}

/* --- Vorschaltseite (Baustelle) --- */
.coming-soon{max-width:640px;text-align:center;padding:0;overflow:hidden}
.coming-soon .logo-band{
  background:var(--dunkel-2);
  padding:1.75rem 1.5rem;
  text-align:center;
}
.coming-soon .logo-band img{max-width:100%;max-height:140px;margin:0 auto;display:block}
.coming-soon .logo-band .brand-text{font-size:1.8rem;font-weight:700;color:#fff}
.coming-soon .logo-band .brand-text .accent{color:var(--rot)}
.coming-soon .cs-body{padding:2rem 1.75rem}
.coming-soon h1{color:var(--dunkel);font-size:2rem;margin:.2rem 0 .6rem}
.coming-soon .bar{height:6px;background:var(--grau-hell);border-radius:3px;overflow:hidden;margin:1.5rem 0}
.coming-soon .bar>span{display:block;height:100%;width:45%;background:var(--rot);animation:progress 2.4s ease-in-out infinite}
@keyframes progress{0%{margin-left:-45%}100%{margin-left:100%}}
.coming-soon .kontakt{margin-top:1.5rem;font-size:.95rem;color:var(--grau)}
.coming-soon .kontakt a{font-weight:600}

/* --- 2FA/Login --- */
.auth-box{width:100%;max-width:420px}
.auth-box--wide{max-width:640px}
.recovery-box{background:#fff7e6;border:1px solid #f0d089;border-radius:var(--radius);padding:1rem;margin:1rem 0}
.recovery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.5rem;margin-top:.6rem}
.recovery-grid span{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:1rem;letter-spacing:.08em;
  background:#2d2d2d;color:#fff;padding:.4rem .5rem;border-radius:4px;text-align:center}
.auth-box h1{font-size:1.5rem;margin:0 0 .25rem}
.auth-box .sub{color:var(--grau);margin:0 0 1.5rem;font-size:.95rem}
.qr-wrap{text-align:center;margin:1rem 0}
.qr-wrap img{margin:0 auto;border:1px solid var(--grau-hell);border-radius:var(--radius)}
.code-input{letter-spacing:.4em;text-align:center;font-size:1.4rem}

/* === Energielabel (Frontend + Backend) === */
.energy-label{border:1px solid #e0e3e7;border-radius:10px;padding:.85rem;background:#fff;font-size:.9rem}
.el-head{display:flex;justify-content:space-between;align-items:baseline;gap:.5rem;margin-bottom:.55rem}
.el-title{font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--grau)}
.el-class{font-size:.82rem;color:var(--grau)}
.el-class strong{font-size:1.15rem;color:var(--dunkel)}
.el-scale{display:flex;gap:3px;margin-bottom:.7rem}
.el-c{flex:1;text-align:center;font-weight:700;font-size:.78rem;color:#fff;padding:.24rem 0;border-radius:3px;opacity:.3}
.el-c.is-on{opacity:1;outline:2px solid var(--dunkel);outline-offset:1px}
.el-c--A{background:#0e8a3e}.el-c--B{background:#4fa832}.el-c--C{background:#9dc41d}
.el-c--D{background:#e8cc0a}.el-c--E{background:#f0a415}.el-c--F{background:#e8681c}.el-c--G{background:#d8231f}
.el-rows{display:grid;grid-template-columns:1fr auto;gap:.18rem .8rem;margin:0 0 .7rem}
.el-rows dt{color:var(--grau);font-size:.84rem}
.el-rows dd{margin:0;font-weight:600;text-align:right;white-space:nowrap;font-size:.84rem}
.el-costs{display:flex;flex-direction:column;gap:.5rem;border-top:1px solid #eef0f2;padding-top:.6rem}
.el-cost{display:flex;flex-direction:column}
.el-cl{font-size:.76rem;color:var(--grau)}
.el-cv{font-size:.9rem;color:var(--dunkel)}
.el-cn{font-size:.68rem;color:var(--grau)}
.el-note{font-size:.68rem;color:var(--grau);line-height:1.45;margin:.7rem 0 0;border-top:1px solid #eef0f2;padding-top:.5rem}
.el-note a{color:var(--grau);text-decoration:underline}
.energy-label--mini{padding:.6rem;margin-top:.65rem}
.energy-label--mini .el-rows dt,.energy-label--mini .el-rows dd,.energy-label--mini .el-cv{font-size:.76rem}
.energy-label--mini .el-cl{font-size:.7rem}
.energy-label--mini .el-cn{display:none}
.energy-label--mini .el-note{font-size:.62rem}

@media (max-width:600px){
  .card{padding:1.25rem}
  .site-header .brand{font-size:1rem}
}
