:root { --brand:#ed804d; --text:#111827; --muted:#6b7280; --ring: 0 0 0 3px rgba(237,128,77,.35); }
.dark { color-scheme: dark; }
/* Hero background helpers */
.hero-gradient{background-image:radial-gradient(ellipse 1000px 600px at 80% 0%,#ed804d,transparent);}
.dark .hero-gradient{background-image:radial-gradient(ellipse 1000px 600px at 80% 0%,#ed804d,transparent);}


/* --- global --- */
:focus-visible { outline: none; box-shadow: var(--ring); border-radius:.6rem; }
.skip-link { position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip-link:focus { left:1rem; top:1rem; width:auto; height:auto; padding:.5rem .75rem; background:white; border-radius:.5rem; z-index:50; }

.input { background:white; border:1px solid #e5e7eb; padding:.625rem .75rem; border-radius:.75rem; width:100%; transition: box-shadow .25s ease, transform .25s ease; }
.input:focus { box-shadow: 0 0 0 4px rgba(237,128,77,.18); transform: translateY(-1px); }
.label { display:block; font-size:.875rem; color:#374151; margin-bottom:.25rem; }
.helper { min-height:1rem; font-size:.75rem; color:#ef4444; }
.checkbox { width:1rem; height:1rem; }

.btn-primary,
.btn-outline { transition: transform .18s ease, box-shadow .18s ease, filter .18s ease; }
.btn-primary { background:var(--brand); color:white; padding:.625rem 1rem; border-radius:.75rem; display:inline-flex; gap:.5rem; align-items:center; justify-content:center; }
.btn-primary:hover { filter:brightness(.96); transform: translateY(-1px); box-shadow: 0 8px 16px rgba(237,128,77,.18); }
.btn-primary:active { transform: translateY(0); box-shadow: none; }
.btn-outline { border:1px solid #e5e7eb; padding:.625rem 1rem; border-radius:.75rem; display:inline-flex; gap:.5rem; align-items:center; justify-content:center; }
.btn-outline:hover { background: rgba(237,128,77,.08); transform: translateY(-1px); }
.btn-icon { border:1px solid #e5e7eb; padding:.5rem .6rem; border-radius:.75rem; transition: transform .18s ease; }
.btn-icon:hover { transform: translateY(-1px); }
.link { color:#111827; text-decoration: underline; text-underline-offset: 3px; }

.nav-link { color:#374151; display:inline-flex; align-items:center; gap:.4rem; transition: color .15s ease; }
.nav-link:hover { color: var(--brand); }

.card { border:1px solid #e5e7eb; background:white; padding:1.25rem; border-radius:1rem; transition: transform .25s ease, box-shadow .25s ease; }
.card:hover { transform: translateY(-2px); box-shadow: 0 16px 28px rgba(17,24,39,.10); }

.card-skeleton { height:14rem; border:1px solid #e5e7eb; border-radius:1rem; background:
  linear-gradient(90deg, #f3f4f6 25%, #e5e7eb 37%, #f3f4f6 63%); background-size:400% 100%; animation: shimmer 1.4s ease infinite; }
@keyframes shimmer { 0%{background-position:100% 0}100%{background-position:0 0} }

.back-to-top { position:fixed; right:1rem; bottom:1rem; opacity:0; pointer-events:none; transform:translateY(8px) scale(.98);
  transition:.25s ease; border:1px solid #e5e7eb; background:white; border-radius:.75rem; padding:.5rem .75rem; z-index:40; }
.back-to-top.show { opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }

.cookie-banner { position:fixed; left:0; right:0; bottom:0; background:white; border-top:1px solid #e5e7eb;
  padding:.75rem 1rem; display:none; z-index:50; }
.cookie-banner .container { max-width:72rem; margin:0 auto; display:flex; flex-direction:column; gap:1rem; align-items:flex-start; }
.cookie-banner p { font-size:.875rem; margin:0; }
.cookie-banner .actions { display:flex; gap:.5rem; }
@media (min-width:640px){
  .cookie-banner .container{ flex-direction:row; align-items:center; justify-content:space-between; }
}

/* VEHICLE CARD */
.vehicle-card { display:flex; flex-direction:column; height:100%; border:1px solid #e5e7eb; border-radius:1rem; overflow:hidden; background:white; transition:box-shadow .25s ease, transform .25s ease; }
.vehicle-card:hover { box-shadow: 0 14px 24px rgba(17,24,39,.10); transform: translateY(-2px); }
.vehicle-card .thumb { aspect-ratio: 16/9; background:#f3f4f6; position:relative; overflow:hidden; }
.vehicle-card .thumb img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; transition: transform .6s cubic-bezier(.22,1,.36,1); }
.vehicle-card:hover .thumb img { transform: scale(1.03); }
.vehicle-card .body { display:flex; flex-direction:column; gap:.5rem; padding:1rem; flex:1; }
.vehicle-card .header { display:grid; grid-template-columns: 1fr auto; align-items:start; gap:.5rem; }
.vehicle-card .title { font-weight:600; line-height:1.25; display:-webkit-box; /* stylelint-disable-next-line property-no-unknown */ -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.5rem; }
.vehicle-card .pricePill { display:inline-flex; align-items:center; justify-content:center; padding:.25rem .6rem; border-radius:.5rem; font-weight:600; font-size:.9rem; background:#ed804d; color:#fff; }
.vehicle-card .meta { font-size:.85rem; color:#6b7280; }
.vehicle-card .year-line { font-size:.85rem; color:#6b7280; margin-top:-.25rem; }
.vehicle-card .footer { margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
.vehicle-card .details { border:1px solid #ed804d; color:#ed804d; padding:.4rem .75rem; border-radius:.6rem; transition: background .2s ease, color .2s ease; }
.vehicle-card .details:hover { background:#ed804d; color:#fff; }

/* Impressum/Prose Anpassungen im Light-Mode */
.prose { color:#111827; }
.prose a { color: var(--brand); text-decoration: underline; text-underline-offset: 3px; }
.prose a:hover { color:#c86a3f; }

/* SERVICE ICONS + Info-Liste */
.service-card { display:flex; flex-direction:column; gap:.5rem; }
.service-icon { width:3rem; height:3rem; display:grid; place-items:center; background:rgba(237,128,77,.12); color:var(--brand); border-radius:.75rem; margin-bottom:.25rem; transition: transform .25s ease; }
.service-card:hover .service-icon { transform: translateY(-2px) rotate(-1deg); }
.info-list { display:grid; gap:.6rem; }
.info-item { display:flex; align-items:center; gap:.6rem; }
.info-item svg { color:var(--brand); }
.info-item .w-28 { width:7rem; }

/* Footer Links (Impressum/Datenschutz-Seiten) */
.footer-link { color:#374151; }
.footer-link:hover { color: var(--brand); text-decoration: underline; text-underline-offset: 3px; }

/* --- Scroll-Reveal Animations (langsamer & raffinierter) --- */
.reveal{opacity:0; transform:translateY(18px); transition:opacity .85s cubic-bezier(.22,1,.36,1), transform .85s cubic-bezier(.22,1,.36,1); will-change:opacity,transform;}
.reveal[data-reveal="up"]{transform:translateY(18px);}
.reveal[data-reveal="down"]{transform:translateY(-18px);}
.reveal[data-reveal="left"]{transform:translateX(-24px);}
.reveal[data-reveal="right"]{transform:translateX(24px);}
.reveal[data-reveal="zoom-in"]{transform:scale(.96); }
.reveal.is-visible{opacity:1; transform:none;}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1 !important; transform:none !important; transition:none !important;}
}

/* --- Mobile-Menü Panel --- */
.menu-panel { overflow:hidden; max-height:0; opacity:0; transition:max-height .35s cubic-bezier(.22,1,.36,1), opacity .25s ease; }
.menu-panel.open { max-height:420px; opacity:0.5; }

/* --- Dark Mode --- */
.dark body { background:#0b0f14; color:#e8edf4; }
.dark .bg-gray-50{ background:#0f141a !important; }
.dark .text-gray-600{ color:#9aa4b2 !important; }
.dark .text-gray-500{ color:#c5d0dd !important; }
.dark .border{ border-color:#223042 !important; }

.dark .input { background:#0f141a; border-color:#2a3a4f; color:#e8edf4; }
.dark .btn-primary { background: var(--brand); color: #111; }
.dark .btn-outline { border-color:#2a3a4f; color:#dbe5f1; }
.dark .btn-icon { border-color:#2a3a4f; color:#eaf1fb; }
.dark .link { color:#eaf1fb; }
.dark .nav-link { color:#eaf1fb; }
.dark .nav-link:hover { color:#ffd9c7; }
.dark header { background:rgba(11,15,20,.88) !important; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom-color:#223042; }
.dark #mobileMenu { background:#000; }
.dark #mobileMenu a { color:#eaf1fb; }
.dark #mobileMenu a:hover { color:#ffd9c7; }
.dark .card, .dark .back-to-top, .dark .cookie-banner { background:#0f141a; border-color:#263346; color:#e8edf4; }
.dark .vehicle-card { background:#0f141a; border-color:#263346; }
.dark .vehicle-card .meta { color:#9aa4b2; }
.dark .vehicle-card .details { border-color:#ed804d; color:#ffd9c7; }
.dark .badge { background: rgba(237,128,77,.18); color:#ffd9c7; border-color: rgba(237,128,77,.35); }

/* Cookie Modal */
.cookie-modal{ position:fixed; inset:0; z-index:60; display:block; }
.cookie-modal.hidden{ display:none; }
.cookie-modal__backdrop{ position:absolute; inset:0; background:rgba(237,128,77,.45); }
.cookie-modal__dialog{ position:relative; margin:6vh auto; max-width:680px; background:#fff; border:1px solid #e5e7eb; border-radius:1rem; overflow:hidden; box-shadow:0 24px 48px rgba(0,0,0,.18); }
.cookie-modal__header{ display:flex; align-items:center; justify-content:space-between; padding:1rem 1.25rem; border-bottom:1px solid #e5e7eb; }
.cookie-modal__title{ font-size:1.125rem; font-weight:600; }
.cookie-modal__body{ padding:1rem 1.25rem; display:grid; gap:.75rem; }
.cookie-option{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.75rem 0; border-bottom:1px dashed #e5e7eb; }
.cookie-option:last-child{ border-bottom:none; }
.cookie-option__title{ font-weight:600; }
.cookie-option__desc{ font-size:.9rem; color:#6b7280; margin-top:.125rem; }
.cookie-modal__footer{ display:flex; gap:.5rem; justify-content:flex-end; padding:1rem 1.25rem; border-top:1px solid #e5e7eb; }

.no-scroll{ overflow:hidden; }

/* Dark mode for modal */
.dark .cookie-modal__dialog{ background:#0f141a; border-color:#263346; color:#e8edf4; }
.dark .cookie-modal__header{ border-color:#263346; }
.dark .cookie-modal__footer{ border-color:#263346; }
.dark .cookie-option__desc{ color:#9aa4b2; }