/* ==========================================================================
   ms automobile — Design-Layer (Schicht 2 + Kontexte + Seitenmuster)
   --------------------------------------------------------------------------
   Tokens (Farben, Typo-Leiter, Abstände, Radien, Schatten) leben im
   CrocoBuilder-Design-System (Variablen), ebenso die Basis-Klassen
   (.section, .container, .btn …). HIER steht nur, was das Design-System
   nicht tragen kann:
     1. Element-Defaults (h1–h3, body, p, a, Listen) — CrocoBuilder hat keine
        Tag-Ebene (common_styles erreichen das Frontend nicht).
     2. Verbund-Selektoren (DS gibt Klassen nach interner ID aus) und
        Zustände, die das DS nicht kompiliert (:focus-visible).
     3. Kontexte (.on-dark), Pseudo-Elemente, Animationen, Browser-Flächen,
        Header/Footer-Chrome und die Layout-Muster der Startseite.
   Wer Typo oder Farben ändert, ändert die VARIABLEN im Builder, nicht hier.
   Kein :root-Token wird hier neu definiert (würde das DS überschreiben).
   ========================================================================== */

/* ---------- Webfonts (selbst gehostet, Latin) ---------- */
@font-face{font-family:'Montserrat';font-style:normal;font-weight:500 800;font-display:swap;
  src:url('../fonts/montserrat-500-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+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Hind';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/hind-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Hind';font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/hind-500-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Hind';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/hind-600-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- Schicht 2: Element-Defaults + Browser-Flächen ---------- */
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:140px;
  scrollbar-color:var(--color-brand) var(--color-surface-alt)}
body{margin:0;font-family:var(--font-body);font-size:var(--text-base);line-height:var(--lh-body);
  color:var(--color-ink);background:var(--color-surface);font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;caret-color:var(--color-brand)}
h1,h2,h3,h4,h5,h6{font-family:var(--font-head);font-weight:800;color:inherit;
  line-height:var(--lh-tight);letter-spacing:var(--ls-tight);margin:0;text-wrap:balance;clear:none;
  overflow-wrap:break-word;hyphens:auto}
h1{font-size:var(--text-4xl)}
h2{font-size:var(--text-3xl)}
h3{font-size:var(--text-xl);font-weight:700}
p{margin:0}
img{max-width:100%;height:auto;display:block}
ul,ol{margin:0;padding:0}
strong,b{font-weight:600}
a,a:visited{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1.5px}
a:hover{color:inherit}
::selection{background:var(--color-brand);color:#fff}
::-webkit-scrollbar{width:12px}
::-webkit-scrollbar-track{background:var(--color-surface-alt)}
::-webkit-scrollbar-thumb{background:var(--color-brand);border-radius:8px;border:3px solid var(--color-surface-alt)}
.site-main .entry-content,.entry-content{margin:0}
.site-main{margin:0}
body .screen-reader-text:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Fokusring (DS-State focusVisible kommt in 1.0.1 nicht ins Frontend) — element-qualifiziert,
   damit Theme-a:focus nicht gewinnt */
a:focus,button:focus,summary:focus,input:focus,textarea:focus,select:focus{outline:none}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,
textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{
  outline:3px solid var(--color-brand);outline-offset:3px;border-radius:4px}
.on-dark a:focus-visible,.section-dark a:focus-visible,.hero a:focus-visible,.site-footer a:focus-visible,
.on-dark button:focus-visible{outline-color:#fff}

/* ---------- Icons in Links/Buttons ---------- */
.btn svg,.contact-line svg,.topbar svg,.hero-lead svg{width:1.15em;height:1.15em;flex:none;
  fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.contact-line svg{color:var(--color-brand)}

/* ---------- Buttons: Bewegung + Kontext-Varianten (0,2,0+) ---------- */
.btn{transition:background-color .25s cubic-bezier(.22,1,.36,1),color .25s cubic-bezier(.22,1,.36,1),
  border-color .25s cubic-bezier(.22,1,.36,1),transform .25s cubic-bezier(.22,1,.36,1)}
a.btn:hover{transform:translateY(-2px);text-decoration:none}
a.btn:active{transform:translateY(0)}
a.btn.btn-primary,a.btn.btn-primary:visited{color:#fff}
.on-dark a.btn.btn-primary:hover,.section-dark a.btn.btn-primary:hover,.hero a.btn.btn-primary:hover{
  background-color:#fff;border-color:#fff;color:var(--color-ink)}
a.btn.btn-ghost,a.btn.btn-ghost:visited{color:#fff}
a.btn.btn-ghost:hover{color:var(--color-ink)}
.btn[aria-busy="true"]{opacity:.7;cursor:progress}
.btn[aria-disabled="true"]{opacity:.5;pointer-events:none}
.actions{display:flex;flex-wrap:wrap;gap:var(--space-s);align-items:center}

/* ---------- Typo-Muster ---------- */
.section-title::after{content:"";display:block;width:56px;height:4px;background:var(--color-brand);
  border-radius:2px;margin-top:var(--space-s)}
.section-head-center{text-align:center}
.section-head-center .section-title::after{margin-inline:auto}
.eyebrow::before{content:"";width:36px;height:3px;background:var(--color-brand);border-radius:2px;flex:none}
.anchor{display:block;height:0;overflow:hidden}

/* ---------- Header (Theme-Builder-Template) ---------- */
header.crocoblocks-theme-builder-location:has(.site-header){position:sticky;top:0;z-index:50}
.admin-bar header.crocoblocks-theme-builder-location:has(.site-header){top:32px}
@media (max-width:782px){.admin-bar header.crocoblocks-theme-builder-location:has(.site-header){top:46px}}
.topbar{background:var(--color-brand);color:#fff;font-size:var(--text-sm)}
.topbar-inner{display:flex;gap:var(--space-l);justify-content:flex-end;align-items:center;
  padding-top:.55rem;padding-bottom:.55rem}
.topbar a,.topbar a:visited,.topbar-item{display:inline-flex;gap:.45rem;align-items:center;color:#fff;text-decoration:none}
.topbar a:hover{text-decoration:underline}
.topbar a:focus-visible{outline-color:#fff}
.site-header{position:relative;background:rgba(255,255,255,.97);border-bottom:1px solid var(--color-line);
  transition:box-shadow .3s cubic-bezier(.22,1,.36,1)}
.site-header.is-scrolled{box-shadow:0 8px 24px -16px rgba(20,20,20,.35)}
.site-header-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-m);
  padding-top:.55rem;padding-bottom:.55rem}
.site-logo{display:block;flex:none}
.site-logo img{height:clamp(52px,2.6rem + 1.4vw,68px);width:auto}
.header-nav{display:flex;align-items:center;gap:var(--space-l)}
/* nav_menu (pb-nav) */
.header-nav .pb-nav__list{gap:var(--space-l)}
.header-nav .pb-nav .pb-nav__item[data-depth="0"] > .pb-nav__link{font-family:var(--font-head);font-weight:600;
  font-size:var(--text-sm);color:var(--color-ink);text-decoration:none;padding:.5rem 0;position:relative}
.header-nav .pb-nav .pb-nav__item[data-depth="0"] > .pb-nav__link::after{content:"";position:absolute;left:0;right:0;bottom:-2px;
  height:2px;background:var(--color-brand);transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.22,1,.36,1)}
.header-nav .pb-nav .pb-nav__item[data-depth="0"] > .pb-nav__link:hover::after{transform:scaleX(1)}
.site-header .pb-nav.is-collapsed .pb-nav__collapse-toggle:not([hidden]){display:inline-flex;align-items:center;justify-content:center;min-height:48px;
  padding:0 1.25rem;border:0;border-radius:var(--radius-control);background:var(--color-brand);color:#fff;cursor:pointer;
  font-family:var(--font-head);font-weight:700;font-size:var(--text-sm)}
.site-header .pb-nav.is-collapsed .pb-nav__collapse-toggle:hover{background:var(--color-ink)}
.site-header .pb-nav.is-collapsed .pb-nav__mobile-panel{background:#fff;color:var(--color-ink);
  padding:4.5rem 1.5rem 2rem;box-sizing:border-box;box-shadow:0 0 0 100vmax rgba(20,20,20,.55)}
.site-header .pb-nav.is-collapsed .pb-nav__mobile-panel .pb-nav__list{gap:0;margin:0;padding:0}
.site-header .pb-nav.is-collapsed .pb-nav__mobile-panel .pb-nav__item{margin:0}
.site-header .pb-nav.is-collapsed .pb-nav__mobile-panel .pb-nav__link{font-family:var(--font-head);font-weight:600;
  font-size:var(--text-md);color:var(--color-ink);display:block;padding:1rem 0;border-bottom:1px solid var(--color-line);text-decoration:none}
.site-header .pb-nav.is-collapsed .pb-nav__mobile-panel .pb-nav__link::after{display:none}
.site-header .pb-nav.is-collapsed .pb-nav__mobile-close{position:absolute;top:1rem;right:1rem;width:44px;height:44px;display:grid;place-items:center;
  border:0;border-radius:50%;background:var(--color-brand-tint);color:var(--color-ink);font-size:1.4rem;cursor:pointer}
@media (max-width:860px){.topbar-inner{justify-content:center;gap:var(--space-m)}.topbar-address{display:none}}
@media (max-width:767px){
  .site-header .pb-nav:not(.is-collapsed) .pb-nav__mobile-panel{visibility:hidden}
  .header-nav .header-cta{display:none}
}
@media (max-width:640px){.topbar-mail-label{display:none}}

/* ---------- Footer (Theme-Builder-Template) ---------- */
.site-footer{background:var(--color-ink);color:#fff;font-size:var(--text-sm);
  padding-top:var(--space-2xl);padding-bottom:var(--space-l)}
.site-footer a,.site-footer a:visited{color:#fff;text-decoration:none}
.site-footer a:hover{text-decoration:underline;text-decoration-color:var(--color-brand)}
.footer-grid{display:grid;grid-template-columns:5fr 4fr 3fr;gap:var(--space-l);
  padding-bottom:var(--space-l);border-bottom:1px solid rgba(255,255,255,.14)}
.footer-logo{display:inline-block;background:#fff;border-radius:12px;padding:.6rem 1rem;margin-bottom:var(--space-m)}
.footer-logo img{height:64px;width:auto}
.footer-claim{font-family:var(--font-head);font-weight:600;font-size:var(--text-base);line-height:1.4;max-width:28ch}
.footer-heading{font-family:var(--font-head);font-weight:700;font-size:var(--text-xs);letter-spacing:var(--ls-wide);
  text-transform:uppercase;margin-bottom:var(--space-m)}
.footer-list{list-style:none;display:grid;gap:.6rem}
.site-footer .pb-nav__list{flex-direction:column;align-items:flex-start;gap:.6rem}
.site-footer .pb-nav .pb-nav__link{color:#fff;font-size:var(--text-sm);padding:0}
.footer-bottom{padding-top:var(--space-m);display:flex;justify-content:space-between;gap:var(--space-s);flex-wrap:wrap}
.footer-credit{display:inline-flex;align-items:center;gap:.35em;flex-wrap:wrap}
.footer-credit a,.footer-credit a:visited{text-decoration:underline;text-decoration-color:var(--color-brand)}
.footer-credit svg{display:block;width:1em;height:1em;fill:var(--color-brand);stroke:none}
@media (max-width:1024px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.footer-grid{grid-template-columns:1fr}}

/* ---------- Startseite: Hero ---------- */
.hero{position:relative;min-height:min(88vh,820px);display:grid;align-items:center;color:#fff;
  isolation:isolate;overflow:hidden}
.hero-media{position:absolute;inset:0;z-index:-2}
.hero-media img,img.hero-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 55%;
  z-index:-2;max-width:none;animation:ms-hero-zoom 1.6s cubic-bezier(.22,1,.36,1) backwards}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(20,20,20,.88) 0%,rgba(20,20,20,.72) 42%,rgba(20,20,20,.25) 100%)}
.hero-content{padding-top:var(--space-2xl);padding-bottom:calc(var(--space-2xl) + 4rem);max-width:760px}
.hero .eyebrow{margin-bottom:var(--space-m)}
.hero h1{margin-bottom:var(--space-m)}
.hero-lead{font-size:var(--text-lg);color:#fff;margin-bottom:var(--space-l);
  display:flex;gap:.6rem;align-items:flex-start;line-height:var(--lh-snug)}
.hero-lead svg{margin-top:.2em;color:#fff}
.hero-content > *{animation:ms-rise .9s cubic-bezier(.22,1,.36,1) backwards}
.hero-content > :nth-child(2){animation-delay:.12s}
.hero-content > :nth-child(3){animation-delay:.24s}
.hero-content > :nth-child(4){animation-delay:.36s}
@keyframes ms-rise{from{opacity:.4;transform:translateY(18px)}}
@keyframes ms-hero-zoom{from{transform:scale(1.06)}}
@media (max-width:860px){
  .hero{min-height:auto}
  .hero::before{background:linear-gradient(180deg,rgba(20,20,20,.62) 0%,rgba(20,20,20,.82) 100%)}
}
@media (max-width:640px){.hero .actions .btn{flex:1 1 100%}}

/* ---------- Startseite: Kontaktleiste, Leistungen, Intro ---------- */
.contact-strip{position:relative;z-index:2;margin-top:-4.5rem}
.contact-strip-grid{display:grid;grid-template-columns:repeat(3,1fr);background:#fff;
  border-radius:var(--radius-card);box-shadow:var(--shadow-card);overflow:hidden}
.contact-strip-grid > * + *{border-left:1px solid var(--color-line)}
@media (max-width:860px){
  .contact-strip-grid{grid-template-columns:1fr}
  .contact-strip-grid > * + *{border-left:0;border-top:1px solid var(--color-line)}
}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media (max-width:1024px){.services-grid{grid-template-columns:1fr 1fr}
  .services-grid > :last-child{grid-column:1/-1}}
@media (max-width:640px){.services-grid{grid-template-columns:1fr}}
.intro-split{margin-top:var(--space-section);display:grid;grid-template-columns:5fr 7fr;gap:var(--space-l);align-items:center}
.intro-split .media-frame,.booking-media{aspect-ratio:4/3}
.media-frame img{width:100%;height:100%;object-fit:cover;max-width:none}
@media (max-width:1024px){.intro-split{grid-template-columns:1fr}.intro-split .media-frame{aspect-ratio:16/9}}

/* ---------- Startseite: Termin (dunkel) ---------- */
.booking-grid{display:grid;grid-template-columns:7fr 5fr;gap:var(--space-section);align-items:center}
.booking-note{font-family:var(--font-head);font-weight:600;font-size:var(--text-lg);line-height:var(--lh-snug);margin-bottom:var(--space-m)}
.booking-text{max-width:62ch;margin-bottom:var(--space-l);color:#fff}
.booking-media{position:relative;border-radius:var(--radius-card);overflow:hidden;aspect-ratio:4/5}
.booking-media img{width:100%;height:100%;object-fit:cover;max-width:none}
.booking-media::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;background:var(--color-brand)}
@media (max-width:1024px){.booking-grid{grid-template-columns:1fr}.booking-media{aspect-ratio:16/9}}

/* ---------- Kontakt-Infokarte (Inhalt im Slot von cb-location-map) ---------- */
.contact-card-title{font-size:var(--text-2xl);color:#fff;margin-bottom:var(--space-m)}
.contact-card-title::after{content:"";display:block;width:56px;height:4px;background:var(--color-brand);border-radius:2px;margin-top:var(--space-s)}
.contact-address{display:flex;gap:.6rem;align-items:flex-start;margin-bottom:var(--space-m)}
.contact-address svg{width:1.15em;height:1.15em;margin-top:.25em;color:var(--color-brand);flex:none;fill:none;stroke:currentColor;stroke-width:2}
.contact-list{display:grid;gap:.25rem;margin:var(--space-s) 0 var(--space-m)}
.on-dark .contact-line,.on-dark .contact-line:visited{color:#fff}
.on-dark .contact-line:hover{text-decoration:underline;text-decoration-color:var(--color-brand)}
.contact-mail-lead{margin-bottom:var(--space-s)}

/* ---------- Kontaktformular-Popup (JetFormBuilder im <dialog>) ---------- */
.contact-dialog{width:min(100% - 2rem,640px);max-height:calc(100dvh - 2rem);padding:0;border:0;border-radius:var(--radius-card);
  background:var(--color-surface);color:var(--color-ink);box-shadow:var(--shadow-panel);overflow:auto}
.contact-dialog::backdrop{background:rgba(20,20,20,.7)}
.contact-dialog[open]{animation:ms-dialog-in .3s cubic-bezier(.22,1,.36,1)}
@keyframes ms-dialog-in{from{opacity:.4;transform:translateY(16px)}}
.contact-dialog-inner{position:relative;padding:clamp(1.5rem,1.2rem + 1.5vw,2.5rem)}
.contact-dialog-title{font-size:var(--text-2xl);margin:0 3rem var(--space-m) 0}
.contact-dialog-title::after{content:"";display:block;width:56px;height:4px;background:var(--color-brand);border-radius:2px;margin-top:var(--space-s)}
.contact-dialog .contact-dialog-close{position:absolute;top:1rem;right:1rem;width:44px;height:44px;min-width:0;padding:0;margin:0;line-height:0;display:grid;place-items:center;border:0;border-radius:50%;box-shadow:none;
  background:var(--color-brand-tint);color:var(--color-ink);cursor:pointer}
.contact-dialog .contact-dialog-close:hover{background:var(--color-brand);color:#fff}
.contact-dialog .contact-dialog-close svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.contact-dialog form.jet-form-builder .jet-form-builder-row{display:block;width:100%;margin:0 0 var(--space-s)}
.contact-dialog .jet-form-builder__label{margin-bottom:.35rem}
.contact-dialog .jet-form-builder__label-text{font-family:var(--font-head);font-weight:600;font-size:var(--text-sm)}
.contact-dialog .jet-form-builder__required{color:var(--color-brand)}
.contact-dialog .jet-form-builder input.jet-form-builder__field.text-field,
.contact-dialog .jet-form-builder textarea.jet-form-builder__field{width:100%;box-sizing:border-box;padding:.8rem 1rem;
  font:inherit;font-size:var(--text-base);color:var(--color-ink);background:var(--color-surface);
  border:1px solid #8C8782;border-radius:var(--radius-sm)}
.contact-dialog .jet-form-builder textarea.jet-form-builder__field{min-height:140px;resize:vertical}
.contact-dialog .jet-form-builder .jet-form-builder__field:focus-visible{outline:3px solid var(--color-brand);outline-offset:1px;border-color:var(--color-ink)}
.contact-dialog .jet-form-builder label.for-checkbox{display:flex;gap:.75rem;align-items:flex-start;cursor:pointer}
.contact-dialog .jet-form-builder label.for-checkbox > span{display:block}
.contact-dialog .jet-form-builder label.for-checkbox > span::before{display:none}
.contact-dialog .jet-form-builder .jet-form-builder__field.checkboxes-field{position:static;opacity:1;z-index:auto;appearance:none;
  flex:none;width:22px;height:22px;margin:.1rem 0 0;border:2px solid #8C8782;border-radius:5px;background:#fff;cursor:pointer}
.contact-dialog .jet-form-builder .jet-form-builder__field.checkboxes-field:checked{background:var(--color-brand);border-color:var(--color-brand);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E");
  background-size:16px;background-repeat:no-repeat;background-position:center}
.contact-dialog .jet-form-builder .jet-form-builder__field.checkboxes-field:focus-visible{outline:3px solid var(--color-brand);outline-offset:2px}
.contact-dialog .ms-form-note{font-size:var(--text-sm);color:var(--color-ink-soft);margin:-.25rem 0 var(--space-m)}
.contact-dialog .ms-form-note a{color:var(--color-ink);text-decoration:underline;text-decoration-color:var(--color-brand)}
.contact-dialog .jet-form-builder .jet-form-builder__action-button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;
  padding:1.05rem 1.6rem;border:2px solid var(--color-brand);border-radius:var(--radius-control);background:var(--color-brand);color:#fff;
  font-family:var(--font-head);font-weight:700;font-size:var(--text-sm);cursor:pointer;transition:background-color .25s,border-color .25s}
.contact-dialog .jet-form-builder .jet-form-builder__action-button:hover{background:var(--color-ink);border-color:var(--color-ink)}
.contact-dialog .jet-form-builder .jet-form-builder__action-button:focus-visible{outline:3px solid var(--color-ink);outline-offset:3px}
.contact-dialog .jet-form-builder-messages-wrap{margin-top:var(--space-s);font-weight:600}
.contact-dialog .jet-form-builder-message--success{padding:1rem 1.25rem;border-radius:var(--radius-sm);background:var(--color-brand-tint);color:var(--color-ink)}
.contact-dialog .jet-form-builder-message--error{padding:1rem 1.25rem;border-radius:var(--radius-sm);background:var(--color-ink);color:#fff}
.contact-dialog .jet-form-builder-row.field-has-error .jet-form-builder__field{border-color:var(--color-brand)}

/* ---------- Bewegung reduzieren ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero-content > *,.hero-media img,img.hero-media,.cb-location-map__dot,.contact-dialog[open]{animation:none}
  .btn,a.btn,.site-header,.header-nav .pb-nav .pb-nav__item[data-depth="0"] > .pb-nav__link::after{transition:none}
  a.btn:hover{transform:none}
}
