/* Alshulah v5.8.9 — Canonical Home Hero / mobile flow.
 * This file is the single final authority for header-to-banner flow, Hero geometry,
 * Hero cards slider, and Hero article slider on small screens.
 */

/* Current Hero article slider — desktop/tablet base. */
.hero-modern-v522 .alshulah-hero-news-slider-v529{order:5;width:100%;max-width:980px;margin:18px auto 0;position:relative;z-index:6;direction:rtl;overflow:hidden}
.hero-modern-v522 .alshulah-hero-news-track-v529{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:stretch;gap:16px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:6px 2px 16px;margin:0;list-style:none;scrollbar-width:none}
.hero-modern-v522 .alshulah-hero-news-track-v529::-webkit-scrollbar{display:none}
.hero-modern-v522 .alshulah-hero-news-track-v529>*{float:none}
.hero-modern-v522 .alshulah-hero-news-slide-v529{display:block;flex:0 0 calc((100% - 32px)/3);width:calc((100% - 32px)/3);max-width:calc((100% - 32px)/3);min-width:250px;margin:0;padding:0;list-style:none;scroll-snap-align:start}
.hero-modern-v522 .alshulah-hero-news-card-v529{display:flex;flex-direction:column;width:100%;height:100%;min-height:246px;overflow:hidden;text-decoration:none;color:#fff;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.28);border-radius:24px;box-shadow:0 18px 42px rgba(0,0,0,.18);backdrop-filter:blur(18px);transition:transform .2s ease,background .2s ease}
.hero-modern-v522 .alshulah-hero-news-card-v529:hover{transform:translateY(-3px);background:rgba(255,255,255,.21)}
.hero-modern-v522 .alshulah-hero-news-image-v529{display:block;width:100%;height:158px;min-height:158px;overflow:hidden;background:rgba(255,255,255,.12);border-radius:24px 24px 0 0}
.hero-modern-v522 .alshulah-hero-news-image-v529 img{display:block;width:100%;height:100%;object-fit:cover;margin:0;max-width:none}
.hero-modern-v522 .alshulah-hero-news-placeholder-v529{height:100%;display:grid;place-items:center;font-size:42px;font-weight:900;color:#fff;background:linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.04))}
.hero-modern-v522 .alshulah-hero-news-title-v529{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-align:right;font-size:16px;line-height:1.65;font-weight:900;color:#fff;padding:16px 18px 18px;min-height:78px}

@media(max-width:767px){
  /* Header is an opaque block in normal flow; banners can never sit behind it. */
  html body .site-header,html body.home .site-header,html body.admin-bar .site-header,html body.home.admin-bar .site-header{position:relative!important;inset:auto!important;top:auto!important;z-index:50!important;display:block!important;width:100%!important;margin:0!important;padding:0!important;clear:both!important;float:none!important;background:#fff!important;background-image:none!important;opacity:1!important;transform:none!important;filter:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;overflow:visible!important;border-bottom:1px solid rgba(15,107,220,.12)!important;box-shadow:0 8px 18px rgba(15,23,42,.06)!important}
  html body .site-header .header-inner,html body.home .site-header .header-inner{position:relative!important;z-index:1!important;min-height:62px!important;height:62px!important;padding-top:7px!important;padding-bottom:7px!important;margin:0 auto!important;background:#fff!important;transform:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;overflow:visible!important}
  html body .alshulah-home-flow,html body.home .alshulah-home-flow{position:relative!important;z-index:1!important;clear:both!important;margin-top:0!important;padding-top:0!important;transform:none!important;overflow:visible!important}

  /* Remove the accumulated wrapper gap between upper slider and Hero. */
  body.home .alshulah-home-flow>.alshulah-home-section-wrap[data-home-section="upper_slider"]{margin-top:0!important;margin-bottom:0!important;padding-top:0!important;padding-bottom:0!important}
  body.home .alshulah-home-flow>.alshulah-home-section-wrap[data-home-section="hero"]{width:100vw!important;max-width:100vw!important;margin:0 calc(50% - 50vw)!important;padding:0!important;background:transparent!important;border-radius:0!important;box-shadow:none!important;overflow:hidden!important}
  body.home .alshulah-upper-slider-v580{margin-bottom:0!important}

  /* Full-bleed Hero: blue background reaches both viewport edges. */
  body.home .hero,body.home .hero-modern,body.home .hero-modern-v522{width:100%!important;max-width:none!important;margin:0!important;padding:0!important;border-radius:0!important}
  body.home .hero-modern-v522 .hero-inner{width:100%!important;max-width:none!important;min-height:0!important;margin:0!important;padding:34px 18px calc(34px + env(safe-area-inset-bottom))!important;box-sizing:border-box!important;border-radius:0!important;overflow:hidden!important}

  /* Hero cards: exactly one full card; never reveal another card or fragment. */
  body.home .hero-modern-v522 .hero-panel.hero-panel-wide.hero-panel-top[data-mobile-layout="slider"],body.home .hero-modern-v522 .hero-panel.hero-panel-mobile-slider{display:flex!important;grid-template-columns:none!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:stretch!important;justify-content:flex-start!important;gap:0!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory!important;scroll-padding:0!important;overscroll-behavior-inline:contain!important;-webkit-overflow-scrolling:touch!important;padding:8px 0 12px!important;margin:0!important;scrollbar-width:none!important;direction:rtl!important}
  body.home .hero-modern-v522 .hero-panel[data-mobile-layout="slider"]::-webkit-scrollbar{display:none!important}
  body.home .hero-modern-v522 .hero-panel[data-mobile-layout="slider"]>.hero-panel-card,body.home .hero-modern-v522 .hero-panel[data-mobile-layout="slider"]>.hero-panel-card-v527{display:flex!important;flex:0 0 100%!important;width:100%!important;min-width:100%!important;max-width:100%!important;margin:0!important;box-sizing:border-box!important;scroll-snap-align:start!important;scroll-snap-stop:always!important}

  /* Preserve the two other Home Builder modes. */
  body.home .hero-modern-v522 .hero-panel[data-mobile-layout="row"]{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;overflow:visible!important;padding:0!important;margin:0!important}
  body.home .hero-modern-v522 .hero-panel[data-mobile-layout="row"]>.hero-panel-card,body.home .hero-modern-v522 .hero-panel[data-mobile-layout="row"]>.hero-panel-card-v527{min-width:0!important;width:auto!important;max-width:none!important}
  body.home .hero-modern-v522 .hero-panel[data-mobile-layout="vertical"]{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;overflow:visible!important;padding:0!important;margin:0!important}

  /* Hero article slider: exactly one complete article card. */
  body.home .hero-modern-v522 .alshulah-hero-news-slider-v529{width:100%!important;max-width:100%!important;margin-top:18px!important;overflow:hidden!important}
  body.home .hero-modern-v522 .alshulah-hero-news-track-v529{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;gap:0!important;width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;padding:6px 0 16px!important;margin:0!important;scroll-snap-type:x mandatory!important;scroll-padding:0!important;overscroll-behavior-inline:contain!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important}
  body.home .hero-modern-v522 .alshulah-hero-news-track-v529::-webkit-scrollbar{display:none!important}
  body.home .hero-modern-v522 .alshulah-hero-news-slide-v529{display:block!important;flex:0 0 100%!important;width:100%!important;min-width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;box-sizing:border-box!important;scroll-snap-align:start!important;scroll-snap-stop:always!important}
  body.home .hero-modern-v522 .alshulah-hero-news-image-v529{height:150px!important;min-height:150px!important}

  /* The application navigation must not make the final content unreachable. */
  body.home main{padding-bottom:calc(130px + env(safe-area-inset-bottom))!important}
}