:root{--bg:#070b16;--bg2:#0e1426;--tx:#eef1f8;--mu:#97a0b8;--ac:#f2b134;--ac2:#ff6a5c;--card:rgba(255,255,255,.05);--bd:rgba(255,255,255,.1)}
[data-theme=light]{--bg:#f6f4ef;--bg2:#fff;--tx:#12172a;--mu:#5b6379;--ac:#d98a00;--ac2:#e0443a;--card:rgba(0,0,0,.04);--bd:rgba(0,0,0,.1)}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{font-family:Manrope,system-ui,sans-serif;background:var(--bg);color:var(--tx);line-height:1.65;overflow-x:hidden;transition:background .5s,color .5s;animation:pg .6s both}
@keyframes pg{from{opacity:0}}
body.out{opacity:0;transition:.25s}
h1,h2,h3{font-family:Unbounded,Manrope,sans-serif;line-height:1.15}
a{color:inherit;text-decoration:none}
.wrap{width:min(1120px,92%);margin:auto}
section{padding:clamp(60px,10vw,120px) 0;position:relative}
h2{font-size:clamp(1.6rem,4.5vw,2.8rem);margin-bottom:14px}
.sub{color:var(--mu);max-width:62ch;margin-bottom:30px}
header{position:fixed;inset:0 0 auto;z-index:50;padding:calc(10px + env(safe-area-inset-top)) 0 10px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);background:color-mix(in srgb,var(--bg) 55%,transparent);border-bottom:1px solid var(--bd)}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px}
.logo{display:flex;align-items:center;gap:10px;font-family:Unbounded;font-weight:700;font-size:.95rem}
.logo img{width:38px;height:38px;border-radius:9px;object-fit:contain}
.logo i{font-style:normal;color:var(--ac)}
.hr{display:flex;align-items:center;gap:12px}
.tg{width:58px;height:30px;border-radius:30px;border:1px solid var(--bd);background:var(--card);position:relative;cursor:pointer}
.tg span{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--ac);display:grid;place-items:center;font-size:13px;transition:transform .45s cubic-bezier(.7,-.4,.3,1.4)}
[data-theme=light] .tg span{transform:translateX(28px)}
.bg{width:42px;height:42px;border-radius:50%;border:1px solid var(--bd);background:var(--card);cursor:pointer;position:relative}
.bg b{position:absolute;left:11px;width:20px;height:2px;background:var(--tx);border-radius:2px;transition:.4s}
.bg b:nth-child(1){top:15px}.bg b:nth-child(2){top:20px;width:14px}.bg b:nth-child(3){top:25px}
.open .bg b:nth-child(1){top:20px;transform:rotate(45deg)}.open .bg b:nth-child(2){opacity:0}.open .bg b:nth-child(3){top:20px;transform:rotate(-45deg)}
#menu{position:fixed;top:0;right:0;bottom:0;width:min(340px,86vw);z-index:45;padding:100px 32px 32px;display:flex;flex-direction:column;gap:6px;background:color-mix(in srgb,var(--bg2) 62%,transparent);backdrop-filter:blur(26px) saturate(1.4);-webkit-backdrop-filter:blur(26px) saturate(1.4);border-left:1px solid var(--bd);transform:translateX(105%);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.open #menu{transform:none}
#menu a{font-family:Unbounded;font-size:1.3rem;padding:12px 0;opacity:0;transform:translateX(30px);transition:.5s}
.open #menu a{opacity:1;transform:none}
.open #menu a:nth-child(2){transition-delay:.15s}.open #menu a:nth-child(3){transition-delay:.22s}.open #menu a:nth-child(4){transition-delay:.29s}
#menu a:hover,#menu a.act{color:var(--ac)}
#ov{position:fixed;inset:0;z-index:40;background:rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:.5s}.open #ov{opacity:1;pointer-events:auto}
#hero{min-height:100svh;display:flex;align-items:center;overflow:hidden;padding-top:90px}
#hero .glow{position:absolute;width:60vmax;height:60vmax;border-radius:50%;background:radial-gradient(circle,var(--ac) 0,transparent 60%);opacity:.16;top:-20vmax;right:-20vmax;animation:fl 12s ease-in-out infinite alternate}
#hero .glow.b{background:radial-gradient(circle,var(--ac2) 0,transparent 60%);top:auto;right:auto;bottom:-25vmax;left:-25vmax;animation-delay:-5s}
@keyframes fl{to{transform:translate(-6vmax,5vmax) scale(1.15)}}
.hw{display:grid;gap:40px;align-items:center;grid-template-columns:1fr;position:relative}
.lg{position:relative;width:min(320px,70vw);aspect-ratio:1;margin:0 auto;order:-1}
.lg img{width:100%;height:100%;object-fit:contain;border-radius:28px;position:relative;animation:lf 6s ease-in-out infinite alternate;box-shadow:0 20px 60px rgba(0,60,180,.5)}
.lg::before{content:"";position:absolute;inset:-10px;border-radius:36px;background:conic-gradient(var(--ac),var(--ac2),#2f6bff,var(--ac));filter:blur(16px);opacity:.5;animation:spin 8s linear infinite}
@keyframes spin{to{transform:rotate(1turn)}}@keyframes lf{to{transform:translateY(-12px)}}
@media(min-width:860px){.hw{grid-template-columns:1.3fr 1fr}.lg{order:0;width:min(440px,100%)}}
h1{font-size:clamp(2rem,7.5vw,4.8rem);letter-spacing:-.04em}
h1 .w{display:inline-block;overflow:hidden;vertical-align:top}
h1 .w span{display:inline-block;transform:translateY(110%)}.go h1 .w span{animation:up .9s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes up{to{transform:none}}
.lead{margin:22px 0 32px;color:var(--mu);font-size:clamp(1rem,2.4vw,1.2rem);max-width:52ch;opacity:0}.go .lead{animation:fi 1s .9s forwards}.go .hero-in{animation:fi 1s 1.1s both}
@keyframes fi{to{opacity:1}}
.btn{display:inline-block;padding:14px 28px;border-radius:50px;background:var(--ac);color:#111;border:0;cursor:pointer;font:600 1rem Manrope;transition:transform .3s,box-shadow .3s}
.btn:hover{transform:translateY(-3px);box-shadow:0 12px 30px color-mix(in srgb,var(--ac) 45%,transparent)}
.btn.o{background:transparent;color:var(--tx);border:1px solid var(--bd);margin-left:10px}
.rv{opacity:0;transform:translateY(34px) scale(.98);transition:opacity .9s,transform .9s cubic-bezier(.2,.8,.2,1)}.rv.in{opacity:1;transform:none}
.sec{padding-top:clamp(120px,16vw,170px)}
.cards{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{padding:26px 22px;border:1px solid var(--bd);background:var(--card);border-radius:22px;transition:transform .4s,border-color .4s;display:block}
.card:hover{transform:translateY(-6px);border-color:var(--ac)}.card h3{font-size:1.05rem;margin-bottom:8px}.card p{font-size:.92rem;color:var(--mu)}
.abt{display:grid;gap:40px;grid-template-columns:1fr}@media(min-width:860px){.abt{grid-template-columns:1.1fr 1fr;align-items:start}}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:26px 0}
.stat{padding:20px;border:1px solid var(--bd);background:var(--card);border-radius:20px}
.stat b{font-family:Unbounded;font-size:2.1rem;color:var(--ac);display:block}
.pl{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.fl{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}
.fl button{padding:8px 18px;border-radius:30px;border:1px solid var(--bd);background:var(--card);color:var(--tx);cursor:pointer;font:600 .85rem Manrope;transition:.3s}
.fl button.on{background:var(--ac);color:#111;border-color:var(--ac)}
#grid{columns:1;column-gap:14px}@media(min-width:520px){#grid{columns:2}}@media(min-width:900px){#grid{columns:3}}
.ph{break-inside:avoid;margin-bottom:14px;border-radius:18px;overflow:hidden;position:relative;cursor:zoom-in;background:var(--card);animation:fi .6s both}
.ph img{width:100%;display:block;transition:transform .7s cubic-bezier(.2,.8,.2,1)}.ph:hover img{transform:scale(1.06)}
.ph figcaption{position:absolute;inset:auto 0 0;padding:30px 14px 12px;font-size:.85rem;font-weight:600;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.75));opacity:0;transition:.4s}.ph:hover figcaption{opacity:1}
.empty{color:var(--mu);padding:40px;border:1px dashed var(--bd);border-radius:20px;text-align:center}
#thanks{text-align:center;overflow:hidden;background:var(--bg2)}
#thanks h2{font-size:clamp(1.8rem,6vw,3.8rem);background:linear-gradient(100deg,var(--ac),var(--ac2),var(--ac),var(--ac2));background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sh 6s linear infinite}
@keyframes sh{to{background-position:-300% 0}}
#thanks p{max-width:56ch;margin:auto;color:var(--mu)}
.sp{position:absolute;bottom:-20px;width:8px;height:8px;border-radius:50%;background:var(--ac);opacity:0;animation:rise linear infinite;pointer-events:none}
@keyframes rise{10%{opacity:.8}to{transform:translateY(-70vh) translateX(var(--x));opacity:0}}
footer{padding:50px 0 calc(40px + env(safe-area-inset-bottom));border-top:1px solid var(--bd);text-align:center;color:var(--mu);font-size:.9rem}
footer a.ph0{color:var(--ac);font-weight:600;font-size:1.15rem}
#fb{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:60;width:58px;height:58px;border-radius:50%;background:#1877f2;display:grid;place-items:center;box-shadow:0 10px 30px rgba(24,119,242,.5);animation:bob 3s ease-in-out infinite}
#fb::before,#fb::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #1877f2;animation:ring 2.2s infinite}#fb::after{animation-delay:1.1s}
@keyframes ring{to{transform:scale(1.9);opacity:0}}@keyframes bob{50%{transform:translateY(-7px) rotate(-6deg)}}
#fb:hover{animation:none;transform:scale(1.15) rotate(10deg);transition:.3s}
#fb svg{width:30px;height:30px;fill:#fff}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}html{scroll-behavior:auto}}

/* ===== v3 ===== */
option{background:var(--bg2);color:var(--tx)}
#loader{position:fixed;inset:0;z-index:999;background:radial-gradient(circle at 50% 40%,#0b1e4a,#050914 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:opacity .7s,visibility .7s,transform .7s}
#loader.done{opacity:0;visibility:hidden;transform:scale(1.06)}
.noload #loader{display:none}
.lw{position:relative;width:min(250px,60vw);aspect-ratio:1}
.lw::before{content:"";position:absolute;inset:-18px;border-radius:40px;background:conic-gradient(#f2b134,#ff6a5c,#2f6bff,#f2b134);filter:blur(22px);opacity:0;animation:fi 1s 1.5s forwards,spin 6s linear infinite}
.lw img{position:absolute;inset:0;width:100%;height:100%;border-radius:26px;object-fit:contain}
.pc{opacity:0;animation:asm 1.1s cubic-bezier(.2,.9,.2,1) forwards;will-change:transform}
.p1{clip-path:polygon(50% 50%,50% -30%,119.3% 10%,119.3% 90%);--x:0;--y:-130%;--r:-30deg;animation-delay:.15s}
.p2{clip-path:polygon(50% 50%,119.3% 90%,50% 130%,-19.3% 90%);--x:120%;--y:80%;--r:35deg;animation-delay:.4s}
.p3{clip-path:polygon(50% 50%,-19.3% 90%,-19.3% 10%,50% -30%);--x:-120%;--y:80%;--r:-35deg;animation-delay:.65s}
@keyframes asm{from{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(.5)}to{opacity:1;transform:none}}
.lw .full{opacity:0;animation:fi .5s 1.7s forwards}
.lt{margin-top:38px;font:600 .72rem Manrope;letter-spacing:.35em;color:#9fb2dd;text-align:center;padding:0 16px;text-transform:uppercase}
.lbar{width:min(240px,60vw);height:4px;border-radius:4px;background:rgba(255,255,255,.12);margin-top:16px;overflow:hidden}
.lbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#f2b134,#ff6a5c)}
.lp{margin-top:8px;font:600 .75rem Manrope;color:#9fb2dd}
#pb{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--ac),var(--ac2));z-index:60}
#top{position:fixed;left:18px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:60;width:46px;height:46px;border-radius:50%;border:1px solid var(--bd);background:color-mix(in srgb,var(--bg2) 70%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--tx);cursor:pointer;opacity:0;transform:translateY(20px);pointer-events:none;transition:.4s;font-size:1.1rem}
#top.on{opacity:1;transform:none;pointer-events:auto}
.badge{display:inline-block;padding:7px 16px;border-radius:30px;border:1px solid var(--bd);background:var(--card);font-size:.8rem;font-weight:600;color:var(--mu);margin-bottom:20px}
.badge b{color:var(--ac)}
.btn.big{padding:16px 32px;font-size:1.05rem}
.scroll{position:absolute;bottom:26px;left:0;right:0;display:flex;justify-content:center;transition:opacity .4s}
.scroll.hide{opacity:0;pointer-events:none}
.scroll a{width:26px;height:42px;border:2px solid var(--mu);border-radius:16px;display:flex;justify-content:center;padding-top:7px}
.scroll span{width:4px;height:8px;border-radius:4px;background:var(--ac);animation:sdot 1.7s cubic-bezier(.6,0,.4,1) infinite}
@keyframes sdot{0%{transform:translateY(0);opacity:0}20%{opacity:1}80%{transform:translateY(14px);opacity:1}100%{transform:translateY(18px);opacity:0}}
.mq{overflow:hidden;border-block:1px solid var(--bd);padding:18px 0;background:var(--bg2)}
.mt{display:flex;width:max-content;animation:mq 30s linear infinite}
.mt span{font-family:Unbounded;font-size:clamp(1rem,2.6vw,1.5rem);white-space:nowrap;color:var(--mu);padding-right:46px}
.mt span::after{content:"✦";margin-left:46px;color:var(--ac)}
@keyframes mq{to{transform:translateX(-50%)}}
.eyebrow{font:600 .78rem Manrope;letter-spacing:.22em;text-transform:uppercase;color:var(--ac);margin-bottom:10px}
.stats3{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.card{position:relative;overflow:hidden}
.card::after{content:"";position:absolute;inset:0;background:radial-gradient(260px circle at var(--mx,50%) var(--my,0%),color-mix(in srgb,var(--ac) 20%,transparent),transparent 60%);opacity:0;transition:opacity .4s;pointer-events:none}
.card:hover::after{opacity:1}
.ic{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;background:color-mix(in srgb,var(--ac) 16%,transparent);color:var(--ac);margin-bottom:16px}
.ic svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.split{display:grid;gap:34px;align-items:center}@media(min-width:860px){.split{grid-template-columns:1fr 1fr}}
.row2{display:flex;justify-content:space-between;align-items:end;gap:16px;flex-wrap:wrap;margin-bottom:26px}
.lat{display:grid;gap:12px;grid-template-columns:repeat(2,1fr)}@media(min-width:760px){.lat{grid-template-columns:repeat(3,1fr)}}
.lat .ph{aspect-ratio:4/3;margin:0;display:block}.lat .ph img{height:100%;object-fit:cover}
.cta{padding:clamp(34px,6vw,60px);border-radius:30px;text-align:center;border:1px solid var(--bd);background:linear-gradient(135deg,color-mix(in srgb,var(--ac) 14%,transparent),color-mix(in srgb,var(--ac2) 10%,transparent))}
.cta .btn{margin:6px}
.fb2{background:#1877f2;color:#fff}
.flinks{display:flex;gap:22px;justify-content:center;flex-wrap:wrap;margin-bottom:22px}.flinks a:hover{color:var(--ac)}
/* gallery */
.ph img{opacity:0;transition:opacity .5s,transform .7s cubic-bezier(.2,.8,.2,1)}.ph img.in{opacity:1}
#grid{columns:auto}#grid.mas{columns:1;column-gap:14px}@media(min-width:520px){#grid.mas{columns:2}}@media(min-width:900px){#grid.mas{columns:3}}
#grid.sq{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}@media(min-width:700px){#grid.sq{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}}
#grid.sq .ph{aspect-ratio:1;margin:0}#grid.sq .ph img{height:100%;object-fit:cover}
.tb{position:sticky;top:calc(66px + env(safe-area-inset-top));z-index:30;display:grid;gap:10px;padding:12px;margin-bottom:22px;border:1px solid var(--bd);border-radius:20px;background:color-mix(in srgb,var(--bg) 72%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.tb .r1{display:flex;gap:10px;flex-wrap:wrap}
.tb input,.tb select{flex:1;min-width:130px;padding:11px 14px;border-radius:14px;border:1px solid var(--bd);background:var(--card);color:var(--tx);font:600 .9rem Manrope;outline:0}
.tb input:focus,.tb select:focus{border-color:var(--ac)}
.tb .fl{margin:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.tb .fl::-webkit-scrollbar{display:none}.tb .fl button{flex:none}
.seg{display:flex;border:1px solid var(--bd);border-radius:14px;overflow:hidden}.seg button{padding:0 16px;background:transparent;border:0;color:var(--mu);cursor:pointer;font-size:1rem}.seg button.on{background:var(--ac);color:#111}
.cnt{color:var(--mu);font-size:.85rem;margin:-8px 0 16px}
.note{padding:12px 16px;border-radius:14px;border:1px dashed var(--ac);color:var(--mu);font-size:.85rem;margin-bottom:18px}
.sk{border-radius:18px;background:linear-gradient(100deg,var(--card) 30%,color-mix(in srgb,var(--tx) 10%,transparent) 50%,var(--card) 70%);background-size:300% 100%;animation:skl 1.4s linear infinite;margin-bottom:14px;break-inside:avoid}
@keyframes skl{to{background-position:-300% 0}}
#more{height:1px}.lm{display:block;margin:24px auto 0}
.hd{padding-top:clamp(120px,16vw,160px)}
#lb{position:fixed;inset:0;z-index:90;background:rgba(3,6,14,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:none;grid-template-rows:auto 1fr auto;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}
#lb.on{display:grid;animation:fi .3s both}
#lb .bar{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;color:#fff;gap:8px}#lb .bar div{display:flex;gap:8px}
#lb button,#lb a.ib{width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;cursor:pointer;display:grid;place-items:center;font-size:1.05rem}
#lb button:hover,#lb a.ib:hover{background:var(--ac);color:#111}
#lb .st{position:relative;overflow:hidden;display:grid;place-items:center;min-height:0;touch-action:pan-y}
#lb .st img{max-width:100%;max-height:100%;object-fit:contain;transition:transform .35s,opacity .3s;cursor:zoom-in;user-select:none;-webkit-user-drag:none}
#lb .st img.z{transform:scale(2.2);cursor:zoom-out}
#lb .nv{position:absolute;top:50%;margin-top:-21px}#lb .nv.p{left:12px}#lb .nv.n{right:12px}
#lb .cap{text-align:center;color:#fff;padding:12px 16px 18px;font-size:.95rem}#lb .cap small{display:block;color:#9fb2dd}