/* Lumenta v3: editorial, airy. Full-bleed photo bands with navy veils; elegant serif headings at regular weight; hairlines instead of boxes. Single light theme by design. */
:root{
  color-scheme:light;
  --paper:#FFFFFF; --paper-2:#F4F7F7; --ink:#132E40; --ink-2:#4A6070; --ink-3:#7C8E99; --hair:#DCE4E7;
  --teal:#3D8D88; --teal-lt:#8FD0C9; --sand:#D9BC8C; --night:#0D2130;
  --f-serif:"Instrument Serif", "Iowan Old Style", Georgia, serif;
  --f-sans:"Manrope", "Segoe UI", system-ui, sans-serif;
  --max:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:var(--paper); color:var(--ink); font-family:var(--f-sans); font-weight:400; font-size:16.5px; line-height:1.7; -webkit-font-smoothing:antialiased}
body::before{content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top,0px); z-index:60; background:var(--paper)}
img{max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--f-serif); font-weight:400; line-height:1.05; margin:0; letter-spacing:-0.01em; text-wrap:balance}
h1 em,h2 em{font-style:italic; color:var(--teal)}
h3{font-family:var(--f-sans); font-weight:600; font-size:17px; letter-spacing:0; line-height:1.3}
p{margin:0}
.wrap{max-width:var(--max); margin:0 auto; padding-left:max(20px, env(safe-area-inset-left,0px)); padding-right:max(20px, env(safe-area-inset-right,0px))}
@media (min-width:760px){.wrap{padding-left:max(40px, env(safe-area-inset-left,0px)); padding-right:max(40px, env(safe-area-inset-right,0px))}}
.label{font-size:12px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--teal); display:flex; align-items:center; gap:12px}
.label::before{content:""; width:28px; height:1px; background:currentColor}
.label.nodash::before{display:none}
.num{font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--teal); outline-offset:3px}
section{padding-block:120px}
@media (max-width:760px){section{padding-block:76px}}
.lead{font-size:18.5px; color:var(--ink-2); font-weight:300; max-width:56ch}

