/* TipTop Fashion – base and typography
   Scale: 11 / 14 / 17 / 22 / 32 / 48 / 72 / 120 / 200. One leading rule per size. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font-text);font-size:17px;line-height:1.5;font-variation-settings:"wdth" 100;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--bordeaux);outline-offset:4px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* display: Bodoni Moda at the font's default optical size (explicit opsz values ghost in Chromium) */
.display{font-family:var(--font-display);font-weight:400;font-optical-sizing:none;font-variation-settings:normal;text-wrap:balance;margin:0}
.display em{font-style:italic;font-weight:400;color:var(--bordeaux)}
.dark .display em{color:#d9a3ad}
.d-xxl{font-size:clamp(56px,13.5vw,200px);line-height:.9;letter-spacing:-.035em}
.d-xl{font-size:clamp(56px,8.4vw,120px);line-height:.92;letter-spacing:-.03em}
.d-l{font-size:clamp(32px,5vw,72px);line-height:1;letter-spacing:-.02em}
.d-m{font-size:clamp(28px,4.2vw,60px);line-height:1.04;letter-spacing:-.02em}
.d-s{font-size:clamp(26px,2.3vw,32px);line-height:1.1;letter-spacing:-.01em}
.lead{font-size:clamp(18px,1.55vw,22px);line-height:1.4;max-width:34ch;letter-spacing:-.005em;margin:0;text-wrap:pretty}
.body{font-size:17px;line-height:1.55;max-width:60ch;margin:0;text-wrap:pretty}
.small{font-size:14px;line-height:1.5}
.micro{font-size:12px;line-height:1.4;letter-spacing:.1em;text-transform:uppercase;font-variation-settings:"wdth" 112;font-weight:500;margin:0}
.muted{color:var(--fg-2)}
.num{font-variant-numeric:tabular-nums}

/* links: underline draws in from the left */
.ul{position:relative;display:inline-block;padding-bottom:3px}
.ul::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform var(--t-hover) var(--ease-hover)}
.ul:hover::after,.ul:focus-visible::after,.ul.is-on::after{transform:scaleX(1);transform-origin:left}
.ul.always::after{transform:scaleX(1);transform-origin:left}
.ul.always:hover::after{transform:scaleX(0);transform-origin:right}
a.ul:hover,button.ul:hover{color:var(--bordeaux)}
.dark a.ul:hover{color:#d9a3ad}

/* layout */
.wrap{padding-left:var(--margin);padding-right:var(--margin)}
.grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--gutter)}
@media (max-width:900px){.grid{grid-template-columns:repeat(6,1fr)}}
.spread{padding-top:var(--s8);padding-bottom:var(--s8)}
.spread.tight{padding-top:var(--s7);padding-bottom:var(--s7)}
.spread.loose{padding-top:var(--s9);padding-bottom:var(--s9)}
.dark{background:var(--bg);color:var(--fg)}

/* photographs: one grade for every campaign so ten houses read as one */
.ph{position:relative;overflow:hidden;background:#d8d6d0;margin:0}
.dark .ph{background:#232321}
.ph img{width:100%;height:100%;object-fit:cover;filter:saturate(.84) sepia(.06)}
.ph.st img{filter:saturate(.6) sepia(.14) contrast(.96)}
figcaption.micro{color:var(--fg-2)}
/* lifted warm blacks: one grade for every photograph */
.ph::before,.dep a::before,.cover .ph::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:#2a211b;mix-blend-mode:screen;opacity:.62}
.ph>*:not(img):not(picture){position:relative;z-index:2}
.ph picture{display:contents}
.ph.r45{aspect-ratio:4/5}.ph.r32{aspect-ratio:3/2}.ph.r11{aspect-ratio:1/1}.ph.r23{aspect-ratio:2/3}.ph.r169{aspect-ratio:16/9}.ph.r54{aspect-ratio:5/4}

/* reveal on first view: clip on the image, observer on the frame */
.rv img{clip-path:inset(100% 0 0 0);transform:scale(1.04);transition:clip-path 480ms cubic-bezier(.2,.7,.2,1),transform 480ms cubic-bezier(.2,.7,.2,1)}
.rv.in img{clip-path:inset(0 0 0 0);transform:scale(1)}
.fd{opacity:0;transform:translateY(14px);transition:opacity 500ms var(--ease-hover),transform 700ms var(--ease-enter)}
.fd.in{opacity:1;transform:none}
.fd[data-delay="1"]{transition-delay:90ms}.fd[data-delay="2"]{transition-delay:180ms}
@media (prefers-reduced-motion:reduce){
  .rv img{clip-path:none;transform:none;opacity:0;transition:opacity 200ms linear}.rv.in img{opacity:1}
  .fd{transform:none;transition:opacity 200ms linear}
  .ul::after{transition:none}
}
/* hover image lift */
.lift img{transition:transform 900ms var(--ease-hover),filter var(--t-hover) var(--ease-hover)}
.lift:hover img{transform:scale(1.03);filter:saturate(.84) sepia(.06) brightness(.94)}
.ph.st.lift:hover img{filter:saturate(.6) sepia(.14) contrast(.96) brightness(.94)}
@media (prefers-reduced-motion:reduce){.lift:hover img{transform:none}}

.only-m{display:none}
@media (max-width:900px){.hide-m{display:none!important}.only-m{display:inline}}
.ul.tap{padding-top:10px;padding-bottom:10px}.ul.tap::after{bottom:7px}