[hidden]{display:none!important}

/* Layout: два слайда в одной ленте — MIA слева (/mia-dance/), MARO справа (/); тянешь вбок, фоновые слои едут медленнее текста */
:root{
  --hub-bg:#ECE8E2; --hub-fg:#161414; --hub-muted:#5D5750; --hub-line:#CEC6BB;
  --mia-bg:#4A0F24; --mia-bg2:#601A34; --mia-fg:#FBEDE6; --mia-muted:#E6BFC8; --mia-accent:#F2B544; --mia-gold:#F2B544; --mia-on:#3A0B1C;
  --yo-bg:#F7ECE8; --yo-bg2:#EFD9D6; --yo-fg:#4E2443; --yo-muted:#74495F; --yo-rose:#B85C74; --yo-accent:#9E4560; --yo-ring:#D9A9B5; --yo-on:#FFFFFF;
  --maro-bg:#F4F1EA; --maro-bg2:#E9E4D8; --maro-fg:#141414; --maro-muted:#5E5A52; --maro-line:#CFC8B8; --maro-signal:#FF4F12; --maro-on:#141414; --maro-deep:#141414; --maro-deep-fg:#F2EEE6;
  --dance:#F0457A; --folio:#C6F432;
  --f-maro:"Unbounded","Arial Black",system-ui,sans-serif;
  --f-mia:"Playfair Display",Georgia,"Times New Roman",serif;
  --f-yo:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --f-body:"Manrope",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --hub-bg:#151413; --hub-fg:#F1ECE5; --hub-muted:#A59D93; --hub-line:#34302C;
  --mia-bg:#3A0B1C; --mia-bg2:#52152C; --mia-fg:#FBEDE6; --mia-muted:#E0B6C0; --mia-accent:#F2B544; --mia-gold:#F2B544; --mia-on:#3A0B1C;
  --yo-bg:#22121D; --yo-bg2:#33202D; --yo-fg:#F6E4E8; --yo-muted:#CDA9BC; --yo-rose:#EBA3B4; --yo-accent:#EBA3B4; --yo-ring:#7A4A63; --yo-on:#22121D;
  --maro-bg:#121211; --maro-bg2:#1E1D1B; --maro-fg:#F2EEE6; --maro-muted:#A39E94; --maro-line:#34322E; --maro-signal:#FF5A1F; --maro-on:#141414; --maro-deep:#F2EEE6; --maro-deep-fg:#141414;
  color-scheme:dark}}
:root[data-theme="dark"]{
  --hub-bg:#151413; --hub-fg:#F1ECE5; --hub-muted:#A59D93; --hub-line:#34302C;
  --mia-bg:#3A0B1C; --mia-bg2:#52152C; --mia-fg:#FBEDE6; --mia-muted:#E0B6C0; --mia-accent:#F2B544; --mia-gold:#F2B544; --mia-on:#3A0B1C;
  --yo-bg:#22121D; --yo-bg2:#33202D; --yo-fg:#F6E4E8; --yo-muted:#CDA9BC; --yo-rose:#EBA3B4; --yo-accent:#EBA3B4; --yo-ring:#7A4A63; --yo-on:#22121D;
  --maro-bg:#121211; --maro-bg2:#1E1D1B; --maro-fg:#F2EEE6; --maro-muted:#A39E94; --maro-line:#34322E; --maro-signal:#FF5A1F; --maro-on:#141414; --maro-deep:#F2EEE6; --maro-deep-fg:#141414;
  color-scheme:dark}

