:root {
  --cream: #f5f2ed;
  --paper: #fdf8f7;
  --ink: #1c1b1b;
  --muted: #67645f;
  --line: #c8c7be;
  --green: #1b3022;
  --sky: #87ceeb;
  --pink: #f4c2c2;
  --sand: #d2b48c;
  --yellow: #ffd700;
  --brown: #5c4033;
  --red: #ce1126;
  --blue: #153e75;
  --shadow: 0 18px 60px rgba(27, 48, 34, 0.12);
  --edge: clamp(18px, 3vw, 40px);
  --gap: clamp(18px, 2vw, 28px);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "Work Sans", Arial, sans-serif;
}

img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select {
  font: inherit;
}

.mono {
  font-family: "Space Mono", monospace;
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.display {
  font-family: "Bricolage Grotesque", sans-serif;
  font-weight: 800;
  line-height: 0.98;
  letter-spacing: 0;
  text-transform: uppercase;
}

.nav {
  position: fixed;
  inset: 0 0 auto;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px var(--edge);
  border-bottom: 1px solid var(--line);
  background: rgba(253, 248, 247, 0.92);
  backdrop-filter: blur(14px);
  transition: box-shadow 200ms ease, padding 200ms ease;
}

.nav.is-scrolled {
  box-shadow: 0 10px 30px rgba(28, 27, 27, 0.08);
}

.brand {
  font-family: "Bricolage Grotesque", sans-serif;
  font-size: 28px;
  font-weight: 800;
}

.nav-links {
  display: flex;
  align-items: center;
  gap: clamp(16px, 3vw, 34px);
}

.nav-link {
  color: var(--muted);
  border-bottom: 2px solid transparent;
  padding-bottom: 4px;
}

.nav-link:hover,
.nav-link.active {
  color: var(--ink);
  border-color: currentColor;
}

.nav-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.icon-button {
  display: inline-flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: transparent;
  color: var(--green);
  cursor: pointer;
}

.menu-toggle {
  display: none;
}

.mobile-menu {
  display: none;
  position: fixed;
  z-index: 39;
  top: 72px;
  right: var(--edge);
  left: var(--edge);
  padding: 18px;
  border: 1px solid var(--line);
  background: var(--paper);
  box-shadow: var(--shadow);
}

.mobile-menu a {
  display: block;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}

.mobile-menu.open {
  display: block;
}

.main {
  padding-top: 79px;
}

.section {
  padding: clamp(70px, 10vw, 128px) var(--edge);
}

.container {
  width: min(1440px, 100%);
  margin-inline: auto;
}

.hero {
  position: relative;
  min-height: calc(100vh - 79px);
  overflow: hidden;
  background: var(--green);
}

.hero img {
  position: absolute;
  inset: 0;
  opacity: 0.78;
  mix-blend-mode: luminosity;
}

.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(27, 48, 34, 0.05), rgba(27, 48, 34, 0.78));
}

.home-page .hero img {
  opacity: 1;
  mix-blend-mode: normal;
}

.home-page .hero::after {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.48));
}

.hero-content {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: calc(100vh - 79px);
  max-width: 1440px;
  margin: auto;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0 var(--edge) clamp(80px, 12vh, 140px);
  color: var(--cream);
}

.hero h1,
.page-title {
  margin: 0;
  font-size: clamp(52px, 10vw, 122px);
}

.hero p {
  width: min(540px, 100%);
  font-size: clamp(18px, 2vw, 24px);
  line-height: 1.45;
}

.button-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.btn {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1px solid var(--green);
  padding: 14px 22px;
  background: var(--green);
  color: var(--cream);
  cursor: pointer;
  transition: transform 180ms ease, background 180ms ease, color 180ms ease;
}

.btn:hover {
  transform: translateY(-2px);
  background: var(--sky);
  color: var(--green);
}

.btn.light {
  border-color: var(--cream);
  background: var(--cream);
  color: var(--green);
}

.btn.ghost {
  border-color: currentColor;
  background: transparent;
  color: currentColor;
}

.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: clamp(30px, 5vw, 64px);
}

.section-heading h2 {
  margin: 0;
  color: var(--green);
  font-size: clamp(38px, 5vw, 68px);
}

.section-heading p {
  max-width: 390px;
  color: var(--muted);
  line-height: 1.7;
}

.editorial-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--gap);
}

.feature-card {
  position: relative;
  min-height: 560px;
  overflow: hidden;
  background: var(--sand);
}

.feature-card.large {
  grid-column: span 8;
}

.feature-card.small {
  grid-column: span 4;
}

.feature-card img,
.product-card img,
.look-tile img {
  transition: transform 700ms ease, opacity 400ms ease;
}

.feature-card:hover img,
.product-card:hover img,
.look-tile:hover img {
  transform: scale(1.045);
}

.feature-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(20px, 3vw, 42px);
  color: var(--cream);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.03), rgba(0, 0, 0, 0.38));
}

.tag {
  width: fit-content;
  padding: 7px 10px;
  background: var(--green);
  color: var(--cream);
}

.feature-overlay h3 {
  margin: 0 0 10px;
  max-width: 620px;
  font-size: clamp(34px, 5vw, 64px);
}

.product-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--gap);
  padding-bottom: 4px;
}

.band .section-heading {
  align-items: end;
  margin-bottom: clamp(40px, 6vw, 72px);
  border-bottom: 1px solid rgba(245, 242, 237, .24);
  padding-bottom: 22px;
}

.band .section-heading h2 { line-height: .86; }
.band .product-media { background: #f1ede5; }
.band .product-meta h3 { color: var(--cream); }
.band .product-meta p { color: rgba(245, 242, 237, .52); }
.band .product-card { min-width: 0; }

.product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 58px var(--gap);
}

.product-card {
  display: block;
}

.product-media {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  margin-bottom: 16px;
  background: var(--cream);
}

.quick-add {
  position: absolute;
  right: 14px;
  bottom: 14px;
  left: 14px;
  opacity: 0;
  transform: translateY(10px);
}

.product-card:hover .quick-add {
  opacity: 1;
  transform: translateY(0);
}

.product-meta {
  display: flex;
  justify-content: space-between;
  gap: 16px;
}

.product-meta h3 {
  margin: 0 0 6px;
  font-family: "Bricolage Grotesque", sans-serif;
  font-size: 22px;
  text-transform: uppercase;
}

.product-meta p {
  margin: 0;
  color: var(--muted);
}

.price {
  font-family: "Space Mono", monospace;
  font-weight: 700;
}

