:root{--bg:#080b10;--panel:#101722;--panel2:#0c121a;--text:#f5f7fa;--muted:#aeb7c4;--line:rgba(255,255,255,.1);--green:#8de3c8;--shadow:0 28px 80px rgba(0,0,0,.45)}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}a{text-decoration:none;color:inherit}img{display:block;max-width:100%}.container{width:min(1180px,92%);margin:auto}header{position:sticky;top:0;z-index:10;background:rgba(8,11,16,.9);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 0}.brand{display:flex;align-items:center;gap:12px;font-weight:900}.brand img{width:48px;height:48px;object-fit:contain}.brand span{font-size:21px}.brand em{font-style:normal;color:var(--green)}nav{display:flex;gap:6px}.nav a{padding:10px 13px;border-radius:999px;color:#c7ced8;font-weight:800;font-size:14px}.nav a:hover,.nav a.active{background:var(--green);color:#06100c}.nav-cta{display:flex;gap:10px}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:13px 20px;font-weight:900;border:1px solid transparent;transition:.2s}.btn-primary{background:var(--green);color:#000!important}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(141,227,200,.22)}.btn-secondary{border-color:rgba(255,255,255,.18);color:var(--text)}.btn-secondary:hover{border-color:var(--green);color:var(--green)}.hero{position:relative;min-height:88vh;display:flex;align-items:center;background:radial-gradient(circle at 80% 12%,rgba(141,227,200,.18),transparent 35%),linear-gradient(180deg,#0a0f16,#080b10)}.hero:before{content:"";position:absolute;inset:0;opacity:.16;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:44px 44px}.hero-grid{position:relative;display:grid;grid-template-columns:1fr .92fr;gap:54px;align-items:center;padding:86px 0}.eyebrow{color:var(--green);text-transform:uppercase;letter-spacing:2px;font-size:13px;font-weight:900;margin-bottom:16px}h1{font-size:clamp(42px,6vw,76px);line-height:1.02;letter-spacing:-2px;margin-bottom:24px}.lead{font-size:clamp(18px,2vw,21px);color:#c7ced8;max-width:720px;margin-bottom:30px}.hero-img{border-radius:30px;overflow:hidden;border:1px solid rgba(255,255,255,.13);box-shadow:var(--shadow);background:#0e151f}.pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}.pill{border:1px solid var(--line);background:rgba(255,255,255,.04);padding:8px 12px;border-radius:999px;color:#c7ced8;font-size:13px;font-weight:800}section{padding:92px 0}.head{max-width:780px;margin-bottom:42px}.center{text-align:center;margin-left:auto;margin-right:auto}h2{font-size:clamp(32px,4vw,50px);line-height:1.1;letter-spacing:-1px;margin-bottom:15px}.head p{color:var(--muted);font-size:18px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{background:var(--panel);border:1px solid var(--line);border-radius:24px;padding:24px;transition:.2s}.card:hover{transform:translateY(-4px);border-color:rgba(141,227,200,.45)}.card .num{width:44px;height:44px;border-radius:15px;background:rgba(141,227,200,.11);display:grid;place-items:center;color:var(--green);font-weight:900;margin-bottom:18px}.card h3{font-size:19px;margin-bottom:8px}.card p,.muted{color:var(--muted)}.band{background:var(--panel2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.split{display:grid;grid-template-columns:.95fr 1.05fr;gap:42px;align-items:center}.image-card{border-radius:28px;overflow:hidden;border:1px solid rgba(255,255,255,.13);box-shadow:var(--shadow);background:#0e151f}.list{list-style:none;display:grid;gap:13px;margin-top:20px}.list li{color:#c7ced8;display:flex;gap:11px}.list li:before{content:"✓";color:var(--green);font-weight:900}.map-card{position:relative;border-radius:30px;overflow:hidden;border:1px solid rgba(255,255,255,.13);box-shadow:var(--shadow);background:#000;max-width:980px;margin:0 auto}.map-card>img{width:100%;display:block}.marker{position:absolute;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(8,11,16,.82);border:1px solid rgba(141,227,200,.55);box-shadow:0 0 28px rgba(141,227,200,.25)}.marker img{width:24px;height:24px;object-fit:contain}.vancouver{left:38%;top:19%}.sanfrancisco{left:41%;top:47%}.losangeles{left:44%;top:58%}.denver{left:50%;top:48%}.austin{left:52%;top:66%}.houston{left:54%;top:70%}.chicago{left:56%;top:43%}.newyork{left:66%;top:40%}.miami{left:63%;top:70%}.subhero{padding:82px 0 56px;background:radial-gradient(circle at 80% 0,rgba(141,227,200,.14),transparent 34%),#0a0f16;border-bottom:1px solid var(--line)}.subhero h1{font-size:clamp(38px,5vw,62px);max-width:940px}.service-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.market-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.quote-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:28px}.info,form{background:var(--panel);border:1px solid var(--line);border-radius:28px;padding:28px}.item{padding:16px 0;border-bottom:1px solid var(--line)}.item:last-child{border-bottom:0}.item small{display:block;color:var(--green);font-size:11px;text-transform:uppercase;letter-spacing:1px;font-weight:900;margin-bottom:4px}form{display:grid;gap:15px}.row{display:grid;grid-template-columns:1fr 1fr;gap:15px}label{font-size:13px;font-weight:900;color:#dce3ec}input,select,textarea{width:100%;margin-top:7px;padding:13px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.13);background:#0b1118;color:var(--text);font:inherit}textarea{min-height:130px}input:focus,select:focus,textarea:focus{outline:0;border-color:var(--green)}footer{padding:36px 0;color:#7f8b9a}.footer{border-top:1px solid var(--line);padding-top:28px;display:grid;grid-template-columns:1.2fr repeat(3,.7fr);gap:24px}.footer h4{color:var(--text);margin-bottom:10px}.footer a,.footer p{display:block;margin:7px 0;color:#7f8b9a;font-size:14px}@media(max-width:900px){.hero-grid,.split,.quote-grid{grid-template-columns:1fr}.cards,.market-grid,.service-grid{grid-template-columns:repeat(2,1fr)}nav{display:none}.nav-cta .btn-secondary{display:none}.footer{grid-template-columns:1fr 1fr}}@media(max-width:620px){.cards,.market-grid,.service-grid,.row,.footer{grid-template-columns:1fr}.hero{min-height:auto}.hero-grid{padding:60px 0}section{padding:68px 0}h1{letter-spacing:-1px}.marker{width:28px;height:28px}.marker img{width:20px;height:20px}}
/* Compact map area for desktop screens */
.map-card{max-height:520px}
.map-card>img{max-height:520px;object-fit:contain}
@media(max-width:900px){.map-card{max-height:none}.map-card>img{max-height:none}.marker{width:28px;height:28px}.marker img{width:20px;height:20px}}

.clients-section{padding-top:10px}
.clients-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:10px}
.client-card{background:var(--panel);border:1px solid var(--line);border-radius:24px;min-height:170px;padding:22px;display:flex;align-items:center;justify-content:center;transition:.2s}
.client-card:hover{transform:translateY(-4px);border-color:rgba(141,227,200,.45);box-shadow:0 18px 40px rgba(0,0,0,.18)}
.client-card img{max-width:100%;max-height:90px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(141,227,200,.18))}
@media(max-width:900px){.clients-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.clients-grid{grid-template-columns:1fr}}


