/* Layout: corporate maritime. White pages, navy bands, real product photography, one live 3D seascape as the hero. */
:root{
  --bg:#FFFFFF; --tint:#EAF6FB; --ink:#13202F; --ink-2:#3F4D5D; --muted:#6B7785; --line:#E1E6EB;
  --navy:#0D3A8C; --navy-2:#1652C4; --teal:#0BA3C7; --coral:#F0624D; --sand:#FFF6E0; --red:#B42318; --gold:#E0A91B; --gold-ink:#7A5A00; --green:#1E7A4C; --amber:#A86F12;
  --f:"Libre Franklin","Helvetica Neue",Arial,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{background:var(--bg);color:var(--ink);font-family:var(--f);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-weight:600;line-height:1.15;margin:0;letter-spacing:-.015em;text-wrap:balance}
p{margin:0}a{color:inherit}button{font:inherit;cursor:pointer;color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.wrap{max-width:1240px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--navy);background:var(--navy);color:#fff;border-radius:2px;padding:12px 20px;font-weight:600;font-size:.94rem;text-decoration:none;white-space:nowrap}
.btn:hover{background:var(--navy-2)}
.btn.line{background:transparent;color:var(--navy)}
.btn.line:hover{background:var(--tint)}
.btn.white{background:#fff;color:var(--navy);border-color:#fff}
.btn.ghost-w{background:transparent;border-color:rgba(255,255,255,.7);color:#fff}
.btn.ghost-w:hover{background:rgba(255,255,255,.1)}
.btn.sm{padding:7px 12px;font-size:.84rem}
.more{color:var(--navy);font-weight:600;text-decoration:none;font-size:.94rem;border:0;background:none;padding:0}
.more::after{content:" →"}
.more:hover{text-decoration:underline}
.field{width:100%;padding:11px 12px;border:1px solid #CBD3DB;border-radius:2px;background:#fff;font:inherit;font-size:.94rem;color:var(--ink)}
.field:focus{outline:2px solid var(--navy);outline-offset:-1px}
.mute{color:var(--muted)}
.tbc{display:inline-block;border:1px dashed #A07A10;background:#FFF6DA;color:#6B5000;font-size:.74rem;font-weight:600;padding:1px 7px;border-radius:2px;vertical-align:middle;white-space:nowrap}
.tint{background:var(--tint)}
.num{font-variant-numeric:tabular-nums}

/* utility + header */
.util{background:var(--navy);color:#C9D4E1;font-size:.82rem}
.util .wrap{display:flex;flex-wrap:wrap;gap:6px 26px;padding-block:8px}
.util b{color:#fff;font-weight:500}
.util .r{margin-left:auto;display:flex;gap:22px}
@media (max-width:1023px){.util .r{display:none}}
@media (max-width:600px){.util .em,.util .n2{display:none}.util .wrap{font-size:.78rem}}
@media (max-width:480px){.hero{scroll-margin-top:66px}}
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:#fff;border-bottom:1px solid var(--line)}
header .wrap{display:flex;align-items:center;gap:28px;height:74px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.logo{width:46px;height:auto;flex:none;display:block}
.logo.chip{background:#fff;border-radius:6px;padding:4px;width:54px}
.brand b{display:block;font-weight:700;font-size:1.02rem;letter-spacing:-.01em;line-height:1.1}
.brand small{display:block;font-size:.74rem;color:var(--muted)}
nav{display:flex;gap:4px;margin-left:auto}
nav a{text-decoration:none;font-size:.93rem;font-weight:500;padding:26px 10px;border-bottom:2px solid transparent}
nav a:hover{border-bottom-color:var(--gold)}
.qb{display:flex;align-items:center;gap:8px}
.qb .n{background:#fff;color:var(--navy);border-radius:10px;padding:0 7px;font-size:.78rem;font-weight:700}
.burger{display:none;width:44px;height:44px;border:1px solid var(--line);background:#fff;border-radius:2px;align-items:center;justify-content:center;flex:none}
.burger span,.burger span::before,.burger span::after{display:block;width:20px;height:2px;background:var(--navy);position:relative;transition:transform .2s,background .2s}
.burger span::before,.burger span::after{content:"";position:absolute;left:0}
.burger span::before{top:-6px}.burger span::after{top:6px}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}
.mnav{border-top:1px solid var(--line);background:#fff;max-height:calc(100dvh - 74px);overflow:auto}
.mnav .wrap{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;padding-block:10px 22px;height:auto}
.mnav a{display:block;padding:14px 0;border-bottom:1px solid var(--line);text-decoration:none;font-weight:600;font-size:1.02rem}
.mnav .call{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
@media (max-width:560px){.mnav .wrap{grid-template-columns:minmax(0,1fr)}}
.ql2{display:none}
@media (max-width:1080px){nav{display:none}.qb{margin-left:auto}.burger{display:flex}header .wrap{gap:14px}}
@media (min-width:1081px){.mnav{display:none!important}}
@media (max-width:480px){header .wrap{height:66px;gap:10px}.logo{width:38px}.brand b{font-size:.95rem}.brand small{font-size:.7rem}.ql{display:none}.ql2{display:inline}.qb{padding:9px 10px}}
@media (max-width:360px){.brand small{display:none}}

/* hero */
.hero{position:relative;height:660px;background:#9DB9CF;overflow:hidden;scroll-margin-top:74px}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}
.hero canvas:active{cursor:grabbing}
.scrim{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(6,22,42,.82) 0%,rgba(6,22,42,.55) 34%,rgba(6,22,42,0) 62%);transition:opacity .5s}
.hcopy{position:absolute;inset:0;z-index:2;display:flex;align-items:center;pointer-events:none;transition:opacity .4s}
.hcopy .wrap{width:100%}
.hcopy .in{max-width:560px;color:#fff;pointer-events:auto}
.hcopy .co{font-size:.92rem;color:#C9D4E1}
.hcopy h1{font-size:clamp(2.2rem,4.2vw,3.4rem);font-weight:600;margin-top:14px;letter-spacing:-.025em}
.hcopy p.l{margin-top:18px;font-size:1.08rem;color:#E2E9F1;max-width:48ch;font-weight:300}
.hcopy .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.cred{position:absolute;z-index:2;right:max(20px,env(safe-area-inset-right,0px));bottom:60px;color:#fff;font-size:.82rem;display:flex;gap:18px;text-shadow:0 1px 6px rgba(0,0,0,.4);transition:opacity .4s}
.hero.ex .scrim,.hero.ex .hcopy,.hero.ex .cred{opacity:0;pointer-events:none}
.hero.ex .hcopy .in{pointer-events:none}
.hot{position:absolute;left:0;top:0;z-index:3;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;border:0;background:#fff;color:var(--navy);font-size:.72rem;font-weight:700;display:grid;place-items:center;padding:0;box-shadow:0 2px 8px rgba(0,0,0,.35),0 0 0 4px rgba(255,255,255,.28);transition:transform .15s}
.hot:hover{transform:scale(1.15)}
.hot.on{background:var(--gold);color:var(--navy)}
.hot .tp{position:absolute;left:30px;top:50%;transform:translateY(-50%);white-space:nowrap;background:var(--navy);color:#fff;font-weight:500;font-size:.76rem;padding:4px 9px;border-radius:2px;opacity:0;pointer-events:none}
.hot:hover .tp{opacity:1}
.hero:not(.ex) .hot{display:none}
.xpanel{position:absolute;z-index:6;left:0;top:0;bottom:0;width:clamp(340px,34vw,400px);background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;transform:translateX(-100%);transition:transform .45s ease;padding-left:env(safe-area-inset-left,0px)}
.hero.ex .xpanel{transform:none}
.xh{padding:22px 24px 16px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.xh h2{font-size:1.35rem}
.xb{overflow:auto;flex:1}
.shipsw{padding:16px 24px;border-bottom:1px solid var(--line);display:grid;gap:10px;font-size:.88rem}
.seg2{display:flex;border:1px solid var(--navy);border-radius:2px;overflow:hidden}
.seg2 button{flex:1;border:0;background:#fff;color:var(--navy);padding:9px 6px;font-weight:600;font-size:.86rem}
.seg2 button[aria-pressed="true"]{background:var(--navy);color:#fff}
.xfil{padding:14px 24px;border-bottom:1px solid var(--line);display:grid;gap:10px;position:sticky;top:0;background:#fff;z-index:1}
.xcats{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.xcats button{flex:none;border:1px solid var(--line);background:#fff;border-radius:16px;padding:5px 10px;font-size:.8rem;font-weight:600;display:flex;align-items:center;gap:6px;white-space:nowrap}
.xcats button i{width:8px;height:8px;border-radius:50%;background:var(--c,#1652C4)}
.xcats button span{color:var(--muted);font-weight:500}
.xcats button[aria-pressed="true"]{background:var(--c,#0D3A8C);border-color:var(--c,#0D3A8C);color:#fff}
.xcats button[aria-pressed="true"] span{color:#fff}.xcats button[aria-pressed="true"] i{background:#fff}
.xg{display:flex;align-items:center;gap:8px;padding:14px 24px 6px;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--c);border-top:1px solid var(--line)}
.xg i{width:10px;height:10px;border-radius:2px;background:var(--c)}
.xg span{margin-left:auto;color:var(--muted)}
.ctag{display:inline-block;font-size:.72rem;font-weight:700;color:var(--c);text-transform:uppercase;letter-spacing:.06em}
.hot{border:3px solid var(--c,#1652C4)!important}
.xl button.row{display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);background:none;padding:11px 24px;align-items:center}
.xl button.row:hover{background:var(--tint)}
.xl .no{width:26px;height:26px;border-radius:50%;background:var(--navy);color:#fff;font-size:.72rem;font-weight:700;display:grid;place-items:center}
.xl b{display:block;font-weight:600;font-size:.92rem}
.xl small{display:block;color:var(--muted);font-size:.8rem}
.xd{padding:20px 24px 24px;display:grid;gap:14px}
.xd .top{display:flex;gap:14px;align-items:center}
.xd .big{width:46px;height:46px;border-radius:50%;background:var(--gold);color:var(--navy);display:grid;place-items:center;font-weight:700;font-size:1.05rem;flex:none}
.xd h3{font-size:1.4rem}
.xd .req{font-size:.86rem;padding:10px 12px;background:var(--tint);border-left:3px solid var(--navy)}
.pl div{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.pl b{font-weight:500;font-size:.9rem;display:block;line-height:1.3}
.pl small{color:var(--muted);font-size:.78rem}
.mini{border:1px solid #CBD3DB;background:#fff;border-radius:2px;padding:4px 10px;font-size:.8rem;font-weight:600;white-space:nowrap}
.mini:hover{border-color:var(--navy)}
.mini.in{border-color:var(--green);color:var(--green)}
.pn{display:flex;justify-content:space-between;gap:8px}
.xc{position:absolute;z-index:5;right:max(16px,env(safe-area-inset-right,0px));top:16px;display:flex;gap:6px;opacity:0;pointer-events:none;transition:opacity .4s}
.hero.ex .xc{opacity:1;pointer-events:auto}
.xc button{background:rgba(255,255,255,.94);border:0;border-radius:2px;padding:8px 12px;font-size:.82rem;font-weight:600;color:var(--navy);box-shadow:0 2px 8px rgba(0,0,0,.15)}
.xc button[aria-pressed="true"]{background:var(--navy);color:#fff}
.mhint{display:none}
@media (max-width:1023px){
  .hero{height:auto;overflow:visible;background:var(--navy)}
  .hero .stage{position:relative;height:clamp(300px,64vw,540px);overflow:hidden;background:#9DB9CF;transition:height .3s}
  .hero.ex .stage{height:clamp(360px,78vw,600px)}
  .scrim{display:none}
  .hcopy{position:relative;inset:auto;display:block;padding-block:30px 78px;background:var(--navy)}
  .hcopy .in{max-width:640px}
  .hcopy p.l{font-size:1rem}
  .hero.ex .hcopy{display:none}
  .cred{display:none}
  .xpanel{position:relative;width:auto;transform:none;display:none;border-right:0}
  .hero.ex .xpanel{display:flex}
  .xb{overflow:visible}
  .xh{position:sticky;top:74px;background:#fff;z-index:2}
  .mhint{display:block;position:absolute;z-index:3;left:50%;bottom:14px;transform:translateX(-50%);background:rgba(15,37,87,.88);color:#fff;font-size:.8rem;font-weight:500;padding:7px 14px;border-radius:20px;white-space:nowrap;border:0}
  .hero.ex .mhint{display:none}
  .xc{top:12px;right:12px;flex-wrap:wrap;justify-content:flex-end;max-width:calc(100% - 24px)}
  .xc button{padding:9px 11px}
}
@media (max-width:480px){.hcopy h1{font-size:1.85rem}.hcopy .cta .btn{flex:1 1 100%}.xh{top:66px}}
@media (min-width:1024px){.hero .stage{position:absolute;inset:0}}
@media (pointer:coarse){
  .hero:not(.ex) canvas{pointer-events:none}
  .hot{width:30px;height:30px;margin:-15px 0 0 -15px;font-size:.78rem}
  .hot .tp{display:none}
  .mini{padding:7px 12px}
  .pc:hover img{transform:none}
}

/* search band */
.sband{position:relative;z-index:7;margin-top:-46px}
@media (max-width:1023px){.sband{margin-top:-52px}}
.hero.ex + .sband{margin-top:0;padding-top:24px}
@media (max-width:700px){.sbox{padding:18px}}
.sbox{background:#fff;box-shadow:0 10px 30px rgba(10,35,66,.12);border:1px solid var(--line);padding:22px 24px;display:grid;grid-template-columns:minmax(0,1fr) 220px auto;gap:10px;align-items:end}
.sbox label{display:block;font-size:.82rem;font-weight:600;margin-bottom:6px}
.sbox .pop{grid-column:1/-1;font-size:.84rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px 14px}
.sbox .pop button{border:0;background:none;padding:0;color:var(--navy);font-weight:500;text-decoration:underline;text-underline-offset:3px}
@media (max-width:700px){.sbox{grid-template-columns:minmax(0,1fr)}}

/* figures */
.figs .wrap{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));padding-block:54px 50px}
.fig{padding:0 20px;border-left:1px solid var(--line)}
.fig:first-child{border-left:0;padding-left:0}
.fig .v{font-size:clamp(1.9rem,3vw,2.5rem);font-weight:300;letter-spacing:-.03em;color:var(--navy);line-height:1}
.fig .k{font-size:.86rem;color:var(--muted);margin-top:8px}
@media (max-width:960px){.figs .wrap{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:28px}.fig:nth-child(4){border-left:0;padding-left:0}}
@media (max-width:520px){.figs .wrap{grid-template-columns:repeat(2,minmax(0,1fr))}.fig:nth-child(odd){border-left:0;padding-left:0}.fig:nth-child(4){border-left:1px solid var(--line);padding-left:20px}}

section.s{padding-block:84px}
.sh{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:36px}
.sh h2{font-size:clamp(1.8rem,3vw,2.5rem)}
.sh p{color:var(--ink-2);max-width:60ch;margin-top:10px}

/* supply */
.photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
@media (max-width:860px){.photos{grid-template-columns:minmax(0,1fr)}}
.pc{text-decoration:none;display:flex;flex-direction:column;gap:14px;cursor:pointer}
.pc .im{aspect-ratio:3/2;max-width:100%;overflow:hidden;background:var(--tint)}
.pc img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.pc:hover img{transform:scale(1.04)}
.pc h3{font-size:1.3rem}
.pc p{color:var(--ink-2);font-size:.95rem}
.links3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);margin-top:44px}
.links3 a{padding:22px 20px 22px 0;text-decoration:none;border-bottom:1px solid var(--line);display:block}
.links3 a+a{padding-left:20px;border-left:1px solid var(--line)}
.links3 b{display:block;font-weight:600;font-size:1.05rem}
.links3 span{font-size:.9rem;color:var(--muted)}
.links3 a:hover b{color:var(--navy);text-decoration:underline}
@media (max-width:760px){.links3{grid-template-columns:minmax(0,1fr)}.links3 a+a{padding-left:0;border-left:0}}

/* tabs */
.tabs{display:flex;gap:0;border-bottom:1px solid #CBD3DB;overflow-x:auto}
.tabs button{border:0;background:none;padding:14px 22px;font-weight:600;font-size:.95rem;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tabs button[aria-selected="true"]{color:var(--navy);border-bottom-color:var(--navy)}
.tpane{background:#fff;border:1px solid var(--line);border-top:0;padding:30px}
@media (max-width:600px){.tabs button{padding:12px 14px;font-size:.9rem}section.s{padding-block:60px}.sh{margin-bottom:26px}}
.tgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:40px}
@media (max-width:860px){.tgrid{grid-template-columns:minmax(0,1fr)}.tpane{padding:20px}}
.tpane h3{font-size:1.4rem}
.tpane p{color:var(--ink-2);margin-top:10px}
.res{font-size:.9rem;margin-top:12px}
.ok{color:var(--green)}.bad{color:var(--red)}
.vt{display:grid;grid-template-columns:minmax(0,1fr);gap:0;border-top:1px solid var(--line);margin-top:16px}
.vt button{text-align:left;border:0;border-bottom:1px solid var(--line);background:none;padding:12px 4px;display:flex;justify-content:space-between;gap:10px;font-weight:500}
.vt button small{color:var(--muted);font-size:.82rem;font-weight:400}
.vt button[aria-pressed="true"]{color:var(--navy);font-weight:700;box-shadow:inset 3px 0 0 var(--navy);padding-left:14px}
.rl{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.rl li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.rl small{display:block;color:var(--muted);font-size:.78rem}
.wk{font-size:4.6rem;font-weight:300;letter-spacing:-.04em;line-height:1;color:var(--navy)}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;font-size:.92rem;margin-top:14px}
.kv dt{color:var(--muted)}.kv dd{margin:0;font-weight:500}

/* finder */
.finder{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);border:1px solid var(--line)}
@media (max-width:960px){.finder{grid-template-columns:minmax(0,1fr)}}
.mapbox{overflow-x:auto;background:#fff;border-right:1px solid var(--line)}
.mapbox svg{display:block;width:100%;min-width:520px;height:auto}
.mapnote{display:none;font-size:.8rem;color:var(--muted);padding:8px 12px;border-bottom:1px solid var(--line)}
@media (max-width:560px){.mapnote{display:block}}
.crect{fill:rgba(10,35,66,.03);stroke:#4D6A88;stroke-width:1.1;cursor:pointer}
.crect:hover{fill:rgba(224,169,27,.12);stroke:var(--gold-ink)}
.crect.on{fill:rgba(224,169,27,.22);stroke:var(--gold-ink);stroke-width:2}
.mt{font-size:10px;fill:var(--ink-2);pointer-events:none;font-family:var(--f)}
.fsel{padding:22px;border-bottom:1px solid var(--line);min-height:150px}
.fsel h3{font-size:1.15rem;margin-top:4px}
.frows{max-height:420px;overflow:auto}
.frow{display:grid;grid-template-columns:70px minmax(0,1fr) auto;gap:10px;width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);background:none;padding:10px 22px;font-size:.88rem;align-items:center}
.frow:hover,.frow.on{background:var(--tint)}
.frow b{font-weight:600}
.frow small{color:var(--muted)}

/* catalogue */
.cat{display:grid;grid-template-columns:230px minmax(0,1fr);gap:32px}
@media (max-width:880px){.cat{grid-template-columns:minmax(0,1fr)}}
.filters{display:flex;flex-direction:column;gap:20px;align-self:start;position:sticky;top:96px}
.ftog{display:none}.fhead,.fdone{display:none}
@media (max-width:880px){
  .ftog{display:inline-flex}
  .filters{display:none;position:fixed;left:0;right:0;bottom:0;top:auto;z-index:92;background:#fff;max-height:82dvh;overflow:auto;padding:20px max(20px,env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) max(20px,env(safe-area-inset-left,0px));box-shadow:0 -10px 40px rgba(0,0,0,.25);border-radius:12px 12px 0 0}
  .filters.open{display:flex}
  .fhead{display:flex;justify-content:space-between;align-items:center}
  .fdone{display:flex;position:sticky;bottom:0}
}
@media (max-width:880px){.filters{position:static}}
.filters h4{font-size:.84rem;font-weight:700;margin-bottom:8px}
.chips{display:flex;flex-direction:column}
.chip{display:flex;justify-content:space-between;border:0;background:none;text-align:left;padding:6px 0;font-size:.92rem;color:var(--ink-2)}
.chip span{color:var(--muted);font-size:.82rem}
.chip[aria-pressed="true"]{color:var(--navy);font-weight:700}
.radio{display:flex;flex-direction:column;gap:6px;font-size:.92rem}
.radio label,.chk{display:flex;gap:8px;align-items:center;font-size:.92rem}
.bar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:16px;font-size:.9rem;color:var(--muted)}
.bar .r{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 22px}
@media (max-width:1150px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.grid{grid-template-columns:minmax(0,1fr)}}
.prod{display:flex;flex-direction:column;gap:6px;min-width:0}
.prod .im{position:relative;aspect-ratio:4/3;max-width:100%;background:var(--tint);overflow:hidden;cursor:pointer}
.prod .im img{width:100%;height:100%;object-fit:cover;display:block}
.prod .tag{position:absolute;left:0;top:10px;background:var(--gold);color:var(--navy);font-size:.72rem;font-weight:600;padding:3px 8px}
.prod .tag.w{background:var(--ink)}
.prod .code{font-size:.8rem;color:var(--muted);margin-top:6px}
.prod h3{font-size:1rem;font-weight:600;line-height:1.35;cursor:pointer}
.prod h3:hover{color:var(--navy);text-decoration:underline}
.prod .meta{font-size:.84rem;color:var(--muted)}
.prod .row{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:6px}
.price{font-weight:600;font-size:.94rem}
.stock{font-size:.82rem;display:inline-flex;align-items:center;gap:6px}
.stock::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.s-in{color:var(--green)}.s-low{color:var(--amber)}.s-order{color:var(--red)}
.tbl{overflow-x:auto;border:1px solid var(--line)}
table{width:100%;border-collapse:collapse;font-size:.9rem;background:#fff}
th{text-align:left;font-weight:600;font-size:.82rem;color:var(--muted);padding:12px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:10px 12px;border-bottom:1px solid var(--line)}
td.c{white-space:nowrap;font-weight:600}
.empty{padding:44px;text-align:center;border:1px dashed #CBD3DB;color:var(--muted)}

/* immersart */
.imm{background:var(--navy);color:#fff}
.imm .wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:56px;align-items:center;padding-block:90px}
@media (max-width:860px){.imm .wrap{grid-template-columns:minmax(0,1fr)}}
.imm h2{font-size:clamp(1.8rem,3vw,2.5rem)}
.imm p{color:#C9D4E1;margin-top:16px;max-width:56ch;font-weight:300;font-size:1.05rem}
.imm ul{margin:22px 0 0;padding:0;list-style:none;display:grid;gap:8px}
.imm li{padding-left:18px;position:relative;color:#E2E9F1}
.imm li::before{content:"";position:absolute;left:0;top:.65em;width:8px;height:1px;background:#fff}
.scope{position:relative;width:min(380px,100%);aspect-ratio:1;max-width:100%;margin:0 auto;border-radius:50%;background:radial-gradient(circle,#0F2D4F,#071A30 70%);border:1px solid #2E4C70;overflow:hidden}
.scope .r{position:absolute;inset:0;border-radius:50%;background:repeating-radial-gradient(circle,transparent 0 16%,rgba(160,190,220,.18) 16% 16.35%)}
.scope .x{position:absolute;inset:0;background:linear-gradient(90deg,transparent 49.8%,rgba(160,190,220,.2) 49.8% 50.2%,transparent 50.2%),linear-gradient(0deg,transparent 49.8%,rgba(160,190,220,.2) 49.8% 50.2%,transparent 50.2%)}
.scope .sw{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(140,220,180,.35),transparent 18%);animation:sw 5s linear infinite}
.scope .b{position:absolute;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 10px #fff}
.scope .t{position:absolute;font-size:.66rem;color:#A9C4E0}
@keyframes sw{to{transform:rotate(360deg)}}

/* about */
.about{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:64px}
@media (max-width:880px){.about{grid-template-columns:minmax(0,1fr);gap:36px}}
.about h2{font-size:clamp(1.8rem,3vw,2.5rem)}
.about .txt p{color:var(--ink-2);margin-top:16px;max-width:60ch}
.facts{border-top:2px solid var(--navy)}
.facts div{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.facts dt{color:var(--muted)}.facts dd{margin:0;font-weight:600;text-align:right}
.tline{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:64px;border-top:1px solid #CBD3DB}
.tline div{padding:18px 18px 0 0;position:relative}
.tline div::before{content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--navy)}
.tline b{display:block;font-size:1.4rem;font-weight:300;color:var(--navy);letter-spacing:-.02em}
.tline span{font-size:.9rem;color:var(--ink-2)}
@media (max-width:760px){.tline{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:24px}}

/* contact */
.contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:56px}
@media (max-width:880px){.contact{grid-template-columns:minmax(0,1fr);gap:32px}}
.contact h2{font-size:clamp(1.8rem,3vw,2.5rem)}
.cl{margin-top:26px;display:grid;gap:18px}
.cl dt{font-size:.84rem;color:var(--muted)}
.cl dd{margin:2px 0 0;display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center}
.cl .ph{font-size:clamp(1.2rem,4.6vw,1.45rem);font-weight:500;user-select:all;letter-spacing:-.01em}
.cform{background:#fff;border:1px solid var(--line);padding:30px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.cform .full{grid-column:1/-1}
.cform label{display:block;font-size:.84rem;font-weight:600;margin-bottom:6px}
@media (max-width:540px){.cform{grid-template-columns:minmax(0,1fr);padding:20px}}
.note{grid-column:1/-1;font-size:.88rem;padding:12px 14px;background:#EEF3F8;border-left:3px solid var(--navy)}

footer{background:#0A1B40;color:#AFBCCB;font-size:.9rem}
footer .wrap{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));gap:32px;padding-block:56px}
@media (max-width:820px){footer .wrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
footer h4{color:#fff;font-size:.95rem;margin-bottom:14px}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
footer a{text-decoration:none}footer a:hover{color:#fff;text-decoration:underline}
.legal{border-top:1px solid #1E3361}
.legal .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding-block:16px;font-size:.8rem}

.wa{position:fixed;z-index:60;right:calc(20px + env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));width:56px;height:56px;border-radius:50%;background:#25D366;display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.22)}
.wa svg{width:30px;height:30px}

.ov{position:fixed;inset:0;background:rgba(7,26,48,.55);z-index:80}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:90;width:min(460px,100%);background:#fff;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);padding-right:env(safe-area-inset-right,0px)}
.drawer .hd{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--line)}
.drawer .hd h3{font-size:1.3rem}
.x{border:1px solid var(--line);background:#fff;width:36px;height:36px;border-radius:2px;font-size:1.1rem}
.dbd{overflow:auto;flex:1;padding:18px 24px;display:flex;flex-direction:column;gap:18px}
.qi{display:grid;grid-template-columns:minmax(0,1fr) 60px auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.qi b{font-weight:600;font-size:.9rem;display:block;line-height:1.3}.qi small{color:var(--muted);font-size:.78rem}
.qi input{padding:6px;border:1px solid #CBD3DB;width:100%;font:inherit}
.rm{border:0;background:none;color:var(--red);font-weight:600;font-size:.84rem}
.qf{display:grid;gap:12px}
.qf label{display:block;font-size:.82rem;font-weight:600;margin-bottom:5px}
.r2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.err{color:var(--red);font-size:.8rem;margin-top:4px}
.modal{position:fixed;inset:0;z-index:95;display:grid;place-items:center;padding:16px}
.mbox{position:relative;background:#fff;width:min(760px,100%);max-height:90%;overflow:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
@media (max-width:640px){.modal{place-items:end center;padding:0}.mbox{grid-template-columns:minmax(0,1fr);max-height:92dvh;border-radius:12px 12px 0 0}.mbox .mi{min-height:0;aspect-ratio:16/9}.mbox .mc{padding:20px 20px calc(24px + env(safe-area-inset-bottom,0px))}}
.mbox .x{position:absolute;top:10px;right:10px;z-index:2}
.mbox .mi{background:var(--tint);min-height:220px}.mbox .mi img{width:100%;height:100%;object-fit:cover;display:block}
.mbox .mc{padding:28px;display:grid;gap:14px;align-content:start}
.mbox h3{font-size:1.45rem;padding-right:30px}
.spec{display:grid;grid-template-columns:auto 1fr;gap:8px 20px;margin:0;font-size:.92rem}
.spec dt{color:var(--muted)}.spec dd{margin:0;font-weight:500}
.cert{grid-column:1/-1;margin:28px;border:1px solid var(--navy);padding:44px;text-align:center}
.cert h4{font-size:2rem;font-weight:300;margin:10px 0}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:99;background:var(--navy);color:#fff;padding:11px 18px;font-size:.9rem;font-weight:500}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* brighter colour layer */
.util{background:linear-gradient(90deg,#0D3A8C,#1652C4 55%,#0B8FB8)}
.btn.gold{background:#F4B400;border-color:#F4B400;color:#0D2A60}
.btn.gold:hover{background:#FFC72C}
.scrim{background:linear-gradient(90deg,rgba(13,58,140,.86) 0%,rgba(13,58,140,.55) 36%,rgba(13,58,140,0) 64%)}
@media (max-width:1023px){.hero{background:linear-gradient(135deg,#0D3A8C,#1652C4 60%,#0B8FB8)}.hcopy{background:transparent}}
.sbox{border-top:4px solid #F4B400}
.fig .v{font-weight:400}
.fig:nth-child(1) .v{color:#1652C4}.fig:nth-child(2) .v{color:#0B8FB8}.fig:nth-child(3) .v{color:#F0624D}.fig:nth-child(4) .v{color:#C98A00}.fig:nth-child(5) .v{color:#0D3A8C}.fig:nth-child(6) .v{color:#1A9E6A}
.figs{background:linear-gradient(180deg,#fff,#F3FAFD)}
.pc .im{border-top:5px solid #1652C4}.pc:nth-child(2) .im{border-top-color:#0BA3C7}.pc:nth-child(3) .im{border-top-color:#F4B400}
.links3 a{border-top:3px solid transparent}.links3 a:nth-child(1){border-top-color:#0BA3C7}.links3 a:nth-child(2){border-top-color:#F0624D}.links3 a:nth-child(3){border-top-color:#1A9E6A}
.tabs button[aria-selected="true"]{color:#0B7FA3;border-bottom-color:#0BA3C7}
.tpane{border-top:0;box-shadow:0 8px 24px rgba(11,143,184,.08)}
.chip[aria-pressed="true"]{color:#1652C4}
.prod .im{border-bottom:3px solid #0BA3C7}
.imm{background:linear-gradient(135deg,#0D3A8C 0%,#1652C4 55%,#0BA3C7 100%)}
.imm p{color:#E3EEFF}
#about{background:var(--sand)}
.facts{border-top-color:#0BA3C7}
.tline div::before{background:#F4B400;box-shadow:0 0 0 3px #fff}
.tline b{color:#1652C4}
footer{background:linear-gradient(160deg,#0D3A8C,#0A2E70)}
.legal{border-top-color:rgba(255,255,255,.15)}
.xl .no{background:#1652C4}
.xd .req{border-left-color:#0BA3C7;background:#EAF6FB}
.note{background:#EAF6FB;border-left-color:#0BA3C7}
.lead{font-size:1.12rem;color:var(--ink);font-weight:500}
.known{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:22px}
.known div{background:#fff;padding:16px;border-left:4px solid #0BA3C7}
.known div:nth-child(2){border-left-color:#F4B400}.known div:nth-child(3){border-left-color:#F0624D}.known div:nth-child(4){border-left-color:#1652C4}
.known b{display:block;font-size:.98rem;margin-bottom:4px}
.known p{margin:0!important;font-size:.9rem;color:var(--ink-2)}
@media (max-width:600px){.known{grid-template-columns:minmax(0,1fr)}}
/* mega menu */
#hdr .wrap{position:static}
nav#mainnav{display:flex;gap:2px;margin-left:auto;align-items:stretch}
.nt{display:flex;align-items:center;gap:6px;background:none;border:0;border-bottom:2px solid transparent;font-weight:600;font-size:.92rem;padding:26px 10px;text-decoration:none;color:var(--ink)}
.nt.dd::after{content:"";width:6px;height:6px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(45deg);margin-top:-3px;transition:transform .2s}
.ni.open .nt.dd::after{transform:rotate(-135deg);margin-top:3px}
.nt:hover,.ni.open .nt{color:var(--navy-2);border-bottom-color:#F4B400}
.nt[aria-current="page"]{color:var(--navy-2);border-bottom-color:var(--navy-2)}
.mega{position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--line);box-shadow:0 22px 44px rgba(13,58,140,.16);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .18s,transform .18s,visibility .18s;z-index:60}
.ni.open .mega{opacity:1;visibility:visible;transform:none}
.mega-in{display:grid;grid-template-columns:270px minmax(0,1fr);gap:30px;padding-block:26px 30px}
.mega-intro{background:linear-gradient(135deg,#0D3A8C,#1652C4 60%,#0BA3C7);color:#fff;padding:22px;border-radius:4px;display:flex;flex-direction:column;gap:10px}
.mega-intro b{font-size:1.2rem}.mega-intro p{color:#E3EEFF;font-size:.9rem}
.mega-intro a{color:#fff;font-weight:700;text-decoration:none;margin-top:auto}
.mega-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 14px;align-content:start}
.mega-links a{display:grid;grid-template-columns:10px minmax(0,1fr);gap:4px 10px;padding:11px 12px;border-radius:4px;text-decoration:none}
.mega-links a:hover{background:#EAF6FB}
.mega-links a i{width:10px;height:10px;border-radius:50%;background:var(--c,#1652C4);margin-top:5px}
.mega-links a b{font-size:.93rem;font-weight:600}
.mega-links a small{grid-column:2;color:var(--muted);font-size:.8rem;line-height:1.35}
#mainnav .mega a{border-bottom:0}
#hdr .mega-in{display:grid;height:auto;gap:30px}
.qi2{display:none}
.hband{background:linear-gradient(90deg,#0BA3C7,#1652C4);color:#fff}
.hband .wrap,.cta2 .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding-block:40px}
.hband h2,.cta2 h2{font-size:clamp(1.5rem,2.6vw,2rem)}
.hband p,.cta2 p{color:#E3EEFF;margin-top:6px}
.cta2{background:linear-gradient(135deg,#0D3A8C,#1652C4 60%,#0B8FB8);color:#fff}
.ctab{display:flex;gap:10px;flex-wrap:wrap}
.pil{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.pil article{background:linear-gradient(160deg,#fff 60%,#F3FAFD);border:1px solid var(--line);border-top:6px solid var(--c);padding:26px;display:flex;flex-direction:column;gap:10px}
.ptag{font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--c)}
.pil article:nth-child(4) .ptag{color:#9A6D00}
.pil h3{font-size:1.45rem}.pil p{color:var(--ink-2)}
.pil .more{margin-top:auto}
.plist2{list-style:none;margin:2px 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.plist2 li{background:#EAF6FB;color:#0D3A8C;font-size:.82rem;font-weight:600;padding:4px 10px;border-radius:14px}
@media (max-width:760px){.pil{grid-template-columns:minmax(0,1fr)}}
:root,:root[data-theme]{color-scheme:light!important}
input,select,textarea{background-color:#fff!important;color:#13202F!important;color-scheme:light}
input::placeholder,textarea::placeholder{color:#7A8594!important;opacity:1}
.alert input{border:1px solid #fff}
.srch-bar input{border:1px solid #CBD3DB;border-radius:2px;padding:10px 12px}
#xBack::after{content:none}
@media (max-width:340px){.sbtn{display:none!important}.brand b{font-size:.84rem}}
@media (max-width:480px){.hcopy .cta .btn{white-space:normal;text-align:center}}
@media (max-width:400px){.ql2{display:none!important}.qi2{display:block}.sbtn,.burger{width:40px;height:40px}}
.brand b,.brand small{white-space:nowrap}
@media (max-width:400px){.brand small{font-size:.66rem}.brand b{font-size:.9rem}.logo{width:34px}header .wrap{gap:8px}.qb{padding:8px}}
.mega-intro a{padding:0!important}
.sbtn{width:42px;height:42px;border:1px solid var(--line);background:#fff;border-radius:2px;display:grid;place-items:center;color:var(--navy);flex:none}
.sbtn:hover{border-color:var(--navy-2)}
@media (max-width:1240px){.nt{padding-inline:8px;font-size:.88rem}.mega-links{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1080px){nav#mainnav{display:none}.sbtn{margin-left:auto}.qb{margin-left:0}}
@media (max-width:480px){.sbtn{width:40px;height:40px}}
/* mobile accordion */
.mnav .wrap{display:block!important;padding-block:6px 20px}
.macc{border-bottom:1px solid var(--line)}
.macc>a,.macc>button{display:flex;width:100%;justify-content:space-between;align-items:center;padding:15px 0;border:0;background:none;font-weight:700;font-size:1.02rem;text-decoration:none;color:var(--ink);text-align:left}
.macc>button::after{content:"";width:8px;height:8px;border-right:2px solid var(--navy);border-bottom:2px solid var(--navy);transform:rotate(45deg);transition:transform .2s}
.macc>button[aria-expanded="true"]::after{transform:rotate(-135deg)}
.msub{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 16px;padding:0 0 14px}
.msub a{display:flex;gap:8px;align-items:center;padding:10px 8px;border-radius:4px;text-decoration:none;font-weight:500;font-size:.94rem;background:#F3F8FC}
.msub a i{width:8px;height:8px;border-radius:50%;background:var(--c,#1652C4);flex:none}
@media (max-width:560px){.msub{grid-template-columns:minmax(0,1fr)}}
.mnav .call{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
/* page banner */
.pban{background:linear-gradient(120deg,#0D3A8C,#1652C4 60%,#0BA3C7);color:#fff}
.pban .wrap{padding-block:46px 40px}
.crumb{font-size:.84rem;color:#CFE3FF}.crumb a{color:#fff}
.pban h1{font-size:clamp(2rem,4.4vw,3.2rem);margin-top:10px;letter-spacing:-.02em}
.pban .pl{margin-top:12px;max-width:60ch;color:#E3EEFF;font-size:1.05rem}
.pjump{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.pjump a{color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.55);padding:7px 14px;border-radius:20px;font-size:.88rem;font-weight:600}
.pjump a:hover{background:rgba(255,255,255,.14)}
/* new editions strip */
.strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,250px);gap:16px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x mandatory}
.strip .prod{scroll-snap-align:start;background:#fff}
/* home services */
.hsv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.hsv a{background:#fff;padding:20px;border-top:4px solid var(--c);text-decoration:none;display:grid;gap:4px;box-shadow:0 6px 18px rgba(13,58,140,.06);transition:transform .2s}
.hsv a:hover{transform:translateY(-3px)}
.hsv b{font-size:1.05rem}.hsv span{color:var(--muted);font-size:.9rem}
@media (max-width:860px){.hsv{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.hsv{grid-template-columns:minmax(0,1fr)}}
/* services */
.svcg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.sv{background:#fff;border:1px solid var(--line);border-top:5px solid var(--c);padding:24px;display:flex;flex-direction:column;gap:10px;scroll-margin-top:96px}
.sv h3{font-size:1.3rem}.sv p{color:var(--ink-2)}
.sva{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:6px}
@media (max-width:760px){.svcg{grid-template-columns:minmax(0,1fr)}}
/* company */
.mv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.mv div{padding:28px;background:linear-gradient(135deg,#fff,#EAF6FB);border-left:5px solid var(--c)}
.mtag{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--c)}
.mv p{font-size:1.2rem;margin-top:10px;font-weight:500}
.why{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.why div{background:#fff;padding:20px;border-top:4px solid var(--c)}
.why b{display:block;font-size:1.02rem}.why p{color:var(--ink-2);margin-top:6px;font-size:.92rem}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;counter-reset:st}
.steps li{counter-increment:st;position:relative;padding:58px 18px 20px;background:#fff;border:1px solid var(--line)}
.steps li::before{content:counter(st);position:absolute;left:18px;top:16px;width:32px;height:32px;border-radius:50%;background:#1652C4;color:#fff;display:grid;place-items:center;font-weight:700}
.steps li:nth-child(2)::before{background:#0BA3C7}.steps li:nth-child(3)::before{background:#F4B400;color:#0D2A60}.steps li:nth-child(4)::before{background:#1A9E6A}
.steps b{display:block}.steps span{display:block;color:var(--ink-2);font-size:.9rem;margin-top:6px}
.regions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.regions div{background:#fff;padding:18px 20px;border-left:4px solid #0BA3C7}
.regions div:nth-child(2n){border-left-color:#F4B400}.regions div:nth-child(3n){border-left-color:#1652C4}
.regions b{display:block}.regions span{color:var(--ink-2);font-size:.9rem}
.faq{display:grid;gap:10px;max-width:860px}
.faq details{background:#fff;border:1px solid var(--line);border-left:4px solid #0BA3C7;padding:0 20px}
.faq summary{cursor:pointer;padding:16px 0;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::after{content:"+";font-size:1.3rem;line-height:1;color:#1652C4}
.faq details[open] summary::after{content:"−"}
.faq details p{padding-bottom:16px;color:var(--ink-2)}
@media (max-width:960px){.why,.regions{grid-template-columns:repeat(2,minmax(0,1fr))}.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.why,.regions,.steps,.mv{grid-template-columns:minmax(0,1fr)}}
/* footer alert, back to top, search */
.alert{margin-top:20px;display:grid;gap:8px}
.alert label{color:#fff;font-weight:600;font-size:.9rem}
.alert div{display:flex;gap:8px;flex-wrap:wrap}
.alert input{flex:1;min-width:180px;padding:10px 12px;border:0;border-radius:2px;font:inherit}
.alert p{color:#E3EEFF;font-size:.84rem}
.totop{position:fixed;z-index:60;right:calc(26px + env(safe-area-inset-right,0px));bottom:calc(88px + env(safe-area-inset-bottom,0px));width:42px;height:42px;border-radius:50%;border:0;background:#0D3A8C;color:#fff;display:grid;place-items:center;box-shadow:0 6px 16px rgba(0,0,0,.2)}
.srch{position:fixed;inset:0;z-index:96;background:rgba(7,26,48,.55)}
.srch-in{background:#fff;padding-top:env(safe-area-inset-top,0px);box-shadow:0 20px 40px rgba(0,0,0,.2);max-height:85dvh;overflow:auto}
.srch-bar{display:flex;align-items:center;gap:12px;padding-block:18px;border-bottom:1px solid var(--line);color:var(--navy)}
.srch-bar input{flex:1;min-width:0;border:0;font:inherit;font-size:1.15rem;padding:8px 0;color:var(--ink)}
.srch-bar input:focus{outline:none}
.srch-res{padding-block:10px 22px;display:grid;gap:18px}
.srch-res h5{margin:0 0 6px;font-size:.76rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.srch-res a{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:4px;text-decoration:none}
.srch-res a:hover,.srch-res a:focus{background:#EAF6FB;outline:none}
.srch-res a small{color:var(--muted)}
.page{animation:pgin .3s ease}
@keyframes pgin{from{opacity:.4}to{opacity:1}}
section[id],div[id].page{scroll-margin-top:84px}

/* ---- backend-connected parts ---- */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.news{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.nw{background:#fff;border:1px solid var(--line);border-top:4px solid #0BA3C7;padding:18px;text-decoration:none;display:grid;gap:6px;align-content:start;transition:transform .2s}
.nw:hover{transform:translateY(-3px)}
.nw img{width:100%;aspect-ratio:16/9;object-fit:cover;margin:-4px 0 6px}
.nw .nk{font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#0B7FA3}
.nw b{font-size:1.08rem}.nw span:last-child{color:var(--ink-2);font-size:.92rem}
@media (max-width:860px){.news{grid-template-columns:minmax(0,1fr)}}
.soc{display:flex;gap:14px;flex-wrap:wrap;margin-top:12px}.soc a{color:#fff;font-weight:600}
.qdone{background:#E3F5EC;border-left:4px solid #1A9E6A;padding:16px}
.qdone p{margin-top:8px;color:var(--ink-2)}
.ref{font-size:1.25rem;font-weight:700;letter-spacing:.04em;color:var(--navy)}
.trk{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:22px;align-items:start}
@media (max-width:860px){.trk{grid-template-columns:minmax(0,1fr)}}
.card{background:#fff;border:1px solid var(--line)}
.tform{padding:22px;display:grid;gap:14px}
.tform label{display:block;font-size:.84rem;font-weight:600;margin-bottom:6px}
.tcard{padding:22px;display:grid;gap:20px}
.thead{display:flex;flex-wrap:wrap;gap:16px 34px}
.thead .mute{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}
.pill2{display:inline-block;background:#1A9E6A;color:#fff;font-weight:700;font-size:.86rem;padding:4px 12px;border-radius:14px;margin-top:4px}
.pill2.x{background:#B42318}
.tsteps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.tsteps li{display:grid;gap:8px;font-size:.78rem;color:var(--muted);text-align:center}
.tsteps i{height:8px;border-radius:4px;background:#E1E6EB}
.tsteps li.done i{background:#1A9E6A}.tsteps li.done{color:var(--ink)}
.tsteps li.cur i{background:#F4B400}.tsteps li.cur{color:var(--ink);font-weight:700}
@media (max-width:640px){.tsteps{grid-template-columns:minmax(0,1fr)}.tsteps li{grid-template-columns:40px minmax(0,1fr);text-align:left;align-items:center}}
.tgrid2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px}
@media (max-width:760px){.tgrid2{grid-template-columns:minmax(0,1fr)}}
.tgrid2 h4{margin:0 0 10px;font-size:.84rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.tev,.tit{list-style:none;margin:0;padding:0}
.tev li{border-left:3px solid #0BA3C7;padding:0 0 14px 14px}
.tev small{display:block;color:var(--muted)}.tev p{margin-top:4px;color:var(--ink-2)}
.tit li{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
.tit small{color:var(--muted)}
button:disabled{opacity:.6;cursor:wait}

/* ---------- multi-page additions ---------- */
.catnav{border-bottom:1px solid var(--line);background:#fff}
.catnav .wrap,.catnav:not(section){display:flex;gap:8px;flex-wrap:wrap;padding-top:14px;padding-bottom:14px}
.catnav a{--c:var(--navy);display:inline-flex;align-items:center;padding:8px 14px;border:1px solid var(--line);border-radius:999px;font-size:.88rem;font-weight:500;color:var(--ink);text-decoration:none;background:#fff}
.catnav a:hover{border-color:var(--c);color:var(--c)}
.catnav a.on{background:var(--c);border-color:var(--c);color:#fff}
.pdp{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:44px;align-items:start}
.pdp-img{position:relative;background:var(--tint);border:1px solid var(--line);aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;overflow:hidden}
.pdp-img img{width:100%;height:100%;object-fit:contain;padding:18px}
.pdp-img .tag{position:absolute;top:14px;left:14px}
.pdp-info{display:flex;flex-direction:column;gap:14px}
.pdp-price{font-size:1.9rem;font-weight:700;color:var(--navy)}
.pdp-actions{display:flex;gap:10px;flex-wrap:wrap}
.pdp .spec{border-top:1px solid var(--line);padding-top:16px}
.prose{max-width:72ch;line-height:1.7}
.prose p{margin:0 0 1em}
.prose h2{font-size:1.35rem;margin:1.6em 0 .5em;color:var(--navy)}
.prose h2:first-child{margin-top:0}
.prose ul{margin:0 0 1em;padding-left:1.2em}
.prose li{margin:.3em 0}
.pbody{padding-bottom:0}
.svc-page{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:48px;align-items:start}
.svc-side{display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);background:#fff;padding:20px;position:sticky;top:110px}
.svc-side b{margin-bottom:6px}
.svc-side a{--c:var(--navy);padding:9px 12px;border-left:3px solid var(--c);text-decoration:none;color:var(--ink);font-size:.92rem;background:var(--tint)}
.svc-side a:hover{color:var(--c)}
.grid.rel{grid-template-columns:repeat(4,minmax(0,1fr))}
.pager{display:flex;gap:14px;align-items:center;justify-content:center;margin-top:30px}
.prod h3 a{color:inherit}
.prod h3 a:hover{color:var(--navy)}
@media (max-width:960px){.pdp,.svc-page{grid-template-columns:minmax(0,1fr);gap:28px}.svc-side{position:static}.grid.rel{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.grid.rel{grid-template-columns:minmax(0,1fr)}.pdp-actions .btn{flex:1 1 100%}.catnav a{font-size:.82rem;padding:7px 11px}}
/* book list and charts */
.bl-top{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:16px}
.bl-search{flex:1 1 360px;max-width:560px}.bl-search input{width:100%}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.bl-jump{display:flex;flex-wrap:wrap;gap:6px;padding:14px 0 22px;border-bottom:1px solid var(--line);margin-bottom:10px}
.bl-jump a{font-size:.84rem;padding:6px 11px;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:var(--ink);background:#fff}
.bl-jump a:hover{border-color:var(--navy);color:var(--navy)}.bl-jump span{color:var(--muted);margin-left:3px}
.bl-sec{padding-top:26px;scroll-margin-top:110px}.bl-sec h2{font-size:1.3rem;color:var(--navy);margin:0 0 10px;padding-bottom:8px;border-bottom:3px solid #0E8A6A;display:inline-block}
.bl-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
.bl-list li{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding:9px 0}
.bl-list a{flex:1;display:flex;gap:12px;text-decoration:none;color:var(--ink);min-width:0;line-height:1.4}
.bl-list a:hover span{color:var(--navy);text-decoration:underline}
.bl-list b{flex:0 0 auto;min-width:92px;color:var(--navy);font-size:.88rem;font-weight:600;padding-top:1px}
.bl-list small{color:var(--muted);font-size:.78rem}.bl-list small.dig{color:#0B7FA3;font-weight:600}
.bl-list .mini{flex:0 0 auto}
.tblwrap{overflow-x:auto;background:#fff;border:1px solid var(--line)}
.ctable{width:100%;border-collapse:collapse;font-size:.95rem}
.ctable th{text-align:left;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:12px 14px;border-bottom:1px solid var(--line);background:#F7FAFD}
.ctable td{padding:11px 14px;border-bottom:1px solid var(--line)}.ctable tr:last-child td{border-bottom:0}
.ctable a{color:var(--ink);text-decoration:none}.ctable a:hover{color:var(--navy);text-decoration:underline}.ctable td b{color:var(--navy)}.ctable .r{text-align:right}
@media (max-width:860px){.bl-list{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.hide-s{display:none}.bl-list b{min-width:74px;font-size:.8rem}.bl-list a{gap:8px;font-size:.92rem}}
.bl-list li[hidden],.bl-sec[hidden],.bl-jump[hidden]{display:none}
.legal a{color:inherit;text-decoration:underline;text-underline-offset:2px}.legal a:hover{color:#F4B400}