/* Project Detail only. */
.detail-page { overflow: clip; padding-top: 60px; color: var(--dels-ink); }
.detail-opening { display: grid; grid-template-columns: calc(57.3vw - var(--dels-edge) - 8px) minmax(0, 1fr); min-height: 1340px; padding: 0 var(--dels-edge); gap: 8px; }
.detail-opening-left { position: relative; min-width: 0; }
.detail-opening-left-inner { position: sticky; top: 100px; height: calc(100svh - 100px); min-height: 520px; display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: 16px; }
.detail-opening h1 { margin: 0 0 34px; max-width: 96%; font-size: 90px; font-weight: 400; line-height: 1.15; letter-spacing: -.04em; overflow-wrap: anywhere; }
.detail-opening h1 .detail-line + .detail-line { margin-top: -32px; }
.detail-opening h1 .detail-line:last-child { margin-bottom: 0; }
.detail-opening-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; font-size: 13px; line-height: 1.2; text-transform: uppercase; }
.detail-opening-meta > div:first-child { display: flex; flex-direction: column; }
.detail-opening-right { min-width: 0; }
.detail-opening-media { width: 100%; height: calc(100svh - 76px); min-height: 590px; overflow: hidden; }
.detail-opening-media img, .detail-opening-media video { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center var(--detail-position, 50%); }
.detail-opening-intro { display: flex; align-items: flex-start; min-height: 510px; padding: 80px 0 48px; font-size: clamp(22px, 2.8vw, 38px); line-height: 1.07; letter-spacing: -.035em; }
.detail-opening-intro p { margin: 0; max-width: 96%; }
.detail-content { min-height: 30vh; }
.detail-module { margin-top: var(--detail-before, 0px); margin-bottom: var(--detail-after, 0px); padding: 0 var(--dels-edge); }
.detail-module--text { display: flex; }
.detail-editorial { width: var(--detail-width, 100%); max-width: 100%; margin-left: max(0px, var(--detail-offset, 0%)); }
.detail-eyebrow { display: block; margin-bottom: 24px; font-size: 12px; line-height: 1.2; letter-spacing: .02em; text-transform: uppercase; }
.detail-editorial h2, .detail-editorial h3, .detail-editorial > p:first-of-type { margin: 0; font-size: clamp(22px, var(--detail-text-size), 140px); font-weight: var(--detail-text-weight, 400); line-height: .96; letter-spacing: -.055em; }
.detail-editorial .detail-subheading { margin: 24px 0 0; font-size: clamp(18px, 2.1vw, 30px); line-height: 1.1; }
.detail-richtext { max-width: 760px; margin-top: 34px; font-size: clamp(17px, 1.6vw, 23px); line-height: 1.12; letter-spacing: -.025em; }
.detail-richtext p { margin: 0 0 1em; }
.detail-richtext a { text-decoration-thickness: 1px; text-underline-offset: .15em; }
.detail-variant--compact .detail-richtext { margin-top: 16px; font-size: clamp(15px, 1.25vw, 18px); }
.detail-variant--large .detail-richtext { font-size: clamp(22px, 2.2vw, 32px); }
.detail-media-group { display: grid; gap: 8px; width: var(--detail-width, 100%); max-width: 100%; margin-left: max(0px, var(--detail-offset, 0%)); align-items: start; }
.detail-module--pair .detail-media-group { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.detail-module--pair[class*="detail-composition--wide-"] .detail-media-group { width: var(--detail-width, 100%); grid-template-columns: 57% 28%; justify-content: space-between; }
.detail-module--pair.detail-composition--wide-right .detail-media-group,
.detail-module--pair.detail-composition--wide-right-low-left .detail-media-group,
.detail-module--pair.detail-composition--wide-right-high-left .detail-media-group { grid-template-columns: 28% 57%; }
.detail-composition--wide-left-low-right .detail-media--1,
.detail-composition--wide-right-high-left .detail-media--0,
.detail-composition--wide-right-low-left .detail-media--1,
.detail-composition--wide-left-high-right .detail-media--0 { margin-top: var(--detail-shift, 240px); }
.detail-module--trio .detail-media-group { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 9.3%; }
.detail-module--trio > .detail-group-caption { width: var(--detail-width, 100%); max-width: 100%; margin-left: max(0px, var(--detail-offset, 0%)); }
.detail-module--grid .detail-media-group { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.detail-module--mosaic .detail-media-group { position: relative; grid-template-columns: repeat(7, minmax(0, 1fr)); column-gap: 8px; row-gap: 8px; align-content: start; min-height: calc(var(--detail-shift, 240px) + 38vw); }
.detail-module--mosaic .detail-media--0 { grid-column: 1; grid-row: 1; }
.detail-module--mosaic .detail-media--1 { grid-column: 2; grid-row: 1; }
.detail-module--mosaic .detail-media--2 { grid-column: 1; grid-row: 2; }
.detail-module--mosaic .detail-media--3 { grid-column: 2; grid-row: 2; }
.detail-module--mosaic .detail-media--4 { position: absolute; left: calc(43% + 2px); top: var(--detail-shift, 240px); width: calc(57% - 2px); }
.detail-module--mosaic .detail-group-caption { grid-column: 1 / 3; grid-row: 3; }
.detail-module--mosaic .detail-group-caption { margin-top: 8px; }
.detail-module--large .detail-media-group { width: min(var(--detail-width, 100%), 100%); }
.detail-media { margin: 0; min-width: 0; }
.detail-media-frame { width: 100%; overflow: hidden; background: #e2e2e2; }
.detail-media-frame img, .detail-media-frame video { display: block; width: 100%; height: auto; object-fit: cover; object-position: center var(--detail-position, 50%); }
.detail-media.has-ratio .detail-media-frame { aspect-ratio: var(--detail-aspect); }
.detail-media.has-ratio img, .detail-media.has-ratio video { height: 100%; }
.detail-media figcaption, .detail-group-caption { margin-top: 16px; font-size: 12px; line-height: 1.2; text-transform: uppercase; }
.detail-group-caption { width: 100%; }
.detail-caption-index { display: inline-block; min-width: 42px; }
.detail-media-empty { display: grid; place-items: center; min-height: 220px; padding: 20px; background: var(--dels-bg); color: var(--dels-ink); font-size: 13px; text-align: center; }
.detail-module--large .detail-media-frame { max-height: none; }
.detail-module--large .detail-media.has-ratio .detail-media-frame { max-height: 160svh; }
.detail-variant--staggered .detail-media--1 { margin-top: 15vw; }
.detail-variant--staggered .detail-media--2 { margin-top: 7vw; }
.detail-horizontal-pin { position: sticky; top: 60px; height: calc(100svh - 60px); min-height: 540px; display: flex; flex-direction: column; justify-content: center; padding-bottom: 16px; overflow: hidden; }
.detail-module--horizontal { position: relative; height: calc(100svh + var(--detail-travel, 0px)); padding: 0; }
.detail-horizontal-heading { margin: 0 var(--dels-edge) 14px; font-size: 12px; text-transform: uppercase; }
.detail-horizontal-viewport { width: 100%; overflow: hidden; }
.detail-horizontal-rows { display: grid; gap: 8px; width: max-content; }
.detail-horizontal-row { display: flex; gap: 8px; width: max-content; will-change: transform; }
.detail-horizontal-row .detail-media { flex: 0 0 auto; width: auto; height: min(34vw, 355px); aspect-ratio: var(--detail-card-ratio, 2/3); }
.detail-horizontal-row .detail-media-frame { width: 100%; height: 100%; aspect-ratio: auto !important; }
.detail-horizontal-row img, .detail-horizontal-row video { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.detail-horizontal-row .detail-media figcaption { display: none; }
.detail-next { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 224px; margin: 320px var(--dels-edge) 16px; color: inherit; text-decoration: none; overflow: hidden; }
.detail-next-label, .detail-next-title { display: block; width: calc(100% - 220px); font-size: clamp(64px, 6vw, 92px); line-height: .9; letter-spacing: -.055em; text-transform: lowercase; }
.detail-next-media { position: absolute; right: 0; top: 0; width: 195px; height: 224px; overflow: hidden; transition: transform .5s cubic-bezier(.22,1,.36,1); }
.detail-next-media img, .detail-next-media video { display: block; width: 100%; height: 100%; object-fit: cover; }
.detail-next:hover .detail-next-media { transform: translateY(-8px); }
.detail-line { display: block; overflow: hidden; padding-bottom: .09em; margin-bottom: -.09em; }
.detail-line > span { display: block; }
.detail-js .detail-line > span { transform: translateY(110%); transition: transform 1.05s cubic-bezier(.22,1,.36,1); }
.detail-js .is-visible .detail-line > span { transform: translateY(0); }
.detail-js .detail-line:nth-child(2) > span { transition-delay: .08s; }
.detail-js .detail-line:nth-child(3) > span { transition-delay: .16s; }
.detail-js .detail-line:nth-child(4) > span { transition-delay: .24s; }
.detail-js .detail-media-frame { clip-path: polygon(0 0,100% 0,100% 0,0 0); transition: clip-path 1.85s cubic-bezier(.25,.1,.25,1); }
.detail-js .detail-media-frame.is-visible { clip-path: polygon(0 0,100% 0,100% 100%,0 100%); }
.detail-js .detail-module--pair .detail-media--1 .detail-media-frame,
.detail-js .detail-module--trio .detail-media--1 .detail-media-frame,
.detail-js .detail-module--mosaic .detail-media--1 .detail-media-frame { transition-delay: .08s; }
.detail-js .detail-module--trio .detail-media--2 .detail-media-frame,
.detail-js .detail-module--mosaic .detail-media--2 .detail-media-frame { transition-delay: .16s; }
.detail-js .detail-module--mosaic .detail-media--3 .detail-media-frame { transition-delay: .24s; }
.detail-js .detail-module--mosaic .detail-media--4 .detail-media-frame { transition-delay: .12s; }
.detail-js .detail-subheading { opacity: 0; transform: translateY(100%); transition: opacity .8s ease, transform .8s cubic-bezier(.22,1,.36,1); }
.detail-js .detail-subheading.is-visible { opacity: 1; transform: none; }
.detail-transitioning .detail-opening-media,
.detail-transitioning .detail-opening h1 { visibility: hidden; }
.detail-transitioning .detail-opening-meta { opacity: 0; }
.detail-transition-layer { position: fixed; inset: 0; z-index: 9; pointer-events: none; overflow: hidden; }
.detail-transition-media { position: absolute; overflow: hidden; will-change: left, top, width, height; }
.detail-transition-media > img,
.detail-transition-media > video { display: block; width: 100%; height: 100%; object-fit: cover; }
.detail-transition-title { position: absolute; margin: 0; color: var(--dels-ink); font-family: inherit; font-weight: 400; overflow-wrap: anywhere; will-change: left, top, width, font-size; }
@media (max-width: 700px) {
  .detail-page { padding-top: 104px; }
  .detail-opening { display: flex; flex-direction: column; min-height: 0; padding: 0 var(--dels-edge); gap: 0; }
  .detail-opening-right { display: contents; }
  .detail-opening-media { order: 0; height: auto; min-height: 0; aspect-ratio: .8; }
  .detail-opening-left { order: 1; }
  .detail-opening-left-inner { position: static; display: block; height: auto; min-height: 0; padding: 19px 0 0; }
  .detail-opening h1 { margin: 0 0 165px; max-width: 100%; font-size: clamp(48px, 13.85vw, 54px); line-height: 1.24; }
  .detail-opening h1 .detail-line + .detail-line { margin-top: 0; }
  .detail-opening-meta { font-size: 12px; }
  .detail-opening-intro { order: 2; min-height: 0; padding: 100px 0 120px; font-size: 27px; }
  .detail-module { margin-top: calc(var(--detail-before, 0px) * .55); margin-bottom: calc(var(--detail-after, 0px) * .55); padding: 0 var(--dels-edge); }
  .detail-editorial, .detail-media-group { width: 100%; margin-left: 0; }
  .detail-editorial h2, .detail-editorial h3, .detail-editorial > p:first-of-type { font-size: clamp(22px, calc(var(--detail-text-size) * .62), 72px); }
  .detail-richtext { font-size: 18px; }
  .detail-module--single .detail-media-group { width: 100%; }
  .detail-module--pair .detail-media-group, .detail-module--grid .detail-media-group { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .detail-module--pair[class*="detail-composition--wide-"] .detail-media-group { display: flex; flex-direction: column; align-items: stretch; }
  .detail-module--pair[class*="detail-composition--wide-"] .detail-media--0 { width: 49%; }
  .detail-module--pair[class*="detail-composition--wide-"] .detail-media--1 { width: calc(100% - 54px); margin-left: auto; }
  .detail-module--pair.detail-composition--wide-left .detail-media--0,
  .detail-module--pair.detail-composition--wide-left-low-right .detail-media--0,
  .detail-module--pair.detail-composition--wide-left-high-right .detail-media--0 { width: calc(100% - 54px); }
  .detail-module--pair.detail-composition--wide-left .detail-media--1,
  .detail-module--pair.detail-composition--wide-left-low-right .detail-media--1,
  .detail-module--pair.detail-composition--wide-left-high-right .detail-media--1 { width: 49%; }
  .detail-composition--wide-left-low-right .detail-media--1,
  .detail-composition--wide-right-low-left .detail-media--1 { margin-top: 96px; }
  .detail-composition--wide-left-high-right .detail-media--0,
  .detail-composition--wide-right-high-left .detail-media--0 { margin-top: 0; }
  .detail-module--mosaic .detail-media-group { width: 100%; min-height: 0; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .detail-module--mosaic .detail-media--4 { position: static; grid-column: 1 / -1; grid-row: 4; width: calc(100% - 64px); margin: 80px 0 0 auto; }
  .detail-module--mosaic .detail-group-caption { grid-column: 1 / 3; grid-row: 3; align-self: start; }
  .detail-module--trio .detail-media-group { display: flex; gap: 48px; width: calc(100vw - var(--dels-edge)); max-width: none; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; scroll-snap-type: x proximity; touch-action: pan-x; }
  .detail-module--trio .detail-media { flex: 0 0 112px; scroll-snap-align: start; }
  .detail-module--trio > .detail-group-caption { width: auto; max-width: none; margin-left: 0; }
  .detail-variant--staggered .detail-media--1, .detail-variant--staggered .detail-media--2 { margin-top: 0; }
  .detail-module--horizontal { height: auto !important; padding: 0; }
  .detail-horizontal-pin { position: static; display: block; height: auto; min-height: 0; padding: 34px 0 0; }
  .detail-horizontal-heading { margin-bottom: 22px; }
  .detail-horizontal-viewport { overflow-x: auto; overflow-y: hidden; scrollbar-width: none; touch-action: pan-x; }
  .detail-horizontal-rows { gap: 6px; padding: 0 var(--dels-edge); }
  .detail-horizontal-row { gap: 4px; transform: none !important; }
  .detail-horizontal-row .detail-media { height: 153px; }
  .detail-next { display: block; min-height: 0; margin-top: 160px; margin-bottom: 8px; }
  .detail-next-label, .detail-next-title { width: 100%; font-size: clamp(46px, 13vw, 58px); line-height: .93; }
  .detail-next-media { position: relative; display: block; width: 66%; height: auto; aspect-ratio: 1 / 1.14; margin: 106px 0 0 auto; }
}
@media (prefers-reduced-motion: reduce) { .detail-js .detail-line > span { transform: none; transition: none; } .detail-js .detail-media-frame { clip-path: none; transition: none; } .detail-js .detail-subheading { opacity: 1; transform: none; transition: none; } .detail-next-media { transform: none; transition: none; } }

/* Preview crop and its travel frame have independent geometry. */
.detail-next-media img,.detail-next-media video { transform: scale(1.4); transition: transform .5s cubic-bezier(.22,1,.36,1); }
.detail-next:hover .detail-next-media img,.detail-next:hover .detail-next-media video { transform: translateY(4px) scale(1.4); }

@media(min-width:701px){
 .detail-editorial-master .detail-opening{min-height:calc(100svh + 312px);}
 .detail-editorial-master .detail-opening-intro{min-height:388px;padding-top:72px;}
 .detail-editorial-master .detail-module--trio .detail-media-group{column-gap:9.65%;}
}

.detail-next-title { text-transform:none; }

@media(max-width:700px){
 .detail-next:hover .detail-next-media{transform:none;}
 .detail-next:hover .detail-next-media img,.detail-next:hover .detail-next-media video{transform:scale(1.4);}
}

/* Home arrival uses the authored heading and its existing line geometry. */
.dels-route-measure{position:fixed;inset:0;visibility:hidden;pointer-events:none;overflow:hidden;z-index:-1;}
.dels-route-measure > main{width:100%;}
.dels-home-case .detail-opening h1{visibility:visible;}
.dels-home-case .detail-opening h1 .detail-line > span{transition:none;}

body.dels-home-case{overflow:hidden;touch-action:none;}

/* Intentional two-line project titles retain the existing reveal masks. */
.detail-opening h1.detail-title-two-lines .detail-line > span { white-space:nowrap; }
@media(min-width:701px){.detail-opening-left-inner.detail-title-long{height:auto;min-height:calc(100svh - 100px);}}

/* Next Case shares the destination's editorial lines; its glyphs remain unclipped. */
.detail-next-title { padding-bottom:.2em; overflow:visible; }
.detail-next-line { display:block; white-space:nowrap; }
.detail-transition-title-line { position:absolute; white-space:pre; overflow:visible; }

.detail-transitioning:not(.dels-home-case) .detail-opening h1 .detail-line > span { transform:none; transition:none; }

/* Lowercase is presentation only; stored titles and accessible names remain intact. */
.detail-opening h1, .detail-next-title, .detail-transition-title, .project-label { text-transform:lowercase; }
.detail-opening h1.detail-title-editorial .detail-line > span { white-space:nowrap; }

/* Preview frame measured against the responsive grid; media remains independently clipped. */
@media(min-width:701px){
  .detail-next { min-height:max(224px,calc((100vw - 80px) * .1644285714 + 17.2px)); }
  .detail-next-media { width:calc((100% - 48px) / 7);height:auto;aspect-ratio:1 / 1.151;top:auto;bottom:17.2px; }
}
@media(max-width:700px){
  .detail-next-media { width:calc((200% - 8px) / 3);aspect-ratio:1 / 1.151; }
}
.detail-next-media img, .detail-next-media video { transform-origin:50% 10%; }

/* Tablet opening: presentation media, title, metadata, then introduction. */
@media (min-width:768px) and (max-width:1024px) {
  .detail-page { padding-top:126px; }
  .detail-page .detail-opening { grid-template-columns:repeat(2,minmax(0,1fr)); min-height:0; row-gap:32px; }
  .detail-opening-right { display:contents; }
  .detail-opening-media { grid-column:2; grid-row:1; height:auto; min-height:0; aspect-ratio:4 / 5; }
  .detail-opening-left { grid-column:2; grid-row:2; }
  .detail-opening-left-inner, .detail-opening-left-inner.detail-title-long { position:static; display:block; height:auto; min-height:0; padding:0; }
  .detail-page .detail-opening-intro { grid-column:2; grid-row:3; min-height:0; padding:48px 0 96px; }
}

/* Tablet media rhythm uses the saved spacing values without changing editorial data. */
@media (min-width:768px) and (max-width:1024px) {
  .detail-content .detail-module { margin-top:clamp(0px,calc(var(--detail-before,0px) / 3),96px); margin-bottom:clamp(0px,calc(var(--detail-after,0px) / 3),96px); }
  .detail-content .detail-media-group { width:100%; max-width:100%; margin-left:0; }
  .detail-content .detail-module--large .detail-media.has-ratio .detail-media-frame { max-height:none; }
  .detail-content .detail-module--pair[class*="detail-composition--wide-"] .detail-media-group { width:100%; grid-template-columns:63% 33%; }
  .detail-content .detail-module--pair.detail-composition--wide-right .detail-media-group,
  .detail-content .detail-module--pair.detail-composition--wide-right-low-left .detail-media-group,
  .detail-content .detail-module--pair.detail-composition--wide-right-high-left .detail-media-group { grid-template-columns:33% 63%; }
  .detail-content .detail-composition--wide-left-low-right .detail-media--1,
  .detail-content .detail-composition--wide-right-high-left .detail-media--0,
  .detail-content .detail-composition--wide-right-low-left .detail-media--1,
  .detail-content .detail-composition--wide-left-high-right .detail-media--0 { margin-top:clamp(0px,calc(var(--detail-shift,240px) / 3),96px); }
  .detail-content .detail-module--trio .detail-media-group { display:flex; gap:24px; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; scroll-snap-type:x proximity; scrollbar-width:thin; touch-action:pan-x; }
  .detail-content .detail-module--trio .detail-media { flex:0 0 40%; scroll-snap-align:start; }
  .detail-content .detail-module--trio > .detail-group-caption { width:100%; margin-left:0; }
  .detail-content .detail-variant--staggered .detail-media--1 { margin-top:8vw; }
  .detail-content .detail-variant--staggered .detail-media--2 { margin-top:4vw; }
  .detail-content .detail-module--mosaic .detail-media-group { grid-template-columns:repeat(4,minmax(0,1fr)); min-height:0; }
  .detail-content .detail-module--mosaic .detail-media--4 { left:calc(50% + 4px); width:calc(50% - 4px); top:clamp(0px,calc(var(--detail-shift,240px) / 3),96px); }
  .detail-horizontal-row .detail-media { height:min(34vw,calc((100svh - 140px) / 2)); }
  .detail-next { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:1fr auto; gap:0 8px; min-height:0; padding-top:8px; margin-top:80px; }
  .detail-next-label, .detail-next-title { grid-column:1; width:100%; }
  .detail-next-label { grid-row:1; align-self:end; }
  .detail-next-title { grid-row:2; }
  .detail-next-media { position:relative; grid-column:2; grid-row:1 / 3; align-self:end; top:auto; right:auto; bottom:auto; width:100%; height:auto; aspect-ratio:1 / 1.151; }
}

/* Mobile rhythm: module boundaries only; opening, media and captions retain their geometry. */
@media (max-width:700px) {
  .detail-content > .detail-module:is(.detail-module--single,.detail-module--large,.detail-module--pair,.detail-module--grid,.detail-module--mosaic) { margin-top:clamp(0px,calc(var(--detail-before,0px) * .25),80px); margin-bottom:clamp(0px,calc(var(--detail-after,0px) * .25),80px); }
  .detail-content > .detail-module:is(.detail-module--trio,.detail-module--horizontal) { margin-top:clamp(0px,calc(var(--detail-before,0px) * .3),96px); margin-bottom:clamp(0px,calc(var(--detail-after,0px) * .3),96px); }
  .detail-content > .detail-module--text { margin-top:clamp(0px,calc(var(--detail-before,0px) * .35),112px); margin-bottom:clamp(0px,calc(var(--detail-after,0px) * .35),112px); }
  .detail-content > .detail-module:first-child { margin-top:clamp(0px,calc(var(--detail-before,0px) * .12),24px); }
}
