/* ============================================================
   single.php — artikel/berita native. Ringan, tanpa page-builder.
   Selaras dengan sistem desain harvard.edu (blocks.css / home.css):
   krimson #A51C30 dipakai HEMAT · Source Serif 4 utk heading · netral hangat.
   ============================================================ */
.uh-article,.uh-page{
  --crimson:#A51C30; --crimson-dk:#8b1526;
  --ink:#1d1d1b; --body:#33332f; --muted:#6c6c68;
  --line:#e3e0da; --paper:#fff; --paper-2:#f7f5f1;
  --serif:"Source Serif 4","Source Serif Pro",Georgia,"Times New Roman",serif;
}

/* ---- Lebar wrapper: isi penuh kolom Astra ----
   Astra membungkus konten dalam `.ast-container{display:flex}`. Tanpa lebar
   eksplisit, <main> menciut ke lebar anak terlebar (grid related 1080px) lalu
   menempel kiri → hero full-bleed (center viewport) tak sesumbu dgn kolom baca.
   width:100% memaksa <main> mengisi kolom penuh sehingga hero, isi (740px) &
   related (1080px) sama-sama center pada satu sumbu. (single.php + page.php) */
.uh-article,.uh-page{ width:100%; }

/* ---- Hero full-width (breakout dari .ast-container) ---- */
.uh-art-hero{
  position:relative; width:100vw; margin-left:calc(50% - 50vw);
  min-height:clamp(300px,42vw,460px);
  display:flex; align-items:center; justify-content:center;
  background-size:cover; background-position:center; background-color:#2a0a0a;
  padding:clamp(40px,7vw,80px) clamp(18px,5vw,40px);
  text-align:center;
}
.uh-art-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,4,4,.35),rgba(20,4,4,.72));}
.uh-art-hero--plain{background:linear-gradient(135deg,var(--crimson),#5c0000);}
.uh-art-hero--plain::before{display:none;}
.uh-art-hero-inner{position:relative;max-width:900px;}
.uh-art-cat{
  display:inline-block;color:#fff;background:var(--crimson);
  font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  padding:5px 12px;border-radius:2px;text-decoration:none;margin-bottom:18px;
}
.uh-art-cat:hover{background:var(--crimson-dk);}
.uh-art-title{
  color:#fff;font-family:var(--serif);font-weight:600;
  font-size:clamp(26px,4vw,44px);line-height:1.14;letter-spacing:-.015em;margin:0;
  text-shadow:0 2px 18px rgba(0,0,0,.35);
}
.uh-art-meta{
  margin-top:18px;color:#efe6e4;font-size:14px;
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;
}
.uh-art-meta .uh-dot{opacity:.6;}

/* ---- Isi artikel (kolom baca) ---- */
.uh-art-body{max-width:740px;margin:0 auto;padding:clamp(32px,5vw,56px) 0 8px;}
.uh-art-content{color:var(--body);font-size:18px;line-height:1.8;}
.uh-art-content > *{margin:0 0 1.25em;}
.uh-art-content p{margin:0 0 1.25em;}
.uh-art-content h2{font-family:var(--serif);color:var(--ink);font-size:27px;line-height:1.25;margin:1.6em 0 .6em;font-weight:600;letter-spacing:-.01em;}
.uh-art-content h3{font-family:var(--serif);color:var(--ink);font-size:21px;margin:1.4em 0 .5em;font-weight:600;}
.uh-art-content img{max-width:100%;height:auto;border-radius:8px;}
.uh-art-content a{color:var(--crimson);text-decoration:underline;text-underline-offset:2px;}
.uh-art-content a:hover{color:var(--crimson-dk);}
.uh-art-content blockquote{margin:1.5em 0;padding:6px 0 6px 22px;border-left:3px solid var(--crimson);color:var(--muted);font-family:var(--serif);font-style:italic;font-size:20px;line-height:1.5;}
.uh-art-content ul,.uh-art-content ol{padding-left:1.4em;}
.uh-art-content li{margin:.4em 0;}
.uh-art-content figure{margin:1.5em 0;}
.uh-art-content figcaption{font-size:14px;color:var(--muted);text-align:center;margin-top:8px;}

/* ---- Blok Gutenberg wide/full (page.php native) — breakout dari kolom baca 740px.
   Dipakai halaman non-Elementor bergaya blok, mis. Sejarah (kolom, grid rektor). ---- */
.uh-art-content .alignwide{width:min(1080px,94vw);max-width:none;margin-left:50%;transform:translateX(-50%);}
.uh-art-content .alignfull{width:100vw;max-width:none;margin-left:calc(50% - 50vw);border-radius:0;}
.uh-art-content .wp-block-columns{display:flex;gap:clamp(20px,4vw,44px);align-items:center;}
.uh-art-content .wp-block-columns.are-vertically-aligned-center{align-items:center;}
.uh-art-content .wp-block-column{margin:0;}
.uh-art-content .wp-block-group.alignwide{margin-top:1.25em;}
/* Grid rektor: 2 kolom di layar sempit (default auto-fill 200px = 1 kolom di ponsel). */
@media(max-width:600px){
  .uh-art-content .uh-rektor-grid.is-layout-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:16px !important;}
}

/* ---- Kemitraan Strategis / Strategic Partnership (30965/30979, blok Gutenberg) ---- */
.uh-art-content .uh-lead{font-family:var(--serif);font-size:clamp(19px,2.2vw,22px);line-height:1.6;color:var(--ink);}
.uh-art-content .uh-sp-intro{margin-top:clamp(28px,5vw,48px);margin-bottom:clamp(28px,5vw,48px);}
.uh-art-content .uh-sp-intro h2{margin-top:0;}
.uh-art-content .uh-sp-intro img{width:100%;aspect-ratio:4/5;object-fit:cover;}
.uh-art-content h2.uh-sp-section{text-align:center;margin-top:clamp(40px,6vw,64px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--line);}
.uh-art-content .uh-sp-cards,.uh-art-content .uh-sp-pillars{align-items:stretch;}
.uh-art-content .uh-sp-card,.uh-art-content .uh-sp-pillar{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:0 0 22px;overflow:hidden;font-size:16px;line-height:1.65;}
.uh-art-content .uh-sp-card > *,.uh-art-content .uh-sp-pillar > *{margin-left:22px;margin-right:22px;}
.uh-art-content .uh-sp-card > figure{margin:0 0 4px;}
.uh-art-content .uh-sp-card img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:0;display:block;}
.uh-art-content .uh-sp-card h3,.uh-art-content .uh-sp-pillar h3{margin-top:18px;margin-bottom:.4em;}
.uh-art-content .uh-sp-card p:last-child,.uh-art-content .uh-sp-pillar p:last-child{margin-bottom:0;}
.uh-art-content .uh-sp-pillar{background:var(--paper-2);border-color:transparent;padding-top:24px;}
.uh-art-content .uh-sp-pillar .uh-sp-icon{margin-bottom:0;margin-top:0;}
.uh-art-content .uh-sp-pillar .uh-sp-icon img{width:52px;height:52px;border-radius:0;}
.uh-art-content ul.wp-block-latest-posts.uh-sp-news{list-style:none;padding:0;margin-top:1.25em;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.uh-art-content ul.wp-block-latest-posts.uh-sp-news > li{width:auto;margin:0;display:flex;flex-direction:column;}
.uh-art-content .uh-sp-news .wp-block-latest-posts__featured-image{order:-1;margin:0 0 12px;}
.uh-art-content .uh-sp-news .wp-block-latest-posts__featured-image img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:10px;}
.uh-art-content .uh-sp-news a.wp-block-latest-posts__post-title{font-family:var(--serif);font-size:17px;line-height:1.35;font-weight:600;color:var(--ink);text-decoration:none;}
.uh-art-content .uh-sp-news a.wp-block-latest-posts__post-title:hover{color:var(--crimson);}
.uh-art-content .uh-sp-news .wp-block-latest-posts__post-date{font-size:13px;color:var(--muted);margin-top:8px;}
@media(max-width:781px){
  .uh-art-content .uh-sp-intro img{aspect-ratio:16/10;}
  .uh-art-content ul.wp-block-latest-posts.uh-sp-news{grid-template-columns:1fr;gap:20px;}
}

