/* ============================================================
   Kinderarztpraxis Dr. med. Claus Schott — Redesign 2026
   Colors: Green #8CC83D · Orange #F4951F · Blue #0374C0
   Kid-friendly, modern, responsive, accessible, GDPR-compliant
   ============================================================ */
:root {
  --clr-green: #8CC83D;
  --clr-green-dark: #6fa52e;
  --clr-green-light: #f0f9e4;
  --clr-orange: #F4951F;
  --clr-orange-dark: #d47e12;
  --clr-orange-light: #fef3e3;
  --clr-blue: #0374C0;
  --clr-blue-dark: #025a96;
  --clr-blue-light: #e8f4fd;
  --clr-red: #EC1F24;
  --clr-red-light: #fdeaea;
  --clr-white: #ffffff;
  --clr-offwhite: #fafcf7;
  --clr-gray-100: #f3f5f0;
  --clr-gray-200: #e4e8df;
  --clr-gray-300: #c8d1c0;
  --clr-gray-500: #6b7b62;
  --clr-gray-700: #3a4a35;
  --clr-gray-900: #1a2518;
  --ff-heading: 'Fredoka', 'Nunito', sans-serif;
  --ff-body: 'Nunito', 'Source Sans 3', sans-serif;
  --fs-xs: clamp(.75rem,.7rem + .25vw,.8125rem);
  --fs-sm: clamp(.875rem,.82rem + .28vw,.9375rem);
  --fs-base: clamp(1rem,.95rem + .25vw,1.0625rem);
  --fs-md: clamp(1.125rem,1.05rem + .38vw,1.25rem);
  --fs-lg: clamp(1.375rem,1.2rem + .88vw,1.75rem);
  --fs-xl: clamp(1.75rem,1.45rem + 1.5vw,2.5rem);
  --fs-2xl: clamp(2.25rem,1.8rem + 2.25vw,3.25rem);
  --space-xs:.5rem;--space-sm:1rem;--space-md:1.5rem;--space-lg:2.5rem;--space-xl:4rem;--space-2xl:6rem;
  --radius-sm:8px;--radius-md:16px;--radius-lg:24px;--radius-xl:32px;--radius-full:50%;
  --radius-blob:30% 70% 70% 30%/30% 30% 70% 70%;
  --shadow-sm:0 2px 8px rgba(0,0,0,.06);--shadow-md:0 4px 20px rgba(0,0,0,.08);--shadow-lg:0 8px 32px rgba(0,0,0,.1);--shadow-xl:0 16px 48px rgba(0,0,0,.12);
  --shadow-green:0 4px 20px rgba(140,200,61,.25);--shadow-orange:0 4px 20px rgba(244,149,31,.25);--shadow-blue:0 4px 20px rgba(3,116,192,.25);
  --transition-fast:.2s ease;--transition-base:.35s cubic-bezier(.4,0,.2,1);--transition-bounce:.5s cubic-bezier(.34,1.56,.64,1);
  --header-height:80px;--max-width:1200px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--header-height) + 1rem)}
body{font-family:var(--ff-body);font-size:var(--fs-base);line-height:1.7;color:var(--clr-gray-700);background:var(--clr-white);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--clr-blue);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--clr-blue-dark)}
h1,h2,h3,h4,h5,h6{font-family:var(--ff-heading);color:var(--clr-gray-900);line-height:1.25;font-weight:600}
h1{font-size:var(--fs-2xl)}h2{font-size:var(--fs-xl)}h3{font-size:var(--fs-lg)}h4{font-size:var(--fs-md)}
p+p{margin-top:var(--space-sm)}ul,ol{padding-left:1.25em}
.container{width:min(var(--max-width),100% - 2rem);margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.section{padding:var(--space-2xl) 0}.section--green{background:var(--clr-green-light)}.section--orange{background:var(--clr-orange-light)}.section--blue{background:var(--clr-blue-light)}
.section__title{text-align:center;margin-bottom:var(--space-lg);position:relative}
.section__title::after{content:'';display:block;width:60px;height:4px;background:linear-gradient(90deg,var(--clr-green),var(--clr-orange));margin:var(--space-sm) auto 0;border-radius:2px}
.section__subtitle{text-align:center;max-width:640px;margin:calc(-1 * var(--space-md)) auto var(--space-lg);color:var(--clr-gray-500);font-size:var(--fs-md)}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.5em;padding:.8em 1.75em;border-radius:50px;font-family:var(--ff-body);font-size:var(--fs-sm);font-weight:700;letter-spacing:.02em;border:2px solid transparent;cursor:pointer;transition:all var(--transition-bounce);text-decoration:none;line-height:1.4}
.btn--green{background:var(--clr-green);color:var(--clr-white);border-color:var(--clr-green)}.btn--green:hover{background:var(--clr-green-dark);border-color:var(--clr-green-dark);color:var(--clr-white);transform:translateY(-3px);box-shadow:var(--shadow-green)}
.btn--orange{background:var(--clr-orange);color:var(--clr-white);border-color:var(--clr-orange)}.btn--orange:hover{background:var(--clr-orange-dark);border-color:var(--clr-orange-dark);color:var(--clr-white);transform:translateY(-3px);box-shadow:var(--shadow-orange)}
.btn--blue{background:var(--clr-blue);color:var(--clr-white);border-color:var(--clr-blue)}.btn--blue:hover{background:var(--clr-blue-dark);border-color:var(--clr-blue-dark);color:var(--clr-white);transform:translateY(-3px);box-shadow:var(--shadow-blue)}
.btn--red{background:var(--clr-red);color:var(--clr-white);border-color:var(--clr-red)}.btn--red:hover{background:#d41a1e;border-color:#d41a1e;color:var(--clr-white);transform:translateY(-3px)}
.btn--outline-green{background:transparent;color:var(--clr-green-dark);border-color:var(--clr-green)}.btn--outline-green:hover{background:var(--clr-green);color:var(--clr-white);transform:translateY(-3px)}
.btn--outline-blue{background:transparent;color:var(--clr-blue);border-color:var(--clr-blue)}.btn--outline-blue:hover{background:var(--clr-blue);color:var(--clr-white);transform:translateY(-3px)}
.btn--white{background:var(--clr-white);color:var(--clr-green-dark);border-color:var(--clr-white)}.btn--white:hover{background:transparent;color:var(--clr-white);transform:translateY(-3px)}

/* Header */
.site-header{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--clr-gray-200);transition:box-shadow var(--transition-base);height:var(--header-height)}
.site-header.scrolled{box-shadow:var(--shadow-md)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:var(--header-height)}
.header-logo{display:flex;align-items:center;gap:.75rem;text-decoration:none;flex-shrink:0}
.header-logo img{height:48px;width:auto;border-radius:var(--radius-md)}
.header-logo__text{display:flex;flex-direction:column;line-height:1.2}
.header-logo__name{font-family:var(--ff-heading);font-size:1.05rem;font-weight:700;color:var(--clr-gray-900)}
.header-logo__sub{font-size:var(--fs-xs);color:var(--clr-green);font-weight:600}
.main-nav{display:flex;align-items:center}
.main-nav__list{display:flex;list-style:none;padding:0;gap:.15rem}
.main-nav__link{display:block;padding:.5rem .7rem;font-size:var(--fs-sm);font-weight:700;color:var(--clr-gray-700);border-radius:50px;transition:all var(--transition-fast);white-space:nowrap}
.main-nav__link:hover{color:var(--clr-green);background:var(--clr-green-light)}
.main-nav__link--active{color:var(--clr-white)!important;background:var(--clr-green)!important}
.main-nav__link--active:hover{background:var(--clr-green-dark)!important}
.main-nav__link--emergency{color:var(--clr-red);font-weight:800}.main-nav__link--emergency:hover{background:var(--clr-red-light);color:var(--clr-red)}
.nav-cta{margin-left:.75rem;border:2px solid var(--clr-orange)}

