:root{
    --primary: #80449e;
    --primary-600: #5c3172;
    --secondary: #d06793;
    --secondary-600: #a65275;
    --cream: #fbfafc;
    --ink: #3e3d3e;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  color:var(--ink);
  background:#fbfafa;
}
.titulo{font-family:'Merriweather', Georgia, serif; font-weight:900; letter-spacing:-0.01em}

/* ---------- Utilidades ---------- */
.no-scrollbar::-webkit-scrollbar{display:none}
.no-scrollbar{scrollbar-width:none}

.eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.68rem; font-weight:800; letter-spacing:.22em;
  text-transform:uppercase; color:var(--primary);
}
.eyebrow::before{
  content:""; width:22px; height:2px; background:var(--primary); border-radius:2px;
}
.eyebrow.justify-center{justify-content:center}

/* ---------- Navegación ---------- */
.nav-glass{
  background:rgba(255,255,255,.86);
  backdrop-filter:saturate(160%) blur(12px);
  -webkit-backdrop-filter:saturate(160%) blur(12px);
}

/* ---------- Botones ---------- */
.btn-primary{
  display:inline-flex; align-items:center; gap:.5rem;
  background:#80449e; color:#fff;
  padding:.75rem 1.25rem; border-radius:.75rem;
  font-weight:700; letter-spacing:.01em;
  box-shadow:0 10px 25px -12px rgba(185,102,144,.55);
  transition:transform .18s ease, background .18s ease, box-shadow .18s ease;
}
.btn-primary:hover{background:#d06793; transform:translateY(-1px)}
.btn-primary:active{transform:translateY(0)}

.btn-ghost{
  display:inline-flex; align-items:center; gap:.45rem;
  border:1.5px solid #e5e7eb; color:#374151;
  padding:.65rem 1.05rem; border-radius:.7rem;
  font-weight:600; background:rgba(255,255,255,.7);
  transition:border-color .18s ease, color .18s ease, background .18s ease;
}
.btn-ghost:hover{border-color:var(--primary); color:var(--primary); background:#fff}

/* ---------- Fondos con degradados sutiles ---------- */
.section-grad-a{
  background:
    radial-gradient(1100px 420px at 85% -10%, rgba(185,102,144,.09), transparent 60%),
    radial-gradient(900px 400px at -10% 110%, rgba(73,123,134,.07), transparent 60%),
    #fbfafa;
}
.section-grad-b{
  background:
    radial-gradient(900px 400px at 10% -10%, rgba(73,123,134,.08), transparent 60%),
    radial-gradient(900px 400px at 110% 110%, rgba(185,102,144,.07), transparent 60%),
    #ffffff;
}
.hero-bg{position:relative}
.hero-bg::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(600px 300px at 15% 10%, rgba(185,102,144,.10), transparent 60%),
    radial-gradient(700px 320px at 90% 0%, rgba(73,123,134,.10), transparent 60%);
}

/* ---------- Reveal animations ---------- */
.reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease}
.reveal.is-visible{opacity:1; transform:none}
.reveal-delay-1{transition-delay:.08s}
.reveal-delay-2{transition-delay:.18s}
.reveal-delay-3{transition-delay:.28s}

