/* ==========================================================================
   LUMEN — Specyfikacja Wersji B
   Landing Page — Lista Zainteresowanych (Canva Replica)
   ========================================================================== */

:root {
  /* Kolory z oficjalnej specyfikacji */
  --color-bordo: #7A1235;    /* Tło start gradientu, tekst na przycisku */
  --color-sliwka: #6B1A4C;   /* Tło środek (48%) */
  --color-fiolet: #4E2F78;   /* Tło koniec gradientu (100%) */
  --color-white: #FFFFFF;    /* Nazwa LUMEN, teksty główne, przycisk */
  --color-roz-jasny: #F8DDE6;/* Hasło, etykiety */
  --color-lawenda: #E4D6F5;  /* Etykieta „Kiedy i gdzie” */

  /* Gradient tła (post 155°, story 160°, landing 155°) */
  --bg-gradient: linear-gradient(155deg, #7A1235 0%, #6B1A4C 48%, #4E2F78 100%);

  /* Poświata (dwie warstwy kół nad tłem, wyśrodkowane za nazwą) */
  --glow-layer-1: radial-gradient(circle,
    rgba(255, 232, 240, 0.62) 0%,
    rgba(255, 214, 228, 0.42) 20%,
    rgba(255, 205, 224, 0.20) 42%,
    rgba(255, 214, 228, 0.06) 58%,
    rgba(255, 214, 228, 0) 70%);

  --glow-layer-2: radial-gradient(circle,
    rgba(255, 214, 228, 0.18) 0%,
    rgba(255, 214, 228, 0.08) 40%,
    rgba(255, 214, 228, 0) 68%);

  /* Świecenie napisu LUMEN */
  --text-glow-lumen: 0 0 30px rgba(255, 236, 244, 0.75), 0 0 90px rgba(255, 214, 230, 0.6);

  /* Typografia: Jost */
  --font-family: 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Rozstrzelenie (letter-spacing) */
  --track-lumen: 0.24em;    /* Canva: 240 */
  --track-haslo: 0.46em;    /* Canva: 460 */
  --track-labels: 0.40em;   /* Canva: 400 */
  --track-tematy: 0.30em;   /* Canva: 300 */
  --track-button: 0.34em;   /* Canva: 340 */
}

/* ==========================================================================
   Reset & Base
   ========================================================================== */

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html, body {
  min-height: 100vh;
  background: var(--bg-gradient);
}

body {
  font-family: var(--font-family);
  color: var(--color-white);
  line-height: 1.4;
  overflow-x: hidden;
  position: relative;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ==========================================================================
   Poświata (dwie warstwy kół nad tłem, wyśrodkowane bezpośrednio za nazwą)
   ========================================================================== */

.lumen-title-wrapper {
  position: relative;
  display: inline-block;
  margin-bottom: 2rem;
}

/* warstwa 1, mniejsza i jaśniejsza */
.title-glow-layer-1 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(650px, 90vw);
  height: min(650px, 90vw);
  border-radius: 50%;
  background: var(--glow-layer-1);
  filter: blur(12px);
  pointer-events: none;
  z-index: 0;
  animation: glowPulse1 7s ease-in-out infinite alternate;
}

/* warstwa 2, większa i delikatniejsza */
.title-glow-layer-2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(1000px, 140vw);
  height: min(1000px, 140vw);
  border-radius: 50%;
  background: var(--glow-layer-2);
  filter: blur(30px);
  pointer-events: none;
  z-index: -1;
  animation: glowPulse2 10s ease-in-out infinite alternate;
}

@keyframes glowPulse1 {
  0% { transform: translate(-50%, -50%) scale(0.96); opacity: 0.85; }
  100% { transform: translate(-50%, -50%) scale(1.06); opacity: 1; }
}

@keyframes glowPulse2 {
  0% { transform: translate(-50%, -50%) scale(1.0); opacity: 0.75; }
  100% { transform: translate(-50%, -50%) scale(1.12); opacity: 0.95; }
}

/* ==========================================================================
   Landing Page Layout
   ========================================================================== */

.landing-page {
  position: relative;
  z-index: 2;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding: 2.25rem 2rem 5rem;
  max-width: 1180px;
  margin: 0 auto;
}

@media (max-width: 600px) {
  .landing-page {
    padding: 1.5rem 1.25rem 3.5rem;
  }
}

/* ==========================================================================
   Top Bar (Logos & Date)
   ========================================================================== */

.top-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding-bottom: 2rem;
}

.logos-group {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  flex-wrap: wrap;
}

.logo-slot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.55rem 1.15rem;
  border: 1px dashed rgba(255, 255, 255, 0.48);
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.05);
  min-height: 38px;
  box-sizing: border-box;
  transition: all 0.25s ease;
}

