/* ═══════════════════════════════════════════════════════════════════════════
   Johannes Wurfbaum Coaching — Global Stylesheet
   Dark Luxury Coaching Design System
   ═══════════════════════════════════════════════════════════════════════════ */
:root {
  --dark:       #111110;
  --dark-2:     #1A1917;
  --card:       #1E1D1B;
  --card-hover: #242220;
  --gold:       #C8A96A;
  --gold-lt:    #E2C99A;
  --warm:       #F5F0E8;
  --text:       #D8D2C8;
  --muted:      #7A7570;
  --red:        #C0392B;
  --serif:      'Cormorant Garamond', Georgia, serif;
  --sans:       'DM Sans', system-ui, sans-serif;
  --max-w:      1260px;
  --gold-line:  1px solid rgba(200,169,106,0.2);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { font-family: var(--sans); font-weight: 300; background: var(--dark); color: var(--text); line-height: 1.7; overflow-x: hidden; }
h1,h2,h3 { font-family: var(--serif); font-weight: 300; color: var(--warm); line-height: 1.1; }
h1 { font-size: clamp(3rem, 6vw, 5.5rem); }
h2 { font-size: clamp(2rem, 4vw, 3.2rem); }
h3 { font-size: 1.9rem; font-weight: 400; }
p  { font-size: 1rem; line-height: 1.75; }
em { font-style: italic; color: var(--gold-lt); }
a  { color: inherit; text-decoration: none; }

/* ── BUTTONS ─────────────────────────────────────────────────────────────── */
.btn-primary { display:inline-block; font-family:var(--sans); font-size:0.82rem; font-weight:500; text-transform:uppercase; letter-spacing:0.14em; color:var(--dark); background:var(--gold); padding:1rem 2.4rem; border-radius:2px; transition:background 0.2s, transform 0.15s; cursor:pointer; border:none; }
.btn-primary:hover { background:var(--gold-lt); transform:translateY(-1px); }
.btn-ghost { display:inline-block; font-family:var(--sans); font-size:0.82rem; font-weight:500; text-transform:uppercase; letter-spacing:0.14em; color:var(--warm); border:1px solid rgba(245,240,232,0.35); padding:1rem 2.4rem; border-radius:2px; transition:border-color 0.2s, color 0.2s; }
.btn-ghost:hover { border-color:var(--gold); color:var(--gold); }

/* ── SECTION TAGS ────────────────────────────────────────────────────────── */
.section-tag { display:inline-block; font-size:0.7rem; text-transform:uppercase; letter-spacing:0.26em; color:var(--gold); margin-bottom:1.2rem; }

/* ── FADE-IN ─────────────────────────────────────────────────────────────── */
.fade-in { opacity:0; transform:translateY(28px); transition:opacity 0.7s ease, transform 0.7s ease; }
.fade-in.visible { opacity:1; transform:translateY(0); }
.delay-1 { transition-delay:0.15s; }
.delay-2 { transition-delay:0.3s; }
.delay-3 { transition-delay:0.45s; }

/* ── NAVIGATION ──────────────────────────────────────────────────────────── */
#navbar { position:fixed; top:0; left:0; right:0; z-index:1000; display:flex; align-items:center; justify-content:space-between; padding:1.4rem 4rem; transition:background 0.4s, backdrop-filter 0.4s, padding 0.3s; }
#navbar.scrolled { background:rgba(17,17,16,0.88); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); padding:1rem 4rem; border-bottom:var(--gold-line); }
.nav-logo { font-family:var(--serif); font-size:1.35rem; font-weight:400; color:var(--warm); letter-spacing:0.04em; }
.nav-links { display:flex; gap:2.5rem; list-style:none; }
.nav-links a { font-size:0.78rem; text-transform:uppercase; letter-spacing:0.18em; color:var(--text); transition:color 0.2s; }
.nav-links a:hover { color:var(--gold); }
.nav-cta { font-size:0.78rem; text-transform:uppercase; letter-spacing:0.14em; font-weight:500; color:var(--gold); border:1px solid var(--gold); padding:0.55rem 1.4rem; border-radius:2px; transition:background 0.2s, color 0.2s; }
.nav-cta:hover { background:var(--gold); color:var(--dark); }
.nav-hamburger { display:none; background:none; border:none; cursor:pointer; padding:0.5rem; }
.nav-hamburger span { display:block; width:24px; height:2px; background:var(--warm); margin:5px 0; transition:transform 0.3s, opacity 0.3s; }

/* ── HERO ────────────────────────────────────────────────────────────────── */
.hero { position:relative; min-height:100svh; display:flex; align-items:flex-end; overflow:hidden; }
.hero-bg { position:absolute; inset:0; background-image:url('/assets/img/hero_sw.webp'); background-size:cover; background-position:center top; filter:brightness(0.52) contrast(1.06); transform:scale(1.04); animation:heroZoom 12s ease-out forwards; }
@keyframes heroZoom { to { transform:scale(1.0); } }
.hero-gradient { position:absolute; inset:0; background:linear-gradient(to bottom, transparent 30%, rgba(17,17,16,0.5) 65%, rgba(17,17,16,0.95) 90%, var(--dark) 100%); }
.hero-content { position:relative; z-index:2; padding:0 4rem 7rem; max-width:820px; animation:fadeUp 1.2s ease 0.3s both; }
@keyframes fadeUp { from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:translateY(0)} }
.hero-label { display:inline-block; font-size:0.72rem; letter-spacing:0.26em; text-transform:uppercase; color:var(--gold); margin-bottom:1.4rem; opacity:0; animation:fadeUp 0.8s ease 0.6s forwards; }
.hero-title { font-family:var(--serif); font-size:clamp(3rem,6vw,5.8rem); font-weight:300; line-height:1.08; color:var(--warm); margin-bottom:1.6rem; opacity:0; animation:fadeUp 0.8s ease 0.8s forwards; }
.hero-sub { font-size:1.05rem; color:var(--text); max-width:520px; margin-bottom:2.4rem; opacity:0; animation:fadeUp 0.8s ease 1.0s forwards; }
.hero-buttons { display:flex; gap:1rem; flex-wrap:wrap; opacity:0; animation:fadeUp 0.8s ease 1.2s forwards; }
.hero-trust { position:absolute; bottom:2rem; right:4rem; z-index:2; display:flex; align-items:center; gap:0.6rem; opacity:0; animation:fadeUp 0.8s ease 1.4s forwards; }
.hero-trust-stars { color:var(--gold); font-size:0.85rem; letter-spacing:0.1em; }
.hero-trust-text { font-size:0.72rem; text-transform:uppercase; letter-spacing:0.18em; color:var(--muted); }

