/* --- исходные стили hero из icx_fest.html --- */

@font-face { font-family:'Montserrat'; font-weight:800; font-style:normal;
  src:url(../fonts/font-01.woff2) format('woff2'),
      url(../fonts/font-02.woff2) format('woff2'); }
@font-face { font-family:'Rubik'; font-weight:900; font-style:normal;
  src:url(../fonts/font-03.woff2) format('woff2'),
      url(../fonts/font-04.woff2) format('woff2'); }
* { margin:0; padding:0; box-sizing:border-box; }
html,body { background:#3a3a5a; }
.stage { position:relative; width:1440px; height:800px; overflow:hidden;
  background:#6BA6DE; font-family:'Montserrat',sans-serif; }
.stage img { position:absolute; display:block; }
.skew { display:inline-block; transform:skewX(-10.4deg); transform-origin:left bottom; }
/* layers */
.l  { position:absolute; }
.txt { position:absolute; font-family:'Montserrat',sans-serif; font-weight:800;
  text-transform:uppercase; white-space:nowrap; }

/* --- стили секций полной страницы --- */

:root{
  --navy:#080245; --blue:#6BA6DE; --cream:#FCEBDD; --cream2:#F9E9DC;
  --orange:#F36D2A; --pink:#E794BD; --pink2:#E890BB; --lime:#C6D54E; --green:#4D7747;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--navy);font-family:'Montserrat',sans-serif;color:var(--cream)}
.skew{display:inline-block;transform:skewX(-10.4deg);transform-origin:left bottom}
.page{width:100%;max-width:1440px;margin:0 auto;position:relative;background:var(--navy);overflow-x:hidden}

/* sticky nav */
.nav{position:sticky;top:0;z-index:50;height:60px;background:rgba(8,2,69,.94);
  backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:space-between;
  padding:0 60px;border-bottom:2px solid rgba(255,255,255,.08)}
.nav .brand{font-family:'Rubik',sans-serif;font-weight:900;font-size:24px;color:var(--cream);letter-spacing:-1px}
.nav .anchors{display:flex;gap:28px}
.nav .anchors a{color:var(--cream);text-decoration:none;font-weight:700;font-size:13px;
  text-transform:uppercase;letter-spacing:.04em;opacity:.85}
.nav .anchors a:hover{opacity:1;color:var(--lime)}
.nav .go{background:var(--orange);color:var(--cream);border:none;font-weight:800;font-size:14px;
  text-transform:uppercase;padding:11px 22px;cursor:pointer}
.nav .go .skew{font-weight:800}

/* hero wrapper — stage scales to fit width via JS */
.hero-wrap{width:100%;height:800px;overflow:hidden}
.hero-wrap .stage{transform-origin:top left}
.mobile-hero{display:none}

/* generic section */
section{padding:96px 60px;position:relative;overflow:hidden}
.kicker{font-weight:800;text-transform:uppercase;letter-spacing:.02em;font-size:16px;margin-bottom:14px;color:var(--orange)}
h2{font-family:'Rubik',sans-serif;font-weight:900;text-transform:uppercase;line-height:.9;
  letter-spacing:-2px;transform:skewX(-3deg);font-size:76px}
.lead{font-weight:600;font-size:20px;line-height:1.5;max-width:720px;margin-top:22px}

/* about */
.about{background:var(--navy)}
.about h2{color:var(--cream)}
.stats{display:flex;gap:40px;margin-top:56px;flex-wrap:wrap}
.stat .snum{font-family:'Rubik',sans-serif;font-weight:900;font-size:64px;line-height:1;letter-spacing:-2px}
.stat .slab{font-weight:700;text-transform:uppercase;font-size:14px;letter-spacing:.05em;margin-top:6px;color:var(--cream)}

/* disciplines */
.disciplines{background:var(--blue)}
.disciplines h2{color:var(--navy)}
.disciplines .kicker{color:var(--navy)}
.disc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:52px}
.disc{background:var(--cream);overflow:hidden;box-shadow:0 10px 30px rgba(8,2,69,.15);
  display:flex;flex-direction:column}
.disc-photo{flex:1;min-height:150px;background:repeating-linear-gradient(-45deg,#e7d9c8 0 14px,#efe3d5 14px 28px);
  display:flex;align-items:center;justify-content:center;color:#b7a690;font-weight:700;font-size:13px;
  text-transform:uppercase;letter-spacing:.05em}
.disc-name{padding:14px 16px;font-weight:800;font-size:20px;text-transform:uppercase;
  display:flex;align-items:center;min-height:56px}

/* program */
.program{background:var(--navy)}
.program h2{color:var(--cream)}
.pdate{font-weight:800;color:var(--lime);text-transform:uppercase;margin-top:10px;font-size:18px}
.timeline{margin-top:44px;max-width:900px}
.prow{display:flex;gap:26px;align-items:center;padding:20px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.ptime{min-width:120px}
.ptime .skew{font-family:'Rubik',sans-serif;font-weight:900;font-size:34px;color:var(--orange)}
.ptext{font-weight:600;font-size:18px;color:var(--cream)}
.btn-o{display:inline-block;margin-top:40px;background:var(--orange);color:var(--cream);
  border:none;font-weight:800;font-size:17px;text-transform:uppercase;padding:16px 34px;cursor:pointer;text-decoration:none}

/* map */
.mapsec{background:var(--cream)}
.mapsec h2,.mapsec .kicker{color:var(--navy)}
.mapsec .kicker{color:var(--orange)}
.map-flex{display:flex;gap:44px;margin-top:48px;align-items:flex-start}
.map-flex img{width:760px;border:4px solid var(--navy);display:block}
.legend{list-style:none;columns:1;flex:1}
.legend li{display:flex;align-items:center;gap:14px;padding:9px 0;color:var(--navy);font-weight:700;font-size:17px}
.legend b{width:30px;height:30px;border-radius:50%;background:var(--orange);color:var(--cream);
  display:flex;align-items:center;justify-content:center;font-size:14px;flex:none}
.map-note{margin-top:22px;color:var(--navy);font-weight:600;font-size:14px;opacity:.7}

/* stars */
.stars{background:#06012f}
.stars h2{color:var(--cream)}
.stars .lead{color:var(--cream)}
.star-stats{display:flex;gap:40px;margin-top:34px;flex-wrap:wrap}
.star-stats .ss{font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.03em}
.star-stats .ss b{font-family:'Rubik',sans-serif;font-weight:900;font-size:40px;display:block;color:var(--lime);letter-spacing:-1px}
.guests{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:52px}
.guest{background:#0d0752;border:1px solid rgba(255,255,255,.1)}
.guest .gphoto{height:230px;background:repeating-linear-gradient(-45deg,#141063 0 16px,#1a1470 16px 32px);
  display:flex;align-items:center;justify-content:center;color:#5b55a0;font-weight:700;font-size:13px;text-transform:uppercase}
.guest .gname{padding:16px;font-family:'Rubik',sans-serif;font-weight:900;font-size:22px;color:var(--cream);text-transform:uppercase}
.guest .grole{padding:0 16px 16px;color:var(--pink);font-weight:700;font-size:13px;text-transform:uppercase}

/* gallery */
.gallery{background:var(--blue)}
.gallery h2,.gallery .kicker{color:var(--navy)}
.gal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px}
.gal{aspect-ratio:4/3;background:repeating-linear-gradient(-45deg,#5c98d0 0 16px,#67a2da 16px 32px);
  display:flex;align-items:center;justify-content:center;color:#e7f0fb;font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.05em}

/* registration */
.reg{background:var(--orange)}
.reg h2{color:var(--cream)}
.reg .kicker{color:var(--navy)}
.reg-flex{display:flex;gap:50px;margin-top:44px;align-items:flex-start}
.reg-intro{flex:1;color:var(--cream);font-weight:600;font-size:19px;line-height:1.55}
.reg-intro .free{display:inline-block;margin-top:20px;background:var(--navy);color:var(--cream);
  font-weight:800;text-transform:uppercase;padding:10px 18px;font-size:14px}
.form{flex:1;background:var(--cream);padding:34px}
.form label{display:block;font-weight:800;text-transform:uppercase;font-size:12px;color:var(--navy);
  letter-spacing:.05em;margin:16px 0 6px}
.form input:not([type=checkbox]),.form select{width:100%;padding:13px 14px;border:2px solid var(--navy);background:#fff;
  font-family:'Montserrat';font-size:15px;color:var(--navy)}
.form .row{display:flex;gap:14px}
.form .row>div{flex:1}
.form .consent{display:flex;gap:10px;align-items:flex-start;margin-top:18px;font-size:13px;color:var(--navy);font-weight:600}
.form .consent input{width:18px;height:18px;flex:none;margin-top:2px}
.form button{width:100%;margin-top:22px;background:var(--orange);color:var(--cream);border:none;
  font-weight:800;font-size:18px;text-transform:uppercase;padding:16px;cursor:pointer}

/* partners */
.partners{background:var(--navy);text-align:center}
.partners h2{color:var(--cream)}
.partners .kicker{color:var(--orange)}
.plogos{display:flex;flex-wrap:wrap;gap:44px;align-items:center;justify-content:center;margin-top:44px}
.plogo{height:56px;filter:none}

/* footer */
footer{background:#04001f;padding:64px 60px 40px;color:var(--cream)}
.foot-top{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap}
.foot-col h4{font-family:'Rubik',sans-serif;font-weight:900;font-size:16px;text-transform:uppercase;margin-bottom:14px;color:var(--cream)}
.foot-col a,.foot-col p{display:block;color:var(--cream);opacity:.8;text-decoration:none;font-weight:600;font-size:14px;margin-bottom:8px}
.foot-col a:hover{opacity:1;color:var(--lime)}
.socials{display:flex;gap:10px;margin-top:6px}
.socials span{background:rgba(255,255,255,.1);padding:8px 12px;font-weight:700;font-size:12px;text-transform:uppercase}
.foot-bottom{margin-top:48px;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-size:12px;opacity:.6}
.deco-star{position:absolute;width:120px;height:120px;opacity:.9;pointer-events:none}

/* ===== MOBILE HERO ===== */
.mobile-hero{position:relative;background:var(--blue);overflow:hidden;padding:84px 22px 0}
.mh-date{font-weight:800;text-transform:uppercase;color:var(--cream);font-size:18px;margin-bottom:10px}
.mh-title{font-family:'Rubik',sans-serif;font-weight:900;color:var(--cream);text-transform:uppercase;
  font-size:88px;line-height:.82;letter-spacing:-3px;transform:skewX(-3deg);margin:6px 0 0}
.mh-star{position:absolute;top:80px;right:24px;width:96px;height:96px}
.mh-star svg{width:100%;height:100%}
.mh-star span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:22px;color:var(--navy);transform:rotate(-6deg)}
.mh-sub{color:var(--navy);font-weight:700;font-size:16px;line-height:1.4;margin-top:18px;max-width:340px}
.mh-btns{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.mh-btn{display:inline-block;padding:14px 22px;font-weight:800;font-size:18px;text-transform:uppercase;
  color:var(--cream);text-decoration:none}
.mh-btn.orange{background:var(--orange)}.mh-btn.pink{background:var(--pink)}
.mh-art{position:relative;height:230px;margin:24px -22px 0}
.mh-art svg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ===== RESPONSIVE ===== */
@media(max-width:1120px){
  section{padding:76px 44px}
  h2{font-size:58px}
  .disc-grid{grid-template-columns:repeat(3,1fr)}
  .guests{grid-template-columns:repeat(2,1fr)}
  .map-flex{flex-direction:column}
  .map-flex img{width:100%}
  .stat .snum{font-size:52px}
  .nav .anchors{gap:18px}
  .nav .anchors a{font-size:12px}
}
@media(max-width:960px){
  .nav .anchors{display:none}
}
@media(max-width:720px){
  .hero-wrap{display:none}
  .mobile-hero{display:block}
  .nav{padding:0 20px;height:56px}
  .nav .anchors{display:none}
  .nav .brand{font-size:20px}
  .nav .go{padding:9px 16px;font-size:12px}
  section{padding:52px 22px}
  .kicker{font-size:14px}
  h2{font-size:40px;letter-spacing:-1px}
  .lead{font-size:16px;margin-top:18px}
  .stats{gap:22px 30px;margin-top:34px}
  .stat{min-width:120px}
  .stat .snum{font-size:44px}
  .disc-grid{grid-template-columns:repeat(2,1fr);gap:14px;margin-top:34px}
  .disc-photo{height:120px;font-size:11px}
  .disc-name{font-size:16px;padding:11px 13px}
  .pdate{font-size:15px}
  .timeline{margin-top:30px}
  .prow{flex-direction:column;align-items:flex-start;gap:4px;padding:16px 0}
  .ptime{min-width:0}
  .ptime .skew{font-size:26px}
  .ptext{font-size:16px}
  .legend li{font-size:15px}
  .star-stats{gap:20px}
  .star-stats .ss{font-size:13px}
  .star-stats .ss b{font-size:32px}
  .guests{grid-template-columns:repeat(2,1fr);gap:14px;margin-top:34px}
  .guest .gphoto{height:180px}
  .gal-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .reg-flex{flex-direction:column;gap:28px}
  .form{padding:22px}
  .form .row{flex-direction:column;gap:0}
  .plogos{gap:26px;margin-top:32px}
  .plogo{height:38px}
  .foot-top{flex-direction:column;gap:26px}
  .foot-bottom{flex-direction:column;gap:8px}
}
@media(max-width:420px){
  .mh-title{font-size:68px}
  .guests{grid-template-columns:1fr}
  h2{font-size:34px}
}
