:root{
      --brickline-red:#A32020;
      --brickline-dark:#231F20;
      --white:#ffffff;
      --soft-grey:#f6f7f9;
      --muted:#6b7280;
      --stroke:rgba(0,0,0,0.10);
      --shadow:0 18px 50px rgba(0,0,0,0.08);
    }

    body{
      font-family:'DM Sans',sans-serif;
      color:var(--brickline-dark);
      background:var(--white);
      line-height:1.7;
      overflow-x:hidden;
    }

    h1,h2,h3,h4,h5{
      font-family:'Space Grotesk',sans-serif;
      font-weight:700;
    }

    /* NAVBAR */
    .navbar{
      background:rgba(255,255,255,0.98);
      backdrop-filter:blur(15px);
      padding:15px 0;
      border-bottom:1px solid var(--stroke);
    }

    .navbar .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(35,31,32,0.95)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }

    .nav-link{
      font-weight:700;
      text-transform:uppercase;
      font-size:13px;
      letter-spacing:1px;
      color:var(--brickline-dark)!important;
      transition:0.3s;
    }

    .nav-link:hover,
    .dropdown-item:hover{
      color:var(--brickline-red)!important;
    }

    .btn-nav,
    .btn-quote-header{
      background:var(--brickline-red);
      color:#fff!important;
      border-radius:4px;
      padding:10px 24px;
      font-weight:800;
      text-transform:uppercase;
      font-size:0.75rem;
      text-decoration:none;
      border:none;
      display:inline-block;
    }
    .btn-nav:hover,
    .btn-quote-header:hover{
      background:#111;
      color:#fff!important;
    }

    /* DROPDOWN (STATIC + NO JUMP) */
    .nav-item.dropdown{ position:relative; }

    .dropdown-menu{
      position:absolute;
      top:100%;
      left:0;
      margin-top:10px;
      border:none;
      box-shadow:var(--shadow);
      border-radius:12px;
      padding:12px;
      border-top:4px solid var(--brickline-red);
      min-width:220px;
    }

    .dropdown-item{
      font-weight:700;
      text-transform:uppercase;
      font-size:12px;
      letter-spacing:0.5px;
      padding:10px 15px;
      border-radius:8px;
    }

    .dropdown-item:hover{
      background:rgba(163,32,32,0.08);
    }

    /* Optional: hover open on desktop only (stable, no JS) */
    @media (min-width: 992px){
      .nav-item.dropdown:hover > .dropdown-menu{ display:block; }
      .nav-item.dropdown:hover > .dropdown-toggle{ color:var(--brickline-red)!important; }
    }

    /* HEADER */
    .contact-header{
      padding:180px 0 120px;
      background:linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.8)),
                 url('../images/contact-project-banner.jpg');
      background-size:cover;
      background-position:center;
      color:#fff;
      text-align:center;
      margin-top:78px; /* space for fixed nav */
    }

    /* CONTACT CARD */
    .contact-card{
      background:#fff;
      border-radius:20px;
      padding:50px;
      box-shadow:var(--shadow);
      margin-top:-100px;
      border:1px solid var(--stroke);
      position:relative;
      z-index:5;
    }

    .form-label{
      font-weight:700;
      font-size:0.85rem;
      text-transform:uppercase;
      color:var(--brickline-dark);
      margin-bottom:8px;
    }

    .form-control,.form-select{
      border:1px solid var(--stroke);
      padding:14px;
      border-radius:10px;
      background:var(--soft-grey);
      margin-bottom:20px;
    }

    .form-control:focus,.form-select:focus{
      border-color:var(--brickline-red);
      box-shadow:none;
      background:#fff;
    }

    .sub-dropdown-area{
      display:none;
      padding:18px;
      background:var(--soft-grey);
      border-radius:10px;
      margin-bottom:20px;
      border-left:4px solid var(--brickline-red);
    }

    /* INFO */
    .info-item{
      display:flex;
      align-items:center;
      margin-bottom:30px;
      gap:20px;
    }

    .info-icon{
      width:50px;height:50px;border-radius:10px;
      background:var(--brickline-red);
      color:#fff;
      display:flex;align-items:center;justify-content:center;
      font-size:1.2rem;
      flex:0 0 auto;
    }

    .info-text h4{ margin-bottom:0; font-size:1.1rem; }
    .info-text p{ margin-bottom:0; color:var(--muted); }

    @media (max-width: 991px){
      .contact-card{ padding:30px; margin-top:20px; }
      .contact-header{ padding:140px 0 60px; margin-top:70px; }
      .dropdown-menu{
        position:static;
        box-shadow:none;
        border-radius:12px;
        margin-top:8px;
        border-top:0;
        padding:8px;
      }
    }