/* Cleaner map appearance */
.map-card{
  background: transparent !important;
}
.map-card > img{
  background: transparent !important;
}

.hero-img img{
  width:100%;
  height:auto;
  display:block;
}

/* Corrected marker positions centered on requested cities */
.vancouver{left:40.31% !important; top:23.03% !important;}
.sanfrancisco{left:40.50% !important; top:47.89% !important;}
.losangeles{left:41.38% !important; top:55.00% !important;}
.denver{left:46.94% !important; top:45.66% !important;}
.austin{left:48.12% !important; top:66.05% !important;}
.houston{left:49.94% !important; top:67.11% !important;}
.chicago{left:51.19% !important; top:37.11% !important;}
.newyork{left:58.63% !important; top:35.92% !important;}
.miami{left:57.50% !important; top:70.66% !important;}


/* Refined marker positions centered more accurately on the requested cities */
.vancouver{left:40.10% !important; top:23.60% !important;}
.sanfrancisco{left:40.90% !important; top:47.20% !important;}
.losangeles{left:42.10% !important; top:53.80% !important;}
.denver{left:46.60% !important; top:46.80% !important;}
.austin{left:48.60% !important; top:67.80% !important;}
.houston{left:50.25% !important; top:68.80% !important;}
.chicago{left:50.60% !important; top:39.60% !important;}
.newyork{left:59.10% !important; top:38.80% !important;}
.miami{left:57.25% !important; top:73.20% !important;}


