/* Layout: full-bleed bands (white / tint / navy) alternating, 1200px content column, angled orange→teal stripe from the print profile as the one signature mark */
:root{
  --navy:#16205A; --royal:#2F45A8; --sky:#3C7BD4; --orange:#F47C20; --teal:#14A6B5;
  --bg:#FFFFFF; --tint:#F2F5FC; --card:#FFFFFF; --fg:#1A2140; --muted:#5D6580; --line:#DFE4F0;
  --head:#16205A; --on-navy:#FFFFFF; --on-navy-muted:#B9C5EA;
  --nav-bg:rgba(255,255,255,.92);
  --shadow:0 10px 30px -18px rgba(22,32,90,.35);
  --display:'Poppins',ui-sans-serif,system-ui,sans-serif;
  --text:'Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --r:14px;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#0E1330; --tint:#131A3D; --card:#182049; --fg:#E7EBF8; --muted:#A3ACCB; --line:#2A3466;
  --head:#FFFFFF; --nav-bg:rgba(14,19,48,.92); --shadow:0 10px 30px -18px rgba(0,0,0,.7); color-scheme:dark } }
:root[data-theme="dark"]{
  --bg:#0E1330; --tint:#131A3D; --card:#182049; --fg:#E7EBF8; --muted:#A3ACCB; --line:#2A3466;
  --head:#FFFFFF; --nav-bg:rgba(14,19,48,.92); --shadow:0 10px 30px -18px rgba(0,0,0,.7); color-scheme:dark }

*{ box-sizing:border-box }
html{ scroll-behavior:smooth; scroll-padding-top:84px }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto } *{ transition:none!important; animation:none!important } }
body{ margin:0; background:var(--bg); color:var(--fg); font:16px/1.65 var(--text); -webkit-font-smoothing:antialiased }
body::before{ content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top,0px); z-index:60; background:var(--nav-bg) }
img{ max-width:100%; display:block }
a{ color:inherit }
h1,h2,h3{ font-family:var(--display); color:var(--head); line-height:1.2; text-wrap:balance; margin:0 }
h2{ font-size:clamp(1.6rem,1.1rem + 1.8vw,2.4rem); font-weight:600; letter-spacing:-.01em }
h3{ font-size:1.05rem; font-weight:600 }
p{ margin:0 }
.num{ font-variant-numeric:tabular-nums }
.wrap{ max-width:1200px; margin:0 auto; padding-left:max(16px,env(safe-area-inset-left,0px)); padding-right:max(16px,env(safe-area-inset-right,0px)) }
.skip{ position:absolute; left:-999px; top:8px; background:var(--royal); color:#fff; padding:8px 12px; border-radius:8px; z-index:99 }
.skip:focus{ left:12px }
:focus-visible{ outline:3px solid var(--orange); outline-offset:3px; border-radius:6px }
.i{ flex:none }

/* buttons */
.btn{ display:inline-flex; align-items:center; gap:.5rem; font:600 .95rem var(--display); color:#fff; background:var(--orange); border:0; border-radius:999px; padding:.85rem 1.4rem; text-decoration:none; cursor:pointer; transition:transform .15s, background .15s }
.btn:hover{ background:#E06A10; transform:translateY(-1px) }
.btn-ghost{ background:rgba(255,255,255,.12); box-shadow:inset 0 0 0 1px rgba(255,255,255,.45) }
.btn-ghost:hover{ background:rgba(255,255,255,.22) }
.btn-sm{ padding:.6rem 1.1rem; font-size:.85rem }

/* nav */
.nav{ position:sticky; top:env(safe-area-inset-top,0px); z-index:50; background:var(--nav-bg); backdrop-filter:blur(10px); border-bottom:1px solid var(--line) }
.nav-in{ display:flex; align-items:center; gap:1.5rem; min-height:72px }
.brand img{ height:44px; width:auto }
.brand-d{ display:none }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .brand-l{ display:none } :root:not([data-theme="light"]) .brand-d{ display:block } }
:root[data-theme="dark"] .brand-l{ display:none } :root[data-theme="dark"] .brand-d{ display:block }
.menu{ display:flex; gap:1.4rem; margin-left:auto }
.menu a{ text-decoration:none; font:500 .92rem var(--display); color:var(--fg); opacity:.85 }
.menu a:hover{ color:var(--orange); opacity:1 }
.burger{ display:none; margin-left:auto; background:none; border:0; color:var(--fg); padding:8px; cursor:pointer }
@media (max-width:980px){
  .nav-cta{ display:none }
  .burger{ display:block }
  .menu{ position:absolute; left:0; right:0; top:100%; flex-direction:column; gap:0; background:var(--bg); border-bottom:1px solid var(--line); padding:.5rem max(16px,env(safe-area-inset-right,0px)) 1rem max(16px,env(safe-area-inset-left,0px)); display:none }
  .menu.open{ display:flex }
  .menu a{ padding:.75rem 0; border-bottom:1px solid var(--line) }
}

/* hero */
.hero{ position:relative; overflow:hidden; background:var(--navy); color:#fff; isolation:isolate }
.hero-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:60% 55%; z-index:-2 }
.hero-shade{ position:absolute; inset:0; z-index:-1; background:linear-gradient(100deg,rgba(14,20,64,.97) 0%,rgba(28,42,130,.9) 45%,rgba(47,69,168,.45) 75%,rgba(20,166,181,.25) 100%) }
.hero-in{ padding-block:clamp(4rem,9vw,7.5rem) clamp(5rem,9vw,7rem) }
.kicker{ font:600 .78rem var(--display); letter-spacing:.18em; text-transform:uppercase; color:#FFB06B }
.hero h1{ color:#fff; font-size:clamp(2.2rem,1.3rem + 4vw,4rem); font-weight:700; max-width:15ch; margin:.8rem 0 1.2rem; letter-spacing:-.02em }
.hero h1 em{ font-style:normal; color:#FFB06B }
.hero-p{ max-width:56ch; font-size:1.1rem; color:#D6DEF7 }
.hero-cta{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2rem }
.hero-facts{ list-style:none; padding:0; margin:3rem 0 0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:rgba(255,255,255,.18); border-radius:var(--r); overflow:hidden; max-width:760px }
.hero-facts li{ background:rgba(14,20,64,.55); padding:1rem 1.2rem; backdrop-filter:blur(4px) }
.hero-facts b{ display:block; font:700 1.7rem var(--display); color:#fff; font-variant-numeric:tabular-nums }
.hero-facts span{ font-size:.8rem; color:#C6D1F2 }
.hero-stripe{ position:absolute; left:0; right:0; bottom:0; height:56px; background:linear-gradient(90deg,var(--orange),#FFB347 55%,var(--teal)); clip-path:polygon(0 70%,100% 0,100% 100%,0 100%) }
.hero-stripe::after{ content:""; position:absolute; inset:0; background:var(--bg); clip-path:polygon(0 100%,100% 22%,100% 100%) }
@media (max-width:640px){ .hero-facts{ grid-template-columns:repeat(2,minmax(0,1fr)) } }

/* sections */
.sec{ padding-block:clamp(3.5rem,7vw,6rem) }
.sec-tint{ background:var(--tint) }
.sec-navy{ background:linear-gradient(135deg,#121A4E,#22358F 60%,#2B5DB8); color:var(--on-navy) }
.sec-navy h2,.sec-navy h3{ color:#fff }
.sec-navy .sec-h p:not(.eyebrow){ color:var(--on-navy-muted) }
.eyebrow{ font:600 .75rem var(--display); letter-spacing:.18em; text-transform:uppercase; color:var(--orange); margin-bottom:.7rem }
.sec-navy .eyebrow{ color:#FFB06B }
.sec-h{ max-width:760px; margin:0 auto 2.6rem; text-align:center }
.sec-h p:not(.eyebrow){ color:var(--muted); margin-top:1rem; font-size:1.05rem }
.sec-h.left{ text-align:left; margin:0 }
.sub-h{ font-size:1.25rem; margin:3rem 0 1.2rem }

/* about */
.about{ display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:3rem; align-items:start }
.about-t > p:not(.eyebrow){ margin-top:1rem; color:var(--muted); max-width:62ch }
.about-t h2{ max-width:20ch }
.values{ list-style:none; padding:0; margin:2rem 0 0; display:flex; flex-wrap:wrap; gap:.6rem }
.values li{ display:flex; align-items:center; gap:.45rem; background:var(--tint); border:1px solid var(--line); border-radius:999px; padding:.45rem .9rem; font:500 .88rem var(--display); color:var(--head) }
.values .i{ color:var(--orange) }
.lic{ background:linear-gradient(150deg,#16205A,#2F45A8 70%,#3C7BD4); color:#fff; border-radius:var(--r); padding:1.6rem; box-shadow:var(--shadow) }
.lic-h{ display:flex; align-items:center; gap:.5rem; font:600 .8rem var(--display); letter-spacing:.14em; text-transform:uppercase; color:#FFB06B; margin-bottom:1rem }
.lic dl{ display:grid; grid-template-columns:7rem 1fr; gap:.5rem .8rem; margin:0; font-size:.9rem }
.lic dt{ color:#B9C5EA } .lic dd{ margin:0; font-weight:500 }
.lic-k{ margin:1.4rem 0 .6rem; font:600 .8rem var(--display); letter-spacing:.14em; text-transform:uppercase; color:#FFB06B }
.acts{ margin:0; padding-left:1.3rem; display:grid; gap:.3rem; font-size:.88rem; color:#E3E9FA }
.acts li::marker{ color:#FFB06B; font-weight:600 }
.vm{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.2rem; margin-top:3.5rem }
.vm article{ border-top:3px solid var(--royal); padding-top:1.2rem }
.vm article:nth-child(2){ border-color:var(--orange) } .vm article:nth-child(3){ border-color:var(--teal) }
.vm h3{ font-size:1.1rem; margin-bottom:.6rem }
.vm p:not(.eyebrow){ color:var(--muted); font-size:.95rem }
@media (max-width:900px){ .about,.vm{ grid-template-columns:minmax(0,1fr) } }

/* services */
.svcs{ display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:1rem }
.svc{ display:flex; align-items:flex-start; gap:.9rem; background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:1.1rem 1.1rem 1.1rem 1rem; text-decoration:none; transition:border-color .15s, transform .15s, box-shadow .15s }
.svc:hover{ border-color:var(--royal); transform:translateY(-2px); box-shadow:var(--shadow) }
.svc-i{ width:42px; height:42px; border-radius:11px; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,var(--royal),var(--sky)); flex:none }
.svc:nth-child(3n+2) .svc-i{ background:linear-gradient(135deg,#F06A14,#FFA24C) }
.svc:nth-child(3n+3) .svc-i{ background:linear-gradient(135deg,#0E8FA0,#2CCBC4) }
.svc-t{ display:flex; flex-direction:column; min-width:0 }
.svc-t b{ font:600 .98rem var(--display); color:var(--head) }
.svc-t span{ font-size:.86rem; color:var(--muted); line-height:1.45 }
.svc-a{ margin-left:auto; color:var(--muted); opacity:.6 }

/* tiles */
.tiles{ display:grid; gap:1rem }
.tiles.t4{ grid-template-columns:repeat(4,minmax(0,1fr)) }
.tiles.t3{ grid-template-columns:repeat(3,minmax(0,1fr)) }
@media (max-width:1000px){ .tiles.t4{ grid-template-columns:repeat(2,minmax(0,1fr)) } .tiles.t3{ grid-template-columns:repeat(2,minmax(0,1fr)) } }
@media (max-width:560px){ .tiles.t4,.tiles.t3{ grid-template-columns:minmax(0,1fr) } }
.tile{ background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:1.3rem }
.tile-i{ width:40px; height:40px; border-radius:10px; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,var(--royal),var(--sky)); margin-bottom:.9rem }
.tile:nth-child(4n+2) .tile-i{ background:linear-gradient(135deg,#F06A14,#FFA24C) }
.tile:nth-child(4n+3) .tile-i{ background:linear-gradient(135deg,#0E8FA0,#2CCBC4) }
.tile:nth-child(4n+4) .tile-i{ background:linear-gradient(135deg,#1A6FC9,#4BA8F0) }
.tile h3{ margin-bottom:.4rem }
.tile p{ font-size:.9rem; color:var(--muted); line-height:1.55 }
.tiles.on-dark .tile{ background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.16) }
.tiles.on-dark .tile p{ color:var(--on-navy-muted) }

/* market entry */
.split{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:3rem; align-items:center; margin-bottom:3rem }
.split-img{ margin:0; border-radius:var(--r); overflow:hidden; aspect-ratio:16/10; box-shadow:var(--shadow) }
.split-img img{ width:100%; height:100%; object-fit:cover; object-position:50% 45% }
@media (max-width:900px){ .split{ grid-template-columns:minmax(0,1fr) } }
.journey{ list-style:none; padding:0; margin:0 0 2.5rem; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1rem; counter-reset:j; position:relative }
.journey::before{ content:""; position:absolute; top:20px; left:10%; right:10%; height:2px; background:linear-gradient(90deg,var(--royal),var(--orange),var(--teal)) }
.journey li{ position:relative; text-align:center; display:flex; flex-direction:column; align-items:center; gap:.25rem }
.jr-n{ width:42px; height:42px; border-radius:50%; display:grid; place-items:center; font:600 1rem var(--display); color:#fff; background:var(--royal); box-shadow:0 0 0 6px var(--bg) }
.journey li:nth-child(2) .jr-n{ background:var(--orange) } .journey li:nth-child(3) .jr-n{ background:var(--teal) } .journey li:nth-child(4) .jr-n{ background:#1A6FC9 } .journey li:nth-child(5) .jr-n{ background:#169A63 }
.journey b{ font:600 1rem var(--display); color:var(--head); margin-top:.4rem }
.journey span:not(.jr-n){ font-size:.84rem; color:var(--muted); max-width:18ch }
@media (max-width:760px){ .journey{ grid-template-columns:minmax(0,1fr); text-align:left } .journey::before{ display:none } .journey li{ flex-direction:row; text-align:left; gap:.8rem } .journey b{ margin:0; min-width:5.5rem } .journey span:not(.jr-n){ max-width:none } }

/* csp */
.fzs{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:.8rem }
.fz{ margin:0; background:#fff; border:1px solid var(--line); border-radius:12px; padding:.9rem .6rem .7rem; text-align:center; display:flex; flex-direction:column; gap:.5rem; justify-content:space-between }
.fz img{ height:46px; width:100%; object-fit:contain }
.fz figcaption{ font-size:.72rem; color:#5D6580; line-height:1.3 }
@media (max-width:900px){ .fzs{ grid-template-columns:repeat(4,minmax(0,1fr)) } }
@media (max-width:520px){ .fzs{ grid-template-columns:repeat(2,minmax(0,1fr)) } }
.benefits{ list-style:none; padding:0; margin:1.6rem 0 0; display:flex; flex-wrap:wrap; gap:.6rem; justify-content:center }
.benefits li{ display:flex; align-items:center; gap:.45rem; background:var(--card); border:1px solid var(--line); border-radius:999px; padding:.5rem 1rem; font-size:.88rem; font-weight:500 }
.benefits .i{ color:var(--orange) }

/* strategy */
.consult{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:2.5rem; align-items:center; margin-top:3rem }
.consult figure{ margin:0; border-radius:var(--r); overflow:hidden; aspect-ratio:4/3; box-shadow:var(--shadow) }
.consult img{ width:100%; height:100%; object-fit:cover }
.consult h3{ font-size:1.4rem; margin-bottom:1.2rem }
@media (max-width:900px){ .consult{ grid-template-columns:minmax(0,1fr) } }
.ilist{ list-style:none; padding:0; margin:1.4rem 0 0; display:grid; gap:1rem }
.ilist.two{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem 1.6rem }
@media (max-width:640px){ .ilist.two{ grid-template-columns:minmax(0,1fr) } }
.ilist li{ display:flex; gap:.8rem; align-items:flex-start }
.ilist .i{ color:var(--orange); margin-top:.15rem }
.ilist b{ display:block; font:600 .98rem var(--display); color:var(--head) }
.ilist span{ font-size:.9rem; color:var(--muted) }

/* tech */
.partners{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.8rem; margin-top:2.5rem }
.partners span{ width:100%; text-align:center; font:600 .75rem var(--display); letter-spacing:.16em; text-transform:uppercase; color:#FFB06B; margin-bottom:.3rem }
.partners img{ height:64px; width:150px; object-fit:contain; background:#fff; border-radius:10px; padding:10px 14px }

/* bookkeeper */
.bk{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:3rem; align-items:center }
.bk-card{ background:var(--card); border:1px solid var(--line); border-top:4px solid var(--orange); border-radius:var(--r); padding:2rem; text-align:center; box-shadow:var(--shadow) }
.bk-logo{ height:70px; width:auto; margin:0 auto 1rem; background:#fff; border-radius:10px; padding:6px 10px }
.bk-badge{ display:inline-block; background:linear-gradient(110deg,#16205A,#2F45A8); color:#fff; font:600 .72rem var(--display); letter-spacing:.08em; text-transform:uppercase; padding:.45rem .8rem; border-radius:8px }
.bk-stats{ list-style:none; padding:0; margin:1.6rem 0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.6rem }
.bk-stats li{ background:var(--tint); border-radius:10px; padding:.8rem .4rem }
.bk-stats b{ display:block; font:700 1.4rem var(--display); color:var(--royal) }
.bk-stats span{ font-size:.78rem; color:var(--muted) }
.plats{ list-style:none; padding:0; margin:0 0 1.2rem; display:flex; flex-wrap:wrap; justify-content:center; gap:.5rem }
.plats li{ display:flex; align-items:center; gap:.35rem; font-size:.85rem; font-weight:500; border:1px solid var(--line); border-radius:999px; padding:.35rem .8rem }
.txt-link{ display:inline-flex; align-items:center; gap:.3rem; color:var(--royal); font-weight:600; text-decoration:none }
.bk-t > p:not(.eyebrow){ margin-top:1rem; color:var(--muted) }
@media (max-width:900px){ .bk{ grid-template-columns:minmax(0,1fr) } }

/* e-invoicing */
.tl{ list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem }
.tl li{ border-radius:var(--r); padding:1.2rem; color:#fff; background:linear-gradient(135deg,#2F45A8,#4F7BE0) }
.tl li:nth-child(2){ background:linear-gradient(135deg,#E8650F,#FFA24C) } .tl li:nth-child(3){ background:linear-gradient(135deg,#0E8FA0,#2CCBC4) } .tl li:nth-child(4){ background:linear-gradient(135deg,#138A58,#45C98C) }
.tl b{ display:block; font:700 1.25rem var(--display); font-variant-numeric:tabular-nums }
.tl span{ font-size:.86rem; opacity:.95 }
@media (max-width:820px){ .tl{ grid-template-columns:repeat(2,minmax(0,1fr)) } }
.flow{ list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1.6rem }
.flow li{ position:relative; background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:1.2rem 1rem; text-align:center; display:flex; flex-direction:column; align-items:center; gap:.3rem }
.flow li:not(:last-child)::after{ content:"\2192"; position:absolute; right:-1.25rem; top:50%; transform:translateY(-50%); color:var(--orange); font:700 1.2rem var(--display) }
.fl-i{ width:44px; height:44px; border-radius:50%; display:grid; place-items:center; color:#fff; background:var(--royal); margin-bottom:.4rem }
.flow li:nth-child(2) .fl-i{ background:var(--orange) } .flow li:nth-child(3) .fl-i{ background:var(--teal) } .flow li:nth-child(4) .fl-i{ background:#1A6FC9 } .flow li:nth-child(5) .fl-i{ background:#169A63 }
.flow b{ font:600 .95rem var(--display); color:var(--head) }
.flow span:not(.fl-i){ font-size:.82rem; color:var(--muted); line-height:1.4 }
@media (max-width:900px){ .flow{ grid-template-columns:minmax(0,1fr); gap:1.4rem } .flow li:not(:last-child)::after{ content:"\2193"; right:50%; top:auto; bottom:-1.35rem; transform:translateX(50%) } }
.asp{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-top:2.5rem }
.asp-c{ border-radius:var(--r); padding:1.5rem; color:#fff; background:linear-gradient(140deg,#16205A,#2F45A8 70%,#3C7BD4) }
.asp-c.alt{ background:linear-gradient(140deg,#0A6F7D,#0E8FA0 55%,#2CCBC4) }
.asp-c.util{ background:var(--card); color:var(--fg); border:2px dashed var(--orange) }
.asp-c .eyebrow{ color:#FFD19C }
.asp-c h3{ color:#fff; font-size:1.2rem; margin-bottom:.5rem }
.asp-c.util h3{ color:var(--head) }
.asp-c p:not(.eyebrow){ font-size:.92rem; opacity:.92 }
.asp-c.util .tile-i{ background:linear-gradient(135deg,#F06A14,#FFA24C) }
@media (max-width:900px){ .asp{ grid-template-columns:minmax(0,1fr) } }

/* echeck */
.ec{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:3rem; align-items:center }
.ec-img{ margin:0 }
.ec-logo{ height:64px; width:auto; margin-bottom:1rem }
.ec h2{ margin-bottom:.8rem }
.ec > div > p{ color:var(--muted) }
.ec .ilist{ grid-template-columns:repeat(2,minmax(0,1fr)) }
.ec .ilist span{ color:var(--fg); font-weight:500 }
@media (max-width:900px){ .ec{ grid-template-columns:minmax(0,1fr) } }
@media (max-width:520px){ .ec .ilist{ grid-template-columns:minmax(0,1fr) } }

/* more */
.mores{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem }
.more-c{ background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:1.5rem }
.more-c:nth-child(2) .tile-i{ background:linear-gradient(135deg,#F06A14,#FFA24C) } .more-c:nth-child(3) .tile-i{ background:linear-gradient(135deg,#0E8FA0,#2CCBC4) }
.more-c ul{ margin:.8rem 0 0; padding-left:1.1rem; color:var(--muted); font-size:.92rem; display:grid; gap:.3rem }
.more-c li::marker{ color:var(--orange) }
@media (max-width:860px){ .mores{ grid-template-columns:minmax(0,1fr) } }

/* team */
.mgs{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.2rem }
.mg{ margin:0; text-align:center }
.mg-ph{ position:relative; aspect-ratio:4/4.3; display:flex; align-items:flex-end; justify-content:center }
.mg-ph::before{ content:""; position:absolute; left:0; right:0; bottom:0; height:72%; border-radius:var(--r) var(--r) 0 0; background:linear-gradient(140deg,#16205A,#2F45A8) }
.mg:nth-child(2) .mg-ph::before{ background:linear-gradient(140deg,#2F45A8,#3C7BD4) } .mg:nth-child(3) .mg-ph::before{ background:linear-gradient(140deg,#E8650F,#FFA24C) } .mg:nth-child(4) .mg-ph::before{ background:linear-gradient(140deg,#0E8FA0,#2CCBC4) }
.mg-ph img{ position:relative; max-height:100%; width:auto; filter:drop-shadow(0 10px 12px rgba(10,20,60,.4)) }
.mg figcaption{ background:var(--card); border:1px solid var(--line); border-top:0; border-radius:0 0 var(--r) var(--r); padding:.9rem .6rem }
.mg b{ display:block; font:600 1.02rem var(--display); color:var(--head) }
.mg span{ font-size:.84rem; color:var(--orange); font-weight:600 }
@media (max-width:860px){ .mgs{ grid-template-columns:repeat(2,minmax(0,1fr)) } }
.jit{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:2rem; margin-top:2rem; background:var(--tint); border-left:4px solid var(--orange); border-radius:0 var(--r) var(--r) 0; padding:1.6rem 1.8rem }
.jit h3{ font-size:1.3rem }
.jit-r{ color:var(--royal); font-weight:600; margin-top:.3rem }
.jit-c{ font-size:.85rem; color:var(--muted); margin-top:.5rem }
.jit > p{ color:var(--muted); font-size:.95rem; align-self:center }
@media (max-width:860px){ .jit{ grid-template-columns:minmax(0,1fr) } }
.team-h{ margin-top:4rem }
.team{ display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:1.4rem 1rem }
.tm{ margin:0; text-align:center }
.tm-ph{ position:relative; aspect-ratio:1/1; display:flex; align-items:flex-end; justify-content:center; margin-bottom:.6rem }
.tm-ph::before{ content:""; position:absolute; left:10%; right:10%; bottom:0; height:62%; border-radius:12px 12px 4px 4px; background:linear-gradient(140deg,var(--royal),var(--sky)) }
.tm:nth-child(4n+2) .tm-ph::before{ background:linear-gradient(140deg,#E8650F,#FFA24C) } .tm:nth-child(4n+3) .tm-ph::before{ background:linear-gradient(140deg,#0E8FA0,#2CCBC4) } .tm:nth-child(4n+4) .tm-ph::before{ background:linear-gradient(140deg,#1A6FC9,#4BA8F0) }
.tm-ph img{ position:relative; max-height:100%; width:auto; filter:drop-shadow(0 8px 10px rgba(10,20,60,.35)) }
.tm b{ display:block; font:600 .92rem var(--display); color:var(--head); line-height:1.3 }
.tm i{ display:block; font-style:normal; font-size:.76rem; font-weight:600; color:var(--orange) }
.tm span{ display:block; font-size:.8rem; color:var(--muted); line-height:1.35 }

/* clients */
.clients{ list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:.8rem }
.clients li{ border-radius:10px; overflow:hidden; border:1px solid var(--line); background:#fff; aspect-ratio:352/198 }
.clients img{ width:100%; height:100%; object-fit:cover }
.fine{ text-align:center; font-size:.78rem; color:var(--muted); margin-top:1.2rem }

/* gallery */
.gal{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-auto-rows:220px; gap:1rem }
.ga{ position:relative; margin:0; border-radius:var(--r); overflow:hidden }
.ga img{ width:100%; height:100%; object-fit:cover; transition:transform .4s }
.ga:hover img{ transform:scale(1.03) }
.ga figcaption{ position:absolute; inset:auto 0 0; padding:2rem 1rem .9rem; color:#fff; font-size:.85rem; font-weight:500; background:linear-gradient(0deg,rgba(14,20,64,.95),rgba(14,20,64,.75) 55%,rgba(14,20,64,0)) }
.ga1{ grid-column:span 2; grid-row:span 2 } .ga1 img{ object-position:50% 30% }
.ga6{ grid-column:span 2 }
@media (max-width:860px){ .gal{ grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:200px } }
@media (max-width:520px){ .gal{ grid-template-columns:minmax(0,1fr) } .ga1,.ga6{ grid-column:auto; grid-row:auto } }

/* contact */
.contact{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:3rem; align-items:start }
.contact > div > p:not(.eyebrow){ color:var(--on-navy-muted); margin-top:1rem }
.cinfo{ list-style:none; padding:0; margin:2rem 0 0; display:grid; gap:1.1rem }
.cinfo li{ display:flex; gap:.9rem; align-items:flex-start }
.cinfo .i{ color:#FFB06B; margin-top:.2rem }
.cinfo span{ display:block; font:600 .72rem var(--display); letter-spacing:.14em; text-transform:uppercase; color:var(--on-navy-muted) }
.cinfo b{ font-weight:500; user-select:all }
.form{ background:var(--card); color:var(--fg); border-radius:var(--r); padding:1.8rem; display:grid; gap:1rem; box-shadow:0 20px 40px -24px rgba(0,0,0,.5) }
.f2{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:1rem }
@media (max-width:560px){ .f2{ grid-template-columns:minmax(0,1fr) } }
.form label{ display:grid; gap:.35rem; font:500 .85rem var(--display); color:var(--head) }
.form input,.form select,.form textarea{ font:400 .95rem var(--text); color:var(--fg); background:var(--bg); border:1px solid var(--line); border-radius:10px; padding:.7rem .8rem; width:100% }
.form input:focus,.form select:focus,.form textarea:focus{ outline:2px solid var(--royal); outline-offset:0; border-color:transparent }
.form .btn{ justify-self:start }
.form-note{ font-size:.88rem; color:var(--muted); min-height:1.2em }
.form-note.err{ color:#C7361B }
@media (max-width:900px){ .contact{ grid-template-columns:minmax(0,1fr) } }
.offices{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; margin-top:3.5rem }
.of{ background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.16); border-radius:var(--r); padding:1.2rem }
.of img{ height:40px; width:auto; max-width:100%; background:#fff; border-radius:8px; padding:5px 8px; margin-bottom:.9rem }
.of-k{ display:block; font:600 .7rem var(--display); letter-spacing:.14em; text-transform:uppercase; color:#FFB06B }
.of b{ display:block; font:600 .95rem var(--display); margin:.3rem 0 .5rem; color:#fff }
.of p{ display:flex; gap:.4rem; font-size:.84rem; color:var(--on-navy-muted) }
@media (max-width:980px){ .offices{ grid-template-columns:repeat(2,minmax(0,1fr)) } }
@media (max-width:520px){ .offices{ grid-template-columns:minmax(0,1fr) } }

/* footer */
.foot{ background:#0B1030; color:#B9C5EA; padding-block:2.5rem 1.2rem }
.foot-in{ display:flex; flex-wrap:wrap; gap:2rem; align-items:center; justify-content:space-between }
.foot-logo{ height:44px; width:auto; margin-bottom:.5rem }
.foot p{ font-size:.85rem }
.foot nav{ display:flex; flex-wrap:wrap; gap:1.2rem }
.foot nav a{ text-decoration:none; font-size:.9rem }
.foot nav a:hover{ color:#fff }
.soc{ display:flex; gap:.6rem }
.soc a{ width:38px; height:38px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.08); color:#fff }
.soc a:hover{ background:var(--orange) }
.copy{ margin-top:2rem; padding-top:1rem; border-top:1px solid rgba(255,255,255,.1); font-size:.8rem }
.team{ grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.6rem 1.4rem; max-width:900px; margin:0 auto }
@media (max-width:640px){ .team{ grid-template-columns:repeat(2,minmax(0,1fr)) } }
.clients{ display:flex; flex-wrap:wrap; justify-content:center }
.clients li{ width:calc((100% - 6*.8rem)/7) }
@media (max-width:900px){ .clients li{ width:calc((100% - 3*.8rem)/4) } }
@media (max-width:520px){ .clients li{ width:calc((100% - 2*.8rem)/3) } }
/* ===== multi-page: header with top bar + dropdown menus ===== */
.topbar{ background:var(--navy); color:#C9D3F2; font-size:.8rem }
.topbar-in{ display:flex; flex-wrap:wrap; align-items:center; gap:.4rem 1.6rem; min-height:38px }
.topbar span{ display:inline-flex; align-items:center; gap:.4rem }
.topbar .i{ color:#FFB06B }
.topbar b{ font-weight:500; color:#fff }
.tb-soc{ margin-left:auto; gap:.2rem!important }
.tb-soc a{ width:28px; height:28px; display:grid; place-items:center; border-radius:50%; color:#fff }
.tb-soc a:hover{ background:var(--orange) }
.tb-soc .i{ color:#fff }
@media (max-width:760px){ .tb-hide{ display:none!important } .tb-soc{ display:none!important } .topbar-in{ justify-content:center; font-size:.75rem } }
.hdr{ position:sticky; top:env(safe-area-inset-top,0px); z-index:50; background:var(--nav-bg); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); box-shadow:0 6px 20px -16px rgba(22,32,90,.4) }
.hdr-in{ display:flex; align-items:center; gap:1.2rem; min-height:78px }
.mnav{ margin-left:auto }
.mlist{ list-style:none; margin:0; padding:0; display:flex; align-items:center; gap:.2rem }
.mlist > li{ position:relative; display:flex; align-items:center }
.m-a{ display:block; padding:.6rem .8rem; text-decoration:none; font:500 .92rem var(--display); color:var(--fg); border-radius:8px; position:relative }
.m-a:hover,.m-a[aria-current="page"],.is-on > .m-a{ color:var(--royal) }
.m-a[aria-current="page"]::after,.is-on > .m-a::after{ content:""; position:absolute; left:.8rem; right:.8rem; bottom:.25rem; height:2px; border-radius:2px; background:var(--orange) }
.has-sub > .m-a{ padding-right:.2rem }
.sub-t{ background:none; border:0; padding:.3rem .3rem .3rem 0; color:var(--muted); cursor:pointer; display:grid; place-items:center }
.sub{ list-style:none; margin:0; padding:.6rem; position:absolute; top:100%; left:-.4rem; min-width:300px; background:var(--card); border:1px solid var(--line); border-top:3px solid var(--orange); border-radius:0 0 12px 12px; box-shadow:var(--shadow); opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .18s, transform .18s, visibility .18s }
.has-sub:hover > .sub,.has-sub:focus-within > .sub,.has-sub.open > .sub{ opacity:1; visibility:visible; transform:none }
.sub a{ display:block; padding:.6rem .75rem; border-radius:8px; text-decoration:none }
.sub a:hover{ background:var(--tint) }
.sub b{ display:block; font:600 .9rem var(--display); color:var(--head) }
.sub span{ display:block; font-size:.78rem; color:var(--muted) }
.hdr-cta{ margin-left:.4rem }
@media (max-width:1080px){
  .hdr-cta{ display:none }
  .burger{ display:block }
  .mnav{ position:absolute; left:0; right:0; top:100%; background:var(--bg); border-bottom:1px solid var(--line); max-height:calc(100vh - 120px); overflow:auto; display:none; padding:.4rem max(16px,env(safe-area-inset-right,0px)) 1rem max(16px,env(safe-area-inset-left,0px)) }
  .mnav.open{ display:block }
  .mlist{ flex-direction:column; align-items:stretch; gap:0 }
  .mlist > li{ flex-wrap:wrap; border-bottom:1px solid var(--line) }
  .m-a{ flex:1; padding:.85rem 0 }
  .m-a::after{ display:none }
  .sub-t{ padding:.6rem }
  .sub{ position:static; width:100%; min-width:0; opacity:1; visibility:visible; transform:none; display:none; box-shadow:none; border:0; border-left:3px solid var(--orange); border-radius:0; padding:.2rem 0 .6rem .6rem; background:transparent }
  .has-sub:hover > .sub,.has-sub:focus-within > .sub{ display:none }
  .has-sub.open > .sub{ display:block }
}
@media (min-width:1081px){ .burger{ display:none } }
.has-sub.open .sub-t .i{ transform:rotate(180deg) }

/* page banner */
.pbanner{ position:relative; overflow:hidden; background:var(--navy); color:#fff; isolation:isolate }
.pbanner > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2 }
.pb-shade{ position:absolute; inset:0; z-index:-1; background:linear-gradient(100deg,rgba(14,20,64,.96) 0%,rgba(28,42,130,.88) 50%,rgba(47,69,168,.45) 100%) }
.pb-in{ padding-block:clamp(3rem,6vw,4.8rem) clamp(4rem,7vw,5.4rem) }
.pbanner h1{ color:#fff; font-size:clamp(1.9rem,1.2rem + 2.6vw,3rem); font-weight:700; letter-spacing:-.01em; max-width:22ch }
.pbanner p{ color:#D6DEF7; max-width:60ch; margin-top:.8rem; font-size:1.05rem }
.crumbs{ display:flex; align-items:center; gap:.4rem; font-size:.82rem; color:#B9C5EA; margin-bottom:1rem }
.crumbs a{ color:#FFB06B; text-decoration:none }
.pbanner .hero-stripe{ height:40px }

/* shared bits */
.center{ text-align:center; margin-top:2.2rem }
.more-link{ margin-top:1.4rem }
.hl3{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem }
.hl{ display:block; text-decoration:none; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.16); border-radius:var(--r); padding:1.6rem; transition:transform .15s, background .15s }
.hl:hover{ transform:translateY(-3px); background:rgba(255,255,255,.12) }
.hl h3{ color:#fff; margin-bottom:.4rem } .hl p{ color:var(--on-navy-muted); font-size:.92rem }
.hl-go{ display:inline-flex; align-items:center; gap:.3rem; margin-top:1rem; color:#FFB06B; font-weight:600; font-size:.88rem }
.hl3.light .hl{ background:var(--card); border-color:var(--line) }
.hl3.light .hl h3{ color:var(--head) } .hl3.light .hl p{ color:var(--muted) } .hl3.light .hl-go{ color:var(--orange) }
.hl:nth-child(2) .tile-i{ background:linear-gradient(135deg,#F06A14,#FFA24C) } .hl:nth-child(3) .tile-i{ background:linear-gradient(135deg,#0E8FA0,#2CCBC4) }
@media (max-width:860px){ .hl3{ grid-template-columns:minmax(0,1fr) } }
.ceo{ display:grid; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); gap:3rem; align-items:center }
.ceo-ph{ margin:0; position:relative; display:flex; justify-content:center; align-items:flex-end; aspect-ratio:4/4.2 }
.ceo-ph::before{ content:""; position:absolute; inset:28% 0 0; border-radius:var(--r); background:linear-gradient(140deg,#16205A,#2F45A8) }
.ceo-ph img{ position:relative; max-height:100%; width:auto; filter:drop-shadow(0 12px 14px rgba(10,20,60,.45)) }
.ceo h2{ margin-bottom:1rem } .ceo p:not(.eyebrow){ color:var(--muted); margin-bottom:.8rem }
.sig b{ display:block; font:600 1.1rem var(--display); color:var(--head) } .sig span{ color:var(--orange); font-weight:600; font-size:.9rem }
@media (max-width:860px){ .ceo{ grid-template-columns:minmax(0,1fr) } .ceo-ph{ max-width:320px } }
.offices.light{ margin-top:0 }
.offices.light .of{ background:var(--card); border-color:var(--line) }
.offices.light .of b{ color:var(--head) } .offices.light .of p{ color:var(--muted) } .offices.light .of-k{ color:var(--orange) }
.offices.light .of img{ border:1px solid var(--line) }

/* CTA band + footer */
.cta-band{ background:linear-gradient(100deg,#E8650F,#FF9A3C 60%,#F5B54A); color:#fff }
.cta-in{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.4rem; padding-block:2.4rem }
.cta-band h2{ color:#fff; font-size:clamp(1.3rem,1rem + 1.2vw,1.8rem) }
.cta-band p{ color:#FFF1E2; margin-top:.3rem }
.cta-b{ display:flex; flex-wrap:wrap; align-items:center; gap:1rem }
.cta-b .btn{ background:var(--navy) } .cta-b .btn:hover{ background:#0B1030 }
.cta-b span{ display:inline-flex; align-items:center; gap:.4rem; font-weight:600 }
.foot2{ background:#0B1030; color:#B9C5EA; padding-block:3.5rem 1.2rem }
.foot2-in{ display:grid; grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr)); gap:2rem }
.f-col{ display:flex; flex-direction:column; gap:.55rem; font-size:.9rem }
.f-col h4{ font:600 .95rem var(--display); color:#fff; margin:0 0 .4rem }
.f-col a{ text-decoration:none } .f-col a:hover{ color:#fff }
.f-col p{ display:flex; gap:.5rem; align-items:flex-start } .f-col p .i{ color:#FFB06B; margin-top:.2rem }
.f-brand p{ display:block; max-width:36ch } .f-brand .soc{ margin-top:.6rem }
@media (max-width:900px){ .foot2-in{ grid-template-columns:repeat(2,minmax(0,1fr)) } .f-brand{ grid-column:1 / -1 } }
@media (max-width:520px){ .foot2-in{ grid-template-columns:minmax(0,1fr) } }
/* logo + CTA fixes */
.f-brand .foot-logo{ height:52px; width:auto; max-width:240px; object-fit:contain; align-self:flex-start; margin-bottom:.4rem }
.brand img{ height:48px; width:auto; max-width:210px; object-fit:contain }
@media (max-width:520px){ .brand img{ height:40px } }
.cta-in > div:first-child{ flex:1 1 420px; min-width:0 }
.cta-band h2{ max-width:none }
.m-a,.hdr-cta{ white-space:nowrap }
@media (max-width:1240px) and (min-width:1081px){ .m-a{ padding:.6rem .55rem; font-size:.88rem } .hdr-cta{ display:none } }