/* ==========================================================================
   RESONALIA — Shared stylesheet
   Loaded by every page so the browser downloads and caches it once.
   ========================================================================== */

@font-face{
  font-family: 'Shree714';
  src: url('../fonts/shree714-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: 'Shree714';
  src: url('../fonts/shree714-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: 'Shree714';
  src: url('../fonts/shree714-400i.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face{
  font-family: 'Shree714';
  src: url('../fonts/shree714-700i.woff2') format('woff2');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

:root{
  --blue: #537FF9;
  --black: #050606;
  --black-alt: #030303;
  --off-black: #020303;
  --white: #ffffff;
  --font: 'Shree714', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --max-width: 1440px;
}

*{ box-sizing: border-box; margin:0; padding:0; }
html{ scroll-behavior: smooth; }
body{
  font-family: var(--font);
  color: var(--black);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
}
img{ max-width: 100%; display:block; }
.wrap{ max-width: var(--max-width); margin: 0 auto; padding: 0 clamp(20px, 4.3vw, 62px); }
a{ color: inherit; text-decoration: none; }
.visually-hidden{
  position:absolute !important; width:1px; height:1px; margin:-1px; padding:0;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* ---------- BUTTONS ---------- */
.btn-circle{
  display:inline-flex; align-items:center; justify-content:center;
  width: 46px; height: 46px; border-radius: 50%;
  background: var(--blue); color: var(--white);
  font-size: 20px; font-weight: 400; border: none; cursor: pointer;
  transition: transform .25s ease, background .25s ease, box-shadow .25s ease;
  box-shadow: 0 4px 14px rgba(83,127,249,.35);
}
.btn-circle:hover{ transform: scale(1.08); background:#3d68e0; box-shadow: 0 6px 18px rgba(83,127,249,.45); }
.btn-circle.small{ width:42px; height:42px; font-size:18px; }

.ticket-cta{ display:flex; flex-direction: column; align-items:center; gap: 12px; }
.ticket-cta.inline{ flex-direction: row; align-items:center; justify-content: flex-start; gap: 16px; }

/* ---------- TYPE SCALE ---------- */
.t-dates{ color: var(--blue); font-weight: 400; font-size: clamp(14px, 1.25vw, 18px); letter-spacing: 3px; line-height: 1.5; margin: 0 auto; }
.t-venue-line{ color: var(--white); font-weight: 400; font-size: clamp(12px, 1vw, 14px); letter-spacing: 2.6px; line-height: 1.6; margin: 6px auto 0; opacity: .88; }
.t-tagline{ color: var(--blue); font-weight: 500; font-size: clamp(22px, 3vw, 40px); letter-spacing: 0.5px; line-height: 1.2; max-width: 620px; margin: 0 auto; font-style: normal; }
.tagline-break{ display: none; }
.t-tickets-hero{ color: var(--white); font-size: clamp(11px, 0.85vw, 13px); font-weight: 700; letter-spacing: 2.6px; }
.t-artist-name{ color: var(--black); font-size: clamp(24px, 2.1vw, 30px); font-weight: 400; line-height: 1.2; letter-spacing: 0.2px; margin-bottom: 8px; }
.t-artist-role{ color: var(--blue); font-size: clamp(11px, 0.8vw, 12px); font-weight: 700; letter-spacing: 2.2px; display:block; margin-bottom: 22px; }
.t-tickets-small{ color: var(--black-alt); font-size: clamp(10px, 0.75vw, 11px); font-weight: 700; letter-spacing: 1.6px; }
.t-location{ color: var(--blue); font-size: clamp(13px, 1vw, 15px); font-weight: 700; line-height: 1.5; letter-spacing: 2px; margin-bottom: 20px; display:block; }
.t-section-title{ color: var(--black); font-size: clamp(34px, 3.6vw, 54px); font-weight: 400; line-height: 1.08; letter-spacing: -0.5px; margin-bottom: 24px; display:block; }
.t-eyebrow{ color: var(--blue); font-size: clamp(13px, 0.95vw, 15px); font-weight: 700; line-height: 1.4; letter-spacing: 1.8px; margin-bottom: 24px; display:block; text-transform: uppercase; }
.t-body{ color: var(--black); font-size: clamp(15px, 1.15vw, 17px); font-weight: 400; line-height: 1.75; letter-spacing: 0.1px; max-width: 460px; display:block; opacity: .82; }
.t-footer-bar{ color: var(--white); font-size: clamp(12px, 0.95vw, 14px); font-weight: 700; line-height: 1.4; letter-spacing: 4px; text-transform: uppercase; text-align:center; }
.t-footer-address{ color: var(--white); font-size: clamp(14px, 1.05vw, 15px); font-weight: 400; line-height: 1.8; letter-spacing: 0.3px; display:block; padding-bottom: 60px; opacity: .85; text-align:center; }
.t-footer-address a{ text-decoration: underline; opacity: 1; }
.t-card-label{ color: var(--black-alt); font-size: clamp(11px, 0.8vw, 12px); font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; opacity: .55; }
.t-card-value{ color: var(--black); font-size: clamp(16px, 1.25vw, 19px); font-weight: 700; line-height: 1.35; }
.t-quote{ color: var(--white); font-size: clamp(20px, 2.1vw, 28px); font-weight: 700; line-height: 1.25; letter-spacing: -0.2px; }

/* ---------- HERO (home) ---------- */
.hero-section{ background: var(--black); padding: 0; width: 100%; margin: 0; }
.hero{
  position: relative; width: 100%; min-height: 86vh;
  display:flex; align-items:flex-end; justify-content:center; text-align:center;
  background-color: #111;
  background-image: url('../img/hero.jpg');
  background-image: image-set(url('../img/hero.webp') type('image/webp') 1x, url('../img/hero.jpg') type('image/jpeg') 1x);
  background-position: center; background-size: cover; background-repeat: no-repeat;
  color: var(--white); overflow:hidden;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.25) 55%, rgba(0,0,0,.55) 100%);
}
.hero-inner{
  position:relative; z-index: 2;
  display:flex; flex-direction:column; align-items:center; gap: clamp(22px, 2.6vw, 34px);
  padding: 20px clamp(20px, 6vw, 60px) clamp(56px, 8vw, 96px);
  width: 100%;
}
.hero-logo{
  position: absolute; top: clamp(90px, 12vw, 160px); left: 50%; transform: translateX(-50%);
  z-index: 3; width: clamp(222px, 17.4vw, 310px); height: auto;
}
@media (min-width: 800px){ .hero{ min-height: 92vh; } }

/* ---------- ARTISTS (home) ---------- */
.artists{ padding: clamp(70px, 9vw, 130px) 0; }
.artists-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: clamp(32px, 4vw, 56px); }
.artist-card-link{ display:block; }
.artist-schedule{ display:flex; align-items:center; gap: 14px; }
.artist-schedule-text{ display:flex; flex-direction:column; gap: 4px; }
.artist-schedule-venue{ font-size: clamp(12px, 0.9vw, 13px); color: var(--black); opacity:.55; }
.artist-photo-wrap{
  position:relative; width:100%; padding-top: 76.57%; /* 317/414 forced ratio, works in every browser */
  overflow:hidden; margin-bottom: 30px; background:#ddd;
}
.artist-photo{
  position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;
  filter: grayscale(100%);
  transition: filter .3s ease;
}
article:hover .artist-photo{ filter: grayscale(60%); }

/* ---------- SPLIT SECTIONS (home) ---------- */
.split-section{ padding: clamp(50px, 6vw, 80px) 0; }
.section-mikhail{ background: rgba(0,0,0,0.05); }
.split-grid{ display:grid; grid-template-columns: 1fr 1.1fr; gap: clamp(40px, 6vw, 90px); align-items:center; }
.split-grid.reverse{ grid-template-columns: 1.1fr 1fr; }
.split-grid.reverse .split-image{ order: -1; }
.split-image{ position:relative; width:100%; padding-top: 65.5%; overflow:hidden; }
.split-image picture{ position:absolute; inset:0; display:block; }
.split-image img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter: grayscale(100%); }

/* ---------- VENUE STRIP (3 photos + text below — shared by both pages) ---------- */
.venue-strip{ padding: clamp(50px, 6vw, 80px) 0; }
.venue-strip-photos{
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: clamp(8px, 1vw, 14px);
  border-radius: 6px; overflow:hidden;
  margin-bottom: clamp(36px, 4.5vw, 56px);
}
.venue-strip-photos img{
  width:100%; height:100%; aspect-ratio: 4/3; object-fit:cover; display:block;
  filter: saturate(1.05) contrast(1.02);
}
.venue-strip-photos.single{ grid-template-columns: 1fr; }
.venue-strip-photos.single img{ aspect-ratio: 21/8; }
.venue-strip-text{ max-width: 700px; margin: 0 auto; text-align:center; }
.venue-strip-text .t-location{ margin: 2px auto 18px; }
.venue-strip-text .t-section-title{ margin-bottom: 8px; }
.venue-strip-text h2{
  font-family: var(--font); color: var(--black); font-weight:700;
  font-size: clamp(26px, 2.6vw, 38px); line-height:1.14; letter-spacing:-0.4px; margin-bottom: 2px;
}
.venue-strip-text .t-body{ max-width: none; margin: 0 auto; }
.venue-strip-link{
  display:inline-block; margin-top: clamp(18px, 2.4vw, 28px);
  color: var(--blue); font-weight: 700; font-size: clamp(13px, 1vw, 14px);
  letter-spacing: 1px; text-decoration: underline; text-underline-offset: 3px;
}
.venue-strip-link:hover{ opacity: .78; }

/* ---------- FOOTER ---------- */
.footer{ background: var(--black); padding: clamp(90px, 9.8vw, 134px) 0 0; }
.footer-grid{
  display:grid; grid-template-columns: 1.3fr 1fr 1.3fr; gap: clamp(32px, 4vw, 64px);
  padding-bottom: clamp(67px, 8.4vw, 101px); border-bottom: 1px solid rgba(255,255,255,.1);
}
.footer-brand{ display:flex; flex-direction:column; gap: 10px; align-items:flex-start; }
.footer-logo{ width: 128px; height:auto; display:block; }
.footer-tagline{ color: rgba(255,255,255,.55); font-size: 13px; line-height:1.6; margin-top: 10px; max-width: 240px; }
.footer-social{ display:flex; align-items:center; gap: 14px; margin-top: 18px; }
.footer-social a{
  display:flex; align-items:center; justify-content:center;
  width: 34px; height:34px; border-radius:50%; border: 1px solid rgba(255,255,255,.25);
  color: rgba(255,255,255,.8); transition: border-color .2s ease, color .2s ease, background .2s ease;
}
.footer-social a:hover{ border-color: var(--blue); color: var(--white); background: rgba(83,127,249,.15); }
.footer-links{ display:flex; flex-direction:column; gap: 13px; }
.footer-links a{ color: rgba(255,255,255,.78); font-size: 12.5px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; transition: color .2s ease; }
.footer-links a:hover{ color: var(--white); }
.footer-contact{ display:flex; flex-direction:column; gap: 4px; }
.footer-contact-label{ color: var(--blue); font-size: 11px; font-weight:700; letter-spacing:1.8px; text-transform:uppercase; margin-bottom: 4px; }
.footer-contact-label.spaced{ margin-top: 18px; }
.footer-contact a{ color: rgba(255,255,255,.85); font-size: 13.5px; }
.footer-contact a:hover{ text-decoration: underline; }
.footer-venue{ color: rgba(255,255,255,.5); font-size: 12.5px; line-height:1.65; }
.footer-bar{ background: var(--blue); padding: 31px 0; margin-top: clamp(56px, 7vw, 78px); }

@media (max-width: 700px){
  .footer-grid{ grid-template-columns: 1fr; gap: 34px; text-align:left; }
}

/* ---------- SITE NAV ---------- */
.site-nav{
  position: fixed; top:0; left:0; width:100%; z-index: 1000;
  background: linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,0) 100%);
  transition: background .35s ease, box-shadow .35s ease;
}
.site-nav.scrolled{ background: var(--black); box-shadow: 0 2px 24px rgba(0,0,0,.28); }
.nav-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding: 16px clamp(20px, 4.3vw, 62px) 14px;
  min-height: 62px;
}
.nav-logo{ display:flex; flex-direction:column; align-items:center; gap:3px; }
.nav-logo img{ height: 30px; width:auto; display:block; }
.nav-logo-text{
  display:block; font-family: var(--font); font-size: 10.5px; font-weight:700;
  letter-spacing: 2.4px; text-transform:uppercase; color: var(--white); line-height:1;
  white-space:nowrap;
}
.nav-links{ display:flex; align-items:center; gap: clamp(20px, 2.2vw, 38px); }
.nav-links a{
  color: var(--white); font-size: 12.5px; font-weight:700; letter-spacing: 1.8px; text-transform:uppercase;
  padding: 6px 0; position:relative; opacity:.82; transition: opacity .2s ease;
}
.nav-links a:hover{ opacity:1; }
.nav-links a.active{ opacity:1; }
.nav-links a.active::after{ content:""; position:absolute; left:0; right:0; bottom:-5px; height:2px; background: var(--blue); }
.nav-tickets{ gap:10px; }
.nav-tickets .t-tickets-small{ color: var(--white); }
.nav-toggle{
  display:none; flex-direction:column; justify-content:center; align-items:flex-end; gap:5px;
  width:34px; height:28px; background:none; border:none; cursor:pointer; z-index:1001;
}
.nav-toggle span{ display:block; width:100%; height:2px; background:var(--white); border-radius:2px; transition: transform .25s ease, opacity .25s ease, width .25s ease; }
.nav-toggle.open span:nth-child(1){ transform: translateY(7px) rotate(45deg); width:100%; }
.nav-toggle.open span:nth-child(2){ opacity:0; }
.nav-toggle.open span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); width:100%; }

