:root{--blue:#0892D0;--ink:#0b1620;--mut:#52667a;--bg:#fff;--soft:#eef7fc;--card:#fff;--line:#d9e6ef;--logo:none;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--ink:#eaf4fb;--mut:#9db3c5;--bg:#0b1620;--soft:#0f1f2c;--card:#132636;--line:#233a4d;--logo:brightness(0) invert(1)}}
:root[data-theme="dark"]{--ink:#eaf4fb;--mut:#9db3c5;--bg:#0b1620;--soft:#0f1f2c;--card:#132636;--line:#233a4d;--logo:brightness(0) invert(1)}
html{scroll-behavior:smooth;scroll-padding-top:calc(env(safe-area-inset-top,0px) + 70px)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
h1,h2,h3{font-family:Rajdhani,system-ui,sans-serif;line-height:1.1;margin:0}
a{color:inherit}
.wrap{max-width:1100px;margin:0 auto;padding:0 20px}
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}.brand .em{height:46px;width:46px}.dk{display:none}.wm{display:flex;flex-direction:column;font:700 23px/1 Rajdhani,system-ui,sans-serif;letter-spacing:.1em}.wm b{color:var(--blue)}.wm small{font-size:8px;letter-spacing:.32em;color:var(--mut);font-weight:600;margin-top:5px}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .lt{display:none}:root:not([data-theme="light"]) .dk{display:block}}
:root[data-theme="dark"] .lt{display:none}:root[data-theme="dark"] .dk{display:block}
nav{display:flex;align-items:center;gap:22px}
nav a.l{display:none;text-decoration:none;font-weight:600;color:var(--mut)}
nav a.l:hover{color:var(--blue)}
@media(min-width:780px){nav a.l{display:inline}}
.btn{display:inline-flex;white-space:nowrap;align-items:center;gap:8px;padding:12px 22px;border-radius:999px;font-weight:700;text-decoration:none;border:2px solid var(--blue);background:var(--blue);color:#fff;cursor:pointer;font-size:16px;transition:transform .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(8,146,208,.35)}
.btn.o{background:transparent;color:var(--blue)}
.btn.g{background:#25D366;border-color:#25D366}
.hero{padding:64px 0 56px;background:radial-gradient(900px 400px at 85% -10%,rgba(8,146,208,.22),transparent 70%),radial-gradient(600px 300px at 0% 100%,rgba(8,146,208,.10),transparent 70%)}
.hg{display:grid;gap:36px;align-items:center}@media(min-width:1000px){.hg{grid-template-columns:1.1fr .9fr}}
.vis{position:relative;height:300px}@media(min-width:1000px){.vis{height:440px}}
.vis img{position:absolute;aspect-ratio:4/3;object-fit:cover;border-radius:18px;border:4px solid var(--card);box-shadow:0 18px 40px rgba(8,30,50,.25);animation:fl2 6s ease-in-out infinite}
.vis .p1{width:58%;left:2%;top:4%;rotate:-5deg}.vis .p2{width:50%;right:0;top:22%;rotate:4deg;animation-delay:-2s}.vis .p3{width:46%;left:22%;bottom:0;rotate:-2deg;animation-delay:-4s}
.vis .ring{position:absolute;inset:6% 4%;border:3px dashed var(--blue);opacity:.35;border-radius:50%;animation:spinr 40s linear infinite}
@keyframes fl2{0%,100%{translate:0 0}50%{translate:0 -10px}}@keyframes spinr{to{rotate:360deg}}
.hg>div{min-width:0}.hero h1{font-size:clamp(32px,9vw,76px);font-weight:700;max-width:14ch}
.hero h1 b{color:var(--blue)}
.hero p{max-width:52ch;color:var(--mut);font-size:18px;margin:18px 0 28px}
.cta{display:flex;flex-wrap:wrap;gap:12px}
.steps{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:40px;font-weight:700}
.steps span{padding:8px 16px;border:2px solid var(--line);border-radius:999px;background:var(--card);animation:pulse 6s infinite}
.steps span:nth-of-type(2){animation-delay:1.2s}.steps span:nth-of-type(3){animation-delay:2.4s}.steps span:nth-of-type(4){animation-delay:3.6s}.steps span:nth-of-type(5){animation-delay:4.8s}
.steps i{width:28px;height:2px;background:var(--blue);opacity:.6}
@keyframes pulse{0%,25%,100%{border-color:var(--line);color:var(--ink)}10%{border-color:var(--blue);color:var(--blue);box-shadow:0 0 0 6px rgba(8,146,208,.15)}}
section{padding:72px 0}
section.alt{background:var(--soft)}
.sh{text-align:center;margin-bottom:40px}
.sh h2{font-size:clamp(32px,5vw,48px)}
.sh h2 b{color:var(--blue)}
.sh p{color:var(--mut);margin:10px auto 0;max-width:56ch}
.grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:22px;text-align:center;transition:transform .25s,box-shadow .25s}
.card:hover{transform:translateY(-6px);box-shadow:0 14px 34px rgba(8,146,208,.18)}
.card svg{width:100%;max-width:230px;height:auto;margin:0 auto 6px;display:block}
.card h3{font-size:26px;margin:8px 0}
.card p{color:var(--mut);margin:0 0 16px;font-size:15px}
.card[data-to]{cursor:pointer}.card a.more{color:var(--blue);font-weight:700;text-decoration:none}.dt,.rc{background:var(--card);border:1px solid var(--line);border-left:5px solid var(--blue);border-radius:16px;padding:24px;margin-bottom:16px}.dt h3,.rc h3{font-size:28px;margin-bottom:10px}.dt p,.rc p{color:var(--mut);margin:0 0 12px}.dt .btn{margin-top:6px}.dt:target{box-shadow:0 0 0 3px rgba(8,146,208,.4)}.bar{background:var(--blue);color:#fff;text-align:center;padding:8px 14px;font-size:14px;font-weight:600}.bar a{color:#fff;text-decoration:underline;margin-left:6px;cursor:pointer}.g2{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.tabs{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:0 0 20px}.tab{padding:9px 16px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:600 15px system-ui,sans-serif;cursor:pointer;white-space:nowrap}.tab.on{background:var(--blue);border-color:var(--blue);color:#fff}.js .dt:not(.on){display:none}.soc{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:14px}.soc a{padding:8px 16px;border:1px solid var(--line);border-radius:999px;background:var(--card);font-weight:700;text-decoration:none;color:var(--ink)}.soc a:hover{border-color:var(--blue);color:var(--blue)}@media(max-width:700px){.tabs{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding-bottom:6px}}
.q{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 18px;margin-bottom:10px}.q summary{font-weight:700;cursor:pointer}.q p{color:var(--mut);margin:10px 0 0}.scan{animation:scn 2.6s ease-in-out infinite alternate}.tl{stroke-dasharray:1;animation:tl 5s linear infinite}@keyframes scn{to{transform:translateY(66px)}}@keyframes tl{0%{stroke-dashoffset:1}20%,90%{stroke-dashoffset:0}100%{stroke-dashoffset:1}}
.card a.ask{color:var(--blue);font-weight:700;text-decoration:none}
.o{fill:none;stroke:var(--ink);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.o.w{fill:var(--card)}.b{fill:var(--blue);stroke:var(--ink);stroke-width:3;stroke-linejoin:round}
.bs{fill:none;stroke:var(--blue);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.head{animation:sx 1.3s ease-in-out infinite alternate}
.gantry{animation:up 5s linear infinite}
.grow{transform-box:fill-box;transform-origin:50% 100%;animation:rise 5s linear infinite}
.cut{transform-box:fill-box;transform-origin:0 50%;animation:cutx 3s linear infinite}
.spin{animation:mv 3s linear infinite}
.lh{animation:sx 2.4s ease-in-out infinite alternate}
.draw{stroke-dasharray:1;animation:dr 4s linear infinite}
.dim,.chk{opacity:0;animation:fd 4s linear infinite}
.chk{animation-delay:.4s}
.liq{transform-box:fill-box;transform-origin:50% 100%;animation:rise 4s ease-in-out infinite}
.pour{stroke-dasharray:4 5;animation:fl .5s linear infinite}
.sk{animation:sk 4s ease-in-out infinite}.so{animation:so 4s ease-in-out infinite}.dash{stroke-dasharray:6 6}
@keyframes sx{from{transform:translateX(-24px)}to{transform:translateX(24px)}}
@keyframes up{0%{transform:translateY(40px)}85%,100%{transform:translateY(0)}}
@keyframes rise{0%{transform:scaleY(.08)}85%,100%{transform:scaleY(1)}}
@keyframes cutx{0%{transform:scaleX(0)}100%{transform:scaleX(1)}}
@keyframes mv{0%{transform:translateX(0)}100%{transform:translateX(100px)}}
@keyframes dr{0%{stroke-dashoffset:1}60%,100%{stroke-dashoffset:0}}
@keyframes fd{0%,45%{opacity:0}60%,90%{opacity:1}100%{opacity:0}}
@keyframes fl{to{stroke-dashoffset:-9}}
@keyframes sk{0%,35%{opacity:1}55%,100%{opacity:0}}
@keyframes so{0%,35%{opacity:0}55%,90%{opacity:1}100%{opacity:0}}
.gal{columns:3 230px;column-gap:14px}
.gal figure{break-inside:avoid;margin:0 0 14px;border-radius:18px;overflow:hidden;background:var(--card);border:1px solid var(--line)}
.gal img{width:100%;height:auto;display:block;transition:transform .5s}
.gal figure:hover img{transform:scale(1.06)}
.gal figcaption{padding:10px 14px;font-weight:600;font-size:14px}
.rev{max-width:620px;margin:0 auto;text-align:center;background:var(--card);border:1px solid var(--line);border-radius:22px;padding:32px 22px}
.rev .st{color:#f5b301;font-size:30px;letter-spacing:4px}
.form{max-width:560px;margin:0 auto;display:grid;gap:12px}
.form input,.form select,.form textarea{width:100%;padding:13px 14px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--blue);border-color:transparent}
.info{text-align:center;margin-top:28px;color:var(--mut)}
.info a{color:var(--blue);font-weight:700;text-decoration:none}
footer{background:#0b1620;color:#9db3c5;padding:44px 0 calc(24px + 70px);font-size:14px}.fg{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}footer h4{color:#fff;margin:0 0 10px;font:700 17px Rajdhani,system-ui,sans-serif;letter-spacing:.06em}footer a{color:#9db3c5;text-decoration:none;display:block;padding:3px 0}footer a:hover{color:#fff}.copy{border-top:1px solid #233a4d;margin-top:28px;padding-top:16px;text-align:center}
.brand.f{margin-bottom:12px;color:#fff}.brand.f .em{height:56px;width:56px}
.wa{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:30;width:60px;height:60px;border-radius:50%;background:#25D366;display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.3);animation:ring 2.6s infinite}
.wa svg{width:32px;height:32px;fill:#fff}
@keyframes ring{0%{box-shadow:0 0 0 0 rgba(37,211,102,.5),0 6px 18px rgba(0,0,0,.3)}70%,100%{box-shadow:0 0 0 18px rgba(37,211,102,0),0 6px 18px rgba(0,0,0,.3)}}
.js .rv{opacity:0;transform:translateY(22px);transition:opacity .7s,transform .7s}
.js .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.js .rv{opacity:1;transform:none}}
@media(max-width:520px){.wm{font-size:19px;letter-spacing:.07em}.wm small{font-size:6.5px;letter-spacing:.26em}.brand{gap:8px}.brand .em{height:38px;width:38px}header .btn{padding:8px 13px;font-size:13px}header .wrap{padding:0 14px}}
@media(max-width:390px){.wm{font-size:16px}.wm small{display:none}}
@media(min-width:1000px){.hero h1{font-size:min(54px,4.4vw)}}

section{padding:52px 0}.hero{padding:36px 0 32px}.hero p{margin:14px 0 22px}.vis{height:230px}@media(min-width:1000px){.vis{height:360px}}
.hb{display:inline-grid;place-items:center;width:44px;height:44px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);cursor:pointer}
.dnav{display:none}@media(min-width:780px){.dnav{display:flex}.hb{display:none}}
.mp{display:none;border-top:1px solid var(--line);background:var(--bg)}.mp.open{display:block}.mp a{display:block;padding:14px 20px;font-weight:700;text-decoration:none;border-bottom:1px solid var(--line)}header .mp a.btn{display:inline-flex;margin:14px 20px;padding:12px 22px;font-size:16px;color:#fff;border-bottom:2px solid var(--blue)}@media(min-width:780px){.mp{display:none!important}}
a.card{display:block;text-decoration:none;color:inherit}.card .more{color:var(--blue);font-weight:700}
.bc{font-size:14px;color:var(--mut);margin:18px 0 6px}.bc a{color:var(--blue);text-decoration:none}
.pg h1{font-size:clamp(32px,6vw,46px);margin:6px 0 12px}.lead{font-size:18px;color:var(--mut);max-width:62ch}
.sp{display:grid;gap:28px}@media(min-width:900px){.sp{grid-template-columns:1.5fr .6fr}.aside{position:sticky;top:90px;align-self:start}}
.sp h2{font-size:26px;margin:26px 0 8px}.sp p{color:var(--mut);margin:0 0 10px}
.ck{list-style:none;padding:0;margin:8px 0 12px}.ck li{position:relative;padding-left:26px;margin:7px 0}.ck li::before{content:"\2713";position:absolute;left:0;color:var(--blue);font-weight:700}
.pills{display:flex;flex-wrap:wrap;gap:8px}.pills a{padding:8px 14px;border:1px solid var(--line);border-radius:999px;text-decoration:none;font-weight:600;background:var(--card)}.pills a:hover{border-color:var(--blue);color:var(--blue)}
.sg{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin:12px 0}.sg img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:14px;border:1px solid var(--line)}
.wg{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}.wg img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:14px;border:1px solid var(--line);display:block}
.flow{list-style:none;padding:0;margin:0;display:grid;gap:22px;grid-template-columns:1fr}.flow li{position:relative;text-align:center;padding:14px 10px;border:1px solid var(--line);border-radius:14px;background:var(--card);font-weight:700}.flow li:not(:last-child)::after{content:"\2193";position:absolute;left:50%;bottom:-20px;transform:translateX(-50%);color:var(--blue);font-weight:700}
@media(min-width:900px){.flow{grid-template-columns:repeat(5,1fr)}.flow li:not(:last-child)::after{content:"\2192";left:auto;right:-19px;bottom:auto;top:50%;transform:translateY(-50%)}}
.band{background:var(--soft);border-radius:22px;padding:30px 22px;text-align:center}.band h2{font-size:32px}.band p{color:var(--mut);margin:8px auto 18px;max-width:52ch}
.rowl{display:block;padding:18px 0;border-bottom:1px solid var(--line);text-decoration:none;color:inherit}.rowl h3{font-size:24px}.rowl p{margin:4px 0 0;color:var(--mut)}.rowl span{color:var(--blue);font-weight:700}
.cg{display:grid;gap:28px}@media(min-width:900px){.cg{grid-template-columns:1.2fr .8fr}}.cg .form{max-width:none;margin:0}.dl a{display:block;padding:6px 0;color:var(--blue);font-weight:700;text-decoration:none}.btns{display:flex;flex-wrap:wrap;gap:10px}.note{font-size:14px;color:var(--mut)}
.wa svg{width:34px;height:34px;fill:#fff}
.hero{overflow:hidden}.vis .p2{right:3%}.vis img{height:auto}

.cl{opacity:0;stroke-dasharray:7 2 1.5 2;animation:fd 4s linear infinite;animation-delay:.2s}.tx{fill:var(--ink);font:600 8px system-ui,sans-serif}
.cp{transform-box:fill-box;transform-origin:center;opacity:0}.cp0{animation:cp0 5s ease-out infinite}.cp1{animation:cp1 5s ease-out infinite}.cp2{animation:cp2 5s ease-out infinite}.cp3{animation:cp3 5s ease-out infinite}
@keyframes cp0{0%,4%{opacity:0;transform:scale(.4)}10%,90%{opacity:1;transform:none}100%{opacity:0}}@keyframes cp1{0%,22%{opacity:0;transform:scale(.4)}28%,90%{opacity:1;transform:none}100%{opacity:0}}@keyframes cp2{0%,40%{opacity:0;transform:scale(.4)}46%,90%{opacity:1;transform:none}100%{opacity:0}}@keyframes cp3{0%,58%{opacity:0;transform:scale(.4)}64%,90%{opacity:1;transform:none}100%{opacity:0}}
.ico{display:flex;flex-wrap:wrap;gap:10px}.ico a{display:inline-flex;border-radius:12px;transition:transform .2s}.ico a:hover{transform:translateY(-3px)}
.vw{position:relative;border:2px dashed var(--line);border-radius:18px;background:var(--soft);padding:16px;text-align:center}.vw.on{border-color:var(--blue)}.vw canvas{width:100%;height:280px;display:block;touch-action:none;cursor:grab;border-radius:12px}.vw label.btn{margin:6px 0}.vw input[type=file]{position:absolute;opacity:0;width:1px;height:1px}
.est{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-top:14px;text-align:left}.est select,.est input{width:100%;padding:11px 12px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit}.est label{font-size:13px;font-weight:600;color:var(--mut)}
.price{font:700 26px Rajdhani,system-ui,sans-serif;color:var(--blue);margin-top:12px}.step{font-size:26px;margin:0 0 10px}
.cdet a{display:flex;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);text-decoration:none;color:inherit}.cdet b{color:var(--blue)}.map{border:0;width:100%;height:320px;border-radius:18px;margin-top:18px}
.art p,.art li{color:var(--mut)}.art h2{font-size:26px;margin:24px 0 8px}.art{max-width:780px}.story{background:var(--card);border:1px solid var(--line);border-left:5px solid var(--blue);border-radius:16px;padding:22px;margin-bottom:16px}.story h3{font-size:26px}.story p{color:var(--mut)}
.hexw{--w:clamp(86px,27vw,118px);position:relative;width:calc(var(--w)*3);height:calc(var(--w)*2.887);margin:0 auto}
.hx{position:absolute;display:block;width:var(--w);height:calc(var(--w)*1.1547);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:var(--blue);text-decoration:none;transition:transform .25s;animation:hxin .6s both}
.hx i{position:absolute;inset:2.5px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:var(--card);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);font-style:normal;padding:0 6px}
.hx:hover{transform:translateY(-5px)}.hx svg{width:84%;height:auto}.hx b{font:700 clamp(8px,2.2vw,11px)/1.15 system-ui,sans-serif;color:var(--ink);text-align:center}
.hx.c i{background:var(--blue)}.hx.c b{color:#fff;letter-spacing:.06em;font-family:Rajdhani,system-ui,sans-serif;font-size:clamp(9px,2.6vw,13px)}.hx.c img{width:34%;height:auto}
@keyframes hxin{from{opacity:0;scale:.7}to{opacity:1;scale:1}}
.pgrid{display:grid;gap:16px;margin-top:14px}@media(min-width:900px){.pgrid{grid-template-columns:.9fr 1.1fr}}
.plist{display:grid;gap:8px;align-content:start}.prow{position:relative;border:1px solid var(--line);border-radius:12px;padding:10px 38px 10px 12px;background:var(--card);cursor:pointer;display:grid;gap:2px;font-size:14px}.prow.on{border-color:var(--blue);box-shadow:0 0 0 2px rgba(8,146,208,.25)}.prow b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.prow span{color:var(--mut)}.prow .pp{color:var(--blue);font-weight:700}.rm{position:absolute;top:6px;right:6px;border:0;background:transparent;color:var(--mut);cursor:pointer;font-size:16px;padding:4px 8px}
.settings{border:1px solid var(--line);border-radius:14px;padding:14px;background:var(--card)}.settings label{display:block;font-size:13px;font-weight:600;color:var(--mut);margin:10px 0 4px}.settings select,.settings input{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit}
.infs{display:flex;flex-wrap:wrap;gap:8px}.ifb{display:grid;justify-items:center;gap:4px;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);cursor:pointer;font:600 12px system-ui,sans-serif}.ifb.on{border-color:var(--blue);box-shadow:0 0 0 2px rgba(8,146,208,.25)}
.pat{width:44px;height:44px;border:2px solid var(--ink);border-radius:6px;background-color:var(--soft);background-image:linear-gradient(var(--blue) 1.5px,transparent 1.5px),linear-gradient(90deg,var(--blue) 1.5px,transparent 1.5px);background-size:var(--g) var(--g)}.pat.solid{background-image:none;background-color:var(--blue)}
.wp{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin:12px 0}.wp .rc h3{font-size:22px}.svc{width:100%;padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit}
#estcard[hidden]{display:none}