/* IvaltiCare – gemeinsame Komponenten + Light-Mode + Theme-Toggle (geteilt von allen Seiten) */
/* ===== Konzept-Vollseite: Ergänzungen über style.css ===== */
:focus-visible{outline:2px solid var(--gold-bright);outline-offset:3px}

/* Hero: goldener Strahl von links + Ring-Explosion (Variante B) */
.hero-beam{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;overflow:visible}
.hero-beam .bpath{fill:none;stroke:var(--gold-light);stroke-width:2.5;stroke-linecap:round;opacity:0;
  filter:drop-shadow(0 0 4px var(--gold-bright)) drop-shadow(0 0 10px rgba(200,162,76,.6));
  stroke-dasharray:100;stroke-dashoffset:100;
  animation:beamDraw 1.3s cubic-bezier(.45,0,.5,1) 1.4s forwards, beamShow .01s linear 1.4s forwards, beamFade .6s ease 2.7s forwards}
.hero-beam .bhead{fill:var(--gold-light);opacity:0;filter:drop-shadow(0 0 6px var(--gold-bright)) drop-shadow(0 0 16px rgba(200,162,76,.7));
  animation:beamShow .01s linear 1.4s forwards, beamFade .4s ease 2.62s forwards}
@keyframes beamDraw{to{stroke-dashoffset:0}}
@keyframes beamShow{to{opacity:1}}
@keyframes beamFade{to{opacity:0}}
.seal-img{animation:sealRise .85s cubic-bezier(.16,1,.3,1) 2.6s both}
@keyframes sealRise{0%{opacity:0;transform:scale(.55)}55%{opacity:1}80%{transform:scale(1.07)}100%{opacity:1;transform:scale(1)}}
.seal-img-wrap{animation-delay:3.35s}
.impact-fx{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:0}
.impact-fx .flash{position:absolute;width:64%;aspect-ratio:1;border-radius:50%;opacity:0;background:radial-gradient(circle,rgba(246,231,184,.8),rgba(200,162,76,.18) 45%,transparent 66%);animation:impactFlash .6s ease-out 2.6s both}
@keyframes impactFlash{0%{opacity:0;transform:scale(.4)}28%{opacity:.9}100%{opacity:0;transform:scale(1.5)}}
.impact-fx .ring{position:absolute;width:42%;aspect-ratio:1;border-radius:50%;border:2px solid rgba(246,231,184,.7);opacity:0;animation:impactRing 1.1s cubic-bezier(.16,1,.3,1) 2.65s both}
.impact-fx .ring.r2{border-color:rgba(200,162,76,.5);animation-delay:2.83s}
.impact-fx .ring.r3{border-color:rgba(200,162,76,.3);animation-delay:3.01s}
@keyframes impactRing{0%{opacity:.85;transform:scale(.25)}100%{opacity:0;transform:scale(2.7)}}
.seal-stage{animation:bloomShake .5s ease-out 2.65s both}
@keyframes bloomShake{0%,100%{translate:0 0}25%{translate:0 4px}55%{translate:-3px -1px}80%{translate:2px 0}}
@media (prefers-reduced-motion:reduce){
  .seal-img{animation:none;opacity:1}
  .hero-beam,.impact-fx{display:none}
  .seal-stage{animation:none}
  .seal-img-wrap{animation-delay:0s}
}

/* Referenzen: PAPSTAR-Flaggschiff */
.papstar-feat{display:grid;grid-template-columns:240px 1fr;gap:clamp(24px,4vw,48px);align-items:center;margin-top:clamp(40px,5vw,60px);padding:clamp(28px,3.5vw,46px);border:1px solid var(--line);border-radius:8px;position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(28,22,12,.55),rgba(13,13,16,.5))}
.papstar-feat::before{content:"";position:absolute;inset:0;padding:1px;border-radius:8px;background:var(--gold-grad);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;pointer-events:none}
/* Only show the carved gradient border where mask-composite works; otherwise the slab covers the card. The base 1px border is the fallback. */
@supports ((-webkit-mask-composite:xor) or (mask-composite:exclude)){.papstar-feat::before{opacity:.5}}
.pf-logo{border:1px solid var(--line);border-radius:10px;background:rgba(8,8,10,.5);display:grid;place-items:center;padding:16px;overflow:hidden}
.pf-logo img{width:100%;height:auto;max-width:200px;object-fit:contain;mix-blend-mode:screen}
/* Without screen blend the white logo background would show as a white block in dark mode —
   fall back to a dark panel + normal blend (same as the light-mode treatment below). */
