/* ============================================================
   EVENTS page on the Engine Room system (2026-07)
   Same pattern as the insights hub refresh: exact homepage nav
   (scoped), Engine Room dark hero, then a variable-override
   reskin of the sr-* system below the fold. Loaded ONLY by
   events.html, AFTER sam.css. Markup/JS below the hero untouched.
   ============================================================ */

/* ---- reskin: repoint the sr design tokens at Engine Room ---- */
body.sam-r.ev-page{
  --sr-navy:#0C1B33;
  --sr-navy-2:#0F2038;
  --sr-navy-3:#081226;
  --sr-orange:#F27830;
  --sr-orange-2:#C75617;
  --sr-cream:#F2EEE5;
  --sr-cream-2:#EAE3D4;
  --sr-radius:4px;
  --sr-disp:"Barlow Condensed","Archivo",sans-serif;
}
body.sam-r.ev-page h2,body.sam-r.ev-page h3{letter-spacing:.01em}

/* ---- the exact homepage nav, scoped to this page ---- */
body.ev-page .er-nav{display:flex;align-items:center;justify-content:space-between;padding:26px 48px;position:relative;z-index:5}
body.ev-page .er-nav .logo{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:17px;color:#F2EEE5;text-decoration:none}
body.ev-page .er-nav .logo .dot{color:#F27830}
body.ev-page .er-nav .logo-mark{width:30px;height:30px;object-fit:contain}
body.ev-page .nav-right{display:flex;gap:34px;align-items:center}
body.ev-page .nav-right a{color:#8FA2BD;text-decoration:none;font-size:13.5px}
body.ev-page .nav-right a:hover,body.ev-page .nav-right a:focus-visible{color:#F2EEE5;outline:none}
body.ev-page .nav-pill{border:1px solid rgba(242,238,229,.25);border-radius:999px;padding:9px 20px;color:#F2EEE5 !important;font-weight:500}
body.ev-page .nav-drop{position:relative;display:inline-block}
body.ev-page .nav-drop > a::after{content:"\25BE";font-size:9px;margin-left:6px;color:#8FA2BD}
body.ev-page .nav-drop-menu{
  visibility:hidden;opacity:0;transition:opacity .18s;
  position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%);
  background:#0F2038;border:1px solid rgba(242,238,229,.14);border-radius:12px;
  padding:10px 0;min-width:190px;list-style:none;
  box-shadow:0 18px 50px rgba(0,0,0,.5);
}
body.ev-page .nav-drop-menu::before{content:"";position:absolute;top:-14px;left:0;right:0;height:14px}
body.ev-page .nav-drop:hover .nav-drop-menu,body.ev-page .nav-drop:focus-within .nav-drop-menu{visibility:visible;opacity:1}
body.ev-page .nav-drop-menu li a{display:block;padding:9px 20px;font-size:13.5px;color:#8FA2BD;text-decoration:none}
body.ev-page .nav-drop-menu li a:hover,body.ev-page .nav-drop-menu li a:focus-visible{color:#F2EEE5;background:rgba(242,238,229,.05)}
body.ev-page .er-burger{display:none;background:none;border:1px solid rgba(242,238,229,.25);border-radius:8px;padding:9px 11px;cursor:pointer}
body.ev-page .er-burger span{display:block;width:20px;height:2px;background:#F2EEE5;margin:4px 0}
body.ev-page .er-mobile{display:none}
@media (max-width:900px){
  body.ev-page .er-nav{padding:20px 24px}
  body.ev-page .nav-right{display:none}
  body.ev-page .er-burger{display:block}
  body.ev-page .er-mobile{
    display:none;flex-direction:column;
    position:absolute;top:76px;left:0;right:0;z-index:40;
    background:#081226;border-top:1px solid rgba(242,238,229,.1);
    border-bottom:1px solid rgba(242,238,229,.1);
    padding:12px 24px 20px;
  }
  body.ev-page .er-mobile.open{display:flex}
  body.ev-page .er-mobile a{color:#F2EEE5;text-decoration:none;font-size:16px;padding:13px 0;border-bottom:1px solid rgba(242,238,229,.07)}
  body.ev-page .er-mobile a.mob-cta{color:#F27830;border-bottom:none;font-weight:500}
}

/* ---- the Engine Room hero shell for events ---- */
body.ev-page .ev-hero-shell{
  position:relative;overflow:hidden;
  background:linear-gradient(180deg,#081226 0%,#0C1B33 60%);
}
body.ev-page .ev-hero-shell::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(95% 75% at 80% 100%, rgba(242,120,48,.26), transparent 68%),
    radial-gradient(80% 65% at 0% 0%, rgba(72,128,224,.18), transparent 66%);
  animation:evbreathe 9s ease-in-out infinite alternate;
}
@keyframes evbreathe{from{opacity:.75}to{opacity:1}}
body.ev-page .ev-floor{
  position:absolute;left:-20vw;right:-20vw;bottom:-6vh;height:44vh;
  background-image:
    linear-gradient(rgba(242,120,48,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242,238,229,.08) 1px, transparent 1px);
  background-size:56px 56px;
  transform:perspective(520px) rotateX(58deg);
  transform-origin:top center;
  mask-image:linear-gradient(to top, transparent 4%, black 55%, transparent 98%);
  -webkit-mask-image:linear-gradient(to top, transparent 4%, black 55%, transparent 98%);
  pointer-events:none;
}
body.ev-page .ev-hero-grid{
  position:relative;z-index:1;
  display:grid;grid-template-columns:1.15fr .85fr;align-items:center;
  column-gap:56px;padding:34px 48px 88px;max-width:1240px;margin:0 auto;
}
body.ev-page .ev-kicker{
  display:inline-flex;align-items:center;gap:10px;
  border:1px solid rgba(242,120,48,.5);border-radius:999px;
  padding:8px 18px;margin-bottom:26px;
  font-family:"Barlow Condensed",sans-serif;font-weight:600;font-size:14px;
  letter-spacing:.32em;text-transform:uppercase;color:#F27830;
}
body.ev-page .ev-kicker::before{content:"";width:8px;height:8px;background:#F27830;border-radius:50%}
body.ev-page .ev-hero-grid h1{
  font-family:"Barlow Condensed",sans-serif;font-weight:900;text-transform:uppercase;
  font-size:clamp(48px,5.8vw,88px);line-height:.92;color:#F2EEE5;letter-spacing:.01em;
}
body.ev-page .ev-hero-grid h1 .turn{color:#F27830}
body.ev-page .ev-sub{
  margin-top:24px;font-size:16.5px;font-weight:300;line-height:1.65;
  color:rgba(242,238,229,.78);max-width:52ch;
}
body.ev-page .ev-hero-actions{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}
body.ev-page .ev-btn{font-weight:500;font-size:15px;text-decoration:none;padding:15px 30px;border-radius:999px;display:inline-block}
body.ev-page .ev-btn.solid{background:#F27830;color:#131313}
body.ev-page .ev-btn.ghost{border:1px solid rgba(242,238,229,.3);color:#F2EEE5}
body.ev-page .ev-btn:focus-visible{outline:2px solid #F27830;outline-offset:3px}
body.ev-page .ev-hero{padding:0}

/* the polaroid treatment from the homepage About section */
body.ev-page .ev-hero-photo{
  margin:0 auto;max-width:400px;position:relative;
  background:#F2EEE5;border:1.5px solid rgba(15,32,56,.25);border-radius:8px;
  box-shadow:14px 14px 0 rgba(0,0,0,.42);padding:14px 14px 10px;
  transform:rotate(-1.6deg);transition:transform .35s ease;
}
body.ev-page .ev-hero-photo:hover{transform:rotate(0)}
body.ev-page .ev-hero-photo img,body.ev-page .ev-hero-photo video{width:100%;height:auto;display:block;border-radius:4px}
body.ev-page .ev-hero-photo figcaption{
  margin:10px 2px 2px;text-align:center;font-size:12.5px;color:#0F2038;opacity:.75;
}
@media (max-width:900px){
  body.ev-page .ev-hero-grid{grid-template-columns:1fr;row-gap:36px;padding:18px 24px 64px}
  body.ev-page .ev-hero-photo{max-width:380px;margin:0 auto}
}
@media (prefers-reduced-motion:reduce){
  body.ev-page .ev-hero-shell::before{animation:none}
}

/* ---- ember glow on the dark sections (the homepage .dark::after treatment) ---- */
body.ev-page .sr-trust,body.ev-page .sr-sec.sr-navy{position:relative;overflow:hidden}
body.ev-page .sr-trust::after,body.ev-page .sr-sec.sr-navy::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(125% 120% at 88% 0%, rgba(242,120,48,.56), rgba(242,120,48,.16) 40%, transparent 68%),
    radial-gradient(95% 105% at 0% 100%, rgba(72,128,224,.24), transparent 60%),
    radial-gradient(60% 55% at 50% 105%, rgba(217,162,56,.10), transparent 65%);
  animation:evember 8s ease-in-out infinite alternate;
}
@keyframes evember{from{opacity:.82}to{opacity:1}}
body.ev-page .sr-trust .sr-wrap,body.ev-page .sr-sec.sr-navy .sr-wrap{position:relative;z-index:1}
@media (prefers-reduced-motion:reduce){
  body.ev-page .sr-trust::after,body.ev-page .sr-sec.sr-navy::after{animation:none}
}

/* ---- accent tints inside the page that hardcoded the old orange ---- */
body.sam-r.ev-page .ev-cost{background:rgba(242,120,48,.14);color:#C75617;border:1px solid rgba(242,120,48,.35)}
body.sam-r.ev-page .ev-field input:focus,body.sam-r.ev-page .ev-field select:focus{border-color:#F27830;box-shadow:0 0 0 3px rgba(242,120,48,.18)}
body.sam-r.ev-page .ev-notify-ok{color:#C75617}
body.sam-r.ev-page .ev-picked.has-pick{border-color:#F27830;box-shadow:0 0 0 3px rgba(242,120,48,.14)}
body.sam-r.ev-page .ev-leaf{background:#F27830}
body.sam-r.ev-page .ev-picked-eyebrow{color:#C75617}
body.sam-r.ev-page .ev-picked-change{color:#C75617}

/* Red "Watch live now" button for the current webinar, on its own day.
   Loaded after sam.css so it overrides the orange .sr-btn base. */
body.sam-r .sr-btn--live{ background:#e11d1d; color:#fff; box-shadow:0 2px 0 #a30f0f; }
body.sam-r .sr-btn--live:hover{ background:#c81616; color:#fff; box-shadow:0 5px 0 #a30f0f; }
body.sam-r .sr-btn--live:active{ box-shadow:0 1px 0 #a30f0f; }