/* HERO
   Satu block view di region content, TANPA region baru di theme Bion.
   Kolom kiri = views header (teks, tombol, angka statistik).
   Kolom kanan = rows, yaitu Content > Hero Slide, dislide pakai Slick
   optionset tammia_hero (fade, autoplay 5 detik, panah, dot).
   Views footer = lapisan yang ditumpuk di atas kolom kanan. Dulu isinya pill
   "Editor's Pick · 2026", dihapus atas permintaan Aditya lewat Views UI, jadi
   footernya sekarang kosong. Aturan CSS-nya sengaja ditinggal sebagai kaitan:
   kalau suatu saat Marshella menambah label lagi lewat Views footer, posisinya
   langsung benar tanpa menyentuh CSS.
   Nilai 1:1 dari drupal-theme/tammia/css/style.css bagian .hero. */

/* JANGAN pasang overflow:hidden di blok ini. Isinya diberi margin -8px untuk
   membatalkan padding .region-content, jadi overflow:hidden akan memotong 8px
   di kiri dan kanan dan huruf pertama tiap baris hilang. */
#block-tammia-theme-views-block-hero-showcase-block-1 { padding:80px 0 100px; position:relative; display:block; }

#block-tammia-theme-views-block-hero-showcase-block-1 .view-hero-showcase {
  width:auto; max-width:none;
  margin-left:-8px; margin-right:-8px; padding-left:0; padding-right:0;
  display:grid; grid-template-columns:1fr 1fr; column-gap:3rem; align-items:center;
}
#block-tammia-theme-views-block-hero-showcase-block-1 .view-header { grid-column:1; grid-row:1; }
#block-tammia-theme-views-block-hero-showcase-block-1 .view-content { grid-column:2; grid-row:1; }
#block-tammia-theme-views-block-hero-showcase-block-1 .view-footer { grid-column:2; grid-row:1; position:relative; align-self:start; z-index:4; pointer-events:none; }

