/* =========================================================
   OUR VEHICLES PAGE STYLING
   Design language: Matches "How to Rent" page and site-wide design
   ========================================================= */

/* Design tokens (matching How to Rent page) */
body.page-slug-our-vehicles,
body[class*="our-vehicles"]{
  --sp-text: #1a1a1a;
  --sp-muted: #666;
  --sp-border: rgba(0,0,0,.10);
  --sp-shadow: 0 10px 30px rgba(0,0,0,.08);
  --sp-radius: 12px;
  --sp-max: 1200px;
  --sp-pad: 32px;
}

/* Remove white space above hero (Astra theme spacing) */
body.page-slug-our-vehicles .site-content,
body.page-slug-our-vehicles .content-area,
body.page-slug-our-vehicles .site-main,
body[class*="our-vehicles"] .site-content,
body[class*="our-vehicles"] .content-area,
body[class*="our-vehicles"] .site-main{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.page-slug-our-vehicles .site-content .ast-container,
body[class*="our-vehicles"] .site-content .ast-container{
  padding-top: 0 !important;
}

body.page-slug-our-vehicles .entry-header,
body[class*="our-vehicles"] .entry-header{
  margin: 0 !important;
  padding: 0 !important;
  display: none !important;
}

/* Remove legacy spacing overrides for vehicle bands in grid */
body.page-slug-our-vehicles .entry-content > .wp-block-group + .wp-block-group,
body[class*="our-vehicles"] .entry-content > .wp-block-group + .wp-block-group{
  margin-top: 0 !important;
}

body.page-slug-our-vehicles .wp-block-cover.alignfull,
body[class*="our-vehicles"] .wp-block-cover.alignfull{
  margin-top: 0 !important;
}

/* =========================================================
   1) HERO SECTION - Match "How to Rent" page
   ========================================================= */

/* Full width hero cover */
body.page-slug-our-vehicles .entry-content .wp-block-cover.alignfull:first-of-type,
body.page-slug-our-vehicles .entry-content .wp-block-cover:first-of-type,
body[class*="our-vehicles"] .entry-content .wp-block-cover.alignfull:first-of-type,
body[class*="our-vehicles"] .entry-content .wp-block-cover:first-of-type,
.sp-vehicles-hero{
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  min-height: 300px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Cover image behavior */
body.page-slug-our-vehicles .entry-content .wp-block-cover:first-of-type .wp-block-cover__image-background,
body[class*="our-vehicles"] .entry-content .wp-block-cover:first-of-type .wp-block-cover__image-background,
.sp-vehicles-hero .wp-block-cover__image-background{
  object-fit: cover !important;
  object-position: center !important;
}

/* Title styling - centered */
body.page-slug-our-vehicles .entry-content .wp-block-cover:first-of-type .wp-block-heading,
body.page-slug-our-vehicles .entry-content .wp-block-cover:first-of-type h1,
body[class*="our-vehicles"] .entry-content .wp-block-cover:first-of-type .wp-block-heading,
body[class*="our-vehicles"] .entry-content .wp-block-cover:first-of-type h1,
.sp-vehicles-hero .wp-block-heading,
.sp-vehicles-hero h1{
  color: #fff !important;
  text-align: center !important;
  margin: 0 auto !important;
  width: 100% !important;
  display: block !important;
}

/* Inner container centers the title */
body.page-slug-our-vehicles .entry-content .wp-block-cover:first-of-type .wp-block-cover__inner-container,
body[class*="our-vehicles"] .entry-content .wp-block-cover:first-of-type .wp-block-cover__inner-container,
.sp-vehicles-hero .wp-block-cover__inner-container{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
  margin: 0 auto !important;
}

/* Overlay opacity */
body.page-slug-our-vehicles .entry-content .wp-block-cover:first-of-type .wp-block-cover__background,
body[class*="our-vehicles"] .entry-content .wp-block-cover:first-of-type .wp-block-cover__background,
.sp-vehicles-hero .wp-block-cover__background{
  opacity: .55 !important;
}

/* =========================================================
   2) VEHICLE BANDS - Carousel on left, description on right
   ========================================================= */

/* Vehicle band container - Add spacing between bands */
/* Target both the container and individual bands inside it */
.sp-vehicle-band,
body.page-slug-our-vehicles .sp-vehicle-band,
body[class*="our-vehicles"] .sp-vehicle-band,
body.page-slug-our-vehicles .entry-content .sp-vehicle-band,
body[class*="our-vehicles"] .entry-content .sp-vehicle-band{
  position: relative !important;
  z-index: 0 !important;
  margin: 0 !important;
  padding: 0 !important; /* No padding */
  width: 100% !important;
}

/* Full-width background using pseudo-element - extends 15px beyond content */
.sp-vehicle-band::before,
body.page-slug-our-vehicles .sp-vehicle-band::before,
body[class*="our-vehicles"] .sp-vehicle-band::before{
  content: "" !important;
  position: absolute !important;
  top: -15px !important; /* Extend 15px above content */
  bottom: -15px !important; /* Extend 15px below content */
  left: 50% !important;
  width: 100vw !important;
  transform: translateX(-50%) !important;
  z-index: -1 !important;
}

/* First band (white background) */
.sp-vehicle-band:nth-child(odd)::before,
body.page-slug-our-vehicles .sp-vehicle-band:nth-child(odd)::before,
body[class*="our-vehicles"] .sp-vehicle-band:nth-child(odd)::before,
.wp-block-columns.sp-vehicle-band:nth-child(odd)::before,
body.page-slug-our-vehicles .wp-block-columns.sp-vehicle-band:nth-child(odd)::before,
body[class*="our-vehicles"] .wp-block-columns.sp-vehicle-band:nth-child(odd)::before{
  background: #ffffff !important; /* White */
}

/* Second band (gray background - #f3f3f3 from Requirements section) */
.sp-vehicle-band:nth-child(even)::before,
body.page-slug-our-vehicles .sp-vehicle-band:nth-child(even)::before,
body[class*="our-vehicles"] .sp-vehicle-band:nth-child(even)::before,
.wp-block-columns.sp-vehicle-band:nth-child(even)::before,
body.page-slug-our-vehicles .wp-block-columns.sp-vehicle-band:nth-child(even)::before,
body[class*="our-vehicles"] .wp-block-columns.sp-vehicle-band:nth-child(even)::before{
  background: #f3f3f3 !important; /* Gray from Requirements section */
}

/* Inner content container - centered with max-width */
/* This is for when sp-vehicle-band is on a parent and wp-block-columns is inside */
.sp-vehicle-band > .wp-block-columns,
body.page-slug-our-vehicles .sp-vehicle-band > .wp-block-columns,
body[class*="our-vehicles"] .sp-vehicle-band > .wp-block-columns{
  max-width: var(--sp-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0 !important; /* Don't override parent margins */
  margin-bottom: 0 !important; /* Don't override parent margins */
  padding: 60px var(--sp-pad) !important;
  position: relative !important;
  z-index: 1 !important;
}

/* CRITICAL: Ensure ALL vehicle bands have bottom margin, especially white (odd) ones */
body.page-slug-our-vehicles .entry-content .wp-block-columns.sp-vehicle-band,
body[class*="our-vehicles"] .entry-content .wp-block-columns.sp-vehicle-band,
body.page-slug-our-vehicles .entry-content .sp-vehicle-band,
body[class*="our-vehicles"] .entry-content .sp-vehicle-band,
body.page-slug-our-vehicles .entry-content > .wp-block-columns.sp-vehicle-band,
body[class*="our-vehicles"] .entry-content > .wp-block-columns.sp-vehicle-band,
body.page-slug-our-vehicles .entry-content > .sp-vehicle-band,
body[class*="our-vehicles"] .entry-content > .sp-vehicle-band{
  margin-bottom: 0 !important;
  margin-top: 0 !important;
}

/* EXTRA SPECIFIC: Target white bands (odd) with maximum specificity */
body.page-slug-our-vehicles .entry-content > .wp-block-columns.sp-vehicle-band:nth-child(odd),
body[class*="our-vehicles"] .entry-content > .wp-block-columns.sp-vehicle-band:nth-child(odd),
body.page-slug-our-vehicles .entry-content .wp-block-columns.sp-vehicle-band:nth-child(odd),
body[class*="our-vehicles"] .entry-content .wp-block-columns.sp-vehicle-band:nth-child(odd){
  margin-bottom: 0 !important;
  margin-top: 0 !important;
}

/* DIRECT TARGETING: When class is on wp-block-columns (the actual structure) */
.wp-block-columns.sp-vehicle-band,
.sp-vehicle-band.wp-block-columns,
body.page-slug-our-vehicles .wp-block-columns.sp-vehicle-band,
body[class*="our-vehicles"] .wp-block-columns.sp-vehicle-band,
body.page-slug-our-vehicles .entry-content .wp-block-columns.sp-vehicle-band,
body[class*="our-vehicles"] .entry-content .wp-block-columns.sp-vehicle-band{
  position: relative !important;
  z-index: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important; /* Padding handled by inner content */
}

/* Full-width background for wp-block-columns structure - extends 15px beyond content */
.wp-block-columns.sp-vehicle-band::before,
body.page-slug-our-vehicles .wp-block-columns.sp-vehicle-band::before,
body[class*="our-vehicles"] .wp-block-columns.sp-vehicle-band::before{
  content: "" !important;
  position: absolute !important;
  top: -15px !important; /* Extend 15px above content */
  bottom: -15px !important; /* Extend 15px below content */
  left: 50% !important;
  width: 100vw !important;
  transform: translateX(-50%) !important;
  z-index: -1 !important;
}

/* First band (white) - odd children */
.wp-block-columns.sp-vehicle-band:nth-child(odd)::before,
body.page-slug-our-vehicles .wp-block-columns.sp-vehicle-band:nth-child(odd)::before,
body[class*="our-vehicles"] .wp-block-columns.sp-vehicle-band:nth-child(odd)::before{
  background: #ffffff !important;
}

/* Second band (gray) - even children */
.wp-block-columns.sp-vehicle-band:nth-child(even)::before,
body.page-slug-our-vehicles .wp-block-columns.sp-vehicle-band:nth-child(even)::before,
body[class*="our-vehicles"] .wp-block-columns.sp-vehicle-band:nth-child(even)::before{
  background: #f3f3f3 !important; /* Gray from Requirements section */
}

/* Inner content padding for wp-block-columns - DO NOT override parent margins */
/* The parent .wp-block-columns.sp-vehicle-band has the margins, this is just for content */
.wp-block-columns.sp-vehicle-band > *,
body.page-slug-our-vehicles .wp-block-columns.sp-vehicle-band > *,
body[class*="our-vehicles"] .wp-block-columns.sp-vehicle-band > *{
  /* Don't add margins here - parent handles it */
}

/* Content container - keep padding but don't interfere with parent margins */
.wp-block-columns.sp-vehicle-band,
body.page-slug-our-vehicles .wp-block-columns.sp-vehicle-band,
body[class*="our-vehicles"] .wp-block-columns.sp-vehicle-band{
  max-width: var(--sp-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin: 0 !important;
  padding: 60px var(--sp-pad) !important;
}

/* Also target wp-block-group if used - apply same full-width background pattern */
.wp-block-group.sp-vehicle-band,
.sp-vehicle-band.wp-block-group,
body.page-slug-our-vehicles .wp-block-group.sp-vehicle-band,
body[class*="our-vehicles"] .wp-block-group.sp-vehicle-band,
body.page-slug-our-vehicles .entry-content .wp-block-group.sp-vehicle-band,
body[class*="our-vehicles"] .entry-content .wp-block-group.sp-vehicle-band{
  position: relative !important;
  z-index: 0 !important;
  margin: 0 !important;
  padding-bottom: 0 !important;
}

/* Full-width background for wp-block-group structure - extends 15px beyond content */
.wp-block-group.sp-vehicle-band::before,
body.page-slug-our-vehicles .wp-block-group.sp-vehicle-band::before,
body[class*="our-vehicles"] .wp-block-group.sp-vehicle-band::before{
  content: "" !important;
  position: absolute !important;
  top: -15px !important; /* Extend 15px above content */
  bottom: -15px !important; /* Extend 15px below content */
  left: 50% !important;
  width: 100vw !important;
  transform: translateX(-50%) !important;
  z-index: -1 !important;
}

/* First band (white) - odd children for groups */
.wp-block-group.sp-vehicle-band:nth-child(odd)::before,
body.page-slug-our-vehicles .wp-block-group.sp-vehicle-band:nth-child(odd)::before,
body[class*="our-vehicles"] .wp-block-group.sp-vehicle-band:nth-child(odd)::before{
  background: #ffffff !important;
}

/* Second band (gray) - even children for groups */
.wp-block-group.sp-vehicle-band:nth-child(even)::before,
body.page-slug-our-vehicles .wp-block-group.sp-vehicle-band:nth-child(even)::before,
body[class*="our-vehicles"] .wp-block-group.sp-vehicle-band:nth-child(even)::before{
  background: #f3f3f3 !important; /* Gray from Requirements section */
}

/* ULTRA-SIMPLE: Target ALL elements with sp-vehicle-band class - add 30px margins for gap */
[class*="sp-vehicle-band"]{
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* SPECIFIC: Target wp-block-columns with sp-vehicle-band (the actual structure) - backgrounds handled above */

/* If the class is on a parent container, target direct child Groups/Columns blocks inside it */
/* This handles the case where sp-vehicle-band is on a parent Group containing multiple vehicle bands */
/* Don't add margins here - let the individual bands handle their own margins */
.sp-vehicle-band > .wp-block-group:not(.sp-vehicle-band),
.sp-vehicle-band > .wp-block-columns,
.sp-vehicle-band .wp-block-group__inner-container > .wp-block-group:not(.sp-vehicle-band),
.sp-vehicle-band .wp-block-group__inner-container > .wp-block-columns,
body.page-slug-our-vehicles .sp-vehicle-band > .wp-block-group:not(.sp-vehicle-band),
body[class*="our-vehicles"] .sp-vehicle-band > .wp-block-group:not(.sp-vehicle-band){
  margin-bottom: 0 !important; /* Don't add extra margin - individual bands handle spacing */
  margin-top: 0 !important;
}

.sp-vehicle-band > .wp-block-group:not(.sp-vehicle-band):last-child,
.sp-vehicle-band > .wp-block-columns:last-child,
.sp-vehicle-band .wp-block-group__inner-container > .wp-block-group:not(.sp-vehicle-band):last-child,
.sp-vehicle-band .wp-block-group__inner-container > .wp-block-columns:last-child,
body.page-slug-our-vehicles .sp-vehicle-band > .wp-block-group:not(.sp-vehicle-band):last-child,
body[class*="our-vehicles"] .sp-vehicle-band > .wp-block-group:not(.sp-vehicle-band):last-child{
  margin-bottom: 0 !important;
}

/* Also handle nested structure - if Groups contain Columns */
.sp-vehicle-band > .wp-block-group > .wp-block-columns,
.sp-vehicle-band .wp-block-group__inner-container > .wp-block-group > .wp-block-columns{
  margin-bottom: 0 !important; /* Columns don't need margin, the Group does */
}

/* Target any Group block that contains a carousel or vehicle description - don't interfere with band margins */
.sp-vehicle-band .wp-block-group:not(.sp-vehicle-band){
  margin-bottom: 0 !important; /* Don't add extra margin - band handles spacing */
}

.sp-vehicle-band .wp-block-group:not(.sp-vehicle-band):last-child{
  margin-bottom: 0 !important;
}

/* Keep bottom margin on last vehicle band for background extension */
/* Background will still extend 15px below even with 30px margin */
.sp-vehicle-band:last-child,
.sp-vehicle-band:last-of-type,
body.page-slug-our-vehicles .sp-vehicle-band:last-child,
body[class*="our-vehicles"] .sp-vehicle-band:last-child,
body.page-slug-our-vehicles .entry-content .sp-vehicle-band:last-child,
body[class*="our-vehicles"] .entry-content .sp-vehicle-band:last-child,
.wp-block-columns.sp-vehicle-band:last-child,
.sp-vehicle-band.wp-block-columns:last-child,
body.page-slug-our-vehicles .wp-block-columns.sp-vehicle-band:last-child,
body[class*="our-vehicles"] .wp-block-columns.sp-vehicle-band:last-child{
  margin-bottom: 0 !important;
}

/* Also target if it's a Group block */
.sp-vehicle-band.wp-block-group,
.wp-block-group.sp-vehicle-band,
body.page-slug-our-vehicles .wp-block-group.sp-vehicle-band,
body[class*="our-vehicles"] .wp-block-group.sp-vehicle-band{
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.sp-vehicle-band.wp-block-group:last-child,
.wp-block-group.sp-vehicle-band:last-child,
body.page-slug-our-vehicles .wp-block-group.sp-vehicle-band:last-child,
body[class*="our-vehicles"] .wp-block-group.sp-vehicle-band:last-child{
  margin-bottom: 0 !important;
}

/* Ensure 60px spacing between consecutive vehicle bands (30px margin on each side) */
.sp-vehicle-band + .sp-vehicle-band,
body.page-slug-our-vehicles .sp-vehicle-band + .sp-vehicle-band,
body[class*="our-vehicles"] .sp-vehicle-band + .sp-vehicle-band,
.wp-block-group.sp-vehicle-band + .wp-block-group.sp-vehicle-band,
body.page-slug-our-vehicles .wp-block-group.sp-vehicle-band + .wp-block-group.sp-vehicle-band,
body[class*="our-vehicles"] .wp-block-group.sp-vehicle-band + .wp-block-group.sp-vehicle-band,
.wp-block-columns.sp-vehicle-band + .wp-block-columns.sp-vehicle-band,
body.page-slug-our-vehicles .wp-block-columns.sp-vehicle-band + .wp-block-columns.sp-vehicle-band,
body[class*="our-vehicles"] .wp-block-columns.sp-vehicle-band + .wp-block-columns.sp-vehicle-band{
  margin-top: 0 !important; /* First band's bottom margin + second band's top margin = 30px */
  padding-top: 0 !important;
}

/* Columns layout for vehicle band */
.sp-vehicle-band .wp-block-columns{
  gap: 40px !important;
  align-items: center !important;
  margin: 0 !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  display: flex !important;
}

/* Ensure columns stretch to match height */
.sp-vehicle-band .wp-block-columns .wp-block-column{
  display: flex !important;
  flex-direction: column !important;
}

/* Ensure the carousel column doesn't overflow */
.sp-vehicle-band .wp-block-column:first-child{
  overflow: hidden !important;
}

/* =========================================================
   SPACING BETWEEN VEHICLE BANDS - More aggressive targeting
   ========================================================= */

/* Target ALL child Groups inside sp-vehicle-band parent (when class is on parent) */
/* Don't interfere with band margins */
body.page-slug-our-vehicles .sp-vehicle-band .wp-block-group:not(.sp-vehicle-band),
body[class*="our-vehicles"] .sp-vehicle-band .wp-block-group:not(.sp-vehicle-band){
  margin-bottom: 0 !important; /* Don't add extra margin - band handles spacing */
  margin-top: 0 !important;
}

body.page-slug-our-vehicles .sp-vehicle-band .wp-block-group:not(.sp-vehicle-band):last-child,
body[class*="our-vehicles"] .sp-vehicle-band .wp-block-group:not(.sp-vehicle-band):last-child{
  margin-bottom: 0 !important;
}

/* Also target Groups that are direct children */
body.page-slug-our-vehicles .sp-vehicle-band > .wp-block-group,
body[class*="our-vehicles"] .sp-vehicle-band > .wp-block-group{
  margin-bottom: 0 !important; /* Don't add extra margin - band handles spacing */
}

body.page-slug-our-vehicles .sp-vehicle-band > .wp-block-group:last-child,
body[class*="our-vehicles"] .sp-vehicle-band > .wp-block-group:last-child{
  margin-bottom: 0 !important;
}

/* ULTRA-SPECIFIC: Target any Group inside entry-content that's a sibling of another Group */
/* Don't interfere with vehicle band margins */
body.page-slug-our-vehicles .entry-content .wp-block-group.sp-vehicle-band + .wp-block-group.sp-vehicle-band,
body[class*="our-vehicles"] .entry-content .wp-block-group.sp-vehicle-band + .wp-block-group.sp-vehicle-band{
  /* Let individual band margins handle spacing */
}

body.page-slug-our-vehicles .entry-content .wp-block-group:not(.sp-vehicle-band):last-child,
body[class*="our-vehicles"] .entry-content .wp-block-group:not(.sp-vehicle-band):last-child{
  margin-bottom: 0 !important;
}

/* Left column - Carousel */
.sp-vehicle-band .wp-block-column:first-child{
  flex-basis: 50% !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  overflow: hidden !important; /* Prevent carousel from overflowing */
  margin-bottom: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important; /* Vertically center the carousel */
  align-items: center !important;
}

/* Right column - Description */
.sp-vehicle-band .wp-block-column:last-child{
  flex-basis: 50% !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important; /* Vertically center the description content */
  align-items: flex-start !important; /* Keep text left-aligned */
}

/* Carousel container */
.sp-vehicle-carousel{
  position: relative !important;
  width: 100% !important;
  overflow: hidden !important;
  border-radius: var(--sp-radius) !important;
  background: #f5f5f5 !important;
  min-height: 300px !important;
  margin-bottom: 0 !important;
}

/* Carousel images container */
.sp-vehicle-carousel .sp-carousel-images{
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 4 / 3 !important;
  overflow: hidden !important;
  min-height: 300px !important;
}

/* Carousel images - handle both img tags and wp-block-image */
.sp-vehicle-carousel .sp-carousel-images .sp-carousel-image,
.sp-vehicle-carousel .sp-carousel-images .wp-block-image.sp-carousel-image,
.sp-vehicle-carousel .sp-carousel-images .sp-carousel-image-wrapper{
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0 !important;
  transition: opacity 0.3s ease !important;
  display: block !important;
  margin: 0 !important;
  z-index: 0 !important;
}

.sp-vehicle-carousel .sp-carousel-images .sp-carousel-image img,
.sp-vehicle-carousel .sp-carousel-images .wp-block-image.sp-carousel-image img,
.sp-vehicle-carousel .sp-carousel-images .sp-carousel-image-wrapper img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

.sp-vehicle-carousel .sp-carousel-images .sp-carousel-image.active,
.sp-vehicle-carousel .sp-carousel-images .wp-block-image.sp-carousel-image.active,
.sp-vehicle-carousel .sp-carousel-images .sp-carousel-image-wrapper.active{
  opacity: 1 !important;
  z-index: 1 !important;
}

/* If images are direct children (before JS moves them) - make them visible */
.sp-vehicle-carousel > .sp-carousel-image,
.sp-vehicle-carousel > .wp-block-image.sp-carousel-image,
.sp-vehicle-carousel .wp-block-column .sp-carousel-image,
.sp-vehicle-carousel .wp-block-column .wp-block-image.sp-carousel-image,
.sp-vehicle-carousel .wp-block-group .sp-carousel-image,
.sp-vehicle-carousel .wp-block-group .wp-block-image.sp-carousel-image{
  position: relative !important;
  width: 100% !important;
  margin: 0 0 12px 0 !important;
  display: block !important;
  opacity: 1 !important;
}

/* Ensure first image is always visible before JS initialization */
.sp-vehicle-carousel > .sp-carousel-image:first-child,
.sp-vehicle-carousel > .wp-block-image.sp-carousel-image:first-child,
.sp-vehicle-carousel .wp-block-column .sp-carousel-image:first-child,
.sp-vehicle-carousel .wp-block-column .wp-block-image.sp-carousel-image:first-child,
.sp-vehicle-carousel .wp-block-group .sp-carousel-image:first-child,
.sp-vehicle-carousel .wp-block-group .wp-block-image.sp-carousel-image:first-child{
  display: block !important;
  opacity: 1 !important;
}

/* Make sure images inside have proper sizing */
.sp-vehicle-carousel .sp-carousel-image img,
.sp-vehicle-carousel .wp-block-image.sp-carousel-image img{
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: var(--sp-radius) !important;
}

/* Hide subsequent images until carousel is initialized */
.sp-vehicle-carousel > .sp-carousel-image:not(:first-child),
.sp-vehicle-carousel > .wp-block-image.sp-carousel-image:not(:first-child),
.sp-vehicle-carousel .wp-block-column .sp-carousel-image:not(:first-child),
.sp-vehicle-carousel .wp-block-column .wp-block-image.sp-carousel-image:not(:first-child),
.sp-vehicle-carousel .wp-block-group .sp-carousel-image:not(:first-child),
.sp-vehicle-carousel .wp-block-group .wp-block-image.sp-carousel-image:not(:first-child){
  display: none !important;
}

/* Carousel arrows */
.sp-vehicle-carousel .sp-carousel-arrow{
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 10 !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,0.9) !important;
  border: 1px solid rgba(0,0,0,0.1) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  color: #1a1a1a !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1 !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  text-align: center !important;
}

.sp-vehicle-carousel .sp-carousel-arrow:hover{
  background: #fff !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2) !important;
  transform: translateY(-50%) scale(1.05) !important;
}

.sp-vehicle-carousel .sp-carousel-arrow.prev{
  left: 12px !important;
}

.sp-vehicle-carousel .sp-carousel-arrow.next{
  right: 12px !important;
}

/* Arrow icons - use Unicode arrows, perfectly centered */
.sp-vehicle-carousel .sp-carousel-arrow::before{
  content: "" !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  line-height: 44px !important;
  text-align: center !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.sp-vehicle-carousel .sp-carousel-arrow.prev::before{
  content: "‹" !important;
}

.sp-vehicle-carousel .sp-carousel-arrow.next::before{
  content: "›" !important;
}

/* Remove any text content from button */
.sp-vehicle-carousel .sp-carousel-arrow{
  font-size: 0 !important;
}

.sp-vehicle-carousel .sp-carousel-arrow::before{
  font-size: 28px !important;
  font-weight: 700 !important;
}

/* Vehicle description area - ensure it's vertically centered */
.sp-vehicle-description,
.sp-vehicle-band .wp-block-column:last-child > .wp-block-group,
.sp-vehicle-band .wp-block-column:last-child > *{
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important; /* Vertically center all description content */
  min-height: 100% !important; /* Take full height of column */
}

.sp-vehicle-description h2,
.sp-vehicle-description .wp-block-heading{
  font-size: 32px !important;
  font-weight: 700 !important;
  font-family: "SF Pro Display","SF Pro Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif !important;
  color: var(--sp-text) !important;
  margin: 0 0 20px 0 !important;
  line-height: 1.2 !important;
}

.sp-vehicle-description ul,
.sp-vehicle-description .wp-block-list{
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 20px 0 !important;
}

.sp-vehicle-description li,
.sp-vehicle-description .wp-block-list-item{
  font-size: 16px !important;
  font-weight: 400 !important;
  font-family: "SF Pro Display","SF Pro Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif !important;
  color: var(--sp-text) !important;
  line-height: 1.6 !important;
  margin: 0 0 12px 0 !important;
  padding-left: 24px !important;
  position: relative !important;
}

.sp-vehicle-description li::before,
.sp-vehicle-description .wp-block-list-item::before{
  content: "•" !important;
  position: absolute !important;
  left: 0 !important;
  color: var(--sp-text) !important;
  font-weight: 700 !important;
}

/* =========================================================
   VEHICLE INTRO PARAGRAPH (above cards)
   Match van card description font styling
   ========================================================= */
body.page-slug-our-vehicles .sp-vehicle-intro,
body[class*="our-vehicles"] .sp-vehicle-intro{
  max-width: 50% !important; /* About half of the screen width */
  max-width: calc(100vw / 2) !important; /* Fallback for better calculation */
  margin: 60px auto 6px auto !important; /* More spacing from hero, tighter below */
  padding: 0 var(--sp-pad) !important;
}

body.page-slug-our-vehicles .sp-vehicle-intro p,
body[class*="our-vehicles"] .sp-vehicle-intro p,
body.page-slug-our-vehicles .sp-vehicle-intro .wp-block-paragraph,
body[class*="our-vehicles"] .sp-vehicle-intro .wp-block-paragraph{
  font-size: 16px !important;
  font-weight: 400 !important;
  font-family: "SF Pro Display","SF Pro Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif !important;
  color: var(--sp-text) !important;
  line-height: 1.6 !important;
  margin: 0 !important;
  width: 100% !important;
}

/* =========================================================
   VEHICLE NOTE SECTION (below cards, above button)
   Match contact us page "quick note" font styling and color
   ========================================================= */
body.page-slug-our-vehicles .sp-vehicle-note,
body[class*="our-vehicles"] .sp-vehicle-note{
  background: #fff !important;
  border: 1px solid var(--sp-line) !important;
  border-radius: var(--sp-radius) !important;
  padding: 14px 16px !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.06) !important;
  color: var(--sp-muted) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  max-width: 50% !important; /* About half of the screen width */
  max-width: calc(100vw / 2) !important; /* Fallback for better calculation */
  margin: 0 auto 0 auto !important; /* No bottom margin */
  padding-left: var(--sp-pad) !important;
  padding-right: var(--sp-pad) !important;
}

body.page-slug-our-vehicles .sp-vehicle-note p,
body[class*="our-vehicles"] .sp-vehicle-note p,
body.page-slug-our-vehicles .sp-vehicle-note .wp-block-paragraph,
body[class*="our-vehicles"] .sp-vehicle-note .wp-block-paragraph{
  margin: 0 !important;
  color: var(--sp-muted) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  font-family: "SF Pro Display","SF Pro Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif !important;
}

/* =========================================================
   3) GRIP VAN PACKAGE TABS SECTION
   Match book equipment header big category tabs design
   ========================================================= */

/* Tabs container */
.sp-grip-van-tabs{
  max-width: var(--sp-max) !important;
  margin: 0 auto !important;
  padding: 60px var(--sp-pad) !important;
}

/* Tabs header - match book equipment pills container */
.sp-grip-van-tabs-header{
  display: flex !important;
  gap: 26px !important;
  flex-wrap: wrap !important;
  padding: 8px 0 12px !important; /* Add bottom padding for underline space */
  margin: 0 0 40px 0 !important;
  border-bottom: none !important;
  position: relative !important;
}

/* Individual tab - match book equipment pill styling */
/* Override ALL button styling to make it look like plain text */
.sp-grip-van-tab,
.sp-grip-van-tab.wp-block-button,
.sp-grip-van-tab.wp-block-button__link,
.sp-grip-van-tabs-header .wp-block-button,
.sp-grip-van-tabs-header .wp-block-button__link,
.sp-grip-van-tabs-header a.sp-grip-van-tab,
.sp-grip-van-tabs-header button.sp-grip-van-tab{
  height: auto !important;
  padding: 8px 2px 1px !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  cursor: pointer !important;
  text-align: left !important;
  margin: 0 !important;
  position: relative !important;
  box-shadow: none !important;
  outline: none !important;
  
  /* Match book equipment tab typography */
  font-family: "SF Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  font-size: 16px !important;
  font-weight: 590 !important;
  letter-spacing: 0 !important;
  line-height: 1.1 !important;
  color: #6E6E6E !important;
  text-decoration: none !important;
  display: inline-block !important;
}

/* Remove button wrapper styling */
.sp-grip-van-tabs-header .wp-block-button{
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.sp-grip-van-tab:hover,
.sp-grip-van-tab.wp-block-button__link:hover,
.sp-grip-van-tabs-header .wp-block-button__link:hover{
  color: #111 !important;
  background: transparent !important;
  background-color: transparent !important;
  text-decoration: none !important;
}

/* Active tab - match book equipment active tab */
.sp-grip-van-tab.active{
  color: #111111 !important;
  font-weight: 590 !important;
  text-decoration: none !important;
}

/* Active tab underline - match book equipment underline */
.sp-grip-van-tab.active::after{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -10px !important;
  height: 3px !important;
  background: #111111 !important;
  border-radius: 0 !important; /* Sharp corners, no rounding */
}

/* Tab content area */
.sp-grip-van-tab-content{
  display: none !important;
}

.sp-grip-van-tab-content.active{
  display: block !important;
}

/* Three column layout for equipment list - use CSS columns to keep headings with items */
.sp-grip-van-content{
  column-count: 3 !important;
  column-gap: 24px !important;
  column-rule: none !important;
  width: 100% !important;
}

/* Subcategory heading - keep with following items */
.sp-grip-van-content h3,
.sp-grip-van-content .wp-block-heading,
.sp-grip-van-content h2,
.sp-grip-van-content h4{
  font-size: 18px !important;
  font-weight: 700 !important;
  font-family: "SF Pro Display","SF Pro Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif !important;
  color: var(--sp-text) !important;
  margin: 0 0 8px 0 !important;
  padding: 0 !important;
  border: none !important;
  break-after: avoid !important;
  page-break-after: avoid !important;
  break-inside: avoid !important;
  page-break-inside: avoid !important;
}

/* First heading has no top margin */
.sp-grip-van-content > h3:first-child,
.sp-grip-van-content > .wp-block-heading:first-child,
.sp-grip-van-content > h2:first-child,
.sp-grip-van-content > h4:first-child{
  margin-top: 0 !important;
}

/* Equipment item - compact spacing, keep with heading */
.sp-grip-van-content p,
.sp-grip-van-content .wp-block-paragraph,
.sp-grip-van-item{
  font-size: 14px !important;
  font-weight: 400 !important;
  font-family: "SF Pro Display","SF Pro Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif !important;
  color: var(--sp-text) !important;
  line-height: 1.4 !important; /* Tighter line height */
  margin: 0 0 4px 0 !important; /* Reduced spacing */
  padding: 0 !important;
  break-inside: avoid !important;
  page-break-inside: avoid !important;
}

/* If using list items */
.sp-grip-van-content li,
.sp-grip-van-content .wp-block-list-item{
  font-size: 14px !important;
  font-weight: 400 !important;
  font-family: "SF Pro Display","SF Pro Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif !important;
  color: var(--sp-text) !important;
  line-height: 1.4 !important; /* Tighter line height */
  margin: 0 0 4px 0 !important; /* Reduced spacing */
  padding: 0 !important;
  break-inside: avoid !important;
  page-break-inside: avoid !important;
}

/* Lists should have no extra spacing */
.sp-grip-van-content ul,
.sp-grip-van-content ol,
.sp-grip-van-content .wp-block-list{
  margin: 0 0 8px 0 !important;
  padding: 0 0 0 20px !important;
  break-inside: avoid !important;
  page-break-inside: avoid !important;
}

/* Wrap each heading with its following items - use a wrapper approach */
/* Create a section wrapper for each heading+items group */
.sp-grip-van-content-section{
  break-inside: avoid !important;
  page-break-inside: avoid !important;
  margin-bottom: 16px !important;
  display: inline-block !important;
  width: 100% !important;
}

/* =========================================================
   4) RESPONSIVE
   ========================================================= */

@media (max-width: 980px){
  body.page-slug-our-vehicles{ --sp-pad: 22px; }
  
  /* Stack vehicle band columns */
  .sp-vehicle-band .wp-block-columns{
    flex-direction: column !important;
  }
  
  .sp-vehicle-band .wp-block-column:first-child,
  .sp-vehicle-band .wp-block-column:last-child{
    flex-basis: 100% !important;
    width: 100% !important;
  }
  
  /* On mobile, description still centered but columns stack */
  .sp-vehicle-band .wp-block-column:last-child{
    justify-content: flex-start !important; /* Start from top on mobile when stacked */
  }
  
  /* Keep 3 columns for equipment list even on tablet */
  .sp-grip-van-content{
    column-count: 3 !important;
    column-gap: 16px !important; /* Slightly smaller gap on tablet */
  }
}

/* =========================================================
   5) VEHICLE CARDS GRID (NEW)
   - Removes alternating full-width band backgrounds
   - Uses responsive grid (3 → 2 → 1)
   - Puts title + bullets UNDER the carousel
   - Keeps existing carousel styling/behavior
   ========================================================= */

/* Stop the old full-bleed alternating background system */
body.page-slug-our-vehicles .sp-vehicle-band::before,
body[class*="our-vehicles"] .sp-vehicle-band::before,
body.page-slug-our-vehicles .wp-block-columns.sp-vehicle-band::before,
body[class*="our-vehicles"] .wp-block-columns.sp-vehicle-band::before,
body.page-slug-our-vehicles .wp-block-group.sp-vehicle-band::before,
body[class*="our-vehicles"] .wp-block-group.sp-vehicle-band::before{
  content: none !important;
}

/* Grid wrapper (inserted by JS) */
body.page-slug-our-vehicles .entry-content .sp-vehicle-bands-grid,
body[class*="our-vehicles"] .entry-content .sp-vehicle-bands-grid{
  max-width: var(--sp-max) !important;
  margin: 0 auto !important;
  padding: 10px var(--sp-pad) 10px !important; /* reduced top padding */

  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 30px !important;
  align-items: stretch !important; /* stretch all cards to same row height */
}

/* Each vehicle "band" becomes a card */
body.page-slug-our-vehicles .sp-vehicle-bands-grid > .wp-block-columns.sp-vehicle-band,
body[class*="our-vehicles"] .sp-vehicle-bands-grid > .wp-block-columns.sp-vehicle-band,
body.page-slug-our-vehicles .sp-vehicle-bands-grid > .wp-block-group.sp-vehicle-band,
body[class*="our-vehicles"] .sp-vehicle-bands-grid > .wp-block-group.sp-vehicle-band{
  margin: 0 !important; /* no extra margin; grid gap handles spacing */
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;

  background: #ffffff !important;
  border: 1px solid var(--sp-border) !important;
  border-radius: var(--sp-radius) !important;
  box-shadow: var(--sp-shadow) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important; /* equal heights in the grid */
}

/* IMPORTANT: stack carousel on top, description below (for existing 2-column structure) */
body.page-slug-our-vehicles .sp-vehicle-bands-grid > .wp-block-columns.sp-vehicle-band,
body[class*="our-vehicles"] .sp-vehicle-bands-grid > .wp-block-columns.sp-vehicle-band{
  gap: 0 !important;
  align-items: stretch !important;
}

/* Columns inside the band should be full width now */
body.page-slug-our-vehicles .sp-vehicle-bands-grid > .wp-block-columns.sp-vehicle-band > .wp-block-column,
body[class*="our-vehicles"] .sp-vehicle-bands-grid > .wp-block-columns.sp-vehicle-band > .wp-block-column{
  width: 100% !important;
  flex-basis: auto !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
}

/* Remove old "50/50 left/right" and vertical-centering behavior inside cards */
body.page-slug-our-vehicles .sp-vehicle-bands-grid .wp-block-column:first-child,
body.page-slug-our-vehicles .sp-vehicle-bands-grid .wp-block-column:last-child,
body[class*="our-vehicles"] .sp-vehicle-bands-grid .wp-block-column:first-child,
body[class*="our-vehicles"] .sp-vehicle-bands-grid .wp-block-column:last-child{
  display: block !important;
  justify-content: flex-start !important;
  align-items: stretch !important;
}

/* Carousel stays full width within the card */
body.page-slug-our-vehicles .sp-vehicle-bands-grid .sp-vehicle-carousel,
body[class*="our-vehicles"] .sp-vehicle-bands-grid .sp-vehicle-carousel{
  width: 100% !important;
  border-radius: 0 !important; /* card handles rounding */
  margin: 0 !important;
}

/* Description (second column) becomes the "card body" */
body.page-slug-our-vehicles .sp-vehicle-bands-grid > .wp-block-columns.sp-vehicle-band > .wp-block-column:last-child,
body[class*="our-vehicles"] .sp-vehicle-bands-grid > .wp-block-columns.sp-vehicle-band > .wp-block-column:last-child{
  padding: 18px 18px 22px !important;
  flex: 1 1 auto !important; /* take remaining height so cards equalize */
}

/* If you used a wrapper class for the right column content */
body.page-slug-our-vehicles .sp-vehicle-bands-grid .sp-vehicle-description,
body[class*="our-vehicles"] .sp-vehicle-bands-grid .sp-vehicle-description{
  margin: 0 !important;
}

/* Typography tweaks to match card density */
body.page-slug-our-vehicles .sp-vehicle-bands-grid .sp-vehicle-description h2,
body.page-slug-our-vehicles .sp-vehicle-bands-grid .sp-vehicle-description .wp-block-heading,
body[class*="our-vehicles"] .sp-vehicle-bands-grid .sp-vehicle-description h2,
body[class*="our-vehicles"] .sp-vehicle-bands-grid .sp-vehicle-description .wp-block-heading{
  font-size: 22px !important;
  margin: 0 0 12px 0 !important;
}

body.page-slug-our-vehicles .sp-vehicle-bands-grid .sp-vehicle-description li,
body.page-slug-our-vehicles .sp-vehicle-bands-grid .sp-vehicle-description .wp-block-list-item,
body[class*="our-vehicles"] .sp-vehicle-bands-grid .sp-vehicle-description li,
body[class*="our-vehicles"] .sp-vehicle-bands-grid .sp-vehicle-description .wp-block-list-item{
  font-size: 14px !important;
  margin: 0 0 10px 0 !important;
}

/* Responsive grid */
@media (max-width: 1100px){
  body.page-slug-our-vehicles .entry-content .sp-vehicle-bands-grid,
  body[class*="our-vehicles"] .entry-content .sp-vehicle-bands-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 680px){
  body.page-slug-our-vehicles .entry-content .sp-vehicle-bands-grid,
  body[class*="our-vehicles"] .entry-content .sp-vehicle-bands-grid{
    grid-template-columns: 1fr !important;
    padding: 40px var(--sp-pad) 10px !important; /* reduce bottom padding */
    gap: 22px !important;
  }
}

/* Book Now button (matches home hero button) */
body.page-slug-our-vehicles .sp-vehicle-book-btn-wrap,
body[class*="our-vehicles"] .sp-vehicle-book-btn-wrap{
  max-width: var(--sp-max) !important;
  margin: 10px auto 0 auto !important; /* closer to the cards */
  padding: 0 var(--sp-pad) !important;
  display: flex !important;
  justify-content: center !important;
}

body.page-slug-our-vehicles .sp-vehicle-book-btn,
body[class*="our-vehicles"] .sp-vehicle-book-btn{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px 24px !important;
  border-radius: 999px !important;
  background: #111111 !important; /* black pill */
  color: #ffffff !important;      /* white text */
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  border: 1px solid #111111 !important;
  box-shadow: none !important;    /* remove drop shadow */
  transition: transform 140ms ease, box-shadow 140ms ease, background 140ms ease, color 140ms ease !important;
}

body.page-slug-our-vehicles .sp-vehicle-book-btn:hover,
body[class*="our-vehicles"] .sp-vehicle-book-btn:hover{
  transform: translateY(-2px) !important;
  box-shadow: none !important;
  background: #000000 !important;
}

@media (max-width: 680px){
  body.page-slug-our-vehicles .sp-vehicle-book-btn-wrap,
  body[class*="our-vehicles"] .sp-vehicle-book-btn-wrap{
    margin: 16px auto 0 auto !important;
    padding: 0 var(--sp-pad) !important;
  }
}

@media (max-width: 560px){
  body.page-slug-our-vehicles{ --sp-pad: 18px; }
  
  .sp-vehicle-band,
  .wp-block-group.sp-vehicle-band,
  body.page-slug-our-vehicles .sp-vehicle-band,
  body[class*="our-vehicles"] .sp-vehicle-band{
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  
  /* Responsive: intro and note sections take more width on mobile */
  body.page-slug-our-vehicles .sp-vehicle-intro,
  body[class*="our-vehicles"] .sp-vehicle-intro,
  body.page-slug-our-vehicles .sp-vehicle-note,
  body[class*="our-vehicles"] .sp-vehicle-note{
    max-width: 90% !important; /* Wider on mobile for readability */
    margin-top: 40px !important; /* Less spacing on mobile */
  }
  
  /* Maintain background extension on mobile */
  .sp-vehicle-band::before,
  .wp-block-group.sp-vehicle-band::before,
  body.page-slug-our-vehicles .sp-vehicle-band::before,
  body[class*="our-vehicles"] .sp-vehicle-band::before{
    top: -15px !important; /* Extend 15px above content */
    bottom: -15px !important; /* Extend 15px below content */
  }
  
  .sp-vehicle-description h2,
  .sp-vehicle-description .wp-block-heading{
    font-size: 24px !important;
  }
  
  /* Keep 3 columns for equipment list even on mobile */
  .sp-grip-van-content{
    column-count: 3 !important;
    column-gap: 12px !important; /* Smaller gap on mobile */
  }
  
  .sp-grip-van-content h3,
  .sp-grip-van-content .wp-block-heading,
  .sp-grip-van-content h2,
  .sp-grip-van-content h4{
    font-size: 14px !important; /* Smaller headings on mobile */
  }
  
  .sp-grip-van-content p,
  .sp-grip-van-content .wp-block-paragraph,
  .sp-grip-van-item,
  .sp-grip-van-content li,
  .sp-grip-van-content .wp-block-list-item{
    font-size: 12px !important; /* Smaller text on mobile */
    line-height: 1.3 !important; /* Even tighter on mobile */
  }
  
  .sp-grip-van-tab{
    font-size: 14px !important;
    padding: 8px 2px 1px !important;
  }
}