/* ---------- ABOUT HERO (about page) ---------- */
.about-hero{ background: var(--black); padding: clamp(104px, 12vw, 138px) 0 clamp(36px, 4.5vw, 56px); }
.about-hero-intro{ max-width: 800px; margin: 0 auto; text-align:center; }
.about-hero-intro .t-eyebrow{ color: var(--blue); text-align:center; }
.about-hero-intro h1{
  color: var(--white); font-family: var(--font);
  font-size: clamp(32px, 4.2vw, 58px); font-weight:700; line-height:1.1; letter-spacing:-0.5px;
  margin: 12px 0 14px;
}
.about-hero-meta{
  color: rgba(255,255,255,.62); font-size: clamp(12px, 0.95vw, 13px); font-weight:700;
  letter-spacing: 2.4px; text-transform:uppercase;
}

.dates-grid{
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: 0; margin: clamp(28px, 3.6vw, 46px) 0 14px;
  border-radius: 8px; overflow:hidden;
}
.date-panel{
  position:relative; overflow:hidden; aspect-ratio: 16/10;
  border-left: 1px solid rgba(255,255,255,.14);
  cursor: pointer; outline: none;
}
.date-panel:first-child{ border-left:none; }
.date-panel-face{
  position:absolute; inset:0; z-index:2;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap: 8px;
  transition: opacity .4s ease, transform .4s ease;
  background: var(--black);
}
.date-day{ font-family: var(--font); font-size: clamp(38px, 5vw, 72px); font-weight:700; line-height:1; color: var(--white); letter-spacing:-1.5px; }
.date-meta{ font-size: clamp(11px, .9vw, 13px); font-weight:700; letter-spacing: 3px; color: var(--blue); line-height:1.5; text-align:center; }
.date-panel-hint{ font-size: 9.5px; font-weight:700; letter-spacing: 2.2px; color: rgba(255,255,255,.4); margin-top: 6px; }
.date-panel-reveal{ position:absolute; inset:0; z-index:1; opacity:0; transition: opacity .45s ease; }
.date-panel-photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter: grayscale(35%) brightness(.78); }
.date-panel-scrim{ position:absolute; inset:0; background: linear-gradient(180deg, rgba(83,127,249,.2) 0%, rgba(0,0,0,.2) 40%, rgba(0,0,0,.86) 100%); }
.date-panel-info{
  position:absolute; left: 18px; right: 18px; bottom: 18px;
  display:flex; flex-direction:column; gap: 3px;
  opacity:0; transform: translateY(10px);
  transition: opacity .4s ease .05s, transform .4s ease .05s;
}
.date-panel-role{ color: var(--blue); font-size: 10.5px; font-weight:700; letter-spacing:2px; text-transform:uppercase; }
.date-panel-name{ color: var(--white); font-size: clamp(14.5px, 1.25vw, 17px); font-weight:700; line-height:1.25; }
.date-panel-theme{ color: rgba(255,255,255,.72); font-size: 11.5px; font-style:italic; }
.date-panel-link{ color: var(--white); font-size: 10.5px; font-weight:700; letter-spacing:1px; text-decoration:underline; margin-top:6px; opacity:.82; }
.date-panel-link:hover{ opacity:1; }
.date-panel:hover .date-panel-face,
.date-panel.is-active .date-panel-face{ opacity:0; transform: scale(.94); pointer-events:none; }
.date-panel:hover .date-panel-reveal,
.date-panel.is-active .date-panel-reveal{ opacity:1; }
.date-panel:hover .date-panel-info,
.date-panel.is-active .date-panel-info{ opacity:1; transform: translateY(0); }
.date-panel:focus-visible{ box-shadow: inset 0 0 0 2px var(--blue); }
.dates-note{ text-align:center; color: rgba(255,255,255,.4); font-size: 11.5px; letter-spacing:.3px; margin-top: 18px; }

