:root{
  --navy:#0f2742;
  --navy-2:#173a5f;
  --navy-3:#091a2d;
  --yellow:#ffd51f;
  --yellow-2:#f0c500;
  --text:#10263d;
  --muted:#6f7e8f;
  --bg:#f6f8fb;
  --white:#fff;
  --shadow:0 14px 35px rgba(15,39,66,.16);
  --radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--text);
  background:#fff;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(1180px,calc(100% - 40px));margin:0 auto}
.site-header{
  position:sticky;
  top:0;
  z-index:1000;
  background:rgba(15,39,66,.98);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.nav-wrap{
  min-height:72px;
  display:flex;
  align-items:center;
  gap:28px;
}
.brand{display:flex;align-items:center;gap:10px;min-width:max-content}
.brand-mark{
  width:42px;height:42px;border-radius:11px;
  display:grid;place-items:center;
  background:var(--yellow);color:var(--navy);
  font-weight:900;letter-spacing:-1px;
}
.brand-text{display:flex;flex-direction:column;line-height:1.05;color:#fff}
.brand-text strong{font-size:16px}
.brand-text small{font-size:10px;color:#b8c7d9;margin-top:4px}
.main-nav{display:flex;align-items:center;gap:26px;margin-left:auto}
.main-nav a{
  color:#fff;font-size:14px;font-weight:600;opacity:.88;position:relative;
}
.main-nav a:after{
  content:"";position:absolute;left:0;bottom:-10px;width:0;height:2px;
  background:var(--yellow);transition:.25s;
}
.main-nav a:hover{opacity:1}
.main-nav a:hover:after{width:100%}
.header-contact{
  display:flex;align-items:center;gap:10px;color:#fff;
  padding-left:22px;border-left:1px solid rgba(255,255,255,.16)
}
.header-contact small{display:block;color:#aebfd0;font-size:10px}
.header-contact strong{font-size:13px}
.contact-icon{color:var(--yellow);font-size:22px}
.nav-toggle{display:none;background:none;border:0;padding:6px;cursor:pointer}
.nav-toggle span{display:block;width:26px;height:2px;background:#fff;margin:5px 0}

.hero{
  position:relative;
  min-height:650px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 25%, rgba(255,213,31,.20), transparent 22%),
    linear-gradient(115deg,#0a1c30 0%,#143453 48%,#1b4f6a 100%);
}
.hero:before{
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,transparent 0 71%,rgba(255,255,255,.05) 71% 72%,transparent 72%),
    linear-gradient(0deg,transparent 0 74%,rgba(255,255,255,.04) 74% 75%,transparent 75%);
  background-size:220px 220px;
  opacity:.35;
}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,14,25,.78),rgba(4,14,25,.18))}
.hero-grid{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1.2fr .8fr;gap:70px;align-items:center;
  padding:90px 0;
}
.eyebrow,.section-kicker{
  display:inline-block;
  color:var(--yellow);
  font-size:12px;font-weight:800;letter-spacing:1.6px;
  margin-bottom:15px;
}
.hero h1{
  margin:0;color:#fff;font-size:clamp(44px,6vw,76px);
  line-height:.98;letter-spacing:-3px;max-width:780px;
}
.hero h1 span,.section h2 span,.cta h2 span{color:var(--yellow)}
.hero-copy>p{
  margin:24px 0 0;color:#c7d4df;line-height:1.8;max-width:670px;font-size:16px;
}
.hero-actions{display:flex;align-items:center;gap:24px;margin-top:32px;flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:50px;padding:0 24px;border-radius:10px;
  font-weight:800;font-size:14px;transition:.2s;border:1px solid transparent;
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--yellow);color:var(--navy);box-shadow:0 8px 22px rgba(255,213,31,.23)}
.call-link{display:flex;align-items:center;gap:10px;color:#fff}
.call-circle{
  width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,213,31,.16);border:1px solid rgba(255,213,31,.5);color:var(--yellow)
}
.call-link small{display:block;color:#aebfd0;font-size:10px}
.call-link strong{font-size:13px}
.hero-stats{display:flex;gap:52px;margin-top:62px}
.hero-stats div{display:flex;flex-direction:column}
.hero-stats strong{font-size:38px;color:#fff;letter-spacing:-1.5px}
.hero-stats span{color:var(--yellow);font-size:12px;font-weight:700;margin-top:4px}

.hero-feature{
  align-self:end;
  margin-bottom:40px;
  background:rgba(10,28,48,.72);
  border:1px solid rgba(255,255,255,.13);
  backdrop-filter:blur(10px);
  border-radius:18px;overflow:hidden;
  box-shadow:var(--shadow);
}
.hero-placeholder{
  height:230px;
  display:flex;flex-direction:column;justify-content:center;align-items:center;gap:14px;
  color:#c6d4e0;text-align:center;padding:20px;
  background:
    radial-gradient(circle at 30% 30%,rgba(255,213,31,.18),transparent 32%),
    linear-gradient(135deg,#173d61,#0c2139);
}
.play{
  width:70px;height:70px;border-radius:50%;display:grid;place-items:center;
  border:2px solid rgba(255,255,255,.7);color:#fff;font-size:24px;padding-left:4px;
}
.hero-feature-copy{padding:22px 24px 24px}
.hero-feature-copy small{color:var(--yellow);font-weight:800}
.hero-feature-copy h3{margin:7px 0 8px;color:#fff}
.hero-feature-copy p{margin:0;color:#b8c7d6;line-height:1.6;font-size:13px}

.feature-strip{background:#fff;padding:34px 0 20px;position:relative;z-index:5}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.feature-card{
  background:var(--navy);color:#fff;border-radius:16px;
  padding:28px 24px;text-align:center;box-shadow:var(--shadow);
  transition:.25s;
}
.feature-card:hover{transform:translateY(-6px)}
.icon-box{font-size:34px;margin-bottom:16px}
.feature-card h3{color:var(--yellow);font-size:15px;margin:0 0 10px}
.feature-card p{margin:0;color:#c8d3df;line-height:1.55;font-size:12px}

.section{padding:100px 0}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:85px;align-items:center}
.about-visual{position:relative;min-height:520px}
.placeholder{
  border-radius:20px;overflow:hidden;
  display:grid;place-items:center;text-align:center;
  color:#d8e3ec;font-weight:800;letter-spacing:.3px;
  background:
    linear-gradient(135deg,rgba(255,213,31,.11),transparent),
    linear-gradient(135deg,#183b5d,#0f2742);
}
.placeholder.large{position:absolute;right:0;top:0;width:78%;height:465px}
.placeholder.small{
  position:absolute;left:0;bottom:20px;width:42%;height:225px;
  border:8px solid #fff;
}
.experience{
  position:absolute;left:25%;bottom:-4px;
  width:120px;height:120px;border-radius:18px;
  background:var(--yellow);display:flex;flex-direction:column;
  align-items:center;justify-content:center;color:var(--navy);box-shadow:var(--shadow)
}
.experience strong{font-size:36px}
.experience span{font-size:12px;font-weight:800}
.about-copy h2,.projects h2,.cta h2{
  margin:0;font-size:clamp(34px,4.8vw,56px);line-height:1.05;letter-spacing:-2px
}
.about-copy>p,.section-head p{
  color:var(--muted);line-height:1.8;margin:22px 0 28px;font-size:14px
}
.mission-list{display:grid;gap:18px;margin-bottom:28px}
.mission-item{display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:flex-start}
.mini-icon{
  width:48px;height:48px;border-radius:12px;display:grid;place-items:center;
  background:var(--navy);color:var(--yellow);font-weight:900;font-size:20px
}
.mission-item h4{margin:0 0 7px;font-size:15px}
.mission-item p{margin:0;color:var(--muted);line-height:1.7;font-size:13px}

.projects{background:var(--bg)}
.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:38px}
.section-head>div{max-width:720px}
.project-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.project-card{
  position:relative;height:330px;border-radius:18px;overflow:hidden;
  box-shadow:0 12px 28px rgba(13,39,65,.12)
}
.project-image{position:absolute;inset:0;transition:.35s}
.project-card:hover .project-image{transform:scale(1.04)}
.p1{background:linear-gradient(135deg,#2f5f78,#0d263d)}
.p2{background:linear-gradient(135deg,#486273,#182f42)}
.p3{background:linear-gradient(135deg,#254560,#657889)}
.p4{background:linear-gradient(135deg,#203d56,#0d2033)}
.project-image:before{
  content:"Şəkil sonradan əlavə ediləcək";
  position:absolute;inset:0;display:grid;place-items:center;
  color:#c5d3de;font-size:12px;font-weight:700;
  background:
    radial-gradient(circle at 60% 30%,rgba(255,213,31,.18),transparent 25%),
    repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 1px,transparent 1px 18px)
}
.project-overlay{
  position:absolute;left:0;right:0;bottom:0;padding:56px 18px 18px;
  background:linear-gradient(transparent,rgba(4,16,28,.95))
}
.project-overlay h3{margin:0;color:var(--yellow);font-size:16px}
.project-overlay p{margin:6px 0 0;color:#fff;font-size:12px;line-height:1.5}

.cta{
  position:relative;
  background:
    radial-gradient(circle at 18% 30%,rgba(255,213,31,.16),transparent 24%),
    linear-gradient(120deg,#0a1c30,#1b405f);
  color:#fff;padding:88px 0;overflow:hidden;
}
.cta:before{
  content:"";position:absolute;right:-100px;top:-180px;width:520px;height:520px;
  border:1px solid rgba(255,255,255,.08);border-radius:50%;
  box-shadow:0 0 0 60px rgba(255,255,255,.02),0 0 0 120px rgba(255,255,255,.015)
}
.cta-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,15,27,.7),rgba(4,15,27,.2))}
.cta-inner{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:40px}
.cta-inner>div:first-child{max-width:720px}
.section-kicker.light{color:var(--yellow)}
.cta p{color:#c8d5df;line-height:1.7}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.btn-outline{border-color:rgba(255,255,255,.65);color:#fff;background:transparent}

.footer{background:#071522;color:#b9c6d2;padding:28px 0}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:20px}
.footer p{margin:0;font-size:12px}
.footer-brand .brand-mark{width:38px;height:38px}

@media (max-width:980px){
  .header-contact{display:none}
  .main-nav{
    position:absolute;left:20px;right:20px;top:82px;
    display:none;flex-direction:column;align-items:stretch;gap:0;
    background:var(--navy);border:1px solid rgba(255,255,255,.08);
    border-radius:14px;padding:10px;box-shadow:var(--shadow)
  }
  .main-nav.open{display:flex}
  .main-nav a{padding:14px 12px;border-radius:8px}
  .main-nav a:hover{background:rgba(255,255,255,.06)}
  .main-nav a:after{display:none}
  .nav-toggle{display:block;margin-left:auto}
  .hero{min-height:auto}
  .hero-grid{grid-template-columns:1fr;padding:72px 0 70px;gap:40px}
  .hero-feature{align-self:stretch;margin:0;display:grid;grid-template-columns:1fr 1fr}
  .hero-placeholder{height:100%}
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .about-grid{grid-template-columns:1fr;gap:55px}
  .about-visual{max-width:650px;width:100%;margin:0 auto}
  .project-grid{grid-template-columns:repeat(2,1fr)}
  .cta-inner{flex-direction:column;align-items:flex-start}
  .cta-actions{justify-content:flex-start}
}

@media (max-width:640px){
  .container{width:min(100% - 28px,1180px)}
  .nav-wrap{min-height:66px}
  .brand-text strong{font-size:14px}
  .hero-grid{padding:58px 0 54px}
  .hero h1{font-size:44px;letter-spacing:-2px}
  .hero-copy>p{font-size:14px}
  .hero-stats{gap:28px;margin-top:44px}
  .hero-stats strong{font-size:30px}
  .hero-feature{grid-template-columns:1fr}
  .hero-placeholder{min-height:190px}
  .feature-strip{padding-top:22px}
  .feature-grid{grid-template-columns:1fr;gap:14px}
  .feature-card{padding:24px 20px}
  .section{padding:72px 0}
  .about-visual{min-height:410px}
  .placeholder.large{width:86%;height:360px}
  .placeholder.small{width:46%;height:170px}
  .experience{width:100px;height:100px;left:29%;bottom:8px}
  .experience strong{font-size:30px}
  .about-copy h2,.projects h2,.cta h2{font-size:38px}
  .section-head{align-items:flex-start;flex-direction:column;margin-bottom:26px}
  .project-grid{grid-template-columns:1fr}
  .project-card{height:300px}
  .cta{padding:70px 0}
  .cta-actions{width:100%}
  .cta-actions .btn{flex:1}
  .footer-inner{flex-direction:column;align-items:flex-start}
}

@media (max-width:390px){
  .hero h1{font-size:39px}
  .hero-actions{align-items:flex-start;flex-direction:column}
  .hero-stats{gap:18px}
  .hero-stats strong{font-size:27px}
  .cta-actions{flex-direction:column}
  .cta-actions .btn{width:100%}
}


/* =========================
   INTERACTIVE HERO SLIDER
   ========================= */
.hero-slider-section{
  padding:42px 0 34px;
  background:
    radial-gradient(circle at 85% 15%,rgba(255,213,31,.10),transparent 28%),
    linear-gradient(180deg,#edf1f5 0%,#f7f8fa 100%);
}
.hero-slider-shell{
  position:relative;
  min-height:620px;
  overflow:hidden;
  border-radius:34px;
  background:
    linear-gradient(120deg,rgba(255,255,255,.96),rgba(239,242,245,.94));
  box-shadow:0 35px 75px rgba(8,29,48,.20);
  display:grid;
  grid-template-columns:92px minmax(300px,.85fr) minmax(520px,1.35fr);
  align-items:center;
  padding:58px 0 58px 0;
}
.hero-slider-shell:before{
  content:"";
  position:absolute;
  right:-180px;
  top:-260px;
  width:650px;
  height:650px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,213,31,.11),transparent 66%);
  pointer-events:none;
}
.slider-dots{
  height:300px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:space-between;
  position:relative;
  z-index:3;
}
.slider-dots:before{
  content:"";
  position:absolute;
  top:15px;
  bottom:15px;
  left:50%;
  width:1px;
  background:#aeb7c0;
  transform:translateX(-50%);
  z-index:-1;
}
.slider-dot{
  width:14px;
  height:14px;
  padding:0;
  border-radius:50%;
  border:0;
  background:#26313b;
  cursor:pointer;
  position:relative;
  transition:.3s ease;
}
.slider-dot.active{
  width:32px;
  height:32px;
  background:#17283a;
  color:#fff;
  box-shadow:0 0 0 6px rgba(255,255,255,.82);
}
.slider-dot.active:after{
  content:attr(data-index);
  color:#fff;
  font-size:11px;
  font-weight:800;
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
}
.slider-copy{
  padding:10px 50px 10px 22px;
  position:relative;
  z-index:2;
}
.slider-kicker{
  display:block;
  color:#b38c00;
  font-size:12px;
  font-weight:900;
  letter-spacing:1.8px;
  margin-bottom:15px;
}
.slider-copy h1{
  margin:0 0 16px;
  font-size:clamp(54px,6vw,88px);
  line-height:.95;
  letter-spacing:-4px;
  color:#1e252c;
  transition:opacity .22s ease,transform .22s ease;
}
.slider-copy p{
  max-width:470px;
  margin:0 0 28px;
  color:#59636d;
  line-height:1.65;
  font-size:15px;
  min-height:74px;
  transition:opacity .22s ease,transform .22s ease;
}
.slider-copy.is-changing h1,
.slider-copy.is-changing p{
  opacity:0;
  transform:translateY(10px);
}
.slider-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 28px;
  border-radius:8px;
  background:#1e252c;
  color:#fff;
  font-weight:800;
  font-size:13px;
  transition:.2s ease;
}
.slider-btn:hover{
  background:var(--navy);
  transform:translateY(-2px);
}
.slider-progress{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:48px;
  color:#5c6670;
  font-size:11px;
  font-weight:800;
}
.progress-line{
  width:135px;
  height:2px;
  background:#cdd3d8;
  overflow:hidden;
}
.progress-fill{
  width:25%;
  height:100%;
  background:#1e252c;
  transition:width .35s ease;
}
.slider-visual-area{
  position:relative;
  overflow:visible;
  padding-left:10px;
}
.slider-track{
  display:flex;
  gap:26px;
  align-items:center;
  transition:transform .55s cubic-bezier(.22,.61,.36,1);
  will-change:transform;
}
.visual-card{
  flex:0 0 315px;
  height:430px;
  border-radius:22px;
  overflow:hidden;
  background:#17283a;
  box-shadow:0 18px 35px rgba(16,38,58,.18);
  transform:scale(.88);
  opacity:.7;
  transition:transform .45s ease,opacity .45s ease,box-shadow .45s ease;
}
.visual-card.active-card{
  transform:scale(1);
  opacity:1;
  box-shadow:0 24px 50px rgba(16,38,58,.28);
}
.visual-placeholder{
  height:330px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  gap:8px;
  color:#fff;
  position:relative;
  overflow:hidden;
}
.visual-placeholder:after{
  content:"";
  position:absolute;
  inset:0;
  background:
    repeating-linear-gradient(135deg,rgba(255,255,255,.025) 0 1px,transparent 1px 18px);
}
.visual-placeholder span{
  position:relative;
  z-index:1;
  font-size:30px;
  font-weight:900;
  letter-spacing:2px;
}
.visual-placeholder small{
  position:relative;
  z-index:1;
  color:#dce3e9;
}
.visual-card-caption{
  height:100px;
  padding:20px 22px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:#10263d;
  color:#fff;
}
.visual-card-caption strong{
  font-size:16px;
  color:var(--yellow);
  margin-bottom:5px;
}
.visual-card-caption span{
  color:#c3ced8;
  font-size:12px;
}
.slider-nav{
  position:absolute;
  right:34px;
  bottom:28px;
  display:flex;
  gap:9px;
  z-index:5;
}
.slider-arrow{
  width:44px;
  height:44px;
  border-radius:50%;
  border:1px solid #c9d0d6;
  background:#fff;
  color:#1d2934;
  font-size:18px;
  cursor:pointer;
  transition:.2s;
}
.slider-arrow:hover{
  background:var(--yellow);
  border-color:var(--yellow);
}
@media (max-width:1050px){
  .hero-slider-shell{
    grid-template-columns:70px 1fr;
    padding:46px 0 46px;
  }
  .slider-copy{
    padding-right:30px;
  }
  .slider-visual-area{
    grid-column:1 / -1;
    padding:42px 24px 10px 70px;
  }
  .slider-track{
    overflow:visible;
  }
  .visual-card{
    flex-basis:280px;
    height:390px;
  }
  .visual-placeholder{height:295px}
  .slider-nav{bottom:20px}
}
@media (max-width:700px){
  .hero-slider-section{padding:18px 0 24px}
  .hero-slider-shell{
    min-height:auto;
    border-radius:24px;
    display:block;
    padding:34px 0 74px;
  }
  .slider-dots{
    height:auto;
    flex-direction:row;
    justify-content:center;
    gap:18px;
    margin:0 0 28px;
  }
  .slider-dots:before{
    top:50%;
    bottom:auto;
    left:calc(50% - 75px);
    width:150px;
    height:1px;
    transform:none;
  }
  .slider-dot{z-index:2}
  .slider-copy{
    padding:0 24px;
  }
  .slider-copy h1{
    font-size:52px;
    letter-spacing:-3px;
  }
  .slider-copy p{
    min-height:auto;
    font-size:14px;
  }
  .slider-progress{
    margin-top:28px;
  }
  .slider-visual-area{
    padding:38px 0 0 24px;
    overflow:hidden;
  }
  .visual-card{
    flex-basis:78vw;
    max-width:320px;
    height:390px;
  }
  .slider-nav{
    right:24px;
    bottom:18px;
  }
}


/* =========================
   BRANDS SECTION
   ========================= */
.brands-section{
  position:relative;
  background:
    radial-gradient(circle at 10% 15%,rgba(255,213,31,.10),transparent 28%),
    linear-gradient(180deg,#0c2036 0%,#102a46 100%);
  overflow:hidden;
}
.brands-section:before{
  content:"";
  position:absolute;
  width:460px;
  height:460px;
  right:-180px;
  top:-210px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.06);
  box-shadow:
    0 0 0 55px rgba(255,255,255,.018),
    0 0 0 110px rgba(255,255,255,.012);
}
.brands-head{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:70px;
  align-items:end;
  margin-bottom:38px;
}
.brands-head h2{
  margin:0;
  color:#fff;
  font-size:clamp(34px,4.8vw,56px);
  line-height:1.05;
  letter-spacing:-2px;
}
.brands-head h2 span{
  color:var(--yellow);
}
.brands-head p{
  margin:0;
  color:#b9c8d6;
  line-height:1.75;
  font-size:14px;
  max-width:560px;
  justify-self:end;
}
.brands-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:16px;
}
.brand-card{
  min-height:120px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px 22px;
  background:rgba(255,255,255,.97);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 12px 28px rgba(4,15,27,.16);
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease;
}
.brand-card:hover{
  transform:translateY(-5px);
  border-color:rgba(255,213,31,.9);
  box-shadow:0 18px 36px rgba(4,15,27,.24);
}
.brand-card img{
  display:block;
  width:100%;
  max-width:145px;
  max-height:52px;
  object-fit:contain;
  filter:grayscale(1) contrast(1.05);
  opacity:.78;
  transition:filter .25s ease,opacity .25s ease,transform .25s ease;
}
.brand-card:hover img{
  filter:grayscale(0);
  opacity:1;
  transform:scale(1.03);
}
@media (max-width:1100px){
  .brands-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:820px){
  .brands-head{
    grid-template-columns:1fr;
    gap:18px;
    align-items:start;
  }
  .brands-head p{justify-self:start}
  .brands-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:560px){
  .brands-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .brand-card{
    min-height:96px;
    padding:18px 16px;
    border-radius:14px;
  }
  .brand-card img{
    max-width:120px;
    max-height:42px;
  }
}


/* ==========================================================
   LIGHT SAAS / FINTECH VISUAL THEME
   Structure is unchanged. Only visual language is updated.
   ========================================================== */
:root{
  --navy:#181818;
  --navy-2:#2a2a2a;
  --navy-3:#0f0f0f;
  --yellow:#ff6b2c;
  --yellow-2:#f45b1d;
  --text:#1d1d1f;
  --muted:#727272;
  --bg:#f7f6f3;
  --white:#ffffff;
  --line:#e8e5df;
  --soft:#f3f1ec;
  --shadow:0 18px 45px rgba(24,24,24,.08);
  --radius:22px;
}

html{background:#fbfaf7}
body{
  font-family:"Manrope",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--text);
  background:#fbfaf7;
  letter-spacing:-.01em;
}

/* Header */
.site-header{
  background:rgba(251,250,247,.92);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(18px);
  box-shadow:none;
}
.nav-wrap{min-height:76px}
.brand-mark{
  background:#181818;
  color:#fff;
  border-radius:50%;
  box-shadow:none;
}
.brand-text{color:#171717}
.brand-text strong{font-weight:800}
.brand-text small{color:#8a8a8a}
.main-nav a{
  color:#2f2f2f;
  font-weight:600;
  opacity:1;
}
.main-nav a:after{background:var(--yellow)}
.header-contact{
  color:#1e1e1e;
  border-left:1px solid var(--line);
}
.header-contact small{color:#969696}
.contact-icon{color:var(--yellow)}
.nav-toggle span{background:#1b1b1b}

/* Slider / hero */
.hero-slider-section{
  padding:26px 0 44px;
  background:
    radial-gradient(circle at 50% 8%,rgba(255,107,44,.08),transparent 18%),
    linear-gradient(180deg,#fbfaf7 0%,#f7f5f0 100%);
}
.hero-slider-shell{
  min-height:620px;
  border:1px solid #ece8e1;
  border-radius:30px;
  background:
    radial-gradient(circle at 76% 18%,rgba(255,107,44,.07),transparent 20%),
    #fff;
  box-shadow:0 28px 70px rgba(28,28,28,.09);
}
.hero-slider-shell:before{
  opacity:.45;
  background:
    radial-gradient(circle,rgba(255,107,44,.10),transparent 62%);
}
.slider-dots:before{background:#d9d5cf}
.slider-dot{background:#d8d5d0}
.slider-dot.active{
  background:#1b1b1b;
  box-shadow:0 0 0 6px #fff;
}
.slider-kicker{
  color:var(--yellow);
  font-weight:800;
  letter-spacing:1.25px;
}
.slider-copy h1{
  color:#191919;
  font-weight:800;
  letter-spacing:-4.5px;
}
.slider-copy p{
  color:#6f6f6f;
  font-weight:500;
}
.slider-btn{
  background:var(--yellow);
  color:#fff;
  border-radius:999px;
  box-shadow:0 10px 24px rgba(255,107,44,.22);
}
.slider-btn:hover{background:#ea581d}
.slider-progress{color:#858585}
.progress-line{background:#e2ded8}
.progress-fill{background:#1e1e1e}

.visual-card{
  background:#f0eee9;
  border:1px solid #e7e3dd;
  box-shadow:0 14px 30px rgba(28,28,28,.08);
}
.visual-card.active-card{
  box-shadow:0 22px 48px rgba(28,28,28,.12);
}
.visual-engineering-main, .visual-hvac-main, .visual-lift-main, .visual-procurement-main{
  background:
    radial-gradient(circle at 65% 25%,rgba(255,107,44,.18),transparent 26%),
    linear-gradient(145deg,#f3f0ea,#ded9d1);
}
.visual-placeholder span{color:#1b1b1b}
.visual-placeholder small{color:#747474}
.visual-card-caption{
  background:#fff;
  color:#181818;
  border-top:1px solid #ebe7e0;
}
.visual-card-caption strong{color:#181818}
.visual-card-caption span{color:#7a7a7a}
.slider-arrow{
  border-color:#dedad3;
  background:#fff;
  color:#1d1d1d;
}
.slider-arrow:hover{
  background:var(--yellow);
  border-color:var(--yellow);
  color:#fff;
}

/* Service cards */
.feature-strip{
  background:#fbfaf7;
  padding:28px 0 22px;
}
.feature-card{
  background:#fff;
  color:#1c1c1c;
  border:1px solid var(--line);
  box-shadow:none;
  text-align:left;
  border-radius:18px;
}
.feature-card:hover{
  border-color:#d9d4cc;
  box-shadow:0 15px 35px rgba(25,25,25,.07);
}
.icon-box{
  width:48px;height:48px;
  border-radius:14px;
  display:grid;place-items:center;
  background:#fff1ea;
  margin-bottom:20px;
}
.feature-card h3{
  color:#1c1c1c;
  font-weight:800;
  font-size:16px;
}
.feature-card p{color:#797979}

/* Shared section typography */
.section-kicker,
.eyebrow{
  color:var(--yellow);
  letter-spacing:1.35px;
}
.section{padding:104px 0}
.about-copy h2,
.projects h2,
.brands-head h2,
.cta h2{
  font-weight:800;
  letter-spacing:-3px;
}
.about-copy>p,
.section-head p,
.mission-item p{
  color:#797979;
}

/* About */
.about{background:#fff}
.placeholder{
  color:#6e6e6e;
  background:
    radial-gradient(circle at 70% 20%,rgba(255,107,44,.12),transparent 26%),
    linear-gradient(145deg,#f4f1eb,#e2ddd5);
  border:1px solid #e8e3dc;
}
.placeholder.small{border:8px solid #fff}
.experience{
  background:var(--yellow);
  color:#fff;
  box-shadow:0 16px 30px rgba(255,107,44,.18);
}
.mini-icon{
  background:#fff1ea;
  color:var(--yellow);
  border:1px solid #ffe1d3;
}

/* Brands */
.brands-section{
  background:#f7f5f0;
  border-top:1px solid #ece8e1;
  border-bottom:1px solid #ece8e1;
}
.brands-section:before{
  border-color:rgba(24,24,24,.05);
  box-shadow:
    0 0 0 55px rgba(24,24,24,.015),
    0 0 0 110px rgba(24,24,24,.01);
}
.brands-head h2{color:#1c1c1c}
.brands-head h2 span{color:var(--yellow)}
.brands-head p{color:#777}
.brand-card{
  background:#fff;
  border:1px solid #e7e3dd;
  box-shadow:none;
}
.brand-card:hover{
  border-color:#ffb18d;
  box-shadow:0 14px 30px rgba(25,25,25,.07);
}
.brand-card img{
  filter:grayscale(1) contrast(1.04);
  opacity:.72;
}

/* Projects */
.projects{background:#fbfaf7}
.project-card{
  border:1px solid #e7e3dd;
  box-shadow:none;
  background:#fff;
}
.p1,.p2,.p3,.p4{
  background:
    radial-gradient(circle at 72% 22%,rgba(255,107,44,.16),transparent 24%),
    linear-gradient(145deg,#f2efe9,#ddd8d0);
}
.project-image:before{
  color:#777;
  background:
    radial-gradient(circle at 60% 30%,rgba(255,107,44,.10),transparent 25%),
    repeating-linear-gradient(135deg,rgba(20,20,20,.025) 0 1px,transparent 1px 18px)
}
.project-overlay{
  background:linear-gradient(transparent,rgba(255,255,255,.96));
}
.project-overlay h3{color:#1d1d1d}
.project-overlay p{color:#767676}

/* Buttons */
.btn-primary{
  background:var(--yellow);
  color:#fff;
  border-radius:999px;
  box-shadow:0 10px 24px rgba(255,107,44,.18);
}
.btn-primary:hover{background:#eb5b1f}

/* CTA */
.cta{
  background:
    radial-gradient(circle at 14% 25%,rgba(255,107,44,.13),transparent 23%),
    #191919;
}
.cta:before{
  border-color:rgba(255,255,255,.06);
  box-shadow:
    0 0 0 60px rgba(255,255,255,.015),
    0 0 0 120px rgba(255,255,255,.01);
}
.cta-shade{background:linear-gradient(90deg,rgba(0,0,0,.10),rgba(0,0,0,.02))}
.cta h2{color:#fff}
.cta h2 span{color:#ff8a55}
.cta p{color:#bdbdbd}
.btn-outline{
  border-color:#595959;
  color:#fff;
  background:transparent;
  border-radius:999px;
}
.btn-outline:hover{
  border-color:#fff;
  background:#fff;
  color:#171717;
}

/* Footer */
.footer{
  background:#111;
  color:#aaa;
  border-top:1px solid #232323;
}
.footer .brand-text{color:#fff}
.footer .brand-text small{color:#858585}
.footer .brand-mark{background:#fff;color:#111}

/* mobile nav */
@media (max-width:980px){
  .main-nav{
    background:rgba(255,255,255,.98);
    border:1px solid var(--line);
    box-shadow:0 18px 45px rgba(20,20,20,.10);
  }
  .main-nav a{color:#1f1f1f}
  .main-nav a:hover{background:#f4f1ec}
}

@media (max-width:700px){
  .hero-slider-shell{border-radius:22px}
  .slider-copy h1{
    font-size:48px;
    letter-spacing:-3.2px;
  }
}


/* =========================
   APPLICATION / REQUEST FORM
   ========================= */
.application-section{
  background:
    radial-gradient(circle at 15% 5%,rgba(255,107,44,.07),transparent 24%),
    #f7f5f0;
  border-top:1px solid #ece8e1;
}
.application-heading{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:70px;
  align-items:end;
  margin-bottom:38px;
}
.application-heading h2{
  margin:0;
  color:#1c1c1c;
  font-size:clamp(34px,4.8vw,56px);
  line-height:1.05;
  letter-spacing:-3px;
  font-weight:800;
}
.application-heading h2 span{color:var(--yellow)}
.application-heading p{
  margin:0;
  color:#777;
  line-height:1.75;
  font-size:14px;
  max-width:560px;
  justify-self:end;
}
.application-grid{
  display:grid;
  grid-template-columns:1.03fr .97fr;
  gap:22px;
  align-items:stretch;
}
.contact-panel{display:flex;flex-direction:column;gap:14px}
.contact-mini-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.contact-info-card{
  min-height:94px;
  display:flex;
  align-items:flex-start;
  gap:13px;
  padding:18px;
  border-radius:16px;
  background:#fff;
  border:1px solid #e7e3dd;
  transition:.22s ease;
}
a.contact-info-card:hover{
  border-color:#ffb18d;
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(25,25,25,.06);
}
.contact-info-icon{
  flex:0 0 38px;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#fff1ea;
  color:var(--yellow);
  font-weight:900;
  font-size:14px;
}
.contact-info-icon.whatsapp{
  background:#e9f9ef;
  color:#1b9b50;
  font-size:10px;
}
.contact-info-card small{
  display:block;
  color:#929292;
  font-size:11px;
  margin-bottom:6px;
}
.contact-info-card strong{
  display:block;
  color:#202020;
  font-size:13px;
  line-height:1.5;
}
.map-card{
  overflow:hidden;
  border-radius:18px;
  background:#fff;
  border:1px solid #e7e3dd;
}
.map-topbar{
  min-height:46px;
  padding:0 16px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
  border-bottom:1px solid #ece8e1;
  font-size:11px;
  color:#777;
}
.map-topbar a{
  color:var(--yellow);
  font-weight:800;
}
.map-card iframe{
  width:100%;
  height:258px;
  display:block;
  border:0;
  filter:saturate(.80) contrast(.96);
}
.address-bar{
  min-height:56px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 16px;
  border-radius:14px;
  background:#fff;
  border:1px solid #e7e3dd;
  color:#343434;
  font-size:12px;
}
.address-pin{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#fff1ea;
  color:var(--yellow);
}

.request-card{
  border-radius:22px;
  background:#fff;
  border:1px solid #e7e3dd;
  padding:30px;
  box-shadow:0 18px 45px rgba(24,24,24,.06);
}
.request-card-head{margin-bottom:24px}
.request-badge{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 11px;
  border-radius:999px;
  background:#fff1ea;
  color:var(--yellow);
  font-size:10px;
  font-weight:900;
  letter-spacing:1px;
  margin-bottom:14px;
}
.request-card h3{
  margin:0 0 7px;
  font-size:26px;
  letter-spacing:-1px;
  color:#1b1b1b;
}
.request-card-head p{
  margin:0;
  color:#8a8a8a;
  font-size:13px;
  line-height:1.6;
}
.request-form{display:grid;gap:15px}
.request-form label>span{
  display:block;
  margin-bottom:7px;
  color:#555;
  font-size:11px;
  font-weight:800;
}
.request-form input,
.request-form select,
.request-form textarea{
  width:100%;
  border:1px solid #e1ddd6;
  border-radius:12px;
  background:#f7f5f1;
  color:#222;
  font:inherit;
  font-size:13px;
  outline:none;
  transition:.2s ease;
}
.request-form input,
.request-form select{
  height:48px;
  padding:0 14px;
}
.request-form textarea{
  min-height:112px;
  padding:14px;
  resize:vertical;
}
.request-form input:focus,
.request-form select:focus,
.request-form textarea:focus{
  border-color:#ffad87;
  background:#fff;
  box-shadow:0 0 0 4px rgba(255,107,44,.08);
}
.request-submit{
  min-height:52px;
  border:0;
  border-radius:999px;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  padding:0 22px;
  cursor:pointer;
  background:var(--yellow);
  color:#fff;
  font:inherit;
  font-size:14px;
  font-weight:900;
  box-shadow:0 12px 26px rgba(255,107,44,.20);
  transition:.2s ease;
}
.request-submit:hover{
  transform:translateY(-2px);
  background:#ea581d;
}
.wa-dot{
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#fff;
  color:#1b9b50;
  font-size:9px;
  font-weight:900;
}
.form-note{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  color:#9b9b9b;
}
.form-note small{font-size:10px}

@media (max-width:960px){
  .application-heading{
    grid-template-columns:1fr;
    gap:18px;
    align-items:start;
  }
  .application-heading p{justify-self:start}
  .application-grid{grid-template-columns:1fr}
}
@media (max-width:600px){
  .contact-mini-grid{grid-template-columns:1fr}
  .request-card{padding:22px 18px}
  .map-card iframe{height:230px}
  .application-heading h2{
    font-size:38px;
    letter-spacing:-2px;
  }
}


/* =========================
   ANIMATED WORLD MAP BACKGROUND
   ========================= */
.hero-slider-shell{
  isolation:isolate;
}
.hero-slider-shell::after{
  content:"";
  position:absolute;
  inset:-7%;
  z-index:0;
  pointer-events:none;
  background:
    url("assets/backgrounds/world-map-orange.png")
    center center / 82% auto no-repeat;
  opacity:.28;
  transform:translate3d(0,0,0) scale(1.02);
  animation:worldMapDrift 16s ease-in-out infinite alternate;
  filter:blur(.1px);
}
.hero-slider-shell > *{
  position:relative;
  z-index:1;
}
.hero-slider-shell .slider-nav{
  position:absolute;
  z-index:5;
}
@keyframes worldMapDrift{
  0%{
    transform:translate3d(-1.2%,.6%,0) scale(1.02);
    opacity:.20;
  }
  50%{
    transform:translate3d(.8%,-.8%,0) scale(1.055);
    opacity:.30;
  }
  100%{
    transform:translate3d(1.5%,.4%,0) scale(1.025);
    opacity:.23;
  }
}

@media (max-width:700px){
  .hero-slider-shell::after{
    inset:-3%;
    background-size:145% auto;
    background-position:center 30%;
    opacity:.18;
    animation-duration:20s;
  }
}

@media (prefers-reduced-motion:reduce){
  .hero-slider-shell::after{
    animation:none;
    transform:none;
  }
}


/* ==========================================================
   MOBILE APP MODE
   Desktop/tablet layout remains unchanged above 768px.
   ========================================================== */
.mobile-app-header,
.mobile-bottom-nav{
  display:none;
}

@media (max-width:768px){
  :root{
    --mobile-bar-h:72px;
    --mobile-header-h:64px;
  }

  html{
    scroll-padding-top:calc(var(--mobile-header-h) + 12px);
    background:#f5f3ee;
  }

  body{
    background:#f5f3ee;
    padding-top:var(--mobile-header-h);
    padding-bottom:calc(var(--mobile-bar-h) + env(safe-area-inset-bottom) + 10px);
    overscroll-behavior-y:contain;
  }

  /* Desktop header is replaced only on mobile */
  .site-header{
    display:none;
  }

  .mobile-app-header{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:1400;
    height:var(--mobile-header-h);
    padding:0 15px;
    padding-top:env(safe-area-inset-top);
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:rgba(255,255,255,.90);
    border-bottom:1px solid rgba(31,31,31,.07);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
  }

  .mobile-app-brand{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
  }

  .mobile-app-logo{
    width:38px;
    height:38px;
    border-radius:12px;
    display:grid;
    place-items:center;
    flex:0 0 38px;
    background:#1b1b1b;
    color:#fff;
    font-size:12px;
    font-weight:900;
    letter-spacing:-.5px;
    box-shadow:0 8px 18px rgba(20,20,20,.10);
  }

  .mobile-app-brand strong{
    display:block;
    color:#171717;
    font-size:14px;
    line-height:1.1;
  }

  .mobile-app-brand small{
    display:block;
    margin-top:3px;
    color:#999;
    font-size:9px;
    line-height:1.1;
  }

  .mobile-header-call{
    width:40px;
    height:40px;
    border-radius:13px;
    display:grid;
    place-items:center;
    background:#fff1ea;
    color:var(--yellow);
    border:1px solid #ffe1d3;
    font-size:17px;
    box-shadow:0 7px 18px rgba(255,107,44,.08);
  }

  /* App canvas */
  main{
    overflow:hidden;
  }

  .container{
    width:calc(100% - 24px);
  }

  .section{
    padding:58px 0;
  }

  /* Hero behaves like a mobile app home card */
  .hero-slider-section{
    padding:12px 0 22px;
    background:#f5f3ee;
  }

  .hero-slider-shell{
    min-height:auto;
    border-radius:26px;
    padding:24px 0 70px;
    background:
      radial-gradient(circle at 75% 7%,rgba(255,107,44,.08),transparent 25%),
      #fff;
    box-shadow:0 14px 38px rgba(25,25,25,.07);
    border:1px solid #ebe7df;
  }

  .hero-slider-shell::after{
    background-size:165% auto;
    background-position:center 18%;
    opacity:.13;
  }

  .slider-dots{
    margin:0 0 20px;
    gap:14px;
  }

  .slider-dot{
    width:9px;
    height:9px;
  }

  .slider-dot.active{
    width:24px;
    height:24px;
    box-shadow:0 0 0 4px #fff;
  }

  .slider-copy{
    padding:0 20px;
  }

  .slider-kicker{
    font-size:10px;
    margin-bottom:10px;
  }

  .slider-copy h1{
    font-size:clamp(40px,12vw,54px);
    line-height:.95;
    letter-spacing:-3px;
    margin-bottom:14px;
  }

  .slider-copy p{
    max-width:none;
    font-size:13px;
    line-height:1.6;
    margin-bottom:20px;
  }

  .slider-btn{
    min-height:44px;
    padding:0 20px;
    font-size:12px;
  }

  .slider-progress{
    margin-top:22px;
  }

  .progress-line{
    flex:1;
    max-width:120px;
  }

  .slider-visual-area{
    padding:28px 0 0 20px;
    overflow:hidden;
  }

  .slider-track{
    gap:14px;
  }

  .visual-card{
    flex:0 0 calc(100vw - 72px);
    max-width:320px;
    height:360px;
    border-radius:20px;
    transform:scale(.96);
  }

  .visual-card.active-card{
    transform:scale(1);
  }

  .visual-placeholder{
    height:272px;
  }

  .visual-placeholder span{
    font-size:25px;
  }

  .visual-card-caption{
    height:88px;
    padding:16px 18px;
  }

  .slider-nav{
    right:18px;
    bottom:14px;
  }

  .slider-arrow{
    width:40px;
    height:40px;
  }

  /* Service cards look like app shortcut tiles */
  .feature-strip{
    padding:8px 0 24px;
    background:#f5f3ee;
  }

  .feature-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .feature-card{
    min-height:150px;
    padding:18px 15px;
    border-radius:19px;
    background:#fff;
    border:1px solid #ebe7df;
    box-shadow:0 8px 22px rgba(25,25,25,.045);
  }

  .feature-card:hover{
    transform:none;
  }

  .feature-card .icon-box{
    width:42px;
    height:42px;
    margin-bottom:14px;
    border-radius:13px;
    font-size:20px;
  }

  .feature-card h3{
    font-size:13px;
    margin-bottom:7px;
  }

  .feature-card p{
    font-size:10.5px;
    line-height:1.5;
  }

  /* About becomes a compact app section */
  .about{
    background:#fff;
    border-radius:28px 28px 0 0;
  }

  .about-grid{
    gap:36px;
  }

  .about-visual{
    min-height:345px;
  }

  .placeholder.large{
    height:305px;
    width:88%;
    border-radius:20px;
  }

  .placeholder.small{
    width:46%;
    height:145px;
    border-radius:16px;
  }

  .experience{
    width:92px;
    height:92px;
    border-radius:17px;
  }

  .experience strong{
    font-size:27px;
  }

  .about-copy h2,
  .projects h2,
  .brands-head h2,
  .application-heading h2,
  .cta h2{
    font-size:34px;
    letter-spacing:-2px;
  }

  /* Brands as horizontal app carousel */
  .brands-section{
    padding-top:54px;
    padding-bottom:54px;
  }

  .brands-grid{
    display:flex;
    overflow-x:auto;
    gap:10px;
    margin-right:-12px;
    padding-right:12px;
    padding-bottom:8px;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }

  .brands-grid::-webkit-scrollbar{
    display:none;
  }

  .brand-card{
    flex:0 0 44%;
    min-height:92px;
    scroll-snap-align:start;
    border-radius:17px;
  }

  /* Projects as horizontal cards */
  .project-grid{
    display:flex;
    overflow-x:auto;
    gap:12px;
    margin-right:-12px;
    padding-right:12px;
    padding-bottom:8px;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }

  .project-grid::-webkit-scrollbar{
    display:none;
  }

  .project-card{
    flex:0 0 78%;
    height:285px;
    scroll-snap-align:start;
    border-radius:20px;
  }

  /* Application form feels like a native sheet */
  .application-section{
    background:#f5f3ee;
    padding-top:54px;
  }

  .application-grid{
    gap:14px;
  }

  .contact-mini-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }

  .contact-info-card{
    min-height:104px;
    padding:14px;
    border-radius:17px;
  }

  .contact-info-icon{
    width:36px;
    height:36px;
    flex-basis:36px;
    border-radius:12px;
  }

  .contact-info-card strong{
    font-size:11px;
  }

  .map-card{
    border-radius:20px;
  }

  .map-card iframe{
    height:210px;
  }

  .request-card{
    border-radius:24px;
    padding:22px 17px;
    box-shadow:0 12px 32px rgba(24,24,24,.055);
  }

  .request-form input,
  .request-form select{
    height:50px;
    border-radius:14px;
    background:#f7f5f1;
  }

  .request-form textarea{
    border-radius:14px;
    min-height:118px;
  }

  .request-submit{
    min-height:54px;
    border-radius:16px;
  }

  /* CTA becomes final app card */
  .cta{
    margin:0 12px 18px;
    border-radius:26px;
    padding:44px 0;
  }

  .cta-inner{
    width:calc(100% - 34px);
  }

  .cta-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    width:100%;
  }

  .cta-actions .btn{
    min-height:48px;
    width:100%;
  }

  .footer{
    display:none;
  }

  /* Native-app style bottom tab bar */
  .mobile-bottom-nav{
    position:fixed;
    left:10px;
    right:10px;
    bottom:calc(8px + env(safe-area-inset-bottom));
    z-index:1600;
    height:var(--mobile-bar-h);
    padding:8px 7px;
    display:grid;
    grid-template-columns:repeat(5,1fr);
    align-items:end;
    background:rgba(255,255,255,.94);
    border:1px solid rgba(30,30,30,.08);
    border-radius:24px;
    box-shadow:0 18px 50px rgba(20,20,20,.16);
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
  }

  .mobile-nav-item{
    min-width:0;
    height:54px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    color:#969696;
    font-size:9px;
    font-weight:700;
    border-radius:15px;
    transition:.2s ease;
  }

  .mobile-nav-icon{
    font-size:18px;
    line-height:1;
  }

  .mobile-nav-item.active{
    color:#181818;
    background:#f5f3ee;
  }

  .mobile-nav-main{
    position:relative;
    margin-top:-25px;
    height:70px;
    color:#5b5b5b;
  }

  .mobile-nav-main-icon{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    margin-bottom:2px;
    border-radius:17px;
    background:var(--yellow);
    color:#fff;
    font-size:18px;
    box-shadow:0 10px 24px rgba(255,107,44,.28);
  }

  .mobile-nav-main.active{
    background:transparent;
    color:#181818;
  }

  .mobile-nav-main.active .mobile-nav-main-icon{
    transform:translateY(-2px);
  }
}

@media (max-width:390px){
  .feature-grid{
    gap:8px;
  }

  .feature-card{
    min-height:144px;
    padding:16px 13px;
  }

  .contact-mini-grid{
    grid-template-columns:1fr;
  }

  .mobile-nav-item{
    font-size:8px;
  }
}








/* ==========================================================
   NIKE / PRODUCT APP STYLE SERVICE CARDS
   Latest service card design based on supplied reference.
   ========================================================== */
.nike-card-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
  align-items:start;
}

.nike-service-card{
  display:block;
  overflow:hidden;
  min-width:0;
  border:1px solid #e8e4dd;
  border-radius:34px;
  background:#fff;
  color:#1c1c1c;
  box-shadow:0 18px 42px rgba(24,24,24,.075);
  transition:transform .28s ease, box-shadow .28s ease;
}

.nike-service-card:hover{
  transform:translateY(-8px);
  box-shadow:0 28px 58px rgba(24,24,24,.12);
}

.nike-card-top{
  position:relative;
  min-height:380px;
  overflow:hidden;
  padding:18px 18px 0;
  background:
    radial-gradient(circle at 70% 12%,rgba(255,107,44,.10),transparent 24%),
    linear-gradient(180deg,#f8fbfb 0%,#f4f7f5 64%,#eef5f2 100%);
}

.nike-back,
.nike-menu{
  position:absolute;
  top:17px;
  z-index:3;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  color:#161616;
  font-size:24px;
  font-weight:700;
  line-height:1;
}

.nike-back{left:17px}
.nike-menu{right:17px;font-size:19px}

.nike-card-brand{
  position:absolute;
  top:17px;
  left:50%;
  transform:translateX(-50%);
  z-index:3;
  color:var(--yellow);
  font-size:14px;
  line-height:34px;
  font-weight:900;
  letter-spacing:-1px;
}

.nike-card-title{
  position:relative;
  z-index:2;
  text-align:center;
  padding-top:48px;
}

.nike-card-title small{
  display:block;
  margin-bottom:5px;
  color:#777;
  font-size:8px;
  font-weight:800;
  letter-spacing:1.1px;
}

.nike-card-title strong{
  display:block;
  color:#202020;
  font-size:17px;
  line-height:1.18;
  font-weight:800;
  letter-spacing:-.6px;
}

.nike-product-visual{
  position:relative;
  height:245px;
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.nike-orbit{
  position:absolute;
  left:50%;
  bottom:14px;
  width:78%;
  height:38px;
  transform:translateX(-50%);
  border:2px solid rgba(60,162,143,.28);
  border-radius:50%;
}

.nike-object{
  position:relative;
  z-index:2;
  width:76%;
  height:190px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  border-radius:48% 38% 44% 32%;
  transform:rotate(-15deg);
  box-shadow:0 20px 34px rgba(25,25,25,.12);
  overflow:hidden;
}

.nike-object::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(135deg,rgba(255,255,255,.35),transparent 32%),
    repeating-linear-gradient(135deg,rgba(255,255,255,.055) 0 1px,transparent 1px 14px);
}

.nike-object span,
.nike-object small{
  position:relative;
  z-index:1;
  transform:rotate(15deg);
}

.nike-object span{
  color:#fff;
  font-size:23px;
  line-height:1;
  font-weight:900;
  letter-spacing:-1px;
}

.nike-object small{
  margin-top:7px;
  color:rgba(255,255,255,.78);
  font-size:8px;
}

.nike-hotspot{
  position:absolute;
  z-index:3;
  width:20px;
  height:20px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#54b6a6;
  color:#fff;
  border:2px solid rgba(255,255,255,.9);
  box-shadow:0 3px 8px rgba(30,30,30,.15);
  font-size:12px;
  font-style:normal;
}
.nike-hotspot.h1{left:22%;top:44%}
.nike-hotspot.h2{right:21%;top:34%}
.nike-hotspot.h3{right:28%;bottom:22%}

.nike-center-badge{
  position:absolute;
  left:50%;
  bottom:-16px;
  z-index:5;
  width:44px;
  height:44px;
  transform:translateX(-50%);
  display:grid;
  place-items:center;
  border:4px solid #f4f7f5;
  border-radius:50%;
  background:#fff;
  color:#57a99e;
  box-shadow:0 7px 18px rgba(25,25,25,.12);
  font-size:18px;
}

.nike-card-info{
  position:relative;
  padding:26px 18px 18px;
  background:#fff;
  border-radius:0 0 34px 34px;
}

.nike-price-row{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  padding-bottom:14px;
  border-bottom:1px solid #eee9e2;
}

.nike-price-row small{
  display:block;
  color:#9a9a9a;
  font-size:8px;
  line-height:1.2;
}

.nike-price-row strong{
  display:block;
  margin-top:3px;
  color:#d69044;
  font-size:20px;
  line-height:1;
  font-weight:800;
  letter-spacing:-.8px;
}

.nike-palette{
  display:grid;
  grid-template-columns:repeat(3,14px);
  gap:4px;
  align-items:end;
  justify-items:center;
}

.nike-palette span{
  width:14px;
  height:14px;
  border-radius:3px;
}
.nike-palette span:nth-child(1){background:linear-gradient(135deg,#4f74aa,#ff7a32)}
.nike-palette span:nth-child(2){background:linear-gradient(135deg,#ff7a32,#d9bb55)}
.nike-palette span:nth-child(3){background:linear-gradient(135deg,#3da494,#c7ebd8)}
.nike-palette small{
  grid-column:1/-1;
  color:#969696;
  font-size:7px;
  margin-top:2px;
}

.nike-service-name{
  padding:14px 0 8px;
  text-align:center;
}

.nike-service-name > small{
  display:inline-grid;
  place-items:center;
  width:40px;
  height:40px;
  margin-bottom:7px;
  border:1px solid #e6dfd6;
  border-radius:50%;
  background:#fff;
  color:#181818;
  font-size:17px;
  font-weight:800;
  box-shadow:0 6px 14px rgba(24,24,24,.05);
}

.nike-service-name strong{
  display:block;
  color:#222;
  font-size:14px;
  line-height:1.25;
  font-weight:800;
}

.nike-service-name p{
  margin:5px 0 0;
  color:#8a8a8a;
  font-size:8.5px;
  line-height:1.45;
}

.nike-option-row{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:5px;
  padding:8px 0 14px;
}

.nike-option-row span{
  min-height:32px;
  display:grid;
  place-items:center;
  border-bottom:2px solid #eee8df;
  color:#737373;
  font-size:8.5px;
  font-weight:700;
}

.nike-option-row span:nth-child(2){
  color:#1e1e1e;
  border-bottom-color:var(--yellow);
}

.nike-card-footer{
  display:grid;
  grid-template-columns:34px 1fr 34px;
  gap:8px;
  align-items:center;
}

.nike-heart,
.nike-cart{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  color:#1e1e1e;
  font-size:17px;
}

.nike-heart{color:#f1423d}

.nike-buy-btn{
  min-height:44px;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:linear-gradient(90deg,#ff8f52,#ff6b2c);
  color:#fff;
  font-size:10px;
  font-weight:800;
  box-shadow:0 10px 20px rgba(255,107,44,.20);
  transition:.2s ease;
}

.nike-service-card:hover .nike-buy-btn{
  transform:translateY(-2px);
  box-shadow:0 14px 26px rgba(255,107,44,.28);
}

@media (max-width:1100px){
  .nike-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:768px){
  .nike-card-grid{
    display:flex;
    overflow-x:auto;
    gap:14px;
    margin-right:-12px;
    padding-right:12px;
    padding-bottom:14px;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }

  .nike-card-grid::-webkit-scrollbar{display:none}

  .nike-service-card{
    flex:0 0 80%;
    max-width:310px;
    scroll-snap-align:start;
    border-radius:32px;
  }

  .nike-card-top{
    min-height:365px;
  }

  .nike-card-info{
    border-radius:0 0 32px 32px;
  }
}




/* ==========================================================
   CLEAN SAAS SERVICE LANDING PAGE
   Based on the supplied white / teal landing-page reference.
   ========================================================== */
.service-landing-page{
  min-height:100vh;
  padding:34px 0 60px;
  background:#efefef;
  color:#1b1b1b;
}
.service-landing-frame{
  width:min(1160px,calc(100% - 34px));
  margin:0 auto;
  overflow:hidden;
  border:1px solid #e4e4e4;
  border-radius:28px;
  background:#fff;
  box-shadow:0 20px 60px rgba(24,24,24,.06);
}
.service-landing-nav{
  height:68px;
  padding:0 24px;
  display:flex;
  align-items:center;
  gap:28px;
  border-bottom:1px solid #f0f0f0;
}
.service-landing-logo{
  min-width:max-content;
  color:#121212;
  font-size:14px;
  font-weight:900;
  letter-spacing:-.7px;
}
.service-landing-links{
  display:flex;
  gap:22px;
  margin-left:auto;
}
.service-landing-links a{
  color:#747474;
  font-size:10px;
  font-weight:700;
}
.service-landing-links a:hover{color:#1d1d1d}
.service-landing-cta{
  min-height:34px;
  padding:0 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#111;
  color:#fff;
  font-size:9px;
  font-weight:800;
}
.service-landing-hero{
  padding:74px 24px 34px;
  text-align:center;
}
.service-landing-badge{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:26px;
  padding:0 10px;
  border:1px solid #e8e8e8;
  border-radius:999px;
  background:#fafafa;
  color:#6f6f6f;
  font-size:8.5px;
  font-weight:700;
}
.service-landing-badge i{
  width:6px;height:6px;border-radius:50%;
  background:#6dd7c0;
  box-shadow:0 0 0 4px rgba(109,215,192,.12);
}
.service-landing-hero h1{
  max-width:760px;
  margin:18px auto 14px;
  color:#1d1d1d;
  font-size:clamp(48px,6.2vw,82px);
  line-height:.95;
  letter-spacing:-4.4px;
  font-weight:800;
}
.service-landing-hero h1 .accent{
  display:inline-block;
  padding:2px 11px 5px;
  border-radius:999px;
  background:#e7faf6;
  color:#26a98f;
}
.service-landing-hero p{
  max-width:640px;
  margin:0 auto;
  color:#858585;
  font-size:12px;
  line-height:1.65;
}
.service-landing-actions{
  margin-top:24px;
  display:flex;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
}
.service-landing-btn{
  min-height:40px;
  padding:0 16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  font-size:9px;
  font-weight:800;
}
.service-landing-btn.dark{background:#151515;color:#fff}
.service-landing-btn.light{
  border:1px solid #dedede;
  background:#fff;
  color:#252525;
}
.service-steps{
  padding:34px 34px 50px;
}
.service-steps-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  max-width:900px;
  margin:0 auto;
}
.service-step-card{
  position:relative;
  min-height:220px;
  padding:20px;
  border:1px solid #e8e8e8;
  border-radius:24px;
  background:#fbfbfb;
  text-align:left;
  box-shadow:0 12px 30px rgba(25,25,25,.035);
}
.service-step-card:nth-child(1){transform:rotate(-3deg)}
.service-step-card:nth-child(2){transform:rotate(1deg)}
.service-step-card:nth-child(3){transform:rotate(3deg)}
.service-step-card .step-no{
  display:inline-grid;
  place-items:center;
  width:34px;height:34px;
  border-radius:12px;
  background:#e8faf6;
  color:#26a98f;
  font-size:9px;
  font-weight:900;
}
.service-step-card h3{
  margin:42px 0 8px;
  color:#1f1f1f;
  font-size:16px;
  line-height:1.2;
  letter-spacing:-.6px;
}
.service-step-card p{
  margin:0;
  color:#909090;
  font-size:10px;
  line-height:1.6;
}
.service-quick{
  padding:24px 34px 42px;
  text-align:center;
  border-top:1px solid #f2f2f2;
}
.service-quick-avatar{
  width:42px;height:42px;
  margin:0 auto 10px;
  display:grid;place-items:center;
  border-radius:50%;
  background:linear-gradient(135deg,#cba88d,#7a5f52);
  color:#fff;
  font-size:10px;
  font-weight:800;
}
.service-quick h3{
  margin:0 0 5px;
  color:#232323;
  font-size:14px;
}
.service-quick p{
  margin:0 auto;
  max-width:600px;
  color:#9a9a9a;
  font-size:9.5px;
  line-height:1.55;
}
.service-logo-strip{
  padding:20px 34px 36px;
  display:flex;
  justify-content:center;
  gap:38px;
  flex-wrap:wrap;
  border-top:1px solid #f4f4f4;
}
.service-logo-strip span{
  color:#7e7e7e;
  font-size:11px;
  font-weight:800;
  letter-spacing:.4px;
}
.service-manage{
  padding:48px 34px 56px;
  background:#fcfcfc;
  border-top:1px solid #f0f0f0;
}
.service-manage-head{
  max-width:700px;
  margin:0 auto 26px;
  text-align:center;
}
.service-manage-head small{
  color:#8f8f8f;
  font-size:8px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:1px;
}
.service-manage-head h2{
  margin:9px 0 7px;
  color:#1d1d1d;
  font-size:32px;
  line-height:1.05;
  letter-spacing:-1.8px;
}
.service-manage-head p{
  margin:0;
  color:#969696;
  font-size:10px;
}
.service-manage-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
  max-width:920px;
  margin:0 auto;
}
.service-preview-card{
  min-height:260px;
  padding:18px;
  border:1px solid #e8e8e8;
  border-radius:24px;
  background:#fff;
  box-shadow:0 10px 26px rgba(25,25,25,.035);
}
.service-preview-window{
  height:150px;
  border-radius:17px;
  background:
    linear-gradient(180deg,#f2f2f2 0 22%,transparent 22%),
    repeating-linear-gradient(180deg,#fff 0 28px,#f4f4f4 28px 29px);
  border:1px solid #ededed;
}
.service-preview-tags{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  margin-top:16px;
}
.service-preview-tags span{
  min-height:26px;
  padding:0 9px;
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  background:#e8faf6;
  color:#2e9d88;
  font-size:8px;
  font-weight:800;
}
.service-preview-side{
  display:grid;
  gap:12px;
}
.service-mini-panel{
  min-height:124px;
  padding:16px;
  border:1px solid #e8e8e8;
  border-radius:20px;
  background:#fff;
}
.service-mini-panel strong{
  display:block;
  color:#262626;
  font-size:13px;
}
.service-mini-panel p{
  margin:7px 0 0;
  color:#959595;
  font-size:9px;
  line-height:1.5;
}
.service-landing-back{
  margin:26px 0 0;
  text-align:center;
}
.service-landing-back a{
  color:#7f7f7f;
  font-size:9px;
  font-weight:700;
}
@media (max-width:800px){
  .service-landing-page{padding:0;background:#fff}
  .service-landing-frame{
    width:100%;
    border:0;
    border-radius:0;
    box-shadow:none;
  }
  .service-landing-nav{
    height:60px;
    padding:0 16px;
  }
  .service-landing-links{display:none}
  .service-landing-cta{margin-left:auto}
  .service-landing-hero{
    padding:54px 18px 26px;
  }
  .service-landing-hero h1{
    font-size:48px;
    letter-spacing:-3px;
  }
  .service-steps{
    padding:28px 18px 42px;
    overflow:hidden;
  }
  .service-steps-grid{
    display:flex;
    overflow-x:auto;
    gap:12px;
    margin-right:-18px;
    padding-right:18px;
    padding-bottom:10px;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }
  .service-steps-grid::-webkit-scrollbar{display:none}
  .service-step-card{
    flex:0 0 78%;
    max-width:290px;
    min-height:210px;
    scroll-snap-align:start;
    transform:none !important;
  }
  .service-logo-strip{gap:20px;padding:18px}
  .service-manage{
    padding:40px 18px 44px;
  }
  .service-manage-grid{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   SERVICE STEPS SLIDER
   Keeps the same card shape/design, but makes the section slide.
   ========================================================== */
.service-steps{
  overflow:hidden;
}
.service-steps-slider{
  position:relative;
  max-width:960px;
  margin:0 auto;
}
.service-steps-viewport{
  overflow:hidden;
  border-radius:28px;
  padding:10px 2px 18px;
}
.service-steps-track{
  display:flex;
  gap:18px;
  transition:transform .55s cubic-bezier(.22,.61,.36,1);
  will-change:transform;
}
.service-steps-track .service-step-card{
  flex:0 0 calc((100% - 36px) / 3);
  min-width:0;
  min-height:220px;
  margin:0;
  scroll-snap-align:none;
}
.service-steps-track .service-step-card:nth-child(1){transform:rotate(-2.2deg)}
.service-steps-track .service-step-card:nth-child(2){transform:rotate(.8deg)}
.service-steps-track .service-step-card:nth-child(3){transform:rotate(2.2deg)}

.service-steps-controls{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-top:8px;
}
.service-steps-dots{
  display:flex;
  align-items:center;
  gap:7px;
}
.step-dot{
  width:7px;
  height:7px;
  padding:0;
  border:0;
  border-radius:50%;
  background:#d7d7d7;
  cursor:pointer;
  transition:.22s ease;
}
.step-dot.active{
  width:22px;
  border-radius:999px;
  background:#37b79f;
}
.service-steps-arrows{
  display:flex;
  gap:8px;
}
.step-arrow{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border:1px solid #e4e4e4;
  border-radius:50%;
  background:#fff;
  color:#202020;
  cursor:pointer;
  font-size:15px;
  transition:.2s ease;
}
.step-arrow:hover{
  border-color:#bfe8df;
  background:#e8faf6;
  color:#239b85;
}
.step-arrow:disabled{
  opacity:.35;
  cursor:default;
}

@media (max-width:900px){
  .service-steps-track .service-step-card{
    flex-basis:calc((100% - 18px) / 2);
  }
}

@media (max-width:620px){
  .service-steps{
    padding-left:18px;
    padding-right:18px;
  }
  .service-steps-slider{
    max-width:none;
  }
  .service-steps-viewport{
    overflow:visible;
    clip-path:inset(-40px 0 -40px 0);
  }
  .service-steps-track{
    gap:12px;
  }
  .service-steps-track .service-step-card{
    flex:0 0 84%;
    max-width:290px;
    min-height:210px;
    transform:none !important;
  }
  .service-steps-controls{
    margin-top:4px;
  }
}


/* ==========================================================
   STEP CARD IMAGE AREA - DESIGN PRESERVED
   Only adds an image slot inside the existing cards.
   ========================================================== */
.service-step-media{
  position:relative;
  height:118px;
  margin:14px 0 18px;
  overflow:hidden;
  border:1px solid #ececec;
  border-radius:18px;
  background:#f7faf9;
}
.service-step-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.service-step-media-badge{
  position:absolute;
  left:10px;
  bottom:10px;
  min-height:24px;
  padding:0 9px;
  display:flex;
  align-items:center;
  border-radius:999px;
  background:rgba(255,255,255,.86);
  color:#6f7774;
  font-size:7.5px;
  font-weight:800;
  letter-spacing:.35px;
  backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.75);
}
@media (max-width:620px){
  .service-step-media{
    height:132px;
    border-radius:16px;
  }
}


/* ==========================================================
   BRANDS HEADING — HELVETICA STYLE
   Only this section heading is changed.
   ========================================================== */
.brands-head h2{
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight:700;
  letter-spacing:-0.055em;
  line-height:.96;
}
.brands-head .section-kicker{
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight:700;
  letter-spacing:.13em;
}


/* ==========================================================
   GLOBAL LARGE HEADINGS — HELVETICA STYLE
   Applies only to large display titles/headings.
   ========================================================== */
.hero h1,
.slider-copy h1,
.about-copy h2,
.projects h2,
.brands-head h2,
.application-heading h2,
.cta h2,
.section-head h2,
.service-landing-hero h1,
.service-manage-head h2,
.service-content-panel h2,
.service-detail-copy h1,
.service-menu-title h1,
.project-entry-image-note strong,
.media-label strong,
.nike-card-title strong,
.nike-object span,
.service-menu-visual-copy strong{
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight:700;
  letter-spacing:-0.055em;
}

/* Preserve each section's existing size while giving a Helvetica-like compact line-height. */
.hero h1,
.slider-copy h1,
.service-landing-hero h1,
.service-detail-copy h1{
  line-height:.94;
}

.about-copy h2,
.projects h2,
.brands-head h2,
.application-heading h2,
.cta h2,
.section-head h2,
.service-manage-head h2,
.service-content-panel h2{
  line-height:.98;
}


/* ==========================================================
   SOFT NAV PILL BUTTONS
   Inspired by the supplied rounded list-button reference.
   ========================================================== */
@media (min-width:981px){
  .nav-wrap{
    gap:18px;
  }

  .main-nav{
    gap:8px;
    margin-left:auto;
  }

  .main-nav .nav-pill{
    position:relative;
    min-width:94px;
    min-height:52px;
    padding:8px 8px 8px 13px;
    display:grid;
    grid-template-columns:1fr 34px;
    align-items:center;
    gap:8px;
    border:1px solid rgba(40,40,40,.055);
    border-radius:18px;
    background:
      linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,247,249,.96));
    box-shadow:
      0 9px 22px rgba(44,48,62,.07),
      inset 0 1px 0 rgba(255,255,255,.9);
    color:#1f2329;
    opacity:1;
    overflow:hidden;
    transition:
      transform .24s ease,
      box-shadow .24s ease,
      border-color .24s ease,
      background .24s ease;
  }

  .main-nav .nav-pill::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(100deg,transparent 0 58%,rgba(255,107,44,.07) 100%);
    opacity:0;
    transition:opacity .24s ease;
  }

  .main-nav .nav-pill::after{
    display:none;
  }

  .nav-pill-copy{
    position:relative;
    z-index:2;
    min-width:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:2px;
  }

  .nav-pill-copy strong{
    display:block;
    color:#1c1f25;
    font-size:11.5px;
    line-height:1.08;
    font-weight:800;
    white-space:nowrap;
    letter-spacing:-.18px;
  }

  .nav-pill-copy small{
    display:block;
    color:#9a9ea7;
    font-size:7.5px;
    line-height:1;
    font-weight:600;
    white-space:nowrap;
  }

  .nav-pill-icon{
    position:relative;
    z-index:2;
    width:32px;
    height:32px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:
      conic-gradient(var(--yellow) 0 70deg,#e9eaf0 70deg 360deg);
    color:#2a2c31;
    font-size:12px;
    font-weight:900;
    transition:
      transform .38s cubic-bezier(.2,.8,.2,1),
      background .25s ease,
      color .25s ease;
  }

  .nav-pill-icon::before{
    content:"";
    position:absolute;
    inset:3px;
    border-radius:50%;
    background:#fff;
    z-index:-1;
  }

  .main-nav .nav-pill:hover{
    transform:translateY(-4px) scale(1.015);
    border-color:rgba(255,107,44,.20);
    box-shadow:
      0 15px 30px rgba(44,48,62,.12),
      0 8px 20px rgba(255,107,44,.07);
  }

  .main-nav .nav-pill:hover::before{
    opacity:1;
  }

  .main-nav .nav-pill:hover .nav-pill-icon{
    transform:rotate(360deg) scale(1.08);
    background:conic-gradient(var(--yellow) 0 270deg,#ececf1 270deg 360deg);
    color:var(--yellow);
  }

  .main-nav .nav-pill:active{
    transform:translateY(-1px) scale(.99);
  }

  .header-contact{
    padding-left:14px;
  }

  .header-contact strong{
    font-size:11.5px;
  }

  .header-contact small{
    font-size:8px;
  }
}

/* Keep mobile drawer readable if it is ever used above the app header breakpoint */
@media (max-width:980px){
  .main-nav .nav-pill{
    min-height:54px;
    padding:9px 10px 9px 12px;
    display:grid;
    grid-template-columns:1fr 36px;
    align-items:center;
    gap:10px;
    border-radius:14px;
  }

  .nav-pill-copy{
    display:flex;
    flex-direction:column;
    gap:3px;
  }

  .nav-pill-copy strong{
    color:#202226;
    font-size:12px;
    font-weight:800;
  }

  .nav-pill-copy small{
    color:#9a9da4;
    font-size:8px;
  }

  .nav-pill-icon{
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#fff1ea;
    color:var(--yellow);
    font-size:12px;
  }
}


/* ==========================================================
   MODERN COMPACT HEADER — 3 LANGUAGE
   Screenshot-inspired: brand left, floating nav center,
   language switch + theme button right.
   ========================================================== */
.modern-site-header{
  position:sticky;
  top:0;
  z-index:1700;
  padding:8px 0;
  background:rgba(246,247,251,.94);
  border-bottom:1px solid #e8e9ee;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.modern-header-inner{
  width:min(1760px,calc(100% - 34px));
  min-height:54px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(190px,1fr) auto minmax(190px,1fr);
  align-items:center;
  gap:22px;
}
.modern-brand{
  justify-self:start;
  display:flex;
  align-items:center;
  gap:9px;
  color:#172033;
}
.modern-brand-logo{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border:1px solid #e1e4ec;
  border-radius:12px;
  background:#fff;
  color:#ff6b2c;
  font-size:11px;
  font-weight:900;
  box-shadow:0 5px 14px rgba(35,42,60,.08);
}
.modern-brand-name{
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:17px;
  font-weight:700;
  letter-spacing:-.55px;
  white-space:nowrap;
}
.modern-brand-name b{
  color:#ff6b2c;
  font-weight:800;
}
.modern-nav{
  justify-self:center;
  min-height:43px;
  padding:5px 6px;
  display:flex;
  align-items:center;
  gap:2px;
  border:1px solid #e1e4eb;
  border-radius:15px;
  background:rgba(255,255,255,.96);
  box-shadow:0 7px 20px rgba(38,43,57,.08);
}
.modern-nav a{
  position:relative;
  min-height:33px;
  padding:0 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border-radius:10px;
  color:#687083;
  font-size:11px;
  line-height:1;
  font-weight:700;
  white-space:nowrap;
  transition:
    color .2s ease,
    background .2s ease,
    transform .2s ease,
    box-shadow .2s ease;
}
.modern-nav-icon{
  font-size:11px;
  transition:transform .26s cubic-bezier(.2,.8,.2,1);
}
.modern-nav a:not(.modern-order-btn):hover{
  color:#1d2535;
  background:#f5f6f9;
  transform:translateY(-2px);
}
.modern-nav a:not(.modern-order-btn):hover .modern-nav-icon{
  transform:scale(1.28) rotate(-8deg);
}
.modern-nav .modern-order-btn{
  margin-left:4px;
  padding:0 14px;
  background:linear-gradient(135deg,#ff8249,#ff6428);
  color:#fff;
  box-shadow:0 5px 14px rgba(255,107,44,.24);
}
.modern-nav .modern-order-btn:hover{
  color:#fff;
  transform:translateY(-2px) scale(1.025);
  box-shadow:0 9px 20px rgba(255,107,44,.30);
}
.modern-nav .modern-order-btn span:first-child{
  transition:transform .26s ease;
}
.modern-nav .modern-order-btn:hover span:first-child{
  transform:rotate(18deg) scale(1.18);
}

.modern-header-actions{
  justify-self:end;
  display:flex;
  align-items:center;
  gap:7px;
}
.lang-switch{
  min-height:30px;
  padding:3px;
  display:flex;
  align-items:center;
  gap:1px;
  border:1px solid #e2e4ea;
  border-radius:9px;
  background:#fff;
  box-shadow:0 4px 12px rgba(35,42,60,.045);
}
.lang-switch button{
  min-width:31px;
  height:24px;
  padding:0 7px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:#9aa0ad;
  font:inherit;
  font-size:9px;
  font-weight:800;
  cursor:pointer;
  transition:.18s ease;
}
.lang-switch button:hover{
  color:#333b4c;
  background:#f4f5f8;
}
.lang-switch button.active{
  background:#ff6b2c;
  color:#fff;
  box-shadow:0 3px 9px rgba(255,107,44,.22);
}
.theme-toggle{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:1px solid #e2e4ea;
  border-radius:10px;
  background:#fff;
  color:#d69a41;
  font-size:15px;
  cursor:pointer;
  box-shadow:0 4px 12px rgba(35,42,60,.055);
  transition:transform .2s ease,background .2s ease,color .2s ease;
}
.theme-toggle:hover{
  transform:translateY(-2px) rotate(-8deg);
  background:#fff7ed;
  color:#ff6b2c;
}

/* The old desktop header is no longer used on index. */
@media (min-width:981px){
  .mobile-app-header{display:none !important;}
}

/* compact language controls on service detail SaaS pages */
.service-landing-nav{
  gap:14px;
}
.service-lang-actions{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:6px;
}
.service-landing-links + .service-lang-actions{
  margin-left:auto;
}
.service-lang-actions + .service-landing-cta{
  margin-left:0;
}

/* Mobile keeps the app-like header */
.mobile-lang-switch{
  margin-left:auto;
  transform:scale(.88);
  transform-origin:right center;
}
@media (max-width:980px){
  .modern-site-header{display:none;}
  .mobile-app-header{display:flex;}
}
@media (max-width:620px){
  .mobile-lang-switch button{
    min-width:25px;
    padding:0 5px;
    font-size:8px;
  }
}

/* Optional dark appearance button */
body.theme-dark{
  background:#111318;
  color:#f1f2f5;
}
body.theme-dark .modern-site-header{
  background:rgba(22,24,30,.95);
  border-bottom-color:#2b2e36;
}
body.theme-dark .modern-brand-name{color:#f3f4f6}
body.theme-dark .modern-brand-logo,
body.theme-dark .modern-nav,
body.theme-dark .lang-switch,
body.theme-dark .theme-toggle{
  background:#1d2027;
  border-color:#30343e;
}
body.theme-dark .modern-nav a{color:#aeb4c1}
body.theme-dark .modern-nav a:not(.modern-order-btn):hover{
  color:#fff;
  background:#292d36;
}
body.theme-dark .lang-switch button:hover{
  color:#fff;
  background:#292d36;
}
body.theme-dark .theme-toggle{
  color:#ffd089;
}


/* ==========================================================
   NAV SIZE + PHONE UPDATE
   ========================================================== */
@media (min-width:981px){
  .modern-header-inner{
    grid-template-columns:minmax(210px,1fr) auto minmax(360px,1fr);
    gap:24px;
  }

  .modern-nav{
    min-height:50px;
    padding:6px 8px;
    gap:4px;
    border-radius:17px;
  }

  .modern-nav a{
    min-height:38px;
    padding:0 16px;
    gap:7px;
    border-radius:11px;
    font-size:12.5px;
  }

  .modern-nav-icon{
    font-size:12.5px;
  }

  .modern-nav .modern-order-btn{
    padding:0 18px;
  }

  .modern-header-actions{
    gap:8px;
  }

  .modern-phone-box{
    min-height:38px;
    padding:4px 11px 4px 6px;
    display:flex;
    align-items:center;
    gap:8px;
    border:1px solid #e2e4ea;
    border-radius:11px;
    background:#fff;
    color:#273044;
    box-shadow:0 4px 12px rgba(35,42,60,.055);
    transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
  }

  .modern-phone-box:hover{
    transform:translateY(-2px);
    border-color:#ffc8ad;
    box-shadow:0 8px 18px rgba(255,107,44,.12);
  }

  .modern-phone-icon{
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    border-radius:9px;
    background:#fff1ea;
    color:#ff6b2c;
    font-size:13px;
  }

  .modern-phone-copy{
    display:flex;
    flex-direction:column;
    gap:2px;
    line-height:1;
  }

  .modern-phone-copy small{
    color:#9ba1ad;
    font-size:7.5px;
    font-weight:700;
  }

  .modern-phone-copy strong{
    color:#252d3e;
    font-size:10.5px;
    font-weight:800;
    white-space:nowrap;
  }
}

@media (min-width:981px) and (max-width:1240px){
  .modern-header-inner{
    width:min(1180px,calc(100% - 24px));
    grid-template-columns:minmax(150px,.8fr) auto minmax(300px,.9fr);
    gap:14px;
  }

  .modern-brand-name{
    font-size:15px;
  }

  .modern-nav a{
    padding:0 11px;
    font-size:11px;
  }

  .modern-phone-copy strong{
    font-size:9.5px;
  }
}


/* ==========================================================
   ABOUT IMAGE SLIDER
   Main image + next-image preview + arrows + dots.
   ========================================================== */
.about-slider{
  position:relative;
  min-height:520px;
}
.about-main-frame{
  position:absolute;
  right:0;
  top:0;
  width:78%;
  height:465px;
  overflow:hidden;
  border:1px solid #e8e3dc;
  border-radius:20px;
  background:#f4f1eb;
}
.about-main-track{
  position:relative;
  width:100%;
  height:100%;
}
.about-slide{
  position:absolute;
  inset:0;
  margin:0;
  opacity:0;
  transform:scale(1.035);
  transition:opacity .55s ease,transform .75s cubic-bezier(.22,.61,.36,1);
  pointer-events:none;
}
.about-slide.active{
  opacity:1;
  transform:scale(1);
  pointer-events:auto;
}
.about-slide img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.about-thumb-frame{
  position:absolute;
  left:0;
  bottom:20px;
  z-index:4;
  width:42%;
  height:225px;
  padding:0;
  overflow:hidden;
  border:8px solid #fff;
  border-radius:20px;
  background:#f4f1eb;
  box-shadow:0 14px 34px rgba(24,24,24,.08);
  cursor:pointer;
}
.about-thumb-frame img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transition:transform .35s ease;
}
.about-thumb-frame:hover img{
  transform:scale(1.04);
}
.about-thumb-frame > span{
  position:absolute;
  left:12px;
  bottom:12px;
  min-height:27px;
  padding:0 10px;
  display:flex;
  align-items:center;
  border-radius:999px;
  background:rgba(255,255,255,.88);
  color:#666;
  font-size:8px;
  font-weight:800;
  backdrop-filter:blur(8px);
}
.about-slider-arrows{
  position:absolute;
  right:14px;
  bottom:14px;
  z-index:5;
  display:flex;
  gap:7px;
}
.about-arrow{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border:1px solid rgba(32,32,32,.10);
  border-radius:50%;
  background:rgba(255,255,255,.90);
  color:#252525;
  cursor:pointer;
  font-size:15px;
  box-shadow:0 6px 18px rgba(24,24,24,.07);
  backdrop-filter:blur(8px);
  transition:transform .2s ease,background .2s ease,color .2s ease;
}
.about-arrow:hover{
  transform:translateY(-2px);
  background:var(--yellow);
  color:#fff;
}
.about-slider-count{
  position:absolute;
  left:16px;
  top:16px;
  z-index:5;
  min-height:32px;
  padding:0 10px;
  display:flex;
  align-items:center;
  gap:7px;
  border-radius:999px;
  background:rgba(255,255,255,.88);
  color:#5f5f5f;
  font-size:8px;
  font-weight:800;
  backdrop-filter:blur(8px);
}
.about-count-line{
  width:22px;
  height:1px;
  background:#b7b7b7;
}
.about-slider-dots{
  position:absolute;
  left:47px;
  bottom:4px;
  z-index:6;
  display:flex;
  gap:7px;
}
.about-dot{
  width:8px;
  height:8px;
  padding:0;
  border:0;
  border-radius:50%;
  background:#d9d7d2;
  cursor:pointer;
  transition:.22s ease;
}
.about-dot.active{
  width:24px;
  border-radius:999px;
  background:var(--yellow);
}
.about-slider .experience{
  z-index:7;
}
@media (max-width:640px){
  .about-slider{
    min-height:410px;
  }
  .about-main-frame{
    width:86%;
    height:360px;
  }
  .about-thumb-frame{
    width:46%;
    height:170px;
    border-width:6px;
  }
  .about-slider-dots{
    left:36px;
    bottom:6px;
  }
  .about-arrow{
    width:36px;
    height:36px;
  }
}


/* ==========================================================
   FEATURED SERVICE / NEWS STYLE SLIDER
   Large slide left + compact clickable cards right.
   ========================================================== */
.about-feature-layout{
  min-height:500px;
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr);
  gap:18px;
  align-items:stretch;
}
.feature-main{
  min-width:0;
}
.feature-main-stage{
  position:relative;
  height:100%;
  min-height:500px;
  overflow:hidden;
  border:1px solid #e7e3dc;
  border-radius:22px;
  background:#f1eee8;
  box-shadow:0 16px 38px rgba(24,24,24,.055);
}
.feature-slide{
  position:absolute;
  inset:0;
  margin:0;
  opacity:0;
  transform:translateX(24px) scale(1.01);
  transition:opacity .45s ease,transform .55s cubic-bezier(.22,.61,.36,1);
  pointer-events:none;
}
.feature-slide.active{
  opacity:1;
  transform:translateX(0) scale(1);
  pointer-events:auto;
}
.feature-slide img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.feature-slide::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 40%,rgba(10,10,10,.62) 100%);
}
.feature-slide-copy{
  position:absolute;
  left:24px;
  right:24px;
  bottom:24px;
  z-index:2;
  color:#fff;
}
.feature-slide-copy small{
  display:block;
  margin-bottom:8px;
  color:#ffd1bc;
  font-size:9px;
  font-weight:800;
  letter-spacing:1px;
}
.feature-slide-copy h3{
  margin:0 0 8px;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:28px;
  line-height:1.02;
  letter-spacing:-1.5px;
}
.feature-slide-copy p{
  max-width:520px;
  margin:0;
  color:rgba(255,255,255,.84);
  font-size:11px;
  line-height:1.55;
}
.feature-main-controls{
  position:absolute;
  right:16px;
  top:16px;
  z-index:5;
  display:flex;
  align-items:center;
  gap:8px;
}
.feature-arrow{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.46);
  border-radius:50%;
  background:rgba(255,255,255,.86);
  color:#222;
  font-size:13px;
  cursor:pointer;
  backdrop-filter:blur(8px);
  transition:.2s ease;
}
.feature-arrow:hover{
  background:var(--yellow);
  border-color:var(--yellow);
  color:#fff;
  transform:translateY(-2px);
}
.feature-dots{
  display:flex;
  gap:5px;
  align-items:center;
}
.feature-dot{
  width:7px;
  height:7px;
  padding:0;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.72);
  cursor:pointer;
  transition:.2s ease;
}
.feature-dot.active{
  width:20px;
  border-radius:999px;
  background:var(--yellow);
}
.feature-side-list{
  display:grid;
  grid-template-rows:repeat(4,1fr);
  gap:10px;
}
.feature-side-card{
  width:100%;
  min-height:0;
  padding:8px;
  display:grid;
  grid-template-columns:86px minmax(0,1fr);
  gap:11px;
  align-items:center;
  border:1px solid #e7e3dc;
  border-radius:16px;
  background:#fff;
  text-align:left;
  cursor:pointer;
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.feature-side-card:hover,
.feature-side-card.active{
  transform:translateY(-2px);
  border-color:#ffcdb7;
  box-shadow:0 10px 22px rgba(255,107,44,.08);
}
.feature-side-card img{
  width:86px;
  height:72px;
  display:block;
  object-fit:cover;
  border-radius:11px;
  background:#f1eee8;
}
.feature-side-card span{
  min-width:0;
  display:flex;
  flex-direction:column;
}
.feature-side-card small{
  color:#a0a0a0;
  font-size:7.5px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.45px;
}
.feature-side-card strong{
  margin-top:4px;
  color:#242424;
  font-size:11px;
  line-height:1.3;
  font-weight:800;
}
.feature-side-card em{
  margin-top:6px;
  color:var(--yellow);
  font-size:8px;
  font-style:normal;
  font-weight:800;
}
@media (max-width:900px){
  .about-feature-layout{
    grid-template-columns:1fr;
  }
  .feature-main-stage{
    min-height:420px;
  }
  .feature-side-list{
    grid-template-columns:repeat(2,1fr);
    grid-template-rows:none;
  }
}
@media (max-width:560px){
  .feature-main-stage{
    min-height:360px;
    border-radius:20px;
  }
  .feature-slide-copy{
    left:18px;
    right:18px;
    bottom:18px;
  }
  .feature-slide-copy h3{
    font-size:23px;
  }
  .feature-side-list{
    display:flex;
    overflow-x:auto;
    gap:10px;
    padding-bottom:6px;
    scrollbar-width:none;
  }
  .feature-side-list::-webkit-scrollbar{display:none}
  .feature-side-card{
    flex:0 0 78%;
    grid-template-columns:78px 1fr;
  }
  .feature-side-card img{
    width:78px;
    height:68px;
  }
}


/* ==========================================================
   FOOTER SOCIAL PROFILE CARD
   ========================================================== */
.cta-inner{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) auto 245px;
  align-items:center;
  gap:34px;
}

.footer-social-card{
  position:relative;
  min-height:250px;
  padding:24px 18px 18px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.10);
  border-radius:26px;
  background:
    radial-gradient(circle at 50% 0%,rgba(255,107,44,.15),transparent 42%),
    rgba(255,255,255,.035);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 18px 40px rgba(0,0,0,.12);
  backdrop-filter:blur(8px);
  overflow:hidden;
}
.footer-social-card::after{
  content:"";
  position:absolute;
  width:190px;
  height:190px;
  right:-105px;
  bottom:-115px;
  border:1px solid rgba(255,255,255,.045);
  border-radius:50%;
  box-shadow:
    0 0 0 36px rgba(255,255,255,.015),
    0 0 0 72px rgba(255,255,255,.01);
  pointer-events:none;
}

.social-avatar-wrap{
  position:relative;
  width:88px;
  height:88px;
  padding:5px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#fff;
  box-shadow:
    0 0 0 3px var(--yellow),
    0 10px 24px rgba(0,0,0,.18);
}
.social-avatar{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:
    radial-gradient(circle at 32% 26%,rgba(255,255,255,.20),transparent 28%),
    linear-gradient(145deg,#ff8f52,#ff6128);
  color:#fff;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:25px;
  font-weight:800;
  letter-spacing:-1.4px;
}
.social-online-dot{
  position:absolute;
  right:2px;
  bottom:8px;
  width:14px;
  height:14px;
  border:3px solid #fff;
  border-radius:50%;
  background:#45c98d;
}

.social-profile-copy{
  position:relative;
  z-index:2;
  margin-top:15px;
  text-align:center;
}
.social-handle-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
}
.social-handle-row strong{
  color:#fff;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:14px;
  font-weight:700;
  letter-spacing:-.35px;
}
.social-verified{
  width:16px;
  height:16px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--yellow);
  color:#fff;
  font-size:9px;
  font-weight:900;
}
.social-profile-copy p{
  margin:6px 0 3px;
  color:#c8c8c8;
  font-size:9px;
  font-weight:700;
}
.social-profile-copy small{
  color:#8f8f8f;
  font-size:8px;
}

.social-links{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:center;
  gap:8px;
  margin-top:16px;
}
.social-link{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.20);
  border-radius:50%;
  background:rgba(255,255,255,.065);
  color:#fff;
  font-size:13px;
  font-weight:900;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  transition:
    transform .24s cubic-bezier(.2,.8,.2,1),
    background .24s ease,
    border-color .24s ease,
    color .24s ease;
}
.social-link:hover{
  transform:translateY(-4px) scale(1.08);
  border-color:var(--yellow);
  background:var(--yellow);
  color:#fff;
}
.social-link span{
  transition:transform .25s ease;
}
.social-link:hover span{
  transform:rotate(-8deg) scale(1.06);
}

@media (max-width:1180px){
  .cta-inner{
    grid-template-columns:1fr auto;
  }
  .footer-social-card{
    grid-column:1 / -1;
    width:min(100%,520px);
    min-height:auto;
    justify-self:center;
    flex-direction:row;
    gap:18px;
    padding:18px 20px;
  }
  .social-profile-copy{
    margin-top:0;
    text-align:left;
  }
  .social-handle-row{
    justify-content:flex-start;
  }
  .social-links{
    margin-top:0;
    margin-left:auto;
    flex-wrap:wrap;
    max-width:118px;
  }
}

@media (max-width:700px){
  .cta-inner{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
  }
  .footer-social-card{
    width:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:0;
    border-radius:22px;
    text-align:center;
  }
  .social-profile-copy{
    margin-top:14px;
    text-align:center;
  }
  .social-handle-row{
    justify-content:center;
  }
  .social-links{
    max-width:none;
    margin:15px 0 0;
  }
}


/* ==========================================================
   WORK PROCESS + PROGRESS TIMELINE
   ========================================================== */
.work-process{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 0%,rgba(255,107,44,.06),transparent 28%),
    #fff;
  border-top:1px solid #f0ede7;
  border-bottom:1px solid #f0ede7;
}
.process-heading{
  max-width:760px;
  margin:0 auto 60px;
  text-align:center;
}
.process-heading h2{
  margin:0;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  color:#1c1c1c;
  font-size:clamp(38px,5vw,62px);
  line-height:.96;
  letter-spacing:-.055em;
  font-weight:700;
}
.process-heading h2 span{
  color:var(--yellow);
}
.process-heading p{
  max-width:650px;
  margin:17px auto 0;
  color:#818181;
  font-size:13px;
  line-height:1.7;
}

.process-progress-shell{
  position:relative;
  max-width:1120px;
  margin:0 auto;
  padding:115px 0 100px;
}
.process-progress-bar{
  position:absolute;
  left:5%;
  right:5%;
  top:50%;
  height:2px;
  transform:translateY(-50%);
  background:#ddd9d2;
  overflow:visible;
}
.process-progress-fill{
  display:block;
  width:0;
  height:100%;
  background:linear-gradient(90deg,#ff9a66,#ff6b2c);
  box-shadow:0 0 18px rgba(255,107,44,.24);
  transition:width .72s cubic-bezier(.22,.61,.36,1);
}
.process-progress-shell.in-view .process-progress-fill{
  width:100%;
}

.process-steps{
  position:relative;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  align-items:center;
}
.process-step{
  position:relative;
  min-height:230px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.process-node{
  position:absolute;
  left:50%;
  top:50%;
  z-index:3;
  width:70px;
  height:70px;
  transform:translate(-50%,-50%) scale(.84);
  display:grid;
  place-items:center;
  border:6px solid #fff;
  border-radius:50%;
  background:#171717;
  color:#fff;
  box-shadow:0 0 0 1px #dedad3,0 10px 25px rgba(24,24,24,.10);
  opacity:.55;
  transition:
    transform .42s cubic-bezier(.2,.8,.2,1),
    background .28s ease,
    box-shadow .28s ease,
    opacity .28s ease;
}
.process-number{
  position:absolute;
  top:-28px;
  left:50%;
  transform:translateX(-50%);
  color:#8d8d8d;
  font-size:11px;
  font-weight:800;
}
.process-icon{
  font-size:24px;
  line-height:1;
}
.process-copy{
  position:absolute;
  left:50%;
  width:180px;
  transform:translateX(-50%);
  text-align:center;
  opacity:.45;
  transition:opacity .35s ease,transform .35s ease;
}
.process-step.top .process-copy{
  bottom:145px;
}
.process-step.bottom .process-copy{
  top:145px;
}
.process-copy h3{
  margin:0 0 7px;
  color:#222;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:17px;
  line-height:1.15;
  font-weight:700;
  letter-spacing:-.45px;
}
.process-copy p{
  margin:0;
  color:#858585;
  font-size:10px;
  line-height:1.55;
}

.process-progress-shell.in-view .process-step{
  --delay:0s;
}
.process-progress-shell.in-view .process-step:nth-child(1){--delay:.03s}
.process-progress-shell.in-view .process-step:nth-child(2){--delay:.13s}
.process-progress-shell.in-view .process-step:nth-child(3){--delay:.23s}
.process-progress-shell.in-view .process-step:nth-child(4){--delay:.33s}
.process-progress-shell.in-view .process-step:nth-child(5){--delay:.43s}

.process-progress-shell.in-view .process-node{
  animation:processNodeIn .28s cubic-bezier(.2,.8,.2,1) forwards;
  animation-delay:var(--delay);
}
.process-progress-shell.in-view .process-copy{
  animation:processCopyIn .24s ease forwards;
  animation-delay:calc(var(--delay) + .03s);
}
@keyframes processNodeIn{
  from{transform:translate(-50%,-50%) scale(.84);opacity:.55;background:#171717}
  to{transform:translate(-50%,-50%) scale(1);opacity:1;background:#ff6b2c;box-shadow:0 0 0 1px #ffcbb3,0 12px 30px rgba(255,107,44,.18)}
}
@keyframes processCopyIn{
  from{opacity:.45}
  to{opacity:1}
}

.process-status{
  margin:34px auto 0;
  max-width:420px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:14px;
  color:#a0a0a0;
  font-size:9px;
  font-weight:700;
}
.process-status strong{
  position:relative;
  text-align:center;
  color:#626262;
  font-size:9px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.process-status strong::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-7px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,#ff9a66,#ff6b2c);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .72s .04s cubic-bezier(.22,.61,.36,1);
}
.process-progress-shell.in-view .process-status strong::before{
  transform:scaleX(1);
}

@media (max-width:900px){
  .process-progress-shell{
    max-width:620px;
    padding:10px 0 0;
  }
  .process-progress-bar{
    left:35px;
    top:0;
    bottom:0;
    right:auto;
    width:2px;
    height:auto;
    transform:none;
  }
  .process-progress-fill{
    width:100%;
    height:0;
    transition:height .72s cubic-bezier(.22,.61,.36,1);
  }
  .process-progress-shell.in-view .process-progress-fill{
    width:100%;
    height:100%;
  }
  .process-steps{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }
  .process-step{
    min-height:118px;
    justify-content:flex-start;
    padding-left:86px;
  }
  .process-node{
    left:35px;
    top:50%;
  }
  .process-copy,
  .process-step.top .process-copy,
  .process-step.bottom .process-copy{
    position:static;
    width:auto;
    max-width:420px;
    transform:none;
    text-align:left;
  }
  .process-number{
    top:-23px;
  }
  .process-status{
    margin:20px 0 0 84px;
  }
}
@media (max-width:560px){
  .process-heading{
    margin-bottom:38px;
  }
  .process-heading h2{
    font-size:38px;
  }
  .process-step{
    padding-left:76px;
  }
  .process-node{
    left:30px;
    width:60px;
    height:60px;
  }
  .process-progress-bar{
    left:30px;
  }
  .process-copy h3{
    font-size:15px;
  }
  .process-status{
    margin-left:72px;
  }
}


/* ==========================================================
   NAVBAR ARTIFACT FIX
   Prevent legacy decorative brand shapes from appearing below the header.
   ========================================================== */
@media (min-width:981px){
  .footer .brand,
  .footer .footer-brand{
    position:static !important;
    width:auto !important;
    height:auto !important;
    min-width:0 !important;
    padding:0 !important;
    transform:none !important;
    display:flex !important;
    place-items:initial !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  .footer .brand::before,
  .footer .brand::after,
  .footer .footer-brand::before,
  .footer .footer-brand::after{
    content:none !important;
    display:none !important;
  }

  .footer .brand-text{
    display:flex !important;
  }
}


/* ==========================================================
   WORK PROCESS LOOP RESET
   Instantly resets before each 3-second replay.
   ========================================================== */
.process-progress-shell.process-reset .process-progress-fill,
.process-progress-shell.process-reset .process-status strong::before{
  transition:none !important;
}
.process-progress-shell.process-reset .process-node,
.process-progress-shell.process-reset .process-copy{
  animation:none !important;
  transition:none !important;
}


/* ==========================================================
   WORK PROCESS COMPLETE STATE
   Final step and progress line change color after completion.
   ========================================================== */
.process-progress-shell.process-complete .process-progress-fill,
.process-progress-shell.process-complete .process-status strong::before{
  background:linear-gradient(90deg,#59c69f,#2fa77f);
  box-shadow:0 0 18px rgba(47,167,127,.22);
}

.process-progress-shell.process-complete .process-step:last-child .process-node{
  background:#2fa77f !important;
  box-shadow:
    0 0 0 1px #bfe9d8,
    0 12px 30px rgba(47,167,127,.22) !important;
}

.process-progress-shell.process-complete .process-step:last-child .process-copy h3{
  color:#238765;
}

/* ==========================================================
   RETAIL AZ ANIMATED SITE LOADER
   ========================================================== */
.site-loader{
  position:fixed;
  inset:0;
  z-index:99999;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 50% 45%,rgba(255,107,44,.08),transparent 24%),
    #0f1012;
  opacity:1;
  visibility:visible;
  transition:opacity .55s ease,visibility .55s ease;
}
.site-loader.is-hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.site-loader-inner{
  width:min(310px,78vw);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.site-loader-logo-wrap{
  position:relative;
  width:220px;
  height:180px;
  display:grid;
  place-items:center;
}
.site-loader-logo-wrap img{
  position:relative;
  z-index:3;
  width:190px;
  max-height:145px;
  object-fit:contain;
  filter:drop-shadow(0 12px 26px rgba(0,0,0,.22));
  animation:loaderLogoPulse 1.55s ease-in-out infinite;
}
.site-loader-logo-wrap::after{
  content:"";
  position:absolute;
  z-index:4;
  width:170px;
  height:130px;
  transform:skewX(-18deg) translateX(-160%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);
  mix-blend-mode:screen;
  animation:loaderShine 1.9s ease-in-out infinite;
  pointer-events:none;
}
.site-loader-ring{
  position:absolute;
  left:50%;
  top:50%;
  border-radius:50%;
  border:1px solid rgba(255,107,44,.34);
  transform:translate(-50%,-50%);
}
.site-loader-ring.ring-one{
  width:182px;
  height:182px;
  border-top-color:#ff6b2c;
  border-right-color:transparent;
  animation:loaderSpin 2.2s linear infinite;
}
.site-loader-ring.ring-two{
  width:210px;
  height:210px;
  border-color:rgba(255,255,255,.10);
  border-left-color:#ff9a66;
  animation:loaderSpinReverse 3.2s linear infinite;
}
.site-loader-progress{
  width:190px;
  height:3px;
  margin-top:8px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.10);
}
.site-loader-progress span{
  display:block;
  width:42%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#ff9a66,#ff6b2c);
  animation:loaderProgress 1.15s ease-in-out infinite;
}
.site-loader small{
  margin-top:12px;
  color:rgba(255,255,255,.62);
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:9px;
  font-weight:700;
  letter-spacing:.22em;
}
@keyframes loaderLogoPulse{
  0%,100%{transform:scale(.965);opacity:.88}
  50%{transform:scale(1.025);opacity:1}
}
@keyframes loaderSpin{
  from{transform:translate(-50%,-50%) rotate(0)}
  to{transform:translate(-50%,-50%) rotate(360deg)}
}
@keyframes loaderSpinReverse{
  from{transform:translate(-50%,-50%) rotate(360deg)}
  to{transform:translate(-50%,-50%) rotate(0)}
}
@keyframes loaderShine{
  0%,28%{transform:skewX(-18deg) translateX(-160%);opacity:0}
  45%{opacity:.65}
  70%,100%{transform:skewX(-18deg) translateX(170%);opacity:0}
}
@keyframes loaderProgress{
  0%{transform:translateX(-120%)}
  55%{transform:translateX(80%)}
  100%{transform:translateX(250%)}
}
@media (max-width:600px){
  .site-loader-logo-wrap{width:190px;height:160px}
  .site-loader-logo-wrap img{width:165px;max-height:125px}
  .site-loader-ring.ring-one{width:160px;height:160px}
  .site-loader-ring.ring-two{width:186px;height:186px}
}
@media (prefers-reduced-motion:reduce){
  .site-loader-logo-wrap img,
  .site-loader-logo-wrap::after,
  .site-loader-ring,
  .site-loader-progress span{animation:none !important}
}


/* ==========================================================
   ABOUT FEATURE — 2X WIDER
   The visual/slider column is twice the width of the text column.
   ========================================================== */
@media (min-width:981px){
  .about-grid{
    grid-template-columns:minmax(0,2fr) minmax(300px,1fr);
    gap:48px;
  }

  .about-feature-layout{
    min-width:0;
    grid-template-columns:minmax(0,1.7fr) minmax(250px,.7fr);
  }

  .feature-main-stage{
    min-height:520px;
  }
}

/* ==========================================================
   SITE SEARCH — COMPACT / NON-DESTRUCTIVE
   ========================================================== */
.site-search{
  position:relative;
  width:180px;
  min-width:180px;
  height:38px;
  display:flex;
  align-items:center;
  border:1px solid #e2e4ea;
  border-radius:11px;
  background:#fff;
  box-shadow:0 4px 12px rgba(35,42,60,.05);
  transition:border-color .2s ease,box-shadow .2s ease,width .24s ease;
}
.site-search:focus-within{
  width:230px;
  border-color:#ffc6aa;
  box-shadow:0 7px 18px rgba(255,107,44,.10);
}
.site-search-icon{
  flex:0 0 34px;
  width:34px;
  display:grid;
  place-items:center;
  color:#ff6b2c;
  font-size:15px;
  font-weight:900;
}
.site-search-input{
  min-width:0;
  flex:1;
  height:100%;
  padding:0 4px 0 0;
  border:0;
  outline:0;
  background:transparent;
  color:#273044;
  font:inherit;
  font-size:10.5px;
  font-weight:650;
}
.site-search-input::placeholder{
  color:#9aa1ae;
  opacity:1;
}
.site-search-clear{
  width:28px;
  height:28px;
  margin-right:4px;
  display:none;
  place-items:center;
  border:0;
  border-radius:8px;
  background:#f5f6f8;
  color:#858c99;
  font-size:16px;
  cursor:pointer;
}
.site-search.has-value .site-search-clear{
  display:grid;
}
.site-search-results{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  right:0;
  z-index:1900;
  display:none;
  max-height:320px;
  overflow:auto;
  padding:6px;
  border:1px solid #e4e5e9;
  border-radius:14px;
  background:rgba(255,255,255,.98);
  box-shadow:0 18px 44px rgba(28,35,50,.14);
  backdrop-filter:blur(16px);
}
.site-search.open .site-search-results{
  display:block;
}
.site-search-result{
  width:100%;
  min-height:46px;
  padding:8px 10px;
  display:flex;
  align-items:center;
  gap:9px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#252d3e;
  text-align:left;
  cursor:pointer;
  text-decoration:none;
}
.site-search-result:hover,
.site-search-result.active{
  background:#fff3ed;
}
.site-search-result-icon{
  flex:0 0 30px;
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:#fff1ea;
  color:#ff6b2c;
  font-size:12px;
}
.site-search-result-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}
.site-search-result-copy strong{
  overflow:hidden;
  color:#252d3e;
  font-size:10px;
  font-weight:800;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.site-search-result-copy small{
  overflow:hidden;
  color:#969daa;
  font-size:8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.site-search-empty{
  padding:14px 10px;
  color:#949aa5;
  font-size:9px;
  text-align:center;
}

.mobile-search-strip{
  display:none;
}

/* Header balance when search is present */
@media (min-width:1241px){
  .modern-header-inner{
    grid-template-columns:minmax(200px,.8fr) auto minmax(540px,1.35fr);
  }
  .modern-header-actions{
    min-width:0;
  }
}
@media (min-width:981px) and (max-width:1240px){
  .site-search{
    width:135px;
    min-width:135px;
  }
  .site-search:focus-within{
    width:180px;
  }
  .modern-phone-copy{
    display:none;
  }
  .modern-phone-box{
    padding-right:6px;
  }
}

/* Mobile search sits below the app header, without changing its layout. */
@media (max-width:980px){
  body{
    padding-top:calc(var(--mobile-header-h) + 54px);
  }

  .mobile-search-strip{
    position:fixed;
    top:var(--mobile-header-h);
    left:0;
    right:0;
    z-index:1350;
    display:block;
    padding:7px 12px 8px;
    background:rgba(245,243,238,.94);
    border-bottom:1px solid rgba(31,31,31,.06);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
  }

  .mobile-search-strip .site-search{
    width:100%;
    min-width:0;
    height:39px;
    border-radius:13px;
  }

  .mobile-search-strip .site-search:focus-within{
    width:100%;
  }

  .mobile-search-strip .site-search-input{
    font-size:16px;
  }

  .mobile-search-strip .site-search-results{
    max-height:290px;
  }
}

body.theme-dark .site-search,
body.theme-dark .site-search-results{
  background:#1d2027;
  border-color:#30343e;
}
body.theme-dark .site-search-input,
body.theme-dark .site-search-result-copy strong{
  color:#f0f2f6;
}
body.theme-dark .site-search-result:hover,
body.theme-dark .site-search-result.active{
  background:#2a2d35;
}
body.theme-dark .site-search-clear{
  background:#292d35;
  color:#bec4cf;
}


/* ==========================================================
   ENGINEERING / TECHNICAL SYSTEMS CARD + PAGE
   ========================================================== */
.nike-engineering .nike-object{
  background:linear-gradient(135deg,#2f7f79,#5eb8ae 48%,#ff7a32);
}

.engineering-page{
  min-height:100vh;
  padding:30px 0 60px;
  background:#f1f2f5;
}
.engineering-shell{
  width:min(1220px,calc(100% - 34px));
  margin:0 auto;
  overflow:hidden;
  border:1px solid #e4e5e8;
  border-radius:28px;
  background:#fff;
  box-shadow:0 24px 70px rgba(29,35,48,.07);
}
.engineering-nav{
  min-height:66px;
  padding:0 24px;
  display:flex;
  align-items:center;
  gap:26px;
  border-bottom:1px solid #efefef;
}
.engineering-logo{
  color:#161b25;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:14px;
  font-weight:900;
  letter-spacing:-.6px;
}
.engineering-nav-links{
  margin-left:auto;
  display:flex;
  gap:20px;
}
.engineering-nav-links a{
  color:#767d89;
  font-size:10px;
  font-weight:700;
}
.engineering-nav-links a:hover{color:#ff6b2c}
.engineering-lang{margin-left:4px}

.engineering-hero{
  padding:86px 28px 70px;
  text-align:center;
  background:
    radial-gradient(circle at 50% 0%,rgba(87,188,174,.10),transparent 30%),
    #fff;
}
.engineering-badge{
  display:inline-flex;
  min-height:28px;
  padding:0 11px;
  align-items:center;
  border:1px solid #e0efec;
  border-radius:999px;
  background:#f0fbf8;
  color:#319b8c;
  font-size:8.5px;
  font-weight:900;
  letter-spacing:.85px;
}
.engineering-hero h1{
  max-width:900px;
  margin:19px auto 16px;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  color:#171a1f;
  font-size:clamp(48px,6vw,78px);
  line-height:.95;
  letter-spacing:-.055em;
}
.engineering-hero h1 span{color:#ff6b2c}
.engineering-hero p{
  max-width:800px;
  margin:0 auto;
  color:#777f89;
  font-size:13px;
  line-height:1.8;
}
.engineering-actions{
  margin-top:26px;
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}
.engineering-light-btn{
  border:1px solid #dedede;
  background:#fff;
  color:#252525;
}

.engineering-summary{
  padding:64px 34px;
  border-top:1px solid #f0f0f0;
  background:#fbfbfa;
}
.engineering-summary-copy{
  max-width:760px;
  margin:0 auto 30px;
  text-align:center;
}
.engineering-summary-copy h2{
  margin:8px 0 12px;
  color:#1d1d1d;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:42px;
  line-height:.98;
  letter-spacing:-.045em;
}
.engineering-summary-copy h2 span{color:#ff6b2c}
.engineering-summary-copy p{
  margin:0;
  color:#858b93;
  font-size:12px;
  line-height:1.75;
}
.engineering-summary-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
}
.engineering-summary-card{
  min-height:160px;
  padding:18px;
  display:flex;
  flex-direction:column;
  border:1px solid #e8e8e8;
  border-radius:20px;
  background:#fff;
  color:#20242b;
  transition:.22s ease;
}
.engineering-summary-card:hover{
  transform:translateY(-4px);
  border-color:#ffd0bd;
  box-shadow:0 14px 28px rgba(255,107,44,.08);
}
.engineering-summary-card > span{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#eaf8f5;
  color:#319b8c;
  font-size:9px;
  font-weight:900;
}
.engineering-summary-card strong{
  margin-top:26px;
  font-size:13px;
  line-height:1.3;
}
.engineering-summary-card small{
  margin-top:7px;
  color:#949aa2;
  font-size:9px;
  line-height:1.5;
}

.engineering-detail-grid{
  padding:64px 34px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.engineering-detail-card{
  padding:26px;
  border:1px solid #e7e7e7;
  border-radius:24px;
  background:#fff;
  box-shadow:0 12px 32px rgba(28,32,40,.035);
  scroll-margin-top:90px;
}
.engineering-card-head{
  display:grid;
  grid-template-columns:46px 1fr;
  gap:14px;
  align-items:start;
  margin-bottom:20px;
}
.engineering-card-no{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#fff1ea;
  color:#ff6b2c;
  font-size:10px;
  font-weight:900;
}
.engineering-card-head small{
  color:#43a997;
  font-size:8px;
  font-weight:900;
  letter-spacing:.8px;
}
.engineering-card-head h2{
  margin:4px 0 0;
  color:#20242a;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:22px;
  line-height:1.05;
  letter-spacing:-.7px;
}
.engineering-card-intro{
  margin:-4px 0 18px;
  color:#6f7680;
  font-size:11px;
  line-height:1.7;
}
.engineering-detail-card ul{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:10px;
}
.engineering-detail-card li{
  position:relative;
  padding-left:17px;
  color:#59616c;
  font-size:10.5px;
  line-height:1.65;
}
.engineering-detail-card li::before{
  content:"";
  position:absolute;
  left:0;
  top:.63em;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#ff6b2c;
}
.engineering-note{
  margin-top:18px;
  padding:15px 16px;
  border-radius:15px;
  background:#f2faf8;
  border:1px solid #dff0ec;
}
.engineering-note p{
  margin:0;
  color:#60716d;
  font-size:9.5px;
  line-height:1.65;
}
.engineering-note p + p{margin-top:8px}

.engineering-cta{
  margin:0 34px 34px;
  padding:32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border-radius:24px;
  background:
    radial-gradient(circle at 85% 10%,rgba(255,107,44,.18),transparent 28%),
    #17191d;
  color:#fff;
}
.engineering-cta small{
  color:#ff9b6e;
  font-size:8px;
  font-weight:900;
  letter-spacing:1px;
}
.engineering-cta h2{
  margin:7px 0 8px;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:28px;
  letter-spacing:-1.2px;
}
.engineering-cta p{
  margin:0;
  color:#b9bdc4;
  font-size:10px;
}
.engineering-back{
  padding:0 0 34px;
  text-align:center;
}
.engineering-back a{
  color:#8b9098;
  font-size:9px;
  font-weight:700;
}

@media (max-width:900px){
  .engineering-page{padding:0}
  .engineering-shell{
    width:100%;
    border:0;
    border-radius:0;
    box-shadow:none;
  }
  .engineering-nav{
    padding:0 16px;
  }
  .engineering-nav-links{display:none}
  .engineering-lang{margin-left:auto}
  .engineering-hero{
    padding:58px 18px 48px;
  }
  .engineering-hero h1{
    font-size:48px;
    letter-spacing:-3px;
  }
  .engineering-summary{
    padding:48px 18px;
  }
  .engineering-summary-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .engineering-detail-grid{
    padding:48px 18px;
    grid-template-columns:1fr;
  }
  .engineering-cta{
    margin:0 18px 24px;
    padding:26px 20px;
    flex-direction:column;
    align-items:flex-start;
  }
}
@media (max-width:560px){
  .engineering-summary-copy h2{
    font-size:34px;
  }
  .engineering-summary-grid{
    display:flex;
    overflow-x:auto;
    margin-right:-18px;
    padding-right:18px;
    gap:10px;
    scrollbar-width:none;
  }
  .engineering-summary-grid::-webkit-scrollbar{display:none}
  .engineering-summary-card{
    flex:0 0 78%;
    max-width:280px;
  }
  .engineering-detail-card{
    padding:20px 17px;
    border-radius:20px;
  }
}


/* ==========================================================
   HVAC / CLIMATE SYSTEMS CARD + PAGE
   ========================================================== */
.nike-hvac .nike-object{
  background:linear-gradient(135deg,#407f99,#62c7bd 50%,#f1a261);
}
.hvac-hero{
  background:
    radial-gradient(circle at 48% 0%,rgba(67,169,151,.12),transparent 31%),
    radial-gradient(circle at 82% 12%,rgba(84,144,196,.08),transparent 22%),
    #fff;
}
.hvac-summary-grid{
  grid-template-columns:repeat(3,1fr);
  max-width:980px;
  margin:0 auto;
}
.hvac-detail-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:start;
}
.hvac-detail-grid .engineering-detail-card{
  height:100%;
}
.hvac-detail-grid .engineering-detail-card li strong{
  color:#2d353d;
}
.hvac-cta{
  background:
    radial-gradient(circle at 85% 10%,rgba(79,184,169,.18),transparent 28%),
    #17191d;
}
@media (max-width:1080px){
  .hvac-detail-grid{
    grid-template-columns:1fr;
  }
}
@media (max-width:760px){
  .hvac-summary-grid{
    display:flex;
    overflow-x:auto;
    margin-right:-18px;
    padding-right:18px;
    gap:10px;
    scrollbar-width:none;
  }
  .hvac-summary-grid::-webkit-scrollbar{display:none}
  .hvac-summary-grid .engineering-summary-card{
    flex:0 0 80%;
    max-width:290px;
  }
}


/* ==========================================================
   LIFT / ESCALATOR / AUTOMATIC DOOR SERVICE
   ========================================================== */
.nike-lift .nike-object{
  background:linear-gradient(135deg,#545d68,#89929b 48%,#ff7a32);
}
.lift-hero{
  background:
    radial-gradient(circle at 50% 0%,rgba(255,107,44,.09),transparent 30%),
    radial-gradient(circle at 82% 18%,rgba(88,100,112,.07),transparent 24%),
    #fff;
}
.lift-summary-grid{
  grid-template-columns:repeat(4,1fr);
}
.lift-detail-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:start;
}
.lift-detail-grid .engineering-detail-card li strong{
  color:#2c333a;
}
.lift-cta{
  background:
    radial-gradient(circle at 86% 10%,rgba(255,107,44,.19),transparent 28%),
    #17191d;
}
@media (max-width:900px){
  .lift-summary-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .lift-detail-grid{
    grid-template-columns:1fr;
  }
}
@media (max-width:560px){
  .lift-summary-grid{
    display:flex;
    overflow-x:auto;
    margin-right:-18px;
    padding-right:18px;
    gap:10px;
    scrollbar-width:none;
  }
  .lift-summary-grid::-webkit-scrollbar{display:none}
  .lift-summary-grid .engineering-summary-card{
    flex:0 0 80%;
    max-width:290px;
  }
}


/* ==========================================================
   PROCUREMENT / SUPPLY SERVICE + UPDATED MAIN SERVICE VISUALS
   ========================================================== */
.visual-engineering-main{
  background:linear-gradient(135deg,#315e63,#5ab2a9);
}
.visual-hvac-main{
  background:linear-gradient(135deg,#3e718f,#65c5bd);
}
.visual-lift-main{
  background:linear-gradient(135deg,#4e555d,#91989f);
}
.visual-procurement-main{
  background:linear-gradient(135deg,#7b654c,#d59a59);
}

.nike-procurement .nike-object{
  background:linear-gradient(135deg,#6c5844,#b88755 48%,#ff7a32);
}
.procurement-hero{
  background:
    radial-gradient(circle at 50% 0%,rgba(201,151,91,.13),transparent 30%),
    radial-gradient(circle at 85% 20%,rgba(255,107,44,.08),transparent 22%),
    #fff;
}
.procurement-summary-grid{
  grid-template-columns:repeat(3,1fr);
}
.procurement-detail-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:start;
}
.procurement-detail-grid .engineering-detail-card li strong{
  color:#2c333a;
}
.procurement-cta{
  background:
    radial-gradient(circle at 86% 10%,rgba(205,151,83,.20),transparent 28%),
    #17191d;
}
@media (max-width:900px){
  .procurement-summary-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .procurement-detail-grid{
    grid-template-columns:1fr;
  }
}
@media (max-width:560px){
  .procurement-summary-grid{
    display:flex;
    overflow-x:auto;
    margin-right:-18px;
    padding-right:18px;
    gap:10px;
    scrollbar-width:none;
  }
  .procurement-summary-grid::-webkit-scrollbar{display:none}
  .procurement-summary-grid .engineering-summary-card{
    flex:0 0 82%;
    max-width:300px;
  }
}


/* ==========================================================
   HERO SLIDER — TEXT ABOVE, CARDS BELOW
   Prevents long service titles from sitting behind the cards.
   ========================================================== */
@media (min-width:1051px){
  .hero-slider-section{
    padding:42px 0 34px;
  }

  .hero-slider-shell{
    min-height:760px;
    display:block;
    padding:56px 52px 86px;
  }

  .slider-copy{
    position:relative;
    z-index:6;
    width:100%;
    max-width:920px;
    padding:0 160px 38px 0;
  }

  .slider-copy h1{
    max-width:880px;
    font-size:clamp(54px,5.4vw,78px);
    line-height:.94;
    letter-spacing:-3.8px;
  }

  .slider-copy p{
    max-width:700px;
    min-height:auto;
    margin-bottom:22px;
  }

  /* dots move to the upper-right, away from the heading */
  .slider-dots{
    position:absolute;
    z-index:8;
    top:58px;
    right:52px;
    width:auto;
    height:auto;
    display:flex;
    flex-direction:row;
    justify-content:flex-end;
    gap:10px;
  }

  .slider-dots::before{
    display:none;
  }

  .slider-dot{
    width:9px;
    height:9px;
    background:#d7dbdf;
  }

  .slider-dot.active{
    width:28px;
    height:28px;
    background:#ff6b2c;
    box-shadow:0 0 0 5px rgba(255,255,255,.88);
  }

  /* cards now live in their own row below all text */
  .slider-visual-area{
    position:relative;
    z-index:3;
    width:100%;
    padding:0;
    overflow:hidden;
  }

  .slider-track{
    gap:20px;
    align-items:stretch;
  }

  .visual-card{
    flex:0 0 290px;
    height:390px;
    transform:scale(.94);
    opacity:.6;
    box-shadow:0 15px 32px rgba(16,38,58,.12);
  }

  .visual-card.active-card{
    transform:scale(1);
    opacity:1;
    box-shadow:0 22px 42px rgba(16,38,58,.18);
  }

  .visual-placeholder{
    height:290px;
  }

  .visual-card-caption{
    height:100px;
  }

  .slider-progress{
    margin-top:28px;
  }

  .slider-nav{
    right:46px;
    bottom:26px;
  }
}

/* Medium desktop/tablet: title first, slider second as well */
@media (min-width:701px) and (max-width:1050px){
  .hero-slider-shell{
    display:block;
    min-height:auto;
    padding:44px 34px 86px;
  }

  .slider-copy{
    width:100%;
    max-width:760px;
    padding:0 110px 34px 0;
  }

  .slider-copy h1{
    font-size:clamp(48px,7vw,66px);
    line-height:.95;
  }

  .slider-copy p{
    max-width:620px;
    min-height:auto;
  }

  .slider-dots{
    position:absolute;
    top:46px;
    right:34px;
    width:auto;
    height:auto;
    flex-direction:row;
    gap:9px;
    margin:0;
  }

  .slider-dots::before{
    display:none;
  }

  .slider-dot{
    width:9px;
    height:9px;
  }

  .slider-dot.active{
    width:28px;
    height:28px;
    background:#ff6b2c;
  }

  .slider-visual-area{
    width:100%;
    padding:0;
    overflow:hidden;
  }

  .visual-card{
    flex-basis:270px;
    height:380px;
  }

  .visual-placeholder{
    height:285px;
  }

  .slider-nav{
    right:32px;
    bottom:24px;
  }
}

/* Mobile: preserve the app-like layout, but keep cards clearly below the text */
@media (max-width:700px){
  .hero-slider-shell{
    padding-top:30px;
  }

  .slider-copy{
    position:relative;
    z-index:5;
  }

  .slider-copy h1{
    font-size:clamp(42px,13vw,52px);
    line-height:.94;
    overflow-wrap:anywhere;
  }

  .slider-visual-area{
    position:relative;
    z-index:2;
    margin-top:10px;
    padding-top:28px;
  }
}


/* ==========================================================
   SERVICE CARD PHOTO SLIDERS
   3 images per card, arrows + dots + swipe, card link preserved.
   ========================================================== */
.service-photo-slider{
  height:245px;
  margin-top:12px;
  display:block;
  padding:0 2px;
}
.service-photo-stage{
  position:relative;
  width:88%;
  height:214px;
  margin:8px auto 0;
  overflow:hidden;
  border-radius:34px 34px 42px 42px;
  background:#ececeb;
  box-shadow:0 18px 34px rgba(25,25,25,.13);
}
.service-photo-slide{
  position:absolute;
  inset:0;
  margin:0;
  opacity:0;
  transform:scale(1.04);
  transition:opacity .48s ease,transform .65s cubic-bezier(.22,.61,.36,1);
  pointer-events:none;
}
.service-photo-slide.active{
  opacity:1;
  transform:scale(1);
}
.service-photo-slide img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.service-photo-shade{
  position:absolute;
  inset:0;
  z-index:2;
  background:linear-gradient(180deg,rgba(8,14,18,.02) 35%,rgba(8,14,18,.58) 100%);
  pointer-events:none;
}
.service-photo-caption{
  position:absolute;
  z-index:4;
  left:16px;
  right:16px;
  bottom:29px;
  color:#fff;
  text-align:left;
  text-shadow:0 2px 8px rgba(0,0,0,.32);
  pointer-events:none;
}
.service-photo-caption strong{
  display:block;
  font-size:19px;
  line-height:1;
  font-weight:900;
  letter-spacing:-.8px;
}
.service-photo-caption small{
  display:block;
  margin-top:5px;
  color:rgba(255,255,255,.87);
  font-size:7.3px;
  line-height:1.35;
  font-weight:700;
}
.service-photo-arrow{
  position:absolute;
  top:50%;
  z-index:7;
  width:27px;
  height:27px;
  display:grid;
  place-items:center;
  transform:translateY(-50%);
  border:1px solid rgba(255,255,255,.72);
  border-radius:50%;
  background:rgba(255,255,255,.86);
  color:#202020;
  box-shadow:0 4px 12px rgba(0,0,0,.12);
  font-size:18px;
  line-height:1;
  user-select:none;
  cursor:pointer;
  backdrop-filter:blur(6px);
  opacity:.92;
  transition:transform .2s ease,background .2s ease,color .2s ease;
}
.service-photo-arrow.prev{left:8px}
.service-photo-arrow.next{right:8px}
.service-photo-arrow:hover{
  transform:translateY(-50%) scale(1.08);
  background:#ff6b2c;
  color:#fff;
}
.service-photo-dots{
  position:absolute;
  z-index:7;
  left:50%;
  bottom:10px;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:5px;
}
.service-photo-dot{
  width:6px;
  height:6px;
  display:block;
  border-radius:999px;
  background:rgba(255,255,255,.62);
  box-shadow:0 1px 4px rgba(0,0,0,.14);
  cursor:pointer;
  transition:.22s ease;
}
.service-photo-dot.active{
  width:19px;
  background:#fff;
}
.service-photo-slider + .nike-center-badge{
  bottom:-16px;
}

@media (max-width:700px){
  .service-photo-stage{
    width:91%;
    height:220px;
    border-radius:30px 30px 38px 38px;
  }
  .service-photo-caption strong{font-size:18px}
  .service-photo-arrow{
    width:30px;
    height:30px;
  }
}


/* ==========================================================
   SERVICE CARD PHOTO — LARGE CLEAN IMAGE
   No text overlay; larger portrait-style image area.
   ========================================================== */
.service-photo-slider{
  height:282px !important;
  margin-top:14px !important;
  padding:0 !important;
}

.service-photo-stage{
  width:94% !important;
  height:270px !important;
  margin:0 auto !important;
  border-radius:26px !important;
  background:#ececeb;
  box-shadow:0 16px 34px rgba(25,25,25,.12);
}

.service-photo-slide img{
  object-fit:cover !important;
  object-position:center center;
}

.service-photo-shade,
.service-photo-caption{
  display:none !important;
}

.service-photo-arrow{
  width:31px !important;
  height:31px !important;
  background:rgba(255,255,255,.90) !important;
  border:1px solid rgba(255,255,255,.94) !important;
}

.service-photo-arrow.prev{left:9px !important}
.service-photo-arrow.next{right:9px !important}

.service-photo-dots{
  bottom:10px !important;
}

.service-photo-dot{
  width:7px !important;
  height:7px !important;
  background:rgba(255,255,255,.72) !important;
}

.service-photo-dot.active{
  width:22px !important;
  background:#fff !important;
}

/* Give the upper part of each card enough height for the larger photo */
.nike-card-top{
  min-height:455px !important;
}

/* Keep title clearly separated above the image */
.nike-card-title{
  padding-top:48px !important;
  padding-left:10px;
  padding-right:10px;
}

.nike-card-title small{
  margin-bottom:6px !important;
}

.nike-card-title strong{
  font-size:18px !important;
  line-height:1.15 !important;
}

@media (max-width:700px){
  .nike-card-top{
    min-height:430px !important;
  }

  .service-photo-slider{
    height:270px !important;
    margin-top:16px !important;
  }

  .service-photo-stage{
    width:92% !important;
    height:258px !important;
    border-radius:24px !important;
  }

  .service-photo-arrow{
    width:32px !important;
    height:32px !important;
  }
}


/* ==========================================================
   SERVICE CARD PHOTO — REMOVE EMPTY YELLOW-MARKED SPACE
   Image is lifted upward and widened; surrounding empty area minimized.
   ========================================================== */
.nike-card-top{
  min-height:430px !important;
  padding-left:6px !important;
  padding-right:6px !important;
  padding-bottom:0 !important;
  background:#f7faf8 !important;
}

.nike-card-title{
  padding-top:45px !important;
  padding-left:8px !important;
  padding-right:8px !important;
  margin-bottom:0 !important;
}

.service-photo-slider{
  height:320px !important;
  margin-top:3px !important;
  padding:0 !important;
}

.service-photo-stage{
  width:100% !important;
  height:312px !important;
  margin:0 auto !important;
  border-radius:25px !important;
  box-shadow:0 15px 32px rgba(25,25,25,.12) !important;
}

.service-photo-slide img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}

/* Keep the image almost flush with the card sides */
.nike-card-top > .service-photo-slider{
  margin-left:0 !important;
  margin-right:0 !important;
}

.service-photo-dots{
  bottom:9px !important;
}

/* Pull the lower badge closer so no empty strip remains below the photo */
.service-photo-slider + .nike-center-badge{
  bottom:-13px !important;
}

@media (max-width:700px){
  .nike-card-top{
    min-height:414px !important;
    padding-left:4px !important;
    padding-right:4px !important;
  }

  .nike-card-title{
    padding-top:43px !important;
  }

  .service-photo-slider{
    height:309px !important;
    margin-top:2px !important;
  }

  .service-photo-stage{
    width:100% !important;
    height:301px !important;
    border-radius:23px !important;
  }
}


/* ==========================================================
   SERVICE CARD TOP CLEANUP v46
   Remove back / RA / menu row and move the real service title
   into that top position. Lift the image directly underneath.
   ========================================================== */
.nike-back,
.nike-card-brand,
.nike-menu{
  display:none !important;
}

/* Hide the small category word such as MÜHƏNDİSLİK / HVAC */
.nike-card-title small{
  display:none !important;
}

/* Put "Texniki Sistemlər", "İqlim Sistemləri", etc. where RA used to be */
.nike-card-title{
  position:absolute !important;
  top:14px !important;
  left:12px !important;
  right:12px !important;
  z-index:12 !important;
  padding:0 !important;
  margin:0 !important;
  text-align:center !important;
}

.nike-card-title strong{
  display:block !important;
  margin:0 !important;
  color:#171717 !important;
  font-size:17px !important;
  line-height:1.15 !important;
  font-weight:850 !important;
  letter-spacing:-.55px !important;
}

/* Image now starts directly below the title and fills the removed top space */
.nike-card-top{
  min-height:423px !important;
  padding:0 4px !important;
  overflow:visible !important;
}

.service-photo-slider{
  height:368px !important;
  margin-top:0 !important;
  padding-top:48px !important;
}

.service-photo-stage{
  width:100% !important;
  height:320px !important;
  margin:0 auto !important;
  border-radius:24px !important;
}

/* Keep photo content large and edge-to-edge */
.service-photo-slide img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}

/* Badge remains attached to the bottom edge */
.service-photo-slider + .nike-center-badge{
  bottom:-14px !important;
}

@media (max-width:700px){
  .nike-card-title{
    top:13px !important;
    left:10px !important;
    right:10px !important;
  }

  .nike-card-title strong{
    font-size:16px !important;
  }

  .nike-card-top{
    min-height:405px !important;
    padding:0 3px !important;
  }

  .service-photo-slider{
    height:353px !important;
    padding-top:45px !important;
  }

  .service-photo-stage{
    height:308px !important;
    border-radius:22px !important;
  }
}


/* ==========================================================
   SERVICE CARD FINAL CLEAN TOP v47
   Removed completely from all cards:
   back arrow, RA, menu icon, category kicker.
   ========================================================== */
.nike-back,
.nike-card-brand,
.nike-menu,
.nike-card-title small{
  display:none !important;
}

.nike-card-title{
  position:absolute !important;
  top:10px !important;
  left:8px !important;
  right:8px !important;
  z-index:12 !important;
  padding:0 !important;
  margin:0 !important;
  text-align:center !important;
}

.nike-card-title strong{
  margin:0 !important;
  padding:0 !important;
  font-size:17px !important;
  line-height:1.08 !important;
  font-weight:850 !important;
}

/* Photo starts immediately under the one remaining title */
.service-photo-slider{
  padding-top:36px !important;
}

@media (max-width:700px){
  .nike-card-title{
    top:8px !important;
  }
  .nike-card-title strong{
    font-size:16px !important;
  }
  .service-photo-slider{
    padding-top:33px !important;
  }
}


/* ==========================================================
   SERVICE CARDS v48 — IMAGE FULL TOP + TITLE STARTS INFO AREA
   Removed:
   - top title strip
   - service type / palette row
   Image now fills the whole upper card from top to bottom.
   ========================================================== */

/* Top part is now entirely photo */
.nike-card-top{
  position:relative !important;
  min-height:430px !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#eef2ef !important;
}

/* Completely remove any leftover title/type rows */
.nike-card-title,
.nike-price-row{
  display:none !important;
}

/* Photo slider fills the full top area */
.service-photo-slider{
  width:100% !important;
  height:430px !important;
  margin:0 !important;
  padding:0 !important;
}

.service-photo-stage{
  width:100% !important;
  height:430px !important;
  margin:0 !important;
  border-radius:26px 26px 0 0 !important;
  box-shadow:none !important;
}

.service-photo-slide,
.service-photo-slide img{
  width:100% !important;
  height:100% !important;
}

.service-photo-slide img{
  object-fit:cover !important;
  object-position:center center !important;
}

/* Keep arrows and dots over the photo */
.service-photo-arrow{
  top:50% !important;
}

.service-photo-dots{
  bottom:13px !important;
}

/* Remove visual center badge so the photo can reach the bottom cleanly */
.nike-center-badge{
  display:none !important;
}

/* Lower information starts directly with the service title */
.nike-card-info{
  padding-top:18px !important;
}

.nike-service-name{
  margin-top:0 !important;
  padding-top:0 !important;
}

.nike-service-name > small{
  margin-bottom:4px !important;
}

.nike-service-name > strong{
  display:block !important;
  margin:0 0 5px !important;
  font-size:18px !important;
  line-height:1.16 !important;
  font-weight:850 !important;
  letter-spacing:-.5px !important;
}

/* The full service heading becomes the first visible heading in the lower card */
.nike-service-name p{
  margin-top:4px !important;
}

@media (max-width:700px){
  .nike-card-top{
    min-height:405px !important;
  }

  .service-photo-slider,
  .service-photo-stage{
    height:405px !important;
  }

  .service-photo-stage{
    border-radius:24px 24px 0 0 !important;
  }

  .nike-card-info{
    padding-top:15px !important;
  }

  .nike-service-name > strong{
    font-size:17px !important;
  }
}


/* ==========================================================
   ABOUT FEATURE — REAL SERVICE PHOTOS v49
   ========================================================== */
.about-feature-layout .feature-slide img{
  object-fit:cover !important;
  object-position:center center !important;
}

.about-feature-layout .feature-slide:nth-child(1) img{
  object-position:center 54% !important;
}
.about-feature-layout .feature-slide:nth-child(2) img{
  object-position:center 48% !important;
}
.about-feature-layout .feature-slide:nth-child(3) img{
  object-position:center 48% !important;
}
.about-feature-layout .feature-slide:nth-child(4) img{
  object-position:center 66% !important;
}

.about-feature-layout .feature-side-card img{
  object-fit:cover !important;
  object-position:center center !important;
}
.about-feature-layout .feature-side-card:nth-child(1) img{
  object-position:center 54% !important;
}
.about-feature-layout .feature-side-card:nth-child(2) img{
  object-position:center 48% !important;
}
.about-feature-layout .feature-side-card:nth-child(3) img{
  object-position:center 48% !important;
}
.about-feature-layout .feature-side-card:nth-child(4) img{
  object-position:center 66% !important;
}


/* ==========================================================
   TOP HERO SLIDER — REAL SERVICE PHOTOS v50
   ========================================================== */
.hero-slider-section .real-hero-photo{
  position:relative;
  background:#ecebea !important;
}
.hero-slider-section .real-hero-photo img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
}
.hero-slider-section .real-hero-photo::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(10,10,10,.02),rgba(10,10,10,.10));
  pointer-events:none;
}

.hero-slider-section .visual-engineering-main img{object-position:center 55%}
.hero-slider-section .visual-hvac-main img{object-position:center 50%}
.hero-slider-section .visual-lift-main img{object-position:center 48%}
.hero-slider-section .visual-procurement-main img{object-position:center 68%}

/* Keep top slider clean: no placeholder text remains over the image */
.hero-slider-section .real-hero-photo span,
.hero-slider-section .real-hero-photo small{
  display:none !important;
}


/* ==========================================================
   FEATURE CARDS — READABLE DEFAULT + READABLE HOVER v51
   ========================================================== */
.feature-grid .feature-card{
  position:relative;
  overflow:hidden;
  color:#1b1f24 !important;
  border:1px solid #e4e6e8 !important;
  box-shadow:0 12px 28px rgba(27,31,36,.055) !important;
  transition:
    transform .28s cubic-bezier(.2,.8,.2,1),
    box-shadow .28s ease,
    border-color .28s ease,
    background .32s ease !important;
}

.feature-grid .feature-card:nth-child(1){
  background:linear-gradient(145deg,#f4fbf8 0%,#edf7f3 100%) !important;
}
.feature-grid .feature-card:nth-child(2){
  background:linear-gradient(145deg,#f4f9fc 0%,#edf5f8 100%) !important;
}
.feature-grid .feature-card:nth-child(3){
  background:linear-gradient(145deg,#f7f8f9 0%,#eef0f2 100%) !important;
}
.feature-grid .feature-card:nth-child(4){
  background:linear-gradient(145deg,#fbf7f1 0%,#f5eee5 100%) !important;
}

.feature-grid .feature-card h3{
  color:#171b20 !important;
  transition:color .28s ease !important;
}
.feature-grid .feature-card p{
  color:#666e78 !important;
  transition:color .28s ease !important;
}
.feature-grid .feature-card .icon-box{
  color:#1d252b !important;
  border:1px solid rgba(0,0,0,.055);
  transition:
    color .28s ease,
    background .28s ease,
    border-color .28s ease,
    transform .28s ease !important;
}

/* Separate, clearly readable hover backgrounds for all 4 service cards */
.feature-grid .feature-card:nth-child(1):hover{
  background:linear-gradient(145deg,#367f75 0%,#245f59 100%) !important;
  border-color:#367f75 !important;
}
.feature-grid .feature-card:nth-child(2):hover{
  background:linear-gradient(145deg,#477f96 0%,#315e75 100%) !important;
  border-color:#477f96 !important;
}
.feature-grid .feature-card:nth-child(3):hover{
  background:linear-gradient(145deg,#545b64 0%,#343941 100%) !important;
  border-color:#545b64 !important;
}
.feature-grid .feature-card:nth-child(4):hover{
  background:linear-gradient(145deg,#ad7d4d 0%,#825c37 100%) !important;
  border-color:#ad7d4d !important;
}

.feature-grid .feature-card:hover{
  transform:translateY(-7px) !important;
  box-shadow:0 22px 42px rgba(22,28,34,.15) !important;
}

.feature-grid .feature-card:hover h3{
  color:#fff !important;
}
.feature-grid .feature-card:hover p{
  color:rgba(255,255,255,.82) !important;
}
.feature-grid .feature-card:hover .icon-box{
  background:rgba(255,255,255,.16) !important;
  border-color:rgba(255,255,255,.28) !important;
  color:#fff !important;
  transform:scale(1.06) rotate(-3deg);
}

/* Touch devices: keep the normal card background readable. */
@media (hover:none){
  .feature-grid .feature-card:hover{
    transform:none !important;
  }
}

/* ==========================================================
   FOOTER SOCIAL — REAL COMPANY LOGO v51
   ========================================================== */
.social-avatar-wrap{
  width:96px !important;
  height:96px !important;
  padding:6px !important;
  background:#16181c !important;
  box-shadow:
    0 0 0 3px #fff,
    0 0 0 6px var(--yellow),
    0 12px 26px rgba(0,0,0,.24) !important;
}

.social-avatar{
  overflow:hidden !important;
  display:grid !important;
  place-items:center !important;
  background:#111317 !important;
  padding:8px !important;
}

.social-avatar img{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:contain !important;
  object-position:center !important;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.18));
}


/* ==========================================================
   SERVICE INNER CARDS — READABLE DEFAULT + HOVER v52
   Applies to all 4 service detail pages.
   ========================================================== */

/* ---------- TOP SUMMARY CARDS ---------- */
.engineering-summary-card{
  position:relative;
  overflow:hidden;
  border-color:#e1e4e7 !important;
  box-shadow:0 8px 24px rgba(26,31,37,.045) !important;
  transition:
    transform .28s cubic-bezier(.2,.8,.2,1),
    background .30s ease,
    border-color .28s ease,
    box-shadow .28s ease,
    color .28s ease !important;
}

.engineering-summary-card:nth-child(4n+1){
  background:linear-gradient(145deg,#f3faf8 0%,#ebf6f2 100%) !important;
}
.engineering-summary-card:nth-child(4n+2){
  background:linear-gradient(145deg,#f4f9fc 0%,#ebf4f8 100%) !important;
}
.engineering-summary-card:nth-child(4n+3){
  background:linear-gradient(145deg,#f7f8f9 0%,#eef0f2 100%) !important;
}
.engineering-summary-card:nth-child(4n+4){
  background:linear-gradient(145deg,#fbf7f1 0%,#f4ece2 100%) !important;
}

.engineering-summary-card strong{
  color:#1d2228 !important;
  transition:color .28s ease !important;
}
.engineering-summary-card small{
  color:#68717c !important;
  transition:color .28s ease !important;
}
.engineering-summary-card > span{
  transition:
    background .28s ease,
    color .28s ease,
    transform .28s ease !important;
}

.engineering-summary-card:nth-child(4n+1):hover{
  background:linear-gradient(145deg,#367f75 0%,#245f59 100%) !important;
  border-color:#367f75 !important;
}
.engineering-summary-card:nth-child(4n+2):hover{
  background:linear-gradient(145deg,#477f96 0%,#315e75 100%) !important;
  border-color:#477f96 !important;
}
.engineering-summary-card:nth-child(4n+3):hover{
  background:linear-gradient(145deg,#555d66 0%,#343a42 100%) !important;
  border-color:#555d66 !important;
}
.engineering-summary-card:nth-child(4n+4):hover{
  background:linear-gradient(145deg,#ad7d4d 0%,#825c37 100%) !important;
  border-color:#ad7d4d !important;
}

.engineering-summary-card:hover{
  transform:translateY(-7px) !important;
  box-shadow:0 20px 42px rgba(23,29,35,.15) !important;
}
.engineering-summary-card:hover strong{
  color:#fff !important;
}
.engineering-summary-card:hover small{
  color:rgba(255,255,255,.82) !important;
}
.engineering-summary-card:hover > span{
  background:rgba(255,255,255,.16) !important;
  color:#fff !important;
  transform:scale(1.06) !important;
}

/* ---------- LARGE DETAIL CARDS ---------- */
.engineering-detail-card{
  position:relative;
  overflow:hidden;
  transition:
    transform .30s cubic-bezier(.2,.8,.2,1),
    background .32s ease,
    border-color .28s ease,
    box-shadow .30s ease !important;
}

.engineering-detail-card:nth-child(4n+1){
  background:linear-gradient(145deg,#ffffff 0%,#f6fbf9 100%) !important;
}
.engineering-detail-card:nth-child(4n+2){
  background:linear-gradient(145deg,#ffffff 0%,#f5f9fb 100%) !important;
}
.engineering-detail-card:nth-child(4n+3){
  background:linear-gradient(145deg,#ffffff 0%,#f6f7f8 100%) !important;
}
.engineering-detail-card:nth-child(4n+4){
  background:linear-gradient(145deg,#ffffff 0%,#faf6f1 100%) !important;
}

.engineering-detail-card .engineering-card-head h2,
.engineering-detail-card .engineering-card-head small,
.engineering-detail-card .engineering-card-intro,
.engineering-detail-card li,
.engineering-detail-card li strong,
.engineering-detail-card .engineering-note p{
  transition:color .28s ease !important;
}

.engineering-detail-card:nth-child(4n+1):hover{
  background:linear-gradient(145deg,#33796f 0%,#225b55 100%) !important;
  border-color:#33796f !important;
}
.engineering-detail-card:nth-child(4n+2):hover{
  background:linear-gradient(145deg,#467c92 0%,#305c71 100%) !important;
  border-color:#467c92 !important;
}
.engineering-detail-card:nth-child(4n+3):hover{
  background:linear-gradient(145deg,#555c64 0%,#343940 100%) !important;
  border-color:#555c64 !important;
}
.engineering-detail-card:nth-child(4n+4):hover{
  background:linear-gradient(145deg,#aa794a 0%,#7e5835 100%) !important;
  border-color:#aa794a !important;
}

.engineering-detail-card:hover{
  transform:translateY(-6px) !important;
  box-shadow:0 24px 48px rgba(20,26,32,.16) !important;
}
.engineering-detail-card:hover .engineering-card-head h2,
.engineering-detail-card:hover .engineering-card-head small,
.engineering-detail-card:hover .engineering-card-intro,
.engineering-detail-card:hover li,
.engineering-detail-card:hover li strong,
.engineering-detail-card:hover .engineering-note p{
  color:#fff !important;
}
.engineering-detail-card:hover .engineering-card-no{
  background:rgba(255,255,255,.16) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.25) !important;
}
.engineering-detail-card:hover li::before{
  background:#fff !important;
}
.engineering-detail-card:hover .engineering-note{
  background:rgba(255,255,255,.10) !important;
  border-color:rgba(255,255,255,.20) !important;
}

/* ==========================================================
   NAVBAR — COLOR CHANGE ON HOVER v52
   ========================================================== */

/* Main desktop navbar */
.modern-nav a:not(.modern-order-btn){
  border:1px solid transparent;
  transition:
    color .25s ease,
    background .28s ease,
    border-color .25s ease,
    transform .25s ease,
    box-shadow .25s ease !important;
}

.modern-nav a:not(.modern-order-btn):hover{
  color:#fff !important;
  background:linear-gradient(135deg,#ff8249,#ff6428) !important;
  border-color:#ff6b2c !important;
  transform:translateY(-2px) !important;
  box-shadow:0 8px 18px rgba(255,107,44,.22) !important;
}
.modern-nav a:not(.modern-order-btn):hover .modern-nav-icon{
  color:#fff !important;
  transform:scale(1.25) rotate(-8deg) !important;
}

/* Navigation on the 4 inner service pages */
.engineering-nav-links a{
  padding:9px 11px;
  border:1px solid transparent;
  border-radius:10px;
  transition:
    color .25s ease,
    background .28s ease,
    border-color .25s ease,
    transform .25s ease,
    box-shadow .25s ease !important;
}

.engineering-nav-links a:hover{
  color:#fff !important;
  background:linear-gradient(135deg,#ff8249,#ff6428) !important;
  border-color:#ff6b2c !important;
  transform:translateY(-2px);
  box-shadow:0 8px 18px rgba(255,107,44,.20);
}

/* Language buttons also remain clearly readable on hover */
.lang-switch button:not(.active):hover,
.engineering-lang button:not(.active):hover{
  background:#fff1ea !important;
  color:#ff6b2c !important;
}

/* On touch screens don't leave a fake hover state */
@media (hover:none){
  .engineering-summary-card:hover,
  .engineering-detail-card:hover,
  .modern-nav a:not(.modern-order-btn):hover,
  .engineering-nav-links a:hover{
    transform:none !important;
  }
}


/* ==========================================================
   MAIN 4 SERVICE CARDS — LARGER & MORE SEPARATED v53
   ========================================================== */

/* Give this section more horizontal room only on large screens */
@media (min-width:1280px){
  .projects .container{
    width:min(1320px,calc(100% - 34px)) !important;
  }

  .nike-card-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:22px !important;
  }

  .nike-service-card{
    min-height:690px !important;
    border-radius:36px !important;
  }

  .nike-card-top{
    min-height:500px !important;
  }

  .service-photo-slider,
  .service-photo-stage{
    height:500px !important;
  }

  .service-photo-stage{
    border-radius:34px 34px 0 0 !important;
  }

  .nike-card-info{
    min-height:190px !important;
    padding:22px 20px 20px !important;
  }

  .nike-service-name > small{
    width:44px !important;
    height:44px !important;
    font-size:18px !important;
  }

  .nike-service-name strong{
    font-size:17px !important;
    line-height:1.22 !important;
  }

  .nike-service-name p{
    font-size:9px !important;
  }

  .nike-option-row{
    padding-top:12px !important;
    padding-bottom:16px !important;
  }

  .nike-card-footer{
    min-height:52px !important;
  }
}

/* On medium desktop, keep each card visibly separate instead of squeezing all 4 */
@media (min-width:801px) and (max-width:1279px){
  .projects .container{
    width:min(1040px,calc(100% - 34px)) !important;
  }

  .nike-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:24px !important;
  }

  .nike-service-card{
    max-width:none !important;
  }

  .nike-card-top{
    min-height:500px !important;
  }

  .service-photo-slider,
  .service-photo-stage{
    height:500px !important;
  }
}

/* Mobile: one large card at a time, clearly separated */
@media (max-width:800px){
  .nike-card-grid{
    display:flex !important;
    overflow-x:auto !important;
    gap:16px !important;
    padding:4px 14px 16px 0 !important;
    scroll-snap-type:x mandatory !important;
    scrollbar-width:none !important;
  }

  .nike-card-grid::-webkit-scrollbar{
    display:none !important;
  }

  .nike-service-card{
    flex:0 0 88% !important;
    min-width:88% !important;
    scroll-snap-align:center !important;
  }

  .nike-card-top{
    min-height:445px !important;
  }

  .service-photo-slider,
  .service-photo-stage{
    height:445px !important;
  }

  .nike-card-info{
    padding:18px 17px 17px !important;
  }
}


/* ==========================================================
   FEATURE CARDS v54 — BLUE DEFAULT / OLD LIGHT COLOR ON HOVER
   Reference base color sampled from supplied image.
   ========================================================== */
.feature-grid .feature-card{
  background:linear-gradient(145deg,#47758d 0%,#3b6479 100%) !important;
  border-color:#557f94 !important;
  color:#fff !important;
}

.feature-grid .feature-card h3{
  color:#fff !important;
}

.feature-grid .feature-card p{
  color:rgba(255,255,255,.90) !important;
}

.feature-grid .feature-card .icon-box{
  color:#fff !important;
  background:rgba(255,255,255,.10) !important;
  border:1px solid rgba(255,255,255,.34) !important;
}

/* Hover returns each card to its previous light theme */
.feature-grid .feature-card:nth-child(1):hover{
  background:linear-gradient(145deg,#f4fbf8 0%,#edf7f3 100%) !important;
  border-color:#dce9e4 !important;
}
.feature-grid .feature-card:nth-child(2):hover{
  background:linear-gradient(145deg,#f4f9fc 0%,#edf5f8 100%) !important;
  border-color:#dce7ed !important;
}
.feature-grid .feature-card:nth-child(3):hover{
  background:linear-gradient(145deg,#f7f8f9 0%,#eef0f2 100%) !important;
  border-color:#e0e3e6 !important;
}
.feature-grid .feature-card:nth-child(4):hover{
  background:linear-gradient(145deg,#fbf7f1 0%,#f5eee5 100%) !important;
  border-color:#eadfd2 !important;
}

.feature-grid .feature-card:hover h3{
  color:#171b20 !important;
}

.feature-grid .feature-card:hover p{
  color:#666e78 !important;
}

.feature-grid .feature-card:hover .icon-box{
  color:#1d252b !important;
  background:#fff !important;
  border-color:rgba(0,0,0,.07) !important;
}

/* Keep the same lift animation on hover */
.feature-grid .feature-card:hover{
  transform:translateY(-7px) !important;
  box-shadow:0 22px 42px rgba(22,28,34,.13) !important;
}


/* ==========================================================
   v55 CORRECTION
   1) Restore the 4 short info cards to their previous colors.
   2) Main service-card orange controls use supplied blue;
      on hover they return to orange.
   Supplied blue: #477289
   ========================================================== */

/* ---- RESTORE PREVIOUS FEATURE CARD COLORS ---- */
.feature-grid .feature-card{
  color:#1b1f24 !important;
  border:1px solid #e4e6e8 !important;
  box-shadow:0 12px 28px rgba(27,31,36,.055) !important;
}

.feature-grid .feature-card:nth-child(1){
  background:linear-gradient(145deg,#f4fbf8 0%,#edf7f3 100%) !important;
}
.feature-grid .feature-card:nth-child(2){
  background:linear-gradient(145deg,#f4f9fc 0%,#edf5f8 100%) !important;
}
.feature-grid .feature-card:nth-child(3){
  background:linear-gradient(145deg,#f7f8f9 0%,#eef0f2 100%) !important;
}
.feature-grid .feature-card:nth-child(4){
  background:linear-gradient(145deg,#fbf7f1 0%,#f5eee5 100%) !important;
}

.feature-grid .feature-card h3{
  color:#171b20 !important;
}
.feature-grid .feature-card p{
  color:#666e78 !important;
}
.feature-grid .feature-card .icon-box{
  color:#1d252b !important;
  background:transparent !important;
  border-color:rgba(0,0,0,.055) !important;
}

/* old thematic hover colors */
.feature-grid .feature-card:nth-child(1):hover{
  background:linear-gradient(145deg,#367f75 0%,#245f59 100%) !important;
  border-color:#367f75 !important;
}
.feature-grid .feature-card:nth-child(2):hover{
  background:linear-gradient(145deg,#477f96 0%,#315e75 100%) !important;
  border-color:#477f96 !important;
}
.feature-grid .feature-card:nth-child(3):hover{
  background:linear-gradient(145deg,#545b64 0%,#343941 100%) !important;
  border-color:#545b64 !important;
}
.feature-grid .feature-card:nth-child(4):hover{
  background:linear-gradient(145deg,#ad7d4d 0%,#825c37 100%) !important;
  border-color:#ad7d4d !important;
}
.feature-grid .feature-card:hover h3{
  color:#fff !important;
}
.feature-grid .feature-card:hover p{
  color:rgba(255,255,255,.82) !important;
}
.feature-grid .feature-card:hover .icon-box{
  color:#fff !important;
  background:rgba(255,255,255,.16) !important;
  border-color:rgba(255,255,255,.28) !important;
}

/* ---- MAIN 4 SERVICE CARD CONTROLS ---- */
/* default: supplied blue */
.nike-buy-btn{
  background:linear-gradient(90deg,#56849b,#477289) !important;
  color:#fff !important;
  box-shadow:0 10px 20px rgba(71,114,137,.22) !important;
  transition:
    background .24s ease,
    transform .22s ease,
    box-shadow .24s ease !important;
}

/* second option underline: blue by default */
.nike-option-row span:nth-child(2){
  border-bottom-color:#477289 !important;
}

/* hover card/button: back to the old orange */
.nike-service-card:hover .nike-buy-btn,
.nike-buy-btn:hover{
  background:linear-gradient(90deg,#ff8f52,#ff6b2c) !important;
  box-shadow:0 14px 26px rgba(255,107,44,.28) !important;
  transform:translateY(-2px);
}

.nike-service-card:hover .nike-option-row span:nth-child(2){
  border-bottom-color:#ff6b2c !important;
}


/* ==========================================================
   ANIMATED CONSTRUCTION BACKGROUND v56
   Crane + workers + truck + excavator behind the 4 service cards.
   ========================================================== */
.projects{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:
    linear-gradient(180deg,#f7f7f5 0%,#f3f4f2 58%,#f8f7f4 100%) !important;
}

.projects > .container{
  position:relative;
  z-index:3;
}

.construction-scene{
  position:absolute;
  z-index:1;
  left:0;
  right:0;
  top:100px;
  bottom:0;
  overflow:hidden;
  pointer-events:none;
  opacity:.34;
  mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 82%,transparent 100%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 82%,transparent 100%);
}

.construction-scene svg{
  width:100%;
  height:100%;
  min-height:720px;
  display:block;
}

.construction-scene .scene-building,
.construction-scene .scene-crane,
.construction-scene .scene-excavator,
.construction-scene .scene-worker,
.construction-scene .scene-truck,
.construction-scene .scene-ground{
  fill:none;
  stroke:#477289;
  stroke-width:8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.construction-scene .scene-building{
  opacity:.34;
  stroke-width:6;
}

.construction-scene .scene-ground{
  opacity:.24;
  stroke-width:5;
}

.construction-scene .scene-crane{
  opacity:.46;
  stroke:#476a7e;
}

.construction-scene .scene-excavator{
  opacity:.44;
  stroke:#9c6b3f;
}

.construction-scene .scene-truck{
  opacity:.52;
  stroke:#5f6f79;
}

.construction-scene .scene-worker{
  opacity:.58;
  stroke:#345e70;
  stroke-width:7;
}

/* crane trolley slides and hook moves slightly up/down */
.crane-trolley{
  animation:craneTrolleyMove 8s ease-in-out infinite alternate;
}
.crane-hook{
  transform-box:fill-box;
  transform-origin:center top;
  animation:craneHookBob 2.8s ease-in-out infinite;
}

/* excavator arm works slowly */
.excavator-arm,
.excavator-bucket{
  transform-box:fill-box;
  transform-origin:left center;
}
.excavator-arm{
  animation:excavatorArmMove 5.4s ease-in-out infinite;
}
.excavator-bucket{
  animation:excavatorBucketMove 5.4s ease-in-out infinite;
}

/* truck crosses behind the cards */
.scene-truck{
  transform:translate(-280px,0);
  animation:truckDrive 16s linear infinite;
}

/* workers move independently */
.worker-one{
  transform:translate(510px,575px);
  animation:workerWalkOne 12s linear infinite;
}
.worker-two{
  transform:translate(780px,575px);
  animation:workerWalkTwo 15s linear infinite reverse;
}

.worker-arm-left,
.worker-leg-right{
  transform-box:fill-box;
  transform-origin:center top;
  animation:limbSwingA .8s ease-in-out infinite alternate;
}
.worker-arm-right,
.worker-leg-left{
  transform-box:fill-box;
  transform-origin:center top;
  animation:limbSwingB .8s ease-in-out infinite alternate;
}

/* cards remain dominant */
.projects .nike-service-card{
  position:relative;
  z-index:4;
  backdrop-filter:blur(2px);
}

@keyframes craneTrolleyMove{
  from{transform:translateX(-115px)}
  to{transform:translateX(95px)}
}
@keyframes craneHookBob{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(35px)}
}
@keyframes excavatorArmMove{
  0%,100%{transform:rotate(0deg)}
  50%{transform:rotate(-9deg)}
}
@keyframes excavatorBucketMove{
  0%,100%{transform:rotate(0deg)}
  50%{transform:rotate(15deg)}
}
@keyframes truckDrive{
  from{transform:translate(-300px,0)}
  to{transform:translate(1800px,0)}
}
@keyframes workerWalkOne{
  from{transform:translate(470px,575px)}
  to{transform:translate(860px,575px)}
}
@keyframes workerWalkTwo{
  from{transform:translate(720px,575px)}
  to{transform:translate(1010px,575px)}
}
@keyframes limbSwingA{
  from{transform:rotate(-12deg)}
  to{transform:rotate(12deg)}
}
@keyframes limbSwingB{
  from{transform:rotate(12deg)}
  to{transform:rotate(-12deg)}
}

/* Mobile: simplify background and reduce movement */
@media (max-width:800px){
  .construction-scene{
    top:80px;
    opacity:.22;
  }
  .construction-scene svg{
    min-height:650px;
    width:150%;
    margin-left:-25%;
  }
  .scene-worker,
  .scene-truck{
    opacity:.38 !important;
  }
}

/* Accessibility / battery saving */
@media (prefers-reduced-motion:reduce){
  .construction-scene *{
    animation:none !important;
  }
  .scene-truck{transform:translate(620px,0)}
  .worker-one{transform:translate(560px,575px)}
  .worker-two{transform:translate(860px,575px)}
}


/* ==========================================================
   3D CONSTRUCTION PARALLAX v57
   Adds depth/perspective to the existing construction scene.
   ========================================================== */
.projects{
  perspective:1200px;
  perspective-origin:50% 42%;
}

.construction-scene{
  transform-style:preserve-3d;
  will-change:transform;
  transition:transform .18s ease-out;
}

.construction-scene svg{
  transform-style:preserve-3d;
  overflow:visible;
}

/* Depth layers */
.scene-building{
  transform:translateZ(-130px) scale(1.09);
  transform-origin:center;
  filter:blur(.2px);
}

.scene-crane{
  transform:translateZ(-40px) scale(1.03);
  transform-origin:center;
}

.scene-excavator{
  transform:translateZ(70px) scale(.96);
  transform-origin:center;
}

.scene-truck{
  transform:translateZ(120px);
}

.worker-one{
  transform:translate3d(470px,575px,145px);
}

.worker-two{
  transform:translate3d(720px,575px,115px);
}

/* Ground gives a stronger 3D floor illusion */
.scene-ground{
  transform:translateZ(20px);
}

/* Floating depth shadow */
.construction-scene::after{
  content:"";
  position:absolute;
  left:8%;
  right:8%;
  bottom:5%;
  height:120px;
  border-radius:50%;
  background:radial-gradient(ellipse at center,rgba(29,52,64,.16),transparent 68%);
  transform:translateZ(-30px) rotateX(72deg);
  filter:blur(10px);
  pointer-events:none;
}

/* 3D card lift while hovering */
@media (hover:hover) and (pointer:fine){
  .projects .nike-service-card{
    transform-style:preserve-3d;
    transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease;
  }

  .projects .nike-service-card:hover{
    transform:translateY(-10px) rotateX(2.2deg) rotateY(-1.8deg) translateZ(18px);
    box-shadow:0 30px 64px rgba(24,24,24,.15);
  }

  .projects .nike-card-top{
    transform:translateZ(10px);
  }

  .projects .nike-card-info{
    transform:translateZ(18px);
  }
}

/* Reduced motion / mobile fallback */
@media (max-width:800px){
  .projects{
    perspective:900px;
  }

  .construction-scene{
    transform:none !important;
  }

  .scene-building{transform:translateZ(-70px) scale(1.05)}
  .scene-crane{transform:translateZ(-20px) scale(1.02)}
  .scene-excavator{transform:translateZ(35px)}
}

@media (prefers-reduced-motion:reduce){
  .construction-scene{
    transform:none !important;
    transition:none !important;
  }
}


/* ==========================================================
   SERVICE PAGE HEADER — REAL COMPANY LOGO v58
   ========================================================== */
.engineering-logo{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  width:78px !important;
  height:48px !important;
  flex:0 0 78px !important;
}

.engineering-logo img{
  display:block !important;
  width:auto !important;
  height:44px !important;
  max-width:74px !important;
  object-fit:contain !important;
  object-position:left center !important;
  /* Source logo is white; make it black on the white navbar */
  filter:invert(1) !important;
}

@media (max-width:700px){
  .engineering-logo{
    width:62px !important;
    height:42px !important;
    flex-basis:62px !important;
  }

  .engineering-logo img{
    height:38px !important;
    max-width:60px !important;
  }
}


/* ==========================================================
   PARTNERS + MAIN COMPANY LOGO v59
   ========================================================== */

/* Real company logo in desktop navbar */
.real-main-brand{
  width:118px !important;
  height:52px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  padding:3px 0 !important;
}
.real-main-brand img{
  display:block !important;
  width:auto !important;
  height:46px !important;
  max-width:112px !important;
  object-fit:contain !important;
  object-position:left center !important;
  filter:invert(1) !important;
}

/* Real company logo in mobile navbar */
.real-mobile-brand{
  width:82px !important;
  height:45px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
}
.real-mobile-brand img{
  display:block !important;
  width:auto !important;
  height:41px !important;
  max-width:78px !important;
  object-fit:contain !important;
  object-position:left center !important;
  filter:invert(1) !important;
}

/* Partner grid follows the 4-column supplied reference */
.partners-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:0 !important;
  overflow:hidden;
  border:1px solid #e5e5e5;
  border-radius:18px;
  background:#fff;
}

.partners-grid .partner-card{
  min-height:128px !important;
  padding:12px 14px !important;
  border-radius:0 !important;
  border:0 !important;
  border-right:1px solid #e7e7e7 !important;
  border-bottom:1px solid #e7e7e7 !important;
  background:#fff !important;
  box-shadow:none !important;
  transform:none !important;
}

.partners-grid .partner-card:nth-child(4n){
  border-right:0 !important;
}

.partners-grid .partner-card img{
  width:100% !important;
  max-width:150px !important;
  max-height:86px !important;
  object-fit:contain !important;
  filter:none !important;
  opacity:1 !important;
  transform:none !important;
  transition:transform .24s ease,opacity .24s ease !important;
}

.partners-grid .partner-card:hover{
  background:#fafafa !important;
}

.partners-grid .partner-card:hover img{
  transform:scale(1.06) !important;
  opacity:1 !important;
}

@media (max-width:820px){
  .partners-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  .partners-grid .partner-card:nth-child(4n){
    border-right:1px solid #e7e7e7 !important;
  }
  .partners-grid .partner-card:nth-child(3n){
    border-right:0 !important;
  }
}

@media (max-width:560px){
  .partners-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    border-radius:14px;
  }
  .partners-grid .partner-card{
    min-height:102px !important;
    padding:9px 10px !important;
  }
  .partners-grid .partner-card:nth-child(3n){
    border-right:1px solid #e7e7e7 !important;
  }
  .partners-grid .partner-card:nth-child(2n){
    border-right:0 !important;
  }
  .partners-grid .partner-card img{
    max-width:125px !important;
    max-height:72px !important;
  }
  .real-mobile-brand{
    width:72px !important;
  }
  .real-mobile-brand img{
    max-width:68px !important;
    height:37px !important;
  }
}


/* ==========================================================
   PARTNER LOGO MARQUEE — 3 ROWS v60
   Row 1/3 move left, row 2 moves right.
   ========================================================== */
.partners-marquee{
  position:relative;
  overflow:hidden;
  padding:8px 0 2px;
  background:transparent;
}

.partners-marquee::before,
.partners-marquee::after{
  content:"";
  position:absolute;
  z-index:5;
  top:0;
  bottom:0;
  width:74px;
  pointer-events:none;
}
.partners-marquee::before{
  left:0;
  background:linear-gradient(90deg,var(--bg, #f7f6f3),transparent);
}
.partners-marquee::after{
  right:0;
  background:linear-gradient(270deg,var(--bg, #f7f6f3),transparent);
}

.partner-marquee-row{
  position:relative;
  overflow:hidden;
  margin:0 0 14px;
}

.partner-marquee-track{
  width:max-content;
  display:flex;
  gap:14px;
  will-change:transform;
}

.partner-marquee-set{
  display:flex;
  gap:14px;
  flex-shrink:0;
}

.partner-marquee-card{
  width:186px;
  height:104px;
  flex:0 0 186px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:11px 14px;
  border:1px solid #e5e7eb;
  border-radius:15px;
  background:rgba(255,255,255,.98);
  box-shadow:0 8px 22px rgba(25,30,40,.045);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}

.partner-marquee-card img{
  width:100%;
  height:100%;
  max-width:156px;
  max-height:80px;
  object-fit:contain;
  filter:none !important;
  opacity:1 !important;
  image-rendering:auto;
}

.partner-marquee-card:hover{
  transform:translateY(-4px) scale(1.025);
  border-color:rgba(255,107,44,.38);
  box-shadow:0 14px 30px rgba(25,30,40,.09);
}

.partner-marquee-row.left .partner-marquee-track{
  animation:partnerMarqueeLeft 34s linear infinite;
}

.partner-marquee-row.right .partner-marquee-track{
  animation:partnerMarqueeRight 38s linear infinite;
}

.partner-marquee-row.row-3 .partner-marquee-track{
  animation-duration:31s;
}

.partners-marquee:hover .partner-marquee-track{
  animation-play-state:paused;
}

@keyframes partnerMarqueeLeft{
  from{transform:translateX(0)}
  to{transform:translateX(calc(-50% - 7px))}
}

@keyframes partnerMarqueeRight{
  from{transform:translateX(calc(-50% - 7px))}
  to{transform:translateX(0)}
}

@media (max-width:800px){
  .partners-marquee::before,
  .partners-marquee::after{width:34px}

  .partner-marquee-row{margin-bottom:10px}

  .partner-marquee-track,
  .partner-marquee-set{gap:10px}

  .partner-marquee-card{
    width:148px;
    height:88px;
    flex-basis:148px;
    padding:9px 11px;
    border-radius:13px;
  }

  .partner-marquee-card img{
    max-width:126px;
    max-height:66px;
  }

  .partner-marquee-row.left .partner-marquee-track{animation-duration:28s}
  .partner-marquee-row.right .partner-marquee-track{animation-duration:31s}
  .partner-marquee-row.row-3 .partner-marquee-track{animation-duration:26s}
}

@media (prefers-reduced-motion:reduce){
  .partner-marquee-track{
    animation:none !important;
    transform:none !important;
  }
  .partner-marquee-row{
    overflow-x:auto;
    scrollbar-width:none;
  }
  .partner-marquee-row::-webkit-scrollbar{display:none}
}


/* ==========================================================
   ABOUT REFERENCE LAYOUT v61
   Inspired by the supplied 4-block corporate reference.
   ========================================================== */
.about-reference{
  background:#fff !important;
  padding:92px 0 104px !important;
}

.about-reference-grid{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  grid-template-areas:
    "photo intro"
    "stats network";
  gap:58px 72px;
  align-items:center;
}

.about-ref-photo{
  grid-area:photo;
  position:relative;
  min-height:360px;
  padding:12px 18px 24px 26px;
}

.about-ref-photo img{
  width:100%;
  height:350px;
  display:block;
  object-fit:cover;
  object-position:center 55%;
  border-radius:8px;
  box-shadow:0 16px 34px rgba(25,29,35,.08);
}

.about-ref-badge{
  position:absolute;
  z-index:4;
  left:0;
  top:-10px;
  width:92px;
  height:92px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#fff;
  color:#20252c;
  box-shadow:0 12px 28px rgba(28,35,42,.10);
  border:1px solid #edf0f1;
  text-align:center;
}

.about-ref-badge strong{
  font-size:29px;
  line-height:.9;
  color:#477289;
}

.about-ref-badge span{
  margin-top:5px;
  font-size:7px;
  line-height:1.25;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.about-corner{
  position:absolute;
  z-index:3;
  width:48px;
  height:48px;
  border-color:#42c9bf;
  border-style:solid;
  pointer-events:none;
}
.about-corner.c1{
  top:2px;right:6px;
  border-width:5px 5px 0 0;
}
.about-corner.c2{
  right:6px;bottom:12px;
  border-width:0 5px 5px 0;
}
.about-corner.c3{
  left:14px;bottom:12px;
  border-width:0 0 5px 5px;
}

.about-ref-intro{
  grid-area:intro;
  max-width:620px;
}

.about-ref-intro .section-kicker{
  margin-bottom:12px;
  color:#477289 !important;
}

.about-ref-intro h2{
  margin:0;
  max-width:600px;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:clamp(38px,4.6vw,62px);
  line-height:.98;
  letter-spacing:-.052em;
  color:#17191d;
}

.about-ref-intro h2 span{
  display:block;
  color:#ff6b2c;
}

.about-ref-intro > p{
  max-width:600px;
  margin:20px 0 24px;
  color:#747b84;
  font-size:12px;
  line-height:1.75;
}

.about-check-list{
  display:grid;
  gap:12px;
}

.about-check-item{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:12px;
  align-items:start;
}

.about-check-item > span{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:7px;
  background:#e5faf7;
  color:#1ba79a;
  font-weight:900;
  font-size:14px;
}

.about-check-item strong{
  display:block;
  margin:0 0 4px;
  color:#20242a;
  font-size:11px;
}

.about-check-item p{
  margin:0;
  max-width:510px;
  color:#90959d;
  font-size:9px;
  line-height:1.55;
}

.about-ref-stats{
  grid-area:stats;
  padding:4px 20px 0 18px;
}

.about-ref-mini{
  display:inline-block;
  margin-bottom:10px;
  color:#477289;
  font-size:8px;
  font-weight:900;
  letter-spacing:.12em;
}

.about-ref-stats h3{
  margin:0;
  max-width:430px;
  color:#1a1d22;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:clamp(28px,3.4vw,44px);
  line-height:1.03;
  letter-spacing:-.04em;
}

.about-ref-stats h3 span{
  color:#477289;
}

.about-ref-stats > p{
  max-width:480px;
  margin:16px 0 22px;
  color:#858b94;
  font-size:10px;
  line-height:1.7;
}

.about-stat-row{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:26px;
  max-width:470px;
  padding-top:8px;
}

.about-stat-row strong{
  display:block;
  margin-bottom:4px;
  color:#20252b;
  font-size:22px;
  letter-spacing:-.04em;
}

.about-stat-row small{
  display:block;
  color:#9298a1;
  font-size:7px;
  line-height:1.35;
}

.about-ref-network{
  grid-area:network;
  position:relative;
  min-height:290px;
  max-width:520px;
  width:100%;
  justify-self:center;
}

.about-network-center{
  position:absolute;
  z-index:5;
  left:50%;
  top:50%;
  width:84px;
  height:84px;
  padding:13px;
  display:grid;
  place-items:center;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:#171a1f;
  box-shadow:0 14px 34px rgba(25,29,35,.16);
}

.about-network-center img{
  width:100%;
  height:100%;
  object-fit:contain;
}

.about-network-node{
  position:absolute;
  z-index:4;
  width:90px;
  height:70px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  border:1px solid #eceef0;
  border-radius:14px;
  background:#fff;
  box-shadow:0 9px 22px rgba(26,31,38,.055);
  color:#242930;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}

.about-network-node:hover{
  transform:translateY(-4px);
  border-color:#ffcdb8;
  box-shadow:0 14px 28px rgba(255,107,44,.10);
}

.about-network-node span{
  font-size:19px;
}

.about-network-node small{
  color:#747c85;
  font-size:7px;
  font-weight:800;
}

.about-network-node.n1{left:6%;top:10%}
.about-network-node.n2{right:7%;top:4%}
.about-network-node.n3{left:13%;bottom:2%}
.about-network-node.n4{right:9%;bottom:8%}

.network-line{
  position:absolute;
  z-index:1;
  left:50%;
  top:50%;
  width:150px;
  height:1px;
  background:linear-gradient(90deg,#e7eaed,#ffb694);
  transform-origin:left center;
}
.network-line.l1{transform:rotate(-145deg)}
.network-line.l2{transform:rotate(-35deg)}
.network-line.l3{transform:rotate(145deg)}
.network-line.l4{transform:rotate(35deg)}

@media (max-width:920px){
  .about-reference-grid{
    grid-template-columns:1fr;
    grid-template-areas:
      "intro"
      "photo"
      "stats"
      "network";
    gap:36px;
  }

  .about-ref-intro,
  .about-ref-stats,
  .about-ref-network{
    max-width:none;
  }

  .about-ref-photo{
    max-width:680px;
    width:100%;
    margin:0 auto;
  }

  .about-ref-network{
    max-width:580px;
    min-height:300px;
  }
}

@media (max-width:560px){
  .about-reference{
    padding:58px 0 70px !important;
  }

  .about-ref-intro h2{
    font-size:38px;
  }

  .about-ref-photo{
    min-height:286px;
    padding:9px 6px 18px 16px;
  }

  .about-ref-photo img{
    height:270px;
  }

  .about-ref-badge{
    width:74px;
    height:74px;
  }

  .about-ref-badge strong{
    font-size:23px;
  }

  .about-ref-stats{
    padding:0;
  }

  .about-stat-row{
    gap:12px;
  }

  .about-ref-network{
    min-height:280px;
    transform:scale(.94);
  }

  .about-network-node{
    width:78px;
    height:64px;
  }
}


/* ==========================================================
   ABOUT PHOTO SLIDER + LARGE NETWORK BUTTONS v62
   ========================================================== */

/* --- left image is now a real slider --- */
.about-photo-slider{
  position:relative;
  overflow:visible;
}

.about-photo-stage{
  position:relative;
  width:100%;
  height:350px;
  overflow:hidden;
  border-radius:10px;
  background:#eef1f2;
  box-shadow:0 16px 34px rgba(25,29,35,.08);
}

.about-photo-slide{
  position:absolute;
  inset:0;
  margin:0;
  opacity:0;
  transform:scale(1.035);
  transition:opacity .55s ease,transform .75s cubic-bezier(.22,.61,.36,1);
  pointer-events:none;
}

.about-photo-slide.active{
  opacity:1;
  transform:scale(1);
  pointer-events:auto;
}

.about-photo-slide img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
}

.about-photo-slide:nth-child(1) img{object-position:center 55%}
.about-photo-slide:nth-child(2) img{object-position:center 48%}
.about-photo-slide:nth-child(3) img{object-position:center 47%}
.about-photo-slide:nth-child(4) img{object-position:center 68%}

.about-photo-arrow{
  position:absolute;
  z-index:8;
  top:50%;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  transform:translateY(-50%);
  border:1px solid rgba(255,255,255,.82);
  border-radius:50%;
  background:rgba(255,255,255,.90);
  color:#1d252c;
  box-shadow:0 8px 20px rgba(0,0,0,.12);
  cursor:pointer;
  backdrop-filter:blur(7px);
  transition:background .2s ease,color .2s ease,transform .2s ease;
}

.about-photo-arrow.prev{left:14px}
.about-photo-arrow.next{right:14px}

.about-photo-arrow:hover{
  background:#173b58;
  color:#fff;
  transform:translateY(-50%) scale(1.06);
}

.about-photo-dots{
  position:absolute;
  z-index:8;
  left:50%;
  bottom:14px;
  display:flex;
  align-items:center;
  gap:6px;
  transform:translateX(-50%);
}

.about-photo-dot{
  width:8px;
  height:8px;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.68);
  box-shadow:0 1px 5px rgba(0,0,0,.14);
  cursor:pointer;
  transition:.22s ease;
}

.about-photo-dot.active{
  width:26px;
  background:#fff;
}

/* --- network buttons are larger, as requested --- */
.about-ref-network{
  max-width:600px !important;
  min-height:340px !important;
}

.about-network-node{
  width:120px !important;
  height:94px !important;
  gap:8px !important;
  border-radius:18px !important;
  border:1px solid #e7eaed !important;
  background:#fff !important;
  box-shadow:0 12px 28px rgba(26,31,38,.065) !important;
  transition:
    transform .24s ease,
    background .24s ease,
    color .24s ease,
    border-color .24s ease,
    box-shadow .24s ease !important;
}

.about-network-node span{
  font-size:25px !important;
  transition:color .24s ease,transform .24s ease !important;
}

.about-network-node small{
  font-size:9px !important;
  font-weight:800 !important;
  color:#3d4650 !important;
  transition:color .24s ease !important;
}

/* Hover color sampled from the supplied reference: #173B58 */
.about-network-node:hover{
  background:#173b58 !important;
  border-color:#173b58 !important;
  color:#fff !important;
  transform:translateY(-7px) scale(1.035) !important;
  box-shadow:0 18px 34px rgba(23,59,88,.24) !important;
}

.about-network-node:hover span,
.about-network-node:hover small{
  color:#fff !important;
}

.about-network-node:hover span{
  transform:scale(1.08);
}

/* center company logo a little larger to balance bigger buttons */
.about-network-center{
  width:96px !important;
  height:96px !important;
  padding:14px !important;
}

/* update positions for larger nodes */
.about-network-node.n1{left:2% !important;top:6% !important}
.about-network-node.n2{right:2% !important;top:0 !important}
.about-network-node.n3{left:8% !important;bottom:0 !important}
.about-network-node.n4{right:4% !important;bottom:6% !important}

.network-line{
  width:185px !important;
  background:linear-gradient(90deg,#e6eaed,#ff9f79) !important;
}

@media (max-width:920px){
  .about-photo-stage{
    height:350px;
  }

  .about-ref-network{
    max-width:620px !important;
    min-height:350px !important;
  }
}

@media (max-width:560px){
  .about-photo-stage{
    height:270px;
  }

  .about-photo-arrow{
    width:36px;
    height:36px;
  }

  .about-ref-network{
    min-height:300px !important;
    transform:scale(.93);
  }

  .about-network-node{
    width:104px !important;
    height:82px !important;
  }

  .about-network-node span{
    font-size:22px !important;
  }

  .about-network-node small{
    font-size:8px !important;
  }

  .about-network-center{
    width:84px !important;
    height:84px !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .about-photo-slide{
    transition:none !important;
  }
}


/* ==========================================================
   ABOUT SLIDER SIZE v63
   Enlarge the photo slider up to the marked turquoise corners.
   ========================================================== */
@media (min-width:921px){
  .about-reference-grid{
    grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr) !important;
    gap:58px 62px !important;
  }

  .about-ref-photo{
    min-height:455px !important;
    padding:0 !important;
  }

  .about-photo-stage{
    width:100% !important;
    height:430px !important;
    margin:0 !important;
    border-radius:10px !important;
  }

  .about-photo-slide img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
  }

  /* Corners now sit exactly on the enlarged slider edges */
  .about-corner.c1{
    top:-10px !important;
    right:-10px !important;
  }

  .about-corner.c2{
    right:-10px !important;
    bottom:14px !important;
  }

  .about-corner.c3{
    left:-10px !important;
    bottom:14px !important;
  }

  .about-ref-badge{
    left:-22px !important;
    top:-22px !important;
    width:98px !important;
    height:98px !important;
  }
}

@media (min-width:1200px){
  .about-ref-photo{
    min-height:490px !important;
  }

  .about-photo-stage{
    height:465px !important;
  }
}

@media (max-width:920px) and (min-width:561px){
  .about-ref-photo{
    max-width:760px !important;
    min-height:410px !important;
    padding:0 !important;
  }

  .about-photo-stage{
    height:390px !important;
  }
}

@media (max-width:560px){
  .about-ref-photo{
    padding:0 !important;
    min-height:310px !important;
  }

  .about-photo-stage{
    height:300px !important;
  }

  .about-corner.c1{top:-7px !important;right:-7px !important}
  .about-corner.c2{right:-7px !important;bottom:3px !important}
  .about-corner.c3{left:-7px !important;bottom:3px !important}
}


/* ==========================================================
   WORK PROCESS WORLD MAP + REAL FOOTER LOGO v64
   ========================================================== */

.work-process{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate;
  background:
    radial-gradient(circle at 50% 38%,rgba(255,255,255,.88) 0 26%,rgba(255,255,255,.70) 47%,rgba(247,249,249,.96) 78%),
    linear-gradient(180deg,#fff 0%,#f7f9f8 100%) !important;
}

.work-process > .container{
  position:relative;
  z-index:3;
}

/* world map behind the animated work process */
.process-worldmap-bg{
  position:absolute;
  z-index:1;
  left:50%;
  top:86px;
  width:min(1120px,92vw);
  height:560px;
  transform:translateX(-50%);
  pointer-events:none;
  opacity:.46;
  animation:processMapFloat 15s ease-in-out infinite alternate;
}

.process-worldmap-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 46%,rgba(255,255,255,.16),rgba(255,255,255,.38) 56%,rgba(255,255,255,.92) 88%);
}

.process-worldmap-bg img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  filter:drop-shadow(0 14px 32px rgba(71,114,137,.04));
}

/* animated location pulses; positions follow the supplied map */
.process-map-pulse{
  position:absolute;
  z-index:2;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#ff6b2c;
  box-shadow:0 0 0 0 rgba(255,107,44,.26);
  animation:processMapPulse 2.7s ease-out infinite;
}

.process-map-pulse:nth-of-type(even){
  background:#4fae9d;
  box-shadow:0 0 0 0 rgba(79,174,157,.28);
}

.process-map-pulse.pulse-1{left:33%;top:62%;animation-delay:.0s}
.process-map-pulse.pulse-2{left:21%;top:34%;animation-delay:.45s}
.process-map-pulse.pulse-3{left:58%;top:22%;animation-delay:.9s}
.process-map-pulse.pulse-4{left:59%;top:52%;animation-delay:1.35s}
.process-map-pulse.pulse-5{left:81%;top:33%;animation-delay:1.8s}
.process-map-pulse.pulse-6{left:95%;top:68%;animation-delay:2.25s}

/* Ensure heading and process text remain very clear over map */
.process-heading{
  position:relative;
  z-index:4;
}

.process-progress-shell{
  position:relative;
  z-index:4;
}

/* a soft glass field around the timeline without creating a visible box */
.process-progress-shell::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-70px -28px -54px;
  border-radius:42px;
  background:radial-gradient(ellipse at center,rgba(255,255,255,.72),rgba(255,255,255,.28) 70%,transparent 100%);
  backdrop-filter:blur(.4px);
}

/* real company logo in black footer */
.footer-real-logo{
  width:132px !important;
  height:58px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
}

.footer-real-logo img{
  width:auto !important;
  height:52px !important;
  max-width:126px !important;
  display:block !important;
  object-fit:contain !important;
  object-position:left center !important;
  filter:none !important;
}

@keyframes processMapFloat{
  0%{
    transform:translateX(-50%) translate3d(-10px,0,0) scale(1);
  }
  50%{
    transform:translateX(-50%) translate3d(7px,-9px,0) scale(1.018);
  }
  100%{
    transform:translateX(-50%) translate3d(15px,4px,0) scale(1.008);
  }
}

@keyframes processMapPulse{
  0%{
    transform:scale(.82);
    opacity:.82;
    box-shadow:0 0 0 0 currentColor;
  }
  65%{
    transform:scale(1.06);
    opacity:1;
    box-shadow:0 0 0 15px rgba(255,107,44,0);
  }
  100%{
    transform:scale(.82);
    opacity:.72;
    box-shadow:0 0 0 0 rgba(255,107,44,0);
  }
}

@media (max-width:800px){
  .process-worldmap-bg{
    top:100px;
    width:150vw;
    height:500px;
    opacity:.28;
  }

  .process-map-pulse{
    width:8px;
    height:8px;
  }

  .footer-real-logo{
    width:108px !important;
    height:50px !important;
  }

  .footer-real-logo img{
    height:45px !important;
    max-width:103px !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .process-worldmap-bg,
  .process-map-pulse{
    animation:none !important;
  }
}


/* ==========================================================
   ABOUT SERVICES EXTENSION v65
   Reference-inspired 4-service block below About section.
   ========================================================== */
.about-services-extension{
  position:relative;
  padding:94px 0 110px !important;
  background:
    linear-gradient(180deg,#fbfbfa 0%,#f6f7f5 100%);
  border-top:1px solid #eceeea;
}

.about-services-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,.65fr);
  gap:50px;
  align-items:end;
  margin-bottom:42px;
}

.about-services-head h2{
  margin:5px 0 0;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:clamp(38px,4.5vw,58px);
  line-height:.98;
  letter-spacing:-.05em;
  color:#17191d;
}

.about-services-head h2 span{
  color:#ff6b2c;
}

.about-services-head > p{
  margin:0;
  color:#7b828b;
  font-size:12px;
  line-height:1.75;
}

.about-service-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
}

.about-service-card{
  position:relative;
  min-height:315px;
  display:grid;
  grid-template-columns:42% 58%;
  overflow:hidden;
  border:1px solid #e6e8e8;
  border-radius:22px;
  background:#fff;
  color:#17191d;
  box-shadow:0 12px 30px rgba(22,28,34,.045);
  transition:
    transform .28s cubic-bezier(.2,.8,.2,1),
    box-shadow .28s ease,
    border-color .28s ease;
}

.about-service-card:hover{
  transform:translateY(-7px);
  border-color:#d8dfe2;
  box-shadow:0 22px 44px rgba(24,31,38,.10);
}

.about-service-image{
  position:relative;
  overflow:hidden;
  min-height:315px;
  background:#eef1f1;
}

.about-service-image::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 56%,rgba(10,18,24,.28));
  pointer-events:none;
}

.about-service-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  transition:transform .55s cubic-bezier(.2,.8,.2,1);
}

.about-service-card:hover .about-service-image img{
  transform:scale(1.055);
}

.about-service-no{
  position:absolute;
  z-index:3;
  left:14px;
  top:14px;
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#fff;
  color:#173b58;
  font-size:12px;
  font-weight:900;
  box-shadow:0 8px 22px rgba(0,0,0,.10);
}

.about-service-body{
  padding:28px 28px 24px;
  display:flex;
  flex-direction:column;
}

.about-service-body > small{
  color:#477289;
  font-size:8px;
  font-weight:900;
  letter-spacing:.12em;
}

.about-service-body h3{
  margin:8px 0 10px;
  font-size:22px;
  line-height:1.08;
  letter-spacing:-.035em;
}

.about-service-body > p{
  margin:0 0 15px;
  color:#7b828a;
  font-size:10px;
  line-height:1.6;
}

.about-service-body ul{
  list-style:none;
  display:grid;
  gap:8px;
  padding:0;
  margin:0 0 20px;
}

.about-service-body li{
  position:relative;
  padding-left:18px;
  color:#555e68;
  font-size:9px;
  line-height:1.4;
}

.about-service-body li::before{
  content:"";
  position:absolute;
  left:0;
  top:.48em;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#ff6b2c;
}

.about-service-link{
  margin-top:auto;
  display:inline-flex;
  align-items:center;
  gap:8px;
  width:max-content;
  color:#173b58;
  font-size:10px;
  font-weight:900;
}

.about-service-link b{
  width:25px;
  height:25px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#edf4f7;
  transition:.22s ease;
}

.about-service-card:hover .about-service-link b{
  background:#173b58;
  color:#fff;
  transform:translateX(3px);
}

/* subtle alternating tint like the supplied reference */
.about-service-card:nth-child(2) .about-service-no,
.about-service-card:nth-child(4) .about-service-no{
  color:#ff6b2c;
}

@media (max-width:980px){
  .about-services-head{
    grid-template-columns:1fr;
    gap:18px;
  }

  .about-service-grid{
    grid-template-columns:1fr;
  }

  .about-service-card{
    grid-template-columns:40% 60%;
  }
}

@media (max-width:620px){
  .about-services-extension{
    padding:64px 0 76px !important;
  }

  .about-services-head h2{
    font-size:39px;
  }

  .about-service-card{
    grid-template-columns:1fr;
  }

  .about-service-image{
    min-height:240px;
    height:240px;
  }

  .about-service-body{
    padding:22px 20px 20px;
  }

  .about-service-body h3{
    font-size:21px;
  }
}


/* ==========================================================
   FEATURE SERVICES — REFERENCE DESIGN v66
   4 large side-by-side cards inspired by the supplied layout.
   ========================================================== */
.feature-strip.feature-reference{
  position:relative;
  z-index:6;
  padding:56px 0 66px !important;
  background:#fff !important;
}

.feature-reference-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}

.feature-ref-card{
  min-width:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border:1px solid #e7e9eb;
  border-radius:24px;
  background:#fff;
  color:#1b1e23;
  box-shadow:0 12px 28px rgba(24,30,36,.055);
  transition:
    transform .28s cubic-bezier(.2,.8,.2,1),
    box-shadow .28s ease,
    border-color .28s ease;
}

.feature-ref-card:hover{
  transform:translateY(-8px);
  border-color:#cfd8dd;
  box-shadow:0 22px 44px rgba(23,30,37,.11);
}

.feature-ref-visual{
  position:relative;
  height:220px;
  overflow:hidden;
  background:#f7f8f8;
}

.feature-ref-blob{
  position:absolute;
  left:-14px;
  top:-28px;
  width:104%;
  height:235px;
  overflow:hidden;
  border-radius:0 0 58% 42% / 0 0 28% 36%;
  background:#e8edf0;
}

.feature-ref-blob::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(23,59,88,.03),rgba(23,59,88,.13));
}

.feature-ref-blob img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  transition:transform .55s ease;
}

.feature-ref-card:hover .feature-ref-blob img{
  transform:scale(1.055);
}

.feature-ref-mini{
  position:absolute;
  z-index:3;
  left:18px;
  bottom:13px;
  width:72px;
  height:72px;
  padding:5px;
  overflow:hidden;
  border-radius:50%;
  background:#fff;
  box-shadow:0 9px 24px rgba(17,25,31,.15);
}

.feature-ref-mini img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  border-radius:50%;
}

.feature-ref-icon{
  position:absolute;
  z-index:4;
  right:18px;
  bottom:18px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#173b58;
  color:#fff;
  border:4px solid #fff;
  box-shadow:0 8px 18px rgba(23,59,88,.18);
  font-size:17px;
}

.feature-ref-copy{
  display:flex;
  flex:1;
  flex-direction:column;
  padding:24px 22px 22px;
}

.feature-ref-copy > small{
  display:block;
  margin-bottom:8px;
  color:#477289;
  font-size:8px;
  font-weight:900;
  letter-spacing:.12em;
}

.feature-ref-copy h3{
  min-height:48px;
  margin:0 0 11px;
  color:#171a1f !important;
  font-size:19px;
  line-height:1.16;
  letter-spacing:-.035em;
}

.feature-ref-copy > p{
  min-height:76px;
  margin:0 0 17px;
  color:#777f88 !important;
  font-size:10px;
  line-height:1.65;
}

.feature-ref-checks{
  display:grid;
  gap:8px;
  margin-bottom:22px;
}

.feature-ref-checks span{
  display:flex;
  align-items:center;
  gap:7px;
  color:#3f4851;
  font-size:9px;
  font-weight:700;
}

.feature-ref-checks i{
  width:18px;
  height:18px;
  display:grid;
  place-items:center;
  flex:0 0 18px;
  border-radius:50%;
  background:#e1f6f2;
  color:#1caa98;
  font-style:normal;
  font-size:10px;
  font-weight:900;
}

.feature-ref-link{
  margin-top:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color:#173b58;
  font-size:10px;
  font-weight:900;
}

.feature-ref-link b{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#eef3f5;
  color:#173b58;
  transition:.22s ease;
}

.feature-ref-card:hover .feature-ref-link b{
  background:#173b58;
  color:#fff;
  transform:translateX(3px);
}

/* slight individual visual tint, still same design */
.feature-ref-card:nth-child(2) .feature-ref-icon{background:#477f96}
.feature-ref-card:nth-child(3) .feature-ref-icon{background:#545b64}
.feature-ref-card:nth-child(4) .feature-ref-icon{background:#ad7d4d}

@media (min-width:1280px){
  .feature-reference .container{
    width:min(1320px,calc(100% - 34px)) !important;
  }
}

@media (max-width:1080px){
  .feature-reference-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px;
  }

  .feature-ref-visual{
    height:240px;
  }

  .feature-ref-blob{
    height:255px;
  }
}

@media (max-width:620px){
  .feature-strip.feature-reference{
    padding:42px 0 52px !important;
  }

  .feature-reference-grid{
    display:flex;
    gap:14px;
    overflow-x:auto;
    padding:2px 4px 14px 0;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }

  .feature-reference-grid::-webkit-scrollbar{
    display:none;
  }

  .feature-ref-card{
    flex:0 0 88%;
    min-width:88%;
    scroll-snap-align:center;
  }

  .feature-ref-visual{
    height:230px;
  }

  .feature-ref-blob{
    height:245px;
  }
}


/* ==========================================================
   FEATURE SERVICES v67
   Text left, image right, no links/click-through.
   ========================================================== */
.feature-strip.feature-reference-v67{
  padding:58px 0 68px !important;
  background:#fff !important;
}

.feature-reference-v67 .feature-reference-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:18px !important;
}

.feature-ref-card-v67{
  min-width:0;
  min-height:310px;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(105px,.92fr);
  overflow:hidden;
  border:1px solid #e6e9eb;
  border-radius:24px;
  background:#fff;
  box-shadow:0 12px 28px rgba(24,30,36,.05);
  transition:transform .26s ease,box-shadow .26s ease,border-color .26s ease;
}

.feature-ref-card-v67:hover{
  transform:translateY(-6px);
  border-color:#d7dee2;
  box-shadow:0 20px 40px rgba(23,30,37,.10);
}

.feature-ref-copy-v67{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:26px 14px 24px 22px;
}

.feature-ref-kicker-v67{
  display:block;
  margin-bottom:8px;
  color:#477289;
  font-size:7.5px;
  font-weight:900;
  letter-spacing:.12em;
}

.feature-ref-copy-v67 h3{
  margin:0 0 10px;
  color:#171a1f !important;
  font-size:17px;
  line-height:1.14;
  letter-spacing:-.03em;
}

.feature-ref-copy-v67 > p{
  margin:0 0 16px;
  color:#737b85 !important;
  font-size:9.5px;
  line-height:1.58;
}

.feature-ref-checks-v67{
  display:grid;
  gap:7px;
}

.feature-ref-checks-v67 span{
  display:flex;
  align-items:center;
  gap:6px;
  color:#46505a;
  font-size:8.5px;
  font-weight:700;
}

.feature-ref-checks-v67 i{
  width:17px;
  height:17px;
  display:grid;
  place-items:center;
  flex:0 0 17px;
  border-radius:50%;
  background:#e4f7f3;
  color:#1aa18f;
  font-style:normal;
  font-size:9px;
  font-weight:900;
}

.feature-ref-image-v67{
  position:relative;
  overflow:hidden;
  min-height:310px;
  background:#f1f3f3;
  border-radius:46% 0 0 46% / 34% 0 0 34%;
}

.feature-ref-image-v67::before{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  background:linear-gradient(90deg,rgba(255,255,255,.18),rgba(255,255,255,0) 36%);
  pointer-events:none;
}

.feature-ref-image-v67 img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  transition:transform .5s ease;
}

.feature-ref-card-v67:hover .feature-ref-image-v67 img{
  transform:scale(1.045);
}

.feature-ref-bubble-v67{
  position:absolute;
  z-index:3;
  left:12px;
  bottom:16px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#fff;
  color:#173b58;
  border:1px solid #e8ecee;
  box-shadow:0 8px 20px rgba(20,28,34,.10);
  font-size:17px;
}

/* different image positions */
.feature-ref-image-v67.engineering-img img{object-position:center 56%}
.feature-ref-image-v67.hvac-img img{object-position:center 48%}
.feature-ref-image-v67.lift-img img{object-position:center 48%}
.feature-ref-image-v67.procurement-img img{object-position:center 68%}

@media (min-width:1280px){
  .feature-reference-v67 .container{
    width:min(1360px,calc(100% - 30px)) !important;
  }
}

@media (max-width:1120px){
  .feature-reference-v67 .feature-reference-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .feature-ref-card-v67{
    grid-template-columns:minmax(0,1.15fr) minmax(180px,.85fr);
  }
}

@media (max-width:620px){
  .feature-strip.feature-reference-v67{
    padding:42px 0 54px !important;
  }

  .feature-reference-v67 .feature-reference-grid{
    display:flex !important;
    overflow-x:auto;
    gap:14px !important;
    padding:2px 4px 12px 0;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }

  .feature-reference-v67 .feature-reference-grid::-webkit-scrollbar{
    display:none;
  }

  .feature-ref-card-v67{
    flex:0 0 92%;
    min-width:92%;
    grid-template-columns:minmax(0,1.08fr) minmax(130px,.92fr);
    min-height:290px;
    scroll-snap-align:center;
  }

  .feature-ref-image-v67{
    min-height:290px;
  }

  .feature-ref-copy-v67{
    padding:22px 12px 20px 18px;
  }

  .feature-ref-copy-v67 h3{
    font-size:16px;
  }
}


/* ==========================================================
   v68 — HERO FILL + DARKER MAP + SERVICE CARD HOVER
   ========================================================== */

/* Keep the hero visual side filled even on the last real slide */
.slider-visual-area{
  overflow:hidden !important;
}

.slider-track{
  width:max-content;
}

.visual-card-clone{
  pointer-events:none;
}

/* Make the world-map background a little darker / more visible */
.hero-slider-shell::after{
  opacity:.42 !important;
  filter:contrast(1.08) saturate(1.08) blur(.05px) !important;
}

@keyframes worldMapDrift{
  0%{
    transform:translate3d(-1.2%,.6%,0) scale(1.02);
    opacity:.34;
  }
  50%{
    transform:translate3d(.8%,-.8%,0) scale(1.055);
    opacity:.46;
  }
  100%{
    transform:translate3d(1.5%,.4%,0) scale(1.025);
    opacity:.38;
  }
}

/* New information cards: stronger text + animated color hover */
.feature-ref-card-v67{
  position:relative;
  transition:
    transform .30s cubic-bezier(.2,.8,.2,1),
    background .34s ease,
    color .30s ease,
    border-color .30s ease,
    box-shadow .30s ease !important;
}

.feature-ref-copy-v67{
  transition:background .34s ease,color .30s ease !important;
}

.feature-ref-copy-v67 h3{
  font-size:18.5px !important;
  line-height:1.16 !important;
  transition:color .30s ease !important;
}

.feature-ref-copy-v67 > p{
  font-size:10.5px !important;
  line-height:1.62 !important;
  transition:color .30s ease !important;
}

.feature-ref-kicker-v67{
  font-size:8.5px !important;
  transition:color .30s ease !important;
}

.feature-ref-checks-v67 span{
  font-size:9.5px !important;
  transition:color .30s ease !important;
}

.feature-ref-checks-v67 i{
  transition:background .30s ease,color .30s ease,transform .30s ease !important;
}

/* Soft animated color sweep */
.feature-ref-card-v67::after{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  opacity:0;
  background:
    radial-gradient(circle at 18% 22%,rgba(255,255,255,.14),transparent 28%),
    linear-gradient(120deg,#477289 0%,#173b58 68%,#112e46 100%);
  transform:translateX(-14%);
  transition:opacity .34s ease,transform .48s cubic-bezier(.2,.8,.2,1);
  pointer-events:none;
}

.feature-ref-card-v67:hover::after{
  opacity:1;
  transform:translateX(0);
}

.feature-ref-card-v67:hover{
  transform:translateY(-8px) scale(1.012) !important;
  border-color:#315f79 !important;
  box-shadow:0 24px 46px rgba(23,59,88,.20) !important;
}

/* image stays above the animated card background */
.feature-ref-image-v67{
  z-index:2;
}

/* all text remains readable on hover */
.feature-ref-card-v67:hover .feature-ref-copy-v67{
  color:#fff !important;
}

.feature-ref-card-v67:hover .feature-ref-kicker-v67,
.feature-ref-card-v67:hover .feature-ref-copy-v67 h3,
.feature-ref-card-v67:hover .feature-ref-copy-v67 > p,
.feature-ref-card-v67:hover .feature-ref-checks-v67 span{
  color:#fff !important;
}

.feature-ref-card-v67:hover .feature-ref-checks-v67 i{
  background:#fff !important;
  color:#173b58 !important;
  transform:scale(1.07);
}

.feature-ref-card-v67:hover .feature-ref-bubble-v67{
  background:#ff6b2c !important;
  color:#fff !important;
  border-color:#fff !important;
}

/* Keep mobile map visible but not overpowering */
@media (max-width:700px){
  .hero-slider-shell::after{
    opacity:.24 !important;
  }

  .feature-ref-copy-v67 h3{
    font-size:17.5px !important;
  }

  .feature-ref-copy-v67 > p{
    font-size:10px !important;
  }
}


/* ==========================================================
   v69 — DARKER PROCESS MAP + FASTER HERO SLIDER
   ========================================================== */

/* Work-process world map: slightly darker and more visible */
.process-worldmap-bg{
  opacity:.66 !important;
  filter:contrast(1.12) saturate(1.08) !important;
}

.process-worldmap-bg::after{
  background:
    radial-gradient(
      circle at 50% 46%,
      rgba(255,255,255,.04),
      rgba(255,255,255,.16) 55%,
      rgba(255,255,255,.56) 90%
    ) !important;
}

.process-worldmap-bg img{
  filter:
    contrast(1.18)
    saturate(1.08)
    brightness(.92)
    drop-shadow(0 14px 32px rgba(71,114,137,.06)) !important;
}

/* Make the map pins a little stronger too */
.process-map-pulse{
  opacity:.95 !important;
}

@media (max-width:800px){
  .process-worldmap-bg{
    opacity:.42 !important;
  }
}


/* ==========================================================
   RESPONSIVE REBUILD v73
   ----------------------------------------------------------
   Desktop (> 980px): untouched.
   Mobile/tablet: same desktop design, scaled/reflowed only.
   No app header, no app bottom bar, no app-style layout.
   ========================================================== */

.mobile-menu-toggle{
  display:none;
}

/* ---------- TABLET: same desktop design, fewer columns ---------- */
@media (min-width:769px) and (max-width:980px){

  html,
  body{
    max-width:100%;
    overflow-x:hidden;
  }

  .container{
    width:calc(100% - 34px) !important;
  }

  .modern-header-inner{
    width:calc(100% - 24px) !important;
    grid-template-columns:minmax(130px,.7fr) minmax(0,1fr) auto !important;
    gap:10px !important;
  }

  .real-main-brand{
    width:100px !important;
  }

  .real-main-brand img{
    max-width:96px !important;
  }

  .modern-nav{
    overflow-x:auto;
    justify-content:flex-start;
    scrollbar-width:none;
  }

  .modern-nav::-webkit-scrollbar{
    display:none;
  }

  .modern-nav a{
    padding:0 9px !important;
    font-size:10px !important;
  }

  .modern-header-actions{
    gap:5px !important;
  }

  .modern-header-actions .site-search{
    display:none !important;
  }

  .modern-phone-copy{
    display:none !important;
  }

  .modern-phone-box{
    width:38px !important;
    padding:3px !important;
  }

  .hero-slider-shell{
    grid-template-columns:62px minmax(260px,.8fr) minmax(420px,1.2fr) !important;
  }

  .slider-copy{
    padding-right:25px !important;
  }

  .slider-copy h1{
    font-size:clamp(45px,6vw,62px) !important;
  }

  .visual-card{
    flex-basis:280px !important;
    height:400px !important;
  }

  .visual-placeholder{
    height:305px !important;
  }

  .visual-card-caption{
    height:95px !important;
  }

  .feature-reference-v67 .feature-reference-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .about-reference-grid{
    grid-template-columns:1fr 1fr !important;
    gap:38px !important;
  }

  .about-service-grid{
    grid-template-columns:1fr !important;
  }

  .nike-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .application-grid{
    grid-template-columns:1fr !important;
  }
}

/* ---------- PHONE: desktop website converted responsively ---------- */
@media (max-width:768px){

  html{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
    scroll-padding-top:70px;
  }

  body{
    width:100%;
    max-width:100%;
    margin:0;
    padding:0 !important;
    overflow-x:hidden !important;
    background:#fff !important;
  }

  main{
    width:100%;
    max-width:100%;
    overflow:visible !important;
  }

  img,
  iframe,
  svg{
    max-width:100%;
  }

  .container{
    width:calc(100% - 24px) !important;
    max-width:none !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .section{
    padding:54px 0 !important;
  }

  /* ---------- STANDARD MOBILE HEADER ---------- */
  .modern-site-header{
    display:block !important;
    position:sticky !important;
    top:0 !important;
    z-index:2400 !important;
    padding:5px 0 !important;
    background:rgba(247,248,250,.97) !important;
    border-bottom:1px solid #e6e8ec !important;
    box-shadow:0 3px 13px rgba(28,34,42,.05) !important;
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }

  .modern-header-inner{
    position:relative;
    width:calc(100% - 18px) !important;
    min-height:46px !important;
    margin:0 auto !important;
    display:grid !important;
    grid-template-columns:58px 1fr 36px !important;
    grid-template-areas:
      "brand spacer toggle"
      "nav nav nav"
      "actions actions actions" !important;
    align-items:center !important;
    gap:0 8px !important;
  }

  .real-main-brand{
    grid-area:brand;
    width:54px !important;
    height:38px !important;
    padding:0 !important;
    justify-self:start !important;
  }

  .real-main-brand img{
    width:auto !important;
    height:30px !important;
    max-width:52px !important;
    display:block !important;
    object-fit:contain !important;
  }

  .mobile-menu-toggle{
    grid-area:toggle;
    width:34px;
    height:34px;
    padding:0;
    display:grid !important;
    place-items:center;
    justify-self:end;
    border:1px solid #dfe3e7;
    border-radius:9px;
    background:#fff;
    color:#28313a;
    font-size:18px;
    line-height:1;
    cursor:pointer;
    box-shadow:0 3px 8px rgba(27,33,40,.05);
  }

  .modern-nav{
    grid-area:nav;
    width:100% !important;
    min-height:0 !important;
    margin-top:6px !important;
    padding:6px !important;
    display:none !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:5px !important;
    overflow:visible !important;
    border:1px solid #e1e5e8 !important;
    border-radius:12px !important;
    background:#fff !important;
    box-shadow:0 11px 28px rgba(28,34,42,.10) !important;
  }

  .modern-site-header.mobile-menu-open .modern-nav{
    display:grid !important;
  }

  .modern-nav a{
    min-height:38px !important;
    padding:0 10px !important;
    justify-content:flex-start !important;
    gap:6px !important;
    border-radius:8px !important;
    font-size:9.5px !important;
    line-height:1.2 !important;
    white-space:normal !important;
  }

  .modern-nav-icon{
    font-size:10px !important;
  }

  .modern-nav .modern-order-btn{
    margin-left:0 !important;
    padding:0 10px !important;
  }

  .modern-header-actions{
    grid-area:actions;
    width:100% !important;
    margin-top:5px !important;
    padding:6px !important;
    display:none !important;
    grid-template-columns:minmax(0,1fr) auto auto auto !important;
    align-items:center !important;
    gap:5px !important;
    border:1px solid #e5e8eb;
    border-radius:12px;
    background:#fff;
  }

  .modern-site-header.mobile-menu-open .modern-header-actions{
    display:grid !important;
  }

  .modern-header-actions .site-search{
    width:100% !important;
    min-width:0 !important;
    height:36px !important;
  }

  .modern-header-actions .site-search:focus-within{
    width:100% !important;
  }

  .modern-header-actions .site-search-input{
    font-size:10px !important;
  }

  .modern-phone-box{
    width:35px !important;
    height:35px !important;
    min-height:35px !important;
    padding:0 !important;
    display:grid !important;
    place-items:center !important;
    border-radius:9px !important;
  }

  .modern-phone-icon{
    width:33px !important;
    height:33px !important;
    display:grid !important;
    place-items:center !important;
    font-size:13px !important;
  }

  .modern-phone-copy{
    display:none !important;
  }

  .modern-header-actions .lang-switch{
    min-height:34px !important;
    padding:2px !important;
    gap:1px !important;
  }

  .modern-header-actions .lang-switch button{
    min-width:24px !important;
    height:27px !important;
    padding:0 4px !important;
    font-size:7px !important;
  }

  .theme-toggle{
    width:34px !important;
    height:34px !important;
  }

  /* ---------- HERO: exact same content/function, mobile reflow ---------- */
  .hero-slider-section{
    padding:22px 0 30px !important;
    background:
      radial-gradient(circle at 84% 12%,rgba(255,213,31,.08),transparent 28%),
      linear-gradient(180deg,#edf1f5 0%,#f7f8fa 100%) !important;
  }

  .hero-slider-shell{
    min-height:0 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-areas:
      "dots"
      "copy"
      "visual" !important;
    align-items:stretch !important;
    padding:24px 0 64px !important;
    overflow:hidden !important;
    border-radius:22px !important;
  }

  .hero-slider-shell::after{
    opacity:.21 !important;
    background-size:145% auto !important;
    background-position:center 18% !important;
  }

  .slider-dots{
    grid-area:dots;
    width:auto !important;
    height:auto !important;
    margin:0 18px 18px !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
  }

  .slider-dots::before{
    display:none !important;
  }

  .slider-dot{
    width:8px !important;
    height:8px !important;
    flex:0 0 8px;
    background:#c6ccd1 !important;
    box-shadow:none !important;
  }

  .slider-dot.active{
    width:25px !important;
    height:8px !important;
    border-radius:999px !important;
    background:#ff6b2c !important;
    box-shadow:none !important;
  }

  .slider-dot.active::after{
    display:none !important;
  }

  .slider-copy{
    grid-area:copy;
    padding:0 18px 22px !important;
  }

  .slider-kicker{
    margin-bottom:9px !important;
    font-size:9px !important;
  }

  .slider-copy h1{
    max-width:100% !important;
    margin-bottom:13px !important;
    font-size:clamp(36px,10.6vw,48px) !important;
    line-height:.95 !important;
    letter-spacing:-2.5px !important;
  }

  .slider-copy p{
    min-height:0 !important;
    max-width:100% !important;
    margin-bottom:18px !important;
    font-size:11.5px !important;
    line-height:1.62 !important;
  }

  .slider-btn{
    min-height:42px !important;
    padding:0 17px !important;
    border-radius:9px !important;
    font-size:10px !important;
  }

  .slider-progress{
    margin-top:18px !important;
    gap:9px !important;
    font-size:9px !important;
  }

  .progress-line{
    width:auto !important;
    max-width:130px !important;
    flex:1 1 100px;
  }

  .slider-visual-area{
    grid-area:visual;
    width:100% !important;
    padding:0 0 0 16px !important;
    overflow:hidden !important;
  }

  .slider-track{
    gap:12px !important;
  }

  .visual-card{
    flex:0 0 calc(100vw - 62px) !important;
    width:calc(100vw - 62px) !important;
    max-width:338px !important;
    height:338px !important;
    border-radius:19px !important;
    transform:scale(.975) !important;
    opacity:.78 !important;
  }

  .visual-card.active-card{
    transform:scale(1) !important;
    opacity:1 !important;
  }

  .visual-placeholder{
    height:258px !important;
  }

  .visual-card-caption{
    height:80px !important;
    padding:13px 15px !important;
  }

  .visual-card-caption strong{
    font-size:13.5px !important;
  }

  .visual-card-caption span{
    font-size:8.5px !important;
  }

  .slider-nav{
    right:14px !important;
    bottom:13px !important;
  }

  .slider-arrow{
    width:38px !important;
    height:38px !important;
  }

  /* ---------- 4 SERVICE INFO CARDS ---------- */
  .feature-strip.feature-reference-v67{
    padding:44px 0 !important;
    background:#fff !important;
  }

  .feature-reference-v67 .feature-reference-grid{
    width:100% !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:13px !important;
    overflow:visible !important;
    margin:0 !important;
    padding:0 !important;
  }

  .feature-ref-card-v67{
    width:100% !important;
    min-width:0 !important;
    min-height:238px !important;
    display:grid !important;
    grid-template-columns:minmax(0,1.18fr) minmax(112px,.82fr) !important;
    border-radius:18px !important;
  }

  .feature-ref-copy-v67{
    padding:18px 10px 17px 16px !important;
  }

  .feature-ref-kicker-v67{
    font-size:7px !important;
  }

  .feature-ref-copy-v67 h3{
    margin-bottom:8px !important;
    font-size:15px !important;
    line-height:1.15 !important;
  }

  .feature-ref-copy-v67 > p{
    margin-bottom:12px !important;
    font-size:8.7px !important;
    line-height:1.55 !important;
  }

  .feature-ref-checks-v67{
    gap:5px !important;
  }

  .feature-ref-checks-v67 span{
    font-size:7.8px !important;
  }

  .feature-ref-image-v67{
    min-height:238px !important;
    border-radius:40% 0 0 40% / 28% 0 0 28% !important;
  }

  .feature-ref-bubble-v67{
    left:8px !important;
    bottom:10px !important;
    width:34px !important;
    height:34px !important;
    font-size:13px !important;
  }

  /* ---------- PARTNERS: SAME 3 MOVING ROWS AS DESKTOP ---------- */
  .brands-section{
    padding:54px 0 !important;
  }

  .brands-head{
    display:block !important;
    margin-bottom:24px !important;
  }

  .brands-head h2{
    max-width:350px !important;
    margin:5px 0 10px !important;
    font-size:37px !important;
    line-height:.98 !important;
  }

  .brands-head p{
    max-width:350px !important;
    margin:0 !important;
    font-size:10px !important;
    line-height:1.62 !important;
  }

  .partners-marquee{
    width:100% !important;
    margin:0 !important;
    overflow:hidden !important;
  }

  .partners-marquee::before,
  .partners-marquee::after{
    width:18px !important;
  }

  .partner-marquee-row{
    width:100% !important;
    margin-bottom:8px !important;
    overflow:hidden !important;
  }

  .partner-marquee-track{
    display:flex !important;
    width:max-content !important;
    gap:8px !important;
  }

  .partner-marquee-set{
    display:flex !important;
    flex-wrap:nowrap !important;
    width:max-content !important;
    gap:8px !important;
  }

  .partner-marquee-card{
    width:122px !important;
    height:74px !important;
    flex:0 0 122px !important;
    padding:7px 9px !important;
    border-radius:11px !important;
  }

  .partner-marquee-card img{
    max-width:104px !important;
    max-height:56px !important;
  }

  .partner-marquee-row.left .partner-marquee-track{
    animation-duration:32s !important;
  }

  .partner-marquee-row.right .partner-marquee-track{
    animation-duration:35s !important;
  }

  .partner-marquee-row.row-3 .partner-marquee-track{
    animation-duration:30s !important;
  }

  /* ---------- ABOUT: same 4 blocks, stacked cleanly ---------- */
  .about-reference{
    padding:56px 0 64px !important;
  }

  .about-reference-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-areas:
      "photo"
      "intro"
      "stats"
      "network" !important;
    gap:28px !important;
  }

  .about-ref-photo{
    grid-area:photo !important;
    width:100% !important;
    min-height:0 !important;
    padding:0 !important;
    margin:0 !important;
  }

  .about-photo-stage{
    width:100% !important;
    height:min(72vw,320px) !important;
    margin:0 !important;
    border-radius:14px !important;
  }

  .about-ref-badge{
    left:-4px !important;
    top:-8px !important;
    width:70px !important;
    height:70px !important;
  }

  .about-ref-badge strong{
    font-size:21px !important;
  }

  .about-ref-intro{
    grid-area:intro !important;
    max-width:none !important;
  }

  .about-ref-intro h2{
    max-width:360px !important;
    font-size:38px !important;
    line-height:.97 !important;
  }

  .about-ref-intro > p{
    margin:15px 0 20px !important;
    font-size:10px !important;
    line-height:1.65 !important;
  }

  .about-check-item strong{
    font-size:10px !important;
  }

  .about-check-item p{
    font-size:8.5px !important;
  }

  .about-ref-stats{
    grid-area:stats !important;
    padding:0 !important;
  }

  .about-ref-stats h3{
    font-size:32px !important;
  }

  .about-stat-row{
    max-width:none !important;
    gap:8px !important;
  }

  .about-stat-row > div{
    padding:12px 8px !important;
    border:1px solid #e9ecee;
    border-radius:13px;
  }

  .about-ref-network{
    grid-area:network !important;
    width:100% !important;
    max-width:350px !important;
    min-height:275px !important;
    margin:0 auto !important;
    transform:none !important;
  }

  .about-network-center{
    width:76px !important;
    height:76px !important;
  }

  .about-network-node{
    width:86px !important;
    height:68px !important;
  }

  .network-line{
    width:108px !important;
  }

  /* ---------- EXTRA 4 SERVICE BLOCKS ---------- */
  .about-services-extension{
    padding:56px 0 64px !important;
  }

  .about-services-head{
    display:block !important;
    margin-bottom:23px !important;
  }

  .about-services-head h2{
    margin-bottom:11px !important;
    font-size:37px !important;
  }

  .about-services-head > p{
    font-size:10px !important;
  }

  .about-service-grid{
    grid-template-columns:1fr !important;
    gap:13px !important;
  }

  .about-service-card{
    min-height:0 !important;
    grid-template-columns:39% 61% !important;
    border-radius:17px !important;
  }

  .about-service-image{
    min-height:210px !important;
    height:auto !important;
  }

  .about-service-body{
    padding:16px 14px !important;
  }

  .about-service-body h3{
    font-size:16px !important;
  }

  .about-service-body > p{
    font-size:8.3px !important;
  }

  .about-service-body ul{
    gap:5px !important;
    margin-bottom:12px !important;
  }

  .about-service-body li{
    font-size:7.8px !important;
  }

  .about-service-link{
    font-size:8.5px !important;
  }

  /* ---------- WORK PROCESS ---------- */
  .work-process{
    padding:56px 0 64px !important;
  }

  .process-worldmap-bg{
    top:78px !important;
    width:145vw !important;
    height:445px !important;
    opacity:.34 !important;
  }

  .process-heading{
    margin-bottom:28px !important;
  }

  .process-heading h2{
    font-size:37px !important;
  }

  .process-heading p{
    font-size:10px !important;
  }

  .process-progress-shell{
    width:100% !important;
    max-width:none !important;
    padding:8px 0 0 !important;
  }

  .process-progress-bar{
    left:28px !important;
  }

  .process-steps{
    gap:5px !important;
  }

  .process-step{
    min-height:104px !important;
    padding-left:68px !important;
  }

  .process-node{
    left:28px !important;
    width:56px !important;
    height:56px !important;
  }

  .process-copy h3{
    font-size:14.5px !important;
  }

  .process-copy p{
    font-size:8.8px !important;
  }

  .process-status{
    margin:16px 0 0 68px !important;
    max-width:245px !important;
  }

  /* ---------- MAIN LARGE SERVICE CARDS ----------
     Same desktop cards + same mini sliders, one card per row. */
  .projects{
    padding:56px 0 64px !important;
  }

  .construction-scene{
    opacity:.12 !important;
  }

  .nike-card-grid{
    width:100% !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:15px !important;
    overflow:visible !important;
    margin:0 !important;
    padding:0 !important;
  }

  .nike-service-card{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    border-radius:22px !important;
  }

  .nike-card-top{
    width:100% !important;
    min-height:310px !important;
    height:310px !important;
    padding:0 !important;
  }

  .service-photo-slider,
  .service-photo-stage{
    width:100% !important;
    height:310px !important;
    min-height:310px !important;
    padding:0 !important;
    margin:0 !important;
  }

  .service-photo-stage{
    border-radius:21px 21px 0 0 !important;
  }

  .nike-card-info{
    min-height:0 !important;
    padding:16px !important;
  }

  .nike-service-name > strong{
    font-size:16px !important;
  }

  .nike-service-name p{
    font-size:8.5px !important;
  }

  .nike-buy-btn{
    min-height:42px !important;
    font-size:9.5px !important;
  }

  /* ---------- APPLICATION ---------- */
  .application-section{
    padding:56px 0 64px !important;
  }

  .application-heading{
    display:block !important;
    margin-bottom:23px !important;
  }

  .application-heading h2{
    margin-bottom:11px !important;
    font-size:37px !important;
  }

  .application-heading p{
    max-width:none !important;
    font-size:10px !important;
  }

  .application-grid{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }

  .contact-mini-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }

  .contact-info-card{
    min-height:78px !important;
    padding:11px !important;
    border-radius:13px !important;
  }

  .contact-info-card strong{
    font-size:9px !important;
    overflow-wrap:anywhere;
  }

  .map-card{
    border-radius:16px !important;
  }

  .map-card iframe{
    height:210px !important;
  }

  .request-card{
    padding:19px 15px !important;
    border-radius:18px !important;
  }

  .request-card h3{
    font-size:22px !important;
  }

  .request-form input,
  .request-form select{
    height:45px !important;
    font-size:11px !important;
  }

  .request-form textarea{
    min-height:96px !important;
    font-size:11px !important;
  }

  /* ---------- CTA / FOOTER ---------- */
  .cta{
    padding:56px 0 64px !important;
  }

  .cta-inner{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:22px !important;
  }

  .cta h2{
    font-size:37px !important;
  }

  .footer-social-card{
    width:100% !important;
    min-height:0 !important;
    padding:19px 15px !important;
  }

  .footer{
    padding-bottom:0 !important;
  }

  .footer-inner{
    min-height:86px !important;
    padding:15px 0 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:7px !important;
  }

  .footer-real-logo{
    width:88px !important;
    height:40px !important;
  }

  .footer-real-logo img{
    height:36px !important;
    max-width:86px !important;
  }
}

/* ---------- VERY NARROW PHONES ---------- */
@media (max-width:380px){

  .container{
    width:calc(100% - 18px) !important;
  }

  .modern-header-inner{
    width:calc(100% - 12px) !important;
    grid-template-columns:50px 1fr 32px !important;
  }

  .real-main-brand{
    width:47px !important;
  }

  .real-main-brand img{
    height:27px !important;
    max-width:46px !important;
  }

  .mobile-menu-toggle{
    width:31px !important;
    height:31px !important;
  }

  .modern-header-actions{
    grid-template-columns:1fr auto !important;
  }

  .modern-header-actions .site-search{
    grid-column:1 / -1;
  }

  .modern-phone-box{
    display:none !important;
  }

  .theme-toggle{
    display:none !important;
  }

  .modern-header-actions .lang-switch{
    justify-self:end;
  }

  .slider-copy h1{
    font-size:34px !important;
  }

  .visual-card{
    flex-basis:calc(100vw - 50px) !important;
    width:calc(100vw - 50px) !important;
    height:316px !important;
  }

  .visual-placeholder{
    height:239px !important;
  }

  .visual-card-caption{
    height:77px !important;
  }

  .feature-ref-card-v67{
    grid-template-columns:minmax(0,1.1fr) minmax(96px,.9fr) !important;
  }

  .feature-ref-copy-v67{
    padding-left:13px !important;
  }

  .feature-ref-copy-v67 h3{
    font-size:13.5px !important;
  }

  .feature-ref-copy-v67 > p{
    font-size:7.8px !important;
  }

  .feature-ref-checks-v67 span{
    font-size:7px !important;
  }

  .partner-marquee-card{
    width:108px !important;
    height:68px !important;
    flex-basis:108px !important;
  }

  .partner-marquee-card img{
    max-width:91px !important;
    max-height:50px !important;
  }

  .about-ref-intro h2,
  .about-services-head h2,
  .process-heading h2,
  .application-heading h2,
  .cta h2{
    font-size:34px !important;
  }

  .about-service-card{
    grid-template-columns:36% 64% !important;
  }

  .about-service-body{
    padding:13px 12px !important;
  }

  .about-service-body ul{
    display:none !important;
  }

  .contact-mini-grid{
    grid-template-columns:1fr !important;
  }
}

/* ==========================================================
   INNER SERVICE PAGES — RESPONSIVE REBUILD v73
   Same desktop page, simply reflowed.
   ========================================================== */

@media (max-width:768px){

  .engineering-page{
    min-height:100vh;
    padding:0 !important;
    background:#f2f3f2 !important;
  }

  .engineering-shell{
    width:100% !important;
    min-height:100vh !important;
    margin:0 !important;
    overflow:hidden !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
  }

  .engineering-nav{
    position:sticky !important;
    top:0;
    z-index:1000;
    height:auto !important;
    min-height:54px !important;
    padding:6px 10px !important;
    display:grid !important;
    grid-template-columns:58px minmax(0,1fr) auto !important;
    grid-template-areas:
      "logo links lang" !important;
    align-items:center !important;
    gap:6px !important;
    background:rgba(255,255,255,.97) !important;
    border-bottom:1px solid #e7e8e8 !important;
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }

  .engineering-logo{
    grid-area:logo;
    width:54px !important;
    height:38px !important;
    flex-basis:auto !important;
  }

  .engineering-logo img{
    width:auto !important;
    height:30px !important;
    max-width:52px !important;
  }

  .engineering-nav-links{
    grid-area:links;
    min-width:0;
    display:flex !important;
    align-items:center !important;
    gap:3px !important;
    overflow-x:auto !important;
    scrollbar-width:none;
  }

  .engineering-nav-links::-webkit-scrollbar{
    display:none;
  }

  .engineering-nav-links a{
    flex:0 0 auto;
    min-height:30px !important;
    padding:0 7px !important;
    display:flex !important;
    align-items:center !important;
    border-radius:7px !important;
    font-size:8px !important;
    white-space:nowrap;
  }

  .engineering-lang{
    grid-area:lang;
    margin:0 !important;
  }

  .engineering-lang button{
    min-width:23px !important;
    height:26px !important;
    padding:0 3px !important;
    font-size:7px !important;
  }

  .engineering-hero{
    padding:46px 15px 38px !important;
  }

  .engineering-badge{
    font-size:7px !important;
  }

  .engineering-hero h1{
    max-width:390px !important;
    margin-top:14px !important;
    font-size:41px !important;
    line-height:.96 !important;
    letter-spacing:-2.6px !important;
  }

  .engineering-hero p{
    max-width:none !important;
    font-size:10px !important;
    line-height:1.65 !important;
  }

  .engineering-actions{
    gap:7px !important;
  }

  .engineering-actions .btn{
    min-height:41px !important;
    padding:0 14px !important;
    font-size:9px !important;
  }

  .engineering-summary{
    padding:44px 13px !important;
  }

  .engineering-summary-copy h2{
    font-size:33px !important;
  }

  .engineering-summary-copy p{
    font-size:9.5px !important;
  }

  .engineering-summary-grid,
  .hvac-summary-grid,
  .lift-summary-grid,
  .procurement-summary-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:9px !important;
    overflow:visible !important;
    margin:0 !important;
    padding:0 !important;
  }

  .engineering-summary-card{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    min-height:132px !important;
    padding:17px !important;
    border-radius:16px !important;
  }

  .engineering-summary-card strong{
    font-size:14px !important;
  }

  .engineering-summary-card small{
    font-size:8px !important;
  }

  .engineering-detail-grid,
  .hvac-detail-grid,
  .lift-detail-grid,
  .procurement-detail-grid{
    padding:40px 11px !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:11px !important;
  }

  .engineering-detail-card{
    padding:18px 15px !important;
    border-radius:17px !important;
  }

  .engineering-card-no{
    width:40px !important;
    height:40px !important;
  }

  .engineering-card-head h2{
    font-size:19px !important;
  }

  .engineering-card-intro,
  .engineering-detail-card li{
    font-size:9px !important;
  }

  .engineering-cta{
    margin:0 11px 18px !important;
    padding:21px 17px !important;
    border-radius:17px !important;
  }

  .engineering-cta h2{
    font-size:24px !important;
  }

  .engineering-back{
    padding-bottom:22px !important;
  }
}


/* =======================================================
   STANDALONE BRANDS PAGE
   ======================================================= */
.brands-page .engineering-shell{
  max-width:1220px;
}
.brands-page .engineering-nav-links a.active{
  color:#ff6b2c;
}
.brands-page-hero{
  padding:72px 28px 38px;
  text-align:center;
  background:linear-gradient(180deg,#fff 0%,#fafbfc 100%);
}
.brands-page-hero h1{
  margin:17px auto 10px;
  color:#19202b;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:clamp(38px,5vw,64px);
  line-height:1;
  letter-spacing:-2.2px;
}
.brands-page-hero p{
  max-width:700px;
  margin:0 auto;
  color:#7a818d;
  font-size:14px;
  line-height:1.75;
}
.hvac-brand-grid{
  width:min(930px,calc(100% - 56px));
  margin:0 auto;
  padding:14px 0 54px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.hvac-brand-card{
  min-height:190px;
  padding:24px 28px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid #e8eaee;
  border-radius:20px;
  background:#fff;
  box-shadow:0 10px 30px rgba(29,35,48,.045);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.hvac-brand-card:hover{
  transform:translateY(-4px);
  border-color:#f1c8b7;
  box-shadow:0 18px 38px rgba(29,35,48,.09);
}
.hvac-brand-card img{
  width:100%;
  max-width:360px;
  max-height:125px;
  object-fit:contain;
  display:block;
}
.brands-page-back{
  padding-top:0;
}
@media (max-width:768px){
  .brands-page{
    padding:12px 0 28px !important;
  }
  .brands-page .engineering-shell{
    width:calc(100% - 20px) !important;
    border-radius:20px;
  }
  .brands-page .engineering-nav{
    padding:0 14px;
  }
  .brands-page-hero{
    padding:48px 18px 26px;
  }
  .brands-page-hero h1{
    font-size:38px;
    letter-spacing:-1.3px;
  }
  .hvac-brand-grid{
    width:calc(100% - 28px);
    padding:8px 0 36px;
    grid-template-columns:1fr;
    gap:12px;
  }
  .hvac-brand-card{
    min-height:135px;
    padding:17px 20px;
    border-radius:16px;
  }
  .hvac-brand-card img{
    max-width:310px;
    max-height:95px;
  }
}


/* =======================================================
   BRANDS PAGE — FUREY-STYLE LOGO SHOWCASE v2
   Scoped only to brendler.html (.brands-page)
   ======================================================= */
.brands-page .brands-showcase{
  position:relative;
  overflow:hidden;
  margin:0;
  padding:78px 0 86px;
  background:#f4f1eb;
}

.brands-page .brands-showcase::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% -10%,rgba(255,255,255,.82),transparent 42%),
    linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,0));
}

.brands-page .brands-showcase-head{
  position:relative;
  z-index:1;
  width:min(760px,calc(100% - 40px));
  margin:0 auto 48px;
  text-align:center;
}

.brands-page .brands-showcase-kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  padding:5px 11px;
  border:1px solid rgba(201,128,87,.16);
  border-radius:7px;
  background:#f8e9df;
  color:#c7835f;
  font-family:"Manrope",sans-serif;
  font-size:10px;
  font-weight:700;
  letter-spacing:.12em;
}

.brands-page .brands-showcase-head h1{
  max-width:650px;
  margin:17px auto 14px;
  color:#08111d;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:clamp(38px,4.9vw,62px);
  font-weight:700;
  line-height:.94;
  letter-spacing:-2.7px;
}

.brands-page .brands-showcase-head p{
  max-width:620px;
  margin:0 auto;
  color:#7d7d7a;
  font-size:13px;
  line-height:1.7;
}

.brands-page .brands-logo-board{
  position:relative;
  z-index:1;
  width:100%;
}

.brands-page .brands-logo-row{
  width:min(1180px,calc(100% - 44px));
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:12px;
}

.brands-page .brands-logo-row + .brands-logo-row{
  margin-top:14px;
}

.brands-page .brands-logo-row-second{
  width:min(1080px,calc(100% - 84px));
}

.brands-page .brands-logo-card{
  position:relative;
  min-width:0;
  height:106px;
  padding:17px 20px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:1px solid rgba(14,24,36,.055);
  border-radius:3px;
  background:#fff;
  box-shadow:0 7px 17px rgba(28,30,34,.075);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}

.brands-page .brands-logo-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(135deg,rgba(255,255,255,0),rgba(255,255,255,.72));
  transition:opacity .22s ease;
}

.brands-page .brands-logo-card:hover{
  z-index:2;
  transform:translateY(-4px);
  border-color:rgba(255,107,44,.22);
  box-shadow:0 14px 28px rgba(28,30,34,.12);
}

.brands-page .brands-logo-card:hover::after{
  opacity:.55;
}

.brands-page .brands-logo-card img{
  position:relative;
  z-index:1;
  width:100%;
  max-width:150px;
  max-height:67px;
  object-fit:contain;
  display:block;
}

.brands-page .brands-page-back{
  margin:0;
  padding:28px 28px 34px;
  background:#f4f1eb;
}

@media (max-width:980px){
  .brands-page .brands-logo-row,
  .brands-page .brands-logo-row-second{
    width:calc(100% - 34px);
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .brands-page .brands-logo-card{
    height:112px;
  }
}

@media (max-width:640px){
  .brands-page .brands-showcase{
    padding:54px 0 58px;
  }

  .brands-page .brands-showcase-head{
    width:calc(100% - 34px);
    margin-bottom:31px;
  }

  .brands-page .brands-showcase-head h1{
    margin-top:15px;
    font-size:38px;
    line-height:.98;
    letter-spacing:-1.8px;
  }

  .brands-page .brands-showcase-head p{
    font-size:12px;
    line-height:1.65;
  }

  .brands-page .brands-logo-row,
  .brands-page .brands-logo-row-second{
    width:calc(100% - 24px);
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }

  .brands-page .brands-logo-row + .brands-logo-row{
    margin-top:9px;
  }

  .brands-page .brands-logo-card{
    height:95px;
    padding:13px 14px;
  }

  .brands-page .brands-logo-card img{
    max-width:128px;
    max-height:58px;
  }

  .brands-page .brands-page-back{
    padding:22px 18px 28px;
  }
}

/* =======================================================
   BRANDS PAGE — HVAC / FORZA REFERENCE STYLE v3
   Only affects brendler.html
   ======================================================= */
.brands-page .brands-hvac-showcase{
  position:relative;
  isolation:isolate;
  min-height:980px;
  margin:0;
  padding:72px 64px 150px;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(248,249,248,.98) 0%,rgba(248,249,248,.94) 48%,rgba(248,249,248,.76) 74%,rgba(248,249,248,.55) 100%),
    url('assets/service-cards/hvac-1-v2.webp') center 38%/cover no-repeat;
}

.brands-page .brands-hvac-showcase::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:auto -8% -190px -8%;
  height:360px;
  background:rgba(255,255,255,.94);
  transform:rotate(-8deg);
  transform-origin:center;
  box-shadow:0 -20px 45px rgba(10,33,53,.04);
}

.brands-page .brands-hvac-showcase::after{
  content:"";
  position:absolute;
  z-index:-2;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.14));
}

.brands-page .brands-hvac-overlay{
  position:absolute;
  z-index:-1;
  right:-8%;
  bottom:-7%;
  width:48%;
  height:44%;
  border-radius:60% 0 0 0;
  background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,0));
  pointer-events:none;
}

.brands-page .brands-hvac-head{
  position:relative;
  z-index:2;
  width:min(790px,100%);
  margin:0 0 34px;
  text-align:left;
}

.brands-page .brands-hvac-head .brands-showcase-kicker{
  min-height:auto;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:#0d456d;
  font-size:12px;
  font-weight:800;
  letter-spacing:.18em;
}

.brands-page .brands-hvac-head h1{
  max-width:760px;
  margin:13px 0 12px;
  color:#073e67;
  font-family:"Manrope",sans-serif;
  font-size:clamp(34px,4.3vw,58px);
  line-height:1.03;
  letter-spacing:-2.3px;
  font-weight:800;
}

.brands-page .brands-hvac-head p{
  max-width:720px;
  margin:0;
  color:#333d47;
  font-size:16px;
  line-height:1.65;
  font-weight:500;
}

.brands-page .brands-hvac-board{
  position:relative;
  z-index:3;
  width:min(1040px,100%);
  margin-top:26px;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:20px 24px;
}

.brands-page .brands-hvac-board .brands-logo-card{
  height:118px;
  padding:20px 22px;
  border:1px solid rgba(6,51,84,.08);
  border-radius:11px;
  background:rgba(255,255,255,.96);
  box-shadow:0 9px 20px rgba(19,46,67,.15);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}

.brands-page .brands-hvac-board .brands-logo-card::after{display:none;}

.brands-page .brands-hvac-board .brands-logo-card:hover{
  transform:translateY(-5px);
  border-color:rgba(11,87,132,.22);
  box-shadow:0 16px 30px rgba(19,46,67,.20);
}

.brands-page .brands-hvac-board .brands-logo-card img{
  width:100%;
  height:100%;
  max-width:190px;
  max-height:76px;
  object-fit:contain;
  display:block;
}

.brands-page .brands-hvac-board .brands-logo-card.remote-logo img{
  max-width:178px;
  max-height:70px;
}

.brands-page .brands-hvac-board .brands-logo-card span{
  display:none;
  color:#0b3e62;
  font-size:18px;
  font-weight:800;
  text-align:center;
}

.brands-page .brands-more{
  position:relative;
  z-index:3;
  margin-top:34px;
  color:#161d24;
  font-size:23px;
  font-weight:700;
  letter-spacing:-.5px;
}

.brands-page .brands-page-back{
  margin:0;
  padding:26px 64px 34px;
  background:#fff;
}

@media (max-width:1050px){
  .brands-page .brands-hvac-showcase{
    min-height:auto;
    padding:62px 40px 130px;
  }
  .brands-page .brands-hvac-board{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width:760px){
  .brands-page .brands-hvac-showcase{
    padding:48px 22px 110px;
    background:
      linear-gradient(180deg,rgba(248,249,248,.98) 0%,rgba(248,249,248,.93) 60%,rgba(248,249,248,.78) 100%),
      url('assets/service-cards/hvac-3-v2.webp') center bottom/cover no-repeat;
  }
  .brands-page .brands-hvac-head h1{
    font-size:38px;
    letter-spacing:-1.7px;
  }
  .brands-page .brands-hvac-head p{
    font-size:14px;
  }
  .brands-page .brands-hvac-board{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .brands-page .brands-hvac-board .brands-logo-card{
    height:102px;
    padding:16px;
    border-radius:9px;
  }
  .brands-page .brands-hvac-board .brands-logo-card img{
    max-width:145px;
    max-height:62px;
  }
  .brands-page .brands-more{
    margin-top:25px;
    font-size:19px;
  }
  .brands-page .brands-page-back{
    padding:22px 22px 30px;
  }
}

@media (max-width:420px){
  .brands-page .brands-hvac-showcase{
    padding-left:14px;
    padding-right:14px;
  }
  .brands-page .brands-hvac-head h1{
    font-size:33px;
  }
  .brands-page .brands-hvac-board{
    gap:9px;
  }
  .brands-page .brands-hvac-board .brands-logo-card{
    height:92px;
    padding:12px;
  }
  .brands-page .brands-hvac-board .brands-logo-card img{
    max-width:132px;
    max-height:56px;
  }
}

/* =======================================================
   BRANDS PAGE — REFERENCE CARD GRID v4
   Only affects brendler.html
   ======================================================= */
.brands-page{background:#f3f3f2;}
.brands-page .engineering-shell{background:#f3f3f2;}
.brands-page .brand-catalog{
  padding:62px 58px 74px;
  background:#f3f3f2;
}
.brands-page .brand-catalog-head{
  margin:0 0 34px;
}
.brands-page .brand-catalog-head h1{
  margin:0;
  color:#121212;
  font-family:"Manrope",sans-serif;
  font-size:clamp(32px,3.7vw,50px);
  line-height:1.04;
  font-weight:800;
  letter-spacing:-1.7px;
}
.brands-page .brand-title-line{
  display:block;
  width:49px;
  height:3px;
  margin-top:12px;
  border-radius:20px;
  background:#0a68b7;
}
.brands-page .brand-catalog-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:22px 21px;
}
.brands-page .brand-catalog-card{
  min-width:0;
  height:220px;
  display:flex;
  flex-direction:column;
  border:1px solid #dfdfdf;
  background:#fff;
  box-shadow:0 1px 2px rgba(0,0,0,.02);
  overflow:hidden;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.brands-page .brand-catalog-card:hover{
  transform:translateY(-3px);
  border-color:#d0d6dc;
  box-shadow:0 9px 22px rgba(22,36,50,.08);
}
.brands-page .brand-catalog-logo{
  flex:1;
  min-height:0;
  padding:28px 35px 24px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
}
.brands-page .brand-catalog-logo img{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:92px;
  object-fit:contain;
}
.brands-page .brand-catalog-card:nth-child(25) .brand-catalog-logo img{
  max-height:105px;
}
.brands-page .brand-catalog-footer{
  height:58px;
  flex:0 0 58px;
  border-top:1px solid #e5e5e5;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
}
.brands-page .brand-detail-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:94px;
  min-height:31px;
  padding:7px 16px 6px;
  background:#0866b2;
  color:#fff;
  font-size:11px;
  font-weight:800;
  line-height:1;
  letter-spacing:.01em;
  text-transform:uppercase;
}
.brands-page .brand-catalog-card:hover .brand-detail-btn{background:#075794;}
.brands-page .brands-page-back{
  margin:0;
  padding:0 58px 36px;
  background:#f3f3f2;
}
@media(max-width:1100px){
  .brands-page .brand-catalog{padding:54px 36px 64px;}
  .brands-page .brand-catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .brands-page .brands-page-back{padding-left:36px;padding-right:36px;}
}
@media(max-width:760px){
  .brands-page .brand-catalog{padding:42px 18px 52px;}
  .brands-page .brand-catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
  .brands-page .brand-catalog-card{height:174px;}
  .brands-page .brand-catalog-logo{padding:20px 18px 16px;}
  .brands-page .brand-catalog-logo img{max-height:68px;}
  .brands-page .brand-catalog-footer{height:49px;flex-basis:49px;}
  .brands-page .brand-detail-btn{min-width:84px;min-height:28px;font-size:10px;}
  .brands-page .brands-page-back{padding:0 18px 28px;}
}
@media(max-width:390px){
  .brands-page .brand-catalog{padding-left:12px;padding-right:12px;}
  .brands-page .brand-catalog-grid{gap:9px;}
  .brands-page .brand-catalog-card{height:164px;}
  .brands-page .brand-catalog-logo{padding:17px 13px 13px;}
}


/* =======================================================
   BRANDS PAGE — WIDE LOGO CARDS v5
   Reference: wide rounded outline cards / large logos
   Scoped only to brendler.html
   ======================================================= */
.brands-page{
  background:#f8f8f6;
}
.brands-page .engineering-shell{
  background:#f8f8f6;
}
.brands-page .brand-catalog{
  max-width:1180px;
  margin:0 auto;
  padding:62px 46px 82px;
  background:#f8f8f6;
}
.brands-page .brand-catalog-head{
  max-width:760px;
  margin:0 auto 44px;
  text-align:center;
}
.brands-page .brand-catalog-kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:6px 13px;
  margin-bottom:14px;
  border-radius:999px;
  background:#eef3f8;
  color:#0b5d9c;
  font-size:10px;
  line-height:1;
  font-weight:800;
  letter-spacing:.12em;
}
.brands-page .brand-catalog-head h1{
  margin:0;
  color:#111;
  font-family:"Manrope",sans-serif;
  font-size:clamp(38px,4.2vw,58px);
  line-height:1;
  font-weight:800;
  letter-spacing:-2.4px;
}
.brands-page .brand-catalog-head p{
  max-width:690px;
  margin:17px auto 0;
  color:#4f5255;
  font-size:15px;
  line-height:1.65;
}
.brands-page .brand-title-line{display:none;}
.brands-page .brand-catalog-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px 24px;
}
.brands-page .brand-catalog-card{
  min-width:0;
  height:138px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:2px solid #1a1a1a;
  border-radius:22px;
  background:#fff;
  box-shadow:none;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.brands-page .brand-catalog-card:hover{
  transform:translateY(-4px);
  border-color:#0b63a5;
  box-shadow:0 12px 30px rgba(18,35,52,.10);
}
.brands-page .brand-catalog-logo{
  width:100%;
  height:100%;
  flex:none;
  min-height:0;
  padding:20px 24px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
}
.brands-page .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(25) .brand-catalog-logo img{
  display:block;
  width:auto;
  height:auto;
  max-width:94%;
  max-height:88px;
  object-fit:contain;
  object-position:center;
  filter:none;
}
/* Give naturally wide wordmarks more visual width */
.brands-page .brand-catalog-card:nth-child(5) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(6) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(7) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(8) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(9) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(10) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(12) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(13) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(14) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(15) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(16) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(27) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(28) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(29) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(30) .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(31) .brand-catalog-logo img{
  max-width:96%;
  max-height:94px;
}
.brands-page .brand-catalog-footer,
.brands-page .brand-detail-btn{
  display:none !important;
}
.brands-page .brands-page-back{
  max-width:1180px;
  margin:0 auto;
  padding:0 46px 36px;
  background:#f8f8f6;
}

@media(max-width:920px){
  .brands-page .brand-catalog{
    padding:52px 28px 68px;
  }
  .brands-page .brand-catalog-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px;
  }
  .brands-page .brand-catalog-card{
    height:126px;
    border-radius:19px;
  }
  .brands-page .brand-catalog-logo{
    padding:18px 20px;
  }
  .brands-page .brand-catalog-logo img,
  .brands-page .brand-catalog-card:nth-child(25) .brand-catalog-logo img{
    max-width:95%;
    max-height:80px;
  }
  .brands-page .brands-page-back{
    padding-left:28px;
    padding-right:28px;
  }
}

@media(max-width:560px){
  .brands-page .brand-catalog{
    padding:40px 14px 52px;
  }
  .brands-page .brand-catalog-head{
    margin-bottom:30px;
  }
  .brands-page .brand-catalog-head h1{
    font-size:36px;
    letter-spacing:-1.7px;
  }
  .brands-page .brand-catalog-head p{
    margin-top:12px;
    font-size:13px;
  }
  .brands-page .brand-catalog-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px 10px;
  }
  .brands-page .brand-catalog-card{
    height:105px;
    border-width:1.5px;
    border-radius:15px;
  }
  .brands-page .brand-catalog-logo{
    padding:14px 12px;
  }
  .brands-page .brand-catalog-logo img,
  .brands-page .brand-catalog-card:nth-child(25) .brand-catalog-logo img{
    max-width:98%;
    max-height:68px;
  }
  .brands-page .brands-page-back{
    padding:0 14px 28px;
  }
}

@media(max-width:360px){
  .brands-page .brand-catalog-grid{
    grid-template-columns:1fr;
  }
  .brands-page .brand-catalog-card{
    height:112px;
  }
}


/* =======================================================
   BRANDS PAGE — PREMIUM RGB PARTNERS GRID v6
   Reference-inspired hero + rounded wide logo cards.
   Scoped only to brendler.html
   ======================================================= */
.brands-page{
  --brands-bg:#f6f4ef;
  --brands-grid-bg:#f1f4fa;
  --brands-ink:#08111f;
  --brands-muted:#858b92;
  background:var(--brands-bg);
}
.brands-page .engineering-shell{
  width:min(1540px,calc(100% - 30px));
  background:var(--brands-bg);
}
.brands-page .brand-catalog{
  width:100%;
  max-width:none;
  margin:0;
  padding:64px 34px 78px;
  background:
    radial-gradient(circle at 50% -10%,rgba(255,255,255,.95),transparent 42%),
    var(--brands-bg);
}
.brands-page .brand-catalog-head{
  max-width:900px;
  margin:0 auto 58px;
  text-align:center;
}
.brands-page .brand-catalog-kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:8px 15px 7px;
  margin-bottom:22px;
  border:1px solid #efd0bd;
  border-radius:10px;
  background:#fbefe7;
  color:#ce7655;
  font-size:12px;
  line-height:1;
  font-weight:800;
  letter-spacing:.11em;
}
.brands-page .brand-catalog-head h1{
  margin:0;
  color:var(--brands-ink);
  font-family:"Manrope",sans-serif;
  font-size:clamp(48px,5.35vw,82px);
  line-height:.91;
  font-weight:800;
  letter-spacing:-.06em;
}
.brands-page .brand-catalog-head p{
  max-width:760px;
  margin:24px auto 0;
  color:#8d8a85;
  font-size:16px;
  line-height:1.7;
}
.brands-page .brand-title-line{display:none;}
.brands-page .brand-catalog-grid{
  width:calc(100% + 68px);
  margin-left:-34px;
  padding:48px 54px 54px;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:18px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.18),transparent 65%),
    var(--brands-grid-bg);
  border-top:1px solid #e6eaf1;
  border-bottom:1px solid #e6eaf1;
}
.brands-page .brand-catalog-card{
  position:relative;
  min-width:0;
  height:168px;
  padding:2px;
  display:block;
  overflow:hidden;
  border:0;
  border-radius:20px;
  background:transparent;
  box-shadow:0 8px 22px rgba(21,31,48,.035);
  isolation:isolate;
  transform:translateY(10px);
  opacity:0;
  animation:brandCardIn .58s cubic-bezier(.22,.75,.22,1) forwards;
  animation-delay:calc(var(--i) * 26ms);
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease;
}
.brands-page .brand-rgb-ring{
  position:absolute;
  z-index:-2;
  inset:-95%;
  background:conic-gradient(
    from 0deg,
    #00eaff 0deg,
    #2668ff 62deg,
    #9f32ff 122deg,
    #ff2e87 185deg,
    #ff8d00 246deg,
    #b7f400 305deg,
    #00eaff 360deg
  );
  animation:brandRgbSpin 5.8s linear infinite;
  opacity:.92;
  filter:saturate(1.15);
}
.brands-page .brand-catalog-card::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:2px;
  border-radius:18px;
  background:#fff;
}
.brands-page .brand-card-inner{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:19px 18px 15px;
  border-radius:18px;
  background:linear-gradient(180deg,#fff 0%,#fff 74%,#fcfcfd 100%);
}
.brands-page .brand-catalog-logo{
  width:100%;
  height:98px;
  flex:0 0 98px;
  padding:0 10px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:transparent;
}
.brands-page .brand-catalog-logo img,
.brands-page .brand-catalog-card:nth-child(25) .brand-catalog-logo img{
  display:block;
  width:auto;
  height:auto;
  max-width:94%;
  max-height:84px;
  object-fit:contain;
  object-position:center;
  filter:none;
  transform:scale(1);
  transition:transform .35s cubic-bezier(.2,.8,.2,1),filter .35s ease;
}
.brands-page .brand-card-name{
  display:block;
  width:100%;
  margin-top:8px;
  color:#182234;
  font-size:14px;
  line-height:1.15;
  font-weight:800;
  text-align:center;
  letter-spacing:-.02em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.brands-page .brand-catalog-card:hover{
  transform:translateY(-6px) scale(1.012);
  box-shadow:0 18px 38px rgba(21,31,48,.12);
}
.brands-page .brand-catalog-card:hover .brand-catalog-logo img{
  transform:scale(1.055);
}
.brands-page .brand-catalog-card:hover .brand-rgb-ring{
  animation-duration:2.5s;
}
.brands-page .brand-catalog-note{
  margin:22px 0 0;
  color:#9aa1ad;
  font-size:11px;
  text-align:center;
}
.brands-page .brand-catalog-footer,
.brands-page .brand-detail-btn{display:none!important;}
.brands-page .brands-page-back{
  max-width:none;
  margin:0;
  padding:0 34px 38px;
  background:var(--brands-bg);
}

@keyframes brandRgbSpin{to{transform:rotate(1turn)}}
@keyframes brandCardIn{to{transform:translateY(0);opacity:1}}

@media(max-width:1250px){
  .brands-page .brand-catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
}
@media(max-width:980px){
  .brands-page .brand-catalog{padding:52px 24px 66px;}
  .brands-page .brand-catalog-head{margin-bottom:42px;}
  .brands-page .brand-catalog-grid{
    width:calc(100% + 48px);
    margin-left:-24px;
    padding:34px 26px 40px;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:15px;
  }
  .brands-page .brand-catalog-card{height:154px;border-radius:18px;}
  .brands-page .brand-catalog-card::before,.brands-page .brand-card-inner{border-radius:16px;}
  .brands-page .brand-catalog-logo{height:90px;flex-basis:90px;}
  .brands-page .brand-catalog-logo img,
  .brands-page .brand-catalog-card:nth-child(25) .brand-catalog-logo img{max-height:76px;}
  .brands-page .brands-page-back{padding-left:24px;padding-right:24px;}
}
@media(max-width:680px){
  .brands-page .engineering-shell{width:calc(100% - 14px);border-radius:20px;}
  .brands-page .brand-catalog{padding:38px 12px 48px;}
  .brands-page .brand-catalog-head{margin-bottom:30px;}
  .brands-page .brand-catalog-kicker{min-height:29px;margin-bottom:15px;font-size:10px;border-radius:8px;}
  .brands-page .brand-catalog-head h1{font-size:clamp(34px,11vw,48px);line-height:.95;letter-spacing:-.05em;}
  .brands-page .brand-catalog-head p{margin-top:15px;font-size:12px;line-height:1.6;}
  .brands-page .brand-catalog-grid{
    width:calc(100% + 24px);
    margin-left:-12px;
    padding:22px 11px 28px;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
  .brands-page .brand-catalog-card{height:124px;border-radius:15px;padding:1.5px;}
  .brands-page .brand-catalog-card::before{inset:1.5px;border-radius:13.5px;}
  .brands-page .brand-card-inner{padding:11px 9px 9px;border-radius:13.5px;}
  .brands-page .brand-catalog-logo{height:75px;flex-basis:75px;padding:0 5px;}
  .brands-page .brand-catalog-logo img,
  .brands-page .brand-catalog-card:nth-child(25) .brand-catalog-logo img{max-width:98%;max-height:64px;}
  .brands-page .brand-card-name{margin-top:4px;font-size:11px;}
  .brands-page .brand-catalog-note{font-size:10px;}
  .brands-page .brands-page-back{padding:0 12px 26px;}
}
@media(prefers-reduced-motion:reduce){
  .brands-page .brand-rgb-ring{animation:none;}
  .brands-page .brand-catalog-card{animation:none;opacity:1;transform:none;transition:none;}
  .brands-page .brand-catalog-logo img{transition:none;}
}



/* ==========================================================
   2026 — CLEAN WHITE HEADER + ORANGE HOVER / 24-7 SERVICE
   Homepage only. Leaves other service pages untouched.
   ========================================================== */
.homepage-simple-header .simple-navbar{
  position:sticky !important;
  top:0 !important;
  z-index:2500 !important;
  display:block !important;
  padding:0 !important;
  background:rgba(255,255,255,.985) !important;
  border:0 !important;
  border-bottom:1px solid #eff0f2 !important;
  box-shadow:0 3px 18px rgba(17,29,45,.035) !important;
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px);
}
.homepage-simple-header .simple-navbar .modern-header-inner{
  width:min(1360px,calc(100% - 64px)) !important;
  min-height:82px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:32px !important;
  margin:0 auto !important;
}
.homepage-simple-header .simple-navbar .real-main-brand{
  display:flex !important;
  flex:0 0 134px !important;
  width:134px !important;
  height:auto !important;
  align-items:center !important;
  padding:0 !important;
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
}
.homepage-simple-header .simple-navbar .real-main-brand img{
  width:118px !important;
  height:auto !important;
  max-width:118px !important;
  max-height:60px !important;
  filter:brightness(0) saturate(100%) invert(13%) sepia(20%) saturate(1259%) hue-rotate(173deg) brightness(94%) contrast(92%) !important;
  object-fit:contain !important;
}
.homepage-simple-header .simple-navbar .modern-nav{
  flex:1 1 auto !important;
  min-width:0 !important;
  width:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:clamp(11px,1.55vw,25px) !important;
  overflow:visible !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.homepage-simple-header .simple-navbar .modern-nav > a:not(.mobile-cta-link){
  position:relative;
  display:inline-flex !important;
  min-height:48px !important;
  margin:0 !important;
  padding:0 !important;
  flex:0 0 auto;
  align-items:center !important;
  justify-content:center !important;
  color:#2a3040 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  font-family:'Manrope',sans-serif !important;
  font-size:13px !important;
  font-weight:700 !important;
  letter-spacing:-.018em !important;
  line-height:1.4 !important;
  white-space:nowrap !important;
  transform:none !important;
  transition:color .24s ease, transform .24s cubic-bezier(.2,.75,.25,1) !important;
}
.homepage-simple-header .simple-navbar .modern-nav > a:not(.mobile-cta-link)::after{
  content:'';
  position:absolute;
  left:0;
  bottom:8px;
  width:100%;
  height:2px;
  border-radius:3px;
  background:#ff6a20;
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .28s cubic-bezier(.22,.75,.2,1);
}
.homepage-simple-header .simple-navbar .modern-nav > a:not(.mobile-cta-link):hover,
.homepage-simple-header .simple-navbar .modern-nav > a:not(.mobile-cta-link):focus-visible{
  color:#f46a20 !important;
  transform:translateY(-2px) !important;
}
.homepage-simple-header .simple-navbar .modern-nav > a:not(.mobile-cta-link):hover::after,
.homepage-simple-header .simple-navbar .modern-nav > a:not(.mobile-cta-link):focus-visible::after{
  transform:scaleX(1);
}
.homepage-simple-header .simple-navbar .modern-header-actions{
  width:auto !important;
  min-width:0 !important;
  flex:0 0 auto !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:12px !important;
  border:0 !important;
  background:none !important;
}
.homepage-simple-header .simple-navbar .lang-switch{
  min-height:32px !important;
  padding:3px !important;
  display:flex !important;
  gap:0 !important;
  border:1px solid #f0f0f0 !important;
  border-radius:9px !important;
  background:#fafafa !important;
  box-shadow:none !important;
}
.homepage-simple-header .simple-navbar .lang-switch button{
  min-width:30px !important;
  height:27px !important;
  padding:0 5px !important;
  font-size:10px !important;
  color:#6f7782 !important;
  border-radius:6px !important;
}
.homepage-simple-header .simple-navbar .lang-switch button.active{
  background:#fff0e5 !important;
  color:#e86116 !important;
  box-shadow:none !important;
}
.homepage-simple-header .simple-navbar .lang-switch button:hover{
  color:#e86116 !important;
}
.homepage-simple-header .simple-header-cta{
  min-height:42px;
  padding:0 20px;
  display:inline-flex;
  align-items:center;
  gap:12px;
  border-radius:999px;
  background:#ff741b;
  box-shadow:0 5px 16px rgba(255,110,33,.17);
  color:#fff !important;
  font-family:'Manrope',sans-serif;
  font-weight:800;
  font-size:12px;
  white-space:nowrap;
  transition:background .25s ease, box-shadow .25s ease, transform .25s ease;
}
.homepage-simple-header .simple-header-cta:hover{
  background:#ef5d11;
  transform:translateY(-2px);
  box-shadow:0 9px 23px rgba(255,110,33,.3);
}
.homepage-simple-header .simple-header-cta span{font-size:17px;font-weight:400;line-height:1;transition:transform .25s ease;}
.homepage-simple-header .simple-header-cta:hover span{transform:translate(2px,-2px);}
.homepage-simple-header .simple-navbar .mobile-menu-toggle,
.homepage-simple-header .simple-navbar .mobile-cta-link{display:none !important;}

/* Custom map replacement — based on the photo sent by the client. */
.homepage-simple-header .service-247{
  position:relative;
  min-height:332px;
  display:grid;
  grid-template-columns:1fr minmax(38%,.85fr);
  overflow:hidden;
  border:1px solid #f2e8dc;
  border-radius:22px;
  background:linear-gradient(120deg,#fff 5%,#fff9f1 68%,#fff 100%);
  box-shadow:0 12px 34px rgba(26,34,43,.05);
  isolation:isolate;
}
.homepage-simple-header .service-247::before{
  content:'';
  position:absolute;
  z-index:-1;
  width:240px;
  height:240px;
  left:-105px;
  bottom:-145px;
  border:50px solid rgba(255,174,72,.09);
  border-radius:50%;
}
.homepage-simple-header .service-247-content{
  position:relative;
  z-index:2;
  padding:27px 0 28px 28px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
}
.homepage-simple-header .service-247-eyebrow{
  display:flex;
  align-items:center;
  gap:7px;
  margin-bottom:11px;
  color:#e76618;
  font-size:9px;
  font-weight:800;
  letter-spacing:.09em;
}
.homepage-simple-header .service-247-live{
  width:8px;height:8px;border-radius:50%;background:#ff7920;
  box-shadow:0 0 0 4px rgba(255,121,32,.12);
  animation:serviceLive 2s ease-in-out infinite;
}
@keyframes serviceLive{50%{box-shadow:0 0 0 8px rgba(255,121,32,0)}}
.homepage-simple-header .service-247 h3{
  margin:0;
  color:#1f2b36;
  font-family:'Manrope',sans-serif;
  font-size:clamp(20px,2.2vw,30px);
  line-height:1.17;
  letter-spacing:-.06em;
  font-weight:800;
}
.homepage-simple-header .service-247 h3 span{color:#f57418;}
.homepage-simple-header .service-247 p{
  max-width:265px;
  margin:13px 0 17px;
  color:#626b75;
  font-size:11.5px;
  line-height:1.7;
}
.homepage-simple-header .service-247-points{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:22px;
}
.homepage-simple-header .service-247-points > div{
  display:flex;
  gap:7px;
  align-items:center;
}
.homepage-simple-header .service-247-point-icon{
  width:29px;
  height:29px;
  flex:0 0 29px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#fff0e4;
  color:#f57418;
  font-size:14px;
  font-weight:800;
}
.homepage-simple-header .service-247-points strong,
.homepage-simple-header .service-247-points small{display:block;line-height:1.4;}
.homepage-simple-header .service-247-points strong{color:#2b3440;font-size:10px;font-weight:800;}
.homepage-simple-header .service-247-points small{color:#737c86;font-size:9px;}
.homepage-simple-header .service-247-link{
  display:inline-flex;
  align-items:center;
  gap:9px;
  border-radius:9px;
  padding:11px 15px;
  background:#ff741b;
  color:#fff;
  font-size:11px;
  line-height:1;
  font-weight:800;
  transition:transform .25s ease,background .25s ease;
}
.homepage-simple-header .service-247-link:hover{transform:translateY(-2px);background:#e96612;}
.homepage-simple-header .service-247-visual{
  position:relative;
  min-width:0;
  overflow:hidden;
  display:flex;
  justify-content:center;
  align-items:flex-end;
}
.homepage-simple-header .service-247-visual::before{
  content:'';
  position:absolute;
  z-index:0;
  width:270px;
  height:270px;
  right:-80px;
  top:25px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,182,69,.24),rgba(255,182,69,0) 70%);
}
.homepage-simple-header .service-247-visual img{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 30%;
  mix-blend-mode:multiply;
  transition:transform .6s cubic-bezier(.22,.7,.25,1);
}
.homepage-simple-header .service-247:hover .service-247-visual img{transform:scale(1.045);}
@media(max-width:1280px){
  .homepage-simple-header .simple-navbar .modern-header-inner{width:calc(100% - 40px) !important;gap:18px !important;}
  .homepage-simple-header .simple-navbar .modern-nav{gap:12px !important;}
  .homepage-simple-header .simple-navbar .modern-nav > a:not(.mobile-cta-link){font-size:11.5px !important;}
  .homepage-simple-header .simple-navbar .real-main-brand{flex-basis:120px !important;}
  .homepage-simple-header .simple-navbar .real-main-brand img{width:110px !important;}
}
@media(max-width:1120px){
  .homepage-simple-header .simple-navbar .modern-header-inner{
    position:relative;
    width:calc(100% - 38px) !important;
    min-height:66px !important;
    display:grid !important;
    grid-template-columns:auto 1fr auto !important;
    grid-template-areas:'brand actions toggle' !important;
    column-gap:13px !important;
    row-gap:0 !important;
  }
  .homepage-simple-header .simple-navbar .real-main-brand{
    grid-area:brand;
    width:106px !important;
    flex-basis:auto !important;
    height:auto !important;
  }
  .homepage-simple-header .simple-navbar .real-main-brand img{width:102px !important;max-width:102px !important;height:auto !important;}
  .homepage-simple-header .simple-navbar .modern-header-actions{
    grid-area:actions;
    display:flex !important;
    justify-self:end !important;
    width:auto !important;
    margin:0 !important;
  }
  .homepage-simple-header .simple-header-cta{display:none !important;}
  .homepage-simple-header .simple-navbar .mobile-menu-toggle{
    grid-area:toggle;
    display:grid !important;
    place-items:center;
    width:39px !important;
    height:39px !important;
    padding:0 !important;
    border:1px solid #e6e7e9;
    border-radius:10px;
    background:#fff;
    color:#232b37;
    font-size:19px;
    line-height:1;
    box-shadow:none;
  }
  .homepage-simple-header .simple-navbar .modern-nav{
    position:absolute;
    top:calc(100% - 1px);
    right:0;
    left:0;
    z-index:5;
    grid-area:auto;
    width:100% !important;
    padding:10px !important;
    margin:0 !important;
    display:none !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:4px !important;
    background:#fff !important;
    border:1px solid #f0f0f0 !important;
    border-radius:14px !important;
    box-shadow:0 18px 34px rgba(15,23,42,.11) !important;
  }
  .homepage-simple-header .simple-navbar.mobile-menu-open .modern-nav{display:grid !important;}
  .homepage-simple-header .simple-navbar .modern-nav > a:not(.mobile-cta-link){
    width:100%;
    min-height:44px !important;
    padding:0 12px !important;
    justify-content:flex-start !important;
    font-size:13px !important;
    border-radius:8px !important;
  }
  .homepage-simple-header .simple-navbar .modern-nav > a:not(.mobile-cta-link)::after{display:none;}
  .homepage-simple-header .simple-navbar .modern-nav > a:not(.mobile-cta-link):hover{
    background:#fff4eb !important;
    transform:none !important;
  }
  .homepage-simple-header .simple-navbar .mobile-cta-link{
    display:flex !important;
    min-height:44px;
    padding:0 14px;
    align-items:center;
    justify-content:space-between;
    border-radius:8px;
    background:#ff741b !important;
    color:#fff !important;
    font-size:13px !important;
    font-weight:800;
    grid-column:1/-1;
  }
  .homepage-simple-header .simple-navbar .modern-header-actions .lang-switch button{
    font-size:10px !important;
    min-width:29px !important;
    height:27px !important;
  }
}
@media(max-width:670px){
  .homepage-simple-header .service-247{grid-template-columns:minmax(0,1fr) minmax(0,.82fr);min-height:345px;}
  .homepage-simple-header .service-247-content{padding:22px 0 21px 20px;}
  .homepage-simple-header .service-247 h3{font-size:23px;}
  .homepage-simple-header .service-247 p{font-size:10.5px;}
  .homepage-simple-header .service-247-points{gap:9px;}
}
@media(max-width:430px){
  .homepage-simple-header .simple-navbar .modern-header-inner{width:calc(100% - 26px) !important;min-height:64px !important;column-gap:9px !important;}
  .homepage-simple-header .simple-navbar .real-main-brand img{width:94px !important;max-width:94px !important;}
  .homepage-simple-header .simple-navbar .mobile-menu-toggle{width:36px !important;height:36px !important;}
  .homepage-simple-header .service-247{
    grid-template-columns:1fr;
    min-height:0;
  }
  .homepage-simple-header .service-247-content{padding:25px 24px 0;}
  .homepage-simple-header .service-247 h3{font-size:clamp(25px,8vw,31px);}
  .homepage-simple-header .service-247 p{max-width:100%;font-size:12px;}
  .homepage-simple-header .service-247-points{gap:16px;}
  .homepage-simple-header .service-247-visual{height:240px;}
  .homepage-simple-header .service-247-visual img{object-fit:contain;object-position:center bottom;}
}
@media(prefers-reduced-motion:reduce){
  .homepage-simple-header .simple-navbar a,
  .homepage-simple-header .simple-navbar a::after,
  .homepage-simple-header .service-247-visual img{transition:none !important;}
  .homepage-simple-header .service-247-live{animation:none !important;}
}



/* === GLOBAL FONT + CUSTOM LOGO LAYOUT OVERRIDES START === */
html body,
html body button,
html body input,
html body textarea,
html body select,
html body a,
html body p,
html body span,
html body strong,
html body small,
html body li,
html body label,
html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6 {
  font-family:"Manrope",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
}

html body h1,
html body h2,
html body h3,
html body .btn,
html body .main-nav a,
html body .engineering-nav-links a,
html body .mobile-menu a {
  letter-spacing:-0.03em;
}

.brands-section,
.custom-brand-catalog {
  background:#f8f7f4;
}

.logo-layout-head,
.custom-brand-head {
  align-items:end;
}

.logo-row-group {
  margin-top:34px;
  padding:28px;
  border-radius:28px;
  background:#ffffff;
  border:1px solid rgba(15,39,66,.08);
  box-shadow:0 18px 40px rgba(15,39,66,.06);
}

.logo-row-group-lift {
  margin-top:24px;
}

.logo-row-heading {
  display:flex;
  flex-wrap:wrap;
  align-items:end;
  justify-content:space-between;
  gap:12px 20px;
  margin-bottom:18px;
}

.logo-row-kicker {
  display:block;
  color:#f5821f;
  font-size:12px;
  font-weight:800;
  letter-spacing:.14em;
}

.logo-row-heading h3 {
  margin:8px 0 0;
  font-size:clamp(24px,2.4vw,34px);
  line-height:1.02;
  color:#1e293b;
}

.logo-strip {
  display:flex;
  flex-wrap:nowrap;
  gap:18px;
  overflow-x:auto;
  padding:8px 4px 10px;
  scrollbar-width:thin;
  scrollbar-color:#f5821f rgba(15,39,66,.08);
}

.logo-strip::-webkit-scrollbar {
  height:8px;
}
.logo-strip::-webkit-scrollbar-thumb {
  background:#f5821f;
  border-radius:999px;
}
.logo-strip::-webkit-scrollbar-track {
  background:rgba(15,39,66,.08);
  border-radius:999px;
}

.logo-strip-card {
  flex:0 0 200px;
  min-width:200px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:14px;
  min-height:152px;
  padding:18px 16px;
  border-radius:22px;
  background:linear-gradient(180deg,#ffffff 0%,#fbfbfb 100%);
  border:1px solid rgba(15,39,66,.08);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.logo-strip-card:hover {
  transform:translateY(-4px);
  border-color:rgba(245,130,31,.28);
  box-shadow:0 16px 28px rgba(15,39,66,.08);
}

.logo-strip-media {
  height:72px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.logo-strip-media img {
  width:auto;
  max-width:100%;
  max-height:68px;
  object-fit:contain;
  mix-blend-mode:multiply;
}

.logo-strip-title {
  display:block;
  text-align:center;
  color:#243142;
  font-size:14px;
  font-weight:800;
  line-height:1.3;
}

.logo-strip-lift .logo-strip-card {
  flex-basis:215px;
  min-width:215px;
}

@media (max-width: 767px) {
  .logo-row-group {
    padding:20px;
    border-radius:22px;
  }
  .logo-strip-card,
  .logo-strip-lift .logo-strip-card {
    flex-basis:165px;
    min-width:165px;
    min-height:138px;
    padding:16px 12px;
  }
  .logo-strip-media {
    height:62px;
  }
  .logo-strip-media img {
    max-height:58px;
  }
  .logo-strip-title {
    font-size:13px;
  }
}
/* === GLOBAL FONT + CUSTOM LOGO LAYOUT OVERRIDES END === */


/* === REQUESTED NAV + LICENSE PAGE + CARD TITLE OVERRIDES START === */
/* Header/logo cleanup */
.homepage-simple-header .simple-navbar .modern-header-inner {
  min-height:72px !important;
  align-items:center !important;
}
.homepage-simple-header .simple-navbar .real-main-brand {
  flex-basis:154px !important;
  width:154px !important;
  align-self:center !important;
}
.homepage-simple-header .simple-navbar .real-main-brand img {
  width:138px !important;
  max-width:138px !important;
  max-height:72px !important;
}

/* Heading style refresh */
.section-kicker,
.brand-catalog-kicker,
.feature-ref-kicker-v67,
.engineering-badge,
.license-card-kicker {
  color:#f26a21 !important;
  font-weight:800 !important;
  letter-spacing:.12em !important;
}

.slider-copy h1,
.about-ref-intro h2,
.about-services-head h2,
.section-head h2,
.brands-head h2,
.custom-brand-head h1,
.engineering-hero h1,
.licenses-hero h1,
.licenses-head h2 {
  font-weight:800 !important;
  line-height:1.02 !important;
  letter-spacing:-.04em !important;
  color:#1f2937 !important;
}

.slider-copy h1 span,
.about-ref-intro h2 span,
.about-services-head h2 span,
.section-head h2 span,
.brands-head h2 span,
.custom-brand-head h1 span,
.engineering-hero h1 span,
.licenses-hero h1 span,
.licenses-head h2 span {
  color:#f26a21 !important;
}

.about-services-head h2::after,
.section-head h2::after,
.brands-head h2::after,
.custom-brand-head h1::after,
.licenses-head h2::after {
  content:'';
  display:block;
  width:74px;
  height:4px;
  margin-top:14px;
  border-radius:999px;
  background:#f26a21;
}

/* Remove numeric labels on requested cards */
.about-service-no,
.nike-service-name small {
  display:none !important;
}

.about-service-body h3,
.nike-service-name strong,
.feature-ref-copy-v67 h3 {
  font-weight:800 !important;
}

/* Engineering/subpage nav logo clarity */
.engineering-logo img {
  width:126px !important;
  max-width:126px !important;
  height:auto !important;
}

/* Nav spacing for new link */
.engineering-nav-links,
.homepage-simple-header .simple-navbar .modern-nav {
  gap:clamp(10px,1.3vw,20px) !important;
}

/* Licenses page */
.licenses-page {
  background:linear-gradient(180deg,#f5f5f3 0%,#fbfbfa 100%);
}
.licenses-hero {
  position:relative;
  overflow:hidden;
  padding:54px 42px;
  border-radius:34px;
  background:linear-gradient(135deg,#f9f7f3 0%,#fefefe 100%);
  border:1px solid rgba(31,41,55,.08);
  box-shadow:0 18px 46px rgba(17,24,39,.06);
  margin-top:18px;
  isolation:isolate;
}
.licenses-map-bg {
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(255,255,255,.72),rgba(255,255,255,.86)), url('assets/backgrounds/world-map-orange.png');
  background-repeat:no-repeat;
  background-position:right center;
  background-size:contain;
  opacity:.95;
  pointer-events:none;
}
.licenses-hero-copy {
  position:relative;
  z-index:1;
  max-width:680px;
}
.licenses-hero-copy p {
  margin-top:18px;
  max-width:620px;
  color:#56606f;
  font-size:16px;
  line-height:1.8;
}
.licenses-hero-meta {
  margin-top:28px;
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
.licenses-meta-item {
  min-width:150px;
  padding:16px 18px;
  border-radius:18px;
  background:rgba(255,255,255,.84);
  border:1px solid rgba(31,41,55,.08);
  box-shadow:0 8px 20px rgba(17,24,39,.04);
}
.licenses-meta-item strong {
  display:block;
  font-size:20px;
  color:#1f2937;
}
.licenses-meta-item span {
  display:block;
  margin-top:4px;
  font-size:13px;
  font-weight:700;
  color:#6b7280;
}
.licenses-grid-section {
  margin-top:34px;
}
.licenses-head {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,420px);
  gap:24px;
  align-items:end;
}
.licenses-head p {
  color:#6b7280;
  line-height:1.8;
}
.licenses-grid {
  margin-top:24px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
}
.license-card {
  overflow:hidden;
  border-radius:28px;
  background:#fff;
  border:1px solid rgba(31,41,55,.08);
  box-shadow:0 18px 42px rgba(17,24,39,.05);
}
.license-card-image {
  padding:20px;
  background:linear-gradient(180deg,#fbfbfb 0%,#f6f6f4 100%);
}
.license-card-image img {
  width:100%;
  display:block;
  border-radius:20px;
  box-shadow:0 10px 24px rgba(17,24,39,.06);
}
.license-card-body {
  padding:0 22px 24px;
}
.license-card-body h3 {
  margin:8px 0 10px;
  font-size:28px;
  line-height:1.08;
  color:#1f2937;
}
.license-card-body p {
  color:#697180;
  line-height:1.75;
}
.license-card-wide {
  grid-column:1 / -1;
}

@media (max-width: 980px) {
  .licenses-head,
  .licenses-grid {
    grid-template-columns:1fr;
  }
}
@media (max-width: 767px) {
  .homepage-simple-header .simple-navbar .modern-header-inner {
    min-height:66px !important;
  }
  .homepage-simple-header .simple-navbar .real-main-brand img {
    width:110px !important;
    max-width:110px !important;
  }
  .licenses-hero {
    padding:28px 20px;
    border-radius:24px;
  }
  .licenses-meta-item {
    min-width:calc(50% - 8px);
  }
  .license-card-body h3 {
    font-size:22px;
  }
}
/* === REQUESTED NAV + LICENSE PAGE + CARD TITLE OVERRIDES END === */


/* === USER REVISION 2: LICENSES + REQUEST MAP START === */
.application-section{
  position:relative;
  overflow:hidden;
  background:#efebe4 !important;
  isolation:isolate;
}
.application-section::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:url('assets/backgrounds/request-map-gray.jpg');
  background-repeat:no-repeat;
  background-position:center center;
  background-size:min(1220px,92%);
  opacity:.16;
  z-index:-2;
}
.application-section::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(239,235,228,.92) 0%, rgba(239,235,228,.94) 100%);
  z-index:-1;
}
.application-heading p{
  max-width:610px !important;
  font-size:16px !important;
  color:#6f7680 !important;
}
.application-grid{
  position:relative;
  z-index:1;
}
.contact-info-card,
.request-card,
.service-247,
.address-bar{
  background:rgba(255,255,255,.76) !important;
  backdrop-filter:blur(6px);
}
.request-card{
  box-shadow:0 16px 32px rgba(22,29,37,.05) !important;
}

.licenses-page-v2{
  background:#f3f1ed !important;
}
.licenses-page-v2 .engineering-shell{
  gap:0 !important;
}
.licenses-intro-v2{
  padding:26px 0 18px;
}
.licenses-intro-v2 h1{
  margin-top:8px;
  font-size:clamp(38px,5vw,58px);
  line-height:1.02;
  letter-spacing:-.045em;
  color:#1d2432;
  font-weight:800;
}
.licenses-intro-v2 h1 span{color:#f26a21;}
.licenses-intro-v2 p{
  margin-top:14px;
  max-width:720px;
  color:#707783;
  font-size:18px;
  line-height:1.8;
}
.licenses-showcase-v2{
  padding:28px 0 6px;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:34px;
  align-items:start;
}
.license-showcard-v2{
  position:relative;
  min-height:100%;
}
.license-visual-v2{
  position:relative;
  min-height:420px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:30px 24px 18px;
}
.license-visual-shadow{
  position:absolute;
  inset:24px 34px 0 34px;
  border:2px solid rgba(223,212,198,.85);
  border-radius:20px;
  transform:rotate(-5deg);
}
.license-showcard-v2:nth-child(even) .license-visual-shadow{
  transform:rotate(4deg);
}
.license-visual-v2 img{
  position:relative;
  z-index:1;
  max-width:100%;
  width:auto;
  height:330px;
  object-fit:contain;
  border-radius:18px;
  box-shadow:0 14px 30px rgba(20,27,35,.08);
  background:#fff;
}
.license-copy-v2{
  padding:6px 10px 0;
}
.license-copy-v2 h3{
  margin:0;
  color:#6c6e72;
  font-weight:500;
  font-size:20px;
  line-height:1.85;
  letter-spacing:-.02em;
}
.license-copy-v2 strong{
  display:block;
  margin-top:10px;
  color:#101317;
  font-size:27px;
  line-height:1.25;
  letter-spacing:-.03em;
  font-weight:800;
}

@media (max-width: 1360px){
  .licenses-showcase-v2{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width: 900px){
  .licenses-showcase-v2{grid-template-columns:1fr; gap:26px;}
  .licenses-intro-v2 p{font-size:16px;}
  .license-visual-v2{min-height:unset;}
  .license-copy-v2 h3{font-size:18px; line-height:1.7;}
}
@media (max-width: 767px){
  .application-section::before{background-size:140%; opacity:.11; background-position:center 120px;}
  .licenses-intro-v2{padding-top:14px;}
  .licenses-intro-v2 h1{font-size:34px;}
  .license-visual-v2{padding:20px 14px 12px;}
  .license-visual-shadow{inset:16px 20px 0 20px;}
  .license-visual-v2 img{height:280px;}
  .license-copy-v2 h3{font-size:16px;}
  .license-copy-v2 strong{font-size:22px;}
}
/* === USER REVISION 2: LICENSES + REQUEST MAP END === */



/* === USER FINAL REVISION: STATIC CARDS + CERTIFICATE HOVER START === */
/* 1) Feature/service cards stay static exactly in their current form */
.feature-ref-card-v67,
.feature-ref-card-v67::after,
.feature-ref-copy-v67,
.feature-ref-copy-v67 h3,
.feature-ref-copy-v67 > p,
.feature-ref-kicker-v67,
.feature-ref-checks-v67 span,
.feature-ref-checks-v67 i,
.feature-ref-bubble-v67,
.feature-ref-image-v67 img {
  transition:none !important;
  animation:none !important;
}
.feature-ref-card-v67::after{
  display:none !important;
  opacity:0 !important;
}
.feature-ref-card-v67:hover{
  transform:none !important;
  border-color:inherit !important;
  box-shadow:inherit !important;
}
.feature-ref-card-v67:hover .feature-ref-copy-v67,
.feature-ref-card-v67:hover .feature-ref-kicker-v67,
.feature-ref-card-v67:hover .feature-ref-copy-v67 h3,
.feature-ref-card-v67:hover .feature-ref-copy-v67 > p,
.feature-ref-card-v67:hover .feature-ref-checks-v67 span{
  color:inherit !important;
}
.feature-ref-card-v67:hover .feature-ref-checks-v67 i{
  background:initial !important;
  color:initial !important;
  transform:none !important;
}
.feature-ref-card-v67:hover .feature-ref-bubble-v67{
  background:initial !important;
  color:initial !important;
  border-color:initial !important;
}
.feature-ref-card-v67:hover .feature-ref-image-v67 img{
  transform:none !important;
}

/* 2) Request section map background like hero area, cleaner and more visible */
.application-section{
  position:relative;
  overflow:hidden;
  background:#efebe4 !important;
  isolation:isolate;
}
.application-section::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:url('assets/backgrounds/request-map-gray.jpg');
  background-repeat:no-repeat;
  background-position:right center;
  background-size:min(980px,62%);
  opacity:.24;
  z-index:-2;
}
.application-section::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(239,235,228,.96) 0%, rgba(239,235,228,.93) 44%, rgba(239,235,228,.86) 72%, rgba(239,235,228,.82) 100%);
  z-index:-1;
}

/* 3) Remove crane animation/background element from site */
.construction-scene .scene-crane{
  display:none !important;
}
.construction-scene .crane-trolley,
.construction-scene .crane-hook{
  animation:none !important;
}

/* 4) Certificates/Licenses heading: modern, centered, balanced */
.licenses-intro-v2{
  padding:34px 0 24px !important;
  max-width:920px;
  margin:0 auto;
  text-align:center;
}
.licenses-intro-v2 .section-kicker{
  display:inline-block;
  margin-bottom:14px;
  padding:10px 18px;
  border-radius:999px;
  background:rgba(242,106,33,.10);
  color:#f26a21 !important;
  font-size:12px;
  font-weight:800;
  letter-spacing:.14em;
}
.licenses-intro-v2 h1{
  margin:0 auto;
  max-width:980px;
  font-size:clamp(40px,5.4vw,64px) !important;
  line-height:1.02 !important;
  letter-spacing:-.05em !important;
  color:#1a2233 !important;
  font-weight:800 !important;
}
.licenses-intro-v2 h1 span{
  color:#f26a21 !important;
}
.licenses-intro-v2 p{
  margin:18px auto 0 !important;
  max-width:760px !important;
  color:#677181 !important;
  font-size:18px !important;
  line-height:1.8 !important;
}
.licenses-intro-v2::after{
  content:'';
  display:block;
  width:96px;
  height:4px;
  border-radius:999px;
  background:#f26a21;
  margin:20px auto 0;
}

/* 5) License cards: readable color hover animation */
.licenses-showcase-v2{
  padding-top:34px !important;
}
.license-showcard-v2{
  position:relative;
  padding:18px 18px 22px;
  border-radius:28px;
  background:linear-gradient(180deg,rgba(255,255,255,.42) 0%, rgba(255,255,255,.08) 100%);
  transition:transform .26s ease, box-shadow .26s ease, background .26s ease, border-color .26s ease;
  border:1px solid rgba(212,201,187,.7);
  overflow:hidden;
}
.license-showcard-v2::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(242,106,33,.00) 0%, rgba(242,106,33,.10) 46%, rgba(28,38,56,.05) 100%);
  opacity:0;
  transition:opacity .26s ease;
  pointer-events:none;
}
.license-showcard-v2:hover{
  transform:translateY(-5px);
  background:linear-gradient(180deg,#ffffff 0%, #fff6f0 100%);
  border-color:rgba(242,106,33,.38);
  box-shadow:0 22px 36px rgba(30,41,59,.10);
}
.license-showcard-v2:hover::before{
  opacity:1;
}
.license-showcard-v2 .license-visual-v2 img,
.license-showcard-v2 .license-copy-v2 h3,
.license-showcard-v2 .license-copy-v2 strong{
  transition:transform .26s ease, color .26s ease, filter .26s ease;
}
.license-showcard-v2:hover .license-visual-v2 img{
  filter:saturate(1.03) contrast(1.02);
  transform:translateY(-2px);
}
.license-showcard-v2:hover .license-copy-v2 h3{
  color:#2d3748;
}
.license-showcard-v2:hover .license-copy-v2 strong{
  color:#f26a21;
}

@media (max-width: 767px){
  .application-section::before{
    background-position:center 140px;
    background-size:130%;
    opacity:.14;
  }
  .licenses-intro-v2 h1{font-size:36px !important;}
  .licenses-intro-v2 p{font-size:16px !important;}
  .license-showcard-v2{padding:14px 14px 18px; border-radius:22px;}
}
/* === USER FINAL REVISION: STATIC CARDS + CERTIFICATE HOVER END === */



/* === USER HOTFIX: MAP + PDF LICENSES + STATIC DARK CARDS START === */
/* Request section map should be clearly visible */
.application-section .container,
.application-heading,
.application-grid {
  position:relative;
  z-index:1;
}
.application-section::before{
  z-index:0 !important;
  background-position:78% center !important;
  background-size:min(1150px,70%) !important;
  opacity:.28 !important;
}
.application-section::after{
  z-index:0 !important;
  background:linear-gradient(90deg,rgba(239,235,228,.97) 0%, rgba(239,235,228,.93) 38%, rgba(239,235,228,.84) 70%, rgba(239,235,228,.78) 100%) !important;
}

/* Service cards: no movement but keep dark/colored look */
.feature-ref-card-v67{
  background:linear-gradient(120deg,#477289 0%, #173b58 68%, #112e46 100%) !important;
  border-color:#315f79 !important;
  box-shadow:0 20px 40px rgba(23,59,88,.18) !important;
  transform:none !important;
}
.feature-ref-card-v67::after{
  display:none !important;
}
.feature-ref-copy-v67,
.feature-ref-copy-v67 h3,
.feature-ref-copy-v67 > p,
.feature-ref-kicker-v67,
.feature-ref-checks-v67 span{
  color:#ffffff !important;
}
.feature-ref-kicker-v67{
  color:#cfe7f4 !important;
}
.feature-ref-checks-v67 i{
  background:#ffffff !important;
  color:#173b58 !important;
}
.feature-ref-bubble-v67{
  background:#ff6b2c !important;
  color:#ffffff !important;
  border-color:#ffffff !important;
}
.feature-ref-card-v67:hover,
.feature-ref-card-v67:hover .feature-ref-copy-v67,
.feature-ref-card-v67:hover .feature-ref-kicker-v67,
.feature-ref-card-v67:hover .feature-ref-copy-v67 h3,
.feature-ref-card-v67:hover .feature-ref-copy-v67 > p,
.feature-ref-card-v67:hover .feature-ref-checks-v67 span,
.feature-ref-card-v67:hover .feature-ref-checks-v67 i,
.feature-ref-card-v67:hover .feature-ref-bubble-v67{
  transform:none !important;
}
.feature-ref-image-v67{
  background:#dce3e7 !important;
}

/* Licenses heading text */
.license-showcard-link{
  display:block;
  text-decoration:none;
  color:inherit;
}
.license-open-hint{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-top:12px;
  padding:9px 14px;
  border-radius:999px;
  background:rgba(242,106,33,.10);
  color:#f26a21;
  font-size:13px;
  font-weight:800;
  letter-spacing:.03em;
}
.license-open-hint::before{
  content:'↗';
  font-size:14px;
}
.license-showcard-v2{
  cursor:pointer;
}
.license-showcard-v2:hover .license-open-hint{
  background:#f26a21;
  color:#ffffff;
}

@media (max-width: 767px){
  .application-section::before{
    background-position:center 160px !important;
    background-size:145% !important;
    opacity:.16 !important;
  }
}
/* === USER HOTFIX: MAP + PDF LICENSES + STATIC DARK CARDS END === */


/* === HOSTINGER STABILITY OVERRIDES START === */
/* Keep page elements in normal stacking order and render map behind content. */
.application-section.section {
  position:relative !important;
  isolation:isolate !important;
  background:#eeece8 !important;
}
.application-section.section::before {
  content:"" !important;
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  background-image:url('assets/backgrounds/request-world-map-transparent.png') !important;
  background-repeat:no-repeat !important;
  background-position:82% 24% !important;
  background-size:min(1120px,95%) auto !important;
  opacity:.37 !important;
  pointer-events:none !important;
}
.application-section.section::after {
  display:none !important;
  content:none !important;
}
.application-section.section > .container {
  position:relative !important;
  z-index:1 !important;
}
/* White cards stay opaque for readable form fields, background remains visible around them. */
.application-section .contact-info-card,
.application-section .request-card { background:rgba(255,255,255,.93) !important; }
.application-section .service-247 { background:#fffaf4 !important; }
.application-section .service-247-visual img {display:block !important; opacity:1 !important;visibility:visible !important;}

/* Four service cards remain permanently dark blue; no hover animation. */
.feature-strip.feature-reference-v67 .feature-ref-card-v67,
.feature-strip.feature-reference-v67 .feature-ref-card-v67:hover {
  background:linear-gradient(115deg,#477289 0%,#23506c 45%,#112e46 100%) !important;
  border:1px solid #315f79 !important;
  transform:none !important;
  transition:none !important;
  box-shadow:0 12px 30px rgba(23,59,88,.16) !important;
}
.feature-strip.feature-reference-v67 .feature-ref-card-v67::after {content:none !important;display:none !important;}
.feature-strip.feature-reference-v67 .feature-ref-copy-v67,
.feature-strip.feature-reference-v67 .feature-ref-copy-v67 h3,
.feature-strip.feature-reference-v67 .feature-ref-copy-v67 > p,
.feature-strip.feature-reference-v67 .feature-ref-kicker-v67,
.feature-strip.feature-reference-v67 .feature-ref-checks-v67 span,
.feature-strip.feature-reference-v67 .feature-ref-card-v67:hover .feature-ref-copy-v67,
.feature-strip.feature-reference-v67 .feature-ref-card-v67:hover .feature-ref-copy-v67 h3,
.feature-strip.feature-reference-v67 .feature-ref-card-v67:hover .feature-ref-copy-v67 > p,
.feature-strip.feature-reference-v67 .feature-ref-card-v67:hover .feature-ref-kicker-v67,
.feature-strip.feature-reference-v67 .feature-ref-card-v67:hover .feature-ref-checks-v67 span {color:#fff !important;}
.feature-strip.feature-reference-v67 .feature-ref-checks-v67 i,
.feature-strip.feature-reference-v67 .feature-ref-card-v67:hover .feature-ref-checks-v67 i {
  color:#173b58 !important;
  background:#fff !important;
  transform:none !important;
}
.feature-strip.feature-reference-v67 .feature-ref-bubble-v67,
.feature-strip.feature-reference-v67 .feature-ref-card-v67:hover .feature-ref-bubble-v67 {
  color:#fff !important;
  background:#ff6b2c !important;
  border-color:#fff !important;
  transform:none !important;
}
.feature-strip.feature-reference-v67 .feature-ref-card-v67 img,
.feature-strip.feature-reference-v67 .feature-ref-card-v67:hover img {
  transform:none !important;
  transition:none !important;
}
/* Ensure license PDF links appear as tappable blocks, not browser-styled anchors. */
.license-showcard-link {display:block !important; color:inherit !important; text-decoration:none !important;}
.licenses-intro-v2 h1 {text-align:center !important;}
/* Remove entire animated background scene (crane/truck/workers), not service imagery. */
.projects .construction-scene {display:none !important;}
@media(max-width:767px) {
  .application-section.section::before {
    background-position:center 16% !important;
    background-size:145% auto !important;
    opacity:.29 !important;
  }
}
@media(prefers-reduced-motion:reduce) {
  .license-showcard-v2,.license-showcard-v2::before,.license-showcard-v2 img {transition:none !important;}
}
/* === HOSTINGER STABILITY OVERRIDES END === */



/* === USER BRANDS MARQUEE UPDATE START === */
.brands-head-simple,
.brands-page-head-simple {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(280px,520px);
  gap:24px 40px;
  align-items:end;
}
.brands-head-simple .section-kicker,
.brands-page-head-simple .brand-catalog-kicker {
  display:none !important;
}
.brands-head-simple h2,
.brands-page-head-simple h1 {
  margin:0 !important;
  font-size:clamp(42px,5.6vw,66px) !important;
  line-height:0.98 !important;
  letter-spacing:-.05em !important;
  font-weight:800 !important;
  color:#1d2435 !important;
}
.brands-head-simple h2 span,
.brands-page-head-simple h1 span {
  color:#f26a21 !important;
}
.brands-head-simple h2::after,
.brands-page-head-simple h1::after {
  content:'';
  display:block;
  width:84px;
  height:4px;
  border-radius:999px;
  background:#f26a21;
  margin-top:18px;
}
.brands-head-simple p,
.brands-page-head-simple p {
  margin:0 !important;
  max-width:520px;
  justify-self:end;
  color:#6a7483 !important;
  font-size:18px !important;
  line-height:1.75 !important;
}

.marquee-group {
  overflow:hidden;
  padding:28px 30px !important;
}
.logo-marquee-title {
  margin:0 0 20px;
  color:#1e3354;
  font-weight:800;
  font-size:clamp(30px,3.4vw,46px);
  line-height:1.05;
  letter-spacing:-.04em;
}
.logo-marquee-title.centered {
  text-align:center;
}
.logo-marquee {
  display:grid;
  gap:18px;
}
.logo-marquee-row {
  overflow:hidden;
  position:relative;
}
.logo-marquee-row::before,
.logo-marquee-row::after {
  content:'';
  position:absolute;
  top:0;
  bottom:0;
  width:54px;
  z-index:2;
  pointer-events:none;
}
.logo-marquee-row::before {
  left:0;
  background:linear-gradient(90deg,#ffffff 10%, rgba(255,255,255,0));
}
.logo-marquee-row::after {
  right:0;
  background:linear-gradient(270deg,#ffffff 10%, rgba(255,255,255,0));
}
.logo-marquee-track {
  display:flex;
  width:max-content;
  gap:18px;
  animation:brand-marquee-right 36s linear infinite;
  will-change:transform;
}
.stores-marquee-group .row-2 .logo-marquee-track {
  animation-duration:42s;
}
.lift-marquee-group .row-1 .logo-marquee-track {
  animation-duration:28s;
}
.lift-marquee-group .row-2 .logo-marquee-track {
  animation-duration:31s;
}
.marquee-logo-card {
  flex:0 0 210px;
  min-width:210px;
}
@keyframes brand-marquee-right {
  from { transform:translateX(-50%); }
  to { transform:translateX(0); }
}
.marquee-group:hover .logo-marquee-track {
  animation-play-state:paused;
}

@media (max-width: 991px) {
  .brands-head-simple,
  .brands-page-head-simple {
    grid-template-columns:1fr !important;
  }
  .brands-head-simple p,
  .brands-page-head-simple p {
    justify-self:start;
  }
}
@media (max-width: 767px) {
  .marquee-group {
    padding:20px 16px !important;
  }
  .marquee-logo-card {
    flex-basis:170px;
    min-width:170px;
  }
  .logo-marquee-row::before,
  .logo-marquee-row::after {
    width:24px;
  }
  .logo-marquee-title {
    margin-bottom:14px;
    font-size:28px;
  }
  .brands-head-simple h2,
  .brands-page-head-simple h1 {
    font-size:38px !important;
  }
  .brands-head-simple p,
  .brands-page-head-simple p {
    font-size:16px !important;
  }
}
/* === USER BRANDS MARQUEE UPDATE END === */



/* === USER MANUAL LOGO + VIVID SERVICES UPDATE START === */
/* Centered brands header */
.centered-brands-head,
.brand-page-centered-head {
  display:flex !important;
  justify-content:center !important;
  text-align:center !important;
}
.centered-brands-head > div,
.brand-page-centered-head > div {
  max-width:840px;
}
.centered-brands-head h2,
.brand-page-centered-head h1 {
  margin:0 auto !important;
  text-align:center !important;
}
.centered-brands-head h2::after,
.brand-page-centered-head h1::after {
  margin:18px auto 0 !important;
}
.centered-brands-head p,
.brand-page-centered-head p {
  margin:18px auto 0 !important;
  justify-self:center !important;
  max-width:520px !important;
  text-align:center !important;
}

/* Manual logo rows */
.manual-brand-group {
  padding:28px 30px !important;
}
.manual-logo-row {
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  cursor:grab;
  padding:6px 2px 16px;
  scroll-snap-type:x proximity;
}
.manual-logo-row:active { cursor:grabbing; }
.manual-logo-row + .manual-logo-row { margin-top:10px; }
.manual-logo-strip {
  display:flex;
  gap:18px;
  width:max-content;
  min-width:100%;
}
.manual-logo-card {
  flex:0 0 210px;
  min-width:210px;
  scroll-snap-align:start;
}
.logo-manual-title {
  margin:0 0 18px;
  color:#1f3150;
  text-align:center;
  font-size:clamp(28px,3.2vw,44px);
  line-height:1.05;
  letter-spacing:-.04em;
  font-weight:800;
}
.manual-logo-row::-webkit-scrollbar { height:10px; }
.manual-logo-row::-webkit-scrollbar-thumb { background:#f26a21; border-radius:999px; }
.manual-logo-row::-webkit-scrollbar-track { background:#ece8e1; border-radius:999px; }

/* Vivid service network */
.vivid-service-network {
  max-width:660px !important;
  min-height:430px !important;
}
.service-network-center {
  width:128px !important;
  height:128px !important;
  padding:18px !important;
  background:#121821 !important;
  box-shadow:0 18px 40px rgba(18,24,33,.18) !important;
  border:8px solid #ffffff !important;
}
.service-network-center img {
  width:100%;
  height:100%;
  object-fit:contain;
}
.vivid-node {
  width:180px !important;
  height:128px !important;
  padding:18px 14px !important;
  border-radius:30px !important;
  border:0 !important;
  color:#ffffff !important;
  box-shadow:0 18px 34px rgba(26,31,38,.12) !important;
  gap:10px !important;
  text-align:center;
}
.vivid-node span {
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(255,255,255,.92);
  color:#1f2732 !important;
  font-size:28px !important;
  box-shadow:0 8px 16px rgba(17,24,39,.12);
}
.vivid-node small {
  color:#ffffff !important;
  font-size:14px !important;
  line-height:1.35 !important;
  font-weight:800 !important;
  max-width:130px;
}
.node-engineering { background:linear-gradient(135deg,#18b7af 0%, #1cb5bf 100%) !important; }
.node-hvac { background:linear-gradient(135deg,#f5b841 0%, #f09e1b 100%) !important; }
.node-lift { background:linear-gradient(135deg,#ff2f96 0%, #e31579 100%) !important; }
.node-procurement { background:linear-gradient(135deg,#1f90f2 0%, #0f6cc8 100%) !important; }
.vivid-node:hover {
  transform:translateY(-6px) scale(1.03) !important;
  box-shadow:0 22px 36px rgba(26,31,38,.18) !important;
}
.vivid-service-network .network-line {
  width:168px !important;
  height:2px !important;
  background:linear-gradient(90deg,rgba(242,106,33,.12), rgba(242,106,33,.45)) !important;
}
.vivid-service-network .about-network-node.n1 { left:0 !important; top:6% !important; }
.vivid-service-network .about-network-node.n2 { right:0 !important; top:6% !important; }
.vivid-service-network .about-network-node.n3 { left:2% !important; bottom:2% !important; }
.vivid-service-network .about-network-node.n4 { right:2% !important; bottom:6% !important; }

@media (max-width: 991px) {
  .manual-brand-group { padding:22px 18px !important; }
  .manual-logo-card { flex-basis:188px; min-width:188px; }
  .vivid-service-network { min-height:390px !important; max-width:600px !important; }
  .vivid-node { width:158px !important; height:118px !important; border-radius:26px !important; }
  .vivid-node small { font-size:13px !important; max-width:118px; }
  .service-network-center { width:112px !important; height:112px !important; }
  .vivid-service-network .network-line { width:138px !important; }
}
@media (max-width: 767px) {
  .manual-logo-card { flex-basis:164px; min-width:164px; }
  .logo-manual-title { font-size:28px; }
  .vivid-service-network { max-width:360px !important; min-height:420px !important; }
  .service-network-center { width:92px !important; height:92px !important; padding:12px !important; }
  .vivid-node { width:126px !important; height:98px !important; border-radius:22px !important; gap:6px !important; padding:12px 8px !important; }
  .vivid-node span { width:40px; height:40px; font-size:22px !important; }
  .vivid-node small { font-size:10px !important; max-width:100px; }
  .vivid-service-network .network-line { width:86px !important; }
  .vivid-service-network .about-network-node.n1 { left:2% !important; top:4% !important; }
  .vivid-service-network .about-network-node.n2 { right:0 !important; top:4% !important; }
  .vivid-service-network .about-network-node.n3 { left:4% !important; bottom:3% !important; }
  .vivid-service-network .about-network-node.n4 { right:2% !important; bottom:6% !important; }
}
/* === USER MANUAL LOGO + VIVID SERVICES UPDATE END === */

/* === PRODUCT GALLERY + RESTORED AUTOMATIC BRAND STRIPS (2026-10-16) === */
/* Both branding page headlines remain centered. */
.centered-brands-head,
.brand-page-centered-head { display:flex !important; justify-content:center !important; text-align:center !important; }
.centered-brands-head > div,
.brand-page-centered-head > div { max-width:850px; }
.centered-brands-head h2,
.brand-page-centered-head h1 { text-align:center !important; margin:0 auto !important; }
.centered-brands-head h2::after,
.brand-page-centered-head h1::after { margin:18px auto 0 !important; }
.centered-brands-head p,
.brand-page-centered-head p { max-width:530px !important; text-align:center !important; margin:16px auto 0 !important; justify-self:center !important; }

/* Two continuous, left-to-right rows for each brand category. */
.marquee-group { overflow:hidden; padding:26px 28px !important; }
.logo-marquee { display:grid; gap:14px; }
.logo-marquee-row { overflow:hidden; position:relative; }
.logo-marquee-track { display:flex; width:max-content; gap:0; animation:retailLogoMoveRight 49s linear infinite !important; will-change:transform; }
.logo-marquee-copy { display:flex; flex:0 0 auto; gap:16px; padding-right:16px; }
.logo-marquee-row.row-2 .logo-marquee-track { animation-duration:55s !important; }
.lift-marquee-group .logo-marquee-track { animation-duration:45s !important; }
.lift-marquee-group .row-2 .logo-marquee-track { animation-duration:48s !important; }
.auto-logo-card { flex:0 0 192px; min-width:192px; min-height:145px; }
@keyframes retailLogoMoveRight { from { transform:translateX(-50%); } to {transform:translateX(0);} }
.marquee-group:hover .logo-marquee-track { animation-play-state:paused !important; }
@media (prefers-reduced-motion: reduce){
  .logo-marquee-track{animation:none !important;}
  .logo-marquee-row{overflow-x:auto;}
}

/* Product slider, right half of '4 istiqamət, bir komanda' section */
.product-showcase { grid-area:network; min-width:0; width:100%; max-width:720px; justify-self:stretch; font-family:"Manrope",system-ui,sans-serif; }
.product-showcase-stage { position:relative; isolation:isolate; height:clamp(330px,31vw,438px); overflow:hidden; border-radius:32px; background:#ecf0f4; box-shadow:0 22px 55px rgba(22,42,67,.12); }
.product-showcase-noise { position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(120deg,rgba(10,19,30,.32),transparent 60%); }
.product-showcase-image { position:absolute; z-index:0; width:100%; height:100%; inset:0; display:block; object-fit:cover; object-position:center; transform:scale(1); opacity:1; transition:opacity .38s ease,transform .7s ease; }
.product-showcase-image.is-swapping { opacity:.42; transform:scale(1.055); }
.product-showcase-glow { position:absolute; z-index:1; inset:42% 0 0; background:linear-gradient(0deg,rgba(6,16,27,.89),rgba(6,16,27,.12) 85%,transparent); pointer-events:none; }
.product-showcase-top { position:absolute; z-index:3; left:22px; right:22px; top:23px; display:flex; align-items:center; justify-content:space-between; gap:15px; }
.product-showcase-eyebrow { background:rgba(255,255,255,.93); border:1px solid rgba(255,255,255,.8); border-radius:999px; padding:9px 13px; display:inline-flex; align-items:center; gap:8px; font-size:10px; font-weight:800; letter-spacing:.1em; color:#14283f; }
.product-showcase-dot { width:7px; height:7px; border-radius:100%; background:#ff6b2c; }
.product-showcase-counter { border-radius:999px; padding:9px 14px; background:rgba(9,24,43,.65); color:#fff; font-size:12px; font-weight:700; letter-spacing:.1em; font-variant-numeric:tabular-nums; }
.product-showcase-counter b { color:#ff9a67; font-size:17px; }
.product-showcase-overlay { position:absolute; z-index:3; left:24px; right:20px; bottom:24px; display:flex; align-items:flex-end; justify-content:space-between; gap:14px; }
.product-showcase-summary { flex:1; min-width:0; color:#fff; text-shadow:0 2px 9px rgba(0,0,0,.2); }
.product-showcase-small { display:block; color:#ffd0b6; font-size:10px; font-weight:800; letter-spacing:.16em; margin-bottom:7px; }
.product-showcase-summary h4 { color:#fff !important; font-size:clamp(19px,2.1vw,29px) !important; line-height:1.1; margin:0 0 8px; font-weight:800; letter-spacing:-.035em; }
.product-showcase-summary p { color:rgba(255,255,255,.88) !important; font-size:11px; line-height:1.5; margin:0; max-width:240px; }
.product-showcase-thumbnails { flex:0 0 auto; display:flex; gap:9px; }
.product-showcase-thumb { appearance:none; position:relative; overflow:hidden; border:2px solid rgba(255,255,255,.85); border-radius:17px; width:88px; height:112px; padding:0; background:#fff; cursor:pointer; box-shadow:0 10px 24px rgba(0,0,0,.18); transition:transform .2s ease,border-color .2s ease; }
.product-showcase-thumb:hover,.product-showcase-thumb:focus-visible { transform:translateY(-5px); border-color:#ff6b2c; outline:0; }
.product-showcase-thumb img { display:block; width:100%; height:100%; object-fit:cover; }
.product-showcase-thumb span { position:absolute; left:8px; bottom:7px; border-radius:7px; padding:4px 6px; font-size:10px; font-weight:800; color:#fff; background:rgba(14,30,48,.7); }
.product-showcase-controls { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:15px 4px 0; }
.product-showcase-hint { color:#607085; font-size:12px; font-weight:800; letter-spacing:.01em; }
.product-showcase-dots { display:flex; gap:7px; align-items:center; }
.product-showcase-dots button { width:9px; height:9px; padding:0; border:0; border-radius:50%; background:#d6dce5; cursor:pointer; transition:width .2s ease,background .2s ease; }
.product-showcase-dots button.is-active { width:28px; border-radius:9px; background:#ff6b2c; }
.product-showcase-dots button:focus-visible { outline:2px solid #ff6b2c; outline-offset:4px; }
.product-showcase-arrows { display:flex; align-items:center; gap:7px; }
.product-showcase-arrows button { width:38px; height:38px; border:1px solid #e6eaf0; background:#fff; color:#173b58; border-radius:50%; font-size:19px; cursor:pointer; display:grid; place-items:center; transition:background .2s,color .2s,border-color .2s; }
.product-showcase-arrows button:hover,.product-showcase-arrows button:focus-visible { background:#ff6b2c; border-color:#ff6b2c; color:#fff; }
@media (max-width:1100px) {
  .product-showcase-stage { height:380px; }
  .product-showcase-thumb { width:76px; height:98px; }
}
@media (max-width:920px){
  .product-showcase { max-width:750px; margin:0 auto; }
  .product-showcase-stage{height:clamp(370px,54vw,480px);}
}
@media (max-width:600px){
  .product-showcase{max-width:100%;}
  .product-showcase-stage{height:370px; border-radius:22px;}
  .product-showcase-top{left:13px;right:13px;top:15px;}
  .product-showcase-eyebrow{font-size:9px; padding:7px 9px;}
  .product-showcase-overlay{bottom:16px;left:15px;right:13px;gap:8px;}
  .product-showcase-thumb{width:57px;height:78px;border-radius:11px;}
  .product-showcase-thumbnails{gap:5px;}
  .product-showcase-summary h4{font-size:20px !important;}
  .product-showcase-summary p{font-size:9px;}
  .product-showcase-hint{font-size:10px;}
  .product-showcase-controls{gap:8px;}
  .product-showcase-arrows button{width:34px;height:34px;}
  .auto-logo-card{flex-basis:168px;min-width:168px;}
  .marquee-group{padding:19px 14px !important;}
  .logo-marquee-row::before,.logo-marquee-row::after{width:28px;}
}
@media (prefers-reduced-motion: reduce){
  .product-showcase-image,.product-showcase-dots button,.product-showcase-thumb {transition:none !important;}
}
/* === END PRODUCT GALLERY UPDATE === */



/* === CENTERED HEADINGS PRESERVED, CONTACT PANEL REMOVED === */
body.homepage-simple-header #brands .brands-head,
body.homepage-simple-header .about-ref-intro,
body.homepage-simple-header .about-ref-stats,
body.homepage-simple-header .about-services-head,
body.homepage-simple-header .process-heading,
body.homepage-simple-header .projects .section-head,
body.homepage-simple-header .application-heading,
body.homepage-simple-header .cta-inner > div:first-child { text-align:center !important; }
body.homepage-simple-header .about-ref-intro h2,
body.homepage-simple-header .about-ref-stats h3,
body.homepage-simple-header .about-services-head h2,
body.homepage-simple-header .process-heading h2,
body.homepage-simple-header .projects .section-head h2,
body.homepage-simple-header .application-heading h2 { text-align:center !important; margin-left:auto !important; margin-right:auto !important; }
body.homepage-simple-header .about-ref-intro > p,
body.homepage-simple-header .about-ref-stats > p,
body.homepage-simple-header .about-services-head > p,
body.homepage-simple-header .process-heading > p,
body.homepage-simple-header .application-heading > p { text-align:center !important; max-width:780px !important; margin-left:auto !important; margin-right:auto !important; justify-self:center !important; }
body.homepage-simple-header .about-ref-intro .about-check-list {text-align:left !important;}
body.homepage-simple-header .about-stat-row {justify-content:center !important;}
body.homepage-simple-header .application-heading,
body.homepage-simple-header .about-services-head,
body.homepage-simple-header .projects .section-head {display:flex !important; flex-direction:column; align-items:center !important;}
body.homepage-simple-header .about-ref-stats h3 {font-size:clamp(38px,4vw,58px) !important;}
body.homepage-simple-header .about-ref-stats .about-stat-row {max-width:700px; margin:24px auto 0;}
.engineering-hero h1,
.engineering-hero .engineering-badge,
.engineering-page .custom-brand-head,
.engineering-page .licenses-intro-v2,
.engineering-page .brand-catalog-head {text-align:center !important;}
.engineering-hero h1 {margin-left:auto !important; margin-right:auto !important;}
/* === END CENTERED HEADINGS === */


/* === RETAIL CLEAN NOTICES + FULL-WIDTH 6 PRODUCT SLIDER (16 OCT 2026) === */
/* Original company overview is untouched; obsolete "4 istiqamət, bir komanda" stats removed. */
.about-reference-grid {
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr) !important;
  grid-template-areas:"photo intro" "gallery gallery" !important;
  align-items:center !important;
  gap:40px 44px !important;
}
.about-reference .product-showcase {
  grid-area:gallery !important;
  grid-column:1 / -1 !important;
  width:100% !important;
  max-width:none !important;
  margin:8px 0 0 !important;
  justify-self:stretch !important;
  min-width:0 !important;
}
.about-reference .product-showcase-stage {
  height:clamp(425px,45vw,660px) !important;
  width:100% !important;
  border-radius:34px !important;
}
.about-reference .product-showcase-summary h4 {
  font-size:clamp(28px,3.2vw,46px) !important;
}
.about-reference .container.about-reference-grid {
  width:min(1480px,calc(100% - 48px)) !important;
  max-width:1480px !important;
}
.about-reference .product-showcase .product-showcase-thumb {
  width:clamp(78px,8vw,126px);
  height:clamp(100px,10vw,156px);
}
/* Preserve heading layout after removing only explanatory captions. */
body.homepage-simple-header .application-heading,
body.homepage-simple-header .about-services-head,
body.homepage-simple-header .projects .section-head {
  gap:12px !important;
}
/* Prevent empty and orphaned intro boxes taking vertical space. */
.about-reference .about-ref-stats {display:none !important;}
@media(max-width:920px){
  .about-reference-grid {
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-areas:"photo" "intro" "gallery" !important;
    gap:28px !important;
  }
  .about-reference .container.about-reference-grid {
    width:calc(100% - 36px) !important;
  }
  .about-reference .product-showcase-stage {height:clamp(400px,56vw,560px) !important;}
}
@media(max-width:600px){
  .about-reference .container.about-reference-grid {width:calc(100% - 24px) !important;}
  .about-reference .product-showcase-stage {height:385px !important;border-radius:24px !important;}
  .about-reference .product-showcase-summary h4 {font-size:24px !important;}
  .about-reference .product-showcase .product-showcase-thumb {width:56px;height:78px;}
}


/* RAS brand identity / 3-service refresh, 2026-10-17 */
.homepage-simple-header .simple-navbar .real-main-brand {
  flex:0 0 92px !important;
  width:92px !important;
  justify-content:flex-start !important;
}
.homepage-simple-header .simple-navbar .real-main-brand img {
  display:block !important;
  width:70px !important;
  max-width:70px !important;
  height:70px !important;
  max-height:70px !important;
  object-fit:contain !important;
  filter:none !important;
}
.site-loader {
  background:radial-gradient(circle at 50% 44%,rgba(21,73,108,.09),transparent 32%),#f6f8fa;
}
.site-loader-logo-wrap {width:230px;height:212px;}
.site-loader-logo-wrap img {
  width:172px;
  max-height:172px;
  filter:drop-shadow(0 14px 20px rgba(18,68,101,.12));
}
.site-loader-logo-wrap::after {mix-blend-mode:normal;opacity:.25;}
.site-loader-ring {border-color:rgba(20,70,103,.14);}
.site-loader-ring.ring-one {width:194px;height:194px;border-top-color:#154869;border-right-color:transparent;}
.site-loader-ring.ring-two {width:222px;height:222px;border-left-color:#f18a1c;}
.site-loader-progress {background:rgba(21,73,108,.12);}
.site-loader-progress span {background:linear-gradient(90deg,#144669,#f18a1c);}
.site-loader small {color:#426076;font-size:10px;letter-spacing:.16em;}
.social-avatar {background:#fff !important;padding:5px !important;}
.footer-real-logo img {object-fit:contain;}
@media (max-width:767px) {
  .homepage-simple-header .simple-navbar .real-main-brand {flex:0 0 68px !important;width:68px !important;}
  .homepage-simple-header .simple-navbar .real-main-brand img {width:62px !important;max-width:62px !important;height:62px !important;max-height:62px !important;}
  .site-loader-logo-wrap {width:210px;height:195px;}
  .site-loader-logo-wrap img {width:158px;max-height:158px;}
  .site-loader-ring.ring-one {width:174px;height:174px;}
  .site-loader-ring.ring-two {width:200px;height:200px;}
}
/* Three service areas: balanced desktop/tablet grids; mobile keeps existing single-column behavior. */
@media (min-width:1280px) {
  .nike-card-grid {grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
}
@media (min-width:1121px) {
  .feature-reference-v67 .feature-reference-grid {grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
}
@media (min-width:769px) and (max-width:1120px) {
  .feature-reference-v67 .feature-ref-card-v67:last-child {
    grid-column:1/-1;
    width:calc(50% - 10px);
    justify-self:center;
  }
}
@media (min-width:981px) {
  .about-service-grid .about-service-card:last-child {
    grid-column:1/-1;
    width:calc(50% - 11px);
    justify-self:center;
  }
}
@media (min-width:801px) and (max-width:1279px) {
  .nike-card-grid .nike-service-card:last-child {
    grid-column:1/-1;
    width:calc(50% - 12px);
    justify-self:center;
  }
}


/* RAS — variant 2: centered emblem between symmetrical navigation groups */
@media (min-width:1121px) {
  .homepage-simple-header .centered-logo-navbar .modern-header-inner {
    position:relative !important;
    width:min(1480px,calc(100% - 48px)) !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 116px minmax(0,1fr) !important;
    grid-template-areas:"navLeft logo navRight" !important;
    align-items:end !important;
    justify-content:stretch !important;
    column-gap:16px !important;
    min-height:114px !important;
    padding:10px 0 17px !important;
  }
  .homepage-simple-header .centered-logo-navbar .modern-nav {
    display:contents !important;
  }
  .homepage-simple-header .centered-logo-navbar .nav-group {
    display:flex !important;
    min-width:0;
    gap:clamp(10px,1.25vw,22px);
    align-items:center;
    padding-bottom:5px;
  }
  .homepage-simple-header .centered-logo-navbar .nav-group-left {grid-area:navLeft;justify-content:flex-end;}
  .homepage-simple-header .centered-logo-navbar .nav-group-right {grid-area:navRight;justify-content:flex-start;}
  .homepage-simple-header .centered-logo-navbar .real-main-brand {
    grid-area:logo;
    justify-self:center;
    align-self:center;
    display:flex !important;
    flex:none !important;
    align-items:center !important;
    justify-content:center !important;
    width:106px !important;
    height:106px !important;
    padding:0 !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand img {
    display:block !important;
    width:100px !important;
    max-width:100px !important;
    height:100px !important;
    max-height:100px !important;
    object-fit:contain !important;
    filter:none !important;
  }
  .homepage-simple-header .centered-logo-navbar .nav-link {
    position:relative;
    display:inline-flex !important;
    flex:0 0 auto;
    min-height:40px;
    align-items:center;
    justify-content:center;
    color:#243448 !important;
    background:none !important;
    font:700 clamp(11px,.87vw,13px)/1.35 Manrope,sans-serif !important;
    letter-spacing:-.025em;
    white-space:nowrap;
    transition:color .2s ease;
  }
  .homepage-simple-header .centered-logo-navbar .nav-link:hover,
  .homepage-simple-header .centered-logo-navbar .nav-link[aria-current="page"] {color:#ed6c1d !important;}
  .homepage-simple-header .centered-logo-navbar .nav-link::after {
    content:"";
    position:absolute;
    left:0;right:0;bottom:3px;height:2px;border-radius:3px;
    background:#ed6c1d;transform:scaleX(0);transition:transform .2s ease;
  }
  .homepage-simple-header .centered-logo-navbar .nav-link:hover::after,
  .homepage-simple-header .centered-logo-navbar .nav-link[aria-current="page"]::after {transform:scaleX(1);}
  .homepage-simple-header .centered-logo-navbar .modern-header-actions {
    position:absolute !important;
    top:7px;right:2px;
    gap:9px !important;
    display:flex !important;
  }
  .homepage-simple-header .centered-logo-navbar .simple-header-cta {min-height:30px;padding:0 12px;font-size:10px;}
  .homepage-simple-header .centered-logo-navbar .lang-switch {min-height:28px !important;padding:2px !important;}
  .homepage-simple-header .centered-logo-navbar .lang-switch button {height:22px !important;min-width:25px !important;font-size:9px !important;}
  .homepage-simple-header .centered-logo-navbar .mobile-cta-link {display:none !important;}
}
@media (min-width:1121px) and (max-width:1320px){
  .homepage-simple-header .centered-logo-navbar .modern-header-inner {grid-template-columns:minmax(0,1fr) 94px minmax(0,1fr) !important;column-gap:7px !important;}
  .homepage-simple-header .centered-logo-navbar .nav-group {gap:clamp(6px,.75vw,10px);}
  .homepage-simple-header .centered-logo-navbar .nav-link {font-size:10.5px !important;}
  .homepage-simple-header .centered-logo-navbar .real-main-brand {width:90px !important;height:96px !important;}
  .homepage-simple-header .centered-logo-navbar .real-main-brand img {width:90px !important;max-width:90px !important;height:90px !important;max-height:90px !important;}
}
@media (max-width:1120px) {
  .homepage-simple-header .centered-logo-navbar .modern-header-inner {
    display:grid !important;
    grid-template-columns:1fr auto 1fr !important;
    grid-template-areas:"actions brand toggle" !important;
    align-items:center !important;
    min-height:80px !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand {
    grid-area:brand;
    flex:none !important;
    justify-self:center !important;
    width:76px !important;height:76px !important;
    align-items:center !important;justify-content:center !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand img {
    width:72px !important;max-width:72px !important;
    height:72px !important;max-height:72px !important;
    object-fit:contain !important;filter:none !important;
  }
  .homepage-simple-header .centered-logo-navbar .modern-header-actions {grid-area:actions;justify-self:start !important;}
  .homepage-simple-header .centered-logo-navbar .mobile-menu-toggle {grid-area:toggle;justify-self:end !important;}
  .homepage-simple-header .centered-logo-navbar .modern-nav {top:calc(100% - 1px);}
  .homepage-simple-header .centered-logo-navbar .modern-nav .nav-group {display:contents !important;}
  .homepage-simple-header .centered-logo-navbar .modern-nav .nav-link {
    display:flex !important;
    min-height:46px !important;
    width:100% !important;
    align-items:center;justify-content:flex-start !important;
    padding:0 12px !important;
    color:#263648 !important;
    font:700 13px/1.35 Manrope,sans-serif !important;
    border-radius:8px;
  }
  .homepage-simple-header .centered-logo-navbar .modern-nav .nav-link:hover,
  .homepage-simple-header .centered-logo-navbar .modern-nav .nav-link[aria-current="page"] {color:#e96418 !important;background:#fff4eb !important;}
}
@media (max-width:430px) {
  .homepage-simple-header .centered-logo-navbar .modern-header-inner {min-height:70px !important;}
  .homepage-simple-header .centered-logo-navbar .real-main-brand {width:67px !important;height:67px !important;}
  .homepage-simple-header .centered-logo-navbar .real-main-brand img {width:63px !important;max-width:63px !important;height:63px !important;max-height:63px !important;}
}
@media(prefers-reduced-motion:reduce){
  .homepage-simple-header .centered-logo-navbar .nav-link,
  .homepage-simple-header .centered-logo-navbar .nav-link::after {transition:none;}
}


/* ==========================================================
   RAS REFINEMENT — CONTACT CARD + CLEAN BLUE NAVBAR v54
   ========================================================== */

:root{
  --ras-blue-1:#eff4ff;
  --ras-blue-2:#dfe9ff;
  --ras-blue-3:#3468ff;
  --ras-blue-4:#6585ff;
  --ras-blue-5:#0e1e52;
  --ras-text-dark:#1a2957;
  --ras-text-soft:#7382aa;
}

/* Cleaner centered navbar shell */
.modern-site-header{
  backdrop-filter:blur(14px);
}

.modern-nav{
  border:1px solid rgba(189,201,232,.72) !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.94) !important;
  box-shadow:0 16px 34px rgba(28,48,96,.10) !important;
}

.modern-nav a:not(.modern-order-btn){
  min-height:36px;
  border:1px solid transparent !important;
  border-radius:12px !important;
  color:#415170 !important;
  background:transparent !important;
  box-shadow:none !important;
  transition:
    color .24s ease,
    background .26s ease,
    border-color .26s ease,
    transform .22s ease,
    box-shadow .24s ease !important;
}

.modern-nav a:not(.modern-order-btn):hover,
.modern-nav a:not(.modern-order-btn):focus-visible{
  color:var(--ras-text-dark) !important;
  background:linear-gradient(180deg,#ffffff 0%,#eef4ff 100%) !important;
  border-color:#d7e2ff !important;
  transform:translateY(-1px) !important;
  box-shadow:0 10px 20px rgba(70,107,190,.14) !important;
}

.modern-nav a:not(.modern-order-btn):hover .modern-nav-icon,
.modern-nav a:not(.modern-order-btn):focus-visible .modern-nav-icon{
  color:var(--ras-blue-3) !important;
  transform:scale(1.14) rotate(-5deg) !important;
}

.modern-nav .modern-order-btn,
.simple-header-cta,
.mobile-cta-link{
  background:linear-gradient(135deg,#4b78ff 0%,#2854f3 52%,#6e5cff 100%) !important;
  color:#fff !important;
  border:none !important;
  box-shadow:0 14px 24px rgba(51,89,243,.28) !important;
}

.modern-nav .modern-order-btn:hover,
.simple-header-cta:hover,
.mobile-cta-link:hover{
  transform:translateY(-1px) !important;
  box-shadow:0 16px 28px rgba(51,89,243,.34) !important;
}

.lang-switch{
  border-color:#dce4f6 !important;
  background:rgba(255,255,255,.95) !important;
  box-shadow:0 8px 18px rgba(33,53,109,.06);
}

.lang-switch button{
  color:#7080a1 !important;
}

.lang-switch button.active{
  background:linear-gradient(135deg,#4b78ff,#5f68ff) !important;
  color:#fff !important;
  box-shadow:0 8px 16px rgba(74,104,252,.22) !important;
}

.lang-switch button:not(.active):hover{
  background:#edf3ff !important;
  color:var(--ras-text-dark) !important;
}

.mobile-menu-toggle{
  color:var(--ras-text-dark);
  border:1px solid #d9e2f5;
  border-radius:14px;
  background:rgba(255,255,255,.95);
  box-shadow:0 10px 20px rgba(31,48,90,.08);
}

@media (max-width:1024px){
  .modern-nav{
    background:rgba(255,255,255,.98) !important;
    border:1px solid #dde6fa !important;
    box-shadow:0 20px 36px rgba(28,48,96,.14) !important;
  }
  .modern-nav a:not(.modern-order-btn){
    justify-content:flex-start;
    color:#3e4d70 !important;
  }
  .modern-nav a:not(.modern-order-btn):hover,
  .modern-nav a:not(.modern-order-btn):focus-visible{
    color:#1f2c55 !important;
    background:#eef4ff !important;
    border-color:#d6e2ff !important;
    box-shadow:none !important;
  }
}

/* CTA + social card inspired by the provided blue login UI */
.footer-social-card{
  min-height:268px !important;
  padding:26px 22px 22px !important;
  border:1px solid rgba(209,222,255,.34) !important;
  border-radius:30px !important;
  background:
    radial-gradient(circle at top left,rgba(126,171,255,.30),transparent 34%),
    radial-gradient(circle at top right,rgba(255,255,255,.22),transparent 28%),
    linear-gradient(180deg,rgba(243,247,255,.18) 0%,rgba(220,232,255,.10) 100%) !important;
  box-shadow:0 20px 46px rgba(7,20,58,.18), inset 0 1px 0 rgba(255,255,255,.24) !important;
  backdrop-filter:blur(14px);
}

.footer-social-card::after{
  width:180px !important;
  height:180px !important;
  right:-95px !important;
  bottom:-96px !important;
  border-color:rgba(255,255,255,.08) !important;
  box-shadow:0 0 0 34px rgba(255,255,255,.028), 0 0 0 68px rgba(255,255,255,.02) !important;
}

.social-avatar-wrap{
  width:110px !important;
  height:110px !important;
  padding:10px !important;
  border-radius:30px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(232,240,255,.88)) !important;
  box-shadow:0 16px 34px rgba(53,84,162,.24), inset 0 1px 0 rgba(255,255,255,.94) !important;
}

.social-avatar{
  border-radius:24px !important;
  background:transparent !important;
  padding:0 !important;
  box-shadow:none !important;
}

.social-avatar img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  filter:none !important;
}

.social-online-dot{
  right:8px !important;
  bottom:8px !important;
  width:16px !important;
  height:16px !important;
  border:3px solid #f5f8ff !important;
  background:#44d987 !important;
}

.social-profile-copy{
  margin-top:18px !important;
}

.social-handle-row strong{
  color:#f8fbff !important;
  font-family:'Manrope',sans-serif !important;
  font-size:18px !important;
  font-weight:800 !important;
  letter-spacing:-.03em !important;
}

.social-verified{
  width:18px !important;
  height:18px !important;
  background:linear-gradient(135deg,#71a0ff,#4b76ff) !important;
  color:#fff !important;
  box-shadow:0 8px 18px rgba(73,112,255,.24);
}

.social-profile-copy p{
  margin:7px 0 4px !important;
  color:#e8f0ff !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.social-profile-copy small{
  color:#c8d5f5 !important;
  font-size:11px !important;
  line-height:1.55;
}

.social-contact-stack{
  position:relative;
  z-index:2;
  width:100%;
  margin-top:18px;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.social-action{
  width:100%;
  min-height:62px;
  padding:10px 12px;
  display:flex;
  align-items:center;
  gap:12px;
  border-radius:20px;
  border:1px solid rgba(220,231,255,.55);
  background:linear-gradient(180deg,rgba(255,255,255,.98) 0%,rgba(233,240,255,.92) 100%);
  box-shadow:0 14px 28px rgba(22,47,107,.14), inset 0 1px 0 rgba(255,255,255,.95);
  text-decoration:none;
  transition:transform .24s ease, box-shadow .24s ease, border-color .24s ease;
}

.social-action:hover{
  transform:translateY(-2px);
  border-color:#bfd3ff;
  box-shadow:0 18px 30px rgba(22,47,107,.18), inset 0 1px 0 rgba(255,255,255,.98);
}

.social-action-icon{
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:linear-gradient(135deg,#4f79ff 0%,#365dfa 58%,#725dff 100%);
  color:#fff;
  font-size:20px;
  font-weight:800;
  box-shadow:0 12px 22px rgba(51,89,243,.28);
}

.social-action-copy{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}

.social-action-copy small{
  color:#7b8aad;
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.social-action-copy strong{
  color:#172754;
  font-size:14px;
  font-weight:800;
  letter-spacing:-.02em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.social-action-phone .social-action-copy strong{
  letter-spacing:0;
}

@media (max-width:1180px){
  .cta-inner{
    grid-template-columns:1fr !important;
  }
  .footer-social-card{
    width:min(100%,420px);
    margin-inline:auto;
  }
}

@media (max-width:640px){
  .footer-social-card{
    min-height:auto !important;
    padding:22px 18px 18px !important;
    border-radius:24px !important;
  }

  .social-avatar-wrap{
    width:98px !important;
    height:98px !important;
    border-radius:26px !important;
  }

  .social-handle-row strong{
    font-size:16px !important;
  }

  .social-action{
    min-height:58px;
    padding:10px 11px;
    border-radius:18px;
  }

  .social-action-icon{
    width:40px;
    height:40px;
    border-radius:13px;
    font-size:18px;
  }

  .social-action-copy strong{
    font-size:13px;
  }
}


/* Inner service page tab links refined to match the new blue style */
.engineering-nav-links a{
  border:1px solid transparent !important;
  border-radius:12px !important;
  color:#49597a !important;
  background:transparent !important;
  box-shadow:none !important;
}

.engineering-nav-links a:hover,
.engineering-nav-links a:focus-visible{
  color:var(--ras-text-dark) !important;
  background:linear-gradient(180deg,#ffffff 0%,#eef4ff 100%) !important;
  border-color:#d7e2ff !important;
  transform:translateY(-1px) !important;
  box-shadow:0 10px 20px rgba(70,107,190,.12) !important;
}


/* ==============================================================
   WIDE ORIGINAL BRAND LOGO — HEADER ONLY / responsive refinement
   Artwork elsewhere (loader, contact card, footer) is unchanged.
   ============================================================== */
@media (min-width: 1321px) {
  .homepage-simple-header .centered-logo-navbar .modern-header-inner {
    grid-template-columns:minmax(0,1fr) 350px minmax(0,1fr) !important;
    column-gap:18px !important;
    min-height:162px !important;
    padding:16px 0 14px !important;
    align-items:end !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand {
    width:350px !important;
    height:146px !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand img {
    width:346px !important;
    max-width:346px !important;
    height:auto !important;
    max-height:146px !important;
  }
}
@media (min-width: 1121px) and (max-width: 1320px) {
  .homepage-simple-header .centered-logo-navbar .modern-header-inner {
    grid-template-columns:minmax(0,1fr) 260px minmax(0,1fr) !important;
    column-gap:9px !important;
    min-height:142px !important;
    padding:17px 0 13px !important;
    align-items:end !important;
  }
  .homepage-simple-header .centered-logo-navbar .nav-group {
    gap:clamp(7px,.95vw,12px) !important;
  }
  .homepage-simple-header .centered-logo-navbar .nav-link {
    font-size:clamp(10px,.9vw,11.5px) !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand {
    width:260px !important;
    height:116px !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand img {
    width:258px !important;
    max-width:258px !important;
    height:auto !important;
    max-height:116px !important;
  }
}
@media (min-width:1121px) {
  .homepage-simple-header .centered-logo-navbar .real-main-brand {
    flex:0 0 auto !important;
    justify-self:center !important;
    justify-content:center !important;
    align-self:center !important;
    display:flex !important;
    align-items:center !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand img {
    display:block !important;
    object-fit:contain !important;
    filter:none !important;
  }
  .homepage-simple-header .centered-logo-navbar .nav-group {padding-bottom:14px;}
  .homepage-simple-header .centered-logo-navbar .nav-link {color:#263d58 !important;}
}

@media (max-width:1120px) {
  .homepage-simple-header .centered-logo-navbar .modern-header-inner {
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) !important;
    grid-template-areas:'actions brand toggle' !important;
    align-items:center !important;
    min-height:112px !important;
    column-gap:12px !important;
    padding:8px 0 !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand {
    grid-area:brand !important;
    width:clamp(178px,26vw,238px) !important;
    height:100px !important;
    flex:0 0 auto !important;
    justify-self:center !important;
    justify-content:center !important;
    align-self:center !important;
    display:flex !important;
    align-items:center !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand img {
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    max-height:100px !important;
    object-fit:contain !important;
    filter:none !important;
  }
  .homepage-simple-header .centered-logo-navbar .modern-header-actions {
    grid-area:actions !important;
    justify-self:start !important;
    min-width:0 !important;
  }
  .homepage-simple-header .centered-logo-navbar .mobile-menu-toggle {
    grid-area:toggle !important;
    justify-self:end !important;
    flex-shrink:0 !important;
  }
  .homepage-simple-header .centered-logo-navbar .modern-nav {
    top:calc(100% - 1px) !important;
  }
}
@media (max-width:680px) {
  .homepage-simple-header .centered-logo-navbar .modern-header-inner {
    min-height:87px !important;
    column-gap:7px !important;
    padding:7px 0 !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand {
    width:clamp(126px,39.5vw,190px) !important;
    height:74px !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand img {
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    max-height:74px !important;
  }
  .homepage-simple-header .centered-logo-navbar .modern-header-actions .lang-switch {
    padding:2px !important;
    min-height:28px !important;
  }
  .homepage-simple-header .centered-logo-navbar .modern-header-actions .lang-switch button {
    min-width:24px !important;
    padding:0 2px !important;
    height:24px !important;
    font-size:9px !important;
  }
  .homepage-simple-header .centered-logo-navbar .mobile-menu-toggle {
    width:38px !important;
    height:38px !important;
  }
}
@media (max-width:360px) {
  .homepage-simple-header .centered-logo-navbar .modern-header-inner {
    width:calc(100% - 18px) !important;
    column-gap:4px !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand {
    width:122px !important;
    height:65px !important;
  }
  .homepage-simple-header .centered-logo-navbar .real-main-brand img {max-height:65px !important;}
  .homepage-simple-header .centered-logo-navbar .mobile-menu-toggle {
    width:34px !important;
    height:34px !important;
  }
}


/* BRANDS PAGE / 2026-10-23: unified four-row continuous strip. */
.brands-page .visually-hidden-brands {
  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;
}
.brands-page .brand-catalog {
  padding:54px 30px 64px;
}
.brands-page .unified-brand-marquee {
  margin-top:0 !important;
  padding:26px 26px !important;
  border-radius:26px;
}
.brands-page .unified-brand-marquee .logo-marquee {
  gap:16px;
}
.brands-page .unified-brand-marquee .logo-marquee-row {
  min-width:0;
  overflow:hidden;
}
.brands-page .unified-brand-marquee .logo-marquee-track,
.brands-page .unified-brand-marquee:hover .logo-marquee-track {
  animation:retailLogoMoveRight 58s linear infinite !important;
  animation-play-state:running !important;
}
.brands-page .unified-brand-marquee .row-2 .logo-marquee-track {animation-duration:62s !important;}
.brands-page .unified-brand-marquee .row-3 .logo-marquee-track {animation-duration:56s !important;}
.brands-page .unified-brand-marquee .row-4 .logo-marquee-track {animation-duration:60s !important;}
@media(max-width:767px) {
  .brands-page .brand-catalog {padding:28px 9px 40px;}
  .brands-page .unified-brand-marquee {padding:17px 10px !important;border-radius:20px;}
  .brands-page .unified-brand-marquee .logo-marquee {gap:10px;}
  .brands-page .unified-brand-marquee .logo-marquee-copy {gap:10px;padding-right:10px;}
  .brands-page .unified-brand-marquee .auto-logo-card {flex-basis:148px;min-width:148px;min-height:126px;padding:12px 9px;}
  .brands-page .unified-brand-marquee .logo-strip-media {height:60px;}
  .brands-page .unified-brand-marquee .logo-strip-media img {max-height:56px;}
  .brands-page .unified-brand-marquee .logo-strip-title {font-size:12px;}
}
@media(prefers-reduced-motion:reduce) {
  .brands-page .unified-brand-marquee .logo-marquee-track,
  .brands-page .unified-brand-marquee:hover .logo-marquee-track {
    animation:none !important;
    transform:none !important;
  }
  .brands-page .unified-brand-marquee .logo-marquee-row {overflow-x:auto;}
}


/* === 2026-10-23 HOME STORES/PARTNERS + FOOTER UPDATE === */
.uploaded-stores-marquee-group:hover .logo-marquee-track{
  animation-play-state:running !important;
}
.uploaded-stores-marquee-group .row-1 .logo-marquee-track{animation-duration:58s !important;}
.uploaded-stores-marquee-group .row-2 .logo-marquee-track{animation-duration:66s !important;}
.uploaded-stores-marquee-group .auto-logo-card{
  min-height:154px;
}
.uploaded-stores-marquee-group .logo-strip-media img{
  object-fit:contain;
}
.footer-enhanced-inner{
  width:100%;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:22px !important;
  padding:16px 0 18px !important;
}
.footer-brand-copy{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}
.footer-brand-copy p{
  margin:0;
  color:#d7e3ef;
  font-size:13px;
  font-weight:600;
}
.footer-quality-badge{
  display:flex;
  align-items:center;
  gap:14px;
  padding:10px 14px 10px 10px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.footer-quality-badge img{
  width:72px;
  height:72px;
  flex:0 0 72px;
  object-fit:contain;
  border-radius:50%;
  background:#f5f7f8;
}
.footer-quality-copy{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.footer-quality-copy strong{
  color:#ffffff;
  font-size:14px;
  font-weight:800;
  letter-spacing:-.02em;
}
.footer-quality-copy span{
  color:#a9bed2;
  font-size:11px;
  line-height:1.45;
  max-width:240px;
}
@media (max-width:991px){
  .footer-enhanced-inner{
    align-items:flex-start !important;
    flex-direction:column !important;
  }
  .footer-quality-badge{
    width:100%;
  }
}
@media (max-width:640px){
  .footer-brand-copy{
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
  }
  .footer-quality-badge{
    gap:10px;
    padding:9px 12px 9px 9px;
    border-radius:18px;
  }
  .footer-quality-badge img{
    width:58px;
    height:58px;
    flex-basis:58px;
  }
  .footer-quality-copy strong{font-size:13px;}
  .footer-quality-copy span{font-size:10px;}
}


/* === 2026-10-23 FIXES: footer, instagram, cards, license page === */
.footer-simple-clean{
  min-height:74px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:16px !important;
  padding:14px 0 !important;
}
.footer-simple-clean p{
  margin:0;
  color:#d7e3ef;
  font-size:13px;
  font-weight:600;
}
@media (max-width:640px){
  .footer-simple-clean{
    flex-direction:column !important;
    align-items:flex-start !important;
  }
}

/* Instagram handle full visibility */
.social-action{align-items:flex-start;}
.social-action-copy{min-width:0; width:100%;}
.social-action-copy strong{
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  word-break:break-word;
  line-height:1.24;
}
.social-action.social-action-instagram .social-action-copy strong{
  font-size:13px;
}

/* remove jitter / 3D shake from service cards */
.nike-service-card,
.projects .nike-service-card{
  transform:none !important;
  transform-style:flat !important;
  backface-visibility:hidden;
  will-change:auto !important;
}
.nike-service-card:hover,
.projects .nike-service-card:hover{
  transform:none !important;
  box-shadow:0 22px 46px rgba(24,24,24,.11) !important;
}
.projects .nike-card-top,
.projects .nike-card-info{
  transform:none !important;
}
.service-photo-stage,
.service-photo-slide img,
.nike-card-top,
.nike-card-info{
  backface-visibility:hidden;
}

/* premium certificate-style licenses page */
.cert-page .engineering-shell{
  padding:28px 0 70px;
}
.cert-hero{
  max-width:860px;
  margin:0 auto 26px;
  text-align:center;
  padding:30px 22px 10px;
}
.cert-hero .section-kicker{
  display:inline-flex;
  margin-bottom:14px;
}
.cert-hero h1{
  margin:0;
  color:#1b2431;
  font-size:clamp(34px,4.4vw,58px);
  line-height:1.03;
  letter-spacing:-.045em;
}
.cert-hero h1 span{color:#f26a21;}
.cert-hero p{
  margin:16px auto 0;
  max-width:690px;
  color:#627284;
  font-size:16px;
  line-height:1.7;
}
.cert-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:28px;
  padding:10px 0 8px;
}
.cert-card{
  display:block;
  text-decoration:none;
  color:inherit;
  background:linear-gradient(180deg,#fffdfa 0%,#f7f2ea 100%);
  border:1px solid #e9dfcf;
  border-radius:30px;
  padding:22px;
  box-shadow:0 20px 42px rgba(28,28,28,.08), inset 0 1px 0 rgba(255,255,255,.86);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.cert-card:hover{
  transform:translateY(-5px);
  border-color:#d8c3a7;
  box-shadow:0 28px 56px rgba(28,28,28,.11), inset 0 1px 0 rgba(255,255,255,.9);
}
.cert-frame{
  padding:12px;
  border-radius:22px;
  background:linear-gradient(145deg,#1f3a39 0%,#2c5350 28%,#d6c29d 28.5%,#efe5d0 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);
}
.cert-frame-inner{
  border-radius:16px;
  background:#fbf7ef;
  padding:18px;
  border:1px solid rgba(64,77,70,.18);
  box-shadow:inset 0 0 0 6px rgba(236,225,203,.8);
}
.cert-frame-inner img{
  display:block;
  width:100%;
  height:540px;
  object-fit:cover;
  object-position:top center;
  border-radius:8px;
  background:#fffdf8;
  box-shadow:0 18px 36px rgba(22,22,22,.08);
}
.cert-meta{
  padding:18px 6px 2px;
}
.cert-meta h3{
  margin:0 0 8px;
  color:#1d2430;
  font-size:22px;
  line-height:1.2;
  letter-spacing:-.03em;
}
.cert-meta strong{
  display:block;
  color:#9b6a33;
  font-size:15px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.cert-meta span{
  display:inline-flex;
  margin-top:10px;
  color:#4c5b6c;
  font-size:13px;
  font-weight:700;
}
.cert-page-back{padding-top:24px;}
@media (max-width:991px){
  .cert-grid{grid-template-columns:1fr; gap:22px;}
  .cert-frame-inner img{height:500px;}
}
@media (max-width:640px){
  .cert-page .engineering-shell{padding-top:16px;}
  .cert-hero{padding:20px 8px 6px;}
  .cert-hero p{font-size:14px;}
  .cert-card{padding:14px; border-radius:24px;}
  .cert-frame{padding:8px; border-radius:18px;}
  .cert-frame-inner{padding:10px; border-radius:14px;}
  .cert-frame-inner img{height:380px;}
  .cert-meta{padding:14px 2px 2px;}
  .cert-meta h3{font-size:18px;}
}


/* === 2026-10-23 STAMP + MOBILE BRAND RESPONSIVE FIX === */
.service-247-visual{
  position:relative;
}
.service-247-stamp{
  position:absolute;
  left:18px;
  bottom:20px;
  width:170px;
  height:170px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  border:5px solid #214ea0;
  background:radial-gradient(circle at center,rgba(255,255,255,.94) 0%,rgba(255,255,255,.88) 58%,rgba(230,237,255,.82) 100%);
  box-shadow:0 16px 34px rgba(16,33,73,.22);
  transform:rotate(-15deg);
  z-index:3;
  isolation:isolate;
}
.service-247-stamp::before,
.service-247-stamp::after{
  content:'';
  position:absolute;
  inset:10px;
  border:2px dashed rgba(33,78,160,.42);
  border-radius:50%;
}
.service-247-stamp::after{
  inset:22px;
  border-style:solid;
  border-color:rgba(33,78,160,.28);
}
.service-247-stamp-ring,
.service-247-stamp-bottom{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  color:#214ea0;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.14em;
  white-space:nowrap;
}
.service-247-stamp-ring{top:22px;}
.service-247-stamp-bottom{bottom:24px;}
.service-247-stamp-banner{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:170px;
  padding:15px 18px;
  background:#214ea0;
  color:#fff;
  font-size:28px;
  line-height:1;
  font-weight:900;
  letter-spacing:-.04em;
  text-transform:uppercase;
  box-shadow:0 8px 18px rgba(16,33,73,.24);
}
.service-247-stamp-banner::before,
.service-247-stamp-banner::after{
  content:'';
  position:absolute;
  top:50%;
  width:20px;
  height:20px;
  background:#214ea0;
  transform:translateY(-50%) rotate(45deg);
  z-index:-1;
}
.service-247-stamp-banner::before{left:-8px;}
.service-247-stamp-banner::after{right:-8px;}

/* mobile-safe logo rows: prevent breaking/scattering */
@media (max-width:767px){
  .brands-page .unified-brand-marquee{padding:14px 8px !important;}
  .brands-page .unified-brand-marquee .logo-marquee{gap:8px;}
  .brands-page .unified-brand-marquee .logo-marquee-row,
  .uploaded-stores-marquee-group .logo-marquee-row{
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-bottom:4px;
  }
  .brands-page .unified-brand-marquee .logo-marquee-row::-webkit-scrollbar,
  .uploaded-stores-marquee-group .logo-marquee-row::-webkit-scrollbar{display:none;}
  .brands-page .unified-brand-marquee .logo-marquee-track,
  .brands-page .unified-brand-marquee:hover .logo-marquee-track,
  .uploaded-stores-marquee-group .logo-marquee-track,
  .uploaded-stores-marquee-group:hover .logo-marquee-track{
    animation:none !important;
    transform:none !important;
    width:max-content !important;
  }
  .brands-page .unified-brand-marquee .logo-marquee-copy[aria-hidden="true"],
  .uploaded-stores-marquee-group .logo-marquee-copy[aria-hidden="true"]{display:none !important;}

  .brands-page .unified-brand-marquee .auto-logo-card,
  .uploaded-stores-marquee-group .auto-logo-card{
    flex:0 0 132px !important;
    min-width:132px !important;
    min-height:118px !important;
    padding:10px 8px !important;
    border-radius:18px !important;
    gap:10px !important;
  }
  .brands-page .unified-brand-marquee .logo-strip-media,
  .uploaded-stores-marquee-group .logo-strip-media{
    height:52px !important;
  }
  .brands-page .unified-brand-marquee .logo-strip-media img,
  .uploaded-stores-marquee-group .logo-strip-media img{
    max-height:48px !important;
    max-width:100% !important;
  }
  .brands-page .unified-brand-marquee .logo-strip-title,
  .uploaded-stores-marquee-group .logo-strip-title{
    font-size:11px !important;
    line-height:1.25 !important;
    word-break:break-word;
    overflow-wrap:anywhere;
  }
  .service-247-stamp{
    width:122px;
    height:122px;
    left:10px;
    bottom:12px;
    border-width:4px;
  }
  .service-247-stamp::before{inset:8px;}
  .service-247-stamp::after{inset:17px;}
  .service-247-stamp-ring,
  .service-247-stamp-bottom{font-size:8px;letter-spacing:.1em;}
  .service-247-stamp-ring{top:16px;}
  .service-247-stamp-bottom{bottom:17px;}
  .service-247-stamp-banner{min-width:118px;padding:10px 12px;font-size:18px;}
  .service-247-stamp-banner::before,
  .service-247-stamp-banner::after{width:14px;height:14px;}
  .service-247-stamp-banner::before{left:-5px;}
  .service-247-stamp-banner::after{right:-5px;}
}


/* === CONTACT TEXT + EMAIL REQUEST / 2026-10-23 === */
/* Keep the Instagram account on one line at all widths. */
.social-action-instagram .social-action-copy{
  flex:1 1 auto;
  min-width:0;
  width:auto;
}
.social-action-instagram .social-action-copy strong{
  display:block;
  width:max-content;
  max-width:none;
  font-size:clamp(11px,1.05vw,13px) !important;
  letter-spacing:-.035em !important;
  white-space:nowrap !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
}
.social-action-instagram .social-action-icon{flex-shrink:0;}
@media(max-width:380px){
  .social-action-instagram{gap:9px;padding-inline:9px;}
  .social-action-instagram .social-action-icon{flex-basis:37px;width:37px;height:37px;}
  .social-action-instagram .social-action-copy strong{font-size:11px !important;}
}
.request-send-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.request-send-actions .request-submit{width:100%;min-width:0;padding-inline:14px;}
.request-email-submit{
  background:#173b58 !important;
  box-shadow:0 12px 26px rgba(23,59,88,.14) !important;
}
.request-email-submit:hover{background:#235375 !important;}
.request-email-submit:disabled{opacity:.65;cursor:wait;transform:none;}
.mail-dot{font-size:20px;font-weight:700;line-height:1;}
.request-honeypot{position:absolute !important;left:-99999px !important;width:1px !important;height:1px !important;opacity:0 !important;}
.request-email-status{margin:12px 0 0;padding:12px 14px;border-radius:14px;font-size:13px;line-height:1.5;}
.request-email-status[hidden]{display:none !important;}
.request-email-status.is-success{background:#e8f5ee;color:#14613a;}
.request-email-status.is-error{background:#fff0ee;color:#9b2c26;}
@media(max-width:680px){.request-send-actions{grid-template-columns:1fr;}}


/* === 2026-10-23 MOBILE BRANDS PAGE HARD FIX === */
@media (max-width:767px){
  .brands-page .custom-brand-catalog{
    padding:22px 10px 34px !important;
  }
  .brands-page .unified-brand-marquee{
    padding:14px 10px !important;
    border-radius:22px !important;
    overflow:hidden !important;
  }
  .brands-page .unified-brand-marquee .logo-marquee{
    display:grid !important;
    gap:14px !important;
  }
  .brands-page .unified-brand-marquee .logo-marquee-row{
    overflow:visible !important;
  }
  .brands-page .unified-brand-marquee .logo-marquee-row::before,
  .brands-page .unified-brand-marquee .logo-marquee-row::after{
    display:none !important;
  }
  .brands-page .unified-brand-marquee .logo-marquee-track,
  .brands-page .unified-brand-marquee:hover .logo-marquee-track{
    display:block !important;
    width:100% !important;
    animation:none !important;
    transform:none !important;
  }
  .brands-page .unified-brand-marquee .logo-marquee-copy{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:14px !important;
    width:100% !important;
    padding-right:0 !important;
  }
  .brands-page .unified-brand-marquee .logo-marquee-copy[aria-hidden="true"]{
    display:none !important;
  }
  .brands-page .unified-brand-marquee .auto-logo-card,
  .brands-page .unified-brand-marquee .logo-strip-card{
    flex:none !important;
    width:100% !important;
    min-width:0 !important;
    min-height:148px !important;
    padding:14px 10px !important;
    gap:12px !important;
    border-radius:18px !important;
  }
  .brands-page .unified-brand-marquee .logo-strip-media{
    height:74px !important;
  }
  .brands-page .unified-brand-marquee .logo-strip-media img{
    max-width:100% !important;
    max-height:64px !important;
  }
  .brands-page .unified-brand-marquee .logo-strip-title{
    font-size:12px !important;
    line-height:1.25 !important;
    text-align:center !important;
    white-space:normal !important;
    word-break:break-word !important;
  }
}
@media (max-width:420px){
  .brands-page .unified-brand-marquee .logo-marquee-copy{
    gap:12px !important;
  }
  .brands-page .unified-brand-marquee .auto-logo-card,
  .brands-page .unified-brand-marquee .logo-strip-card{
    min-height:136px !important;
    padding:12px 8px !important;
  }
  .brands-page .unified-brand-marquee .logo-strip-media{
    height:66px !important;
  }
  .brands-page .unified-brand-marquee .logo-strip-media img{
    max-height:56px !important;
  }
  .brands-page .unified-brand-marquee .logo-strip-title{
    font-size:11px !important;
  }
}


/* === 2026-10-23 CONTACT ICON/UI POLISH === */
.contact-info-card{
  align-items:center;
  gap:16px !important;
}
.contact-info-card span:last-child{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.contact-info-icon.icon-ui{
  width:64px !important;
  height:64px !important;
  flex:0 0 64px !important;
  border-radius:18px !important;
  display:grid !important;
  place-items:center !important;
  color:#ff6b2c !important;
  background:linear-gradient(180deg,#fff7f1 0%,#ffe9db 100%) !important;
  border:1px solid #f5ddcf !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.92), 0 12px 24px rgba(240,122,54,.08) !important;
}
.contact-info-icon.icon-ui.whatsapp,
.contact-info-icon.icon-ui-whatsapp{
  color:#16a34a !important;
  background:linear-gradient(180deg,#effaf2 0%,#ddf4e5 100%) !important;
  border-color:#d2ebda !important;
}
.contact-info-icon.icon-ui svg,
.social-action-icon svg,
.request-icon-ui svg{
  width:28px;
  height:28px;
  display:block;
}

.request-send-actions{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.request-submit{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:14px !important;
}
.request-icon-ui{
  width:46px;
  height:46px;
  border-radius:999px;
  display:grid;
  place-items:center;
  flex:0 0 46px;
  background:rgba(255,255,255,.92);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95), 0 8px 16px rgba(0,0,0,.08);
  color:#16a34a;
}
.request-icon-mail{
  color:#1d4d76;
}
.request-icon-ui svg{width:24px;height:24px;}

.social-action{
  align-items:center !important;
  gap:14px !important;
}
.social-action-icon{
  flex:0 0 52px !important;
  width:52px !important;
  height:52px !important;
  border-radius:16px !important;
  display:grid !important;
  place-items:center !important;
  background:linear-gradient(135deg,#5474ff 0%,#4260f0 100%) !important;
  color:#ffffff !important;
  box-shadow:0 12px 24px rgba(66,96,240,.28), inset 0 1px 0 rgba(255,255,255,.22) !important;
}
.social-action-icon-phone{
  background:linear-gradient(135deg,#4f74ff 0%,#2e56ee 100%) !important;
}
.social-action-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.social-action-copy small{
  letter-spacing:.08em;
}
.social-action-instagram .social-action-copy{
  align-items:center !important;
  text-align:center !important;
}
.social-action-instagram .social-action-copy small,
.social-action-instagram .social-action-copy strong{
  text-align:center !important;
  width:100%;
}
.social-action-phone .social-action-copy{
  align-items:center !important;
  text-align:center !important;
}

@media (max-width:767px){
  .contact-info-icon.icon-ui{
    width:58px !important;
    height:58px !important;
    flex-basis:58px !important;
    border-radius:16px !important;
  }
  .contact-info-icon.icon-ui svg{width:25px;height:25px;}
  .social-action-icon{
    flex-basis:48px !important;
    width:48px !important;
    height:48px !important;
    border-radius:15px !important;
  }
  .social-action-icon svg{width:24px;height:24px;}
  .social-action-instagram .social-action-copy small{
    margin-bottom:2px;
  }
}


/* CTA four-value feature row | isolated to the homepage footer promo */
#contact .cta-inner > .cta-service-benefits {
  grid-column: 1 / -1;
  grid-row: 1;
  max-width: none !important;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 0 0 13px;
  text-align: center !important;
}
#contact .cta-service-benefit {
  min-width: 0;
  min-height: 157px;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  padding: 21px 10px 17px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 23px;
  background: linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.025));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09),0 13px 34px rgba(0,0,0,.11);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: border-color .2s ease, background .2s ease;
}
#contact .cta-service-benefit:hover {
  border-color: rgba(255,137,88,.48);
  background: linear-gradient(165deg,rgba(255,255,255,.14),rgba(255,123,66,.04));
}
#contact .cta-service-icon {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: rgba(255,117,62,.12);
  border: 1px solid rgba(255,139,90,.16);
  color: #ff8956;
}
#contact .cta-service-icon svg {width: 25px; height: 25px; display:block;}
#contact .cta-service-benefit strong {
  color: #fff;
  font: 800 15px/1.25 "Manrope",system-ui,sans-serif;
  letter-spacing: -.025em;
  text-wrap: balance;
}
#contact .cta-service-subtitle {
  color: #bfc2c8;
  font: 500 11px/1.4 "Manrope",system-ui,sans-serif;
  text-wrap: balance;
}
#contact .cta-inner > .cta-heading {
  min-width: 0;
  max-width: 720px;
  grid-column: 1;
  grid-row: 2;
}
#contact .cta-inner > .cta-actions {grid-row: 2;}
#contact .cta-inner > .footer-social-card {grid-row: 2;}
@media (max-width: 1180px){
  #contact .cta-inner > .footer-social-card {grid-row: 3;}
}
@media (max-width: 800px){
  #contact .cta-inner > .cta-service-benefits {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-bottom: 6px;
  }
  #contact .cta-service-benefit {min-height: 133px; border-radius:18px; padding:15px 9px 13px; gap:7px;}
  #contact .cta-service-icon {width:42px;height:42px;flex-basis:42px;border-radius:14px;}
  #contact .cta-service-icon svg{width:23px;height:23px;}
  #contact .cta-service-benefit strong{font-size:13px;}
  #contact .cta-service-subtitle{font-size:10px;}
}
@media (max-width: 380px){
  #contact .cta-service-benefit {min-height:123px; padding-inline:6px;}
  #contact .cta-service-benefit strong {font-size:12px;}
  #contact .cta-service-subtitle {font-size:9px;}
}
@media (min-width: 701px) and (max-width: 1180px){
  #contact .cta-inner > .cta-service-benefits {
    grid-column: 1 / 3 !important;
  }
}


/* LICENSES RESPONSIVE V20261023 — scoped to lisenziyalar.html only.
   Keep desktop layout untouched; use natural A4 portrait aspect ratio. */
@media (max-width: 991px) {
  .cert-page {
    overflow-x: clip;
  }
  .cert-page .engineering-shell {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0;
    padding: 0 0 50px !important;
  }
  .cert-page .cert-hero {
    box-sizing: border-box;
    max-width: 740px;
    margin: 0 auto 12px;
    padding: 38px 24px 24px;
  }
  .cert-page .cert-hero h1 {
    line-height: 1.11;
    overflow-wrap: break-word;
  }
  .cert-page .cert-grid {
    box-sizing: border-box;
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    padding: 6px 18px 22px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    align-items: stretch;
  }
  .cert-page .cert-card {
    box-sizing: border-box;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    padding: 14px;
    border: 1px solid #e5e4df;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(19, 31, 45, .055);
  }
  .cert-page .cert-frame {
    box-sizing: border-box;
    min-width: 0;
    width: 100%;
    padding: 8px;
    border-radius: 16px;
    background: linear-gradient(150deg, #dce7e2, #eae1d3);
    box-shadow: none;
  }
  .cert-page .cert-frame-inner {
    box-sizing: border-box;
    min-width: 0;
    width: 100%;
    padding: 8px;
    border: 1px solid rgba(95, 111, 99, .12);
    border-radius: 12px;
    background: #fffdf8;
    box-shadow: none;
  }
  .cert-page .cert-frame-inner img {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 1447 / 2048;
    object-fit: contain !important;
    object-position: center !important;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 4px 18px rgba(25, 35, 45, .06);
  }
  .cert-page .cert-meta {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    flex: 1;
    padding: 15px 6px 4px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
  }
  .cert-page .cert-meta h3 {
    margin: 0;
    font-size: 17px;
    line-height: 1.4;
    letter-spacing: -.025em;
    overflow-wrap: break-word;
  }
  .cert-page .cert-meta strong {
    font-size: 12px;
    letter-spacing: .01em;
  }
  .cert-page .cert-meta span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    margin-top: auto;
    padding: 8px 12px;
    background: #f5f7f6;
    border: 1px solid #e4e9e5;
    border-radius: 999px;
    color: #285f59;
    font-size: 12px;
    font-weight: 800;
  }
  .cert-page .cert-page-back {
    padding: 20px 16px 14px;
  }
}
@media (max-width: 620px) {
  .cert-page .cert-hero {
    margin-bottom: 4px;
    padding: 24px 18px 18px;
  }
  .cert-page .cert-hero .section-kicker {
    font-size: 11px;
    letter-spacing: .10em;
    margin-bottom: 12px;
  }
  .cert-page .cert-hero h1 {
    font-size: clamp(30px, 8.3vw, 42px);
    line-height: 1.10;
    letter-spacing: -.045em;
  }
  .cert-page .cert-hero p {
    max-width: 430px;
    margin-top: 12px;
    font-size: 13px;
    line-height: 1.65;
  }
  .cert-page .cert-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    padding: 4px 14px 16px;
  }
  .cert-page .cert-card {
    max-width: 480px;
    margin: 0 auto;
    padding: 13px;
    border-radius: 22px;
  }
  .cert-page .cert-frame {
    padding: 7px;
    border-radius: 15px;
  }
  .cert-page .cert-frame-inner {
    padding: 7px;
    border-radius: 10px;
  }
  .cert-page .cert-meta {
    padding: 14px 5px 3px;
    gap: 5px;
  }
  .cert-page .cert-meta h3 {
    font-size: 16px;
    line-height: 1.37;
  }
  .cert-page .cert-meta span {
    margin-top: 7px;
  }
}
@media (max-width: 350px) {
  .cert-page .cert-grid {
    padding-inline: 10px;
    gap: 14px;
  }
  .cert-page .cert-card {
    padding: 11px;
  }
  .cert-page .cert-frame,
  .cert-page .cert-frame-inner {
    padding: 6px;
  }
  .cert-page .cert-hero {
    padding-inline: 13px;
  }
  .cert-page .cert-meta h3 {
    font-size: 15px;
  }
}


/* === ABOUT SERVICE POSTERS / full uncropped images / desktop and mobile === */
.about-reference .service-poster-slider{
  display:flex !important;
  flex-direction:column !important;
  width:100% !important;
  max-width:620px !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 !important;
  margin:0 auto !important;
  align-self:center;
  overflow:visible !important;
}
.about-reference .service-poster-slider .about-photo-stage{
  order:1;
  display:block;
  position:relative;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  aspect-ratio: 3 / 4;
  overflow:hidden !important;
  margin:0 !important;
  padding:0 !important;
  border:1px solid rgba(19,66,115,.12);
  border-radius:22px !important;
  background:#f8fbff !important;
  box-shadow:0 18px 50px rgba(21,47,77,.12);
}
.about-reference .service-poster-slider .about-photo-slide{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:hidden;
  transform:none !important;
  transition:opacity .42s ease !important;
}
.about-reference .service-poster-slider .about-photo-slide img{
  display:block;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.about-reference .service-poster-slider .about-ref-badge{
  order:0;
  position:static !important;
  top:auto !important;
  left:auto !important;
  width:max-content !important;
  max-width:100%;
  height:auto !important;
  min-width:0;
  min-height:0;
  display:inline-flex !important;
  flex-direction:row;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  padding:7px 14px;
  margin:0 0 12px;
  border-radius:999px;
  border:1px solid #d9e9f6;
  background:#f4f9fe;
  box-shadow:none;
  color:#244865;
}
.about-reference .service-poster-slider .about-ref-badge strong{
  font-size:17px !important;
  color:#178ace;
  line-height:1.1;
}
.about-reference .service-poster-slider .about-ref-badge span{
  margin:0;
  font-size:10px !important;
  line-height:1.2;
  letter-spacing:.035em;
  font-weight:800;
}
.about-reference .service-poster-slider .about-corner{display:none !important;}
.about-reference .service-poster-slider .about-poster-controls{
  order:2;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  padding:13px 0 0;
}
.about-reference .service-poster-slider .about-photo-arrow{
  position:static !important;
  inset:auto !important;
  transform:none !important;
  width:42px;
  height:42px;
  border-radius:50%;
  border:1px solid #dce7f2;
  background:#fff;
  color:#163f67;
  box-shadow:0 7px 17px rgba(22,55,96,.08);
}
.about-reference .service-poster-slider .about-photo-arrow:hover{
  transform:none !important;
  background:#133c65;
  border-color:#133c65;
  color:#fff;
}
.about-reference .service-poster-slider .about-photo-dots{
  position:static !important;
  inset:auto !important;
  transform:none !important;
  display:flex;
  gap:8px;
}
.about-reference .service-poster-slider .about-photo-dot{
  background:#c8d7e6;
  box-shadow:none;
  width:9px;
  height:9px;
}
.about-reference .service-poster-slider .about-photo-dot.active{
  width:28px;
  background:#109ed9;
}
@media (max-width:920px){
  .about-reference .service-poster-slider{
    max-width:540px !important;
  }
}
@media (max-width:600px){
  .about-reference .service-poster-slider{
    max-width:100% !important;
    padding:0 !important;
  }
  .about-reference .service-poster-slider .about-photo-stage{
    aspect-ratio: 3 / 4;
    border-radius:17px !important;
    height:auto !important;
  }
  .about-reference .service-poster-slider .about-poster-controls{
    padding-top:11px;
    gap:14px;
  }
  .about-reference .service-poster-slider .about-photo-arrow{
    width:38px;
    height:38px;
  }
}
@media (prefers-reduced-motion:reduce){
  .about-reference .service-poster-slider .about-photo-slide{transition:none !important;}
}

/* Link each poster to its sharp full-resolution version. */
.about-reference .service-poster-slider .about-poster-open{
  display:block;
  width:100%;
  height:100%;
  cursor:zoom-in;
}
.about-reference .service-poster-slider .about-poster-open:focus-visible{
  outline:3px solid #109ed9;
  outline-offset:-3px;
}
.about-reference .service-poster-slider .about-poster-hint{
  order:3;
  display:none;
  margin:8px 0 0;
  text-align:center;
  font-size:11px;
  color:#64748b;
}
@media (max-width:600px){
  .about-reference .service-poster-slider .about-poster-hint{display:block;}
}


/* Final patch — remove poster open behavior + improve service gallery image clarity */
.about-reference .service-poster-slider .about-poster-open{
  display:block;
  cursor:default !important;
  pointer-events:none !important;
  text-decoration:none !important;
}
.about-reference .service-poster-slider .about-poster-hint{display:none !important;}
.product-showcase-stage{background:#0f1b2b !important;}
.product-showcase-image{
  object-fit:cover;
  object-position:center center;
  background:#0f1b2b;
}
@media (max-width:600px){
  .about-reference .product-showcase-stage{height:355px !important;}
  .product-showcase-overlay{align-items:flex-end;}
  .product-showcase-summary h4{font-size:22px !important;max-width:60%;}
  .product-showcase-thumbnails{flex-direction:column;gap:6px;}
  .product-showcase-thumb{width:54px !important;height:68px !important;}
}


/* ==========================================================
   FINAL IMAGE REFRESH + ENGINEERING SUMMARY BACKGROUNDS v20261023
   ========================================================== */
.engineering-summary-card{
  isolation:isolate;
}
.engineering-summary-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background-position:center center;
  background-size:cover;
  background-repeat:no-repeat;
  opacity:.24;
  transition:opacity .28s ease, transform .35s ease;
}
.engineering-summary-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.90));
  transition:background .28s ease;
}
.engineering-summary-card:nth-child(1)::before{background-image:url('assets/backgrounds/hvac-soft-v2.webp');}
.engineering-summary-card:nth-child(2)::before{background-image:url('assets/backgrounds/construction-soft-v2.webp');}
.engineering-summary-card:nth-child(3)::before{background-image:url('assets/backgrounds/crane-blur-v2.webp'); opacity:.33;}
.engineering-summary-card:nth-child(4)::before{background-image:url('assets/backgrounds/project-soft-v2.webp');}
.engineering-summary-card:hover::before{opacity:.36; transform:scale(1.05);}
.engineering-summary-card:nth-child(3):hover::before{opacity:.42;}
.engineering-summary-card:hover::after{background:linear-gradient(180deg,rgba(0,0,0,.22),rgba(0,0,0,.18));}

.feature-ref-image-v67 img,
.about-service-image img,
.real-hero-photo img,
.service-photo-slide img{
  image-rendering:auto;
}

@media (max-width: 980px){
  .engineering-summary-card::before{opacity:.22;}
}