/* opheliapastrana.com/conferencias — solo lo que existe en esta sección.
   Tokens, barra, pie, botones y formulario viven en /css/site.css */

.sec-lede{ margin:1.1rem 0 0; max-width:60ch; }
.sec-dark .sec-lede b{ color:#fff; }

/* escena: full-width stage photo band */
.escena{ margin:0; padding:0; background:var(--stage); border-bottom:1px solid var(--rule); }
.escena img{ display:block; width:100%; height:clamp(280px,46vw,560px); object-fit:cover; }

/* trio (¿por qué?) */
.trio{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:var(--gap,2rem); margin-top:2.6rem; gap:2rem; }
.trio article{ border-top:2px solid var(--ink); padding-top:1rem; }
.trio .num{ font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; color:var(--signal); text-transform:uppercase; }
.trio h3{ margin:.5rem 0 .55rem; font-size:1.15rem; line-height:1.1; }
.trio p{ margin:0; color:var(--mute); font-size:.95rem; line-height:1.55; }

/* fit (si / no) */
.split{ display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:2rem; margin-top:2.4rem; }
.fitbox h3{ font-size:1rem; margin-bottom:1rem; }
.fitbox h3 i{ font-style:normal; color:var(--signal); margin-right:.4rem; }
.fitbox ul{ list-style:none; margin:0; padding:0; }
.fitbox li{ border-top:1px solid var(--rule); padding:.8rem 0; color:var(--mute); font-size:.95rem; }
.fitbox li b{ color:var(--ink); font-weight:600; }
.fitbox li a{ color:var(--ink); text-decoration:underline; text-decoration-color:var(--signal);
  text-underline-offset:3px; text-decoration-thickness:1.5px; }
.fitbox li a:hover{ color:var(--signal); }

/* recorrido - the three-beat arc, signature of the conference family */
.arc{ margin-top:2.6rem; border-top:1px solid var(--rule); }
.arc .beat{ display:grid; grid-template-columns:190px 1fr; gap:var(--gap);
  padding:1.6rem 0; border-bottom:1px solid var(--rule); }
.arc .beat-tag{ font-family:var(--mono); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--signal); }
.arc .beat-tag small{ display:block; color:var(--mute); letter-spacing:.12em; margin-top:.35rem; }
.arc h3{ font-size:1.2rem; margin:0 0 .7rem; line-height:1.1; }
.arc ul{ list-style:none; margin:0; padding:0; }
.arc li{ color:var(--mute); font-size:.95rem; padding:.3rem 0 .3rem 1.1rem; position:relative; }
.arc li::before{ content:"◆"; color:var(--signal); font-size:.5rem; position:absolute; left:0; top:.75rem; }
@media (max-width:700px){ .arc .beat{ grid-template-columns:1fr; gap:.6rem; } }

/* llevas */
.give{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1px; background:var(--rule);
  border:1px solid var(--rule); margin-top:2.6rem; }
.give article{ background:var(--paper); padding:1.5rem 1.4rem; }
.sec-haze .give article{ background:var(--haze); }
.give h3{ font-size:.95rem; margin-bottom:.5rem; }
.give p{ margin:0; color:var(--mute); font-size:.92rem; line-height:1.5; }

/* mapa de otras conferencias */
.mapa{ margin-top:2.6rem; border-top:1px solid var(--rule); }
.mapa a, .mapa .aqui{ display:grid; grid-template-columns:110px 1fr auto; gap:1.25rem; align-items:baseline;
  padding:1rem 0; border-bottom:1px solid var(--rule); text-decoration:none; }
.mapa .k{ font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--mute); }
.mapa .t{ font-weight:700; text-transform:uppercase; font-size:.92rem; letter-spacing:-.01em; }
.mapa a:hover .t{ color:var(--signal); }
.mapa .go{ font-family:var(--mono); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color:var(--mute); }
.mapa a:hover .go{ color:var(--signal); }
.mapa .aqui .k, .mapa .aqui .go{ color:var(--signal); }
@media (max-width:600px){ .mapa a, .mapa .aqui{ grid-template-columns:1fr; gap:.2rem; } }

/* conferencista */
.profe .cols{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(2rem,5vw,4rem); align-items:start; }
.profe p{ color:var(--mute); max-width:58ch; }
.profe p b{ color:var(--ink); }
.profe .creds{ list-style:none; margin:1.6rem 0 0; padding:0; }
.profe .creds li{ display:grid; grid-template-columns:150px 1fr; gap:1.25rem; padding:.75rem 0;
  border-top:1px solid var(--rule); align-items:baseline; font-size:.92rem; color:var(--mute); }
.profe .creds .src{ font-family:var(--mono); font-size:.66rem; letter-spacing:.12em; text-transform:uppercase; color:var(--mute); }
.profe .more{ font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--signal); text-decoration:none; border-bottom:2px solid var(--signal); padding-bottom:.2rem; }
.profe .more:hover{ color:var(--ink); border-color:var(--ink); }
@media (max-width:760px){ .profe .cols{ grid-template-columns:1fr; } .profe .creds li{ grid-template-columns:1fr; gap:.15rem; } }

/* the setlist */
.setlist{ border-top:2px solid var(--ink); margin-top:1.6rem; }
a.srow{ display:grid; grid-template-columns:3.6rem 118px 1fr; gap:1.3rem; align-items:start;
  padding:1.5rem .2rem; border-bottom:1px solid var(--rule); text-decoration:none; color:inherit; }
.srow .thumb{ display:block; width:100%; aspect-ratio:9/16; object-fit:cover;
  border:1px solid var(--rule); margin-top:.3rem; }
