/* =========================================================
   VERSI 2 - HOME BACKGROUND SLIDER
   Upload foto ke: public_html/uploads/home-slider/
   ========================================================= */

.hero-home-slider-v2{
  position:relative !important;
  min-height:620px;
  overflow:hidden;
  isolation:isolate;
  background:#0b2f6f;
}

/* Pastikan bingkai/collage lama hilang total */
.hero-home-slider-v2 .hero-collage,
.hero-collage{
  display:none !important;
}

.home-slider-v2-bg{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
}

.home-slider-v2-slide{
  position:absolute;
  inset:0;
  opacity:0;
  background-size:cover;
  background-position:center;
  transform:translateX(8%) scale(1.045);
  transition:
    opacity 1250ms ease,
    transform 1250ms cubic-bezier(.22,.61,.36,1);
  will-change:opacity, transform;
}

.home-slider-v2-slide.active{
  opacity:1;
  transform:translateX(0) scale(1);
}

.home-slider-v2-slide.prev{
  opacity:0;
  transform:translateX(-8%) scale(1.045);
}

.home-slider-v2-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.97) 0%, rgba(255,255,255,.92) 34%, rgba(255,255,255,.70) 56%, rgba(8,30,70,.36) 100%),
    linear-gradient(180deg, rgba(239,246,255,.30) 0%, rgba(239,246,255,.10) 55%, rgba(239,246,255,.70) 100%);
}

.hero-home-slider-v2 .hero-inner-slider-v2{
  position:relative;
  z-index:2;
  min-height:620px;
  display:flex;
  align-items:center;
}

.hero-home-slider-v2 .hero-copy{
  position:relative;
  z-index:3;
  max-width:640px;
}

.hero-home-slider-v2 .hero-copy h1{
  text-shadow:0 14px 42px rgba(255,255,255,.42);
}

.hero-home-slider-v2 .hero-copy p{
  max-width:620px;
}

.home-slider-v2-dots{
  position:absolute;
  z-index:5;
  left:50%;
  bottom:26px;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:9px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.64);
  border:1px solid rgba(255,255,255,.75);
  box-shadow:0 18px 45px rgba(15,39,71,.16);
  backdrop-filter:blur(14px);
}

.home-slider-v2-dots button{
  width:9px;
  height:9px;
  border:0;
  border-radius:999px;
  padding:0;
  background:rgba(37,99,235,.34);
  cursor:pointer;
  transition:width .28s ease, background .28s ease, transform .28s ease;
}

.home-slider-v2-dots button:hover{
  transform:scale(1.15);
}

.home-slider-v2-dots button.active{
  width:30px;
  background:#2563eb;
}

@media (max-width: 900px){
  .hero-home-slider-v2,
  .hero-home-slider-v2 .hero-inner-slider-v2{
    min-height:720px;
  }

  .hero-home-slider-v2 .hero-inner-slider-v2{
    justify-content:center;
    text-align:center;
    padding-top:60px;
    padding-bottom:96px;
  }

  .home-slider-v2-overlay{
    background:
      linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.88) 45%, rgba(8,30,70,.22) 100%),
      linear-gradient(180deg, rgba(239,246,255,.48), rgba(239,246,255,.25));
  }

  .hero-home-slider-v2 .hero-copy{
    margin:0 auto;
  }

  .hero-home-slider-v2 .leaf-line{
    margin-left:auto;
    margin-right:auto;
  }

  .hero-home-slider-v2 .hero-actions{
    flex-direction:column;
    align-items:stretch;
  }

  .hero-home-slider-v2 .hero-actions .btn{
    width:100%;
    justify-content:center;
  }

  .home-slider-v2-dots{
    bottom:18px;
  }
}


/* =========================================================
   VERSI 3 - TENTANG EKSTRAKURIKULER
   ========================================================= */

.about-ekskul-section{
  padding:46px 0 24px;
}

.about-ekskul-card{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(37,99,235,.15);
  border-radius:28px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,251,255,.94)),
    radial-gradient(circle at 100% 0%, rgba(96,165,250,.16), transparent 36%);
  box-shadow:0 26px 70px rgba(15,39,71,.10);
  padding:46px 52px;
}