/* Header emergency button */
.nav-cta, .header-emergency{
  display:inline-flex;align-items:center;justify-content:center;gap:.35em;
  padding:.5em 1.1em;
  border-radius:50px;
  font-size:var(--fs-xs);font-weight:700;
  text-decoration:none;
  transition:all var(--transition-fast);
  white-space:nowrap;
  flex-shrink:0;
  min-width:90px;
  text-align:center;
}
.header-emergency{
  margin-left:.5rem;
  background:var(--clr-red);color:var(--clr-white);
  border:2px solid var(--clr-red);
}
.header-emergency svg{fill:currentColor;width:14px;height:14px}
.header-emergency:hover{
  background:#d41a1e;border-color:#d41a1e;color:var(--clr-white);
  transform:translateY(-1px);box-shadow:0 2px 8px rgba(236,31,36,.3);
}
.header-emergency span{display:inline}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;width:40px;height:40px;position:relative;z-index:1001}
.nav-toggle span{display:block;width:24px;height:3px;background:var(--clr-gray-900);margin:5px auto;border-radius:3px;transition:all var(--transition-fast)}
.nav-toggle.active span:nth-child(1){transform:rotate(45deg) translate(5px,6px)}.nav-toggle.active span:nth-child(2){opacity:0}.nav-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-6px)}
.mobile-nav-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:999;opacity:0;transition:opacity var(--transition-base)}.mobile-nav-overlay.visible{opacity:1}

/* Color strip */
.color-strip{height:5px;background:linear-gradient(90deg,var(--clr-green) 0%,var(--clr-green) 33%,var(--clr-orange) 33%,var(--clr-orange) 66%,var(--clr-blue) 66%,var(--clr-blue) 100%)}

/* Hero */
.hero{position:relative;min-height:90vh;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-top:var(--header-height)}
.hero__bg{position:absolute;inset:0;z-index:0}.hero__bg img{width:100%;height:100%;object-fit:cover}
.hero__overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(140,200,61,.85) 0%,rgba(3,116,192,.78) 50%,rgba(26,37,24,.72) 100%);z-index:1}
.hero__content{position:relative;z-index:2;text-align:center;color:var(--clr-white);padding:var(--space-xl) var(--space-sm);max-width:800px}
.hero__badge{display:inline-block;background:rgba(255,255,255,.2);backdrop-filter:blur(8px);padding:.5em 1.4em;border-radius:50px;font-size:var(--fs-sm);font-weight:700;letter-spacing:.04em;margin-bottom:var(--space-md);border:1px solid rgba(255,255,255,.3)}
.hero__title{color:var(--clr-white);margin-bottom:var(--space-sm);text-shadow:0 2px 20px rgba(0,0,0,.15)}
.hero__subtitle{font-size:var(--fs-md);opacity:.95;margin-bottom:var(--space-lg);line-height:1.6;font-weight:400}
.hero__actions{display:flex;gap:var(--space-sm);justify-content:center;flex-wrap:wrap}
.hero__blob{position:absolute;border-radius:var(--radius-blob);z-index:1;opacity:.15;animation:blobFloat 8s ease-in-out infinite}
.hero__blob--1{width:300px;height:300px;background:var(--clr-orange);top:-50px;right:-80px}.hero__blob--2{width:200px;height:200px;background:var(--clr-green);bottom:-40px;left:-60px;animation-delay:-3s}
@keyframes blobFloat{0%,100%{transform:translate(0,0) rotate(0deg)}33%{transform:translate(15px,-15px) rotate(5deg)}66%{transform:translate(-10px,10px) rotate(-3deg)}}

