/*
 * SMANJA v17.0.0 — Yayasan Visual Balance
 * - headline Berita Terkini dibuat lebih tinggi (16:9, masih landscape)
 * - social ribbon dipindah ke bawah Sorotan Sekolah Hari Ini
 * - sidebar ditutup dengan kartu Hubungi & Kunjungi agar tinggi kolom seimbang
 * - semua perubahan scoped ke body.smanja-v17 agar aman terhadap tema lain
 */
body.smanja-v17{
  --sj17-navy:#073552;
  --sj17-navy-2:#0b466c;
  --sj17-blue:#087bb9;
  --sj17-gold:#efbd45;
  --sj17-ink:#173f59;
  --sj17-muted:#708694;
  --sj17-line:#d9e6ed;
  --sj17-soft:#f6fafc;
  --sj17-shadow:0 12px 28px rgba(6,45,72,.08),0 2px 7px rgba(6,45,72,.04);
}

/* Top: setelah 4 shortcut langsung masuk school board. Social ribbon tidak lagi di sini. */
body.smanja-v17 .sj154-shortcuts{margin-bottom:10px!important}
body.smanja-v17 .sj154-topflow>.sj153-social-ribbon{display:none!important}

/* ======================================================================
   HEADLINE BERITA TERKINI — lebih tinggi, tetapi tidak menjadi kotak penuh.
   16:9 membuat foto terasa editorial dan mengurangi ruang kosong di halaman.
   ====================================================================== */
body.smanja-v17 .sj17-board-news{margin-top:10px!important}
body.smanja-v17.smanja-v13.smanja-v13complete.smanja-v15.smanja-v151 .sj13-board-slider.sj17-headline-slider .sj92-slides{
  aspect-ratio:16/9!important;
  min-height:0!important;
}
body.smanja-v17 .sj17-headline-slider{
  overflow:hidden!important;
  border:1px solid rgba(11,91,136,.12)!important;
  border-radius:13px!important;
  background:#e8f0f4!important;
  box-shadow:0 13px 30px rgba(7,48,76,.10)!important;
}
body.smanja-v17 .sj17-headline-slider .sj92-slide,
body.smanja-v17 .sj17-headline-slider .sj15-headline-link{height:100%!important}
body.smanja-v17 .sj17-headline-slider .sj15-headline-link{display:block!important;position:relative!important}
body.smanja-v17 .sj17-headline-slider img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}
body.smanja-v17 .sj17-headline-slider .sj15-headline-cue{
  left:10px!important;
  bottom:10px!important;
  padding:7px 11px!important;
  border:1px solid rgba(255,255,255,.7)!important;
  border-radius:9px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 6px 16px rgba(6,34,54,.12)!important;
}
body.smanja-v17 .sj17-headline-slider .sj15-headline-cue b{font-size:8px!important}

/* Sorotan dibuat sedikit lebih rapat karena slider sekarang lebih dominan. */
body.smanja-v17 .sj151-today{margin-top:10px!important;padding:12px!important}
body.smanja-v17 .sj151-today-card{min-height:84px!important}

/* ======================================================================
   SOCIAL MEDIA — pindah ke ruang di bawah Sorotan (sesuai anotasi screenshot).
   Lebih ringkas daripada versi ribbon lama supaya tidak terasa seperti banner kedua.
   ====================================================================== */
body.smanja-v17 .sj17-social-ribbon{
  grid-template-columns:minmax(230px,.92fr) minmax(0,1.85fr)!important;
  min-height:118px!important;
  margin:10px 0 0!important;
  border-radius:12px!important;
  box-shadow:var(--sj17-shadow)!important;
}
body.smanja-v17 .sj17-social-copy{padding:12px 14px!important}
body.smanja-v17 .sj17-social-copy h2{font-size:14px!important}
body.smanja-v17 .sj17-social-copy p{margin-bottom:7px!important;font-size:7.2px!important}
body.smanja-v17 .sj17-social-ribbon .sj153-social-btn{min-height:23px!important;padding:4px 7px!important;font-size:6.6px!important}
body.smanja-v17 .sj17-social-ribbon .sj153-social-handle{margin-top:6px!important;font-size:6.6px!important}
body.smanja-v17 .sj17-social-visual{min-height:112px!important}
body.smanja-v17 .sj17-social-ribbon .sj153-social-shot img{min-height:112px!important}

