/* ============ Self-hosted fonts (DSGVO-konform, keine externen Requests) ============ */
@font-face{
  font-family:'Fraunces';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('fonts/fraunces-500-normal.woff2') format('woff2');
}
@font-face{
  font-family:'Fraunces';
  font-style:italic;
  font-weight:600;
  font-display:swap;
  src:url('fonts/fraunces-600-italic.woff2') format('woff2');
}
@font-face{
  font-family:'Nunito Sans';
  font-style:normal;
  font-weight:300 900;
  font-display:swap;
  src:url('fonts/nunitosans-variable.woff2') format('woff2-variations'),
      url('fonts/nunitosans-variable.woff2') format('woff2');
}

/* ============ Base ============ */
html{ scroll-behavior:smooth; }
body{
  background:#FFF9F4;
  font-family:'Nunito Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
.font-display{ font-family:'Fraunces', Georgia, 'Iowan Old Style', serif; }
h1,h2,h3{ text-wrap:balance; }

:focus-visible{
  outline:2px solid #9C1A4B;
  outline-offset:3px;
  border-radius:2px;
}

/* ============ Reduced motion ============ */
/* Globaler Kill-Switch: alle Animationen/Transitions praktisch deaktivieren ... */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
    scroll-behavior:auto !important;
  }
}
/* ... AUSSER dem Scroll-Reveal: der soll bewusst auch bei "weniger Bewegung" laufen. */
.reveal{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .7s cubic-bezier(.2,.7,.3,1), transform .7s cubic-bezier(.2,.7,.3,1) !important;
}
.reveal.is-visible{ opacity:1; transform:translateY(0); }
.reveal-delay-1{ transition-delay:.08s !important; }
.reveal-delay-2{ transition-delay:.16s !important; }
.reveal-delay-3{ transition-delay:.24s !important; }
.reveal-delay-4{ transition-delay:.32s !important; }

/* ============ Header ============ */
#site-header{
  background-color:rgba(255,249,244,.75);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid transparent;
  transition:background-color .3s ease, border-color .3s ease, box-shadow .3s ease;
}
#site-header.is-scrolled{
  background-color:rgba(255,249,244,.92);
  border-bottom-color:#B8C0BE;
  box-shadow:0 12px 24px -20px rgba(46,40,35,.25);
}

/* ============ Grid + noise overlay (Hero-Textur) ============ */
.bg-grid{
  background-image:
    linear-gradient(to right, rgba(46,40,35,0.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(46,40,35,0.05) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 80% 60% at 50% 20%, #000 40%, transparent 100%);
}
.bg-noise{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  background-size:120px 120px;
}

/* ============ Glow orbs ============ */
.glow-orb{
  position:absolute;
  border-radius:9999px;
  filter:blur(64px);
  opacity:.55;
  pointer-events:none;
  animation:orbFloat 20s ease-in-out infinite;
}
.glow-orb.orb-a{
  width:26rem; height:26rem;
  background:radial-gradient(circle, #DD2369, transparent 70%);
  top:-8rem; left:-6rem;
}
.glow-orb.orb-b{
  width:22rem; height:22rem;
  background:radial-gradient(circle, #9CB2A5, transparent 70%);
  top:6rem; right:-8rem;
  animation-duration:26s;
  animation-delay:-6s;
}
.glow-orb.orb-c{
  width:18rem; height:18rem;
  background:radial-gradient(circle, #DD2369, transparent 70%);
  bottom:-6rem; left:30%;
  animation-duration:24s;
  animation-delay:-3s;
  opacity:.35;
}
@keyframes orbFloat{
  0%,100%{ transform:translate(0,0) scale(1); }
  33%{ transform:translate(2rem,-1.5rem) scale(1.08); }
  66%{ transform:translate(-1.5rem,1.5rem) scale(0.95); }
}

/* ============ Shimmer (CTA / Badge) ============ */
.shimmer{ position:relative; overflow:hidden; }
.shimmer::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(110deg, transparent 30%, rgba(255,255,255,.35) 45%, transparent 60%);
  transform:translateX(-120%);
  animation:shimmerSweep 3.2s ease-in-out infinite;
}
@keyframes shimmerSweep{
  0%,60%{ transform:translateX(-120%); }
  100%{ transform:translateX(120%); }
}

/* ============ CTA glow pulse ============ */
.cta-glow{
  box-shadow:0 0 0 0 rgba(221,35,105,.45), 0 14px 30px -10px rgba(46,40,35,.35);
  animation:ctaPulse 2.8s ease-in-out infinite;
}
@keyframes ctaPulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(221,35,105,.35), 0 14px 30px -10px rgba(46,40,35,.35); }
  50%{ box-shadow:0 0 0 10px rgba(221,35,105,0), 0 14px 30px -10px rgba(46,40,35,.35); }
}

/* ============ Card hover-lift ============ */
.card-hover{ transition:transform .35s ease, box-shadow .35s ease; }
.card-hover:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 48px -20px rgba(46,40,35,.25);
}

/* ============ Section divider ============ */
.divider-fade{
  height:1px;
  background:linear-gradient(to right, transparent, #B8C0BE, transparent);
}

/* ============ FAQ accordion ============ */
.faq-item summary{ cursor:pointer; list-style:none; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item .faq-icon{ transition:transform .3s ease; }
.faq-item[open] .faq-icon{ transform:rotate(45deg); }

/* ============ Utility: skip link ============ */
.skip-link{
  position:absolute; left:-999px; top:0;
  background:#DD2369; color:#fff; padding:.75rem 1.25rem; z-index:100;
  border-radius:0 0 8px 0;
}
.skip-link:focus{ left:0; }