/* bespoke design for mia-dong-beranda-suri — archetype B split hero, cobalt blue, impact font, layout row */
.pg-mia{
  --accent:hsl(210,65%,45%);
  --accent-light:hsl(210,65%,64%);
  --primary-dark:#ffffff;
  --bg-alt:hsl(210,45%,96%);
  --line:hsl(210,45%,87%);
  --accent-text:hsl(210,70%,32%);
  font-family:'Pretendard','Noto Sans KR',-apple-system,BlinkMacSystemFont,sans-serif;
}
.pg-mia h1,.pg-mia .mia-hero-left h1{font-family:'Black Han Sans','Pretendard',sans-serif;font-weight:400;letter-spacing:0}
.pg-mia h2,.pg-mia h3{font-weight:700;letter-spacing:-.02em}
.pg-mia .mia-hero{background:linear-gradient(135deg,hsl(210,60%,20%),hsl(210,65%,32%))}
.pg-mia .mia-hero-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;padding:64px 20px}
.pg-mia .mia-crumb{padding:0 0 18px;color:rgba(255,255,255,.65)}
.pg-mia .mia-crumb a{color:rgba(255,255,255,.65)}
.pg-mia .mia-crumb .sep{color:rgba(255,255,255,.35)}
.pg-mia .mia-hero-left h1{font-size:clamp(2rem,4vw,3rem);color:#fff;margin:0 0 16px}
.pg-mia .mia-hero-left p{color:rgba(255,255,255,.82);max-width:480px;margin-bottom:26px}
.pg-mia .mia-cta{display:flex;gap:12px;flex-wrap:wrap}
.pg-mia .btn{border-radius:6px}
.pg-mia .btn-outline{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.5)}
.pg-mia .btn-outline:hover{background:rgba(255,255,255,.12)}
.pg-mia .mia-hero-right{border-radius:10px;overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:3/4;max-width:360px;margin:0 auto;border:4px solid rgba(255,255,255,.15)}
.pg-mia .mia-hero-right img{width:100%;height:100%;object-fit:cover;display:block}
.pg-mia .section-eyebrow{color:var(--accent-text)}
.pg-mia .related-card .rc-tag{color:var(--accent-text)}
.pg-mia .info-card{border-radius:10px;box-shadow:var(--shadow)}
.pg-mia .ba-set{border-radius:10px}
.pg-mia .related-card{border-radius:10px}
.pg-mia .ba-sets{flex-direction:row;justify-content:center;flex-wrap:wrap;gap:20px}
.pg-mia .ba-set{display:contents}
@media(max-width:760px){
  .pg-mia .mia-hero-inner{grid-template-columns:1fr;padding:36px 20px;gap:28px}
  .pg-mia .mia-hero-right{max-width:280px}
}
@media(max-width:520px){
  .pg-mia .ba-sets{flex-direction:column}
  .pg-mia .ba-set{display:grid}
}