
:root{--ink:#1b253b;--sub:#66748c;--violet:#654fcd;--line:#e4e8f1}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#f7f8fb;font:15px/1.65 system-ui,sans-serif}a{text-decoration:none;color:inherit}button,select,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #8674ed;outline-offset:2px}.wrap{max-width:1140px;margin:auto;padding:0 22px}.head{position:sticky;top:0;z-index:9;background:#ffffffef;backdrop-filter:blur(15px);border-bottom:1px solid var(--line)}.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:70px}.brand{font-size:17px;font-weight:900;white-space:nowrap}.brand b{display:inline-grid;place-items:center;background:#252942;color:#fff;width:35px;height:35px;border-radius:11px;margin-right:8px}.brand span{color:var(--violet)}.links{display:flex;gap:23px;font-size:13px;color:#4c596f}.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border:1px solid #d6dbe9;border-radius:10px;background:#fff;color:#2a3550;font-weight:750}.btn.primary{background:var(--violet);color:#fff;border-color:var(--violet)}.hero{padding:75px 0;display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}.over{color:#6456ac;font-size:11px;letter-spacing:1.6px;font-weight:850;text-transform:uppercase}h1{font-size:clamp(40px,5.8vw,67px);line-height:1.09;letter-spacing:-2.8px;margin:21px 0}h1 em{font-style:normal;color:var(--violet)}h2{font-size:clamp(28px,3.2vw,39px);line-height:1.18;letter-spacing:-1.3px;margin:8px 0 12px}.lead{font-size:17px;color:var(--sub);max-width:530px}.act{display:flex;gap:11px;flex-wrap:wrap;margin-top:24px}.stats{display:flex;gap:22px;flex-wrap:wrap;margin-top:29px;color:#67748c;font-size:12px}.stats b{color:#26304a}.mock{background:#fff;border:1px solid #e3e6ef;border-radius:22px;padding:22px;box-shadow:0 24px 60px #202a4a14}.mocktop{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:850;margin-bottom:18px}.mock small{color:#8a94a6;font-size:11px}.mockrow{display:flex;align-items:center;gap:12px;border:1px solid #eceef4;border-radius:13px;padding:12px;margin:9px 0}.mark{flex:none;width:43px;height:43px;border-radius:12px;display:grid;place-items:center;background:#f1efff;color:#614bc7;font-size:18px;font-weight:900}.mockrow strong{display:block}.mockrow small{display:block}.mocknote{padding-top:14px;color:#7a879b;font-size:11px}.section{padding:65px 0}.white{background:#fff}.intro{color:var(--sub);margin:0 0 22px}.goals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.goal{background:#fff;border:1px solid #e6e9f2;border-radius:15px;padding:22px;text-align:left}.goal:hover,.tile:hover{border-color:#aaa0e2;box-shadow:0 12px 30px #26344a0c}.goal .ic{display:block;height:30px;font-size:23px;color:#6351cf;margin-bottom:18px}.goal strong{display:block;font-size:15px}.goal small{display:block;color:#7a869a;margin:4px 0 13px}.goal i{color:#5a47c6;font-style:normal}.finder{background:#252941;border-radius:22px;color:#fff;padding:30px;display:grid;grid-template-columns:1fr 1fr;gap:28px}.finder p,.finder label{color:#c3c8da;font-size:12px}.finder label{display:block;margin:15px 0 7px}.finder select{width:100%;border:1px solid #4d546e;background:#363b58;color:white;border-radius:10px;padding:11px}.match{display:flex;align-items:center;gap:11px;background:#333954;border:1px solid #515977;padding:12px;border-radius:12px;margin:8px 0}.match span:nth-child(2){flex:1}.match strong{display:block;font-size:13px}.match small{display:block;font-size:11px;color:#b8bfd1}.match a{color:#dbd5ff;font-size:12px;font-weight:800}.bar{display:grid;grid-template-columns:1fr 190px;gap:10px;margin:20px 0}.bar input,.bar select{min-width:0;padding:12px;border:1px solid #dde2ed;border-radius:10px;background:#fff}.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:21px}.filter{border:1px solid #dfe3ee;border-radius:22px;padding:8px 12px;background:#fff;color:#536077;font-size:12px}.filter.on{background:#252941;color:#fff}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.tile{display:flex;flex-direction:column;gap:8px;background:#fff;padding:19px;border:1px solid #e4e8ef;border-radius:15px}.tile h3{margin:0;font-size:16px}.tile p{color:#758299;font-size:12px;flex:1}.row{display:flex;align-items:center;gap:11px}.tag{font-size:10px;border:1px solid #e1e5ef;border-radius:16px;padding:4px 8px;color:#69778d}.footrow{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px}.footrow a{color:#5c49c7;font-size:12px;font-weight:900}.more{text-align:center;margin-top:22px}.strip{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.strip article{background:#fff;border:1px solid #e5e9f2;border-radius:16px;padding:24px}.strip h3{margin:9px 0}.strip p{font-size:13px;color:#78859a}.strip a{font-size:13px;color:#5b49ca;font-weight:800}.banner{padding:30px;background:#252941;color:#fff;border-radius:20px;display:flex;justify-content:space-between;align-items:center;gap:18px}.banner p{color:#c5cadd;font-size:13px}.banner .btn{flex:none}.footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:15px;padding:32px 0;border-top:1px solid var(--line);color:#78859b;font-size:12px}.footer a{color:#594ac7;margin-right:13px}.note{color:#818da0;font-size:11px;margin-top:17px}.compbar{display:none;position:fixed;bottom:15px;left:50%;transform:translateX(-50%);background:#252941;color:#fff;padding:11px;border-radius:13px;z-index:20;box-shadow:0 10px 38px #20223866;align-items:center;gap:10px;max-width:calc(100vw - 20px)}.compbar.show{display:flex}.compbar button{padding:9px;font-size:12px}.compare{margin-top:8px;background:#f5f3ff;border:1px solid #ddd6fc;border-radius:9px;padding:8px;font-size:11px;color:#6049c8}.compare.on{background:#5d48ca;color:#fff}.dialog{width:min(800px,96vw);max-height:85vh;overflow:auto;border:1px solid #ddd;border-radius:15px;padding:20px;color:#25314d}.dialog::backdrop{background:#16172ec9}.dialog table{border-collapse:collapse;min-width:470px}.dialog td,.dialog th{padding:12px;border-bottom:1px solid #e2e6ee;text-align:left;font-size:12px}.overflow{overflow:auto}.detail{padding:65px 0}.detailcard{border:1px solid #e6e8f0;border-radius:18px;background:#fff;padding:28px}.detailcard p,.detailcard li{color:#65738d}.rel{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:25px 0}.rel a{background:#fff;padding:20px;border:1px solid #e3e7ee;border-radius:13px;font-weight:750;color:#5343b9}@media(max-width:850px){.hero{grid-template-columns:1fr;gap:28px}.goals,.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.strip,.rel{grid-template-columns:1fr}.links{display:none}}@media(max-width:600px){.wrap{padding:0 16px}.hero{padding:45px 0}.section{padding:48px 0}.goals{grid-template-columns:repeat(2,minmax(0,1fr))}.goal{padding:16px}.finder{grid-template-columns:1fr;padding:22px}.bar{grid-template-columns:1fr}.grid{grid-template-columns:1fr}.banner{flex-direction:column;align-items:flex-start}.hero h1{font-size:43px}.detail{padding:35px 0}.compbar{bottom:8px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* AZAN_V6_DARK_3D */
:root{
color-scheme:dark;
--ink:#f6f5ff;
--sub:#b6c3e0;
--violet:#a88aff;
--line:#ffffff23
}
body{
color:#f8f8ff;
background:
radial-gradient(ellipse at 83% 2%,#54319a68,transparent 37%),
radial-gradient(ellipse at 0 34%,#10727d50,transparent 35%),
#080b19
}
.head{
background:#0f1526ee;
border-bottom:1px solid #ffffff23;
box-shadow:0 10px 30px #0005
}
.wrap{max-width:1220px}
.brand,.links{color:#f5f5ff}
.brand b{
background:linear-gradient(135deg,#bd99ff,#65e3df);
color:#101629
}
.brand span{color:#c3afff}
.btn{
color:#f4f1ff;
background:#ffffff0d;
border:1px solid #726591;
border-radius:12px;
transition:transform .2s,border-color .2s
}
.btn:hover{
transform:translateY(-2px);
border-color:#a78aff
}
.btn.primary{
background:linear-gradient(115deg,#aa7cff,#6357e8);
border:0;color:white;
box-shadow:0 12px 34px #6756e352
}
.hero{
grid-template-columns:1.04fr .96fr;
gap:27px;padding:70px 0
}
.hero h1{
font-size:clamp(42px,5.6vw,76px);
line-height:1.06;
letter-spacing:-3.5px
}
.hero h1 em{
color:transparent;
background:linear-gradient(110deg,#f0dcff,#ac91ff 48%,#72e9e1);
-webkit-background-clip:text;
background-clip:text;
filter:drop-shadow(0 8px 26px #8770ff55)
}
.over{color:#a99bff}
.lead,.intro,.note{color:#b2bfda}
.stats{color:#aebbd5}
.stats b{color:#f4f3ff}
.v6-stage{
position:relative;
min-height:450px;
border-radius:25px;
overflow:hidden;
isolation:isolate;
border:1px solid #9f8bef88;
background:radial-gradient(circle at 50% 43%,#6046af88,#151b40 50%,#0c1229 80%);
box-shadow:0 20px 75px #0008,inset 0 1px #ffffff27
}
.v6-stage:before{
content:'';
position:absolute;inset:0;
background:
linear-gradient(#ffffff06 1px,transparent 1px),
linear-gradient(90deg,#ffffff06 1px,transparent 1px);
background-size:36px 36px;
mask-image:linear-gradient(0deg,black,transparent 80%)
}
.v6-stage canvas{
position:absolute;inset:0;
width:100%;height:100%;z-index:1
}
.v6-orb{
position:absolute;top:50%;left:50%;
width:225px;height:225px;
transform:translate(-50%,-50%);
border-radius:50%;
background:radial-gradient(circle at 30% 22%,#f1e0ff,#ba9eff 21%,#6954cb 52%,#202457 86%);
box-shadow:0 0 90px #977afbab,inset -18px -22px 32px #111348;
animation:v6pulse 7s ease-in-out infinite
}
.v6-orbit{
position:absolute;
width:145%;height:42%;
top:30%;left:-22%;
border:3px solid #8eefe4;
border-radius:50%;
transform:rotate(-26deg)
}
.v6-webgl .v6-orb{display:none}
@keyframes v6pulse{
50%{transform:translate(-50%,-46%)}
}
.v6-top,.v6-bottom,.v6-float{
position:absolute;z-index:3;
color:#f1f1ff
}
.v6-top{
left:20px;right:20px;top:22px;
display:flex;justify-content:space-between;
gap:9px;font-size:11px;
font-weight:850;letter-spacing:1px
}
.v6-top span{color:#88edd6}
.v6-bottom{
bottom:20px;left:20px;right:20px;
display:flex;align-items:center;
justify-content:space-between;gap:10px
}
.v6-bottom span{font-size:11px;color:#8df0df}
.v6-float{
padding:10px 13px;
background:#151a35e5;
border:1px solid #ffffff4f;
border-radius:12px;
backdrop-filter:blur(9px);
font-size:12px;font-weight:850
}
.v6-float small{
display:block;font-weight:400;
font-size:10px;color:#b6c7e3
}
.v6-float.a{left:13px;bottom:100px}
.v6-float.b{right:13px;top:108px}
.white{
background:linear-gradient(120deg,#0f1428,#111a2c)
}
.section{padding:61px 0}
h2,.goal strong,.tile h3,.strip h3{color:#f6f4ff}
.goal,.tile,.strip article,.detailcard,.rel a{
background:linear-gradient(145deg,#1b2440,#111929);
border:1px solid #ffffff2a;
border-radius:17px;
box-shadow:0 12px 30px #0005;
color:#f4f4ff
}
.goal,.tile{
transition:transform .2s,border-color .2s,box-shadow .2s
}
.goal:hover,.tile:hover{
transform:translateY(-4px);
border-color:#9f82f1;
box-shadow:0 20px 45px #56439c44
}
.goal .ic{
display:grid;place-items:center;
width:47px;height:47px;
background:#8264d033;
border-radius:12px
}
.goal .ic img{
filter:brightness(0) invert(1);
width:25px
}
.goal small,.tile p,.strip p,.detailcard p,.detailcard li{
color:#b4c2d9
}
.goal i,.footrow a,.strip a,.rel a{color:#a1eee1}
.finder{
background:linear-gradient(130deg,#26234e,#131c36);
border:1px solid #9784ee72;
box-shadow:0 20px 55px #0005
}
.finder select,.bar input,.bar select{
background:#121a30;
color:#f6f5ff;
border:1px solid #596187
}
.match{
background:#262d4b;
border-color:#626b94
}
.match a{color:#9bf5e2}
.bar input::placeholder{color:#94a2bc}
.filter{
background:#161d32;
border-color:#454d6b;
color:#c4cee5
}
.filter.on{
background:#795bd1;
border-color:#997bef;color:white
}
.tile{
position:relative;overflow:hidden;
padding:20px
}
.tile:before{
content:'';
position:absolute;
top:0;left:0;right:0;
height:3px;
background:linear-gradient(90deg,#a98bff,#76ede0)
}
.tile p{line-height:1.7}
.tag{
background:#245d6438;
color:#a5f7e9;
border-color:#538c90
}
.compare{
background:#5c4a8840;
border-color:#8574b9;
color:#e2d7ff
}
.compare.on{
background:#7154b7;
color:white
}
.strip article{padding:26px}
.banner{
background:linear-gradient(110deg,#2a2452,#17314a);
border:1px solid #9588df88
}
.footer,.note{color:#a2b0ce}
.footer a{color:#c1b1ff}
.compbar{
background:#1c2442f2;
border:1px solid #ae98ff
}
.dialog{
background:#171e34;
color:#f5f5ff;
border-color:#9b87ea
}
.dialog td,.dialog th{border-color:#ffffff29}
.rel a{color:#b8aaff}
@media(max-width:850px){
.hero{grid-template-columns:1fr;gap:25px}
.v6-stage{min-height:390px}
}
@media(max-width:600px){
.hero{padding:42px 0}
.hero h1{font-size:43px;letter-spacing:-2.5px}
.v6-stage{min-height:320px}
.v6-orb{width:185px;height:185px}
.v6-top{font-size:9px}
.v6-float{font-size:10px;padding:7px}
.v6-float.b{top:76px}
.v6-float.a{bottom:73px}
.v6-bottom{bottom:14px}
.section{padding:48px 0}
.tile{min-height:195px}
}
@media(prefers-reduced-motion:reduce){
.v6-orb{animation:none!important}
*,*:before,*:after{transition:none!important}
}
