/* =========================
   HOME FINAL FIX
   ========================= */

/* LINK di home jangan biru & jangan underline */
.page-home a,
.page-home a:visited{
  color: inherit !important;
  text-decoration: none !important;
}

/* =========================
   HERO: tampil seperti gambar asli
   ========================= */
.page-home .home-hero{
  background: url("../img/hero-bg.jpg") center/cover no-repeat !important;
  min-height: 400px;
}
.page-home .home-hero .hero-inner{
  min-height: 300px;
  display: flex;
  align-items: center;
}
.page-home .home-hero .hero-content{
  text-shadow: 0 4px 18px rgb(0,0,0,.35);
}
.page-home .home-hero .hero-eyebrow{
  font-size: 18px;
  letter-spacing: .08em;
  opacity: .9;
}
.page-home .home-hero .hero-title{
  font-size: 44px;
  font-weight: 900;
}

/* =========================
   TILE: 1 x 0.5 (aspect 2/1)
   ========================= */
.page-home .home-tile{
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  padding: 16px 18px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.10) !important;
  aspect-ratio: 2 / 1;
  min-height: 110px;
  overflow: hidden;
  transition: transform .15s ease, box-shadow .15s ease;
}
.page-home .home-tile:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 38px rgba(0,0,0,.14) !important;
}

/* teks tile */
.page-home .tile-kicker{
  font-size: 12px;
  opacity: .75;
  margin-bottom: 2px;
}
.page-home .tile-title{
  font-size: 20px;
  font-weight: 900;
  line-height: 1.15;
}
.page-home .tile-title-sm{
  font-size: 18px;
  font-weight: 900;
  line-height: 1.15;
}
.page-home .tile-sub{
  font-size: 13px;
  opacity: .75;
}

/* tile mode row (ikon kiri, teks kanan) */
.page-home .home-tile--row{
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 14px;
}
.page-home .home-tile--row .tile-text{ min-width: 0; }

/* icon bubble OP/DL/RP/JR */
.page-home .tile-icon{
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  background: rgba(0,0,0,.06);
}

/* =========================
   WARNA tile (beda-beda)
   ========================= */
.page-home .tile-turnitin{ background: linear-gradient(135deg, #e7f8ee, #ffffff) !important; }
.page-home .tile-scholar { background: linear-gradient(135deg, #e6f4ff, #ffffff) !important; }
.page-home .tile-ref     { background: linear-gradient(135deg, #efe9ff, #ffffff) !important; }
.page-home .tile-survey  { background: linear-gradient(135deg, #fff2e0, #ffffff) !important; }

.page-home .tile-opac  { background: linear-gradient(135deg, #e7f8ee, #ffffff) !important; }
.page-home .tile-dl    { background: linear-gradient(135deg, #e6f4ff, #ffffff) !important; }
.page-home .tile-repo  { background: linear-gradient(135deg, #efe9ff, #ffffff) !important; }
.page-home .tile-jurnal{ background: linear-gradient(135deg, #fff2e0, #ffffff) !important; }

/* =========================
   Buku terbaru: 5 kolom tanpa scroll
   ========================= */
.page-home .book-strip{
  margin-top: 8px;
}
.page-home .book-strip--5{
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  overflow: hidden !important;
}

.page-home .book-card{
  border: 1px dashed rgba(0,0,0,.22);
  border-radius: 14px;
  padding: 10px;
  background: #f8fafc;
}
.page-home .book-cover{
  aspect-ratio: 3 / 4;
  border-radius: 10px;
  overflow: hidden;
  background: #e9ecef;
}
.page-home .book-cover img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.page-home .book-cover-empty{
  width: 100%;
  height: 100%;
  background: repeating-linear-gradient(
    45deg,
    rgba(0,0,0,.06),
    rgba(0,0,0,.06) 8px,
    rgba(0,0,0,.03) 8px,
    rgba(0,0,0,.03) 16px
  );
}
.page-home .book-title-mini{
  margin-top: 8px;
  font-size: 12px;
  color: #334155;
  line-height: 1.2;
  min-height: 30px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Responsive: kalau layar kecil, buku jadi 2-3 kolom */
@media (max-width: 991.98px){
  .page-home .book-strip--5{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 575.98px){
  .page-home .book-strip--5{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .page-home .hero-title{ font-size: 30px; }
}
/* =========================
   FINAL FIX: supaya tidak ketimpa
   - mepet kiri/kanan
   - tile diperkecil & grid rapat
   ========================= */

/* container home dibuat full lebar (tapi masih ada batas max) */
.page-home .home-top{
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 8px !important;
  padding-right: 8px !important;
}

/* row atas dibuat rapat */
.page-home .home-top .row.g-4{ --bs-gutter-x: 12px; --bs-gutter-y: 12px; }
.page-home .home-top .row.g-3{ --bs-gutter-x: 12px; --bs-gutter-y: 12px; }

/* tile lebih kecil agar muat 4 kolom di kiri */
.page-home .home-tile{
  padding: 12px 14px !important;
  border-radius: 16px !important;
  min-height: 96px !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.10) !important;
}

/* judul jangan terlalu besar supaya tidak meluber */
.page-home .tile-title{ font-size: 18px !important; }
.page-home .tile-title-sm{ font-size: 16px !important; }
.page-home .tile-sub{ font-size: 12px !important; }

/* icon bubble lebih kecil */
.page-home .tile-icon{
  width: 46px !important;
  height: 46px !important;
  border-radius: 14px !important;
}

/* KUNCI: kolom kanan jangan punya margin aneh, dan card jangan terlalu lebar */
.page-home .home-top .col-lg-4 .card{
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* kalau layar 1200px kebawah, turunkan jadi 2 kolom (biar tidak tabrakan) */
@media (max-width: 1199.98px){
  .page-home .home-top .col-lg-8{ flex: 0 0 auto; width: 100% !important; }
  .page-home .home-top .col-lg-4{ flex: 0 0 auto; width: 100% !important; }
}

/* =========================
   KOTAK HOME: persegi + lebih tinggi
   ========================= */
.page-home .home-tile{
  border-radius: 10px !important;     /* persegi (sudut kecil) */
  aspect-ratio: auto !important;      /* matikan rasio lama */
  height: 150px !important;           /* tinggi ditambah */
  min-height: 150px !important;
  padding: 18px 18px !important;
}

/* mode row (OPAC/DL/RP/JR) juga ikut tinggi */
.page-home .home-tile--row{
  height: 150px !important;
  min-height: 150px !important;
}

/* ikon lebih proporsional di kotak yang tinggi */
.page-home .tile-icon{
  width: 56px !important;
  height: 56px !important;
  border-radius: 10px !important;
}

/* judul biar tetap rapi */
.page-home .tile-title{ font-size: 20px !important; }
.page-home .tile-title-sm{ font-size: 18px !important; }
.page-home .tile-sub{ font-size: 13px !important; }