/* ==========================================================================
   Inner pages: Editions, Events, Artists, Access, detail pages, offices
   ========================================================================== */

.page-hero--short { min-height: 42vh; }
.page-hero__links { margin-top: 1.5rem; }
.page-hero__crumb { margin-bottom: 1rem; font-size: var(--step--1); letter-spacing: 0.08em; text-transform: uppercase; }
.page-hero__crumb a { color: var(--sand-light); }
.page-hero__crumb a:hover { color: var(--ivory); }

/* ---------- Editions grid ---------- */
.edition-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.5rem, 3vw, 2.5rem) clamp(1.25rem, 2.5vw, 2rem); }
.edition-card { display: flex; flex-direction: column; gap: 0.9rem; color: inherit; text-decoration: none; }
.edition-card__media { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--vevva-blue-deep); border-radius: var(--radius-sm); }
.edition-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s var(--ease); }
.edition-card:hover .edition-card__media img, .edition-card:focus-visible .edition-card__media img { transform: scale(1.05); }
.edition-card__name { font-family: var(--font-display); font-size: var(--step-1); line-height: 1.25; text-align: center; }
.edition-card:hover .edition-card__name { color: #7a5f2e; }

/* ---------- Lightbox ---------- */
.lb { position: fixed; inset: 0; z-index: 400; background: rgba(5, 12, 23, 0.82); display: flex; align-items: center; justify-content: center; padding: clamp(0.5rem, 2vw, 1.5rem); }
.lb[hidden] { display: none; }
.lb__panel { position: relative; background: var(--ivory); color: var(--ink); width: 100%; max-width: 980px; max-height: 94vh; border-radius: var(--radius-md); overflow: hidden; display: flex; flex-direction: column; }
.lb__close { position: absolute; top: 0.6rem; right: 0.6rem; z-index: 5; width: 40px; height: 40px; border-radius: 50%; background: rgba(5, 12, 23, 0.7); color: var(--ivory); font-size: 1.6rem; line-height: 1; display: grid; place-items: center; }
.lb__close:hover { background: var(--vevva-blue); }
.lb__scroll { overflow-y: auto; overscroll-behavior: contain; max-height: 94vh; }
.lb__scroll .event-info { padding: clamp(1.25rem, 3vw, 2.25rem); }
.lb__more { padding: 0 clamp(1.25rem, 3vw, 2.25rem) clamp(1.5rem, 3vw, 2.25rem); }

/* ---------- Gallery ---------- */
.gal { background: var(--vevva-blue-deep); }
.gal__stage { position: relative; aspect-ratio: 16 / 10; display: grid; place-items: center; background: var(--vevva-blue-deep); }
.gal__main { max-width: 100%; max-height: 100%; width: 100%; height: 100%; object-fit: contain; }
.gal__nav { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border-radius: 50%; background: rgba(5, 12, 23, 0.6); color: var(--ivory); font-size: 1.8rem; line-height: 1; display: grid; place-items: center; transition: background 0.2s ease; }
.gal__nav:hover { background: rgba(5, 12, 23, 0.9); }
.gal__nav--prev { left: 0.75rem; }
.gal__nav--next { right: 0.75rem; }
.gal__count { position: absolute; bottom: 0.6rem; right: 0.75rem; font-size: 0.78rem; letter-spacing: 0.08em; color: var(--ivory); background: rgba(5, 12, 23, 0.6); padding: 0.25rem 0.7rem; border-radius: 999px; }
.gal__thumbs { display: flex; gap: 0.5rem; overflow-x: auto; padding: 0.6rem; scrollbar-width: thin; }
.gal__thumb { flex: 0 0 96px; aspect-ratio: 4 / 3; overflow: hidden; border: 2px solid transparent; opacity: 0.6; transition: opacity 0.2s ease, border-color 0.2s ease; }
.gal__thumb img { width: 100%; height: 100%; object-fit: cover; }
.gal__thumb:hover, .gal__thumb.is-active { opacity: 1; border-color: var(--sand); }
.detail-page .gal { border-radius: var(--radius-md); overflow: hidden; margin-bottom: clamp(1.5rem, 3vw, 2.5rem); }

/* ---------- Event / detail text ---------- */
.event-info { max-width: 78ch; }
.event-info__meta { font-size: var(--step--1); letter-spacing: 0.1em; text-transform: uppercase; color: #7a5f2e; font-weight: 600; margin-bottom: 0.6rem; }
.event-info__title { font-family: var(--font-display); font-weight: 500; font-size: var(--step-3); line-height: 1.15; margin-bottom: 1.25rem; }
.event-info__text { color: var(--ink-soft); line-height: 1.8; margin-bottom: 1rem; }
.event-info__text--lead { font-size: var(--step-1); color: var(--ink); }
.event-info__text a { border-bottom: 1px solid var(--sand); }
.event-info__details { margin-top: 1.75rem; border-top: 1px solid var(--line-on-cream); }
.event-info__details > div { display: grid; grid-template-columns: minmax(120px, 190px) 1fr; gap: 1rem; padding: 0.8rem 0; border-bottom: 1px solid var(--line-on-cream); }
.event-info__details dt { font-size: 0.74rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-soft); padding-top: 0.15rem; }
.event-info__details dd { margin: 0; font-weight: 500; }

/* ---------- Detail page shell ---------- */
.detail-page { background: var(--ivory); color: var(--ink); padding-block: calc(var(--header-h) + 2.25rem) clamp(4rem, 8vw, 6rem); min-height: 70vh; }
.detail-back { margin-bottom: 1.5rem; font-size: var(--step--1); letter-spacing: 0.08em; text-transform: uppercase; }
.detail-back a { border-bottom: 1px solid var(--sand); padding-bottom: 2px; }
.detail-subheading { font-family: var(--font-display); font-weight: 500; font-size: var(--step-2); margin: clamp(2.5rem, 5vw, 4rem) 0 1.5rem; }
.detail-subheading--small { font-size: var(--step-1); margin: 1.75rem 0 0.9rem; }
.detail-actions { margin-top: 2rem; }

/* ---------- Artists ---------- */
.artist-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(1.25rem, 3vw, 2.25rem); }
.artist-grid--small { grid-template-columns: repeat(4, 1fr); }
.artist-card { display: flex; flex-direction: column; gap: 0.35rem; color: inherit; }
.artist-card__media { display: block; aspect-ratio: 4 / 5; overflow: hidden; background: var(--vevva-blue-deep); border-radius: var(--radius-sm); margin-bottom: 0.65rem; }
.artist-card__media img { width: 100%; height: 100%; object-fit: cover; object-position: center top; transition: transform 0.6s var(--ease); }
.artist-card:hover .artist-card__media img { transform: scale(1.04); }
.artist-card__name { font-family: var(--font-display); font-size: var(--step-1); line-height: 1.25; }
.artist-card__tagline { font-size: var(--step--1); color: var(--ink-soft); }
.artist-profile { display: grid; grid-template-columns: minmax(240px, 380px) 1fr; gap: clamp(1.75rem, 5vw, 4rem); align-items: start; }
.artist-profile__media { background: var(--vevva-blue-deep); border-radius: var(--radius-sm); overflow: hidden; }
.artist-profile__media img { width: 100%; height: auto; display: block; }

