/**
 * Responsive overflow fixes for Albert School Astro site.
 * Loaded after Webflow CSS to correct horizontal scroll issues
 * without modifying the 21k-line exported stylesheet.
 */

/* --------------------------------------------------------------------------
   Global containment (fallback after targeted fixes)
   -------------------------------------------------------------------------- */
html {
  overflow-x: clip;
  width: 100%;
}

body {
  overflow-x: clip;
  max-width: 100%;
  width: 100%;
  position: relative;
}

.page_wrap {
  overflow-x: clip;
  width: 100%;
  max-width: 100%;
}

/* --------------------------------------------------------------------------
   Navigation — fix 100vw scrollbar gutter overflow on every page
   -------------------------------------------------------------------------- */
.navigation_top-banner {
  width: 100%;
}

.navigation_top-banner-2 {
  width: 100%;
}

.navigation_menu_contain.u-container,
.navigation_contain-2.u-container.u-hflex-between-center {
  max-width: 100%;
}

/* --------------------------------------------------------------------------
   Navigation — scroll state (replicates Webflow a-12 "Navigation background color")
   -------------------------------------------------------------------------- */
.navigation_contain.u-container.u-hflex-between-center {
  background-color: transparent;
  border-bottom: 1px solid transparent;
  transition:
    background-color 0.5s ease,
    border-color 0.5s ease;
}

.navigation_brand,
.navigation_menu_content .navigation_text,
.navigation_menu_content .navigation_menu_sub-menu_toggle.u-text-color-white,
.navigation_menu_content .navigation_menu_link.u-text-color-white {
  transition: color 0.5s ease;
}

.navigation_wrap[data-nav-scrolled] .navigation_contain.u-container.u-hflex-between-center {
  background-color: var(--_themes---swatch--white);
  border-bottom-color: var(--_themes---swatch--button-border);
}

.navigation_wrap[data-nav-scrolled] .navigation_brand,
.navigation_wrap[data-nav-scrolled] .navigation_menu_content .navigation_text,
.navigation_wrap[data-nav-scrolled] .navigation_menu_content .navigation_menu_sub-menu_toggle.u-text-color-white,
.navigation_wrap[data-nav-scrolled] .navigation_menu_content .navigation_menu_link.u-text-color-white {
  color: var(--_themes---swatch--brand-dark);
}

/* Webflow light-header pages (apply.html navigation_custom-css): dark nav on light backgrounds */
body:has(main.page_main > section.white-header_section:first-child) .navigation_burger_button,
body:has(main.page_main > section.form_section:first-child) .navigation_burger_button {
  background-color: var(--swatch--background-gray);
}

body:has(main.page_main > section.white-header_section:first-child) .navigation_brand,
body:has(main.page_main > section.form_section:first-child) .navigation_brand,
body:has(main.page_main > section.white-header_section:first-child) .navigation_text,
body:has(main.page_main > section.form_section:first-child) .navigation_text,
body:has(main.page_main > section.white-header_section:first-child) .navigation_menu_sub-menu_toggle,
body:has(main.page_main > section.form_section:first-child) .navigation_menu_sub-menu_toggle,
body:has(main.page_main > section.white-header_section:first-child)
  .navigation_menu_content
  .navigation_menu_link.u-text-color-white,
body:has(main.page_main > section.form_section:first-child)
  .navigation_menu_content
  .navigation_menu_link.u-text-color-white,
body:has(main.page_main > section.white-header_section:first-child)
  .navigation_menu_content
  .navigation_menu_sub-menu_toggle.u-text-color-white,
body:has(main.page_main > section.form_section:first-child)
  .navigation_menu_content
  .navigation_menu_sub-menu_toggle.u-text-color-white {
  color: var(--_themes---swatch--font-color);
}

body:has(main.page_main > section.white-header_section:first-child) .navigation_top-banner,
body:has(main.page_main > section.form_section:first-child) .navigation_top-banner {
  border-color: var(--swatch--brand-dark);
  background-color: var(--swatch--button-border);
}

