/* v2 — театр: тёмный бархат, золото, читаемый текст, аккуратные сетки */
:root{
  --bg:#0d0a0b;        /* бархат */
  --bg-soft:#151115;
  --fg:#e9e6e3;        /* текст */
  --muted:#b9b2aa;
  --gold:#c6a664;      /* акценты */
  --gold-2:#e2c888;
  --link:#d9b66f;
  --danger:#b85c5a;
  --maxw:1100px;
  --radius:14px;
  --shadow:0 8px 30px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; color:var(--fg); background:radial-gradient(1200px 800px at 30% -10%, #1a1418 0%, var(--bg) 60%);
  font:16px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, "PT Sans", Arial, sans-serif;
  text-rendering:optimizeLegibility; -webkit-font-smoothing:antialiased;
}
a{color:var(--link); text-decoration:none}
a:hover{color:var(--gold-2); text-decoration:underline}
img{max-width:100%; height:auto; display:block}

/* контейнер */
.container{width:100%; max-width:var(--maxw); margin:0 auto; padding:0 20px}

/* шапка */
header{
  position:sticky; top:0; z-index:50; backdrop-filter:saturate(140%) blur(6px);
  background:linear-gradient(180deg, rgba(10,8,10,.9), rgba(10,8,10,.65));
  border-bottom:1px solid rgba(198,166,100,.18)
}
.nav{display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:64px}
.brand{display:flex; align-items:center; gap:14px; font-weight:700; letter-spacing:.3px}
.brand .logo{
  width:38px; height:38px; border-radius:50%;
  background:radial-gradient(circle at 30% 30%, var(--gold-2), var(--gold) 60%, #7a6232 100%);
  box-shadow:0 0 0 2px rgba(198,166,100,.25), inset 0 0 12px rgba(0,0,0,.4)
}
.brand span{font-size:18px}
.menu{display:flex; gap:18px; flex-wrap:wrap}
.menu a{
  padding:10px 12px; border-radius:10px; transition:.2s ease;
}
.menu a[aria-current="page"], .menu a:hover{
  background:rgba(198,166,100,.12); color:#fff; text-decoration:none
}

/* герой-блок */
.hero{position:relative; overflow:hidden; border-bottom:1px solid rgba(198,166,100,.14)}
.hero .wrap{display:grid; grid-template-columns:1.1fr .9fr; gap:28px; align-items:center; padding:48px 0}
.hero h1{
  margin:0 0 10px; font-size:44px; line-height:1.1; letter-spacing:.2px;
  font-weight:800; background:linear-gradient(180deg, #fff, #e9e6e3 65%, #cbbba0);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.hero p{margin:0 0 16px; color:var(--muted); font-size:18px}
.badges{display:flex; gap:10px; flex-wrap:wrap; margin:14px 0 0}
.badges span{
  border:1px solid rgba(198,166,100,.28); color:#f5f2ee; padding:6px 10px; border-radius:999px;
  background:linear-gradient(180deg, rgba(198,166,100,.10), rgba(198,166,100,.03))
}
.cta{display:flex; gap:12px; margin-top:18px}
.btn{
  display:inline-flex; align-items:center; gap:10px; padding:12px 16px; border-radius:12px; font-weight:600;
  border:1px solid rgba(198,166,100,.35); background:linear-gradient(180deg, rgba(198,166,100,.22), rgba(198,166,100,.10));
  color:#1b120d
}
.btn:hover{filter:brightness(1.05)}
.btn.ghost{background:none; color:var(--fg); border-color:rgba(198,166,100,.25)}

/* секции */
section{padding:48px 0; border-bottom:1px solid rgba(198,166,100,.10)}
section h2{
  margin:0 0 18px; font-size:28px; letter-spacing:.2px; font-weight:800;
  border-left:4px solid var(--gold); padding-left:12px
}
.lead{color:var(--muted); margin:0 0 24px}

/* карточки сетки (театр/кино/пресса/проекты) */
.grid{display:grid; gap:18px}
.grid.cards{grid-template-columns:repeat(auto-fill, minmax(240px,1fr))}
.card{
  background:linear-gradient(180deg, var(--bg-soft), #0e0b0e);
  border:1px solid rgba(198,166,100,.18);
  border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow)
}
.card img{aspect-ratio:4/3; object-fit:cover}
.card .body{padding:14px 14px 16px}
.card .body h3{margin:0 0 6px; font-size:18px}
.meta{color:#a89f95; font-size:14px}

/* Галерея */
.gallery{display:grid; grid-template-columns:repeat(auto-fill, minmax(180px,1fr)); gap:12px}
.gallery a{position:relative; border-radius:12px; overflow:hidden; border:1px solid rgba(198,166,100,.18)}
.gallery img{width:100%; height:100%; object-fit:cover; transition:transform .25s ease}
.gallery a:after{
  content:""; position:absolute; inset:0; box-shadow:inset 0 0 0 1px rgba(255,255,255,.06), inset 0 -80px 80px rgba(0,0,0,.35)
}
.gallery a:hover img{transform:scale(1.04)}

/* медиа-блоки (видео/пресса) */
.media-list{display:grid; gap:16px}
.media{
  display:grid; gap:14px; grid-template-columns:160px 1fr; align-items:center;
  background:linear-gradient(180deg, var(--bg-soft), #0e0b0e);
  border:1px solid rgba(198,166,100,.18); border-radius:var(--radius); padding:12px
}
.media .thumb{aspect-ratio:16/9; overflow:hidden; border-radius:10px}
.media .thumb iframe, .media .thumb img{width:100%; height:100%}
.media h3{margin:0 0 4px; font-size:18px}
.media p{margin:0; color:var(--muted); font-size:15px}

/* контакты */
.contact{
  display:grid; gap:16px; grid-template-columns:1fr 1fr;
  background:linear-gradient(180deg, var(--bg-soft), #0e0b0e);
  border:1px solid rgba(198,166,100,.18); border-radius:var(--radius); padding:18px
}
.contact a{word-break:break-all}

/* подвал */
footer{color:#a89f95; padding:28px 0 40px; text-align:center}
footer .links{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:8px}
small, .small{font-size:13px; color:#9c948b}

/* адаптив */
@media (max-width: 920px){
  .hero .wrap{grid-template-columns:1fr; padding:34px 0}
  .media{grid-template-columns:1fr}
  .contact{grid-template-columns:1fr}
  .menu{display:none}
  .menu.open{display:flex; flex-direction:column; padding:10px 0}
  .nav .burger{display:inline-flex}
}
@media (min-width: 921px){ .nav .burger{display:none} }