/* ---------- Access & Experiences ---------- */
.access-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(1.25rem, 3vw, 2rem); }
.access-card { display: flex; flex-direction: column; gap: 0.5rem; color: inherit; }
.access-card__media { display: block; aspect-ratio: 4 / 5; overflow: hidden; background: var(--vevva-blue-deep); }
.access-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s var(--ease); }
.access-card:hover .access-card__media img { transform: scale(1.05); }
.access-card__name { font-family: var(--font-display); font-size: var(--step-1); margin-top: 0.4rem; }
.access-card__sub { font-size: var(--step--1); color: var(--ink-soft); }
.access-detail { background: var(--ivory); color: var(--ink); padding-block: clamp(3rem, 6vw, 5rem) clamp(4rem, 8vw, 6rem); }
.access-detail__intro { max-width: 70ch; font-size: var(--step-1); line-height: 1.7; }
.access-detail__intro p { margin-bottom: 1.1rem; }
.offer-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.offer-card { background: var(--cream); border: 1px solid var(--line-on-cream); border-radius: var(--radius-md); padding: 1.5rem; }
.offer-card__title { font-family: var(--font-display); font-weight: 500; font-size: var(--step-1); margin-bottom: 0.6rem; line-height: 1.25; }
.offer-card p { color: var(--ink-soft); font-size: var(--step--1); line-height: 1.7; }
.list-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; }
.list-card { background: var(--vevva-blue); color: var(--ivory); border-radius: var(--radius-md); padding: 1.5rem; }
.list-card__title { font-family: var(--font-display); font-weight: 500; font-size: var(--step-1); color: var(--sand-light); margin-bottom: 0.9rem; }
.list-card li { padding: 0.45rem 0; border-top: 1px solid var(--line-on-navy); font-size: var(--step--1); }

