/* src/styles/hlab-buttons.css */
/* moved to hlab-x3-buttons.css (load order). Safe to delete. */

/* src/styles/hlab-fs.css */
/* moved to hlab-x6-fs.css (load order). Safe to delete. */

/* src/styles/hlab-hero-vesper.css */
/* moved to hlab-x8-hero-vesper.css (load order). Safe to delete. */

/* src/styles/hlab-hero.css */
/* moved to hlab-x1-hero.css (load order). Safe to delete. */

/* src/styles/hlab-logo-grid.css */
/* moved to hlab-x2-logo-grid.css (load order). Safe to delete. */

/* src/styles/hlab-mobile.css */
/* moved to hlab-x4-mobile.css (load order). Safe to delete. */

/* src/styles/hlab-review.css */
/* moved to hlab-x7-review.css (load order). Safe to delete. */

/* src/styles/hlab-styles.css */
:root:has([class*="hlab-"]){--font-body:"Bricolage Grotesque",system-ui,sans-serif;}
body:has([class*="hlab-"]){font-family:var(--font-body),'Inter',system-ui,sans-serif;}
html:has([class*="hlab-"]),body:has([class*="hlab-"]),body:has([class*="hlab-"]) button,body:has([class*="hlab-"]) input,body:has([class*="hlab-"]) select,body:has([class*="hlab-"]) textarea,body:has([class*="hlab-"]) a{font-family:var(--font-body),'Inter',system-ui,sans-serif !important;}
.hlab-ti-eyebrow{letter-spacing:0.14em;}
.hlab-ti-h2{position:relative;line-height:1.02;letter-spacing:-0.025em;text-wrap-mode:initial;text-wrap-style:balance;}
@media (max-width:600px){.hlab-ti-h2{line-height:1.08;}}
.hlab-ti-lead{line-height:1.5;text-wrap-mode:initial;text-wrap-style:pretty;font-size:clamp(16px,1.4vw,19px);}
.hlab-ti-card-media{object-fit:contain;background-image:url("/uploads/4gq-rOQF5AndIojAB1c9d-pexels-photo-8867405-w1600.webp");background-position-x:center;background-position-y:center;background-size:cover;background-repeat:no-repeat;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:initial;}
.hlab-ti-card-title{letter-spacing:-0.022em;line-height:1.25;}
.hlab-ti-card-text{line-height:1.5;}
.hlab-ti-btn{transition-behavior:normal,normal,normal,normal;transition-duration:0.25s,0.25s,0.25s,0.2s;transition-timing-function:cubic-bezier(0.16,1,0.3,1),cubic-bezier(0.16,1,0.3,1),cubic-bezier(0.16,1,0.3,1),cubic-bezier(0.16,1,0.3,1);transition-delay:0s,0s,0s,0s;transition-property:background,color,border-color,transform;}
.hlab-ti-fix{background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(255,255,255);}
.hlab-ti-costing{position:relative;color:rgb(234,246,247);background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(255,255,255);}
.hlab-ti-range{position:relative;cursor:pointer;margin-top:4px;touch-action:none;}
.hlab-ti-panel-num-label{white-space-collapse:collapse;text-wrap-mode:wrap;}
.hlab-ti-panel-num{transition-behavior:normal;transition-duration:0.3s;transition-timing-function:ease;transition-delay:0s;transition-property:color;font-size:clamp(34px,4.2vw,54px);white-space-collapse:collapse;text-wrap-mode:nowrap;font-variant-numeric:tabular-nums;letter-spacing:-0.015em;margin:6px 0px 4px;}
.hlab-ti-panel-sub{line-height:1.5;white-space-collapse:collapse;text-wrap-mode:wrap;}
.hlab-ti-panel-rows{margin-top:4px;}
.hlab-ti-panel-cta{white-space-collapse:collapse;text-wrap-mode:nowrap;margin-top:14px;}
.hlab-ti-calc-panel{grid-template-columns:1fr;align-items:stretch;gap:clamp(10px,1.4vw,18px);}
.hlab-ti-calc{background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(255,255,255);}
.hlab-ti-feature{padding:clamp(48px,12vh,110px) 0;border-top-width:0px;border-top-style:none;border-top-color:currentcolor;}
.hlab-ti-sticky-media{justify-self:center;border:1px solid var(--ti-line);background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;box-shadow:rgba(13,20,31,0.18) 0px 24px 60px;position:sticky;top:96px;aspect-ratio:4 / 5;width:100%;min-width:0px;max-height:none;border-top-left-radius:20px;border-top-right-radius:20px;border-bottom-right-radius:20px;border-bottom-left-radius:20px;overflow-x:hidden;overflow-y:hidden;background-color:rgb(13,20,31);}
@media (max-width:1024px){.hlab-ti-sticky-media{max-height:70vh;position:relative;top:0px;order:-1;max-width:680px;aspect-ratio:16 / 10;margin:0px auto;}}
.hlab-ti-sticky-wrap{grid-template-columns:1fr 1.2fr;}
@media (max-width:1024px){.hlab-ti-sticky-wrap{grid-template-columns:1fr;}}
.hlab-ti-logos{grid-template-columns:repeat(3,1fr);max-width:780px;margin-left:auto;margin-right:auto;border-top-width:0px;border-top-style:none;border-top-color:currentcolor;padding-top:0px;}
.hlab-ti-builtby{background-image:linear-gradient(rgba(13,20,31,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(13,20,31,0.05) 1px,transparent 1px),initial;background-position-x:center,center,initial;background-position-y:center,center,initial;background-size:46px 46px,46px 46px,initial;background-repeat:initial,initial,initial;background-attachment:initial,initial,initial;background-origin:initial,initial,initial;background-clip:initial,initial,initial;background-color:rgb(255,255,255);}
.hlab-ti-footer{position:relative;overflow-x:hidden;overflow-y:hidden;background:var(--ti-navy-c);border-top-left-radius:28px;border-top-right-radius:28px;display:block;padding:0px;border-top-width:0px;border-top-style:none;border-top-color:currentcolor;color:rgb(244,247,249);font-size:14px;padding:clamp(16px,1.8vw,30px);background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:transparent;}
.hlab-ti-root{letter-spacing:-0.011em;line-height:1.5;--ti-bg-1:#fcfdfd;--ti-bg-2:#f7f9f9;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(255,255,255);}
.hlab-ti-range-fill{position:absolute;left:0px;top:0px;bottom:0px;width:46%;border-top-left-radius:999px;border-top-right-radius:999px;border-bottom-right-radius:999px;border-bottom-left-radius:999px;background:linear-gradient(90deg,var(--ti-forest-a),var(--ti-forest-b));pointer-events:none;}
.hlab-ti-range-thumb{position:absolute;top:50%;left:46%;width:22px;height:22px;border-top-left-radius:50%;border-top-right-radius:50%;border-bottom-right-radius:50%;border-bottom-left-radius:50%;background:var(--ti-forest-b);border-top-width:3px;border-right-width:3px;border-bottom-width:3px;border-left-width:3px;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-color:rgb(255,255,255);border-right-color:rgb(255,255,255);border-bottom-color:rgb(255,255,255);border-left-color:rgb(255,255,255);border-image-source:none;border-image-slice:100%;border-image-width:1;border-image-outset:0;border-image-repeat:stretch;box-shadow:rgba(0,0,0,0.2) 0px 2px 6px;transform:translate(-50%,-50%);pointer-events:none;}
.hlab-ti-range:focus-visible{outline-color:rgba(20,20,20,0.35);outline-style:solid;outline-width:2px;outline-offset:4px;}
.hlab-ti-calc-head h3{letter-spacing:-0.022em;line-height:1.1;}
.hlab-ti-feature h4{font-size:clamp(26px,2.8vw,40px);font-weight:600;letter-spacing:-0.022em;margin:0px 0px 16px;line-height:1.1;text-wrap-mode:initial;text-wrap-style:balance;}
.hlab-ti-slide h4{letter-spacing:-0.022em;line-height:1.15;}
.hlab-ti-feature p{font-size:clamp(16px,1.3vw,20px);line-height:1.6;color:var(--ti-muted);margin:0px;}
.hlab-ti-slide p{line-height:1.5;}
.hlab-ti-calc-grid{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;margin-top:10px;border:1px solid var(--ti-line);border-top-left-radius:24px;border-top-right-radius:24px;border-bottom-right-radius:24px;border-bottom-left-radius:24px;overflow-x:hidden;overflow-y:hidden;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(255,255,255);box-shadow:rgba(13,20,31,0.12) 0px 24px 60px;transition-behavior:normal,normal;}
.hlab-ti-calc-left{display:flex;flex-direction:column;justify-content:center;row-gap:24px;column-gap:24px;padding:clamp(26px,3.4vw,48px);background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(255,255,255);}
.hlab-ti-calc-left .hlab-ti-fields{display:flex;flex-direction:column;row-gap:18px;column-gap:18px;}
.hlab-ti-calc-left .hlab-ti-field input{width:100%;border:1px solid var(--ti-line);border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(250,251,252);padding:12px 14px;font-size:16px;color:var(--ti-ink);}
.hlab-ti-calc-grid .hlab-ti-calc-panel{display:flex;flex-direction:column;justify-content:center;align-items:stretch;row-gap:8px;column-gap:8px;margin-top:0px;border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;padding:clamp(26px,3.4vw,48px);}
.hlab-ti-calc-grid .hlab-ti-panel-rows{margin-top:16px;}
.hlab-ti-calc-left .hlab-ti-field{display:flex;flex-direction:column;row-gap:8px;column-gap:8px;}
.hlab-ti-calc-left .hlab-ti-field label{font-size:12px;letter-spacing:0.08em;text-transform:uppercase;color:var(--ti-muted);}
.hlab-ti-calc-left .hlab-ti-field input:focus{outline-color:initial;outline-style:none;outline-width:initial;border-bottom-color:rgb(34,128,138);}
.hlab-ti-calc-panel .hlab-ti-panel-num{margin:0px;font-size:clamp(30px,4vw,48px);}
.hlab-ti-calc-panel .hlab-ti-panel-rows{display:flex;flex-direction:column;margin-top:16px;}
.hlab-ti-calc-panel .hlab-ti-panel-row{display:flex;justify-content:space-between;row-gap:16px;column-gap:16px;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:rgba(255,255,255,0.16);padding:14px 0px;font-size:14px;}
.hlab-ti-panel-row em{color:rgba(234,246,247,0.55);font-style:normal;}
.hlab-ti-sticky-media video{width:100%;height:100%;object-fit:cover;display:block;}
.hlab-ti-anim .hlab-ti-feature.hlab-ti-fade{opacity:0.14;transform:translateY(6px);transition-behavior:normal,normal;transition-duration:0.6s,0.6s;transition-timing-function:cubic-bezier(0.22,1,0.36,1),cubic-bezier(0.22,1,0.36,1);transition-delay:0s,0s;transition-property:opacity,transform;}
.hlab-ti-anim .hlab-ti-feature.hlab-ti-fade.hlab-ti-active{opacity:1;transform:none;}
.hlab-superconscious-root{min-height:100vh;}
.hlab-sf-title{font-size:clamp(30px,3.6vw,50px);font-weight:600;line-height:1.05;letter-spacing:-0.022em;color:var(--ti-ink);margin:16px 0px 0px;max-width:15ch;}
@media (max-width:860px){.hlab-sf-title{max-width:none;}}
.hlab-sf-head{position:sticky;top:100px;}
@media (max-width:860px){.hlab-sf-head{position:static;}}
.hlab-sf-q{width:100%;display:flex;align-items:center;justify-content:space-between;row-gap:24px;column-gap:24px;padding:clamp(22px,2.4vw,30px) 0;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:transparent;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:none;border-top-color:currentcolor;border-right-color:currentcolor;border-bottom-color:currentcolor;border-left-color:currentcolor;border-image-source:none;border-image-slice:100%;border-image-width:1;border-image-outset:0;border-image-repeat:stretch;cursor:pointer;text-align:left;color:var(--ti-ink);font-family:inherit;transition-behavior:normal;transition-duration:0.3s;transition-timing-function:ease;transition-delay:0s;transition-property:color;}
.hlab-sf-panel{display:grid;grid-template-rows:0fr;transition-behavior:normal;transition-duration:0.55s;transition-timing-function:cubic-bezier(0.16,1,0.3,1);transition-delay:0s;transition-property:grid-template-rows;}
.hlab-sf-item{border-top:1px solid var(--ti-line);}
.hlab-sf-wrap{display:grid;grid-template-columns:minmax(0px,4fr) minmax(0px,8fr);gap:clamp(28px,5vw,80px);align-items:start;}
@media (max-width:860px){.hlab-sf-wrap{grid-template-columns:1fr;row-gap:28px;column-gap:28px;}}
.hlab-sf-sec{background:var(--ti-bg);}
.hlab-sf-item:last-child{border-bottom:1px solid var(--ti-line);}
.hlab-sf-q:hover{color:var(--ti-accent);}
.hlab-ti-feature-list .hlab-ti-feature h4{font-weight:700;letter-spacing:-0.025em;margin:0px 0px 16px;white-space-collapse:collapse;text-wrap-mode:wrap;max-width:20ch;font-size:40px;line-height:1.1;}
@media (max-width:430px){.hlab-ti-feature-list .hlab-ti-feature h4{font-size:22px;}}
@media (max-width:900px){.hlab-ti-feature-list .hlab-ti-feature h4{font-size:26px;}}
@media (max-width:768px){.hlab-ti-feature-list .hlab-ti-feature h4{font-size:20px;}}
.hlab-ti-feature-list .hlab-ti-feature p{font-weight:400;letter-spacing:0.02em;margin:0px;max-width:24ch;font-size:40px;line-height:1.25;}
@media (max-width:430px){.hlab-ti-feature-list .hlab-ti-feature p{font-size:19px;}}
@media (max-width:900px){.hlab-ti-feature-list .hlab-ti-feature p{font-size:22px;}}
@media (max-width:768px){.hlab-ti-feature-list .hlab-ti-feature p{font-size:16px;}}
.hlab-ti-feature-list .hlab-ti-feature.hlab-ti-fade{transition-behavior:normal;transition-duration:0.5s;transition-timing-function:ease;transition-delay:0s;transition-property:opacity;opacity:0.3 !important;transform:none !important;}
.hlab-ti-feature-list .hlab-ti-word{display:inline-block;}
.hlab-ti-feature-list .hlab-ti-char{color:rgb(13,20,31);}
@media (prefers-reduced-motion:reduce){.hlab-ti-feature-list .hlab-ti-char{color:rgb(13,20,31) !important;animation-duration:auto !important;animation-timing-function:ease !important;animation-delay:0s !important;animation-iteration-count:1 !important;animation-direction:normal !important;animation-fill-mode:none !important;animation-play-state:running !important;animation-name:none !important;animation-timeline:auto !important;animation-range-start:normal !important;animation-range-end:normal !important;}}
@keyframes tiCharSweep{0%{color:rgb(221,221,221);}30%{color:rgb(34,128,138);}100%{color:rgb(13,20,31);}}
.hlab-ti-feature-list .hlab-ti-feature.hlab-ti-fade.hlab-ti-active{opacity:1 !important;}
.hlab-ti-feature-list .hlab-ti-feature.hlab-ti-active .hlab-ti-char{animation-duration:0.5s;animation-timing-function:ease-out;animation-delay:var(--v-delay,0s);animation-iteration-count:1;animation-direction:normal;animation-fill-mode:both;animation-play-state:running;animation-name:tiCharSweep;animation-timeline:auto;animation-range-start:normal;animation-range-end:normal;}
.hlab-tm2-tab{padding:12px 18px;border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px;border:1px solid var(--ti-line);background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(255,255,255);color:var(--ti-muted);font-family:inherit;font-size:12px;letter-spacing:0.12em;text-transform:uppercase;font-weight:600;cursor:pointer;transition-behavior:normal,normal,normal;transition-duration:0.2s,0.2s,0.2s;transition-timing-function:ease,ease,ease;transition-delay:0s,0s,0s;transition-property:background,color,border-color;}
.hlab-tm2-tabs{display:flex;row-gap:10px;column-gap:10px;flex-wrap:wrap;}
.hlab-tm2-arrow{width:44px;height:44px;border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px;border:1px solid var(--ti-line);background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(255,255,255);color:var(--ti-ink);cursor:pointer;display:grid;align-items:center;justify-items:center;font-size:18px;line-height:1;transition-behavior:normal,normal,normal;transition-duration:0.2s,0.2s,0.2s;transition-timing-function:ease,ease,ease;transition-delay:0s,0s,0s;transition-property:background,color,border-color;}
.hlab-tm2-nav{display:flex;row-gap:10px;column-gap:10px;}
@media (max-width:860px){.hlab-tm2-nav{display:none;}}
.hlab-tm2-bar{display:flex;align-items:center;justify-content:space-between;row-gap:16px;column-gap:16px;margin:clamp(30px,5vh,52px) 0 22px;flex-wrap:wrap;}
.hlab-tm2-eyebrow{letter-spacing:0.16em;text-transform:uppercase;opacity:0.78;font-size:13px;}
.hlab-tm2-title{margin:16px 0px 0px;font-weight:600;font-size:46px;line-height:1.08;letter-spacing:-0.02em;text-wrap-mode:initial;text-wrap-style:balance;}
@media (max-width:860px){.hlab-tm2-title{font-size:28px;}}
@media (max-width:1100px){.hlab-tm2-title{font-size:34px;}}
.hlab-tm2-body{margin:20px 0px 0px;opacity:0;transform:translateY(10px);max-height:0px;overflow-x:hidden;overflow-y:hidden;color:rgba(255,255,255,0.85);transition-behavior:normal,normal,normal;transition-duration:0.4s,0.45s,0.55s;transition-timing-function:ease,ease,ease;transition-delay:0.08s,0.08s,0s;transition-property:opacity,transform,max-height;font-size:23px;line-height:1.4;max-width:38ch;}
@media (max-width:860px){.hlab-tm2-body{font-size:17px;}}
@media (prefers-reduced-motion:reduce){.hlab-tm2-body{transition-behavior:normal;transition-duration:0s;transition-timing-function:ease;transition-delay:0s;transition-property:none;}}
@media (max-width:1100px){.hlab-tm2-body{font-size:19px;}}
.hlab-tm2-card-inner{position:absolute;top:0px;right:0px;bottom:0px;left:0px;display:flex;flex-direction:column;justify-content:flex-start;padding:clamp(18px,1.4vw,26px);}
@media (max-width:860px){.hlab-tm2-card-inner{position:relative;top:auto;right:auto;bottom:auto;left:auto;}}
.hlab-tm2-card{position:relative;flex-grow:1;flex-shrink:1;flex-basis:0px;overflow-x:hidden;overflow-y:hidden;border-top-left-radius:20px;border-top-right-radius:20px;border-bottom-right-radius:20px;border-bottom-left-radius:20px;cursor:pointer;min-height:clamp(440px,58vh,600px);scroll-snap-align:start;transition-behavior:normal,normal;transition-duration:0.6s,0.6s;transition-timing-function:cubic-bezier(0.76,0,0.18,1),cubic-bezier(0.76,0,0.18,1);transition-delay:0s,0s;transition-property:flex-grow,min-width;min-width:clamp(360px,28vw,450px);}
@media (max-width:860px){.hlab-tm2-card{flex-grow:1;flex-shrink:1;flex-basis:auto;min-height:0px;min-width:0px;}}
@media (prefers-reduced-motion:reduce){.hlab-tm2-card{transition-behavior:normal;transition-duration:0s;transition-timing-function:ease;transition-delay:0s;transition-property:none;}}
.hlab-tm2-cards{display:flex;row-gap:16px;column-gap:16px;position:relative;overflow-x:auto;scroll-snap-type:x;scrollbar-width:none;}
@media (max-width:860px){.hlab-tm2-cards{row-gap:12px;column-gap:12px;flex-direction:column;overflow-x:visible;}}
.hlab-tm2-panel{display:none;}
.hlab-tm2{text-align:left;width:100vw;margin-left:calc(50% - 50vw);padding:0 clamp(20px,3vw,48px);}
@media (max-width:860px){.hlab-tm2{width:100%;margin-left:0px;padding:0px;}}
.hlab-tm2-tab:hover{color:var(--ti-ink);}
.hlab-tm2-tab.hlab-is-on{background:var(--ti-soft);color:var(--ti-ink);border-color:var(--ti-ink);}
.hlab-tm2-arrow:hover{background:var(--ti-accent);color:rgb(255,255,255);border-color:var(--ti-accent);}
.hlab-tm2-panel.hlab-is-on{display:block;}
.hlab-tm2-card.hlab-is-open{cursor:default;flex-grow:2;min-width:clamp(560px,44vw,760px);}
@media (max-width:860px){.hlab-tm2-card.hlab-is-open{flex-grow:1;min-width:0px;}}
.hlab-tm2-card:not(.hlab-is-open):hover{opacity:0.92;}
.hlab-tm2-card.hlab-is-open .hlab-tm2-body{opacity:1;transform:none;max-height:440px;}
.hlab-tm2-card[data-tone="teal"]{background:linear-gradient(160deg,var(--ti-accent-2),var(--ti-accent) 60%,#1b6f78);color:rgb(255,255,255);background-image:linear-gradient(160deg,rgba(46,144,153,0.82),rgba(13,20,31,0.9)),url("/uploads/rPHM_DTTEDVkPeEkP-gQ1-pexels-photo-8867198-w1600.webp");background-position-x:initial,center;background-position-y:initial,center;background-size:initial,cover;background-repeat:initial,no-repeat;background-attachment:initial,initial;background-origin:initial,initial;background-clip:initial,initial;background-color:initial;}
.hlab-tm2-card[data-tone="navy"]{color:rgb(234,246,247);background-image:linear-gradient(160deg,rgba(27,42,56,0.86),rgba(13,20,31,0.92)),url("/uploads/mN_T8F8geLrTdaibOyYGd-pexels-photo-7658410-w1600.webp");background-position-x:initial,center;background-position-y:initial,center;background-size:initial,cover;background-repeat:initial,no-repeat;background-attachment:initial,initial;background-origin:initial,initial;background-clip:initial,initial;background-color:initial;}
.hlab-tm2-card[data-tone="steel"]{color:rgb(234,246,247);background-image:linear-gradient(160deg,rgba(67,97,122,0.82),rgba(13,20,31,0.9)),url("/uploads/xj7hQX3FreL2RIn1pdZak-pexels-photo-2422294-w1600.webp");background-position-x:initial,center;background-position-y:initial,center;background-size:initial,cover;background-repeat:initial,no-repeat;background-attachment:initial,initial;background-origin:initial,initial;background-clip:initial,initial;background-color:initial;}
.hlab-tm2-card[data-tone="grey"]{color:rgb(255,255,255);background-image:linear-gradient(160deg,rgba(34,128,138,0.78),rgba(27,42,56,0.9)),url("/uploads/HAh-jcweZcEjb13J-1mDm-pexels-photo-7580709-w1600.webp");background-position-x:initial,center;background-position-y:initial,center;background-size:initial,cover;background-repeat:initial,no-repeat;background-attachment:initial,initial;background-origin:initial,initial;background-clip:initial,initial;background-color:initial;}
.hlab-tm2-card[data-tone="grey"] .hlab-tm2-eyebrow{color:rgb(255,255,255);opacity:0.8;}
.hlab-tm2-card[data-tone="grey"] .hlab-tm2-body{color:rgba(255,255,255,0.85);}
.hlab-tm2-cards::-webkit-scrollbar{display:none;}
.hlab-ti-sticky-vid{width:100%;height:100%;object-fit:cover;display:block;}
.hlab-ti-cards3 .hlab-ti-card:nth-child(1) .hlab-ti-card-media{background-image:url("/uploads/4gq-rOQF5AndIojAB1c9d-pexels-photo-8867405.avif");background-position-x:center;background-position-y:center;background-size:cover;background-repeat:no-repeat;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:initial;}
.hlab-ti-cards3 .hlab-ti-card:nth-child(2) .hlab-ti-card-media{background-image:url("/uploads/xvhtN9gd5t9MBahfrowG3-pexels-photo-7688174.avif");background-position-x:center;background-position-y:center;background-size:cover;background-repeat:no-repeat;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:initial;}
.hlab-ti-cards3 .hlab-ti-card:nth-child(3) .hlab-ti-card-media{background-image:url("/uploads/ne5vv16gDDFpJOhMuG9Rw-pexels-photo-7658250.avif");background-position-x:center;background-position-y:center;background-size:cover;background-repeat:no-repeat;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:initial;}
.hlab-ti-cards3 .hlab-ti-card:first-child .hlab-ti-card-media{background-image:url("/uploads/4gq-rOQF5AndIojAB1c9d-pexels-photo-8867405.avif");background-position-x:center;background-position-y:center;background-size:cover;background-repeat:no-repeat;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:initial;}
.hlab-ti-costing .hlab-ti-h2{color:var(--ti-ink);}
.hlab-ti-costing .hlab-ti-eyebrow{color:#17656d;}
.hlab-ti-sec.hlab-ti-costing{color:var(--ti-ink);background:var(--ti-bg) !important;}
.hlab-ti-sec.hlab-ti-costing .hlab-ti-h2{color:var(--ti-ink) !important;}
.hlab-ti-sec.hlab-ti-costing .hlab-ti-eyebrow{color:#17656d !important;}
.hlab-ti-panel-row span:last-child{font-variant-numeric:tabular-nums;white-space-collapse:collapse;text-wrap-mode:nowrap;}
.hlab-ti-slider-top b{font-variant-numeric:tabular-nums;white-space-collapse:collapse;text-wrap-mode:nowrap;}
.hlab-spm-sr{position:absolute;width:1px;height:1px;padding:0px;margin:-1px;overflow-x:hidden;overflow-y:hidden;clip:rect(0px,0px,0px,0px);white-space-collapse:collapse;text-wrap-mode:nowrap;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:none;border-top-color:currentcolor;border-right-color:currentcolor;border-bottom-color:currentcolor;border-left-color:currentcolor;border-image-source:none;border-image-slice:100%;border-image-width:1;border-image-outset:0;border-image-repeat:stretch;}
.hlab-ti-root .hlab-ti-eyebrow{color:rgb(23,101,109);}
.hlab-spm-logostrip-eyebrow{display:block;margin-bottom:clamp(40px,6vh,72px);}
.hlab-spm-logo-ph{height:58px;border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgba(13,20,31,0.05);display:grid;align-items:center;justify-items:center;color:var(--ti-muted);font-size:12px;letter-spacing:0.14em;text-transform:uppercase;}
.hlab-spm-logos-grid{display:grid;row-gap:18px;align-items:center;margin:0px auto;grid-template-columns:repeat(3,1fr);max-width:780px;column-gap:32px;}
@media (max-width:900px){.hlab-spm-logos-grid{grid-template-columns:repeat(3,1fr);}}
@media (max-width:480px){.hlab-spm-logos-grid{grid-template-columns:repeat(2,1fr);}}
.hlab-spm-logostrip{text-align:center;padding-top:clamp(64px,13vh,150px);padding-bottom:clamp(48px,9vh,110px);background-image:linear-gradient(rgba(13,20,31,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(13,20,31,0.05) 1px,transparent 1px),initial;background-position-x:center,center,initial;background-position-y:center,center,initial;background-size:46px 46px,46px 46px,initial;background-repeat:initial,initial,initial;background-attachment:initial,initial,initial;background-origin:initial,initial,initial;background-clip:initial,initial,initial;background-color:rgb(255,255,255);}
.hlab-ti-cards3 .hlab-ti-card{text-align:left;}
.hlab-ti-cards3 .hlab-ti-card-eyebrow{font-size:12px;letter-spacing:0.16em;text-transform:uppercase;color:var(--ti-muted);margin:0px 0px 12px;}
.hlab-ti-cards3 .hlab-ti-card-title{font-size:clamp(21px,2.1vw,27px);font-weight:600;letter-spacing:-0.02em;line-height:1.16;margin:0px 0px 12px;color:var(--ti-ink);}
.hlab-ti-cards3 .hlab-ti-card-text{font-size:15px;line-height:1.6;color:var(--ti-muted);margin:0px 0px 18px;}
.hlab-ti-cards3 .hlab-ti-card-media{margin:0px 0px 16px;aspect-ratio:16 / 10;border-top-left-radius:14px;border-top-right-radius:14px;border-bottom-right-radius:14px;border-bottom-left-radius:14px;}
.hlab-ti-cards3 .hlab-ti-card-cta{align-self:stretch;width:100%;justify-content:center;margin-top:4px;background:var(--ti-soft);border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;color:var(--ti-ink);font-size:11.5px;letter-spacing:0.14em;text-transform:uppercase;font-weight:600;padding:14px 20px;}
.hlab-ti-cards3 .hlab-ti-card-cta:hover{background:var(--ti-ink);color:rgb(255,255,255);}
.hlab-ti-feature-list .hlab-ti-feature{padding:clamp(39px,7.8vh,83px) 0;}
.hlab-ti-cards3 .hlab-ti-card .hlab-ti-card-cta{align-self:stretch !important;width:100% !important;}
.hlab-spm-review-bg{position:absolute;top:0px;right:0px;bottom:0px;left:0px;width:100%;height:100%;transform:none;background-image:url("/uploads/X3ObViKsl2sFaezSuMz6m-Untitled_design_-_2026-09-18T162157_498-w1600.webp");background-position-x:center;background-position-y:center;background-size:cover;background-repeat:no-repeat;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(13,20,31);}
.hlab-spm-review-quote{color:rgb(255,255,255);text-shadow:rgba(0,0,0,0.5) 0px 2px 34px;font-size:clamp(28px,3vw,46px);line-height:1.26;font-weight:400;letter-spacing:-0.015em;margin:0px auto;max-width:680px;text-align:center;text-wrap-mode:initial;text-wrap-style:balance;}
@media (max-width:900px){.hlab-spm-review-quote{max-width:22ch;}}
.hlab-spm-review-name{font-size:16px;color:rgb(255,255,255);letter-spacing:0.02em;text-shadow:rgba(0,0,0,0.5) 0px 1px 16px;font-weight:600;}
.hlab-spm-review-role{font-size:12px;color:rgba(255,255,255,0.82);letter-spacing:0.14em;text-transform:uppercase;text-shadow:rgba(0,0,0,0.5) 0px 1px 16px;}
.hlab-spm-review-author{margin-top:clamp(24px,4vh,42px);row-gap:6px;column-gap:6px;display:flex;flex-direction:column;align-items:center;text-align:center;}
.hlab-spm-review-inner{position:relative;z-index:3;width:100%;max-width:1100px;margin:0px auto;padding:0 clamp(20px,5vw,64px);color:rgb(255,255,255);will-change:transform;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.hlab-spm-review{background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(255,255,255);min-height:0px;padding:clamp(18px,4vh,44px) clamp(12px,3vw,44px);}
.hlab-spm-lead-title{text-align:center;max-width:20ch;margin:0px auto;}
.hlab-spm-lead-sub{margin:0px;max-width:42ch;font-size:clamp(16px,1.4vw,19px);}
.hlab-spm-lead-list{list-style-position:initial;list-style-image:initial;list-style-type:none;margin:30px 0px 0px;padding:6px 0px 6px 22px;border-left:2px solid var(--ti-accent-2);display:flex;flex-direction:column;row-gap:18px;column-gap:18px;}
.hlab-spm-lead-trust{margin:clamp(44px,6vh,60px) 0px 0px;font-size:14px;color:var(--ti-muted);text-transform:none;letter-spacing:0px;}
.hlab-spm-lead-grid{margin-top:clamp(40px,7vh,90px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,90px);align-items:start;text-align:left;}
@media (max-width:900px){.hlab-spm-lead-grid{grid-template-columns:1fr;}}
.hlab-spm-lead{background:var(--ti-bg);background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(255,255,255);}
.hlab-spm-review-frame{position:relative;height:90vh;margin:0px auto;border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;overflow-x:hidden;overflow-y:hidden;isolation:isolate;display:flex;align-items:center;justify-content:center;box-shadow:none;width:100%;}
.hlab-spm-review-scale{position:absolute;top:0px;right:0px;bottom:0px;left:0px;z-index:0;transform:none;}
.hlab-spm-review-frame::before{content:"";position:absolute;top:0px;right:0px;bottom:0px;left:0px;z-index:1;background-image:radial-gradient(120% 85% at 50% 44%,rgba(13,20,31,0.55) 0%,rgba(13,20,31,0.18) 52%,rgba(13,20,31,0.04) 80%);background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:initial;pointer-events:none;}
.hlab-spm-review-frame::after{bottom:-66px;}
.hlab-spm-lead-list > *{position:relative;padding-left:20px;font-size:17px;line-height:1.3;color:var(--ti-ink);}
.hlab-spm-lead-list > ::before{content:"";position:absolute;left:0px;top:0.5em;width:8px;height:8px;border-top-left-radius:50%;border-top-right-radius:50%;border-bottom-right-radius:50%;border-bottom-left-radius:50%;background:var(--ti-accent-2);}
.hlab-spm-lead-logos{margin:18px 0px 0px;display:flex;flex-wrap:wrap;align-items:center;row-gap:14px;column-gap:22px;opacity:0.72;}
.hlab-spm-lead-logo{height:30px;min-width:68px;padding:0px 12px;display:grid;align-items:center;justify-items:center;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgba(13,20,31,0.05);border-top-left-radius:6px;border-top-right-radius:6px;border-bottom-right-radius:6px;border-bottom-left-radius:6px;color:var(--ti-muted);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;}
.hlab-spm-lead-form{background-image:radial-gradient(140% 130% at 12% 0%,rgb(34,128,138) 0%,rgb(27,42,56) 42%,rgb(13,20,31) 100%);background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:initial;border-top-width:1px;border-right-width:1px;border-bottom-width:1px;border-left-width:1px;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-color:rgba(255,255,255,0.1);border-right-color:rgba(255,255,255,0.1);border-bottom-color:rgba(255,255,255,0.1);border-left-color:rgba(255,255,255,0.1);border-image-source:none;border-image-slice:100%;border-image-width:1;border-image-outset:0;border-image-repeat:stretch;border-top-left-radius:22px;border-top-right-radius:22px;border-bottom-right-radius:22px;border-bottom-left-radius:22px;padding:clamp(26px,3vw,46px);display:grid;grid-template-columns:1fr 1fr;row-gap:24px;column-gap:22px;box-shadow:rgba(13,20,31,0.6) 0px 34px 70px -30px;}
@media (max-width:900px){.hlab-spm-lead-form{grid-template-columns:1fr;}}
.hlab-spm-field{display:flex;flex-direction:column;row-gap:8px;column-gap:8px;}
.hlab-spm-field--full{grid-column-start:1;grid-column-end:-1;}
.hlab-spm-field label{font-size:12.5px;letter-spacing:0.02em;text-transform:none;font-weight:600;color:rgba(234,246,247,0.9);}
.hlab-spm-field input,.hlab-spm-field select{font-style:inherit;font-variant-ligatures:inherit;font-variant-caps:inherit;font-variant-numeric:inherit;font-variant-east-asian:inherit;font-variant-alternates:inherit;font-variant-position:inherit;font-variant-emoji:inherit;font-weight:inherit;font-stretch:inherit;line-height:inherit;font-family:inherit;font-optical-sizing:inherit;font-size-adjust:inherit;font-kerning:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-language-override:inherit;font-size:15px;padding:8px 2px;border-top-width:0px;border-right-width:0px;border-left-width:0px;border-top-style:none;border-right-style:none;border-left-style:none;border-top-color:currentcolor;border-right-color:currentcolor;border-left-color:currentcolor;border-image-source:none;border-image-slice:100%;border-image-width:1;border-image-outset:0;border-image-repeat:stretch;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:rgba(255,255,255,0.28);border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:transparent;color:rgb(255,255,255);width:100%;}
.hlab-spm-field input::placeholder{color:rgba(234,246,247,0.42);}
.hlab-spm-field select{color:rgb(255,255,255);}
.hlab-spm-field select option{color:rgb(13,20,31);}
.hlab-spm-field input:focus,.hlab-spm-field select:focus{outline-color:initial;outline-style:none;outline-width:initial;border-bottom-color:var(--ti-accent-2);}
.hlab-spm-lead-submit{grid-column-start:1;grid-column-end:-1;width:100%;justify-content:center;margin-top:12px;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgba(255,255,255,0.1);border-top-width:1px;border-right-width:1px;border-bottom-width:1px;border-left-width:1px;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-color:rgba(255,255,255,0.18);border-right-color:rgba(255,255,255,0.18);border-bottom-color:rgba(255,255,255,0.18);border-left-color:rgba(255,255,255,0.18);border-image-source:none;border-image-slice:100%;border-image-width:1;border-image-outset:0;border-image-repeat:stretch;color:rgb(255,255,255);letter-spacing:0.16em;}
.hlab-spm-lead-submit:hover{background:var(--ti-accent);border-color:var(--ti-accent);color:rgb(255,255,255);}
.hlab-spm-lead-legal{grid-column-start:1;grid-column-end:-1;font-size:12px;line-height:1.5;color:rgba(234,246,247,0.6);margin:2px 0px 0px;}
.hlab-spm-lead-done{grid-column-start:1;grid-column-end:-1;text-align:center;padding:26px 8px;}
.hlab-spm-lead-done h3{font-size:22px;font-weight:600;color:rgb(255,255,255);margin:0px 0px 8px;}
.hlab-spm-lead-done p{font-size:15px;color:rgba(234,246,247,0.75);margin:0px;}
.hlab-spm-clogo-grid{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(26px,4vw,60px);}
.hlab-spm-clogo{display:inline-flex;align-items:center;color:var(--ti-ink);opacity:0.5;transition-behavior:normal,normal;transition-duration:0.25s,0.25s;transition-timing-function:ease,ease;transition-delay:0s,0s;transition-property:opacity,transform;row-gap:13px;column-gap:13px;}
.hlab-spm-clogo:hover{opacity:1;transform:translateY(-1px);}
.hlab-spm-clogo-ic{flex-grow:0;flex-shrink:0;flex-basis:auto;width:39px;height:39px;}
.hlab-spm-clogo-name{font-weight:700;letter-spacing:0.01em;font-size:26px;}
.hlab-spm-lead-logos.hlab-spm-clogo-grid{justify-content:flex-start;row-gap:18px;column-gap:30px;}
.hlab-spm-lead-logos .hlab-spm-clogo-ic{width:30px;height:30px;}
.hlab-spm-lead-logos .hlab-spm-clogo-name{font-size:21px;}
.hlab-sf-tab{font-weight:600;}
.hlab-ti-btn:hover{transform:translateY(-1px);}
.hlab-ti-btn:focus-visible{outline-color:rgba(34,128,138,0.6);outline-style:solid;outline-width:2px;outline-offset:3px;}
.hlab-tm2-cta:focus-visible{outline-color:rgba(34,128,138,0.6);outline-style:solid;outline-width:2px;outline-offset:3px;}
.hlab-sf-tab:focus-visible{outline-color:rgba(34,128,138,0.6);outline-style:solid;outline-width:2px;outline-offset:3px;}
.hlab-tm2-tab:focus-visible{outline-color:rgba(34,128,138,0.6);outline-style:solid;outline-width:2px;outline-offset:3px;}
.hlab-tm2-arrow:focus-visible{outline-color:rgba(34,128,138,0.6);outline-style:solid;outline-width:2px;outline-offset:3px;}
.hlab-spm-lead-submit:focus-visible{outline-color:rgba(34,128,138,0.6);outline-style:solid;outline-width:2px;outline-offset:3px;}
.hlab-ti-cards3 .hlab-ti-card-cta:focus-visible{outline-color:rgba(34,128,138,0.6);outline-style:solid;outline-width:2px;outline-offset:3px;}
.hlab-spmf2-logo{display:block;object-fit:contain;width:212px;height:116px;}
.hlab-spmf2-h{margin:0px;max-width:15ch;font-size:clamp(29px,3.1vw,45px);line-height:1.04;letter-spacing:-0.02em;font-weight:600;text-wrap-mode:initial;text-wrap-style:balance;}
@media (max-width:1080px){.hlab-spmf2-h{max-width:22ch;}}
@media (max-width:600px){.hlab-spmf2-h{line-height:1.1;}}
.hlab-spmf2-brand{display:flex;flex-direction:column;justify-content:space-between;padding:4px 0px;gap:clamp(36px,5vw,72px);min-height:392px;}
@media (max-width:1080px){.hlab-spmf2-brand{grid-column-start:1;grid-column-end:-1;min-height:auto;flex-direction:row;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;row-gap:24px;column-gap:24px;}}
@media (max-width:720px){.hlab-spmf2-brand{flex-direction:column;align-items:flex-start;row-gap:26px;column-gap:26px;}}
.hlab-spmf2-tile{display:flex;align-items:center;background:var(--f-tile);border:1px solid var(--f-line);border-top-left-radius:14px;border-top-right-radius:14px;border-bottom-right-radius:14px;border-bottom-left-radius:14px;color:var(--f-ink);font-size:16px;font-weight:500;letter-spacing:-0.01em;text-decoration-line:none;text-decoration-thickness:initial;text-decoration-style:initial;text-decoration-color:initial;transition:background .3s var(--f-ease),border-color .3s var(--f-ease),transform .3s var(--f-ease);min-height:clamp(60px,5vw,76px);padding:0px 26px;}
.hlab-spmf2-links{display:grid;grid-template-columns:1fr 1fr;row-gap:14px;column-gap:14px;}
.hlab-spmf2-demo-ic{display:grid;align-items:center;justify-items:center;width:44px;height:44px;background:var(--f-teal);color:rgb(255,255,255);border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px;font-size:18px;}
.hlab-spmf2-demo{display:flex;align-items:center;justify-content:space-between;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(255,255,255);color:rgb(13,20,31);border-top-left-radius:14px;border-top-right-radius:14px;border-bottom-right-radius:14px;border-bottom-left-radius:14px;font-size:15px;font-weight:600;letter-spacing:0.02em;text-decoration-line:none;text-decoration-thickness:initial;text-decoration-style:initial;text-decoration-color:initial;transition:transform .3s var(--f-ease),box-shadow .3s var(--f-ease);min-height:clamp(62px,5.2vw,78px);padding:0px 12px 0px 28px;}
.hlab-spmf2-mid{display:flex;flex-direction:column;gap:clamp(12px,1.3vw,16px);row-gap:16px;column-gap:16px;}
.hlab-spmf2-mail-mount{flex-grow:1;flex-shrink:1;flex-basis:0%;display:flex;}
.hlab-spmf2-mail-btn{flex-grow:0;flex-shrink:0;flex-basis:auto;display:grid;align-items:center;justify-items:center;width:52px;height:52px;background:var(--f-teal);color:rgb(255,255,255);border-top-width:medium;border-right-width:medium;border-bottom-width:medium;border-left-width:medium;border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:none;border-top-color:currentcolor;border-right-color:currentcolor;border-bottom-color:currentcolor;border-left-color:currentcolor;border-image-source:none;border-image-slice:100%;border-image-width:1;border-image-outset:0;border-image-repeat:stretch;border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-right-radius:12px;border-bottom-left-radius:12px;font-size:18px;text-decoration-line:none;text-decoration-thickness:initial;text-decoration-style:initial;text-decoration-color:initial;cursor:pointer;transition:transform .3s var(--f-ease),filter .3s var(--f-ease);}
.hlab-spmf2-mail-row{display:flex;row-gap:10px;column-gap:10px;align-items:stretch;}
.hlab-spmf2-fine{margin:12px 0px 0px;font-size:12.5px;line-height:1.5;color:var(--f-mut);}
.hlab-spmf2-news-lead{margin:0px;max-width:22ch;font-size:clamp(20px,1.9vw,27px);line-height:1.22;letter-spacing:-0.015em;font-weight:500;text-wrap-mode:initial;text-wrap-style:balance;}
.hlab-spmf2-news{display:flex;flex-direction:column;justify-content:space-between;background:var(--f-tile);border:1px solid var(--f-line);border-top-left-radius:18px;border-top-right-radius:18px;border-bottom-right-radius:18px;border-bottom-left-radius:18px;row-gap:34px;column-gap:34px;padding:clamp(28px,2.6vw,40px);}
.hlab-spmf2-grid{display:grid;align-items:stretch;grid-template-columns:1.02fr 1.16fr 1.16fr;gap:clamp(32px,3.8vw,76px);}
@media (max-width:1080px){.hlab-spmf2-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:720px){.hlab-spmf2-grid{grid-template-columns:1fr;row-gap:22px;column-gap:22px;}}
.hlab-spmf2-soc{display:grid;align-items:center;justify-items:center;width:22px;height:22px;background-image:none;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:initial;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:none;border-top-color:currentcolor;border-right-color:currentcolor;border-bottom-color:currentcolor;border-left-color:currentcolor;border-image-source:none;border-image-slice:100%;border-image-width:1;border-image-outset:0;border-image-repeat:stretch;border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;color:var(--f-mut);transition:color .3s var(--f-ease),transform .3s var(--f-ease);}
.hlab-spmf2-legal-link{color:var(--f-mut);text-decoration-line:none;text-decoration-thickness:initial;text-decoration-style:initial;text-decoration-color:initial;transition:color .3s var(--f-ease);}
.hlab-spmf2-legal-left{display:flex;align-items:center;row-gap:16px;column-gap:16px;flex-grow:1;flex-shrink:1;flex-basis:0%;min-width:0px;}
.hlab-spmf2-legal-center{flex-grow:0;flex-shrink:0;flex-basis:auto;text-align:center;}
@media (max-width:720px){.hlab-spmf2-legal-center{flex-grow:0;flex-shrink:0;flex-basis:auto;text-align:left;}}
.hlab-spmf2-legal-right{flex-grow:1;flex-shrink:1;flex-basis:0%;text-align:right;font-size:11px;letter-spacing:0.14em;}
@media (max-width:720px){.hlab-spmf2-legal-right{flex-grow:0;flex-shrink:0;flex-basis:auto;text-align:left;}}
.hlab-spmf2-legal{display:flex;align-items:center;row-gap:20px;column-gap:20px;border-top:1px solid var(--f-line);font-size:13px;color:var(--f-mut);margin-top:clamp(52px,5vw,84px);padding-top:26px;}
@media (max-width:720px){.hlab-spmf2-legal{flex-direction:column;align-items:flex-start;row-gap:14px;column-gap:14px;}}
.hlab-spmf2-badge{flex-grow:0;flex-shrink:0;flex-basis:auto;display:grid;align-items:center;justify-items:center;width:30px;height:30px;border-top-left-radius:50%;border-top-right-radius:50%;border-bottom-right-radius:50%;border-bottom-left-radius:50%;background:var(--f-teal);color:rgb(13,20,31);}
.hlab-spmf2-wrap{position:relative;margin:0px auto;max-width:1560px;padding:clamp(64px,7vw,116px) clamp(30px,4.4vw,72px) clamp(36px,3vw,52px);}
.hlab-spmf2{--f-tile:rgba(255,255,255,.035);--f-tile-h:rgba(255,255,255,.075);--f-line:rgba(255,255,255,.10);--f-line-h:rgba(255,255,255,.20);--f-ink:#f4f7f9;--f-mut:rgba(244,247,249,.56);--f-teal:#22808a;--f-ease:cubic-bezier(.16,1,.3,1);position:relative;overflow-x:hidden;overflow-y:hidden;background:var(--f-bg);color:var(--f-ink);font-family:inherit;--f-bg:#0d141f;border-radius:clamp(22px,2.4vw,36px);}
.hlab-spmf2-tile:hover{background:var(--f-tile-h);border-color:var(--f-line-h);transform:translateY(-2px);}
.hlab-spmf2-demo:hover{transform:translateY(-2px);box-shadow:rgba(0,0,0,0.28) 0px 14px 30px;}
.hlab-spmf2-mail-input{width:100%;height:52px;padding:0px 18px;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgba(0,0,0,0.2);border:1px solid var(--f-line);border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-right-radius:12px;border-bottom-left-radius:12px;color:var(--f-ink);font-size:15px;font-family:inherit;outline-color:initial;outline-style:none;outline-width:initial;transition:border-color .3s var(--f-ease);}
.hlab-spmf2-mail-input::placeholder{color:var(--f-mut);}
.hlab-spmf2-mail-input:focus{border-color:var(--f-teal);}
.hlab-spmf2-mail-btn:hover{transform:translateY(-1px);filter:brightness(1.09);}
.hlab-spmf2-mail-done{font-size:15px;font-weight:500;color:var(--f-ink);}
.hlab-spmf2-soc:hover{color:var(--f-ink);transform:translateY(-1px);}
.hlab-spmf2-soc svg{width:19px;height:19px;fill:currentcolor;}
.hlab-spmf2-legal-link:hover{color:var(--f-ink);}
.hlab-spmf2-badge svg{width:17px;height:17px;}
.hlab-spm-lead-title .hlab-ti-word{display:inline-block;}
.hlab-spm-lead-title .hlab-ti-char{color:rgb(13,20,31);}
@media (prefers-reduced-motion:reduce){.hlab-spm-lead-title .hlab-ti-char{color:rgb(13,20,31) !important;animation-duration:auto !important;animation-timing-function:ease !important;animation-delay:0s !important;animation-iteration-count:1 !important;animation-direction:normal !important;animation-fill-mode:none !important;animation-play-state:running !important;animation-name:none !important;animation-timeline:auto !important;animation-range-start:normal !important;animation-range-end:normal !important;}}
.hlab-spm-lead-title.hlab-ti-in .hlab-ti-char{animation:tiCharSweep .5s ease-out var(--v-delay,0s) both;}
.hlab-spmf2-socs{display:flex;align-items:center;row-gap:15px;column-gap:15px;}
.hlab-ti-anim .hlab-spm-lead-title.hlab-ti-reveal{opacity:1;transform:none;}
html:has([class*="hlab-"]),body:has([class*="hlab-"]){margin:0;background:#0d141f;}
.hlab-ti-root,.hlab-ti-root *,.hlab-ti-root *::before,.hlab-ti-root *::after{box-sizing:border-box;}
.hlab-ti-root h1,.hlab-ti-root h2,.hlab-ti-root h3,.hlab-ti-root h4,.hlab-ti-root h5,.hlab-ti-root p,.hlab-ti-root figure{margin:0;}
.hlab-ti-root{--ti-bg:#ffffff;--ti-surface:#ffffff;--ti-soft:#f4f5f7;--ti-bg-1:#fcfdfd;--ti-bg-2:#f7f9f9;--ti-ink:#0d141f;--ti-muted:#43617a;--ti-line:rgba(13,20,31,.08);--ti-hair:rgba(13,20,31,.06);--ti-accent:#22808a;--ti-accent-2:#3aa3ad;--ti-navy-a:#2e9099;--ti-navy-b:#1b2a38;--ti-navy-c:#0d141f;--ti-radius:16px;--ti-r-sm:10px;--ti-r-md:16px;--ti-r-lg:22px;--ti-ease:cubic-bezier(.16,1,.3,1);--ti-shadow-sm:0 1px 2px rgba(13,20,31,.04),0 1px 1px rgba(13,20,31,.03);--ti-shadow-md:0 1px 2px rgba(13,20,31,.03),0 10px 34px -12px rgba(13,20,31,.10);--ti-shadow-lift:0 2px 4px rgba(13,20,31,.04),0 22px 48px -20px rgba(13,20,31,.16);--ti-ink-2:rgba(13,20,31,.62);--ti-ink-3:rgba(13,20,31,.42);--ti-space-2xs:8px;--ti-space-xs:12px;--ti-space-sm:16px;--ti-space-md:24px;--ti-space-lg:32px;--ti-space-xl:48px;--ti-space-2xl:64px;--ti-space-3xl:96px;--ti-space-4xl:128px;--ti-noise:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='140'%20height='140'%3E%3Cfilter%20id='n'%3E%3CfeTurbulence%20type='fractalNoise'%20baseFrequency='0.8'%20numOctaves='2'%20stitchTiles='stitch'/%3E%3CfeColorMatrix%20type='saturate'%20values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA%20type='linear'%20slope='0.05'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect%20width='100%25'%20height='100%25'%20filter='url(%23n)'/%3E%3C/svg%3E");position:relative;z-index:2;background:var(--ti-bg);color:var(--ti-ink);font-family:var(--font-body),'Bricolage Grotesque',system-ui,sans-serif;}
.hlab-ti-sec{padding:clamp(52px,8vh,104px) clamp(20px,5vw,80px);}
.hlab-ti-wrap{max-width:1200px;margin:0 auto;}
.hlab-ti-eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#17656d;}
.hlab-ti-h2{font-size:clamp(30px,4.6vw,60px);font-weight:600;line-height:1.02;letter-spacing:-.025em;margin:0;color:var(--ti-ink);text-wrap:balance;}
.hlab-ti-lead{font-size:clamp(16px,1.4vw,19px);line-height:1.6;color:var(--ti-muted);text-wrap:pretty;}
.hlab-ti-reveal{will-change:transform,opacity,filter;}
.hlab-ti-anim .hlab-ti-reveal{opacity:0;transform:translateY(26px);filter:blur(6px);}
.hlab-ti-anim .hlab-ti-reveal.hlab-ti-in{opacity:1;transform:none;filter:blur(0);transition:opacity .5s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1),filter .7s cubic-bezier(.16,1,.3,1);}
.hlab-ti-powering{text-align:center;background:linear-gradient(rgba(13,20,31,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(13,20,31,.05) 1px,transparent 1px),var(--ti-bg);background-size:46px 46px,46px 46px,auto;background-position:center;}
.hlab-ti-powering .hlab-ti-eyebrow{margin-bottom:var(--ti-space-md);}
.hlab-ti-powering .hlab-ti-h2{max-width:16ch;margin:0 auto;}
.hlab-ti-fix{text-align:center;background:var(--ti-bg);}
.hlab-ti-fix .hlab-ti-h2{max-width:20ch;margin:0 auto;}
.hlab-ti-fix .hlab-ti-lead{max-width:52ch;margin:var(--ti-space-md) auto 0;}
.hlab-ti-cards3{margin-top:clamp(40px,6vh,72px);display:grid;grid-template-columns:repeat(3,1fr);gap:20px;text-align:left;}
.hlab-ti-card{display:flex;flex-direction:column;background:linear-gradient(180deg,#ffffff 0%,#fafbfc 100%);border:1px solid var(--ti-line);border-radius:var(--ti-r-md);padding:24px;box-shadow:var(--ti-shadow-sm),inset 0 1px 0 rgba(255,255,255,.7);transition:transform .4s var(--ti-ease),box-shadow .4s var(--ti-ease),border-color .4s var(--ti-ease);}
.hlab-ti-card:hover{transform:translateY(-3px);box-shadow:var(--ti-shadow-lift),inset 0 1px 0 rgba(255,255,255,.85);border-color:rgba(34,128,138,.28);}
.hlab-ti-card-media{margin:18px 0;aspect-ratio:4 / 3;border-radius:var(--ti-r-sm);background:linear-gradient(135deg,#eaecef,#dadde0);border:1px solid var(--ti-line);}
.hlab-ti-card-title{font-size:19px;font-weight:600;line-height:1.25;margin:0 0 16px;letter-spacing:-.01em;color:var(--ti-ink);}
.hlab-ti-card-text{font-size:14px;line-height:1.6;color:var(--ti-muted);margin:0 0 var(--ti-space-md);}
.hlab-ti-btn{align-self:flex-start;margin-top:auto;display:inline-flex;align-items:center;gap:8px;border:1px solid var(--ti-ink);background:transparent;color:var(--ti-ink);border-radius:999px;padding:10px 20px;font-size:13px;font-weight:500;cursor:pointer;text-decoration:none;transition:background .25s var(--ti-ease),color .25s var(--ti-ease),border-color .25s var(--ti-ease),transform .2s var(--ti-ease);}
.hlab-ti-btn:hover{background:var(--ti-ink);color:#fff;transform:translateY(-1px);}
.hlab-ti-btn:focus-visible,.hlab-tm2-cta:focus-visible,.hlab-sf-tab:focus-visible,.hlab-tm2-tab:focus-visible,.hlab-tm2-arrow:focus-visible,.hlab-spm-lead-submit:focus-visible,.hlab-ti-cards3 .hlab-ti-card-cta:focus-visible{outline:2px solid rgba(34,128,138,.6);outline-offset:3px;}
.hlab-ti-btn--green{background:var(--ti-accent);border-color:var(--ti-accent);color:#ffffff;box-shadow:0 1px 2px rgba(13,20,31,.14),inset 0 1px 0 rgba(255,255,255,.20);transition:transform .2s var(--ti-ease),background .25s var(--ti-ease),border-color .25s var(--ti-ease),box-shadow .25s var(--ti-ease);}
.hlab-ti-btn--green:hover{background:var(--ti-navy-b);border-color:var(--ti-navy-b);color:#ffffff;transform:translateY(-1px);box-shadow:0 5px 16px rgba(13,20,31,.18),inset 0 1px 0 rgba(255,255,255,.20);}
.hlab-ti-cards3 .hlab-ti-card-cta{align-self:stretch;width:100%;justify-content:center;text-align:center;background:var(--ti-navy-c);border-color:var(--ti-navy-c);color:#fff;box-shadow:0 1px 2px rgba(13,20,31,.20),inset 0 1px 0 rgba(255,255,255,.10);transition:transform .2s var(--ti-ease),background .25s var(--ti-ease),border-color .25s var(--ti-ease),box-shadow .25s var(--ti-ease);}
.hlab-ti-cards3 .hlab-ti-card-cta:hover{background:var(--ti-navy-b);border-color:var(--ti-navy-b);color:#fff;transform:translateY(-1px);box-shadow:0 6px 18px rgba(13,20,31,.24),inset 0 1px 0 rgba(255,255,255,.12);}
.hlab-ti-costing{text-align:center;background:var(--ti-bg);}
.hlab-ti-costing .hlab-ti-h2{max-width:16ch;margin:0 auto;}
.hlab-ti-costing .hlab-ti-eyebrow{color:#17656d;}
.hlab-ti-calc{padding-top:0;background:var(--ti-bg);}
.hlab-ti-calc-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:var(--ti-space-lg);}
.hlab-ti-calc-head h3{font-size:clamp(22px,2.4vw,30px);font-weight:600;line-height:1.1;margin:0;letter-spacing:-.01em;color:var(--ti-ink);}
.hlab-ti-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.hlab-ti-field{display:flex;flex-direction:column;gap:8px;}
.hlab-ti-field label{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ti-muted);}
.hlab-ti-field input[type="number"]{font:inherit;font-size:16px;padding:12px 14px;border:1px solid var(--ti-line);border-radius:var(--ti-r-sm);background:#fafbfc;color:var(--ti-ink);}
.hlab-ti-field input:focus{outline:2px solid rgba(34,128,138,.4);outline-offset:1px;}
.hlab-ti-slider-row{margin-top:var(--ti-space-lg);}
.hlab-ti-slider-row .hlab-ti-slider-top{display:flex;justify-content:space-between;font-size:13px;color:var(--ti-muted);margin-bottom:10px;}
.hlab-ti-slider-row .hlab-ti-slider-top b{color:var(--ti-ink);font-weight:600;}
.hlab-ti-range{position:relative;width:100%;height:6px;border-radius:999px;background-color:#dfe2e5;cursor:pointer;margin-top:4px;touch-action:none;}
.hlab-ti-range-fill{position:absolute;left:0;top:0;bottom:0;width:46%;border-radius:999px;background:linear-gradient(90deg,var(--ti-accent-2),var(--ti-accent));pointer-events:none;}
.hlab-ti-range-thumb{position:absolute;top:50%;left:46%;width:22px;height:22px;border-radius:50%;background:var(--ti-accent);border:3px solid #fff;box-shadow:0 2px 6px rgba(13,20,31,.25);transform:translate(-50%,-50%);pointer-events:none;}
.hlab-ti-range:focus-visible{outline:2px solid rgba(34,128,138,.5);outline-offset:4px;}
.hlab-ti-calc-panel{margin-top:var(--ti-space-md);display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,4vw,60px);align-items:center;border-radius:var(--ti-radius);padding:clamp(26px,3.5vw,48px);color:#eaf6f7;background:radial-gradient(130% 130% at 10% 0%,var(--ti-navy-a) 0%,var(--ti-accent) 26%,var(--ti-navy-b) 66%,var(--ti-navy-c) 100%);}
.hlab-ti-panel-num-label{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:rgba(234,246,247,.72);}
.hlab-ti-panel-num{font-size:clamp(44px,6vw,78px);font-weight:600;letter-spacing:-.02em;line-height:1;margin:10px 0 8px;color:#ffffff;}
.hlab-ti-panel-sub{font-size:14px;color:rgba(234,246,247,.78);}
.hlab-ti-panel-rows{display:flex;flex-direction:column;gap:0;}
.hlab-ti-panel-row{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:14px;}
.hlab-ti-panel-row:last-of-type{border-bottom:0;}
.hlab-ti-panel-row span:last-child{font-weight:600;}
.hlab-ti-panel-cta{margin-top:var(--ti-space-md);width:100%;justify-content:center;}
.hlab-ti-calc-panel .hlab-ti-btn--green{background:#ffffff;border-color:#ffffff;color:var(--ti-navy-c);}
.hlab-ti-calc-panel .hlab-ti-btn--green:hover{background:var(--ti-accent-2);border-color:var(--ti-accent-2);color:#ffffff;}
.hlab-ti-intro{text-align:center;}
.hlab-ti-intro .hlab-ti-h2{max-width:18ch;margin:0 auto;}
.hlab-ti-intro .hlab-ti-lead{max-width:62ch;margin:var(--ti-space-md) auto 0;}
.hlab-ti-sticky-wrap{margin-top:clamp(48px,8vh,110px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);align-items:start;text-align:left;}
.hlab-ti-sticky-media{position:sticky;top:96px;aspect-ratio:3 / 4;border-radius:18px;background:linear-gradient(160deg,#6d93ad,#43617a 55%,#1b2a38);border:1px solid var(--ti-line);}
.hlab-ti-feature-list{display:flex;flex-direction:column;}
.hlab-ti-feature{padding:clamp(30px,6vh,64px) 0;border-top:1px solid var(--ti-line);}
.hlab-ti-feature:first-child{border-top:0;}
.hlab-ti-feature h4{font-size:clamp(22px,2.6vw,34px);font-weight:600;line-height:1.1;margin:0 0 var(--ti-space-sm);letter-spacing:-.01em;color:var(--ti-ink);text-wrap:balance;}
.hlab-ti-feature p{font-size:15px;line-height:1.65;color:var(--ti-muted);margin:0;}
.hlab-ti-feature.hlab-ti-fade{opacity:.32;transform:translateY(6px);transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1);}
.hlab-ti-feature.hlab-ti-fade.hlab-ti-active{opacity:1;transform:none;}
.hlab-ti-modular{text-align:center;overflow:hidden;}
.hlab-tm2-panels{margin-top:48px;}
.hlab-tm2-bar{margin:clamp(30px,5vh,52px) 0 0;}
.hlab-tm2-tabs{column-gap:12px;row-gap:12px;}
.hlab-tm2-tab{font-size:13px;letter-spacing:.18em;padding:12px 18px;border-radius:8px;border:.8px solid var(--ti-line);background:transparent;color:var(--ti-muted);transition:background-color .3s cubic-bezier(.39,.575,.565,1),color .3s cubic-bezier(.39,.575,.565,1),border-color .3s cubic-bezier(.39,.575,.565,1);}
.hlab-tm2-tab.hlab-is-on{background:rgba(13,20,31,.05);color:var(--ti-ink);border-color:transparent;}
.hlab-tm2-tab:hover{color:var(--ti-ink);}
.hlab-tm2-nav{column-gap:10px;}
.hlab-tm2-arrow{width:52px;height:52px;border-radius:8px;border:.8px solid var(--ti-line);background:rgba(13,20,31,.05);-webkit-backdrop-filter:blur(5.5px);backdrop-filter:blur(5.5px);color:var(--ti-ink);font-size:18px;transition:background .25s var(--ti-ease),color .25s var(--ti-ease),border-color .25s var(--ti-ease);}
.hlab-tm2-arrow:hover{background:var(--ti-accent);border-color:var(--ti-accent);color:#fff;}
.hlab-tm2-cards{column-gap:20px;}
.hlab-tm2-card{isolation:isolate;min-height:clamp(520px,64vh,700px);border-radius:20px;}
.hlab-tm2-card::before{content:"";position:absolute;inset:-6%;z-index:0;background-size:cover;background-position:center;filter:blur(16px) saturate(1.05);transform:scale(1.05);}
.hlab-tm2-card::after{content:"";position:absolute;inset:0;z-index:1;}
.hlab-tm2-card-inner{z-index:2;padding:clamp(24px,2vw,40px);}
.hlab-tm2-card[data-tone="teal"]{background:#1b6f78;}
.hlab-tm2-card[data-tone="teal"]::before{background-image:url("/uploads/rPHM_DTTEDVkPeEkP-gQ1-pexels-photo-8867198-w1600.webp");}
.hlab-tm2-card[data-tone="teal"]::after{background:linear-gradient(160deg,rgba(46,144,153,.82),rgba(13,20,31,.9));}
.hlab-tm2-card[data-tone="navy"]{background:#0d141f;}
.hlab-tm2-card[data-tone="navy"]::before{background-image:url("/uploads/mN_T8F8geLrTdaibOyYGd-pexels-photo-7658410-w1600.webp");}
.hlab-tm2-card[data-tone="navy"]::after{background:linear-gradient(160deg,rgba(27,42,56,.86),rgba(13,20,31,.92));}
.hlab-tm2-card[data-tone="steel"]{background:#43617a;}
.hlab-tm2-card[data-tone="steel"]::before{background-image:url("/uploads/xj7hQX3FreL2RIn1pdZak-pexels-photo-2422294-w1600.webp");}
.hlab-tm2-card[data-tone="steel"]::after{background:linear-gradient(160deg,rgba(67,97,122,.82),rgba(13,20,31,.9));}
.hlab-tm2-card[data-tone="grey"]{background:#1b2a38;}
.hlab-tm2-card[data-tone="grey"]::before{background-image:url("/uploads/HAh-jcweZcEjb13J-1mDm-pexels-photo-7580709-w1600.webp");}
.hlab-tm2-card[data-tone="grey"]::after{background:linear-gradient(160deg,rgba(34,128,138,.78),rgba(27,42,56,.9));}
.hlab-tm2-title{line-height:1.2;letter-spacing:-.01em;text-wrap:balance;}
.hlab-tm2-body{line-height:1.46;margin-top:28px;}
.hlab-tm2-cta{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:10px;padding:15px 26px;border-radius:10px;background:#f3f4f4;color:var(--ti-navy-c);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;white-space:nowrap;opacity:0;transform:translateY(10px);pointer-events:none;box-shadow:var(--ti-shadow-sm),inset 0 1px 0 rgba(255,255,255,.85);transition:opacity .5s var(--ti-ease) .06s,transform .5s var(--ti-ease) .06s,background .25s var(--ti-ease);}
.hlab-tm2-cta span{transition:transform .25s var(--ti-ease);}
.hlab-tm2-cta:hover{background:#fff;transform:translateY(-1px);}
.hlab-tm2-cta:hover span{transform:translateX(3px);}
.hlab-tm2-card.hlab-is-open .hlab-tm2-cta{opacity:1;transform:none;pointer-events:auto;}
@media (prefers-reduced-motion:reduce){.hlab-tm2-cta{transition:none;}.hlab-tm2-card::before{filter:none;}}
@media (max-width:860px){.hlab-tm2-card::before{inset:0;filter:blur(10px);transform:scale(1.04);}.hlab-tm2-cta{opacity:1;transform:none;pointer-events:auto;}}
.hlab-ti-modular .hlab-ti-h2{max-width:16ch;margin:0 auto;}
.hlab-ti-carousel-outer{margin-top:clamp(40px,6vh,72px);}
.hlab-ti-carousel{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 20px;scrollbar-width:none;cursor:grab;}
.hlab-ti-carousel::-webkit-scrollbar{display:none;}
.hlab-ti-carousel.hlab-ti-dragging{cursor:grabbing;scroll-snap-type:none;}
.hlab-ti-slide{flex:0 0 min(560px,82vw);scroll-snap-align:start;border-radius:var(--ti-r-lg);padding:clamp(24px,3vw,40px);min-height:420px;display:flex;flex-direction:column;justify-content:space-between;text-align:left;user-select:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 1px 2px rgba(13,20,31,.05),0 20px 44px -24px rgba(13,20,31,.30);}
.hlab-ti-slide h4{font-size:clamp(22px,2.4vw,30px);font-weight:600;line-height:1.15;margin:0 0 10px;letter-spacing:-.01em;}
.hlab-ti-slide p{font-size:14px;line-height:1.6;margin:0;opacity:.85;}
.hlab-ti-car-bar{height:100%;width:30%;background:var(--ti-accent);border-radius:999px;transition:width .2s ease,transform .2s ease;}
.hlab-ti-builtby{text-align:center;background:linear-gradient(rgba(13,20,31,.05) 1px,transparent 1px) center / 46px 46px,linear-gradient(90deg,rgba(13,20,31,.05) 1px,transparent 1px) center / 46px 46px,var(--ti-bg);}
.hlab-spm-logostrip{background:linear-gradient(rgba(13,20,31,.05) 1px,transparent 1px) center / 46px 46px,linear-gradient(90deg,rgba(13,20,31,.05) 1px,transparent 1px) center / 46px 46px,var(--ti-bg);}
.hlab-spm-logostrip .hlab-spm-logostrip-eyebrow{margin-bottom:clamp(40px,6vh,72px);}
.hlab-spm-logostrip .hlab-spm-logos-grid{display:grid;grid-template-columns:repeat(3,1fr);place-items:center;max-width:780px;column-gap:32px;row-gap:40px;margin-left:auto;margin-right:auto;}
@media (max-width:560px){.hlab-spm-logostrip .hlab-spm-logos-grid{grid-template-columns:repeat(2,1fr);}}
.hlab-ti-builtby .hlab-ti-h2{max-width:20ch;margin:0 auto;}
.hlab-ti-logos{margin:clamp(48px,7vh,80px) auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:22px 32px;align-items:center;max-width:780px;}
.hlab-ti-logo{height:46px;border-radius:8px;background:rgba(13,20,31,.04);display:grid;place-items:center;color:var(--ti-ink-3);font-size:12px;letter-spacing:.12em;text-transform:uppercase;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 0 0 1px rgba(13,20,31,.04);}
.hlab-ti-footer{display:block;padding:clamp(16px,1.8vw,30px);border-top:0;background:transparent;color:#f4f7f9;font-size:14px;}
@media (max-width:1024px){.hlab-ti-fields{grid-template-columns:repeat(2,1fr);}.hlab-ti-calc-panel{grid-template-columns:1fr;}.hlab-ti-sticky-wrap{grid-template-columns:1fr;}.hlab-ti-sticky-media{position:relative;top:0;order:-1;max-width:480px;}.hlab-ti-logos{grid-template-columns:repeat(3,1fr);}}
@media (max-width:720px){.hlab-ti-cards3{grid-template-columns:1fr;}.hlab-ti-fields{grid-template-columns:1fr;}.hlab-ti-slide{flex-basis:86vw;min-height:360px;}.hlab-ti-logos{grid-template-columns:repeat(2,1fr);}}
@media (prefers-reduced-motion:reduce){.hlab-ti-anim .hlab-ti-reveal{opacity:1 !important;transform:none !important;filter:none !important;}.hlab-ti-feature.hlab-ti-fade{opacity:1 !important;transform:none !important;}}
.hlab-spm-review{position:relative;background:#fff;min-height:0;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:0;}
.hlab-spm-review-frame{position:relative;width:100%;height:90vh;margin:0 auto;border-radius:0;overflow:hidden;isolation:isolate;display:flex;align-items:center;justify-content:center;}
.hlab-spm-review-scale{position:absolute;inset:0;z-index:0;transform:none;}
.hlab-spm-review-bg{position:absolute;inset:0;width:100%;height:100%;transform:none;background:#0d141f url('/uploads/X3ObViKsl2sFaezSuMz6m-Untitled_design_-_2026-09-18T162157_498-w1600.webp') center center / cover no-repeat;}
.hlab-spm-review-frame::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(120% 85% at 50% 44%,rgba(13,20,31,.55) 0%,rgba(13,20,31,.18) 52%,rgba(13,20,31,.04) 80%);pointer-events:none;}
.hlab-spm-review-frame::after{content:none;}
.hlab-spm-review-inner{position:relative;z-index:3;width:100%;max-width:1100px;margin:0 auto;padding:0 clamp(20px,5vw,64px);text-align:center;color:#fff;will-change:transform;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.hlab-spm-review-quote{font-size:clamp(28px,3vw,46px);line-height:1.26;font-weight:400;text-align:center;letter-spacing:-.015em;margin:0 auto;max-width:680px;color:#fff;text-shadow:0 2px 36px rgba(0,0,0,.5);text-wrap:balance;}
.hlab-spm-review-author{margin-top:clamp(24px,4vh,42px);display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;}
.hlab-spm-review-name{font-size:16px;font-weight:600;color:#fff;letter-spacing:.02em;text-shadow:0 1px 16px rgba(0,0,0,.5);}
.hlab-spm-review-role{font-size:12px;color:rgba(255,255,255,.82);letter-spacing:.14em;text-transform:uppercase;text-shadow:0 1px 16px rgba(0,0,0,.5);}
.hlab-spm-lead{background:var(--ti-bg);}
.hlab-spm-lead .hlab-spm-lead-title{text-align:center;max-width:24ch;margin-left:auto;margin-right:auto;}
.hlab-spm-lead-title .hlab-ti-word{display:inline-block;}
.hlab-spm-lead-title .hlab-ti-char{color:#0d141f;}
.hlab-spm-lead-title.hlab-ti-in .hlab-ti-char{animation:tiCharSweep .5s ease-out var(--v-delay,0s) both;}
.hlab-ti-anim .hlab-spm-lead-title.hlab-ti-reveal{opacity:1;transform:none;filter:none;}
@keyframes tiCharSweep{0%{color:#dddddd;}30%{color:#22808a;}100%{color:#0d141f;}}
@media (prefers-reduced-motion:reduce){.hlab-spm-lead-title .hlab-ti-char{color:#0d141f !important;animation:none !important;}}
.hlab-spm-lead-grid{margin-top:clamp(40px,7vh,90px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,90px);align-items:start;text-align:left;}
.hlab-spm-lead-sub{margin:0;max-width:42ch;font-size:clamp(16px,1.4vw,19px);}
.hlab-spm-lead-list{list-style:none;margin:var(--ti-space-lg) 0 0;padding:6px 0 6px 22px;border-left:2px solid var(--ti-accent-2);display:flex;flex-direction:column;gap:18px;}
.hlab-spm-lead-list > *{position:relative;padding-left:20px;font-size:17px;line-height:1.3;color:var(--ti-ink);}
.hlab-spm-lead-list > *::before{content:"";position:absolute;left:0;top:.5em;width:8px;height:8px;border-radius:50%;background:var(--ti-accent-2);}
.hlab-spm-lead-trust{margin:clamp(44px,6vh,60px) 0 0;font-size:14px;color:var(--ti-muted);}
.hlab-spm-lead .hlab-spm-lead-trust{margin-top:clamp(44px,6vh,60px);}
.hlab-spm-lead-logos{margin:18px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;opacity:.72;}
.hlab-spm-lead-logo{height:30px;min-width:68px;padding:0 12px;display:grid;place-items:center;background:rgba(13,20,31,.04);border-radius:6px;color:var(--ti-ink-3);font-size:11px;letter-spacing:.12em;text-transform:uppercase;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 0 0 1px rgba(13,20,31,.04);}
.hlab-spm-lead-form{background:radial-gradient(140% 130% at 12% 0%,#22808a 0%,#1b2a38 42%,#0d141f 100%);border:1px solid rgba(255,255,255,.10);border-radius:22px;padding:clamp(26px,3vw,46px);display:grid;grid-template-columns:1fr 1fr;gap:24px 22px;box-shadow:0 2px 8px rgba(13,20,31,.06),0 44px 90px -46px rgba(13,20,31,.5);}
.hlab-spm-field{display:flex;flex-direction:column;gap:8px;}
.hlab-spm-field--full{grid-column:1 / -1;}
.hlab-spm-field label{font-size:12.5px;letter-spacing:.02em;text-transform:none;font-weight:600;color:rgba(234,246,247,.9);}
.hlab-spm-field input,.hlab-spm-field select{font:inherit;font-size:15px;padding:8px 2px;border:0;border-bottom:1px solid rgba(255,255,255,.28);border-radius:0;background:transparent;color:#fff;width:100%;}
.hlab-spm-field input::placeholder{color:rgba(234,246,247,.42);}
.hlab-spm-field select{color:#fff;}
.hlab-spm-field select option{color:#0d141f;}
.hlab-spm-field input:focus,.hlab-spm-field select:focus{outline:none;border-bottom-color:var(--ti-accent-2);}
.hlab-spm-lead-submit{grid-column:1 / -1;width:100%;justify-content:center;margin-top:12px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);color:#fff;letter-spacing:.16em;}
.hlab-spm-lead-submit:hover{background:var(--ti-accent);border-color:var(--ti-accent);color:#fff;}
.hlab-spm-lead-legal{grid-column:1 / -1;font-size:12px;line-height:1.5;color:rgba(234,246,247,.6);margin:2px 0 0;}
.hlab-spm-lead-done{grid-column:1 / -1;text-align:center;padding:26px 8px;}
.hlab-spm-lead-check{display:inline-grid;place-items:center;width:54px;height:54px;border-radius:50%;background:var(--ti-accent);color:#fff;font-size:27px;margin-bottom:14px;}
.hlab-spm-lead-done h3{font-size:22px;font-weight:600;color:#fff;margin:0 0 8px;}
.hlab-spm-lead-done p{font-size:15px;color:rgba(234,246,247,.75);margin:0;}
@media (max-width:900px){.hlab-spm-lead-grid{grid-template-columns:1fr;}.hlab-spm-lead-form{grid-template-columns:1fr;}.hlab-spm-review-frame{height:64vh;}.hlab-spm-review-quote{max-width:88%;}}
.hlab-sf-tabbed{display:grid;grid-template-columns:0.85fr 1.55fr;gap:clamp(32px,5vw,88px);align-items:start;text-align:left;}
.hlab-sf-head .hlab-sf-title{max-width:12ch;margin:14px 0 0;}
.hlab-sf-head .hlab-sf-eyebrow{color:#17656d;}
.hlab-sf-intro{margin:18px 0 0;max-width:34ch;}
.hlab-sf-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:clamp(20px,3vh,34px);}
.hlab-sf-tab{font:inherit;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--ti-muted);background:transparent;border:1px solid var(--ti-line);border-radius:999px;padding:9px 18px;cursor:pointer;transition:background .2s ease,color .2s ease,border-color .2s ease;}
.hlab-sf-tab:hover{border-color:var(--ti-accent);color:var(--ti-ink);}
.hlab-sf-tab.hlab-sf-active{background:var(--ti-ink);border-color:var(--ti-ink);color:#fff;}
.hlab-sf-panel{display:none;}
.hlab-sf-panel.hlab-sf-active{display:block;animation:sfFade .35s ease;}
@keyframes sfFade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.hlab-sf-item{border-top:1px solid var(--ti-line);}
.hlab-sf-item:last-child{border-bottom:1px solid var(--ti-line);}
.hlab-sf-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;text-align:left;background:transparent;border:0;cursor:pointer;padding:clamp(18px,2.6vh,26px) 2px;font:inherit;font-size:clamp(16px,1.35vw,19px);font-weight:500;line-height:1.3;color:var(--ti-ink);}
.hlab-sf-q:hover{color:var(--ti-accent);}
.hlab-sf-ic{flex:none;width:20px;height:20px;position:relative;color:var(--ti-muted);}
.hlab-sf-ic::before,.hlab-sf-ic::after{content:"";position:absolute;background:currentColor;border-radius:2px;}
.hlab-sf-ic::before{left:0;right:0;top:50%;height:1.6px;transform:translateY(-50%);}
.hlab-sf-ic::after{top:0;bottom:0;left:50%;width:1.6px;transform:translateX(-50%);transition:opacity .3s ease;}
.hlab-sf-item.hlab-sf-open .hlab-sf-ic{color:var(--ti-accent);}
.hlab-sf-item.hlab-sf-open .hlab-sf-ic::after{opacity:0;}
.hlab-sf-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s cubic-bezier(.16,1,.3,1);}
.hlab-sf-item.hlab-sf-open .hlab-sf-a{grid-template-rows:1fr;}
.hlab-sf-a-in{overflow:hidden;}
.hlab-sf-a p{font-size:15px;line-height:1.7;color:var(--ti-muted);margin:0;padding:2px 2px 24px;max-width:62ch;}
@media (max-width:860px){.hlab-sf-tabbed{grid-template-columns:1fr;gap:30px;}.hlab-sf-head .hlab-sf-title,.hlab-sf-intro{max-width:none;}}
@media (max-width:600px){.hlab-ti-h2{line-height:1.08;}.hlab-spmf2-h{line-height:1.1;}}
.hlab-spmf2{--f-bg:#0d141f;--f-tile:rgba(255,255,255,.035);--f-tile-h:rgba(255,255,255,.075);--f-line:rgba(255,255,255,.10);--f-line-h:rgba(255,255,255,.20);--f-ink:#f4f7f9;--f-mut:rgba(244,247,249,.56);--f-teal:#22808a;--f-ease:cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden;border-radius:clamp(22px,2.4vw,36px);background:var(--f-bg);color:var(--f-ink);font-family:inherit;}
.hlab-spmf2-fx{position:absolute;inset:0;z-index:0;width:100%;height:100%;display:block;pointer-events:none;}
.hlab-spmf2::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(13,20,31,.14),rgba(13,20,31,.30));}
.hlab-spmf2-wrap{position:relative;z-index:2;max-width:1560px;margin:0 auto;padding:clamp(64px,7vw,116px) clamp(30px,4.4vw,72px) clamp(36px,3vw,52px);}
.hlab-spmf2-grid{display:grid;grid-template-columns:1.02fr 1.16fr 1.16fr;gap:clamp(32px,3.8vw,76px);align-items:stretch;}
.hlab-spmf2-brand{display:flex;flex-direction:column;justify-content:space-between;gap:clamp(36px,5vw,72px);min-height:392px;padding:4px 0;}
.hlab-spmf2-logo{display:block;width:212px;height:116px;object-fit:contain;}
.hlab-spmf2-h{margin:0;max-width:15ch;font-size:clamp(29px,3.1vw,45px);line-height:1.04;letter-spacing:-.02em;font-weight:600;text-wrap:balance;}
.hlab-spmf2-mid{display:flex;flex-direction:column;gap:16px;}
.hlab-spmf2-links{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.hlab-spmf2-tile{display:flex;align-items:center;min-height:clamp(60px,5vw,76px);padding:0 26px;background:var(--f-tile);border:1px solid var(--f-line);border-radius:14px;color:var(--f-ink);font-size:16px;font-weight:500;letter-spacing:-.01em;text-decoration:none;transition:background .3s var(--f-ease),border-color .3s var(--f-ease),transform .3s var(--f-ease);}
.hlab-spmf2-tile:hover{background:var(--f-tile-h);border-color:var(--f-line-h);transform:translateY(-2px);}
.hlab-spmf2-demo{display:flex;align-items:center;justify-content:space-between;min-height:clamp(62px,5.2vw,78px);padding:0 12px 0 28px;background:#fff;color:#0d141f;border-radius:14px;font-size:15px;font-weight:600;letter-spacing:.02em;text-decoration:none;transition:transform .3s var(--f-ease),box-shadow .3s var(--f-ease);}
.hlab-spmf2-demo:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.28);}
.hlab-spmf2-demo-ic{display:grid;place-items:center;width:44px;height:44px;background:var(--f-teal);color:#fff;border-radius:10px;font-size:18px;}
.hlab-spmf2-news{display:flex;flex-direction:column;justify-content:space-between;gap:34px;padding:clamp(28px,2.6vw,40px);background:var(--f-tile);border:1px solid var(--f-line);border-radius:18px;}
.hlab-spmf2-mail-row{display:flex;gap:10px;align-items:stretch;}
.hlab-spmf2-mail-mount{flex:1;display:flex;}
.hlab-spmf2-mail-input{width:100%;height:52px;padding:0 18px;background:rgba(0,0,0,.20);border:1px solid var(--f-line);border-radius:12px;color:var(--f-ink);font-size:15px;font-family:inherit;outline:none;transition:border-color .3s var(--f-ease);}
.hlab-spmf2-mail-input::placeholder{color:var(--f-mut);}
.hlab-spmf2-mail-input:focus{border-color:var(--f-teal);}
.hlab-spmf2-mail-btn{flex:0 0 auto;display:grid;place-items:center;width:52px;height:52px;background:var(--f-teal);color:#fff;border:none;border-radius:12px;font-size:18px;text-decoration:none;cursor:pointer;transition:transform .3s var(--f-ease),filter .3s var(--f-ease);}
.hlab-spmf2-mail-btn:hover{transform:translateY(-1px);filter:brightness(1.09);}
.hlab-spmf2-fine{margin:12px 0 0;font-size:12.5px;line-height:1.5;color:var(--f-mut);}
.hlab-spmf2-news-lead{margin:0;max-width:22ch;font-size:clamp(20px,1.9vw,27px);line-height:1.22;letter-spacing:-.015em;font-weight:500;text-wrap:balance;}
.hlab-spmf2-mail-done{font-size:15px;font-weight:500;color:var(--f-ink);}
.hlab-spmf2-legal{display:flex;align-items:center;gap:20px;margin-top:clamp(52px,5vw,84px);padding-top:26px;border-top:1px solid var(--f-line);font-size:13px;color:var(--f-mut);}
.hlab-spmf2-legal-left{display:flex;align-items:center;gap:16px;flex:1;min-width:0;}
.hlab-spmf2-socs{display:flex;align-items:center;gap:15px;}
.hlab-spmf2-legal-center{flex:0 0 auto;text-align:center;}
.hlab-spmf2-legal-right{flex:1;text-align:right;font-size:11px;letter-spacing:.14em;}
.hlab-spmf2-soc{display:grid;place-items:center;width:22px;height:22px;background:none;border:0;border-radius:0;color:var(--f-mut);transition:color .3s var(--f-ease),transform .3s var(--f-ease);}
.hlab-spmf2-soc:hover{color:var(--f-ink);transform:translateY(-1px);}
.hlab-spmf2-soc svg{width:19px;height:19px;fill:currentColor;}
.hlab-spmf2-legal-link{color:var(--f-mut);text-decoration:none;transition:color .3s var(--f-ease);}
.hlab-spmf2-legal-link:hover{color:var(--f-ink);}
.hlab-spmf2-badge{flex:0 0 auto;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--f-teal);color:#0d141f;}
.hlab-spmf2-badge svg{width:17px;height:17px;}
@media (max-width:1080px){.hlab-spmf2-grid{grid-template-columns:1fr 1fr;}.hlab-spmf2-brand{grid-column:1 / -1;min-height:auto;flex-direction:row;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px;}.hlab-spmf2-h{max-width:22ch;}}
@media (max-width:720px){.hlab-spmf2-grid{grid-template-columns:1fr;gap:22px;}.hlab-spmf2-brand{flex-direction:column;align-items:flex-start;gap:26px;}.hlab-spmf2-legal{flex-direction:column;align-items:flex-start;gap:14px;}.hlab-spmf2-legal-left{flex-wrap:wrap;}.hlab-spmf2-legal-center,.hlab-spmf2-legal-right{flex:none;text-align:left;}}

/* src/styles/hlab-tm2.css */
/* moved to hlab-x5-tm2.css (load order). Safe to delete. */

/* src/styles/hlab-x1-hero.css */
/* ============================================================
   SPM V3 hero — scroll-driven motion video + character reveal.
   Self-contained + namespaced (hlab-). Page-scoped to SPM V3.
   The hero is a tall pin: .hlab-hero is the scroll track, and
   .hlab-hero-stage stays pinned while the video scrubs and the
   three lines reveal, then it releases into the ti-root sections.
   The sticky glass menu is a faithful restore of the original nav.
   ============================================================ */
.hlab-hero {
  --a: #22808a;
  --a2: #3aa3ad;
  --navy: #0d141f;
  position: relative;
  margin: 0;
  background: #0d141f;
  color: #f4f7f9;
  font-family: var(--font-body), "Bricolage Grotesque", system-ui, sans-serif;
  /* height is set by the script (100vh + scroll track); fallback below */
  min-height: 100vh;
}
.hlab-hero *, .hlab-hero *::before, .hlab-hero *::after { box-sizing: border-box; }

/* --- Pinned stage --- */
.hlab-hero-stage {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  background: #0d141f;
}
/* Full-stage canvas image-sequence (TI-style; scrubbed by scroll). */
.hlab-hero-canvas {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  display: block;
  background: #0d141f;
}
/* Hidden decode source — its frames are drawn to the canvas; kept in the DOM
   (not display:none) so it decodes reliably for capture. */
.hlab-hero-video {
  position: absolute;
  left: 0;
  top: 0;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
  z-index: -1;
}
/* Lighter veil — subtle depth without hiding the sequence. */
.hlab-hero-veil {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(135% 105% at 50% 50%, rgba(6,10,16,.28) 0%, rgba(6,10,16,.16) 44%, rgba(6,10,16,.04) 74%, rgba(6,10,16,0) 100%),
    linear-gradient(0deg, rgba(6,10,16,.22) 0%, rgba(6,10,16,.05) 42%, rgba(6,10,16,.09) 100%);
}

/* --- Revealing copy (centered) --- */
.hlab-hero-copy {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
}
.hlab-beat {
  position: absolute;
  left: 50%;
  bottom: 8.4375rem;            /* TI: bottom-anchored, padding-bottom ~135px */
  width: auto;
  max-width: 94vw;
  white-space: nowrap;   /* forced \n breaks define the line count → 3 lines max */
  margin: 0;
  text-align: center;
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -.01em;
  font-size: clamp(26px, 5.6vw, 44px);
  color: #fff;
  /* glyph-hugging shadow (keeps text legible without darkening the video) */
  text-shadow: 0 1px 2px rgba(6,10,16,.6), 0 2px 22px rgba(6,10,16,.7), 0 0 60px rgba(6,10,16,.4);
  transform: translateX(-50%);
  will-change: transform, opacity;
}
@media (min-width: 1024px) {
  .hlab-beat { font-size: min(4.79vw, 122px); letter-spacing: min(-.046vw, -1.173px); }
}
.hlab-beat .hlab-word { display: inline-block; white-space: nowrap; }
/* No per-char will-change/transition: ~150 promoted layers made every scroll
   frame a heavy compositor commit; the script already eases opacity/colour. */
.hlab-beat .hlab-ch, .hlab-beat .hlab-sp { display: inline-block; }
.hlab-beat .hlab-sp { width: .28em; }

.hlab-sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* --- Scroll hint --- */
.hlab-scroll-hint {
  position: absolute;
  left: 50%;
  bottom: 26px;
  transform: translateX(-50%);
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: rgba(244,247,249,.8);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  pointer-events: none;
}
.hlab-sh-dot { width: 24px; height: 38px; border: 1.5px solid rgba(244,247,249,.5); border-radius: 14px; position: relative; }
.hlab-sh-dot::after { content: ""; position: absolute; left: 50%; top: 7px; width: 3px; height: 7px; border-radius: 2px; background: var(--a2); transform: translateX(-50%); animation: hlabSD 1.5s ease-in-out infinite; }

/* --- Cursor-follower "Défiler pour explorer" (TI-style) --- */
.hlab-cursor { position: fixed; left: 0; top: 0; z-index: 60; pointer-events: none; opacity: 0; transition: opacity .35s ease; font-size: 11px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: #fff; text-shadow: 0 1px 6px rgba(6,10,16,.65); white-space: nowrap; will-change: transform, opacity; }
@media (pointer: fine) { .hlab-scroll-hint { display: none; } }
@keyframes hlabSD { 0% { opacity: 0; transform: translate(-50%, 0); } 30% { opacity: 1; } 100% { opacity: 0; transform: translate(-50%, 12px); } }

/* --- Preloader (TI-style: off-white split panels, centred SPM logomark, curtain reveal) --- */
.hlab-preloader { position: fixed; inset: 0; z-index: 9999; overflow: hidden; pointer-events: auto; will-change: opacity; }
.hlab-pre-half { position: absolute; left: 0; width: 100%; height: 50vh; height: 50svh; overflow: hidden; background: #ededed; will-change: transform; }
.hlab-pre-top { top: 0; }
.hlab-pre-bottom { bottom: 0; }
.hlab-pre-inner { position: absolute; left: 0; width: 100%; height: 100vh; height: 100svh; display: flex; align-items: center; justify-content: center; will-change: transform; }
.hlab-pre-top .hlab-pre-inner { top: 0; }
.hlab-pre-bottom .hlab-pre-inner { bottom: 0; }
.hlab-pre-logo { width: 128px; height: auto; display: block; opacity: 0; will-change: opacity, transform; }
@media (max-width: 600px) { .hlab-pre-logo { width: 104px; } }

/* --- Loading spinner (legacy; unused, replaced by preloader) --- */
.hlab-hero-loader { position: absolute; inset: 0; z-index: 2; display: grid; place-items: center; pointer-events: none; transition: opacity .5s ease; }
.hlab-hero-spin { width: 34px; height: 34px; border-radius: 50%; border: 2px solid rgba(255,255,255,.22); border-top-color: var(--a2); animation: hlabSpin .8s linear infinite; }
@keyframes hlabSpin { to { transform: rotate(360deg); } }

/* ============================================================
   Sticky top menu — original floating glass nav (restored)
   ============================================================ */
.hlab-site-header {
  --nav-ink: #0D141F;
  --accent: #22808A;
  position: fixed;
  left: 0;
  top: 2vmin;
  z-index: 100;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: 0 2vmin;
  pointer-events: none;
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity .7s ease-in-out, transform .7s ease-in-out;
}
.hlab-site-header.hlab-revealed { opacity: 1; transform: translateY(0); }
.hlab-nav-bar {
  pointer-events: auto;
  display: flex;
  align-items: center;
  gap: 0.85vmin;
  width: auto;
  max-width: calc(100% - 4vmin);
  background: rgba(255, 255, 255, .93);
  -webkit-backdrop-filter: blur(30px) saturate(150%);
          backdrop-filter: blur(30px) saturate(150%);
  border: 1px solid rgba(255, 255, 255, .96);
  border-radius: 18px;
  padding: 8px 8px 8px 14px;
  box-shadow: 0 18px 50px -20px rgba(13, 20, 31, .55), inset 0 1px 0 rgba(255, 255, 255, .9);
  transition: box-shadow .3s ease, background .3s ease;
}
.hlab-nav-bar:hover { box-shadow: 0 24px 64px -22px rgba(13, 20, 31, .62), inset 0 1px 0 rgba(255, 255, 255, .95); }
.hlab-nav-logo { display: flex; align-items: center; flex: none; text-decoration: none; margin-right: 24px; }
.hlab-nav-logo img { height: 51px; width: auto; display: block; transition: transform .3s cubic-bezier(.16, 1, .3, 1); }
.hlab-nav-logo:hover img { transform: scale(1.06); }
.hlab-nav-links { display: none; align-items: center; gap: 18px; list-style: none; margin: 0; padding: 0; }
.hlab-nav-links a { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; font-weight: 450; color: var(--nav-ink); text-decoration: none; white-space: nowrap; opacity: .92; position: relative; transition: opacity .25s ease, color .25s ease, transform .25s ease; }
.hlab-nav-links a:hover { opacity: 1; color: var(--accent); transform: translateY(-1px); }
.hlab-nav-links .hlab-caret { font-size: 11px; opacity: .5; transform: translateY(1px); transition: transform .25s ease, opacity .25s ease; }
.hlab-nav-links a:hover .hlab-caret { opacity: .9; transform: translateY(1px) rotate(180deg); }
.hlab-nav-links a::after { content: ""; position: absolute; left: 2px; right: 2px; bottom: -5px; height: 2px; border-radius: 2px; background: var(--accent); transform: scaleX(0); transform-origin: left center; transition: transform .3s cubic-bezier(.16, 1, .3, 1); }
.hlab-nav-links a:hover::after { transform: scaleX(1); }
.hlab-nav-actions { display: none; align-items: center; gap: 6px; margin-left: calc(18px - 0.85vmin); }
.hlab-nav-icon { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 10px; border: 0; background: var(--accent); color: #fff; flex: none; text-decoration: none; }
.hlab-nav-icon svg { width: 18px; height: 18px; }
.hlab-nav-icon:hover { filter: brightness(1.08); }
.hlab-nav-btn { display: inline-flex; align-items: center; justify-content: center; text-align: center; min-width: 72px; height: 42px; padding: 0 13px; border-radius: 10px; font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; line-height: 1.08; text-decoration: none; transition: transform .25s cubic-bezier(.16, 1, .3, 1), background .25s ease, box-shadow .25s ease, filter .25s ease; }
.hlab-nav-btn:hover { transform: translateY(-2px); }
.hlab-nav-btn-white { background: #1B2A38; color: #fff; border: 0; }
.hlab-nav-btn-white:hover { background: #0d141f; box-shadow: 0 12px 26px -10px rgba(13, 20, 31, .6); }
.hlab-nav-btn-grey { background: #DADDE0; color: var(--nav-ink); }
.hlab-nav-btn-grey:hover { background: #c9ced4; box-shadow: 0 12px 24px -12px rgba(13, 20, 31, .4); }
.hlab-nav-menu-btn { display: inline-flex; flex-direction: column; justify-content: center; gap: 4px; width: 46px; height: 46px; border-radius: 11px; background: #fff; border: 1px solid rgba(13, 20, 31, .12); cursor: pointer; margin-left: auto; color: var(--nav-ink); }
.hlab-nav-menu-btn .hlab-bar { display: block; width: 18px; height: 2px; background: currentColor; margin: 0 auto; transition: .3s; }
.hlab-nav-menu-btn.open .hlab-bar:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.hlab-nav-menu-btn.open .hlab-bar:nth-child(2) { opacity: 0; }
.hlab-nav-menu-btn.open .hlab-bar:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.hlab-nav-dropdown { margin-top: 8px; width: calc(100% - 4vmin); max-width: 520px; overflow: hidden; border-radius: 16px; background: rgba(237, 240, 243, .7); -webkit-backdrop-filter: blur(22px) saturate(160%); backdrop-filter: blur(22px) saturate(160%); border: 1px solid rgba(255, 255, 255, .55); padding: 8px; opacity: 0; transform: translateY(-8px); pointer-events: none; transition: opacity .3s cubic-bezier(.2, .8, .2, 1), transform .3s cubic-bezier(.2, .8, .2, 1); }
.hlab-nav-dropdown.open { opacity: 1; transform: translateY(0); pointer-events: auto; }
.hlab-nav-dropdown ul { list-style: none; display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 0; }
.hlab-nav-dropdown a { height: 48px; width: 100%; display: flex; align-items: center; padding: 0 14px; border-radius: 9px; font-size: 16px; color: var(--nav-ink); text-decoration: none; }
.hlab-nav-dropdown a:hover { background: rgba(13, 20, 31, .05); }
@media (min-width: 1080px) {
  .hlab-nav-links { display: flex; }
  .hlab-nav-actions { display: flex; }
  .hlab-nav-menu-btn { display: none; }
  .hlab-nav-dropdown { display: none; }
}

@media (max-width: 560px) {
  .hlab-beat { font-size: clamp(18px, 6vw, 26px); bottom: 6rem; }
}
@media (prefers-reduced-motion: reduce) {
  .hlab-scroll-hint { display: none; }
  .hlab-site-header { transition: none; }
}

/* --- Hold below-the-fold photos while the hero preloader runs ---
   These card photos sit several screens down but would otherwise download
   during the preloader and compete with the hero frames. !important beats
   their inline/background styles from the very first style pass (so nothing
   is requested); the hero script adds .hlab-media-ready when the curtain
   opens, and hlab-hero-nav.js adds it after 8s as an independent failsafe. */
/* Home Lab: hold removed (no hero preloader on this page). */


/* src/styles/hlab-x2-logo-grid.css */
/* ============================================================
   SPM V3 — partner logo grids (Terminal-Industries "LogoWall" /
   "LogoGrid" pattern). Square tiles on a 12-col page grid; a cursor-
   following radial light shows through a 2px inset mask, so the tile
   borders nearest the pointer light up like a grille; the hovered tile
   gets a faint wash; corner crosses breathe on a 5s loop.
   Built by src/scripts/hlab-spm-logos.js. Page-scoped to SPM V3.
   ============================================================ */
.hlab-lg-sec { overflow-x: clip; }                     /* clip the fading extenders */
.hlab-spm-logostrip .hlab-spm-logos-grid.hlab-lg-host,
.hlab-ti-builtby .hlab-ti-logos.hlab-lg-host { display: block; max-width: none; place-items: normal; }

.hlab-lg {
  --lg-line: #e5e5e5;
  --lg-cross: #979797;
  --lg-glow: 34, 128, 138;                            /* Sarcelle #22808A */
  --lg-fill: #fff;
  --lg-m: 5.128vw;                                    /* page margin (mobile) */
  --lg-w: calc(var(--lg-vw, 100vw) - 2 * var(--lg-m));
  --lg-ext-h: min(7.292vw, 186.667px);                /* side extenders */
  --lg-ext-v: min(7.292vw, 120px);                    /* top/bottom extenders */
  --mx: -9999px; --my: -9999px;                       /* cursor, relative to the grid */
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  width: var(--lg-w);
  margin-left: calc(50% - var(--lg-w) / 2);
  padding: var(--lg-ext-v) 0;
  justify-self: start;                                /* the host may still centre block children */
  text-align: initial;
}
.hlab-lg--grid { --lg-ext-h: min(14.583vw, 373.333px); }
@media (min-width: 1024px) {
  .hlab-lg {
    --lg-m: min(3.646vw, 93.333px);
    --lg-g: min(1.042vw, 26.667px);
    /* 10 of 12 columns of the page grid */
    --lg-w: calc((var(--lg-vw, 100vw) - 2 * var(--lg-m) - 11 * var(--lg-g)) / 12 * 10 + 9 * var(--lg-g));
  }
}

/* --- tile --- */
.hlab-lg-cell { position: relative; flex: 0 0 50%; aspect-ratio: 1; container-type: size; }
@media (min-width: 1024px) {
  .hlab-lg--wall .hlab-lg-cell { flex-basis: 10%; }
  .hlab-lg--grid .hlab-lg-cell { flex-basis: 20%; }
}
.hlab-lg-ow { position: relative; width: calc(100% + 1px); height: calc(100% + 1px); overflow: hidden; overflow: clip; }
.hlab-lg-frame { position: absolute; inset: 0; border: 1px solid var(--lg-line); }
.hlab-lg-light, .hlab-lg-wash {
  position: absolute; left: 0; top: 0; width: 30rem; height: 30rem; pointer-events: none;
  /* --tx/--ty = this tile's offset inside the grid (set by JS) */
  transform: translate3d(calc(var(--mx) - var(--tx, 0px) - 50%), calc(var(--my) - var(--ty, 0px) - 50%), 0);
}
.hlab-lg-light { background: radial-gradient(circle at 50% 50%, rgb(var(--lg-glow)), transparent 15rem); }
.hlab-lg-fill { position: absolute; left: 2px; top: 2px; width: calc(100% - 4px); height: calc(100% - 4px); background: var(--lg-fill); }
.hlab-lg-slot { position: relative; z-index: 2; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.hlab-lg-wash {
  z-index: 1; opacity: 0; transition: opacity .5s;
  background: radial-gradient(circle at 50% 50%, rgba(var(--lg-glow), .8), transparent 15rem) no-repeat;
}
.hlab-lg-slot:hover + .hlab-lg-wash { opacity: .2; }
.hlab-lg--wall .hlab-lg-slot:hover + .hlab-lg-wash { opacity: .08; }
@media (hover: hover) and (pointer: fine) {
  .hlab-lg--wall .hlab-lg-light { background: radial-gradient(circle at 50% 50%, rgba(var(--lg-glow), .4), transparent 8rem); }
}

/* --- logo inside a tile (TI sizing: ≤4.5rem tall, ≤85% wide, ×scale) --- */
.hlab-lg-logo {
  --s: 1;
  display: flex; align-items: center; justify-content: center;
  max-width: min(95%, 85% * clamp(.5, var(--s), 2));
  max-height: calc(4.5rem * clamp(.5, var(--s), 2));
  opacity: .3;
  transition: opacity 2.4s cubic-bezier(.16, 1, .3, 1) calc(var(--i, 0) * .1s);
}
.hlab-lg.is-in .hlab-lg-logo { opacity: 1; }
.hlab-lg-logo img { display: block; max-width: 100%; max-height: calc(4.5rem * clamp(.5, var(--s), 2)); object-fit: contain; }
/* placeholder glyph + wordmark logos scale with the tile (container units) */
.hlab-lg .hlab-spm-clogo { font-size: clamp(10px, 10.5cqw, 26px); gap: .45em; white-space: nowrap; }
@media (min-width: 1024px) { .hlab-lg--grid .hlab-spm-clogo { font-size: clamp(12px, 7.6cqw, 26px); } }
.hlab-lg .hlab-spm-clogo-ic { width: 1.5em; height: 1.5em; }
.hlab-lg .hlab-spm-clogo-name { font-size: 1em; }

/* --- corner crosses (CrossFlicker): arms collapse/expand, 5s loop --- */
.hlab-lg-xs { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.hlab-lg-x { position: absolute; width: 0; height: 0; }
.hlab-lg-x.tl { left: 1px; top: 1px; }
.hlab-lg-x.tr { right: -1px; top: 1px; }
.hlab-lg-x.bl { left: 1px; bottom: -1px; }
.hlab-lg-x.br { right: -1px; bottom: -1px; }
.hlab-lg-x i { position: absolute; background: var(--lg-cross); transform-origin: center; }
.hlab-lg-x i:first-child { left: -1px; top: -6px; width: 1px; height: 11px; animation: hlabLgV 5s cubic-bezier(.87, 0, .13, 1) var(--d, 0s) infinite; }
.hlab-lg-x i:last-child { left: -6px; top: -1px; width: 11px; height: 1px; animation: hlabLgH 5s cubic-bezier(.87, 0, .13, 1) var(--d, 0s) infinite; }
@keyframes hlabLgV { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(0); } }
@keyframes hlabLgH { 0%, 100% { transform: scaleX(1); } 50% { transform: scaleX(0); } }
/* only the outer-left crosses on the first column, top crosses on the first row */
.hlab-lg-cell:not(.c1) .tl, .hlab-lg-cell:not(.c1) .bl, .hlab-lg-cell:not(.r1) .tl, .hlab-lg-cell:not(.r1) .tr { display: none; }

/* --- fading extenders beyond the grid edge --- */
.hlab-lg-ext { position: absolute; pointer-events: none; background-repeat: no-repeat; }
.hlab-lg-ext.l, .hlab-lg-ext.r { top: 0; width: var(--lg-ext-h); height: calc(100% + 1px); }
.hlab-lg-ext.l { left: 1px; transform: translateX(-100%); background-image: linear-gradient(90deg, transparent, var(--lg-line)), linear-gradient(90deg, transparent, var(--lg-line)); background-size: 100% 1px; background-position: top, bottom; }
.hlab-lg-ext.r { right: 0; transform: translateX(100%); background-image: linear-gradient(-90deg, transparent, var(--lg-line)), linear-gradient(-90deg, transparent, var(--lg-line)); background-size: 100% 1px; background-position: top, bottom; }
.hlab-lg-ext.t, .hlab-lg-ext.b { left: 0; width: calc(100% + 1px); height: var(--lg-ext-v); }
.hlab-lg-ext.t { top: 1px; transform: translateY(-100%); background-image: linear-gradient(180deg, transparent, var(--lg-line)), linear-gradient(180deg, transparent, var(--lg-line)); background-size: 1px 100%; background-position: left, right; }
.hlab-lg-ext.b { bottom: 0; transform: translateY(100%); background-image: linear-gradient(0deg, transparent, var(--lg-line)), linear-gradient(0deg, transparent, var(--lg-line)); background-size: 1px 100%; background-position: left, right; }

@media (prefers-reduced-motion: reduce) {
  .hlab-lg-x i { animation: none; }
  .hlab-lg-logo { transition: none; opacity: 1; }
}


/* src/styles/hlab-x3-buttons.css */
/* ============================================================
   SPM V3 — page polish: soft brand gradient behind the light sections,
   Apple-style buttons, and the Terminal-Industries button hover
   (a panel slides up from the bottom edge, the label changes colour and
   a hairline underline draws in left → right, retracting to the right).
   Buttons are tagged by src/scripts/hlab-buttons.js. Page-scoped to V3.
   ============================================================ */

/* ---------- 1. Subtle gradient (Blanc brume + teal / steel glows) ---------- */
.hlab-ti-root {
  background:
    radial-gradient(62% 900px at 88% 1500px, rgba(34, 128, 138, .075), transparent 70%),
    radial-gradient(56% 1000px at 6% 3700px, rgba(67, 97, 122, .07), transparent 70%),
    radial-gradient(62% 1000px at 92% 6300px, rgba(34, 128, 138, .06), transparent 70%),
    radial-gradient(56% 900px at 8% 8900px, rgba(67, 97, 122, .06), transparent 70%),
    radial-gradient(62% 1000px at 86% 11200px, rgba(34, 128, 138, .06), transparent 70%),
    linear-gradient(180deg, #fff 0, #f9fafb 1100px, #f5f7f9 50%, #f9fafb 88%, #fff 100%);
}
.hlab-ti-root > .hlab-ti-sec { background-color: transparent !important; }

/* ---------- 2. Apple-style buttons ---------- */
.hlab-bx {
  --bx-ease: cubic-bezier(.19, 1, .22, 1);
  position: relative;
  overflow: hidden;
  isolation: isolate;                       /* the hover panel sits under the label */
  -webkit-tap-highlight-color: transparent;
  text-transform: none !important;
  letter-spacing: -.005em !important;
  font-weight: 500 !important;
  border: 0 !important;
  background: var(--bx-bg) !important;
  color: var(--bx-fg) !important;
  box-shadow: var(--bx-shadow) !important;
  transition: color .3s cubic-bezier(.39, .575, .565, 1), transform .25s var(--bx-ease), box-shadow .3s ease !important;
  -webkit-font-smoothing: antialiased;
}
.hlab-bx-pill { border-radius: 980px !important; }
.hlab-bx-round { border-radius: 50% !important; }

/* variants — fill / text / hover panel / hover text */
.hlab-bx--dark {
  --bx-bg: linear-gradient(180deg, #2a3e51 0%, #1b2a38 55%, #15212c 100%);
  --bx-fg: #fff;
  --bx-hover-bg: #22808a;
  --bx-hover-fg: #fff;
  --bx-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 1px 2px rgba(13, 20, 31, .22), 0 10px 24px -12px rgba(13, 20, 31, .55);
}
.hlab-bx--teal {
  --bx-bg: linear-gradient(180deg, #2f9ea9 0%, #22808a 58%, #1c6f78 100%);
  --bx-fg: #fff;
  --bx-hover-bg: #0d141f;
  --bx-hover-fg: #8edbe1;
  --bx-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 1px 2px rgba(13, 20, 31, .2), 0 10px 26px -12px rgba(34, 128, 138, .7);
}
.hlab-bx--light {
  --bx-bg: linear-gradient(180deg, #fff 0%, #f3f5f7 100%);
  --bx-fg: #0d141f;
  --bx-hover-bg: #0d141f;
  --bx-hover-fg: #8edbe1;
  --bx-shadow: inset 0 0 0 1px rgba(13, 20, 31, .08), inset 0 1px 0 #fff, 0 1px 2px rgba(13, 20, 31, .06), 0 8px 18px -12px rgba(13, 20, 31, .3);
}
.hlab-bx--teal-ondark {                       /* teal CTA on a navy surface */
  --bx-bg: linear-gradient(180deg, #2f9ea9 0%, #22808a 58%, #1c6f78 100%);
  --bx-fg: #fff;
  --bx-hover-bg: #fff;
  --bx-hover-fg: #0d141f;
  --bx-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 1px 2px rgba(0, 0, 0, .25), 0 12px 28px -12px rgba(34, 128, 138, .8);
}
.hlab-bx--light-ondark {                      /* white CTA on a dark card */
  --bx-bg: linear-gradient(180deg, #fff 0%, #eef1f4 100%);
  --bx-fg: #0d141f;
  --bx-hover-bg: #22808a;
  --bx-hover-fg: #fff;
  --bx-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(0, 0, 0, .2), 0 10px 24px -12px rgba(0, 0, 0, .6);
}
.hlab-bx--tile {                              /* footer navigation tiles (on navy) */
  --bx-bg: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .03));
  --bx-fg: #f4f7f9;
  --bx-hover-bg: #22808a;
  --bx-hover-fg: #fff;
  --bx-shadow: inset 0 0 0 1px rgba(255, 255, 255, .09), inset 0 1px 0 rgba(255, 255, 255, .08);
}
.hlab-bx--tab {                               /* segmented tabs: quiet until hovered */
  --bx-bg: transparent;
  --bx-fg: #43617a;
  --bx-hover-bg: #0d141f;
  --bx-hover-fg: #fff;
  --bx-shadow: none;
}
.hlab-bx--tab.hlab-sf-active, .hlab-bx--tab.hlab-is-on {
  --bx-bg: linear-gradient(180deg, #2a3e51 0%, #1b2a38 55%, #15212c 100%);
  --bx-fg: #fff;
  --bx-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 6px 16px -10px rgba(13, 20, 31, .6);
}

/* sizes — Apple's comfortable pill proportions */
.hlab-nav-btn.hlab-bx { height: 40px !important; padding: 0 18px !important; font-size: 13.5px !important; line-height: 1 !important; min-width: 0 !important; }
.hlab-nav-icon.hlab-bx { width: 40px !important; height: 40px !important; }
.hlab-ti-card-cta.hlab-bx { min-height: 46px; font-size: 14.5px !important; }
.hlab-ti-panel-cta.hlab-bx, .hlab-spm-lead-submit.hlab-bx { min-height: 46px; font-size: 15px !important; }
.hlab-tm2-cta.hlab-bx { height: 44px !important; padding: 0 20px !important; font-size: 14px !important; }
.hlab-tm2-arrow.hlab-bx { width: 48px !important; height: 48px !important; }
.hlab-tm2-tab.hlab-bx, .hlab-sf-tab.hlab-bx { font-size: 13.5px !important; }
.hlab-ft-cta.hlab-bx { font-size: 15px !important; padding-left: 26px !important; padding-right: 22px !important; }
.hlab-bx .hlab-bx-l > span { font-size: inherit !important; text-transform: none !important; letter-spacing: inherit !important; font-weight: inherit !important; }
.hlab-ft-tile.hlab-bx { border-radius: 14px !important; }

/* press + keyboard focus */
.hlab-bx.hlab-bx:active { transform: scale(.97) !important; transition-duration: .12s !important; }
.hlab-bx:focus { outline: none; }
.hlab-bx:focus-visible { box-shadow: var(--bx-shadow), 0 0 0 3px #fff, 0 0 0 5px rgba(34, 128, 138, .65) !important; }

/* ---------- 3. Terminal-Industries hover ---------- */
.hlab-bx::before {
  content: "";
  position: absolute;
  left: -1px; top: -1px;
  width: calc(100% + 2px); height: calc(100% + 2px);
  z-index: -1;                               /* above the button's own fill, below the label */
  background: var(--bx-hover-bg);
  transform: translate3d(0, 101%, 0);
  transition: transform .7s var(--bx-ease);
  pointer-events: none;
}
.hlab-bx-l { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: inherit; pointer-events: none; }
.hlab-bx-l::after {
  content: "";
  position: absolute; left: 0; bottom: -.22em;
  width: 100%; height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .7s var(--bx-ease);
}
.hlab-bx.hlab-bx-icon .hlab-bx-l::after { display: none; }   /* icon-only buttons: no underline */
@media (hover: hover) and (pointer: fine) {
  .hlab-bx.hlab-bx:hover { color: var(--bx-hover-fg) !important; transform: none !important; filter: none !important; }
  .hlab-bx:hover::before { transform: translate3d(0, 0, 0); }
  .hlab-bx:hover .hlab-bx-l::after { transform: scaleX(1); transform-origin: left; }
  .hlab-bx--tab.hlab-sf-active:hover::before, .hlab-bx--tab.hlab-is-on:hover::before { transform: translate3d(0, 101%, 0); }
  .hlab-bx--tab.hlab-sf-active:hover, .hlab-bx--tab.hlab-is-on:hover { color: var(--bx-fg) !important; }
}
@media (prefers-reduced-motion: reduce) {
  .hlab-bx, .hlab-bx::before, .hlab-bx-l::after { transition-duration: .01s !important; }
}


/* src/styles/hlab-x4-mobile.css */
/* ============================================================
   SPM V3 — mobile layout pass (modelled on terminal-industries.com
   mobile): 20px gutters, single-column stacks, horizontal tab rows and
   swipeable card carousels, full-width CTAs, ≥44px tap targets.
   Page-scoped to SPM V3. Desktop is untouched (max-width queries only).
   ============================================================ */

/* ---------- tabs → one swipeable row (TI pattern) ---------- */
@media (max-width: 860px) {
  .hlab-tm2-tabs, .hlab-sf-tabs {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    /* bleed to the screen edges, keep the 20px gutter as padding */
    margin-left: -20px !important; margin-right: -20px !important;
    padding: 2px 20px !important;
    scroll-padding-inline: 20px;
    gap: 8px !important;
    justify-content: flex-start !important;
    max-width: none !important;
    width: auto !important;
  }
  /* the FAQ wrap is an auto-sized grid: stop the nowrap row from widening it */
  .hlab-sf-wrap { grid-template-columns: minmax(0, 1fr) !important; }
  .hlab-sf-main, .hlab-tm2-bar > * { min-width: 0; }
  .hlab-tm2-tabs::-webkit-scrollbar, .hlab-sf-tabs::-webkit-scrollbar { display: none; }
  .hlab-tm2-tab, .hlab-sf-tab {
    flex: 0 0 auto !important;
    white-space: nowrap;
    scroll-snap-align: start;
    min-height: 44px;
  }
  .hlab-tm2-bar { margin-top: 28px !important; }
  .hlab-tm2-panels { margin-top: 24px !important; }

  /* ---------- "Une équipe SPM pensée pour chaque métier": card carousel ---------- */
  .hlab-tm2-cards {
    flex-direction: row !important;
    overflow-x: auto !important;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    margin-left: -20px; margin-right: -20px;
    padding: 0 20px 4px;
    scroll-padding-inline: 20px;
    gap: 12px !important;
  }
  .hlab-tm2-cards::-webkit-scrollbar { display: none; }
  .hlab-tm2-card, .hlab-tm2-card.hlab-is-open {
    flex: 0 0 min(86%, 360px) !important;     /* next card peeks in */
    min-width: 0 !important;
    min-height: min(500px, 118vw) !important;
    scroll-snap-align: start;
    cursor: default;
  }
  .hlab-tm2-card:not(.hlab-is-open):hover { opacity: 1; }
  .hlab-tm2-card-inner { position: absolute !important; inset: 0 !important; padding: 24px !important; }
  /* every card shows its copy on touch (no accordion to discover) */
  .hlab-tm2-card .hlab-tm2-body { opacity: 1 !important; transform: none !important; max-height: none !important; font-size: 16px !important; line-height: 1.45; margin-top: 12px; }
  .hlab-tm2-title { font-size: 26px !important; line-height: 1.1 !important; }
  .hlab-tm2-card-inner > :last-child:not(.hlab-tm2-body):not(.hlab-tm2-title) { margin-top: auto !important; }
}

@media (max-width: 767px) {
  /* ---------- cost calculator: inputs, then results (TI calculator) ---------- */
  .hlab-ti-calc-grid { grid-template-columns: 1fr !important; border-radius: 20px !important; }
  .hlab-ti-calc-left, .hlab-ti-calc-grid .hlab-ti-calc-panel { padding: 24px 20px !important; min-width: 0; }
  .hlab-ti-calc-left .hlab-ti-fields { gap: 16px !important; }
  .hlab-ti-calc-left .hlab-ti-field label { line-height: 1.4; }
  .hlab-ti-calc-left .hlab-ti-field input { min-height: 48px; }
  .hlab-ti-calc-panel .hlab-ti-panel-row { gap: 12px; }
  .hlab-ti-calc-panel .hlab-ti-panel-row > :last-child { text-align: right; white-space: nowrap; }
  .hlab-ti-calc-panel .hlab-ti-panel-cta, .hlab-ti-calc-panel .hlab-ti-btn { width: 100% !important; justify-content: center; white-space: normal; text-align: center; }

  /* ---------- "Notre approche": full-width copy, shorter media ---------- */
  .hlab-ti-sticky-wrap { gap: 8px !important; margin-top: 40px !important; }
  .hlab-ti-sticky-media { position: relative !important; top: auto !important; aspect-ratio: 16 / 10 !important; max-width: none !important; width: 100%; }
  .hlab-ti-feature-list .hlab-ti-feature { padding: 28px 0 !important; }
  .hlab-ti-feature-list .hlab-ti-feature h4, .hlab-ti-feature-list .hlab-ti-feature p { max-width: none !important; }
  .hlab-ti-feature-list .hlab-ti-feature h4 { font-size: 24px !important; line-height: 1.15 !important; margin-bottom: 10px !important; }
  .hlab-ti-feature-list .hlab-ti-feature p { font-size: 16px !important; line-height: 1.55 !important; }
  .hlab-ti-feature.hlab-ti-fade { opacity: .55; }
  .hlab-ti-feature.hlab-ti-fade.hlab-ti-active { opacity: 1; }

  /* ---------- section CTAs: full width like TI ---------- */
  .hlab-ti-card-cta.hlab-bx, .hlab-spm-lead-submit.hlab-bx { width: 100%; justify-content: center; }

  /* ---------- footer: 2-up nav tiles, 2-up addresses, bigger tap targets ---------- */
  .hlab-ft-top { gap: 20px !important; }
  .hlab-ft-cta.hlab-bx { width: 100%; justify-content: space-between; }
  .hlab-ft-grid { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .hlab-ft-tile.hlab-bx { min-height: 56px; height: auto !important; padding: 12px 14px !important; font-size: 14.5px !important; line-height: 1.25; }
  .hlab-ft-tile .hlab-bx-l { justify-content: flex-start; text-align: left; min-width: 0; }
  .hlab-ft-addr { grid-template-columns: 1fr 1fr !important; column-gap: 16px !important; row-gap: 24px !important; }
  .hlab-ft-addr .hlab-ft-col:first-child { grid-column: 1 / -1; }
  .hlab-ft-addr .hlab-ft-col { min-width: 0; overflow-wrap: anywhere; }
  .hlab-ft-ln, .hlab-ft-legal a, .hlab-ft-bar a { display: inline-flex; align-items: center; min-height: 44px; }
  .hlab-ft-legal { column-gap: 18px !important; row-gap: 0 !important; flex-wrap: wrap; }
  .hlab-lang-opt { min-height: 44px; }
}

@media (max-width: 380px) {
  .hlab-ft-grid { grid-template-columns: 1fr !important; }
  .hlab-ft-tile.hlab-bx { min-height: 52px; }
  .hlab-ft-addr { grid-template-columns: 1fr !important; }
}


/* src/styles/hlab-x5-tm2.css */
/* ============================================================
   SPM V3 — "Une équipe SPM pensée pour chaque métier" carousel, matched to
   terminal-industries.com "One modular platform" cards:
   · collapsed, not hovered → solid brand colour
   · collapsed, hovered     → photo fades in sharp (scale 1.2 → 1) under a
                              radial shade + a notch slides into the right edge
   · expanded               → softly blurred photo, text fully readable,
                              content staggers in (src/scripts/hlab-tm2.js)
   Page-scoped to SPM V3.
   ============================================================ */
.hlab-tm2 {
  --tm-ease: cubic-bezier(.19, 1, .22, 1);
  --tm-shade-open: linear-gradient(100deg, rgba(13, 20, 31, .76) 0%, rgba(13, 20, 31, .52) 55%, rgba(13, 20, 31, .3) 100%);
}
.hlab-tm2 .hlab-tm2-card[data-tone="teal"]  { --tm-tone: 27, 111, 120;  background: #1b6f78; }
.hlab-tm2 .hlab-tm2-card[data-tone="grey"]  { --tm-tone: 27, 42, 56;    background: #1b2a38; }
.hlab-tm2 .hlab-tm2-card[data-tone="navy"]  { --tm-tone: 13, 20, 31;    background: #0d141f; }
.hlab-tm2 .hlab-tm2-card[data-tone="steel"] { --tm-tone: 67, 97, 122;   background: #43617a; }

/* card: TI's expand timing */
.hlab-tm2 .hlab-tm2-card {
  transition: flex-grow .6s var(--tm-ease), min-width .6s var(--tm-ease);
}
.hlab-tm2 .hlab-tm2-card:not(.hlab-is-open):hover { opacity: 1; }

/* photo layer */
.hlab-tm2 .hlab-tm2-card::before {
  inset: 0;
  opacity: 0;
  filter: none;
  transform: scale(1.2);
  transition: opacity .9s var(--tm-ease), transform 1.2s var(--tm-ease), filter .6s var(--tm-ease);
  will-change: opacity, transform;
}
/* shade layer */
.hlab-tm2 .hlab-tm2-card[data-tone]::after {
  opacity: 0;
  background: radial-gradient(circle, rgba(0, 0, 0, .3) 0, rgba(0, 0, 0, .5), rgba(0, 0, 0, .7));
  transition: opacity .9s var(--tm-ease);
}

/* expanded: photo visible, lightly blurred, shade keeps the copy readable */
.hlab-tm2 .hlab-tm2-card.hlab-is-open::before {
  opacity: 1;
  transform: scale(1.06);
  filter: blur(6px) saturate(1.05);
}
.hlab-tm2 .hlab-tm2-card.hlab-is-open[data-tone]::after {
  opacity: 1;
  background: var(--tm-shade-open), linear-gradient(rgba(var(--tm-tone), .3), rgba(var(--tm-tone), .3));
}

/* collapsed + hover (mouse only): sharp photo under a radial shade */
@media (hover: hover) and (pointer: fine) {
  .hlab-tm2 .hlab-tm2-card:not(.hlab-is-open):hover::before { opacity: 1; transform: scale(1); filter: none; }
  .hlab-tm2 .hlab-tm2-card:not(.hlab-is-open):hover::after { opacity: 1; }
}
/* touch / small screens: no hover, so every card shows its photo like the open one */
@media (hover: none), (max-width: 860px) {
  .hlab-tm2 .hlab-tm2-card::before { opacity: 1; transform: scale(1.06); filter: blur(6px) saturate(1.05); }
  .hlab-tm2 .hlab-tm2-card[data-tone]::after { opacity: 1; background: var(--tm-shade-open), linear-gradient(rgba(var(--tm-tone), .3), rgba(var(--tm-tone), .3)); }
}

/* typography: titles on two lines when expanded (width set by hlab-tm2.js),
   real space between title and copy, copy 15% larger */
.hlab-tm2 .hlab-tm2-card .hlab-tm2-title { text-wrap: balance; }
.hlab-tm2 .hlab-tm2-card .hlab-tm2-body {
  margin-top: 28px;
  font-size: 26.5px;               /* 23px + 15% */
  line-height: 1.42;
  max-width: 34ch;
}
.hlab-tm2 .hlab-tm2-card.hlab-is-open .hlab-tm2-body { max-height: 600px; }
@media (max-width: 1100px) {
  .hlab-tm2 .hlab-tm2-card .hlab-tm2-body { font-size: 21.85px; margin-top: 22px; }   /* 19px + 15% */
}
@media (max-width: 860px) {
  .hlab-tm2 .hlab-tm2-card .hlab-tm2-body { font-size: 18.4px !important; margin-top: 16px !important; }  /* 16px + 15% */
}

@media (prefers-reduced-motion: reduce) {
  .hlab-tm2 .hlab-tm2-card, .hlab-tm2 .hlab-tm2-card::before, .hlab-tm2 .hlab-tm2-card::after { transition: none !important; }
}

/* Accessible card toggle (hlab-spm-teams.js wraps each title in a real button): same look */
.hlab-tm2 .hlab-tm2-toggle { all: unset; cursor: pointer; }
.hlab-tm2 .hlab-tm2-toggle:focus-visible { outline: 2px solid rgba(34,128,138,.6); outline-offset: 3px; border-radius: 4px; }

/* Header logo: its width is reserved before the image arrives (no layout shift) */
.hlab-nav-logo img { aspect-ratio: 640 / 256; }

/* Performance: section photos load as their section nears the viewport
   (hlab-spm-lazy-video.js adds .hlab-bg-in about 1.5 screens ahead, so they are there before you are) */
[data-tm2]:not(.hlab-bg-in) .hlab-tm2-card[data-tone],
[data-tm2]:not(.hlab-bg-in) .hlab-tm2-card[data-tone]::before,
.hlab-ti-cards3:not(.hlab-bg-in) .hlab-ti-card-media,
.hlab-spm-review:not(.hlab-bg-in) .hlab-spm-review-bg { background-image: none !important; }


/* src/styles/hlab-x6-fs.css */
/* ============================================================
   SPM V3 — "Notre approche" on phones/tablets (≤ 1024px), matched to the
   terminal-industries.com "Why Terminal" steps on mobile. Only applies once
   src/scripts/hlab-fs.js adds .hlab-fs-h; desktop is untouched.
   Page-scoped to SPM V3.
   ============================================================ */
.hlab-fs-count, .hlab-fs-bar, .hlab-fs-btns { display: none; }
@media (max-width: 1024px) {
  .hlab-ti-sticky-wrap.hlab-fs-h { display: flex !important; flex-direction: column; align-items: stretch !important; gap: 0 !important; min-width: 0; }
  .hlab-fs-h > * { min-width: 0; }

  /* full-bleed video on top (TI: 400/480, no frame), notch travels with the step */
  .hlab-fs-h .hlab-ti-sticky-media {
    order: -1;
    position: relative !important;
    top: auto !important;
    /* explicit size (no aspect-ratio): Safari would otherwise narrow the box
       to honour the height cap — it must always span the full screen width */
    flex: none !important;
    align-self: stretch !important;
    box-sizing: border-box !important;
    width: calc(100% + var(--fs-gut-l, 20px) + var(--fs-gut-r, 20px)) !important;
    min-width: calc(100% + var(--fs-gut-l, 20px) + var(--fs-gut-r, 20px)) !important;
    max-width: none !important;
    margin: 0 0 0 calc(-1 * var(--fs-gut-l, 20px)) !important;
    aspect-ratio: auto !important;
    height: min(120vw, 62svh) !important;
    max-height: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transition: clip-path 1s cubic-bezier(.5, 1, .89, 1);
  }
  .hlab-fs-h .hlab-ti-sticky-media video { position: absolute; inset: 0; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; }
  .hlab-fs-h .hlab-fs-btns {
    position: absolute; right: 1.25rem; bottom: 2.5rem; z-index: 2;
    display: flex; gap: .625rem; touch-action: manipulation;
  }
  .hlab-fs-btn {
    width: 3.75rem; aspect-ratio: 1; display: grid; place-items: center;
    border: 0; border-radius: 8px; background: #fff; color: #0d141f; cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: opacity .3s ease, transform .2s ease;
  }
  .hlab-fs-btn:active { transform: scale(.94); }
  .hlab-fs-btn[disabled] { opacity: .4; cursor: default; }

  /* 01 02 03 04 */
  .hlab-fs-h .hlab-fs-count {
    display: flex; column-gap: 1.125rem; margin: 2rem 0 1.375rem;
    font-size: .8125rem; font-weight: 600; letter-spacing: .14625rem; line-height: .81;
    font-variant-numeric: tabular-nums;
  }
  .hlab-fs-count span { color: #eaeaea; transition: color .5s; }
  .hlab-fs-count span.is-on { color: #a9a9a9; }

  /* the four points: one horizontal snap row, next point peeking in */
  .hlab-fs-h .hlab-ti-feature-list {
    flex-direction: row !important;
    overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    margin: 0 calc(-1 * var(--fs-gut-r, 20px)) 0 calc(-1 * var(--fs-gut-l, 20px));
    padding: 0 var(--fs-gut-r, 20px) 0 var(--fs-gut-l, 20px);
    scroll-padding-inline-start: var(--fs-gut-l, 20px);
  }
  .hlab-fs-h .hlab-ti-feature-list::-webkit-scrollbar { display: none; }
  .hlab-fs-h .hlab-ti-feature-list .hlab-ti-feature {
    flex: 0 0 85%;
    padding: 0 1.875rem 0 0 !important;
    border: 0 !important;
    scroll-snap-align: start;
  }
  .hlab-fs-h .hlab-ti-feature-list .hlab-ti-feature.hlab-ti-fade { opacity: 1 !important; transform: none !important; }
  .hlab-fs-h .hlab-ti-feature-list .hlab-ti-feature:last-child { flex-basis: 100%; }
  .hlab-fs-h .hlab-ti-feature-list .hlab-ti-feature h4 {
    font-size: 1.25rem !important; line-height: 1.26 !important; font-weight: 700 !important;
    letter-spacing: -.01em !important; max-width: none !important; margin: 0 0 1.5rem !important;
  }
  .hlab-fs-h .hlab-ti-feature-list .hlab-ti-feature p {
    font-size: 1.25rem !important; line-height: 1.26 !important; font-weight: 400 !important;
    letter-spacing: -.01em !important; max-width: none !important; color: inherit !important;
  }

  /* letters: grey until their point is current, then sweep grey → teal → ink */
  .hlab-ti-sticky-wrap.hlab-fs-h .hlab-ti-feature-list .hlab-ti-feature .hlab-ti-char {
    color: #dddddd;
    animation: none;
    transition: color .5s 0s;
  }
  .hlab-ti-sticky-wrap.hlab-fs-h .hlab-ti-feature-list .hlab-ti-feature.hlab-fs-on .hlab-ti-char {
    color: #0d141f;
    animation: tiCharSweep .5s ease-out var(--v-delay, 0s) both;
    transition: color 0s var(--v-delay, 0s);
  }

  /* progress bar */
  .hlab-fs-h .hlab-fs-bar { display: block; position: relative; height: 2px; margin-top: 1.5rem; background: #f0f1f2; overflow: hidden; }
  .hlab-fs-bar i {
    position: absolute; left: 0; top: 0; height: 100%;
    width: calc(100% / var(--fs-n, 4));
    background: #0d141f;
    transform: translateX(calc(var(--fs-i, 0) * 100%));
    transition: transform .3s cubic-bezier(.16, 1, .3, 1);
  }
}
@media (prefers-reduced-motion: reduce) {
  .hlab-ti-sticky-wrap.hlab-fs-h .hlab-ti-feature-list .hlab-ti-feature.hlab-fs-on .hlab-ti-char { animation: none; transition: none; }
  .hlab-fs-h .hlab-ti-sticky-media, .hlab-fs-bar i { transition: none; }
}


/* src/styles/hlab-x7-review.css */
/* ============================================================
   SPM V3 — client testimonial, matched to the terminal-industries.com quote
   section (full-screen photo, notched top/bottom edges, parallax) with a
   light 3D layer. Behaviour: src/scripts/hlab-review.js. Page-scoped to SPM V3.
   ============================================================ */
.hlab-spm-review.hlab-rv { padding: 0 !important; background: transparent !important; overflow: visible; }
.hlab-rv .hlab-spm-review-frame {
  height: 100svh !important;
  min-height: 560px;
  max-height: 1100px;
  border-radius: 0 !important;
  background: #0d141f;
}
/* photo layer: 116% tall so the ±8% parallax never shows an edge */
.hlab-rv .hlab-spm-review-scale {
  inset: -8% -2% !important;              /* + a little side overscan for the pointer drift */
  will-change: transform;
  transform-origin: 50% 50%;
}
.hlab-spm-review-bg { background-image: none !important; }   /* replaced by the responsive <img> (never download the old photo) */
.hlab-rv-img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: 62% 55%;      /* keep the road + car in frame */
  opacity: 0; transition: opacity .9s cubic-bezier(.16, 1, .3, 1);
}
.hlab-rv-loaded .hlab-rv-img { opacity: 1; }
/* shade: keeps the white quote readable over any part of the photo */
.hlab-rv .hlab-spm-review-frame::before {
  background: radial-gradient(120% 90% at 50% 50%, rgba(13, 20, 31, .62) 0%, rgba(13, 20, 31, .38) 55%, rgba(13, 20, 31, .2) 100%) !important;
}
.hlab-rv .hlab-spm-review-frame::after { content: none !important; }

/* quote: TI proportions, rises in when the section is on screen */
.hlab-rv .hlab-spm-review-inner { transform-style: preserve-3d; will-change: transform; }
.hlab-rv .hlab-spm-review-quote {
  max-width: 860px !important;
  font-size: clamp(26px, 3.2vw, 48px) !important;
  line-height: 1.22 !important;
}
.hlab-rv .hlab-spm-review-quote,
.hlab-rv .hlab-spm-review-author {
  opacity: 0;
  transform: translateY(28px);
  filter: blur(6px);
  transition: opacity .9s cubic-bezier(.16, 1, .3, 1), transform 1.1s cubic-bezier(.16, 1, .3, 1), filter .9s cubic-bezier(.16, 1, .3, 1);
}
.hlab-rv .hlab-spm-review-author { transition-delay: .18s; }
.hlab-rv-in .hlab-spm-review-quote,
.hlab-rv-in .hlab-spm-review-author { opacity: 1; transform: none; filter: none; }

@media (max-width: 767px) {
  .hlab-rv .hlab-spm-review-frame { height: 88svh !important; min-height: 480px; }
  .hlab-rv .hlab-spm-review-quote { max-width: 100% !important; font-size: clamp(24px, 6.6vw, 30px) !important; }
  .hlab-rv-img { object-position: 84% 60%; }                 /* phones: bring the road + car into the crop */
}
@media (prefers-reduced-motion: reduce) {
  .hlab-rv .hlab-spm-review-quote, .hlab-rv .hlab-spm-review-author { opacity: 1; transform: none; filter: none; transition: none; }
  .hlab-rv .hlab-spm-review-scale { inset: 0 !important; }
}


/* src/styles/hlab-x8-hero-vesper.css */
/* hlab-hero-vesper.css — Home Lab hero only (Vesper scroll scene + overlays).
   Overlay layout is Vesper's Figma artboard in vw (px / 14.4), ported from the
   GetLayers portable master; fonts follow the site (Bricolage Grotesque). */
.hlab-hero.hlab-hero {
  --vx-ink: #fdfdfd;
  --vx-signal: #22808A;
  --vx-void: #0D141F;
  --vx-eq: cubic-bezier(.22,1,.36,1);
  /* height: set by hlab-hero-vesper.js on the live page (7 x viewport) */
  background: #0D141F;
}
.hlab-hero .hlab-hero-stage { background: #0D141F; }
.hlab-hero .hlab-hero-canvas { background: var(--vx-void); }
.hlab-hero .hlab-hero-veil {
  background: radial-gradient(120% 80% at 50% 40%, transparent 40%, rgba(13,20,31,.55) 100%);
  z-index: 1;
}
.hlab-hero .hlab-hero-copy { z-index: 3; pointer-events: none; }

/* ---------- overlays (one per scene phase) ---------- */
.hlab-vx-ov { position: absolute; inset: 0; color: #fff; pointer-events: none; visibility: hidden; opacity: 0; }
.hlab-vx-ov h2, .hlab-vx-ov p { margin: 0; }
.hlab-vx-ov .hlab-vx-pe { pointer-events: auto; }
.hlab-vx-disp { font-weight: 300; line-height: .9; letter-spacing: -.022em; text-shadow: 0 0 30px rgba(255,255,255,.08); }

/* CTA: Apple-style pill, pearl gradient, arrow in a navy circle (teal on hover) */
.hlab-vx-send { position: relative; display: inline-flex; align-items: center; gap: 1.111vw; height: 3.542vw;
  padding: 0 .347vw 0 1.944vw; border-radius: 999px; text-decoration: none; isolation: isolate; overflow: hidden;
  background: linear-gradient(180deg, #FFFFFF 0%, #F1F3F5 52%, #DADDE0 100%);
  box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(13,20,31,.10), 0 0 0 1px rgba(255,255,255,.18),
    0 10px 30px -12px rgba(0,0,0,.55), 0 2px 6px -2px rgba(0,0,0,.25);
  transition: transform .5s var(--vx-eq), box-shadow .5s var(--vx-eq), background .5s var(--vx-eq); }
.hlab-vx-send::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.75) 46%, transparent 62%);
  transform: translateX(-120%); transition: transform .9s var(--vx-eq); }
.hlab-vx-send .hlab-vx-fill { display: inline-flex; align-items: center; padding: 0; background: none;
  font-weight: 500; font-size: 1.111vw; line-height: 1; letter-spacing: -.01em; color: #0D141F; white-space: nowrap; }
.hlab-vx-send .hlab-vx-arrow { position: relative; width: 2.847vw; height: 2.847vw; flex: none; display: grid; place-items: center;
  border-radius: 50%; font-size: 0; color: #fff; overflow: hidden;
  background: radial-gradient(120% 120% at 30% 20%, #34495E 0%, #1B2A38 48%, #0D141F 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(0,0,0,.35), 0 2px 6px -2px rgba(13,20,31,.5);
  transition: background .5s var(--vx-eq), transform .5s var(--vx-eq); }
.hlab-vx-send .hlab-vx-arrow::before, .hlab-vx-send .hlab-vx-arrow::after { content: ""; position: absolute; width: 42%; height: 42%;
  background: currentColor; transition: transform .5s var(--vx-eq);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; }
.hlab-vx-send .hlab-vx-arrow::after { transform: translateX(-260%); }
.hlab-vx-send:hover { transform: translateY(-1px);
  background: linear-gradient(180deg, #FFFFFF 0%, #F6F8FA 52%, #E4E7EA 100%);
  box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(13,20,31,.08), 0 0 0 1px rgba(255,255,255,.28),
    0 16px 40px -14px rgba(34,128,138,.55), 0 4px 10px -4px rgba(0,0,0,.3); }
.hlab-vx-send:hover::before { transform: translateX(120%); }
.hlab-vx-send:hover .hlab-vx-fill { background: none; color: #0D141F; }
.hlab-vx-send:hover .hlab-vx-arrow { background: radial-gradient(120% 120% at 30% 20%, #3FB3BD 0%, #22808A 52%, #165E66 100%); }
.hlab-vx-send:hover .hlab-vx-arrow::before { transform: translateX(260%); }
.hlab-vx-send:hover .hlab-vx-arrow::after { transform: none; }
.hlab-vx-send:active { transform: scale(.98); transition-duration: .15s; }
.hlab-vx-send:focus-visible { outline: 2px solid #22808A; outline-offset: 3px; }

/* Hero (orb) */
.hlab-vx-ov-hero .hlab-vx-title { position: absolute; top: 9.028vw; left: 1.667vw; width: 40vw; font-size: 4.3vw; }   /* 40vw: "une" starts the third line, clear of the orb */
.hlab-vx-ov-hero .hlab-vx-cluster { position: absolute; right: 1.667vw; bottom: 2.153vw; left: 1.667vw; height: 14.514vw; }
.hlab-vx-ov-hero .hlab-vx-tagline { position: absolute; top: 0; left: 0; width: 27.5vw; font-size: 1.111vw; line-height: 1.2; text-transform: uppercase; }
.hlab-vx-ov-hero .hlab-vx-support { position: absolute; top: 0; right: 0; width: 19.348vw; font-size: 1.111vw; line-height: 1.2; }
.hlab-vx-ov-hero .hlab-vx-tags { position: absolute; top: 13.194vw; left: 0; display: flex; align-items: center; gap: 1.667vw;
  font-size: 1.111vw; line-height: 1.2; white-space: nowrap; text-transform: uppercase; }
.hlab-vx-ov-hero .hlab-vx-tags i { width: .208vw; height: .208vw; flex: none; background: #fff; display: block; }
.hlab-vx-ov-hero .hlab-vx-cta { position: absolute; top: 10.972vw; right: 0; }

/* Galaxy */
.hlab-vx-ov-galaxy .hlab-vx-title { position: absolute; top: 7.014vw; left: 50%; width: 62vw; transform: translateX(-50%); text-align: center; font-size: 4.4vw; }
.hlab-vx-ov-galaxy .hlab-vx-cluster { position: absolute; left: 0; right: 0; bottom: 0; height: 16.181vw; }
.hlab-vx-ov-galaxy .hlab-vx-support { position: absolute; top: 0; left: 50%; width: 32vw; transform: translateX(-50%); text-align: center; font-size: 1.111vw; line-height: 1.2; }
.hlab-vx-ov-galaxy .hlab-vx-rule { position: absolute; left: 0; right: 0; top: 4.792vw; border-top: 1px solid rgba(255,255,255,.2); }
.hlab-vx-ov-galaxy .hlab-vx-vrule { position: absolute; top: 4.792vw; height: 11.389vw; border-left: 1px solid rgba(255,255,255,.2); }
.hlab-vx-ov-galaxy .hlab-vx-vr1 { left: 25vw; } .hlab-vx-ov-galaxy .hlab-vx-vr2 { left: 50vw; } .hlab-vx-ov-galaxy .hlab-vx-vr3 { left: 75vw; }
.hlab-vx-ov-galaxy .hlab-vx-stat { position: absolute; top: 8.333vw; width: 14vw; display: flex; flex-direction: column; align-items: flex-start; gap: .833vw;
  border-left: 1px solid rgba(255,255,255,.8); padding-left: 1.111vw; }
.hlab-vx-ov-galaxy .hlab-vx-s1 { left: 6.944vw; } .hlab-vx-ov-galaxy .hlab-vx-s2 { left: 31.944vw; }
.hlab-vx-ov-galaxy .hlab-vx-s3 { left: 56.944vw; } .hlab-vx-ov-galaxy .hlab-vx-s4 { left: 81.944vw; }
.hlab-vx-ov-galaxy .hlab-vx-v { font-size: 2.222vw; line-height: 1; font-weight: 300; }
.hlab-vx-ov-galaxy .hlab-vx-l { font-size: 1.111vw; line-height: 1.2; font-weight: 400; }

/* Brain (four corners) */
.hlab-vx-ov-brain .hlab-vx-tl-left { position: absolute; top: 9.028vw; left: 1.667vw; width: 46vw; font-size: 5.556vw; }
.hlab-vx-ov-brain .hlab-vx-tl-right { position: absolute; right: 1.667vw; bottom: 1.667vw; width: 46vw; text-align: right; font-size: 5.556vw; }
.hlab-vx-ov-brain .hlab-vx-flank-left { position: absolute; top: calc(50% + 2.361vw); left: 1.667vw; width: 26.597vw; font-size: 1.111vw; line-height: 1.2; text-transform: uppercase; }
.hlab-vx-ov-brain .hlab-vx-flank-right { position: absolute; top: calc(50% + 2.361vw); right: 1.667vw; width: 14.583vw; text-align: right; font-size: 1.111vw; line-height: 1.2; text-transform: uppercase; }
.hlab-vx-ov-brain .hlab-vx-cta { position: absolute; bottom: 1.667vw; left: 1.667vw; }

/* ---------- reveals (Vesper spring-feel timings) ---------- */
.hlab-vx-tl { display: block; }
.hlab-vx-tl .hlab-vx-word { display: inline-block; white-space: nowrap; }
.hlab-vx-tl .hlab-vx-ch { display: inline-block; opacity: 0; filter: blur(12px); transition: opacity 1000ms var(--vx-eq), filter 1000ms var(--vx-eq); }
.hlab-vx-tl.hlab-vx-in .hlab-vx-ch { opacity: 1; filter: blur(0); }
.hlab-vx-tw { display: flex; flex-wrap: wrap; gap: 0 .25em; }
.hlab-vx-tw.hlab-vx-center { justify-content: center; }
.hlab-vx-tw.hlab-vx-right { justify-content: flex-end; }
.hlab-vx-tw .hlab-vx-wd { display: inline-block; opacity: 0; transform: translateY(16px); filter: blur(8px);
  transition: opacity 1200ms var(--vx-eq), transform 1200ms var(--vx-eq), filter 1200ms var(--vx-eq); }
.hlab-vx-tw.hlab-vx-in .hlab-vx-wd { opacity: 1; transform: none; filter: blur(0); }
.hlab-vx-ur { opacity: 0; transform: translateY(20px); filter: blur(10px); transition: opacity 1000ms var(--vx-eq), transform 1000ms var(--vx-eq), filter 1000ms var(--vx-eq); }
.hlab-vx-ur.hlab-vx-in { opacity: 1; transform: none; filter: blur(0); }

/* ---------- < 1024px: an editorial frame around the 3D figure ----------
   Headline at the top under the menu, the figure free in the middle, the
   supporting copy and the button anchored at the bottom (above the scroll hint). */
@media (max-width: 1023px) {
  .hlab-vx-ov .hlab-vx-title, .hlab-vx-ov .hlab-vx-cluster, .hlab-vx-ov .hlab-vx-support, .hlab-vx-ov .hlab-vx-tagline,
  .hlab-vx-ov-brain .hlab-vx-tl-left, .hlab-vx-ov-brain .hlab-vx-tl-right, .hlab-vx-ov-brain .hlab-vx-flank-left,
  .hlab-vx-ov-brain .hlab-vx-flank-right, .hlab-vx-ov .hlab-vx-cta, .hlab-vx-ov-hero .hlab-vx-tags,
  .hlab-vx-ov-galaxy .hlab-vx-stat { position: static; width: auto !important; transform: none !important; }
  .hlab-vx-ov { display: flex; flex-direction: column; align-items: flex-start;
    padding: calc(env(safe-area-inset-top, 0px) + 6.75rem) 1.5rem calc(env(safe-area-inset-bottom, 0px) + 6.5rem); }
  .hlab-vx-ov .hlab-vx-title, .hlab-vx-ov-brain .hlab-vx-tl-left, .hlab-vx-ov-brain .hlab-vx-tl-right {
    font-size: clamp(2.25rem, 10vw, 3.5rem) !important; line-height: .96; text-align: left; max-width: 12ch; }
  .hlab-vx-ov .hlab-vx-support { font-size: .9375rem; line-height: 1.45; max-width: 30ch; text-align: left; color: rgba(255,255,255,.86); }
  .hlab-vx-ov .hlab-vx-tw.hlab-vx-center { justify-content: flex-start; }

  /* orb: eyebrow + headline | figure | tags, support + button */
  .hlab-vx-ov-hero .hlab-vx-cluster { display: contents; }
  .hlab-vx-ov-hero .hlab-vx-tagline { order: 1; max-width: 46ch; margin-bottom: 1rem; font-size: .6875rem; line-height: 1.5;
    letter-spacing: .14em; color: rgba(255,255,255,.7); }
  .hlab-vx-ov-hero .hlab-vx-title { order: 2; max-width: 9.6em; }   /* three lines at any size: "une" starts the last one */
  .hlab-vx-ov-hero .hlab-vx-tags { order: 3; margin-top: auto; gap: .625rem; flex-wrap: wrap; font-size: .6875rem; letter-spacing: .06em; color: rgba(255,255,255,.7); }
  .hlab-vx-ov-hero .hlab-vx-tags i { width: 3px; height: 3px; opacity: .7; }
  .hlab-vx-ov-hero .hlab-vx-support { order: 4; margin-top: 1rem; }
  .hlab-vx-ov-hero .hlab-vx-cta { order: 5; margin-top: 1.25rem; }

  /* galaxy: headline | figure | support, then the four services in one row */
  .hlab-vx-ov-galaxy .hlab-vx-title { font-size: clamp(1.625rem, 6.8vw, 2.75rem) !important; line-height: 1; max-width: 18ch; }
  .hlab-vx-ov-galaxy .hlab-vx-cluster { margin-top: auto; width: 100%; height: auto; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem .75rem; }
  .hlab-vx-ov-galaxy .hlab-vx-support { grid-column: 1 / -1; }
  .hlab-vx-ov-galaxy .hlab-vx-rule, .hlab-vx-ov-galaxy .hlab-vx-vrule { display: none; }
  .hlab-vx-ov-galaxy .hlab-vx-stat { border-left: 0; border-top: 1px solid rgba(255,255,255,.28); padding: .625rem 0 0; gap: .3rem; }
  .hlab-vx-ov-galaxy .hlab-vx-v { font-size: 1.125rem; }
  .hlab-vx-ov-galaxy .hlab-vx-l { font-size: .6875rem; line-height: 1.3; color: rgba(255,255,255,.72); }

  /* brain: the sentence wraps the figure, top left to bottom right */
  .hlab-vx-ov-brain .hlab-vx-flank-right { order: 1; margin-bottom: 1rem; font-size: .6875rem; letter-spacing: .14em; color: rgba(255,255,255,.7); justify-content: flex-start; }
  .hlab-vx-ov-brain .hlab-vx-tl-left { order: 2; }
  .hlab-vx-ov-brain .hlab-vx-tl-right { order: 3; margin-top: auto; align-self: flex-end; text-align: right; }
  .hlab-vx-ov-brain .hlab-vx-flank-left { order: 4; align-self: flex-end; max-width: 30ch; margin-top: 1rem; font-size: .75rem; line-height: 1.45;
    letter-spacing: .04em; text-align: right; justify-content: flex-end; color: rgba(255,255,255,.8); }
  .hlab-vx-ov-brain .hlab-vx-cta { order: 5; align-self: flex-end; margin-top: 1.25rem; }

  .hlab-vx-send { height: 3.25rem; gap: .875rem; padding: 0 .3125rem 0 1.5rem; }
  .hlab-vx-send .hlab-vx-fill { padding: 0; font-size: 1rem; }
  .hlab-vx-send .hlab-vx-arrow { width: 2.625rem; height: 2.625rem; font-size: 0; }
}
/* shorter phones (the figure scales with the screen height, the copy does not) */
@media (max-width: 1023px) and (max-height: 780px) {
  .hlab-vx-ov { padding-top: calc(env(safe-area-inset-top, 0px) + 6.25rem); padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 5.75rem); }
  .hlab-vx-ov .hlab-vx-title, .hlab-vx-ov-brain .hlab-vx-tl-left, .hlab-vx-ov-brain .hlab-vx-tl-right { font-size: clamp(1.875rem, 9vw, 2.25rem) !important; }
  .hlab-vx-ov-galaxy .hlab-vx-title { font-size: clamp(1.5rem, 6.4vw, 1.75rem) !important; }
  .hlab-vx-ov .hlab-vx-support { font-size: .875rem; }
  .hlab-vx-ov-hero .hlab-vx-tagline { margin-bottom: .75rem; }
}
@media (max-width: 1023px) and (max-height: 700px) {
  .hlab-vx-ov-hero .hlab-vx-tags { display: none; }
  .hlab-vx-ov-hero .hlab-vx-support { margin-top: auto; }
}
/* phones held sideways: less frame, smaller headline */
@media (max-width: 1023px) and (max-height: 560px) {
  .hlab-vx-ov { padding: calc(env(safe-area-inset-top, 0px) + 5.25rem) 1.5rem 1.25rem; }
  .hlab-vx-ov .hlab-vx-title, .hlab-vx-ov-brain .hlab-vx-tl-left, .hlab-vx-ov-brain .hlab-vx-tl-right { font-size: clamp(1.5rem, 7vh, 2.25rem) !important; max-width: 20ch; }
  .hlab-vx-ov-hero .hlab-vx-tags, .hlab-vx-ov-brain .hlab-vx-flank-left { display: none; }
}
/* editor canvas: no scene, copy shown as-is */
.hlab-vx-static .hlab-vx-ch, .hlab-vx-static .hlab-vx-ur, .hlab-vx-static .hlab-vx-wd { opacity: 1 !important; filter: none !important; transform: none !important; }

@media (prefers-reduced-motion: reduce) {
  .hlab-vx-tl .hlab-vx-ch, .hlab-vx-tw .hlab-vx-wd, .hlab-vx-ur { transition: none !important; }
}

/* ---------- V3 scroll sweep chars (main headlines) ---------- */
.hlab-vx-ov .hlab-vx-word { display: inline-block; white-space: nowrap; }
.hlab-vx-ov .hlab-vx-bch { display: inline-block; }

/* ---------- Menu: light Apple-style glass, logo kept crisp ---------- */
.hlab-site-header .hlab-nav-bar {
  background: linear-gradient(180deg, rgba(255,255,255,.88) 0%, rgba(255,255,255,.80) 100%);
  -webkit-backdrop-filter: blur(30px) saturate(180%) brightness(1.1);
          backdrop-filter: blur(30px) saturate(180%) brightness(1.1);
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 20px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.85),
    inset 0 -1px 0 rgba(255,255,255,.22),
    inset 0 0 0 .5px rgba(255,255,255,.25),
    0 12px 40px -14px rgba(5,10,18,.55);
}
.hlab-site-header .hlab-nav-bar:hover {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 -1px 0 rgba(255,255,255,.25),
    inset 0 0 0 .5px rgba(255,255,255,.3),
    0 18px 50px -16px rgba(5,10,18,.6);
}
/* logo sits directly on the one glass surface (no separate backing) */
.hlab-site-header .hlab-nav-logo { padding: 0; background: none; box-shadow: none; border-radius: 0; }
.hlab-site-header .hlab-nav-links a { color: #0D141F; font-weight: 500; }
.hlab-site-header .hlab-nav-btn-grey { background: rgba(255,255,255,.62); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.6); }
.hlab-site-header .hlab-nav-btn-grey:hover { background: rgba(255,255,255,.85); }
.hlab-site-header .hlab-nav-menu-btn { background: rgba(255,255,255,.62); box-shadow: inset 0 0 0 1px rgba(255,255,255,.6); }
.hlab-site-header .hlab-nav-dropdown {
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.80));
  -webkit-backdrop-filter: blur(30px) saturate(180%) brightness(1.1);
          backdrop-filter: blur(30px) saturate(180%) brightness(1.1);
  border: 1px solid rgba(255,255,255,.55);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 18px 50px -18px rgba(5,10,18,.55);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .hlab-site-header .hlab-nav-bar, .hlab-site-header .hlab-nav-dropdown { background: rgba(255,255,255,.9); }
}


/* src/styles/hlab-x9-shell.css */
/* hlab-x9-shell.css — the SPM site's inner pages (shared shell built by hlab-0-shell.js):
   the homepage menu, contact form, FAQ and footer already come from hlab-styles.css and
   hlab-x1 … x8; these are the few rules that only make sense around an inner page.
   Moved from v3f-shell.css (SPM V3), renamed to the site's own classes. */

/* inner pages: clear the floating menu */
body.hlab-shell > main > :first-child { padding-top: clamp(40px, 5vw, 64px); }
/* the page body is navy here: square the footer's outer box so no navy shows at its corners */
body.hlab-shell .hlab-ti-footer { border-radius: 0 !important; background-color: #fff; }
/* the contact page is itself the form: the shared closing form is hidden there, its FAQ stays */
body:has(.spx-p-ct) .hlab-shell-tail .hlab-spm-lead { display: none !important; }

/* social proof figures (they replace the client / partner logo blocks site-wide) */
.spm-proof { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(18px, 2.6vw, 40px); margin: clamp(32px, 5vw, 56px) auto 0; max-width: 1120px; text-align: left; border-top: 1px solid rgba(13, 20, 31, .12); padding-top: clamp(22px, 3vw, 34px); }
.spm-proof-n { display: block; font-size: clamp(38px, 4.6vw, 68px); line-height: 1; letter-spacing: -.045em; font-weight: 400; color: #0d141f; font-variant-numeric: tabular-nums; }
.spm-proof-n small { font-size: .42em; letter-spacing: -.01em; margin-left: .12em; color: #22808a; }
.spm-proof-l { display: block; margin-top: 12px; font-size: 14px; line-height: 1.45; color: rgba(13, 20, 31, .64); max-width: 24ch; }
.spm-proof--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 20px; padding-top: 18px; gap: 18px; }
.spm-proof--3 .spm-proof-n { font-size: clamp(26px, 2.4vw, 34px); }
.spm-proof--3 .spm-proof-l { margin-top: 6px; font-size: 13px; }
@media (max-width: 900px) { .spm-proof { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spm-proof--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 480px) { .spm-proof--3 { grid-template-columns: 1fr; } }

/* Contact office maps: the caption chips sit above the linked map image */
.ct-office .ct-map-cap { z-index: 2; }

/* footer base row (built by hlab-spm-chrome.js): copyright left, studio credit bottom right */
.hlab-ft-base { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px 24px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--f-line); }
.hlab-ft-base .hlab-ft-copy { margin: 0; }
a.hlab-ft-credit { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: var(--f-mut); font-size: 13px; text-decoration: none; }
.hlab-ft-credit-n { color: var(--f-ink); letter-spacing: .01em; background-image: linear-gradient(currentColor, currentColor); background-repeat: no-repeat; background-position: 0 100%; background-size: 0% 1px; padding-bottom: 2px; transition: background-size .35s ease; }
a.hlab-ft-credit:hover .hlab-ft-credit-n, a.hlab-ft-credit:focus-visible .hlab-ft-credit-n { background-size: 100% 1px; }
.hlab-ft-credit-ar { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--f-line); color: var(--f-ink); font-size: 13px; line-height: 1; transition: transform .35s ease, background-color .35s ease, border-color .35s ease, color .35s ease; }
a.hlab-ft-credit:hover .hlab-ft-credit-ar, a.hlab-ft-credit:focus-visible .hlab-ft-credit-ar { transform: translate(2px, -2px); background-color: #22808a; border-color: #22808a; color: #fff; }
@media (max-width: 560px) { .hlab-ft-base { flex-direction: column; align-items: flex-start; gap: 0; } }

/* ---- client amendments 2026-10-29: reassurance, launch, métiers, AI, people ---- */
.spm-rs,.spm-ob,.spm-mt,.spm-ai,.spm-hu,.spm-b95{--spm-ink:#0D141F;--spm-slate:#1B2A38;--spm-teal:#22808A;--spm-line:#DADDE0;--spm-mut:#4d5964}
.spm-rs-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-top:44px}
.spm-rs-card,.spm-ai-grid>*{border:1px solid var(--spm-line);border-radius:18px;padding:24px 22px 26px;background:#fff}
.spm-rs-card h3,.spm-ai-grid h3{font-size:19px;line-height:1.25;margin:0 0 10px;color:var(--spm-ink);font-weight:600}
.spm-rs-card p,.spm-ai-grid p{font-size:15px;line-height:1.55;color:var(--spm-mut);margin:0}
.spm-rs-k{display:block;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--spm-teal);margin-bottom:14px;font-weight:600}
.spm-rs-method{margin-top:56px;border-top:1px solid var(--spm-line);padding-top:26px}
.spm-rs-method-t{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--spm-mut);margin:0 0 24px;font-weight:600}
.spm-rs .hlab-ti-lead,.spm-ob .hlab-ti-lead,.spm-mt .hlab-ti-lead,.spm-hu .hlab-ti-lead{margin-top:14px}
.spm-rs-audit .hlab-ti-panel-cta{flex:none;width:auto;min-width:220px;align-self:center;white-space:nowrap;justify-content:center}
/* homepage figures strip: three large figures under the 95 % statement */
.hlab-spm-logostrip .spm-proof--3{margin-top:clamp(24px,3vw,40px);padding-top:clamp(22px,3vw,34px);gap:clamp(18px,2.6vw,40px)}
.hlab-spm-logostrip .spm-proof--3 .spm-proof-n{font-size:clamp(38px,4.6vw,68px)}
.hlab-spm-logostrip .spm-proof--3 .spm-proof-l{margin-top:12px;font-size:14px}

/* ---- homepage sections v2 (client amendments, rebuilt 2026-10-30) ---- */
.spm2{--ink:#0d141f;--slate:#1b2a38;--steel:#43617a;--teal:#22808a;--teal-d:#1b6f78;--line:rgba(13,20,31,.1);--mut:#4f5f6d}
.spm2 .spm2-head{max-width:860px;margin:0 auto;text-align:center}
.spm2 .spm2-head .hlab-ti-eyebrow,.spm2 .spm2-center{text-align:center}
.spm2 .spm2-head .hlab-ti-lead{margin:18px auto 0;max-width:620px}
.spm2-center{text-align:center}
/* bento (stride-product): centred masthead over a 6 | 3 | 3 grid */
.spm2-bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;margin-top:56px}
.spm2-w6{grid-column:span 6}.spm2-w3{grid-column:span 3}
.spm2-c{position:relative;display:flex;flex-direction:column;min-height:260px;padding:28px;border-radius:16px;text-align:left;overflow:hidden}
.spm2-c .spm2-k{margin:0 0 auto;font-size:12px;letter-spacing:1.9px;text-transform:uppercase;color:var(--steel)}
.spm2-c .spm2-t{margin:40px 0 10px;font-size:26px;line-height:1.15;letter-spacing:-.02em;font-weight:600;color:var(--ink)}
.spm2-c .spm2-p{margin:0;font-size:15.5px;line-height:1.5;color:var(--mut)}
.spm2-c--dark{background:radial-gradient(120% 90% at 100% 0%,rgba(34,128,138,.38) 0%,rgba(34,128,138,0) 55%),linear-gradient(160deg,#2a3e51 0%,#1b2a38 55%,#15212c 100%);box-shadow:0 30px 60px -40px rgba(13,20,31,.6)}
.spm2-c--teal{background:radial-gradient(90% 120% at 0% 100%,rgba(255,255,255,.14) 0%,rgba(255,255,255,0) 60%),linear-gradient(150deg,#22808a 0%,#1b6f78 60%,#165e66 100%);box-shadow:0 30px 60px -40px rgba(27,111,120,.8)}
.spm2-c--dark .spm2-k,.spm2-c--teal .spm2-k{color:rgba(255,255,255,.62)}
.spm2-c--dark .spm2-t,.spm2-c--teal .spm2-t{color:#fff;font-size:32px;max-width:440px}
.spm2-c--dark .spm2-p,.spm2-c--teal .spm2-p{color:rgba(255,255,255,.74);max-width:440px}
.spm2-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.spm2-pills span{font-size:13px;color:rgba(255,255,255,.86);border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);border-radius:999px;padding:6px 12px}
.spm2-c--teal .spm2-cta{align-self:flex-start;margin-top:22px}
/* proof rail (altitude-stats): figure | centred statement | figure */
.spm2-proof{padding-top:40px}
.spm2-rail{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:48px;margin-top:28px;border-top:1px solid var(--line);padding-top:44px}
.spm2-mid{text-align:center;max-width:560px}
.spm2-big{display:block;font-size:clamp(120px,15vw,210px);line-height:.86;letter-spacing:-.06em;font-weight:400;color:var(--ink)}
.spm2-big small,.spm2-fig small{font-size:.32em;letter-spacing:-.01em;margin-left:.08em;color:var(--teal)}
.spm2-mid-t{margin:18px auto 0;font-size:clamp(20px,1.9vw,26px);line-height:1.25;letter-spacing:-.015em;color:var(--ink);font-weight:500;max-width:420px}
.spm2-fig{display:block;font-size:clamp(40px,4.4vw,64px);line-height:1;letter-spacing:-.045em;color:var(--ink);font-weight:400}
.spm2-lab{display:block;margin-top:12px;font-size:14px;line-height:1.45;color:var(--mut);max-width:22ch}
.spm2-flank--r{text-align:right}.spm2-flank--r .spm2-lab{margin-left:auto}
/* launch (lumora-stats): inverted inset panel, centred masthead, figures, step rail */
.spm2-panel{border-radius:28px;padding:84px 56px 56px;color:#fff;background:radial-gradient(70% 90% at 85% 0%,rgba(34,128,138,.5) 0%,rgba(20,48,60,.35) 45%,rgba(8,16,25,0) 75%),radial-gradient(60% 80% at 5% 100%,rgba(79,154,162,.2) 0%,rgba(8,16,25,0) 70%),#0b1520;box-shadow:0 40px 80px -50px rgba(13,20,31,.8)}
.spm2-head--inv .hlab-ti-eyebrow{color:#7fcbd1}
.spm2-head--inv .hlab-ti-h2{color:#fff}
.spm2-head--inv .hlab-ti-lead{color:rgba(255,255,255,.7)}
.spm2-figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:64px auto 0;max-width:960px;text-align:center}
.spm2-figs .spm2-fig{color:#fff;font-size:clamp(48px,5.4vw,80px)}
.spm2-figs .spm2-fig small{color:#7fcbd1}
.spm2-figs .spm2-lab{color:rgba(255,255,255,.66);margin:12px auto 0}
.spm2-steps{list-style:none;margin:64px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));position:relative}
.spm2-steps::before{content:"";position:absolute;left:8.33%;right:8.33%;top:7px;height:1px;background:linear-gradient(90deg,rgba(127,203,209,.15),rgba(127,203,209,.6),rgba(127,203,209,.15))}
.spm2-steps li{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding-top:30px}
.spm2-steps li::before{content:"";position:absolute;top:2px;left:50%;width:11px;height:11px;margin-left:-6px;border-radius:50%;background:#0b1520;border:1.5px solid #7fcbd1;box-shadow:0 0 0 4px rgba(127,203,209,.08)}
.spm2-steps b{font-size:12px;letter-spacing:1.6px;color:#7fcbd1;font-weight:500}
.spm2-steps span{font-size:15px;color:rgba(255,255,255,.88)}
.spm2-foot{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:52px}
.spm2-foot span{font-size:13px;color:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:7px 14px;background:rgba(255,255,255,.04)}
/* métiers (lumora-services rail, centred masthead): two columns of indexed rows */
.spm2-list{list-style:none;margin:56px auto 0;padding:0;max-width:1040px;display:grid;grid-template-columns:1fr 1fr;column-gap:56px;border-top:1px solid var(--line)}
.spm2-list li{display:flex;flex-direction:column;align-items:center;gap:4px;padding:24px 12px;border-bottom:1px solid var(--line);text-align:center}
.spm2-list i{font-style:normal;font-size:12px;letter-spacing:1.6px;color:var(--teal);margin-bottom:4px}
.spm2-list b{font-size:21px;line-height:1.25;letter-spacing:-.015em;font-weight:600;color:var(--ink)}
.spm2-list span{font-size:15px;line-height:1.45;color:var(--mut)}
.spm2-jobs .spm2-center{margin-top:40px}
/* AI (artist-process numerals): three columns, oversized faint index */
.spm2-tri{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:56px}
.spm2-tri>div{border-top:1px solid var(--line);padding-top:26px;text-align:left}
.spm2-tri i{display:block;font-style:normal;font-size:76px;line-height:.9;letter-spacing:-.05em;color:rgba(13,20,31,.09);font-weight:400}
.spm2-tri b{display:block;margin-top:18px;font-size:23px;letter-spacing:-.015em;color:var(--ink);font-weight:600}
.spm2-tri span{display:block;margin-top:8px;font-size:15.5px;line-height:1.5;color:var(--mut);max-width:34ch}
@media (max-width:1100px){.spm2-w6{grid-column:span 12}.spm2-w3{grid-column:span 6}.spm2-panel{padding:64px 32px 40px}.spm2-steps{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:28px}.spm2-steps::before{display:none}}
@media (max-width:760px){.spm2-bento{gap:12px;margin-top:40px}.spm2-w3{grid-column:span 12}.spm2-c{min-height:0;padding:24px}.spm2-c .spm2-t{margin-top:28px}.spm2-c--dark .spm2-t,.spm2-c--teal .spm2-t{font-size:27px}.spm2-rail{grid-template-columns:1fr 1fr;gap:32px 20px;padding-top:32px}.spm2-mid{grid-column:1 / -1;grid-row:1;max-width:none}.spm2-figs{grid-template-columns:1fr;gap:28px;margin-top:44px}.spm2-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.spm2-panel{padding:52px 22px 32px;border-radius:22px}.spm2-list{grid-template-columns:1fr}.spm2-tri{grid-template-columns:1fr;gap:28px}.spm2-tri i{font-size:60px}}
/* people (baseline-facilities mosaic): one tall training film beside four tiles, figures below */
.spm2-mosaic{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:290px 290px;gap:16px;margin-top:56px}
.spm2-m{position:relative;margin:0;border-radius:18px;overflow:hidden;background:#0d141f;grid-column:span 3;isolation:isolate}
.spm2-m--main{grid-column:span 6;grid-row:span 2;border-radius:22px}
.spm2-img,.spm2-vid{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.spm2-vid video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.spm2-m:hover .spm2-img,.spm2-m:hover .spm2-vid{transform:scale(1.04)}
.spm2-m::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(180deg,rgba(13,20,31,0),rgba(13,20,31,.55));pointer-events:none;z-index:1}
.spm2-m figcaption{position:absolute;left:16px;bottom:16px;z-index:2;font-size:13px;color:#fff;background:rgba(13,20,31,.38);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:6px 13px}
.spm2-hfigs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:52px;text-align:center;border-top:1px solid var(--line);padding-top:40px}
.spm2-hfigs .spm2-lab{margin:12px auto 0}
@media (max-width:900px){.spm2-mosaic{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:190px;gap:10px;margin-top:40px}.spm2-m{grid-column:span 1}.spm2-m--main{grid-column:span 2;grid-row:span 1;aspect-ratio:16/10;height:auto}.spm2-m figcaption{left:10px;bottom:10px;font-size:11.5px;padding:5px 10px}.spm2-hfigs{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px;margin-top:40px}}
/* savings simulator v2 */
.spm2-calc{padding-top:24px}
.spm2-calc-card{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);border-radius:24px;overflow:hidden;border:1px solid rgba(13,20,31,.08);background:linear-gradient(180deg,#fff 0%,#fafbfc 100%);box-shadow:0 1px 2px rgba(13,20,31,.04),0 40px 80px -60px rgba(13,20,31,.5)}
.spm2-calc-in{padding:48px 48px 44px;display:flex;flex-direction:column;justify-content:center;gap:38px;text-align:left}
.spm2-calc-k{margin:0;font-size:12px;letter-spacing:1.9px;text-transform:uppercase;color:var(--steel)}
.spm2-sl-top{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:16px}
.spm2-sl-top span{font-size:16px;color:var(--ink)}
.spm2-sl-v{font-size:22px;font-weight:500;letter-spacing:-.02em;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.spm2-sl-track{position:relative;height:6px;border-radius:99px;background:rgba(13,20,31,.08);cursor:pointer;touch-action:none;outline:none}
.spm2-sl-fill{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:linear-gradient(90deg,#43617a,#22808a)}
.spm2-sl-thumb{position:absolute;top:50%;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;background:#fff;border:1px solid rgba(13,20,31,.14);box-shadow:0 4px 14px -4px rgba(13,20,31,.35),0 0 0 5px rgba(34,128,138,.12);transition:box-shadow .2s ease,transform .2s ease}
.spm2-sl-track:focus-visible .spm2-sl-thumb,.spm2-sl-track:hover .spm2-sl-thumb{box-shadow:0 4px 14px -4px rgba(13,20,31,.35),0 0 0 8px rgba(34,128,138,.18)}
.spm2-calc-out{position:relative;padding:48px 44px 40px;color:#fff;display:flex;flex-direction:column;align-items:center;text-align:center;background:radial-gradient(90% 70% at 100% 0%,rgba(34,128,138,.55) 0%,rgba(34,128,138,0) 60%),linear-gradient(165deg,#1f3142 0%,#132130 60%,#0e1924 100%)}
.spm2-calc-out .spm2-calc-k{color:rgba(255,255,255,.6);align-self:stretch}
.spm2-gauge{--p:29;position:relative;width:208px;height:208px;margin:26px auto 0;border-radius:50%;background:conic-gradient(#5fc4cb calc(var(--p) * 1%),rgba(255,255,255,.1) 0);transition:--p .5s ease}
.spm2-gauge::before{content:"";position:absolute;inset:12px;border-radius:50%;background:#15232f;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.spm2-gauge-v{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:72px;letter-spacing:-.05em;font-weight:400;line-height:1;font-variant-numeric:tabular-nums}
.spm2-gauge-v small{font-size:.36em;color:#7fcbd1;margin-left:4px;align-self:center;letter-spacing:0}
.spm2-calc-l{margin:16px 0 0;font-size:15px;color:rgba(255,255,255,.72)}
.spm2-calc-sub{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-self:stretch;margin-top:28px}
.spm2-calc-sub>div{border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:14px 12px;background:rgba(255,255,255,.04)}
.spm2-calc-sub b{display:block;font-size:24px;font-weight:500;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.spm2-calc-sub span{display:block;margin-top:4px;font-size:12.5px;line-height:1.35;color:rgba(255,255,255,.62)}
.spm2-calc-out .spm2-cta{margin-top:26px;align-self:stretch}
.spm2-calc-note{margin:16px 0 0;font-size:12px;line-height:1.45;color:rgba(255,255,255,.5);max-width:320px}
@property --p{syntax:'<number>';inherits:false;initial-value:0}
@media (max-width:900px){.spm2-calc-card{grid-template-columns:1fr}.spm2-calc-in{padding:32px 24px}.spm2-calc-out{padding:36px 24px 30px}}

/* ---- depth + motion for the v2 sections (driven by hlab-sections.js; hidden states only apply under html.spm2-motion) ---- */
.spm2-launch .hlab-ti-wrap{perspective:1600px}
.spm2-panel{position:relative;overflow:hidden;isolation:isolate;background:#0b1520;transform-origin:50% 100%}
.spm2-panel>*{position:relative;z-index:2}
.spm2-panel>.spm2-panel-bg{position:absolute;inset:-10% 0;z-index:0;background-size:cover;background-position:50% 28%;transform:translate3d(0,var(--py,0px),0) scale(1.12);opacity:.6;filter:saturate(.85)}
.spm2-panel::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(70% 90% at 85% 0%,rgba(34,128,138,.42) 0%,rgba(20,48,60,.16) 45%,rgba(8,16,25,0) 75%),linear-gradient(180deg,rgba(11,21,32,.7) 0%,rgba(11,21,32,.8) 36%,rgba(11,21,32,.92) 68%,#0b1520 100%)}
.spm2-img,.spm2-vid{transform:translate3d(0,var(--py,0px),0) scale(var(--sc,1.1));will-change:transform}
.spm2-m:hover .spm2-img,.spm2-m:hover .spm2-vid{--sc:1.15;transform:translate3d(0,var(--py,0px),0) scale(1.15)}
.spm2-tri i{background:linear-gradient(180deg,rgba(34,128,138,.42) 0%,rgba(13,20,31,.07) 85%);-webkit-background-clip:text;background-clip:text;color:transparent}
.spm2-tilt{transition:transform .7s cubic-bezier(.16,1,.3,1),box-shadow .7s ease}
.spm2-tilt::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .5s ease;background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.14),rgba(255,255,255,0) 60%)}
.hlab-ti-card.spm2-tilt::after{background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(34,128,138,.08),rgba(34,128,138,0) 60%)}
.spm2-tilt.is-tilt::after{opacity:1}
/* hidden states */
.spm2-motion .spm2 .spm2-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em}
.spm2-motion .spm2 .spm2-wi{display:inline-block;transform:translateY(108%);transition:transform 1s cubic-bezier(.16,1,.3,1);transition-delay:calc(var(--i,0) * 55ms + 60ms)}
.spm2-motion .spm2.spm2-on .spm2-wi{transform:none}
.spm2-motion .spm2-rail,.spm2-motion .spm2-hfigs{border-top-color:transparent;position:relative}
.spm2-motion .spm2-rail::before,.spm2-motion .spm2-hfigs::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:var(--line);transform:scaleX(0);transition:transform 1.6s cubic-bezier(.65,0,.35,1) .2s}
.spm2-motion .spm2-on .spm2-rail::before,.spm2-motion .spm2-on .spm2-hfigs::before{transform:scaleX(1)}
.spm2-motion .spm2-steps::before{transform:scaleX(0);transform-origin:0 50%;transition:transform 1.8s cubic-bezier(.65,0,.35,1) .35s}
.spm2-motion .spm2-on .spm2-steps::before{transform:scaleX(1)}
.spm2-motion .spm2-steps li::before{transform:scale(0);transition:transform .6s cubic-bezier(.34,1.56,.64,1)}
.spm2-motion .spm2-steps li>*{opacity:0;transform:translateY(10px);transition:opacity .7s ease,transform .8s cubic-bezier(.16,1,.3,1)}
.spm2-motion .spm2-on .spm2-steps li::before{transform:scale(1)}
.spm2-motion .spm2-on .spm2-steps li>*{opacity:1;transform:none}
.spm2-motion .spm2-steps li:nth-child(1)::before,.spm2-motion .spm2-steps li:nth-child(1)>*{transition-delay:.5s}
.spm2-motion .spm2-steps li:nth-child(2)::before,.spm2-motion .spm2-steps li:nth-child(2)>*{transition-delay:.75s}
.spm2-motion .spm2-steps li:nth-child(3)::before,.spm2-motion .spm2-steps li:nth-child(3)>*{transition-delay:1s}
.spm2-motion .spm2-steps li:nth-child(4)::before,.spm2-motion .spm2-steps li:nth-child(4)>*{transition-delay:1.25s}
.spm2-motion .spm2-steps li:nth-child(5)::before,.spm2-motion .spm2-steps li:nth-child(5)>*{transition-delay:1.5s}
.spm2-motion .spm2-steps li:nth-child(6)::before,.spm2-motion .spm2-steps li:nth-child(6)>*{transition-delay:1.75s}
.spm2-motion .spm2-pills span,.spm2-motion .spm2-foot span{opacity:0;transform:translateY(8px);transition:opacity .6s ease,transform .7s cubic-bezier(.16,1,.3,1)}
.spm2-motion .spm2-on .spm2-pills span,.spm2-motion .spm2-on .spm2-foot span{opacity:1;transform:none}
.spm2-motion .spm2-pills span:nth-child(2),.spm2-motion .spm2-foot span:nth-child(2){transition-delay:.12s}
.spm2-motion .spm2-pills span:nth-child(3),.spm2-motion .spm2-foot span:nth-child(3){transition-delay:.24s}
.spm2-motion .spm2-foot span{transition-delay:2s}
.spm2-motion .spm2-foot span:nth-child(2){transition-delay:2.12s}
.spm2-motion .spm2-foot span:nth-child(3){transition-delay:2.24s}
.spm2-motion .spm2-list li{border-bottom-color:transparent;position:relative}
.spm2-motion .spm2-list li::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--line);transform:scaleX(0);transition:transform 1.2s cubic-bezier(.65,0,.35,1) .3s}
.spm2-motion .spm2-on .spm2-list li::after{transform:scaleX(1)}
.spm2-motion .spm2-tri i{display:block;transform:translateY(35%);opacity:0;transition:opacity .9s ease,transform 1.1s cubic-bezier(.16,1,.3,1)}
.spm2-motion .spm2-on .spm2-tri i{transform:none;opacity:1}
.spm2-motion .spm2-tri>div:nth-child(2) i{transition-delay:.15s}.spm2-motion .spm2-tri>div:nth-child(3) i{transition-delay:.3s}
.spm2-motion .spm2-people .spm2-m{clip-path:inset(22% 0 0 0 round 18px);opacity:0;transition:clip-path 1.3s cubic-bezier(.16,1,.3,1),opacity .9s ease}
.spm2-motion .spm2-people.spm2-on .spm2-m{clip-path:inset(0 0 0 0 round 18px);opacity:1}
.spm2-motion .spm2-people .spm2-m:nth-child(2){transition-delay:.12s}.spm2-motion .spm2-people .spm2-m:nth-child(3){transition-delay:.24s}.spm2-motion .spm2-people .spm2-m:nth-child(4){transition-delay:.36s}.spm2-motion .spm2-people .spm2-m:nth-child(5){transition-delay:.48s}
.spm2-motion .spm2-calc:not(.spm2-on) .spm2-gauge{--p:0 !important}
@media (prefers-reduced-motion:reduce){.spm2-img,.spm2-vid,.spm2-panel>.spm2-panel-bg{transform:none!important}}
.spm-rs-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.spm-rs-steps li{display:flex;flex-direction:column;gap:6px;padding-right:8px}
.spm-rs-steps b{font-size:13px;color:var(--spm-teal);font-weight:600;letter-spacing:.06em}
.spm-rs-steps span{font-size:15px;line-height:1.35;color:var(--spm-ink)}
.spm-rs-more{display:inline-block;margin-top:22px;font-size:15px;color:var(--spm-teal);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}
.spm-rs-audit{margin-top:44px;border-radius:22px;background:var(--spm-slate);color:#fff;padding:32px 38px;display:flex;gap:28px;align-items:center;justify-content:space-between}
.spm-rs-audit h3{font-size:22px;line-height:1.25;margin:0 0 8px;color:#fff;font-weight:600}
.spm-rs-audit p{margin:0;font-size:15.5px;line-height:1.55;color:rgba(255,255,255,.78);max-width:560px}
.spm-ob-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;margin-top:44px;align-items:start}
.spm-ob-time{display:flex;flex-direction:column;gap:18px}
.spm-ob-fig{display:flex;align-items:center;gap:22px;border:1px solid var(--spm-line);border-radius:20px;padding:22px 26px;background:#fff}
.spm-ob-n{font-weight:400;font-size:64px;line-height:1;color:var(--spm-ink)}
.spm-ob-u{font-size:15px;line-height:1.45;color:var(--spm-mut)}
.spm-ob-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.spm-ob-list li{padding:20px 0;border-top:1px solid var(--spm-line);font-size:16.5px;line-height:1.55;color:var(--spm-mut)}
.spm-ob-list li:last-child{border-bottom:1px solid var(--spm-line)}
.spm-ob-list b{color:var(--spm-ink);font-weight:600}
.spm-mt-grid{list-style:none;margin:44px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--spm-line)}
.spm-mt-grid li{padding:22px 22px 24px 0;border-bottom:1px solid var(--spm-line);display:flex;flex-direction:column;gap:8px}
.spm-mt-grid b{font-size:17px;line-height:1.3;color:var(--spm-ink);font-weight:600}
.spm-mt-grid span{font-size:14.5px;line-height:1.5;color:var(--spm-mut)}
.spm-ai-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:40px}
.spm-hu-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:44px;border-top:1px solid var(--spm-line)}
.spm-hu-grid>div{padding:26px 22px 0 0;display:flex;flex-direction:column;gap:10px}
.spm-hu-n{font-weight:400;font-size:56px;line-height:1;color:var(--spm-ink);letter-spacing:-.045em}
.spm-hu-n small{font-family:inherit;font-size:.34em;margin-left:6px;color:var(--spm-teal);font-weight:600;letter-spacing:0}
.spm-hu-l{font-size:15px;line-height:1.5;color:var(--spm-mut);max-width:240px}
.spm-b95-in{display:grid;grid-template-columns:auto minmax(0,1fr);gap:48px;align-items:center}
.spm-b95-n{font-weight:400;font-size:clamp(120px,17vw,220px);line-height:.9;color:var(--spm-ink);letter-spacing:-.04em}
.spm-b95-n small{font-family:inherit;font-size:.36em;color:var(--spm-teal);margin-left:8px;letter-spacing:0}
.spm-b95-t{font-size:clamp(26px,3.1vw,40px);line-height:1.18;color:var(--spm-ink);margin:0 0 16px;font-weight:600;letter-spacing:-.01em}
.spm-b95-s{font-size:17px;line-height:1.55;color:var(--spm-mut);margin:0;max-width:620px}
@media (max-width:1100px){.spm-rs-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.spm-rs-steps{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:22px}.spm-mt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.spm-ob-grid{grid-template-columns:1fr;gap:32px}.spm-hu-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:12px}}
@media (max-width:700px){.spm-rs-grid,.spm-ai-grid,.spm-mt-grid{grid-template-columns:1fr}.spm-rs-audit{flex-direction:column;align-items:flex-start;padding:26px 24px}.spm-b95-in{grid-template-columns:1fr;gap:18px}.spm-ob-n{font-size:52px}.spm-ob-fig{padding:18px 20px}.spm-hu-n{font-size:46px}.spm-rs-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* footer socials (SPM) */
.hlab-ft-bar { justify-content: space-between; }
.hlab-ft-social { display: flex; align-items: center; gap: 14px; margin: 0; padding: 0; list-style: none; }
.hlab-ft-social-l { color: var(--f-mut); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; margin-right: 4px; }
.hlab-ft-social a.hlab-ft-so { display: inline-grid; place-items: center; width: 44px; height: 44px; min-height: 44px; border-radius: 50%; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.03); color: var(--f-ink); transition: background-color .3s ease, border-color .3s ease, transform .3s ease; }
.hlab-ft-social a.hlab-ft-so svg { width: 18px; height: 18px; display: block; }
.hlab-ft-social a.hlab-ft-so:hover, .hlab-ft-social a.hlab-ft-so:focus-visible { background-color: #22808a; border-color: #22808a; transform: translateY(-2px); }
.hlab-ft-base { justify-content: space-between; }
.hlab-ft-base-l { display: flex; align-items: center; flex-wrap: wrap; column-gap: 28px; row-gap: 0; }
.hlab-ft-base .hlab-ft-legal { margin: 0; column-gap: 20px; }
@media (max-width: 767px) {
  .hlab-ft-bar { flex-direction: column; align-items: center; row-gap: 18px; }
  .hlab-ft-social-l { display: none; }
}
@media (max-width: 1023px) {
  .hlab-ft-base { flex-direction: column; align-items: center; text-align: center; gap: 4px; }
  .hlab-ft-base-l { flex-direction: column; align-items: center; row-gap: 2px; }
  .hlab-ft-base .hlab-ft-legal { justify-content: center; column-gap: 16px; }
}
/* call button in the top bar on tablet and mobile */
@media (max-width: 1079px) {
  .hlab-nav-actions { display: flex; margin-left: auto; }
  .hlab-nav-actions .hlab-nav-btn { display: none !important; }
  .hlab-nav-actions + .hlab-nav-menu-btn { margin-left: 8px; }
  .hlab-nav-actions .hlab-nav-icon.hlab-bx { width: 46px !important; height: 46px !important; border-radius: 11px; }
}
/* Métiers externalisables: ruled selector list driving a featured panel (GetLayers marcus-vane-voices) */
.spm2-mx{--mx-ink:#0D141F;--mx-deep:#1B2A38;--mx-steel:#43617A;--mx-teal:#22808A;--mx-lt:#7fcbd1;--mx-dur:6.5s;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4vw,64px);max-width:1160px;margin:56px auto 0;align-items:stretch;text-align:left}
.spm2-mx-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line,rgba(13,20,31,.12))}
.spm2-mx-list>li{border-bottom:1px solid var(--line,rgba(13,20,31,.12))}
.spm2-mx-t{all:unset;box-sizing:border-box;position:relative;display:grid;grid-template-columns:34px 1fr;align-items:baseline;width:100%;padding:14px 8px 14px 0;cursor:pointer;transition:padding .45s cubic-bezier(.2,.8,.2,1)}
.spm2-mx-t i{font-style:normal;font-size:12px;letter-spacing:1.6px;font-variant-numeric:tabular-nums;color:rgba(13,20,31,.38);transition:color .35s}
.spm2-mx-tn{display:flex;flex-direction:column;gap:3px;min-width:0}
.spm2-mx-tn b{font-size:clamp(17px,1.45vw,20px);line-height:1.25;letter-spacing:-.015em;font-weight:600;color:rgba(13,20,31,.42);transition:color .35s}
.spm2-mx-tn small{font-size:11px;letter-spacing:1.4px;text-transform:uppercase;color:rgba(13,20,31,.34);transition:color .35s}
.spm2-mx-bar{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--mx-teal);transform:scaleX(0);transform-origin:left;pointer-events:none}
.spm2-mx-t:hover b,.spm2-mx-t:focus-visible b{color:var(--mx-ink)}
.spm2-mx-t:focus-visible{outline:2px solid var(--mx-teal);outline-offset:2px;border-radius:6px}
.spm2-mx-t[aria-selected="true"]{padding-left:10px}
.spm2-mx-t[aria-selected="true"] i{color:var(--mx-teal)}
.spm2-mx-t[aria-selected="true"] b{color:var(--mx-ink)}
.spm2-mx-t[aria-selected="true"] small{color:var(--mx-steel)}
.spm2-mx-t[aria-selected="true"] .spm2-mx-bar{transform:scaleX(1);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.spm2-mx.is-auto .spm2-mx-t[aria-selected="true"] .spm2-mx-bar{transform:scaleX(0);animation:spm2MxBar var(--mx-dur) linear forwards}
.spm2-mx.is-hold .spm2-mx-t[aria-selected="true"] .spm2-mx-bar{animation-play-state:paused}
@keyframes spm2MxBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.spm2-mx-stage{position:relative;isolation:isolate;overflow:hidden;border-radius:28px;background:radial-gradient(120% 90% at 100% 0%,#22495a 0%,rgba(34,73,90,0) 55%),linear-gradient(160deg,var(--mx-deep) 0%,var(--mx-ink) 70%);color:#fff;box-shadow:0 40px 80px -40px rgba(13,20,31,.55),inset 0 0 0 1px rgba(255,255,255,.06);min-height:480px;display:grid;transform:perspective(1400px) rotateX(var(--mx-rx,0deg)) rotateY(var(--mx-ry,0deg));transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.spm2-mx-stage::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(80% 80% at 70% 30%,#000 0%,transparent 75%);mask-image:radial-gradient(80% 80% at 70% 30%,#000 0%,transparent 75%)}
.spm2-mx-glow{position:absolute;z-index:-1;width:520px;height:520px;left:var(--mx-gx,70%);top:var(--mx-gy,20%);transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(34,128,138,.42),rgba(34,128,138,0));pointer-events:none;transition:left .6s cubic-bezier(.2,.8,.2,1),top .6s cubic-bezier(.2,.8,.2,1)}
.spm2-mx-p{grid-area:1/1;position:relative;display:flex;flex-direction:column;padding:clamp(28px,3.4vw,48px);outline:none}
.spm2-mx.is-js .spm2-mx-p{visibility:hidden;pointer-events:none}
.spm2-mx.is-js .spm2-mx-p.is-on{visibility:visible;pointer-events:auto}
.spm2-mx-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.spm2-mx-chip{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:999px;font-size:11.5px;letter-spacing:1.3px;text-transform:uppercase;color:var(--mx-lt);background:rgba(34,128,138,.14);box-shadow:inset 0 0 0 1px rgba(127,203,209,.22)}
.spm2-mx-chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--mx-lt);box-shadow:0 0 0 4px rgba(127,203,209,.16)}
.spm2-mx-ct{flex:none;white-space:nowrap;font-size:12px;letter-spacing:1.6px;font-variant-numeric:tabular-nums;color:rgba(255,255,255,.45)}
.spm2-mx-ic{display:grid;place-items:center;width:58px;height:58px;margin-top:clamp(28px,4vw,52px);border-radius:16px;color:#fff;background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.03));box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),0 18px 36px -18px rgba(0,0,0,.6)}
.spm2-mx-ic svg{width:28px;height:28px}
.spm2-mx-h{margin:22px 0 0;font-size:clamp(28px,2.7vw,40px);line-height:1.08;letter-spacing:-.025em;font-weight:600;color:#fff;max-width:16ch}
.spm2-mx-d{margin:14px 0 0;font-size:16.5px;line-height:1.55;color:rgba(255,255,255,.7);max-width:44ch}
.spm2-mx-tags{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0}
.spm2-mx-tags li{padding:7px 12px;border-radius:10px;font-size:13px;color:rgba(255,255,255,.86);background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.spm2-mx-foot{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:0 20px;margin-top:auto;padding-top:30px;border-top:1px solid rgba(255,255,255,.1)}
.spm2-mx-fig{flex:1 1 300px;display:flex;align-items:baseline;gap:14px;margin:22px 0 0;max-width:440px}
.spm2-mx-fig strong{flex:none;font-size:clamp(38px,3.6vw,54px);line-height:1;letter-spacing:-.04em;font-weight:600;background:linear-gradient(180deg,#fff 0%,#9fd6db 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.spm2-mx-fig span{font-size:13.5px;line-height:1.45;color:rgba(255,255,255,.62)}
.spm2-mx-go{flex:none;margin-top:18px;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 6px 0 18px;border-radius:999px;font-size:14px;font-weight:500;color:#fff;text-decoration:none;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);transition:background-color .3s,box-shadow .3s}
.spm2-mx-go span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--mx-teal);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.spm2-mx-go:hover,.spm2-mx-go:focus-visible{background:rgba(34,128,138,.3);box-shadow:inset 0 0 0 1px rgba(127,203,209,.4)}
.spm2-mx-go:hover span,.spm2-mx-go:focus-visible span{transform:translateX(3px)}
.spm2-mx-num{position:absolute;right:clamp(18px,3vw,40px);top:clamp(54px,6vw,84px);z-index:-1;font-size:clamp(150px,17vw,250px);line-height:.8;font-weight:600;letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.1);font-variant-numeric:tabular-nums;transform:translate3d(var(--mx-nx,0px),var(--mx-ny,0px),0);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.spm2-mx.is-js .spm2-mx-p>*{opacity:0;transform:translateY(14px);filter:blur(4px);transition:opacity .45s ease,transform .6s cubic-bezier(.2,.8,.2,1),filter .45s ease}
.spm2-mx.is-js .spm2-mx-p.is-on>*{opacity:1;transform:none;filter:none}
.spm2-mx.is-js .spm2-mx-p.is-on>.spm2-mx-num{transform:translate3d(var(--mx-nx,0px),var(--mx-ny,0px),0)}
.spm2-mx.is-js .spm2-mx-p.is-on>.spm2-mx-ic{transition-delay:.05s}
.spm2-mx.is-js .spm2-mx-p.is-on>.spm2-mx-h{transition-delay:.1s}
.spm2-mx.is-js .spm2-mx-p.is-on>.spm2-mx-d{transition-delay:.16s}
.spm2-mx.is-js .spm2-mx-p.is-on>.spm2-mx-tags{transition-delay:.22s}
.spm2-mx.is-js .spm2-mx-p.is-on>.spm2-mx-foot{transition-delay:.28s}
.spm2-mx.is-js .spm2-mx-p:not(.is-on)>*{transition-duration:.25s;transition-delay:0s}
.spm2-mx:not(.is-js) .spm2-mx-stage{display:flex;flex-direction:column;gap:0}
.spm2-mx:not(.is-js) .spm2-mx-p+.spm2-mx-p{border-top:1px solid rgba(255,255,255,.1)}
@media (max-width:900px){
  .spm2-mx{grid-template-columns:1fr;gap:18px;margin-top:40px}
  .spm2-mx-list{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:clamp(20px,5vw,80px);border:0;margin:0 calc(-1*clamp(20px,5vw,80px));padding:2px clamp(20px,5vw,80px) 6px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .spm2-mx-list::-webkit-scrollbar{display:none}
  .spm2-mx-list>li{border:0;flex:none;scroll-snap-align:start}
  .spm2-mx-t{display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px rgba(13,20,31,.12);overflow:hidden}
  .spm2-mx-t[aria-selected="true"]{padding-left:16px;background:var(--mx-ink);box-shadow:none}
  .spm2-mx-t[aria-selected="true"] b{color:#fff}
  .spm2-mx-t[aria-selected="true"] i{color:var(--mx-lt)}
  .spm2-mx-tn small{display:none}
  .spm2-mx-tn b{font-size:14.5px;white-space:nowrap}
  .spm2-mx-bar{bottom:0;left:16px;right:16px;height:2px;background:var(--mx-lt)}
  .spm2-mx-stage{min-height:0;border-radius:22px;transform:none}
  .spm2-mx-num{font-size:150px;top:70px}
  .spm2-mx-chip{font-size:10.5px;letter-spacing:1.1px;padding:6px 11px;white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}
  .spm2-mx-foot{flex-direction:column;align-items:flex-start;gap:4px}
  .spm2-mx-fig{flex:none}
  .spm2-mx-go{margin-top:14px}
}
@media (prefers-reduced-motion:reduce){
  .spm2-mx *,.spm2-mx-stage{transition:none!important;animation:none!important}
  .spm2-mx.is-js .spm2-mx-p>*{filter:none}
}
/* ===== Homepage depth layer: ambient light, hairlines, layered shading (Apple-style) ===== */
@property --spm-ga{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes spmGa{to{--spm-ga:360deg}}

/* ambient light: a faint hairline at the top of each light section + two soft glows */
.spm2-rs,.spm2-proof,.spm2-jobs,.hlab-ti-fix,.hlab-ti-costing,.spm2-calc,.hlab-ti-intro,.spm2-ai,.hlab-ti-modular,.hlab-ti-builtby,.spm2-people,.hlab-spm-lead,.hlab-sf-sec{
  background-repeat:no-repeat;background-position:center top,0 0,0 0;background-size:min(1100px,86%) 1px,100% 100%,100% 100%}
.spm2-rs{background-image:linear-gradient(90deg,transparent,rgba(13,20,31,.09),transparent),radial-gradient(48% 42% at 2% 18%,rgba(34,128,138,.09),transparent 72%),radial-gradient(42% 38% at 98% 88%,rgba(67,97,122,.09),transparent 72%)}
.spm2-proof{background-image:linear-gradient(90deg,transparent,rgba(13,20,31,.09),transparent),radial-gradient(40% 70% at 50% 55%,rgba(34,128,138,.10),transparent 72%),radial-gradient(30% 40% at 95% 20%,rgba(67,97,122,.07),transparent 72%)}
.spm2-jobs{background-image:linear-gradient(90deg,transparent,rgba(13,20,31,.09),transparent),radial-gradient(45% 45% at 98% 40%,rgba(34,128,138,.09),transparent 72%),radial-gradient(40% 32% at 0% 55%,rgba(67,97,122,.08),transparent 72%)}
.hlab-ti-fix{background-image:linear-gradient(90deg,transparent,rgba(13,20,31,.09),transparent),radial-gradient(50% 40% at 50% 0%,rgba(34,128,138,.09),transparent 72%),radial-gradient(45% 40% at 100% 100%,rgba(67,97,122,.08),transparent 72%)}
.hlab-ti-costing{background-image:linear-gradient(90deg,transparent,rgba(13,20,31,.09),transparent),radial-gradient(40% 80% at 50% 100%,rgba(34,128,138,.09),transparent 72%),none}
.spm2-calc{background-image:none,radial-gradient(50% 50% at 50% 0%,rgba(34,128,138,.09),transparent 72%),radial-gradient(40% 40% at 0% 100%,rgba(67,97,122,.08),transparent 72%)}
.hlab-ti-intro{background-image:linear-gradient(90deg,transparent,rgba(13,20,31,.09),transparent),radial-gradient(40% 20% at 0% 12%,rgba(34,128,138,.08),transparent 72%),radial-gradient(40% 20% at 100% 70%,rgba(67,97,122,.08),transparent 72%)}
.spm2-ai{background-image:linear-gradient(90deg,transparent,rgba(13,20,31,.09),transparent),radial-gradient(45% 60% at 100% 30%,rgba(34,128,138,.09),transparent 72%),radial-gradient(40% 50% at 0% 90%,rgba(67,97,122,.07),transparent 72%)}
.hlab-ti-modular{background-image:linear-gradient(90deg,transparent,rgba(13,20,31,.09),transparent),radial-gradient(45% 40% at 0% 30%,rgba(34,128,138,.08),transparent 72%),radial-gradient(40% 40% at 100% 95%,rgba(67,97,122,.08),transparent 72%)}
.hlab-ti-builtby{background-image:linear-gradient(90deg,transparent,rgba(13,20,31,.09),transparent),radial-gradient(50% 55% at 50% 70%,rgba(34,128,138,.10),transparent 72%),none}
.spm2-people{background-image:linear-gradient(90deg,transparent,rgba(13,20,31,.09),transparent),radial-gradient(45% 30% at 100% 15%,rgba(34,128,138,.08),transparent 72%),radial-gradient(45% 30% at 0% 80%,rgba(67,97,122,.08),transparent 72%)}
.hlab-spm-lead{background-image:linear-gradient(90deg,transparent,rgba(13,20,31,.09),transparent),radial-gradient(45% 50% at 0% 40%,rgba(34,128,138,.09),transparent 72%),radial-gradient(40% 50% at 100% 70%,rgba(67,97,122,.09),transparent 72%)}
.hlab-sf-sec{background-image:linear-gradient(90deg,transparent,rgba(13,20,31,.09),transparent),radial-gradient(40% 50% at 0% 20%,rgba(34,128,138,.07),transparent 72%),none}

/* light cards: soft top-lit fill, hairline border, layered shadow */
.spm2-rs .hlab-ti-card,.hlab-ti-fix .hlab-ti-card,.spm2-calc-card,.hlab-ti-sticky-media{
  background:linear-gradient(180deg,#fff 0%,#f6f8fa 100%);border-color:rgba(13,20,31,.07);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 1px 2px rgba(13,20,31,.04),0 10px 24px -10px rgba(13,20,31,.10),0 34px 64px -34px rgba(13,20,31,.18);
  transition:box-shadow .45s ease}
.spm2-rs .hlab-ti-card:hover,.hlab-ti-fix .hlab-ti-card:hover{box-shadow:inset 0 1px 0 #fff,0 2px 4px rgba(13,20,31,.05),0 16px 34px -12px rgba(13,20,31,.16),0 48px 80px -40px rgba(13,20,31,.26)}

/* dark and teal cards: inner light edge */
.spm2-c--dark,.spm2-c--teal,.hlab-tm2-card,.spm2-calc-out,.hlab-spm-lead .hlab-spm-lead-form,.spm2-mx-stage{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),inset 0 0 0 1px rgba(255,255,255,.06),0 30px 60px -30px rgba(13,20,31,.55)}

/* Trois problèmes: a slowly moving gradient border on each card (runs only while on screen) */
.hlab-ti-fix .hlab-ti-card{border:2px solid transparent!important;
  background:linear-gradient(180deg,#fff 0%,#f6f8fa 100%) padding-box,
    conic-gradient(from var(--spm-ga),#22808A,#7fcbd1 22%,#43617A 46%,#DADDE0 70%,#7fcbd1 86%,#22808A) border-box!important;
  animation:spmGa 8s linear infinite;animation-play-state:paused}
.hlab-ti-fix .hlab-ti-card:nth-child(2){animation-delay:-2.7s}
.hlab-ti-fix .hlab-ti-card:nth-child(3){animation-delay:-5.4s}
.hlab-ti-fix.spm-vis .hlab-ti-card{animation-play-state:running}

/* figures: ink-to-steel gradient text */
.spm2-proof .spm2-big,.spm2-people .spm2-fig,.spm2-proof .spm2-fig,.hlab-ti-builtby .spm-proof-n,.hlab-spm-lead .spm-proof-n{
  background:linear-gradient(180deg,#0D141F 0%,#2c4256 70%,#43617A 100%);-webkit-background-clip:text;background-clip:text;color:transparent}

/* figure bands: frosted panels */
.spm2-proof .spm2-rail,.hlab-ti-builtby .spm-proof,.spm2-people .spm2-hfigs{
  border-radius:28px;border:1px solid rgba(13,20,31,.06)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.92) 0%,rgba(255,255,255,.62) 100%);
  box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(13,20,31,.04),0 24px 48px -28px rgba(13,20,31,.16);
  padding:clamp(22px,3vw,40px) clamp(18px,3vw,44px)!important}

/* L'IA prépare: the three steps become lit cards */
.spm2-ai .spm2-tri>div{border:1px solid rgba(13,20,31,.07)!important;border-radius:22px;padding:28px 26px!important;
  background:linear-gradient(180deg,#fff 0%,#f6f8fa 100%);
  box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(13,20,31,.04),0 18px 40px -24px rgba(13,20,31,.16);position:relative;overflow:hidden}
.spm2-ai .spm2-tri>div::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,#22808A,#7fcbd1,transparent)}
.spm2-ai .spm2-tri>div i{background:linear-gradient(180deg,#22808A,#7fcbd1);-webkit-background-clip:text;background-clip:text;color:transparent}

/* FAQ: answers sit in one lit panel */
.hlab-sf-panel.hlab-sf-active{border-radius:24px;padding:6px clamp(16px,2vw,28px);
  background:linear-gradient(180deg,#fff 0%,#f6f8fa 100%);border:1px solid rgba(13,20,31,.07);
  box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(13,20,31,.04),0 24px 48px -30px rgba(13,20,31,.18)}
.hlab-sf-panel.hlab-sf-active .hlab-sf-item:first-child{border-top-color:transparent}

/* active pills: lit dark gradient */
.hlab-tm2-tab.hlab-is-on,.hlab-sf-tab.hlab-sf-active{background-image:linear-gradient(180deg,#22303f 0%,#0D141F 100%)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 8px 20px -10px rgba(13,20,31,.5)!important}

@media (prefers-reduced-motion:reduce){.hlab-ti-fix .hlab-ti-card{animation:none}}
/* Sept problèmes: GetLayers stride-works, pinned 3D card cylinder on a dark stage */
.hlab-ti-fix.spm-w7-sec{padding:clamp(16px,2vw,28px) 0!important;background-image:none!important}
.spm-w7{position:relative}
.spm-w7-stick{position:relative;margin:0 clamp(10px,1.8vw,26px);border-radius:clamp(22px,2.4vw,34px);overflow:hidden;color:#fff;isolation:isolate;
  background:radial-gradient(90% 70% at 50% 110%,#16323d 0%,rgba(22,50,61,0) 60%),linear-gradient(180deg,#0D141F 0%,#101b28 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 40px 80px -40px rgba(13,20,31,.6)}
.spm-w7.is-on .spm-w7-stick{position:sticky;top:clamp(8px,1vw,14px);height:calc(100vh - 2*clamp(8px,1vw,14px))}
.spm-w7-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.spm-w7-glow{position:absolute;left:50%;top:58%;width:64vmax;height:64vmax;margin:-32vmax 0 0 -32vmax;contain:strict;border-radius:50%;opacity:0;will-change:transform,opacity;
  background:radial-gradient(closest-side,rgba(34,128,138,.38),rgba(34,128,138,.10) 45%,transparent 70%)}
.spm-w7-glow:nth-child(even){background:radial-gradient(closest-side,rgba(67,97,122,.45),rgba(67,97,122,.12) 45%,transparent 70%)}
.spm-w7-glow:nth-child(3n){background:radial-gradient(closest-side,rgba(127,203,209,.26),rgba(34,128,138,.10) 45%,transparent 70%)}
.spm-w7-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:56px 56px;
  -webkit-mask-image:radial-gradient(70% 60% at 50% 55%,#000,transparent 80%);mask-image:radial-gradient(70% 60% at 50% 55%,#000,transparent 80%)}
.spm-w7-stick::before,.spm-w7-stick::after{content:"";position:absolute;left:0;right:0;z-index:20;pointer-events:none}
.spm-w7-stick::before{top:0;height:36%;background:linear-gradient(180deg,#0D141F 0%,#0D141F 45%,rgba(13,20,31,0) 100%)}
.spm-w7-stick::after{bottom:0;height:24%;background:linear-gradient(0deg,#0f1925 0%,#0f1925 30%,rgba(15,25,37,0) 100%)}
.spm-w7-head{position:absolute;z-index:30;left:0;right:0;top:clamp(76px,9vh,110px);padding:0 24px;text-align:center}
.spm-w7-eb{color:#7fcbd1!important;margin:0 0 12px!important}
.spm-w7-h{margin:0;font-size:clamp(30px,3.7vw,58px);line-height:1.02;letter-spacing:-.03em;font-weight:600;color:#fff;
  background:linear-gradient(180deg,#fff 30%,#a9d6da 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.spm-w7-lead{margin:14px auto 0!important;text-align:center;max-width:560px;font-size:16px;line-height:1.55;color:rgba(255,255,255,.6)}
.spm-w7-stage{position:absolute;inset:0;z-index:10;perspective:1700px;transform-style:preserve-3d}
.spm-w7-c{position:absolute;left:50%;top:60%;width:min(88vw,62vh,40rem);cursor:pointer;backface-visibility:hidden;will-change:transform,opacity;
  transform:translate(-50%,-50%)}
.spm-w7-ci{position:relative;min-height:min(55vw,38.75vh,25rem);text-align:left;border-radius:26px;overflow:hidden;padding:clamp(22px,2.6vw,38px);display:flex;flex-direction:column;
  background:radial-gradient(120% 90% at var(--mx,80%) var(--my,0%),rgba(34,128,138,.32),rgba(34,128,138,0) 55%),linear-gradient(160deg,#1d3040 0%,#121d2a 60%,#0e1722 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 0 1px rgba(255,255,255,.07),0 50px 90px -40px rgba(0,0,0,.7);
  transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s}
.spm-w7-ci::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;opacity:0;transition:opacity .6s;
  background:conic-gradient(from var(--spm-ga),#22808A,#7fcbd1 22%,#43617A 46%,rgba(218,221,224,.7) 70%,#7fcbd1 86%,#22808A);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:spmGa 7s linear infinite;animation-play-state:paused}
.spm-w7-ci::after{content:"";position:absolute;inset:0;background:#05090f;opacity:var(--scrim,0);pointer-events:none;border-radius:inherit}
.spm-w7-c.is-focus .spm-w7-ci::before{opacity:1;animation-play-state:running}
.spm-w7-c.is-focus .spm-w7-ci{box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 0 1px rgba(127,203,209,.12),0 50px 110px -40px rgba(34,128,138,.55)}
.spm-w7-top{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:16px}
.spm-w7-k{font-size:12px;letter-spacing:1.8px;text-transform:uppercase;color:#7fcbd1}
.spm-w7-ic{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;color:#fff;background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.03));box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 16px 30px -14px rgba(0,0,0,.6)}
.spm-w7-ic svg{width:25px;height:25px}
.spm-w7-t{position:relative;z-index:2;margin:auto 0 0!important;padding-top:24px;max-width:18ch;font-size:clamp(26px,2.9vw,44px);line-height:1.04;letter-spacing:-.03em;font-weight:600;color:#fff}
.spm-w7-p{position:relative;z-index:2;margin:14px 0 0!important;max-width:46ch;font-size:clamp(14px,1.1vw,16.5px);line-height:1.55;color:rgba(255,255,255,.68)}
.spm-w7-n{position:absolute;z-index:1;right:clamp(14px,2.4vw,34px);bottom:-.12em;font-size:clamp(130px,15vw,230px);line-height:1;font-weight:600;letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.12);
  transform:translate3d(var(--nx,0px),var(--ny,0px),0);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.spm-w7.is-on .spm-w7-c .spm-w7-t,.spm-w7.is-on .spm-w7-c .spm-w7-p,.spm-w7.is-on .spm-w7-c .spm-w7-top{opacity:.35;transform:translateY(10px);transition:opacity .5s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.spm-w7.is-on .spm-w7-c.is-focus .spm-w7-top{opacity:1;transform:none}
.spm-w7.is-on .spm-w7-c.is-focus .spm-w7-t{opacity:1;transform:none;transition-delay:.06s}
.spm-w7.is-on .spm-w7-c.is-focus .spm-w7-p{opacity:1;transform:none;transition-delay:.14s}
.spm-w7-meta{position:absolute;z-index:30;left:clamp(20px,3vw,48px);right:clamp(20px,3vw,48px);bottom:clamp(22px,4vh,40px);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px}
.spm-w7-idx{justify-self:start;font-size:13px;letter-spacing:1.6px;color:rgba(255,255,255,.45);font-variant-numeric:tabular-nums}
.spm-w7-idx b{color:#fff;font-weight:600}
.spm-w7-name{justify-self:center;font-size:clamp(15px,1.4vw,20px);letter-spacing:-.01em;color:#fff;white-space:nowrap;transition:opacity .25s}
.spm-w7-name.is-swap{opacity:0}
.spm-w7-cta{justify-self:end;display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 6px 0 20px;border-radius:999px;color:#fff;font-size:14px;font-weight:500;text-decoration:none;
  background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);transition:background-color .3s,box-shadow .3s}
.spm-w7-cta span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#22808A;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.spm-w7-cta:hover,.spm-w7-cta:focus-visible{background:rgba(34,128,138,.32);box-shadow:inset 0 0 0 1px rgba(127,203,209,.5)}
.spm-w7-cta:hover span,.spm-w7-cta:focus-visible span{transform:translateX(3px)}
.spm-w7-dots{position:absolute;z-index:30;right:clamp(14px,2vw,30px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:10px}
.spm-w7-dot{all:unset;box-sizing:border-box;width:10px;height:10px;border-radius:50%;cursor:pointer;background:rgba(255,255,255,.18);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);transition:background-color .3s,transform .3s}
.spm-w7-dot:hover{background:rgba(255,255,255,.5)}
.spm-w7-dot.is-on{background:#7fcbd1;transform:scale(1.35);box-shadow:0 0 0 4px rgba(127,203,209,.16)}
.spm-w7-dot:focus-visible{outline:2px solid #7fcbd1;outline-offset:3px}
@media (max-height:820px){.spm-w7-lead{display:none}.spm-w7-c{top:58%}}
@media (max-width:700px){
  .spm-w7-c{width:88vw;top:56%}
  .spm-w7-ci{border-radius:22px;min-height:min(62vh,400px)}
  .spm-w7-head{top:84px}.spm-w7-lead{display:none}
  .spm-w7-meta{grid-template-columns:auto 1fr;bottom:18px}.spm-w7-name{display:none}
  .spm-w7-dots{display:none}
  .spm-w7-n{font-size:120px}
}
.spm-w7:not(.is-on) .spm-w7-stick{padding:clamp(56px,8vw,96px) clamp(16px,3vw,40px)}
.spm-w7:not(.is-on) .spm-w7-head,.spm-w7:not(.is-on) .spm-w7-stage,.spm-w7:not(.is-on) .spm-w7-meta{position:relative;inset:auto;top:auto;left:auto;right:auto;bottom:auto}
.spm-w7:not(.is-on) .spm-w7-stage{display:grid;gap:18px;max-width:46rem;margin:40px auto 0;perspective:none}
.spm-w7:not(.is-on) .spm-w7-c{position:relative;left:auto;top:auto;transform:none;width:auto;aspect-ratio:auto;min-height:300px}
.spm-w7:not(.is-on) .spm-w7-dots,.spm-w7:not(.is-on) .spm-w7-name,.spm-w7:not(.is-on) .spm-w7-idx,.spm-w7:not(.is-on) .spm-w7-stick::before,.spm-w7:not(.is-on) .spm-w7-stick::after{display:none}
.spm-w7:not(.is-on) .spm-w7-meta{margin-top:28px;display:flex;justify-content:center}
@media (prefers-reduced-motion:reduce){.spm-w7-ci::before{animation:none}}
/* home security card: link to the Sécurité & données page */
.spm2-seclink{display:inline-flex;align-items:center;gap:4px;margin-top:14px;font-size:14px;font-weight:600;color:#22808A;text-decoration:none;background-image:linear-gradient(currentColor,currentColor);background-repeat:no-repeat;background-position:0 100%;background-size:0 1px;padding-bottom:2px;transition:background-size .35s ease}
.spm2-seclink:hover,.spm2-seclink:focus-visible{background-size:100% 1px}
/* Métiers panels without a figure: keep the link on the right */
.spm2-mx-foot>.spm2-mx-go:only-child{margin-left:auto}
@media (max-width:900px){.spm2-mx-foot>.spm2-mx-go:only-child{margin-left:0}}
/* home testimonial: the approved quote is long, so it reads at a calmer size */
.hlab-spm-review .hlab-spm-review-quote{font-size:clamp(19px,2.15vw,33px)!important;line-height:1.32!important;max-width:980px!important}
@media (max-width:600px){.hlab-spm-review .hlab-spm-review-quote{font-size:18px!important;line-height:1.4!important}}
/* top menu: six items, buttons stay on one line */
.hlab-nav-btn{white-space:nowrap}
/* hero, first panel: subtitle under the title, « La fusion… » on the right above the button */
/* the visible hairline is drawn by the WebGL scene 18.36vw above the bottom on every viewport: title above it, subheading below it */
@media (min-width:1024px){
  /* the orb is centred and about 0.62 x the screen height wide: the title column stops short of it */
  .hlab-vx-ov-hero{--hx-av:max(calc(45.333vw - 32.5vh),22vw)}
  .hlab-vx-ov-hero .hlab-vx-title{top:auto!important;bottom:calc(18.36vw + 2.4vw);width:var(--hx-av);max-width:none;font-size:min(calc(var(--hx-av) / 5.3),11vh);font-weight:300;line-height:.93;letter-spacing:-.04em;text-shadow:0 2px 40px rgba(5,10,18,.35)}
  .hlab-vx-ov-hero>.hlab-vx-support{position:absolute;top:calc(100% - 18.36vw + 2.1vw);left:1.667vw;right:auto;width:31vw;font-size:1.25vw;font-weight:400;line-height:1.45;letter-spacing:-.003em;color:rgba(255,255,255,.78)}
  .hlab-vx-ov-hero .hlab-vx-tagline{left:auto;right:0;top:.407vw;bottom:auto;width:31vw;max-width:none;justify-content:flex-end;flex-wrap:wrap;text-align:right;white-space:normal;font-size:1.25vw;line-height:1.45}
}
/* « La fusion… »: same size and line grid as the subtitle, always two lines (break after « l'IA ») */
.hlab-vx-ov-hero .hlab-vx-tagline{text-transform:uppercase;font-weight:700;letter-spacing:.045em;color:#fff;text-shadow:0 1px 18px rgba(5,10,18,.6)}
.hlab-vx-ov-hero .hlab-vx-tagline>.hlab-vx-wd{order:1}
.hlab-vx-ov-hero .hlab-vx-tagline>.hlab-vx-wd:nth-child(n+8){order:3}
.hlab-vx-ov-hero .hlab-vx-tagline::after{content:"";flex-basis:100%;height:0;order:2}
@media (max-width:1023px){
  /* top group above the orb, bottom group pushed down by a spacer and ending above the line */
  .hlab-vx-ov-hero::before{content:"";order:3;flex:1 1 auto}
  .hlab-vx-ov-hero .hlab-vx-title{font-size:clamp(2.2rem,min(11.5vw,5.8vh),4rem)!important;font-weight:300;line-height:.95!important;letter-spacing:-.035em;max-width:11ch}
  .hlab-vx-ov-hero>.hlab-vx-support{order:2;margin-top:.85rem!important;max-width:36rem;font-size:clamp(.875rem,1.95vh,1rem);line-height:1.45;color:rgba(255,255,255,.8)}
  .hlab-vx-ov-hero .hlab-vx-tags{margin-top:0!important}
  .hlab-vx-ov-hero .hlab-vx-tagline{order:5;margin:1.25rem 0 0!important;max-width:36rem!important;font-size:clamp(.8rem,1.75vh,.92rem);letter-spacing:.03em;line-height:1.45}
  .hlab-vx-ov-hero .hlab-vx-cta{order:6;margin-top:1rem!important}
  .hlab-vx-ov-hero{padding-bottom:max(104px,calc(18.36vw + 2.25rem))!important}
}
@media (min-width:1080px) and (max-width:1320px){.hlab-nav-links{gap:11px!important}.hlab-nav-links a{font-size:13px!important}.hlab-nav-actions .hlab-nav-btn{padding-left:14px!important;padding-right:14px!important;font-size:12.5px!important}}
/* calculator v3: the two figures under the gauge read as large as the %, and every change is felt */
.spm2-calc-sub>div{padding:18px 16px}
.spm2-calc-sub b{font-size:clamp(26px,2.3vw,36px);line-height:1.05;font-weight:500}
@keyframes spmBump{0%{transform:scale(1)}35%{transform:scale(1.045)}100%{transform:scale(1)}}
@keyframes spmBumpBox{0%{border-color:rgba(127,203,209,.75);background:rgba(34,128,138,.24)}100%{border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.04)}}
.spm2-calc-sub>div.is-bump{animation:spmBumpBox .8s ease}
.spm2-calc-sub>div.is-bump b,.spm2-gauge-v.is-bump{animation:spmBump .45s cubic-bezier(.2,.8,.2,1)}
@media (prefers-reduced-motion:reduce){.spm2-calc-sub>div.is-bump,.spm2-calc-sub>div.is-bump b,.spm2-gauge-v.is-bump{animation:none}}
/* Métiers panels and « Vos équipes » card: one Pixabay photo per métier, toned into the panel (navy luminosity), faded under text */
.spm2-mx-p::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--mx-img) center 42%/cover no-repeat;filter:grayscale(1) contrast(1.12) brightness(.9);mix-blend-mode:luminosity;opacity:0;transition:opacity .7s ease;-webkit-mask-image:linear-gradient(180deg,transparent 20%,#000 46%,#000 66%,transparent 86%);mask-image:linear-gradient(180deg,transparent 20%,#000 46%,#000 66%,transparent 86%)}
.spm2-mx-p.is-on::before{opacity:.5}
#mx-p01{--mx-img:url(/uploads/vPGkvu9xWUQNfvI-rVPRt-spm-metier-01-depannage-sav.jpg)}
#mx-p02{--mx-img:url(/uploads/3UZ_IwmAwGSXC17JZbgTg-spm-metier-02-assistance-automobile.jpg)}
#mx-p03{--mx-img:url(/uploads/xyy38kDu_Qmsub8VzuOI--spm-metier-03-reclamations-commandes.jpg)}
#mx-p04{--mx-img:url(/uploads/tqCthHQ9coCbEICq_jfut-spm-metier-04-prise-de-rendez-vous.jpg)}
#mx-p05{--mx-img:url(/uploads/rmM6SGaapZZAE8PldMKQ_-spm-metier-05-portefeuille-clients.jpg)}
#mx-p06{--mx-img:url(/uploads/JUFT6vDkYiQtQSqdkF7eK-spm-metier-06-traitement-dossiers.jpg)}
#mx-p07{--mx-img:url(/uploads/-SrDcMM6bKT1Auu6KQN3r-spm-metier-07-secretariat-telephonique.jpg)}
#mx-p08{--mx-img:url(/uploads/A_mmrShfbzn1HKxTGf_4A-spm-metier-08-recrutement.jpg)}
#mx-p09{--mx-img:url(/uploads/s2x0a2SyNOrfiEwPaojP1-spm-metier-09-gestion-du-fret.jpg)}
#mx-p10{--mx-img:url(/uploads/0A3DE8quGjkIxAhCVHzT2-spm-metier-10-secretariat-juridique.jpg)}
#mx-p10::before{background-position:center 30%}
/* « 05 · Vos équipes »: two teams drawing together into one (SVG + CSS, plays while on screen) */
.spm2-team{position:relative;flex:1 1 auto;min-height:170px;margin:22px 0 2px;display:flex;align-items:center;justify-content:center}
.spm2-team svg{display:block;width:100%;height:100%;max-height:220px;overflow:visible;font-family:inherit}
.spm2-c:has(>.spm2-team) .spm2-k{margin-bottom:0}
.spm2-c:has(>.spm2-team) .spm2-t{margin-top:22px}
.spm2-team .t-ln{fill:none;stroke:rgba(67,97,122,.28);stroke-width:1;stroke-linecap:round}
.spm2-team .t-br{fill:none;stroke:rgba(34,128,138,.42);stroke-width:1.2;stroke-linecap:round;stroke-dasharray:200;stroke-dashoffset:0}
.spm2-team .t-run{fill:none;stroke:#22808A;stroke-width:1.8;stroke-linecap:round;stroke-dasharray:10 190;stroke-dashoffset:0;opacity:0}
.spm2-team .t-n{transform-box:fill-box;transform-origin:center}
.spm2-team .t-nv{fill:#1B2A38}
.spm2-team .t-tl{fill:#22808A}
.spm2-team .t-core{stroke:#fff;stroke-width:2}
.spm2-team .t-nv.t-core{filter:drop-shadow(0 2px 6px rgba(13,20,31,.28))}
.spm2-team .t-tl.t-core{filter:drop-shadow(0 2px 8px rgba(34,128,138,.45))}
.spm2-team .t-lb rect{fill:#fff;stroke:rgba(34,128,138,.35);stroke-width:1}
.spm2-team .t-lb text{font-size:10.8px;font-weight:500;letter-spacing:-.01em;fill:#1B2A38;text-anchor:middle}
.spm2-team .t-cap{font-size:7.6px;font-weight:500;letter-spacing:1.6px;fill:#43617A;text-anchor:middle}
.spm2-team .t-cap-r{fill:#22808A}
.spm2-team .t-lb{transform-box:fill-box;transform-origin:center}
@keyframes tInL{from{transform:translateX(-22px);opacity:0}to{transform:none;opacity:1}}
@keyframes tInR{from{transform:translateX(22px);opacity:0}to{transform:none;opacity:1}}
@keyframes tDraw{from{stroke-dashoffset:200}to{stroke-dashoffset:0}}
@keyframes tLb{from{transform:translateY(5px) scale(.94);opacity:0}to{transform:none;opacity:1}}
@keyframes tCap{from{opacity:0}to{opacity:1}}
@keyframes tFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-2.5px)}}
@keyframes tRun{0%{stroke-dashoffset:200;opacity:0}12%{opacity:1}88%{opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes tGlow{0%,22%,100%{fill:#fff;stroke:rgba(34,128,138,.35)}8%,14%{fill:#E9F4F5;stroke:#22808A}}
.spm2-team .t-in-l{animation:tInL .9s cubic-bezier(.2,.8,.2,1) .1s both}
.spm2-team .t-in-r{animation:tInR .9s cubic-bezier(.2,.8,.2,1) .1s both}
.spm2-team .t-br{animation:tDraw 1s cubic-bezier(.6,0,.2,1) both}
.spm2-team .t-br1{animation-delay:.7s}.spm2-team .t-br2{animation-delay:.9s}.spm2-team .t-br3{animation-delay:1.1s}
.spm2-team .t-lb{animation:tLb .6s cubic-bezier(.2,.8,.2,1) both}
.spm2-team .t-lb1{animation-delay:1.3s}.spm2-team .t-lb2{animation-delay:1.55s}.spm2-team .t-lb3{animation-delay:1.8s}
.spm2-team .t-cap{animation:tCap .8s ease .3s both}
.spm2-team .t-n{animation:tFloat 4.6s ease-in-out infinite}
.spm2-team .t-n:nth-child(2n){animation-duration:5.4s;animation-delay:-1.2s}
.spm2-team .t-n:nth-child(3n){animation-duration:6.2s;animation-delay:-2.6s}
.spm2-team .t-run{animation:tRun 3.6s ease-in-out infinite}
.spm2-team .t-run1{animation-delay:2.2s}.spm2-team .t-run2{animation-delay:3.4s}.spm2-team .t-run3{animation-delay:4.6s}
.spm2-team .t-lb rect{animation:tGlow 7.2s ease infinite}
.spm2-team .t-lb1 rect{animation-delay:2.4s}.spm2-team .t-lb2 rect{animation-delay:4.8s}.spm2-team .t-lb3 rect{animation-delay:7.2s}
.spm2-team *{animation-play-state:paused!important}
.spm-vis .spm2-team *{animation-play-state:running!important}
/* Sept problèmes: neon grid canvas (replaces the flat CSS grid when it runs) */
.spm-w7-fx{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.spm-w7-bg.has-fx .spm-w7-grid{opacity:0}
/* Simulateur v4 styles: switched off (kept for rollback); v5 follows after this block */
@media not all{
.spm-sim{--ink:#0d141f;--steel:#43617a;--teal:#22808a;--teal-d:#17656d;--line:rgba(13,20,31,.14);--err:#b3261e;color:var(--ink);font-family:inherit}
.spm-sim-intro{margin:0 auto 36px!important;align-self:center;max-width:620px;font-size:17px;line-height:1.5;color:#43617a;text-align:center}
.spm-sim *,.spm-sim *::before,.spm-sim *::after{box-sizing:border-box}
.spm-sim__card{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);border-radius:24px;overflow:hidden;border:1px solid rgba(13,20,31,.08);background:linear-gradient(180deg,#fff 0%,#fafbfc 100%);box-shadow:0 1px 2px rgba(13,20,31,.04),0 40px 80px -60px rgba(13,20,31,.5);text-align:left}
.spm-sim__in{padding:48px;display:flex;flex-direction:column;gap:28px;margin:0}
.spm-sim__field{display:flex;flex-direction:column;gap:8px}
.spm-sim__label{font-size:15px;font-weight:500}
.spm-sim__box{display:flex;align-items:center;border:1px solid var(--line);border-radius:10px;background:#fff;padding:0 14px;transition:border-color .2s,box-shadow .2s}
.spm-sim__box:focus-within{border-color:var(--teal);box-shadow:0 0 0 3px rgba(34,128,138,.22)}
.spm-sim__input{flex:1;min-width:0;width:100%;border:0;outline:0;background:transparent;font:inherit;font-size:20px;font-weight:500;color:var(--ink);padding:14px 0;font-variant-numeric:tabular-nums}
.spm-sim__input::placeholder{color:rgba(13,20,31,.35);font-weight:400}
.spm-sim__suffix{margin-left:8px;font-size:18px;color:var(--steel)}
.spm-sim__box.is-invalid{border-color:var(--err);border-width:2px;padding:0 13px}
.spm-sim__box.is-invalid:focus-within{box-shadow:0 0 0 3px rgba(179,38,30,.2)}
.spm-sim__help{margin:0;font-size:13.5px;line-height:1.4;color:var(--steel)}
.spm-sim__error{margin:0;font-size:13.5px;line-height:1.4;color:var(--err);font-weight:500}
.spm-sim__error:empty{display:none}
.spm-sim__out{padding:48px 44px 40px;color:#fff;display:flex;flex-direction:column;background:radial-gradient(90% 70% at 100% 0%,rgba(34,128,138,.55) 0%,rgba(34,128,138,0) 60%),linear-gradient(165deg,#1f3142 0%,#132130 60%,#0e1924 100%)}
.spm-sim__k{margin:0 0 20px;font-size:12px;letter-spacing:1.9px;text-transform:uppercase;color:rgba(255,255,255,.6)}
.spm-sim__results{min-height:220px}
.spm-sim__hint{margin:0;font-size:16px;line-height:1.5;color:rgba(255,255,255,.72)}
.spm-sim__figs{display:grid;grid-template-columns:1fr;gap:12px;margin:0}
.spm-sim__fig{border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:18px 16px;background:rgba(255,255,255,.04)}
.spm-sim__fig dt{font-size:13px;color:rgba(255,255,255,.62)}
.spm-sim__fig dd{margin:4px 0 0;font-size:clamp(30px,3vw,40px);line-height:1.05;font-weight:500;letter-spacing:-.02em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;color:#fff}
.spm-sim__detail{margin:18px 0 0;font-size:14px;line-height:1.5;color:rgba(255,255,255,.78)}
.spm-sim__cta{align-self:flex-start;margin-top:24px}
.spm-sim__note{margin:auto 0 0;padding-top:20px;font-size:12px;line-height:1.45;color:rgba(255,255,255,.55)}
.spm-sim :focus-visible{outline:3px solid var(--teal);outline-offset:2px}
.spm-sim__input:focus-visible{outline:0}
@media (max-width:820px){.spm-sim__card{grid-template-columns:1fr}.spm-sim__in{padding:32px 20px}.spm-sim__out{padding:32px 20px 28px}.spm-sim__results{min-height:0}}
@media (prefers-reduced-motion:reduce){.spm-sim *{transition:none!important;animation:none!important}}
}
/* Simulateur v5: pre-filled example, salary chips, steppers, slider, people row, animated figures, before/after bar */
.spm-sim{--ink:#0d141f;--steel:#43617a;--teal:#22808a;--teal-d:#17656d;--mint:#7fcbd1;--line:rgba(13,20,31,.12);--err:#b3261e;color:var(--ink);font-family:inherit}
.spm-sim-intro{margin:0 auto 36px!important;align-self:center;max-width:620px;font-size:17px;line-height:1.5;color:#43617a;text-align:center}
.spm-sim *,.spm-sim *::before,.spm-sim *::after{box-sizing:border-box}
.spm-sim__card{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);border-radius:28px;overflow:hidden;border:1px solid rgba(13,20,31,.08);background:linear-gradient(180deg,#fff 0%,#f7f9fa 100%);box-shadow:0 1px 2px rgba(13,20,31,.04),0 50px 90px -60px rgba(13,20,31,.55);text-align:left}
.spm-sim__in{padding:44px 48px;display:flex;flex-direction:column;gap:30px}
.spm-sim__step{display:flex;flex-direction:column;gap:12px}
.spm-sim__lab{display:flex;align-items:center;gap:12px;font-size:16px;font-weight:500}
.spm-sim__n{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#22808a,#17656d);color:#fff;font-size:13px;font-weight:600;box-shadow:0 6px 14px -6px rgba(34,128,138,.7)}
.spm-sim__box{display:flex;align-items:center;border:1px solid var(--line);border-radius:14px;background:#fff;padding:0 16px;transition:border-color .2s,box-shadow .2s,transform .2s}
.spm-sim__box:focus-within{border-color:var(--teal);box-shadow:0 0 0 4px rgba(34,128,138,.16);transform:translateY(-1px)}
.spm-sim__input{flex:1;min-width:0;width:100%;border:0;outline:0;background:transparent;font:inherit;font-size:26px;font-weight:500;letter-spacing:-.02em;color:var(--ink);padding:12px 0;font-variant-numeric:tabular-nums}
.spm-sim__input::placeholder{color:rgba(13,20,31,.3);font-weight:400}
.spm-sim__suffix{margin-left:8px;font-size:22px;color:var(--steel)}
.spm-sim__chips{display:flex;flex-wrap:wrap;gap:8px}
.spm-sim__chip{appearance:none;border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 14px;font:inherit;font-size:14px;font-weight:500;color:var(--steel);cursor:pointer;transition:all .2s}
.spm-sim__chip:hover{border-color:var(--teal);color:var(--teal-d);transform:translateY(-1px)}
.spm-sim__chip.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.spm-sim__help{margin:0;font-size:13.5px;line-height:1.4;color:var(--steel)}
.spm-sim__row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center}
.spm-sim__stepper{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden}
.spm-sim__stepper button{appearance:none;border:0;background:transparent;width:48px;height:56px;font-size:22px;color:var(--ink);cursor:pointer;transition:background .2s}
.spm-sim__stepper button:hover{background:#eef4f5}
.spm-sim__stepper button:active{background:#dfecee}
.spm-sim__stepper input{width:64px;text-align:center;border:0;outline:0;font:inherit;font-size:24px;font-weight:500;color:var(--ink);font-variant-numeric:tabular-nums;background:transparent}
.spm-sim__people{display:flex;flex-wrap:wrap;gap:5px;align-items:flex-end;min-height:30px}
.spm-sim__p{width:14px;height:22px;position:relative;color:#c9d3da;transition:color .35s,transform .35s}
.spm-sim__p::before{content:"";position:absolute;left:3px;top:0;width:8px;height:8px;border-radius:50%;background:currentColor}
.spm-sim__p::after{content:"";position:absolute;left:0;bottom:0;width:14px;height:12px;border-radius:7px 7px 3px 3px;background:currentColor}
.spm-sim__p.is-spm{color:var(--teal);transform:translateY(-3px)}
.spm-sim__more{font-size:13px;color:var(--steel);margin-left:4px}
.spm-sim__range{width:100%;-webkit-appearance:none;appearance:none;height:8px;border-radius:99px;background:linear-gradient(90deg,var(--teal) 0 var(--pc,40%),#e2e8ec var(--pc,40%) 100%);outline:0;cursor:pointer}
.spm-sim__range::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;border-radius:50%;background:#fff;border:2px solid var(--teal);box-shadow:0 6px 16px -4px rgba(13,20,31,.35);transition:transform .2s}
.spm-sim__range::-webkit-slider-thumb:hover{transform:scale(1.12)}
.spm-sim__range::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:#fff;border:2px solid var(--teal);box-shadow:0 6px 16px -4px rgba(13,20,31,.35)}
.spm-sim__rangeout{display:flex;justify-content:space-between;font-size:14px;color:var(--steel)}
.spm-sim__rangeout b{color:var(--ink);font-weight:600}
.spm-sim__error{margin:0;font-size:13.5px;color:var(--err);font-weight:500}
.spm-sim__error:empty{display:none}
.spm-sim__box.is-invalid{border-color:var(--err);box-shadow:0 0 0 4px rgba(179,38,30,.12)}
.spm-sim__out{position:relative;padding:44px 40px 36px;color:#fff;display:flex;flex-direction:column;overflow:hidden;background:radial-gradient(90% 70% at 100% 0%,rgba(34,128,138,.6) 0%,rgba(34,128,138,0) 60%),linear-gradient(165deg,#1f3142 0%,#132130 60%,#0e1924 100%)}
.spm-sim__out::before{content:"";position:absolute;width:340px;height:340px;right:-120px;bottom:-140px;border-radius:50%;background:radial-gradient(closest-side,rgba(127,203,209,.22),rgba(127,203,209,0));animation:spmSimFloat 9s ease-in-out infinite;pointer-events:none}
@keyframes spmSimFloat{0%,100%{transform:translate(0,0)}50%{transform:translate(-30px,-24px)}}
.spm-sim__top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 22px}
.spm-sim__k{margin:0;font-size:12px;letter-spacing:1.9px;text-transform:uppercase;color:rgba(255,255,255,.62)}
.spm-sim__tag{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;padding:5px 10px;border-radius:999px;border:1px solid rgba(127,203,209,.45);color:var(--mint);background:rgba(127,203,209,.08);transition:all .3s}
.spm-sim__tag.is-live{background:var(--mint);color:#0d141f;border-color:var(--mint)}
.spm-sim__big{margin:0;font-size:clamp(46px,4.6vw,66px);line-height:1;font-weight:500;letter-spacing:-.035em;font-variant-numeric:tabular-nums;background:linear-gradient(180deg,#fff 30%,#bfe6e9 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.spm-sim__bigl{margin:8px 0 0;font-size:14px;color:rgba(255,255,255,.7)}
.spm-sim__month{display:flex;align-items:baseline;gap:10px;margin:22px 0 0;padding:14px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05)}
.spm-sim__month b{font-size:26px;font-weight:500;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.spm-sim__month span{font-size:14px;color:rgba(255,255,255,.7)}
.spm-sim__bars{margin:22px 0 0;display:grid;gap:10px}
.spm-sim__bar{display:grid;grid-template-columns:92px minmax(0,1fr) auto;gap:10px;align-items:center;font-size:13px;color:rgba(255,255,255,.72)}
.spm-sim__track{height:10px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
.spm-sim__fill{display:block;height:100%;border-radius:99px;background:rgba(255,255,255,.45);transition:width .7s cubic-bezier(.2,.8,.2,1)}
.spm-sim__fill.is-spm{background:linear-gradient(90deg,#22808a,#7fcbd1)}
.spm-sim__bar em{font-style:normal;font-variant-numeric:tabular-nums;color:#fff}
.spm-sim__ctaw{position:relative;align-self:flex-start;margin-top:26px;display:inline-flex;border-radius:999px}
.spm-sim__ctaw .spm-sim__cta{margin:0}
.spm-sim__ctaw::after{content:"";position:absolute;inset:-2px;border-radius:inherit;pointer-events:none;box-shadow:0 0 0 0 rgba(127,203,209,0)}
.spm-sim__ctaw.is-ready::after{animation:spmSimPulse 1.6s ease-out 1}
@keyframes spmSimPulse{0%{box-shadow:0 0 0 0 rgba(127,203,209,.5)}100%{box-shadow:0 0 0 14px rgba(127,203,209,0)}}
.spm-sim__note{margin:28px 0 0!important;padding-top:18px;border-top:1px solid rgba(255,255,255,.08);font-size:12px;line-height:1.5;color:rgba(255,255,255,.5)}
.spm-sim :focus-visible{outline:3px solid var(--teal);outline-offset:2px}
.spm-sim__input:focus-visible,.spm-sim__stepper input:focus-visible{outline:0}
@media (max-width:860px){.spm-sim__hint2{display:none}.spm-sim__rangeout{justify-content:flex-end}.spm-sim__card{grid-template-columns:1fr}.spm-sim__in{padding:30px 20px}.spm-sim__out{padding:32px 22px 28px}.spm-sim__row{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.spm-sim *,.spm-sim *::before{transition:none!important;animation:none!important}}
/* Case-study pages (one per study) and the links to them on /secteurs */
.sec-chapters h3,.sec-chapters .sec-ch-h{font-size:19px;letter-spacing:normal;font-weight:500;line-height:1.3;margin:0 0 6px}
.sec-card-go{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-size:15px;font-weight:500;color:#17656d;text-decoration:none}
.sec-card-go span{transition:transform .25s ease}
.sec-card-go:hover span,.sec-card-go:focus-visible span{transform:translateX(4px)}
.sec-card-go:hover{color:#22808a}
.sec-crumb{color:inherit;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.sec-others-head{margin:clamp(72px,9vw,120px) 0 28px}
/* ---- Delivery audit, 2 Nov 2026 ---- */
/* Pourquoi SPM pillars: collapsed cards read as designed (soft gradient, open hint) on desktop; on phones every card shows its full text */
@media (min-width:861px){
  .why-col:not(.is-on){background:linear-gradient(180deg,#fff 0%,#eef4f6 100%);cursor:pointer;transition:background .5s ease,box-shadow .5s ease}
  .why-col:not(.is-on):hover{box-shadow:0 30px 60px -45px rgba(13,20,31,.45)}
  .why-col:not(.is-on)::before{content:"+";position:absolute;right:26px;top:22px;width:34px;height:34px;border-radius:50%;border:1px solid rgba(34,128,138,.35);display:grid;place-items:center;font-size:18px;line-height:1;color:#22808a;transition:transform .4s ease,background .4s ease}
  .why-col:not(.is-on):hover::before{transform:rotate(90deg);background:rgba(34,128,138,.08)}
}
@media (max-width:860px){
  .why-cols{height:auto!important;max-height:none!important}
  .why-col,.why-col.is-on{flex:0 0 auto!important;height:auto!important;min-height:0!important;overflow:visible!important;padding-bottom:28px!important}
  .why-col .why-col-body{max-height:none!important;overflow:visible!important;opacity:1!important;transform:none!important;margin-top:12px}
}
/* inner pages: eyebrow labels readable on light backgrounds (was #9aa3ab, 2.6:1); dark sections keep their own, more specific rule */
p.spx-eb{color:#66707a}
/* hero readability: Contact's animated background renders light under white text; Carrières' swirl runs under the text on phones. A navy veil sits behind the copy, the animation stays visible elsewhere. */
.spx-gl[data-spx-gl="soffit"]::after{background:linear-gradient(100deg,rgba(8,16,25,.82) 0%,rgba(8,16,25,.62) 42%,rgba(8,16,25,.28) 75%,rgba(8,16,25,.12) 100%)}
@media (max-width:860px){
  .spx-gl[data-spx-gl="soffit"]::after{background:linear-gradient(180deg,rgba(8,16,25,.55) 0%,rgba(8,16,25,.78) 40%,rgba(8,16,25,.72) 100%)}
  .spx-gl[data-spx-gl="feather"]::after{background:linear-gradient(180deg,rgba(10,17,22,.35) 0%,rgba(10,17,22,.7) 45%,rgba(10,17,22,.62) 100%)}
}
/* bigger touch targets on phones, same look */
@media (max-width:860px){
  .sec-card-go,.spm2-seclink,.spm-cs-eb a{display:inline-flex;align-items:center;min-height:44px;padding:10px 0;margin:-10px 0}
  .spm-sim__range{height:28px;padding:10px 0;background-clip:content-box}
  .spm2-mx-chip{font-size:11px!important}
  .spm-proof-n small{font-size:12px!important}
  /* inline links in running text (legal pages, careers, contact): taller hit area, same look */
  .spx-tx a,.spx-sm a,.spx-legal a,main p a,main li a,.spmp-check+label a,.lg-v a,.ct-jobs a{display:inline-block;padding:11px 0;margin:-11px 0}
  .spmp-check{width:24px!important;height:24px!important}
}
/* Case-study detail pages (/etude-de-cas-*): self-contained layout, site-wide (the spx stylesheets are scoped to other pages) */
.spm-cs{--ink:#0D141F;--steel:#43617A;--teal:#22808A;--teal-d:#17656d;color:var(--ink);font-family:inherit}
.spm-cs *{box-sizing:border-box}
.spm-cs-wrap{max-width:1200px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.spm-cs-hero{padding:clamp(150px,15vw,200px) 0 clamp(56px,7vw,90px);background:radial-gradient(80% 60% at 88% 0%,rgba(34,128,138,.16),rgba(34,128,138,0) 60%),linear-gradient(180deg,#eef3f5 0%,#fff 100%)}
.spm-cs-eb{margin:0 0 18px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-d)}
.spm-cs-eb a{color:inherit;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.spm-cs-h1{margin:0;max-width:20ch;font-size:clamp(38px,5.4vw,74px);line-height:1.03;letter-spacing:-.035em;font-weight:500;text-wrap:balance}
.spm-cs-lead{margin:22px 0 0;max-width:62ch;font-size:clamp(17px,1.4vw,20px);line-height:1.5;color:var(--steel)}
.spm-cs-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:clamp(40px,5vw,64px) 0 0;padding:0;list-style:none}
.spm-cs-kpi{padding:24px 24px 22px;border-radius:18px;background:#fff;border:1px solid rgba(13,20,31,.08);box-shadow:0 30px 60px -45px rgba(13,20,31,.45)}
.spm-cs-kpi b{display:block;font-size:clamp(36px,4vw,56px);font-weight:500;letter-spacing:-.03em;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
.spm-cs-kpi span{display:block;margin-top:10px;font-size:15px;line-height:1.4;color:var(--steel)}
.spm-cs-body{padding:clamp(56px,8vw,110px) 0}
.spm-cs-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,72px);align-items:start}
.spm-cs-media{margin:0;position:sticky;top:120px;border-radius:24px;overflow:hidden;aspect-ratio:4/5;background:#dfe5ea;box-shadow:0 40px 80px -55px rgba(13,20,31,.6)}
.spm-cs-media img{width:100%;height:100%;object-fit:cover;display:block}
.spm-cs-ch{list-style:none;margin:0;padding:0;border-top:1px solid rgba(13,20,31,.12)}
.spm-cs-ch li{display:grid;grid-template-columns:56px minmax(0,1fr);gap:12px;padding:32px 0;border-bottom:1px solid rgba(13,20,31,.12)}
.spm-cs-ch li>span{font-size:13px;letter-spacing:.12em;color:var(--teal-d);padding-top:7px;font-variant-numeric:tabular-nums}
.spm-cs-ch h2{margin:0 0 10px;font-size:clamp(22px,2vw,28px);font-weight:500;letter-spacing:-.015em;line-height:1.2}
.spm-cs-ch p{margin:0;font-size:17px;line-height:1.65;color:#2b3a48}
.spm-cs-more{padding:clamp(64px,8vw,110px) 0;background:#f3f6f8}
.spm-cs-h2{margin:0 0 clamp(28px,4vw,44px);font-size:clamp(30px,3.6vw,48px);line-height:1.08;letter-spacing:-.03em;font-weight:500}
.spm-cs-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.spm-cs-card{display:flex;flex-direction:column;border-radius:22px;overflow:hidden;background:#fff;border:1px solid rgba(13,20,31,.08);text-decoration:none;color:inherit;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.spm-cs-card:hover,.spm-cs-card:focus-visible{transform:translateY(-4px);box-shadow:0 40px 70px -45px rgba(13,20,31,.5)}
.spm-cs-card-ph{aspect-ratio:16/9;overflow:hidden;background:#dfe5ea}
.spm-cs-card-ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.spm-cs-card:hover .spm-cs-card-ph img{transform:scale(1.04)}
.spm-cs-card-in{padding:26px 26px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.spm-cs-card-in .spm-cs-eb{margin:0}
.spm-cs-card h3{margin:0;font-size:clamp(20px,1.7vw,24px);line-height:1.25;font-weight:500;letter-spacing:-.01em}
.spm-cs-card p{margin:0;font-size:15.5px;line-height:1.5;color:var(--steel)}
.spm-cs-go{margin-top:auto;padding-top:12px;font-size:15px;font-weight:500;color:var(--teal-d)}
.spm-cs-go span{display:inline-block;margin-left:6px;transition:transform .25s}
.spm-cs-card:hover .spm-cs-go span{transform:translateX(4px)}
.spm-cs-cta{padding:clamp(72px,10vw,130px) 0;text-align:center;color:#fff;background:radial-gradient(70% 90% at 80% 0%,rgba(34,128,138,.45),rgba(34,128,138,0) 60%),linear-gradient(165deg,#1B2A38 0%,#0D141F 100%)}
.spm-cs-cta .spm-cs-eb{color:#7fcbd1}
.spm-cs-cta h2{margin:0 auto;max-width:18ch;font-size:clamp(32px,4.4vw,58px);line-height:1.05;letter-spacing:-.03em;font-weight:500;color:#fff}
.spm-cs-cta p{margin:18px auto 0;max-width:56ch;font-size:18px;line-height:1.5;color:rgba(255,255,255,.75)}
.spm-cs-btn{display:inline-flex;align-items:center;gap:10px;margin-top:32px;padding:16px 28px;border-radius:999px;background:#fff;color:#0D141F;font-size:16px;font-weight:500;text-decoration:none;transition:transform .25s}
.spm-cs-btn:hover{transform:translateY(-2px)}
@media (max-width:860px){.spm-cs-grid{grid-template-columns:1fr}.spm-cs-media{position:relative;top:auto;aspect-ratio:16/10}.spm-cs-kpis,.spm-cs-cards{grid-template-columns:1fr}.spm-cs-hero{padding-top:130px}}
@media (prefers-reduced-motion:reduce){.spm2-team *{animation:none!important}}


/* src/styles/sections.css */
/* SPM marketing sections (Claude1). SPM brand palette (charte de marque p.35-36):
   Bleu Nuit #0D141F, Bleu Ardoise #1B2A38, Bleu Acier #43617A, Sarcelle #22808A,
   Gris Perle #DADDE0. White background; navy->teal accents. */

/* Base reset — keeps the marketing sections self-contained (no dependency on
   the old experiment stylesheets). */
html, body { margin: 0; background: #0d141f; }
.ti-root, .ti-root *, .ti-root *::before, .ti-root *::after { box-sizing: border-box; }
.ti-root h1, .ti-root h2, .ti-root h3, .ti-root h4, .ti-root h5, .ti-root p, .ti-root figure { margin: 0; }

.ti-root {
  --ti-bg: #ffffff;
  --ti-surface: #ffffff;
  --ti-soft: #f4f5f7;
  --ti-bg-1: #fcfdfd;
  --ti-bg-2: #f7f9f9;
  --ti-ink: #0d141f;
  --ti-muted: #43617a;
  --ti-line: rgba(13, 20, 31, .08);
  --ti-hair: rgba(13, 20, 31, .06);
  --ti-accent: #22808a;
  --ti-accent-2: #3aa3ad;
  --ti-navy-a: #2e9099;
  --ti-navy-b: #1b2a38;
  --ti-navy-c: #0d141f;
  --ti-radius: 16px;
  --ti-r-sm: 10px;
  --ti-r-md: 16px;
  --ti-r-lg: 22px;
  --ti-ease: cubic-bezier(.16, 1, .3, 1);
  --ti-shadow-sm: 0 1px 2px rgba(13, 20, 31, .04), 0 1px 1px rgba(13, 20, 31, .03);
  --ti-shadow-md: 0 1px 2px rgba(13, 20, 31, .03), 0 10px 34px -12px rgba(13, 20, 31, .10);
  --ti-shadow-lift: 0 2px 4px rgba(13, 20, 31, .04), 0 22px 48px -20px rgba(13, 20, 31, .16);
  --ti-ink-2: rgba(13, 20, 31, .62);
  --ti-ink-3: rgba(13, 20, 31, .42);
  --ti-space-2xs: 8px;
  --ti-space-xs: 12px;
  --ti-space-sm: 16px;
  --ti-space-md: 24px;
  --ti-space-lg: 32px;
  --ti-space-xl: 48px;
  --ti-space-2xl: 64px;
  --ti-space-3xl: 96px;
  --ti-space-4xl: 128px;
  --ti-noise: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='140'%20height='140'%3E%3Cfilter%20id='n'%3E%3CfeTurbulence%20type='fractalNoise'%20baseFrequency='0.8'%20numOctaves='2'%20stitchTiles='stitch'/%3E%3CfeColorMatrix%20type='saturate'%20values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA%20type='linear'%20slope='0.05'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect%20width='100%25'%20height='100%25'%20filter='url(%23n)'/%3E%3C/svg%3E");
  position: relative;
  z-index: 2;
  background: var(--ti-bg);
  color: var(--ti-ink);
  font-family: var(--font-body), 'Bricolage Grotesque', system-ui, sans-serif;
}

.ti-sec { padding: clamp(52px, 8vh, 104px) clamp(20px, 5vw, 80px); }
.ti-wrap { max-width: 1200px; margin: 0 auto; }
.ti-eyebrow { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: #17656d; }
.ti-h2 { font-size: clamp(30px, 4.6vw, 60px); font-weight: 600; line-height: 1.02; letter-spacing: -.025em; margin: 0; color: var(--ti-ink); text-wrap: balance; }
.ti-lead { font-size: clamp(16px, 1.4vw, 19px); line-height: 1.6; color: var(--ti-muted); text-wrap: pretty; }

/* ---- Reveal ---- */
.ti-reveal { will-change: transform, opacity, filter; }
.ti-anim .ti-reveal { opacity: 0; transform: translateY(26px); filter: blur(6px); }
.ti-anim .ti-reveal.ti-in { opacity: 1; transform: none; filter: blur(0); transition: opacity .5s cubic-bezier(.16,1,.3,1), transform 1s cubic-bezier(.16,1,.3,1), filter .7s cubic-bezier(.16,1,.3,1); }

/* ===== A — Powering ===== */
.ti-powering {
  text-align: center;
  background:
    linear-gradient(rgba(13,20,31,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(13,20,31,.05) 1px, transparent 1px),
    var(--ti-bg);
  background-size: 46px 46px, 46px 46px, auto;
  background-position: center;
}
.ti-powering .ti-eyebrow { margin-bottom: var(--ti-space-md); }
.ti-powering .ti-h2 { max-width: 16ch; margin: 0 auto; }

/* ===== B — Cards ===== */
.ti-fix { text-align: center; background: var(--ti-bg); }
.ti-fix .ti-h2 { max-width: 20ch; margin: 0 auto; }
.ti-fix .ti-lead { max-width: 52ch; margin: var(--ti-space-md) auto 0; }
.ti-cards3 {
  margin-top: clamp(40px, 6vh, 72px);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  text-align: left;
}
.ti-card {
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
  border: 1px solid var(--ti-line);
  border-radius: var(--ti-r-md);
  padding: 24px;
  box-shadow: var(--ti-shadow-sm), inset 0 1px 0 rgba(255,255,255,.7);
  transition: transform .4s var(--ti-ease), box-shadow .4s var(--ti-ease), border-color .4s var(--ti-ease);
}
.ti-card:hover { transform: translateY(-3px); box-shadow: var(--ti-shadow-lift), inset 0 1px 0 rgba(255,255,255,.85); border-color: rgba(34,128,138,.28); }
.ti-card-label { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--ti-accent); display: flex; justify-content: space-between; }
.ti-card-media {
  margin: 18px 0;
  aspect-ratio: 4 / 3;
  border-radius: var(--ti-r-sm);
  background: linear-gradient(135deg, #eaecef, #dadde0);
  border: 1px solid var(--ti-line);
}
.ti-card-title { font-size: 19px; font-weight: 600; line-height: 1.25; margin: 0 0 16px; letter-spacing: -.01em; color: var(--ti-ink); }
.ti-card-text { font-size: 14px; line-height: 1.6; color: var(--ti-muted); margin: 0 0 var(--ti-space-md); }
.ti-btn {
  align-self: flex-start;
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--ti-ink);
  background: transparent;
  color: var(--ti-ink);
  border-radius: 999px;
  padding: 10px 20px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
  transition: background .25s var(--ti-ease), color .25s var(--ti-ease), border-color .25s var(--ti-ease), transform .2s var(--ti-ease);
}
.ti-btn:hover { background: var(--ti-ink); color: #fff; transform: translateY(-1px); }
.ti-btn:focus-visible, .spm-ftr-pill:focus-visible, .tm2-cta:focus-visible, .ti-car-btn:focus-visible, .sf-tab:focus-visible, .tm2-tab:focus-visible, .tm2-arrow:focus-visible, .spm-lead-submit:focus-visible, .ti-cards3 .ti-card-cta:focus-visible { outline: 2px solid rgba(34,128,138,.6); outline-offset: 3px; }
.ti-btn--fill { background: var(--ti-ink); color: #fff; }
.ti-btn--fill:hover { background: #000; }
.ti-btn--green { background: var(--ti-accent); border-color: var(--ti-accent); color: #ffffff; box-shadow: 0 1px 2px rgba(13,20,31,.14), inset 0 1px 0 rgba(255,255,255,.20); transition: transform .2s var(--ti-ease), background .25s var(--ti-ease), border-color .25s var(--ti-ease), box-shadow .25s var(--ti-ease); }
.ti-btn--green:hover { background: var(--ti-navy-b); border-color: var(--ti-navy-b); color: #ffffff; transform: translateY(-1px); box-shadow: 0 5px 16px rgba(13,20,31,.18), inset 0 1px 0 rgba(255,255,255,.20); }
.ti-cards3 .ti-card-cta { align-self: stretch; width: 100%; justify-content: center; text-align: center; background: var(--ti-navy-c); border-color: var(--ti-navy-c); color: #fff; box-shadow: 0 1px 2px rgba(13,20,31,.20), inset 0 1px 0 rgba(255,255,255,.10); transition: transform .2s var(--ti-ease), background .25s var(--ti-ease), border-color .25s var(--ti-ease), box-shadow .25s var(--ti-ease); }
.ti-cards3 .ti-card-cta:hover { background: var(--ti-navy-b); border-color: var(--ti-navy-b); color: #fff; transform: translateY(-1px); box-shadow: 0 6px 18px rgba(13,20,31,.24), inset 0 1px 0 rgba(255,255,255,.12); }

/* ===== C — Costing ===== */
.ti-costing { text-align: center; background: var(--ti-bg); }
.ti-costing .ti-h2 { max-width: 16ch; margin: 0 auto; }
.ti-costing .ti-eyebrow { color: #17656d; }

/* ===== D — Calculator ===== */
.ti-calc { padding-top: 0; background: var(--ti-bg); }
.ti-calc-head { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: var(--ti-space-lg); }
.ti-calc-head h3 { font-size: clamp(22px, 2.4vw, 30px); font-weight: 600; line-height: 1.1; margin: 0; letter-spacing: -.01em; color: var(--ti-ink); }
.ti-calc-form {
  background: var(--ti-surface);
  border: 1px solid var(--ti-line);
  border-radius: var(--ti-r-lg);
  padding: clamp(24px, 3vw, 44px);
  box-shadow: var(--ti-shadow-md), inset 0 1px 0 rgba(255,255,255,.7);
}
.ti-fields { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ti-field { display: flex; flex-direction: column; gap: 8px; }
.ti-field label { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ti-muted); }
.ti-field input[type="number"] {
  font: inherit;
  font-size: 16px;
  padding: 12px 14px;
  border: 1px solid var(--ti-line);
  border-radius: var(--ti-r-sm);
  background: #fafbfc;
  color: var(--ti-ink);
}
.ti-field input:focus { outline: 2px solid rgba(34,128,138,.4); outline-offset: 1px; }
.ti-slider-row { margin-top: var(--ti-space-lg); }
.ti-slider-row .ti-slider-top { display: flex; justify-content: space-between; font-size: 13px; color: var(--ti-muted); margin-bottom: 10px; }
.ti-slider-row .ti-slider-top b { color: var(--ti-ink); font-weight: 600; }
.ti-range { position: relative; width: 100%; height: 6px; border-radius: 999px; background-color: #dfe2e5; cursor: pointer; margin-top: 4px; touch-action: none; }
.ti-range-fill { position: absolute; left: 0; top: 0; bottom: 0; width: 46%; border-radius: 999px; background: linear-gradient(90deg, var(--ti-accent-2), var(--ti-accent)); pointer-events: none; }
.ti-range-thumb { position: absolute; top: 50%; left: 46%; width: 22px; height: 22px; border-radius: 50%; background: var(--ti-accent); border: 3px solid #fff; box-shadow: 0 2px 6px rgba(13,20,31,.25); transform: translate(-50%, -50%); pointer-events: none; }
.ti-range:focus-visible { outline: 2px solid rgba(34,128,138,.5); outline-offset: 4px; }

.ti-calc-panel {
  margin-top: var(--ti-space-md);
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: clamp(24px, 4vw, 60px);
  align-items: center;
  border-radius: var(--ti-radius);
  padding: clamp(26px, 3.5vw, 48px);
  color: #eaf6f7;
  background: radial-gradient(130% 130% at 10% 0%, var(--ti-navy-a) 0%, var(--ti-accent) 26%, var(--ti-navy-b) 66%, var(--ti-navy-c) 100%);
}
.ti-panel-num-label { font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: rgba(234,246,247,.72); }
.ti-panel-num { font-size: clamp(44px, 6vw, 78px); font-weight: 600; letter-spacing: -.02em; line-height: 1; margin: 10px 0 8px; color: #ffffff; }
.ti-panel-sub { font-size: 14px; color: rgba(234,246,247,.78); }
.ti-panel-rows { display: flex; flex-direction: column; gap: 0; }
.ti-panel-row { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.12); font-size: 14px; }
.ti-panel-row:last-of-type { border-bottom: 0; }
.ti-panel-row span:last-child { font-weight: 600; }
.ti-panel-cta { margin-top: var(--ti-space-md); width: 100%; justify-content: center; }
.ti-calc-panel .ti-btn--green { background: #ffffff; border-color: #ffffff; color: var(--ti-navy-c); }
.ti-calc-panel .ti-btn--green:hover { background: var(--ti-accent-2); border-color: var(--ti-accent-2); color: #ffffff; }

/* ===== E — Intro / sticky features ===== */
.ti-intro { text-align: center; }
.ti-intro .ti-h2 { max-width: 18ch; margin: 0 auto; }
.ti-intro .ti-lead { max-width: 62ch; margin: var(--ti-space-md) auto 0; }
.ti-hero-media {
  margin: clamp(36px, 6vh, 72px) auto 0;
  max-width: 1100px;
  aspect-ratio: 16 / 8;
  border-radius: 20px;
  background:
    radial-gradient(80% 120% at 72% 8%, rgba(58,163,173,.30), transparent 60%),
    linear-gradient(135deg, #43617a 0%, #1b2a38 55%, #0d141f 100%);
  border: 1px solid var(--ti-line);
}
.ti-sticky-wrap { margin-top: clamp(48px, 8vh, 110px); display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 5vw, 80px); align-items: start; text-align: left; }
.ti-sticky-media { position: sticky; top: 96px; aspect-ratio: 3 / 4; border-radius: 18px; background: linear-gradient(160deg, #6d93ad, #43617a 55%, #1b2a38); border: 1px solid var(--ti-line); }
.ti-feature-list { display: flex; flex-direction: column; }
.ti-feature { padding: clamp(30px, 6vh, 64px) 0; border-top: 1px solid var(--ti-line); }
.ti-feature:first-child { border-top: 0; }
.ti-feature h4 { font-size: clamp(22px, 2.6vw, 34px); font-weight: 600; line-height: 1.1; margin: 0 0 var(--ti-space-sm); letter-spacing: -.01em; color: var(--ti-ink); text-wrap: balance; }
.ti-feature p { font-size: 15px; line-height: 1.65; color: var(--ti-muted); margin: 0; }
/* Apple-style focus: the feature nearest the viewport centre resolves, the
   others recede — driven by sections.js toggling .ti-active. */
.ti-feature.ti-fade { opacity: .32; transform: translateY(6px); transition: opacity .6s cubic-bezier(.16,1,.3,1), transform .6s cubic-bezier(.16,1,.3,1); }
.ti-feature.ti-fade.ti-active { opacity: 1; transform: none; }

/* ===== F — Carousel ===== */
.ti-modular { text-align: center; overflow: hidden; }

/* ===== ti-modular (tm2) — Terminal-Industries spec, SPM brand (2026-09-18) ===== */
.tm2-panels { margin-top: 48px; }
.tm2-bar { margin: clamp(30px,5vh,52px) 0 0; }
.tm2-tabs { column-gap: 12px; row-gap: 12px; }
.tm2-tab { font-size: 13px; letter-spacing: .18em; padding: 12px 18px; border-radius: 8px; border: .8px solid var(--ti-line); background: transparent; color: var(--ti-muted); transition: background-color .3s cubic-bezier(.39,.575,.565,1), color .3s cubic-bezier(.39,.575,.565,1), border-color .3s cubic-bezier(.39,.575,.565,1); }
.tm2-tab.is-on { background: rgba(13,20,31,.05); color: var(--ti-ink); border-color: transparent; }
.tm2-tab:hover { color: var(--ti-ink); }
.tm2-nav { column-gap: 10px; }
.tm2-arrow { width: 52px; height: 52px; border-radius: 8px; border: .8px solid var(--ti-line); background: rgba(13,20,31,.05); -webkit-backdrop-filter: blur(5.5px); backdrop-filter: blur(5.5px); color: var(--ti-ink); font-size: 18px; transition: background .25s var(--ti-ease), color .25s var(--ti-ease), border-color .25s var(--ti-ease); }
.tm2-arrow:hover { background: var(--ti-accent); border-color: var(--ti-accent); color: #fff; }
.tm2-cards { column-gap: 20px; }
.tm2-card { isolation: isolate; min-height: clamp(520px, 64vh, 700px); border-radius: 20px; }
.tm2-card::before { content: ""; position: absolute; inset: -6%; z-index: 0; background-size: cover; background-position: center; filter: blur(16px) saturate(1.05); transform: scale(1.05); }
.tm2-card::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.tm2-card-inner { z-index: 2; padding: clamp(24px, 2vw, 40px); }
.tm2-card[data-tone="teal"] { background: #1b6f78; }
.tm2-card[data-tone="teal"]::before { background-image: url("/uploads/rPHM_DTTEDVkPeEkP-gQ1-pexels-photo-8867198-w1600.webp"); }
.tm2-card[data-tone="teal"]::after { background: linear-gradient(160deg, rgba(46,144,153,.82), rgba(13,20,31,.9)); }
.tm2-card[data-tone="navy"] { background: #0d141f; }
.tm2-card[data-tone="navy"]::before { background-image: url("/uploads/mN_T8F8geLrTdaibOyYGd-pexels-photo-7658410-w1600.webp"); }
.tm2-card[data-tone="navy"]::after { background: linear-gradient(160deg, rgba(27,42,56,.86), rgba(13,20,31,.92)); }
.tm2-card[data-tone="steel"] { background: #43617a; }
.tm2-card[data-tone="steel"]::before { background-image: url("/uploads/xj7hQX3FreL2RIn1pdZak-pexels-photo-2422294-w1600.webp"); }
.tm2-card[data-tone="steel"]::after { background: linear-gradient(160deg, rgba(67,97,122,.82), rgba(13,20,31,.9)); }
.tm2-card[data-tone="grey"] { background: #1b2a38; }
.tm2-card[data-tone="grey"]::before { background-image: url("/uploads/HAh-jcweZcEjb13J-1mDm-pexels-photo-7580709-w1600.webp"); }
.tm2-card[data-tone="grey"]::after { background: linear-gradient(160deg, rgba(34,128,138,.78), rgba(27,42,56,.9)); }
.tm2-title { line-height: 1.2; letter-spacing: -.01em; text-wrap: balance; }
.tm2-body { line-height: 1.46; margin-top: 28px; }
.tm2-cta { margin-top: auto; align-self: flex-start; display: inline-flex; align-items: center; gap: 10px; padding: 15px 26px; border-radius: 10px; background: #f3f4f4; color: var(--ti-navy-c); font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; white-space: nowrap; opacity: 0; transform: translateY(10px); pointer-events: none; box-shadow: var(--ti-shadow-sm), inset 0 1px 0 rgba(255,255,255,.85); transition: opacity .5s var(--ti-ease) .06s, transform .5s var(--ti-ease) .06s, background .25s var(--ti-ease); }
.tm2-cta span { transition: transform .25s var(--ti-ease); }
.tm2-cta:hover { background: #fff; transform: translateY(-1px); }
.tm2-cta:hover span { transform: translateX(3px); }
.tm2-card.is-open .tm2-cta { opacity: 1; transform: none; pointer-events: auto; }
@media (prefers-reduced-motion: reduce) { .tm2-cta { transition: none; } .tm2-card::before { filter: none; } }
@media (max-width: 860px) { .tm2-card::before { inset: 0; filter: blur(10px); transform: scale(1.04); } .tm2-cta { opacity: 1; transform: none; pointer-events: auto; } }
.ti-modular .ti-h2 { max-width: 16ch; margin: 0 auto; }
.ti-carousel-outer { margin-top: clamp(40px, 6vh, 72px); }
.ti-carousel {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding: 6px 2px 20px;
  scrollbar-width: none;
  cursor: grab;
}
.ti-carousel::-webkit-scrollbar { display: none; }
.ti-carousel.ti-dragging { cursor: grabbing; scroll-snap-type: none; }
.ti-slide {
  flex: 0 0 min(560px, 82vw);
  scroll-snap-align: start;
  border-radius: var(--ti-r-lg);
  padding: clamp(24px, 3vw, 40px);
  min-height: 420px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  text-align: left;
  user-select: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 1px 2px rgba(13,20,31,.05), 0 20px 44px -24px rgba(13,20,31,.30);
}
.ti-slide--green { background: linear-gradient(160deg, var(--ti-accent-2), var(--ti-accent) 60%, #1b6f78); color: #ffffff; }
.ti-slide--grey { background: linear-gradient(180deg, #eef0f2, #e6e8eb); color: var(--ti-ink); box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 1px 2px rgba(13,20,31,.05), 0 20px 44px -24px rgba(13,20,31,.18); }
.ti-slide--dark { background: linear-gradient(160deg, #1b2a38, #0d141f); color: #eaf6f7; }
.ti-slide-tag { font-size: 12px; letter-spacing: .16em; text-transform: uppercase; opacity: .75; }
.ti-slide-media { margin: 20px 0; aspect-ratio: 16/9; border-radius: var(--ti-r-sm); background: rgba(255,255,255,.16); }
.ti-slide--grey .ti-slide-media { background: rgba(13,20,31,.10); }
.ti-slide h4 { font-size: clamp(22px, 2.4vw, 30px); font-weight: 600; line-height: 1.15; margin: 0 0 10px; letter-spacing: -.01em; }
.ti-slide p { font-size: 14px; line-height: 1.6; margin: 0; opacity: .85; }
.ti-carousel-ctrls { display: flex; align-items: center; gap: 16px; margin-top: var(--ti-space-md); }
.ti-car-track { flex: 1; height: 3px; border-radius: 999px; background: var(--ti-line); overflow: hidden; }
.ti-car-bar { height: 100%; width: 30%; background: var(--ti-accent); border-radius: 999px; transition: width .2s ease, transform .2s ease; }
.ti-car-btn { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--ti-ink); background: transparent; color: var(--ti-ink); cursor: pointer; display: grid; place-items: center; transition: background .25s ease, color .25s ease; }
.ti-car-btn:hover { background: var(--ti-accent); border-color: var(--ti-accent); color: #fff; }
.ti-car-btn:disabled { opacity: .3; cursor: default; }
.ti-car-btn:disabled:hover { background: transparent; color: var(--ti-ink); }

/* ===== G — Built by ===== */
.ti-builtby { text-align: center; background: linear-gradient(rgba(13,20,31,.05) 1px, transparent 1px) center / 46px 46px, linear-gradient(90deg, rgba(13,20,31,.05) 1px, transparent 1px) center / 46px 46px, var(--ti-bg); }
/* Logo strip (Ils nous font confiance) — grid bg + 3/line + eyebrow spacing; scoped to beat the .ti-root p reset */
.spm-logostrip { background: linear-gradient(rgba(13,20,31,.05) 1px, transparent 1px) center / 46px 46px, linear-gradient(90deg, rgba(13,20,31,.05) 1px, transparent 1px) center / 46px 46px, var(--ti-bg); }
.spm-logostrip .spm-logostrip-eyebrow { margin-bottom: clamp(40px, 6vh, 72px); }
.spm-logostrip .spm-logos-grid { display: grid; grid-template-columns: repeat(3, 1fr); place-items: center; max-width: 780px; column-gap: 32px; row-gap: 40px; margin-left: auto; margin-right: auto; }
@media (max-width: 560px) { .spm-logostrip .spm-logos-grid { grid-template-columns: repeat(2, 1fr); } }
.ti-builtby .ti-h2 { max-width: 20ch; margin: 0 auto; }
.ti-logos { margin: clamp(48px, 7vh, 80px) auto 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px 32px; align-items: center; max-width: 780px; }
.ti-logo { height: 46px; border-radius: 8px; background: rgba(13,20,31,.04); display: grid; place-items: center; color: var(--ti-ink-3); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 0 0 1px rgba(13,20,31,.04); }

/* ===== Footer (baseline-footer composition — minimal, no watermark) ===== */
.ti-footer { display: block; padding: clamp(16px, 1.8vw, 30px); border-top: 0; background: transparent; color: #f4f7f9; font-size: 14px; }
.spm-ftr-wrap { max-width: 1200px; margin: 0 auto; }
.spm-ftr-cta { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; flex-wrap: wrap; }
.spm-ftr-eyebrow { display: inline-flex; align-items: center; gap: 9px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--ti-accent-2); margin: 0 0 16px; }
.spm-ftr-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ti-accent-2); }
.spm-ftr-h { font-size: clamp(28px, 3.4vw, 44px); line-height: 1.04; font-weight: 600; letter-spacing: -.02em; color: #fff; margin: 0; max-width: 16ch; text-wrap: balance; }
.spm-ftr-pill { display: inline-flex; align-items: center; gap: 10px; padding: 14px 26px; border-radius: 999px; background: #fff; color: var(--ti-navy-c); font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap; transition: background .25s ease, color .25s ease, transform .25s ease; }
.spm-ftr-pill:hover { background: var(--ti-accent); color: #fff; transform: translateY(-2px); }
.spm-ftr-rule { height: 1px; background: rgba(255,255,255,.12); margin: clamp(34px, 5vh, 56px) 0; }
.spm-ftr-cols { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: clamp(28px, 4vw, 64px); }
.spm-ftr-brand { max-width: 360px; }
.spm-ftr-logo { height: 58px; width: 106px; display: block; margin-bottom: 22px; }
.spm-ftr-tag { font-size: 14px; line-height: 1.6; color: rgba(234,246,247,.7); margin: 0 0 20px; }
.spm-ftr-contact { display: flex; flex-direction: column; gap: 7px; }
.spm-ftr-contact a { font-size: 14px; color: #fff; text-decoration: none; opacity: .85; transition: opacity .2s ease, color .2s ease; }
.spm-ftr-contact a:hover { opacity: 1; color: var(--ti-accent-2); }
.spm-ftr-col-h { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: rgba(234,246,247,.5); margin: 0 0 16px; }
.spm-ftr-col a { display: block; font-size: 14px; color: rgba(234,246,247,.82); text-decoration: none; padding: 5px 0; transition: color .2s ease, transform .2s ease; }
.spm-ftr-col a:hover { color: #fff; transform: translateX(3px); }
.spm-ftr-meta { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 13px; color: rgba(234,246,247,.55); }
.spm-ftr-legal { display: flex; gap: 22px; }
.spm-ftr-legal a { color: rgba(234,246,247,.55); text-decoration: none; transition: color .2s ease; }
.spm-ftr-legal a:hover { color: #fff; }
@media (max-width: 860px) { .spm-ftr-cols { grid-template-columns: 1fr 1fr; } .spm-ftr-brand { grid-column: 1 / -1; max-width: none; } }
@media (max-width: 520px) { .spm-ftr-cols { grid-template-columns: 1fr; } .spm-ftr-meta { flex-direction: column; align-items: flex-start; gap: 10px; } .spm-ftr-logo { height: 46px; width: 84px; } }

/* ===== Responsive ===== */
@media (max-width: 1024px) {
  .ti-fields { grid-template-columns: repeat(2, 1fr); }
  .ti-calc-panel { grid-template-columns: 1fr; }
  .ti-sticky-wrap { grid-template-columns: 1fr; }
  .ti-sticky-media { position: relative; top: 0; order: -1; max-width: 480px; }
  .ti-logos { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
  .ti-cards3 { grid-template-columns: 1fr; }
  .ti-fields { grid-template-columns: 1fr; }
  .ti-slide { flex-basis: 86vw; min-height: 360px; }
  .ti-logos { grid-template-columns: repeat(2, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .ti-anim .ti-reveal { opacity: 1 !important; transform: none !important; filter: none !important; }
  .ti-feature.ti-fade { opacity: 1 !important; transform: none !important; }
}

/* ===== Review (spatial framed testimonial) ===== */
.spm-review { position: relative; background: #fff; min-height: 0; overflow: hidden; display: flex; align-items: center; justify-content: center; padding: 0; }
.spm-review-frame { position: relative; width: 100%; height: 90vh; margin: 0 auto; border-radius: 0; overflow: hidden; isolation: isolate; display: flex; align-items: center; justify-content: center; }
.spm-review-scale { position: absolute; inset: 0; z-index: 0; transform: none; }
.spm-review-bg { position: absolute; inset: 0; width: 100%; height: 100%; transform: none; background: #0d141f url('/uploads/X3ObViKsl2sFaezSuMz6m-Untitled_design_-_2026-09-18T162157_498-w1600.webp') center center / cover no-repeat; }
.spm-review-frame::before { content: ""; position: absolute; inset: 0; z-index: 1; background: radial-gradient(120% 85% at 50% 44%, rgba(13,20,31,.55) 0%, rgba(13,20,31,.18) 52%, rgba(13,20,31,.04) 80%); pointer-events: none; }
.spm-review-frame::after { content: none; }
.spm-review-inner { position: relative; z-index: 3; width: 100%; max-width: 1100px; margin: 0 auto; padding: 0 clamp(20px, 5vw, 64px); text-align: center; color: #fff; will-change: transform; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.spm-review-quote { font-size: clamp(28px, 3vw, 46px); line-height: 1.26; font-weight: 400; text-align: center; letter-spacing: -.015em; margin: 0 auto; max-width: 680px; color: #fff; text-shadow: 0 2px 36px rgba(0,0,0,.5); text-wrap: balance; }
.spm-review-author { margin-top: clamp(24px, 4vh, 42px); display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; }
.spm-review-name { font-size: 16px; font-weight: 600; color: #fff; letter-spacing: .02em; text-shadow: 0 1px 16px rgba(0,0,0,.5); }
.spm-review-role { font-size: 12px; color: rgba(255,255,255,.82); letter-spacing: .14em; text-transform: uppercase; text-shadow: 0 1px 16px rgba(0,0,0,.5); }

/* ===== Lead generation (Terminal-style contact) ===== */
.spm-lead { background: var(--ti-bg); }
.spm-lead .spm-lead-title { text-align: center; max-width: 24ch; margin-left: auto; margin-right: auto; }
/* Lead title — per-character teal sweep reveal (mirrors .ti-feature). Split into
   .ti-word/.ti-char by spm-feature-sweep.js; fired by sections.js adding .ti-in. */
.spm-lead-title .ti-word { display: inline-block; }
.spm-lead-title .ti-char { color: #0d141f; }
.spm-lead-title.ti-in .ti-char { animation: tiCharSweep .5s ease-out var(--v-delay, 0s) both; }
/* Match .ti-feature exactly: the ONLY reveal is the per-character sweep. Cancel the
   block-level .ti-reveal fade/slide on this title so it stays crisp + discreet. */
.ti-anim .spm-lead-title.ti-reveal { opacity: 1; transform: none; filter: none; }
@keyframes tiCharSweep { 0% { color: #dddddd; } 30% { color: #22808a; } 100% { color: #0d141f; } }
@media (prefers-reduced-motion: reduce) { .spm-lead-title .ti-char { color: #0d141f !important; animation: none !important; } }
.spm-lead-grid { margin-top: clamp(40px, 7vh, 90px); display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 90px); align-items: start; text-align: left; }
.spm-lead-sub { margin: 0; max-width: 42ch; font-size: clamp(16px, 1.4vw, 19px); }
.spm-lead-list { list-style: none; margin: var(--ti-space-lg) 0 0; padding: 6px 0 6px 22px; border-left: 2px solid var(--ti-accent-2); display: flex; flex-direction: column; gap: 18px; }
.spm-lead-list > * { position: relative; padding-left: 20px; font-size: 17px; line-height: 1.3; color: var(--ti-ink); }
.spm-lead-list > *::before { content: ""; position: absolute; left: 0; top: .5em; width: 8px; height: 8px; border-radius: 50%; background: var(--ti-accent-2); }
.spm-lead-trust { margin: clamp(44px, 6vh, 60px) 0 0; font-size: 14px; color: var(--ti-muted); }
.spm-lead .spm-lead-trust { margin-top: clamp(44px, 6vh, 60px); }
.spm-lead-logos { margin: 18px 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; opacity: .72; }
.spm-lead-logo { height: 30px; min-width: 68px; padding: 0 12px; display: grid; place-items: center; background: rgba(13,20,31,.04); border-radius: 6px; color: var(--ti-ink-3); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 0 0 1px rgba(13,20,31,.04); }
.spm-lead-form { background: radial-gradient(140% 130% at 12% 0%, #22808a 0%, #1b2a38 42%, #0d141f 100%); border: 1px solid rgba(255,255,255,.10); border-radius: 22px; padding: clamp(26px, 3vw, 46px); display: grid; grid-template-columns: 1fr 1fr; gap: 24px 22px; box-shadow: 0 2px 8px rgba(13,20,31,.06), 0 44px 90px -46px rgba(13,20,31,.5); }
.spm-field { display: flex; flex-direction: column; gap: 8px; }
.spm-field--full { grid-column: 1 / -1; }
.spm-field label { font-size: 12.5px; letter-spacing: .02em; text-transform: none; font-weight: 600; color: rgba(234,246,247,.9); }
.spm-field input, .spm-field select { font: inherit; font-size: 15px; padding: 8px 2px; border: 0; border-bottom: 1px solid rgba(255,255,255,.28); border-radius: 0; background: transparent; color: #fff; width: 100%; }
.spm-field input::placeholder { color: rgba(234,246,247,.42); }
.spm-field select { color: #fff; }
.spm-field select option { color: #0d141f; }
.spm-field input:focus, .spm-field select:focus { outline: none; border-bottom-color: var(--ti-accent-2); }
.spm-lead-submit { grid-column: 1 / -1; width: 100%; justify-content: center; margin-top: 12px; background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.18); color: #fff; letter-spacing: .16em; }
.spm-lead-submit:hover { background: var(--ti-accent); border-color: var(--ti-accent); color: #fff; }
.spm-lead-legal { grid-column: 1 / -1; font-size: 12px; line-height: 1.5; color: rgba(234,246,247,.6); margin: 2px 0 0; }
.spm-lead-done { grid-column: 1 / -1; text-align: center; padding: 26px 8px; }
.spm-lead-check { display: inline-grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: var(--ti-accent); color: #fff; font-size: 27px; margin-bottom: 14px; }
.spm-lead-done h3 { font-size: 22px; font-weight: 600; color: #fff; margin: 0 0 8px; }
.spm-lead-done p { font-size: 15px; color: rgba(234,246,247,.75); margin: 0; }
@media (max-width: 900px) { .spm-lead-grid { grid-template-columns: 1fr; } .spm-lead-form { grid-template-columns: 1fr; } .spm-review-frame { height: 64vh; } .spm-review-quote { max-width: 88%; } }

/* ===== FAQ (tabbed) ===== */
.sf-tabbed { display: grid; grid-template-columns: 0.85fr 1.55fr; gap: clamp(32px, 5vw, 88px); align-items: start; text-align: left; }
.sf-head .sf-title { max-width: 12ch; margin: 14px 0 0; }
.sf-head .sf-eyebrow { color: #17656d; }
.sf-intro { margin: 18px 0 0; max-width: 34ch; }
.sf-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: clamp(20px, 3vh, 34px); }
.sf-tab { font: inherit; font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase; font-weight: 600; color: var(--ti-muted); background: transparent; border: 1px solid var(--ti-line); border-radius: 999px; padding: 9px 18px; cursor: pointer; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.sf-tab:hover { border-color: var(--ti-accent); color: var(--ti-ink); }
.sf-tab.sf-active { background: var(--ti-ink); border-color: var(--ti-ink); color: #fff; }
.sf-panel { display: none; }
.sf-panel.sf-active { display: block; animation: sfFade .35s ease; }
@keyframes sfFade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.sf-item { border-top: 1px solid var(--ti-line); }
.sf-item:last-child { border-bottom: 1px solid var(--ti-line); }
.sf-q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; text-align: left; background: transparent; border: 0; cursor: pointer; padding: clamp(18px, 2.6vh, 26px) 2px; font: inherit; font-size: clamp(16px, 1.35vw, 19px); font-weight: 500; line-height: 1.3; color: var(--ti-ink); }
.sf-q:hover { color: var(--ti-accent); }
.sf-ic { flex: none; width: 20px; height: 20px; position: relative; color: var(--ti-muted); }
.sf-ic::before, .sf-ic::after { content: ""; position: absolute; background: currentColor; border-radius: 2px; }
.sf-ic::before { left: 0; right: 0; top: 50%; height: 1.6px; transform: translateY(-50%); }
.sf-ic::after { top: 0; bottom: 0; left: 50%; width: 1.6px; transform: translateX(-50%); transition: opacity .3s ease; }
.sf-item.sf-open .sf-ic { color: var(--ti-accent); }
.sf-item.sf-open .sf-ic::after { opacity: 0; }
.sf-a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .35s cubic-bezier(.16,1,.3,1); }
.sf-item.sf-open .sf-a { grid-template-rows: 1fr; }
.sf-a-in { overflow: hidden; }
.sf-a p { font-size: 15px; line-height: 1.7; color: var(--ti-muted); margin: 0; padding: 2px 2px 24px; max-width: 62ch; }
@media (max-width: 860px) { .sf-tabbed { grid-template-columns: 1fr; gap: 30px; } .sf-head .sf-title, .sf-intro { max-width: none; } }

/* Mobile typography — relax tight display line-heights so headlines don't cramp */
@media (max-width: 600px) {
  .ti-h2 { line-height: 1.08; }
  .spm-ftr-h { line-height: 1.1; }
  .spmf2-h { line-height: 1.1; }
}

/* ===== Footer v2 (spmf2 — reference-structure replica, SPM navy #1b2a38) ===== */
.spmf2 { --f-bg:#0d141f; --f-tile:rgba(255,255,255,.035); --f-tile-h:rgba(255,255,255,.075); --f-line:rgba(255,255,255,.10); --f-line-h:rgba(255,255,255,.20); --f-ink:#f4f7f9; --f-mut:rgba(244,247,249,.56); --f-teal:#22808a; --f-ease:cubic-bezier(.16,1,.3,1); position:relative; overflow:hidden; border-radius:clamp(22px,2.4vw,36px); background:var(--f-bg); color:var(--f-ink); font-family:inherit; }
.spmf2-fx { position:absolute; inset:0; z-index:0; width:100%; height:100%; display:block; pointer-events:none; }
.spmf2::before { content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(180deg, rgba(13,20,31,.14), rgba(13,20,31,.30)); }
.spmf2-wrap { position:relative; z-index:2; max-width:1560px; margin:0 auto; padding:clamp(64px,7vw,116px) clamp(30px,4.4vw,72px) clamp(36px,3vw,52px); }
.spmf2-grid { display:grid; grid-template-columns:1.02fr 1.16fr 1.16fr; gap:clamp(32px,3.8vw,76px); align-items:stretch; }
.spmf2-brand { display:flex; flex-direction:column; justify-content:space-between; gap:clamp(36px,5vw,72px); min-height:392px; padding:4px 0; }
.spmf2-logo { display:block; width:212px; height:116px; object-fit:contain; }
.spmf2-h { margin:0; max-width:15ch; font-size:clamp(29px,3.1vw,45px); line-height:1.04; letter-spacing:-.02em; font-weight:600; text-wrap:balance; }
.spmf2-mid { display:flex; flex-direction:column; gap:16px; }
.spmf2-links { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.spmf2-tile { display:flex; align-items:center; min-height:clamp(60px,5vw,76px); padding:0 26px; background:var(--f-tile); border:1px solid var(--f-line); border-radius:14px; color:var(--f-ink); font-size:16px; font-weight:500; letter-spacing:-.01em; text-decoration:none; transition:background .3s var(--f-ease), border-color .3s var(--f-ease), transform .3s var(--f-ease); }
.spmf2-tile:hover { background:var(--f-tile-h); border-color:var(--f-line-h); transform:translateY(-2px); }
.spmf2-demo { display:flex; align-items:center; justify-content:space-between; min-height:clamp(62px,5.2vw,78px); padding:0 12px 0 28px; background:#fff; color:#0d141f; border-radius:14px; font-size:15px; font-weight:600; letter-spacing:.02em; text-decoration:none; transition:transform .3s var(--f-ease), box-shadow .3s var(--f-ease); }
.spmf2-demo:hover { transform:translateY(-2px); box-shadow:0 14px 30px rgba(0,0,0,.28); }
.spmf2-demo-ic { display:grid; place-items:center; width:44px; height:44px; background:var(--f-teal); color:#fff; border-radius:10px; font-size:18px; }
.spmf2-news { display:flex; flex-direction:column; justify-content:space-between; gap:34px; padding:clamp(28px,2.6vw,40px); background:var(--f-tile); border:1px solid var(--f-line); border-radius:18px; }
.spmf2-mail-row { display:flex; gap:10px; align-items:stretch; }
.spmf2-mail-mount { flex:1; display:flex; }
.spmf2-mail-input { width:100%; height:52px; padding:0 18px; background:rgba(0,0,0,.20); border:1px solid var(--f-line); border-radius:12px; color:var(--f-ink); font-size:15px; font-family:inherit; outline:none; transition:border-color .3s var(--f-ease); }
.spmf2-mail-input::placeholder { color:var(--f-mut); }
.spmf2-mail-input:focus { border-color:var(--f-teal); }
.spmf2-mail-btn { flex:0 0 auto; display:grid; place-items:center; width:52px; height:52px; background:var(--f-teal); color:#fff; border:none; border-radius:12px; font-size:18px; text-decoration:none; cursor:pointer; transition:transform .3s var(--f-ease), filter .3s var(--f-ease); }
.spmf2-mail-btn:hover { transform:translateY(-1px); filter:brightness(1.09); }
.spmf2-fine { margin:12px 0 0; font-size:12.5px; line-height:1.5; color:var(--f-mut); }
.spmf2-news-lead { margin:0; max-width:22ch; font-size:clamp(20px,1.9vw,27px); line-height:1.22; letter-spacing:-.015em; font-weight:500; text-wrap:balance; }
.spmf2-mail-done { font-size:15px; font-weight:500; color:var(--f-ink); }
.spmf2-legal { display:flex; align-items:center; gap:20px; margin-top:clamp(52px,5vw,84px); padding-top:26px; border-top:1px solid var(--f-line); font-size:13px; color:var(--f-mut); }
.spmf2-legal-left { display:flex; align-items:center; gap:16px; flex:1; min-width:0; }
.spmf2-socs { display:flex; align-items:center; gap:15px; }
.spmf2-legal-center { flex:0 0 auto; text-align:center; }
.spmf2-legal-right { flex:1; text-align:right; font-size:11px; letter-spacing:.14em; }
.spmf2-soc { display:grid; place-items:center; width:22px; height:22px; background:none; border:0; border-radius:0; color:var(--f-mut); transition:color .3s var(--f-ease), transform .3s var(--f-ease); }
.spmf2-soc:hover { color:var(--f-ink); transform:translateY(-1px); }
.spmf2-soc svg { width:19px; height:19px; fill:currentColor; }
.spmf2-legal-link { color:var(--f-mut); text-decoration:none; transition:color .3s var(--f-ease); }
.spmf2-legal-link:hover { color:var(--f-ink); }
.spmf2-badge { flex:0 0 auto; display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:var(--f-teal); color:#0d141f; }
.spmf2-badge svg { width:17px; height:17px; }
@media (max-width:1080px) { .spmf2-grid { grid-template-columns:1fr 1fr; } .spmf2-brand { grid-column:1 / -1; min-height:auto; flex-direction:row; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:24px; } .spmf2-h { max-width:22ch; } }
@media (max-width:720px) { .spmf2-grid { grid-template-columns:1fr; gap:22px; } .spmf2-brand { flex-direction:column; align-items:flex-start; gap:26px; } .spmf2-legal { flex-direction:column; align-items:flex-start; gap:14px; } .spmf2-legal-left { flex-wrap:wrap; } .spmf2-legal-center, .spmf2-legal-right { flex:none; text-align:left; } }


/* src/styles/spx-legal.css */
/* Legal pages (Mentions légales, Politique de confidentialité, Gestion des cookies).
   spx-base.css only loads on the seven original inner pages, so this file carries the
   tokens and base rules these pages use, copied from spx-base.css. The page layout
   itself (.lg-*) is in the site classes. Every rule is scoped to .spx-p-legal so it
   cannot touch any other page. */
.spx-p-legal { --ink: #0d141f; --slate: #1b2a38; --steel: #43617a; --teal: #22808a; --teal-hi: #5cc2c9;
  --pearl: #dadde0; --mist: #f4f6f8; --paper: #ffffff; --tx: #3d4a57; --tx-2: #6b7782;
  --line: #e6e9ec; --line-d: rgba(255, 255, 255, .14); --r-lg: 18px; --r-stage: 32px; --r-md: 16px; --r-sm: 8px;
  --gut: clamp(20px, 4vw, 64px); --max: 1336px;
  --ease: cubic-bezier(.16, 1, .3, 1); --ease-io: cubic-bezier(.65, 0, .35, 1);
  --sans: "Bricolage Grotesque 036", "Bricolage Grotesque", system-ui, sans-serif;
  font-family: var(--sans); color: var(--ink); background: var(--paper); overflow-x: clip;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.spx-p-legal *, .spx-p-legal *::before, .spx-p-legal *::after { box-sizing: border-box; }
.spx-p-legal .spx-sec { position: relative; padding: clamp(80px, 8vw, 120px) 0; }
.spx-p-legal .spx-w { width: min(100% - 2 * var(--gut), var(--max)); margin-inline: auto; position: relative; }
.spx-p-legal .spx-stage { position: relative; margin: 12px; border-radius: var(--r-stage); overflow: hidden; isolation: isolate;
  color: #fff; --tx: rgba(255, 255, 255, .74); --tx-2: rgba(255, 255, 255, .55); --line: var(--line-d); }
/* static version of the inner-page hero glow (the animated one is drawn by spx-font.js, which does not load here) */
.spx-p-legal .lg-hero { background-color: #081019;
  background-image: radial-gradient(70% 110% at 88% 0%, rgba(34, 128, 138, .55) 0%, rgba(20, 48, 60, .4) 45%, rgba(8, 16, 25, 0) 78%),
    radial-gradient(55% 90% at 6% 100%, rgba(79, 154, 162, .22) 0%, rgba(8, 16, 25, 0) 70%); }
.spx-p-legal .spx-stage .spx-w { --inset: 12px; width: min(100% - 2 * (var(--gut) - var(--inset)), var(--max)); }
.spx-p-legal .spx-gl { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.spx-p-legal .spx-eb { display: inline-flex; align-items: center; gap: 10px; font-size: clamp(16px, 1.3vw, 20px); font-weight: 400;
  line-height: .95; letter-spacing: -.01em; color: #9aa3ab; }
.spx-p-legal .spx-eb::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--teal); flex: none; }
.spx-p-legal .spx-stage .spx-eb { color: rgba(255, 255, 255, .6); }
.spx-p-legal .spx-stage .spx-eb::before { background: var(--teal-hi); }
.spx-p-legal .spx-d1 { font-weight: 400; color: inherit; text-wrap: balance; font-size: clamp(44px, 6vw, 88px); line-height: .96; letter-spacing: -.052em; }
.spx-p-legal em { font-style: normal; font-weight: inherit; }
.spx-p-legal .spx-d1 em { color: var(--teal-hi); }
.spx-p-legal .spx-lead { font-size: clamp(18px, 1.35vw, 20px); line-height: 1.4; letter-spacing: .01em; color: var(--tx); font-weight: 400; text-wrap: pretty; }
.spx-p-legal .lg-prose ul + p { margin-top: 14px; }
/* Sécurité & données: question headings in the page's own FAQ */
.spx-p-legal .lg-prose h3 { font-size: 18px; line-height: 1.35; font-weight: 600; color: var(--ink); margin: 28px 0 6px; letter-spacing: -.01em; }
.spx-p-legal .lg-prose h3 + p { margin-top: 0; }
.spx-p-legal .spx-todo { color: var(--teal); border-bottom: 1px dashed currentColor; }
@media (max-width: 768px) {
  .spx-p-legal .spx-stage { margin: 8px; border-radius: 24px; }
  .spx-p-legal .spx-stage .spx-w { --inset: 8px; }
}


/* src/styles/spx-solutions.css */
/* @@SPX-SOL-CSS@@ */


/* src/styles/v3f-shell.css */
/* SPM — shared shell for the inner pages: the SPM V3 top menu, footer + CTA band
   and button styles (copied from SPM V3 so both pages look identical).
   Scoped to the inner pages; built by src/scripts/v3f-shell.js. Never applied to SPM V2. */
.v3f-ti-footer { position: relative; overflow: hidden; border-top-left-radius: 28px; border-top-right-radius: 28px; display: block; border-top: 0px none currentcolor; color: rgb(244, 247, 249); font-size: 14px; padding: clamp(16px, 1.8vw, 30px); background: transparent; }
.v3f-ti-footer { display: block; padding: clamp(16px, 1.8vw, 30px); border-top: 0px; background: transparent; color: rgb(244, 247, 249); font-size: 14px; }
.v3f-site-header { --nav-ink: #0D141F; --accent: #22808A; position: fixed; left: 0px; top: 2vmin; z-index: 100; display: flex; flex-direction: column; align-items: center; width: 100%; padding: 0px 2vmin; pointer-events: none; opacity: 0; transform: translateY(-10px); transition: opacity 0.7s ease-in-out, transform 0.7s ease-in-out; }
.v3f-site-header.v3f-revealed { opacity: 1; transform: translateY(0px); }
.v3f-nav-bar { pointer-events: auto; display: flex; align-items: center; gap: 0.85vmin; width: auto; max-width: calc(100% - 4vmin); background: rgba(255, 255, 255, 0.93); backdrop-filter: blur(30px) saturate(150%); border: 1px solid rgba(255, 255, 255, 0.96); border-radius: 18px; padding: 8px 8px 8px 14px; box-shadow: rgba(13, 20, 31, 0.55) 0px 18px 50px -20px, rgba(255, 255, 255, 0.9) 0px 1px 0px inset; transition: box-shadow 0.3s, background 0.3s; }
.v3f-nav-bar:hover { box-shadow: rgba(13, 20, 31, 0.62) 0px 24px 64px -22px, rgba(255, 255, 255, 0.95) 0px 1px 0px inset; }
.v3f-nav-logo { display: flex; align-items: center; flex: 0 0 auto; text-decoration: none; margin-right: 24px; }
.v3f-nav-logo img { height: 51px; width: auto; display: block; transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1); }
.v3f-nav-logo:hover img { transform: scale(1.06); }
.v3f-nav-links { display: none; align-items: center; gap: 18px; list-style: none; margin: 0px; padding: 0px; }
.v3f-nav-links a { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; font-weight: 450; color: var(--nav-ink); text-decoration: none; white-space: nowrap; opacity: 0.92; position: relative; transition: opacity 0.25s, color 0.25s, transform 0.25s; }
.v3f-nav-links a:hover { opacity: 1; color: var(--accent); transform: translateY(-1px); }
.v3f-nav-links .v3f-caret { font-size: 11px; opacity: 0.5; transform: translateY(1px); transition: transform 0.25s, opacity 0.25s; }
.v3f-nav-links a:hover .v3f-caret { opacity: 0.9; transform: translateY(1px) rotate(180deg); }
.v3f-nav-links a::after { content: ""; position: absolute; left: 2px; right: 2px; bottom: -5px; height: 2px; border-radius: 2px; background: var(--accent); transform: scaleX(0); transform-origin: left center; transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1); }
.v3f-nav-links a:hover::after { transform: scaleX(1); }
.v3f-nav-actions { display: none; align-items: center; gap: 6px; margin-left: calc(18px - 0.85vmin); }
.v3f-nav-icon { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 10px; border: 0px; background: var(--accent); color: rgb(255, 255, 255); flex: 0 0 auto; text-decoration: none; }
.v3f-nav-icon svg { width: 18px; height: 18px; }
.v3f-nav-icon:hover { filter: brightness(1.08); }
.v3f-nav-btn { display: inline-flex; align-items: center; justify-content: center; text-align: center; min-width: 72px; height: 42px; padding: 0px 13px; border-radius: 10px; font-size: 10.5px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; line-height: 1.08; text-decoration: none; transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), background 0.25s, box-shadow 0.25s, filter 0.25s; }
.v3f-nav-btn:hover { transform: translateY(-2px); }
.v3f-nav-btn-white { background: rgb(27, 42, 56); color: rgb(255, 255, 255); border: 0px; }
.v3f-nav-btn-white:hover { background: rgb(13, 20, 31); box-shadow: rgba(13, 20, 31, 0.6) 0px 12px 26px -10px; }
.v3f-nav-btn-grey { background: rgb(218, 221, 224); color: var(--nav-ink); }
.v3f-nav-btn-grey:hover { background: rgb(201, 206, 212); box-shadow: rgba(13, 20, 31, 0.4) 0px 12px 24px -12px; }
.v3f-nav-menu-btn { display: inline-flex; flex-direction: column; justify-content: center; gap: 4px; width: 46px; height: 46px; border-radius: 11px; background: rgb(255, 255, 255); border: 1px solid rgba(13, 20, 31, 0.12); cursor: pointer; margin-left: auto; color: var(--nav-ink); }
.v3f-nav-menu-btn .v3f-bar { display: block; width: 18px; height: 2px; background: currentcolor; margin: 0px auto; transition: 0.3s; }
.v3f-nav-menu-btn.open .v3f-bar:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.v3f-nav-menu-btn.open .v3f-bar:nth-child(2) { opacity: 0; }
.v3f-nav-menu-btn.open .v3f-bar:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.v3f-nav-dropdown { margin-top: 8px; width: calc(100% - 4vmin); max-width: 520px; overflow: hidden; border-radius: 16px; background: rgba(237, 240, 243, 0.7); backdrop-filter: blur(22px) saturate(160%); border: 1px solid rgba(255, 255, 255, 0.55); padding: 8px; opacity: 0; transform: translateY(-8px); pointer-events: none; transition: opacity 0.3s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1); }
.v3f-nav-dropdown.open { opacity: 1; transform: translateY(0px); pointer-events: auto; }
.v3f-nav-dropdown ul { list-style: none; display: flex; flex-direction: column; gap: 2px; margin: 0px; padding: 0px; }
.v3f-nav-dropdown a { height: 48px; width: 100%; display: flex; align-items: center; padding: 0px 14px; border-radius: 9px; font-size: 16px; color: var(--nav-ink); text-decoration: none; }
.v3f-nav-dropdown a:hover { background: rgba(13, 20, 31, 0.05); }
@media (min-width: 1080px){.v3f-nav-links { display: flex; }}
@media (min-width: 1080px){.v3f-nav-actions { display: flex; }}
@media (min-width: 1080px){.v3f-nav-menu-btn { display: none; }}
@media (min-width: 1080px){.v3f-nav-dropdown { display: none; }}
@media (prefers-reduced-motion: reduce){.v3f-site-header { transition: none; }}
.v3f-bx { --bx-ease: cubic-bezier(.19, 1, .22, 1); position: relative; overflow: hidden; isolation: isolate; -webkit-tap-highlight-color: transparent; -webkit-font-smoothing: antialiased; text-transform: none !important; letter-spacing: -0.005em !important; font-weight: 500 !important; border: 0px !important; background: var(--bx-bg) !important; color: var(--bx-fg) !important; box-shadow: var(--bx-shadow) !important; transition: color .3s cubic-bezier(.39, .575, .565, 1), transform .25s var(--bx-ease), box-shadow .3s ease !important; }
.v3f-bx-pill { border-radius: 980px !important; }
.v3f-bx-round { border-radius: 50% !important; }
.v3f-bx--dark { --bx-bg: linear-gradient(180deg, #2a3e51 0%, #1b2a38 55%, #15212c 100%); --bx-fg: #fff; --bx-hover-bg: #22808a; --bx-hover-fg: #fff; --bx-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 1px 2px rgba(13, 20, 31, .22), 0 10px 24px -12px rgba(13, 20, 31, .55); }
.v3f-bx--teal { --bx-bg: linear-gradient(180deg, #2f9ea9 0%, #22808a 58%, #1c6f78 100%); --bx-fg: #fff; --bx-hover-bg: #0d141f; --bx-hover-fg: #8edbe1; --bx-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 1px 2px rgba(13, 20, 31, .2), 0 10px 26px -12px rgba(34, 128, 138, .7); }
.v3f-bx--light { --bx-bg: linear-gradient(180deg, #fff 0%, #f3f5f7 100%); --bx-fg: #0d141f; --bx-hover-bg: #0d141f; --bx-hover-fg: #8edbe1; --bx-shadow: inset 0 0 0 1px rgba(13, 20, 31, .08), inset 0 1px 0 #fff, 0 1px 2px rgba(13, 20, 31, .06), 0 8px 18px -12px rgba(13, 20, 31, .3); }
.v3f-bx--teal-ondark { --bx-bg: linear-gradient(180deg, #2f9ea9 0%, #22808a 58%, #1c6f78 100%); --bx-fg: #fff; --bx-hover-bg: #fff; --bx-hover-fg: #0d141f; --bx-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 1px 2px rgba(0, 0, 0, .25), 0 12px 28px -12px rgba(34, 128, 138, .8); }
.v3f-bx--light-ondark { --bx-bg: linear-gradient(180deg, #fff 0%, #eef1f4 100%); --bx-fg: #0d141f; --bx-hover-bg: #22808a; --bx-hover-fg: #fff; --bx-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(0, 0, 0, .2), 0 10px 24px -12px rgba(0, 0, 0, .6); }
.v3f-bx--tile { --bx-bg: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .03)); --bx-fg: #f4f7f9; --bx-hover-bg: #22808a; --bx-hover-fg: #fff; --bx-shadow: inset 0 0 0 1px rgba(255, 255, 255, .09), inset 0 1px 0 rgba(255, 255, 255, .08); }
.v3f-bx--tab { --bx-bg: transparent; --bx-fg: #43617a; --bx-hover-bg: #0d141f; --bx-hover-fg: #fff; --bx-shadow: none; }
.v3f-nav-btn.v3f-bx { height: 40px !important; padding: 0px 18px !important; font-size: 13.5px !important; line-height: 1 !important; min-width: 0px !important; }
.v3f-nav-icon.v3f-bx { width: 40px !important; height: 40px !important; }
.v3f-ft-cta.v3f-bx { font-size: 15px !important; padding-left: 26px !important; padding-right: 22px !important; }
.v3f-bx .v3f-bx-l > span { font-size: inherit !important; text-transform: none !important; letter-spacing: inherit !important; font-weight: inherit !important; }
.v3f-ft-tile.v3f-bx { border-radius: 14px !important; }
.v3f-bx.v3f-bx:active { transform: scale(0.97) !important; transition-duration: 0.12s !important; }
.v3f-bx:focus { outline: none; }
.v3f-bx:focus-visible { box-shadow: var(--bx-shadow), 0 0 0 3px #fff, 0 0 0 5px rgba(34, 128, 138, .65) !important; }
.v3f-bx::before { content: ""; position: absolute; left: -1px; top: -1px; width: calc(100% + 2px); height: calc(100% + 2px); z-index: -1; background: var(--bx-hover-bg); transform: translate3d(0px, 101%, 0px); transition: transform .7s var(--bx-ease); pointer-events: none; }
.v3f-bx-l { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: inherit; pointer-events: none; }
.v3f-bx-l::after { content: ""; position: absolute; left: 0px; bottom: -0.22em; width: 100%; height: 1px; background: currentcolor; transform: scaleX(0); transform-origin: right center; transition: transform .7s var(--bx-ease); }
.v3f-bx.v3f-bx-icon .v3f-bx-l::after { display: none; }
@media (hover: hover) and (pointer: fine){.v3f-bx.v3f-bx:hover { color: var(--bx-hover-fg) !important; transform: none !important; filter: none !important; }}
@media (hover: hover) and (pointer: fine){.v3f-bx:hover::before { transform: translate3d(0px, 0px, 0px); }}
@media (hover: hover) and (pointer: fine){.v3f-bx:hover .v3f-bx-l::after { transform: scaleX(1); transform-origin: left center; }}
@media (prefers-reduced-motion: reduce){.v3f-bx, .v3f-bx::before, .v3f-bx-l::after { transition-duration: 0.01s !important; }}
@media (max-width: 767px){.v3f-ft-top { gap: 20px !important; }}
@media (max-width: 767px){.v3f-ft-cta.v3f-bx { width: 100%; justify-content: space-between; }}
@media (max-width: 767px){.v3f-ft-grid { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }}
@media (max-width: 767px){.v3f-ft-tile.v3f-bx { min-height: 56px; line-height: 1.25; height: auto !important; padding: 12px 14px !important; font-size: 14.5px !important; }}
@media (max-width: 767px){.v3f-ft-tile .v3f-bx-l { justify-content: flex-start; text-align: left; min-width: 0px; }}
@media (max-width: 767px){.v3f-ft-addr { grid-template-columns: 1fr 1fr !important; gap: 24px 16px !important; }}
@media (max-width: 767px){.v3f-ft-addr .v3f-ft-col:first-child { grid-column: 1 / -1; }}
@media (max-width: 767px){.v3f-ft-addr .v3f-ft-col { min-width: 0px; overflow-wrap: anywhere; }}
@media (max-width: 767px){.v3f-ft-ln, .v3f-ft-legal a, .v3f-ft-bar a { display: inline-flex; align-items: center; min-height: 44px; }}
@media (max-width: 767px){.v3f-ft-legal { flex-wrap: wrap; gap: 0px 18px !important; }}
@media (max-width: 767px){.v3f-lang-opt { min-height: 44px; }}
@media (max-width: 380px){.v3f-ft-grid { grid-template-columns: 1fr !important; }}
@media (max-width: 380px){.v3f-ft-tile.v3f-bx { min-height: 52px; }}
@media (max-width: 380px){.v3f-ft-addr { grid-template-columns: 1fr !important; }}
/* inner pages: clear the floating menu */
body.v3f-shell > main > :first-child { padding-top: clamp(40px, 5vw, 64px); }
/* the page body is navy here: square the footer's outer box so no navy shows at its corners */
body.v3f-shell .v3f-ti-footer { border-radius: 0 !important; background-color: #fff; }

/* ---------- V3 contact form + FAQ sections (copied from SPM V3) ---------- */
.v3f-ti-eyebrow { letter-spacing: 0.14em; }
.v3f-ti-h2 { position: relative; line-height: 1.02; letter-spacing: -0.025em; text-wrap: balance; }
.v3f-ti-lead { line-height: 1.5; text-wrap: pretty; font-size: clamp(16px, 1.4vw, 19px); }
.v3f-ti-btn { transition: background 0.25s cubic-bezier(0.16, 1, 0.3, 1), color 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s cubic-bezier(0.16, 1, 0.3, 1); }
.v3f-ti-root { letter-spacing: -0.011em; line-height: 1.5; --ti-bg-1: #fcfdfd; --ti-bg-2: #f7f9f9; background: rgb(255, 255, 255); }
.v3f-sf-title { font-size: clamp(30px, 3.6vw, 50px); font-weight: 600; line-height: 1.05; letter-spacing: -0.022em; color: var(--ti-ink); margin: 16px 0px 0px; max-width: 15ch; }
@media (max-width: 860px){.v3f-sf-title { max-width: none; }}
.v3f-sf-head { position: sticky; top: 100px; }
@media (max-width: 860px){.v3f-sf-head { position: static; }}
.v3f-sf-q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: clamp(22px, 2.4vw, 30px) 0px; background: transparent; border-width: 0px; border-style: none; border-color: currentcolor; border-image: none 100% / 1 / 0 stretch; cursor: pointer; text-align: left; color: var(--ti-ink); font-family: inherit; transition: color 0.3s; }
.v3f-sf-panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.55s cubic-bezier(0.16, 1, 0.3, 1); }
.v3f-sf-wrap { display: grid; grid-template-columns: minmax(0px, 4fr) minmax(0px, 8fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
@media (max-width: 860px){.v3f-sf-wrap { grid-template-columns: 1fr; gap: 28px; }}
.v3f-sf-sec { background: var(--ti-bg); }
.v3f-ti-root .v3f-ti-eyebrow { color: rgb(23, 101, 109); }
.v3f-spm-lead-title { text-align: center; max-width: 20ch; margin: 0px auto; }
.v3f-spm-lead-list { list-style: none; margin: 30px 0px 0px; padding: 6px 0px 6px 22px; border-left: 2px solid var(--ti-accent-2); display: flex; flex-direction: column; gap: 18px; }
.v3f-spm-lead-trust { margin: clamp(44px, 6vh, 60px) 0px 0px; font-size: 14px; color: var(--ti-muted); text-transform: none; letter-spacing: 0px; }
.v3f-spm-lead { background: rgb(255, 255, 255); }
.v3f-spm-lead-form { background: radial-gradient(140% 130% at 12% 0%, rgb(34, 128, 138) 0%, rgb(27, 42, 56) 42%, rgb(13, 20, 31) 100%); border-width: 1px; border-style: solid; border-color: rgba(255, 255, 255, 0.1); border-image: none 100% / 1 / 0 stretch; border-radius: 22px; padding: clamp(26px, 3vw, 46px); display: grid; grid-template-columns: 1fr 1fr; gap: 24px 22px; box-shadow: rgba(13, 20, 31, 0.6) 0px 34px 70px -30px; }
.v3f-spm-field input,  .v3f-spm-field select { font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-size: 15px; padding: 8px 2px; border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgba(255, 255, 255, 0.28); border-image: none 100% / 1 / 0 stretch; border-radius: 0px; background: transparent; color: rgb(255, 255, 255); width: 100%; }
.v3f-spm-lead-submit { grid-column: 1 / -1; width: 100%; justify-content: center; margin-top: 12px; background: rgba(255, 255, 255, 0.1); border-width: 1px; border-style: solid; border-color: rgba(255, 255, 255, 0.18); border-image: none 100% / 1 / 0 stretch; color: rgb(255, 255, 255); letter-spacing: 0.16em; }
.v3f-spm-clogo-grid { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: clamp(26px, 4vw, 60px); }
.v3f-spm-clogo { display: inline-flex; align-items: center; color: var(--ti-ink); opacity: 0.5; transition: opacity 0.25s, transform 0.25s; gap: 13px; }
.v3f-spm-clogo:hover { opacity: 1; transform: translateY(-1px); }
.v3f-spm-clogo-ic { flex: 0 0 auto; width: 39px; height: 39px; }
.v3f-spm-clogo-name { font-weight: 700; letter-spacing: 0.01em; font-size: 26px; }
.v3f-spm-lead-logos.v3f-spm-clogo-grid { justify-content: flex-start; gap: 18px 30px; }
.v3f-spm-lead-logos .v3f-spm-clogo-ic { width: 30px; height: 30px; }
.v3f-spm-lead-logos .v3f-spm-clogo-name { font-size: 21px; }
.v3f-sf-tab { font-weight: 600; }
.v3f-ti-btn:hover { transform: translateY(-1px); }
.v3f-ti-btn:focus-visible { outline: rgba(34, 128, 138, 0.6) solid 2px; outline-offset: 3px; }
.v3f-sf-tab:focus-visible { outline: rgba(34, 128, 138, 0.6) solid 2px; outline-offset: 3px; }
.v3f-spm-lead-submit:focus-visible { outline: rgba(34, 128, 138, 0.6) solid 2px; outline-offset: 3px; }
.v3f-ti-anim .v3f-spm-lead-title.v3f-ti-reveal { opacity: 1; transform: none; }
.v3f-ti-root,  .v3f-ti-root *,  .v3f-ti-root ::before,  .v3f-ti-root ::after { box-sizing: border-box; }
.v3f-ti-root h1,  .v3f-ti-root h2,  .v3f-ti-root h3,  .v3f-ti-root h4,  .v3f-ti-root h5,  .v3f-ti-root p,  .v3f-ti-root figure { margin: 0px; }
.v3f-ti-root { --ti-bg: #ffffff; --ti-surface: #ffffff; --ti-soft: #f4f5f7; --ti-bg-1: #fcfdfd; --ti-bg-2: #f7f9f9; --ti-ink: #0d141f; --ti-muted: #43617a; --ti-line: rgba(13,20,31,.08); --ti-hair: rgba(13,20,31,.06); --ti-accent: #22808a; --ti-accent-2: #3aa3ad; --ti-navy-a: #2e9099; --ti-navy-b: #1b2a38; --ti-navy-c: #0d141f; --ti-radius: 16px; --ti-r-sm: 10px; --ti-r-md: 16px; --ti-r-lg: 22px; --ti-ease: cubic-bezier(.16,1,.3,1); --ti-shadow-sm: 0 1px 2px rgba(13,20,31,.04),0 1px 1px rgba(13,20,31,.03); --ti-shadow-md: 0 1px 2px rgba(13,20,31,.03),0 10px 34px -12px rgba(13,20,31,.10); --ti-shadow-lift: 0 2px 4px rgba(13,20,31,.04),0 22px 48px -20px rgba(13,20,31,.16); --ti-ink-2: rgba(13,20,31,.62); --ti-ink-3: rgba(13,20,31,.42); --ti-space-2xs: 8px; --ti-space-xs: 12px; --ti-space-sm: 16px; --ti-space-md: 24px; --ti-space-lg: 32px; --ti-space-xl: 48px; --ti-space-2xl: 64px; --ti-space-3xl: 96px; --ti-space-4xl: 128px; --ti-noise: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='140'%20height='140'%3E%3Cfilter%20id='n'%3E%3CfeTurbulence%20type='fractalNoise'%20baseFrequency='0.8'%20numOctaves='2'%20stitchTiles='stitch'/%3E%3CfeColorMatrix%20type='saturate'%20values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA%20type='linear'%20slope='0.05'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect%20width='100%25'%20height='100%25'%20filter='url(%23n)'/%3E%3C/svg%3E"); position: relative; z-index: 2; background: var(--ti-bg); color: var(--ti-ink); font-family: var(--font-body),'Bricolage Grotesque',system-ui,sans-serif; }
.v3f-ti-sec { padding: clamp(52px, 8vh, 104px) clamp(20px, 5vw, 80px); }
.v3f-ti-wrap { max-width: 1200px; margin: 0px auto; }
.v3f-ti-eyebrow { font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: rgb(23, 101, 109); }
.v3f-ti-h2 { font-size: clamp(30px, 4.6vw, 60px); font-weight: 600; line-height: 1.02; letter-spacing: -0.025em; margin: 0px; color: var(--ti-ink); text-wrap: balance; }
.v3f-ti-lead { font-size: clamp(16px, 1.4vw, 19px); line-height: 1.6; color: var(--ti-muted); text-wrap: pretty; }
.v3f-ti-reveal { will-change: transform, opacity, filter; }
.v3f-ti-anim .v3f-ti-reveal { opacity: 0; transform: translateY(26px); filter: blur(6px); }
.v3f-ti-anim .v3f-ti-reveal.v3f-ti-in { opacity: 1; transform: none; filter: blur(0px); transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1), transform 1s cubic-bezier(0.16, 1, 0.3, 1), filter 0.7s cubic-bezier(0.16, 1, 0.3, 1); }
.v3f-ti-btn { align-self: flex-start; margin-top: auto; display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--ti-ink); background: transparent; color: var(--ti-ink); border-radius: 999px; padding: 10px 20px; font-size: 13px; font-weight: 500; cursor: pointer; text-decoration: none; transition: background .25s var(--ti-ease),color .25s var(--ti-ease),border-color .25s var(--ti-ease),transform .2s var(--ti-ease); }
.v3f-ti-btn:hover { background: var(--ti-ink); color: rgb(255, 255, 255); transform: translateY(-1px); }
.v3f-ti-btn:focus-visible,  .v3f-sf-tab:focus-visible,  .v3f-spm-lead-submit:focus-visible { outline: rgba(34, 128, 138, 0.6) solid 2px; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce){.v3f-ti-anim .v3f-ti-reveal { opacity: 1 !important; transform: none !important; filter: none !important; }}
.v3f-spm-lead { background: var(--ti-bg); }
.v3f-spm-lead .v3f-spm-lead-title { text-align: center; max-width: 24ch; margin-left: auto; margin-right: auto; }
.v3f-spm-lead-title .v3f-ti-word { display: inline-block; }
.v3f-spm-lead-title .v3f-ti-char { color: rgb(13, 20, 31); }
.v3f-spm-lead-title.v3f-ti-in .v3f-ti-char { animation: tiCharSweep .5s ease-out var(--v-delay,0s) both; }
.v3f-ti-anim .v3f-spm-lead-title.v3f-ti-reveal { opacity: 1; transform: none; filter: none; }
@media (prefers-reduced-motion: reduce){.v3f-spm-lead-title .v3f-ti-char { color: rgb(13, 20, 31) !important; animation: auto ease 0s 1 normal none running none !important; }}
.v3f-spm-lead-grid { margin-top: clamp(40px, 7vh, 90px); display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 90px); align-items: start; text-align: left; }
.v3f-spm-lead-sub { margin: 0px; max-width: 42ch; font-size: clamp(16px, 1.4vw, 19px); }
.v3f-spm-lead-list { list-style: none; margin: var(--ti-space-lg) 0 0; padding: 6px 0px 6px 22px; border-left: 2px solid var(--ti-accent-2); display: flex; flex-direction: column; gap: 18px; }
.v3f-spm-lead-list > * { position: relative; padding-left: 20px; font-size: 17px; line-height: 1.3; color: var(--ti-ink); }
.v3f-spm-lead-list > ::before { content: ""; position: absolute; left: 0px; top: 0.5em; width: 8px; height: 8px; border-radius: 50%; background: var(--ti-accent-2); }
.v3f-spm-lead-trust { margin: clamp(44px, 6vh, 60px) 0px 0px; font-size: 14px; color: var(--ti-muted); }
.v3f-spm-lead .v3f-spm-lead-trust { margin-top: clamp(44px, 6vh, 60px); }
.v3f-spm-lead-logos { margin: 18px 0px 0px; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; opacity: 0.72; }
.v3f-spm-lead-form { background: radial-gradient(140% 130% at 12% 0%, rgb(34, 128, 138) 0%, rgb(27, 42, 56) 42%, rgb(13, 20, 31) 100%); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 22px; padding: clamp(26px, 3vw, 46px); display: grid; grid-template-columns: 1fr 1fr; gap: 24px 22px; box-shadow: rgba(13, 20, 31, 0.06) 0px 2px 8px, rgba(13, 20, 31, 0.5) 0px 44px 90px -46px; }
.v3f-spm-field { display: flex; flex-direction: column; gap: 8px; }
.v3f-spm-field--full { grid-column: 1 / -1; }
.v3f-spm-field label { font-size: 12.5px; letter-spacing: 0.02em; text-transform: none; font-weight: 600; color: rgba(234, 246, 247, 0.9); }
.v3f-spm-field input,  .v3f-spm-field select { font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-size: 15px; padding: 8px 2px; border-width: 0px 0px 1px; border-top-style: initial; border-right-style: initial; border-left-style: initial; border-top-color: initial; border-right-color: initial; border-left-color: initial; border-image: initial; border-bottom-style: solid; border-bottom-color: rgba(255, 255, 255, 0.28); border-radius: 0px; background: transparent; color: rgb(255, 255, 255); width: 100%; }
.v3f-spm-field input::placeholder { color: rgba(234, 246, 247, 0.42); }
.v3f-spm-field select { color: rgb(255, 255, 255); }
.v3f-spm-field select option { color: rgb(13, 20, 31); }
.v3f-spm-field input:focus,  .v3f-spm-field select:focus { outline: none; border-bottom-color: var(--ti-accent-2); }
.v3f-spm-lead-submit { grid-column: 1 / -1; width: 100%; justify-content: center; margin-top: 12px; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.18); color: rgb(255, 255, 255); letter-spacing: 0.16em; }
.v3f-spm-lead-submit:hover { background: var(--ti-accent); border-color: var(--ti-accent); color: rgb(255, 255, 255); }
.v3f-spm-lead-legal { grid-column: 1 / -1; font-size: 12px; line-height: 1.5; color: rgba(234, 246, 247, 0.6); margin: 2px 0px 0px; }
.v3f-spm-lead-done { grid-column: 1 / -1; text-align: center; padding: 26px 8px; }
.v3f-spm-lead-check { display: inline-grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: var(--ti-accent); color: rgb(255, 255, 255); font-size: 27px; margin-bottom: 14px; }
.v3f-spm-lead-done h3 { font-size: 22px; font-weight: 600; color: rgb(255, 255, 255); margin: 0px 0px 8px; }
.v3f-spm-lead-done p { font-size: 15px; color: rgba(234, 246, 247, 0.75); margin: 0px; }
@media (max-width: 900px){.v3f-spm-lead-grid { grid-template-columns: 1fr; }}
@media (max-width: 900px){.v3f-spm-lead-form { grid-template-columns: 1fr; }}
.v3f-sf-tabbed { display: grid; grid-template-columns: 0.85fr 1.55fr; gap: clamp(32px, 5vw, 88px); align-items: start; text-align: left; }
.v3f-sf-head .v3f-sf-title { max-width: 12ch; margin: 14px 0px 0px; }
.v3f-sf-head .v3f-sf-eyebrow { color: rgb(23, 101, 109); }
.v3f-sf-intro { margin: 18px 0px 0px; max-width: 34ch; }
.v3f-sf-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: clamp(20px, 3vh, 34px); }
.v3f-sf-tab { font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-size: 11.5px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 600; color: var(--ti-muted); background: transparent; border: 1px solid var(--ti-line); border-radius: 999px; padding: 9px 18px; cursor: pointer; transition: background 0.2s, color 0.2s, border-color 0.2s; }
.v3f-sf-tab:hover { border-color: var(--ti-accent); color: var(--ti-ink); }
.v3f-sf-tab.v3f-sf-active { background: var(--ti-ink); border-color: var(--ti-ink); color: rgb(255, 255, 255); }
.v3f-sf-panel { display: none; }
.v3f-sf-panel.v3f-sf-active { display: block; animation: 0.35s ease 0s 1 normal none running sfFade; }
.v3f-sf-item { border-top: 1px solid var(--ti-line); }
.v3f-sf-item:last-child { border-bottom: 1px solid var(--ti-line); }
.v3f-sf-q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; text-align: left; background: transparent; border: 0px; cursor: pointer; padding: clamp(18px, 2.6vh, 26px) 2px; font-style: inherit; font-variant: inherit; font-stretch: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-size: clamp(16px, 1.35vw, 19px); font-weight: 500; line-height: 1.3; color: var(--ti-ink); }
.v3f-sf-q:hover { color: var(--ti-accent); }
.v3f-sf-ic { flex: 0 0 auto; width: 20px; height: 20px; position: relative; color: var(--ti-muted); }
.v3f-sf-ic::before,  .v3f-sf-ic::after { content: ""; position: absolute; background: currentcolor; border-radius: 2px; }
.v3f-sf-ic::before { left: 0px; right: 0px; top: 50%; height: 1.6px; transform: translateY(-50%); }
.v3f-sf-ic::after { top: 0px; bottom: 0px; left: 50%; width: 1.6px; transform: translateX(-50%); transition: opacity 0.3s; }
.v3f-sf-item.v3f-sf-open .v3f-sf-ic { color: var(--ti-accent); }
.v3f-sf-item.v3f-sf-open .v3f-sf-ic::after { opacity: 0; }
.v3f-sf-a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.35s cubic-bezier(0.16, 1, 0.3, 1); }
.v3f-sf-item.v3f-sf-open .v3f-sf-a { grid-template-rows: 1fr; }
.v3f-sf-a-in { overflow: hidden; }
.v3f-sf-a p { font-size: 15px; line-height: 1.7; color: var(--ti-muted); margin: 0px; padding: 2px 2px 24px; max-width: 62ch; }
@media (max-width: 860px){.v3f-sf-tabbed { grid-template-columns: 1fr; gap: 30px; }}
@media (max-width: 860px){.v3f-sf-head .v3f-sf-title,  .v3f-sf-intro { max-width: none; }}
@media (max-width: 600px){.v3f-ti-h2 { line-height: 1.08; }}
.v3f-ti-root > .v3f-ti-sec { background-color: transparent !important; }
.v3f-bx { --bx-ease: cubic-bezier(.19, 1, .22, 1); position: relative; overflow: hidden; isolation: isolate; -webkit-tap-highlight-color: transparent; -webkit-font-smoothing: antialiased; text-transform: none !important; letter-spacing: -0.005em !important; font-weight: 500 !important; border: 0px !important; background: var(--bx-bg) !important; color: var(--bx-fg) !important; box-shadow: var(--bx-shadow) !important; transition: color .3s cubic-bezier(.39, .575, .565, 1), transform .25s var(--bx-ease), box-shadow .3s ease !important; }
.v3f-bx-pill { border-radius: 980px !important; }
.v3f-bx--teal-ondark { --bx-bg: linear-gradient(180deg, #2f9ea9 0%, #22808a 58%, #1c6f78 100%); --bx-fg: #fff; --bx-hover-bg: #fff; --bx-hover-fg: #0d141f; --bx-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 1px 2px rgba(0, 0, 0, .25), 0 12px 28px -12px rgba(34, 128, 138, .8); }
.v3f-bx--tab { --bx-bg: transparent; --bx-fg: #43617a; --bx-hover-bg: #0d141f; --bx-hover-fg: #fff; --bx-shadow: none; }
.v3f-bx--tab.v3f-sf-active { --bx-bg: linear-gradient(180deg, #2a3e51 0%, #1b2a38 55%, #15212c 100%); --bx-fg: #fff; --bx-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 6px 16px -10px rgba(13, 20, 31, .6); }
 .v3f-spm-lead-submit.v3f-bx { min-height: 46px; font-size: 15px !important; }
 .v3f-sf-tab.v3f-bx { font-size: 13.5px !important; }
.v3f-bx .v3f-bx-l > span { font-size: inherit !important; text-transform: none !important; letter-spacing: inherit !important; font-weight: inherit !important; }
.v3f-bx.v3f-bx:active { transform: scale(0.97) !important; transition-duration: 0.12s !important; }
.v3f-bx:focus { outline: none; }
.v3f-bx:focus-visible { box-shadow: var(--bx-shadow), 0 0 0 3px #fff, 0 0 0 5px rgba(34, 128, 138, .65) !important; }
.v3f-bx::before { content: ""; position: absolute; left: -1px; top: -1px; width: calc(100% + 2px); height: calc(100% + 2px); z-index: -1; background: var(--bx-hover-bg); transform: translate3d(0px, 101%, 0px); transition: transform .7s var(--bx-ease); pointer-events: none; }
.v3f-bx-l { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: inherit; pointer-events: none; }
.v3f-bx-l::after { content: ""; position: absolute; left: 0px; bottom: -0.22em; width: 100%; height: 1px; background: currentcolor; transform: scaleX(0); transform-origin: right center; transition: transform .7s var(--bx-ease); }
.v3f-bx.v3f-bx-icon .v3f-bx-l::after { display: none; }
@media (hover: hover) and (pointer: fine){.v3f-bx.v3f-bx:hover { color: var(--bx-hover-fg) !important; transform: none !important; filter: none !important; }}
@media (hover: hover) and (pointer: fine){.v3f-bx:hover::before { transform: translate3d(0px, 0px, 0px); }}
@media (hover: hover) and (pointer: fine){.v3f-bx:hover .v3f-bx-l::after { transform: scaleX(1); transform-origin: left center; }}
@media (hover: hover) and (pointer: fine){.v3f-bx--tab.v3f-sf-active:hover::before { transform: translate3d(0px, 101%, 0px); }}
@media (hover: hover) and (pointer: fine){.v3f-bx--tab.v3f-sf-active:hover { color: var(--bx-fg) !important; }}
@media (prefers-reduced-motion: reduce){.v3f-bx,  .v3f-bx::before,  .v3f-bx-l::after { transition-duration: 0.01s !important; }}
@media (max-width: 860px){ .v3f-sf-tabs { overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x; scrollbar-width: none; scroll-padding-inline: 20px; flex-wrap: nowrap !important; margin-left: -20px !important; margin-right: -20px !important; padding: 2px 20px !important; gap: 8px !important; justify-content: flex-start !important; max-width: none !important; width: auto !important; }}
@media (max-width: 860px){.v3f-sf-wrap { grid-template-columns: minmax(0px, 1fr) !important; }}
@media (max-width: 860px){.v3f-sf-main { min-width: 0px; }}
@media (max-width: 860px){ .v3f-sf-tabs::-webkit-scrollbar { display: none; }}
@media (max-width: 860px){ .v3f-sf-tab { white-space: nowrap; scroll-snap-align: start; min-height: 44px; flex: 0 0 auto !important; }}
@media (max-width: 767px){ .v3f-spm-lead-submit.v3f-bx { width: 100%; justify-content: center; }}


/* src/styles/spx-base.css */
/* ============================================================
   SPM inner pages — shared premium system ("spx").
   One Style for all seven pages: SPM navy / teal / pearl and one typeface only,
   Bricolage Grotesque at its 36pt optical size ("Bricolage Grotesque 036",
   src/scripts/spx-font.js); the key word of a headline is set in teal.
   Spacing, type scale and surfaces follow terminal-industries.com's inner pages
   (as SPM V3 does): 70px / weight 400 / −0.05em headlines, 18px body, grey
   sentence-case labels, flat surfaces with hairline borders — no shadows.
   Each page then composes its own sections from this kit
   (src/styles/spx-<page>.css).
   Motion: reveal choreography in the house style — titles rise
   word by word out of a mask and a blur, opacity lands early, everything below
   the fold is viewport-entry, one shared scroll clock (src/scripts/spx-core.js).
   Page-scoped to the seven inner pages (never SPM V2 / V3).
   ============================================================ */

/* the whole page (menu and footer included) in Bricolage Grotesque 036 */
html:root { --font-body: "Bricolage Grotesque 036", "Bricolage Grotesque", system-ui, sans-serif; }

.spx-r {
  --ink: #0d141f;
  --slate: #1b2a38;
  --steel: #43617a;
  --teal: #22808a;
  --teal-hi: #5cc2c9;
  --pearl: #dadde0;
  --mist: #f4f6f8;
  --paper: #ffffff;
  --tx: #3d4a57;
  --tx-2: #6b7782;
  --line: #e6e9ec;
  --line-d: rgba(255, 255, 255, .14);
  --r-lg: 20px;
  --r-stage: 32px;
  --r-md: 20px;
  --r-sm: 8px;
  --gut: clamp(20px, 4vw, 64px);
  --max: 1336px;
  --ease: cubic-bezier(.16, 1, .3, 1);
  --ease-io: cubic-bezier(.65, 0, .35, 1);
  --sans: "Bricolage Grotesque 036", "Bricolage Grotesque", system-ui, sans-serif;
  font-family: var(--sans);
  color: var(--ink);
  background: var(--paper);
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.spx-r *, .spx-r *::before, .spx-r *::after { box-sizing: border-box; }
:where(.spx-r) img { max-width: 100%; display: block; }
:where(.spx-r) a { color: inherit; text-decoration: none; }
:where(.spx-r) :where(p, h1, h2, h3, h4, ul, ol, li, figure, blockquote) { margin: 0; padding: 0; }
:where(.spx-r) :where(ul, ol) { list-style: none; }

/* ---------- layout ---------- */
.spx-sec { position: relative; padding: clamp(80px, 8vw, 120px) 0; }
.spx-sec-tight { padding: clamp(56px, 6vw, 90px) 0; }
/* faint column grid, as on terminal-industries.com */
.spx-grid { background-image: linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: calc((min(100vw - 2 * var(--gut), var(--max))) / 4) 100%; background-position: calc((100vw - min(100vw - 2 * var(--gut), var(--max))) / 2) 0; }
.spx-w { width: min(100% - 2 * var(--gut), var(--max)); margin-inline: auto; position: relative; }
.spx-w-narrow { width: min(100% - 2 * var(--gut), 980px); margin-inline: auto; position: relative; }
.spx-mist { background: var(--mist); }
.spx-dark { background: var(--ink); color: #fff; --tx: rgba(255, 255, 255, .72); --tx-2: rgba(255, 255, 255, .52); --line: var(--line-d); }

/* inset rounded stage (heroes, dark bands): the page reads as one object */
.spx-stage {
  position: relative;
  margin: 12px;
  border-radius: var(--r-stage);
  overflow: hidden;
  isolation: isolate;
  background: var(--ink);
  color: #fff;
  --tx: rgba(255, 255, 255, .74);
  --tx-2: rgba(255, 255, 255, .55);
  --line: var(--line-d);
}
.spx-stage-light { background: var(--mist); color: var(--ink); --tx: #3d4a57; --tx-2: #7d8790; --line: #e6e9ec; }
/* the stage sits 12px in from the page edge: widen its container by the same
   amount so every section's text starts on one left edge */
.spx-stage .spx-w, .spx-stage .spx-w-narrow { --inset: 12px; width: min(100% - 2 * (var(--gut) - var(--inset)), var(--max)); }
.spx-gl { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.spx-gl canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; opacity: 0; transition: opacity 1.4s var(--ease); }
.spx-gl.is-on canvas { opacity: 1; }
.spx-gl::after { content: ""; position: absolute; inset: 0; pointer-events: none; }
.spx-scrim-l::after { background: linear-gradient(90deg, rgba(13, 20, 31, .62) 0%, rgba(13, 20, 31, .2) 55%, rgba(13, 20, 31, 0) 100%); }
.spx-scrim-b::after { background: linear-gradient(0deg, rgba(13, 20, 31, .7) 0%, rgba(13, 20, 31, .15) 55%, rgba(13, 20, 31, 0) 100%); }

/* ---------- type ---------- */
.spx-eb {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: clamp(16px, 1.3vw, 20px); font-weight: 400; line-height: .95; letter-spacing: -.01em;
  color: #9aa3ab;
}
.spx-eb::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--teal); flex: none; }
.spx-stage:not(.spx-stage-light) .spx-eb, .spx-dark .spx-eb { color: rgba(255, 255, 255, .6); }
.spx-dark .spx-eb::before, .spx-stage:not(.spx-stage-light) .spx-eb::before { background: var(--teal-hi); }
.spx-eb-plain::before { content: none; }

.spx-d1, .spx-d2, .spx-d3, .spx-d4 { font-weight: 400; color: inherit; text-wrap: balance; }
.spx-d1 { font-size: clamp(44px, 6vw, 88px); line-height: .96; letter-spacing: -.052em; }
.spx-d2 { font-size: clamp(36px, 4.9vw, 70px); line-height: 1; letter-spacing: -.051em; }
.spx-d3 { font-size: clamp(26px, 2.4vw, 34.5px); line-height: 1.04; letter-spacing: -.018em; }
.spx-d4 { font-size: clamp(21px, 1.7vw, 24px); line-height: 1.15; letter-spacing: -.015em; }
/* the key word: same face, in teal (one typeface only) */
.spx-r em, .spx-r .spx-it { font-style: normal; font-weight: inherit; }
.spx-d1 em, .spx-d2 em, .spx-d3 em { color: var(--teal); }
.spx-dark .spx-d1 em, .spx-dark .spx-d2 em, .spx-dark .spx-d3 em,
.spx-stage:not(.spx-stage-light) .spx-d1 em, .spx-stage:not(.spx-stage-light) .spx-d2 em, .spx-stage:not(.spx-stage-light) .spx-d3 em { color: var(--teal-hi); }

.spx-lead { font-size: clamp(18px, 1.35vw, 20px); line-height: 1.4; letter-spacing: .01em; color: var(--tx); font-weight: 400; text-wrap: pretty; }
.spx-tx { font-size: 17px; line-height: 1.45; letter-spacing: .015em; color: var(--tx); text-wrap: pretty; }
.spx-sm { font-size: 14px; line-height: 1.45; letter-spacing: .01em; color: var(--tx-2); }
.spx-mw { max-width: 34em; }
.spx-todo { color: var(--teal); border-bottom: 1px dashed currentColor; }
.spx-dark .spx-todo, .spx-stage:not(.spx-stage-light) .spx-todo { color: var(--teal-hi); }

/* visually hidden, still read aloud */
.spx-sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ---------- controls ---------- */
.spx-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.spx-btn {
  --b: var(--ink); --f: #fff;
  position: relative; display: inline-flex; align-items: center; gap: 12px;
  height: 48px; padding: 0 22px; border-radius: 999px;
  background: var(--b); color: var(--f); border: 0;
  font: 500 15px/1 var(--sans); letter-spacing: 0; cursor: pointer;
  overflow: hidden; isolation: isolate;
  transition: transform .5s var(--ease), box-shadow .5s var(--ease);
}
.spx-btn::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--teal); transform: translateY(101%); transition: transform .55s var(--ease); border-radius: inherit; }
.spx-btn:hover::before, .spx-btn:focus-visible::before { transform: none; }
.spx-btn:active { transform: scale(.97); }
.spx-btn svg { width: 16px; height: 16px; transition: transform .5s var(--ease); }
.spx-btn:hover svg { transform: translateX(3px); }
.spx-btn-w { --b: #fff; --f: var(--ink); }
.spx-btn-w:hover { --f: #fff; color: #fff; }
.spx-btn-g { --b: transparent; --f: currentColor; box-shadow: inset 0 0 0 1px currentColor; }
.spx-btn-g::before { background: currentColor; opacity: .08; }
.spx-btn-lg { height: 54px; padding: 0 26px; font-size: 16px; }
.spx-link { display: inline-flex; align-items: center; gap: 10px; font-weight: 500; font-size: 16px; color: inherit; }
.spx-link span { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .5s var(--ease); padding-bottom: 2px; }
.spx-link:hover span { background-size: 100% 1px; }
.spx-link svg { width: 16px; height: 16px; transition: transform .5s var(--ease); }
.spx-link:hover svg { transform: translateX(4px); }
.spx-chip {
  display: inline-flex; align-items: center; height: 40px; padding: 0 18px; border-radius: 999px;
  font: 500 14px/1 var(--sans); color: inherit; background: transparent; border: 0;
  box-shadow: inset 0 0 0 1px var(--line); cursor: pointer;
  transition: background .4s var(--ease), color .4s var(--ease), box-shadow .4s var(--ease);
}
.spx-chip:hover { box-shadow: inset 0 0 0 1px currentColor; }
.spx-chip.is-on { background: var(--ink); color: #fff; box-shadow: none; }

/* ---------- photo placeholders (the real photos come later): art-directed
   tiles in the brand palette that say which photo goes there ---------- */
.spx-ph {
  position: relative; overflow: hidden; border-radius: var(--r-md);
  background:
    radial-gradient(120% 90% at 85% 10%, rgba(92, 194, 201, .30) 0%, rgba(92, 194, 201, 0) 55%),
    radial-gradient(90% 80% at 10% 100%, rgba(67, 97, 122, .55) 0%, rgba(67, 97, 122, 0) 60%),
    linear-gradient(160deg, #22313f 0%, #121c27 100%);
  color: #fff;
  isolation: isolate;
}
.spx-ph::before {          /* fine grid, like a contact sheet */
  content: ""; position: absolute; inset: 0; z-index: -1; opacity: .5;
  background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(80% 80% at 50% 50%, #000 30%, transparent 100%);
}
.spx-ph-l { background: radial-gradient(120% 90% at 85% 10%, rgba(34, 128, 138, .16) 0%, rgba(34, 128, 138, 0) 55%), linear-gradient(160deg, #e9edf0 0%, #d9dfe4 100%); color: var(--ink); }
.spx-ph-l::before { background-image: linear-gradient(rgba(13, 20, 31, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(13, 20, 31, .05) 1px, transparent 1px); }
.spx-ph-cap {
  position: absolute; left: 16px; bottom: 16px; right: 16px;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  font-size: 12.5px; line-height: 1.35; color: inherit;
}
.spx-ph-cap b {
  flex: none; height: 26px; padding: 0 10px; border-radius: 999px; display: inline-flex; align-items: center;
  font-weight: 600; font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
  background: rgba(255, 255, 255, .14); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.spx-ph-l .spx-ph-cap b { background: rgba(13, 20, 31, .07); }
.spx-ph-cap span { opacity: .78; }
.spx-ph-in { position: absolute; inset: 0; transition: transform 1.2s var(--ease); }

/* ---------- reveal choreography ---------- */
.spx-js .spx-rv { opacity: 0; transform: translate3d(0, 28px, 0); filter: blur(8px); transition: opacity .9s var(--ease) calc(var(--d, 0) * 1ms), transform 1.1s var(--ease) calc(var(--d, 0) * 1ms), filter 1s var(--ease) calc(var(--d, 0) * 1ms); }
.spx-js .spx-rv.is-in { opacity: 1; transform: none; filter: none; }
/* headline words: rise out of their own line mask, blur clearing as they land */
.spx-wd { display: inline-block; vertical-align: top; overflow: clip; overflow-clip-margin: .2em; padding-bottom: .14em; margin-bottom: -.14em; }
.spx-wd > span { display: inline-block; transform: translate3d(0, 105%, 0); filter: blur(10px); opacity: 0; transition: transform 1.1s var(--ease) calc(var(--i, 0) * 55ms + var(--d, 0) * 1ms), filter 1s var(--ease) calc(var(--i, 0) * 55ms + var(--d, 0) * 1ms), opacity .5s var(--ease) calc(var(--i, 0) * 55ms + var(--d, 0) * 1ms); }
.is-in .spx-wd > span, .spx-wd.is-in > span { transform: none; filter: none; opacity: 1; }
.spx-js .spx-ln { transform-origin: 0 50%; transform: scaleX(0); transition: transform 1.4s var(--ease) calc(var(--d, 0) * 1ms); }
.spx-js .spx-ln.is-in { transform: none; }

/* media unmask: the frame opens bottom-up and the picture settles from 1.12 */
.spx-js .spx-um { clip-path: inset(100% 0 0 0 round var(--r-md)); transition: clip-path 1.4s var(--ease-io) calc(var(--d, 0) * 1ms); }
.spx-js .spx-um .spx-ph-in { transform: scale(1.12); }
.spx-js .spx-um.is-in { clip-path: inset(0 0 0 0 round var(--r-md)); }
.spx-js .spx-um.is-in .spx-ph-in { transform: none; transition-duration: 1.8s; }

/* hairline rules that draw left to right */
.spx-hr { height: 1px; background: var(--line); border: 0; margin: 0; }

/* ---------- shared pieces ---------- */
.spx-head { display: grid; gap: 22px; margin-bottom: clamp(48px, 6vw, 88px); }
.spx-head-split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: end; gap: 32px clamp(32px, 6vw, 96px); }
.spx-head-c { justify-items: center; text-align: center; }
.spx-head-c .spx-lead { max-width: 36em; }
.spx-idx { font: 500 13px/1 var(--sans); letter-spacing: .08em; color: var(--tx-2); font-variant-numeric: tabular-nums; }
.spx-num { font-variant-numeric: tabular-nums; }

.spx-arrow { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--line); transition: background .5s var(--ease), color .5s var(--ease), box-shadow .5s var(--ease), transform .5s var(--ease); flex: none; }
.spx-arrow svg { width: 16px; height: 16px; }

@media (max-width: 900px) {
  .spx-head-split { grid-template-columns: 1fr; }
  .spx-stage { margin: 8px; border-radius: 24px; }
  .spx-stage .spx-w, .spx-stage .spx-w-narrow { --inset: 8px; }
  .spx-r { --r-lg: 18px; --r-md: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .spx-js .spx-rv, .spx-wd > span, .spx-js .spx-um, .spx-js .spx-ln { transition: opacity .4s linear !important; transform: none !important; filter: none !important; clip-path: none !important; }
  .spx-js .spx-rv:not(.is-in), .spx-wd > span { opacity: 0; }
  .is-in .spx-wd > span, .spx-js .spx-rv.is-in { opacity: 1; }
}

/* ============================================================
   SPM — Solutions. Compositions:
   · hero: full-bleed shader stage with the copy sunk into the bottom corners
     (negantropy-void / stride-hero), shrinking into a rounded card as you
     scroll on — Drape (petrol satin) tinted to SPM navy + teal
   · index: a rail of hairline rows (lumora-services) with a preview plate
     travelling with the pointer (halden catalogue)
   · detail: cards that pin and pile as you scroll (cards-almanac / kimi stack)
   Page-scoped to Solutions.
   ============================================================ */
.sol-hero { min-height: calc(100svh - 24px); display: flex; align-items: flex-end; transform-origin: 50% 0; will-change: transform; }
.sol-hero-in { padding: 150px 0 clamp(36px, 4.5vw, 64px); display: grid; gap: 22px; }
.sol-hero-h { max-width: 11.5em; }
.sol-hero-foot { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 32px 64px; margin-top: 12px; }
.sol-hero-foot .spx-lead { max-width: 33em; }

/* index rail */
.sol-index { padding-top: clamp(80px, 9vw, 140px); }
.sol-list { counter-reset: s; border-top: 1px solid var(--line); }
.sol-row { border-bottom: 1px solid var(--line); }
.sol-row > a {
  position: relative; display: grid; grid-template-columns: 64px minmax(0, 1.05fr) minmax(0, 1fr) 44px; align-items: center; gap: 0 32px;
  padding: 34px 0; isolation: isolate;
}
.sol-row > a::before { content: ""; position: absolute; inset: 0 -24px; z-index: -1; border-radius: 20px; background: var(--mist); opacity: 0; transform: scaleY(.6); transition: opacity .5s var(--ease), transform .6s var(--ease); }
.sol-row-k { display: none; }
.sol-row .spx-d3 { transition: transform .7s var(--ease); }
.sol-row .spx-tx { max-width: 30em; transition: color .4s; }
.sol-row:hover > a::before { opacity: 1; transform: none; }
.sol-row:hover .spx-d3 { transform: translateX(10px); }
.sol-row:hover .spx-arrow { background: var(--ink); color: #fff; box-shadow: none; transform: rotate(-45deg); }

.sol-peek { position: fixed; left: 0; top: 0; width: 300px; aspect-ratio: 4 / 3; pointer-events: none; z-index: 30; opacity: 0; transform: translate3d(-50%, -50%, 0) scale(.6) rotate(-4deg); transition: opacity .35s var(--ease), transform .6s var(--ease); }
.sol-peek .spx-ph { position: absolute; inset: 0; }
.sol-peek.is-on { opacity: 1; }

/* detail: pinned stack */
.sol-detail { padding-bottom: clamp(60px, 7vw, 100px); }
.sol-stack { display: grid; gap: 28px; }
.sol-card { position: sticky; top: calc(96px + var(--k, 0) * 14px); }
.sol-card-in {
  display: grid; max-height: none; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(28px, 4vw, 64px);
  background: #fff; border-radius: var(--r-lg); padding: clamp(24px, 3vw, 44px);
  box-shadow: inset 0 0 0 1px var(--line);
  transform-origin: 50% 0; will-change: transform, filter;
  min-height: min(calc(100vh - 128px), 640px);
}
.sol-card-in .spx-lead { font-size: clamp(17px, 1.25vw, 19px); }
.sol-card-copy { gap: 18px; }
.sol-card-copy { display: flex; flex-direction: column; gap: 22px; align-items: flex-start; }
.sol-card-copy .spx-lead { max-width: 34em; }
.sol-feats { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 32px; padding: 22px 0 4px; border-top: 1px solid var(--line); margin-top: 6px; width: 100%; }
.sol-feats h4 { font-size: 18px; font-weight: 500; letter-spacing: -.01em; margin: 6px 0 6px; color: var(--ink); }
.sol-feat-k { font-size: 14px; font-weight: 400; color: var(--teal); }
.sol-card-copy .spx-btn { margin-top: auto; }
.sol-card-ph { min-height: 100%; aspect-ratio: auto; }

/* closing */
.sol-more-in { display: grid; justify-items: center; text-align: center; gap: 26px; }
.sol-more-in .spx-lead { max-width: 36em; }

@media (max-width: 1024px) {
  .sol-row > a { grid-template-columns: 48px minmax(0, 1fr) 44px; }
  .sol-row .spx-tx { grid-column: 2; grid-row: 2; margin-top: 10px; }
  .sol-row .spx-arrow { grid-column: 3; grid-row: 1; }
  .sol-card-in { grid-template-columns: 1fr; min-height: 0; }
  .sol-card-ph { aspect-ratio: 16 / 10; min-height: 0; order: -1; }
  .sol-card { position: relative; top: auto; }
}
@media (max-width: 700px) {
  .sol-hero-foot { grid-template-columns: 1fr; }
  .sol-hero-in { padding-top: 130px; }
  .sol-row > a { grid-template-columns: 36px minmax(0, 1fr) 40px; padding: 26px 0; gap: 0 14px; }
  .sol-row .spx-arrow { width: 40px; height: 40px; }
  .sol-feats { grid-template-columns: 1fr; gap: 20px; }
  .sol-peek { display: none; }
}

/* ============================================================
   SPM — Pourquoi SPM. A light, editorial page. Compositions:
   · hero: centred statement over Nappe (porcelain sheet) tinted pearl + teal
   · film: the 16:9 frame opens from a card to the full width as you scroll
   · promise: an inset three-cell bento (stride-stats)
   · statement: pinned, its letters filling in with the scroll (ridgeline about)
   · pillars: four columns, the active one widening (colonnade)
   · approach: heading pinned while a ruled list scrolls past (artist-process)
   · story: tonally inverted inset panel with counting figures (lumora-stats)
   Page-scoped to Pourquoi SPM.
   ============================================================ */
.why-hero { min-height: min(92svh, 920px); display: grid; place-items: center; text-align: center; }
.why-hero-in { display: grid; justify-items: center; gap: 28px; padding: 150px 0 110px; }
.why-hero .spx-d1 { max-width: 11em; }
.why-hero .spx-lead { max-width: 38em; }
.why-hero .spx-gl::after { background: radial-gradient(70% 60% at 50% 55%, rgba(244, 246, 248, .78) 0%, rgba(244, 246, 248, .35) 60%, rgba(244, 246, 248, 0) 100%); }

/* film: grows from an inset card to (almost) full bleed */
.why-film { padding: 0 12px; margin-top: -72px; position: relative; z-index: 2; }
.why-film-frame { width: var(--fw, 78%); margin: 0 auto; transition: width .1s linear; }
.why-film-ph { aspect-ratio: 16 / 9; border-radius: var(--fr, 28px); }
.why-play { position: absolute; left: 50%; top: 50%; width: 88px; height: 88px; margin: -44px 0 0 -44px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .14); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25); color: #fff; transition: transform .6s var(--ease); }
.why-play svg { width: 26px; height: 26px; margin-left: 4px; }
.why-film-ph:hover .why-play { transform: scale(1.08); }

/* promise bento */
.why-promise-head .spx-d2 { max-width: 13.5em; }
.why-bento { display: grid; grid-template-columns: 1.25fr 1fr; grid-template-rows: auto auto; gap: 16px; }
.why-cell { border-radius: var(--r-lg); padding: clamp(28px, 3.4vw, 48px); display: flex; flex-direction: column; gap: 14px; background: var(--mist); box-shadow: inset 0 0 0 1px var(--line); min-height: 260px; }
.why-cell .spx-eb { margin-bottom: auto; padding-bottom: 32px; }
.why-cell .spx-tx { max-width: 30em; }
.why-cell-a { grid-row: span 2; background: var(--ink); color: #fff; --tx: rgba(255, 255, 255, .72); --tx-2: rgba(255, 255, 255, .55); position: relative; overflow: hidden; isolation: isolate; }
.why-cell-a::before { content: ""; position: absolute; inset: auto -20% -40% auto; width: 80%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, rgba(92, 194, 201, .35), rgba(92, 194, 201, 0)); z-index: -1; }
.why-cell-a .spx-d3 { font-size: clamp(34px, 4.2vw, 60px); letter-spacing: -.045em; }
.why-cell-a .spx-eb::before { background: var(--teal-hi); }
.why-cell-c { background: linear-gradient(150deg, #e6f1f2 0%, #f4f6f8 70%); }

/* statement: letters fill from 18% as it is scrolled through */
.why-statement { height: 220vh; position: relative; }
.why-statement-pin { position: sticky; top: 0; height: 100vh; display: grid; place-items: center; }
.why-statement-tx { font-size: clamp(36px, 5.2vw, 76px); line-height: 1.02; letter-spacing: -.051em; font-weight: 400; text-align: center; text-wrap: balance; }
.why-statement-tx .ch { opacity: .16; transition: opacity .25s linear; }
.why-statement-tx .ch.on { opacity: 1; }
.why-statement-tx .em { color: var(--teal); }

/* pillars: colonnade */
.why-cols { display: flex; gap: 12px; height: clamp(420px, 46vw, 540px); }
.why-col {
  position: relative; flex: 1 1 0; min-width: 0; border-radius: var(--r-lg); padding: 32px; overflow: hidden;
  background: #fff; box-shadow: inset 0 0 0 1px var(--line); display: flex; flex-direction: column; justify-content: flex-end; gap: 16px; cursor: pointer; outline: none;
  transition: flex-grow .9s var(--ease), background .6s var(--ease), color .6s var(--ease);
}
.why-col:focus-visible { box-shadow: 0 0 0 2px var(--teal); }
.why-col-n { position: absolute; left: 32px; top: 28px; font-size: 13px; font-weight: 600; letter-spacing: .1em; color: var(--tx-2); }
.why-col .spx-d3 { font-size: clamp(20px, 1.9vw, 30px); transition: font-size .6s var(--ease); }
.why-col.is-on .spx-d3 { font-size: clamp(26px, 2.6vw, 40px); }
.why-col-body { display: grid; gap: 18px; max-width: 26em; opacity: 0; transform: translateY(16px); transition: opacity .4s var(--ease), transform .7s var(--ease); }
.why-col-q { font-size: clamp(19px, 1.6vw, 24px); line-height: 1.25; letter-spacing: -.02em; color: var(--teal); }
.why-col.is-on { flex-grow: 2.4; background: var(--ink); color: #fff; --tx: rgba(255, 255, 255, .72); --tx-2: rgba(255, 255, 255, .5); }
.why-col.is-on .why-col-body { opacity: 1; transform: none; transition-delay: .25s; }
.why-col.is-on .why-col-q { color: var(--teal-hi); }
.why-col::after { content: ""; position: absolute; right: -30%; top: -30%; width: 90%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, rgba(92, 194, 201, .28), rgba(92, 194, 201, 0)); opacity: 0; transition: opacity .9s var(--ease); pointer-events: none; }
.why-col.is-on::after { opacity: 1; }
/* pillars, desktop colonnade: closed cards collapse their text so every title shares one bottom line;
   the text opens at a fixed measure (no reflow while the card widens) and titles keep one size */
@media (min-width: 1025px) {
  .why-col { gap: 0; }
  .why-col .spx-d3, .why-col.is-on .spx-d3 { font-size: clamp(22px, 2vw, 30px); line-height: 1.08; }
  .why-col-body { width: clamp(280px, 30vw, 440px); max-width: none; max-height: 0; overflow: hidden; margin-top: 0;
    transition: opacity .35s var(--ease), transform .6s var(--ease), max-height .7s var(--ease), margin-top .7s var(--ease); }
  .why-col.is-on .why-col-body { max-height: 320px; margin-top: 18px; }
  .why-col .spx-d3 { transition: color .6s var(--ease); }
}
/* Carrières cards: a full-bleed photo on top, the outline number laid over its corner */
.car-card:has(.car-card-ph) { min-height: 0; padding-top: 0; }
.car-card-ph { aspect-ratio: 16 / 10; margin: 0 calc(-1 * clamp(28px, 3vw, 44px)) 10px; border-radius: 0; }
.car-card-ph::after { content: ""; position: absolute; inset: 0; background: linear-gradient(160deg, rgba(13, 20, 31, .5) 0%, rgba(13, 20, 31, 0) 46%), linear-gradient(0deg, rgba(13, 20, 31, .18), rgba(13, 20, 31, 0) 40%); pointer-events: none; }
.car-card:has(.car-card-ph) .car-card-n { position: absolute; z-index: 2; top: 22px; left: clamp(28px, 3vw, 44px); margin: 0; font-size: clamp(54px, 5.4vw, 88px); -webkit-text-stroke: 1px rgba(255, 255, 255, .78); }
.car-card:hover .car-card-ph .spx-ph-in { transform: scale(1.05); }
.car-card:has(.car-card-ph) .spx-d3 { margin-top: 12px; }
/* Pourquoi SPM, method: the coaching photo between the intro and the live-dashboard card */
.why-method-ph { aspect-ratio: 4 / 3; margin-top: 6px; }
/* sectors: the photo sits inside the hover band, on the row's empty side (spx-sec-band.js) */
@media (min-width: 1025px) {
  .sec-cat .sec-plate { display: none !important; }
  .sec-band.has-media { overflow: hidden; isolation: isolate; box-shadow: 0 34px 70px -34px rgba(13, 20, 31, .6);
    transition: transform .7s var(--ease), height .7s var(--ease), left .7s var(--ease), width .7s var(--ease), opacity .4s var(--ease); }
  .sec-band-img { position: absolute; top: 0; bottom: 0; right: 0; width: 66%; z-index: 0; background-size: cover; background-position: center;
    opacity: 0; transform: scale(1.14) translate3d(var(--px, 0px), 0, 0); filter: saturate(.82) contrast(1.06) brightness(.92);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .4) 24%, #000 64%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .4) 24%, #000 64%);
    transition: opacity .7s var(--ease), transform 1.8s var(--ease); }
  .sec-band-img.is-on { opacity: 1; transform: scale(1.03) translate3d(var(--px, 0px), 0, 0); }
  .sec-band.has-media::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(90deg, var(--ink) 0%, rgba(13, 20, 31, .93) 36%, rgba(13, 20, 31, .6) 70%, rgba(13, 20, 31, .28) 100%); }
  .sec-band-glow { position: absolute; inset: 0; z-index: 2; border-radius: inherit; pointer-events: none;
    box-shadow: inset 0 0 0 1px rgba(92, 194, 201, .2); background: radial-gradient(55% 140% at 100% 0%, rgba(34, 128, 138, .32), rgba(34, 128, 138, 0) 62%); }
  .sec-band-tag { position: absolute; top: 16px; right: 18px; z-index: 3; padding: 6px 11px; border-radius: 999px; font-size: 10.5px; letter-spacing: .14em;
    text-transform: uppercase; color: rgba(255, 255, 255, .86); background: rgba(13, 20, 31, .42); border: 1px solid rgba(255, 255, 255, .14);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); opacity: 0; transform: translateY(-4px); transition: opacity .5s var(--ease) .15s, transform .6s var(--ease) .15s; }
  .sec-band.is-on .sec-band-tag { opacity: 1; transform: none; }
  .sec-band.is-on .sec-band-tag.is-hidden { opacity: 0; }
  .sec-row.is-on .spx-tx, .sec-row.is-on .sec-name { text-shadow: 0 1px 14px rgba(13, 20, 31, .55); }
}

/* approach */
.why-approach-in { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 7vw, 120px); align-items: start; }
.why-approach-head { position: sticky; top: 130px; display: grid; gap: 24px; }
.why-steps { border-top: 1px solid var(--line); }
.why-step { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 24px; padding: 40px 0; border-bottom: 1px solid var(--line); }
.why-step-n { font-size: clamp(44px, 5vw, 72px); line-height: .9; font-weight: 400; letter-spacing: -.05em; color: transparent; -webkit-text-stroke: 1px rgba(13, 20, 31, .22); }
.why-step .spx-d4 { margin-bottom: 12px; }

/* story: inverted panel */
.why-story { padding: clamp(56px, 7vw, 110px) 0; }
.why-story-in { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1fr); gap: clamp(36px, 6vw, 96px); align-items: center; }
.why-story-ph { aspect-ratio: 4 / 5; }
.why-story-copy { display: grid; gap: 26px; }
.why-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; border-top: 1px solid var(--line); padding-top: 28px; margin-top: 8px; }
.why-stat-n { font-size: clamp(34px, 3.6vw, 56px); font-weight: 400; letter-spacing: -.04em; line-height: 1; margin-bottom: 10px; }
.why-stat-n .spx-todo { font-size: .5em; letter-spacing: 0; }

@media (max-width: 1024px) {
  .why-cols { flex-direction: column; height: auto; }
  .why-col { min-height: 120px; justify-content: flex-start; padding-top: 64px; }
  .why-col .why-col-body { opacity: 1; transform: none; }
  .why-approach-in, .why-story-in { grid-template-columns: 1fr; }
  .why-approach-head { position: relative; top: auto; }
  .why-bento { grid-template-columns: 1fr; }
  .why-cell-a { grid-row: auto; }
}
@media (max-width: 700px) {
  .why-hero-in { padding: 130px 0 96px; }
  .why-film { margin-top: -48px; padding: 0 8px; }
  .why-play { width: 64px; height: 64px; margin: -32px 0 0 -32px; }
  .why-step { grid-template-columns: 56px minmax(0, 1fr); gap: 12px; padding: 30px 0; }
  .why-stats { grid-template-columns: 1fr; gap: 18px; }
  .why-statement { height: 180vh; }
  .why-cell { min-height: 0; }
  .why-cell .spx-eb { padding-bottom: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .why-statement { height: auto; padding: 120px 0; }
  .why-statement-pin { position: relative; height: auto; }
  .why-statement-tx .ch { opacity: 1; }
}

/* ============================================================
   SPM — Clients & Partenaires. Compositions:
   · hero: a 7|5 split headline / lead, then two logo rows drifting in
     opposite directions, edge to edge (stride-logo-marquee)
   · testimonials: a dark inset stage over Demilune (the cursor carries the
     light), a ruled list of names as the control and the wide quote panel it
     swaps (marcus-vane-voices)
   · partners: a hairline cell grid (clarix-clients) + a certifications plate
   Page-scoped to Clients & Partenaires.
   ============================================================ */
.cli-hero { padding: 170px 0 clamp(72px, 8vw, 110px); }
.cli-hero-in { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: 40px clamp(40px, 6vw, 100px); align-items: end; }
.cli-hero-copy { display: grid; gap: 26px; }
.cli-hero-copy .spx-d1 { max-width: 10.5em; }
.cli-hero-side { display: grid; gap: 18px; padding-bottom: 12px; }
.cli-note { padding-left: 16px; border-left: 2px solid var(--teal); }

.cli-marquee { margin-top: clamp(64px, 8vw, 112px); display: grid; gap: 14px; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.cli-track { display: flex; gap: 14px; width: max-content; will-change: transform; }
.cli-logo { flex: none; width: clamp(180px, 17vw, 240px); height: 96px; border-radius: var(--r-lg); display: grid; place-items: center; background: #fff; box-shadow: inset 0 0 0 1px var(--line); color: var(--tx-2); font-size: 14px; font-weight: 500; letter-spacing: .02em; transition: background .5s var(--ease), color .5s var(--ease); }
.cli-logo:hover { background: var(--ink); color: #fff; }

.cli-sectors { margin-top: clamp(48px, 6vw, 80px); display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; }
.cli-chips { display: flex; flex-wrap: wrap; gap: 10px; }

/* voices */
.cli-voices { padding: clamp(80px, 9vw, 140px) 0; }
.cli-voices-in { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(40px, 7vw, 120px); align-items: stretch; }
.cli-voices-head { display: flex; flex-direction: column; gap: 22px; }
.cli-names { margin-top: auto; border-top: 1px solid var(--line); }
.cli-name { position: relative; width: 100%; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; align-items: center; padding: 22px 0; background: none; border: 0; border-bottom: 1px solid var(--line); color: inherit; text-align: left; font: inherit; cursor: pointer; opacity: .5; transition: opacity .5s var(--ease); }
.cli-name:hover, .cli-name.is-on { opacity: 1; }
.cli-who { display: grid; gap: 4px; }
.cli-who b { font-weight: 500; font-size: 17px; }
.cli-who small { font-size: 13.5px; color: var(--tx-2); }
.cli-bar { position: absolute; left: 0; bottom: -1px; height: 1px; width: 100%; background: var(--teal-hi); transform: scaleX(0); transform-origin: 0 50%; }
.cli-name.is-on .cli-bar { animation: cliBar var(--cli-t, 7s) linear forwards; }
.cli-voices-in.is-paused .cli-name.is-on .cli-bar { animation-play-state: paused; }
@keyframes cliBar { to { transform: scaleX(1); } }

.cli-quotes { position: relative; display: grid; min-height: clamp(380px, 38vw, 520px); }
.cli-quote { grid-area: 1 / 1; margin: 0; align-self: center; display: grid; gap: 40px; border-radius: var(--r-lg); padding: clamp(32px, 4.4vw, 64px); background: rgba(255, 255, 255, .06); backdrop-filter: blur(24px) saturate(1.2); -webkit-backdrop-filter: blur(24px) saturate(1.2); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); opacity: 0; transform: translateY(24px) scale(.98); filter: blur(6px); pointer-events: none; transition: opacity .6s var(--ease), transform .9s var(--ease), filter .7s var(--ease); }
.cli-quote.is-on { opacity: 1; transform: none; filter: none; pointer-events: auto; transition-delay: .15s; }
.cli-mark { font-size: 120px; line-height: .62; height: 44px; font-weight: 400; color: var(--teal-hi); }
.cli-q { font-size: clamp(26px, 2.6vw, 38px); line-height: 1.15; letter-spacing: -.03em; font-weight: 400; }
.cli-by { display: flex; align-items: center; gap: 16px; }
.cli-by b { display: block; font-weight: 500; }
.cli-by small { font-size: 14px; color: var(--tx-2); }
.cli-av { width: 52px; height: 52px; border-radius: 50%; flex: none; }

/* partners */
.cli-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.cli-cell { height: clamp(140px, 14vw, 200px); display: grid; place-items: center; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--tx-2); font-size: 14px; font-weight: 500; position: relative; overflow: hidden; }
.cli-cell::before { content: ""; position: absolute; inset: 0; background: var(--mist); transform: translateY(101%); transition: transform .7s var(--ease); z-index: -1; }
.cli-cell { isolation: isolate; }
.cli-cell:hover::before { transform: none; }
.cli-cert { margin-top: 32px; border-radius: var(--r-lg); padding: clamp(28px, 3.4vw, 48px); background: var(--ink); color: #fff; --tx: rgba(255, 255, 255, .72); --tx-2: rgba(255, 255, 255, .5); display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.cli-cert > div:first-child { display: grid; gap: 12px; }
.cli-cert .spx-eb::before { background: var(--teal-hi); }
.cli-labels { display: flex; gap: 12px; }
.cli-label { width: 112px; height: 112px; border-radius: 50%; display: grid; place-items: center; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .2); font-size: 13px; color: rgba(255, 255, 255, .6); }

@media (max-width: 1024px) {
  .cli-hero-in, .cli-voices-in { grid-template-columns: 1fr; }
  .cli-quotes { min-height: 0; }
  .cli-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .cli-hero { padding-top: 130px; }
  .cli-logo { width: 150px; height: 76px; border-radius: 16px; }
  .cli-label { width: 84px; height: 84px; }
  .cli-quote { gap: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  .cli-name.is-on .cli-bar { animation: none; transform: scaleX(1); }
}

/* ============================================================
   SPM — Secteurs & études de cas. Compositions:
   · hero: light stage over Shoal (pale caustic swell — the one caustic safe
     under text), tinted to SPM pearl / steel
   · catalogue: oversized category rows; a full-width navy band slides onto the
     hovered row, its type flips to white, and a tilted preview plate rides
     along (halden catalogue)
   · case study: media pinned on the left while the chapters scroll past
     (clarix-feature), then a two-up row with the second card dropped
     (marcus-vane-ventures)
   · closing: tonal inversion, one centred column (artist-cta)
   Page-scoped to Secteurs.
   ============================================================ */
.sec-hero { min-height: min(86svh, 860px); display: flex; align-items: flex-end; }
.sec-hero-in { display: grid; gap: 26px; padding: 160px 0 clamp(48px, 6vw, 88px); }
.sec-hero .spx-d1 { max-width: 11em; }
.sec-hero .spx-lead { max-width: 32em; }
.sec-hero .spx-gl::after { background: linear-gradient(0deg, rgba(244, 246, 248, .7) 0%, rgba(244, 246, 248, 0) 60%); }

/* catalogue */
.sec-cat .spx-w { position: relative; }
/* real photos in the placeholders */
.spx-ph.spx-ph-photo { background: #1b2a38; }
.spx-ph.spx-ph-photo::before { display: none; }
.spx-ph-photo > .spx-img, .spx-ph-photo .spx-ph-in > .spx-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.spx-img-grade { filter: saturate(.8) contrast(1.04); }
/* crop focus for photos whose subject is off-centre */
.spx-img[src*="pexels-8867198"] { object-position: 12% 50%; }
.spx-img[src*="pexels-7108959"] { object-position: 50% 30%; }
.spx-img[src*="pexels-8867417"] { object-position: 50% 22%; }
.spx-img[src*="pexels-7658387"] { object-position: 35% 50%; }
/* testimonial avatars: role monogram (no photos of people for invented testimonials) */
.cli-av { display: grid; place-items: center; font-size: 13px; font-weight: 600; letter-spacing: .06em; color: #fff; }
/* one photo, one place: the Solutions hover card would repeat the card photos */
.sol-peek { display: none !important; }
.spx-ph-photo .news-brand::after { content: ""; position: absolute; inset: 0; background: linear-gradient(160deg, rgba(13, 20, 31, .62) 0%, rgba(27, 42, 56, .38) 100%); }
.spx-ph-photo .news-brand-mark { position: relative; z-index: 1; }
/* hover previews (Solutions list, Secteurs list) */
.spx-peek-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .3s ease; }
.spx-ph.has-img::before, .spx-ph.has-img .spx-ph-cap { opacity: 0; }
.sec-plate .spx-peek-img { filter: saturate(.8) contrast(1.04); }
.sec-plate .spx-ph.has-img::after { content: ""; position: absolute; inset: 0; background: rgba(27, 42, 56, .12); pointer-events: none; }
.sec-rows { position: relative; z-index: 1; border-top: 1px solid var(--line); }
@media (min-width: 1025px) {
  .sec-cat .sec-rows { display: grid; grid-auto-flow: column; grid-template-rows: repeat(9, auto); column-gap: clamp(40px, 5vw, 96px); }
  .sec-cat .sec-rows .sec-row { grid-template-columns: 48px minmax(0, 1fr); gap: 8px 16px; align-items: baseline; }
  .sec-cat .sec-rows .sec-row .sec-name { font-size: clamp(32px, 3.5vw, 58px); }
  .sec-cat .sec-rows .sec-row .spx-tx { grid-column: 2; }
}
.sec-row { position: relative; display: grid; grid-template-columns: 64px minmax(0, 1fr) minmax(0, 26em); align-items: center; gap: 24px; padding: clamp(18px, 2vw, 28px) 0; border-bottom: 1px solid var(--line); cursor: default; transition: color .45s var(--ease); }
.sec-name { font-size: clamp(44px, 6.2vw, 96px); line-height: 1; font-weight: 400; letter-spacing: -.052em; transition: transform .8s var(--ease); }
.sec-row .spx-tx { transition: color .45s var(--ease), opacity .45s var(--ease); opacity: .85; }
.sec-row.is-on { color: #fff; }
.sec-row.is-on .spx-tx, .sec-row.is-on .spx-idx { color: rgba(255, 255, 255, .78); }
.sec-row.is-on .sec-name { transform: translateX(16px); }
.sec-band { position: absolute; left: -24px; right: -24px; top: 0; height: 0; background: var(--ink); border-radius: 22px; z-index: 0; opacity: 0; transition: transform .7s var(--ease), height .7s var(--ease), opacity .4s var(--ease); }
.sec-band.is-on { opacity: 1; }
.sec-plate { position: absolute; z-index: 2; right: 30%; top: 0; width: clamp(200px, 18vw, 280px); aspect-ratio: 4 / 5; pointer-events: none; opacity: 0; transform: translate3d(0, 0, 0) rotate(5deg) scale(.85); transition: opacity .4s var(--ease), transform .8s var(--ease); }
.sec-plate .spx-ph { position: absolute; inset: 0; box-shadow: 0 0 0 6px #fff; }
.sec-plate.is-on { opacity: 1; }

/* case study */
.sec-feature { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(32px, 6vw, 96px); align-items: start; background: #fff; box-shadow: inset 0 0 0 1px var(--line); border-radius: var(--r-lg); padding: clamp(18px, 2vw, 28px); }
.sec-feature-media { position: sticky; top: 110px; }
.sec-feature-media .spx-ph { aspect-ratio: 4 / 5; }
.sec-feature-copy { display: grid; gap: 22px; padding: clamp(16px, 3vw, 44px) clamp(8px, 2vw, 28px) clamp(16px, 3vw, 44px) 0; }
.sec-chapters { display: grid; border-top: 1px solid var(--line); margin-top: 10px; }
.sec-chapters > div { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 12px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.sec-chapters h4 { font-size: 19px; font-weight: 500; margin-bottom: 6px; }
.sec-ch-n { font-size: 13px; font-weight: 600; color: var(--teal); padding-top: 3px; }
.sec-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.sec-stats > div { background: var(--mist); border-radius: var(--r-sm); padding: 22px 20px; display: grid; gap: 8px; }
.sec-stat-n { font-size: clamp(26px, 2.4vw, 36px); font-weight: 400; letter-spacing: -.03em; line-height: 1; }
.sec-stat-n .spx-todo { font-size: .55em; letter-spacing: 0; }
.sec-quote { margin: 8px 0 0; padding-left: 22px; border-left: 2px solid var(--teal); display: grid; gap: 10px; }
.sec-quote p { font-size: clamp(20px, 1.8vw, 26px); line-height: 1.35; letter-spacing: -.015em; color: var(--ink); }

.sec-more { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 20px; }
.sec-more .sec-card:nth-child(2) { margin-top: clamp(0px, 8vw, 120px); }
.sec-card { display: grid; gap: 14px; align-content: start; background: #fff; box-shadow: inset 0 0 0 1px var(--line); border-radius: var(--r-lg); padding: 18px 18px 30px; transition: transform .7s var(--ease), box-shadow .7s var(--ease); }
.sec-card > :not(.sec-card-ph) { margin-inline: 12px; }
.sec-card-ph { aspect-ratio: 16 / 10; margin-bottom: 10px; }
.sec-card:hover { transform: translateY(-4px); box-shadow: inset 0 0 0 1px #cfd5da; }
.sec-card:hover .spx-ph-in { transform: scale(1.06); }
.sec-card:hover .spx-link span { background-size: 100% 1px; }

/* closing */
.sec-cta { padding: clamp(110px, 13vw, 200px) 0; text-align: center; background: radial-gradient(80% 120% at 50% 120%, #1d4a55 0%, var(--ink) 60%); }
.sec-cta-in { display: grid; justify-items: center; gap: 26px; }
.sec-cta .spx-d1 { max-width: 10em; }

@media (max-width: 1024px) {
  .sec-row { grid-template-columns: 44px minmax(0, 1fr); }
  .sec-row .spx-tx { grid-column: 2; }
  .sec-band, .sec-plate { display: none; }
  .sec-feature { grid-template-columns: 1fr; }
  .sec-feature-media { position: relative; top: auto; }
  .sec-feature-media .spx-ph { aspect-ratio: 16 / 11; }
  .sec-feature-copy { padding: 8px; }
}
@media (max-width: 700px) {
  .sec-hero-in { padding-top: 130px; }
  .sec-row { grid-template-columns: 34px minmax(0, 1fr); gap: 8px 12px; padding: 22px 0; }
  .sec-more { grid-template-columns: 1fr; }
  .sec-more .sec-card:nth-child(2) { margin-top: 0; }
  .sec-stats { grid-template-columns: 1fr; }
}

/* ============================================================
   SPM — Actualités. The quiet page of the set: no shader, a newsroom.
   Compositions:
   · hero: an oversized title set across the full measure, the lead and a
     filter strip under one hairline (creative-director-portfolio header)
   · featured story: a wide frame that unmasks bottom-up beside its copy
     (lumora-hero split)
   · articles: a three-up card field that filters in place, cards lifting and
     their pictures easing in on hover
   Page-scoped to Actualités.
   ============================================================ */
.news-hero { padding: 170px 0 clamp(40px, 5vw, 64px); }
.news-hero-in { display: grid; gap: 26px; }
.news-title { font-size: clamp(56px, 9.6vw, 150px); line-height: .92; letter-spacing: -.056em; font-weight: 400; }
.news-hero-foot { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 48px; align-items: end; padding-top: 28px; margin-top: 12px; border-top: 1px solid var(--line); }
.news-hero-foot .spx-lead { max-width: 28em; }
.news-filter { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }

.news-body { padding: clamp(24px, 3vw, 40px) 0 clamp(96px, 11vw, 160px); }
.news-feature { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.news-feature-ph { aspect-ratio: 16 / 10; }
.news-feature:hover .spx-ph-in { transform: scale(1.04); }
.news-feature:hover .spx-link span { background-size: 100% 1px; }
.news-feature-copy { display: grid; gap: 22px; align-content: center; }
.news-feature-copy .spx-d2 { font-size: clamp(32px, 3.6vw, 56px); }
.news-brand { display: grid; place-items: center; }
.news-brand-mark { font-size: clamp(18px, 2vw, 28px); letter-spacing: .5em; font-weight: 400; color: rgba(255, 255, 255, .85); padding-left: .5em; }

.news-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(36px, 4vw, 56px) 24px; margin-top: clamp(72px, 8vw, 120px); padding-top: clamp(48px, 5vw, 72px); border-top: 1px solid var(--line); }
.news-card { display: grid; gap: 14px; align-content: start; transition: opacity .45s var(--ease), transform .6s var(--ease), filter .45s var(--ease); }
.news-card-ph { aspect-ratio: 16 / 10; margin-bottom: 8px; }
.news-card .spx-d4 { transition: color .4s; }
.news-card:hover .spx-ph-in { transform: scale(1.06); }
.news-card:hover .spx-d4 { color: var(--teal); }
.news-card.is-out { display: none; }
.news-card.is-fading { opacity: 0; transform: translateY(14px); filter: blur(4px); }
.news-empty { grid-column: 1 / -1; padding: 40px 0; color: var(--tx-2); }
.news-more { display: flex; justify-content: center; margin-top: clamp(56px, 6vw, 88px); }

@media (max-width: 1024px) {
  .news-feature { grid-template-columns: 1fr; }
  .news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .news-hero-foot { grid-template-columns: 1fr; }
  .news-filter { justify-content: flex-start; }
}
@media (max-width: 700px) {
  .news-hero { padding-top: 130px; }
  .news-grid { grid-template-columns: 1fr; }
  .news-filter { flex-wrap: nowrap; overflow-x: auto; margin: 0 calc(-1 * var(--gut)); padding: 2px var(--gut); scrollbar-width: none; }
  .news-filter::-webkit-scrollbar { display: none; }
  .news-filter .spx-chip { flex: none; }
}

/* ============================================================
   SPM — Carrières. Warm, human, the most "alive" of the set.
   Compositions:
   · hero: dark stage over Feather (a watercolour wash drying, near-still)
     with the copy on the left and a cursor-tilted photo card floating over
     the right (ai-studio-hero)
   · values: two rows of oversized pale words pushed to opposite edges and
     drifting apart on scroll (baseline-trust), photographs on their own
     parallax below
   · offers: hairline rows that fill ink from the left on hover
   · closing: an inset dark card with a teal glow
   Page-scoped to Carrières.
   ============================================================ */
.car-hero { min-height: calc(100svh - 24px); display: flex; align-items: center; }
.car-hero-in { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(32px, 6vw, 96px); align-items: center; padding: 150px 0 90px; }
.car-hero-copy { display: grid; gap: 26px; justify-items: start; }
.car-hero-copy .spx-d1 { max-width: 9.5em; }
.car-hero-copy .spx-lead { max-width: 30em; }
.car-hero-card { perspective: 1200px; }
.car-hero-ph { aspect-ratio: 4 / 5; border-radius: 26px; transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translate3d(calc(var(--px, 0) * 10px), calc(var(--py, 0) * 10px), 0) rotate(-3deg); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); }

/* three cards */
.car-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.car-card { position: relative; overflow: hidden; isolation: isolate; border-radius: var(--r-lg); background: var(--mist); box-shadow: inset 0 0 0 1px var(--line); padding: clamp(28px, 3vw, 44px); min-height: clamp(300px, 28vw, 400px); display: flex; flex-direction: column; gap: 14px; transition: transform .7s var(--ease), background .6s var(--ease), color .6s var(--ease); }
.car-card-n { font-size: clamp(64px, 7vw, 112px); font-weight: 400; letter-spacing: -.06em; line-height: .8; color: transparent; -webkit-text-stroke: 1px rgba(13, 20, 31, .2); margin-bottom: auto; transition: -webkit-text-stroke-color .6s; }
.car-card::after { content: ""; position: absolute; z-index: -1; right: -30%; bottom: -40%; width: 90%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, rgba(92, 194, 201, .35), rgba(92, 194, 201, 0)); opacity: 0; transition: opacity .8s var(--ease); }
.car-card:hover { transform: translateY(-6px); background: var(--ink); color: #fff; --tx: rgba(255, 255, 255, .72); }
.car-card:hover::after { opacity: 1; }
.car-card:hover .car-card-n { -webkit-text-stroke-color: rgba(255, 255, 255, .35); }

/* values */
.car-values { overflow: hidden; }
.car-words { display: grid; gap: 0; margin: 0 0 clamp(40px, 5vw, 72px); user-select: none; }
.car-words-row { display: flex; gap: .4em; white-space: nowrap; font-size: clamp(56px, 9vw, 150px); font-weight: 400; letter-spacing: -.05em; line-height: 1.02; will-change: transform; }
.car-words-row:nth-child(2) { justify-content: flex-end; }
.car-words-row span { color: var(--ink); }
.car-words-row span.o { color: transparent; -webkit-text-stroke: 1px rgba(13, 20, 31, .28); }
.car-words-row span:nth-child(odd):not(.o) { color: var(--teal); }
.car-photos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; }
.car-photo { aspect-ratio: 4 / 3; }
.car-photo:nth-child(2) { margin-top: 64px; }

/* offers */
.car-list { border-top: 1px solid var(--line); }
.car-job > a { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 30px 8px; border-bottom: 1px solid var(--line); isolation: isolate; transition: color .5s var(--ease), padding .6s var(--ease); }
.car-job > a::before { content: ""; position: absolute; inset: 0 -16px; z-index: -1; border-radius: 18px; background: var(--ink); transform: scaleX(0); transform-origin: 0 50%; transition: transform .7s var(--ease); }
.car-job > a > div { display: grid; gap: 6px; }
.car-apply { display: inline-flex; align-items: center; gap: 14px; font-weight: 500; flex: none; }
.car-job > a:hover { color: #fff; padding-left: 24px; --tx-2: rgba(255, 255, 255, .6); }
.car-job > a:hover::before { transform: none; }
.car-job > a:hover .spx-arrow { background: #fff; color: var(--ink); box-shadow: none; transform: rotate(-45deg); }
.car-job > a:hover .spx-todo { color: var(--teal-hi); }

/* closing card */
.car-spont { padding: 0 0 clamp(96px, 11vw, 160px); }
.car-spont-card { position: relative; overflow: hidden; isolation: isolate; border-radius: var(--r-lg); background: var(--ink); color: #fff; --tx: rgba(255, 255, 255, .72); --tx-2: rgba(255, 255, 255, .55); padding: clamp(56px, 8vw, 120px) clamp(24px, 6vw, 96px); display: grid; justify-items: center; text-align: center; gap: 24px; }
.car-spont-card::before { content: ""; position: absolute; z-index: -1; left: 50%; bottom: -60%; width: 90%; aspect-ratio: 1; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(closest-side, rgba(34, 128, 138, .55), rgba(34, 128, 138, 0)); }
.car-spont-card .spx-d2 em { color: var(--teal-hi); }
.car-spont-card .spx-todo { color: var(--teal-hi); }

@media (max-width: 1024px) {
  .car-hero-in { grid-template-columns: 1fr; }
  .car-hero-card { max-width: 420px; }
  .car-cards { grid-template-columns: 1fr; }
  .car-card { min-height: 0; }
  .car-card-n { margin-bottom: 18px; }
}
@media (max-width: 700px) {
  .car-hero-in { padding: 130px 0 56px; }
  .car-hero-card { max-width: 72%; justify-self: end; margin-top: 8px; }
  .car-photos { grid-template-columns: 1fr 1fr; }
  .car-photo:nth-child(2) { margin-top: 40px; }
  .car-photo:nth-child(3) { grid-column: 1 / -1; aspect-ratio: 16 / 9; }
  .car-job > a { padding: 24px 4px; align-items: flex-start; flex-direction: column; gap: 14px; }
}

/* ============================================================
   SPM — Contact. Compositions:
   · hero: one dark stage over Soffit (light falling into the shade under an
     overhang, with its bounce) holding the copy and its three next steps on
     the left and the request form on a raised white plate on the right
     (stride-contact / forma-hero, split)
   · offices: three plates with a drawn map and a breathing pin, then the two
     contact lines set large (marcus-vane-contact-footer)
   The form keeps its Instatic markup (data-instatic-form-*); only its look
   changes here. Page-scoped to Contact.
   ============================================================ */
.ct-hero { padding: 150px 0 clamp(48px, 6vw, 88px); }
.ct-hero-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(36px, 6vw, 100px); align-items: start; }
.ct-copy { display: grid; gap: 26px; align-content: start; padding-top: 12px; }
.ct-copy .spx-d1 { max-width: 8em; }
.ct-copy .spx-lead { max-width: 30em; }
.ct-next { display: grid; gap: 18px; margin-top: 18px; }
.ct-steps { position: relative; display: grid; gap: 0; }
.ct-steps::before { content: ""; position: absolute; left: 17px; top: 18px; bottom: 18px; width: 1px; background: linear-gradient(var(--teal-hi), rgba(92, 194, 201, .1)); }
.ct-steps li { position: relative; display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 18px; align-items: center; padding: 10px 0; }
.ct-step-n { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; font-size: 14px; font-weight: 500; background: var(--ink); color: var(--teal-hi); box-shadow: inset 0 0 0 1px rgba(92, 194, 201, .55); }
.ct-jobs { display: grid; gap: 12px; margin-top: 12px; padding: 22px 24px; border-radius: var(--r-md); background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }

/* the form plate */
.ct-form { background: #fff; color: var(--ink); border-radius: var(--r-lg); padding: clamp(24px, 3vw, 44px); --tx-2: #6b7782; }
.ct-form form { display: grid; gap: 18px; }
.ct-form .spmp-h4 { font-size: 28px; font-weight: 400; letter-spacing: -.02em; margin: 0 0 6px; }
.ct-form .spmp-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ct-form .spmp-field { display: grid; gap: 8px; }
.ct-form label { font-size: 13px; font-weight: 500; color: #3d4a57; }
.ct-form .spmp-inp { width: 100%; height: 50px; padding: 0 16px; border-radius: 14px; border: 0; background: #f2f4f6; box-shadow: inset 0 0 0 1px transparent; font: 400 16px/1.3 var(--sans); color: var(--ink); transition: box-shadow .3s var(--ease), background .3s var(--ease); appearance: none; -webkit-appearance: none; }
.ct-form select.spmp-inp { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%230d141f' stroke-width='1.6'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; padding-right: 40px; }
.ct-form .spmp-inp-area { height: auto; min-height: 132px; padding: 14px 16px; resize: vertical; }
.ct-form .spmp-inp:hover { background: #edf0f2; }
.ct-form .spmp-inp:focus { outline: none; background: #fff; box-shadow: inset 0 0 0 1.5px var(--teal), 0 0 0 4px rgba(34, 128, 138, .12); }
.ct-form .spmp-consent { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; align-items: start; }
.ct-form .spmp-check { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--teal); }
.ct-form .spmp-sm { font-size: 13px; line-height: 1.5; color: #6b7782; }
.ct-form .spmp-link { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.ct-form .spmp-btn { position: relative; overflow: hidden; isolation: isolate; height: 56px; width: 100%; border: 0; border-radius: 999px; background: var(--ink); color: #fff; font: 500 16px/1 var(--sans); cursor: pointer; transition: transform .4s var(--ease); }
.ct-form .spmp-btn::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--teal); transform: translateY(101%); transition: transform .55s var(--ease); }
.ct-form .spmp-btn:hover::before { transform: none; }
.ct-form .spmp-btn:active { transform: scale(.98); }

/* offices */
.ct-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ct-office { display: grid; gap: 10px; align-content: start; background: var(--mist); box-shadow: inset 0 0 0 1px var(--line); border-radius: var(--r-lg); padding: 14px 14px 30px; }
.ct-office > :not(.ct-map):not(.ct-map-cap) { margin-inline: 16px; }
.ct-map {
  position: relative; height: 210px; border-radius: 20px; overflow: hidden; margin-bottom: 4px;
  background:
    radial-gradient(circle at 62% 46%, rgba(34, 128, 138, .18) 0, rgba(34, 128, 138, 0) 32%),
    linear-gradient(115deg, transparent 47%, rgba(13, 20, 31, .09) 47.4%, rgba(13, 20, 31, .09) 48.6%, transparent 49%),
    linear-gradient(28deg, transparent 58%, rgba(13, 20, 31, .07) 58.3%, rgba(13, 20, 31, .07) 59.4%, transparent 59.8%),
    linear-gradient(rgba(13, 20, 31, .045) 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(90deg, rgba(13, 20, 31, .045) 1px, transparent 1px) 0 0 / 28px 28px,
    #e8ecef;
}
.ct-map-2 { background-position: 0 0, 0 0, 0 0, 14px 0, 0 14px, 0 0; }
.ct-map-2::before, .ct-map-3::before { content: ""; position: absolute; inset: 0; background: linear-gradient(160deg, transparent 52%, rgba(13, 20, 31, .08) 52.4%, rgba(13, 20, 31, .08) 53.4%, transparent 53.8%); }
.ct-pin { position: absolute; left: 62%; top: 46%; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 4px #fff; }
.ct-pin::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid var(--teal); animation: ctPing 2.4s var(--ease) infinite; }
@keyframes ctPing { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(4.2); opacity: 0; } }
.ct-map-cap { display: flex; gap: 8px; align-items: center; margin: -42px 12px 14px; position: relative; font-size: 12px; color: var(--tx-2); }
.ct-map-cap b { height: 24px; padding: 0 9px; border-radius: 999px; display: inline-flex; align-items: center; background: rgba(255, 255, 255, .85); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink); }
.ct-map-cap span { background: rgba(255, 255, 255, .85); border-radius: 999px; padding: 4px 10px; }
.ct-office .spx-d3 { font-size: clamp(26px, 2.4vw, 34px); }

.ct-strip { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 16px; }
.ct-big { display: grid; gap: 14px; padding: clamp(26px, 3vw, 40px); border-radius: var(--r-lg); background: var(--ink); color: #fff; --tx-2: rgba(255, 255, 255, .55); }
.ct-big .spx-eb::before { background: var(--teal-hi); }
.ct-big-tx { display: flex; align-items: center; gap: 14px; font-size: clamp(24px, 2.6vw, 40px); font-weight: 400; letter-spacing: -.03em; overflow-wrap: anywhere; }

/* this page is the contact form: the shared closing form (v3f-spm-lead, added
   by v3f-shell.js on every inner page) is hidden here, its FAQ stays */
body:has(.spx-p-ct) .v3f-shell-tail .v3f-spm-lead { display: none !important; }

@media (max-width: 1024px) {
  .ct-hero-in { grid-template-columns: 1fr; }
  .ct-grid { grid-template-columns: 1fr; }
  .ct-strip { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .ct-hero { padding-top: 130px; }
  .ct-form .spmp-form-row { grid-template-columns: 1fr; }
  .ct-form { border-radius: 22px; }
}
@media (prefers-reduced-motion: reduce) { .ct-pin::after { animation: none; opacity: 0; } }