/* --------------------------------------------------------------------------
   1. Shared inner-page typography
   -------------------------------------------------------------------------- */

/* Inner pages class */
.mobile-cta{
  display: none;
}
.desktop-cta{
  display: block;
}

/* Centred section heading (no flanking rules, unlike .section-heading) */
.navy-1{
  border: 0;
  height: 1px;
  background: var(--navy);
}
.page-heading {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 2rem;
  line-height: 1.25;
  color: var(--navy);
  text-align: center;
  margin-bottom: 1.5rem;
}

/* Centred supporting paragraph */
.page-lede {
  max-width: 84rem;
  margin: 0 auto 1.75rem;
  font-size: var(--fs-body);
  line-height: 1.2;                     /* 28-29px pitch, as measured */
  color: var(--ink-soft);
  text-align: center;
}

/* Upright variant of the homepage ribbon (the homepage one is italic) */
.ribbon--plain {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 2rem;
  padding: 1.125rem 3.5rem;
}

/* --------------------------------------------------------------------------
   2. Page banner
   -------------------------------------------------------------------------- */
.page-hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 29.4375rem;               /* 471px */
  overflow: hidden;
}

.page-hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Cyan-to-blue duotone wash over the photograph */
.page-hero__wash {
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, rgba(3, 207, 216, 0.88) 0%, rgba(3, 98, 216, 0.88) 100%);
}

.page-hero .container { position: relative; z-index: 2; }

.page-hero__title {
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
  padding: 1.813rem 2.188rem;
  background: var(--white);
  color: var(--navy);
  font-family: var(--font-oswald);
  font-weight: 500;
  font-size: 4.375rem;
  line-height: 1;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  text-align: center;
}

/* --------------------------------------------------------------------------
   3. Split rows (text beside an image)
   Flexbox drives the order straight from the DOM, so the same component
   handles media-left and media-right rows without extra modifiers.
   -------------------------------------------------------------------------- */
.split { padding: 3.5rem 0; }
.split--grey { background: var(--grey-200); }

.split__grid {
  display: flex;
  align-items: center;
  gap: 6rem;
}

.split__media { flex: 0 0 31.625rem; }   /* 506px */
.split__media img { width: 100%; height: auto; }

.split__body { flex: 1 1 auto; min-width: 0; }

.split__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 2.25rem;
  line-height: 1.25;
  color: var(--navy);
  margin-bottom: 1.5rem;
}

.split__title.desk{
  display: block;
}
.split__title.mob{
  display: none;
}

.split__body p {
  font-size: var(--fs-body);
  line-height: 1.2;
  color: var(--black);
  margin-bottom: 1.75rem;
  max-width: 56rem;
}
.split__body p:last-child { margin-bottom: 0; }

/* Navy picture frame used on the "Reliable appliance repair" photo */
.split__media--framed img {
  background: var(--white);
}

/* Pale disc sitting behind the appliance line-up in the intro */
.split--intro .split__media { flex-basis: 31rem; }
.split__media--disc {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.split__media--disc img { position: relative; }

.split__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  padding-top: 1rem;
}
.split__actions.center{
  padding-top: 2rem;
  justify-content: center;
}
.btn--lg {
  min-width: 25rem;
  padding: 0.775rem 2.25rem;
}
.split-subhead-list h4{
  margin-bottom: 1.1rem;
  font-size: var(--fs-body);
  font-weight: 600;
  font-family: var(--font-display);
  line-height: 1.2;
  color: var(--navy);
  text-align: center;
}
.split-subhead-list ul{
  margin-bottom: 1.625rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem;
}
.split-subhead-list ul li{
  padding-left: 1.188rem;
  font-size: var(--fs-body);
  font-weight: 400;
  font-family: var(--font-display);
  line-height: 1.25;
  color: var(--black);
  position: relative;
}
.split-subhead-list ul li:before{
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 0.5rem;
  height: 0.5rem;
  background: var(--cyan);
  border-radius: 50%;
}
.split-subhead-list ul li:not(:last-child){
  margin-bottom: 0.5rem;
}

/* --------------------------------------------------------------------------
   4. Appliances we service
   -------------------------------------------------------------------------- */