/* ---------- Cards linking to detail pages ---------- */
.project-card__main-img { display: block; }
.project-card__name a, .artwork-card__title a { color: inherit; }
.project-card__name a:hover, .artwork-card__title a:hover { color: #7a5f2e; }
.project-card__actions { display: inline-flex; gap: 0.6rem; flex-wrap: wrap; }
.artwork-card__artist a { border-bottom: 1px solid currentColor; }
.artwork-card__media { display: block; }
.artwork-card__footer { gap: 0.6rem; justify-content: space-between; flex-wrap: wrap; }

/* ---------- Homepage dynamic sections ---------- */
.home-grid { display: grid; gap: clamp(1.25rem, 3vw, 2rem); }
.home-grid--editions { grid-template-columns: repeat(3, 1fr); }
.home-grid--art { grid-template-columns: repeat(4, 1fr); }
.pillar-section--navy .edition-card__name { color: var(--ivory); }
.pillar-section--navy .edition-card:hover .edition-card__name { color: var(--sand-light); }
.home-grid--art .artwork-card__desc, .home-grid--art .artwork-card__meta { display: none; }
.home-grid--art .artwork-card__footer .btn:first-child { display: none; }
.home-more { text-align: center; margin-top: clamp(2rem, 4vw, 3rem); }
.pillar-section .project-grid { margin-top: 0; }

/* ---------- Contact + footer offices ---------- */
.contact-people { display: grid; gap: 1rem; margin: 1.5rem 0; }
.contact-person { display: flex; flex-direction: column; gap: 0.2rem; font-size: var(--step--1); }
.contact-person__name { font-family: var(--font-display); font-size: var(--step-1); color: var(--sand-light); }
.contact-person a, .contact-detail a { border-bottom: 1px solid var(--line-on-navy); width: fit-content; }
.contact-offices { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; margin-top: 1.75rem; padding-top: 1.75rem; border-top: 1px solid var(--line-on-navy); }
.contact-office__city, .site-footer__office-city { font-size: 0.74rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--sand-light); font-weight: 600; margin-bottom: 0.5rem; }
.contact-office address, .site-footer__office address { font-style: normal; font-size: var(--step--1); line-height: 1.7; }
.site-footer__contact { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; padding-block: 2rem; margin-bottom: 1.5rem; border-top: 1px solid var(--line-on-navy); }
.site-footer__office a { border-bottom: 1px solid var(--line-on-navy); }
.site-footer__office a:hover { color: var(--ivory); }

/* ---------- Responsive ---------- */
@media (max-width: 1000px) {
  .artist-grid, .access-grid, .list-grid, .home-grid--art { grid-template-columns: repeat(2, 1fr); }
  .offer-grid, .site-footer__contact { grid-template-columns: repeat(2, 1fr); }
  .edition-grid, .home-grid--editions { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .artist-profile { grid-template-columns: 1fr; }
  .contact-offices { grid-template-columns: 1fr; }
  .event-info__details > div { grid-template-columns: 1fr; gap: 0.2rem; }
  .gal__stage { aspect-ratio: 4 / 3; }
  .gal__thumb { flex-basis: 72px; }
}
@media (max-width: 560px) {
  .edition-grid, .home-grid--editions, .artist-grid, .access-grid, .list-grid, .offer-grid, .site-footer__contact, .home-grid--art { grid-template-columns: 1fr; }
  .artist-grid--small { grid-template-columns: repeat(2, 1fr); }
}

/* Cards reused on dark homepage sections keep their own dark-on-cream text */
.project-card, .artwork-card { color: var(--ink); }
a.media-card { display: block; color: inherit; }
.home-grid--art .artwork-card__footer { justify-content: flex-start; }

/* Homepage tiles: photo + name only */
.home-grid--tiles { grid-template-columns: repeat(4, 1fr); }
.edition-card--portrait .edition-card__media { aspect-ratio: 4 / 5; }
.home-grid--editions { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1000px) { .home-grid--tiles { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .home-grid--tiles { grid-template-columns: 1fr; } }

/* ---------- About Us ---------- */
.about-intro { background: var(--ivory); color: var(--ink); padding-block: clamp(3rem, 6vw, 4.5rem) 0; }
.about-intro__text { font-family: var(--font-display); font-size: var(--step-2); line-height: 1.45; max-width: 34ch; margin-inline: auto; text-align: center; }

/* ---------- Homepage banners: smaller text, centred, one-line headings ---------- */
.hero__content { text-align: center; }
.hero__heading { font-size: clamp(2rem, 1.5rem + 2vw, 3.1rem); max-width: 24ch; margin-inline: auto; }
.hero__ctas { justify-content: center; }
.pillar-hero__scrim { background: linear-gradient(180deg, rgba(5, 12, 23, 0.55) 0%, rgba(5, 12, 23, 0.7) 100%); }
.pillar-hero__inner { max-width: 960px; margin-inline: auto; text-align: center; }
.pillar-hero__heading { font-size: clamp(1.7rem, 1.4rem + 1.4vw, 2.5rem); }
.pillar-hero__desc { font-size: var(--step-0); max-width: 64ch; margin-inline: auto; }
@media (min-width: 700px) { .pillar-hero__heading { white-space: nowrap; } }
@media (max-width: 899px) { .pillar-hero__inner { max-width: 100%; } }
