* { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --ink: #1a1814; --warm: #A4865C; --dust: #C9B89A;
  --light: #FDFAF7; --rule: #E2D9CE;
}
body { font-family: "DM Sans", sans-serif; background: var(--ink); color: var(--light); }

/* NAV */
.site-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  display: flex; justify-content: space-between; align-items: center;
  padding: 18px 32px;
  background: linear-gradient(to bottom, rgba(10,8,6,0.92) 0%, transparent 100%);
}
.nav-links { display: flex; gap: 4px; }
.nav-link {
  font-family: "DM Sans", sans-serif;
  font-size: 10px; letter-spacing: 3px; text-transform: uppercase;
  color: rgba(255,255,255,0.48); background: transparent;
  border: 1px solid transparent;
  padding: 6px 14px; cursor: pointer;
  text-decoration: none; transition: all 0.2s;
  display: inline-block;
}
.nav-link:hover { color: var(--dust); border-color: rgba(139,111,71,0.4); }
.nav-link.active { color: var(--dust); border-color: var(--warm); }
.nav-right { display: flex; gap: 8px; }
.lang-btn {
  font-family: "DM Sans", sans-serif;
  font-size: 10px; letter-spacing: 3px; text-transform: uppercase;
  color: rgba(255,255,255,0.48); background: transparent;
  border: 1px solid rgba(255,255,255,0.12);
  padding: 6px 14px; cursor: pointer; transition: all 0.2s;
}
.lang-btn:hover { color: var(--dust); border-color: var(--warm); }
.lang-btn.active { color: var(--dust); border-color: var(--warm); }

/* LANG SWITCHER — remove old fixed position */
.lang-switcher { display: none; }

/* COVER */
.cover {
  position: relative; width: 100%; height: 100vh; min-height: 700px;
  overflow: hidden; display: flex; align-items: flex-end;
}
.cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.cover-overlay {
  position: relative; z-index: 2; width: 100%;
  background: linear-gradient(to top, rgba(10,8,6,0.95) 0%, rgba(10,8,6,0.4) 60%, transparent 100%);
  padding: 60px 72px;
}
.cover-name {
  font-family: "Cormorant Garamond", serif; font-size: 72px; font-weight: 300;
  line-height: 0.9; letter-spacing: -2px; color: var(--light);
}
.cover-name em { font-style: italic; color: var(--dust); }
.cover-descriptor {
  font-size: 11px; font-weight: 400; letter-spacing: 4px; text-transform: uppercase;
  color: var(--warm); margin-top: 16px;
}
.cover-tagline {
  font-family: "Cormorant Garamond", serif; font-size: 18px; font-weight: 300;
  font-style: italic; color: rgba(255,255,255,0.6); margin-top: 12px; max-width: 500px;
}

/* SPREAD */
.spread {
  display: grid; grid-template-columns: 1fr 1fr;
  min-height: 600px; border-top: 1px solid rgba(255,255,255,0.05);
}
.spread.reverse { direction: rtl; }
.spread.reverse > * { direction: ltr; }

.spread-image { position: relative; overflow: hidden; }
.spread-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.spread-image.tall { min-height: 700px; }

.spread-collage { position: relative; overflow: hidden; }
.spread-collage img { width: 100%; height: 100%; object-fit: cover; display: block; }

.spread-text {
  display: flex; flex-direction: column; justify-content: center;
  padding: 60px 56px; background: var(--ink);
}
.spread-number {
  font-size: 9px; letter-spacing: 4px; text-transform: uppercase;
  color: var(--warm); margin-bottom: 20px;
}
.spread-title {
  font-family: "Cormorant Garamond", serif; font-size: 44px; font-weight: 300;
  line-height: 1; color: var(--light); margin-bottom: 16px;
}
.spread-title em { font-style: italic; color: var(--dust); }
.spread-subtitle {
  font-size: 10px; letter-spacing: 2px; text-transform: uppercase;
  color: rgba(255,255,255,0.48); margin-bottom: 24px;
}
.spread-desc {
  font-family: "Cormorant Garamond", serif; font-size: 16px; font-weight: 300;
  line-height: 1.7; color: rgba(255,255,255,0.65); max-width: 360px;
}
.spread-rule {
  width: 40px; height: 1px; background: var(--warm); margin-bottom: 20px;
}

