/* ---- studios.html — page-specific styles (kept out of styles.css) ---- */

/* nav: mark Studios as the active link on this page */
.nav__links a.is-active{color:var(--blue)}

/* ---- studios hero ---- */
.studios-hero{max-width:var(--maxw);margin:0 auto;padding-top:clamp(2rem,4vw,3.5rem);padding-bottom:0;text-align:center}
.studios-hero .eyebrow{display:block;margin-bottom:1rem}
.studios-hero h1{font-size:clamp(2.6rem,5.5vw,4.4rem);max-width:20ch;margin:0 auto 1.2rem}
.studios-hero p{font-size:1.1rem;max-width:60ch;margin:0 auto}

/* ---- city hub grid ---- */
.city-hub{background:#fff}
.city-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem 1.4rem}
.city-card{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff;transition:box-shadow .2s ease,transform .2s ease}
.city-card:hover{box-shadow:0 20px 44px -28px rgba(30,25,15,.45);transform:translateY(-2px)}
.city-card__img{aspect-ratio:4/3;overflow:hidden}
.city-card__img img{width:100%;height:100%;object-fit:cover;display:block}
.city-card__body{padding:1.4rem 1.5rem 1.6rem}
.city-card__body h3{font-family:var(--serif);color:var(--gold);font-weight:600;font-size:1.3rem;margin-bottom:.3rem}
.city-card__body p{color:var(--muted);font-size:.95rem;margin-bottom:.8rem}

/* ---- responsive ---- */
@media(max-width:900px){
  .city-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .city-grid{grid-template-columns:1fr}
}