/* ======================================================================
   SIDEBAR — prinsip: Kepala Sekolah tetap dominan, Kalender tetap ringkas,
   lalu Hubungi & Kunjungi menjadi pengisi ruang yang fungsional.
   ====================================================================== */
@media(min-width:992px){
  body.smanja-v17 .sj17-schoolboard{
    grid-template-columns:minmax(0,2.72fr) minmax(255px,.9fr)!important;
    gap:18px!important;
    align-items:stretch!important;
  }
  body.smanja-v17 .sj17-board-sidebar{
    display:flex!important;
    flex-direction:column!important;
    gap:11px!important;
    height:100%!important;
  }
  body.smanja-v17 .sj17-principal-card{flex:1 1 auto!important;min-height:0!important}
  body.smanja-v17 .sj17-calendar-card{flex:0 0 auto!important}
  body.smanja-v17 .sj17-contact-card{flex:0 0 auto!important}
}
body.smanja-v17 .sj17-principal-card{
  padding:15px!important;
  border-radius:12px!important;
}
body.smanja-v17 .sj17-principal-card>img{
  height:168px!important;
  margin:9px 0 9px!important;
  border-radius:9px!important;
}
body.smanja-v17 .sj17-principal-card p{
  margin:9px 0 10px!important;
  font-size:8.4px!important;
  line-height:1.62!important;
  -webkit-line-clamp:11!important;
}
body.smanja-v17 .sj17-calendar-card{padding:12px 13px!important}

