.alp-contact-hero {
  position: relative;
  min-height: 100svh;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #fff;
}

.alp-contact-hero__bg,
.alp-contact-hero__bg img,
.alp-contact-hero__veil {
  position: absolute;
  inset: 0;
}

.alp-contact-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.08);
}

.alp-contact-hero__veil {
  background:
    radial-gradient(circle at 18% 20%, rgba(182, 135, 56, 0.33), transparent 52%),
    linear-gradient(130deg, rgba(8, 13, 10, 0.68) 20%, rgba(8, 13, 10, 0.44) 56%, rgba(8, 13, 10, 0.78) 100%);
}

.alp-contact-hero__content {
  position: relative;
  z-index: 2;
  max-width: 920px;
  text-align: center;
  padding: clamp(130px, 18vh, 200px) 24px 84px;
}

.alp-contact-hero h1 {
  margin: 12px 0 16px;
  font-size: clamp(2.9rem, 8.6vw, 7rem);
  line-height: 0.9;
  letter-spacing: -0.02em;
}

.alp-contact-hero__sub {
  margin: 0 auto;
  max-width: 700px;
  color: rgba(255, 255, 255, 0.9);
  font-size: clamp(1rem, 1.8vw, 1.2rem);
}

.alp-contact-hero__actions {
  margin-top: 30px;
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

.alp-contact-hero__scroll {
  position: absolute;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.76rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.alp-contact-editorial {
  position: relative;
  z-index: 2;
  margin-top: -78px;
  padding: 0 0 82px;
}

.alp-contact-editorial__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: stretch;
}

.alp-contact-editorial__copy {
  background: color-mix(in srgb, var(--alpine-surface) 95%, transparent);
  backdrop-filter: blur(8px);
  border: 1px solid color-mix(in srgb, var(--alpine-border) 70%, transparent);
  border-radius: 26px;
  padding: clamp(30px, 5vw, 48px);
  box-shadow: 0 20px 44px -28px rgba(17, 27, 19, 0.35);
}

.alp-contact-editorial__copy h2 {
  margin: 12px 0 14px;
  font-size: clamp(2rem, 4.5vw, 3.4rem);
  line-height: 0.98;
}

.alp-contact-editorial__copy p {
  margin: 0;
  color: var(--alpine-text-muted);
  max-width: 56ch;
}

.alp-contact-editorial__links {
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.alp-contact-editorial__links a {
  text-decoration: none;
  color: var(--alpine-brand);
  font-weight: 600;
  border-bottom: 1px solid color-mix(in srgb, var(--alpine-brand) 35%, transparent);
}

.alp-contact-editorial__media {
  position: relative;
  min-height: 520px;
}

.alp-contact-editorial__shot {
  margin: 0;
  position: absolute;
  overflow: hidden;
  border-radius: 26px;
  border: 1px solid color-mix(in srgb, var(--alpine-border) 70%, transparent);
  box-shadow: 0 18px 44px -30px rgba(17, 27, 19, 0.45);
}

.alp-contact-editorial__shot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.alp-contact-editorial__shot--one {
  inset: 0 20% 18% 0;
}

.alp-contact-editorial__shot--two {
  inset: 38% 0 0 28%;
}

.alp-contact-mosaic {
  padding: 10px 20px 110px;
}

.alp-contact-mosaic__grid {
  max-width: 1320px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: clamp(86px, 9vw, 140px);
  gap: 14px;
}

.alp-contact-mosaic__tile {
  margin: 0;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--alpine-border) 60%, transparent);
  box-shadow: 0 12px 32px -26px rgba(13, 20, 14, 0.4);
}

