/* Consistent icons, independent of the device's emoji font. */
.ui-arrow{display:inline-block;width:1em;height:1em;vertical-align:-.12em;flex-shrink:0}
.ui-play{display:block;width:24px;height:24px}
.round-button{display:inline-flex;align-items:center;justify-content:center}
.button>span:last-child{display:inline-flex;align-items:center}
.winner-value .ui-arrow{width:.7em;height:.7em;vertical-align:0}
.footer-top a .ui-arrow{margin-left:.2em}
.workplaces img[alt=Anthropic]{width:100%;max-width:140px;height:34px;max-height:34px}
.footer-bottom{display:flex;align-items:baseline;justify-content:space-between;gap:16px;font-size:12px}
.footer-bottom>.back-to-top{display:inline-flex;align-items:baseline;gap:7px;flex-shrink:0;white-space:nowrap;color:var(--ink);text-decoration:none}
.footer-bottom>.back-to-top:hover{text-decoration:underline}
.back-to-top .ui-arrow{align-self:center;transition:transform .3s var(--ease)}
.back-to-top:hover .ui-arrow{transform:translateY(-3px)}

/* One full-screen canvas, three sequential beats, one continuous exit. */
.site-intro{display:none;position:fixed;inset:0;z-index:1000;pointer-events:none;background:var(--yellow);color:var(--ink);overflow:hidden;transform:translateY(0);transition:transform .8s cubic-bezier(.76,0,.24,1),border-radius .8s cubic-bezier(.76,0,.24,1)}
.intro-pending .site-intro{display:grid;place-items:center;animation:intro-canvas 1.7s linear both}
.intro-pending{overflow:hidden}
.intro-words{position:relative;display:grid;place-items:center;width:100%;padding:.15em .05em .22em;overflow:hidden;font-size:clamp(48px,17vw,270px);line-height:1.1;letter-spacing:-.075em;font-weight:700;transition:transform .8s var(--ease)}
.intro-word{grid-area:1/1;display:block;white-space:nowrap;padding:0 .1em;will-change:transform,opacity;animation:intro-first 1.7s var(--ease) both}
.intro-word:nth-child(2){animation-name:intro-second}
.intro-word:nth-child(3){animation-name:intro-third}
.intro-word>span{color:var(--paper)}
.intro-word:nth-child(3)>span{color:var(--yellow)}
.intro-leaving .site-intro{transform:translateY(-101%);border-radius:0 0 50% 50% / 0 0 8% 8%}
.intro-leaving .intro-words{transform:translateY(-7vh) scale(1.06)}
.intro-pending:not(.intro-leaving) .hero h1 .line>span,.intro-pending:not(.intro-leaving) .hero-collage{animation-play-state:paused}
@keyframes intro-canvas{0%,28%{background:var(--yellow);color:var(--ink)}38%,61%{background:var(--violet);color:var(--ink)}73%,100%{background:var(--ink);color:var(--paper)}}
@keyframes intro-first{0%{opacity:0;transform:translateY(110%) rotate(4deg) scale(.92)}12%,26%{opacity:1;transform:translateY(0) rotate(0) scale(1)}35%,100%{opacity:0;transform:translateY(-110%) rotate(-3deg) scale(1.04)}}
@keyframes intro-second{0%,30%{opacity:0;transform:translateY(110%) rotate(4deg) scale(.92)}42%,60%{opacity:1;transform:translateY(0) rotate(0) scale(1)}70%,100%{opacity:0;transform:translateY(-110%) rotate(-3deg) scale(1.04)}}
@keyframes intro-third{0%,65%{opacity:0;transform:translateY(110%) rotate(4deg) scale(.92)}79%,100%{opacity:1;transform:translateY(0) rotate(0) scale(1)}}

