/* ═══════════════════════════════════════════════════════
   SPLIT LANDING PAGE — index.html only
═══════════════════════════════════════════════════════ */

body.no-scroll {
  overflow: hidden;
  height: 100vh;
  margin: 0;
}

/* ── LOGO (top-center, above both panels) ── */
.split-logo {
  position: fixed;
  top: 36px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 50;
  pointer-events: none;
}
.split-logo img { height: 28px; }

/* ── WRAP ── */
.split-wrap {
  display: flex;
  height: 100vh;
  width: 100vw;
  position: relative;
}

/* ── PANELS ── */
.s-panel {
  height: 100%;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: width 0.75s cubic-bezier(0.16,1,0.3,1);
  will-change: width;
}

.s-panel--left {
  width: 50%;
  background: var(--brown-dark);
  border-right: 1px solid rgba(184,137,74,0.35);
}

.s-panel--right {
  width: 50%;
  background: var(--cream);
}

/* ── EXPANSION ON HOVER ── */
.split-wrap.expand-left  .s-panel--left  { width: 64%; }
.split-wrap.expand-left  .s-panel--right { width: 36%; }
.split-wrap.expand-right .s-panel--left  { width: 36%; }
.split-wrap.expand-right .s-panel--right { width: 64%; }

/* ── PANEL BACKGROUND GLOW ── */
.s-panel__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.6s ease;
}
.s-panel--left  .s-panel__bg {
  background: radial-gradient(ellipse 70% 50% at 40% 55%, rgba(184,137,74,0.09) 0%, transparent 70%);
}
.s-panel--right .s-panel__bg {
  background: radial-gradient(ellipse 70% 50% at 60% 45%, rgba(184,137,74,0.06) 0%, transparent 70%);
}
.split-wrap.expand-left  .s-panel--left  .s-panel__bg,
.split-wrap.expand-right .s-panel--right .s-panel__bg { opacity: 1; }

/* ── PANEL BODY (hidden by default, reveals on expansion) ── */
.s-panel__body {
  position: relative;
  z-index: 2;
  max-width: 400px;
  width: 100%;
  padding: 0 64px;
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.4s ease 0.12s, transform 0.45s ease 0.12s;
  pointer-events: none;
}

.split-wrap.expand-left  .s-panel--left  .s-panel__body,
.split-wrap.expand-right .s-panel--right .s-panel__body {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* ── PANEL CONTENT TYPOGRAPHY ── */
.s-panel__era {
  display: block;
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
}

.s-panel__heading {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(24px, 2.6vw, 36px);
  font-weight: 300;
  line-height: 1.15;
  margin-bottom: 18px;
}
.s-panel--left  .s-panel__heading { color: var(--cream); }
.s-panel--right .s-panel__heading { color: var(--text-dark); }

.s-panel__desc {
  font-size: 13px;
  line-height: 1.8;
  margin-bottom: 36px;
  max-width: 340px;
}
.s-panel--left  .s-panel__desc { color: rgba(245,238,228,0.48); }
.s-panel--right .s-panel__desc { color: var(--text-muted); }

.s-panel__cta {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: 'DM Sans', sans-serif;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 1px solid;
  padding-bottom: 4px;
  transition: gap 0.3s ease;
}
.s-panel__cta:hover { gap: 20px; }
.s-panel--left  .s-panel__cta { color: var(--gold-light); border-color: rgba(212,169,106,0.3); }
.s-panel--right .s-panel__cta { color: var(--text-dark);  border-color: rgba(26,18,8,0.2); }

/* ── HINT LABELS (always visible, faint, at outer edges) ── */
.s-panel__hint {
  position: absolute;
  bottom: 40px;
  font-family: 'DM Sans', sans-serif;
  font-size: 9px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  pointer-events: none;
  z-index: 2;
  transition: opacity 0.4s ease;
}
.s-panel--left  .s-panel__hint { left: 40px;  color: rgba(245,238,228,0.12); }
.s-panel--right .s-panel__hint { right: 40px; color: rgba(26,18,8,0.1); }

.split-wrap.expand-left  .s-panel--left  .s-panel__hint,
.split-wrap.expand-right .s-panel--right .s-panel__hint { opacity: 0; }

/* Fade non-active panel hint on expansion */
.split-wrap.expand-left  .s-panel--right .s-panel__hint,
.split-wrap.expand-right .s-panel--left  .s-panel__hint { opacity: 0; }

/* ── CENTER TITLE (fixed, always at 50vw) ── */
.split-center {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  z-index: 30;
  pointer-events: none;
  white-space: nowrap;
  transition: opacity 0.45s ease;
}

.split-wrap.expand-left  .split-center,
.split-wrap.expand-right .split-center { opacity: 0.12; }

.split-center__eyebrow {
  font-family: 'DM Sans', sans-serif;
  font-size: 9px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: rgba(184,137,74,0.5);
  margin-bottom: 22px;
}

.split-center__title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(40px, 5vw, 70px);
  font-weight: 300;
  line-height: 1.08;
  color: var(--gold);
}
.split-center__title em {
  font-style: italic;
  color: var(--gold-light);
}

.split-center__sub {
  font-family: 'DM Sans', sans-serif;
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(184,137,74,0.38);
  margin-top: 24px;
}

/* ── MOBILE: stacked two-panel layout ── */
@media (max-width: 767px) {
  body.no-scroll { overflow: auto; height: auto; }
  .split-logo {
    position: relative;
    top: 0;
    left: auto;
    transform: none;
    display: flex;
    justify-content: center;
    padding: 40px 0 0;
    background: var(--brown-dark);
    pointer-events: auto;
  }
  .split-wrap { flex-direction: column; height: auto; min-height: 100vh; }
  .s-panel {
    width: 100% !important;
    min-height: 50vh;
    transition: none;
    padding: 60px 32px;
  }
  .s-panel__body {
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
    padding: 0;
    text-align: center;
    max-width: 100%;
  }
  .s-panel__cta { margin: 0 auto; }
  .split-center { display: none; }
  .s-panel__hint { display: none; }
  .s-panel--left { border-right: none; border-bottom: 1px solid rgba(184,137,74,0.3); }
}