/* ==========================================================================
   А-Линия — стиль сайта
   Основа — логотип студии: тёмно-синее поле, золотой градиент знака,
   жёсткая чёрная тень со сдвигом, наклонные грани буквы «А» и линия,
   которая выходит из знака к краю. Эта линия и наклон — сквозные мотивы.
   ========================================================================== */

/* ---------- шрифт ---------- */
@font-face{
  font-family:Manrope;font-style:normal;font-weight:200 800;font-display:swap;
  src:url(/fonts/manrope-cyrillic-ext.woff2) format("woff2");
  unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}
@font-face{
  font-family:Manrope;font-style:normal;font-weight:200 800;font-display:swap;
  src:url(/fonts/manrope-cyrillic.woff2) format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:Manrope;font-style:normal;font-weight:200 800;font-display:swap;
  src:url(/fonts/manrope-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:Manrope;font-style:normal;font-weight:200 800;font-display:swap;
  src:url(/fonts/manrope-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* ---------- токены ---------- */
:root{
  --navy:#1B1F2B;
  --navy-deep:#141720;
  --navy-raise:#212636;
  --line:#353C52;
  --gold:#EBAE55;
  --gold-hi:#F2CF85;
  --gold-lo:#C27D16;
  /* градиент снят с логотипа: светлое золото → янтарь → бронза → блик */
  --grad:linear-gradient(90deg,#F2CF85 0%,#F2CF85 13%,#F3B353 28%,#C27D16 71%,#C27D16 81%,#F1C42A 100%);
  --text:#F5F2EA;
  --muted:#B7BDCB;
  --dim:#9299AB;
  --wrap:1200px;
  --gut:clamp(18px,4vw,44px);
  --topbar:38px;
  --bar:72px;
  --header:calc(var(--topbar) + var(--bar));
  --skew:-18deg;
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ---------- основа ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header) + 16px)}
body{
  margin:0;background:var(--navy);color:var(--text);
  font:400 1.0625rem/1.65 Manrope,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;
}
img,svg,picture,iframe{display:block;max-width:100%}
img{height:auto}
h1,h2,h3,p,ul,ol,dl,dd,figure,address{margin:0}
ul,ol{padding:0;list-style:none}
address{font-style:normal}
a{color:var(--gold);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{color:var(--gold-hi)}
strong,b{font-weight:700}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
::selection{background:var(--gold);color:var(--navy-deep)}

.wrap{width:min(100% - var(--gut)*2,var(--wrap));margin-inline:auto}
.nw{white-space:nowrap}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 16px;background:var(--gold);color:var(--navy-deep);font-weight:700;text-decoration:none}
.skip:focus{top:12px}

/* ---------- типографика ---------- */
.h1,.h2{font-weight:800;text-transform:uppercase;letter-spacing:-.005em;text-wrap:balance}
.h1{font-size:clamp(1.72rem,5.6vw + .1rem,3.35rem);line-height:1.04}
.h1--page{font-size:clamp(1.55rem,4vw + .2rem,2.6rem);line-height:1.08}
.h1--doc{font-size:clamp(1.3rem,3vw + .2rem,2rem)}
.h2{font-size:clamp(1.35rem,2.6vw + .3rem,2.15rem);line-height:1.12}
.h1 strong,.gold-text,.price__value,.facts dt,.card__num,.fit__num{
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800;
}

/* Надзаголовок: подпись и «линия», уходящая вправо */
.eyebrow{
  display:flex;align-items:center;gap:16px;margin-bottom:18px;
  color:var(--gold);font-size:.76rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
}
.eyebrow::after{content:"";flex:1;height:2px;min-width:32px;background:linear-gradient(90deg,var(--gold-lo),rgba(194,125,22,0))}

.head{margin-bottom:clamp(28px,4vw,48px)}
.head__lead{max-width:62ch;margin-top:16px;color:var(--muted)}

.link-arrow{
  display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:.86rem;
  letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--gold);
}
.link-arrow::after{content:"";width:28px;height:2px;background:currentColor;transition:width .25s var(--ease)}
.link-arrow:hover::after{width:44px}

/* ---------- кнопка: наклонная золотая плашка с жёсткой тенью ---------- */
.btn{
  position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;
  min-height:54px;padding:10px 34px;border:0;background:none;cursor:pointer;text-align:center;line-height:1.25;
  color:#15171E;font-size:.86rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;text-decoration:none;
  transition:transform .18s var(--ease);
}
.btn::before,.btn::after{content:"";position:absolute;inset:0;transform:skewX(var(--skew));transition:transform .18s var(--ease),filter .18s}
.btn::before{z-index:-1;background:var(--grad)}
.btn::after{z-index:-2;background:#000;transform:skewX(var(--skew)) translate(6px,6px)}
.btn:hover{color:#15171E;transform:translate(-2px,-2px)}
.btn:hover::before{filter:brightness(1.08)}
.btn:hover::after{transform:skewX(var(--skew)) translate(8px,8px)}
.btn:active{transform:translate(3px,3px)}
.btn:active::after{transform:skewX(var(--skew)) translate(3px,3px)}
.btn[disabled]{cursor:progress;opacity:.7}
.btn--sm{min-height:42px;padding:6px 22px;font-size:.76rem}
.btn--sm::after{transform:skewX(var(--skew)) translate(4px,4px)}
.btn--ghost{color:var(--gold-hi)}
.btn--ghost:hover{color:var(--gold-hi)}
.btn--ghost::before{background:var(--navy);box-shadow:inset 0 0 0 2px var(--gold)}

/* ---------- шапка ---------- */
.header{
  position:sticky;top:0;z-index:50;
  background:rgba(20,23,32,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.07);
}
.topbar{height:var(--topbar);border-bottom:1px solid rgba(255,255,255,.07);background:rgba(10,12,18,.55);font-size:.82rem}
.topbar__in{display:flex;align-items:center;justify-content:space-between;gap:20px;height:100%}
.topbar__place{color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.contact-bar{display:flex;align-items:center;gap:16px;margin-left:auto}
.tel{display:inline-flex;align-items:center;gap:8px;color:var(--gold-hi);font-weight:800;font-variant-numeric:tabular-nums;text-decoration:none;white-space:nowrap}
.tel:hover{color:#fff}
.tel svg{width:15px;height:15px}
.social{display:flex;gap:8px}
.social a{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:28px;height:26px;padding:0 6px;
  border:1px solid var(--line);color:var(--text);text-decoration:none;
  font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;transition:background .2s,color .2s,border-color .2s;
}
.social a:hover{background:var(--gold);border-color:var(--gold);color:#15171E}
.social svg{width:15px;height:15px}
.header__in{display:flex;align-items:center;gap:28px;height:var(--bar)}
/* На широком экране телефон и мессенджеры стоят в одном ряду с меню, справа от кнопки;
   там, где в один ряд не помещается, они уходят в строку над шапкой. */
.contact-bar--side{display:none}
@media (min-width:1680px){
  :root{--topbar:0px}
  .topbar{display:none}
  .header > .wrap{width:min(100% - var(--gut)*2,1640px)}
  .contact-bar--side{display:flex;margin-left:0}
  .contact-bar--side .tel{font-size:.9rem}
}
.logo{flex:none;display:block;line-height:0}
.logo img{width:auto;height:47px}
.nav{margin-left:auto}
.nav ul{display:flex;gap:clamp(12px,1.5vw,24px)}
.nav a{
  position:relative;display:block;padding:8px 0;color:var(--text);
  font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;white-space:nowrap;
}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:2px;height:2px;background:var(--grad);transition:right .25s var(--ease)}
.nav a:hover,.nav a[aria-current]{color:var(--gold-hi)}
.nav a:hover::after,.nav a[aria-current]::after{right:0}
.burger{display:none;flex:none;width:44px;height:44px;margin-right:-8px;padding:0;border:0;background:none;cursor:pointer}
.burger span{display:block;width:24px;height:2px;margin:5px auto;background:var(--gold-hi);transition:transform .25s var(--ease),opacity .2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:1339px){
  /* на узком экране верхняя строка уезжает при прокрутке, основная остаётся */
  :root{--bar:64px;--header:var(--bar)}
  .header{top:calc(-1 * var(--topbar))}
  .logo img{height:40px}
  .burger{display:block}
  .header__cta{margin-left:auto}
  .nav{
    position:absolute;inset:100% 0 auto;margin:0;padding:8px var(--gut) 28px;
    background:var(--navy-deep);border-bottom:2px solid var(--gold-lo);
    max-height:calc(100dvh - var(--header));overflow:auto;
    visibility:hidden;opacity:0;transform:translateY(-12px);
    transition:opacity .2s,transform .25s var(--ease),visibility 0s .25s;
  }
  .nav.is-open{visibility:visible;opacity:1;transform:none;transition-delay:0s}
  .nav ul{flex-direction:column;gap:0}
  .nav a{padding:16px 0;font-size:.95rem;border-bottom:1px solid rgba(255,255,255,.08)}
  .nav a::after{display:none}
}
@media (max-width:719px){
  .topbar__place{display:none}
}
@media (max-width:420px){
  .header__in{gap:14px}
  .header__cta{padding-inline:16px}
}

/* ---------- первый экран ---------- */
.hero{position:relative;overflow:hidden;padding-top:clamp(24px,5vw,56px)}
.hero__topo{
  position:absolute;inset:0;z-index:0;opacity:.55;pointer-events:none;
  background:url(/img/brand/topo.svg) center/cover no-repeat;
  -webkit-mask-image:linear-gradient(180deg,#000 30%,transparent 96%);mask-image:linear-gradient(180deg,#000 30%,transparent 96%);
}
.hero > .wrap{position:relative;z-index:1}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(28px,5vw,72px);align-items:center}
.hero__eyebrow{margin-bottom:20px;color:var(--gold);font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.hero__lead{max-width:56ch;margin-top:22px;font-size:clamp(1.02rem,.5vw + .95rem,1.2rem);color:var(--muted)}
.hero__cta{display:flex;flex-wrap:wrap;align-items:center;gap:22px 34px;margin-top:34px}
.hero__visual{position:relative}

/* Фото в наклонной плашке — как правая стойка буквы «А» в знаке */
.slab{position:relative;z-index:1;aspect-ratio:5/6;width:min(100%,500px);margin-left:auto;--cut:27%}
.slab::before{
  content:"";position:absolute;inset:0;background:#000;transform:translate(14px,14px);
  clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% 100%,var(--cut) 100%);
}
.slab picture{position:absolute;inset:0;clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% 100%,var(--cut) 100%)}
.slab img{width:100%;height:100%;object-fit:cover;object-position:50% 0}
.slab--wide{aspect-ratio:4/3;width:min(100%,620px);--cut:15%}
.slab--wide img{object-position:50% 40%}
/* Три кадра первого экрана главной — три наклонные плашки, как стойки знака */
.trio{position:relative;z-index:1;display:flex;gap:12px;aspect-ratio:6/5;width:min(100%,560px);margin-left:auto;padding-inline:7%}
.trio li{flex:1;min-width:0;overflow:hidden;background:#000;transform:skewX(8deg);box-shadow:10px 10px 0 #000}
.trio picture{width:100%;height:100%}
/* кадр шире плашки: после обратного наклона он закрывает её углы */
.trio img{width:146%;max-width:none;height:100%;margin-left:-23%;object-fit:cover;transform:skewX(-8deg)}
/* линия под фото, уходящая к правому краю экрана: кадр стоит на ней целиком,
   как силуэты танцоров в логотипе. Через сам кадр линия не проходит. */
.hero__bar{position:absolute;z-index:3;left:-7%;right:-60vw;top:100%;height:8px;background:var(--grad);box-shadow:5px 5px 0 #000}

/* Цифры под первым экраном */
.facts{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;
  margin-top:clamp(44px,6vw,76px);border-top:1px solid var(--line);
}
.facts > div{padding:24px 24px 30px 0}
.facts > div + div{padding-left:24px;border-left:1px solid var(--line)}
.facts dt{display:inline-block;font-size:clamp(1.5rem,2.4vw + .5rem,2.3rem);line-height:1.1}
.facts dd{margin-top:8px;color:var(--muted);font-size:.92rem;line-height:1.45}

.facts-note{margin-top:4px;padding-bottom:clamp(20px,3vw,32px);color:var(--dim);font-size:.84rem}

.hero--page{padding-bottom:clamp(40px,6vw,72px)}
.hero--plain{padding-bottom:clamp(32px,5vw,56px)}
.hero--plain .hero__lead{margin-top:18px}
.hero--404{min-height:70vh}
.hero--404 .list{margin-top:28px}

.crumbs{margin-bottom:clamp(18px,3vw,32px);font-size:.82rem;color:var(--dim)}
.crumbs ol{display:flex;flex-wrap:wrap;gap:6px 0}
.crumbs li + li::before{content:"/";margin:0 10px;color:var(--gold-lo)}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--gold-hi)}

@media (max-width:999px){
  .hero__grid{grid-template-columns:1fr}
  .slab{width:min(86%,420px);margin-inline:auto}
  .slab--wide{width:min(94%,560px)}
  .trio{width:min(100%,520px);margin-inline:auto}
  .hero__bar{right:-20vw}
}
@media (max-width:719px){
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .facts > div{padding:20px 14px 22px 0}
  .facts > div + div{padding-left:0;border-left:0}
  .facts > div:nth-child(even){padding-left:16px;border-left:1px solid var(--line)}
  .facts > div:nth-child(n+3){border-top:1px solid var(--line)}
}

/* ---------- разделы ---------- */
.section{position:relative;padding-block:clamp(56px,8vw,112px)}
.section--tight{padding-block:clamp(28px,4vw,48px)}
.section--text{padding-block:clamp(36px,5vw,64px)}
.section--raise{background:var(--navy-raise);border-block:1px solid rgba(255,255,255,.05)}

.split{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,5vw,72px);align-items:start}
.split > .head{position:sticky;top:calc(var(--header) + 24px);margin-bottom:0}
@media (max-width:899px){
  .split{grid-template-columns:1fr}
  .split > .head{position:static;margin-bottom:8px}
}

/* ---------- текст ---------- */
.prose > * + *{margin-top:1.1em}
.prose p,.about__text p{max-width:68ch}
.list > li,.steps-list > li{position:relative;padding-left:30px}
.list > li + li,.steps-list > li + li{margin-top:.75em}
.list > li::before{
  content:"";position:absolute;left:2px;top:.58em;width:14px;height:8px;
  background:var(--grad);transform:skewX(22deg);
}
.list--links a{font-weight:600}
.steps-list{counter-reset:step}
.steps-list > li{counter-increment:step;padding-left:46px}
.steps-list > li::before{
  content:counter(step,decimal-leading-zero);position:absolute;left:0;top:.05em;
  font-weight:800;font-size:.95rem;color:var(--gold);letter-spacing:.02em;
}
.prose--doc{max-width:76ch}
.prose--doc h2{margin-top:2em;font-size:1.15rem;font-weight:800}
.hint{margin-top:28px;max-width:70ch;color:var(--muted)}
.note{padding:28px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.note p + p{margin-top:18px}

/* ---------- «Коротко» ---------- */
.summary{position:relative;padding:26px 28px 28px 34px;background:var(--navy-raise);border:1px solid var(--line)}
.summary::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(180deg,#F2CF85,#F3B353 30%,#C27D16 80%,#F1C42A)}
.summary__title{margin-bottom:16px;color:var(--gold);font-size:.76rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.summary dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 32px}
.summary dt{color:var(--dim);font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.summary dd{margin-top:4px;font-size:.97rem;line-height:1.45}
@media (max-width:899px){.summary dl{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:559px){.summary dl{grid-template-columns:1fr;gap:14px}.summary{padding:22px 20px 24px 26px}}

/* ---------- о направлении (главная) ---------- */
.about{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(28px,5vw,72px);align-items:start}
.about__text p + p{margin-top:1.1em}
.about__text .link-arrow{margin-top:10px}
.about__side .summary{margin-top:34px}
.about__side .summary dl{grid-template-columns:1fr;gap:14px}
.frame{position:relative;--cut:56px}
.frame::before{
  content:"";position:absolute;inset:0;background:#000;transform:translate(12px,12px);
  clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% 100%,0 100%);
}
.frame picture{position:relative;display:block;clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% 100%,0 100%)}
.frame img{width:100%;aspect-ratio:3/2;object-fit:cover}
@media (max-width:899px){.about{grid-template-columns:1fr}}

/* ---------- лента кадров: наклонные плашки, как стойки знака ---------- */
.section--ribbon{padding-top:0;overflow:hidden}
.ribbon{
  display:flex;gap:clamp(8px,1.4vw,18px);width:106%;margin:0 0 clamp(48px,7vw,96px) -3%;
  transform:translateY(-28px);
}
.ribbon li{flex:1;min-width:0;aspect-ratio:4/5;overflow:hidden;background:#000;transform:skewX(8deg);box-shadow:8px 8px 0 #000}
.ribbon picture{width:100%;height:100%}
/* кадр шире плашки: после обратного наклона он закрывает её углы без увеличения по высоте */
.ribbon img{width:122%;max-width:none;height:100%;margin-left:-11%;object-fit:cover;transform:skewX(-8deg);transition:transform .6s var(--ease)}
.ribbon li:hover img{transform:skewX(-8deg) scale(1.05)}
.op-25{object-position:25% 50%}
.op-65{object-position:65% 50%}
.op-80{object-position:80% 50%}
.op-top{object-position:50% 0}
@media (max-width:719px){
  .ribbon{width:112%;margin-left:-6%}
  .ribbon li{aspect-ratio:3/5}
  .ribbon img{width:136%;margin-left:-18%}
  .ribbon li:nth-child(n+4){display:none}
}

.support{margin-top:1.4em;padding-left:16px;border-left:3px solid var(--gold-lo);color:var(--muted);font-size:.93rem;line-height:1.5}
.subhead{margin:clamp(30px,4vw,48px) 0 18px;color:var(--gold);font-size:.8rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.head + .subhead{margin-top:0}

/* ---------- польза ---------- */
.benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,44px) clamp(20px,3vw,48px);counter-reset:b}
.benefits li{counter-increment:b;position:relative;padding-top:22px;border-top:2px solid var(--line)}
.benefits li::before{
  content:counter(b,decimal-leading-zero);display:block;margin-bottom:12px;
  font-size:.82rem;font-weight:800;letter-spacing:.14em;color:var(--gold);
}
.benefits li::after{content:"";position:absolute;left:0;top:-2px;width:56px;height:2px;background:var(--grad)}
.benefits h3,.path h3,.howto h3{font-size:1.12rem;font-weight:800;line-height:1.25}
.benefits p,.path p,.howto p{margin-top:10px;color:var(--muted);font-size:.97rem}
@media (max-width:899px){.benefits{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:559px){.benefits{grid-template-columns:1fr}}

/* ---------- тренер ---------- */
.trainer{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:clamp(28px,6vw,88px);align-items:center}
.trainer__photo{position:relative}
/* кольцо — как в круглой эмблеме студии */
.ring{position:relative;z-index:1;aspect-ratio:1;padding:7px;border-radius:50%;background:var(--grad);box-shadow:8px 8px 0 #000}
.ring picture,.ring img{width:100%;height:100%;border-radius:50%}
.ring img{object-fit:cover;object-position:50% 12%}
/* та же линия — под портретом, а не через него */
.trainer__bar{position:absolute;left:-100vw;right:-8%;top:calc(100% + 22px);height:6px;background:var(--grad);box-shadow:4px 4px 0 #000}
.trainer__role{margin:10px 0 18px;color:var(--gold);font-weight:700}
.awards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 28px;margin-top:26px}
.awards li{position:relative;padding:14px 0 14px 34px;border-top:1px solid var(--line);font-weight:700;line-height:1.35}
.awards li::before{content:"";position:absolute;left:2px;top:1.35em;width:18px;height:10px;background:var(--grad);transform:skewX(22deg)}
.trainer__facts{margin-top:10px;border-top:1px solid var(--line)}
.trainer__facts > div{display:grid;grid-template-columns:92px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.trainer__facts dt{color:var(--dim);font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding-top:.3em}
.trainer__facts dd{color:var(--muted);font-size:.97rem}
@media (max-width:899px){
  .trainer{grid-template-columns:1fr}
  .trainer__photo{width:min(72%,300px)}
}
@media (max-width:559px){.awards{grid-template-columns:1fr;gap:0}}

/* ---------- расписание и цена ---------- */
.sched-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,330px);gap:clamp(24px,4vw,56px);align-items:start}
.sched table{width:100%;border-collapse:collapse;text-align:left}
.sched thead th{padding:0 16px 12px 0;color:var(--dim);font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border-bottom:2px solid var(--gold-lo)}
.sched tbody th,.sched td{padding:20px 16px 20px 0;border-bottom:1px solid var(--line);vertical-align:top;font-weight:400}
.sched__group{display:block;font-weight:800;font-size:1.05rem;line-height:1.3;color:var(--text);text-decoration:none}
a.sched__group:hover{color:var(--gold-hi)}
.sched__note{display:block;margin-top:4px;color:var(--dim);font-size:.88rem}
.sched__state{display:inline-block;margin-top:10px;padding:2px 10px;border:1px solid var(--line);color:var(--dim);font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.sched__state--open{border-color:var(--gold);color:var(--gold-hi)}
.sched tr.is-closed .sched__group,.sched tr.is-closed .slot b{color:var(--muted)}
.sched tr.is-closed td{opacity:.7}
.age{display:inline-block;padding:2px 12px;border:1px solid var(--gold);color:var(--gold-hi);font-weight:800;font-size:.9rem;transform:skewX(var(--skew))}
.slot{display:block;font-variant-numeric:tabular-nums;white-space:nowrap}
.slot + .slot{margin-top:4px}
.slot b{display:inline-block;min-width:6.4em;color:var(--gold-hi)}

.price{position:relative;padding:30px 30px 36px;background:var(--navy-deep);border:1px solid var(--line)}
.price::before{content:"";position:absolute;inset:-1px -1px auto;height:6px;background:var(--grad)}
.price__label{color:var(--dim);font-size:.76rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.price__value{display:inline-block;margin-top:10px;font-size:clamp(2.2rem,3vw + 1rem,3rem);line-height:1.05}
.price__value small{font-size:1rem;font-weight:700;letter-spacing:.02em}
.price__note{margin:14px 0 26px;color:var(--muted);font-size:.94rem}
.price--trial .price__value{font-size:clamp(1.9rem,2.2vw + 1rem,2.5rem);text-transform:uppercase}

@media (max-width:899px){.sched-grid{grid-template-columns:1fr}}
@media (max-width:619px){
  .sched thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .sched tr{display:block;padding:18px 0;border-bottom:1px solid var(--line)}
  .sched tbody th,.sched td{display:block;padding:0;border:0}
  .sched td{margin-top:10px}
  .sched td[data-label="Возраст"]{position:relative}
}

/* ---------- фото ---------- */
.gallery{columns:3;column-gap:16px}
.gallery li{break-inside:avoid;margin-bottom:16px}
.gallery--tall{columns:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.gallery--tall li{margin:0}
.gallery--tall img{aspect-ratio:3/4;object-fit:cover}
.zoom{position:relative;display:block;overflow:hidden;background:var(--navy-deep);cursor:zoom-in}
.zoom img{width:100%;transition:transform .5s var(--ease)}
.zoom::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:4px;background:var(--grad);transition:right .35s var(--ease)}
.zoom:hover img{transform:scale(1.04)}
.zoom:hover::after,.zoom:focus-visible::after{right:0}
@media (max-width:899px){.gallery{columns:2}.gallery--tall{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:479px){.gallery,.gallery--tall{column-gap:10px;gap:10px}.gallery li{margin-bottom:10px}.gallery--tall li{margin:0}}

.lightbox{
  width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;
  background:rgba(12,14,20,.94);color:var(--text);
}
.lightbox::backdrop{background:rgba(12,14,20,.94)}
.lightbox[open]{display:grid;place-items:center}
.lightbox img{max-width:min(94vw,1500px);max-height:88vh;width:auto;height:auto;box-shadow:10px 10px 0 #000}
.lightbox p{position:absolute;left:0;right:0;bottom:14px;padding:0 60px;text-align:center;color:var(--muted);font-size:.9rem}
.lightbox button{
  position:absolute;top:14px;right:14px;width:48px;height:48px;border:0;cursor:pointer;
  background:var(--grad);color:#15171E;font-size:1.5rem;font-weight:800;line-height:1;
}

/* ---------- карточки направлений ---------- */
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.cards--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cards--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{display:flex}
.card__link{
  position:relative;display:flex;flex-direction:column;width:100%;
  background:var(--navy-deep);border:1px solid var(--line);color:var(--text);text-decoration:none;
  transition:transform .25s var(--ease),border-color .25s,box-shadow .25s var(--ease);
}
.card__link:hover{color:var(--text);transform:translate(-4px,-4px);border-color:var(--gold-lo);box-shadow:8px 8px 0 #000}
.card__photo{position:relative;overflow:hidden}
.card__photo img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .5s var(--ease)}
.card__link:hover .card__photo img{transform:scale(1.05)}
.card__photo::after{content:"";position:absolute;inset:auto 0 0;height:4px;background:var(--grad)}
.card__body{display:flex;flex-direction:column;flex:1;padding:22px 22px 24px}
.card__num{align-self:flex-start;font-size:.82rem;letter-spacing:.14em}
.card__title{margin-top:8px;font-size:1.16rem;font-weight:800;line-height:1.22;text-transform:uppercase}
.card__meta{margin-top:8px;color:var(--gold);font-size:.84rem;font-weight:700}
.card__text{margin:12px 0 20px;color:var(--muted);font-size:.93rem;line-height:1.5}
.card__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;margin-top:auto;padding-top:16px;border-top:1px solid var(--line);font-size:.76rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}
.card__price{color:var(--text)}
.card__more{display:inline-flex;align-items:center;gap:8px;color:var(--gold)}
.card__more::after{content:"";width:14px;height:2px;background:currentColor;transition:width .25s var(--ease)}
.card__link:hover .card__more::after{width:24px}
@media (max-width:1099px){.cards,.cards--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1099px) and (min-width:620px){.cards--3 .card:last-child{grid-column:1/-1}.cards--3 .card:last-child .card__link{flex-direction:row}.cards--3 .card:last-child .card__photo{flex:0 0 46%}.cards--3 .card:last-child .card__photo img{height:100%}}
@media (max-width:619px){.cards,.cards--3,.cards--2{grid-template-columns:1fr}}

/* ---------- спорт для взрослых ---------- */
.fit{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.fit__item{
  position:relative;display:flex;flex-direction:column;height:100%;padding:26px 22px 22px;
  background:var(--navy-deep);border:1px solid var(--line);color:var(--text);text-decoration:none;
  transition:transform .25s var(--ease),border-color .25s,box-shadow .25s var(--ease);
}
.fit__item::before{content:"";position:absolute;inset:-1px -1px auto;height:4px;z-index:1;background:var(--grad)}
.fit__pic{display:block;margin:-26px -22px 20px;overflow:hidden;background:#12141c}
.fit__pic img{width:100%;aspect-ratio:5/4;object-fit:cover;object-position:50% 22%;transition:transform .5s var(--ease)}
/* какая часть вертикального кадра видна в низкой плитке */
.fit__pic img.op-y20{object-position:50% 20%}
.fit__pic img.op-y45{object-position:50% 45%}
.fit__pic img.op-y65{object-position:50% 65%}
.fit__item:hover .fit__pic img{transform:scale(1.05)}
.fit__item:hover{color:var(--text);transform:translate(-4px,-4px);border-color:var(--gold-lo);box-shadow:8px 8px 0 #000}
.fit__num{align-self:flex-start;font-size:.82rem;letter-spacing:.14em}
.fit__title{margin-top:8px;font-size:1.3rem;font-weight:800;line-height:1.15;text-transform:uppercase}
.fit__sub{margin:8px 0 22px;color:var(--muted);font-size:.93rem;line-height:1.45}
.fit__item .card__more{margin-top:auto;font-size:.76rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.fit__item:hover .card__more::after{width:24px}
@media (max-width:1099px){.fit{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:519px){.fit{grid-template-columns:1fr}}

.fitrow{
  display:grid;grid-template-columns:190px minmax(0,.62fr) minmax(0,1.2fr);gap:clamp(16px,3.4vw,52px);
  padding:clamp(26px,3.4vw,44px) 0;border-top:1px solid var(--line);align-items:start;
}
.fitrow__pic{position:relative}
.fitrow__pic::before{content:"";position:absolute;inset:0;background:#000;transform:translate(8px,8px)}
.fitrow__pic picture{position:relative;display:block}
.fitrow__pic img{width:100%;aspect-ratio:3/4;object-fit:cover}
.fitrow:last-child{border-bottom:1px solid var(--line)}
.fitrow__head .fit__num{display:inline-block}
.fitrow__title{margin-top:8px;font-size:clamp(1.5rem,2.2vw + .7rem,2.2rem);font-weight:800;line-height:1.1;text-transform:uppercase}
.fitrow__head .fit__sub{margin:10px 0 0;color:var(--gold);font-weight:700}
.fitrow__body p{max-width:64ch}
.tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.tags li{padding:6px 14px;border:1px solid var(--line);color:var(--muted);font-size:.86rem;font-weight:600}
@media (max-width:799px){
  .fitrow{grid-template-columns:minmax(110px,34%) minmax(0,1fr)}
  .fitrow__body{grid-column:1/-1}
}

/* ---------- путь: шаги на одной линии ---------- */
.path{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,40px);counter-reset:p}
.path::before{content:"";position:absolute;left:0;right:0;top:25px;height:2px;background:var(--grad)}
.path li{counter-increment:p;position:relative;padding-top:78px}
.path li::before{
  content:counter(p);position:absolute;left:0;top:0;z-index:1;
  display:grid;place-items:center;width:58px;height:52px;
  background:var(--grad);color:#15171E;font-size:1.3rem;font-weight:800;
  clip-path:polygon(0 0,74% 0,100% 100%,26% 100%);
}
.path li::after{content:"";position:absolute;left:5px;top:5px;width:58px;height:52px;background:#000;clip-path:polygon(0 0,74% 0,100% 100%,26% 100%)}
@media (max-width:899px){
  .path{grid-template-columns:1fr;gap:30px}
  .path::before{left:28px;right:auto;top:0;bottom:0;width:2px;height:auto;background:linear-gradient(180deg,#F2CF85,#C27D16)}
  .path li{padding:2px 0 0 86px;min-height:56px}
}

.howto{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,44px)}
.howto li{padding-top:20px;border-top:2px solid var(--gold-lo)}
@media (max-width:799px){.howto{grid-template-columns:1fr}}

/* ---------- вопросы ---------- */
.faq{border-top:1px solid var(--line)}
.faq__item{border-bottom:1px solid var(--line)}
.faq__item summary{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:22px 0;cursor:pointer;list-style:none}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item h3{font-size:1.06rem;font-weight:700;line-height:1.4}
.faq__item summary:hover h3{color:var(--gold-hi)}
.faq__mark{position:relative;flex:none;width:22px;height:22px;margin-top:3px}
.faq__mark::before,.faq__mark::after{content:"";position:absolute;left:0;top:10px;width:22px;height:2px;background:var(--gold);transition:transform .25s var(--ease)}
.faq__mark::after{transform:rotate(90deg)}
.faq__item[open] .faq__mark::after{transform:rotate(0)}
.faq__answer{padding:0 42px 24px 0;color:var(--muted)}

/* ---------- заявка ---------- */
.lead{overflow:hidden;background:var(--navy-deep);border-block:1px solid rgba(255,255,255,.05)}
.lead::before{
  content:"";position:absolute;inset:0;opacity:.4;pointer-events:none;
  background:url(/img/brand/topo.svg) center/cover no-repeat;
}
.lead__grid{position:relative;display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(28px,5vw,72px);align-items:start}
.lead__text > p{color:var(--muted);margin-top:18px}
.lead__points{margin-top:26px}
.lead__points li{position:relative;padding:12px 0 12px 32px;border-top:1px solid var(--line);font-weight:600}
.lead__points li:last-child{border-bottom:1px solid var(--line)}
.lead__points li::before{content:"";position:absolute;left:2px;top:1.35em;width:16px;height:9px;background:var(--grad);transform:skewX(22deg)}
.lead__contacts a{font-weight:700}

.form{
  position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 20px;
  padding:clamp(22px,3.4vw,40px);background:var(--navy);border:1px solid var(--line);box-shadow:10px 10px 0 #000;
}
.form::before{content:"";position:absolute;inset:-1px -1px auto;height:6px;background:var(--grad)}
.field{display:block}
.field--wide{grid-column:1/-1}
.field__label{display:block;margin-bottom:8px;color:var(--muted);font-size:.76rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.field__label i,.check i{color:var(--gold);font-style:normal}
.field input,.field select,.field textarea{
  width:100%;min-height:52px;padding:12px 14px;border:1px solid var(--line);border-radius:0;
  background:var(--navy-deep);color:var(--text);transition:border-color .15s,box-shadow .15s;
}
.field textarea{min-height:96px;resize:vertical}
.field select{appearance:none;-webkit-appearance:none;padding-right:42px;background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);background-position:calc(100% - 22px) 23px,calc(100% - 16px) 23px;background-size:6px 6px;background-repeat:no-repeat}
.field select option{background:var(--navy-deep);color:var(--text)}
.field ::placeholder{color:#6F778B}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
.field.is-error input{border-color:#FF8A7A;box-shadow:0 0 0 1px #FF8A7A}
.check{display:flex;gap:12px;align-items:flex-start;color:var(--muted);font-size:.88rem;line-height:1.45;cursor:pointer}
.check input{flex:none;width:22px;height:22px;margin:1px 0 0;accent-color:var(--gold)}
.check.is-error span{color:#FFA89B}
.form__foot{display:flex;flex-wrap:wrap;align-items:center;gap:16px 26px;margin-top:6px}
.form__status{flex:1;min-width:200px;font-size:.92rem;color:#FFA89B}
.form__status:empty{display:none}
.form__noscript{color:#FFA89B;font-size:.92rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form__done{grid-column:1/-1;padding:12px 0 6px}
.form__done h3{font-size:1.5rem;font-weight:800;text-transform:uppercase;line-height:1.15}
.form__done p{margin-top:14px;color:var(--muted)}
@media (max-width:899px){.lead__grid{grid-template-columns:1fr}}
@media (max-width:559px){.form{grid-template-columns:1fr;box-shadow:6px 6px 0 #000}}

/* ---------- адрес ---------- */
.place{display:grid;gap:24px}
.place--map{grid-template-columns:minmax(0,380px) minmax(0,1fr);align-items:stretch}
.place__card{padding:30px;background:var(--navy-raise);border:1px solid var(--line)}
.section--raise .place__card{background:var(--navy)}
.place:not(.place--map) .place__card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px 40px;align-items:center}
.place address span{display:block;color:var(--muted)}
.place address .place__street{color:var(--text);font-size:clamp(1.15rem,1.6vw + .6rem,1.6rem);font-weight:800;line-height:1.25;margin-bottom:8px}
.place address .place__metro{margin-top:10px;color:var(--gold-hi);font-weight:700}
.place__contacts{margin-top:18px;font-weight:700}
.place__links{display:flex;flex-wrap:wrap;align-items:center;gap:20px 30px}
.place--map .place__links{margin-top:28px}
.map{position:relative;min-height:420px;border:1px solid var(--line);background:var(--navy-deep)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media (max-width:899px){
  .place--map{grid-template-columns:1fr}
  .place:not(.place--map) .place__card{grid-template-columns:1fr}
  .map{min-height:340px}
}

/* ---------- подвал ---------- */
.footer{background:var(--navy-deep);color:var(--muted);font-size:.93rem}
.footer__stage{position:relative;padding-top:44px;background:var(--navy)}
.footer__stage-in{display:flex;justify-content:flex-end}
.footer__dancers{width:auto;height:clamp(64px,9vw,104px);color:var(--text);margin-bottom:-4px;position:relative;z-index:1}
.footer__line{display:block;height:6px;background:var(--grad)}
.footer__grid{display:grid;grid-template-columns:1.25fr 1fr 1fr 1.15fr;gap:36px clamp(24px,4vw,56px);padding-block:clamp(40px,6vw,64px)}
.footer__brand{display:flex;gap:18px;align-items:center}
.footer__brand img{flex:none;width:84px;height:84px}
.footer__brand strong{color:var(--text);font-size:1.2rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.footer__title{margin-bottom:14px;color:var(--dim);font-size:.74rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.footer li + li{margin-top:8px}
.footer a{color:var(--muted);text-decoration:none}
.footer a:hover{color:var(--gold-hi)}
.footer address{line-height:1.55}
.footer__contacts{display:block;margin-top:10px;font-weight:700}
.footer .link-arrow{margin-top:16px;color:var(--gold);font-size:.78rem}
.footer__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding-block:20px;border-top:1px solid var(--line);color:var(--dim);font-size:.82rem}
@media (max-width:899px){.footer__grid{grid-template-columns:1fr 1fr}}
@media (max-width:559px){.footer__grid{grid-template-columns:1fr}}

/* ---------- плашка cookie (только с Метрикой) ---------- */
.cookie{
  position:fixed;left:16px;right:16px;bottom:16px;z-index:60;display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;
  max-width:720px;margin-inline:auto;padding:16px 20px;background:var(--navy-raise);border:1px solid var(--gold-lo);box-shadow:8px 8px 0 #000;font-size:.88rem;
}
.cookie[hidden]{display:none}
.cookie p{flex:1;min-width:220px}

/* ---------- появление блоков при прокрутке ---------- */
.will-reveal{opacity:0;transform:translateY(18px)}
.will-reveal.is-in{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease)}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
  .will-reveal{opacity:1;transform:none}
}

@media print{
  .header,.footer__stage,.lead,.cookie,.hero__topo{display:none}
  body{background:#fff;color:#000}
}