html,body{height:100%}
body{background:var(--hub-bg);color:var(--hub-fg);font-family:var(--f-body);font-size:16px;line-height:1.55;overflow:hidden}
*{box-sizing:border-box}
a{color:inherit}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.app{position:relative;height:100%;overflow:hidden}
.track{display:flex;height:100%;width:300%;will-change:transform;touch-action:pan-y}
.track.anim{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.track.dragging{cursor:grabbing;user-select:none}
.panel{position:relative;width:calc(100% / 3);height:100%;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-y}
.layer{will-change:transform}
.track.anim .layer{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.wrap{max-width:1120px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.mono{font-family:var(--f-mono);font-size:12px;letter-spacing:.09em;text-transform:uppercase}
h1,h2,h3{margin:0;text-wrap:balance}
p{margin:0}
.ghost{position:absolute;z-index:1;pointer-events:none;line-height:.8;white-space:nowrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:6px;text-decoration:none;border:0;font:700 16px var(--f-body);cursor:pointer}
.row{display:flex;flex-wrap:wrap;gap:12px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}

/* ---------- your yoga ---------- */
.yo-page{background:var(--yo-bg);color:var(--yo-fg);min-height:100%}
.yo-page .muted{color:var(--yo-muted)}
.yo-hero{position:relative;overflow:hidden;padding-block:88px 72px}
.yo-sun{position:absolute;z-index:1;right:-6%;top:-12%;width:min(62vw,620px);aspect-ratio:1;border-radius:50%;background:var(--yo-bg2);pointer-events:none}
.yo-sun.small{right:18%;top:auto;bottom:-30%;width:min(30vw,300px);background:transparent;border:1.5px solid var(--yo-ring)}
.yo-hero .wrap{position:relative;z-index:2;display:flex;flex-direction:column;gap:24px}
.yo-hero h1{margin:0}
.yo-hero h1 span{color:var(--yo-accent)}
.yo-hero .sub{font:italic 500 clamp(22px,2.6vw,28px)/1.3 var(--f-yo);max-width:32ch}
.yo-btn{background:var(--yo-accent);color:var(--yo-on);border-radius:999px}
.yo-btn.ghosty{background:transparent;color:var(--yo-fg);box-shadow:inset 0 0 0 1.5px var(--yo-fg)}
.yo-sec{padding-block:56px;border-top:1px solid var(--yo-bg2)}
.yo-sec h2{font:italic 500 clamp(34px,4.6vw,54px)/1.05 var(--f-yo);margin-bottom:28px}
.yo-card{background:var(--yo-bg2);border-radius:28px;padding:28px;display:flex;flex-direction:column;gap:10px;min-width:0}
.yo-card h3{font:600 26px/1.15 var(--f-yo)}
.yo-about{display:flex;flex-wrap:wrap;gap:40px;align-items:center}
.yo-photo{flex:1 1 280px;min-width:0;aspect-ratio:1;max-width:100%;border-radius:50%;background:var(--yo-bg2);display:flex;align-items:center;justify-content:center;color:var(--yo-muted)}
.yo-about .txt{flex:1 1 420px;min-width:0;display:flex;flex-direction:column;gap:16px}

/* ---------- MIA (центр) ---------- */
.mia-page{background:var(--mia-bg);color:var(--mia-fg);min-height:100%}
.mia-page .muted{color:var(--mia-muted)}
.mia-hero{position:relative;overflow:hidden;padding-block:80px 64px}
.mia-hero .ghost{font:italic 700 clamp(220px,40vw,560px) var(--f-mia);color:var(--mia-bg2);right:-6%;top:-12%}
.mia-arc{position:absolute;z-index:1;width:min(28vw,300px);aspect-ratio:1;border-radius:50%;pointer-events:none}
.mia-arc.a{left:8%;bottom:-14%;border:2px solid var(--mia-gold)}
.mia-arc.b{left:15%;bottom:-20%;border:2px solid var(--mia-muted)}
.mia-hero .wrap{position:relative;z-index:2;display:flex;flex-direction:column;gap:24px;align-items:center;text-align:center}
.mia-hero h1{font:italic 700 clamp(96px,17vw,220px)/.82 var(--f-mia)}
.mia-hero h1 span{color:var(--mia-accent)}
.mia-hero .sub{font:500 clamp(22px,2.6vw,30px)/1.25 var(--f-mia);max-width:24ch}
.mia-btn{background:var(--mia-accent);color:var(--mia-on)}
.mia-btn.ghosty{background:transparent;color:var(--mia-fg);box-shadow:inset 0 0 0 1.5px var(--mia-fg)}
.mia-sec{padding-block:56px;border-top:1px solid var(--mia-bg2)}
.mia-sec h2{font:italic 700 clamp(34px,4.4vw,52px)/1 var(--f-mia);margin-bottom:28px}
.mia-card{background:var(--mia-bg2);border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:10px;min-width:0}
.mia-card h3{font:600 24px/1.15 var(--f-mia)}
.doors{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.door{display:flex;flex-direction:column;gap:14px;padding:32px;border:0;border-radius:16px;text-align:left;cursor:pointer;font:inherit;min-height:260px;min-width:0}
.door.yo{background:var(--yo-bg);color:var(--yo-fg);border-radius:28px;box-shadow:inset 0 0 0 1px var(--yo-bg2)}
.door.maro{background:var(--maro-bg);color:var(--maro-fg);border-radius:6px}
.door .t-yo{font:500 44px/1 var(--f-yo);letter-spacing:-.03em}
.door .t-yo span{color:var(--yo-accent)}
.door .maro-word{height:44px;width:auto;align-self:flex-start}
.door .go{margin-top:auto;display:flex;align-items:center;gap:10px;font:500 13px var(--f-mono);letter-spacing:.09em;text-transform:uppercase}
.door .go svg{width:28px;height:12px;flex:none}
.door.yo .go svg{animation:nudgeL 2.2s ease-in-out infinite}
.door.maro .go svg{animation:nudgeR 2.2s ease-in-out infinite}
@keyframes nudgeL{0%,100%{transform:translateX(0)}50%{transform:translateX(-6px)}}
@keyframes nudgeR{0%,100%{transform:translateX(0)}50%{transform:translateX(6px)}}
.duo{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.portrait{aspect-ratio:4/5;max-width:100%;border-radius:200px 200px 16px 16px;background:var(--mia-bg2);display:flex;align-items:flex-end;padding:24px;color:var(--mia-muted)}
.person{display:flex;flex-direction:column;gap:12px}
.person h3{font:italic 700 32px/1 var(--f-mia)}
.contact-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.ci{display:flex;flex-direction:column;gap:6px;padding:20px;border-radius:16px;border:1.5px solid var(--mia-bg2);min-width:0}
.ci b{font:600 20px var(--f-mia)}

/* ---------- MARO ---------- */
.maro-page{background:var(--maro-bg);color:var(--maro-fg);min-height:100%}
.maro-page .muted{color:var(--maro-muted)}
.maro-hero{position:relative;overflow:hidden;padding-block:88px 64px}
.maro-hero .ghost{font:700 clamp(200px,32vw,460px) var(--f-maro);color:var(--maro-bg2);left:-4%;bottom:-14%;letter-spacing:-.04em}
.layers-tri{position:absolute;z-index:1;right:6%;top:18%;display:flex;flex-direction:column;gap:8px;width:30%;pointer-events:none}
.layers-tri i{display:block;height:8px;background:var(--maro-signal)}
.maro-hero .wrap{position:relative;z-index:2;display:flex;flex-direction:column;gap:24px}
.maro-hero h1{font:700 clamp(44px,7vw,92px)/.95 var(--f-maro);letter-spacing:-.02em}
.maro-hero h1 span{color:var(--maro-signal)}
.maro-hero .sub{max-width:52ch;font-size:18px}
.maro-btn{background:var(--maro-signal);color:var(--maro-on)}
.maro-btn.ghosty{background:transparent;color:var(--maro-fg);box-shadow:inset 0 0 0 1.5px var(--maro-fg)}
.strip{border-block:1px solid var(--maro-line)}
.strip .wrap{display:flex;flex-wrap:wrap;gap:8px 32px;padding-block:16px;color:var(--maro-muted)}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;padding-block:56px}
.tile{display:flex;flex-direction:column;gap:16px;padding:28px;border-radius:6px;color:var(--maro-on);min-width:0}
.tile h3{font:700 26px/1.05 var(--f-maro)}
.tile ul{margin:0;padding:16px 0 0;list-style:none;display:flex;flex-direction:column;gap:6px;border-top:1px solid currentColor}
.tile.lab{background:var(--maro-signal)}
.tile.dance{background:var(--dance)}
.tile.folio{background:var(--folio)}
.maro-contacts{background:var(--maro-deep);color:var(--maro-deep-fg);padding-block:56px}
.maro-contacts .wrap{display:flex;flex-wrap:wrap;gap:32px;justify-content:space-between;align-items:flex-end}
.maro-contacts h2{font:700 clamp(30px,4vw,52px)/1 var(--f-maro)}
.maro-contacts dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 24px;font-size:16px}
.maro-contacts dt{font:500 12px var(--f-mono);letter-spacing:.09em;text-transform:uppercase;opacity:.75;align-self:center}
.maro-contacts dd{margin:0;font-family:var(--f-mono)}

/* ---------- логотипы ---------- */
.yo-a{fill:var(--yo-rose)} .yo-f{fill:var(--yo-fg)} .yo-ring{fill:none;stroke:var(--yo-ring);stroke-width:2.5}
.mf{fill:currentColor} .ms{fill:var(--maro-signal)}
.logo-mia{font:italic 700 1em/1 var(--f-mia);letter-spacing:-.01em;white-space:nowrap}
.logo-mia span{color:var(--mia-accent)}
.site-bar{position:relative;z-index:3}
.site-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:18px;flex-wrap:wrap}
.site-bar .addr{opacity:.8}
.bar-yo{color:var(--yo-fg);border-bottom:1px solid var(--yo-bg2)}
.bar-mia{color:var(--mia-fg);border-bottom:1px solid var(--mia-bg2)}
.bar-maro{color:var(--maro-fg);border-bottom:1px solid var(--maro-line)}
.bar-logo{display:flex;align-items:center;gap:10px}
.bar-yo .mark-yo{width:44px;height:44px}
.bar-yo .logo-yo{height:34px;width:auto}
.bar-mia .logo-mia{font-size:34px}
.bar-maro .logo-maro{height:24px;width:auto}
.yo-hero h1 .logo-yo{display:block;width:min(100%,760px);height:auto}
.family{padding-block:40px 120px}
.family .wrap{display:flex;flex-direction:column;gap:20px}
.family .list{display:flex;flex-wrap:wrap;gap:12px}
.fam{text-decoration:none;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px;min-height:96px;min-width:200px;padding:20px 24px;border:0;cursor:pointer;font:inherit;text-align:left}
.fam.yo{background:var(--yo-bg);color:var(--yo-fg);border-radius:28px;box-shadow:inset 0 0 0 1px var(--yo-bg2)}
.fam.mia{background:var(--mia-bg);color:var(--mia-fg);border-radius:16px;box-shadow:inset 0 0 0 1px var(--mia-bg2)}
.fam.maro{background:var(--maro-bg);color:var(--maro-fg);border-radius:6px;box-shadow:inset 0 0 0 1px var(--maro-line)}
.fam .logo-yo{height:34px;width:auto} .fam .logo-maro{height:26px;width:auto} .fam .logo-mia{font-size:36px}
.fam small{font:500 11px var(--f-mono);letter-spacing:.09em;text-transform:uppercase;opacity:.75}


/* ---------- графика вместо фото ---------- */
.yo-photo .mark-yo.big{width:62%;height:auto}
.portrait.initial{align-items:center;justify-content:center;position:relative;overflow:hidden}
.portrait.initial::before{content:"";position:absolute;inset:18% 14% auto;aspect-ratio:1;border-radius:50%;border:1.5px solid var(--mia-gold);opacity:.55}
.portrait.initial span{position:relative;font:italic 700 clamp(140px,16vw,220px)/1 var(--f-mia);color:var(--mia-accent)}

/* ---------- навигация ---------- */
.pager{position:fixed;z-index:20;left:50%;transform:translateX(-50%);bottom:calc(16px + env(safe-area-inset-bottom,0px));display:flex;gap:4px;padding:4px;border-radius:999px;background:var(--hub-bg);border:1px solid var(--hub-line);box-shadow:0 8px 28px rgba(0,0,0,.12)}
.pager a{text-decoration:none;display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:0;border-radius:999px;background:transparent;color:var(--hub-muted);font:500 12px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.pager a[aria-current="page"]{background:var(--hub-fg);color:var(--hub-bg)}
.edge{position:fixed;z-index:15;top:50%;width:40px;height:132px;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;writing-mode:vertical-rl;font:500 11px var(--f-mono);letter-spacing:.14em;text-transform:uppercase}
.edge.l{left:env(safe-area-inset-left,0px);transform:translateY(-50%) rotate(180deg);border-radius:12px 0 0 12px}
.edge.r{right:env(safe-area-inset-right,0px);transform:translateY(-50%);border-radius:12px 0 0 12px}
.edge.to-yo{background:var(--yo-accent);color:var(--yo-on)}
.edge.to-mia{background:var(--mia-accent);color:var(--mia-on)}
.edge.to-maro{background:var(--maro-signal);color:var(--maro-on)}

@media (prefers-reduced-motion:reduce){
  .track.anim,.track.anim .layer{transition-duration:.01s}
  .door .go svg{animation:none}
}

/* ---------- на телефоне листаем свайпом и переключателем внизу ---------- */
@media (max-width:640px){.edge{display:none!important}}

/* ---------- плеер MIA ---------- */
.bar-sticky{position:sticky;top:0;z-index:6;background:var(--mia-bg)}
.player{display:flex;align-items:center;gap:12px;min-width:0;max-width:min(360px,62vw)}
.player[hidden]{display:none}
.pl-btn{flex:none;width:44px;height:44px;border-radius:50%;border:1.5px solid var(--mia-accent);background:transparent;color:var(--mia-accent);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.pl-btn svg{width:16px;height:16px;fill:currentColor}
.pl-btn .i-pause{display:none}
.player.is-playing .pl-btn{background:var(--mia-accent);color:var(--mia-on)}
.player.is-playing .pl-btn .i-play{display:none}
.player.is-playing .pl-btn .i-pause{display:block}
.pl-info{display:flex;flex-direction:column;gap:4px;min-width:0}
.pl-label{font:500 10px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mia-muted)}
.pl-title{font:600 15px/1.2 var(--f-body);color:var(--mia-fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-bar{display:block;height:2px;background:var(--mia-bg2);border-radius:2px;overflow:hidden}
.pl-bar i{display:block;height:100%;width:0;background:var(--mia-accent)}
.pl-eq{display:inline-flex;gap:2px;align-items:flex-end;height:12px;margin-left:6px;vertical-align:middle}
.pl-eq b{width:2px;background:var(--mia-accent);height:30%}
.player.is-playing .pl-eq b{animation:eq .9s ease-in-out infinite}
.player.is-playing .pl-eq b:nth-child(2){animation-delay:-.3s}
.player.is-playing .pl-eq b:nth-child(3){animation-delay:-.6s}
@keyframes eq{0%,100%{height:25%}50%{height:100%}}
@media (prefers-reduced-motion:reduce){.player.is-playing .pl-eq b{animation:none;height:60%}}
@media (max-width:480px){.bar-mia .logo-mia{font-size:28px}.pl-label{display:none}}