/* Quick bar */
.quick-bar{background:var(--clr-white);padding:var(--space-lg) 0;position:relative;z-index:3;margin-top:-3rem}
.quick-bar__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-md)}
.quick-card{background:var(--clr-white);border:2px solid var(--clr-gray-200);border-radius:var(--radius-lg);padding:var(--space-md);text-align:center;text-decoration:none;color:var(--clr-gray-700);transition:all var(--transition-bounce);display:flex;flex-direction:column;align-items:center;gap:.75rem;box-shadow:var(--shadow-sm)}
.quick-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:var(--shadow-lg);color:var(--clr-gray-900)}
.quick-card--green:hover{border-color:var(--clr-green)}.quick-card--orange:hover{border-color:var(--clr-orange)}.quick-card--blue:hover{border-color:var(--clr-blue)}.quick-card--red:hover{border-color:var(--clr-red)}
.quick-card__icon{width:60px;height:60px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;transition:all var(--transition-base)}
.quick-card__icon--green{background:var(--clr-green-light)}.quick-card__icon--orange{background:var(--clr-orange-light)}.quick-card__icon--blue{background:var(--clr-blue-light)}.quick-card__icon--red{background:var(--clr-red-light)}
.quick-card__icon svg{width:30px;height:30px;transition:transform var(--transition-bounce)}
.quick-card__icon--green svg{fill:var(--clr-green)}.quick-card__icon--orange svg{fill:var(--clr-orange)}.quick-card__icon--blue svg{fill:var(--clr-blue)}.quick-card__icon--red svg{fill:var(--clr-red)}
.quick-card:hover .quick-card__icon svg{transform:scale(1.15)}
.quick-card__label{font-weight:700;font-size:var(--fs-sm)}

/* About */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-xl);align-items:center}
.about-grid--reverse{direction:rtl}.about-grid--reverse>*{direction:ltr}
.about__image{border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-lg);position:relative}
.about__image img{width:100%;height:400px;object-fit:cover;transition:transform .6s ease}
.about__image:hover img{transform:scale(1.03)}
.about__content h2{margin-bottom:var(--space-sm)}.about__content p{color:var(--clr-gray-500);margin-bottom:var(--space-md)}

/* Services */
.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-md)}
.service-card{background:var(--clr-white);border-radius:var(--radius-lg);padding:var(--space-lg);border:2px solid var(--clr-gray-200);transition:all var(--transition-bounce);position:relative;overflow:hidden}
.service-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-6px)}
.service-card:nth-child(3n+1):hover{border-color:var(--clr-green)}.service-card:nth-child(3n+2):hover{border-color:var(--clr-orange)}.service-card:nth-child(3n+3):hover{border-color:var(--clr-blue)}
.service-card__icon{width:56px;height:56px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;margin-bottom:var(--space-sm)}
.service-card__icon svg{width:28px;height:28px}
.service-card:nth-child(3n+1) .service-card__icon{background:var(--clr-green-light)}.service-card:nth-child(3n+1) .service-card__icon svg{fill:var(--clr-green)}
.service-card:nth-child(3n+2) .service-card__icon{background:var(--clr-orange-light)}.service-card:nth-child(3n+2) .service-card__icon svg{fill:var(--clr-orange)}
.service-card:nth-child(3n+3) .service-card__icon{background:var(--clr-blue-light)}.service-card:nth-child(3n+3) .service-card__icon svg{fill:var(--clr-blue)}
.service-card h3{font-size:var(--fs-md);margin-bottom:.5rem}.service-card p{color:var(--clr-gray-500);font-size:var(--fs-sm)}

/* Team */
.team-showcase{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-xl);align-items:center}
.team-image{border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-lg)}.team-image img{width:100%;height:450px;object-fit:cover}
.team-info h3{margin-bottom:var(--space-sm)}.team-info p{color:var(--clr-gray-500);margin-bottom:var(--space-md)}

/* Hours */
.hours-card{background:var(--clr-white);border-radius:var(--radius-xl);padding:var(--space-lg);box-shadow:var(--shadow-lg);max-width:480px;border:2px solid var(--clr-green-light)}
.hours-card h3{margin-bottom:var(--space-md);color:var(--clr-green)}
.hours-table{width:100%;border-collapse:collapse}.hours-table tr{border-bottom:1px solid var(--clr-gray-200)}.hours-table tr:last-child{border-bottom:none}
.hours-table td{padding:.65rem 0;font-size:var(--fs-sm)}.hours-table td:first-child{font-weight:700;color:var(--clr-gray-900);width:40%}.hours-table td:nth-child(2){color:var(--clr-gray-500)}
.hours-table tr.closed td:nth-child(2){color:var(--clr-red);font-weight:700}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-xl);align-items:start}
.contact-info-list{list-style:none;padding:0;display:flex;flex-direction:column;gap:var(--space-md)}
.contact-info-item{display:flex;gap:var(--space-sm);align-items:flex-start}
.contact-info-item__icon{width:48px;height:48px;min-width:48px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center}
.contact-info-item__icon--green{background:var(--clr-green-light)}.contact-info-item__icon--orange{background:var(--clr-orange-light)}.contact-info-item__icon--blue{background:var(--clr-blue-light)}
.contact-info-item__icon svg{width:22px;height:22px}
.contact-info-item__icon--green svg{fill:var(--clr-green)}.contact-info-item__icon--orange svg{fill:var(--clr-orange)}.contact-info-item__icon--blue svg{fill:var(--clr-blue)}
.contact-info-item strong{display:block;color:var(--clr-gray-900);font-size:var(--fs-sm);margin-bottom:.15rem}
.contact-info-item span,.contact-info-item a{font-size:var(--fs-sm);color:var(--clr-gray-500)}
.map-embed{border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-md);aspect-ratio:4/3;background:var(--clr-gray-200);border:3px solid var(--clr-green-light)}
.map-embed iframe{width:100%;height:100%;border:0}

/* Emergency banner */
.emergency-banner{background:linear-gradient(135deg,var(--clr-red) 0%,#c4181c 100%);color:var(--clr-white);padding:var(--space-lg) 0}
.emergency-banner .container{display:flex;align-items:center;justify-content:center;gap:var(--space-md);flex-wrap:wrap;text-align:center}
.emergency-banner h3{color:var(--clr-white)}.emergency-banner a{color:var(--clr-white);font-weight:800;font-size:var(--fs-lg);text-decoration:underline;text-underline-offset:3px}

/* Gallery */
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-sm)}
.gallery-grid__item{border-radius:var(--radius-lg);overflow:hidden;aspect-ratio:4/3;box-shadow:var(--shadow-sm);border:3px solid transparent;transition:all var(--transition-bounce)}
.gallery-grid__item:nth-child(1):hover{border-color:var(--clr-green)}.gallery-grid__item:nth-child(2):hover{border-color:var(--clr-orange)}.gallery-grid__item:nth-child(3):hover{border-color:var(--clr-blue)}
.gallery-grid__item img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.gallery-grid__item:hover img{transform:scale(1.06)}

