/*
 * Cadasports Original – Modernisierungsschicht (Version 3.9.0)
 * ------------------------------------------------------------
 * Diese Datei wird NACH main.css geladen und ergänzt das bestehende Theme
 * ausschließlich gestalterisch. main.css, Templates, Inhalte, Links und
 * Abläufe bleiben unverändert. Abschaltbar im Customizer unter
 * „Cadasports: Erscheinungsbild“ → „Modernisierung aktivieren“.
 *
 * Alle Regeln hängen an der Body-Klasse .cso-modern, damit die Schicht
 * nie unbeabsichtigt greift.
 */

/* ========== 0. Gestaltungs-Tokens (Farben bleiben die Markenfarben) ========== */
:root{
  /* behebt die bisher undefinierte Variable aus v3.5.2 (Inhaltsbreite) */
  --container:var(--max);

  --cso-radius-xs:6px;
  --cso-radius-btn:8px;
  --cso-radius-sm:12px;
  --cso-radius:18px;
  --cso-radius-lg:24px;

  --cso-shadow-sm:0 2px 8px rgba(20,26,14,.05),0 1px 2px rgba(20,26,14,.04);
  --cso-shadow:0 12px 30px rgba(20,26,14,.07),0 2px 6px rgba(20,26,14,.04);
  --cso-shadow-lg:0 24px 54px rgba(20,26,14,.12),0 4px 12px rgba(20,26,14,.05);
  --cso-shadow-green:0 10px 24px rgba(67,85,47,.22);

  --cso-ease:cubic-bezier(.22,.8,.26,1);
  --cso-fast:.18s;
  --cso-mid:.32s;
  --cso-slow:.7s;

  --cso-focus:0 0 0 3px #fff,0 0 0 6px rgba(98,120,66,.75);
  --cso-header-h:88px;
}
@media(max-width:720px){:root{--cso-header-h:74px}}

/* ========== 1. Grundlagen: Lesbarkeit, Fokus, Auswahl ========== */
html{scroll-padding-top:calc(var(--cso-header-h) + 16px)}
.cso-modern{text-rendering:optimizeLegibility}
.cso-modern ::selection{background:rgba(98,120,66,.22);color:var(--ink)}
.cso-modern :is(h1,h2,h3){text-wrap:balance}
.cso-modern :is(p,li,blockquote,figcaption){text-wrap:pretty}
.cso-modern :is(.prose,.entry-content,.hero-lead,.section-intro,.legal-copy) p{hyphens:manual}

