:root{
    --brand:#0b3d6b;        /* deep navy */
    --brand-2:#1565c0;      /* secondary blue */
    --accent:#C6020C;       
    --ink:#0f172a;
    --muted:#5b6675;
    --soft:#f5f7fb;
    --line:#e6ecf3;
  }
  *{ -webkit-font-smoothing:antialiased; }

  .text-brand{ color:var(--brand)!important; }
  .bg-soft{ background:var(--soft); }

 /* HERO */
  .hero-section {
    position: relative;
    min-height: 92vh;
    display: flex;
    align-items: center;
    overflow: hidden;
  }
  .hero-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
  }
  .hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
      135deg,
      rgba(7, 30, 61, 0.92) 0%,
      rgba(11, 53, 98, 0.85) 40%,
      rgba(21, 101, 184, 0.75) 100%
    );
    z-index: 1;
  }
  .hero-content {
    position: relative;
    z-index: 2;
  }
  .hero-content h1 {
    font-size: clamp(2rem, 5vw, 3.4rem);
    color: #fff;
    margin-bottom: 24px;
  }
  .hero-content p {
    color: rgba(255, 255, 255, 0.85);
    font-size: 1.15rem;
    max-width: 600px;
  }
  /* FORM CARD */
.hero-form {
    background: rgba(10, 45, 85, 0.95);
    padding: 30px;
    border-radius: 16px;
    backdrop-filter: blur(8px);
}

/* FORM INPUTS */
.hero-form input,
.hero-form select,
.hero-form textarea {
    width: 100%;
    padding: 12px;
    border-radius: 10px !important;
    border: none;
    margin-bottom: 15px;   
}

.nice-select {
  border-radius: 10px !important;
  padding:12px !important;

}