/* Footer */
.site-footer{background:var(--clr-gray-900);color:rgba(255,255,255,.7);padding:var(--space-2xl) 0 0}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:var(--space-xl);padding-bottom:var(--space-xl)}
.footer-brand img{height:50px;margin-bottom:var(--space-sm);border-radius:var(--radius-md)}
.footer-brand p{font-size:var(--fs-sm);line-height:1.6;max-width:300px}
.footer-col h4{color:var(--clr-green);font-family:var(--ff-body);font-weight:700;font-size:var(--fs-sm);text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--space-sm)}
.footer-links{list-style:none;padding:0}.footer-links li{margin-bottom:.4rem}.footer-links a{color:rgba(255,255,255,.6);font-size:var(--fs-sm);transition:color var(--transition-fast)}.footer-links a:hover{color:var(--clr-green)}
.footer-contact-item{display:flex;gap:.5rem;align-items:flex-start;margin-bottom:.75rem;font-size:var(--fs-sm)}
.footer-contact-item svg{width:16px;height:16px;fill:var(--clr-orange);flex-shrink:0;margin-top:3px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:var(--space-md) 0;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-sm);font-size:var(--fs-xs)}
.footer-legal-links{display:flex;gap:var(--space-md)}.footer-legal-links a{color:rgba(255,255,255,.5);font-size:var(--fs-xs)}.footer-legal-links a:hover{color:var(--clr-green)}

/* Cookie banner */
.cookie-banner{position:fixed;bottom:0;left:0;right:0;z-index:9999;background:var(--clr-gray-900);color:rgba(255,255,255,.85);padding:var(--space-md) var(--space-sm);box-shadow:0 -4px 24px rgba(0,0,0,.2);transform:translateY(100%);transition:transform var(--transition-base)}
.cookie-banner.visible{transform:translateY(0)}
.cookie-inner{max-width:var(--max-width);margin:0 auto;display:flex;align-items:center;gap:var(--space-md);flex-wrap:wrap}
.cookie-inner p{flex:1;font-size:var(--fs-sm);min-width:250px}.cookie-inner p a{color:var(--clr-green);text-decoration:underline}
.cookie-actions{display:flex;gap:.5rem;flex-shrink:0}
.cookie-btn{padding:.5em 1.2em;border-radius:50px;font-size:var(--fs-sm);font-weight:700;cursor:pointer;border:1px solid transparent;transition:all var(--transition-fast)}
.cookie-btn--accept{background:var(--clr-green);color:var(--clr-white)}.cookie-btn--accept:hover{background:var(--clr-green-dark)}
.cookie-btn--decline{background:transparent;color:rgba(255,255,255,.7);border-color:rgba(255,255,255,.3)}.cookie-btn--decline:hover{color:var(--clr-white);border-color:var(--clr-white)}

/* Page header */
.page-header{background:linear-gradient(135deg,var(--clr-green) 0%,var(--clr-blue) 100%);padding:calc(var(--header-height) + var(--space-xl)) 0 var(--space-xl);text-align:center;color:var(--clr-white);position:relative;overflow:hidden}
.page-header::before{content:'';position:absolute;top:-60px;right:-60px;width:200px;height:200px;border-radius:var(--radius-blob);background:var(--clr-orange);opacity:.15}
.page-header h1{color:var(--clr-white);margin-bottom:.5rem}.page-header p{opacity:.9;font-size:var(--fs-md)}
.breadcrumb{display:flex;justify-content:center;gap:.5rem;font-size:var(--fs-xs);margin-bottom:var(--space-sm);opacity:.8}
.breadcrumb a{color:var(--clr-white)}.breadcrumb span{opacity:.6}

/* Content page */
.content-page{padding:var(--space-2xl) 0}.content-page .container{max-width:840px}
.content-page h2{margin:var(--space-lg) 0 var(--space-sm);color:var(--clr-blue)}.content-page h3{margin:var(--space-md) 0 var(--space-xs);color:var(--clr-green-dark)}
.content-page p{margin-bottom:var(--space-sm)}

/* Scroll to top */
.scroll-top{position:fixed;bottom:2rem;right:2rem;z-index:900;width:48px;height:48px;border-radius:var(--radius-full);background:var(--clr-green);color:var(--clr-white);border:none;cursor:pointer;box-shadow:var(--shadow-green);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:all var(--transition-bounce)}
.scroll-top.visible{opacity:1;pointer-events:auto}.scroll-top:hover{background:var(--clr-green-dark);transform:translateY(-4px)}
.scroll-top svg{width:22px;height:22px;fill:var(--clr-white)}

/* Animations */
.fade-up{opacity:0;transform:translateY(30px);transition:opacity .7s ease,transform .7s ease}.fade-up.visible{opacity:1;transform:translateY(0)}