.sale-price-block { display: inline-flex; flex-direction: column; align-items: flex-end; gap: 3px; }
.old-price { color: var(--muted); font-size: .7em; font-weight: 400; text-decoration: line-through; opacity: .72; }
.sale-price { color: #b94836; }
.product-panel .sale-price-block { align-items: flex-start; }
.cart-count { position: absolute; top: -6px; right: -8px; min-width: 17px; height: 17px; display: grid; place-items: center; padding: 0 4px; color: white; background: #b94836; border-radius: 999px; font-size: 8px; }
.icon-button, .account { position: relative; }

.band {
  background: var(--green);
  color: var(--cream);
}

.soft-band {
  background: #edf7fb;
}

.newsletter {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  max-width: 680px;
  margin-top: 28px;
  border-bottom: 2px solid currentColor;
}

.newsletter input {
  min-width: 0;
  border: 0;
  padding: 16px 4px;
  background: transparent;
  outline: 0;
}

.newsletter button {
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
}

.footer {
  padding: clamp(70px, 10vw, 120px) var(--edge) 34px;
  background: var(--green);
  color: var(--cream);
}

.footer-title {
  margin: 0 0 42px;
  font-size: clamp(48px, 9vw, 120px);
}

.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: var(--gap);
  border-top: 1px solid rgba(245, 242, 237, 0.2);
  padding-top: 36px;
}

.footer a {
  display: block;
  margin: 11px 0;
  color: rgba(245, 242, 237, 0.78);
}

.page-header {
  padding: clamp(120px, 15vw, 190px) var(--edge) 60px;
}

.page-header p {
  max-width: 650px;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.7;
}

.shop-layout {
  display: grid;
  grid-template-columns: 270px 1fr;
  gap: clamp(28px, 5vw, 70px);
  border-top: 1px solid var(--line);
  padding-top: 42px;
}

.filters {
  position: sticky;
  top: 110px;
  align-self: start;
}

.filter-group {
  margin-bottom: 34px;
}

.filter-button,
.chip,
.size-button,
.swatch {
  cursor: pointer;
}

.filter-button {
  display: flex;
  width: 100%;
  justify-content: space-between;
  border: 0;
  padding: 8px 0;
  background: transparent;
  color: var(--muted);
  text-align: left;
}

.filter-button.active {
  color: var(--green);
  font-weight: 700;
}

.chip {
  margin: 0 6px 8px 0;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 12px;
  background: transparent;
}

.chip.active {
  background: var(--green);
  color: var(--cream);
}

.swatches,
.sizes {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.swatch {
  width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 999px;
}

.swatch.active {
  outline: 2px solid var(--green);
  outline-offset: 3px;
}

.size-button {
  min-width: 46px;
  border: 1px solid var(--line);
  padding: 10px;
  background: transparent;
}

.size-button.active {
  border-color: var(--green);
  background: var(--green);
  color: var(--cream);
}

.collection-block {
  margin-bottom: clamp(70px, 10vw, 130px);
}

.story-panel {
  padding: clamp(28px, 5vw, 64px);
  background: var(--cream);
}

.story-panel h2 {
  margin-top: 0;
  font-size: clamp(34px, 5vw, 58px);
}

.collection-image {
  min-height: 540px;
  overflow: hidden;
}

.collections-page {
  background: var(--paper);
}

/* Collections journal index */
.collections-journal {
  background: #f4f1ec;
  color: #111;
}

.journal-shell {
  width: min(1440px, 100%);
  margin-inline: auto;
  padding: 79px clamp(24px, 4.1vw, 62px) 0;
}

.journal-hero {
  min-height: 310px;
  display: grid;
  grid-template-columns: minmax(0, 1.85fr) minmax(280px, .95fr);
  gap: clamp(54px, 10vw, 160px);
  align-items: end;
  padding: clamp(74px, 8.4vw, 124px) 14px clamp(44px, 5vw, 70px);
}

.journal-kicker {
  margin: 0 0 22px;
  color: #44413e;
  font-size: 10px;
}

.journal-hero h1 {
  margin: 0;
  font-size: clamp(68px, 7.25vw, 104px);
  line-height: .82;
  letter-spacing: -.055em;
}

.journal-intro {
  max-width: 330px;
  align-self: center;
  margin-top: 72px;
}

.journal-intro > p {
  margin: 0 0 24px;
  font-size: 14px;
  line-height: 1.5;
}

.journal-nav {
  display: flex;
  gap: 22px;
  border-top: 1px solid #111;
  padding-top: 13px;
  font-size: 9px;
  letter-spacing: .04em;
}

.journal-nav a { transition: opacity 180ms ease; }
.journal-nav a:hover { opacity: .52; }

.journal-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: 610px 430px;
  gap: 20px;
}

.journal-card {
  position: relative;
  display: block;
  overflow: hidden;
  background: #d8d3c9;
}

.journal-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.journal-card img {
  position: absolute;
  inset: 0;
  transition: transform 700ms cubic-bezier(.2,.7,.2,1);
}

.journal-card:hover img { transform: scale(1.025); }

.journal-card-one { grid-column: 1 / -1; grid-row: 1; color: #fff; }
.journal-card-two { grid-column: 1 / span 4; grid-row: 2; color: #fff; }
.journal-card-three { grid-column: 5 / span 4; grid-row: 2; }
.journal-card-four { grid-column: 9 / -1; grid-row: 2; }

.journal-card-one::after {
  background: linear-gradient(90deg, rgba(6, 16, 20, .78), rgba(6, 16, 20, .08) 62%), linear-gradient(0deg, rgba(6, 16, 20, .45), transparent 50%);
}

.journal-card-two::after {
  background: linear-gradient(90deg, rgba(6, 27, 17, .58), transparent 70%);
}

.journal-card-three::after {
  background: linear-gradient(90deg, rgba(236, 211, 169, .24), transparent 58%);
}

.journal-card-four::after {
  background: linear-gradient(0deg, rgba(225, 222, 216, .96), rgba(225, 222, 216, .08) 74%);
}

.journal-card-one img { object-position: center 48%; }
.journal-card-two img { object-position: center 46%; filter: saturate(.78) brightness(.68); }
.journal-card-three img { object-position: center 45%; }
.journal-card-four img { object-position: center 46%; }

.journal-chapter,
.journal-card-copy {
  position: absolute;
  z-index: 2;
}

.journal-card-one .journal-card-copy {
  left: clamp(28px, 4vw, 58px);
  bottom: clamp(30px, 4vw, 54px);
  width: min(440px, calc(100% - 56px));
}

.journal-card-one .journal-card-copy h2 { font-size: clamp(58px, 7vw, 98px); }

.journal-chapter {
  top: 22px;
  left: 22px;
  border: 1px solid currentColor;
  padding: 8px 10px;
  font-size: 9px;
  letter-spacing: 0;
}

.journal-card-copy {
  left: 24px;
  bottom: 28px;
  width: min(330px, calc(100% - 48px));
}

.journal-card-copy h2 {
  margin: 0 0 15px;
  font-size: clamp(42px, 4.4vw, 64px);
  line-height: .84;
  letter-spacing: -.05em;
}

.journal-card-copy p {
  margin: 0 0 18px;
  font-size: 9px;
  font-weight: 700;
}

.journal-card-link {
  display: flex;
  width: 176px;
  justify-content: space-between;
  border-top: 1px solid currentColor;
  padding-top: 13px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .02em;
}

.journal-card-link b { font-size: 16px; line-height: 8px; }
.journal-card-two .journal-card-copy { top: auto; bottom: 28px; }
.journal-card-two .journal-card-copy h2,
.journal-card-three .journal-card-copy h2,
.journal-card-four .journal-card-copy h2 { font-size: clamp(34px, 3.1vw, 46px); }
.journal-card-four .journal-card-copy { bottom: 28px; width: min(320px, calc(100% - 48px)); }

.journal-footer {
  min-height: 112px;
  display: grid;
  grid-template-columns: auto 1fr auto 1fr;
  gap: 50px;
  align-items: center;
}

.journal-logo { font-size: 36px; letter-spacing: -.05em; }
.journal-footer > p { margin: 0; font-size: 11px; line-height: 1.45; }
.journal-mark {
  width: 39px;
  height: 39px;
  display: grid;
  place-items: center;
  border: 2px solid #111;
  border-radius: 50%;
  font-family: Georgia, serif;
  font-size: 23px;
}
.journal-copyright { justify-self: end; font-size: 9px !important; }

@media (max-width: 760px) {
  .journal-shell { padding: 79px 16px 0; }
  .journal-hero { display: block; min-height: 0; padding: 60px 4px 36px; }
  .journal-hero h1 { font-size: clamp(58px, 18vw, 90px); }
  .journal-intro { max-width: none; margin-top: 34px; }
  .journal-nav { flex-wrap: wrap; }
  .journal-grid { display: block; }
  .journal-card { min-height: 520px; margin-bottom: 16px; }
  .journal-card-two,
  .journal-card-three { min-height: 410px; }
  .journal-card-four { min-height: 480px; }
  .journal-card-four::after { background: linear-gradient(0deg, rgba(225,222,216,.96), transparent 75%); }
  .journal-card-four .journal-card-copy { top: auto; bottom: 28px; }
  .journal-footer { grid-template-columns: auto 1fr; gap: 22px; padding-block: 28px; }
  .journal-mark { display: none; }
  .journal-copyright { justify-self: start; }
}

/* World collection index */
.world-index-hero {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(280px, 3fr);
  gap: clamp(40px, 8vw, 140px);
  align-items: end;
  padding-top: clamp(90px, 12vw, 160px);
  padding-bottom: clamp(66px, 9vw, 120px);
}
.world-index-hero h1 {
  margin: 12px 0 0;
  font-size: clamp(64px, 10vw, 150px);
  line-height: .8;
  letter-spacing: -.055em;
}
.world-index-intro { max-width: 430px; padding-bottom: 8px; }
.world-index-intro > p { margin: 0 0 34px; color: var(--muted); font-size: 18px; line-height: 1.7; }
.world-index-intro > span { display: block; border-top: 1px solid var(--line); padding-top: 14px; }
.world-index {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--gap);
  align-items: start;
  padding-bottom: clamp(100px, 13vw, 190px);
}
.world-card {
  position: relative;
  display: block;
  min-width: 0;
  overflow: hidden;
  background: #173b2b;
  color: #f5f2ed;
}
.world-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(8, 20, 14, .03) 38%, rgba(8, 20, 14, .84) 100%);
  transition: background 400ms ease;
}
.world-card img { transition: transform 800ms cubic-bezier(.2,.7,.2,1); }
.world-card:hover img { transform: scale(1.025); }
.world-card:hover::after { background: linear-gradient(180deg, rgba(8, 20, 14, .01) 30%, rgba(8, 20, 14, .9) 100%); }
.world-card-number {
  position: absolute;
  z-index: 2;
  top: 20px;
  left: 20px;
  padding: 8px 10px;
  border: 1px solid rgba(255,255,255,.5);
  background: rgba(10, 25, 18, .2);
  backdrop-filter: blur(8px);
}
.world-card-copy {
  position: absolute;
  z-index: 2;
  right: clamp(20px, 3vw, 42px);
  bottom: clamp(20px, 3vw, 42px);
  left: clamp(20px, 3vw, 42px);
}
.world-card-copy > p { margin: 0 0 12px; color: rgba(245,242,237,.76); }
.world-card-copy h2 { margin: 0; font-size: clamp(42px, 5.4vw, 82px); line-height: .84; letter-spacing: -.045em; }
.world-card-link {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 24px;
  border-top: 1px solid rgba(245,242,237,.48);
  padding-top: 14px;
}
.world-card-link b { font-size: 17px; }
.world-card-argentina { grid-column: 1 / span 7; height: clamp(650px, 78vw, 1080px); }
.world-card-argentina img { object-position: center; }
.world-card-green { grid-column: 8 / -1; height: clamp(540px, 60vw, 820px); margin-top: clamp(100px, 14vw, 210px); }
.world-card-green img { object-position: center 43%; }
.world-card-egypt { grid-column: 1 / span 5; height: clamp(570px, 66vw, 900px); margin-top: clamp(90px, 12vw, 170px); }
.world-card-egypt img { object-position: center; }
.world-card-equatorial { grid-column: 6 / -1; height: clamp(580px, 70vw, 940px); margin-top: clamp(18px, 3vw, 44px); }
.world-card-equatorial img { object-position: center; }
.world-index-end {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  align-items: end;
  border-top: 1px solid var(--line);
  padding-top: 22px;
  padding-bottom: clamp(90px, 11vw, 150px);
}
.world-index-end > p:last-child { margin: 0; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(28px, 4vw, 56px); font-weight: 700; line-height: 1; text-align: right; text-transform: uppercase; }

