/* Free events hub: MABK soft-UI and Ice Halo design system, August 2026. */

body{
  --fe-blue:var(--accent);
  --fe-blue-ink:var(--accent-ink);
  --fe-line:rgba(90,108,140,.15);
  background:var(--bg);
}

.fe-hero{ position:relative; overflow:hidden; padding:116px 0 30px; }
.fe-hero::before{
  content:""; position:absolute; inset:-15% -10% -5%; pointer-events:none;
  background:
    radial-gradient(42% 45% at 82% 36%,rgba(45,127,249,.19),transparent 72%),
    radial-gradient(30% 34% at 12% 40%,rgba(255,255,255,.88),transparent 72%),
    radial-gradient(24% 30% at 72% 86%,rgba(166,208,255,.18),transparent 72%);
  animation:fe-aura 12s ease-in-out infinite alternate;
}
@keyframes fe-aura{ to{ transform:translate3d(0,-12px,0) scale(1.035); } }
.fe-hero .wrap{ position:relative; z-index:2; max-width:1340px; }
.rp-back{
  display:inline-flex; align-items:center; gap:8px; margin:0 0 18px 4px;
  color:var(--text-2); font-size:.88rem; font-weight:650;
  transition:color .25s,transform .25s var(--e-out);
}
.rp-back:hover{ color:var(--fe-blue-ink); transform:translateX(-3px); }

.fe-hero__grid{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(450px,.9fr);
  gap:clamp(30px,4vw,62px); align-items:center; min-height:650px;
  padding:16px 0 40px;
}
.fe-hero__copy{ position:relative; z-index:3; }
.rp-eyebrow{
  display:inline-flex; align-items:center; gap:10px; color:var(--fe-blue-ink);
  font-size:.72rem; font-weight:750; letter-spacing:.13em; text-transform:uppercase;
  animation:fe-copy-in .75s var(--e-out) both;
}
.rp-dot{ width:8px; height:8px; border-radius:50%; background:var(--live); box-shadow:0 0 0 7px rgba(52,199,89,.1); }
.fe-hero__title{
  max-width:720px; margin:24px 0 0; color:var(--text);
  font-family:var(--font-display); font-size:clamp(3.1rem,2.3rem + 3vw,5.15rem);
  font-weight:800; line-height:.96; letter-spacing:-.052em;
  text-shadow:0 4px 5px rgba(255,255,255,.9),0 8px 10px rgba(160,170,190,.2);
  animation:fe-copy-in .82s .07s var(--e-out) both;
}
.fe-hero__title .c-free{
  display:block; color:var(--fe-blue-ink); background:none;
  -webkit-background-clip:border-box; background-clip:border-box;
  -webkit-text-fill-color:currentColor; text-shadow:none;
}
.fe-hero__title-line{ display:block; margin-top:.1em; }
.fe-hero__lead{
  max-width:650px; margin:24px 0 0; color:var(--text-2);
  font-size:clamp(1rem,.94rem + .34vw,1.18rem); line-height:1.62;
  animation:fe-copy-in .82s .14s var(--e-out) both;
}
.fe-hero__acts{ display:flex; flex-wrap:wrap; gap:14px; margin-top:28px; animation:fe-copy-in .82s .21s var(--e-out) both; }
.fe-hero__acts .btn--primary{ min-width:180px; }
.fe-chips{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; animation:fe-copy-in .82s .28s var(--e-out) both; }
.fe-chip{
  display:inline-flex; align-items:center; gap:8px; padding:9px 14px;
  border-radius:var(--pill); background:var(--bg); box-shadow:var(--nm-sm);
  color:var(--text-2); font-size:.8rem; font-weight:650;
}
.fe-chip svg{ flex:none; color:var(--fe-blue-ink); }
@keyframes fe-copy-in{ from{ opacity:0; transform:translateY(24px); } to{ opacity:1; transform:none; } }

