:root{
      --primary:#1a1a1a;
      --accent:#A32020;
      --accent-soft:#fdf2f2;
      --text-main:#2d3436;
      --text-muted:#636e72;
      --bg-white:#ffffff;
      --bg-soft:#fafafa;
      --space-lg:110px;
      --brickline-red:#A32020;
      --brickline-dark:#231F20;
      --shadow:0 18px 50px rgba(0,0,0,0.08);
      --stroke:rgba(0,0,0,0.10);
    }

    body{
      font-family:'Plus Jakarta Sans',sans-serif;
      color:var(--text-main);
      background-color:var(--bg-white);
      line-height:1.7;
      overflow-x:hidden;
    }
    h1,h2,h3,h4{ font-family:'Outfit',sans-serif; letter-spacing:-0.03em; }
    .text-soft{ color: rgba(255,255,255,0.72) !important; }
    .bg-soft{ background: var(--bg-soft); }

    /* NAVBAR */
    .navbar{
      background:rgba(255,255,255,0.98);
      backdrop-filter:blur(15px);
      border-bottom:1px solid var(--stroke);
      padding:15px 0;
    }
    .nav-link{
      font-family:'DM Sans',sans-serif;
      font-weight:700;
      font-size:13px;
      text-transform:uppercase;
      letter-spacing:1px;
      color:var(--primary)!important;
      transition:0.3s;
      padding:10px 14px !important;
    }
    .nav-link:hover{ color:var(--accent)!important; }
    .nav-link.active{ color:var(--accent)!important; }

    .navbar-toggler{
      border:0;
      box-shadow:none !important;
    }
    .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(26,26,26,0.95)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }

    .btn-nav{
      background:var(--accent);
      color:#fff !important;
      border-radius:4px;
      padding:10px 24px;
      font-weight:800;
      text-transform:uppercase;
      font-size:.75rem;
      letter-spacing:1px;
      text-decoration:none;
      border:none;
      transition:.25s ease;
    }
    .btn-nav:hover{ background:var(--primary); transform:translateY(-2px); }

    /* SERVICES split (fix double arrow + keep Services clickable) */
    .nav-split{
      display:inline-flex;
      align-items:center;
      border-radius:10px;
    }
    .nav-split .nav-link{ padding-right:6px !important; }
    .nav-split .dropdown-toggle-split{
      border:0;
      background:transparent;
      padding:10px 10px !important;
      line-height:1;
      color:var(--primary);
      display:flex;
      align-items:center;
      justify-content:center;
      transition:.25s ease;
    }
    .nav-split .dropdown-toggle-split:hover{ color:var(--accent); transform:translateY(-1px); }

    /* Dropdown */
    .dropdown-menu{
      border:none;
      box-shadow:var(--shadow);
      border-radius:12px;
      padding:12px;
      border-top:4px solid var(--accent);
      min-width: 220px;
    }
    .dropdown-item{
      font-family:'DM Sans',sans-serif;
      font-weight:800;
      text-transform:uppercase;
      font-size:12px;
      letter-spacing:.6px;
      padding:10px 12px;
      border-radius:8px;
    }
    .dropdown-item:hover{ background:rgba(163,32,32,0.08); color:var(--primary); }

    /* Desktop hover open (optional, clean + no JS) */
    @media (min-width:992px){
      .nav-item.dropdown:hover .dropdown-menu{ display:block; margin-top:0; }
    }

    /* HERO */
    .banner-header{
      position:relative;
      height:500px;
      background:
        linear-gradient(rgba(0,0,0,0.72), rgba(0,0,0,0.72)),
        url('https://images.unsplash.com/photo-1541888946425-d81bb19240f5?q=80&w=2600&auto=format&fit=crop');
      background-size:cover;
      background-position:center;
      background-attachment:fixed;
      display:flex;
      align-items:center;
      justify-content:center;
      color:#fff;
      margin-top:80px;
      overflow:hidden;
    }
    .banner-header::after{
      content:"";
      position:absolute;
      inset:-120px -120px auto auto;
      width:520px; height:520px;
      background:radial-gradient(circle at 35% 35%, rgba(163,32,32,0.35), rgba(163,32,32,0));
      pointer-events:none;
      transform:rotate(10deg);
    }
    .banner-title{ font-size:clamp(3rem,7vw,5rem); font-weight:900; }
    .breadcrumb-wrap{
      font-weight:800;
      font-size:.9rem;
      text-transform:uppercase;
      letter-spacing:2px;
      opacity:.9;
    }
    .breadcrumb-wrap span{ color:var(--accent); }

    .section-padding{ padding:var(--space-lg) 0; }
    .kicker{
      color:var(--accent);
      text-transform:uppercase;
      font-weight:900;
      font-size:.85rem;
      letter-spacing:3px;
      margin-bottom:15px;
      display:block;
    }
    .overlap-box{
      position:relative;
      z-index:1;
      padding:60px;
      background:var(--bg-white);
      border-radius:0 40px 40px 0;
      box-shadow:40px 0 80px rgba(0,0,0,0.05);
      margin-right:-10%;
      border:1px solid rgba(0,0,0,0.05);
    }
    .overlap-box .lead{ font-weight:600; }

    .cta-row{ display:flex; gap:12px; flex-wrap:wrap; margin-top:18px; }
    .btn-ghost{
      border:1px solid rgba(0,0,0,0.16);
      background:#fff;
      color:var(--primary);
      padding:12px 18px;
      border-radius:10px;
      font-weight:900;
      text-transform:uppercase;
      font-size:12px;
      letter-spacing:1px;
      text-decoration:none;
      transition:.25s ease;
    }
    .btn-ghost:hover{ border-color:rgba(163,32,32,0.4); transform:translateY(-2px); }

    .floating-stats{
      background:rgba(255,255,255,0.90);
      backdrop-filter:blur(10px);
      border:1px solid rgba(163,32,32,0.12);
      border-radius:12px;
      padding:22px 24px;
      position:absolute;
      bottom:-44px;
      right:10%;
      z-index:10;
      display:flex;
      gap:34px;
      box-shadow:0 20px 40px rgba(0,0,0,0.10);
    }
    .stat-num{ font-family:'Outfit'; font-weight:900; line-height:1; }

    /* Vision/Mission */
    .vm-panel{
      border-radius:16px;
      background:linear-gradient(180deg, #231F20 0%, #0f0d0e 100%);
      border:1px solid rgba(255,255,255,0.06);
    }

    /* Workflow */
    .workflow-road{
      position:relative;
      padding-left:50px;
      border-left:2px dashed #ddd;
      margin-left:20px;
    }
    .workflow-node{ position:relative; margin-bottom:50px; }
    .workflow-node::before{
      content:'';
      position:absolute;
      left:-61px;
      top:0;
      width:20px;
      height:20px;
      background:var(--accent);
      border-radius:50%;
      border:4px solid #fff;
      box-shadow:0 0 10px rgba(163,32,32,0.5);
    }
    .node-num{
      font-family:'Outfit';
      font-weight:900;
      color:#efefef;
      font-size:4rem;
      position:absolute;
      top:-30px;
      right:0;
      z-index:-1;
    }

    /* Pillars */
    .pillar-card{
      background:var(--bg-soft);
      border-radius:20px;
      padding:46px 38px;
      height:100%;
      transition:0.35s ease;
      border:1px solid transparent;
      position:relative;
      overflow:hidden;
    }
    .pillar-card::after{
      content:"";
      position:absolute;
      inset:-90px -90px auto auto;
      width:260px; height:260px;
      background:radial-gradient(circle at 30% 30%, rgba(163,32,32,0.14), rgba(163,32,32,0));
      transform:rotate(10deg);
      pointer-events:none;
    }
    .pillar-card:hover{
      background:#fff;
      transform:translateY(-12px);
      border-color:rgba(163,32,32,0.35);
      box-shadow:0 30px 60px rgba(0,0,0,0.07);
    }
    .pillar-icon{ font-size:3rem; color:var(--accent); margin-bottom:18px; opacity:.9; }

    /* Team */
    .team-card{ position:relative; text-align:center; }
    .team-img-wrap{
      border-radius:24px;
      overflow:hidden;
      aspect-ratio:1/1.2;
      margin-bottom:18px;
      box-shadow:0 15px 35px rgba(0,0,0,0.10);
    }
    .team-img-wrap img{
      width:100%; height:100%;
      object-fit:cover;
      filter:grayscale(100%);
      transition:0.6s ease;
    }
    .team-card:hover img{ filter:grayscale(0%); transform:scale(1.05); }

    /* Footer */
    .main-footer{
      background:linear-gradient(180deg,#231F20 0%,#0f0d0e 100%);
      color:#fff;
      padding:80px 0 0;
    }
    .footer-top{
      padding-bottom:50px;
      border-bottom:1px solid rgba(255,255,255,0.10);
    }
    .footer-title{
      font-family:'Space Grotesk';
      font-weight:700;
      text-transform:uppercase;
      font-size:1rem;
      letter-spacing:1px;
      margin-bottom:22px;
      color:#fff;
    }
    .footer-link{
      color:rgba(255,255,255,0.70);
      text-decoration:none;
      transition:0.3s;
      font-size:0.9rem;
      display:block;
      margin-bottom:12px;
    }
    .footer-link:hover{ color:#fff; padding-left:5px; }

    .contact-card-footer{
      background:rgba(255,255,255,0.04);
      border-radius:12px;
      padding:22px;
      border:1px solid rgba(255,255,255,0.07);
      transition:0.3s;
    }
    .contact-card-footer:hover{ background:rgba(163,32,32,0.12); }
    .footer-label{
      font-size:10px;
      letter-spacing:1.2px;
      text-transform:uppercase;
      font-weight:900;
      color:rgba(255,255,255,0.65) !important; /* FIX: visible on dark */
      display:block;
      margin-bottom:2px;
    }
    .contact-value{
      color:#fff;
      font-weight:900;
      letter-spacing:.2px;
    }
    .contact-value a{
      color:#fff;
      text-decoration:none;
      border-bottom:1px dashed rgba(255,255,255,0.25);
    }
    .contact-value a:hover{ border-bottom-color: rgba(255,255,255,0.55); }

    @media (max-width:991px){
      .overlap-box{ border-radius:40px; margin-right:0; padding:30px; }
      .floating-stats{ position:relative; right:0; bottom:0; margin-top:18px; gap:18px; }
      .banner-header{ height:360px; margin-top:70px; background-attachment:scroll; }
      .workflow-road{ margin-left:0; padding-left:34px; }
      .workflow-node::before{ left:-45px; }
    }
