/* Modernize Studio v3 (compatibility build: fallbacks precede modern declarations). Self-hosted fonts: Bricolage Grotesque and IBM Plex Sans (SIL OFL 1.1). */
@font-face{font-family:"Bricolage";font-style:normal;font-weight:400 800;font-stretch:75% 100%;font-display:swap;src:url(/assets/dist/bricolage.3a44359e13.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:100 700;font-stretch:100%;font-display:swap;src:url(/assets/dist/plex-sans-latin.e2291e842c.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --bg:#f2f5f4;
  --bg-rgb:242,245,244; --bg-2:#e7edeb; --bg-2-rgb:231,237,235; --surface:#fff; --surface-rgb:255,255,255; --ink:#13213a; --ink-rgb:19,33,58; --ink-2:#33415a; --ink-2-rgb:51,65,90; --muted:#55627a; --muted-rgb:85,98,122;
  --line:#d3dcda;
  --line-rgb:211,220,218; --line-2:#b7c4c1; --line-2-rgb:183,196,193; --teal:#0f6f66; --teal-rgb:15,111,102; --teal-2:#0b524c; --teal-2-rgb:11,82,76; --teal-soft:#d6ebe7; --teal-soft-rgb:214,235,231; --on-teal:#fff; --on-teal-rgb:255,255,255;
  --tip:#ffffe1;
  --tip-rgb:255,255,225; --tip-line:#d6cf93; --tip-line-rgb:214,207,147; --tip-ink:#4a4410; --tip-ink-rgb:74,68,16; --navy:#0a246a; --navy-rgb:10,36,106; --focus:#0a246a; --focus-rgb:10,36,106;
  --dark:#13213a;
  --dark-rgb:19,33,58; --dark-2:#1b2c4a; --dark-2-rgb:27,44,74; --on-dark:#eef3f5; --on-dark-rgb:238,243,245; --on-dark-2:#b9c6d6; --on-dark-2-rgb:185,198,214;
  --ok:#1f7a4d;
  --ok-rgb:31,122,77; --ok-soft:#e3f3ea; --ok-soft-rgb:227,243,234;
  --f-body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-disp:"Bricolage","IBM Plex Sans",system-ui,sans-serif;
  --gut:max(16px,min(4vw,48px)); --wrap:1200px; --head:64px;
  --shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#0e1727;
    --bg-rgb:14,23,39; --bg-2:#121e33; --bg-2-rgb:18,30,51; --surface:#172439; --surface-rgb:23,36,57; --ink:#e8eef2; --ink-rgb:232,238,242; --ink-2:#c8d3dc; --ink-2-rgb:200,211,220; --muted:#a2afbe; --muted-rgb:162,175,190;
    --line:#26364f;
    --line-rgb:38,54,79; --line-2:#3a4d6e; --line-2-rgb:58,77,110; --teal:#5cc3b6; --teal-rgb:92,195,182; --teal-2:#8fdcd2; --teal-2-rgb:143,220,210; --teal-soft:#16393c; --teal-soft-rgb:22,57,60; --on-teal:#062420; --on-teal-rgb:6,36,32;
    --tip:#2b2913;
    --tip-rgb:43,41,19; --tip-line:#5c5524; --tip-line-rgb:92,85,36; --tip-ink:#f1e7a6; --tip-ink-rgb:241,231,166; --focus:#9cc0ff; --focus-rgb:156,192,255;
    --dark:#0a1220;
    --dark-rgb:10,18,32; --dark-2:#14223a; --dark-2-rgb:20,34,58; --ok:#6fcf9b; --ok-rgb:111,207,155; --ok-soft:#173528; --ok-soft-rgb:23,53,40;
    --shadow:0 1px 2px rgba(0,0,0,.3),0 18px 40px -22px rgba(0,0,0,.7);
    color-scheme:dark;
  }
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(64px + 16px);scroll-padding-top:calc(var(--head) + 16px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:#f2f5f4;background:var(--bg);color:#13213a;color:var(--ink);font:400 17px/1.6 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:400 17px/1.6 var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
@media (max-width:600px){body{font-size:16px}}
img,svg{max-width:100%}
a{color:#0b524c;color:var(--teal-2);text-underline-offset:.18em;text-decoration-thickness:1px}
@media (prefers-color-scheme:dark){a{color:#0b524c;color:var(--teal-2)}}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
.no-fv :focus{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
p{margin:0 0 1em}
h1,h2,h3{margin:0;font-weight:700;text-wrap:balance}
h1,h2{font-family:"Bricolage","IBM Plex Sans",system-ui,sans-serif;font-family:var(--f-disp);letter-spacing:-.022em}
h2{font-size:2rem;font-size:max(2rem,min(1.25rem + 2.3vw,3.15rem));line-height:1.04;font-weight:740}
h3{font-size:1.125rem;line-height:1.3;font-weight:600}
[lang=de] h1,[lang=de] h2{font-stretch:88%}
.wrap{max-width:1200px;max-width:var(--wrap);width:calc(100% - 2*16px);width:min(var(--wrap),100% - 2*var(--gut));margin-left:auto;margin-right:auto}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:12px;top:-80px;z-index:100;background:#fff;background:var(--surface);color:#13213a;color:var(--ink);padding:10px 14px;border-radius:8px;box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow)}
.skip:focus{top:12px}
.sprite{position:absolute;width:0;height:0;overflow:hidden}

/* buttons */
.btn{--b:var(--teal);--b-rgb:var(--teal-rgb);display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:48px;padding:.7em 1.25em;border-radius:10px;border:1.5px solid var(--b);background:var(--b);color:#fff;color:var(--on-teal);font:600 1rem/1.2 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:600 1rem/1.2 var(--f-body);text-decoration:none;cursor:pointer;transition:transform .18s cubic-bezier(.2,.8,.2,1), box-shadow .18s, background-color .18s;text-align:center}
.no-flexgap .btn>:not(:last-child),.no-flexgap .btn>:only-child{margin-right:.55em}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px -10px rgba(var(--b-rgb),0.8);box-shadow:0 8px 20px -10px color-mix(in srgb,var(--b) 80%,transparent);text-decoration:none}
.btn:active{transform:translateY(0)}
.btn .ic{width:1.15em;height:1.15em;transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.btn:hover .ic{transform:translateX(2px)}
.btn:active{transform:translateY(0) scale(.985)}
.btn.ghost{background:transparent;color:#13213a;color:var(--ink);border-color:#b7c4c1;border-color:var(--line-2)}
.btn.ghost:hover{border-color:#13213a;border-color:var(--ink);box-shadow:none}
.ic{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* header */
.site-head{position:sticky;top:0;z-index:40;background:#f2f5f4;background:var(--bg);border-bottom:1px solid transparent;transition:border-color .25s}
.site-head.scrolled{border-bottom-color:#d3dcda;border-bottom-color:var(--line)}
.hd{display:flex;align-items:center;gap:.5rem;gap:max(.5rem,min(1.4vw,1.25rem));height:64px;height:var(--head)}
.no-flexgap .hd>:not(:last-child),.no-flexgap .hd>:only-child{margin-right:.5rem;margin-right:max(.5rem,min(1.4vw,1.25rem))}
.brand{display:inline-flex;align-items:center;gap:.5rem;color:#13213a;color:var(--ink);text-decoration:none;white-space:nowrap;border-radius:8px}
.no-flexgap .brand>:not(:last-child),.no-flexgap .brand>:only-child{margin-right:.5rem}
.logo-sym{width:30px;height:30px;flex:none;overflow:visible}
.lp{fill:#13213a;fill:var(--ink)}.ls{fill:#0f6f66;fill:var(--teal)}
.logo-word{font:470 1.13rem/1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:470 1.13rem/1 var(--f-disp);letter-spacing:-.018em;color:#33415a;color:var(--ink-2)}
.logo-word b{font-weight:760;color:#13213a;color:var(--ink)}
.brand:hover .ls{transform:translateY(-1px)}
.ls{transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.brand{margin-right:0}
.secnav{display:flex;gap:.15rem}
.no-flexgap .secnav>:not(:last-child),.no-flexgap .secnav>:only-child{margin-right:.15rem}
.secnav a{position:relative;color:#33415a;color:var(--ink-2);text-decoration:none;font-size:.93rem;font-weight:500;white-space:nowrap;padding:.5em .75em;border-radius:8px;transition:color .2s, background-color .2s}
.secnav a:hover{color:#13213a;color:var(--ink);background:rgba(var(--ink-rgb),0.06);background:color-mix(in srgb,var(--ink) 6%,transparent)}
.secnav a.on{color:#13213a;color:var(--ink)}
.secnav a::after{content:"";position:absolute;left:.75em;right:.75em;bottom:.2em;height:2px;border-radius:2px;background:#0f6f66;background:var(--teal);transform:scaleX(0);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.secnav a.on::after{transform:scaleX(1)}
.hd-cta{min-height:40px;padding:.45em .95em;font-size:.92rem}
.lang{position:relative}
.secnav + .lang{margin-left:0}
.lang summary{list-style:none;display:flex;align-items:center;gap:.35em;cursor:pointer;min-height:40px;padding:0 .6em;border-radius:8px;font-weight:600;font-size:.9rem;color:#33415a;color:var(--ink-2);border:1px solid #d3dcda;border:1px solid var(--line)}
.no-flexgap .lang summary>:not(:last-child),.no-flexgap .lang summary>:only-child{margin-right:.35em}
.lang summary::-webkit-details-marker{display:none}
.lang summary:hover{border-color:#b7c4c1;border-color:var(--line-2)}
.lang summary .ic{width:1.05em;height:1.05em}
.lang ul{position:absolute;right:0;top:calc(100% + 6px);margin:0;padding:6px;list-style:none;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line);border-radius:10px;box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow);min-width:11.5rem;z-index:5}
.lang li a,.lang li span{display:flex;justify-content:space-between;gap:1rem;padding:.5em .7em;border-radius:6px;color:#13213a;color:var(--ink);text-decoration:none;font-size:.95rem}
.no-flexgap .lang li a>:not(:last-child),.no-flexgap .lang li a>:only-child,.no-flexgap .lang li span>:not(:last-child),.no-flexgap .lang li span>:only-child{margin-right:1rem}
.lang li a:hover{background:#f2f5f4;background:var(--bg)}
.lang li span{color:#0b524c;color:var(--teal-2);font-weight:600}
.lang li small{color:#55627a;color:var(--muted);font-weight:500}
@media (max-width:1020px){.secnav{display:none}}
@media (max-width:560px){.hd-cta{display:none}}

/* hero */
.hero{position:relative;padding:2.2rem 0 3rem;padding:max(2.2rem,min(5.5vw,4.6rem)) 0 max(3rem,min(6vw,5.5rem));overflow:hidden}
.hero::before{content:"";position:absolute;top:0;right:0;bottom:auto;left:auto;width:62%;height:78%;background-image:conic-gradient(#d3dcda 25%,transparent 0 50%,#d3dcda 0 75%,transparent 0);background-image:conic-gradient(var(--line) 25%,transparent 0 50%,var(--line) 0 75%,transparent 0);background-size:8px 8px;-webkit-mask-image:linear-gradient(to left,#000,transparent 85%),linear-gradient(#000 40%,transparent);mask-image:radial-gradient(120% 100% at 100% 0,#000 20%,transparent 70%);opacity:.75;pointer-events:none}
.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,4.6fr) minmax(0,7.4fr);gap:1.6rem 2rem;gap:max(1.6rem,min(3.5vw,3.5rem)) max(2rem,min(4vw,3.75rem));align-items:start}
.hero h1{grid-column:1/-1;max-width:15.5em;margin-bottom:0}
.hero[lang=it] h1,.hero[lang=es] h1,.hero[lang=fr] h1{max-width:17.5em}
.hero-text{padding-top:.4rem}
.hero h1{font-size:2.45rem;font-size:max(2.45rem,min(1rem + 4.4vw,5.4rem));line-height:.98;font-weight:780;letter-spacing:-.03em}
.hero[lang=fr] h1,.hero[lang=it] h1,.hero[lang=es] h1{font-size:2.3rem;font-size:max(2.3rem,min(1rem + 4vw,5rem))}
.hero[lang=de] h1{font-size:2.25rem;font-size:max(2.25rem,min(1rem + 4vw,5rem));font-stretch:86%}
.lead{font-size:1.1rem;color:#33415a;color:var(--ink-2);max-width:36em}
.hw{display:inline-block}
@media (prefers-reduced-motion:no-preference){
  .hw{animation:rise .9s cubic-bezier(.2,.8,.2,1) backwards}
  .hw:nth-child(2){animation-delay:.05s}.hw:nth-child(3){animation-delay:.1s}.hw:nth-child(4){animation-delay:.15s}.hw:nth-child(5){animation-delay:.2s}.hw:nth-child(6){animation-delay:.25s}.hw:nth-child(7){animation-delay:.3s}.hw:nth-child(8){animation-delay:.35s}.hw:nth-child(n+9){animation-delay:.4s}
  .hero .lead,.hero .facts,.hero .actions{animation:fadeup .9s .35s cubic-bezier(.2,.8,.2,1) backwards}
  .hero-fig{animation:fadeup 1s .2s cubic-bezier(.2,.8,.2,1) backwards}
}
@keyframes rise{from{opacity:.001;transform:translateY(.35em)}}
@keyframes fadeup{from{opacity:.001;transform:translateY(14px)}}
.facts{list-style:none;margin:1.4rem 0 1.8rem;padding:0;display:grid;gap:.55rem}
.facts li{display:flex;align-items:flex-start;gap:.7rem;font-weight:500}
.no-flexgap .facts li>:not(:last-child),.no-flexgap .facts li>:only-child{margin-right:.7rem}
.facts li::before{content:"";flex:none;width:18px;height:18px;margin-top:.22em;background:#fff no-repeat center/12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.5 4.8 9 10 3' fill='none' stroke='%230f6f66' stroke-width='2.2' stroke-linecap='square'/%3E%3C/svg%3E");background:var(--surface) no-repeat center/12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.5 4.8 9 10 3' fill='none' stroke='%230f6f66' stroke-width='2.2' stroke-linecap='square'/%3E%3C/svg%3E");box-shadow:inset 1px 1px #b7c4c1,inset -1px -1px #fff,inset 2px 2px #33415a,inset -2px -2px #d3dcda;box-shadow:inset 1px 1px var(--line-2),inset -1px -1px var(--surface),inset 2px 2px var(--ink-2),inset -2px -2px var(--line)}
.actions{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.no-flexgap .actions>*{margin-right:.75rem;margin-bottom:.75rem}
.hero-fig{margin:0}
@media (max-width:1100px){.hero-grid{grid-template-columns:1fr}.hero::before{width:100%;height:50%}}

/* ---------------------------------------------------------------- before/after stage */
.ba{container:ba/inline-size;position:relative}
.ba-stage{--pos:50%;position:relative;aspect-ratio:16/10;border-radius:14px;overflow:hidden;isolation:isolate;font-size:9px;font-size:max(9px,min(calc(1.5 * var(--cqi, 6px)),12.5px));font-size:max(9px,min(1.5cqw,12.5px));background:#dfe8e6;box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32),0 0 0 1px rgba(19,33,58,.12);box-shadow:var(--shadow),0 0 0 1px rgba(19,33,58,.12);touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;contain:layout paint}
@supports not (aspect-ratio:1/1){
.ba-stage::before{content:"";display:block;padding-top:62.5%}}
.hero .ba-stage{aspect-ratio:3/2}
@supports not (aspect-ratio:1/1){
.hero .ba-stage::before{content:"";display:block;padding-top:66.6667%}}
@container ba (max-width:600px){.ba-stage,.hero .ba-stage{aspect-ratio:3/4;font-size:11px;border-radius:12px}@supports not (aspect-ratio:1/1){
.ba-stage::before,.hero .ba-stage::before{content:"";display:block;padding-top:133.3333%}}}
@supports not (container-type:inline-size){.cq-ba-600 .ba-stage,.cq-ba-600 .hero .ba-stage{aspect-ratio:3/4;font-size:11px;border-radius:12px}@supports not (aspect-ratio:1/1){
.cq-ba-600 .ba-stage::before,.cq-ba-600 .hero .ba-stage::before{content:"";display:block;padding-top:133.3333%}}}
.ba-layer{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}
.ba-before{-webkit-clip-path:inset(0 calc(100% - var(--pos)) 0 0);clip-path:inset(0 calc(100% - var(--pos)) 0 0);z-index:1}
.ba-after{background:linear-gradient(160deg,#e8f0ee,#d4e2df)}
.ba-handle{position:absolute;z-index:3;top:0;bottom:0;left:var(--pos);width:48px;margin-left:-24px;display:grid;place-items:center;cursor:ew-resize;outline:none}
.ba-handle::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 0 1px rgba(19,33,58,.28)}
.ba-handle::after{content:"";position:absolute;top:0;bottom:0;right:calc(50% + 1px);width:6px;background-image:conic-gradient(rgba(255,255,255,.75) 25%,transparent 0 50%,rgba(255,255,255,.75) 0 75%,transparent 0);background-size:3px 3px;opacity:.9}
.ba-grip{position:relative;z-index:1;width:44px;height:44px;border-radius:50%;background:#fff;color:#13213a;display:flex;align-items:center;justify-content:center;gap:5px;box-shadow:0 2px 6px rgba(19,33,58,.25),0 0 0 1px rgba(19,33,58,.12);transition:transform .2s cubic-bezier(.2,.8,.2,1)}
.no-flexgap .ba-grip>:not(:last-child),.no-flexgap .ba-grip>:only-child{margin-right:5px}
.ba-grip i{width:0;height:0;border:6px solid transparent}
.ba-grip i:first-child{border-right-color:currentColor;border-left-width:0}
.ba-grip i:last-child{border-left-color:currentColor;border-right-width:0}
.ba-handle:hover .ba-grip,.ba.dragging .ba-grip{transform:scale(1.08)}
.ba-tip{position:absolute;z-index:2;top:calc(50% + 30px);left:50%;transform:translate(-50%,6px);padding:.3em .6em;white-space:nowrap;background:#ffffe1;color:#1d1d1d;border:1px solid #6b6b4f;font:11px/1.3 Tahoma,Verdana,sans-serif;box-shadow:2px 2px 0 rgba(0,0,0,.18);opacity:0;pointer-events:none;transition:opacity .35s, transform .35s cubic-bezier(.2,.8,.2,1)}
.ba.tip-on .ba-tip{opacity:1;transform:translate(-50%,0)}
.ba-handle:focus-visible .ba-grip{box-shadow:0 0 0 3px #fff,0 0 0 6px #0a246a;box-shadow:0 0 0 3px #fff,0 0 0 6px var(--navy)}
.no-fv .ba-handle:focus .ba-grip{box-shadow:0 0 0 3px #fff,0 0 0 6px #0a246a;box-shadow:0 0 0 3px #fff,0 0 0 6px var(--navy)}
.ba-legend{display:flex;justify-content:space-between;gap:1rem;margin-bottom:.6rem;font-size:.88rem;font-weight:600;color:#33415a;color:var(--ink-2)}
.no-flexgap .ba-legend>:not(:last-child),.no-flexgap .ba-legend>:only-child{margin-right:1rem}
.ba-legend span{display:inline-flex;align-items:center;gap:.45em;transition:opacity .25s, color .25s}
.no-flexgap .ba-legend span>:not(:last-child),.no-flexgap .ba-legend span>:only-child{margin-right:.45em}
.ba-legend span::before{content:"";width:.7em;height:.7em;border-radius:2px}
.ba-legend .b::before{background:#008080;box-shadow:inset -1px -1px #004c4c,inset 1px 1px #5fc0c0}
.ba-legend .a::before{background:#fff;background:var(--surface);border:2px solid #0f6f66;border:2px solid var(--teal);border-radius:50%}
.ba-legend .a{flex-direction:row-reverse}
.ba.lo .ba-legend .b,.ba.hi .ba-legend .a{opacity:.45}
.ba-cap{display:flex;flex-wrap:wrap;gap:.4rem .9rem;align-items:center;margin-top:.9rem;color:#55627a;color:var(--muted);font-size:.92rem}
.no-flexgap .ba-cap>*{margin-right:.9rem;margin-bottom:.4rem}
.ba-cap p{margin:0}
.exl{display:inline-flex;align-items:center;gap:.4em;padding:.2em .6em;border-radius:5px;background:#ffffe1;background:var(--tip);border:1px solid #d6cf93;border:1px solid var(--tip-line);color:#4a4410;color:var(--tip-ink);font-size:.82rem;font-weight:600;white-space:nowrap}
.no-flexgap .exl>:not(:last-child),.no-flexgap .exl>:only-child{margin-right:.4em}
.hint{font-size:.86rem}
html:not(.js) .hint{display:none}

/* retro desktops */
.desk{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;padding:1.3em 1.5em 0;background:#008080}
.desk::after{content:"";flex:none;height:2.5em;margin:.7em -1.5em 0;background:#c0c0c0;box-shadow:inset 0 1px #dfdfdf,inset 0 2px #fff}
.desk::before{content:"Start";position:absolute;left:.25em;bottom:.3em;height:1.9em;padding:0 .7em 0 1.9em;display:flex;align-items:center;font:700 .95em/1 Tahoma,Verdana,sans-serif;color:#000;background:#c0c0c0 no-repeat .45em 50%/1.1em linear-gradient(90deg,#e33 0 50%,#3a3 0) ;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px #808080,inset 2px 2px #dfdfdf;z-index:1}
.d2k{background:#3a6ea5}
.d2k::before{background-image:linear-gradient(90deg,#e33 0 50%,#3a3 0)}
.dxp{background:linear-gradient(180deg,#4e88e0,#2a5fc1 70%,#3c7a2f 70.5%,#4f9a3a)}
.dxp::after{height:2.6em;background:linear-gradient(#3168d5,#2456c7 10%,#245edb 50%,#1941a5)}
.dxp::before{content:"start";font:italic 700 1.15em/1 "Trebuchet MS",Tahoma,sans-serif;color:#fff;text-shadow:1px 1px 1px #1b3a10;background:linear-gradient(#5eb25a,#3c8d2e 45%,#2f7a24);box-shadow:none;border-radius:0 .9em .9em 0;left:0;bottom:0;height:2.6em;padding:0 1.2em 0 1em}
.win-full{flex:1;min-height:0;display:flex;flex-direction:column}
.win-full>*{flex:none}
.win-full>.acc-f,.win-full>.wxp-body,.win-full>.wf,.win-full>.xl-sheet,.win-full>.w98-grid.flex{flex:1 1 auto;min-height:0}
/* win98 / 2000 classic */
.w98{background:#c0c0c0;color:#000;font:400 .95em/1.3 Tahoma,"MS Sans Serif","Microsoft Sans Serif",Geneva,Verdana,sans-serif;padding:3px;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #dfdfdf,inset -2px -2px #808080,inset 2px 2px #fff}
.w98-t{display:flex;align-items:center;gap:.35em;padding:.2em .2em .2em .3em;background:linear-gradient(90deg,#000080,#1084d0);color:#fff;font-weight:700;white-space:nowrap}
.no-flexgap .w98-t>:not(:last-child),.no-flexgap .w98-t>:only-child{margin-right:.35em}
.w2k .w98-t{background:linear-gradient(90deg,#0a246a,#a6caf0)}
.tt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.tbb{display:flex;gap:2px}
.no-flexgap .tbb>:not(:last-child),.no-flexgap .tbb>:only-child{margin-right:2px}
.tbb i,.nb,.bt,.tico{position:relative}
.tbb i{width:1.45em;height:1.25em;background:#c0c0c0;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px #808080,inset 2px 2px #dfdfdf}
.tbb .cl{margin-left:2px}
.tbb .mn::after{content:"";position:absolute;left:28%;width:40%;bottom:24%;height:2px;background:#000}
.tbb .mx::after{content:"";position:absolute;left:24%;right:26%;top:20%;bottom:24%;border:1px solid #000;border-top-width:2px}
.tbb .cl::after,.xpb .cl::after{content:"\00d7";position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font:700 1.15em/1 Verdana,Tahoma,sans-serif;color:#000}
.tico{flex:none;width:1.15em;height:1.15em;border-radius:2px}
.tico::after{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font:700 .72em/1 Tahoma,sans-serif;color:#fff}
.tico.acc{background:#8b1a1a}.tico.acc::after{content:"A"}
.tico.vb{background:#5a6f8c}.tico.vb::after{content:"V"}
.tico.dl{background:#c2271b;border-radius:50%}.tico.dl::after{content:"D"}
.tico.xl{background:#1d7a3a}.tico.xl::after{content:"X"}
.tico.net{background:#5c2d91}.tico.net::after{content:"N"}
.w98-m{display:flex;gap:.1em;padding:.15em .1em;white-space:nowrap;overflow:hidden}
.no-flexgap .w98-m>:not(:last-child),.no-flexgap .w98-m>:only-child{margin-right:.1em}
.w98-m span,.wxp-m span{padding:.1em .45em}
.w98-m span::first-letter,.wxp-m span::first-letter{text-decoration:underline}
.w98-tool{display:flex;gap:2px;align-items:center;padding:.2em .3em;border-top:1px solid #808080;box-shadow:inset 0 1px #fff;overflow:hidden}
.no-flexgap .w98-tool>:not(:last-child),.no-flexgap .w98-tool>:only-child{margin-right:2px}
.w98-tool i{width:1.7em;height:1.6em;flex:none;background:no-repeat center/62% 62%}
.w98-tool i:nth-of-type(1){background-image:linear-gradient(135deg,#fff 80%,#999 80%)}
.w98-tool i:nth-of-type(2){background-image:linear-gradient(#e8c34a,#c99a1c)}
.w98-tool i:nth-of-type(3){background-image:linear-gradient(#000080 0 30%,#fff 30% 60%,#000080 60%)}
.w98-tool i:nth-of-type(4){background-image:linear-gradient(#888 0 40%,#ddd 40%)}
.w98-tool i:nth-of-type(5){background-image:radial-gradient(circle,#36c 40%,transparent 42%)}
.w98-tool i:nth-of-type(6){background-image:linear-gradient(90deg,#c00 0 50%,#00a 50%)}
.w98-tool i:nth-of-type(7){background-image:linear-gradient(#ffd800,#e0a800)}
.w98-tool i:nth-of-type(8){background-image:linear-gradient(135deg,#0a0 50%,#070 50%)}
.w98-tool b{width:2px;height:1.4em;margin:0 .2em;box-shadow:inset 1px 0 #808080,inset -1px 0 #fff}
.lb{white-space:nowrap}
.fd{display:block;min-width:0;min-height:1.7em;padding:.2em .4em;background:#fff;color:#000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:inset 1px 1px #808080,inset -1px -1px #fff,inset 2px 2px #0a0a0a,inset -2px -2px #dfdfdf}
.fd.s{max-width:9em}
.fd.dd{position:relative;padding-right:1.8em}
.fd.dd::after{content:"";position:absolute;right:2px;top:2px;bottom:2px;width:1.35em;background:#c0c0c0 no-repeat center/.6em .35em linear-gradient(to bottom right,#000 50%,transparent 50%) ;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #dfdfdf,inset -2px -2px #808080,inset 2px 2px #fff;-webkit-clip-path:none;clip-path:none}
.fd.dd::before{content:"";position:absolute;z-index:1;right:calc(2px + .4em);top:50%;margin-top:-.15em;border:.27em solid transparent;border-top:.32em solid #000;border-bottom:0}
.fd.dd::after{background-image:none}
.fd.ta{white-space:normal;min-height:3.1em;line-height:1.3}
.fd.b{font-weight:700}
.fd.x{box-shadow:none;border:1px solid #7f9db9;width:10em;flex:none}
.bt{display:inline-block;min-width:5.6em;padding:.32em .9em;text-align:center;white-space:nowrap;background:#c0c0c0;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px #808080,inset 2px 2px #dfdfdf}
.bt.sq{min-width:0;padding:.32em .5em;display:inline-grid;place-items:center}
.acc-f{flex:1;min-height:0;display:flex;flex-direction:column;gap:.55em;padding:.65em .85em .55em;overflow:hidden;border-top:1px solid #808080;box-shadow:inset 0 1px #fff}
.no-flexgap .acc-f>*+*{margin-top:.55em}
.acc-hd{display:flex;justify-content:space-between;align-items:baseline;gap:1em;font-size:1.4em;font-weight:700;color:#000080;padding-bottom:.2em;border-bottom:1px solid #808080;box-shadow:0 1px #fff;white-space:nowrap}
.no-flexgap .acc-hd>:not(:last-child),.no-flexgap .acc-hd>:only-child{margin-right:1em}
.acc-hd span{font-size:.62em;font-weight:400;color:#000}
.acc-grid{display:grid;grid-template-columns:-webkit-max-content minmax(0,1fr) -webkit-max-content minmax(0,1fr);grid-template-columns:max-content minmax(0,1fr) max-content minmax(0,1fr);gap:.4em .7em;align-items:center}
.acc-memo{display:grid;grid-template-columns:-webkit-max-content minmax(0,1fr);grid-template-columns:max-content minmax(0,1fr);gap:.7em;align-items:start}
.w98-grid{background:#fff;overflow:hidden;box-shadow:inset 1px 1px #808080,inset -1px -1px #fff,inset 2px 2px #0a0a0a,inset -2px -2px #dfdfdf;padding:2px}
.w98-grid table,.dbgrid table,.xl-sheet table{width:100%;border-collapse:collapse}
.w98-grid th{background:#c0c0c0;font-weight:400;text-align:left;padding:.15em .45em;white-space:nowrap;box-shadow:inset -1px -1px #808080,inset 1px 1px #fff}
.w98-grid td{padding:.15em .45em;border:1px solid #c0c0c0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:0}
.w98-grid td:first-child{max-width:none}
.r{text-align:right}
.w98-grid th.r{text-align:right}
.acc-tot{display:flex;justify-content:flex-end;gap:.7em;align-items:center}
.no-flexgap .acc-tot>:not(:last-child),.no-flexgap .acc-tot>:only-child{margin-right:.7em}
.acc-tot .fd{min-width:7em;text-align:right}
.wf-btns,.xp-btns{display:flex;justify-content:flex-end;gap:.5em;margin-top:auto}
.no-flexgap .wf-btns>:not(:last-child),.no-flexgap .wf-btns>:only-child,.no-flexgap .xp-btns>:not(:last-child),.no-flexgap .xp-btns>:only-child{margin-right:.5em}
.acc-foot{display:flex;justify-content:space-between;align-items:center;gap:1em;margin-top:auto}
.no-flexgap .acc-foot>:not(:last-child),.no-flexgap .acc-foot>:only-child{margin-right:1em}
.acc-btns{display:flex;gap:.5em}
.no-flexgap .acc-btns>:not(:last-child),.no-flexgap .acc-btns>:only-child{margin-right:.5em}
.acc-nav{display:flex;align-items:center;gap:2px;padding:.2em .3em;border-top:1px solid #808080;white-space:nowrap;overflow:hidden}
.no-flexgap .acc-nav>:not(:last-child),.no-flexgap .acc-nav>:only-child{margin-right:2px}
.acc-nav>span:first-child{margin-right:.3em}
.acc-nav>span:last-child{margin-left:.4em}
.nb{min-width:1.6em;height:1.45em;padding:0 .2em;display:inline-grid;place-items:center;flex:none;font-family:Tahoma,Verdana,"DejaVu Sans",sans-serif;line-height:1;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px #808080,inset 2px 2px #dfdfdf;font-size:.78em}
.nn{background:#fff;padding:0 .5em;min-width:2.8em;box-shadow:inset 1px 1px #808080,inset -1px -1px #fff}
.w98-s{display:flex;gap:2px;padding-top:2px;white-space:nowrap}
.no-flexgap .w98-s>:not(:last-child),.no-flexgap .w98-s>:only-child{margin-right:2px}
.w98-s span{flex:1;padding:.12em .45em;overflow:hidden;text-overflow:ellipsis;box-shadow:inset 1px 1px #808080,inset -1px -1px #fff}
.w98-s span:first-child{flex:3}
/* vb6 dental */
.vb-bar{display:flex;align-items:center;gap:.4em;padding:.45em .55em;border-top:1px solid #808080;box-shadow:inset 0 1px #fff}
.no-flexgap .vb-bar>:not(:last-child),.no-flexgap .vb-bar>:only-child{margin-right:.4em}
.vb-bar .fd{width:7.5em;flex:none}
.sp{flex:1}
.w98-grid.flex{flex:1;min-height:0;margin:0 .55em .45em}
.w98-grid table.fixed{table-layout:fixed;height:100%}
.w98-grid table.fixed th.c0{width:4.3em}
.w98-grid table.fixed tbody th{background:#c0c0c0;font-weight:400;text-align:center}
.w98-grid td.bk{background:#ffffe1}
.w98-grid td.sel{background:#000080;color:#fff}
/* winforms */
.wf{flex:1;min-height:0;display:flex;flex-direction:column;gap:.6em;padding:.6em .7em .5em;border-top:1px solid #808080;box-shadow:inset 0 1px #fff}
.no-flexgap .wf>*+*{margin-top:.6em}
.gb{margin:0;padding:.35em .7em .65em;border:1px solid #808080;box-shadow:1px 1px #fff,inset 1px 1px #fff;display:grid;gap:.4em}
.gb legend{padding:0 .3em}
.wf-row{display:grid;grid-template-columns:8.2em minmax(0,1fr);gap:.5em;align-items:center}
.wf-row .fd.s{max-width:7em}
.dgv{flex:1;min-height:0}
.dgv td.neg{color:#c00000}
.dgv tr.sel td{background:#0a246a;color:#fff}
/* XP */
.wxp{display:flex;flex-direction:column;background:#ece9d8;color:#000;font:400 .95em/1.3 Tahoma,"Segoe UI",Verdana,sans-serif;border:3px solid #0831d9;border-top:0;border-radius:8px 8px 0 0;box-shadow:inset 0 0 0 1px #166aee}
.wxp-t{display:flex;align-items:center;gap:.4em;margin:0 -3px;padding:.35em .35em .35em .5em;border-radius:7px 7px 0 0;color:#fff;font-weight:700;white-space:nowrap;text-shadow:1px 1px #0f1089;background:linear-gradient(180deg,#0997ff,#0053ee 8%,#0050ee 40%,#06f 88%,#06f 93%,#005bff 95%,#003dd7 96%,#003dd7)}
.no-flexgap .wxp-t>:not(:last-child),.no-flexgap .wxp-t>:only-child{margin-right:.4em}
.xpb{display:flex;gap:2px}
.no-flexgap .xpb>:not(:last-child),.no-flexgap .xpb>:only-child{margin-right:2px}
.xpb i{position:relative;width:1.55em;height:1.55em;border:1px solid #fff;border-radius:3px;background:linear-gradient(135deg,#5e9dfc,#1d5ee8 60%,#174fd0)}
.xpb .cl{background:linear-gradient(135deg,#ea8a63,#d64a1f 60%,#c23a12)}
.xpb .cl::after{color:#fff}
.xpb .mn::after{content:"";position:absolute;left:25%;width:40%;bottom:22%;height:3px;background:#fff}
.xpb .mx::after{content:"";position:absolute;top:22%;right:22%;bottom:22%;left:22%;border:1px solid #fff;border-top-width:3px}
.wxp-m{display:flex;gap:.1em;padding:.18em .2em;white-space:nowrap;overflow:hidden;border-bottom:1px solid #d6d2c2}
.no-flexgap .wxp-m>:not(:last-child),.no-flexgap .wxp-m>:only-child{margin-right:.1em}
.wxp-body{flex:1;min-height:0;display:flex;flex-direction:column;padding:.55em}
.tabs{display:flex;gap:2px;padding-left:.3em;white-space:nowrap}
.no-flexgap .tabs>:not(:last-child),.no-flexgap .tabs>:only-child{margin-right:2px}
.tabs span{padding:.25em .85em;border:1px solid #919b9c;border-bottom:0;border-radius:3px 3px 0 0;background:linear-gradient(#fff,#ecebe6)}
.tabs .on{background:#fcfcfe;box-shadow:inset 0 2px #e68b2c;position:relative;top:1px}
.tabpage{flex:1;min-height:0;display:flex;flex-direction:column;gap:.55em;padding:.6em;border:1px solid #919b9c;background:#fcfcfe}
.no-flexgap .tabpage>*+*{margin-top:.55em}
.xp-row{display:flex;align-items:center;gap:.6em;white-space:nowrap}
.no-flexgap .xp-row>:not(:last-child),.no-flexgap .xp-row>:only-child{margin-right:.6em}
.xchk{display:inline-flex;align-items:center;gap:.4em}
.no-flexgap .xchk>:not(:last-child),.no-flexgap .xchk>:only-child{margin-right:.4em}
.xchk i{width:1em;height:1em;border:1px solid #1c5180;background:linear-gradient(135deg,#dcdcd7,#fff)}
.dbgrid{flex:1;min-height:0;overflow:hidden;background:#fff;border:1px solid #7f9db9}
.dbgrid th{background:#ece9d8;font-weight:400;text-align:left;padding:.2em .45em;white-space:nowrap;border-right:1px solid #aca899;border-bottom:1px solid #aca899}
.dbgrid th.r{text-align:right}
.dbgrid td{padding:.22em .45em;white-space:nowrap;border-right:1px solid #e5e2d6;border-bottom:1px solid #e5e2d6;overflow:hidden;text-overflow:ellipsis}
.dbgrid td:nth-child(2){max-width:0;width:100%}
.dbgrid tr.low td{color:#c00000}
.dbgrid tr.sel td{background:#316ac5;color:#fff}
.xbt{display:inline-block;min-width:6em;padding:.32em .9em;text-align:center;white-space:nowrap;border:1px solid #003c74;border-radius:3px;background:linear-gradient(#fff,#ecebe6 85%,#d6d0c5)}
.wxp-s{display:flex;gap:.5em;padding:.2em .5em;white-space:nowrap;overflow:hidden;border-top:1px solid #d6d2c2}
.no-flexgap .wxp-s>:not(:last-child),.no-flexgap .wxp-s>:only-child{margin-right:.5em}
.wxp-s span{flex:1;overflow:hidden;text-overflow:ellipsis}
/* excel */
.xl-fx{display:flex;align-items:center;gap:.4em;padding:.25em .4em;border-bottom:1px solid #aca899;white-space:nowrap}
.no-flexgap .xl-fx>:not(:last-child),.no-flexgap .xl-fx>:only-child{margin-right:.4em}
.xl-nm,.xl-fv{background:#fff;border:1px solid #7f9db9;padding:0 .35em}
.xl-nm{width:4em}
.xl-f{font-style:italic;color:#555;font-family:"Times New Roman",serif}
.xl-fv{flex:1;overflow:hidden}
.xl-sheet{flex:1;min-height:0;position:relative;overflow:hidden;background:#fff}
.xl-sheet table{table-layout:fixed}
.xl-sheet th{background:linear-gradient(#f6f6f1,#e2e0d6);border:1px solid #b3b0a2;font-weight:400;text-align:center;padding:.1em 0;white-space:nowrap}
.xl-sheet thead th:first-child{width:2.6em}
.xl-sheet thead th:nth-child(2){width:6.4em}
.xl-sheet thead th:nth-child(3){width:6.3em}
.xl-sheet thead th:nth-child(5),.xl-sheet thead th:nth-child(6),.xl-sheet thead th:nth-child(7){width:6.2em}
.xl-sheet thead th:nth-child(8){width:3.8em}
.xl-sheet td{height:1.6em;padding:0 .3em;border:1px solid #dadcdd;white-space:nowrap;overflow:hidden}
.xl-sheet td.h{font-weight:700;background:#f4f4f4}
.xl-sheet td.sel{outline:2px solid #000;outline-offset:-2px}
.xl-sheet td.b{font-weight:700}
.w98.uf{position:absolute;z-index:2;right:4%;top:22%;width:23em}
.uf-b{display:grid;grid-template-columns:-webkit-max-content minmax(0,1fr);grid-template-columns:max-content minmax(0,1fr);gap:.4em .6em;align-items:center;padding:.6em .6em .5em}
.fd.s2{width:4em}
.uf-btns{grid-column:1/-1;display:flex;justify-content:flex-end;gap:.4em;margin-top:.2em}
.no-flexgap .uf-btns>:not(:last-child),.no-flexgap .uf-btns>:only-child{margin-right:.4em}
.uf-btns .bt{min-width:4.6em}
.xl-tabs{display:flex;padding-left:2.6em;white-space:nowrap;border-top:1px solid #808080;background:#ece9d8}
.xl-tabs span{padding:.12em .9em;border:1px solid #808080;border-top:0;margin-left:-1px;background:#dcdad0}
.xl-tabs .on{background:#fff;font-weight:700}

/* modern app (after) */
.bw{position:absolute;top:1.3em;left:1.5em;right:1.5em;bottom:0;display:flex;flex-direction:column;border-radius:10px 10px 0 0;overflow:hidden;background:#f4f6f8;color:#172033;font-family:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-family:var(--f-body);line-height:1.4;box-shadow:0 0 0 1px rgba(19,33,58,.12),0 20px 40px -20px rgba(19,33,58,.4)}
.bw-bar{flex:none;height:2.5em;display:flex;align-items:center;gap:.4em;padding:0 .9em;background:#e8ecef;border-bottom:1px solid #d6dce1}
.no-flexgap .bw-bar>:not(:last-child),.no-flexgap .bw-bar>:only-child{margin-right:.4em}
.bw-bar i{width:.72em;height:.72em;border-radius:50%;background:#c6cdd4}
.bw-url{margin-left:.8em;flex:1;max-width:30em;padding:.22em .9em;border-radius:999px;background:#fff;color:#5d6779;font-size:.85em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bw-body{flex:1;min-height:0;position:relative;overflow:hidden}
.ap{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;grid-template-columns:14em minmax(0,1fr)}
.ap-side{display:flex;flex-direction:column;gap:.8em;padding:1em .75em;background:#fafbfc;border-right:1px solid #e4e7ec;min-width:0}
.no-flexgap .ap-side>*+*{margin-top:.8em}
.ap-brand{display:flex;align-items:center;gap:.6em;padding:0 .25em;font-weight:600;white-space:nowrap;overflow:hidden}
.no-flexgap .ap-brand>:not(:last-child),.no-flexgap .ap-brand>:only-child{margin-right:.6em}
.ap-brand span{overflow:hidden;text-overflow:ellipsis}
.ap-logo{flex:none;display:grid;place-items:center;width:2.15em;height:2.15em;border-radius:.6em;background:#0f6f66;color:#fff;font-size:.85em;font-weight:600}
.ap-search{display:flex;align-items:center;gap:.5em;padding:.45em .6em;border:1px solid #e4e7ec;border-radius:.55em;background:#fff;color:#8b94a5;font-size:.92em}
.no-flexgap .ap-search>:not(:last-child),.no-flexgap .ap-search>:only-child{margin-right:.5em}
.ap-nav{list-style:none;margin:0;padding:0;display:grid;gap:.12em}
.ap-nav li{display:flex;align-items:center;gap:.6em;padding:.45em .55em;border-radius:.5em;color:#344054;white-space:nowrap;font-size:.95em}
.no-flexgap .ap-nav li>:not(:last-child),.no-flexgap .ap-nav li>:only-child{margin-right:.6em}
.ap-nav li span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.ap-nav li em{font-style:normal;color:#8b94a5;font-size:.85em}
.ap-nav li.on{background:#e2f0ed;color:#0b524c;font-weight:600}
.ap-nav li.on .ic{color:#0f6f66}
.ap-main{display:flex;flex-direction:column;gap:.85em;padding:1.3em 1.5em;min-width:0;overflow:hidden}
.no-flexgap .ap-main>*+*{margin-top:.85em}
.ap-top{display:none}
.ap-crumb{margin-bottom:-.55em;color:#5d6779;font-size:.85em}
.ap-head{display:flex;align-items:center;justify-content:space-between;gap:.8em}
.no-flexgap .ap-head>:not(:last-child),.no-flexgap .ap-head>:only-child{margin-right:.8em}
.ap-head>div:first-child{display:flex;align-items:center;gap:.6em;min-width:0}
.no-flexgap .ap-head>div:first-child>:not(:last-child),.no-flexgap .ap-head>div:first-child>:only-child{margin-right:.6em}
.ap-h{font-size:1.5em;font-weight:600;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pill{display:inline-flex;flex:none;padding:.15em .65em;border-radius:999px;background:#e9effc;color:#2950a8;font-size:.8em;font-weight:500;white-space:nowrap}
.pill.amber{background:#fdf3e1;color:#9a5b06}
.pill.red{background:#fdecea;color:#b42318}
.ap-acts{display:flex;gap:.5em;flex:none}
.no-flexgap .ap-acts>:not(:last-child),.no-flexgap .ap-acts>:only-child{margin-right:.5em}
.ab{display:inline-flex;align-items:center;gap:.4em;padding:.45em .8em;border-radius:.55em;font-size:.9em;font-weight:500;white-space:nowrap}
.no-flexgap .ab>:not(:last-child),.no-flexgap .ab>:only-child{margin-right:.4em}
.ab.o{background:#fff;border:1px solid #d0d5dd;color:#344054}
.ab.p{background:#0f6f66;color:#fff}
.ab.sq{padding:.45em .5em}
.ap-card{min-width:0;padding:.85em 1em;background:#fff;border:1px solid #e4e7ec;border-radius:.75em}
.ap-card small{display:block;color:#5d6779;font-size:.8em}
.kv{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8em}
.kv.k3{grid-template-columns:repeat(3,minmax(0,1fr))}
.kv b{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.plate{display:inline-block;margin-top:.25em;padding:0 .45em;border:1px solid #d0d5dd;border-radius:.3em;font-size:.78em;letter-spacing:.04em;color:#344054}
.note p{margin:.2em 0 0;color:#344054}
.tbl{padding:0;overflow:hidden}
.ap-ch{padding:.7em 1em;font-weight:600;border-bottom:1px solid #eef0f3}
.ap-card table{width:100%;border-collapse:collapse}
.ap-card th{padding:.5em 1em;background:#fafbfc;border-bottom:1px solid #e4e7ec;color:#5d6779;font-size:.8em;font-weight:500;text-align:left;white-space:nowrap}
.ap-card th.r{text-align:right}
.ap-card td{padding:.5em 1em;border-bottom:1px solid #eef0f3;white-space:nowrap}
.ap-card td:first-child{overflow:hidden;text-overflow:ellipsis;max-width:0;width:100%}
.ap-card tfoot td{font-weight:600;background:#fafbfc;border-bottom:0}
.ap-sum{display:grid;grid-template-columns:1fr auto;gap:.25em 1.6em;padding:.75em 1em;text-align:right}
.ap-sum span{color:#5d6779}
.ap-sum .big{font-size:1.15em;color:#172033;font-weight:600}
.ap-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8em}
.ap-kpis b{display:block;font-size:1.45em;font-weight:600;line-height:1.25}
.ap-kpis b.sm{font-size:1em;line-height:1.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ap-kpis .warn b{color:#b42318}
.ap-chips{display:flex;gap:.4em;flex-wrap:wrap}
.no-flexgap .ap-chips>*{margin-right:.4em;margin-bottom:.4em}
.chip{padding:.22em .75em;border:1px solid #d0d5dd;border-radius:999px;background:#fff;color:#344054;font-size:.85em;white-space:nowrap}
.chip.on{background:#0f6f66;border-color:#0f6f66;color:#fff}
.stock td{padding:.5em 1em}
.stock td small{color:#8b94a5}
.stock td b{display:block;font-weight:500;overflow:hidden;text-overflow:ellipsis}
.stock td:nth-child(2){min-width:8.5em}
.qty{display:block;font-weight:500}
.bar{display:block;width:7em;height:.36em;margin:.3em 0 0 auto;border-radius:999px;background:#eef0f3;overflow:hidden}
.bar i{display:block;height:100%;border-radius:inherit;background:#0f6f66}
.bar.low i{background:#d92d20}
.w0 {width:4%}.w1{width:12%}.w2{width:22%}.w3{width:32%}.w4{width:42%}.w5{width:52%}.w6{width:62%}.w7{width:72%}.w8{width:82%}.w9{width:92%}.w10{width:100%}
.dot{display:inline-block;width:.65em;height:.65em;border-radius:50%}
.dot.ok{background:#1f7a4d}.dot.part{background:#d08a17}.dot.due{background:#d92d20}
/* dental week */
.wk{flex:1;min-height:0;padding:0;display:grid;grid-template-columns:3.3em repeat(5,minmax(0,1fr));overflow:hidden}
.wk-t{display:grid;grid-template-rows:2.6em repeat(7,minmax(0,1fr));padding-bottom:.3em}
.wk-t span{padding:.35em .45em 0 0;text-align:right;color:#8b94a5;font-size:.75em}
.wk-t span:first-child{grid-row:2}
.wk-col{display:flex;flex-direction:column;min-width:0;border-left:1px solid #eef0f3}
.wk-d{flex:none;height:2.6em;display:flex;align-items:center;justify-content:center;gap:.35em;border-bottom:1px solid #e4e7ec;color:#5d6779;font-size:.85em;white-space:nowrap}
.no-flexgap .wk-d>:not(:last-child),.no-flexgap .wk-d>:only-child{margin-right:.35em}
.wk-d b{font-weight:600;color:#344054;padding:0 .4em;border-radius:999px}
.today .wk-d b{background:#0f6f66;color:#fff}
.wk-slots{flex:1;min-height:0;display:grid;grid-template-rows:repeat(7,minmax(0,1fr));gap:.25em;padding:.3em;background:repeating-linear-gradient(#fff 0 calc(100%/7 - 1px),#f1f3f6 0 calc(100%/7))}
.today .wk-slots{background-color:#f6fbfa}
.ev{min-height:0;overflow:hidden;padding:.25em .45em;border-left:3px solid;border-radius:.4em;font-size:.8em;line-height:1.25}
.ev b,.ev small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ev b{font-weight:600}
.ev small{opacity:.85}
.c1{background:#e7f4ec;border-color:#1f7a4d;color:#14532d}
.c2{background:#e9effc;border-color:#2950a8;color:#1e3a7b}
.c3{background:#e2f0ed;border-color:#0f6f66;color:#0b524c}
.c4{background:#fdf3e1;border-color:#b7791f;color:#6e4204}
.c5{background:#f3e8fd;border-color:#7e3fbf;color:#5b2a8c}
.s0{grid-row-start:1}.s1{grid-row-start:2}.s2{grid-row-start:3}.s3{grid-row-start:4}.s4{grid-row-start:5}.s5{grid-row-start:6}.s6{grid-row-start:7}
.l1{grid-row-end:span 1}.l2{grid-row-end:span 2}

/* narrow stage: phone layouts */
@container ba (max-width:600px){
  .nw,.nw2{display:none!important}
  .desk{padding:.7em .7em 0}
  .desk::after{margin:.6em -.7em 0}
  .acc-grid{grid-template-columns:-webkit-max-content minmax(0,1fr);grid-template-columns:max-content minmax(0,1fr)}
  .acc-memo{grid-template-columns:1fr;gap:.2em}
  .fd.s{max-width:none}
  .acc-f{gap:.45em}
  .no-flexgap .acc-f>:not(:last-child),.no-flexgap .acc-f>:only-child{margin-right:.45em}
  .w98-tool,.acc-hd span{display:none}
  .vb-bar .fd{width:6.5em}
  .w98.uf{left:5%;right:5%;width:auto;top:16%}
  .xl-sheet thead th:nth-child(3){width:5.4em}
  .xl-sheet th:nth-child(5),.xl-sheet td:nth-child(5),.xl-sheet th:nth-child(6),.xl-sheet td:nth-child(6){display:none}
  .xl-sheet thead th:nth-child(7){width:5.6em}
  .wf-row{grid-template-columns:6.4em minmax(0,1fr)}
  .fd.x{width:6em}
  .bw{top:.7em;left:.7em;right:.7em}
  .bw-url{margin-left:.4em}
  .ap{grid-template-columns:minmax(0,1fr)}
  .ap-side{display:none}
  .ap-top{display:flex;align-items:center;gap:.6em;margin:-1em -1em 0;padding:.6em .9em;background:#fff;border-bottom:1px solid #e4e7ec;font-weight:600;white-space:nowrap}
  .no-flexgap .ap-top>:not(:last-child),.no-flexgap .ap-top>:only-child{margin-right:.6em}
  .ap-main{padding:1em;gap:.75em}
  .no-flexgap .ap-main>:not(:last-child),.no-flexgap .ap-main>:only-child{margin-right:.75em}
  .ap-head{flex-wrap:wrap}
  .ap-h{font-size:1.25em}
  .kv,.ap-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kv.k3>div:last-child{display:none}
  .ap-card th,.ap-card td{padding:.5em .7em}
  .wk{grid-template-columns:2.6em repeat(5,minmax(0,1fr))}
  .wk-d{flex-direction:column;gap:0;line-height:1.15;height:3em}
  .wk-t{grid-template-rows:3em repeat(7,minmax(0,1fr))}
  .ev{padding:.2em .3em;font-size:.72em}
  .ev small{display:none}
  .bar{width:5em}
}
@supports not (container-type:inline-size){
  .cq-ba-600 .nw,.cq-ba-600 .nw2{display:none!important}
  .cq-ba-600 .desk{padding:.7em .7em 0}
  .cq-ba-600 .desk::after{margin:.6em -.7em 0}
  .cq-ba-600 .acc-grid{grid-template-columns:-webkit-max-content minmax(0,1fr);grid-template-columns:max-content minmax(0,1fr)}
  .cq-ba-600 .acc-memo{grid-template-columns:1fr;gap:.2em}
  .cq-ba-600 .fd.s{max-width:none}
  .cq-ba-600 .acc-f{gap:.45em}
  .cq-ba-600 .w98-tool,.cq-ba-600 .acc-hd span{display:none}
  .cq-ba-600 .vb-bar .fd{width:6.5em}
  .cq-ba-600 .w98.uf{left:5%;right:5%;width:auto;top:16%}
  .cq-ba-600 .xl-sheet thead th:nth-child(3){width:5.4em}
  .cq-ba-600 .xl-sheet th:nth-child(5),.cq-ba-600 .xl-sheet td:nth-child(5),.cq-ba-600 .xl-sheet th:nth-child(6),.cq-ba-600 .xl-sheet td:nth-child(6){display:none}
  .cq-ba-600 .xl-sheet thead th:nth-child(7){width:5.6em}
  .cq-ba-600 .wf-row{grid-template-columns:6.4em minmax(0,1fr)}
  .cq-ba-600 .fd.x{width:6em}
  .cq-ba-600 .bw{top:.7em;left:.7em;right:.7em}
  .cq-ba-600 .bw-url{margin-left:.4em}
  .cq-ba-600 .ap{grid-template-columns:minmax(0,1fr)}
  .cq-ba-600 .ap-side{display:none}
  .cq-ba-600 .ap-top{display:flex;align-items:center;gap:.6em;margin:-1em -1em 0;padding:.6em .9em;background:#fff;border-bottom:1px solid #e4e7ec;font-weight:600;white-space:nowrap}
  .no-flexgap .cq-ba-600 .ap-top>:not(:last-child),.no-flexgap .cq-ba-600 .ap-top>:only-child{margin-right:.6em}
  .cq-ba-600 .ap-main{padding:1em;gap:.75em}
  .cq-ba-600 .ap-head{flex-wrap:wrap}
  .cq-ba-600 .ap-h{font-size:1.25em}
  .cq-ba-600 .kv,.cq-ba-600 .ap-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cq-ba-600 .kv.k3>div:last-child{display:none}
  .cq-ba-600 .ap-card th,.cq-ba-600 .ap-card td{padding:.5em .7em}
  .cq-ba-600 .wk{grid-template-columns:2.6em repeat(5,minmax(0,1fr))}
  .cq-ba-600 .wk-d{flex-direction:column;gap:0;line-height:1.15;height:3em}
  .cq-ba-600 .wk-t{grid-template-rows:3em repeat(7,minmax(0,1fr))}
  .cq-ba-600 .ev{padding:.2em .3em;font-size:.72em}
  .cq-ba-600 .ev small{display:none}
  .cq-ba-600 .bar{width:5em}}

/* ---------------------------------------------------------------- sections */
.sec{padding:4rem 0;padding:max(4rem,min(8.5vw,7rem)) 0}
.sec.tint{background:#e7edeb;background:var(--bg-2)}
.sh{max-width:46rem;margin-bottom:2rem;margin-bottom:max(2rem,min(4vw,3rem))}
.sh h2{margin-bottom:.45em}
.sh p{color:#33415a;color:var(--ink-2);font-size:1.08rem;margin:0}

/* services */
.svc{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.svc-i{--mx:50%;--my:0%;position:relative;isolation:isolate;overflow:hidden;padding:1.3rem;padding:max(1.3rem,min(2.4vw,1.9rem));border-radius:18px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line);grid-column:span 2;transition:border-color .3s, transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s}
.svc-i::before{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;z-index:-1;border-radius:inherit;background:radial-gradient(360px circle at var(--mx) var(--my),rgba(var(--teal-rgb),0.11),transparent 65%);background:radial-gradient(360px circle at var(--mx) var(--my),color-mix(in srgb,var(--teal) 11%,transparent),transparent 65%);opacity:0;transition:opacity .4s}
.svc-i:hover{border-color:#b7c4c1;border-color:var(--line-2);transform:translateY(-2px);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow)}
.svc-i:hover::before{opacity:1}
.svc-i h3{font:700 1.3rem/1.2 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.3rem/1.2 var(--f-disp);letter-spacing:-.012em;margin:.9rem 0 .5rem}
.svc-i p{margin:0;color:#33415a;color:var(--ink-2)}
.svc-modern{grid-column:span 4;grid-row:span 1;display:grid;grid-template-columns:minmax(0,1fr) 190px;column-gap:2rem;align-content:start;background:#13213a;background:var(--dark);border-color:#13213a;border-color:var(--dark);color:#eef3f5;color:var(--on-dark)}
.svc-modern h3{color:#fff;font-size:1.5rem;font-size:max(1.5rem,min(1.2rem + .9vw,2rem));margin-top:0;grid-column:1}
.svc-modern p{color:#b9c6d6;color:var(--on-dark-2);grid-column:1}
.svc-modern .svc-art{grid-column:2;grid-row:1/span 5;align-self:center;justify-self:end}
.svc-modern .lp{fill:#fff}.svc-modern .ls{fill:#5cc3b6}
.svc-modern::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-2;background-image:conic-gradient(rgba(255,255,255,.07) 25%,transparent 0 50%,rgba(255,255,255,.07) 0 75%,transparent 0);background-size:10px 10px;-webkit-mask-image:linear-gradient(105deg,transparent 45%,#000);mask-image:linear-gradient(105deg,transparent 45%,#000)}
.svc-modern::before{background:radial-gradient(360px circle at var(--mx) var(--my),rgba(92,195,182,.16),transparent 65%)}
.art-sym{width:170px;height:170px;display:block}
.svc-sub{margin-top:.6rem!important;font-weight:600;color:#fff!important}
.svc-files{grid-column:1;display:flex;flex-wrap:wrap;gap:.35rem;margin-top:1.1rem;align-items:center}
.no-flexgap .svc-files>*{margin-right:.35rem;margin-bottom:.35rem}
.svc-files span{font-size:.82rem;color:#b9c6d6;color:var(--on-dark-2);margin-right:.3rem}
.svc-files code{font:500 .78rem/1 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:500 .78rem/1 var(--f-body);padding:.35em .55em;border-radius:6px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#e5ecf2}
.svc-custom{grid-column:span 2}
.svc-art svg:not(.art-sym){width:120px;height:80px;display:block;fill:none;stroke:#33415a;stroke:var(--ink-2);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.svc-art .a-soft{fill:#e7edeb;fill:var(--bg-2);stroke:none}
.svc-art .a-fill{fill:#0f6f66;fill:var(--teal);stroke:none}
.svc-art .a-dot{fill:#b7c4c1;fill:var(--line-2);stroke:none}
.svc-art .a-tealline{stroke:#0f6f66;stroke:var(--teal)}
.svc-art .a-flow{stroke:#0f6f66;stroke:var(--teal);stroke-dasharray:3 4}
.svc-art .a-head{stroke:#0f6f66;stroke:var(--teal)}
@media (prefers-reduced-motion:no-preference){
  .svc-i:hover .a-flow{animation:dash .9s linear infinite}
  .svc-i:hover .a-rev{animation-direction:reverse}
  .svc-i:hover .a-row{animation:blink 1.2s ease-in-out infinite}
  .svc-i:hover .art-sym .ls{animation:nudge 1.6s cubic-bezier(.2,.8,.2,1) infinite}
}
@keyframes dash{to{stroke-dashoffset:-14}}
@keyframes blink{50%{fill:#e7edeb;fill:var(--bg-2);fill:color-mix(in srgb,var(--teal) 30%,var(--bg-2))}}
@keyframes nudge{50%{transform:translate(1.2px,-1.2px)}}
.svc-foot{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:2rem 4rem;align-items:end;margin-top:2rem;margin-top:max(2rem,min(4vw,3rem));padding-top:1.8rem;border-top:1px solid #d3dcda;border-top:1px solid var(--line)}
.stack h3{font-size:.95rem;font-weight:600;color:#55627a;color:var(--muted);margin-bottom:.8rem}
.stack ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.45rem}
.no-flexgap .stack ul>*{margin-right:.45rem;margin-bottom:.45rem}
.stack li{padding:.35em .8em;border-radius:999px;border:1px solid #d3dcda;border:1px solid var(--line);background:#fff;background:var(--surface);font-size:.9rem;font-weight:500;color:#33415a;color:var(--ink-2)}
.svc-cta p{color:#33415a;color:var(--ink-2);margin-bottom:1rem}
@media (max-width:1060px){.svc{grid-template-columns:repeat(2,minmax(0,1fr))}.svc-i,.svc-custom{grid-column:span 1}.svc-modern{grid-column:1/-1}}
@media (max-width:700px){.svc{grid-template-columns:1fr}.svc-modern{grid-template-columns:1fr}.svc-modern .svc-art{grid-column:1;grid-row:auto;justify-self:start;order:-1;margin-bottom:.4rem}.art-sym{width:72px;height:72px}.svc-foot{grid-template-columns:1fr}}

/* why now: timeline */
.tl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;position:relative}
.tl::before{content:"";position:absolute;left:0;right:0;top:11px;height:2px;background:linear-gradient(90deg,#b7c4c1 0 30%,transparent 30% 34%,#b7c4c1 34%);background:linear-gradient(90deg,var(--line-2) 0 30%,transparent 30% 34%,var(--line-2) 34%);transform-origin:left;transition:transform 1.4s cubic-bezier(.2,.8,.2,1)}
.tl::after{content:"";position:absolute;left:31%;top:5px;width:14px;height:14px;background:linear-gradient(115deg,transparent 45%,#b7c4c1 45% 55%,transparent 55%) 0 0/7px 14px repeat-x;background:linear-gradient(115deg,transparent 45%,var(--line-2) 45% 55%,transparent 55%) 0 0/7px 14px repeat-x}
.tl li{position:relative;padding-top:2.6rem}
.tl li::before{content:"";position:absolute;left:0;top:2px;width:20px;height:20px;border-radius:50%;background:#f2f5f4;background:var(--bg);border:2px solid #13213a;border:2px solid var(--ink);transition:transform .5s cubic-bezier(.3,1.6,.5,1), background-color .3s}
.tl li:last-child::before{background:#0f6f66;background:var(--teal);border-color:#0f6f66;border-color:var(--teal);box-shadow:0 0 0 6px rgba(var(--teal-rgb),0.22);box-shadow:0 0 0 6px color-mix(in srgb,var(--teal) 22%,transparent)}
.tl time{display:block;font:740 2rem/1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:740 max(2rem,min(1.3rem + 2vw,2.9rem))/1 var(--f-disp);letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-bottom:.4rem}
.tl b{display:block;font-weight:600;font-size:1.05rem}
.tl span{color:#55627a;color:var(--muted)}
.why-note{max-width:44rem;margin-top:2rem;margin-top:max(2rem,min(4vw,3rem));font-size:1.08rem;color:#33415a;color:var(--ink-2);padding-left:1rem;border-left:3px solid #0f6f66;border-left:3px solid var(--teal)}
.armed .tl::before{transform:scaleX(0)}
.armed .tl li::before{transform:scale(0)}
.armed.in .tl::before{transform:none}
.armed.in .tl li::before{transform:none}
.armed.in .tl li:nth-child(2)::before{transition-delay:.45s}
.armed.in .tl li:nth-child(3)::before{transition-delay:.9s}
@media (max-width:760px){
  .tl{grid-template-columns:1fr;gap:1.6rem;padding-left:2.2rem}
  .tl::before{left:9px;right:auto;top:0;bottom:0;width:2px;height:auto;background:#b7c4c1;background:var(--line-2);transform-origin:top}
  .tl::after{display:none}
  .armed .tl::before{transform:scaleY(0)}
  .tl li{padding-top:0}
  .tl li::before{left:-2.2rem;top:.55rem}
}

/* gallery */
.gal{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:1.5rem;gap:max(1.5rem,min(4vw,3.5rem));align-items:start}
.gal-tabs{display:grid;gap:.5rem}
.gal-tabs button{all:unset;box-sizing:border-box;display:grid;grid-template-columns:auto 1fr;gap:.1rem .9rem;align-items:center;padding:.95rem 1rem;border-radius:12px;border:1px solid #d3dcda;border:1px solid var(--line);background:#fff;background:var(--surface);cursor:pointer;transition:border-color .2s, background-color .2s, transform .2s}
.gal-tabs button:hover{border-color:#b7c4c1;border-color:var(--line-2)}
.gal-tabs button:focus-visible{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:3px}
.no-fv .gal-tabs button:focus{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:3px}
.gal-tabs button[aria-selected=true]{border-color:#0f6f66;border-color:var(--teal);box-shadow:inset 4px 0 0 #0f6f66;box-shadow:inset 4px 0 0 var(--teal)}
.gal-tabs .tn{grid-row:span 2;width:2.3rem;height:2.3rem;border-radius:9px;display:grid;place-items:center;background:#e7edeb;background:var(--bg-2);color:#33415a;color:var(--ink-2)}
.gal-tabs [aria-selected=true] .tn{background:#0f6f66;background:var(--teal);color:#fff;color:var(--on-teal)}
.gal-tabs b{font-weight:600;line-height:1.25}
.gal-tabs small{color:#55627a;color:var(--muted);font-size:.85rem}
.gal-panel,.gal-fig{margin:0}
.gal-text{display:grid;grid-template-columns:1fr 1fr;gap:.6rem 2rem;margin-top:1.1rem}
.gal-text p{margin:0;color:#33415a;color:var(--ink-2)}
.gal-text b{display:block;color:#13213a;color:var(--ink);font-weight:600}
.gal-foot{display:flex;flex-wrap:wrap;gap:.6rem 1.2rem;align-items:center;margin-top:1rem}
.no-flexgap .gal-foot>*{margin-right:1.2rem;margin-bottom:.6rem}
.gal-foot a{font-weight:600}
.gal-panel:not(.on){display:none}
.gal-panel+.gal-panel{margin-top:0}
html:not(.js) .gal{grid-template-columns:1fr}
html:not(.js) .gal-tabs{display:none!important}
html:not(.js) .gal-panel:not(.on){display:block}
html:not(.js) .gal-panel+.gal-panel{margin-top:3rem}
@media (max-width:900px){
  .gal{grid-template-columns:1fr}
  .gal-tabs{position:static;display:flex;overflow-x:auto;gap:.5rem;margin:0 calc(-1*16px);margin:0 calc(-1*var(--gut));padding:.2rem 16px .6rem;padding:.2rem var(--gut) .6rem;scroll-snap-type:x mandatory;scroll-padding-inline:16px;scroll-padding-inline:var(--gut);scrollbar-width:none}
  .no-flexgap .gal-tabs>:not(:last-child),.no-flexgap .gal-tabs>:only-child{margin-right:.5rem}
  .gal-tabs::-webkit-scrollbar{display:none}
  .gal-tabs button{flex:none;scroll-snap-align:start;padding:.65rem .85rem;gap:0 .7rem}
  .gal-tabs .tn{width:2rem;height:2rem}
  .gal-text{grid-template-columns:1fr}
}
.ba.swap .ba-stage{animation:swap .45s cubic-bezier(.2,.8,.2,1)}
@keyframes swap{from{opacity:.4;transform:scale(.985)}}

/* demo strip */
.demo{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:1.5rem;gap:max(1.5rem,min(4vw,4rem));align-items:center;margin-top:3.5rem;margin-top:max(3.5rem,min(7vw,5.5rem));padding:1.5rem;padding:max(1.5rem,min(3.5vw,2.5rem));border-radius:18px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line)}
.demo h3{font:720 1.5rem/1.1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:720 max(1.5rem,min(1.1rem + 1vw,2rem))/1.1 var(--f-disp);letter-spacing:-.015em;margin-bottom:.6em}
.demo p{color:#33415a;color:var(--ink-2)}
.demo .small{font-size:.92rem;color:#55627a;color:var(--muted)}
.demo-shot{margin:0;border-radius:12px;overflow:hidden;border:1px solid #d3dcda;border:1px solid var(--line);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow);background:#fff}
.demo-shot img{display:block;width:100%;height:auto}
@media (max-width:860px){.demo{grid-template-columns:1fr}}

/* steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;gap:max(1rem,min(2.5vw,2rem));position:relative;counter-reset:s}
.steps::before,.steps::after{content:"";position:absolute;left:24px;right:calc(25% - 24px);top:23px;height:2px;background:#b7c4c1;background:var(--line-2)}
.steps::after{background:#0f6f66;background:var(--teal);transform-origin:left;transform:scaleX(1)}
.steps li{position:relative;counter-increment:s}
.steps .n{position:relative;z-index:1;display:grid;place-items:center;width:48px;height:48px;margin-bottom:1.1rem;border-radius:50%;background:#f2f5f4;background:var(--bg);border:2px solid #0f6f66;border:2px solid var(--teal);color:#0b524c;color:var(--teal-2);font:740 1.25rem/1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:740 1.25rem/1 var(--f-disp)}
.steps li:first-child .n{background:#0f6f66;background:var(--teal);color:#fff;color:var(--on-teal)}
.steps h3{margin-bottom:.45em}
.steps p{margin:0;color:#33415a;color:var(--ink-2)}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .steps::after{animation:fill linear both;animation-timeline:view();animation-range:entry 60% cover 55%}
    .steps li .n{animation:fillN linear both;animation-timeline:view(block);animation-range:entry 80% cover 45%}
  }
}
@keyframes fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes fillN{0%,60%{background:#f2f5f4;background:var(--bg);color:#0b524c;color:var(--teal-2)}61%,100%{background:#0f6f66;background:var(--teal);color:#fff;color:var(--on-teal)}}
@media (max-width:900px){
  .steps{grid-template-columns:1fr;gap:1.8rem}
  .steps::before,.steps::after{left:23px;right:auto;top:24px;bottom:24px;width:2px;height:auto;transform-origin:top}
  .steps li{display:grid;grid-template-columns:48px minmax(0,1fr);gap:0 1.1rem}
  .steps .n{grid-row:span 2;margin:0}
  @supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference){.steps::after{animation-name:fillY}}}
}
@keyframes fillY{from{transform:scaleY(0)}to{transform:scaleY(1)}}

/* estimator */
.est-band{background:#fff;background:var(--surface);border-top:1px solid #d3dcda;border-bottom:1px solid #d3dcda;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.est{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:1.5rem;gap:max(1.5rem,min(4vw,4rem));align-items:start}
.est-form{display:grid;gap:1.5rem;margin:0}
.est-form fieldset{margin:0;padding:0;border:0;min-width:0}
.est-form legend{padding:0;margin-bottom:.6rem;font-weight:600}
.opts{display:flex;flex-wrap:wrap;gap:.45rem}
.no-flexgap .opts>*{margin-right:.45rem;margin-bottom:.45rem}
.opt{position:relative}
.opt input{position:absolute;opacity:0;top:0;right:0;bottom:0;left:0;margin:0;cursor:pointer}
.opt span{display:inline-flex;align-items:center;min-height:44px;padding:.45em 1em;border-radius:10px;border:1.5px solid #b7c4c1;border:1.5px solid var(--line-2);background:#f2f5f4;background:var(--bg);color:#13213a;color:var(--ink);font-size:.95rem;font-weight:500;cursor:pointer;transition:background-color .15s, border-color .15s, color .15s, transform .15s}
.opt input:hover+span{border-color:#33415a;border-color:var(--ink-2)}
.opt input:checked+span{background:#0f6f66;background:var(--teal);border-color:#0f6f66;border-color:var(--teal);color:#fff;color:var(--on-teal)}
.opt input:focus-visible+span{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:2px}
.no-fv .opt input:focus+span{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:2px}
.opt input:active+span{transform:scale(.97)}
.est-out{position:sticky;top:calc(64px + 24px);top:calc(var(--head) + 24px);padding:1.4rem;padding:max(1.4rem,min(3vw,2rem));border-radius:18px;background:#13213a;background:var(--dark);color:#eef3f5;color:var(--on-dark);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow)}
.est-k{margin:0 0 .3rem;color:#b9c6d6;color:var(--on-dark-2);font-weight:500}
.est-v{margin:0 0 1.1rem;font:760 2rem/1.05 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:760 max(2rem,min(1.4rem + 2vw,2.9rem))/1.05 var(--f-disp);letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:#fff}
.est-v small{display:block;font:500 1rem/1.4 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:500 1rem/1.4 var(--f-body);letter-spacing:0;color:#b9c6d6;color:var(--on-dark-2);margin-top:.3rem}
.est-v.bump{animation:bump .5s cubic-bezier(.2,.8,.2,1)}
@keyframes bump{from{color:#a7efe5}}
.est-out p,.brief-out p{color:#b9c6d6;color:var(--on-dark-2)}
.est-out .pil,.brief-out .pil{color:#fff;padding:.8rem 0;border-top:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.14);margin-bottom:1rem}
.est-out .tiny,.brief-out .tiny{font-size:.9rem;margin-bottom:1.3rem}
.est-out .btn{--b:#5cc3b6;--b-rgb:92,195,182;color:#062420;width:100%}
.est-terms{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:1rem 3rem;margin-top:1rem;padding-top:1.6rem;border-top:1px solid #d3dcda;border-top:1px solid var(--line);color:#33415a;color:var(--ink-2)}
.est-terms p{margin:0}
.est-new{grid-column:1/-1;padding:1rem 1.2rem;border-radius:12px;background:#f2f5f4;background:var(--bg);border:1px dashed #b7c4c1;border:1px dashed var(--line-2)}
.est-new a{font-weight:600;white-space:nowrap}
@media (max-width:900px){.est{grid-template-columns:1fr}.est-out{position:static}.est-terms{grid-template-columns:1fr}}

/* guarantees */
.gu{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:2rem;gap:max(2rem,min(5vw,5rem));align-items:start}
.gu-list{list-style:none;margin:0;padding:0;display:grid;gap:1.5rem}
.gu-list li{display:grid;grid-template-columns:2.4rem minmax(0,1fr);gap:.2rem 1rem}
.gu-list .ic{grid-row:span 2;width:2.4rem;height:2.4rem;padding:.5rem;border-radius:10px;background:#d6ebe7;background:var(--teal-soft);color:#0b524c;color:var(--teal-2);stroke-width:1.7}
.gu-list p{margin:0;color:#33415a;color:var(--ink-2)}
.tr{margin:0;border-radius:16px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow);overflow:hidden}
.tr-h{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.2rem;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line);font-weight:600}
.no-flexgap .tr-h>:not(:last-child),.no-flexgap .tr-h>:only-child{margin-right:1rem}
.tr table{width:100%;border-collapse:collapse;font-size:.93rem;font-variant-numeric:tabular-nums}
.tr th{padding:.6rem 1.2rem;text-align:left;font-weight:500;color:#55627a;color:var(--muted);font-size:.82rem;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line)}
.tr td{padding:.75rem 1.2rem;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line)}
.tr td.r,.tr th.r{text-align:right}
.tick{display:inline-grid;place-items:center;width:1.4rem;height:1.4rem;border-radius:50%;background:#e3f3ea;background:var(--ok-soft);color:#1f7a4d;color:var(--ok);vertical-align:middle}
.tick .ic{width:.9rem;height:.9rem;stroke-width:2.6}
.tr-f{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;padding:.9rem 1.2rem;background:#e3f3ea;background:var(--ok-soft);color:#1f7a4d;color:var(--ok);font-weight:600}
.no-flexgap .tr-f>*{margin-right:1rem;margin-bottom:1rem}
.tr-f .exl{font-weight:600}
.tr.run tbody tr{animation:scan .9s ease-out backwards}
.tr.run .tick{animation:pop .45s cubic-bezier(.3,1.6,.5,1) backwards}
.tr.run tbody tr:nth-child(1),.tr.run tbody tr:nth-child(1) .tick{animation-delay:.1s}
.tr.run tbody tr:nth-child(2),.tr.run tbody tr:nth-child(2) .tick{animation-delay:.45s}
.tr.run tbody tr:nth-child(3),.tr.run tbody tr:nth-child(3) .tick{animation-delay:.8s}
.tr.run tbody tr:nth-child(4),.tr.run tbody tr:nth-child(4) .tick{animation-delay:1.15s}
.tr.run .tr-f{animation:fadein .5s 1.6s backwards}
@keyframes scan{from{background:rgba(var(--teal-rgb),0.14);background:color-mix(in srgb,var(--teal) 14%,transparent)}}
@keyframes pop{from{transform:scale(0)}}
@keyframes fadein{from{opacity:0}}
@media (max-width:900px){.gu{grid-template-columns:1fr}.tr{position:static}}
@media (max-width:480px){.tr th,.tr td{padding-left:.7rem;padding-right:.7rem}.tr .hide-s{display:none}}

/* vendors */
.ven{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:2rem;gap:max(2rem,min(5vw,5rem));align-items:center}
.ven p{color:#33415a;color:var(--ink-2)}
.ven h2{margin-bottom:.55em}
.ven ol{list-style:none;margin:0;padding:0;display:grid;gap:0;counter-reset:v}
.ven ol li{counter-increment:v;display:grid;grid-template-columns:2.6rem minmax(0,1fr);gap:1rem;align-items:start;padding:1.1rem 0;border-bottom:1px dashed #b7c4c1;border-bottom:1px dashed var(--line-2);font-weight:500}
.ven ol li:first-child{border-top:1px dashed #b7c4c1;border-top:1px dashed var(--line-2)}
.ven ol li::before{content:counter(v);display:grid;place-items:center;width:2.2rem;height:2.2rem;border-radius:8px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line);font:700 1rem/1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1rem/1 var(--f-disp);color:#0b524c;color:var(--teal-2)}
@media (max-width:860px){.ven{grid-template-columns:1fr}}

/* faq */
.faq-w{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:1.5rem;gap:max(1.5rem,min(4vw,4rem));align-items:start}
.faq{border-top:1px solid #d3dcda;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line)}
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1.2rem;padding:1.15rem 0;cursor:pointer;font-weight:600;font-size:1.06rem}
.no-flexgap .faq summary>:not(:last-child),.no-flexgap .faq summary>:only-child{margin-right:1.2rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:28px;height:28px;border-radius:50%;border:1.5px solid #b7c4c1;border:1.5px solid var(--line-2);background:linear-gradient(#13213a,#13213a) center/12px 2px no-repeat,linear-gradient(#13213a,#13213a) center/2px 12px no-repeat;background:linear-gradient(var(--ink),var(--ink)) center/12px 2px no-repeat,linear-gradient(var(--ink),var(--ink)) center/2px 12px no-repeat;transition:transform .3s cubic-bezier(.2,.8,.2,1), background-color .2s}
.faq details[open] summary::after{transform:rotate(135deg);border-color:#0f6f66;border-color:var(--teal)}
.faq summary:hover{color:#0b524c;color:var(--teal-2)}
.faq .ans{padding:0 2.8rem 1.25rem 0;color:#33415a;color:var(--ink-2)}
.faq .ans p{margin:0}
@supports (interpolate-size:allow-keywords){
  @media (prefers-reduced-motion:no-preference){
    .faq{interpolate-size:allow-keywords}
    .faq details::details-content{height:0;overflow:hidden;overflow:clip;transition:height .35s cubic-bezier(.2,.8,.2,1), content-visibility .35s allow-discrete}
    .faq details[open]::details-content{height:auto}
  }
}
@media (max-width:860px){.faq-w{grid-template-columns:1fr}.faq .ans{padding-right:0}}

/* contact */
.contact{background:#13213a;background:var(--dark);color:#eef3f5;color:var(--on-dark);padding:4.5rem 0;padding:max(4.5rem,min(9vw,7.5rem)) 0;position:relative;overflow:hidden}
.contact::before{content:"";position:absolute;top:auto;right:-10%;bottom:-40%;left:auto;width:60%;height:120%;background-image:conic-gradient(rgba(255,255,255,.06) 25%,transparent 0 50%,rgba(255,255,255,.06) 0 75%,transparent 0);background-size:10px 10px;-webkit-mask-image:radial-gradient(closest-side,#000,transparent);mask-image:radial-gradient(closest-side,#000,transparent);pointer-events:none}
.contact h2{color:#fff;margin-bottom:.4em}
.contact p{color:#b9c6d6;color:var(--on-dark-2);max-width:40rem}
.mail-big{display:inline-block;margin:.2rem 0 1.6rem;font:760 1.05rem/1.1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:760 max(1.05rem,min(5.2vw,3.6rem))/1.1 var(--f-disp);letter-spacing:-.025em;color:#fff;text-decoration:none;overflow-wrap:anywhere;background:linear-gradient(#5cc3b6,#5cc3b6) 0 100%/100% 3px no-repeat;padding-bottom:.12em;transition:background-size .3s}
.mail-big:hover{color:#a7efe5}
.contact .actions{margin-bottom:1.6rem}
.contact .btn{--b:#5cc3b6;--b-rgb:92,195,182;color:#062420}
.contact .btn.ghost{color:#fff;border-color:rgba(255,255,255,.35);background:transparent}
.contact .btn.ghost:hover{border-color:#fff}
.c-where{margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid rgba(255,255,255,.12);font-weight:500;color:#fff!important}
.copy-st{min-height:1.5em;font-size:.95rem;color:#a7efe5;margin:0}
html:not(.js) [data-copy]{display:none}
.contact :focus-visible{outline-color:#a7c4ff}
.no-fv .contact :focus{outline-color:#a7c4ff}

/* footer */
.site-foot{border-top:1px solid #d3dcda;border-top:1px solid var(--line);color:#55627a;color:var(--muted);font-size:.93rem;background:#f2f5f4;background:var(--bg)}
.ft{padding:3rem 0 2.5rem;padding:max(3rem,min(6vw,4.5rem)) 0 2.5rem}
.ft-brand{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 2rem;padding-bottom:1.8rem;margin-bottom:2.2rem;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line)}
.no-flexgap .ft-brand>*{margin-right:2rem;margin-bottom:.5rem}
.ft-brand p{margin:0}
.ft-brand .brand{margin-right:auto}
.ft-cols{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2rem 1.4rem}
.ft-brand .brand{font-size:1.05rem}
.ft-h{font:600 .85rem/1.2 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:600 .85rem/1.2 var(--f-body);color:#13213a;color:var(--ink);margin:.3rem 0 .9rem;letter-spacing:0}
.ft-col ul{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.ft a{color:#33415a;color:var(--ink-2);text-decoration:none}
.ft a:hover{color:#13213a;color:var(--ink);text-decoration:underline}
.ft a[aria-current]{color:#0b524c;color:var(--teal-2);font-weight:600}
.ft-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 2rem;padding:1.3rem 0 2.2rem;border-top:1px solid #d3dcda;border-top:1px solid var(--line);font-size:.85rem}
.no-flexgap .ft-bottom>*{margin-right:2rem;margin-bottom:.5rem}
@media (max-width:1100px){.ft-cols{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:640px){.ft-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.8rem 1rem}.ft-brand{flex-direction:column;align-items:flex-start}}

/* sticky mobile CTA */
.sticky{position:fixed;z-index:30;left:50%;bottom:14px;bottom:max(14px,env(safe-area-inset-bottom));transform:translate(-50%,0);display:none;align-items:center;gap:.5em;padding:.75em 1.3em;min-height:48px;border-radius:999px;background:#0f6f66;background:var(--teal);color:#fff;color:var(--on-teal);font-weight:600;text-decoration:none;box-shadow:0 10px 28px -8px rgba(19,33,58,.5);transition:transform .35s cubic-bezier(.2,.8,.2,1), opacity .35s}
.sticky .ic{width:1.2em;height:1.2em}
@media (max-width:760px){.sticky{display:inline-flex}body.has-sticky{padding-bottom:84px}}
.js .sticky.off{transform:translate(-50%,150%);opacity:0;pointer-events:none}

/* documents (privacy, unsubscribe, demo, 404) */
.doc{padding:2.5rem 0 3.5rem;padding:max(2.5rem,min(6vw,4.5rem)) 0 max(3.5rem,min(7vw,6rem))}
.doc .wrap{max-width:46rem}
.doc h1{font:760 2rem/1.06 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:760 max(2rem,min(1.3rem + 2.4vw,3rem))/1.06 var(--f-disp);letter-spacing:-.022em;margin-bottom:.5em}
.doc h2{font-size:1.4rem;line-height:1.25;margin:2.2rem 0 .6rem;letter-spacing:-.01em}
.doc ol{padding-left:1.4rem}
.doc li{margin-bottom:.4rem}
.doc .meta{color:#55627a;color:var(--muted)}
.callout{padding:1rem 1.2rem;border-radius:12px;background:#ffffe1;background:var(--tip);border:1px solid #d6cf93;border:1px solid var(--tip-line);color:#4a4410;color:var(--tip-ink)}
.callout p{margin:0}
.callout a{color:inherit}
.sign{margin-top:1.6rem}
.doc-grid{display:grid;grid-template-columns:15rem minmax(0,46rem);gap:2rem;gap:max(2rem,min(5vw,5rem));justify-content:center}
.doc.doc-toc .wrap{max-width:1200px;max-width:var(--wrap)}
.toc{position:sticky;top:calc(64px + 28px);top:calc(var(--head) + 28px);align-self:start;font-size:.9rem}
.toc-h{font-weight:600;color:#13213a;color:var(--ink);margin-bottom:.7rem}
.toc ol{list-style:none;margin:0;padding:0 0 0 .9rem;border-left:1px solid #d3dcda;border-left:1px solid var(--line);display:grid;gap:.15rem}
.toc a{display:block;padding:.25rem 0;color:#55627a;color:var(--muted);text-decoration:none;line-height:1.35}
.toc a:hover,.toc a.on{color:#13213a;color:var(--ink)}
.toc a.on{font-weight:600}
@media (max-width:900px){.doc-grid{grid-template-columns:1fr}.toc{position:static;padding:1rem 1.2rem;border:1px solid #d3dcda;border:1px solid var(--line);border-radius:12px;background:#fff;background:var(--surface)}.toc ol{columns:2;display:block;border:0;padding:0}.toc li{break-inside:avoid}}
@media (max-width:520px){.toc ol{columns:1}}
.doc h2[id]{scroll-margin-top:calc(64px + 20px);scroll-margin-top:calc(var(--head) + 20px)}
.nf{padding:3rem 0 3.5rem;padding:max(3rem,min(8vw,6rem)) 0 max(3.5rem,min(7vw,6rem))}
.nf-stage{display:grid;place-items:center;padding:2.5rem 1rem;padding:max(2.5rem,min(6vw,4.5rem)) 1rem;border-radius:20px;background:#008080;background-image:conic-gradient(rgba(255,255,255,.06) 25%,transparent 0 50%,rgba(255,255,255,.06) 0 75%,transparent 0);background-size:8px 8px}
.nf-dlg{width:100%;width:min(30rem,100%);font-size:14px}
.nf-body{display:flex;gap:1rem;align-items:flex-start;padding:1.2rem 1.1rem .6rem}
.no-flexgap .nf-body>:not(:last-child),.no-flexgap .nf-body>:only-child{margin-right:1rem}
.nf-ico{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#ffd800;border:1px solid #806c00;color:#000;font:700 20px/1 Tahoma,sans-serif;box-shadow:inset -2px -2px rgba(0,0,0,.18)}
.nf-dlg h1{font:700 1.15em/1.3 Tahoma,Verdana,sans-serif;letter-spacing:0;margin:0 0 .4em;color:#000}
.nf-dlg p{margin:0;font:1em/1.45 Tahoma,Verdana,sans-serif;color:#000}
.nf-btns{display:flex;justify-content:center;padding:.6rem 1rem 1.1rem}
.nf-btns .bt{color:#000;text-decoration:none;font:1em Tahoma,Verdana,sans-serif;padding:.45em 1.4em}
.nf-btns .bt:focus-visible{outline:1px dotted #000;outline-offset:-5px}
.no-fv .nf-btns .bt:focus{outline:1px dotted #000;outline-offset:-5px}
.nf-btns .bt:active{box-shadow:inset 1px 1px #0a0a0a,inset -1px -1px #fff,inset 2px 2px #808080}
.nf-oh{font:700 1.3rem/1.2 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.3rem/1.2 var(--f-disp);margin:2.5rem 0 1.2rem;margin:max(2.5rem,min(5vw,3.5rem)) 0 1.2rem}
.nf-others{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.nf-others section{padding:1.2rem;border:1px solid #d3dcda;border:1px solid var(--line);border-radius:14px;background:#fff;background:var(--surface)}
.nf-others h2{font:700 1.1rem/1.2 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.1rem/1.2 var(--f-disp);margin:0 0 .5rem}
.nf-others p{color:#33415a;color:var(--ink-2);font-size:.93rem}
.nf-others p:last-child{margin:0}
@media (max-width:900px){.nf-others{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.nf-others{grid-template-columns:1fr}}
.multi section+section{margin-top:2.6rem;padding-top:2.2rem;border-top:1px solid #d3dcda;border-top:1px solid var(--line)}
.multi h2{font:740 1.6rem/1.1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:740 1.6rem/1.1 var(--f-disp);margin:0 0 .5em}

/* ---------------------------------------------------------------- home: links to the service pages */
.svc-i h3 a{color:inherit;text-decoration:none}
.svc-i h3 a::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit}
.svc-i h3 a .ic{width:.85em;height:.85em;margin-left:.35em;vertical-align:-.08em;color:#0f6f66;color:var(--teal);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.svc-i:hover h3 a .ic{transform:translateX(3px)}
.svc-i h3 a:hover{text-decoration:underline;text-decoration-thickness:2px}
.svc-i h3 a:focus-visible{outline:none}
.no-fv .svc-i h3 a:focus{outline:none}
.svc-i h3 a:focus-visible::after{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:2px}
.no-fv .svc-i h3 a:focus::after{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:2px}
.svc-tech{grid-column:1;margin-top:1.2rem;padding-top:1.05rem;border-top:1px solid rgba(255,255,255,.14)}
.svc-tech span{font-size:.82rem;color:#b9c6d6;color:var(--on-dark-2)}
.svc-tech ul{list-style:none;margin:.55rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.45rem}
.no-flexgap .svc-tech ul>*{margin-right:.45rem;margin-bottom:.45rem}
.svc-tech a{display:inline-flex;align-items:center;gap:.4em;min-height:40px;padding:.4em .8em;border-radius:9px;border:1px solid rgba(255,255,255,.24);color:#fff;font-size:.92rem;font-weight:600;text-decoration:none;transition:border-color .2s, color .2s, background-color .2s}
.no-flexgap .svc-tech a>:not(:last-child),.no-flexgap .svc-tech a>:only-child{margin-right:.4em}
.svc-tech a .ic{width:.95em;height:.95em;color:#5cc3b6;transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.svc-tech a:hover{border-color:#5cc3b6;background:rgba(92,195,182,.1)}
.svc-tech a:hover .ic{transform:translateX(2px)}
.svc-tech a:focus-visible{outline-color:#a7c4ff}
.no-fv .svc-tech a:focus{outline-color:#a7c4ff}

/* ---------------------------------------------------------------- service landing pages */
.lp p code,.lp li code,.lp summary code,.lp h3 code{font:500 .86em/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;padding:.08em .38em;border-radius:5px;background:rgba(var(--ink-rgb),0.07);background:color-mix(in srgb,var(--ink) 7%,transparent);color:#13213a;color:var(--ink);overflow-wrap:anywhere}
.lp-hero{position:relative;overflow:hidden;padding:1.4rem 0 3rem;padding:max(1.4rem,min(3.5vw,2.4rem)) 0 max(3rem,min(6vw,5rem))}
.lp-hero::before{content:"";position:absolute;top:0;right:0;bottom:auto;left:auto;width:55%;height:85%;background-image:conic-gradient(#d3dcda 25%,transparent 0 50%,#d3dcda 0 75%,transparent 0);background-image:conic-gradient(var(--line) 25%,transparent 0 50%,var(--line) 0 75%,transparent 0);background-size:8px 8px;-webkit-mask-image:radial-gradient(120% 100% at 100% 0,#000 20%,transparent 70%);mask-image:radial-gradient(120% 100% at 100% 0,#000 20%,transparent 70%);opacity:.7;pointer-events:none}
.lp-hero .wrap{position:relative}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.2rem .55rem;font-size:.9rem;color:#55627a;color:var(--muted)}
.no-flexgap .crumbs ol>*{margin-right:.55rem;margin-bottom:.2rem}
.crumbs li{display:flex;align-items:center;gap:.55rem}
.no-flexgap .crumbs li>:not(:last-child),.no-flexgap .crumbs li>:only-child{margin-right:.55rem}
.crumbs li+li::before{content:"/";color:#b7c4c1;color:var(--line-2)}
.crumbs a{color:#33415a;color:var(--ink-2);text-decoration:none}
.crumbs a:hover{color:#13213a;color:var(--ink);text-decoration:underline}
.crumbs [aria-current]{color:#13213a;color:var(--ink);font-weight:600}
.lp-hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4.6fr);gap:2rem;gap:max(2rem,min(5vw,4.5rem));align-items:start;margin-top:1.6rem;margin-top:max(1.6rem,min(4vw,2.8rem))}
.lp-hero h1{font:780 2.25rem/1.01 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:780 max(2.25rem,min(1.05rem + 3.5vw,4.35rem))/1.01 var(--f-disp);letter-spacing:-.03em;margin-bottom:.5em;max-width:13.5em}
.lp-hero[lang=de] h1,[lang=de] .lp-hero h1{font-stretch:86%}
.lp-hero .lead{margin-bottom:1.8rem}
@media (prefers-reduced-motion:no-preference){
  .lp-hero h1{animation:fadeup .8s cubic-bezier(.2,.8,.2,1) backwards}
  .lp-hero .lead,.lp-hero .actions{animation:fadeup .9s .12s cubic-bezier(.2,.8,.2,1) backwards}
  .lp-glance{animation:fadeup .9s .22s cubic-bezier(.2,.8,.2,1) backwards}
}
.lp-glance{padding:1.3rem;padding:max(1.3rem,min(2.6vw,1.9rem));border-radius:18px;background:#13213a;background:var(--dark);color:#eef3f5;color:var(--on-dark);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow);margin-top:.35rem}
.lp-glance h2{font:600 .95rem/1.3 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:600 .95rem/1.3 var(--f-body);letter-spacing:0;color:#b9c6d6;color:var(--on-dark-2);margin:0 0 .4rem}
.lp-glance dl{margin:0}
.lp-glance dl div{padding:.85rem 0;border-bottom:1px solid rgba(255,255,255,.13)}
.lp-glance dl div:last-child{border-bottom:0}
.lp-glance dt{font-weight:600;color:#fff}
.lp-glance dd{margin:.15rem 0 0;color:#b9c6d6;color:var(--on-dark-2);font-size:.96rem}
.lp-files{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;margin-top:.6rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.13)}
.no-flexgap .lp-files>*{margin-right:.35rem;margin-bottom:.35rem}
.lp-files span{width:100%;font-size:.82rem;color:#b9c6d6;color:var(--on-dark-2);margin-bottom:.15rem}
.lp-files code{font:500 .8rem/1 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:500 .8rem/1 var(--f-body);padding:.38em .58em;border-radius:6px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#e5ecf2}
@media (max-width:960px){.lp-hero-grid{grid-template-columns:1fr}.lp-glance{margin-top:0}.lp-hero::before{width:100%;height:45%}}

.lp-why-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4.6fr);gap:2rem;gap:max(2rem,min(5vw,4.5rem));align-items:start}
.lp-why-text h2{margin-bottom:.55em}
.lp-why-text p{color:#33415a;color:var(--ink-2);max-width:42rem}
.lp-why-text p:last-child{margin-bottom:0}
.lp-dates{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.lp-dates li{padding:1.15rem 1.3rem;border-radius:14px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line);border-left:4px solid #0f6f66;border-left:4px solid var(--teal)}
.lp-dates time{display:block;font:740 1.7rem/1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:740 max(1.7rem,min(1.2rem + 1.3vw,2.35rem))/1 var(--f-disp);letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-bottom:.45rem}
.lp-dates b{display:block;font-weight:600;line-height:1.35}
.lp-dates span{color:#55627a;color:var(--muted);font-size:.95rem}
@media (max-width:900px){.lp-why-grid{grid-template-columns:1fr}}

.lp-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.lp-cards li{padding:1.25rem;padding:max(1.25rem,min(2.3vw,1.65rem));border-radius:16px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line)}
.lp-cards h3{font:700 1.17rem/1.25 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.17rem/1.25 var(--f-disp);letter-spacing:-.01em;margin-bottom:.5rem}
.lp-cards p{margin:0;color:#33415a;color:var(--ink-2)}
@media (max-width:1000px){.lp-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.lp-cards{grid-template-columns:1fr}}

.lp-web{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:2rem;gap:max(2rem,min(4.5vw,4rem));align-items:start}
.lp-fig{margin:0}
.lp-map h3{font:700 1.3rem/1.2 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.3rem/1.2 var(--f-disp);letter-spacing:-.01em;margin:2rem 0 1rem}
.lp-map-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:2.2rem;margin:0 0 .4rem;font-size:.82rem;font-weight:600;color:#55627a;color:var(--muted)}
.lp-map dl{margin:0;border-top:1px solid #b7c4c1;border-top:1px solid var(--line-2)}
.lp-map dl div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:2.2rem;padding:.8rem 0;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line)}
.lp-map dt{position:relative;color:#33415a;color:var(--ink-2);font-size:.96rem}
.lp-map dt::after{content:"";position:absolute;right:-1.5rem;top:.62em;width:.8rem;height:2px;background:#0f6f66;background:var(--teal)}
.lp-map dt::before{content:"";position:absolute;right:-1.52rem;top:calc(.62em - 3px);width:6px;height:6px;border-top:2px solid #0f6f66;border-top:2px solid var(--teal);border-right:2px solid #0f6f66;border-right:2px solid var(--teal);transform:rotate(45deg)}
.lp-map dd{margin:0;font-weight:600;font-size:.96rem}
@media (max-width:900px){.lp-web{grid-template-columns:1fr}.lp-map h3{margin-top:0}}
@media (max-width:480px){.lp-map-cols,.lp-map dl div{column-gap:1.7rem}.lp-map dt::after{right:-1.2rem;width:.6rem}.lp-map dt::before{right:-1.22rem}}

.lp-pit{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 2rem;gap:0 max(2rem,min(4.5vw,4rem));counter-reset:p}
.lp-pit li{counter-increment:p;padding:1.4rem 0 1.6rem;border-top:1px solid #b7c4c1;border-top:1px solid var(--line-2)}
.lp-pit li::before{content:counter(p,decimal-leading-zero);display:block;margin-bottom:.55rem;font:700 .9rem/1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 .9rem/1 var(--f-disp);color:#0b524c;color:var(--teal-2);font-variant-numeric:tabular-nums}
.lp-pit h3{font:700 1.15rem/1.3 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.15rem/1.3 var(--f-disp);letter-spacing:-.01em;margin-bottom:.45rem}
.lp-pit p{margin:0;color:#33415a;color:var(--ink-2)}
@media (max-width:860px){.lp-pit{grid-template-columns:1fr}}

.lp-price{display:grid;grid-template-columns:minmax(0,5.6fr) minmax(0,6.4fr);gap:1.6rem;gap:max(1.6rem,min(4.5vw,4rem));align-items:start}
.lp-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.lp-stat{padding:1.25rem 1.3rem;border-radius:16px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line)}
.lp-stat p{margin:0}
.lp-stat .k{font-weight:600;color:#33415a;color:var(--ink-2);font-size:.93rem;margin-bottom:.4rem}
.lp-stat .v{font:760 1.35rem/1.1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:760 max(1.35rem,min(1.05rem + .8vw,1.8rem))/1.1 var(--f-disp);letter-spacing:-.02em;color:#0b524c;color:var(--teal-2);font-variant-numeric:tabular-nums;margin-bottom:.45rem;overflow-wrap:anywhere}
.lp-stat .s{color:#55627a;color:var(--muted);font-size:.9rem}
.lp-price-text p{color:#33415a;color:var(--ink-2);max-width:42rem}
.lp-arrow{display:inline-flex;align-items:center;gap:.45em;font-weight:600}
.no-flexgap .lp-arrow>:not(:last-child),.no-flexgap .lp-arrow>:only-child{margin-right:.45em}
.lp-arrow .ic{transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.lp-arrow:hover .ic{transform:translateX(3px)}
@media (max-width:900px){.lp-price{grid-template-columns:1fr}}
@media (max-width:400px){.lp-stats{grid-template-columns:1fr}}

.lp-parts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.lp-part{padding:1.3rem;padding:max(1.3rem,min(2.6vw,2rem));border-radius:18px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line);scroll-margin-top:calc(64px + 16px);scroll-margin-top:calc(var(--head) + 16px);transition:border-color .3s, box-shadow .3s}
.lp-part:target{border-color:#0f6f66;border-color:var(--teal);box-shadow:0 0 0 3px rgba(var(--teal-rgb),0.22);box-shadow:0 0 0 3px color-mix(in srgb,var(--teal) 22%,transparent)}
.lp-part h3{font:700 1.25rem/1.2 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 max(1.25rem,min(1.1rem + .5vw,1.5rem))/1.2 var(--f-disp);letter-spacing:-.012em;margin-bottom:.6rem}
.lp-part p{color:#33415a;color:var(--ink-2);margin-bottom:1.1rem}
.lp-part ul{list-style:none;margin:0;padding:0}
.lp-part li{position:relative;padding:.55rem 0 .55rem 1.7rem;border-top:1px dashed #b7c4c1;border-top:1px dashed var(--line-2)}
.lp-part li::before{content:"";position:absolute;left:.2rem;top:1.05em;width:.6rem;height:.32rem;border-left:2px solid #0f6f66;border-left:2px solid var(--teal);border-bottom:2px solid #0f6f66;border-bottom:2px solid var(--teal);transform:rotate(-45deg)}
@media (max-width:860px){.lp-parts{grid-template-columns:1fr}}

.lp-rel-sec{padding:3.2rem 0;padding:max(3.2rem,min(6.5vw,5rem)) 0}
.lp-rel-sec h2{font-size:1.65rem;font-size:max(1.65rem,min(1.15rem + 1.5vw,2.3rem))}
.lp-rel{list-style:none;margin:1.6rem 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.lp-rel a{display:grid;grid-template-columns:minmax(0,1fr) auto;align-content:start;gap:.3rem 1rem;height:100%;padding:1.1rem 1.2rem;border-radius:14px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line);color:#13213a;color:var(--ink);text-decoration:none;transition:border-color .2s, transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s}
.lp-rel b{font-weight:600;line-height:1.3}
.lp-rel span{grid-column:1;color:#33415a;color:var(--ink-2);font-size:.93rem}
.lp-rel .ic{grid-column:2;grid-row:1/span 2;align-self:center;color:#0f6f66;color:var(--teal);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.lp-rel a:hover{border-color:#b7c4c1;border-color:var(--line-2);transform:translateY(-2px);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow)}
.lp-rel a:hover b{text-decoration:underline}
.lp-rel a:hover .ic{transform:translateX(3px)}
@media (max-width:1000px){.lp-rel{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.lp-rel{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- Northwind case study (fragment styles from the case-study project) */
/* Styles for the Northwind case-study fragments; add to the site stylesheet. */
.case-study header .actions,.case-study>.actions{display:flex;flex-wrap:wrap;gap:10px;margin:1.2rem 0 0}
.no-flexgap .case-study header .actions>*,.no-flexgap .case-study>.actions>*{margin-right:10px;margin-bottom:10px}
.case-study>.actions{margin-top:1.6rem}
.case-study h3{margin:1.6rem 0 .4rem}
.case-study .figures{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:1rem 0 0;padding:0}
.case-study .figures div{background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line);border-radius:14px;padding:14px 16px;min-width:0}
.case-study .figures dt{font:740 1.45rem/1.1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:740 1.45rem/1.1 var(--f-disp);letter-spacing:-.02em;white-space:nowrap}
.case-study .figures dd{margin:.35rem 0 0;color:#55627a;color:var(--muted);font-size:.92rem;line-height:1.4}
.case-study .small{margin-top:1.6rem}
@media (max-width:520px){.case-study .figures{grid-template-columns:minmax(0,1fr)}}
.cs-doc{padding-top:1.4rem;padding-top:max(1.4rem,min(3.5vw,2.4rem))}
.cs-doc .crumbs{margin-bottom:1.4rem;margin-bottom:max(1.4rem,min(3.5vw,2.4rem))}
.cs-doc .case-study h1{max-width:20em}
.cs-doc .lead{color:#33415a;color:var(--ink-2)}
.cs-doc .case-study h2{font:740 1.4rem/1.2 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:740 max(1.4rem,min(1.15rem + .8vw,1.75rem))/1.2 var(--f-disp);letter-spacing:-.015em;margin:2.6rem 0 .7rem}
.cs-doc .case-study ul,.cs-doc .case-study ol{padding-left:1.3rem}
.cs-doc .case-study li{margin-bottom:.5rem}
.cs-shot{margin:2.2rem 0 0}
.cs-shot img{display:block;width:100%;height:auto;border-radius:12px;border:1px solid #d3dcda;border:1px solid var(--line);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow);background:#fff}
.cs-shot figcaption{margin-top:.75rem;color:#55627a;color:var(--muted);font-size:.92rem}
@media (min-width:1100px){.cs-doc .cs-shot{margin-left:-8rem;margin-right:-8rem}}
.cs-link{margin:1.3rem 0 0;font-weight:600}
.cs-link a{display:inline-flex;align-items:center;gap:.45em;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:.1em}
.no-flexgap .cs-link a>:not(:last-child),.no-flexgap .cs-link a>:only-child{margin-right:.45em}
.cs-link a .ic{transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.cs-link a:hover .ic{transform:translateX(3px)}
.svc-cs{margin:.9rem 0 0}
.svc-cs a{display:inline-flex;align-items:center;gap:.4em;color:#a7efe5;font-weight:600;font-size:.95rem;text-decoration:underline;text-underline-offset:.2em}
.no-flexgap .svc-cs a>:not(:last-child),.no-flexgap .svc-cs a>:only-child{margin-right:.4em}
.svc-cs a .ic{width:.95em;height:.95em}
.svc-cs a:hover{color:#fff}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
@media print{.site-head,.sticky,.ba-handle{display:none}}

/* ================================================================ v3: navigation */
.mainnav{margin-left:auto;margin-right:auto}
.nav-l{display:flex;align-items:center;gap:.1rem;list-style:none;margin:0;padding:0}
.no-flexgap .nav-l>:not(:last-child),.no-flexgap .nav-l>:only-child{margin-right:.1rem}
.nav-l>li>a,.nav-b{position:relative;display:inline-flex;align-items:center;gap:.3em;min-height:40px;padding:0 .72em;border-radius:9px;border:0;background:none;color:#33415a;color:var(--ink-2);font:500 .93rem/1 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:500 .93rem/1 var(--f-body);text-decoration:none;white-space:nowrap;cursor:pointer;transition:color .2s, background-color .2s}
.no-flexgap .nav-l>li>a>:not(:last-child),.no-flexgap .nav-l>li>a>:only-child,.no-flexgap .nav-b>:not(:last-child),.no-flexgap .nav-b>:only-child{margin-right:.3em}
.nav-l>li>a:hover,.nav-b:hover,.has-mega.open .nav-b{color:#13213a;color:var(--ink);background:rgba(var(--ink-rgb),0.06);background:color-mix(in srgb,var(--ink) 6%,transparent)}
.nav-l>li>a::after,.nav-b::after{content:"";position:absolute;left:.72em;right:.72em;bottom:.3em;height:2px;border-radius:2px;background:#0f6f66;background:var(--teal);transform:scaleX(0);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.nav-l>li>a.on,.nav-l>li>a[aria-current],.nav-b[aria-current]{color:#13213a;color:var(--ink)}
.nav-l>li>a.on::after,.nav-l>li>a[aria-current]::after,.nav-b[aria-current]::after{transform:scaleX(1)}
.nav-b .chev{width:.95em;height:.95em;stroke-width:2.2;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.has-mega.open .nav-b .chev{transform:rotate(180deg)}
.hd .lang{flex:none}
@media (max-width:1179px){.mainnav{display:none}.hd .lang{margin-left:auto}}

/* mega menu */
.mega{position:absolute;left:0;right:0;top:100%;z-index:2;background:#fff;background:var(--surface);border-top:1px solid #d3dcda;border-bottom:1px solid #d3dcda;border-top:1px solid var(--line);border-bottom:1px solid var(--line);box-shadow:0 34px 60px -34px rgba(19,33,58,.42);opacity:0;visibility:hidden;transform:translateY(-8px);pointer-events:none;transition:opacity .2s ease, transform .3s cubic-bezier(.2,.8,.2,1), visibility 0s linear .3s}
.mega::after{content:"";position:absolute;left:0;right:0;top:100%;height:100vh;background:rgba(10,18,32,.22);opacity:0;transition:opacity .25s;pointer-events:none}
.has-mega.open .mega{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:0s}
.has-mega.open .mega::after{opacity:1}
html:not(.js) .has-mega:hover .mega{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:0s}
html:not(.js) .has-mega:focus-within .mega{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:0s}
.mg-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.4rem;padding:1.6rem 0 1.1rem}
.mega .mg-h{margin:0 0 .25rem;padding-left:.6rem;font:700 .74rem/1 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:700 .74rem/1 var(--f-body);letter-spacing:.09em;text-transform:uppercase;color:#0b524c;color:var(--teal-2)}
.mega .mg-d{margin:0 0 .7rem;padding-left:.6rem;color:#55627a;color:var(--muted);font-size:.84rem;line-height:1.35}
.mg-col>ul{list-style:none;margin:0;padding:0;display:grid;gap:.1rem}
.mg-a{display:grid;grid-template-columns:2.1rem minmax(0,1fr);gap:.7rem;align-items:start;padding:.55rem .6rem;border-radius:11px;color:#13213a;color:var(--ink);text-decoration:none;transition:background-color .15s}
.mg-a:hover{background:#f2f5f4;background:var(--bg)}
.mg-a:focus-visible{background:#f2f5f4;background:var(--bg)}
.no-fv .mg-a:focus{background:#f2f5f4;background:var(--bg)}
.mg-a[aria-current]{background:#d6ebe7;background:var(--teal-soft)}
.mg-ic{display:grid;place-items:center;width:2.1rem;height:2.1rem;border-radius:9px;background:#e7edeb;background:var(--bg-2);color:#0b524c;color:var(--teal-2);transition:background-color .2s, color .2s, transform .3s cubic-bezier(.2,.8,.2,1)}
.mg-ic .ic{width:1.15rem;height:1.15rem}
.mg-a:hover .mg-ic{background:#0f6f66;background:var(--teal);color:#fff;color:var(--on-teal);transform:translateY(-1px)}
.mg-t b{display:block;font-weight:600;font-size:.93rem;line-height:1.3}
.mg-t small{display:block;margin-top:.12rem;color:#55627a;color:var(--muted);font-size:.81rem;line-height:1.35}
.mg-sub{list-style:none;display:flex;flex-wrap:wrap;gap:.3rem;margin:0;padding:.15rem 0 .5rem 3.4rem}
.no-flexgap .mg-sub>*{margin-right:.3rem;margin-bottom:.3rem}
.mg-sub a{display:inline-flex;align-items:center;min-height:26px;padding:0 .55em;border-radius:6px;border:1px solid #d3dcda;border:1px solid var(--line);font-size:.79rem;font-weight:500;color:#33415a;color:var(--ink-2);text-decoration:none;transition:border-color .2s, color .2s}
.mg-sub a:hover,.mg-sub a[aria-current]{border-color:#0f6f66;border-color:var(--teal);color:#0b524c;color:var(--teal-2)}
.mg-foot{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;padding:1rem 0 1.4rem;border-top:1px solid #d3dcda;border-top:1px solid var(--line)}
.mg-foot a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.85rem;align-items:center;padding:.8rem 1rem;border-radius:12px;background:#f2f5f4;background:var(--bg);border:1px solid transparent;color:#13213a;color:var(--ink);text-decoration:none;transition:border-color .2s}
.mg-foot a:hover,.mg-foot a[aria-current]{border-color:#b7c4c1;border-color:var(--line-2)}
.mg-foot a:focus-visible{border-color:#b7c4c1;border-color:var(--line-2)}
.no-fv .mg-foot a:focus{border-color:#b7c4c1;border-color:var(--line-2)}
.mg-foot b{display:block;font-weight:600;font-size:.93rem}
.mg-foot small{display:block;color:#55627a;color:var(--muted);font-size:.82rem}
.mg-foot .ic{color:#0b524c;color:var(--teal-2)}
.mg-foot a>.ic:last-child{transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.mg-foot a:hover>.ic:last-child{transform:translateX(3px)}
@media (prefers-reduced-motion:no-preference){
  .has-mega.open .mg-col{animation:mgIn .45s cubic-bezier(.2,.8,.2,1) backwards}
  .has-mega.open .mg-col:nth-child(2){animation-delay:.04s}
  .has-mega.open .mg-col:nth-child(3){animation-delay:.08s}
  .has-mega.open .mg-col:nth-child(4){animation-delay:.12s}
}
@keyframes mgIn{from{opacity:0;transform:translateY(6px)}}

/* burger and full-screen mobile menu */
.burger{display:none;flex:none;place-items:center;width:44px;height:44px;padding:0;border-radius:10px;border:1px solid #d3dcda;border:1px solid var(--line);background:#fff;background:var(--surface);color:#13213a;color:var(--ink);cursor:pointer}
.burger .ic{width:1.3rem;height:1.3rem;stroke-width:2}
.burger .b-close,.burger[aria-expanded=true] .b-open{display:none}
.burger[aria-expanded=true] .b-close{display:block}
@media (max-width:1179px){.burger{display:inline-grid}}
html:not(.js) .burger{display:none!important}
.mnav{position:fixed;left:0;right:0;top:64px;top:var(--head);bottom:0;z-index:39;display:flex;flex-direction:column;gap:1.4rem;padding:.6rem 16px 1.5rem;padding:.6rem var(--gut) max(1.5rem,env(safe-area-inset-bottom));background:#f2f5f4;background:var(--bg);overflow-y:auto;overscroll-behavior:contain;border-top:1px solid #d3dcda;border-top:1px solid var(--line)}
.no-flexgap .mnav>*+*{margin-top:1.4rem}
@media (prefers-reduced-motion:no-preference){.mnav:not([hidden]){animation:mnIn .32s cubic-bezier(.2,.8,.2,1)}.mnav:not([hidden]) .mm-list>li{animation:mgIn .45s cubic-bezier(.2,.8,.2,1) backwards}.mnav .mm-list>li:nth-child(2){animation-delay:.03s}.mnav .mm-list>li:nth-child(3){animation-delay:.06s}.mnav .mm-list>li:nth-child(n+4){animation-delay:.09s}}
@keyframes mnIn{from{opacity:0;transform:translateY(-6px)}}
body.mn-open{overflow:hidden}
body.mn-open .sticky{display:none}
.mm-list{list-style:none;margin:0;padding:0}
.mm-top{display:flex;align-items:center;min-height:56px;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line);color:#13213a;color:var(--ink);text-decoration:none;font:700 1.35rem/1.2 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.35rem/1.2 var(--f-disp);letter-spacing:-.01em}
.mm-k{margin:1.2rem 0 .3rem;font:700 .74rem/1 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:700 .74rem/1 var(--f-body);letter-spacing:.09em;text-transform:uppercase;color:#0b524c;color:var(--teal-2)}
.mm-cat{border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line)}
.mm-cat summary{list-style:none;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.1rem 1rem;align-items:center;padding:.85rem 0;cursor:pointer}
.mm-cat summary::-webkit-details-marker{display:none}
.mm-cat summary span{font:700 1.15rem/1.2 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.15rem/1.2 var(--f-disp)}
.mm-cat summary small{grid-column:1;color:#55627a;color:var(--muted);font-size:.86rem}
.mm-cat summary::after{content:"";grid-column:2;grid-row:1/span 2;width:26px;height:26px;border-radius:50%;border:1.5px solid #b7c4c1;border:1.5px solid var(--line-2);background:linear-gradient(#13213a,#13213a) center/11px 2px no-repeat,linear-gradient(#13213a,#13213a) center/2px 11px no-repeat;background:linear-gradient(var(--ink),var(--ink)) center/11px 2px no-repeat,linear-gradient(var(--ink),var(--ink)) center/2px 11px no-repeat;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.mm-cat[open] summary::after{transform:rotate(135deg);border-color:#0f6f66;border-color:var(--teal)}
.mm-cat ul{list-style:none;margin:0;padding:0 0 .8rem}
.mm-cat li a{display:flex;align-items:center;gap:.75rem;min-height:46px;color:#13213a;color:var(--ink);text-decoration:none;font-weight:500}
.no-flexgap .mm-cat li a>:not(:last-child),.no-flexgap .mm-cat li a>:only-child{margin-right:.75rem}
.mm-cat li a .ic{color:#0b524c;color:var(--teal-2)}
.mm-cat li a[aria-current]{color:#0b524c;color:var(--teal-2);font-weight:700}
.mm-cat .mm-sub a{min-height:38px;padding-left:2rem;color:#33415a;color:var(--ink-2);font-size:.94rem}
.mm-all{display:inline-flex;align-items:center;gap:.45em;min-height:48px;font-weight:600}
.no-flexgap .mm-all>:not(:last-child),.no-flexgap .mm-all>:only-child{margin-right:.45em}
.mm-foot{margin-top:auto;display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;padding-top:1.4rem}
.no-flexgap .mm-foot>*{margin-right:1rem;margin-bottom:1rem}
.mm-langs{display:grid;grid-template-columns:repeat(auto-fill,minmax(8.25rem,1fr));gap:.4rem;flex:1 1 100%}
.mm-langs a,.mm-langs span{display:flex;align-items:center;min-height:44px;padding:.35rem .8rem;border-radius:10px;border:1px solid #d3dcda;border:1px solid var(--line);color:#33415a;color:var(--ink-2);font-weight:600;font-size:.95rem;line-height:1.2;text-decoration:none}
.mm-langs span{background:#13213a;background:var(--ink);border-color:#13213a;border-color:var(--ink);color:#f2f5f4;color:var(--bg)}
@supports (interpolate-size:allow-keywords){@media (prefers-reduced-motion:no-preference){.mm-cat{interpolate-size:allow-keywords}.mm-cat::details-content{height:0;overflow:hidden;overflow:clip;transition:height .3s cubic-bezier(.2,.8,.2,1), content-visibility .3s allow-discrete}.mm-cat[open]::details-content{height:auto}}}

/* ================================================================ v3: hero */
.hero3{padding:2rem 0 3.5rem;padding:max(2rem,min(4.5vw,3.8rem)) 0 max(3.5rem,min(7vw,6.5rem))}
.hero-bg{position:absolute;top:-10%;right:-5%;bottom:auto;left:-5%;height:115%;pointer-events:none;background:radial-gradient(38% 48% at 78% 42%,rgba(var(--teal-rgb),0.2),transparent 70%),radial-gradient(32% 40% at 12% 0%,rgba(79,111,224,0.11),transparent 70%);background:radial-gradient(38% 48% at 78% 42%,color-mix(in srgb,var(--teal) 20%,transparent),transparent 70%),radial-gradient(32% 40% at 12% 0%,color-mix(in srgb,#4f6fe0 11%,transparent),transparent 70%)}
.hero3 .hero-grid{grid-template-columns:minmax(0,5.4fr) minmax(0,6.6fr);align-items:center;row-gap:1.4rem;row-gap:max(1.4rem,min(3vw,2.4rem))}
.hero3 .eyebrow,.hero3 h1{grid-column:1/-1}
.hero3 .eyebrow{margin:0 0 -.6rem}
.hero3 .hero-copy{grid-column:1;align-self:start;padding-top:.3rem}
.hero3 .hero-vis{grid-column:2}
.hero3 .facts{margin:1.3rem 0 1.7rem}
.hero3 h1{font-size:2.5rem;font-size:max(2.5rem,min(.9rem + 4.1vw,4.9rem));line-height:.98;max-width:15.5em}
.hero3[lang=fr] h1,.hero3[lang=it] h1,.hero3[lang=es] h1{font-size:2.3rem;font-size:max(2.3rem,min(.9rem + 3.7vw,4.5rem));max-width:16.5em}
.hero3[lang=de] h1{font-size:2.2rem;font-size:max(2.2rem,min(.9rem + 3.6vw,4.4rem));max-width:16.5em}
.hero3 .hw{background:linear-gradient(180deg,#13213a 55%,#13213a);background:linear-gradient(180deg,var(--ink) 55%,var(--ink));background:linear-gradient(180deg,var(--ink) 55%,color-mix(in srgb,var(--ink) 72%,var(--teal)));-webkit-background-clip:text;background-clip:text;padding-bottom:.06em}
@supports ((-webkit-background-clip: text) or (background-clip: text)){
.hero3 .hw{color:transparent}}
.eyebrow{display:flex;flex-wrap:wrap;align-items:center;gap:.2rem 0;font:700 .78rem/1 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:700 .78rem/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:#0b524c;color:var(--teal-2)}
.no-flexgap .eyebrow>*{margin-bottom:.2rem}
.eyebrow span+span::before{content:"";display:inline-block;width:4px;height:4px;margin:0 .8em;border-radius:50%;background:#b7c4c1;background:var(--line-2);vertical-align:middle}
.btn-lg{min-height:52px;padding:.8em 1.4em;font-size:1.02rem}
.hero-vis{position:relative;margin:0}
.hero-vis figcaption{display:flex;justify-content:flex-end;margin-top:.9rem}
@media (max-width:1100px){
  .hero3 .hero-grid{grid-template-columns:1fr}
  .hero3 .hero-copy,.hero3 .hero-vis{grid-column:1}
  .hero3 .hero-vis{margin-top:1rem}
}

/* hero composition: an old window, the web app and the phone app */
.hs{position:relative;aspect-ratio:10/8.4;--px:0;--py:0}
@supports not (aspect-ratio:1/1){
.hs::before{content:"";display:block;padding-top:84%}}
.hs-l{position:absolute;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.hs-l1{left:0;top:2%;width:50%;z-index:1;transform:translate3d(calc(var(--px)*-10px),calc(var(--py)*-8px),0) rotate(-2.5deg)}
.hs-l2{right:0;top:13%;width:88%;z-index:2;transform:translate3d(calc(var(--px)*6px),calc(var(--py)*5px),0)}
.hs-l3{right:3%;bottom:0;width:25%;z-index:3;transform:translate3d(calc(var(--px)*16px),calc(var(--py)*12px),0) rotate(2deg)}
.hs-old{font-size:7px;font-size:max(7px,min(.7vw,11px));box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #dfdfdf,inset -2px -2px #808080,inset 2px 2px #fff,0 18px 40px -18px rgba(19,33,58,.5)}
.hs-old-b{display:grid;grid-template-columns:-webkit-max-content minmax(0,1fr);grid-template-columns:max-content minmax(0,1fr);gap:.45em .6em;align-items:center;padding:.8em .7em .5em}
.hs-old-g{display:grid;gap:2px;margin:.2em .7em .8em;padding:2px;background:#fff;box-shadow:inset 1px 1px #808080,inset -1px -1px #fff,inset 2px 2px #0a0a0a}
.hs-old-g i{height:1.25em;background:repeating-linear-gradient(90deg,#c0c0c0 0 1px,transparent 1px 33%)}
.hs-old-g i:first-child{background:#c0c0c0;box-shadow:inset -1px -1px #808080,inset 1px 1px #fff}
.hs-old-g i:nth-child(3){background-color:#000080}
.hs .mk-dash>.bw{font-size:7px;font-size:max(7px,min(calc(1.75 * var(--cqi, 6px)),12px));font-size:max(7px,min(1.75cqi,12px))}
.hs .mk-dash{box-shadow:0 2px 4px rgba(19,33,58,.06),0 40px 80px -30px rgba(19,33,58,.55),0 0 0 1px rgba(19,33,58,.1)}
.hs .mk-phone{padding:0;background:none;aspect-ratio:auto}
.hs .mk-phone .ph{box-shadow:0 30px 60px -20px rgba(19,33,58,.6)}
@media (prefers-reduced-motion:no-preference){
  .hs-l1{animation:fl1 9s ease-in-out infinite alternate}
  .hs-l3{animation:fl3 7s ease-in-out infinite alternate}
  .hero3 .hero-vis{animation:fadeup 1s .25s cubic-bezier(.2,.8,.2,1) backwards}
}
@keyframes fl1{to{translate:0 -10px}}
@keyframes fl3{to{translate:0 -14px}}

/* ================================================================ v3: mock-ups (fictional, built in HTML/CSS) */
.mock{container:ba/inline-size;position:relative}
.mk-dash>.bw,.mk-portal>.bw,.mk-vpframe>.bw{font-size:7px;font-size:max(7px,min(calc(1.42 * var(--cqi, 6px)),12.5px));font-size:max(7px,min(1.42cqi,12.5px))}
.mk-dash,.mk-portal,.mk-vpframe{aspect-ratio:16/10;border-radius:16px;overflow:hidden;isolation:isolate;background:linear-gradient(160deg,#e8f0ee,#d2e1de);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32),0 0 0 1px rgba(19,33,58,.1);box-shadow:var(--shadow),0 0 0 1px rgba(19,33,58,.1)}
@supports not (aspect-ratio:1/1){
.mk-dash::before,.mk-portal::before,.mk-vpframe::before{content:"";display:block;padding-top:62.5%}}
.mk-dash,.mk-portal{container:ba/inline-size}
.mk-dash .bw,.mk-portal .bw,.mk-vpframe .bw{top:1.7em;left:1.7em;right:1.7em}
@media (prefers-color-scheme:dark){.mk-dash,.mk-portal,.mk-vpframe,.mk-phone,.bgsoft{background:linear-gradient(160deg,#1d3b3d,#13262c)}}
.mock button:not(.btn){font:inherit;color:inherit}
.mock button:focus-visible{outline:2px solid #0a246a;outline-offset:2px;border-radius:6px}
.no-fv .mock button:focus{outline:2px solid #0a246a;outline-offset:2px;border-radius:6px}
@media (prefers-color-scheme:dark){.mk-flow button:focus-visible{outline-color:#0a246a;outline-color:var(--focus)}.mk-auto button:focus-visible{outline-color:#0a246a;outline-color:var(--focus)}.mk-mig button:focus-visible{outline-color:#0a246a;outline-color:var(--focus)}.mk-ent button:focus-visible{outline-color:#0a246a;outline-color:var(--focus)}.mk-audit button:focus-visible{outline-color:#0a246a;outline-color:var(--focus)}.mk-vp button:focus-visible{outline-color:#0a246a;outline-color:var(--focus)}.no-fv .mk-flow button:focus,.no-fv .mk-auto button:focus,.no-fv .mk-mig button:focus,.no-fv .mk-ent button:focus,.no-fv .mk-audit button:focus,.no-fv .mk-vp button:focus{outline-color:#0a246a;outline-color:var(--focus)}}
.mk-tabs{display:flex;gap:.2em;border-bottom:1px solid #e4e7ec;flex:none}
.no-flexgap .mk-tabs>:not(:last-child),.no-flexgap .mk-tabs>:only-child{margin-right:.2em}
.mk-tabs button,.mk-tabs span{display:inline-flex;align-items:center;min-height:2.3em;padding:0 .8em;margin-bottom:-1px;border:0;border-bottom:2px solid transparent;background:none;color:#5d6779;font-size:.92em;cursor:pointer;white-space:nowrap}
.mk-tabs button:hover{color:#172033}
.mk-tabs [aria-selected=true],.mk-tabs .on{color:#0b524c;border-bottom-color:#0f6f66;font-weight:600}
.mk-panel{display:none;min-height:0;flex-direction:column;gap:.8em}
.mk-panel.on{display:flex}
@media (prefers-reduced-motion:no-preference){.mk-panel.on,.mk-screen.on{animation:mkIn .35s cubic-bezier(.2,.8,.2,1)}}
@keyframes mkIn{from{opacity:0;transform:translateY(4px)}}
.mk-dash .ap-main{gap:.75em}
.mk-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:.8em;min-height:0}
.mk-bars{display:flex;align-items:flex-end;gap:.55em;height:10.5em;padding:.9em 1em .6em}
.no-flexgap .mk-bars>:not(:last-child),.no-flexgap .mk-bars>:only-child{margin-right:.55em}
.mk-bar{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:.35em;height:100%;min-width:0}
.no-flexgap .mk-bar>*+*{margin-top:.35em}
.mk-bar i{display:block;width:100%;max-width:2.2em;border-radius:.35em .35em .1em .1em;background:linear-gradient(#5cc3b6,#0f6f66);transform-origin:bottom}
.mk-bar:last-child i{background:linear-gradient(#7fd8cc,#0b8a7e);box-shadow:0 0 0 2px rgba(15,111,102,.18)}
.mk-bar .h5{height:50%}.mk-bar .h6{height:60%}.mk-bar .h7{height:70%}.mk-bar .h8{height:80%}.mk-bar .h9{height:90%}
.mk-bar small{font-size:.72em;color:#5d6779;white-space:nowrap}
@media (prefers-reduced-motion:no-preference){.mk-panel.on .mk-bar i{animation:grow .8s cubic-bezier(.2,.8,.2,1) backwards}.mk-panel.on .mk-bar:nth-child(2) i{animation-delay:.04s}.mk-panel.on .mk-bar:nth-child(3) i{animation-delay:.08s}.mk-panel.on .mk-bar:nth-child(4) i{animation-delay:.12s}.mk-panel.on .mk-bar:nth-child(5) i{animation-delay:.16s}.mk-panel.on .mk-bar:nth-child(6) i{animation-delay:.2s}.mk-panel.on .mk-bar:nth-child(7) i{animation-delay:.24s}.mk-panel.on .mk-bar:nth-child(8) i{animation-delay:.28s}}
@keyframes grow{from{transform:scaleY(.08)}}
.pill.green{background:#e7f4ec;color:#14532d}
.pill.blue{background:#e9effc;color:#2950a8}
.pill .ic{width:1em;height:1em;margin-right:.3em}
.mk-compact .ap{grid-template-columns:11.5em minmax(0,1fr)}
@container ba (max-width:600px){
  .mk-row{grid-template-columns:1fr}
  .mk-recent{display:none}
  .mk-bars{height:8em}
  .mk-compact .ap{grid-template-columns:minmax(0,1fr)}
}
@supports not (container-type:inline-size){
  .cq-ba-600 .mk-row{grid-template-columns:1fr}
  .cq-ba-600 .mk-recent{display:none}
  .cq-ba-600 .mk-bars{height:8em}
  .cq-ba-600 .mk-compact .ap{grid-template-columns:minmax(0,1fr)}}
/* portal */
.pt{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;background:#f4f6f8;color:#172033}
.pt-bar{flex:none;display:flex;align-items:center;gap:.6em;padding:.7em 1.3em;background:#fff;border-bottom:1px solid #e4e7ec;font-weight:600;white-space:nowrap}
.no-flexgap .pt-bar>:not(:last-child),.no-flexgap .pt-bar>:only-child{margin-right:.6em}
.pt-user{margin-left:auto;display:grid;place-items:center;width:2em;height:2em;border-radius:50%;background:#e2f0ed;color:#0b524c}
.pt-body{position:relative;flex:1;min-height:0;padding:1.2em 1.5em;overflow:hidden}
.mk-screen{display:none}
.mk-screen.on{display:flex;flex-direction:column;gap:.85em}
.no-flexgap .mk-screen.on>*+*{margin-top:.85em}
.pt-head{display:flex;align-items:center;gap:.7em}
.no-flexgap .pt-head>:not(:last-child),.no-flexgap .pt-head>:only-child{margin-right:.7em}
.mk-link{display:inline-flex;align-items:center;min-height:2em;padding:0 .6em;border:0;border-radius:.45em;background:#e2f0ed;color:#0b524c;font-weight:600;font-size:.88em;cursor:pointer;white-space:nowrap}
.mk-link:hover{background:#cfe8e3}
.mk-back{align-self:flex-start;display:inline-flex;align-items:center;gap:.3em;min-height:2em;padding:0 .5em 0 .2em;border:0;border-radius:.45em;background:none;color:#5d6779;font-size:.88em;cursor:pointer}
.no-flexgap .mk-back>:not(:last-child),.no-flexgap .mk-back>:only-child{margin-right:.3em}
.mk-back:hover{color:#172033;background:#e8ecef}
.mk-back .ic,.mk-link .ic{width:1.1em;height:1.1em}
.pt-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5em}
.pt-steps li{display:flex;flex-direction:column;gap:.45em;font-size:.82em;color:#8b94a5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.no-flexgap .pt-steps li>*+*{margin-top:.45em}
.pt-steps li span{height:.38em;border-radius:999px;background:#e4e7ec}
.pt-steps li.done{color:#0b524c;font-weight:600}
.pt-steps li.done span{background:#0f6f66}
.pt-steps li.now span{background:linear-gradient(90deg,#0f6f66 55%,#bfe3dd 55%)}
.pt-acts{display:flex;flex-wrap:wrap;gap:.5em}
.no-flexgap .pt-acts>*{margin-right:.5em;margin-bottom:.5em}
.mk-portal .ap-card td:first-child,.mk-dash .ap-card td:first-child{max-width:none;width:auto}
.mk-dash .ap-card td:nth-child(2){max-width:0;width:100%;overflow:hidden;text-overflow:ellipsis}
@container ba (max-width:600px){.mk-portal th:nth-child(2),.mk-portal td:nth-child(2){display:none}.pt-body{padding:1em}}
@supports not (container-type:inline-size){.cq-ba-600 .mk-portal th:nth-child(2),.cq-ba-600 .mk-portal td:nth-child(2){display:none}.cq-ba-600 .pt-body{padding:1em}}
/* phone */
.mk-phone{display:grid;place-items:center;container:ph/inline-size;padding:1rem;padding:max(1rem,min(3vw,2rem));border-radius:16px;background:linear-gradient(160deg,#e8f0ee,#d2e1de)}
.ph{position:relative;display:flex;flex-direction:column;width:100%;max-width:290px;aspect-ratio:9/18.6;border:.55em solid #0d1626;border-radius:2.5em;background:#fff;color:#172033;overflow:hidden;font-size:5px;font-size:max(5px,min(calc(4.3 * var(--cqi, 6px)),12.5px));font-size:max(5px,min(4.3cqi,12.5px));line-height:1.35;box-shadow:0 30px 60px -24px rgba(19,33,58,.45),0 0 0 1px rgba(19,33,58,.25)}
.ph-notch{position:absolute;left:50%;top:.45em;width:32%;height:1.45em;margin-left:-16%;border-radius:999px;background:#0d1626;z-index:2}
.ph-status{flex:none;display:flex;justify-content:space-between;align-items:center;padding:.65em 1.6em .2em;font-size:.82em;font-weight:600}
.ph-sig{display:flex;align-items:flex-end;gap:2px}
.no-flexgap .ph-sig>:not(:last-child),.no-flexgap .ph-sig>:only-child{margin-right:2px}
.ph-sig i{width:3px;background:#172033;border-radius:1px}
.ph-sig i:nth-child(1){height:4px}.ph-sig i:nth-child(2){height:6px}.ph-sig i:nth-child(3){height:8px;opacity:.3}
.ph-body{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;padding:.9em 1.05em .6em;overflow:hidden}
.ph-body .mk-screen.on{flex:1;min-height:0}
.ph-h b{display:block;font-size:1.45em;font-weight:700;letter-spacing:-.01em;line-height:1.15}
.ph-h small{color:#5d6779;font-size:.85em}
.ph-off{margin:.2em 0;padding:.45em .7em;border-radius:.7em;background:#fdf3e1;color:#8a4f05;font-size:.8em;font-weight:500}
.ph-list{display:grid;gap:.45em}
.ph-stop{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:0 .4em;width:100%;padding:.65em .75em;border:1px solid #e4e7ec;border-radius:.85em;background:#fff;text-align:left;cursor:pointer;transition:border-color .2s, transform .2s}
.ph-stop:hover{border-color:#0f6f66}
.ph-stop b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ph-stop small{grid-column:1;color:#5d6779;font-size:.82em}
.ph-stop .ic{grid-column:2;grid-row:1/span 2;color:#8b94a5}
.ph-stop.next{border-color:#0f6f66;box-shadow:inset 3px 0 #0f6f66}
.ph-back{align-self:flex-start;display:inline-flex;align-items:center;gap:.2em;padding:.2em .3em .2em 0;border:0;background:none;color:#5d6779;font-size:.85em;cursor:pointer}
.no-flexgap .ph-back>:not(:last-child),.no-flexgap .ph-back>:only-child{margin-right:.2em}
.ph-checks{list-style:none;margin:.3em 0;padding:0;display:grid;gap:.5em}
.ph-checks li{display:flex;align-items:center;gap:.5em;padding:.55em .7em;border-radius:.7em;background:#f4f6f8;font-size:.9em}
.no-flexgap .ph-checks li>:not(:last-child),.no-flexgap .ph-checks li>:only-child{margin-right:.5em}
.ph-checks .ic{color:#1f7a4d;stroke-width:2.4}
.ph-checks em{margin-left:auto;font-style:normal;color:#5d6779}
.ph-cta{display:block;width:100%;margin-top:auto;padding:.85em;border:0;border-radius:.9em;background:#0f6f66;color:#fff;font-weight:600;text-align:center;cursor:pointer}
.ph-cta:hover{background:#0b524c}
.ph-cta.ghost{background:#e2f0ed;color:#0b524c}
.ph-ok{align-items:center;justify-content:center;text-align:center;gap:.5em}
.ph-ok b{font-size:1.3em}
.ph-ok small{color:#5d6779;max-width:16em}
.ph-ok .ph-cta{margin-top:1em}
.ph-tick{display:grid;place-items:center;width:3.6em;height:3.6em;border-radius:50%;background:#e7f4ec;color:#1f7a4d}
.ph-tick .ic{width:1.8em;height:1.8em;stroke-width:2.4}
@media (prefers-reduced-motion:no-preference){.ph-ok.on .ph-tick{animation:pop .5s cubic-bezier(.3,1.6,.5,1)}}
.ph-tabs{flex:none;display:flex;justify-content:space-around;padding:.6em 0 1em;border-top:1px solid #eef0f3;color:#5d6779;font-size:.76em}
.ph-tabs .on{color:#0f6f66;font-weight:600}
/* website with viewport switch */
.mk-site{display:grid;gap:.8rem}
.mk-vp{justify-self:start;display:inline-flex;gap:.2rem;padding:.25rem;border-radius:11px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line)}
.no-flexgap .mk-vp>:not(:last-child),.no-flexgap .mk-vp>:only-child{margin-right:.2rem}
.mk-vp button{display:inline-flex;align-items:center;min-height:34px;padding:0 .9em;border:0;border-radius:8px;background:none;color:#33415a;color:var(--ink-2);font-size:.88rem;font-weight:600;cursor:pointer;transition:background-color .2s, color .2s}
.mk-vp button:hover{color:#13213a;color:var(--ink)}
.mk-vp [aria-pressed=true]{background:#13213a;background:var(--ink);color:#f2f5f4;color:var(--bg)}
.mk-vpframe{position:relative;container:vpf/inline-size}
.mk-vpframe .bw{transition:left .55s cubic-bezier(.2,.8,.2,1), right .55s cubic-bezier(.2,.8,.2,1);container:ws/inline-size}
.mk-vpframe.vp-t .bw{left:21%;right:21%}
.mk-vpframe.vp-p .bw{left:34.5%;right:34.5%}
.ws{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;overflow:hidden;background:#fff;color:#172033}
.ws-nav{flex:none;display:flex;align-items:center;gap:1.2em;padding:.9em 1.5em;border-bottom:1px solid #eef0f3}
.no-flexgap .ws-nav>:not(:last-child),.no-flexgap .ws-nav>:only-child{margin-right:1.2em}
.ws-nav b{display:flex;align-items:center;gap:.5em;font-weight:700;white-space:nowrap}
.no-flexgap .ws-nav b>:not(:last-child),.no-flexgap .ws-nav b>:only-child{margin-right:.5em}
.ws-nav b i{width:1.3em;height:1.3em;border-radius:.35em;background:linear-gradient(135deg,#0f6f66,#5cc3b6)}
.ws-nav nav{display:flex;gap:1.1em;margin-left:auto;font-size:.9em;color:#5d6779;white-space:nowrap}
.no-flexgap .ws-nav nav>:not(:last-child),.no-flexgap .ws-nav nav>:only-child{margin-right:1.1em}
.ws-burger{display:none;flex:none;width:1.4em;height:.95em;margin-left:auto;background:linear-gradient(#172033 0 2px,transparent 2px calc(50% - 1px),#172033 calc(50% - 1px) calc(50% + 1px),transparent calc(50% + 1px) calc(100% - 2px),#172033 calc(100% - 2px))}
.ws-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:1.6em;align-items:center;padding:1.7em 1.5em 1.4em}
.ws-hero .ws-h{margin:0 0 .45em;color:#172033;font:700 2em/1.08 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 2em/1.08 var(--f-disp);letter-spacing:-.02em}
.ws-hero p{margin:0 0 1em;color:#5d6779;font-size:.95em}
.ws-btn{display:inline-block;padding:.6em 1.05em;border-radius:.55em;background:#0f6f66;color:#fff;font-weight:600;font-size:.9em}
.ws-pic{aspect-ratio:4/3;border-radius:.9em;background:radial-gradient(circle at 50% 46%,#f7fafb 0 13%,#5d7684 13.5% 16%,transparent 16.5%),radial-gradient(circle at 50% 46%,#9db3c0 0 27%,#7d95a3 27.5% 30%,transparent 30.5%),linear-gradient(90deg,transparent 8%,#8aa1ae 8% 92%,transparent 92%) 0 46%/100% 14% no-repeat,linear-gradient(135deg,#e3edf2,#c3d4dd)}
@supports not (aspect-ratio:1/1){
.ws-pic::before{content:"";display:block;padding-top:75%}}
.ws-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85em;padding:0 1.5em 1.3em}
.ws-card{display:flex;flex-direction:column;gap:.25em;padding:.7em;border:1px solid #e4e7ec;border-radius:.75em;font-size:.88em;min-width:0}
.no-flexgap .ws-card>*+*{margin-top:.25em}
.ws-card b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ws-card small{color:#5d6779}
.ws-img{aspect-ratio:16/8;margin-bottom:.35em;border-radius:.5em;background:linear-gradient(135deg,#e8eef2,#cfdbe2)}
@supports not (aspect-ratio:1/1){
.ws-img::before{content:"";display:block;padding-top:50%}}
.ws-img.i1{background:linear-gradient(135deg,#e2efec,#bcd9d3)}
.ws-img.i2{background:linear-gradient(135deg,#ece8f3,#d3cbe2)}
.ws-link{color:#0b524c;font-weight:600;font-size:.92em}
.ws-foot{margin-top:auto;display:flex;justify-content:space-between;padding:.8em 1.5em;background:#f4f6f8;color:#5d6779;font-size:.8em}
@container ws (max-width:600px){.ws-nav nav{display:none}.ws-burger{display:block}.ws-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.ws-card:nth-child(3){display:none}}
@supports not (container-type:inline-size){.cq-ws-600 .ws-nav nav{display:none}.cq-ws-600 .ws-burger{display:block}.cq-ws-600 .ws-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.cq-ws-600 .ws-card:nth-child(3){display:none}}
@container ws (max-width:400px){.ws-hero{grid-template-columns:1fr;padding:1.3em 1.2em}.ws-pic{display:none}.ws-hero .ws-h{font-size:1.6em}.ws-cards{grid-template-columns:1fr;padding:0 1.2em 1em}.ws-card:nth-child(2){display:none}.ws-nav{padding:.9em 1.2em}}
@supports not (container-type:inline-size){.cq-ws-400 .ws-hero{grid-template-columns:1fr;padding:1.3em 1.2em}.cq-ws-400 .ws-pic{display:none}.cq-ws-400 .ws-hero .ws-h{font-size:1.6em}.cq-ws-400 .ws-cards{grid-template-columns:1fr;padding:0 1.2em 1em}.cq-ws-400 .ws-card:nth-child(2){display:none}.cq-ws-400 .ws-nav{padding:.9em 1.2em}}
@media (max-width:600px){.mk-dash,.mk-portal,.mk-vpframe{aspect-ratio:4/5}@supports not (aspect-ratio:1/1){
.mk-dash::before,.mk-portal::before,.mk-vpframe::before{content:"";display:block;padding-top:125%}}.hs .mk-dash{aspect-ratio:16/10}@supports not (aspect-ratio:1/1){
.hs .mk-dash::before{content:"";display:block;padding-top:62.5%}}.mk-vpframe.vp-t .bw{left:10%;right:10%}.mk-vpframe.vp-p .bw{left:24%;right:24%}}
/* before/after screens for fixes and maintenance */
.bgsoft{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(160deg,#e8f0ee,#d2e1de)}
.ba-before .bgsoft{background:linear-gradient(160deg,#efe9e2,#ddd2c6)}
@media (prefers-color-scheme:dark){.ba-before .bgsoft{background:linear-gradient(160deg,#3a3129,#28211b)}}
.fx{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;gap:.85em;padding:1.3em 1.5em;background:#f4f6f8;color:#172033}
.no-flexgap .fx>*+*{margin-top:.85em}
.fx .ap-head>div:first-child{gap:.7em}
.fx-note{display:flex;align-items:center;gap:.55em;padding:.65em .85em;border-radius:.65em;font-size:.92em;font-weight:500}
.no-flexgap .fx-note>:not(:last-child),.no-flexgap .fx-note>:only-child{margin-right:.55em}
.fx-note.bad{background:#fdecea;color:#9b1c13}
.fx-note.ok{background:#e7f4ec;color:#14532d}
.fx-note .ic{width:1.15em;height:1.15em}
.fx-bang{display:grid;place-items:center;flex:none;width:1.3em;height:1.3em;border-radius:50%;background:#b42318;color:#fff;font-weight:700;font-size:.85em}
.fx .ap-card td:first-child{max-width:none;width:auto}
.fx .ap-card td:nth-child(2){width:100%}
.sk td{height:2.45em}
.sk td i{display:block;height:.75em;border-radius:.3em;background:linear-gradient(90deg,#eef0f3 25%,#e0e5ea 50%,#eef0f3 75%);background-size:200% 100%}
.sk td:nth-child(2) i{width:70%}.sk td:nth-child(3) i{width:55%;margin-left:auto}
@media (prefers-reduced-motion:no-preference){.sk td i{animation:sk 1.4s linear infinite}.spin{animation:spin 1s linear infinite}}
@keyframes sk{to{background-position:-200% 0}}
@keyframes spin{to{transform:rotate(360deg)}}
.spin{display:inline-block;width:.85em;height:.85em;margin-right:.4em;border-radius:50%;border:2px solid currentColor;border-right-color:transparent}
.hl{list-style:none;margin:0;padding:0;display:grid;gap:.5em}
.hl li{display:grid;grid-template-columns:auto 11em minmax(0,1fr);align-items:center;gap:.8em;padding:.75em .95em;border-radius:.65em;background:#fff;border:1px solid #e4e7ec}
.hl em{font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hl li.bad em{color:#9b1c13}
.hl li.ok em{color:#14532d;font-weight:500}
@container ba (max-width:600px){.hl li{grid-template-columns:auto minmax(0,1fr);gap:.2em .6em}.hl em{grid-column:2}.fx{padding:1em}}
@supports not (container-type:inline-size){.cq-ba-600 .hl li{grid-template-columns:auto minmax(0,1fr);gap:.2em .6em}.cq-ba-600 .hl em{grid-column:2}.cq-ba-600 .fx{padding:1em}}

/* page-styled mock-ups (follow the site theme) */
.mk-flow,.mk-auto,.mk-mig,.mk-ent,.mk-audit{padding:1.1rem;padding:max(1.1rem,min(2.6vw,1.7rem));border-radius:18px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow)}
.mk-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem 1rem;margin-top:1.1rem}
.no-flexgap .mk-actions>*{margin-right:1rem;margin-bottom:.7rem}
.btn.sm{min-height:42px;padding:.45em 1em;font-size:.93rem}
.btn[disabled]{opacity:.6;cursor:progress;transform:none}
.mk-status{font-size:.92rem;color:#55627a;color:var(--muted)}
.mk-status.ok{color:#1f7a4d;color:var(--ok);font-weight:600}
.fl-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr) minmax(0,1fr);gap:1rem;align-items:center}
.fl-h{display:flex;align-items:center;gap:.45em;margin:0 0 .6rem;font-size:.88rem;font-weight:600;color:#33415a;color:var(--ink-2)}
.no-flexgap .fl-h>:not(:last-child),.no-flexgap .fl-h>:only-child{margin-right:.45em}
.fl-h .ic{color:#0b524c;color:var(--teal-2)}
.fl-card{display:grid;gap:.15rem;padding:.9rem 1rem;border-radius:12px;background:#f2f5f4;background:var(--bg);border:1px solid #d3dcda;border:1px solid var(--line)}
.fl-card small{color:#55627a;color:var(--muted);font-size:.82rem}
.fl-card b{font:700 1.2rem/1.2 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.2rem/1.2 var(--f-disp)}
.fl-card span{color:#33415a;color:var(--ink-2);font-size:.9rem}
.fl-mid{position:relative;display:grid;place-items:center;min-height:9rem}
.fl-line{position:absolute;left:-.5rem;right:-.5rem;top:50%;height:2px;background:repeating-linear-gradient(90deg,#b7c4c1 0 6px,transparent 6px 12px);background:repeating-linear-gradient(90deg,var(--line-2) 0 6px,transparent 6px 12px)}
.fl-dot{position:absolute;left:-.5rem;top:50%;width:12px;height:12px;margin-top:-6px;border-radius:50%;background:#0f6f66;background:var(--teal);box-shadow:0 0 0 5px rgba(var(--teal-rgb),0.22);box-shadow:0 0 0 5px color-mix(in srgb,var(--teal) 22%,transparent);opacity:0}
.fl-mid pre{position:relative;margin:0;padding:.65rem .8rem;border-radius:10px;background:#13213a;background:var(--dark);color:#cfe9e5;font:500 .74rem/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;box-shadow:0 10px 24px -14px rgba(0,0,0,.5)}
.mk-flow.run .fl-dot{animation:travel 1.1s cubic-bezier(.5,0,.3,1)}
@keyframes travel{0%{left:-.5rem;opacity:1}90%{opacity:1}100%{left:calc(100% + .5rem - 12px);opacity:0}}
.fl-list{display:grid;gap:.4rem}
.fl-row{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.55rem .8rem;border-radius:10px;border:1px solid #d3dcda;border:1px solid var(--line);background:#f2f5f4;background:var(--bg);font-size:.88rem}
.no-flexgap .fl-row>:not(:last-child),.no-flexgap .fl-row>:only-child{margin-right:.6rem}
.fl-row small{color:#55627a;color:var(--muted);text-align:right}
.fl-row.new{display:none}
.fl-row.new.done{display:flex;border-color:#0f6f66;border-color:var(--teal);background:#d6ebe7;background:var(--teal-soft)}
@media (prefers-reduced-motion:no-preference){.fl-row.new.done{animation:mkIn .4s cubic-bezier(.2,.8,.2,1)}}
.fl-log{display:grid;gap:.3rem;margin-top:1rem}
.fl-log code{display:block;font:500 .78rem/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#1f7a4d;color:var(--ok);overflow-wrap:anywhere;opacity:.001;transform:translateY(4px);transition:opacity .3s, transform .3s}
.fl-log code.done{opacity:1;transform:none}
@media (max-width:760px){.fl-grid{grid-template-columns:1fr}.fl-mid{min-height:0}.fl-line,.fl-dot{display:none}.fl-mid pre{width:100%}}
.au-head b{display:block;font:700 1.12rem/1.3 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.12rem/1.3 var(--f-disp)}
.au-head small{color:#55627a;color:var(--muted)}
.au-steps{list-style:none;margin:1rem 0 0;padding:0;display:grid;gap:.45rem}
.au-steps li{display:grid;grid-template-columns:1.8rem minmax(0,1fr) auto;align-items:center;gap:.75rem;padding:.6rem .8rem;border-radius:11px;background:#f2f5f4;background:var(--bg);border:1px solid #d3dcda;border:1px solid var(--line);transition:border-color .3s, background-color .3s}
.au-n{display:grid;place-items:center;width:1.75rem;height:1.75rem;border-radius:50%;border:1.5px solid #b7c4c1;border:1.5px solid var(--line-2);font-size:.8rem;font-weight:700;color:#33415a;color:var(--ink-2);transition:background-color .3s, border-color .3s, color .3s}
.au-ok{display:grid;color:#1f7a4d;color:var(--ok);opacity:0;transform:scale(.5);transition:opacity .3s, transform .4s cubic-bezier(.3,1.6,.5,1)}
.au-ok .ic{stroke-width:2.4}
.au-steps li.cur{border-color:#0f6f66;border-color:var(--teal)}
.au-steps li.done{border-color:#d3dcda;border-color:var(--line);border-color:color-mix(in srgb,var(--ok) 40%,var(--line))}
.au-steps li.done .au-n{background:#1f7a4d;background:var(--ok);border-color:#1f7a4d;border-color:var(--ok);color:#fff;color:var(--surface)}
.au-steps li.done .au-ok{opacity:1;transform:none}
.mig-h{margin:0 0 .8rem;font-weight:700}
.mk-mig table{width:100%;border-collapse:collapse;font-size:.92rem;font-variant-numeric:tabular-nums}
.mk-mig th{padding:.5rem .6rem;border-bottom:1px solid #b7c4c1;border-bottom:1px solid var(--line-2);color:#55627a;color:var(--muted);font-size:.8rem;font-weight:500;text-align:left}
.mk-mig td{padding:.6rem;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line);transition:background-color .3s}
.mk-mig .r{text-align:right}
.mk-mig tr .tick{opacity:0;transform:scale(0);transition:opacity .2s, transform .4s cubic-bezier(.3,1.6,.5,1)}
.mk-mig tr.done .tick{opacity:1;transform:none}
.mk-mig tr.cur td{background:rgba(var(--teal-rgb),0.1);background:color-mix(in srgb,var(--teal) 10%,transparent)}
@media (max-width:480px){.mk-mig thead{display:none}.mk-mig tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:center;column-gap:.6rem;padding:.55rem .2rem;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line)}.mk-mig td{padding:0;border:0;font-size:.86rem}.mk-mig td:first-child{grid-column:1/-1;font-weight:600;margin-bottom:.2rem}.mk-mig td.r{text-align:left}.mk-mig td:nth-child(2)::before{content:"Access ";color:#55627a;color:var(--muted);font-size:.78rem}.mk-mig td:nth-child(3)::before{content:"SQL Server ";color:#55627a;color:var(--muted);font-size:.78rem}.mk-mig tr.cur{background:rgba(var(--teal-rgb),0.1);background:color-mix(in srgb,var(--teal) 10%,transparent)}.mk-mig tr.cur td{background:none}}
.en-map{position:relative;aspect-ratio:400/260;max-width:34rem;margin-left:auto;margin-right:auto}
@supports not (aspect-ratio:1/1){
.en-map::before{content:"";display:block;padding-top:65%}}
.en-lines{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible}
.en-lines path{fill:none;stroke:#b7c4c1;stroke:var(--line-2);stroke-width:2;stroke-dasharray:5 6;vector-effect:non-scaling-stroke;transition:stroke .3s}
.mk-ent[data-active="0"] .l0,.mk-ent[data-active="1"] .l1,.mk-ent[data-active="2"] .l2,.mk-ent[data-active="3"] .l3,.mk-ent:not([data-active]) .l0{stroke:#0f6f66;stroke:var(--teal);stroke-width:2.5}
@media (prefers-reduced-motion:no-preference){.mk-ent[data-active="0"] .l0,.mk-ent[data-active="1"] .l1,.mk-ent[data-active="2"] .l2,.mk-ent[data-active="3"] .l3{animation:dash .8s linear infinite}}
.en-app{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:.5em;padding:.7em 1em;border-radius:12px;background:#13213a;background:var(--dark);color:#fff;font-weight:600;font-size:.9rem;white-space:nowrap;box-shadow:0 12px 30px -14px rgba(0,0,0,.5)}
.no-flexgap .en-app>:not(:last-child),.no-flexgap .en-app>:only-child{margin-right:.5em}
.en-app .ic{color:#5cc3b6}
.en-nodes{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}
.en-node{pointer-events:auto;position:absolute;transform:translate(-50%,-50%);display:inline-flex;align-items:center;min-height:36px;padding:0 .9em;border-radius:10px;border:1.5px solid #b7c4c1;border:1.5px solid var(--line-2);background:#fff;background:var(--surface);color:#13213a;color:var(--ink);font-size:.88rem;font-weight:600;white-space:nowrap;cursor:pointer;transition:background-color .2s, border-color .2s, color .2s, transform .25s cubic-bezier(.2,.8,.2,1)}
.en-node:hover{border-color:#0f6f66;border-color:var(--teal)}
.en-node[aria-pressed=true]{background:#0f6f66;background:var(--teal);border-color:#0f6f66;border-color:var(--teal);color:#fff;color:var(--on-teal)}
.n0{left:21%;top:17%}.n1{left:79%;top:17%}.n2{left:21%;top:83%}.n3{left:79%;top:83%}
.en-infos{margin-top:1rem;min-height:4.6em}
.en-info{display:none;margin:0;color:#33415a;color:var(--ink-2)}
.en-info.on{display:block}
.en-info b{display:block;color:#13213a;color:var(--ink);margin-bottom:.15rem}
@media (max-width:480px){.en-node{font-size:.8rem;padding:0 .6em}.en-app{font-size:.82rem;padding:.55em .75em}}
.ad-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.4rem 1rem}
.no-flexgap .ad-head>*{margin-right:1rem;margin-bottom:.4rem}
.ad-head b{font:700 1.08rem/1.3 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.08rem/1.3 var(--f-disp)}
.ad-head small{color:#55627a;color:var(--muted)}
.ad-chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:.9rem 0}
.no-flexgap .ad-chips>*{margin-right:.4rem;margin-bottom:.4rem}
.ad-chips button{display:inline-flex;align-items:center;min-height:36px;padding:0 .95em;border-radius:999px;border:1.5px solid #b7c4c1;border:1.5px solid var(--line-2);background:none;color:#33415a;color:var(--ink-2);font-size:.88rem;font-weight:600;cursor:pointer;transition:background-color .2s, border-color .2s, color .2s}
.ad-chips button:hover{border-color:#33415a;border-color:var(--ink-2)}
.ad-chips [aria-pressed=true]{background:#13213a;background:var(--ink);border-color:#13213a;border-color:var(--ink);color:#f2f5f4;color:var(--bg)}
.ad-list{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}
.ad-list li{display:grid;grid-template-columns:5.2rem minmax(0,1fr) auto;align-items:center;gap:.8rem;padding:.65rem .8rem;border-radius:11px;border:1px solid #d3dcda;border:1px solid var(--line);background:#f2f5f4;background:var(--bg)}
@media (prefers-reduced-motion:no-preference){.ad-list li{animation:mkIn .3s cubic-bezier(.2,.8,.2,1)}}
.ad-list b{font-weight:600;font-size:.94rem}
.ad-list small{color:#55627a;color:var(--muted);font-size:.82rem;white-space:nowrap}
.au-sev{justify-self:start;padding:.2em .6em;border-radius:6px;font-size:.74rem;font-weight:700}
.au-sev.hi{background:#fdecea;color:#9b1c13}
.au-sev.md{background:#fdf3e1;color:#7a4504}
.au-sev.lo{background:#e7edeb;background:var(--bg-2);color:#33415a;color:var(--ink-2)}
@media (prefers-color-scheme:dark){.au-sev.hi{background:#4a1f1b;color:#ffb8b0}.au-sev.md{background:#41300f;color:#f5cd84}}
@media (max-width:560px){.ad-list li{grid-template-columns:minmax(0,1fr);gap:.3rem}.ad-list small{white-space:normal}}

/* ================================================================ v3: home sections */
.sh-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1rem 2rem;max-width:none}
.no-flexgap .sh-row>*{margin-right:2rem;margin-bottom:1rem}
.sh-row>div{max-width:46rem}
.sv-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px}
.sv-card{--mx:50%;--my:0%;position:relative;isolation:isolate;overflow:hidden;padding:1.3rem;padding:max(1.3rem,min(2.5vw,2.1rem));border-radius:22px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line);transition:border-color .3s, box-shadow .4s}
.sv-card::before{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;z-index:-1;border-radius:inherit;background:radial-gradient(420px circle at var(--mx) var(--my),rgba(var(--teal-rgb),0.1),transparent 65%);background:radial-gradient(420px circle at var(--mx) var(--my),color-mix(in srgb,var(--teal) 10%,transparent),transparent 65%);opacity:0;transition:opacity .4s}
.sv-card:hover{border-color:#b7c4c1;border-color:var(--line-2);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow)}
.sv-card:hover::before{opacity:1}
.sv-build,.sv-improve,.sv-connect,.sv-advise{grid-column:span 6}
.sv-k{margin:0 0 .55rem;font:700 .76rem/1 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:700 .76rem/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:#0b524c;color:var(--teal-2)}
.sv-card h3{margin:0 0 1.3rem;max-width:20ch;font:740 1.4rem/1.12 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:740 max(1.4rem,min(1.05rem + 1vw,1.95rem))/1.12 var(--f-disp);letter-spacing:-.02em}
.sv-list{list-style:none;margin:0;padding:0;display:grid;gap:.35rem}
.sv-l{display:grid;grid-template-columns:2.5rem minmax(0,1fr) auto;align-items:center;gap:.85rem;height:100%;padding:.7rem .75rem;border-radius:13px;border:1px solid transparent;color:#13213a;color:var(--ink);text-decoration:none;transition:background-color .2s, border-color .2s}
.sv-l:hover{background:#f2f5f4;background:var(--bg);border-color:#d3dcda;border-color:var(--line)}
.sv-ic{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:11px;background:#e7edeb;background:var(--bg-2);color:#0b524c;color:var(--teal-2);transition:background-color .25s, color .25s, transform .35s cubic-bezier(.2,.8,.2,1)}
.sv-l:hover .sv-ic{background:#0f6f66;background:var(--teal);color:#fff;color:var(--on-teal);transform:rotate(-4deg) scale(1.04)}
.sv-t b{display:block;font-weight:600;line-height:1.3}
.sv-t small{display:block;margin-top:.1rem;color:#55627a;color:var(--muted);font-size:.86rem;line-height:1.4}
.sv-go{color:#0f6f66;color:var(--teal);opacity:0;transform:translateX(-5px);transition:opacity .25s, transform .3s cubic-bezier(.2,.8,.2,1)}
.sv-l:hover .sv-go{opacity:1;transform:none}
.sv-l:focus-visible .sv-go{opacity:1;transform:none}
.no-fv .sv-l:focus .sv-go{opacity:1;transform:none}
.sv-improve{background:#13213a;background:var(--dark);border-color:#13213a;border-color:var(--dark);color:#eef3f5;color:var(--on-dark)}
.sv-improve::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-2;background-image:conic-gradient(rgba(255,255,255,.07) 25%,transparent 0 50%,rgba(255,255,255,.07) 0 75%,transparent 0);background-size:10px 10px;-webkit-mask-image:linear-gradient(115deg,transparent 40%,#000);mask-image:linear-gradient(115deg,transparent 40%,#000)}
.sv-improve::before{background:radial-gradient(420px circle at var(--mx) var(--my),rgba(92,195,182,.17),transparent 65%)}
.sv-improve .sv-k{color:#5cc3b6}
.sv-improve h3,.sv-improve .sv-t b{color:#fff}
.sv-improve .sv-t small{color:#b9c6d6;color:var(--on-dark-2)}
.sv-improve .sv-l{color:#fff}
.sv-improve .sv-l:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12)}
.sv-improve .sv-ic{background:rgba(255,255,255,.08);color:#5cc3b6}
.sv-improve .sv-l:hover .sv-ic{background:#5cc3b6;color:#062420}
.sv-improve .sv-go{color:#5cc3b6}
.sv-improve :focus-visible{outline-color:#a7c4ff}
.no-fv .sv-improve :focus{outline-color:#a7c4ff}
.sv-tech{margin-top:1.1rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.14)}
.sv-tech span{font-size:.82rem;color:#b9c6d6;color:var(--on-dark-2)}
.sv-tech ul{list-style:none;margin:.55rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.no-flexgap .sv-tech ul>*{margin-right:.4rem;margin-bottom:.4rem}
.sv-tech a{display:inline-flex;align-items:center;min-height:36px;padding:0 .8em;border-radius:9px;border:1px solid rgba(255,255,255,.24);color:#fff;font-size:.9rem;font-weight:600;text-decoration:none;transition:border-color .2s, background-color .2s}
.sv-tech a:hover{border-color:#5cc3b6;background:rgba(92,195,182,.1)}
.sv-advise .stack{margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid #d3dcda;border-top:1px solid var(--line)}
.stack-h{margin:0 0 .75rem;font-size:.9rem;font-weight:600;color:#55627a;color:var(--muted)}
@media (max-width:1060px){.sv-build,.sv-improve,.sv-connect,.sv-advise{grid-column:span 12}}

/* work showcase */
.gal-h{grid-template-columns:1fr;gap:1.4rem}
.gal-h .gal-tabs{display:flex;flex-wrap:wrap;gap:.3rem;justify-self:start;padding:.35rem;border-radius:15px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line)}
.no-flexgap .gal-h .gal-tabs>*{margin-right:.3rem;margin-bottom:.3rem}
.gal-h .gal-tabs button{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem .95rem;border:0;border-radius:11px;background:transparent;font-size:.95rem;transition:background-color .25s, color .25s}
.no-flexgap .gal-h .gal-tabs button>:not(:last-child),.no-flexgap .gal-h .gal-tabs button>:only-child{margin-right:.5rem}
.gal-h .gal-tabs button:hover{background:#f2f5f4;background:var(--bg)}
.gal-h .gal-tabs button[aria-selected=true]{background:#13213a;background:var(--ink);color:#f2f5f4;color:var(--bg);box-shadow:none}
.gal-h .gal-tabs .tn{grid-row:auto;width:auto;height:auto;background:none;color:#0b524c;color:var(--teal-2);border-radius:0}
.gal-h .gal-tabs [aria-selected=true] .tn{background:none;color:#5cc3b6}
.gal-h .gal-tabs b{font-weight:600}
.gal-h .gal-fig{display:grid;grid-template-columns:minmax(0,8.6fr) minmax(0,3.4fr);gap:1.5rem;gap:max(1.5rem,min(3.5vw,3rem));align-items:end}
.wk-stage{min-width:0}
.wk-mobile .mk-phone{aspect-ratio:16/10}
.wk-mobile .ph{max-width:250px}
.wk-cap p{margin:0 0 1rem;font-size:1.1rem;color:#33415a;color:var(--ink-2)}
.wk-cap .gal-foot{display:grid;gap:.7rem;justify-items:start;margin:0}
@media (max-width:900px){
  .gal-h .gal-tabs{display:flex;flex-wrap:nowrap;justify-self:stretch;overflow-x:auto;margin:0;padding:.35rem;scrollbar-width:none}
  .gal-h .gal-tabs button{flex:none}
  .gal-h .gal-fig{grid-template-columns:1fr}
  .wk-mobile .mk-phone{aspect-ratio:auto}
}
html:not(.js) .gal-h .gal-panel+.gal-panel{margin-top:3rem}

/* pricing cards and payment terms */
.pcs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.pcs-4{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:2rem;margin-top:max(2rem,min(4vw,2.8rem))}
.pc{padding:1.3rem;padding:max(1.3rem,min(2.4vw,1.8rem));border-radius:20px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line)}
.pc>.ic{width:2.5rem;height:2.5rem;padding:.55rem;margin-bottom:1rem;border-radius:11px;background:#d6ebe7;background:var(--teal-soft);color:#0b524c;color:var(--teal-2)}
.pc h3{margin:0 0 .5rem;font:700 1.2rem/1.25 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.2rem/1.25 var(--f-disp);letter-spacing:-.01em}
.pc p{margin:0;color:#33415a;color:var(--ink-2)}
.pc-pay{background:#13213a;background:var(--dark);border-color:#13213a;border-color:var(--dark);color:#eef3f5;color:var(--on-dark)}
.pc-pay h3{color:#fff}
.pc-pay p{color:#b9c6d6;color:var(--on-dark-2)}
.pc-pay>.ic{background:rgba(92,195,182,.16);color:#5cc3b6}
.pc-act{margin-top:1.6rem}
@media (max-width:1060px){.pcs-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:820px){.pcs,.pcs-4{grid-template-columns:1fr}}
.pay{padding:1.15rem 1.3rem;border-radius:16px;background:#d6ebe7;background:var(--teal-soft);border:1px solid rgba(var(--teal-rgb),0.28);border:1px solid color-mix(in srgb,var(--teal) 28%,transparent)}
.pay-k{display:flex;align-items:center;gap:.5em;margin:0 0 .35rem;color:#0b524c;color:var(--teal-2);font-weight:700}
.no-flexgap .pay-k>:not(:last-child),.no-flexgap .pay-k>:only-child{margin-right:.5em}
.pay-v{margin:0;color:#13213a;color:var(--ink)}
.pay-wide{max-width:52rem;margin-top:2rem;margin-top:max(2rem,min(4vw,3rem))}
.lp-price-l{display:grid;gap:12px;align-content:start}

/* service pages */
.kicker{display:inline-flex;align-items:center;gap:.6rem;margin:0 0 1.1rem;font:700 .78rem/1 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:700 .78rem/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:#0b524c;color:var(--teal-2)}
.no-flexgap .kicker>:not(:last-child),.no-flexgap .kicker>:only-child{margin-right:.6rem}
.kicker-ic{display:grid;place-items:center;width:2.1rem;height:2.1rem;border-radius:10px;background:#0f6f66;background:var(--teal);color:#fff;color:var(--on-teal)}
.kicker-ic .ic{width:1.15rem;height:1.15rem}
.svc-page .lp-hero h1{max-width:15em}
.svc-intro{padding-top:1rem;padding-top:max(1rem,min(3vw,2rem))}
.svc-intro-grid{display:grid;grid-template-columns:minmax(0,4.4fr) minmax(0,7.6fr);gap:2rem;gap:max(2rem,min(5vw,4.5rem));align-items:start}
.svc-intro-text{position:sticky;top:calc(64px + 28px);top:calc(var(--head) + 28px)}
.svc-intro-text p{color:#33415a;color:var(--ink-2);font-size:1.08rem}
.svc-intro-text p:first-child{color:#13213a;color:var(--ink);font:500 1.2rem/1.5 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:500 max(1.2rem,min(1.05rem + .45vw,1.42rem))/1.5 var(--f-body)}
.vis-h{margin:0 0 .9rem!important;font:600 .95rem/1.3 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif!important;font:600 .95rem/1.3 var(--f-body)!important;letter-spacing:0!important;color:#55627a;color:var(--muted)}
.vis{margin:0}
@media (max-width:960px){.svc-intro-grid{grid-template-columns:1fr}.svc-intro-text{position:static}}
.dl-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.dl-grid li{grid-column:span 2;padding:1.25rem;padding:max(1.25rem,min(2.3vw,1.6rem));border-radius:18px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line);transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s}
.dl-grid li:nth-child(-n+2){grid-column:span 3}
.dl-grid li:hover{transform:translateY(-2px);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow)}
.dl-n{display:block;margin-bottom:.9rem;font:700 .85rem/1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 .85rem/1 var(--f-disp);color:#0b524c;color:var(--teal-2);font-variant-numeric:tabular-nums}
.dl-grid h3{margin:0 0 .45rem;font:700 1.17rem/1.25 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.17rem/1.25 var(--f-disp);letter-spacing:-.01em}
.dl-grid p{margin:0;color:#33415a;color:var(--ink-2)}
@media (max-width:900px){.dl-grid li,.dl-grid li:nth-child(-n+2){grid-column:span 3}}
@media (max-width:600px){.dl-grid li,.dl-grid li:nth-child(-n+2){grid-column:span 6}}
.ex-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6rem 1.5rem;gap:1.6rem max(1.5rem,min(3.5vw,3rem))}
.ex-list li{padding-top:1.2rem;border-top:2px solid #13213a;border-top:2px solid var(--ink)}
.ex-list h3{margin:0 0 .5rem;font:700 1.15rem/1.3 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.15rem/1.3 var(--f-disp);letter-spacing:-.01em}
.ex-list p{margin:0;color:#33415a;color:var(--ink-2)}
@media (max-width:860px){.ex-list{grid-template-columns:1fr}}
.tech-row{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1.4rem;margin-top:2.2rem;margin-top:max(2.2rem,min(4vw,3rem));padding-top:1.5rem;border-top:1px solid #d3dcda;border-top:1px solid var(--line)}
.no-flexgap .tech-row>*{margin-right:1.4rem;margin-bottom:.8rem}
.tech-row h3{margin:0;font-size:.95rem;font-weight:600;color:#55627a;color:var(--muted)}
.chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.45rem}
.no-flexgap .chips>*{margin-right:.45rem;margin-bottom:.45rem}
.chips li{padding:.35em .8em;border-radius:999px;border:1px solid #d3dcda;border:1px solid var(--line);background:#fff;background:var(--surface);color:#33415a;color:var(--ink-2);font-size:.9rem;font-weight:500}
.rel-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.6rem 1.5rem}
.no-flexgap .rel-head>*{margin-right:1.5rem;margin-bottom:.6rem}
.rel-head .lp-arrow .ic{color:#0b524c;color:var(--teal-2)}
.lp-rel .rel-ic{grid-column:1;display:grid;place-items:center;width:2.3rem;height:2.3rem;margin-bottom:.45rem;border-radius:10px;background:#e7edeb;background:var(--bg-2);color:#0b524c;color:var(--teal-2)}
.lp-rel .rel-ic .ic{width:1.15rem;height:1.15rem}
.lp-rel a>.ic{grid-row:1/-1}
.tech-rel{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:1100px){.tech-rel{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1000px){.tech-rel{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.tech-rel{grid-template-columns:1fr}}

/* services catalogue */
.ct-jump{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.8rem}
.no-flexgap .ct-jump>*{margin-right:.45rem;margin-bottom:.45rem}
.ct-jump a{display:inline-flex;align-items:center;min-height:40px;padding:0 1em;border-radius:999px;border:1px solid #b7c4c1;border:1px solid var(--line-2);background:#fff;background:var(--surface);color:#13213a;color:var(--ink);font-weight:600;font-size:.93rem;text-decoration:none;transition:border-color .2s, background-color .2s}
.ct-jump a:hover{border-color:#0f6f66;border-color:var(--teal);background:#d6ebe7;background:var(--teal-soft)}
.ct-body{padding-top:1rem;padding-top:max(1rem,min(3vw,2rem))}
.ct-sec{display:grid;grid-template-columns:minmax(0,3.6fr) minmax(0,8.4fr);gap:1.5rem 1.5rem;gap:1.5rem max(1.5rem,min(4vw,4rem));padding:2.2rem 0;padding:max(2.2rem,min(4.5vw,3.4rem)) 0;border-top:1px solid #d3dcda;border-top:1px solid var(--line);scroll-margin-top:calc(64px + 8px);scroll-margin-top:calc(var(--head) + 8px)}
.ct-head{position:sticky;top:calc(64px + 28px);top:calc(var(--head) + 28px);align-self:start}
.ct-n{display:block;margin-bottom:.9rem;font:700 .9rem/1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 .9rem/1 var(--f-disp);color:#0b524c;color:var(--teal-2);font-variant-numeric:tabular-nums}
.ct-head h2{font-size:1.9rem;font-size:max(1.9rem,min(1.3rem + 1.8vw,2.7rem));margin-bottom:.35em}
.ct-head p{margin:0;color:#33415a;color:var(--ink-2)}
.ct-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ct-card{--mx:50%;--my:0%;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;gap:.45rem;padding:1.25rem;padding:max(1.25rem,min(2.3vw,1.6rem));border-radius:20px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line);transition:border-color .3s, transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s}
.no-flexgap .ct-card>*+*{margin-top:.45rem}
.ct-card::before{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;z-index:-1;border-radius:inherit;background:radial-gradient(360px circle at var(--mx) var(--my),rgba(var(--teal-rgb),0.11),transparent 65%);background:radial-gradient(360px circle at var(--mx) var(--my),color-mix(in srgb,var(--teal) 11%,transparent),transparent 65%);opacity:0;transition:opacity .4s}
.ct-card:hover{border-color:#b7c4c1;border-color:var(--line-2);transform:translateY(-2px);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow)}
.ct-card:hover::before{opacity:1}
.ct-ic{display:grid;place-items:center;width:2.7rem;height:2.7rem;margin-bottom:.45rem;border-radius:12px;background:#d6ebe7;background:var(--teal-soft);color:#0b524c;color:var(--teal-2)}
.ct-card h3{margin:0;font:700 1.25rem/1.25 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.25rem/1.25 var(--f-disp);letter-spacing:-.012em}
.ct-card h3 a{color:inherit;text-decoration:none}
.ct-card h3 a::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit}
.ct-card h3 a:focus-visible{outline:none}
.no-fv .ct-card h3 a:focus{outline:none}
.ct-card h3 a:focus-visible::after{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:2px}
.no-fv .ct-card h3 a:focus::after{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:2px}
.ct-card p{margin:0;color:#33415a;color:var(--ink-2)}
.ct-card .ct-lead{color:#55627a;color:var(--muted);font-size:.93rem}
.ct-sub{position:relative;z-index:1;list-style:none;margin:.35rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem}
.no-flexgap .ct-sub>*{margin-right:.35rem;margin-bottom:.35rem}
.ct-sub a{display:inline-flex;align-items:center;min-height:32px;padding:0 .65em;border-radius:7px;border:1px solid #d3dcda;border:1px solid var(--line);color:#33415a;color:var(--ink-2);font-size:.85rem;font-weight:500;text-decoration:none}
.ct-sub a:hover{border-color:#0f6f66;border-color:var(--teal);color:#0b524c;color:var(--teal-2)}
.ct-go{display:inline-flex;align-items:center;gap:.4em;margin-top:auto;padding-top:.6rem;color:#0b524c;color:var(--teal-2);font-weight:600;font-size:.92rem}
.no-flexgap .ct-go>:not(:last-child),.no-flexgap .ct-go>:only-child{margin-right:.4em}
.ct-go .ic{transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.ct-card:hover .ct-go .ic{transform:translateX(3px)}
.ct-stack{margin-top:1rem;padding-top:2rem;border-top:1px solid #d3dcda;border-top:1px solid var(--line)}
.ct-stack h2{margin:0 0 1rem;font:600 1rem/1.3 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:600 1rem/1.3 var(--f-body);letter-spacing:0;color:#55627a;color:var(--muted)}
@media (max-width:960px){.ct-sec{grid-template-columns:1fr}.ct-head{position:static}}
@media (max-width:640px){.ct-grid{grid-template-columns:1fr}}

/* pricing page and project brief */
.pr-hero .lead{max-width:44rem}
.pr-hero h1,.ct-hero h1{margin-top:1.6rem;margin-top:max(1.6rem,min(4vw,2.8rem));max-width:15em}
.brief-band{background:#fff;background:var(--surface);border-top:1px solid #d3dcda;border-bottom:1px solid #d3dcda;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.brief-nojs{display:none;padding:1rem 1.2rem;border-radius:12px;background:#ffffe1;background:var(--tip);border:1px solid #d6cf93;border:1px solid var(--tip-line);color:#4a4410;color:var(--tip-ink)}
html:not(.js) .brief-nojs{display:block}
html:not(.js) .brief-grid{display:none}
.brief-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:1.5rem;gap:max(1.5rem,min(4vw,4rem));align-items:start}
.brief-form{display:grid;gap:1.5rem;margin:0;min-width:0}
.brief-form fieldset{margin:0;padding:0;border:0;min-width:0}
.brief-form legend{padding:0;margin-bottom:.65rem;font-weight:600}
.bf-type{padding-bottom:1.5rem!important;border-bottom:1px solid #d3dcda!important;border-bottom:1px solid var(--line)!important}
.opt-t span{gap:.5em}
.opt-t .ic{width:1.1em;height:1.1em;color:#0b524c;color:var(--teal-2)}
.opt-t input:checked+span .ic{color:inherit}
.bf-modern{display:grid;gap:1.5rem}
@media (prefers-reduced-motion:no-preference){.brief-form [data-q]:not([hidden]){animation:mkIn .35s cubic-bezier(.2,.8,.2,1)}}
.bf-desc label{display:block;margin-bottom:.6rem;font-weight:600}
.bf-desc textarea{display:block;width:100%;min-height:7.5rem;padding:.8rem 1rem;border-radius:12px;border:1.5px solid #b7c4c1;border:1.5px solid var(--line-2);background:#f2f5f4;background:var(--bg);color:#13213a;color:var(--ink);font:inherit;line-height:1.5;resize:vertical}
.bf-desc textarea::placeholder{color:#55627a;color:var(--muted)}
.bf-desc textarea:focus-visible{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:2px;border-color:#0f6f66;border-color:var(--teal)}
.no-fv .bf-desc textarea:focus{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:2px;border-color:#0f6f66;border-color:var(--teal)}
.brief-out{position:sticky;top:calc(64px + 24px);top:calc(var(--head) + 24px);padding:1.4rem;padding:max(1.4rem,min(3vw,2rem));border-radius:22px;background:#13213a;background:var(--dark);color:#eef3f5;color:var(--on-dark);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow)}
.bo-k{margin:0 0 .7rem;color:#b9c6d6;color:var(--on-dark-2);font-weight:600}
.bo-list{margin:0 0 1.1rem}
.bo-list div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem;padding:.55rem 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:.93rem}
.bo-list dt{color:#b9c6d6;color:var(--on-dark-2)}
.bo-list dd{margin:0;color:#fff;font-weight:600;text-align:right}
.bo-list div:first-child dd{color:#a7efe5}
.bo-rk{margin:0 0 .25rem;font-weight:500}
.bo-range .est-v{margin-bottom:.8rem}
.brief-out .bo-note{font-size:.93rem;margin-bottom:1.2rem}
.brief-out .btn{--b:#5cc3b6;--b-rgb:92,195,182;width:100%;color:#062420}
.brief-out :focus-visible{outline-color:#a7c4ff}
.no-fv .brief-out :focus{outline-color:#a7c4ff}
.brief-terms{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr);gap:1rem 2rem;align-items:start;margin-top:2rem;margin-top:max(2rem,min(4vw,3rem));padding-top:1.6rem;border-top:1px solid #d3dcda;border-top:1px solid var(--line);color:#33415a;color:var(--ink-2)}
.brief-terms>p{margin:0}
@media (max-width:900px){.brief-grid{grid-template-columns:1fr}.brief-out{position:static}.brief-terms{grid-template-columns:1fr}}
@media (prefers-color-scheme:dark){.hero3 .hw{background:linear-gradient(180deg,#13213a 55%,#13213a);background:linear-gradient(180deg,var(--ink) 55%,var(--ink));background:linear-gradient(180deg,var(--ink) 55%,color-mix(in srgb,var(--ink) 70%,var(--teal)));-webkit-background-clip:text;background-clip:text}}
html:not(.js) .brief-grid{display:none!important}
@media (prefers-color-scheme:dark){.mk-phone{background:linear-gradient(160deg,#1d3b3d,#13262c)}.sv-improve,.pc-pay,.brief-out,.lp-glance{background:#1a2a45;border-color:#26364f}}
/* v4: contact block with form, "How we work" page (terms, payment, sample documents, proof), home trust section */

/* ------------------------------------------------------------ contact */
.contact .c-head{max-width:46rem;margin-bottom:2rem;margin-bottom:max(2rem,min(4vw,3rem))}
.contact .c-lead{font-size:1.1rem;margin:0}
.c-grid{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:1.8rem;gap:max(1.8rem,min(4.5vw,4.5rem));align-items:start}
.c-side{display:grid;gap:1.6rem;min-width:0}
.c-card h3{display:flex;align-items:center;gap:.5em;margin:0 0 .7rem;color:#fff;font:700 1.2rem/1.25 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.2rem/1.25 var(--f-disp);letter-spacing:-.01em}
.no-flexgap .c-card h3>:not(:last-child),.no-flexgap .c-card h3>:only-child{margin-right:.5em}
.c-card h3 .ic{color:#5cc3b6;width:1.25em;height:1.25em}
.c-side .mail-big{font-size:1.15rem;font-size:max(1.15rem,min(1rem + 1.5vw,2rem));margin:.1rem 0 1.2rem}
.contact .c-side .actions{margin-bottom:.4rem}
.c-text{margin:0}
.c-assess{padding:1.2rem;padding:max(1.2rem,min(2.4vw,1.6rem));border-radius:18px;background:rgba(92,195,182,.08);border:1px solid rgba(92,195,182,.28)}
.c-assess>p{margin-bottom:.9rem}
.c-steps{list-style:none;margin:0 0 1.1rem;padding:0;display:grid;gap:.55rem;counter-reset:cs}
.c-steps li{position:relative;padding-left:2.1rem;color:#b9c6d6;color:var(--on-dark-2);counter-increment:cs}
.c-steps li::before{content:counter(cs);position:absolute;left:0;top:.05em;display:grid;place-items:center;width:1.45rem;height:1.45rem;border-radius:50%;border:1.5px solid #5cc3b6;color:#5cc3b6;font:700 .78rem/1 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:700 .78rem/1 var(--f-body)}
.c-acts{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1.4rem}
.no-flexgap .c-acts>*{margin-right:1.4rem;margin-bottom:.8rem}
.contact .c-acts .lp-arrow,.contact .c-wa a{color:#a7efe5}
.c-wa p{margin-bottom:.8rem}
.contact .c-where{margin-top:0}

.cf{position:relative;min-width:0;scroll-margin-top:calc(64px + 16px);scroll-margin-top:calc(var(--head) + 16px);padding:1.4rem;padding:max(1.4rem,min(3vw,2.3rem));border-radius:22px;background:#fff;background:var(--surface);color:#13213a;color:var(--ink);box-shadow:0 30px 60px -30px rgba(0,0,0,.55)}
.cf h3{margin:0 0 1.2rem;font:720 1.35rem/1.15 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:720 max(1.35rem,min(1.1rem + .8vw,1.7rem))/1.15 var(--f-disp);letter-spacing:-.015em;color:#13213a;color:var(--ink)}
.contact .cf p{color:#33415a;color:var(--ink-2)}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
.fld{display:grid;gap:.35rem;margin-bottom:1rem;min-width:0}
.fld label{font-weight:600;font-size:.95rem}
.fld small{font-weight:400;color:#55627a;color:var(--muted)}
.cf input:not([type=checkbox]):not([type=file]),.cf select,.cf textarea{width:100%;min-height:48px;padding:.65em .85em;border:1.5px solid #b7c4c1;border:1.5px solid var(--line-2);border-radius:10px;background:#f2f5f4;background:var(--bg);color:#13213a;color:var(--ink);font:inherit;font-size:1rem;transition:border-color .2s, box-shadow .2s}
.cf textarea{resize:vertical;min-height:9rem;line-height:1.5}
.cf select{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-right:2.4em;background-image:linear-gradient(45deg,transparent 50%,#33415a 50%),linear-gradient(-45deg,transparent 50%,#33415a 50%);background-image:linear-gradient(45deg,transparent 50%,var(--ink-2) 50%),linear-gradient(-45deg,transparent 50%,var(--ink-2) 50%);background-position:calc(100% - 1.15em) 55%,calc(100% - .8em) 55%;background-size:.36em .36em;background-repeat:no-repeat}
.cf input:focus,.cf select:focus,.cf textarea:focus{outline:none;border-color:#0f6f66;border-color:var(--teal);box-shadow:0 0 0 3px rgba(var(--teal-rgb),0.28);box-shadow:0 0 0 3px color-mix(in srgb,var(--teal) 28%,transparent)}
.cf input:focus-visible{outline:2px solid #0a246a;outline:2px solid var(--focus);outline-offset:2px}
.cf select:focus-visible{outline:2px solid #0a246a;outline:2px solid var(--focus);outline-offset:2px}
.cf textarea:focus-visible{outline:2px solid #0a246a;outline:2px solid var(--focus);outline-offset:2px}
.no-fv .cf input:focus,.no-fv .cf select:focus,.no-fv .cf textarea:focus{outline:2px solid #0a246a;outline:2px solid var(--focus);outline-offset:2px}
.cf :user-invalid{border-color:#b42318}
.cf ::placeholder{color:#55627a;color:var(--muted);opacity:1}
.cf input[type=file]{width:100%;padding:.55rem;border:1.5px dashed #b7c4c1;border:1.5px dashed var(--line-2);border-radius:10px;background:#f2f5f4;background:var(--bg);color:#33415a;color:var(--ink-2);font:inherit;font-size:.93rem}
.cf input[type=file]::-webkit-file-upload-button{margin-right:.8rem;padding:.45em .9em;border:0;border-radius:8px;background:#13213a;background:var(--ink);color:#f2f5f4;color:var(--bg);font:600 .9rem/1.2 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:600 .9rem/1.2 var(--f-body);cursor:pointer}
.cf input[type=file]::file-selector-button{margin-right:.8rem;padding:.45em .9em;border:0;border-radius:8px;background:#13213a;background:var(--ink);color:#f2f5f4;color:var(--bg);font:600 .9rem/1.2 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:600 .9rem/1.2 var(--f-body);cursor:pointer}
.cf input[type=file]:focus-visible{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:2px}
.no-fv .cf input[type=file]:focus{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:2px}
.cf-hint{margin:0;font-size:.86rem;color:#55627a!important;color:var(--muted)!important}
.hp{display:none}
.cf-consent{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.7rem;align-items:start;margin:.4rem 0 1.3rem;font-size:.93rem;color:#33415a;color:var(--ink-2)}
.cf-consent input{width:20px;height:20px;margin:.15em 0 0;accent-color:#0f6f66;accent-color:var(--teal)}
.cf-consent a{color:#0b524c;color:var(--teal-2)}
.cf-send{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem 1.2rem}
.no-flexgap .cf-send>*{margin-right:1.2rem;margin-bottom:.7rem}
.contact .cf .btn{--b:var(--teal);--b-rgb:var(--teal-rgb);color:#fff;color:var(--on-teal)}
.cf-note{flex:1 1 16rem;margin:0;font-size:.86rem;color:#55627a!important;color:var(--muted)!important}
.cf-status{margin-top:1rem}
.cf-status:empty{display:none}
.cf-status.info,.cf-status.ok,.cf-status.err{padding:.85rem 1rem;border-radius:12px;font-size:.95rem;line-height:1.5}
.cf-status.info{background:#ffffe1;background:var(--tip);border:1px solid #d6cf93;border:1px solid var(--tip-line);color:#4a4410;color:var(--tip-ink)}
.cf-status.ok{background:#e3f3ea;background:var(--ok-soft);color:#1f7a4d;color:var(--ok);border:1px solid rgba(var(--ok-rgb),0.35);border:1px solid color-mix(in srgb,var(--ok) 35%,transparent)}
.cf-status.err{background:#fdecea;color:#8a1c12;border:1px solid #f1b5ad}
.cf-status .btn{margin-top:.6rem}
.cf.sent .cf-row,.cf.sent .fld,.cf.sent .cf-consent,.cf.sent .cf-send{display:none}
.cf.sent .cf-status{margin-top:0;font-size:1.05rem}
.cf.sent .cf-status b{display:block;font:700 1.25rem/1.3 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.25rem/1.3 var(--f-disp)}
@media (prefers-color-scheme:dark){.cf-status.err{background:#3a1512;color:#ffb4a9;border-color:#6b2a22}.cf :user-invalid{border-color:#ff8a7a}}
@media (max-width:960px){.c-grid{grid-template-columns:1fr}}
@media (max-width:560px){.cf-row{grid-template-columns:1fr}.cf{border-radius:18px}}

/* project brief: two ways to send */
.bo-ctas{display:grid;gap:.6rem}
.brief-out .btn.ghost{--b:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.brief-out .btn.ghost:hover{border-color:#fff}
.brief-out .bo-fn{margin:.8rem 0 0;font-size:.9rem}

/* ------------------------------------------------------------ paper sheets (thumbnails and sample documents): always paper-coloured */
.thumb,.sheet{--ink:#13213a;--ink-rgb:19,33,58;--ink-2:#33415a;--ink-2-rgb:51,65,90;--muted:#55627a;--muted-rgb:85,98,122;--line:#d3dcda;--line-rgb:211,220,218;--line-2:#b7c4c1;--line-2-rgb:183,196,193;--surface:#fff;--surface-rgb:255,255,255;--bg:#f2f5f4;--bg-rgb:242,245,244;--teal:#0f6f66;--teal-rgb:15,111,102;--teal-2:#0b524c;--teal-2-rgb:11,82,76;--teal-soft:#d6ebe7;--teal-soft-rgb:214,235,231;--ok:#1f7a4d;--ok-rgb:31,122,77;--ok-soft:#e3f3ea;--ok-soft-rgb:227,243,234;--tip:#ffffe1;--tip-rgb:255,255,225;--tip-line:#d6cf93;--tip-line-rgb:214,207,147;--tip-ink:#4a4410;--tip-ink-rgb:74,68,16;color:#13213a;color:var(--ink);background:#fff}

.thumbs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;gap:max(.8rem,min(2vw,1.4rem))}
.thumbs a{display:grid;gap:.7rem;color:#13213a;color:var(--ink);text-decoration:none}
.thumb{position:relative;display:flex;flex-direction:column;gap:7%;aspect-ratio:3/4;padding:12% 11%;border-radius:6px;border:1px solid #d3dcda;box-shadow:0 1px 2px rgba(19,33,58,.08),0 16px 30px -18px rgba(19,33,58,.45);overflow:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s}
.no-flexgap .thumb>*+*{margin-top:7%}
.thumbs a:hover .thumb{transform:translateY(-4px) rotate(-.6deg);box-shadow:0 1px 2px rgba(19,33,58,.08),0 24px 40px -20px rgba(19,33,58,.5)}
.thumbs a:focus-visible .thumb{transform:translateY(-4px) rotate(-.6deg);box-shadow:0 1px 2px rgba(19,33,58,.08),0 24px 40px -20px rgba(19,33,58,.5)}
.no-fv .thumbs a:focus .thumb{transform:translateY(-4px) rotate(-.6deg);box-shadow:0 1px 2px rgba(19,33,58,.08),0 24px 40px -20px rgba(19,33,58,.5)}
.th-h{display:block;height:5%;min-height:6px;width:38%;border-radius:2px;background:#0f6f66;background:var(--teal)}
.thumb .x-ln{display:block;height:4px;border-radius:2px;background:#dfe6e4}
.thumb .w40{width:40%}.thumb .w60{width:60%}.thumb .w70{width:70%}.thumb .w80{width:80%}
.thumb .x-f,.thumb .x-k{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.thumb .x-f i{display:block;aspect-ratio:1.3;border-radius:3px;background:#d6ebe7;background:var(--teal-soft)}
.thumb .x-k{grid-template-columns:1fr;gap:4px}
.thumb .x-k i{display:block;height:7px;border-radius:2px;background:linear-gradient(90deg,#dfe6e4 0 78%,transparent 78% 86%,#1f7a4d 86%);background:linear-gradient(90deg,#dfe6e4 0 78%,transparent 78% 86%,var(--ok) 86%)}
.thumb .x-g{display:block;height:12%;border-radius:4px;background:#e3f3ea;background:var(--ok-soft);border:1px solid rgba(var(--ok-rgb),0.3);border:1px solid color-mix(in srgb,var(--ok) 30%,transparent)}
.thumb .x-q{display:grid;gap:4px}
.thumb .x-q i{display:block;height:7px;border-radius:2px;background:linear-gradient(90deg,#dfe6e4 0 62%,transparent 62% 76%,#b7c4c1 76%)}
.thumb .x-t{align-self:flex-end;font:760 .8rem/1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:760 max(.8rem,min(.6rem + .6vw,1.05rem))/1 var(--f-disp);letter-spacing:-.01em;color:#13213a;color:var(--ink);border-top:2px solid #13213a;border-top:2px solid var(--ink);padding-top:.35em}
.th-l{font-weight:600;font-size:.95rem;line-height:1.3}
.thumbs a:hover .th-l{color:#0b524c;color:var(--teal-2);text-decoration:underline;text-underline-offset:.18em}

/* ------------------------------------------------------------ "How we work" page */
.tr-hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:2rem;gap:max(2rem,min(5vw,4.5rem));align-items:end;margin-top:1.6rem;margin-top:max(1.6rem,min(4vw,2.8rem))}
.tr-hero h1{max-width:12em}
.tr-hero .lead{margin-bottom:0}
.tr-hero .thumbs{max-width:30rem;justify-self:end;width:100%}
.tr-hero .thumbs li:nth-child(1) .thumb{transform:rotate(-3deg) translateY(10px)}
.tr-hero .thumbs li:nth-child(3) .thumb{transform:rotate(3deg) translateY(10px)}
.tr-hero .thumbs a:hover .thumb{transform:translateY(-4px)}
.tr-hero .ct-jump{margin-top:2rem;margin-top:max(2rem,min(4vw,3rem))}
@media (max-width:900px){.tr-hero-grid{grid-template-columns:1fr}.tr-hero .thumbs{justify-self:start}}

/* terms as a short agreement */
.terms-doc{padding:1.5rem;padding:max(1.5rem,min(4vw,3.4rem));border-radius:20px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line);box-shadow:0 1px 2px rgba(19,33,58,.06),0 18px 40px -22px rgba(19,33,58,.32);box-shadow:var(--shadow)}
.terms{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 2rem;gap:0 max(2rem,min(5vw,4.5rem))}
.terms li{padding:1.15rem 0 1.2rem;border-top:1px solid #d3dcda;border-top:1px solid var(--line)}
.terms li:nth-child(-n+2){border-top:0;padding-top:0}
.terms h3{display:flex;gap:.55em;align-items:baseline;margin-bottom:.35rem;font:700 1.15rem/1.3 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.15rem/1.3 var(--f-disp);letter-spacing:-.01em}
.no-flexgap .terms h3>:not(:last-child),.no-flexgap .terms h3>:only-child{margin-right:.55em}
.cl-n{flex:none;min-width:1.5em;color:#0b524c;color:var(--teal-2);font-variant-numeric:tabular-nums}
.terms p{margin:0;color:#33415a;color:var(--ink-2)}
.terms-note{margin:1.6rem 0 0;padding:.9rem 1.1rem;border-radius:10px;background:#ffffe1;background:var(--tip);border:1px solid #d6cf93;border:1px solid var(--tip-line);color:#4a4410;color:var(--tip-ink);font-weight:500}
@media (max-width:760px){.terms{grid-template-columns:1fr}.terms li:nth-child(2){border-top:1px solid #d3dcda;border-top:1px solid var(--line);padding-top:1.15rem}}

/* payment timeline */
.pay-sec{background:#13213a;background:var(--dark);color:#eef3f5;color:var(--on-dark)}
.pay-sec h2{color:#fff}
.pay-sec .sh p{color:#b9c6d6;color:var(--on-dark-2)}
.paytl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.8rem;gap:max(.8rem,min(2vw,1.6rem));position:relative}
.paytl::before{content:"";position:absolute;left:0;right:0;top:32px;height:2px;background:linear-gradient(90deg,rgba(255,255,255,.18),#5cc3b6 50%,rgba(255,255,255,.18))}
.paytl li{position:relative}
.pt-dot{position:relative;display:grid;place-items:center;width:64px;height:64px;margin-bottom:1.1rem}
.pt-dot::before{content:"";width:16px;height:16px;border-radius:50%;background:#13213a;background:var(--dark);border:2px solid rgba(255,255,255,.55)}
.pay-on .pt-dot{border-radius:50%;background:#5cc3b6;color:#062420;font:780 1.15rem/1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:780 1.15rem/1 var(--f-disp);letter-spacing:-.01em}
.pay-on .pt-dot::before{display:none}
.paytl h3{color:#fff;margin-bottom:.35rem}
.paytl p{margin:0;color:#b9c6d6;color:var(--on-dark-2);font-size:.97rem}
.pay-ms{margin:1.8rem 0 0;margin:max(1.8rem,min(4vw,2.6rem)) 0 0;padding-top:1.2rem;border-top:1px solid rgba(255,255,255,.14);color:#b9c6d6;color:var(--on-dark-2);max-width:48rem}
.pay-sec :focus-visible{outline-color:#a7c4ff}
.no-fv .pay-sec :focus{outline-color:#a7c4ff}
@media (max-width:860px){
  .paytl{grid-template-columns:1fr;gap:1.3rem}
  .paytl::before{left:31px;right:auto;top:20px;bottom:20px;width:2px;height:auto;background:linear-gradient(180deg,rgba(255,255,255,.18),#5cc3b6 50%,rgba(255,255,255,.18))}
  .paytl li{display:grid;grid-template-columns:64px minmax(0,1fr);gap:0 1rem;align-items:start}
  .pt-dot{grid-row:span 2;margin:0}
}

/* sample documents */
.docs{display:grid;grid-template-columns:minmax(0,3.4fr) minmax(0,8.6fr);gap:1.4rem;gap:max(1.4rem,min(3.5vw,3rem));align-items:start;scroll-margin-top:calc(64px + 16px);scroll-margin-top:calc(var(--head) + 16px)}
.doc-tabs{display:grid;gap:.5rem;position:sticky;top:calc(64px + 24px);top:calc(var(--head) + 24px)}
.doc-tabs button{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:.8rem;padding:.9rem 1rem;border-radius:12px;border:1px solid #d3dcda;border:1px solid var(--line);background:#fff;background:var(--surface);cursor:pointer;font-weight:600;line-height:1.25;transition:border-color .2s, background-color .2s}
.no-flexgap .doc-tabs button>:not(:last-child),.no-flexgap .doc-tabs button>:only-child{margin-right:.8rem}
.doc-tabs button .ic{width:2.2rem;height:2.2rem;padding:.5rem;border-radius:9px;background:#e7edeb;background:var(--bg-2);color:#33415a;color:var(--ink-2);transition:background-color .2s, color .2s}
.doc-tabs button:hover{border-color:#b7c4c1;border-color:var(--line-2)}
.doc-tabs button:focus-visible{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:3px}
.no-fv .doc-tabs button:focus{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:3px}
.doc-tabs button[aria-selected=true]{border-color:#0f6f66;border-color:var(--teal);box-shadow:inset 4px 0 0 #0f6f66;box-shadow:inset 4px 0 0 var(--teal)}
.doc-tabs button[aria-selected=true] .ic{background:#0f6f66;background:var(--teal);color:#fff;color:var(--on-teal)}
.doc-stage{padding:.9rem;padding:max(.9rem,min(3vw,2.6rem));border-radius:20px;background:#e7edeb;background:var(--bg-2);border:1px solid #d3dcda;border:1px solid var(--line);background-image:radial-gradient(rgba(var(--line-2-rgb),0.55) 1px,transparent 1.2px);background-image:radial-gradient(color-mix(in srgb,var(--line-2) 55%,transparent) 1px,transparent 1.2px);background-size:14px 14px}
.doc-panel:not(.on){display:none}
.doc-panel:focus-visible{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:6px;border-radius:8px}
.no-fv .doc-panel:focus{outline:3px solid #0a246a;outline:3px solid var(--focus);outline-offset:6px;border-radius:8px}
html:not(.js) .doc-tabs{display:none}
html:not(.js) .doc-panel:not(.on){display:block}
html:not(.js) .doc-panel+.doc-panel{margin-top:2rem}
html:not(.js) .docs{grid-template-columns:1fr}
@media (prefers-reduced-motion:no-preference){.doc-panel.on .sheet{animation:sheetIn .5s cubic-bezier(.2,.8,.2,1)}}
@keyframes sheetIn{from{opacity:0;transform:translateY(14px) rotate(.4deg)}to{opacity:1;transform:none}}
.sheet{position:relative;max-width:48rem;margin:0 auto;padding:1.2rem 1.1rem 1.4rem;padding:max(1.2rem,min(4vw,3rem)) max(1.1rem,min(4.5vw,3.4rem)) max(1.4rem,min(4vw,3rem));border-radius:4px;box-shadow:0 1px 2px rgba(19,33,58,.1),0 30px 50px -30px rgba(19,33,58,.5);font-size:.93rem;line-height:1.55}
.sh-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.6rem 1rem;padding-bottom:1rem;margin-bottom:1.4rem;border-bottom:2px solid #13213a;border-bottom:2px solid var(--ink)}
.no-flexgap .sh-top>*{margin-right:1rem;margin-bottom:.6rem}
.sh-brand{display:inline-flex;align-items:center;gap:.45rem;font:470 1rem/1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:470 1rem/1 var(--f-disp)}
.no-flexgap .sh-brand>:not(:last-child),.no-flexgap .sh-brand>:only-child{margin-right:.45rem}
.sh-brand b{font-weight:760}
.sh-brand .logo-sym{width:22px;height:22px}
.sheet .exl{font-size:.78rem;white-space:normal}
.sh-th{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin:0 0 1rem}
.no-flexgap .sh-th>:not(:last-child),.no-flexgap .sh-th>:only-child{margin-right:1rem}
.stamp{flex:none;padding:.25em .7em;border:3px double #b42318;border-radius:6px;color:#b42318;font:780 1.15rem/1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:780 1.15rem/1 var(--f-disp);letter-spacing:.08em;transform:rotate(-7deg);opacity:.8;pointer-events:none}
.sh-title{margin:0;font:760 1.35rem/1.15 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:760 max(1.35rem,min(1.1rem + 1vw,1.8rem))/1.15 var(--f-disp);letter-spacing:-.015em}
.sh-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem 1.2rem;margin:0 0 1.4rem;padding:.9rem 1rem;border-radius:8px;background:#f2f5f4;background:var(--bg)}
.sh-meta .w{grid-column:span 3}
.sh-meta dt{font-size:.78rem;color:#55627a;color:var(--muted)}
.sh-meta dd{margin:.1rem 0 0;font-weight:600}
.sheet h4{margin:1.3rem 0 .45rem;font:700 .98rem/1.3 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font:700 .98rem/1.3 var(--f-body);color:#0b524c;color:var(--teal-2)}
.sheet p{margin:0 0 .6rem;color:#33415a;color:var(--ink-2)}
.sh-figs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.5rem}
.sh-figs li{display:grid;padding:.6rem .5rem;border-radius:8px;border:1px solid #d3dcda;border:1px solid var(--line);text-align:center}
.sh-figs b{font:760 1.2rem/1.1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:760 1.2rem/1.1 var(--f-disp);font-variant-numeric:tabular-nums}
.sh-figs span{font-size:.74rem;color:#55627a;color:var(--muted);line-height:1.25;margin-top:.2rem}
.sh-ul{margin:0;padding-left:1.15rem;color:#33415a;color:var(--ink-2)}
.sh-ul li+li{margin-top:.35rem}
.sh-price{margin:0;border-top:1px solid #d3dcda;border-top:1px solid var(--line)}
.sh-price div{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line)}
.no-flexgap .sh-price div>:not(:last-child),.no-flexgap .sh-price div>:only-child{margin-right:1rem}
.sh-price dd{margin:0;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.sh-small{font-size:.84rem;color:#55627a!important;color:var(--muted)!important;margin-top:.6rem!important}
.sh-tbl{overflow-x:auto;margin:0 0 1.2rem}
.sheet table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.sheet th{padding:.5rem .6rem;text-align:left;font-size:.78rem;font-weight:600;color:#55627a;color:var(--muted);border-bottom:1.5px solid #13213a;border-bottom:1.5px solid var(--ink)}
.sheet td{padding:.6rem;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line);vertical-align:top}
.sheet tfoot th,.sheet tfoot td{padding-top:.75rem;border-bottom:0;font-size:1rem;font-weight:760;color:#13213a;color:var(--ink)}
.sheet .r{text-align:right;white-space:nowrap}
.sheet .c{text-align:center;width:3.5rem}
.sh-terms{display:grid;grid-template-columns:1fr 1fr;gap:.9rem 1.6rem;margin:0}
.sh-terms dt{font-weight:700}
.sh-terms dd{margin:.15rem 0 0;color:#33415a;color:var(--ink-2)}
.sheet .ok{display:inline-flex;align-items:center;gap:.3em;padding:.1em .5em;border-radius:999px;background:#e3f3ea;background:var(--ok-soft);color:#1f7a4d;color:var(--ok);font-size:.8rem;font-weight:600}
.no-flexgap .sheet .ok>:not(:last-child),.no-flexgap .sheet .ok>:only-child{margin-right:.3em}
.sheet .ok .ic{width:.95em;height:.95em;stroke-width:2.6}
.sh-sum{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.4rem 1rem;padding:.8rem 1rem;border-radius:8px;background:#e3f3ea;background:var(--ok-soft);color:#1f7a4d!important;color:var(--ok)!important}
.no-flexgap .sh-sum>*{margin-right:1rem;margin-bottom:.4rem}
@media (max-width:900px){
  .docs{grid-template-columns:1fr}
  .doc-tabs{position:static;display:flex;overflow-x:auto;margin:0 calc(-1*16px);margin:0 calc(-1*var(--gut));padding:.2rem 16px .4rem;padding:.2rem var(--gut) .4rem;scrollbar-width:none}
  .doc-tabs::-webkit-scrollbar{display:none}
  .doc-tabs button{flex:none;padding:.6rem .85rem}
  .doc-tabs button .ic{width:1.9rem;height:1.9rem;padding:.4rem}
  .sh-figs{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:560px){
  .doc-stage{margin-left:calc(-1*16px + 6px);margin-right:calc(-1*16px + 6px);margin-left:calc(-1*var(--gut) + 6px);margin-right:calc(-1*var(--gut) + 6px);border-radius:14px}
  .sh-meta{grid-template-columns:1fr 1fr}.sh-meta .w{grid-column:span 2}
  .sh-terms{grid-template-columns:1fr}
  .stamp{font-size:.9rem}
  .sheet th:nth-child(2):not(:last-child),.sheet td.hide-s{display:none}
}

/* proof */
.proof{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.pf{display:flex;flex-direction:column;padding:1.3rem;padding:max(1.3rem,min(2.4vw,1.8rem));border-radius:20px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line)}
.pf h3{margin:0 0 .5rem;font:700 1.2rem/1.25 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.2rem/1.25 var(--f-disp);letter-spacing:-.01em}
.pf p{color:#33415a;color:var(--ink-2)}
.pf .lp-arrow{margin-top:1.2rem}
.pf-figs{list-style:none;margin:auto 0 0;padding:0;border-top:1px solid #d3dcda;border-top:1px solid var(--line)}
.pf-figs li{display:grid;grid-template-columns:4.2rem minmax(0,1fr) auto;gap:.7rem;align-items:center;padding:.55rem 0;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line);font-size:.92rem;color:#33415a;color:var(--ink-2)}
.pf-figs b{font:760 1.15rem/1 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:760 1.15rem/1 var(--f-disp);color:#13213a;color:var(--ink);font-variant-numeric:tabular-nums}
.pf-figs .ic{width:1.3rem;height:1.3rem;padding:.2rem;border-radius:50%;background:#e3f3ea;background:var(--ok-soft);color:#1f7a4d;color:var(--ok);stroke-width:2.6}
.pf-shot{margin:auto 0 0;border-radius:10px;overflow:hidden;border:1px solid #d3dcda;border:1px solid var(--line);background:#fff}
.pf-shot img{display:block;width:100%;height:auto}
.net{margin-top:auto;border-radius:10px;overflow:hidden;background:#1d2533;color:#cfd8e3;font-size:.78rem;font-variant-numeric:tabular-nums}
.pf .net-h,.net li{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:.8rem;margin:0;padding:.38rem .8rem}
.pf .net-h{background:#273042;color:#9aa8ba;font-weight:600}
.net ul{list-style:none;margin:0;padding:0}
.net li+li{border-top:1px solid rgba(255,255,255,.06)}
.net li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.net li span:last-child{color:#8fdcd2}
@media (max-width:900px){.proof{grid-template-columns:1fr}}

/* what we will not do */
.wont-wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:1.5rem;gap:max(1.5rem,min(4vw,4rem));align-items:start}
.wont{list-style:none;margin:0;padding:0;border-top:1px solid #d3dcda;border-top:1px solid var(--line)}
.wont li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.9rem;align-items:start;padding:.9rem 0;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line);font-size:1.05rem}
.wont .ic{width:1.35rem;height:1.35rem;margin-top:.12em;color:#b42318;stroke-width:2}
@media (prefers-color-scheme:dark){.wont .ic{color:#ff8a7a}}
.wont-s li{font-size:1rem;padding:.75rem 0}
@media (max-width:860px){.wont-wrap{grid-template-columns:1fr}}

/* handover */
.hand{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(100%,1fr));grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr));gap:14px}
.hand li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.9rem;padding:1.2rem 1.25rem;border-radius:16px;background:#fff;background:var(--surface);border:1px solid #d3dcda;border:1px solid var(--line)}
.hand .ic{width:2rem;height:2rem;padding:.4rem;border-radius:50%;background:#d6ebe7;background:var(--teal-soft);color:#0b524c;color:var(--teal-2);stroke-width:2.4}
.hand h3{margin:0 0 .25rem}
.hand p{margin:0;color:#33415a;color:var(--ink-2);font-size:.97rem}

/* ------------------------------------------------------------ home: proof section additions */
.tq{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:2rem;gap:max(2rem,min(5vw,4.5rem));align-items:start;margin-top:3rem;margin-top:max(3rem,min(6vw,4.5rem));padding-top:2rem;padding-top:max(2rem,min(4vw,3rem));border-top:1px solid #d3dcda;border-top:1px solid var(--line)}
.tq h3{margin-bottom:.4rem;font:720 1.3rem/1.2 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:720 max(1.3rem,min(1.1rem + .6vw,1.6rem))/1.2 var(--f-disp);letter-spacing:-.015em}
.tq-docs>p{color:#33415a;color:var(--ink-2);margin-bottom:1.4rem}
.tq-wont h3{margin-bottom:.9rem}
.tq-wont .lp-arrow{margin-top:1.1rem}
.how-more{margin:1.8rem 0 0;margin:max(1.8rem,min(4vw,2.6rem)) 0 0}
@media (max-width:900px){.tq{grid-template-columns:1fr}}
@media (max-width:480px){.thumbs{gap:.6rem}.th-l{font-size:.85rem}}
.tq-docs .thumbs{max-width:33rem}

/* pressed states inside mock-ups: ".mock button:not(.btn){color:inherit}" must not win over them */
.mock .mk-vp button[aria-pressed=true],.mock .ad-chips button[aria-pressed=true]{color:#f2f5f4;color:var(--bg)}
.mock button.en-node[aria-pressed=true]{color:#fff;color:var(--on-teal)}

/* v5: comparison table, language suggestion, WhatsApp button, Chinese and Japanese typography */

/* ------------------------------------------------------------ check before handover (home) */
.tr-h{display:grid;gap:.3rem;justify-content:stretch}
.tr-h b{font:700 1.06rem/1.3 "Bricolage","IBM Plex Sans",system-ui,sans-serif;font:700 1.06rem/1.3 var(--f-disp);letter-spacing:-.01em;color:#13213a;color:var(--ink)}
.tr-h span{font-weight:400;font-size:.9rem;line-height:1.5;color:#33415a;color:var(--ink-2)}
.tr tbody th{padding:.75rem 1.2rem;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line);color:#13213a;color:var(--ink);font-size:.93rem;font-weight:500;line-height:1.35}
.tr thead th{vertical-align:bottom;line-height:1.3}
.tr td.r{white-space:nowrap}
.tr td:last-child,.tr th:last-child{padding-left:.4rem;width:2.4rem}
/* small screens: the label on its own line, the two figures side by side under their column names */
@media (max-width:560px){
  .tr thead tr,.tr tbody tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 1.6rem;align-items:center;column-gap:.75rem;padding:0 .9rem;border-bottom:1px solid #d3dcda;border-bottom:1px solid var(--line)}
  .tr th,.tr td,.tr tbody th{border:0;padding:0;width:auto}
  .tr thead th{padding:.6rem 0;font-size:.8rem}
  .tr thead th:first-child{display:none}
  .tr tbody th{grid-column:1/-1;padding:.75rem 0 .2rem}
  .tr tbody td{padding:0 0 .75rem;font-size:.95rem}
  .tr td.r,.tr th.r{text-align:left}
  .tr td:last-child,.tr th:last-child{padding:0 0 .75rem;width:auto;text-align:right}
  .tr thead th:last-child{padding:0}
  .tr-h{padding:.9rem}
  .tr-f{padding:.8rem .9rem}
}

/* ------------------------------------------------------------ language suggestion: a small card in the lower corner,
   never a redirect; fixed, so it does not move the page */
.lsug{position:fixed;z-index:38;bottom:24px;bottom:max(24px,env(safe-area-inset-bottom));right:16px;right:max(var(--gut),calc((100vw - var(--wrap)) / 2));
  width:calc(100vw - 2 * 16px);
  width:min(24rem,calc(100vw - 2 * var(--gut)));padding:1rem 1.1rem 1.05rem;border-radius:14px;background:#fff;background:var(--surface);color:#13213a;color:var(--ink);
  border:1px solid #d3dcda;
  border:1px solid var(--line);box-shadow:0 18px 44px -16px rgba(19,33,58,.5);opacity:0;transform:translateY(8px);transition:opacity .25s, transform .25s}
@media (max-width:760px){.lsug{bottom:calc(78px + env(safe-area-inset-bottom));left:16px;left:var(--gut);right:16px;right:var(--gut);width:auto}}
.lsug.on{opacity:1;transform:none}
.lsug p{margin:0 0 .75rem;font-size:.97rem;line-height:1.45;font-weight:500}
.lsug-a{display:flex;flex-wrap:wrap;gap:.5rem}
.no-flexgap .lsug-a>*{margin-right:.5rem;margin-bottom:.5rem}
.lsug .btn.sm{min-height:40px}
body.mn-open .lsug{display:none}
@media (prefers-reduced-motion:reduce){.lsug{transition:none;transform:none}}
@media print{.lsug{display:none}}

/* ------------------------------------------------------------ WhatsApp button (enabled from config.py) */
.c-wa{padding:1.2rem;padding:max(1.2rem,min(2.4vw,1.6rem));border-radius:18px;border:1px solid rgba(255,255,255,.16)}
.c-wa .btn[aria-disabled=true]{opacity:.7;cursor:progress}
.wa-box:empty{display:none}
.wa-box{margin-top:.8rem;max-width:100%;overflow:hidden}
.wa-st{margin:.6rem 0 0;font-size:.92rem;color:#b9c6d6;color:var(--on-dark-2)}
.wa-st:empty{display:none}
.wa-nojs{font-size:.92rem;color:#b9c6d6;color:var(--on-dark-2)}
.js .wa-nojs{display:none}

/* ------------------------------------------------------------ Chinese (Simplified) and Japanese: system fonts, no
   downloads; Latin text keeps IBM Plex Sans and Bricolage, CJK characters fall through to the system face */
html:lang(zh){--f-body:"IBM Plex Sans","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Source Han Sans SC","Noto Sans SC",sans-serif;
  --f-disp:"Bricolage","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Source Han Sans SC","Noto Sans SC",sans-serif}
html:lang(ja){--f-body:"IBM Plex Sans","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic","YuGothic","Meiryo","Noto Sans CJK JP","Noto Sans JP",sans-serif;
  --f-disp:"Bricolage","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic","YuGothic","Meiryo","Noto Sans CJK JP","Noto Sans JP",sans-serif}
html:lang(zh) body,html:lang(ja) body{line-height:1.75}
html:lang(zh) body,html:lang(ja) body{line-break:strict}
html:lang(zh) h1{letter-spacing:0;line-height:1.3;word-break:normal}
html:lang(zh) h2{letter-spacing:0;line-height:1.3;word-break:normal}
html:lang(zh) h3{letter-spacing:0;line-height:1.3;word-break:normal}
html:lang(ja) h1{letter-spacing:0;line-height:1.3;word-break:normal}
html:lang(ja) h2{letter-spacing:0;line-height:1.3;word-break:normal}
html:lang(ja) h3{letter-spacing:0;line-height:1.3;word-break:normal}
html:lang(ja) h1{word-break:auto-phrase}
html:lang(ja) h2{word-break:auto-phrase}
html:lang(ja) h3{word-break:auto-phrase}
html:lang(zh) .hero h1,html:lang(ja) .hero h1{font-size:2rem;font-size:max(2rem,min(1rem + 3.2vw,4.2rem));line-height:1.2;max-width:14em}
html:lang(zh) .lp-hero h1,html:lang(ja) .lp-hero h1{font-size:1.9rem;font-size:max(1.9rem,min(1rem + 2.6vw,3.6rem));line-height:1.22}
html:lang(zh) em,html:lang(ja) em{font-style:normal}

/* large screens: a slightly larger type scale and a wider column, so 1920-2560 px screens do not look sparse */
@media (min-width:1800px){html{font-size:106.25%}:root{--wrap:1320px}}
@media (min-width:2300px){html{font-size:112.5%}:root{--wrap:1440px}}
/* catalogue: long category names (Desenvolvimento, Ontwikkeling) stay inside their column */
.ct-head{container-type:inline-size;min-width:0}
.ct-head h2{font-size:calc(1.9rem);font-size:min(max(1.9rem,min(1.3rem + 1.8vw,2.7rem)),calc(10.5 * var(--cqi, 6px)));font-size:min(max(1.9rem,min(1.3rem + 1.8vw,2.7rem)),10.5cqi);overflow-wrap:break-word}


/* ================================================================ compatibility layer (added by the build)
   html starts as "no-js"; the first statement of main.js switches it to "js". Until then (and when JavaScript is
   off, blocked or fails to load) html:not(.js) applies: a complete, orderly layout with plain links only. */

/* Services: a plain link to the catalogue without JavaScript, the mega-menu button with it */
.nav-l>li>a.nav-b-nojs{display:none}
html:not(.js) .nav-l>li>a.nav-b-nojs{display:inline-flex}
html:not(.js) .nav-b-nojs+.nav-b{display:none}
html:not(.js) .burger{display:none}

/* without JavaScript, below the desktop breakpoint: the main links on a second header row, no overlay */
@media (max-width:1179px){
  html:not(.js) .site-head{position:relative}
  html:not(.js) .hd{flex-wrap:wrap;height:auto;min-height:64px;min-height:var(--head);padding-top:10px;padding-bottom:10px}
  html:not(.js) .mainnav{display:block;order:9;flex:1 1 100%;width:100%;margin:0}
  html:not(.js) .nav-l{flex-wrap:wrap;margin-left:-.72em}
  html:not(.js) .nav-l>li>a{min-height:44px}
  html:not(.js) .mega{display:none}
}

/* interactive mock-ups: without JavaScript the result of each run is shown and the dead control is hidden */
html:not(.js) [data-play-btn]{display:none}
html:not(.js) .au-ok,html:not(.js) .mk-mig tr .tick{opacity:1;transform:none}

/* header without backdrop-filter: an opaque bar instead of a translucent one */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
  .site-head{background:#f2f5f4;background:var(--bg)}
}

/* sample documents: the single column may shrink below its widest table (the table scrolls inside .sh-tbl) */
@media (max-width:900px){.docs{grid-template-columns:minmax(0,1fr)}}
html:not(.js) .docs{grid-template-columns:minmax(0,1fr)}

/* long single words (Dutch, German compounds) never push a heading past the screen edge */
h1,h2,h3,h4{overflow-wrap:break-word}

/* the floating mobile e-mail button needs the script that hides it over the hero and the contact form;
   without JavaScript the same link stays in the header, the contact section and the footer */
html:not(.js) .sticky{display:none}

/* the floating e-mail button keeps one line */
.sticky{white-space:nowrap}

/* phones: the e-mail button is a bar docked to the bottom edge, opaque and full width (the counterpart of the
   header at the top). The script reserves free space at the bottom of the page exactly as tall as the bar, hides
   it at the top of the page and while the contact section or the footer is on screen, so the last lines of the
   page are never under it. The language suggestion sits in the page flow under the header, never on the bar. */
@media (max-width:760px){
  .sticky{left:0;right:0;bottom:0;width:100%;transform:none;justify-content:center;border-radius:0;
    min-height:52px;padding:.8em 16px;padding-bottom:calc(.8em + env(safe-area-inset-bottom));box-shadow:0 -8px 20px -12px rgba(19,33,58,.55)}
  html .sticky.off{transform:translateY(110%);opacity:0;pointer-events:none}
  body.has-sticky{padding-bottom:52px}
}

/* 320px screens (iPhone SE 1st gen, small Android): brand, language and menu button fit on one row */
@media (max-width:374px){
  .hd{gap:.4rem}
  .no-flexgap .hd>:not(:last-child),.no-flexgap .hd>:only-child{margin-right:.4rem}
  .logo-word{font-size:1rem}
  .logo-sym{width:26px;height:26px}
  .lang summary{padding:0 .5em}
}

/* a word longer than its column (German and Dutch compounds) breaks instead of running into the next column */
body{overflow-wrap:break-word}
.ft-col ul{grid-template-columns:minmax(0,1fr)}

/* language suggestion: a strip under the header, in the page flow, so it never covers anything */
.lsug{position:relative;z-index:auto;top:auto;right:auto;bottom:auto;left:auto;width:auto;max-width:none;margin:0;
  display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.4rem;padding:.8rem 16px;padding:.8rem max(16px,calc((100% - 1200px) / 2));
  padding:.8rem max(var(--gut),calc((100% - var(--wrap)) / 2));border-width:0 0 1px;border-radius:0;box-shadow:none;background:#fff;background:var(--surface)}
.no-flexgap .lsug>*{margin-right:1.4rem;margin-bottom:.6rem}
.lsug p{flex:1 1 18rem;margin:0}

/* privacy: title (header.doc-head) first, then the table of contents and the text; on wide screens the title sits
   above the text, next to the contents */
@media (min-width:901px){
  .doc-grid{row-gap:0}
  .doc-grid>.doc-head{grid-column:2;grid-row:1}
  .doc-grid>.toc{grid-column:1;grid-row:1/span 2}
  .doc-grid>article{grid-column:2;grid-row:2}
}

/* contact form without JavaScript: the plain e-mail link replaces fields that could not be sent */
html:not(.js) .cf .cf-row,html:not(.js) .cf>.fld,html:not(.js) .cf .cf-consent,html:not(.js) .cf .hp{display:none}

/* very large screens (2560 and 4K at 100%, TVs): wider column and proportionally larger type, so the page
   does not look small and empty; nothing changes below 2000px */
@media (min-width:2000px){
  :root{--wrap:1680px;--head:72px}
  html{font-size:112.5%}
  body{font-size:19px}
}
@media (min-width:3000px){
  :root{--wrap:2160px;--head:84px}
  html{font-size:140%}
  body{font-size:24px}
}