@supports not (mix-blend-mode:screen){.pf-logo{background:#15120a}.pf-logo img{mix-blend-mode:normal}}
.pf-badge{display:inline-flex;align-items:center;gap:.6em;font-size:.72rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.pf-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 8px var(--gold-bright)}
.papstar-feat h3{font-family:var(--serif);font-size:clamp(1.5rem,2.4vw,2.1rem);margin:1rem 0 .7rem;line-height:1.12}
.papstar-feat h3 .yr{background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:var(--gold);-webkit-text-fill-color:transparent}
.papstar-feat p{color:var(--ink-soft);font-size:1rem;line-height:1.65;margin:0;max-width:54ch}

/* Referenzen: Laufband */
.ref-lab{text-align:center;font-size:.72rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);margin:clamp(40px,5vw,60px) 0 1.4rem}
.marquee{position:relative;overflow:hidden;border-block:1px solid var(--line-soft);padding-block:clamp(20px,2.4vw,30px);-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.marquee-track{display:flex;width:max-content;animation:marqueeScroll 42s linear infinite}
.mset{display:flex;align-items:center;flex:0 0 auto}
.mset .nm{font-family:var(--serif);font-size:clamp(1.3rem,2.4vw,2rem);color:var(--ink-soft);letter-spacing:-.01em;white-space:nowrap}
.mset .sep{width:7px;height:7px;margin:0 clamp(30px,4.5vw,58px);background:var(--gold-grad);transform:rotate(45deg);box-shadow:0 0 10px rgba(200,162,76,.5);flex:0 0 auto}
@keyframes marqueeScroll{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .marquee{-webkit-mask-image:none;mask-image:none}
  .marquee-track{animation:none;width:100%;flex-wrap:wrap;justify-content:center;row-gap:.6rem}
  .mset{flex-wrap:wrap;justify-content:center}.mset.dup{display:none}
}
@media (max-width:620px){.papstar-feat{grid-template-columns:1fr}}

/* Kontaktformular */
.contact-form-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(36px,5vw,72px);align-items:start;position:relative}
.lead-form{display:grid;gap:1.1rem;margin-top:2rem}
.lead-form .row2{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.lf-field{display:flex;flex-direction:column;gap:.5rem}
.lf-field label{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.lf-field input,.lf-field select,.lf-field textarea{font-family:var(--sans);font-size:.95rem;color:var(--ink);background:rgba(20,20,24,.55);border:1px solid var(--line);border-radius:4px;padding:.85em 1em;min-height:48px;width:100%;transition:border-color .25s var(--ease),box-shadow .25s var(--ease)}
.lf-field textarea{resize:vertical;min-height:120px;line-height:1.6}
.lf-field input::placeholder,.lf-field textarea::placeholder{color:var(--muted)}
.lf-field input:focus,.lf-field select:focus,.lf-field textarea:focus{outline:none;border-color:var(--gold);background:rgba(28,22,12,.5);box-shadow:0 0 0 1px var(--gold)}
.lf-field select{appearance:none;-webkit-appearance:none;cursor:pointer}
.lf-consent{display:flex;align-items:flex-start;gap:.7rem;font-size:.82rem;color:var(--muted);line-height:1.5}
.lf-consent input{width:18px;height:18px;min-height:0;margin-top:.15em;accent-color:var(--gold)}
.lf-consent a{color:var(--gold)}
.lead-form .btn{justify-self:start;border:none;font-family:var(--sans)}
.form-note{color:var(--muted);font-size:.78rem;margin-top:.2rem}
.form-ok{display:none;padding:1.2rem 1.4rem;border:1px solid var(--gold);border-radius:6px;background:rgba(28,22,12,.5);color:var(--gold-light);font-size:.92rem}
.form-ok.show{display:block}
.lead-form .hp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
.form-err{display:none;margin-top:.2rem;padding:1.1rem 1.3rem;border:1px solid #b5524a;border-radius:6px;background:rgba(120,40,32,.18);color:#f0bbb3;font-size:.9rem}
.form-err a{color:#f6d9b5;text-decoration:underline}
.form-err.show{display:block}
.lead-form.sent > *:not(.form-ok){display:none}

/* Über uns: Social-Links */
.about-socials{display:flex;flex-wrap:wrap;gap:1.6rem;margin-top:1.9rem}
.about-socials a{display:inline-flex;align-items:center;gap:.5em;color:var(--gold);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;transition:color .25s var(--ease)}
.about-socials a:hover{color:var(--gold-bright)}

@media (max-width:900px){.contact-form-grid{grid-template-columns:1fr}}
@media (max-width:560px){.lead-form .row2{grid-template-columns:1fr}}

/* Gründer-Foto in „Über uns" */
.founder-row{display:flex;align-items:center;gap:1.4rem;margin-top:2rem;flex-wrap:wrap}
.founder-photo{width:118px;height:118px;border-radius:50%;object-fit:cover;object-position:50% 28%;border:1px solid var(--line);box-shadow:0 0 0 4px rgba(200,162,76,.08),0 14px 32px -18px rgba(0,0,0,.75);flex:0 0 auto}
.founder-name{font-family:var(--serif);font-size:1.25rem;color:var(--ink);line-height:1.2}
.founder-role{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-top:.25rem}
.about-socials{display:flex;flex-wrap:wrap;gap:1.2rem;margin-top:.9rem}
.about-socials a{display:inline-flex;align-items:center;gap:.4em;color:var(--gold);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;transition:color .25s var(--ease)}
.about-socials a:hover{color:var(--gold-bright)}

/* Theme-Umschalter */
.theme-toggle{width:40px;height:40px;border-radius:8px;border:1px solid var(--line);background:transparent;color:var(--ink-soft);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .25s var(--ease),color .25s var(--ease);margin-right:.7rem;flex:0 0 auto}
.theme-toggle:hover{border-color:var(--gold);color:var(--gold-bright)}
.theme-toggle svg{width:18px;height:18px}
html[data-theme="dark"] .ic-moon{display:none}
html:not([data-theme="dark"]) .ic-sun{display:none}
html.theme-anim *{transition:background-color .42s ease,color .42s ease,border-color .42s ease,fill .42s ease,stroke .42s ease!important}
@media (prefers-reduced-motion:reduce){html.theme-anim *{transition:none!important}}

/* ===== LIGHT MODE — heller Zwilling der Schwarz/Gold-Seite ===== */
html[data-theme="light"]{
  --bg:#f7f4ec; --bg-soft:#efeadd; --bg-panel:rgba(255,255,255,.66);
  --ink:#1a160d; --ink-soft:#46412f; --muted:#6f6755;
  --gold:#7e6224; --gold-bright:#6f561f; --gold-light:#7a5f24; --gold-deep:#6f561f; --bronze:#e9e3d3;
  --line:rgba(138,109,44,.32); --line-soft:rgba(138,109,44,.15);
  --gold-grad:linear-gradient(120deg,#6f561f 0%,#826627 45%,#7a5f24 100%);
}
html[data-theme="light"] body{cursor:auto}
html[data-theme="light"] a,html[data-theme="light"] .btn,html[data-theme="light"] button,html[data-theme="light"] label,html[data-theme="light"] summary{cursor:pointer}
html[data-theme="light"] .cursor-dot,html[data-theme="light"] .cursor-ring,html[data-theme="light"] .cursor-spotlight{display:none}
html[data-theme="light"] .site-header.is-scrolled{background:rgba(247,244,236,.86)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){html[data-theme="light"] .site-header.is-scrolled{background:rgba(247,244,236,.97)}}
html[data-theme="light"] .service{background:linear-gradient(155deg,rgba(255,255,255,.78),rgba(247,244,236,.5))}
html[data-theme="light"] .band{background:linear-gradient(180deg,rgba(241,237,226,.7),#f7f4ec)}
html[data-theme="light"] .stat{background:rgba(255,255,255,.72)}
html[data-theme="light"] .values li{background:rgba(255,255,255,.66)}
html[data-theme="light"] .contact{background:linear-gradient(180deg,#f7f4ec,#efeadd)}
html[data-theme="light"] .nav-menu{background:rgba(247,244,236,.98)}
html[data-theme="light"] .loader{background:#f7f4ec}
html[data-theme="light"] .papstar-feat{background:linear-gradient(135deg,rgba(255,255,255,.8),rgba(247,244,236,.55))}
html[data-theme="light"] .pf-logo{background:#15120a}
html[data-theme="light"] .pf-logo img{mix-blend-mode:normal}
html[data-theme="light"] .lead-form input,html[data-theme="light"] .lead-form select,html[data-theme="light"] .lead-form textarea{background:rgba(255,255,255,.85);color:var(--ink)}
html[data-theme="light"] .lead-form input:focus,html[data-theme="light"] .lead-form select:focus,html[data-theme="light"] .lead-form textarea:focus{background:#fff}
html[data-theme="light"] .form-ok{background:rgba(255,255,255,.88);color:var(--gold-bright)}
html[data-theme="light"] .founder-photo{box-shadow:0 0 0 4px rgba(138,109,44,.10),0 14px 30px -18px rgba(0,0,0,.25)}
html[data-theme="light"] .flow-node{fill:rgba(255,255,255,.9)}
html[data-theme="light"] .flow-node:hover{fill:rgba(247,244,236,.98);stroke:var(--gold-bright)}
html[data-theme="light"] .flow-node,html[data-theme="light"] .flow-group{cursor:pointer}
html[data-theme="light"] .flow-tooltip rect{fill:rgba(26,22,13,.96)}
html[data-theme="light"] .flow-tooltip-text{fill:#c8a24c}

/* FAQ-Akkordeon (Startseite + Landingpages) */
.faq{display:grid;gap:0;max-width:880px;margin-top:clamp(30px,4vw,48px);border-top:1px solid var(--line-soft)}
.faq-item{border-bottom:1px solid var(--line-soft)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.3rem 0;font-family:var(--serif);font-size:clamp(1.1rem,1.6vw,1.4rem);color:var(--ink);transition:color .25s var(--ease)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover,.faq-item[open] summary{color:var(--gold-bright)}
.faq-item .qm{flex:0 0 auto;width:20px;height:20px;position:relative}
.faq-item .qm::before,.faq-item .qm::after{content:"";position:absolute;background:var(--gold);border-radius:2px}
.faq-item .qm::before{top:9px;left:1px;width:18px;height:2px}
.faq-item .qm::after{top:1px;left:9px;width:2px;height:18px;transition:transform .3s var(--ease),opacity .3s var(--ease)}
.faq-item[open] .qm::after{transform:rotate(90deg);opacity:0}
.faq-item .faq-a{padding:0 0 1.4rem;color:var(--ink-soft);font-size:1rem;line-height:1.7;max-width:72ch}

/* Interner Verweis von Karten auf Detailseiten */
.svc-more{display:inline-flex;align-items:center;gap:.5em;margin-top:1.4rem;font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);transition:gap .25s var(--ease),color .25s var(--ease)}
.svc-more:hover{color:var(--gold-bright);gap:.8em}