.alp-contact-mosaic__tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.alp-contact-mosaic__tile--1 { grid-column: 1 / span 5; grid-row: 1 / span 3; }
.alp-contact-mosaic__tile--2 { grid-column: 6 / span 3; grid-row: 1 / span 2; }
.alp-contact-mosaic__tile--3 { grid-column: 9 / span 4; grid-row: 1 / span 4; }
.alp-contact-mosaic__tile--4 { grid-column: 1 / span 4; grid-row: 4 / span 3; }
.alp-contact-mosaic__tile--5 { grid-column: 5 / span 4; grid-row: 3 / span 4; }
.alp-contact-mosaic__tile--6 { grid-column: 9 / span 4; grid-row: 5 / span 2; }

.alp-contact-journeys {
  padding: 0 0 108px;
}

.alp-contact-journeys__head {
  text-align: center;
  margin-bottom: 36px;
}

.alp-contact-journeys__head h2 {
  margin: 12px 0 0;
  font-size: clamp(2.2rem, 5vw, 4.2rem);
  line-height: 0.94;
}

.alp-contact-journeys__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.alp-contact-journey {
  display: grid;
  grid-template-rows: auto 1fr;
  background: var(--alpine-surface);
  border: 1px solid color-mix(in srgb, var(--alpine-border) 72%, transparent);
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 20px 44px -30px rgba(20, 30, 21, 0.3);
}

.alp-contact-journey__media img {
  width: 100%;
  height: clamp(180px, 20vw, 250px);
  object-fit: cover;
}

.alp-contact-journey__copy {
  padding: clamp(18px, 2vw, 28px);
  display: grid;
  align-content: center;
}

.alp-contact-journey__copy h3 {
  margin: 12px 0 12px;
  font-size: clamp(1.8rem, 3.2vw, 2.7rem);
  line-height: 0.98;
}

.alp-contact-journey__copy p {
  margin: 0;
  color: var(--alpine-text-muted);
}

.alp-contact-journey__copy a {
  margin-top: 18px;
  width: fit-content;
  color: var(--alpine-brand);
  text-decoration: none;
  font-weight: 600;
}

.alp-contact-interlude {
  position: relative;
  overflow: hidden;
  min-height: clamp(320px, 44vw, 560px);
}

.alp-contact-interlude > img {
  position: absolute;
  inset: -8% 0;
  width: 100%;
  height: 118%;
  object-fit: cover;
}

.alp-contact-interlude__overlay {
  position: relative;
  z-index: 2;
  min-height: inherit;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, rgba(8, 13, 10, 0.3), rgba(8, 13, 10, 0.7));
  text-align: center;
  color: #fff;
  padding: 34px 18px;
}

.alp-contact-interlude blockquote {
  margin: 0;
}

.alp-contact-interlude p {
  margin: 0;
  font-family: var(--wp--preset--font-family--display-serif);
  font-size: clamp(2rem, 5vw, 4.4rem);
  line-height: 0.95;
}

.alp-contact-main {
  padding: 38px 0 80px;
}

.alp-contact-main__grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 20px;
  align-items: start;
}

.alp-contact-form-wrap,
.alp-contact-info__panel,
.alp-contact-map__card {
  border: 1px solid color-mix(in srgb, var(--alpine-border) 75%, transparent);
  border-radius: 20px;
  background: var(--alpine-surface);
  box-shadow: 0 16px 34px -26px rgba(20, 30, 22, 0.32);
}

.alp-contact-form-wrap {
  padding: clamp(24px, 4vw, 36px);
}

.alp-contact-form-wrap h2 {
  margin: 12px 0 12px;
  font-size: clamp(2rem, 4vw, 2.9rem);
  line-height: 0.98;
}

.alp-contact-form-wrap > p {
  margin: 0;
  color: var(--alpine-text-muted);
}

.alp-contact-form {
  margin-top: 20px;
  display: grid;
  gap: 13px;
}

.alp-contact-form label {
  display: grid;
  gap: 8px;
  font-size: 0.95rem;
  color: var(--alpine-text);
}

