/* BelaPass pre-launch pages. Copied from the legacy apps/beauty CSS modules (prelaunch.module.css and
   prelaunch-form.module.css, same class names) plus the few base rules the pages took from the Core globals. */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #fbf7f4; color: #17312d; font-family: Geist, "Segoe UI", Arial, sans-serif; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon { width: 1em; height: 1em; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vertical-align: -0.125em; }
.i15 { font-size: 15px; } .i16 { font-size: 16px; } .i18 { font-size: 18px; } .i20 { font-size: 20px; } .i22 { font-size: 22px; }
/* next/image "fill" equivalent */
.heroImage { position: absolute; inset: 0; width: 100%; height: 100%; }

.page {
  min-height: 100%;
  background: #fbf7f4;
  color: #17312d;
  --ink: #17312d;
  --rose: #c97e70;
  --rose-dark: #ac665c;
  --rose-soft: #ead0c8;
  --cream: #fbf7f4;
  --paper: #fffdfb;
  --muted: #766f6a;
  --line: #e9ddd7;
}

.header {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  width: 100%;
  padding: 20px max(24px, calc((100vw - 1240px) / 2));
  background: rgba(251, 247, 244, 0.92);
  border-bottom: 1px solid rgba(201, 126, 112, 0.12);
  backdrop-filter: blur(18px);
}

.wordmark,
.wordmarkFooter {
  position: relative;
  display: inline-flex;
  align-items: baseline;
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 36px;
  line-height: 1;
  letter-spacing: -0.045em;
}

.wordmark em,
.wordmarkFooter em {
  color: var(--rose);
  font-style: normal;
}

.wordmark small {
  position: absolute;
  left: 3px;
  top: 39px;
  width: max-content;
  color: #5e625f;
  font-family: Arial, sans-serif;
  font-size: 7px;
  font-weight: 700;
  letter-spacing: .36em;
}

.nav {
  display: flex;
  align-items: center;
  gap: 22px;
  color: #4e5d59;
  font-size: 14px;
  font-weight: 700;
}

.nav a { transition: color .2s ease, transform .2s ease; }
.nav a:hover { color: var(--rose-dark); }

.headerCta {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--ink);
  padding: 0 18px;
  color: #fff !important;
  box-shadow: 0 10px 30px rgba(23,49,45,.12);
}

.heroClient,
.partnerHero {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(460px, 1.08fr);
  align-items: stretch;
  max-width: 1340px;
  margin: 0 auto;
  padding: 54px 28px 64px;
}

.heroCopy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 620px;
  padding: 46px 54px 46px 0;
}

.eyebrow,
.eyebrowLight {
  display: inline-flex;
  width: max-content;
  align-items: center;
  border-radius: 999px;
  background: #f0ded8;
  padding: 8px 12px;
  color: #9c5f55;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.eyebrowLight {
  background: rgba(255,255,255,.12);
  color: #f7d9d1;
}

.heroCopy h1 {
  margin: 24px 0 18px;
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(54px, 6.4vw, 92px);
  font-weight: 500;
  line-height: .92;
  letter-spacing: -.055em;
}

.heroCopy h1 span { color: var(--rose); }
.heroCopy > p {
  max-width: 640px;
  margin: 0;
  color: #596560;
  font-size: 18px;
  line-height: 1.7;
}

