
  :root{
    --bg: #0c0c0d;
    --bg-alt: #131315;
    --card: #17171a;
    --orange: #ff6a13;
    --orange-dark: #e05c0e;
    --white: #f5f5f5;
    --grey: #9a9a9f;
    --border: #2a2a2d;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  body{
    background:var(--bg);
    color:var(--white);
    font-family:'Inter', sans-serif;
    line-height:1.5;
  }
  h1,h2,h3,h4{
    font-family:'Poppins', sans-serif;
    font-weight:800;
  }
  a{color:inherit;text-decoration:none;}
  img{display:block;max-width:100%;}
  .container{
    max-width:1200px;
    margin:0 auto;
    padding:0 24px;
  }
  .accent{color:var(--orange);}

  /* ---------- Header ---------- */
  header{
    position:sticky;top:0;z-index:100;
    background:rgba(10,10,11,0.92);
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--border);
  }
  .nav-wrap{
    display:flex;align-items:center;justify-content:space-between;
    padding:16px 24px;
    max-width:1200px;margin:0 auto;
  }
  .logo{
    display:flex;align-items:center;gap:12px;
    font-family:'Poppins',sans-serif;font-weight:800;
    font-size:1.15rem;letter-spacing:0.5px;
  }
  .logo svg{width:44px;height:44px;flex-shrink:0;}
  .logo .sub{
    display:block;font-family:'Inter',sans-serif;font-weight:500;
    font-size:0.6rem;color:var(--grey);letter-spacing:1.5px;
  }
  nav.links{
    display:flex;align-items:center;gap:34px;
  }
  nav.links a{
    font-size:0.85rem;font-weight:600;letter-spacing:0.3px;
    color:var(--white);
    padding-bottom:6px;
    border-bottom:2px solid transparent;
    transition:color .2s, border-color .2s;
    white-space:nowrap;
  }
  nav.links a:hover, nav.links a.active{
    color:var(--orange);
    border-color:var(--orange);
  }
  .btn{
    display:inline-flex;align-items:center;gap:8px;
    font-size:0.8rem;font-weight:700;letter-spacing:0.3px;
    padding:12px 22px;border-radius:6px;
    cursor:pointer;border:none;white-space:nowrap;
    transition:transform .15s ease, background .2s ease, box-shadow .2s ease;
  }
  .btn:hover{transform:translateY(-2px);}
  .btn-primary{
    background:var(--orange);color:#0c0c0d;
    box-shadow:0 4px 14px rgba(255,106,19,0.25);
  }
  .btn-primary:hover{background:var(--orange-dark);}
  .btn-outline{
    background:transparent;color:var(--white);
    border:1.5px solid #3a3a3d;
  }
  .btn-outline:hover{border-color:var(--orange);color:var(--orange);}
  .btn-outline-orange{
    background:transparent;color:var(--orange);
    border:1.5px solid var(--orange);
  }
  .btn-outline-orange:hover{background:var(--orange);color:#0c0c0d;}

  /* ---------- Hero ---------- */
  .hero{
    position:relative;
    background:var(--bg);
    padding:70px 0 90px;
    overflow:hidden;
  }
  .hero-grid{
    display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;
  }
  .hero h1{
    font-size:2.9rem;line-height:1.12;letter-spacing:-0.5px;
    margin-bottom:22px;
  }
  .hero h1 .line3{color:var(--orange);display:block;}
  .hero p{
    color:var(--grey);font-size:1rem;max-width:480px;margin-bottom:34px;
  }
  .hero-ctas{display:flex;gap:16px;margin-bottom:52px;flex-wrap:wrap;}
  .hero-figure{
    position:relative;border-radius:10px;overflow:hidden;
    aspect-ratio:4/3;
    filter:grayscale(45%) contrast(1.05);
  }
  .hero-figure img{width:100%;height:100%;object-fit:cover;}
  .hero-figure::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(120deg, rgba(255,106,19,0.12), transparent 55%);
  }
  .trust-row{
    display:grid;grid-template-columns:repeat(3,1fr);gap:36px;
  }
  .trust-item{display:flex;gap:14px;align-items:flex-start;}
  .trust-item .icon{
    width:42px;height:42px;flex-shrink:0;
    border:1.5px solid var(--orange);border-radius:8px;
    display:flex;align-items:center;justify-content:center;color:var(--orange);
  }
  .trust-item h4{font-size:0.92rem;margin-bottom:4px;}
  .trust-item p{font-size:0.8rem;color:var(--grey);line-height:1.4;}

  /* ---------- Section heading ---------- */
  .section-heading{text-align:center;margin-bottom:46px;}
  .section-heading h2{
    font-size:2.1rem;letter-spacing:-0.3px;
    position:relative;display:inline-block;padding-bottom:14px;
  }
  .section-heading h2::after{
    content:"";position:absolute;left:50%;bottom:0;
    transform:translateX(-50%);
    width:64px;height:3px;background:var(--orange);border-radius:2px;
  }

  /* ---------- Services ---------- */
  .services{padding:100px 0 90px;background:var(--bg-alt);}
  .services-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
    margin-bottom:40px;
  }
  .service-card{
    background:var(--card);
    border:1px solid var(--border);
    border-radius:10px;
    padding:34px 26px;
    transition:border-color .2s, transform .2s;
  }
  .service-card:hover{
    border-color:var(--orange);
    transform:translateY(-4px);
  }
  .service-card .icon{
    width:54px;height:54px;
    border:1.5px solid var(--orange);border-radius:10px;
    display:flex;align-items:center;justify-content:center;
    color:var(--orange);margin-bottom:20px;
  }
  .service-card h3{font-size:1rem;letter-spacing:0.3px;margin-bottom:10px;}
  .service-card p{font-size:0.85rem;color:var(--grey);}
  .center{display:flex;justify-content:center;}

  /* ---------- About ---------- */
  .about{padding:100px 0;}
  .about-grid{
    display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center;
  }
  .about-grid h2{font-size:2.1rem;margin-bottom:22px;}
  .about-grid p{color:var(--grey);margin-bottom:16px;font-size:0.95rem;max-width:480px;}
  .stats-grid{
    display:grid;grid-template-columns:1fr 1fr;gap:28px 36px;
  }
  .stat{display:flex;gap:14px;align-items:flex-start;}
  .stat .icon{
    width:46px;height:46px;flex-shrink:0;
    border:1.5px solid var(--orange);border-radius:8px;
    display:flex;align-items:center;justify-content:center;color:var(--orange);
  }
  .stat .num{font-size:1.7rem;font-weight:800;color:var(--orange);line-height:1;font-family:'Poppins',sans-serif;}
  .stat .label{font-size:0.72rem;color:var(--grey);letter-spacing:0.4px;text-transform:uppercase;margin-top:4px;}

  /* ---------- References ---------- */
  .refs{padding:100px 0 90px;background:var(--bg-alt);}
  .refs-grid{
    display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-bottom:40px;
  }
  .ref-card{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:3/4;}
  .ref-card img{width:100%;height:100%;object-fit:cover;filter:grayscale(20%);transition:transform .35s ease, filter .35s ease;}
  .ref-card:hover img{transform:scale(1.06);filter:grayscale(0%);}
  .ref-card .label{
    position:absolute;left:0;right:0;bottom:0;
    padding:14px 10px 10px;
    background:linear-gradient(0deg, rgba(0,0,0,0.85), transparent);
    font-size:0.72rem;font-weight:700;letter-spacing:0.3px;text-align:center;
    text-transform:uppercase;
  }

  /* ---------- Footer ---------- */
  footer{padding:70px 0 0;}
  .footer-grid{
    display:grid;grid-template-columns:repeat(4,1fr) 1.1fr;gap:28px;
    padding-bottom:50px;border-bottom:1px solid var(--border);
  }
  .footer-item h4{
    font-size:0.68rem;letter-spacing:1px;text-transform:uppercase;
    color:var(--grey);margin-bottom:10px;font-weight:700;
  }
  .footer-item .row{display:flex;gap:12px;align-items:flex-start;}
  .footer-item .row .icon{color:var(--orange);flex-shrink:0;margin-top:2px;}
  .footer-item p{font-size:0.88rem;color:#d5d5d7;}
  .map-box{
    border-radius:8px;overflow:hidden;height:110px;
    background:#dcdcdc;position:relative;
  }
  .map-box img{width:100%;height:100%;object-fit:cover;filter:grayscale(35%);}
  .map-pin{
    position:absolute;top:50%;left:55%;transform:translate(-50%,-100%);
    color:var(--orange);
  }
  .footer-bottom{
    display:flex;justify-content:space-between;align-items:center;
    padding:26px 0;flex-wrap:wrap;gap:16px;
  }
  .footer-brand{display:flex;align-items:center;gap:10px;font-family:'Poppins',sans-serif;font-weight:800;font-size:0.95rem;}
  .footer-brand svg{width:34px;height:34px;}
  .footer-links{display:flex;gap:26px;font-size:0.8rem;color:var(--grey);}
  .footer-links a:hover{color:var(--orange);}
  .socials{display:flex;gap:10px;}
  .socials a{
    width:36px;height:36px;border-radius:50%;
    border:1px solid var(--border);
    display:flex;align-items:center;justify-content:center;
    transition:border-color .2s, color .2s;
  }
  .socials a:hover{border-color:var(--orange);color:var(--orange);}
  .copyright{
    text-align:center;font-size:0.75rem;color:var(--grey);
    padding:18px 0;border-top:1px solid var(--border);
  }

  /* ---------- Responsive ---------- */
  @media(max-width:980px){
    nav.links{display:none;}
    .hero-grid{grid-template-columns:1fr;}
    .trust-row{grid-template-columns:1fr;}
    .services-grid{grid-template-columns:repeat(2,1fr);}
    .about-grid{grid-template-columns:1fr;}
    .refs-grid{grid-template-columns:repeat(3,1fr);}
    .footer-grid{grid-template-columns:repeat(2,1fr);}
  }
  @media(max-width:560px){
    .hero h1{font-size:2.1rem;}
    .services-grid{grid-template-columns:1fr;}
    .stats-grid{grid-template-columns:1fr;}
    .refs-grid{grid-template-columns:repeat(2,1fr);}
    .footer-grid{grid-template-columns:1fr;}
    .footer-bottom{flex-direction:column;align-items:flex-start;}
  }

/* ---------- Page Hero (sub-pages) ---------- */
.page-hero{
  padding:60px 0 50px;
  border-bottom:1px solid var(--border);
  background:
    radial-gradient(ellipse at top right, rgba(255,106,19,0.08), transparent 60%),
    var(--bg);
}
.breadcrumb{
  font-size:0.78rem;color:var(--grey);margin-bottom:14px;
}
.breadcrumb a:hover{color:var(--orange);}
.breadcrumb .sep{margin:0 8px;}
.page-hero h1{font-size:2.3rem;margin-bottom:12px;}
.page-hero p{color:var(--grey);max-width:600px;font-size:0.95rem;}

/* ---------- Service detail page ---------- */
.service-detail-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:24px;
  padding:90px 0;
}
.service-detail-card{
  background:var(--card);border:1px solid var(--border);border-radius:12px;
  padding:34px;display:flex;gap:22px;
  transition:border-color .2s, transform .2s;
}
.service-detail-card:hover{border-color:var(--orange);transform:translateY(-3px);}
.service-detail-card .icon{
  width:56px;height:56px;flex-shrink:0;
  border:1.5px solid var(--orange);border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  color:var(--orange);font-size:1.3rem;
}
.service-detail-card h3{font-size:1.05rem;margin-bottom:10px;letter-spacing:0.3px;}
.service-detail-card p{color:var(--grey);font-size:0.88rem;margin-bottom:14px;}
.service-detail-card ul{list-style:none;font-size:0.84rem;color:#d5d5d7;}
.service-detail-card ul li{
  padding-left:18px;position:relative;margin-bottom:6px;
}
.service-detail-card ul li::before{
  content:"✓";position:absolute;left:0;color:var(--orange);font-weight:700;
}

/* ---------- CTA band ---------- */
.cta-band{
  background:var(--bg-alt);border-top:1px solid var(--border);border-bottom:1px solid var(--border);
  padding:60px 0;text-align:center;
}
.cta-band h2{font-size:1.7rem;margin-bottom:14px;}
.cta-band p{color:var(--grey);margin-bottom:28px;}
.cta-band .hero-ctas{justify-content:center;}

/* ---------- References filter page ---------- */
.filter-bar{
  display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-bottom:44px;
}
.filter-btn{
  padding:9px 20px;border-radius:30px;border:1.5px solid var(--border);
  background:transparent;color:var(--grey);font-size:0.8rem;font-weight:600;
  cursor:pointer;transition:all .2s ease;letter-spacing:0.3px;
}
.filter-btn:hover{border-color:var(--orange);color:var(--orange);}
.filter-btn.active{background:var(--orange);border-color:var(--orange);color:#0c0c0d;}
.refs-grid-full{
  display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:20px;
}
.ref-card-full{
  position:relative;border-radius:10px;overflow:hidden;aspect-ratio:4/3;
  border:1px solid var(--border);
}
.ref-card-full img{width:100%;height:100%;object-fit:cover;filter:grayscale(15%);transition:transform .35s ease, filter .35s ease;}
.ref-card-full:hover img{transform:scale(1.06);filter:grayscale(0%);}
.ref-card-full .overlay{
  position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;
  padding:20px;background:linear-gradient(0deg, rgba(0,0,0,0.88), transparent 60%);
}
.ref-card-full .tag{
  font-size:0.68rem;letter-spacing:0.6px;color:var(--orange);font-weight:700;
  text-transform:uppercase;margin-bottom:4px;
}
.ref-card-full .title{font-size:1rem;font-weight:700;font-family:'Poppins',sans-serif;}

/* ---------- Contact page ---------- */
.contact-grid{
  display:grid;grid-template-columns:1fr 1.15fr;gap:50px;padding:90px 0;align-items:start;
}
.contact-info-card{
  background:var(--card);border:1px solid var(--border);border-radius:12px;padding:32px;margin-bottom:20px;
}
.contact-info-card h3{font-size:0.95rem;margin-bottom:20px;letter-spacing:0.3px;}
.contact-info-row{display:flex;gap:14px;align-items:flex-start;margin-bottom:20px;}
.contact-info-row:last-child{margin-bottom:0;}
.contact-info-row .icon{
  width:40px;height:40px;flex-shrink:0;border:1.5px solid var(--orange);border-radius:8px;
  display:flex;align-items:center;justify-content:center;color:var(--orange);
}
.contact-info-row h4{font-size:0.78rem;color:var(--grey);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:4px;font-weight:700;}
.contact-info-row p{font-size:0.9rem;color:#e5e5e7;}
.map-box-lg{border-radius:12px;overflow:hidden;height:220px;position:relative;border:1px solid var(--border);}
.map-box-lg img{width:100%;height:100%;object-fit:cover;filter:grayscale(35%);}
.map-box-lg .map-pin{position:absolute;top:50%;left:55%;transform:translate(-50%,-100%);color:var(--orange);font-size:1.6rem;}

.contact-form{
  background:var(--card);border:1px solid var(--border);border-radius:12px;padding:38px;
}
.contact-form h2{font-size:1.5rem;margin-bottom:8px;}
.contact-form>p{color:var(--grey);font-size:0.88rem;margin-bottom:28px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px;}
.form-group{display:flex;flex-direction:column;gap:8px;}
.form-group.full{grid-column:1/-1;}
.form-group label{font-size:0.78rem;font-weight:600;letter-spacing:0.3px;color:#d5d5d7;}
.form-group input,
.form-group select,
.form-group textarea{
  background:var(--bg);border:1.5px solid var(--border);border-radius:8px;
  padding:12px 14px;color:var(--white);font-family:'Inter',sans-serif;font-size:0.88rem;
  transition:border-color .2s;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
  outline:none;border-color:var(--orange);
}
.form-group textarea{resize:vertical;min-height:110px;}
.form-submit{width:100%;justify-content:center;margin-top:6px;font-size:0.85rem;padding:14px;}
.form-note{font-size:0.75rem;color:var(--grey);margin-top:14px;text-align:center;}

@media(max-width:980px){
  .service-detail-grid{grid-template-columns:1fr;}
  .refs-grid-full{grid-template-columns:repeat(2,1fr);}
  .contact-grid{grid-template-columns:1fr;}
}
@media(max-width:560px){
  .refs-grid-full{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
}
