/* Frankenplatz — Лозанна, 12 ноября. Экспортирует window.Lausanne.
   Собрана по образцу Day1/Day2. Билетов на вечер нет — все кнопки ведут
   в лист ожидания (модалка site/registration-form.js по ссылкам «#reg»). */
const {
  TopBar, Footer, Button, Badge, Eyebrow, Marquee, Card, ReliefBand,
} = (window.FrankenplatzDesignSystem_144b92||window.FrankenplatzDesignSystem_189784||{});
const { VoiceGrid } = window.FPSpeakerBits;

const LAU_NAV = window.FP_NAV("lausanne");

/* Тексты модалки — те же, что на /voices?day=0: заявки падают в одну роль. */
const LAU_REG = {
  title: "День в Лозанне,\n12 ноября",
  sub: "Casino de Montbenon, зал Paderewski. Оставь контакты — напишем, как только откроем запись и объявим время.",
  btn: "Записаться в лист ожидания",
  ok: "Ты в листе ожидания",
  okText: "Подтверждение отправили на {email}. Напишем, как только объявим время.",
};

function WaitBtn({ variant, children }) {
  return (
    <a className={"fp-btn fp-btn--" + (variant || "gold")} href="#reg" data-fp-action="lausanne-waitlist"
       data-fp-reg-title={LAU_REG.title} data-fp-reg-sub={LAU_REG.sub}
       data-fp-reg-day={LAU_REG.title} data-fp-reg-btn={LAU_REG.btn} data-fp-reg-role="Лист ожидания · Лозанна"
       data-fp-reg-ok={LAU_REG.ok} data-fp-reg-oktext={LAU_REG.okText}>{children}</a>
  );
}

function LauInsp({ k, t, children }) {
  return (
    <Card fill="gold" tone="gold" className="insp">
      <div className="k">{k}</div>
      <div className="t">{t}</div>
      <p className="d">{children}</p>
    </Card>
  );
}