/* ---------- EDITORIAL BODY (about page) ---------- */
.about-lead{ padding: clamp(64px, 8vw, 110px) 0 0; }
.about-lead-inner{ max-width: 700px; margin: 0 auto; text-align: center; }
.about-lead-inner h2{
  font-family: var(--font); color: var(--black); font-weight:700;
  font-size: clamp(26px, 2.6vw, 38px); line-height:1.16; letter-spacing:-0.4px;
  margin-bottom: clamp(18px, 2.2vw, 26px);
}
.about-lead-inner .t-body{ max-width: none; font-size: clamp(16px, 1.3vw, 19px); line-height:1.75; opacity:.78; }
.about-lead-inner .t-body + .t-body{ margin-top: 18px; }

.about-split-section{ padding: clamp(64px, 8vw, 112px) 0; }
.about-split-grid{ display:grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(40px, 6vw, 84px); align-items:center; }
.about-split-grid.reverse{ grid-template-columns: 1.1fr 0.9fr; }
.about-split-grid.reverse .about-split-image{ order: -1; }
.about-split-image img{
  width:100%; aspect-ratio: 4/4.6; object-fit:cover; border-radius: 6px;
  filter: saturate(1.05) contrast(1.02);
}
.about-split-text .t-eyebrow{ margin-bottom: 14px; }
.about-split-text h2{
  font-family: var(--font); color: var(--black); font-weight:700;
  font-size: clamp(26px, 2.6vw, 38px); line-height:1.14; letter-spacing:-0.4px; margin-bottom: 8px;
}
.about-split-text .t-location{ display:block; color: var(--blue); font-weight:700; font-size: clamp(12px,1vw,14px); letter-spacing:1.6px; margin-bottom: 18px; }
.about-split-text .t-body{ max-width: 480px; }
.about-split-text .inline-quote{
  margin-top: clamp(20px, 2.6vw, 30px);
  padding-left: 18px;
  border-left: 3px solid var(--blue);
  font-family: var(--font); font-style: italic; font-weight:700;
  color: var(--black); font-size: clamp(17px, 1.6vw, 22px); line-height:1.42; letter-spacing:-0.2px;
  max-width: 480px;
}
.about-split-text .inline-quote-attr{
  display:block; margin-top: 10px; font-style:normal; font-weight:700;
  letter-spacing: 1.6px; text-transform:uppercase; font-size: 11px; opacity:.5;
}
.artist-bio .inline-quote{
  margin: 4px 0 clamp(30px, 3.6vw, 44px);
  padding-left: 18px;
  border-left: 3px solid var(--blue);
  font-family: var(--font); font-style: italic; font-weight:700;
  color: var(--black); font-size: clamp(18px, 1.7vw, 23px); line-height:1.42; letter-spacing:-0.2px;
  max-width: 620px;
}
.artist-bio .inline-quote-attr{
  display:block; margin-top: 10px; font-style:normal; font-weight:700;
  letter-spacing: 1.6px; text-transform:uppercase; font-size: 11px; opacity:.5;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 900px){
  .artists-grid{ grid-template-columns: 1fr; gap: 56px; }
  .split-grid, .split-grid.reverse{ grid-template-columns: 1fr; gap: 34px; }
  .split-grid.reverse .split-image{ order: 0; }
  .t-body{ max-width: none; }
  .t-tagline{ font-style: normal; }
  .about-split-grid, .about-split-grid.reverse{ grid-template-columns: 1fr; gap: 32px; }
  .about-split-grid.reverse .about-split-image{ order: 0; }
  .about-split-text .t-body{ max-width:none; }
}
@media (max-width: 700px){
  .hero{ min-height: 74vh; }
  .hero-inner{ gap: 20px; }
  .t-tagline{ font-size: 30px; max-width: 340px; line-height:1.25; }
  .tagline-break{ display: inline; }
  .t-dates{ font-size: 17px; letter-spacing: 2.2px; }
  .t-venue-line{ font-size: 13px; letter-spacing: 1.8px; }
  .hero-inner{ padding-bottom: clamp(90px, 16vw, 130px); }
}
@media (max-width: 900px){
  .nav-toggle{ display:flex; }
  .nav-links{
    position:fixed; inset:0; z-index:999;
    flex-direction:column; align-items:flex-start; justify-content:center; gap:30px;
    padding: 100px clamp(28px,8vw,60px) 60px;
    background: var(--black);
    transform: translateX(100%); transition: transform .35s ease;
  }
  .nav-links.open{ transform: translateX(0); }
  .nav-links a{ font-size: 19px; letter-spacing:2px; }
  .nav-tickets{ margin-top: 10px; }
}
@media (max-width: 700px){
  .venue-strip-photos{ grid-template-columns: 1fr; }
  .venue-strip-photos img{ aspect-ratio: 16/10; }
  .dates-grid{ grid-template-columns: 1fr; border-radius: 0; }
  .date-panel{ aspect-ratio: 16/10; border-left:none; border-top: 1px solid rgba(255,255,255,.14); }
  .date-panel:first-child{ border-top:none; }
}

/* ==========================================================================
   PATROCINIOS (sponsors page)
   ========================================================================== */

/* ---------- HEADER (dark, contains the nav + all intro copy) ---------- */
.sponsor-header{ background: var(--black); padding: clamp(96px, 11vw, 128px) 0 clamp(44px, 5vw, 60px); }
.sponsor-header .split-grid{ align-items:stretch; }
.sponsor-header-text{ padding-bottom: clamp(12px, 1.6vw, 20px); }
.sponsor-header .t-eyebrow{ color: var(--blue); }
.sponsor-header h1{
  font-family: var(--font); color: var(--white); font-weight:700;
  font-size: clamp(28px, 3.2vw, 42px); line-height:1.14; letter-spacing:-0.5px;
  margin-bottom: clamp(18px, 2.2vw, 26px); max-width: 480px;
}
.sponsor-header .t-body{
  color: rgba(255,255,255,.78); max-width: 460px;
}
.sponsor-header .t-body + .t-body{ margin-top: 14px; }
.sponsor-header .inline-quote{
  margin-top: clamp(22px, 2.6vw, 30px);
  padding-left: 18px;
  border-left: 3px solid var(--blue);
  font-family: var(--font); font-style: italic; font-weight:700;
  color: var(--white); font-size: clamp(16px, 1.5vw, 20px); line-height:1.42; letter-spacing:-0.2px;
  max-width: 440px;
}
.sponsor-header-note{
  margin-top: clamp(22px, 2.6vw, 30px);
  padding-left: 18px;
  border-left: 3px solid var(--blue);
  font-family: var(--font); font-weight:500;
  color: rgba(255,255,255,.7); font-size: clamp(14px, 1.05vw, 16px); line-height:1.65;
  max-width: 460px;
}
.sponsor-header-image{
  height:100%; box-sizing: border-box; padding-bottom: clamp(12px, 1.6vw, 20px);
  display:flex; flex-direction:column;
}
.sponsor-header-image-photo{
  position:relative; flex: 1 1 auto; min-height:0; border-radius: 8px; overflow:hidden; background: var(--black);
}
.sponsor-header-image-photo img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position: top; display:block;
  filter: saturate(1.05) contrast(1.05) brightness(.94);
}
.sponsor-header-image-photo::before{
  content:""; position:absolute; top:0; left:0; right:0; height:35%; z-index:2; pointer-events:none;
  background: linear-gradient(to bottom, var(--black) 0%, rgba(5,6,6,.5) 45%, rgba(5,6,6,0) 100%);
}
.sponsor-header-image-photo::after{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  box-shadow: inset 0 0 60px 26px rgba(0,0,0,.5);
  background: linear-gradient(to top, var(--black) 0%, rgba(5,6,6,0) 40%);
}
.sponsor-header-image-caption{
  margin: 14px 2px 0;
  font-size: 14px; line-height:1.6; color: rgba(255,255,255,.5);
}