.logo-slot:hover {
  border-color: rgba(255, 255, 255, 0.8);
  background: rgba(255, 255, 255, 0.09);
}

.logo-slot-text {
  font-family: var(--font-family);
  font-size: 0.74rem;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-indent: 0.22em;
  text-transform: uppercase;
  color: var(--color-white);
  line-height: 1;
  white-space: nowrap;
  user-select: none;
}

.logo-slot.logo-annathedentist .logo-slot-text {
  color: var(--color-roz-jasny);
}

.brand-badge {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.brand-svg-icon {
  width: 19px;
  height: 19px;
  stroke: var(--color-white);
  flex-shrink: 0;
}

.brand-svg-icon.accent-icon {
  stroke: var(--color-roz-jasny);
}

.logo-text {
  font-size: 0.82rem;
  font-weight: 500;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--color-white);
  line-height: 1;
}

.logos-group .accent {
  color: var(--color-roz-jasny);
}

.logo-sep {
  opacity: 0.45;
  font-weight: 300;
  font-size: 1rem;
  color: var(--color-white);
  user-select: none;
}

.top-date {
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--color-roz-jasny);
}

@media (max-width: 640px) {
  .top-bar {
    flex-direction: column;
    gap: 0.75rem;
    text-align: center;
  }
}

/* ==========================================================================
   Main Content Area
   ========================================================================== */

.main-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 2rem 0;
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
}

/* Title: LUMEN */
.lumen-title {
  font-family: var(--font-family);
  font-weight: 300; /* 300 Light */
  font-size: clamp(4.5rem, 15vw, 12rem); /* 196px na dużym ekranie */
  letter-spacing: var(--track-lumen);   /* 0.24em (Canva: 240) */
  text-indent: var(--track-lumen);      /* Optyczne wyśrodkowanie */
  line-height: 0.9;
  text-transform: uppercase;
  color: var(--color-white);
  text-shadow: var(--text-glow-lumen);
  margin-bottom: 0;
  user-select: none;
}

/* Subtitle */
.lumen-subtitle {
  font-weight: 300;
  font-size: clamp(1.1rem, 2.2vw, 1.45rem);
  line-height: 1.4;
  color: var(--color-white);
  max-width: 660px;
  margin-bottom: 1.15rem;
}

/* Lead */
.lumen-lead {
  font-weight: 400;
  font-size: clamp(0.92rem, 1.6vw, 1.05rem);
  line-height: 1.5;
  color: var(--color-roz-jasny);
  max-width: 540px;
  margin-bottom: 2.25rem;
  opacity: 0.95;
}

/* Date divider: — LUTY 2027, WARSZAWA — */
.date-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 2.5rem;
  width: 100%;
}

.divider-text {
  font-size: 0.85rem;
  font-weight: 400;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--color-roz-jasny);
  opacity: 0.9;
}

/* ==========================================================================
   MailerLite Embedded Form Overrides & Styling (High Specificity)
   ========================================================================== */

.form-wrapper {
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
}

/* Clear white container backgrounds injected by MailerLite */
html body #mlb2-47224430,
html body #mlb2-47224430.ml-form-embedContainer,
html body #mlb2-47224430 .ml-form-align-center,
html body #mlb2-47224430.ml-form-embedContainer .ml-form-embedWrapper,
html body #mlb2-47224430.ml-form-embedContainer .ml-form-embedWrapper.embedForm,
html body #mlb2-47224430.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody,
html body #mlb2-47224430.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBodyDefault {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 auto !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Hide empty MailerLite header & zero margins */
html body #mlb2-47224430.ml-form-embedContainer .ml-form-embedContent h4 {
  display: none !important;
}
html body #mlb2-47224430.ml-form-embedContainer .ml-form-embedContent {
  margin: 0 !important;
  padding: 0 !important;
}

/* MailerLite Form Row & Fields */
html body #mlb2-47224430.ml-form-embedContainer .ml-form-fieldRow {
  margin-bottom: 1.25rem !important;
  text-align: left !important;
  float: none !important;
  width: 100% !important;
}

html body #mlb2-47224430.ml-form-embedContainer .ml-form-fieldRow label {
  display: block !important;
  font-family: var(--font-family) !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
  letter-spacing: var(--track-labels) !important; /* 0.40em (Canva: 400) */
  text-transform: uppercase !important;
  color: var(--color-roz-jasny) !important;
  margin-bottom: 0.5rem !important;
  text-align: left !important;
}

