/* Shared stock, identity and navigation across the portfolio. */
:root {
  --paper: #eee8df;
  --paper-wash: linear-gradient(rgb(255 255 255 / 29%),rgb(255 255 255 / 29%));
  --paper-grain: url("assets/home-20261027/hero-cotton-paper.webp");
  --paper-tile-size: 768px 768px;
}
html { background-color: var(--paper); }
body, body.press-page, body:has(.cotton-hero) {
  background-color: var(--paper);
  background-image: var(--paper-wash), var(--paper-grain);
  background-size: var(--paper-tile-size);
  background-repeat: repeat;
}
body::after, body.press-page::after { display:none; }
/* The body supplies one continuous paper surface between the image chapters. */
.client-proof, .interiors.interiors-overlay, .collaboration-feature,
.image-direction, .about, .press-page .mah-press { background:transparent; }
.site-header, .press-page .site-header,
body:has(.cotton-hero) .site-header, body.past-entrance .site-header {
  position:sticky; top:0; z-index:30;
  width:100%; max-width:none; height:88px; margin:0;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 clamp(24px,5vw,88px); gap:24px;
  color:var(--ink); border:0; opacity:1;
  background-color:var(--paper);
  background-image:var(--paper-wash),var(--paper-grain);
  background-size:var(--paper-tile-size); background-repeat:repeat;
  backdrop-filter:none;
}
.site-header .wordmark, .press-page .site-header .wordmark,
body:has(.cotton-hero) .site-header .wordmark {
  display:flex; align-items:center; justify-content:center;
  width:44px; min-width:44px; height:60px; flex:0 0 44px;
  padding:0; margin:0; line-height:0; letter-spacing:0;
  color:var(--wine); text-shadow:none;
}
.site-header .wordmark .header-je { display:block; width:42px; height:54px; overflow:hidden; }
.site-header nav { display:flex; align-items:center; gap:34px; margin-left:auto; font:14px/1.5 var(--sans); white-space:nowrap; }
.site-header nav a { padding:12px 0; }
.site-header nav a:nth-child(3) { display:block; }
body:has(.cotton-hero) .site-header {
  position:fixed; left:0; right:0;
  opacity:1; transform:translateY(-100%); pointer-events:none;
  transition:transform 1.05s cubic-bezier(.22,.61,.36,1);
}
body:has(.cotton-hero).nav-revealed .site-header { opacity:1; transform:translateY(0); pointer-events:auto; }
.ui-arrow { font-family:Arial,sans-serif; font-variant-emoji:text; }
.mobile-direction { display:none; }
@media(max-width:650px) {
  .site-header, .press-page .site-header, body:has(.cotton-hero) .site-header { height:76px; padding:0 24px; gap:16px; }
  .site-header .wordmark .header-je { width:34px; height:44px; }
  .site-header nav, .press-page .site-header nav, body:has(.cotton-hero) .site-header nav { gap:15px; font-size:11px; }
  .press-hero h1 { font-size:clamp(54px,19.4vw,76px); }
  .ui-arrow, .site-header .ui-arrow, .text-link .ui-arrow { display:none!important; }
  .mobile-direction { display:inline; font:11px/1.4 var(--sans); }
  .interior-lightbox-arrow, .viewer-prev, .viewer-next { min-width:44px; }
}
@media(max-width:360px) {
  .site-header, .press-page .site-header, body:has(.cotton-hero) .site-header { padding:0 20px; gap:12px; }
  .site-header nav, .press-page .site-header nav, body:has(.cotton-hero) .site-header nav { gap:12px; font-size:10px; }
}
@media(prefers-reduced-motion:reduce) { body:has(.cotton-hero) .site-header { transition:none!important; } }
