:root { --navy:#183452; --navy-deep:#10253b; --red:#c74736; --red-dark:#a93529; --paper:#f5f2ea; --paper-bright:#fcfbf7; --sand:#e7e0d3; --ink:#1b334c; --muted:#677588; --line:rgba(24,52,82,.22); --serif:'Fraunces', Georgia, serif; --sans:'DM Sans', Arial, sans-serif; --mono:'DM Mono', monospace; }
:root { --navy:#183452; --navy-deep:#10253b; --red:#c74736; --red-dark:#a93529; --paper:#f7f7f4; --paper-bright:#fffefa; --sand:#e9e5dc; --ink:#1b334c; --muted:#566472; --line:rgba(24,52,82,.18); --serif:'Plus Jakarta Sans', Arial, sans-serif; --sans:'Plus Jakarta Sans', Arial, sans-serif; --mono:'DM Mono', monospace; }
.profile-grid { display:grid; grid-template-columns:.75fr 1.25fr; gap:110px; align-items:center; }.profile-card { aspect-ratio:1 / 1.08; max-width:360px; padding:25px; display:flex; flex-direction:column; justify-content:space-between; color:var(--paper); background:var(--navy); box-shadow:9px 9px 0 var(--red); }.profile-card-top,.profile-card-bottom { color:#e69a8e; font:10px/1.4 var(--mono); text-transform:uppercase; }.initials { align-self:center; margin:auto 0; font:600 145px/.8 var(--serif); letter-spacing:-.12em; }.profile-copy h2 { margin-top:18px; font-size:clamp(2.6rem,4.5vw,4.5rem); }.profile-copy > p:not(.eyebrow) { max-width:650px; color:var(--muted); }.credentials { display:flex; flex-wrap:wrap; gap:8px; margin-top:30px; }.credentials span { padding:7px 10px; border:1px solid var(--navy); font:10px var(--mono); }.faq-grid { display:grid; grid-template-columns:.7fr 1.3fr; gap:110px; }.faq-list { border-top:1px solid rgba(245,242,234,.4); }.faq-list details { border-bottom:1px solid rgba(245,242,234,.4); }.faq-list summary { display:flex; justify-content:space-between; gap:20px; padding:21px 0; color:var(--paper); font:500 19px var(--serif); cursor:pointer; list-style:none; }.faq-list summary::-webkit-details-marker { display:none; }.faq-list summary span { color:#e69a8e; font:25px var(--sans); }.faq-list details[open] summary span { transform:rotate(45deg); }.faq-list details p { max-width:650px; margin:0 30px 24px 0; color:#c2cbd2; font-size:14px; }.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:120px; }.contact-copy h2 { margin-top:18px; font-size:clamp(2.7rem,5vw,5rem); }.contact-copy > p:not(.eyebrow) { max-width:520px; margin-top:26px; color:var(--muted); }.contact-person { font-size:13px !important; line-height:1.8; }.contact-person a { color:var(--red); font-weight:700; }.contact-form { display:flex; flex-direction:column; padding:33px; background:var(--sand); border:1px solid var(--navy); }.contact-form label { margin-top:16px; color:var(--navy); font:11px var(--mono); }.contact-form label:first-child { margin-top:0; }.contact-form input,.contact-form textarea { width:100%; padding:10px 0; margin-top:5px; color:var(--navy); background:transparent; border:0; border-bottom:1px solid var(--navy); border-radius:0; outline:none; font:16px var(--sans); resize:vertical; }.contact-form input:focus,.contact-form textarea:focus { border-bottom:2px solid var(--red); }.contact-form .button { align-self:flex-start; margin-top:27px; }.form-status { min-height:22px; margin:10px 0 0; color:var(--red); font-size:12px; }.site-footer { padding:52px 0; color:var(--paper); background:var(--navy-deep); }.footer-grid { display:grid; grid-template-columns:1fr 1fr 2fr; gap:30px; }.logo-light { color:var(--paper); }.site-footer p { margin:0; font-size:13px; }.site-footer small { color:#abb8c1; font-size:10px; }.site-footer nav { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:18px; }.site-footer nav a { font:11px var(--mono); text-decoration:none; }.site-footer nav a:hover { color:#e69a8e; }
.profile-grid { display:grid; grid-template-columns:.75fr 1.25fr; gap:110px; align-items:center; }.profile-card { position:relative; aspect-ratio:1 / 1.08; max-width:360px; overflow:hidden; color:var(--paper); background:var(--navy); box-shadow:9px 9px 0 var(--red); }.profile-card img { display:block; width:100%; height:100%; object-fit:cover; object-position:center top; filter:saturate(.8); }.profile-card:after { position:absolute; inset:0; content:''; background:linear-gradient(180deg,rgba(16,37,59,.08) 55%,rgba(16,37,59,.72)); pointer-events:none; }.profile-card-bottom { position:absolute; z-index:1; bottom:25px; left:25px; color:#e69a8e; font:10px/1.4 var(--mono); text-transform:uppercase; }.profile-copy h2 { margin-top:18px; font-size:clamp(2.6rem,4.5vw,4.5rem); }.profile-copy > p:not(.eyebrow) { max-width:650px; color:var(--muted); }.credentials { display:flex; flex-wrap:wrap; gap:8px; margin-top:30px; }.credentials span { padding:7px 10px; border:1px solid var(--navy); font:10px var(--mono); }.faq-grid { display:grid; grid-template-columns:.7fr 1.3fr; gap:110px; }.faq-list { border-top:1px solid rgba(245,242,234,.4); }.faq-list details { border-bottom:1px solid rgba(245,242,234,.4); }.faq-list summary { display:flex; justify-content:space-between; gap:20px; padding:21px 0; color:var(--paper); font:500 19px var(--serif); cursor:pointer; list-style:none; }.faq-list summary::-webkit-details-marker { display:none; }.faq-list summary span { color:#e69a8e; font:25px var(--sans); }.faq-list details[open] summary span { transform:rotate(45deg); }.faq-list details p { max-width:650px; margin:0 30px 24px 0; color:#c2cbd2; font-size:14px; }.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:120px; }.contact-copy h2 { margin-top:18px; font-size:clamp(2.7rem,5vw,5rem); }.contact-copy > p:not(.eyebrow) { max-width:520px; margin-top:26px; color:var(--muted); }.contact-person { font-size:13px !important; line-height:1.8; }.contact-person a { color:var(--red); font-weight:700; }.contact-form { display:flex; flex-direction:column; padding:33px; background:var(--sand); border:1px solid var(--navy); }.contact-form label { margin-top:16px; color:var(--navy); font:11px var(--mono); }.contact-form label:first-child { margin-top:0; }.contact-form input,.contact-form textarea { width:100%; padding:10px 0; margin-top:5px; color:var(--navy); background:transparent; border:0; border-bottom:1px solid var(--navy); border-radius:0; outline:none; font:16px var(--sans); resize:vertical; }.contact-form input:focus,.contact-form textarea:focus { border-bottom:2px solid var(--red); }.contact-form .button { align-self:flex-start; margin-top:27px; }.form-status { min-height:22px; margin:10px 0 0; color:var(--red); font-size:12px; }.site-footer { padding:52px 0; color:var(--paper); background:var(--navy-deep); }.footer-grid { display:grid; grid-template-columns:1fr 1fr 2fr; gap:30px; }.logo-light { color:var(--paper); }.site-footer p { margin:0; font-size:13px; }.site-footer small { color:#abb8c1; font-size:10px; }.site-footer nav { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:18px; }.site-footer nav a { font:11px var(--mono); text-decoration:none; }.site-footer nav a:hover { color:#e69a8e; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--paper); font:400 16px/1.65 var(--sans); -webkit-font-smoothing:antialiased; } a { color:inherit; } .container { width:min(1180px, calc(100% - 72px)); margin:0 auto; } .skip-link { position:absolute; top:-100px; left:20px; z-index:20; padding:10px 15px; color:#fff; background:var(--navy); }.skip-link:focus { top:20px; }
.utility-bar { color:var(--paper); background:var(--navy); font:10px var(--mono); letter-spacing:.08em; text-transform:uppercase; }.utility-inner { display:flex; justify-content:space-between; padding:8px 0; }.site-header { position:sticky; top:0; z-index:10; background:rgba(245,242,234,.96); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }.nav-wrap { display:flex; align-items:center; min-height:80px; gap:30px; }.logo { color:var(--navy); font:700 33px/1 var(--serif); letter-spacing:-.07em; text-decoration:none; }.logo span { color:var(--red); }.main-nav { display:flex; gap:28px; margin-left:auto; }.main-nav a,.header-cta { font-size:12px; font-weight:700; text-decoration:none; }.main-nav a:hover,.main-nav a:focus-visible { color:var(--red); }.header-cta { padding:11px 14px; color:#fff; background:var(--navy); }.header-cta span { color:#e69a8e; font-size:16px; }.menu-button { display:none; width:44px; height:44px; margin-left:auto; background:transparent; border:1px solid var(--navy); cursor:pointer; }.menu-button span { display:block; width:18px; height:2px; margin:5px auto; background:var(--navy); transition:transform .2s; }.menu-button[aria-expanded=true] span:first-child { transform:translateY(3.5px) rotate(45deg); }.menu-button[aria-expanded=true] span:last-child { transform:translateY(-3.5px) rotate(-45deg); }.mobile-nav { display:none; flex-direction:column; border-top:1px solid var(--line); }.mobile-nav a { padding:14px 36px; border-bottom:1px solid var(--line); font-size:13px; font-weight:700; text-decoration:none; }
.hero { padding:108px 0 40px; background:var(--paper); }.hero-layout { display:grid; grid-template-columns:1.16fr .84fr; gap:105px; align-items:center; }.eyebrow { display:flex; align-items:center; gap:8px; color:var(--red); font:700 10px var(--mono); letter-spacing:.12em; text-transform:uppercase; }.eyebrow:before { content:''; width:24px; height:2px; background:currentColor; }.eyebrow-light { color:#e69a8e; }h1,h2,h3 { margin:0; color:var(--navy); font-family:var(--serif); font-weight:600; line-height:1.06; letter-spacing:-.045em; overflow-wrap:break-word; hyphens:manual; }h1 { max-width:730px; margin-top:24px; font-size:clamp(3.4rem,6.5vw,6.2rem); }h1 em,h2 em { color:var(--red); font-style:italic; }.hero-text { max-width:620px; margin:30px 0 0; color:#415871; font-size:18px; }.hero-actions { display:flex; align-items:center; gap:24px; margin-top:36px; }.button { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:50px; padding:12px 19px; border:0; border-radius:0; font:700 12px var(--sans); text-decoration:none; cursor:pointer; transition:transform .2s,background .2s,box-shadow .2s; }.button:hover { transform:translate(3px,3px); box-shadow:-3px -3px 0 rgba(24,52,82,.2); }.button-red { color:#fff; background:var(--red); }.button-red:hover { background:var(--red-dark); }.button span { color:#ffd0c7; font-size:17px; }.quiet-link { border-bottom:1px solid var(--red); padding-bottom:4px; font-size:12px; font-weight:700; text-decoration:none; }.quiet-link span { margin-left:7px; color:var(--red); font-size:17px; }.hero-panel { position:relative; min-height:440px; padding:25px; color:var(--paper); background:var(--navy); box-shadow:10px 10px 0 var(--red); transform:rotate(1.5deg); }.panel-label { color:#e69a8e; font:10px var(--mono); letter-spacing:.14em; }.panel-rule { height:1px; margin-top:23px; background:rgba(245,242,234,.45); }.panel-quote { max-width:370px; margin:95px 0 0; font:500 clamp(2.3rem,4vw,4rem)/1.03 var(--serif); letter-spacing:-.045em; overflow-wrap:break-word; }.panel-bottom { position:absolute; bottom:26px; left:25px; right:25px; display:flex; justify-content:space-between; padding-top:13px; border-top:1px solid rgba(245,242,234,.45); color:#d0d8de; font:11px var(--mono); }.panel-stamp { position:absolute; right:21px; top:48%; padding:8px; color:var(--red); border:2px solid var(--red); font:700 12px/1.1 var(--mono); transform:rotate(-8deg); }.hero-footer { display:flex; align-items:center; gap:10px; margin-top:73px; color:var(--muted); font:10px var(--mono); text-transform:uppercase; }.red-marker { width:8px; height:8px; background:var(--red); border-radius:50%; }.hero-line { height:1px; flex:1; margin:0 15px; background:var(--line); }
section { padding:125px 0; }.section-light { background:var(--paper); border-top:1px solid var(--line); }.section-paper { background:var(--paper-bright); border-top:1px solid var(--line); }.section-sand { background:var(--sand); border-top:1px solid var(--line); }.section-navy { color:var(--paper); background:var(--navy); }.section-intro { max-width:620px; }.section-intro h2 { margin-top:18px; font-size:clamp(2.8rem,5vw,5rem); }.section-intro > p:last-child { max-width:540px; margin:26px 0 0; color:var(--muted); }.section-navy h2 { color:var(--paper); }.section-navy .section-intro > p:last-child { color:#bec8d0; }.problem-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:68px; }.problem-item { padding:25px; border:1px solid var(--navy); min-height:265px; }.item-number { color:var(--red); font:26px var(--serif); }.problem-item h3 { margin-top:52px; font-size:25px; }.problem-item p { margin:14px 0 0; color:var(--muted); font-size:14px; line-height:1.55; }
.entry-list { margin-top:68px; border-top:1px solid var(--navy); }.entry-card { position:relative; display:grid; grid-template-columns:1fr 1.45fr 1.25fr auto; gap:35px; align-items:center; padding:29px 0; border-bottom:1px solid var(--line); }.entry-card-featured { padding-right:220px; }.entry-meta { display:flex; align-items:center; gap:16px; }.entry-meta span { color:var(--red); font:600 30px var(--serif); }.entry-meta p { margin:0; font:10px var(--mono); letter-spacing:.07em; text-transform:uppercase; }.entry-card h3 { font-size:25px; }.entry-card > p:not(.entry-meta p) { margin:0; color:var(--muted); font-size:13px; line-height:1.5; }.entry-link { white-space:nowrap; color:var(--red); font-size:11px; font-weight:700; text-decoration:none; }.entry-link span { font-size:17px; }.criteria-note { position:absolute; right:0; top:22px; display:flex; align-items:center; gap:8px; color:var(--red); }.criteria-note strong { font:600 45px/1 var(--serif); }.criteria-note span { font:10px/1.2 var(--mono); text-transform:uppercase; }
.approach { overflow:hidden; }.approach-head { display:grid; grid-template-columns:1fr 1fr; column-gap:90px; }.approach-head .eyebrow { grid-column:1 / -1; }.approach-head h2 { margin-top:20px; font-size:clamp(2.8rem,5vw,5rem); }.approach-head > p:last-child { align-self:end; max-width:450px; margin:0 0 5px; color:#c2cbd2; font-size:16px; }.approach-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:48px; margin-top:80px; }.approach-block { padding-top:18px; border-top:1px solid rgba(245,242,234,.4); }.approach-block > span { color:#e69a8e; font:11px var(--mono); }.approach-block h3 { margin-top:22px; color:var(--paper); font-size:25px; }.approach-block p { color:#c2cbd2; font-size:14px; }
.practice-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:120px; }.practice-list { display:grid; grid-template-columns:1fr 1fr; column-gap:35px; row-gap:33px; }.practice-list > div { padding-top:14px; border-top:2px solid var(--navy); }.practice-list span { color:var(--red); font:700 11px var(--mono); text-transform:uppercase; }.practice-list p { margin:12px 0 0; color:var(--muted); font-size:13px; line-height:1.55; }.evidence-grid { display:grid; grid-template-columns:.7fr 1.3fr; gap:115px; align-items:center; }.evidence-note { padding:25px; border:1px solid var(--navy); box-shadow:7px 7px 0 var(--red); }.big-mark { display:block; margin-top:55px; color:var(--navy); font:600 100px/.8 var(--serif); letter-spacing:-.09em; }.big-mark span { color:var(--red); font-size:50px; }.evidence-note > p:last-child { margin:34px 0 0; max-width:180px; font:11px/1.5 var(--mono); text-transform:uppercase; }.evidence-copy h2 { font-size:clamp(2.5rem,4.6vw,4.5rem); }.evidence-copy > p { max-width:650px; margin:26px 0; color:var(--muted); }.evidence-chain { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:30px 0; color:var(--navy); font:11px var(--mono); }.evidence-chain span { padding:8px 10px; border:1px solid var(--navy); }.evidence-chain i { color:var(--red); font-style:normal; }.profile-grid { display:grid; grid-template-columns:.75fr 1.25fr; gap:110px; align-items:center; }.profile-card { aspect-ratio:1 / 1.08; max-width:360px; padding:25px; display:flex; flex-direction:column; justify-content:space-between; color:var(--paper); background:var(--navy); box-shadow:9px 9px 0 var(--red); }.profile-card-top,.profile-card-bottom { color:#e69a8e; font:10px/1.4 var(--mono); text-transform:uppercase; }.initials { align-self:center; margin:auto 0; font:600 145px/.8 var(--serif); letter-spacing:-.12em; }.profile-copy h2 { margin-top:18px; font-size:clamp(2.6rem,4.5vw,4.5rem); }.profile-copy > p:not(.eyebrow) { max-width:650px; color:var(--muted); }.credentials { display:flex; flex-wrap:wrap; gap:8px; margin-top:30px; }.credentials span { padding:7px 10px; border:1px solid var(--navy); font:10px var(--mono); }.faq-grid { display:grid; grid-template-columns:.7fr 1.3fr; gap:110px; }.faq-list { border-top:1px solid rgba(245,242,234,.4); }.faq-list details { border-bottom:1px solid rgba(245,242,234,.4); }.faq-list summary { display:flex; justify-content:space-between; gap:20px; padding:21px 0; color:var(--paper); font:500 19px var(--serif); cursor:pointer; list-style:none; }.faq-list summary::-webkit-details-marker { display:none; }.faq-list summary span { color:#e69a8e; font:25px var(--sans); }.faq-list details[open] summary span { transform:rotate(45deg); }.faq-list details p { max-width:650px; margin:0 30px 24px 0; color:#c2cbd2; font-size:14px; }.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:120px; }.contact-copy h2 { margin-top:18px; font-size:clamp(2.7rem,5vw,5rem); }.contact-copy > p:not(.eyebrow) { max-width:520px; margin-top:26px; color:var(--muted); }.contact-person { font-size:13px !important; line-height:1.8; }.contact-person a { color:var(--red); font-weight:700; }.contact-form { display:flex; flex-direction:column; padding:33px; background:var(--sand); border:1px solid var(--navy); }.contact-form label { margin-top:16px; color:var(--navy); font:11px var(--mono); }.contact-form label:first-child { margin-top:0; }.contact-form input,.contact-form textarea { width:100%; padding:10px 0; margin-top:5px; color:var(--navy); background:transparent; border:0; border-bottom:1px solid var(--navy); border-radius:0; outline:none; font:16px var(--sans); resize:vertical; }.contact-form input:focus,.contact-form textarea:focus { border-bottom:2px solid var(--red); }.contact-form .button { align-self:flex-start; margin-top:27px; }.form-status { min-height:22px; margin:10px 0 0; color:var(--red); font-size:12px; }.site-footer { padding:52px 0; color:var(--paper); background:var(--navy-deep); }.footer-grid { display:grid; grid-template-columns:1fr 1fr 2fr; gap:30px; }.logo-light { color:var(--paper); }.site-footer p { margin:0; font-size:13px; }.site-footer small { color:#abb8c1; font-size:10px; }.site-footer nav { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:18px; }.site-footer nav a { font:11px var(--mono); text-decoration:none; }.site-footer nav a:hover { color:#e69a8e; }
.reveal { animation:rise .7s both; }.reveal-late { animation-delay:.15s; }@keyframes rise { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }:focus-visible { outline:3px solid #e69a8e; outline-offset:4px; }@media (max-width:900px) { .container { width:min(100% - 40px, 640px); }.main-nav,.header-cta { display:none; }.menu-button { display:block; }.mobile-nav.open { display:flex; }.hero { padding-top:75px; }.hero-layout,.practice-grid,.evidence-grid,.profile-grid,.faq-grid,.contact-grid { grid-template-columns:1fr; gap:55px; }.hero-panel { max-width:none; margin:0; }.problem-grid,.approach-grid { grid-template-columns:1fr; gap:15px; }.entry-card { grid-template-columns:1fr; gap:15px; }.entry-card-featured { padding-right:0; }.criteria-note { position:static; order:5; }.entry-link { white-space:normal; }.approach-head { display:block; }.approach-head > p:last-child { margin-top:25px; }.practice-list { gap:25px; }.profile-card { max-width:400px; }.footer-grid { grid-template-columns:1fr 1fr; }.site-footer nav { grid-column:1 / -1; justify-content:flex-start; } }
@media (max-width:540px) { .utility-inner { font-size:10px; }.utility-inner span:last-child { text-align:right; }.container { width:calc(100% - 36px); }.hero { padding-top:60px; }.hero-text { font-size:16px; }.hero-actions { flex-direction:column; align-items:flex-start; gap:17px; }.hero-panel { min-height:370px; padding:19px; box-shadow:6px 6px 0 var(--red); }.panel-quote { margin-top:70px; }.panel-bottom { left:19px; right:19px; bottom:19px; font-size:11px; }.hero-footer { flex-wrap:wrap; margin-top:49px; font-size:10px; }.hero-line { display:none; }section { padding:82px 0; }.section-intro h2 { font-size:2.8rem; }.problem-item { min-height:230px; }.problem-item h3 { margin-top:36px; font-size:22px; }.entry-card h3 { font-size:24px; }.practice-list { grid-template-columns:1fr; }.big-mark { font-size:85px; }.evidence-chain { align-items:flex-start; }.evidence-chain i { display:none; }.profile-grid { gap:40px; }.profile-card,.profile-copy,.evidence-note,.evidence-copy { min-width:0; max-width:100%; }.profile-card { width:100%; }.faq-list summary { font-size:17px; }.contact-grid { gap:40px; }.contact-form { padding:24px; }.footer-grid { grid-template-columns:1fr; }.site-footer nav { grid-column:auto; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.reveal { animation:none; }.button,.menu-button span { transition:none; } }
.button-outline{color:var(--navy);background:transparent;border:1px solid var(--navy)}
.button-outline:hover{color:#fff;background:var(--navy)}
.button-outline span{color:var(--red)}

/* --- Kontaktformular: Consent & Honeypot --- */
.label-optional { color:var(--muted); text-transform:none; }
.contact-form .form-consent { display:flex; align-items:flex-start; gap:11px; margin-top:22px; }
.contact-form .form-consent input[type="checkbox"] { flex:0 0 auto; width:18px; height:18px; margin-top:2px; padding:0; border:1px solid var(--navy); accent-color:var(--red); cursor:pointer; }
.contact-form .form-consent label { margin-top:0; color:var(--navy); font:12px/1.5 var(--sans); }
.contact-form .form-consent a { color:var(--red); font-weight:700; }
.form-hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* --- Hero: Nutzen-Box, Vertrauenszeile, Reihenfolge --- */
.eyebrow { text-transform:uppercase; }
.hero-panel { display:flex; flex-direction:column; }
.panel-label { text-transform:uppercase; }
.panel-benefits { list-style:none; margin:auto 0; padding:0; }
.panel-benefits li { margin-top:24px; color:#fff; font:600 clamp(1.9rem,2.9vw,2.6rem)/1.08 var(--serif); letter-spacing:-.03em; }
.panel-benefits li:first-child { margin-top:0; }
.hero-panel { transform:none; padding:42px 40px; }
.hero-lower { margin-top:52px; }
.hero-trust { margin:0; color:var(--muted); font:12px/1.6 var(--mono); letter-spacing:.03em; }
.hero-lower .hero-actions { margin-top:26px; }
@media (max-width:540px) { .hero-lower { margin-top:38px; } .hero-trust { font-size:11px; } .hero-panel { min-height:0; } .panel-benefits { margin-top:38px; } }

.entry-body{display:flex;flex-direction:column;gap:9px}.entry-body>p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}.entry-proof{color:var(--red);font:11px var(--mono);letter-spacing:.04em;text-transform:uppercase}.entry-proof strong{font:600 15px var(--serif);letter-spacing:0;margin-right:3px}

.problem-item{display:block;text-decoration:none;color:inherit;position:relative;transition:box-shadow .18s ease,background .18s ease}.problem-item:hover{box-shadow:7px 7px 0 var(--red);background:var(--paper-bright)}.problem-item::after{content:"\2197";position:absolute;right:22px;top:24px;color:var(--red);font-size:22px;line-height:1;opacity:.5;transition:opacity .18s ease,transform .18s ease}.problem-item:hover::after{opacity:1;transform:translate(2px,-2px)}

.entry-card{text-decoration:none;color:inherit;transition:background .18s ease}.entry-card:hover{background:rgba(24,52,82,.04)}.entry-link span{display:inline-block;transition:transform .18s ease}.entry-card:hover .entry-link span{transform:translateX(4px)}

.contact-form select{width:100%;padding:10px 0;margin-top:5px;color:var(--navy);background:transparent;border:0;border-bottom:1px solid var(--navy);border-radius:0;outline:none;font:16px var(--sans)}.contact-form select:focus{border-bottom:2px solid var(--red)}

[id]{scroll-margin-top:100px}
.problem-item:focus-visible{box-shadow:7px 7px 0 var(--red);background:var(--paper-bright)}.problem-item:focus-visible::after{opacity:1;transform:translate(2px,-2px)}.entry-card:focus-visible{background:rgba(24,52,82,.05)}.entry-card:focus-visible .entry-link span{transform:translateX(4px)}

/* Mobil: Hero-Box unter den CTA verschieben (Desktop unberührt) */
@media (max-width:900px){.hero{display:flex;flex-direction:column}.hero-layout{display:contents}.hero-copy{order:1;width:min(100% - 40px,640px);margin:0 auto}.hero-lower{order:2}.hero-panel{order:3;width:min(100% - 40px,640px);margin:52px auto 0}.hero-footer{order:4}}
@media (max-width:540px){.hero-copy,.hero-panel{width:calc(100% - 36px)}}

/* Startseiten-Hero: H1 eine Stufe kleiner (31.08.2026) */
.hero .hero-copy h1{font-size:clamp(2.9rem,5.4vw,5.2rem);}
@media (max-width:540px){.hero .hero-copy h1{font-size:2.6rem;}}

/* ==== Sektion „Drei Ausgangssituationen" — Klickbarkeit & Führung (31.08.2026) ==== */
/* Ziel: Die Zeilen sollen im Ruhezustand als begehbare Einstiege lesbar sein,
   nicht erst beim Hover. Tabellenform bleibt (bewusste Abgrenzung zum
   Kachelraster darüber) — verstärkt werden Aktionsanker, Zeilenfläche und Hover. */

/* Überschrift eine Stufe kleiner (längere Frage-Headline) + mehr Satzbreite */
.entries .entries-intro { max-width: 880px; }
.entries .entries-intro h2 { font-size: clamp(2.1rem, 3.6vw, 3.5rem); }
.entries .entries-intro > p:last-child { max-width: 720px; }

/* Zeilenraster: mehr Platz für die Beschreibung, gemeinsame Oberkante */
.entry-list { margin-top: 56px; }
.entry-card {
  grid-template-columns: .88fr 1.45fr 1.32fr auto;
  gap: 34px;
  align-items: start;
  padding: 34px 0;
  cursor: pointer;
  transition: background .18s ease;
}
.entry-card:last-child { border-bottom: 1px solid var(--navy); }

/* Rote Markierung links in der Spaltengasse — Zeile bleibt auf der Satzachse */
.entry-card::before {
  content: '';
  position: absolute;
  left: -16px; top: 0; bottom: 0;
  width: 3px;
  background: var(--red);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .18s ease;
}
.entry-card:hover::before,
.entry-card:focus-visible::before { transform: scaleX(1); }

/* Kennung A/B/C + Label als eine Zeile */
.entry-meta { align-items: baseline; gap: 12px; padding-top: 1px; }
.entry-meta span { font-size: 27px; line-height: 1; }
.entry-meta p { line-height: 1.5; }
.entry-meta p::before { content: '· '; }

.entry-card h3 { font-size: 23px; }
.entry-card > p:not(.entry-meta p) { font-size: 13.5px; line-height: 1.55; }

/* Aktionsanker: sichtbarer Button statt Kleinsttext — der eigentliche Fix */
.entry-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  align-self: start;
  justify-self: end;
  margin-top: 2px;
  padding: 12px 15px;
  color: var(--red);
  border: 1px solid var(--red);
  font: 700 11px var(--mono);
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: background .18s ease, color .18s ease;
}
.entry-link span { color: inherit; font-size: 15px; line-height: 1; }

/* Hover/Fokus: ganze Zeile reagiert — Fläche, Marke, Überschrift, Button */
.entry-card:hover { background: rgba(24,52,82,.05); box-shadow: -16px 0 0 rgba(24,52,82,.05), 16px 0 0 rgba(24,52,82,.05); }
.entry-card:hover h3,
.entry-card:focus-visible h3 { color: var(--red); }
.entry-card:hover .entry-link,
.entry-card:focus-visible .entry-link { color: #fff; background: var(--red); }
.entry-card:hover .entry-link span,
.entry-card:focus-visible .entry-link span { transform: translateX(3px); }
.entry-card:focus-visible { background: rgba(24,52,82,.05); box-shadow: -16px 0 0 rgba(24,52,82,.05), 16px 0 0 rgba(24,52,82,.05); outline-offset: 2px; }

@media (max-width:900px) {
  .entry-card { grid-template-columns: 1fr; gap: 14px; padding: 28px 0; }
  .entry-card::before { left: -12px; }
  .entry-card:hover, .entry-card:focus-visible { box-shadow: -12px 0 0 rgba(24,52,82,.05), 12px 0 0 rgba(24,52,82,.05); }
  .entry-link { justify-self: start; }
  .entry-link { white-space: normal; margin-top: 6px; }
}
@media (max-width:540px) {
  .entries .entries-intro h2 { font-size: 2.1rem; }
  .entry-card h3 { font-size: 21px; }
}

/* ==== Hero: Wegweiser-Fokusbox + volle Titelbreite (01.09.2026) ==== */
/* Ersetzt die alte .hero-layout/.hero-copy/.hero-lower-Struktur.
   Titel läuft über die volle Containerbreite in zwei Zeilen; darunter
   zwei Spalten, oben UND unten bündig (Variante C). */

.hero-wide h1 { max-width:none; font-size:clamp(2.9rem, 4.9vw, 4.6rem); }
.hero-wide .hero-row {
  display:grid; grid-template-columns:1.1fr .9fr; gap:96px;
  align-items:stretch; margin-top:44px;
}
.hero-wide .hero-col { display:flex; flex-direction:column; justify-content:space-between; }
.hero-wide .hero-text { max-width:none; margin:0 0 30px; }
.hero-wide .hero-trust { margin:0; }
.hero-wide .hero-actions { margin-top:26px; }
.hero-wide .hero-panel { max-width:none; margin:0; }

/* Farbregel (01.09.2026): Rot gefuellt = die eine Handlung je Ansicht.
   Navy gefuellt = dauerhafte Navigation (nur Header-CTA).
   Outline = Navigation im Inhalt (Angebotssektion).
   Der zweite Hero-Button erfuellte keine der drei Rollen und ist gestrichen. */

/* Fokusbox als Wegweiser */
.panel-routes { list-style:none; margin:8px 0 0; padding:0; }
.panel-routes li { border-top:1px solid rgba(245,242,234,.32); }
.panel-routes li:first-child { border-top:0; }
.panel-routes li:last-child { border-bottom:1px solid rgba(245,242,234,.32); }
.panel-routes a {
  display:flex; align-items:baseline; gap:16px; padding:18px 0;
  color:#fff; text-decoration:none;
  font:600 clamp(1.2rem,1.7vw,1.5rem)/1.15 var(--serif); letter-spacing:-.03em;
  transition:color .18s ease;
}
.panel-routes .rk { flex:0 0 auto; color:#e69a8e; font:600 15px var(--mono); letter-spacing:0; }
.panel-routes .rx { margin-left:auto; color:#e69a8e; font-size:19px; transition:transform .18s ease; }
.panel-routes a:hover, .panel-routes a:focus-visible { color:#ffd0c7; }
.panel-routes a:hover .rx, .panel-routes a:focus-visible .rx { transform:translate(3px,-3px); }

/* Auffangweg: sichtbar, aber kein zweiter Button */
.foot-block { margin-top:26px; padding-top:22px; border-top:2px solid var(--red); }
.foot-q { margin:0; color:#fff; font:600 1.3rem/1.2 var(--serif); letter-spacing:-.03em; }
.foot-link {
  display:inline-flex; align-items:center; gap:9px; margin-top:13px; padding-bottom:5px;
  color:#ffd0c7; border-bottom:2px solid #e69a8e;
  font:700 14px var(--sans); text-decoration:none;
}
.foot-link span { font-size:17px; transition:transform .18s ease; }
.foot-link:hover span, .foot-link:focus-visible span { transform:translate(3px,-3px); }

/* Haltungszeile in der Angebots-Einleitung.
   Hohe Spezifitaet noetig: .section-intro > p:last-child faerbt sonst grau. */
.entries .entries-intro > p:not(.entries-stance) { color:var(--muted); }
.entries .entries-intro p.entries-stance {
  max-width:720px; margin:22px 0 0; color:var(--navy);
  font:600 clamp(1.25rem,1.9vw,1.6rem)/1.25 var(--serif); letter-spacing:-.03em;
}

@media (max-width:900px) {
  .hero { display:block; }
  .hero-wide .hero-row { grid-template-columns:1fr; gap:44px; margin-top:34px; }
  .hero-wide .hero-col { display:block; }
  .hero-wide .hero-trust { margin-top:26px; }
  .hero-panel { order:0; width:auto; max-width:none; margin:0; }
}
@media (max-width:540px) {
  .hero-wide h1 { font-size:2.5rem; }
  .hero-wide .hero-actions { flex-direction:column; align-items:stretch; }
  .hero-wide .hero-actions .button { width:100%; }
}

/* ==== Vertrauenszeile als drei Belege (01.09.2026) ====
   Vorher eine 10px-Monozeile in Grau, also im Kleingedruckten-Format.
   Jetzt drei getrennte Belege mit eigener Oberlinie, in Navy. */
.hero-proof { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin:0; padding:0; list-style:none; }
.hero-proof li { padding-top:12px; border-top:1px solid var(--navy); color:var(--navy); font:12px/1.45 var(--mono); }

/* Mobil: Belege untereinander, H1 eine Stufe kleiner, damit
   "Besser entscheiden." nicht mitten im Wort umbricht. */
@media (max-width:900px) {
  .hero-proof { grid-template-columns:1fr; gap:0; }
  .hero-proof li { padding:11px 0; border-top:1px solid var(--line); }
  .hero-proof li:first-child { border-top:1px solid var(--navy); }
}
@media (max-width:540px) {
  .hero-wide h1 { font-size:2.2rem; }
}

/* ==== Mobile Reihenfolge im Hero (01.09.2026) ====
   Vorher: Text -> Belege -> roter Button -> Auswahlbox. Der Besucher wurde
   also zum Gespraech aufgefordert, bevor er das Angebot gesehen hatte.
   Jetzt: Text -> Belege -> Auswahlbox -> Button. Richtige Commitment-Leiter,
   und das Conversion-Modul rueckt einen Bildschirm nach vorn.
   display:contents loest die linke Spalte auf, damit ihre Kinder
   zu Grid-Elementen werden und einzeln sortierbar sind. */
@media (max-width:900px) {
  .hero-wide .hero-col { display:contents; }
  .hero-wide .hero-row { gap:34px; }
  .hero-wide .hero-text { order:1; margin:0; }
  .hero-wide .hero-proof { order:2; }
  .hero-wide .hero-panel { order:3; }
  .hero-wide .hero-actions { order:4; margin:0; }
}

/* ==== Scroll-Hinweis mobil ausblenden (01.09.2026) ====
   "Scrollen, um den passenden Einstieg zu finden" steht mobil NACH dem
   Auswahlmodul — der Einstieg wurde da schon gezeigt. Am Desktop sitzt der
   Hinweis am unteren Bildschirmrand und funktioniert. Also nur mobil weg;
   die Markenzeile daneben bleibt. */
@media (max-width:900px) {
  .hero-footer span:last-child { display:none; }
  .hero-footer .hero-line { display:none; }
}
