/* ===== palettes ===== */
:root,[data-palette=electric]{--ink:#0f172a;--ink-fixed:#0b1437;--ink2:#1e3a8a;--aqua:#2563eb;--aqua2:#06b6d4;--aqua-d:#1d4ed8;--mist:#eef3ff;--line:#dbe4f5;--slate:#475569;--glow:#7dd3fc;--h2:#13235c;--h3:#1d3f9e;--h4:#2f5fe0;--foot:#070d24;--foot-line:#1a2547;--aqua-rgb:37,99,235;--r:14px;--bg:#fff;--card:#fff;--white:#fff}
[data-palette=emerald]{--ink:#052e2b;--ink-fixed:#04211f;--ink2:#065f46;--aqua:#10b981;--aqua2:#22d3ee;--aqua-d:#047857;--mist:#ecfdf5;--line:#cdeee0;--slate:#44625b;--glow:#6ee7b7;--h2:#064e3b;--h3:#047857;--h4:#0f9d70;--foot:#031a18;--foot-line:#0e3a35;--aqua-rgb:16,185,129}
[data-palette=violet]{--ink:#1e1b4b;--ink-fixed:#17143d;--ink2:#4c1d95;--aqua:#7c3aed;--aqua2:#ec4899;--aqua-d:#6d28d9;--mist:#f5f3ff;--line:#e4defa;--slate:#5b5877;--glow:#c4b5fd;--h2:#2e1f6b;--h3:#5b21b6;--h4:#7c3aed;--foot:#0f0c2b;--foot-line:#2a2560;--aqua-rgb:124,58,237}
[data-palette=ocean]{--ink:#0b2b3c;--ink-fixed:#0b2b3c;--ink2:#123a50;--aqua:#12a8b8;--aqua2:#0c8795;--aqua-d:#0c8795;--mist:#eaf4f6;--line:#d5e5ea;--slate:#4a6572;--glow:#8ee6ef;--h2:#0f3b52;--h3:#0c4d62;--h4:#1a6a82;--foot:#071e2a;--foot-line:#163446;--aqua-rgb:18,168,184}
[data-theme=dark]{--bg:#070b18;--card:#0f1629;--mist:#0b1226;--line:#1c2744;--slate:#a9b6d3;--ink:#e8eefc;--white:#0f1629}
.btn-aqua{background:linear-gradient(135deg,var(--aqua),var(--aqua2));box-shadow:0 10px 24px -10px rgba(var(--aqua-rgb),.7)}
.btn-aqua:hover{filter:brightness(1.08)}
.brand-mark{background:linear-gradient(145deg,var(--aqua),var(--aqua2))}
.hero{background:radial-gradient(900px 500px at 85% -10%,var(--h4) 0,transparent 60%),radial-gradient(700px 400px at -5% 100%,rgba(var(--aqua-rgb),.45) 0,transparent 60%),linear-gradient(160deg,var(--ink-fixed) 0%,var(--h2) 60%,var(--h3) 100%)}
.hero h1{background:linear-gradient(90deg,#fff 40%,var(--glow));-webkit-background-clip:text;background-clip:text;color:transparent}
.svc-art{background:linear-gradient(150deg,var(--ink2),var(--aqua))}.t1{background:linear-gradient(135deg,var(--h3),var(--aqua2))}
.nav-pills .nav-link.active{background:var(--aqua)!important}
.stat b{background:linear-gradient(90deg,var(--aqua),var(--aqua2));-webkit-background-clip:text;background-clip:text;color:transparent}
/* palette picker */
.pal{position:fixed;left:16px;bottom:18px;z-index:1030}
.pal-btn{width:46px;height:46px;border-radius:50%;border:0;background:var(--ink-fixed);color:#fff;font-size:1.3rem;box-shadow:0 8px 20px rgba(0,0,0,.3)}
.pal-box{position:absolute;bottom:56px;left:0;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:.7rem;display:none;gap:.5rem;box-shadow:0 14px 30px rgba(0,0,0,.2)}
.pal.open .pal-box{display:flex}
.pal-box button{width:30px;height:30px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--line);cursor:pointer}
html{scroll-behavior:smooth}
body{font-family:'Source Sans 3',system-ui,sans-serif;color:var(--slate);font-size:1.05rem;line-height:1.65;background:#fff;overflow-x:hidden}
h1,h2,h3,h4,h5{font-family:'Bricolage Grotesque',sans-serif;color:var(--ink);letter-spacing:-.02em;line-height:1.15}
h1{font-size:clamp(2.2rem,5.5vw,4rem);font-weight:800}h2{font-size:clamp(1.7rem,3.4vw,2.6rem);font-weight:700}
a{color:var(--aqua-d)}:focus-visible{outline:3px solid var(--aqua);outline-offset:3px}
.section{padding:clamp(3.5rem,8vw,6.5rem) 0}.bg-mist{background:var(--mist)}.bg-ink{background:var(--ink);color:#b9d2db}.bg-ink h2,.bg-ink h3,.bg-ink h5{color:#fff}
.lead-sm{max-width:60ch}
.btn-aqua{background:var(--aqua);color:#fff;border:0;padding:.8rem 1.6rem;font-weight:600;border-radius:50rem;transition:.2s}
.btn-aqua:hover{background:var(--aqua-d);color:#fff;transform:translateY(-2px)}
.btn-ghost{border:2px solid rgba(255,255,255,.55);color:#fff;padding:.75rem 1.6rem;font-weight:600;border-radius:50rem}
.btn-ghost:hover{background:#fff;color:var(--ink)}
.btn-line{border:2px solid var(--ink);color:var(--ink);padding:.7rem 1.5rem;font-weight:600;border-radius:50rem}.btn-line:hover{background:var(--ink);color:#fff}
.topbar{background:var(--ink);color:#b9d2db;font-size:.9rem;padding:.45rem 0}.topbar a{color:#b9d2db;text-decoration:none}.topbar a:hover{color:#fff}
.navbar{background:rgba(255,255,255,.96);backdrop-filter:blur(8px);box-shadow:0 1px 0 var(--line);padding:.7rem 0}
.navbar-brand{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:var(--ink)!important;font-size:1.35rem;display:flex;align-items:center;gap:.6rem}
.brand-mark{width:38px;height:38px;border-radius:11px 11px 11px 2px;background:linear-gradient(145deg,var(--aqua),var(--ink2));display:grid;place-items:center;color:#fff;font-size:1.2rem}
.brand-sub{display:block;font-family:'Source Sans 3';font-size:.68rem;font-weight:600;color:var(--slate);letter-spacing:.06em;margin-top:-.2rem}
.nav-link{color:var(--ink)!important;font-weight:600;padding:.5rem 1rem!important;position:relative}
.nav-link.active,.nav-link:hover{color:var(--aqua-d)!important}
.nav-link.active::after{content:"";position:absolute;left:1rem;right:1rem;bottom:.1rem;height:3px;border-radius:3px;background:var(--aqua)}
@media(max-width:991px){.nav-link.active::after{display:none}.navbar .btn-aqua{margin-top:.6rem}}
.hero{position:relative;background:radial-gradient(1200px 600px at 80% -10%,var(--h4) 0,transparent 60%),linear-gradient(160deg,var(--ink-fixed) 0%,var(--h2) 60%,var(--h3) 100%);color:#c5dde5;padding:clamp(4rem,9vw,7.5rem) 0 clamp(7rem,12vw,10rem);overflow:hidden}
.hero h1{color:#fff}.hero p.lead{max-width:52ch;font-size:1.2rem}
.hero-badge{display:inline-flex;gap:.5rem;align-items:center;background:rgba(var(--aqua-rgb),.18);color:var(--glow);border:1px solid rgba(var(--aqua-rgb),.4);border-radius:50rem;padding:.3rem .9rem;font-size:.92rem;font-weight:600}
.waves{position:absolute;left:0;right:0;bottom:-1px;height:clamp(70px,10vw,130px);line-height:0;overflow:hidden}
.waves svg{width:100%;height:100%}
.wave-a{animation:drift 14s linear infinite}.wave-b{animation:drift 22s linear infinite reverse}
@keyframes drift{from{transform:translateX(0)}to{transform:translateX(-120px)}}
.hero-panel{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:20px;padding:1.6rem;backdrop-filter:blur(6px)}
.meter{display:flex;justify-content:space-between;align-items:center;padding:.8rem 0;border-bottom:1px solid rgba(255,255,255,.12);color:#fff}
.meter:last-child{border:0}.meter small{color:#9cc3cf;display:block}.meter b{font-family:'Bricolage Grotesque';font-size:1.5rem;color:var(--glow)}
.page-hero{background:linear-gradient(160deg,var(--ink-fixed),var(--h3));color:#c5dde5;padding:4.5rem 0 5.5rem;position:relative;overflow:hidden}
.page-hero h1{color:#fff;font-size:clamp(2rem,4.5vw,3.2rem)}
.page-hero .breadcrumb{--bs-breadcrumb-divider-color:#6f9cab}.page-hero .breadcrumb a{color:var(--glow);text-decoration:none}.page-hero .breadcrumb-item.active{color:#c5dde5}
.stat{text-align:center;padding:1rem}.stat b{display:block;font-family:'Bricolage Grotesque';font-size:clamp(2.2rem,4vw,3.2rem);color:var(--ink);line-height:1}
.stat span{font-weight:600}
.svc{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.8rem;height:100%;transition:border-color .2s,box-shadow .2s}
.svc:hover{border-color:var(--aqua);box-shadow:0 14px 34px -18px rgba(11,43,60,.35)}
.ico{width:54px;height:54px;border-radius:14px;background:var(--mist);color:var(--aqua-d);display:grid;place-items:center;font-size:1.6rem;margin-bottom:1.1rem}
.svc-big{display:grid;grid-template-columns:1fr;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff}
.svc-art{background:linear-gradient(150deg,var(--ink2),var(--aqua-d));min-height:230px;display:grid;place-items:center;color:#fff;font-size:5rem}
@media(min-width:768px){.svc-big{grid-template-columns:5fr 7fr}.svc-big.flip .svc-art{order:2}}
.svc-big .body{padding:clamp(1.5rem,3vw,2.6rem)}
.checks{list-style:none;padding:0;margin:1rem 0 0}.checks li{padding-left:1.8rem;position:relative;margin:.4rem 0}
.checks li::before{content:"\F26A";font-family:bootstrap-icons;position:absolute;left:0;color:var(--aqua)}
.step{position:relative;padding-left:4rem;padding-bottom:1.8rem}
.step::before{content:"";position:absolute;left:19px;top:42px;bottom:0;width:2px;background:var(--line)}.step:last-child::before{display:none}
.step .n{position:absolute;left:0;top:0;width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-family:'Bricolage Grotesque';font-weight:700}
.filters .btn{border-radius:50rem;font-weight:600;border:1px solid var(--line);color:var(--ink);margin:.2rem}
.filters .btn.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.proj{border-radius:var(--r);overflow:hidden;background:#fff;border:1px solid var(--line);height:100%}
.proj .thumb{height:190px;display:grid;place-items:center;color:rgba(255,255,255,.92);font-size:3.4rem}
.t1{background:linear-gradient(135deg,var(--h3),var(--aqua))}.t2{background:linear-gradient(135deg,var(--ink2),var(--aqua))}.t3{background:linear-gradient(135deg,var(--ink-fixed),var(--aqua-d))}
.proj .info{padding:1.3rem}.tag{display:inline-block;background:var(--mist);color:var(--aqua-d);font-weight:600;font-size:.82rem;border-radius:50rem;padding:.15rem .7rem;margin-bottom:.5rem}
.proj-item.hide{display:none}
.quote{background:#fff;border-radius:18px;padding:clamp(1.5rem,3vw,2.5rem);border:1px solid var(--line)}
.quote p{font-size:1.2rem;color:var(--ink)}
.cta{background:linear-gradient(120deg,var(--ink),var(--aqua-d));color:#d3eaf0;border-radius:22px;padding:clamp(2rem,5vw,3.5rem)}.cta h2{color:#fff}
.accordion-button{font-weight:600;color:var(--ink)}.accordion-button:not(.collapsed){background:var(--mist);color:var(--ink)}
.accordion-item{border-color:var(--line)}
.form-control,.form-select{border-radius:10px;padding:.75rem 1rem;border-color:var(--line)}
.form-control:focus,.form-select:focus{border-color:var(--aqua);box-shadow:0 0 0 .2rem rgba(var(--aqua-rgb),.2)}
.info-row{display:flex;gap:1rem;margin-bottom:1.3rem}.info-row .ico{margin:0;flex:none}
.map-box{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);min-height:300px}.map-box iframe{width:100%;height:100%;min-height:300px;border:0}
footer{background:var(--foot);color:#9cb7c1;padding:4rem 0 0}footer h5{color:#fff;font-size:1.1rem;margin-bottom:1rem}
footer a{color:#9cb7c1;text-decoration:none}footer a:hover{color:var(--glow)}footer ul{list-style:none;padding:0}footer li{margin:.4rem 0}
.social a{width:40px;height:40px;border-radius:50%;border:1px solid var(--foot-line);display:inline-grid;place-items:center;margin-right:.4rem}.social a:hover{background:var(--aqua);color:#fff}
.copy{border-top:1px solid var(--foot-line);margin-top:3rem;padding:1.2rem 0;font-size:.92rem}
.fab{position:fixed;right:18px;z-index:1030;width:50px;height:50px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:1.4rem;box-shadow:0 8px 20px rgba(0,0,0,.25);text-decoration:none}
.fab-wa{bottom:78px;background:#25d366}.fab-top{bottom:18px;background:var(--ink);opacity:0;pointer-events:none;transition:.3s}.fab-top.show{opacity:1;pointer-events:auto}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s}.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.wave-a,.wave-b{animation:none}.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}
/* ===== v2 upgrade ===== */
[data-theme=dark]{--bg:#070b18;--card:#0f1629;--mist:#0b1226;--line:#1c2744;--slate:#a9b6d3;--ink:#e8eefc;--white:#0f1629}
body{background:var(--bg)}
[data-theme=dark] .navbar{background:rgba(7,20,28,.92)}
[data-theme=dark] .svc,[data-theme=dark] .svc-big,[data-theme=dark] .proj,[data-theme=dark] .quote,[data-theme=dark] .accordion-item,[data-theme=dark] .accordion-button,[data-theme=dark] .calc,[data-theme=dark] .plan,[data-theme=dark] .modal-content{background:var(--card);color:var(--slate)}
[data-theme=dark] .form-control,[data-theme=dark] .form-select{background:#0a1020;color:#e8f4f7}
[data-theme=dark] .quote b,[data-theme=dark] .modal-title,[data-theme=dark] .info-row b{color:#fff!important}
[data-theme=dark] .btn-line{color:#e8f4f7;border-color:#e8f4f7}[data-theme=dark] .btn-line:hover{background:#e8f4f7;color:#07141c}
[data-theme=dark] .bg-ink,[data-theme=dark] .topbar{background:#060a14}
[data-theme=dark] .navbar-toggler i{color:#fff!important}
.wave-a{fill:var(--bg)}.wave-b{fill:var(--mist)}
/* preloader + progress */
#pre{position:fixed;inset:0;z-index:2000;background:var(--ink-fixed,var(--ink-fixed));display:grid;place-items:center;transition:opacity .5s,visibility .5s}
#pre.done{opacity:0;visibility:hidden}
.drop{width:46px;height:46px;background:linear-gradient(145deg,var(--glow),var(--aqua));border-radius:0 50% 50% 50%;transform:rotate(-45deg);animation:pulse 1s ease-in-out infinite}
@keyframes pulse{50%{transform:rotate(-45deg) scale(1.25);opacity:.6}}
#bar{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--aqua),var(--glow));z-index:2100}
/* bubbles */
.bubbles{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.bubbles i{position:absolute;bottom:-60px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.07);animation:rise linear infinite}
@keyframes rise{to{transform:translateY(-110vh) translateX(30px);opacity:0}}
.chip{position:absolute;background:#fff;color:var(--ink-fixed,var(--ink-fixed));border-radius:12px;padding:.5rem .9rem;font-weight:700;font-size:.9rem;box-shadow:0 12px 28px rgba(0,0,0,.25);display:flex;gap:.5rem;align-items:center;animation:float 5s ease-in-out infinite}
.chip i{color:var(--aqua-d)}@keyframes float{50%{transform:translateY(-10px)}}
.hero .container{position:relative;z-index:2}
/* marquee */
.marq{overflow:hidden;border-block:1px solid var(--line);padding:1.1rem 0;background:var(--mist)}
.marq-track{display:flex;gap:3rem;width:max-content;animation:marq 30s linear infinite}
.marq-track span{font-family:'Bricolage Grotesque';font-weight:700;color:var(--slate);white-space:nowrap;font-size:1.15rem}.marq-track i{color:var(--aqua);margin-right:.5rem}
@keyframes marq{to{transform:translateX(-50%)}}
.ind{display:flex;gap:.8rem;align-items:center;padding:1rem 1.2rem;border:1px solid var(--line);border-radius:12px;background:var(--card);font-weight:600;color:var(--ink);height:100%}
.ind i{font-size:1.5rem;color:var(--aqua)}
/* theme btn */
.theme-btn{border:1px solid var(--line);background:transparent;color:var(--ink);width:40px;height:40px;border-radius:50%}
/* calculator */
.calc{background:#fff;border:1px solid var(--line);border-radius:18px;padding:clamp(1.3rem,3vw,2.2rem)}
.nav-pills .nav-link{border-radius:50rem;color:var(--ink)!important}.nav-pills .nav-link.active{background:var(--ink)!important;color:#fff!important}.nav-pills .nav-link.active::after{display:none}
[data-theme=dark] .nav-pills .nav-link.active{background:var(--aqua)!important}
.res{background:var(--mist);border-radius:14px;padding:1.2rem;height:100%}.res .row>div{padding:.55rem .75rem}
.res b{display:block;font-family:'Bricolage Grotesque';font-size:1.6rem;color:var(--ink);line-height:1.1}.res small{color:var(--slate)}
/* plans */
.plan{background:#fff;border:1px solid var(--line);border-radius:18px;padding:2rem;height:100%;position:relative}
.plan.pop{border:2px solid var(--aqua)}.plan .badge-pop{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--aqua);color:#fff;border-radius:50rem;padding:.2rem .9rem;font-size:.8rem;font-weight:700}
.proj[data-open]{cursor:pointer;transition:transform .2s,box-shadow .2s}.proj[data-open]:hover{transform:translateY(-4px);box-shadow:0 18px 34px -20px rgba(11,43,60,.5)}
.fab-wa{animation:ring 3s ease-in-out infinite}@keyframes ring{0%,90%,100%{box-shadow:0 0 0 0 rgba(37,211,102,.5)}95%{box-shadow:0 0 0 14px rgba(37,211,102,0)}}
@media(max-width:575px){.chip{display:none}}
@media(prefers-reduced-motion:reduce){.bubbles,.marq-track,.chip,.fab-wa{animation:none}}
.cta{background:linear-gradient(120deg,var(--ink-fixed),var(--aqua-d))}.bg-ink{background:var(--ink-fixed)}
[data-theme=dark] .step .n{background:var(--aqua)}
[data-theme=dark] .filters .btn.active{color:#07141c}
[data-theme=dark] .nav-pills .nav-link.active{color:#fff}