/* ─── Root Variables ─────────────────────────────────── */
    :root {
      /* Logo Red palette */
      --red:       #CC0000;
      --red-2:     #aa0000;
      --red-3:     #e60000;
      --red-bg:    rgba(204,0,0,.10);
      --red-border:rgba(204,0,0,.22);

      /* Darks */
      --dark:      #111111;
      --dark-2:    #1a1a1a;
      --dark-3:    #222222;
      --dark-4:    #2c2c2c;

      /* Lights / whites */
      --white:     #ffffff;
      --off-white: #f8f8f8;
      --light-2:   #f2f2f2;

      /* Text */
      --text-dark: #1a1a1a;
      --text-mid:  #555555;
      --text-muted:#888888;
      --muted-dark:#aaaaaa;

      /* On-dark muted */
      --muted:     #aaaaaa;
      --border-dark:rgba(204,0,0,.18);
      --border-light:rgba(204,0,0,.15);
    }

    /* ─── Base ───────────────────────────────────────────── */
    * { margin:0; padding:0; box-sizing:border-box; }

    html {
      scroll-behavior:smooth;
      overflow-x:hidden;
      max-width:100%;
    }

    body {
      font-family:'Poppins', sans-serif;
      background:var(--white);
      color:var(--text-dark);
      overflow-x:hidden;
      max-width:100%;
    }

    a { text-decoration:none; }

    img { max-width:100%; }

    section { scroll-margin-top:76px; }

    /* ─── Scrollbar ──────────────────────────────────────── */
    ::-webkit-scrollbar { width:6px; }
    ::-webkit-scrollbar-track { background:#f0f0f0; }
    ::-webkit-scrollbar-thumb { background:var(--red); border-radius:3px; }

    /* ─── Section Alternating BGs ────────────────────────── */
    .bg-dark-section {
      background:var(--dark);
      color:#fff;
    }
    .bg-white-section {
      background:var(--white);
      color:var(--text-dark);
    }
    .bg-light-section {
      background:var(--off-white);
      color:var(--text-dark);
    }

    /* ─── Typography Helpers ─────────────────────────────── */
    /* Tag – dark bg variant */
    .section-tag {
      display:inline-block;
      border-radius:50px;
      padding:4px 18px;
      font-size:.78rem;
      font-weight:600;
      letter-spacing:1.5px;
      text-transform:uppercase;
      margin-bottom:12px;
    }
    .section-tag.dark-variant {
      background:var(--red-bg);
      color:var(--red-3);
      border:1px solid var(--border-dark);
    }
    .section-tag.light-variant {
      background:rgba(204,0,0,.08);
      color:var(--red);
      border:1px solid var(--border-light);
    }

    .section-title {
      font-size:2.2rem;
      font-weight:800;
      line-height:1.2;
    }
    .section-title.dark-title  { color:#fff; }
    .section-title.light-title { color:var(--text-dark); }
    .section-title span        { color:var(--red); }

    .section-sub {
      font-size:.95rem;
      line-height:1.8;
      max-width:600px;
      margin:0 auto;
    }
    .section-sub.dark-sub  { color:var(--muted-dark); }
    .section-sub.light-sub { color:var(--text-mid); }

    .section-sub {
      color:var(--muted);
      font-size:.95rem;
      line-height:1.8;
      max-width:600px;
      margin:0 auto;
    }

    /* ─── Buttons ────────────────────────────────────────── */
    .btn-red {
      background:var(--red);
      color:#fff;
      font-weight:700;
      border-radius:50px;
      padding:11px 28px;
      border:none;
      transition:all .3s;
      font-size:.9rem;
      letter-spacing:.5px;
    }
    .btn-red:hover {
      background:var(--red-2);
      color:#fff;
      box-shadow:0 6px 24px rgba(204,0,0,.35);
      transform:translateY(-2px);
    }

    .btn-outline-red {
      background:transparent;
      color:var(--red);
      font-weight:700;
      border-radius:50px;
      padding:10px 28px;
      border:2px solid var(--red);
      transition:all .3s;
      font-size:.9rem;
    }
    .btn-outline-red:hover {
      background:var(--red);
      color:#fff;
      box-shadow:0 6px 24px rgba(204,0,0,.35);
      transform:translateY(-2px);
    }

    /* White-outline version for dark sections */
    .btn-outline-white {
      background:transparent;
      color:#fff;
      font-weight:700;
      border-radius:50px;
      padding:10px 28px;
      border:2px solid rgba(255,255,255,.6);
      transition:all .3s;
      font-size:.9rem;
    }
    .btn-outline-white:hover {
      background:#fff;
      color:var(--red);
      border-color:#fff;
      box-shadow:0 6px 24px rgba(255,255,255,.2);
      transform:translateY(-2px);
    }

    /* Alias kept for compatibility */
    .btn-yellow  { background:var(--red); color:#fff; font-weight:700; border-radius:50px; padding:11px 28px; border:none; transition:all .3s; font-size:.9rem; }
    .btn-yellow:hover { background:var(--red-2); color:#fff; box-shadow:0 6px 24px rgba(204,0,0,.35); transform:translateY(-2px); }
    .btn-outline-yellow { background:transparent; color:#fff; font-weight:700; border-radius:50px; padding:10px 28px; border:2px solid rgba(255,255,255,.65); transition:all .3s; font-size:.9rem; }
    .btn-outline-yellow:hover { background:#fff; color:var(--red); box-shadow:0 6px 24px rgba(255,255,255,.2); transform:translateY(-2px); }
    .btn-blue { background:var(--dark-3); color:#fff; font-weight:700; border-radius:50px; padding:11px 28px; border:2px solid rgba(255,255,255,.15); transition:all .3s; font-size:.9rem; }
    .btn-blue:hover { background:var(--red); border-color:var(--red); color:#fff; box-shadow:0 6px 24px rgba(204,0,0,.35); transform:translateY(-2px); }

    /* ─── Navbar ─────────────────────────────────────────── */
    .navbar {
      background:rgba(255,255,255,.97);
      backdrop-filter:blur(12px);
      border-bottom:3px solid var(--red);
      padding:10px 0;
      transition:all .3s;
      z-index:1050;
      box-shadow:0 2px 16px rgba(0,0,0,.08);
    }

    .navbar.scrolled {
      padding:7px 0;
      background:rgba(255,255,255,.99);
      box-shadow:0 4px 24px rgba(0,0,0,.12);
    }

    .navbar-brand {
      display:flex;
      align-items:center;
      gap:12px;
    }

    .navbar-brand img {
      height:70px;
      width:auto;
    }

    .brand-text .brand-name {
      font-size:1.05rem;
      font-weight:800;
      color:var(--red);
      line-height:1.2;
      letter-spacing:.5px;
    }

    .brand-text .brand-sub {
      font-size:.68rem;
      color:var(--text-mid);
      letter-spacing:1px;
      text-transform:uppercase;
    }

    .navbar-nav .nav-link {
      color:var(--text-dark) !important;
      font-weight:600;
      font-size:.88rem;
      padding:8px 14px !important;
      border-radius:6px;
      transition:all .3s;
      letter-spacing:.3px;
    }

    .navbar-nav .nav-link:hover,
    .navbar-nav .nav-link.active {
      color:var(--red) !important;
      background:var(--red-bg);
    }

    .navbar-toggler {
      border:1px solid var(--red-border);
      padding:5px 10px;
    }

    .navbar-toggler-icon {
      background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28204,0,0,1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }

    /* ─── Hero Carousel ──────────────────────────────────── */
    #heroCarousel { height:100vh; min-height:620px; }

    .carousel-item {
      height:100vh;
      min-height:620px;
      position:relative;
    }

    .hero-bg {
      position:absolute;
      inset:0;
      background-size:cover;
      background-position:center;
      background-repeat:no-repeat;
      z-index:0;
    }

    .hero-overlay {
      position:absolute;
      inset:0;
      background:linear-gradient(
        135deg,
        rgba(0,0,0,.82) 0%,
        rgba(0,0,0,.55) 50%,
        rgba(0,0,0,.75) 100%
      );
      z-index:1;
    }

    .hero-content {
      position:relative;
      z-index:2;
      height:100%;
      display:flex;
      align-items:center;
    }

    .hero-badge {
      display:inline-block;
      background:rgba(204,0,0,.18);
      border:1px solid rgba(255,100,100,.4);
      color:#ffaaaa;
      border-radius:50px;
      padding:5px 20px;
      font-size:.78rem;
      font-weight:600;
      letter-spacing:2px;
      text-transform:uppercase;
      margin-bottom:20px;
      animation:fadeInDown .8s ease;
    }

    .hero-title {
      font-size:3.2rem;
      font-weight:900;
      line-height:1.15;
      color:#fff;
      margin-bottom:18px;
      text-shadow:0 2px 12px rgba(0,0,0,.5);
    }

    .hero-title .highlight { color:#ff6666; }

    .hero-text {
      font-size:1.05rem;
      color:rgba(255,255,255,.82);
      line-height:1.8;
      max-width:560px;
      margin-bottom:32px;
    }

    .carousel-control-prev,
    .carousel-control-next {
      width:52px;
      height:52px;
      background:rgba(204,0,0,.25);
      border:1px solid rgba(204,0,0,.4);
      border-radius:50%;
      top:50%;
      transform:translateY(-50%);
      display:flex;
      align-items:center;
      justify-content:center;
      transition:all .3s;
      margin:0 20px;
    }

    .carousel-control-prev:hover,
    .carousel-control-next:hover {
      background:var(--red);
    }

    .carousel-control-prev-icon,
    .carousel-control-next-icon { width:18px; height:18px; }

    .carousel-indicators [data-bs-target] {
      width:10px;
      height:10px;
      border-radius:50%;
      background:rgba(255,255,255,.4);
      border:none;
      margin:0 5px;
      transition:all .3s;
    }

    .carousel-indicators .active {
      background:var(--red);
      width:28px;
      border-radius:5px;
    }

    @keyframes fadeInDown {
      from { opacity:0; transform:translateY(-20px); }
      to   { opacity:1; transform:translateY(0); }
    }

    /* ─── About Section  (WHITE BG) ─────────────────────── */
    #about { background:var(--white); }

    .about-img-wrap {
      position:relative;
      border-radius:16px;
      overflow:hidden;
      box-shadow:0 20px 60px rgba(0,0,0,.18);
    }

    .about-img-wrap img {
      width:100%;
      height:440px;
      object-fit:cover;
      border-radius:16px;
      transition:transform .5s;
    }

    .about-img-wrap:hover img { transform:scale(1.04); }

    .about-badge {
      position:absolute;
      bottom:24px;
      left:24px;
      background:var(--red);
      color:#fff;
      border-radius:12px;
      padding:14px 20px;
      font-weight:800;
      font-size:.85rem;
      line-height:1.3;
      box-shadow:0 8px 24px rgba(204,0,0,.4);
    }

    .about-badge .number {
      font-size:2rem;
      font-weight:900;
      display:block;
    }

    .about-feature {
      display:flex;
      align-items:flex-start;
      gap:14px;
      margin-bottom:14px;
      padding:14px 16px;
      background:var(--off-white);
      border:1px solid rgba(204,0,0,.10);
      border-radius:10px;
      transition:all .3s;
    }

    .about-feature:hover {
      background:#fff;
      border-color:var(--red-border);
      box-shadow:0 4px 16px rgba(204,0,0,.1);
      transform:translateX(4px);
    }

    .about-feature-icon {
      width:42px;
      height:42px;
      background:var(--red-bg);
      border:1px solid var(--red-border);
      border-radius:8px;
      display:flex;
      align-items:center;
      justify-content:center;
      flex-shrink:0;
      color:var(--red);
      font-size:1rem;
    }

    .about-feature-text h6 {
      font-size:.88rem;
      font-weight:700;
      color:var(--text-dark);
      margin-bottom:2px;
    }

    .about-feature-text p {
      font-size:.78rem;
      color:var(--text-mid);
      margin:0;
    }

    /* ─── Services  (LIGHT BG) ──────────────────────────── */
    #services { background:var(--off-white); }

    .service-card {
      background:var(--white);
      border:1px solid rgba(204,0,0,.10);
      border-radius:16px;
      overflow:hidden;
      transition:all .4s;
      height:100%;
      cursor:pointer;
      box-shadow:0 2px 12px rgba(0,0,0,.06);
    }

    .service-card:hover {
      transform:translateY(-8px);
      border-color:var(--red);
      box-shadow:0 20px 40px rgba(204,0,0,.18), 0 0 0 1px rgba(204,0,0,.12);
    }

    .service-img {
      width:100%;
      height:200px;
      object-fit:cover;
      transition:transform .5s;
    }

    .service-card:hover .service-img { transform:scale(1.07); }

    .service-img-wrap {
      overflow:hidden;
      position:relative;
    }

    .service-img-overlay {
      position:absolute;
      inset:0;
      background:linear-gradient(0deg, rgba(0,0,0,.55) 0%, transparent 60%);
    }

    .service-body {
      padding:20px;
      display:flex;
      flex-direction:column;
    }

    .service-icon {
      width:44px;
      height:44px;
      background:var(--red-bg);
      border:1px solid var(--red-border);
      border-radius:10px;
      display:flex;
      align-items:center;
      justify-content:center;
      color:var(--red);
      font-size:1.1rem;
      margin-bottom:12px;
      transition:all .3s;
    }

    .service-card:hover .service-icon {
      background:var(--red);
      color:#fff;
      box-shadow:0 4px 16px rgba(204,0,0,.3);
    }

    .service-body h5 {
      font-size:.98rem;
      font-weight:700;
      color:var(--text-dark);
      margin-bottom:6px;
    }

    .service-body p {
      font-size:.8rem;
      color:var(--text-mid);
      margin:0 0 14px;
      line-height:1.7;
    }

    .service-btns {
      display:flex;
      gap:8px;
      margin-top:4px;
    }

    .btn-svc-call, .btn-svc-enquire {
      flex:1;
      display:flex;
      align-items:center;
      justify-content:center;
      gap:5px;
      padding:7px 6px;
      border-radius:8px;
      font-size:.75rem;
      font-weight:700;
      cursor:pointer;
      transition:all .3s;
      letter-spacing:.3px;
      border:none;
      text-decoration:none;
    }

    .btn-svc-call {
      background:var(--red);
      color:#fff;
    }
    .btn-svc-call:hover {
      background:var(--red-2);
      color:#fff;
      box-shadow:0 4px 14px rgba(204,0,0,.3);
      transform:translateY(-1px);
    }

    .btn-svc-enquire {
      background:transparent;
      color:var(--red);
      border:1.5px solid var(--red);
    }
    .btn-svc-enquire:hover {
      background:var(--red);
      color:#fff;
      box-shadow:0 4px 14px rgba(204,0,0,.3);
      transform:translateY(-1px);
    }

    /* ─── Why Choose Us  (DARK BG) ──────────────────────── */
    #why { background:var(--dark); }

    .why-bg {
      background:linear-gradient(
        135deg,
        rgba(204,0,0,.06) 0%,
        rgba(204,0,0,.02) 100%
      );
      border:1px solid rgba(204,0,0,.18);
      border-radius:20px;
      padding:48px 40px;
    }

    .why-item {
      display:flex;
      align-items:flex-start;
      gap:16px;
      padding:18px;
      border-radius:12px;
      background:rgba(255,255,255,.04);
      border:1px solid rgba(255,255,255,.07);
      transition:all .35s;
      height:100%;
    }

    .why-item:hover {
      background:rgba(204,0,0,.08);
      border-color:rgba(204,0,0,.3);
      transform:translateY(-4px);
      box-shadow:0 8px 24px rgba(0,0,0,.3);
    }

    .why-icon {
      width:50px;
      height:50px;
      background:var(--red-bg);
      border:1px solid var(--border-dark);
      border-radius:12px;
      display:flex;
      align-items:center;
      justify-content:center;
      flex-shrink:0;
      font-size:1.2rem;
      color:var(--red-3);
      transition:all .3s;
    }

    .why-item:hover .why-icon {
      background:var(--red);
      color:#fff;
      border-color:var(--red);
      box-shadow:0 4px 16px rgba(204,0,0,.3);
    }

    .why-text h6 {
      font-size:.92rem;
      font-weight:700;
      color:#fff;
      margin-bottom:4px;
    }

    .why-text p {
      font-size:.78rem;
      color:var(--muted);
      margin:0;
      line-height:1.6;
    }

    /* ─── Stats Strip ────────────────────────────────────── */
    .stats-strip {
      background:var(--red);
      padding:32px 0;
      position:relative;
      overflow:hidden;
    }

    .stats-strip::before {
      content:'';
      position:absolute;
      inset:0;
      background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    }

    .stat-item { text-align:center; position:relative; z-index:1; }

    .stat-number {
      font-size:2.2rem;
      font-weight:900;
      color:#fff;
      line-height:1;
    }

    .stat-label {
      font-size:.8rem;
      font-weight:600;
      color:rgba(255,255,255,.75);
      text-transform:uppercase;
      letter-spacing:1px;
      margin-top:4px;
    }

    .stats-strip .stat-divider {
      border-left:1px solid rgba(255,255,255,.2);
    }

    /* ─── Contact  (WHITE BG) ───────────────────────────── */
    #contact { background:var(--white); }

    .contact-card {
      background:var(--off-white);
      border:1px solid rgba(204,0,0,.10);
      border-radius:16px;
      padding:36px 32px;
      height:100%;
      box-shadow:0 4px 24px rgba(0,0,0,.06);
    }

    .contact-info-item {
      display:flex;
      align-items:flex-start;
      gap:16px;
      margin-bottom:18px;
      padding:14px 16px;
      background:var(--white);
      border-radius:10px;
      border:1px solid rgba(204,0,0,.08);
      transition:all .3s;
      box-shadow:0 2px 8px rgba(0,0,0,.04);
    }

    .contact-info-item:hover {
      border-color:var(--red);
      box-shadow:0 4px 16px rgba(204,0,0,.12);
    }

    .contact-icon {
      width:46px;
      height:46px;
      background:var(--red-bg);
      border:1px solid var(--red-border);
      border-radius:10px;
      display:flex;
      align-items:center;
      justify-content:center;
      flex-shrink:0;
      font-size:1.1rem;
      color:var(--red);
    }

    .contact-info-item h6 {
      font-size:.72rem;
      font-weight:700;
      color:var(--text-mid);
      text-transform:uppercase;
      letter-spacing:1px;
      margin-bottom:3px;
    }

    .contact-info-item a,
    .contact-info-item p {
      font-size:.9rem;
      font-weight:500;
      color:var(--text-dark);
      margin:0;
      transition:color .3s;
    }

    .contact-info-item a:hover { color:var(--red); }

    .map-wrap {
      border-radius:12px;
      overflow:hidden;
      border:1px solid rgba(204,0,0,.15);
      box-shadow:0 4px 16px rgba(0,0,0,.08);
    }

    /* Form – light mode */
    .form-control, .form-select {
      background:#fff !important;
      border:1.5px solid rgba(204,0,0,.18) !important;
      color:var(--text-dark) !important;
      border-radius:10px !important;
      padding:12px 16px !important;
      font-size:.88rem;
      transition:all .3s;
      box-shadow:none !important;
    }

    .form-control::placeholder { color:var(--text-muted) !important; }

    .form-control:focus, .form-select:focus {
      background:#fff !important;
      border-color:var(--red) !important;
      box-shadow:0 0 0 3px rgba(204,0,0,.12) !important;
      color:var(--text-dark) !important;
    }

    .form-select option { background:#fff; color:var(--text-dark); }

    .form-label {
      font-size:.78rem;
      font-weight:700;
      color:var(--text-mid);
      text-transform:uppercase;
      letter-spacing:.8px;
      margin-bottom:6px;
    }

    /* ─── Footer  (DARK BG) ─────────────────────────────── */
    footer {
      background:var(--dark-2);
      border-top:3px solid var(--red);
    }

    .footer-brand img { height:50px; }

    .footer-desc {
      font-size:.83rem;
      color:var(--muted);
      line-height:1.8;
      margin:16px 0;
    }

    .footer-social a {
      width:36px;
      height:36px;
      background:rgba(255,255,255,.06);
      border:1px solid rgba(255,255,255,.1);
      border-radius:8px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      color:var(--muted);
      font-size:.9rem;
      transition:all .3s;
    }

    .footer-social a:hover {
      background:var(--red);
      color:#fff;
      border-color:var(--red);
      box-shadow:0 4px 14px rgba(204,0,0,.35);
    }

    .footer-heading {
      font-size:.8rem;
      font-weight:700;
      color:var(--red-3);
      text-transform:uppercase;
      letter-spacing:1.5px;
      margin-bottom:18px;
    }

    .footer-links li { margin-bottom:10px; }

    .footer-links a {
      font-size:.84rem;
      color:var(--muted);
      transition:all .3s;
      display:flex;
      align-items:center;
      gap:8px;
    }

    .footer-links a:before {
      content:'›';
      color:var(--red-3);
      font-size:1rem;
    }

    .footer-links a:hover { color:var(--red-3); padding-left:4px; }

    .footer-bottom {
      border-top:1px solid rgba(255,255,255,.06);
      padding:16px 0;
    }

    .footer-bottom p {
      font-size:.78rem;
      color:var(--muted);
      margin:0;
    }

    /* ─── Floating Buttons ───────────────────────────────── */
    /* Enquire Float */
    .float-enquire {
      position:fixed;
      right:0;
      top:50%;
      transform:translateY(-50%);
      z-index:1100;
      overflow:hidden;
    }

    .float-enquire-btn {
      background:var(--red);
      color:#fff;
      font-weight:700;
      font-size:.82rem;
      border:none;
      border-radius:8px 0 0 8px;
      padding:14px 12px;
      cursor:pointer;
      writing-mode:vertical-rl;
      text-orientation:mixed;
      transform:rotate(180deg);
      letter-spacing:1.5px;
      text-transform:uppercase;
      box-shadow:-4px 0 20px rgba(204,0,0,.4);
      transition:all .3s;
      display:flex;
      align-items:center;
      gap:8px;
    }

    .float-enquire-btn:hover {
      background:var(--red-2);
      box-shadow:-6px 0 28px rgba(204,0,0,.55);
    }

    .float-enquire-btn i { transform:rotate(180deg); font-size:1rem; }

    /* Floating Call Button */
    .float-call-btn {
      position:fixed;
      bottom:30px;
      right:28px;
      z-index:1100;
      width:52px;
      height:52px;
      background:var(--red);
      color:#fff;
      border-radius:50%;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:1.25rem;
      box-shadow:0 4px 20px rgba(204,0,0,.45);
      text-decoration:none;
      transition:all .3s;
    }

    .float-call-btn::before {
      content:'';
      position:absolute;
      inset:0;
      border-radius:50%;
      background:rgba(204,0,0,.4);
      animation:callPulse 2s ease-out infinite;
    }

    @keyframes callPulse {
      0%   { transform:scale(1);   opacity:.7; }
      70%  { transform:scale(1.6); opacity:0;  }
      100% { transform:scale(1.6); opacity:0;  }
    }

    .float-call-btn i { position:relative; z-index:1; animation:callRing 2.5s infinite; }

    @keyframes callRing {
      0%,100% { transform:rotate(0deg);   }
      10%     { transform:rotate(12deg);  }
      20%     { transform:rotate(-10deg); }
      30%     { transform:rotate(8deg);   }
      40%     { transform:rotate(-4deg);  }
      50%     { transform:rotate(0deg);   }
    }

    .float-call-btn:hover {
      background:var(--red-2);
      color:#fff;
      transform:scale(1.1);
      box-shadow:0 8px 28px rgba(204,0,0,.55);
    }

    /* Scroll to top */
    #scrollTop {
      position:fixed;
      bottom:92px;
      right:28px;
      z-index:1100;
      width:44px;
      height:44px;
      background:var(--red);
      color:#fff;
      border:none;
      border-radius:50%;
      font-size:1.1rem;
      cursor:pointer;
      display:none;
      align-items:center;
      justify-content:center;
      box-shadow:0 4px 18px rgba(204,0,0,.4);
      transition:all .3s;
    }

    #scrollTop:hover {
      background:var(--red-2);
      transform:translateY(-3px);
      box-shadow:0 8px 24px rgba(204,0,0,.5);
    }

    /* ─── Modals ──────────────────────────────────────────── */
    .modal-content {
      background:#fff;
      border:1px solid rgba(204,0,0,.15);
      border-radius:18px;
      overflow:hidden;
      box-shadow:0 24px 64px rgba(0,0,0,.18);
    }

    .modal-header {
      background:linear-gradient(135deg, var(--dark), var(--dark-3));
      border-bottom:3px solid var(--red);
      padding:20px 28px;
    }

    .modal-title { color:#fff; font-weight:800; font-size:1.1rem; }

    .btn-close {
      filter:invert(1) brightness(1.5);
      opacity:.6;
    }

    .btn-close:hover { opacity:1; }

    .modal-body {
      padding:28px;
      background:#fff;
    }

    /* Override form inside modal for dark text */
    .modal-body .form-control,
    .modal-body .form-select {
      background:#f9f9f9 !important;
      border:1.5px solid rgba(204,0,0,.18) !important;
      color:var(--text-dark) !important;
    }
    .modal-body .form-control::placeholder { color:var(--text-muted) !important; }
    .modal-body .form-control:focus,
    .modal-body .form-select:focus {
      background:#fff !important;
      border-color:var(--red) !important;
      box-shadow:0 0 0 3px rgba(204,0,0,.12) !important;
    }
    .modal-body .form-label { color:var(--text-mid); }
    .modal-body .form-select option { background:#fff; color:var(--text-dark); }

    .modal-footer {
      border-top:1px solid rgba(204,0,0,.1);
      padding:16px 28px;
      background:#f9f9f9;
    }

    .modal-footer .btn { color:var(--text-mid) !important; }

    /* Popup */
    #onloadPopup .modal-dialog { max-width:500px; }

    .popup-logo { height:50px; }

    /* Popup header intro text */
    #onloadPopup .modal-header .modal-title { color:var(--red-3); }
    #onloadPopup .modal-header p,
    #onloadPopup .modal-header div { color:rgba(255,255,255,.65); }

    /* ─── Divider ────────────────────────────────────────── */
    .yellow-divider {
      width:60px;
      height:4px;
      background:var(--red);
      border-radius:2px;
      margin:10px 0 18px;
    }

    /* ─── Responsive ─────────────────────────────────────── */

    /* Prevent any section/row from causing horizontal scroll */
    section, .stats-strip, footer, nav {
      max-width:100vw;
      overflow-x:clip;
    }

    .row { --bs-gutter-x:1.5rem; }

    @media(max-width:991px) {
      .hero-title { font-size:2.2rem; }
      .section-title { font-size:1.75rem; }
    }

    @media(max-width:767px) {
      .hero-title { font-size:1.7rem; }
      .hero-text { font-size:.9rem; }
      .section-title { font-size:1.5rem; }
      .why-bg { padding:28px 16px; }
      .contact-card { padding:20px 14px; }

      /* Tighter service card buttons on small screens */
      .btn-svc-call, .btn-svc-enquire { font-size:.7rem; padding:6px 4px; }

      /* Scroll-to-top sits above call button */
      #scrollTop { right:28px; bottom:92px; }
    }

    @media(max-width:480px) {
      .hero-title  { font-size:1.45rem; }
      .section-title { font-size:1.25rem; }
      .hero-badge  { font-size:.68rem; }

      /* Collapse enquire label on very small screens */
      .float-enquire-btn { padding:12px 10px; font-size:.72rem; }
    }