/* Hope Church – Homepage-Sektionen (portiert aus Mockup v5).
   Fotos als CSS-Backgrounds mit WebP-Bevorzugung + JPEG-Fallback (image-set), theme-relative Pfade. */

:root{
  --teal:#2C5F5A;--teal-light:#3A7A73;--teal-pale:#E8F0EE;--cream:#FAF8F5;--dark:#1a1a1a;
  --peach:#E8A87C;--peach-pale:#F7E3D6;--sand:#F0EDE6;
  --text-secondary:#666;--text-muted:#6B6B6B;--text-light:#767676;--nav-text:#555;--border:#e8e5e0;
}

/* Scoped Reset für Homepage-Inhalt (nicht site-weit) */
.hc-home,.hc-home *,.hc-home *::before,.hc-home *::after{box-sizing:border-box}
.hc-home h1,.hc-home h2,.hc-home h3,.hc-home p{margin:0}
.hc-home .serif{font-family:'Cormorant Garamond',serif}

/* Nicht-Homepage-Templates: Platz für die fixe Navigation schaffen */
.page-main{padding-top:72px;min-height:60vh}
@media(max-width:900px){.page-main{padding-top:60px}}

/* ===== LAYOUT ===== */
/* Wiederverwendbare Content-Container (beide zentriert):
   .wrap        = 1060px → Abschnitte mit Bildern/Cards (wie Homepage)
   .wrap-narrow =  780px → text-lastige Abschnitte (Unterseiten) */
.wrap{max-width:1060px;margin:0 auto}
.wrap-narrow{max-width:780px;margin:0 auto}

/* ===== HERO ===== */
.hero{display:flex;min-height:100vh;overflow:hidden}
.hero-img{flex:1.15;position:relative;min-height:500px;background-color:#dfe6e4;background-position:center;background-size:cover;
  background-image:url('../images/hero.jpg');
  background-image:-webkit-image-set(url('../images/hero.webp') type('image/webp'), url('../images/hero.jpg') type('image/jpeg'));
  background-image:image-set(url('../images/hero.webp') type('image/webp'), url('../images/hero.jpg') type('image/jpeg'))}
