/* Standort-Landingpages – Haushaltshilfe im Fokus. Light-only, passend zur Live-Seite.
   Marke Grün #059669, Schrift Inter (lokal aus ../fonts/fonts.css). */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root{
  --primary:#059669; --primary-dark:#047857; --primary-light:#d1fae5;
  --accent:#10b981; --text:#1e293b; --text-light:#64748b; --bg:#f8fafc; --white:#fff;
  --shadow:0 1px 3px rgba(0,0,0,.1),0 1px 2px rgba(0,0,0,.06);
  --shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);
  --radius:12px;
}
html{ scroll-behavior:smooth; }
body{ font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--text); background:var(--bg); line-height:1.6; }
img{ max-width:100%; }
a{ color:inherit; }

/* Topbar */
.topbar{ background:var(--primary-dark); color:#fff; text-align:center; font-size:.85rem;
  font-weight:600; padding:.5rem 1rem; line-height:1.4; }
.topbar a{ color:#6ee7b7; font-weight:700; }

/* Nav */
.navbar{ position:sticky; top:0; background:rgba(255,255,255,.95); backdrop-filter:blur(10px);
  border-bottom:1px solid #e2e8f0; z-index:1000; padding:0 1.5rem; }
.navbar-inner{ max-width:1100px; margin:0 auto; display:flex; align-items:center;
  justify-content:space-between; height:68px; }
.logo img{ height:48px; width:auto; display:block; }
.nav-right{ display:flex; align-items:center; gap:1rem; }
.nav-phone{ text-decoration:none; color:var(--text-light); font-weight:600; font-size:.9rem; }
.nav-phone:hover{ color:var(--primary); }
.nav-cta{ background:var(--primary); color:#fff; padding:.5rem 1.1rem; border-radius:50px;
  font-weight:600; text-decoration:none; font-size:.9rem; }
.nav-cta:hover{ background:var(--primary-dark); }

/* Hero */
.hero{ padding:3.5rem 1.5rem 3.75rem; text-align:center; color:#fff;
  background:linear-gradient(135deg,#1f2937 0%,#2d3748 50%,#374151 100%); position:relative; overflow:hidden; }
.hero::after{ content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at 80% 10%,rgba(16,185,129,.18) 0%,transparent 55%); pointer-events:none; }
.hero > *{ position:relative; z-index:1; }
.hero .eyebrow{ text-transform:uppercase; letter-spacing:.08em; font-size:.8rem; font-weight:700;
  color:#6ee7b7; margin-bottom:.75rem; }
.hero h1{ font-size:2.4rem; font-weight:800; letter-spacing:-.02em; margin-bottom:.6rem; text-wrap:balance; }
.hero p{ font-size:1.1rem; max-width:640px; margin:0 auto 1.5rem; opacity:.95; }
.hero-badge{ display:inline-flex; align-items:center; gap:.5rem; background:rgba(16,185,129,.25);
  border:1px solid rgba(16,185,129,.5); color:#6ee7b7; font-size:1rem; font-weight:700;
  padding:.55rem 1.4rem; border-radius:50px; margin-bottom:1.75rem; }
.hero-buttons{ display:flex; gap:.85rem; justify-content:center; flex-wrap:wrap; }
.btn{ display:inline-flex; align-items:center; gap:.5rem; padding:.8rem 1.7rem; border-radius:50px;
  font-size:1rem; font-weight:600; text-decoration:none; transition:transform .2s,box-shadow .2s; border:none; cursor:pointer; }
.btn:hover{ transform:translateY(-2px); box-shadow:var(--shadow-lg); }
.btn-white{ background:#fff; color:var(--primary); }
.btn-outline{ background:transparent; color:#fff; border:2px solid rgba(255,255,255,.6); }
.btn-accent{ background:var(--accent); color:#fff; }

/* Sections */
.section{ padding:4rem 1.5rem; }
.section-inner{ max-width:1000px; margin:0 auto; }
.section h2{ font-size:1.8rem; font-weight:700; text-align:center; margin-bottom:.5rem; text-wrap:balance; }
.section .lead{ text-align:center; color:var(--text-light); max-width:720px; margin:0 auto 2.5rem; }
.prose{ max-width:720px; margin:0 auto; color:var(--text); }
.prose p{ margin-bottom:1rem; }
.prose strong{ color:var(--text); }

/* Cards */
.cards{ display:flex; flex-wrap:wrap; gap:1.25rem; justify-content:center; }
.card{ background:var(--white); border-radius:var(--radius); padding:1.75rem; box-shadow:var(--shadow);
  flex:0 1 calc(50% - .75rem); min-width:250px; transition:transform .2s,box-shadow .2s; }
.card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.card .ico{ font-size:2rem; margin-bottom:.6rem; }
.card h3{ font-size:1.1rem; margin-bottom:.35rem; }
.card p{ color:var(--text-light); font-size:.93rem; }

/* Entlastung band */
.band{ background:var(--primary-light); }
.pricing{ background:var(--white); border-radius:var(--radius); padding:2.25rem; text-align:center;
  border:2px solid var(--accent); max-width:460px; margin:0 auto; }
.pricing .amount{ font-size:2.4rem; font-weight:800; color:var(--primary-dark); line-height:1; }
.pricing .detail{ color:var(--text-light); font-weight:600; font-size:.9rem; margin:.25rem 0 1rem; }
.pricing p{ color:var(--text-light); font-size:.92rem; }

/* FAQ */
.faq{ max-width:760px; margin:0 auto; }
.faq details{ background:var(--white); border-radius:var(--radius); margin-bottom:.7rem; box-shadow:var(--shadow); overflow:hidden; }
.faq summary{ padding:1.1rem 1.4rem; cursor:pointer; font-weight:600; list-style:none;
  display:flex; justify-content:space-between; gap:1rem; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary .plus{ color:var(--primary); font-size:1.3rem; line-height:1; transition:transform .3s; }
.faq details[open] summary .plus{ transform:rotate(45deg); }
.faq .body{ padding:0 1.4rem 1.2rem; color:var(--text-light); font-size:.95rem; }

/* Contact */
.contact{ background:linear-gradient(135deg,#1f2937 0%,#2d3748 100%); color:#fff; text-align:center; }
.contact h2{ color:#fff; }
.contact .lead{ color:#cbd5e1; }
.contact-cta{ display:flex; gap:.85rem; justify-content:center; flex-wrap:wrap; margin-top:1.5rem; }

/* Footer */
.footer{ background:#0f172a; color:#94a3b8; padding:2.5rem 1.5rem 1.5rem; text-align:center; font-size:.9rem; }
.footer a{ color:#6ee7b7; text-decoration:none; }
.footer .addr{ line-height:1.8; margin-bottom:1rem; }
.footer .links{ display:flex; gap:1.25rem; justify-content:center; flex-wrap:wrap; margin-bottom:1rem; }
.footer .links a{ color:#94a3b8; }
.footer .bottom{ border-top:1px solid #1e293b; padding-top:1.25rem; font-size:.8rem; }

/* Draft-Banner (nur im Entwurf; vor Live-Gang entfernen) */
.draft{ background:#fde68a; color:#78350f; text-align:center; font-size:.82rem; font-weight:700;
  padding:.4rem 1rem; }

@media (max-width:700px){
  .hero h1{ font-size:1.9rem; }
  .card{ flex:0 1 100%; }
  .nav-phone{ display:none; }
}
