.project-hero__image[hidden], .project-embed__placeholder[hidden] { display: none; }
[data-project-hero] .project-hero__content { flex-direction: column; justify-content: flex-end; align-items: flex-start; }
.project-hero__controls { display: flex; align-items: center; gap: 16px; margin-top: 22px; }
.project-hero__controls button { min-width: 44px; min-height: 44px; border: 1px solid currentColor; background: transparent; color: inherit; cursor: pointer; }
.project-hero__content > .button { margin-top: 20px; }
.project-gallery__grid--right a:nth-child(n) { grid-column: span 1; }
.project-gallery__grid--right a:nth-child(3) { grid-column: span 2; }
.project-embed { position: relative; min-height: clamp(300px, 42vw, 640px); background: var(--primario); color: white; }
.project-embed--map { min-height: clamp(280px, 30vw, 460px); }
.project-embed__placeholder { min-height: inherit; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; padding: 32px 20px; text-align: center; }
.project-embed__placeholder p { font-size: clamp(20px, 2.5vw, 30px); margin: 0; }
.project-embed__placeholder a { text-decoration: underline; }
.project-embed__loader { position: relative; display: block; width: 42px; height: 42px; border: 2px solid white; overflow: hidden; animation: project-loader-turn 4s linear infinite; }
.project-embed__loader > span { position: absolute; inset: 0; background: white; transform-origin: bottom; animation: project-loader-fill 4s ease-in-out infinite; }
.project-embed__progress { display: block; width: min(150px, 46vw); height: 3px; overflow: hidden; background: rgba(255, 255, 255, .22); }
.project-embed__progress > span { display: block; width: 40%; height: 100%; background: white; animation: project-loader-progress 2s ease-in-out infinite; }
@keyframes project-loader-turn { to { transform: rotate(360deg); } }
@keyframes project-loader-fill { 0%, 15%, 100% { transform: scaleY(0); } 50%, 70% { transform: scaleY(1); } }
@keyframes project-loader-progress { from { transform: translateX(-110%); } to { transform: translateX(360%); } }
.project-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.project-embed__close { position: absolute; right: 12px; top: 12px; min-height: 44px; padding: 10px 16px; background: white; color: #002b46; border: 1px solid #002b46; cursor: pointer; z-index: 1; }
.project-units { padding: clamp(40px, 5vw, 72px) clamp(18px, 5vw, 72px); }
.project-story + .project-story,
.project-story + .project-units,
.project-story + .project-cta,
.project-units + .project-story,
.project-units + .project-units,
.project-units + .project-cta,
.project-cta + .project-story,
.project-cta + .project-units,
.project-cta + .project-cta { padding-top: 0; }
.project-units h2 { font-size: clamp(30px, 4vw, 48px); font-weight: 400; }
.project-units__scroll { overflow-x: auto; }
.project-units table { width: 100%; border-collapse: collapse; min-width: 680px; }
.project-units th, .project-units td { padding: 16px 12px; border-bottom: 1px solid var(--line); text-align: left; }
.project-units caption { text-align: left; margin-bottom: 16px; }
.project-units a { text-decoration: underline; }
.project-metric strong, .project-story__copy, .project-cta { overflow-wrap: anywhere; }
.project-video-dialog { width: min(1100px, 96vw); padding: 16px; border: 0; background: var(--primario); }
.project-video-dialog::backdrop { background: #000c; }
.project-video-dialog iframe { display: block; width: 100%; aspect-ratio: 16/9; border: 0; margin-top: 12px; }
.project-video-dialog button { min-height: 44px; padding: 8px 16px; }
.project-preview-notice { padding: 16px; text-align: center; background: #fff0bd; color: #332500; }
.has-project-lightbox { overflow: hidden; }
.project-lightbox { width: 100vw; max-width: none; height: 100vh; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(0, 22, 36, .96); color: white; }
.project-lightbox::backdrop { background: rgba(0, 22, 36, .96); }
.project-lightbox__frame { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-rows: auto minmax(0, 1fr) auto; gap: 16px; width: 100%; height: 100%; padding: clamp(14px, 3vw, 36px); box-sizing: border-box; align-items: center; }
.project-lightbox__image { grid-column: 2; grid-row: 2; display: block; max-width: 100%; max-height: calc(100vh - 130px); margin: auto; object-fit: contain; }
.project-lightbox__close, .project-lightbox__previous, .project-lightbox__next { min-width: 44px; min-height: 44px; padding: 10px 14px; border: 1px solid rgba(255,255,255,.72); background: #002b46; color: white; font: inherit; cursor: pointer; }
.project-lightbox__close { grid-column: 1 / -1; grid-row: 1; justify-self: end; }
.project-lightbox__previous { grid-column: 1; grid-row: 2; }
.project-lightbox__next { grid-column: 3; grid-row: 2; }
.project-lightbox__caption { grid-column: 1 / -1; grid-row: 3; margin: 0; text-align: center; }
.project-lightbox button:focus-visible { outline: 3px solid white; outline-offset: 3px; }
.project-lightbox button[hidden] { display: none; }
@media (max-width: 700px) {
    .project-lightbox__frame { grid-template-columns: 1fr 1fr; grid-template-rows: auto minmax(0, 1fr) auto auto; }
    .project-lightbox__image { grid-column: 1 / -1; grid-row: 2; max-height: calc(100vh - 190px); }
    .project-lightbox__previous { grid-column: 1; grid-row: 3; justify-self: start; }
    .project-lightbox__next { grid-column: 2; grid-row: 3; justify-self: end; }
    .project-lightbox__caption { grid-row: 4; }
}
@media (max-width: 700px) {
    .project-gallery__grid--right a:nth-child(n) { grid-column: auto; }
    .project-gallery__grid--right a:nth-child(3) { grid-column: span 2; }
}
@media (prefers-reduced-motion: reduce) {
    .project-detail *, .project-detail *::before, .project-detail *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* Automatic cover: crossfade with a gentle zoom, retaining the fallback image. */
[data-project-hero] .project-hero__image { opacity: 0; transform: scale(1.035); transition: opacity 1.2s ease-in-out, transform 4.5s ease-out; }
[data-project-hero] .project-hero__image.is-active { opacity: 1; transform: scale(1); }
.project-hero__video { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border: 0; z-index: -2; pointer-events: none; }
[data-project-hero] .project-hero__image { z-index: -3; }
.project-hero__controls { flex-wrap: wrap; }
.project-hero__controls [data-slide-pause] { padding-inline: 12px; }
.project-embed--map iframe { pointer-events: none; }
.project-embed--map.is-interactive iframe { pointer-events: auto; }
.project-embed__fallback { position: absolute; bottom: 12px; right: 12px; z-index: 2; padding: 8px 12px; background: #002b46; color: white; text-decoration: underline; font-size: 13px; }
.project-embed .projects-map__gate { top: 16px; right: 16px; }
@media (prefers-reduced-motion: reduce) {
    [data-project-hero] .project-hero__image { transition: none; transform: none; }
}

.project-hero__video { opacity: 0; transition: opacity 800ms ease; }
.project-hero__video.is-playing { opacity: 1; }