/* ---------- SPONSOR LOGOS ---------- */
.sponsor-logos{ padding: clamp(56px, 7vw, 90px) 0; background: rgba(0,0,0,0.03); }
.sponsor-logos-heading{
  text-align:center; margin: 0 auto clamp(30px, 4vw, 44px); font-family: var(--font);
  font-weight:700; color: var(--black); font-size: clamp(20px, 2vw, 26px); letter-spacing:-0.2px;
}
.sponsor-logo-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap: clamp(16px, 2vw, 24px); }
.sponsor-logo-placeholder{
  aspect-ratio: 3/1.6; border: 1px dashed rgba(0,0,0,.25); border-radius: 8px;
  display:flex; align-items:center; justify-content:center; background: var(--white);
  color: rgba(0,0,0,.32); font-size: 12px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase;
}

/* ---------- CONTACT FORM ---------- */
.sponsor-contact{ padding: clamp(70px, 8vw, 110px) 0; scroll-margin-top: 90px; }
.sponsor-contact-head{ max-width: 640px; margin: 0 auto clamp(36px, 4vw, 48px); text-align:center; }
.sponsor-contact-alt{ text-align:center; margin-top: 22px; font-size: 13.5px; color: var(--black); opacity:.65; }
.sponsor-contact-alt a{ color: var(--blue); font-weight:700; }
.sponsor-contact-alt a:hover{ text-decoration: underline; }
.sponsor-contact-head .t-eyebrow{ text-align:center; }
.sponsor-contact-head h2{
  font-family: var(--font); color: var(--black); font-weight:700;
  font-size: clamp(24px, 2.4vw, 32px); line-height:1.2; letter-spacing:-0.3px; margin-bottom: 10px;
}
.sponsor-contact-head p{ color: var(--black); opacity:.72; font-size: clamp(14px, 1vw, 16px); }

.sponsor-form{ max-width: 720px; margin: 0 auto; display:grid; grid-template-columns: 1fr 1fr; gap: 18px 20px; }
.form-field{ display:flex; flex-direction:column; gap: 8px; }
.form-field.full{ grid-column: 1 / -1; }
.form-field label{
  font-size: 11px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color: var(--black); opacity:.55;
}
.form-field input, .form-field textarea{
  font-family: var(--font); font-size: 14.5px; color: var(--black);
  border: 1px solid rgba(0,0,0,.18); border-radius: 5px; padding: 12px 14px;
  background: var(--white); outline: none; transition: border-color .2s ease;
}
.form-field input:focus, .form-field textarea:focus{ border-color: var(--blue); }
.form-field textarea{ min-height: 110px; resize: vertical; }
.form-submit{
  grid-column: 1 / -1; margin-top: 4px; justify-self:flex-start;
  display:inline-flex; align-items:center; justify-content:center;
  background: var(--blue); color: var(--white); border:none; border-radius: 6px;
  font-family: var(--font); font-weight:700; font-size: 13px; letter-spacing: 1.6px; text-transform:uppercase;
  padding: 15px 34px; cursor:pointer; transition: background .25s ease, transform .25s ease;
}
.form-submit:hover{ background:#3d68e0; transform: scale(1.02); }
.sponsor-form .form-submit{ justify-self:center; }

@media (max-width: 900px){
  .sponsor-header-image-photo{ aspect-ratio: 460 / 480; flex: none; }

  /* Reordenar: titular+texto principal > form > imagen+pie > texto largo de Cosimo.
     "Aplanamos" los contenedores intermedios para que todo sea reordenable con order.
     .sponsor-header-main agrupa título+párrafos en UN solo bloque (mismo fondo, sin
     huecos blancos entre márgenes) para poder moverlo como unidad. */
  .sponsor-page-main{ display:flex; flex-direction:column; }
  .sponsor-page-main > .sponsor-header,
  .sponsor-header .wrap,
  .sponsor-header .split-grid,
  .sponsor-header-text{ display:contents; }

  .sponsor-header-main{
    order:1; background: var(--black);
    padding: clamp(96px, 11vw, 128px) clamp(20px, 4.3vw, 62px) clamp(30px, 4vw, 40px);
  }
  .sponsor-header .venue-strip-link{ display:none; }
  .sponsor-contact{ order:2; background: var(--white); }
  .sponsor-header-image{
    order:3; height:auto; background: var(--black);
    padding: clamp(30px, 4vw, 40px) clamp(20px, 4.3vw, 62px) clamp(12px, 1.6vw, 20px);
  }
  .sponsor-header-note{
    order:4; background: var(--black); position:relative; border-left:none; max-width:none; margin-top:0;
    padding: clamp(20px, 3vw, 28px) clamp(20px, 4.3vw, 62px) clamp(44px, 5vw, 60px) calc(clamp(20px, 4.3vw, 62px) + 18px);
  }
  .sponsor-header-note::before{
    content:""; position:absolute; top: clamp(20px, 3vw, 28px); bottom: clamp(44px, 5vw, 60px);
    left: clamp(20px, 4.3vw, 62px); width:3px; background: var(--blue);
  }
  /* El pie de foto corto queda redundante: la nota de abajo repite "Cosimo I de Médici...". */
  .sponsor-header-image-caption{ display:none; }
}
@media (max-width: 980px){
  .sponsor-logo-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px){
  .sponsor-logo-grid{ grid-template-columns: 1fr; }
  .sponsor-form{ grid-template-columns: 1fr; }
}

/* ==========================================================================
   ARTIST DETAIL PAGE
   ========================================================================== */

/* ---------- HERO: photo with name/role scrim ---------- */
.artist-hero{
  position:relative; background: var(--black); overflow:hidden;
  min-height: clamp(360px, 44vw, 540px);
  display:flex; align-items:flex-end;
}
.artist-hero img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position: center 15%; filter: grayscale(100%);
}
.artist-hero::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(5,6,6,0) 35%, rgba(5,6,6,.6) 72%, rgba(5,6,6,.94) 100%);
}
.artist-hero-inner{ position:relative; z-index:2; width:100%; padding: 0 0 clamp(30px, 4vw, 48px); }
.artist-hero-name{
  font-family: var(--font); color: var(--white); font-weight:700;
  font-size: clamp(30px, 4.4vw, 54px); line-height:1.08; letter-spacing:-0.5px;
}
.artist-hero-role{
  display:block; margin-top: 10px; color: var(--blue);
  font-size: clamp(12px, 1vw, 14px); font-weight:700; letter-spacing:2.4px; text-transform:uppercase;
}
.artist-hero-tagline{
  margin-top: 14px; color: rgba(255,255,255,.85); font-family: var(--font); font-style: italic;
  font-size: clamp(15px, 1.3vw, 18px); line-height:1.5; max-width: 480px;
}

/* ---------- MAIN: velada copy + info card | playlist ---------- */
.artist-main{ padding: clamp(56px, 7vw, 90px) 0; }
.artist-main-grid{ display:grid; grid-template-columns: 1.1fr 1fr; gap: clamp(40px, 5vw, 70px); align-items:stretch; }
.artist-main .t-eyebrow{ margin-bottom: 18px; }
.artist-main .t-body{ max-width:none; }
.artist-velada-lead{
  font-family: var(--font); color: var(--black); font-weight:700;
  font-size: clamp(19px, 1.7vw, 22px); line-height:1.55; letter-spacing:-0.2px;
  max-width: 560px;
}
.artist-velada-note{ margin-top: 10px; font-size: clamp(19px, 1.7vw, 22px); line-height:1.55; color: var(--black); opacity:.75; max-width: 560px; }
.artist-repertoire{ margin-top: 14px; font-size: clamp(19px, 1.7vw, 22px); line-height:1.55; color: var(--black); opacity:.75; max-width: 560px; }
.artist-repertoire strong{ font-weight:700; opacity:1; }
.artist-main-video{ padding-top: 0; }

.playlist-embed{ display:flex; }
.playlist-embed iframe{ width:100%; height:100%; min-height: 420px; display:block; border:none; }

