/* ═══════════════════════════════════════════════════════
   FULDA THEME  –  Eigenes Design, eigene Animationen
   Geladen zusätzlich zu style.css
═══════════════════════════════════════════════════════ */

/* ── 1. CSS Custom Properties (Burgunderrot statt Gold) ── */
body.fulda {
  --gold:       #8B1A2A;
  --gold2:      #A52133;
  --gold3:      #C9364F;
  --gold-pale:  #FBF2F3;
  --bg:         #F8F5F1;
  --bg2:        #F2EDE5;
  --bg3:        #EBE4DA;
  --line:       #DDD6CC;
  --ink3:       #6B6560;
  background:   #F8F5F1;
}

/* ── 2. Keyframes: neue Animationen ── */
@keyframes fd-wipe-up {
  from { clip-path: inset(100% 0 0 0); opacity: 0; }
  to   { clip-path: inset(0% 0 0 0);   opacity: 1; }
}
@keyframes fd-scale-in {
  from { transform: scale(0.93); opacity: 0; filter: blur(4px); }
  to   { transform: scale(1);    opacity: 1; filter: blur(0); }
}
@keyframes fd-slide-left {
  from { transform: translateX(-60px); opacity: 0; }
  to   { transform: translateX(0);     opacity: 1; }
}
@keyframes fd-slide-right {
  from { transform: translateX(60px);  opacity: 0; }
  to   { transform: translateX(0);     opacity: 1; }
}
@keyframes fd-card-rise {
  from { transform: translateY(40px) scale(0.97); opacity: 0; }
  to   { transform: translateY(0)    scale(1);    opacity: 1; }
}
@keyframes fd-accent-grow {
  from { width: 0; opacity: 0; }
  to   { width: 48px; opacity: 1; }
}
@keyframes fd-pulse-border {
  0%, 100% { box-shadow: 0 0 0 0 rgba(139,26,42,.15); }
  50%       { box-shadow: 0 0 0 8px rgba(139,26,42,0); }
}
@keyframes fd-shimmer {
  0%   { background-position: -200% center; }
  100% { background-position:  200% center; }
}

/* ── 3. Scroll-Reveal: andere Animation als Kassel ── */
body.fulda .rv {
  opacity: 0;
  transform: translateY(32px) scale(0.98);
  filter: blur(2px);
  transition: opacity .9s cubic-bezier(.16,1,.3,1),
              transform .9s cubic-bezier(.16,1,.3,1),
              filter .9s cubic-bezier(.16,1,.3,1);
}
body.fulda .rvl {
  opacity: 0;
  transform: translateX(-48px);
  transition: opacity .85s cubic-bezier(.16,1,.3,1),
              transform .85s cubic-bezier(.16,1,.3,1);
}
body.fulda .rvr {
  opacity: 0;
  transform: translateX(48px);
  transition: opacity .85s cubic-bezier(.16,1,.3,1),
              transform .85s cubic-bezier(.16,1,.3,1);
}
body.fulda .rv.vis,
body.fulda .rvl.vis,
body.fulda .rvr.vis {
  opacity: 1;
  transform: translate(0) scale(1);
  filter: blur(0);
}