/* Tablet */
@media(max-width:1024px){
  .quick-bar__grid{grid-template-columns:repeat(2,1fr)}
  .about-grid,.team-showcase,.contact-grid{grid-template-columns:1fr;gap:var(--space-lg)}
  .about-grid--reverse{direction:ltr}.about__image img,.team-image img{height:300px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:var(--space-lg)}.gallery-grid{grid-template-columns:repeat(2,1fr)}
  .nav-toggle{display:block}
  .main-nav{position:fixed;top:0;right:0;width:min(320px,85vw);height:100vh;background:var(--clr-white);flex-direction:column;align-items:stretch;padding:calc(var(--header-height) + 1rem) var(--space-md) var(--space-md);transform:translateX(100%);transition:transform var(--transition-base);box-shadow:var(--shadow-xl);z-index:1000;overflow-y:auto}
  .main-nav.open{transform:translateX(0)}.main-nav__list{flex-direction:column;gap:0}
  .main-nav__link{padding:.85rem 1rem;font-size:var(--fs-base);border-bottom:1px solid var(--clr-gray-100);border-radius:0}
  .main-nav__link--active{border-radius:var(--radius-sm)!important}
  .nav-cta{margin-left:0;margin-top:var(--space-sm);text-align:center}.mobile-nav-overlay{display:block}
  .header-emergency{margin-left:auto;margin-right:.5rem;padding:.4em .7em;font-size:.7rem;order:2}
  .header-emergency span{display:none}
  .header-emergency svg{width:16px;height:16px}
  .nav-toggle{order:3}
}
/* Mobile */
@media(max-width:640px){
  :root{--header-height:64px}
  .hero{min-height:75vh}.quick-bar__grid{grid-template-columns:repeat(2,1fr);gap:var(--space-sm)}.quick-card{padding:var(--space-sm)}.quick-card__icon{width:48px;height:48px}
  .services-grid{grid-template-columns:1fr}.gallery-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr;gap:var(--space-lg)}.footer-bottom{flex-direction:column;text-align:center}
  .hero__actions{flex-direction:column;align-items:center}.emergency-banner .container{flex-direction:column}.section{padding:var(--space-xl) 0}.header-logo__text{display:none}.hero__blob{display:none}
}
@media print{.site-header,.cookie-banner,.scroll-top,.nav-toggle,.color-strip{display:none}body{font-size:12pt;color:#000}.hero{min-height:auto;padding:2rem 0}}

/* ============================================================
   WordPress-specific styles
   ============================================================ */

/* Skip to content */
.sr-only--focusable:focus {
  position: fixed !important;
  top: 5px; left: 5px;
  width: auto; height: auto;
  padding: 1em 1.5em;
  margin: 0;
  overflow: visible;
  clip: auto;
  white-space: normal;
  z-index: 100000;
  background: var(--clr-white);
  color: var(--clr-gray-900);
  font-weight: 700;
  border: 2px solid var(--clr-green);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-lg);
  text-decoration: none;
}

/* Announcement variants */
.announcement {
  border-radius: var(--radius-lg);
  padding: var(--space-lg);
  margin-bottom: var(--space-md);
}
.announcement--blue { background: var(--clr-blue-light); border-left: 5px solid var(--clr-blue); }
.announcement--blue .announcement__title { color: var(--clr-blue); }
.announcement--orange { background: var(--clr-orange-light); border-left: 5px solid var(--clr-orange); }
.announcement--orange .announcement__title { color: var(--clr-orange-dark); }
.announcement--red { background: var(--clr-red-light); border-left: 5px solid var(--clr-red); }
.announcement--red .announcement__title { color: var(--clr-red); }
.announcement__title { font-family: var(--ff-body); font-weight: 700; font-size: var(--fs-md); margin-bottom: .5rem; }
.announcement__text { color: var(--clr-gray-700); font-size: var(--fs-sm); }
.announcement__text p { margin-bottom: var(--space-xs); }

/* WordPress content styles */
.content-page .wp-block-image { margin: var(--space-md) 0; border-radius: var(--radius-md); overflow: hidden; }
.content-page .wp-block-image img { border-radius: var(--radius-md); }
.content-page .wp-block-heading { color: var(--clr-gray-900); }
.content-page h2.wp-block-heading { color: var(--clr-blue); margin: var(--space-lg) 0 var(--space-sm); }
.content-page h3.wp-block-heading { color: var(--clr-green-dark); margin: var(--space-md) 0 var(--space-xs); }
.content-page .wp-block-list { margin: var(--space-sm) 0; }
.content-page .wp-block-list li { margin-bottom: .3rem; }
.content-page .wp-block-table table { width: 100%; border-collapse: collapse; }
.content-page .wp-block-table td, .content-page .wp-block-table th { padding: .65rem; border-bottom: 1px solid var(--clr-gray-200); font-size: var(--fs-sm); }

/* Admin bar fix */
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }

/* WP alignment classes */
.alignwide { max-width: calc(var(--max-width) + 200px); margin-left: auto; margin-right: auto; }
.alignfull { width: 100vw; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; }
.aligncenter { text-align: center; }

