:root {
  --ink: #0a0a0a;
  --paper: #efede8;
  --soft: #d8d4cc;
  --rouge: #b54a6f;
  --rouge-bright: #e5a8bd;
  --rouge-dark: #35131f;
  --rouge-ink: #8d3452;
  --muted: #74716b;
  --line: rgba(10, 10, 10, 0.2);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 78px; overflow-x: clip; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
::selection { background: var(--rouge); color: #fff; }
a { color: inherit; }
img { display: block; width: 100%; height: auto; }

.site-header {
  position: fixed; z-index: 50; inset: 0 0 auto; min-height: 72px;
  display: flex; align-items: center; gap: 30px; padding: 18px clamp(20px, 4vw, 64px);
  border-bottom: 1px solid rgba(255,255,255,.16); background: transparent; color: #fff;
  transition: padding 420ms cubic-bezier(.22,1,.36,1), background-color 420ms cubic-bezier(.22,1,.36,1), box-shadow 420ms cubic-bezier(.22,1,.36,1), backdrop-filter 420ms cubic-bezier(.22,1,.36,1);
}
.brand, .footer-brand { width: clamp(90px, 9vw, 128px); flex: 0 0 auto; }
.site-header .brand { transition: width 420ms cubic-bezier(.22,1,.36,1); }
.site-header nav { display: flex; align-items: center; gap: clamp(16px, 2.2vw, 36px); margin-left: auto; }
.site-header nav a { color: rgba(255,255,255,.62); font-size: 9px; font-weight: 700; letter-spacing: .18em; text-decoration: none; text-transform: uppercase; }
.site-header nav a:hover, .site-header nav a:focus-visible, .site-header nav .nav-title { color: #fff; }
.signature-badge { margin-left: 10px; padding: 8px 11px; border: 1px solid rgba(229,168,189,.84); border-radius: 999px; background: rgba(181,74,111,.2); color: var(--rouge-bright); font-size: 8px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.site-header.is-scrolled { padding-top: 13px; padding-bottom: 13px; background: rgba(8,8,8,.96); box-shadow: 0 1px 0 rgba(255,255,255,.12); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.site-header.is-scrolled .brand { width: clamp(78px,7vw,104px); }
.motion-progress { position: fixed; z-index: 100; inset: 0 0 auto; height: 2px; background: var(--rouge); pointer-events: none; transform: scaleX(0); transform-origin: left center; will-change: transform; }

.hero { min-height: 100svh; display: grid; grid-template-columns: .9fr 1.1fr; background: var(--ink); color: #fff; }
.hero-copy { position: relative; min-height: 100svh; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; overflow: hidden; padding: 138px clamp(28px, 6vw, 100px) 72px; background: radial-gradient(circle at 14% 88%, rgba(181,74,111,.68), transparent 39%), linear-gradient(145deg,#080808 30%,#30131e); }
.hero-copy::after { position: absolute; right: -5vw; bottom: -10vw; content: "R"; color: rgba(255,255,255,.025); font-size: 42vw; font-weight: 800; line-height: .72; }
.eyebrow { position: relative; margin: 0 0 32px; color: rgba(255,255,255,.48); font-size: 9px; font-weight: 700; letter-spacing: .27em; text-transform: uppercase; }
.eyebrow--dark { color: var(--rouge-ink); }
.hero h1 { position: relative; margin: 0; font-size: clamp(55px,7vw,136px); font-weight: 700; letter-spacing: -.075em; line-height: .82; text-transform: uppercase; }
.location { position: relative; margin: 30px 0 0; color: rgba(255,255,255,.52); font-size: 9px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.hero-line { position: relative; max-width: 500px; margin: 68px 0 0; font-size: clamp(23px,1.9vw,33px); font-weight: 300; letter-spacing: -.03em; line-height: 1.28; }
.text-link { position: relative; display: flex; width: 100%; max-width: 460px; justify-content: space-between; margin-top: 42px; padding-top: 15px; border-top: 1px solid var(--rouge-bright); font-size: 9px; font-weight: 700; letter-spacing: .18em; text-decoration: none; text-transform: uppercase; }
.text-link:hover, .text-link:focus-visible { color: var(--rouge-bright); }
.hero-meta { position: absolute; right: clamp(28px,6vw,100px); bottom: 30px; left: clamp(28px,6vw,100px); display: flex; justify-content: space-between; color: rgba(255,255,255,.35); font-size: 8px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.hero-meta span:last-child { color: var(--rouge-bright); }

.slot { position: relative; overflow: hidden; min-height: 520px; margin: 0; background: #c6c2ba; isolation: isolate; }
.slot figcaption, .campaign-card figcaption, .archive-card figcaption { display: flex; justify-content: space-between; gap: 20px; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 9px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.slot--filled > img, .slot--filled > video { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.slot--hero { min-height: 100svh; background: var(--rouge-dark); }
.slot--hero figcaption, .slot--signature figcaption, .slot--headshot figcaption { position: absolute; z-index: 2; right: 30px; bottom: 0; left: 30px; color: #fff; border-color: rgba(255,255,255,.28); }

@media (min-width: 821px) {
  html.motion-active .hero { min-height: 142svh; align-items: start; }
  html.motion-active .hero-copy, html.motion-active .hero-media { position: sticky; top: 0; }
  html.motion-active .hero-media { height: 100svh; min-height: 100svh; }
  html.motion-active .hero-copy { transform: translate3d(0,var(--copy-shift,0),0); will-change: transform; }
  html.motion-active .hero-media img { object-position: center 18%; transform: translate3d(0,var(--hero-shift,0),0) scale(var(--hero-scale,1.08)); transform-origin: center top; will-change: transform; }
}

.section-pad { padding: clamp(100px,13vw,210px) clamp(24px,8vw,130px); }
.story { display: grid; grid-template-columns: .8fr 1fr; gap: 7vw; align-items: start; }
.story-content { display: flex; flex-direction: column; gap: clamp(64px,8vw,120px); }
.story-heading h2, .profile h2, .intro-copy h2, .section-heading h2, .signature h2, .archive h2 { margin: 0; font-size: clamp(50px,7vw,112px); font-weight: 600; letter-spacing: -.062em; line-height: .91; }
.story-copy p { margin: 0; font-size: clamp(18px,1.45vw,24px); letter-spacing: -.02em; line-height: 1.52; }
.story-copy p + p { margin-top: 1.5em; color: var(--muted); }
.slot--portrait { width: min(100%,620px); min-height: auto; aspect-ratio: 9/16; justify-self: end; align-self: start; }

.profile { display: grid; grid-template-columns: .78fr 1.22fr; gap: 8vw; background: radial-gradient(circle at 8% 92%, rgba(181,74,111,.24), transparent 33%), var(--ink); color: #fff; }
.profile-heading { position: sticky; top: 110px; align-self: start; }
.profile-heading > p:last-child { max-width: 360px; margin: 38px 0 0; color: rgba(255,255,255,.46); font-size: 14px; line-height: 1.55; }
.profile-list { margin: 0; }
.profile-list div { display: grid; grid-template-columns: minmax(100px,.35fr) 1fr; gap: 28px; align-items: baseline; min-height: 94px; padding: 24px 0; border-top: 1px solid rgba(255,255,255,.2); }
.profile-list div:last-child { border-bottom: 1px solid rgba(255,255,255,.2); }
.profile-list dt { color: rgba(255,255,255,.42); font-size: 9px; font-weight: 700; letter-spacing: .19em; text-transform: uppercase; }
.profile-list dd { margin: 0; font-size: clamp(20px,1.9vw,31px); letter-spacing: -.03em; }
.profile-list div:last-child { border-top-color: rgba(229,168,189,.68); border-bottom-color: rgba(229,168,189,.68); }
.profile-list div:last-child dt, .profile-list div:last-child dd { color: var(--rouge-bright); }

.introduction { display: grid; grid-template-columns: .82fr 1.18fr; gap: 9vw; align-items: start; background: var(--soft); }
.intro-copy > p:not(.eyebrow) { max-width: 480px; margin: 46px 0 0; color: #5f5b54; font-size: clamp(18px,1.4vw,23px); line-height: 1.5; }
.tags { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 46px; }
.tags span { padding: 9px 13px; border: 1px solid rgba(141,52,82,.48); border-radius: 999px; color: var(--rouge-ink); font-size: 8px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.tags span:first-child { background: var(--rouge); border-color: var(--rouge); color: #fff; }
.slot--headshot { justify-self: end; width: min(100%,500px); min-height: auto; aspect-ratio: 9/16; background: var(--rouge-dark); color: #fff; }
.slot--headshot > img { object-position: center 15%; }
.slot--headshot > video { object-position: center center; }

.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 50px; margin-bottom: clamp(70px,10vw,150px); padding-top: 24px; border-top: 1px solid rgba(141,52,82,.5); }
.section-heading > p { max-width: 370px; margin: 0 0 8px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.campaign-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: clamp(80px,11vw,175px) clamp(20px,4vw,65px); }
.campaign-card { width: 82%; margin: 0; }
.campaign-card--wide { width: 100%; }
.campaign-card--offset { justify-self: end; margin-top: clamp(60px,9vw,140px); }
.campaign-card--full { grid-column: 1 / -1; width: 100%; }
.campaign-card .slot { min-height: auto; aspect-ratio: 2/3; }
.campaign-card--wide .slot { aspect-ratio: 4/5; }
.campaign-card .slot--landscape { aspect-ratio: 16/9; background: var(--rouge-dark); }
.campaign-card figcaption span:first-child { color: var(--rouge-ink); }

.signature { min-height: 92svh; display: grid; grid-template-columns: 1fr 1fr; background: radial-gradient(circle at 20% 78%, rgba(229,168,189,.22), transparent 32%), linear-gradient(135deg,#180b10,#b54a6f 55%,#35131f); color: #fff; }
.signature-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(90px,10vw,170px) clamp(28px,7vw,110px); }
.signature-copy > p:not(.eyebrow) { max-width: 550px; margin: 48px 0 0; color: rgba(255,255,255,.68); font-size: clamp(18px,1.5vw,24px); line-height: 1.5; }
.slot--signature { min-height: 92svh; background: var(--rouge-dark); color: #fff; }
.slot--signature > img { object-position: center 20%; }

.archive { overflow: hidden; padding: clamp(105px,12vw,190px) 0 clamp(100px,12vw,180px); background: #111; color: #fff; }
.archive-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 50px; padding: 0 clamp(24px,8vw,130px) clamp(62px,8vw,110px); }
.archive-heading > p { max-width: 360px; margin: 0 0 8px; color: rgba(255,255,255,.48); font-size: 14px; line-height: 1.55; }
.archive .eyebrow { color: var(--rouge-bright); }
.carousel-shell { position: relative; }
.carousel { width: 100%; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; scroll-snap-type: x mandatory; touch-action: pan-y pinch-zoom; cursor: grab; }
.carousel::-webkit-scrollbar { display: none; }
.carousel.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.carousel:focus-visible { outline: 1px solid rgba(255,255,255,.8); outline-offset: -1px; }
.carousel-track { display: flex; width: max-content; gap: clamp(14px,1.7vw,26px); padding: 0 clamp(24px,4vw,64px); }
.carousel-set { display: flex; gap: clamp(14px,1.7vw,26px); }
.archive-card { flex: 0 0 clamp(290px,29vw,450px); margin: 0; scroll-snap-align: center; }
.archive-card .slot { min-height: auto; aspect-ratio: 9/16; background: var(--rouge-dark); }
.archive-card figcaption { color: rgba(255,255,255,.6); border-color: rgba(229,168,189,.36); }
.archive-card figcaption span:first-child { color: var(--rouge-bright); }
.carousel-arrow { position: absolute; z-index: 3; top: 44%; width: clamp(52px,4.8vw,72px); height: clamp(52px,4.8vw,72px); display: grid; place-items: center; border: 1px solid rgba(229,168,189,.8); border-radius: 50%; background: rgba(53,19,31,.82); color: #fff; font: inherit; font-size: 22px; cursor: pointer; backdrop-filter: blur(12px); }
.carousel-arrow:hover, .carousel-arrow:focus-visible { background: var(--rouge-bright); color: #111; }
.carousel-arrow--prev { left: clamp(12px,2vw,34px); }
.carousel-arrow--next { right: clamp(12px,2vw,34px); }

.closing { padding: clamp(110px,14vw,210px) clamp(24px,8vw,130px); background: var(--paper); }
.closing p { margin: 0; font-size: clamp(47px,7vw,116px); font-weight: 600; letter-spacing: -.065em; line-height: .9; }
.closing p:nth-child(2) { color: var(--rouge); }
.closing > span { display: block; margin-top: 55px; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
.closing-links { display: flex; gap: 34px; margin-top: 40px; }
.closing-links a { padding-bottom: 8px; border-bottom: 1px solid var(--rouge); color: var(--rouge-ink); font-size: 9px; font-weight: 700; letter-spacing: .18em; text-decoration: none; text-transform: uppercase; }
.closing-links a:hover, .closing-links a:focus-visible { color: var(--ink); }

.site-footer { display: grid; grid-template-columns: auto 1fr auto auto; gap: 40px; align-items: start; padding: 54px clamp(24px,4vw,64px); background: #090909; color: #fff; }
.site-footer > p, .site-footer > a:not(.footer-brand) { margin: 0; color: rgba(255,255,255,.62); font-size: 9px; font-weight: 700; letter-spacing: .15em; text-decoration: none; text-transform: uppercase; }

html.motion-active .hero-copy > * { opacity: 0; transform: translate3d(0,28px,0); transition: opacity 900ms cubic-bezier(.22,1,.36,1), transform 1100ms cubic-bezier(.22,1,.36,1); }
html.motion-active.motion-start .hero-copy > * { opacity: 1; transform: translate3d(0,0,0); }
html.motion-active.motion-start .hero-copy > :nth-child(1) { transition-delay: 80ms; }
html.motion-active.motion-start .hero-copy > :nth-child(2) { transition-delay: 160ms; }
html.motion-active.motion-start .hero-copy > :nth-child(3) { transition-delay: 250ms; }
html.motion-active.motion-start .hero-copy > :nth-child(4) { transition-delay: 340ms; }
html.motion-active.motion-start .hero-copy > :nth-child(5) { transition-delay: 430ms; }
html.motion-active [data-reveal] { opacity: 0; transform: translate3d(0,64px,0); transition: opacity 900ms cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms), transform 1100ms cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms); will-change: opacity,transform; }
html.motion-active [data-reveal].is-visible { opacity: 1; transform: translate3d(0,0,0); }
html.motion-active .slot--filled[data-reveal], html.motion-active .campaign-card[data-reveal] .slot--filled { overflow: hidden; }
html.motion-active .slot--filled[data-reveal] > img, html.motion-active .campaign-card[data-reveal] .slot--filled > img { transform: scale(1.075); transition: transform 1500ms cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms); will-change: transform; }
html.motion-active .slot--filled[data-reveal].is-visible > img, html.motion-active .campaign-card[data-reveal].is-visible .slot--filled > img { transform: scale(1); }

@media (max-width: 920px) {
  .site-header { gap: 18px; padding-inline: 20px; }
  .site-header nav { gap: 17px; overflow-x: auto; }
  .site-header nav a:not(.nav-title) { display: none; }
  .signature-badge { margin-left: 0; }
  .hero { grid-template-columns: 1fr; }
  .hero-copy { min-height: auto; order: 2; padding-top: 92px; padding-bottom: 98px; }
  .slot--hero { min-height: 76svh; aspect-ratio: auto; order: 1; }
  .story, .profile, .introduction, .signature { grid-template-columns: 1fr; }
  .story-content { gap: 48px; }
  .story-copy { margin-top: 30px; }
  .slot--portrait { width: min(100%,520px); margin: 60px auto 0; }
  .profile-heading { position: static; margin-bottom: 50px; }
  .slot--headshot { justify-self: center; margin-top: 46px; }
  .section-heading, .archive-heading { align-items: flex-start; flex-direction: column; }
  .campaign-grid { gap-block: 75px; }
  .campaign-card, .campaign-card--wide { width: 100%; }
  .campaign-card--offset { margin-top: 0; }
  .slot--signature { min-height: auto; aspect-ratio: 9/16; }
  .site-footer { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 600px) {
  .hero-copy { padding: 126px 24px 68px; }
  .hero-meta { right: 24px; left: 24px; }
  .campaign-grid { grid-template-columns: 1fr; }
  .campaign-card--full { grid-column: auto; }
  .campaign-card .slot, .campaign-card--wide .slot { aspect-ratio: 9/16; }
  .campaign-card .slot--landscape { min-height: 0; aspect-ratio: 16/9; }
  .slot { min-height: 440px; }
  .profile-list div { grid-template-columns: 100px 1fr; gap: 18px; }
  .archive-card { flex-basis: 78vw; }
  .carousel-track, .carousel-set { gap: 14px; }
  .carousel-track { padding-right: 24px; padding-left: 24px; }
  .carousel-arrow { top: 42%; }
  .closing-links { flex-direction: column; align-items: flex-start; gap: 22px; }
  .site-footer { gap: 26px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [data-reveal] { opacity: 1; transform: none; transition: none; }
  .motion-progress { display: none; }
}
