@charset "UTF-8";
@font-face {
  font-family: 'Bodoni Moda';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/bodoni-moda-italic.ttf) format('truetype');
}
@font-face {
  font-family: 'Bodoni Moda';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/bodoni-moda-regular.ttf) format('truetype');
}

:root {
  /* Palette « Pellicule » — aucune teinte verte */
  --paper:  #f9f6f1;   /* ivoire chaud */
  --ink:    #1d1914;   /* sépia-noir */
  --muted:  #80766e;   /* pierre chaude */
  --line:   #dcd6cd;   /* sable */
  --accent: #c09a58;   /* or champagne */
  --night:  #130f0c;   /* noir abyssal chaud */
  --gutter: clamp(22px, 4.3vw, 88px);
  --serif:  "Bodoni Moda", "Bodoni MT", "Didot", "Times New Roman", serif;
  --sans:   "Helvetica Neue", Helvetica, Arial, sans-serif;
  --ease:   cubic-bezier(.22, 1, .36, 1);
  color-scheme: light;
  font-family: var(--sans);
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
  scrollbar-color: var(--accent) var(--paper);
  scrollbar-width: thin;
  scroll-behavior: smooth;
  scroll-padding-top: 100px;
}
* { box-sizing: border-box; }
body { margin: 0; font-size: 16px; line-height: 1.55; }
body.is-locked { overflow: hidden; }
::selection { color: var(--paper); background: var(--accent); }
::-webkit-scrollbar { width: 8px; height: 6px; }
::-webkit-scrollbar-track { background: var(--paper); }
::-webkit-scrollbar-thumb { background: var(--accent); border: 2px solid var(--paper); border-radius: 10px; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; color: inherit; cursor: pointer; }
button, input, a { touch-action: manipulation; }
a { color: inherit; text-decoration: none; }
button { border-radius: 0; }
button:focus-visible, a:focus-visible { outline: 2px solid var(--accent); outline-offset: 6px; }
button:disabled { cursor: default; }
button svg { pointer-events: none; }
img { display: block; max-width: 100%; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3, h4, h5, h6, .wordmark, .hero-title { cursor: default; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 12px; left: 20px; z-index: 100; padding: 12px 18px; background: var(--ink); color: white; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }

/* Intro supprimée — animation directement dans la page */

/* --- Header --- */
.site-header { padding: 0 var(--gutter); min-height: 100px; display: flex; align-items: center; justify-content: space-between; gap: 24px; position: fixed; top: 0; left: 0; right: 0; z-index: 50; transition: background .4s ease, box-shadow .4s ease; }
body.is-scrolled .site-header { pointer-events: none; }
body.is-scrolled .site-header > * { pointer-events: auto; }
body.is-scrolled:not(.is-past-collection) .wordmark { opacity: 0; pointer-events: none; visibility: hidden; transform: translateY(-10px); }
.wordmark { font-size: 22px; font-weight: 400; letter-spacing: -.035em; line-height: 1.2; transition: opacity .4s ease, visibility .4s ease, transform .4s ease; transform: translateY(0); }
.wordmark span { color: var(--accent); }
.header-nav { display: flex; align-items: center; gap: 36px; }
.header-nav-link { font-size: 13px; color: var(--muted); letter-spacing: .04em; transition: color .2s ease; }
.header-nav-link:hover { color: var(--ink); }
.header-link { display: flex; align-items: center; gap: 28px; min-height: 44px; font-size: 13px; }
.header-link span { font-size: 23px; transition: transform .3s var(--ease); }
.header-link:hover span { transform: translate(3px, 3px); }

.eyebrow { font-size: 12px; font-weight: 400; letter-spacing: .14em; text-transform: uppercase; }


/* --- Hero --- */
.hero {
  position: relative;
  min-height: 100dvh;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
/* Grain pellicule — texture analogique subtile */
.hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.68' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity: .055;
  pointer-events: none;
  z-index: 3;
  mix-blend-mode: screen;
}
.hero-bg { position: absolute; inset: 0; overflow: hidden; }
.hero-bg-inner {
  position: absolute;
  inset: -5%; /* marge pour le Ken Burns */
  background:
    radial-gradient(ellipse 100% 70% at 90% 105%, rgba(192,154,88,.24) 0%, transparent 52%),
    radial-gradient(ellipse 55%  40% at  5%   0%, rgba(192,154,88,.06) 0%, transparent 50%),
    linear-gradient(158deg, #231e1a 0%, #160f0c 100%);
  animation: hero-settle 3.5s var(--ease) both;
}
@keyframes hero-settle {
  from { transform: scale(1.05); }
  to   { transform: scale(1); }
}
.hero-content { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: space-between; padding: 0 var(--gutter) clamp(40px, 6vw, 60px); flex: 1; margin-top: 15vh; color: var(--paper); }

.hero-main {
  margin-bottom: auto; /* Pousse le footer vers le bas */
}

/* Eyebrow avec ligne décorative animée */
.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  color: rgba(249,246,241,.32);
  margin-bottom: clamp(24px, 3.2vw, 44px);
  overflow: hidden;
}
.hero-eyebrow::before {
  content: '';
  flex-shrink: 0;
  display: block;
  width: 38px;
  height: 1px;
  background: rgba(192,154,88,.6);
  transform-origin: left;
  animation: eyebrow-line 1s var(--ease) 280ms both;
}
@keyframes eyebrow-line {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
.hero-eyebrow-text {
  animation: eyebrow-fade 0.8s ease 480ms both;
}
@keyframes eyebrow-fade {
  from { opacity: 0; transform: translateX(-8px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* Titre principal élégant et intemporel */
.hero-title {
  font-family: var(--serif);
  font-size: clamp(45px, 9vw, 120px);
  font-weight: 400;
  line-height: .92; /* Très serré verticalement */
  letter-spacing: -.03em;
  color: var(--paper);
  margin-bottom: 20px;
  animation: hero-title-in 1.2s var(--ease) 450ms both;
}
@keyframes hero-title-in {
  from { opacity: 0; transform: translateY(20px); filter: blur(4px); }
  to   { opacity: 1; transform: translateY(0); filter: blur(0); }
}

/* Hero Footer (info + scroll) */
.hero-footer {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 40px;
  flex-wrap: wrap-reverse;
}

.hero-info {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(249,246,241,.4);
  animation: header-enter .9s ease 800ms both;
}
.hero-info .dot { font-size: 14px; line-height: 1; color: var(--accent); }

.hero-scroll { animation: header-enter .9s ease 950ms both; }
.hero-scroll-link { display: inline-flex; align-items: center; gap: 20px; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: rgba(244,243,239,.5); text-decoration: none; min-height: 44px; transition: color .3s ease; }
.hero-scroll-link:hover { color: var(--paper); }
.hero-scroll-line { display: block; width: 50px; height: 1px; background: rgba(244,243,239,.35); position: relative; overflow: hidden; }
.hero-scroll-line::after { content: ''; position: absolute; inset: 0; background: rgba(244,243,239,.9); transform: translateX(-100%); animation: scroll-line 2s var(--ease) 1.4s both; }
@keyframes scroll-line { to { transform: translateX(0); } }

.collection { padding: 0 var(--gutter); }
.collection-bar { min-height: 100px; display: flex; justify-content: flex-start; gap: 24px; align-items: center; margin: 0 calc(-1 * var(--gutter)) 28px; padding: 0 var(--gutter); position: sticky; top: 0; z-index: 60; background: rgba(245,242,236,.93); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: 0 1px 0 var(--line); pointer-events: none; transition: background .4s ease; }
.collection-bar > * { pointer-events: auto; }
.collection-bar h2 { font-size: 12px; margin: 0; }
.filters { display: flex; align-items: stretch; gap: 26px; min-width: 0; max-width: 70%; overflow-x: auto; scrollbar-width: none; padding-inline: 3px; transition: transform .4s ease; transform: translateY(0); }
body.is-scrolled .filters { transform: translateY(-2px); }
.filters::-webkit-scrollbar { display: none; }
.filter { position: relative; flex-shrink: 0; display: inline-flex; align-items: center; gap: 5px; background: none; border: 0; padding: 15px 0; font-size: 14px; white-space: nowrap; color: var(--muted); transition: color .2s ease; }
.filter::after { content: ""; position: absolute; bottom: 8px; left: 0; right: 0; height: 1.5px; background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease); }
.filter.is-active { color: var(--ink); }
.filter.is-active::after, .filter:hover::after { transform: scaleX(1); }
.filter sup { align-self: flex-start; font-size: 11px; color: var(--muted); margin-top: -2px; opacity: .7; }
.filter.is-active sup { color: var(--accent); opacity: 1; }
.photo-count { text-align: left; font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; margin-left: auto; transition: margin .4s ease, opacity .4s ease, transform .4s ease; transform: translateY(0); white-space: nowrap; }
body.is-scrolled .photo-count { opacity: 0; pointer-events: none; transform: translateY(-2px); position: absolute; right: var(--gutter); }
.gallery { transition: opacity .2s ease; }
.gallery.is-changing { opacity: 0; }
.editorial-pair { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 0 24px; align-items: start; margin-bottom: clamp(80px, 9vw, 155px); }
.photo-card { margin: 0; min-width: 0; position: relative; }
.editorial-pair .photo-card:first-child { grid-column: 1 / span 7; }
.editorial-pair .photo-card:nth-child(2) { grid-column: 9 / span 4; margin-top: 150px; }
.editorial-pair:nth-child(2n) .photo-card:first-child { grid-column: 2 / span 4; margin-top: 35px; }
.editorial-pair:nth-child(2n) .photo-card:nth-child(2) { grid-column: 7 / span 6; margin-top: 0; }
.editorial-pair:nth-child(3n) .photo-card:first-child { grid-column: 1 / span 6; }
.editorial-pair:nth-child(3n) .photo-card:nth-child(2) { grid-column: 9 / span 4; margin-top: 100px; }
.editorial-pair.is-solo .photo-card:first-child { grid-column: 3 / span 8; margin-top: 0; }
/* Photo card — hover éditorial */
.photo-button {
  width: 100%; display: block; position: relative;
  border: none; padding: 0; overflow: hidden;
  background: #d8dbd0;
  text-align: left;
  transition: transform .7s var(--ease);
  -webkit-user-select: none; user-select: none;
}
.photo-button::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 55%, rgba(24,28,23,.55) 100%);
  opacity: 0;
  transition: opacity .5s ease;
  z-index: 1;
  pointer-events: none;
}
.photo-button:hover::after, .photo-button:focus-visible::after { opacity: 1; }

.photo-view {
  position: absolute; right: 18px; bottom: 18px;
  width: 46px; height: 46px;
  display: grid; place-items: center;
  color: var(--paper);
  background: rgba(24,28,23,.55);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 50%;
  border: 1px solid rgba(245,242,236,.2);
  opacity: 0; transform: scale(.8);
  transition: opacity .3s ease, transform .5s var(--ease);
  z-index: 2;
}
.photo-view svg { width: 20px; height: 20px; }

.photo-button:hover .photo-view, .photo-button:focus-visible .photo-view { opacity: 1; transform: scale(1); }
.photo-caption { display: flex; align-items: start; justify-content: space-between; gap: 18px; margin-top: 17px; }

.photo-category { display: block; font-size: 12px; color: var(--muted); margin-top: 0; letter-spacing: .025em; }
.photo-number { font-size: 12px; padding-top: 0; font-variant-numeric: tabular-nums; color: var(--muted); }
.photo-load-error { min-height: 220px; display: grid; place-items: center; color: var(--muted); font-size: 14px; padding: 30px; text-align: center; }
.gallery-state { padding: 65px 20px 110px; text-align: center; color: var(--muted); font-size: 16px; }
.gallery-state button { margin-top: 20px; background: transparent; border: 1px solid var(--line); padding: 10px 20px; }
.loading-line { display: block; width: 48px; height: 1px; margin: 0 auto 25px; background: var(--accent); animation: loading 1.5s ease-in-out infinite; }
@keyframes loading { 50% { transform: scaleX(.25); opacity: .3; } }
.collection-end { text-align: center; margin: 0 0 50px; }

.collection-end a { display: inline-flex; gap: 20px; align-items: center; font-size: 13px; color: var(--muted); margin-top: 26px; min-height: 44px; }
.collection-end a:hover { color: var(--accent); }

/* --- Contact --- */
.contact-section { background: var(--ink); color: var(--paper); padding: clamp(80px, 12vw, 160px) var(--gutter); }
.contact-inner { max-width: 640px; }
.contact-eyebrow { color: rgba(244,243,239,.35); margin-bottom: 32px; }
.contact-heading { font-family: var(--serif); font-size: clamp(52px, 9vw, 130px); font-weight: 400; line-height: 1.05; letter-spacing: -.04em; margin-bottom: 32px; }
.contact-sub { font-size: 15px; color: rgba(244,243,239,.5); line-height: 1.7; margin-bottom: 52px; max-width: 380px; }
.contact-cta { display: inline-flex; align-items: center; gap: 18px; font-size: clamp(14px, 1.8vw, 19px); letter-spacing: -.01em; color: var(--paper); text-decoration: none; border-bottom: 1px solid rgba(244,243,239,.2); padding-bottom: 14px; transition: border-color .3s ease, gap .4s var(--ease); min-height: 44px; }
.contact-cta:hover { border-color: var(--paper); gap: 30px; }
.contact-arrow { font-size: 1.4em; transition: transform .4s var(--ease); }
.contact-cta:hover .contact-arrow { transform: translate(4px, -4px); }

.site-footer { margin: 0 var(--gutter); padding: 40px 0 50px; border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 24px; color: var(--muted); }
.footer-left { display: flex; align-items: baseline; gap: 20px; flex-wrap: wrap; }
.footer-wordmark { color: var(--ink); font-size: 23px; }
.footer-rights { font-size: 11px; letter-spacing: 0.05em; text-transform: uppercase; }
.webiki-link { font-size: 11px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--muted); text-decoration: none; transition: color 0.3s ease; }
.webiki-link:hover { color: var(--ink); }




.lightbox { inset: 0; width: 100%; max-width: none; height: 100%; height: 100dvh; max-height: none; border: 0; padding: 0; margin: 0; color: var(--paper); background: var(--night); overflow: auto; color-scheme: dark; opacity: 0; transition: opacity .32s ease; overscroll-behavior: contain; scrollbar-color: #8c9a85 var(--night); outline: none; }
.lightbox[open] { display: flex; flex-direction: column; }
.lightbox.is-visible { opacity: 1; }
.lightbox::backdrop { background: var(--night); }
.lightbox button:focus-visible, .lightbox a:focus-visible { outline-color: #d4bea4; }
.lightbox ::selection { background: #d4bea4; color: var(--night); }
.lightbox-top { min-height: 50px; display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; gap: 15px; padding: 10px var(--gutter); flex-shrink: 0; }
.lightbox-wordmark { font-size: 24px; }
.lightbox-counter { text-align: center; font-size: 13px; letter-spacing: .08em; font-variant-numeric: tabular-nums; color: #bac0b4; }
.lightbox-actions { justify-self: end; display: flex; align-items: center; gap: 20px; }
.icon-button { display: flex; align-items: center; gap: 10px; border: 0; color: var(--paper); background: transparent; padding: 10px 0; font-size: 13px; }
.icon-button svg { width: 26px; height: 26px; transition: transform .3s ease; }
#lightbox-close:hover svg { transform: rotate(90deg); }
.zoom-control { display: flex; align-items: center; gap: 8px; color: var(--paper); }
.zoom-control svg { width: 20px; height: 20px; }
#lightbox-zoom-slider { width: 90px; cursor: pointer; accent-color: #d4bea4; }
.lightbox-layout { display: flex; flex-direction: row; align-items: stretch; justify-content: center; flex: 1; min-height: 0; padding: 0 var(--gutter) 10px; gap: 30px; }
.lightbox-stage { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; flex: 1; min-height: 0; padding: 0; touch-action: none; overflow: hidden; }
.lightbox-image-wrap { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; min-height: 0; min-width: 0; transition: opacity .28s ease, transform .6s var(--ease), clip-path .6s var(--ease); }
.lightbox-image-wrap.is-switching { opacity: 0; transform: translateY(18px); clip-path: inset(0 0 8% 0); }
.lightbox-image-wrap.is-loading { opacity: .2; }
#lightbox-image { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; -webkit-user-select: none; user-select: none; }
.cursor-prev { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M20 6l-10 10 10 10' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") 16 16, w-resize !important; }
.cursor-next { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M12 6l10 10-10 10' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") 16 16, e-resize !important; }

.lightbox-info { width: 220px; text-align: right; flex-shrink: 0; display: flex; flex-direction: column; justify-content: center; }
.lightbox-info > .eyebrow, .lightbox-info h2, .info-rule { display: none; }
.metadata { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 8px; margin: 0; }
.metadata-row { display: flex; align-items: baseline; gap: 8px; margin: 0; justify-content: flex-end; }
.metadata dt { color: #a7b19e; font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; margin: 0; }
.metadata dd { margin: 0; font-size: 11px; color: #d3d8cd; }
.lightbox-credit { display: none; }
.lightbox-image-error { padding: 40px; font-size: 14px; color: #b7bfad; text-align: center; }
.lightbox-bottom { display: flex; justify-content: space-between; align-items: center; padding: 5px var(--gutter) 10px; gap: 20px; color: #9ea995; font-size: 11px; min-height: 30px; flex-shrink: 0; }
.lightbox-bottom p span { margin: 0 15px; color: #78816f; }
.lightbox-bottom > span { letter-spacing: .1em; text-transform: uppercase; }
.touch-hint { display: none; }


/* The image's intrinsic width / height determine its displayed aspect ratio. */
.photo-image { width: 100%; height: auto; object-fit: contain; }
.photo-button:hover, .photo-button:focus-visible { transform: translateY(-5px); }
.filter:focus-visible { outline-offset: -2px; }
h1 { font-family: var(--serif); font-size: clamp(80px, 17vw, 260px); font-weight: 400; line-height: 1.19; letter-spacing: -.055em; overflow: hidden; padding: 0 .02em .06em 0; }
.title-letter { display: inline-block; animation: letter-enter 1.25s var(--ease) both; animation-delay: calc(100ms + var(--letter) * 55ms); transform-origin: 50% 100%; }
.site-header .wordmark { animation: header-enter 1s var(--ease) 80ms both; }
/* Header transparent sur hero : textes clairs */
body:not(.is-scrolled) .site-header .wordmark,
body:not(.is-scrolled) .site-header .header-nav-link,
body:not(.is-scrolled) .site-header .header-link,
body.is-past-collection .site-header .wordmark,
body.is-past-collection .site-header .header-nav-link,
body.is-past-collection .site-header .header-link { color: var(--paper); }
body:not(.is-scrolled) .site-header .header-nav-link:hover,
body.is-past-collection .site-header .header-nav-link:hover { color: rgba(245,242,236,.55); }
.header-link { animation: header-enter 1s var(--ease) 280ms both; }
.collection-bar::before { content: ""; position: absolute; top: -1px; left: 0; width: 100%; height: 1px; background: var(--ink); transform-origin: left; animation: line-enter 1.35s var(--ease) 300ms both; }
.filters { animation: header-enter 1s var(--ease) 450ms both; }
.photo-count { animation: header-enter 1s var(--ease) 620ms both; }
@keyframes letter-rise {
  /* conservé pour compatibilité si d'autres éléments l'utilisent */
  from { transform: translateY(108%); }
  to   { transform: translateY(0); }
}
@keyframes header-enter {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes line-enter {
  from { transform: scaleX(0); opacity: 0; }
  to { transform: scaleX(1); opacity: .35; }
}
.motion-ready [data-reveal] { opacity: 0; transform: translateY(64px); transition: opacity 1.2s var(--ease), transform 1.45s var(--ease); transition-delay: var(--reveal-delay, 0ms); }
.motion-ready [data-reveal].is-revealed { opacity: 1; transform: none; }
.motion-ready .photo-card .photo-button { clip-path: inset(0 0 0 0); transition-delay: 0ms, var(--reveal-delay, 0ms); }
.motion-ready .photo-card:not(.is-revealed) .photo-button { clip-path: inset(0 0 15% 0); }
/* Narrow portraits and wider landscapes preserve the editorial balance. */
@media (min-width: 761px) {
  .editorial-pair[data-layout="portrait-landscape"] .photo-card:first-child,
  .editorial-pair[data-layout="portrait-square"] .photo-card:first-child,
  .editorial-pair[data-layout="portrait-portrait"] .photo-card:first-child { grid-column: 2 / span 4; margin-top: 0; }
  .editorial-pair[data-layout="portrait-landscape"] .photo-card:nth-child(2),
  .editorial-pair[data-layout="portrait-square"] .photo-card:nth-child(2) { grid-column: 7 / span 6; margin-top: 90px; }
  .editorial-pair[data-layout="portrait-portrait"] .photo-card:nth-child(2) { grid-column: 8 / span 4; margin-top: 110px; }
  .editorial-pair.is-solo .photo-card[data-orientation="portrait"] { grid-column: 5 / span 4; }
}

@media (min-width: 1800px) {
  #page { max-width: 1920px; margin: auto; }
}
@media (max-width: 1100px) {

  .photo-count { display: none; }
  .collection-bar { gap: 25px; }
  .editorial-pair { column-gap: 18px; }
  .editorial-pair .photo-card:nth-child(2) { margin-top: 90px; }
  .lightbox-layout { grid-template-columns: minmax(0, 1fr) 235px; gap: 30px; }
}
@media (max-width: 760px) {
  :root { scroll-padding-top: 80px; }
  .site-header { display: none; }
  .hero-content { padding-bottom: clamp(50px,10vw,80px); }
  .contact-heading { font-size: clamp(44px, 13vw, 80px); }





  .introduction { padding-top: 25px; padding-bottom: 27px; }
  h1 { font-size: clamp(50px, 16vw, 145px); }
  .collection-bar { display: block; padding: 9px var(--gutter) 0; min-height: 66px; margin: 0 calc(-1 * var(--gutter)) 20px; position: static; background: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .collection-bar h2 { font-size: 12px; margin-bottom: 4px; }
  .filters { gap: 25px; width: 100%; max-width: none; overflow-x: auto; padding: 0 3px 3px; scrollbar-width: none; }
  .filters::-webkit-scrollbar { display: none; }
  .filter { font-size: 14px; padding: 11px 0 14px; }
  .filter sup { font-size: 12px; }
  .editorial-pair { display: flex; flex-direction: column; margin-bottom: 58px; gap: 58px; }
  .editorial-pair .photo-card { width: 100% !important; margin: 0 !important; }

  .photo-caption { margin-top: 13px; }
  .photo-category { margin-top: 0; }
  .photo-view { opacity: 1; transform: none; width: 40px; height: 40px; right: 13px; bottom: 13px; }
  .photo-view svg { width: 20px; }
  .collection-end { margin: 5px 0 58px; }

  .site-footer { flex-direction: column; align-items: flex-start; padding: 30px 0; gap: 15px; }
  .footer-left { flex-direction: column; align-items: flex-start; gap: 8px; }
  .footer-rights { font-size: 10px; }
  .site-footer .wordmark { font-size: 20px; }
  .hero-info { flex-wrap: wrap; gap: 8px; }
  .lightbox-top { min-height: 50px; padding: max(14px, env(safe-area-inset-top)) 20px 14px; }
  .lightbox-top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
  .lightbox-wordmark { font-size: 15px; letter-spacing: -.035em; }
  .lightbox-counter { font-size: 12px; }
  .close-label { display: none; }
  .lightbox-layout { padding: 0 15px 15px; gap: 15px; flex: 1; flex-direction: column; }
  .lightbox-stage { height: auto; min-height: 0; padding: 0; flex: 1; }
  #lightbox-image { max-height: 100%; }
  .lightbox-info { padding: 5px 2px 5px; width: 100%; text-align: center; }
  .metadata { gap: 8px 16px; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; }
  .metadata-row { justify-content: center; }
  .metadata dd { font-size: 11px; }
  .lightbox-credit { display: none; }
  .lightbox-bottom { padding: 14px 22px max(22px, env(safe-area-inset-bottom)); margin-top: auto; }
  #lightbox-help { display: none; }
  .touch-hint { display: block; }
}
@media (max-height: 650px) and (min-width: 761px) {
  .lightbox-top { min-height: 65px; }
}
@media (prefers-reduced-motion: reduce) {
  :root { scroll-behavior: auto; }
  .motion-ready [data-reveal], .title-letter, .site-header .wordmark, .header-link, .filters, .photo-count { opacity: 1; transform: none; }
  .hero-scroll-line::after, .hero-eyebrow, .hero-scroll { animation: none; opacity: 1; }
  .motion-ready .photo-card:not(.is-revealed) .photo-button { clip-path: none; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; transition-delay: 0ms !important; }

}