@media (min-width: 1024px) {
  .wrap { max-width: 1440px; padding-inline: 2.5rem; }
  .hero { width: calc(100% - 5rem); max-width: 1360px; }
  .facts, main > section:not(.hero) > .wrap, .footer > .wrap { max-width: 1360px; }
  .history-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 1440px) {
  .hero, .facts, main > section:not(.hero) > .wrap, .footer > .wrap { max-width: 1280px; }
}

@media (max-width: 1023px) {
  .hero { width: calc(100% - 2rem); }
}

.hero-video .hero-shade {
  background: linear-gradient(90deg, rgba(0, 0, 0, .78), rgba(0, 0, 0, .42) 58%, rgba(0, 0, 0, .25));
}
.hero-video .hero-copy { color: #fff; }
.hero-video .hero-copy .lead { color: rgba(255, 255, 255, .88); }
.hero-video .eyebrow { color: #fff; }

@media (max-width: 850px) {
  .hero-video .hero-shade {
    background: linear-gradient(to top, rgba(0, 0, 0, .92), rgba(0, 0, 0, .4) 68%, rgba(0, 0, 0, .22));
  }
}

.history-image { background: #fff !important; }
.history-audio { display: grid; gap: .55rem; margin-top: 1rem; }
.history-audio audio { display: block; width: 100%; height: 36px; }

.history-player {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: .7rem;
  border: 1px solid #31313a;
  border-radius: 16px;
  background: linear-gradient(135deg, #111218, #292a31);
  padding: .65rem;
  color: #fff;
  box-shadow: 0 10px 28px rgba(17, 18, 24, .16);
}
.history-player audio { display: none; }
.history-player-toggle {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: #17181e;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .3);
  cursor: pointer;
  transition: transform .2s;
}
.history-player-toggle:hover { transform: scale(1.04); }
.history-player-toggle:active { transform: scale(.96); }
.history-player-toggle svg { width: 19px; height: 19px; fill: currentColor; }
.history-player-copy { min-width: 0; }
.history-player-copy strong { display: block; overflow: hidden; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.history-player-copy > span { display: flex; align-items: center; gap: .35rem; margin-top: .2rem; color: #bbbcc4; font-size: .63rem; font-weight: 600; }
.history-player-copy em { overflow: hidden; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.history-player-bars { display: flex; height: 11px; align-items: flex-end; gap: 2px; }
.history-player-bars i { display: block; width: 2px; height: 35%; border-radius: 4px; background: #fff; }
.history-player.is-playing .history-player-bars i { animation: history-equalize .75s ease-in-out infinite alternate; }
.history-player.is-playing .history-player-bars i:nth-child(2) { animation-delay: -.25s; }
.history-player.is-playing .history-player-bars i:nth-child(3) { animation-delay: -.5s; }
@keyframes history-equalize { to { height: 100%; } }
.home-song-section { padding: 2.2rem 0 0; }
.home-song-card { display: grid; grid-template-columns: 1fr minmax(300px,.8fr); gap: 2rem; align-items: center; overflow: hidden; border-radius: 24px; background: linear-gradient(135deg,#111218,#34343b); padding: 2rem 2.2rem; color: #fff; box-shadow: 0 16px 45px rgba(17,18,24,.14); }
.home-song-card h2 { margin: .2rem 0 .45rem; font-size: clamp(1.6rem,3vw,2.5rem); }
.home-song-card p:not(.eyebrow) { margin: 0; color: #c6c6cb; }
.home-song-audio .history-player { margin: 0; background: #08090c; border-color: #46464d; }
@media (max-width:700px) { .home-song-card { grid-template-columns: 1fr; gap: 1.2rem; padding: 1.4rem; } .home-song-section { padding-top: 1rem; } }
.home-feature-section { padding: 0 0 4rem; }
.home-feature-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.25rem; }
.home-feature-card { position: relative; display: flex; min-height: 390px; flex-direction: column; align-items: stretch; overflow: hidden; border: 1px solid rgba(255,255,255,.8); border-radius: 24px; background: #fff; padding: 2rem; box-shadow: 0 12px 38px rgba(30,20,70,.08); }
.home-feature-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.home-feature-icon { display: grid; width: 52px; height: 52px; flex: 0 0 52px; place-items: center; border-radius: 17px; background: #f4eeee; color: #d71920; }
.home-feature-icon svg { width: 25px; height: 25px; }
.home-feature-card h2 { max-width: 620px; margin: .25rem 0 .8rem; font-size: clamp(1.6rem,2.8vw,2.45rem); line-height: 1.08; letter-spacing: -.035em; }
.home-feature-card > h3 { margin: .6rem 0 .7rem; font-size: 1.3rem; line-height: 1.25; }
.home-feature-card > p:not(.eyebrow) { max-width: 620px; margin: 0 0 1rem; color: #625d67; line-height: 1.65; }
.home-feature-verse { font-size: 1.05rem; color: #28242c !important; }
.home-feature-card .btn { margin-top: auto; }
.home-feature-card .btn svg { width: 18px; height: 18px; }
.home-theme-card .home-song-audio { width: 100%; margin-top: auto; }
.home-theme-card { isolation: isolate; border-color: rgba(8,38,82,.28); background: #071d42; color: #fff; box-shadow: 0 18px 44px rgba(8,38,82,.24); }
.home-theme-card::before { content:""; position:absolute; z-index:-2; inset:0; background:url('/assets/asamblea-2026-landscape.png') center/cover no-repeat; pointer-events:none; }
.home-theme-card::after { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,rgba(4,20,48,.72) 0%,rgba(4,20,48,.42) 52%,rgba(4,20,48,.08) 100%); pointer-events:none; }
.home-theme-card > * { position:relative; z-index:1; }
.home-theme-card .eyebrow { color: #fff; opacity: .72; }
.home-theme-card > p:not(.eyebrow),
.home-theme-card .home-feature-verse { color: #fff !important; }
.home-theme-card .home-feature-icon { background: #f2c96f; color: #092653; box-shadow:0 8px 24px rgba(4,29,62,.22); }
.home-theme-card .history-player { border-color:rgba(255,255,255,.22); background:rgba(5,25,54,.88); backdrop-filter:blur(10px); }
.home-feature-action { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1rem; margin-top: auto; border-radius: 18px; background: #111218; padding: 1rem; color: #fff; }
.home-feature-action > svg { width: 22px; height: 22px; }
.home-feature-action strong,.home-feature-action small { display: block; }
.home-feature-action small { margin-top: .2rem; color: #a7a7ae; }
.home-action-icon { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 50%; background: #fff; color: #111218; }
.home-action-icon svg { width: 22px; height: 22px; }
@media (max-width:800px) { .home-feature-grid { grid-template-columns: 1fr; } .home-feature-card { min-height: 0; padding: 1.4rem; } .home-feature-card .btn,.home-theme-card .home-song-audio { margin-top: 1rem; } }
@media (max-width:800px) { .home-theme-card::before { background-position:center; } .home-theme-card::after { background:rgba(4,20,48,.48); } }
.timeline-hero { position:relative; min-height:340px; overflow:hidden; background:#f4d9da; }
.timeline-collage { position:absolute; inset:0; display:grid; grid-template-columns:1.05fr .9fr 1.15fr .9fr 1.05fr; gap:4px; transform:scale(1.035); }
.timeline-collage img { width:100%; height:100%; object-fit:cover; filter:saturate(.55) contrast(.88); }
.timeline-collage img:nth-child(2),.timeline-collage img:nth-child(4) { transform:translateY(-4%); }
.timeline-hero-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(215,25,32,.38),rgba(255,255,255,.88) 34%,rgba(255,255,255,.88) 66%,rgba(215,25,32,.38)),linear-gradient(rgba(215,25,32,.2),rgba(255,255,255,.42)); backdrop-filter:blur(1px); }
.timeline-hero-content { position:relative; z-index:1; min-height:340px; display:flex; align-items:center; justify-content:center; flex-direction:column; text-align:center; color:#12183c; padding-bottom:2.5rem; }
.timeline-crown { width:58px; height:58px; margin-bottom:.55rem; fill:#12183c; stroke-width:1.7; }
.timeline-hero h1 { margin:0; font-size:clamp(2.65rem,7vw,5.2rem); line-height:.92; letter-spacing:.11em; font-weight:900; }
.timeline-tagline { margin:.85rem 0 0; font-size:clamp(.62rem,1.2vw,.82rem); font-weight:900; letter-spacing:.15em; }
.timeline-script { margin:.9rem 0 0; color:#d71920; font-family:"Brush Script MT","Segoe Script",cursive; font-size:clamp(1.65rem,3.5vw,2.8rem); transform:rotate(-2deg); }
.timeline-discover { display:inline-flex; align-items:center; gap:.65rem; border:1px solid rgba(112,65,189,.12); border-radius:14px; background:rgba(255,255,255,.92); padding:.78rem 1.1rem; color:#7041bd; font-size:.8rem; font-weight:800; box-shadow:0 8px 28px rgba(64,35,103,.13); }
.timeline-discover svg { width:17px; height:17px; }
.timeline-page-head { position:relative; z-index:1; padding:2rem 0 1.25rem; }
.timeline-page-head .eyebrow { margin:0 0 .65rem; }
.timeline-page-head h1 { max-width:900px; margin:0; font-size:clamp(2.5rem,6vw,4.8rem); line-height:1.05; }
.timeline-intro { position:relative; z-index:1; clear:both; scroll-margin-top:90px; margin:0; padding:0 0 2rem; }
.timeline-story { width:100%; max-width:none; padding:2rem; }
.timeline-story h2 { margin:.35rem 0 1.25rem; color:#171827; font-size:clamp(1.8rem,4vw,2.7rem); line-height:1.05; letter-spacing:-.045em; }
.timeline-story p { color:#56515b; font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif; font-size:1rem; line-height:1.75; text-align:justify; text-justify:inter-word; hyphens:auto; }
.timeline-story p:first-child { margin-top:0; }
.timeline-story p + p { margin-top:1.5rem; }
.timeline-story .timeline-welcome { margin:1.5rem 0 0; border-radius:14px; background:#fff3f3; padding:1rem 1.15rem; color:#403b42; }
.countdown-footer { margin-top:3rem; padding:2.6rem 0 8rem; background:#092653; color:#fff; }
.countdown-inner { display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.countdown-copy small { display:block; color:#f2c96f; font-size:.7rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.countdown-copy strong { display:block; margin-top:.35rem; font-size:clamp(1.25rem,2.8vw,2rem); letter-spacing:-.035em; }
.countdown-grid { display:grid; grid-template-columns:repeat(3,minmax(82px,1fr)); gap:.7rem; }
.countdown-unit { min-width:92px; border:1px solid rgba(255,255,255,.16); border-radius:17px; background:rgba(255,255,255,.08); padding:.85rem 1rem; text-align:center; backdrop-filter:blur(8px); }
.countdown-unit b { display:block; font-size:clamp(1.7rem,4vw,2.65rem); line-height:1; font-variant-numeric:tabular-nums; }
.countdown-unit span { display:block; margin-top:.35rem; color:rgba(255,255,255,.7); font-size:.66rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
@media(max-width:700px) { .countdown-footer { padding:2rem 0 7.5rem; } .countdown-inner { align-items:stretch; flex-direction:column; } .countdown-grid { width:100%; } .countdown-unit { min-width:0; padding:.8rem .45rem; } }
.timeline-section { padding: 1rem 0 5rem; }
.timeline-section-heading { max-width:720px; margin:0 auto 3rem; text-align:center; }
.timeline-section-heading .eyebrow { margin:0 0 .65rem; }
.timeline-section-heading h2 { margin:0 0 .8rem; }
.timeline-section-heading > p:last-child { margin:0; color:var(--muted); font-size:1.05rem; line-height:1.65; }
.timeline { position: relative; display: grid; gap: 2rem; }
.timeline::before { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; width: 3px; border-radius: 9px; background: linear-gradient(#d71920,#dad5dc); transform: translateX(-50%); }
.timeline-entry { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
.timeline-entry:nth-child(odd) .timeline-card { grid-column: 1; }
.timeline-entry:nth-child(even) .timeline-card { grid-column: 2; }
.timeline-marker { position: absolute; left: 50%; z-index: 2; display: grid; width: 58px; height: 58px; place-items: center; border: 6px solid #f8f7fb; border-radius: 50%; background: #d71920; color: #fff; box-shadow: 0 8px 24px rgba(215,25,32,.24); transform: translateX(-50%); }
.timeline-marker span { font-size: .7rem; font-weight: 900; }
.timeline-card { display: grid; grid-template-columns: 150px 1fr; overflow: hidden; padding: 0; }
.timeline-logo { display: grid; min-height: 210px; place-items: center; background: #fff; padding: 1rem; }
.timeline-logo img { width: 100%; max-height: 180px; object-fit: contain; }
.timeline-copy { padding: 1.4rem; }
.timeline-copy h2 { margin: .3rem 0 .7rem; font-size: 1.35rem; }
.timeline-copy > p:not(.eyebrow):not(.timeline-meta) { color: #65606a; font-size: .82rem; line-height: 1.55; }
.timeline-meta { display: flex; align-items: center; gap: .35rem; color: #6d6872; font-size: .75rem; font-weight: 700; }
.timeline-meta svg { width: 15px; height: 15px; color: #d71920; }
.timeline-audio { margin-top: .9rem; }
@media (max-width:900px) { .timeline::before { left: 29px; } .timeline-entry { display: block; padding-left: 68px; } .timeline-entry:nth-child(n) .timeline-card { grid-column: auto; } .timeline-marker { left: 29px; } }
@media (max-width:600px) { .timeline-page-head { padding:1.5rem 0 1rem; } .timeline-story { padding:1.3rem; } .timeline-card { grid-template-columns: 1fr; } .timeline-logo { min-height: 190px; } .timeline-entry { padding-left: 55px; } .timeline::before,.timeline-marker { left: 22px; } .timeline-marker { width: 46px; height: 46px; border-width: 5px; } .timeline-marker span { font-size: .58rem; } }
