/* ===== About page: hero ===== */
.ab-hero{position:relative;isolation:isolate;min-height:min(78vh,680px);display:grid;align-items:center;color:#fff;padding:clamp(4rem,10vw,6.5rem) 0 9rem;overflow:hidden;background:linear-gradient(160deg,#062f3a,#0d7a78)}
.ab-hero:before{content:"";position:absolute;inset:-4%;background:url(../img/slide/slide4.jpg) center/cover;z-index:-3;animation:abkb 26s ease-in-out infinite alternate}
.ab-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(4,32,42,.92),rgba(52,28,110,.55) 60%,rgba(217,67,43,.25));z-index:-2}
@keyframes abkb{to{transform:scale(1.14) translate(-2%,-1%)}}
.blob{position:absolute;border-radius:50%;filter:blur(40px);opacity:.55;z-index:-1;animation:blob 14s ease-in-out infinite alternate}
.b1{width:340px;height:340px;background:#d9432b;left:-80px;top:10%}.b2{width:300px;height:300px;background:#3fb6ac;right:4%;top:-60px;animation-delay:-5s}.b3{width:220px;height:220px;background:#ffc4a3;right:30%;bottom:10%;animation-delay:-9s}
@keyframes blob{to{transform:translate(60px,-40px) scale(1.25)}}
.eyebrow{display:inline-block;padding:.45rem 1.2rem;border-radius:99px;border:1px solid rgba(255,255,255,.35);font:600 .85rem 'Plus Jakarta Sans',system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;background:linear-gradient(110deg,rgba(255,255,255,.1) 35%,rgba(255,255,255,.42) 50%,rgba(255,255,255,.1) 65%) 0 0/250% 100%;animation:shim 3.2s linear infinite,up .8s both}
@keyframes shim{to{background-position:-250% 0}}
.ab-hero h1{font-size:clamp(2.1rem,6vw,4.3rem);font-weight:800;line-height:1.02;letter-spacing:-.035em;max-width:19ch;margin:1.4rem 0}
.ab-hero h1 span{display:inline-block;animation:up .9s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--w)*.09s + .25s)}
.sub-h{font-size:clamp(1.05rem,2.5vw,1.4rem);max-width:34ch;opacity:.92;animation:up 1s .9s both}
.scroll{display:block;width:26px;height:44px;border:2px solid rgba(255,255,255,.7);border-radius:99px;margin-top:2.2rem;position:relative;animation:up 1s 1.2s both}
.scroll i{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:4px;background:#fff;animation:dot 1.6s infinite}
@keyframes dot{60%{transform:translateY(16px);opacity:0}100%{opacity:0}}
.wave{position:absolute;left:0;bottom:-1px;width:100%;height:clamp(60px,10vw,120px)}.wave path{fill:var(--bg);animation:wv 12s ease-in-out infinite alternate;transform-origin:center}
@keyframes wv{to{transform:scaleX(1.12) translateX(-3%)}}
/* ===== facts ===== */
.facts{padding:0;position:relative;z-index:3;margin-top:-4.5rem}
.facts .w{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media(max-width:760px){.facts .w{grid-template-columns:1fr 1fr}}
.f{background:var(--s);border:1px solid var(--ln);border-radius:26px;padding:1.4rem 1rem;text-align:center;box-shadow:0 24px 50px -30px #0006;transition:transform .35s}.f:hover{transform:translateY(-8px)}
.f b{display:block;font:800 clamp(2rem,6vw,3.2rem)/1 'Fraunces',system-ui,sans-serif;background:linear-gradient(135deg,var(--cr),var(--sf));-webkit-background-clip:text;background-clip:text;color:transparent}.f span{font-size:.92rem;color:var(--mu)}
/* ===== tabs ===== */
.ab-main{padding-top:3.5rem}
.tabs{position:sticky;top:calc(70px + env(safe-area-inset-top,0px) + .6rem);z-index:40;display:flex;gap:.2rem;overflow-x:auto;scrollbar-width:none;background:color-mix(in srgb,var(--s) 88%,transparent);backdrop-filter:blur(14px);border:1px solid var(--ln);border-radius:99px;padding:.4rem;margin:0 auto 2rem;width:fit-content;max-width:100%;box-shadow:0 14px 34px -22px #0007;scroll-snap-type:x proximity}
.tabs::-webkit-scrollbar{display:none}
.ind{position:absolute;top:.4rem;bottom:.4rem;left:0;width:var(--w,0);transform:translateX(var(--x,0));background:linear-gradient(135deg,var(--cr),color-mix(in srgb,var(--cr) 60%,var(--sf)));border-radius:99px;transition:transform .5s cubic-bezier(.3,1.35,.4,1),width .5s cubic-bezier(.3,1.35,.4,1);z-index:0}
.tab{position:relative;z-index:1;flex:0 0 auto;min-height:44px;border:0;background:none;color:var(--ink);font:600 .95rem 'Plus Jakarta Sans',system-ui,sans-serif;padding:.6rem 1.3rem;border-radius:99px;cursor:pointer;white-space:nowrap;transition:color .3s;scroll-snap-align:center}
.tab:hover{color:var(--sf)}.tab[aria-selected=true]{color:var(--s)}
@media(max-width:700px){.tabs{width:100%;border-radius:24px}}
/* ===== panels ===== */
.panels{max-width:1000px;margin-inline:auto}
.panel{background:var(--s);border:1px solid var(--ln);border-radius:34px;padding:clamp(1.4rem,4.5vw,3.2rem);box-shadow:0 40px 70px -50px #0006;position:relative;overflow:hidden}
.panel[hidden]{display:none}
.panel:before{content:"";position:absolute;right:-90px;top:-90px;width:260px;height:260px;border-radius:50%;background:radial-gradient(color-mix(in srgb,var(--sf) 22%,transparent),transparent 70%);pointer-events:none}
.panel p{max-width:none}
.panel.in{animation:pin .55s cubic-bezier(.2,.8,.2,1) both}
.panel.in>*{animation:pin2 .7s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--k,0)*60ms + 80ms)}
.panel.in>:nth-child(1){--k:0}.panel.in>:nth-child(2){--k:1}.panel.in>:nth-child(3){--k:2}.panel.in>:nth-child(4){--k:3}.panel.in>:nth-child(5){--k:4}.panel.in>:nth-child(6){--k:5}.panel.in>:nth-child(n+7){--k:6}
@keyframes pin{from{opacity:0;transform:translateY(24px) scale(.985)}}@keyframes pin2{from{opacity:0;transform:translateY(26px)}}
.pw{display:flex;align-items:center;gap:1.1rem}
.bdg{position:relative;flex:0 0 auto;display:grid;place-items:center;width:68px;height:68px;border-radius:50%;background:linear-gradient(135deg,var(--cr),var(--sf));color:#fff}
.bdg:before{content:"";position:absolute;inset:-7px;border-radius:50%;background:conic-gradient(var(--sf),transparent 55%,var(--cr));animation:spin 5s linear infinite;-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px))}
.ico{width:30px;height:30px}
.kick{margin:0 0 .2rem;font:700 .8rem 'Plus Jakarta Sans',system-ui,sans-serif;letter-spacing:.14em;color:var(--sf);text-transform:uppercase}
.panel h2{font-size:clamp(1.7rem,4.6vw,2.7rem)}
.lead-line{font:700 clamp(1.15rem,2.7vw,1.55rem)/1.3 'Fraunces',system-ui,sans-serif;margin:1.3rem 0 1.6rem;background:linear-gradient(90deg,var(--cr),var(--sf));-webkit-background-clip:text;background-clip:text;color:transparent}
.fig{float:right;width:min(42%,360px);margin:.2rem 0 1rem 1.8rem}
.fig img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:30px 30px 110px 30px;animation:rev 1.2s cubic-bezier(.2,.8,.2,1) both .3s;transition:transform .6s}
.fig:hover img{transform:scale(1.03) rotate(-1deg)}
.fig figcaption{font-size:.8rem;color:var(--mu);margin-top:.5rem;text-align:center}
@keyframes rev{from{clip-path:inset(0 0 100% 0)}}
@media(max-width:700px){.fig{float:none;width:100%;margin:0 0 1.4rem}.fig img{aspect-ratio:16/10}}
.fig+p::first-letter{float:left;font:800 4rem/.8 'Fraunces',system-ui,sans-serif;color:var(--sf);padding:.35rem .6rem 0 0}
.hl{clear:both;margin:2rem 0 .5rem;padding:1.3rem 1.6rem;border-radius:24px;border:3px solid transparent;font:600 1.1rem/1.5 'Fraunces',system-ui,sans-serif;--a:0deg;background:linear-gradient(var(--sf2),var(--sf2)) padding-box,conic-gradient(from var(--a),var(--sf),var(--cr),var(--sf)) border-box;animation:ha 6s linear infinite}
@property --a{syntax:'<angle>';initial-value:0deg;inherits:false}@keyframes ha{to{--a:360deg}}
.sh{font:700 1.4rem 'Fraunces',system-ui,sans-serif;margin:2rem 0 1rem;padding-left:1rem;position:relative}.sh:before{content:"";position:absolute;left:0;top:.2em;bottom:.2em;width:5px;border-radius:5px;background:linear-gradient(var(--sf),var(--cr))}
.bq{margin:0 0 1.5rem;padding:1.3rem 1.6rem;border-left:6px solid var(--sf);background:var(--sf2);border-radius:0 26px 26px 0;font:600 clamp(1.2rem,3vw,1.7rem)/1.4 'Fraunces',system-ui,sans-serif}
.mt{margin-top:1.5rem}
.nxt{margin-top:2rem}.nxt:hover{transform:translateX(6px)}
/* objective cards */
.obj{list-style:none;margin:1.5rem 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr));gap:1rem}
.obj li{position:relative;overflow:hidden;background:var(--bg);border:1px solid var(--ln);border-radius:24px;padding:1.4rem 1.4rem 1.5rem;transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .3s,box-shadow .3s}
.panel.in .obj li{animation:pin2 .65s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*55ms + 260ms)}
.obj li:before{content:"";position:absolute;inset:0;background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--sf) 20%,transparent),transparent 65%);opacity:0;transition:opacity .3s;pointer-events:none}
.obj li:hover{transform:translateY(-7px);border-color:var(--sf);box-shadow:0 26px 40px -26px #0006}.obj li:hover:before{opacity:1}
.obj .num{position:absolute;right:1rem;top:.3rem;font:800 3.2rem/1 'Fraunces',system-ui,sans-serif;color:color-mix(in srgb,var(--cr) 16%,transparent);transition:.4s}.obj li:hover .num{color:var(--sf);transform:scale(1.15) rotate(-6deg)}
.obj h4{margin:0 0 .5rem;padding-right:3.2rem;font:700 1.1rem/1.2 'Fraunces',system-ui,sans-serif}
.obj p{margin:0;color:var(--mu);font-size:.95rem;line-height:1.6;position:relative}
.obj .ln{display:inline-block;margin-top:.8rem;position:relative}
.obj.alt li{border-left:5px solid var(--sf)}
/* registration */
.reg{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:1rem;margin-bottom:1.5rem}
.reg article{background:var(--bg);border:1px solid var(--ln);border-radius:24px;padding:1.4rem;transition:.35s}.reg article:hover{transform:translateY(-6px);border-color:var(--sf)}
.reg h4{margin:.7rem 0 .5rem;font:700 1.15rem 'Fraunces',system-ui,sans-serif}.reg p{margin:0;color:var(--mu);font-size:.95rem;word-break:break-word}.reg b{color:var(--ink)}
.pan{font:800 1.8rem 'Fraunces',system-ui,sans-serif!important;letter-spacing:.14em;color:var(--cr)!important}
.cpy{margin-top:.8rem;min-height:38px;padding:.25rem 1.1rem;border-radius:99px;border:2px solid var(--cr);background:none;color:var(--cr);font:600 .9rem 'Plus Jakarta Sans',system-ui,sans-serif;cursor:pointer;transition:.25s}.cpy:hover{background:var(--cr);color:var(--s)}
/* timeline */
.jr{list-style:none;margin:2.5rem auto 0;padding:0;max-width:860px;position:relative}
.jr:before,.jr:after{content:"";position:absolute;left:12px;top:.5rem;bottom:.5rem;width:3px;border-radius:3px}
.jr:before{background:var(--ln)}.jr:after{background:linear-gradient(var(--sf),var(--cr));transform-origin:top}
@supports(animation-timeline:view()){.jr:after{transform:scaleY(0);animation:grow2 linear both;animation-timeline:view();animation-range:entry 25% cover 65%}@keyframes grow2{to{transform:scaleY(1)}}}
.jr li{position:relative;padding:0 0 2.2rem 3.2rem}
.jr li:before{content:"";position:absolute;left:4px;top:.35rem;width:19px;height:19px;border-radius:50%;background:var(--s);border:4px solid var(--sf);box-shadow:0 0 0 6px color-mix(in srgb,var(--sf) 18%,transparent)}
.jr time{font:700 .85rem 'Plus Jakarta Sans',system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--sf)}.jr h4{margin:.2rem 0 .3rem;font:700 1.3rem 'Fraunces',system-ui,sans-serif}.jr p{margin:0;color:var(--mu)}
/* values */
.vals{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));gap:1rem;margin-top:2rem}
.v{background:linear-gradient(160deg,#0d7a78,#062f3a);color:#fff;border-radius:28px;padding:1.8rem 1rem;text-align:center;animation:fl 5s ease-in-out infinite;animation-delay:calc(var(--i)*-1s);transition:.3s}
.v:hover{background:linear-gradient(160deg,#d9432b,#8a2f0a);transform:scale(1.06)}
.v b{display:block;font:800 1.4rem 'Fraunces',system-ui,sans-serif}.v span{font-size:.9rem;opacity:.85}
@keyframes fl{50%{transform:translateY(-10px)}}
/* contact strip */
.touch{position:relative;background:linear-gradient(135deg,#062f3a,#0b5f66);color:#fff;text-align:center;padding:7rem 0 4rem;overflow:hidden;margin-top:0}
.touch .wave.up{top:-1px;bottom:auto;height:clamp(50px,8vw,90px)}.touch .wave path{fill:var(--sf2)}
.tc{display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem;margin:1.8rem 0}
.tc a{display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;padding:.8rem 1.3rem;border-radius:99px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);transition:.3s}
.tc a:hover{background:var(--sf);transform:translateY(-4px)}.tc svg{width:22px;height:22px;flex:0 0 auto}
.touch .btn.g{color:#fff}
.jr{margin-left:0!important}