.collections-hero {
  padding: clamp(96px, 13vw, 165px) var(--edge) clamp(64px, 9vw, 120px);
}

.collections-hero h1 {
  width: min(760px, 100%);
  margin: 12px 0 26px;
  font-size: clamp(42px, 7vw, 88px);
}

.collections-hero > .container > p:last-child {
  width: min(650px, 100%);
  color: var(--muted);
  font-size: 18px;
  line-height: 1.7;
}

.collections-section {
  padding: 0 var(--edge) clamp(92px, 12vw, 150px);
}

.collections-grid,
.egypt-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--gap);
  align-items: stretch;
}

.collection-photo {
  position: relative;
  margin: 0;
  overflow: hidden;
  background: var(--cream);
}

.collection-photo img,
.summer-card img,
.congo-images img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.collection-photo figcaption,
.collection-photo > span,
.summer-card figcaption,
.egypt-photo figcaption {
  position: absolute;
  left: 24px;
  bottom: 22px;
  padding: 7px 12px;
  background: var(--sky);
  color: var(--cream);
}

.argentina-photo {
  grid-column: span 8;
  min-height: 640px;
}

.collection-note {
  grid-column: span 4;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(34px, 5vw, 72px);
  background: rgba(135, 206, 235, 0.1);
}

.collection-note h2 {
  margin: 0 0 28px;
  color: var(--sky);
  font-size: clamp(32px, 4vw, 54px);
  line-height: 1.05;
}

.collection-note p,
.egypt-copy p,
.summer-head > p,
.congo-copy p {
  color: var(--muted);
  line-height: 1.7;
}

.collection-note .btn {
  margin-top: 22px;
}

.egypt-copy .btn {
  margin-top: 22px;
  background: #b8892f;
  color: #fff9e8;
}

.egypt-copy .btn:hover {
  background: #d4af37;
  color: #173b2b;
}

.collection-swatches {
  display: flex;
  gap: 12px;
  margin-top: 28px;
}

.swatch-dot {
  width: 24px;
  height: 24px;
  border: 1px solid var(--line);
  border-radius: 999px;
}

.swatch-dot.sky {
  background: var(--sky);
}

.swatch-dot.white {
  background: #fff;
}

.collections-band {
  padding: clamp(72px, 10vw, 116px) var(--edge);
  background: var(--green);
  color: var(--cream);
}

.congo-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(360px, 1fr);
  gap: clamp(28px, 7vw, 110px);
  align-items: center;
}

.congo-copy {
  max-width: 570px;
}

.congo-copy .mono {
  color: var(--yellow);
}

.congo-copy h2 {
  margin: 8px 0 18px;
  font-size: clamp(30px, 5vw, 58px);
  line-height: 1.02;
}

.congo-copy p {
  color: rgba(245, 242, 237, 0.78);
}

.congo-copy .forest-tagline {
  margin: -4px 0 16px;
  color: var(--cream);
  font-family: "Bricolage Grotesque", sans-serif;
  font-size: clamp(22px, 2.4vw, 34px);
  font-weight: 700;
  line-height: 1.1;
}

.congo-copy .btn {
  border-color: var(--cream);
  color: var(--cream);
}

.congo-images {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
  align-items: center;
}

.congo-images img {
  aspect-ratio: 1;
  background: #10241a;
}

.congo-images img:nth-child(2) {
  margin-top: 54px;
}

.future-green {
  background:
    linear-gradient(135deg, rgba(245, 242, 237, 0.06), transparent 42%),
    var(--green);
}

.future-green-board {
  display: grid;
  gap: 14px;
}

.future-green-board div {
  min-height: 128px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid rgba(245, 242, 237, 0.22);
  padding: 22px;
  background: rgba(245, 242, 237, 0.08);
  color: var(--cream);
}

.future-green-board strong {
  font-family: "Bricolage Grotesque", sans-serif;
  font-size: clamp(28px, 4vw, 48px);
  line-height: 1;
  text-transform: uppercase;
}

.forest-editorial-card {
  position: relative;
  min-height: 440px;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(245, 242, 237, 0.28);
  background: #10241a;
}

.forest-editorial-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(10, 25, 17, 0.08) 42%, rgba(10, 25, 17, 0.88) 100%);
  pointer-events: none;
}

.forest-editorial-card img {
  width: 100%;
  height: 100%;
  min-height: 440px;
  object-fit: cover;
  object-position: center 58%;
  transition: transform 700ms ease;
}