.hero-img::after{content:'';position:absolute;inset:0;background:linear-gradient(to right,transparent 60%,rgba(255,255,255,.15) 100%)}
.hero-text{flex:0.85;padding:7rem 4rem 5rem;display:flex;flex-direction:column;justify-content:center;background:#fff}
.hero-tagline{font-family:'Cormorant Garamond',serif;font-size:50px;font-weight:600;color:var(--teal);line-height:1.12;margin-bottom:1.5rem}
.hc-home .hero-desc{font-size:17px;line-height:1.8;color:var(--text-secondary);margin-top:2rem;margin-bottom:3rem;max-width:440px}
.btn-group{display:flex;gap:16px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;min-width:180px;background:var(--teal);color:#fff;padding:15px 32px;border-radius:6px;font-size:15px;font-weight:600;text-decoration:none;border:2px solid transparent;cursor:pointer;letter-spacing:.5px;transition:all .2s;font-family:'Nunito Sans',sans-serif}
/* Solid-Button wird beim Hover zum Outline (Border transparent → Teal, kein Layout-Shift) */
.btn:hover{background:var(--peach);color:#fff;border-color:var(--peach)}
.btn-outline{background:transparent;color:var(--teal);border-color:var(--teal)}
.btn-outline:hover{background:var(--peach);color:#fff;border-color:var(--peach)}
/* Directions-Button in der Service-Info-Card: Hover in Teal statt Peach */
.service-info-card .btn-outline:hover{background:var(--teal);color:#fff;border-color:var(--teal)}

/* ===== Accessibility ===== */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;z-index:10000}
.skip-link:focus{position:fixed;top:12px;left:12px;width:auto;height:auto;padding:0.8rem 1.5rem;background:#2C5F5A;color:#fff;font-size:1rem;font-family:'Nunito Sans',sans-serif;text-decoration:none;border-radius:6px;z-index:10000}
:focus-visible{outline:2px solid #2C5F5A;outline-offset:2px}

/* ===== SECTIONS ===== */
.section{padding:5rem 4rem}
.section-alt{background:var(--sand)}
.section-warm{background:var(--peach-pale)}
.section-dark{background:var(--teal);color:#fff}
.s-title{font-family:'Cormorant Garamond',serif;font-size:42px;font-weight:600;color:var(--teal);margin-bottom:.25rem}
.section-dark .s-title{color:#fff}
.s-sub{font-size:12px;text-transform:uppercase;letter-spacing:3px;color:var(--peach);margin-bottom:2rem;font-weight:600}
.section-dark .s-sub{color:#A8D5BA}
.section-intro{font-size:16px;line-height:1.8;color:var(--text-secondary);max-width:600px;margin-bottom:.5rem}
.section-intro-wide{max-width:none}

/* ===== WHO WE ARE ===== */
.vision-row{display:flex;gap:2.5rem;margin-bottom:2.5rem;align-items:stretch}
.vision-img{width:300px;min-height:300px;border-radius:16px;flex-shrink:0;background-color:#dfe6e4;background-position:center;background-size:cover;
  background-image:url('../images/vision.jpg');
  background-image:-webkit-image-set(url('../images/vision.webp') type('image/webp'), url('../images/vision.jpg') type('image/jpeg'));
  background-image:image-set(url('../images/vision.webp') type('image/webp'), url('../images/vision.jpg') type('image/jpeg'))}
.vision-box{background:#fff;border-radius:16px;padding:2.5rem 3rem;border:1px solid var(--border);border-left:4px solid var(--teal);flex:1;display:flex;flex-direction:column;justify-content:center}
.vision-quote{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:400;font-style:italic;color:var(--teal);line-height:1.4;margin-bottom:1.25rem}
.vision-text{font-size:15px;line-height:1.7;color:var(--text-muted)}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.pillar{background:#fff;border-radius:14px;padding:2rem 1.5rem;text-align:center;border:1px solid var(--border);transition:transform .2s}
.pillar:hover{transform:translateY(-4px);border-top:3px solid var(--peach)}
.pillar-dot{width:56px;height:56px;border-radius:50%;margin:0 auto 1rem;display:flex;align-items:center;justify-content:center;font-size:24px}
.pillar-dot.f{background:var(--peach-pale)}.pillar-dot.p{background:#D4E8DD}.pillar-dot.s{background:#D4E2EC}
.pillar-title{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:600;color:var(--teal);margin-bottom:.5rem}
.pillar-text{font-size:14px;line-height:1.6;color:var(--text-muted)}

/* ===== WHAT TO EXPECT ===== */
.expect-row{display:flex;gap:2.5rem;margin-top:1.5rem;align-items:stretch}
.expect-img{width:280px;border-radius:14px;flex-shrink:0;min-height:280px;background-color:#dfe6e4;background-position:center;background-size:cover;
  background-image:url('../images/expect.jpg');
  background-image:-webkit-image-set(url('../images/expect.webp') type('image/webp'), url('../images/expect.jpg') type('image/jpeg'));
  background-image:image-set(url('../images/expect.webp') type('image/webp'), url('../images/expect.jpg') type('image/jpeg'))}
.expect-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;flex:1}
.expect-card{text-align:center;padding:1.5rem 1rem;background:#fff;border-radius:14px;border-left:4px solid var(--teal);transition:transform .2s}
.expect-card:hover{transform:translateY(-3px)}
.expect-icon{font-size:28px;margin-bottom:.5rem;color:var(--teal)}
.expect-label{font-size:16px;font-weight:600;color:var(--dark);margin-bottom:4px}
.expect-desc{font-size:13px;color:var(--text-light);line-height:1.4}

/* ===== JOIN US ===== */
.info-bar{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:1.5rem;max-width:800px;margin-left:auto;margin-right:auto}
.info-item{text-align:center}
.info-label{font-size:11px;text-transform:uppercase;letter-spacing:2.5px;color:rgba(255,255,255,.5);margin-bottom:6px;font-weight:600}
.info-value{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:600;color:#fff}

/* ===== GET CONNECTED ===== */
.connect-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;margin-top:1.5rem;grid-auto-rows:1fr}
.connect-card{display:flex;flex-direction:column;flex:1;border-radius:14px;overflow:hidden;background:#fff;text-decoration:none;color:inherit;transition:transform .2s}
.connect-card:hover{transform:translateY(-4px);border-top:3px solid var(--peach)}
.connect-card-img{height:140px;background-color:#dfe6e4;background-size:cover;background-position:center}
.ci-groups{background-image:url('../images/connect-groups.jpg');background-image:-webkit-image-set(url('../images/connect-groups.webp') type('image/webp'), url('../images/connect-groups.jpg') type('image/jpeg'));background-image:image-set(url('../images/connect-groups.webp') type('image/webp'), url('../images/connect-groups.jpg') type('image/jpeg'))}
.ci-events{background-image:url('../images/connect-events.jpg');background-image:-webkit-image-set(url('../images/connect-events.webp') type('image/webp'), url('../images/connect-events.jpg') type('image/jpeg'));background-image:image-set(url('../images/connect-events.webp') type('image/webp'), url('../images/connect-events.jpg') type('image/jpeg'))}
.ci-fellowship{background-image:url('../images/connect-fellowship.jpg');background-image:-webkit-image-set(url('../images/connect-fellowship.webp') type('image/webp'), url('../images/connect-fellowship.jpg') type('image/jpeg'));background-image:image-set(url('../images/connect-fellowship.webp') type('image/webp'), url('../images/connect-fellowship.jpg') type('image/jpeg'))}
.ci-discipleship{background-image:url('../images/connect-discipleship.jpg');background-image:-webkit-image-set(url('../images/connect-discipleship.webp') type('image/webp'), url('../images/connect-discipleship.jpg') type('image/jpeg'));background-image:image-set(url('../images/connect-discipleship.webp') type('image/webp'), url('../images/connect-discipleship.jpg') type('image/jpeg'))}
.connect-card-body{padding:1rem 1.25rem}
.connect-title{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:600;color:var(--teal);margin-bottom:.3rem}
.connect-text{font-size:13px;color:var(--text-light);line-height:1.5}

/* ===== Newsletter "Get updated" (Mailchimp-Embed) ===== */
.newsletter-card{max-width:600px;margin:2rem auto 0;background:#fff;border-radius:16px;padding:2.5rem;box-shadow:0 4px 24px rgba(0,0,0,.06)}
.nl-intro{font-family:'Nunito Sans',sans-serif;font-size:15px;line-height:1.6;color:var(--text-secondary);text-align:center;margin:0 0 1.5rem}
.nl-divider{border:none;border-top:1px solid var(--border);width:60%;margin:1.5rem auto}
.newsletter-card label{display:block;font-family:'Nunito Sans',sans-serif;font-size:13px;font-weight:600;color:var(--dark);margin:0 0 .35rem}
.newsletter-card input[type="text"],.newsletter-card input[type="email"]{width:100%;padding:.75rem 1rem;border:1px solid var(--border);border-radius:8px;font-family:'Nunito Sans',sans-serif;font-size:15px;color:var(--dark);background:#fff;margin-bottom:1.1rem}
.newsletter-card input[type="text"]:focus,.newsletter-card input[type="email"]:focus{outline:none;border-color:var(--teal)}
.newsletter-card input[type="text"]:focus-visible,.newsletter-card input[type="email"]:focus-visible{outline:2px solid #2C5F5A;outline-offset:2px}
.nl-row{display:flex;gap:1rem}
.nl-col{flex:1}
.newsletter-card label.nl-consent{display:flex;align-items:flex-start;gap:.6rem;font-size:14px;font-weight:400;line-height:1.5;color:var(--text-secondary);margin:.25rem 0 1.25rem;cursor:pointer}
.nl-consent input{margin-top:.25rem;flex-shrink:0}
.nl-submit{width:100%;background:var(--teal);color:#fff;border:2px solid var(--teal);border-radius:8px;padding:.9rem 1rem;font-family:'Nunito Sans',sans-serif;font-size:15px;font-weight:600;letter-spacing:.5px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.nl-submit:hover{background:transparent;color:var(--teal);border-color:var(--teal)}
.nl-submit:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:600px){
  .newsletter-card{padding:1.75rem 1.25rem}
  .nl-row{flex-direction:column;gap:0}
}

/* ===== FOOTER ===== */
.footer{background:var(--dark);color:#fff;padding:3rem 4rem}
.footer-inner{display:flex;justify-content:space-between;align-items:center}
.footer *{box-sizing:border-box}
.footer-logo{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;letter-spacing:2px;text-transform:uppercase}
.footer-sub{font-size:11px;color:rgba(255,255,255,.55);margin-top:4px}
.footer-links{font-size:13px;color:rgba(255,255,255,.55)}
.footer-links a{color:rgba(255,255,255,.55);text-decoration:none;margin-left:20px;transition:color .2s}
.footer-links a:hover{color:#fff}

/* Footer-Newsletter (alle Seiten außer Startseite) */
.footer-newsletter{max-width:340px;font-family:'Nunito Sans',sans-serif}
.footer-newsletter,.footer-newsletter *{box-sizing:border-box}
.fn-heading{font-size:13px;color:#fff;margin:0 0 .6rem}
.footer-newsletter input[type="text"],.footer-newsletter input[type="email"]{flex:1;min-width:0;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.3);border-radius:6px;padding:.5rem .7rem;font-family:'Nunito Sans',sans-serif;font-size:13px;color:#fff}
.footer-newsletter input::placeholder{color:rgba(255,255,255,.6)}
.footer-newsletter input:focus{outline:none;border-color:rgba(255,255,255,.7)}
.footer-newsletter input:focus-visible{outline:2px solid rgba(255,255,255,.7);outline-offset:2px}
.fn-row{display:flex;gap:.5rem;margin-bottom:.5rem}
.fn-submit{background:#fff;color:var(--dark);border:1px solid #fff;border-radius:6px;padding:.5rem 1rem;font-family:'Nunito Sans',sans-serif;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s,border-color .2s}
.fn-submit:hover{background:transparent;color:#fff;border-color:#fff}
.fn-consent{display:flex;align-items:flex-start;gap:.4rem;font-size:11px;line-height:1.4;color:rgba(255,255,255,.6);margin-top:.4rem;cursor:pointer}
.fn-consent input{margin-top:.15rem;flex-shrink:0}
body.home .footer-newsletter{display:none}

/* ===== RESPONSIVE ===== */
@media(max-width:900px){
  .hero{flex-direction:column}.hero-img{min-height:55vh}
  .hero-text{padding:2.5rem 2rem}.hero-tagline{font-size:34px}
  .vision-row{flex-direction:column}.vision-img{width:100%;min-height:200px}
  .pillars{grid-template-columns:1fr}
  .expect-row{flex-direction:column}.expect-img{width:100%;min-height:200px}
  .connect-grid{grid-template-columns:1fr 1fr}
  .section{padding:3rem 2rem}
  .footer-inner{flex-direction:column;text-align:center;gap:1rem}
  .info-bar{grid-template-columns:1fr;gap:1.5rem}
}

/* =========================================================================
   WIEDERVERWENDBARE UNTERSEITEN-KOMPONENTEN (Vorlage für alle Subpages)
   ========================================================================= */

/* Seiten-Hero: vollbreites Bild + Overlay + zentrierter Titel (schmaler als Homepage-Hero).
   Bild je Seite über eine Modifier-Klasse (.hero-about o. ä.) setzen. */
.page-hero{position:relative;min-height:52vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:8rem 2rem 4rem;color:#fff;background-color:#2C5F5A;background-position:center;background-size:cover}
.page-hero::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(26,26,26,.30),rgba(26,26,26,.62))}
.page-hero>*{position:relative;z-index:1}
.page-hero-title{font-family:'Cormorant Garamond',serif;font-size:clamp(40px,6vw,64px);font-weight:600;color:#fff;line-height:1.1;margin:0}
.page-hero-sub{font-size:17px;line-height:1.7;max-width:620px;margin:1.25rem auto 0;color:rgba(255,255,255,.9)}

/* Fließtext-Block (in .wrap-narrow) */
.prose>p{font-size:17px;line-height:1.85;color:var(--text-secondary);margin-bottom:1.25rem}
.prose>p:last-child{margin-bottom:0}
.prose h3{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:600;color:var(--teal);line-height:1.25;margin:2.25rem 0 .75rem}
.prose h3:first-child{margin-top:0}
.prose strong{color:var(--dark)}

/* Aufzählung mit Teal-Punkt (Werte, Mission, Vision) */
.value-list{list-style:none;margin:0 0 1.25rem;padding:0}
.value-list li{position:relative;padding-left:1.75rem;margin-bottom:.7rem;font-size:16px;line-height:1.7;color:var(--text-secondary)}
.value-list li::before{content:'';position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:50%;background:var(--teal-light)}

/* Bild-neben-Text-Zeile (z. B. „House of prayer") */
.split-row{display:flex;gap:2.5rem;align-items:center}
.split-img{flex:0 0 44%;min-height:320px;border-radius:16px;background-color:#dfe6e4;background-size:cover;background-position:center}
.split-text{flex:1}
.split-reverse{flex-direction:row-reverse}

/* Team-/Leiterschaft-Cards */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.75rem;margin-top:1.5rem}
.team-card{background:#fff;border:1px solid var(--border);border-radius:14px;overflow:hidden;transition:transform .2s}
.team-card:hover{transform:translateY(-4px);border-top:3px solid var(--peach)}
.team-photo{width:100%;aspect-ratio:3/2;background-color:#dfe6e4;background-size:cover;background-position:center top}
.team-body{padding:1.25rem 1.5rem 1.5rem}
.team-name{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--teal);margin:0 0 .15rem}
.team-role{font-size:12px;text-transform:uppercase;letter-spacing:1.5px;color:var(--teal-light);font-weight:600;margin-bottom:.6rem}
.team-bio{font-size:14px;line-height:1.65;color:var(--text-muted)}

/* Zentrierter CTA-Text im dunklen Band (nutzt .section.section-dark + .btn) */
.cta-narrow{max-width:620px;margin:0 auto;text-align:center}
.cta-narrow .s-title{margin-bottom:.5rem}
.cta-narrow .btn{margin-top:1.5rem}
.cta-narrow-text{font-size:17px;line-height:1.8;color:rgba(255,255,255,.85)}
.btn-light{background:transparent;color:#fff;border:1.5px solid #fff}
.btn-light:hover{background:var(--peach);color:#fff;border-color:var(--peach)}

/* Seitenspezifische Hintergrundbilder (WebP bevorzugt, JPEG-Fallback).
   about-prayer: Foto Nate Steele via Unsplash (https://unsplash.com/photos/FPdkDrq9X-4),
   Unsplash License (kostenlos, kommerziell, keine Attribution nötig). */
.hero-about{background-position:center 52%;background-image:url('../images/about-hero.jpg');background-image:-webkit-image-set(url('../images/about-hero.webp') type('image/webp'), url('../images/about-hero.jpg') type('image/jpeg'));background-image:image-set(url('../images/about-hero.webp') type('image/webp'), url('../images/about-hero.jpg') type('image/jpeg'))}
.img-prayer{background-position:center 25%;background-image:url('../images/about-prayer.jpg');background-image:-webkit-image-set(url('../images/about-prayer.webp') type('image/webp'), url('../images/about-prayer.jpg') type('image/jpeg'));background-image:image-set(url('../images/about-prayer.webp') type('image/webp'), url('../images/about-prayer.jpg') type('image/jpeg'))}
.tp-martin-heike{background-image:url('../images/team/martin-heike.jpg');background-image:-webkit-image-set(url('../images/team/martin-heike.webp') type('image/webp'), url('../images/team/martin-heike.jpg') type('image/jpeg'));background-image:image-set(url('../images/team/martin-heike.webp') type('image/webp'), url('../images/team/martin-heike.jpg') type('image/jpeg'))}
.tp-jason{background-image:url('../images/team/jason-dani.jpg');background-image:-webkit-image-set(url('../images/team/jason-dani.webp') type('image/webp'), url('../images/team/jason-dani.jpg') type('image/jpeg'));background-image:image-set(url('../images/team/jason-dani.webp') type('image/webp'), url('../images/team/jason-dani.jpg') type('image/jpeg'))}
.tp-jennie{background-image:url('../images/team/jennie.jpg');background-image:-webkit-image-set(url('../images/team/jennie.webp') type('image/webp'), url('../images/team/jennie.jpg') type('image/jpeg'));background-image:image-set(url('../images/team/jennie.webp') type('image/webp'), url('../images/team/jennie.jpg') type('image/jpeg'))}
/* Platzhalter — Fotos folgen; .team-photo hat bereits background-color:#dfe6e4 */
.tp-ute{background-image:url('../images/team/ute.jpg');background-image:-webkit-image-set(url('../images/team/ute.webp') type('image/webp'), url('../images/team/ute.jpg') type('image/jpeg'));background-image:image-set(url('../images/team/ute.webp') type('image/webp'), url('../images/team/ute.jpg') type('image/jpeg'))}
.tp-yakubu-veronika{background-image:url('../images/team/yakubu-veronika.jpg?v=2');background-image:-webkit-image-set(url('../images/team/yakubu-veronika.webp?v=2') type('image/webp'), url('../images/team/yakubu-veronika.jpg?v=2') type('image/jpeg'));background-image:image-set(url('../images/team/yakubu-veronika.webp?v=2') type('image/webp'), url('../images/team/yakubu-veronika.jpg?v=2') type('image/jpeg'))}
.tp-eva{background-image:url('../images/team/eva.jpg');background-image:-webkit-image-set(url('../images/team/eva.webp') type('image/webp'), url('../images/team/eva.jpg') type('image/jpeg'));background-image:image-set(url('../images/team/eva.webp') type('image/webp'), url('../images/team/eva.jpg') type('image/jpeg'))}
.hero-church-life{background-position:center 35%;background-image:url('../images/_mg_7839.jpg');background-image:-webkit-image-set(url('../images/_mg_7839.webp') type('image/webp'), url('../images/_mg_7839.jpg') type('image/jpeg'));background-image:image-set(url('../images/_mg_7839.webp') type('image/webp'), url('../images/_mg_7839.jpg') type('image/jpeg'))}
.img-cl-connect{background-image:url('../images/cl-connect.jpg');background-image:-webkit-image-set(url('../images/cl-connect.webp') type('image/webp'), url('../images/cl-connect.jpg') type('image/jpeg'));background-image:image-set(url('../images/cl-connect.webp') type('image/webp'), url('../images/cl-connect.jpg') type('image/jpeg'))}
.img-cl-kids{background-image:url('../images/cl-kids.jpg');background-image:-webkit-image-set(url('../images/cl-kids.webp') type('image/webp'), url('../images/cl-kids.jpg') type('image/jpeg'));background-image:image-set(url('../images/cl-kids.webp') type('image/webp'), url('../images/cl-kids.jpg') type('image/jpeg'))}

@media(max-width:900px){
  .page-hero{min-height:42vh;padding:6rem 1.5rem 3rem}
  .split-row{flex-direction:column}
  .split-img{width:100%;flex-basis:auto;min-height:240px}
  .team-grid{grid-template-columns:1fr;gap:1.25rem;max-width:420px;margin-left:auto;margin-right:auto}
}

/* =========================================================================
   DISCOVER JESUS – zusätzliche wiederverwendbare Komponenten
   ========================================================================= */

/* sanftes Scrollen zu Anchor-Sektionen + Offset für die fixe Navigation */
html{scroll-behavior:smooth}
.hc-home section[id]{scroll-margin-top:84px}

/* Hero-Anchor-Links – kleine halbtransparente Buttons */
.hero-links{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center;margin-top:1.75rem}
.hero-link{font-family:'Nunito Sans',sans-serif;font-size:14px;font-weight:600;letter-spacing:.5px;padding:8px 18px;border:1px solid rgba(255,255,255,.5);border-radius:5px;color:#fff;text-decoration:none;transition:all .2s}
.hero-link:hover{background:#fff;color:var(--teal);border-color:#fff}

/* Bibelverse als Blockquote (Cormorant kursiv, eingerückt, Stellenangabe darunter) */
.prose blockquote{margin:1.75rem 0;padding:.25rem 0 .25rem 1.5rem;border-left:3px solid var(--peach);font-family:'Cormorant Garamond',serif;font-style:italic;font-size:21px;line-height:1.5;color:var(--teal)}
.prose blockquote .ref{display:block;margin-top:.4rem;font-family:'Nunito Sans',sans-serif;font-style:normal;font-size:13px;letter-spacing:.5px;color:var(--text-light)}

/* ABC-Box – Highlight mit leichtem Teal-Hintergrund, große Bold-Initialen */
.abc-box{background:#fff;border-radius:14px;padding:1.75rem 2rem;margin:2rem 0;border-left:4px solid var(--peach)}
.abc-item{display:flex;gap:1.25rem;align-items:flex-start}
.abc-item + .abc-item{margin-top:1.25rem;padding-top:1.25rem;border-top:1px solid var(--border)}
.abc-letter{flex:0 0 1.3em;font-family:'Cormorant Garamond',serif;font-size:44px;font-weight:700;line-height:1;color:var(--teal)}
.abc-text{font-size:16px;line-height:1.6;color:var(--text-secondary)}
.abc-text em{display:block;margin-top:.4rem;font-size:14px;font-style:italic;color:var(--text-muted)}

/* Gebets-Sektion (Abschnitt 4) – hervorgehoben auf Deep Teal */
.prayer{max-width:680px;margin:0 auto;text-align:center}
.prayer-text{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:22px;line-height:1.6;color:#fff;margin:0 0 1rem}
.prayer-after{font-size:16px;line-height:1.75;color:rgba(255,255,255,.85);margin-top:2.5rem;padding-top:2.5rem}
.prayer-after em{color:#fff;font-style:italic}
.prayer .btn{margin-top:1.75rem}

/* Primär-Button (solide Teal) für helle Sektionen + Abstand für Sektions-Buttons */
.btn-primary{background:var(--teal);color:#fff}
.btn-row{margin-top:1.75rem}

/* Seitenbilder */
.hero-discover-jesus{background-position:center center;background-image:url('../images/dsc00997.jpg');background-image:-webkit-image-set(url('../images/dsc00997.webp') type('image/webp'), url('../images/dsc00997.jpg') type('image/jpeg'));background-image:image-set(url('../images/dsc00997.webp') type('image/webp'), url('../images/dsc00997.jpg') type('image/jpeg'))}
.img-dj-bible{background-image:url('../images/dsc01005.jpg');background-image:-webkit-image-set(url('../images/dsc01005.webp') type('image/webp'), url('../images/dsc01005.jpg') type('image/jpeg'));background-image:image-set(url('../images/dsc01005.webp') type('image/webp'), url('../images/dsc01005.jpg') type('image/jpeg'))}

@media(max-width:900px){
  .prose blockquote{font-size:19px}
  .abc-letter{font-size:36px}
  .prayer-text{font-size:20px}
}

/* =========================================================================
   MEDIA / SERMONS – Predigt-Archiv
   ========================================================================= */
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.hero-media{background-position:center 15%;background-image:url('../images/_mg_7764.jpg');background-image:-webkit-image-set(url('../images/_mg_7764.webp') type('image/webp'), url('../images/_mg_7764.jpg') type('image/jpeg'));background-image:image-set(url('../images/_mg_7764.webp') type('image/webp'), url('../images/_mg_7764.jpg') type('image/jpeg'))}

/* responsives 16:9-Video (Featured + Single) */
.video-wrap{position:relative;padding-bottom:56.25%;height:0;border-radius:14px;overflow:hidden;background:#0b1e2a}
.video-wrap iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}

/* Featured Sermon */
.sermon-featured{max-width:900px;margin:0 auto}
.sermon-featured-meta{text-align:center;margin-top:1.5rem}
.sermon-featured-title{font-family:'Cormorant Garamond',serif;font-size:32px;font-weight:600;color:var(--teal);line-height:1.2;margin:.25rem 0}
.sermon-featured-title a{color:inherit;text-decoration:none}
.sermon-featured-title a:hover{color:#245048}

/* Filter-Leiste */
.sermon-filters{display:flex;gap:1rem;margin-bottom:2.5rem;flex-wrap:wrap}
.sermon-filters select{padding:.6rem 1rem;border:1px solid var(--border);border-radius:8px;font-family:'Nunito Sans',sans-serif;font-size:14px;color:var(--dark);background:#fff;cursor:pointer}
.sermon-filters select:focus{outline:2px solid var(--teal-light);outline-offset:1px}

/* Grid + Cards */
.sermon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.sermon-grid > .sermon-card{width:100%;max-width:none;float:none;margin:0}
.sermon-card{display:block;background:#fff;border-radius:14px;overflow:hidden;border:1px solid var(--border);text-decoration:none;transition:transform .2s ease, box-shadow .2s ease}
.sermon-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px rgba(0,0,0,.1)}
.sermon-card-thumb{position:relative;padding-bottom:56.25%;background-color:#dfe6e4;background-size:cover;background-position:center}
.sermon-card-thumb .play-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);filter:drop-shadow(0 2px 6px rgba(0,0,0,.35));transition:transform .2s ease}
.sermon-card:hover .play-icon{transform:translate(-50%,-50%) scale(1.08)}
.sermon-card-body{padding:1.2rem 1.25rem 1.4rem}
.sermon-card-title{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:600;color:var(--teal);line-height:1.25;margin:0 0 .35rem}
.sermon-card-meta{font-family:'Nunito Sans',sans-serif;font-size:13px;color:var(--text-muted);margin:0}

/* Pagination */
.sermon-pagination{display:flex;justify-content:center;gap:.4rem;margin-top:2.5rem;flex-wrap:wrap}
.sermon-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 .5rem;border:1px solid var(--border);border-radius:8px;font-family:'Nunito Sans',sans-serif;font-size:14px;font-weight:600;color:var(--nav-text);text-decoration:none;background:#fff;transition:all .2s}
.sermon-pagination a.page-numbers:hover{border-color:var(--teal);color:var(--teal)}
.sermon-pagination .page-numbers.current{background:var(--teal);color:#fff;border-color:var(--teal)}

/* YouTube-CTA-Buttons nebeneinander */
.cta-btns{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

/* Einzel-Sermon */
.sermon-back{display:inline-block;font-family:'Nunito Sans',sans-serif;font-size:14px;font-weight:600;color:var(--teal-light);text-decoration:none;margin-bottom:1.5rem;transition:color .2s}
.sermon-back:hover{color:var(--teal)}
.sermon-single-title{font-family:'Cormorant Garamond',serif;font-size:clamp(30px,4vw,42px);font-weight:600;color:var(--teal);line-height:1.15;margin:1.5rem 0 .5rem}
.sermon-single-meta{font-family:'Nunito Sans',sans-serif;font-size:14px;color:var(--text-muted);margin:0 0 1.5rem}
.sermon-single-meta a{color:var(--teal-light);text-decoration:none}
.sermon-single-meta a:hover{color:var(--teal)}
.sermon-nav{display:flex;justify-content:space-between;gap:1rem;margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--border)}
.sermon-nav a{font-family:'Nunito Sans',sans-serif;font-size:14px;font-weight:600;color:var(--teal);text-decoration:none;max-width:45%;transition:color .2s}
.sermon-nav a:hover{color:#245048}
.sermon-nav-next{text-align:right;margin-left:auto}

@media(max-width:900px){
  .sermon-grid{grid-template-columns:repeat(2,1fr);gap:1.5rem}
  .sermon-featured-title{font-size:26px}
}
@media(max-width:600px){
  .sermon-grid{grid-template-columns:1fr}
}

/* =========================================================================
   EVENTS – ChurchSuite-Kalender + Sunday-Service-Info
   ========================================================================= */
.hero-events{background-position:center 50%;background-image:url('../images/hero-events.jpg');background-image:-webkit-image-set(url('../images/hero-events.webp') type('image/webp'), url('../images/hero-events.jpg') type('image/jpeg'));background-image:image-set(url('../images/hero-events.webp') type('image/webp'), url('../images/hero-events.jpg') type('image/jpeg'))}

/* Sunday-Service-Info-Card */
.service-info-card{max-width:800px;margin:1.5rem auto 0;background:#fff;border:1px solid var(--border);border-radius:16px;padding:2.5rem 2rem;box-shadow:0 8px 24px rgba(0,0,0,.06)}
.service-info-row{display:flex;gap:2rem;justify-content:space-between}
.service-info-item{flex:1;display:flex;flex-direction:column;gap:.4rem;text-align:center}
.service-info-label{font-family:'Nunito Sans',sans-serif;font-size:12px;text-transform:uppercase;letter-spacing:2px;font-weight:600;color:var(--teal-light)}
.service-info-value{font-family:'Nunito Sans',sans-serif;font-size:17px;line-height:1.5;color:var(--dark)}
.service-info-value a{color:var(--teal);text-decoration:none}
.service-info-value a:hover{text-decoration:underline}
.service-info-note{text-align:center;margin-top:1.75rem;font-size:15px;color:var(--text-muted)}
.service-info-note a{color:var(--teal);text-decoration:none}
.service-info-note a:hover{text-decoration:underline}

/* ChurchSuite-Embed (EU/UK, keine Tracking-Cookies → kein extra DSGVO-Handling nötig) */
.cs-embed{max-width:100%;margin:2rem 0 0;border-radius:14px;overflow:hidden;border:1px solid var(--border)}
.cs-embed iframe{display:block;width:100%;min-height:800px;border:0}

@media(max-width:900px){
  .service-info-row{flex-direction:column;gap:1.5rem}
  .service-info-card{padding:2rem 1.5rem}
}

/* =========================================================================
   GIVING – Spenden (Split-Sektionen + Bank/PayPal-Cards)
   ========================================================================= */
.hero-giving{background-position:center 35%;background-image:url('../images/giving-hero.jpg');background-image:-webkit-image-set(url('../images/giving-hero.webp') type('image/webp'), url('../images/giving-hero.jpg') type('image/jpeg'));background-image:image-set(url('../images/giving-hero.webp') type('image/webp'), url('../images/giving-hero.jpg') type('image/jpeg'))}
.img-giving-bread{background-image:url('../images/giving-bread.jpg');background-image:-webkit-image-set(url('../images/giving-bread.webp') type('image/webp'), url('../images/giving-bread.jpg') type('image/jpeg'));background-image:image-set(url('../images/giving-bread.webp') type('image/webp'), url('../images/giving-bread.jpg') type('image/jpeg'))}
.img-giving-seed{background-position:center;background-image:url('../images/giving-seed.jpg?v=2');background-image:-webkit-image-set(url('../images/giving-seed.webp?v=2') type('image/webp'), url('../images/giving-seed.jpg?v=2') type('image/jpeg'));background-image:image-set(url('../images/giving-seed.webp?v=2') type('image/webp'), url('../images/giving-seed.jpg?v=2') type('image/jpeg'))}

/* mehrere Split-Rows innerhalb einer Sektion */
.split-row + .split-row{margin-top:2.5rem}

/* Bank/PayPal-Cards */
.giving-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;max-width:800px;margin:2.5rem auto 0}
.giving-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:14px;padding:2.5rem 2rem;text-align:center;border-left:4px solid var(--teal);transition:transform .2s}
.giving-card:hover{transform:translateY(-4px)}
.giving-card-icon{font-size:2.5rem;line-height:1;margin-bottom:1rem}
.giving-card-title{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:600;color:var(--teal);margin:0 0 .25rem}
.giving-card-subtitle{font-family:'Nunito Sans',sans-serif;font-size:15px;color:var(--text-muted);margin:0 0 1.5rem}
.giving-card-details{text-align:left;margin-top:auto}
.giving-detail-row{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;padding:.6rem 0;border-bottom:1px solid #f0ede8}
.giving-detail-row:last-child{border-bottom:0}
.giving-detail-label{font-family:'Nunito Sans',sans-serif;font-size:13px;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);white-space:nowrap}
.giving-detail-value{font-family:'Nunito Sans',sans-serif;font-size:15px;font-weight:600;color:var(--dark);text-align:right}
.giving-card .btn{margin-top:auto}
.hc-home .giving-legal{text-align:center;margin-top:3rem;font-size:13px;line-height:1.6;color:var(--text-muted)}

@media(max-width:600px){
  .giving-grid{grid-template-columns:1fr}
}

/* =========================================================================
   CONTACT – CF7-Formular, Info-Card, Google Maps, Anfahrt
   ========================================================================= */
.hero-contact{background-position:center 35%;background-image:url('../images/_mg_7889.jpg');background-image:-webkit-image-set(url('../images/_mg_7889.webp') type('image/webp'), url('../images/_mg_7889.jpg') type('image/jpeg'));background-image:image-set(url('../images/_mg_7889.webp') type('image/webp'), url('../images/_mg_7889.jpg') type('image/jpeg'))}

/* 2-Spalten-Layout (Formular + Info) */
.contact-layout{display:flex;gap:3rem;align-items:flex-start;margin-top:1.5rem}
.contact-form-col{flex:3;min-width:0}
.contact-info-col{flex:2;min-width:0}

/* Kontaktdaten-Card */
.contact-info-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:2.5rem 2rem;position:sticky;top:100px}
.contact-info-card h3{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:600;color:var(--teal);margin:0 0 .75rem}
.contact-info-card p{font-size:15px;line-height:1.7;color:var(--text-secondary);margin:0 0 1rem}
.contact-info-email a{color:var(--teal);text-decoration:none;font-weight:600}
.contact-info-email a:hover{text-decoration:underline}
.contact-social{margin-top:1.5rem;display:flex;gap:.75rem}
.contact-social a{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--teal);color:#fff;font-family:'Nunito Sans',sans-serif;font-size:12px;font-weight:700;letter-spacing:.5px;text-decoration:none;transition:background .2s}
.contact-social a:hover{background:#245048}

/* CF7-Formular ans Design angepasst */
.wpcf7 input[type="text"],.wpcf7 input[type="email"],.wpcf7 input[type="tel"],.wpcf7 select,.wpcf7 textarea{width:100%;padding:.75rem 1rem;border:1px solid var(--border);border-radius:8px;font-family:'Nunito Sans',sans-serif;font-size:15px;color:var(--dark);background:#fff;transition:border-color .2s ease}
.wpcf7 input:focus,.wpcf7 select:focus,.wpcf7 textarea:focus{outline:none;border-color:var(--teal)}
.wpcf7 input:focus-visible,.wpcf7 select:focus-visible,.wpcf7 textarea:focus-visible{outline:2px solid #2C5F5A;outline-offset:2px}
.wpcf7 textarea{min-height:120px;resize:vertical}
.wpcf7 label{display:block;margin-bottom:1.2rem;font-family:'Nunito Sans',sans-serif;font-size:14px;font-weight:600;color:var(--dark)}
.wpcf7 .wpcf7-list-item{display:block;margin:.4rem 0}
.wpcf7 .wpcf7-list-item label{margin-bottom:0;font-weight:400}
.cf-row{display:flex;gap:1.5rem}
.cf-col{flex:1;min-width:0}
.cf-consent{font-size:13px!important;font-weight:400!important;color:var(--text-muted)!important}
.cf-consent a{color:var(--teal)}
.wpcf7 input[type="submit"]{display:inline-flex;align-items:center;justify-content:center;min-width:180px;background:var(--teal);color:#fff;padding:15px 32px;border-radius:6px;font-size:15px;font-weight:600;border:2px solid transparent;cursor:pointer;letter-spacing:.5px;transition:all .2s;font-family:'Nunito Sans',sans-serif}
.wpcf7 input[type="submit"]:hover{background:transparent;color:var(--teal);border-color:var(--teal)}
.wpcf7-response-output{border-radius:8px;font-size:14px;margin:1rem 0 0!important}

/* Google-Maps-Embed */
.map-embed{border-radius:14px;overflow:hidden;margin:1.5rem 0 3rem;border:1px solid var(--border)}
.map-embed iframe{display:block;width:100%;height:400px;border:0}

/* Anfahrt-Cards */
.directions-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}
.directions-card{background:var(--cream);border:1px solid var(--border);padding:2rem;border-radius:14px}
.directions-card h3{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--teal);margin:0 0 .6rem}
.directions-card h4{font-family:'Nunito Sans',sans-serif;font-size:15px;font-weight:700;color:var(--dark);margin:1rem 0 .3rem}
.directions-card p{font-size:15px;line-height:1.65;color:var(--text-secondary);margin:0 0 .75rem}
.directions-card p:last-child{margin-bottom:0}

@media(max-width:900px){
  .contact-layout{flex-direction:column;gap:2rem}
  .contact-info-card{position:static}
}
@media(max-width:768px){
  .directions-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .cf-row{flex-direction:column;gap:0}
}

/* ===== FSE: kein weißer Abstand zwischen Template-Teilen (header/main/footer) =====
   WordPress erzeugt via appearanceTools einen 24px block-gap (margin-block-start)
   zwischen den direkten Kindern von .wp-site-blocks. Zwischen <main> und dem
   <footer class="wp-block-template-part"> entsteht dadurch ein weißer Streifen
   (Seiten-Hintergrund). Unser Layout regelt alle Abstände über section-padding →
   block-gap komplett deaktivieren. Specificity (0,1,0) schlägt die :where()-Regel
   des Cores (0,0,0), daher ohne !important. */
.wp-site-blocks > *{margin-block-start:0;margin-block-end:0}

/* ===== Aktiver Nav-Link (aktuelle Seite) in Teal =====
   Statische Links im header.html (kein WP-Menü mit .current-menu-item) → per JS
   markiert (navigation.js). !important, damit der Active-State unabhängig vom
   transparent/solid-Header-Zustand immer sichtbar bleibt. */
.nav-links a.nav-active,
.mobile-menu-links a.nav-active{color:var(--teal)!important}
.nav-links a.nav-active{border-bottom:2px solid var(--teal);padding-bottom:2px}

/* ===== VISION & MISSION — große, vertikal gestapelte Kacheln (About-Seite) ===== */
.vm-card{border-radius:14px;padding:clamp(2.5rem,5vw,4rem);margin-bottom:2rem}
.vm-card:last-child{margin-bottom:0}

.vm-vision{background:var(--cream)}
.vm-mission{background:var(--teal);color:#fff}
.vm-mission .vm-label{color:rgba(255,255,255,.7)}
.vm-mission .vm-statement{color:#fff}
.vm-mission .vm-explain p{color:rgba(255,255,255,.85)}
.vm-mission strong{color:#fff}

.vm-label{font-family:'Nunito Sans',sans-serif;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);margin-bottom:1rem}

.vm-statement{font-family:'Cormorant Garamond',serif;font-size:clamp(24px,3vw,32px);font-weight:500;font-style:italic;line-height:1.4;color:var(--dark);margin:0 0 1.5rem 0;padding:0;border:none}

.vm-explain p{font-size:16px;line-height:1.7;color:var(--text-secondary)}
.vm-explain p+p{margin-top:1rem}

.vm-pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:2rem}
.vm-pillar h4{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:600;color:var(--teal);margin-bottom:.5rem}
.vm-pillar p{font-size:15px;line-height:1.7;color:var(--text-secondary)}
@media(max-width:900px){
  .vm-pillars{grid-template-columns:1fr;gap:1.5rem}
}

/* ===== Community Groups (Church Life) — 3er-Kachel-Grid ===== */
.community-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.community-card{background:#fff;border-radius:14px;padding:2rem;border:1px solid var(--border);border-left:4px solid var(--teal);transition:transform .2s}
.community-card:hover{transform:translateY(-4px)}
.community-name{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--teal);margin-bottom:.25rem}
.community-who{font-family:'Nunito Sans',sans-serif;font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted);margin-bottom:1rem}
.community-card p:last-child{font-size:15px;line-height:1.7;color:var(--text-secondary);margin-bottom:0}
@media(max-width:768px){
  .community-grid{grid-template-columns:1fr}
}

/* Legal Pages — kompakter Hero ohne Bild */
.page-hero-legal{position:relative;min-height:28vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:7rem 2rem 3rem;background:var(--teal);color:#fff}
.page-hero-legal .page-hero-title{font-family:'Cormorant Garamond',serif;font-size:clamp(36px,5vw,52px);font-weight:600;color:#fff;line-height:1.1;margin:0}
.page-hero-legal .page-hero-sub{font-size:16px;line-height:1.7;max-width:560px;margin:1rem auto 0;color:rgba(255,255,255,.8)}

/* Legal prose Zusatz-Styles */
.legal-section h3{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:600;color:var(--teal);margin:2rem 0 .75rem}
.legal-section h3:first-child{margin-top:0}
.legal-section h4{font-family:'Nunito Sans',sans-serif;font-size:16px;font-weight:700;color:var(--dark);margin:1.5rem 0 .5rem}
.legal-section ul{margin:0 0 1.25rem;padding-left:1.5rem}
.legal-section li{font-size:16px;line-height:1.7;color:var(--text-secondary);margin-bottom:.4rem}
.legal-contact{background:#fff;border:1px solid var(--border);border-radius:14px;padding:2rem;border-left:4px solid var(--teal);margin-bottom:1.5rem}
.legal-contact p{margin:0 0 .3rem}
.legal-contact strong{color:var(--dark)}

@media(max-width:900px){
  .page-hero-legal{min-height:22vh;padding:5.5rem 1.5rem 2.5rem}
}

/* Leadership card — Sand-Kachel im Stil der Vision-Kachel */
.leadership-card{background:var(--sand);border-radius:14px;padding:2.5rem 2.5rem 2rem;border-left:4px solid var(--teal)}
.leadership-card .s-sub{margin-top:0}

@media(max-width:900px){
  .leadership-card{padding:2rem 1.5rem 1.5rem}
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}