/* Integer website: shared styles (all pages). Page specific styles live in assets/css/pages/. */
@font-face{font-family:'Lato';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/38804233a29aaf97.woff2) format('woff2')}@font-face{font-family:'Lato';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/fcd4136085f2a034.woff2) format('woff2')}@font-face{font-family:'Lato';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/2ac78601179c3a63.woff2) format('woff2')}@font-face{font-family:'Lato';font-style:normal;font-weight:900;font-display:swap;src:url(../fonts/898d9808304dc157.woff2) format('woff2')}
body{margin:0;background:#FFFFFF}
a{color:#1A3F59}
a:hover{color:#0F2A3D}
header .m-cta,.m-menu-btn,.m-ph{display:none}
.m-menu-btn{width:44px;height:44px;margin-right:-10px;border:0;background:none;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:0}
.m-menu-btn span{display:block;width:22px;height:2px;border-radius:2px;background:#1A3F59;transition:transform .25s ease,opacity .2s ease}
header.m-open .m-menu-btn span:nth-child(1){transform:translateY(7px) rotate(45deg)}
header.m-open .m-menu-btn span:nth-child(2){opacity:0}
header.m-open .m-menu-btn span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.m-ph{align-items:flex-start;gap:14px;background:#F6F4EF;border:1px dashed #C4CCD6;border-radius:10px;padding:20px;color:#1A3F59;text-align:left}
.m-ph svg{flex:none;margin-top:2px}
.m-ph-t{font-size:15px;font-weight:900}
.m-ph-d{margin-top:4px;font-size:14px;line-height:1.5;color:#4E5D70}
section[style*="background: #1A3F59"] .m-ph{background:rgba(255,255,255,.06);border-color:#4E6B82;color:#FFFFFF}
section[style*="background: #1A3F59"] .m-ph svg{stroke:#FFFFFF}
section[style*="background: #1A3F59"] .m-ph-d{color:#C4D0DC}
@media (max-width:860px){
 header .hdr-in{padding:12px 20px !important;gap:0 12px !important}
 header .hdr-in>a:first-child img{height:22px !important;width:auto !important}
 .m-menu-btn{display:inline-flex}
 header .m-cta{display:inline-flex;margin-left:auto;margin-top:0 !important}
 header nav[data-nav="main"],header .hdr-right{display:none !important}
 header.m-open nav[data-nav="main"]{display:flex !important;flex-direction:column !important;flex-wrap:nowrap !important;align-items:stretch !important;gap:0 !important;width:100%;margin-top:12px;padding-top:6px;border-top:1px solid #E8ECF0;font-size:18px !important}
 header.m-open nav[data-nav="main"]>a,header.m-open .nav-dd>a{padding:13px 0;font-weight:900}
 header.m-open .nav-dd{display:block}
 header.m-open .nav-dd>a svg{display:none}
 header.m-open .nav-dd-menu{display:block !important;position:static;padding:0 0 10px}
 header.m-open .nav-dd-box{border:0;box-shadow:none;padding:0;min-width:0}
 header.m-open .nav-dd-box a{padding:10px 0 !important}
 header.m-open .nav-dd-box>div{display:none}
 header.m-open nav[data-nav="main"] a::after{display:none}
 header.m-open .hdr-right{display:flex !important;flex-wrap:wrap;justify-content:space-between;width:100%;padding:16px 0 8px;border-top:1px solid #E8ECF0;font-size:16px !important}
 header.m-open .hdr-right .nav-cta{display:none}
 section[style*="min-height"]{min-height:0 !important}
 section[style*="padding: 72px 32px"],section[style*="padding: 64px 32px"]{padding:56px 20px !important}
 footer>div{padding-left:20px !important;padding-right:20px !important}
}
@media (max-width:760px){
 .m-hide{display:none !important}
 .m-ph{display:flex}
 #numbers .m-ph{margin-top:8px}
 
 #scan-tool{padding:24px 20px !important}
 #scan-tool .scan-form{grid-template-columns:1fr !important;gap:22px !important}
 #scan-tool .band{grid-template-columns:1fr !important;padding:22px 18px !important}
 #scan-tool .band .big{font-size:40px !important}
 .m-stat{flex-wrap:wrap;row-gap:2px !important}
 .m-stat>span:first-child{white-space:nowrap}
 .xin{padding:20px !important}
 
 #pro-how{height:auto !important}
 #pro-how .how-mark,#pro-how .how-track,#pro-how .how-progress{display:none !important}
 #pro-how .how-sticky{position:static !important;height:auto !important;padding:56px 20px !important}
 #pro-how .how-step{color:#1A3F59 !important;pointer-events:none}
 #pro-how .how-step .d{grid-template-rows:1fr !important;opacity:1 !important}
 #pro-how .how-step .d>span{padding-top:6px !important}
 #pro-how .how-step .dot{background:#FFC32D !important;border-color:#FFC32D !important;transform:none !important}
 .pc-stats{grid-template-columns:repeat(2,minmax(0,1fr)) !important;row-gap:20px !important}
 .pc-stats>div>div:first-child{font-size:32px !important}
 
 .am-year{grid-template-columns:1fr !important;padding:22px !important}
 .am-v{font-size:32px !important;white-space:normal !important}
 .tm-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:28px 16px !important}
 
 .pv-toc{display:none !important}
 .pv-toc-m{display:block !important}
}
.pv-toc-m{display:none}
.m-dots{display:none}
@media (max-width:760px){
 .m-swipe{display:flex !important;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:14px !important;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:4px calc(50vw - 50%) 6px;scrollbar-width:none}
 .m-swipe::-webkit-scrollbar{display:none}
 .m-swipe>*{flex:0 0 84%;scroll-snap-align:start;box-sizing:border-box;min-width:0}
 .m-swipe>.hov-card:hover,.m-swipe>.card-h:hover{transform:none !important}
 .m-dots{display:flex;justify-content:center;gap:8px;margin-top:14px}
 .m-dots button{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:#C4CCD6;cursor:pointer;transition:width .25s ease,background .25s ease}
 .m-dots button[aria-current="true"]{width:22px;border-radius:4px;background:#1A3F59}
 section[style*="background: #1A3F59"] .m-dots button{background:#4E6B82}
 section[style*="background: #1A3F59"] .m-dots button[aria-current="true"]{background:#FFFFFF}
 
 body:has(#screen-home) [style*="font-size: clamp(40px, 5vw, 64px);"],body:has(#screen-home) [style*="font-size: clamp(40px, 5vw, 64px)\""]{font-size:32px !important}body:has(#screen-home) [style*="font-size: clamp(36px, 4.4vw, 64px);"],body:has(#screen-home) [style*="font-size: clamp(36px, 4.4vw, 64px)\""]{font-size:30px !important}body:has(#screen-home) [style*="font-size: clamp(32px, 3.4vw, 48px);"],body:has(#screen-home) [style*="font-size: clamp(32px, 3.4vw, 48px)\""]{font-size:26px !important}body:has(#screen-home) [style*="font-size: clamp(32px, 3.4vw, 44px);"],body:has(#screen-home) [style*="font-size: clamp(32px, 3.4vw, 44px)\""]{font-size:26px !important}body:has(#screen-home) [style*="font-size: clamp(30px, 3vw, 40px);"],body:has(#screen-home) [style*="font-size: clamp(30px, 3vw, 40px)\""]{font-size:26px !important}body:has(#screen-home) [style*="font-size: clamp(52px, 5.6vw, 88px);"],body:has(#screen-home) [style*="font-size: clamp(52px, 5.6vw, 88px)\""]{font-size:42px !important}body:has(#screen-home) [style*="font-size: 44px;"],body:has(#screen-home) [style*="font-size: 44px\""]{font-size:34px !important}body:has(#screen-home) [style*="font-size: 36px;"],body:has(#screen-home) [style*="font-size: 36px\""]{font-size:28px !important}body:has(#screen-home) [style*="font-size: 32px;"],body:has(#screen-home) [style*="font-size: 32px\""]{font-size:24px !important}body:has(#screen-home) [style*="font-size: 24px;"],body:has(#screen-home) [style*="font-size: 24px\""]{font-size:20px !important}body:has(#screen-home) [style*="font-size: 22px;"],body:has(#screen-home) [style*="font-size: 22px\""]{font-size:19px !important}body:has(#screen-home) [style*="font-size: 20px;"],body:has(#screen-home) [style*="font-size: 20px\""]{font-size:16px !important}body:has(#screen-home) [style*="font-size: 18px;"],body:has(#screen-home) [style*="font-size: 18px\""]{font-size:16px !important}body:has(#screen-home) [style*="font-size: 17px;"],body:has(#screen-home) [style*="font-size: 17px\""]{font-size:15px !important}
 body:has(#screen-home) [style*="padding: 40px;"]{padding:26px !important}
}
@media (max-width:1000px){.am-year{grid-template-columns:1fr !important}.am-v{font-size:34px !important}}
@media (max-width:900px){.pv{grid-template-columns:minmax(0,1fr) !important}.pv>div{min-width:0}}
nav[data-nav="main"] a{position:relative}
nav[data-nav="main"] a::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:3px;border-radius:2px;background:#FFC32D;transform:scaleX(0);transform-origin:left;transition:transform .2s ease}
nav[data-nav="main"] a:hover::after,nav[data-nav="main"] a:focus-visible::after{transform:scaleX(1)}
.hl{position:relative}
.hl::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:3px;border-radius:2px;background:#FFC32D;transform:scaleX(0);transform-origin:left;transition:transform .2s ease}
.hl:hover::after,.hl:focus-visible::after{transform:scaleX(1)}
.nav-dd{position:relative;display:flex}
.nav-dd-menu{position:absolute;top:100%;left:-16px;padding-top:14px;display:none;z-index:50}
.nav-dd:hover .nav-dd-menu,.nav-dd:focus-within .nav-dd-menu{display:block}
.nav-dd-box{background:#FFFFFF;border:1px solid #E8ECF0;border-radius:10px;box-shadow:0 12px 32px rgba(26,63,89,.12);padding:6px;min-width:260px}
.nav-dd-box a:hover{background:#F6F4EF}
nav[data-nav="main"] .nav-dd-box a::after{display:none}
.nav-dd-box .dd-cta svg{transition:transform .25s ease}
.nav-dd-box .dd-cta:hover svg{transform:translateX(4px)}
.cta,.cta2{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:#1A3F59;font-size:17px;line-height:1.3;padding-bottom:7px;background-repeat:no-repeat;background-position:left bottom;transition:background-size .25s ease}
.cta{font-weight:900;background-image:linear-gradient(#FFC32D,#FFC32D);background-size:100% 3px}
.cta .arr,.cta2 .arr{transition:transform .25s ease;flex:none}
.cta:hover .arr,.cta:focus-visible .arr{transform:translateX(5px)}
.cta2:hover .arr,.cta2:focus-visible .arr{transform:translateX(5px)}
.cta2{font-weight:700;position:relative}
.cta2::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:2px;background:#FFC32D;transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.cta2:hover::after,.cta2:focus-visible::after{transform:scaleX(1)}
.cta-sm{font-size:14px;gap:8px;padding-bottom:5px;margin-top:5px}
.ar-back:has(> svg)::after{left:24px}
.cta-inv,.cta-inv:hover{color:#FFFFFF}
.hov-link svg{transition:transform .25s ease}
.hov-btn,.hov-card{transition:background-color .2s ease,box-shadow .25s ease,transform .25s ease,border-color .2s ease}
.hov-btn svg,.hov-card svg:last-child{transition:transform .25s ease}
.hov-btn:hover svg{transform:translateX(4px)}
.hov-navy:hover{background:#0F2A3D !important}
.hov-outline:hover{background:#1A3F59 !important;color:#FFFFFF !important}
.hov-yellow:hover{filter:brightness(.95)}
.hov-card:hover svg:last-child{transform:translateX(4px)}
.card-h,.hov-card,.mcard,.w-card,.setup-card,[data-tile],.nw-card,.ar-card{transition:transform .25s ease,box-shadow .25s ease,border-color .2s ease}
[data-reveal].rv-done{transition:transform .25s ease,box-shadow .25s ease,border-color .2s ease !important}
:is(.card-h,.hov-card,.mcard,.w-card,.setup-card,[data-tile]):hover{transform:translateY(-3px) !important;box-shadow:0 10px 28px rgba(26,63,89,.12)}
:is(.card-h,.hov-card,.mcard,.w-card,.setup-card,[data-tile])[style*="border: 1px solid"]:hover,.mcard:hover,.w-card:hover,.setup-card:hover{border-color:#1A3F59 !important}
:is(.nw-card,.ar-card):hover{transform:translateY(-3px) !important}
.card-click{cursor:pointer}
.card-click:hover .card-link::after{transform:scaleX(1)}
.card-click:hover .card-link:not(.mlink) svg{transform:translateX(4px)}
.hov-link,.scan-link,.mlink,.nw-more,.nw-all,.ar-back,.hov-card>div:last-child{position:relative;text-decoration:none !important}
.hov-card>div:last-child,.hov-link,.scan-link,.nw-more,.nw-all,.ar-back,.mlink,.cta,.cta2{width:fit-content;max-width:100%}
.hov-link::after,.scan-link::after,.mlink::after,.nw-more::after,.nw-all::after,.ar-back::after,.hov-card>div:last-child::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:3px;border-radius:2px;background:#FFC32D;transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.hov-link:hover::after,.hov-link:focus-visible::after,.scan-link:hover::after,.scan-link:focus-visible::after,.mlink:hover::after,.mlink:focus-visible::after,.nw-card:hover .nw-more::after,.nw-feat:hover .nw-more::after,.nw-all:hover::after,.ar-back:hover::after,.hov-card:hover>div:last-child::after,.hov-card:focus-visible>div:last-child::after{transform:scaleX(1)}
.hov-link svg,.scan-link svg,.nw-more svg,.nw-all svg,.ar-back svg{transition:transform .25s ease}
.hov-link:hover svg,.scan-link:hover svg,.nw-all:hover svg,.nw-card:hover .nw-more svg,.nw-feat:hover .nw-more svg{transform:translateX(4px)}
.ar-back:hover svg{transform:translateX(-4px)}
.faq summary:hover span:first-child{text-decoration:underline;text-decoration-color:#FFC32D;text-decoration-thickness:3px;text-underline-offset:6px}
footer a{transition:color .2s ease}
footer a:hover{color:#1A3F59 !important;text-decoration:underline !important;text-underline-offset:4px;text-decoration-thickness:1.5px}
@keyframes logo-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.logo-track{animation:logo-marquee 30s linear infinite}
.logo-strip:hover .logo-track{animation-play-state:paused}
@media (prefers-reduced-motion: reduce){.logo-track{animation:none}}
@media (prefers-reduced-motion: no-preference){
html[data-anim] [data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
html[data-anim] [data-reveal][data-in]{opacity:1;transform:none}
html[data-anim] [data-step]{opacity:0;transition:opacity .45s cubic-bezier(.22,.61,.36,1) calc(var(--base,0ms) + var(--t,0s))}
html[data-anim] [data-in] [data-step]{opacity:1}
html[data-anim] [data-step].st-node{transform:scale(.9);transform-box:fill-box;transform-origin:50% 50%;transition:opacity .45s cubic-bezier(.22,.61,.36,1) calc(var(--base,0ms) + var(--t,0s)),transform .55s cubic-bezier(.22,.61,.36,1) calc(var(--base,0ms) + var(--t,0s))}
html[data-anim] [data-in] [data-step].st-node{transform:none}
html[data-anim] [data-step] .st-draw{transition:stroke-dashoffset .3s cubic-bezier(.45,.05,.25,1) calc(var(--base,0ms) + var(--t,0s))}
html[data-anim] [data-in] [data-step] .st-draw{stroke-dashoffset:0 !important}
html[data-anim] [data-step] .st-head{opacity:0;transition:opacity .15s ease calc(var(--base,0ms) + var(--t,0s) + .25s)}
html[data-anim] [data-in] [data-step] .st-head{opacity:1}
html[data-anim] #top [data-reveal]{transform:translateY(40px);transition-duration:.9s}
html[data-anim] #top [data-reveal][data-in]{transform:none}
html[data-anim] .u-draw{background-size:0% 0.13em !important;transition:background-size .7s cubic-bezier(.6,0,.2,1) 1.2s}
html[data-anim] [data-in] .u-draw{background-size:100% 0.13em !important}
html[data-anim] .u-hero{background-size:0% 0.12em !important;transition:background-size .8s cubic-bezier(.34,1.4,.64,1) 1.1s}
html[data-anim] [data-in] .u-hero{background-size:100% 0.12em !important}
}
@media (max-width: 700px){.flow{grid-template-columns:1fr !important;gap:12px}.flow .flow-link{display:none}}
@media (min-width: 900px) and (min-height: 640px){html{scroll-snap-type:y mandatory}[data-snap]{scroll-snap-align:start;scroll-snap-stop:always}footer{scroll-snap-align:end}}
.pm{padding:28px 32px 30px;font-size:12px;color:#1A3F59;background:#FFFFFF}
.pm-top{display:flex;align-items:center;gap:10px}
.pm-t{font-size:15px;font-weight:900;margin-right:auto}
.pm-live{display:inline-flex;align-items:center;gap:6px;background:#E6F4EC;color:#1E7A4C;font-weight:700;border-radius:999px;padding:4px 10px}
.pm-live i{width:6px;height:6px;border-radius:50%;background:#2E8B57}
.pm-rng{border:1px solid #DDE3EA;border-radius:6px;padding:4px 10px;color:#4E5D70}
.pm-kpis{margin-top:22px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pm-kpi{border:1px solid #E8ECF0;border-radius:10px;padding:18px 20px 16px}
.pm-k{color:#4E5D70}
.pm-v{margin-top:8px;font-size:24px;font-weight:900;letter-spacing:-.01em;line-height:1.1}
.pm-v small{font-size:11px;font-weight:700;margin-left:4px}
.pm-d{display:inline-flex;align-items:center;gap:5px;margin-top:10px;background:#E6F4EC;color:#1E7A4C;font-size:11px;font-weight:700;line-height:1;border-radius:999px;padding:4px 9px 4px 7px}.pm-d svg{display:block;flex-shrink:0}
.pm-card{margin-top:16px;border:1px solid #E8ECF0;border-radius:10px;padding:20px 22px 12px}
.pm-chead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.pm-ct{font-size:13px;font-weight:900}
.pm-now{display:flex;gap:18px;text-align:right}
.pm-now span{display:block;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#5C6B7D}
.pm-now b{font-size:15px;font-weight:900}
.pm-leg{margin:8px 0 10px;display:flex;flex-wrap:wrap;gap:6px 14px;color:#4E5D70;font-size:11px}
.pm-leg span{display:inline-flex;align-items:center;gap:6px}
.pm-leg i{width:12px;height:2px;border-radius:1px;display:inline-block}
.pm-leg i.ds{height:0;border-top:2px dashed;background:none}
.pm-leg i.bd{width:12px;height:8px;background:#EEF5F0;border-radius:2px}
.pm-twin{margin-top:18px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;color:#4E5D70}
.pm-twin b{color:#1A3F59;font-size:13px}
.pm-acc{background:#E6F4EC;color:#1E7A4C;font-weight:700;border-radius:4px;padding:2px 6px}
@media (max-width:640px){.pm-kpis{grid-template-columns:1fr}}
@media (max-height:800px){.pm{padding:22px 28px 22px}.pm-kpis{margin-top:16px}.pm-kpi{padding:15px 18px 12px}.pm-kpi svg{margin-top:10px !important}.pm-card{padding:16px 20px 8px}.pm-leg{margin:6px 0 6px}.pm-twin{margin-top:14px}}
html{scroll-behavior:smooth}
/* Dutch and German phones: a headline phrase that is kept on one line may wrap when the translation is too long */
@media (max-width:760px){html:not([lang="en"]) :is(h1,h2,h3) span[style*="nowrap"]{white-space:normal !important}}
/* Header that follows on scroll (every page). It takes the colour of the section below it. */
html[data-sticky-nav] header.hdr-fixed{position:fixed;top:0;left:0;right:0;z-index:100;background:#FFFFFF;font-family:Lato,'Helvetica Neue',sans-serif;color:#1A3F59;transition:background-color .3s ease,border-color .3s ease;animation:hdr-in .3s ease}
@keyframes hdr-in{from{transform:translateY(-100%)}to{transform:none}}
html[data-sticky-nav] header.hdr-fixed .hdr-in{padding-top:10px !important;padding-bottom:10px !important}
html[data-sticky-nav] header.hdr-fixed .hdr-in>a:first-child img{height:13px !important;transition:filter .3s ease}
html[data-sticky-nav] header.hdr-fixed nav[data-nav="main"] a::after{bottom:-6px}
html[data-sticky-nav] header.hdr-fixed{border-bottom-color:transparent !important}
html[data-sticky-nav] header.hdr-dark .hdr-in>a:first-child img{filter:brightness(0) invert(1)}
html[data-sticky-nav] header.hdr-dark .hdr-in>a,html[data-sticky-nav] header.hdr-dark nav[data-nav="main"]>a,html[data-sticky-nav] header.hdr-dark .nav-dd>a,html[data-sticky-nav] header.hdr-dark .hdr-right a,html[data-sticky-nav] header.hdr-dark .hdr-right strong{color:#FFFFFF !important}
html[data-sticky-nav] header.hdr-dark [data-lang-switch],html[data-sticky-nav] header.hdr-dark [data-lang-switch] a{color:#C4D0DC !important}
html[data-sticky-nav] header.hdr-dark .m-menu-btn span{background:#FFFFFF}
html[data-sticky-nav] header.hdr-fixed.m-open{max-height:100vh;overflow-y:auto}
@media (prefers-reduced-motion: reduce){html[data-sticky-nav] header.hdr-fixed{animation:none;transition:none}}
/* Dutch and German phones: the longer "Get in touch" translation needs a slightly smaller logo to keep the header on one line */
@media (max-width:420px){html:not([lang="en"]) header:not(.hdr-fixed) .hdr-in>a:first-child img{height:18px !important}}
@media (max-width:370px){html[lang="de"] header:not(.hdr-fixed) .hdr-in>a:first-child img{height:15px !important}}
/* titles inside linked cards stay navy, also after a visit */
a.nw-card,a.nw-feat,a.ar-card,a.nw-ev,a.nw-card:visited,a.nw-feat:visited,a.ar-card:visited,a.nw-ev:visited{color:#1A3F59}
.nw-t,.nw-ft,.ar-ct,.nw-et{color:#1A3F59}
a.nw-card:hover,a.nw-feat:hover,a.ar-card:hover,a.nw-ev:hover{color:#1A3F59}
/* While the header follows, it is slimmer: no language switch or Log in (both stay in the full header at the top) */
html[data-sticky-nav] header.hdr-fixed [data-lang-switch],html[data-sticky-nav] header.hdr-fixed .hdr-right>a.hl{display:none !important}
/* Homepage key figures: calmer size */
[style*="font-size: clamp(52px, 5.6vw, 88px)"]{font-size:clamp(42px,4.2vw,64px) !important}

/* Forms: hidden spam trap and the "did not go through" message */
.hp-field{position:absolute !important;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.form-err{flex-basis:100%;margin:12px 0 0;font-size:14px;line-height:1.5;color:#B3261E}
button.btn[disabled]{opacity:.6;cursor:progress}

/* Hand-drawn heading underline: a double pen stroke behind the words (data-ul="scribble" on <html>, set in base.njk).
   The static version below is used when a phrase wraps onto two lines; site.js adds the animated pen line otherwise. */
html[data-ul] .u-draw{background-repeat:no-repeat !important;background-position:left -0.05em bottom 0 !important;background-size:calc(100% + 0.1em) 0.42em !important;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-bottom:0.1em}
html[data-ul="scribble"] .u-draw{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 20' preserveAspectRatio='none'%3E%3Cpath fill='none' stroke='%23FFC32D' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round' d='M3 11.8C60 9 130 8.4 196 9.8C150 12.4 75 14.6 16 18.2'/%3E%3C/svg%3E") !important}
html[data-anim][data-ul] .u-draw{background-size:0% 0.42em !important;transition:background-size .7s cubic-bezier(.6,0,.2,1) 1.1s}
html[data-anim][data-ul] [data-in] .u-draw{background-size:calc(100% + 0.1em) 0.42em !important}
/* Double stroke drawn like a pen: an inline line (added by site.js) that draws out and back.
   Headings that wrap onto two lines keep the static version above. */
.ul-pen{display:none}
html[data-ul="scribble"] .u-draw.ul-on:not(.ul-wrap){position:relative;z-index:0;background-image:none !important}
html[data-ul="scribble"] .u-draw.ul-on:not(.ul-wrap) .ul-pen{display:block;position:absolute;left:-0.05em;bottom:-0.05em;width:calc(100% + 0.1em);height:0.42em;overflow:visible;pointer-events:none;z-index:-1}
.ul-pen path{fill:none;stroke:#FFC32D;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
html[data-anim] .ul-pen path{stroke-dashoffset:1;transition:stroke-dashoffset .3s cubic-bezier(.4,0,.4,1) .6s}
html[data-anim] [data-in] .ul-pen path{stroke-dashoffset:0}
html[data-ul="scribble"] .u-draw.ul-on.ul-wrap{background-image:none !important}
html[data-ul="scribble"] .ul-line{display:block;position:absolute;z-index:-1;overflow:visible;pointer-events:none}
/* Underlined numbers that count up: the stroke waits until the number has finished counting */
html[data-anim] .u-draw[data-count]:not([data-counted="done"]) .ul-pen path,html[data-anim] .u-draw:has([data-count]:not([data-counted="done"])) .ul-pen path{stroke-dashoffset:1 !important}
html[data-anim] .u-draw[data-count] .ul-pen path,html[data-anim] .u-draw:has([data-count]) .ul-pen path{transition-delay:0s}
html[data-anim][data-ul] .u-draw[data-count]:not([data-counted="done"]),html[data-anim][data-ul] .u-draw:has([data-count]:not([data-counted="done"])){background-size:0% 0.42em !important}
/* Home on phones: the Optimize Pro section keeps its explanation, without the dashboard prototype */
@media (max-width:760px){#optimize-pro #demo-embed{display:none !important}#optimize-pro[data-snap]{min-height:0 !important}}

/* Cookie consent banner */
.int-cookie-banner {
  position: fixed;
  bottom: 24px;
  right: 24px;
  max-width: 420px;
  background: #FFFFFF;
  border: 1px solid #E8ECF0;
  border-top: 3px solid #FFC32D;
  border-radius: 12px;
  box-shadow: 0 10px 32px rgba(26, 63, 89, 0.14);
  padding: 20px 24px;
  z-index: 99999;
  font-family: Lato, "Helvetica Neue", Arial, sans-serif;
  color: #1A3F59;
  box-sizing: border-box;
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .25s ease, transform .25s ease;
  pointer-events: none;
}
.int-cookie-banner.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.int-cookie-banner h3 {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 800;
  color: #1A3F59;
  line-height: 1.3;
}
.int-cookie-banner p {
  margin: 0 0 16px;
  font-size: 14px;
  line-height: 1.5;
  color: #5C6B7D;
}
.int-cookie-banner a.c-link {
  color: #1A3F59;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.int-cookie-banner .int-cookie-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  align-items: center;
}
.int-cookie-banner button {
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  border-radius: 6px;
  padding: 8px 18px;
  cursor: pointer;
  transition: all .2s ease;
}
.int-cookie-banner .btn-cookie-decline {
  background: transparent;
  border: 1px solid #C4D0DC;
  color: #5C6B7D;
}
.int-cookie-banner .btn-cookie-decline:hover {
  border-color: #1A3F59;
  color: #1A3F59;
}
.int-cookie-banner .btn-cookie-accept {
  background: #1A3F59;
  border: 1px solid #1A3F59;
  color: #FFFFFF;
}
.int-cookie-banner .btn-cookie-accept:hover {
  background: #163449;
  border-color: #163449;
}
@media (max-width: 600px) {
  .int-cookie-banner {
    left: 16px;
    right: 16px;
    bottom: 16px;
    max-width: none;
  }
}
/* Cookie banner on phones: full width with the usual side margins */
@media (max-width:760px){.int-cookie-banner{left:16px;right:16px;bottom:16px;max-width:none}}
/* Cookie banner: Accept and Decline look the same, so neither choice is pushed */
.int-cookie-banner .btn-cookie-decline,.int-cookie-banner .btn-cookie-accept{background:#FFFFFF;border:1px solid #1A3F59;color:#1A3F59;min-width:110px}
.int-cookie-banner .btn-cookie-decline:hover,.int-cookie-banner .btn-cookie-accept:hover,.int-cookie-banner .btn-cookie-decline:focus-visible,.int-cookie-banner .btn-cookie-accept:focus-visible{background:#1A3F59;border-color:#1A3F59;color:#FFFFFF}
@media (max-width:760px){.int-cookie-banner .int-cookie-actions button{flex:1}}
/* "Cookie settings" in the footer: a button styled like the legal links next to it */
.cookie-settings-link{font:inherit;color:#5C6B7D;background:none;border:0;padding:0;margin:0;cursor:pointer;text-align:left}
.cookie-settings-link:hover{color:#1A3F59}
/* footer: six columns in one row on desktop, three per row on tablets */
@media (min-width: 700px) and (max-width: 1099px){footer>div:first-child{grid-template-columns:repeat(3,minmax(0,1fr)) !important}}
@media (min-width: 1100px){footer>div:first-child{grid-template-columns:1.3fr repeat(5,minmax(0,1fr)) !important;gap:32px !important}}

/* Home hero: product figures in a small card, top right of the hero (in the flow under the buttons on smaller screens) */
.hero-stats{margin-top:36px;display:inline-block;background:#FFFFFF;border:1px solid #E8ECF0;border-radius:12px;box-shadow:0 18px 48px rgba(26,63,89,.10);padding:22px 26px;color:#1A3F59}
.hero-stats .hs-label{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#5C6B7D}
.hero-stats .hs-label i{width:7px;height:7px;border-radius:50%;background:#FFC32D;flex-shrink:0}
.hero-stats .hs-row{margin-top:16px;display:grid;grid-template-columns:repeat(3,auto);gap:28px}
.hero-stats b{display:block;font-size:28px;line-height:1;font-weight:900;letter-spacing:-.02em}
.hero-stats span{display:block;margin-top:6px;font-size:13px;color:#4E5D70}
@media (min-width:1100px){.hero-stats{position:absolute;right:32px;top:24px;margin:0}}
@media (max-width:420px){.hero-stats{padding:18px 20px}.hero-stats .hs-row{gap:18px}.hero-stats b{font-size:24px}}
/* Client logos: they fade in where they belong, without sliding up from below the strip */
html[data-anim] .logo-strip .logo-box[data-reveal]{transform:none !important}

/* header logo: mark + wordmark; mark only on phones */
header .hdr-logo{gap:12px;color:#1A3F59}
header .hdr-mark{display:block;flex:none;width:26px;height:26px}
html[data-sticky-nav] header.hdr-dark .hdr-mark{color:#FFFFFF}
@media (max-width:600px){header .hdr-in>a.hdr-logo img.hdr-word{display:none !important}header .hdr-mark{width:30px;height:30px}}

/* Short windows (a laptop with the browser's bars): sections that snap one per screen get tighter padding,
   headings and cards, so they fit in one screen instead of a few lines too tall (which gave two stops). */
@media (min-width:900px) and (min-height:640px) and (max-height:880px){
  section[data-snap][style*="padding: 72px 32px"],section[data-snap][style*="padding: 64px 32px"],section[data-snap][style*="padding: 52px 32px"]{padding-top:36px !important;padding-bottom:36px !important}
  section[data-snap] [style*="margin-top: 48px"]{margin-top:26px !important}
  section[data-snap] [style*="margin-top: 72px"]{margin-top:40px !important}
  section[data-snap] h2[style*="clamp(32px, 3.4vw, 44px)"]{font-size:clamp(28px,2.6vw,36px) !important}
  section[data-snap] [style*="height: clamp(170px, 30vh, 290px)"]{height:clamp(140px,22vh,230px) !important}
  section[data-snap] [style*="padding: 40px"]{padding:26px 30px !important}
  section[data-snap] [style*="padding: 36px"]{padding:24px 28px !important}
  section[data-snap] [style*="padding: 28px"]{padding:20px 24px !important}
  section[data-snap] [style*="margin-top: 40px"]{margin-top:24px !important}
  section[data-snap] [style*="padding: 16px 0"]{padding:10px 0 !important}
  /* the Link page: the two set-up cards and the "mix both" band */
  #link-setups .setup-card{padding:18px 24px 16px}
  #link-setups .bd-wrap{padding:8px 12px 0;margin:2px 0 0}
  #link-setups .bd{max-height:34vh;width:auto;margin:0 auto}
  #link-setups .mix-band{padding:14px 24px;margin-top:14px !important}
  #link-setups [style*="margin-top: 32px"]{margin-top:22px !important}
  /* Partners: the opening screen */
  #p-home [style*="padding: 40px 32px 64px"]{padding:24px 32px 36px !important}
  #p-home [style*="margin-top: 56px"]{margin-top:32px !important}
}