@font-face{font-family:"Bricolage";src:url(/fonts/display.woff2) format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"Instrument";src:url(/fonts/body.woff2) format("woff2");font-weight:400 700;font-display:swap}
:root{--navy:#0c1b2e;--navy2:#13283f;--mint:#a0f0e8;--coral:#ff5a4a;--coral-d:#e8473a;--blue:#3a6fd8;--teal:#2bb5a4;--paper:#eef6f4;--ink:#0c1b2e;--muted:#5a6f7e;--line:#d3e2de;
--display:"Bricolage",system-ui,sans-serif;--body:"Instrument",system-ui,sans-serif}
*{box-sizing:border-box}
html{background:var(--navy)}
body{margin:0;font:17px/1.6 var(--body);color:var(--ink);background:var(--navy);-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
h1,h2,h3{font-family:var(--display);line-height:1.02;letter-spacing:-.025em;margin:0;font-weight:700}
/* grain */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:90;opacity:.07;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
/* progress */
.progress{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--teal),var(--mint),var(--coral));z-index:100}
/* header */
header.site{position:fixed;top:0;left:0;right:0;z-index:80;transition:background .3s,transform .4s}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:14px;padding-bottom:14px}
header.site.solid{background:rgba(12,27,46,.88);backdrop-filter:blur(10px)}
.logo img{height:34px;display:block}
nav{display:flex;align-items:center;gap:22px}
nav a{color:#e5f4f1;text-decoration:none;font-size:.95rem;position:relative}
nav a:not(.pill)::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;background:var(--coral);transform:scaleX(0);transform-origin:0 50%;transition:transform .3s}
nav a:not(.pill):hover::after{transform:scaleX(1)}
.pill{background:var(--coral);color:var(--navy);padding:8px 16px;border-radius:99px;font-weight:700}
/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--coral);color:var(--navy);border:0;border-radius:99px;padding:15px 28px;font:700 1rem var(--body);text-decoration:none;cursor:pointer;will-change:transform;transition:background .2s}
.btn:hover{background:#ff7466}
.btn.ghost{background:transparent;color:var(--mint);box-shadow:inset 0 0 0 2px rgba(160,240,232,.45)}
.btn.ghost:hover{background:rgba(160,240,232,.12)}
.btn .arr{display:inline-block;transition:transform .25s}
.btn:hover .arr{transform:translateX(5px)}
/* hero */
.hero{position:relative;min-height:100svh;background:var(--navy);color:#fff;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding:110px 0 70px}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero .fallback{position:absolute;inset:0;background:radial-gradient(60% 50% at 70% 30%,rgba(43,181,164,.35),transparent 70%),radial-gradient(50% 50% at 15% 80%,rgba(58,111,216,.3),transparent 70%)}
.hero .wrap{position:relative;z-index:2}
.kicker{display:flex;align-items:center;gap:10px;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mint)}
.kicker::before{content:"";width:34px;height:2px;background:var(--coral)}
.lockup{display:flex;align-items:flex-end;gap:0;margin:22px 0 10px;height:clamp(64px,13vw,150px)}
.lockup .cross{height:100%;aspect-ratio:1;margin-right:.5em;align-self:flex-start;overflow:visible}
.lockup .mask{overflow:hidden;display:block;height:100%}
.lockup img{height:100%;display:block;width:auto}
.hero h1{font-size:clamp(2.1rem,6.2vw,5.4rem);max-width:15ch;margin-top:18px}
.hero h1 em{font-style:normal;color:var(--coral)}
.hero .lead{max-width:540px;color:#cfe6e2;margin:20px 0 0;font-size:1.1rem}
.eventbar{margin-top:34px;display:flex;flex-wrap:wrap;align-items:center;gap:20px 34px;border-top:1px solid rgba(160,240,232,.25);padding-top:22px}
.eventbar .name{font:700 1.25rem var(--display);letter-spacing:-.01em}
.eventbar .meta{color:#a9c7c3;font-size:.92rem}
.count{display:flex;gap:14px}
.count div{text-align:center;min-width:54px}
.count b{display:block;font:700 2rem/1 var(--display);color:var(--mint);font-variant-numeric:tabular-nums}
.count span{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:#8fb2ad}
.ecg{position:absolute;left:0;right:0;bottom:46px;width:100%;height:80px;z-index:1;opacity:.55}
.ecg path{fill:none;stroke:var(--teal);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.scrollhint{position:absolute;left:50%;bottom:14px;z-index:2;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:#7fa5a0;transform:translateX(-50%)}
/* marquee */
.ticker{background:var(--coral);color:var(--navy);overflow:hidden;white-space:nowrap;padding:18px 0;margin:0;position:relative;z-index:3}
.ticker .track{display:inline-flex;animation:tick 38s linear infinite}
.ticker span{font:800 clamp(1.8rem,4.5vw,3.4rem)/1 var(--display);letter-spacing:-.02em;padding:0 .5em;display:inline-flex;align-items:center;gap:1em}
.ticker span::after{content:"✚";font-size:.5em}
@keyframes tick{to{transform:translateX(-50%)}}
/* event feature */
.feature{background:var(--paper);padding:120px 0}
.feature .top{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:end}
.feature h2{font-size:clamp(2.3rem,6vw,4.8rem)}
.feature h2 em{font-style:normal;color:var(--coral)}
.feature .copy{font-size:1.15rem;color:#33495a;max-width:46ch}
.bignums{display:grid;grid-template-columns:repeat(4,1fr);margin-top:70px;border-top:2px solid var(--ink)}
.bignums div{padding:22px 18px 6px 0;border-right:1px solid var(--line)}
.bignums div+div{padding-left:22px}
.bignums div:last-child{border-right:0}
.bignums b{display:block;font:800 clamp(2.4rem,6vw,4.4rem)/1 var(--display);letter-spacing:-.04em}
.bignums span{display:block;color:var(--muted);font-size:.9rem;margin-top:8px}
.feature .cta{margin-top:50px;display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.feature .cta .btn.ghost{color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
.feature .cta .btn.ghost:hover{background:rgba(12,27,46,.06)}
.feature .who{margin-top:40px;color:var(--muted);font-size:.95rem}
@media(max-width:800px){.feature{padding:80px 0}.feature .top{grid-template-columns:1fr;gap:24px}.bignums{grid-template-columns:1fr 1fr}.bignums div:nth-child(2){border-right:0}.bignums div:nth-child(3){padding-left:0}.bignums div:nth-child(n+3){border-top:1px solid var(--line);margin-top:12px}}
/* wall */
.wall{background:var(--navy);color:#fff;padding:110px 0 120px;position:relative;overflow:hidden}
.wall h2{font-size:clamp(2.2rem,6vw,4.6rem);max-width:14ch}
.wall .lead{color:#bcd7d3;max-width:48ch;margin:18px 0 44px;font-size:1.1rem}
.frames{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:170px 170px;gap:14px}
.frames div{border:1.5px dashed rgba(160,240,232,.3);border-radius:18px;display:flex;align-items:flex-end;padding:14px;color:#6f9792;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase}
.frames div:first-child{grid-row:span 2}
.frames div:nth-child(4){grid-column:span 2}
@media(max-width:700px){.frames{grid-template-columns:1fr 1fr;grid-template-rows:140px 140px 140px}.frames div:first-child{grid-row:auto;grid-column:span 2}.frames div:nth-child(4){grid-column:span 1}}
/* contact */
.contact{background:var(--coral);color:var(--navy);padding:110px 0 80px}
.contact h2{font-size:clamp(2.2rem,7vw,5.6rem)}
.contact .mail{display:inline-block;margin-top:26px;font:700 clamp(1.2rem,3.6vw,2.6rem) var(--display);letter-spacing:-.02em;text-decoration:none;border-bottom:3px solid var(--navy);word-break:break-all}
.contact .rows{display:flex;gap:30px;flex-wrap:wrap;margin-top:34px}
.contact .rows a{font-weight:700;text-decoration:none;border-bottom:2px solid transparent}
.contact .rows a:hover{border-color:var(--navy)}
footer.site{background:var(--navy);color:#8fb2ad;padding:30px 0;font-size:.88rem}
footer.site a{color:var(--mint)}
/* reveal states (only when JS is running and healthy) */
.js:not(.failed) [data-reveal]{opacity:0;transform:translateY(28px)}
.js:not(.failed) .lockup .mask>*,.js:not(.failed) .lockup .mask img{will-change:transform}
/* cursor */
.cursor{position:fixed;left:0;top:0;width:14px;height:14px;border-radius:50%;background:var(--coral);pointer-events:none;z-index:95;mix-blend-mode:normal;opacity:0;transition:width .25s,height .25s,opacity .3s,background .25s}
.cursor.big{width:54px;height:54px;background:rgba(255,90,74,.25);box-shadow:0 0 0 1.5px var(--coral)}
@media(hover:none){.cursor{display:none}}
/* ---------- inner pages (events, merit, gallery, winners) ---------- */
.page{background:var(--paper)}
.subhero{background:var(--navy);color:#fff;padding:150px 0 70px}
.subhero h1{font-size:clamp(2.2rem,6vw,4.8rem);max-width:16ch}
.subhero p{color:#bcd7d3;max-width:56ch;font-size:1.1rem;margin:18px 0 0}
section.blk{padding:64px 0}
section.blk h2{font-size:clamp(1.7rem,4vw,2.6rem);margin-bottom:22px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px}
.card h3{font-size:1.2rem;margin-bottom:6px}
.card p{margin:0;color:var(--muted)}
.badge{display:inline-block;background:#dff3ef;color:#0a6f66;border-radius:99px;padding:3px 12px;font-size:.78rem;font-weight:700;margin-bottom:10px}
.badge.closed{background:#e8ecef;color:#667}
dl.facts{display:grid;grid-template-columns:max-content 1fr;gap:10px 28px;margin:0}
dl.facts dt{font-weight:700}
dl.facts dd{margin:0;color:var(--muted)}
ol.steps{padding-left:22px}
ol.steps li{margin-bottom:12px}
details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 18px;margin-bottom:10px}
summary{cursor:pointer;font-weight:700}
.msg{padding:12px 14px;border-radius:12px;font-weight:600}
.msg.err{background:#fde8e8;color:#9b1c1c}
.empty{color:var(--muted);font-style:italic}
.page .btn{color:var(--navy)}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px}
@media(max-width:600px){dl.facts{grid-template-columns:1fr;gap:2px}dl.facts dd{margin-bottom:10px}}
@media (prefers-reduced-motion:reduce){.ticker .track{animation:none}.cursor{display:none}}
/* lockup override: cross above wordmark */
.lockup{display:block;height:auto;margin:18px 0 6px}
.lockup .cross{display:block;height:clamp(38px,6.5vw,76px);width:auto;aspect-ratio:auto;margin:0 0 .5em .35em;will-change:transform}
.lockup .word{display:flex;align-items:flex-end;height:clamp(64px,13vw,150px)}
.lockup .word .mask{display:block;height:100%;overflow:hidden}
.lockup .word img{height:100%;width:auto;display:block}
.hero-h{font-size:clamp(2.1rem,6.2vw,5.4rem);max-width:15ch;margin:18px 0 0}.hero-h em{font-style:normal;color:var(--coral)}
.js:not(.failed) [data-hero]{opacity:0}
.js:not(.failed) .lockup,.js:not(.failed) .hero-h{visibility:hidden}
.ecg{bottom:auto;top:38%;height:130px;opacity:.3}
.hero-h{font-size:clamp(2.1rem,min(6.2vw,9.5vh),5.4rem)}
.lockup .word{height:clamp(64px,min(13vw,15vh),140px)}
.hero{padding:96px 0 56px}
.eventbar{margin-top:26px}

html{scroll-behavior:smooth;scroll-padding-top:70px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* nav + menu */
.menu{display:none;background:none;border:0;width:44px;height:44px;position:relative;cursor:pointer;padding:0}
.menu i{position:absolute;left:10px;right:10px;height:2px;background:#fff;border-radius:2px;transition:transform .3s,top .3s}
.menu i:nth-child(1){top:17px}.menu i:nth-child(2){top:26px}
.menu[aria-expanded=true] i:nth-child(1){top:21px;transform:rotate(45deg)}
.menu[aria-expanded=true] i:nth-child(2){top:21px;transform:rotate(-45deg)}
nav a.act:not(.pill)::after{transform:scaleX(1)}
nav a.act:not(.pill){color:var(--mint)}
@media(max-width:820px){
  .menu{display:block}
  nav{position:absolute;top:100%;left:0;right:0;height:calc(100svh - 62px);flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;background:#0c1b2e;padding:8px 24px 22px;transform:translateY(-12px);opacity:0;visibility:hidden;transition:opacity .25s,transform .25s,visibility .25s}
  nav.open{opacity:1;transform:none;visibility:visible}
  nav a{padding:15px 0;font-size:1.15rem;border-bottom:1px solid rgba(160,240,232,.12)}
  nav a::after{display:none}
  nav .pill{margin-top:16px;text-align:center;border:0;padding:14px}
  header.site,header.site.solid{background:#0c1b2e;backdrop-filter:none}
}

/* story: ring (fits any phone height, dark behind so a resize never shows white) */
.story{position:relative;background:var(--navy);color:#fff;height:100vh;height:100lvh;display:flex;align-items:flex-start;overflow:hidden;padding:68px 0 18px}
.story .wrap{width:100%;height:calc(100vh - 86px);height:calc(100dvh - 86px);display:flex;align-items:center}
.story .grid2{width:100%}
.story .grid2{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}
.story-head{margin-bottom:10px}
.numrow{display:flex;align-items:baseline;gap:12px}
.story .num{font:800 clamp(3.6rem,min(15vw,17svh),10rem)/.85 var(--display);color:transparent;-webkit-text-stroke:2px rgba(160,240,232,.5);letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.story .of{font:600 1rem var(--display);color:#8fb2ad}
.story .steps{position:relative;height:clamp(150px,26svh,230px);margin-top:10px}
.story .step{position:absolute;inset:0;opacity:0}
.story .step:first-child{opacity:1}
.story h2{font-size:clamp(1.9rem,min(6vw,6.2svh),4.4rem);margin:0 0 10px}
.story .step p{color:#bcd7d3;max-width:44ch;font-size:clamp(.98rem,2.4svh,1.15rem);margin:0}
.story .dots{display:flex;gap:6px;margin-top:10px;width:100%}
.story .dots button{all:unset;cursor:pointer;flex:1;height:44px;position:relative}
.story .dots button::after{content:"";position:absolute;left:0;right:0;top:calc(50% - 2px);height:4px;border-radius:2px;background:rgba(160,240,232,.2);transition:background .4s}
.story .dots button.on::after{background:var(--coral)}
.story-foot{display:flex;justify-content:center;margin-top:0;min-height:20px}
.story-foot .hint{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:#7fa5a0;transition:opacity .4s}
.story .art{display:flex;justify-content:center}
.story .ring{width:min(380px,40svh,76vw);aspect-ratio:1;position:relative}
.story .ring svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.story .ring path{fill:none;stroke-width:5;stroke-linecap:round}
.story .ring path.base{stroke:rgba(160,240,232,.18)}
.story .ring path.hi{stroke:var(--coral);stroke-dasharray:1;stroke-dashoffset:1;opacity:0}
.story .ring img{position:absolute;left:50%;top:50%;width:34%;transform:translate(-50%,-50%);will-change:transform}
@media(max-width:800px){
  .story .grid2{grid-template-columns:1fr;gap:8px}
  .story .art{order:-1}
  .story .ring{width:min(220px,28svh,60vw)}
  .story .steps{height:clamp(130px,21svh,200px)}
  .story .txt{text-align:center}
  .story .kicker,.story .numrow{justify-content:center}
  .story .step p{margin-left:auto;margin-right:auto}
}
.failed .story{height:auto;min-height:0;overflow:visible;padding:100px 0 60px}
.failed .story .steps{height:auto}
.failed .story .step{position:static;opacity:1;margin-bottom:22px}
.failed .story .numrow,.failed .story .dots,.failed .story-foot{display:none}
.failed .story .txt{text-align:left}
.subhero .dl{margin-left:14px;color:#bcd7d3}
.subhero .wrap>p a.btn{margin-top:4px}
/* language switch */
.logo{margin-right:auto}
.langsw{display:flex;border:1.5px solid rgba(160,240,232,.4);border-radius:99px;padding:2px;margin-left:18px}
.langsw button{all:unset;cursor:pointer;font:700 .78rem/1 var(--body);letter-spacing:.06em;color:#cfe6e2;padding:9px 12px;border-radius:99px}
.langsw button.on{background:var(--coral);color:var(--navy)}
.langsw button:focus-visible{outline:2px solid var(--mint);outline-offset:2px}
@media(max-width:820px){.langsw{margin-left:0;margin-right:6px}}