.appliances { padding: 4rem 0 5.5rem; }

.appliance-list {
  /* Column-major reading order is produced by the source order, so a plain
     two-column row grid lands each item in the column the comp shows. */
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 10rem;
  max-width: 68.5rem;                   /* 1096px */
  margin: 3rem auto 2.5rem;
}
.appliance-list.full{
  max-width: 100%;
}

.appliance-list li {
  display: flex;
  align-items: center;
  gap: 1rem;
  min-height: 3.75rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--rule);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.625rem;
  line-height: 1.2;
  color: var(--navy);
}
.appliance-list li.appliance-list__item--last { border-bottom: 0; }

.appliance-list img { width: 2.75rem; height: 2.75rem; flex: none; object-fit: contain;}

.appliances__note {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.4375rem;
  line-height: 1.4;
  text-align: center;
  color: var(--ink);
}

/* --------------------------------------------------------------------------
   5. Why choose us — reuses .seal-grid from style.css
   Unlike the homepage's .experience section (static grid on tablet/desktop,
   slider on mobile only — see script.js), this section runs the seal-slider
   at every breakpoint: 1 slide under 768px, 3 slides from 768px up. Flex +
   a reset of the grid item's border/spacing lets Swiper size and space the
   slides itself, the same way the shared .seal-grid already switches to
   flex on mobile widths (see responsive.css).
   -------------------------------------------------------------------------- */
/* The deep bottom padding is where the service-areas banner overlaps */
.why-choose { padding: 5.5rem 0; }
.why-choose .page-lede.bottom-lede {
  margin: 3.5rem 0 0;
}
.why-choose .seal-grid {
  display: flex;
}
.why-choose .seal-grid__item {
  width: 100%;
  flex-shrink: 0;
  border: none;
  margin: 0;
  padding: 2.5rem 1rem;
}

/* Desktop (>=1200px, the site's own desktop breakpoint) swaps the mobile/
   tablet pagination dots for prev/next arrows — arrows are injected by
   script.js (addSealSliderArrows) and bound via Swiper's navigation option. */
.why-choose .seal-slider { position: relative; padding: 0 1.35rem;}

.why-choose .seal-slider__arrow {
  display: none;                 /* shown only at the desktop breakpoint below */
  position: absolute;
  top: 50%;
  z-index: 2;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  background: var(--white);
  border: 1px solid var(--rule);
  border-radius: 50%;
  cursor: pointer;
  transform: translateY(-50%);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.why-choose .seal-slider__arrow img { width: 1rem; height: 1rem; }
.why-choose .seal-slider__arrow--prev { left: 0.17rem; }
.why-choose .seal-slider__arrow--next { right: 0.17rem; }
.why-choose .seal-slider__arrow:hover {
  transform: translateY(-50%) scale(1.08);
}
.why-choose .seal-slider__arrow.swiper-button-disabled {
  opacity: 0.35;
  cursor: default;
  box-shadow: none;
}

.split.split-subhead-list.center-middle-head h4{
  text-align: left;
}

@media (min-width: 1200px) {
  .why-choose .seal-slider__arrow { display: flex; }
  .why-choose .seal-slider .swiper-pagination { display: none; }
}

.why-choose__kicker {
  margin: 1.75rem 0 4.5rem;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.5rem;
  color: var(--navy);
  text-align: center;
}

/* --------------------------------------------------------------------------
   6. Service areas
   The banner straddles the white/grey boundary, so the section paints the
   first 2.25rem white and the remainder grey.
   -------------------------------------------------------------------------- */
.areas-map {
  background: linear-gradient(to bottom, var(--white) 0 2.25rem, var(--grey-200) 2.25rem);
}

.areas-map .ribbon { margin-bottom: 1.75rem; }

/* The kicker heads the city columns rather than the whole row, so the map is
   free to sit slightly higher, as it does in the comp. */
.areas-map__kicker {
  margin: 0 0 2.5rem;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 1.5rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: center;
  color: #3f6ac2;
}

.areas-map__grid {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5rem;
}

.areas-map__figure { flex: 0 0 24rem; }
.areas-map__figure img { width: 100%; height: auto; }

.areas-map__col { flex: 0 1 auto; }

/* Column-major so the cities read down each column, as drawn */
.areas-map__cities {
  flex: 0 1 auto;
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(5, auto);
  column-gap: 5rem;
  row-gap: 0.5rem;
}
.areas-map__cities li {
  position: relative;
  padding-left: 1.25rem;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.5rem;
  color: var(--navy);
}
.areas-map__cities li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.75em;
  width: 0.3125rem;
  height: 0.3125rem;
  border-radius: 50%;
  background: var(--navy);
}

