/* style.css */

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

html{
  scroll-behavior:smooth;
}

body{
  font-family:'Inter', sans-serif;
  background:#0b0b0b;
  color:white;
  overflow-x:hidden;
}

.navbar{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  padding:28px 7%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  z-index:100;
}

.logo{
  font-size:2rem;
  font-weight:800;
}

.logo span{
  color:#d94f1d;
}

.nav-links{
  display:flex;
  gap:30px;
}

.nav-links a{
  color:white;
  text-decoration:none;
  transition:0.3s;
  font-weight:500;
}

.nav-links a:hover{
  color:#d94f1d;
}

/* HERO */

.hero{
  min-height:85vh;
  background:
    linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.82)),
    url('https://images.unsplash.com/photo-1503376780353-7e6692767b70?q=80&w=1800&auto=format&fit=crop');
  background-size:cover;
  background-position:center;
  position:relative;
  display:flex;
  align-items:center;
  padding:140px 7% 180px;
}

.hero-overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top right, rgba(217,79,29,0.18), transparent 35%);
}

.hero-content{
  position:relative;
  z-index:2;
  max-width:760px;
}

.hero-badge{
  display:inline-block;
  padding:12px 20px;
  background:rgba(255,255,255,0.08);
  border-radius:50px;
  margin-bottom:30px;
  border:1px solid rgba(255,255,255,0.08);
}

.hero-text h1{
  font-size:5rem;
  line-height:1.02;
  margin-bottom:25px;
  font-weight:800;
}

.hero-text h1 span{
  color:#d94f1d;
}

.hero-text p{
  color:#d0d0d0;
  line-height:1.8;
  font-size:1.15rem;
  margin-bottom:40px;
  max-width:650px;
}

.hero-buttons{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
}

.primary-btn,
.secondary-btn{
  padding:18px 34px;
  border-radius:14px;
  text-decoration:none;
  font-weight:700;
}

.primary-btn{
  background:#d94f1d;
  color:white;
}

.secondary-btn{
  border:1px solid rgba(255,255,255,0.2);
  color:white;
}

/* APPLICATION */

.application-section{
  padding:0 7% 100px;
  margin-top:-110px;
  position:relative;
  z-index:5;
}

.application-wrapper{
  display:grid;
  grid-template-columns:420px 1fr;
  gap:35px;
  align-items:start;
}

/* INFO */

.application-info{
  background:#141414;
  border-radius:28px;
  padding:40px;
  border:1px solid rgba(255,255,255,0.06);
}

.section-tag{
  display:inline-block;
  padding:10px 18px;
  background:rgba(217,79,29,0.15);
  border-radius:50px;
  color:#d94f1d;
  font-weight:600;
  margin-bottom:25px;
}

.application-info h2{
  font-size:2.5rem;
  line-height:1.1;
  margin-bottom:20px;
}

.application-info p{
  color:#bdbdbd;
  line-height:1.8;
  margin-bottom:35px;
}

.info-cards{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.info-card{
  display:flex;
  align-items:center;
  gap:18px;
  background:#1a1a1a;
  border-radius:18px;
  padding:18px;
}

.info-icon{
  width:60px;
  height:60px;
  border-radius:14px;
  background:#232323;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:2rem;
}

/* FORM */

.form-card{
  background:#141414;
  border-radius:28px;
  padding:40px;
  border:1px solid rgba(255,255,255,0.06);
}

.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
}

.input-group{
  margin-bottom:20px;
}

.input-group label{
  display:block;
  margin-bottom:10px;
}

.input-group input,
.input-group select{
  width:100%;
  padding:16px;
  border:none;
  border-radius:14px;
  background:#1d1d1d;
  color:white;
  font-size:1rem;
  border:1px solid rgba(255,255,255,0.05);
}

.input-group input:focus,
.input-group select:focus{
  outline:none;
  border-color:#d94f1d;
}

/* VEHICLE SELECTOR */

.vehicle-section{
  margin:20px 0 30px;
}

.vehicle-section h3{
  margin-bottom:18px;
}

