/* ============================================================================
   assets/seiten/partner.css – Seitenstile aus partner.php
   (Bauauftrag A-2, docs/konzept-meldeweg-foto-zuerst-2026-11-08.md, 08.11.2026).
   Bis dahin standen diese Regeln als <style>-Block in der Seite; verschoben ohne
   Änderung, Reihenfolge wie im Dokument. Tokens (--gold, --fs-md …) kommen aus dem
   einen :root in style.css (Seiten ohne style.css: includes/tokens.php).
   ============================================================================ */

/* ── aus partner.php, bis 08.11.2026 ab Zeile 4491 ── */
/* Tokens (--gold, --green, --cream, --fs-* ...): ein :root in style.css, hier ueber includes/tokens.php (A-2, 08.11.2026) */
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--sans);background:var(--white);color:var(--text);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{text-decoration:none;color:inherit}

/* Nav */

/* Hero */
.hero{position:relative;min-height:60vh;display:flex;align-items:center;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:url('https://images.unsplash.com/photo-1535131749006-b7f58c99034b?w=1920&q=88&fit=crop&crop=top') center/cover}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(160deg,rgba(8,21,16,.88) 0%,rgba(15,45,30,.72) 60%,rgba(8,21,16,.5) 100%)}
.hero-content{position:relative;max-width:1200px;margin:0 auto;padding:6rem 3rem}
.eyebrow{display:inline-block;font-size:.9rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-bottom:.9rem}
.eyebrow-hero{color:var(--gold-lt);border:1px solid rgba(201,168,76,.3);background:rgba(201,168,76,.08);padding:.35rem .9rem;border-radius:99px}
.hero-h1{font-family:var(--serif);font-size:clamp(2.5rem,5vw,4.5rem);font-weight:300;line-height:1.1;color:#fff;margin-bottom:1.25rem}
.hero-h1 em{font-style:italic;color:var(--gold-lt)}
.hero-sub{font-size:1.05rem;font-weight:300;color:rgba(255,255,255,.7);line-height:1.75;max-width:520px;margin-bottom:2rem}
.btn-gold{display:inline-flex;align-items:center;gap:.5rem;padding:.95rem 2rem;background:linear-gradient(135deg,var(--gold),var(--gold-lt));color:var(--midnight);border-radius:99px;font-size:17px;font-weight:700;letter-spacing:.03em;box-shadow:0 4px 22px rgba(201,168,76,.4);transition:all .3s var(--ease)}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 8px 36px rgba(201,168,76,.55)}