body.smanja-v17 .sj17-contact-card{
  padding:13px;
  overflow:hidden;
  border:1px solid var(--sj17-line);
  border-radius:12px;
  background:
    radial-gradient(circle at 100% 0%,rgba(18,139,192,.09),transparent 40%),
    linear-gradient(180deg,#fff,#f7fbfd);
  box-shadow:var(--sj17-shadow);
}
body.smanja-v17 .sj17-contact-head{display:flex;align-items:center;gap:9px}
body.smanja-v17 .sj17-contact-icon{
  display:grid;place-items:center;
  width:34px;height:34px;min-width:34px;
  border-radius:10px;
  color:#fff;
  background:linear-gradient(145deg,#0b79b4,#08486e);
  box-shadow:0 7px 15px rgba(8,86,129,.16);
}
body.smanja-v17 .sj17-contact-head .sj9-eyebrow{font-size:6.1px!important;letter-spacing:.12em!important}
body.smanja-v17 .sj17-contact-head h3{margin:2px 0 0!important;color:var(--sj17-ink)!important;font-size:12px!important;line-height:1.2!important}
body.smanja-v17 .sj17-contact-tagline{margin:9px 0 8px!important;color:#607887!important;font-size:7.2px!important;line-height:1.5!important}
body.smanja-v17 .sj17-contact-list{display:grid;gap:5px}
body.smanja-v17 .sj17-contact-list>a{
  display:grid;
  grid-template-columns:27px minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
  min-height:42px;
  padding:6px 7px;
  border:1px solid #e1ebf0;
  border-radius:8px;
  color:var(--sj17-ink)!important;
  background:rgba(255,255,255,.82);
  text-decoration:none!important;
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
body.smanja-v17 .sj17-contact-list>a:hover,
body.smanja-v17 .sj17-contact-list>a:focus-visible{transform:translateY(-1px);border-color:#b8d8e7;box-shadow:0 6px 15px rgba(8,61,91,.07);outline:0}
body.smanja-v17 .sj17-contact-list>a>i{display:grid;place-items:center;width:27px;height:27px;border-radius:8px;color:#0a75ad;background:#eaf5fa;font-size:10px}
body.smanja-v17 .sj17-contact-list span{min-width:0}
body.smanja-v17 .sj17-contact-list small{display:block;color:#7d909d;font-size:5.8px;text-transform:uppercase;letter-spacing:.08em}
body.smanja-v17 .sj17-contact-list strong{display:block;overflow:hidden;margin-top:1px;font-size:7.4px;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}
body.smanja-v17 .sj17-contact-list b{color:#8aa0ae;font-size:8px}
body.smanja-v17 .sj17-contact-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:7px}
body.smanja-v17 .sj17-contact-actions>a{display:flex;align-items:center;justify-content:center;gap:5px;min-height:29px;padding:5px;border-radius:8px;color:#fff!important;background:#0a557e;font-size:6.7px;font-weight:750;text-align:center;text-decoration:none!important}
body.smanja-v17 .sj17-contact-actions>a:last-child{color:#173e57!important;background:#edf5f8}

/* ======================================================================
   RESPONSIVE
   ====================================================================== */
@media(max-width:1199.98px){
  body.smanja-v17.smanja-v13.smanja-v13complete.smanja-v15.smanja-v151 .sj13-board-slider.sj17-headline-slider .sj92-slides{aspect-ratio:16/9.1!important}
  body.smanja-v17 .sj17-social-ribbon{grid-template-columns:minmax(215px,.95fr) minmax(0,1.55fr)!important}
  body.smanja-v17 .sj17-principal-card p{-webkit-line-clamp:9!important}
}
@media(max-width:991.98px){
  body.smanja-v17 .sj17-schoolboard{grid-template-columns:1fr!important}
  body.smanja-v17 .sj17-board-sidebar{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important}
  body.smanja-v17 .sj17-social-ribbon{grid-template-columns:1fr 1.45fr!important}
  body.smanja-v17 .sj17-principal-card p{-webkit-line-clamp:6!important}
}
@media(max-width:767.98px){
  body.smanja-v17.smanja-v13.smanja-v13complete.smanja-v15.smanja-v151 .sj13-board-slider.sj17-headline-slider .sj92-slides{aspect-ratio:16/9.6!important}
  body.smanja-v17 .sj17-headline-slider{border-radius:10px!important}
  body.smanja-v17 .sj17-social-ribbon{grid-template-columns:1fr!important;min-height:auto!important}
  body.smanja-v17 .sj17-social-visual{grid-template-columns:repeat(3,minmax(0,1fr))!important;min-height:118px!important}
  body.smanja-v17 .sj17-social-ribbon .sj153-social-shot img{min-height:118px!important}
  body.smanja-v17 .sj17-social-ribbon .sj153-social-shot-3{display:none!important}
  body.smanja-v17 .sj17-board-sidebar{grid-template-columns:1fr!important}
  body.smanja-v17 .sj17-contact-card{padding:12px}
  body.smanja-v17 .sj17-contact-list{grid-template-columns:1fr}
}
@media(max-width:480px){
  body.smanja-v17.smanja-v13.smanja-v13complete.smanja-v15.smanja-v151 .sj13-board-slider.sj17-headline-slider .sj92-slides{aspect-ratio:4/3!important}
  body.smanja-v17 .sj17-social-visual{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.smanja-v17 .sj17-social-ribbon .sj153-social-shot-2{display:none!important}
  body.smanja-v17 .sj17-contact-actions{grid-template-columns:1fr}
}

@media(prefers-reduced-motion:reduce){
  body.smanja-v17 .sj17-contact-list>a{transition:none!important}
  body.smanja-v17 .sj17-contact-list>a:hover,
  body.smanja-v17 .sj17-contact-list>a:focus-visible{transform:none!important}
}