/* Screen reader text (WP standard) */
.screen-reader-text {
  position: absolute !important; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.screen-reader-text:focus {
  display: block; width: auto; height: auto;
  padding: 15px 23px 14px; margin: 5px;
  font-size: 1rem; font-weight: 700; line-height: normal;
  color: #21759b; background-color: #f1f1f1;
  z-index: 100000; clip: auto !important;
}

/* GDPR: Map consent overlay */
.map-consent { position: relative; }
.map-consent__notice {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: var(--space-md);
  background: var(--clr-gray-100);
  border-radius: inherit;
}
.map-consent__notice p { font-size: var(--fs-sm); color: var(--clr-gray-500); margin-bottom: var(--space-xs); }
.map-consent__notice p:first-child { color: var(--clr-gray-900); }
.map-consent__link { margin-top: var(--space-xs); }
.map-consent__link a { font-size: var(--fs-xs); }
.map-consent iframe { width: 100%; height: 100%; border: 0; }

/* ============================================================
   Subpage Styles — Kurse
   ============================================================ */
    /* STÄRKE hero banner */
    .staerke-hero {
      background: linear-gradient(135deg, var(--clr-green-light) 0%, var(--clr-orange-light) 100%);
      border-radius: var(--radius-xl);
      padding: var(--space-xl);
      text-align: center;
      margin-bottom: var(--space-xl);
      border: 2px solid var(--clr-green);
      position: relative;
      overflow: hidden;
    }
    .staerke-hero::before {
      content: '';
      position: absolute;
      top: -50px; right: -50px;
      width: 180px; height: 180px;
      border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
      background: var(--clr-orange);
      opacity: .1;
    }
    .staerke-hero::after {
      content: '';
      position: absolute;
      bottom: -30px; left: -30px;
      width: 120px; height: 120px;
      border-radius: 70% 30% 30% 70% / 70% 70% 30% 30%;
      background: var(--clr-blue);
      opacity: .08;
    }
    .staerke-hero h2 { color: var(--clr-green-dark); margin-bottom: var(--space-sm); position: relative; }
    .staerke-hero p { color: var(--clr-gray-700); max-width: 700px; margin: 0 auto; font-size: var(--fs-sm); position: relative; }
    .staerke-badge {
      display: inline-block;
      background: var(--clr-green);
      color: var(--clr-white);
      padding: .3em 1em;
      border-radius: 50px;
      font-size: var(--fs-xs);
      font-weight: 700;
      letter-spacing: .05em;
      text-transform: uppercase;
      margin-bottom: var(--space-sm);
      position: relative;
    }

    /* Course cards */
    .kurs-card {
      background: var(--clr-white);
      border-radius: var(--radius-xl);
      padding: var(--space-xl);
      border: 2px solid var(--clr-gray-200);
      margin-bottom: var(--space-lg);
      transition: all var(--transition-base);
      position: relative;
      overflow: hidden;
    }
    .kurs-card:hover {
      box-shadow: var(--shadow-lg);
    }
    .kurs-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 5px;
    }
    .kurs-card--green::before { background: var(--clr-green); }
    .kurs-card--green:hover { border-color: var(--clr-green); }
    .kurs-card--orange::before { background: var(--clr-orange); }
    .kurs-card--orange:hover { border-color: var(--clr-orange); }
    .kurs-card--blue::before { background: var(--clr-blue); }
    .kurs-card--blue:hover { border-color: var(--clr-blue); }

    .kurs-card__emoji {
      font-size: 2.5rem;
      margin-bottom: var(--space-xs);
      display: block;
    }
    .kurs-card h3 {
      font-size: var(--fs-lg);
      margin-bottom: var(--space-sm);
    }
    .kurs-card h3 .kurs-tag {
      display: inline-block;
      font-size: var(--fs-xs);
      font-family: var(--ff-body);
      font-weight: 700;
      padding: .2em .7em;
      border-radius: 50px;
      vertical-align: middle;
      margin-left: .5em;
    }
    .kurs-tag--free { background: var(--clr-green-light); color: var(--clr-green-dark); }
    .kurs-tag--staerke { background: var(--clr-orange-light); color: var(--clr-orange-dark); }
    .kurs-card p {
      color: var(--clr-gray-500);
      font-size: var(--fs-base);
      margin-bottom: var(--space-xs);
    }
    .kurs-card__contact {
      margin-top: var(--space-md);
      padding: var(--space-md);
      background: var(--clr-gray-100);
      border-radius: var(--radius-md);
      display: flex;
      align-items: flex-start;
      gap: var(--space-sm);
    }
    .kurs-card__contact-icon {
      width: 44px; height: 44px; min-width: 44px;
      border-radius: var(--radius-md);
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .kurs-card__contact-icon--green { background: var(--clr-green-light); }
    .kurs-card__contact-icon--green svg { fill: var(--clr-green); }
    .kurs-card__contact-icon--orange { background: var(--clr-orange-light); }
    .kurs-card__contact-icon--orange svg { fill: var(--clr-orange); }
    .kurs-card__contact-icon--blue { background: var(--clr-blue-light); }
    .kurs-card__contact-icon--blue svg { fill: var(--clr-blue); }
    .kurs-card__contact-icon svg { width: 20px; height: 20px; }
    .kurs-card__contact-text { font-size: var(--fs-sm); color: var(--clr-gray-700); }
    .kurs-card__contact-text a { font-size: var(--fs-sm); }
    .kurs-card__contact-text strong { color: var(--clr-gray-900); }

    /* Question list for family training */
    .question-list {
      list-style: none;
      padding: 0;
      margin: var(--space-sm) 0 var(--space-md);
    }
    .question-list li {
      padding: .5rem 0 .5rem 2rem;
      position: relative;
      color: var(--clr-gray-700);
      font-size: var(--fs-sm);
      border-bottom: 1px solid var(--clr-gray-100);
    }
    .question-list li:last-child { border-bottom: none; }
    .question-list li::before {
      content: '?';
      position: absolute;
      left: 0; top: .5rem;
      width: 24px; height: 24px;
      border-radius: var(--radius-full);
      background: var(--clr-orange-light);
      color: var(--clr-orange);
      font-weight: 800;
      font-size: .8rem;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    /* Hebamme details list */
    .hebamme-list {
      list-style: none;
      padding: 0;
      margin: var(--space-sm) 0;
    }
    .hebamme-list li {
      padding: .4rem 0 .4rem 1.8rem;
      position: relative;
      color: var(--clr-gray-700);
      font-size: var(--fs-sm);
    }
    .hebamme-list li::before {
      content: '✓';
      position: absolute;
      left: 0;
      color: var(--clr-green);
      font-weight: 700;
    }

    /* Two column layout for family training */
    .kurs-two-col {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: var(--space-lg);
      align-items: start;
    }
    @media (max-width: 768px) {
      .kurs-two-col { grid-template-columns: 1fr; }
    }

/* ============================================================
   Subpage Styles — Videosprechstunde
   ============================================================ */
    .video-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--space-md); margin-top: var(--space-lg); }
    .video-step { background: var(--clr-white); border-radius: var(--radius-lg); padding: var(--space-lg); box-shadow: var(--shadow-md); text-align: center; position: relative; border: 2px solid var(--clr-gray-200); transition: all var(--transition-bounce); }
    .video-step:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); }
    .video-step:nth-child(1):hover { border-color: var(--clr-green); }
    .video-step:nth-child(2):hover { border-color: var(--clr-orange); }
    .video-step:nth-child(3):hover { border-color: var(--clr-blue); }
    .video-step__number { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: var(--radius-full); color: var(--clr-white); font-weight: 700; font-size: var(--fs-lg); margin-bottom: var(--space-sm); }
    .video-step:nth-child(1) .video-step__number { background: var(--clr-green); }
    .video-step:nth-child(2) .video-step__number { background: var(--clr-orange); }
    .video-step:nth-child(3) .video-step__number { background: var(--clr-blue); }
    .video-step h3 { font-size: var(--fs-md); margin-bottom: 0.5rem; }
    .video-step p { color: var(--clr-gray-500); font-size: var(--fs-sm); }
    .viomedi-badge { display: inline-flex; align-items: center; gap: var(--space-sm); background: var(--clr-offwhite); border-radius: var(--radius-md); padding: var(--space-sm) var(--space-md); margin-top: var(--space-md); border: 1px solid var(--clr-gray-200); }
    .viomedi-badge img { height: 32px; }
    .info-box { background: var(--clr-blue-light); border-radius: var(--radius-lg); padding: var(--space-lg); margin-top: var(--space-lg); border-left: 5px solid var(--clr-blue); }
    .info-box h3 { color: var(--clr-blue); margin-bottom: var(--space-sm); font-size: var(--fs-md); }
    .info-box p { color: var(--clr-gray-700); font-size: var(--fs-sm); margin-bottom: var(--space-xs); }
    .tip-box { background: var(--clr-orange-light); border-radius: var(--radius-lg); padding: var(--space-lg); margin-top: var(--space-lg); border-left: 5px solid var(--clr-orange); }
    .tip-box h3 { color: var(--clr-orange-dark); margin-bottom: var(--space-sm); font-size: var(--fs-md); }
    .tip-box p { color: var(--clr-gray-700); font-size: var(--fs-sm); margin-bottom: var(--space-xs); }
    .warning-box { background: var(--clr-red-light); border-radius: var(--radius-lg); padding: var(--space-lg); margin-top: var(--space-lg); border-left: 5px solid var(--clr-red); }
    .warning-box h3 { color: var(--clr-red); margin-bottom: var(--space-sm); font-size: var(--fs-md); }
    .warning-box p { color: var(--clr-gray-700); font-size: var(--fs-sm); margin-bottom: var(--space-xs); }
    .app-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-md); margin-top: var(--space-md); }
    .app-card { background: var(--clr-white); border-radius: var(--radius-md); padding: var(--space-md); border: 2px solid var(--clr-gray-200); }
    .app-card h4 { font-size: var(--fs-sm); margin-bottom: var(--space-xs); display: flex; align-items: center; gap: .5rem; }
    .app-card h4 span { font-size: 1.2em; }
    .app-card ol { padding-left: 1.4em; margin: 0; }
    .app-card ol li { font-size: var(--fs-sm); color: var(--clr-gray-500); padding: .15rem 0; }

