/* ==========================================================================
   ABPp — Novo layout (v2) — galerias de fotos
   ========================================================================== */

/* ---------- grade de fotos (mosaico que se adapta à quantidade) ---------- */
/* distribuição sem buracos para cada quantidade: 3 → 1 grande + 2 | 4 → 2x2 | 5 → 1 grande + 4 | 6+ → 1 grande + linhas de 3 */
.gl-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: clamp(120px, 14vw, 190px); grid-auto-flow: dense; gap: 10px; }
.gl-grid .gl-tile:first-child { grid-column: span 2; grid-row: span 2; }
.gl-grid[data-n="1"] { grid-template-columns: 1fr; grid-auto-rows: clamp(220px, 34vw, 460px); }
.gl-grid[data-n="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: clamp(180px, 24vw, 320px); }
.gl-grid[data-n="4"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gl-grid[data-n="5"] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gl-grid:is([data-n="1"], [data-n="2"], [data-n="4"]) .gl-tile:first-child { grid-column: auto; grid-row: auto; }
.gl-tile { position: relative; overflow: hidden; border-radius: 14px; background: var(--paper-3); cursor: zoom-in; padding: 0; }
.gl-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease), filter .4s; }
.gl-tile:hover img { transform: scale(1.06); }
.gl-tile:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.gl-zoom { position: absolute; right: 10px; bottom: 10px; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: rgba(0,0,0,.35); backdrop-filter: blur(8px); opacity: 0; transform: scale(.85); transition: all .35s var(--ease); }
.gl-tile:hover .gl-zoom, .gl-tile:focus-visible .gl-zoom { opacity: 1; transform: none; }
.gl-more { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; color: #fff; background: color-mix(in oklab, var(--brand-deep) 62%, transparent); backdrop-filter: blur(3px); font-size: .9rem; }
.gl-more b { font-size: 2rem; font-weight: 600; line-height: 1; }
@media (max-width: 640px) {
    .gl-grid, .gl-grid:is([data-n="3"], [data-n="4"], [data-n="5"]) { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 130px; gap: 8px; }
    .gl-grid:not([data-n="1"], [data-n="2"]) .gl-tile:first-child { grid-column: span 2; grid-row: span 2; }
    .gl-grid:not([data-n="1"], [data-n="2"]) .gl-tile:last-child:nth-child(even) { grid-column: span 2; }
    .gl-zoom { opacity: 1; transform: none; width: 32px; height: 32px; }
}

/* ---------- card do álbum ---------- */
.gl-card { display: flex; flex-direction: column; gap: 14px; }
.gl-cover { position: relative; aspect-ratio: 4 / 3; border-radius: var(--radius); overflow: hidden; background: var(--paper-3); box-shadow: var(--shadow); transition: transform .6s var(--ease), box-shadow .6s var(--ease); }
.gl-cover img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.gl-cover.mosaic { display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; gap: 4px; background: var(--card); }
.gl-cover.mosaic img:first-child { grid-row: span 2; }
.gl-card:hover .gl-cover { transform: translateY(-6px); box-shadow: var(--shadow-l); }
.gl-card:hover .gl-cover img { transform: scale(1.04); }
.gl-count { position: absolute; left: 10px; bottom: 10px; display: inline-flex; gap: 6px; align-items: center; padding: 5px 10px; border-radius: 999px; font-size: .74rem; font-weight: 600; color: #fff; background: color-mix(in oklab, var(--ink) 62%, transparent); backdrop-filter: blur(10px); }
.gl-origem { display: inline-flex; gap: 5px; align-items: center; padding: 4px 9px; border-radius: 999px; font-size: .72rem; font-weight: 600; background: #fff; color: var(--ink); }
.gl-cover .gl-origem { position: absolute; right: 10px; top: 10px; box-shadow: var(--shadow-s); }
.gl-flickr { width: 18px; height: 18px; flex: none; }
.gl-info { display: grid; gap: 6px; padding: 0 4px; }
.gl-info small { color: var(--ink-3); font-size: .78rem; }
.gl-info strong { font-size: 1.08rem; font-weight: 500; line-height: 1.3; letter-spacing: -.01em; transition: color .3s; }
.gl-card:hover .gl-info strong { color: var(--brand); }
.gl-info p { color: var(--ink-2); font-size: .95rem; }
.gl-card.destaque { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.gl-card.destaque .gl-cover { aspect-ratio: 16 / 10; border-radius: var(--radius-l); }
.gl-card.destaque .gl-info strong { font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.3rem); font-weight: 600; letter-spacing: -.03em; }
@media (max-width: 860px) { .gl-card.destaque { grid-template-columns: 1fr; } }

/* ---------- bloco "Fotos" em evento e notícia ---------- */
.gl-bloco { margin-top: clamp(32px, 4vw, 48px); padding: clamp(18px, 2.5vw, 26px); border-radius: var(--radius-l); background: var(--card); box-shadow: 0 0 0 1px var(--line); max-width: 760px; }
.gl-bloco-head { display: flex; justify-content: space-between; align-items: end; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.gl-bloco-head h3 { font-size: 1.45rem; font-weight: 600; letter-spacing: -.02em; margin: 8px 0 4px; }
.gl-bloco-head p { color: var(--ink-3); font-size: .88rem; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.gl-bloco-head .btn { min-height: 44px; }
.gl-bloco .gl-grid { grid-auto-rows: clamp(100px, 11vw, 150px); }

/* ---------- visualizador ---------- */
html.gl-on { overflow: hidden; }
.gl-lb {
    position: fixed; inset: 0; z-index: 130; display: grid; grid-template-rows: auto 1fr auto; color: #fff;
    background: #0c0918; opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s;
}
.gl-lb.open { opacity: 1; visibility: visible; }
.gl-lb-top { display: flex; align-items: center; gap: 16px; padding: 14px clamp(14px, 3vw, 28px); }
.gl-lb-title { min-width: 0; flex: 1; }
.gl-lb-title strong { display: block; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gl-lb-title small { color: rgba(255,255,255,.6); font-size: .8rem; }
.gl-lb-count { font-variant-numeric: tabular-nums; font-size: .9rem; color: rgba(255,255,255,.75); }
.gl-lb-actions { display: flex; gap: 6px; }
.gl-lb-btn { height: 42px; min-width: 42px; padding: 0 12px; border-radius: 999px; display: inline-flex; gap: 8px; align-items: center; justify-content: center; color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); font-size: .86rem; transition: background .25s; }
.gl-lb-btn:hover { background: rgba(255,255,255,.12); }
.gl-lb-btn[hidden] { display: none !important; }
.gl-lb-stage { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 0 clamp(8px, 2vw, 20px); min-height: 0; touch-action: pan-y; }
.gl-lb figure { margin: 0; height: 100%; min-height: 0; display: grid; grid-template-rows: 1fr auto; justify-items: center; align-items: center; gap: 12px; padding: 8px 0; }
.gl-lb figure img { max-width: 100%; max-height: calc(100dvh - 230px); border-radius: 12px; object-fit: contain; opacity: 0; transform: scale(.985); transition: opacity .35s, transform .45s var(--ease); box-shadow: 0 30px 80px -20px rgba(0,0,0,.7); }
.gl-lb figure img.on { opacity: 1; transform: none; }
.gl-lb figcaption { max-width: 70ch; text-align: center; font-size: .94rem; color: rgba(255,255,255,.88); }
.gl-lb figcaption small { display: block; margin-top: 4px; color: rgba(255,255,255,.5); font-size: .76rem; }
.gl-lb-nav { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: rgba(255,255,255,.08); transition: background .25s, transform .3s var(--ease); }
.gl-lb-nav:hover { background: rgba(255,255,255,.2); transform: scale(1.06); }
.gl-lb-nav[hidden] { visibility: hidden; }
.gl-lb-thumbs { display: flex; gap: 8px; justify-content: center; padding: 12px clamp(14px, 3vw, 28px) 18px; overflow-x: auto; scrollbar-width: none; }
.gl-lb-thumbs::-webkit-scrollbar { display: none; }
.gl-lb-thumbs button { flex: none; width: 72px; height: 52px; border-radius: 8px; overflow: hidden; opacity: .45; outline: 2px solid transparent; outline-offset: 2px; transition: opacity .25s, outline-color .25s; }
.gl-lb-thumbs button:hover { opacity: .8; }
.gl-lb-thumbs button[aria-current="true"] { opacity: 1; outline-color: var(--accent); }
.gl-lb-thumbs img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 640px) {
    .gl-lb-stage { grid-template-columns: 1fr; }
    .gl-lb-nav { position: absolute; bottom: 8px; z-index: 2; width: 46px; height: 46px; }
    .gl-lb-nav.prev { left: 14px; } .gl-lb-nav.next { right: 14px; }
    .gl-lb figure img { max-height: calc(100dvh - 260px); }
    .gl-lb-btn span { display: none; }
    .gl-lb-count { display: none; }
}

/* ---------- página: lista de álbuns ---------- */
.gl-tools { display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap; align-items: center; margin-bottom: clamp(24px, 3vw, 40px); }
.gl-tools-right { display: flex; gap: 10px; flex-wrap: wrap; }
.filters button small { font-size: .72rem; color: var(--ink-3); margin-left: 2px; }
.gl-select { padding: 11px 16px; border-radius: 999px; border: 1.5px solid var(--line-strong); background: var(--card); }
.gl-search { display: flex; gap: 8px; align-items: center; padding: 0 16px; border-radius: 999px; border: 1.5px solid var(--line-strong); background: var(--card); color: var(--ink-3); }
.gl-search input { border: 0; outline: 0; background: transparent; padding: 11px 0; min-width: 180px; color: var(--ink); }
.gl-search:focus-within { border-color: var(--accent); }
.gl-destaque { margin-bottom: clamp(40px, 5vw, 64px); }
.gl-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px 24px; }
@media (max-width: 980px) { .gl-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .gl-cards { grid-template-columns: 1fr; } .gl-search input { min-width: 0; width: 100%; } .gl-tools-right, .gl-search { width: 100%; } }

/* ---------- página: álbum ---------- */
.gl-hero .img-ambient { opacity: .55; }
.gl-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.gl-hero h1 { font-size: clamp(2rem, 1.2rem + 3vw, 3.8rem); font-weight: 600; letter-spacing: -.04em; margin: 18px 0 12px; }
.gl-hero-desc { color: rgba(255,255,255,.8); max-width: 52ch; }
.gl-hero-meta { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 18px; font-size: .9rem; color: rgba(255,255,255,.75); }
.gl-hero-meta span { display: inline-flex; gap: 8px; align-items: center; }
.gl-hero .feature-actions { margin-top: 28px; }
.gl-hero .chip .gl-origem { padding: 0; background: transparent; color: #fff; }
.gl-hero-cover { position: relative; aspect-ratio: 4 / 3; border-radius: var(--radius-l); overflow: hidden; box-shadow: 0 50px 100px -30px rgba(0,0,0,.75); cursor: zoom-in; transform: rotate(1.5deg); transition: transform .8s var(--ease); padding: 0; }
.gl-hero-cover:hover { transform: rotate(0) scale(1.01); }
.gl-hero-cover img { width: 100%; height: 100%; object-fit: cover; }
.gl-album { padding: clamp(48px, 6vw, 80px) 0 clamp(56px, 7vw, 96px); }
.gl-album .gl-grid { grid-auto-rows: clamp(140px, 16vw, 230px); }
.gl-vinculos { margin-top: clamp(36px, 5vw, 56px); display: grid; gap: 14px; }
.gl-links { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.gl-link { display: flex; gap: 14px; align-items: center; padding: 14px 16px; border-radius: 18px; background: var(--card); box-shadow: 0 0 0 1px var(--line); transition: transform .4s var(--ease), box-shadow .4s; }
.gl-link:hover { transform: translateY(-3px); box-shadow: var(--shadow), 0 0 0 1px var(--line); }
.gl-link > span:nth-child(2) { flex: 1; min-width: 0; }
.gl-link small { display: block; color: var(--ink-3); font-size: .76rem; }
.gl-link strong { display: block; font-weight: 500; font-size: .95rem; line-height: 1.3; }
.gl-link-ico { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; flex: none; background: var(--accent-soft); color: var(--accent); }
@media (max-width: 860px) { .gl-hero-grid { grid-template-columns: 1fr; } .gl-hero-cover { transform: none; } }

/* ---------- bloco de mídia: vídeos + uma ou várias galerias ---------- */
.md-bloco { display: grid; gap: 24px; }
.md-bloco .gl-bloco-head { margin-bottom: 0; }
.md-part { display: grid; gap: 14px; }
.md-part h4 { display: flex; gap: 8px; align-items: center; font-size: 1rem; font-weight: 600; }
.md-part h4 .icon { color: var(--accent); }
.md-part h4 small { color: var(--ink-3); font-weight: 400; font-size: .84rem; }
.md-part-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.md-videos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.md-videos.one { grid-template-columns: 1fr; }
.md-video { margin: 0; display: grid; gap: 10px; }
.md-player { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #000; }
.md-player img, .md-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0; }
.md-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: var(--ink); box-shadow: 0 10px 30px -8px rgba(0,0,0,.5); transition: transform .4s var(--ease-bounce); }
.md-play .icon { width: 24px; height: 24px; margin-left: 3px; }
.md-player:hover .md-play { transform: translate(-50%, -50%) scale(1.1); }
.md-video figcaption { display: grid; gap: 2px; font-size: .9rem; }
.md-video figcaption strong { font-weight: 500; line-height: 1.3; }
.md-video figcaption a { display: inline-flex; gap: 4px; align-items: center; font-size: .8rem; color: var(--brand); }
.md-video figcaption span { font-size: .8rem; color: var(--ink-3); }
.md-albums { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.md-album { display: grid; gap: 10px; }
.md-album-cover { position: relative; display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; gap: 4px; aspect-ratio: 4 / 3; border-radius: 14px; overflow: hidden; padding: 0; background: var(--card); cursor: zoom-in; }
.md-album-cover img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.md-album-cover img:first-child { grid-row: span 2; }
.md-album-cover img:only-child { grid-column: span 2; }
.md-album-cover:hover img { transform: scale(1.04); }
.md-album-cover .gl-origem { position: absolute; right: 8px; top: 8px; }
.md-album-info { display: grid; gap: 2px; }
.md-album-info small { color: var(--ink-3); font-size: .78rem; }
.md-album-info strong { font-weight: 500; font-size: .95rem; line-height: 1.3; }
.md-note { font-size: .8rem; color: var(--ink-3); }
@media (max-width: 640px) { .md-videos, .md-albums { grid-template-columns: 1fr; } }
/* no projeto o bloco ocupa a coluna inteira */
#pj-midia, .pj-main .md-bloco { max-width: none; }
.gl-ilustr { display: inline-flex; gap: 6px; align-items: center; margin-top: 14px; padding: 6px 12px; border-radius: 999px; font-size: .8rem; background: rgba(255,255,255,.12); color: rgba(255,255,255,.85); }