/* ZATISHYE / cinematic storefront. Native CSS + Web Animations, no paid libraries. */
:root { --motion-ease: cubic-bezier(.22,1,.36,1); }
.experience-page { --header-h: 76px; --pad-x: clamp(20px,3.2vw,64px); }
.experience-page [hidden] { display: none !important; }
.experience-page :focus-visible { outline: 1px solid currentColor; outline-offset: 5px; }
.experience-page .site-header { border: 0; }
.experience-page .site-header__inner { gap: 20px; }
.experience-page .brand { font-size: 20px; font-weight: 600; letter-spacing: -.075em; }
.experience-page .nav-primary { gap: 24px; }
.experience-page .nav-primary > li > a, .experience-page .nav-utility { font-size: 10px; letter-spacing: .08em; }
.experience-page .nav-utility { gap: 19px; }
.experience-page .announce { display: none; }
.experience-page .site-footer { padding-top: 64px; }
.experience-page .footer-brand-mark { font-weight: 600; letter-spacing: -.065em; }
.experience-page .footer-pay { display: none; }
.experience-page .btn { min-height: 48px; transition: background .3s, color .3s, transform .5s var(--motion-ease); }
.experience-page .btn:active { transform: scale(.985); }
.experience-page .btn:disabled { cursor: not-allowed; opacity: .5; }
.eyeline { font: 10px var(--ff-mono); letter-spacing: .09em; text-transform: uppercase; }
.text-link { display: inline-flex; gap: 28px; align-items: center; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; padding-block: 12px; border-bottom: 1px solid currentColor; }
.text-link span:last-child { transition: transform .5s var(--motion-ease); }
.text-link:hover span:last-child { transform: translateX(5px); }
.home-page .site-header { position: absolute; inset: 0 0 auto; color: #fff; background: transparent; z-index: 60; }
.home-page .site-header .brand { opacity: 0; pointer-events: none; }
.home-page .nav-utility select option { color: #111; background: #fff; }
.home-page .hero { background: #21251b; }
.home-page .hero__media { height: 100svh; min-height: 600px; aspect-ratio: auto; background: #21251b; }
.home-page .hero__landscape { position: absolute; inset: -7%; width: 114%; height: 114%; max-width: none; transform: translate3d(0,var(--hero-shift,0px),0); }
.home-page .hero__landscape img { width: 100%; height: 100%; object-fit: cover; object-position: 48% 50%; filter: brightness(.7) saturate(.68); animation: landscape-drift 22s ease-in-out infinite alternate; }
.home-page .hero__shade { position: absolute; inset: 0; background: linear-gradient(180deg,rgba(0,0,0,.2),transparent 35%,rgba(0,0,0,.25)); pointer-events: none; }
.hero__masthead { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #f8f7f1; padding-bottom: 2vh; }
.hero__masthead h1 { font: 600 clamp(70px,17vw,300px)/.85 var(--ff-display); letter-spacing: -.075em; padding-right: .075em; }
.hero__masthead .eyeline { margin-top: 30px; letter-spacing: .3em; }
.hero__bottom { position: absolute; inset: auto var(--pad-x) 48px; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; align-items: end; color: #fff; }
.hero__drop p { font-size: 10px; letter-spacing: .09em; text-transform: uppercase; margin-bottom: 9px; }
.hero__drop h2 { font-size: clamp(18px,2vw,28px); text-transform: uppercase; letter-spacing: -.035em; margin-bottom: 15px; }
.hero__drop .hero__cta { display: inline-flex; min-width: 160px; padding: 12px 18px; font-size: 10px; letter-spacing: .09em; margin: 0; justify-content: space-between; }
.hero__scroll { justify-self: center; display: flex; align-items: center; gap: 14px; font-size: 10px; text-transform: uppercase; letter-spacing: .07em; }
.hero__scroll i { display: block; height: 42px; width: 1px; background: #ffffff45; overflow: hidden; }
.hero__scroll i::after { content: ''; display: block; width: 1px; height: 100%; background: white; animation: scroll-line 2.5s var(--motion-ease) infinite; }
.home-page .hero__caption { position: static; text-align: right; font-size: 9px; max-width: 220px; justify-self: end; color: #ddd9cf; letter-spacing: .03em; }
.hero__motion { position: absolute; bottom: 13px; right: var(--pad-x); color: #eee; font: 9px var(--ff-mono); text-transform: uppercase; letter-spacing: .06em; padding: 5px; }
.motion-paused .hero__landscape img, .motion-paused .hero__scroll i::after { animation-play-state: paused; }
.motion-paused .hero__landscape { transform: none; }
.collection-intro { display: grid; grid-template-columns: 1fr 1.5fr 1fr; align-items: end; gap: 32px; padding: 100px var(--pad-x) 45px; }
.collection-intro h2 { font-size: clamp(35px,5vw,78px); letter-spacing: -.065em; line-height: 1; }
.collection-intro > :last-child { justify-self: end; }
.collection-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2px; padding: 0 var(--pad-x) 80px; }
.experience-page .product-card { min-width: 0; }
.experience-page .product-card__media { background: var(--c-bg-soft); aspect-ratio: 1 / 1.06; overflow: hidden; }
.experience-page .product-card__media img { object-fit: cover; transition: opacity .65s var(--motion-ease), transform 1.1s var(--motion-ease); }
.experience-page .product-card:hover .img-back { transform: scale(1.035); }
.experience-page .product-card__info { display: flex; justify-content: space-between; align-items: start; gap: 16px; padding: 17px 4px 0; }
.experience-page .product-card__name { font-size: 12px; text-transform: uppercase; letter-spacing: .03em; }
.product-card__variant { display: block; font-size: 10px; margin-top: 5px; color: var(--c-fg-muted); }
.experience-page .product-card__price { font: 11px var(--ff-mono); }
.product-card__index { position: absolute; left: 18px; top: 18px; font: 9px var(--ff-mono); background: #f4f1e9df; color: #111; padding: 5px 9px; }
.product-card__arrow { position: absolute; bottom: 20px; right: 22px; width: 38px; height: 38px; display: grid; place-items: center; background: #f4f1e9; color: #111; border-radius: 50%; transition: transform .6s var(--motion-ease); }
.product-card:hover .product-card__arrow { transform: rotate(-45deg); }
.brand-story { position: relative; min-height: 740px; height: 95svh; overflow: hidden; background: #22291f; color: #fff; }
.brand-story > img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.65); }
.brand-story__copy { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 30px; padding: 30px; text-align: center; }
.brand-story h2 { font: 400 clamp(48px,8vw,130px)/1.03 Georgia,serif; letter-spacing: -.06em; }
.brand-story p:not(.eyeline) { max-width: 350px; line-height: 1.7; font-size: 12px; }
.brand-story__index { position: absolute; bottom: 30px; left: var(--pad-x); }
.collection-empty { grid-column: 1/-1; padding: 50px 0; }

/* Full-height product: editorial text / gallery / purchase panel. */
.product-page main { min-height: calc(100svh - var(--header-h)); }
.product-page .pdp { display: grid; grid-template-columns: minmax(185px,1fr) minmax(0,2.1fr) minmax(220px,1fr); align-items: center; gap: clamp(24px,4vw,70px); padding: 24px var(--pad-x) 46px; min-height: calc(100svh - var(--header-h)); }
.pdp__editorial { padding-bottom: 35px; }
.pdp__back { display: inline-flex; gap: 12px; font-size: 10px; letter-spacing: .07em; text-transform: uppercase; color: var(--c-fg-muted); margin-bottom: 70px; }
.product-page .pdp__name { font-size: clamp(30px,3.5vw,60px); letter-spacing: -.065em; line-height: 1; text-transform: none; margin: 18px 0 20px; }
.pdp__collection { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 30px; }
.pdp__description { font-size: 12px; line-height: 1.8; color: var(--c-fg-muted); }
.pdp__disclosures { margin-top: 30px; border-top: 1px solid var(--c-border); }
.pdp__disclosure { border-bottom: 1px solid var(--c-border); }
.pdp__disclosure > button { display: flex; align-items: center; justify-content: space-between; width: 100%; text-align: left; padding: 15px 0; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.pdp__disclosure > button::after { content: '+'; font-size: 15px; transition: transform .5s var(--motion-ease); }
.pdp__disclosure > button[aria-expanded="true"]::after { transform: rotate(45deg); }
.pdp__disclosure-content { display: grid; grid-template-rows: 0fr; visibility: hidden; transition: grid-template-rows .5s var(--motion-ease), visibility .5s; }
.pdp__disclosure-content > div { overflow: hidden; }
.pdp__disclosure-content p { font-size: 11px; line-height: 1.8; padding-bottom: 18px; color: var(--c-fg-muted); }
.pdp__disclosure-content a { text-decoration: underline; text-underline-offset: 3px; }
.pdp__disclosure.is-open .pdp__disclosure-content { grid-template-rows: 1fr; visibility: visible; }
.product-page .pdp__gallery { display: block; min-width: 0; width: 100%; max-width: max(280px,calc(100svh - 225px)); align-self: center; justify-self: center; }
.pdp__stage { position: relative; overflow: hidden; aspect-ratio: 1; background: var(--c-bg-soft); touch-action: pan-y pinch-zoom; }
.pdp__image-button { width: 100%; height: 100%; display: block; cursor: zoom-in; }
.pdp__track { display: flex; height: 100%; transition: transform .85s var(--motion-ease); }
.pdp__track .pdp__image-button { flex: 0 0 100%; min-width: 0; }
.pdp__image-button img { width: 100%; height: 100%; object-fit: contain; }
.pdp__image-button:hover img { transform: scale(1.035); }
.pdp__image-button img { transition: transform 1.1s var(--motion-ease); }
.pdp__zoom-hint { position: absolute; top: 16px; right: 16px; pointer-events: none; font: 10px var(--ff-mono); color: #111; background: #f4f1e9df; padding: 7px 10px; }
.pdp__gallery-controls { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; gap: 14px; }
.pdp__gallery-controls > button { width: 42px; height: 42px; border: 1px solid var(--c-border); transition: background .3s; }
.pdp__gallery-controls > button:hover { background: var(--c-bg-soft); }
.pdp__gallery-controls > button:disabled { opacity: .25; cursor: default; }
.pdp__gallery-controls output { font: 10px var(--ff-mono); letter-spacing: .1em; }
.pdp__thumbnails { display: flex; justify-content: center; gap: 8px; margin-top: 14px; }
.pdp__thumbnail { width: 44px; height: 44px; opacity: .48; border: 1px solid transparent; padding: 2px; transition: opacity .4s,border-color .4s; }
.pdp__thumbnail img { width: 100%; height: 100%; object-fit: cover; }
.pdp__thumbnail[aria-pressed="true"] { border-color: var(--c-fg); opacity: 1; }
.product-page .pdp__info { position: static; padding: 0; }
.pdp__purchase-label { display: flex; justify-content: space-between; margin-bottom: 16px; }
.product-page .pdp__price { font: 22px var(--ff-sans); letter-spacing: -.04em; margin-bottom: 34px; }
.product-page .pdp__group { margin: 0 0 24px; }
.product-page .pdp__group .label-caps { font: 10px var(--ff-mono); margin: 24px 0 12px; }
.product-page .color-pill { padding: 6px 10px; min-height: 36px; font-size: 10px; letter-spacing: .03em; }
.product-page .color-swatch { width: 13px; height: 13px; }
.product-page .size-row { gap: 5px; }
.product-page .size-pill { flex: 1; min-width: 40px; padding: 12px 6px; font: 11px var(--ff-mono); }
.product-page .size-pill:disabled { opacity: .45; }
.product-page [data-pdp-buy] { font-size: 10px; letter-spacing: .05em; padding-inline: 12px; }
.pdp__stock { min-height: 20px; margin-top: 12px; font: 10px var(--ff-mono); color: var(--c-fg-muted); }
.pdp__purchase-note { font-size: 10px; line-height: 1.7; color: var(--c-fg-muted); margin-top: 23px; }
.pdp__edition { margin-top: 36px; padding-top: 18px; border-top: 1px solid var(--c-border); display: flex; justify-content: space-between; color: var(--c-fg-muted); font: 9px var(--ff-mono); text-transform: uppercase; }
.pdp__loading { min-height: 60svh; background: var(--c-bg-soft); animation: loading-breathe 1.3s ease-in-out infinite alternate; }
.pdp__error { grid-column: 1/-1; min-height: 60svh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px; text-align: center; }
.image-viewer { border: 0; padding: 0; width: 100vw; max-width: none; height: 100dvh; max-height: none; background: var(--c-bg); color: var(--c-fg); }
.image-viewer::backdrop { background: #111b; }
.image-viewer img { width: 100%; height: 100%; object-fit: contain; padding: 35px; }
.image-viewer [data-close-viewer] { position: absolute; top: 20px; right: 24px; z-index: 1; background: var(--c-bg); padding: 12px 18px; font-size: 11px; border: 1px solid var(--c-border); }
.image-viewer[open] { animation: viewer-enter .45s var(--motion-ease) both; }
.shop-page .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.shop-page .page-hero { padding-block: 70px 40px; }

/* Progressive enhancement: content remains visible if JavaScript is unavailable. */
.reveal-ready [data-reveal] { opacity: 0; transform: translateY(32px); transition: opacity .9s var(--motion-ease), transform 1.1s var(--motion-ease); }
.reveal-ready [data-reveal].is-visible { opacity: 1; transform: none; }
.home-page .hero__masthead h1 { animation: masthead-enter 1.45s var(--motion-ease) both; }
.home-page .hero__masthead p { animation: copy-enter 1.2s .3s var(--motion-ease) both; }
.home-page .hero__bottom { animation: copy-enter 1.1s .45s var(--motion-ease) both; }
.pdp.is-loaded .pdp__editorial { animation: panel-left 1s var(--motion-ease) both; }
.pdp.is-loaded .pdp__info { animation: panel-right 1s .08s var(--motion-ease) both; }
.pdp.is-loaded .pdp__gallery { animation: gallery-enter 1.15s var(--motion-ease) both; }
.page-curtain { position: fixed; inset: 0; background: #171a15; color: #f6f4ec; z-index: 10000; display: grid; place-items: center; pointer-events: none; transform: translateY(101%); }
.page-curtain span { font-size: clamp(36px,6vw,90px); letter-spacing: -.07em; font-weight: 600; }
.page-curtain.is-leaving { pointer-events: all; animation: curtain-cover .45s cubic-bezier(.76,0,.24,1) forwards; }
.page-curtain.is-entering { transform: translateY(0); animation: curtain-reveal .75s cubic-bezier(.76,0,.24,1) forwards; }
.experience-page .drawer { transition: transform .7s var(--motion-ease); }
.experience-page .drawer-overlay { backdrop-filter: blur(4px); }
.experience-page .mobile-drawer { display: block; visibility: hidden; opacity: 0; transform: translateY(-15px); height: calc(100dvh - var(--header-h)); color: var(--c-fg); transition: opacity .45s,transform .6s var(--motion-ease),visibility .45s; }
.experience-page.menu-open .mobile-drawer { visibility: visible; opacity: 1; transform: none; }
.experience-page.menu-open, .experience-page.cart-open { overflow: hidden; }
.home-page.menu-open .site-header { background: var(--c-bg); color: var(--c-fg); }
.preview-indicator { position: fixed; bottom: 8px; left: 10px; z-index: 90; background: #171a15dd; color: #fff; padding: 5px 8px; border: 1px solid #ffffff33; border-radius: 3px; font: 9px monospace; pointer-events: none; }
@keyframes landscape-drift { from { transform: scale(1.015); } to { transform: scale(1.1) translateX(-1%); } }
@keyframes scroll-line { 0% { transform: translateY(-100%); } 65%,100% { transform: translateY(100%); } }
@keyframes masthead-enter { from { clip-path: inset(100% 0 0); transform: translateY(60px); } to { clip-path: inset(0); transform: none; } }
@keyframes copy-enter { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
@keyframes panel-left { from { opacity: 0; transform: translateX(-30px); } to { opacity: 1; transform: none; } }
@keyframes panel-right { from { opacity: 0; transform: translateX(30px); } to { opacity: 1; transform: none; } }
@keyframes gallery-enter { from { opacity: 0; transform: translateY(35px) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes curtain-cover { to { transform: translateY(0); } }
@keyframes curtain-reveal { to { transform: translateY(-101%); } }
@keyframes viewer-enter { from { opacity: 0; transform: scale(.97); } to { opacity: 1; transform: none; } }
@keyframes loading-breathe { to { opacity: .45; } }
@media (min-width: 901px) { .experience-page .mobile-drawer { display: none; } }
@media (max-width: 1100px) and (min-width: 761px) {
  .product-page .pdp { grid-template-columns: minmax(155px,1fr) minmax(0,1.8fr) minmax(180px,1fr); gap: 22px; }
  .product-page .pdp__name { font-size: 34px; }
  .product-page .color-pill { padding: 5px; }
}
@media (max-width: 900px) {
  .experience-page .site-header__inner { grid-template-columns: auto 1fr; }
  .experience-page .site-header__inner > nav { display: none; }
  .experience-page .brand { grid-column: 1; }
  .experience-page .nav-utility { grid-column: 2; }
  .home-page .site-header .brand { opacity: 1; pointer-events: auto; }
  .collection-intro { grid-template-columns: 1fr auto; padding-top: 65px; }
  .collection-intro > .eyeline { grid-column: 1/-1; }
}
@media (max-width: 760px) {
  .experience-page { --header-h: 64px; }
  .home-page .hero__media { min-height: 540px; }
  .hero__masthead h1 { font-size: 17.6vw; }
  .hero__masthead .eyeline { font-size: 8px; margin-top: 22px; }
  .hero__bottom { bottom: 54px; grid-template-columns: 1fr auto; }
  .hero__scroll { justify-self: end; }
  .hero__scroll span { display: none; }
  .home-page .hero__caption { display: none; }
  .hero__drop h2 { font-size: 23px; }
  .collection-intro { gap: 25px; }
  .collection-intro h2 { font-size: 36px; }
  .collection-intro .text-link { font-size: 9px; gap: 12px; }
  .collection-grid { padding-bottom: 50px; gap: 10px; }
  .experience-page .product-card__info { flex-direction: column; gap: 9px; }
  .product-card__index { top: 9px; left: 9px; font-size: 8px; padding: 4px 6px; }
  .product-card__arrow { width: 28px; height: 28px; right: 10px; bottom: 10px; }
  .brand-story { height: 75svh; min-height: 540px; }
  .product-page .pdp { grid-template-columns: 1fr; padding-top: 6px; gap: 22px; }
  .pdp__editorial { display: contents; }
  .pdp__heading { grid-row: 1; }
  .pdp__back { margin: 4px 0 23px; }
  .pdp__heading > .eyeline { display: none; }
  .product-page .pdp__name { font-size: 35px; margin: 0 0 10px; }
  .pdp__collection { margin-bottom: 0; font-size: 10px; }
  .product-page .pdp__gallery { grid-row: 2; width: calc(100% + 2 * var(--pad-x)); max-width: none; margin-inline: calc(-1 * var(--pad-x)); }
  .pdp__gallery-controls, .pdp__thumbnails { margin-inline: var(--pad-x); }
  .product-page .pdp__info { grid-row: 3; padding-top: 10px; }
  .product-page .pdp__price { margin-bottom: 22px; }
  .pdp__description { grid-row: 4; }
  .pdp__disclosures { grid-row: 5; margin-top: 0; }
  .pdp__edition { margin-top: 22px; }
  .image-viewer img { padding: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .experience-page *, .experience-page *::before, .experience-page *::after { animation: none !important; transition-duration: .01ms !important; }
  .reveal-ready [data-reveal] { opacity: 1; transform: none; }
  .home-page .hero__landscape { transform: none; }
  .page-curtain { display: none; }
}