function Lausanne() {
  return (
    <div className="kit">
      <div className="fp-backdrop"></div>
      <div className="fp-glow fp-glow--violet"></div>
      <div className="fp-glow fp-glow--amber"></div>

      <TopBar links={LAU_NAV} />

      <header className="hero gridbg" style={{ paddingBottom: 40 }}>
        <div className="inner">
          <div style={{ display: "flex", justifyContent: "flex-start", marginBottom: 8 }}>
            <Badge variant="gold" dot>Лозанна · 12 ноября · Casino de Montbenon</Badge>
          </div>
          <h1>Slavic Girls<br /><span className="hl">in Europe</span></h1>
          <p className="sub">День, который расставит все точки над i в темах <b style={{ color: "#fff", fontWeight: 600 }}>женской реализации, денег и карьеры, детей и семьи, энергии и красоты, тела и состояния</b>. Всё, о чём редко говорят вслух, мы открыто разберём.</p>
          <div className="d2-marq"><Marquee items={["Работа", "Деньги", "Семья", "Время для себя", "Работа", "Деньги", "Семья", "Время для себя", "Работа", "Деньги", "Семья", "Время для себя"]} /></div>
          <div style={{ marginTop: 44 }}>
            <WaitBtn>Записаться в лист ожидания</WaitBtn>
          </div>
        </div>
      </header>

      <section id="meaning" style={{ paddingTop: 48 }}>
        <div className="inner">
          <Eyebrow>О чём этот день</Eyebrow>
          <h2>Не только про деньги —<br /><span className="hl">про жизнь целиком</span></h2>
          <p className="lead">День с <b>Slavic Girls in Europe</b> — о том, как жить здесь и не разрываться: работа, семья, отношения, деньги и время для себя. Честно, без глянца и без стыда.</p>
          <div className="bm-cats bm-cats--even">
            <div className="bm-cat bm-cat--yes"><div className="bm-cat__k">Баланс</div><h4>Работа и жизнь</h4><p>Карьера, SVOё дело, дети — и где в этом расписании остаётся место для отдыха, друзей и себя.</p></div>
            <div className="bm-cat bm-cat--yes"><div className="bm-cat__k">Отношения</div><h4>Мужчины: какие они — и какие мы</h4><p>Партнёрство, деньги в паре, ожидания и роли. Что меняется после переезда и после десяти лет брака.</p></div>
            <div className="bm-cat bm-cat--yes"><div className="bm-cat__k">Деньги</div><h4>SVOё — без стыда</h4><p>SVOй доход, SVOя подушка, свои решения. Как говорить о деньгах вслух — дома и на работе.</p></div>
            <div className="bm-cat bm-cat--yes"><div className="bm-cat__k">Жизнь здесь</div><h4>Эмиграция и корни</h4><p>Новая страна, новый язык, новые правила — и как остаться собой, а не только «успевать всё».</p></div>
          </div>
          <p className="bm-note">Любой вопрос можно задать заранее — онлайн и анонимно. Ответ прозвучит в этот день.</p>
        </div>
      </section>

      <section id="topics">
        <div className="inner">
          <div className="nf-line nf-line--dash">
            <p className="nf-line__t"><b className="nf-line__b">Больше прикладных тем — в Бадене</b><br />Баден — 20 минут на поезде от Цюриха. 14 ноября — база: налоги и декларация, страховки, пенсия и 3-я колонна, жильё и ипотека, бюджет и подушка. 15 ноября — следующий уровень: инвестиции, недвижимость по миру, твёрдые активы, SVOё дело, бизнес-инструменты, PR и личный бренд, риски — с цифрами и инструментами.</p>
            <a className="fp-btn fp-btn--ghost" href="/day1">Программа Бадена →</a>
          </div>
        </div>
      </section>

      <section id="speakers">
        <div className="inner">
          <Eyebrow>Кто выйдет на сцену</Eyebrow>
          <h2>Кто и чем поделится<br /><span className="hl">с тобой в Лозанне</span></h2>
          <VoiceGrid day={0} more={{ first: true, title: "Твой вопрос может стать темой дня", body: "Нет времени на себя? Деньги — только через партнёра? Дети, работа и быт забирают всё? Напиши, что болит, — онлайн и анонимно. Самые частые вопросы станут темами, а состав спикеров ещё дополняется." }} />
          <div className="nf-line nf-line--dash" style={{ marginTop: 40 }}>
            <p className="nf-line__t"><span style={{ display: "block", marginBottom: 8, fontFamily: "var(--font-display)", fontWeight: 800, fontSize: "var(--fs-xs)", letterSpacing: ".14em", textTransform: "uppercase", color: "var(--gold)" }}>Финал дня</span><b className="nf-line__b">Мотивационный концерт</b><br />Музыка, которая заряжает: день заканчивается не усталостью от информации, а энергией и желанием действовать. Эта музыка останется с тобой — и ещё долго будет напоминать о смыслах и инсайтах этого дня. Имя артиста объявим скоро.</p>
          </div>
          <div className="bm-cats bm-cats--2 bm-cats--even">
            <div className="bm-cat bm-cat--yes"><div className="bm-cat__k">Всё по красоте</div><h4>Кабинет участницы и нетворкинг</h4><p>Личный кабинет форума, нетворкинг онлайн и офлайн — знакомства в этот день только начинаются.</p></div>
            <div className="bm-cat bm-cat--yes"><div className="bm-cat__k">Тот самый случай</div><h4>Для маленького чёрного, красного, синего — или платья в пол</h4><p>То самое платье, которое ждёт повода, наконец выходит в свет. День в атмосфере красоты и радости, которой так не хватает в рутине быта.</p></div>
          </div>
          <div className="cta-mid">
            <p className="cta-mid__note"><b>Бархат, рояль Steinway и люстры 1908 года.</b> В казино принято полагаться на удачу — а мы соберёмся, чтобы перестать играть в русскую рулетку со SVOIми деньгами, временем и здоровьем. Запишись — позовём раньше всех.</p>
            <WaitBtn>Записаться в лист ожидания</WaitBtn>
          </div>
        </div>
      </section>

      <section id="venue">
        <div className="inner">
          <Eyebrow>Где</Eyebrow>
          <h2>Casino de Montbenon,<br /><span className="hl">зал Paderewski</span></h2>
          <div className="bm-split">
            <div>
              <p className="lead">День пройдёт в самом сердце исторической Лозанны — в Casino de Montbenon, здании 1908 года на эспланаде Монбенон, построенном по образцу казино Монте-Карло. Центральный объём с башнями по бокам охраняется как культурная ценность национального значения — это и есть зал Paderewski, названный в честь пианиста и государственного деятеля Игнация Падеревского.</p>
              <ul className="bm-list bm-list--plain">
                <li><b>Бархатно-красный амфитеатр</b> — рояль Steinway & Sons на сцене, лепнина и свет исторических люстр.</li>
                <li><b>Под одной крышей</b> — Cinémathèque suisse с киноклассикой и кафе в фойе.</li>
                <li><b>Вокруг — сады</b> эспланады с видом на озеро и горы. В 1981 году здание отреставрировали под культурные события.</li>
              </ul>
            </div>
            <figure className="bm-split__media" style={{ margin: 0 }}><img src="site/img/lausanne-paderewski.jpg" width="640" height="480" alt="Зал Paderewski: красные кресла амфитеатром, сцена и кессонный потолок" loading="lazy" /></figure>
          </div>
          <p className="bm-note">Фото: Marino Trotta, Régis Colombo — Ville de Lausanne</p>
        </div>
      </section>

      <section id="route">
        <div className="inner">
          <Eyebrow>Адрес и дорога</Eyebrow>
          <h2>Allée Ernest-Ansermet 3,<br /><span className="hl">1003 Lausanne</span></h2>
          <div className="bm-split">
            <div>
              <p className="lead">Центр города, пять минут пешком от площади Сен-Франсуа и рядом с кварталом Флон.</p>
              <div className="bm-cats bm-cats--2">
                <div className="bm-cat bm-cat--yes"><div className="bm-cat__k">Поездом</div><h4>До Lausanne Gare</h4><p>Прямые поезда из Женевы, Цюриха, Берна и Фрибура. С вокзала — метро или 15 минут пешком в гору.</p></div>
                <div className="bm-cat bm-cat--yes"><div className="bm-cat__k">Метро</div><h4>m2 до Lausanne-Flon</h4><p>Одна остановка от вокзала, дальше около 5 минут пешком до эспланады.</p></div>
                <div className="bm-cat"><div className="bm-cat__k">Автобус</div><h4>Bel-Air или St-François</h4><p>Городские линии tl. Маршрут — в приложениях tl и SBB.</p></div>
                <div className="bm-cat"><div className="bm-cat__k">Машиной</div><h4>Паркинги рядом</h4><p>Подземные паркинги Montbenon и Flon — в нескольких минутах от входа.</p></div>
              </div>
              <div style={{ display: "flex", flexWrap: "wrap", gap: 12, marginTop: 30 }}>
                <a className="fp-btn fp-btn--ghost" href="https://www.google.com/maps/search/?api=1&query=Casino+de+Montbenon,+Allée+Ernest-Ansermet+3,+1003+Lausanne" target="_blank" rel="noopener">Открыть на карте →</a>
                <a className="fp-btn fp-btn--ghost" href="https://www.t-l.ch/" target="_blank" rel="noopener">Маршрут на t-l.ch →</a>
              </div>
            </div>
            <figure className="bm-split__media" style={{ margin: 0 }}><img src="site/img/lausanne-montbenon.jpg" width="640" height="480" alt="Casino de Montbenon: фасад с башнями и сад эспланады" loading="lazy" /></figure>
          </div>
        </div>
      </section>

      <section id="inspire">
        <div className="inner">
          <Eyebrow>Зачем тебе сюда</Eyebrow>
          <h2>Чтобы услышать ту,<br />которая уже прошла этот путь</h2>
          <p className="lead">Не лекция о финансах, а честный разговор о том, как женщины здесь совмещают деньги, дело и семью.</p>
          <div className="grid g3">
            <LauInsp k="Честно" t="Без глянца">Истории с цифрами и ошибками: что пошло не так и что в итоге сработало.</LauInsp>
            <LauInsp k="Рядом" t="SVOе окружение">Женщины, которые живут в Швейцарии и решают те же задачи, что и ты.</LauInsp>
            <LauInsp k="Для себя" t="SVOё время">Не только «как успеть всё», но и где в этом расписании остаёшься ты.</LauInsp>
          </div>
        </div>
      </section>

      <section style={{ paddingTop: 0 }}>
        <div className="inner">
          <div className="nf-line nf-line--dash">
            <p className="nf-line__t"><b className="nf-line__b">Хочешь больше цифр?</b><br />14 и 15 ноября в Бадене — два полных дня про налоги, пенсию, инвестиции и SVOё дело.</p>
            <a className="fp-btn fp-btn--ghost" href="/day1">Программа Бадена →</a>
          </div>
        </div>
      </section>

      <section id="reg" className="center gridbg">
        <div className="inner">
          <ReliefBand variant="final" className="band-shot"
            eyebrow={<Eyebrow center>Лозанна · 12 ноября · Frankenplatz 2026</Eyebrow>}
            title={<span className="lau-quote"><span className="lau-quote__b">Cherchez<br />la Slavic femme</span><span className="lau-quote__who">Madame Colette, Лозанна</span></span>}
            action={<div className="band-cows band-cows--lau"><img src="site/img/cow-lausanne-fr.png" width="820" height="1230" alt="" aria-hidden="true" /></div>}>
            <p className="fp-band__body">Joie de vivre — радость жизни по-французски: честные разговоры и ни одной ставки на удачу. Время объявим скоро: оставь контакты, напишем раньше всех. À bientôt!</p>
            <WaitBtn>Я с вами! Хочу-хочу-хочу</WaitBtn>
          </ReliefBand>
        </div>
      </section>

      <Footer />
    </div>
  );
}

window.Lausanne = Lausanne;