/* ---------- Hero carrusel derecha ---------- */
.hero-right-carousel{
  position:relative;
  width:100%;
  aspect-ratio: 4 / 5;
  background:#eadfe4;
  overflow:hidden;
}
@media (min-width: 1024px){
  .hero-right-carousel{aspect-ratio: 4 / 5.2}
}
.hero-right-carousel .slide{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:0; transform:scale(1.04);
  transition:opacity 1.1s ease, transform 6s ease;
}
.hero-right-carousel .slide.is-active{
  opacity:1; transform:scale(1);
}
.hero-right-dots{
  position:absolute; left:50%; bottom:.85rem; transform:translateX(-50%);
  display:flex; gap:.4rem; z-index:5;
}
.hero-right-dots button{
  width:24px; height:4px; border-radius:4px; background:rgba(255,255,255,.45);
  transition:background .2s ease, width .2s ease;
}
.hero-right-dots button[aria-current="true"]{background:#fff; width:34px}

/* ---------- Numeralia ---------- */
.numeralia{
  position:relative;
  padding:1.35rem 1.4rem 1.1rem;
  border-radius:1.2rem;
  background:linear-gradient(135deg, rgba(255,255,255,.85), rgba(247,246,246,.65));
  border:1px solid rgba(73,123,134,.14);
  box-shadow:0 14px 34px -22px rgba(73,123,134,.20);
  backdrop-filter:blur(4px);
}
.numeralia-title{
  font-family:'Merriweather', serif; font-weight:900;
  font-size:.95rem; color:var(--secondary);
  letter-spacing:-.005em;
}
.numeralia-lead{font-size:.8rem; color:#6b7280; margin-top:.15rem}
.numeralia-foot{font-size:.72rem; color:#94a3b8; margin-top:.9rem; letter-spacing:.02em}

.num-card{
  position:relative;
  background:#fff;
  border-radius:.9rem;
  padding:.8rem .85rem .9rem;
  border:1px solid #eceae8;
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.num-card::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:var(--accent, var(--primary));
  border-radius:3px 0 0 3px;
}
.num-card:hover{
  transform:translateY(-2px);
  border-color:rgba(185,102,144,.25);
  box-shadow:0 10px 22px -14px rgba(31,41,55,.20);
}
.num-icon{color:var(--accent, var(--primary)); margin-bottom:.3rem; opacity:.75}
.num-value{
  font-family:'Merriweather', serif; font-weight:900;
  font-size:1.7rem; color:#111827; line-height:1;
  display:flex; align-items:baseline; gap:.1rem;
}
.num-label{font-size:.72rem; color:#6b7280; margin-top:.35rem; line-height:1.25}

/* ---------- Mosaico acerca ---------- */
.mosaic{
  display:grid;
  grid-template-columns:1.3fr 1fr;
  grid-template-rows:repeat(2, 200px);
  gap:.75rem;
}
@media(min-width:640px){
  .mosaic{grid-template-rows:repeat(2, 240px)}
}
.mosaic img{
  width:100%; height:100%; object-fit:cover;
  border-radius:1rem; box-shadow:0 12px 28px -16px rgba(31,41,55,.22);
  transition:transform .5s ease;
}
.mosaic img:hover{transform:scale(1.02)}
.mosaic .m1{grid-column:1/2; grid-row:1/3}
.mosaic .m2{grid-column:2/3; grid-row:1/2}
.mosaic .m3{grid-column:2/3; grid-row:2/3}

/* ---------- Daypicker agenda ---------- */
.daypick-lg{
  display:inline-flex; gap:.4rem;
  background:#fff; padding:.3rem; border-radius:1rem;
  border:1px solid #ececec; box-shadow:0 2px 10px -2px rgba(31,41,55,.06);
}
.daypick-lg button{
  min-width:76px; text-align:center;
  padding:.5rem .75rem; border-radius:.7rem;
  color:#374151; transition:background .18s ease, color .18s ease, transform .18s ease;
}
.daypick-lg button:hover{background:var(--cream)}
.daypick-lg button[aria-pressed="true"]{
  background:linear-gradient(135deg, var(--primary), var(--primary-600));
  color:#fff;
}
.daypick-lg .dp-dow{font-size:.7rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; opacity:.85}
.daypick-lg .dp-num{font-family:'Merriweather', serif; font-weight:900; font-size:1.35rem; line-height:1.05; margin-top:.05rem}
.daypick-lg .dp-mo{font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; opacity:.75}

/* ---------- Search ---------- */
.search-wrap{position:relative}
.search-wrap .search-icn{
  position:absolute; left:.75rem; top:50%; transform:translateY(-50%); color:#9ca3af;
}
.search-wrap input{
  width:260px; max-width:100%;
  padding:.7rem .85rem .7rem 2.2rem; border-radius:.8rem;
  background:#fff; border:1.5px solid var(--primary);
  font-size:.9rem; color:#374151;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.search-wrap input:focus{
  outline:none; border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(185,102,144,.18);
}

/* ---------- Chips de track ---------- */
.chip{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.45rem .85rem; border-radius:999px;
  background:#fff; border:1px solid #e5e7eb;
  color:#374151; font-size:.8rem; font-weight:600;
  white-space:nowrap;
  transition:all .18s ease;
}
.chip:hover{border-color:var(--primary); color:var(--primary)}
.chip[aria-pressed="true"]{
  background:var(--primary); color:#fff; border-color:var(--primary);
}
.chip[aria-pressed="true"] .dot{background:#fff !important}
.chip .dot{width:8px; height:8px; border-radius:999px; display:inline-block}

/* ---------- Anotación editable ---------- */
.annot{
  border:1px dashed rgba(185,102,144,.5);
  background:rgba(185,102,144,.06);
  color:#6b2e52;
  padding:.9rem 1.1rem;
  border-radius:.9rem;
  font-size:.82rem; line-height:1.55;
  position:relative;
}
.annot::before{
  content:"✎"; position:absolute; top:-10px; left:14px;
  width:24px; height:24px; display:grid; place-items:center;
  background:var(--primary); color:#fff; border-radius:999px;
  font-size:.8rem;
}
.annot code{
  background:rgba(185,102,144,.15); color:#6b2e52;
  padding:.08rem .35rem; border-radius:.3rem; font-size:.78rem;
}

/* ---------- Sesión (card agenda, 1 columna) ---------- */
.session{
  background:#fff;
  border:1px solid #eceae8;
  border-radius:1.05rem;
  padding:1.1rem 1.25rem;
  display:grid;
  grid-template-columns:110px 1fr auto;
  gap:1.1rem;
  align-items:start;
  box-shadow:0 2px 10px -2px rgba(31,41,55,.05);
  transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease;
  position:relative;
}
.session::before{
  content:""; position:absolute; left:0; top:12px; bottom:12px; width:3px;
  background:var(--accent, var(--primary)); border-radius:0 3px 3px 0; opacity:.75;
}
.session:hover{
  border-color:rgba(185,102,144,.3);
  transform:translateY(-1px);
  box-shadow:0 10px 24px -16px rgba(31,41,55,.18);
}
@media(max-width:720px){
  .session{grid-template-columns:1fr; gap:.6rem}
  .session::before{top:0; bottom:auto; width:40px; height:3px; border-radius:0 0 3px 3px; left:1.25rem}
}

.session-time{
  font-family:'Merriweather', serif; font-weight:700; color:#111827;
  font-size:1rem; line-height:1.2;
}
.session-dur{font-size:.72rem; color:#9ca3af; margin-top:.2rem; text-transform:uppercase; letter-spacing:.1em}
.session-place{font-size:.72rem; color:var(--secondary); margin-top:.35rem; display:flex; align-items:center; gap:.25rem}

.session-title{
  font-family:'Merriweather', serif; font-weight:700;
  color:#111827; font-size:1.05rem; line-height:1.35;
}
.session-desc{color:#6b7280; font-size:.88rem; margin-top:.35rem; line-height:1.5}

.session-tags{display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.55rem}
.tag{
  font-size:.68rem; text-transform:uppercase; letter-spacing:.1em; font-weight:700;
  padding:.2rem .55rem; border-radius:999px;
}
.tag-keynote{background:rgba(185,102,144,.12); color:#8a2a5c}
.tag-dialogo{background:rgba(90,74,149,.12); color:#4a3b7d}
.tag-taller{background:rgba(138,90,20,.12); color:#6b440f}
.tag-plenaria{background:rgba(59,106,58,.12); color:#2d5a2d}
.tag-registro{background:rgba(148,163,184,.15); color:#475569}

.session-speakers{
  display:flex; flex-wrap:wrap; gap:.4rem;
  margin-top:.7rem;
}
.speaker-chip{
  display:inline-flex; align-items:center; gap:.45rem;
  background:#f9f7f8; border:1px solid #eee4ea;
  border-radius:999px; padding:.22rem .65rem .22rem .22rem;
  font-size:.78rem; color:#374151; font-weight:600;
  cursor:pointer;
  transition:border-color .18s ease, background .18s ease, transform .15s ease;
}
.speaker-chip:hover{
  border-color:var(--primary); background:#fff;
  transform:translateY(-1px);
}
.speaker-chip img{
  width:24px; height:24px; border-radius:999px; object-fit:cover;
  background:#e5e7eb;
}
.speaker-chip-fallback{
  width:24px; height:24px; border-radius:999px;
  background:linear-gradient(135deg, var(--primary), var(--secondary));
  color:#fff; font-size:.65rem; font-weight:800;
  display:grid; place-items:center;
}

.session-cta{
  align-self:start; color:#9ca3af; font-size:.78rem;
  display:inline-flex; align-items:center; gap:.25rem;
}

/* ---------- Grid de ponentes ---------- */
.speaker-card{
  background:#fff; border-radius:1rem; overflow:hidden;
  border:1px solid #eceae8;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  cursor:pointer;
}
.speaker-card:hover{
  transform:translateY(-3px);
  border-color:rgba(185,102,144,.3);
  box-shadow:0 18px 30px -20px rgba(31,41,55,.25);
}
.speaker-card .photo{
  aspect-ratio:1/1; background:linear-gradient(135deg, var(--primary), var(--secondary));
  overflow:hidden;
}
.speaker-card .photo img{width:100%; height:100%; object-fit:cover}
.speaker-card .meta{padding:.75rem .85rem .9rem}
.speaker-card .n{font-family:'Merriweather', serif; font-weight:700; color:#111827; font-size:.88rem; line-height:1.25}
.speaker-card .r{font-size:.72rem; color:var(--secondary); margin-top:.25rem; line-height:1.35; font-weight:600}

/* ---------- Sede bg ---------- */
.sede-bg{
  background:
    linear-gradient(rgba(247,246,246,.9), rgba(247,246,246,.7)),
    url('../assets/saloneswtc.jpg') center/cover no-repeat;
}
.sede-overlay{
  position:absolute; inset:0;
  background:radial-gradient(800px 400px at 20% 20%, rgba(185,102,144,.10), transparent 60%);
  pointer-events:none;
}

/* ---------- CTA registro carrusel de fondo ---------- */
.registro-carousel{
  position:absolute; inset:0; z-index:0; overflow:hidden;
}
.registro-carousel .slide{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:0; transform:scale(1.06);
  transition:opacity 1.2s ease, transform 8s ease;
}
.registro-carousel .slide.is-active{opacity:1; transform:scale(1.02)}

/* ---------- Modal ponente ---------- */
.modal-backdrop{
  position:fixed; inset:0; z-index:80;
  background:rgba(15,23,42,.55);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  display:none; align-items:center; justify-content:center;
  padding:1rem;
  opacity:0; transition:opacity .25s ease;
}
.modal-backdrop.is-open{display:flex; opacity:1}
.modal{
  width:min(620px, 100%);
  max-height:88vh;
  background:#fff;
  border-radius:1.2rem;
  overflow:hidden;
  display:flex; flex-direction:column;
  box-shadow:0 30px 60px -20px rgba(31,41,55,.45);
  transform:translateY(14px) scale(.98);
  transition:transform .3s ease;
}
.modal-backdrop.is-open .modal{transform:translateY(0) scale(1)}

/* ---------- Modal info (Sede, etc) ---------- */
.modal-info{max-height:86vh}
.modal-info-head{
  display:flex; align-items:center; gap:.9rem;
  padding:1.1rem 1.15rem;
  background:linear-gradient(135deg, var(--primary), var(--secondary));
}
.modal-info-icon{
  width:46px; height:46px; flex-shrink:0;
  background:rgba(255,255,255,.18); border-radius:.8rem;
  display:grid; place-items:center; color:#fff;
}
.modal-info-icon svg{width:26px; height:26px}
.modal-info-body{
  padding:1.2rem 1.25rem 1.4rem;
  overflow-y:auto;
  color:#374151; font-size:.92rem; line-height:1.6;
}
.modal-info-body strong{color:#111827}
.modal-info-body ul{margin-top:.5rem; padding-left:1.1rem; list-style:disc}
.modal-info-body li{margin:.3rem 0}
.modal-info-body p + p{margin-top:.7rem}

/* ---------- Sede info cards (ahora: botones con icono) ---------- */
.sede-cards{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:.75rem}
@media(max-width:720px){.sede-cards{grid-template-columns:1fr}}
.sede-card{
  text-align:left;
  background:rgba(255,255,255,.9); backdrop-filter:blur(4px);
  border:1px solid #e5e7eb; border-radius:1rem;
  padding:1rem 1rem 1.05rem;
  display:flex; gap:.85rem; align-items:flex-start;
  cursor:pointer;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.sede-card:hover{
  transform:translateY(-2px);
  border-color:var(--primary);
  background:#fff;
  box-shadow:0 14px 28px -18px rgba(185,102,144,.4);
}
.sede-card-icon{
  flex-shrink:0;
  width:42px; height:42px;
  border-radius:.7rem;
  background:linear-gradient(135deg, rgba(185,102,144,.15), rgba(73,123,134,.15));
  color:var(--primary);
  display:grid; place-items:center;
}
.sede-card-icon svg{width:22px; height:22px}
.sede-card-text .t{color:var(--primary); font-weight:700; font-size:.92rem}
.sede-card-text .s{color:#6b7280; font-size:.76rem; margin-top:.2rem; line-height:1.4}
.sede-card-text .cta{
  display:inline-flex; align-items:center; gap:.25rem;
  margin-top:.55rem; color:var(--secondary);
  font-size:.72rem; font-weight:700; letter-spacing:.05em;
}