/* Startseite: eindeutig gekapselte Hero-Korrektur. Keine Header-/Navigationsregeln. */
.sk-home-hero{
  position:relative !important;
  isolation:isolate !important;
  min-height:520px !important;
  overflow:hidden !important;
  background-color:#071426 !important;
  background-image:url('/assets/hero-home-1280.webp') !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center 52% !important;
}
.sk-home-hero::before,
.sk-home-hero::after{
  content:none !important;
  display:none !important;
  background:none !important;
}
.sk-home-hero > .sk-home-hero-grid{
  position:relative !important;
  width:min(94vw,1440px) !important;
  max-width:1440px !important;
  min-height:520px !important;
  margin:0 auto !important;
  padding:70px 0 34px !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 330px !important;
  gap:clamp(42px,5vw,76px) !important;
  align-items:center !important;
}
.sk-home-hero-content{
  position:relative !important;
  z-index:2 !important;
  width:min(100%,560px) !important;
  max-width:560px !important;
  margin:0 !important;
  padding:28px 30px 26px !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:20px !important;
  background:linear-gradient(135deg,rgba(5,13,25,.48),rgba(5,13,25,.28)) !important;
  box-shadow:0 20px 50px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.08) !important;
  backdrop-filter:blur(7px) saturate(112%) !important;
  -webkit-backdrop-filter:blur(7px) saturate(112%) !important;
  transform:none !important;
}
.sk-home-hero-content .sk-eyebrow{
  margin:0 0 12px !important;
}
.sk-home-hero-content h1{
  max-width:520px !important;
  margin:0 0 16px !important;
  font-size:clamp(36px,3.1vw,48px) !important;
  line-height:1.08 !important;
  letter-spacing:-.035em !important;
  text-shadow:0 3px 18px rgba(0,0,0,.58) !important;
}
.sk-home-hero-content .sk-lead{
  max-width:510px !important;
  margin:0 0 22px !important;
  line-height:1.55 !important;
  color:#eef4fa !important;
  text-shadow:0 2px 10px rgba(0,0,0,.65) !important;
}
.sk-home-hero-content .sk-hero-copy{
  width:100% !important;
  margin:0 !important;
  transform:none !important;
}
.sk-home-hero-content .sk-hero-actions{
  width:100% !important;
  margin:0 !important;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
}
.sk-home-hero-content .sk-hero-actions > .sk-btn{
  width:100% !important;
  min-width:0 !important;
  height:42px !important;
  padding:0 12px !important;
  white-space:nowrap !important;
}
.sk-home-service-badge{
  position:absolute !important;
  z-index:5 !important;
  top:24px !important;
  left:50% !important;
  right:auto !important;
  bottom:auto !important;
  transform:translateX(-50%) !important;
  width:max-content !important;
  max-width:calc(100% - 32px) !important;
  margin:0 !important;
  padding:9px 15px !important;
  white-space:nowrap !important;
}
.sk-home-offer{
  position:relative !important;
  z-index:2 !important;
  justify-self:end !important;
  align-self:center !important;
  width:329px !important;
  max-width:329px !important;
  margin:0 !important;
}
@media (max-width:900px){
  .sk-home-hero > .sk-home-hero-grid{
    grid-template-columns:minmax(0,1fr) 300px !important;
    gap:26px !important;
  }
  .sk-home-hero-content{
    padding:24px !important;
  }
  .sk-home-hero-content h1{
    font-size:clamp(34px,4vw,42px) !important;
  }
  .sk-home-offer{
    width:300px !important;
    max-width:300px !important;
  }
}
@media (max-width:720px){
  .sk-home-hero{
    min-height:auto !important;
    background-position:58% center !important;
  }
  .sk-home-hero > .sk-home-hero-grid{
    width:min(100% - 28px,600px) !important;
    min-height:auto !important;
    padding:72px 0 30px !important;
    grid-template-columns:1fr !important;
    gap:24px !important;
  }
  .sk-home-hero-content{
    width:100% !important;
    max-width:none !important;
    padding:22px 20px !important;
    background:linear-gradient(135deg,rgba(5,13,25,.60),rgba(5,13,25,.42)) !important;
  }
  .sk-home-hero-content .sk-hero-actions{
    grid-template-columns:1fr !important;
  }
  .sk-home-offer{
    width:100% !important;
    max-width:360px !important;
    justify-self:center !important;
  }
  .sk-home-service-badge{
    top:18px !important;
    font-size:11px !important;
    white-space:normal !important;
  }
}