.playlist-card{
  display:flex; align-items:center; gap: 16px;
  border: 1px solid rgba(0,0,0,.14); border-radius: 8px;
  padding: 15px 18px; margin-top: clamp(26px, 3.2vw, 34px); max-width: 460px;
  transition: border-color .2s ease, background .2s ease;
}
.playlist-card:hover{ border-color: rgba(0,0,0,.28); background: rgba(0,0,0,.015); }
.playlist-icon{
  flex:none; width: 38px; height:38px; border-radius:50%;
  background: rgba(0,0,0,.05); display:flex; align-items:center; justify-content:center;
  color: var(--black); opacity:.7;
}
.playlist-text{ flex:1; min-width:0; display:flex; flex-direction:column; gap: 3px; }
.playlist-label{ font-size: 10.5px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; color: var(--black); opacity:.5; }
.playlist-title{ font-size: 14px; font-weight:700; color: var(--black); }
.playlist-play{
  flex:none; width: 34px; height:34px; border-radius:50%;
  background: var(--blue); color: var(--white); display:flex; align-items:center; justify-content:center;
}

.artist-info-card{
  border: 1px solid rgba(0,0,0,.14); border-radius: 8px; margin-top: clamp(28px, 3.4vw, 36px);
  padding: clamp(26px, 2.2vw, 32px); display:flex; flex-direction:column; gap: 20px; max-width: 460px;
}
.info-label{ font-size: 10.5px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color: var(--black); opacity:.5; margin-bottom: 5px; display:block; }
.info-value{ font-size: clamp(16px, 1.3vw, 18px); font-weight:700; color: var(--black); display:block; }
.info-sub{ font-size: 12.5px; color: var(--black); opacity:.6; margin-top: 2px; display:block; }
.info-divider{ border:none; border-top: 1px solid rgba(0,0,0,.12); }
.info-festival{ text-align:center; font-size: 11.5px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color: var(--black); opacity:.5; }
.buy-tickets-btn{
  display:flex; align-items:center; justify-content:center;
  background: var(--blue); color: var(--white); border:none; border-radius: 6px;
  font-family: var(--font); font-weight:700; font-size: 13px; letter-spacing:1.6px; text-transform:uppercase;
  padding: 15px 20px; cursor:pointer; transition: background .25s ease, transform .25s ease; text-align:center;
}
.buy-tickets-btn:hover{ background:#3d68e0; transform: scale(1.02); }

/* ---------- VIDEO EMBED PLACEHOLDER ---------- */
.artist-video{
  margin-top: clamp(50px, 6vw, 78px);
  aspect-ratio: 16/7.5; border-radius: 8px; overflow:hidden; background: rgba(0,0,0,.035);
}
.artist-video iframe{ width:100%; height:100%; display:block; border:none; }
.artist-video-inner{ display:flex; flex-direction:column; align-items:center; gap: 10px; }
.video-play-btn{
  width: 60px; height:60px; border-radius:50%; border: 1.5px solid rgba(0,0,0,.22);
  display:flex; align-items:center; justify-content:center; color: var(--black); opacity:.6;
}
.video-label{ font-size: 11.5px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color: var(--black); opacity:.4; }

/* ---------- BIOGRAPHY ---------- */
.artist-bio{ padding: clamp(56px, 7vw, 90px) 0; background: rgba(0,0,0,0.03); }
.artist-bio .t-eyebrow{ margin-bottom: 22px; }
.artist-bio-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 4vw, 56px); }
.artist-bio-grid .t-body{ max-width:none; }
.artist-bio-grid .t-body + .t-body{ margin-top: 16px; }
.artist-bio-closing{
  font-family: var(--font); font-weight:700; color: var(--black);
  font-size: clamp(16px, 1.5vw, 19px); line-height:1.5; letter-spacing:-0.2px; margin-top: 18px;
}

@media (max-width: 900px){
  .artist-main-grid{ grid-template-columns: 1fr; gap: 36px; }
  .artist-bio-grid{ grid-template-columns: 1fr; }
}

/* ==========================================================================
   ENTRADAS (tickets page)
   ========================================================================== */

/* ---------- HEADER (dark, contains the nav) ---------- */
.tickets-header{ background: var(--black); padding: clamp(96px, 11vw, 128px) 0 clamp(44px, 5vw, 60px); }
.tickets-header .t-eyebrow{ color: var(--blue); }
.tickets-header h1{
  font-family: var(--font); color: var(--white); font-weight:700;
  font-size: clamp(30px, 3.6vw, 46px); line-height:1.14; letter-spacing:-0.5px;
  margin: 14px 0 18px; max-width: 640px;
}
.tickets-header p{ color: rgba(255,255,255,.75); font-size: clamp(15px, 1.15vw, 17px); line-height:1.65; max-width: 560px; }

