@font-face{font-family:IQ Test;font-style:normal;font-weight:300 500;font-display:swap;src:url(font/f3.woff2) format("woff2")}
@font-face{font-family:IQ Test;font-style:normal;font-weight:600;font-display:swap;src:url(font/f5.woff2) format("woff2")}
:root{--p:#25809D;--p2:#1a6582;--s:#FDB833;--a:#FF6B6B;--bg:#fff;--sf:#F8FAFC;--tx:#1e293b;--tx2:#64748b;--tx3:#94a3b8;--bd:#e2e8f0;--r:.35rem}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:IQ Test,sans-serif;font-weight:300;color:var(--tx);line-height:1.6;overflow-x:hidden}
h1,h2,h3,h4{font-weight:600;letter-spacing:-1px}
a{text-decoration:none;color:inherit}
button{cursor:pointer;font-family:inherit}
img{max-width:100%;height:auto}
.w{max-width:75rem;margin:0 auto;padding:0 1rem}
nav{position:fixed;top:0;left:0;right:0;background:#fffffff2;backdrop-filter:blur(8px);z-index:100;border-bottom:1px solid var(--bd)}
nav .w{display:flex;justify-content:space-between;align-items:center;height:4rem}
.logo{font-weight:500;display:flex;align-items:center;gap:.5rem;font-size:1.4rem}
.logo b{font-weight:500;color:var(--p)}
nav ul{display:flex;gap:2rem;list-style:none}
nav ul a{font-weight:500;color:var(--tx2);transition:color .2s}
nav ul a:hover{color:var(--p)}
nav .r{display:flex;align-items:center;gap:1rem}
nav .r a:first-child{font-size:1rem;color:var(--tx2)}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.5rem;border-radius:var(--r);transition:all .2s;border:none}
.btn-p{background:var(--p);color:#fff}
.btn-p:hover{background:var(--p2);transform:translateY(-2px)}
.btn-o{background:#fff;border:1px solid var(--bd);color:var(--tx)}
.btn-o:hover{border-color:var(--p);color:var(--p)}
.mn{display:none;background:none;border:none}
@media(max-width:768px) {
nav ul,nav .r{display:none;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:#fff;padding:1rem;border-top:1px solid var(--bd);box-shadow:0 4px 12px #0001}
nav ul.open,nav .r.open{display:flex}
nav ul{gap:0}
nav ul li{border-bottom:1px solid var(--bd)}
nav ul a{display:block;padding:.75rem 0}
nav .r{gap:.75rem;padding-top:.5rem}
nav .r .btn{width:100%;text-align:center}
.mn{display:block}
}
.hero{padding:8rem 0 5rem;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:0;right:0;width:50%;height:100%;background:#25809d1a;transform:skewX(-12deg);transform-origin:top right;z-index:-1}
.hero .w{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.hero .tag{display:inline-flex;align-items:center;gap:.5rem;background:#dcfce7;color:#166534;padding:.25rem .75rem;border-radius:999px;font-size:.8rem;font-weight:500;margin-bottom:1.5rem}
.hero .tag i{width:.5rem;height:.5rem;background:#22c55e;border-radius:50%;animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.8)}}
.hero h1{font-size:4rem;line-height:1.1;margin-bottom:1.5rem}
.hero h1 em{color:var(--p);font-style:normal;position:relative}
.hero h1 em svg{position:absolute;bottom:-.25rem;left:0;width:100%;height:.75rem}
.hero .sub{font-size:1.4rem;color:var(--tx);margin-bottom:.5rem}
.hero .txt{font-size:1.125rem;color:var(--tx2);margin-bottom:2rem;max-width:36rem}
.hero .btns{display:flex;gap:1rem;margin-bottom:2rem}
.hero .btns .btn{padding:1rem 2rem}
.hero .stats{display:flex;align-items:center;gap:1rem;font-size:1rem;color:var(--tx2)}
.hero .stats svg{color:#facc15}
.hero .stats b{margin-right:.25rem}
.hero .imgs{position:relative;height:28rem}
.hero .imgs .c1{position:absolute;top:0;right:0;width:16rem;height:16rem;background:var(--p);border-radius:50%;overflow:hidden;border:4px solid #fff;box-shadow:0 25px 50px -12px #00000040}
.hero .imgs .c2{position:absolute;bottom:2rem;left:2rem;width:12rem;height:12rem;background:var(--s);border-radius:50%;overflow:hidden;border:4px solid #fff;box-shadow:0 10px 40px -10px #0003;z-index:1}
.hero .imgs .c3{position:absolute;bottom:0;right:5rem;width:8rem;height:8rem;background:var(--a);border-radius:50%;overflow:hidden;border:4px solid #fff;box-shadow:0 10px 30px -10px #00000026;z-index:2}
.hero .imgs img{width:100%;height:100%;object-fit:cover}
.hero .imgs .ic1{position:absolute;top:2rem;left:2rem;width:4rem;height:4rem;background:#fff;border-radius:var(--r);box-shadow:0 10px 30px -10px #0003;display:flex;align-items:center;justify-content:center;animation:bounce 2s infinite}
.hero .imgs .ic2{position:absolute;top:50%;right:-1rem;width:3rem;height:3rem;background:#fff;border-radius:50%;box-shadow:0 10px 20px -5px #00000026;display:flex;align-items:center;justify-content:center}
@keyframes bounce {
0%,100%{transform:translateY(0)}
50%{transform:translateY(-10px)}
}
@media(max-width:968px) {
.hero .w{grid-template-columns:1fr;text-align:center}
.hero h1{font-size:2.875rem}
.hero .btns{justify-content:center}
.hero .stats{justify-content:center}
.hero .imgs{display:none}
}
.how{padding:5rem 0;background:var(--sf)}
.how .hd{text-align:center;margin-bottom:4rem}
.how .hd h2{font-size:2.875rem;margin-bottom:1rem}
.how .hd i{display:block;width:4rem;height:.25rem;background:var(--p);margin:0 auto;border-radius:var(--r)}
.how .g{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.how .cd{background:#fff;padding:2rem;border-radius:var(--r);border:1px solid var(--bd);position:relative;transition:box-shadow .2s}
.how .cd:hover{box-shadow:0 10px 30px -10px #0000001a}
.how .cd .n{position:absolute;top:-1.5rem;left:2rem;width:3rem;height:3rem;border-radius:var(--r);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.4rem;box-shadow:0 4px 15px -3px #0003}
.how .cd:nth-child(1) .n{background:var(--p)}
.how .cd:nth-child(2) .n{background:var(--s)}
.how .cd:nth-child(3) .n{background:var(--a)}
.how .cd .ic{width:3rem;height:3rem;border-radius:var(--r);display:flex;align-items:center;justify-content:center;margin:1.5rem 0 1rem}
.how .cd:nth-child(1) .ic{background:#eff6ff;color:var(--p)}
.how .cd:nth-child(2) .ic{background:#fefce8;color:var(--s)}
.how .cd:nth-child(3) .ic{background:#fef2f2;color:var(--a)}
.how .cd h3{font-size:1.4rem;margin-bottom:.75rem}
.how .cd p{font-size:1rem;color:var(--tx2)}
.how .cta{text-align:center;margin-top:3rem}
@media(max-width:768px) {
.how .g{grid-template-columns:1fr}
}
.why{padding:5rem 0;position:relative;overflow:hidden}
.why::before{content:'';position:absolute;top:0;left:0;width:16rem;height:16rem;background:#ff6b6b1a;border-radius:50%;filter:blur(60px);transform:translate(-50%,-50%)}
.why .w{display:flex;gap:5rem;align-items:center}
.why .ph{flex:0 0 20rem;position:relative}
.why .ph .bg{position:absolute;inset:-2rem;background:linear-gradient(135deg,#fdb83333,#ff6b6b33);border-radius:50%;filter:blur(40px)}
.why .ph .d{position:relative;background:#fff;border-radius:2.5rem;border:8px solid #1f2937;box-shadow:0 25px 50px -12px #00000040;overflow:hidden}
.why .ph .notch{position:absolute;top:0;left:50%;transform:translateX(-50%);width:8rem;height:1.5rem;background:#1f2937;border-radius:0 0 1rem 1rem;z-index:10}
.why .ph .scr{height:36rem;padding:2rem 1.25rem 1.25rem;background:var(--sf);display:flex;flex-direction:column}
.why .ph .top{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}
.why .ph .top span:first-child{display:flex;align-items:center;gap:.5rem;font-size:1rem;font-weight:500}
.why .ph .top span:first-child i{width:.5rem;height:.5rem;background:var(--p);border-radius:50%}
.why .ph .top span:last-child{font-size:1rem;color:var(--tx3)}
.why .ph .bar{height:.375rem;background:#e5e7eb;border-radius:999px;margin-bottom:1.5rem}
.why .ph .bar i{display:block;width:33%;height:100%;background:var(--p);border-radius:999px}
.why .ph .q{flex:1;display:flex;flex-direction:column;align-items:center}
.why .ph .qb{width:100%;aspect-ratio:1;background:#fff;border-radius:var(--r);border:1px solid var(--bd);padding:1rem;display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:1.5rem}
.why .ph .qb span{background:var(--sf);border-radius:var(--r);display:flex;align-items:center;justify-content:center;color:var(--tx3)}
.why .ph .qb span:nth-child(3){background:#25809d1a;color:var(--p)}
.why .ph .opts{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.why .ph .opts button{padding:.75rem;border-radius:var(--r);font-size:1rem;background:#fff;border:1px solid var(--bd)}
.why .ph .opts button.sel{border:2px solid var(--p);background:#25809d0d;color:var(--p)}
.why .ct{flex:1}
.why .ct h2{font-size:2.875rem;margin-bottom:1rem}
.why .ct > p{font-size:1.4rem;color:var(--tx2);margin-bottom:2rem;max-width:32rem}
.why .ft{display:flex;flex-direction:column;gap:2rem;margin-bottom:2rem}
.why .ft .f{display:flex;gap:1rem}
.why .ft .f .ic{flex-shrink:0;width:3rem;height:3rem;border-radius:var(--r);display:flex;align-items:center;justify-content:center;transition:all .3s}
.why .ft .f:nth-child(1) .ic{background:#25809d1a;color:var(--p)}
.why .ft .f:nth-child(2) .ic{background:#fdb8331a;color:var(--s)}
.why .ft .f:nth-child(3) .ic{background:#ff6b6b1a;color:#ca8a04}
.why .ft .f:hover .ic{background:var(--p);color:#fff}
.why .ft .f:nth-child(2):hover .ic{background:var(--s)}
.why .ft .f:nth-child(3):hover .ic{background:var(--a)}
.why .ft .f h3{font-size:1.4rem;margin-bottom:.5rem}
.why .ft .f p{font-size:1.0625rem;color:var(--tx2)}
@media(max-width:968px) {
.why .w{flex-direction:column}
.why .ph{order:-1}
}
.rank{padding:5rem 0}
.rank .hd{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:3rem;flex-wrap:wrap;gap:1.5rem}
.rank .hd h2{font-size:2.875rem;margin-bottom:.5rem}
.rank .hd p{color:var(--tx2);max-width:40rem}
.rank .box{background:#fff;border-radius:var(--r);padding:2rem;box-shadow:0 4px 20px -5px #00000014;border:1px solid var(--bd);margin-bottom:2rem}
.rank .box:hover{box-shadow:0 10px 40px -10px #0000001f}
.rank .box .inner{display:flex;gap:2rem}
.rank .box .info{flex:0 0 30%}
.rank .box .info .tl{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}
.rank .box .info .tl .ic{width:2.5rem;height:2.5rem;border-radius:var(--r);display:flex;align-items:center;justify-content:center}
.rank .box:nth-child(1) .info .tl .ic{background:#fee2e2;color:var(--a)}
.rank .box:nth-child(2) .info .tl .ic{background:#dbeafe;color:#3b82f6}
.rank .box:nth-child(3) .info .tl .ic{background:#fef9c3;color:#ca8a04}
.rank .box .info h3{font-size:1.4rem;font-weight:500}
.rank .box .info p{font-size:1rem;color:var(--tx2);margin-bottom:1.5rem}
.rank .box .info button{width:100%;padding:.75rem;border-radius:var(--r);border:1px solid var(--bd);background:#fff;font-size:1rem;font-weight:500}
.rank .box .info button:hover{background:var(--sf)}
.rank .box .lst{flex:1;display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.rank .item{display:flex;align-items:center;gap:1rem;padding:.75rem;border-radius:var(--r);background:var(--sf)}
.rank .item:hover{background:#f1f5f9}
.rank .item .av{position:relative;width:3.5rem;height:3.5rem;flex-shrink:0}
.rank .item .av img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 2px 8px #0000001a}
.rank .item .av svg{position:absolute;inset:0;transform:rotate(-90deg)}
.rank .item .av svg circle{fill:none;stroke-width:3}
.rank .item .av svg .bg{stroke:#e5e7eb}
.rank .item .av svg .fg{stroke:var(--p);stroke-dasharray:163.36;stroke-dashoffset:15}
.rank .item h4{font-size:1rem;font-weight:500}
.rank .item span{font-size:1rem;color:var(--tx2)}
.rank .item span b{color:var(--p)}
@media(max-width:968px) {
.rank .box .inner{flex-direction:column}
.rank .box .lst{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:580px) {
.rank .box .lst{grid-template-columns:1fr}
}
.games{padding:5rem 0}
.games .hd{text-align:center;margin-bottom:3rem}
.games .hd h2{font-size:2.875rem;margin-bottom:1rem}
.games .hd p{color:var(--tx2);max-width:48rem;margin:0 auto}
.games .g{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-bottom:3rem}
.games .cd{background:#fff;border-radius:var(--r);padding:2rem;border:1px solid transparent;box-shadow:0 2px 10px -3px #0000000d;position:relative;overflow:hidden;transition:all .3s}
.games .cd:hover{border-color:#25809d33;box-shadow:0 20px 40px -15px #0000001a}
.games .cd::before{content:'';position:absolute;top:0;left:0;right:0;height:.25rem;transform:scaleX(0);transition:transform .3s}
.games .cd:hover::before{transform:scaleX(1)}
.games .cd:nth-child(1)::before{background:linear-gradient(90deg,#60a5fa,#6366f1)}
.games .cd:nth-child(2)::before{background:linear-gradient(90deg,#34d399,#14b8a6)}
.games .cd:nth-child(3)::before{background:linear-gradient(90deg,#fb923c,#ef4444)}
.games .cd:nth-child(4)::before{background:linear-gradient(90deg,#38bdf8,#06b6d4)}
.games .cd:nth-child(5)::before{background:linear-gradient(90deg,#a78bfa,#ec4899)}
.games .cd:nth-child(6)::before{background:linear-gradient(90deg,#fbbf24,#f59e0b)}
.games .cd .ic{width:4rem;height:4rem;border-radius:var(--r);display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;transition:transform .3s}
.games .cd:hover .ic{transform:scale(1.1)}
.games .cd:nth-child(1) .ic{background:#eff6ff;color:#3b82f6}
.games .cd:nth-child(2) .ic{background:#ecfdf5;color:#10b981}
.games .cd:nth-child(3) .ic{background:#fff7ed;color:#f97316}
.games .cd:nth-child(4) .ic{background:#f0f9ff;color:#0ea5e9}
.games .cd:nth-child(5) .ic{background:#faf5ff;color:#a855f7}
.games .cd:nth-child(6) .ic{background:#fefce8;color:#eab308}
.games .cd h3{text-align:center;font-size:1.4rem;margin-bottom:.75rem}
.games .cd p{text-align:center;font-size:1rem;color:var(--tx2)}
.games .cta{text-align:center}
@media(max-width:968px) {
.games .g{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:580px) {
.games .g{grid-template-columns:1fr}
}
.test{padding:5rem 0;background:var(--sf);position:relative;overflow:hidden}
.test::before{content:'';position:absolute;top:50%;left:50%;width:50rem;height:25rem;background:#dbeafe4d;border-radius:50%;filter:blur(60px);transform:translate(-50%,-50%)}
.test .hd{text-align:center;margin-bottom:3rem;position:relative}
.test .hd h2{font-size:2.875rem;margin-bottom:1rem}
.test .hd i{display:block;width:4rem;height:.25rem;background:var(--p);margin:0 auto;border-radius:var(--r)}
.test .g{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;position:relative}
.test .cd{background:#fff;border-radius:var(--r);padding:2rem;display:flex;flex-direction:column;height:100%}
.test .cd:hover{box-shadow:0 10px 30px -10px #0000001a}
.test .cd .top{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}
.test .cd .top .av{position:relative}
.test .cd .top .av img{width:3.5rem;height:3.5rem;border-radius:50%;object-fit:cover;border:2px solid #25809d33}
.test .cd .top .av i{position:absolute;bottom:-.25rem;right:-.25rem;width:1.25rem;height:1.25rem;background:var(--p);border-radius:50%;border:2px solid #fff;display:flex;align-items:center;justify-content:center}
.test .cd .top .av i svg{width:.625rem;height:.625rem;fill:#fff}
.test .cd .top h3{font-weight:500}
.test .cd .top span{font-size:1rem;color:var(--tx2);display:flex;align-items:center;gap:.25rem}
.test .cd p{flex:1;font-size:1.0625rem;color:var(--tx2);margin-bottom:1.5rem}
.test .cd .stars{display:flex;gap:.125rem;color:#facc15}
@media(max-width:968px) {
.test .g{grid-template-columns:1fr}
}
.blog{padding:5rem 0}
.blog .hd{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:3rem;flex-wrap:wrap;gap:1rem}
.blog .hd h2{font-size:2.875rem;margin-bottom:.5rem}
.blog .hd p{color:var(--tx2);max-width:40rem}
.blog .g{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.blog .post{display:flex;flex-direction:column}
.blog .post .img{position:relative;border-radius:var(--r);overflow:hidden;margin-bottom:1.25rem}
.blog .post .img img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .5s}
.blog .post:hover .img img{transform:scale(1.05)}
.blog .post .img span{position:absolute;top:1rem;left:1rem;background:#ffffffe6;padding:.25rem .75rem;border-radius:999px;font-size:.8rem;color:var(--p)}
.blog .post h3{font-size:1.4rem;margin-bottom:.75rem;transition:color .2s}
.blog .post:hover h3{color:var(--p)}
.blog .post > p{font-size:1rem;color:var(--tx2);flex:1;margin-bottom:1rem}
.blog .post .meta{display:flex;align-items:center;gap:.75rem;padding-top:1rem;border-top:1px solid var(--bd)}
.blog .post .meta img{width:2.5rem;height:2.5rem;border-radius:50%;object-fit:cover}
.blog .post .meta h4{font-size:1rem;font-weight:500}
.blog .post .meta span{font-size:1rem;color:var(--tx3)}
@media(max-width:968px) {
.blog .g{grid-template-columns:1fr}
}
.faq{padding:5rem 0;position:relative;overflow:hidden}
.faq::before{content:'';position:absolute;top:2rem;left:2rem;width:16rem;height:16rem;background:var(--p);border-radius:50%;filter:blur(100px);opacity:.1}
.faq::after{content:'';position:absolute;bottom:2rem;right:2rem;width:16rem;height:16rem;background:var(--s);border-radius:50%;filter:blur(100px);opacity:.1}
.faq .hd{text-align:center;margin-bottom:3rem}
.faq .hd h2{font-size:2.875rem;margin-bottom:.5rem}
.faq .hd p{color:var(--tx2)}
.faq .cols{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem 3rem;max-width:64rem;margin:0 auto;align-items:start}
.faq .acc{background:#fff;border-radius:var(--r);border:1px solid var(--bd);overflow:hidden}
.faq .acc:hover{box-shadow:0 4px 20px -5px #00000014}
.faq .acc summary{display:flex;align-items:center;gap:.75rem;padding:1rem 1.5rem;cursor:pointer;list-style:none}
.faq .acc summary::-webkit-details-marker{display:none}
.faq .acc summary i{flex-shrink:0;width:2rem;height:2rem;background:#25809d1a;color:var(--p);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s}
.faq .acc[open] summary i{background:var(--p);color:#fff}
.faq .acc summary span{font-weight:500}
.faq .acc summary:hover span{color:var(--p)}
.faq .acc .cnt{padding:0 1.5rem 1rem 4rem;font-size:1rem;color:var(--tx2)}
@media(max-width:768px) {
.faq .cols{grid-template-columns:1fr}
}
.cta-s{padding:5rem 0;background:var(--p2);color:#fff;position:relative;overflow:hidden}
.cta-s::before{content:'';position:absolute;top:-6rem;left:-6rem;width:24rem;height:24rem;border:2.5rem solid #ffffff1a;border-radius:50%}
.cta-s::after{content:'';position:absolute;top:50%;right:0;width:16rem;height:16rem;background:#facc15;border-radius:50%;filter:blur(80px);opacity:.3;transform:translateX(50%)}
.cta-s .w{display:flex;align-items:center;justify-content:space-between;gap:3rem;position:relative}
.cta-s .img{position:relative;width:20rem;height:20rem;flex-shrink:0}
.cta-s .img .bg{position:absolute;top:50%;left:50%;width:18rem;height:18rem;background:var(--s);border-radius:50%;transform:translate(-50%,-50%)}
.cta-s .img .dot1{position:absolute;top:0;right:2rem;width:3rem;height:3rem;background:#2bc4a9;border-radius:50%}
.cta-s .img .dot2{position:absolute;bottom:2rem;left:0;width:2rem;height:2rem;background:#ffffff80;border-radius:50%}
.cta-s .img .photo{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:14rem;height:14rem;overflow:hidden;border-radius:50%}
.cta-s .img .photo img{width:100%;height:100%;object-fit:cover}
.cta-s .img .badge{position:absolute;background:#fff;color:var(--p2);padding:.5rem 1.25rem;border-radius:999px;font-size:1rem;box-shadow:0 10px 30px -10px #0003}
.cta-s .img .badge:first-of-type{top:5rem;right:-1rem;transform:rotate(3deg)}
.cta-s .img .badge:last-of-type{bottom:6rem;right:-2rem;transform:rotate(-2deg)}
.cta-s .ct{flex:1}
.cta-s .ct h2{font-size:2.875rem;margin-bottom:1rem}
.cta-s .ct p{font-size:1.4rem;opacity:.9;margin-bottom:2rem;max-width:32rem}
.cta-s .ct .btn{background:#fff;color:var(--p2);padding:.875rem 2rem}
.cta-s .ct .btn:hover{background:#f1f5f9}
@media(max-width:968px) {
.cta-s .w{flex-direction:column;text-align:center}
.cta-s .img{order:-1}
.cta-s .ct p{margin-left:auto;margin-right:auto}
}
footer{background:var(--p2);color:#fff;padding:4rem 0 2rem;border-top:1px solid #ffffff1a}
footer .top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:3rem;margin-bottom:3rem}
footer .brand .logo{margin-bottom:1rem}
footer .brand .logo span{background:linear-gradient(135deg,#facc15,#f97316)}
footer .brand p{font-size:1rem;color:#ffffffb3;margin-bottom:1.5rem}
footer .social{display:flex;gap:1rem}
footer .social a{width:2rem;height:2rem;background:#ffffff1a;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .2s}
footer .social a:hover{background:#fff3}
footer .social svg{width:1rem;height:1rem;fill:currentColor}
footer .col h3{margin-bottom:1rem}
footer .col ul{list-style:none}
footer .col ul li{margin-bottom:.5rem}
footer .col ul a{font-size:1rem;color:#ffffffb3;transition:color .2s}
footer .col ul a:hover{color:#fff}
footer .bot{display:flex;justify-content:space-between;align-items:center;padding-top:2rem;border-top:1px solid #ffffff1a;font-size:1rem;color:#fff9;flex-wrap:wrap;gap:1rem}
footer .bot a{color:#fff9;margin-left:1.5rem}
footer .bot a:hover{color:#fff}
@media(max-width:768px) {
footer .top{grid-template-columns:1fr 1fr}
footer .brand{grid-column:span 2}
}
@media(max-width:480px) {
footer .top{grid-template-columns:1fr}
footer .brand{grid-column:span 1}
}