/* ============================================================
   Subpage Styles — Familiennetzwerk
   ============================================================ */
    /* Beratung cards */
    .beratung-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: var(--space-md); }
    .beratung-card {
      background: var(--clr-white);
      border-radius: var(--radius-lg);
      padding: var(--space-lg);
      border: 2px solid var(--clr-gray-200);
      transition: all var(--transition-bounce);
      position: relative;
      overflow: hidden;
    }
    .beratung-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 5px;
      border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    }
    .beratung-card:nth-child(6n+1)::before { background: var(--clr-green); }
    .beratung-card:nth-child(6n+2)::before { background: var(--clr-orange); }
    .beratung-card:nth-child(6n+3)::before { background: var(--clr-blue); }
    .beratung-card:nth-child(6n+4)::before { background: var(--clr-green); }
    .beratung-card:nth-child(6n+5)::before { background: var(--clr-orange); }
    .beratung-card:nth-child(6n+6)::before { background: var(--clr-blue); }
    .beratung-card:hover {
      box-shadow: var(--shadow-lg);
      transform: translateY(-4px);
    }
    .beratung-card:nth-child(6n+1):hover { border-color: var(--clr-green); }
    .beratung-card:nth-child(6n+2):hover { border-color: var(--clr-orange); }
    .beratung-card:nth-child(6n+3):hover { border-color: var(--clr-blue); }
    .beratung-card:nth-child(6n+4):hover { border-color: var(--clr-green); }
    .beratung-card:nth-child(6n+5):hover { border-color: var(--clr-orange); }
    .beratung-card:nth-child(6n+6):hover { border-color: var(--clr-blue); }
    .beratung-card__emoji {
      font-size: 2rem;
      margin-bottom: var(--space-xs);
      display: block;
    }
    .beratung-card h3 {
      font-size: var(--fs-md);
      margin-bottom: var(--space-sm);
    }
    .beratung-card p {
      color: var(--clr-gray-500);
      font-size: var(--fs-sm);
      margin-bottom: var(--space-xs);
    }
    .beratung-meta {
      margin-top: var(--space-sm);
      padding-top: var(--space-sm);
      border-top: 1px solid var(--clr-gray-200);
      display: flex;
      flex-direction: column;
      gap: .4rem;
    }
    .beratung-meta__item {
      display: flex;
      align-items: flex-start;
      gap: .5rem;
      font-size: var(--fs-xs);
      color: var(--clr-gray-700);
    }
    .beratung-meta__item svg {
      width: 16px;
      height: 16px;
      flex-shrink: 0;
      margin-top: 2px;
    }
    .beratung-meta__item--green svg { fill: var(--clr-green); }
    .beratung-meta__item--orange svg { fill: var(--clr-orange); }
    .beratung-meta__item--blue svg { fill: var(--clr-blue); }
    .beratung-meta__item a { font-size: var(--fs-xs); }

    /* Intro banner */
    .fnw-intro {
      background: linear-gradient(135deg, var(--clr-green-light) 0%, var(--clr-blue-light) 100%);
      border-radius: var(--radius-xl);
      padding: var(--space-xl);
      text-align: center;
      margin-bottom: var(--space-xl);
      border: 2px solid var(--clr-green);
      position: relative;
      overflow: hidden;
    }
    .fnw-intro::before {
      content: '';
      position: absolute;
      top: -40px; right: -40px;
      width: 150px; height: 150px;
      border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
      background: var(--clr-orange);
      opacity: .1;
    }
    .fnw-intro h2 { margin-bottom: var(--space-sm); color: var(--clr-green-dark); }
    .fnw-intro p { color: var(--clr-gray-700); max-width: 700px; margin: 0 auto var(--space-xs); font-size: var(--fs-sm); }

    /* Location card */
    .location-card {
      background: var(--clr-white);
      border-radius: var(--radius-xl);
      padding: var(--space-lg);
      box-shadow: var(--shadow-lg);
      border: 2px solid var(--clr-orange-light);
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: var(--space-lg);
      align-items: center;
    }
    .location-card__info h3 { color: var(--clr-orange); margin-bottom: var(--space-sm); }
    .location-card__map {
      border-radius: var(--radius-lg);
      overflow: hidden;
      aspect-ratio: 4/3;
      background: var(--clr-gray-200);
    }
    .location-card__map iframe { width: 100%; height: 100%; border: 0; }

    /* STÄRKE highlight */
    .staerke-box {
      background: var(--clr-orange-light);
      border-radius: var(--radius-lg);
      padding: var(--space-lg);
      border-left: 5px solid var(--clr-orange);
      margin-bottom: var(--space-lg);
    }
    .staerke-box h3 { color: var(--clr-orange-dark); margin-bottom: var(--space-sm); font-size: var(--fs-md); }
    .staerke-box p { color: var(--clr-gray-700); font-size: var(--fs-sm); }

    @media (max-width: 768px) {
      .beratung-grid { grid-template-columns: 1fr; }
      .location-card { grid-template-columns: 1fr; }
    }