/* v13: photo update for the Why Trefoil Spatial section */
.image-card img{
  width: 100%;
  height: auto;
  display: block;
}


/* v14: updated map marker positions based on user-provided red-dot reference */
.vancouver{left:42.05% !important; top:40.39% !important;}
.sanfrancisco{left:40.84% !important; top:53.24% !important;}
.losangeles{left:42.19% !important; top:60.90% !important;}
.denver{left:47.19% !important; top:49.75% !important;}
/* Use one Texas marker position to match the single reference dot */
.austin{display:none !important;}
.houston{left:49.58% !important; top:63.59% !important;}
.chicago{left:57.30% !important; top:40.42% !important;}
.newyork{left:63.99% !important; top:43.89% !important;}
.miami{left:60.43% !important; top:67.88% !important;}


/* v15: photo replacement for as-built drawings and BIM-ready models section */
.image-card img{
  width: 100%;
  height: auto;
  display: block;
}


/* v16: digital deliverables realistic image replacement */
.deliverables-card img,
.image-card img[src*="digital-deliverables-workstation"]{
  width: 100%;
  height: 100%;
  min-height: 340px;
  object-fit: cover;
  display: block;
}


/* v17: place Grocery Stores on the bottom pill row before Commercial Real Estate */
.pill-row-break{
  flex-basis: 100%;
  width: 100%;
  height: 0;
  padding: 0;
  margin: -10px 0 0 0;
  border: 0;
}


/* v18: Services clean deliverables image replacement */
.clean-deliverables-card img,
.image-card img[src*="services-clean-deliverables-photo"]{
  width: 100%;
  height: 100%;
  min-height: 340px;
  object-fit: cover;
  display: block;
}


/* v19: About page image replacement for clear information section */
.image-card img[src*="about-clear-information-photo"]{
  width: 100%;
  height: 100%;
  min-height: 340px;
  object-fit: cover;
  display: block;
}


/* v20: full mobile optimization */
.mobile-menu-toggle{
  display:none;
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:14px;
  background:rgba(255,255,255,.04);
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
}
.mobile-menu-toggle span{
  width:18px;
  height:2px;
  border-radius:99px;
  background:var(--green);
  display:block;
}

