/* The Guest List — landing page shown in front of the home page (index.html only).
   The hero type settings are carried over unchanged from guest-list-hero-test.html. */

.landing { display: none; }

html.landing-active { overflow: hidden; }

html.landing-active .landing {
  --hero-size: clamp(1.75rem, 6.4vw, 10rem);   /* one size drives both lines */
  position: fixed; inset: 0; z-index: 1000;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  overflow: hidden;
  padding: 0 5vw; box-sizing: border-box;
  background: #e9c9a0;                          /* shows only until the photo has loaded */
  color: #ffffff;
  cursor: default;
  -webkit-tap-highlight-color: transparent;
  outline: none;
}
html.landing-active .landing.landing-ready { cursor: pointer; }

.landing-bg {
  position: absolute; inset: 0; z-index: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  max-width: none;
  user-select: none; pointer-events: none;
}

.landing-hero {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; align-items: center;
}

/* Logo: width is set by the script to match the word GUEST; this is only the pre-measure fallback */
.landing-logo {
  display: block;
  width: calc(var(--hero-size) * 3.4);
  max-width: none;
  height: auto;
  margin: 0 auto 0.55em;
  will-change: transform, opacity, filter;
}

/* Primary: Century Gothic Regular, #ffffff, tracking 50, 110% horizontal scale applied per letter by the script */
.landing-title {
  margin: 0;
  font-family: "Century Gothic", CenturyGothic, "URW Gothic", "Apple Gothic", sans-serif;
  font-weight: 400;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: var(--hero-size);
  line-height: 1;
  white-space: nowrap;
  text-align: center;
}

/* Secondary: Montserrat Medium, #c1922d, tracking 200, 50% of the primary size */
.landing-subtitle {
  margin: 0.45em 0 0;
  font-family: "Montserrat", sans-serif;
  font-weight: 500;
  color: #c1922d;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  padding-left: 0.2em;                          /* offsets the trailing tracking so the word sits centred */
  font-size: calc(var(--hero-size) * 0.5);
  line-height: 1;
  white-space: nowrap;
  text-align: center;
}