/* =========================================================
   EVENTOS · Conferencista internacional · Michelle Piters
   Integrado inline desde el artifact original.
   Todo el CSS está envuelto en .eventos-wrap para no chocar
   con clases del index (.eyebrow, .btn-p, .dot, .mono,
   .hero-title, .hero-video, etc. ya existen en otros lados).
   Requiere CSS nesting (Chrome 112+, Safari 16.5+, Firefox 117+).
========================================================= */

.eventos-wrap{
  --ink-0:#07060a;
  --ink-1:#0c0a12;
  --gold-1:#e8c878;
  --gold-2:#c9a14a;
  --gold-3:#8a6a2a;
  --cream:#cfc7ba;
  --ash-d:#6b6359;

  position:relative;
  background:var(--ink-0);
  color:#e9e3d8;
  font-family:'Inter',sans-serif;
  font-weight:300;
  letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;
  height:500vh; /* desktop default — antes 600vh, reducido para evitar sensación de scroll infinito */
  touch-action:pan-y;

  /* (.grain y header.chrome se eliminaron — duplicaban el header del sitio) */

  .hero-pin{position:sticky;top:0;height:100vh;height:100svh;width:100%;overflow:hidden;background:#000;}
  .hero-video{
    position:absolute;inset:0;width:100%;height:100%;
    object-fit:cover;object-position:center 35%;
    will-change:transform;
    transform:scale(1.08) translate3d(0,0,0);
    transition:none;
    user-select:none;-webkit-user-drag:none;
    pointer-events:none;background:#000;
  }

  /* Layers */
  .layer-overlay{position:absolute;inset:0;pointer-events:none;z-index:2;background:linear-gradient(180deg, rgba(7,6,10,.82) 0%, rgba(7,6,10,.68) 35%, rgba(7,6,10,.72) 65%, rgba(7,6,10,.92) 100%);}
  .layer-vignette{position:absolute;inset:0;pointer-events:none;z-index:3;background:radial-gradient(ellipse 72% 72% at 50% 48%, transparent 18%, rgba(0,0,0,.55) 50%, rgba(0,0,0,.88) 78%, rgba(0,0,0,.98) 95%);}
  .layer-warm{position:absolute;inset:0;pointer-events:none;z-index:3;background:radial-gradient(ellipse 55% 45% at 50% 38%, rgba(201,161,74,.10), transparent 70%);mix-blend-mode:screen;}
  .layer-corners{position:absolute;inset:0;pointer-events:none;z-index:4;background:radial-gradient(circle at 100% 100%, rgba(0,0,0,.95) 0, rgba(0,0,0,.7) 16%, transparent 28%),radial-gradient(circle at 0% 100%, rgba(0,0,0,.95) 0, rgba(0,0,0,.7) 16%, transparent 28%),radial-gradient(circle at 100% 0%, rgba(0,0,0,.85) 0, rgba(0,0,0,.55) 14%, transparent 26%),radial-gradient(circle at 0% 0%, rgba(0,0,0,.85) 0, rgba(0,0,0,.55) 14%, transparent 26%);}

  .particles{position:absolute;inset:0;z-index:4;pointer-events:none;}

  /* Blocks */
  .blocks{position:absolute;inset:0;z-index:10;pointer-events:none;}
  .block{
    position:absolute;inset:0;
    display:flex;flex-direction:column;justify-content:center;align-items:center;
    padding:9vh 6vw 4vh;text-align:center;
    opacity:0; will-change:opacity,transform;
  }
  .block > *{pointer-events:auto;}

  /* BLOCK A · Hero */
  .hero-eyebrow{display:flex;align-items:center;gap:14px;margin-bottom:28px;justify-content:center;flex-wrap:wrap;}
  .hero-eyebrow .line{width:48px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-2));}
  .hero-eyebrow .line.r{background:linear-gradient(90deg,var(--gold-2),transparent);}
  .hero-eyebrow .eyebrow{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold-2);transform:translateX(.16em);}
  .hero-title{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(40px, 5.6vw, 92px);line-height:.94;letter-spacing:-.025em;color:#f4ecdc;text-shadow:0 4px 50px rgba(0,0,0,.75);max-width:16ch;margin-left:auto;margin-right:auto;text-align:center;}
  .hero-title .it{font-style:italic;font-weight:300;color:transparent;background:linear-gradient(180deg,#f5dfa3 0%,#c9a14a 70%);-webkit-background-clip:text;background-clip:text;}
  .hero-sub{margin-top:30px;font-size:clamp(13px,.95vw,15.5px);line-height:1.7;color:var(--cream);font-weight:300;max-width:580px;text-shadow:0 2px 20px rgba(0,0,0,.8);}
  .hero-sub .strong{color:#f4ecdc;font-weight:400;}

  /* BLOCK B · Wall */
  .wall-label{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.42em;color:var(--gold-2);text-transform:uppercase;margin-bottom:38px;display:flex;align-items:center;gap:14px;justify-content:center;}
  .wall-label .line{width:36px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-2));}
  .wall-label .line.r{background:linear-gradient(90deg,var(--gold-2),transparent);}
  .wall{display:flex;flex-direction:column;gap:6px;max-width:1100px;width:100%;align-items:center;}
  .wall-name{font-family:'Cormorant Garamond',serif;font-size:clamp(24px, 3.6vw, 52px);line-height:1.08;letter-spacing:-.015em;color:#f4ecdc;text-shadow:0 4px 32px rgba(0,0,0,.85);display:flex;gap:.28em;align-items:baseline;}
  .wall-name .fn{font-style:italic;font-weight:300;color:var(--gold-1);}
  .wall-name .sn{font-weight:400;}
  .wall-name.michelle .fn,.wall-name.michelle .sn{font-weight:500;letter-spacing:-.018em;}
  .wall-name.michelle{border-top:1px solid rgba(232,200,120,.32);border-bottom:1px solid rgba(232,200,120,.32);padding:14px 0;margin:12px 0;}
  .wall-foot{margin-top:36px;font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:300;font-size:clamp(13px,.95vw,15.5px);line-height:1.55;color:var(--cream);max-width:620px;text-shadow:0 2px 14px rgba(0,0,0,.75);}
  .wall-foot .ven{color:var(--gold-1);font-style:normal;}

  /* BLOCK C · Escenarios */
  .escenarios-head{margin-bottom:48px;display:flex;flex-direction:column;align-items:center;gap:10px;}
  .escenarios-head .title{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.45em;color:var(--gold-2);text-transform:uppercase;}
  .escenarios-head .line{width:1px;height:36px;background:linear-gradient(180deg,var(--gold-2),transparent);}
  .escenarios{display:grid;grid-template-columns:repeat(3,1fr);gap:54px;max-width:1180px;width:100%;margin:0 auto;text-align:left;}
  .escenario{padding-top:18px;border-top:1px solid rgba(232,200,120,.32);}
  .escenario .num{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.3em;color:var(--gold-1);margin-bottom:14px;display:block;}
  .escenario .venue{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(19px,1.6vw,24px);line-height:1.1;letter-spacing:-.01em;color:#f4ecdc;margin-bottom:10px;}
  .escenario .date{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.24em;color:var(--gold-2);text-transform:uppercase;margin-bottom:14px;display:block;}
  .escenario .desc{font-size:13.5px;line-height:1.65;color:var(--cream);font-weight:300;}

  /* BLOCK D · Pillars */
  .pillars-head{margin-bottom:54px;display:flex;flex-direction:column;align-items:center;gap:10px;}
  .pillars-head .title{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.42em;color:var(--gold-2);text-transform:uppercase;}
  .pillars-head .line{width:1px;height:36px;background:linear-gradient(180deg,var(--gold-2),transparent);}
  .pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:54px;max-width:1180px;width:100%;margin:0 auto;text-align:left;}
  .pillar{position:relative;padding-top:24px;}
  .pillar::before{content:"";position:absolute;top:0;left:0;width:60px;height:1px;background:linear-gradient(90deg,var(--gold-1),transparent);}
  .pillar .dot{position:absolute;top:-3px;left:0;width:6px;height:6px;border-radius:50%;background:var(--gold-1);box-shadow:0 0 10px rgba(232,200,120,.7);}
  .pillar h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(18px,1.6vw,22px);line-height:1.12;letter-spacing:-.01em;color:#f4ecdc;margin:0 0 14px 0;}
  .pillar p{font-size:13.5px;line-height:1.65;color:var(--cream);font-weight:300;margin:0;}

  /* BLOCK E · CTA */
  .cta-eyebrow{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(20px,2.4vw,32px);line-height:1.25;letter-spacing:-.01em;color:#f4ecdc;margin:0 auto 14px;max-width:24ch;}
  .cta-meta{font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:400;letter-spacing:.32em;text-transform:uppercase;color:var(--gold-1);margin-bottom:30px;text-shadow:0 0 18px rgba(232,200,120,.35);}
  .cta-meta .dot{opacity:.7;}
  .cta-line{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:300;font-size:clamp(22px, 2.8vw, 40px);line-height:1.22;letter-spacing:-.015em;color:#f4ecdc;max-width:18ch;margin:0 auto 56px;text-shadow:0 4px 40px rgba(0,0,0,.8);}
  .cta-line .gold{color:transparent;background:linear-gradient(180deg,#f5dfa3,#c9a14a);-webkit-background-clip:text;background-clip:text;font-style:italic;}
  /* CTA button — usa .evt-btn-p para no chocar con .btn-p del index */
  .evt-btn-p{
    display:inline-flex;align-items:center;gap:14px;
    padding:18px 34px;
    background:linear-gradient(180deg,#f5dfa3 0%,#e8c878 45%,#c9a14a 100%);
    color:#1a1208;text-decoration:none;
    font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.34em;text-transform:uppercase;font-weight:500;
    box-shadow:0 18px 48px -18px rgba(201,161,74,.55), 0 0 0 1px rgba(255,220,160,.35) inset;
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .evt-btn-p:hover{transform:translateY(-2px);box-shadow:0 22px 60px -20px rgba(201,161,74,.75), 0 0 0 1px rgba(255,220,160,.5) inset;}
  .evt-btn-p .arr{transition:transform .25s;}
  .evt-btn-p:hover .arr{transform:translateX(4px);}
  .cta-note{margin-top:22px;font-family:'JetBrains Mono',monospace;font-size:11.5px;font-weight:400;letter-spacing:.34em;color:#e9e3d8;text-transform:uppercase;display:flex;align-items:center;gap:10px;justify-content:center;text-shadow:0 0 14px rgba(232,200,120,.25);}
  .cta-note .dot{width:5px;height:5px;border-radius:50%;background:var(--gold-1);box-shadow:0 0 10px var(--gold-1);animation:evt-pulse 1.8s ease-in-out infinite;}

  /* Progress + stage tag */
  .progress-rail{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);z-index:11;display:flex;align-items:center;gap:14px;pointer-events:none;}
  .progress-rail .bar-track{width:180px;height:1px;background:rgba(255,255,255,.16);position:relative;}
  .progress-rail .bar-fill{position:absolute;left:0;top:-1px;height:3px;width:0;background:linear-gradient(90deg,#f5dfa3,#c9a14a);box-shadow:0 0 12px rgba(232,200,120,.7);}
  .progress-rail .pct{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.3em;color:var(--gold-1);}
  .stage-tag{position:absolute;left:36px;bottom:30px;z-index:11;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.34em;color:var(--cream);text-transform:uppercase;pointer-events:none;}
  .stage-tag .num{color:var(--gold-1);margin-right:8px;}

  /* Loader */
  .loader{position:absolute;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:#07060a;transition:opacity .8s ease;}
  .loader .ring{width:38px;height:38px;border:1px solid rgba(232,200,120,.2);border-top-color:var(--gold-1);border-radius:50%;animation:evt-spin 1s linear infinite;}
  .loader .lbl{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.4em;color:var(--ash-d);text-transform:uppercase;}
  .loader .pct{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.3em;color:var(--gold-2);}
  .loader.hidden{opacity:0;pointer-events:none;}

  /* Desktop ≥820px · TODO centrado (sin asimetría block-left/right que colapsa en pantallas anchas).
     block-left y block-right heredan el centrado de .block. Solo aumentamos max-widths
     para que los textos no se vuelvan demasiado anchos en monitores grandes. */
  @media (min-width: 820px){
    .hero-title{max-width:18ch;}
    .hero-sub{max-width:560px;}
    .wall{max-width:760px;}
    .wall-foot{max-width:620px;margin-left:auto;margin-right:auto;}
  }
  @media (min-width: 1280px){
    .hero-sub{max-width:600px;}
    .wall{max-width:820px;}
  }
  @media (min-width: 1920px){
    .hero-title{font-size:clamp(72px, 4.4vw, 104px);max-width:20ch;}
    .hero-sub{font-size:16px;max-width:640px;}
    .wall-name{font-size:clamp(40px, 2.6vw, 58px);}
    .wall{max-width:900px;}
    .escenarios, .pillars{max-width:1320px;gap:72px;}
    .escenario .venue, .pillar h3{font-size:26px;}
    .escenario .desc, .pillar p{font-size:15px;}
    .cta-line{font-size:clamp(36px, 2.4vw, 48px);}
    .progress-rail .bar-track{width:220px;}
  }
  @media (min-width: 2400px){
    .hero-title{font-size:108px;}
    .wall-name{font-size:60px;}
    .escenarios, .pillars{max-width:1480px;}
  }

  /* Laptop */
  @media (max-width: 1279px) and (min-width: 1024px){
    .hero-title{font-size:clamp(44px, 5.2vw, 76px);}
    .hero-sub{font-size:14.5px;max-width:540px;}
    .wall-name{font-size:clamp(28px, 3.4vw, 44px);}
    .escenarios, .pillars{max-width:1040px;gap:44px;}
    .escenario .venue, .pillar h3{font-size:22px;}
    .cta-line{font-size:clamp(28px, 2.8vw, 36px);}
  }

  /* Tablet landscape */
  @media (max-width: 1023px) and (min-width: 820px){
    & {height:480vh;} /* antes 560vh */
    .block{padding:8vh 5vw 5vh;}
    .hero-title{font-size:clamp(40px, 6vw, 64px);max-width:14ch;}
    .hero-sub{font-size:14px;max-width:520px;margin-top:24px;}
    .hero-eyebrow{margin-bottom:22px;}
    .hero-eyebrow .line{width:36px;}
    .wall-label{margin-bottom:30px;}
    .wall-name{font-size:clamp(26px, 4.2vw, 40px);}
    .wall-foot{font-size:14px;max-width:560px;margin-top:28px;}
    .escenarios-head, .pillars-head{margin-bottom:36px;}
    .escenarios, .pillars{grid-template-columns:repeat(3, 1fr);gap:32px;max-width:880px;}
    .escenario .venue, .pillar h3{font-size:20px;}
    .escenario .desc, .pillar p{font-size:13.5px;line-height:1.6;}
    .cta-eyebrow{font-size:24px;}
    .cta-line{font-size:clamp(26px, 4vw, 34px);margin-bottom:42px;}
    .evt-btn-p{padding:17px 30px;font-size:11px;}
    .progress-rail .bar-track{width:160px;}
  }

  /* Tablet portrait */
  @media (max-width: 819px) and (min-width: 600px){
    & {height:600vh;} /* antes 560vh — más tiempo de lectura por bloque */
    .block{padding:7vh 6vw 6vh;}
    .hero-title{font-size:clamp(48px, 8vw, 72px);max-width:12ch;line-height:.96;}
    .hero-sub{font-size:15px;max-width:480px;margin-top:24px;line-height:1.7;}
    .hero-eyebrow{margin-bottom:24px;}
    .hero-eyebrow .line{width:32px;}
    .wall-label{margin-bottom:32px;font-size:10px;}
    .wall-name{font-size:clamp(28px, 5.5vw, 42px);}
    .wall-foot{font-size:14.5px;max-width:520px;margin-top:30px;}
    .escenarios-head, .pillars-head{margin-bottom:36px;}
    .escenarios, .pillars{grid-template-columns:repeat(2, 1fr);gap:36px 40px;max-width:680px;}
    .escenarios .escenario:nth-child(3),
    .pillars .pillar:nth-child(3){grid-column:1 / -1;max-width:48%;justify-self:center;}
    .escenario .venue, .pillar h3{font-size:22px;}
    .escenario .desc, .pillar p{font-size:14px;}
    .cta-eyebrow{font-size:26px;}
    .cta-meta{font-size:11px;letter-spacing:.3em;}
    .cta-line{font-size:clamp(28px, 5vw, 38px);max-width:18ch;margin-bottom:46px;}
    .evt-btn-p{padding:18px 32px;font-size:11px;}
    .cta-note{font-size:11px;letter-spacing:.3em;}
    .progress-rail .bar-track{width:160px;}
    .stage-tag{left:28px;}
  }

  /* Mobile */
  @media (max-width: 599px){
    & {height:650vh;} /* punto medio: 520vh era muy rápido (bloques saltaban), 800vh era muy lento (4 flicks por bloque). 650vh ≈ 1-1.5 flicks por bloque */
    .block{padding:8vh 22px 7vh;}
    .hero-title{font-size:clamp(44px, 13.5vw, 72px);max-width:11ch;line-height:.96;}
    .hero-sub{font-size:14.5px;line-height:1.65;max-width:92%;margin-top:22px;}
    .hero-eyebrow{margin-bottom:20px;gap:10px;}
    .hero-eyebrow .line{width:22px;}
    .hero-eyebrow .eyebrow{font-size:9.5px;letter-spacing:.26em;}
    .wall-label{margin-bottom:26px;font-size:9.5px;letter-spacing:.32em;}
    .wall-label .line{width:18px;}
    .wall{gap:2px;}
    .wall-name{font-size:clamp(26px, 8vw, 38px);gap:.22em;flex-wrap:wrap;justify-content:center;}
    .wall-name.michelle{padding:10px 0;margin:10px 0;}
    .wall-foot{margin-top:24px;font-size:14px;max-width:94%;line-height:1.5;}
    .escenarios-head, .pillars-head{margin-bottom:30px;}
    .escenarios-head .title, .pillars-head .title{font-size:10px;letter-spacing:.34em;}
    .escenarios-head .line, .pillars-head .line{height:28px;}
    .escenarios{grid-template-columns:1fr;gap:24px;max-width:420px;}
    .pillars{grid-template-columns:1fr;gap:28px;max-width:420px;}
    .escenario{padding-top:14px;}
    .escenario .num{font-size:9px;letter-spacing:.26em;margin-bottom:10px;}
    .escenario .venue{font-size:22px;margin-bottom:8px;}
    .escenario .date{font-size:9.5px;letter-spacing:.2em;margin-bottom:10px;}
    .escenario .desc{font-size:13.5px;line-height:1.6;}
    .pillar{padding-top:20px;}
    .pillar h3{font-size:21px;margin-bottom:10px;}
    .pillar p{font-size:13.5px;line-height:1.6;}
    .cta-eyebrow{font-size:22px;margin-bottom:12px;}
    .cta-meta{display:block;text-align:center;font-size:10px;letter-spacing:.22em;line-height:1;margin:0 auto 26px;width:100%;max-width:none;padding:0;}
    .cta-meta .dot{display:block;width:3px;height:3px;border-radius:50%;background:var(--gold-2);opacity:.55;box-shadow:0 0 6px rgba(232,200,120,.4);font-size:0;line-height:0;margin:14px auto;}
    .cta-meta > span:not(.dot){display:block;white-space:nowrap;text-align:center;width:100%;margin:0;padding:0;transform:translateX(.11em);}
    .cta-line{font-size:clamp(24px,6.5vw,34px);max-width:16ch;margin-bottom:36px;}
    .evt-btn-p{padding:16px 26px;font-size:10px;letter-spacing:.28em;gap:10px;}
    .cta-note{font-size:9px;letter-spacing:.26em;margin-top:20px;}
    .progress-rail{bottom:16px;gap:10px;}
    .progress-rail .bar-track{width:120px;}
    .progress-rail .pct{font-size:9px;}
    .stage-tag{left:18px;bottom:16px;font-size:9px;letter-spacing:.24em;}
    #blockE{padding-top:18vh;padding-bottom:8vh;justify-content:flex-start;}
  }

  /* Small mobile */
  @media (max-width: 380px){
    .block{padding:7vh 18px 6vh;}
    .hero-title{font-size:44px;max-width:10ch;}
    .hero-sub{font-size:13.5px;margin-top:18px;}
    .wall-name{font-size:24px;}
    .wall-foot{font-size:13px;}
    .escenario .venue, .pillar h3{font-size:20px;}
    .cta-line{font-size:22px;}
    .cta-eyebrow{font-size:20px;}
    .cta-meta{font-size:9px;letter-spacing:.2em;}
    .cta-meta .dot{margin:12px auto;}
    .cta-meta > span:not(.dot){transform:translateX(.1em);}
    .evt-btn-p{padding:14px 22px;}
    .progress-rail .bar-track{width:100px;}
  }

  /* Landscape phone */
  @media (max-height: 520px) and (orientation: landscape){
    .block{padding:4vh 6vw 6vh;}
    .hero-title{font-size:clamp(36px, 7vw, 56px);}
    .hero-sub{margin-top:14px;font-size:13px;}
    .hero-eyebrow{margin-bottom:14px;}
    .wall-label{margin-bottom:16px;}
    .wall-name{font-size:clamp(22px, 4vw, 32px);}
    .wall-foot{margin-top:16px;font-size:12.5px;}
    .escenarios-head, .pillars-head{margin-bottom:18px;}
    .escenarios, .pillars{grid-template-columns:repeat(3,1fr);gap:20px;}
    .escenario .desc, .pillar p{font-size:12px;line-height:1.5;}
    .cta-line{margin-bottom:22px;font-size:22px;}
    .progress-rail{bottom:10px;}
    .stage-tag{bottom:10px;}
  }
}

/* Animations (global keyframes — nombres únicos para no chocar) */
@keyframes evt-pulse{0%,100%{opacity:.4;transform:scale(.85);}50%{opacity:1;transform:scale(1.1);}}
@keyframes evt-spin{to{transform:rotate(360deg);}}
