/* ===== Structure ===== */
.ces-hero { width: 100%; position: relative; overflow: hidden; }
.ces-hero .swiper-wrapper { width: 100%; height: auto; }
.ces-hero .swiper-slide { display: block; }

/* Slide panel */
.ces-hero__slide {
  position: relative;
  width: 100% !important;
  min-height: 900px; /* desktop target */
  display: grid;
  place-items: stretch;
  background: #000; /* fallback while image loads */
}

/* Background image layer (real img, covers) */
.ces-hero__bg {
  position: absolute; inset: 0;
  width: 100% !important; height: 100% !important;
  object-fit: cover; object-position: center;
  z-index: 0;
}

/* Content container (FLEX COLUMN + scalable gaps) */
.ces-hero__inner {
  position: relative; /* so bottom bar can anchor to it */
  z-index: 1;
  width: min(1460px, 92%);
  margin: 0 auto;
  padding: 96px 0 96px 0;

  /* FLEX instead of grid */
  display: flex;
  flex-direction: column;
  gap: var(--ces-gap, 70px);           /* desktop default gap */
}

/* kill stray margins so only gap controls spacing */
.ces-hero__title,
.ces-hero__text,
.ces-hero__cta { margin: 0; }

/* Typography */
.ces-hero__title {
  font-family: "Raleway", Sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(30px, 4.5vw, 60px) !important;
  color: #fff !important;
}
.ces-hero__text {
  color: #fff !important;
  font-family: "Raleway", Sans-serif !important;
  font-size: clamp(18px, 1.4vw, 30px);
  line-height: 1.35;                  /* tighter block density */
  max-width: 72ch;
  white-space: pre-line;
}

/* CTA */
.ces-hero__cta { margin-top: var(--ces-cta-mt, 20px); }  /* desktop default 20px */
.ces-hero__btn {
  display: inline-block;
  padding: 12px 28px;
  font-size: 16px !important;
  background: #F39200 !important;
  color: #005069 !important;
  text-decoration: none !important;
  font-family: "Raleway", Sans-serif !important;
  font-weight: 700 !important;
  transition: all .3s ease;
}
.ces-hero__btn:hover {
  background: #005069 !important;
  color: #fff !important;
}

/* ===== Bottom bar: credit (left) • bullets (center) • spacer (right) ===== */
.ces-hero__bottom {
  position: absolute;
  left: 0; right: 0; bottom: 18px;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  column-gap: 12px;
}
.ces-hero__credit {
  justify-self: start;
  font-size: 12px;
  font-family: "Raleway", Sans-serif !important;
  font-weight: 400 !important;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Bullets centered */
.ces-hero__pagination-placeholder {
  grid-column: 2;
  display: flex;
  justify-content: center;
  align-items: center;
}
.ces-hero__pagination { position: static; display: inline-flex; gap: 8px; }
.ces-hero .swiper-pagination-bullet {
  width: 15px; height: 15px; border-radius: 999px;
  background: #005069;
  opacity: 1;
  transition: all .3s ease;
}
.ces-hero .swiper-pagination-bullet-active { background: #F39200; }

/* =========================
   RESPONSIVE SCALE-DOWN
   - Small Desktop ≤1440px
   - Laptop        ≤1280px
   - Tablet        ≤1024px
   - Mobile L      ≤768px
   - Mobile S      ≤480px
   ========================= */

/* ≤1440px — Small desktops */
@media (max-width: 1440px) {
  .ces-hero__slide { min-height: 720px; }
  .ces-hero__inner { padding: 88px 0 88px 0; --ces-gap: 56px; --ces-cta-mt: 16px; }

  .ces-hero__title { font-size: clamp(28px, 4vw, 56px) !important; }
  .ces-hero__text  { font-size: clamp(17px, 1.3vw, 26px); }

  .ces-hero__btn { font-size: 18px !important; padding: 12px 26px; }
  .ces-hero .swiper-pagination-bullet { width: 13px; height: 13px; }

  .ces-hero__bottom { bottom: 16px; }
}

/* ≤1280px — Laptops */
@media (max-width: 1280px) {
  .ces-hero__slide { min-height: 620px; }
  .ces-hero__inner {
    width: min(1000px, 92%);
    padding: 76px 0 84px 0;
    --ces-gap: 48px;
    --ces-cta-mt: 14px;
  }

  .ces-hero__title { font-size: clamp(26px, 3.6vw, 50px) !important; }
  .ces-hero__text  { font-size: clamp(16px, 1.2vw, 22px); }

  .ces-hero__btn { font-size: 17px !important; padding: 11px 24px; }
  .ces-hero .swiper-pagination-bullet { width: 12px; height: 12px; }

  .ces-hero__bottom { bottom: 14px; }
}

/* ≤1024px — Tablets */
@media (max-width: 1024px) {
  .ces-hero__slide { min-height: 620px; }
  .ces-hero__inner {
    width: min(860px, 92%);
    padding: 64px 0 80px 0;
    --ces-gap: 36px;
    --ces-cta-mt: 12px;
  }

  .ces-hero__title { font-size: clamp(24px, 3.8vw, 42px) !important; }
  .ces-hero__text  { font-size: clamp(15px, 1.6vw, 20px); }

  .ces-hero__btn { font-size: 16px !important; padding: 10px 22px; }
  .ces-hero__credit { font-size: 11px; }
  .ces-hero .swiper-pagination-bullet { width: 11px; height: 11px; }
  .ces-hero__pagination { margin-right: 200px; }
  .ces-hero__bottom { bottom: 12px; }
}

/* ≤768px — Mobile (large) */
@media (max-width: 768px) {
  .ces-hero__slide { min-height: 520px; }
  .ces-hero__inner {
    width: min(680px, 92%);
    padding: 48px 0 64px 0;
    --ces-gap: 24px;              /* tighter on phones */
    --ces-cta-mt: 10px;
  }
  .ces-hero__pagination { margin-right: 0px; }

  .ces-hero__title { font-size: clamp(22px, 6vw, 34px) !important; }
  .ces-hero__text  { font-size: clamp(14px, 3.8vw, 18px); max-width: 60ch; }

  .ces-hero__btn { font-size: 15px !important; padding: 10px 20px; }
  .ces-hero .swiper-pagination-bullet { width: 10px; height: 10px; }
}

/* ≤480px — Mobile (small) */
@media (max-width: 480px) {
  .ces-hero__slide { min-height: 440px; }
  .ces-hero__inner {
    padding: 40px 0 56px 0;
    --ces-gap: 18px;
    --ces-cta-mt: 8px;
  }

  .ces-hero__title { font-size: clamp(20px, 7vw, 28px) !important; }
  .ces-hero__text  { font-size: clamp(13px, 4.2vw, 16px); }

  .ces-hero__btn { font-size: 14px !important; padding: 9px 18px; }
  .ces-hero__credit { font-size: 10px; }
  .ces-hero .swiper-pagination-bullet { width: 9px; height: 9px; }
}