.forest-editorial-card:hover img {
  transform: scale(1.025);
}

.forest-editorial-index,
.forest-editorial-card figcaption {
  position: absolute;
  z-index: 1;
  color: var(--cream);
}

.forest-editorial-index {
  top: 20px;
  right: 20px;
  padding: 8px 10px;
  border: 1px solid rgba(245, 242, 237, 0.55);
  background: rgba(10, 25, 17, 0.38);
}

.forest-editorial-card figcaption {
  right: 24px;
  bottom: 24px;
  left: 24px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  padding-top: 18px;
  border-top: 1px solid rgba(245, 242, 237, 0.55);
}

.forest-editorial-card figcaption strong {
  max-width: 280px;
  font-family: "Bricolage Grotesque", sans-serif;
  font-size: clamp(20px, 2.5vw, 32px);
  line-height: 1;
  text-align: right;
  text-transform: uppercase;
}

.egypt-section {
  padding-top: clamp(72px, 10vw, 128px);
}

.egypt-copy {
  grid-column: span 4;
  align-self: end;
  padding-bottom: clamp(20px, 5vw, 76px);
}

.egypt-copy h2 {
  margin: 0 0 18px;
  color: var(--sand);
  font-size: clamp(34px, 5vw, 66px);
  line-height: 1.02;
}

.egypt-photo {
  grid-column: span 8;
  min-height: 660px;
}

.egypt-photo figcaption,
.egypt-photo > span {
  right: 24px;
  left: auto;
  top: 28px;
  bottom: auto;
  background: rgba(28, 27, 27, 0.28);
  color: var(--yellow);
}

.summer-terminal {
  position: relative;
  overflow: hidden;
  padding: clamp(80px, 12vw, 150px) var(--edge);
  background: var(--cream);
}

.departures-bg {
  position: absolute;
  top: 18px;
  left: var(--edge);
  color: rgba(28, 27, 27, 0.04);
  font-size: clamp(86px, 18vw, 250px);
  pointer-events: none;
  white-space: nowrap;
}

.summer-head {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr minmax(260px, 410px);
  gap: var(--gap);
  align-items: end;
  margin-bottom: 52px;
}

.summer-head h2 {
  margin: 0;
  font-size: clamp(46px, 8vw, 110px);
}

.summer-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--gap);
}

.summer-card,
.summer-product,
.postcard-card {
  position: relative;
  min-height: 260px;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
}

.summer-card.wide {
  grid-column: span 2;
}

.summer-card.terminal {
  grid-column: span 3;
  min-height: 440px;
}

.summer-card.terminal::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.55));
}

.summer-card.terminal .btn {
  position: absolute;
  z-index: 1;
  left: 34px;
  bottom: 34px;
}

.summer-product,
.postcard-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 28px;
}

.summer-product span {
  font-size: 32px;
}

.summer-product h3 {
  margin: 0 0 8px;
}

.postcard-card {
  align-items: center;
  justify-content: center;
  background: var(--green);
  color: var(--cream);
  text-align: center;
}

.postcard-card strong {
  font-family: "Bricolage Grotesque", sans-serif;
  font-size: 48px;
}

.postcard-card em {
  color: rgba(245, 242, 237, 0.72);
}

.collections-footer {
  margin-top: 0;
}

.footer-signup {
  display: flex;
  gap: 12px;
  border-bottom: 1px solid rgba(245, 242, 237, 0.35);
  padding-bottom: 8px;
}

.footer-signup input {
  min-width: 0;
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--cream);
  outline: 0;
}

.footer-signup input::placeholder {
  color: rgba(245, 242, 237, 0.55);
}

.footer-signup button {
  border: 0;
  background: transparent;
  color: var(--cream);
  cursor: pointer;
}

.collections-footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  margin-top: 80px;
  color: rgba(245, 242, 237, 0.58);
}

.egypt-collection-page {
  background: var(--paper);
}

.egypt-collection-hero {
  position: relative;
  min-height: calc(100vh - 79px);
  display: flex;
  align-items: end;
  overflow: hidden;
  padding: clamp(80px, 10vw, 130px) var(--edge);
  background: var(--green);
  color: var(--cream);
}

.egypt-collection-hero img {
  position: absolute;
  inset: 0;
  opacity: 0.72;
}

.egypt-collection-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0.62));
}

.egypt-collection-hero .container {
  position: relative;
  z-index: 1;
}

.egypt-collection-hero h1 {
  margin: 12px 0 20px;
  font-size: clamp(64px, 12vw, 150px);
}

.egypt-collection-hero p:last-child {
  width: min(620px, 100%);
  font-size: clamp(18px, 2vw, 24px);
  line-height: 1.55;
}

.egypt-products-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--gap);
}

