
:root{
  --navy:#08213d;
  --navy2:#0e3157;
  --blue:#0d5fc6;
  --aqua:#2de0d0;
  --aqua2:#7ff5eb;
  --ice:#eefbfa;
  --white:#ffffff;
  --ink:#102135;
  --muted:#66788a;
  --line:#dce6ed;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:#fff}
.container{width:min(1180px,calc(100% - 40px));margin:auto}
.header{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:26px}
.logo{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink)}
.logo-mark{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,var(--blue),var(--aqua));color:#fff;font-family:"Plus Jakarta Sans";font-weight:800;font-size:21px}
.logo-type{display:flex;flex-direction:column;line-height:1}
.logo-type b{font-family:"Plus Jakarta Sans";font-size:18px}
.logo-type small{font-size:9px;letter-spacing:.15em;text-transform:uppercase;margin-top:5px;color:#728294}
.nav nav{display:flex;gap:28px}
.nav nav a,.phone{color:var(--ink);text-decoration:none;font-size:13px;font-weight:700}
.phone{color:var(--blue)}
.hero{position:relative;overflow:hidden;background:var(--navy);color:#fff}
.hero-glow{position:absolute;border-radius:50%;filter:blur(1px);opacity:.45}
.hero-glow.one{width:480px;height:480px;background:#0f5a8b;right:-160px;top:-140px}
.hero-glow.two{width:260px;height:260px;background:#0d7d83;left:-120px;bottom:-100px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:62px;align-items:center;padding:76px 0 70px;position:relative;z-index:2}
.eyebrow{font-size:11px;letter-spacing:.17em;font-weight:800;margin-bottom:16px}
.eyebrow.aqua{color:var(--aqua)}
.eyebrow.blue{color:var(--blue)}
.eyebrow.dark{color:#66788a}
.hero h1,.section-head h2,.commercial h2,.residential h2,.why h2,.area h2,.quote h2{font-family:"Plus Jakarta Sans";letter-spacing:-.045em}
.hero h1{font-size:64px;line-height:1;margin:0 0 22px;max-width:700px}
.hero p{font-size:19px;line-height:1.7;color:#c4d5e5;max-width:640px}
.hero-actions{display:flex;gap:16px;align-items:center;margin-top:29px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 21px;text-decoration:none;font-weight:800;border-radius:10px;border:0;cursor:pointer}
.primary{background:var(--aqua);color:var(--navy)}
.text-btn{color:#fff;padding-left:0}
.proof{display:flex;gap:27px;margin-top:46px;padding-top:23px;border-top:1px solid rgba(255,255,255,.15);flex-wrap:wrap}
.proof span{font-size:11px;color:#aebfce}
.proof b{color:#fff;font-size:15px;margin-right:4px}
.hero-visual{position:relative}
.photo-main{height:500px;border-radius:24px;background:url('https://images.unsplash.com/photo-1527515637462-cff94eecc1ac?auto=format&fit=crop&w=1400&q=85') center/cover;box-shadow:0 26px 70px rgba(0,0,0,.26)}
.aqua-card{position:absolute;left:-32px;bottom:26px;background:var(--aqua);color:var(--navy);padding:20px 23px;width:250px;border-radius:14px}
.aqua-card span{font-size:10px;letter-spacing:.14em;font-weight:800}
.aqua-card strong{display:block;font-family:"Plus Jakarta Sans";font-size:20px;line-height:1.25;margin-top:7px}
.chooser{padding:92px 0;background:#fff}
.section-head.centered{text-align:center;max-width:720px;margin:0 auto 38px}
.section-head h2{font-size:43px;margin:0}
.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.choice{height:430px;position:relative;overflow:hidden;text-decoration:none;color:#fff;border-radius:20px;background-size:cover;background-position:center}
.business-choice{background-image:linear-gradient(180deg,rgba(8,33,61,.1),rgba(8,33,61,.88)),url('https://images.unsplash.com/photo-1497366811353-6870744d04b2?auto=format&fit=crop&w=1400&q=85')}
.home-choice{background-image:linear-gradient(180deg,rgba(8,33,61,.05),rgba(8,33,61,.82)),url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=1400&q=85')}
.choice-copy{position:absolute;left:27px;right:27px;bottom:27px}
.choice-copy>span{font-size:11px;color:var(--aqua)}
.choice-copy h3{font-family:"Plus Jakarta Sans";font-size:34px;margin:7px 0 10px}
.choice-copy p{max-width:450px;line-height:1.6;color:#dbe7ef}
.choice-copy b{font-size:13px}
.commercial{padding:96px 0;background:var(--navy);color:white}
.commercial-grid,.residential-grid,.area-grid,.quote-grid{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.number{display:inline-flex;width:34px;height:34px;border-radius:50%;align-items:center;justify-content:center;background:rgba(45,224,208,.12);color:var(--aqua);font-size:11px;font-weight:800;margin-bottom:23px}
.number.blue{background:#eaf3ff;color:var(--blue)}
.commercial h2,.residential h2,.why h2,.area h2,.quote h2{font-size:45px;line-height:1.1;margin:0 0 18px}
.commercial-copy>p{color:#b9cbda;line-height:1.75}
.service-rows{margin:28px 0 31px;border-top:1px solid rgba(255,255,255,.14)}
.service-rows div{display:flex;gap:18px;padding:15px 0;border-bottom:1px solid rgba(255,255,255,.14)}
.service-rows span{color:var(--aqua);font-size:11px}
.aqua-btn{background:var(--aqua);color:var(--navy)}
.commercial-image{height:520px;border-radius:22px;background:url('https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=1400&q=85') center/cover}
.residential{padding:96px 0;background:var(--ice)}
.residential-image{height:520px;border-radius:22px;background:url('https://images.unsplash.com/photo-1583845112203-454c2254ed42?auto=format&fit=crop&w=1400&q=85') center/cover}
.residential-copy>p,.area p{color:var(--muted);line-height:1.75}
.pill-wrap{display:flex;gap:9px;flex-wrap:wrap;margin:27px 0}
.pill-wrap span{background:#fff;border:1px solid #cfe0ea;padding:10px 12px;border-radius:999px;font-size:11px}
.navy-btn{background:var(--navy);color:#fff}
.why{padding:94px 0;background:#fff}
.why-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:78px}
.why-list{display:grid}
.why-list article{display:grid;grid-template-columns:48px 1fr;gap:12px;padding:21px 0;border-top:1px solid var(--line)}
.why-list article:last-child{border-bottom:1px solid var(--line)}
.why-list article>span{font-size:11px;color:var(--blue)}
.why-list h3{font-size:18px;margin:0 0 6px}
.why-list p{font-size:14px;line-height:1.6;color:var(--muted);margin:0}
.area{padding:88px 0;background:#f4f8fb}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}
.tags span{background:#fff;border:1px solid #d8e5ed;border-radius:8px;padding:9px 11px;font-size:11px}
.area-visual{height:340px;background:linear-gradient(135deg,#dff5f3,#dbeaf7);position:relative;border-radius:22px;overflow:hidden}
.circle{position:absolute;border:1px solid rgba(13,95,198,.18);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}
.c1{width:210px;height:210px}
.c2{width:390px;height:390px}
.map-pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:var(--aqua);font-family:"Plus Jakarta Sans";font-weight:800;font-size:21px}
.map-label{position:absolute;left:58%;top:46%;background:#fff;padding:9px 11px;border-radius:8px;font-size:11px;font-weight:800;box-shadow:0 8px 26px rgba(0,0,0,.08)}
.quote{padding:96px 0;background:var(--navy);color:#fff}
.quote-copy p{color:#b8cad9;line-height:1.7}
.quote-phone{display:inline-block;margin-top:23px;color:var(--aqua);font-family:"Plus Jakarta Sans";font-size:28px;font-weight:800;text-decoration:none}
.quote-form{background:#102e50;padding:29px;border-radius:18px}
.quote-form label{display:flex;flex-direction:column;gap:7px;font-size:11px;font-weight:700;margin-bottom:15px}
.quote-form input,.quote-form select,.quote-form textarea{width:100%;background:#0a2541;color:#fff;border:1px solid #31506d;border-radius:8px;padding:13px;font:inherit}
.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.full{width:100%}
.quote-form small{display:block;text-align:center;color:#7590a7;margin-top:10px}
footer{background:#06182b;color:#fff;padding:46px 0 22px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}
.footer-grid>div{display:flex;flex-direction:column;gap:8px}
.footer-grid a,.footer-grid span{font-size:12px;color:#8fa8bd;text-decoration:none}
.footer-logo .logo-type b{color:#fff}
.footer-logo .logo-type small{color:#7792aa}
.copyright{border-top:1px solid #19334a;margin-top:34px;padding-top:18px;color:#60798f;font-size:11px}
@media(max-width:900px){
  .nav nav{display:none}
  .hero-grid,.commercial-grid,.residential-grid,.why-grid,.area-grid,.quote-grid{grid-template-columns:1fr}
  .hero h1{font-size:48px}
  .choice-grid{grid-template-columns:1fr}
  .aqua-card{left:18px}
  .commercial-image,.residential-image{height:390px}
}
@media(max-width:560px){
  .container{width:min(100% - 28px,1180px)}
  .phone{display:none}
  .hero-grid{padding:50px 0 58px}
  .hero h1{font-size:39px}
  .hero p{font-size:17px}
  .hero-actions{flex-direction:column;align-items:flex-start}
  .photo-main{height:360px}
  .section-head h2,.commercial h2,.residential h2,.why h2,.area h2,.quote h2{font-size:34px}
  .choice{height:360px}
  .row,.footer-grid{grid-template-columns:1fr}
}
