/* Skaletz Marke · Entwurf 03.10.2026
   Einzige Stildatei der Marke-Bloecke. Flaechenfarben der Sektionen setzt Zero One
   (Site > Styling, Sektionsfarbe). Hier nur Tokens und Komponenten, kein #main-Override. */
:root{
  --sk-petrol:#00323c; --sk-petrol-tief:#002229; --sk-creme:#f5f0e7; --sk-papier:#fbf8f1;
  --sk-messing:#c38b53; --sk-messing-dunkel:#8c5b35; --sk-salbei:#a7d0cc; --sk-nebel:#deebe3;
  --sk-text-ruhig:#3d5a5f; --sk-linie:#e4ddd1;
  --sk-serif:'Cormorant Garamond',Georgia,serif;
}
/* Buttons: Hover invertiert immer (gefuellt -> Kontur, Kontur -> gefuellt). Rahmen in Kontextfarbe haelt die Form.
   Farben der Flaechen kommen aus den Zero-One-Feldern; hier nur Kontext und Rahmen. Bei Umsetzung nach assets/css/site.css. */
html{--sk-kontext:#00323C;--sk-cta-fill:transparent!important;--sk-cta-text:#00323C!important}
:is(.uk-light,.uk-section-secondary,.uk-section-primary,.sk-hero){--sk-kontext:#FBF8F1;--sk-cta-text:#FBF8F1!important}
:is(.uk-button.uk-button-primary,.uk-button.uk-button-secondary,.uk-button.uk-button-default,.editorial-cta,.hero-btn-primary,.kontakt-btn-primary,.cal-btn,.sk-flow-weiter,.pricing-jump-link,.biz-bruecke-termin,.biz-bruecke-weg,.bfm-btn,.bpa-btn,.bp-nv-btn,.sk-strecke-weiter){border:1px solid var(--sk-kontext)!important}
.sk-wrap{width:min(1240px,100% - 48px);margin-inline:auto}

/* Kicker, Titel, Lead */
.sk-kicker{display:flex;align-items:center;gap:12px;margin:0 0 22px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--sk-messing-dunkel)}
.sk-kicker::before{content:"";width:28px;height:1px;background:var(--sk-messing)}
:is(.uk-light,.uk-section-secondary,.uk-section-primary) .sk-kicker,.sk-hero .sk-kicker{color:var(--sk-salbei)}
.sk-titel{font-family:var(--sk-serif);font-weight:400;letter-spacing:-.025em;line-height:1;font-size:clamp(38px,5.4vw,76px);margin:0 0 28px;text-transform:none}
.sk-titel em{font-style:italic;color:var(--sk-text-ruhig)}
:is(.uk-light,.uk-section-secondary,.uk-section-primary) .sk-titel em,.sk-hero .sk-titel em{color:var(--sk-nebel)}
.sk-titel--xl{font-size:clamp(52px,8.4vw,120px);line-height:.95}
.sk-lead{font-size:clamp(16px,1.4vw,19px);line-height:1.65;color:var(--sk-text-ruhig);max-width:60ch;margin:0 0 32px}
:is(.uk-light,.uk-section-secondary,.uk-section-primary) .sk-lead{color:rgba(251,248,241,.82)}

/* Buttons und Textlink */
.sk-aktionen{display:flex;flex-wrap:wrap;gap:12px}
:is(.editorial-cta,.hero-btn-primary,.kontakt-btn-primary,.cal-btn,.sk-flow-weiter,.pricing-jump-link,.biz-bruecke-termin,.bfm-btn,.bpa-btn,.bp-nv-btn,.sk-strecke-weiter,.ls-sticky-btn,.pb-sticky-btn,.city-sticky-btn,.blog-sticky-btn):is(:hover,:focus-visible){background:transparent!important;color:var(--sk-kontext)!important;border:1px solid var(--sk-kontext)!important}
.uk-button.uk-button-text{display:inline-block;padding:0 0 6px;background:none!important;border:0!important;border-bottom:1px solid var(--sk-kontext)!important;border-radius:0;color:var(--sk-kontext)!important;font-size:17px;font-weight:500;letter-spacing:0;text-transform:none;line-height:1.4;box-shadow:none!important;transition:color .2s,border-color .2s}
.uk-button.uk-button-text::before,.uk-button.uk-button-text::after{display:none!important}
.uk-button.uk-button-text:hover,.uk-button.uk-button-text:focus-visible{color:var(--sk-messing-dunkel)!important;border-bottom-color:var(--sk-messing-dunkel)!important}
:is(.uk-light,.uk-section-secondary,.uk-section-primary,.sk-hero) .uk-button.uk-button-text:is(:hover,:focus-visible){color:var(--sk-messing)!important;border-bottom-color:var(--sk-messing)!important}
.sk-aktionen{align-items:center;gap:12px 32px}
.uk-checkbox,.uk-radio{border:1px solid var(--sk-kontext)!important}
.sk-pfeil-btn{margin-left:10px;color:var(--sk-messing)}
.sk-tlink{display:inline-block;margin-top:8px;border-bottom:1px solid var(--sk-messing);padding-bottom:3px;font-size:13px;letter-spacing:.04em;color:inherit!important;text-decoration:none!important}
.sk-tlink:hover{color:var(--sk-messing-dunkel)!important}
.sk-tlink:focus-visible,.sk-zeile:focus-visible{outline:2px solid var(--sk-messing);outline-offset:3px}

/* Hero */
.sk-hero{position:relative;min-height:calc(100dvh - 110px);display:flex;align-items:flex-end;overflow:hidden;isolation:isolate;background:var(--sk-petrol);color:var(--sk-papier)}
.sk-hero-bild{position:absolute;inset:0;z-index:-2}
.sk-hero-bild img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.78);z-index:-2}
.sk-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(0,32,39,.94),rgba(0,37,43,.68) 45%,rgba(0,37,43,.04) 82%),linear-gradient(0deg,rgba(0,32,39,.6),transparent 40%)}
.sk-hero-text{padding:80px 0 72px}.sk-hero-text>*{max-width:900px}
.sk-hero .sk-titel{color:var(--sk-papier)}
.sk-claim{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(251,248,241,.8);margin:0 0 20px}
.sk-hero .sk-lead{color:rgba(251,248,241,.82);max-width:56ch}
.sk-hero-index{position:absolute;right:28px;bottom:26px;margin:0;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(251,248,241,.8)}
@media(max-width:700px){
  .sk-hero{display:block;min-height:0}.sk-hero::before{display:none}
  .sk-hero-bild{position:relative;display:block}.sk-hero-bild img{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:10/9;object-fit:cover;z-index:0}
  .sk-hero-text{padding:36px 0 58px}.sk-hero-index{display:none}
}

