/* AECdisc® Austria: gemeinsames Stylesheet der Unterseiten. Erzeugt aus index.html (Navigation) + Bausteine für tools/build_pages.py. Nicht von Hand in den Unterseiten stylen. */ :root{ --bg:#ffffff; --gray-50:#f5f5f7; --gray-100:#f2f2f4; --gray-200:#e6e6ea; --gray-300:#d3d3d9; --gray-500:#6e6e76; --gray-700:#4b4b57; --gray-900:#10151e; --disc-d:#b9252b; --disc-i:#feec07; --disc-i-ink:#8a7500; --disc-s:#3ba144; --disc-c:#253675; --ink:#10151e; --brand:var(--ink); --brand-on-dark:rgba(255,255,255,.6); /* Oberfläche neutral, Farbe gehört dem Modell */ --cta:var(--ink); --cta-hover:#2a3340; --radius:20px; --ease:cubic-bezier(.16,.84,.44,1); } *{box-sizing:border-box; margin:0; padding:0;} html{scroll-behavior:smooth; overflow-x:hidden;} body{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; background:var(--bg); color:var(--gray-900); line-height:1.6; -webkit-font-smoothing:antialiased;} img{max-width:100%; display:block;} a{color:inherit;} .wrap{max-width:1080px; margin:0 auto;} h1,h2,h3,h4{font-weight:800; line-height:1.05; letter-spacing:-.04em; text-wrap:balance;} h2{font-size:clamp(34px,5vw,60px); margin-bottom:18px;} h2 em, h1 em{font-style:normal; color:var(--gray-500);} h3{letter-spacing:-.025em;} .eyebrow{display:inline-flex; font-size:14px; font-weight:700; color:var(--gray-500); margin-bottom:14px;} .is-dark{background:var(--ink); color:#fff;} .is-dark h2, .is-dark h3{color:#fff;} .is-dark h2 em{color:rgba(255,255,255,.5);} .is-dark .eyebrow{color:var(--brand-on-dark);} .reveal{opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease);} .reveal.in{opacity:1; transform:none;} .no-js .reveal{opacity:1; transform:none;} /* ---------- NAV ---------- */ header{ position:fixed; top:0; left:0; right:0; z-index:100; display:flex; align-items:center; justify-content:space-between; padding:18px 32px; backdrop-filter:blur(14px); background:rgba(255,255,255,.96); border-bottom:1px solid rgba(0,0,0,0.06); transition:box-shadow .3s; } header.scrolled{box-shadow:0 6px 24px rgba(0,0,0,.05);} .nav-right{display:flex; align-items:center; gap:20px;} .brand{display:flex; text-decoration:none; align-items:center; gap:10px; font-weight:800; font-size:18px; position:relative; padding-right:20px;} .brand::after{content:none;} .brand-logo{height:32px; width:auto;} .brand-name{font-weight:800; white-space:nowrap;} .brand .region{font-size:12px; font-weight:700; color:var(--gray-500); text-transform:uppercase; letter-spacing:.06em;} nav ul{display:flex; gap:4px; list-style:none;} nav a{ position:relative; display:inline-block; padding:8px 14px; border-radius:999px; font-size:14px; font-weight:600; color:var(--gray-700); text-decoration:none; transition:color .2s, background .2s; } nav a:hover{color:var(--gray-900);} nav li{position:relative;} nav li.has-dd > a::after{content:"▾"; font-size:.72em; margin-left:6px; opacity:.5;} .dd{position:absolute; top:100%; left:0; min-width:232px; background:#fff; border:1px solid var(--gray-200); border-radius:14px; box-shadow:0 18px 42px -14px rgba(0,0,0,.2); padding:8px; display:flex; flex-direction:column; gap:2px; opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .18s var(--ease), transform .18s var(--ease), visibility .18s;} .dd::before{content:""; position:absolute; top:-10px; left:0; right:0; height:10px;} nav li.has-dd:hover .dd, nav li.has-dd:focus-within .dd{opacity:1; visibility:visible; transform:translateY(0);} .dd a{display:block; padding:10px 14px; border-radius:9px; font-size:14px; font-weight:600; color:var(--gray-700); white-space:nowrap;} .dd a:hover{background:var(--gray-100); color:var(--gray-900);} .nav-redeem{ font-size:13px; font-weight:700; color:var(--ink); text-decoration:none; padding:8px 14px; border-radius:999px; border:1px solid var(--ink); white-space:nowrap; transition:color .2s, background .2s; } .nav-redeem:hover{background:rgba(16,21,30,.06);} nav a.active{color:var(--gray-900);} nav a.active::after{ content:""; position:absolute; left:14px; right:14px; bottom:2px; height:2px; border-radius:2px; background:linear-gradient(90deg,var(--disc-d),var(--disc-i),var(--disc-s),var(--disc-c)); } .lang-switch{ font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--gray-500); text-decoration:none; padding:6px 4px; transition:color .2s; } .lang-switch:hover{color:var(--gray-900);} .nav-cta{ background:var(--ink); color:#fff; padding:10px 18px; border-radius:999px; font-size:13px; font-weight:700; text-decoration:none; transition:transform .2s, box-shadow .2s, background .2s; } .nav-cta:hover{background:var(--cta-hover); transform:translateY(-2px); box-shadow:0 10px 24px rgba(16,21,30,.25);} .nav-toggle{ display:none; flex-direction:column; justify-content:center; gap:4px; width:34px; height:34px; border:1px solid var(--gray-200); border-radius:10px; background:#fff; cursor:pointer; margin-left:10px; flex-shrink:0; } .nav-toggle span{width:16px; height:2px; background:var(--gray-900); margin:0 auto; transition:transform .3s var(--ease), opacity .3s;} .nav-toggle.open span:nth-child(1){transform:translateY(6px) rotate(45deg);} .nav-toggle.open span:nth-child(2){opacity:0;} .nav-toggle.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg);} .mobile-menu{display:none; position:fixed; inset:0; z-index:99; background:#fff; opacity:0; visibility:hidden; transform:translateY(-6px); transition:opacity .26s var(--ease), transform .26s var(--ease), visibility .26s; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain;} .mobile-menu.open{opacity:1; visibility:visible; transform:translateY(0);} .mobile-menu-inner{display:flex; flex-direction:column; min-height:100%; padding:78px 22px 34px;} .mm-group{display:flex; flex-direction:column; padding:12px 0; border-bottom:1px solid var(--gray-200);} .mm-label{font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--gray-500); margin-bottom:4px;} .mm-group a{padding:9px 0 9px 14px; margin-left:1px; font-size:15.5px; font-weight:600; color:var(--gray-900); text-decoration:none; border-left:2px solid var(--gray-200); transition:color .18s, border-color .18s;} .mm-group a:hover, .mm-group a:active{color:var(--ink); border-left-color:var(--ink);} .mm-single{padding:16px 0; font-size:15.5px; font-weight:600; color:var(--gray-900); text-decoration:none; border-bottom:1px solid var(--gray-200);} .mm-actions{display:flex; flex-direction:column; gap:10px; padding-top:18px;} .mm-cta{background:var(--ink); color:#fff; text-align:center; padding:14px; border-radius:12px; font-size:15px; font-weight:700; text-decoration:none;} .mm-redeem{text-align:center; padding:12px; border:1px solid var(--ink); color:var(--ink); border-radius:12px; font-size:14px; font-weight:700; text-decoration:none;} .mm-lang{text-align:center; padding:6px; font-size:12.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--gray-500); text-decoration:none;} @media(max-width:900px){ nav ul{display:none;} .nav-redeem{display:none;} /* wandert auf Mobile ins Hamburger-Menü */ .nav-toggle{display:flex;} .mobile-menu{display:block;} header{padding:12px 20px;} .nav-right{gap:12px;} .brand-logo{height:28px;} .nav-cta{padding:9px 16px; font-size:12.5px;} section[id]{scroll-margin-top:70px;} } @media(max-width:600px){ /* header CTA is redundant on phones (bottom sticky CTA + Kontakt link cover it) and would otherwise overflow the row and get clipped */ .nav-cta{display:none;} } @media(max-width:420px){ header{padding:10px 14px;} .brand{font-size:16px; gap:8px; padding-right:14px;} .brand-logo{height:24px;} } /* ---------- BUTTONS & LINKS ---------- */ .btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:15px 28px; border-radius:999px; font-weight:700; font-size:14.5px; text-decoration:none; cursor:pointer; border:none; transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s;} .btn-primary{background:var(--cta); color:#fff;} .btn-primary:hover{transform:translateY(-2px); background:var(--cta-hover); box-shadow:0 14px 30px rgba(16,21,30,.28);} .btn-light{background:#fff; color:var(--ink);} .btn-light:hover{background:#e9edf3; transform:translateY(-2px);} .btn-outline-light{background:transparent; color:#fff; border:1px solid rgba(255,255,255,.35);} .btn-outline-light:hover{border-color:#fff; background:rgba(255,255,255,.08);} .text-link{display:inline-block; margin-top:20px; font-weight:700; font-size:14.5px; color:var(--ink); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; transition:transform .2s var(--ease);} .text-link:hover{transform:translateX(3px);} .is-dark .text-link{color:#fff;} a:focus-visible, button:focus-visible{outline:2.5px solid var(--cta); outline-offset:2px; border-radius:4px;} .is-dark a:focus-visible, .is-dark button:focus-visible, .ph a:focus-visible{outline-color:#fff;} .skip-link{position:absolute; top:-100px; left:12px; z-index:1000; background:var(--gray-900); color:#fff; padding:12px 20px; border-radius:8px; font-weight:700; font-size:14px; text-decoration:none; transition:top .2s var(--ease);} .skip-link:focus{top:12px;} /* ---------- SEITENKOPF ---------- */ .ph{padding:93px 16px 0;} .ph-panel{position:relative; isolation:isolate; overflow:hidden; max-width:1600px; margin:0 auto; border-radius:28px; background:var(--ink); color:#fff; padding:88px 24px 112px;} .ph-panel::after{content:""; position:absolute; left:0; right:0; bottom:0; height:6px; background:linear-gradient(90deg,var(--disc-d) 0 25%,var(--disc-i) 25% 50%,var(--disc-s) 50% 75%,var(--disc-c) 75% 100%);} .ph-photo{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2;} .ph-panel.has-photo::before{content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(16,21,30,.92) 0%,rgba(16,21,30,.78) 45%,rgba(16,21,30,.35) 100%);} .ph-grid{display:grid; grid-template-columns:minmax(0,1fr); gap:56px; align-items:center;} .ph-grid.has-aside{grid-template-columns:minmax(0,7fr) minmax(0,5fr);} .crumbs{display:flex; gap:8px; font-size:13px; color:rgba(255,255,255,.6); margin-bottom:28px;} .crumbs a{color:inherit; text-decoration:none;} .crumbs a:hover{color:#fff;} .ph .eyebrow{color:var(--brand-on-dark);} .ph h1{font-size:clamp(42px,6.4vw,84px); color:#fff; letter-spacing:-.045em; line-height:1;} .ph h1 em{color:rgba(255,255,255,.5);} .ph-lead{margin-top:26px; max-width:56ch; font-size:clamp(17px,1.6vw,20px); line-height:1.55; color:rgba(255,255,255,.76);} .ph-actions{display:flex; flex-wrap:wrap; gap:14px; margin-top:36px;} .ph-aside svg{display:block; width:100%; max-width:400px; margin:0 auto;} @media(max-width:900px){ .ph{padding-top:69px;} .ph-grid.has-aside{grid-template-columns:minmax(0,1fr);} .ph-aside{max-width:340px;} } @media(max-width:600px){ .ph{padding:64px 10px 0;} .ph-panel{border-radius:20px; padding:56px 18px 80px;} .ph h1{font-size:40px;} } /* ---------- ABSCHNITTE ---------- */ .sec{padding:120px 24px;} .sec.gray{background:var(--gray-50);} /* Kopf: Überschrift, darunter der Text (nicht daneben) */ .sec-head{max-width:860px; margin-bottom:56px;} .sec-head h2{margin:0 0 18px;} .sec-head.solo h2{margin:0;} .sec-head p{color:var(--gray-700); font-size:17px; max-width:58ch;} .is-dark .sec-head p{color:rgba(255,255,255,.72);} .note{margin-top:32px; max-width:70ch; font-size:15px; color:var(--gray-700);} .is-dark .note{color:rgba(255,255,255,.72);} .note strong{color:var(--gray-900);} @media(max-width:860px){ .sec{padding:84px 20px;} .sec-head{margin-bottom:40px;} } /* Wortzeilen */ .rows{border-top:2px solid var(--ink);} .row{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:32px; align-items:start; padding:26px 0; border-bottom:1px solid var(--gray-200);} .row-text{padding-top:6px;} .row-title{font-size:clamp(24px,3vw,38px); font-weight:800; letter-spacing:-.04em; line-height:1.08; display:flex; align-items:center; gap:14px;} .row-text{font-size:16px; color:var(--gray-700); max-width:52ch;} .row-text .text-link{margin-top:8px;} .row-dots{display:inline-flex; gap:4px; flex-shrink:0;} .row-dots i{width:12px; height:12px; border-radius:50%; display:block;} .is-dark .rows{border-top-color:#fff;} .is-dark .row{border-bottom-color:rgba(255,255,255,.14);} .is-dark .row-text{color:rgba(255,255,255,.72);} @media(max-width:760px){ .row{grid-template-columns:minmax(0,1fr); gap:6px; padding:18px 0;} } /* Vergleich */ .compare{display:grid; grid-template-columns:1fr 1fr; gap:24px;} .cmp{border-radius:var(--radius); padding:44px 40px; background:#fff; border:1px solid var(--gray-200);} .cmp.hl{background:var(--ink); color:#fff; border-color:var(--ink);} .cmp-num{font-size:clamp(72px,9vw,128px); font-weight:800; letter-spacing:-.06em; line-height:.9;} .cmp-label{font-size:21px; font-weight:800; letter-spacing:-.02em; margin-top:18px;} .cmp-text{font-size:15.5px; color:var(--gray-700); margin-top:6px; max-width:40ch;} .cmp.hl .cmp-text{color:rgba(255,255,255,.72);} @media(max-width:700px){ .compare{grid-template-columns:minmax(0,1fr);} .cmp{padding:32px 26px;} } /* Drei Spalten mit Linie */ .trio{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px;} .trio > div{border-top:2px solid var(--ink); padding-top:24px;} .trio-name{font-size:clamp(26px,3vw,38px); font-weight:800; letter-spacing:-.04em; line-height:1.05;} .trio-text{font-size:16px; color:var(--gray-700); margin-top:10px;} .trio-tag{font-size:13px; font-weight:700; color:var(--gray-500); margin-bottom:8px;} @media(max-width:760px){ .trio{grid-template-columns:minmax(0,1fr); gap:28px;} } /* Zweispaltig: Text + Medium */ .split{display:grid; grid-template-columns:minmax(0,6fr) minmax(0,5fr); gap:80px; align-items:start;} .split.media-left{grid-template-columns:minmax(0,5fr) minmax(0,6fr);} .split-text p{font-size:17px; color:var(--gray-700); margin-bottom:18px; max-width:60ch;} .is-dark .split-text p{color:rgba(255,255,255,.75);} .split-media{margin:0; border-radius:var(--radius); overflow:hidden;} .split-media img{width:100%; height:100%; object-fit:cover; aspect-ratio:4/5;} @media(max-width:900px){ .split, .split.media-left{grid-template-columns:minmax(0,1fr); gap:40px;} .split-media img{aspect-ratio:16/10;} } /* Aussagen */ .stmt{padding:28px 0; border-bottom:1px solid var(--gray-200);} .stmt:first-child{padding-top:0;} .stmt:last-child{border-bottom:0;} .stmt h3{font-size:clamp(24px,2.6vw,32px); margin-bottom:10px;} .stmt p{color:var(--gray-700); font-size:16px; max-width:56ch;} .is-dark .stmt{border-bottom-color:rgba(255,255,255,.14);} .is-dark .stmt p{color:rgba(255,255,255,.72);} /* Eckdaten */ .facts{border-top:2px solid var(--ink);} .facts > div{display:grid; grid-template-columns:minmax(0,2fr) minmax(0,3fr); gap:20px; padding:18px 0; border-bottom:1px solid var(--gray-200);} .facts dt{font-size:14px; font-weight:700; color:var(--gray-500);} .facts dd{font-size:17px; font-weight:800; letter-spacing:-.02em;} .facts-card{background:var(--gray-50); border-radius:var(--radius); padding:32px;} /* Häkchenliste */ .checks{list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:0 48px; border-top:2px solid var(--ink);} .checks li{position:relative; padding:18px 0 18px 38px; border-bottom:1px solid var(--gray-200); font-size:17px; font-weight:700; letter-spacing:-.01em;} .checks li::before{content:""; position:absolute; left:0; top:19px; width:24px; height:24px; border-radius:50%; background:var(--ink);} .checks li::after{content:""; position:absolute; left:9px; top:24px; width:6px; height:11px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg);} .checks.single{grid-template-columns:minmax(0,1fr);} @media(max-width:760px){ .checks{grid-template-columns:minmax(0,1fr);} } /* Schritte mit Fortschrittslinie (hell) */ .pr-grid{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); gap:80px; align-items:start;} .pr-head{position:sticky; top:130px;} .pr-head p{color:var(--gray-700); font-size:16px; max-width:40ch;} .pr-head .btn{margin-top:24px;} .pr-steps{list-style:none; position:relative; padding-left:40px;} .pr-steps::before, .pr-steps::after{content:""; position:absolute; left:0; top:12px; width:2px; border-radius:2px;} .pr-steps::before{bottom:12px; background:var(--gray-200);} .pr-steps::after{height:calc((100% - 24px) * var(--fill,0)); background:var(--ink);} .pr-step{position:relative; padding:0 0 56px;} .pr-step:last-child{padding-bottom:0;} .pr-step::before{content:""; position:absolute; left:-45px; top:12px; width:12px; height:12px; border-radius:50%; background:#fff; border:2px solid var(--gray-300); transition:border-color .3s, background .3s;} .pr-step.on::before{background:var(--ink); border-color:var(--ink);} .pr-num{display:block; font-size:clamp(48px,5.4vw,68px); font-weight:800; letter-spacing:-.05em; line-height:1; color:transparent; -webkit-text-stroke:1.5px var(--gray-300); transition:color .4s, -webkit-text-stroke-color .4s;} .pr-step.on .pr-num{color:var(--ink); -webkit-text-stroke-color:var(--ink);} .pr-step h3{font-size:clamp(22px,2.4vw,28px); margin:12px 0 6px;} .pr-step p{color:var(--gray-700); font-size:16px; max-width:44ch;} .pr-after{margin-top:48px; padding-top:24px; border-top:1px solid var(--gray-200); color:var(--gray-700); max-width:60ch;} @media(max-width:860px){ .pr-grid{grid-template-columns:minmax(0,1fr); gap:44px;} .pr-head{position:static;} .pr-step{padding-bottom:40px;} } /* Report-Vorschau */ .rp{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); gap:72px; align-items:center;} .rp-visual{position:relative; height:440px;} .rp-page{position:absolute; width:300px; height:410px; background:#fff; border-radius:6px; box-shadow:0 1px 2px rgba(16,21,30,.06), 0 24px 48px -20px rgba(16,21,30,.28); padding:30px 28px;} .rp-back{left:calc(50% - 70px); top:28px; transform:rotate(7deg);} .rp-front{left:calc(50% - 230px); top:0; transform:rotate(-3deg);} .rp-kicker{font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--gray-500);} .rp-title{font-size:30px; font-weight:800; letter-spacing:-.04em; line-height:1; margin-top:10px;} .rp-stripe{display:flex; gap:3px; margin:16px 0 20px;} .rp-stripe i{flex:1; height:4px;} .rp-stripe i:nth-child(1){background:var(--disc-d);} .rp-stripe i:nth-child(2){background:var(--disc-i);} .rp-stripe i:nth-child(3){background:var(--disc-s);} .rp-stripe i:nth-child(4){background:var(--disc-c);} .rp-wheel{width:150px; height:150px; object-fit:contain; margin:0 auto 20px;} .rp-lines{display:flex; flex-direction:column; gap:7px;} .rp-lines i{display:block; height:6px; border-radius:3px; background:var(--gray-100);} .rp-lines i:nth-child(odd){width:92%;} .rp-lines i:last-child{width:60%;} .rp-bars{display:flex; flex-direction:column; gap:10px; margin:120px 0 28px;} .rp-bars span{display:block; height:12px; width:var(--w); border-radius:2px; background:var(--ink); opacity:.8;} .rp-bars span:nth-child(even){background:var(--gray-300);} @media(max-width:900px){ .rp{grid-template-columns:minmax(0,1fr); gap:40px;} .rp-visual{height:380px; max-width:420px; width:100%; margin:0 auto;} .rp-page{width:250px; height:345px; padding:24px 22px;} .rp-back{left:calc(50% - 80px);} .rp-front{left:calc(50% - 170px);} .rp-wheel{width:120px; height:120px;} .rp-bars{margin-top:96px;} } /* ---------- PERSÖNLICHER ABSCHLUSS ---------- */ .pcta{padding:0 16px 96px;} .pcta.after-gray{padding-top:96px; background:linear-gradient(var(--gray-50),var(--gray-50)) top/100% 50% no-repeat;} .pcta-panel{max-width:1600px; margin:0 auto; background:var(--gray-50); color:var(--ink); border-radius:28px; padding:88px 24px;} .pcta.after-gray .pcta-panel{background:#fff; border:1px solid var(--gray-200);} .pcta-grid{display:grid; grid-template-columns:minmax(0,7fr) minmax(0,4fr); gap:64px; align-items:center;} .pcta h2{color:var(--ink); font-size:clamp(32px,4.4vw,56px); margin-bottom:16px;} .pcta h2 em{color:var(--gray-500);} .pcta p{color:var(--gray-700); font-size:17px; max-width:48ch;} .pcta-side{display:flex; flex-direction:column; gap:22px;} .pcta-people{display:flex; align-items:center; gap:14px;} .pcta-avatars{display:flex;} .pcta-avatars img{width:56px; height:56px; border-radius:50%; border:2px solid #fff; object-fit:cover;} .pcta-avatars img + img{margin-left:-14px;} .pcta-people p{font-size:14.5px; font-weight:600; color:var(--ink); line-height:1.45;} .pcta-people a{color:var(--gray-700);} .pcta-people a:hover{color:var(--ink);} .pcta-side .btn{align-self:flex-start;} @media(max-width:860px){ .pcta{padding:0 10px 64px;} .pcta-panel{padding:64px 20px; border-radius:22px;} .pcta-grid{grid-template-columns:minmax(0,1fr); gap:32px;} } /* ---------- FORMULAR (Partnerseite) ---------- */ .form-panel{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:72px; align-items:start;} .analyse-form{text-align:left; display:flex; flex-direction:column; gap:16px; background:var(--ink); color:#fff; border-radius:24px; padding:36px 32px;} .form-title{font-size:20px; font-weight:800; letter-spacing:-.02em;} .form-row{display:flex; flex-direction:column; gap:6px;} .form-grid-2{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:12px;} .analyse-form input, .analyse-form select{min-width:0;} .form-row label{font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.75);} .analyse-form input[type="text"], .analyse-form input[type="email"], .analyse-form input[type="tel"], .analyse-form select{font:inherit; font-size:15px; color:#fff; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); border-radius:10px; padding:12px 14px; width:100%;} .analyse-form select{appearance:none; -webkit-appearance:none; cursor:pointer;} .analyse-form select option{color:#111;} .analyse-form input:focus-visible, .analyse-form select:focus-visible{outline:2.5px solid #fff; outline-offset:1px;} .hp-field{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;} .analyse-form .btn{margin-top:6px; width:100%; padding:17px 28px; font-size:15.5px; background:#fff; color:var(--ink);} .analyse-form .btn:hover{background:#e9edf3;} .form-message{font-size:13.5px; min-height:18px; text-align:center;} .form-message.success{color:#8fe3a3;} .form-message.error{color:#ffb4b0;} .form-note{font-size:12.5px; color:rgba(255,255,255,.55); text-align:center;} .form-note a{color:inherit;} @media(max-width:900px){ .form-panel{grid-template-columns:minmax(0,1fr); gap:44px;} } @media(max-width:600px){ .analyse-form{padding:24px 20px;} } /* ---------- RECHTSTEXTE ---------- */ .legal{max-width:760px; margin:0 auto;} .legal h2{font-size:clamp(22px,2.4vw,28px); letter-spacing:-.03em; margin:44px 0 12px;} .legal p, .legal li{color:var(--gray-700); font-size:16px; margin-bottom:10px;} .legal ul{padding-left:20px;} .legal address{font-style:normal;} .legal address p{margin-bottom:2px;} .legal a{color:var(--ink);} /* ---------- FOOTER ---------- */ .site-footer{padding:88px 24px 40px; color:var(--gray-700); font-size:14.5px;} .ft-grid{display:grid; grid-template-columns:minmax(0,2.2fr) repeat(4,minmax(0,1fr)); gap:40px;} .ft-logo{height:44px; width:auto; margin-bottom:16px;} .ft-brand p{max-width:30ch; color:var(--gray-500);} .ft-col h4{font-size:13px; font-weight:800; letter-spacing:0; color:var(--gray-900); margin-bottom:12px;} .ft-col a{display:block; text-decoration:none; padding:3px 0; color:var(--gray-700);} .ft-col a:hover{color:var(--gray-900); text-decoration:underline; text-underline-offset:3px;} .ft-col p{color:var(--gray-500); margin-bottom:8px;} .ft-bottom{display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-top:56px; padding-top:24px; border-top:1px solid var(--gray-200); font-size:12.5px; color:var(--gray-500);} .ft-bottom p:first-child{max-width:70ch;} .ft-bottom a{color:inherit;} @media(max-width:900px){ .ft-grid{grid-template-columns:1fr 1fr;} .ft-brand{grid-column:1/-1;} } @media(max-width:600px){ .site-footer{padding:64px 20px 32px;} } @media(prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} .reveal{opacity:1; transform:none; transition:none;} .pr-num, .pr-step::before, .btn, .nav-cta{transition:none !important;} } .row-tag{display:block; font-size:13px; font-weight:700; color:var(--gray-500); margin-bottom:4px;} .row-dots i{box-shadow:inset 0 0 0 1px rgba(16,21,30,.12);} .ph-stat{font-size:clamp(110px,14vw,200px); font-weight:800; letter-spacing:-.07em; line-height:.85; color:#fff;} .ph-stat-label{font-size:18px; font-weight:700; color:rgba(255,255,255,.7); margin-top:14px; max-width:20ch;} .ph-wheel{max-width:380px; margin:0 auto; filter:drop-shadow(0 20px 40px rgba(0,0,0,.35));} .ph-grid.has-aside h1{font-size:clamp(40px,5.2vw,72px);} /* Brotkrumen und Footer stehen in