@font-face{font-family:OKDisplay;src:url('fonts/BarlowCondensed-SemiBold.ttf') format('truetype');font-weight:600;font-style:normal;font-display:swap}
html:root{--at-bg:#fff;--at-surface:#f2f2f0;--at-ink:#191919;--at-muted:#626262;--at-line:#d3d3d0;--at-red:#cb0029}
html[data-theme="dark"]{--at-bg:#111;--at-surface:#1c1c1c;--at-ink:#f1f1ef;--at-muted:#b5b5b2;--at-line:#41413f;--at-red:#ed1746}
html:root body{background:var(--at-bg);color:var(--at-ink);font-family:Arial,"Segoe UI",sans-serif}
html:root .wrap{width:min(1280px,calc(100% - 96px))}
html:root header{background:var(--at-bg);color:var(--at-ink);border-bottom:1px solid var(--at-line);box-shadow:none;backdrop-filter:none}
html:root header .nav{min-height:88px}
html:root header :is(.brand,.brand small,nav a){color:var(--at-ink)}
html:root header nav{gap:28px;font-size:11px;letter-spacing:.07em}
html:root header nav a:hover{color:var(--at-red)}
html:root header .brand{font-size:18px;letter-spacing:.015em}
html:root header .brand img{width:44px}
html:root header .brand small{font-size:8px;letter-spacing:.15em}
html:root header .theme-toggle,html:root header .menu{background:transparent;color:var(--at-ink);border:1px solid var(--at-line);border-radius:0;padding:11px 14px;font-size:11px}
html:root header .btn{background:transparent;border:0;border-bottom:2px solid var(--at-red);color:var(--at-ink);border-radius:0;padding:10px 0;margin-left:8px}
html:root .hero-modern.wrap{width:100%;max-width:none;min-height:calc(100svh - 88px);height:auto;position:relative;margin:0;padding:90px max(48px,calc((100vw - 1280px)/2)) 72px;display:flex;align-items:flex-end;border:0;border-radius:0}
html:root .hero-copy{position:relative;z-index:2;padding:0;max-width:800px;color:#fff}
html:root .hero-copy .atelier-eyebrow{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:#fff;margin:0 0 20px;max-width:none}
html:root .hero-copy h1{font-family:OKDisplay,"Arial Narrow",Arial,sans-serif;font-size:clamp(88px,11vw,160px);font-weight:600;line-height:.88;letter-spacing:-.02em;color:#fff;margin:0}
html:root .hero-copy>p:not(.atelier-eyebrow):not(.hero-location){font-size:18px;line-height:1.5;color:#fff;margin:24px 0 30px;max-width:520px}
html:root .hero-copy .actions{gap:30px;align-items:center;flex-wrap:wrap;margin:0}
html:root .hero-copy .hero-stock{background:#fff;color:#151515;border:1px solid #fff;border-radius:0;min-height:54px;padding:15px 24px;font-size:12px;text-transform:uppercase;letter-spacing:.06em;gap:34px}
html:root .hero-copy .hero-stock:hover{background:var(--at-red);border-color:var(--at-red);color:#fff}
html:root .hero-call{border:0;border-bottom:1px solid #ffffffa6;border-radius:0;background:transparent;color:#fff;padding:14px 0;font-size:14px;max-width:none}
html:root .hero-copy .hero-location{font-size:11px!important;letter-spacing:.08em;margin:36px 0 0!important;color:#eee!important}
html:root .hero-visual{position:absolute;inset:0;width:100%;height:100%;border-radius:0;overflow:hidden}
html:root .hero-visual>img{width:100%;height:100%;object-fit:cover;object-position:50% 58%;filter:none}
html:root .hero-visual:after{display:block;content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0008,transparent 80%),linear-gradient(0deg,#000b,transparent 75%)}
html:root .hero-visual .photo-label{display:none}
.atelier-quicknav{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:25px 0;border-bottom:1px solid var(--at-line);color:var(--at-ink)}
.atelier-quicknav p{font-size:11px;letter-spacing:.09em;text-transform:uppercase;margin:0;color:var(--at-muted)}
.atelier-quicknav>div{display:flex;gap:32px}.atelier-quicknav a{font-size:12px;font-weight:600;letter-spacing:.04em;text-decoration:none;color:var(--at-ink)}.atelier-quicknav a span{color:var(--at-red);margin-left:12px}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger){padding:80px 0;color:var(--at-ink)}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .section-heading{margin-bottom:30px;gap:40px}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger,#kontakt) .section-heading h2{font-family:OKDisplay,Arial,sans-serif;font-size:clamp(44px,5vw,70px);font-weight:600;line-height:1;letter-spacing:-.015em;text-transform:uppercase;color:var(--at-ink)}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) :is(.section-heading p,.inventory-footer p,.inventory-count){color:var(--at-muted)}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .inventory-note{background:transparent;border:0;border-left:2px solid var(--at-red);border-radius:0;color:var(--at-muted);font-size:12px;padding:8px 12px}
html:root #fahrzeuge .inventory-toolbar{background:var(--at-surface);border:0;border-radius:0;padding:24px;gap:16px}
html:root #fahrzeuge .inventory-toolbar label{color:var(--at-muted);font-size:11px;letter-spacing:.03em}
html:root #fahrzeuge .inventory-toolbar :is(input,select){background:var(--at-bg);color:var(--at-ink);border:1px solid var(--at-line);border-radius:0;font-size:14px;padding:12px}
html:root #fahrzeuge #reset-filters{color:var(--at-ink);font-size:12px;text-decoration:underline;text-underline-offset:4px}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-grid{gap:36px 28px}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-card{border:0;border-bottom:1px solid var(--at-line);border-radius:0;background:transparent;color:var(--at-ink);box-shadow:none;display:flex;flex-direction:column;overflow:hidden}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-card:hover{transform:none;border-color:var(--at-red)}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-image{background:#e9e9e6;aspect-ratio:4/3}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-image img{object-fit:contain;width:100%;height:100%}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-badge{background:var(--at-bg);color:var(--at-ink);border:0;border-radius:0;font-size:10px;padding:8px 12px}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-body{padding:24px 16px;display:flex;flex-direction:column;flex:1;min-width:0}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-body h3{font-family:OKDisplay,Arial,sans-serif;font-size:32px;font-weight:600;letter-spacing:0;line-height:1.08;color:var(--at-ink);overflow-wrap:anywhere}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) :is(.car-brand,.car-subtitle,.car-specs,.car-price small){color:var(--at-muted)}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-brand{font-size:10px;letter-spacing:.12em}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-subtitle{font-size:13px;line-height:1.6}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-specs span{background:transparent;padding:0;margin:0;font-size:12px}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-price{color:var(--at-ink);border-color:var(--at-line);gap:12px;flex-wrap:wrap;margin-top:auto}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-price strong{font-size:25px;font-weight:600}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-open{border:1px solid var(--at-line);border-radius:0;background:transparent;color:var(--at-ink);font-size:12px;gap:20px}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-open:hover{background:var(--at-ink);color:var(--at-bg);border-color:var(--at-ink)}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .btn.secondary{background:transparent;color:var(--at-ink);border:1px solid var(--at-line);border-radius:0;font-size:12px;letter-spacing:.04em;padding:15px 22px}
html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .empty-state{color:var(--at-muted);border-color:var(--at-line)}
html:root #werkstatt.ref-service{background:var(--at-surface);color:var(--at-ink);padding:0 0 72px}
html:root #werkstatt>.wrap{width:100%;max-width:none}
html:root #werkstatt .ref-service-hero{display:grid;grid-template-columns:1fr 1fr;background:var(--at-bg);min-height:540px}
html:root #werkstatt .ref-service-hero>img{min-height:540px;height:100%;object-position:center;clip-path:polygon(0 0,100% 0,88% 100%,0 100%)}
html:root #werkstatt .ref-hero-copy{padding:64px 12% 64px 6%;color:var(--at-ink)}
html:root #werkstatt .ref-hero-copy>span{color:var(--at-muted);font-size:10px;letter-spacing:.13em}
html:root #werkstatt .ref-hero-copy h2{font-family:OKDisplay,Arial,sans-serif;font-size:clamp(42px,4.7vw,68px);text-transform:uppercase;line-height:1;letter-spacing:-.01em;color:var(--at-ink);margin:20px 0 24px}
html:root #werkstatt.ref-service p{color:var(--at-muted)}
html:root #werkstatt .ref-hero-copy p{font-size:15px;line-height:1.75}
html:root :is(.ref-button,#kontakt .btn){border-radius:0;background:var(--at-red);border-color:var(--at-red);color:#fff;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:16px 22px;min-height:50px}
html:root #werkstatt :is(.ref-service-heading,.ref-service-categories,.ref-photo-note){width:min(1280px,calc(100% - 96px));margin-left:auto;margin-right:auto}
html:root #werkstatt .ref-service-heading{margin-top:52px}
html:root #werkstatt .ref-service-heading h3{font-family:OKDisplay,Arial,sans-serif;font-size:36px;text-transform:uppercase;letter-spacing:0;color:var(--at-ink)}
html:root #werkstatt .ref-category{border-color:var(--at-line)}
html:root #werkstatt .ref-category summary strong{font-family:OKDisplay,Arial,sans-serif;font-size:32px;font-weight:600;text-transform:uppercase;letter-spacing:0;color:var(--at-ink)}
html:root #werkstatt .ref-category summary small{color:var(--at-muted);font-size:12px}
html:root #werkstatt .ref-expand{border:1px solid var(--at-line);border-radius:0;background:transparent;color:var(--at-ink);width:36px;height:36px}
html:root #werkstatt .ref-category[open] .ref-expand{border-color:var(--at-red);color:var(--at-red)}
html:root #werkstatt .ref-category-text h4{color:var(--at-ink)}
html:root #werkstatt .ref-text-link{color:var(--at-ink);font-size:12px}
html:root #werkstatt .ref-photo-note{color:var(--at-muted)}
html:root #uber-uns.ref-about{background:var(--at-bg);color:var(--at-ink);padding:80px 0}
html:root #uber-uns .ref-about-heading>span{color:var(--at-red);font-size:11px}
html:root #uber-uns h2{font-family:OKDisplay,Arial,sans-serif;font-size:clamp(52px,6vw,84px);line-height:1;text-transform:uppercase;letter-spacing:0;color:var(--at-ink)}
html:root #uber-uns p{color:var(--at-muted)}
html:root #uber-uns .ref-about-image img{height:480px;object-position:center}
html:root #uber-uns .ref-since{background:var(--at-bg);color:var(--at-ink);padding:28px 40px 8px 0;bottom:-1px;min-width:240px}
html:root #uber-uns .ref-since strong{font-family:OKDisplay,Arial,sans-serif;font-size:44px;text-transform:uppercase;letter-spacing:0}
html:root #uber-uns .ref-since span{font-size:12px;color:var(--at-muted)}
html:root #uber-uns .ref-about-bottom h3{font-family:OKDisplay,Arial,sans-serif;font-size:42px;line-height:1.08;text-transform:uppercase;letter-spacing:0;color:var(--at-ink)}
html:root #uber-uns .ref-about-bottom p{font-size:15px}
html:root #kontakt.contact{background:var(--at-surface);color:var(--at-ink);border-radius:0;border:0;padding:80px 0}
html:root #kontakt :is(h2,h3,address,.contact-hours dt,.contact-hours dd){color:var(--at-ink)}
html:root #kontakt :is(p,.section-heading p,.form-note,.form-privacy){color:var(--at-muted)}
html:root #kontakt :is(.contact-channel,.contact-visit){background:transparent;border-color:var(--at-line);border-radius:0}
html:root #kontakt :is(.contact-call,.contact-email,.contact-route){color:var(--at-ink)}
html:root #kontakt .contact-kicker{color:var(--at-red);font-size:10px;letter-spacing:.1em}
html:root #kontakt form{background:var(--at-bg);border:1px solid var(--at-line);border-radius:0;box-shadow:none;padding:32px}
html:root #kontakt form label{color:var(--at-ink);font-size:13px}
html:root #kontakt form :is(input,textarea,select){background:var(--at-bg);color:var(--at-ink);border:1px solid var(--at-line);border-radius:0;font-size:15px}
html:root footer{background:#101010;color:#bcbcbc;border-top:1px solid #343434;padding:36px 0}
html:root footer a{color:#eee;font-size:12px}
html:root :is(#urkunden,#karriere,#bewertungen){color:var(--at-ink)}
html:root :is(#urkunden,#karriere,#bewertungen) .section-heading p{color:var(--at-muted)}
html:root :is(a,button,summary,input,select,textarea):focus-visible{outline:3px solid #d23152;outline-offset:4px}
@media(max-width:1050px){html:root header nav{gap:16px;font-size:10px}html:root #werkstatt .ref-hero-copy{padding:40px 32px}html:root .hero-modern.wrap{min-height:720px}}
@media(max-width:700px){html:root .wrap{width:calc(100% - 40px)}html:root header .nav{min-height:74px}html:root header nav{background:var(--at-bg);color:var(--at-ink);border-color:var(--at-line)}html:root header nav a{font-size:12px}html:root header .brand img{width:38px}html:root .hero-modern.wrap{min-height:calc(100svh - 74px);padding:70px 24px 44px}html:root .hero-copy h1{font-size:96px}html:root .hero-copy .atelier-eyebrow{font-size:10px;letter-spacing:.12em}html:root .hero-copy>p:not(.atelier-eyebrow):not(.hero-location){font-size:16px;margin:20px 0 24px}html:root .hero-copy .actions{gap:16px}html:root .hero-copy .hero-stock{padding:14px 18px;min-height:48px;font-size:11px;gap:24px}html:root .hero-call{font-size:13px}html:root .hero-visual>img{object-position:55% center}html:root .hero-copy .hero-location{margin-top:24px!important}.atelier-quicknav{align-items:flex-start;flex-direction:column;gap:18px;padding:22px 0}.atelier-quicknav>div{gap:22px;flex-wrap:wrap}.atelier-quicknav a{font-size:11px}html:root :is(#fahrzeuge,#baumaschinen,#anhaenger){padding:48px 0}html:root #fahrzeuge .inventory-toolbar{padding:16px}html:root :is(#fahrzeuge,#baumaschinen,#anhaenger) .car-body{padding:22px 10px}html:root #werkstatt .ref-service-hero{grid-template-columns:1fr;min-height:0}html:root #werkstatt .ref-service-hero>img{height:270px;min-height:0;clip-path:polygon(0 0,100% 0,100% 88%,0 100%)}html:root #werkstatt .ref-hero-copy{padding:28px 24px 40px}html:root #werkstatt .ref-hero-copy h2{font-size:44px}html:root #werkstatt :is(.ref-service-heading,.ref-service-categories,.ref-photo-note){width:calc(100% - 40px)}html:root #werkstatt .ref-category summary strong{font-size:27px}html:root #werkstatt.ref-service{padding-bottom:40px}html:root #uber-uns.ref-about,html:root #kontakt.contact{padding:48px 0}html:root #uber-uns .ref-about-image img{height:330px}html:root #uber-uns .ref-since{padding:18px 20px 4px 0;min-width:195px}html:root #uber-uns .ref-since strong{font-size:36px}html:root #uber-uns .ref-about-bottom h3{font-size:36px}html:root #kontakt form{padding:22px}}
@media(prefers-reduced-motion:reduce){html:root *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