/* CLOSING */
.closing {
  padding: 100px 72px; text-align: center;
  border-top: 1px solid rgba(255,255,255,0.05);
}
.closing-name {
  font-family: "Cormorant Garamond", serif; font-size: 48px;
  font-weight: 300; font-style: italic; color: var(--dust); margin-bottom: 24px;
}
.closing-name-link {
  color: inherit; text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 0.2s, border-color 0.2s;
}
.closing-name-link:hover { color: var(--light); border-color: rgba(253,250,247,0.4); }
.closing-contact { font-size: 12px; color: rgba(255,255,255,0.48); line-height: 2.2; letter-spacing: 1px; }
.closing-contact a { color: var(--warm); text-decoration: none; }
.closing-profile-link {
  margin-top: 36px;
  font-family: "Cormorant Garamond", serif;
  font-size: 17px; font-weight: 300; font-style: italic;
  color: rgba(255,255,255,0.48);
  letter-spacing: 0.5px;
}
.closing-profile-link a {
  color: var(--dust); text-decoration: none;
  border-bottom: 1px solid rgba(201,184,154,0.3);
  padding-bottom: 2px;
  transition: color 0.2s, border-color 0.2s;
}
.closing-profile-link a:hover { color: var(--light); border-color: var(--dust); }
.closing-rule { width: 60px; height: 1px; background: var(--warm); margin: 32px auto; }
.closing-quote {
  font-family: "Cormorant Garamond", serif; font-size: 20px;
  font-weight: 300; font-style: italic; color: rgba(255,255,255,0.48);
  max-width: 600px; margin: 0 auto; line-height: 1.7;
}

@media print {
  .cover { height: 100vh; }
  .spread { page-break-inside: avoid; }
  .lang-switcher { display: none; }
}

@media (max-width: 768px) {

  /* NAV */
  .site-nav { padding: 12px 16px; }
  .nav-link { padding: 5px 10px; font-size: 9px; letter-spacing: 2px; }
  .lang-btn { padding: 5px 10px; font-size: 9px; letter-spacing: 2px; }

  /* COVER */
  .cover { min-height: 100svh; }
  .cover-overlay { padding: 40px 20px; }
  .cover-name { font-size: 44px; letter-spacing: -1px; }
  .cover-descriptor { font-size: 9px; letter-spacing: 3px; margin-top: 12px; }
  .cover-tagline { font-size: 15px; margin-top: 10px; }

  /* SPREAD — stack vertically */
  .spread {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    min-height: auto;
  }
  .spread.reverse { direction: ltr; }
  .spread.reverse > * { direction: ltr; }

  /* Images — natural proportions on mobile */
  .spread-image {
    height: auto;
    min-height: unset;
  }
  .spread-image.tall {
    height: auto;
    min-height: unset;
  }
  .spread-image img {
    width: 100%;
    height: auto;
    object-fit: unset;
    display: block;
  }
  .spread-collage {
    height: auto;
  }
  .spread-collage img {
    width: 100%;
    height: auto;
    object-fit: unset;
    display: block;
  }

  .spread-text {
    padding: 36px 20px;
  }
  .spread-title { font-size: 32px; }
  .spread-desc { font-size: 14px; max-width: 100%; }
  .spread-number { font-size: 8px; letter-spacing: 3px; margin-bottom: 14px; }
  .spread-subtitle { font-size: 9px; margin-bottom: 16px; }

  /* CLOSING */
  .closing { padding: 60px 20px; }
  .closing-name { font-size: 32px; }
  .closing-quote { font-size: 16px; }
  .closing-contact { font-size: 11px; }
}

.skip-link{position:fixed;left:12px;top:12px;z-index:10000;padding:10px 14px;background:#1a1814;color:#FDFAF7;border:1px solid #A4865C;transform:translateY(-160%);transition:transform .15s;text-decoration:none}.skip-link:focus{transform:translateY(0)}
:focus-visible{outline:2px solid #C9B89A;outline-offset:3px}