:root{--navy:#0b1f4f;--navy-dark:#06122e;--blue:#274b9f;--paper:#f2efe7;--white:#fff;--sand:#d9cdb9;--ink:#10141d;--muted:#59606b;--line:rgba(16,20,29,.17);--shell:min(100% - 2 * clamp(1.2rem,5vw,5rem),88rem);--font:"Avenir Next",Avenir,"Helvetica Neue",Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:96px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);line-height:1.55}a{color:inherit}button{font:inherit}:focus-visible{outline:3px solid #c2410c;outline-offset:4px}.skip-link{position:fixed;z-index:100;left:1rem;top:1rem;padding:.8rem 1rem;background:#fff;transform:translateY(-180%)}.skip-link:focus{transform:none}.section-shell{width:var(--shell);margin-inline:auto}
.site-header{height:92px;padding-inline:clamp(1.2rem,5vw,5rem);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:40;background:rgba(242,239,231,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}.brand{display:flex;align-items:center;text-decoration:none}.brand img{display:block;width:clamp(145px,13vw,190px);height:72px;object-fit:contain;object-position:left center}.main-nav{display:flex;align-items:center;gap:clamp(1.25rem,2.7vw,2.8rem);font-size:.75rem;font-weight:750;letter-spacing:.13em;text-transform:uppercase}.main-nav>a,.nav-dropdown{padding:.8rem 0;border:0;background:none;text-decoration:none;cursor:pointer}.main-nav a:hover,.nav-dropdown:hover{color:var(--blue)}.nav-phone{padding:.82rem 1.1rem!important;background:var(--navy);color:#fff}.nav-phone:hover{background:var(--blue);color:#fff!important}.nav-group{position:relative}.nav-dropdown span{display:inline-block;margin-left:.3rem;transition:transform .2s}.nav-dropdown[aria-expanded=true] span{transform:rotate(180deg)}.dropdown-panel{display:none;position:absolute;right:-9rem;top:calc(100% + 1rem);width:min(650px,86vw);grid-template-columns:1fr 1fr;background:#fff;box-shadow:0 25px 70px rgba(6,18,46,.22);border:1px solid rgba(11,31,79,.12)}.dropdown-panel.open{display:grid}.dropdown-panel>div{padding:1.7rem 2rem 2rem}.dropdown-panel>div:first-child{background:var(--navy);color:#fff}.dropdown-label{margin:0 0 .8rem;font-size:.65rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;opacity:.7}.dropdown-panel a{display:block;padding:.42rem 0;text-decoration:none;text-transform:none;letter-spacing:0;font-size:.95rem;font-weight:500}.menu-toggle{display:none;align-items:center;border:0;background:none;padding:.7rem 0;font-weight:700}.menu-toggle i,.menu-toggle i:after{content:"";display:block;width:24px;height:2px;margin-left:.7rem;background:var(--ink);transition:.2s}.menu-toggle i:after{margin:6px 0 0}.menu-toggle[aria-expanded=true] i{transform:rotate(45deg)}.menu-toggle[aria-expanded=true] i:after{margin-top:0;transform:rotate(-90deg)}
.hero{min-height:calc(100svh - 92px);display:grid;grid-template-columns:minmax(0,1.05fr) minmax(460px,.95fr);position:relative;background:var(--paper);overflow:hidden}.hero-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(4.5rem,8vw,8rem) clamp(2rem,5vw,6rem) clamp(5rem,8vw,8rem) max(1.2rem,calc((100vw - 88rem)/2 + 5rem))}.eyebrow,.section-index{margin:0;color:var(--blue);font-size:.67rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase}.hero h1{max-width:830px;margin:1.2rem 0 1.8rem;color:var(--navy);font-size:clamp(3.6rem,7.2vw,8rem);font-weight:650;letter-spacing:-.075em;line-height:.88}.hero h1 span{display:block;color:transparent;-webkit-text-stroke:1.5px var(--navy)}.hero-lead{max-width:40rem;margin:0;color:#414955;font-size:clamp(1.05rem,1.35vw,1.3rem)}.hero-phone{width:min(100%,430px);display:grid;grid-template-columns:1fr auto;margin-top:2.5rem;padding:1rem 0;border-block:2px solid var(--navy);text-decoration:none}.hero-phone span{font-size:.7rem;font-weight:750;letter-spacing:.12em;text-transform:uppercase}.hero-phone strong{grid-column:1;margin-top:.4rem;color:var(--navy);font-size:clamp(1.25rem,2vw,1.75rem)}.hero-phone i{grid-column:2;grid-row:1/3;align-self:center;font-style:normal;font-size:2rem}.hero-phone:hover{color:var(--blue)}
.hero-explorer{min-height:100%;display:flex;flex-direction:column;padding:clamp(2rem,4vw,4.5rem);background:var(--navy);color:#fff;position:relative;isolation:isolate}.hero-explorer:before{content:"";position:absolute;inset:1.5rem;border:1px solid rgba(255,255,255,.14);z-index:-1}.explorer-head{display:flex;justify-content:space-between;gap:2rem;padding-bottom:1rem;border-bottom:1px solid rgba(255,255,255,.22);font-size:.68rem;letter-spacing:.13em;text-transform:uppercase}.explorer-head p{margin:0}.explorer-tabs{display:grid;grid-template-columns:1fr 1fr;margin-top:clamp(2rem,5vh,4rem);border:1px solid rgba(255,255,255,.3)}.explorer-tabs button{min-height:62px;border:0;background:transparent;color:#fff;font-weight:750;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.explorer-tabs button+button{border-left:1px solid rgba(255,255,255,.3)}.explorer-tabs button[aria-selected=true]{background:var(--sand);color:var(--navy)}.explorer-panel{display:flex;flex:1;flex-direction:column;justify-content:center;padding:clamp(2rem,5vh,4rem) 0}.explorer-panel[hidden]{display:none}.panel-kicker{margin:0 0 1rem;color:#aebee9;font-size:.67rem;font-weight:750;letter-spacing:.15em;text-transform:uppercase}.explorer-panel h2{max-width:550px;margin:0 0 1.5rem;font-size:clamp(2.5rem,4.2vw,4.8rem);font-weight:600;letter-spacing:-.06em;line-height:.92}.explorer-panel ul{list-style:none;margin:0 0 2rem;padding:0;border-top:1px solid rgba(255,255,255,.2)}.explorer-panel li{padding:.6rem 0;border-bottom:1px solid rgba(255,255,255,.2);font-size:.9rem}.explorer-panel>a{width:max-content;font-weight:750;text-underline-offset:.35rem}.explorer-panel>a span{margin-left:.5rem}.explorer-foot{display:flex;justify-content:space-between;gap:2rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.22);font-size:.6rem;letter-spacing:.18em}.scroll-cue{position:absolute;left:50%;bottom:1.4rem;display:flex;align-items:center;gap:.7rem;transform:translateX(-50%);font-size:.65rem;font-weight:750;letter-spacing:.14em;text-decoration:none;text-transform:uppercase}.scroll-cue i{font-style:normal;font-size:1rem}
.services{position:relative;padding-block:clamp(5.5rem,9vw,9rem)}.services-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(3rem,9vw,10rem)}.services-heading{position:sticky;top:130px;align-self:start}.services-heading h2{margin:1.2rem 0 1.4rem;font-size:clamp(2.7rem,4.7vw,5rem);font-weight:600;letter-spacing:-.06em;line-height:.94}.services-heading>p:last-of-type{max-width:27rem}.inline-phone{display:inline-block;margin-top:1rem;font-size:.82rem;font-weight:750;text-underline-offset:.35rem}.inline-phone span{margin-left:.4rem}.services-build{background:#fff;color:var(--navy);overflow:hidden}.services-build .services-heading h2{color:var(--navy)}
.services-design{background:var(--navy-dark);color:#fff;overflow:hidden}.services-design .eyebrow{color:#9eb4eb}.services-design .services-heading>p:last-of-type{color:#b5bfd6}.design-word{position:absolute;right:-2vw;top:-3rem;color:rgba(255,255,255,.03);font-size:clamp(10rem,27vw,27rem);font-weight:800;letter-spacing:-.1em;line-height:1;pointer-events:none}.build-word{color:rgba(11,31,79,.045)}.design-fields{position:relative;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(255,255,255,.25);border-left:1px solid rgba(255,255,255,.25)}.design-fields a{min-height:210px;display:grid;grid-template-columns:1fr auto;align-content:space-between;padding:1.5rem;border-right:1px solid rgba(255,255,255,.25);border-bottom:1px solid rgba(255,255,255,.25);text-decoration:none;transition:background .2s,color .2s}.design-fields a:last-child{grid-column:1/-1}.design-fields a:hover,.design-fields a:focus-visible{background:var(--sand);color:var(--navy)}.design-fields span{font-size:.65rem;letter-spacing:.15em}.design-fields strong{grid-column:1/-1;margin-top:2.5rem;font-size:clamp(1.5rem,2.4vw,2.5rem);font-weight:550;letter-spacing:-.04em}.design-fields small{align-self:end;margin-top:.8rem;opacity:.68}.design-fields i{grid-column:2;grid-row:1/4;align-self:start;font-style:normal;font-size:1.4rem}.build-fields{border-color:rgba(11,31,79,.24)}.build-fields a{color:var(--navy);border-color:rgba(11,31,79,.24)}.build-fields span{color:var(--blue)}.build-fields a:hover,.build-fields a:focus-visible{background:var(--navy);color:#fff}.build-fields a:hover span,.build-fields a:focus-visible span{color:#fff}
.process{padding-block:clamp(5.5rem,10vw,10rem);display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(3rem,9vw,10rem)}.process h2{max-width:560px;margin:1.1rem 0 0;color:var(--navy);font-size:clamp(2.8rem,5vw,5.4rem);font-weight:600;letter-spacing:-.065em;line-height:.94}.process-steps{border-top:2px solid var(--navy)}.process article{display:grid;grid-template-columns:3.2rem 1fr;padding:1.5rem 0;border-bottom:1px solid var(--line)}.process article>span{color:var(--blue);font-size:.65rem;letter-spacing:.15em}.process h3{margin:0;color:var(--navy);font-size:1.45rem;font-weight:600;letter-spacing:-.03em}.process article p{margin:.4rem 0 0;color:var(--muted)}
.faq{padding-block:clamp(5.5rem,9vw,9rem);background:#fff}.faq-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(3rem,9vw,10rem)}.faq-heading{position:sticky;top:130px;align-self:start}.faq-heading h2{margin:1.1rem 0 1.35rem;color:var(--navy);font-size:clamp(2.8rem,4.8vw,5.2rem);font-weight:600;letter-spacing:-.06em;line-height:.94}.faq-heading>p:last-child{max-width:28rem;margin:0;color:var(--muted)}.faq-list{border-top:2px solid var(--navy)}.faq-list details{border-bottom:1px solid var(--line)}.faq-list summary{min-height:92px;display:grid;grid-template-columns:1fr auto;gap:1.5rem;align-items:center;cursor:pointer;list-style:none}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary strong{color:var(--navy);font-size:clamp(1.1rem,1.6vw,1.45rem);font-weight:600;letter-spacing:-.025em}.faq-list summary i{width:2.35rem;height:2.35rem;display:grid;place-items:center;border:1px solid rgba(11,31,79,.25);border-radius:50%;font-style:normal;font-size:1.2rem;transition:transform .2s ease,background-color .2s ease,color .2s ease}.faq-list details[open] summary i{transform:rotate(45deg);background:var(--navy);color:#fff}.faq-list details>div{max-width:46rem;padding:0 4rem 1.6rem 0}.faq-list details p{margin:0;color:var(--muted)}
.contact-form-section{position:relative;padding-block:clamp(5.5rem,9vw,9rem);overflow:hidden;background:var(--navy-dark);color:#fff}.contact-word{position:absolute;right:-.04em;top:-.18em;color:rgba(255,255,255,.025);font-size:clamp(10rem,25vw,25rem);font-weight:800;letter-spacing:-.1em;line-height:1;pointer-events:none}.contact-form-layout{position:relative;display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(3rem,9vw,10rem);align-items:start}.contact-form-intro{position:sticky;top:130px}.contact-form-intro .section-index{color:#9eb4eb}.contact-form-intro h2{margin:1.1rem 0 1.5rem;color:#fff;font-size:clamp(3rem,5.2vw,5.8rem);font-weight:650;letter-spacing:-.065em;line-height:.9}.contact-form-intro h2 span{color:transparent;-webkit-text-stroke:1.4px rgba(255,255,255,.92)}.contact-form-intro>p:last-of-type{max-width:29rem;color:#b5bfd6}.contact-phone{width:min(100%,360px);display:grid;justify-items:center;text-align:center;gap:.3rem;margin-top:2rem;padding:1.1rem 1.6rem;border:0;border-radius:0;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));background:#fff;color:var(--navy);text-decoration:none;box-shadow:0 8px 24px rgba(0,0,0,.18);transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease}.contact-phone small{font-size:.64rem;font-weight:750;letter-spacing:.14em;text-transform:uppercase;opacity:.7}.contact-phone strong{margin-top:.4rem;font-size:clamp(1.2rem,2vw,1.65rem);letter-spacing:.02em}.contact-phone:hover{transform:translateY(-2px);background:var(--sand);box-shadow:0 12px 28px rgba(0,0,0,.22)}.contact-phone:focus-visible{clip-path:none}
.project-form{position:relative;padding:clamp(1.4rem,3vw,2.8rem);background:#fff;color:var(--navy);box-shadow:0 28px 70px rgba(0,0,0,.18)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.form-field{display:grid;gap:.55rem}.form-field-full{grid-column:1/-1}.form-field label{font-size:.72rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase}.form-field label span{color:var(--muted);font-size:.62rem;font-weight:600;letter-spacing:.02em;text-transform:none}.form-field input,.form-field select,.form-field textarea{width:100%;min-height:54px;padding:.85rem 1rem;border:1px solid rgba(11,31,79,.24);border-radius:0;background:#f7f4ee;color:var(--navy);font:inherit;font-size:1rem}.form-field textarea{min-height:155px;resize:vertical}.form-field input:hover,.form-field select:hover,.form-field textarea:hover{border-color:var(--navy)}.form-note{margin:1.5rem 0 0;padding-top:1rem;border-top:1px solid rgba(11,31,79,.15);color:var(--muted);font-size:.78rem}.form-submit{min-width:210px;min-height:58px;margin-top:1.4rem;padding:.9rem 1.4rem;border:0;background:var(--navy);color:#fff;font-weight:800;letter-spacing:.05em;cursor:pointer;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));transition:background-color .2s ease,transform .2s ease}.form-submit:hover{transform:translateY(-2px);background:var(--blue)}.form-submit:focus-visible{clip-path:none}.form-result{margin-top:1.6rem;padding:1.35rem;background:var(--paper);border-left:4px solid var(--blue);color:var(--navy)}.form-result h3{margin:0;font-size:1.25rem}.form-result>p{margin:.4rem 0 1rem;color:var(--muted)}.form-result dl{display:grid;gap:.8rem;margin:0 0 1.1rem}.form-result dl>div{min-width:0;padding-bottom:.65rem;border-bottom:1px solid rgba(11,31,79,.14)}.form-result dt{font-size:.62rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.form-result dd{margin:.2rem 0 0;overflow-wrap:anywhere;white-space:pre-wrap}.form-result>a{font-weight:750;text-underline-offset:.3rem}
.footer{padding-block:3.5rem;background:var(--paper);border-top:1px solid var(--line)}.footer .section-shell{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.brand-footer img{width:190px;height:auto}.footer p{margin:0;color:var(--muted)}.footer-links{grid-column:1/-1;display:flex;justify-content:space-between;padding-top:1.4rem;border-top:1px solid var(--line);color:var(--muted);font-size:.76rem}.footer-links a{text-underline-offset:.3rem}
@media(max-width:980px){html{scroll-padding-top:82px}.site-header{height:82px}.brand img{width:135px;height:64px}.menu-toggle{display:flex}.main-nav{display:none;position:absolute;top:82px;left:0;right:0;max-height:calc(100vh - 82px);overflow:auto;flex-direction:column;align-items:stretch;gap:0;padding:1rem 1.2rem 2rem;background:var(--paper);border-bottom:1px solid var(--line)}.main-nav.open{display:flex}.main-nav>a,.nav-dropdown{display:block;width:100%;padding:1rem 0;text-align:left;border-bottom:1px solid var(--line)}.nav-phone{margin-top:1rem;text-align:center!important}.dropdown-panel{position:static;width:100%;grid-template-columns:1fr;box-shadow:none;border:0}.dropdown-panel>div{padding:1.2rem}.hero{grid-template-columns:1fr;min-height:auto}.hero-copy{min-height:calc(100svh - 82px);padding:5rem 1.2rem 6rem}.hero-explorer{min-height:680px}.scroll-cue{display:none}.services-layout,.process,.faq-layout,.contact-form-layout{grid-template-columns:1fr}.services-heading,.faq-heading,.contact-form-intro{position:static}.design-fields{grid-template-columns:1fr 1fr}.footer .section-shell{grid-template-columns:1fr}.footer-links{flex-direction:column;gap:.8rem}}
@media(max-width:560px){.hero-copy{min-height:calc(100svh - 82px);justify-content:center}.hero h1{font-size:clamp(3.25rem,16vw,5rem)}.hero-explorer{min-height:620px;padding:2rem 1.2rem}.hero-explorer:before{inset:.75rem}.explorer-panel h2{font-size:2.65rem}.design-fields{grid-template-columns:1fr}.design-fields a,.design-fields a:last-child{grid-column:auto;min-height:170px}.faq-list summary{min-height:82px;gap:1rem}.faq-list details>div{padding-right:0}.contact-form-intro h2{font-size:clamp(3.2rem,14vw,4.8rem)}.project-form{padding:1.2rem}.form-grid{grid-template-columns:1fr}.form-field-full{grid-column:auto}.form-submit{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* Flyer-Hero */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.flyer-hero{min-height:calc(100svh - 92px);display:grid;grid-template-columns:1fr 1fr;position:relative;overflow:hidden;background:var(--paper)}
.flyer-half{min-width:0;display:flex;flex-direction:column;padding:clamp(3rem,6vw,6.5rem) clamp(1.5rem,5vw,5.5rem) clamp(13rem,18vw,16rem);position:relative;text-decoration:none;transition:background-color .3s ease}
.flyer-half:after{content:"";position:absolute;inset:1.4rem;border:1px solid currentColor;opacity:.16;pointer-events:none}
.flyer-design{background:var(--navy);color:#fff}.flyer-design:hover,.flyer-design:focus-visible{background:#153578}.flyer-build{background:#f8f7f3;color:var(--navy)}.flyer-build:hover,.flyer-build:focus-visible{background:#e7dfd0}
.flyer-half-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding-bottom:1rem;border-bottom:1px solid currentColor}.flyer-half-head p{margin:0;font-size:clamp(2.4rem,5.2vw,6.2rem);font-weight:650;letter-spacing:-.07em;line-height:.8;text-transform:uppercase}.flyer-half-head span{font-size:.64rem;font-weight:800;letter-spacing:.16em}.flyer-subline{margin:1rem 0 1.4rem;font-size:.68rem;font-weight:750;letter-spacing:.16em;text-transform:uppercase;opacity:.7}.flyer-half ul{list-style:none;margin:0;padding:0;position:relative;z-index:1}.flyer-half li{display:flex;align-items:center;gap:.8rem;padding:.47rem 0;border-bottom:1px solid currentColor;font-size:clamp(.88rem,1.15vw,1.1rem);border-color:color-mix(in srgb,currentColor 20%,transparent);transition:padding-left .2s ease}.flyer-half li:before{content:"";width:.32rem;height:.32rem;flex:0 0 auto;border-radius:50%;background:currentColor}.flyer-half:hover li{padding-left:.35rem}.flyer-action{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-top:auto;padding-top:1.5rem;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.flyer-action i{font-style:normal;font-size:1.8rem;font-weight:300}
.flyer-logo{width:clamp(250px,29vw,430px);aspect-ratio:1681/935;position:absolute;left:50%;bottom:2.7rem;z-index:6;transform:translateX(-50%);pointer-events:none}.flyer-logo img{display:block;width:100%;height:100%;object-fit:contain;clip-path:inset(0 0 0 50%)}.flyer-logo:before{content:"";position:absolute;inset:0;background:url("assets/leonardo-logo.png") center/contain no-repeat;filter:brightness(0) invert(1);clip-path:inset(0 50% 0 0)}
.flyer-phone{position:absolute;left:50%;bottom:.8rem;z-index:7;display:flex;align-items:center;gap:.7rem;transform:translateX(-50%);text-decoration:none;white-space:nowrap;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase}.flyer-phone span{color:#fff}.flyer-phone strong{color:var(--navy);font-size:.8rem}.flyer-phone:hover{text-decoration:underline;text-underline-offset:.25rem}
@media(max-width:980px){.flyer-hero{min-height:calc(100svh - 82px)}.flyer-half{padding:clamp(2.5rem,7vw,4rem) clamp(1.2rem,4vw,3rem) clamp(12rem,22vw,14rem)}.flyer-logo{width:clamp(230px,36vw,340px)}}
@media(max-width:560px){.flyer-hero{min-height:max(calc(100svh - 82px),650px)}.flyer-half{padding:2.2rem .85rem 10.5rem}.flyer-half:after{inset:.55rem}.flyer-half-head{padding-bottom:.7rem}.flyer-half-head p{font-size:clamp(1.8rem,10vw,3rem)}.flyer-subline{min-height:2.2em;margin:.75rem 0 1rem;font-size:.53rem;letter-spacing:.1em}.flyer-half li{gap:.45rem;padding:.36rem 0;font-size:clamp(.66rem,3.1vw,.82rem);line-height:1.25}.flyer-half li:before{width:.22rem;height:.22rem}.flyer-action{font-size:.52rem;letter-spacing:.05em}.flyer-action i{font-size:1.2rem}.flyer-logo{width:min(64vw,250px);bottom:2.5rem}.flyer-phone{bottom:.65rem;gap:.45rem;font-size:.52rem}.flyer-phone strong{font-size:.62rem}}

/* Runde und kantige Aktionsformen */
.flyer-action{width:max-content;min-width:clamp(150px,16vw,220px);min-height:58px;align-items:center;justify-content:center;margin-top:auto;padding:1rem 1.2rem;font-size:.68rem;font-weight:800;letter-spacing:.1em;text-align:center;transition:transform .22s ease,background-color .22s ease,color .22s ease}
.flyer-action i{font-size:1.3rem}.flyer-action-round{background:#fff;color:var(--navy);border-radius:0;clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px))}.flyer-action-angular{background:var(--navy);color:#fff;clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px))}.flyer-half:hover .flyer-action{transform:translateY(-5px)}.flyer-design:hover .flyer-action-round{background:var(--sand)}.flyer-build:hover .flyer-action-angular{background:var(--blue)}.flyer-action:focus-visible{clip-path:none}
.flyer-logo{bottom:.9rem}
.services-build .inline-phone,.services-design .inline-phone{padding:.85rem 1.1rem;border-radius:999px;background:transparent;text-decoration:none}.services-build .inline-phone{border:1px solid rgba(11,31,79,.5);color:var(--navy)}.services-design .inline-phone{border:1px solid rgba(255,255,255,.5)}.services-build .inline-phone:hover{background:var(--navy);color:#fff}.services-design .inline-phone:hover{background:#fff;color:var(--navy)}
@media(max-width:560px){.flyer-action{min-width:0;width:100%;min-height:44px;padding:.65rem .7rem;font-size:.48rem;letter-spacing:.04em}.flyer-action i{font-size:.9rem}.flyer-action-angular,.flyer-action-round{clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px))}.flyer-logo{bottom:.45rem}}

/* Header-Überarbeitung */
.site-header,.main-nav,.nav-dropdown,.nav-phone{font-family:var(--font)}
.main-nav{gap:clamp(1.2rem,2.3vw,2.5rem);font-size:.88rem;font-weight:600;letter-spacing:-.01em;text-transform:none}
.main-nav>a:not(.nav-phone),.nav-dropdown{position:relative;padding:.85rem .1rem}.main-nav>a:not(.nav-phone):after,.nav-dropdown:after{content:"";position:absolute;left:0;right:100%;bottom:.5rem;height:1px;background:var(--navy);transition:right .2s ease}.main-nav>a:not(.nav-phone):hover:after,.nav-dropdown:hover:after,.nav-dropdown[aria-expanded=true]:after{right:0}
.nav-phone{min-width:210px;min-height:60px;display:flex!important;align-items:center;gap:.8rem;padding:.55rem 1rem .55rem .6rem!important;border-radius:999px;background:var(--navy);color:#fff;text-align:left!important;line-height:1;text-transform:none;box-shadow:0 8px 24px rgba(11,31,79,.16);transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease}
.nav-phone:hover{transform:translateY(-2px);background:var(--blue);box-shadow:0 12px 28px rgba(11,31,79,.24)}.phone-copy{display:grid;gap:.28rem}.phone-copy small{font-size:.61rem;font-weight:650;letter-spacing:.1em;text-transform:uppercase;opacity:.78}.phone-copy strong{font-size:1rem;font-weight:650;letter-spacing:.015em;font-variant-numeric:tabular-nums}
@media(max-width:980px){.main-nav{font-size:1rem}.nav-phone{width:100%;justify-content:center;margin-top:1rem!important;border-radius:14px}.phone-copy{min-width:140px}.main-nav>a:not(.nav-phone):after,.nav-dropdown:after{display:none}}

/* Moderner Telefon-Chip */
.nav-phone{min-width:218px;min-height:58px;padding:.6rem 1.3rem!important;position:relative;isolation:isolate;border:0;border-radius:0;--phone-shape:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));clip-path:var(--phone-shape);background:var(--blue)!important;color:var(--ink);box-shadow:none}.nav-phone::before{content:"";position:absolute;inset:1px;z-index:0;clip-path:var(--phone-shape);background:var(--paper);transition:background-color .2s ease}.nav-phone .phone-copy{position:relative;z-index:1}.phone-copy{gap:.25rem}.phone-copy small{color:var(--muted);font-size:.58rem;font-weight:700;letter-spacing:.12em;opacity:1}.phone-copy strong{color:var(--ink);font-size:1.02rem;font-weight:650;letter-spacing:.02em}.nav-phone:hover{transform:translateY(-2px);box-shadow:none}.nav-phone:hover::before{background:var(--blue)}.nav-phone:hover .phone-copy small{color:rgba(255,255,255,.78)}.nav-phone:hover .phone-copy strong{color:#fff}.nav-phone:focus-visible{clip-path:none}.nav-phone:focus-visible::before{clip-path:none}
@media(max-width:980px){.nav-phone{min-height:64px;border-radius:0}.phone-copy{min-width:145px}}

/* Leistungsunterseiten sind vollständig in service-pages.css gekapselt. */

/* Startseite: Leistungsfelder ohne Richtungspfeile und Designnummern */
.design-fields a{grid-template-columns:1fr}
.services-design .design-fields strong{margin-top:0}

/* Kompakte Leistungsboards: je Bereich vollständig in einer Desktop-Ansicht */
.nav-phone{min-width:228px;min-height:64px}
@media(min-width:981px){
  .services{min-height:calc(100svh - 92px);display:flex;align-items:center;padding-block:clamp(2.25rem,4vh,3.5rem)}
  .services-layout{grid-template-columns:minmax(220px,.48fr) minmax(0,1.52fr);gap:clamp(2.5rem,5vw,5rem);align-items:center}
  .services-heading{position:static}
  .services-heading h2{margin:.85rem 0 1rem;font-size:clamp(2.65rem,4vw,4.5rem)}
  .design-fields a{min-height:clamp(145px,19vh,180px);padding:clamp(1rem,1.6vw,1.4rem)}
  .design-fields strong{margin-top:clamp(.7rem,1.8vh,1.2rem);font-size:clamp(1.2rem,1.8vw,2rem);line-height:1;overflow-wrap:anywhere}
  .design-fields small{margin-top:.5rem;font-size:.72rem}
  .services-build .design-fields{grid-template-columns:repeat(12,minmax(0,1fr))}
  .services-build .design-fields a{grid-column:span 3}
  .services-build .design-fields a:nth-child(n+5){grid-column:span 4}
  .services-design .design-fields{grid-template-columns:repeat(6,minmax(0,1fr))}
  .services-design .design-fields a{grid-column:span 2}
  .services-design .design-fields a:nth-child(n+4){grid-column:span 3}
  .services-design .design-fields strong{margin-top:0}
}

/* Referenzdesign: Individuelles Design auf der Startseite */
.services-design{
  --design-electric:#2d5ed9;
  --design-slant:clamp(24px,4.2vw,68px);
  background:var(--paper);
  color:var(--navy)
}
.services-design>.design-word{display:none}
.services-design .eyebrow{color:var(--design-electric)}
.services-design .services-heading>p:last-of-type{color:var(--muted)}
.services-design .inline-phone{display:inline-flex;align-items:center;justify-content:center;gap:1.1rem;border:0;border-radius:0;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));background:#fff;color:var(--navy);white-space:nowrap;transition:transform .2s ease,background-color .2s ease,color .2s ease}
.services-design .inline-phone:hover{transform:translateY(-2px);background:var(--sand);color:var(--navy)}
.services-design .inline-phone:focus-visible{clip-path:none}
.services-design .design-cta-arrow{margin:0;font-size:1rem;font-weight:500;line-height:1}
.services-design .design-fields{border:0;gap:clamp(8px,1vw,14px)}
.services-design .design-fields a{
  --card-shape:polygon(0 0,100% 0,calc(100% - var(--design-slant)) 100%,0 100%);
  --card-surface:var(--navy);
  min-width:0;
  position:relative;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:clamp(1.3rem,2.2vw,2.2rem) calc(var(--design-slant) + clamp(.8rem,1.2vw,1.25rem)) clamp(1.3rem,2.2vw,2.2rem) clamp(1.35rem,2.4vw,2.4rem);
  border:0;
  background:transparent;
  color:#fff;
  text-decoration:none;
  transition:transform .2s ease,filter .2s ease
}
.services-design .design-fields a:nth-child(2),
.services-design .design-fields a:nth-child(3),
.services-design .design-fields a:nth-child(5){
  --card-shape:polygon(var(--design-slant) 0,100% 0,calc(100% - var(--design-slant)) 100%,0 100%);
  padding-left:calc(var(--design-slant) + clamp(.8rem,1.2vw,1.25rem))
}
.services-design .design-fields a::before,
.services-design .design-fields a::after{
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  clip-path:var(--card-shape);
  background:var(--card-surface);
  pointer-events:none;
  transition:background-color .2s ease
}
.services-design .design-fields a::after{content:none;z-index:1}
.services-design .design-fields a:nth-child(2),
.services-design .design-fields a:nth-child(4){color:var(--navy)}
.services-design .design-fields a:nth-child(2)::after,
.services-design .design-fields a:nth-child(4)::after{
  content:"";
  inset:1px;
  background:var(--paper)
}
.services-design .design-fields a:nth-child(3){--card-surface:var(--design-electric)}
.services-design .design-fields a>*{position:relative;z-index:2}
.services-design .design-fields .design-card-number{margin:0;color:#79a1ff;font-size:.78rem;font-weight:500;letter-spacing:.02em}
.services-design .design-fields a:nth-child(2) .design-card-number,
.services-design .design-fields a:nth-child(4) .design-card-number{color:var(--design-electric)}
.services-design .design-fields strong{margin:0;font-size:clamp(1.55rem,2.35vw,2.5rem);font-weight:650;letter-spacing:-.045em;line-height:1.05;overflow-wrap:anywhere}
.services-design .design-fields a:hover,
.services-design .design-fields a:focus-visible{background:transparent;transform:translateY(-3px);filter:brightness(1.04)}
.services-design .design-fields a:nth-child(1):hover,
.services-design .design-fields a:nth-child(1):focus-visible,
.services-design .design-fields a:nth-child(5):hover,
.services-design .design-fields a:nth-child(5):focus-visible{--card-surface:#153578}
.services-design .design-fields a:nth-child(3):hover,
.services-design .design-fields a:nth-child(3):focus-visible{--card-surface:var(--navy)}
.services-design .design-fields a:nth-child(2):hover::after,
.services-design .design-fields a:nth-child(2):focus-visible::after,
.services-design .design-fields a:nth-child(4):hover::after,
.services-design .design-fields a:nth-child(4):focus-visible::after{background:#fff}
.services-design .design-fields a:focus-visible{outline-offset:-6px}
@media(min-width:981px){
  .services-design{padding-block:clamp(3rem,6vh,5rem)}
  .services-design .services-layout{display:block}
  .services-design .services-heading{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"label action" "title action" "copy action";
    align-items:center;
    column-gap:clamp(3rem,8vw,9rem);
    margin-bottom:clamp(2.5rem,5vh,4rem)
  }
  .services-design .services-heading .eyebrow{grid-area:label}
  .services-design .services-heading h2{grid-area:title;max-width:none;margin:.9rem 0 1rem;color:var(--navy);font-size:clamp(3.2rem,5vw,5rem);line-height:.92;white-space:nowrap}
  .services-design .services-heading>p:last-of-type{grid-area:copy;margin:0}
  .services-design .services-heading .inline-phone{grid-area:action;min-width:245px;min-height:60px;margin:0;padding:1rem 1.7rem}
  .services-design .design-fields a{min-height:clamp(165px,20vh,195px)}
}
@media(max-width:980px){
  .services-design{padding-block:clamp(4rem,8vw,6rem)}
  .services-design .services-layout{display:block}
  .services-design .services-heading{display:block;margin-bottom:clamp(2.2rem,6vw,3.5rem)}
  .services-design .services-heading h2{max-width:12ch;margin:1rem 0 1.2rem;color:var(--navy);font-size:clamp(3rem,8vw,4.8rem);line-height:.94}
  .services-design .services-heading .inline-phone{min-height:56px;margin-top:1.4rem;padding:.9rem 1.35rem}
  .services-design .design-fields a{min-height:170px}
}
@media(max-width:560px){
  .services-design{--design-slant:22px;padding-block:3.5rem}
  .services-design .services-heading h2{font-size:clamp(3rem,14vw,4.3rem)}
  .services-design .design-fields{gap:8px}
  .services-design .design-fields a{min-height:145px;padding:1.25rem calc(var(--design-slant) + 1rem) 1.25rem 1.25rem}
  .services-design .design-fields a:nth-child(2),
  .services-design .design-fields a:nth-child(3),
  .services-design .design-fields a:nth-child(5){padding-left:calc(var(--design-slant) + 1rem)}
  .services-design .design-fields strong{font-size:clamp(1.55rem,8vw,2.2rem)}
}
@media(prefers-reduced-motion:reduce){.services-design .design-fields a:hover,.services-design .design-fields a:focus-visible{transform:none}}

/* Referenzdesign: Bau / Haus / Objekt auf der Startseite */
.services-build{
  --build-electric:#2d5ed9;
  --build-slant:clamp(20px,2.5vw,48px);
  background:#fff;
  color:var(--navy)
}
.services-build>.build-word{display:none}
.services-build .eyebrow{color:var(--build-electric)}
.services-build .services-heading>p:last-of-type{color:var(--muted)}
.services-build .inline-phone{display:inline-flex;align-items:center;justify-content:center;gap:1.1rem;border:0;border-radius:0;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));background:var(--navy);color:#fff;white-space:nowrap;transition:transform .2s ease,background-color .2s ease,color .2s ease}
.services-build .inline-phone:hover{transform:translateY(-2px);background:var(--blue);color:#fff}
.services-build .inline-phone:focus-visible{clip-path:none}
.services-build .build-cta-arrow{margin:0;font-size:1rem;font-weight:500;line-height:1}
.services-build .build-fields{border:0;gap:clamp(8px,.85vw,12px)}
.services-build .build-fields a{
  --card-shape:polygon(0 0,100% 0,calc(100% - var(--build-slant)) 100%,0 100%);
  --card-surface:var(--navy);
  min-width:0;
  position:relative;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:clamp(1.2rem,1.8vw,1.8rem) calc(var(--build-slant) + clamp(.7rem,1vw,1.05rem)) clamp(1.2rem,1.8vw,1.8rem) clamp(1.2rem,1.8vw,1.8rem);
  border:0;
  background:transparent;
  color:#fff;
  text-decoration:none;
  transition:transform .2s ease,filter .2s ease
}
.services-build .build-fields a:nth-child(2),
.services-build .build-fields a:nth-child(3),
.services-build .build-fields a:nth-child(4),
.services-build .build-fields a:nth-child(6),
.services-build .build-fields a:nth-child(7){
  --card-shape:polygon(var(--build-slant) 0,100% 0,calc(100% - var(--build-slant)) 100%,0 100%);
  padding-left:calc(var(--build-slant) + clamp(.7rem,1vw,1.05rem))
}
.services-build .build-fields a::before,
.services-build .build-fields a::after{
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  clip-path:var(--card-shape);
  background:var(--card-surface);
  pointer-events:none;
  transition:background-color .2s ease
}
.services-build .build-fields a::after{content:none;z-index:1}
.services-build .build-fields a:nth-child(2),
.services-build .build-fields a:nth-child(5){color:var(--navy)}
.services-build .build-fields a:nth-child(2)::after,
.services-build .build-fields a:nth-child(5)::after{
  content:"";
  inset:1px;
  background:#fff
}
.services-build .build-fields a:nth-child(3),
.services-build .build-fields a:nth-child(6){--card-surface:var(--build-electric)}
.services-build .build-fields a>*{position:relative;z-index:2}
.services-build .build-fields .build-card-number{margin:0;color:#79a1ff;font-size:.75rem;font-weight:500;letter-spacing:.02em}
.services-build .build-fields a:nth-child(2) .build-card-number,
.services-build .build-fields a:nth-child(5) .build-card-number{color:var(--build-electric)}
.services-build .build-fields strong{margin:0;font-size:clamp(1.2rem,1.55vw,1.75rem);font-weight:650;letter-spacing:-.045em;line-height:1.05;overflow-wrap:anywhere}
.services-build .build-fields a:hover,
.services-build .build-fields a:focus-visible{background:transparent;color:#fff;transform:translateY(-3px);filter:brightness(1.04)}
.services-build .build-fields a:nth-child(2):hover,
.services-build .build-fields a:nth-child(2):focus-visible,
.services-build .build-fields a:nth-child(5):hover,
.services-build .build-fields a:nth-child(5):focus-visible{color:var(--navy)}
.services-build .build-fields a:nth-child(1):hover,
.services-build .build-fields a:nth-child(1):focus-visible,
.services-build .build-fields a:nth-child(4):hover,
.services-build .build-fields a:nth-child(4):focus-visible,
.services-build .build-fields a:nth-child(7):hover,
.services-build .build-fields a:nth-child(7):focus-visible{--card-surface:#153578}
.services-build .build-fields a:nth-child(3):hover,
.services-build .build-fields a:nth-child(3):focus-visible,
.services-build .build-fields a:nth-child(6):hover,
.services-build .build-fields a:nth-child(6):focus-visible{--card-surface:var(--navy)}
.services-build .build-fields a:nth-child(2):hover::after,
.services-build .build-fields a:nth-child(2):focus-visible::after,
.services-build .build-fields a:nth-child(5):hover::after,
.services-build .build-fields a:nth-child(5):focus-visible::after{background:var(--paper)}
.services-build .build-fields a:focus-visible{outline-offset:-6px}
@media(min-width:981px){
  .services-build{padding-block:clamp(3rem,5vh,4.5rem)}
  .services-build .services-layout{display:block}
  .services-build .services-heading{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"label action" "title action" "copy action";
    align-items:center;
    column-gap:clamp(3rem,8vw,9rem);
    margin-bottom:clamp(2rem,4vh,3rem)
  }
  .services-build .services-heading .eyebrow{grid-area:label}
  .services-build .services-heading h2{grid-area:title;max-width:none;margin:.8rem 0 .9rem;color:var(--navy);font-size:clamp(3rem,4.6vw,4.6rem);line-height:.92;white-space:nowrap}
  .services-build .services-heading>p:last-of-type{grid-area:copy;margin:0}
  .services-build .services-heading .inline-phone{grid-area:action;min-width:245px;min-height:60px;margin:0;padding:1rem 1.7rem}
  .services-build .build-fields a{min-height:clamp(175px,20vh,195px)}
}
@media(max-width:980px){
  .services-build{padding-block:clamp(4rem,8vw,6rem)}
  .services-build .services-layout{display:block}
  .services-build .services-heading{display:block;margin-bottom:clamp(2.2rem,6vw,3.5rem)}
  .services-build .services-heading h2{max-width:12ch;margin:1rem 0 1.2rem;color:var(--navy);font-size:clamp(3rem,8vw,4.8rem);line-height:.94}
  .services-build .services-heading .inline-phone{min-height:56px;margin-top:1.4rem;padding:.9rem 1.35rem}
  .services-build .build-fields a{min-height:170px}
}
@media(max-width:560px){
  .services-build{--build-slant:22px;padding-block:3.5rem}
  .services-build .services-heading h2{font-size:clamp(3rem,14vw,4.3rem)}
  .services-build .build-fields{gap:8px}
  .services-build .build-fields a{min-height:145px;padding:1.25rem calc(var(--build-slant) + 1rem) 1.25rem 1.25rem}
  .services-build .build-fields a:nth-child(2),
  .services-build .build-fields a:nth-child(3),
  .services-build .build-fields a:nth-child(4),
  .services-build .build-fields a:nth-child(6),
  .services-build .build-fields a:nth-child(7){padding-left:calc(var(--build-slant) + 1rem)}
  .services-build .build-fields strong{font-size:clamp(1.45rem,7.5vw,2rem)}
}
@media(prefers-reduced-motion:reduce){.services-build .build-fields a:hover,.services-build .build-fields a:focus-visible{transform:none}}

/* Referenzdesign: So beginnt Ihr Projekt */
.process-reference{
  --process-electric:#2259d6;
  --process-intro:var(--navy);
  --process-panel:#06132f;
  --process-card:#0a214d;
  --process-paper:#f3f0e8;
  --process-step-gap:clamp(1rem,2.4vh,1.5rem);
  width:100%;
  min-height:calc(100svh - 92px);
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:minmax(320px,32.5%) minmax(0,1fr);
  gap:0;
  overflow:hidden;
  background:var(--process-panel)
}
.process-reference>header{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(3rem,6vh,5rem) clamp(2rem,5.25vw,5.25rem);
  padding-bottom:clamp(6rem,16vh,10rem);
  background:var(--process-intro);
  color:#fff
}
.process-reference>header .section-index{
  color:#fff;
  font-size:.7rem;
  letter-spacing:.26em;
  opacity:.9
}
.process-reference>header h2{
  max-width:370px;
  margin:1.65rem 0 0;
  color:#fff;
  font-size:clamp(2.75rem,4.25vw,4.25rem);
  font-weight:650;
  letter-spacing:-.055em;
  line-height:1.08
}
.process-reference .process-steps{
  min-width:0;
  display:grid;
  grid-template-rows:repeat(3,minmax(145px,22vh));
  align-content:center;
  justify-items:center;
  gap:var(--process-step-gap);
  padding:clamp(2rem,4.9vh,2.75rem) clamp(2rem,4.4vw,4.4rem);
  border:0;
  background:var(--process-panel)
}
.process-reference .process-steps article{
  width:100%;
  min-width:0;
  min-height:0;
  display:block;
  padding:clamp(1.65rem,2.15vw,2.15rem);
  border:0;
  background:var(--process-card);
  color:#fff;
  transition:background-color .18s ease,border-color .18s ease,filter .18s ease
}
.process-reference .process-steps article:first-child{
  border:1px solid #37496d
}
.process-reference .process-steps article:nth-child(2){
  width:calc(100% - clamp(2rem,3.15vw,3.15rem));
  margin-inline:auto;
  padding-inline:clamp(2.65rem,3.4vw,3.4rem);
  clip-path:polygon(clamp(14px,1.4vw,22px) 0,100% 0,calc(100% - clamp(14px,1.4vw,22px)) 100%,0 100%);
  background:var(--process-electric)
}
.process-reference .process-steps article:nth-child(3){
  width:calc(100% - clamp(3rem,4.4vw,4.4rem));
  margin-inline:auto;
  padding-inline:clamp(3.8rem,5.9vw,5.9rem);
  clip-path:polygon(clamp(32px,4vw,64px) 0,100% 0,calc(100% - clamp(32px,4vw,64px)) 100%,0 100%);
  background:var(--process-paper);
  color:var(--navy)
}
.process-reference .process-steps article>span{
  display:block;
  color:#79a1ff;
  font-size:clamp(.82rem,1vw,1rem);
  font-weight:500;
  letter-spacing:.02em;
  line-height:1.2
}
.process-reference .process-steps article:nth-child(2)>span{color:#dce7ff}
.process-reference .process-steps article:nth-child(3)>span{color:var(--process-electric)}
.process-reference .process-steps h3{
  margin:clamp(1.35rem,2.5vh,1.75rem) 0 .55rem;
  color:inherit;
  font-size:clamp(1.75rem,2.4vw,2.5rem);
  font-weight:650;
  letter-spacing:-.035em;
  line-height:1.08
}
.process-reference .process-steps p{
  margin:0;
  color:#b8c0d0;
  font-size:clamp(.92rem,1.08vw,1.08rem);
  line-height:1.5
}
.process-reference .process-steps article:nth-child(2) p{color:#e4eafa}
.process-reference .process-steps article:nth-child(3) p{color:#647083}
.process-reference .process-steps article>div{transition:transform .18s ease}
@media(hover:hover) and (pointer:fine){
  .process-reference .process-steps article:hover{
    filter:brightness(1.04) drop-shadow(0 16px 22px rgba(0,0,0,.24))
  }
  .process-reference .process-steps article:hover>div{transform:translateX(8px)}
  .process-reference .process-steps article:first-child:hover{
    border-color:#7897cf;
    background:#123167
  }
  .process-reference .process-steps article:nth-child(2):hover{background:#2d68e6}
  .process-reference .process-steps article:nth-child(3):hover{background:#fff}
}
@media(max-width:980px){
  .process-reference{
    min-height:auto;
    grid-template-columns:1fr
  }
  .process-reference>header{
    min-height:420px;
    padding:4.5rem clamp(1.2rem,8vw,4rem)
  }
  .process-reference>header h2{
    max-width:370px;
    font-size:clamp(3.4rem,9vw,5rem)
  }
  .process-reference .process-steps{
    grid-template-rows:none;
    --process-step-gap:1rem;
    padding:clamp(2rem,7vw,4rem) clamp(1.2rem,7vw,4rem)
  }
  .process-reference .process-steps article{
    min-height:170px;
    padding:1.6rem
  }
  .process-reference .process-steps article:nth-child(2),
  .process-reference .process-steps article:nth-child(3){
    width:100%;
    margin-inline:0
  }
  .process-reference .process-steps article:nth-child(2){
    padding-inline:2.2rem;
    clip-path:polygon(16px 0,100% 0,calc(100% - 16px) 100%,0 100%)
  }
  .process-reference .process-steps article:nth-child(3){
    padding-inline:2.75rem;
    clip-path:polygon(28px 0,100% 0,calc(100% - 28px) 100%,0 100%)
  }
}
@media(max-width:560px){
  .process-reference>header{
    min-height:390px;
    padding:3.75rem 1.2rem
  }
  .process-reference>header h2{
    font-size:clamp(3.15rem,16vw,4.3rem)
  }
  .process-reference .process-steps{padding:1.5rem 1.2rem 2.5rem}
  .process-reference .process-steps article{min-height:165px;padding:1.4rem}
  .process-reference .process-steps article:nth-child(2){padding-inline:1.85rem}
  .process-reference .process-steps article:nth-child(3){padding-inline:2.25rem}
  .process-reference .process-steps h3{font-size:clamp(1.7rem,8vw,2.2rem)}
}
@media(prefers-reduced-motion:reduce){
  .process-reference .process-steps article:hover>div{transform:none}
}