:root{--navy:#24406f;--navyd:#16294a;--red:#b5424a;--tint:#f2b8bc;--slate:#8791a0;--bg:#f3f5f8;--ink:#1d2430;--mute:#5d6676;--line:#dde1e8}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:16px/1.65 Inter,system-ui,sans-serif;color:var(--ink);background:#fff}
h1,h2,h3,h4{font-family:Manrope,Inter,sans-serif;line-height:1.2;margin:0 0 .5em;color:var(--navyd);font-weight:500}
h1{font-size:clamp(30px,4vw,44px)}h2{font-size:clamp(26px,3.4vw,38px)}h3{font-size:20px}
p{margin:0 0 1em;color:var(--mute);max-width:62ch}a{color:inherit}
.wrap{max-width:1160px;margin:0 auto;padding:0 20px}.rel{position:relative}
.two{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}.c{text-align:center}.c p{margin-inline:auto}
.ic{width:1em;height:1em;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.14em;flex:none}
.hand{font:500 26px/1.2 Caveat,'Segoe Script',cursive;color:#fff;display:inline-block}.hand.dk{color:var(--navy)}.hand.rd{color:var(--red)}
.arw{width:60px;height:26px;vertical-align:middle;margin-left:6px}
.util{background:var(--slate);color:#fff;font-size:12px}.util .wrap{display:flex;justify-content:center;flex-wrap:wrap}
.util a{display:flex;align-items:center;gap:7px;padding:9px 20px;text-decoration:none;border-right:1px solid rgba(255,255,255,.25)}.util a:first-child{border-left:1px solid rgba(255,255,255,.25)}
header{background:#fff;position:sticky;top:0;z-index:30;border-bottom:1px solid var(--line)}
.hd{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:92px}
.logo{height:62px;width:auto;display:block}.brand{font:700 18px Manrope;text-decoration:none;color:var(--navyd)}
nav{display:flex;align-items:center;gap:26px;font:600 12px Manrope;text-transform:uppercase;letter-spacing:.06em}
nav>a:not(.btn){text-decoration:none;color:var(--mute);padding:6px 0}nav a.on{color:var(--navyd);box-shadow:0 2px 0 var(--red)}nav>a:not(.btn):hover{color:var(--navyd)}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--navyd);color:#fff!important;padding:12px 22px;border-radius:2px;font:600 12px Manrope;text-transform:uppercase;letter-spacing:.06em;text-decoration:none;border:1px solid var(--navyd);cursor:pointer}
.btn:not(.out):after{content:"›";font-size:18px;line-height:1}.btn:hover{background:var(--navy);border-color:var(--navy)}nav .btn{padding:10px 16px}
.btn.out{background:#fff;color:var(--navy)!important;border-color:var(--navy)}.btn.out:hover{background:var(--bg)}
.burger{display:none;background:none;border:1px solid var(--line);padding:8px 14px;font:600 14px Manrope;border-radius:3px}
:focus-visible{outline:3px solid var(--red);outline-offset:2px}
/* hero */
.hero{position:relative;overflow:hidden;color:#fff;background:linear-gradient(100deg,#56627a 0%,#6e798c 45%,#aeb6c3 70%,#e3e6eb 100%);padding-top:56px}
.sw{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;filter:blur(1.5px)}
.hero .hero-img{position:absolute;right:0;top:0;bottom:0;width:62%;aspect-ratio:auto;border-radius:0;background:transparent;-webkit-mask-image:linear-gradient(to right,transparent,#000 40%);mask-image:linear-gradient(to right,transparent,#000 40%)}
.hero .hero-img img{object-position:right center}
.hero .two{grid-template-columns:1fr 1fr;align-items:start}.htxt{position:relative;z-index:2;max-width:500px;padding-bottom:70px}
.hero h1,.hero p{color:#fff}.hero p{font-weight:500;font-size:17px}.hero .btn{background:var(--navyd)}
.hero.sm{padding:48px 0 0}.hero.sm .htxt{padding-bottom:54px}
.fbw{position:relative;z-index:3;padding-bottom:34px}.fbw .hand{margin-bottom:8px}
.findbar{display:flex;align-items:stretch;background:#fff;box-shadow:0 6px 24px rgba(22,41,74,.2);min-height:58px}
.sq{display:grid;place-items:center;width:58px;color:#fff;font-size:24px;flex:none}.sq.r{background:var(--red)}.sq.n{background:var(--navy)}
.findbar select{flex:1;min-width:0;border:0;padding:0 18px;font:16px Inter;background:#fff;color:var(--ink)}
.cov{display:flex;align-items:center;gap:12px;padding-right:18px;font-size:13px;color:var(--mute);border-left:1px solid var(--line)}.cov .sq{align-self:stretch}
.badge{background:var(--red);color:#fff;font:700 15px Manrope;padding:3px 8px}.findbar .btn{border-radius:0;padding-inline:26px}
/* intro */
.intro{position:relative;background:#fff;padding:84px 0 96px}.intro h2{max-width:14em}.s{font-size:15px}
.laurels{display:flex;gap:8px;margin-top:26px;flex-wrap:wrap}.lau{width:104px;height:104px}
.imacw{max-width:470px;margin:0 auto;width:100%}.imac{background:#e4e7eb;border:1px solid #c9ced6;border-radius:10px 10px 3px 3px;padding:12px 12px 34px;box-shadow:0 10px 26px rgba(22,41,74,.18)}
.screen{background:#111;border:1px solid #9aa1ac}.screen .ph{aspect-ratio:16/10;border-radius:0}
.stand{width:96px;height:56px;margin:0 auto;background:linear-gradient(#cdd2d9,#a9afb9);clip-path:polygon(20% 0,80% 0,100% 100%,0 100%)}.base{width:190px;height:8px;margin:0 auto;background:#c0c6ce;border-radius:0 0 40px 40px}
.ribbon{position:absolute;top:-84px;right:20px;width:250px;height:170px;background:var(--red);clip-path:polygon(0 0,100% 0,100% 100%);color:#fff;text-decoration:none;padding:20px 18px;text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-size:13px;line-height:1.3}
.ribbon span{font-size:26px}.ribbon b{font:500 14px Manrope;max-width:90px}
.notch{position:absolute;left:50%;bottom:-26px;width:52px;height:52px;margin-left:-26px;border-radius:50%;background:#fff;color:var(--slate);display:grid;place-items:center;font-size:22px;z-index:4;box-shadow:0 2px 6px rgba(0,0,0,.08)}.notch.g{background:var(--slate);color:#fff;box-shadow:none}
/* cards */
.range{background:var(--bg);padding:84px 0 90px}.range .hand{margin-bottom:16px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);position:relative}
.card{position:relative;padding:34px 30px 26px;color:#fff;text-decoration:none;display:flex;flex-direction:column;min-height:290px}
.card h3{color:#fff;font-size:22px;margin:18px 0 10px}.card p{color:#fff;opacity:.92;flex:1;font-size:15px}.navy h3{color:var(--tint)}
.more{font:600 13px Manrope;display:inline-flex;align-items:center;gap:4px}.card .more{color:#fff}
.wv{display:flex;align-items:center;gap:7px;font-size:46px;color:rgba(255,255,255,.92)}.wv i{width:14px;height:40px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;opacity:.7}.wv i.r{border-right-color:currentColor;border-left-color:transparent}
.navy{background:var(--navy)}.red{background:var(--red)}.slate{background:var(--slate)}
.tab{position:absolute;right:-21px;top:50%;margin-top:-21px;width:42px;height:42px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 2px 8px rgba(0,0,0,.18);z-index:3;font-size:20px}.navy .tab{color:var(--navy)}.red .tab{color:var(--red)}
/* bands */
.band{position:relative;min-height:480px;display:flex;align-items:center;color:#fff;background:var(--navyd)}
.band .ph{position:absolute;inset:0;aspect-ratio:auto;border-radius:0}.band:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(22,41,74,.9),rgba(22,41,74,.5) 50%,rgba(22,41,74,.05))}
.band .wrap{position:relative;z-index:2;width:100%;padding-block:60px}.bandtxt{max-width:520px}.bandtxt h2,.bandtxt p{color:#fff}.bandtxt p{font-size:15px}
.go{display:inline-flex;align-items:center;gap:14px;color:#fff;text-decoration:none;font:500 22px Manrope;margin-top:10px}.go .ic{font-size:52px;stroke-width:1.1}
.cn:before{background:linear-gradient(90deg,rgba(10,20,40,.55),rgba(10,20,40,.15) 60%,transparent)}
/* solar tiles */
.solar{padding:80px 0;background:#fff}.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:30px}
.tile{display:flex;flex-direction:column;border:1px solid var(--line);border-top:4px solid var(--red);padding:26px 22px;text-decoration:none;background:#fff}
.tile>.ic{font-size:40px;color:var(--navy);margin-bottom:14px}.tile h3{font-size:19px}.tile p{font-size:14px;flex:1}.tile .more{color:var(--navy)}.how{margin-top:28px;font-size:14px}
/* strip */
.strip{position:relative;background:var(--slate);color:#fff}.strip .wrap{display:flex;align-items:center;gap:24px;padding-block:0}
.st{flex:1;padding:30px 0}.strip h2{color:#fff;font-size:26px;margin:0}.strip .sq{align-self:stretch;width:96px;background:var(--red);font-size:36px}.strip .btn{background:var(--navyd)}
/* work + dir */
.work{padding:90px 0 80px;background:var(--bg)}.work .hand{margin-bottom:16px}.photos{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.pt{position:relative;display:block;text-decoration:none;color:#fff;overflow:hidden}.pt .ph{border-radius:0}.pt span{position:absolute;left:0;right:0;bottom:0;padding:44px 18px 16px;background:linear-gradient(transparent,rgba(22,41,74,.9));font:600 17px Manrope}
.dir{background:var(--bg);padding:84px 0 0}.dir .two{align-items:end}.pf{margin:0}.pf .ph{aspect-ratio:4/3;background:transparent;mix-blend-mode:multiply;-webkit-mask-image:linear-gradient(to right,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(to right,transparent,#000 10%,#000 90%,transparent)}.pf figcaption{font-size:22px;margin-top:6px}
.dir h2{max-width:15em}blockquote{margin:0 0 8px;color:var(--mute);font-style:italic;max-width:46ch;border-left:3px solid var(--red);padding-left:16px}
.gb{display:grid;place-items:center;align-content:center;width:132px;height:132px;background:var(--red);color:#fff;margin-top:28px;font-size:13px;text-align:center}.gb .ic{font-size:40px}.gb b{font:700 28px Manrope;line-height:1}
/* inner pages */
.sec{padding:72px 0}.grey{background:var(--bg)}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.panel{border:1px solid var(--line);border-top:4px solid var(--navy);padding:26px;background:#fff}
.panel ul,.sec ul{margin:0;padding-left:20px;color:var(--mute)}.panel li,.sec li{margin:6px 0}
.steps{padding-left:20px;color:var(--mute)}.steps li{margin:12px 0}
.logos{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}.logos span{border:1px solid var(--line);background:#fff;padding:14px 26px;font:600 16px Manrope;color:var(--navy)}
.form label{display:block;font:600 14px Manrope;margin-bottom:14px;color:var(--navyd)}
.form input,.form select,.form textarea{display:block;width:100%;margin-top:6px;padding:12px;border:1px solid var(--slate);border-radius:3px;font:16px Inter}
.sec .card{min-height:230px}
footer{background:#0f1115;color:#c7ccd6;font-size:14px}footer a{display:block;text-decoration:none;color:#c7ccd6;margin:7px 0}footer a:hover{color:#fff}
footer h4{color:#fff;font-size:17px;margin-bottom:12px}.fg{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;padding-block:52px}footer p{color:#c7ccd6;font-size:13px}
.fb{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid #2a303b;padding-block:18px;font-size:12px}.fb a{display:inline;color:#fff}
@media(max-width:900px){.two,.grid,.cards,.fg,.photos{grid-template-columns:1fr}.tiles{grid-template-columns:1fr 1fr}.two{gap:28px}.burger{display:block}
nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;flex-direction:column;align-items:flex-start;padding:16px 20px;border-bottom:1px solid var(--line)}nav.open{display:flex}
.hero .hero-img{position:relative;width:100%;height:auto;aspect-ratio:16/11;-webkit-mask-image:none;mask-image:none;margin-top:-30px}.htxt{padding-bottom:30px}.hero .two{display:block}
.fbw{position:relative}.findbar{flex-direction:column}.findbar select{padding:16px}.cov{padding:0 0 0 0;border:0}.cov .sq{width:58px}.cov span:last-child{padding:12px 12px 12px 0}
.tab{display:none}.ribbon{position:relative;top:auto;right:auto;width:100%;height:auto;clip-path:none;flex-direction:row;align-items:center;justify-content:center;padding:14px;gap:10px}.ribbon b{max-width:none}
.strip .wrap{flex-wrap:wrap;padding-block:20px}.strip .sq{display:none}.band{min-height:420px}.util a{padding:9px 12px}.logo{height:50px}.intro{padding:60px 0 80px}.sec{padding:52px 0}}
@media(max-width:560px){.tiles{grid-template-columns:1fr}.util a{padding:8px 9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.ph{background:linear-gradient(135deg,var(--navy),var(--slate));border-radius:3px;overflow:hidden;aspect-ratio:4/3;position:relative}
.ph img{width:100%;height:100%;object-fit:cover;display:block}
.hero .hero-img,.pf .ph{background:transparent}
.ribbon{width:210px;height:150px;top:-84px;padding:16px 16px}.imacw{margin-top:54px}
@media(max-width:900px){.imacw{margin-top:0}.ribbon{width:100%;height:auto}}
/* mobile-fit safeguards */
html,body{max-width:100%;overflow-x:hidden}
@supports(overflow:clip){html,body{overflow-x:clip}}
img,svg,video,iframe{max-width:100%}
.two>*,.grid>*,.cards>*,.tiles>*,.photos>*,.fg>*,.hd>*{min-width:0}
h1,h2,h3,h4,p,li,a{overflow-wrap:break-word}
.form input,.form select,.form textarea{max-width:100%}
@media(max-width:900px){.wrap{padding:0 16px}.hero .hero-img{max-width:100%}.findbar{max-width:100%}}
@media(max-width:380px){.hd{gap:8px}.logo{height:42px}.burger{padding:8px 10px}.btn{padding:12px 16px}.hand{font-size:22px}.lau{width:88px;height:88px}.gb{width:112px;height:112px}}
/* ---- layout fixes: no element straddling a section edge ---- */
.notch,.tab{display:none}
.intro{padding:84px 0 84px}
.imacw{margin-top:0;display:flex;flex-direction:column;align-items:center}.imacw .imac{width:100%}
.ribbon{position:static;width:auto;height:auto;clip-path:none;flex-direction:row;align-items:center;gap:10px;margin-top:22px;padding:12px 20px;background:var(--red);text-align:left;font:600 13px Manrope;text-transform:uppercase;letter-spacing:.06em}
.ribbon span{font-size:18px;display:inline-flex}.ribbon b{font:600 13px Manrope;max-width:none}
.range{padding:84px 0 90px}
.card .more{margin-top:auto}
.bandtxt .hand{display:block;margin:16px 0 6px}.go{margin-top:6px}
.how{margin-top:32px}
.dir{padding:84px 0}.dir .two{align-items:center}
.dir blockquote{margin-bottom:20px}.dir .hand.rd{display:block;margin-bottom:14px}.dir .btn{margin-bottom:0}
.gb{margin-top:32px}.pf figcaption{margin-top:14px}
.strip .wrap{gap:24px}.strip .btn{flex:none}
.work{padding:84px 0}
/* hero */
.hero{padding-top:64px}
.hero .hero-img{bottom:150px;-webkit-mask-image:linear-gradient(to right,transparent,#000 40%),linear-gradient(to bottom,#000 80%,transparent);mask-image:linear-gradient(to right,transparent,#000 40%),linear-gradient(to bottom,#000 80%,transparent);-webkit-mask-composite:source-in;mask-composite:intersect}
.hero .htxt{padding-bottom:56px}
.fbw{padding-top:24px;padding-bottom:40px}
.findbar{flex-wrap:nowrap}
.cov{flex:1 1 0;min-width:0}.cov>span:last-child{line-height:1.35;padding:8px 0}
.findbar select{flex:1 1 220px}
.hero .hand{text-shadow:0 1px 8px rgba(22,41,74,.35)}
@media(max-width:1100px){.findbar select{flex-basis:160px}.cov>span:last-child{font-size:12px}}
@media(max-width:900px){
 .ribbon{width:auto;align-self:stretch;justify-content:center}
 .hero{padding-top:44px}
 .hero .two{display:block}
 .hero .htxt{padding-bottom:32px;max-width:none}
 .hero .hero-img{position:relative;bottom:auto;width:100%;max-width:none;height:auto;aspect-ratio:4/3;margin:0;-webkit-mask-image:none;mask-image:none}
 .hero .hero-img img{object-position:70% center}
 .fbw{background:var(--navyd);padding-top:26px;padding-bottom:28px}
 .fbw .hand{color:#fff;text-shadow:none}
 .findbar{display:grid;grid-template-columns:58px 1fr}
 .findbar select{grid-column:2;min-height:58px}
 .findbar .cov{grid-column:1/-1;border-left:0;border-top:1px solid var(--line);padding:0 14px 0 0;align-items:stretch}
 .findbar .cov .sq{width:58px}.findbar .cov .badge{align-self:center}.findbar .cov>span:last-child{align-self:center;padding:12px 0 12px 12px}
 .findbar .btn{grid-column:1/-1;justify-content:center;padding:16px}
 .strip .wrap{padding-block:26px}.strip .btn{width:100%;justify-content:center}
 .dir,.work,.range{padding-block:60px}.dir .two{gap:32px}
 .gb{margin-top:26px}
 /* mobile menu */
 header nav{box-shadow:0 12px 24px rgba(22,41,74,.12);gap:0;align-items:stretch}
 header nav>a:not(.btn){padding:14px 4px;border-bottom:1px solid var(--line);box-shadow:none!important}
 header nav a.on{color:var(--red)}
 header nav .btn{margin-top:12px;justify-content:center}
}
@media(min-width:901px){nav{gap:22px}}
@media(max-width:1180px) and (min-width:901px){nav{gap:16px}nav .btn{padding:10px 12px}}
.hero .hero-img{-webkit-mask-image:linear-gradient(to right,transparent,#000 40%),linear-gradient(to bottom,#000 55%,transparent);mask-image:linear-gradient(to right,transparent,#000 40%),linear-gradient(to bottom,#000 55%,transparent)}
@media(max-width:900px){.hero .hero-img{-webkit-mask-image:none;mask-image:none}.findbar .btn{background:var(--red);border-color:var(--red)}.findbar .btn:hover{background:#9c353d;border-color:#9c353d}}
.pt span{padding-top:64px;background:linear-gradient(transparent,rgba(22,41,74,.92) 70%)}
.fg.wrap{padding-block:52px}.fb.wrap{padding-block:18px}
@media(max-width:900px){
 .fg.wrap{padding-block:44px 28px}.fb.wrap{padding-block:18px}
 .band:before,.cn:before{background:linear-gradient(180deg,rgba(16,30,56,.82),rgba(16,30,56,.72))}
 .band .wrap{padding-block:56px}
}
/* ---- tighter vertical spacing ---- */
.intro,.range,.solar,.work,.dir,.sec{padding-block:56px}
.band{min-height:380px}.band .wrap{padding-block:48px}
.card{min-height:0;padding:28px 28px 22px}.sec .card{min-height:0}
.cards{align-items:stretch}
.hero{padding-top:48px}.hero .htxt{padding-bottom:40px}.fbw{padding-bottom:32px}
.range .hand,.work .hand{margin-bottom:12px}
.how{margin-top:22px}.tiles{margin-top:22px}
.gb{margin-top:24px}
.ribbon{margin-top:18px}
.laurels{margin-top:20px}
footer .fg.wrap{padding-block:40px}
@media(max-width:900px){
 .intro,.range,.solar,.work,.dir,.sec{padding-block:36px}
 .band{min-height:0}.band .wrap{padding-block:40px}
 .hero{padding-top:32px}.hero .htxt{padding-bottom:22px}
 .fbw{padding-top:20px;padding-bottom:22px}
 .strip .wrap{padding-block:22px}
 .two{gap:22px}.dir .two{gap:22px}
 .card{padding:24px 22px 20px}.card h3{margin:12px 0 8px}
 .tiles{gap:14px;margin-top:18px}.tile{padding:20px 18px}
 .photos{gap:12px}
 .imacw .stand{height:36px}
 .gb{width:104px;height:104px;margin-top:20px}
 .fg.wrap{padding-block:32px 16px}.fg{gap:20px}
 footer h4{margin-bottom:6px}
 .laurels{margin-top:16px}
 h2{margin-bottom:.4em}
 p{margin-bottom:.8em}
}
@media(max-width:900px){
 .laurels{flex-wrap:nowrap;gap:4px;justify-content:space-between}.lau{width:calc(25% - 4px);height:auto;aspect-ratio:1}
 .st{padding:0}.strip .wrap{gap:16px}
 .imacw .base{margin-bottom:0}
}

/* ---- hero image fix: show the whole engineer, no hard edges ---- */
.hero .hero-img{top:0;bottom:0;width:60%;-webkit-mask-image:linear-gradient(to right,transparent,#000 45%);mask-image:linear-gradient(to right,transparent,#000 45%);-webkit-mask-composite:source-over;mask-composite:add}
.hero .hero-img img{width:100%;height:100%;object-fit:cover;object-position:right 22%}
@media(max-width:900px){
 .hero .hero-img{position:relative;top:auto;bottom:auto;width:100%;height:auto;aspect-ratio:4/3;margin:0;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 28%);mask-image:linear-gradient(to bottom,transparent,#000 28%)}
 .hero .hero-img img{object-position:72% 30%}
}
.hero.sm .hero-img img{object-position:right 6%}
@media(max-width:900px){.hero.sm .hero-img img{object-position:72% 12%}}