.about-ekskul-card:before{
  content:"";
  position:absolute;
  top:-90px;
  right:-90px;
  width:260px;
  height:260px;
  border-radius:50%;
  background:rgba(37,99,235,.08);
}

.about-ekskul-badge{
  position:relative;
  z-index:1;
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:10px 16px;
  border-radius:16px;
  background:rgba(239,246,255,.92);
  color:#2563eb;
  border:1px solid rgba(37,99,235,.16);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-size:13px;
  margin-bottom:16px;
}

.about-ekskul-card h2{
  position:relative;
  z-index:1;
  margin:0 0 20px;
  color:#0b2f6f;
  font-size:clamp(34px, 4vw, 56px);
  line-height:1.05;
  letter-spacing:-.045em;
}

.about-ekskul-content{
  position:relative;
  z-index:1;
  max-width:1040px;
}

.about-ekskul-content p{
  color:#24435f;
  font-size:18px;
  line-height:1.85;
  margin:0 0 18px;
}

.about-ekskul-note{
  margin-top:22px;
  padding:22px 24px;
  border-radius:20px;
  border:1px solid rgba(216,170,60,.36);
  background:linear-gradient(135deg, rgba(255,251,235,.90), rgba(255,255,255,.94));
}

.about-ekskul-note strong{
  display:block;
  color:#0b2f6f;
  font-size:18px;
  margin-bottom:8px;
}

.about-ekskul-note p{
  margin:0;
  font-style:italic;
}

@media (max-width: 900px){
  .about-ekskul-section{
    padding:34px 0 18px;
  }

  .about-ekskul-card{
    border-radius:22px;
    padding:30px 22px;
  }

  .about-ekskul-content p{
    font-size:16px;
    line-height:1.75;
  }

  .about-ekskul-note{
    border-radius:18px;
    padding:18px;
  }
}


/* =========================================================
   VERSI 5 - DESKTOP EKSTRAKURIKULER AKTIF DIPERBESAR
   Hanya tampilan desktop. Mobile tetap mengikuti desain responsive.
   ========================================================= */

@media (min-width: 901px){
  .activity-grid{
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    gap:30px !important;
    align-items:stretch !important;
    width:100% !important;
  }

  .activity-card{
    width:100% !important;
    min-height:315px !important;
    border-radius:22px !important;
    overflow:hidden !important;
    display:flex !important;
    flex-direction:column !important;
  }

  .activity-img{
    height:205px !important;
    min-height:205px !important;
  }

  .activity-img img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    display:block !important;
  }

  .activity-card .mini-icon{
    width:58px !important;
    height:58px !important;
    left:24px !important;
    bottom:-29px !important;
  }

  .activity-body{
    flex:1 !important;
    padding:42px 26px 28px !important;
  }

  .activity-body h3{
    font-size:24px !important;
    line-height:1.15 !important;
    margin-bottom:10px !important;
  }

  .activity-body p{
    font-size:16px !important;
    line-height:1.45 !important;
  }
}

/* desktop besar: dibuat lebih lapang supaya 3 kartu pas memenuhi area */
@media (min-width: 1200px){
  .activity-grid{
    gap:34px !important;
  }

  .activity-card{
    min-height:340px !important;
  }

  .activity-img{
    height:220px !important;
    min-height:220px !important;
  }
}


/* =========================================================
   VERSI 13 - ACTIVITY CARD ICON FULL + HAPUS FOTO SAMPLE
   ========================================================= */

/* Icon kategori tidak terpotong dan tampil di depan */
.activity-card{
  overflow:visible !important;
}

.activity-img{
  overflow:visible !important;
  position:relative !important;
  background:linear-gradient(135deg, rgba(239,246,255,.96), rgba(255,255,255,.98)) !important;
  border-radius:22px 22px 0 0 !important;
}

.activity-img img{
  border-radius:22px 22px 0 0 !important;
}

.activity-card .mini-icon{
  z-index:20 !important;
  bottom:-27px !important;
  box-shadow:0 12px 28px rgba(37,99,235,.24) !important;
}