.alp-contact-form input,
.alp-contact-form textarea {
  width: 100%;
  border: 1px solid color-mix(in srgb, var(--alpine-border) 90%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--alpine-surface) 75%, #fff 25%);
  color: var(--alpine-text);
  padding: 12px 14px;
  font: inherit;
}

.alp-contact-form textarea {
  min-height: 150px;
  resize: vertical;
}

.alp-contact-form input:focus,
.alp-contact-form textarea:focus {
  outline: 2px solid color-mix(in srgb, var(--alpine-brand) 30%, transparent);
  border-color: var(--alpine-brand);
}

.alp-contact-form__notice {
  margin-top: 14px;
  border-radius: 12px;
  padding: 12px 14px;
}

.alp-contact-form__notice--success {
  background: color-mix(in srgb, #4f8d5d 20%, transparent);
  border: 1px solid color-mix(in srgb, #4f8d5d 40%, transparent);
}

.alp-contact-form__notice--error {
  background: color-mix(in srgb, #ab4a4a 18%, transparent);
  border: 1px solid color-mix(in srgb, #ab4a4a 40%, transparent);
}

.alp-contact-info {
  display: grid;
  gap: 14px;
}

.alp-contact-info__panel {
  padding: 24px;
}

.alp-contact-info__panel h3 {
  margin: 10px 0 12px;
  font-size: 1.65rem;
}

.alp-contact-info__panel p {
  margin: 0 0 10px;
}

.alp-contact-info__panel ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
  color: var(--alpine-text-muted);
}

.alp-contact-info__panel a {
  color: var(--alpine-brand);
  text-decoration: none;
  border-bottom: 1px solid color-mix(in srgb, var(--alpine-brand) 30%, transparent);
}

.alp-contact-map {
  padding: 10px 0 110px;
}

.alp-contact-map__head {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 24px;
}

.alp-contact-map__head h2 {
  margin: 12px 0 10px;
  font-size: clamp(2.3rem, 5vw, 4rem);
  line-height: 0.94;
}

.alp-contact-map__head p {
  margin: 0;
  color: var(--alpine-text-muted);
}

.alp-contact-map__embed {
  overflow: hidden;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--alpine-border) 78%, transparent);
  box-shadow: 0 18px 40px -30px rgba(20, 30, 22, 0.4);
}

.alp-contact-map__embed iframe {
  display: block;
  width: 100%;
  height: min(58vh, 540px);
  border: 0;
}

.alp-contact-map__cards {
  margin-top: 16px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.alp-contact-map__card {
  padding: 18px;
}

.alp-contact-map__card h3 {
  margin: 0 0 8px;
  font-size: 1.2rem;
}

.alp-contact-map__card p {
  margin: 0;
  color: var(--alpine-text-muted);
}

@media (max-width: 1100px) {
  .alp-contact-editorial__grid,
  .alp-contact-main__grid {
    grid-template-columns: 1fr;
  }

  .alp-contact-editorial {
    margin-top: -42px;
  }

  .alp-contact-editorial__media {
    min-height: 440px;
  }

  .alp-contact-journeys__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .alp-contact-mosaic {
    padding-left: 12px;
    padding-right: 12px;
  }

  .alp-contact-mosaic__grid {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 170px;
    gap: 10px;
  }

  .alp-contact-mosaic__tile--1,
  .alp-contact-mosaic__tile--2,
  .alp-contact-mosaic__tile--3,
  .alp-contact-mosaic__tile--4,
  .alp-contact-mosaic__tile--5,
  .alp-contact-mosaic__tile--6 {
    grid-column: auto;
    grid-row: auto;
  }

  .alp-contact-mosaic__tile--1,
  .alp-contact-mosaic__tile--4 {
    grid-row: span 2;
  }

  .alp-contact-map__cards {
    grid-template-columns: 1fr;
  }

  .alp-contact-journeys__list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .alp-contact-hero {
    min-height: 90svh;
  }

  .alp-contact-hero__content {
    padding: 122px 16px 60px;
  }

  .alp-contact-editorial {
    margin-top: -20px;
    padding-bottom: 62px;
  }

  .alp-contact-editorial__copy {
    border-radius: 18px;
    padding: 24px 20px;
  }

  .alp-contact-editorial__media {
    min-height: 320px;
  }

  .alp-contact-editorial__shot {
    border-radius: 14px;
  }

  .alp-contact-editorial__shot--one {
    inset: 0 16% 24% 0;
  }

  .alp-contact-editorial__shot--two {
    inset: 44% 0 0 22%;
  }

  .alp-contact-main {
    padding-top: 34px;
  }

  .alp-contact-form-wrap,
  .alp-contact-info__panel,
  .alp-contact-map__card {
    border-radius: 14px;
  }
}

/* Pre-hide hero elements before GSAP animates them in */
[data-contact-reveal] {
  opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
  .alp-contact-hero__bg img {
    transform: none;
  }
  [data-contact-reveal] {
    opacity: 1;
  }
}

/* ============================================
   Accessibility Contrast Hardening
   ============================================ */
.alp-contact-hero__sub,
.alp-contact-hero .alp-btn--ghost,
.alp-contact-card .alp-eyebrow {
  color: #ffffff;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.52);
}

.alp-contact-hero .alp-btn--ghost {
  border-color: rgba(255, 255, 255, 0.9);
}

html[data-theme='dark'] .alp-contact-form .alp-btn,
html[data-theme='dark'] .alp-contact-form button[type='submit'] {
  color: #0f1a12;
}

/* ============================================
   Contact Form — Game Captcha Steps
   ============================================ */

/* Progress dots */
.alp-contact-progress {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin: 18px 0 6px;
}

.alp-contact-progress__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--alpine-border) 60%, transparent);
  transition: background 0.3s, box-shadow 0.3s;
}