/* ---- Share ---- */
.uh-art-share{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;
  margin-top:36px;padding-top:22px;border-top:1px solid var(--line);
}
.uh-share-lbl{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-right:4px;}
.uh-art-share a,.uh-art-share .uh-copy{
  font-size:14px;font-weight:500;color:var(--ink);background:var(--paper-2);border:1px solid var(--line);cursor:pointer;
  padding:8px 15px;border-radius:20px;text-decoration:none;transition:background .15s,color .15s,border-color .15s;
}
.uh-art-share a:hover,.uh-art-share .uh-copy:hover{background:var(--crimson);border-color:var(--crimson);color:#fff;}

/* ---- Related news ---- */
.uh-related{max-width:1080px;margin:clamp(40px,6vw,72px) auto 0;padding:clamp(28px,4vw,40px) clamp(0px,2vw,20px) 0;border-top:1px solid var(--line);}
.uh-related-h{font-family:var(--serif);font-size:24px;font-weight:600;margin:0 0 22px;color:var(--ink);letter-spacing:-.01em;}
.uh-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.uh-rcard{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);}
.uh-rthumb{display:block;aspect-ratio:16/10;background:#eee7e2 center/cover no-repeat;border-radius:10px;margin-bottom:12px;}
.uh-rtitle{font-family:var(--serif);font-size:17px;line-height:1.35;font-weight:600;transition:color .15s;}
.uh-rcard:hover .uh-rtitle{color:var(--crimson);}
.uh-rdate{font-size:13px;color:var(--muted);margin-top:8px;}

@media(max-width:760px){
  .uh-related-grid{grid-template-columns:1fr;gap:20px;}
  .uh-rcard{flex-direction:row;gap:14px;align-items:flex-start;}
  .uh-rthumb{width:120px;flex:none;aspect-ratio:1/1;margin-bottom:0;}
  .uh-art-content{font-size:17px;}
  /* Gutter sisi di layar sempit — cegah teks, gambar, tombol share & kartu
     related menempel tepi layar. Hero punya padding sendiri, jadi dikecualikan. */
  .uh-art-body{padding-left:18px;padding-right:18px;}
  .uh-related{padding-left:18px;padding-right:18px;}
}

/* ---- Struktur Organisasi / Organisational Structure (58214/45798, blok Gutenberg) ----
   Bagan (gambar) + direktori kartu unit. Tiap kartu .uh-org-unit membawa kelas
   uh-hs-X-Y (persen×10) → assets/org-chart.js memasang hotspot di atas bagan
   (desktop). Di layar sempit hotspot disembunyikan; direktori kartu yg dipakai. */
.uh-art-content .uh-org-ref{font-size:16px;line-height:1.65;color:var(--muted);background:var(--paper-2);border-left:3px solid var(--crimson);padding:14px 18px;border-radius:0 8px 8px 0;}
.uh-art-content .uh-org-ref strong{color:var(--ink);}
.uh-art-content .uh-org-chart{margin-top:clamp(24px,4vw,40px);}
.uh-art-content .uh-org-chart > *{margin-top:0;margin-bottom:0;}
.uh-art-content .uh-org-chart figure{margin:0;position:relative;}
.uh-art-content .uh-org-chart img{display:block;width:100%;border-radius:0;}
.uh-art-content .uh-org-hint,.uh-art-content .uh-org-full{font-size:14px;color:var(--muted);text-align:center;margin-top:10px !important;}
.uh-art-content .uh-org-hint{display:none;}
.uh-org-has-hs ~ .uh-org-hint{display:block;}
.uh-org-hotspots{position:absolute;inset:0;}
.uh-org-dot{position:absolute;width:5.6%;height:4.2%;transform:translate(-50%,-50%);padding:0;margin:0;border:2px solid transparent;border-radius:6px;background:transparent;cursor:pointer;transition:border-color .15s,background .15s;}
.uh-org-dot::after{content:"";position:absolute;top:-5px;right:-5px;width:10px;height:10px;border-radius:50%;background:var(--crimson);box-shadow:0 0 0 2px #fff;}
.uh-org-dot:hover,.uh-org-dot:focus-visible,.uh-org-dot[aria-expanded="true"]{border-color:var(--crimson);background:rgba(165,28,48,.08);outline:none;}
.uh-org-pop{position:absolute;z-index:5;width:290px;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--crimson);border-radius:8px;box-shadow:0 12px 32px rgba(0,0,0,.16);padding:14px 16px;font-size:15px;line-height:1.5;text-align:left;transform:translate(24px,-24px);}
.uh-org-pop.is-left{transform:translate(calc(-100% - 24px),-24px);}
.uh-org-pop.is-up{transform:translate(24px,calc(-100% + 24px));}
.uh-org-pop.is-left.is-up{transform:translate(calc(-100% - 24px),calc(-100% + 24px));}
.uh-org-pop > *{margin:0 0 4px !important;}
.uh-org-pop > :last-child{margin-bottom:0 !important;}
.uh-art-content .uh-org-directory{margin-top:clamp(40px,6vw,64px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--line);}
.uh-art-content .uh-org-directory > h2{margin-top:0;}
.uh-art-content .uh-org-section{margin-top:clamp(24px,3vw,36px);}
.uh-art-content .uh-org-section > h3{margin:0 0 14px;font-size:19px;}
.uh-art-content .uh-org-units.is-layout-grid{gap:14px;}
.uh-art-content .uh-org-units > .uh-org-unit{margin:0;margin-block-start:0;}
.uh-art-content .uh-org-unit{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:14px 16px;font-size:15px;line-height:1.5;}
.uh-art-content .uh-org-unit > *{margin:0 0 4px;}
.uh-art-content .uh-org-unit > :last-child{margin-bottom:0;}
.uh-org-unit__name,.uh-org-pop .uh-org-unit__name{font-family:var(--serif);font-size:16px !important;line-height:1.35;font-weight:600;color:var(--ink);margin:0 0 6px !important;}
.uh-org-unit__role{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);}
.uh-org-unit__person{color:var(--ink);}
.uh-org-unit__link{font-size:14px;}
.uh-org-unit__link a{color:var(--crimson);word-break:break-word;}
@media(max-width:899px){
  .uh-org-hotspots{display:none;}
  .uh-org-has-hs ~ .uh-org-hint{display:none;}
}