
  /* ======================
     GLOBAL / VARIABLES
  ====================== */
  @import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

  :root{
    --nav-h: 70px;
    --brand-gold: #f4b400;
    --brand-gold-600: #d9a500;
    --brand-gold-100: #fff5d6;

    /* Blue + Gold pair for accents */
    --brand: #0d6efd;
    --brand-600: #0b5ed7;
    --brand-100: #e9f2ff;
    --brand-gradient: linear-gradient(135deg,#0b5ed7,#67b1ff);
    --on-brand: #fff;
    --brand-badge-text: #fff;
  }

  html, body { scroll-behavior: smooth;font-family: "Poppins", sans-serif !important; }
  body { position: relative; }
  section { padding: clamp(48px, 7vw, 96px) 0; }
  .scroll-offset { scroll-margin-top: calc(var(--nav-h) + 16px); }

  @media (max-width: 575.98px){
    :root{ --nav-h: 60px; }
  }

  /* ======================
     NAVBAR
  ====================== */
  .navbar { min-height: var(--nav-h); }
  .navbar .nav-link { font-weight: 600; }
  .navbar .nav-link:hover,
  .navbar .nav-link.active{ color: var(--brand-gold); }
  .navbar-brand .nav-logo{ height:44px; width:auto; object-fit:contain; }
  @media (max-width: 575.98px){
    .navbar-brand .nav-logo{ height:36px; }
    .navbar-nav .nav-link{ padding:.65rem 1rem; }
  }
  .navbar-light .navbar-toggler-icon{ filter: brightness(.7); }

  /* ======================
     HERO SLIDER
  ====================== */

  .hero-slider .carousel,
  .hero-slider .carousel-item{
    height: calc(100svh - var(--nav-h));
    min-height: 60vh;
  }
  @supports not (height: 100svh){
    .hero-slider .carousel,
    .hero-slider .carousel-item{ height: calc(100vh - var(--nav-h)); }
  }
  .hero-slider .hero-img{
    height:100%; width:100%; object-fit:cover; object-position:center;
  }
  .hero-slider .hero-overlay{
    position:absolute; inset:0;
    background: linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.15) 50%, rgba(0,0,0,.35));
  }
  .hero-slider .hero-caption{
    position:absolute; inset:0;
    display:flex; flex-direction:column; justify-content:center; align-items:center;
    gap:.75rem; text-align:center; color:#fff; padding:0 1rem;
  }
  .hero-slider .hero-caption h1,
  .hero-slider .hero-caption .lead{ max-width: 720px; }
  @media (max-width: 575.98px){
    .hero-slider .hero-caption h1{ font-size:1.6rem; line-height:1.2; }
    .hero-slider .hero-caption .lead{ font-size:1rem; }
    .hero-slider .hero-caption .btn{ padding:.55rem 1rem; font-size:.95rem; }
  }
  .hero-slider .carousel-indicators{ bottom:18px; }
  @media (prefers-reduced-motion: reduce){
    .carousel * { transition:none !important; animation:none !important; }
  }

  /* ======================
     FULL-WIDTH BANNERS (EXACT HEIGHT)
  ====================== */
  .fullbar{
    --bar-h: 180px;         /* default */
    width:100%; height:var(--bar-h);
    display:flex; align-items:center;
    position:relative;
  }
  .fullbar .bar-inner{
    height:var(--bar-h);
    display:flex; align-items:center; justify-content:space-between; gap:16px;
  }
  .fullbar .bar-copy h3{ font-weight:800; letter-spacing:.2px; }
  .fullbar .bar-copy p{ margin-top:4px; }

  /* decorative soft shine */
  .fullbar::after{
    content:""; position:absolute; inset:0;
    background: radial-gradient(1200px 120px at 20% 0%, rgba(255,255,255,.15), transparent 60%);
    pointer-events:none;
  }

  /* Height utilities */
  .bar-h-140{ --bar-h: 140px; }
  .bar-h-160{ --bar-h: 160px; }
  .bar-h-180{ --bar-h: 180px; }
  .bar-h-200{ --bar-h: 200px; }
  .bar-h-220{ --bar-h: 220px; }

  /* Colorways */
  .bar-blue{ background: var(--brand-gradient); color:#fff; }
  .bar-gold{ background: linear-gradient(135deg, var(--brand-gold), var(--brand-gold-600)); color:#111; }
  .bar-duo{  background: linear-gradient(135deg, var(--brand-600) 0%, var(--brand) 45%, var(--brand-gold) 100%); color:#fff; }

  /* Mobile sizing inside exact-height bars */
  @media (max-width: 575.98px){
    .fullbar .bar-inner{ padding: 8px 0; }
    .fullbar .bar-copy h3{ font-size: 1.05rem; }
    .fullbar .bar-copy p{ font-size: .85rem; }
    .fullbar .btn{ padding: .4rem .8rem; font-size: .85rem; }
  }

  /* ======================
     CARDS / GENERAL POLISH
  ====================== */
  #who .card, #services .card, #contact .card{
    transition: transform .2s ease, box-shadow .2s ease;
  }
  #who .card:hover, #services .card:hover{ transform: translateY(-4px); box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.1); }
  #contact .card:hover{ transform: translateY(-2px); box-shadow: 0 .75rem 1.5rem rgba(0,0,0,.08); }

  .feature .icon-tile{
    width:48px;height:48px;display:flex;align-items:center;justify-content:center;
    border-radius:10px;background:var(--brand-gradient);color:#fff;font-size:1.25rem;
  }

  /* ======================
     LINKS / BADGES
  ====================== */
  a{ color: var(--brand); }
  a:hover{ color: var(--brand-600); }
  .badge.text-bg-dark, .badge.bg-dark, .brand-badge{
    background-color: var(--brand) !important;
    color: var(--brand-badge-text) !important;
  }

  /* ======================
     GOLDEN BUTTONS (GLOBAL)
  ====================== */
  .btn-brand,
  .btn-dark,
  .btn-primary{
    background-color: var(--brand-gold) !important;
    border-color: var(--brand-gold-600) !important;
    color: #111 !important;
  }
  .btn-brand:hover,
  .btn-dark:hover,
  .btn-primary:hover{
    background-color: var(--brand-gold-600) !important;
    color: #111 !important;
  }
  .btn-outline-dark,
  .btn-outline-primary{
    color: var(--brand-gold-600) !important;
    border-color: var(--brand-gold-600) !important;
  }
  .btn-outline-dark:hover,
  .btn-outline-primary:hover{
    background-color: var(--brand-gold) !important;
    color: #111 !important;
  }

  /* ======================
     WHY-CHOOSE (blob numbers + image)
  ====================== */
  .why-choose{ --accent:#f4b400; --shadow: rgba(13,110,253,.35); }
  .why-choose .wc-list{ display:grid; gap:1rem; }
  .why-choose .wc-item{ align-items:flex-start; }
  .why-choose .wc-num{
    position:relative; display:inline-block; min-width:2.6ch;
    font-weight:800; font-size:2rem; line-height:1; color:#2d2d2d; z-index:1;
  }
  .why-choose .wc-num::before{
    content:""; position:absolute; left:-42px; top:-6px; width:44px; height:44px;
    background: var(--brand); border-radius:10px 18px 18px 18px; box-shadow: 0 10px 20px rgba(0,0,0,.08); z-index:-1;
  }
  .why-choose .wc-item:nth-child(even) .wc-num::before{ background: var(--accent); }

  .why-choose .chip{
    padding:.38rem .75rem; border-radius:999px;
    background: rgba(0,0,0,.05); border:1px solid rgba(0,0,0,.08);
    font-size:.85rem;
  }

  .why-choose .wc-photo{
    width:100%; height:auto; object-fit:cover;
    border-top-right-radius:140px; border-bottom-left-radius:140px;
  }
  
  @media (max-width: 575.98px){
    .why-choose h2{ font-size:1.6rem; }
    .why-choose .wc-num{ font-size:1.25rem; }
    .why-choose .wc-num::before{ left:-32px; top:-4px; width:34px; height:34px; border-radius:8px 16px 16px 16px; }
    .why-choose .wc-photo{ border-top-right-radius:72px; border-bottom-left-radius:16px; }
  }

  /* ======================
     CONTACT – modern
  ====================== */
  .contact-modern .bg-brand-soft{ background: var(--brand-gold-100) !important; }
  .contact-modern .container{ position: relative; }
  .contact-modern .container::before{
    content:""; position:absolute; right:-80px; top:-80px; width:220px; height:220px; border-radius:50%;
    background: radial-gradient(closest-side, rgba(244,180,0,.2), rgba(244,180,0,0)); pointer-events:none;
  }
  .contact-modern .contact-card{ border-radius: 18px; }
  .contact-modern .input-group-text{
    background:#fff; border-right:0; border-top-left-radius:12px; border-bottom-left-radius:12px;
  }
  .contact-modern .form-control, .contact-modern textarea.form-control{
    border-left:0; border-top-right-radius:12px; border-bottom-right-radius:12px;
  }
  .contact-modern .form-control:focus{
    border-color: var(--brand-gold-600);
    box-shadow: 0 0 0 .25rem rgba(244,180,0,.2);
  }
  .contact-modern .input-group:has(.form-control:focus) .input-group-text{ border-color: var(--brand-gold-600); }
  .contact-modern .info-tile{
    display:flex; gap:14px; align-items:flex-start; background:#fff; border-radius:16px;
    padding:16px 18px; border:1px solid rgba(0,0,0,.05);
  }
  .contact-modern .icon-circle{
    width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center;
    background: linear-gradient(135deg, var(--brand-gold), var(--brand-gold-600));
    color:#111; font-size:1.1rem; box-shadow: 0 10px 18px rgba(244,180,0,.25);
  }
  .contact-modern .note-tile{
    border-radius:16px; padding:16px 18px; background:#fff8e0; border:1px dashed var(--brand-gold-600);
    color:#4a3b00; font-size:.95rem;
  }
  @media (max-width: 991.98px){
    .contact-modern .info-tile{ align-items:center; }
  }

  /* ======================
     TYPOGRAPHY on mobile
  ====================== */
  @media (max-width: 575.98px){
    #why h2, #who h2, #services h2{ font-size: 1.5rem; }
    #services h3{ font-size: 1.25rem; }
    #contact h3{ font-size: 1.5rem; }
  }

   /* General: prevent horizontal scroll on tiny screens */
  html, body{ overflow-x: hidden; }



/* ===== Modern Footer (matches your palette) ===== */
.footer-modern{
  position: relative;
  background: #0b1220; /* deep navy that works with blue/gold */
  color: rgba(255,255,255,.8);
}

/* thin accent bar (gold → blue) */
.footer-modern::before{
  content:"";
  position:absolute; inset:0 0 auto 0; height:4px;
  background: linear-gradient(90deg, var(--brand-gold), var(--brand));
}

/* spacing */
.footer-modern .container{ position:relative; }
.footer-modern .brand-logo{ height:46px; width:auto; object-fit:contain; }

/* links */
.footer-modern a{
  color: rgba(255,255,255,.85);
  text-decoration: none;
}
.footer-modern a:hover{ color: var(--brand-gold); }

/* lists */
.footer-modern .link-list a{
  display:inline-block; padding:.25rem 0;
  color: rgba(255,255,255,.75);
}
.footer-modern .link-list a:hover{
  color: var(--brand-gold);
}

/* social buttons */
.footer-modern .social{
  width:40px; height:40px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.12);
  color:#fff; font-size:1.1rem;
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.footer-modern .social:hover{
  transform: translateY(-2px);
  border-color: rgba(244,180,0,.6);
  box-shadow: 0 8px 18px rgba(244,180,0,.15);
}

/* bottom bar */
.footer-modern .footer-bar{
  border-top: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.15);
}
.footer-modern .link-legal{
  color: rgba(255,255,255,.75);
}
.footer-modern .link-legal:hover{
  color: var(--brand-gold);
}

/* responsive tweaks */
@media (max-width: 575.98px){
  .footer-modern .brand-logo{ height:40px; }
  .footer-modern .row > [class*="col-"]{ text-align: left; }
  .footer-modern .footer-bar .container{
    text-align:center; gap:6px;
  }
}