@media(max-width:900px){
  .container{width:min(100% - 32px, 720px)}
  header{position:sticky;top:0}
  .nav{
    padding:10px 0;
    gap:10px;
    position:relative;
  }
  .brand{gap:9px;min-width:0}
  .brand img{width:38px;height:38px}
  .brand span{font-size:18px;white-space:nowrap}
  .mobile-menu-toggle{display:inline-flex;margin-left:auto}
  header nav{
    display:none;
    position:absolute;
    top:62px;
    left:0;
    right:0;
    flex-direction:column;
    gap:8px;
    background:rgba(8,11,16,.98);
    border:1px solid rgba(255,255,255,.12);
    border-radius:18px;
    padding:12px;
    box-shadow:0 18px 48px rgba(0,0,0,.45);
    z-index:30;
  }
  body.mobile-nav-open header nav{display:flex}
  header nav a{
    width:100%;
    padding:13px 14px;
    border-radius:13px;
  }
  .nav-cta{
    width:100%;
    order:3;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:8px;
  }
  .nav-cta .btn{
    width:100%;
    padding:11px 12px;
    font-size:13px;
    min-height:42px;
  }

  .hero{
    min-height:auto;
  }
  .hero-grid{
    grid-template-columns:1fr;
    gap:28px;
    padding:44px 0 52px;
  }
  h1{
    font-size:clamp(34px, 10vw, 50px);
    line-height:1.05;
    letter-spacing:-1.2px;
  }
  h2{
    font-size:clamp(30px, 8vw, 42px);
    line-height:1.08;
  }
  .lead{
    font-size:17px;
    line-height:1.65;
  }
  .hero .btn{
    width:100%;
    margin-bottom:10px;
  }
  .hero .btn + .btn{
    margin-left:0;
  }
  .hero-img,
  .image-card,
  .map-card{
    border-radius:22px;
  }
  .hero-img img{
    width:100%;
    min-height:260px;
    object-fit:cover;
  }

  section{
    padding:58px 0;
  }
  .head{
    margin-bottom:28px;
  }
  .cards,
  .market-grid,
  .service-grid,
  .quote-grid,
  .split{
    grid-template-columns:1fr !important;
    gap:22px;
  }
  .card,
  .info,
  form{
    border-radius:22px;
    padding:22px;
  }
  .form-row,
  .row{
    grid-template-columns:1fr !important;
  }
  .pill{
    font-size:12px;
    padding:8px 11px;
  }
  .pill-row-break{
    display:none;
  }
  .pills{
    gap:8px;
  }
  .map-card{
    max-width:100% !important;
    max-height:none !important;
  }
  .map-card > img{
    max-height:360px !important;
    object-fit:contain;
  }
  .marker{
    width:28px !important;
    height:28px !important;
  }
  .marker img{
    width:20px !important;
    height:20px !important;
  }
  .clients-grid{
    grid-template-columns:repeat(2,1fr) !important;
    gap:12px;
  }
  .client-card{
    min-height:130px;
    padding:16px;
  }
  .client-card img{
    max-height:70px;
  }
  .footer{
    grid-template-columns:1fr !important;
    gap:22px;
  }
}

@media(max-width:520px){
  .container{width:min(100% - 24px, 480px)}
  .brand span{font-size:16px}
  .brand img{width:34px;height:34px}
  .mobile-menu-toggle{width:38px;height:38px}
  .nav-cta{
    gap:8px;
  }
  .nav-cta .btn{
    padding:10px 8px;
    font-size:12px;
  }
  .hero-grid{
    padding:34px 0 44px;
  }
  h1{
    font-size:35px;
  }
  h2{
    font-size:31px;
  }
  .lead{
    font-size:16px;
  }
  section{
    padding:46px 0;
  }
  .hero-img img,
  .image-card img{
    min-height:230px;
    object-fit:cover;
  }
  .clients-grid{
    grid-template-columns:1fr !important;
  }
  .map-card > img{
    max-height:300px !important;
  }
}


/* v21: mobile-only CTA fix. Desktop stays unchanged. */
.mobile-nav-cta{
  display:none;
}

@media(max-width:900px){
  /* Hide the top-right CTA buttons on mobile to prevent overlap */
  header > .container.nav > .nav-cta{
    display:none !important;
  }

  /* Show Call Now / Request Quote inside the hamburger menu */
  header nav .mobile-nav-cta{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    margin-top:8px;
    padding-top:10px;
    border-top:1px solid rgba(255,255,255,.10);
  }

  header nav .mobile-nav-cta .btn{
    width:100%;
    min-height:44px;
    padding:12px 14px;
    font-size:14px;
  }

  /* Keep the hamburger aligned cleanly next to logo */
  .mobile-menu-toggle{
    margin-left:auto;
    flex-shrink:0;
  }

  .brand{
    max-width:calc(100% - 54px);
    overflow:hidden;
  }

  .brand span{
    overflow:hidden;
    text-overflow:ellipsis;
  }
}


/* v24 quote form fix: submit without redirecting to a page-not-found URL */
.form-status{
  display:none;
  border-radius:14px;
  padding:13px 14px;
  font-weight:800;
  font-size:14px;
}
.form-status.success{
  display:block;
  color:#06100c;
  background:var(--green);
}
.form-status.error{
  display:block;
  color:#ffd9d9;
  background:rgba(255,80,80,.12);
  border:1px solid rgba(255,120,120,.35);
}
.form-status.error a{
  color:var(--green);
  text-decoration:underline;
}


/* v25: fix home page bottom — keep Netlify hidden detection form invisible */
[hidden],
form[hidden],
.netlify-hidden-form{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  height:0 !important;
  max-height:0 !important;
  overflow:hidden !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
}