/* swap-motor.com: single source of truth overrides */
:root { --brand-blue:#2C94D2; --brand-blue-dark:#1F8AC7; }

button[type="submit"], .btn, .find-part-button {
  background: var(--brand-blue);
  color: #fff;
  border: 0;
}
button[type="submit"]:hover, .btn:hover, .find-part-button:hover {
  background: var(--brand-blue-dark);
}

select, input, textarea {
  outline: none;
}

/* ---- Layout spacing fixes (reduce big gaps) ---- */
.site-main{padding-top:0!important;margin-top:0!important}
.site-main > section{margin-top:0!important}

/* Common hero/banner spacing fixes (covers many templates) */
.hero,.hero-section,.banner,.banner-section,.cover,.cover-container,.top-section{
  padding-top:40px!important;
  padding-bottom:40px!important;
  margin-top:0!important;
  margin-bottom:0!important;
}

/* If form section is pushed down by margin/padding */
.quote-form,.quote-section,.form-section,.lead-form,.lead-form-wrap{
  margin-top:24px!important;
}

/* Reduce huge empty blocks if any */
.spacer,.gap,.empty-space{height:auto!important;min-height:0!important;padding:0!important;margin:0!important}

/* ---- Precise spacing for current swap-motor layout ---- */
.site-main{padding-top:0!important;margin-top:0!important}
.site-main .hero{padding:32px 0!important;margin:0!important}
.site-main .lead-section{padding:16px 0 48px!important;margin:0!important}

/* If containers are adding extra space */
.site-main .hero .container,
.site-main .lead-section .container{padding-top:0!important;padding-bottom:0!important}

/* Keep form close to hero */
.site-main .hero + .lead-section{margin-top:0!important}

/* ---- Text logo (STRICT replica of reference) ---- */
.logo-text{line-height:1}
.logo-swap{
  color:#2296D8;
  font-size:36px;
  font-weight:800;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  letter-spacing:0.5px;
}
.logo-motor{
  color:#000;
  font-size:36px;
  font-weight:800;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  letter-spacing:0.5px;
  margin-left:2px;
}
.logo-tagline{
  margin-top:4px;
  font-size:16px;
  font-weight:600;
  color:#666;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}

/* ---- Header alignment (logo left, phone button right) ---- */
.site-header{background:#fff!important;border-bottom:1px solid rgba(0,0,0,.08)!important}
.site-header .header-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  padding:18px 0!important;
}
.site-header .brand{display:block!important;text-decoration:none!important}
.site-header .calling{
  background:#2296D8!important;
  color:#fff!important;
  padding:14px 18px!important;
  border-radius:8px!important;
  font-weight:800!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* ROW2_SLIDER_MENU_START (Row 2 only; does not touch Row 1) */
.header-nav-slider{background:#fff;border-top:1px solid rgba(0,0,0,.08)}
.header-nav-slider .container{padding-top:2px;padding-bottom:2px}
.nav-links-slider{
  display:flex; align-items:center; gap:16px;
  list-style:none; margin:0; padding:4px 0;
  overflow-x:auto; overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  white-space:nowrap;
}
.nav-links-slider li{flex:0 0 auto}
.nav-links-slider a{display:inline-block;text-decoration:none;color:#111;font-weight:600;padding:6px 10px;border-radius:10px}
.nav-links-slider a:hover{text-decoration:underline}
/* ROW2_SLIDER_MENU_END */


/* ROW2_ACTIVE_AND_COLOR_START (Row 2 only) */
.header-nav-slider{
  background:var(--swapmotor-logo-blue,#2C94D2);
}
.nav-links-slider a{
  color:#fff;
}
.nav-links-slider a:hover{
  background:rgba(255,255,255,.15);
  text-decoration:none;
}
/* Active states by URL */
body.home .nav-links-slider a[href="/"],
body.engines .nav-links-slider a[href="/engines.php"],
body.transmissions .nav-links-slider a[href="/transmissions.php"],
body.other-parts .nav-links-slider a[href="/other-parts.php"],
.nav-links-slider a[aria-current="page"]{
  background:rgba(0,0,0,.18);
  font-weight:700;
}
/* ROW2_ACTIVE_AND_COLOR_END */


/* NEW HERO (swap-motor.com) */
.hero{padding:24px 0}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.hero-left img{width:100%;height:auto;display:block}
@media (max-width:768px){
  .hero-grid{grid-template-columns:1fr}
  .hero-left{display:none}
}

/* HERO CENTER OVERRIDES (swap-motor.com) */
.hero .hero-grid{align-items:center}
.hero .hero-left{display:flex;align-items:center;justify-content:center}
.hero .hero-right{display:flex;align-items:center;justify-content:center}

/* HIDE HERO LEFT ON MOBILE (swap-motor.com) */
@media (max-width:768px){
  .hero .hero-left{display:none!important}
}

/* HERO COPY + CTA (swap-motor.com) */
.hero .hero-copy{margin-bottom:12px}
.hero .hero-title{margin:0 0 8px!important;line-height:1.12!important}
.hero .hero-para{display:none;margin:0 0 10px!important;opacity:.92}
.hero .hero-mobile-cta{display:none;text-decoration:none;font-weight:800;border-radius:12px;padding:12px 16px}

/* Mobile: show paragraph + CTA */
@media (max-width:768px){
  .hero .hero-para{display:block}
  .hero .hero-mobile-cta{display:inline-flex;align-self:flex-start}
}

/* FIX: prevent hero overlapping locked header (Row-1) */
.hero{padding-top:140px}.hero-inner{position:relative}

/* FORCE HERO BG (auto-picked) */
.hero{background-image:url("/images/used-engine.png")!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important}

/* HERO_SPLIT_START */
.hero-split{padding:28px 0}
.hero-split .hero-split-inner{display:flex;gap:28px;align-items:stretch}
.hero-split .hero-split-left,.hero-split .hero-split-right{flex:1;display:flex;align-items:center;justify-content:center}
.hero-split .hero-img-wrap{width:100%;max-width:560px}
.hero-split .hero-img-wrap img{width:100%;height:auto;display:block;border-radius:18px}
.hero-split .hero-form-wrap{width:100%;max-width:420px;display:flex;align-items:center;justify-content:center}
.hero-split .hero-form-wrap form{width:100%}
@media (max-width: 992px){.hero-split .hero-split-inner{flex-direction:column}.hero-split .hero-img-wrap{max-width:520px}.hero-split .hero-form-wrap{max-width:520px}}
/* HERO_SPLIT_END */

/* FIX: stretch hero form to container width */
.hero-split-right{align-items:stretch!important}
.hero-form-wrap{width:100/* FIX: stretch hero form to container width */
.hero-split-right{align-items:stretch !important;}
.hero-form-wrap{width:100% !important;max-width:none !important;}
.hero-form-wrap form{width:100% !important;max-width:none !important;}
.hero-form-wrap .form-group{width:100% !important;}
.hero-form-wrap input,
.hero-form-wrap select,
.hero-form-wrap button{width:100% !important;}
/* HOME HERO: remove any width caps so form can stretch */
#home-hero .hero-split-right{width:auto !important;max-width:none !important;align-items:stretch !important;}
#home-hero .hero-form-wrap{width:100% !important;max-width:none !important;}
#home-hero .hero-form-wrap form{width:100% !important;max-width:none !important;}
#home-hero .hero-form-wrap .card{width:100% !important;max-width:none !important;}
/* HOME HERO: make right column wider than left */
#home-hero .hero-split-left{flex:0.9 !important;}
#home-hero .hero-split-right{flex:1.1 !important;}
/* HOME HERO: ensure the layout actually has width to stretch */
#home-hero .container{max-width:1200px !important;}
#home-hero .hero-split-inner{width:100% !important;}
#home-hero .hero-split-right{min-width:520px !important;}
@media (max-width: 992px){#home-hero .hero-split-right{min-width:unset !important;}}
/* HOME HERO: kill any card/form fixed width rules coming from other CSS */
#home-hero .card{width:100% !important;max-width:none !important;margin:0 !important;}
#home-hero form#quoteForm{width:100% !important;max-width:none !important;}
/* HOME HERO: hard 2-column layout (right wider) + full-width form */
#home-hero .hero-split-inner{display:grid !important;grid-template-columns: 1fr 1.25fr !important;gap:28px !important;align-items:center !important}
#home-hero .hero-split-left,#home-hero .hero-split-right{width:100% !important;min-width:0 !important}
#home-hero .hero-form-wrap{width:100% !important;max-width:none !important}
#home-hero .hero-form-wrap form{width:100% !important;max-width:none !important}
#home-hero .hero-form-wrap .form-control{width:100% !important}
@media (max-width: 992px){#home-hero .hero-split-inner{grid-template-columns:1fr !important}}

/* FORM_3D_BOX_START */
#quoteForm{
  background:#fff!important;
  border:1px solid rgba(0,0,0,.12)!important;
  border-radius:10px!important;
  box-shadow:0 14px 40px rgba(0,0,0,.12)!important;
  padding:26px 26px 22px!important;
}
@media (max-width: 768px){
  #quoteForm{ padding:18px 16px 16px!important; }
}
/* FORM_3D_BOX_END */


/* FORM_HEADLINE_STYLE */
.form-headline{
  font-size:26px;
  font-weight:700;
  text-align:center;
  margin-bottom:18px;
  color:#222;
}

/* Center submit button */
#quoteForm button[type="submit"],
#quoteForm input[type="submit"]{
  display:block;
  margin:20px auto 0 auto;
  min-width:220px;
}

/* Mobile */
@media (max-width:768px){
  .form-headline{ font-size:22px; }
}


/* FORM_SUBTEXT_STYLE */
.form-subtext{
  text-align:center;
  font-size:15px;
  color:#666;
  margin:-6px 0 18px 0;
  line-height:1.5;
}


/* FORM_CALL_CTA_STYLE */
.form-call-cta{
  display:block;
  text-align:center;
  background:#1f8ac7;
  color:#fff!important;
  font-weight:700;
  font-size:15px;
  padding:12px 14px;
  border-radius:8px;
  text-decoration:none!important;
  margin:0 0 18px 0;
  box-shadow:0 6px 18px rgba(31,138,199,.28);
}
.form-call-cta:hover{ background:#1674a7; }


/* VISIBILITY_FIX_FORM_HERO_START */
/* Desktop: ensure form headline/para/call CTA are visible */
.form-headline,
.form-subtext,
.form-call-cta{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
}

/* Mobile: ensure left hero image is NOT hidden */
@media (max-width: 768px){
  #home-hero .hero-left,
  #home-hero .hero-left *{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }
  #home-hero img{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }
}
/* VISIBILITY_FIX_FORM_HERO_END */


/* VISIBILITY_FIX_HERO_SPLIT_LEFT */
@media (max-width: 768px){
  #home-hero .hero-split-left,
  #home-hero .hero-split-left *{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }
  #home-hero .hero-split-left img{
    display:block!important;
    max-width:100%!important;
    height:auto!important;
    visibility:visible!important;
    opacity:1!important;
  }
}
/* VISIBILITY_FIX_HERO_SPLIT_LEFT_END */


/* HERO_FORM_POLISH_START */
/* Keep two columns on desktop */
#home-hero .hero-split-inner{display:flex;gap:28px;align-items:center}
#home-hero .hero-split-left{flex:1;min-width:0}
#home-hero .hero-split-right{flex:1;min-width:0}
#home-hero .hero-img-wrap img{width:100%;height:auto;display:block}

/* Form wrap + 3D box polish */
#home-hero .hero-form-wrap{width:100%}
#quoteForm{margin:0}

/* Headline / para / call CTA spacing */
.form-headline{margin:0 0 10px 0!important}
.form-subtext{margin:0 0 14px 0!important}
.form-call-cta{margin:0 0 18px 0!important}

/* Mobile: stack columns, image on top */
@media (max-width: 768px){
  #home-hero .hero-split-inner{flex-direction:column;gap:16px}
  #home-hero .hero-split-left,#home-hero .hero-split-right{width:100%}
  #home-hero .hero-img-wrap{max-width:520px;margin:0 auto}
}
/* HERO_FORM_POLISH_END */


/* HIDE_RULES_START */
/* Mobile: hide left hero image */
@media (max-width: 768px){
  #home-hero .hero-split-left{display:none!important;}
}

/* Desktop: hide paragraph + call button */
@media (min-width: 769px){
  #quoteForm .form-subtext{display:none!important;}
  #quoteForm .form-call-cta{display:none!important;}
}
/* HIDE_RULES_END */


/* FINAL_FORCE_HIDE_START */
/* Mobile: hide LEFT hero image (use a wider breakpoint to catch most phones/tablets) */
@media (max-width: 991px){
  #home-hero .hero-split-left{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    height:0!important;
    max-height:0!important;
    overflow:hidden!important;
  }
}

/* Desktop: hide PARA + CALL button (keep headline) */
@media (min-width: 992px){
  #home-hero #quoteForm .form-subtext,
  #home-hero #quoteForm .form-call-cta{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    height:0!important;
    max-height:0!important;
    overflow:hidden!important;
    margin:0!important;
    padding:0!important;
  }
}
/* FINAL_FORCE_HIDE_END */


/* FORCE_HIDE_IMAGE_MOBILE_START */
@media (max-width: 991px){
  #home-hero .hero-split-left,
  #home-hero .hero-img-wrap,
  #home-hero .hero-img-wrap img,
  #home-hero img[src*="used-engine"]{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    height:0!important;
    max-height:0!important;
    overflow:hidden!important;
  }
}
/* FORCE_HIDE_IMAGE_MOBILE_END */


/* THANKYOU OPTIONS UI (best balance) */
.ty-page{padding:18px 0 28px}
.ty-container{max-width:980px;margin:0 auto;padding:0 14px}
.ty-note-card,.ty-option-card,.ty-bottom-bar{background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:12px;box-shadow:0 10px 26px rgba(0,0,0,.08)}
.ty-note-card{padding:22px 18px;text-align:center;margin:14px 0 16px}
.ty-note-title{font-weight:800;color:#c51f1f;font-size:22px;margin-bottom:6px}
.ty-note-big{color:#c51f1f;font-weight:700;font-size:20px;line-height:1.35;margin:0 auto 8px;max-width:820px}
.ty-note-sub{color:#2b2b2b;font-size:16px;margin-bottom:10px}
.ty-live{display:flex;gap:10px;align-items:center;justify-content:center;color:#1f1f1f;font-size:16px}
.ty-live-dot{width:12px;height:12px;border-radius:50%;background:#29c45a;display:inline-block;box-shadow:0 0 0 5px rgba(41,196,90,.18)}

.ty-option-card{padding:16px 16px 14px;margin:0 0 16px}
.ty-opt-top{display:grid;grid-template-columns: 1fr 220px;gap:16px;align-items:start}
.ty-opt-label{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.ty-opt-text{font-size:18px;color:#1b1b1b}
.ty-badge{background:#f39a22;color:#fff;font-weight:700;font-size:13px;padding:6px 10px;border-radius:10px;line-height:1}
.ty-opt-title{font-weight:900;color:#d21f1f;font-size:28px;margin:4px 0 12px;text-align:center}
.ty-opt-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ty-opt-list li{display:grid;grid-template-columns: 34px 1fr;gap:10px;align-items:start;padding:10px 10px;border-top:1px solid rgba(0,0,0,.07)}
.ty-opt-list li:first-child{border-top:none}
.ty-ic{width:34px;height:34px;display:flex;align-items:center;justify-content:center;font-size:18px}
.ty-line-strong{font-weight:900;color:#1f1f1f;font-size:18px;line-height:1.15}
.ty-line-sub{color:#606060;font-size:14px;margin-top:2px}

.ty-warning{margin-top:10px;display:flex;align-items:center;gap:8px;color:#d06d00;font-weight:700}
.ty-warn-ic{font-size:16px}

.ty-opt-right{display:flex;flex-direction:column;align-items:stretch;gap:10px}
.ty-img-wrap{height:130px;border-radius:10px;background:linear-gradient(135deg, rgba(44,148,210,.10), rgba(0,0,0,.02));border:1px dashed rgba(0,0,0,.12)}
.ty-call-btn{display:flex;align-items:center;justify-content:center;gap:10px;background:linear-gradient(180deg,#2ea4e1,#1f82c2);color:#fff;text-decoration:none;font-weight:900;border-radius:8px;padding:12px 14px;box-shadow:0 10px 18px rgba(31,130,194,.25)}
.ty-call-btn:hover{filter:brightness(1.02)}
.ty-call-ic{width:26px;height:26px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.18);border-radius:7px}
.ty-call-small{font-size:13px;color:#333;text-align:center}
.ty-dyn{font-weight:900}

.ty-bottom-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;margin-top:8px}
.ty-bottom-title{font-weight:900;font-size:20px;color:#1a1a1a}
.ty-bottom-sub{color:#666;margin-top:2px}
.ty-call-btn-small{padding:10px 12px}

@media (max-width: 820px){
  .ty-opt-top{grid-template-columns:1fr}
  .ty-opt-title{text-align:left;font-size:24px}
  .ty-opt-right{flex-direction:row;align-items:center;justify-content:space-between}
  .ty-img-wrap{display:none}
  .ty-call-small{display:none}
}