/* A mobile navigation surface with the same destinations as desktop. */
.menu-toggle{display:none}
.mobile-menu{position:fixed;inset:0;width:100%;max-width:none;height:100%;height:100dvh;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:var(--paper);color:var(--ink);overflow:auto;overscroll-behavior:contain;transform:translateY(-18px);opacity:0;transition:transform .35s var(--ease),opacity .25s}
.mobile-menu.is-open{transform:translateY(0);opacity:1}
.mobile-menu::backdrop{background:var(--ink)}
.menu-shell{min-height:100%;display:flex;flex-direction:column;padding:0 var(--gutter) max(28px,env(safe-area-inset-bottom));overflow:hidden}
.menu-top{height:80px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;gap:20px}
.menu-top>img{width:155px;height:auto;object-fit:contain}
.menu-close{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:var(--ink);color:var(--paper);flex-shrink:0}
.menu-close svg{width:24px;height:24px;transition:rotate .3s}
.menu-close:hover svg{rotate:90deg}
.menu-links{display:flex;flex-direction:column;margin:auto 0;padding:35px 0 40px}
.menu-links a{display:grid;grid-template-columns:24px minmax(0,1fr) 28px;align-items:center;gap:14px;padding:clamp(19px,3.5svh,32px) 0;border-top:1px solid #1e1b1a35;font-size:clamp(27px,7.5vw,62px);font-weight:650;line-height:1.12;letter-spacing:-.05em;transform:translateY(30px);opacity:0;transition:transform .5s var(--ease),opacity .4s,color .2s}
.menu-links a:last-child{border-bottom:1px solid #1e1b1a35}
.menu-links .menu-index{font:12px/1 Plex,monospace;letter-spacing:0;align-self:center;opacity:.5}
.menu-links a>span:last-child{font-size:25px;transition:transform .3s}
.menu-links a:hover>span:last-child{transform:translate(3px,-3px)}
.is-open .menu-links a{transform:none;opacity:1;transition-delay:.07s}
.is-open .menu-links a:nth-child(2){transition-delay:.12s}
.is-open .menu-links a:nth-child(3){transition-delay:.17s}
.is-open .menu-links a:nth-child(4){transition-delay:.22s}
.menu-bottom{display:flex;flex-direction:column;gap:22px;flex-shrink:0;padding:25px;border-radius:4px;background:var(--violet)}
.menu-bottom p{font-size:clamp(22px,5.5vw,34px);line-height:1.1;font-weight:600;letter-spacing:-.04em}
.menu-bottom .button{background:var(--yellow);color:var(--ink);font-size:16px;padding:19px 23px;width:100%}
.menu-open,.menu-open body{overflow:hidden;overscroll-behavior:none}
.menu-open body{position:fixed;top:var(--menu-scroll-top);left:0;width:100%}

@media(max-width:900px){
  .menu-ready .site-header{height:80px;flex-wrap:nowrap;align-content:normal;gap:12px}
  .menu-ready .site-header .desktop-nav{display:none}
  .menu-ready .site-header>.button{display:inline-flex;margin-left:auto;font-size:14px;padding:14px 17px;gap:14px;min-height:46px;background:var(--yellow);color:var(--ink)}
  .menu-ready .site-header>.button>span:last-child{font-size:20px}
  .menu-ready .site-header .logo img{width:clamp(100px,28vw,155px)}
  .menu-ready .menu-toggle{display:inline-flex;align-items:center;justify-content:center;background:transparent;color:var(--ink);border-radius:0;padding:10px;width:44px;height:46px;flex-shrink:0}
  .menu-toggle svg{width:24px;height:24px}
}
@media(max-width:760px){
  .community-heading h2{font-size:clamp(40px,10.7vw,80px);line-height:1.1}
  .community-heading{gap:44px}
  
  
  
  
  .workplaces>div{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px clamp(24px,10vw,76px);max-width:520px;margin:28px auto 0;align-items:center;justify-items:center}
  .workplaces img{width:100%;max-width:110px;height:34px;max-height:34px}
  .workplaces img[alt=Webflow]{height:34px;max-height:34px}
  .learn-stage h2{font-size:clamp(42px,10.5vw,80px);line-height:1.02}
  .video-card{top:55%;width:min(78vw,65svh)}
  .menu-ready .site-header{gap:8px}
  .menu-ready .site-header>.button{font-size:13px;padding:14px;gap:10px}
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
}
@media(max-width:380px){
  .menu-top>img{width:140px}
  .menu-ready .site-header{gap:6px}
  .menu-ready .site-header .logo img{width:92px}
  .menu-ready .site-header>.button{font-size:12px;padding:13px 12px;gap:7px}
  .menu-ready .site-header>.button>span:last-child{font-size:18px}
  .menu-links a{gap:9px;grid-template-columns:20px minmax(0,1fr) 24px}
  .menu-bottom{padding:20px}
  
  
  
  
  
}
@media(max-width:760px) and (max-height:699px){
  .learn-stage h2{font-size:clamp(38px,min(10.5vw,9svh),64px)}
}
@media(prefers-reduced-motion:reduce){
  .site-intro{display:none!important}
  .intro-pending{overflow:visible}
  .mobile-menu,.menu-links a,.menu-close svg{transition:none;transform:none}
  .video-card{top:auto;width:min(900px,85vw)}
}

/* Workplace logos run as a ticker. The second set is a hidden duplicate, and
   each set carries its trailing gap, so the track loops seamlessly at -50%. */
.workplaces>.logo-marquee{display:block;flex:1;min-width:0;max-width:none;margin:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.workplaces>.logo-marquee{justify-items:normal;display:block}
.workplaces .logo-track{display:flex;width:max-content;justify-self:start;margin:0;animation:marquee 36s linear infinite}
.workplaces .logo-set{display:flex;align-items:center;flex:none;gap:clamp(40px,4.5vw,72px);padding-right:clamp(40px,4.5vw,72px)}
.workplaces .logo-track img{flex:none;width:90px;max-width:none;height:30px;max-height:none}
.workplaces .logo-track img[alt=Webflow]{width:110px;height:30px}
.workplaces .logo-track img[alt=Anthropic]{width:140px;height:34px}
@media(max-width:760px){
  .workplaces>.logo-marquee{margin-top:25px}
}
@media(prefers-reduced-motion:reduce){
  .workplaces>.logo-marquee{-webkit-mask-image:none;mask-image:none}
  .workplaces .logo-track{display:block;width:auto}
  .workplaces .logo-set{flex-wrap:wrap;padding-right:0}
  .workplaces .logo-set[aria-hidden]{display:none}
}

