/* shkozztantsev.info — школа танцев, поп, фиол-коралл градиент */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');
:root{--vio:#7c3aed;--fuchsia:#d946ef;--coral:#fb7185;--bg:#0f0a1e;--bg2:#171029;--card:#1d1435;--ink:#f4f0ff;--muted:#a89bc7;--line:rgba(255,255,255,.09)}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Poppins',sans-serif;background:var(--bg);color:var(--ink);line-height:1.6;font-weight:300;overflow-x:hidden}
.wrap{max-width:1180px;margin:0 auto;padding:0 26px}
h1,h2,h3,h4{font-weight:700;line-height:1.08}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
section{padding:96px 0}
.grad-text{background:linear-gradient(100deg,var(--fuchsia),var(--coral));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* nav */
.dz-head{position:sticky;top:0;z-index:50;background:rgba(15,10,30,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.dz-nav{display:flex;align-items:center;justify-content:space-between;height:78px}
.dz-logo{font-weight:800;font-size:1.4rem;letter-spacing:-.02em}
.dz-logo span{background:linear-gradient(100deg,var(--fuchsia),var(--coral));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.dz-menu{display:flex;gap:32px}
.dz-menu a{font-size:.95rem;font-weight:400;color:var(--muted);transition:.2s}
.dz-menu a:hover,.dz-menu a.active{color:#fff}
.dz-burger{display:none;background:none;border:none;font-size:1.5rem;color:#fff;cursor:pointer}
.btn{display:inline-block;background:linear-gradient(100deg,var(--vio),var(--fuchsia));color:#fff;padding:15px 34px;border-radius:50px;font-weight:600;font-size:.96rem;transition:.25s;border:none;cursor:pointer;font-family:'Poppins';box-shadow:0 10px 30px -8px rgba(217,70,239,.5)}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 36px -8px rgba(217,70,239,.6)}
.btn-out{background:transparent;border:1.5px solid var(--line);box-shadow:none;color:#fff}
.btn-out:hover{border-color:var(--fuchsia)}

/* hero */
.hero{position:relative;padding:90px 0 80px;text-align:center;overflow:hidden}
.hero:before{content:'';position:absolute;top:-30%;left:50%;transform:translateX(-50%);width:700px;height:700px;background:radial-gradient(circle,rgba(217,70,239,.25),transparent 60%);filter:blur(40px)}
.hero .tag{display:inline-block;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--coral);border:1px solid rgba(251,113,133,.4);padding:7px 18px;border-radius:50px;margin-bottom:26px;position:relative}
.hero h1{font-size:4.2rem;font-weight:800;letter-spacing:-.03em;margin-bottom:22px;position:relative}
.hero p{color:var(--muted);font-size:1.12rem;max-width:580px;margin:0 auto 34px;position:relative}
.hero-imgs{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:18px;margin-top:60px;position:relative}
.hero-imgs img{border-radius:20px;aspect-ratio:3/4;object-fit:cover}
.hero-imgs img:nth-child(2){aspect-ratio:3/4;margin-top:-30px}

/* sections */
.sec-head{text-align:center;max-width:640px;margin:0 auto 56px}
.sec-head .lab{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--coral)}
.sec-head h2{font-size:2.8rem;font-weight:800;letter-spacing:-.02em;margin:14px 0 12px}
.sec-head p{color:var(--muted)}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.gcard{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:38px 30px;transition:.3s;text-align:center}
.gcard:hover{transform:translateY(-8px);border-color:rgba(217,70,239,.4)}
.gcard .ic{width:56px;height:56px;margin:0 auto 20px}
.gcard h3{font-size:1.35rem;font-weight:700;margin-bottom:10px}
.gcard p{color:var(--muted);font-size:.95rem}

/* styles grid */
.styles{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.scard{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:16/10}
.scard img{width:100%;height:100%;object-fit:cover;transition:.4s}
.scard:hover img{transform:scale(1.06)}
.scard .ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(15,10,30,.9),transparent 60%);display:flex;flex-direction:column;justify-content:flex-end;padding:28px}
.scard h3{font-size:1.6rem;font-weight:700}
.scard .meta{color:var(--coral);font-size:.9rem;margin-top:4px}

/* split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center}
.split-img{border-radius:24px;overflow:hidden;aspect-ratio:4/3}
.split-img img{width:100%;height:100%;object-fit:cover}
.split h2{font-size:2.6rem;font-weight:800;letter-spacing:-.02em;margin-bottom:18px}
.split p{color:var(--muted);margin-bottom:14px}
.ulist{list-style:none;margin-top:8px}
.ulist li{padding:11px 0 11px 30px;position:relative;color:var(--muted);border-bottom:1px solid var(--line)}
.ulist li:before{content:'✦';position:absolute;left:0;color:var(--fuchsia)}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.stat{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:36px 20px}
.stat .n{font-size:2.8rem;font-weight:800;background:linear-gradient(100deg,var(--fuchsia),var(--coral));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.stat .l{color:var(--muted);font-size:.9rem;margin-top:4px}

/* schedule table */
.sched{display:grid;gap:14px}
.srow{display:grid;grid-template-columns:120px 1fr auto;gap:20px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px 26px;transition:.25s}
.srow:hover{border-color:rgba(217,70,239,.4)}
.srow .day{font-weight:700;color:var(--coral)}
.srow .cls{font-weight:600}
.srow .time{color:var(--muted);font-size:.9rem}

/* trainers */
.trainers{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.tcard{background:var(--card);border:1px solid var(--line);border-radius:22px;overflow:hidden}
.tcard img{aspect-ratio:1;object-fit:cover}
.tcard .b{padding:24px}
.tcard h3{font-size:1.3rem;font-weight:700}
.tcard .role{color:var(--coral);font-size:.88rem;margin:4px 0 10px}
.tcard p{color:var(--muted);font-size:.9rem}

/* page hero */
.page-hero{padding:80px 0 50px;text-align:center;position:relative;overflow:hidden}
.page-hero:before{content:'';position:absolute;top:-40%;left:50%;transform:translateX(-50%);width:600px;height:600px;background:radial-gradient(circle,rgba(124,58,237,.22),transparent 60%);filter:blur(40px)}
.page-hero .tag{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--coral);position:relative}
.page-hero h1{font-size:3.4rem;font-weight:800;letter-spacing:-.02em;margin:14px 0 12px;position:relative}
.page-hero p{color:var(--muted);max-width:560px;margin:0 auto;position:relative}

/* contacts */
.info-row{display:flex;gap:18px;padding:20px 0;border-bottom:1px solid var(--line)}
.info-row .ico{font-size:1.4rem}
.info-row h4{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:4px;font-weight:600}
.form{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:40px}
.form h3{font-size:1.6rem;font-weight:700;margin-bottom:20px}
.form input,.form select,.form textarea{width:100%;padding:14px 16px;margin-bottom:14px;border:1px solid var(--line);border-radius:12px;font-family:'Poppins';font-size:.96rem;background:var(--bg2);color:#fff}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--fuchsia)}
.form input::placeholder,.form textarea::placeholder{color:var(--muted)}
.ok{display:none;margin-top:14px;color:var(--coral);font-weight:600}
.map{border-radius:20px;overflow:hidden;height:380px;border:1px solid var(--line)}
.map iframe{width:100%;height:100%;border:0;filter:invert(.9) hue-rotate(180deg)}

/* legal */
.legal{max-width:760px;margin:0 auto}
.legal h2{font-size:1.4rem;font-weight:700;margin:30px 0 10px}
.legal p{color:var(--muted);margin-bottom:10px}

/* footer */
.dz-foot{background:var(--bg2);padding:64px 0 30px;border-top:1px solid var(--line)}
.dz-foot .top{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px;padding-bottom:40px;border-bottom:1px solid var(--line)}
.dz-foot .logo{font-weight:800;font-size:1.3rem;margin-bottom:12px}
.dz-foot .logo span{background:linear-gradient(100deg,var(--fuchsia),var(--coral));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.dz-foot p{color:var(--muted);font-size:.92rem}
.dz-foot h4{font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:14px;font-weight:600}
.dz-foot a{display:block;color:var(--muted);font-size:.94rem;padding:5px 0;transition:.2s}
.dz-foot a:hover{color:#fff}
.foot-bot{padding-top:24px;color:var(--muted);font-size:.84rem;text-align:center;opacity:.7}

/* cookie */
#cookie{position:fixed;left:24px;bottom:24px;max-width:380px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px;z-index:100;display:none;box-shadow:0 20px 50px -20px rgba(0,0,0,.6)}
#cookie.show{display:block}
#cookie p{font-size:.9rem;color:var(--muted);margin-bottom:14px}
#cookie .btns{display:flex;gap:10px}
#cookie button{flex:1;padding:11px;border-radius:30px;border:none;cursor:pointer;font-family:'Poppins';font-size:.9rem;font-weight:600}
.ck-ok{background:linear-gradient(100deg,var(--vio),var(--fuchsia));color:#fff}
.ck-no{background:var(--bg2);color:var(--muted)}

/* reveal */
.reveal{opacity:0;transform:translateY(30px);transition:.7s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

@media(max-width:880px){
.dz-menu{display:none;position:absolute;top:78px;left:0;right:0;background:var(--bg2);flex-direction:column;padding:18px 26px;gap:0;border-bottom:1px solid var(--line)}
.dz-menu.open{display:flex}.dz-menu a{padding:12px 0;border-bottom:1px solid var(--line)}
.dz-burger{display:block}
.hero h1{font-size:2.7rem}.hero-imgs{grid-template-columns:1fr 1fr}.hero-imgs img:nth-child(3){display:none}.hero-imgs img:nth-child(2){margin-top:0}
.grid3,.trainers{grid-template-columns:1fr}.styles{grid-template-columns:1fr}.split{grid-template-columns:1fr;gap:30px}
.stats{grid-template-columns:repeat(2,1fr)}.dz-foot .top{grid-template-columns:1fr}
.srow{grid-template-columns:1fr;gap:6px}.page-hero h1{font-size:2.4rem}
}