/* ---- Kolom kiri ---- */
.hero-eyebrow {
  font-family:"Comfortaa","Poppins",sans-serif; font-weight:500; font-size:11px;
  letter-spacing:.22em; text-transform:uppercase; color:#e11d25;
  margin-bottom:24px; display:inline-flex; align-items:center; gap:10px;
}
.hero-eyebrow::before { content:""; width:24px; height:1px; background:#e11d25; }
#block-tammia-theme-views-block-hero-showcase-block-1 h1.hero-title {
  font-family:"Comfortaa","Poppins",sans-serif !important;
  font-size:clamp(2.5rem,5vw,4.6rem) !important; font-weight:300 !important;
  line-height:1.02 !important; letter-spacing:-.025em !important;
  margin:0 0 28px !important; color:#1a1a1a !important; text-transform:none !important;
}
#block-tammia-theme-views-block-hero-showcase-block-1 h1.hero-title em { font-style:italic; font-weight:400; color:#e11d25; }
.hero-sub { font-size:17px; color:#414042; max-width:480px; margin-bottom:36px; line-height:1.6; }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; }
#block-tammia-theme-views-block-hero-showcase-block-1 .hero-actions .btn {
  font-family:"Poppins",sans-serif; font-weight:500; font-size:15px;
  padding:18px 36px; border-radius:999px; text-decoration:none;
  display:inline-flex; align-items:center; gap:8px;
  transition:all .3s cubic-bezier(.2,.8,.2,1);
}
#block-tammia-theme-views-block-hero-showcase-block-1 .hero-actions .btn-peach { background:#e11d25; color:#fff; border:none; }
#block-tammia-theme-views-block-hero-showcase-block-1 .hero-actions .btn-peach:hover { background:#1a1a1a; color:#fff; transform:translateY(-2px); box-shadow:0 10px 24px rgba(26,26,26,0.18); }
#block-tammia-theme-views-block-hero-showcase-block-1 .hero-actions .btn-outline-ink { background:transparent; color:#1a1a1a; border:1.5px solid #1a1a1a; }
#block-tammia-theme-views-block-hero-showcase-block-1 .hero-actions .btn-outline-ink:hover { background:#1a1a1a; color:#fff; transform:translateY(-4px); }
.hero-meta { display:flex; gap:36px; margin-top:60px; flex-wrap:wrap; }
.hero-meta-item .num { font-family:"Comfortaa","Poppins",sans-serif; font-size:36px; font-weight:400; display:block; line-height:1; color:#1a1a1a; }
.hero-meta-item .lbl { font-family:"JetBrains Mono",monospace; font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:#414042; margin-top:6px; display:block; }

/* ---- Kolom kanan: view-content jadi .hero-visual ---- */
#block-tammia-theme-views-block-hero-showcase-block-1 .view-content {
  position:relative; aspect-ratio:4/5; border-radius:40px; overflow:hidden;
  background:linear-gradient(160deg,#efedea 0%,#f7dedf 50%,#e6cfa0 100%);
  box-shadow:0 20px 60px -20px rgba(225,29,37,.26);
}
#block-tammia-theme-views-block-hero-showcase-block-1 .view-content .slick,
#block-tammia-theme-views-block-hero-showcase-block-1 .slick__slider,
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-list,
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-track,
#block-tammia-theme-views-block-hero-showcase-block-1 .slick__slide,
#block-tammia-theme-views-block-hero-showcase-block-1 .slick__slide > div,
#block-tammia-theme-views-block-hero-showcase-block-1 .views-field-nothing,
#block-tammia-theme-views-block-hero-showcase-block-1 .views-field-nothing .field-content { height:100%; }
#block-tammia-theme-views-block-hero-showcase-block-1 .slick__slide { position:relative; }
#block-tammia-theme-views-block-hero-showcase-block-1 .hero-slide { height:100%; }
#block-tammia-theme-views-block-hero-showcase-block-1 .hero-slide img { width:100%; height:100%; object-fit:cover; display:block; }

#block-tammia-theme-views-block-hero-showcase-block-1 .hero-tag {
  position:absolute; top:24px; left:24px; z-index:4;
  background:rgba(255,255,255,0.85); backdrop-filter:blur(6px);
  border-radius:999px; padding:8px 14px;
  font-family:"JetBrains Mono",monospace; font-size:10px;
  letter-spacing:.16em; text-transform:uppercase; font-weight:500; color:#1a1a1a;
}

/* ---- Panah dan dot Slick, disamakan dengan template ---- */
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-prev,
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-next {
  position:absolute; top:50%; transform:translateY(-50%);
  width:40px; height:40px; border-radius:999px; border:none;
  background:rgba(255,255,255,0.85); color:#1a1a1a; font-size:0;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; z-index:5; opacity:0; transition:opacity .25s ease;
}
#block-tammia-theme-views-block-hero-showcase-block-1 .view-content:hover .slick-prev,
#block-tammia-theme-views-block-hero-showcase-block-1 .view-content:hover .slick-next { opacity:1; }
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-prev { left:12px; }
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-next { right:12px; }
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-prev::before,
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-next::before {
  font-family:"bootstrap-icons"; font-size:18px; color:#1a1a1a; opacity:1; line-height:1;
}
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-prev::before { content:"\f284"; }
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-next::before { content:"\f285"; }
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-dots {
  position:absolute; bottom:16px; left:0; right:0; margin:0; padding:0;
  display:flex; gap:8px; justify-content:center; z-index:5; list-style:none;
}
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-dots li { margin:0; width:auto; height:auto; }
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-dots li button {
  width:8px; height:8px; border-radius:999px; border:none; padding:0;
  background:rgba(255,255,255,0.55); cursor:pointer; transition:all .25s ease; font-size:0;
}
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-dots li button::before { display:none; }
#block-tammia-theme-views-block-hero-showcase-block-1 .slick-dots li.slick-active button { background:#fff; width:22px; }

/* ---- SEMENTARA: sembunyikan SELURUH salinan template di body node 19 ----
   Ketujuh section di body itu sekarang sudah punya block pengganti masing-masing
   (banner, hero, kategori, new arrivals, FAQ, trust badge, testimonial), jadi
   semuanya kembar. Aturan ini menggantikan aturan per-section yang ada di
   injector kategori dan new arrivals, keduanya jadi mubazir tapi tidak berbahaya.
   Dibatasi .path-frontpage supaya isi halaman lain tidak ikut hilang.
   Hapus begitu body node 19 benar-benar dikosongkan.
   JANGAN kosongkan lewat CKEditor: round-trip menghapus 14 ikon Bootstrap dan
   menulis ulang seluruh anchor. Lihat 06-panduan-admin.md. */
.path-frontpage #block-tammia-theme-content .field--name-body { display:none !important; }

/* ---- Responsif ---- */
@media (max-width:991px){
  #block-tammia-theme-views-block-hero-showcase-block-1 .view-hero-showcase { grid-template-columns:1fr; row-gap:3rem; }
  #block-tammia-theme-views-block-hero-showcase-block-1 .view-header { grid-column:1; grid-row:1; }
  #block-tammia-theme-views-block-hero-showcase-block-1 .view-content { grid-column:1; grid-row:2; }
  #block-tammia-theme-views-block-hero-showcase-block-1 .view-footer { grid-column:1; grid-row:2; }
  #block-tammia-theme-views-block-hero-showcase-block-1 .slick-prev,
  #block-tammia-theme-views-block-hero-showcase-block-1 .slick-next { opacity:1; }
}
@media (max-width:575px){
  #block-tammia-theme-views-block-hero-showcase-block-1 { padding:40px 0 60px; }
  .hero-meta { gap:18px; }
  .hero-meta-item .num { font-size:28px; }
  #block-tammia-theme-views-block-hero-showcase-block-1 .hero-actions .btn { width:100%; justify-content:center; }
}