.desktop-landing,.landing-reference-popup{display:none}
@media(min-width:801px){
 html.desktop-landing-active{scroll-snap-type:y proximity;scroll-padding-top:0;scroll-behavior:auto}
 body.desktop-landing-active{--landing-bg:#fff;--landing-fg:#111}
 html.energy-saving body.desktop-landing-active{--landing-bg:#000;--landing-fg:#fff}
 body.desktop-landing-active .home-opening,body.desktop-landing-active .home-short-about,body.desktop-landing-active .index-stage{display:none!important}
 .desktop-landing{display:block;background:var(--landing-bg);color:var(--landing-fg);--landing-header-height:110px}
 .desktop-landing>section{scroll-snap-align:start;scroll-snap-stop:normal;scroll-margin:0;box-sizing:border-box}
 .desktop-landing .site-header{position:fixed!important;inset:0 0 auto!important;width:100%;padding:var(--kdx-page-padding,1.3vw);background:var(--landing-bg)!important;color:var(--landing-fg)!important;z-index:90;--kdx-menu-inset:var(--kdx-page-padding,1.3vw)}
 .desktop-landing .site-header.kdx-menu-open #kdx-mobile-menu{background:transparent!important;color:inherit}
 .landing-hero{position:relative;height:100svh;min-height:600px;background:#151515;color:#fff}
 .landing-hero-track{display:flex;width:100%;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
 .landing-hero-track::-webkit-scrollbar{display:none}
 .landing-hero-slide{position:relative;flex:0 0 100%;min-width:0;height:100%;scroll-snap-align:start}
 .landing-hero-media{position:absolute;inset:0;margin:0;background:#222}
 .landing-hero-image-link{position:absolute;inset:0;z-index:1}
 .landing-hero-media .landing-caption{font-size:var(--kdx-type-subtitle);font-weight:700;color:var(--kdx-subtitle-color);-webkit-text-stroke:var(--kdx-subtitle-stroke) var(--kdx-subtitle-outline);paint-order:stroke fill;bottom:4%;text-shadow:none}
 .landing-hero-media img{display:block;width:100%;height:100%;object-fit:cover;filter:none!important}
 .landing-hero-media::after{content:none;display:none}
 .landing-caption{position:absolute;z-index:1;left:5%;bottom:4%;width:90%;margin:0;text-align:center;font:700 var(--kdx-type-subtitle)/1.1 var(--kdx-font-sans);color:var(--kdx-subtitle-color);-webkit-text-stroke:var(--kdx-subtitle-stroke) #000;paint-order:stroke fill;pointer-events:none}
 .landing-hero-copy{position:absolute;left:10%;top:47.5%;width:80%;text-align:center;z-index:2;pointer-events:none}
 .landing-hero-title{font:400 clamp(30px,2.4vw,48px)/1.12 var(--kdx-font-editorial);margin:0;color:#fff}
 .landing-hero-title a,.landing-hero-read{pointer-events:auto;text-decoration:none;color:inherit}
 .landing-hero-title a:hover{text-decoration:none}
 .landing-hero-read:hover{text-decoration:underline}
 .landing-hero-read{display:inline-block;margin-top:10px;font:400 var(--kdx-type-body)/var(--kdx-leading-body) var(--kdx-font-sans);color:#fff}
 .landing-hero-controls{position:absolute;top:50%;transform:translateY(-50%);left:var(--kdx-page-padding,1.3vw);right:var(--kdx-page-padding,1.3vw);display:flex;justify-content:space-between;pointer-events:none;z-index:3}
 .landing-hero-controls button{pointer-events:auto;background:none;border:0;color:#fff;font:400 28px/1 var(--kdx-font-sans);padding:8px 0;min-width:44px;min-height:44px;text-align:left;cursor:pointer}
 .landing-hero-controls button:nth-child(2){text-align:right}
 .landing-sr{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%)}
 .landing-about{min-height:100svh;padding:calc(var(--landing-header-height) + 50px) var(--kdx-page-padding) 70px;display:flex;align-items:center;justify-content:center}
 .landing-about-copy{width:66vw;text-align:left;font:400 var(--kdx-type-h2)/1.2 var(--kdx-font-sans)}
 .landing-about-copy p{font:inherit;margin:0}.landing-about-copy p+p{margin-top:28px}
 .landing-references{min-height:100svh;padding:var(--landing-header-height) var(--kdx-page-padding) 60px}
 .landing-brands{min-height:calc((100svh - var(--landing-header-height) - 60px)/2);display:flex;align-items:center;overflow:hidden;cursor:grab;touch-action:pan-y;user-select:none;font:400 var(--kdx-type-h2)/1.2 var(--kdx-font-sans)}
 .landing-brands.is-dragging{cursor:grabbing}
 .landing-brands-belt{display:flex;width:max-content;will-change:transform}
 .landing-brands-group{display:flex;flex:none;flex-wrap:nowrap;align-items:center;gap:160px;padding:0 160px 0 0;margin:0;list-style:none}
 .landing-brands li{flex:none;white-space:nowrap}
 .landing-reference-list{min-height:calc((100svh - var(--landing-header-height) - 60px)/2);padding-top:14px;box-sizing:border-box}
 .landing-reference-labels,.landing-reference-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));width:100%;gap:0;text-align:left;align-items:baseline;font:inherit}
 .landing-reference-labels{margin-bottom:12px}
 .landing-reference-row{padding:3px 0;background:none;border:0;color:inherit;cursor:default}
 .landing-reference-row span:not(:last-child){padding-right:30px}
 .landing-reference-row span:last-child,.landing-reference-labels span:last-child{text-align:right}
 .landing-reference-row:hover,.landing-reference-row[aria-expanded=true]{color:#888}
 .landing-reference-popup:not([hidden]){display:block;position:fixed;z-index:100;width:min(420px,calc(100vw - 28px));max-height:calc(100svh - 150px);overflow:auto;padding:14px;background:#808080;color:#fff;font:400 var(--kdx-type-body)/var(--kdx-leading-body) var(--kdx-font-sans);scrollbar-width:none}
 .landing-reference-popup>div{margin-bottom:24px}.landing-reference-popup p{margin:0;font:inherit}.landing-reference-popup .landing-popup-label{margin-bottom:6px}.landing-popup-link{text-decoration:underline}
 .landing-articles{min-height:100svh;padding:var(--landing-header-height) var(--kdx-page-padding) 90px}
 /* Match Related Thinking: image, metadata, title, then the reading link. */
 .landing-article-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:16px;row-gap:0;align-items:stretch}
 .landing-article-card{display:grid;grid-template-rows:subgrid;grid-row:span 4;min-width:0;margin-bottom:50px;color:inherit;text-decoration:none!important;font:400 var(--kdx-type-body)/var(--kdx-leading-body) var(--kdx-font-sans)}
 .landing-grid-media{container-type:inline-size;grid-row:1;align-self:end;position:relative;aspect-ratio:16/9;margin:0 0 2px;overflow:hidden}
 .landing-grid-media .landing-caption{bottom:5%;font:700 clamp(12px,3cqw,20px)/var(--kdx-leading-display) var(--kdx-font-sans);-webkit-text-stroke:.5px var(--kdx-subtitle-outline)}
 .landing-grid-media img{position:absolute;inset:0;display:block;width:100%;height:100%;max-height:none;object-fit:cover;object-position:center;filter:none!important}
 .landing-article-card>.landing-meta{grid-row:2;font:inherit;text-transform:uppercase;margin:0}
 .landing-article-card>h2{position:relative;min-width:0;grid-row:3;font:400 16px/1.2 var(--kdx-font-sans);text-align:left;margin:0}
 .landing-grid-title-text{display:block;overflow:hidden;white-space:nowrap}
 .landing-grid-title.is-truncated .landing-grid-title-text{mask-image:linear-gradient(to right,#000 calc(100% - 35px),transparent)}
 .landing-article-card:hover .landing-grid-title.is-truncated::after,.landing-article-card:focus-visible .landing-grid-title.is-truncated::after{content:attr(data-title);position:absolute;inset:0 0 auto;z-index:5;white-space:normal;background:var(--landing-bg);color:var(--landing-fg);padding:0 0 8px;box-shadow:0 8px 12px var(--landing-bg)}
 .landing-grid-read{grid-row:4;align-self:start;font:italic var(--kdx-type-body)/var(--kdx-leading-body) var(--kdx-font-sans);margin:0}
 body.desktop-landing-active .kdx-footer{scroll-snap-align:start;margin-top:0}
 @media(max-width:1100px){.landing-article-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
}

/* Mobile preview uses the same featured carousel inside its existing opening screen. */
@media(max-width:800px){
 body.home-opening-experiment .home-opening.has-article-hero>img,
 body.home-opening-experiment .home-opening.has-article-hero>.home-opening-subtitle-layer{display:none}
 .home-opening .landing-hero{position:relative;width:100%;height:100svh;color:#fff;background:#151515}
 .home-opening .landing-hero-track{display:flex;width:100%;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
 .home-opening .landing-hero-track::-webkit-scrollbar{display:none}
 .home-opening .landing-hero-slide{position:relative;flex:0 0 100%;min-width:0;height:100%;scroll-snap-align:start}
 .home-opening .landing-hero-media{position:absolute;inset:0;margin:0}
 body.home-opening-experiment .home-opening .landing-hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transform:none;pointer-events:none}
 .home-opening .landing-hero-media::after{content:none;display:none}
 .home-opening .landing-hero-image-link{position:absolute;inset:0;z-index:2}
 .home-opening .landing-hero-copy{position:absolute;top:50%;left:12%;width:76%;transform:translateY(-50%);z-index:3;text-align:center;pointer-events:none}
 .home-opening .landing-hero-title{font:400 30px/1.1 var(--kdx-font-editorial);margin:0;color:#fff}
 .home-opening .landing-hero-title a,.home-opening .landing-hero-read{color:inherit;text-decoration:none;pointer-events:auto}
 .home-opening .landing-hero-read{display:inline-block;margin-top:10px;font:400 var(--kdx-type-body)/var(--kdx-leading-body) var(--kdx-font-sans)}
 .home-opening .landing-hero-controls{position:absolute;top:50%;transform:translateY(-50%);left:14px;right:14px;z-index:4;display:flex;justify-content:space-between;pointer-events:none}
 .home-opening .landing-hero-controls button{pointer-events:auto;color:#fff;background:none;border:0;font:inherit;width:44px;height:44px;margin:0;padding:0;text-align:left}
 .home-opening .landing-hero-controls button:nth-child(2){text-align:right}
 .home-opening .landing-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .home-short-about{align-items:flex-end;padding-left:var(--kdx-page-padding,14px);padding-right:var(--kdx-page-padding,14px);padding-bottom:var(--kdx-page-padding,14px)}
 .home-short-about-copy{width:100%;max-width:none;text-align:left}
 body.home-opening-experiment .index-stage .site-header{top:0!important}
 body.home-opening-experiment.mobile-hero-visible .index-stage .site-header{background:transparent!important;color:#fff!important}
 body.mobile-hero-visible .index-stage .site-header .about-mobile{opacity:0;pointer-events:none}
 body.mobile-hero-visible .index-stage .site-header #kdx-mobile-menu{background:transparent!important;color:inherit}
 /* One viewport section: measured header space, then filters, content and controls. */
 html.mobile-home-native{scroll-snap-type:y mandatory;scroll-padding-top:0;scroll-behavior:auto}
 html.mobile-home-native .home-opening,
 html.mobile-home-native .home-short-about,
 html.mobile-home-native .index-stage,
 html.mobile-home-native .kdx-footer{scroll-snap-align:start;scroll-snap-stop:always;scroll-margin:0}
 body.home-opening-experiment .index-stage{box-sizing:border-box;height:100svh;min-height:0;display:grid;grid-template-rows:minmax(0,1fr);padding:calc(var(--mobile-header-height,150px) + 10px) var(--kdx-page-padding,14px) env(safe-area-inset-bottom,0px);overflow:visible}
 body .index-stage .mobile-slider{position:static;inset:auto;width:100%;height:100%;min-width:0;min-height:0;margin:0;display:flex;flex-direction:column;gap:0}
 body .index-stage .mobile-slider-filters{position:static;inset:auto;flex:none;align-self:stretch;margin:0 0 12px;z-index:auto}
 body .index-stage .mobile-slider-track{flex:1 1 0;min-height:0;min-width:0}
 body .index-stage .mobile-slider-controls{flex:none}

}

@media(max-width:800px){
 body .index-stage .mobile-reference-logos{position:relative;z-index:2;flex:none;width:100%;height:calc(var(--kdx-type-h2) * 1.15 * 2);margin-top:14px;overflow:hidden;background:#fff;touch-action:pan-y;user-select:none;cursor:grab}
 html.energy-saving body .index-stage .mobile-reference-logos{background:#000}
 body .index-stage .mobile-reference-logo-belt{display:flex;width:max-content;height:100%;animation:none!important;will-change:transform}
 body .index-stage .mobile-reference-logo-group{display:flex;align-items:center;gap:32px;padding-right:32px;flex:none;height:100%}
 body .index-stage .mobile-reference-logo{display:flex;align-items:center;justify-content:center;flex:0 0 130px;width:130px;height:100%;white-space:nowrap;font:400 var(--kdx-type-h2)/1.15 var(--kdx-font-sans)}
 body .index-stage .mobile-reference-logo img{display:block;max-width:100%;max-height:100%;object-fit:contain}
 body .index-stage .mobile-reference-logos.is-dragging{cursor:grabbing}
 body .index-stage .mobile-reference-logo img{-webkit-user-drag:none}
}

@media(max-width:800px){
 .home-opening .landing-hero-read{position:absolute;top:100%;left:0;width:100%;margin-top:10px}
 body .index-stage .site-header .about-mobile{transition:opacity 260ms ease}
 body .index-stage .site-header{transition:background-color 260ms ease,color 260ms ease}
 body .index-stage .mobile-tile-image img{filter:none!important;opacity:1}
 body .index-stage .mobile-tile-image::before,body .index-stage .mobile-tile-image::after{display:none}
 body.home-opening-experiment .index-stage{height:100vh;height:100lvh;min-height:100svh}
 body.home-opening-experiment .kdx-footer{margin-top:80px}
}
@media(min-width:801px){
 .landing-references{height:100svh;display:flex;flex-direction:column;padding-bottom:var(--kdx-page-padding,14px)}
 .landing-reference-list{flex:1 1 auto;min-height:0;overflow-y:auto;scrollbar-width:none}
 .landing-reference-list::-webkit-scrollbar{display:none}
 .landing-brands{flex:none;min-height:0;height:calc(var(--kdx-type-h2) * 2.4);margin-top:40px}
}
@media(prefers-reduced-motion:reduce){body .index-stage .site-header,body .index-stage .site-header .about-mobile{transition:none}}

@media(max-width:800px){
 body.home-opening-experiment .index-stage{--mobile-section-gap:12px;padding-top:calc(var(--mobile-header-height,30px) + var(--mobile-section-gap))}
 body.home-opening-experiment .index-stage .site-header{padding-bottom:0;row-gap:0}
 body .index-stage .mobile-slider-filters{margin-bottom:var(--mobile-section-gap,12px)}
}

/* Stable edge-to-edge opening screens, including Safari's retracting toolbar area. */
@media(max-width:800px){
 body.home-opening-experiment .home-opening,
 body.home-opening-experiment .home-opening .landing-hero{height:100vh;height:100lvh;min-height:100svh}
 body.home-opening-experiment .home-short-about{min-height:100vh;min-height:100lvh;padding-bottom:calc(var(--kdx-page-padding,14px) + env(safe-area-inset-bottom,0px))}
 body.home-opening-experiment .index-stage .site-header{padding-top:calc(var(--kdx-page-padding,14px) + env(safe-area-inset-top,0px));padding-left:max(var(--kdx-page-padding,14px),env(safe-area-inset-left,0px));padding-right:max(var(--kdx-page-padding,14px),env(safe-area-inset-right,0px))}
}

.short-about-learn{display:block;margin-top:10px;font:400 var(--kdx-type-body)/var(--kdx-leading-body) var(--kdx-font-sans);color:inherit;text-decoration:none}
.short-about-learn:hover{text-decoration:underline}
@media(max-width:800px){
 body.home-opening-experiment .home-short-about{align-items:center}
 body.home-opening-experiment .home-short-about-copy{width:100%;max-width:none;text-align:center}
 body.home-opening-experiment .home-short-about-copy p{font:400 30px/1.1 var(--kdx-font-editorial)}
}
@media(min-width:801px){
 .landing-about-copy .short-about-learn{text-align:left}
 .landing-work-contact{margin:12px 0 0;font:inherit;text-align:left;color:#000}
 .landing-work-contact a{text-decoration:none}.landing-work-contact a:hover{text-decoration:underline}
}

@media(max-width:800px){
 body.home-opening-experiment .home-short-about-copy{width:80vw;max-width:80vw;margin-inline:auto}
 body.home-opening-experiment .home-short-about-copy p{font:400 var(--kdx-type-h2)/var(--kdx-leading-body) var(--kdx-font-sans);-webkit-hyphens:none;hyphens:none;word-break:normal;overflow-wrap:normal}
}

/* Work tags remain visible beneath each title. */
@media(max-width:800px){
 body .index-stage .mobile-reference-tags{grid-column:1;grid-row:3;color:#5c5c5c;font:400 var(--kdx-type-body)/var(--kdx-leading-body) var(--kdx-font-sans)}
 body .index-stage .mobile-reference-marker{grid-row:1 / 4}
}

/* Desktop work table follows the twelve-column page grid. */
@media(min-width:801px){
 :is(.landing-reference-labels,.landing-reference-row)>span:nth-child(1){grid-column:1}
 :is(.landing-reference-labels,.landing-reference-row)>span:nth-child(2){grid-column:2 / 6}
 :is(.landing-reference-labels,.landing-reference-row)>span:nth-child(3){grid-column:6 / 10}
 :is(.landing-reference-labels,.landing-reference-row)>span:nth-child(4){grid-column:10 / 12}
 :is(.landing-reference-labels,.landing-reference-row)>span:nth-child(5){grid-column:12}
}

.landing-reference-popup p{text-align:left;text-align-last:left;-webkit-hyphens:auto;hyphens:auto;hyphenate-limit-chars:6 3 3;overflow-wrap:break-word}
.landing-reference-popup p+p{margin-top:1em}
