/* One-page experience: sticky header, calm reveals, one clear next step */
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{padding-bottom:0}

/* Sticky header with a quiet progress line (goal-gradient) */
.site-head{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);-webkit-backdrop-filter:saturate(1.3) blur(8px);backdrop-filter:saturate(1.3) blur(8px);border-bottom:1px solid var(--line)}
.site-head .bar{border-bottom:0;min-height:72px}
.progress{position:absolute;left:0;bottom:-1px;width:100%;height:2px;background:var(--navy);transform:scaleX(0);transform-origin:0 50%}
nav a[aria-current="true"]:not(.nav-contact):not(.lang){text-decoration:underline;text-underline-offset:.5em;text-decoration-thickness:2px;text-decoration-color:#2e5b8e}
.nav-contact[aria-current="true"]{background:var(--cloud)}

/* Intro: one primary action */
.hero{padding-block:48px 56px}
.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px 26px}
.button.big{padding:16px 22px;font-size:17px;gap:18px}
.button.big span{transition:transform .2s}
.button.big:hover span{transform:translateY(3px)}
.hero-note{margin-top:16px;font-size:14px;color:var(--muted)}
.hero .textlink{font-weight:700}

/* Section rhythm */
.sec-head{padding-top:84px}
.sec-head h2{margin-bottom:14px}
.sec-head .sub{font-size:19px;line-height:1.5;color:var(--muted);max-width:620px}
.sub.small{font-size:16px;margin-top:12px;color:var(--muted)}
.products{padding-bottom:0}
.products .duo{border-top:0;padding-top:36px}
.about{padding-bottom:0}
.about .pmv{padding-block:40px 64px}
.principles-wrap{padding:64px 0 72px}
.h2like{font-size:clamp(34px,4.4vw,56px);letter-spacing:-.05em;line-height:1;margin:0 0 4px}