/* --------------------------------------------------------------------------
   7. Schedule CTA
   The panel overlaps the end of the grey band above it and its button
   straddles the panel's bottom edge.
   -------------------------------------------------------------------------- */
.schedule {
  padding: 3rem 0 3.5rem;
  background: linear-gradient(to bottom, var(--grey-200) 0 16.5rem, var(--white) 16.5rem);
}

.schedule__panel {
  position: relative;
  padding: 2.5rem 3rem 3.5rem;
  background: var(--navy);
  color: var(--white);
  text-align: center;
}

.schedule__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 2.25rem;
  line-height: 1.25;
  margin-bottom: 1.25rem;
}

.schedule__panel p {
  max-width: 68rem;
  margin: 0 auto 1.5rem;
  font-size: var(--fs-body);
  line-height: 1.2;
}
.schedule__panel p a:hover {
    text-decoration: underline;
}

.schedule__emphasis {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 700;
  margin-bottom: 0;
}

.schedule__cta {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translate(-50%, 45%);
  min-width: 31.625rem;
  padding: 0.875rem 2.5rem;
  font-size: 1.375rem;
}
/* Keep the lift-on-hover from .btn without losing the centring transform */
.schedule__cta:hover { transform: translate(-50%, calc(45% - 2px)); }

/* --------------------------------------------------------------------------
   8. Mascot strip
   -------------------------------------------------------------------------- */
.mascots { padding: 3rem 0 4.5rem; }
.mascots .testimonials__mascots { margin-top: 0; }

.maintenance.second{
  background-color: #F0F0F0;
  padding: 3rem 0;
}
.maintenance.second .benefit-grid {
    grid-template-columns: repeat(6, 1fr);
}
.maintenance.second .maintenance__subhead.second{
  margin: 2rem 0 0 0;
}
.maintenance.second .container-wide {
  max-width: calc(var(--container-wide) + var(--gutter) * 6.5);
}
.split--intro .why-choose__kicker{
  color: var(--navy);
  text-align: left;
}

.schedule-service .split__media {
  flex: 0 0 20.625rem;
}

.service-panel--navy .sub-heading{
  margin: 0 0 1.5rem;
  color: var(--white);
  font-size: var(--fs-body);
}
.service-panel--cyan .sub-heading{
  margin: 0 0 1.5rem;
  color: var(--black);
  font-size: var(--fs-body);
}