/* --------------------------------------------------------------------------
   Hero section
   -------------------------------------------------------------------------- */
.hero_section {
  position: relative;
  overflow-x: clip;
}

.lp-hero_section {
  position: relative;
  overflow-x: clip;
}

.hero_section .hero_bg-img:not(.is-ibba),
.lp-hero_section .hero_bg-img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.hero_home_circle_2 {
  max-width: min(28.125rem, 45vw);
}

/* IBBA campus landing pages */
.hero_section.is-ibba {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.hero_section.is-ibba .hero_contain.u-container.u-hflex-left-stretch {
  flex: 1;
  width: 100%;
  position: relative;
  z-index: 500;
  padding-bottom: var(--size--64px, 4rem);
}

@media screen and (min-width: 992px) {
  .hero_section.is-ibba .hero_bg-img.is-ibba {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: auto;
    width: 60%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
    z-index: 50;
  }

  .hero_section.is-ibba .hero_bg-color {
    position: absolute;
    inset: 0;
    z-index: 30;
  }
}

@media screen and (max-width: 991px) {
  .hero_section.is-ibba .hero_bg-img.is-ibba {
    position: static;
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
  }
}

@media screen and (max-width: 479px) {
  .hero_section.is-ibba {
    min-height: auto;
  }
}

.ibba-partners_section,
.lead-gen-fees_section,
.lead-gen-events_section {
  position: relative;
  z-index: 1;
}

@media screen and (max-width: 1199px) {
  .hero_text,
  .hero_text.u-vflex-left-center {
    min-width: 0;
  }
}

@media screen and (max-width: 991px) {
  /* Center the decorative frosted-glass circle; clip overflow on .hero_section */
  .hero_section {
    overflow-x: clip;
    overflow-y: hidden;
  }

  .hero_home_circle_1 {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
  }

  /*
   * Homepage hero image framing — matches live albertschool.com.
   * The subject sits on the right of the source photo; 80% 20% centers
   * the focal point in the viewport (verified via computed styles on production).
   */
  .hero_section:not(.is-program):not(.is-ibba) .hero_bg-img,
  .lp-hero_section .hero_bg-img {
    position: absolute;
    inset: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: 80% 20%;
  }

  .hero_form {
    min-width: 0;
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .hero_text,
  .hero_text.u-vflex-left-center {
    width: 100%;
    min-width: 0;
  }
}

/* --------------------------------------------------------------------------
   Philosophy decorative circles
   -------------------------------------------------------------------------- */
.g_left-right_asset_mask {
  overflow: hidden;
}

.philosophy_section,
.g_left-right_wrap {
  overflow-x: clip;
}

.double-left-right_section .g_left-right_wrap {
  grid-template-areas: none;
  grid-template-columns: 1fr 1fr;
  align-items: center;
}

.double-left-right_section .g_left-right_asset {
  align-self: center;
  width: 100%;
  max-width: 27.5rem;
  justify-self: center;
}

.double-left-right_section .g_left-right_asset .video_wrap {
  width: 100%;
  max-width: 27.5rem;
  aspect-ratio: 2729 / 2002;
}

.double-left-right_section .g_left-right_asset .video_section {
  width: 100%;
  max-width: 27.5rem;
}

.double-left-right_section .g_left-right_asset .video_lightbox {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 2729 / 2002;
  position: relative;
}

.double-left-right_section .g_left-right_asset .video_img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

@media screen and (max-width: 991px) {
  .double-left-right_section .g_left-right_asset {
    max-width: 100%;
    justify-self: stretch;
  }

  .double-left-right_section .g_left-right_asset .video_wrap,
  .double-left-right_section .g_left-right_asset .video_section {
    max-width: 100%;
  }
}

/* --------------------------------------------------------------------------
   Sliders / carousels (Swiper + Webflow cd-slider)
   -------------------------------------------------------------------------- */
/* Clip on the Swiper container only — never on .swiper-wrapper, which is transformed. */
.swiper,
[slider-element='container'].swiper-initialized,
.w-dyn-list.swiper-initialized {
  overflow: hidden;
}

.investors_col-list-wrapper,
.students-testimonials_col-list-wrapper {
  overflow: hidden;
  max-width: 100%;
}

.students-testimonials_item {
  min-width: 0;
}

.students-testimonials_section,
.investors_section {
  overflow-x: clip;
}

/* Educators slider: preserve Webflow 18rem card width when Swiper switches mask to flex */
.educators-slider_wrapper {
  overflow: hidden;
  max-width: 100%;
}

.educators-slider_list .educators-slider_item,
.educators-slider_list.swiper-wrapper .swiper-slide {
  width: 18rem !important;
  max-width: 18rem !important;
  flex-shrink: 0 !important;
}

.educators-slider_wrapper.swiper {
  min-height: 18rem;
}

/* Full-width grid-mask sliders (Business Deep Dive, Kickstart career) */
.deep-dives-details_section [cd-slider='name'] [slider-element='container'],
.kickstart-career_section [cd-slider='kickstart-career'] [slider-element='container'] {
  overflow: hidden;
  width: 100%;
  position: relative;
}

.deep-dives-details_section .g_slider_mask.swiper-wrapper,
.kickstart-career_section .kickstart-career_grid.swiper-wrapper {
  display: flex !important;
  grid-auto-flow: unset;
  grid-template-columns: unset;
}

.deep-dives-details_section .g_slider_mask.swiper-wrapper > .swiper-slide,
.kickstart-career_section .kickstart-career_grid.swiper-wrapper > .swiper-slide {
  width: 100% !important;
  max-width: 100% !important;
  flex-shrink: 0 !important;
}

.kickstart-career_section .kickstart-career_item.swiper-slide {
  position: relative;
  min-height: 28rem;
}

.kickstart-career_section [cd-slider='kickstart-career'] [slider-element='container'] {
  min-height: 28rem;
}

@media screen and (max-width: 991px) {
  .investors_grid {
    overflow: hidden;
  }

  .investors_header-card_wrapper {
    width: calc(100% + 2 * var(--padding-horizontal--main));
    max-width: none;
  }

  .investors_slider_wrap.u-blue-dots-slider,
  .students-testimonials_slider_wrap.u-blue-dots-slider,
  .carreer_slider_wrap,
  .full-bg-img-slider_slider_wrap,
  .full-bg-img-slider_slider_slide,
  .lead-gen-pre-footer_img_wrap.u-hflex-center-center,
  .event-filters-mobile_section {
    width: 100%;
    max-width: 100%;
  }
}

/* --------------------------------------------------------------------------
   Career cards — 3×2 grid on desktop (slider only ≤991px)
   -------------------------------------------------------------------------- */
@media screen and (min-width: 992px) {
  .carreer_slider_wrap.w-slider {
    height: auto;
    background: transparent;
    text-align: left;
  }

  .carreer_slider_wrap .carreer_grid.w-slider-mask {
    display: grid !important;
    grid-template-columns: var(--grid-3);
    grid-column-gap: var(--grid-gap--main);
    grid-row-gap: var(--grid-gap--main);
    white-space: normal !important;
    overflow: visible !important;
    transform: none !important;
    height: auto !important;
  }

  .carreer_slider_wrap .carreer_slide.w-slide {
    display: block !important;
    width: auto !important;
    height: auto !important;
    white-space: normal;
  }

  .carreer_slider_wrap .carreer_slider_nav {
    display: none !important;
  }
}

/* --------------------------------------------------------------------------
   Learn-with-best accordion full-bleed images
   -------------------------------------------------------------------------- */
.learn-with-best_section,
.learn-with-best_accordion_list_item {
  overflow-x: clip;
}

/* --------------------------------------------------------------------------
   Pre-footer, footer, cards
   -------------------------------------------------------------------------- */
.pre-footer_section {
  overflow-x: clip;
}

.article_subtitle {
  width: 100%;
  max-width: 80%;
}

.footer_top_logos {
  max-width: 100%;
  height: auto;
}

.footer_section {
  overflow-x: clip;
}

/* --------------------------------------------------------------------------
   Forms
   -------------------------------------------------------------------------- */
.hs-error-msg {
  white-space: normal;
  overflow-wrap: anywhere;
}

@media screen and (max-width: 767px) {
  .newsletter_input {
    min-width: 0;
  }
}

/* --------------------------------------------------------------------------
   Content images (override global height: 100% on non-cover images)
   -------------------------------------------------------------------------- */
.blog-article_content img,
.article_card img:not(.u-cover-absolute):not(.article_bg_img) {
  height: auto;
}

/* --------------------------------------------------------------------------
   Mobile nav fixed bottom bar — prevent content hidden behind CTAs
   -------------------------------------------------------------------------- */
@media screen and (max-width: 991px) {
  .page_main {
    padding-bottom: calc(5rem + env(safe-area-inset-bottom, 0px));
  }

  .navigation_bottom_buttons {
    width: 100%;
    max-width: 100%;
    left: 0;
    right: 0;
    box-sizing: border-box;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  .navigation_bottom_button,
  .navigation_bottom_button a {
    min-width: 0;
    max-width: 100%;
  }
}

/* --------------------------------------------------------------------------
   Partners section
   -------------------------------------------------------------------------- */
.partners_section {
  overflow-x: clip;
}

/* --------------------------------------------------------------------------
   News / events section
   -------------------------------------------------------------------------- */
.news_section {
  overflow-x: clip;
}

/* --------------------------------------------------------------------------
   Phase 2 — migrated program & landing pages
   -------------------------------------------------------------------------- */
.page_main {
  overflow-x: clip;
}

.g_section_wrap,
.program-key-info_section,
.educ-philosophy_section,
.faq_section {
  overflow-x: clip;
}

.g_accordion_list {
  overflow: hidden;
}

.w-tab-content {
  overflow-x: clip;
}

.popup_wrap {
  max-width: calc(100vw - 2rem);
}

@media screen and (max-width: 479px) {
  .u-container {
    padding-left: var(--padding-horizontal--main);
    padding-right: var(--padding-horizontal--main);
  }

  .hero_title.u-text-h1 {
    word-break: break-word;
  }
}

/* --------------------------------------------------------------------------
   Images — prevent overflow from oversized or missing assets
   -------------------------------------------------------------------------- */
img:not(.hero_bg-img):not(.home-hero__bg):not(.u-cover-absolute):not(.video_img):not(.lead-gen-programs_img):not(.article_bg_img):not(.event_bg_img):not(.press_bg_img) {
  max-width: 100%;
  height: auto;
}

.article_img-wrap {
  overflow: hidden;
}

.article_img-wrap .article_bg_img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.event_bg_img,
.press_bg_img,
.partners-alt_logo_img {
  object-fit: contain;
}

.g_visual_img.u-cover-absolute {
  object-fit: cover;
  object-position: center;
}

.lead-gen-events_section .community_grid_img_wrap {
  min-height: 18rem;
}

.lead-gen-events_section .community_grid_img_wrap .g_visual_wrap.u-cover-absolute {
  inset: 0;
}

.lead-gen-programs_grid.u-grid-column-3 {
  place-items: stretch;
}

.lead-gen-programs_grid.u-grid-column-3 .lead-gen-programs_card {
  width: 100%;
}

.lead-gen-programs_img {
  width: 100%;
  height: 25rem;
  max-width: none;
  object-fit: cover;
}

/* Hero and brochure backgrounds must cover their containers */
.brochure_section {
  position: relative;
  overflow: hidden;
}

.brochure_image_wrap .brochure_image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
}

/* --------------------------------------------------------------------------
   Partner banner logos — uniform sizing
   -------------------------------------------------------------------------- */
.banner_partner_logo_wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}

.banner_partner_logo_wrap.is-smaller {
  height: var(--size--96px);
}

.banner_partner_logo {
  height: var(--size--48px);
  width: auto;
  max-width: 100%;
  object-fit: contain;
  object-position: center;
}

/* --------------------------------------------------------------------------
   Partners testimonials slider — flex layout (Webflow exports grid, breaks Swiper)
   -------------------------------------------------------------------------- */
.partners-testimonials_slider.swiper {
  width: 100%;
  overflow: hidden;
}

.partners-testimonials_slider_cms,
.partners-testimonials_slider_cms.swiper-wrapper {
  display: flex !important;
  grid-auto-flow: unset !important;
  grid-template-columns: unset !important;
  align-items: stretch;
  width: 100%;
  height: auto;
  box-sizing: border-box;
}

.partners-testimonials_slider_cms_item,
.partners-testimonials_slider_cms_item.swiper-slide {
  display: flex !important;
  flex-direction: column;
  width: 100% !important;
  min-width: 100%;
  height: auto;
  flex-shrink: 0;
  box-sizing: border-box;
}

.partners-testimonials_slider .swiper-slide {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  position: relative;
  z-index: 0;
}

.partners-testimonials_slider .swiper-slide.is-current {
  z-index: 1;
}

.partners-testimonials_slider .swiper-wrapper {
  align-items: stretch;
}

.partners-testimonials_slider_cms_item .partner-testimonials_card {
  flex: 1 1 auto;
  width: 100%;
  min-height: 100%;
}

/* --------------------------------------------------------------------------
   Section text theme — foreground color adapts to background context
   Fixes conflicting Webflow export rules (e.g. white text on white sections).
   -------------------------------------------------------------------------- */
:root {
  --section-text-on-light: var(--_themes---swatch--brand-dark, #202448);
  --section-text-on-dark: var(--_themes---swatch--white, #ffffff);
}

/* Light-background sections */
:is(
  section.business-school_section,
  section.logistics_section,
  section.faq_section,
  section.partners_section,
  section.testimonials_short-courses_section,
  section.program_section,
  section.program-for_section,
  section.pillars_section,
  section.at-a-glance_section,
  section.program-key-info_section,
  section.u-bg-gray,
  section.u-bg-gray-alt
) {
  color: var(--section-text-on-light);
}

/* Dark-background sections (exclude short-course overrides below) */
:is(
  section.u-bg-primary-dark:not(.intense-courses_section),
  section.brochure_section.u-bg-primary-dark
) {
  color: var(--section-text-on-dark);
}

/* Short-course "intense-courses" blocks use a light gray background in Webflow */
.intense-courses_section.u-bg-primary-dark {
  color: var(--section-text-on-light);
}

/* Webflow export: business-school container hardcodes white text on light bg */
.business-school_section .business-school_container.u-container {
  color: inherit;
}

/* --------------------------------------------------------------------------
   Program hero theme — short-course / program pages (hero_section.is-program)
   Dark overlay panel with light foreground; badge chip keeps dark text.
   -------------------------------------------------------------------------- */
.hero_section.is-program {
  --hero-program-text: var(--section-text-on-dark);
  --hero-program-overlay: rgb(32 36 72 / 0.55);
  --hero-program-gradient: linear-gradient(
    270deg,
    rgb(32 36 72 / 0.82) 0%,
    rgb(32 36 72 / 0.5) 42%,
    rgb(32 36 72 / 0.18) 68%,
    transparent 85%
  );
  color: var(--hero-program-text);
}

.hero_section.is-program .hero_gradient {
  background-image: var(--hero-program-gradient);
}

.hero_section.is-program .hero_circle.is-bottom-aligned {
  background-color: var(--hero-program-overlay);
}

/* Badge chip sits on brand-light background — dark text for contrast */
.hero_section.is-program .hero_tagline.is-program {
  color: var(--section-text-on-light);
}

.hero_section.is-program :is(
  .hero_text,
  .hero_title,
  .hero_title h1,
  .hero_title p,
  .hero_title .w-richtext,
  .hero_title .w-richtext h1,
  .hero_title .w-richtext p
) {
  color: var(--hero-program-text);
}

.hero_section.is-program .g_button_wrap.is-outlined-white {
  color: var(--hero-program-text);
  border-color: rgb(255 255 255 / 0.7);
}

.hero_section.is-program .g_button_wrap.is-outlined-white .g_button_text,
.hero_section.is-program .g_button_wrap.is-outlined-white .g_button_icon {
  color: inherit;
}

/* Webflow export: global h1 color is white — inherit section theme instead */
section.white-header_section {
  color: var(--_themes---swatch--font-color);
}

:is(
  section.white-header_section,
  section.business-school_section,
  section.logistics_section,
  section.faq_section,
  section.partners_section,
  section.testimonials_short-courses_section,
  section.program_section,
  section.program-for_section,
  section.pillars_section,
  section.at-a-glance_section,
  section.program-key-info_section,
  section.u-bg-gray,
  section.u-bg-gray-alt,
  section.intense-courses_section
) :is(
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  li,
  .w-richtext,
  .g_heading_rich,
  .g_heading_wrap,
  .g_left-right_text,
  .business-school_text_wrap
) {
  color: inherit;
}

section.program-for_section .g_left-right_text {
  position: relative;
  z-index: 101;
}

section.program-for_section .g_left-right_asset {
  overflow: hidden;
}

@media screen and (max-width: 991px) {
  .hero_section.is-program {
    --hero-program-overlay: rgb(32 36 72 / 0.48);
    --hero-program-gradient: linear-gradient(
      180deg,
      rgb(32 36 72 / 0.78) 0%,
      rgb(32 36 72 / 0.45) 35%,
      rgb(32 36 72 / 0.15) 65%,
      transparent 100%
    );
  }
}

@media screen and (max-width: 767px) {
  .hero_section.is-program {
    --hero-program-overlay: rgb(32 36 72 / 0.42);
    --hero-program-gradient: linear-gradient(
      180deg,
      rgb(32 36 72 / 0.72) 0%,
      rgb(32 36 72 / 0.38) 40%,
      transparent 80%
    );
  }
}

/* Campus full-bg-img-slider — keep Swiper background out of document flow */
.full-bg-img-slider_section {
  position: relative;
}

.full-bg-img-slider_slider_master {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.full-bg-img-slider_slider_master,
.full-bg-img-slider_slider_wrap,
.full-bg-img-slider_slider_mask.g_slider_mask,
.full-bg-img-slider_slider_mask.swiper-wrapper {
  height: 100%;
  min-height: inherit;
}

.full-bg-img-slider_slider_wrap.swiper {
  position: absolute !important;
  inset: 0;
  width: 100%;
}

.full-bg-img-slider_slider_slide,
.full-bg-img-slider_slider_slide.swiper-slide {
  height: 100%;
}

/* Life at Albert School — campus banner slider images */
.full-bg-img-slider_slider_img {
  width: 100%;
  height: 100%;
  min-height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.full-bg-img-slider_slider_slide {
  min-height: 100%;
}

.life-at-page .full-bg-img-slider_slider_master,
.life-at-page .full-bg-img-slider_slider_wrap,
.life-at-page .full-bg-img-slider_slider_mask.g_slider_mask {
  height: 100%;
  min-height: inherit;
}

/* --------------------------------------------------------------------------
   Global 100vw containment — prevent scrollbar-gutter horizontal overflow
   -------------------------------------------------------------------------- */
.navigation_top-banner,
.navigation_top-banner-2,
.page_popups,
.page_popups.u-hflex-center-center {
  max-width: 100%;
}

/* Homepage hero — hide empty CMS placeholder */
.hero_section .w-dyn-empty {
  display: none !important;
}
