:root{--ink:#0a0a0c;--ink-2:#131117;--cream:#f3efe9;--muted:#f3efe98f;--faint:#f3efe947;--font-display:"Fraunces", "Times New Roman", serif;--font-body:"Inter", system-ui, -apple-system, sans-serif;--ease-out:cubic-bezier(.16, 1, .3, 1);--dur:.55s;--card-w:clamp(238px, min(26vw, 31vh), 366px);--radius:10px;--persp:1250}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--ink);min-height:100dvh;color:var(--cream);font-family:var(--font-body);-webkit-font-smoothing:antialiased;justify-content:center;align-items:center;margin:0;font-size:16px;line-height:1.5;display:flex;overflow-x:hidden}.room{z-index:0;pointer-events:none;background:radial-gradient(120% 70% at 50% 118%, #c48a4c29, transparent 62%), radial-gradient(80% 52% at 50% 8%, #7884be21, transparent 70%), linear-gradient(180deg, var(--ink-2), var(--ink) 58%);position:fixed;inset:0}.room:after{content:"";opacity:.035;background-image:url(/textures/grain.png);background-size:220px;position:absolute;inset:0}.page{z-index:1;flex-direction:column;align-items:center;width:100%;max-width:1360px;padding:clamp(24px,4.5vh,60px) 24px clamp(24px,4vh,48px);display:flex;position:relative}.masthead{text-align:center}.masthead__eyebrow{letter-spacing:.3em;text-transform:uppercase;color:var(--faint);margin:0 0 15px;font-size:.68rem;font-weight:500}.masthead__title{font-family:var(--font-display);font-optical-sizing:auto;letter-spacing:-.022em;margin:0;font-size:clamp(2rem,4.4vw,3.4rem);font-weight:300;line-height:1.03}.masthead__sub{color:var(--muted);transition:opacity var(--dur) var(--ease-out);margin:16px 0 0;font-size:.88rem}.page:has(.card:is(:hover,:focus-within,.is-active)) .masthead__sub{opacity:0}.rack{justify-content:center;align-items:flex-end;gap:clamp(22px,4vw,64px);width:100%;padding:clamp(84px,12vh,150px) 8px clamp(40px,5vh,62px);display:flex}.card{--nx:0;--ny:0;flex:0 0 var(--card-w);width:var(--card-w);perspective:calc(var(--persp) * 1px)}.card__link{color:inherit;border-radius:var(--radius);outline:none;text-decoration:none;display:block;position:relative}.card__glow{z-index:0;background:radial-gradient(closest-side, var(--accent), transparent);opacity:0;transition:opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);border-radius:50%;position:absolute;inset:-30% -44% -10%;transform:scale(.78)}.card__tilt{z-index:2;transform-style:preserve-3d;transform:rotateX(calc(var(--ny) * -11deg)) rotateY(calc(var(--nx) * 14deg));display:block;position:relative}.card__lift{aspect-ratio:2/3;transform-style:preserve-3d;transition:transform var(--dur) var(--ease-out);display:block;position:relative;transform:translate(0,0)scale(1)}.card__frame{z-index:1;isolation:isolate;border-radius:var(--radius);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--accent) 26%, transparent), inset 0 1px 0 0 #ffffff29, 0 26px 52px #0000009e;background:#060608;position:absolute;inset:0;overflow:hidden}.card__bg{object-fit:cover;width:100%;height:100%;transition:transform .9s var(--ease-out);position:absolute;inset:0;transform:scale(1.04)}.card__veil{background:linear-gradient(#0000,#04040657 54%,#040406b8);position:absolute;inset:56% 0 0}.card__scrim{opacity:0;width:100%;height:86px;transition:opacity var(--dur) var(--ease-out);position:absolute;left:0}.card__scrim--top{mix-blend-mode:screen;background:radial-gradient(62% 100% at 50% 0%, color-mix(in srgb, var(--accent) 62%, transparent), transparent 72%);height:132px;top:0}.card__scrim--bottom{background:linear-gradient(#0000,#0303059e);height:118px;bottom:0}.card__sheen{mix-blend-mode:screen;opacity:0;transform:translate3d(calc(var(--nx) * 34%), calc(var(--ny) * 34%), 0);transition:opacity var(--dur) var(--ease-out);background:radial-gradient(circle,#ffffff47,#0000 44%);position:absolute;inset:-45%}.card__plate{z-index:3;border-radius:var(--radius);pointer-events:none;position:absolute;inset:0;overflow:hidden}.card__copy:before{content:"";z-index:-1;background:linear-gradient(#0000,#03030594 20%,#030305d6 40%,#030305e6);position:absolute;inset:-110px 0 -40px}.card__copy{--reveal-h:92px;transform:translate3d(0, var(--reveal-h), 0);transition:transform var(--dur) var(--ease-out);flex-direction:column;gap:4px;padding:0 clamp(20px,1.8vw,28px) clamp(20px,1.8vw,26px);display:flex;position:absolute;bottom:0;left:0;right:0}.card__house{letter-spacing:.26em;text-transform:uppercase;color:color-mix(in srgb, var(--accent) 72%, white);font-size:.63rem;font-weight:600}.card__name{font-family:var(--font-display);font-optical-sizing:auto;letter-spacing:-.015em;font-size:clamp(1.5rem,2.2vw,2.1rem);font-weight:400;line-height:1.08}.card__reveal{height:var(--reveal-h);opacity:0;transition:opacity .34s;display:block}.card__rule{background:linear-gradient(90deg, color-mix(in srgb, var(--accent) 80%, transparent), transparent);transform-origin:0;height:1px;transition:transform var(--dur) var(--ease-out);margin:12px 0 11px;display:block;transform:scaleX(0)}.card__line{color:var(--cream);font-size:.82rem;display:block}.card__spec{letter-spacing:.04em;color:var(--muted);margin-top:3px;font-size:.7rem;display:block}.card__cta{letter-spacing:.18em;text-transform:uppercase;color:var(--cream);align-items:center;gap:7px;margin-top:14px;font-size:.66rem;font-weight:600;display:inline-flex}.card__cta svg{transition:transform var(--dur) var(--ease-out)}.card__pop{z-index:2;pointer-events:none;transition:transform var(--dur) var(--ease-out);position:absolute;inset:0;transform:translate(0,0)}.card__subject{left:50%;bottom:var(--sub-bottom,15%);height:var(--sub-h,60%);transform-origin:50% 100%;filter:drop-shadow(0 16px 20px #0009);width:auto;transition:transform var(--dur) var(--ease-out);position:absolute;transform:translate(-50%)scale(1)}.card:is(:hover,:focus-within,.is-active) .card__lift{transform:translateY(-18px)rotateX(7deg)scale(1.03)}.card:is(:hover,:focus-within,.is-active) .card__pop{transform:translate3d(0, var(--pop,-6%), 0);transition-delay:70ms}.card:is(:hover,:focus-within,.is-active) .card__subject{transform:translate3d(-50%, 0, 0) scale(var(--sub-grow,1.34));transition-delay:70ms}.card:is(:hover,:focus-within,.is-active) .card__scrim,.card:is(:hover,:focus-within,.is-active) .card__sheen{opacity:1}.card:is(:hover,:focus-within,.is-active) .card__bg{transform:scale(1.11)}.card:is(:hover,:focus-within,.is-active) .card__glow{opacity:.52;transform:scale(1)}.card:is(:hover,:focus-within,.is-active) .card__copy{transition-delay:60ms;transform:translate(0,0)}.card:is(:hover,:focus-within,.is-active) .card__reveal{opacity:1;transition-delay:.15s}.card:is(:hover,:focus-within,.is-active) .card__rule{transition-delay:.19s;transform:scaleX(1)}.card:is(:hover,:focus-within,.is-active) .card__cta svg{transform:translate(3px)}.card__link:focus-visible .card__frame{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--accent) 26%, transparent), 0 0 0 2px var(--ink), 0 0 0 4px var(--accent), 0 26px 52px #0000009e}.card.is-live .card__tilt,.card.is-live .card__lift,.card.is-live .card__bg,.card.is-live .card__pop{will-change:transform}.hint{letter-spacing:.14em;text-transform:uppercase;color:var(--faint);text-align:center;margin:0;font-size:.74rem}.hint__touch{display:none}@media (hover:none){.hint__pointer{display:none}.hint__touch{display:inline}}@media (width<=640px){:root{--card-w:clamp(228px, 68vw, 300px)}body{align-items:flex-start}.page{padding-left:0;padding-right:0}.masthead{padding:0 24px}.rack{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:128px max(24px, calc(50vw - var(--card-w) / 2)) 64px;justify-content:flex-start;overflow:auto hidden}.rack::-webkit-scrollbar{display:none}.card{scroll-snap-align:center}.hint{padding:0 24px}}@media (prefers-reduced-motion:reduce){:root{--dur:.2s}.card *,.card{transition-delay:0s!important}.card__tilt{transform:none!important}.card__sheen{display:none}.card:is(:hover,:focus-within,.is-active) .card__lift,.card:is(:hover,:focus-within,.is-active) .card__pop{transform:none}.card:is(:hover,:focus-within,.is-active) .card__subject{transform:translate(-50%)scale(1.02)}.card:is(:hover,:focus-within,.is-active) .card__bg{transform:scale(1.04)}.card:is(:hover,:focus-within,.is-active) .card__copy{transform:none}.card:is(:hover,:focus-within,.is-active) .card__rule{transform:scaleX(1)}.card:is(:hover,:focus-within,.is-active) .card__cta svg{transform:none}}
