:root{--sky:#28ADE5;--skyd:#0F7CAB;--ink:#06293D;--mist:#EAF6FC;--slate:#4A6272;--line:#D3E5EE;--serif:'DM Serif Display',Georgia,serif;--sans:'Plus Jakarta Sans',system-ui,sans-serif;--r:22px}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);line-height:1.65;background:#fff;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}a{color:inherit}.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.08}
h1{font-size:clamp(2.6rem,5.6vw,4.6rem)}h2{font-size:clamp(2rem,3.8vw,3rem)}h3{font-size:1.5rem}p{color:var(--slate);max-width:60ch}
:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:80px}header img{height:48px;width:auto}
nav ul{display:flex;gap:6px;list-style:none;align-items:center}
nav a{text-decoration:none;font-weight:600;font-size:.94rem;padding:9px 16px;border-radius:40px}
nav a:hover{background:var(--mist)}nav a.on{background:var(--ink);color:#fff}
.btn{display:inline-block;background:var(--ink);color:#fff;font:700 .98rem var(--sans);text-decoration:none;padding:14px 28px;border-radius:40px;border:2px solid var(--ink);cursor:pointer;transition:.2s}
.btn:hover{background:var(--sky);border-color:var(--sky);color:var(--ink)}
.btn.alt{background:transparent;color:var(--ink)}.btn.alt:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
nav .btn{padding:10px 22px;margin-left:8px;color:#fff}nav .btn:hover{color:var(--ink)}
.burger{display:none;background:none;border:0;width:44px;height:44px;cursor:pointer}.burger span{display:block;height:2px;background:var(--ink);margin:6px 8px}
.hero .wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center;padding-top:72px;padding-bottom:88px}
.hero p{font-size:1.15rem;margin:24px 0 34px}.row{display:flex;gap:12px;flex-wrap:wrap}
.panel{background:var(--sky);border-radius:32px;padding:44px 0 44px 44px;position:relative;overflow:hidden}
.panel svg{position:absolute;right:-90px;bottom:-110px;width:420px;opacity:.55}.panel path{fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round}
.panel .frame{position:relative;z-index:1;border-radius:14px 0 0 14px}
.frame{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 18px 40px rgba(6,41,61,.18)}
.bar{display:flex;align-items:center;gap:6px;padding:11px 14px;background:var(--mist);border-bottom:1px solid var(--line)}
.bar i{width:10px;height:10px;border-radius:50%;background:#B7D3E2}.bar b{margin-left:10px;font:600 .78rem var(--sans);color:var(--slate);background:#fff;border-radius:20px;padding:3px 14px;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.shot{aspect-ratio:16/10;background-repeat:no-repeat;background-size:100% auto,100% auto,cover;background-position:center top,center top,center;transition:background-position .9s ease-out}
.panel .shot{aspect-ratio:4/3.1;animation:pan 16s ease-in-out infinite alternate}
@keyframes pan{to{background-position:center bottom,center bottom,center}}
.work{text-decoration:none;display:block}.work:hover .shot,.work:focus-visible .shot{background-position:center bottom,center bottom,center;transition:background-position 7s linear}
.work .frame{transition:box-shadow .3s,transform .3s}.work:hover .frame{box-shadow:0 18px 40px rgba(6,41,61,.2);transform:translateY(-4px)}
.work h3{margin-top:16px;font-size:1.45rem}.work span{color:var(--slate);font-size:.92rem}.work em{font-style:normal;font-weight:700;color:var(--skyd);font-size:.92rem;float:right;margin-top:-26px}
.t1{background-color:#0B4A6B}.t2{background-color:#06293D}.t3{background-color:#1B8FC4}
.works{display:grid;grid-template-columns:repeat(3,1fr);gap:48px 30px}
section{padding:92px 0}.tint{background:var(--mist)}.sec-head{margin-bottom:48px}.sec-head p{margin-top:14px}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.tile{background:var(--mist);border-radius:var(--r);padding:34px 30px;display:flex;flex-direction:column;transition:.25s}
.tile:hover{background:var(--ink)}.tile:hover h3,.tile:hover a{color:#fff}.tile:hover p{color:#BFE3F4}
.tile h3{margin-bottom:12px}.tile p{flex:1}.tile a{margin-top:20px;font-weight:700;color:var(--skyd);text-decoration:none}
details{border-bottom:1px solid var(--line);padding:20px 0}details:first-of-type{border-top:1px solid var(--line)}
summary{font:400 1.45rem var(--serif);cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px}
summary::-webkit-details-marker{display:none}summary:after{content:'+';color:var(--skyd);font-size:1.6rem;line-height:1}details[open] summary:after{content:'\2212'}details p{margin-top:12px}
.two{display:grid;grid-template-columns:1fr 1.3fr;gap:64px}
.band{background:var(--sky);padding:92px 0}.band p{color:var(--ink)}
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}.why div{background:#fff;border-radius:var(--r);padding:30px}.why p{color:var(--slate)}.why h3{margin-bottom:10px}
.page-head{background:var(--sky);padding:84px 0 70px;position:relative;overflow:hidden}.page-head p{color:var(--ink);margin-top:16px;font-size:1.1rem}
.page-head svg{position:absolute;right:-60px;top:-60px;width:380px;opacity:.5}.page-head path{fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round}.page-head .wrap{position:relative}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:44px}
.filters button{font:600 .95rem var(--sans);background:#fff;border:1.5px solid var(--line);padding:10px 22px;border-radius:40px;cursor:pointer;color:var(--ink)}
.filters button.on,.filters button:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.list{display:grid;grid-template-columns:repeat(3,1fr);gap:18px 40px}.list div{border-left:3px solid var(--sky);padding-left:16px}.list h3{font-size:1.25rem}.list p{font-size:.94rem;margin-top:4px}
.sub{font:700 1rem var(--sans);margin:0 0 22px;color:var(--skyd)}
.team{display:grid;grid-template-columns:300px 1fr;gap:52px;align-items:center}
.ph{aspect-ratio:1;border-radius:var(--r);background:var(--sky);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;font:400 4rem var(--serif);color:var(--ink)}.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cta{background:var(--ink);color:#fff;border-radius:32px;padding:64px 56px;display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap}.cta p{color:#BFE3F4;margin-top:10px}.cta .btn{background:var(--sky);border-color:var(--sky);color:var(--ink)}.cta .btn:hover{background:#fff;border-color:#fff}
.contact{display:grid;grid-template-columns:1fr 1.2fr;gap:60px}.contact dt{font-weight:700;margin-top:22px}.contact dd{color:var(--slate)}.contact dd a{text-decoration:none}
form{background:var(--mist);padding:36px;border-radius:var(--r)}form label{display:block;font-weight:600;font-size:.92rem;margin:16px 0 6px}form label:first-child{margin-top:0}
form input,form textarea{width:100%;font:1rem var(--sans);padding:13px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fff}form .btn{margin-top:22px}
.map{margin-top:64px;border-radius:var(--r);overflow:hidden;border:1px solid var(--line)}.map iframe{width:100%;height:380px;border:0;display:block}
footer{background:var(--mist);padding:72px 0 28px;margin-top:0}footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px}
footer img{height:54px;width:auto;margin-bottom:14px}footer h4{font:400 1.3rem var(--serif);margin-bottom:12px}footer ul{list-style:none}footer li{margin-bottom:8px;color:var(--slate)}footer a{text-decoration:none;color:var(--slate)}footer a:hover{color:var(--ink);text-decoration:underline}
.legal{border-top:1px solid var(--line);margin-top:44px;padding-top:20px;font-size:.88rem;color:var(--slate)}
.wa{position:fixed;right:20px;bottom:20px;z-index:60;background:#25D366;width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(0,0,0,.25)}.wa svg{width:30px;height:30px;fill:#fff}
.top{position:fixed;right:24px;bottom:88px;z-index:60;background:var(--ink);color:#fff;border:0;width:44px;height:44px;border-radius:50%;cursor:pointer;font-size:1.2rem;display:none}.top.show{display:block}
@media(max-width:960px){.hero .wrap,.two,.contact,.team{grid-template-columns:1fr}.tiles,.works,.why,.list{grid-template-columns:1fr 1fr}footer .cols{grid-template-columns:1fr 1fr}
.burger{display:block}nav{position:absolute;top:80px;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);display:none}nav.open{display:block}nav ul{flex-direction:column;align-items:flex-start;padding:14px 24px 24px}.panel{padding:28px 0 28px 28px}}
@media(max-width:620px){.tiles,.works,.why,.list,footer .cols{grid-template-columns:1fr}section{padding:64px 0}.cta{padding:44px 28px}}
@media(prefers-reduced-motion:reduce){.panel .shot{animation:none}.work:hover .shot{transition:none}html{scroll-behavior:auto}}
.hero2{background:var(--ink);color:#fff;position:relative;overflow:hidden}
.hero2 .wrap{padding-top:110px;padding-bottom:120px;position:relative;z-index:1}
.hero2 h1{max-width:13ch;color:#fff;font:600 clamp(2.6rem,6vw,4.6rem)/1.1 'Cormorant Garamond',Georgia,serif;letter-spacing:-.01em}
.hero2 p{color:#BFE3F4;font-size:1.15rem;margin:26px 0 38px;max-width:62ch}
.hero2 .btn{background:var(--sky);color:var(--ink);border-color:var(--sky);border-radius:4px}.hero2 .btn:hover{background:#fff;border-color:#fff;color:var(--ink)}
.hero2 .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}.hero2 .btn.ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
.arcs{position:absolute;right:-120px;top:50%;transform:translateY(-50%);width:760px;max-width:90vw;opacity:.9}
.arcs path{fill:none;stroke:var(--sky);stroke-width:2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.4s ease-out forwards}
.arcs path:nth-child(2){animation-delay:.25s;opacity:.8}.arcs path:nth-child(3){animation-delay:.5s;opacity:.65}.arcs path:nth-child(4){animation-delay:.75s;opacity:.5}.arcs path:nth-child(5){animation-delay:1s;opacity:.35}.arcs path:nth-child(6){animation-delay:1.25s;opacity:.25}
@keyframes draw{to{stroke-dashoffset:0}}
@media(max-width:900px){.arcs{opacity:.3}}
@media(max-width:600px){.hero2 .wrap{padding-top:72px;padding-bottom:80px}}
@media(prefers-reduced-motion:reduce){.arcs path{animation:none;stroke-dashoffset:0}}

.hp{position:absolute;left:-9999px;height:0;overflow:hidden}#fmsg{margin-top:16px;font-weight:600}#fmsg.ok{color:#0A7A3D}#fmsg.err{color:#B3261E}

.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px 24px}
.pcard{text-decoration:none;display:block}.pimg{aspect-ratio:4/3;border-radius:var(--r,6px);overflow:hidden;background:var(--mist)}
.pimg img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.pcard:hover .pimg img{transform:scale(1.06)}
.pcard h3{font-size:1.3rem;margin-top:14px}.pcard span{color:var(--skyd);font-weight:700;font-size:.92rem}
.crumbs{font-size:.9rem;margin-bottom:28px;color:var(--slate);max-width:none}.crumbs a{color:var(--skyd);text-decoration:none}
.prod{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:start}.pmain{border-radius:var(--r,6px);overflow:hidden;background:var(--mist)}.pmain img{width:100%}
.spec{margin:28px 0;border-top:1px solid var(--line)}.spec div{display:grid;grid-template-columns:160px 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}.spec dt{font-weight:700}.spec dd{color:var(--slate)}
@media(max-width:1000px){.pgrid{grid-template-columns:repeat(2,1fr)}.prod{grid-template-columns:1fr}}
@media(max-width:520px){.pgrid{grid-template-columns:1fr}}