/* Principles: progressive disclosure */
.pr-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 20px;margin-top:28px;align-items:start}
.pr{background:#fff;border:1px solid var(--line);border-radius:8px;transition:border-color .2s,box-shadow .2s}
.pr:hover{border-color:#9db3cc}
.pr[open]{border-color:var(--navy);box-shadow:0 10px 24px -18px rgba(0,31,75,.5)}
.pr summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:18px 20px;font-weight:750;font-size:19px;letter-spacing:-.02em;line-height:1.2}
.pr summary::-webkit-details-marker{display:none}
.pr summary:focus-visible{outline:3px solid #2e5b8e;outline-offset:2px;border-radius:8px}
.pr summary span{flex:none;width:34px;height:34px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:15px}
.pr summary:after{content:"+";margin-left:auto;font-size:24px;font-weight:400;color:#2e5b8e;transition:transform .2s}
.pr[open] summary:after{transform:rotate(45deg)}
.pr p{margin:0;padding:0 20px 20px 68px;font-size:16px;line-height:1.55;color:var(--muted)}
.about .approach{padding-top:84px}
.about .inspiration{padding-top:8px}

/* Contact: one decision */
.contact-inner{align-items:center}
.contact-act{flex-shrink:0;max-width:300px}
.contact-act .micro{margin-top:12px;font-size:14px;line-height:1.45;color:#c9d6e5}
.contact-inner .button{white-space:nowrap}

/* Calm reveal: only when JS runs and motion is welcome */
.js .rv{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.js .rv.in{opacity:1;transform:none}

/* Mobile dock: the next step, never in the way of a game */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:25;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(to top,#fff 70%,rgba(255,255,255,0));transform:translateY(120%);transition:transform .3s ease;pointer-events:none;display:none}
.dock .button{width:100%;justify-content:space-between;box-shadow:0 10px 24px -12px rgba(0,31,75,.6)}
.dock.on{transform:none}
.dock.on .button{pointer-events:auto}
@media(max-width:720px){.dock{display:block}}

@media(max-width:900px){
  .pr-grid{grid-template-columns:1fr}
  .contact-act{max-width:none}
}
@media(max-width:620px){
  html{scroll-padding-top:70px}
  .site-head .bar{min-height:62px}
  .sec-head{padding-top:56px}
  .hero{padding-block:36px 36px}
  .button.big{width:100%;justify-content:space-between}
  .about .pmv{padding-block:28px 40px}
  .principles-wrap{padding:44px 0 48px}
  .about .approach{padding-top:56px}
  .pr summary{font-size:17px;padding:16px}
  .pr p{padding:0 16px 18px 16px}
  .contact-inner .button{white-space:normal}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .rv{opacity:1;transform:none;transition:none}
  .dock,.pr,.pr summary:after,.button.big span{transition:none}
}

.duo .duo-text>p:not(.eyebrow):not(.status){margin-bottom:20px}

/* Shared grid: label, title, text, status, button and phone line up across both products */
@media(min-width:901px){
  .duo{grid-template-rows:repeat(6,auto);column-gap:64px;row-gap:0}
  .duo-col,.duo-text{display:contents}
  #waka-quest>*,#waka-quest .duo-text>*{grid-column:1}
  #verkeersmeester>*,#verkeersmeester .duo-text>*{grid-column:2}
  .duo-text>.eyebrow{grid-row:1}
  .duo-text>h2{grid-row:2}
  .duo-text>p:not(.eyebrow):not(.status){grid-row:3}
  .duo-text>.status{grid-row:4;align-items:center}
  .duo-text>.status i{margin-top:0}
  .duo-text>.button{grid-row:5;align-self:start;justify-self:start}
  .duo-col>.phone-col{grid-row:6;margin-top:36px}
}

/* One shared two-column grid: every second column starts at the same place */
:root{--gap:clamp(28px,4.7vw,64px)}
@media(min-width:621px){
  .hero{grid-template-columns:1fr 1fr;column-gap:var(--gap);gap:0 var(--gap)}
}
@media(min-width:901px){
  .duo{column-gap:var(--gap)}
  .approach,.inspiration{grid-template-columns:1fr 1fr;column-gap:var(--gap);gap:0 var(--gap)}
  .legal{border-left:0;padding-left:0}
  .pr-grid{column-gap:var(--gap)}
  .contact-inner{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gap);align-items:center}
  .contact-inner>div:first-child p:not(.eyebrow){max-width:520px}
  .contact-act{max-width:none}
  .contact-act .micro{max-width:420px}
}
@media(max-width:900px){.contact-inner{display:grid;grid-template-columns:1fr;gap:22px}.contact-act{max-width:none}}

/* Footer: three even columns, middle one truly centred */
.footer{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;align-items:center}
.footer span:nth-child(2){text-align:center}
.footer span:nth-child(3){text-align:right}
@media(max-width:620px){.footer{grid-template-columns:1fr;gap:6px}.footer span:nth-child(2),.footer span:nth-child(3){text-align:left}}

/* Contact action: button and its note share the same left and right edges */
.contact .contact-act{width:100%;max-width:400px;display:grid;gap:14px;justify-items:stretch}
.contact .contact-act .button{display:flex;width:100%;justify-content:space-between;margin:0;box-sizing:border-box}
.contact .contact-act .micro{margin:0;max-width:none;font-size:15px;line-height:1.5;color:#c9d6e5}

/* Logo: a drop falls, three ripples follow, then everything rests (Origin -> Expansion -> Impact) */
.mark svg{width:82%;height:auto;display:block;overflow:hidden}
.logo-anim .l-dot,.logo-anim .l-arc,.logo-anim .l-word path{fill:var(--navy)}
.logo-anim .l-arc{transform-box:view-box;transform-origin:var(--cx) var(--cy)}
.js .logo-anim:not(.play):not(.still){visibility:hidden}
.logo-anim.play .l-dot{animation:l-fall .8s cubic-bezier(.55,0,.85,.45) both}
.logo-anim.play .l-a1{animation:l-rip 1.05s cubic-bezier(.16,.7,.2,1) .8s both}
.logo-anim.play .l-a2{animation:l-rip 1.05s cubic-bezier(.16,.7,.2,1) 1.04s both}
.logo-anim.play .l-a3{animation:l-rip 1.05s cubic-bezier(.16,.7,.2,1) 1.28s both}
.logo-anim.play .l-word{animation:l-rise .9s ease 1.95s both}
@keyframes l-fall{0%{opacity:0;transform:translateY(calc(-1 * var(--drop)))}6%{opacity:1}100%{opacity:1;transform:none}}
@keyframes l-rip{0%{opacity:0;transform:scale(.6)}100%{opacity:1;transform:none}}
@keyframes l-rise{0%{opacity:0;transform:translateY(14px)}100%{opacity:1;transform:none}}
#logo-mark{cursor:pointer}
@media(prefers-reduced-motion:reduce){.logo-anim.play *{animation:none!important}}

/* Contact: one clear email action */

/* Ripple marks. A: steps of The Legacy Ripple, N rings = step N. C: six principles, numeral inside two rings. Both animate once on reveal. */
.steps li:before{content:'';display:block;width:56px;height:56px;margin:-10px 0 8px -4px;font-size:0;background-repeat:no-repeat;background-position:center;background-size:56px 56px}
.steps li:nth-child(1):before{background-image:radial-gradient(circle closest-side,#001F4B 0 15.0%,transparent 16.4%),radial-gradient(circle closest-side,transparent 26.4%,#001F4B 26.4%,#001F4B 32.5%,transparent 32.5%)}
.steps li:nth-child(2):before{background-image:radial-gradient(circle closest-side,#001F4B 0 15.0%,transparent 16.4%),radial-gradient(circle closest-side,transparent 26.4%,#001F4B 26.4%,#001F4B 32.5%,transparent 32.5%),radial-gradient(circle closest-side,transparent 40.0%,#2e5b8e 40.0%,#2e5b8e 46.1%,transparent 46.1%)}
.steps li:nth-child(3):before{background-image:radial-gradient(circle closest-side,#001F4B 0 15.0%,transparent 16.4%),radial-gradient(circle closest-side,transparent 26.4%,#001F4B 26.4%,#001F4B 32.5%,transparent 32.5%),radial-gradient(circle closest-side,transparent 40.0%,#2e5b8e 40.0%,#2e5b8e 46.1%,transparent 46.1%),radial-gradient(circle closest-side,transparent 53.6%,#5c85b3 53.6%,#5c85b3 59.6%,transparent 59.6%)}
.steps li:nth-child(4):before{background-image:radial-gradient(circle closest-side,#001F4B 0 15.0%,transparent 16.4%),radial-gradient(circle closest-side,transparent 26.4%,#001F4B 26.4%,#001F4B 32.5%,transparent 32.5%),radial-gradient(circle closest-side,transparent 40.0%,#2e5b8e 40.0%,#2e5b8e 46.1%,transparent 46.1%),radial-gradient(circle closest-side,transparent 53.6%,#5c85b3 53.6%,#5c85b3 59.6%,transparent 59.6%),radial-gradient(circle closest-side,transparent 67.1%,#8fb0d3 67.1%,#8fb0d3 73.2%,transparent 73.2%)}
.steps li:nth-child(5):before{background-image:radial-gradient(circle closest-side,#001F4B 0 15.0%,transparent 16.4%),radial-gradient(circle closest-side,transparent 26.4%,#001F4B 26.4%,#001F4B 32.5%,transparent 32.5%),radial-gradient(circle closest-side,transparent 40.0%,#2e5b8e 40.0%,#2e5b8e 46.1%,transparent 46.1%),radial-gradient(circle closest-side,transparent 53.6%,#5c85b3 53.6%,#5c85b3 59.6%,transparent 59.6%),radial-gradient(circle closest-side,transparent 67.1%,#8fb0d3 67.1%,#8fb0d3 73.2%,transparent 73.2%),radial-gradient(circle closest-side,transparent 80.7%,#a9c2de 80.7%,#a9c2de 86.8%,transparent 86.8%)}
@keyframes rip-1{0%{background-size:0.0px 0.0px,0.0px 0.0px}14%{background-size:26.1px 26.1px,0.0px 0.0px}30%{background-size:56.0px 56.0px,29.9px 29.9px}44%{background-size:56.0px 56.0px,56.0px 56.0px}100%{background-size:56.0px 56.0px,56.0px 56.0px}}
@keyframes rip-2{0%{background-size:0.0px 0.0px,0.0px 0.0px,0.0px 0.0px}14%{background-size:26.1px 26.1px,0.0px 0.0px,0.0px 0.0px}28%{background-size:52.3px 52.3px,26.1px 26.1px,0.0px 0.0px}30%{background-size:56.0px 56.0px,29.9px 29.9px,3.7px 3.7px}44%{background-size:56.0px 56.0px,56.0px 56.0px,29.9px 29.9px}58%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px}100%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px}}
@keyframes rip-3{0%{background-size:0.0px 0.0px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px}14%{background-size:26.1px 26.1px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px}28%{background-size:52.3px 52.3px,26.1px 26.1px,0.0px 0.0px,0.0px 0.0px}30%{background-size:56.0px 56.0px,29.9px 29.9px,3.7px 3.7px,0.0px 0.0px}42%{background-size:56.0px 56.0px,52.3px 52.3px,26.1px 26.1px,0.0px 0.0px}44%{background-size:56.0px 56.0px,56.0px 56.0px,29.9px 29.9px,3.7px 3.7px}58%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,29.9px 29.9px}72%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,56.0px 56.0px}100%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,56.0px 56.0px}}
@keyframes rip-4{0%{background-size:0.0px 0.0px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px}14%{background-size:26.1px 26.1px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px}28%{background-size:52.3px 52.3px,26.1px 26.1px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px}30%{background-size:56.0px 56.0px,29.9px 29.9px,3.7px 3.7px,0.0px 0.0px,0.0px 0.0px}42%{background-size:56.0px 56.0px,52.3px 52.3px,26.1px 26.1px,0.0px 0.0px,0.0px 0.0px}44%{background-size:56.0px 56.0px,56.0px 56.0px,29.9px 29.9px,3.7px 3.7px,0.0px 0.0px}56%{background-size:56.0px 56.0px,56.0px 56.0px,52.3px 52.3px,26.1px 26.1px,0.0px 0.0px}58%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,29.9px 29.9px,3.7px 3.7px}72%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,29.9px 29.9px}86%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,56.0px 56.0px}100%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,56.0px 56.0px}}
@keyframes rip-5{0%{background-size:0.0px 0.0px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px}14%{background-size:26.1px 26.1px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px}28%{background-size:52.3px 52.3px,26.1px 26.1px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px}30%{background-size:56.0px 56.0px,29.9px 29.9px,3.7px 3.7px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px}42%{background-size:56.0px 56.0px,52.3px 52.3px,26.1px 26.1px,0.0px 0.0px,0.0px 0.0px,0.0px 0.0px}44%{background-size:56.0px 56.0px,56.0px 56.0px,29.9px 29.9px,3.7px 3.7px,0.0px 0.0px,0.0px 0.0px}56%{background-size:56.0px 56.0px,56.0px 56.0px,52.3px 52.3px,26.1px 26.1px,0.0px 0.0px,0.0px 0.0px}58%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,29.9px 29.9px,3.7px 3.7px,0.0px 0.0px}70%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,52.3px 52.3px,26.1px 26.1px,0.0px 0.0px}72%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,29.9px 29.9px,3.7px 3.7px}86%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,29.9px 29.9px}100%{background-size:56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,56.0px 56.0px,56.0px 56.0px}}
.js .ripple.in .steps li:nth-child(1):before{animation:rip-1 1.4s cubic-bezier(.2,.7,.3,1) 0.35s both}
.js .ripple.in .steps li:nth-child(2):before{animation:rip-2 1.4s cubic-bezier(.2,.7,.3,1) 0.57s both}
.js .ripple.in .steps li:nth-child(3):before{animation:rip-3 1.4s cubic-bezier(.2,.7,.3,1) 0.79s both}
.js .ripple.in .steps li:nth-child(4):before{animation:rip-4 1.4s cubic-bezier(.2,.7,.3,1) 1.01s both}
.js .ripple.in .steps li:nth-child(5):before{animation:rip-5 1.4s cubic-bezier(.2,.7,.3,1) 1.23s both}
.pr summary span{width:32px;height:32px;margin:0 6px 0 8px;font-size:15px;box-shadow:0 0 0 3px #fff,0 0 0 4.5px #8fb0d3,0 0 0 8px #fff,0 0 0 9.5px #c4d5e8,0 0 0 9.5px #2e5b8e00}
@keyframes pr-in{0%{box-shadow:0 0 0 0 #fff,0 0 0 0 #8fb0d3,0 0 0 0 #fff,0 0 0 0 #c4d5e8,0 0 0 0 #2e5b8e00}45%{box-shadow:0 0 0 3px #fff,0 0 0 4.5px #8fb0d3,0 0 0 4.5px #fff,0 0 0 4.5px #c4d5e8,0 0 0 4.5px #2e5b8e00}100%{box-shadow:0 0 0 3px #fff,0 0 0 4.5px #8fb0d3,0 0 0 8px #fff,0 0 0 9.5px #c4d5e8,0 0 0 9.5px #2e5b8e00}}
@keyframes pr-pulse{0%{box-shadow:0 0 0 3px #fff,0 0 0 4.5px #8fb0d3,0 0 0 8px #fff,0 0 0 9.5px #c4d5e8,0 0 0 9.5px #2e5b8e66}100%{box-shadow:0 0 0 3px #fff,0 0 0 4.5px #8fb0d3,0 0 0 8px #fff,0 0 0 9.5px #c4d5e8,0 0 0 21px #2e5b8e00}}
.js #principles:not(.rm-done) .rv.in .pr:nth-child(1) summary span{animation:pr-in 1.1s cubic-bezier(.2,.7,.3,1) 0.25s both}
.js #principles:not(.rm-done) .rv.in .pr:nth-child(2) summary span{animation:pr-in 1.1s cubic-bezier(.2,.7,.3,1) 0.35s both}
.js #principles:not(.rm-done) .rv.in .pr:nth-child(3) summary span{animation:pr-in 1.1s cubic-bezier(.2,.7,.3,1) 0.45s both}
.js #principles:not(.rm-done) .rv.in .pr:nth-child(4) summary span{animation:pr-in 1.1s cubic-bezier(.2,.7,.3,1) 0.55s both}
.js #principles:not(.rm-done) .rv.in .pr:nth-child(5) summary span{animation:pr-in 1.1s cubic-bezier(.2,.7,.3,1) 0.65s both}
.js #principles:not(.rm-done) .rv.in .pr:nth-child(6) summary span{animation:pr-in 1.1s cubic-bezier(.2,.7,.3,1) 0.75s both}
.js #principles .rv.in .pr[open] summary span{animation:pr-pulse .8s ease-out both}
.pr p{padding-left:80px}
@media(max-width:620px){.steps li:before{margin-left:-4px}.pr p{padding-left:16px}}
@keyframes pr-breathe{0%{box-shadow:0 0 0 3px #fff,0 0 0 4.5px #8fb0d3,0 0 0 8px #fff,0 0 0 9.5px #c4d5e8,0 0 0 9.5px #2e5b8e55}55%,100%{box-shadow:0 0 0 3px #fff,0 0 0 4.5px #8fb0d3,0 0 0 8px #fff,0 0 0 9.5px #c4d5e8,0 0 0 22px #2e5b8e00}}
.js #principles.rm-done .rv.in .pr:nth-child(1):not([open]) summary span{animation:pr-breathe 4.8s ease-out 0.0s infinite}
.js #principles.rm-done .rv.in .pr:nth-child(2):not([open]) summary span{animation:pr-breathe 4.8s ease-out 0.6s infinite}
.js #principles.rm-done .rv.in .pr:nth-child(3):not([open]) summary span{animation:pr-breathe 4.8s ease-out 1.2s infinite}
.js #principles.rm-done .rv.in .pr:nth-child(4):not([open]) summary span{animation:pr-breathe 4.8s ease-out 1.8s infinite}
.js #principles.rm-done .rv.in .pr:nth-child(5):not([open]) summary span{animation:pr-breathe 4.8s ease-out 2.4s infinite}
.js #principles.rm-done .rv.in .pr:nth-child(6):not([open]) summary span{animation:pr-breathe 4.8s ease-out 3.0s infinite}
@media(prefers-reduced-motion:reduce){.js .ripple.in .steps li:before,.js #principles .rv.in .pr summary span,.js #principles .rv.in .pr[open] summary span{animation:none!important}}

/* Brand v3: LEGACY TECHNOLOGY wordmark in the header, symbol only on small screens */
.brand img{height:14px;width:auto;display:block}
@media(max-width:620px){.brand img{height:32px}}

/* Touch targets: at least 44px high on small screens, without changing how things look */
@media(max-width:900px){
  .site-head nav a:not(.nav-contact):not(.lang),.hero .textlink,.footer a{display:inline-flex;align-items:center;min-height:44px}
  .nav-contact,.lang,.brand,.duo-note a,.contact-inner p a{position:relative}
  .nav-contact::after,.lang::after,.brand::after,.duo-note a::after,.contact-inner p a::after{content:"";position:absolute;inset:-14px -6px}
  .brand::after{inset:-6px -8px}
}
/* Hero: a smaller logo card on phones, so the games come into view sooner */
@media(max-width:620px){
  .hero .mark{aspect-ratio:auto;padding:26px 0}
  .mark svg{width:64%}
}

/* "Keep me posted": a small mail-to button inside the status line (no form, no tracking) */
.status .notify{display:flex;width:fit-content;align-items:center;gap:10px;margin-top:10px;min-height:40px;padding:8px 14px;border:1.5px solid var(--navy);border-radius:4px;background:#fff;color:var(--navy);font-size:14.5px;font-weight:700;line-height:1.2;text-decoration:none;transition:background .2s,color .2s}
.status .notify:hover{background:var(--navy);color:#fff}
.status>span{display:block}
.status:has(.notify),.duo-text>.status:has(.notify){align-items:flex-start}
.status:has(.notify) i,.duo-text>.status:has(.notify) i{margin-top:7px}
@media(max-width:900px){.status .notify{min-height:44px}}
@media(prefers-reduced-motion:reduce){.status .notify{transition:none}}

/* About: what we do + what we believe */
.about .beliefs{display:grid;grid-template-columns:1fr;gap:34px;padding-block:44px 56px;border-top:1px solid var(--line)}
.about .beliefs .what{font-size:19px;line-height:1.55;color:var(--muted);max-width:560px}
.about .beliefs .belief{font-size:clamp(28px,3.4vw,44px);font-weight:750;letter-spacing:-.035em;line-height:1.12;color:var(--navy);max-width:560px}
.about .beliefs .belief span{color:#2e5b8e}
@media(min-width:901px){.about .beliefs{grid-template-columns:1fr 1fr;column-gap:var(--gap);align-items:start}}
@media(max-width:620px){.about .beliefs{padding-block:32px 40px;gap:26px}.about .beliefs .what{font-size:17px}}