/* ── QUOTE ───────────────────────────────────────────────────────────────── */
.quote-section { padding:6rem 4rem; background:var(--dark-2); text-align:center; border-top:var(--gold-line); border-bottom:var(--gold-line); }
.quote-text { font-family:var(--serif); font-size:clamp(1.6rem,3vw,2.4rem); font-weight:300; font-style:italic; color:var(--warm); max-width:780px; margin:0 auto 1rem; line-height:1.4; }
.quote-author { font-size:0.75rem; text-transform:uppercase; letter-spacing:0.22em; color:var(--gold); }

/* ── ABOUT ───────────────────────────────────────────────────────────────── */
.about-section { padding:7rem 4rem; max-width:var(--max-w); margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; }
.about-img-wrap { position:relative; }
.about-img-wrap img { width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center top; border-radius:2px; display:block; max-height:560px; }
.about-img-badge { position:absolute; bottom:-1.5rem; right:-1.5rem; background:var(--gold); color:var(--dark); padding:1.2rem 1.8rem; font-size:0.72rem; text-transform:uppercase; letter-spacing:0.18em; font-weight:600; }
.about-stats { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin:2.5rem 0; }
.stat-item { border-left:2px solid var(--gold); padding-left:1.2rem; }
.stat-num { font-family:var(--serif); font-size:2.4rem; font-weight:300; color:var(--warm); line-height:1; }
.stat-label { font-size:0.72rem; text-transform:uppercase; letter-spacing:0.16em; color:var(--muted); margin-top:0.3rem; }
.about-credentials { display:flex; flex-wrap:wrap; gap:0.6rem; margin-top:2rem; }
.credential-tag { font-size:0.68rem; text-transform:uppercase; letter-spacing:0.16em; color:var(--gold); border:1px solid rgba(200,169,106,0.35); padding:0.4rem 0.9rem; border-radius:1px; }

