/* apply.css — Apply / nomination page
   All coordinates from Anima React export (Apply.tsx) + Figma.
   wrap_y = Anima_absolute_y − 113 (nav height).
   1440px fixed canvas, desktop-first. */

/* ─── 1. NOMINATION DATES ──────────────────────────────────────
   Figma: section top 113px (after nav), h 459px, bg #fffcf6.
   Two staggered label+date pairs connected by an arrow SVG.
   ─────────────────────────────────────────────────────────────── */
.ap-dates {
  position: relative;
  height: 459px;
  background: #fffcf6;
  border-bottom: 3px solid #e9a12d;
}

/* Soft amber pill behind each label+date pair */
.ap-dates-pill {
  position: absolute;
  height: 136px;
  width: 416px;
  background: #fff6e6;
  border-radius: 27px;
}
.ap-dates-pill--left  { left: 88px;  top: 88px; }
.ap-dates-pill--right { left: 64.79%; top: 200px; }

/* "Nominations accepted from:" / "Last date for submission:" */
.ap-dates-label {
  position: absolute;
  width: 416px;
  font-size: 32px;
  font-weight: 400;
  color: #405893;       /* --c-text-blue */
  text-align: center;
  line-height: 1.3;
  margin: 0;
}
.ap-dates-label--left  { left: 88px;  top: 107px; }
.ap-dates-label--right { left: 64.79%; top: 218px; }

/* Amber rounded date pill (October 25 / December 31) */
.ap-date-box {
  position: absolute;
  height: 95px;
  background: #e9a12d;
  border-radius: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ap-date-box--left  { left: 159px; top: 169px; width: fit-content; min-width: 180px; padding: 0 28px; }
.ap-date-box--right { left: 68.61%; top: 280px; width: fit-content; min-width: 180px; padding: 0 28px; }

.ap-date-box time {
  font-size: 36px;
  font-weight: 700;
  color: #fff;
  text-align: center;
}

/* Connector arrow between the two date groups */
.ap-dates-connector {
  position: absolute;
  left: 526px;
  top: 145px;
  width: 387px;
  height: 142px;
}

/* ─── 2. NOTICE BANNER ─────────────────────────────────────────
   Figma: top 575px, h 74px, bg #2a417d, text 32px bold white.
   ─────────────────────────────────────────────────────────────── */
.ap-banner {
  height: 74px;
  background: var(--c-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  font-weight: 700;
  color: #fff;
  text-align: center;
  padding: 0 var(--page-px);
}

/* ─── 3. INTRO TEXT ────────────────────────────────────────────
   Figma: top 703px (57px below banner bottom), w 962px centred,
   32px normal, color #d9982e, email link in bold.
   ─────────────────────────────────────────────────────────────── */
.ap-intro {
  width: 962px;
  margin: 0 auto;
  padding: 57px 0 30px;
  font-size: 24px;
  font-weight: 600;
  color: #202020;
  text-align: center;
  line-height: 1.4;
}
.ap-intro a {
  font-weight: 700;
  color: #d9982e;
  text-decoration: none;
}
.ap-intro a:hover { text-decoration: underline; }

/* ─── 4. DOCUMENT CARDS ────────────────────────────────────────
   Six full-image cards (designer assets), each 1010px wide centred.
   Number is baked into each card image.
   ─────────────────────────────────────────────────────────────── */
.ap-docs {
  padding-bottom: 81px;
  background: #F6F6F6;
}

.ap-card-full {
  display: block;
  width: 1010px;
  height: auto;
  margin: 0 auto;
}

.ap-card-full + .ap-card-full { margin-top: 48px; }

/* Mobile card alternatives — hidden on desktop, shown on mobile */
.ap-card-mobile { display: none; }

/* ─── 5. DISCLAIMER ────────────────────────────────────────────
   Rocket image left + disclaimer SVG text right.
   Figma: container 631×153px centred, gap 78px to footer.
   ─────────────────────────────────────────────────────────────── */
.ap-disclaimer {
  position: relative;
  width: 481px;
  height: 153px;
  margin: 0 auto 78px;
}
.ap-disclaimer-rocket {
  position: absolute;
  left: 0;
  top: 0;
  width: 222px;
  height: 153px;
  object-fit: contain;
}
.ap-disclaimer-text {
  position: absolute;
  left: 31px;
  top: 70px;
  width: 450px;
  margin: 0;
  font-family: var(--font-main);
  font-size: 24px;
  color: #2A427E;
  line-height: 1.35;
  text-align: center;
}