/*!/wp-content/themes/mediz-child/style.css*//*
 Theme Name:   Mediz Child
 Theme URI:    http://demo.goodlayers.com/mediz
 Description:  Goodlayers Mediz Child Theme
 Author:       Goodlayers
 Author URI:   http://goodlayers.com
 Template:     mediz
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, right-sidebar, responsive-layout
 Text Domain:  mediz-child

 START YOUR CHILD THEME CSS HERE
*/

.hero-wrapper {
  position: relative;
  background-color: #17449e;
  padding-bottom: 30px;
}

/* Slider area */


/* Slides */
.slide {
  transition: opacity 0.8s ease;
}

.slide.is-active {
  z-index: 1;
}


.slide-overlay {
  /* optional overlay */
}

/* Slide text (base) */
.slide-content {
  transform: translate(-50%, -50%);
  max-width: 760px;
  text-align: center;
  color: #fff;
  padding: 0 1.5rem;
  opacity: 1;
}

.slide-content h1 {
  font-size: 105px !important;
  line-height: 100px !important;
  color: #fff !important;
}

.slide-content h2 {
  font-size: 58px;
  line-height: 54px;
  color: #fff !important;
}

.slide-content.left {
  text-align: left;
}

.slide-content.right {
  position: absolute;
  top: 40%;
  left: 60%;
  text-align: right;
}

.slide-content .tagline {
  margin-bottom: 1.2rem;
  color: rgb(187, 209, 255) !important;
  font-size: 34px;
  line-height: 34px;
}

.divider {
  width: 60px;
  height: 2px;
  background: rgba(255,255,255,1);
  margin: 0 auto 1.2rem;
}

.slide-content .description {
  font-size: 17px !important;
  line-height: 28px !important;
}

/* Blue floating box */
.hero-info-box {
  position: absolute;
  left: 50%;
  bottom: -200px;
  transform: translateX(-50%);
  width: min(1100px, 90%);
  background: linear-gradient(135deg, #18459F, #2D66BC);
  color: #fff;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  padding: 2rem 2.5rem;
  border-radius: 6px;
  box-shadow: 0 20px 40px rgba(0,0,0,0.25);
  z-index: 10;
}

.hero-info-box .info-column .top-icons {
  float: left;
  margin-top: 18px;
  margin-right: 8px;
}

.hero-info-box .info-column p {
  color: #abcbff;
  font-size: 16px;
}

.hero-info-box .info-column .phone a {
  color: #fff;
  font-size: 16px;
  text-decoration: none;
}

/* Fonts */
.poppins-light { font-weight: 300; }
.poppins-regular { font-weight: 400; }
.poppins-semibold { font-weight: 600; }
.poppins-bold { font-weight: 700; }

/* Animations */
.slide {
  animation: heroSlide 16s infinite;
}

.slide:nth-child(2) {
  animation-delay: 8s;
}

@keyframes heroSlide {
  0%, 40% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@keyframes heroTextCycle {
  0%   { opacity: 0; }
  10%  { opacity: 1; }
  40%  { opacity: 1; }
  50%  { opacity: 0; }
  100% { opacity: 0; }
}

.slide .slide-content {
  animation: heroTextCycle 16s infinite;
}

.slide:nth-child(2) .slide-content {
  animation-delay: 8s;
}

/* Tablet */
@media (max-width: 1024px) {
  .hero-slider {
    height: 65vh;
    min-height: 520px;
  }

  .slide-content.left { left: 35%; }
  .slide-content.right { left: 65%; }

  .slide-content h1 {
    font-size: 72px !important;
    line-height: 72px !important;
  }

  .slide-content h2 {
    font-size: 42px !important;
    line-height: 42px !important;
  }

  .slide-content .tagline {
    font-size: 26px !important;
    line-height: 30px !important;
  }
}

/* ===============================
   MOBILE HERO FIX (CENTERED)
   =============================== */
@media (max-width: 768px) {

  .hero-slider {
    min-height: unset;
  }

  .slide {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .slide-content {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;

    width: 100%;
    max-width: 92vw;
    text-align: center;
    padding: 0 1rem;
  }


  .slide-content h1 {
    font-size: clamp(36px, 9vw, 52px) !important;
    line-height: 1.1 !important;
  }

  .slide-content h2 {
    font-size: clamp(26px, 7vw, 36px) !important;
    line-height: 1.15 !important;
  }

  .slide-content .tagline {
    font-size: clamp(16px, 4.5vw, 20px) !important;
    line-height: 1.3 !important;
    margin-bottom: 1rem;
  }

  .divider {
    margin: 1rem auto;
  }

  .slide-content .description {
    display: none;
  }

  .hero-info-box {
    grid-template-columns: 1fr;
    bottom: -280px;
  }
}

/* Small phones */
@media (max-width: 480px) {

  .hero-slider {
    height: 65vh;
    min-height: 420px;
  }

  .slide-content h1 {
    font-size: 32px !important;
    line-height: 1.1 !important;
  }

  .slide-content h2 {
    font-size: 26px !important;
    line-height: 1.15 !important;
  }

  .slide-content .tagline {
    font-size: 16px !important;
    line-height: 20px !important;
  }
}

/* ===============================
   HERO SLIDER – MOBILE FIX
   Ensure image behaves like background
   =============================== */
@media (max-width: 768px) {

  .slide {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Take picture OUT of layout flow */
  .slide > picture {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
  }

  .slide > picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  /* Text above image */
  .slide-content {
    position: relative !important;
    z-index: 2;
    width: min(760px, 92vw);
    text-align: center;
  }

  .slide-content.left,
  .slide-content.right {
    left: auto !important;
    top: auto !important;
    transform: none !important;
  }
}


/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .slide.is-active .slide-content {
    animation: none;
    opacity: 1;
  }
}

.hero-slider .slide {
  transition:
    opacity 1.8s ease-in-out,
    transform 1.8s ease-in-out;
}

.hero-slider .slide-content {
  transition:
    opacity 1.6s ease-in-out,
    transform 1.6s ease-in-out;
}





/* Lite YouTube */
.lite-youtube {
  position: relative;
  aspect-ratio: 16 / 9;
  background-color: #000;
  background-size: cover;
  background-position: center;
  cursor: pointer;
}

.lite-youtube::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.25);
}

.lite-youtube::after {
  content: '▶';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 64px;
  color: #fff;
  pointer-events: none;
}

.lite-youtube.is-loaded::before,
.lite-youtube.is-loaded::after {
  display: none;
}

.lite-youtube iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: auto;
}

