/* Identidad de la instalación. Los colores siguen siendo editables en el panel. */
.navbar { min-height: 88px; border-bottom: 1px solid var(--line); }
.brand { gap: 9px; }
.brand::before { content: '✳'; color: var(--warm); font-size: 2rem; line-height: 1; }
.brand span { font-size: 1.25rem; font-weight: 800; letter-spacing: -.06em; }
.language-switch { margin-left: auto; }
.language-switch button.active { color: #25261f; }
.site-header { backdrop-filter: none; background: var(--header-bg); }
.site-header.is-scrolled { background: var(--header-bg); }
.btn { font-weight: 700; }
.btn:hover { border-color: var(--warm); }
.btn-primary, .btn-acid { color: #25261f; }
.home-hero { padding-top: clamp(65px, 9vw, 128px); padding-bottom: clamp(64px, 9vw, 128px); }
.hero-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 65px; }
.hero-title { font-size: clamp(5rem, 10.4vw, 9rem); letter-spacing: -.085em; line-height: 1.06; max-width: none; }
.hero-title br { display: none; }
.hero-title .accent:not(:empty) { display: block; }
.hero-copy .kicker { color: var(--muted); margin-bottom: 20px; }
.hero-copy .lede { max-width: 31ch; margin-top: 26px; line-height: 1.65; }
.hero-actions { margin-top: 30px; }
.hero-art { max-width: 500px; }
.hero-art .media-frame { position: relative; overflow: hidden; border: 0; transform: rotate(-3deg); }
.hero-art [data-hero-art] { max-height: none; object-fit: cover; }
.work-head { padding-top: 24px; border-top: 1px solid var(--line); margin-bottom: 30px; }
.work-head .kicker { color: var(--muted); }
.work-title { font-size: clamp(2.25rem, 4.5vw, 4rem); letter-spacing: -.06em; margin-top: 14px; }
.work-head p { max-width: 32ch; font-size: .92rem; }
.feature-card { background: transparent; border-radius: var(--radius); border: 0; }
.feature-media { aspect-ratio: 4/3; border-radius: var(--radius); background: var(--panel); }
.feature-media img { object-fit: cover; }
.feature-caption { padding: 16px 0 10px; }
.feature-caption strong { font-size: .94rem; font-weight: 650; }
.feature-caption span { font-family: var(--font-mono); font-size: .65rem; text-transform: uppercase; letter-spacing: .09em; }
.feature-card:hover { transform: translateY(-4px); }
.feature-card:focus-visible { outline: 2px solid var(--warm); outline-offset: 7px; }
.gallery-item, .gallery-item img, .filter-btn, .about-art, .about-portrait { border-radius: var(--radius); }
.gallery-trigger { aspect-ratio: 4/3; background: var(--panel); }
.gallery-trigger img, .gallery-trigger .work-preview-video { background: var(--panel); }
.filter-btn.active { color: #fffef8; }
.page-intro .kicker, .contact-copy .kicker { color: var(--muted); }
.page-title, .contact-copy h1 { letter-spacing: -.065em; }
.site-footer { padding-top: 36px; padding-bottom: 36px; }
.footer-title { font-size: 1.4rem; letter-spacing: -.055em; }
.footer-grid { align-items: start; }
.contact-layout:has(.contact-eye[hidden]) { grid-template-columns: minmax(0, 680px); }
.contact-copy { min-height: 34vh; }
.about-editorial:has(.about-portrait[hidden]) { grid-template-columns: minmax(0, 760px); }
.about-side:has(.about-portrait[hidden]) { display: none; }
.about-art { background: var(--panel); }
.about-art img { object-fit: contain; }
@media (max-width: 1000px) {
  .hero-grid { gap: 35px; }
  .hero-title { font-size: clamp(5rem, 11vw, 7rem); }
}
@media (max-width: 840px) {
  .nav-links { visibility: hidden; background: var(--header-bg); }
  .nav-links.open { visibility: visible; }
}
@media (max-width: 700px) {
  .hero-grid { grid-template-columns: 1fr; gap: 44px; }
  .hero-art { justify-self: stretch; max-width: 100%; padding: 6px; }
  .hero-art .media-frame { transform: rotate(-2deg); }
  .hero-title { font-size: clamp(4.5rem, 19vw, 7.5rem); }
  .home-hero { padding-top: 48px; padding-bottom: 60px; }
  .hero-copy .lede { max-width: 35ch; }
  .work-head p { margin-top: 18px; }
  .navbar { min-height: 75px; gap: 15px; }
  .feature-grid { grid-template-columns: 1fr; gap: 26px; }
  .nav-links { background: var(--header-bg); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-art .media-frame { transform: none; }
}