a.srow:focus-visible{ outline:2px solid var(--signal); outline-offset:3px; }
.srow .num{ font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; color:var(--mute); padding-top:.4rem; }
.srow h3{ margin:0; font-size:clamp(1.25rem,2.6vw,1.7rem); line-height:1.03; text-transform:uppercase; letter-spacing:-.01em; }
.srow .hook{ margin:.5rem 0 .7rem; color:var(--mute); font-size:.96rem; line-height:1.5; max-width:62ch; }
.srow .meta{ display:flex; flex-wrap:wrap; gap:.4rem .45rem; align-items:center;
  font-family:var(--mono); font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; }
.srow .fmt{ color:var(--mute); }
.srow .tag{ border:1px solid var(--rule); padding:.16rem .5rem; }
.srow .badge{ color:var(--signal); font-weight:500; }
.srow .ver{ display:inline-block; margin:.8rem 0 0; font-family:var(--mono); font-size:.66rem;
  letter-spacing:.13em; text-transform:uppercase; color:var(--ink); font-weight:500; }
.srow .ver::after{ content:"→"; display:inline-block; margin-left:.45rem; color:var(--signal);
  transition:transform .18s ease; }
a.srow:hover{ background:var(--haze); }
.srow:hover h3{ color:var(--signal); }
.srow:hover .ver::after{ transform:translateX(4px); }
.srow.hide{ display:none; }

/* a la medida: siempre disponible, marcada en señal */
a.srow.medida{ background:var(--paper); border:2px solid var(--signal); border-bottom:2px solid var(--signal);
  margin-top:1.3rem; padding:1.5rem 1.3rem; grid-template-columns:3.6rem 1fr; }
.srow.medida .num{ color:var(--signal); font-size:1rem; }
.srow.medida .fmt{ color:var(--signal); }
a.srow.medida:hover{ background:var(--haze); }

/* escenarios: filmstrip que invita a recorrer */
.escenarios{ background:var(--stage); color:#fff; padding:3.2rem 0 1.6rem; }
.esc-strip{ display:flex; gap:3px; margin-top:1.8rem; overflow-x:auto;
  scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; cursor:grab;
  scrollbar-color:var(--signal) var(--stage-2); scrollbar-width:thin; }
.esc-strip.arrastrando{ cursor:grabbing; scroll-snap-type:none; }
.esc-strip::-webkit-scrollbar{ height:6px; }
.esc-strip::-webkit-scrollbar-track{ background:var(--stage-2); }
.esc-strip::-webkit-scrollbar-thumb{ background:var(--signal); }
.esc-strip img{ flex:0 0 clamp(250px,31vw,430px); height:clamp(190px,24vw,300px);
  object-fit:cover; scroll-snap-align:start; user-select:none; -webkit-user-drag:none; }

/* la vista desde el escenario */
.punto{ position:relative; margin:0; background:var(--stage); }
.punto img{ display:block; width:100%; height:clamp(360px,50vw,560px); object-fit:cover; }
.punto figcaption{ position:absolute; inset:auto 0 0 0; padding:2.4rem 0 1.8rem;
  background:linear-gradient(transparent, rgba(12,12,12,.88)); }
.punto .eyebrow{ color:var(--signal-on-dark); }
.punto h3{ margin:.3rem 0 0; color:#fff; font-size:clamp(1.4rem,3.4vw,2.2rem);
  text-transform:uppercase; letter-spacing:-.01em; }

/* estado filtrado: se nota que hay más */
#repertorio{ transition:background .35s ease; }
#repertorio.filtrado{ background:#ebebe7; box-shadow:inset 0 4px 0 var(--signal); }
#repertorio.filtrado .setlist{ border-top-color:var(--signal); }
#repertorio.filtrado .srow .num{ color:var(--signal); }
#repertorio.filtrado .srow:hover{ background:#fff; }
#repertorio.filtrado .cuenta{ color:var(--signal); }
.chip[aria-pressed="true"]:not([data-f="todas"]){ background-color:var(--signal);
  border-color:var(--signal); color:#fff; }

.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; border:0; }

@media (max-width:700px){
  a.srow{ grid-template-columns:2.4rem 78px 1fr; gap:.8rem; }
  a.srow.medida{ grid-template-columns:2.4rem 1fr; }
}

/* hero del índice: la conferencia como fondo */
.hero-conf{ background:
    linear-gradient(100deg, rgba(18,18,18,.94) 30%, rgba(18,18,18,.62) 66%, rgba(18,18,18,.82) 100%),
    url("/conferencias/img/hero.jpg") 62% 12% / cover no-repeat var(--stage); }
.hero-conf .lede{ max-width:34rem; }
@media (max-width:820px){
  .hero-conf{ background:
    linear-gradient(rgba(18,18,18,.88), rgba(18,18,18,.92)),
    url("/conferencias/img/hero.jpg") 58% 10% / cover no-repeat var(--stage); }
}

/* cierre */
.cierre h2{ font-size:clamp(2rem,5.4vw,3.6rem); }

/* 'se llevan' sobre fondo oscuro */
.sec-dark .give{ background:var(--rule-dk); border-color:var(--rule-dk); }
.sec-dark .give article{ background:var(--stage-2); }
.sec-dark .give h3{ color:#fff; }
.sec-dark .give p{ color:var(--mute-dk); }
.sec-dark .trio article{ border-top-color:#fff; }
.sec-dark .trio h3{ color:#fff; }
.sec-dark .trio p{ color:var(--mute-dk); }

/* formulario: selector de tema */
.contact-2 .form select{ appearance:none; -webkit-appearance:none; }

@media (max-width:700px){
  a.srow{ grid-template-columns:2.4rem 78px 1fr; gap:.8rem; }
  a.srow.medida{ grid-template-columns:2.4rem 1fr; }
}