/* HotConference: brand tokens and the rules every page shares (header, footer, buttons, cards, motion).
   Page-specific rules sit in each page's own <style>. Breakpoints: 1300 burger nav (the design's 1220, moved for the
   Contact link), 720 mobile, 520 small phone. */
:root {
  --hc-red: #E01E37;
  --hc-red-ink: #B3152D;
  --hc-red-grad: linear-gradient(180deg, #E52A42 0%, #C5162F 100%);
  --hc-red-cta-grad: linear-gradient(180deg, #E52A42 0%, #C3060F 100%);
  --hc-pink: #FDECEC;
  --hc-pink-2: #FFF5F5;
  --hc-pink-border: #F8D3D5;
  --hc-ink: #111111;
  --hc-text-2: #3C4043;
  --hc-muted: #5F6368;
  --hc-muted-2: #80868B;
  --hc-bg: #FFFFFF;
  --hc-bg-alt: #F7F8FA;
  --hc-border: #E6E8EC;
  --hc-border-soft: #EEF0F3;
  --hc-input-border: #D5D8DE;
  --hc-footer: #191919;
  --hc-green: #1E7B45;
  --hc-green-bg: #E7F6EC;
  --hc-amber-ink: #8A4B00;
  --hc-amber-bg: #FFF1DE;
  --hc-font: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --hc-shadow-card: 0 1px 2px rgba(17,17,17,.05), 0 10px 28px -14px rgba(17,17,17,.20);
  --hc-shadow-card-hover: 0 2px 4px rgba(17,17,17,.05), 0 26px 48px -24px rgba(17,17,17,.32);
  --hc-shadow-panel: 0 1px 2px rgba(17,17,17,.05), 0 18px 40px -22px rgba(17,17,17,.25);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{margin:0;background:#FFFFFF;color:#111111;font-family:var(--hc-font);-webkit-font-smoothing:antialiased}
a{color:#111111;text-decoration:none}a:hover{color:#E01E37}
h1,h2,h3,p{text-wrap:pretty}
:focus-visible{outline:3px solid #E01E37;outline-offset:3px;border-radius:8px}
.hc-page{width:100%;min-width:0;background:#FFFFFF;color:#111111;overflow-x:clip}
.hc-skip{position:absolute;left:-9999px;top:8px;z-index:100;padding:10px 14px;border-radius:10px;background:#111111;color:#FFFFFF;font-weight:700}
.hc-skip:focus{left:8px;color:#FFFFFF}
[hidden]{display:none!important}

.c-btn{transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease}
.c-btn:hover{transform:translateY(-1px)}
.c-red:hover{box-shadow:0 12px 26px -10px rgba(224,30,55,.6);color:#FFFFFF}
.c-out:hover{background:#F7F8FA;color:#111111}
.c-card{box-shadow:0 1px 2px rgba(17,17,17,.05),0 10px 28px -14px rgba(17,17,17,.20);transition:transform .2s ease,box-shadow .2s ease}
.c-card:hover{transform:translateY(-3px);box-shadow:0 2px 4px rgba(17,17,17,.05),0 26px 48px -24px rgba(17,17,17,.32)}
.c-panel{box-shadow:0 1px 2px rgba(17,17,17,.05),0 18px 40px -22px rgba(17,17,17,.25)}
.c-nav a{text-decoration:none}
.c-menu a:hover{background:#F7F8FA;color:#111111}
.c-links{display:flex}
.c-links a,.c-links button,.c-login{white-space:nowrap}
.c-burger{display:none}
.c-hide{display:flex}
.c-sticky{display:none}
@media (max-width: 1300px){.c-links{display:none}.c-burger{display:inline-flex}}
@media (max-width: 720px){.c-hide{display:none}.c-sticky{display:flex}.c-nav nav{height:62px!important}.c-nav nav img{height:26px!important}}
@media (max-width: 520px){.c-login{display:none}}
@media (prefers-reduced-motion: reduce){.c-btn,.c-card{transition:none}.c-btn:hover,.c-card:hover{transform:none}}

.hc-gvo{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:500;line-height:1;color:#5F6368;white-space:nowrap}
.hc-brand{display:flex;flex-direction:column;align-items:flex-start;gap:4px;flex:none}
.hc-gvo strong{font-weight:800;color:#111111;letter-spacing:.02em}
.hc-gvo:hover,.hc-gvo:hover strong{color:#E01E37}
.hc-foot a{color:#C9CBD0}
.hc-foot a:hover{color:#FFFFFF}

/* motion */
@keyframes cUp{from{opacity:0;translate:0 44px}to{opacity:1;translate:0 0}}
@keyframes cImg{from{opacity:0;scale:1.07;clip-path:inset(7% 5% 7% 5% round 26px)}to{opacity:1;scale:1;clip-path:inset(0 0 0 0 round 0)}}
@keyframes cIn{from{opacity:0;translate:0 20px}to{opacity:1;translate:0 0}}
@keyframes cFloat{0%,100%{translate:0 0}50%{translate:0 -9px}}
@keyframes cRise{0%{opacity:0;translate:0 0;scale:.6}12%{opacity:1;scale:1.1}70%{opacity:.9}100%{opacity:0;translate:var(--dx,0) -170px;scale:1}}
@keyframes cToast{0%{opacity:0;translate:-14px 0}4%,28%{opacity:1;translate:0 0}33%,100%{opacity:0;translate:-14px 0}}
@keyframes cDot{0%{box-shadow:0 0 0 0 rgba(224,30,55,.55)}70%{box-shadow:0 0 0 9px rgba(224,30,55,0)}100%{box-shadow:0 0 0 0 rgba(224,30,55,0)}}
.c-in{animation:cIn .8s cubic-bezier(.2,.7,.2,1) both}
.c-d1{animation-delay:.08s}.c-d2{animation-delay:.18s}.c-d3{animation-delay:.28s}.c-d4{animation-delay:.42s}
.c-float{animation:cFloat 5s ease-in-out infinite}
.c-dot{animation:cDot 1.8s ease-out infinite}
.c-rise{position:absolute;bottom:0;opacity:0;animation:cRise 4.2s ease-out infinite}
.c-toast{animation:cToast 12s ease-in-out infinite both}

/* Scroll reveals: scroll-driven where the browser supports it, otherwise hc.js adds .hc-io to <html>
   and .hc-seen to each element as it enters the screen. */
@supports (animation-timeline: view()){
main h2:not(.c-norv),.c-rv{animation:cUp linear both;animation-timeline:view();animation-range:entry 0% entry 100%}
main .c-card{animation:cUp linear both;animation-timeline:view();animation-range:entry 0% entry 100%}
main .c-card:nth-child(3n+2){animation-range:entry 12% entry 100%}
main .c-card:nth-child(3n){animation-range:entry 24% entry 100%}
.c-rv-img{animation:cImg linear both;animation-timeline:view();animation-range:entry 0% cover 36%}
}
.hc-io main h2:not(.c-norv),.hc-io .c-rv,.hc-io main .c-card,.hc-io .c-rv-img{opacity:0}
.hc-io main h2.hc-seen:not(.c-norv),.hc-io .c-rv.hc-seen,.hc-io main .c-card.hc-seen{animation:cUp .7s cubic-bezier(.2,.7,.2,1) both}
.hc-io main .c-card.hc-seen:nth-child(3n+2){animation-delay:.08s}
.hc-io main .c-card.hc-seen:nth-child(3n){animation-delay:.16s}
.hc-io .c-rv-img.hc-seen{animation:cImg .9s cubic-bezier(.2,.7,.2,1) both}
@media (prefers-reduced-motion: reduce){
.c-in,.c-float,.c-dot,.c-toast,main h2,main .c-card,.c-rv,.c-rv-img,.c-si,.c-stxt,.c-pdot{animation:none!important}
.hc-io main h2,.hc-io .c-rv,.hc-io main .c-card,.hc-io .c-rv-img{opacity:1}
.c-rise{display:none}
}