.gdlr-core-tab-feature3-title-wrap.gdlr-core-active {
  display: block !important;
  visibility: visible !important;
}

/**
 * Fallback FontAwesome4 
 * /
 */ 
i.fa.fa-play {
  font-style: normal;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

i.fa.fa-play::before {
  content: "\25B6"; /* Unicode play symbol */
  font-size: 1em;
  line-height: 1;
}

/* --------------------------------------------
   GoodLayers Tab Feature 3: responsive background images
   (Overrides inline background-image set by GoodLayers)
   -------------------------------------------- */

/* Base behavior: make sure the background behaves like a hero */
.gdlr-core-tab-feature3-content-wrap{
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* ===== Mobile (<= 768px): use small files ===== */
@media (max-width: 768px){

  /* Tab 1 (Hospital Introduction) */
  .gdlr-core-tab-feature3-content-wrap.gdlr-core-active[data-tab-id="1"]{
    background-image: url("/wp-content/uploads/2025/12/hospital-introduction-768x400.webp") !important;
    background-image: image-set(
      url("/wp-content/uploads/2025/12/hospital-introduction-768x400.webp") 1x,
      url("/wp-content/uploads/2025/12/hospital-introduction-1536x801.webp") 2x
    ) !important;
  }

  /* Tab 2 (Why MedExpress?) */
  .gdlr-core-tab-feature3-content-wrap.gdlr-core-active[data-tab-id="2"]{
    background-image: url("/wp-content/uploads/2025/12/why-medexpress-scaled-1-768x400.webp") !important;
    background-image: image-set(
      url("/wp-content/uploads/2025/12/why-medexpress-scaled-1-768x400.webp") 1x,
      url("/wp-content/uploads/2025/12/why-medexpress-scaled-1-1536x801.webp") 2x
    ) !important;
  }
}

/* ===== Tablet (769px–1200px): use medium files ===== */
@media (min-width: 769px) and (max-width: 1200px){

  /* Tab 1 */
  .gdlr-core-tab-feature3-content-wrap.gdlr-core-active[data-tab-id="1"]{
    background-image: url("/wp-content/uploads/2025/12/hospital-introduction-1100x490.webp") !important;
    background-image: image-set(
      url("/wp-content/uploads/2025/12/hospital-introduction-1100x490.webp") 1x,
      url("/wp-content/uploads/2025/12/hospital-introduction-1550x700.webp") 2x
    ) !important;
  }

  /* Tab 2 */
  .gdlr-core-tab-feature3-content-wrap.gdlr-core-active[data-tab-id="2"]{
    background-image: url("/wp-content/uploads/2025/12/why-medexpress-scaled-1-1100x490.webp") !important;
    background-image: image-set(
      url("/wp-content/uploads/2025/12/why-medexpress-scaled-1-1100x490.webp") 1x,
      url("/wp-content/uploads/2025/12/why-medexpress-scaled-1-1550x700.webp") 2x
    ) !important;
  }
}

/* ===== Desktop (>= 1201px): use large files ===== */
@media (min-width: 1201px){

  /* Tab 1 */
  .gdlr-core-tab-feature3-content-wrap.gdlr-core-active[data-tab-id="1"]{
    background-image: url("/wp-content/uploads/2025/12/hospital-introduction-1550x700.webp") !important;
    background-image: image-set(
      url("/wp-content/uploads/2025/12/hospital-introduction-1550x700.webp") 1x,
      url("/wp-content/uploads/2025/12/hospital-introduction.webp") 2x
    ) !important;
  }

  /* Tab 2 */
  .gdlr-core-tab-feature3-content-wrap.gdlr-core-active[data-tab-id="2"]{
    background-image: url("/wp-content/uploads/2025/12/why-medexpress-scaled-1-1550x700.webp") !important;
    background-image: image-set(
      url("/wp-content/uploads/2025/12/why-medexpress-scaled-1-1550x700.webp") 1x,
      url("/wp-content/uploads/2025/12/why-medexpress-scaled-1.webp") 2x
    ) !important;
  }
}

@font-face{font-family:'Poppins';font-display:swap;}
@font-face{font-family:'Montserrat';font-display:swap;}

@font-face{font-family:"Font Awesome 5 Free";font-style:normal;font-weight:900;font-display:swap;}

@font-face{font-family:"Font Awesome 5 Brands";font-style:normal;font-weight:400;font-display:swap;}

@font-face{font-family:"ElegantIcons";font-display:swap;}

@font-face{font-family:"Simple-Line-Icons";font-display:swap;}