.vehicle-selector{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.vehicle-option{
  background:#1a1a1a;
  border-radius:22px;
  padding:22px;
  border:2px solid transparent;
  cursor:pointer;
  transition:0.3s;
}

.vehicle-option.active{
  border-color:#d94f1d;
  background:rgba(217,79,29,0.12);
}

.vehicle-icon{
  width:72px;
  height:72px;
  border-radius:18px;
  background:#252525;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:18px;
  font-size:2.3rem;
}

.vehicle-details h4{
  margin-bottom:6px;
}

.vehicle-details span{
  color:#aaaaaa;
  font-size:0.92rem;
}

/* BUTTON */

.submit-btn{
  width:100%;
  border:none;
  padding:18px;
  border-radius:14px;
  background:#d94f1d;
  color:white;
  font-size:1rem;
  font-weight:700;
  cursor:pointer;
  margin-top:10px;
}

.secure-note{
  text-align:center;
  margin-top:18px;
  color:#bdbdbd;
}

/* HOW */

.how-section{
  padding:0 7% 100px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:25px;
}

.how-card{
  background:#141414;
  border-radius:24px;
  padding:40px;
}

.how-number{
  width:60px;
  height:60px;
  border-radius:50%;
  background:#d94f1d;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  margin-bottom:20px;
}

/* BENEFITS */

.benefits{
  padding:0 7% 100px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:25px;
}

.benefit-card{
  background:#141414;
  border-radius:24px;
  padding:40px;
}

/* LEGAL */

.legal-section{
  padding:30px 7%;
  background:#101010;
  border-top:1px solid rgba(255,255,255,0.06);
  border-bottom:1px solid rgba(255,255,255,0.06);
}

.legal-section p{
  color:#8f8f8f;
  line-height:1.8;
  font-size:0.9rem;
  text-align:center;
  max-width:1100px;
  margin:auto;
}

/* FOOTER */

.footer{
  padding:50px 7%;
  text-align:center;
}

.footer-logo{
  font-size:2rem;
  font-weight:800;
  margin-bottom:15px;
}

.footer-logo span{
  color:#d94f1d;
}

/* MOBILE */

@media(max-width:1100px){

  .application-wrapper,
  .how-section,
  .benefits{
    grid-template-columns:1fr;
  }

  .hero-text h1{
    font-size:3.7rem;
  }

}

@media(max-width:750px){

  .form-grid,
  .vehicle-selector{
    grid-template-columns:1fr;
  }

  .navbar{
    flex-direction:column;
    gap:20px;
  }

  .hero-text h1{
    font-size:2.8rem;
  }

}
/* Shared homepage-style SEO landing pages */
.how-section{background:#101012;color:#fff;padding:72px 24px;scroll-margin-top:85px}.how-inner{max-width:1160px;margin:auto}.how-label{color:#ff6b34;font-weight:700;letter-spacing:.1em}.how-inner h2{font-size:clamp(2rem,4vw,3rem);margin:14px 0 32px}.how-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.how-steps>div{background:#1b1b1d;border:1px solid #333;border-radius:18px;padding:26px}.how-steps strong{color:#ff6b34;font-size:24px}.how-steps h3{margin:15px 0 8px}.how-steps p{color:#c9c9cc;line-height:1.65}.location-intro{background:#121214;color:#fff;padding:42px 24px}.location-intro-inner{max-width:1160px;margin:auto}.location-intro h1{font-size:clamp(2rem,4vw,3.1rem);line-height:1.15}.location-intro p{color:#d4d4d6;max-width:800px;line-height:1.7}.seo-container{padding-top:32px!important}.seo-footer a,.footer a{color:#ff7946}.footer div[style] a{color:#ff7946;text-decoration:none}.footer div[style] a:hover{text-decoration:underline}@media(max-width:720px){.how-steps{grid-template-columns:1fr}}
.shared-hero-heading{font-size:clamp(42px,5.2vw,76px);font-weight:800;line-height:1.08;letter-spacing:-.045em}.shared-hero-heading span{color:#ff6332}

/* Location-specific hero */
.hero-location{font-size:clamp(1.55rem,3.4vw,3.5rem);font-weight:800;line-height:1.15;letter-spacing:-.025em;margin-top:14px;color:#fff;text-transform:uppercase;}

/* Consistent full-size budget dropdown across all financing forms */
.input-group select#preferredBudget {
  display:block; width:100%; min-width:0; min-height:58px;
  padding:16px 44px 16px 20px; box-sizing:border-box;
  border:1px solid rgba(255,255,255,.08); border-radius:14px;
  background-color:#1d1d1d; color:#fff; font:inherit; font-size:1rem;
  line-height:1.5; -webkit-appearance:none; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23bcbcbc' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 18px center; background-size:16px;
}
.input-group select#preferredBudget:focus {outline:none; border-color:#d94f1d;}
.input-group select#preferredBudget option {background:#1d1d1d;color:#fff;}

/* How It Works: keep Apply Now heading clear of the application cards */
body:has(.how-apply-heading) .application-section { margin-top: 0; padding-top: 18px; }
body:has(.how-apply-heading) .how-apply-heading { position: relative; z-index: 6; padding: 48px 20px 12px !important; }
body:has(.how-apply-heading) .how-apply-heading h2 { text-align:center; line-height:1.2; }

/* Hub layout: keep the directory cards and application form in separate rows. */
.location-hub-page .application-section { margin-top: 0; padding-top: 48px; clear: both; }
.location-hub-page .seo-container { padding-bottom: 0; }
@media (max-width: 750px) { .location-hub-page .application-section { padding-top: 32px; } }

/* Hub and privacy pages: keep Apply Now fully visible above the form. */
body.location-hub-page .apply-now-heading,
body.privacy-content-page .apply-now-heading {
  display: block;
  position: relative;
  z-index: 6;
  clear: both;
  padding: 54px 20px 28px !important;
  margin: 0 auto;
  text-align: center;
}
body.location-hub-page .apply-now-heading h2,
body.privacy-content-page .apply-now-heading h2 { line-height: 1.2; }
body.location-hub-page .application-section,
body.privacy-content-page .application-section {
  margin-top: 0 !important;
  padding-top: 18px !important;
  clear: both;
}
@media (max-width: 750px) {
  body.location-hub-page .apply-now-heading,
  body.privacy-content-page .apply-now-heading { padding-top: 38px !important; }
}