/* ── 4. Navigationsleiste ── */
body.fulda nav.sc {
  background: rgba(248,245,241,.97);
  box-shadow: 0 1px 0 var(--line), 0 2px 20px rgba(139,26,42,.06);
}
body.fulda nav.sc .n-cta {
  border-color: var(--gold2);
  color: var(--gold2);
}
body.fulda nav.sc .n-cta::before { background: var(--gold2); }
body.fulda nav.sc .n-cta:hover   { color: #fff; }
body.fulda nav.sc .n-links a:hover { color: var(--gold); }
body.fulda .n-links a::after       { background: var(--gold3); }

/* ── 5. Hero: wärmere Overlays ── */
body.fulda .hero-poster {
  background-color: #1A0D0E;
  background-image: url("../images/hero-poster.webp");
  background-size: cover;
  background-position: center;
}
body.fulda .hero-veil--top {
  background: linear-gradient(to bottom, rgba(20,8,10,.62) 0%, transparent 55%);
}
body.fulda .hero-veil--center {
  background: radial-gradient(ellipse at center, transparent 30%, rgba(20,8,10,.28) 100%);
}
body.fulda .hero-veil--bottom {
  background: linear-gradient(to top, rgba(16,4,6,.88) 0%, rgba(20,8,10,.5) 45%, transparent 80%);
}

/* Hero-Stats: rote Akzentlinie oben */
body.fulda .hero-stats .hs {
  border-top: 2px solid rgba(201,54,79,.6);
}
body.fulda .hs-val sup {
  color: var(--gold3);
}

/* ── 6. Intro-Section: cremefarbener Hintergrund ── */
body.fulda .intro {
  background: var(--bg);
}
body.fulda .intro-facts {
  border-top: 1px solid var(--line);
}
body.fulda .intro-fact strong {
  color: var(--gold);
}
body.fulda .div {
  background: var(--gold2);
  height: 2px;
  border-radius: 2px;
}
body.fulda .div.vis,
body.fulda .div {
  animation: fd-accent-grow .8s cubic-bezier(.16,1,.3,1) forwards;
  width: 0;
}
body.fulda .div.vis { width: 48px; }

/* ── 7. Galerie ── */
body.fulda .gallery {
  background: #fff;
}
body.fulda .gi {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0,0,0,.08);
  transition: transform .5s cubic-bezier(.16,1,.3,1),
              box-shadow .5s cubic-bezier(.16,1,.3,1);
}
body.fulda .gi:hover {
  transform: translateY(-6px) scale(1.01);
  box-shadow: 0 12px 48px rgba(139,26,42,.15);
}
body.fulda .gal-grundriss {
  background: var(--bg);
  border-radius: 12px;
  padding: 32px;
}
body.fulda .gal-grundriss-list li {
  border-color: var(--line);
}
body.fulda .gal-grundriss-list li span:first-child {
  color: var(--ink);
}
body.fulda .gal-grundriss-list li span:last-child {
  color: var(--gold2);
}
body.fulda .gal-grundriss-arrow {
  border-color: var(--gold2);
  color: var(--gold2);
}
body.fulda .gal-grundriss-arrow:hover {
  background: var(--gold2);
  color: #fff;
}

/* ── 8. Transparenz-Section: Hell statt Dunkel ── */
body.fulda .transp-section {
  background: var(--bg2);
}
body.fulda .transp-card {
  background: #fff;
  border: 1px solid var(--line);
  border-left: 3px solid var(--gold2);
  border-radius: 8px;
  box-shadow: 0 2px 16px rgba(0,0,0,.05);
  color: var(--ink);
  transition: transform .5s cubic-bezier(.16,1,.3,1),
              box-shadow .5s cubic-bezier(.16,1,.3,1);
}
body.fulda .transp-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 32px rgba(139,26,42,.12);
  border-left-color: var(--gold);
}
/* Karten-Animation: unterschiedliche Richtungen */
body.fulda .transp-card:nth-child(odd) {
  transform-origin: left center;
}
body.fulda .transp-card:nth-child(even) {
  transform-origin: right center;
}
body.fulda .transp-card { opacity: 0; transform: translateY(30px) scale(0.97); }
body.fulda .transp-card.vis {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition: opacity .7s cubic-bezier(.16,1,.3,1),
              transform .7s cubic-bezier(.16,1,.3,1),
              box-shadow .5s ease;
}
body.fulda .transp-card:nth-child(2).vis { transition-delay: .1s; }
body.fulda .transp-card:nth-child(3).vis { transition-delay: .2s; }
body.fulda .transp-card:nth-child(4).vis { transition-delay: .3s; }

body.fulda .transp-n {
  color: var(--gold2);
  border-color: var(--gold-pale);
  background: var(--gold-pale);
  font-size: 1.6rem;
}
body.fulda .transp-h  { color: var(--ink); }
body.fulda .transp-p  { color: var(--ink3); }
body.fulda .transp-head .sh { color: var(--ink); }