/* Inputs: White rectangular boxes */
html body #mlb2-47224430.ml-form-embedContainer .ml-form-fieldRow input.form-control {
  width: 100% !important;
  height: 48px !important;
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(255, 255, 255, 0.4) !important;
  border-radius: 2px !important;
  color: #7A1235 !important;
  font-family: var(--font-family) !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  padding: 0 1rem !important;
  outline: none !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
  box-sizing: border-box !important;
  transition: all 0.2s ease !important;
}

html body #mlb2-47224430.ml-form-embedContainer .ml-form-fieldRow input.form-control:focus {
  border-color: #FFFFFF !important;
  box-shadow: 0 0 0 3px rgba(248, 221, 230, 0.45) !important;
}

/* Checkbox Row & Consent */
html body #mlb2-47224430.ml-form-embedContainer .ml-form-checkboxRow {
  margin-top: 1.25rem !important;
  margin-bottom: 1.5rem !important;
  text-align: left !important;
  float: none !important;
  width: 100% !important;
}

html body #mlb2-47224430.ml-form-embedContainer .ml-form-checkboxRow label.checkbox {
  display: flex !important;
  align-items: flex-start !important;
  gap: 0.65rem !important;
  cursor: pointer !important;
  text-align: left !important;
}

html body #mlb2-47224430.ml-form-embedContainer .ml-form-checkboxRow input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  margin-top: 3px !important;
  accent-color: #7A1235 !important;
  flex-shrink: 0 !important;
  cursor: pointer !important;
}

html body #mlb2-47224430.ml-form-embedContainer .ml-form-checkboxRow .label-description p {
  font-family: var(--font-family) !important;
  font-size: 0.74rem !important;
  font-weight: 300 !important;
  line-height: 1.45 !important;
  color: rgba(255, 255, 255, 0.85) !important;
  text-align: left !important;
}

html body #mlb2-47224430.ml-form-embedContainer .ml-form-checkboxRow .label-description a {
  color: var(--color-roz-jasny) !important;
  text-decoration: underline !important;
}

/* Submit Button: Solid White, text #7A1235, Jost 500 Medium, 0.34em letter-spacing */
html body #mlb2-47224430.ml-form-embedContainer .ml-form-embedSubmit {
  margin: 0 !important;
  float: none !important;
  width: 100% !important;
}

html body #mlb2-47224430.ml-form-embedContainer .ml-form-embedSubmit button.primary {
  width: 100% !important;
  height: 52px !important;
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  color: #7A1235 !important;
  font-family: var(--font-family) !important;
  font-size: 0.95rem !important;
  font-weight: 500 !important; /* 500 Medium */
  letter-spacing: var(--track-button) !important; /* 0.34em (Canva: 340) */
  text-indent: var(--track-button) !important;   /* Optyczne wyśrodkowanie */
  text-transform: uppercase !important;
  border: none !important;
  border-radius: 2px !important;
  cursor: pointer !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
  transition: all 0.2s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
}

html body #mlb2-47224430.ml-form-embedContainer .ml-form-embedSubmit button.primary:hover {
  background: #FFF2F6 !important;
  background-color: #FFF2F6 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(255, 236, 244, 0.4), 0 4px 15px rgba(0, 0, 0, 0.4) !important;
}

html body #mlb2-47224430.ml-form-embedContainer .ml-form-embedSubmit button.primary:active {
  transform: translateY(0) !important;
}

/* Success Message */
html body #mlb2-47224430.ml-form-embedContainer .ml-form-successBody {
  background: transparent !important;
  padding: 0 !important;
}

html body #mlb2-47224430.ml-form-embedContainer .ml-form-successContent {
  font-family: var(--font-family) !important;
  color: #FFFFFF !important;
  text-align: center !important;
  padding: 2rem 1rem !important;
}

html body #mlb2-47224430.ml-form-embedContainer .ml-form-successContent h4 {
  font-size: 1.35rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  margin-bottom: 0.5rem !important;
}

html body #mlb2-47224430.ml-form-embedContainer .ml-form-successContent p {
  font-size: 0.95rem !important;
  font-weight: 300 !important;
  color: var(--color-roz-jasny) !important;
}

/* ==========================================================================
   Footer
   ========================================================================== */

.landing-footer {
  width: 100%;
  margin-top: auto;
  padding-top: 3.5rem;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.footer-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem;
  text-align: center;
  font-size: 0.8rem;
  font-weight: 300;
  color: rgba(255, 255, 255, 0.65);
}

@media (min-width: 768px) {
  .footer-inner {
    flex-direction: row;
    text-align: left;
  }
}

.footer-copy {
  color: rgba(255, 255, 255, 0.65);
}

.footer-links {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.footer-links a {
  color: var(--color-roz-jasny);
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.footer-links a:hover {
  text-decoration: underline;
  opacity: 0.85;
}

.footer-sep {
  opacity: 0.35;
}