/* SMANJA v22.1.0 — Quote polish + institutional profile contrast. */

/* --------------------------------------------------------------------------
   PROFIL SEKOLAH — kontras, proporsi, dan emblem
   -------------------------------------------------------------------------- */
body.smanja-v221 .sj221-school-profile{
  position:relative;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 220px!important;
  gap:30px!important;
  align-items:center!important;
  padding:30px 32px!important;
  overflow:hidden;
  background:
    radial-gradient(circle at 88% 20%,rgba(18,105,176,.07),transparent 24%),
    linear-gradient(135deg,#fff 0%,#f7fbfd 58%,#eef6fa 100%)!important;
  border:1px solid #d7e6ef!important;
  box-shadow:0 16px 38px rgba(8,47,75,.08)!important;
}
body.smanja-v221 .sj221-school-profile:before{
  content:"";
  position:absolute;
  left:0;
  top:28px;
  bottom:28px;
  width:4px;
  border-radius:0 8px 8px 0;
  background:linear-gradient(#e8b93f,#0d6fa7);
}
body.smanja-v221 .sj221-school-copy{min-width:0}
body.smanja-v221 .sj221-school-profile .sj9-eyebrow{
  color:#d59f18!important;
  font-size:11px!important;
  letter-spacing:.13em!important;
}
body.smanja-v221 .sj221-school-profile h2{
  margin:7px 0 10px!important;
  color:#0a3553!important;
  font-size:clamp(28px,2.7vw,40px)!important;
  line-height:1.06!important;
  letter-spacing:-.035em!important;
  text-shadow:none!important;
}
body.smanja-v221 .sj221-school-profile .sj13-values{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:7px 9px;
  margin:0 0 6px!important;
  color:#5c7587!important;
  font-size:13px!important;
  line-height:1.55!important;
}
body.smanja-v221 .sj221-school-profile .sj13-values strong{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:4px 10px;
  border-radius:999px;
  background:#eaf4fa;
  color:#0b6398!important;
  font-size:11.5px!important;
  letter-spacing:.05em;
}
body.smanja-v221 .sj221-school-profile .sj13-values span{color:#698193!important}
body.smanja-v221 .sj221-school-lead{
  max-width:760px!important;
  margin:0 0 15px!important;
  color:#607889!important;
  font-size:14px!important;
  line-height:1.7!important;
}
body.smanja-v221 .sj221-profile-button{
  min-height:42px!important;
  padding:10px 17px!important;
  border-radius:11px!important;
  box-shadow:0 8px 18px rgba(213,159,24,.16)!important;
}
body.smanja-v221 .sj221-profile-button span{margin-left:3px}

body.smanja-v221 .sj221-school-profile .sj154-profile-points{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:9px!important;
  margin-top:17px!important;
  padding-top:16px;
  border-top:1px solid #dce8ef;
}
body.smanja-v221 .sj221-school-profile .sj154-profile-points>a{
  display:grid!important;
  grid-template-columns:34px minmax(0,1fr)!important;
  align-items:center!important;
  gap:8px!important;
  min-height:58px!important;
  padding:9px 10px!important;
  border:1px solid #e1ebf1!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.9)!important;
  color:#123e5c!important;
  box-shadow:0 6px 16px rgba(8,47,75,.04)!important;
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease!important;
}
body.smanja-v221 .sj221-school-profile .sj154-profile-points>a:hover{
  transform:translateY(-2px)!important;
  border-color:#bdd9e8!important;
  box-shadow:0 10px 22px rgba(8,47,75,.08)!important;
}
body.smanja-v221 .sj221-school-profile .sj154-profile-points i{
  display:grid!important;
  place-items:center!important;
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  border-radius:10px!important;
  background:#0d6fa7!important;
  color:#fff!important;
  font-size:13px!important;
}
body.smanja-v221 .sj221-school-profile .sj154-profile-points strong{
  display:block!important;
  overflow:visible!important;
  white-space:normal!important;
  color:#143c58!important;
  font-size:11.5px!important;
  line-height:1.25!important;
}
body.smanja-v221 .sj221-school-profile .sj154-profile-points small{
  display:block!important;
  margin-top:2px!important;
  overflow:visible!important;
  white-space:normal!important;
  color:#7a8f9e!important;
  font-size:9.5px!important;
  line-height:1.25!important;
}

body.smanja-v221 .sj221-emblem{
  position:relative;
  display:grid!important;
  place-items:center!important;
  justify-self:center!important;
  width:190px!important;
  min-height:220px!important;
  padding:18px 14px 12px!important;
  border:1px solid #d9e7ef!important;
  border-radius:24px!important;
  background:linear-gradient(180deg,#fff 0%,#edf7fb 100%)!important;
  box-shadow:0 12px 28px rgba(8,47,75,.08)!important;
}
body.smanja-v221 .sj221-emblem-halo{
  position:absolute;
  width:154px;
  height:154px;
  top:20px;
  left:50%;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(circle,#fff 10%,#e9f5fb 68%,#d8ebf5 100%);
  box-shadow:inset 0 0 0 1px rgba(13,111,167,.08);
}
body.smanja-v221 .sj221-emblem img{
  position:relative;
  z-index:1;
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:145px!important;
  max-height:145px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 8px 10px rgba(8,47,75,.10));
}
body.smanja-v221 .sj221-emblem small{
  position:relative;
  z-index:1;
  margin-top:8px;
  color:#567388;
  font-size:9px;
  font-weight:800;
  letter-spacing:.12em;
  text-align:center;
  text-transform:uppercase;
}

/* --------------------------------------------------------------------------
   INSPIRASI — sanitasi visual, author, kategori, centering 1–2 card, pager
   -------------------------------------------------------------------------- */
body.smanja-v221 .sj221-quotes{
  padding:20px!important;
  background:
    radial-gradient(circle at 93% 8%,rgba(255,214,106,.11),transparent 21%),
    linear-gradient(125deg,#073a61 0%,#0a527f 60%,#0a6d98 100%)!important;
}
body.smanja-v221 .sj221-quotes:after{top:-55px!important;right:2%!important;color:rgba(255,255,255,.045)!important}
body.smanja-v221 .sj221-quotes .sj22-quote-heading{margin-bottom:14px!important;align-items:center!important}
body.smanja-v221 .sj221-quotes .sj22-quote-heading h2{
  color:#fff!important;
  text-shadow:none!important;
  font-size:clamp(23px,2vw,30px)!important;
  line-height:1.15!important;
}
body.smanja-v221 .sj221-quotes .sj22-quote-heading p{color:rgba(255,255,255,.78)!important;font-size:12.5px!important}
body.smanja-v221 .sj22-quote-controls{align-items:center!important}
body.smanja-v221 .sj221-quote-status{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-width:46px;
  justify-content:center;
  color:rgba(255,255,255,.76);
  font-size:10.5px;
  font-style:normal;
}
body.smanja-v221 .sj221-quote-status b{color:#fff;font-size:12px}
body.smanja-v221 .sj221-quote-status em{font-style:normal;opacity:.55}

body.smanja-v221 .sj221-quotes .sj22-quote-track{gap:12px!important;align-items:stretch!important}
body.smanja-v221 .sj221-quotes.sj221-quote-count-1 .sj22-quote-track,
body.smanja-v221 .sj221-quotes.sj221-quote-count-2 .sj22-quote-track{justify-content:center!important}
body.smanja-v221 .sj221-quotes.sj221-quote-count-1 .sj22-quote-card{flex-basis:min(620px,72%)!important}
body.smanja-v221 .sj221-quotes.sj221-quote-count-2 .sj22-quote-card{flex-basis:min(430px,43%)!important}
body.smanja-v221 .sj221-quotes .sj22-quote-card{
  min-height:150px!important;
  padding:17px 18px 15px!important;
  border-color:rgba(255,255,255,.18)!important;
  border-radius:14px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.07))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
body.smanja-v221 .sj221-quote-top{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:32px}
body.smanja-v221 .sj221-quote-category{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:4px 9px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:#ffe08b;
  font-size:9.5px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
body.smanja-v221 .sj221-quotes .sj22-quote-mark{height:auto!important;font-size:38px!important;color:#ffd66a!important;opacity:.95}
body.smanja-v221 .sj221-quotes .sj22-quote-card p{
  display:flex;
  align-items:center;
  flex:1;
  margin:8px 0 12px!important;
  color:#fff!important;
  font-size:14px!important;
  line-height:1.62!important;
  font-weight:650!important;
}
body.smanja-v221 .sj221-quotes .sj22-quote-card footer{
  display:flex!important;
  align-items:center;
  gap:8px;
  min-height:20px;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:rgba(255,255,255,.76)!important;
  font-size:11px!important;
}
body.smanja-v221 .sj221-quotes .sj22-quote-card footer span{width:22px;height:2px;border-radius:5px;background:linear-gradient(90deg,#ffd66a,#5ed5e8)}
body.smanja-v221 .sj221-quotes .sj22-quote-card footer strong{color:rgba(255,255,255,.82)!important;font-weight:700!important}

body.smanja-v221 .sj221-quote-dots{display:flex;align-items:center;justify-content:center;gap:6px;min-height:18px;margin-top:10px;position:relative;z-index:2}
body.smanja-v221 .sj221-quote-dots button{width:6px;height:6px;padding:0;border:0;border-radius:999px;background:rgba(255,255,255,.30);cursor:pointer;transition:width .2s ease,background .2s ease}
body.smanja-v221 .sj221-quote-dots button.is-active{width:20px;background:#ffd66a}
body.smanja-v221 .sj221-quotes.is-static .sj22-quote-controls,
body.smanja-v221 .sj221-quotes.is-static .sj221-quote-dots{display:none!important}

@media(max-width:1100px){
  body.smanja-v221 .sj221-school-profile{grid-template-columns:minmax(0,1fr) 185px!important;gap:22px!important;padding:26px!important}
  body.smanja-v221 .sj221-emblem{width:170px!important;min-height:200px!important}
  body.smanja-v221 .sj221-emblem-halo{width:136px;height:136px}
  body.smanja-v221 .sj221-emblem img{max-width:128px!important;max-height:128px!important}
  body.smanja-v221 .sj221-school-profile .sj154-profile-points{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:767px){
  body.smanja-v221 .sj221-school-profile{grid-template-columns:1fr!important;padding:22px 20px!important;gap:20px!important}
  body.smanja-v221 .sj221-school-profile:before{top:22px;bottom:22px}
  body.smanja-v221 .sj221-emblem{grid-row:1;width:155px!important;min-height:180px!important}
  body.smanja-v221 .sj221-emblem-halo{width:122px;height:122px}
  body.smanja-v221 .sj221-emblem img{max-width:114px!important;max-height:114px!important}
  body.smanja-v221 .sj221-school-profile h2{font-size:28px!important}
  body.smanja-v221 .sj221-school-lead{font-size:13.5px!important}
  body.smanja-v221 .sj221-quotes{padding:17px!important}
  body.smanja-v221 .sj221-quotes .sj22-quote-heading{align-items:flex-start!important}
  body.smanja-v221 .sj221-quotes .sj22-quote-card,
  body.smanja-v221 .sj221-quotes.sj221-quote-count-1 .sj22-quote-card,
  body.smanja-v221 .sj221-quotes.sj221-quote-count-2 .sj22-quote-card{flex-basis:86%!important;min-height:150px!important}
}
@media(max-width:520px){
  body.smanja-v221 .sj221-school-profile .sj154-profile-points{grid-template-columns:1fr!important}
  body.smanja-v221 .sj221-school-profile .sj154-profile-points>a{min-height:54px!important}
  body.smanja-v221 .sj221-quotes .sj22-quote-heading{gap:10px!important}
  body.smanja-v221 .sj221-quotes .sj22-quote-heading h2{font-size:22px!important}
  body.smanja-v221 .sj22-quote-controls button{width:34px!important;height:34px!important}
  body.smanja-v221 .sj221-quotes .sj22-quote-card,
  body.smanja-v221 .sj221-quotes.sj221-quote-count-1 .sj22-quote-card,
  body.smanja-v221 .sj221-quotes.sj221-quote-count-2 .sj22-quote-card{flex-basis:94%!important}
}

@media(prefers-reduced-motion:reduce){
  body.smanja-v221 .sj221-school-profile .sj154-profile-points>a,
  body.smanja-v221 .sj221-quote-dots button{transition:none!important}
}
