:root{--ink:#2a1d1a;--paper:#f4eee4;--wine:#682f2f;--tan:#c99865}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif}a{color:inherit}.skip{position:absolute;left:-9999px}.skip:focus{left:1rem;top:1rem;z-index:20;background:#fff;padding:.8rem}.top{height:64px;background:#251917;color:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 clamp(1rem,3vw,3rem);gap:1rem;font-size:.68rem;letter-spacing:.13em}.top a{text-decoration:none;white-space:nowrap}.brand{font-weight:800}.brand b{display:inline-grid;place-items:center;border:1px solid #c99865;border-radius:50%;width:2rem;height:2rem;font-size:.59rem;margin-left:.35rem}.hero{min-height:760px;position:relative;background:#61534a;display:flex;align-items:flex-end;padding:clamp(1rem,4vw,4rem)}.hero-image{position:absolute;inset:0;margin:0;overflow:hidden;background:#796957}.hero-image:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 50%,#241a17a8 100%)}.hero-image img{width:73%;height:100%;object-fit:cover;object-position:center;mask-image:linear-gradient(90deg,#000 88%,transparent 100%)}.hero-image figcaption{position:absolute;left:2rem;bottom:1.8rem;color:#fff;font-size:.68rem;z-index:1;text-shadow:0 1px 3px #000}.hero-panel{position:relative;z-index:1;background:#f3ecdfed;max-width:540px;margin-left:auto;padding:clamp(2.2rem,4vw,4.7rem);box-shadow:0 20px 60px #1a100d4d}.kicker{font-size:.65rem;letter-spacing:.2em;font-weight:800;color:var(--wine)}h1,h2{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;letter-spacing:-.065em;font-weight:600}h1{font-size:clamp(3.2rem,5vw,5.3rem);line-height:1.22;margin:1.3rem 0 1.7rem}h1 em{font-style:normal;color:var(--wine)}.lead{font-size:.92rem;line-height:1.95;margin:0 0 2.2rem}.next{font-weight:700;font-size:.85rem;text-decoration:none;border-bottom:1px solid var(--wine);padding:.6rem 0;display:inline-flex;gap:2.5rem}.hero-panel small{display:block;margin-top:2.7rem;color:#72645c;font-size:.66rem}.view{display:grid;grid-template-columns:42% 58%;background:#e1d3bf;min-height:700px}.view-heading{padding:clamp(5rem,8vw,9rem) clamp(1.5rem,5vw,6rem);align-self:center}.view h2{font-size:clamp(2.7rem,4.2vw,5rem);line-height:1.32;margin:1.1rem 0 1.5rem}.view-heading>p:not(.kicker):not(.status){line-height:2;font-size:.9rem;max-width:28em}.switch{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2.5rem}.switch button{background:transparent;border:1px solid #755c4b;padding:.85rem 1.15rem;color:var(--ink);font-size:.8rem;font-weight:700;font-family:inherit;cursor:pointer}.switch button[aria-pressed=true]{background:var(--wine);border-color:var(--wine);color:#fff}.status{font-size:.73rem;color:#634f46;margin-top:1rem}.view-image{position:relative;margin:0;min-height:700px;background:#69554a}.view-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.view-image figcaption{position:absolute;bottom:1.6rem;right:1.6rem;background:#251917d9;color:#fff;padding:.6rem .8rem;font-size:.68rem}.closing{background:#f5eee4;padding:clamp(5rem,8vw,9rem) clamp(1.5rem,8vw,9rem)}.closing h2{font-size:clamp(2.7rem,5vw,5.7rem);line-height:1.3;margin:1rem 0 2rem}.closing p:not(.kicker){font-size:.9rem;line-height:2;max-width:45rem}.closing a{display:inline-block;margin-top:2rem;text-decoration:none;border-bottom:1px solid;padding-bottom:.55rem;font-size:.8rem}footer{background:#251917;color:#eee5d9;padding:1.5rem clamp(1.5rem,8vw,9rem);font-size:.65rem}a:focus-visible,button:focus-visible{outline:3px solid #d39d63;outline-offset:4px}@media(max-width:1100px){.hero{min-height:0;display:flex;flex-direction:column;padding:0}.hero-image{position:relative;width:100%;aspect-ratio:16/10}.hero-image:after{display:none}.hero-image img{width:100%;mask-image:none}.hero-image figcaption{left:1rem;bottom:1rem}.hero-panel{box-shadow:none;max-width:none;width:100%;margin:0;padding:3rem 6vw}.view{grid-template-columns:1fr}.view-heading{padding:5rem 6vw}.view-image{min-height:0;aspect-ratio:16/10}}@media(max-width:600px){.top{height:58px}.top>span{display:none}.hero-image{aspect-ratio:4/3}.hero-image img{object-position:45% center}.hero-panel{padding:2.5rem 1.25rem 3rem}h1{font-size:clamp(2.3rem,9vw,3.8rem);margin:1rem 0 1.3rem}.lead{font-size:.86rem;line-height:1.8}.hero-panel small{margin-top:2rem}.view-heading{padding:4.5rem 1.25rem}.view h2{font-size:2.8rem}.view-heading>p:not(.kicker):not(.status){font-size:.86rem}.view-image{aspect-ratio:4/3}.closing{padding:4.5rem 1.25rem}.closing h2{font-size:2.7rem}.closing p:not(.kicker){font-size:.86rem}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* The shoe portrait uses a title masthead and leaves the product photograph unobstructed. */
.hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(550px, 1fr);
  min-height: 850px;
  padding: 0;
  background: #f3ecdf;
}
.hero-panel {
  grid-row: 1;
  grid-column: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2rem;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 1.8rem clamp(1.25rem, 4vw, 4rem);
  background: #f3ecdf;
  box-shadow: none;
}
.hero-panel .kicker { margin: 0; }
.hero-panel h1 {
  margin: 0;
  font-size: clamp(3.1rem, 4.6vw, 5.7rem);
  line-height: 1.12;
  text-align: right;
}
.hero-image {
  grid-row: 2;
  grid-column: 1;
  position: relative;
  width: 100%;
  min-height: 550px;
  aspect-ratio: auto;
}
.hero-image:after { display: none; }
.hero-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 55%;
  mask-image: none;
}
.hero-details {
  grid-row: 2;
  grid-column: 1;
  justify-self: end;
  align-self: end;
  z-index: 1;
  width: min(420px, 39%);
  margin: 2rem clamp(1.5rem, 3vw, 3rem);
  padding: 1.7rem 2rem;
  color: #fff;
  background: #251917ed;
}
.hero-details .lead { margin: 0 0 1.3rem; }
.hero-details .next { border-color: #d5a87d; }
.hero-details small {
  display: block;
  margin-top: 1.4rem;
  color: #e5d2c1;
  font-size: .66rem;
}
@media (max-width: 1100px) {
  .hero { display: grid; grid-template-rows: auto minmax(480px, 1fr); min-height: 0; }
  .hero-panel { display: grid; padding: 1.8rem 4vw; }
  .hero-panel h1 { font-size: clamp(3rem, 5.5vw, 4.5rem); }
  .hero-image { min-height: 480px; aspect-ratio: auto; }
  .hero-details { width: min(380px, 48%); margin: 1.5rem; }
}
@media (max-width: 600px) {
  .hero { grid-template-rows: auto auto auto; }
  .hero-panel { display: block; padding: 1.35rem 1.25rem 1.55rem; }
  .hero-panel h1 {
    margin-top: .7rem;
    font-size: clamp(2.6rem, 11.2vw, 3.8rem);
    text-align: left;
  }
  .hero-image { min-height: 0; aspect-ratio: 4 / 3; }
  .hero-details {
    grid-row: 3;
    grid-column: 1;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 1.6rem 1.25rem 1.9rem;
  }
  .hero-details .lead { margin-bottom: 1rem; }
}