/* ── PAKETE ──────────────────────────────────────────────────────────────── */
.pakete-section { padding:7rem 4rem; background:var(--dark); }
.pakete-inner { max-width:var(--max-w); margin:0 auto; }
.pakete-header { text-align:center; margin-bottom:4rem; }
.pakete-header p { color:var(--muted); max-width:560px; margin:0 auto; }
.pakete-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(200,169,106,0.15); border:var(--gold-line); }
.paket-card { background:var(--card); padding:3rem 2.5rem; position:relative; transition:background 0.25s; }
.paket-card:hover { background:var(--card-hover); }
.paket-card.featured { background:#1F1E1B; border:1px solid var(--gold); margin:-1px; z-index:1; }
.featured-badge { position:absolute; top:-1px; right:2rem; background:var(--gold); color:var(--dark); font-size:0.62rem; text-transform:uppercase; letter-spacing:0.2em; font-weight:600; padding:0.3rem 0.8rem; }
.paket-icon { font-size:1.8rem; margin-bottom:1rem; }
.paket-tag { display:inline-block; font-size:0.65rem; text-transform:uppercase; letter-spacing:0.22em; color:var(--gold); margin-bottom:0.6rem; }
.paket-name { font-family:var(--serif); font-size:1.9rem; font-weight:400; color:var(--warm); margin-bottom:0.4rem; }
.paket-subtitle { font-size:0.9rem; color:var(--muted); margin-bottom:1rem; }
.paket-quote { font-family:var(--serif); font-style:italic; font-size:1rem; color:var(--text); border-left:2px solid var(--gold); padding-left:1rem; margin:1.2rem 0; line-height:1.5; }
.paket-price { font-family:var(--serif); font-size:2.8rem; font-weight:300; color:var(--warm); margin:1.2rem 0 0.3rem; }
.paket-price-note { font-size:0.72rem; color:var(--muted); text-transform:uppercase; letter-spacing:0.12em; margin-bottom:1.5rem; }
.paket-includes { font-size:0.68rem; text-transform:uppercase; letter-spacing:0.18em; color:var(--gold); margin-bottom:0.8rem; }
.paket-features { list-style:none; margin-bottom:1.2rem; }
.paket-features li { font-size:0.88rem; color:var(--text); padding:0.35rem 0 0.35rem 1.2rem; border-bottom:1px solid rgba(255,255,255,0.05); position:relative; }
.paket-features li::before { content:'✦'; position:absolute; left:0; color:var(--gold); font-size:0.55rem; top:0.55rem; }
.paket-for { font-size:0.82rem; color:var(--muted); font-style:italic; margin-bottom:1.8rem; line-height:1.5; }
.paket-btn { display:block; font-family:var(--sans); font-size:0.78rem; font-weight:500; text-transform:uppercase; letter-spacing:0.08em; color:var(--dark); background:var(--gold); padding:0.85rem 1rem; border-radius:2px; transition:background 0.2s, transform 0.15s; width:100%; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.paket-btn:hover { background:var(--gold-lt); transform:translateY(-1px); }

/* ── ERSTGESPRÄCH BANNER ─────────────────────────────────────────────────── */
.erstgespraech-banner { max-width:var(--max-w); margin:2rem auto 0; background:var(--dark-2); border:var(--gold-line); padding:2.5rem 3rem; display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap; }
.eg-left { display:flex; align-items:center; gap:1.5rem; }
.eg-icon { font-size:2rem; }
.eg-title { font-family:var(--serif); font-size:1.6rem; color:var(--warm); }
.eg-sub { font-size:0.82rem; color:var(--muted); margin-top:0.2rem; }
.eg-price { font-family:var(--serif); font-size:2.4rem; color:var(--gold); }

/* ── REVIEWS ─────────────────────────────────────────────────────────────── */
.reviews-section { padding:7rem 4rem; background:var(--dark-2); border-top:var(--gold-line); }
.reviews-inner { max-width:var(--max-w); margin:0 auto; }
.reviews-header { text-align:center; margin-bottom:3.5rem; }
.reviews-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(200,169,106,0.12); }
.review-card { background:var(--card); padding:2.5rem; }
.review-stars { color:var(--gold); font-size:0.9rem; letter-spacing:0.1em; margin-bottom:1rem; }
.review-text { font-family:var(--serif); font-style:italic; font-size:1.05rem; color:var(--text); line-height:1.6; margin-bottom:1.2rem; }
.review-author { font-size:0.72rem; text-transform:uppercase; letter-spacing:0.16em; color:var(--muted); }
.pe-trust-wrap { text-align:center; margin-top:3rem; }
.pe-badge-inline { display:inline-flex; align-items:center; gap:1rem; background:var(--card); border:var(--gold-line); padding:1.2rem 2rem; border-radius:2px; }
.pe-stars-big { color:var(--gold); font-size:1.1rem; }
.pe-score { font-family:var(--serif); font-size:1.8rem; color:var(--warm); }
.pe-label { font-size:0.7rem; text-transform:uppercase; letter-spacing:0.16em; color:var(--muted); }
.pe-link { font-size:0.72rem; color:var(--gold); text-transform:uppercase; letter-spacing:0.14em; }
.pe-link:hover { text-decoration:underline; }

/* ── CTA ─────────────────────────────────────────────────────────────────── */
.cta-section { padding:8rem 4rem; background:var(--dark); text-align:center; border-top:var(--gold-line); }
.cta-inner { max-width:680px; margin:0 auto; }
.cta-secret { font-family:var(--serif); font-style:italic; font-size:1.15rem; color:var(--gold-lt); margin:1.5rem 0; line-height:1.5; }
.cta-section p { color:var(--muted); margin-bottom:2.5rem; }

/* ── FOOTER ──────────────────────────────────────────────────────────────── */
footer { background:var(--dark-2); border-top:var(--gold-line); padding:3.5rem 4rem; text-align:center; }
.footer-logo { font-family:var(--serif); font-size:1.5rem; color:var(--warm); margin-bottom:1.5rem; }
.footer-links { list-style:none; display:flex; justify-content:center; flex-wrap:wrap; gap:0.5rem 2rem; margin-bottom:1.5rem; }
.footer-links a { font-size:0.78rem; color:var(--muted); text-transform:uppercase; letter-spacing:0.14em; transition:color 0.2s; }
.footer-links a:hover { color:var(--gold); }
.footer-copy { font-size:0.72rem; color:var(--muted); letter-spacing:0.1em; }

/* ── COOKIE BANNER ───────────────────────────────────────────────────────── */
#cookie-banner { position:fixed; bottom:0; left:0; right:0; z-index:9999; background:#1A1917; border-top:1px solid rgba(200,169,106,0.3); padding:1.5rem 2rem; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; transform:translateY(100%); transition:transform 0.5s ease; }
#cookie-banner.show { transform:translateY(0); }
.cookie-text { font-size:0.82rem; color:var(--text); max-width:700px; line-height:1.5; }
.cookie-text a { color:var(--gold); text-decoration:underline; }
.cookie-actions { display:flex; gap:0.8rem; flex-wrap:wrap; }
.cookie-btn { font-size:0.72rem; text-transform:uppercase; letter-spacing:0.14em; font-weight:500; padding:0.6rem 1.4rem; border-radius:2px; cursor:pointer; border:none; font-family:var(--sans); }
.cookie-btn-accept { background:var(--gold); color:var(--dark); }
.cookie-btn-accept:hover { background:var(--gold-lt); }
.cookie-btn-essential { background:transparent; color:var(--muted); border:1px solid var(--muted); }
.cookie-btn-essential:hover { border-color:var(--gold); color:var(--gold); }

/* ── LIGHTBOX MODAL ──────────────────────────────────────────────────────── */
.modal-overlay { position:fixed; inset:0; z-index:9000; background:rgba(10,10,9,0.88); backdrop-filter:blur(8px); display:flex; align-items:center; justify-content:center; padding:1.5rem; opacity:0; pointer-events:none; transition:opacity 0.3s ease; }
.modal-overlay.open { opacity:1; pointer-events:all; }
.modal-box { background:var(--dark-2); border:var(--gold-line); border-top:2px solid var(--gold); padding:2.5rem; max-width:480px; width:100%; position:relative; transform:translateY(20px); transition:transform 0.3s ease; }
.modal-overlay.open .modal-box { transform:translateY(0); }
.modal-close { position:absolute; top:1rem; right:1.2rem; background:none; border:none; color:var(--muted); font-size:1.5rem; cursor:pointer; line-height:1; transition:color 0.2s; }
.modal-close:hover { color:var(--gold); }
.modal-title { font-family:var(--serif); font-size:1.8rem; font-weight:300; color:var(--warm); margin-bottom:0.4rem; }
.modal-sub { font-size:0.82rem; color:var(--muted); margin-bottom:1.8rem; }
.form-group { margin-bottom:1.2rem; }
.form-group label { display:block; font-size:0.68rem; text-transform:uppercase; letter-spacing:0.18em; color:var(--gold); margin-bottom:0.4rem; }
.form-group input, .form-group select, .form-group textarea { width:100%; background:rgba(255,255,255,0.04); border:1px solid rgba(200,169,106,0.25); color:var(--warm); font-family:var(--sans); font-size:0.9rem; padding:0.75rem 1rem; border-radius:2px; outline:none; transition:border-color 0.2s; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color:var(--gold); }
.form-group select option { background:var(--dark-2); }
.form-submit { width:100%; margin-top:0.5rem; }
.form-success { display:none; text-align:center; padding:1.5rem 0; }
.form-success .success-icon { font-size:2.5rem; margin-bottom:1rem; }
.form-success h3 { font-family:var(--serif); font-size:1.5rem; color:var(--warm); margin-bottom:0.5rem; }
.form-success p { font-size:0.88rem; color:var(--muted); }
.form-error { background:rgba(192,57,43,0.15); border:1px solid rgba(192,57,43,0.4); color:#e74c3c; font-size:0.82rem; padding:0.7rem 1rem; border-radius:2px; margin-bottom:1rem; display:none; }

/* ── LEGAL PAGES ─────────────────────────────────────────────────────────── */
.legal-page { max-width:760px; margin:0 auto; padding:8rem 2rem 5rem; }
.legal-page h1 { font-family:var(--serif); font-size:2.5rem; font-weight:300; color:var(--warm); margin-bottom:2rem; }
.legal-page h2 { font-family:var(--serif); font-size:1.4rem; font-weight:400; color:var(--gold); margin:2.5rem 0 0.8rem; border-bottom:var(--gold-line); padding-bottom:0.5rem; }
.legal-page h3 { font-size:1rem; font-weight:500; color:var(--warm); margin:1.5rem 0 0.5rem; }
.legal-page p, .legal-page li { font-size:0.92rem; color:var(--text); margin-bottom:0.8rem; }
.legal-page ul { margin:0.5rem 0 1rem 1.5rem; }
.legal-page a { color:var(--gold); }
.back-link { display:inline-block; margin-bottom:2rem; font-size:0.78rem; text-transform:uppercase; letter-spacing:0.16em; color:var(--muted); }
.back-link:hover { color:var(--gold); }
.legal-updated { font-size:0.78rem; color:var(--muted); margin-bottom:2rem; }

/* ── DANKE PAGE ──────────────────────────────────────────────────────────── */
.danke-page { min-height:100vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:2rem; }
.danke-inner { max-width:560px; }
.danke-icon { font-size:3rem; margin-bottom:1.5rem; }

/* ── MOBILE ──────────────────────────────────────────────────────────────── */
@media (max-width:900px) {
  .paket-btn { font-size:0.72rem; letter-spacing:0.04em; padding:0.85rem 0.6rem; white-space:normal; word-break:break-word; }
  .paket-price { font-size:2.2rem; }
  .paket-grid { gap:2px; }
  #navbar { padding:1.2rem 1.8rem; }
  #navbar.scrolled { padding:0.9rem 1.8rem; }
  .nav-links, .nav-cta { display:none; }
  .nav-hamburger { display:block; }
  .nav-links.open { display:flex; flex-direction:column; position:fixed; top:0; left:0; right:0; bottom:0; background:var(--dark); align-items:center; justify-content:center; gap:2.5rem; z-index:999; }
  .nav-links.open a { font-size:1.2rem; }
  .hero-content { padding:0 1.8rem 5rem; }
  .hero-trust { display:none; }
  .quote-section { padding:4rem 1.8rem; }
  .about-section { grid-template-columns:1fr; gap:3rem; padding:5rem 1.8rem; }
  .about-img-badge { right:0; bottom:-1rem; }
  .about-img-wrap img { aspect-ratio:4/3; max-height:300px; object-position:center 15%; }
  .pakete-section { padding:5rem 1.8rem; }
  .pakete-grid { grid-template-columns:1fr; }
  .paket-card.featured { margin:0; }
  .erstgespraech-banner { padding:2rem 1.8rem; flex-direction:column; align-items:flex-start; }
  .reviews-section { padding:5rem 1.8rem; }
  .reviews-grid { grid-template-columns:1fr; }
  .cta-section { padding:5rem 1.8rem; }
  footer { padding:3rem 1.8rem; }
  #cookie-banner { padding:1.2rem 1.5rem; }
  .modal-box { padding:2rem 1.5rem; }
}