/* Precision correction 2026-07-24: ONLY header size + service badge position. */
@media (min-width:641px){
  .sk-header{
    height:72px !important;
    min-height:72px !important;
    max-height:72px !important;
  }
  .sk-header > .sk-container{
    height:72px !important;
    min-height:72px !important;
    grid-template-columns:150px 1fr auto !important;
    gap:32px !important;
  }
  .sk-header .sk-container > a:first-child,
  .sk-header a[href="#start"]:has(.sk-logo){
    width:150px !important;
    min-width:150px !important;
    height:72px !important;
    min-height:72px !important;
    padding:0 !important;
    align-items:center !important;
  }
  .sk-header .sk-logo{
    width:105px !important;
    min-width:0 !important;
    max-width:105px !important;
    height:auto !important;
    min-height:0 !important;
    max-height:62px !important;
    object-fit:contain !important;
  }
}
.sk-home-hero > .sk-home-hero-grid{position:relative !important;}
.sk-home-hero > .sk-home-hero-grid > .sk-home-service-badge{
  position:absolute !important;
  z-index:6 !important;
  top:24px !important;
  left:50% !important;
  right:auto !important;
  bottom:auto !important;
  transform:translateX(-50%) !important;
  margin:0 !important;
  width:max-content !important;
  max-width:calc(100% - 32px) !important;
  white-space:nowrap !important;
}
@media (max-width:720px){
  .sk-home-hero > .sk-home-hero-grid > .sk-home-service-badge{
    top:18px !important;
    white-space:normal !important;
    text-align:center !important;
  }
}

/* 2026-07-24 – definitive compact-header repair.
   Scope: public desktop header + vehicle-brand strip only. */
@media (min-width: 861px) {
  :root {
    --sk-fixed-header-height: 62px !important;
    --sk-header-fixed-height: 62px !important;
    --sk-fixed-brand-height: 38px !important;
  }

  html {
    scroll-padding-top: 100px !important;
  }
  body {
    padding-top: 100px !important;
  }

  .sk-header,
  .top {
    height: 62px !important;
    min-height: 62px !important;
    max-height: 62px !important;
  }

  .sk-header > .sk-container,
  .top > .container {
    height: 62px !important;
    min-height: 62px !important;
    max-height: 62px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    align-items: center !important;
  }

  .sk-header .sk-container > a:first-child,
  .top .container > a:first-child,
  .sk-header a[href="#start"]:has(.sk-logo) {
    height: 62px !important;
    min-height: 62px !important;
    max-height: 62px !important;
    padding: 3px 0 !important;
  }

  .sk-header .sk-logo,
  .top .logo,
  .sk-header img[src*="sofortkey-logo" i],
  .top img[src*="sofortkey-logo" i] {
    width: auto !important;
    height: 54px !important;
    min-height: 0 !important;
    max-height: 54px !important;
  }

  .sk-header .sk-nav,
  .top .sk-nav,
  .top .nav,
  .sk-header .sk-head-actions,
  .top .sk-head-actions {
    height: 62px !important;
    min-height: 62px !important;
    max-height: 62px !important;
  }

  .sk-header .sk-nav > a,
  .top .sk-nav > a,
  .top .nav > a {
    min-height: 32px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .sk-header .sk-top-cta,
  .top .sk-top-cta {
    height: 40px !important;
    min-height: 40px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .sk-brand-strip[data-sk-fixed-brand-strip="true"],
  .sk-header + .sk-brand-strip,
  .top + .sk-brand-strip,
  .sk-brand-strip {
    top: 62px !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
  }

  .sk-brand-strip .sk-container,
  .sk-brand-strip-track,
  .sk-brand-strip-inner {
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    align-items: center !important;
  }
}
