/* Отдельная входная страница для посетителей мероприятий ПРОЗИ. */

.page-event{
  --event-bg:#f6f8f4;
  --event-ink:#12271a;
  --event-muted:#536259;
  min-height:100svh;
  display:grid;
  grid-template-rows:auto 1fr auto;
  background:var(--event-bg);
  color:var(--event-ink);
}

.event-header{
  position:relative;
  z-index:2;
}
.event-header__inner{
  height:88px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.event-city{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--green-ink);
  font-size:15px;
  font-weight:600;
}

.event-main{
  display:grid;
  align-items:center;
}
.event-hero{
  padding-block:clamp(26px,5vw,72px);
}
.event-hero__grid{
  max-width:1280px;
  display:grid;
  grid-template-columns:minmax(0,1.16fr) minmax(390px,.84fr);
  align-items:center;
  gap:clamp(44px,7vw,96px);
}
.event-copy{
  position:relative;
  z-index:1;
}
.event-kicker{
  margin-bottom:22px;
  color:var(--green-ink);
  font-size:14px;
  font-weight:700;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.event-copy h1{
  max-width:13ch;
  font-size:clamp(46px,5.2vw,72px);
  font-weight:600;
  line-height:1.02;
  letter-spacing:-.047em;
}
.event-lead{
  max-width:55ch;
  margin-top:28px;
  color:var(--event-muted);
  font-size:clamp(17px,1.55vw,20px);
  line-height:1.55;
}
.event-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:36px;
}
.event-btn{
  min-width:244px;
  min-height:62px;
  justify-content:space-between;
  padding-inline:28px;
  font-weight:600;
}
.event-btn .icon{
  transition:transform var(--t-fast) var(--ease);
}
.event-btn:hover .icon{
  transform:translateX(4px);
}
.page-event .btn--ghost{
  background:#fff;
}
.page-event .btn--ghost:hover{
  background:var(--green-soft);
}

.event-visual{
  position:relative;
  min-height:500px;
  overflow:hidden;
  border:1px solid rgba(25,117,55,.12);
  border-radius:40px;
  background:
    radial-gradient(circle at 50% 48%,rgba(255,255,255,.9) 0 18%,transparent 18.5%),
    linear-gradient(145deg,#eaf4e7 0%,#d9ebd3 100%);
  isolation:isolate;
}
.event-visual::before,
.event-visual::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  aspect-ratio:1;
  translate:-50% -50%;
  border:1px solid rgba(25,117,55,.17);
  border-radius:50%;
  z-index:-1;
}
.event-visual::before{ width:68%; }
.event-visual::after{ width:104%; }
.event-route{
  position:absolute;
  left:24%;
  right:24%;
  top:50%;
  height:2px;
  translate:0 -50%;
  background:repeating-linear-gradient(90deg,rgba(25,117,55,.34) 0 7px,transparent 7px 14px);
  rotate:-28deg;
  transform-origin:center;
}
.event-mark{
  position:absolute;
  left:50%;
  top:50%;
  width:142px;
  aspect-ratio:1;
  translate:-50% -50%;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#fff;
  box-shadow:0 22px 55px rgba(18,65,33,.17);
}
.event-mark img{
  width:126px;
}
.event-node{
  position:absolute;
  display:flex;
  align-items:center;
  gap:11px;
  min-width:146px;
  padding:12px 17px 12px 12px;
  border:1px solid rgba(25,117,55,.13);
  border-radius:999px;
  background:rgba(255,255,255,.94);
  color:var(--green-ink);
  font-size:15px;
  font-weight:700;
  box-shadow:0 14px 34px rgba(18,65,33,.11);
}
.event-node__icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--green-soft);
}
.event-node__icon .icon{
  width:22px;
  height:22px;
}
.event-node--people{
  left:7%;
  top:14%;
}
.event-node--business{
  right:7%;
  bottom:14%;
}

.event-footer{
  color:#6b766f;
  font-size:13px;
}
.event-footer__inner{
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid rgba(0,0,0,.08);
}

@media (max-width:960px){
  .event-hero__grid{
    grid-template-columns:minmax(0,1fr) minmax(320px,.72fr);
    gap:38px;
  }
  .event-copy h1{
    font-size:clamp(42px,5.8vw,60px);
  }
  .event-visual{
    min-height:430px;
  }
  .event-node{
    min-width:auto;
  }
}

@media (max-width:760px){
  .event-header__inner{ height:72px; }
  .event-hero{ padding-block:22px 42px; }
  .event-hero__grid{
    grid-template-columns:minmax(0,1fr);
    gap:42px;
  }
  .event-kicker{ margin-bottom:17px; }
  .event-copy h1{
    max-width:16ch;
    font-size:clamp(36px,10vw,48px);
    line-height:1.05;
  }
  .event-lead{
    max-width:43ch;
    margin-top:22px;
    font-size:17px;
  }
  .event-actions{
    display:grid;
    margin-top:28px;
  }
  .event-btn{
    width:100%;
    min-width:0;
    min-height:60px;
  }
  .event-visual{
    min-height:320px;
    border-radius:28px;
  }
  .event-mark{
    width:112px;
  }
  .event-mark img{ width:98px; }
  .event-node{
    padding:9px 13px 9px 9px;
    font-size:14px;
  }
  .event-node__icon{
    width:36px;
    height:36px;
  }
}

@media (max-width:420px){
  .event-city{ font-size:0; gap:0; }
  .event-city .icon{ width:22px; height:22px; }
  .event-copy h1{ font-size:36px; }
  .event-btn{
    min-height:60px;
    padding-inline:20px;
    gap:8px;
    font-size:16px;
  }
  .event-visual{ min-height:270px; }
  .event-node--people{ left:5%; top:10%; }
  .event-node--business{ right:5%; bottom:10%; }
  .event-node__icon{ display:none; }
  .event-node{ padding:10px 14px; }
  .event-footer__inner{ min-height:62px; }
}

@media (max-height:720px) and (min-width:761px){
  .event-header__inner{ height:72px; }
  .event-hero{ padding-block:18px 30px; }
  .event-copy h1{ font-size:clamp(42px,4.7vw,60px); }
  .event-kicker{ margin-bottom:14px; }
  .event-lead{ margin-top:20px; }
  .event-actions{ margin-top:26px; }
  .event-visual{ min-height:420px; }
  .event-footer__inner{ min-height:56px; }
}