/* Geometria fluida: acompanha a janela, inclusive em monitores largos. */
:root {
  --page-max:2400px;
  --page-gutter:clamp(16px,4vw,96px);
  --section-gap:clamp(30px,3.5vw,64px);
  --rail-gap:clamp(14px,1.25vw,22px);
}
.experience .container {
  width:min(var(--page-max),calc(100% - 2 * var(--page-gutter)));
  min-width:0;
}
.experience :is(.hero-copy,.hero-media,.filter-shell,.next-shelf,.history-main,.footer-grid>*,.shelf-title,.today-body,.card .body) {min-width:0;}
.experience :is(h1,h2,h3,h4,.meta,.details,.today-location,.active-filters) {overflow-wrap:anywhere;}
.experience .hero-grid {grid-template-columns:minmax(0,1.04fr) minmax(0,1fr);gap:clamp(20px,3vw,64px);min-height:0;}
.experience .hero-copy h1 {font-size:clamp(36px,3.8vw,76px);line-height:1.03;letter-spacing:-.045em;max-width:20ch;}
.experience .hero-media {height:clamp(240px,20vw,400px);}
.experience .hero-photo-frame {height:100%;}
.experience .hero-lead {font-size:clamp(13px,.95vw,17px);max-width:53ch;}
.experience .hero-actions {flex-wrap:wrap;gap:10px 22px;}
.experience .primary-link {font-size:clamp(11px,.8vw,14px);min-height:44px;}
.experience .text-link {font-size:clamp(11px,.75vw,13px);min-height:44px;display:inline-flex;align-items:center;}
.experience .hero-stats {gap:10px 16px;}
.experience .hero-catalog {flex-wrap:wrap;}
.experience .hero-stats strong {font-size:13px;}
.experience .hero-stats small {font-size:11px;}
.experience .hero-live-count {flex-wrap:wrap;}
.experience .top {height:auto;min-height:76px;gap:clamp(16px,2.6vw,46px);padding-block:10px;}
.experience .top nav {display:flex;gap:clamp(16px,2vw,30px);min-width:0;margin-right:auto;}
.experience .top nav a {font-size:clamp(10px,.7vw,12px);min-height:44px;display:inline-flex;align-items:center;}
.experience .top .suggest {font-size:clamp(9px,.7vw,12px);min-height:44px;display:inline-flex;align-items:center;margin-left:auto;}
.experience .filters {display:grid;grid-template-columns:minmax(180px,1.25fr) minmax(0,1.65fr);align-items:end;}
.experience .filter-options {display:grid;grid-template-columns:minmax(90px,.8fr) minmax(140px,1.3fr);gap:12px;min-width:0;}
.experience .filters label {min-width:0;width:auto;font-size:9px;}
.experience .filters :is(input,select) {width:100%;min-width:0;min-height:44px;font-size:14px;}
.experience .filter-toggle {display:none;}
.experience .shelf-heading {display:flex;align-items:center;flex-wrap:wrap;gap:12px;}
.experience .shelf-title {flex:1;}
.experience .shelf-title h3 {font-size:clamp(18px,1.5vw,24px);max-width:none;}
.experience .shelf-tools {flex-shrink:0;}
.experience .shelf-tools>span {font-size:11px;}
.experience .round-button {width:44px;height:44px;min-width:44px;min-height:44px;}
.experience .today-grid {--today-columns:3;gap:var(--rail-gap);}
.experience .today-card {flex-basis:calc((100% - (var(--today-columns) - 1) * var(--rail-gap))/var(--today-columns));}
.experience .is-expanded .today-grid {grid-template-columns:repeat(var(--today-columns),minmax(0,1fr));}
.experience .today-art {height:clamp(165px,13vw,240px);}
.experience .today-body h4 {font-size:clamp(16px,1.15vw,20px);line-height:1.3;}
.experience .today-location {font-size:clamp(12px,.8vw,14px);}
.experience .today-time {font-size:12px;}
.experience .today-card-bottom {flex-wrap:wrap;}
.experience .today-card-bottom>span {font-size:9px;}
.experience .today-card-bottom button {font-size:12px;min-height:44px;}
.experience .today-footer {flex-wrap:wrap;}
.experience .today-footer>span {font-size:10px;max-width:none;}
.experience .today-footer button {font-size:11px;min-height:44px;}
.experience .next-shelf {padding-top:var(--section-gap);}
.experience .next-shelf .heading {flex-wrap:wrap;gap:12px;align-items:center;}
.experience .next-shelf h2 {font-size:clamp(23px,2.1vw,34px);}
.experience .upcoming-carousel {--upcoming-columns:4;gap:var(--rail-gap);}
.experience .upcoming-carousel .card {flex-basis:calc((100% - (var(--upcoming-columns) - 1) * var(--rail-gap))/var(--upcoming-columns));}
.experience .upcoming-carousel .visual {height:clamp(150px,11vw,210px);}
.experience .upcoming-carousel .body h3 {font-size:clamp(15px,1vw,18px);}
.experience .upcoming-carousel .meta {font-size:12px;}
.experience .upcoming-carousel .bottom {font-size:11px;}
.experience .upcoming-carousel .bottom .event-link {min-height:44px;display:inline-flex;align-items:center;font-size:11px;}
.experience .history-main .history-grid {grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:18px;}
.experience .historical-card {min-width:0;}
.experience .footer-grid {grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) auto;gap:24px;}
.experience dialog {width:min(760px,calc(100% - 32px));max-width:calc(100% - 32px);max-height:calc(100dvh - 32px);margin:auto;overflow:auto;overscroll-behavior:contain;}
.experience #close {position:sticky;float:right;top:8px;right:8px;margin:8px 8px -52px 0;width:44px;height:44px;border-radius:50%;}
.experience .modalVisual {height:clamp(150px,34dvh,300px);}
.experience .modalBody {padding:clamp(18px,3vw,30px);}
.experience .modalBody h2 {font-size:clamp(23px,3vw,32px);}
.experience .details {grid-template-columns:repeat(2,minmax(0,1fr));}
.experience .official,.experience .published-page-link {overflow-wrap:anywhere;white-space:normal;}
@media(min-width:1600px) {
  .experience .today-grid {--today-columns:4;}
  .experience .upcoming-carousel {--upcoming-columns:5;}
}
@media(min-width:2200px) {
  .experience .today-grid {--today-columns:5;}
  .experience .upcoming-carousel {--upcoming-columns:6;}
}
@media(max-width:1100px) {
  .experience .top {gap:18px;}
  .experience .brand {min-width:0;}
  .experience .brand-logo {width:150px;}
  .experience .top nav {gap:16px;}
  .experience .hero-copy h1 {font-size:clamp(33px,4.05vw,44px);}
  .experience .today-grid {--today-columns:2;}
  .experience .today-date-inline {display:none;}
  .experience .upcoming-carousel {--upcoming-columns:3;}
}
@media(max-width:820px) {
  .experience .top {min-height:64px;padding-block:8px;}
  .experience .top nav {display:none;}
  .experience .hero-grid {grid-template-columns:minmax(0,1fr);gap:0;}
  .experience .hero-copy h1 {font-size:clamp(30px,5.2vw,43px);max-width:24ch;}
  .experience .hero-media {display:none;}
  .experience .hero-stats {display:flex;}
  .experience .hero-stats .hero-catalog {margin:0;border:0;padding:0;}
  .experience .filters {grid-template-columns:minmax(0,1fr) auto;gap:8px;}
  .experience .filter-toggle {display:block;min-height:44px;padding:10px 14px;font-size:12px;}
  .experience .filter-options {grid-column:1/-1;display:none;}
  .experience .filters.filters-expanded .filter-options {display:grid;grid-template-columns:minmax(90px,.8fr) minmax(0,1.4fr);}
  .experience .filters :is(input,select) {font-size:16px;}
  .experience .shelf-title h3 {font-size:20px;line-height:1.2;margin-top:6px;}
  .experience .shelf-tools {gap:6px;}
  .experience .shelf-heading .shelf-tools>span {position:static;font-size:10px;}
  .experience .today-card-bottom {gap:0 8px;}
  .experience .today-footer {flex-direction:row;align-items:center;}
  .experience .upcoming-carousel {--upcoming-columns:2;}
  .experience .footer-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:600px) {
  .experience .hero {padding-block:18px;}
  .experience .hero-copy h1 {font-size:clamp(28px,8vw,42px);line-height:1.05;max-width:19ch;margin-block:10px;}
  .experience .hero-copy h1 br {display:none;}
  .experience .hero-copy h1 br:after {content:' ';}
  .experience .hero-copy .eyebrow {font-size:8px;letter-spacing:1px;line-height:1.6;}
  .experience .hero-lead {font-size:13px;max-width:42ch;line-height:1.45;}
  .experience .hero-lead br {display:initial;}
  .experience .hero-actions {gap:8px 16px;margin-top:12px;}
  .experience .primary-link {font-size:11px;padding:10px 12px;gap:12px;}
  .experience .text-link {font-size:11px;}
  .experience .hero-stats {display:flex;flex-direction:column;align-items:start;margin-top:12px;gap:8px;}
  .experience .hero-stats strong {font-size:12px;}
  .experience .hero-stats small {font-size:10px;}
  .experience .hero-catalog>span {margin:0 3px;}
  .experience .today-showcase {margin-inline:0;padding:16px 12px 10px;}
  .experience .shelf-heading {display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:10px;}
  .experience .shelf-title h3 {font-size:18px;max-width:20ch;}
  .experience .shelf-tools {display:flex;flex-wrap:wrap;justify-content:end;max-width:94px;gap:6px;}
  .experience .shelf-heading .shelf-tools>span {flex-basis:100%;text-align:right;font-size:10px;margin:0 0 2px;}
  .experience .shelf-heading .shelf-tools>.today-date-inline {display:none;}
  .experience .today-grid {--today-columns:1;}
  .experience .today-card {flex-basis:92%;}
  .experience .today-art {height:clamp(170px,49vw,240px);}
  .experience .today-body {padding:13px;}
  .experience .today-body h4 {font-size:16px;min-height:0;}
  .experience .today-footer {display:flex;flex-direction:column;align-items:start;gap:0;}
  .experience .today-footer>span {font-size:10px;}
  .experience .today-footer button {align-self:end;font-size:11px;}
  .experience .next-shelf .heading {flex-wrap:nowrap;gap:10px;}
  .experience .next-shelf .heading>div:first-child {min-width:0;}
  .experience .next-shelf .shelf-tools {flex-wrap:nowrap;}
  .experience .next-shelf h2 {font-size:23px;}
  .experience .upcoming-carousel .card {flex-basis:88%;}
  .experience .upcoming-carousel .visual {height:clamp(160px,44vw,220px);}
  .experience .history-main .history-grid {grid-template-columns:minmax(0,1fr);gap:12px;}
  .experience .historical-card .bottom .event-link {min-height:40px;display:inline-flex;align-items:center;}
  .experience .footer-grid {grid-template-columns:minmax(0,1fr);}
  .experience .footer-grid>a {grid-column:auto;}
  .experience .details {grid-template-columns:minmax(0,1fr);}
  .experience dialog {width:calc(100% - 20px);max-width:calc(100% - 20px);max-height:calc(100dvh - 20px);}
}
@media(max-width:400px) {
  .experience .filters.filters-expanded .filter-options {grid-template-columns:minmax(0,1fr);}

  .experience .hero-actions {gap:6px 12px;}
  .experience .primary-link {font-size:10px;}
  .experience .text-link {font-size:10px;}
  .experience .shelf-title h3 {font-size:17px;}
  .experience .today-body {padding:11px;}
}
/* Janelas baixas e celular na horizontal mantêm espaço útil para o conteúdo. */
@media(max-height:540px) and (min-aspect-ratio:4/3) {
  .experience header {position:relative;}
  .experience .hero {padding-block:14px;}
  .experience .hero-media {height:210px;}
  .experience .hero-copy h1 {font-size:clamp(30px,3.5vw,44px);}
  .experience .hero-lead {font-size:13px;}
  .experience .hero-actions,.experience .hero-stats {margin-top:10px;}
  .experience .modalVisual {height:140px;}
  #hoje,#proximos,#brasil,#historico {scroll-margin-top:20px;}
}
