/* =========================================================================
   style.css – Gyndocs (Palette #c91d69, Spectral/Mulish, self-hosted)
   Deckt alle Klassen/Hooks der index.html ab. Kann jederzeit durch die
   Original-style.css ersetzt werden.
   ========================================================================= */

/* ---------- Fonts (Fontsource, self-hosted) ---------- */
@font-face{font-family:'Mulish';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/mulish-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Mulish';font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/mulish-latin-700-normal.woff2') format('woff2');}
@font-face{font-family:'Spectral';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/spectral-latin-500-normal.woff2') format('woff2');}
@font-face{font-family:'Spectral';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/spectral-latin-600-normal.woff2') format('woff2');}

/* ---------- Tokens ---------- */
:root{
  --rose:#c91d69; --rose-dark:#a8175a; --rose-soft:#e0559a;
  --blush:#fdf4f8; --blush-2:#fbe0ee; --petal:#fce8f2;
  --ink:#2b2230; --soft:#6f6675; --line:#f0d9e6;
  --shadow:0 18px 40px rgba(168,23,90,.10);
  --radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font-family:'Mulish',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:#fff;overflow-x:clip;line-height:1.6}
h1,h2,h3,h4,.modal-title{font-family:'Spectral',Georgia,"Times New Roman",serif;font-weight:600;line-height:1.2;color:var(--ink)}
a{color:var(--rose-dark);text-underline-offset:2px}
a:hover{color:var(--rose)}
img{max-width:100%;height:auto}

.skip-link{position:absolute;left:-999px;top:0;background:var(--rose);color:#fff;padding:.6rem 1rem;border-radius:0 0 10px 0;z-index:1200}
.skip-link:focus{left:0;color:#fff}

.eyebrow{display:inline-block;text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;font-weight:700;color:var(--rose);margin-bottom:.5rem}
.text-soft{color:var(--soft)}
.max-45{max-width:45rem}

/* ---------- Buttons ---------- */
.btn-rose{background:linear-gradient(135deg,var(--rose),var(--rose-soft));border:none;color:#fff;font-weight:700;border-radius:999px;padding:.6rem 1.4rem;box-shadow:0 8px 18px rgba(201,29,105,.28);transition:transform .15s,box-shadow .15s,filter .15s}
.btn-rose:hover,.btn-rose:focus{color:#fff;filter:brightness(1.03);transform:translateY(-1px);box-shadow:0 12px 24px rgba(201,29,105,.34)}
.btn-rose-outline{background:#fff;border:1.5px solid var(--rose);color:var(--rose);font-weight:700;border-radius:999px;padding:.55rem 1.35rem;transition:.15s}
.btn-rose-outline:hover,.btn-rose-outline:focus{background:var(--rose);color:#fff}
.btn-lg{padding:.8rem 1.7rem;font-size:1.02rem}

/* ---------- Header / Nav ---------- */
header{position:sticky;top:0;z-index:1030}
.navbar{background:rgba(255,255,255,.92);backdrop-filter:saturate(1.2) blur(8px);border-bottom:1px solid var(--line)}
.navbar-brand.brand{display:inline-flex;align-items:center;gap:.55rem}
.brand-logo-img{height:44px;width:auto;display:block}
.brand-logo{display:none}
.navbar .nav-link{color:var(--ink);font-weight:600;position:relative;padding:.4rem .85rem}
.navbar .nav-link::after{content:"";position:absolute;left:.85rem;right:.85rem;bottom:.15rem;height:2px;background:var(--rose);transform:scaleX(0);transform-origin:left;transition:transform .2s}
.navbar .nav-link:hover::after,.navbar .nav-link:focus::after{transform:scaleX(1)}
.nav-phone{display:inline-flex;align-items:center;gap:.4rem;color:var(--rose-dark);font-weight:700;text-decoration:none}
.nav-phone__icon,.hero-phone__icon{flex:0 0 auto}
.hero-phone{display:inline-flex;align-items:center;gap:.5rem;color:var(--rose-dark);font-weight:700;font-size:1.15rem;text-decoration:none}
.hero-phone:hover{color:var(--rose)}

/* ---------- Hinweis-Banner (Multi, farbig) ---------- */
.notice{border-bottom:1px solid transparent;transition:max-height .3s ease,opacity .3s ease;overflow:hidden}
.notice--info{background:linear-gradient(90deg,#e8f4f8,#f0fafe);border-color:#b8dce8;--notice-accent:#1a8aad}
.notice--warnung{background:linear-gradient(90deg,#fef3e0,#fff8ee);border-color:#f0d49e;--notice-accent:#b87d1a}
.notice--wichtig{background:linear-gradient(90deg,var(--blush-2),var(--blush));border-color:var(--line);--notice-accent:var(--rose)}
.notice__inner{display:flex;align-items:flex-start;gap:.75rem;padding:.7rem 1rem}
.notice__icon{color:var(--notice-accent);flex:0 0 auto}
.notice__icon svg{width:22px;height:22px;display:block}
.notice__text{margin:0;font-size:.95rem;color:var(--ink)}
.notice__expiry{color:var(--soft);font-size:.84rem;font-style:italic}
.notice__close{margin-left:auto;background:none;border:none;font-size:1.4rem;line-height:1;color:var(--soft);cursor:pointer;padding:0 .2rem}
.notice__close:hover{color:var(--notice-accent)}

/* ---------- Hero ---------- */
.hero{position:relative;padding:3.5rem 0 5.5rem;background:radial-gradient(1200px 500px at 80% -10%,var(--blush-2),transparent 60%),#fff;overflow:hidden}
.hero__inner{position:relative;z-index:2}
.hero__badge{display:inline-block;background:#fff;border:1px solid var(--line);color:var(--rose-dark);font-weight:700;font-size:.82rem;padding:.35rem .9rem;border-radius:999px}
.hero h1{font-size:clamp(1.9rem,4.2vw,3rem);margin-bottom:1rem}
.hero__lead{font-size:1.12rem;color:var(--soft);max-width:36rem}
.hero__bloom{width:min(78%,360px);height:auto;filter:drop-shadow(0 20px 30px rgba(201,29,105,.18));animation:float 7s ease-in-out infinite}
.hero__dot{position:absolute;border-radius:50%;filter:blur(2px);opacity:.6;z-index:1}
.hero__dot--1{width:22px;height:22px;background:var(--rose-soft);top:12%;right:20%;animation:float 6s ease-in-out infinite}
.hero__dot--2{width:14px;height:14px;background:var(--rose);top:60%;right:12%;animation:float 8s ease-in-out infinite reverse}
.hero__dot--3{width:30px;height:30px;background:var(--blush-2);top:30%;right:6%;opacity:.9;animation:float 9s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.wave{position:absolute;left:0;right:0;bottom:-1px;line-height:0}
.wave svg{width:100%;height:90px;display:block}

/* ---------- Sections ---------- */
.section{padding:4.5rem 0}
.section--blush{background:var(--blush)}
.section--petal{background:linear-gradient(180deg,#fff, var(--petal))}
.section h2{font-size:clamp(1.5rem,3vw,2.1rem)}

/* ---------- Leistungen ---------- */
.lcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;height:100%;display:flex;flex-direction:column;box-shadow:0 8px 22px rgba(168,23,90,.06);transition:transform .18s,box-shadow .18s;cursor:pointer}
.lcard[role="button"]:hover,.lcard[role="button"]:focus-visible{transform:translateY(-4px);box-shadow:var(--shadow);outline:none}
.lcard__media{aspect-ratio:16/10;overflow:hidden;background:var(--blush-2)}
.lcard__media img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.lcard:hover .lcard__media img{transform:scale(1.05)}
.lcard__body{padding:1.15rem 1.25rem 1.35rem;display:flex;flex-direction:column;gap:.5rem}
.lcard__title{font-size:1.18rem;margin:0}
.lcard__text{color:var(--soft);margin:0;font-size:.96rem}
.lcard__more{color:var(--rose);font-weight:700;font-size:.9rem;margin-top:auto}

/* ---------- Team ---------- */
.tcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.75rem 1.25rem 1.4rem;height:100%;text-align:center;display:flex;flex-direction:column;align-items:center;box-shadow:0 8px 22px rgba(168,23,90,.06);transition:transform .18s,box-shadow .18s,border-color .18s}
.tcard--clickable{cursor:pointer}
.tcard--clickable:hover,.tcard--clickable:focus-visible{transform:translateY(-5px);box-shadow:var(--shadow);border-color:var(--rose-soft);outline:none}
.tcard__avatar{width:130px;height:130px;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--blush-2);box-shadow:0 0 0 6px var(--blush),0 8px 20px rgba(168,23,90,.12);margin-bottom:1rem}
.tcard__avatar img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.tcard--clickable:hover .tcard__avatar img{transform:scale(1.06)}
.tcard__avatar--initials{background:linear-gradient(135deg,var(--rose),var(--rose-soft));color:#fff;font-family:'Spectral';font-size:2.6rem;font-weight:600}
.tcard__name{font-size:1.2rem;margin:0 0 .15rem}
.tcard__role{color:var(--rose-dark);font-weight:600;font-size:.92rem;margin:0 0 .55rem}
.tcard__text{color:var(--soft);font-size:.92rem;margin:0 0 1rem;flex:1 0 auto}
.tcard__cta{display:inline-flex;align-items:center;gap:.15rem;margin-top:auto;background:#fff;border:1.5px solid var(--rose);color:var(--rose);font-weight:700;font-size:.86rem;padding:.4rem 1rem;border-radius:999px;transition:.15s}
.tcard--clickable:hover .tcard__cta,.tcard--clickable:focus-visible .tcard__cta{background:var(--rose);color:#fff}

/* ---------- Lebenslauf-Overlay ---------- */
.cv-head{display:flex;align-items:center;gap:1rem;margin-bottom:1.25rem;padding-bottom:1rem;border-bottom:1px solid var(--line)}
.cv-avatar{width:72px;height:72px;flex:0 0 auto;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--blush-2);box-shadow:0 0 0 4px var(--blush)}
.cv-avatar img{width:100%;height:100%;object-fit:cover}
.cv-avatar--initials{background:linear-gradient(135deg,var(--rose),var(--rose-soft));color:#fff;font-family:'Spectral';font-size:1.6rem;font-weight:600}
.cv-name{font-family:'Spectral';font-size:1.25rem;font-weight:600;margin:0}
.cv-role{color:var(--rose-dark);font-weight:600;margin:.1rem 0 0}
.cv-born{color:var(--soft);margin:.1rem 0 0;font-size:.9rem}
.cv-block{margin-bottom:1.1rem}
.cv-block__title{font-size:1.02rem;color:var(--rose-dark);margin-bottom:.4rem}
.cv-timeline{list-style:none;margin:0;padding:0}
.cv-timeline li{display:flex;gap:.9rem;padding:.4rem 0;border-left:2px solid var(--line);padding-left:.9rem;margin-left:.2rem}
.cv-time{flex:0 0 8.5rem;font-weight:700;color:var(--rose-dark);font-size:.9rem}
.cv-text{color:var(--ink);font-size:.95rem}

/* ---------- Galerie + Lightbox ---------- */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.9rem}
.gallery__item{padding:0;border:none;background:var(--blush-2);border-radius:14px;overflow:hidden;aspect-ratio:4/3;cursor:pointer}
.gallery__item img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.gallery__item:hover img{transform:scale(1.06)}
.img-modal .modal-dialog{max-width:min(90vw,1100px);margin:auto;display:flex;align-items:center;justify-content:center;min-height:100vh;padding:1rem}
.img-modal .modal-content{background:transparent;border:none;box-shadow:none;overflow:visible}
.img-modal img{display:block;max-width:100%;max-height:90vh;width:auto;height:auto;object-fit:contain;border-radius:14px;margin:0 auto}
.img-modal-close{position:absolute;top:-12px;right:-12px;z-index:5;background:#fff;border-radius:50%;padding:.6rem;opacity:1;box-shadow:0 2px 8px rgba(0,0,0,.15)}
@media(max-width:575.98px){
  .img-modal .modal-dialog{padding:.5rem;max-width:100vw}
  .img-modal img{max-height:85vh;border-radius:10px}
  .img-modal-close{top:4px;right:4px;padding:.5rem}
}

/* ---------- Termin / Consent ---------- */
.termin-panel{max-width:960px;margin:0 auto}
.map-consent{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.5rem;text-align:center;box-shadow:0 8px 22px rgba(168,23,90,.05)}
#termin-container iframe,#map-container iframe{border-radius:var(--radius);box-shadow:var(--shadow)}

/* ---------- Sprechzeiten ---------- */
.hours-table{width:100%;border-collapse:collapse}
.hours-table th,.hours-table td{padding:.65rem .5rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.hours-table thead th{font-family:'Mulish';font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--soft);font-weight:700}
.hours-table tbody th{font-weight:700;font-family:'Mulish'}
.hours-table td{color:var(--soft);font-size:.95rem}

/* ---------- Kontakt ---------- */
.contact-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.75rem;box-shadow:var(--shadow)}
.form-label{font-weight:600;font-size:.9rem}
.form-control:focus,.form-check-input:focus{border-color:var(--rose-soft);box-shadow:0 0 0 .2rem rgba(201,29,105,.15)}
.form-check-input:checked{background-color:var(--rose);border-color:var(--rose)}
.hp-field{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}
.info-line{display:flex;gap:.6rem;align-items:flex-start}
.info-line .icon{font-size:1.2rem}
.route-actions{display:flex;flex-wrap:wrap;gap:.6rem}

/* ---------- Footer ---------- */
.site-footer{background:var(--blush);border-top:1px solid var(--line);padding:3rem 0 1.5rem;margin-top:1rem}
.site-footer h4{font-size:1.05rem;color:var(--rose-dark)}
.site-footer a{color:var(--rose-dark);text-decoration:none}
.site-footer a:hover{text-decoration:underline}
.footer-bottom{border-top:1px solid var(--line);margin-top:1.5rem;padding-top:1rem;color:var(--soft);font-size:.88rem}

/* ---------- Consent-Banner (fixed) ---------- */
.consent{position:fixed;left:1rem;right:1rem;bottom:1rem;max-width:520px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 24px 60px rgba(168,23,90,.22);padding:1.25rem 1.35rem;z-index:1100}
.consent[hidden]{display:none}
.consent h4{font-size:1.05rem;margin-bottom:.4rem}
.consent p{font-size:.9rem;color:var(--soft);margin-bottom:.85rem}
.consent-more{align-self:center;font-size:.88rem;font-weight:600}

/* ---------- Modals (Detail/CV/Legal) ---------- */
.modal-content{border:none;border-radius:var(--radius);box-shadow:0 30px 80px rgba(43,34,48,.3)}
.modal-header{border-bottom:1px solid var(--line)}
.modal-hero-img{width:100%;max-height:280px;object-fit:cover;border-radius:12px;margin-bottom:1rem}
.lead-intro{font-size:1.05rem;color:var(--ink)}
.detail-h{font-size:1.05rem;color:var(--rose-dark);margin-top:1.1rem}
.detail-list{margin:.4rem 0 0;padding-left:1.1rem}
.detail-list li{margin-bottom:.3rem}
.cv-role{color:var(--rose-dark);font-weight:600;margin-bottom:.2rem}
.cv-born{color:var(--soft);margin-bottom:1rem}
.cv-block{margin-bottom:1.1rem}
.cv-block__title{font-size:1.02rem;color:var(--rose-dark);margin-bottom:.4rem}
.cv-timeline{list-style:none;margin:0;padding:0}
.cv-timeline li{display:flex;gap:.9rem;padding:.35rem 0;border-left:2px solid var(--line);padding-left:.9rem;margin-left:.2rem}
.cv-time{flex:0 0 8.5rem;font-weight:700;color:var(--rose-dark);font-size:.9rem}
.cv-text{color:var(--ink);font-size:.95rem}
.legal h4{font-size:1.05rem;color:var(--rose-dark);margin-top:1rem}
.legal address{font-style:normal}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .5s ease,transform .5s ease}
.reveal.is-visible{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){.reveal{opacity:1;transform:none;transition:none}.hero__bloom,.hero__dot{animation:none}}

/* ---------- Responsive ---------- */
@media (max-width:991.98px){
  .hero{padding:2.5rem 0 4rem}
  .hero__bloom{margin-top:1.5rem}
  .cv-time{flex-basis:6.5rem}
}
@media (max-width:575.98px){
  .container{padding-left:1.25rem;padding-right:1.25rem}
  .hero h1{font-size:1.7rem}
  .btn-lg{width:100%}
  .hero .d-flex .btn{width:100%}
  .cv-timeline li{flex-direction:column;gap:.1rem}
  .cv-time{flex-basis:auto}
}

.legal-title{font-size:1.4rem;margin-bottom:1rem}
.legal-section{font-size:1.2rem;color:var(--ink);margin-top:1.8rem;margin-bottom:.6rem;padding-bottom:.4rem;border-bottom:1px solid var(--line)}
.legal h4{font-size:1.02rem;color:var(--rose-dark);margin-top:1.15rem;margin-bottom:.3rem}