/* Seitenkopf ohne Foto */
.sk-hero--kopf{min-height:0}.sk-hero--kopf::before{display:none}
.sk-hero--kopf .sk-hero-text{padding:clamp(56px,8vw,110px) 0 clamp(48px,6vw,80px)}
.sk-hero--kopf .sk-titel--xl{font-size:clamp(46px,6.4vw,92px)}

/* Belegleiste */
.sk-leiste{padding:22px 0;display:flex;flex-wrap:wrap;justify-content:center;gap:14px 34px;list-style:none;margin:0;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#416167}
.sk-leiste li{display:flex;align-items:center;gap:34px;margin:0}
.sk-leiste li+li::before{content:"";flex:none;width:3px;height:3px;border-radius:50%;background:var(--sk-messing)}
@media(max-width:700px){.sk-leiste{flex-direction:column;align-items:center;gap:10px}.sk-leiste li+li::before{display:none}}

/* Bild und Text */
.sk-anspruch{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);align-items:center}
.sk-anspruch--rechts .sk-foto{order:2}
.sk-foto{margin:0;overflow:hidden;background:var(--sk-petrol)}
.sk-foto img{display:block;width:100%;height:auto;object-fit:cover;filter:saturate(.84);transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.sk-foto:hover img{transform:scale(1.04)}
.sk-fliess{font-size:17px;line-height:1.7;color:var(--sk-text-ruhig);margin-bottom:24px}
.sk-fliess p{margin:0 0 16px}.sk-fliess a{color:var(--sk-petrol)}
.sk-fliess blockquote{margin:24px 0;padding:0 0 0 22px;border-left:1px solid var(--sk-messing);font-family:var(--sk-serif);font-style:italic;font-size:24px;line-height:1.3;color:var(--sk-petrol)}
@media(max-width:860px){.sk-anspruch{grid-template-columns:1fr}.sk-anspruch--rechts .sk-foto{order:0}}

/* Leistungsliste */
.sk-zeilen{list-style:none;margin:48px 0 0;padding:0}
.sk-zeilen li{margin:0;border-top:1px solid rgba(167,208,204,.28)}.sk-zeilen li:last-child{border-bottom:1px solid rgba(167,208,204,.28)}
.sk-zeile{display:grid;grid-template-columns:70px 1fr auto auto;gap:24px;align-items:center;padding:34px 0;color:inherit!important;text-decoration:none!important;transition:padding .3s}
.sk-zeile:hover{padding-left:14px}
.sk-nr{font:400 20px var(--sk-serif);color:var(--sk-messing)}
.sk-zeile-titel{display:block;font:400 clamp(26px,2.6vw,36px)/1.05 var(--sk-serif)}
.sk-zeile-text{display:block;margin-top:10px;max-width:52ch;font-size:15px;line-height:1.6;opacity:.72}
.sk-zeile-preis{font-size:12px;letter-spacing:.12em;text-transform:uppercase;opacity:.8;white-space:nowrap}
.sk-pfeil{font-size:22px;color:var(--sk-messing);transition:transform .25s}.sk-zeile:hover .sk-pfeil{transform:translate(3px,-3px)}
.sk-zusatz{margin-top:56px}
.sk-zusatz ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0 32px}
.sk-zusatz li{margin:0;border-bottom:1px solid rgba(167,208,204,.2)}
.sk-zusatz a{display:flex;justify-content:space-between;gap:16px;padding:14px 0;font-size:14px;color:inherit!important;text-decoration:none!important}
.sk-zusatz small{font-size:11px;letter-spacing:.1em;text-transform:uppercase;opacity:.65;white-space:nowrap}
@media(max-width:860px){.sk-zusatz ul{grid-template-columns:1fr}}
@media(max-width:700px){.sk-zeile{grid-template-columns:36px 1fr}.sk-zeile-preis{grid-column:2}.sk-pfeil{display:none}}