/* TEXTAREA */
.hero-form textarea {
    height: 120px;
    resize: none;
    margin-top:10px;
}


  /* Section helpers */
  section{ 
      padding:5rem 0;
      }
  .section-title{ 
      text-align:center;
     
      margin:0 auto 3rem; 
      
  }


  /* Cards */
  .feature-card{
    background:#fff; 
    border:1px solid var(--line); 
    border-radius:18px; 
    padding:1.75rem;
    height:100%; 
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    box-shadow:0 4px 14px rgba(15,23,42,.04);
  }
  .feature-card:hover{ 
      transform:translateY(-6px); 
      box-shadow:0 18px 40px rgba(11,61,107,.14); 
      border-color:#cfdcec; 
      
  }
  .feature-card .ico{
    width:54px; 
    height:54px;
    border-radius:14px;
    background:linear-gradient(135deg, var(--brand) 0%, var(--brand-2) 100%);
    color:#fff; display:
    inline-flex; 
    align-items:center;
    justify-content:center; 
    font-size:1.25rem; 
    margin-bottom:1rem;
    box-shadow:0 10px 22px rgba(11,61,107,.28);
  }
  .feature-card h4{ 
     
      margin-bottom:.5rem; 
      
  }
  .feature-card p{ 
      color:var(--muted); 
      margin:0; 
      
      line-height:1.65; }

  /* Problem list cards (alternating accent) */
  .pcard{
    background:#fff; 
    border:1px solid var(--line);
    border-left:4px solid var(--brand);
    border-radius:14px; 
    padding:1.25rem 1.25rem 1.25rem 1.25rem;
    height:100%;
    transition:all .25s ease; 
    box-shadow:0 4px 14px rgba(15,23,42,.04);
  }
  .pcard:hover{ 
      transform:translateY(-4px); 
      box-shadow:0 14px 30px rgba(11,61,107,.12); 
      border-left-color:var(--accent); 
      
  }
  .pcard h4{ 
      color:var(--brand);
      margin-bottom:.35rem;
      display:flex; 
      align-items:center; 
      gap:.55rem; 
      
  }
  .pcard h4 i{ 
      color:var(--accent);
      }
  .pcard p{ 
      
      margin:0;  
      line-height:1.6; }

  /* Process */
  .step{
    background:#fff; border:1px solid var(--line); border-radius:18px; padding:1.75rem;
    height:100%; position:relative; transition:all .25s ease; box-shadow:0 4px 14px rgba(15,23,42,.04);
  }
  .step:hover{ transform:translateY(-6px); box-shadow:0 18px 40px rgba(11,61,107,.14); }
  .step .num{
    position:absolute; 
    top:-18px; 
    left:24px;
    width:42px; 
    height:42px;
    border-radius:50%;
    background:var(--accent); 
    color: white; 
    display:inline-flex;
    align-items:center; 
    justify-content:center;
    font-weight:800;
    box-shadow:0 8px 18px rgba(232,163,23,.35);
    border:3px solid #fff;
  }
  .step .ico{
      color:var(--brand-2); 
      font-size:1.5rem; 
      margin:.4rem 0 .8rem; 
      
  }
  .step h3{
      font-size:20px; 
      margin-bottom:10px;
  }
  .step p{ 
      color:var(--muted); 
      margin:0; 
      line-height:1.6; }

  /* Split cards (residential / commercial) */
  .split-card{
    background:#fff;
    border:1px solid var(--line); 
    border-radius:20px; 
    overflow:hidden; 
    height:100%;
    transition:all .3s ease; 
    box-shadow:0 6px 18px rgba(15,23,42,.06);
  }
  .split-card:hover{ 
      transform:translateY(-6px); 
      box-shadow:0 22px 44px rgba(11,61,107,.16);
      }
  .split-card .img-wrap{ 
      height:322px; 
      overflow:hidden;
      }
  .split-card .img-wrap img{ 
      width:100%; 
      height:100%;
      object-fit:cover; 
      transition:transform .5s ease; }
  .split-card:hover .img-wrap img{
      transform:scale(1.06); 
      
  }
  .split-card .body{ 
      padding:1.75rem; 
      
  }
  .split-card h3{ 
      color:var(--brand); 
      font-size:1.25rem; 
      
  }
  .split-card p{ 
      color:var(--muted); 
      line-height:1.65;
      margin:0;
      }

  /* Service tiles */
  .svc-tile{
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px; 
    padding:1.5rem;
    height:100%; 
    display:flex; 
    gap:1rem; 
    transition:all .25s ease;
    box-shadow:0 4px 14px rgba(15,23,42,.04);
  }
  .svc-tile:hover{
      transform:translateY(-4px);
      box-shadow:0 14px 32px rgba(11,61,107,.14); 
      border-color:#cfdcec; }
  .svc-tile .ico{
    flex:0 0 50px; 
    width:50px; 
    height:50px; 
    border-radius:12px;
    background:#e9f1fb; 
    color:var(--brand); 
    display:inline-flex;
    align-items:center; 
    justify-content:center; 
    font-size:1.15rem;
    transition:all .25s ease;
  }
  .svc-tile:hover .ico{ 
      background:var(--brand); 
      color:#fff; }
  .svc-tile h4{ 
      color:var(--brand);
     
      margin-bottom:.3rem;
      }
  .svc-tile p{   
      color:var(--muted);
      margin:0; 
     
      line-height:1.6; }

  /* Why list */
  .why-item{
    display:flex; 
    gap:1rem; 
    align-items:flex-start; 
    padding:1.1rem 1.2rem;
    background:#fff; 
    border:1px solid var(--line);
    border-radius:14px;
    height:100%;
    transition:all .25s ease; 
    box-shadow:0 4px 14px rgba(15,23,42,.04);
  }
  .why-item:hover{ 
      transform:translateY(-3px); 
      box-shadow:0 14px 28px rgba(11,61,107,.12);
      border-color:#cfdcec; 
      
  }
  .why-item .chk{
    width:36px; 
    height:36px; 
    border-radius:50%;
    background:var(--brand); 
    color:#fff; 
    display:inline-flex; 
    align-items:center; 
    justify-content:center;
    flex:0 0 36px;
  }
  .why-item h4{ 
     
      color:var(--brand);
      margin-bottom:.2rem;
      }
  .why-item p{ 
    
      margin:0; 
   
   
      line-height:1.55; }


  /* Accordion */
  .accordion-item{ 
      border:1px solid var(--line); 
      border-radius:14px!important;
      overflow:hidden; 
      margin-bottom:.85rem; 
      box-shadow:0 4px 12px rgba(15,23,42,.04); 
      
  }
  .accordion-button{ 
      font-weight:600; 
      color:var(--brand); 
      padding:1.15rem 1.25rem;
      font-size:18px;
      }
  .accordion-button:not(.collapsed){
      background:#e9f1fb; 
      color:var(--brand); 
      box-shadow:none; 
      
  }
  .accordion-button:focus{ 
      box-shadow:none;
      }
  .accordion-body{ 
      color:var(--muted); 
      line-height:1.7; 
      padding:.25rem 1.25rem 1.4rem; 
      
  }

  /* Final info card */
  .info-card{
    background:#fff; border:1px solid var(--line); border-radius:16px; padding:1.5rem;
    display:flex; gap:1rem; align-items:flex-start; height:100%;
    transition:all .25s ease; box-shadow:0 4px 14px rgba(15,23,42,.04);
  }
  .info-card:hover{ transform:translateY(-4px); box-shadow:0 14px 30px rgba(11,61,107,.12); }
  .info-card .ico{
    width:48px; height:48px; border-radius:12px; background:var(--brand); color:#fff;
    display:inline-flex; align-items:center; justify-content:center; flex:0 0 48px;
  }
  .info-card h4{ color:var(--brand); font-size:1rem; margin-bottom:.2rem; }
  .info-card p, .info-card a{ color:var(--muted); margin:0; font-size:.95rem; }
  .info-card a:hover{ color:var(--brand); }

  /* Banner link card */
  .metal-banner{
    background:linear-gradient(120deg, #fff 0%, #f1f6fd 100%);
    border:1px solid var(--line); border-radius:18px; padding:1.75rem;
    display:flex; gap:1.25rem; align-items:center; justify-content:space-between; flex-wrap:wrap;
    transition:all .25s ease; box-shadow:0 6px 18px rgba(15,23,42,.06);
  }
  .metal-banner:hover{ transform:translateY(-3px); box-shadow:0 16px 34px rgba(11,61,107,.14); border-color:#cfdcec; }
  .metal-banner h3{ color:var(--brand); margin:0 0 .25rem; font-size:1.15rem; }
  .metal-banner p{ margin:0; color:var(--muted); font-size:.95rem; }

  @media (max-width: 575.98px){
    section{ padding:3.5rem 0; }
  
    .cta-band{ padding:2rem 1.5rem; }
  }
  .contact-card{
  background: #fff;
    border-radius: 20px;
    padding: 2rem;
    height: 100%;
    border: 1px solid #082c4b;
    box-shadow: 0 10px 30px rgba(8, 44, 75, 0.05);
    text-align: center;
    transition: transform .35s ease, box-shadow .35s ease;
   
}  
.contact-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 50px rgba(8, 44, 75, 0.1);
   
}
.contact-card .c-icon {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    margin: 0 auto 1.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--accent);
    color: #fff;
    font-size: 1.5rem;
}
.contact-card h4 {
    color: var(--brand);
    margin-bottom: 0.75rem;
}
.contact-card a {
    color: var(--brand);
    font-weight: 700;
    font-size: 1.15rem;
    display: block;
    margin-top: 10px;
    margin-bottom: 10px;
}

.final-cta {
    position: relative;
    overflow: hidden;
    border-radius: 28px;
    padding: 4rem 2rem;
    color: #fff;
    background: linear-gradient(120deg, rgba(8, 44, 75, .94) 0%, rgba(8, 44, 75, .78) 100%), url(https://images.unsplash.com/photo-1518780664697-55e3ad937233?w=1600&q=80&auto=format&fit=crop) center / cover no-repeat;
    box-shadow: var(--shadow-lg);
}
.final-cta h2{
    color:white;
}

.inspection-card {
  background: #fff;
  padding: 30px 25px;
  border-left: 5px solid #C6020C;
  border-radius:15px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.07);
  transition: all 0.3s ease;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.inspection-card:hover {
  transform: translateX(10px);
  box-shadow: 0 15px 40px rgba(0,0,0,0.12);
}
.inspection-card h4 {
  color: #082C4B;
  /*font-size: 1.2rem;*/
  margin-bottom: 12px;
 
  line-height: 1.4;
}
.inspection-card p {
  margin-bottom: 0;
  color: #555;
  /*font-size: 0.95rem;*/
  line-height: 1.6;
}