/* =============================================================
   Buddy Development Studio — EXACT HOME REFERENCE MODE
   Desktop is intentionally matched to the user-supplied 1536×1024
   visual master. Interactive regions sit over the reference image;
   below 1100px we switch to a real responsive layout.
   ============================================================= */

body.corporate-site[data-page="home"]{background:#f7fbff}

/* Pixel-locked desktop master */
.exact-home-stage{
  position:relative;
  width:100%;
  aspect-ratio:3 / 2;
  margin:0;
  background:#eaf3fb url('../images/branding/home-exact-1536.png') center top / 100% 100% no-repeat;
  overflow:hidden;
  isolation:isolate;
}
.exact-home-stage .exact-hotspot{
  position:absolute;
  z-index:20;
  display:block;
  border-radius:14px;
  background:transparent;
  text-decoration:none;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.exact-home-stage .exact-hotspot:hover{background:rgba(255,255,255,.025)}
.exact-home-stage .exact-hotspot:focus-visible{outline:3px solid #00a8ff;outline-offset:2px;background:rgba(0,168,255,.08)}
.exact-home-stage .sr-only,
.exact-home-semantics{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}

/* Navigation hotspots */
.exact-hs-logo{left:4.8%;top:.2%;width:17%;height:7.2%}
.exact-hs-home{left:29.5%;top:1.2%;width:4.1%;height:4.6%}
.exact-hs-about{left:34.0%;top:1.2%;width:4.4%;height:4.6%}
.exact-hs-services{left:38.8%;top:1.2%;width:5.1%;height:4.6%}
.exact-hs-projects{left:44.4%;top:1.2%;width:5.0%;height:4.6%}
.exact-hs-calculator{left:49.8%;top:1.2%;width:6.4%;height:4.6%}
.exact-hs-hosting{left:56.4%;top:1.2%;width:4.9%;height:4.6%}
.exact-hs-contact{left:61.7%;top:1.2%;width:5.0%;height:4.6%}
.exact-hs-top-cta{left:84.4%;top:1.2%;width:12.2%;height:4.7%}

/* Hero */
.exact-hs-hero-cta{left:6.1%;top:28.0%;width:13.0%;height:4.8%}
.exact-hs-hero-work{left:20.2%;top:28.0%;width:15.3%;height:4.8%}
.exact-hs-quick-web{left:6.0%;top:34.2%;width:9.3%;height:7.5%}
.exact-hs-quick-android{left:15.3%;top:34.2%;width:9.2%;height:7.5%}
.exact-hs-quick-systems{left:24.4%;top:34.2%;width:9.0%;height:7.5%}
.exact-hs-quick-hosting{left:33.5%;top:34.2%;width:9.6%;height:7.5%}
.exact-hs-quick-support{left:42.4%;top:34.2%;width:10.8%;height:7.5%}

/* Projects */
.exact-hs-projects-all{left:83.8%;top:51.5%;width:11.5%;height:4.1%}
.exact-hs-project-1{left:5.1%;top:56.8%;width:14.6%;height:12.7%}
.exact-hs-project-2{left:20.3%;top:56.8%;width:14.4%;height:12.7%}
.exact-hs-project-3{left:35.5%;top:56.8%;width:14.4%;height:12.7%}
.exact-hs-project-4{left:50.7%;top:56.8%;width:14.5%;height:12.7%}
.exact-hs-project-5{left:65.9%;top:56.8%;width:14.0%;height:12.7%}
.exact-hs-project-6{left:80.5%;top:56.8%;width:14.5%;height:12.7%}

/* Services */
.exact-hs-services-all{left:83.8%;top:72.9%;width:11.6%;height:4.0%}
.exact-hs-service-1{left:5.0%;top:77.7%;width:17.7%;height:12.6%}
.exact-hs-service-2{left:23.5%;top:77.7%;width:17.3%;height:12.6%}
.exact-hs-service-3{left:41.6%;top:77.7%;width:17.0%;height:12.6%}
.exact-hs-service-4{left:59.5%;top:77.7%;width:17.2%;height:12.6%}
.exact-hs-service-5{left:77.7%;top:77.7%;width:17.4%;height:12.6%}

/* Bottom CTA */
.exact-hs-quote{left:68.4%;top:93.9%;width:13.0%;height:4.8%}
.exact-hs-contact-cta{left:82.1%;top:93.9%;width:12.7%;height:4.8%}

/* Keep the screenshot truly edge-to-edge on desktop. */
@media (min-width:1100px){
  html:has(body.corporate-site[data-page="home"]){scrollbar-width:none}
  html:has(body.corporate-site[data-page="home"])::-webkit-scrollbar{width:0;height:0}
  body.corporate-site[data-page="home"]{scrollbar-width:none}
  body.corporate-site[data-page="home"]::-webkit-scrollbar{width:0;height:0}
  body.corporate-site[data-page="home"] .site-header{display:none!important}
  body.corporate-site[data-page="home"] main{overflow:visible!important}
  body.corporate-site[data-page="home"] .exact-home-mobile{display:none!important}
  body.corporate-site[data-page="home"] .page-progress{display:none!important}
  body.corporate-site[data-page="home"] .corporate-footer{margin-top:0}
}

/* =============================================================
   Responsive reconstruction for tablets / phones
   ============================================================= */
.exact-home-mobile{display:none;background:#f7fbff;color:#0b2444}
.exact-mobile-shell{width:min(calc(100% - 2rem),760px);margin-inline:auto}
.exact-mobile-hero{position:relative;overflow:hidden;padding:7rem 0 2.25rem;background:#071d3b url('../images/branding/corporate-hero.webp') center/cover no-repeat;color:#fff;isolation:isolate}
.exact-mobile-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(3,22,46,.96),rgba(4,34,66,.78) 58%,rgba(3,26,53,.5))}
.exact-mobile-kicker{margin:0 0 .8rem;color:#25c4ff!important;font-size:.67rem;font-weight:900;letter-spacing:.2em;text-transform:uppercase}
.exact-mobile-hero h1{margin:0;color:#fff!important;font-size:clamp(2.45rem,10vw,4.25rem)!important;line-height:.98!important;letter-spacing:-.055em!important}
.exact-mobile-hero h1 span{display:block;color:#18b8ff!important}
.exact-mobile-lead{margin:1rem 0 0;max-width:640px;color:#e4f0fa!important;font-size:.95rem;line-height:1.65}
.exact-mobile-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.25rem}
.exact-mobile-actions .button{min-height:46px}
.exact-mobile-buddy{display:block;width:min(88vw,480px);margin:1.75rem auto -2.25rem;border-radius:28px;box-shadow:0 28px 55px rgba(0,0,0,.35);mask-image:linear-gradient(to bottom,#000 0 86%,transparent 100%)}
.exact-mobile-quick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;margin-top:1rem}
.exact-mobile-quick a{display:flex;align-items:center;gap:.65rem;min-height:58px;padding:.8rem;border:1px solid rgba(255,255,255,.16);border-radius:13px;background:rgba(4,31,61,.55);color:#fff;text-decoration:none;backdrop-filter:blur(10px)}
.exact-mobile-quick b{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#08a8ff;color:#fff;font-size:.8rem}
.exact-mobile-quick span{font-size:.74rem;font-weight:800;line-height:1.25}
.exact-mobile-stats{position:relative;z-index:3;margin:-.8rem auto 0;display:grid;grid-template-columns:repeat(2,1fr);background:linear-gradient(135deg,#06284e,#061d39);border-radius:18px;box-shadow:0 20px 42px rgba(4,32,65,.24);overflow:hidden}
.exact-mobile-stats article{padding:1rem;text-align:center;border:1px solid rgba(255,255,255,.08)}
.exact-mobile-stats strong{display:block;color:#fff;font-size:1.35rem}
.exact-mobile-stats small{color:#c4d8e9;font-size:.68rem}
.exact-mobile-section{padding:3.4rem 0;background:#fff}
.exact-mobile-section.services{background:#f3f8fd;border-top:1px solid #dfeaf4}
.exact-mobile-head{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1.25rem}
.exact-mobile-head p{margin:0 0 .35rem;color:#087cf0!important;font-size:.62rem;font-weight:900;letter-spacing:.18em;text-transform:uppercase}
.exact-mobile-head h2{margin:0;font-size:clamp(2rem,7vw,3rem)!important;line-height:1!important}
.exact-mobile-head h2 span{color:#087cf0}
.exact-mobile-head>a{flex:0 0 auto;color:#087cf0;font-size:.74rem;font-weight:800;text-decoration:none}
.exact-mobile-projects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.exact-mobile-project{overflow:hidden;border:1px solid #dbe6f0;border-radius:14px;background:#fff;text-decoration:none;box-shadow:0 12px 25px rgba(6,38,76,.07)}
.exact-mobile-project img{display:block;width:100%;aspect-ratio:1.6/1;object-fit:cover;object-position:top center;background:#eef4f9}
.exact-mobile-project div{padding:.8rem .85rem}
.exact-mobile-project h3{margin:0;font-size:.9rem!important;line-height:1.15}
.exact-mobile-project span{display:block;margin-top:.2rem;color:#667b92;font-size:.64rem;line-height:1.3}
.exact-mobile-services{display:grid;grid-template-columns:1fr;gap:.8rem}
.exact-mobile-service{display:grid;grid-template-columns:58px 1fr auto;align-items:center;gap:.8rem;padding:.75rem;border:1px solid #dbe6f0;border-radius:14px;background:#fff;text-decoration:none;box-shadow:0 10px 24px rgba(6,38,76,.055)}
.exact-mobile-service .icon{display:grid;place-items:center;width:58px;height:58px;border-radius:12px;background:#edf7ff;color:#0784f7;font-size:1.4rem;font-weight:900}
.exact-mobile-service h3{margin:0;font-size:.92rem!important}
.exact-mobile-service p{margin:.18rem 0 0;color:#667b92!important;font-size:.68rem;line-height:1.35}
.exact-mobile-service .go{display:grid;place-items:center;width:30px;height:30px;border:1px solid #7fc1fa;border-radius:50%;color:#0784f7;font-weight:900}
.exact-mobile-cta{position:relative;padding:3rem 0;background:#08294d url('../images/branding/corporate-cta.webp') center/cover no-repeat;color:#fff;isolation:isolate}
.exact-mobile-cta::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(5,31,61,.96),rgba(8,48,88,.78))}
.exact-mobile-cta h2{margin:0;color:#fff!important;font-size:clamp(2rem,8vw,3rem)!important}
.exact-mobile-cta p{color:#d5e4ef!important}

@media (max-width:1099px){
  .exact-home-stage{display:none!important}
  .exact-home-mobile{display:block!important}
  body.corporate-site[data-page="home"] .site-header{position:fixed!important;top:0;left:0;right:0;background:rgba(255,255,255,.96)!important;box-shadow:0 8px 28px rgba(7,36,72,.09)!important}
}
@media (max-width:620px){
  .exact-mobile-projects{grid-template-columns:1fr}
  .exact-mobile-quick{grid-template-columns:1fr}
  .exact-mobile-stats{grid-template-columns:1fr 1fr}
  .exact-mobile-head{align-items:start;flex-direction:column}
  .exact-mobile-actions{display:grid;grid-template-columns:1fr;width:100%}
  .exact-mobile-actions .button{width:100%}
}