/* Green Chapter collection book */
.green-nav {
  padding: 13px var(--edge);
  border-bottom-color: transparent;
  color: #f3eee3;
  background: transparent;
  backdrop-filter: none;
  box-shadow: none;
}
.green-nav::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 -34px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(8, 35, 23, .34), transparent);
}
.green-nav .brand { font-size: 30px; letter-spacing: -.04em; }
.green-nav .nav-links { gap: clamp(26px, 4vw, 58px); }
.green-nav .nav-link { color: rgba(243, 238, 227, .74); }
.green-nav .nav-link:hover,
.green-nav .nav-link.active { color: #f3eee3; }
.green-nav .icon-button {
  width: 44px;
  height: 44px;
  border-color: transparent;
  color: #f3eee3;
}
.green-nav.is-scrolled {
  padding-block: 10px;
  border-bottom-color: rgba(243, 238, 227, .16);
  background: rgba(13, 45, 32, .84);
  backdrop-filter: blur(14px);
  box-shadow: 0 12px 30px rgba(5, 24, 15, .14);
}
.green-nav.is-scrolled::before { opacity: 0; }
.green-mobile-menu { color: #f3eee3; border-color: rgba(243, 238, 227, .18); background: rgba(13, 45, 32, .96); }
.green-mobile-menu a { border-color: rgba(243, 238, 227, .18); }
.green-collection-page { padding-top: 0; background: #ebe6dc; color: #183c2c; }
.green-hero { position: relative; min-height: 100vh; display: flex; align-items: end; overflow: hidden; padding: clamp(70px, 9vw, 120px) var(--edge); color: #f3eee3; background: #153a2a; }
.green-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 38%; }
.green-hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,35,24,.93) 0%, rgba(10,35,24,.7) 42%, rgba(10,35,24,.1) 76%), linear-gradient(0deg, rgba(8,24,17,.68), transparent 55%); }
.green-hero-copy { position: relative; z-index: 1; }
.green-hero h1 { margin: 12px 0 18px; font-size: clamp(62px, 11vw, 146px); line-height: .82; letter-spacing: -.055em; }
.green-hero-copy > p:not(.mono) { width: min(520px, 100%); margin-bottom: 30px; font-size: clamp(18px, 2vw, 24px); line-height: 1.5; }
.green-hero-index { position: absolute; z-index: 2; right: var(--edge); bottom: 32px; }
.green-manifesto { padding: clamp(90px, 12vw, 170px) var(--edge); background: #f1ede4; }
.green-manifesto-grid { display: grid; grid-template-columns: 2fr 5fr 3fr; gap: clamp(30px, 5vw, 80px); align-items: start; }
.green-manifesto h2 { margin: 0; font-size: clamp(62px, 9vw, 128px); line-height: .85; }
.green-manifesto-grid > div { font-size: 18px; line-height: 1.7; color: #466354; }
.green-editorial { display: grid; grid-template-columns: 7fr 5fr; gap: var(--gap); padding-top: clamp(20px, 4vw, 60px); padding-bottom: clamp(90px, 11vw, 160px); }
.green-editorial figure { position: relative; margin: 0; overflow: hidden; background: #ded8cc; }
.green-editorial-look { min-height: 980px; }
.green-editorial-stack { display: grid; grid-template-rows: 1fr auto; gap: var(--gap); }
.green-editorial-stack figure { min-height: 680px; }
.green-editorial img { width: 100%; height: 100%; object-fit: cover; }
.green-editorial figcaption { position: absolute; right: 18px; bottom: 18px; left: 18px; padding: 10px 12px; color: #f3eee3; background: rgba(15,45,31,.78); }
.green-editorial blockquote { margin: 0; padding: 46px; font-size: clamp(42px, 6vw, 76px); line-height: .92; color: #f3eee3; background: #b77778; }
.green-palette { padding: clamp(90px, 11vw, 150px) var(--edge); color: #f3eee3; background: #143a2a; }
.green-section-head { display: flex; justify-content: space-between; gap: 40px; align-items: end; margin-bottom: 50px; }
.green-section-head h2 { margin: 8px 0 0; font-size: clamp(50px, 8vw, 110px); }
.green-section-head > p { width: min(410px, 100%); line-height: 1.65; color: rgba(243,238,227,.7); }
.green-palette-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap); align-items: stretch; }
.green-palette-grid figure { grid-column: span 3; margin: 0; overflow: hidden; background: #e7e2da; }
.green-palette-grid figure:nth-child(3),
.green-palette-grid figure:nth-child(4) { grid-row: 2; }
.green-palette-grid img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.green-palette-grid figcaption { display: flex; justify-content: space-between; gap: 20px; padding: 18px; color: #173b2b; }
.green-palette-grid small { color: #718075; }
.green-palette-grid .green-palette-look { grid-column: 7 / -1; grid-row: 1 / span 2; position: relative; min-height: 0; background: #7795b8; }
.green-palette-grid .green-palette-look img { height: 100%; aspect-ratio: auto; object-position: center; }
.green-palette-grid .green-palette-look figcaption { position: absolute; right: 18px; bottom: 18px; left: 18px; color: #f3eee3; background: rgba(15,45,31,.84); }
.green-palette-grid .green-palette-look small { color: rgba(243,238,227,.72); }
.green-details { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap); padding-top: clamp(100px, 12vw, 170px); padding-bottom: clamp(100px, 12vw, 170px); }
.green-details-copy { grid-column: 1 / -1; display: grid; grid-template-columns: 2fr 5fr 3fr; gap: clamp(24px, 4vw, 64px); align-items: end; margin-bottom: clamp(54px, 7vw, 100px); border-top: 1px solid #b9b3a8; padding-top: 22px; }
.green-details-copy h2 { margin: 0; color: #153b2b; font-size: clamp(58px, 8.5vw, 118px); line-height: .82; letter-spacing: -.04em; }
.green-details-copy > p:first-child { align-self: start; margin-top: 5px; }
.green-details-copy > p:last-child { max-width: 390px; margin: 0; line-height: 1.7; color: #566d60; }
.green-details figure { position: relative; margin: 0; overflow: hidden; background: #ded8cf; }
.green-details img { width: 100%; height: 100%; object-fit: cover; }
.green-details-story { grid-column: 1 / span 7; min-height: clamp(720px, 78vw, 1120px); }
.green-details-story img { object-position: center center; }
.green-details-story figcaption { position: absolute; right: 20px; bottom: 20px; left: 20px; display: flex; justify-content: space-between; gap: 20px; padding: 12px 14px; color: #f3eee3; background: rgba(15, 45, 31, .82); }
.green-details-stack { grid-column: 9 / -1; display: grid; gap: clamp(70px, 9vw, 140px); align-content: center; }
.green-detail-product { aspect-ratio: 1 / 1; border: 1px solid rgba(21, 59, 43, .12); }
.green-detail-product img { object-fit: contain; }
.green-detail-product figcaption { position: absolute; top: 14px; left: 14px; padding: 7px 9px; color: #f3eee3; background: #173b2b; }
.green-detail-shorts { aspect-ratio: 4 / 3; }
.green-objects { padding: clamp(90px, 11vw, 150px) var(--edge); background: #d5c4a6; }
.green-objects-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--gap); }
.green-object-copy { grid-column: span 5; padding: 40px 6vw 60px 0; }
.green-object-copy h2 { margin: 12px 0 24px; font-size: clamp(56px, 8vw, 108px); line-height: .86; }
.green-object-copy > p:last-child { max-width: 470px; line-height: 1.7; }
.green-objects figure { position: relative; margin: 0; overflow: hidden; background: #e9e4dc; }
.green-objects .tote { grid-column: span 7; }
.green-objects .green-objects-campaign {
  grid-column: 2 / -2;
  aspect-ratio: 6 / 5;
  margin: clamp(60px, 8vw, 120px) 0 clamp(76px, 10vw, 140px);
  overflow: visible;
  border: clamp(8px, 1.2vw, 16px) solid #f1ede4;
  box-shadow: clamp(14px, 2vw, 28px) clamp(14px, 2vw, 28px) 0 #173b2b;
  transform: rotate(-1.1deg);
}
.green-objects .green-objects-campaign img {
  object-position: center 55%;
}
.green-objects .green-objects-campaign figcaption {
  right: auto;
  bottom: auto;
  left: clamp(-34px, -2.5vw, -18px);
  top: clamp(20px, 3vw, 38px);
  display: grid;
  gap: 5px;
  width: max-content;
  padding: 12px 16px;
  background: #b77778;
  box-shadow: 7px 7px 0 #173b2b;
  transform: rotate(-2deg);
}
.green-objects .green-objects-campaign figcaption span:last-child {
  color: rgba(244, 239, 229, .72);
}
.green-objects .cap { grid-column: 1 / span 7; }
.green-objects .tote-back { grid-column: span 5; }
.green-objects img { width: 100%; height: 100%; object-fit: cover; }
.green-objects figcaption { position: absolute; right: 16px; bottom: 16px; left: 16px; padding: 10px; color: #f4efe5; background: rgba(22,58,42,.82); }
.green-products { overflow: hidden; background: #f1ede4; }
.green-pieces-head { display: grid; grid-template-columns: 7fr 3fr; gap: var(--gap); align-items: end; margin-bottom: clamp(64px, 10vw, 140px); border-top: 1px solid #b9b3a8; padding-top: 24px; }
.green-pieces-head h2 { margin: 12px 0 0; color: #153b2b; font-size: clamp(66px, 11vw, 154px); line-height: .78; letter-spacing: -.055em; }
.green-pieces-head > p { max-width: 390px; margin: 0; color: #566d60; font-size: 17px; line-height: 1.7; }
.green-products-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(70px, 9vw, 140px) var(--gap); align-items: start; }
.green-piece { min-width: 0; }
.green-piece-polo { grid-column: 1 / span 7; }
.green-piece-shorts { grid-column: 9 / -1; margin-top: clamp(120px, 16vw, 230px); }
.green-piece-tote { grid-column: 1 / span 5; }
.green-piece-cap { grid-column: 7 / -1; margin-top: clamp(90px, 12vw, 170px); }
.green-piece .product-media { border: 1px solid rgba(21, 59, 43, .12); background: #e4dfd6; }
.green-piece-polo .product-media { aspect-ratio: 1 / 1; }
.green-piece-shorts .product-media { aspect-ratio: 4 / 5; }
.green-piece-tote .product-media { aspect-ratio: 4 / 5; }
.green-piece-cap .product-media { aspect-ratio: 1 / 1; }
.green-piece-polo img,
.green-piece-shorts img,
.green-piece-cap img { object-fit: contain; }
.green-piece-tote img { object-position: center 56%; }
.green-piece-number { position: absolute; top: 16px; left: 16px; z-index: 1; padding: 8px 10px; color: #f3eee3; background: #173b2b; }
.green-piece .product-meta { margin-top: 18px; border-top: 1px solid #b9b3a8; padding-top: 15px; }
.green-piece .product-meta h3 { color: #153b2b; font-size: clamp(24px, 2.2vw, 34px); }
.green-piece .product-meta p { font-size: 10px; }
.green-piece .price { color: #153b2b; font-size: 15px; }
.green-footer { background: #0d2d20; }

@media (max-width: 980px) {
  .green-manifesto-grid, .green-details-copy { grid-template-columns: 1fr 2fr; }
  .green-manifesto-grid > div, .green-details-copy > p:last-child { grid-column: 2; }
  .green-details-story { grid-column: 1 / span 7; }
  .green-details-stack { grid-column: 8 / -1; }
  .green-editorial { grid-template-columns: 1fr; }
  .green-editorial-look { min-height: 760px; }
  .green-pieces-head { grid-template-columns: 2fr 1fr; }
  .green-piece-polo { grid-column: 1 / span 7; }
  .green-piece-shorts { grid-column: 8 / -1; }
  .green-piece-tote { grid-column: 1 / span 6; }
  .green-piece-cap { grid-column: 7 / -1; }
  .green-palette-grid figure { grid-column: span 6; }
  .green-palette-grid .green-palette-look { grid-column: 1 / -1; grid-row: 3; aspect-ratio: 16 / 10; }
  .green-palette-grid .green-palette-look img { object-position: center 35%; }
}

@media (max-width: 640px) {
  .green-nav { padding-block: 10px; }
  .green-nav .brand { font-size: 26px; }
  .green-nav .icon-button { width: 40px; height: 40px; }
  .green-mobile-menu { top: 66px; }
  .green-hero { min-height: 760px; }
  .green-hero > img { object-position: 61% center; }
  .green-hero-shade { background: linear-gradient(0deg, rgba(8,30,20,.95), rgba(8,30,20,.12) 82%); }
  .green-hero-index { display: none; }
  .green-manifesto-grid, .green-details-copy, .green-details { grid-template-columns: 1fr; }
  .green-manifesto-grid > div, .green-details-copy > p:last-child, .green-details-copy { grid-column: auto; }
  .green-editorial-look, .green-editorial-stack figure { min-height: 560px; }
  .green-section-head { display: block; }
  .green-section-head > p { margin-top: 22px; }
  .green-palette-grid { grid-template-columns: 1fr; gap: 18px; }
  .green-palette-grid figure,
  .green-palette-grid figure:nth-child(3),
  .green-palette-grid figure:nth-child(4),
  .green-palette-grid .green-palette-look { grid-column: auto; grid-row: auto; }
  .green-palette-grid figcaption { padding: 14px; }
  .green-palette-grid .green-palette-look { aspect-ratio: 4 / 5; margin-top: 18px; }
  .green-palette-grid .green-palette-look img { object-position: center; }
  .green-palette-grid .green-palette-look figcaption { right: 12px; bottom: 12px; left: 12px; }
  .green-object-copy, .green-objects .tote, .green-objects .green-objects-campaign, .green-objects .cap, .green-objects .tote-back { grid-column: 1 / -1; }
  .green-object-copy { padding-right: 0; }
  .green-objects .green-objects-campaign {
    margin: 54px 8px 70px 0;
    border-width: 7px;
    box-shadow: 10px 10px 0 #173b2b;
    transform: rotate(-.6deg);
  }
  .green-objects .green-objects-campaign figcaption {
    left: -8px;
    top: 16px;
    padding: 9px 11px;
    font-size: 10px;
  }
  .green-details-copy { display: block; }
  .green-details-copy h2 { margin-block: 26px; }
  .green-details-story, .green-details-stack { grid-column: auto; }
  .green-details-story { min-height: 660px; }
  .green-details-stack { margin-top: 36px; gap: 54px; }
  .green-details-story figcaption { display: block; }
  .green-details-story figcaption span { display: block; }
  .green-details-story figcaption span + span { margin-top: 6px; }
  .green-pieces-head { display: block; margin-bottom: 58px; }
  .green-pieces-head > p { margin-top: 26px; }
  .green-products-grid { grid-template-columns: 1fr; gap: 64px; }
  .green-piece-polo, .green-piece-shorts, .green-piece-tote, .green-piece-cap { grid-column: auto; margin-top: 0; }
  .green-piece-polo .product-media,
  .green-piece-shorts .product-media,
  .green-piece-cap .product-media { aspect-ratio: 1 / 1; }
  .green-piece-tote .product-media { aspect-ratio: 4 / 5; }
}

.look-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--gap);
}

.look-tile {
  position: relative;
  min-height: 420px;
  overflow: hidden;
  background: var(--cream);
}

.look-tile.wide {
  grid-column: span 7;
}

.look-tile.tall {
  grid-column: span 5;
  min-height: 620px;
}

.look-caption {
  position: absolute;
  right: 20px;
  bottom: 20px;
  left: 20px;
  color: var(--cream);
}

.product-detail {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(340px, 5fr);
  gap: clamp(28px, 5vw, 70px);
  align-items: start;
}

.gallery {
  display: grid;
  gap: var(--gap);
}

.gallery-main {
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background: var(--cream);
}

.gallery-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
}

.gallery-pair div {
  aspect-ratio: 1;
  overflow: hidden;
}

.gallery-main.gallery-on-body,
.gallery-pair.gallery-on-body div {
  aspect-ratio: 4 / 5;
  background: #e9e5dd;
}

.gallery-on-body img {
  object-position: center;
  transition: transform 700ms cubic-bezier(.2,.7,.2,1);
}

.gallery-on-body:hover img { transform: scale(1.015); }

.product-panel {
  position: sticky;
  top: 110px;
}

.product-panel h1 {
  margin: 12px 0;
  color: var(--green);
  font-size: clamp(38px, 5vw, 62px);
}

.choice-row {
  display: flex;
  gap: 10px;
  margin: 12px 0 28px;
}

.accordion {
  border-top: 1px solid var(--line);
}

.accordion button {
  display: flex;
  width: 100%;
  justify-content: space-between;
  border: 0;
  border-bottom: 1px solid var(--line);
  padding: 18px 0;
  background: transparent;
  cursor: pointer;
}

.accordion-panel {
  display: none;
  padding: 0 0 18px;
  color: var(--muted);
  line-height: 1.7;
}

.accordion.open .accordion-panel {
  display: block;
}

.cart-layout {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: clamp(28px, 6vw, 90px);
}

.cart-item {
  display: grid;
  grid-template-columns: 150px 1fr auto;
  gap: 22px;
  align-items: center;
  border-top: 1px solid var(--line);
  padding: 24px 0;
}

.cart-thumb {
  aspect-ratio: 1;
  overflow: hidden;
  background: var(--cream);
}

.remove-item { padding: 0; border: 0; color: var(--muted); background: transparent; text-decoration: underline; cursor: pointer; }
.empty-cart { min-height: 330px; display: grid; place-content: center; justify-items: start; border-top: 1px solid var(--line); }
.empty-cart h2 { margin: 8px 0 24px; font-size: clamp(32px, 5vw, 58px); }

.qty {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--line);
}

.qty button {
  width: 34px;
  height: 34px;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.summary {
  position: sticky;
  top: 110px;
  align-self: start;
  padding: 28px;
  background: var(--cream);
}

.summary-row {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  padding: 14px 0;
}

.story-hero {
  padding-top: clamp(80px, 11vw, 150px);
  padding-bottom: clamp(70px, 8vw, 110px);
}

.story-hero-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--gap);
  align-items: start;
}

.story-title {
  grid-column: span 7;
}

.story-title h1 {
  margin: 0;
  font-size: clamp(46px, 7vw, 92px);
}

.story-title span {
  color: #d9d5cf;
}

.story-manifesto {
  grid-column: 9 / -1;
  padding-top: 42px;
}

.story-manifesto p,
.story-artifact p,
.story-copy p,
.story-world-head p,
.story-newsletter p {
  color: var(--muted);
  line-height: 1.7;
}

.story-rule {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
  margin-top: 26px;
}

.story-rule span,
.story-quote span {
  display: block;
  height: 1px;
  background: var(--green);
}

.story-studio {
  position: relative;
  grid-column: span 7;
  margin-top: 58px;
  min-height: 520px;
  background: var(--green);
  overflow: visible;
}

.story-studio img,
.story-artifact img,
.story-mini-image img,
.story-world-card img {
  object-fit: cover;
}

.story-studio > img {
  object-position: center 28%;
}

.story-artifact > div img {
  object-position: center center;
}

.origin-card {
  position: absolute;
  right: -42px;
  bottom: -22px;
  width: min(380px, 75%);
  padding: 28px;
  background: var(--green);
  color: var(--cream);
}

.origin-card h2 {
  margin: 8px 0 12px;
  font-size: 24px;
}

.origin-card p:last-child {
  margin-bottom: 0;
  line-height: 1.7;
}

.story-artifact {
  grid-column: 8 / -1;
  margin-top: 150px;
}

.story-artifact > div {
  aspect-ratio: 4 / 3;
  margin: 18px 0 28px;
  padding: clamp(22px, 4vw, 54px);
  background: var(--cream);
}

.story-artifact-secondary {
  aspect-ratio: 1;
  margin: 36px 0 0;
  overflow: hidden;
}

.story-artifact-secondary img {
  object-position: center center;
}

.story-quote {
  position: relative;
  display: grid;
  min-height: 430px;
  place-items: center;
  overflow: hidden;
  background: #1e1e1e;
  color: var(--paper);
  text-align: center;
}

.story-quote h2 {
  position: relative;
  z-index: 1;
  margin: 0;
  font-size: clamp(46px, 7vw, 92px);
  font-style: italic;
  text-shadow: 4px 4px 0 #000;
}

.story-quote-shadow {
  position: absolute;
  left: 50%;
  width: max-content;
  margin: 0;
  color: rgba(255, 255, 255, 0.08);
  font-size: clamp(74px, 13vw, 180px);
  transform: translateX(-50%);
}

.story-quote span {
  position: absolute;
  bottom: 118px;
  width: 72px;
  background: var(--paper);
}

.story-truth {
  background: var(--paper);
}

.story-truth-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(180px, 0.48fr) minmax(180px, 0.48fr);
  gap: clamp(24px, 5vw, 76px);
  align-items: center;
}

.story-copy h2 {
  margin: 10px 0 28px;
  font-size: clamp(32px, 4vw, 54px);
  line-height: 1.05;
}

.story-principle {
  max-width: 600px;
  margin-top: 26px;
}

.story-principle p {
  margin: 7px 0;
}

.story-mini-image {
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: var(--cream);
}

.story-mini-image.detail {
  aspect-ratio: 3 / 4;
}

.story-world {
  background: #f1f0ea;
}

.story-world-head {
  display: grid;
  grid-template-columns: 1fr minmax(260px, 420px);
  gap: var(--gap);
  align-items: start;
  margin-bottom: 46px;
}

.story-world-head h2 {
  margin: 0;
  font-size: clamp(30px, 4vw, 52px);
  line-height: 1.05;
}

.story-world-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(10px, 1.25vw, 18px);
}

.story-world-card {
  position: relative;
  min-height: 420px;
  overflow: hidden;
  background: #173b2b;
  color: var(--paper);
}

.story-world-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 38%, rgba(8, 20, 14, .86) 100%);
  transition: background 350ms ease;
}

.story-world-card img { transition: transform 700ms cubic-bezier(.2,.7,.2,1); }
.story-world-card:hover img { transform: scale(1.025); }
.story-world-card:hover::after { background: linear-gradient(180deg, rgba(8, 20, 14, .02) 26%, rgba(8, 20, 14, .92) 100%); }

.story-world-argentina { grid-column: span 8; min-height: clamp(600px, 66vw, 900px); }
.story-world-green { grid-column: span 4; min-height: clamp(600px, 66vw, 900px); }
.story-world-egypt { grid-column: span 4; min-height: clamp(430px, 48vw, 650px); }
.story-world-equatorial { grid-column: span 8; min-height: clamp(430px, 48vw, 650px); }
.story-world-argentina img { object-position: center; }
.story-world-green img { object-position: center 42%; }
.story-world-egypt img { object-position: center; }
.story-world-equatorial img { object-position: center 48%; }

.story-world-card-copy {
  position: absolute;
  z-index: 2;
  right: clamp(18px, 2.5vw, 34px);
  bottom: clamp(18px, 2.5vw, 34px);
  left: clamp(18px, 2.5vw, 34px);
}

.story-world-card-copy > p { margin: 0 0 10px; color: rgba(253,248,247,.72); }
.story-world-card-copy h3 {
  margin: 0;
  font-family: "Bricolage Grotesque", sans-serif;
  font-size: clamp(30px, 4vw, 58px);
  line-height: .94;
  text-transform: uppercase;
}
.story-world-card-copy > span {
  position: static;
  display: block;
  margin-top: 20px;
  border-top: 1px solid rgba(253,248,247,.48);
  padding: 12px 0 0;
  background: transparent;
  color: var(--paper);
}

.story-newsletter {
  text-align: center;
}

.story-newsletter h2 {
  margin: 0 0 18px;
  font-size: clamp(30px, 4vw, 46px);
}

.story-newsletter p {
  width: min(560px, 100%);
  margin: 0 auto;
}

.story-form {
  margin-inline: auto;
  border: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.story-form input {
  padding-left: 18px;
}

.story-form button {
  padding-inline: 24px;
  background: var(--green);
  color: var(--cream);
}

/* Customer reviews */
.home-reviews { background: #ece7dd; }
.reviews-heading {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(280px, 3fr);
  gap: clamp(30px, 6vw, 90px);
  align-items: end;
  margin-bottom: clamp(48px, 8vw, 100px);
  border-top: 1px solid #bdb7ab;
  padding-top: 22px;
}
.reviews-heading h2 {
  margin: 10px 0 0;
  color: var(--green);
  font-size: clamp(56px, 9vw, 124px);
  line-height: .8;
  letter-spacing: -.05em;
}
.reviews-heading > p { max-width: 430px; margin: 0; color: var(--muted); font-size: 17px; line-height: 1.7; }
.home-review-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); align-items: start; }
.home-review-card { min-width: 0; background: #f8f4ed; }
.home-review-card:nth-child(2) { margin-top: clamp(40px, 7vw, 100px); }
.home-review-photo { position: relative; aspect-ratio: 4 / 5; overflow: hidden; background: #d8d2c7; }
.home-review-photo > span { position: absolute; left: 14px; bottom: 14px; padding: 7px 9px; color: var(--cream); background: rgba(14, 44, 31, .82); }
.home-review-copy { padding: clamp(20px, 2.5vw, 34px); }
.review-stars { display: inline-block; color: #c28a2f; font-size: 16px; letter-spacing: .12em; white-space: nowrap; }
.home-review-copy blockquote { min-height: 120px; margin: 18px 0 28px; color: #2d3b33; font-size: clamp(17px, 1.5vw, 21px); line-height: 1.55; }
.home-review-copy > div { display: grid; gap: 6px; border-top: 1px solid #d2ccc1; padding-top: 17px; }
.home-review-copy strong { font-family: "Bricolage Grotesque", sans-serif; font-size: 20px; text-transform: uppercase; }
.home-review-copy .mono { color: var(--muted); font-size: 9px; }

.product-reviews { background: #ece7dd; }
.product-review-layout { display: grid; grid-template-columns: minmax(240px, 3fr) minmax(0, 9fr); gap: clamp(32px, 7vw, 110px); align-items: start; }
.review-summary { border-top: 1px solid #aaa397; padding-top: 20px; }
.review-score { display: block; margin-bottom: 6px; color: var(--green); font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(64px, 8vw, 108px); font-weight: 800; line-height: .85; }
.review-summary > p { color: var(--muted); }
.rating-bars { display: grid; gap: 9px; margin: 30px 0; }
.rating-bars > div { display: grid; grid-template-columns: 14px 1fr 34px; gap: 10px; align-items: center; color: var(--muted); font-size: 11px; }
.rating-bars i { height: 4px; overflow: hidden; background: #d0c9bd; }
.rating-bars b { display: block; height: 100%; background: var(--green); }
.rating-bars small { text-align: right; }
.review-summary .btn { width: 100%; }
.review-feed { display: grid; gap: var(--gap); }
.featured-customer-review { display: grid; grid-template-columns: minmax(240px, 5fr) minmax(280px, 7fr); min-height: 520px; background: var(--green); color: var(--cream); }
.featured-review-photo { min-height: 520px; overflow: hidden; }
.featured-review-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(30px, 5vw, 70px); }
.featured-review-copy > .mono { color: rgba(245,242,237,.58); }
.featured-review-copy blockquote { margin: 24px 0 38px; font-family: "Bricolage Grotesque", sans-serif; font-size: clamp(24px, 3vw, 42px); font-weight: 700; line-height: 1.15; }
.avatar-review-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gap); }
.avatar-review-grid:has(.avatar-review:nth-child(3)) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.avatar-review { min-height: 260px; display: flex; flex-direction: column; padding: clamp(24px, 3vw, 38px); background: #f8f4ed; }
.avatar-review > p { flex: 1; margin: 22px 0 34px; color: #3d4a43; font-size: 16px; line-height: 1.65; }
.review-author { display: flex; gap: 13px; align-items: center; }
.review-avatar { width: 42px; height: 42px; display: grid; flex: 0 0 42px; place-items: center; border-radius: 50%; color: var(--cream); background: var(--green); font-family: "Space Mono", monospace; font-size: 10px; letter-spacing: .08em; }
.featured-review-copy .review-avatar { color: var(--green); background: var(--cream); }
.review-author div { display: grid; gap: 3px; }
.review-author strong { font-family: "Bricolage Grotesque", sans-serif; text-transform: uppercase; }
.review-author small { color: var(--muted); }
.featured-review-copy .review-author small { color: rgba(245,242,237,.58); }

.story-footer {
  background: var(--green);
}

.story-footer .footer-title {
  font-size: clamp(44px, 8vw, 92px);
}

.story-footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  margin-top: 70px;
  border-top: 1px solid rgba(245, 242, 237, 0.18);
  padding-top: 22px;
  color: rgba(245, 242, 237, 0.78);
}

.reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 700ms ease, transform 700ms ease;
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 980px) {
  .nav-links {
    display: none;
  }

  .menu-toggle {
    display: inline-flex;
  }

  .world-index-hero {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .world-index-intro { max-width: 560px; }

  .reviews-heading { grid-template-columns: 1fr; }
  .reviews-heading > p { max-width: 560px; }
  .product-review-layout { grid-template-columns: 1fr; }
  .review-summary { display: grid; grid-template-columns: auto 1fr; gap: 8px 22px; align-items: end; }
  .review-summary > p, .rating-bars, .review-summary .btn { grid-column: 1 / -1; }
  .review-score { font-size: 78px; }

  .world-card-argentina { grid-column: 1 / span 7; }
  .world-card-green { grid-column: 8 / -1; margin-top: 90px; }
  .world-card-egypt { grid-column: 1 / span 5; }
  .world-card-equatorial { grid-column: 6 / -1; }

  .editorial-grid,
  .product-detail,
  .shop-layout,
  .cart-layout,
  .footer-grid,
  .collections-grid,
  .egypt-grid,
  .congo-grid,
  .summer-head,
  .story-hero-grid,
  .story-truth-grid,
  .story-world-head {
    grid-template-columns: 1fr;
  }

  .story-world-argentina,
  .story-world-green,
  .story-world-egypt,
  .story-world-equatorial {
    grid-column: auto;
    min-height: clamp(500px, 92vw, 760px);
  }

  .story-world-equatorial { min-height: clamp(420px, 72vw, 620px); }

  .argentina-photo,
  .collection-note,
  .egypt-copy,
  .egypt-photo {
    grid-column: auto;
  }

  .argentina-photo,
  .egypt-photo {
    min-height: 520px;
  }

  .collection-note {
    min-height: 420px;
  }

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

  .egypt-products-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .summer-card.wide,
  .summer-card.terminal {
    grid-column: span 2;
  }

  .story-title,
  .story-manifesto,
  .story-studio,
  .story-artifact,
  .story-world-card.wide,
  .story-world-card.dark,
  .story-world-card.tall,
  .story-world-card:not(.wide):not(.dark):not(.tall) {
    grid-column: auto;
  }

  .story-manifesto,
  .story-artifact {
    margin-top: 0;
    padding-top: 0;
  }

  .story-studio {
    min-height: 460px;
  }

  .origin-card {
    right: 18px;
    bottom: 18px;
  }

  .editorial-grid > *,
  .look-grid > * {
    grid-column: auto !important;
  }

  .feature-card.large,
  .feature-card.small,
  .look-tile.wide,
  .look-tile.tall {
    grid-column: auto;
  }

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

  .product-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .filters,
  .product-panel,
  .summary {
    position: static;
  }
}

@media (max-width: 640px) {
  .hero-content {
    padding-bottom: 58px;
  }

  .section-heading {
    display: block;
  }

  .world-index-hero {
    padding-top: 76px;
    padding-bottom: 54px;
  }

  .world-index-hero h1 { font-size: clamp(58px, 19vw, 84px); }

  .world-index { grid-template-columns: 1fr; gap: 18px; }

  .world-card-argentina,
  .world-card-green,
  .world-card-egypt,
  .world-card-equatorial {
    grid-column: auto;
    height: min(138vw, 680px);
    margin-top: 0;
  }

  .world-card-equatorial { height: min(120vw, 600px); }
  .world-card-copy h2 { font-size: clamp(40px, 13vw, 62px); }
  .world-index-end { display: block; }
  .world-index-end > p:last-child { margin-top: 44px; text-align: left; }

  .home-review-grid,
  .featured-customer-review,
  .avatar-review-grid,
  .avatar-review-grid:has(.avatar-review:nth-child(3)) { grid-template-columns: 1fr; }
  .home-review-card:nth-child(2) { margin-top: 0; }
  .home-review-copy blockquote { min-height: auto; }
  .featured-customer-review { min-height: auto; }
  .featured-review-photo { min-height: 0; aspect-ratio: 4 / 5; }
  .featured-review-copy { min-height: 400px; }

  .story-world-argentina,
  .story-world-green,
  .story-world-egypt,
  .story-world-equatorial { min-height: min(132vw, 660px); }

  .story-world-equatorial { min-height: min(105vw, 540px); }

  .product-grid,
  .product-strip,
  .gallery-pair,
  .look-grid,
  .story-world-grid,
  .summer-grid,
  .congo-images {
    grid-template-columns: 1fr;
  }

  .collections-hero h1 {
    font-size: clamp(40px, 12vw, 58px);
  }

  .argentina-photo,
  .egypt-photo,
  .summer-card.terminal {
    min-height: 380px;
  }

  .congo-images img:nth-child(2) {
    margin-top: 0;
  }

  .summer-card.wide,
  .summer-card.terminal {
    grid-column: auto;
  }

  .summer-head {
    display: block;
  }

  .egypt-products-grid {
    grid-template-columns: 1fr;
  }

  .collections-footer-bottom {
    display: block;
  }

  .origin-card {
    position: static;
    width: 100%;
  }

  .story-studio {
    display: grid;
    min-height: auto;
  }

  .story-studio img {
    aspect-ratio: 4 / 5;
  }

  .story-quote {
    min-height: 330px;
  }

  .story-footer-bottom {
    display: block;
  }

  .cart-item {
    grid-template-columns: 92px 1fr;
  }

  .cart-item > .price {
    grid-column: 2;
  }

  .newsletter {
    grid-template-columns: 1fr;
    border-bottom: 0;
  }

  .newsletter input {
    border-bottom: 2px solid currentColor;
  }
}