/* ── 9. Cashflow-Rechner: hell links, Burgunder rechts ── */
body.fulda .rechner {
  background: #fff;
  border-top: 4px solid var(--gold2);
}
body.fulda .rechner::before,
body.fulda .rechner::after {
  background: radial-gradient(circle, rgba(139, 26, 42, .06) 0%, transparent 65%);
}
body.fulda .rechner > .rv .tag {
  color: var(--gold2);
}
body.fulda .rechner > .rv .tag::before {
  background: var(--gold2);
}
body.fulda .rechner > .rv .sh {
  color: var(--ink);
}
body.fulda .rechner > .rv .sh em {
  color: var(--gold);
}
body.fulda .rechner > .rv .sp {
  color: var(--ink3);
}
body.fulda .calc-inputs {
  background: var(--bg);
  border: 1px solid var(--line);
  border-right: none;
}
body.fulda .ci-label {
  color: var(--ink3);
}
body.fulda .ci-label strong {
  color: var(--ink);
}
body.fulda .ci-minmax {
  color: var(--ink3);
}
body.fulda .ci-fixed {
  background: #fff;
  border-color: var(--line);
  color: var(--ink3);
}
body.fulda .ci-slider {
  accent-color: var(--gold2);
  background-color: var(--line);
  background-image: linear-gradient(var(--gold2), var(--gold2));
}
body.fulda .ci-slider::-webkit-slider-thumb {
  background: var(--gold2);
  border-color: #fff;
  box-shadow: 0 2px 12px rgba(139, 26, 42, .25);
}
body.fulda .ci-slider::-moz-range-thumb {
  background: var(--gold2);
  border-color: #fff;
}
body.fulda .toggle-btn {
  background: #fff;
  border-color: var(--line);
  color: var(--ink3);
}
body.fulda .toggle-btn.active {
  background: var(--gold2);
  border-color: var(--gold2);
  color: #fff;
}
body.fulda .calc-results {
  background: var(--gold);
  border-radius: 0 12px 12px 0;
}
body.fulda .cr-val { color: #fff; }
body.fulda .cr-label, body.fulda .cr-sub { color: rgba(255,255,255,.75); }
body.fulda .cr-row { border-color: rgba(255,255,255,.15); }
body.fulda .cr-row-l { color: rgba(255,255,255,.75); }
body.fulda .cr-row-v { color: #fff; }
body.fulda .cr-row-v.pos { color: #90E8A0; }
body.fulda .cr-row-v.neg { color: rgba(255,255,255,.6); }
body.fulda .cr-note { color: rgba(255,255,255,.45); border-color: rgba(255,255,255,.12); }

@media (max-width: 1100px) {
  body.fulda .calc-inputs {
    border-right: 1px solid var(--line);
    border-radius: 12px 12px 0 0;
  }
  body.fulda .calc-results {
    border-radius: 0 0 12px 12px;
  }
}

/* ── 10. Investment-Section: cremig, hell ── */
body.fulda .investment {
  background: var(--bg);
}
body.fulda .inv-panel {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 4px 32px rgba(0,0,0,.07);
  border: 1px solid var(--line);
}
body.fulda .inv-row {
  border-color: var(--line);
}
body.fulda .inv-row:hover {
  background: var(--gold-pale);
}
body.fulda .iv.g { color: var(--gold); }
body.fulda .inv-hl {
  background: linear-gradient(135deg, var(--gold) 0%, var(--gold2) 100%);
  border-radius: 0 0 10px 10px;
}
body.fulda .inv-hl-v { color: #fff; }
body.fulda .inv-hl-l { color: rgba(255,255,255,.75); }

/* Adv-Liste */
body.fulda .adv-item {
  border-color: var(--line);
  transition: background .3s ease, border-color .3s ease;
}
body.fulda .adv-item:hover {
  background: var(--gold-pale);
  border-color: var(--gold3);
}
body.fulda .adv-i {
  color: var(--gold2);
  background: var(--gold-pale);
  border-color: var(--gold-pale);
}
body.fulda .adv-t { color: var(--ink); }
body.fulda .adv-s { color: var(--ink3); }
/* Adv Items: alternierend von links/rechts einblenden */
body.fulda .adv-item { opacity: 0; transform: translateX(-24px); }
body.fulda .adv-item:nth-child(even) { transform: translateX(24px); }
body.fulda .adv-item.vis {
  opacity: 1;
  transform: translateX(0);
  transition: opacity .6s cubic-bezier(.16,1,.3,1),
              transform .6s cubic-bezier(.16,1,.3,1),
              background .3s ease;
}

/* ── 11. Lage-Section ── */
body.fulda .lage-section {
  background: #fff;
}
body.fulda .lage-panorama-veil {
  background: linear-gradient(to top,
    rgba(139,26,42,.75) 0%,
    rgba(30,10,14,.4) 60%,
    transparent 100%);
}
body.fulda .lage-panorama-stats .hs {
  border-top: 2px solid rgba(201,54,79,.5);
}
body.fulda .lage-head .sh,
body.fulda .lage-standort-title { color: var(--ink); }
body.fulda .lage-standort-title em { color: var(--gold2); }

/* Standort-Stats */
body.fulda .lage-standort-stat {
  border-color: var(--line);
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 12px rgba(0,0,0,.05);
  animation: fd-pulse-border 3s ease-in-out infinite;
}
body.fulda .lage-growth-val { color: var(--gold); }
body.fulda .lage-standort-kicker { color: var(--gold2); }

/* Lage-Faktoren: Karten-Design */
body.fulda .lage-factor {
  background: #fff;
  border: 1px solid var(--line);
  border-top: 3px solid var(--gold2);
  border-radius: 8px;
  box-shadow: 0 2px 16px rgba(0,0,0,.05);
  transition: transform .45s cubic-bezier(.16,1,.3,1),
              box-shadow .45s cubic-bezier(.16,1,.3,1);
}
body.fulda .lage-factor:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 40px rgba(139,26,42,.12);
  border-top-color: var(--gold);
}
body.fulda .lage-factor { opacity: 0; transform: translateY(36px); }
body.fulda .lage-factor.vis {
  opacity: 1;
  transform: translateY(0);
  transition: opacity .65s cubic-bezier(.16,1,.3,1),
              transform .65s cubic-bezier(.16,1,.3,1),
              box-shadow .45s ease;
}
body.fulda .lage-factor:nth-child(2).vis { transition-delay: .1s; }
body.fulda .lage-factor:nth-child(3).vis { transition-delay: .2s; }
body.fulda .lage-factor:nth-child(4).vis { transition-delay: .3s; }

body.fulda .lage-factor-kicker { color: var(--gold2); }
body.fulda .lage-factor-h { color: var(--ink); }
body.fulda .lage-factor-p { color: var(--ink3); }
body.fulda .lage-factor-list li { color: var(--ink); }
body.fulda .lage-factor-list li::before { color: var(--gold2); }
body.fulda .lage-factor-item-t { color: var(--gold); border-color: var(--line); }
body.fulda .lage-factor-item-p { color: var(--ink3); }

/* Lage-Proximity-Punkte */
body.fulda .lage-pt {
  border-color: var(--line);
  transition: background .3s ease;
}
body.fulda .lage-pt:hover { background: var(--gold-pale); }
body.fulda .lage-pt-ico {
  background: var(--gold2);
  color: #fff;
  border-radius: 6px;
}
body.fulda .lage-pt-title { color: var(--ink); }
body.fulda .lage-pt-sub { color: var(--ink3); }

/* Map Overlay */
body.fulda .lage-map-card {
  background: rgba(248,245,241,.97);
  border: 1px solid var(--line);
  border-left: 3px solid var(--gold2);
}
body.fulda .lage-map-kicker { color: var(--gold2); }
body.fulda .lage-map-link { color: var(--gold2); }
body.fulda .lage-map-link:hover { color: var(--gold); }

/* Lage-Copy */
body.fulda .lage-body-tag { color: var(--gold2); }

/* Lage-Standort-Section Hintergrund */
body.fulda .lage-standort { background: var(--bg2); border-radius: 12px; }
body.fulda .lage-standort-panel { background: #fff; border-radius: 10px; }
body.fulda .lage-standort-sub { color: var(--ink); }
body.fulda .lage-standort-sub-lead { color: var(--ink3); }
body.fulda .lage-standort-note { color: var(--ink3); border-color: var(--line); }

/* ── 12. FAQ ── */
body.fulda .faq {
  background: var(--bg2);
}
body.fulda .fi {
  border-color: var(--line);
}
body.fulda .fq {
  color: var(--ink);
}
body.fulda .fq:hover { color: var(--gold); }
body.fulda .fi-ico { color: var(--gold2); }
body.fulda .fa { background: var(--gold-pale); }
body.fulda .fa-in p { color: var(--ink3); }

/* FAQ Einblend-Animation */
body.fulda .fi { opacity: 0; transform: translateX(-20px); }
body.fulda .fi.vis {
  opacity: 1;
  transform: translateX(0);
  transition: opacity .6s cubic-bezier(.16,1,.3,1),
              transform .6s cubic-bezier(.16,1,.3,1);
}

/* ── 13. Kontakt-Section ── */
body.fulda .contact {
  background: linear-gradient(135deg, #1A0708 0%, #2D0D12 50%, #1A0708 100%);
}
body.fulda .contact .sh em { color: var(--gold3); }
body.fulda .contact .sh { color: #fff; }
body.fulda .contact .sp { color: rgba(255,255,255,.65); }
body.fulda .contact .div { background: var(--gold2); }
body.fulda .c-name { color: #fff; }
body.fulda .c-role { color: rgba(255,255,255,.55); }
body.fulda .c-row  { color: rgba(255,255,255,.75); }
body.fulda .c-ico  { color: var(--gold3); }
body.fulda .c-row a { color: var(--gold3); }
body.fulda .c-row a:hover { color: #fff; }
body.fulda .c-fw   { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.1); border-radius: 10px; }
body.fulda .c-ft   { color: #fff; }
body.fulda .form input,
body.fulda .form textarea,
body.fulda .form select {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.15);
  color: #fff;
}
body.fulda .form input::placeholder,
body.fulda .form textarea::placeholder { color: rgba(255,255,255,.3); }
body.fulda .form label { color: rgba(255,255,255,.6); }
body.fulda .f-sub {
  background: var(--gold2);
  border-color: var(--gold2);
  color: #fff;
  border-radius: 6px;
  transition: background .3s ease, transform .2s ease;
}
body.fulda .f-sub:hover { background: var(--gold); transform: translateY(-2px); }
body.fulda .f-note { color: rgba(255,255,255,.35); }
body.fulda .tag { color: var(--gold2); }
body.fulda .tag::before { background: var(--gold2); }
body.fulda .contact .tag { color: rgba(255,255,255,.5); }
body.fulda .contact .tag::before { background: rgba(255,255,255,.3); }

/* ── 14. Buttons ── */
body.fulda .btn-d {
  background: var(--gold2);
  border-color: var(--gold2);
  color: #fff;
  border-radius: 6px;
  transition: background .3s ease, transform .25s ease, box-shadow .25s ease;
}
body.fulda .btn-d:hover {
  background: var(--gold);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(139,26,42,.3);
}
body.fulda .btn-g {
  border-color: var(--gold2);
  color: var(--gold2);
  border-radius: 6px;
}
body.fulda .btn-g:hover {
  background: var(--gold2);
  color: #fff;
}

/* ── 15. CTA im Nav ── */
body.fulda .n-cta {
  border-color: rgba(255,255,255,.7);
  border-radius: 4px;
}

/* ── 16. Footer ── */
body.fulda footer {
  background: #100306;
  border-top: 2px solid var(--gold2);
}
body.fulda .f-disc a,
body.fulda .f-copy { color: rgba(255,255,255,.4); }
body.fulda .f-disc a:hover { color: var(--gold3); }

/* ── 17. Fortschrittsbalken ── */
body.fulda .fx-prog-fill { background: var(--gold2); }

/* ── 18. Scroll-Hint (Hero) ── */
body.fulda .hero-scroll-dots span { background: var(--gold3); }

/* ── 19. Section-Trenner-Effekt: rote Linie oben ── */
body.fulda .gallery,
body.fulda .transp-section,
body.fulda .rechner,
body.fulda .investment,
body.fulda .lage-section,
body.fulda .faq {
  position: relative;
}
body.fulda .gallery::before,
body.fulda .transp-section::before,
body.fulda .rechner::before,
body.fulda .lage-section::before,
body.fulda .faq::before {
  content: '';
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold2), transparent);
}

/* ── 20. Specielle Typo-Akzente ── */
body.fulda .sh em { color: var(--gold); font-style: italic; }
body.fulda .hero-title-main em { color: var(--gold3); }
body.fulda .lage-showcase-quote-text em { color: var(--gold3); }

/* ── 21. Intro-Facts: Card-Stil ── */
body.fulda .intro-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 16px;
  padding: 28px 0;
}
body.fulda .intro-fact {
  background: #fff;
  border: 1px solid var(--line);
  border-top: 3px solid var(--gold2);
  border-radius: 8px;
  padding: 20px 16px;
  box-shadow: 0 2px 12px rgba(0,0,0,.05);
  transition: transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s ease;
}
body.fulda .intro-fact:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 28px rgba(139,26,42,.1);
}
body.fulda .intro-fact strong {
  display: block;
  font-size: 1.75rem;
  margin-bottom: 4px;
}
body.fulda .intro-fact span { color: var(--ink3); font-size: .8rem; }

/* ── 22. Galerie-Header ── */
body.fulda .gal-hdr .sh,
body.fulda .gal-grundriss-head .sh { color: var(--ink); }

/* ── 23. Lage-Map-Frame: Schatten ── */
body.fulda .lage-map-frame {
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 8px 40px rgba(0,0,0,.1);
}

/* ── 24. Reduced Motion ── */
@media (prefers-reduced-motion: reduce) {
  body.fulda .rv,
  body.fulda .rvl,
  body.fulda .rvr,
  body.fulda .transp-card,
  body.fulda .lage-factor,
  body.fulda .adv-item,
  body.fulda .fi {
    transition: none !important;
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }
}