/* Einheitlicher, gut sichtbarer Tastaturfokus für alle interaktiven Elemente */
.cso-modern :is(a,button,summary,input,select,textarea,[tabindex]):focus-visible{
  outline:none;
  box-shadow:var(--cso-focus);
  border-radius:var(--cso-radius-xs);
}
.cso-modern .site-footer :is(a,button):focus-visible{box-shadow:0 0 0 3px #344027,0 0 0 6px #dfe8cf}

/* „Zum Inhalt springen“ sichtbar und hochwertig, sobald per Tastatur erreicht */
.cso-modern .skip-link:focus{
  top:14px;left:14px;padding:12px 18px;
  background:var(--ink);color:#fff;font-weight:800;font-size:.85rem;
  border-radius:var(--cso-radius-btn);box-shadow:var(--cso-shadow-lg);z-index:10000;
}

/* ========== 2. Header & Navigation ========== */
.cso-modern .site-header{
  transition:box-shadow var(--cso-mid) ease,background-color var(--cso-mid) ease,border-color var(--cso-mid) ease;
}
.cso-modern .header-inner{transition:height var(--cso-mid) var(--cso-ease)}
.cso-modern .brand img{transition:height var(--cso-mid) var(--cso-ease)}
.cso-modern.cso-scrolled .site-header{
  background:rgba(255,255,255,.92);
  border-bottom-color:rgba(222,223,217,.7);
  box-shadow:0 8px 28px rgba(20,26,14,.07);
}
@media(min-width:1051px){
  .cso-modern.cso-scrolled .header-inner{height:74px}
  .cso-modern.cso-scrolled .brand img{height:48px}
  .cso-modern .site-menu a{padding-block:6px;transition:color var(--cso-fast) ease}
  .cso-modern .site-menu a:after{bottom:-4px;border-radius:2px;transition:width var(--cso-mid) var(--cso-ease)}
  .cso-modern .site-menu a:hover{color:var(--green-dark)}
}
.cso-modern .nav-cta{
  border-radius:var(--cso-radius-btn);
  box-shadow:0 6px 16px rgba(67,85,47,.18);
  transition:background-color var(--cso-fast) ease,transform var(--cso-fast) ease,box-shadow var(--cso-fast) ease;
}
.cso-modern .nav-cta span{transition:transform var(--cso-mid) var(--cso-ease)}
.cso-modern .nav-cta:hover{box-shadow:var(--cso-shadow-green)}
.cso-modern .nav-cta:hover span{transform:translateX(3px)}

/* Mobil-Menü: ruhiges Einblenden, große Tippflächen */
.cso-modern .menu-toggle{
  width:48px;height:48px;padding:0;display:none;place-items:center;
  border-radius:var(--cso-radius-sm);transition:background-color var(--cso-fast) ease;
}
.cso-modern .menu-toggle:hover{background:var(--soft)}
@media(max-width:1050px){
  .cso-modern .menu-toggle{display:grid;align-content:center;justify-content:center}
  .cso-modern .menu-toggle span{margin:2.5px auto}
  .cso-modern .menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .cso-modern .menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .cso-modern .primary-navigation{
    top:var(--cso-header-h);
    background:rgba(255,255,255,.985);
    box-shadow:inset 0 1px 0 var(--line);
  }
  .cso-modern.menu-open .primary-navigation{animation:cso-menu-in .32s var(--cso-ease) both}
  .cso-modern.menu-open .primary-navigation .site-menu li{animation:cso-fade-up .4s var(--cso-ease) both}
  .cso-modern.menu-open .primary-navigation .site-menu li:nth-child(2){animation-delay:.03s}
  .cso-modern.menu-open .primary-navigation .site-menu li:nth-child(3){animation-delay:.06s}
  .cso-modern.menu-open .primary-navigation .site-menu li:nth-child(4){animation-delay:.09s}
  .cso-modern.menu-open .primary-navigation .site-menu li:nth-child(5){animation-delay:.12s}
  .cso-modern.menu-open .primary-navigation .site-menu li:nth-child(6){animation-delay:.15s}
  .cso-modern.menu-open .primary-navigation .site-menu li:nth-child(n+7){animation-delay:.18s}
  .cso-modern .primary-navigation .site-menu a{
    justify-content:space-between;min-height:58px;font-size:1.02rem;letter-spacing:.03em;
    transition:color var(--cso-fast) ease,padding-left var(--cso-mid) var(--cso-ease);
  }
  .cso-modern .primary-navigation .site-menu a::before{
    content:"→";order:2;color:var(--green);font-weight:700;opacity:.55;
    transition:transform var(--cso-mid) var(--cso-ease),opacity var(--cso-fast) ease;
  }
  .cso-modern .primary-navigation .site-menu a:hover{color:var(--green-dark);padding-left:6px}
  .cso-modern .primary-navigation .site-menu a:hover::before{opacity:1;transform:translateX(-4px)}
  .cso-modern .primary-navigation .site-menu :is(.current-menu-item,.current_page_item)>a{color:var(--green-dark)}
  .cso-modern .primary-navigation .nav-cta{min-height:56px;font-size:.86rem}
}
@media(max-width:720px){
  .cso-modern .primary-navigation{top:var(--cso-header-h)}
}

/* ========== 3. Buttons & Bedienelemente (einheitlich) ========== */
.cso-modern .button{
  border-radius:var(--cso-radius-btn);
  transition:background-color var(--cso-fast) ease,color var(--cso-fast) ease,border-color var(--cso-fast) ease,transform var(--cso-fast) ease,box-shadow var(--cso-mid) ease;
  -webkit-tap-highlight-color:transparent;
}
.cso-modern .button span[aria-hidden="true"]{display:inline-block;transition:transform var(--cso-mid) var(--cso-ease)}
.cso-modern .button:hover span[aria-hidden="true"]{transform:translateX(3px)}
.cso-modern .button[target="_blank"]:hover span[aria-hidden="true"]{transform:translate(2px,-2px)}
.cso-modern .button:active{transform:translateY(0) scale(.985)}
.cso-modern .button-green{box-shadow:0 6px 16px rgba(67,85,47,.16)}
.cso-modern .button-green:hover{box-shadow:var(--cso-shadow-green)}
.cso-modern .button-outline{border-width:1.5px}
.cso-modern .button-outline:hover{transform:translateY(-1px);box-shadow:var(--cso-shadow)}
.cso-modern .hero-copy-clarified .hero-primary-cta,
.cso-modern .hero-primary-cta{border-radius:var(--cso-radius-btn)}
.cso-modern #cadasports-one .cadasports-one-button{border-radius:var(--cso-radius-btn)}
.cso-modern :is(.page-template-page-kontakt,.page-template-page-kontakt-php) .route-button{border-radius:var(--cso-radius-btn)}
.cso-modern.page-template-page-kontakt .cso-editor-layout :is(.button,button,input[type=submit],.wpb_button){border-radius:var(--cso-radius-btn)}
body.cso-modern:not(.home):not(.page-template-page-ueber-uns) :is(.entry-content .wp-block-button__link,.entry-content .button,.cso-editor-layout .wpb_button){border-radius:var(--cso-radius-btn)}
.cso-modern .video-consent{border-radius:var(--cso-radius-btn)}

/* Formularfelder (z. B. Kontaktformular-Plugins) */
.cso-modern :is(.entry-content,.cso-editor-layout,.front-page-builder-content) :is(input:not([type=submit]):not([type=checkbox]):not([type=radio]):not([type=button]),select,textarea){
  border-radius:var(--cso-radius-btn);
  transition:border-color var(--cso-fast) ease,box-shadow var(--cso-fast) ease;
}
.cso-modern :is(.entry-content,.cso-editor-layout,.front-page-builder-content) :is(input,select,textarea):focus{
  border-color:var(--green);box-shadow:0 0 0 4px rgba(98,120,66,.16);outline:none;
}

/* ========== 4. Startseite: Hero ========== */
@media(prefers-reduced-motion:no-preference){
  .cso-modern .hero-copy > *{animation:cso-fade-up .8s var(--cso-ease) both}
  .cso-modern .hero-copy > :nth-child(2){animation-delay:.06s}
  .cso-modern .hero-copy > :nth-child(3){animation-delay:.14s}
  .cso-modern .hero-copy > :nth-child(4){animation-delay:.2s}
  .cso-modern .hero-copy > :nth-child(5){animation-delay:.26s}
  .cso-modern .hero-copy > :nth-child(n+6){animation-delay:.32s}
  .cso-modern .hero-media img{animation:cso-hero-img 1.4s var(--cso-ease) both}
  .cso-modern .hero-video-actions{animation:cso-fade-up .8s var(--cso-ease) .45s both}
}

/* ========== 5. Startseite: Vorteile ========== */
@media(max-width:720px){
  /* kompakter: Symbol links, Text rechts – spart viel Scrollweg */
  .cso-modern .feature-grid{padding-block:44px;gap:0}
  .cso-modern .feature-card{
    display:grid;grid-template-columns:56px minmax(0,1fr);column-gap:18px;align-items:start;
    text-align:left;padding:22px 4px!important;
  }
  .cso-modern .feature-card .feature-icon{grid-row:span 2;width:56px;height:56px;margin:0;font-size:1.55rem}
  .cso-modern .feature-card h2{margin:4px 0 6px;font-size:1.06rem;line-height:1.25}
  .cso-modern .feature-card p{margin:0;max-width:none;font-size:.95rem;line-height:1.55;color:#40433c}
}

/* ========== 6. Startseite: Trainingsansatz (gleich große Kreise, saubere Trennung) ========== */
.cso-modern .training-node{min-height:0;overflow:hidden}
.cso-modern .training-node h3{
  overflow-wrap:normal;word-break:normal;hyphens:manual;-webkit-hyphens:manual;
  font-size:clamp(.56rem,.78vw,.8rem);letter-spacing:.03em;
}
.cso-modern .training-node{transition:opacity .65s ease,transform .75s var(--cso-ease),box-shadow var(--cso-mid) ease,background-color var(--cso-mid) ease}
@media(hover:hover) and (pointer:fine){
  .cso-modern .training-diagram-inner.is-visible .training-node:hover{transform:translateY(-6px) scale(1.03);transition-delay:0s}
}
@media(min-width:721px) and (max-width:1050px){
  /* Tablet: 3 + 2 statt fünf sehr kleiner Kreise */
  .cso-modern .training-diagram-inner{grid-template-columns:repeat(6,minmax(0,1fr));max-width:680px;margin-inline:auto;gap:18px}
  .cso-modern .training-node{grid-column:span 2}
  .cso-modern .training-node-4{grid-column:2/span 2}
  .cso-modern .training-orbit{display:none}
  .cso-modern .training-node h3{font-size:.74rem}
  .cso-modern .training-node-number{font-size:2.2rem}
}
@media(max-width:720px){
  .cso-modern .training-node h3{font-size:clamp(.62rem,2.6vw,.78rem)}
}

/* ========== 7. Startseite: Team ========== */
.cso-modern .person img{transition:filter .5s ease,transform .5s var(--cso-ease),box-shadow .5s ease}
@media(hover:hover) and (pointer:fine){
  .cso-modern .person:hover img{filter:grayscale(0);transform:translateY(-4px);box-shadow:0 18px 36px rgba(20,26,14,.16)}
}
@media(max-width:720px){
  .cso-modern .team-grid{gap:0}
  .cso-modern .person{
    display:grid;grid-template-columns:96px minmax(0,1fr);column-gap:20px;align-items:center;
    text-align:left;padding:26px 0;
  }
  .cso-modern .person img{grid-row:span 2;width:96px;margin:0}
  .cso-modern .person h3{margin:0 0 4px;align-self:end}
  .cso-modern .person p{margin:0;align-self:start;font-size:.93rem;line-height:1.55}
}

/* ========== 8. Startseite: Studio-Raster ========== */
.cso-modern .studio-grid{gap:10px}
.cso-modern .studio-grid figure{border-radius:var(--cso-radius-sm);box-shadow:var(--cso-shadow-sm)}
.cso-modern .studio-grid img{transition:transform .6s var(--cso-ease)}
.cso-modern .studio-grid figure:hover img{transform:scale(1.045)}

/* ========== 9. Referenzen (Startseite) ========== */
.cso-modern .quote-grid blockquote{
  position:relative;display:flex;flex-direction:column;
  border-radius:var(--cso-radius);border-color:rgba(98,120,66,.16);
  box-shadow:var(--cso-shadow-sm);
  transition:transform var(--cso-mid) var(--cso-ease),box-shadow var(--cso-mid) ease,border-color var(--cso-mid) ease;
}
.cso-modern .quote-grid blockquote::before{
  content:"“";position:absolute;top:14px;right:24px;font-size:4.2rem;line-height:1;font-weight:800;
  color:rgba(98,120,66,.14);pointer-events:none;
}
.cso-modern .quote-grid blockquote{text-align:left;align-items:flex-start}
.cso-modern .quote-grid blockquote cite{margin-top:auto;color:var(--green-dark)}
@media(hover:hover) and (pointer:fine){
  .cso-modern .quote-grid blockquote:hover{transform:translateY(-5px);box-shadow:var(--cso-shadow);border-color:rgba(98,120,66,.4)}
}
.cso-modern .reference-links{gap:12px}

/* ========== 10. Videos (Zwei-Klick-Lösung bleibt unverändert) ========== */
.cso-modern .privacy-video{border-radius:var(--cso-radius);box-shadow:var(--cso-shadow)}
.cso-modern .video-play{
  width:68px;height:68px;aspect-ratio:1/1;flex:0 0 auto;padding:0 0 0 4px;
  background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.55);
  transition:transform var(--cso-mid) var(--cso-ease),background-color var(--cso-mid) ease;
}
.cso-modern .privacy-video:hover .video-play{transform:scale(1.06);background:rgba(98,120,66,.55)}
.cso-modern .video-placeholder{gap:0}
/* Hinweistexte wurden teils abgeschnitten – bis zum Laden passt sich die Höhe dem Inhalt an */
.cso-modern .video-grid .privacy-video:not(:has(iframe)){aspect-ratio:auto}
.cso-modern .video-grid .video-placeholder{min-height:clamp(300px,26vw,370px);padding:36px clamp(20px,3vw,40px)}
@media(max-width:720px){
  .cso-modern .video-grid .privacy-video{min-height:0}
  .cso-modern .video-grid .video-placeholder{padding:30px 20px}
  .cso-modern .video-grid .video-play{width:58px;height:58px;font-size:1.35rem;margin-bottom:14px}
  .cso-modern .video-grid .video-placeholder h3{font-size:1.25rem}
  .cso-modern .video-grid .video-placeholder p{font-size:.95rem}
}

/* ========== 11. Häufige Fragen ========== */
.cso-modern .faq-list summary{transition:color var(--cso-fast) ease,padding-left var(--cso-mid) var(--cso-ease)}
.cso-modern .faq-list summary:after{
  content:"+";display:grid;place-items:center;top:50%;right:4px;width:34px;height:34px;margin-top:-17px;
  border:1.5px solid rgba(98,120,66,.4);border-radius:50%;color:var(--green-dark);
  font-size:1.15rem;font-weight:700;line-height:1;
  transition:transform var(--cso-mid) var(--cso-ease),background-color var(--cso-mid) ease,color var(--cso-mid) ease,border-color var(--cso-mid) ease;
}
.cso-modern .faq-list details[open] summary:after{content:"+";transform:rotate(45deg);background:var(--green);border-color:var(--green);color:#fff}
.cso-modern .faq-list summary:hover{color:var(--green-dark)}
@media(hover:hover) and (pointer:fine){.cso-modern .faq-list summary:hover{padding-left:8px}}
.cso-modern .faq .faq-list summary{padding-right:56px}
.cso-modern .faq-list details[open] > p{animation:cso-fade-up .4s var(--cso-ease) both}
.cso-modern .faq .faq-list details[open]{background:linear-gradient(90deg,#f6f8f1,#fff)}

/* ========== 12. Bildleiste ========== */
@media(max-width:720px){
  /* statt sechs gestapelter Vollbreit-Bilder: wischbare Leiste */
  .cso-modern .photo-ribbon{
    display:flex;gap:8px;height:auto;padding:8px;background:#fff;
    overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:8px;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  .cso-modern .photo-ribbon::-webkit-scrollbar{display:none}
  .cso-modern .photo-ribbon figure{
    flex:0 0 78%;aspect-ratio:4/5;border:0!important;border-radius:var(--cso-radius-sm);scroll-snap-align:start;
  }
}

/* ========== 13. Kontaktleiste Startseite ========== */
.cso-modern .contact-band>a{transition:background-color var(--cso-mid) ease}
.cso-modern .contact-band .contact-icon{transition:transform var(--cso-mid) var(--cso-ease),stroke var(--cso-fast) ease}
@media(hover:hover) and (pointer:fine){
  .cso-modern .contact-band>a:hover{background:rgba(255,255,255,.75)}
  .cso-modern .contact-band>a:hover .contact-icon{transform:translateY(-2px) scale(1.06)}
}
@media(max-width:720px){
  .cso-modern .contact-band>a{min-height:64px;border-radius:0}
}

/* ========== 14. Footer ========== */
.cso-modern .footer-menu a{position:relative;padding-block:4px;opacity:.92;transition:opacity var(--cso-fast) ease}
.cso-modern .footer-menu a::after{
  content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:left;transition:transform var(--cso-mid) var(--cso-ease);
}
.cso-modern .footer-menu a:hover{opacity:1}
.cso-modern .footer-menu a:hover::after{transform:scaleX(1)}
@media(max-width:720px){
  .cso-modern .site-footer{padding-top:40px}
  .cso-modern .footer-navigation{display:block;width:100%}
  .cso-modern .footer-menu{display:grid;grid-template-columns:1fr 1fr;gap:6px 22px;width:100%;flex:1 1 100%}
  .cso-modern .footer-menu a{display:inline-flex;align-items:center;min-height:40px}
  .cso-modern .footer-bottom{gap:6px}
}

/* ========== 15. Unterseiten: Kopfbereich ========== */
.cso-modern .subpage-hero h1{text-wrap:balance}
.cso-modern .subpage-hero h1::after{
  content:"";display:block;width:56px;height:3px;margin-top:clamp(16px,2vw,24px);border-radius:3px;background:var(--green);
}
@media(prefers-reduced-motion:no-preference){
  .cso-modern .subpage-hero .container > *{animation:cso-fade-up .7s var(--cso-ease) both}
  .cso-modern .subpage-hero .container > :nth-child(2){animation-delay:.06s}
  .cso-modern .subpage-hero .container > :nth-child(3){animation-delay:.14s}
  .cso-modern .subpage-hero-image > img{animation:cso-hero-img 1.3s var(--cso-ease) both}
}
.cso-modern .breadcrumb a{transition:color var(--cso-fast) ease}
.cso-modern .breadcrumb a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
@media(max-width:720px){
  .cso-modern .subpage-hero h1::after{margin-inline:auto}
  .cso-modern:not(.home) .subpage-hero:not(.subpage-hero-image) h1::after,
  .cso-modern .subpage-hero-image h1::after{margin-inline:0}
}
/* Studio: Kopfbereich ohne Bild nicht unnötig hoch */
.cso-modern:is(.page-template-page-studio,.page-template-page-studio-php) .subpage-hero-image{min-height:0;display:block}
.cso-modern:is(.page-template-page-studio,.page-template-page-studio-php) .subpage-hero-image .container{
  margin-inline:auto;width:min(var(--max),calc(100% - 2*var(--pad)));padding:0;background:transparent;box-shadow:none;
}

/* ========== 16. Unterseiten: Inhalte ========== */
/* Über uns – Einstiegstext erhält wieder seinen Seitenrand */
.cso-modern .cso-editor-layout > .mission-grid{max-width:var(--max)}
.cso-modern .about-brand-images img,
.cso-modern .editorial-image-section > img{transition:transform 1s var(--cso-ease)}
.cso-modern .about-brand-images figure{overflow:hidden;border-radius:var(--cso-radius-sm)}
.cso-modern .about-brand-images figure img{border-radius:0}
@media(hover:hover) and (pointer:fine){.cso-modern .about-brand-images figure:hover img{transform:scale(1.035)}}

/* Studio – Galerie ohne Lücken */
.cso-modern .studio-page-gallery-grid{grid-auto-flow:dense}
@media(min-width:1051px){
  /* fünf Bilder füllen das Raster jetzt vollständig */
  .cso-modern .studio-page-gallery-item-5:last-child{grid-column:span 2}
}
.cso-modern .studio-page-gallery-item{position:relative}
.cso-modern .studio-page-gallery-item::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
}
.cso-modern .gallery-grid img{border-radius:var(--cso-radius-sm)}
.cso-modern .editorial-reverse > div{justify-content:center}
@media(min-width:721px){
  .cso-modern .cso-editor-layout > .editorial-image-section{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}

/* Referenzen – Foto füllt die gesamte Kartenhöhe */
.cso-modern .reference-green-card{border-radius:var(--cso-radius-lg);box-shadow:var(--cso-shadow)}
.cso-modern .reference-green-card__image{position:relative;align-self:stretch;min-height:330px;overflow:hidden}
body.cso-modern .reference-green-card__image img{position:absolute;inset:0;width:100%;height:100%!important;min-height:0;object-fit:cover!important;border-radius:0!important}
@media(max-width:720px){
  .cso-modern .reference-green-card__image{min-height:0;aspect-ratio:4/3}
}
.cso-modern .reference-quotes blockquote{border-radius:var(--cso-radius-sm);transition:background-color var(--cso-mid) ease,transform var(--cso-mid) var(--cso-ease)}
@media(hover:hover) and (pointer:fine){.cso-modern .reference-quotes blockquote:hover{background:rgba(255,255,255,.16);transform:translateX(4px)}}

/* Kontakt – Karten ohne Unterstreichung, doppelter „Weg zu uns“-Button entfällt optisch
   (derselbe Link steht direkt darunter im Bereich „Der Weg zu uns“). */
.cso-modern.page-template-page-kontakt .cso-editor-layout .contact-cards > a,
.cso-modern.page-template-page-kontakt .cso-editor-layout .contact-cards > a *{text-decoration:none}
.cso-modern.page-template-page-kontakt .cso-editor-layout .contact-cards > a strong{color:var(--ink)}
.cso-modern.page-template-page-kontakt .cso-editor-layout .contact-cards > a p{color:#55594f}
.cso-modern.page-template-page-kontakt .cso-editor-layout .contact-cards > a small{color:var(--green-dark)}
.cso-modern.page-template-page-kontakt .cso-editor-layout .contact-cards > a::after{
  content:"→";position:absolute;top:clamp(20px,2.4vw,30px);right:clamp(20px,2.4vw,30px);
  color:var(--green);font-weight:700;transition:transform var(--cso-mid) var(--cso-ease);
}
.cso-modern.page-template-page-kontakt .cso-editor-layout .contact-cards > a[target="_blank"]::after{content:"↗"}
.cso-modern.page-template-page-kontakt .cso-editor-layout .contact-cards > a:hover::after{transform:translateX(4px)}
.cso-modern.page-template-page-kontakt:has(.contact-route-section .route-button) .cso-editor-layout .contact-inline-route{display:none}
.cso-modern.page-template-page-kontakt:has(.contact-route-section .route-button) .cso-editor-layout > .location-box{margin-bottom:clamp(28px,3vw,44px)}
.cso-modern.page-template-page-kontakt .contact-route-section .location-box{border-radius:var(--cso-radius-lg)}

/* Impressum & Datenschutz – ruhiger Lesefluss */
.cso-modern .legal-copy h2{scroll-margin-top:calc(var(--cso-header-h) + 20px);padding-top:clamp(18px,2vw,26px);border-top:1px solid var(--line)}
.cso-modern .legal-copy > h2:first-of-type{border-top:0;padding-top:0}
.cso-modern .legal-warning,
.cso-modern .whatsapp-disclosure{border-radius:0 var(--cso-radius-sm) var(--cso-radius-sm) 0}

/* Unterseiten allgemein: Karten einheitlich */
.cso-modern :is(.value-grid article,.contact-cards>a,.location-box){border-radius:var(--cso-radius)}
.cso-modern .location-box{box-shadow:var(--cso-shadow-sm)}

/* Mobil: große Überschriften nicht mehr mitten im Wort umbrechen
   („BEWEGLICHKEI-T“, „QUADRATMET-ER“) – Schriftgröße passt sich der Breite an */
@media(max-width:720px){
  .cso-modern :is(.mission-grid h2,.editorial-image-section h2,.reference-green-card h3,.subpage-hero h1,.section-heading h2){
    overflow-wrap:normal;word-break:normal;hyphens:auto;-webkit-hyphens:auto;
  }
  .cso-modern .mission-grid h2{font-size:clamp(1.7rem,7.6vw,2.6rem);line-height:1.04}
  .cso-modern .reference-green-card h3{font-size:clamp(1.3rem,5.8vw,1.7rem)}
}

/* ========== 17. WPBakery Page Builder – Elemente im Cadasports-Stil ==========
   Greift auf allen Seiten, die mit WPBakery bearbeitet werden – auch auf einer
   per WPBakery aufgebauten Startseite (.front-page-builder-content). */
.cso-modern .front-page-builder-content{overflow-x:clip}
.cso-modern .front-page-builder-content > .vc_row:not([data-vc-full-width]),
.cso-modern .front-page-builder-content > .vc_section:not([data-vc-full-width]){
  width:min(var(--max),calc(100% - 2*var(--pad)));margin-inline:auto;
}
.cso-modern .front-page-builder-content > .vc_row{padding-block:clamp(36px,5vw,72px)}
.cso-modern .front-page-builder-content > .vc_row + .vc_row{border-top:1px solid var(--line)}
.cso-modern :is(.front-page-builder-content,.cso-editor-layout,.entry-content) :is(.vc_custom_heading,.wpb_text_column) :is(h1,h2,h3,h4){letter-spacing:-.03em;line-height:1.08}
.cso-modern :is(.front-page-builder-content,.cso-editor-layout,.entry-content) .wpb_text_column p{line-height:1.75}

/* WPBakery-Buttons: Standardfarbe (grau) wird zum Markengrün, bewusst gewählte Farben bleiben */
.cso-modern .vc_btn3.vc_btn3{
  border-radius:var(--cso-radius-btn);font-weight:800;letter-spacing:.035em;text-transform:uppercase;font-size:.78rem;
  transition:background-color var(--cso-fast) ease,color var(--cso-fast) ease,border-color var(--cso-fast) ease,transform var(--cso-fast) ease,box-shadow var(--cso-mid) ease;
}
.cso-modern .vc_btn3.vc_btn3.vc_btn3-size-md{padding:15px 24px}
body.cso-modern a.vc_btn3,body.cso-modern a.vc_btn3:hover,body.cso-modern a.wpb_button,body.cso-modern .wp-block-button__link{text-decoration:none!important}
.cso-modern .vc_btn3.vc_btn3:hover{transform:translateY(-1px)}
.cso-modern .vc_btn3.vc_btn3-color-grey:not(.vc_btn3-style-outline):not(.vc_btn3-style-outline-custom):not(.vc_btn3-style-custom){
  background:var(--green)!important;border-color:var(--green)!important;color:#fff!important;box-shadow:0 6px 16px rgba(67,85,47,.16);
}
.cso-modern .vc_btn3.vc_btn3-color-grey:not(.vc_btn3-style-outline):not(.vc_btn3-style-outline-custom):not(.vc_btn3-style-custom):hover{
  background:var(--green-dark)!important;border-color:var(--green-dark)!important;box-shadow:var(--cso-shadow-green);
}
.cso-modern .vc_btn3.vc_btn3-style-outline.vc_btn3-color-grey{border-color:var(--ink)!important;color:var(--ink)!important;background:transparent!important}
.cso-modern .vc_btn3.vc_btn3-style-outline.vc_btn3-color-grey:hover{background:var(--ink)!important;color:#fff!important}

/* Bilder, Trenner, Aufklapper, Tabs, Akkordeons, Nachrichtenboxen */
.cso-modern .wpb_single_image .vc_single_image-wrapper:not(.vc_box_circle):not(.vc_box_circle_2):not(.vc_box_shadow_circle):not(.vc_box_outline_circle):not(.vc_box_outline_circle_2){border-radius:var(--cso-radius-sm);overflow:hidden}
.cso-modern .wpb_single_image a .vc_single_image-wrapper img{transition:transform .7s var(--cso-ease)}
.cso-modern .wpb_single_image a:hover .vc_single_image-wrapper img{transform:scale(1.03)}
.cso-modern .vc_separator .vc_sep_line{border-color:var(--line)}
.cso-modern .vc_separator.vc_sep_color_grey .vc_sep_line{border-color:var(--line)}
.cso-modern .vc_toggle{border-bottom:1px solid var(--line);padding-block:6px;margin-bottom:0}
.cso-modern .vc_toggle_title > h4{font-weight:700;font-size:1.03rem;transition:color var(--cso-fast) ease}
.cso-modern .vc_toggle_title:hover > h4{color:var(--green-dark)}
.cso-modern .vc_toggle_active .vc_toggle_title > h4{color:var(--green-dark)}
.cso-modern .vc_tta.vc_general .vc_tta-panel-title,
.cso-modern .vc_tta.vc_general .vc_tta-tab > a{font-weight:700;letter-spacing:.01em}
.cso-modern .vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab.vc_active > a,
.cso-modern .vc_tta-color-grey.vc_tta-style-classic .vc_active .vc_tta-panel-heading .vc_tta-panel-title > a{color:var(--green-dark)}
.cso-modern .vc_tta.vc_general .vc_tta-panel,
.cso-modern .vc_tta.vc_general .vc_tta-tab > a,
.cso-modern .vc_tta.vc_general .vc_tta-panel-heading{border-radius:var(--cso-radius-btn)!important}
.cso-modern .vc_message_box{border-radius:var(--cso-radius-sm)}
.cso-modern .vc_icon_element.vc_icon_element-outer .vc_icon_element-inner.vc_icon_element-color-grey .vc_icon_element-icon{color:var(--green)}
.cso-modern .vc_cta3{border-radius:var(--cso-radius)}

/* ========== 18. Dezente Einblend-Animationen beim Scrollen ==========
   Nur aktiv, wenn JavaScript läuft (html.cso-anim) und keine reduzierte
   Bewegung gewünscht ist. Ohne JavaScript bleibt alles sofort sichtbar. */
@media(prefers-reduced-motion:no-preference){
  html.cso-anim .cso-modern .cso-reveal{
    opacity:0;transform:translate3d(0,22px,0);
    transition:opacity var(--cso-slow) ease,transform var(--cso-slow) var(--cso-ease);
    transition-delay:var(--cso-delay,0s);
  }
  html.cso-anim .cso-modern .cso-reveal.cso-in{opacity:1;transform:none}
}

/* ========== 19. „Nach oben“-Schaltfläche ========== */
.cso-to-top{
  position:fixed;right:clamp(14px,2.2vw,28px);bottom:clamp(14px,2.2vw,28px);z-index:900;
  display:grid;place-items:center;width:48px;height:48px;padding:0;
  border:1px solid rgba(255,255,255,.4);border-radius:50%;
  background:rgba(11,11,11,.82);color:#fff;font-size:1.15rem;line-height:1;cursor:pointer;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:var(--cso-shadow);
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity var(--cso-mid) ease,transform var(--cso-mid) var(--cso-ease),visibility 0s linear var(--cso-mid),background-color var(--cso-fast) ease;
}
.cso-to-top.is-visible{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.cso-to-top:hover{background:var(--green)}
.cso-to-top:focus-visible{outline:none;box-shadow:var(--cso-focus)}
.menu-open .cso-to-top,.video-overlay-open .cso-to-top{opacity:0;visibility:hidden}

/* ========== 20. Video-Dialog ========== */
.cso-modern .hero-video-dialog[open]{animation:cso-dialog-in .38s var(--cso-ease) both}
.cso-modern .hero-video-dialog::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}

/* ========== 21. Keyframes ========== */
@keyframes cso-fade-up{from{opacity:0;transform:translate3d(0,16px,0)}to{opacity:1;transform:none}}
@keyframes cso-menu-in{from{opacity:0;transform:translate3d(0,-10px,0)}to{opacity:1;transform:none}}
@keyframes cso-hero-img{from{opacity:.001;transform:scale(1.045)}to{opacity:1;transform:none}}
@keyframes cso-dialog-in{from{opacity:0;transform:translate3d(0,18px,0) scale(.98)}to{opacity:1;transform:none}}

/* ========== 22. Bewegung reduzieren ========== */
@media(prefers-reduced-motion:reduce){
  .cso-modern *,.cso-modern *::before,.cso-modern *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important;transition-duration:.01ms!important;transition-delay:0s!important}
  .cso-to-top{transition:none}
}

/* ========== 23. Druckansicht ========== */
@media print{
  .cso-to-top,.menu-toggle,.hero-video-actions,.photo-ribbon{display:none!important}
  .cso-modern .site-header{position:static;box-shadow:none}
}