:root{
    --navy:#14314c;
    --blue:#6FB52C;
    --blue-tint:#e7f1da;
    --bg:#f3f4f8;
    --input:#e5e6ec;
    --grey:#818181;
    --grey-2:#9a9a9a;
    --line:#e5e6ec;
    --ph:#9aa6b4;
    --ink:#26313b;
    --white:#fff;
    --maxw:1290px;
    --side:75px;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{font-family:'DM Sans',sans-serif;color:var(--ink);background:#fff;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
  h1,h2,h3,h4,.display{font-family:'Sora',sans-serif;line-height:1.12;letter-spacing:-.01em}
  img{max-width:100%;display:block}
  a{text-decoration:none;color:inherit}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--side)}
  .blue{color:var(--blue)}
  .ph{background:linear-gradient(135deg,#aeb9c6,#7d8b9b);position:relative;overflow:hidden;border-radius:14px}
  .ph::after{content:'Photo placeholder';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.8);font-family:'DM Sans';font-weight:600;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
  .ph-ico{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.45)}

  /* buttons */
  .btn-group{display:inline-flex;align-items:center;gap:8px}
  .btn{display:inline-flex;align-items:center;font-family:'DM Sans';font-weight:700;font-size:16px;border:none;cursor:pointer}
  .pill-blue{background:var(--blue);color:#fff;border-radius:999px;padding:15px 28px}
  .pill-white{background:#fff;color:var(--blue);border-radius:999px;padding:15px 28px}
  .circ{width:44px;height:44px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
  .circ-white{background:#fff;color:var(--blue)}
  .circ-blue{background:var(--blue);color:#fff}
  .send{transform:rotate(-0deg)}
  .chk{width:26px;height:26px;border-radius:50%;background:var(--blue);color:#fff;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}

  /* header */
  .header{position:absolute;top:0;left:0;right:0;z-index:6;padding:22px 0}
  .header .bar{max-width:var(--maxw);margin:0 auto;background:#fff;border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.06);display:flex;align-items:center;justify-content:space-between;padding:20px 28px}
  .logo{font-family:'Sora';font-weight:800;font-size:26px;letter-spacing:.01em;color:var(--navy);display:flex;align-items:center;gap:9px}
  .logo img{height:44px;width:auto;display:block}
  .logo .tap{color:var(--blue)}
  .logo .lico{width:34px;height:34px;border-radius:9px;background:var(--blue);display:flex;align-items:center;justify-content:center;color:#fff}
  .nav{display:flex;gap:26px;color:var(--ink);font-weight:500}
  .nav a:hover{color:var(--blue)}
  .hgroup{display:flex;align-items:center;gap:20px}
  .hcall{display:flex;align-items:center;gap:12px}
  .hcall .t{font-size:13px;color:var(--grey)}
  .hcall .t b{display:block;font-family:'Sora';font-size:18px;color:var(--ink)}
  .burger{display:none;background:none;border:none;color:var(--navy);cursor:pointer}

  /* hero */
  .hero{position:relative;padding-top:150px;background:#fff}
  .hero-photo{position:absolute;top:0;left:0;right:0;height:880px;background:linear-gradient(90deg,rgba(20,49,76,.85),rgba(20,49,76,.45)),url('photo-living-split.jpg') center/cover;z-index:0}
  .hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,48,97,.45),rgba(0,48,97,.12))}
  .hero .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1fr 540px;gap:50px;align-items:start}
  .badge{display:inline-block;background:rgba(255,255,255,.22);color:#fff;border-radius:999px;padding:8px 18px;font-style:italic;font-size:15px;margin-bottom:24px}
  .hero h1{color:#fff;font-size:58px;font-weight:700;margin-bottom:30px}
  .checks2{display:grid;grid-template-columns:1fr 1fr;gap:16px 30px;margin-bottom:34px;max-width:560px}
  .checks2 .c{display:flex;align-items:center;gap:12px;color:#fff;font-size:17px}
  .qform{background:var(--bg);border-radius:16px;padding:40px}
  .qform h3{font-family:'Sora';font-size:32px;font-weight:700;color:var(--ink);margin-bottom:24px}
  .field{background:var(--input);border:none;border-radius:8px;color:var(--ink);font-family:'DM Sans';font-size:15px;padding:16px 18px;width:100%;margin-bottom:16px}
  .field::placeholder{color:#8a929b}
  textarea.field{resize:none;height:110px}
  .qform .submit{margin-top:6px}
  .pill-blue.full{width:100%;justify-content:space-between;padding:16px 10px 16px 28px}
  .qform .divx{height:1px;background:var(--line);margin:26px 0 18px}
  .qform .callrow{text-align:center}
  .qform .callrow .lab{font-weight:700;color:var(--ink)}
  .qform .callrow .num{display:flex;align-items:center;justify-content:center;gap:14px;font-family:'Sora';font-weight:800;font-size:34px;color:var(--ink);margin-top:8px}
  .qform .callrow .num .circ-blue{width:52px;height:52px}

  /* hero feature cards */
  .hero-cards{display:grid;grid-column:1 / -1;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:60px;position:relative;z-index:2}
  .hcard .ic{width:54px;height:54px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:20px}
  .hcard h4{font-family:'Sora';font-size:22px;font-weight:600;color:var(--ink);margin-bottom:14px;padding-bottom:16px;border-bottom:1px solid var(--line)}
  .hcard p{color:var(--grey);font-size:15px}

  /* stats deep navy */
  .stats{background:var(--navy);color:#fff}
  .stats .wrap{display:grid;grid-template-columns:repeat(3,1fr);padding:60px 75px;text-align:center}
  .stats .num{font-family:'Sora';font-weight:700;font-size:56px}
  .stats .lab{color:#b9c6d6;font-size:17px;margin-top:6px}

  /* generic section */
  .sec{padding:90px 0}
  h2.h{font-size:46px;font-weight:700}
  .lead{color:var(--grey);font-size:17px;line-height:1.6}
  .badge-light{display:inline-block;background:#eaf3ff;color:var(--navy);border-radius:999px;padding:8px 18px;font-style:italic;font-size:14px;margin-bottom:18px}
  .note-flag{display:block;text-align:center;color:var(--grey-2);font-size:12.5px;font-style:italic;margin-top:24px}

  /* why choose (accordion + images) */
  .why2 .wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
  .why2 h2{font-size:46px;font-weight:700;margin-bottom:16px}
  .why2 .lead{margin-bottom:30px;max-width:420px}
  .acc{background:var(--bg);border-radius:12px;padding:20px 22px;margin-bottom:16px}
  .acc .row{display:flex;align-items:center;gap:16px}
  .acc .ic{width:46px;height:46px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
  .acc .q{font-family:'Sora';font-weight:600;font-size:18px;flex:1}
  .acc .tg{width:36px;height:36px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;color:var(--navy)}
  .acc.open .tg{background:var(--navy);color:#fff}
  .acc p{color:var(--grey);font-size:14px;margin-top:14px;padding-left:62px}
  .why2-imgs{position:relative;height:760px}
  .why2-imgs .a{position:absolute;top:0;left:0;width:78%;height:560px;border-radius:14px}
  .why2-imgs .b{position:absolute;bottom:0;right:0;width:60%;height:360px;border-radius:14px;border:6px solid #fff}

  /* about navy split */
  .about2{background:var(--navy);color:#fff}
  .about2 .wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px;padding:90px 75px;align-items:center}
  .about2 .badge{background:rgba(255,255,255,.16)}
  .about2-img{width:100%;height:620px;border-radius:14px}
  .about2 h2{font-size:44px;font-weight:700;margin:6px 0 20px}
  .about2 .lead{color:#c0cddc;margin-bottom:30px}
  .feat-it{display:grid;grid-template-columns:54px 1fr;gap:18px;margin-bottom:24px}
  .feat-it .ic{width:54px;height:54px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center}
  .feat-it h4{font-family:'Sora';font-size:20px;font-weight:600;margin-bottom:8px}
  .feat-it p{color:#c0cddc;font-size:15px}

  /* testimonials */
  .testi{background:var(--bg)}
  .testi .wrap{padding:90px 75px;text-align:center}
  .testi h2{font-size:46px;font-weight:700;margin-bottom:16px}
  .testi .gbadge{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:46px;color:var(--grey)}
  .testi .gbadge .gg{width:28px;height:28px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:'Sora';font-weight:800;color:var(--blue)}
  .testi-row{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;align-items:center}
  .tcard{background:#fff;border-radius:16px;padding:30px;text-align:left;box-shadow:0 10px 30px rgba(0,0,0,.04)}
  .tcard.mid{transform:scale(1.06);box-shadow:0 20px 50px rgba(0,0,0,.10)}
  .tcard p{color:var(--grey-2);font-size:15px;line-height:1.6;margin-bottom:26px;font-style:italic}
  .tcard .divx{height:1px;background:var(--line);margin-bottom:18px}
  .tcard .who{display:flex;justify-content:space-between;align-items:center}
  .tcard .who b{font-family:'Sora';font-size:16px}
  .tcard .who .ago{color:var(--grey-2);font-size:12px;display:block;margin-top:2px}
  .stars{color:var(--blue);letter-spacing:3px;font-size:18px}
  .testi .btn-group{margin-top:46px}

  /* why love (checklist) */
  .love .wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
  .love h2{font-size:46px;font-weight:700}
  .love-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px 30px}
  .love-cols .it{display:flex;align-items:center;gap:14px;font-size:18px}

  /* featured cards (navy top, overlap) */
  .feat3{background:#fff;position:relative}
  .feat3-top{background:var(--navy);color:#fff;padding-top:90px}
  .feat3-head{max-width:var(--maxw);margin:0 auto;padding:0 75px;display:grid;grid-template-columns:1fr 1fr auto;gap:30px;align-items:center}
  .feat3-head h2{font-size:42px;font-weight:700}
  .feat3-head .lead{color:#c0cddc}
  .feat3-head .hcall .t,.feat3-head .hcall .t b{color:#fff}
  .feat3-head .hcall{background:rgba(255,255,255,.1);border-radius:12px;padding:14px 18px}
  .feat3-cards{max-width:var(--maxw);margin:0 auto;padding:40px 75px 90px;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;position:relative;z-index:2}
  .fc3{background:#fff;border-radius:16px;box-shadow:0 14px 40px rgba(0,0,0,.06);overflow:hidden}
  .fc3 .img{height:330px;position:relative}
  .fc3 .img .ar{position:absolute;top:16px;right:16px}
  .fc3 .body{padding:26px}
  .fc3 .body h4{font-family:'Sora';font-size:22px;font-weight:600;margin-bottom:10px}
  .fc3 .body p{color:var(--grey);font-size:14px}
  .fc3.dark{background:var(--navy);color:#fff}
  .fc3.dark .body p{color:#c0cddc}

  /* our services rows */
  .osvc .wrap{padding:90px 75px}
  .osvc-head{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;margin-bottom:46px}
  .osvc-head h2{font-size:46px;font-weight:700;margin-bottom:14px}
  .osvc-head .lead{max-width:560px}
  .osvc-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
  .scard{background:var(--bg);border-radius:14px;padding:28px;display:grid;grid-template-columns:150px 1fr;gap:24px;align-items:center}
  .scard .img{width:150px;height:150px;border-radius:10px}
  .scard h4{font-family:'Sora';font-size:24px;font-weight:600;margin-bottom:10px}
  .scard p{color:var(--grey);font-size:14px}

  /* process */
  .proc{background:var(--bg)}
  .proc .wrap{padding:90px 75px;text-align:center}
  .proc h2{font-size:46px;font-weight:700;margin-bottom:16px}
  .proc .lead{max-width:560px;margin:0 auto 50px}
  .proc-row{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;align-items:center}
  .pcard{background:#fff;border-radius:16px;padding:44px 30px;text-align:center}
  .pcard.mid{transform:scale(1.05);box-shadow:0 20px 50px rgba(0,0,0,.08)}
  .pcard .ic{width:72px;height:72px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 22px}
  .pcard .st{color:var(--grey);font-size:14px;margin-bottom:4px}
  .pcard h4{font-family:'Sora';font-size:24px;font-weight:600;margin-bottom:14px}
  .pcard p{color:var(--grey);font-size:14px}
  .proc .btn-group{margin-top:46px}

  /* cta band */
  .cta2{background:var(--navy);color:#fff;text-align:center}
  .cta2 .wrap{padding:80px 75px}
  .cta2 .pill-tag{display:inline-block;background:rgba(255,255,255,.12);color:#fff;border-radius:999px;padding:8px 18px;font-weight:600;font-size:14px;margin-bottom:20px}
  .cta2 h2{font-size:42px;font-weight:700;margin-bottom:30px;line-height:1.2}
  .searchbar{background:#fff;border-radius:14px;padding:14px 14px 14px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:820px;margin:0 auto}
  .searchbar span{color:var(--grey);font-size:15px}
  .searchbar span b{color:var(--blue)}

  /* locations / map */
  .loc .wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:stretch}
  .loc h2{font-size:42px;font-weight:700;margin-bottom:24px}
  .loc-card{background:var(--bg);border-radius:14px;padding:30px}
  .loc-card h4{font-family:'Sora';font-size:20px;font-weight:600;margin-bottom:18px}
  .loc-card .it{display:flex;align-items:center;gap:12px;color:var(--ink);font-size:15px;margin-bottom:14px}
  .loc-map{position:relative;background:#dfe5ea;border-radius:14px;min-height:460px;overflow:hidden}
  .loc-map .grid-bg{position:absolute;inset:0;background-image:linear-gradient(#cdd5db 1px,transparent 1px),linear-gradient(90deg,#cdd5db 1px,transparent 1px);background-size:64px 64px;opacity:.6}
  .loc-map .pin{position:absolute;width:20px;height:20px;border-radius:50% 50% 50% 0;background:var(--blue);transform:rotate(-45deg)}

  /* offers / value props */
  .offers{background:var(--navy);color:#fff;overflow:hidden}
  .offers .wrap{padding:80px 75px}
  .offers-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:40px}
  .offers h2{font-size:46px;font-weight:700}
  .offers .hcall{background:rgba(255,255,255,.1);border-radius:12px;padding:14px 18px}
  .offers .hcall .t,.offers .hcall .t b{color:#fff}
  .offers-row{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
  .ocard{border-radius:14px;padding:24px;text-align:center}
  .ocard.fill{background:var(--blue)}
  .ocard.fill .big{background:rgba(255,255,255,.18)}
  .ocard .tag{font-style:italic;font-size:14px;margin-bottom:16px;color:#cfe2fb}
  .ocard.fill .tag{color:#fff}
  .ocard .big{border:2px dashed var(--blue);border-radius:10px;padding:18px;font-family:'Sora';font-weight:800;font-size:26px;color:var(--blue);margin-bottom:18px}
  .ocard.fill .big{border:none;color:#fff}
  .ocard h4{font-family:'Sora';font-size:22px;font-weight:700;margin-bottom:10px;color:#fff}
  .ocard.fill h4{color:#fff}
  .ocard .d{font-size:13px;color:#aebfd2;margin-bottom:20px}
  .ocard.fill .d{color:#e3effc}
  .ocard .btn{width:100%;justify-content:space-between;padding-left:22px}

  /* about stats */
  .astat .wrap{padding:90px 75px}
  .astat-head{display:grid;grid-template-columns:.5fr 1fr;gap:30px;align-items:center;margin-bottom:46px}
  .astat-head h2{font-size:42px;font-weight:700}
  .astat-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
  .astat-img{height:520px;border-radius:14px}
  .astat-card{background:var(--bg);border-radius:14px;padding:30px;margin-bottom:24px}
  .astat-card h4{font-family:'Sora';font-size:22px;font-weight:600}
  .astat-nums{display:grid;grid-template-columns:1fr 1fr;gap:30px}
  .astat-nums .n{font-family:'Sora';font-weight:800;font-size:48px;color:var(--blue)}
  .astat-nums h5{font-family:'Sora';font-size:20px;font-weight:600;margin:4px 0 8px}
  .astat-nums p{color:var(--grey);font-size:14px}

  /* faq */
  .faq2{background:#fff}
  .faq2 .wrap{padding:90px 75px;text-align:center}
  .faq2 h2{font-size:46px;font-weight:700;margin-bottom:16px}
  .faq2 .lead{max-width:560px;margin:0 auto 30px}
  .faq2 .btn-group{margin-bottom:50px}
  .faq2-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;text-align:left}
  .faq2-col{display:flex;flex-direction:column;gap:18px}
  .qa{background:var(--bg);border-radius:12px;padding:22px 24px}
  .qa .row{display:flex;justify-content:space-between;align-items:center;gap:16px}
  .qa .q{font-family:'Sora';font-weight:600;font-size:16px}
  .qa .tg{width:36px;height:36px;border-radius:50%;background:var(--blue-tint);color:var(--navy);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
  .qa.open .tg{background:var(--blue);color:#fff}
  .qa p{color:var(--grey);font-size:14px;margin-top:14px}

  /* final contact */
  .contact2{background:var(--bg)}
  .contact2 .wrap{padding:80px 75px;display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}
  .cc-card{background:#fff;border-radius:14px;padding:34px;margin-bottom:26px}
  .cc-card h3{font-family:'Sora';font-size:24px;font-weight:700;margin-bottom:22px}
  .cc-card .it{display:flex;align-items:center;gap:14px;color:var(--ink);font-size:15px;margin-bottom:16px}
  .cc-call{text-align:center}
  .cc-call .lab{font-weight:700}
  .cc-call .lab b{color:var(--blue)}
  .cc-call .num{display:flex;align-items:center;justify-content:center;gap:14px;font-family:'Sora';font-weight:800;font-size:36px;margin-top:10px}
  .cc-call .num .circ-blue{width:54px;height:54px}
  .contact2 .pill-tag{display:inline-block;background:#dcebff;color:var(--blue);border-radius:999px;padding:8px 16px;font-weight:700;font-size:13px;margin-bottom:16px}
  .contact2 h2{font-size:42px;font-weight:700;margin-bottom:24px}

  /* footer */
  .footer{background:var(--navy);color:#fff}
  .footer .wrap{padding:60px 75px}
  .foot-top{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.14);padding-bottom:26px;margin-bottom:34px}
  .footer .logo{color:#fff}
  .foot-nav{display:flex;gap:14px;align-items:center}
  .foot-nav a{font-weight:500;padding:8px 14px;border-radius:999px}
  .foot-nav a.on{background:var(--blue)}
  .foot-grid{display:grid;grid-template-columns:1.2fr 1.3fr 1fr;gap:40px;align-items:start}
  .foot-grid h4{font-family:'Sora';font-size:22px;font-weight:600;margin-bottom:16px}
  .foot-grid .lead{color:#aebfd2;font-size:14px}
  .foot-checks{display:grid;grid-template-columns:1fr 1fr;gap:18px 30px}
  .foot-checks .it{display:flex;align-items:center;gap:12px;font-size:15px}
  .foot-cta{background:#fff;border-radius:14px;padding:22px;display:flex;align-items:center;justify-content:space-between;gap:16px}
  .foot-cta .hcall .t{color:var(--grey)}.foot-cta .hcall .t b{color:var(--ink)}

  /* explore services (6-card grid) */
  .explore{background:var(--bg)}
  .explore .wrap{padding:90px 75px;text-align:center}
  .explore h2{font-size:46px;font-weight:700;margin-bottom:14px}
  .explore .lead{max-width:560px;margin:0 auto 30px}
  .explore .btn-group{margin-bottom:46px}
  .exp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;text-align:left}
  .ecard{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.04)}
  .ecard .img{height:180px;position:relative}
  .ecard .img .ic{position:absolute;left:24px;bottom:-24px;width:52px;height:52px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;border:4px solid #fff}
  .ecard.active .img .ic{border-color:var(--navy)}
  .ecard .body{padding:38px 24px 26px}
  .ecard h4{font-family:'Sora';font-size:20px;font-weight:600;margin-bottom:10px}
  .ecard p{color:var(--grey);font-size:13px}
  .ecard.active .body{background:var(--navy);color:#fff}
  .ecard.active p{color:#b9c6d6}
  /* hover-to-open animation (first card active by default) */
  .ecard{transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s ease}
  .ecard .body{transition:background .38s ease, color .38s ease}
  .ecard .img .ic{transition:border-color .38s ease, background .38s ease, transform .38s ease}
  .ecard::before{content:"";position:absolute;top:0;left:0;width:100%;height:5px;background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform .42s cubic-bezier(.2,.7,.2,1);z-index:3}
  .ecard{position:relative}
  .ecard:hover::before,.ecard.active::before{transform:scaleX(1)}
  .ecard:hover{transform:translateY(-10px);box-shadow:0 28px 54px rgba(20,49,76,.20)}
  .ecard:hover .body{background:var(--navy);color:#fff}
  .ecard:hover p{color:#b9c6d6}
  .ecard:hover .img .ic{border-color:var(--navy);transform:scale(1.08)}

  /* ===== TABLET ===== */
  @media (max-width:980px){
    :root{--side:32px}
    .hero h1{font-size:46px}
    .hero .wrap{grid-template-columns:1fr 440px}
    h2.h,.why2 h2,.about2 h2,.testi h2,.love h2,.proc h2,.cta2 h2,.offers h2,.faq2 h2,.astat-head h2,.contact2 h2,.loc h2,.osvc-head h2{font-size:36px}
    .testi-row,.proc-row,.feat3-cards,.offers-row,.hero-cards{grid-template-columns:repeat(2,1fr)}
  }
  /* ===== MOBILE ===== */
  @media (max-width:768px){
    :root{--side:18px}
    body{font-size:15px}
    .nav,.hgroup .hcall,.hgroup .btn-group{display:none}
    .burger{display:flex}
    .header .bar{padding:16px 18px}
    .logo{font-size:21px}
    .hero{padding-top:120px}
    .hero-photo{height:auto;top:0;bottom:0}
    .hero .wrap{grid-template-columns:1fr;gap:30px}
    .hero h1{font-size:32px;margin-bottom:22px}
    .checks2{grid-template-columns:1fr;gap:12px}
    .qform{padding:26px 22px}
    .qform h3{font-size:26px}
    .qform .callrow .num{font-size:28px}
    .hero-cards{grid-template-columns:1fr;margin-top:40px;background:#fff;padding-top:30px}
    .stats .wrap{grid-template-columns:1fr;gap:30px;padding:50px 18px}
    .stats .num{font-size:46px}
    .sec{padding:54px 0}
    .why2 .wrap,.about2 .wrap,.love .wrap,.loc .wrap,.contact2 .wrap,.astat-grid,.astat-head{grid-template-columns:1fr;gap:30px}
    .why2-imgs{height:420px}
    .about2 .wrap,.osvc .wrap,.testi .wrap,.proc .wrap,.cta2 .wrap,.offers .wrap,.faq2 .wrap,.astat .wrap,.contact2 .wrap,.stats .wrap,.footer .wrap{padding-left:18px;padding-right:18px}
    .about2 .wrap{padding-top:54px;padding-bottom:54px}
    .about2-img{height:300px}
    .testi-row,.love-cols,.feat3-cards,.feat3-head,.osvc-grid,.proc-row,.offers-row,.astat-nums,.faq2-grid,.foot-grid,.foot-checks,.exp-grid{grid-template-columns:1fr}
    .explore .wrap{padding-left:18px;padding-right:18px}
    .tcard.mid,.pcard.mid{transform:none}
    .scard{grid-template-columns:1fr;text-align:left}
    .scard .img{width:100%;height:160px}
    .searchbar{flex-direction:column;align-items:stretch;text-align:center;gap:14px;padding:20px}
    .offers-head{flex-direction:column;gap:20px}
    .feat3-head{padding-left:18px;padding-right:18px}
    .feat3-cards{padding:30px 18px 54px}
    .astat-img{height:300px}
    .foot-top{flex-direction:column;gap:18px;align-items:flex-start}
    .foot-nav{flex-wrap:wrap}
    h2.h,.hero h1,.why2 h2,.about2 h2,.testi h2,.love h2,.proc h2,.cta2 h2,.offers h2,.faq2 h2,.astat-head h2,.contact2 h2,.loc h2,.osvc-head h2,.feat3-head h2{font-size:28px}
    .hero h1{font-size:32px}
    .cc-call .num,.qform .callrow .num{font-size:28px}
  }

/* ===================== MULTI-PAGE: nav dropdown, service & contact pages ===================== */
.has-sub{position:relative;display:flex;align-items:center}
.has-sub>.nav-svc{display:inline-flex;align-items:center;cursor:pointer}
.has-sub::after{content:"";position:absolute;top:100%;left:-10px;right:-10px;height:16px}
.subnav{position:absolute;top:calc(100% + 12px);left:-12px;background:#fff;border-radius:14px;box-shadow:0 22px 55px rgba(0,48,97,.16);padding:10px;min-width:260px;display:none;flex-direction:column;z-index:40}
.has-sub:hover .subnav{display:flex}
.subnav a{padding:12px 14px;border-radius:9px;font-weight:500;white-space:nowrap;color:var(--ink)}
.subnav a:hover{background:var(--blue-tint);color:var(--navy)}

/* service landing hero (navy) */
.shero{background:var(--navy);color:#fff;padding:150px 0 72px;position:relative}
.shero .wrap{display:grid;grid-template-columns:1fr 480px;gap:50px;align-items:start}
.shero .badge{background:rgba(255,255,255,.16)}
.shero h1{color:#fff;font-size:46px;font-weight:700;margin:6px 0 18px}
.shero-sub{color:#c8d6e2;font-size:18px;margin-bottom:24px;max-width:520px}
.shero-checks{display:flex;flex-direction:column;gap:13px;margin-bottom:24px}
.shero-checks .c{display:flex;align-items:center;gap:12px;color:#fff;font-size:16px}
.srating{color:#c8d6e2;font-size:14px}
.shero .qform{background:#fff}
.shero .qform h3{color:var(--ink)}

/* service "what's included" */
.sintro .wrap{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center;padding:90px 75px}
.sintro-img{height:440px;border-radius:14px}
.sintro h2{font-size:38px;font-weight:700;margin:8px 0 16px}
.ticklist{list-style:none;margin:22px 0 28px}
.ticklist li{display:flex;gap:12px;align-items:flex-start;margin-bottom:13px;color:var(--ink);font-size:15px}
.ticklist .chk{margin-top:1px}

/* simple page header (contact) */
.page-head{background:var(--bg)}
.page-head .wrap{padding:130px 75px 10px;max-width:var(--maxw);margin:0 auto}
.page-head h1{font-size:48px;font-weight:700;margin:6px 0 14px}
.page-head .lead{max-width:620px}

/* mobile: dropdown + burger menu */
@media (max-width:768px){
  .header .bar.open{flex-wrap:wrap}
  .header .bar.open .nav{display:flex!important;flex-direction:column;width:100%;order:5;margin-top:14px;gap:4px;align-items:stretch}
  .header .bar.open .nav>a,.header .bar.open .has-sub>.nav-svc{padding:12px 6px;border-bottom:1px solid var(--line)}
  .header .bar.open .has-sub{flex-direction:column;align-items:stretch}
  .header .bar.open .subnav{position:static;display:none;box-shadow:none;padding:2px 0 8px 14px;min-width:0;background:transparent}
  .header .bar.open .has-sub.sub-open .subnav{display:flex}
  .header .bar.open .hgroup{display:flex;width:100%;order:6;margin-top:12px}
  .header .bar.open .hgroup .btn-group{display:inline-flex}
  .shero{padding:120px 0 54px}
  .shero .wrap{grid-template-columns:1fr;gap:28px}
  .shero h1{font-size:30px}
  .sintro .wrap{grid-template-columns:1fr;gap:28px;padding:54px 18px}
  .sintro-img{height:240px}
  .sintro h2{font-size:26px}
  .page-head .wrap{padding:100px 18px 6px}
  .page-head h1{font-size:30px}
}

/* ===== CRO additions — 2 Jul 2026, ported from the Gusty playbook ===== */
/* Google badge inside the form card */
.lead-form .form-gbadge{display:flex;align-items:center;gap:8px;margin-bottom:14px;color:var(--grey);font-size:14px}
.lead-form .form-gbadge .gg{width:24px;height:24px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:'Sora';font-weight:800;font-size:13px;color:var(--blue);flex:0 0 auto}
.lead-form .form-gbadge .stars{font-size:14px;letter-spacing:2px}
.lead-form .form-gbadge b{font-family:'Sora';color:var(--ink)}

/* "What do you need?" dropdown styled like the other fields */
select.field{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:44px;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2326313b' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}
select.field:invalid{color:var(--ph)}
select.field option{color:var(--ink)}

/* proof lines under the submit button */
.lead-form .form-note{margin-top:10px;text-align:center;font-size:13px;font-weight:600;color:var(--ink)}
.lead-form .form-proof{margin-top:4px;text-align:center;font-size:13px;color:var(--grey)}
.lead-form .form-proof .stars{font-size:12px;letter-spacing:1px}

/* sticky mobile call bar (mobile only) */
.sticky-cta{display:none}
@media (max-width:768px){
  .sticky-cta{position:fixed;bottom:0;left:0;right:0;z-index:999;display:flex;height:58px;box-shadow:0 -2px 12px rgba(0,0,0,.12);padding-bottom:env(safe-area-inset-bottom)}
  .sticky-cta a{display:flex;align-items:center;justify-content:center;gap:8px;font-family:'Sora';font-weight:700;font-size:15px;color:#fff;text-decoration:none;transition:opacity .15s ease}
  .sticky-cta a:active{opacity:.85}
  .sticky-cta .s-call{flex:1.4;background:var(--blue)}
  .sticky-cta .s-quote{flex:1;background:var(--navy)}
  body{padding-bottom:calc(58px + env(safe-area-inset-bottom))}
}

/* ===== Interaction pass — 2 Jul 2026 (Cameron's feedback) ===== */
/* cards are now links: keep them looking like cards */
a.ecard,a.fc3,a.scard{display:block;color:inherit;text-decoration:none;cursor:pointer}
a.scard{display:grid}

/* explore cards: highlight follows the mouse — the default (ducted) lets go
   as soon as another card is hovered */
.exp-grid:hover .ecard.active:not(:hover) .body{background:#fff;color:var(--ink)}
.exp-grid:hover .ecard.active:not(:hover) p{color:var(--grey)}
.exp-grid:hover .ecard.active:not(:hover)::before{transform:scaleX(0)}
.exp-grid:hover .ecard.active:not(:hover) .img .ic{border-color:#fff}

/* featured cards (Cooling / Heating / Service & Repairs): same follow-the-mouse */
.fc3{transition:background .3s ease,color .3s ease,transform .3s ease,box-shadow .3s ease}
.fc3:hover{background:var(--navy);color:#fff;transform:translateY(-8px);box-shadow:0 24px 50px rgba(20,49,76,.18)}
.fc3:hover .body p{color:#c0cddc}
.feat3-cards:hover .fc3.dark:not(:hover){background:#fff;color:var(--ink)}
.feat3-cards:hover .fc3.dark:not(:hover) .body p{color:var(--grey)}

/* our-services cards: lift on hover */
.scard{transition:transform .3s ease,box-shadow .3s ease}
.scard:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(20,49,76,.12)}

/* process steps: the hovered step expands; the default middle emphasis
   steps aside while you're hovering a different card */
.pcard{transition:transform .3s ease,box-shadow .3s ease}
.pcard:hover{transform:scale(1.06);box-shadow:0 20px 50px rgba(0,0,0,.1);position:relative;z-index:2}
.proc-row:hover .pcard.mid:not(:hover){transform:scale(1);box-shadow:none}

/* breathing room between white content and the navy bands */
.hero{padding-bottom:80px}
.feat3{padding-top:50px}

/* ===== Offers/value-props: whole card is a link, highlight follows the mouse (2 Jul PM) ===== */
a.ocard{display:flex;flex-direction:column;text-decoration:none;cursor:pointer;transition:background .3s ease,transform .3s ease,box-shadow .3s ease}
a.ocard .d{flex:1}
a.ocard:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(0,0,0,.28)}
/* hovered card takes the green fill treatment (mirrors .ocard.fill) */
a.ocard:hover{background:var(--blue)}
a.ocard:hover .big{border:none;background:rgba(255,255,255,.18);color:#fff}
a.ocard:hover .tag{color:#fff}
a.ocard:hover .d{color:#e3effc}
a.ocard:hover .btn.pill-blue{background:#fff;color:var(--navy)}
a.ocard:hover .btn.pill-blue .circ{background:var(--blue);color:#fff}
/* while hovering the row, the default green (fill) card lets go unless it's the hovered one */
.offers-row:hover .ocard.fill:not(:hover){background:transparent}
.offers-row:hover .ocard.fill:not(:hover) .big{border:2px dashed var(--blue);background:none;color:var(--blue)}
.offers-row:hover .ocard.fill:not(:hover) .tag{color:#cfe2fb}
.offers-row:hover .ocard.fill:not(:hover) .d{color:#aebfd2}
.offers-row:hover .ocard.fill:not(:hover) .btn.pill-white{background:var(--blue);color:#fff}

/* form validation notice (reCAPTCHA / incomplete bounce) */
.lead-form .form-alert{background:#fdece9;border:1px solid #f5c2b8;color:#9a3412;border-radius:8px;padding:10px 14px;margin-bottom:14px;font-size:13px;font-weight:600}