/* Call strip section start here */
.call-strip{
  position: relative;
  padding: 6.688rem 2rem 5.438rem;
}
.call-strip .bg-image{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.call-strip .bg-image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.call-strip .call-cta{
  display: flex;
  align-items: center;
  gap: 2.815rem;
  justify-content: center;
}
.call-strip .call-cta svg{
  width: 4.438rem;
  height: auto;
}
.call-strip .call-cta a{
  text-decoration: underline;
  font-size: 2.25rem;
  font-weight: 700;
  color: var(--white);
  line-height: 1.2;
  margin-bottom: 0.5rem;
  display: inline-block;
  transition: all 0.35s ease;
}
.call-strip .call-cta a:hover{
  color: var(--cyan);
}

.contact-form{
  background-color: #F0F0F0;
  padding: 3.125rem 0 4.375rem;
}
.contact-form h2{
  color: var(--navy);
}
.form-wrapper{
  margin-top: 2.375rem;
}
.form-wrapper .form-row.three,
.form-wrapper .form-row.two{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.form-wrapper .form-row.three .form-group{
  width: calc(33.333% - 1.688rem);
}
.form-wrapper .form-row.two .form-group{
  width: calc(50% - 1.688rem);
}
.form-wrapper .form-row label{
  display: block;
  margin-bottom: 0.5rem;
  color: var(--navy);
  font-size: 1.125rem;
  font-weight: 700;
}
.form-wrapper .form-row label sup{
  color: red;
}
.form-wrapper .form-row input,
.form-wrapper .form-row textarea,
.form-wrapper .form-row select{
  border: 2px solid #1B3F98;
  background: #FFFFFF;
  padding: 1rem;
  border-radius: 1rem;
  outline: none;
  resize: none;
  box-shadow: none;
  width: 100%;
  color: #000000;
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.1;
  font-family: var(--font-display);
}
.form-wrapper .form-row textarea{
  min-height: 10rem;
}
.form-wrapper .form-row input::placeholder,
.form-wrapper .form-row textarea::placeholder{
  color: #6B7280;
  opacity: 1;
}
.form-wrapper .form-row{
  margin-bottom: 1.25rem;
}

.form-wrapper .form-row .gender-options label{
  margin-bottom: 0;
}
.form-wrapper .form-row .gender-options input{
  width: auto;
}
.form-wrapper .form-row button{
  background-color: var(--cyan);
  color: var(--white);
  padding: 1.125rem 2rem;
  border-radius: 3.75rem;
  font-weight: 700;
  font-size: 1.563rem;
  line-height: 1.1;
  font-family: var(--font-display);
  cursor: pointer;
  transition: all 0.35s ease;
  cursor: pointer;
  border: none;
  box-shadow: none;
  width: 100%;
  text-align: center;
}
.form-wrapper .form-row button:hover{
  background-color: var(--navy);
  color: var(--cyan);
}
.smallText{
  margin-top: 1rem;
}

/* Inner service section */
.services.inner-services .service-panel__inner{
  justify-content: center;
}
.services.inner-services .service-row{
  min-height: auto;
}
.services.inner-services .service-media img{
  min-height: auto;
  height: 28rem;
}
.services.inner-services .service-panel p:last-of-type {
  margin-bottom: 0;
}

/* Blog details pages start here */
.article-details{
  padding: 4rem 0;
}
.article-details h1{
  color: var(--navy);
  margin: 1.25rem 0 3rem;
  line-height: 1.25;
}
.article-details h2{
  color: var(--navy);
  margin: 1.25rem 0 1rem;
  line-height: 1.25;
}
.article-details h3, .article-details h4, .article-details h5{
  color: var(--navy);
  margin: 1.25rem 0 0.5rem;
  line-height: 1.25;
}
.article-details p{
  margin-bottom: 1.25rem;
  line-height: 1.5;
}
.article-details ul{
  margin: 1.25rem 0 1.25rem 2rem;
  line-height: 1.5;
  list-style: disc;
  column-count: 2;
}
.article-details ul li{
  margin-bottom: 1rem;
}
.career-form-sec{
  background-color: #F0F0F0;
  padding: 2.325rem 0 2.325rem;
  margin-top: 4rem;
}
.career-form-sec .form-wrapper {
  margin-top: 0;
}
.career-form-sec h2{
  margin: 0 0 2rem;
}
.career-form-sec .form-wrapper .form-row textarea {
  min-height: 7.5rem;
}


/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

/* --------------------------------------------------------------------------
   Small desktop / large laptop
   -------------------------------------------------------------------------- */
@media (max-width: 1399.98px) {
  .split__grid { gap: 4.5rem; }
  .appliance-list { column-gap: 7rem; }
  .areas-map__grid { gap: 3rem; }
  .areas-map__cities { column-gap: 3rem; }
}

/* --------------------------------------------------------------------------
   Laptop
   -------------------------------------------------------------------------- */
@media (max-width: 1199.98px) {
  .split__media { flex-basis: 26rem; }
  .split--intro .split__media { flex-basis: 27rem; }
  .appliance-list { column-gap: 5rem; }
  .mobile-cta{
    display: block;
  }
  .desktop-cta{
    display: none;
  }
}

/* --------------------------------------------------------------------------
   Tablet — rows stack, image always leads
   -------------------------------------------------------------------------- */
@media (max-width: 991.98px) {
  .page-hero { min-height: 18rem; }
  .page-hero__title { padding: 1rem 1.75rem; font-size: 2.25rem; }

  .page-heading { font-size: 1.75rem; }
  .page-lede { font-size: 1.0625rem; }

  .split { padding: 2.75rem 0; }
  .split__grid {
    flex-direction: column;
    gap: 2.25rem;
    text-align: center;
  }
  .split__media,
  .split--intro .split__media {
    order: -1;                          /* photo first on every stacked row */
    flex-basis: auto;
    width: min(26rem, 100%);
  }
  .split__title { font-size: 1.5rem; }
  .split__body p { max-width: 42rem; margin-inline: auto; }
  .split__actions { justify-content: center; }
  .btn--lg { min-width: 0; width: auto; font-size: 1.0625rem; }

  .appliances { padding: 3rem 0; }
  .appliance-list { column-gap: 3rem; margin-top: 2rem; }
  .appliance-list li { font-size: 1.1875rem; min-height: 3rem; }
  .appliance-list img { width: 1.75rem; height: 1.75rem; }
  .appliances__note { font-size: 1.0625rem; }

  .why-choose { padding: 3rem 0 2rem; }
  .why-choose__kicker { font-size: 1.125rem; }

  .ribbon--plain { font-size: 1.375rem; padding: 0.875rem 2rem; }
  .areas-map { background: linear-gradient(to bottom, var(--white) 0 1.75rem, var(--grey-200) 1.75rem); }
  .areas-map__grid { flex-direction: column; gap: 2rem; }
  .areas-map__figure { flex-basis: auto; width: min(18rem, 70%); }
  .areas-map__cities {
    grid-auto-flow: row;
    grid-template-rows: none;
    grid-template-columns: repeat(2, auto);
    column-gap: 2.5rem;
    justify-content: center;
  }
  .areas-map__cities li { font-size: 1.0625rem; }

  .schedule { background: linear-gradient(to bottom, var(--grey-200) 0 10rem, var(--white) 10rem); }
  .schedule__panel { padding: 2rem 1.5rem 3rem; }
  .schedule__title { font-size: 1.5rem; }
  .schedule__cta { min-width: 0; width: min(24rem, calc(100% - 2rem)); font-size: 1.0625rem; }
  .split-subhead-list ul li {
    display: inline-block;
    margin-right: 10px;
    text-align: left;
  }
  .contact-form {
    padding: 2.125rem 0 1.8rem;
  }
  .form-wrapper .form-row button {
    font-size: 1.3rem;
  }
  .call-strip .call-cta svg {
    width: 2.438rem;
  }
  .call-strip .call-cta a {
    font-size: 2rem;
  }
  .call-strip {
    padding: 4.7rem 2rem 4.5rem;
  }
  .contact-form p{
    line-height: 1.2;
  }
  .maintenance.second .benefit-grid {
    grid-template-columns: repeat(3, 1fr);
    margin-bottom: 1.5rem;
  }
  
}

/* --------------------------------------------------------------------------
   Large mobile
   -------------------------------------------------------------------------- */
@media (max-width: 767.98px) {
  .page-hero{
    min-height: 300px;
  }
  .page-hero__title { 
    padding: 16px 25px 23px;
    font-size: 38px;
    max-width: 81.6%;
    margin: 0 auto;
    line-height: 1.2;
  }
  .split{
    padding: 40px 40px 45px;
  }
  .split__title.desk{
    display: none;
  }
  .split__title.mob{
    display: block;
  }
  .split--intro .split__title.mob{
    order: -1;
  }
  .split__grid{
    padding: 0;
    text-align: left;
  }
  .split__title {
    font-size: 36px;
  }
  .btn--lg {
    min-width: 0;
    width: 100%;
    font-size: 24px;
    white-space: break-spaces;
  }
  .appliance-list { grid-template-columns: minmax(0, 1fr); max-width: 26rem; }
  .appliance-list li:nth-child(10) { order: 1; border-bottom: 0; }
  .appliance-list li:last-child { border-bottom: 1px solid var(--rule); }
  .reliable-appliance-repair .split__media{
    order: 1;
  }
  .page-heading{
    font-size: 36px;
  }
  .page-lede{
    font-size: var(--fs-body);
  }
  .appliance-list li {
    font-size: 24px;
    min-height: 3rem;
  }
  .appliance-list img {
    width: 2.5rem;
    height: 2.5rem;
  }
  .appliance-list{
    max-width: 100%;
  }
  .appliances__note{
    font-size: var(--fs-body);
  }
  .why-choose__kicker{
    font-size: var(--fs-body);
    margin-bottom: 10px;
  }
  .why-choose {
    padding: 3rem 0 3.5rem;
  }
  .areas-map .ribbon{
    font-size: 36px;
    text-align: center;
  }
  .areas-map {
    padding: 0 30px;
  }
  .page-lede br{
    display: none;
  }
  .areas-map .container{padding: 0}
  .areas-map__cities { grid-template-columns: repeat(2, 1fr); text-align: left; gap:10px;}
  .areas-map__cities li {
    font-size: 22px;
  }
  .schedule__title {
    font-size: 36px;
  }
  .schedule__cta {
    font-size: 18px;
    width: auto;
  }
  .mascots {
    padding: 1rem 0 1.5rem;
  }
  .why-choose .page-lede.bottom-lede br{
    display: none;
  }
  .appliances__note br{
    display: none;
  }
  .form-wrapper .form-row.three .form-group {
    width: 100%;
  }
  .form-wrapper .form-row.three,
  .form-wrapper .form-row.two {
    gap: 1.7rem;
  }
  .form-wrapper .form-row.three .form-group:last-of-type {
    margin-bottom: 10px;
  }
  .appliance-list li.appliance-list__item--last {
    border-bottom: 1px solid var(--rule);
  }
  .split-subhead-list ul{
    grid-template-columns: repeat(1, 1fr);
  }
  .services.inner-services .service-panel__inner p:last-of-type{
    margin-bottom: 0;
  }
  .article-details ul{
    column-count: 1;
  }
  .article-details ul li:last-of-type{
    margin-bottom: 0;
  }
  .article-details {
    padding: 3rem 0;
  }
  .article-details h1 {
    margin: 1.25rem 0 2rem;
  }
  .form-wrapper .form-row .gender-options{
    display: flex;
    gap: 1rem;
    align-items: center;
  }
  .form-wrapper .form-row.two .form-group{
    width: 100%;
  }
  .career-form-sec .form-wrapper .form-row textarea {
    min-height: 6.5rem;
  }
  .page-hero .container{
    padding: 0;
  }
  .services.inner-services .service-media img{
    height: auto;
  }
}

/* --------------------------------------------------------------------------
   Mobile
   -------------------------------------------------------------------------- */
@media (max-width: 495px) {
  .page-hero__title {
    padding: 14px 13px 18px;
    font-size: 30px;
    width: 100%;
  }
  .split {
    padding: 30px 20px 35px;
  }
  .split__title {
    font-size: 26px;
  }
  .split__body p{
    max-width: 100%;
    font-size: 18px;  
  }
  .btn--lg {
    font-size: 16px;
  }
  .page-heading {
    font-size: 26px;
  }
  .appliance-list li {
    font-size: 18px;
  }
  .areas-map .ribbon {
    font-size: 20px;
  }
  .areas-map__kicker {
    margin: 0 0 2rem;
  }
  .areas-map__cities li {
    font-size: 16px;
  }
  .areas-map__cities {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 12px;
  }
  .areas-map {
    padding: 0 20px;
  }
  .areas-map__col {
    flex: auto;
    width: 100%;
  }
  .schedule__title {
    font-size: 26px;
  }
  .schedule__cta {
    font-size: 14px;
    width: auto;
    padding: 0.875rem 1.5rem;
  }
  .mascots{
    padding-bottom: 0;
  }
  .call-strip .call-cta svg {
    width: 2rem;
  }
  .call-strip .call-cta a {
    font-size: 1.7rem;
  }
  .call-strip .call-cta {
    gap: 1.5rem;
  }
}