.fe-stage{ position:relative; min-height:610px; animation:fe-stage-in .95s .16s var(--e-out) both; }
@keyframes fe-stage-in{ from{ opacity:0; transform:translateX(34px) scale(.97); } to{ opacity:1; transform:none; } }
.fe-stage__visual{
  position:absolute; inset:-7% -24% -7% -20%; display:grid; place-items:center; overflow:hidden;
  -webkit-mask-image:
    linear-gradient(to right,transparent 0%,#000 18%,#000 78%,transparent 100%),
    linear-gradient(to bottom,transparent 0%,#000 15%,#000 82%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:
    linear-gradient(to right,transparent 0%,#000 18%,#000 78%,transparent 100%),
    linear-gradient(to bottom,transparent 0%,#000 15%,#000 82%,transparent 100%);
  mask-composite:intersect;
}
.fe-stage__visual::after{
  content:""; position:absolute; width:64%; height:18%; left:18%; bottom:9%; border-radius:50%;
  background:radial-gradient(ellipse,rgba(45,127,249,.18),transparent 70%); filter:blur(13px);
}
.fe-stage__visual img{
  width:100%; height:100%; object-fit:cover; object-position:center;
  filter:saturate(.92) contrast(.98); transform:scale(1.1);
  animation:fe-object-float 6.8s ease-in-out infinite;
}
@keyframes fe-object-float{ 50%{ transform:scale(1.1) translateY(-8px); } }
.fe-stage__index{
  position:absolute; z-index:3; left:14%; top:14%; display:flex; align-items:baseline; gap:7px;
  padding:12px 15px; border-radius:18px; color:var(--text); background:rgba(232,236,242,.92);
  box-shadow:var(--nm); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.fe-stage__index b{ color:var(--fe-blue-ink); font:800 1.28rem/1 var(--font-display); }
.fe-stage__index small{ color:var(--text-3); font-size:.67rem; font-weight:700; text-transform:uppercase; letter-spacing:.09em; }
.fe-next{
  position:absolute; z-index:5; right:0; bottom:36px; width:min(355px,74%);
  display:flex; flex-direction:column; gap:7px; padding:26px;
  border-radius:28px; color:#fff;
  background:linear-gradient(145deg,#2d7ff9,#1e6fff);
  box-shadow:9px 12px 30px rgba(45,127,249,.38),-7px -7px 18px rgba(255,255,255,.75);
  transition:transform .35s var(--e-soft),box-shadow .35s;
}
.fe-next::before{
  content:""; position:absolute; width:120px; height:120px; right:-24px; top:-35px;
  border-radius:50%; background:rgba(255,255,255,.1); pointer-events:none;
}
.fe-next:hover{ transform:translateY(-5px); box-shadow:12px 17px 36px rgba(45,127,249,.45),-7px -7px 18px rgba(255,255,255,.8); }
.fe-next__live{ display:inline-flex; align-items:center; gap:7px; color:#eaf2ff; font-size:.66rem; font-weight:750; letter-spacing:.12em; text-transform:uppercase; }
.fe-next__live i{ width:7px; height:7px; border-radius:50%; background:#fff; box-shadow:0 0 0 0 rgba(255,255,255,.45); animation:fe-pulse 2.3s ease-out infinite; }
.fe-next strong{ position:relative; font:750 1.12rem/1.22 var(--font-display); letter-spacing:-.02em; }
.fe-next__when{ color:#dce9ff; font-size:.82rem; }
.fe-next em{
  display:flex; align-items:center; justify-content:center; margin-top:8px; min-height:48px; padding:10px 18px;
  border-radius:var(--pill); background:var(--bg); color:var(--fe-blue-ink); box-shadow:0 8px 18px rgba(10,55,135,.2);
  font-size:.84rem; font-style:normal; font-weight:750;
}
@keyframes fe-pulse{ 70%{ box-shadow:0 0 0 8px rgba(255,255,255,0); } }

.fe-rail{ position:relative; z-index:5; padding:2px 0 28px; }
.fe-rail__row{ display:grid; grid-template-columns:repeat(5,1fr); gap:10px; }
.fe-rail a{
  display:flex; align-items:center; justify-content:center; gap:9px; min-height:52px; padding:10px 13px;
  border-radius:var(--pill); background:var(--bg); box-shadow:var(--nm-sm);
  color:var(--text-2); font-size:.84rem; font-weight:650; white-space:nowrap;
  transition:color .25s,box-shadow .3s,transform .3s var(--e-out);
}
.fe-rail a:hover{ color:var(--fe-blue-ink); box-shadow:var(--nm); transform:translateY(-2px); }
.fe-rail a span{ color:var(--fe-blue-ink); font:750 .64rem/1 var(--font-display); letter-spacing:.09em; }

.fe-sec{ position:relative; z-index:2; padding:58px 0 92px; }
.fe-head{ max-width:760px; margin:0 0 38px; text-align:left; }
.fe-head::before{
  content:"БЕСПЛАТНАЯ СЕРИЯ"; display:block; margin-bottom:14px;
  color:var(--fe-blue-ink); font:750 .68rem/1 var(--font-display); letter-spacing:.16em;
}
.fe-head h2{ margin:0; color:var(--text); font:800 clamp(2rem,1.35rem + 2.3vw,3.35rem)/1.02 var(--font-display); letter-spacing:-.045em; }
.fe-head p{ max-width:660px; margin:15px 0 0; color:var(--text-2); font-size:1rem; line-height:1.6; }

.fe-chapter{
  --chapter-accent:var(--fe-blue);
  display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,355px); gap:18px; align-items:stretch;
  margin:0 0 30px; padding:20px; scroll-margin-top:116px; overflow:hidden;
  border-radius:36px; background:var(--bg); box-shadow:var(--nm-lg);
}
.fe-chapter > div:first-child{
  display:grid;
  grid-template-columns:minmax(350px,1.05fr) minmax(300px,.95fr);
  grid-template-areas:
    "media kicker"
    "media title"
    "sub sub"
    "lead lead"
    "meta meta"
    "list list";
  grid-auto-rows:min-content;
  column-gap:clamp(22px,2.6vw,38px); align-content:center; min-width:0; padding-right:10px;
}
.fe-chapter__media{
  position:relative; grid-area:media; align-self:center; aspect-ratio:3840/2143; min-height:0; overflow:hidden;
  border:7px solid var(--bg); border-radius:28px; background:var(--raised); box-shadow:var(--nm-inset-sm);
}
.fe-chapter__media img{ width:100%; height:100%; min-height:0; object-fit:cover; transition:transform .7s var(--e-out); }
.fe-chapter:hover .fe-chapter__media img{ transform:scale(1.035); }
.fe-chapter__no{
  position:absolute; z-index:2; top:14px; left:14px; min-width:56px; padding:11px 13px;
  border-radius:16px; background:rgba(232,236,242,.93); color:var(--fe-blue-ink);
  box-shadow:var(--nm-sm); font:800 1.05rem/1 var(--font-display); letter-spacing:.04em;
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.fe-kicker{ grid-area:kicker; display:inline-flex; align-items:center; gap:8px; margin:0; color:var(--fe-blue-ink); font-size:.7rem; font-weight:750; letter-spacing:.12em; text-transform:uppercase; }
.fe-kicker i{ width:8px; height:8px; border-radius:50%; background:var(--live); box-shadow:0 0 0 6px rgba(52,199,89,.09); }
.fe-chapter h2{ grid-area:title; margin:13px 0 0; color:var(--text); font:800 clamp(1.55rem,1.22rem + 1vw,2.18rem)/1.1 var(--font-display); letter-spacing:-.035em; }
.fe-chapter__sub{ grid-area:sub; margin:18px 0 0; color:var(--fe-blue-ink); font-size:.93rem; font-weight:700; line-height:1.4; }
.fe-chapter__lead{ grid-area:lead; margin:13px 0 0; color:var(--text-2); font-size:.94rem; line-height:1.56; }
.fe-meta{ grid-area:meta; display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.fe-meta span{
  display:inline-flex; align-items:center; gap:6px; padding:8px 11px;
  border-radius:var(--pill); background:var(--bg); box-shadow:var(--nm-inset-sm);
  color:var(--text-2); font-size:.74rem; font-weight:650;
}
.fe-meta svg{ color:var(--fe-blue-ink); }
.fe-list{
  grid-area:list; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px 18px;
  margin:14px 0 0; padding:16px 18px; list-style:none;
  border-radius:20px; background:var(--raised); box-shadow:var(--nm-inset-sm);
}
.fe-list li{ display:flex; gap:9px; color:var(--text); font-size:.85rem; line-height:1.4; }
.fe-list svg{ flex:none; margin-top:2px; color:var(--live); }

.fe-chapter__form{ display:flex; min-width:0; }
.fe-chapter--flip{ grid-template-columns:minmax(0,1fr) minmax(320px,355px); }
.fe-chapter--flip .fe-chapter__form{ order:initial; }
.fe-form{
  position:relative; display:flex; flex:1; flex-direction:column; justify-content:center;
  min-height:100%; padding:clamp(24px,2.5vw,34px); overflow:hidden;
  border-radius:28px; background:var(--raised); box-shadow:var(--nm-sm);
}
.fe-form::before{
  content:""; position:absolute; width:190px; height:190px; right:-88px; top:-96px; border-radius:50%;
  background:radial-gradient(circle,rgba(45,127,249,.13),transparent 70%); pointer-events:none;
}
.fe-form h3{ position:relative; margin:0 0 6px; color:var(--text); font:800 1.24rem/1.2 var(--font-display); letter-spacing:-.025em; }
.fe-form p{ position:relative; margin:0 0 18px; color:var(--text-2); font-size:.84rem; line-height:1.48; }
.fe-form .field{ margin-bottom:11px; }
.fe-form .field input{ background:var(--bg); border:none; border-radius:16px; box-shadow:var(--nm-inset); }
.fe-form .field input:focus{ box-shadow:var(--nm-inset),0 0 0 2px var(--fe-blue); }
.fe-form .btn{ position:relative; margin-top:4px; }
.fe-form .form-consent{ position:relative; margin-top:12px; }
.fe-form .form-consent span{ font-size:10.5px; }
.fe-form__ok{
  position:absolute; inset:0; z-index:3; display:none; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; padding:24px; border-radius:inherit; background:var(--raised); text-align:center;
}
.fe-form__ok.show{ display:flex; }
.fe-form__ok svg{ color:var(--live); }
.fe-form__ok b{ color:var(--text); font:750 1.2rem/1.2 var(--font-display); }
.fe-form__ok span{ color:var(--text-2); font-size:.88rem; }
.fe-form__err[hidden]{ display:none; }
.fe-form__err{ color:#c0392b !important; font-size:12px !important; font-weight:650; text-align:center; }

.fe-why{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.fe-why article{
  position:relative; min-height:250px; overflow:hidden; padding:30px;
  border-radius:30px; background:var(--bg); box-shadow:var(--nm);
}
.fe-why article:first-child{ color:#fff; background:linear-gradient(145deg,#2d7ff9,#1e6fff); box-shadow:var(--nm-accent); }
.fe-why__ic{ display:grid; place-items:center; width:50px; height:50px; border-radius:16px; background:var(--bg); color:var(--fe-blue-ink); box-shadow:var(--nm-sm); }
.fe-why article:first-child .fe-why__ic{ color:var(--fe-blue-ink); background:#fff; box-shadow:0 9px 20px rgba(10,55,135,.18); }
.fe-why h3{ max-width:270px; margin:34px 0 8px; color:var(--text); font:750 1.1rem/1.25 var(--font-display); }
.fe-why article:first-child h3{ color:#fff; }
.fe-why p{ max-width:310px; margin:0; color:var(--text-2); font-size:.88rem; line-height:1.55; }
.fe-why article:first-child p{ color:#dce9ff; }

.fe-final{
  position:relative; overflow:hidden; padding:clamp(48px,6vw,76px);
  border-radius:38px; background:var(--bg); box-shadow:var(--nm-float); text-align:left;
}
.fe-final::before{
  content:""; position:absolute; width:640px; height:640px; right:-260px; top:-320px; border-radius:50%;
  background:radial-gradient(circle,rgba(45,127,249,.2),rgba(160,205,255,.08) 42%,transparent 72%);
}
.fe-final::after{
  content:"05"; position:absolute; right:.06em; bottom:-.3em;
  color:rgba(45,127,249,.07); font:800 clamp(150px,20vw,270px)/1 var(--font-display); letter-spacing:-.08em;
}
.fe-final__inner{ position:relative; z-index:1; max-width:730px; }
.fe-final h2{ margin:0; color:var(--text); font:800 clamp(2rem,1.35rem + 2.3vw,3.35rem)/1.02 var(--font-display); letter-spacing:-.045em; }
.fe-final p{ max-width:610px; margin:16px 0 28px; color:var(--text-2); line-height:1.6; }
.fe-final__acts{ display:flex; flex-wrap:wrap; justify-content:flex-start; gap:14px; }

[data-reveal]{ opacity:0; transform:translateY(24px); transition:opacity .7s var(--e-out),transform .7s var(--e-out); }
[data-reveal].is-in{ opacity:1; transform:none; }
[data-reveal][data-d="1"]{ transition-delay:.08s; }
[data-reveal][data-d="2"]{ transition-delay:.16s; }

@media (max-width:1180px){
  .fe-hero__grid{ grid-template-columns:minmax(0,1fr) minmax(390px,.86fr); }
  .fe-chapter > div:first-child{
    grid-template-columns:1fr;
    grid-template-areas:"media" "kicker" "title" "sub" "lead" "meta" "list";
    padding:0;
  }
  .fe-chapter__media{ min-height:0; aspect-ratio:3840/2143; }
  .fe-chapter__media img{ min-height:0; }
  .fe-kicker{ margin-top:18px; }
  .fe-list{ grid-template-columns:1fr; }
}

@media (max-width:900px){
  .fe-hero__grid{ grid-template-columns:1fr; }
  .fe-stage{ min-height:560px; max-width:650px; }
  .fe-rail__row{ display:flex; overflow-x:auto; justify-content:flex-start; padding:6px 4px 12px; scrollbar-width:none; }
  .fe-rail__row::-webkit-scrollbar{ display:none; }
  .fe-rail a{ min-width:max-content; }
  .fe-chapter,.fe-chapter--flip{ grid-template-columns:1fr; }
  .fe-chapter__form{ order:initial; }
  .fe-form{ min-height:auto; }
}

@media (max-width:760px){
  .fe-hero{ padding-top:100px; }
  .rp-back{ margin:0 0 13px 3px; }
  .fe-hero__grid{ min-height:0; padding:16px 0 14px; gap:24px; }
  .rp-eyebrow{ font-size:.65rem; letter-spacing:.1em; }
  .fe-hero__title{ margin-top:20px; font-size:clamp(2.55rem,12vw,3.8rem); line-height:.96; }
  .fe-hero__lead{ margin-top:20px; font-size:.98rem; line-height:1.56; }
  .fe-hero__acts{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:22px; }
  .fe-hero__acts .btn{ min-width:0; padding:15px 10px; font-size:.84rem; }
  .fe-chips{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:20px; }
  .fe-chip{ justify-content:center; padding:9px 8px; font-size:.71rem; }
  .fe-chip:last-child{ grid-column:1/3; }
  .fe-stage{ min-height:475px; }
  .fe-stage__visual{ inset:-2% -30% 48px -24%; }
  .fe-stage__index{ left:12%; top:13%; padding:10px 13px; }
  .fe-next{ right:0; bottom:10px; width:min(340px,88%); padding:20px; border-radius:23px; }
  .fe-next strong{ font-size:1rem; }
  .fe-next em{ min-height:44px; }
  .fe-rail{ padding-bottom:8px; }
  .fe-sec{ padding:48px 0 72px; }
  .fe-head{ margin-bottom:26px; }
  .fe-head h2{ font-size:2.25rem; }
  .fe-chapter{ padding:11px; border-radius:28px; gap:11px; margin-bottom:20px; }
  .fe-chapter > div:first-child{ padding:0 11px 13px; }
  .fe-chapter__media{ margin:0 -11px; min-height:0; aspect-ratio:3840/2143; border-width:5px; border-radius:22px; }
  .fe-chapter__media img{ min-height:0; }
  .fe-chapter h2{ font-size:1.65rem; }
  .fe-chapter__sub{ font-size:.88rem; }
  .fe-chapter__lead{ font-size:.89rem; }
  .fe-meta span{ font-size:.7rem; }
  .fe-form{ padding:23px 19px; border-radius:22px; }
  .fe-why{ grid-template-columns:1fr; }
  .fe-why article{ min-height:0; padding:25px; }
  .fe-why h3{ margin-top:24px; }
  .fe-final{ padding:40px 24px 44px; border-radius:30px; }
  .fe-final__acts{ display:grid; grid-template-columns:1fr; }
}

@media (max-width:390px){
  .fe-hero__title{ font-size:2.47rem; }
  .fe-chip{ font-size:.68rem; }
  .fe-stage{ min-height:455px; }
  .fe-next{ width:92%; }
}

@media (prefers-reduced-motion:reduce){
  .fe-hero::before,.rp-eyebrow,.fe-hero__title,.fe-hero__lead,.fe-hero__acts,.fe-chips,.fe-stage,.fe-stage__visual img,.fe-next__live i{ animation:none !important; }
  .fe-chapter__media img,.fe-next{ transition:none; }
  [data-reveal]{ opacity:1; transform:none; transition:none; }
}