/* buttons */
.btn{display:inline-flex; align-items:center; gap:12px; font-family:var(--f-sans); font-weight:500; font-size:15px; letter-spacing:.02em; padding:15px 26px; text-decoration:none; border:1px solid transparent; transition:background .25s ease, color .25s ease, border-color .25s ease; cursor:pointer; border-radius:2px}
.btn svg{width:16px; height:16px; transition:transform .25s ease}
.btn:hover svg{transform:translateX(4px)}
.btn-solid{background:var(--teal); color:#FFFFFF}
.btn-solid:hover{background:#347A76}
.btn-dark{background:var(--ink); color:#FFFFFF}
.btn-dark:hover{background:#0B1D29}
.btn-line{border-color:rgba(255,255,255,.5); color:#FFFFFF}
.btn-line:hover{background:#FFFFFF; color:var(--ink)}
.btn-line-dark{border-color:var(--ink); color:var(--ink)}
.btn-line-dark:hover{background:var(--ink); color:#FFFFFF}
.textlink{display:inline-flex; align-items:center; gap:10px; text-decoration:none; font-weight:500; font-size:15px; color:var(--ink); border-bottom:1px solid var(--hair); padding-bottom:4px}
.textlink svg{width:15px; height:15px; color:var(--teal); transition:transform .25s ease}
.textlink:hover svg{transform:translateX(4px)}
.textlink:hover{border-color:var(--teal)}

/* top strip + header */
.strip{background:var(--night); color:#9FB2BD; font-size:12.5px; letter-spacing:.02em}
.strip .wrap{display:flex; flex-wrap:wrap; gap:4px 26px; justify-content:space-between; padding-block:8px}
.strip a{text-decoration:none; color:#E4ECEF}
.strip .g{display:flex; flex-wrap:wrap; gap:4px 22px}
header.site{position:sticky; top:env(safe-area-inset-top,0px); z-index:50; background:rgba(255,255,255,.94); backdrop-filter:blur(12px); border-bottom:1px solid var(--hair); --logo-ink:#132E40; --logo-leaf:#3D8D88}
header.site .wrap{display:flex; align-items:center; justify-content:space-between; gap:20px; padding-block:16px; position:relative}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none}
.brand .i{width:22px; height:30px}
.brand .n{width:112px; height:24px}
nav.main{display:flex; gap:38px; font-size:14.5px; font-weight:500; letter-spacing:.02em}
nav.main a{text-decoration:none; color:var(--ink-2); position:relative; padding-block:6px}
nav.main a::after{content:""; position:absolute; inset-inline-start:0; inset-inline-end:100%; bottom:0; height:1px; background:var(--teal); transition:right .3s ease}
nav.main a:hover::after, nav.main a[aria-current="page"]::after{inset-inline-end:0}
nav.main a[aria-current="page"], nav.main a:hover{color:var(--ink)}
header.site .btn{padding:11px 20px; font-size:14px}
.menu-btn{display:none; background:none; border:1px solid var(--hair); padding:9px 16px; font:500 14px var(--f-sans); color:var(--ink); cursor:pointer; border-radius:2px}
@media (max-width:880px){
  nav.main{display:none; position:absolute; left:0; right:0; top:100%; flex-direction:column; gap:0; background:#FFFFFF; border-bottom:1px solid var(--hair); padding:8px max(20px, env(safe-area-inset-right,0px)) 18px max(20px, env(safe-area-inset-left,0px))}
  nav.main.open{display:flex}
  nav.main a{padding:14px 0; border-bottom:1px solid var(--hair)}
  nav.main a::after{display:none}
  nav.main a[aria-current="page"]{color:var(--teal)}
  .menu-btn{display:inline-block}
  header.site .btn{display:none}
}

/* full-bleed photo band */
.band{position:relative; isolation:isolate; overflow:hidden; color:#FFFFFF; background:var(--night)}
.band > .bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2}
.band::before{content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(100deg, rgba(13,33,48,.94) 0%, rgba(13,33,48,.82) 45%, rgba(13,33,48,.55) 100%)}
.band.soft::before{background:linear-gradient(180deg, rgba(13,33,48,.78), rgba(13,33,48,.88))}
.band .label{color:var(--teal-lt)}
.band h1 em,.band h2 em{color:var(--sand)}
.band .lead{color:#C7D4DA}

/* hero */
.hero{padding-block:150px 64px}
@media (max-width:760px){.hero{padding-block:96px 48px}}
.hero video.bg{opacity:.45}
.hero-grid{display:grid; grid-template-columns:1.3fr .7fr; gap:64px; align-items:end}
@media (max-width:980px){.hero-grid{grid-template-columns:1fr}}
.hero h1{font-size:clamp(50px,7.4vw,98px); margin-top:26px}
.hero .lead{margin-top:28px}
.ctas{display:flex; flex-wrap:wrap; gap:14px; margin-top:40px}
.snap{background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); backdrop-filter:blur(14px); padding:24px 26px; color:#FFFFFF; max-width:340px; justify-self:end; width:100%}
@media (max-width:980px){.snap{justify-self:start}}
.snap .t{display:flex; justify-content:space-between; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:#BFD0D7}
.snap .r{display:grid; grid-template-columns:1fr 100px; align-items:center; gap:12px; padding:16px 0; border-bottom:1px solid rgba(255,255,255,.14)}
.snap .r:last-of-type{border-bottom:0}
.snap small{display:block; font-size:12.5px; color:#BFD0D7}
.snap strong{display:block; font-family:var(--f-serif); font-weight:400; font-size:34px; line-height:1.1}
.snap em{font-style:normal; font-size:12px; color:var(--teal-lt)}
.snap svg{width:100px; height:36px}
.hero-foot{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:96px; border-top:1px solid rgba(255,255,255,.18)}
@media (max-width:760px){.hero-foot{grid-template-columns:1fr; margin-top:56px}}
.hero-foot div{padding-block:24px 0; padding-inline:0 24px; display:flex; gap:14px}
.hero-foot div + div{padding-inline-start:24px; border-inline-start:1px solid rgba(255,255,255,.18)}
@media (max-width:760px){.hero-foot div + div{padding-inline-start:0; border-inline-start:0}}
.hero-foot svg{width:22px; height:22px; color:var(--sand); flex-shrink:0; margin-top:3px}
.hero-foot b{display:block; font-weight:500; font-size:15px}
.hero-foot span{font-size:14px; color:#AFC1CA; font-weight:300}

/* intro split */
.intro{display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:end}
@media (max-width:880px){.intro{grid-template-columns:1fr; gap:28px}}
.intro h2{font-size:clamp(40px,5vw,64px); margin-top:22px}

/* services index: hairline grid, no cards */
.svc-index{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:72px; border-top:1px solid var(--hair)}
@media (max-width:1100px){.svc-index{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.svc-index{grid-template-columns:1fr}}
.svc-index a{display:grid; gap:14px; align-content:start; padding-block:40px 44px; padding-inline:0 36px; text-decoration:none; border-bottom:1px solid var(--hair); position:relative}
.svc-index a:not(:nth-child(4n+1)){padding-inline-start:36px; border-inline-start:1px solid var(--hair)}
@media (max-width:1100px){.svc-index a{padding-inline-start:0!important; border-inline-start:0!important; padding-inline-end:28px}.svc-index a:nth-child(2n){padding-inline-start:28px!important; border-inline-start:1px solid var(--hair)!important}}
@media (max-width:600px){.svc-index a:nth-child(2n){padding-inline-start:0!important; border-inline-start:0!important}}
.svc-index .ic{width:30px; height:30px; color:var(--teal)}
.svc-index .ic svg{width:30px; height:30px}
.svc-index h3{font-family:var(--f-serif); font-weight:400; font-size:28px; letter-spacing:-.01em}
.svc-index p{color:var(--ink-2); font-weight:300; font-size:15.5px}
.svc-index .go{display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:500; color:var(--teal); margin-top:6px}
.svc-index .go svg{width:14px; height:14px; transition:transform .25s ease}
.svc-index a:hover .go svg{transform:translateX(5px)}
.svc-index a:hover h3{color:var(--teal)}

/* numbers inside a band */
.statement{display:grid; grid-template-columns:1.1fr .9fr; gap:72px; align-items:center}
@media (max-width:900px){.statement{grid-template-columns:1fr; gap:40px}}
.statement h2{font-size:clamp(40px,5.2vw,68px); margin-top:22px}
.figs{display:grid; grid-template-columns:repeat(2,minmax(0,1fr))}
.figs div{padding-block:26px; padding-inline:28px 0; border-inline-start:1px solid rgba(255,255,255,.22)}
.figs div:nth-child(n+3){border-top:1px solid rgba(255,255,255,.22)}
.figs b{display:block; font-family:var(--f-serif); font-weight:400; font-size:clamp(44px,5vw,60px); line-height:1}
.figs span{display:block; margin-top:8px; font-size:14px; color:#BFD0D7; font-weight:300}

/* markets: typographic */
.markets{display:grid; grid-template-columns:1fr 1fr; gap:0; margin-top:72px; border-top:1px solid var(--ink)}
@media (max-width:860px){.markets{grid-template-columns:1fr}}
.market{padding-block:44px 8px; padding-inline:0 48px; display:grid; gap:22px; align-content:start}
.market + .market{padding-inline-start:48px; border-inline-start:1px solid var(--hair)}
@media (max-width:860px){.market + .market{padding-inline-start:0; border-inline-start:0; border-top:1px solid var(--hair); margin-top:28px}}
.market-top{display:flex; justify-content:space-between; align-items:baseline; gap:20px; flex-wrap:wrap}
.market h3{font-family:var(--f-serif); font-weight:400; font-size:clamp(40px,4.4vw,56px); line-height:1}
.market .where{font-size:14px; color:var(--ink-3); margin-top:8px}
.clock{font-family:var(--f-serif); font-size:40px; line-height:1; color:var(--teal)}
.clock small{display:block; font-family:var(--f-sans); font-size:11px; letter-spacing:.18em; color:var(--ink-3); margin-top:6px; text-align:end}
.rates{display:grid; grid-template-columns:1fr 1fr; border-block:1px solid var(--hair)}
.rates div{padding:18px 0}
.rates div + div{padding-inline-start:22px; border-inline-start:1px solid var(--hair)}
.rates b{display:block; font-family:var(--f-serif); font-weight:400; font-size:38px; line-height:1.1}
.rates span{font-size:13.5px; color:var(--ink-2)}
.market ul{list-style:none; margin:0; padding:0; display:grid; gap:10px; font-weight:300; color:var(--ink-2)}
.market li{display:flex; gap:12px}
.market li::before{content:""; width:14px; height:1px; background:var(--teal); margin-top:13px; flex-shrink:0}
.fine{font-size:13px; color:var(--ink-3); margin-top:28px}

/* steps over photo */
.steps{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:64px; border-top:1px solid rgba(255,255,255,.25)}
@media (max-width:860px){.steps{grid-template-columns:1fr}}
.step{padding-block:32px 0; padding-inline:0 36px}
.step + .step{padding-inline-start:36px; border-inline-start:1px solid rgba(255,255,255,.25)}
@media (max-width:860px){.step + .step{padding-inline-start:0; border-inline-start:0}.step{padding-bottom:20px}}
.step .n{font-family:var(--f-serif); font-style:italic; font-size:44px; color:var(--sand); line-height:1}
.step h3{font-size:19px; font-weight:500; margin-top:18px}
.step p{color:#C2D0D6; font-weight:300; margin-top:8px}

/* founder */
.founder{display:grid; grid-template-columns:.85fr 1.15fr; gap:80px; align-items:center}
@media (max-width:880px){.founder{grid-template-columns:1fr; gap:44px}}
.portrait{position:relative; max-width:420px; width:100%}
.portrait img{display:block; width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center 20%}
.portrait::after{content:""; position:absolute; inset-inline-start:-18px; bottom:-18px; width:55%; height:30%; border-inline-start:1px solid var(--teal); border-bottom:1px solid var(--teal); z-index:-1}
.portrait{isolation:isolate}
.founder blockquote{margin:22px 0 0; font-family:var(--f-serif); font-size:clamp(30px,3.4vw,44px); line-height:1.18}
.founder blockquote em{color:var(--teal)}
.sig{margin-top:32px; display:flex; align-items:center; gap:18px}
.sig::before{content:""; width:44px; height:1px; background:var(--ink)}
.sig b{font-weight:600; font-size:15.5px; display:block}
.sig span{font-size:14px; color:var(--ink-3)}

/* CTA band */
.cta{padding-block:130px}
.cta .wrap{display:grid; justify-items:center; text-align:center; gap:24px}
.cta h2{font-size:clamp(42px,5.6vw,76px); max-width:14ch}
.cta .lead{text-align:center}
.cta .ctas{justify-content:center; margin-top:16px}

/* inner page hero */
.phero{padding-block:140px 110px}
@media (max-width:760px){.phero{padding-block:90px 70px}}
.phero h1{font-size:clamp(46px,6.4vw,86px); margin-top:24px; max-width:16ch}
.phero .lead{margin-top:26px}
.crumbs{font-size:13px; color:#AFC1CA; letter-spacing:.04em}
.crumbs a{color:#FFFFFF; text-decoration:none}
.jump{display:flex; flex-wrap:wrap; gap:6px 26px; margin-top:40px; font-size:14px}
.jump a{color:#E4ECEF; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.3); padding-bottom:3px}
.jump a:hover{border-color:var(--sand)}

/* service detail rows */
.detail{display:grid; grid-template-columns:.9fr 1fr 1fr; gap:56px; padding-block:64px; border-top:1px solid var(--hair); scroll-margin-top:90px}
.detail:first-child{border-top:0; padding-top:0}
@media (max-width:980px){.detail{grid-template-columns:1fr 1fr; gap:36px}.detail .h{grid-column:1/-1}}
@media (max-width:620px){.detail{grid-template-columns:1fr}}
.detail .h{display:grid; gap:16px; align-content:start}
.detail .h svg{width:30px; height:30px; color:var(--teal)}
.detail h2{font-size:clamp(34px,3.6vw,46px)}
.detail .h p{color:var(--ink-2); font-weight:300}
.detail h4{margin:0 0 14px; font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-3); font-weight:600}
.lines{list-style:none; margin:0; padding:0}
.lines li{padding:12px 0; border-bottom:1px solid var(--hair); font-weight:300; display:flex; gap:14px}
.lines li::before{content:""; width:14px; height:1px; background:var(--teal); margin-top:13px; flex-shrink:0}

/* plans: columns with hairlines */
.plans{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:64px; border-top:1px solid var(--ink)}
@media (max-width:900px){.plans{grid-template-columns:1fr}}
.plan{padding-block:40px 8px; padding-inline:0 40px; display:flex; flex-direction:column; gap:20px}
.plan + .plan{padding-inline-start:40px; border-inline-start:1px solid var(--hair)}
@media (max-width:900px){.plan + .plan{padding-inline-start:0; border-inline-start:0; border-top:1px solid var(--hair)}}
.plan .who{font-size:13.5px; color:var(--ink-3)}
.plan h3{font-family:var(--f-serif); font-weight:400; font-size:44px}
.plan.feat h3{color:var(--teal)}
.plan .lines{flex-grow:1}
.plan .price{font-size:13.5px; color:var(--ink-2)}
.plan .tag{font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--teal); font-weight:600}

/* faq */
.faq{margin-top:56px; border-top:1px solid var(--ink); max-width:900px}
.faq details{border-bottom:1px solid var(--hair)}
.faq summary{cursor:pointer; list-style:none; padding:26px 0; font-family:var(--f-serif); font-size:26px; display:flex; justify-content:space-between; gap:20px; line-height:1.2}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; font-family:var(--f-sans); font-weight:300; color:var(--teal); font-size:26px; line-height:1; transition:transform .25s ease}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding-bottom:26px; color:var(--ink-2); font-weight:300; max-width:65ch}

/* about */
.story{display:grid; grid-template-columns:1fr 1fr; gap:80px}
@media (max-width:880px){.story{grid-template-columns:1fr; gap:28px}}
.story h2{font-size:clamp(40px,4.8vw,60px); margin-top:22px}
.story .body{display:grid; gap:20px; font-size:18px; font-weight:300; color:var(--ink-2); max-width:60ch; padding-top:8px}
.story .body p:first-child::first-letter{font-family:var(--f-serif); font-size:64px; float:inline-start; line-height:.85; margin-block:6px 0; margin-inline:0 10px; color:var(--teal)}
.values{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:64px; border-top:1px solid rgba(255,255,255,.25)}
@media (max-width:860px){.values{grid-template-columns:1fr}}
.value{padding-block:36px 0; padding-inline:0 36px}
.value + .value{padding-inline-start:36px; border-inline-start:1px solid rgba(255,255,255,.25)}
@media (max-width:860px){.value + .value{padding-inline-start:0; border-inline-start:0}.value{padding-bottom:16px}}
.value h3{font-family:var(--f-serif); font-weight:400; font-size:36px}
.value p{color:#C2D0D6; font-weight:300; margin-top:12px}
.why{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 64px; margin-top:56px}
@media (max-width:760px){.why{grid-template-columns:1fr}}
.why div{padding:28px 0; border-top:1px solid var(--hair); display:grid; grid-template-columns:40px 1fr; gap:14px}
.why svg{width:24px; height:24px; color:var(--teal); margin-top:4px}
.why b{display:block; font-family:var(--f-serif); font-weight:400; font-size:28px; line-height:1.1}
.why span{color:var(--ink-2); font-weight:300}

/* contact */
.contact{display:grid; grid-template-columns:.9fr 1.1fr; gap:88px}
@media (max-width:940px){.contact{grid-template-columns:1fr; gap:56px}}
.c-rows{border-top:1px solid var(--ink); margin-top:36px}
.c-row{display:grid; grid-template-columns:150px 1fr; gap:16px; padding:20px 0; border-bottom:1px solid var(--hair); align-items:baseline}
@media (max-width:480px){.c-row{grid-template-columns:1fr; gap:2px}}
.c-row small{font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-3); font-weight:600}
.c-row a,.c-row span{font-family:var(--f-serif); font-size:26px; text-decoration:none; line-height:1.2}
.c-row a:hover{color:var(--teal)}
.wa{display:flex; flex-wrap:wrap; gap:12px; margin-top:32px}
form.q{display:grid; grid-template-columns:1fr 1fr; gap:30px 28px; align-content:start}
@media (max-width:620px){form.q{grid-template-columns:1fr}}
form.q .full{grid-column:1/-1}
form.q label{display:grid; gap:4px; font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:600; color:var(--ink-3)}
form.q input, form.q select, form.q textarea{font:300 18px var(--f-sans); letter-spacing:0; text-transform:none; padding:10px 0; border:0; border-bottom:1px solid var(--hair); background:transparent; color:var(--ink); width:100%; min-width:0; border-radius:0}
form.q input:focus, form.q select:focus, form.q textarea:focus{outline:none; border-bottom-color:var(--teal)}
form.q textarea{min-height:110px; resize:vertical}
fieldset{border:0; padding:0; margin:0}
legend{font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:600; color:var(--ink-3); padding:0; margin-bottom:12px}
.seg{display:flex; flex-wrap:wrap; gap:10px}
.seg label{display:flex!important; align-items:center; gap:8px; font-size:14.5px!important; letter-spacing:0!important; text-transform:none!important; font-weight:400!important; color:var(--ink)!important; border:1px solid var(--hair); padding:9px 18px; cursor:pointer; border-radius:2px}
.seg input{width:auto!important; accent-color:var(--teal)}
.seg label:has(input:checked){border-color:var(--teal); color:var(--teal)!important}
.form-msg{grid-column:1/-1; font-size:15px; color:var(--teal)}
.form-msg.err{color:#B4472F}

/* footer */
footer{background:var(--night); color:#9FB2BD; --logo-ink:#FFFFFF; --logo-leaf:#5BB3AC; font-size:14.5px; font-weight:300}
footer .wrap{padding-block:80px 32px; display:grid; gap:56px}
.f-top{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px}
@media (max-width:860px){.f-top{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.f-top{grid-template-columns:1fr}}
.f-top .full{width:210px; height:53px}
.f-top h4{color:#FFFFFF; font-size:12px; letter-spacing:.18em; text-transform:uppercase; margin:0 0 18px; font-weight:600}
.f-top ul{list-style:none; margin:0; padding:0; display:grid; gap:10px}
.f-top a{text-decoration:none}
.f-top a:hover{color:#FFFFFF}
.f-bot{border-top:1px solid rgba(255,255,255,.12); padding-top:24px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; font-size:13px}

/* gentle reveal on load for hero text */
.rise{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
.rise.d2{animation-delay:.12s}.rise.d3{animation-delay:.24s}.rise.d4{animation-delay:.36s}
@keyframes rise{from{opacity:.35; transform:translateY(18px)}to{opacity:1; transform:none}}
@media (prefers-reduced-motion: reduce){*{animation:none!important; transition:none!important} html{scroll-behavior:auto} .hero video.bg{display:none}}

/* linkedin link in founder signature */
.sig .in-link{margin-inline-start:6px; width:38px; height:38px; display:grid; place-items:center; color:#0A66C2; border:1px solid var(--hair); border-radius:50%; transition:background .25s ease,color .25s ease,border-color .25s ease}
.sig .in-link svg{width:18px; height:18px}
.sig .in-link:hover{background:#0A66C2; color:#fff; border-color:#0A66C2}

/* floating whatsapp */
.wa-float{position:fixed; inset-inline-end:18px; bottom:calc(18px + env(safe-area-inset-bottom,0px)); z-index:60; display:flex; flex-direction:column; align-items:flex-end; gap:10px}
.wa-fab{width:52px; height:52px; border-radius:50%; border:0; background:#25D366; color:#fff; display:grid; place-items:center; cursor:pointer; box-shadow:0 6px 18px rgba(13,33,48,.28); transition:transform .2s ease, box-shadow .2s ease}
.wa-fab:hover{transform:translateY(-2px); box-shadow:0 10px 24px rgba(13,33,48,.34)}
.wa-fab svg{width:28px; height:28px}
.wa-menu{background:#fff; color:var(--ink); border:1px solid var(--hair); box-shadow:0 14px 34px rgba(13,33,48,.2); padding:14px; width:236px; display:grid; gap:4px}
.wa-menu[hidden]{display:none}
.wa-menu p{font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); margin-block:0 6px; margin-inline:4px 0; font-weight:600}
.wa-menu a{display:flex; align-items:center; gap:12px; padding:10px 8px; text-decoration:none; color:var(--ink); transition:background .2s ease}
.wa-menu a:hover{background:var(--paper-2)}
.wa-menu a svg{width:26px; height:26px; color:#25D366; flex-shrink:0}
.wa-menu b{display:block; font-weight:600; font-size:14.5px}
.wa-menu small{display:block; font-size:13px; color:var(--ink-3)}
@media (max-width:600px){.wa-float{inset-inline-end:14px; bottom:calc(14px + env(safe-area-inset-bottom,0px))}.wa-fab{width:48px; height:48px}}
footer a{overflow-wrap:anywhere}
.c-row a[href^="mailto:"]{font-size:clamp(17px,1.45vw,20px); overflow-wrap:normal; word-break:keep-all}

/* language switcher */
.lang{display:inline-flex; align-items:center; gap:2px}
.lang button{background:none; border:0; color:#9FB2BD; font:inherit; font-size:12.5px; letter-spacing:.04em; padding:2px 7px; cursor:pointer; border-bottom:1px solid transparent; transition:color .2s ease,border-color .2s ease}
.lang button:hover{color:#fff}
.lang button[aria-pressed="true"]{color:#fff; border-bottom-color:var(--sand)}
.lang button + button{margin-inline-start:2px}
.lang .sep{color:#5E7585; font-size:12px}

/* Arabic / right-to-left */
html[lang="ar"]{--f-serif:"Noto Naskh Arabic","Amiri","Times New Roman",serif; --f-sans:"Noto Sans Arabic","Segoe UI",Tahoma,Arial,sans-serif}
html[lang="ar"] *{letter-spacing:0!important; text-transform:none!important}
html[lang="ar"] em{font-style:normal}
html[lang="ar"] h1,html[lang="ar"] h2{line-height:1.35}
html[lang="ar"] h3{line-height:1.4}
html[lang="ar"] .lead,html[lang="ar"] p{line-height:1.85}
html[lang="ar"] .story .body p:first-child::first-letter{float:none; font-size:inherit; margin:0; color:inherit; line-height:inherit}
html[dir="rtl"] .btn svg use,html[dir="rtl"] .textlink svg use,html[dir="rtl"] .svc-index .go svg use{transform:scaleX(-1); transform-box:fill-box; transform-origin:center}
html[dir="rtl"] .btn:hover svg,html[dir="rtl"] .textlink:hover svg,html[dir="rtl"] .svc-index a:hover .go svg{transform:translateX(-5px)}
html[dir="rtl"] a[href^="tel:"],html[dir="rtl"] .num{direction:ltr; unicode-bidi:isolate}
html[dir="rtl"] a[href^="mailto:"]{direction:ltr; unicode-bidi:isolate}
html[dir="rtl"] input[type="email"],html[dir="rtl"] input[type="tel"]{direction:ltr; text-align:right}
html[dir="rtl"] .crumbs{direction:rtl}
html[dir="rtl"] .clock small{text-align:start}
html[dir="rtl"] .c-row a{text-align:right; justify-self:stretch}
footer a[href^="mailto:"]{font-size:13px; overflow-wrap:normal; white-space:nowrap}