/* ---------- LIST ---------- */
.tickets-list-section{ padding: clamp(56px, 7vw, 90px) 0; }
.tickets-list{ border: 1px solid rgba(0,0,0,.12); border-radius: 8px; overflow:hidden; background: var(--white); }
.ticket-row{ display:flex; align-items:center; gap: clamp(18px, 2vw, 28px); padding: clamp(20px, 2vw, 28px) clamp(20px, 2.2vw, 30px); scroll-margin-top: 100px; }
.ticket-row + .ticket-row{ border-top: 1px solid rgba(0,0,0,.1); }
.ticket-thumb{ flex:none; width: 64px; height:64px; border-radius: 6px; overflow:hidden; background: rgba(0,0,0,.05); }
.ticket-thumb img{ width:100%; height:100%; object-fit:cover; filter: grayscale(100%); display:block; }
.ticket-info{ flex:1; min-width:0; }
.ticket-datetime{ display:block; font-size: 11.5px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; color: var(--black); opacity:.5; margin-bottom: 6px; }
.ticket-name{ font-family: var(--font); font-weight:700; color: var(--black); font-size: clamp(18px, 1.6vw, 22px); letter-spacing:-0.2px; }
.ticket-name a{ color:inherit; }
.ticket-name a:hover{ text-decoration: underline; }
.ticket-role{ display:block; margin-top: 4px; font-size: 11.5px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color: var(--blue); }
.ticket-action{ flex:none; display:flex; flex-direction:column; align-items:flex-end; gap: 9px; text-align:right; }
.ticket-price{ font-family: var(--font); font-weight:700; color: var(--black); font-size: clamp(17px, 1.4vw, 20px); }
.ticket-buy-btn{
  display:inline-flex; align-items:center; justify-content:center;
  background: var(--blue); color: var(--white); border:none; border-radius: 6px;
  font-family: var(--font); font-weight:700; font-size: 12.5px; letter-spacing:1.4px; text-transform:uppercase;
  padding: 12px 20px; cursor:pointer; transition: background .25s ease, transform .25s ease; white-space:nowrap;
}
.ticket-buy-btn:hover{ background:#3d68e0; transform: scale(1.02); }
.ticket-venue{ font-size: 12px; color: var(--black); opacity:.5; }

.ticket-price-tiers{ display:flex; flex-direction:column; align-items:flex-end; gap: 3px; }
.ticket-price-tiers span{ font-size: 13px; color: var(--black); opacity:.85; white-space:nowrap; }
.ticket-price-tiers strong{ font-family: var(--font); font-weight:700; }

.tickets-notify{ padding: 0 0 clamp(70px, 8vw, 100px); }
.tickets-notify-inner{ max-width: 560px; margin: 0 auto; text-align:center; }
.tickets-notify-inner h2{
  font-family: var(--font); color: var(--black); font-weight:700;
  font-size: clamp(22px, 2.2vw, 28px); line-height:1.2; letter-spacing:-0.3px; margin-bottom: 12px;
}
.tickets-notify-inner .t-body{ max-width:none; margin-bottom: 24px; }
.tickets-notify-form{ display:flex; gap: 10px; margin-bottom: 20px; }
.tickets-notify-form input{
  flex:1; font-family: var(--font); font-size: 14.5px; color: var(--black);
  border: 1px solid rgba(0,0,0,.18); border-radius: 5px; padding: 13px 16px; outline:none;
}
.tickets-notify-form input:focus{ border-color: var(--blue); }
.tickets-notify-form .form-submit{ padding: 13px 26px; white-space:nowrap; }
.tickets-notify-instagram{ display:inline-block; font-size: 13px; font-weight:700; color: var(--blue); }
.tickets-notify-instagram:hover{ text-decoration: underline; }

@media (max-width: 500px){
  .tickets-notify-form{ flex-direction:column; }
}

.tickets-footnote{ margin-top: clamp(20px, 2.4vw, 28px); font-size: 12.5px; color: var(--black); opacity:.55; line-height:1.6; max-width: 720px; }

@media (max-width: 700px){
  .ticket-row{ flex-wrap:wrap; }
  .ticket-info{ flex: 1 1 calc(100% - 82px); }
  .ticket-action{ flex: 1 1 100%; align-items:flex-start; text-align:left; margin-top: 14px; }
  .ticket-price-tiers{ align-items:flex-start; }
  .ticket-buy-btn{ width:100%; }
}

/* ==========================================================================
   LINEUP (artists overview page)
   ========================================================================== */

.lineup-header-section{ background: var(--black); padding: clamp(96px, 11vw, 128px) 0 clamp(44px, 5vw, 60px); }
.lineup-header-section .t-eyebrow{ color: var(--blue); }
.lineup-header-section h1{
  font-family: var(--font); color: var(--white); font-weight:700;
  font-size: clamp(28px, 3.2vw, 42px); line-height:1.14; letter-spacing:-0.5px; margin-top: 14px;
}

.lineup-list{ border-radius: 8px; overflow:hidden; }
.lineup-row{ display:grid; grid-template-columns: 1fr 1fr; min-height: clamp(320px, 34vw, 420px); }
.lineup-row.reverse .lineup-photo{ order:2; }
.lineup-row.reverse .lineup-text{ order:1; }
.lineup-photo{ position:relative; overflow:hidden; background:#e8e6e0; }
.lineup-photo img{ width:100%; height:100%; object-fit:cover; filter: grayscale(100%); display:block; }
.lineup-text{ background: rgba(0,0,0,.03); display:flex; flex-direction:column; justify-content:center; padding: clamp(30px, 4vw, 56px); }
.lineup-date{ font-size: 11.5px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color: var(--black); opacity:.5; margin-bottom: 14px; }
.lineup-name{ font-family: var(--font); font-weight:700; color: var(--black); font-size: clamp(24px, 2.6vw, 34px); line-height:1.15; letter-spacing:-0.4px; margin-bottom: 8px; }
.lineup-role{ display:block; font-size: 11.5px; font-weight:700; letter-spacing:1.8px; text-transform:uppercase; color: var(--blue); margin-bottom: 16px; }
.lineup-desc{ font-size: clamp(14.5px, 1.1vw, 16px); line-height:1.65; color: var(--black); opacity:.78; max-width: 420px; margin-bottom: 22px; }
.lineup-actions{ display:flex; flex-direction:column; align-items:flex-start; gap: 14px; }
.lineup-more{ display:inline-flex; align-items:center; gap: 8px; font-size: 13px; font-weight:700; letter-spacing:0.5px; color: var(--black); width: fit-content; }
.lineup-more svg{ transition: transform .2s ease; flex:none; }
.lineup-more:hover svg{ transform: translateX(3px); }

@media (max-width: 800px){
  .lineup-row, .lineup-row.reverse{ grid-template-columns: 1fr; min-height:auto; }
  .lineup-row .lineup-photo, .lineup-row.reverse .lineup-photo{ order:1; aspect-ratio: 16/10; }
  .lineup-row .lineup-text, .lineup-row.reverse .lineup-text{ order:2; padding: 34px clamp(20px,4.3vw,40px); }
}

/* ==========================================================================
   ABOUT PAGE — new intro layout (photo banner + headline/copy + info cards)
   ========================================================================== */

.about-photo-hero{ position:relative; height: clamp(320px, 42vw, 480px); overflow:hidden; background: var(--black); }
.about-photo-hero img{ width:100%; height:100%; object-fit:cover; display:block; filter: saturate(1.05) contrast(1.02); }
.about-photo-hero-scrim{ position:absolute; inset:0; background: linear-gradient(180deg, rgba(5,6,6,0) 45%, rgba(5,6,6,.8) 100%); }
.about-photo-hero-quote-wrap{ position:absolute; left:0; right:0; bottom: clamp(28px, 3.6vw, 48px); z-index:2; }
.about-photo-hero-quote{
  color: var(--white); font-family: var(--font); font-weight:700;
  font-size: clamp(28px, 3.6vw, 46px); line-height:1.14; letter-spacing:-0.5px; max-width: 760px;
}

.about-intro{ padding: clamp(56px, 7vw, 90px) 0; }
.about-intro-grid{ display:grid; grid-template-columns: 1.6fr 1fr; gap: clamp(40px, 5vw, 70px); align-items:start; }
.about-intro-text .t-eyebrow{ margin-bottom: 18px; }
.about-intro-headline{
  font-family: var(--font); font-weight:700; color: var(--black);
  font-size: clamp(24px, 2.6vw, 34px); line-height:1.32; letter-spacing:-0.3px; margin-bottom: 26px;
}
.about-intro-text .t-body{ max-width:none; }
.about-intro-text .t-body + .t-body{ margin-top: 16px; }
.about-scroll-hint{
  display:inline-flex; align-items:center; justify-content:center;
  width: 44px; height:44px; border-radius:50%; border: 1px solid rgba(0,0,0,.2);
  margin-top: 32px; color: var(--black); transition: background .2s ease, transform .2s ease;
}
.about-scroll-hint:hover{ background: rgba(0,0,0,.04); transform: translateY(3px); }

.info-cards{
  display:flex; flex-direction:column; gap: 20px;
  border: 1px solid rgba(0,0,0,.14); border-radius: 8px; padding: clamp(26px, 2.2vw, 32px);
}
.info-card-item{}
.info-card-divider{ border:none; border-top: 1px solid rgba(0,0,0,.12); }
.info-card-label{ display:block; font-size: 10.5px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color: var(--black); opacity:.5; margin-bottom: 5px; }
.info-card-value{ display:block; font-size: 15px; font-weight:700; color: var(--black); line-height:1.5; }

@media (max-width: 900px){
  .about-intro-grid{ grid-template-columns: 1fr; gap: 40px; }
}

/* ==========================================================================
   CONTACTO
   ========================================================================== */

.contact-header{ background: var(--black); padding: clamp(96px, 11vw, 128px) 0 clamp(44px, 5vw, 60px); }
.contact-header .t-eyebrow{ color: var(--blue); }
.contact-header h1{
  font-family: var(--font); color: var(--white); font-weight:700;
  font-size: clamp(30px, 3.6vw, 46px); line-height:1.14; letter-spacing:-0.5px;
  margin: 14px 0 18px; max-width: 640px;
}
.contact-header p{ color: rgba(255,255,255,.75); font-size: clamp(15px, 1.15vw, 17px); line-height:1.65; max-width: 560px; }

.contact-main{ padding: clamp(56px, 7vw, 90px) 0; }
.contact-grid{ display:grid; grid-template-columns: 0.85fr 1.15fr; gap: clamp(40px, 5vw, 74px); align-items:start; }

.contact-info-list{
  display:flex; flex-direction:column; gap: 20px;
  border: 1px solid rgba(0,0,0,.14); border-radius: 8px; padding: clamp(26px, 2.2vw, 32px);
}
.contact-info-list a.info-card-value{ color: var(--black); }
.contact-info-list a.info-card-value:hover{ color: var(--blue); }

@media (max-width: 900px){
  .contact-grid{ grid-template-columns: 1fr; gap: 40px; }
}

/* ==========================================================================
   PLANEA TU NOCHE (visitor info page)
   ========================================================================== */

.visit-header{ background: var(--black); padding: clamp(96px, 11vw, 128px) 0 clamp(44px, 5vw, 60px); }
.visit-header.with-photo{
  position:relative;
  background-image: linear-gradient(180deg, rgba(5,6,6,.5) 0%, rgba(5,6,6,.82) 100%), url('../img/venue-3.jpg');
  background-image: linear-gradient(180deg, rgba(5,6,6,.5) 0%, rgba(5,6,6,.82) 100%), image-set(url('../img/venue-3.webp') type('image/webp') 1x, url('../img/venue-3.jpg') type('image/jpeg') 1x);
  background-size: cover; background-position: center;
}
.visit-header .t-eyebrow{ color: var(--blue); }
.visit-header h1{
  font-family: var(--font); color: var(--white); font-weight:700;
  font-size: clamp(30px, 3.6vw, 46px); line-height:1.14; letter-spacing:-0.5px;
  margin: 14px 0 18px; max-width: 640px;
}
.visit-header p{ color: rgba(255,255,255,.75); font-size: clamp(15px, 1.15vw, 17px); line-height:1.65; max-width: 560px; }

.visit-main{ padding: clamp(56px, 7vw, 90px) 0; }

.visit-map-block{
  display:grid; grid-template-columns: 1.3fr 1fr; gap: clamp(30px, 4vw, 50px); align-items:stretch;
  margin-bottom: clamp(40px, 5vw, 56px);
}
.visit-map-embed{ position:relative; border-radius: 8px; overflow:hidden; min-height: 280px; background: rgba(0,0,0,.05); }
.visit-map-embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.visit-map-info{ display:flex; flex-direction:column; justify-content:center; }
.visit-map-eventline{
  font-family: var(--font); font-weight:700; color: var(--black);
  font-size: clamp(15px, 1.2vw, 17px); line-height:1.45; margin-bottom: 20px;
}

.visit-grid{ display:grid; grid-template-columns: repeat(3, 1fr); border-top: 3px solid var(--blue); }
.visit-card{ padding: clamp(32px, 3vw, 40px) clamp(24px, 2.4vw, 32px); background: var(--white); }
.visit-card:nth-child(2){ background: rgba(0,0,0,.045); }
.visit-card:nth-child(3){ background: rgba(0,0,0,.09); }
.visit-card-icon{ display:block; width: 42px; height:42px; color: var(--black); margin-bottom: 22px; }
.visit-card-icon svg{ width:100%; height:100%; }
.visit-card-label{ display:block; font-size: 11px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color: var(--blue); margin-bottom: 12px; }
.visit-card-title{ display:block; font-family: var(--font); font-weight:700; color: var(--black); font-size: clamp(17px, 1.4vw, 20px); margin-bottom: 10px; }
.visit-card p, .visit-map-info p{ font-size: 14.5px; line-height:1.65; color: var(--black); opacity:.78; }
.visit-card p a{ color: var(--blue); font-weight:700; opacity:1; }
.visit-card p a:hover{ text-decoration: underline; }

@media (max-width: 900px){
  .visit-map-block{ grid-template-columns: 1fr; }
  .visit-map-embed{ min-height: 240px; }
}
@media (max-width: 700px){
  .visit-grid{ grid-template-columns: 1fr; }
  .visit-card:nth-child(2){ background: rgba(0,0,0,.045); }
  .visit-card:nth-child(3){ background: rgba(0,0,0,.09); }
}

/* ==========================================================================
   ABOUT MANIFESTO
   ========================================================================== */

.about-manifesto{ padding: clamp(60px, 7vw, 96px) 0; background: rgba(0,0,0,0.03); }
.about-manifesto-inner{ max-width: 700px; margin: 0 auto; text-align:center; }
.about-manifesto-inner .t-body{ max-width:none; }
.about-manifesto-inner .t-body + .t-body{ margin-top: 20px; }
.about-manifesto-closing{
  font-family: var(--font); font-weight:700; color: var(--black);
  font-size: clamp(19px, 1.9vw, 24px); line-height:1.45; letter-spacing:-0.2px; margin-top: 26px;
}

/* ---------- ARTIST BACK LINK ---------- */
.artist-back-link{
  display:inline-flex; align-items:center; gap: 8px; margin-bottom: 14px;
  color: rgba(255,255,255,.8); font-size: 13px; font-weight:700; letter-spacing:0.3px;
  transition: color .2s ease;
}
.artist-back-link:hover{ color: var(--white); text-decoration:underline; }

/* ==========================================================================
   BLOG
   ========================================================================== */

.blog-header{ background: var(--black); padding: clamp(96px, 11vw, 128px) 0 clamp(44px, 5vw, 60px); }
.blog-header .t-eyebrow{ color: var(--blue); }
.blog-header h1{
  font-family: var(--font); color: var(--white); font-weight:700;
  font-size: clamp(30px, 3.6vw, 46px); line-height:1.14; letter-spacing:-0.5px;
  margin: 14px 0 18px; max-width: 640px;
}
.blog-header p{ color: rgba(255,255,255,.75); font-size: clamp(15px, 1.15vw, 17px); line-height:1.65; max-width: 560px; }

.blog-featured-section{ padding: clamp(56px, 7vw, 90px) 0 0; }
.blog-featured-label{ display:block; font-size: 11px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color: var(--blue); margin-bottom: 20px; }
.blog-featured-card{ display:grid; grid-template-columns: 1.2fr 1fr; gap: clamp(30px, 4vw, 54px); align-items:center; }
.blog-featured-photo{ position:relative; width:100%; padding-top: 66.7%; overflow:hidden; border-radius: 8px; background:#ddd; }
.blog-featured-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter: grayscale(100%); transition: filter .3s ease; }
.blog-featured-card:hover .blog-featured-photo img{ filter: grayscale(60%); }
.blog-featured-title{
  font-family: var(--font); font-weight:700; color: var(--black);
  font-size: clamp(24px, 2.6vw, 34px); line-height:1.2; letter-spacing:-0.3px; margin: 10px 0 14px;
}
.blog-featured-text .blog-card-excerpt{ font-size: 15px; }
.blog-featured-link{ display:inline-block; margin-top: 18px; font-size: 13px; font-weight:700; color: var(--blue); }
.blog-featured-card:hover .blog-featured-link{ text-decoration: underline; }
.blog-main{ padding: clamp(56px, 7vw, 90px) 0; }
.blog-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: clamp(32px, 4vw, 50px); }
.blog-card-link{ display:block; }
.blog-card-photo-wrap{ position:relative; width:100%; padding-top: 66.7%; overflow:hidden; border-radius: 6px; margin-bottom: 22px; background:#ddd; }
.blog-card-photo-wrap img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter: grayscale(100%); transition: filter .3s ease; }
.blog-card-link:hover .blog-card-photo-wrap img{ filter: grayscale(60%); }
.blog-card-date{ display:block; font-size: 11px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; color: var(--blue); margin-bottom: 10px; }
.blog-card-title{ font-family: var(--font); font-weight:700; color: var(--black); font-size: clamp(18px, 1.5vw, 21px); line-height:1.3; letter-spacing:-0.2px; margin-bottom: 8px; }
.blog-card-excerpt{ font-size: 14px; line-height:1.6; color: var(--black); opacity:.72; }

.blog-empty-note{
  margin-top: clamp(50px, 6vw, 70px); padding: clamp(24px, 2.4vw, 30px); text-align:center;
  border: 1px dashed rgba(0,0,0,.2); border-radius: 8px; color: var(--black); opacity:.55; font-size: 13.5px; line-height:1.6;
}

/* ---------- BLOG POST ---------- */
.post-header{ background: var(--black); padding: clamp(96px, 11vw, 128px) 0 clamp(44px, 5vw, 60px); }
.post-header .t-eyebrow{ color: var(--blue); }
.post-header h1{
  font-family: var(--font); color: var(--white); font-weight:700;
  font-size: clamp(28px, 3.6vw, 44px); line-height:1.18; letter-spacing:-0.5px;
  margin: 14px 0 16px; max-width: 820px;
}
.post-header-meta{ display:flex; gap: 18px; flex-wrap:wrap; color: rgba(255,255,255,.6); font-size: 13px; }

.post-body{ padding: clamp(50px, 6vw, 80px) 0; }
.post-body-inner{ max-width: 820px; margin: 0 auto; }

.post-top-row{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap: 16px; margin-bottom: 30px; }

.post-image{ margin: 0 0 32px; }
.post-image img{ width:100%; aspect-ratio: 3/2; border-radius: 8px; display:block; filter: grayscale(100%); object-fit:cover; }
.post-image figcaption{ margin-top: 10px; font-size: 12.5px; color: var(--black); opacity:.5; line-height:1.5; }

.post-video{ position:relative; width:100%; padding-top: 56.25%; margin: 30px 0; border-radius: 8px; overflow:hidden; background: var(--black); }
.post-video iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }

.post-body-inner .t-body{ max-width:none; }
.post-body-inner .t-body + .t-body{ margin-top: 18px; }
.post-body-inner h2{
  font-family: var(--font); font-weight:700; color: var(--black);
  font-size: clamp(21px, 2vw, 26px); letter-spacing:-0.2px; margin: 38px 0 16px;
}
.post-back-link{ display:inline-flex; align-items:center; gap: 8px; font-size: 13px; font-weight:700; color: var(--black); opacity:.7; }
.post-back-link:hover{ opacity:1; text-decoration: underline; }

@media (max-width: 900px){
  .blog-grid{ grid-template-columns: 1fr; gap: 44px; }
  .blog-featured-card{ grid-template-columns: 1fr; gap: 26px; }
}

/* ---------- SHARE BUTTON ---------- */
.share-btn{
  display:inline-flex; align-items:center; gap: 10px; margin-top: 18px;
  background:none; border:none; cursor:pointer; padding:0;
  font-family: var(--font); font-size: 13px; font-weight:700; color: var(--black); opacity:.75;
  transition: opacity .2s ease;
}
.share-btn:hover{ opacity:1; }
.share-btn-icon{
  display:flex; align-items:center; justify-content:center;
  width: 34px; height:34px; border-radius:50%; border: 1px solid rgba(0,0,0,.22); color: var(--black);
  flex:none;
}

