/* v434G — Add-on Services page manual layout cleanup.
   Scope: add-on-services.html only. Page-by-page pass after Fees, FAQ, Check Status. */

body.addon-page{
  --addon-rail: 1368px;
  --addon-gutter: clamp(36px, 4.2vw, 72px);
  --addon-gap: clamp(28px, 3vw, 48px);
}

/* One consistent rail across the whole Add-on Services page. */
body.addon-page .addon-hero > .container,
body.addon-page main > .section > .container,
body.addon-page footer > .container,
body.addon-page .footer-grid{
  width:min(calc(100% - (var(--addon-gutter) * 2)), var(--addon-rail)) !important;
  max-width:var(--addon-rail) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

/* Hero: align copy and visual as a balanced composition, not a wide top block followed by shifted content. */
body.addon-page .addon-hero{
  padding-left:0 !important;
  padding-right:0 !important;
}

body.addon-page .addon-hero-grid{
  display:grid !important;
  grid-template-columns:minmax(0, .96fr) minmax(460px, 1.04fr) !important;
  gap:var(--addon-gap) !important;
  align-items:center !important;
}

body.addon-page .addon-hero h1{
  max-width:760px !important;
}

body.addon-page .addon-hero p,
body.addon-page .addon-hero .muted{
  max-width:720px !important;
}

body.addon-page .addon-hero .urgent-visual-card{
  width:100% !important;
  max-width:640px !important;
  margin-left:auto !important;
  margin-right:0 !important;
}

/* Section rhythm and headings should all start from the same left rail. */
body.addon-page main > .section{
  padding-top:clamp(62px, 5.6vw, 96px) !important;
  padding-bottom:clamp(62px, 5.6vw, 96px) !important;
}

body.addon-page main > .section > .container > .eyebrow,
body.addon-page main > .section > .container > h2,
body.addon-page main > .section > .container > p.muted,
body.addon-page main > .section > .container > .section-lead{
  margin-left:0 !important;
  margin-right:auto !important;
  text-align:left !important;
}

body.addon-page main > .section > .container > h2{
  max-width:1120px !important;
}

body.addon-page main > .section > .container > p.muted,
body.addon-page main > .section > .container > .section-lead{
  max-width:980px !important;
}

/* Intro and reassurance cards: equal width and equal rhythm. */
body.addon-page .addon-intro-section .grid.three,
body.addon-page .airport-experience-section .grid.four,
body.addon-page .addon-reassurance-section .grid.three,
body.addon-page .trust-boundary-section .grid.two{
  width:100% !important;
  max-width:100% !important;
  display:grid !important;
  gap:var(--addon-gap) !important;
  justify-content:center !important;
  align-items:stretch !important;
}

body.addon-page .addon-intro-section .grid.three{
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
}

body.addon-page .airport-experience-section .grid.four{
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
}

body.addon-page .addon-reassurance-section .grid.three{
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
}

body.addon-page .trust-boundary-section .grid.two{
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
}

body.addon-page .step,
body.addon-page .trust-card,
body.addon-page .card{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}

/* Main add-on cards: every card uses the same rail, image/content balance, and no alternating visual drift. */
body.addon-page .addon-service-list{
  width:100% !important;
  max-width:100% !important;
  margin:clamp(30px, 3vw, 44px) auto 0 !important;
  display:grid !important;
  gap:clamp(34px, 3.6vw, 56px) !important;
}

body.addon-page .addon-service-card{
  width:100% !important;
  max-width:100% !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:minmax(430px, .9fr) minmax(0, 1.1fr) !important;
  gap:clamp(32px, 3.6vw, 58px) !important;
  align-items:center !important;
  box-sizing:border-box !important;
  border-radius:30px !important;
}

body.addon-page .addon-service-card:nth-child(even){
  grid-template-columns:minmax(0, 1.1fr) minmax(430px, .9fr) !important;
}

body.addon-page .addon-service-card:nth-child(even) .addon-service-media{
  order:2 !important;
}

body.addon-page .addon-service-card:nth-child(even) .addon-service-content{
  order:1 !important;
}

body.addon-page .addon-service-media,
body.addon-page .addon-service-content{
  min-width:0 !important;
  max-width:100% !important;
}

body.addon-page .addon-service-media img{
  width:100% !important;
  height:100% !important;
  min-height:320px !important;
  object-fit:cover !important;
}

body.addon-page .addon-detail-grid{
  width:100% !important;
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:20px !important;
}

/* Add-on request area: align the instructions and action buttons to the same rail. */
body.addon-page .addon-request-section > .container{
  display:grid !important;
  grid-template-columns:minmax(0, .82fr) minmax(520px, 1.18fr) !important;
  gap:var(--addon-gap) !important;
  align-items:center !important;
}

body.addon-page .addon-request-section .step-list-card.urgent-step-list{
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
}

body.addon-page .addon-request-section .hero-actions{
  justify-content:flex-start !important;
}

/* Lower two-column CTA/support sections. */
body.addon-page .section > .container.grid.two{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:var(--addon-gap) !important;
  align-items:stretch !important;
}

/* Make decorative background lines less likely to visually imply a different rail. */
body.addon-page .section::before,
body.addon-page .section::after{
  pointer-events:none !important;
}

/* Floating Need Help spacing on this content-heavy page. */
@media (min-width:1100px){
  body.addon-page .vge-chatbot-root:not(.is-open){
    right:18px !important;
  }
}

/* Responsive: stack cleanly and keep a single rail. */
@media (max-width:1180px){
  body.addon-page{
    --addon-gutter:clamp(24px, 5vw, 42px);
  }

  body.addon-page .addon-hero-grid,
  body.addon-page .addon-service-card,
  body.addon-page .addon-service-card:nth-child(even),
  body.addon-page .addon-request-section > .container,
  body.addon-page .section > .container.grid.two{
    grid-template-columns:1fr !important;
  }

  body.addon-page .addon-service-card:nth-child(even) .addon-service-media,
  body.addon-page .addon-service-card:nth-child(even) .addon-service-content{
    order:initial !important;
  }

  body.addon-page .addon-hero .urgent-visual-card{
    max-width:760px !important;
    margin-left:0 !important;
    margin-right:auto !important;
  }

  body.addon-page .addon-intro-section .grid.three,
  body.addon-page .airport-experience-section .grid.four,
  body.addon-page .addon-reassurance-section .grid.three,
  body.addon-page .trust-boundary-section .grid.two{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width:700px){
  body.addon-page{
    --addon-gutter:18px;
  }

  body.addon-page main > .section{
    padding-top:44px !important;
    padding-bottom:44px !important;
  }

  body.addon-page .addon-service-card{
    border-radius:22px !important;
  }

  body.addon-page .addon-service-media img{
    min-height:220px !important;
  }

  body.addon-page .addon-detail-grid,
  body.addon-page .addon-intro-section .grid.three,
  body.addon-page .airport-experience-section .grid.four,
  body.addon-page .addon-reassurance-section .grid.three,
  body.addon-page .trust-boundary-section .grid.two{
    grid-template-columns:1fr !important;
  }
}