@font-face {
      font-family: "Jost";
      font-style: normal;
      font-weight: 100 900;
      font-display: block;
      src: url("../fonts/jost.woff2") format("woff2");
    }
    @font-face {
      font-family: "Playfair Display";
      font-style: italic;
      font-weight: 400 900;
      font-display: block;
      src: url("../fonts/playfair-display-italic.woff2") format("woff2");
    }
    @font-face {
      font-family: "Playfair Display";
      font-style: normal;
      font-weight: 400 900;
      font-display: block;
      src: url("../fonts/playfair-display.woff2") format("woff2");
    }

    :root {
      --black: #121110;
      --ink: #1c1a18;
      --ivory: #f7f5f1;
      --paper: #fffdfa;
      --stone: #8f8a83;
      --hairline: rgba(18, 17, 16, .14);
      --serif: "futura-pt", "Jost", "Helvetica Neue", Helvetica, sans-serif;
      --brand: "Playfair Display", Georgia, serif;
      --micro: "futura-pt", "Jost", "Helvetica Neue", Helvetica, sans-serif;
    }

    * { margin: 0; padding: 0; box-sizing: border-box; }

    html { scroll-behavior: smooth; }

    body {
      font-family: var(--micro);
      font-weight: 300;
      color: var(--ink);
      background: var(--paper);
      -webkit-font-smoothing: antialiased;
      overflow-x: hidden;
    }

    img { display: block; max-width: 100%; }

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

    /* ---------- micro label ---------- */

    .eyebrow {
      font-family: var(--micro);
      font-size: 10.5px;
      font-weight: 400;
      letter-spacing: .42em;
      text-transform: uppercase;
      color: var(--stone);
    }

    /* ---------- header ---------- */

    header {
      position: fixed;
      top: 0; left: 0; right: 0;
      z-index: 100;
      display: grid;
      grid-template-columns: 1fr auto 1fr;
      align-items: center;
      padding: 18px 48px;
      color: #fff;
      transition: background .5s ease, color .5s ease, box-shadow .5s ease, transform .45s ease;
    }

    header .h-left { display: flex; align-items: center; gap: 38px; }

    header .h-right { display: flex; align-items: center; gap: 28px; justify-content: flex-end; }

    .tb-item {
      background: none;
      border: 0;
      padding: 0;
      color: inherit;
      font: inherit;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 11px;
      font-size: 13.5px;
      letter-spacing: .05em;
      transition: opacity .35s ease;
    }

    .tb-item:hover { opacity: .62; }

    .tb-item svg {
      width: 18px;
      height: 18px;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.3;
      stroke-linecap: round;
      stroke-linejoin: round;
      flex: none;
    }

    .bag-n {
      font-size: 10px;
      letter-spacing: 0;
      position: relative;
      top: -6px;
      margin-left: -5px;
    }

    /* ---------- menu drawer ---------- */

    .scrim {
      position: fixed;
      inset: 0;
      z-index: 140;
      background: rgba(12, 11, 10, .44);
      opacity: 0;
      visibility: hidden;
      transition: opacity .55s ease, visibility .55s;
    }

    body.menu-open .scrim { opacity: 1; visibility: visible; }

    .drawer {
      position: fixed;
      top: 0; left: 0; bottom: 0;
      z-index: 150;
      width: min(420px, 88vw);
      background: var(--paper);
      color: var(--ink);
      padding: 30px 58px 44px;
      display: flex;
      flex-direction: column;
      transform: translateX(-102%);
      transition: transform .7s cubic-bezier(.22, 1, .36, 1);
    }

    body.menu-open .drawer { transform: translateX(0); }

    body.menu-open { overflow: hidden; }

    .drawer-close { margin-bottom: 13vh; align-self: flex-start; }

    .drawer-nav, .drawer-sub { display: flex; flex-direction: column; align-items: flex-start; gap: 26px; }

    .drawer-nav a, .drawer-sub a {
      font-family: var(--micro);
      font-size: 19px;
      font-weight: 300;
      line-height: 1;
      letter-spacing: .03em;
      position: relative;
      padding-bottom: 4px;
    }

    .drawer-nav a::after, .drawer-sub a::after {
      content: "";
      position: absolute;
      left: 0; bottom: 0;
      width: 100%;
      height: 1px;
      background: currentColor;
      transform: scaleX(0);
      transform-origin: right;
      transition: transform .45s cubic-bezier(.22, 1, .36, 1);
    }

    .drawer-nav a:hover::after, .drawer-sub a:hover::after { transform: scaleX(1); transform-origin: left; }

    .drawer-foot {
      margin-top: auto;
      font-size: 11.5px;
      letter-spacing: .08em;
      color: var(--stone);
    }

    .wordmark {
      font-family: var(--brand);
      font-weight: 400;
      font-size: 34px;
      letter-spacing: .07em;
      margin-right: -.07em;
      white-space: nowrap;
    }

    header.hidden { transform: translateY(-100%); }

    header.scrolled {
      background: rgba(255, 253, 250, .96);
      color: var(--ink);
      box-shadow: 0 1px 0 var(--hairline);
    }

    /* ---------- hero ---------- */

    .hero {
      position: relative;
      height: 100vh;
      min-height: 620px;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      color: #fff;
    }

    .hero-bg {
      position: absolute;
      inset: 0;
      background: url("../images/hero-dune.jpg") center 30% / cover no-repeat;
      animation: heroZoom 14s ease-out forwards;
    }

    @keyframes heroZoom {
      from { transform: scale(1.08); }
      to { transform: scale(1); }
    }

    .hero::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(to bottom, rgba(10,9,8,.18) 0%, rgba(10,9,8,.02) 40%, rgba(10,9,8,.30) 100%);
    }

    /* ---------- reveal on scroll ---------- */

    .reveal {
      opacity: 0;
      transform: translateY(28px);
      transition: opacity 1.1s cubic-bezier(.16,1,.3,1), transform 1.1s cubic-bezier(.16,1,.3,1);
    }

    .reveal.in { opacity: 1; transform: none; }

    .reveal.d1 { transition-delay: .12s; }
    .reveal.d2 { transition-delay: .24s; }
    .reveal.d3 { transition-delay: .36s; }

    /* ---------- manifesto ---------- */

    .manifesto {
      background: var(--ivory);
      text-align: center;
      padding: 132px 24px 138px;
    }

    .manifesto .rule {
      width: 1px; height: 62px;
      background: var(--ink);
      opacity: .35;
      margin: 0 auto 44px;
    }

    .manifesto blockquote {
      font-family: var(--serif);
      font-weight: 300;
      font-size: clamp(28px, 3vw, 40px);
      line-height: 1.45;
      max-width: 900px;
      margin: 34px auto 0;
      color: var(--ink);
    }

    .manifesto blockquote em { font-style: normal; }

    /* ---------- editorial split ---------- */

    .editorial {
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: center;
      min-height: 720px;
      max-height: 880px;
      overflow: hidden;
    }

    .editorial.flip { grid-template-columns: 1fr 1fr; }

    .editorial-media { position: relative; overflow: hidden; height: 100%; min-height: 560px; }

    .editorial-media img {
      position: absolute;
      inset: 0;
      width: 100%; height: 100%;
      object-fit: cover;
      object-position: center 18%;
      transition: transform 1.6s cubic-bezier(.16,1,.3,1);
    }

    .editorial-media:hover img { transform: scale(1.035); }

    .editorial-copy { padding: 110px 11vw; }

    .editorial-copy h2 {
      font-family: var(--serif);
      font-weight: 300;
      font-size: clamp(36px, 3.4vw, 50px);
      line-height: 1.14;
      margin: 26px 0 30px;
    }

    .editorial-copy p {
      font-size: 14px;
      font-weight: 300;
      line-height: 2;
      color: #4c4844;
      max-width: 420px;
      margin-bottom: 38px;
    }

    .line-link {
      display: inline-block;
      font-size: 10.5px;
      letter-spacing: .38em;
      text-transform: uppercase;
      color: var(--ink);
      padding-bottom: 7px;
      position: relative;
    }

    .line-link::after {
      content: "";
      position: absolute;
      left: 0; bottom: 0;
      width: 100%; height: 1px;
      background: var(--ink);
      transition: transform .5s cubic-bezier(.22,1,.36,1);
      transform-origin: left;
    }

    .line-link:hover::after { transform: scaleX(.42); }

    /* ---------- icons row ---------- */

    .icons {
      padding: 84px 6vw 130px;
      text-align: center;
    }

    .icons > h2 {
      font-family: var(--serif);
      font-weight: 400;
      font-size: clamp(28px, 2.2vw, 34px);
      letter-spacing: .04em;
      margin: 16px 0 58px;
    }

    .icons .line-link { margin-top: 68px; }

    .icons-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 28px;
      max-width: 1400px;
      margin: 0 auto;
    }

    @media (max-width: 1280px) {
      .icons-grid { grid-template-columns: repeat(2, 1fr); max-width: 760px; row-gap: 56px; }
    }

    .icon-card { text-align: center; }

    .icon-media {
      position: relative;
      overflow: hidden;
      aspect-ratio: 4 / 5;
      background: #e9e6e1;
    }

    .icon-media img {
      width: 100%; height: 100%;
      object-fit: cover;
      transition: transform 1.4s cubic-bezier(.16,1,.3,1), opacity .6s ease;
    }

    .icon-card:hover .icon-media img { transform: scale(1.05); }

    .icon-veil {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      padding-bottom: 30px;
      background: linear-gradient(to top, rgba(18,17,16,.28), rgba(18,17,16,0) 38%);
      opacity: 0;
      transition: opacity .6s ease;
    }

    .icon-card:hover .icon-veil { opacity: 1; }

    .icon-veil span {
      font-size: 10px;
      letter-spacing: .4em;
      text-transform: uppercase;
      color: #fff;
      border-bottom: 1px solid rgba(255,255,255,.8);
      padding-bottom: 5px;
    }

    .icon-card h3 {
      font-family: var(--serif);
      font-weight: 400;
      font-size: 21px;
      letter-spacing: .02em;
      margin: 26px 0 8px;
    }

    .icon-card .price {
      font-size: 11px;
      letter-spacing: .28em;
      color: var(--stone);
    }

    /* ---------- dark experience ---------- */

    .experience { background: var(--black); }

    .film { position: relative; overflow: hidden; }

    .film video {
      width: 100vw;
      height: 88vh;
      min-height: 540px;
      object-fit: cover;
      display: block;
      background: #000;
    }

    /* glassy blur dissolve into the next loop: blurred first frame fades
       over the ending, then lifts to reveal the sharp restart.
       Blur is static (never animated), only opacity moves, so no lag. */
    .film::after {
      content: "";
      position: absolute;
      inset: 0;
      background: url("../images/film-poster.jpg") center / cover no-repeat;
      filter: blur(26px) saturate(.92);
      transform: scale(1.08);
      opacity: 0;
      transition: opacity 1.25s ease; /* the slower fade back to sharp */
      pointer-events: none;
    }

    .film.fading::after {
      opacity: 1;
      transition: opacity .95s ease; /* the fade into grey */
    }


    /* ---------- heritage ---------- */

    .heritage-quote {
      font-family: var(--serif);
      font-weight: 300;
      font-size: clamp(26px, 2.4vw, 34px);
      line-height: 1.5;
      max-width: 460px;
    }

    .heritage-quote strong { font-weight: 500; }

    /* ---------- newsletter ---------- */

    .join {
      background: var(--ivory);
      text-align: center;
      padding: 122px 24px 128px;
    }

    .join h2 {
      font-family: var(--serif);
      font-weight: 300;
      font-size: clamp(32px, 3vw, 42px);
      margin: 24px 0 14px;
    }

    .join p { font-size: 13px; color: #6c675f; letter-spacing: .04em; }

    .join form {
      display: flex;
      justify-content: center;
      align-items: flex-end;
      gap: 34px;
      margin-top: 54px;
    }

    .join input {
      width: min(360px, 70vw);
      border: 0;
      border-bottom: 1px solid var(--ink);
      background: transparent;
      font-family: var(--micro);
      font-weight: 300;
      font-size: 14px;
      letter-spacing: .05em;
      padding: 10px 2px;
      outline: none;
    }

    .join input::placeholder { color: #9d968d; }

    .join button {
      border: 0;
      background: none;
      font-family: var(--micro);
      font-size: 10.5px;
      letter-spacing: .38em;
      text-transform: uppercase;
      color: var(--ink);
      padding-bottom: 10px;
      border-bottom: 1px solid var(--ink);
      cursor: pointer;
      transition: opacity .4s ease;
    }

    .join button:hover { opacity: .55; }

    .join .thanks {
      display: none;
      margin-top: 26px;
      font-size: 15px;
      color: #4c4844;
    }

    /* ---------- footer ---------- */

    footer {
      background: var(--black);
      color: #b6afa6;
      padding: 96px 6vw 44px;
    }

    .foot-grid {
      display: grid;
      grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr;
      gap: 60px;
      max-width: 1280px;
      margin: 0 auto;
    }

    .foot-brand .wordmark { color: #fff; font-size: 24px; }

    .foot-brand p {
      font-size: 14px;
      margin-top: 22px;
      color: #857e75;
      max-width: 300px;
      line-height: 1.7;
    }

    footer h4 {
      font-size: 10px;
      font-weight: 400;
      letter-spacing: .38em;
      text-transform: uppercase;
      color: #6f6961;
      margin-bottom: 26px;
    }

    footer ul { list-style: none; }

    footer li { margin-bottom: 13px; }

    footer li a {
      font-size: 12.5px;
      letter-spacing: .06em;
      transition: color .3s ease;
    }

    footer li a:hover { color: #fff; }

    .foot-bottom {
      max-width: 1280px;
      margin: 80px auto 0;
      padding-top: 28px;
      border-top: 1px solid rgba(255,255,255,.09);
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-size: 11px;
      letter-spacing: .12em;
      color: #6f6961;
    }

    .foot-bottom .socials { display: flex; gap: 26px; }

    .foot-bottom .socials a { transition: color .3s ease; }

    .foot-bottom .socials a:hover { color: #fff; }

    @media (prefers-reduced-motion: reduce) {
      .reveal { opacity: 1; transform: none; transition: none; }
      .hero-bg { animation: none; }
      .scrim, .drawer { transition: none; }
    }

    /* ---------- collection page ---------- */

    body.solid-top header {
      background: rgba(255, 253, 250, .96);
      color: var(--ink);
      box-shadow: 0 1px 0 var(--hairline);
    }

    .collection {
      padding: 86px 12px 130px;
      text-align: center;
    }

    .collection h1 {
      font-family: var(--serif);
      font-weight: 300;
      font-size: clamp(38px, 3.4vw, 52px);
      margin: 24px 0 84px;
    }

    .collection-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 60px 14px;
      margin: 0 auto;
    }

    @media (max-width: 1280px) {
      .collection-grid { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 960px) {
      .collection-grid { grid-template-columns: repeat(2, 1fr); gap: 44px 12px; max-width: none; }
    }

    /* ---------- responsive ---------- */

    @media (max-width: 960px) {
      header { padding: 16px 22px; }
      header .h-left, header .h-right { gap: 20px; }
      .tb-label { display: none; }
      .editorial, .editorial.flip { grid-template-columns: 1fr; min-height: 0; }
      .editorial-media { min-height: 62vw; }
      .editorial-copy { padding: 70px 8vw 84px; }
      .icons-grid { grid-template-columns: repeat(2, 1fr); gap: 44px 12px; max-width: none; }
      .foot-grid { grid-template-columns: 1fr 1fr; gap: 44px 20px; text-align: center; }
      .foot-brand { grid-column: 1 / -1; text-align: center; margin-bottom: 4px; }
      .join form { flex-direction: column; align-items: center; gap: 26px; }
      .foot-bottom { flex-direction: column-reverse; gap: 20px; text-align: center; }
    }

    /* ---------- drawer secondary ---------- */

    .drawer-sep { height: 1px; background: var(--hairline); margin: 44px 0 30px; flex: none; }

    /* ---------- bag panel ---------- */

    .bagpanel {
      position: fixed;
      top: 0; right: 0; bottom: 0;
      z-index: 150;
      width: min(420px, 88vw);
      background: var(--paper);
      color: var(--ink);
      padding: 30px 44px 44px;
      display: flex;
      flex-direction: column;
      transform: translateX(102%);
      transition: transform .7s cubic-bezier(.22, 1, .36, 1);
    }

    body.bag-open .bagpanel { transform: translateX(0); }

    body.bag-open .scrim { opacity: 1; visibility: visible; }

    body.bag-open { overflow: hidden; }

    .bag-title { margin-bottom: 34px; }

    .bagpanel .drawer-close { margin-bottom: 9vh; }

    .bag-item {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      padding: 18px 0;
      border-bottom: 1px solid var(--hairline);
    }

    .bag-item:first-child { border-top: 1px solid var(--hairline); }

    .bag-item-name { font-family: var(--serif); font-size: 17px; margin-bottom: 5px; }

    .bag-item-meta { font-size: 12px; letter-spacing: .06em; color: var(--stone); }

    .bag-item-right { text-align: right; font-size: 13.5px; }

    .bag-remove {
      background: none; border: 0; padding: 0;
      font: inherit; font-size: 11px;
      letter-spacing: .1em;
      color: var(--stone);
      cursor: pointer;
      margin-top: 8px;
      border-bottom: 1px solid var(--hairline);
    }

    #bag-empty { font-size: 14.5px; color: var(--stone); }

    #bag-foot { margin-top: auto; display: none; }

    .bag-subtotal {
      display: flex;
      justify-content: space-between;
      font-size: 12px;
      letter-spacing: .22em;
      text-transform: uppercase;
      padding: 18px 0 22px;
    }

    .cta-solid {
      display: block;
      width: 100%;
      border-radius: 999px;
      background: #000;
      color: #fff;
      border: 0;
      padding: 17px 0;
      font: inherit;
      font-size: 11.5px;
      letter-spacing: .3em;
      text-transform: uppercase;
      cursor: pointer;
      transition: opacity .3s ease;
    }

    .cta-solid:hover { opacity: .84; }

    .cta-solid[disabled] { background: #c9c5bf; cursor: default; }

    .cta-solid[disabled]:hover { opacity: 1; }

    .bag-note { margin-top: 16px; font-size: 11.5px; line-height: 1.7; color: var(--stone); }

    /* ---------- product page ---------- */

    .pdp {
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: start;
    }

    .pdp-media { display: flex; flex-direction: column; gap: 2px; }

    .pdp-media img { width: 100%; display: block; background: #e9e6e1; }

    .pdp-info { position: sticky; top: 0; padding: 150px 6vw 90px; }

    .pdp-info h1 {
      font-family: var(--serif);
      font-weight: 400;
      font-size: clamp(30px, 2.6vw, 40px);
      line-height: 1.15;
      margin: 14px 0 10px;
    }

    .pdp-price { font-size: 15px; letter-spacing: .06em; margin-bottom: 34px; }

    .pdp-desc {
      font-size: 14.5px;
      line-height: 1.9;
      color: #4c4844;
      max-width: 54ch;
      margin-bottom: 44px;
    }

    .pdp-size-head {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      font-size: 11px;
      letter-spacing: .22em;
      text-transform: uppercase;
      margin-bottom: 14px;
    }

    .size-error { color: #9a3b2e; opacity: 0; transition: opacity .3s ease; }

    .size-error.show { opacity: 1; }

    .size-pills { display: flex; gap: 10px; margin-bottom: 36px; }

    .size-pill {
      min-width: 52px; height: 52px;
      padding: 0 16px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      background: none;
      border: 1px solid var(--hairline);
      font: inherit;
      font-size: 13px;
      letter-spacing: .04em;
      cursor: pointer;
      transition: border-color .25s ease, background .25s ease, color .25s ease;
    }

    .size-pill:hover { border-color: var(--ink); }

    .size-pill.on { background: var(--ink); color: #fff; border-color: var(--ink); }

    .pdp-cta { margin-bottom: 40px; }

    .oos-row { display: flex; flex-direction: column; gap: 14px; margin-bottom: 40px; }

    .notify-link {
      background: none; border: 0; padding: 0;
      font: inherit;
      font-size: 12px;
      letter-spacing: .14em;
      text-transform: uppercase;
      cursor: pointer;
      align-self: center;
      border-bottom: 1px solid var(--ink);
      padding-bottom: 3px;
    }

    .pdp-details details { border-top: 1px solid var(--hairline); padding: 20px 0; }

    .pdp-details details:last-child { border-bottom: 1px solid var(--hairline); }

    .pdp-details summary {
      cursor: pointer;
      list-style: none;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-size: 11.5px;
      letter-spacing: .24em;
      text-transform: uppercase;
    }

    .pdp-details summary::-webkit-details-marker { display: none; }

    .pdp-details summary::after { content: "+"; font-size: 16px; font-weight: 300; }

    .pdp-details details[open] summary::after { content: "\2212"; }

    .pdp-details p { padding-top: 14px; font-size: 13.5px; line-height: 1.85; color: #4c4844; }

    .pdp-note { margin-top: 28px; font-size: 12px; letter-spacing: .08em; color: var(--stone); }

    /* ---------- prose pages ---------- */

    .prose { max-width: 660px; margin: 0 auto; padding: 168px 24px 150px; }

    .prose h1 {
      font-family: var(--serif);
      font-weight: 400;
      font-size: 34px;
      margin: 14px 0 44px;
    }

    .prose h2 {
      font-family: var(--serif);
      font-weight: 400;
      font-size: 22px;
      margin: 46px 0 14px;
    }

    .prose p { font-size: 14px; line-height: 2; color: #4c4844; }

    /* ---------- contact ---------- */

    .contact { max-width: 620px; margin: 0 auto; padding: 168px 24px 150px; text-align: center; }

    .contact h1 { font-family: var(--serif); font-weight: 400; font-size: 34px; margin: 14px 0 18px; }

    .contact > p { font-size: 14px; line-height: 1.9; color: #4c4844; margin-bottom: 54px; }

    .contact form { text-align: left; }

    .contact input, .contact textarea {
      width: 100%;
      border: 0;
      border-bottom: 1px solid var(--hairline);
      background: none;
      padding: 14px 2px;
      font: inherit;
      font-size: 14px;
      margin-bottom: 26px;
      outline: none;
      resize: vertical;
      transition: border-color .3s ease;
    }

    .contact input:focus, .contact textarea:focus { border-color: var(--ink); }

    .contact .thanks { display: none; margin-top: 22px; font-size: 14.5px; }

    .contact-info { margin-top: 60px; font-size: 12.5px; letter-spacing: .08em; color: var(--stone); line-height: 2.2; }

    /* ---------- gift card ---------- */

    .gift {
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: center;
      min-height: 100vh;
    }

    .gift-media { height: 100%; min-height: 560px; }

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

    .gift-info { padding: 150px 7vw 100px; }

    .gift-info h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(30px, 2.6vw, 40px); margin: 14px 0 10px; }

    .gift-info .pdp-desc { margin-bottom: 38px; }

    .amount-pills { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 36px; }

    /* ---------- page media queries ---------- */

    @media (max-width: 960px) {
      .pdp, .gift { grid-template-columns: 1fr; }
      .pdp-info { position: static; padding: 70px 8vw 80px; }
      .gift-info { padding: 70px 8vw 90px; }
      .gift-media { min-height: 70vw; }
    }

    /* ---------- wishlist + account ---------- */

    .wish-row { margin: -26px 0 42px; }

    .wishpage { max-width: 1200px; }

    .wishpage .collection-grid { gap: 60px 24px; margin-top: 10px; text-align: center; }

    .wishpage #wish-empty {
      font-size: 14.5px;
      color: var(--stone);
      margin: 30px 0 34px;
      display: none;
    }

    .wish-remove {
      background: none; border: 0; padding: 0 0 2px;
      font: inherit; font-size: 11px;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--stone);
      border-bottom: 1px solid var(--hairline);
      cursor: pointer;
      margin-top: 10px;
    }

    .acct-sep {
      display: flex;
      align-items: center;
      gap: 18px;
      margin: 52px 0 44px;
      font-size: 10.5px;
      letter-spacing: .34em;
      text-transform: uppercase;
      color: var(--stone);
    }

    .acct-sep::before, .acct-sep::after {
      content: "";
      flex: 1;
      height: 1px;
      background: var(--hairline);
    }

    .cta-ghost {
      background: none;
      color: #000;
      border: 1px solid #000;
    }

    .cta-ghost:hover { opacity: .7; }

    /* ---------- LV-style product page ---------- */

    body.clear-top header { color: var(--ink); position: absolute; }

    body.clear-top header.pinned { position: fixed; }

    header.no-anim { transition: none !important; }

    .pdp-topline {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 30px;
    }

    .pdp-sku { font-size: 11px; letter-spacing: .2em; color: var(--stone); }

    .wish-heart { background: none; border: 0; padding: 0; cursor: pointer; color: var(--ink); }

    .wish-heart svg {
      width: 20px; height: 20px;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.3;
      stroke-linecap: round;
      stroke-linejoin: round;
      display: block;
      transition: fill .25s ease;
    }

    .wish-heart.on svg { fill: var(--ink); }

    .pdp-info h1 { font-size: clamp(24px, 2vw, 30px); margin: 0 0 8px; }

    .pdp-info .pdp-price { font-size: 14px; margin-bottom: 42px; }

    .size-select {
      border-top: 1px solid var(--hairline);
      border-bottom: 1px solid var(--hairline);
      padding: 18px 0;
    }

    .size-select summary {
      cursor: pointer;
      list-style: none;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-size: 13.5px;
      letter-spacing: .04em;
    }

    .size-select summary::-webkit-details-marker { display: none; }

    .size-select summary svg {
      width: 15px; height: 15px;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.4;
      transition: transform .35s ease;
    }

    .size-select[open] summary svg { transform: rotate(180deg); }

    .size-select .size-pills { margin: 20px 0 6px; }

    .pdp-info .size-error { display: block; margin: 10px 0 0; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; }

    .cta-round { border-radius: 999px; }

    .pdp-info .pdp-cta { margin-top: 30px; margin-bottom: 0; }

    .advisor-link {
      display: block;
      width: fit-content;
      margin: 24px auto 48px;
      background: none;
      border: 0;
      padding: 0 0 3px;
      font: inherit;
      font-size: 12.5px;
      letter-spacing: .06em;
      border-bottom: 1px solid var(--ink);
      cursor: pointer;
      transition: opacity .3s ease;
    }

    .advisor-link:hover { opacity: .6; }

    .pdp-info .pdp-desc { margin-bottom: 46px; }

    /* ---------- card wishlist heart ---------- */

    .card-heart {
      position: absolute;
      top: 14px; right: 14px;
      z-index: 2;
      background: none;
      border: 0;
      padding: 0;
      cursor: pointer;
      color: var(--ink);
      opacity: .82;
      transition: opacity .25s ease;
    }

    .card-heart:hover { opacity: 1; }

    .card-heart svg {
      width: 17px; height: 17px;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.3;
      stroke-linecap: round;
      stroke-linejoin: round;
      display: block;
      transition: fill .25s ease;
    }

    .card-heart.on svg { fill: var(--ink); }


    /* ---------- auth pages ---------- */

    .social-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      width: 100%;
      padding: 15px 0;
      border-radius: 999px;
      background: #fff;
      border: 1px solid #d8d4ce;
      font: inherit;
      font-size: 13px;
      letter-spacing: .04em;
      cursor: pointer;
      margin-bottom: 14px;
      transition: border-color .25s ease;
    }

    .social-btn:hover { border-color: var(--ink); }

    .social-btn svg { width: 18px; height: 18px; flex: none; }

    .acct-bottom {
      margin-top: 46px;
      padding-top: 34px;
      border-top: 1px solid var(--hairline);
    }

    .auth-note { margin-top: 40px; font-size: 13px; color: var(--stone); }

    .auth-note a { border-bottom: 1px solid var(--hairline); padding-bottom: 2px; color: var(--ink); }

    .forgot-link {
      display: inline-block;
      margin: -10px 0 28px;
      font-size: 12.5px;
      color: var(--stone);
      border-bottom: 1px solid var(--hairline);
      padding-bottom: 2px;
      transition: color .25s ease;
    }

    .forgot-link:hover { color: var(--ink); }

    /* ---------- search ---------- */

    .searchpanel {
      position: fixed;
      inset: 0;
      z-index: 150;
      background: var(--paper);
      opacity: 0;
      visibility: hidden;
      transform: translateY(-14px);
      transition: opacity .4s ease, transform .55s cubic-bezier(.22, 1, .36, 1), visibility .55s;
      overflow-y: auto;
    }

    body.search-open .searchpanel { opacity: 1; visibility: visible; transform: translateY(0); }

    body.search-open { overflow: hidden; }

    .search-top {
      display: grid;
      grid-template-columns: 1fr auto 1fr;
      align-items: center;
      padding: 18px 48px;
    }

    .search-top .search-close { justify-self: end; }

    .searchpanel-inner { padding: 26px 24px 0; }

    .search-pill {
      display: flex;
      align-items: center;
      gap: 14px;
      max-width: 940px;
      margin: 0 auto;
      border: 1px solid #d8d4ce;
      border-radius: 999px;
      padding: 15px 26px;
      transition: border-color .25s ease;
    }

    .search-pill:focus-within { border-color: var(--ink); }

    .search-pill svg {
      width: 17px; height: 17px;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.3;
      stroke-linecap: round;
      flex: none;
      color: var(--stone);
    }

    .search-pill input {
      flex: 1;
      border: 0;
      outline: 0;
      background: none;
      font: inherit;
      font-size: 15px;
      letter-spacing: .02em;
      color: var(--ink);
    }

    .search-pill input::placeholder { color: var(--stone); }

    .search-trending {
      display: flex;
      align-items: center;
      justify-content: center;
      flex-wrap: wrap;
      gap: 26px;
      margin-top: 24px;
    }

    .trend-label {
      font-size: 10.5px;
      letter-spacing: .3em;
      text-transform: uppercase;
      color: var(--stone);
    }

    .trend {
      background: none;
      border: 0;
      padding: 0 0 2px;
      font: inherit;
      font-size: 13.5px;
      letter-spacing: .03em;
      cursor: pointer;
      border-bottom: 1px solid transparent;
      transition: border-color .25s ease;
    }

    .trend:hover { border-bottom-color: var(--ink); }

    .search-section {
      max-width: 1240px;
      margin: 62px auto 24px;
      font-size: 11px;
      letter-spacing: .3em;
      text-transform: uppercase;
      color: var(--stone);
    }

    .search-grid {
      max-width: 1240px;
      margin: 0 auto;
      padding-bottom: 90px;
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 48px 18px;
      text-align: center;
    }

    .search-empty {
      grid-column: 1 / -1;
      font-size: 14.5px;
      color: var(--stone);
      text-align: left;
    }

    @media (max-width: 1100px) {
      .search-grid { grid-template-columns: repeat(2, 1fr); }
    }

    /* mobile: no wishlist heart in the header */
    @media (max-width: 640px) {
      .h-right a[href="/wishlist"] { display: none; }
    }

    /* phones: film inset, tall frame, clean cover crop */
    @media (max-width: 640px) {
      .experience { background: transparent; padding: 4px 0 44px; }
      .editorial .editorial-copy { order: 1; }
      .editorial .editorial-media { order: 2; }
      .editorial-media { min-height: 84vw; }
      .editorial-media img { object-position: center top; }
      .film { width: 100%; height: auto; margin: 0; }
      .film video {
        position: static;
        width: 100%; height: auto; min-height: 0;
        aspect-ratio: 1920 / 1012;
        object-fit: contain;
        background: transparent;
      }
    }
    /* never show the iOS overlay play glyph */
    video::-webkit-media-controls-start-playback-button {
      display: none !important;
      -webkit-appearance: none;
    }