:root { color-scheme:dark; --bg:#000000; --panel:#121212; --paper:#fff; --muted:#fff; --accent:#505050; --line:rgba(255,255,255,.17); --font:"Crumb Sans",sans-serif; --ease:cubic-bezier(.16,1,.3,1); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:110px; font-family:var(--font); font-weight:600; font-synthesis:none; }
body { margin:0; color:var(--paper); background:var(--bg); font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased; overflow-x:clip; }
body *, button, input, select, textarea { font-family:inherit; font-weight:inherit; font-style:normal; letter-spacing:-.025em; }
a { color:inherit; text-decoration:none; }
button, input, select, textarea { font-size:inherit; }
button { color:inherit; cursor:pointer; }
button:disabled { cursor:default; opacity:.6; }
img { display:block; max-width:100%; }
h1,h2,h3,p { margin:0; }
h1,h2,h3 { line-height:1.03; text-wrap:balance; }
h1 { letter-spacing:-.065em; }
h2 { font-size:clamp(38px,5.5vw,78px); letter-spacing:-.05em; }
h3 { font-size:clamp(30px,3.5vw,48px); }
[hidden] { display:none!important; }
::selection { color:var(--paper); background:var(--accent); }
:focus-visible { outline:2px solid var(--accent); outline-offset:6px; }
.wrap { width:min(100% - 64px,1440px); margin-inline:auto; }
.section-space { padding-block:clamp(72px,9vw,144px); }
.eyebrow { font-size:12px; line-height:1.5; letter-spacing:.025em; }
.muted { color:var(--muted); }
.accent { color:var(--paper); }
.badge { display:inline-flex; align-items:center; width:fit-content; padding:8px 14px; border:1px solid var(--line); border-radius:100px; font-size:12px; line-height:1.4; }
.skip-link { position:fixed; z-index:100; top:-80px; left:16px; padding:12px 20px; background:var(--accent); color:var(--paper); }
.skip-link:focus { top:12px; }
.page-transition { position:fixed; inset:0; z-index:90; background:var(--bg); pointer-events:none; transform:translateY(101%); transition:transform .32s cubic-bezier(.76,0,.24,1); }
.is-leaving .page-transition { transform:translateY(0); }
.site-header { position:sticky; top:0; z-index:30; display:flex; align-items:center; gap:32px; min-height:90px; background:#242424; border-bottom:1px solid rgba(255,255,255,.35); transition:transform .45s var(--ease); }
.site-header::before { content:""; position:absolute; z-index:-1; inset:0 calc((100% - 100vw)/2); background:#242424; border-bottom:1px solid rgba(255,255,255,.35); box-shadow:0 8px 24px #0002; pointer-events:none; }
.site-header.header-hidden { transform:translateY(calc(-100% - 26px)); }
.site-header:focus-within { transform:translateY(0); }
.brand { display:flex; align-items:center; gap:10px; flex-shrink:0; min-height:44px; font-size:17px; }
.brand img { width:34px; height:34px; border-radius:50%; transition:transform .5s var(--ease); }
.brand:hover img { transform:rotate(-7deg); }
.brand-wordmark { position:relative; display:inline-flex; }
.site-header nav { margin-left:auto; display:flex; align-items:center; gap:28px; }
.site-header nav a { position:relative; display:flex; align-items:center; min-height:44px; font-size:14px; transition:color .25s; }
.site-header nav a::after { content:""; position:absolute; left:0; right:0; bottom:8px; height:1px; background:currentColor; transform:scaleX(.35); transform-origin:left; transition:transform .4s var(--ease); }
.site-header nav a:hover::after,.site-header nav a[aria-current]::after { transform:scaleX(1); }
.site-header nav a:hover,.site-header nav a[aria-current] { color:var(--paper); }
.motion-toggle { border:1px solid var(--line); border-radius:100px; padding:7px 10px; background:transparent; font-size:11px; min-height:36px; white-space:nowrap; }
.motion-toggle:hover { border-color:var(--paper); }
.button { display:inline-flex; align-items:center; justify-content:center; padding:15px 24px; min-height:50px; border:1px solid transparent; border-radius:100px; font-size:14px; width:fit-content; transition:transform .4s var(--ease),background-color .3s,color .3s; }
.button:hover,.button:focus-visible { transform:translateY(-3px); }
.button-light { background:var(--accent); color:var(--paper); }
.button-light:hover { background:var(--accent); }
.button-glass { background:rgba(20,20,20,.6); color:var(--paper); border-color:rgba(255,255,255,.45); backdrop-filter:blur(10px); }
.button-glass:hover { background:var(--accent); color:var(--paper); }
.text-link { display:inline-flex; align-items:center; min-height:44px; padding:4px 0; border:0; background:none; font-size:14px; text-decoration:underline; text-underline-offset:6px; text-decoration-thickness:1px; transition:color .25s,text-underline-offset .3s; }
.text-link:hover { color:var(--paper); text-underline-offset:9px; }
.home-intro { padding-top:30px; }
.intro-meta { display:flex; justify-content:space-between; align-items:center; gap:16px; color:var(--muted); }
.status-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--accent); margin-right:8px; vertical-align:middle; }
.masthead { font-size:clamp(58px,12.6vw,184px); line-height:1.05; padding-block:22px 34px; white-space:nowrap; }
.hero-film { position:relative; isolation:isolate; height:clamp(440px,66svh,740px); overflow:hidden; border-radius:18px; background:#151515; }
.scene-image { width:100%; height:100%; object-fit:cover; }
.hero-film > .scene-image { position:absolute; inset:0; z-index:-2; }
.hero-shade { position:absolute; z-index:-1; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.15),transparent 35%,rgba(0,0,0,.84)); }
.hero-topline { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:28px; }
.hero-topline .badge { background:rgba(20,20,20,.5); backdrop-filter:blur(8px); }
.hero-bottom { position:absolute; bottom:36px; left:36px; right:36px; display:flex; align-items:flex-end; justify-content:space-between; gap:28px; }
.hero-bottom h2 { font-size:clamp(42px,5.3vw,80px); }
.hero-bottom p { font-size:14px; line-height:1.5; color:var(--paper); max-width:260px; }
.ticker { margin-top:44px; padding:22px 0; border-block:1px solid var(--line); overflow:hidden; }
.ticker-track { display:flex; width:max-content; animation:ticker 35s linear infinite; font-size:clamp(22px,2.4vw,34px); color:var(--muted); }
.ticker-track>span { flex-shrink:0; white-space:nowrap; padding-right:32px; }
.ticker i { display:inline-block; color:var(--paper); padding-inline:30px; }
.ticker:hover .ticker-track { animation-play-state:paused; }
.manifesto { display:grid; grid-template-columns:1.1fr .9fr; gap:10%; }
.manifesto .eyebrow { color:var(--paper); margin-bottom:28px; }
.manifesto h2 { font-size:clamp(36px,4.5vw,66px); }
.manifesto-copy { align-self:center; max-width:490px; }
.manifesto-copy .lead { color:var(--paper); font-size:26px; line-height:1.25; margin-bottom:24px; }
.manifesto-copy p { color:var(--muted); margin-bottom:18px; }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:32px; }
.section-heading .eyebrow { color:var(--paper); padding-bottom:6px; }
.explore-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.editorial-card { display:block; border-radius:16px; background:var(--panel); overflow:hidden; }
.card-image { aspect-ratio:1.4; overflow:hidden; position:relative; }
.card-image img { width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); }
.editorial-card:hover .card-image img { transform:scale(1.045); }
.card-image .badge { position:absolute; top:20px; left:20px; background:var(--accent); color:var(--paper); }
.card-copy { padding:30px; }
.card-copy .eyebrow { color:var(--muted); margin-bottom:12px; }
.card-copy h3 { margin-bottom:16px; }
.statement { text-align:center; }
.statement .eyebrow { color:var(--muted); margin-bottom:28px; }
.statement-type { font-size:clamp(34px,6.2vw,88px); line-height:1.07; letter-spacing:-.05em; }
.topic-list { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:36px; }
.topic-list span { border:1px solid var(--line); padding:10px 18px; border-radius:100px; font-size:13px; }
.invite { display:flex; justify-content:space-between; align-items:flex-end; gap:40px; padding:64px; border:1px solid var(--line); border-radius:18px; background:radial-gradient(ellipse at 100% 100%,rgba(140,140,140,.16),transparent 70%),var(--panel); margin-bottom:72px; }
.invite h2 { font-size:clamp(36px,5vw,72px); }
.invite .eyebrow { margin-bottom:24px; color:var(--muted); }
.invite .button { flex-shrink:0; }
.site-footer { padding:30px 0; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:24px; color:var(--muted); font-size:12px; }
.site-footer>div { display:flex; gap:28px; flex-wrap:wrap; }
.site-footer a { text-decoration:underline; text-underline-offset:5px; }
.page-intro { padding-block:72px 48px; }
.page-intro h1 { font-size:clamp(64px,11vw,154px); line-height:1; margin:20px 0; }
.page-intro .eyebrow { color:var(--muted); }
.page-deck { font-size:clamp(16px,2vw,22px); color:var(--muted); max-width:600px; }
.social-layout { display:grid; grid-template-columns:1fr; gap:48px; margin-bottom:96px; }
.social-portrait { position:relative; min-height:500px; border-radius:16px; overflow:hidden; background:var(--panel); }
.social-portrait img { position:absolute; inset:0; object-position:35% center; }
.image-caption { position:absolute; bottom:22px; left:22px; right:22px; width:fit-content; padding:9px 16px; border-radius:100px; font-size:13px; background:rgba(20,20,20,.8); }
.social-links { border-top:1px solid var(--line); }
.social-card { display:grid; grid-template-columns:48px minmax(0,1fr); gap:20px; padding:32px 12px; border-bottom:1px solid var(--line); transition:background .3s; }
.social-card:hover { background:rgba(255,255,255,.03); }
.social-card .eyebrow { color:var(--muted); }
.social-card h2 { font-size:clamp(34px,4vw,54px); margin:10px 0; transition:color .3s,translate .4s var(--ease); }
.social-card:hover h2 { color:var(--paper); translate:4px 0; }
.social-card p { color:var(--muted); font-size:14px; }
.social-icon { width:44px; height:44px; border:1px solid var(--line); border-radius:50%; display:grid; place-items:center; font-size:20px; }
.social-action { grid-column:2; width:fit-content; font-size:13px; text-decoration:underline; text-underline-offset:5px; }
.quiet-note { color:var(--muted); font-size:14px; max-width:390px; padding:28px 12px; }
.contact-intro { border-bottom:1px solid var(--line); }
.contact-layout { display:grid; grid-template-columns:1fr 1fr; gap:8%; padding-top:64px; }
.contact-details { min-width:0; }
.contact-details h2 { font-size:clamp(40px,4.5vw,64px); margin:28px 0; }
.contact-details>p { color:var(--muted); max-width:430px; }
.contact-address { display:block; width:fit-content; max-width:100%; overflow-wrap:anywhere; font-size:clamp(18px,2.2vw,30px); line-height:1.35; margin-top:26px; transition:color .25s; }
.contact-address:hover { color:var(--paper); }
.contact-actions { display:flex; gap:24px; margin-top:10px; }
.contact-status { font-size:13px; min-height:24px; }
.copy-fallback { width:100%; margin-top:10px; }
.contact-art { margin-top:26px; height:180px; border-radius:12px; overflow:hidden; }
.contact-art img { width:100%; height:100%; object-fit:cover; }
.inquiry-form { padding:32px; background:var(--panel); border:1px solid var(--line); border-radius:16px; }
.inquiry-form fieldset { padding:0; margin:0; border:0; min-width:0; }
.inquiry-form .eyebrow { margin-bottom:28px; color:var(--paper); }
.inquiry-form label { display:block; font-size:13px; margin-bottom:20px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
input,textarea,select { width:100%; min-width:0; margin-top:8px; padding:13px 0; border:0; border-bottom:1px solid rgba(255,255,255,.3); border-radius:0; background:transparent; color:var(--paper); font-size:15px; transition:border-color .25s; }
input:focus,textarea:focus,select:focus { border-color:var(--paper); }
input::placeholder,textarea::placeholder { color:#fff; opacity:1; }
textarea { resize:vertical; }
select option { background:var(--panel); }
.form-buttons { display:flex; gap:20px; align-items:center; flex-wrap:wrap; }
.form-note { font-size:12px; color:var(--muted); margin-top:18px; line-height:1.6; }
.faq-section { display:grid; grid-template-columns:.8fr 1.2fr; gap:10%; }
.faq-section .eyebrow { margin-bottom:20px; color:var(--paper); }
.faq-section h2 { font-size:clamp(36px,4.5vw,64px); }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list summary { min-height:80px; padding:24px 0; display:flex; justify-content:space-between; gap:20px; list-style:none; cursor:pointer; font-size:20px; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary>span { transition:rotate .3s; }
.faq-list details[open] summary>span { rotate:45deg; }
.faq-list details p { color:var(--muted); padding:0 24px 24px 0; animation:fade .35s ease; }
.faq-list a { color:var(--paper); text-decoration:underline; }
.goods-intro { padding-bottom:48px; }
.goods-intro h1 { font-size:clamp(66px,10vw,144px); }
.goods-showcase { background:var(--panel); border-radius:18px; overflow:hidden; }
.goods-image { position:relative; aspect-ratio:1.8; background:#242424; overflow:hidden; }
.goods-image .badge { position:absolute; bottom:24px; left:24px; background:var(--accent); color:var(--paper); }
.goods-image img { object-position:center; }
.goods-details { padding:36px; display:grid; grid-template-columns:.7fr 1.3fr; gap:48px; }
.goods-tabs { display:flex; flex-direction:column; align-items:flex-start; gap:10px; }
.goods-tabs button { border:1px solid var(--line); background:transparent; border-radius:100px; padding:12px 22px; font-size:14px; min-height:46px; transition:background .3s,color .3s; }
.goods-tabs button[aria-selected="true"] { color:var(--paper); background:var(--accent); border-color:var(--paper); }
.goods-details h2 { font-size:clamp(32px,4vw,50px); margin:14px 0; }
.goods-details p { max-width:650px; color:var(--muted); }
.goods-details .eyebrow { color:var(--paper); }
.concept-note { margin-top:24px; font-size:12px; }
.goods-outro { text-align:center; }
.goods-outro .eyebrow { color:var(--paper); margin-bottom:26px; }
.goods-outro>p:not(.eyebrow) { color:var(--muted); max-width:460px; margin:26px auto; }
[data-reveal] { --rx:0px; --ry:22px; }
[data-reveal="left"] { --rx:-24px; --ry:0px; }
[data-reveal="right"] { --rx:24px; --ry:0px; }
.reveal-ready { opacity:0; transform:translate(var(--rx),var(--ry)); transition:opacity .8s ease var(--delay,0ms),transform .95s var(--ease) var(--delay,0ms); }
.reveal-ready.is-visible,.reveal-ready:focus-within { opacity:1; transform:none; }
[data-image-reveal] img { transition:transform 1.5s var(--ease); }
[data-image-reveal].image-ready img { transform:scale(1.06); }
[data-image-reveal].is-visible img { transform:scale(1); }
@keyframes ticker { to { transform:translateX(-50%); } }
@keyframes fade { from { opacity:0; } to { opacity:1; } }
@keyframes caption { from { clip-path:inset(0 100% 0 0); } to { clip-path:inset(0); } }
.typed-caption { width:fit-content; }
.motion-enabled .typed-caption { animation:caption 1.1s steps(28,end) .3s both; }
.motion-enabled .site-header nav a { animation:header-in .65s var(--ease) both; }
.motion-enabled .site-header nav a:nth-child(2) { animation-delay:.08s; }
.motion-enabled .site-header nav a:nth-child(3) { animation-delay:.16s; }
.motion-enabled .site-header nav a:nth-child(4) { animation-delay:.24s; }
.editorial-card,.invite,.topic-list span,.social-icon { transition:translate .5s var(--ease),box-shadow .5s,border-color .4s; }
@media(hover:hover) {
 .motion-enabled .editorial-card:hover { translate:0 -7px; box-shadow:0 20px 45px #0004; }
 .motion-enabled .social-card:hover .social-icon { translate:0 -4px; }
 .motion-enabled .topic-list span:hover { translate:0 -5px; border-color:var(--paper); }
 .motion-enabled .invite:hover { box-shadow:0 12px 50px #0003; border-color:var(--paper); }
}
.motion-enabled .status-dot { animation:breathe 3s ease-in-out infinite; }
.motion-enabled .contact-art img { animation:studio-drift 16s ease-in-out infinite alternate; }
@keyframes header-in { from { opacity:0; transform:translateY(-12px); } to { opacity:1;transform:none; } }
@keyframes breathe { 50% { box-shadow:0 0 0 6px #ffffff15; } }
@keyframes studio-drift { to { transform:scale(1.06); } }
.reduce-motion *, .reduce-motion *::before,.reduce-motion *::after { animation:none!important; transition:none!important; }
.reduce-motion { scroll-behavior:auto; }
.reduce-motion .reveal-ready { opacity:1; transform:none; }
.reduce-motion [data-image-reveal] img { transform:none; }
.reduce-motion .brand-wordmark span { visibility:visible!important; }
@media(prefers-reduced-motion:reduce) { html:not(.motion-enabled) { scroll-behavior:auto; } html:not(.motion-enabled) *,html:not(.motion-enabled) *::before,html:not(.motion-enabled) *::after { animation:none!important;transition:none!important; } html:not(.motion-enabled) .reveal-ready { opacity:1; transform:none; } html:not(.motion-enabled) [data-image-reveal] img { transform:none!important; } }
@media(max-width:1000px) {
 .site-header { gap:20px; } .site-header nav { gap:20px; }
 .manifesto { gap:6%; } .hero-bottom { align-items:flex-start; flex-direction:column; gap:18px; }
 .hero-bottom p br { display:none; } .hero-bottom p { max-width:390px; }
 .invite { padding:40px; } .social-layout { gap:28px; } .contact-layout { gap:5%; }
 .inquiry-form { padding:24px; } .form-grid { grid-template-columns:1fr; gap:0; }
}
@media(max-width:720px) {
 html { scroll-padding-top:130px; } .wrap { width:calc(100% - 32px); }
 .site-header { flex-wrap:wrap; justify-content:space-between; gap:0 16px; padding:14px 0 8px; min-height:108px; }
 .brand { font-size:15px; } .brand img { width:28px;height:28px; }
 .site-header nav { order:3; flex-basis:100%; justify-content:space-between; margin:4px 0 0; gap:12px; }
 .site-header nav a { font-size:13px; min-height:36px; } .site-header nav a::after { bottom:3px; }
 .motion-toggle { margin-left:auto; } .intro-meta { font-size:10px; } .intro-meta>.eyebrow:last-child { display:none; }
 .home-intro { padding-top:24px; } .masthead { font-size:12.2vw; padding-block:18px 26px; }
 .hero-film { height:520px; border-radius:12px; } .hero-topline { padding:16px; flex-wrap:wrap; }
 .hero-topline .badge { display:none; } .hero-topline .button { margin-left:auto; }
 .hero-bottom { left:22px;right:22px;bottom:26px; } .hero-bottom h2 { font-size:clamp(36px,9vw,62px); }
 .hero-film>.scene-image { object-position:58% center; }
 .ticker { margin-top:28px; padding-block:16px; }
 .manifesto,.explore-grid,.social-layout,.contact-layout,.faq-section { grid-template-columns:1fr; }
 .manifesto { gap:34px; } .manifesto-copy .lead { font-size:23px; }
 .section-heading { align-items:flex-start; flex-direction:column; gap:16px; }
 .explore-grid { gap:24px; } .card-copy { padding:24px; }
 .invite { padding:30px 24px; align-items:flex-start; flex-direction:column; gap:30px; margin-bottom:48px; }
 .site-footer { flex-direction:column; gap:16px; padding-block:24px; }
 .site-footer>div { justify-content:space-between; gap:16px; }
 .page-intro { padding-block:42px 32px; }
 .page-intro h1 { font-size:clamp(52px,12vw,86px); }
 .social-layout { gap:28px; margin-bottom:64px; } .social-portrait { min-height:340px; }
 .social-card { padding:26px 8px; gap:16px; }
 .contact-layout { padding-top:36px; gap:36px; } .contact-address { font-size:clamp(18px,5.4vw,26px); }
 .contact-art { height:150px; } .inquiry-form { padding:24px 20px; }
 .faq-section { gap:28px; } .faq-list summary { font-size:18px; }
 .goods-image { aspect-ratio:1.15; } .goods-image .badge { font-size:10px;left:14px;bottom:14px; }
 .goods-details { padding:24px 20px; grid-template-columns:1fr;gap:28px; }
 .goods-tabs { flex-direction:row; flex-wrap:wrap; gap:8px; } .goods-tabs button { padding:10px 13px; font-size:12px; }
}
/* Single social feature after retiring Goods. */
.explore-single { grid-template-columns:1fr; }
.explore-single .editorial-card { display:grid; grid-template-columns:1fr 1fr; align-items:center; }
.explore-single .card-image { aspect-ratio:1.6; }
.social-portrait img { object-position:center; }
:focus-visible { outline-color:#fff; }
@media(max-width:720px) { .explore-single .editorial-card { grid-template-columns:1fr; } }