.alp-contact-progress__dot--active {
  background: var(--alpine-brand);
  box-shadow: 0 0 8px color-mix(in srgb, var(--alpine-brand) 40%, transparent);
}

.alp-contact-progress__dot--done {
  background: var(--alpine-accent);
}

/* Step visibility */
.alp-contact-step {
  display: none;
}

.alp-contact-step--active {
  display: grid;
  gap: 13px;
  animation: alpContactFadeIn 0.35s ease;
}

@keyframes alpContactFadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Game canvas */
#alp-game-canvas {
  display: block;
  width: 100%;
  max-width: 400px;
  height: auto;
  margin: 0 auto;
  border: 1px solid color-mix(in srgb, var(--alpine-border) 60%, transparent);
  border-radius: 14px;
  image-rendering: pixelated;
  image-rendering: -moz-crisp-edges;
  background: #111512;
}

.alp-contact-game__intro {
  text-align: center;
  font-size: 0.95rem;
  color: var(--alpine-text-muted);
  margin: 0 0 10px;
}

.alp-contact-game__hint {
  text-align: center;
  font-size: 0.82rem;
  color: var(--alpine-text-muted);
  margin: 8px 0 0;
  opacity: 0.7;
}

.alp-contact-game__hint--mobile {
  display: none;
}

@media (pointer: coarse) {
  .alp-contact-game__hint--desktop { display: none; }
  .alp-contact-game__hint--mobile  { display: block; }
}

/* Sending spinner */
.alp-contact-step--sending {
  justify-items: center;
  padding: 48px 0;
}

.alp-contact-sending__spinner {
  width: 36px;
  height: 36px;
  border: 3px solid color-mix(in srgb, var(--alpine-border) 40%, transparent);
  border-top-color: var(--alpine-brand);
  border-radius: 50%;
  animation: alpSpinnerSpin 0.7s linear infinite;
}

@keyframes alpSpinnerSpin {
  to { transform: rotate(360deg); }
}

.alp-contact-step--sending p {
  margin: 14px 0 0;
  color: var(--alpine-text-muted);
  font-size: 0.95rem;
}