*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  --orange: #e8621a;
  --dark: #1a1a1a;
  --light-bg: #fff8f5;
  --section-bg: #f9f5f2;
  --border: #f0e8e0;
  --gray: #666;
  --light-gray: #f0f0f0;
}
html { scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; color: var(--dark); line-height: 1.6; }
h1, h2, h3, h4 { font-family: 'Playfair Display', serif; }
a { text-decoration: none; color: inherit; }
img { max-width: 100%; }

/* NAVBAR */
.navbar {
  position: sticky; top: 0; z-index: 1000;
  background: #fff;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  padding: 0 40px;
  display: flex; align-items: center; justify-content: space-between;
  height: 72px;
}
.navbar-logo img { height: auto; width: 160px; max-width: 160px; object-fit: contain; display: block; }
.navbar-links { display: flex; align-items: center; gap: 28px; list-style: none; }
.navbar-links a {
  font-size: 0.92rem; font-weight: 500; color: var(--dark);
  padding: 6px 0; transition: color 0.2s;
}
.navbar-links a:hover { color: var(--orange); }
.navbar-links a.active {
  color: var(--orange);
  border-bottom: 2px solid var(--orange);
  padding-bottom: 4px;
}
.navbar-right { display: flex; align-items: center; gap: 16px; }
.navbar-phone {
  display: flex; align-items: center; gap: 6px;
  font-size: 0.85rem; color: var(--dark);
}
.navbar-phone svg { width: 16px; height: 16px; fill: var(--orange); }
.navbar-phone span.hours { color: var(--gray); font-size: 0.78rem; margin-left: 2px; }
.whatsapp-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 50%;
  background: #25D366; color: #fff; transition: transform 0.2s;
}
.whatsapp-btn:hover { transform: scale(1.1); }
.whatsapp-btn svg { width: 20px; height: 20px; fill: #fff; }
.btn-orange {
  background: var(--orange); color: #fff;
  padding: 10px 24px; border-radius: 8px;
  font-weight: 600; font-size: 0.9rem;
  border: none; cursor: pointer;
  transition: background 0.2s, transform 0.2s;
  display: inline-flex; align-items: center; gap: 6px;
}
.btn-orange:hover { background: #d4570f; transform: translateY(-1px); }
.btn-outline {
  background: transparent; color: var(--orange);
  border: 2px solid var(--orange);
  padding: 10px 24px; border-radius: 8px;
  font-weight: 600; font-size: 0.9rem;
  cursor: pointer; transition: all 0.2s;
  display: inline-flex; align-items: center; gap: 6px;
}
.btn-outline:hover { background: var(--orange); color: #fff; }
.hamburger {
  display: none; cursor: pointer; background: none; border: none;
  flex-direction: column; gap: 5px; padding: 8px;
}
.hamburger span {
  display: block; width: 26px; height: 3px;
  background: var(--dark); border-radius: 2px;
  transition: transform 0.3s, opacity 0.3s;
}
.mobile-menu {
  display: none; position: fixed; top: 72px; left: 0; right: 0;
  background: #fff; box-shadow: 0 8px 20px rgba(0,0,0,0.1);
  padding: 20px; z-index: 999; flex-direction: column; gap: 16px;
}
.mobile-menu.active { display: flex; }
.mobile-menu a {
  font-size: 1rem; padding: 10px 0;
  border-bottom: 1px solid var(--light-gray);
  font-weight: 500;
}
.mobile-menu a.active { color: var(--orange); }

/* HERO */
.hero {
  display: grid; grid-template-columns: 1fr 1fr;
  min-height: 90vh; background: var(--light-bg);
}
.hero-text {
  padding: 80px 60px;
  display: flex; flex-direction: column; justify-content: center;
  position: relative; z-index: 2;
}
.hero-tagline {
  font-size: 0.85rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 4px;
  color: var(--orange); margin-bottom: 16px;
}
.hero h1 {
  font-size: 3.5rem; font-weight: 700;
  color: var(--dark); line-height: 1.15;
  margin-bottom: 12px;
}
.hero-sub {
  font-family: 'Playfair Display', serif;
  font-style: italic; font-size: 1.3rem;
  color: var(--orange); margin-bottom: 20px;
}
.hero-body {
  font-size: 1.05rem; color: var(--gray);
  max-width: 480px; margin-bottom: 32px; line-height: 1.7;
}
.hero-buttons { display: flex; gap: 16px; flex-wrap: wrap; }
.hero-image {
  position: relative;
  background: url('assets/paar-am-see-partnersuche.webp') center/cover no-repeat;
}
.hero-handwriting {
  position: absolute; bottom: 40px; right: 40px;
  font-family: 'Playfair Display', serif;
  font-style: italic; color: #fff;
  font-size: 1.2rem; line-height: 1.8;
  text-shadow: 0 2px 8px rgba(0,0,0,0.5);
  text-align: right;
}

/* STATS BAR */
.stats-bar {
  background: #fff;
  border-top: 1px solid var(--light-gray);
  border-bottom: 1px solid var(--light-gray);
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  padding: 40px 60px;
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
.stat-item {
  display: flex; align-items: center; gap: 16px;
  justify-content: center;
}
.stat-icon {
  width: 48px; height: 48px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.stat-icon svg { width: 36px; height: 36px; fill: var(--orange); }
.stat-text { font-size: 0.95rem; font-weight: 500; color: var(--dark); }

/* KENNENLERNEN */
.kennenlernen {
  background: var(--section-bg);
  padding: 80px 60px;
  display: grid; grid-template-columns: 1fr 2fr 1fr;
  gap: 40px; align-items: center;
}
.quote-box {
  background: #fff; border-radius: 16px;
  padding: 30px; text-align: center;
  box-shadow: 0 2px 20px rgba(0,0,0,0.08);
}
.quote-box .quote-text {
  font-family: 'Playfair Display', serif;
  font-style: italic; font-size: 1.1rem;
  color: #333; margin-bottom: 16px;
}
.quote-box .quote-heart { color: var(--orange); font-size: 1.3rem; }
.quote-box .quote-source { font-size: 0.85rem; color: #888; margin-top: 8px; }
.kennenlernen-center h2 {
  font-size: 2.2rem; margin-bottom: 8px;
}
.kennenlernen-center .sub {
  color: var(--orange); font-size: 1.1rem;
  font-weight: 500; margin-bottom: 16px;
}
.kennenlernen-center p {
  color: var(--gray); line-height: 1.7;
}
.check-list { list-style: none; margin-bottom: 24px; }
.check-list li {
  padding: 8px 0; font-size: 0.95rem;
  display: flex; align-items: center; gap: 10px;
}
.check-list li::before {
  content: '✓'; color: var(--orange);
  font-weight: 700; font-size: 1.1rem;
}

/* MITGLIEDER */
.mitglieder {
  padding: 80px 60px; background: #fff;
}
.section-header {
  display: flex; justify-content: space-between;
  align-items: center; margin-bottom: 40px;
}
.section-header h2 { font-size: 2rem; position: relative; padding-bottom: 12px; }
.section-header h2::after {
  content: ''; position: absolute; bottom: 0; left: 0;
  width: 60px; height: 3px; background: var(--orange); border-radius: 2px;
}
.section-header a {
  color: var(--orange); font-weight: 600;
  font-size: 0.95rem;
}
.section-header a:hover { text-decoration: underline; }
.slider-container { position: relative; overflow: hidden; }
.slider-track {
  display: flex; gap: 24px;
  transition: transform 0.4s ease;
  will-change: transform;
}
.slider-btn {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--orange); color: #fff;
  border: none; cursor: pointer; z-index: 10;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem; box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  transition: background 0.2s;
}
.slider-btn:hover { background: #d4570f; }
.slider-btn.prev { left: 8px; }
.slider-btn.next { right: 8px; }
.member-card {
  border: 1px solid var(--border);
  border-radius: 12px; overflow: hidden;
  background: #fff;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  min-width: 220px; flex: 0 0 calc(20% - 20px);
}
.member-card img {
  width: 100%; height: 240px;
  object-fit: cover; object-position: center top;
}
.member-card-body { padding: 16px; }
.member-card-body h4 { font-size: 1.1rem; margin-bottom: 4px; }
.member-card-body .region {
  color: var(--orange); font-size: 0.85rem;
  text-decoration: underline; text-underline-offset: 3px;
  margin-bottom: 8px; display: block;
}
.member-card-body .desc {
  font-size: 0.88rem; color: var(--gray);
  margin-bottom: 16px; line-height: 1.5;
}
.member-card-body .btn-outline {
  width: 100%; justify-content: center;
  font-size: 0.85rem; padding: 8px 16px;
}

/* SO FUNKTIONIERT ES */
.how-it-works {
  padding: 80px 60px; background: #fff;
}
.how-it-works h2 {
  text-align: center; font-size: 2rem;
  margin-bottom: 12px; position: relative;
  display: inline-block;
}
.how-it-works .section-title-wrap {
  text-align: center; margin-bottom: 50px;
}
.how-it-works .section-title-wrap::after {
  content: ''; display: block;
  width: 60px; height: 3px;
  background: var(--orange); border-radius: 2px;
  margin: 12px auto 0;
}
.steps {
  display: grid; grid-template-columns: repeat(7, auto);
  align-items: flex-start; justify-content: center; gap: 0;
}
.step {
  text-align: center; max-width: 220px; padding: 0 16px;
}
.step-circle {
  width: 64px; height: 64px; border-radius: 50%;
  background: var(--orange); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.5rem; font-weight: 700;
  margin: 0 auto 16px;
  font-family: 'Playfair Display', serif;
}
.step-icon { margin-bottom: 12px; }
.step-icon svg { width: 40px; height: 40px; fill: var(--orange); }
.step h4 { font-size: 1rem; margin-bottom: 8px; }
.step p { font-size: 0.85rem; color: var(--gray); line-height: 1.5; }
.step-arrow {
  display: flex; align-items: center; justify-content: center;
  padding-top: 50px; color: #ccc; font-size: 1.5rem;
}
.step-arrow svg { width: 32px; height: 32px; fill: #ccc; }

/* TESTIMONIALS */
.testimonials {
  padding: 80px 60px; background: #fff;
}
.testimonial-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
.testimonial-card {
  background: #fff; border-radius: 16px;
  padding: 32px; box-shadow: 0 2px 16px rgba(0,0,0,0.06);
}
.testimonial-card .quote-mark {
  font-family: 'Playfair Display', serif;
  font-size: 4rem; color: var(--orange);
  line-height: 0.8; margin-bottom: 8px;
}
.testimonial-card .quote {
  font-size: 0.95rem; color: #444;
  line-height: 1.7; margin-bottom: 20px;
  font-style: italic;
}
.testimonial-author {
  display: flex; align-items: center; gap: 12px;
}
.testimonial-author img {
  width: 50px; height: 50px; border-radius: 50%;
  object-fit: cover;
}
.testimonial-author .name {
  font-weight: 600; font-size: 0.9rem;
}

/* CTA BANNER */
.cta-banner {
  background: url('assets/paar-am-see-gemeinsame-zukunft.webp') center/cover no-repeat;
  position: relative; padding: 100px 60px;
  display: grid; grid-template-columns: 1fr 1fr;
  align-items: center; min-height: 400px;
}
.cta-banner::before {
  content: ''; position: absolute; inset: 0;
  background: rgba(0,0,0,0.55);
}
.cta-banner-text {
  position: relative; z-index: 2;
}
.cta-banner-text h2 {
  color: #fff; font-size: 2.2rem;
  margin-bottom: 12px;
}
.cta-banner-text p {
  color: rgba(255,255,255,0.85);
  margin-bottom: 28px; font-size: 1.05rem;
}
.btn-white {
  background: #fff; color: var(--orange);
  padding: 14px 32px; border-radius: 8px;
  font-weight: 700; font-size: 1rem;
  border: none; cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
}
.btn-white:hover { transform: translateY(-2px); box-shadow: 0 4px 16px rgba(0,0,0,0.2); }
.cta-banner-handwriting {
  position: relative; z-index: 2;
  text-align: right;
  font-family: 'Playfair Display', serif;
  font-style: italic; color: #fff;
  font-size: 1.3rem; line-height: 2;
  text-shadow: 0 2px 8px rgba(0,0,0,0.4);
}

/* FOOTER */
.footer {
  background: #fff;
  border-top: 1px solid #eee;
  padding: 10px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 16px;
}
.footer-content { display: none; }
.footer-left { display: none; }
.footer-links { display: flex; gap: 20px; flex-wrap: wrap; }
.footer-links a {
  color: #666; font-size: 0.82rem;
  transition: color 0.2s; text-decoration: none;
}
.footer-links a:hover { color: var(--orange); }
.footer-bottom {
  color: #aaa; font-size: 0.78rem;
  padding-top: 0; border-top: none;
  white-space: nowrap;
}

/* MODALS */
.modal-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(0,0,0,0.5); z-index: 2000;
  align-items: center; justify-content: center;
}
.modal-overlay.active { display: flex; }
.modal {
  background: #fff; border-radius: 16px;
  padding: 40px; max-width: 500px; width: 90%;
  position: relative; max-height: 90vh; overflow-y: auto;
}
.modal-close {
  position: absolute; top: 16px; right: 16px;
  background: none; border: none; font-size: 1.5rem;
  cursor: pointer; color: var(--gray); line-height: 1;
}
.modal h3 {
  font-size: 1.5rem; margin-bottom: 8px;
}
.modal .modal-sub {
  color: var(--gray); font-size: 0.9rem; margin-bottom: 24px;
}
.form-group { margin-bottom: 16px; }
.form-group label {
  display: block; font-size: 0.85rem;
  font-weight: 600; margin-bottom: 6px;
}
.form-group input, .form-group textarea {
  width: 100%; padding: 12px 16px;
  border: 1px solid #ddd; border-radius: 8px;
  font-family: 'Inter', sans-serif; font-size: 0.95rem;
  transition: border-color 0.2s;
}
.form-group input:focus, .form-group textarea:focus {
  outline: none; border-color: var(--orange);
}
.form-group textarea { height: 100px; resize: vertical; }
.form-msg {
  padding: 12px; border-radius: 8px;
  margin-bottom: 16px; font-size: 0.9rem; display: none;
}
.form-msg.success { display: block; background: #e8f5e9; color: #2e7d32; }
.form-msg.error { display: block; background: #fbe9e7; color: #c62828; }

/* PROFIL MODAL */
.profile-modal .profile-header {
  text-align: center; margin-bottom: 24px;
}
.profile-modal .profile-header img {
  width: 120px; height: 120px; border-radius: 12px;
  object-fit: cover; margin-bottom: 16px;
}
.profile-modal .profile-header h3 { margin-bottom: 4px; }
.profile-modal .profile-header .region {
  color: var(--orange); font-size: 0.9rem;
}
.profile-modal .profile-desc {
  color: var(--gray); text-align: center;
  margin-bottom: 24px; line-height: 1.6;
}
.profile-actions {
  display: flex; flex-direction: column; gap: 12px;
}
.profile-actions a, .profile-actions button {
  display: flex; align-items: center; justify-content: center;
  gap: 8px; padding: 12px; border-radius: 8px;
  font-weight: 600; font-size: 0.95rem;
  text-align: center; cursor: pointer;
  transition: transform 0.2s;
}
.profile-actions a:hover, .profile-actions button:hover { transform: translateY(-1px); }
.profile-actions .call-btn {
  background: #e8f5e9; color: #2e7d32; border: none;
}
.profile-actions .wa-btn {
  background: #e8f5e9; color: #25D366; border: none;
}
.profile-actions .msg-btn {
  background: var(--light-bg); color: var(--orange);
  border: 2px solid var(--orange);
}

/* RESPONSIVE */
@media (max-width: 1024px) {
  .navbar-links, .navbar-phone { display: none; }
  .hamburger { display: flex; }
  .hero { grid-template-columns: 1fr; min-height: auto; }
  .hero-text { padding: 60px 30px; }
  .hero h1 { font-size: 2.5rem; }
  .hero-image { height: 50vh; }
  .stats-bar { grid-template-columns: 1fr 1fr; padding: 30px; }
  .kennenlernen { grid-template-columns: 1fr; padding: 60px 30px; }
  .mitglieder { padding: 60px 30px; }
  .member-card { flex: 0 0 calc(50% - 12px); }
  .steps { grid-template-columns: 1fr 1fr; gap: 24px; }
  .step-arrow { display: none; }
  .testimonial-grid { grid-template-columns: 1fr; }
  .comparison-cards { grid-template-columns: 1fr; }
  .comparison-section { padding: 60px 30px; }
  .cta-banner { grid-template-columns: 1fr; padding: 60px 30px; }
  .cta-banner-handwriting { text-align: center; margin-top: 30px; }
  .how-it-works { padding: 60px 30px; }
  .testimonials { padding: 60px 30px; }
  .footer { padding: 40px 30px 20px; }
}
@media (max-width: 600px) {
  .navbar { padding: 0 16px; }
  .hero-text { padding: 40px 20px; }
  .hero h1 { font-size: 2rem; }
  .hero-sub { font-size: 1.1rem; }
  .hero-buttons { flex-direction: column; }
  .hero-buttons .btn-orange, .hero-buttons .btn-outline { width: 100%; justify-content: center; }
  .stats-bar { grid-template-columns: 1fr; padding: 24px 20px; }
  .member-card { flex: 0 0 100%; }
  .steps { grid-template-columns: 1fr; }
  .section-header { flex-direction: column; gap: 12px; text-align: center; }
  .section-header h2::after { left: 50%; transform: translateX(-50%); }
  .kennenlernen { padding: 40px 20px; }
  .mitglieder { padding: 40px 20px; }
  .how-it-works { padding: 40px 20px; }
  .testimonials { padding: 40px 20px; }
  .comparison-section { padding: 40px 20px; }
  .cta-banner { padding: 60px 20px; }
  .footer { padding: 30px 20px 16px; }
  .footer-content { flex-direction: column; }
}

/* Layout matched to the supplied orange mockup. */
:root{--orange:#ff510b;--dark:#18212b;--gray:#42454b;--light-bg:#fff8f1;--section-bg:#fcf4ed;--border:#f1e8e0}
body{font-size:14px;font-weight:400}button{font-family:inherit}h1,h2,h3{font-weight:400}h4{font-family:Inter,sans-serif}section[id]{scroll-margin-top:80px}
.navbar{height:65px;padding:0 max(24px,calc((100% - 910px)/2));gap:28px;box-shadow:none;position:relative;white-space:nowrap}
.brand-wordmark{display:block;position:relative;font:700 25px/.88 Inter,sans-serif;letter-spacing:-1.2px;color:var(--orange);width:162px}.brand-heart{position:absolute;right:10px;top:-5px;font:46px/1 Inter,sans-serif}.brand-wordmark small{display:block;color:#505762;font:500 7px/1.5 Inter,sans-serif;letter-spacing:1.3px;margin-top:5px}
.navbar-links{gap:20px}.navbar-links a{font-size:10px;font-weight:400}.navbar-right{gap:10px}.navbar-phone{display:grid;grid-template-columns:16px auto;gap:0 4px;font-size:11px;font-weight:700}.navbar-phone svg{grid-row:1/3}.navbar-phone span.hours{grid-column:2;font-size:10px;font-weight:400;margin:0}.navbar-right .btn-orange{padding:10px 14px;font-size:10px;border-radius:5px}.navbar .whatsapp-btn{display:flex}
.hero{display:block;min-height:0;position:relative;background:url('assets/paar-am-see-partnersuche.webp') center/cover no-repeat;height:377px}
.hero-text{padding:43px 0 18px;max-width:880px;margin:auto;display:block}.hero-tagline{font-size:10px;letter-spacing:1.6px;margin-bottom:9px;font-weight:500}.hero h1{font-size:50px;line-height:1.05;font-weight:700;margin-bottom:4px;letter-spacing:-1px}.hero-sub{font-family:Caveat,cursive;font-size:34px;line-height:1.25;margin-bottom:16px;white-space:nowrap}.hero-body{font-size:15px;line-height:1.45;max-width:375px;margin-bottom:20px}.hero-buttons{gap:12px}.hero-buttons .btn-orange,.hero-buttons .btn-outline{font-size:12px!important;padding:10px 18px!important;border-radius:30px}.hero-buttons .btn-outline{background:white;color:var(--dark);border-width:1px}.hero-image{position:absolute;inset:0;background:none;pointer-events:none}.hero-handwriting{bottom:70px;right:25px;font-family:Caveat,cursive;font-size:28px;line-height:1.05;transform:rotate(-13deg);font-weight:400;text-align:center}
.stats-bar{padding:14px max(24px,calc((100% - 850px)/2));gap:0;border:0;background:#fdf9f5;box-shadow:none}.stat-item{gap:14px;border-right:1px solid #e7dad1}.stat-item:last-child{border:0}.stat-icon{width:40px;height:33px}.stat-icon svg{width:30px;height:30px}.stat-text{font-size:11px;line-height:1.5}
.kennenlernen{margin:10px auto 0;max-width:966px;border-radius:10px;padding:23px 24px;grid-template-columns:1fr 1.22fr .86fr;gap:28px}.quote-box{box-shadow:none;background:transparent;padding:10px 20px;transform:rotate(-9deg)}.quote-box .quote-text{font-family:Caveat,cursive;font-size:25px;line-height:1.3}.quote-heart{font-size:38px;color:var(--orange);line-height:1.1}.kennenlernen-center h2{font-size:23px;line-height:1.2;margin-bottom:5px}.kennenlernen-center .sub{font-size:13px;margin-bottom:7px}.kennenlernen-center p{font-size:13px;line-height:1.5}.check-list{margin-bottom:15px}.check-list li{font-size:10px;padding:3px 0}.kennenlernen-right .btn-orange{border-radius:7px;font-size:12px;padding:11px 15px}
.mitglieder,.how-it-works,.testimonials{max-width:914px;margin:auto;padding:16px 0 4px}.section-header{margin-bottom:13px;align-items:center}.section-header h2,.how-it-works h2{font-size:25px;line-height:1.2}.section-header h2::after{height:2px;width:40px;bottom:-6px}.section-header a{font-size:10px;font-weight:400}.slider-track{gap:20px}.member-card{min-width:0;flex:0 0 calc((100% - 80px)/5);border-radius:5px;box-shadow:0 5px 15px #00000006}.member-card-body{padding:13px 10px;display:flex;flex-direction:column;height:100%}.member-card-body h4{font-size:12px;white-space:nowrap;font-weight:600}.member-card-body .region{font-size:11px;color:#595959;margin-bottom:6px;text-decoration-color:var(--orange)}.member-card-body .desc{font-size:11px;line-height:1.45;margin-bottom:9px;flex:1}.member-card-body .btn-outline{border-width:1px;border-radius:25px;font-size:10px;padding:5px 8px}.slider-btn{display:none}
.how-it-works{padding-top:23px}.how-it-works .section-title-wrap{text-align:left;margin-bottom:14px}.how-it-works .section-title-wrap::after{width:40px;height:2px;margin:5px 0 0}.how-it-works h2{margin:0}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.step{position:relative;padding:0;max-width:none}.step-arrow{display:none}.step-circle{width:30px;height:30px;position:absolute;left:12px;top:2px;font:500 13px Inter,sans-serif;background:linear-gradient(135deg,#ffa36a,#ff6734)}.step-icon{height:40px;margin:0 0 7px}.step-icon svg{width:38px;height:38px}.step h4{font:600 12px/1.4 Inter,sans-serif;margin-bottom:5px}.step p{font-size:12px;line-height:1.45}
.testimonials{padding-top:15px;padding-bottom:16px}.testimonial-grid{gap:20px}.testimonial-card{padding:13px 14px;border-radius:7px;border:1px solid #f3f3f3;box-shadow:0 3px 12px #00000004;position:relative}.testimonial-card .quote-mark{position:absolute;top:15px;left:13px;font-size:40px}.testimonial-card .quote{padding-left:45px;font-size:11px;font-style:normal;line-height:1.45;min-height:64px;margin-bottom:8px}.testimonial-author img{width:40px;height:40px}.testimonial-author .name{font-size:10px}.testimonial-author{gap:10px}
.cta-banner{min-height:145px;padding:15px max(24px,calc((100% - 904px)/2));grid-template-columns:2fr 1fr;background-position:center 45%}.cta-banner::before{background:linear-gradient(90deg,#ff510bd9 0%,#ff510b8c 35%,transparent 65%)}.cta-banner-text h2{font-size:26px;font-weight:700;margin-bottom:3px}.cta-banner-text p{font-size:13px;line-height:1.4;margin-bottom:9px;color:white}.btn-white{padding:8px 24px;border-radius:25px;font-size:12px}.cta-banner-handwriting{font-family:Caveat,cursive;font-size:25px;line-height:1.05;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,0.5);transform:rotate(-12deg)}
.footer{padding:30px max(24px,calc((100% - 904px)/2)) 15px}.footer .brand-wordmark{margin-bottom:15px}.mobile-menu{top:65px}a:focus-visible,button:focus-visible{outline:3px solid #e8621a;outline-offset:4px}
@media(min-width:1200px){.hero{height:calc(100vw * .368);max-height:540px}.hero-text{padding-top:clamp(43px,6vw,85px);max-width:1100px}.hero h1{font-size:clamp(50px,4.8vw,68px)}.hero-body{font-size:17px;max-width:420px}.hero-sub{font-size:40px}.hero-handwriting{right:4vw;font-size:35px}}
@media(max-width:1000px){.navbar{padding:0 24px}.navbar-links{display:none}.hamburger{display:flex}.navbar-phone{display:grid}.hero-text{margin:0 7%;padding-top:36px}.hero h1{font-size:46px}.hero-sub{font-size:30px}.hero-body{max-width:340px}.hero-handwriting{right:15px;font-size:24px}.kennenlernen{margin:12px 24px;grid-template-columns:1fr 1.3fr 1fr;gap:14px;padding:20px}.mitglieder,.how-it-works,.testimonials{margin:0 36px}.member-card{flex:0 0 calc((100% - 80px)/5)}.testimonial-grid{grid-template-columns:repeat(3,1fr)}.steps{grid-template-columns:repeat(4,1fr)}.section-header h2{font-size:22px}.section-header a{white-space:nowrap}}
@media(max-width:700px){.navbar-right .btn-orange{display:none}.hero{height:auto;min-height:610px;background-size:auto 320px;background-position:right top;background-color:#fff7ef}.hero-text{padding:330px 0 25px;margin:0 22px}.hero h1{font-size:40px}.hero-sub{font-size:28px;white-space:normal}.hero-tagline{font-size:9px}.hero-body{font-size:14px;max-width:none}.hero-buttons{flex-direction:column;gap:9px}.hero-buttons .btn-orange,.hero-buttons .btn-outline{width:100%;justify-content:center}.hero-handwriting{top:215px;bottom:auto;right:12px;font-size:22px}.stats-bar{grid-template-columns:repeat(2,1fr);gap:16px;padding:20px 14px}.stat-item:nth-child(2){border:0}.stat-item{justify-content:flex-start;gap:8px;padding-left:8px}.kennenlernen{grid-template-columns:1fr;margin:16px;border-radius:12px;padding:20px;gap:15px}.quote-box{padding:4px 20px}.quote-box .quote-text{font-size:25px}.quote-heart{font-size:30px}.kennenlernen-center h2{font-size:25px}.kennenlernen-center p{font-size:14px}.check-list li{font-size:12px}.mitglieder,.how-it-works,.testimonials{margin:0 22px;padding-top:20px}.section-header{align-items:flex-start;text-align:left;gap:10px}.section-header h2{font-size:24px}.section-header h2::after{left:0;transform:none}.slider-container{overflow:visible}.slider-track{transform:none!important;overflow-x:auto;padding-bottom:12px;scroll-snap-type:x mandatory;gap:16px}.member-card{flex:0 0 72%;scroll-snap-align:start}.member-card-body{padding:18px}.member-card-body h4{font-size:16px}.member-card-body .region,.member-card-body .desc{font-size:13px}.member-card-body .btn-outline{font-size:12px;padding:8px}.steps{grid-template-columns:repeat(2,1fr);gap:25px 16px}.step h4,.step p{font-size:12px}.step-circle{left:0}.testimonial-grid{grid-template-columns:1fr;gap:12px}.testimonial-card .quote{font-size:13px;min-height:0}.testimonial-author .name{font-size:12px}.cta-banner{grid-template-columns:1fr;padding:30px 22px;min-height:245px;background-position:65% center}.cta-banner::before{background:linear-gradient(90deg,#ff510be6,#ff510b99 65%,#ff510b33)}.cta-banner-handwriting{display:none}.cta-banner-text h2{font-size:26px}.cta-banner-text p{font-size:14px}.btn-white{font-size:12px;padding:12px 18px}.footer{padding:25px 22px}.navbar-phone{font-size:10px}}

/* Dropdown Suchende */
.nav-dropdown { position: relative; }
.nav-dropdown .dropdown-menu {
  display: none; position: absolute; top: 100%; left: 0;
  background: #fff; border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.12);
  list-style: none; padding: 8px 0; min-width: 160px; z-index: 100;
}
.nav-dropdown:hover .dropdown-menu { display: block; }
.nav-dropdown .dropdown-menu li a {
  display: block; padding: 10px 20px; color: #333;
  font-size: 0.9rem; text-decoration: none; white-space: nowrap;
}
.nav-dropdown .dropdown-menu li a:hover { color: var(--orange); background: #fff8f5; }