/* Schritte */
.sk-schritte{list-style:none;margin:40px 0 32px;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #d9d3c8}
.sk-schritte li{margin:0;padding:28px 24px 8px 0}
.sk-schritte .sk-nr{font-size:34px;color:var(--sk-messing-dunkel)}
.sk-schritte h3{margin:12px 0 8px;font:500 22px var(--sk-serif);letter-spacing:0;text-transform:none}
.sk-schritte p{margin:0;font-size:14px;line-height:1.6;color:#4a6468}
@media(min-width:861px){.sk-schritte:has(li:nth-child(5)){grid-template-columns:repeat(3,1fr)}}
.sk-schritte.sk-schritte--liste{grid-template-columns:1fr!important;border-top:0;margin-top:24px}
.sk-schritte--liste li{display:grid;grid-template-columns:44px 1fr;column-gap:12px;padding:14px 0;border-top:1px solid #d9d3c8}
.sk-schritte--liste .sk-nr{grid-row:span 2;font-size:24px}.sk-schritte--liste h3{margin:0 0 4px;font-size:20px}
@media(max-width:860px){.sk-schritte{grid-template-columns:1fr 1fr}}@media(max-width:520px){.sk-schritte{grid-template-columns:1fr}}

/* Paketreihe */
.sk-pakete{margin:48px 0}
.sk-pakete-titel{font:400 clamp(26px,2.6vw,34px)/1.1 var(--sk-serif);margin:0 0 8px;text-transform:none;letter-spacing:-.01em}
.sk-pakete-reihe{display:grid;grid-template-columns:repeat(var(--sk-anzahl),minmax(0,1fr));gap:20px;margin-top:24px}
.sk-paket{--sk-kontext:#00323C;color:var(--sk-petrol);display:flex;flex-direction:column;text-align:left;padding:28px 24px;background:var(--sk-papier);border:1px solid var(--sk-linie)}
.sk-paket--empfohlen{border:2px solid var(--sk-petrol)}
.sk-paket-etikett{margin:0 0 8px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--sk-messing-dunkel)}
.sk-paket-name{margin:0 0 10px;font:500 24px/1.15 var(--sk-serif);text-transform:none;letter-spacing:0}
.sk-paket-preis{margin:0 0 18px;padding-bottom:18px;border-bottom:1px solid var(--sk-linie);font-size:14px;color:var(--sk-text-ruhig)}
.sk-paket-preis strong{font:500 30px var(--sk-serif);color:var(--sk-petrol)}
.sk-paket-merkmale{margin:0 0 18px;display:grid;gap:10px}
.sk-paket-merkmale div{display:grid;gap:2px}
.sk-paket-merkmale dt{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--sk-text-ruhig)}
.sk-paket-merkmale dd{margin:0;font-size:15px;line-height:1.45;color:var(--sk-petrol)}
.sk-paket-passt{margin:auto 0 18px;font-size:14px;line-height:1.5;color:var(--sk-text-ruhig)}
.sk-paket-passt span{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:2px}
.sk-paket .uk-button-text{align-self:flex-start;font-size:15px!important}
.sk-pakete-hinweis{margin:16px 0 0;font-size:14px;color:var(--sk-text-ruhig)}
@media(max-width:1100px){.sk-pakete-reihe{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.sk-pakete-reihe{grid-template-columns:1fr}}

/* Abschluss */
.sk-abschluss{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);align-items:end}
.sk-belege{display:flex;flex-wrap:wrap;gap:12px 32px;margin:0 0 32px}
.sk-belege div{display:flex;align-items:baseline;gap:10px}
.sk-belege dt{font:400 26px var(--sk-serif);color:var(--sk-messing)}.sk-belege dd{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
@media(max-width:860px){.sk-abschluss{grid-template-columns:1fr}}

/* Footer (Zero-One-Footer-Layout, Klassen ueber das Feld Blockklasse) */
#footer .sk-fuss-claim p{font:400 24px/1.25 var(--sk-serif);margin:0 0 10px;color:var(--sk-papier)}
#footer .sk-fuss-claim em{color:var(--sk-nebel)}
#footer .sk-fuss-zeile p{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--sk-messing);margin:0}
#footer .sk-fuss-titel p{font-size:11px!important;letter-spacing:.16em;color:var(--sk-salbei);margin:0 0 14px}
#footer ul{list-style:none;padding:0;margin:0 0 20px;font-size:14px;line-height:1.5;text-transform:none}
#footer ul li{margin:0 0 8px}

@media(prefers-reduced-motion:reduce){.sk-zeile,.sk-pfeil,.sk-foto img{transition:none}}