@font-face{font-family:Montserrat;src:url('assets/montserrat.woff2') format('woff2');font-weight:100 900;font-display:swap}
*{box-sizing:border-box}html{scroll-padding-top:24px}body.direction-b.ocean-concept.website-landing{margin:0;background:#0b1012;color:#f5f8f6;font-family:Montserrat,Arial,sans-serif;-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.65}::selection{background:#b8d7c1;color:#122c26}a{color:inherit}button,input,textarea{font:inherit}button{cursor:pointer}img,svg{display:block;max-width:100%}[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:500;line-height:1.15;letter-spacing:-.045em}h1{font-size:clamp(42px,4.65vw,68px);line-height:1.12;letter-spacing:-.052em}h2{font-size:clamp(32px,3.5vw,50px)}h3{font-size:25px;line-height:1.3;letter-spacing:-.035em}p{font-size:17px}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid #a3d2db;outline-offset:5px}input:focus,textarea:focus{outline:2px solid #357a8e;outline-offset:3px}.web-container{width:min(1160px,calc(100% - 80px));margin-inline:auto}.skip-link{position:absolute;z-index:20;top:10px;left:10px;transform:translateY(-160%);background:#e6f0e7;color:#112b25;padding:12px 20px}.skip-link:focus{transform:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.web-header{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-block:28px;position:relative;z-index:2}.web-brand{display:inline-block;flex-shrink:0}.web-brand img{object-fit:contain}.header-contact{border:1px solid #a5c6c645;padding:14px 18px;border-radius:6px;background:#c3dfd50a;color:#f6faf8;transition:background .25s}.header-contact:hover{background:#c3dfd51c}.header-contact .now-wordmark{width:142px;height:auto}
.web-hero{position:relative;isolation:isolate;overflow:hidden;margin-top:-104px;padding:190px 0 140px;min-height:min(850px,96svh);display:flex;align-items:center;justify-content:center}.web-hero .colour-atmosphere{z-index:-1}
.web-hero::before,.web-hero::after{content:"";position:absolute;inset:0;pointer-events:none}
.web-hero::before{z-index:-3;background:#0e2a30 url('assets/website-hero-buero3.webp') center bottom/cover no-repeat}
.web-hero::after{z-index:-2;background:linear-gradient(180deg,#0b101240 0%,#0b101214 45%,#0b101200 62%,#0b101259 86%,#0b1012e6 100%)}
.web-hero{align-items:flex-start;padding-top:150px}
.web-hero .hero-copy h1,.web-hero .hero-lead{text-shadow:0 2px 24px #0b1012b3}.web-hero .hero-lead{color:#d9e5e0}.website-landing .grain-plume::after{opacity:.68}.website-landing .grain-plume::before{opacity:.15}.hero-copy{text-align:center;position:relative}.hero-copy h1{max-width:1000px;margin-inline:auto;text-wrap:balance}.hero-lead{font-size:17px;line-height:1.85;color:#bfcfc9;margin:28px auto 34px;max-width:660px}.hero-assurance{font-size:11px;color:#8fa9a0;margin-top:34px;letter-spacing:.025em}.website-landing .cta-caption{font-size:11px}.scroll-cue{position:absolute;bottom:35px;left:calc(50% - 20px);width:40px;height:40px;display:grid;place-items:center;color:#a4bfb3}.scroll-cue svg{width:20px;fill:none;stroke:currentColor;stroke-width:1.2}
.web-offer,.web-process,.web-faq,.web-enquiry{position:relative;isolation:isolate;overflow:hidden}
.web-offer{background:linear-gradient(118deg,#183d4b,#214347 46%,#294936);padding:94px 0 76px;text-align:center;--grain-light:#8dc8dc;--grain-shade:#8eae89;--grain-strength:.48}
.section-intro{text-align:center;margin:0 auto 52px;max-width:900px}.section-intro>p{margin:22px auto 0;font-size:16px;line-height:1.8;color:#d2e1db;max-width:640px}.web-offer .section-intro h2{font-weight:550}
.offer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:auto}
.offer-item{--card-bg:#286179;position:relative;isolation:isolate;overflow:hidden;border:0;border-radius:14px;background:var(--card-bg);text-align:left;color:#fff}
.offer-item:nth-child(2){--card-bg:#315f61}.offer-item:nth-child(3){--card-bg:#4f745d}
.offer-image{width:100%;height:176px;object-fit:cover;object-position:center 54%}
.offer-content{position:relative;isolation:isolate;padding:28px 28px 32px}
.offer-content::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(120deg,#d7eee945,#132e2f20);opacity:.27;-webkit-mask-image:url('assets/colour-grain.svg');mask-image:url('assets/colour-grain.svg');-webkit-mask-size:192px 192px;mask-size:192px 192px}
.offer-icon{width:44px;height:44px;margin:0 0 19px;color:#fff}.offer-icon svg{width:44px;height:44px;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.offer-item h3{font-size:25px;font-weight:550;line-height:1.25;letter-spacing:-.035em;color:#fff}
.offer-item p{font-size:15px;line-height:1.8;color:#f3f8f5;margin:16px 0 0;text-wrap:pretty}
.offer-extras{max-width:790px;margin:34px auto 0}.offer-extras p{font-size:15px;line-height:1.85;color:#deebe5;text-wrap:pretty}.offer-extras strong{font-weight:600;color:#f7faf8}.offer-extras p+p{margin-top:12px;color:#c3d6cc;font-size:14px}.offer-action{margin-top:32px}

.web-process{background:linear-gradient(118deg,#a8cbd2,#a2c0b0 48%,#afc596);color:#173028;padding:94px 0 72px;--grain-light:#e0eee7;--grain-shade:#52755a;--grain-strength:.28;text-align:center}.web-process .section-intro{margin-bottom:48px}.process-steps{display:grid;grid-template-columns:repeat(3,1fr);list-style:none;padding:0;margin:0 auto;max-width:1050px;gap:40px}.process-steps li{position:relative;text-align:center}.step-index{display:grid;place-items:center;width:42px;height:42px;border:1px solid #315b4c70;border-radius:50%;font-size:11px;margin:0 auto 22px;position:relative}.process-steps li:not(:last-child)::after{content:'';position:absolute;height:1px;background:#315b4c45;left:calc(50% + 36px);right:calc(-50% - 4px);top:21px}.process-steps li:last-child .step-index{background:#244c3e;color:#ecf3de}.process-steps h3{font-size:23px;letter-spacing:-.03em}.process-steps p{font-size:14px;line-height:1.8;color:#345247;margin:15px auto 0}.timing{font-size:11px;color:#35584a;margin:34px auto 0}
.web-enquiry{background:#0b1113;padding:90px 0 72px;--grain-light:#599bb2;--grain-shade:#88a16f;--grain-strength:.4}.web-enquiry .section-intro{margin-bottom:34px}.web-enquiry .section-intro>p{color:#bdd0c6;font-size:15px}.form-panel{width:min(580px,100%);margin:auto;padding:30px;background:linear-gradient(130deg,#e1ece8,#dce7d5);border:1px solid #e8f1e2;border-radius:8px;box-shadow:0 15px 45px #0002;color:#17372a}.form-fields{display:grid;gap:20px}.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}label{display:block;font-size:12px;font-weight:600;color:#274c3f}label>span{font-size:10px;font-weight:400;color:#557467;margin-left:6px}input,textarea{display:block;width:100%;font-size:14px;font-weight:400;color:#1b3c31;border:1px solid #708f7f60;border-radius:5px;background:#fcfffb99;padding:12px 14px;margin-top:8px;line-height:1.5}input::placeholder,textarea::placeholder{color:#61776e;opacity:1}textarea{resize:vertical;min-height:100px;max-height:300px}[aria-invalid="true"]{border-color:#9c3939!important}.form-trap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.form-privacy{font-size:10px;color:#4b6a5e;line-height:1.7}.form-privacy a{text-underline-offset:3px}.form-action{display:grid;gap:9px;justify-items:center}.web-submit{display:flex;align-items:center;justify-content:center;width:100%;min-height:58px;padding:15px 24px;border-radius:5px;border:1px solid #396454;background:linear-gradient(130deg,#254f46,#254b3a);color:#f7faf3;box-shadow:inset 0 1px #ffffff24,0 4px 15px #193b271a;transition:background .2s,transform .2s}.web-submit .now-wordmark{width:188px;height:auto}.web-submit:hover{background:#1c4035;transform:translateY(-1px)}.web-submit:disabled{cursor:wait;opacity:.65;transform:none}.form-action-caption{font-size:10px;color:#3d5e4f}.form-feedback{border-left:2px solid #8a6042;background:#f2e8dca6;padding:12px 14px;color:#70452c;font-size:12px}.form-success{padding:20px 0}.form-success>span{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;background:#c1d8bc;color:#27503c;font-size:26px;margin-bottom:24px}.form-success h3{font-size:28px}.form-success p{font-size:15px;color:#375849;margin:20px 0 28px}.form-success a{font-size:13px;text-underline-offset:4px}.enquiry-email{font-size:12px;text-align:center;color:#adc4b7;margin-top:23px}.enquiry-email a{text-underline-offset:4px}
.web-faq{padding:84px 0 90px;background:linear-gradient(118deg,#e2edf0,#e7efea 52%,#dce7d4);color:#17372c;--grain-light:#fff;--grain-shade:#648471;--grain-floor:#45674d0d;--grain-strength:.4}
.web-faq .section-intro{margin-bottom:32px}.faq-items{width:min(820px,100%);margin:0 auto;display:grid;gap:8px}
.faq-items details{padding:22px 24px;border:0;border-radius:12px}.faq-items details[open]{background:#ffffff52}
.faq-items summary{display:flex;justify-content:space-between;align-items:center;gap:24px;font-size:17px;line-height:1.5;cursor:pointer;list-style:none;font-weight:550;color:#1b3c30}.faq-items summary::-webkit-details-marker{display:none}
.faq-items summary span{position:relative;display:block;flex:0 0 32px;height:32px;border-radius:50%;background:#315e4a;color:#fff}.faq-items summary span::before,.faq-items summary span::after{content:"";position:absolute;left:10px;top:15px;width:12px;height:2px;background:currentColor;border-radius:1px}.faq-items summary span::after{transform:rotate(90deg);transition:transform .2s}.faq-items details[open] summary span::after{transform:rotate(0)}
.faq-items details p{font-size:15px;color:#365447;line-height:1.85;margin:15px 0 0;padding-right:56px;text-wrap:pretty}.web-faq summary:focus-visible{outline-color:#286179}

.website-landing .web-enquiry>.section-grain{inset:0;-webkit-mask-image:linear-gradient(#000 calc(100% - 150px),transparent);mask-image:linear-gradient(#000 calc(100% - 150px),transparent)}.website-landing footer.ocean-footer{background:radial-gradient(ellipse 70% 65% at 13% 66%,#28617935,transparent 85%),radial-gradient(ellipse 65% 70% at 94% 70%,#60866830,transparent 83%),#0b1113}.website-landing footer.ocean-footer::before{content:"";position:absolute;inset:0 0 auto;height:110px;background:linear-gradient(#0b1113,transparent);pointer-events:none}.website-landing .ocean-footer>.section-grain{inset:0;-webkit-mask-image:linear-gradient(transparent,#000 150px);mask-image:linear-gradient(transparent,#000 150px)}.website-landing .ocean-footer .footer-shell{width:min(1160px,calc(100% - 80px));padding-top:24px}.website-landing .ocean-footer .footer-directory{gap:32px}.website-landing .ocean-footer .footer-name{font-size:12px;font-weight:500}.website-landing .ocean-footer .footer-navigation{padding-left:28px}.website-landing .ocean-footer .footer-wordmark{width:100%;max-width:none;margin:30px 0 -16px}.website-landing .ocean-footer .footer-bottom{min-height:76px}

@media(max-width:1000px){.web-container{width:calc(100% - 56px)}.offer-grid{gap:12px}.offer-content{padding:26px 21px 28px}.offer-item h3{font-size:22px}.offer-item p{font-size:14px}.process-steps{gap:25px}.process-steps li:not(:last-child)::after{right:calc(-50% + 11px)}.website-landing .ocean-footer .footer-shell{width:calc(100% - 56px)}.website-landing .ocean-footer .footer-directory{grid-template-columns:1.4fr 1fr 1fr;gap:22px;padding:28px}.website-landing .ocean-footer .footer-navigation{padding-left:20px}}
@media(max-width:700px){.web-hero::before{background-image:url('assets/website-hero-buero3-960.webp');background-position:62% bottom}.web-container{width:calc(100% - 40px)}.web-header{padding-block:22px}.web-brand img{width:113px;height:auto}.header-contact{padding:10px 12px}.header-contact .now-wordmark{width:123px}.web-hero{margin-top:-80px;padding:155px 0 110px;min-height:720px;min-height:min(760px,100svh)}h1{font-size:clamp(38px,6.7vw,48px);max-width:600px!important}.hero-lead{font-size:15px;margin:24px auto 30px;max-width:470px}.hero-copy h1 br{display:none}.hero-lead br{display:none}.hero-assurance{font-size:10px;margin-top:28px}.scroll-cue{bottom:24px}.web-offer,.web-process{padding-top:65px}.web-offer{padding-bottom:56px}.web-process{padding-bottom:56px}h2{font-size:34px}.section-intro{margin-bottom:34px}.section-intro>p{font-size:14px;max-width:310px;margin-top:20px}.offer-grid{grid-template-columns:1fr;gap:16px;max-width:440px}.offer-content{padding:26px 25px 28px}.offer-image{height:180px}.offer-icon{width:42px;height:42px;margin-bottom:17px}.offer-icon svg{width:42px;height:42px}.offer-item h3{font-size:26px}.offer-item p{font-size:15px;margin-top:15px}.offer-extras{max-width:440px;text-align:left;margin-top:26px}.offer-extras p{font-size:14px}.offer-action{margin-top:32px}.web-process .section-intro{margin-bottom:30px}.process-steps{grid-template-columns:1fr;gap:28px;max-width:420px}.process-steps li:not(:last-child)::after{display:none}.step-index{margin-bottom:13px;width:36px;height:36px;font-size:10px}.process-steps h3{font-size:23px}.process-steps p{margin-top:10px;font-size:14px}.timing{font-size:10px;max-width:340px;margin-top:27px}.web-enquiry{padding-block:65px 50px}.web-enquiry .section-intro>p{font-size:14px;max-width:330px}.form-panel{padding:24px}.form-fields{gap:18px}.field-pair{grid-template-columns:1fr;gap:18px}input,textarea{font-size:16px}.web-faq{padding:62px 0}.web-faq .section-intro{margin-bottom:26px}.faq-items{gap:6px}.faq-items details{padding:18px 16px}.faq-items summary{font-size:15px;gap:14px}.faq-items details p{font-size:14px;padding-right:0}.faq-items summary span{flex-basis:30px;height:30px}.faq-items summary span::before,.faq-items summary span::after{left:9px;top:14px}.website-landing .ocean-footer .footer-shell{width:calc(100% - 40px);padding-top:12px}.website-landing .ocean-footer .footer-directory{grid-template-columns:1fr 1fr;gap:24px 16px;padding:24px 20px}.website-landing .ocean-footer .footer-navigation{padding:0}.website-landing .ocean-footer .footer-email{font-size:clamp(20px,5.8vw,24px)}.website-landing .ocean-footer .footer-wordmark{margin:28px 0 4px}.website-landing .ocean-footer .footer-bottom{gap:0 12px}.website-landing .ocean-footer .footer-bottom nav{gap:20px}}
@media(max-width:380px){.web-hero{min-height:700px;padding:130px 0 90px}h1{font-size:38px}.hero-lead{font-size:14px}.hero-copy h1{max-width:310px!important}h2{font-size:31px}.form-panel{padding:20px 17px}.offer-item h3{font-size:23px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
@media(max-width:700px){.web-hero{padding-top:118px}}
/* Angebot: weisser Hintergrund */
.web-offer{background:#fff;color:#17372c;--now-ink:#24576a;--now-border:#28617947;--now-hover:#28617999;--now-focus:#286179;--now-fill:linear-gradient(135deg,#bce6ef38,#d9e7c826)}
.web-offer{--grain-light:#cfe6ec;--grain-shade:#6f9179;--grain-floor:#45674d14;--grain-strength:.42}
.web-offer .section-intro h2{color:#17372c}.web-offer .section-intro>p{color:#45625a}
.web-offer .offer-extras p{color:#365447}.web-offer .offer-extras strong{color:#17372c}.web-offer .offer-extras p+p{color:#5a7569}
.web-offer .offer-item{box-shadow:0 14px 36px #17372c1f}
.web-offer .cta-caption{color:#365447}
.web-hero .colour-atmosphere::after{content:"";position:absolute;inset:-7% -7% calc(-7% - 192px);background:linear-gradient(90deg,#d7eee9,#b9d6c8);-webkit-mask-image:url('assets/colour-grain.svg');mask-image:url('assets/colour-grain.svg');-webkit-mask-size:192px 192px;mask-size:192px 192px;opacity:.16;animation:grain-rise 18s linear -5s infinite}
@media(prefers-reduced-motion:reduce){.web-hero .colour-atmosphere::after{animation:none}}
/* Grundangebot */
.web-package{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(118deg,#183d4b,#214347 46%,#294936);padding:94px 0 80px;text-align:center;--grain-light:#8dc8dc;--grain-shade:#8eae89;--grain-strength:.48}
.web-package .section-intro>p{color:#d2e1db}
.package-list{list-style:none;margin:0 auto;padding:0;max-width:860px;display:grid;gap:12px;text-align:left}
.package-item{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px;padding:24px 28px;border:1px solid #badbd333;border-radius:14px;background:linear-gradient(135deg,#bce6ef17,#d9e7c80a);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.package-item.package-main{background:linear-gradient(135deg,#bce6ef2b,#d9e7c814);border-color:#badbd359}
.package-check{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#e6f0e7;color:#17372c}
.package-check svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.package-item h3{font-size:22px;font-weight:550;color:#fff}
.package-item p{font-size:15px;line-height:1.7;color:#d2e1db;margin-top:6px}
.package-tag{font-size:12px;font-weight:500;letter-spacing:.02em;white-space:nowrap;padding:7px 12px;border-radius:999px;border:1px solid #badbd359;color:#e6f0e7}
.package-main .package-tag{background:#e6f0e7;color:#17372c;border-color:#e6f0e7}
.package-note{font-size:15px;color:#c3d6cc;margin:30px auto 0;max-width:620px}
.package-action{margin-top:30px}
/* Ansprechpartner */
.web-contact{position:relative;isolation:isolate;overflow:hidden;background:#fff;color:#17372c;padding:96px 0;--grain-light:#cfe6ec;--grain-shade:#6f9179;--grain-floor:#45674d14;--grain-strength:.42;--now-ink:#24576a;--now-border:#28617947;--now-hover:#28617999;--now-focus:#286179;--now-fill:linear-gradient(135deg,#bce6ef38,#d9e7c826)}
.contact-layout{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:72px;align-items:center;max-width:1000px}
.contact-portrait{margin:0;border-radius:16px;overflow:hidden;box-shadow:0 18px 44px #17372c26;aspect-ratio:4/5}
.contact-portrait img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
.contact-eyebrow{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#286179}
.contact-copy h2{color:#17372c;margin-top:14px}
.contact-text{font-size:17px;line-height:1.8;color:#365447;margin-top:22px;max-width:480px}
.contact-mail{margin-top:18px;font-size:16px}.contact-mail a{color:#24576a;text-underline-offset:4px}
.contact-action{margin-top:30px}.web-contact .cta-caption{color:#365447}
@media(max-width:1000px){.contact-layout{gap:44px;grid-template-columns:minmax(0,340px) minmax(0,1fr)}}
@media(max-width:700px){.web-package{padding:65px 0 56px}.package-item{grid-template-columns:auto 1fr;gap:14px 16px;padding:20px}.package-tag{grid-column:2;justify-self:start}.package-item h3{font-size:19px}.package-item p{font-size:14px}.package-check{width:36px;height:36px}.package-note{font-size:14px}.web-contact{padding:65px 0}.contact-layout{grid-template-columns:1fr;gap:32px;text-align:center}.contact-portrait{max-width:320px;margin-inline:auto}.contact-text{margin-inline:auto;font-size:15px}}
/* Partner */
.web-partners{position:relative;isolation:isolate;overflow:hidden;background:#0b1113;padding:90px 0;text-align:center;--grain-light:#599bb2;--grain-shade:#88a16f;--grain-strength:.4}
.web-partners .section-intro>p{color:#bdd0c6}
.partner-grid{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:760px}
.partner-card>a,.partner-card>span{display:grid;place-items:center;height:150px;padding:32px 44px;border-radius:14px;background:linear-gradient(130deg,#f4f8f6,#e8f0ea);box-shadow:0 14px 36px #0004;transition:transform .3s cubic-bezier(.22,1,.36,1)}
.partner-card>a:hover{transform:translateY(-3px)}
.partner-card img{width:auto;max-width:100%;max-height:62px;object-fit:contain}
.partner-card img.partner-89grad{max-height:50px}
@media(max-width:700px){.web-partners{padding:65px 0}.partner-grid{grid-template-columns:1fr;gap:14px;max-width:360px}.partner-card>a,.partner-card>span{height:120px;padding:26px 36px}.partner-card img{max-height:52px}}
/* Startbild: langsame Bewegung */
@keyframes hero-drift{0%{transform:scale(1.02) translate3d(0,0,0)}50%{transform:scale(1.09) translate3d(-1.2%,-.8%,0)}100%{transform:scale(1.05) translate3d(1%,-.4%,0)}}
.web-hero::before{transform-origin:55% 60%;will-change:transform;animation:hero-drift 28s ease-in-out infinite alternate}
@media(prefers-reduced-motion:reduce){.web-hero::before{animation:none;transform:none}}
/* Referenzen */
.web-references{position:relative;isolation:isolate;overflow:hidden;padding:96px 0;background:linear-gradient(118deg,#e2edf0,#e7efea 52%,#dce7d4);color:#17372c;--grain-light:#fff;--grain-shade:#648471;--grain-floor:#45674d0d;--grain-strength:.4}
.references-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:56px;align-items:center}
.ref-map{position:relative;aspect-ratio:1000/640}
.ref-map-svg{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 22px 34px #17372c26)}
.ref-points{list-style:none;margin:0;padding:0;position:absolute;inset:0}
.ref-point{position:absolute;width:0;height:0;opacity:0;transform:scale(.4);animation:ref-pop .55s cubic-bezier(.22,1,.36,1) forwards;animation-delay:calc(.35s + var(--i) * 45ms)}
@keyframes ref-pop{to{opacity:1;transform:none}}
.ref-point>button{position:absolute;left:-9px;top:-9px;width:18px;height:18px;padding:0;border:3px solid #fff;border-radius:50%;background:#286179;box-shadow:0 3px 9px #17372c40;transition:transform .2s,background .2s}
.ref-point>button::after{content:"";position:absolute;inset:-5px;border-radius:50%}
.ref-point>button:hover,.ref-point>button:focus-visible{transform:scale(1.35);background:#4f745d;outline:none}
.ref-point:hover,.ref-point:focus-within{z-index:5}
.ref-tip{position:absolute;left:0;bottom:16px;transform:translate(-50%,6px);min-width:150px;max-width:240px;padding:10px 14px;border-radius:10px;background:#0b1113;color:#f5f8f6;box-shadow:0 12px 30px #0b111340;text-align:left;font-size:12px;line-height:1.5;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s,transform .2s,visibility .2s}
.ref-tip strong{display:block;font-size:13px;font-weight:600}.ref-tip>span{display:block;color:#a9c3b8;margin-top:3px}
.ref-point:hover .ref-tip,.ref-point:focus-within .ref-tip{opacity:1;visibility:visible;transform:translate(-50%,0)}
.references-copy h2{color:#17372c;margin-top:14px}
.references-text{font-size:16px;line-height:1.8;color:#365447;margin-top:20px}
.references-stats{display:flex;gap:36px;margin:28px 0 0}.references-stats div{display:grid}.references-stats dt{font-size:44px;font-weight:550;letter-spacing:-.04em;line-height:1.1;color:#286179}.references-stats dd{margin:2px 0 0;font-size:13px;color:#4b6a5e}
.references-hint{font-size:12px;color:#5a7569;margin-top:26px}
@media(max-width:1000px){.references-layout{grid-template-columns:1fr;gap:36px}.references-copy{text-align:center;max-width:560px;margin-inline:auto}.references-stats{justify-content:center}}
@media(max-width:700px){.web-references{padding:65px 0}.ref-point>button{left:-7px;top:-7px;width:14px;height:14px;border-width:2px}.references-stats dt{font-size:36px}.references-text{font-size:15px}}
@media(prefers-reduced-motion:reduce){.ref-point{animation:none;opacity:1;transform:none}}

/* ================================================================
   Einheitliches System: Hell und Dunkel wechseln sich ab.
   Dunkel = #0b1113 mit farbiger Körnung · Hell = Blau-Grün-Verlauf
   ================================================================ */
.website-landing{--tone-dark:#0b1113;--tone-light:linear-gradient(118deg,#e2edf0,#e7efea 52%,#dce7d4);--ink-dark:#17372c;--ink-dark-soft:#45625a;--ink-light:#f5f8f6;--ink-light-soft:#bdd0c6;--accent-light:#286179;--accent-dark:#a3d2db}
/* gleiche Abstände */
.website-landing :is(.web-offer,.web-package,.web-contact,.web-references,.web-partners,.web-process,.web-faq,.web-enquiry){padding:100px 0}
/* Hell */
.website-landing :is(.web-offer,.web-contact,.web-partners,.web-faq){background:var(--tone-light);color:var(--ink-dark);--grain-light:#fff;--grain-shade:#648471;--grain-floor:#45674d0d;--grain-strength:.4;--now-ink:#24576a;--now-border:#28617947;--now-hover:#28617999;--now-focus:#286179;--now-fill:linear-gradient(135deg,#ffffff8c,#ffffff4d)}
/* Dunkel */
.website-landing :is(.web-package,.web-references,.web-process,.web-enquiry){background:radial-gradient(ellipse 60% 70% at 0% 10%,#2861792e,transparent 80%),radial-gradient(ellipse 55% 65% at 100% 95%,#4f745d2b,transparent 80%),var(--tone-dark);color:var(--ink-light);--grain-light:#599bb2;--grain-shade:#88a16f;--grain-floor:#5aadc814;--grain-strength:.4}
/* Titelzeilen überall gleich */
.section-eyebrow{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-light);margin-bottom:16px}
.website-landing :is(.web-package,.web-references,.web-process,.web-enquiry) .section-eyebrow{color:var(--accent-dark)}
.website-landing .section-intro{margin:0 auto 52px;max-width:860px}
.website-landing .section-intro>p:not(.section-eyebrow){font-size:16px;line-height:1.8;margin-top:20px}
.website-landing :is(.web-offer,.web-contact,.web-partners,.web-faq) :is(h2,h3){color:var(--ink-dark)}
.website-landing :is(.web-offer,.web-contact,.web-partners,.web-faq) .section-intro>p:not(.section-eyebrow){color:var(--ink-dark-soft)}
.website-landing :is(.web-package,.web-references,.web-process,.web-enquiry) h2{color:var(--ink-light)}
.website-landing :is(.web-package,.web-references,.web-process,.web-enquiry) .section-intro>p:not(.section-eyebrow){color:var(--ink-light-soft)}
.website-landing .offer-item h3{color:#fff}
.contact-copy h2,.references-copy h2{margin-top:0}
/* Karten auf Hell: weiss mit weichem Schatten */
.website-landing .partner-card>a,.website-landing .partner-card>span{background:#fff;box-shadow:0 14px 36px #17372c1a}
.website-landing .web-faq .faq-items details[open]{background:#ffffffa6}
.website-landing .contact-portrait{box-shadow:0 18px 44px #17372c26}
/* Referenzen auf Dunkel */
.website-landing .references-text{color:var(--ink-light-soft)}
.website-landing .references-stats dt{color:var(--accent-dark)}
.website-landing .references-stats dd,.website-landing .references-hint{color:#8fa9a0}
.website-landing .ref-map-svg{filter:drop-shadow(0 24px 40px #0008)}
.website-landing .ref-tip{background:#f5f8f6;color:#17372c;box-shadow:0 12px 30px #0006}.website-landing .ref-tip>span{color:#4b6a5e}
/* Ablauf auf Dunkel */
.website-landing .web-process{text-align:center}
.website-landing .process-steps p{color:var(--ink-light-soft)}
.website-landing .step-index{border-color:#a3d2db66;color:var(--ink-light)}
.website-landing .process-steps li:not(:last-child)::after{background:#a3d2db40}
.website-landing .process-steps li:last-child .step-index{background:#e6f0e7;color:#17372c;border-color:#e6f0e7}
.website-landing .timing{color:#8fa9a0}
@media(max-width:700px){.website-landing :is(.web-offer,.web-package,.web-contact,.web-references,.web-partners,.web-process,.web-faq,.web-enquiry){padding:68px 0}.website-landing .section-intro{margin-bottom:36px}.website-landing .section-intro>p:not(.section-eyebrow){font-size:14px}}
.website-landing .section-intro>.section-eyebrow,.website-landing .section-eyebrow{color:var(--accent-light);font-size:12px;margin-top:0}
.website-landing :is(.web-package,.web-references,.web-process,.web-enquiry) .section-intro>.section-eyebrow,.website-landing :is(.web-package,.web-references,.web-process,.web-enquiry) .section-eyebrow{color:var(--accent-dark)}
/* Ablauf: Icons in den Kreisen */
.website-landing .step-icon{width:60px;height:60px;margin-bottom:16px}
.step-icon svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.website-landing .process-steps li:not(:last-child)::after{top:30px;left:calc(50% + 46px);right:calc(-50% + 18px)}
.step-number{display:block;font-size:11px;font-weight:600;letter-spacing:.14em;color:#a3d2db;margin-bottom:8px}
@media(max-width:700px){.website-landing .step-icon{width:52px;height:52px;margin-bottom:12px}.step-icon svg{width:24px;height:24px}}
/* Kontakt-Buttons */
.cta-label{font-size:17px;font-weight:600;letter-spacing:.01em;line-height:1}
.header-contact .cta-label{font-size:15px}
body.direction-b.ocean-concept a.elovait-now-button{min-width:180px}
@media(max-width:700px){.cta-label{font-size:16px}.header-contact .cta-label{font-size:14px}}
/* Hero: Text oben, Bild kleiner unten mit Bogen */
.web-hero{--hero-img-h:clamp(250px,34vw,470px);min-height:0;align-items:flex-start;padding:150px 0 calc(var(--hero-img-h) + 40px)}
.web-hero::before{inset:auto 0 0 0;height:var(--hero-img-h);background-position:center 62%;clip-path:ellipse(78% 100% at 50% 100%);transform-origin:50% 100%;animation:hero-drift-soft 26s ease-in-out infinite alternate}
@keyframes hero-drift-soft{from{transform:scale(1)}to{transform:scale(1.05) translate3d(-.8%,0,0)}}
.web-hero::after{inset:auto 0 0 0;height:var(--hero-img-h);clip-path:ellipse(78% 100% at 50% 100%);background:linear-gradient(180deg,#0b101259 0%,#0b101200 35%,#0b101200 80%,#0b101266 100%)}
.web-hero .scroll-cue{display:none}
@media(max-width:700px){.web-hero{--hero-img-h:230px;padding:118px 0 calc(var(--hero-img-h) + 30px);min-height:0}.web-hero::before,.web-hero::after{clip-path:ellipse(95% 100% at 50% 100%)}}
@media(prefers-reduced-motion:reduce){.web-hero::before{animation:none}}

/* ================================================================
   Feedback-Runde 1: neue Reihenfolge, Rhythmus Hell/Dunkel
   Hero D · Grundangebot H · Ansprechpartner D · Partner&Projekte H · Ablauf D · Fragen H · Anfrage D
   ================================================================ */
.website-landing :is(.web-package,.web-references,.web-faq){background:var(--tone-light);color:var(--ink-dark);--grain-light:#fff;--grain-shade:#648471;--grain-floor:#45674d0d;--grain-strength:.4;--now-ink:#24576a;--now-border:#28617947;--now-hover:#28617999;--now-focus:#286179;--now-fill:linear-gradient(135deg,#ffffff8c,#ffffff4d)}
.website-landing :is(.web-contact,.web-process,.web-enquiry){background:radial-gradient(ellipse 60% 70% at 0% 10%,#2861792e,transparent 80%),radial-gradient(ellipse 55% 65% at 100% 95%,#4f745d2b,transparent 80%),var(--tone-dark);color:var(--ink-light);--grain-light:#599bb2;--grain-shade:#88a16f;--grain-floor:#5aadc814;--grain-strength:.4;--now-ink:#fff;--now-border:#badbd345;--now-hover:#c4e4d880;--now-focus:#bce6ef;--now-fill:linear-gradient(135deg,#bce6ef21,#d9e7c808)}
.website-landing :is(.web-package,.web-references,.web-faq) h2,.website-landing :is(.web-package,.web-references,.web-faq) .section-intro>p{color:var(--ink-dark)}
.website-landing .web-package .section-intro>p{color:var(--ink-dark-soft)}
.website-landing :is(.web-contact,.web-process,.web-enquiry) h2{color:var(--ink-light)}
.website-landing :is(.web-contact,.web-process,.web-enquiry) .section-intro>p{color:var(--ink-light-soft)}
/* Grundangebot auf Hell */
.website-landing .package-item{background:#fff;border-color:#17372c14;box-shadow:0 10px 28px #17372c12;-webkit-backdrop-filter:none;backdrop-filter:none}
.website-landing .package-item.package-main{background:#fff;border-color:#28617940}
.website-landing .package-item h3{color:var(--ink-dark)}.website-landing .package-item p{color:var(--ink-dark-soft)}
.website-landing .package-check{background:#286179;color:#fff}
.website-landing .package-tag{border-color:#28617947;color:#24576a}
.website-landing .package-main .package-tag{background:#286179;border-color:#286179;color:#fff}
.website-landing .package-note{color:var(--ink-dark-soft)}
/* Ansprechpartner auf Dunkel */
.website-landing .web-contact .contact-text{color:var(--ink-light-soft)}
.website-landing .web-contact .contact-mail a{color:var(--accent-dark)}
.website-landing .web-contact .contact-portrait{box-shadow:0 22px 50px #0009}
/* Partner und Projekte auf Hell */
.website-landing .web-references .references-text{color:var(--ink-dark-soft)}
.website-landing .web-references .references-stats dt{color:var(--accent-light)}
.website-landing .web-references .references-stats dd{color:#4b6a5e}
.website-landing .ref-map-svg{filter:drop-shadow(0 24px 36px #17372c33)}
.ref-dot{position:absolute;left:-6px;top:-6px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px #ffffff40,0 2px 6px #0b111340}
.ref-dot::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1.5px solid #fff;opacity:0;animation:ref-pulse 3.2s ease-out infinite;animation-delay:calc(var(--i) * 170ms)}
@keyframes ref-pulse{0%{transform:scale(.5);opacity:.75}80%,100%{transform:scale(1.7);opacity:0}}
.partner-row{grid-column:1/-1;margin-top:56px;text-align:center}
.partner-heading{font-size:22px;font-weight:550;letter-spacing:-.03em;color:var(--ink-dark);margin-bottom:24px}
/* Ablauf: Leistungskarten als 5 Schritte */
.offer-grid-steps{grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;max-width:1240px}
.website-landing .web-process .web-container{width:min(1240px,calc(100% - 80px))}
.offer-grid-steps .offer-item:nth-child(1){--card-bg:#286179}.offer-grid-steps .offer-item:nth-child(2){--card-bg:#2a5f6f}.offer-grid-steps .offer-item:nth-child(3){--card-bg:#315f61}.offer-grid-steps .offer-item:nth-child(4){--card-bg:#3d6a5f}.offer-grid-steps .offer-item:nth-child(5){--card-bg:#4f745d}
.offer-grid-steps .offer-image{height:130px}
.offer-grid-steps .offer-content{padding:22px 20px 26px}
.offer-step{display:block;font-size:11px;font-weight:600;letter-spacing:.14em;color:#d7eee9;opacity:.8;margin-bottom:12px}
.offer-grid-steps .offer-icon{width:34px;height:34px;margin-bottom:14px}.offer-grid-steps .offer-icon svg{width:34px;height:34px}
.offer-grid-steps .offer-item h3{font-size:19px}
.offer-grid-steps .offer-item p{font-size:13.5px;line-height:1.7;margin-top:10px}
.website-landing .web-process .offer-grid-steps{text-align:left}
@media(max-width:1100px){.offer-grid-steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.offer-grid-steps{grid-template-columns:1fr;max-width:440px}.offer-grid-steps .offer-image{height:150px}.partner-row{margin-top:40px}.website-landing .web-process .web-container{width:calc(100% - 40px)}}
@media(prefers-reduced-motion:reduce){.ref-dot::after{animation:none}}
.website-landing .web-package .section-intro>p:not(.section-eyebrow){color:var(--ink-dark-soft)}
.header-contact{text-decoration:none}@media(max-width:700px){.ref-dot{left:-4px;top:-4px;width:8px;height:8px}.ref-dot::after{inset:-4px}}

/* ================================================================
   Feedback-Runde 2: Problem-Abschnitt, Gesprächs-Abschnitt
   Hero D · Problem H · Grundangebot D · Gespräch (Bild + Farbfläche) · Partner&Projekte H · Ablauf D · Fragen H · Anfrage D
   ================================================================ */
/* Problem (hell) */
.web-problem{position:relative;isolation:isolate;overflow:hidden;padding:100px 0;text-align:center;background:var(--tone-light);color:var(--ink-dark);--grain-light:#fff;--grain-shade:#648471;--grain-floor:#45674d0d;--grain-strength:.4}
.website-landing .web-problem h2{color:var(--ink-dark)}
.website-landing .web-problem .section-intro>p:not(.section-eyebrow){color:var(--ink-dark-soft)}
.problem-grid{list-style:none;margin:0 auto;padding:0;max-width:1080px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;text-align:left}
.problem-item{padding:30px 28px 32px;border-radius:14px;background:#fff;box-shadow:0 14px 36px #17372c14;border:1px solid #17372c0f}
.problem-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,#286179,#4f745d);color:#fff;margin-bottom:20px}
.problem-icon svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.problem-item h3{font-size:21px;font-weight:550;letter-spacing:-.03em;color:var(--ink-dark)}
.problem-item p{font-size:15px;line-height:1.75;color:var(--ink-dark-soft);margin-top:12px}
.problem-close{margin-top:40px;font-size:22px;font-weight:550;letter-spacing:-.03em;color:var(--accent-light)}
/* Grundangebot wieder dunkel */
.website-landing .web-package{background:radial-gradient(ellipse 60% 70% at 0% 10%,#2861792e,transparent 80%),radial-gradient(ellipse 55% 65% at 100% 95%,#4f745d2b,transparent 80%),var(--tone-dark);color:var(--ink-light);--grain-light:#599bb2;--grain-shade:#88a16f;--grain-floor:#5aadc814;--grain-strength:.4;--now-ink:#fff;--now-border:#badbd345;--now-hover:#c4e4d880;--now-focus:#bce6ef;--now-fill:linear-gradient(135deg,#bce6ef21,#d9e7c808)}
.website-landing .web-package h2{color:var(--ink-light)}
.website-landing .web-package .section-intro>p:not(.section-eyebrow),.website-landing .package-note{color:var(--ink-light-soft)}
.website-landing .package-item{background:linear-gradient(135deg,#bce6ef17,#d9e7c80a);border-color:#badbd333;box-shadow:none;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.website-landing .package-item.package-main{background:linear-gradient(135deg,#bce6ef2b,#d9e7c814);border-color:#badbd359}
.website-landing .package-item h3{color:#fff}.website-landing .package-item p{color:var(--ink-light-soft)}
.website-landing .package-check{background:#e6f0e7;color:#17372c}
.website-landing .package-tag{border-color:#badbd359;color:#e6f0e7}
.website-landing .package-main .package-tag{background:#e6f0e7;border-color:#e6f0e7;color:#17372c}
/* Gespräch: Bild randlos links, Farbfläche rechts */
.website-landing .web-talk{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);padding:0;background:#0b1113;position:relative;isolation:isolate;overflow:hidden;min-height:520px}
.talk-portrait{position:relative;margin:0;min-height:100%}
.talk-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 22%}
.talk-portrait figcaption{position:absolute;left:24px;bottom:20px;font-size:13px;font-weight:500;color:#f5f8f6;background:#0b1113a6;padding:6px 12px;border-radius:999px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.talk-panel{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;padding:80px clamp(32px,7vw,110px);background:linear-gradient(125deg,#286179,#2f5f5e 55%,#4f745d);--grain-light:#d7eee9;--grain-shade:#173e50;--grain-strength:.35}
.talk-copy{max-width:520px}
.website-landing .web-talk h2{color:#fff;font-size:clamp(34px,3.6vw,52px);font-weight:600;line-height:1.1}
.talk-rule{display:block;width:min(100%,420px);height:2px;margin:34px 0;background:linear-gradient(90deg,#e6f0e7,#e6f0e700)}
.talk-actions{display:flex;flex-wrap:wrap;gap:16px}
.talk-button{display:inline-flex;align-items:center;gap:10px;min-height:54px;padding:0 26px;border-radius:999px;font-size:15px;font-weight:600;text-decoration:none;transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s}
.talk-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.talk-primary{background:#0b1113;color:#fff;box-shadow:0 10px 24px #0b111340}
.talk-secondary{background:#fff;color:#17372c}
.talk-button:hover{transform:translateY(-2px);box-shadow:0 14px 28px #0b111340}
.talk-button:focus-visible{outline:2px solid #fff;outline-offset:4px}
@media(max-width:800px){.website-landing .web-talk{grid-template-columns:1fr;min-height:0}.talk-portrait{aspect-ratio:4/3.4}.talk-panel{padding:56px 24px 60px}.talk-actions{flex-direction:column;align-items:stretch}.talk-button{justify-content:center}}
@media(max-width:1000px){.problem-grid{grid-template-columns:1fr;max-width:520px}}
@media(max-width:700px){.web-problem{padding:68px 0}.problem-item{padding:24px 22px 26px}.problem-item h3{font-size:19px}.problem-close{font-size:19px;margin-top:30px}}
/* Gespräch: Bild im Hochformat */
.website-landing .web-talk{grid-template-columns:clamp(300px,36vw,540px) minmax(0,1fr);min-height:0}
.talk-portrait{aspect-ratio:2/3;min-height:0}
.talk-portrait img{object-position:center top}
@media(max-width:800px){.website-landing .web-talk{grid-template-columns:1fr}.talk-portrait{aspect-ratio:2/3}}
/* Hero-Bild: weicher Verlauf statt harter Bogenkante */
.web-hero{--hero-img-h:clamp(300px,40vw,560px)}
.web-hero::before,.web-hero::after{clip-path:none;-webkit-mask-image:radial-gradient(ellipse 85% 100% at 50% 100%,#000 55%,#0008 72%,transparent 92%);mask-image:radial-gradient(ellipse 85% 100% at 50% 100%,#000 55%,#0008 72%,transparent 92%)}
.web-hero::after{background:linear-gradient(180deg,#0b101200 60%,#0b101240 100%)}
@media(max-width:700px){.web-hero{--hero-img-h:280px}.web-hero::before,.web-hero::after{clip-path:none;-webkit-mask-image:radial-gradient(ellipse 110% 100% at 50% 100%,#000 50%,transparent 92%);mask-image:radial-gradient(ellipse 110% 100% at 50% 100%,#000 50%,transparent 92%)}}
/* Gespräch: weniger hoch */
.website-landing .web-talk{grid-template-columns:clamp(240px,27vw,380px) minmax(0,1fr)}
@media(max-width:800px){.website-landing .web-talk{grid-template-columns:1fr}.talk-portrait{aspect-ratio:auto;height:440px}}
/* Partner-Karten im Querformat */
.partner-covers{max-width:960px;gap:22px}
.website-landing .partner-covers .partner-card>a{position:relative;isolation:isolate;overflow:hidden;display:grid;place-items:center;height:auto;aspect-ratio:16/9;padding:0;border-radius:18px;box-shadow:0 20px 44px #17372c2e;transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s}
.website-landing .partner-covers .partner-card>a:hover{transform:translateY(-4px);box-shadow:0 26px 54px #17372c40}
.pc-grain{position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(#fff,#fff);opacity:.13;-webkit-mask-image:url('assets/colour-grain.svg');mask-image:url('assets/colour-grain.svg');-webkit-mask-size:160px 160px;mask-size:160px 160px}
.pc-logo{position:relative;z-index:4}
/* Antigravity: Sterne, Erdhorizont, blaues Licht */
.website-landing .pc-antigravity>a{background:radial-gradient(ellipse 70% 60% at 52% 78%,#007fff70,transparent 72%),linear-gradient(180deg,#05070d,#0b1424 70%,#0e1a2e)}
.pc-stars{position:absolute;inset:0;z-index:1;background-image:radial-gradient(1px 1px at 12% 18%,#fff,transparent),radial-gradient(1px 1px at 28% 42%,#ffffffb0,transparent),radial-gradient(1.4px 1.4px at 46% 12%,#fff,transparent),radial-gradient(1px 1px at 63% 30%,#ffffffa0,transparent),radial-gradient(1px 1px at 78% 16%,#fff,transparent),radial-gradient(1.2px 1.2px at 88% 40%,#ffffffc0,transparent),radial-gradient(1px 1px at 36% 8%,#ffffff90,transparent),radial-gradient(1px 1px at 7% 48%,#ffffff90,transparent),radial-gradient(1px 1px at 56% 52%,#ffffff70,transparent),radial-gradient(1px 1px at 94% 8%,#fff,transparent);opacity:.85}
.pc-earth{position:absolute;z-index:2;left:-25%;right:-25%;top:62%;height:150%;border-radius:50%;background:radial-gradient(ellipse 60% 40% at 50% 8%,#2a6fc7,#0c2a52 45%,#071629 75%);box-shadow:0 -2px 0 #9fd0ff,0 -6px 18px #3d9bff,0 -22px 60px #007fff99;transition:transform .8s cubic-bezier(.22,1,.36,1)}
.pc-antigravity>a:hover .pc-earth{transform:translateY(-4%)}
.pc-antigravity .pc-logo{width:58%;max-height:none;filter:brightness(0) invert(1);margin-top:-14%}
/* 89 Grad: Grün, Hügel, Velo */
.website-landing .pc-89grad>a{background:radial-gradient(ellipse 60% 55% at 78% 20%,#d9f2a6,transparent 70%),linear-gradient(160deg,#a8d66b,#6fae3e 55%,#3f7a2c)}
.pc-hills{position:absolute;inset:auto -10% -30% -10%;height:70%;z-index:1;border-radius:50% 50% 0 0;background:#4f8f33;box-shadow:-180px 30px 0 -10px #3c7428,200px 40px 0 0 #5c9c3c}
.pc-bike{position:absolute;z-index:2;right:7%;bottom:9%;width:38%;fill:none;stroke:#f2fae6;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;opacity:.9;transition:transform .8s cubic-bezier(.22,1,.36,1)}
.pc-89grad>a:hover .pc-bike{transform:translateX(-10px)}
.pc-badge{position:relative;z-index:4;display:grid;place-items:center;padding:16px 26px;border-radius:14px;background:#ffffffeb;box-shadow:0 12px 30px #1f3d1240;margin-bottom:12%}
.website-landing .pc-89grad .pc-logo{max-height:none;width:clamp(150px,18vw,210px);height:auto}
@media(max-width:700px){.partner-covers{grid-template-columns:1fr;max-width:420px}.pc-badge{padding:12px 20px}}
/* Antigravity-Karte mit Erdbild */
.website-landing .pc-antigravity>a{background:#1d2128}
.pc-earthimg{position:absolute;inset:0;z-index:1;background:url('assets/partner-antigravity-erde.webp') center/cover no-repeat;transition:transform .9s cubic-bezier(.22,1,.36,1)}
.pc-antigravity>a:hover .pc-earthimg{transform:scale(1.04) translateY(-2%)}
.pc-antigravity .pc-logo{margin-top:-22%;width:52%}
/* 89 Grad: Hintergrund wie auf 89grad.ch */
.website-landing .pc-89grad>a{background:#2a3128}
.pc-89bg{position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse 55% 80% at 42% 70%,#5f6a3f,transparent 75%),radial-gradient(ellipse 45% 70% at 8% 30%,#556266,transparent 75%),linear-gradient(100deg,#4d5a55 0%,#56603f 38%,#4a5536 62%,#222a24 88%,#171c1a 100%);transition:transform .9s cubic-bezier(.22,1,.36,1)}
.pc-89grad>a:hover .pc-89bg{transform:scale(1.05)}
.website-landing .pc-89grad .pc-badge{margin-bottom:0;background:#ffffffe6}
/* Partner-Logos mittig, ohne Hintergrund */
.website-landing .pc-antigravity .pc-logo{margin:0;width:50%}
.website-landing .pc-89grad .pc-logo{margin:0;width:44%;max-width:none;filter:drop-shadow(0 4px 14px #0006)}
/* Problem: neuer Text */
.website-landing .web-problem .section-intro{max-width:900px}
.website-landing .web-problem .section-intro>p:not(.section-eyebrow){max-width:720px;margin-inline:auto}
.problem-item h3{line-height:1.3}
.problem-answer{max-width:780px;margin:52px auto 0;padding:38px 44px;border-radius:18px;text-align:left;background:linear-gradient(125deg,#286179,#2f5f5e 55%,#4f745d);color:#fff;box-shadow:0 18px 44px #17372c2e}
.website-landing .problem-answer h3{font-size:clamp(22px,2.2vw,28px);font-weight:550;letter-spacing:-.03em;line-height:1.25;color:#fff}
.problem-answer p{font-size:16px;line-height:1.8;color:#e1eee8;margin-top:14px}
@media(max-width:700px){.problem-answer{padding:28px 24px;margin-top:36px}.problem-answer p{font-size:15px}.web-problem h2 br{display:none}}
.website-landing .web-problem h2{font-size:clamp(30px,3.2vw,44px)}
/* Gespräch: feste Höhe */
.website-landing .web-talk{grid-template-columns:auto minmax(0,1fr);height:clamp(380px,32vw,470px)}
.website-landing .web-talk .talk-portrait{height:100%;aspect-ratio:2/3;width:auto}
.website-landing .web-talk .talk-panel{padding-block:40px}
@media(max-width:800px){.website-landing .web-talk{grid-template-columns:1fr;height:auto}.website-landing .web-talk .talk-portrait{width:100%;height:420px;aspect-ratio:auto}}
/* Kartenpunkte: kleiner, ohne Bewegung */
.ref-point{animation:none;opacity:1;transform:none}
.ref-dot{left:-3.5px;top:-3.5px;width:7px;height:7px;box-shadow:0 0 0 1.5px #17372c66}
.ref-dot::after{display:none;animation:none}
@media(max-width:700px){.ref-dot{left:-2.5px;top:-2.5px;width:5px;height:5px}}
/* Antigravity: Erde tiefer */
.pc-earthimg{background-position:center 0;background-size:cover;inset:12% 0 -12% 0}
.pc-antigravity>a:hover .pc-earthimg{transform:scale(1.03) translateY(-1.5%)}
/* 89 Grad: Velos im Hintergrund */
.pc-bikes{position:absolute;inset:0;z-index:2;pointer-events:none}
.pc-bikes>span{position:absolute;display:block}
.pc-bikes svg{display:block;width:100%;fill:none;stroke:#e6f2c8;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.pc-bikes .b1{width:26%;left:4%;bottom:8%;opacity:.14}
.pc-bikes .b2{width:17%;left:24%;top:9%;opacity:.09;transform:scaleX(-1)}
.pc-bikes .b3{width:30%;right:3%;bottom:-4%;opacity:.12;transform:scaleX(-1)}
.pc-bikes .b4{width:14%;right:14%;top:10%;opacity:.08}
.pc-bikes .b5{width:12%;left:47%;bottom:6%;opacity:.07}
.pc-89grad>a:hover .pc-bikes>span{translate:-8px 0;transition:translate .9s cubic-bezier(.22,1,.36,1)}
.pc-bikes>span{transition:translate .9s cubic-bezier(.22,1,.36,1)}
.website-landing .pc-antigravity>a{background:#212327}.pc-earthimg{-webkit-mask-image:linear-gradient(transparent,#000 14%);mask-image:linear-gradient(transparent,#000 14%)}
.pc-bikes>img{position:absolute;display:block;height:auto;max-width:none;transition:translate .9s cubic-bezier(.22,1,.36,1)}
.pc-89grad>a:hover .pc-bikes>img{translate:-8px 0}
.pc-bikes .b1{opacity:.16}.pc-bikes .b3{opacity:.14}
/* 89 Grad: echtes Velofoto mit leichter Deckkraft */
.pc-bikephoto{position:absolute;inset:0;z-index:2;background:url('assets/partner-89grad-ebikes.webp') center/cover no-repeat;opacity:.22;mix-blend-mode:luminosity;transition:transform .9s cubic-bezier(.22,1,.36,1)}
.pc-89grad>a:hover .pc-bikephoto{transform:scale(1.04)}
.pc-bikephoto{opacity:.1;background-position:70% 60%}

/* ================================================================
   Einheitlichkeit: ein Button-Stil, gleiche Titel, gleiche Ecken
   ================================================================ */
.website-landing{--radius-card:16px;--btn-h:54px}
/* Titel überall gleich */
.website-landing section h2,.website-landing .web-talk h2,.website-landing .web-problem h2{font-size:clamp(32px,3.4vw,48px);font-weight:500;letter-spacing:-.045em;line-height:1.15}
.website-landing .section-intro{margin-bottom:48px}
.website-landing .section-intro>p:not(.section-eyebrow),.website-landing .references-text{font-size:16px;line-height:1.8;margin-top:18px}
/* Karten: gleiche Rundung und Schatten */
.website-landing :is(.problem-item,.package-item,.offer-item,.faq-items details,.form-panel,.contact-portrait){border-radius:var(--radius-card)}
.website-landing .partner-covers .partner-card>a{border-radius:var(--radius-card)}
.website-landing :is(.problem-item){box-shadow:0 14px 36px #17372c14}
/* Ein Button-Stil für alle Aktionen */
body.direction-b.ocean-concept.website-landing a.elovait-now-button,.website-landing .talk-button,.website-landing .web-submit,.website-landing .header-contact{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:var(--btn-h);min-height:var(--btn-h);min-width:0;padding:0 28px;border-radius:999px;border:0;font-size:15px;font-weight:600;letter-spacing:.01em;text-decoration:none;-webkit-backdrop-filter:none;backdrop-filter:none;transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s,background .3s}
.website-landing .cta-label{font-size:15px;font-weight:600}
/* auf Dunkel: hell gefüllt */
body.direction-b.ocean-concept.website-landing :is(.web-hero,.web-package,.web-process,.web-enquiry,.web-talk) a.elovait-now-button,.website-landing .talk-primary,.website-landing .header-contact{background:#e6f0e7;color:#17372c;box-shadow:0 10px 26px #0b111340}
/* auf Hell: petrol gefüllt */
body.direction-b.ocean-concept.website-landing :is(.web-problem,.web-references,.web-faq) a.elovait-now-button,.website-landing .web-submit{background:#286179;color:#fff;box-shadow:0 10px 24px #2861793d}
body.direction-b.ocean-concept.website-landing a.elovait-now-button:hover,.website-landing .talk-button:hover,.website-landing .web-submit:hover,.website-landing .header-contact:hover{transform:translateY(-2px);box-shadow:0 14px 30px #0b111347}
.website-landing .web-submit:hover{background:#1f5266}
.website-landing .header-contact{height:44px;min-height:44px;padding:0 20px;font-size:14px}
.website-landing .header-contact .cta-label{font-size:14px}
.website-landing .web-submit{width:100%}
.website-landing .talk-button svg{display:none}
@media(max-width:700px){.website-landing .header-contact{height:40px;min-height:40px;padding:0 16px}}

/* ================================================================
   Liquid Glass: durchscheinend, weichgezeichnet, mit Lichtkante
   ================================================================ */
.website-landing{--glass-blur:blur(18px) saturate(170%);--glass-edge:inset 0 1px 0 #ffffff80,inset 0 -1px 0 #ffffff1f,inset 1px 0 0 #ffffff26,inset -1px 0 0 #ffffff14}
.lg{position:relative;isolation:isolate}
/* Glanzschicht für alle Glas-Elemente */
.website-landing :is(.web-header,.package-item,.problem-item,.faq-items details,.form-panel,a.elovait-now-button,.talk-button,.web-submit,.header-contact,.pc-badge)::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,#ffffff59 0%,#ffffff14 22%,#ffffff00 45%,#ffffff00 70%,#ffffff1f 100%);mix-blend-mode:screen;opacity:.9}
.website-landing :is(.package-item,.problem-item,.faq-items details,.form-panel,a.elovait-now-button,.talk-button,.web-submit,.header-contact){position:relative;isolation:isolate;overflow:hidden}
.website-landing .web-submit>*,.website-landing a.elovait-now-button>*,.website-landing .talk-button>*{position:relative;z-index:1}

/* Kopfzeile als schwebende Glasleiste */
.website-landing .web-header{position:sticky;top:14px;z-index:50;padding:12px 14px 12px 26px;margin-top:14px;border-radius:999px;background:#0b111347;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--glass-edge),0 12px 34px #0b111333}
.website-landing .web-hero{margin-top:-82px}
@media(max-width:700px){.website-landing .web-header{padding:8px 8px 8px 18px;top:10px;margin-top:10px}.website-landing .web-hero{margin-top:-66px}}

/* Buttons aus Glas */
body.direction-b.ocean-concept.website-landing :is(.web-hero,.web-package,.web-process,.web-enquiry,.web-talk) a.elovait-now-button,.website-landing .talk-primary,.website-landing .header-contact{background:linear-gradient(180deg,#f3f8f4e6,#d9e8dcc7);color:#17372c;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--glass-edge),0 10px 28px #0b111347}
body.direction-b.ocean-concept.website-landing :is(.web-problem,.web-references,.web-faq) a.elovait-now-button,.website-landing .web-submit{background:linear-gradient(180deg,#3a7891e6,#22576cdb);color:#fff;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--glass-edge),0 10px 26px #28617947}

/* Karten aus Glas auf dunklem Grund */
.website-landing .package-item,.website-landing .package-item.package-main{background:linear-gradient(135deg,#ffffff1a,#ffffff08);border:1px solid #ffffff21;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--glass-edge),0 18px 40px #0b111340}
/* Karten aus Glas auf hellem Grund */
.website-landing .problem-item{background:linear-gradient(145deg,#ffffffc7,#ffffff8c);border:1px solid #ffffffb3;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--glass-edge),0 16px 40px #17372c1a}
.website-landing .web-faq .faq-items details[open]{background:linear-gradient(145deg,#ffffffbf,#ffffff80);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--glass-edge),0 12px 30px #17372c14}
.website-landing .form-panel{background:linear-gradient(145deg,#f4f9f5e0,#e1ece4c7);border:1px solid #ffffffb3;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--glass-edge),0 24px 50px #0b111359}
.website-landing .form-panel input,.website-landing .form-panel textarea{background:#ffffffa6;border-color:#17372c1f;box-shadow:inset 0 1px 2px #17372c0f}
/* Ablauf-Karten: Glaskante */
.website-landing .offer-grid-steps .offer-item{box-shadow:var(--glass-edge),0 18px 40px #0b111347}
/* Nicola-Fläche: Namensschild aus Glas */
.website-landing .talk-portrait figcaption{background:#0b111340;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--glass-edge)}
/* Kopfzeile wieder wie vorher (ohne Glasleiste) */
.website-landing .web-header{position:relative;top:auto;z-index:2;margin-top:0;padding:28px 0;border-radius:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
.website-landing .web-header::after{content:none}
.website-landing .web-hero{margin-top:-104px}
.website-landing .header-contact{background:#e6f0e7;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 10px 26px #0b111340}
.website-landing .header-contact::after{content:none}
@media(max-width:700px){.website-landing .web-header{padding:22px 0;top:auto;margin-top:0}.website-landing .web-hero{margin-top:-80px}}
body.website-landing header.web-header::after,body.website-landing a.header-contact::after{content:none;display:none}
/* Gespräch: niedriger, Foto zugeschnitten */
.website-landing .web-talk{height:clamp(260px,21vw,320px)}
.website-landing .web-talk .talk-portrait{aspect-ratio:auto;width:clamp(240px,22vw,340px);height:100%}
.website-landing .web-talk .talk-portrait img{object-position:center 12%}
.website-landing .web-talk .talk-panel{padding-block:28px}
.website-landing .web-talk .talk-rule{margin:22px 0}
@media(max-width:800px){.website-landing .web-talk{height:auto}.website-landing .web-talk .talk-portrait{width:100%;height:300px}}
.website-landing .web-talk .talk-portrait img{object-fit:cover;object-position:50% 0;transform:scale(1.35);transform-origin:50% 22%}.website-landing .web-talk .talk-portrait{overflow:hidden}
.website-landing .web-talk .talk-portrait img{transform:none;object-position:50% 30%}
/* Ablauf-Karten: kürzerer Farbblock */
.offer-grid-steps{align-items:start}
.offer-grid-steps .offer-content{padding:18px 18px 20px}
.offer-grid-steps .offer-icon{width:28px;height:28px;margin-bottom:10px}.offer-grid-steps .offer-icon svg{width:28px;height:28px}
.offer-grid-steps .offer-item h3{font-size:18px}
.offer-grid-steps .offer-item p{font-size:13px;line-height:1.6;margin-top:6px}
.offer-grid-steps{align-items:stretch}
/* Process entrances share the once-only, pre-viewport fade with the other sections. */
/* Startbild: echtes elovait-Büro */
.web-hero::before{background-image:url('assets/website-hero-buero3.webp');background-position:center 58%}
@media(max-width:700px){.web-hero::before{background-image:url('assets/website-hero-buero3-960.webp');background-position:70% 55%}}
/* Startbild neu, weniger Verlauf */
.web-hero{--hero-img-h:clamp(340px,46vw,640px)}
.web-hero::before{background-image:url('assets/website-hero-buero3.webp')}
.web-hero::before,.web-hero::after{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 18%);mask-image:linear-gradient(180deg,transparent 0,#000 18%)}
.web-hero::after{background:none}
@media(max-width:700px){.web-hero{--hero-img-h:300px}.web-hero::before{background-image:url('assets/website-hero-buero3-960.webp')}.web-hero::before,.web-hero::after{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 20%);mask-image:linear-gradient(180deg,transparent 0,#000 20%)}}
/* Startbild umgekehrt: oben Bild, darunter Text */
.web-hero{--hero-img-h:clamp(380px,48vw,660px);padding:calc(var(--hero-img-h) - 60px) 0 110px;align-items:flex-start}
.web-hero::before,.web-hero::after{inset:0 0 auto 0;height:var(--hero-img-h);-webkit-mask-image:linear-gradient(180deg,#000 0,#000 62%,transparent 100%);mask-image:linear-gradient(180deg,#000 0,#000 62%,transparent 100%)}
.web-hero::before{transform-origin:50% 40%}
.web-hero::after{background:linear-gradient(180deg,#0b10128c 0%,#0b101200 22%)}
@media(max-width:700px){.web-hero{--hero-img-h:320px;padding:calc(var(--hero-img-h) - 40px) 0 80px}.web-hero::before,.web-hero::after{-webkit-mask-image:linear-gradient(180deg,#000 0,#000 58%,transparent 100%);mask-image:linear-gradient(180deg,#000 0,#000 58%,transparent 100%)}}
/* Startbild wie Referenz: Text kompakt oben, Bild gross darunter, weicher Übergang */
.web-hero{--hero-img-h:clamp(380px,44vw,620px);min-height:0;padding:130px 0 calc(var(--hero-img-h) - 70px);align-items:flex-start}
.web-hero .hero-copy h1{font-size:clamp(36px,3.6vw,54px)}
.web-hero .hero-lead{margin:18px auto 26px}
.web-hero::before,.web-hero::after{inset:auto 0 0 0;height:var(--hero-img-h);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 26%);mask-image:linear-gradient(180deg,transparent 0,#000 26%)}
.web-hero::before{background-position:center 55%;transform-origin:50% 100%}
.web-hero::after{background:none}
@media(max-width:700px){.web-hero{--hero-img-h:300px;padding:110px 0 calc(var(--hero-img-h) - 40px)}.web-hero::before,.web-hero::after{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 28%);mask-image:linear-gradient(180deg,transparent 0,#000 28%)}}
/* Startbild: langer, weicher Übergang wie Referenz */
.web-hero{--hero-img-h:clamp(460px,52vw,760px);padding-bottom:calc(var(--hero-img-h) - 230px)}
.web-hero::before,.web-hero::after{-webkit-mask-image:linear-gradient(180deg,transparent 0%,#0000000d 10%,#00000040 22%,#00000099 36%,#000000d9 48%,#000 60%);mask-image:linear-gradient(180deg,transparent 0%,#0000000d 10%,#00000040 22%,#00000099 36%,#000000d9 48%,#000 60%)}
.web-hero::before{background-position:center 70%}
@media(max-width:700px){.web-hero{--hero-img-h:380px;padding-bottom:calc(var(--hero-img-h) - 130px)}}
/* Startbild: Foto 3 */
.web-hero::before{background-image:url('assets/website-hero-buero3.webp');background-position:center 75%}
@media(max-width:700px){.web-hero::before{background-image:url('assets/website-hero-buero3-960.webp');background-position:68% 75%}}

/* ================================================================
   Box-Stil D überall: Glas-Körper, Icon im Farbkreis mit Rand;
   mit Bild: Bild oben, Icon sitzt auf der Kante. Keine Etiketten.
   ================================================================ */
.website-landing{--d-ic-bg:linear-gradient(135deg,#286179,#4f745d)}
/* gemeinsames Icon */
.website-landing :is(.problem-icon,.package-check,.offer-grid-steps .offer-icon){display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--d-ic-bg);color:#fff;border:3px solid #fff;margin:0 0 16px;box-shadow:0 6px 16px #17372c26}
.website-landing :is(.problem-icon,.package-check,.offer-grid-steps .offer-icon) svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.website-landing :is(.web-package,.web-process) :is(.package-check,.offer-icon){border-color:#1a2a2c}
/* gemeinsame Karte */
.website-landing :is(.problem-item,.package-item,.offer-grid-steps .offer-item){border-radius:16px;border:1px solid #ffffff2e;box-shadow:inset 0 1px 0 #ffffff6b,0 18px 40px #0b111326;-webkit-backdrop-filter:blur(18px) saturate(170%);backdrop-filter:blur(18px) saturate(170%);text-align:left}
/* hell */
.website-landing .problem-item{background:linear-gradient(145deg,#ffffffe0,#ffffffb3);padding:26px 26px 28px}
/* dunkel */
.website-landing .package-item,.website-landing .package-item.package-main,.website-landing .offer-grid-steps .offer-item{background:linear-gradient(135deg,#ffffff1f,#ffffff0a);color:#fff;box-shadow:inset 0 1px 0 #ffffff4d,0 18px 40px #0b111347}
.website-landing :is(.problem-item,.package-item)::after{opacity:.5}
/* Grundangebot: drei Karten nebeneinander */
.website-landing .package-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:1080px}
.website-landing .package-item{display:block;padding:26px 26px 28px}
.website-landing .package-item h3{font-size:20px}
.website-landing .package-item p{margin-top:10px;font-size:14.5px;line-height:1.7}
/* Ablauf: Bild oben, Glas-Körper, Icon auf der Kante */
.website-landing .offer-grid-steps .offer-item{--card-bg:transparent;overflow:hidden}
.website-landing .offer-grid-steps .offer-content{background:none;padding:0 18px 22px}
.website-landing .offer-grid-steps .offer-content::before{display:none}
.website-landing .offer-grid-steps .offer-icon{margin-top:-25px;position:relative;z-index:2}
.website-landing .offer-grid-steps .offer-item h3{color:#fff}
.website-landing .offer-grid-steps .offer-item p{color:#bdd0c6}
@media(max-width:1000px){.website-landing .package-list{grid-template-columns:1fr;max-width:520px}}
/* Startbild: zuerst Bild, dann Text (weicher Übergang nach unten) */
.web-hero{--hero-img-h:clamp(440px,50vw,720px);padding:calc(var(--hero-img-h) - 150px) 0 100px;align-items:flex-start}
.web-hero::before,.web-hero::after{inset:0 0 auto 0;height:var(--hero-img-h);-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 40%,#000000d9 52%,#00000099 64%,#00000040 78%,#0000000d 90%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,#000 40%,#000000d9 52%,#00000099 64%,#00000040 78%,#0000000d 90%,transparent 100%)}
.web-hero::before{background-position:center 70%;transform-origin:50% 40%}
.web-hero::after{background:linear-gradient(180deg,#0b10128c 0%,#0b101200 20%)}
@media(max-width:700px){.web-hero{--hero-img-h:380px;padding:calc(var(--hero-img-h) - 90px) 0 70px}}
@media(max-width:700px){.web-hero::before{background-position:78% 70%}}
/* Problem-Karten: dunkle grüne Glasplatten (Stil B) */
.website-landing .web-problem .problem-item{background:linear-gradient(135deg,#17372cd9,#17372cb3);border:1px solid #ffffff26;color:#fff;box-shadow:inset 0 1px 0 #ffffff6b,inset 0 -1px 0 #ffffff1a,0 18px 40px #0b111340}
.website-landing .web-problem .problem-item::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,#ffffff4d 0%,#ffffff10 25%,transparent 50%,transparent 75%,#ffffff1a 100%);mix-blend-mode:screen;opacity:1}
.website-landing .web-problem .problem-item h3{color:#fff}
.website-landing .web-problem .problem-item p{color:#c9dad2}
.website-landing .web-problem .problem-icon{background:#e6f0e7;color:#17372c;border:0;box-shadow:none}

/* Leistungen: vier Bereiche im bestehenden Ocean-/Forest-Kartensystem. */
.website-landing .web-services .section-intro>.section-eyebrow{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#a3d2db;margin:0 auto 15px}
.website-landing .web-services .package-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;max-width:1080px}
.website-landing .web-services .package-item{display:grid;grid-template-columns:48px minmax(0,1fr);grid-template-rows:auto 1fr;align-items:start;gap:0 22px;padding:32px}
.website-landing .web-services .package-check{margin:0}
.website-landing .web-services .package-item h3{font-size:23px;font-weight:550;line-height:1.25;letter-spacing:-.035em;margin:8px 0 0}
.website-landing .web-services .package-item p{font-size:15px;line-height:1.75;margin-top:14px;max-width:40ch}
.website-landing .web-services .service-features{grid-column:2;align-self:end;list-style:none;padding:20px 0 0;margin:22px 0 0;border-top:1px solid #d2e4dc26;display:grid;gap:10px}
.website-landing .web-services .service-features li{position:relative;padding-left:23px;font-size:13px;line-height:1.55;color:#e5eeea}
.website-landing .web-services .service-features li::before{content:"";position:absolute;left:1px;top:.35em;width:10px;height:6px;border-left:1.5px solid #a3d2db;border-bottom:1.5px solid #a3d2db;transform:rotate(-45deg)}
.website-landing .web-services .package-note{font-size:13px;line-height:1.75;max-width:590px;margin:30px auto 0;color:#bdd0c6}
@media(max-width:1000px){.website-landing .web-services .package-item{grid-template-columns:1fr;padding:28px}.website-landing .web-services .package-check{margin-bottom:15px}.website-landing .web-services .service-features{grid-column:1}.website-landing .web-services .package-item h3{margin-top:0}}
@media(max-width:700px){.website-landing .web-services .package-list{grid-template-columns:1fr;max-width:520px;gap:18px}.website-landing .web-services .package-item{padding:26px}.website-landing .web-services .package-item h3{font-size:23px}.website-landing .web-services .package-item p{font-size:15px;max-width:none}.website-landing .web-services .service-features{margin-top:20px;padding-top:18px}.website-landing .web-services .package-note{font-size:12px}}