/* ---------- LA SEDE (acerca de) ---------- */
.venue-detail{ padding: clamp(60px, 7vw, 96px) 0; background: rgba(0,0,0,0.03); }
.venue-detail h2{
  font-family: var(--font); color: var(--black); font-weight:700;
  font-size: clamp(24px, 2.4vw, 32px); line-height:1.2; letter-spacing:-0.3px; margin-bottom: 16px;
}
.venue-detail > .wrap > .t-body{ max-width: 720px; margin-bottom: clamp(30px, 3.6vw, 44px); }
.venue-salas-grid{ display:grid; grid-template-columns: repeat(2, 1fr); gap: clamp(24px, 3vw, 40px); margin-bottom: clamp(24px, 3vw, 36px); }
.venue-sala-item{ border-top: 2px solid var(--blue); padding-top: 18px; }
.venue-sala-label{ display:block; font-family: var(--font); font-weight:700; color: var(--black); font-size: clamp(15px, 1.2vw, 17px); margin-bottom: 4px; }
.venue-sala-dates{ display:block; font-size: 11.5px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; color: var(--blue); margin-bottom: 12px; }
.venue-sala-item p{ font-size: 14px; line-height:1.65; color: var(--black); opacity:.78; }
.venue-location-note{ font-size: 13px; color: var(--black); opacity:.55; line-height:1.6; }

@media (max-width: 700px){
  .venue-salas-grid{ grid-template-columns: 1fr; }
}

/* ==========================================================================
   Blog dinámico: los <p> y <a> generados desde markdown replican .t-body
   ========================================================================== */
.post-body-inner p{ color: var(--black); font-size: clamp(15px, 1.15vw, 17px); font-weight: 400; line-height: 1.75; letter-spacing: 0.1px; display:block; opacity: .82; }
.post-body-inner p + p{ margin-top: 18px; }

/* ==========================================================================
   BLOG: BLOQUES DE RESUMEN, PUNTOS CLAVE, FAQ, FUENTES Y FIRMA
   Los campos de la capa GEO solo rinden si se imprimen en la página: lo que
   vive únicamente en la ficha del post no lo lee nadie.
   ========================================================================== */

/* Etiqueta chica azul que encabeza cada bloque */
.post-bloque-titulo{
  display:block; color: var(--blue); font-size: 11.5px; font-weight:700;
  letter-spacing:1.6px; text-transform:uppercase; margin-bottom: 12px;
}

/* ---------- RESUMEN CITABLE ---------- */
.post-tldr{
  border-left: 3px solid var(--blue);
  background: rgba(83,127,249,.06);
  border-radius: 0 8px 8px 0;
  padding: clamp(20px, 2.4vw, 28px) clamp(20px, 2.4vw, 30px);
  margin: 0 0 clamp(28px, 3vw, 36px);
}
.post-tldr-texto{
  color: var(--black); font-size: clamp(16px, 1.3vw, 19px); font-weight: 400;
  line-height: 1.6; letter-spacing: 0.1px; opacity: .9;
}

/* ---------- PUNTOS CLAVE ---------- */
.post-puntos{
  border: 1px solid rgba(0,0,0,.12); border-radius: 8px;
  padding: clamp(20px, 2.4vw, 28px) clamp(20px, 2.4vw, 30px);
  margin: 0 0 clamp(30px, 3.4vw, 40px);
}
.post-puntos ul{ list-style:none; margin:0; padding:0; }
.post-puntos li{
  position:relative; padding-left: 22px;
  color: var(--black); font-size: clamp(14.5px, 1.1vw, 16px); line-height:1.65; opacity:.85;
}
.post-puntos li + li{ margin-top: 12px; }
.post-puntos li::before{
  content:''; position:absolute; left:0; top:.62em;
  width:7px; height:7px; border-radius:50%; background: var(--blue);
}

/* ---------- IMAGEN DENTRO DEL TEXTO ---------- */
.post-figura{ margin: clamp(28px, 3vw, 38px) 0; }
.post-figura img{ width:100%; border-radius: 8px; display:block; }
.post-figura figcaption{
  margin-top: 10px; font-size: 12.5px; color: var(--black); opacity:.5; line-height:1.5;
}
.post-figura-credito{
  display:block; margin-top: 3px; font-size: 11.5px; letter-spacing:.4px; text-transform:uppercase; opacity:.75;
}

/* ---------- PREGUNTAS FRECUENTES ---------- */
.post-faq{ margin-top: clamp(40px, 4.4vw, 56px); }
.post-faq h2,
.post-fuentes h2{
  font-family: var(--font); font-weight:700; color: var(--black);
  font-size: clamp(21px, 2vw, 26px); letter-spacing:-0.2px; margin-bottom: 20px;
}
.post-faq dl{ margin:0; border-top: 1px solid rgba(0,0,0,.12); }
.post-faq dt{
  font-family: var(--font); font-weight:700; color: var(--black);
  font-size: clamp(15.5px, 1.2vw, 17.5px); line-height:1.4; padding-top: 20px;
}
.post-faq dd{
  margin: 8px 0 0; padding-bottom: 20px; border-bottom: 1px solid rgba(0,0,0,.12);
  color: var(--black); font-size: clamp(14.5px, 1.1vw, 16px); line-height:1.7; opacity:.82;
}

/* ---------- FUENTES ---------- */
.post-fuentes{ margin-top: clamp(40px, 4.4vw, 56px); }
.post-fuentes ol{ margin:0; padding-left: 20px; }
.post-fuentes li{
  color: var(--black); font-size: clamp(14px, 1.05vw, 15.5px); line-height:1.6; opacity:.85;
}
.post-fuentes li + li{ margin-top: 12px; }
.post-fuentes a{ color: var(--blue); font-weight:700; text-decoration: underline; text-underline-offset: 3px; }
.post-fuente-medio{ display:block; font-size: 12.5px; opacity:.65; margin-top: 2px; }

/* ---------- FIRMA Y VERIFICACIÓN ---------- */
.post-firma{
  margin-top: clamp(40px, 4.4vw, 56px);
  border-top: 2px solid var(--blue); padding-top: 20px;
}
.post-firma-autor{
  font-family: var(--font); font-weight:700; color: var(--black);
  font-size: clamp(16px, 1.25vw, 18px); line-height:1.3;
}
.post-firma-nota{
  margin-top: 8px; color: var(--black); font-size: clamp(14px, 1.05vw, 15.5px); line-height:1.65; opacity:.8;
}
.post-firma-fecha{ margin-top: 8px; font-size: 12.5px; color: var(--black); opacity:.55; }

/* ---------- ARTISTAS MENCIONADOS ---------- */
.post-artistas{ margin-top: clamp(34px, 3.6vw, 44px); }
.post-artistas ul{ list-style:none; margin:0; padding:0; }
.post-artistas li + li{ margin-top: 10px; }
.post-artistas a{
  color: var(--black); font-size: clamp(15px, 1.15vw, 17px); font-weight:700; opacity:.85;
  transition: color .2s ease, opacity .2s ease;
}
.post-artistas a:hover{ color: var(--blue); opacity:1; }

/* ---------- ETIQUETAS ---------- */
.post-etiquetas{ display:flex; flex-wrap:wrap; gap: 10px; margin-top: clamp(34px, 3.6vw, 44px); }
.post-etiquetas a{
  display:inline-block; padding: 7px 14px; border-radius: 100px;
  border: 1px solid rgba(0,0,0,.16); background: transparent;
  font-size: 12.5px; font-weight:700; letter-spacing:.3px; color: var(--black); opacity:.8;
  transition: border-color .2s ease, color .2s ease, opacity .2s ease;
}
.post-etiquetas a:hover{ border-color: var(--blue); color: var(--blue); opacity:1; }
.blog-etiquetas{ margin-top: clamp(50px, 6vw, 76px); padding-top: clamp(28px, 3vw, 36px); border-top: 1px solid rgba(0,0,0,.12); }
.blog-etiquetas .post-etiquetas{ margin-top: 0; }

/* ---------- POSTS RELACIONADOS ---------- */
.post-relacionados{
  padding: clamp(50px, 6vw, 80px) 0;
  border-top: 1px solid rgba(0,0,0,.12);
  background: rgba(0,0,0,.02);
}
.post-relacionados .t-eyebrow{ margin-bottom: 30px; }