/* базовые переменные */
:root{
  --accent:#eab025;
  --dark:#080808;
  --radius:2rem;
  font-family:"Inter",system-ui,sans-serif;
  line-height:1.4;
}

/* сброс и базовая сетка */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

body{
  background:#000 url("images/cover.webp") center/cover no-repeat;
  color:#fff;
  text-align:center;
}

.hero{
  padding:4rem 1rem 2rem;
}
.hero__title{
  font-size:clamp(1.75rem,4vw,2.75rem);
  font-weight:600;
  margin-bottom:.5rem;
  background:linear-gradient(.28turn,#967c33 0%,#ffe6b4 49%,#966500 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}
.hero__date{
  font-size:1rem;
  letter-spacing:.05em;
  color:var(--accent);
}

.form-section{
  display:flex;
  justify-content:center;
  padding:2rem 1rem 4rem;
}
form{
  width:100%;
  max-width:24rem;
  display:flex;
  flex-direction:column;
  gap:1rem;
}
label span{
  display:block;
  margin-bottom:.25rem;
  font-size:.9rem;
  text-align:left;
  color:#d8d8d8;
}
input{
  width:100%;
  padding:.9rem 1rem;
  border:none;
  border-radius:var(--radius);
  font-size:1rem;
}
button{
  padding:1rem 2rem;
  border:none;
  border-radius:var(--radius);
  font-size:1.05rem;
  font-weight:600;
  background:linear-gradient(.28turn,#967c33 0%,#ffe6b4 49%,#966500 100%);
  color:#000;
  cursor:pointer;
  transition:opacity .2s;
}
button:disabled{opacity:.5;cursor:not-allowed;}
/* ---------- HERO ---------- */
.hero{
  background:#000; /* остаётся чёрным — можно заменить на изображение */
  padding:4rem 1rem;
  color:#fff;
}
.hero__inner{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(330px,1fr));
  gap:3rem;
  align-items:center;
  max-width:1200px;
  margin-inline:auto;
}

.hero__date{
  font-size:1rem;
  letter-spacing:.06em;
  margin-bottom:.75rem;
  color:#eab025;
}
.hero__title{
  font-size:clamp(2rem,4vw,3rem);
  font-weight:700;
  line-height:1.1;
  margin-bottom:1rem;
  background:linear-gradient(.28turn,#967c33 0%,#ffe6b4 49%,#966500 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}
.hero__subtitle{
  font-size:1.05rem;
  margin-bottom:2rem;
  color:#d4b96a;
}

/* Спикер + монетки */
.hero__speaker{position:relative;display:inline-block;margin-bottom:2rem;}
.hero__photo{width:260px;border-radius:1rem;display:block;}
.hero__coins{
  position:absolute;width:200px;top:50%;transform:translateY(-50%);
  pointer-events:none;opacity:.9;
}
.hero__coins--l{left:-170px;}
.hero__coins--r{right:-170px;transform:translateY(-50%) scaleX(-1);} /* зеркалим */

@media(max-width:767px){
  .hero__coins{display:none;}    /* прячем на узких экранах */
  .hero__photo{width:220px;}
}

.hero__note{font-size:.95rem;margin-bottom:1.5rem;color:#d8d8d8;}


/* ---------- Hero layout: десктоп ---------- */
@media (min-width: 992px){         /* ширина, с которой начинается «ПК-версия» */
  .hero__inner{
    /* вместо двух колонок делаем одну → контент, потом форма */
    grid-template-columns: 1fr;    /* 1 столбец */
    justify-items: center;         /* подравниваем по центру */
    row-gap: 1rem;
  }

  /* при желании сузим саму форму, чтобы она не растягивалась на всю ширину */
  .hero__formbox{
    max-width: 420px;
    width: 100%;
    margin-top: -10rem;              /* отступ сверху, чтобы форма «отпрыгнула» от контента */
    z-index: 99;
  }
}


/* ---------- Форма в Hero ---------- */
.hero__formbox{
  background:#111;
  padding:2rem;
  border-radius:1.5rem;
  box-shadow:0 0 20px rgba(0,0,0,.35);
}
.hero__btn{
  width:100%;
  background:linear-gradient(.28turn,#967c33 0%,#ffe6b4 49%,#966500 100%);
  color:#000;
}

/* ---------- Отступы в форме ---------- */
.hero__form .t-input-group          { margin-bottom: 10px; }
.hero__form .t-form__submit         { margin-top:    10px; }
.hero__form .t-form__submit button  { width: 100%; }   /* чтобы кнопка растягивалась на всю форму */