.heroActions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.primary,
.secondary {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-radius: 999px;
  padding: 0 24px;
  font-size: 15px;
  font-weight: 900;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.primary {
  background: linear-gradient(135deg, #cb8273, #b76d60);
  color: #fff;
  box-shadow: 0 16px 36px rgba(183,109,96,.25);
}
.primary:hover { transform: translateY(-2px); box-shadow: 0 20px 44px rgba(183,109,96,.32); }
.secondary { border: 1px solid #dac9c2; background: rgba(255,255,255,.7); color: var(--ink); }

.trustRow,
.formFacts {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  margin-top: 24px;
  color: #64706c;
  font-size: 12px;
  font-weight: 700;
}
.trustRow span,
.formFacts span { display: inline-flex; align-items: center; gap: 5px; }
.trustRow svg,
.formFacts svg { color: var(--rose-dark); }

.heroVisual,
.partnerVisual {
  position: relative;
  min-height: 620px;
  overflow: hidden;
  border-radius: 34px;
  background: #e7d5ca;
  box-shadow: 0 36px 90px rgba(75,51,44,.16);
}

.heroImage { object-fit: cover; object-position: center; }

.floatingCard,
.partnerOverlayCard {
  position: absolute;
  left: 28px;
  bottom: 28px;
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: 330px;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 18px;
  background: rgba(255,253,251,.92);
  padding: 14px 16px;
  color: var(--ink);
  box-shadow: 0 18px 46px rgba(40,31,27,.14);
  backdrop-filter: blur(12px);
}
.floatingCard strong,
.partnerOverlayCard strong { display: block; font-size: 14px; }
.floatingCard small,
.partnerOverlayCard small { display: block; margin-top: 2px; color: #766f6a; font-size: 11px; }
.floatingIcon {
  display: inline-flex;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  flex: none;
  border-radius: 12px;
  background: #ecd1c8;
  color: #9e5f55;
}
.partnerOverlayCard > svg { color: var(--rose-dark); }

.brandStrip {
  display: flex;
  justify-content: center;
  gap: 18px;
  overflow: hidden;
  border-block: 1px solid #eaded8;
  background: #fffaf7;
  padding: 16px 24px;
  color: #9f7b71;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .2em;
}

.promiseSection,
.partnerPromise,
.partnerControlSection,
.howSection,
.faqSection,
.formSection {
  max-width: 1240px;
  margin: 0 auto;
  padding: 94px 28px;
}

.sectionHeading,
.sectionHeadingLeft {
  max-width: 760px;
  margin: 0 auto 42px;
  text-align: center;
}
.sectionHeadingLeft { margin-left: 0; text-align: left; }
.sectionHeading h2,
.sectionHeadingLeft h2,
.formIntro h2,
.founderSection h2 {
  margin: 18px 0 12px;
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(38px, 4.5vw, 60px);
  font-weight: 500;
  line-height: 1.02;
  letter-spacing: -.045em;
}
.sectionHeading p,
.sectionHeadingLeft p,
.formIntro p {
  color: var(--muted);
  font-size: 17px;
  line-height: 1.7;
}

.benefitGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 18px;
}
.benefitCard {
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--paper);
  padding: 30px;
  box-shadow: 0 18px 50px rgba(83,63,55,.05);
}
.iconBubble {
  display: inline-flex;
  width: 46px;
  height: 46px;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: #f1ddd7;
  color: #a86157;
}
.benefitCard h3 { margin: 20px 0 8px; font-size: 19px; }
.benefitCard p { margin: 0; color: #756d68; line-height: 1.65; }

.howSection { padding-top: 42px; }
.steps,
.flowGrid {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 14px;
}
.steps article,
.flowGrid article {
  min-height: 210px;
  border-radius: 22px;
  background: #17312d;
  padding: 26px;
  color: white;
}
.steps b,
.flowGrid article > span {
  display: inline-flex;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #d49a8d;
  color: #fff;
  font-size: 12px;
}
.steps h3,
.flowGrid h3 { margin: 42px 0 8px; font-size: 18px; }
.steps p,
.flowGrid p { margin: 0; color: #c7d0cd; line-height: 1.6; font-size: 14px; }
.prelaunchNote {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 18px;
  border-radius: 16px;
  background: #f1dfd9;
  padding: 16px 18px;
  color: #7d534b;
  font-size: 13px;
  font-weight: 700;
}

.founderSection {
  display: grid;
  grid-template-columns: .75fr 1.25fr;
  gap: 50px;
  max-width: 1340px;
  margin: 20px auto;
  border-radius: 34px;
  background: #18332e;
  padding: 64px;
  color: #fff;
}
.founderSection h2 { color: #fff; }
.founderCards { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.founderCards article { border: 1px solid rgba(255,255,255,.12); border-radius: 20px; background: rgba(255,255,255,.06); padding: 24px; }
.founderCards svg { color: #e0a79a; }
.founderCards strong { display: block; margin: 28px 0 8px; font-size: 16px; }
.founderCards p { margin: 0; color: #c5cfcc; font-size: 13px; line-height: 1.6; }

.formSection {
  display: grid;
  grid-template-columns: minmax(0,.8fr) minmax(500px,1.2fr);
  gap: 64px;
  align-items: start;
}
.formIntro { position: sticky; top: 120px; }
.formCard {
  border: 1px solid var(--line);
  border-radius: 28px;
  background: #fff;
  padding: 30px;
  box-shadow: 0 24px 70px rgba(90,66,56,.09);
}

.faqSection { padding-top: 40px; }
.faqGrid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
.faqGrid article { border-bottom: 1px solid #e1d5cf; padding: 24px 6px; }
.faqGrid h3 { margin: 0 0 8px; font-size: 17px; }
.faqGrid p { margin: 0; color: #746d68; line-height: 1.65; }

.partnerHero { padding-top: 62px; }
.zeroBadges { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.zeroBadges span { border: 1px solid #e2d2cc; border-radius: 999px; background: #fff; padding: 10px 13px; color: #625f5b; font-size: 12px; font-weight: 800; }
.zeroBadges strong { color: var(--rose-dark); font-size: 16px; }
.microcopy { margin-top: 10px !important; font-size: 12px !important; color: #867c76 !important; }
.partnerPromise { padding-bottom: 40px; }
.flowGrid article { background: #fff; color: var(--ink); border: 1px solid var(--line); }
.flowGrid h3 { color: var(--ink); }
.flowGrid p { color: #746d68; }
.partnerControlSection { padding-top: 56px; }

.footer {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 32px;
  border-top: 1px solid var(--line);
  background: #fffaf7;
  padding: 34px max(28px, calc((100vw - 1240px) / 2));
}
.footer p { margin: 0; color: #746d68; font-size: 13px; }
.footer > div { display: flex; gap: 16px; font-size: 12px; font-weight: 800; color: #5f6662; }
.wordmarkFooter { font-size: 28px; }

@media (max-width: 980px) {
  .nav > a:not(.headerCta) { display: none; }
  .heroClient,
  .partnerHero { grid-template-columns: 1fr; padding-top: 30px; }
  .heroCopy { min-height: auto; padding: 28px 0 40px; }
  .heroVisual,
  .partnerVisual { min-height: 560px; }
  .benefitGrid { grid-template-columns: 1fr; }
  .steps,
  .flowGrid { grid-template-columns: repeat(2,1fr); }
  .founderSection { grid-template-columns: 1fr; margin-inline: 22px; padding: 44px 30px; }
  .formSection { grid-template-columns: 1fr; }
  .formIntro { position: static; }
  .footer { grid-template-columns: 1fr; }
}

@media (max-width: 650px) {
  .header { padding: 16px 18px; }
  .wordmark { font-size: 30px; }
  .wordmark small { top: 32px; font-size: 6px; }
  .headerCta { min-height: 38px; padding-inline: 13px; font-size: 11px; }
  .heroClient,
  .partnerHero { padding: 22px 18px 46px; }
  .heroCopy h1 { font-size: 53px; }
  .heroCopy > p { font-size: 16px; }
  .heroVisual,
  .partnerVisual { min-height: 500px; border-radius: 24px; }
  .floatingCard,
  .partnerOverlayCard { left: 16px; right: 16px; bottom: 16px; }
  .brandStrip { justify-content: flex-start; white-space: nowrap; }
  .promiseSection,
  .partnerPromise,
  .partnerControlSection,
  .howSection,
  .faqSection,
  .formSection { padding: 66px 18px; }
  .sectionHeading h2,
  .sectionHeadingLeft h2,
  .formIntro h2,
  .founderSection h2 { font-size: 40px; }
  .steps,
  .flowGrid,
  .founderCards,
  .faqGrid { grid-template-columns: 1fr; }
  .steps article,
  .flowGrid article { min-height: 180px; }
  .formCard { padding: 20px; border-radius: 20px; }
  .primary,
  .secondary { width: 100%; }
  .founderSection { margin-inline: 12px; border-radius: 26px; }
}

/* Form (prelaunch-form.module.css) */
.shell { display:grid; gap:20px; }
.progress { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.progressText { color:#a15f55; font-size:11px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.progressBar { height:6px; flex:1; overflow:hidden; border-radius:999px; background:#f0e4df; }
.progressFill { height:100%; border-radius:999px; background:linear-gradient(90deg,#d18b7d,#b96f62); transition:width .25s ease; }
.stepTitle { margin:0 0 2px; color:#17312d; font-family:Georgia,"Times New Roman",serif; font-size:30px; font-weight:500; line-height:1.08; letter-spacing:-.03em; }
.stepCopy { margin:0 0 8px; color:#7b726d; font-size:13px; line-height:1.55; }
.grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.field { display:grid; gap:7px; }
.fieldFull { grid-column:1/-1; display:grid; gap:7px; }
.label { font-size:12px; font-weight:850; color:#334842; }
.input,.select,.textarea { width:100%; border:1px solid #ded0ca; border-radius:13px; background:#fffdfa; color:#17312d; font:inherit; outline:none; transition:border-color .2s ease, box-shadow .2s ease; }
.input:focus,.select:focus,.textarea:focus { border-color:#c78174; box-shadow:0 0 0 4px rgba(199,129,116,.11); }
.input,.select { height:50px; padding:0 13px; }
.textarea { min-height:108px; resize:vertical; padding:12px 13px; }
.choiceGrid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.choice { position:relative; display:flex; min-height:56px; align-items:center; gap:9px; border:1px solid #dfd2cc; border-radius:14px; background:#fffdfa; padding:12px 13px; color:#4d5d58; font-size:13px; font-weight:750; cursor:pointer; }
.choice input { accent-color:#b96f62; }
.check { display:flex; align-items:flex-start; gap:9px; color:#6d6863; font-size:11px; line-height:1.5; }
.check input { margin-top:2px; accent-color:#b96f62; }
.check a { color:#8c4f45; text-decoration:underline; text-underline-offset:2px; }
.actions { display:flex; gap:10px; margin-top:2px; }
.back,.submit { display:inline-flex; min-height:48px; align-items:center; justify-content:center; border:0; border-radius:999px; padding:0 19px; font-weight:900; cursor:pointer; }
.back { background:#f2e7e2; color:#6c5d58; }
.submit { flex:1; background:linear-gradient(135deg,#cb8273,#b66c60); color:#fff; box-shadow:0 12px 28px rgba(183,109,96,.18); }
.submit:disabled { opacity:.55; cursor:not-allowed; }
.message { border-radius:13px; padding:12px 14px; font-size:12px; }
.success { background:#e8f5ef; color:#246649; }
.error { background:#fff0ee; color:#a63c32; }
.successPanel { display:grid; justify-items:center; gap:13px; padding:34px 12px; text-align:center; }
.successIcon { display:inline-flex; width:58px; height:58px; align-items:center; justify-content:center; border-radius:50%; background:#eed5ce; color:#a45e54; font-size:28px; }
.successPanel h3 { margin:2px 0 0; color:#17312d; font-family:Georgia,"Times New Roman",serif; font-size:30px; font-weight:500; }
.successPanel p { max-width:430px; margin:0; color:#726b66; line-height:1.6; }
.honeypot { position:absolute!important; left:-10000px!important; width:1px!important; height:1px!important; overflow:hidden!important; }
@media (max-width:680px) { .grid,.choiceGrid { grid-template-columns:1fr; } .fieldFull { grid-column:auto; } .actions { flex-direction:column-reverse; } .back,.submit { width:100%; } }