@font-face { font-family:"Season Serif"; src:url("assets/fonts/season-serif-light.ttf") format("truetype"); font-style:normal; font-weight:300; font-display:swap; }
:root { --ink:#111; --paper:#fffcf5; --red:#920b0f; --page-gutter:58px; }
* { box-sizing:border-box; }
html { background:var(--paper); color:var(--ink); font-family:"DM Sans",Arial,sans-serif; }
body { min-width:320px; margin:0; }
button { color:inherit; font:inherit; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.hero { position:relative; display:flex; flex-direction:column; gap:clamp(20px,4vh,48px); width:100%; height:100vh; height:100dvh; min-height:320px; padding:48px var(--page-gutter) var(--page-gutter); }
.hero__header { flex-shrink:0; }
.hero__header { position:relative; z-index:100; display:flex; align-items:flex-start; justify-content:space-between; gap:32px; flex-wrap:wrap; margin:0; }
.hero__header p { width:304px; margin:0; font:300 16px/normal "DM Sans",Arial,sans-serif; text-transform:uppercase; color:#8f0d0f; }
.hero__nav { display:flex; align-items:center; gap:29px; }
.hero__nav button { line-height:normal; }
.mobile-menu-toggle { display:none; }
.nav-link { padding:0; border:0; background:transparent; color:#8e2221; font-size:16px; line-height:normal; text-decoration:none; text-transform:uppercase; white-space:nowrap; cursor:pointer; transition:color 180ms ease,transform 180ms ease; }
.nav-link:hover { color:#111111; transform:translateY(-2px); }
.nav-link:focus-visible { outline:2px solid var(--red); outline-offset:5px; }
.contact { position:relative; isolation:isolate; display:flex; align-items:center; gap:5px; height:auto; padding:0; border:0; background:transparent; color:#8e2221; font-size:16px; text-decoration:none; text-transform:uppercase; cursor:pointer; transition:color 180ms ease,transform 180ms ease; }
.contact .contact-dot { width:10px; height:10px; border-radius:1px; background:#8e2221; transition:background-color 180ms ease; }
.contact .contact-card { position:absolute; z-index:200; top:calc(100% + 14px); right:0; display:flex; flex-direction:column; gap:6px; width:214px; height:187px; padding:8px; border-radius:6px; background:#8e2221; opacity:0; overflow:hidden; pointer-events:none; transform:translateY(-7px) scale(.985); transform-origin:top right; transition:opacity 180ms ease,transform 240ms cubic-bezier(.22,.75,.2,1); }
.contact-card__photo { position:relative; display:block; width:100%; aspect-ratio:177/129; border-radius:2px; overflow:hidden; background:#8e2221; }
.contact-card__photo img { position:absolute; top:0; left:-9.13%; display:block; width:109.23%; height:112.4%; max-width:none; object-fit:cover; }
.contact-card__footer { display:flex; align-items:center; justify-content:space-between; width:100%; height:20px; color:#fffcf5; }
.contact-card__label { width:auto; height:auto; padding:0; border-radius:0; background:transparent; color:inherit; font-family:"DM Sans",Arial,sans-serif; font-size:14px; font-weight:400; line-height:normal; letter-spacing:-.28px; text-transform:none; white-space:nowrap; }
.contact-card__arrow { display:block; width:20px; height:20px; object-fit:contain; }
.contact:focus-visible { outline:2px solid var(--red); outline-offset:4px; }
@media (hover:hover) {
  .contact:hover { color:#111111; transform:translateY(-2px); }
  .contact:hover .contact-dot { background:#111111; }
  .contact:hover .contact-card { opacity:1; transform:translateY(0) scale(1); }
}
.contact:focus-visible .contact-card { opacity:1; transform:translateY(0) scale(1); }
.contact:active { color:#111111; }
.contact:active .contact-dot { background:#111111; }
.custom-cursor { display:none; }
@media (hover:hover) and (pointer:fine) {
  html, body, a, button, [role="button"] { cursor:none !important; }
  .custom-cursor {
    position:fixed;
    z-index:9999;
    top:0;
    left:0;
    display:block;
    width:29px;
    height:29px;
    border-radius:50%;
    background:#f8751b;
    opacity:0;
    pointer-events:none;
    mix-blend-mode:difference;
    transform:translate3d(-50%,-50%,0);
    transition:width 140ms ease,height 140ms ease,opacity 120ms ease;
  }
  .custom-cursor.is-visible { opacity:1; }
  .custom-cursor.is-over-interactive { width:38px; height:38px; }
}
/* Keep the artwork compact and centered independently of the navbar. */
.hero__stage { flex:1; min-height:0; display:grid; place-items:center; container-type:size; }
.hero__scene { position:relative; width:min(88cqw,1160px,142.78cqh); aspect-ratio:1068/748; pointer-events:none; }
.hero__composition { position:absolute; z-index:1; left:1.779%; top:7.635%; width:98.1545%; aspect-ratio:1048.29/578.16; pointer-events:none; }
.hero__floating { position:absolute; z-index:2; overflow:hidden; will-change:transform; }
.hero__floating img { position:absolute; width:100%; height:100%; object-fit:cover; }
.hero__floating--bloom { left:calc((100% - 100cqw) / 2 + 70px); top:67.5134%; width:15.0749%; height:15.6417%; }
.hero__floating--bloom img { left:-0.21%; top:-10.26%; width:100.32%; height:110.26%; }
.hero__floating--halftone { left:calc((100% - 100cqw) / 2 + 18cqw + 70px); top:88.2353%; width:8.2397%; height:11.7647%; }
.hero__floating--motion { right:calc((100% - 100cqw) / 2 + 70px); top:0; width:9.0824%; height:14.4385%; border-radius:2px; }
.hero__floating--motion img { left:-29.62%; width:177.69%; }
.hero__floating--upper-left { left:calc((100% - 100cqw) / 2 + 70px); top:5.8%; width:10%; aspect-ratio:1; }
.hero__floating--lower-right { right:calc((100% - 100cqw) / 2 + 70px); top:77.5%; width:10%; aspect-ratio:1; }
.hero__composition img { position:absolute; display:block; object-fit:contain; }
.hero__main, .hero__small { position:absolute; }
.hero__frame { inset:0; width:100%; height:100%; }
.hero__small .hero__frame { mix-blend-mode:multiply; }
.hero__animation { position:absolute; overflow:hidden; }
.hero__animation > img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:contain; }
.hero__animation--square { left:12.0514%; top:10.7088%; width:78.4212%; height:76.1759%; }
.hero__animation--square::after { content:""; position:absolute; inset:0; box-shadow:inset 3.699px 3.699px 16.183px #67151559; }
.hero__animation--oval { left:11.9196%; top:15.8952%; width:77.3695%; height:66.5928%; border-radius:50%; }
.hero__main { left:22.3211%; top:0; width:54.6174%; height:82.1946%; }
.hero__small { left:63.1505%; top:61.2097%; width:30.9559%; height:38.7903%; }
.hero__living { left:20.0803%; top:7.4184%; width:40.1606%; height:27.8469%; transform:translateX(-50%); mix-blend-mode:darken; }
.hero__art { left:89.3636%; top:30.0816%; width:21.2727%; height:22.1392%; transform:translateX(-50%); }
.gallery { width:calc(100% - 116px); max-width:1260px; margin:152px auto 0; }
.gallery__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); column-gap:clamp(36px,3vw,52px); row-gap:clamp(100px,14vh,160px); }
.spa-instructions { display:none; width:min(649px,calc(100% - 48px)); margin:111px auto 120px; color:#8f0d0f; }
.spa-instructions h1 { display:flex; align-items:center; height:62px; margin:0 0 62px; mix-blend-mode:darken; }
.spa-instructions h1 img { display:block; width:274px; height:auto; }
.steps { display:flex; flex-direction:column; gap:38px; }
.step,.step__copy { display:flex; flex-direction:column; align-items:flex-start; }
.step--with-image { gap:22px; }
.step__copy { gap:8px; width:100%; }
.step__copy--prompt { gap:12px; }
.step__copy h2,.step__copy p { margin:0; font-size:16px; line-height:normal; }
.step__copy h2 { color:#8f0d0f; font-weight:600; text-transform:uppercase; }
.step__copy p { color:rgb(143 13 15 / 80%); font-weight:300; }
.midjourney-link { color:inherit; font-weight:500; text-decoration-line:underline; text-decoration-thickness:1px; text-underline-offset:2px; transition:color 180ms ease; }
.midjourney-link:hover { color:#8f0d0f; }
.instruction-image { position:relative; width:100%; overflow:hidden; }
.instruction-image img { position:absolute; max-width:none; }
.instruction-image--sref { aspect-ratio:647/69; border-radius:11px; }
.instruction-image--sref img { top:-71.01%; left:-1.39%; width:101.39%; height:171.01%; }
.instruction-image--filters { aspect-ratio:454/145; border-radius:6px; }
.instruction-image--filters img { top:-0.02%; left:0; width:100%; height:161.42%; }
.instruction-image--prompt { aspect-ratio:647/118; border-radius:16px; }
.instruction-image--prompt img { top:0; left:-1.39%; width:101.39%; height:100%; }
body.is-how-view .hero { height:auto; min-height:0; padding-bottom:0; gap:0; }
body.is-how-view .hero__stage,
body.is-how-view .gallery { display:none; }
body.is-how-view .spa-instructions { display:block; }
body.is-content-entering.is-how-view .spa-instructions,
body.is-content-entering:not(.is-how-view) .hero__stage,
body.is-content-entering:not(.is-how-view) .gallery { animation:content-enter 280ms ease-out both; }
@keyframes content-enter { from { opacity:0; transform:translateY(6px); } }
.category { min-width:0; }
.category__images { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); gap:3px; aspect-ratio:1; }
.category__image-button { position:relative; display:block; padding:0; overflow:hidden; border:0; border-radius:4px; background:#e7e3d9; cursor:zoom-in; }
.category__image-button img { display:block; width:100%; height:100%; object-fit:cover; }
[data-category-slug="chromatic-india"] .category__image-button img {
  transform: scale(1.025);
  transform-origin: center;
}
.category:nth-child(4) .category__image-button:not(:first-child) img { position:absolute; top:0; left:-0.26%; width:125.2%; }
.category:nth-child(5) .category__image-button:nth-child(-n+3) img { position:absolute; top:0; width:178.43%; }
.category:nth-child(5) .category__image-button:nth-child(1) img { left:-9.84%; }
.category:nth-child(5) .category__image-button:nth-child(2) img { left:-20.04%; top:-0.28%; }
.category:nth-child(5) .category__image-button:nth-child(3) img { left:-4.32%; top:0.26%; }
.category__image-button:focus-visible { outline:2px solid var(--red); outline-offset:3px; z-index:1; }
.category__title { display:flex; gap:16px; margin:14px 0 0; font:400 16px/21px "DM Sans",Arial,sans-serif; text-transform:uppercase; }
.site-footer { height:334px; margin-top:80px; padding:0 var(--page-gutter) 58px; color:#8f0d0f; }
.site-footer__inner { position:relative; width:100%; height:100%; }
.site-footer__rule { position:absolute; top:65px; left:0; display:block; width:100%; height:1px; }
.site-footer__brand { position:absolute; top:112px; left:0; color:#920b0f; font:300 clamp(104px,calc((100vw - 116px) * .1409),164px)/1 "Season Serif",Georgia,serif; letter-spacing:-.02em; mix-blend-mode:darken; text-decoration:none; text-rendering:geometricPrecision; white-space:nowrap; -webkit-font-smoothing:antialiased; }
.site-footer__info { --footer-info-left:min(calc(59.375vw - var(--page-gutter)),702px); position:absolute; top:129px; left:calc(var(--footer-info-left) + 3px); display:flex; flex-direction:column; align-items:flex-start; gap:28px; width:min(630px,calc(100% - var(--footer-info-left) - 3px)); font-size:12px; font-weight:300; line-height:normal; }
.site-footer__columns { display:flex; align-items:flex-start; gap:41px; }
.site-footer__nav,.site-footer__meta { display:flex; flex-direction:column; align-items:flex-start; gap:10px; }
.site-footer__nav { width:86px; }
.site-footer__meta { width:71px; text-transform:uppercase; }
.site-footer__nav a { color:inherit; text-decoration:none; text-transform:uppercase; transition:color 180ms ease,transform 180ms ease; }
.site-footer__nav a:hover { color:#111; transform:translateY(-1px); }
.site-footer__nav a:focus-visible,.site-footer__brand:focus-visible { outline:2px solid var(--red); outline-offset:4px; }
.site-footer__info p { width:100%; margin:0; }
.site-footer__disclaimer span { display:block; }
.footer-lace { width:100%; height:98px; background:url("assets/lace-footer.png") repeat-x -22px 0 / 654px 98px; }
body.is-how-view .site-footer { margin-top:160px; }
.lightbox {
  width: min(570px, calc(100vw - 24px), calc(100svh - 155px));
  max-width: none;
  max-height: calc(100vh - 24px);
  max-height: calc(100svh - 24px);
  padding: 20px;
  overflow: visible;
  border: 0;
  border-radius: 6px;
  background: #fffcf5;
}

.lightbox::backdrop {
  background: rgb(4 12 32 / 72%);
  backdrop-filter: blur(4px);
}

.lightbox__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 16px;
}

.lightbox__title {
  margin: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  text-transform: uppercase;
}

.lightbox__download {
  min-height: 34px;
  padding: 8px;
  border: 0;
  border-radius: 4px;
  color: #ffffff;
  background: #8e2221;
  font-size: 13.624px;
  line-height: normal;
  white-space: nowrap;
  cursor: pointer;
}

.lightbox__download:hover,
.lightbox__download:focus-visible {
  background: #73191a;
}

.lightbox__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 26px;
  width: 100%;
}

.lightbox__image-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 6px;
  background: #e5e5e5;
}

.lightbox--native-ratio .lightbox__image-wrap {
  aspect-ratio: var(--category-ratio);
}

.lightbox--portrait {
  width: min(570px, calc(100vw - 24px), calc(75svh - 116.25px));
}

.lightbox__image {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: cover;
}

.lightbox--chromatic-india .lightbox__image,
.lightbox--chromatic-india .lightbox__thumbnail img {
  transform: scale(1.025);
  transform-origin: center;
}

.lightbox__copy {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  align-items: center;
  gap: 4px;
  width: 77px;
  min-height: 35px;
  padding: 8px;
  border: 0;
  border-radius: 4px;
  color: #ffffff;
  background: rgb(255 255 255 / 10%);
  font-size: 13.624px;
  line-height: normal;
  backdrop-filter: blur(6px);
  cursor: pointer;
}

.lightbox__copy img {
  display: block;
  width: 19px;
  height: 19px;
}

.lightbox__copy:hover,
.lightbox__copy:focus-visible {
  background: rgb(255 255 255 / 20%);
}

.lightbox__thumbnails {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 6px;
  min-height: 55px;
}

.lightbox__thumbnail {
  width: 41px;
  height: 41px;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 2px;
  background: #dddddd;
  cursor: pointer;
  transition: width 160ms ease, height 160ms ease;
}

.lightbox__thumbnail[aria-pressed="true"] {
  width: 55px;
  height: 55px;
}

.lightbox--native-ratio .lightbox__thumbnail {
  width: auto;
  height: 41px;
  aspect-ratio: var(--category-ratio);
}

.lightbox--native-ratio .lightbox__thumbnail[aria-pressed="true"] {
  width: auto;
  height: 55px;
}

.lightbox__thumbnail:focus-visible {
  outline: 2px solid #111111;
  outline-offset: 3px;
}

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

.toast {
  position: fixed;
  z-index: 10;
  right: 24px;
  bottom: 24px;
  padding: 11px 16px;
  border-radius: 999px;
  color: #ffffff;
  background: #111111;
  font-size: 13px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity 160ms ease, transform 160ms ease;
}

.toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width:1279px) and (min-width:761px) {
.hero { height:calc(100dvh - 84px); gap:20px; }
.hero__header { flex-wrap:nowrap; gap:16px; }
.hero__header p { flex:0 1 292px; width:292px; }
.hero__nav { flex-shrink:0; }
.hero__stage { transform:translateY(-18px); }
.hero__scene { width:min(104cqw,850px,160cqh); }
.hero__floating--upper-left { left:0; top:-12%; }
.hero__floating--motion { right:0; top:-12%; }
.hero__floating--bloom { left:0; top:67.5%; }
.hero__floating--halftone { left:13%; top:90%; }
.hero__floating--lower-right { right:0; top:91%; }
.gallery { width:calc(100% - 15.46875vw); margin-top:32px; }
.gallery__grid { column-gap:clamp(36px,3vw,52px); }
.category__title { font-size:clamp(11px,1.25vw,16px); gap:12px; }
.site-footer { margin-top:80px; }
}
@media (max-width:1279px) and (min-width:761px) and (orientation:landscape) {
.hero__floating--upper-left { left:-10%; top:4%; }
.hero__floating--motion { right:-10%; top:4%; }
.hero__floating--bloom { left:-10%; }
.hero__floating--lower-right { right:-10%; }
}
@media (max-width:760px) {
.site-footer { height:auto; margin-top:140px; padding:0 var(--page-gutter) 58px; }
.site-footer__inner { height:auto; padding-top:54px; }
.site-footer__rule { top:0; left:0; width:100%; }
.site-footer__brand { position:static; display:block; font-size:clamp(72px,15vw,116px); }
.site-footer__info { position:static; width:100%; margin-top:38px; gap:32px; }
body.is-how-view .site-footer { margin-top:120px; }
}
@media (max-width:760px) {
:root { --page-gutter:20px; }
.hero { position:relative; display:block; height:calc(440px + 11.6915vw); min-height:0; padding:var(--page-gutter); overflow:hidden; }
.hero__header { position:relative; z-index:100; display:flex; flex-wrap:nowrap; align-items:flex-start; justify-content:space-between; width:100%; margin:0; gap:16px; }
.hero__header p { width:262px; max-width:calc(100% - 44px); margin:0; font-size:14px; line-height:normal; }
.mobile-menu-toggle { display:grid; flex:0 0 24px; width:24px; height:24px; padding:0; border:0; background:transparent; place-items:center; cursor:pointer; }
.mobile-menu-toggle img { display:block; width:18px; height:14px; }
.hero__nav { position:absolute; z-index:101; top:36px; right:0; display:flex; flex-direction:column; align-items:flex-end; gap:12px; width:max-content; padding:12px 14px; border:1px solid rgb(142 34 33 / 18%); border-radius:6px; background:rgb(255 252 245 / 96%); box-shadow:0 8px 24px rgb(80 20 20 / 8%); opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-6px); transition:opacity 160ms ease,transform 200ms cubic-bezier(.22,.75,.2,1),visibility 0s linear 200ms; }
.hero__nav.is-open { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); transition-delay:0s; }
.nav-link,.contact { font-size:14px; }
.contact-card { display:none!important; }
.hero__stage { position:absolute; inset:0; display:block; min-height:0; pointer-events:none; }
.hero__scene { position:absolute; inset:0; width:100%; height:100%; aspect-ratio:auto; transform:none; }
.hero__composition { inset:0; width:100%; height:100%; aspect-ratio:auto; }
.hero__main { left:13.1841%; top:170px; width:56.0231%; height:auto; aspect-ratio:225.213/186.927; }
.hero__small { left:55.0622%; top:309.2px; width:31.7527%; height:auto; aspect-ratio:127.646/88.217; }
.hero__living { left:4.9751%; top:184px; width:32.1%; height:auto; transform:none; }
.hero__art { left:72.6368%; top:236px; width:17.5%; height:auto; transform:none; }
.hero__floating--motion { left:80.597%; right:auto; top:134px; width:10.2774%; height:auto; aspect-ratio:41.315/46; }
.hero__floating--upper-left { left:8.7065%; top:115px; width:9.204%; height:auto; aspect-ratio:1; }
.hero__floating--bloom { left:6.4677%; top:380px; width:17.4129%; height:auto; aspect-ratio:70/50.87; }
.hero__floating--halftone { left:44.2786%; top:440px; width:11.6915%; height:auto; aspect-ratio:1; }
.hero__floating--lower-right { display:none; }
.gallery { width:calc(100% - 48px); margin-top:120px; }
.gallery__grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:42px 24px; }
.category__title { font-size:11px; line-height:1.4; gap:8px; }
.site-footer { margin-top:80px; padding:0 var(--page-gutter) 58px; }
.site-footer__inner { padding-top:44px; }
.site-footer__brand { font-size:clamp(66px,18vw,92px); }
.site-footer__info { margin-top:34px; font-size:12px; }
.site-footer__columns { gap:41px; }
.footer-lace { height:65px; background-size:434px 65px; }
body.is-how-view .site-footer { margin-top:80px; }
.lightbox__header { gap:12px; }
.lightbox__title { font-size:13px; }
.spa-instructions { margin-top:96px; margin-bottom:80px; }
.spa-instructions h1 { height:auto; margin-bottom:48px; }
.spa-instructions h1 img { width:min(274px,75vw); }
.step__copy h2,.step__copy p { font-size:15px; }
body.is-how-view .hero { padding-bottom:0; }
}
@media (max-width:480px) {
.gallery__grid { grid-template-columns:minmax(0,1fr); gap:42px; }
.gallery { max-width:340px; }
.category__title { font-size:14px; gap:16px; }
}
@media (max-height:500px) {
  .hero { padding-top:20px; padding-bottom:20px; gap:16px; }
}
@media (prefers-reduced-motion:reduce) {
*,*::before,*::after { scroll-behavior:auto !important; transition-duration:0.01ms !important; }
}
