/* ==========================================================================
   Большая Лекция PRO Запуски — точная координатная копия макета Figma
   ========================================================================== */

@font-face { font-family:"Tilda Sans"; src:url("fonts/TildaSans-Light.woff2") format("woff2"); font-weight:300; font-style:normal; font-display:block; }
@font-face { font-family:"Tilda Sans"; src:url("fonts/TildaSans-Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:block; }
@font-face { font-family:"Tilda Sans"; src:url("fonts/TildaSans-Medium.woff2") format("woff2"); font-weight:500; font-style:normal; font-display:block; }
@font-face { font-family:"Tilda Sans"; src:url("fonts/TildaSans-Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:block; }
@font-face { font-family:"Tilda Sans"; src:url("fonts/TildaSans-Black.woff2") format("woff2"); font-weight:900; font-style:normal; font-display:block; }

@font-face { font-family:"Bebas Neue Pro"; src:url("fonts/BebasNeuePro-Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:block; }
@font-face { font-family:"Bebas Neue Pro"; src:url("fonts/BebasNeuePro-Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:block; }
@font-face { font-family:"Bebas Neue Pro Middle"; src:url("fonts/BebasNeuePro-Middle.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:block; }

@font-face { font-family:"Gilroy"; src:url("fonts/Gilroy-Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:block; }
@font-face { font-family:"Gilroy"; src:url("fonts/Gilroy-Semibold.woff2") format("woff2"); font-weight:600; font-style:normal; font-display:block; }
@font-face { font-family:"Gilroy"; src:url("fonts/Gilroy-Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:block; }

:root{
  --bg:#000000;
  --gold:#F2D2A8;
  --white:#FFFFFF;
  --plate:#FFFEFE;
  --muted:rgba(255,255,255,.6);
  --gradient-gold:linear-gradient(90deg, #7A4E16 16%, #9C6B27 78%, #C9954F 100%);
  --shadow-gold:0 6px 24px -2px rgba(201,149,79,.35);
  --page-w:393px;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:var(--bg);
  color:var(--white);
  font-family:"Tilda Sans", sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  display:flex;
  justify-content:center;
}

img{ max-width:none; display:block; }
b, strong{ font-weight:700; }
.gold{ color:var(--gold); }

/* Координатный канвас — точная копия фрейма Figma 393×11441.
   Высота НЕ фиксирована: верхняя часть — position:absolute по точным
   координатам Figma, нижняя (текстоёмкая) часть — обычный поток с
   margin-top, посчитанным из тех же зазоров Figma. Так реальный рендер
   шрифта не обрежет и не наложит контент, если высота абзаца на пару
   строк отличается от расчёта Figma. */
.page{
  position:relative;
  width:393px;
  background:var(--bg);
  overflow-x:clip;
}
.abs{ position:absolute; }

/* ---------- переиспользуемые текстовые стили (по style_ из Figma) ---------- */
.f-bebas-hero{ font-family:"Bebas Neue Pro", sans-serif; font-weight:700; font-size:45px; line-height:normal; letter-spacing:.08em; text-align:center; }
.f-bebas-28{ font-family:"Bebas Neue Pro", sans-serif; font-weight:700; font-size:28px; line-height:32px; letter-spacing:.03em; }
.f-bebas-28-reg{ font-family:"Bebas Neue Pro", sans-serif; font-weight:400; font-size:28px; line-height:32px; letter-spacing:.03em; }
.f-tilda-23{ font-family:"Tilda Sans", sans-serif; font-weight:700; font-size:23px; line-height:1.35; color:var(--white); }
.f-tilda-15-light{ font-family:"Tilda Sans", sans-serif; font-weight:300; font-size:15px; line-height:1.6; color:var(--white); }
.f-tilda-15-med{ font-family:"Tilda Sans", sans-serif; font-weight:500; font-size:15px; line-height:1.4; color:var(--white); }
.f-bebas-18{ font-family:"Bebas Neue Pro", sans-serif; font-weight:700; font-size:18px; letter-spacing:-.02em; line-height:1.3; }
.f-bebas-35{ font-family:"Bebas Neue Pro", sans-serif; font-weight:700; font-size:35px; letter-spacing:.03em; line-height:1.15; }
.f-bebas-38c{ font-family:"Bebas Neue Pro", sans-serif; font-weight:700; font-size:38px; letter-spacing:.03em; text-align:center; line-height:1.1; }
.f-bebas-42c{ font-family:"Bebas Neue Pro", sans-serif; font-weight:700; font-size:40px; letter-spacing:.04em; line-height:43px; text-align:center; }
.f-bebas-46{ font-family:"Bebas Neue Pro", sans-serif; font-weight:700; font-size:46px; letter-spacing:-.02em; line-height:1.1; color:var(--gold); }
.f-bebas-39{ font-family:"Bebas Neue Pro", sans-serif; font-weight:700; font-size:39px; letter-spacing:.03em; line-height:1.15; }
.f-bebas-30-muted{ font-family:"Bebas Neue Pro", sans-serif; font-weight:700; font-size:30px; letter-spacing:.03em; color:var(--muted); }
.f-bebas-100c{ font-family:"Bebas Neue Pro", sans-serif; font-weight:700; font-size:100px; letter-spacing:.03em; text-align:center; line-height:1; color:var(--white); }
.f-gilroy-25c{ font-family:"Gilroy", sans-serif; font-weight:700; font-size:25px; line-height:1em; letter-spacing:.02em; text-align:center; color:var(--white); }
.f-gilroy-28{ font-family:"Gilroy", sans-serif; font-weight:600; font-size:28px; color:var(--white); }
.f-tilda-18-list{ font-family:"Tilda Sans", sans-serif; font-weight:300; font-size:18px; line-height:normal; letter-spacing:0; color:#000; }
.f-tilda-17{ font-family:"Tilda Sans", sans-serif; font-weight:400; font-size:17px; line-height:normal; letter-spacing:0; color:#000; }
.f-bebas-15-label{ font-family:"Bebas Neue Pro", sans-serif; font-weight:700; font-size:15px; letter-spacing:0; color:var(--muted); white-space:nowrap; }
.f-tilda-20-plain{
  font-family:"Tilda Sans", sans-serif; font-weight:700; font-size:20px;
  color:var(--white); white-space:nowrap;
}
/* обёртка "перечёркнутых слов": позиционируется без поворота (по коорд. Figma),
   а поворот применяется к вложенному .strike-rot — так текст/линии крутятся
   каждый вокруг своего центра, а не левого верхнего угла */
.strike-wrap{
  position:absolute; display:flex; align-items:center; justify-content:center;
}
.strike-rot{ flex:none; }

/* ---------- hero portrait / коллаж переписки ---------- */
.hero-portrait{ overflow:hidden; border-radius:0 0 0 69px; }
.hero-portrait img{ width:100%; height:100%; object-fit:cover; }
.shot{ border-radius:12px; object-fit:cover; }

/* ---------- Плашки "Независимые запуски" ---------- */
.plate{
  background:var(--plate);
  color:#000;
  border-radius:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:6px 10px;
  font-family:"Tilda Sans", sans-serif;
  font-weight:700;
  font-size:14px;
  line-height:1.2;
}

/* ---------- Карточка "Внутри лекции" ---------- */
.card-white-bg{ background:var(--white); border-radius:8px; }
.card-white-bg ul{ list-style:none; margin:0; padding:0; }
.card-white-bg li{ position:relative; padding-left:18px; margin-bottom:22px; }
.card-white-bg li:last-child{ margin-bottom:0; }
.card-white-bg li::before{ content:"🔴"; position:absolute; left:0; top:4px; font-size:10px; }
.card-white-bg li b{ color:#000; }

/* ---------- Кнопки ---------- */
.btn-gold-bg{
  border:none; border-radius:50px; cursor:pointer;
  background:var(--gradient-gold); box-shadow:var(--shadow-gold);
  display:flex; align-items:center; justify-content:center;
  padding:0;
}
.btn-gold-bg:active{ transform:translateY(1px); }

/* ---------- Бонус-иконки ---------- */
.bonus-icon{ border-radius:12px; object-fit:cover; }

/* ---------- Кейсы ---------- */
.case-shot{ border-radius:12px; object-fit:cover; }

/* ---------- Отзывы: свайп-карусель ---------- */
.reviews-carousel{
  display:flex; align-items:center; gap:14px; overflow-x:auto;
  scroll-snap-type:x proximity;
  padding:0 30px;
  -webkit-overflow-scrolling:touch;
}
.reviews-carousel::-webkit-scrollbar{ display:none; }
.review-card{
  scroll-snap-align:center;
  flex:0 0 300px;
  background:var(--white);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 8px 24px rgba(0,0,0,.35);
}
.review-card img{ display:block; width:300px; height:auto; }

/* ---------- Письмо ---------- */
.letter-card-bg{ background:var(--white); opacity:.92; border-radius:20px; }

/* ---------- Модалка (Тильда-стиль поп-ап) ---------- */
.modal-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.72);
  display:none; align-items:center; justify-content:center;
  z-index:1000; padding:20px;
}
.modal-overlay.open{ display:flex; }
.modal{
  background:#111; border:1px solid var(--gold); border-radius:20px;
  width:100%; max-width:360px; padding:32px 24px; position:relative;
  color:var(--white);
}
.modal .close{
  position:absolute; top:14px; right:16px; background:none; border:none;
  color:var(--white); font-size:22px; cursor:pointer; line-height:1;
}
.modal h4{
  font-family:"Bebas Neue Pro", sans-serif; font-weight:700; font-size:26px;
  letter-spacing:.03em; margin:0 0 20px; text-align:center;
}
.modal form{ display:flex; flex-direction:column; gap:14px; }
.modal input{
  width:100%; padding:14px 16px; border-radius:10px; border:1px solid #444;
  background:#1c1c1c; color:var(--white); font-family:"Tilda Sans"; font-size:15px;
}
.modal input:focus{ outline:none; border-color:var(--gold); }
.phone-row{
  display:flex; align-items:stretch; gap:8px;
}
.phone-row .phone-code{
  flex:none; display:flex; align-items:center; justify-content:center;
  padding:14px 12px; border-radius:10px; border:1px solid #444;
  background:#1c1c1c; color:var(--gold); font-family:"Tilda Sans"; font-size:15px;
  font-weight:700; user-select:none;
}
.phone-row input{ flex:1; min-width:0; }
.modal .hint{ font-size:12px; opacity:.6; text-align:center; margin-top:10px; }
.modal .btn-gold-bg{ width:100%; height:56px; margin-top:6px; }
.modal .btn-gold-bg span{ font-size:16px; }