.cinema-stage{height:75svh;min-height:540px;max-height:820px;position:relative;background:#153f35;color:#fff}
/* Contacto fotográfico compacto: todas las miniaturas visibles, sin carrusel. */
.gallery-preview{padding-top:20px;padding-bottom:8px}
.photo-strip.photo-contact-sheet{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;max-width:960px;overflow:visible;scroll-snap-type:none;padding:4px 0 10px}
.photo-contact-sheet .preview-thumb{min-width:0;border-radius:2px;transition:transform .2s;overflow:hidden}
.photo-contact-sheet .preview-thumb img{aspect-ratio:3/2;object-fit:cover}
.photo-contact-sheet .preview-thumb:hover{transform:translateY(-3px)}
.photo-contact-sheet .preview-thumb:hover img{transform:none}
.gallery-fold>summary{padding:28px 0}
.gallery-heading h2{font-size:clamp(1.9rem,3.1vw,3rem)}
.gallery-heading>.eyebrow{margin-bottom:14px}
@media(max-width:680px){.photo-strip.photo-contact-sheet{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.gallery-preview{padding-top:16px}.gallery-fold>summary{gap:18px}}
@media(prefers-reduced-motion:reduce){.photo-contact-sheet .preview-thumb{transition:none}}
.cinema-title h1 .title-phrase{display:block;transform-origin:left center;transition:color .22s,transform .22s}
/* Inclinación tipográfica sin cambiar el ancho ni provocar saltos de línea. */
@media(hover:hover) and (pointer:fine){.cinema-title h1 .title-phrase:hover{color:var(--lime);transform:skewX(-8deg)}}
.intro-statement{padding-top:64px;padding-bottom:20px}
.intro-statement-grid{display:grid;grid-template-columns:180px minmax(0,1fr);gap:48px;align-items:start}
.intro-statement-grid>.eyebrow{color:var(--green);font-size:.75rem;padding-top:10px;border-top:3px solid var(--lime);max-width:160px}
.intro-statement-copy h2{max-width:930px;font-size:clamp(1.65rem,2.5vw,2.25rem);font-weight:550;line-height:1.3;letter-spacing:-.035em;color:var(--green)}
.intro-statement-copy>p{margin:22px 0 0;max-width:760px;font-size:1.05rem;line-height:1.6}
.intro-statement .principles{margin-top:36px;padding:20px 0 26px}
@media(max-width:800px){.intro-statement-grid{grid-template-columns:130px minmax(0,1fr);gap:28px}}
@media(max-width:680px){.intro-statement{padding-top:42px;padding-bottom:0}.intro-statement-grid{grid-template-columns:1fr;gap:22px}.intro-statement-grid>.eyebrow{margin-bottom:0}.intro-statement-copy h2{font-size:1.65rem}.intro-statement-copy>p{font-size:1rem}.intro-statement .principles{margin-top:28px}}
@media(prefers-reduced-motion:reduce){.cinema-title h1 .title-phrase{transition:none}}
.cinema-stage>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 62%}
.cinema-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,27,20,.63),rgba(8,27,20,.18) 55%,transparent 82%),linear-gradient(0deg,rgba(8,27,20,.50),transparent 55%,rgba(8,27,20,.23))}
.cinema-content{position:relative;height:100%;display:flex;flex-direction:column;justify-content:space-between;padding-top:30px;padding-bottom:48px}
.cinema-content>.eyebrow{display:flex;justify-content:space-between;gap:30px;font-size:.75rem;font-weight:500;letter-spacing:.1em;color:#fff}
.cinema-content>.eyebrow span:last-child{text-align:right}
.cinema-title{max-width:790px}
.cinema-title h1{font-size:clamp(2.6rem,4.65vw,4.6rem);line-height:1.08;letter-spacing:-.05em;font-weight:650;text-wrap:balance}
.cinema-title h1 span{color:#f0e9dc}
.cinema-title .text-link{display:inline-flex;margin-top:28px;color:#fff;border-color:#ffffff80;padding:10px 0;gap:36px;font-size:.9rem}
.cinema-title .text-link:hover{border-color:var(--lime);color:var(--lime);text-decoration:none}
.cinema-title .text-link:focus-visible{outline-color:var(--lime)}
.cinema-caption>div{display:flex;justify-content:space-between;gap:20px;padding-top:15px;font-size:.7rem;letter-spacing:.04em;color:#526454}
.cinema-intro .hero-bottom{margin:34px 0 20px;display:block}
.cinema-intro .hero-bottom p{max-width:860px;font-size:1.2rem;line-height:1.55}
.cinema-intro .hero-bottom p strong{font-weight:600}
.cinema-intro .hero-support{font-size:1rem;margin-top:10px}
.cinema-intro .principles{padding:18px 0 26px}
@media(max-width:680px){
.cinema-stage{height:68svh;min-height:480px;max-height:680px}
.cinema-stage>img{object-position:61% center}
.cinema-content{padding-top:24px;padding-bottom:32px}
.cinema-content>.eyebrow{display:block;font-size:.65rem;line-height:1.6;max-width:300px}
.cinema-content>.eyebrow span{display:block}
.cinema-content>.eyebrow span:last-child{text-align:left;margin-top:8px}
.cinema-title{max-width:94%}
.cinema-title h1{font-size:clamp(2rem,7.4vw,3rem)}
.cinema-caption>div{display:block;font-size:.65rem}
.cinema-caption span{display:block;margin-bottom:4px}
.cinema-intro .hero-bottom p{font-size:1.05rem}
}


/* Cambiar el orden de los proyectos sólo en móvil */
@media (max-width: 680px) {
  #proyectos .project {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 18px;
  }

  #proyectos .project-copy {
    display: contents;
  }

  #proyectos .project-copy > * {
    order: 0;
    margin: 0;
  }

  #proyectos .project > .project-image {
    order: 1;
    margin: 6px 0;
  }

  #proyectos .project-copy > .role {
    order: 2;
  }

  #proyectos .project-copy > .tags {
    order: 3;
  }
  #proyectos .project-copy > a {
    order: 4;
  }
}

/* Distribuir los temas a lo ancho en todos los tamaños */
.intro-statement .principles {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px 24px;
}