/* contact/index.css — Contact page composition. Mobile-first.
   Layout: hero-cms (default center 576) + contact-form (576w max, gap 24).
   Hero pt 104. form pb 232. page-glow bottom at frame 1545 → top=1447. */

/* ─── Atoms ────────────────────────────────────────────────────────── */
@import url('../../_components/atoms/field-label/field-label.css');
@import url('../../_components/atoms/field-input/field-input.css');
@import url('../../_components/atoms/field-input-wrap/field-input-wrap.css');
@import url('../../_components/atoms/field-textarea/field-textarea.css');
@import url('../../_components/atoms/btn-primary/btn-primary.css');
@import url('../../_components/atoms/terms-checkbox/terms-checkbox.css');

/* ─── Molecules ────────────────────────────────────────────────────── */
@import url('../../_components/molecules/hero-cms/hero-cms.css');

/* ─── Sections ─────────────────────────────────────────────────────── */
@import url('../../_components/sections/header-full/header-full.css');
@import url('../../_components/sections/footer-full/footer-full.css');
@import url('../../_components/sections/mobile-menu/mobile-menu.css');
@import url('../../_components/sections/age-gate-modal/age-gate-modal.css');
@import url('../../_components/sections/page-glow/page-glow.css');

/* ─── Page-scoped overrides ─────────────────────────────────────────── */

.page-contact [data-wins-counter] { display: none !important; }

.page-contact .contact-main {
  position: relative;
  overflow: hidden;
}

.page-contact .contact-container {
  position: relative;
  z-index: 1;
  padding: 88px 16px 0;
}

/* Contact form — inline pattern (page-scoped, single-use) */
.page-contact .contact-form {
  width: 100%;
  max-width: 576px;
  margin: 56px auto 0;
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  box-sizing: border-box;
}

.page-contact .contact-form__field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.page-contact .contact-form__agree {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  font-family: 'Nationale', system-ui, sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 24px;
  color: rgb(var(--color-subs));
  cursor: pointer;
}
.page-contact .contact-form__agree-link {
  font-weight: 600;
  color: rgb(var(--color-lead));
  text-decoration: none;
}
.page-contact .contact-form__agree-link:hover { text-decoration: underline; }

.page-contact .contact-form__submit {
  margin-top: 0;
}

.page-contact .contact-form-bottom-spacer {
  height: 96px;
}

/* ─── Desktop (≥1024) ─────────────────────────────────────────────── */
@media (min-width: 1024px) {
  .page-contact .contact-container {
    padding-top: 88px;
    padding-left: 0;
    padding-right: 0;
  }
  .page-contact .contact-form {
    margin-top: 64px;
    padding-left: 0;
    padding-right: 0;
  }
  .page-contact .contact-form-bottom-spacer {
    height: 232px;
  }
}