/* Benefits */
.benefits{background:var(--cream);padding:7rem 0}
.inner{max-width:1200px;margin:0 auto;padding:0 3rem}
.section-header{text-align:center;max-width:600px;margin:0 auto 4rem}
.s-h2{font-family:var(--serif);font-size:clamp(2rem,3vw,2.8rem);font-weight:400;line-height:1.15;color:var(--text);margin-bottom:.85rem}
.s-h2 em{font-style:italic;color:var(--green)}
.s-sub{font-size:.95rem;color:var(--muted);line-height:1.7}
.benefits-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.benefit-card{background:#fff;border-radius:20px;padding:2rem;box-shadow:0 4px 24px rgba(0,0,0,.07);transition:transform .3s var(--ease),box-shadow .3s}
.benefit-card:hover{transform:translateY(-5px);box-shadow:0 12px 48px rgba(0,0,0,.13)}
.benefit-icon{width:56px;height:56px;background:var(--gold-pale);border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:1.25rem}
.benefit-icon .material-icons{font-size:1.75rem;color:var(--green)}
.benefit-card h3{font-family:var(--serif);font-size:1.25rem;font-weight:500;margin-bottom:.6rem}
.benefit-card p{font-size:.95rem;color:var(--muted);line-height:1.75}

/* How-to */
.howto{background:var(--forest);padding:7rem 0}
.howto-inner{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.howto-text .s-h2{color:#fff}
.howto-text .s-sub{color:rgba(255,255,255,.5);margin-bottom:2rem}
.howto-steps{display:flex;flex-direction:column;gap:1.5rem}
.howto-step{display:flex;gap:1rem;align-items:flex-start}
.step-badge{width:36px;height:36px;background:rgba(201,168,76,.15);border:1px solid rgba(201,168,76,.25);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:1.1rem;color:var(--gold);flex-shrink:0;margin-top:.1rem}
.howto-step h4{font-size:.92rem;font-weight:600;color:#fff;margin-bottom:.25rem}
.howto-step p{font-size:.9rem;color:rgba(255,255,255,.45);line-height:1.65}
.howto-visual{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:2rem;text-align:center}
.howto-visual img{border-radius:12px;width:100%;object-fit:cover;max-height:320px}
/* 07.09.2026 (Beratungsbefund, Mobil 375 px): die Kachel-Spalten waren „1fr 1fr" – ein
   1fr-Track schrumpft nicht unter seine Mindestbreite, und das nicht umbrechbare
   „GOLFANLAGEN" in Versalien mit Laufweite trieb die Seite auf 430 px Breite
   (seitliches Wischen). minmax(0,1fr) lässt die Spalten schrumpfen, min-width:0 die
   Kacheln; unter 640 px stehen die Kacheln untereinander, damit Zahl und Beschriftung
   in voller Größe lesbar bleiben (Lesbarkeit 55+, keine kleinere Schrift). Das Markup
   trug die Spalten bis dahin als Inline-Style und ignorierte diese Klasse – jetzt nicht mehr. */
.howto-visual-stat{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.5rem}
.vs{background:rgba(255,255,255,.06);border-radius:12px;padding:1.25rem;text-align:center;min-width:0}
.vs-num{font-family:var(--serif);font-size:2rem;font-weight:600;color:var(--gold)}
.vs-lbl{font-size:.9rem;color:rgba(255,255,255,.35);letter-spacing:.08em;text-transform:uppercase;margin-top:.2rem;overflow-wrap:anywhere}
@media(max-width:640px){.howto-visual{padding:1.25rem}.howto-visual-stat{grid-template-columns:1fr}}

/* Testimonial */
.testimonial{background:var(--cream);padding:6rem 0}
.t-card{background:#fff;border-radius:20px;padding:3rem;max-width:700px;margin:0 auto;box-shadow:0 4px 32px rgba(0,0,0,.08);text-align:center}
.t-quote{font-family:var(--serif);font-size:1.5rem;font-style:italic;color:var(--text);line-height:1.5;margin-bottom:1.5rem}
.t-quote::before{content:'"';color:var(--gold);font-size:3rem;line-height:0;vertical-align:-.35em;margin-right:.1em}
.t-quote::after{content:'"';color:var(--gold);font-size:3rem;line-height:0;vertical-align:-.35em;margin-left:.1em}
.t-name{font-size:.95rem;color:var(--muted);font-weight:600;letter-spacing:.04em}

/* Flyer Section */
.flyer-section{background:var(--midnight);padding:4rem 0}
.flyer-card{display:flex;align-items:center;gap:2rem;background:rgba(255,255,255,.06);border:1px solid rgba(201,168,76,.25);border-radius:20px;padding:2rem 2.5rem}
.flyer-card-left{display:flex;align-items:center;gap:1.5rem;flex:1;min-width:0}
.flyer-card-icon{width:60px;height:60px;background:rgba(201,168,76,.15);border-radius:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.flyer-card-icon .material-icons{color:var(--gold);font-size:2rem}
.flyer-card-title{font-family:var(--serif);font-size:1.4rem;color:#fff;margin:0 0 .35rem}
.flyer-card-sub{font-size:.88rem;color:rgba(255,255,255,.55);margin:0;line-height:1.5}
.flyer-card-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.75rem;background:var(--gold);color:#fff;border-radius:12px;font-weight:700;font-size:17px;text-decoration:none;white-space:nowrap;transition:opacity .2s;flex-shrink:0}
.flyer-card-btn:hover{opacity:.85}
@media(max-width:700px){.flyer-card{flex-direction:column;text-align:center}.flyer-card-left{flex-direction:column;text-align:center}.flyer-card-btn{width:100%;justify-content:center;white-space:normal;text-align:center;line-height:1.3;padding:.85rem 1rem}}

/* Contact Form */
.contact{background:var(--white);padding:7rem 0}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start}
.contact-info .s-h2{margin-bottom:1rem}
.contact-info p{color:var(--muted);font-size:.92rem;line-height:1.75;margin-bottom:1.5rem}
.contact-check{display:flex;flex-direction:column;gap:.6rem;margin-bottom:2rem}
.cc{display:flex;align-items:flex-start;gap:.6rem;font-size:.88rem;color:var(--text)}
.cc::before{content:'✓';color:var(--gold);font-weight:700;flex-shrink:0;margin-top:.05rem}
.form-card{background:#fff;border:1px solid #eae4d8;border-radius:20px;padding:2.5rem;box-shadow:0 8px 40px rgba(0,0,0,.09)}
.form-card h2{font-family:var(--serif);font-size:1.6rem;font-weight:500;margin-bottom:1.75rem}
.fg{margin-bottom:1.15rem}
.fg label{display:block;font-size:.9rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-bottom:.4rem}
.fg input,.fg textarea{width:100%;padding:.7rem 1rem;border:1.5px solid #e5e7eb;border-radius:10px;font-family:var(--sans);color:var(--text);background:#fafafa;transition:border-color .2s}
.fg input:focus,.fg textarea:focus{outline:none;border-color:var(--green);background:#fff}
.fg textarea{min-height:110px;resize:vertical}
.success-box{background:#d1fae5;border:1px solid #6ee7b7;border-radius:12px;padding:1.25rem;color:#065f46;font-size:.9rem;font-weight:500;text-align:center}
.err-box{background:#fee2e2;border:1px solid #fca5a5;border-radius:10px;padding:.8rem 1rem;color:#991b1b;font-size:.95rem;margin-bottom:1rem;font-weight:600}

@media(max-width:1024px){.benefits-grid{grid-template-columns:1fr 1fr}.howto-inner{grid-template-columns:1fr;gap:3rem}.howto-inner>*{min-width:0}.howto-text .eyebrow{white-space:normal}.contact-grid{grid-template-columns:minmax(0,1fr);gap:3rem}.contact-grid>*{overflow-wrap:break-word;hyphens:auto}}
@media(max-width:640px){.inner{padding:0 1.25rem}.benefits-grid{grid-template-columns:minmax(0,1fr)}.benefit-card{padding:1.5rem 1.25rem;overflow-wrap:break-word;hyphens:auto}.ki-teaser{flex-direction:column;align-items:flex-start!important;padding:1.5rem 1.25rem!important;overflow-wrap:break-word;hyphens:auto}.hero-content{padding:5rem 1.25rem}nav{padding:.9rem 1.25rem}.nav-back{display:none}}

/* ── aus partner.php, bis 08.11.2026 ab Zeile 4601 ── */
/* ── Neue Bausteine der Club-Landingpage (04.08.2026) ───────────────────────
   Bewusst dieselben Tokens wie oben (--gold, --forest, --cream, --serif …) –
   kein zweites Design-System, nur neue Anordnungen. */
.hero-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem .9rem;max-width:560px;margin:0 0 2rem}
.hero-point{display:flex;align-items:flex-start;gap:.5rem;font-size:.95rem;color:rgba(255,255,255,.88);line-height:1.45}
.hero-point .material-icons{font-size:1.15rem;color:var(--gold-lt);flex-shrink:0;margin-top:.05rem}
.hero-ctas{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.btn-ghost{display:inline-flex;align-items:center;gap:.45rem;padding:.9rem 1.6rem;border:1.5px solid rgba(255,255,255,.45);color:#fff;border-radius:99px;font-size:17px;font-weight:600;transition:background .2s,border-color .2s}
.btn-ghost:hover{background:rgba(255,255,255,.12);border-color:#fff}
.hero-portal{margin-top:1.4rem;font-size:.85rem}
.hero-portal a{color:var(--gold-lt);text-decoration:underline;text-underline-offset:3px}

/* Kernaussage – der eine Satz, den ein Clubmanager mitnehmen soll */
.kern{background:var(--gold-pale);padding:2.5rem 0;border-bottom:1px solid rgba(201,168,76,.35)}
.kern-inner{max-width:900px;margin:0 auto;padding:0 3rem;display:flex;gap:1.25rem;align-items:flex-start}
.kern-icon{width:48px;height:48px;background:#fff;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 2px 10px rgba(0,0,0,.06)}
.kern-icon .material-icons{color:var(--green);font-size:1.6rem}
.kern h2{font-size:.9rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--green);margin-bottom:.4rem}
.kern p{font-size:1.05rem;line-height:1.7;color:var(--text);margin:0}

/* Problem */
.problem{background:var(--white);padding:5.5rem 0}
.problem-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;max-width:900px;margin:0 auto}
.problem-item{display:flex;gap:.85rem;align-items:flex-start;background:var(--cream);border-radius:14px;padding:1.15rem 1.25rem;font-size:.95rem;line-height:1.6;color:var(--text)}
.problem-item .material-icons{color:var(--muted);font-size:1.3rem;flex-shrink:0}

/* Aufwandstabelle */
.aufwand{background:var(--cream);padding:5.5rem 0}
.auf-table{width:100%;border-collapse:collapse;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 24px rgba(0,0,0,.07);max-width:760px;margin:0 auto}
.auf-table th,.auf-table td{padding:.95rem 1.1rem;text-align:left;font-size:.95rem;border-bottom:1px solid #f0ece4}
.auf-table thead th{background:var(--forest);color:#fff;font-size:.85rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.auf-table tbody tr:last-child td{border-bottom:none}
.auf-table td:nth-child(2),.auf-table td:nth-child(3),.auf-table th:nth-child(2),.auf-table th:nth-child(3){text-align:center;white-space:nowrap}
.auf-ja{display:inline-flex;align-items:center;gap:.3rem;color:var(--green);font-weight:700}
.auf-nein{color:#9aa8a3}
.auf-uns{display:inline-flex;align-items:center;gap:.3rem;color:var(--gold-ink);font-weight:700}
@media(max-width:620px){
  .auf-table thead{display:none}
  .auf-table,.auf-table tbody,.auf-table tr,.auf-table td{display:block;width:100%}
  .auf-table tr{border-bottom:1px solid #f0ece4;padding:.5rem 0}
  .auf-table tr:last-child{border-bottom:none}
  .auf-table td{border:none;padding:.3rem 1.1rem;text-align:left!important}
  .auf-table td:first-child{font-weight:700;padding-top:.8rem}
  .auf-table td[data-l]::before{content:attr(data-l) ': ';color:var(--muted);font-weight:600}
}

/* Keine Hürden */
.huerden{background:var(--forest);padding:5rem 0}
.huerden .s-h2{color:#fff}
.huerden .s-h2 em{color:var(--gold-lt)}
.huerden-grid{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center;max-width:820px;margin:0 auto}
.huerde{display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.07);border:1px solid rgba(201,168,76,.3);color:#fff;border-radius:99px;padding:.6rem 1.15rem;font-size:.92rem}
.huerde .material-icons{font-size:1.05rem;color:var(--gold-lt)}

/* Beispielansicht Clubportal */
.demo{background:var(--white);padding:5.5rem 0}
.demo-wrap{max-width:520px;margin:0 auto}
.demo-frame{background:#fff;border:1px solid #eae4d8;border-radius:20px;box-shadow:0 8px 40px rgba(0,0,0,.09);overflow:hidden}
.demo-bar{background:var(--midnight);color:rgba(255,255,255,.75);font-size:.8rem;padding:.6rem 1.1rem;display:flex;align-items:center;gap:.5rem}
.demo-body{padding:1.5rem}
.demo-tag{display:inline-block;background:#fff7e0;border:1px solid var(--gold);color:#7a5f12;font-size:.8rem;font-weight:700;padding:.3rem .8rem;border-radius:99px;margin-bottom:1rem}
.demo-field{margin-bottom:.9rem}
.demo-field span{display:block;font-size:.78rem;font-weight:700;color:var(--muted);margin-bottom:.25rem}
.demo-field div{border:1.5px solid #e5e7eb;border-radius:10px;padding:.6rem .8rem;font-size:.9rem;color:var(--text);background:#fafafa}
.demo-btn{width:100%;text-align:center;background:var(--green);color:#fff;border-radius:10px;padding:.75rem;font-size:.92rem;font-weight:700;margin-top:.4rem}

/* FAQ */
.faq{background:var(--cream);padding:5.5rem 0}
.faq-list{max-width:760px;margin:0 auto}
.faq-item{background:#fff;border-radius:14px;margin-bottom:.7rem;box-shadow:0 2px 12px rgba(0,0,0,.05);overflow:hidden}
.faq-item summary{cursor:pointer;padding:1.05rem 1.25rem;font-size:1rem;font-weight:600;color:var(--text);list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'+';color:var(--gold);font-size:1.4rem;font-weight:400;line-height:1;flex-shrink:0}
.faq-item[open] summary::after{content:'−'}
.faq-item summary:focus-visible{outline:3px solid var(--gold);outline-offset:-3px}
.faq-item p{padding:0 1.25rem 1.15rem;font-size:.95rem;line-height:1.75;color:var(--muted);margin:0}

/* Vertrauen */
.trust{background:var(--white);padding:4.5rem 0}
.trust-card{max-width:760px;margin:0 auto;background:var(--cream);border-radius:20px;padding:2.25rem}
.trust-card p{font-size:.95rem;line-height:1.8;color:var(--text);margin-bottom:1.25rem}
.trust-links{display:flex;flex-wrap:wrap;gap:.6rem}
.trust-links a{display:inline-flex;align-items:center;gap:.4rem;max-width:100%;overflow-wrap:anywhere;background:#fff;border:1px solid #e3ddd0;border-radius:99px;padding:.5rem 1rem;font-size:.88rem;font-weight:600;color:var(--green)}
.trust-links a:hover{border-color:var(--green)}

@media(max-width:760px){
  .hero-points{grid-template-columns:1fr}
  .problem-list{grid-template-columns:1fr}
  .kern-inner{padding:0 1.25rem;flex-direction:column;gap:.9rem}
}
/* Wer Bewegung reduziert haben will, bekommt keine (WCAG 2.3.3). */
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}