:root{
 --ink:#06162E;--navy:#0B2A52;--navy2:#0E2340;--blue:#0066CC;--blue2:#2F86E0;--green:#8BC53F;--green-d:#5E9420;
 --gold:#C9A34A;--mist:#F3F6FA;--line:#DCE3EC;--line2:#E9EEF4;--body:#3F4E63;--muted:#69788D;
 --brand:linear-gradient(120deg,#0066CC 0%,#2A8C8A 55%,#8BC53F 100%);
 --ease:cubic-bezier(.2,.7,.2,1);--sh:0 1px 2px rgba(6,22,46,.04),0 12px 32px -14px rgba(6,22,46,.22)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:400 16.5px/1.7 Inter,system-ui,sans-serif;color:var(--body);background:#fff;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:Poppins,sans-serif;color:var(--ink);margin:0 0 .5em;font-weight:600;letter-spacing:-.025em}
h1{font-size:clamp(38px,5.6vw,68px);line-height:1.04}
h2{font-size:clamp(28px,3.4vw,44px);line-height:1.1}
h3{font-size:19px;line-height:1.3;letter-spacing:-.01em}
p{margin:0 0 1em}a{color:var(--blue);text-decoration:none}
img{max-width:100%;display:block}
:focus-visible{outline:2px solid var(--blue2);outline-offset:3px;border-radius:6px}
.wrap{max-width:1240px;margin:0 auto;padding:0 28px}
.sec{padding:120px 0}.mist{background:var(--mist)}
.intro{max-width:640px;margin-bottom:56px}.intro p{font-size:18px;color:var(--muted);margin:0}
.intro.split{max-width:none;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end}
.rule{width:44px;height:3px;border-radius:2px;background:var(--brand);margin-bottom:22px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 26px;border-radius:10px;font:500 15.5px Poppins,sans-serif;border:0;cursor:pointer;transition:background .25s var(--ease),color .25s,border-color .25s,transform .25s var(--ease);white-space:nowrap}
.btn svg{width:18px;height:18px;transition:transform .3s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn-p{background:var(--blue);color:#fff}.btn-p:hover{background:#0057AE}
.btn-g{background:var(--green);color:var(--ink)}.btn-g:hover{background:#9BD24F}
.btn-o{border:1px solid var(--line);color:var(--ink);background:#fff}.btn-o:hover{border-color:var(--ink)}
.btn-ghost{color:#fff;border:1px solid rgba(255,255,255,.28);background:transparent}.btn-ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.5)}
.btn-sm{height:42px;padding:0 18px;font-size:14.5px}
.link{font:500 15px Poppins;color:var(--ink);display:inline-flex;align-items:center;gap:8px;border-bottom:1px solid var(--line);padding-bottom:3px;transition:border-color .2s}
.link:hover{border-color:var(--ink)}

/* region */

.ph{color:#9A5A00;background:#FFF1D6;padding:0 6px;border-radius:4px;font-weight:600;white-space:nowrap}

/* utility bar */
.util{background:var(--ink);color:#93A3BA;font-size:13px}
.util .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;height:44px}
.util .l{display:flex;gap:24px;align-items:center}.util a{color:#C7D3E3}.util a:hover{color:#fff}
.util .l span{display:inline-flex;align-items:center;gap:8px}.util svg{width:14px;height:14px;opacity:.7}
.reg{display:inline-flex;border:1px solid rgba(255,255,255,.14);border-radius:8px;padding:3px;gap:2px}
.reg button{border:0;background:none;color:#B7C5D8;font:500 12.5px Inter;padding:5px 12px;border-radius:6px;cursor:pointer;transition:.2s}
.reg button.on{background:#fff;color:var(--ink)}

/* header */
header.hdr{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.88);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid transparent;transition:border-color .3s,box-shadow .3s}
header.hdr.scrolled{border-color:var(--line2);box-shadow:0 6px 24px -18px rgba(6,22,46,.35)}
header.hdr .wrap{display:flex;align-items:center;justify-content:space-between;height:80px;gap:20px}
.logo{display:flex;align-items:center;gap:12px;color:var(--ink)}
.logo .m{width:42px;height:42px;border-radius:11px;background:var(--brand);display:grid;place-items:center;color:#fff;font:700 15px Poppins;letter-spacing:-.02em;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
.logo b{display:block;font:600 17px/1.15 Poppins;letter-spacing:-.015em}
.logo small{display:block;font:500 12px Inter;color:var(--muted)}
nav.main{display:flex;gap:2px}
nav.main a{position:relative;color:var(--ink);font:500 15px Inter;padding:10px 14px}
nav.main a:after{content:"";position:absolute;left:14px;right:14px;bottom:4px;height:2px;border-radius:2px;background:var(--brand);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
nav.main a:hover:after,nav.main a.on:after{transform:scaleX(1)}
.hacts{display:flex;gap:10px;align-items:center}
.burger{display:none;border:1px solid var(--line);background:#fff;border-radius:10px;width:46px;height:46px;cursor:pointer;color:var(--ink)}
.burger svg{width:20px;height:20px}
.mnav{display:none}

/* ===== HERO ===== */
.hero{position:relative;background:var(--ink);color:#B8C6D9;overflow:hidden;isolation:isolate}
.hero .aur{position:absolute;inset:-20%;z-index:-2;filter:blur(70px);opacity:.75}
.hero .aur i{position:absolute;border-radius:50%;mix-blend-mode:screen}
.hero .aur i:nth-child(1){width:46vw;height:46vw;left:-6vw;top:-10vw;background:#0B5CC0;animation:drift1 22s ease-in-out infinite alternate}
.hero .aur i:nth-child(2){width:34vw;height:34vw;right:4vw;top:6vw;background:#1E7F86;opacity:.8;animation:drift2 26s ease-in-out infinite alternate}
.hero .aur i:nth-child(3){width:28vw;height:28vw;right:26vw;bottom:-6vw;background:#5D9A2A;opacity:.55;animation:drift3 30s ease-in-out infinite alternate}
@keyframes drift1{to{transform:translate(8vw,6vw) scale(1.1)}}
@keyframes drift2{to{transform:translate(-10vw,8vw) scale(.9)}}
@keyframes drift3{to{transform:translate(6vw,-8vw) scale(1.15)}}
.hero .grid-bg{position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(255,255,255,.09) 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent)}
.hero .wrap{display:grid;grid-template-columns:1.12fr .88fr;gap:64px;align-items:center;padding-top:110px;padding-bottom:70px}
.award{display:inline-flex;gap:12px;align-items:center;padding:8px 16px 8px 8px;border-radius:99px;border:1px solid rgba(201,163,74,.35);background:rgba(201,163,74,.08);font-size:13.5px;color:#E8DDBF;margin-bottom:30px}
.award .medal{width:28px;height:28px;border-radius:50%;background:linear-gradient(140deg,#F1D58A,#B88A2E);display:grid;place-items:center;color:#4A3608}
.award .medal svg{width:15px;height:15px}
.hero h1{color:#fff;max-width:13ch}
.hero .lead{font-size:19.5px;line-height:1.65;max-width:560px;color:#BFCBDB;margin:26px 0 0}
.hero .acts{display:flex;gap:14px;flex-wrap:wrap;margin-top:38px}
.creds{border-top:1px solid rgba(255,255,255,.1);margin-top:84px}
.creds .wrap{display:grid;grid-template-columns:repeat(4,1fr);padding-top:0;padding-bottom:0;gap:0}
.creds .wrap>div{padding:28px 0 34px;border-left:1px solid rgba(255,255,255,.1);padding-left:28px}
.creds .wrap>div:first-child{border-left:0;padding-left:0}
.creds b{display:block;font:600 26px/1.2 Poppins;color:#fff;letter-spacing:-.02em}
.creds span{font-size:14px;color:#8EA0B8}

/* two-office panel */
.globe{position:relative;border-radius:22px;padding:28px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(8px);box-shadow:0 40px 80px -40px rgba(0,0,0,.7)}
.globe .gt{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:#93A3BA;margin-bottom:12px}
.globe .gt b{font:500 14px Poppins;color:#fff}
.live{display:inline-flex;align-items:center;gap:7px}.live i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 rgba(139,197,63,.6);animation:pulse 2.4s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(139,197,63,0)}100%{box-shadow:0 0 0 0 rgba(139,197,63,0)}}
.map{width:100%;height:auto;display:block}
.map .dots circle{fill:rgba(255,255,255,.16)}
.map .arc{fill:none;stroke:url(#arcg);stroke-width:2;stroke-linecap:round;stroke-dasharray:640;stroke-dashoffset:640;animation:draw 2.2s .9s var(--ease) forwards}
.map .arc2{fill:none;stroke:rgba(255,255,255,.5);stroke-width:1;stroke-dasharray:2 7;opacity:0;animation:fadein 1s 3s forwards}
.map .pin{opacity:0;animation:fadein .6s forwards}
.map .pin.a{animation-delay:.7s}.map .pin.b{animation-delay:2.9s}
.map .ring{fill:none;stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:ring 2.6s 3.2s infinite}
@keyframes draw{to{stroke-dashoffset:0}}@keyframes fadein{to{opacity:1}}
@keyframes ring{0%{transform:scale(.6);opacity:1}100%{transform:scale(2.6);opacity:0}}
.offs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:6px}
.off{border-radius:14px;padding:16px 18px;background:rgba(6,22,46,.55);border:1px solid rgba(255,255,255,.08);transition:border-color .3s,background .3s}
.off.cur{border-color:rgba(139,197,63,.5);background:rgba(139,197,63,.07)}
.off .c{font-size:12.5px;color:#93A3BA;display:flex;justify-content:space-between;gap:8px}
.off .t{font:500 30px/1.2 Poppins;color:#fff;letter-spacing:-.02em;margin:6px 0 2px;font-variant-numeric:tabular-nums}
.off .s{font-size:12.5px;display:flex;align-items:center;gap:6px;color:#B8C6D9}
.off .s i{width:6px;height:6px;border-radius:50%;background:#7C8BA0}.off .s.open i{background:var(--green)}

/* hero entrance */
.hx{opacity:0;transform:translateY(22px);animation:rise .9s var(--ease) forwards}
.hx.d1{animation-delay:.1s}.hx.d2{animation-delay:.22s}.hx.d3{animation-delay:.34s}.hx.d4{animation-delay:.46s}.hx.d5{animation-delay:.6s}
@keyframes rise{to{opacity:1;transform:none}}

/* logos marquee */
.clients{padding:46px 0 52px;border-bottom:1px solid var(--line2)}
.clients p{text-align:center;font-size:14px;color:var(--muted);margin-bottom:26px}
.marq{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.marq .tr{display:flex;gap:84px;width:max-content;animation:marq 38s linear infinite;align-items:center}
.marq:hover .tr{animation-play-state:paused}
.marq img{height:46px;width:auto;max-width:150px;object-fit:contain;filter:grayscale(1) contrast(.9);opacity:.55;transition:filter .35s,opacity .35s}
.marq img:hover{filter:none;opacity:1}
.marq .txt{font:600 19px Poppins;color:#9AA7B8;letter-spacing:-.01em;white-space:nowrap}
@keyframes marq{to{transform:translateX(-50%)}}

/* icons */
.ico{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;color:var(--blue);background:linear-gradient(#fff,#fff) padding-box,linear-gradient(140deg,rgba(0,102,204,.45),rgba(139,197,63,.55)) border-box;border:1px solid transparent;flex:none;transition:transform .4s var(--ease),color .3s}
.ico svg{width:24px;height:24px}
.dk .ico{background:linear-gradient(var(--navy2),var(--navy2)) padding-box,linear-gradient(140deg,rgba(47,134,224,.7),rgba(139,197,63,.7)) border-box;color:#9CCB5E}

/* service pillars */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.pillar{border:1px solid var(--line);border-radius:20px;padding:34px 30px 18px;background:#fff;display:flex;flex-direction:column}
.pillar.dk{background:var(--ink);border-color:var(--ink);color:#B8C6D9}
.pillar.dk h3{color:#fff}
.pillar .ph-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
.pillar .ph-h h3{font-size:24px;margin:0}
.pillar .ph-h span{font:500 13px Inter;color:var(--muted)}
.pillar.dk .ph-h span{color:#7F91AA}
.pillar>p{font-size:15.5px;color:var(--muted);margin:0 0 18px}
.pillar.dk>p{color:#93A3BA}
.srow{display:flex;gap:16px;align-items:center;padding:16px 0;border-top:1px solid var(--line2);color:var(--ink)}
.pillar.dk .srow{border-color:rgba(255,255,255,.08);color:#fff}
.srow .tx{flex:1;min-width:0}
.srow b{display:block;font:500 16.5px/1.35 Poppins;letter-spacing:-.01em}
.srow small{display:block;font-size:13.5px;color:var(--muted);margin-top:2px}
.pillar.dk .srow small{color:#8396AF}
.srow .go{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:var(--muted);transition:transform .35s var(--ease),background .3s,color .3s;flex:none}
.srow .go svg{width:16px;height:16px}
.srow:hover .go{background:var(--blue);color:#fff;transform:translateX(4px)}
.srow:hover .ico{transform:translateY(-2px) rotate(-4deg)}

/* service catalogue (services page) */
.cat{display:grid;grid-template-columns:repeat(3,1fr);gap:0;background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden}.cat.c4{grid-template-columns:repeat(4,1fr)}
.scard{background:#fff;box-shadow:1px 0 0 var(--line),0 1px 0 var(--line);padding:34px 30px 30px;display:flex;flex-direction:column;color:var(--body);transition:background .3s}
.scard:hover{background:#FAFCFE}
.scard h3{margin:22px 0 8px}.scard p{font-size:15.5px;margin:0 0 22px}
.scard .ft{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding-top:18px;border-top:1px solid var(--line2);font-size:14px}
.scard .pr{font:500 14px Poppins;color:var(--ink)}
.scard .go{color:var(--blue);display:inline-flex;align-items:center;gap:6px;font:500 14px Poppins}
.scard .go svg{width:15px;height:15px;transition:transform .3s var(--ease)}.scard:hover .go svg{transform:translateX(3px)}
.grp{font:500 14px Poppins;color:var(--muted);margin:56px 0 18px;display:flex;align-items:center;gap:14px}
.grp:first-child{margin-top:0}.grp+.pcards{margin-bottom:8px}.grp:after{content:"";flex:1;height:1px;background:var(--line)}

/* work */
.works{display:grid;grid-template-columns:repeat(6,1fr);gap:24px}
.work{grid-column:span 2;display:flex;flex-direction:column;border-radius:20px;overflow:hidden;background:#fff;border:1px solid var(--line);color:var(--body);transition:box-shadow .4s var(--ease),border-color .3s}
.work.big{grid-column:span 4;grid-row:span 2}
.work.wide{grid-column:span 3}
.work:hover{box-shadow:var(--sh);border-color:#CBD6E3}
.work .shot{position:relative;aspect-ratio:16/10;display:grid;place-items:center;padding:22px;overflow:hidden}
.work.big .shot{aspect-ratio:auto;flex:1;min-height:360px}
.work .shot img{width:100%;height:100%;object-fit:contain;transition:transform .7s var(--ease);filter:drop-shadow(0 18px 24px rgba(6,22,46,.25))}
.work:hover .shot img{transform:scale(1.04) translateY(-4px)}
.work .bd{padding:20px 24px 24px;border-top:1px solid var(--line2)}
.work .meta{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--muted);margin-bottom:6px}
.work h3{margin:0 0 6px;font-size:19px}
.work.big h3{font-size:24px}
.work .bd p{margin:0;font-size:15px}
.b1{background:linear-gradient(160deg,#E9F1FB,#D4E4F6)}.b2{background:linear-gradient(160deg,#FFF1E3,#F8DDC2)}.b3{background:linear-gradient(160deg,#EAF3F1,#D3E7E1)}
.b4{background:linear-gradient(160deg,#EEF3E4,#DCE8C8)}.b5{background:linear-gradient(160deg,#EEF0F4,#DCE1EA)}.b6{background:linear-gradient(160deg,#F2EEE6,#E3DBCB)}
.b7{background:linear-gradient(160deg,#0D2E4E,#0B4A7A)}.b8{background:linear-gradient(160deg,#0B3B3B,#0F766E)}
.mono{font:600 30px/1.1 Poppins;color:#fff;letter-spacing:-.02em;text-align:center;padding:20px}
.mono small{display:block;font:400 14px Inter;color:rgba(255,255,255,.7);margin-top:8px;letter-spacing:0}
.filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:34px}
.filters button{border:1px solid var(--line);background:#fff;padding:9px 16px;border-radius:8px;font:500 14px Inter;color:var(--ink);cursor:pointer;transition:.2s}
.filters button:hover{border-color:var(--ink)}.filters button.on{background:var(--ink);color:#fff;border-color:var(--ink)}

/* offices section */
.offices{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.office{border-radius:22px;border:1px solid var(--line);background:#fff;overflow:hidden}
.office .top{padding:30px 32px 24px;display:flex;justify-content:space-between;gap:20px;align-items:flex-start;background:linear-gradient(180deg,var(--mist),#fff)}
.office .top h3{font-size:22px;margin:4px 0 4px}
.office .top p{margin:0;font-size:14.5px;color:var(--muted)}
.office .flag{font-size:26px;line-height:1}
.office .clock{text-align:right;flex:none}
.office .clock b{display:block;font:500 28px/1.1 Poppins;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.office .clock span{font-size:12.5px;color:var(--muted);display:inline-flex;align-items:center;gap:6px}
.office .clock span i{width:6px;height:6px;border-radius:50%;background:#AAB6C6}.office .clock span.open i{background:var(--green)}
.office dl{margin:0;padding:6px 32px 26px;display:grid;grid-template-columns:110px 1fr;font-size:15px}
.office dt,.office dd{margin:0;padding:12px 0;border-top:1px solid var(--line2)}
.office dt{color:var(--muted)}.office dd{color:var(--ink)}

/* process */
.proc{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;counter-reset:s}
.proc:before{content:"";position:absolute;left:0;right:0;top:23px;height:1px;background:rgba(255,255,255,.14)}
.proc .bar{position:absolute;left:0;top:23px;height:1px;width:0;background:linear-gradient(90deg,#2F86E0,#8BC53F);transition:width 2s var(--ease)}
.proc.in .bar{width:100%}
.pstep{position:relative;padding-right:32px}
.pstep .n{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font:500 15px Poppins;color:#fff;background:var(--ink);border:1px solid rgba(255,255,255,.22);margin-bottom:26px;position:relative;transition:border-color .6s,background .6s}
.proc.in .pstep .n{border-color:#8BC53F}
.pstep h3{color:#fff;font-size:20px}.pstep p{font-size:15.5px;color:#9FB0C6;margin:0}
.darksec{background:var(--ink);color:#B8C6D9;position:relative;overflow:hidden}
.darksec h2{color:#fff}.darksec .intro p{color:#93A3BA}

/* product band */
.prod{display:grid;grid-template-columns:1fr 1fr;border-radius:24px;overflow:hidden;border:1px solid var(--line)}
.prod .txt{padding:56px}
.prod .vis{background:linear-gradient(150deg,#0B3B3B,#0F766E 70%,#2BA38E);position:relative;display:grid;place-items:center;padding:40px;overflow:hidden}
.prod .vis:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.12) 1px,transparent 1px);background-size:22px 22px}
.app{position:relative;width:100%;max-width:400px;background:#fff;border-radius:16px;box-shadow:0 30px 60px -20px rgba(0,0,0,.45);overflow:hidden;font-size:13px}
.app .ah{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line2);font:600 14px Poppins;color:#0B3B3B}
.app .ah span{font:500 11.5px Inter;color:#0F766E;background:#E1F4F0;padding:3px 9px;border-radius:99px}
.app .ar{display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--line2);color:var(--ink)}
.app .ar i{width:30px;height:30px;border-radius:8px;background:#E1F4F0;flex:none}
.app .ar div{flex:1}.app .ar small{display:block;color:var(--muted);font-size:12px}
.app .ar em{font-style:normal;font-size:11.5px;padding:3px 8px;border-radius:6px;background:#EEF7E2;color:var(--green-d)}
.app .ar em.w{background:#FFF1D6;color:#9A5A00}

/* cta */
.cta{position:relative;border-radius:28px;overflow:hidden;background:var(--ink);padding:80px 64px;display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center;isolation:isolate}
.cta:before{content:"";position:absolute;width:640px;height:640px;right:-160px;top:-260px;border-radius:50%;background:radial-gradient(circle,rgba(47,134,224,.55),transparent 65%);z-index:-1}
.cta:after{content:"";position:absolute;width:520px;height:520px;right:120px;bottom:-320px;border-radius:50%;background:radial-gradient(circle,rgba(139,197,63,.38),transparent 65%);z-index:-1}
.cta h2{color:#fff;margin:0 0 12px}.cta p{color:#AEBCD0;font-size:18px;margin:0}
.cta .acts{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}

/* page hero */
.phero{position:relative;background:var(--ink);color:#B8C6D9;padding:96px 0 84px;overflow:hidden;isolation:isolate}
.phero:before{content:"";position:absolute;width:760px;height:760px;right:-200px;top:-420px;border-radius:50%;background:radial-gradient(circle,rgba(30,127,134,.55),transparent 65%);z-index:-1}
.phero:after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:28px 28px;z-index:-1;mask-image:linear-gradient(90deg,transparent,#000)}
.phero h1{color:#fff;font-size:clamp(36px,4.6vw,58px);max-width:18ch}
.phero p{font-size:19px;max-width:640px;color:#BFCBDB;margin:0}
.crumb{font-size:13.5px;color:#8396AF;margin-bottom:22px;display:flex;gap:10px}.crumb a{color:#C7D3E3}.crumb a:hover{color:#fff}

/* about */
.story{display:grid;grid-template-columns:1.1fr .9fr;gap:80px}
.story p{font-size:17.5px}
.tl{position:relative;padding-left:34px}
.tl:before{content:"";position:absolute;left:7px;top:8px;bottom:8px;width:1px;background:var(--line)}
.tl div{position:relative;padding-bottom:30px}
.tl div:before{content:"";position:absolute;left:-34px;top:6px;width:15px;height:15px;border-radius:50%;background:#fff;border:2px solid var(--blue)}
.tl div.g:before{border-color:var(--gold);background:#FBF4E2}
.tl b{display:block;font:600 15px Poppins;color:var(--blue)}.tl div.g b{color:#9C7A26}
.tl span{color:var(--ink)}
.vals{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden}
.vals div{background:#fff;padding:32px 28px}.vals h3{margin:20px 0 6px}.vals p{margin:0;font-size:15.5px}

/* service detail */
.svc{display:grid;grid-template-columns:1.55fr 1fr;gap:72px;align-items:start}
.checks{list-style:none;padding:0;margin:0 0 10px;display:grid;gap:2px}
.checks li{display:flex;gap:16px;padding:14px 0;border-bottom:1px solid var(--line2);color:var(--ink)}
.checks li svg{flex:none;width:22px;height:22px;color:var(--green-d);margin-top:2px}
.side{position:sticky;top:110px;border:1px solid var(--line);border-radius:20px;padding:32px;box-shadow:var(--sh);background:#fff}
.side .pr{font:600 30px/1.2 Poppins;color:var(--ink);letter-spacing:-.02em;margin:10px 0 4px}
.side .tag{font:500 13px Inter;color:var(--muted)}
.faq details{border-bottom:1px solid var(--line);padding:20px 0}
.faq summary{cursor:pointer;font:500 17px Poppins;color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:20px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";font:300 26px/1 Inter;color:var(--muted);transition:transform .3s var(--ease)}
.faq details[open] summary:after{transform:rotate(45deg)}
.faq details p{margin:12px 0 0}

/* forms */
.formcard{border:1px solid var(--line);border-radius:22px;padding:40px;background:#fff;box-shadow:var(--sh)}
.form{display:grid;gap:18px}.form .two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form h3{margin:8px 0 0;font-size:18px}
label{display:grid;gap:8px;font:500 14px Inter;color:var(--ink)}
input,select,textarea{font:400 15.5px Inter;height:50px;padding:0 15px;border:1px solid var(--line);border-radius:10px;background:#FBFCFE;color:var(--ink);width:100%;transition:border-color .2s,box-shadow .2s,background .2s}
textarea{height:auto;min-height:140px;padding:13px 15px;resize:vertical}
input:hover,select:hover,textarea:hover{border-color:#BCC8D6}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--blue);background:#fff;box-shadow:0 0 0 4px rgba(0,102,204,.12)}
.note{font-size:13.5px;color:var(--muted);margin:0}
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.seg label{display:block;cursor:pointer}
.seg input{position:absolute;opacity:0;width:0;height:0}
.seg span{display:block;border:1px solid var(--line);border-radius:12px;padding:14px 16px;font:500 14.5px Inter;transition:.2s;background:#FBFCFE}
.seg span small{display:block;font:400 12.5px Inter;color:var(--muted);margin-top:2px}
.seg input:checked+span{border-color:var(--blue);background:#F0F6FD;box-shadow:0 0 0 3px rgba(0,102,204,.1)}
.seg input:focus-visible+span{outline:2px solid var(--blue2);outline-offset:2px}

/* blog */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.post{border-top:2px solid var(--ink);padding-top:22px;color:var(--body)}
.post .meta{font-size:13px;color:var(--muted)}.post h3{margin:10px 0 0;transition:color .2s}.post:hover h3{color:var(--blue)}

/* footer */
footer{background:var(--ink);color:#8396AF;font-size:14.5px;padding:96px 0 0;position:relative;overflow:hidden}
footer h4{color:#fff;font:500 15px Poppins;margin-bottom:18px}
footer a{color:#B8C6D9;transition:color .2s}footer a:hover{color:#fff}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.6fr;gap:48px}
footer ul{list-style:none;padding:0;margin:0}footer li{padding:5px 0}
.ent{border:1px solid rgba(255,255,255,.09);border-radius:14px;padding:18px;margin-bottom:12px;line-height:1.6}
.ent b{color:#fff;display:block;font:500 15px Poppins;margin-bottom:4px}
.fbot{border-top:1px solid rgba(255,255,255,.08);margin-top:72px;padding:26px 0;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:13px}
.fbot a{margin-left:18px}.fbot a:first-child{margin-left:0}
.soc{display:flex;gap:10px;margin-top:22px}
.soc a{width:40px;height:40px;border-radius:10px;border:1px solid rgba(255,255,255,.12);display:grid;place-items:center}
.soc a:hover{border-color:rgba(255,255,255,.4)}.soc svg{width:17px;height:17px}
.fbig{font:600 clamp(38px,12vw,170px)/.8 Poppins;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.07);white-space:nowrap;margin-top:40px;user-select:none;text-align:center}

.wa{position:fixed;right:22px;bottom:22px;width:58px;height:58px;border-radius:50%;background:#25D366;color:#fff;display:grid;place-items:center;box-shadow:0 14px 30px -10px rgba(37,211,102,.7);z-index:60;transition:transform .3s var(--ease)}
.wa:hover{transform:scale(1.06)}.wa svg{width:28px;height:28px}

/* scroll reveal */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .rv.in{opacity:1;transform:none}
.rv.s2{transition-delay:.08s}.rv.s3{transition-delay:.16s}.rv.s4{transition-delay:.24s}




/* footer 2 */
/* ===== FOOTER 2: CTA-led light ===== */
.f2{background:var(--mist);padding:0 0 0;color:var(--body);font-size:14.5px}
.f2cta{background:var(--ink);position:relative;overflow:hidden;isolation:isolate;padding:70px 0}
.f2cta:before{content:"";position:absolute;width:700px;height:700px;right:-200px;top:-350px;border-radius:50%;background:radial-gradient(circle,rgba(47,134,224,.5),transparent 65%);z-index:-1}
.f2cta .wrap{display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap}
.f2cta h2{color:#fff;margin:0 0 8px}.f2cta p{color:#AEBCD0;margin:0;font-size:17px}
.f2 .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-top:70px}
.f2 h4{font:600 15px Poppins;color:var(--ink);margin:0 0 16px}.f2 ul{list-style:none;padding:0;margin:0}.f2 li{padding:5px 0}.f2 a{color:var(--body)}.f2 a:hover{color:var(--blue)}.f2 .f2cta .btn-ghost{color:#fff}.f2 .f2cta .btn-g{color:var(--ink)}.f2 .news .btn{color:#fff}
.f2 .news{display:flex;gap:8px;margin-top:16px}.f2 .news input{height:46px}.f2 .news .btn{height:46px}
.f2 .bot{border-top:1px solid var(--line);margin-top:60px;padding:24px 0;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.f2 .ents{display:grid;gap:10px;margin-top:18px}
.f2 .ents div{font-size:13.5px;line-height:1.55}.f2 .ents b{color:var(--ink);font:500 14px Poppins;display:block}

.f2 .f2cta .btn-ghost{color:#fff}.f2 .f2cta .btn-g{color:var(--ink)}.f2 .news .btn{color:#fff}.f2 .bot a{margin-left:16px}.f2 .bot a:first-child{margin-left:0}.f2 a.logo{color:var(--ink)}.f2 .soc a{border-color:var(--line);color:var(--ink)}.f2 .soc a:hover{border-color:var(--ink)}
@media (max-width:980px){.f2 .cols{grid-template-columns:1fr 1fr}}@media (max-width:640px){.f2 .cols{grid-template-columns:1fr}.f2 .news{flex-direction:column}.f2cta{padding:54px 0}}
/* v3: pictures, mega menu, audit, insights, mobile bar */
.srow .thumb{width:52px;height:52px;border-radius:12px;object-fit:cover;flex:none;transition:transform .4s var(--ease)}
.srow:hover .thumb{transform:scale(1.06)}
.pcards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.pcard{border-radius:20px;overflow:hidden;background:#fff;border:1px solid var(--line);color:var(--body);display:flex;flex-direction:column;transition:box-shadow .4s var(--ease),transform .4s var(--ease)}
.pcard:hover{box-shadow:var(--sh);transform:translateY(-4px)}
.pcard .pic{aspect-ratio:4/3;overflow:hidden;background:#0A4A97}
.pcard .pic img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.pcard:hover .pic img{transform:scale(1.06)}
.pcard .bd{padding:24px 26px 26px;display:flex;flex-direction:column;flex:1}
.pcard h3{margin:0 0 8px}.pcard p{font-size:15.5px;margin:0 0 20px}
.pcard .ft{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding-top:16px;border-top:1px solid var(--line2);font-size:14px}
.pcard .pr{font:500 14px Poppins;color:var(--ink)}.pcard .go{color:var(--blue);display:inline-flex;align-items:center;gap:6px;font:500 14px Poppins}
.pcard .go svg{width:15px;height:15px;transition:transform .3s var(--ease)}.pcard:hover .go svg{transform:translateX(3px)}
.pcards.c4{grid-template-columns:repeat(4,1fr)}.pcards.c4 .pcard .bd{padding:20px 22px 22px}.pcards.c4 h3{font-size:17.5px}
nav.main .dd{position:static}
nav.main .dd>a{display:inline-flex;align-items:center;gap:5px}nav.main .dd>a svg{width:13px;height:13px;transition:transform .3s}
nav.main .dd:hover>a svg,nav.main .dd:focus-within>a svg{transform:rotate(180deg)}
.mega{position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--line2);box-shadow:0 30px 60px -30px rgba(6,22,46,.35);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .25s var(--ease),transform .25s var(--ease),visibility .25s}
nav.main .dd:hover .mega,nav.main .dd:focus-within .mega{opacity:1;visibility:visible;transform:none}
.mega .in{max-width:1240px;margin:0 auto;padding:28px 28px 32px;display:grid;grid-template-columns:repeat(3,1fr) 1.1fr;gap:28px;align-items:start}
.mega h5{font:600 13.5px Poppins;color:var(--muted);margin:0 0 10px}
.mega a.mi{display:flex;gap:12px;align-items:center;padding:8px 10px;margin:0 -10px;border-radius:10px;color:var(--ink)}
.mega a:after{display:none}
.mega a.mi:hover{background:var(--mist)}
.mega a.mi img{width:44px;height:44px;border-radius:9px;object-fit:cover;flex:none}
.mega a.mi b{display:block;font:500 15px Poppins}.mega a.mi small{display:block;font-size:12.5px;color:var(--muted)}
.mega .feat{border-radius:16px;background:var(--ink);color:#B8C6D9;padding:24px;display:flex;flex-direction:column;gap:10px;min-height:100%}
.mega .feat b{color:#fff;font:600 18px Poppins}.mega .feat p{font-size:14px;margin:0}
.audit{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;border-radius:24px;padding:56px;background:linear-gradient(135deg,#F0F6FD,#EEF7E2);border:1px solid var(--line)}
.audit h2{margin-bottom:10px}.audit p{font-size:17px;margin:0}
.audit form{display:flex;gap:10px;background:#fff;padding:8px;border-radius:14px;border:1px solid var(--line);box-shadow:var(--sh)}
.audit form input{border:0;background:transparent;height:52px}.audit form input:focus{box-shadow:none}
.audit ul{list-style:none;padding:0;margin:18px 0 0;display:flex;gap:18px;flex-wrap:wrap;font-size:14px;color:var(--muted)}
.audit li{display:flex;align-items:center;gap:6px}.audit li svg{width:16px;height:16px;color:var(--green-d)}
.posts.pics .post{border-top:0;padding-top:0}
.posts.pics .post img{width:100%;aspect-ratio:1200/630;object-fit:cover;border-radius:14px;margin-bottom:16px;transition:transform .6s var(--ease)}
.posts.pics .post:hover img{transform:translateY(-4px)}
.phsvc .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.phsvc .art{border-radius:22px;overflow:hidden;box-shadow:0 40px 70px -35px rgba(0,0,0,.7);border:1px solid rgba(255,255,255,.12)}
.phsvc .art img{width:100%;aspect-ratio:1;object-fit:cover}
.storyimg{border-radius:20px;overflow:hidden;margin-top:34px}.storyimg img{width:100%;aspect-ratio:16/10;object-fit:cover}
.mbar{display:none}
@media (max-width:1140px){.mega{display:none}}
@media (max-width:980px){.audit,.phsvc .wrap{grid-template-columns:1fr}.pcards,.pcards.c4{grid-template-columns:1fr 1fr}.phsvc .art{max-width:360px}}
@media (max-width:640px){.pcards,.pcards.c4{grid-template-columns:1fr}.audit{padding:30px 20px}.audit form{flex-direction:column}
 .mbar{display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:70;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
 .mbar a{height:46px;border-radius:10px;display:flex;align-items:center;justify-content:center;gap:7px;font:500 14px Poppins;color:var(--ink);border:1px solid var(--line)}
 .mbar a svg{width:17px;height:17px}.mbar a.q{background:var(--blue);color:#fff;border-color:var(--blue)}.mbar a.w svg{color:#25D366}
 .wa{display:none}body{padding-bottom:70px}}

html[data-region=us] .wa{display:none}
/* ===== v4: ready-made websites, pricing, US pages ===== */
.usbar{display:none;background:#EAF2FC;border-bottom:1px solid #D3E3F6;font-size:14px;color:var(--ink)}
.usbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:10px;padding-bottom:10px;flex-wrap:wrap}
.usbar a{font-weight:600}
html[data-region=us] .usbar{display:block}html[data-region=us] body.on-us .usbar{display:none}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:30px}
.chips button{border:1px solid var(--line);background:#fff;padding:9px 16px;border-radius:99px;font:500 14px Inter;color:var(--ink);cursor:pointer;transition:.2s}
.chips a{border:1px solid var(--line);background:#fff;padding:9px 16px;border-radius:99px;font:500 14px Inter;color:var(--ink)}.chips a:hover{border-color:var(--ink)}.chips button:hover{border-color:var(--ink)}.chips button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.sites{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.site{display:flex;flex-direction:column;border-radius:20px;border:1px solid var(--line);background:#fff;overflow:hidden;color:var(--body);transition:box-shadow .4s var(--ease),transform .4s var(--ease)}
.site:hover{box-shadow:var(--sh);transform:translateY(-4px)}
.site .pv{background:var(--mist);padding:22px 22px 0;overflow:hidden}
.site .pv .mk{transform:translateY(6px);transition:transform .6s var(--ease)}.site:hover .pv .mk{transform:translateY(-2px)}
.site .bd{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.site .top{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;color:var(--muted);margin-bottom:6px}
.badge{font:500 12px Inter;padding:3px 9px;border-radius:99px;background:#EAF2FC;color:var(--blue);white-space:nowrap}
.badge.g{background:#EEF7E2;color:var(--green-d)}.badge.ex{background:#FFF1D6;color:#9A5A00}
.site h3{margin:0 0 6px;font-size:20px}.site p{font-size:15px;margin:0 0 16px}
.site .ft{margin-top:auto;display:flex;justify-content:space-between;align-items:flex-end;gap:10px;padding-top:14px;border-top:1px solid var(--line2)}
.site .price b{display:block;font:600 18px Poppins;color:var(--ink);letter-spacing:-.01em}.site .price small{font-size:12.5px;color:var(--muted)}
.site .go{color:var(--blue);font:500 14px Poppins;display:inline-flex;gap:6px;align-items:center}.site .go svg{width:15px;height:15px}
/* mock website preview */
.mk{font-size:8px;border-radius:1.2em 1.2em 0 0;overflow:hidden;background:#fff;box-shadow:0 1.6em 3em -1.6em rgba(6,22,46,.45);font-family:Inter,sans-serif;line-height:1.3}
.mk .bb{height:2.4em;background:#EEF2F7;display:flex;align-items:center;gap:.5em;padding:0 1em}.mk .bb i{width:.8em;height:.8em;border-radius:50%;background:#CBD4E0}
.mk .bb span{margin-left:.8em;background:#fff;border-radius:.5em;padding:.2em 1em;font-size:1em;color:#8392A6}
.mk .nv{display:flex;justify-content:space-between;align-items:center;padding:1.1em 1.8em;font-size:1.1em}
.mk .nv b{font:700 1.35em Poppins;letter-spacing:-.02em}.mk .nv span{display:flex;gap:1.4em;color:#56657A}
.mk .hh{min-height:15.5em;padding:3em 1.8em 3.4em;color:#fff;position:relative;overflow:hidden}
.mk .hh:after{content:"";position:absolute;right:-3em;top:-3em;width:16em;height:16em;border-radius:50%;background:rgba(255,255,255,.08)}
.mk .hh h4{font:700 2.6em/1.08 Poppins;color:#fff;margin:0 0 .5em;max-width:11em;letter-spacing:-.02em}
.mk .hh .l{height:.7em;width:60%;background:rgba(255,255,255,.45);border-radius:.4em;margin:.5em 0}.mk .hh .l.s{width:42%}
.mk .hh .b{display:inline-block;margin-top:1.2em;padding:.8em 1.6em;border-radius:.6em;font:600 1.1em Poppins;color:#111}
.mk .gr{display:grid;grid-template-columns:repeat(3,1fr);gap:1em;padding:1.6em 1.8em 2em}
.mk .gr div{height:6.5em;border-radius:.8em;background:#EEF2F7}
.mk.big{font-size:13px}
/* site detail */
.sd{display:grid;grid-template-columns:1.45fr 1fr;gap:56px;align-items:start}
.sd .gallery{background:var(--mist);border-radius:22px;padding:34px 34px 0;overflow:hidden;border:1px solid var(--line)}
.sd h2{font-size:28px;margin-top:48px}
.pagelist{display:flex;flex-wrap:wrap;gap:8px}.pagelist span{padding:7px 13px;border-radius:8px;background:var(--mist);border:1px solid var(--line);font-size:14px;color:var(--ink)}
.addons{display:grid;gap:10px}
.addon{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border:1px solid var(--line);border-radius:14px;cursor:pointer;transition:border-color .2s,background .2s;background:#fff}
.addon:hover{border-color:#BCC8D6}
.addon input{width:20px;height:20px;margin-top:2px;accent-color:var(--blue);flex:none}
.addon .tx{flex:1}.addon b{display:block;font:500 15.5px Poppins;color:var(--ink)}.addon small{display:block;font-size:13.5px;color:var(--muted);margin-top:2px}
.addon .ap{font:500 14px Poppins;color:var(--ink);white-space:nowrap;text-align:right}.addon .ap small{font:400 12px Inter;text-align:right}
.addon:has(input:checked){border-color:var(--blue);background:#F4F8FE}
.sum{position:sticky;top:110px;border:1px solid var(--line);border-radius:20px;padding:30px;background:#fff;box-shadow:var(--sh)}
.sum h3{margin:6px 0 4px;font-size:24px}
.sum .row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--line2);font-size:14.5px;color:var(--body)}
.sum .row b{color:var(--ink);font-weight:500;text-align:right}
.sum .tot{display:flex;justify-content:space-between;align-items:baseline;padding:16px 0 4px;border-top:2px solid var(--ink);margin-top:6px}
.sum .tot span{font:500 15px Poppins;color:var(--ink)}.sum .tot b{font:600 28px Poppins;color:var(--ink);letter-spacing:-.02em}
.sum .note{margin-top:6px}
.sum .sel{font-size:13.5px;color:var(--muted);margin:2px 0 6px}
/* plans */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
.plan{border:1px solid var(--line);border-radius:22px;padding:32px 30px;background:#fff;display:flex;flex-direction:column;position:relative}
.plan.pop{background:var(--ink);border-color:var(--ink);color:#B8C6D9}
.plan.pop h3,.plan.pop .amt b{color:#fff}
.plan .poptag{position:absolute;top:-13px;left:30px;background:var(--green);color:var(--ink);font:600 12.5px Poppins;padding:5px 12px;border-radius:99px}
.plan h3{font-size:22px;margin:0 0 4px}.plan .for{font-size:14.5px;color:var(--muted);margin:0 0 22px}.plan.pop .for{color:#93A3BA}
.plan .amt b{font:600 40px/1 Poppins;color:var(--ink);letter-spacing:-.03em}.plan .amt>span{font-size:15px}
.plan .setup{font-size:14px;margin:8px 0 22px}
.plan ul{list-style:none;padding:0;margin:0 0 26px;display:grid;gap:10px;font-size:15px}
.plan li{display:flex;gap:10px}.plan li svg{width:18px;height:18px;flex:none;color:var(--green-d);margin-top:3px}.plan.pop li svg{color:var(--green)}
.plan .btn{margin-top:auto}
.terms{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden;margin-top:28px}
.terms div{background:#fff;padding:26px 26px}.terms b{display:block;font:600 16px Poppins;color:var(--ink);margin-bottom:6px}.terms p{margin:0;font-size:15px}
.extras{display:grid;grid-template-columns:1fr 1fr;gap:10px 40px;font-size:15px}
.extras div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line2)}.extras b{font-weight:500;color:var(--ink);white-space:nowrap}
.samplenote{display:inline-flex;gap:8px;align-items:center;font-size:13px;color:#9A5A00;background:#FFF1D6;padding:6px 12px;border-radius:8px;margin-bottom:22px}
/* how it works (ready-made) */
.how{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px}
.how div{padding:26px 0 0;border-top:2px solid var(--ink)}
.how .n{font:600 14px Poppins;color:var(--blue)}.how h3{margin:8px 0 6px}.how p{margin:0;font-size:15.5px}
.bespoke{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;border:1px dashed #BCC8D6;border-radius:18px;padding:26px 30px;margin-top:34px;background:#fff}
.bespoke b{font:600 18px Poppins;color:var(--ink);display:block}.bespoke p{margin:4px 0 0;font-size:15px}
/* audiences */
.auds{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.aud{border-radius:20px;overflow:hidden;position:relative;min-height:380px;display:flex;flex-direction:column;justify-content:flex-end;color:#D5DEEA;isolation:isolate;transition:transform .4s var(--ease)}
.aud:hover{transform:translateY(-4px)}
.aud img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1s var(--ease)}.aud:hover img{transform:scale(1.05)}
.aud:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,22,46,.05) 20%,rgba(6,22,46,.92));z-index:-1}
.aud .tx{padding:26px}.aud h3{color:#fff;font-size:22px;margin:0 0 6px}.aud p{margin:0 0 14px;font-size:15px}
.aud .go{color:#fff;font:500 14.5px Poppins;display:inline-flex;gap:8px;align-items:center}.aud .go svg{width:16px;height:16px}
.team2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.person{display:flex;gap:22px;align-items:center;border:1px solid var(--line);border-radius:20px;padding:24px;background:#fff}
.person .ph2{width:110px;height:110px;border-radius:16px;flex:none;background:var(--mist);border:1px dashed #BCC8D6;display:grid;place-items:center;text-align:center;font-size:12px;color:var(--muted);padding:8px;overflow:hidden}
.person .ph2 img{width:100%;height:100%;object-fit:cover}
.person h3{margin:0 0 2px}.person .role{font-size:14px;color:var(--blue);margin-bottom:8px;display:block}.person p{margin:0;font-size:15px}
.audhero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.audhero .art{border-radius:22px;overflow:hidden;box-shadow:0 40px 70px -35px rgba(0,0,0,.7)}.audhero .art img{width:100%;aspect-ratio:4/3.4;object-fit:cover}
.pts{display:grid;grid-template-columns:1fr 1fr;gap:18px 40px}
.pts div{display:flex;gap:14px}.pts svg{width:24px;height:24px;color:var(--green-d);flex:none;margin-top:2px}.pts b{display:block;font:500 17px Poppins;color:var(--ink);margin-bottom:2px}.pts p{margin:0;font-size:15px}
@media (max-width:980px){.sites,.plans,.auds{grid-template-columns:1fr 1fr}.sd,.audhero .wrap{grid-template-columns:1fr}.sum{position:static}.terms{grid-template-columns:1fr}.team2{grid-template-columns:1fr}.how{grid-template-columns:1fr}}
@media (max-width:640px){.sites,.plans,.auds,.extras,.pts{grid-template-columns:1fr}.sd .gallery{padding:18px 18px 0}.mk.big{font-size:8px}.person{flex-direction:column;align-items:flex-start}.plan{padding:28px 22px}}
@media (max-width:1140px){nav.main,.hacts .btn-o{display:none}.burger{display:grid;place-items:center}
 .mnav.open{display:grid;position:absolute;top:80px;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);padding:12px 28px 24px;gap:2px;box-shadow:var(--sh)}
 .mnav a{padding:13px 4px;color:var(--ink);font-weight:500;border-bottom:1px solid var(--line2)}.mnav a.on{color:var(--blue)}
 .mnav .btn{border:0;margin-top:12px;color:#fff}}
@media (max-width:980px){
 .hero .wrap,.svc,.story,.prod,.cta,.intro.split{grid-template-columns:1fr}
 .hero .wrap{padding-top:80px;gap:48px}.creds .wrap{grid-template-columns:1fr 1fr}.creds .wrap>div:nth-child(3){border-left:0;padding-left:0}
 .pillars,.cat,.cat.c4,.posts{grid-template-columns:1fr 1fr}.pillars .pillar:last-child{grid-column:span 2}
 .works{grid-template-columns:repeat(2,1fr)}.work,.work.wide{grid-column:span 1}.work.big{grid-column:span 2;grid-row:auto}.work.big .shot{min-height:0;aspect-ratio:16/10}
 .offices,.fgrid{grid-template-columns:1fr 1fr}.vals{grid-template-columns:1fr 1fr}
 .proc{grid-template-columns:1fr 1fr;row-gap:40px}.proc:before,.proc .bar{display:none}
 .side{position:static}.cta .acts{justify-content:flex-start}.sec{padding:96px 0}}
@media (max-width:640px){
 .wrap{padding:0 20px}.sec{padding:76px 0}
 .pillars,.cat,.cat.c4,.posts,.works,.offices,.fgrid,.vals,.proc,.form .two,.seg{grid-template-columns:1fr}
 .pillars .pillar:last-child,.work.big{grid-column:auto}
 .offs{grid-template-columns:1fr 1fr}.off{padding:12px}.off .t{font-size:22px}.globe{padding:18px}
 .creds .wrap{grid-template-columns:1fr 1fr}.creds .wrap>div{padding:20px 0 22px 16px}.creds .wrap>div:nth-child(odd){padding-left:0;border-left:0}.creds b{font-size:20px}.creds{margin-top:44px}.creds span{line-height:1.45;display:block}
 .util .l .hide{display:none}.hacts .btn-p{display:none}
 .cta{padding:48px 26px}.prod .txt{padding:36px 26px}.formcard{padding:26px 20px}
 .office .top{flex-direction:column}.office .clock{text-align:left}.office dl{grid-template-columns:96px 1fr;padding:6px 22px 20px}.office .top{padding:24px 22px 18px}
 .fbot a{margin-left:12px}.hero .acts .btn{flex:1}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.hx,.rv{opacity:1!important;transform:none!important}.map .arc{stroke-dashoffset:0}.map .arc2,.map .pin{opacity:1}}

/* ===================== Design library additions (engine) ===================== */
.blk-error{margin:20px auto;max-width:1240px;padding:14px 18px;border:1px dashed #E0A800;background:#FFF8E1;color:#6B5200;border-radius:10px;font-size:14px}
.sec.sp-compact{padding:72px 0}.sec.sp-flush{padding-bottom:0}
.darksec .intro p,.darksec p{color:#AEBCD0}.darksec h2,.darksec h3{color:#fff}
.wrap.narrow{max-width:820px}
.intro-r{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap}.intro-r p{margin:0}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.prose{font-size:17px}.prose h2{font-size:clamp(24px,2.6vw,32px);margin-top:1.4em}.prose h3{margin-top:1.3em}.prose img{border-radius:14px;margin:1.2em 0}
.prose ul,.prose ol{padding-left:1.2em}.prose li{margin:.3em 0}.prose blockquote{margin:1.4em 0;padding:4px 0 4px 20px;border-left:3px solid var(--green);font-size:19px;color:var(--ink)}
.prose a{text-decoration:underline;text-underline-offset:3px}.prose table{width:100%;border-collapse:collapse}.prose td,.prose th{border-bottom:1px solid var(--line);padding:10px;text-align:left}
/* columns choice */
.vals.cols-2,.pcards.cols-2,.pts.cols-2,.quotes.cols-2,.gal.cols-2{grid-template-columns:repeat(2,1fr)}
.vals.cols-3,.pcards.cols-3,.pts.cols-3,.quotes.cols-3,.gal.cols-3{grid-template-columns:repeat(3,1fr)}
.vals.cols-4,.pcards.cols-4,.pts.cols-4,.quotes.cols-4,.gal.cols-4{grid-template-columns:repeat(4,1fr)}
/* chips as links, country switch as links */
.chips a{border:1px solid var(--line);background:#fff;padding:9px 16px;border-radius:99px;font:500 14px Inter,sans-serif;color:var(--ink);transition:border-color .2s}
.chips a:hover,.chips a.on{border-color:var(--ink)}.chips a.on{background:var(--ink);color:#fff}
.reg a{color:#B7C5D8;font:500 12.5px Inter,sans-serif;padding:5px 12px;border-radius:6px;transition:.2s}.reg a.on{background:#fff;color:var(--ink)}.reg a:hover{color:#fff}.reg a.on:hover{color:var(--ink)}
.mnav .reg{margin-top:12px;background:var(--ink)}.mnav a.sub{padding-left:28px;font-size:15px}
/* small drop-down */
.dd.sm{position:relative}.dd .drop{position:absolute;top:100%;left:0;min-width:220px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh);padding:8px;display:none;z-index:60}
.dd.sm:hover .drop,.dd.sm:focus-within .drop{display:grid}.dd .drop a{padding:9px 12px;border-radius:8px;color:var(--ink)}.dd .drop a:hover{background:var(--mist)}
/* header looks */
header.hdr.sticky{position:sticky;top:0;z-index:50}
.hdr-centered .wrap{flex-wrap:wrap;justify-content:center;row-gap:6px}.hdr-centered .logo{flex:1 1 100%;justify-content:center;display:flex}
.hdr-centered nav.main{order:3;flex:1 1 100%;justify-content:center}.hdr-centered .hacts{position:absolute;right:28px;top:18px}
.hdr-dark,header.hdr.hdr-dark{background:var(--ink);border-bottom-color:rgba(255,255,255,.08)}.hdr-dark nav.main a{color:#C9D5E6}.hdr-dark nav.main a:hover,.hdr-dark nav.main a.on{color:#fff}
.hdr-dark .logo b{color:#fff}.hdr-dark .logo small{color:#93A3BA}.hdr-dark .burger{color:#fff}
.hacts .reg{border-color:var(--line)}.hacts .reg a{color:var(--muted)}.hacts .reg a.on{background:var(--ink);color:#fff}
.logo img{height:44px;width:auto}
/* hero looks */
.hero.light{background:var(--mist);color:var(--body)}.hero.light h1{color:var(--ink)}.hero.light .lead{color:var(--body)}.hero.light .aur,.hero.light .grid-bg{opacity:.35}
.hero.light .creds{background:#fff;border-top:1px solid var(--line)}.hero.light .creds b{color:var(--ink)}
.hero-pic .art img{border-radius:22px;box-shadow:0 30px 60px -30px rgba(0,0,0,.6);width:100%;object-fit:cover;aspect-ratio:5/4}
.hero-center>.wrap{grid-template-columns:1fr!important;text-align:center;justify-items:center}.hero-center .lead{margin-left:auto;margin-right:auto}.hero-center .acts{justify-content:center}.hero-center .award{margin-left:auto;margin-right:auto}
.hero-photo{background:linear-gradient(90deg,rgba(6,22,46,.92) 0%,rgba(6,22,46,.6) 55%,rgba(6,22,46,.2)),var(--hero-img,none) center/cover no-repeat,var(--ink)}
.hero-photo>.wrap{grid-template-columns:minmax(0,680px)!important}
.hero-slides{position:relative;min-height:600px;display:flex;flex-direction:column}
.hero-slides .slide{position:absolute;inset:0;display:flex;align-items:center;opacity:0;transition:opacity .9s var(--ease);background:linear-gradient(90deg,rgba(6,22,46,.9),rgba(6,22,46,.35)),var(--hero-img,none) center/cover no-repeat,var(--ink);visibility:hidden}
.hero-slides .slide.on{opacity:1;visibility:visible}.hero-slides .slide .wrap{display:block;width:100%}.hero-slides .h1{font-size:clamp(36px,5vw,62px);line-height:1.05;color:#fff;max-width:720px}
.hero-slides .lead{max-width:600px}.dots-nav{position:absolute;bottom:110px;left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:3}
.dots-nav button{width:10px;height:10px;border-radius:50%;border:0;background:rgba(255,255,255,.4);cursor:pointer;padding:0}.dots-nav button[aria-current]{background:#fff;width:28px;border-radius:6px}
.hero-slides .creds{margin-top:auto;position:relative;z-index:2}
.globe .gnote{margin:16px 2px 0;font-size:14px;color:#AEBCD0}
.phero .acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
/* picture + text */
.feat{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}.feat.left>.art{order:-1}
.feat .art img{border-radius:22px;width:100%;object-fit:cover;aspect-ratio:4/3}.feat .btn{margin-top:10px}.feat .checks{margin-top:18px}
.prod .vis>img{border-radius:16px;width:100%}
/* logos grid */
.logos-t{text-align:center;color:var(--muted);margin-bottom:28px}
.logogrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.logogrid .lg{background:#fff;display:grid;place-items:center;padding:28px 20px;min-height:110px;color:var(--ink);font:600 15px Poppins,sans-serif;text-align:center}.logogrid img{max-height:48px;width:auto;filter:grayscale(1);opacity:.75;transition:.3s}.logogrid .lg:hover img{filter:none;opacity:1}
.marq .dup{display:contents}
/* testimonials */
.quotes{display:grid;gap:24px}.quote{margin:0;background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px;display:flex;flex-direction:column;gap:20px}
.mist .quote{border-color:transparent}.quote blockquote{margin:0;font-size:17px;color:var(--ink);line-height:1.6}.quote blockquote::before{content:"\201C";display:block;font:600 44px/0.6 Poppins;color:var(--green);margin-bottom:12px}
.quote figcaption,.bigquote figcaption{display:flex;gap:12px;align-items:center;margin-top:auto;font-size:14px;color:var(--muted)}.quote figcaption b,.bigquote figcaption b{display:block;color:var(--ink);font:500 15px Poppins}
.quote figcaption img,.bigquote figcaption img{width:44px;height:44px;border-radius:50%;object-fit:cover}
.bigquote{margin:0;text-align:center}.bigquote blockquote{margin:0 0 28px;font:500 clamp(22px,2.6vw,30px)/1.4 Poppins,sans-serif;color:var(--ink);letter-spacing:-.01em}.bigquote figcaption{justify-content:center}
.darksec .quote{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.1)}.darksec .quote blockquote,.darksec .bigquote blockquote{color:#fff}
/* figures */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:24px;text-align:center}.stats b{display:block;font:600 clamp(34px,4vw,52px)/1 Poppins;color:var(--ink);letter-spacing:-.03em}.stats span{color:var(--muted);font-size:15px}
.darksec .stats b{color:#fff}
/* call to action band */
.ctaband{background:var(--ink);border-radius:24px;padding:56px;display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap;position:relative;overflow:hidden}
.ctaband::after{content:"";position:absolute;inset:auto -10% -60% auto;width:420px;height:420px;border-radius:50%;background:var(--brand);opacity:.25;filter:blur(60px)}
.ctaband>*{position:relative;z-index:1}.ctaband h2{color:#fff;margin:0 0 8px}.ctaband p{color:#AEBCD0;margin:0;max-width:560px}.ctaband .acts{display:flex;gap:12px;flex-wrap:wrap}
.darksec .ctaband{background:rgba(255,255,255,.06)}
/* gallery */
.gal{display:grid;gap:16px}.gal figure{margin:0}.gal img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:16px}.gal figcaption{font-size:14px;color:var(--muted);padding-top:8px}
/* forms on the site */
.okbox{background:#E8F5EC;border:1px solid #B9DFC4;color:#1C5C2E;padding:12px 16px;border-radius:10px;margin-bottom:16px}
.errbox{background:#FDECEA;border:1px solid #F5C2C0;color:#8A1C1C;padding:12px 16px;border-radius:10px;margin-bottom:16px}.errbox ul{margin:0;padding-left:18px}
.hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.offices.one{grid-template-columns:1fr}
.contact-split{gap:40px}
/* footer looks */
.f2acts{display:flex;gap:12px;flex-wrap:wrap}
.f-columns .cols{padding-top:64px}
.bot.simple{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:28px 0;border-top:0}.bot.simple .links{display:flex;gap:18px;flex-wrap:wrap}
/* plans "from" */
.plan .amt .from{display:block;font-size:13px;color:var(--muted);font-weight:500;margin-bottom:2px}
.site .price small{display:block}.site .shotimg{width:100%;height:100%;object-fit:cover;object-position:top}
/* responsive */
@media (max-width:1000px){
  .vals.cols-4,.pcards.cols-4,.gal.cols-4,.quotes.cols-4{grid-template-columns:repeat(2,1fr)}
  .vals.cols-3,.pcards.cols-3,.quotes.cols-3,.gal.cols-3{grid-template-columns:repeat(2,1fr)}
  .two-col,.feat{grid-template-columns:1fr;gap:36px}.feat.left>.art{order:0}
  .hdr-centered .hacts{position:static}
}
@media (max-width:640px){
  .vals.cols-2,.vals.cols-3,.vals.cols-4,.pcards.cols-2,.pcards.cols-3,.pcards.cols-4,.pts.cols-2,.pts.cols-3,.pts.cols-4,.quotes.cols-2,.quotes.cols-3,.quotes.cols-4{grid-template-columns:1fr}
  .gal.cols-3,.gal.cols-4{grid-template-columns:1fr 1fr}
  .ctaband{padding:36px 26px}.hero-slides{min-height:640px}.dots-nav{bottom:150px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}.hero-slides .slide{transition:none}}