/* Body kartu dibuat di bawah icon agar icon tidak tertutup */
.activity-body{
  position:relative !important;
  z-index:5 !important;
  background:#ffffff !important;
  border-radius:0 0 22px 22px !important;
}

/* Jika belum ada foto upload admin, tidak pakai foto sampel */
.activity-img.no-image{
  background:
    linear-gradient(135deg, rgba(239,246,255,.95), rgba(248,251,255,.98)),
    radial-gradient(circle at 20% 20%, rgba(37,99,235,.12), transparent 36%) !important;
}

.activity-img.no-image::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:22px 22px 0 0;
  border:1px dashed rgba(37,99,235,.22);
  background:
    linear-gradient(135deg, rgba(255,255,255,.62), rgba(239,246,255,.42));
  pointer-events:none;
}

.activity-img.no-image::after{
  content:"Foto belum diupload";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  color:rgba(11,47,111,.42);
  font-weight:700;
  font-size:14px;
  letter-spacing:.01em;
  white-space:nowrap;
}

/* Mini icon tetap paling depan di atas placeholder */
.activity-img.no-image .mini-icon{
  position:absolute !important;
}

/* Mobile: icon juga tetap utuh */
@media (max-width:900px){
  .activity-card{
    overflow:visible !important;
  }

  .activity-img{
    overflow:visible !important;
  }

  .activity-card .mini-icon{
    bottom:-24px !important;
    z-index:20 !important;
  }

  .activity-img.no-image::after{
    font-size:13px;
  }
}


/* =========================================================
   VERSI 14 - CATEGORY REMOVED FROM HOME ACTIVE CARDS
   ========================================================= */

.activity-card .mini-icon{
  display:none !important;
}

.activity-body{
  padding:28px 26px 30px !important;
}

.activity-body h3{
  margin:0 !important;
}

.activity-body p,
.activity-category,
.ekskul-category,
.catalog-category,
.category-label{
  display:none !important;
}

@media (max-width:900px){
  .activity-body{
    padding:24px 20px 26px !important;
  }
}


/* VERSI 24 - FALLBACK NORMALKAN HOME DESKTOP */
@media (min-width:901px){.hero-home-slider-v2 .hero-inner-slider-v2{width:min(1320px,calc(100% - 80px))!important;max-width:1320px!important;justify-content:flex-start!important;text-align:left!important}.hero-home-slider-v2 .hero-copy{width:min(650px,48vw)!important;max-width:650px!important;margin:0!important;padding:70px 0 88px!important;text-align:left!important}.hero-home-slider-v2 .hero-copy h1{max-width:650px!important;font-size:clamp(58px,4.75vw,76px)!important;line-height:.96!important}.site-header .container,.site-header-inner{width:min(1320px,calc(100% - 80px))!important;max-width:1320px!important}}


/* VERSI 25 - FALLBACK NORMALKAN HOME DESKTOP FULL */
@media (min-width:901px){
  .site-header .container.site-header-inner,
  .site-header-inner,
  header.site-header > .container{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:clamp(64px,7vw,112px)!important;
    padding-right:clamp(64px,7vw,112px)!important;
    box-sizing:border-box!important;
  }
  .hero-home-slider-v2 .hero-inner-slider-v2,
  .hero-home-slider-v2 .hero-inner{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:clamp(64px,7vw,112px)!important;
    padding-right:clamp(64px,7vw,112px)!important;
    box-sizing:border-box!important;
    justify-content:flex-start!important;
    text-align:left!important;
  }
  .hero-home-slider-v2 .hero-copy{
    width:min(760px,52vw)!important;
    max-width:760px!important;
    margin:0!important;
    text-align:left!important;
  }
  .hero-home-slider-v2 .hero-copy h1{
    max-width:760px!important;
    font-size:clamp(64px,5.2vw,84px)!important;
    line-height:.96!important;
  }
  .public-nav{margin-left:auto!important;}
}
.about-ekskul-card::before,
.about-ekskul-card::after{
  content:none!important;
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  background:none!important;
}
.about-ekskul-card{
  background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(248,251,255,.94))!important;
}