/* ============================================================
   Subpage Styles — Über Uns (Team, Rooms)
   ============================================================ */
    /* Team member cards */
    .team-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
      gap: var(--space-md);
    }
    .team-card {
      background: var(--clr-white);
      border-radius: var(--radius-xl);
      overflow: hidden;
      border: 2px solid var(--clr-gray-200);
      transition: all var(--transition-bounce);
    }
    .team-card:hover {
      transform: translateY(-6px);
      box-shadow: var(--shadow-lg);
    }
    .team-card:nth-child(5n+1):hover { border-color: var(--clr-green); }
    .team-card:nth-child(5n+2):hover { border-color: var(--clr-orange); }
    .team-card:nth-child(5n+3):hover { border-color: var(--clr-blue); }
    .team-card:nth-child(5n+4):hover { border-color: var(--clr-green); }
    .team-card:nth-child(5n+5):hover { border-color: var(--clr-orange); }

    .team-card__photo {
      width: 100%;
      aspect-ratio: 1 / 1;
      object-fit: cover;
      object-position: top center;
    }
    .team-card__info {
      padding: var(--space-md);
      text-align: center;
    }
    .team-card__name {
      font-family: var(--ff-heading);
      font-size: var(--fs-md);
      font-weight: 600;
      color: var(--clr-gray-900);
      margin-bottom: .25rem;
    }
    .team-card__role {
      font-size: var(--fs-xs);
      color: var(--clr-gray-500);
      line-height: 1.4;
    }

    /* Placeholder card for missing photo */
    .team-card--placeholder .team-card__photo-placeholder {
      width: 100%;
      aspect-ratio: 1 / 1;
      background: linear-gradient(135deg, var(--clr-green-light), var(--clr-blue-light));
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 4rem;
    }

    /* Doctor highlight card */
    .doctor-showcase {
      display: grid;
      grid-template-columns: 1fr 1.2fr;
      gap: var(--space-xl);
      align-items: center;
      margin-bottom: var(--space-xl);
    }
    .doctor-photo {
      border-radius: var(--radius-xl);
      overflow: hidden;
      box-shadow: var(--shadow-lg);
      position: relative;
    }
    .doctor-photo::after {
      content: '';
      position: absolute;
      bottom: -15px; right: -15px;
      width: 100px; height: 100px;
      border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
      background: var(--clr-green);
      opacity: .2;
      z-index: -1;
    }
    .doctor-photo img {
      width: 100%;
      aspect-ratio: 3/4;
      object-fit: cover;
      object-position: top center;
    }
    .doctor-info h2 { margin-bottom: .25rem; }
    .doctor-info .doctor-title {
      color: var(--clr-green);
      font-size: var(--fs-md);
      font-weight: 600;
      font-style: italic;
      margin-bottom: var(--space-md);
    }
    .doctor-info p { color: var(--clr-gray-500); margin-bottom: var(--space-md); }

    /* Praxis rooms */
    .rooms-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: var(--space-md);
    }
    .room-card {
      background: var(--clr-white);
      border-radius: var(--radius-lg);
      overflow: hidden;
      border: 2px solid var(--clr-gray-200);
      text-align: center;
      transition: all var(--transition-base);
    }
    .room-card:hover { box-shadow: var(--shadow-md); border-color: var(--clr-blue); }
    .room-card__placeholder {
      width: 100%;
      aspect-ratio: 4/3;
      background: linear-gradient(135deg, var(--clr-blue-light), var(--clr-green-light));
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 3rem;
    }
    .room-card__photo {
      width: 100%;
      aspect-ratio: 4/3;
      object-fit: cover;
      transition: transform .5s ease;
    }
    .room-card:hover .room-card__photo { transform: scale(1.05); }
    .room-card__label {
      padding: var(--space-sm);
      font-size: var(--fs-sm);
      font-weight: 600;
      color: var(--clr-gray-700);
    }

    @media (max-width: 768px) {
      .doctor-showcase { grid-template-columns: 1fr; }
      .doctor-photo img { aspect-ratio: 4/3; }
    }

/* ============================================================
   Subpage Styles — Notfall
   ============================================================ */
    .emergency-card { background: var(--clr-white); border-radius: var(--radius-lg); padding: var(--space-lg); box-shadow: var(--shadow-lg); margin-bottom: var(--space-md); border-left: 5px solid var(--clr-red); }
    .emergency-card h3 { color: var(--clr-red); margin-bottom: var(--space-sm); }
    .emergency-card--blue { border-left-color: var(--clr-blue); }
    .emergency-card--blue h3 { color: var(--clr-blue); }
    .emergency-number { font-size: var(--fs-2xl); font-weight: 700; color: var(--clr-red); font-family: var(--ff-heading); display: block; margin: var(--space-xs) 0; }
    .emergency-number--blue { color: var(--clr-blue); }
    .five-ws { counter-reset: ws; list-style: none; padding: 0; }
    .five-ws li { counter-increment: ws; padding: var(--space-xs) 0; border-bottom: 1px solid var(--clr-gray-200); }
    .five-ws li::before { content: counter(ws) ". "; font-weight: 700; color: var(--clr-red); }
    .five-ws li:last-child { border-bottom: none; }
