/* Utilox site styles. Colours and sizes for light/dark are the variables at the top of .ux. */
body{margin:0}
.ux{--bg:#FFFFFC;--alt:#F2F0ED;--ph:#E4DDD9;--ink:#270100;--muted:#735A58;--subtle:#93807E;--border:#DFD9D6;--line-strong:#270100;--field-line:#CFC6C2;--btn:#270100;--btn-fg:#FFFFFC;--btn-hover:#472726;--band:#270100;--on-band:#FFFFFC;--on-band-muted:rgba(255,255,252,0.78);--band-line:rgba(255,255,252,0.25);--glass:rgba(255,255,252,0.7);--glass-band:rgba(255,255,252,0.85);--caption:rgba(39,1,0,0.72);--rib:rgba(255,255,252,0.22);--hero-grad:radial-gradient(120% 90% at 85% 10%,#8A3A22 0%,rgba(138,58,34,0) 55%),radial-gradient(90% 80% at 10% 100%,#4E1408 0%,rgba(78,20,8,0) 60%),linear-gradient(135deg,#3A0804 0%,#270100 50%,#150000 100%);transition:background-color .3s ease,color .3s ease}
.ux[data-theme="dark"]{--bg:#140807;--alt:#1F0F0E;--ph:#2E1B19;--ink:#FFFFFC;--muted:#CFC3C1;--subtle:#A6938F;--border:#3A2624;--line-strong:#6B5250;--field-line:#4A3432;--btn:#FFFFFC;--btn-fg:#270100;--btn-hover:#E9E2DF;--band:#3B1311;--on-band:#FFFFFC;--on-band-muted:rgba(255,255,252,0.8);--band-line:rgba(255,255,252,0.22);--glass:rgba(31,15,14,0.8);--glass-band:rgba(255,255,252,0.9);--caption:rgba(20,8,7,0.78);--rib:rgba(255,255,252,0.12);--hero-grad:radial-gradient(120% 90% at 85% 10%,#6E2A18 0%,rgba(110,42,24,0) 55%),radial-gradient(90% 80% at 10% 100%,#3E0F06 0%,rgba(62,15,6,0) 60%),linear-gradient(135deg,#2C0603 0%,#1E0100 50%,#0E0000 100%)}
.ux a{color:inherit;text-decoration:none}
.ux :focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.ux input::placeholder,.ux textarea::placeholder{color:var(--subtle)}
.ux input:focus,.ux textarea:focus{outline:2px solid var(--ink);outline-offset:1px}
.ux-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ux-roll{display:grid;overflow:hidden;line-height:1.25}
.ux-roll>span{grid-area:1/1;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.ux-roll>span+span{transform:translateY(115%)}
.ux-btn{transition:background-color .2s ease,box-shadow .2s ease}
.ux-arr{transition:transform .25s ease}
.ux-link{background-image:linear-gradient(currentColor,currentColor);background-size:0% 1.5px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .25s ease}
.ux-iconbtn{transition:background-color .2s ease}
.ux-soc,.ux-tile{transition:transform .25s ease,background-color .25s ease}
.ux-rib{flex:1 1 0;background:linear-gradient(270deg,var(--rib),rgba(255,255,255,0));backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.ux-card{transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.ux-work .ux-work-img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.ux-acc>.ux-svc{flex:1 1 0;min-width:0;transition:flex-grow .6s cubic-bezier(.2,.7,.2,1)}
.ux-acc>.ux-svc.is-open{flex-grow:2.55}
.ux-tab{transition:background-color .2s ease,color .2s ease}
.ux-tab[aria-selected="true"]{background:var(--ink)!important;color:var(--bg)!important}
.ux-tab[aria-selected="false"]{background:transparent!important;color:var(--ink)!important}
.ux-row{transition:background-color .3s ease,padding .3s ease}
.ux-row-img{opacity:0;transform:scale(.8) rotate(-4deg);transition:opacity .3s ease,transform .3s ease}
.ux-faq summary::-webkit-details-marker{display:none}
.ux-faq-i{transition:transform .3s ease,background-color .3s ease}.ux-faq[open] .ux-faq-i{transform:rotate(45deg);background:var(--ink)!important;color:var(--bg)!important}
.ux-faq[open] .ux-faq-a{animation:ux-fade .4s ease both}
.ux-hscroll{scrollbar-width:none}.ux-hscroll::-webkit-scrollbar{display:none}
.ux-rise{animation:ux-rise .9s cubic-bezier(.2,.7,.2,1) both}
.ux-drop{animation:ux-drop .6s ease both}
.ux-menu{animation:ux-drop .3s ease both}
.ux-float{animation:ux-float 5s ease-in-out infinite;transform-box:fill-box}
.ux-track{animation:ux-marq 40s linear infinite}
.ux-cyc{position:relative;display:inline-grid;white-space:nowrap;vertical-align:bottom}
.ux-cyc>span[aria-hidden]{grid-area:1/1;position:relative}
.ux-cyc i{font-style:normal;display:inline-block;opacity:0;animation:ux-letter 15s infinite both}
.ux-cyc u{position:absolute;left:0;right:0;bottom:-4px;height:2px;border-radius:99px;background:currentColor;transform:scaleX(0);transform-origin:left center;animation:ux-line 15s infinite both}
@property --ux-n{syntax:'<integer>';initial-value:0;inherits:false}
.ux-count{display:inline-block;counter-reset:uxn var(--ux-n);animation:ux-count 3.5s cubic-bezier(.2,.7,.2,1) forwards,ux-bounce .8s 3.5s both}
.ux-count::before{content:counter(uxn)}
.ux-mask::after{content:'';position:absolute;inset:0;background:var(--bg);opacity:.7;transform-origin:right center;animation:ux-unmask 1.2s cubic-bezier(.2,.7,.2,1) .3s both}
.ux-mask+.ux-mask::after{animation-delay:.55s}
.ux[data-ux-scroll] .ux-reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.ux[data-ux-scroll] .ux-reveal.ux-in{opacity:1;transform:none}
@keyframes ux-rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes ux-drop{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
@keyframes ux-fade{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes ux-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes ux-marq{to{transform:translateX(-50%)}}
@keyframes ux-letter{0%{opacity:0;transform:translateY(20px);filter:blur(8px)}3.3%,14%{opacity:1;transform:none;filter:blur(0)}16.7%,100%{opacity:0;transform:translateY(-16px);filter:blur(8px)}}
@keyframes ux-line{0%{transform:scaleX(0)}3.7%,14%{transform:scaleX(1)}16.7%,100%{transform:scaleX(0)}}
@keyframes ux-count{from{--ux-n:0}to{--ux-n:var(--ux-to)}}
@keyframes ux-bounce{0%,100%{transform:none}30%{transform:translateY(-18px)}60%{transform:none}80%{transform:translateY(-5px)}}
@keyframes ux-unmask{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media (prefers-reduced-motion: reduce){
.ux *,.ux *::before,.ux *::after{animation:none!important;transition:none!important}
.ux-cyc i{opacity:0}.ux-cyc>span[aria-hidden]:nth-child(2) i{opacity:1}
.ux-mask::after{display:none}
.ux[data-ux-scroll] .ux-reveal{opacity:1;transform:none}
}


/* hover effects only where a mouse can really hover (touch screens fire false hovers on tap) */
@media (hover:hover) and (pointer:fine){
.ux-btn:hover .ux-roll>span:first-child{transform:translateY(-115%)}
.ux-btn:hover .ux-roll>span+span{transform:none}
.ux-btn-p:hover{background-color:var(--btn-hover)!important}
.ux-btn-s:hover{background-color:var(--alt)!important}
.ux-btn:hover .ux-arr,.ux-link:hover .ux-arr,.ux-card:hover .ux-arr{transform:translate(3px,-3px)}
.ux-link:hover{background-size:100% 1.5px}
.ux-iconbtn:hover{background-color:var(--alt)!important}
.ux-soc:hover,.ux-tile:hover{transform:translateY(-3px);background-color:var(--on-band)!important}
.ux-card:hover{transform:translateY(-4px)}
.ux-work:hover .ux-work-img{transform:scale(1.04)}
.ux-acc:hover>.ux-svc{flex-grow:1}
.ux-acc>.ux-svc:hover{flex-grow:2.55}
.ux-row:hover{background-color:var(--alt);padding-left:16px!important;padding-right:16px!important}
.ux-row:hover .ux-row-img{opacity:1;transform:none}
.ux-marquee:hover .ux-track{animation-play-state:paused}
}
/* ---------- site shell ---------- */
body.ux{background:var(--bg);color:var(--ink);font-family:'DM Sans', sans-serif;display:flex;flex-direction:column;min-height:100vh;position:relative;overflow-x:clip;box-sizing:border-box}
body.ux>main{display:flex;flex-direction:column;flex:0 0 auto}
.skip-link{position:absolute;left:12px;top:-60px;z-index:200;padding:10px 14px;border-radius:6px;background:var(--btn);color:var(--btn-fg)}
.skip-link:focus{top:12px}
[data-if]{display:none}
.ux[data-theme="dark"] [data-if="isDark"],.ux:not([data-theme="dark"]) [data-if="isLight"],
.ux[data-menu="open"] [data-if="menuOpen"],.ux:not([data-menu="open"]) [data-if="menuClosed"],
.ux[data-plan="0"] [data-if="plan0"],.ux[data-plan="1"] [data-if="plan1"],.ux[data-plan="2"] [data-if="plan2"]{display:contents}
.form-status{padding:12px 14px;border-radius:6px;font-size:0.9375rem;line-height:1.5;margin-top:12px}
.form-status.is-ok{background:#E3F2E8;color:#14532D}
.form-status.is-err{background:#FCE7E7;color:#7F1D1D}
.form-status a{text-decoration:underline}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
button[disabled]{opacity:.6;cursor:progress}
/* visitors who ask for less motion see the final numbers straight away (the design showed 0) */
@media (prefers-reduced-motion:reduce){.ux-count{--ux-n:var(--ux-to)}}
/* the same layout rules shown or hidden at a given screen size */
@media (max-width:1099px){.vd{display:none!important}}
@media (max-width:699px){.vdt{display:none!important}}
@media (min-width:1100px){.vt,.vtm{display:none!important}}
@media (max-width:699px){.vt{display:none!important}}
@media (min-width:700px){.vm{display:none!important}}
@media (min-width:700px) and (max-width:1099px){.vdm{display:none!important}}

/* ----- layout rules: base = desktop ----- */
.ux .u1{height:88px;flex-shrink:0;box-sizing:border-box;padding:0 40px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;justify-content:space-between;position:relative;z-index:20}
.ux .u2{display:flex;align-items:center;color:var(--ink)}
.ux .u3{color:var(--ink);flex-shrink:0;display:block;width:56px;height:56px}
.ux .u4{fill:var(--bg)}
.ux .u5{display:flex;gap:12px;align-items:center;justify-self:end}
.ux .u6{height:52px;padding:0 28px;border-radius:8px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:10px;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;white-space:nowrap;flex-shrink:0;background:var(--btn);color:var(--btn-fg)}
.ux .u7{width:52px;height:52px;border-radius:10px;border:0.8px solid var(--border);background:var(--bg);color:var(--ink);display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer;flex-shrink:0}
.ux .u8{display:flex;gap:10px;align-items:center}
.ux .u9{height:52px;padding:0 14px;border-radius:8px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:10px;font-family:'DM Sans', sans-serif;font-size:0.9375rem;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;white-space:nowrap;flex-shrink:0;background:var(--btn);color:var(--btn-fg)}
.ux .u10{position:absolute;top:80px;left:24px;right:24px;z-index:30;background:var(--bg);border:0.8px solid var(--border);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:16px;box-shadow:0 24px 60px rgba(39,1,0,0.14)}
.ux .u11{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:12px}
.ux .u12{display:flex;flex-direction:column;gap:14px;padding:24px;border-radius:8px;border:0.8px solid var(--border)}
.ux .u13{margin:0;font-family:'Lexend', sans-serif;font-size:1.25rem;font-weight:600;line-height:1.55;letter-spacing:normal;color:var(--ink)}
.ux .u14{align-self:flex-start;font-family:'DM Sans', sans-serif;font-size:1.0625rem;color:var(--muted)}
.ux .u15{height:52px;padding:0 28px;border-radius:8px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:10px;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;white-space:nowrap;flex-shrink:0;background:var(--btn);color:var(--btn-fg);width:100%}
.ux .u16{padding:32px 40px 32px;background:transparent;display:flex;flex-direction:column;gap:48px;position:relative}
.ux .u17{display:flex;flex-direction:column;gap:16px}
.ux .u18{display:flex;justify-content:space-between;align-items:flex-end;gap:24px}
.ux .u19{margin:0;display:flex;align-items:baseline;gap:14px;font-family:'Lexend', sans-serif;font-size:9.375rem;font-weight:500;line-height:0.8;letter-spacing:-0.045em;color:var(--ink);white-space:nowrap}
.ux .u20{animation-delay:0.2s;position:relative;overflow:hidden;border-radius:20px;background:var(--hero-grad);min-height:585px;box-sizing:border-box;padding:32px;display:flex;flex-direction:column;justify-content:flex-end;gap:64px}
.ux .u21{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;position:relative;z-index:2}
.ux .u22{animation-delay:0.25s;display:flex;flex-direction:column;gap:16px;max-width:700px}
.ux .u23{display:flex}
.ux .u24{width:40px;height:40px;border-radius:50%;background:var(--on-band);color:var(--band);display:flex;align-items:center;justify-content:center;margin-left:0px;border:2px solid var(--band);box-sizing:border-box}
.ux .u25{width:40px;height:40px;border-radius:50%;background:var(--on-band);color:var(--band);display:flex;align-items:center;justify-content:center;margin-left:-10px;border:2px solid var(--band);box-sizing:border-box}
.ux .u26{font-family:'Lexend', sans-serif;font-size:3rem;font-weight:600;line-height:1.2;letter-spacing:-0.02em;color:var(--on-band)}
.ux .u27{animation-delay:0.000s}
.ux .u28{animation-delay:0.055s}
.ux .u29{animation-delay:0.110s}
.ux .u30{animation-delay:0.165s}
.ux .u31{animation-delay:0.220s}
.ux .u32{animation-delay:0.275s}
.ux .u33{animation-delay:0.330s}
.ux .u34{animation-delay:0.385s}
.ux .u35{animation-delay:0.10s}
.ux .u36{animation-delay:2.500s}
.ux .u37{animation-delay:2.555s}
.ux .u38{animation-delay:2.610s}
.ux .u39{animation-delay:2.665s}
.ux .u40{animation-delay:2.720s}
.ux .u41{animation-delay:2.775s}
.ux .u42{animation-delay:2.830s}
.ux .u43{animation-delay:2.885s}
.ux .u44{animation-delay:2.940s}
.ux .u45{animation-delay:2.995s}
.ux .u46{animation-delay:3.050s}
.ux .u47{animation-delay:3.105s}
.ux .u48{animation-delay:3.160s}
.ux .u49{animation-delay:3.215s}
.ux .u50{animation-delay:2.60s}
.ux .u51{animation-delay:5.000s}
.ux .u52{animation-delay:5.055s}
.ux .u53{animation-delay:5.110s}
.ux .u54{animation-delay:5.165s}
.ux .u55{animation-delay:5.220s}
.ux .u56{animation-delay:5.275s}
.ux .u57{animation-delay:5.330s}
.ux .u58{animation-delay:5.385s}
.ux .u59{animation-delay:5.440s}
.ux .u60{animation-delay:5.495s}
.ux .u61{animation-delay:5.10s}
.ux .u62{animation-delay:7.500s}
.ux .u63{animation-delay:7.555s}
.ux .u64{animation-delay:7.610s}
.ux .u65{animation-delay:7.665s}
.ux .u66{animation-delay:7.720s}
.ux .u67{animation-delay:7.775s}
.ux .u68{animation-delay:7.830s}
.ux .u69{animation-delay:7.885s}
.ux .u70{animation-delay:7.940s}
.ux .u71{animation-delay:7.995s}
.ux .u72{animation-delay:8.050s}
.ux .u73{animation-delay:7.60s}
.ux .u74{animation-delay:10.000s}
.ux .u75{animation-delay:10.055s}
.ux .u76{animation-delay:10.110s}
.ux .u77{animation-delay:10.165s}
.ux .u78{animation-delay:10.220s}
.ux .u79{animation-delay:10.275s}
.ux .u80{animation-delay:10.330s}
.ux .u81{animation-delay:10.385s}
.ux .u82{animation-delay:10.440s}
.ux .u83{animation-delay:10.495s}
.ux .u84{animation-delay:10.10s}
.ux .u85{animation-delay:12.500s}
.ux .u86{animation-delay:12.555s}
.ux .u87{animation-delay:12.610s}
.ux .u88{animation-delay:12.665s}
.ux .u89{animation-delay:12.720s}
.ux .u90{animation-delay:12.775s}
.ux .u91{animation-delay:12.830s}
.ux .u92{animation-delay:12.885s}
.ux .u93{animation-delay:12.940s}
.ux .u94{animation-delay:12.995s}
.ux .u95{animation-delay:13.050s}
.ux .u96{animation-delay:13.105s}
.ux .u97{animation-delay:13.160s}
.ux .u98{animation-delay:13.215s}
.ux .u99{animation-delay:13.270s}
.ux .u100{animation-delay:12.60s}
.ux .u101{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:12px;position:relative;z-index:2}
.ux .u102{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:14px;border-radius:8px;background:var(--glass-band);color:var(--band);box-sizing:border-box;min-width:0}
.ux .u103{width:52px;height:52px;border-radius:6px;background:var(--band);color:var(--on-band);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ux .u104{font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:600;line-height:1.25;min-width:0;overflow-wrap:anywhere}
.ux .u105{display:flex;flex-direction:column;align-items:center;gap:18px;padding:16px 0}
.ux .u106{margin:0;font-family:'DM Sans', sans-serif;font-size:0.875rem;font-weight:600;line-height:1.55;letter-spacing:0.06em;color:var(--muted);text-transform:uppercase;text-align:center}
.ux .u107{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:16px 64px}
.ux .u108{font-family:'Lexend', sans-serif;font-size:1.625rem;font-weight:500;letter-spacing:-0.01em;color:var(--muted);white-space:nowrap}
.ux .u109{padding:100px 40px 100px;background:transparent;display:flex;flex-direction:column;gap:64px;position:relative}
.ux .u110{display:flex;gap:64px;align-items:stretch}
.ux .u111{background:var(--band);border-radius:16px;display:flex;align-items:center;justify-content:center;padding:40px;box-sizing:border-box;flex:1 1 0;min-width:0}
.ux .u112{color:var(--on-band);flex-shrink:0;display:block;width:540px;height:540px}
.ux .u113{animation-delay:0s}
.ux .u114{animation-delay:0.6s}
.ux .u115{animation-delay:1.2s}
.ux .u116{animation-delay:0.9s}
.ux .u117{animation-delay:0.3s}
.ux .u118{animation-delay:1.5s}
.ux .u119{animation-delay:1.8s}
.ux .u120{fill:var(--band)}
.ux .u121{display:flex;flex-direction:column;justify-content:center;gap:32px;flex:1 1 0;min-width:0}
.ux .u122{display:flex;align-items:center;gap:8px;flex-shrink:0}
.ux .u123{width:8px;height:8px;border-radius:50%;background:var(--ink);flex-shrink:0}
.ux .u124{font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.ux .u125{margin:0;font-family:'Lexend', sans-serif;font-size:2.25rem;font-weight:600;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u126{margin:0;font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted);max-width:720px}
.ux .u127{height:0.8px;background:var(--border);flex-shrink:0}
.ux .u128{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:32px}
.ux .u129{display:flex;flex-direction:column;gap:12px;min-width:0}
.ux .u130{height:57px;display:flex;align-items:center;font-family:'Lexend', sans-serif;font-size:3.25rem;font-weight:500;line-height:1;letter-spacing:-0.03em;color:var(--ink)}
.ux .u131{display:inline-flex;align-items:baseline}
.ux .u132{--ux-to:6}
.ux .u133{margin:0;font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted)}
.ux .u134{width:46px;height:46px}
.ux .u135{--ux-to:4}
.ux .u136{padding:100px 40px 100px;background:var(--alt);display:flex;flex-direction:column;gap:64px;position:relative}
.ux .u137{display:flex;align-items:center;justify-content:flex-start;gap:30px;padding:16px 0;border-bottom:0.8px solid var(--ink)}
.ux .u138{margin:0;font-family:'Lexend', sans-serif;font-size:3.75rem;font-weight:600;line-height:1.1;letter-spacing:-0.03em;color:var(--ink)}
.ux .u139{width:1px;align-self:stretch;background:var(--border)}
.ux .u140{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:16px}
.ux .u141{display:block;position:relative;height:300px;border-radius:12px;overflow:hidden;background:var(--ph)}
.ux .u142{position:absolute;inset:0}
.ux .u143{height:300px;border-radius:0px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box}
.ux .u144{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 12%;display:block}
.ux .u145{position:absolute;left:16px;right:16px;bottom:14px;z-index:3;box-sizing:border-box;border-radius:8px;background:var(--caption);padding:12px 18px;display:flex;align-items:center;gap:16px}
.ux .u146{display:flex;align-items:center;gap:14px}
.ux .u147{font-family:'Lexend', sans-serif;font-size:1.625rem;font-weight:600;line-height:1.1;letter-spacing:-0.02em;color:var(--on-band)}
.ux .u148{flex-grow:1;height:1px;background:var(--on-band);opacity:0.6}
.ux .u149{font-family:'DM Sans', sans-serif;font-size:0.9375rem;font-weight:500;color:var(--on-band);white-space:nowrap}
.ux .u150{display:flex;justify-content:center}
.ux .u151{height:52px;padding:0 28px;border-radius:8px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:10px;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;white-space:nowrap;flex-shrink:0;background:var(--btn);color:var(--btn-fg)}
.ux .u152{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:12px}
.ux .u153{border:0.8px solid var(--border);border-radius:4px;padding:24px;box-sizing:border-box;overflow:hidden;position:relative;background:var(--bg)}
.ux .u154{display:flex;flex-direction:column;gap:24px}
.ux .u155{display:flex;align-items:center;gap:16px}
.ux .u156{margin:0;font-family:'DM Sans', sans-serif;font-size:0.875rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted);text-transform:uppercase}
.ux .u157{flex-grow:1;height:1px;background:var(--border)}
.ux .u158{position:absolute;left:0;right:0;top:0;display:flex;flex-direction:column}
.ux .u159{height:5.2cqw;background:#fff;display:flex;align-items:center;gap:1.6cqw;padding:0 2.4cqw;flex-shrink:0}
.ux .u160{width:8cqw;height:1.8cqw;border-radius:.5cqw;background:#2A7F7A}
.ux .u161{width:4.4cqw;height:1cqw;border-radius:.5cqw;background:rgba(0,0,0,.14)}
.ux .u162{margin-left:auto;width:6cqw;height:2.6cqw;border-radius:.7cqw;background:#2A7F7A}
.ux .u163{height:20cqw;background:#F6EFE6;position:relative;flex-shrink:0}
.ux .u164{position:absolute;left:3cqw;top:3.6cqw}
.ux .u165{width:20cqw;height:2.4cqw;border-radius:.5cqw;background:#1F5F5B}
.ux .u166{width:15cqw;height:2.4cqw;border-radius:.5cqw;background:#1F5F5B;margin-top:1cqw}
.ux .u167{width:19cqw;height:1cqw;border-radius:.5cqw;background:rgba(0,0,0,.14);margin-top:2.2cqw}
.ux .u168{width:16cqw;height:1cqw;border-radius:.5cqw;background:rgba(0,0,0,.14);margin-top:.9cqw}
.ux .u169{width:8cqw;height:2.8cqw;border-radius:.8cqw;background:#2A7F7A;margin-top:2.4cqw}
.ux .u170{position:absolute;right:3cqw;top:2.6cqw;width:21cqw;height:15cqw;border-radius:1.6cqw;background:linear-gradient(160deg,#BFE3DE,#7FC2BA);overflow:hidden}
.ux .u171{position:absolute;left:4cqw;top:3.4cqw;width:5cqw;height:5cqw;border-radius:50%;background:#F6D9B8}
.ux .u172{position:absolute;left:2.4cqw;top:8.4cqw;width:8.6cqw;height:7cqw;border-radius:4cqw 4cqw 0 0;background:#2A7F7A}
.ux .u173{position:absolute;left:12cqw;top:5.6cqw;width:4.4cqw;height:4.4cqw;border-radius:50%;background:#E9C8A4}
.ux .u174{position:absolute;left:11cqw;top:10.2cqw;width:7cqw;height:5cqw;border-radius:3.5cqw 3.5cqw 0 0;background:#F6EFE6}
.ux .u175{display:flex;gap:1.4cqw;padding:2.4cqw 3cqw;background:#fff;flex-shrink:0}
.ux .u176{flex:1;height:10cqw;border-radius:1cqw;background:#F6EFE6;padding:1.4cqw}
.ux .u177{width:3.4cqw;height:3.4cqw;border-radius:1cqw;background:#BFE3DE}
.ux .u178{width:9cqw;height:1cqw;border-radius:.5cqw;background:rgba(0,0,0,.14);margin-top:1.6cqw}
.ux .u179{height:13cqw;background:#1F5F5B;flex-shrink:0;padding:3.4cqw 3cqw}
.ux .u180{width:24cqw;height:2cqw;border-radius:.5cqw;background:#fff}
.ux .u181{width:18cqw;height:1cqw;border-radius:.5cqw;background:rgba(255,255,255,.5);margin-top:1.6cqw}
.ux .u182{width:21cqw;height:1cqw;border-radius:.5cqw;background:rgba(255,255,255,.5);margin-top:.9cqw}
.ux .u183{padding:3cqw;background:#fff;flex-shrink:0}
.ux .u184{display:flex;align-items:center;gap:1.4cqw;margin-bottom:1.8cqw}
.ux .u185{width:3cqw;height:3cqw;border-radius:50%;background:#BFE3DE}
.ux .u186{width:30cqw;height:1cqw;border-radius:.5cqw;background:rgba(0,0,0,.14)}
.ux .u187{width:24cqw;height:1cqw;border-radius:.5cqw;background:rgba(0,0,0,.14)}
.ux .u188{width:34cqw;height:1cqw;border-radius:.5cqw;background:rgba(0,0,0,.14)}
.ux .u189{height:8cqw;background:#17171a;flex-shrink:0}
.ux .u190{display:flex;flex-direction:column;gap:12px}
.ux .u191{margin:0;font-family:'Lexend', sans-serif;font-size:2.625rem;font-weight:600;line-height:1.1;letter-spacing:-0.02em;color:var(--ink)}
.ux .u192{margin:0;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted);max-width:720px}
.ux .u193{display:flex;flex-wrap:wrap;gap:12px}
.ux .u194{font-family:'DM Sans', sans-serif;font-size:0.875rem;color:var(--muted);padding:12px 16px;border-radius:6px;border:0.8px solid var(--border);white-space:nowrap;line-height:1.3}
.ux .u195{align-self:flex-start;display:flex;align-items:center;gap:8px;font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:500;color:var(--ink);padding-bottom:3px}
.ux .u196{display:flex;height:100%}
.ux .u197{width:9cqw;background:#270100;padding:2.4cqw 1.6cqw;flex-shrink:0}
.ux .u198{width:3cqw;height:3cqw;border-radius:.8cqw;background:#FFFFFC}
.ux .u199{width:5.6cqw;height:.8cqw;border-radius:.5cqw;background:rgba(255,255,252,.3);margin-top:2cqw}
.ux .u200{flex:1;padding:2.4cqw 2.6cqw;background:#FFFFFC;min-width:0}
.ux .u201{width:20cqw;height:2cqw;border-radius:.5cqw;background:#270100}
.ux .u202{display:flex;gap:1.2cqw;margin-top:2cqw}
.ux .u203{flex:1;height:6.2cqw;border-radius:1cqw;background:#F2F0ED;padding:1.2cqw}
.ux .u204{width:6cqw;height:.9cqw;border-radius:.5cqw;background:rgba(0,0,0,.2)}
.ux .u205{width:7cqw;height:2cqw;border-radius:.5cqw;background:#270100;margin-top:1cqw}
.ux .u206{display:flex;align-items:flex-end;gap:1.2cqw;height:13cqw;padding:1.6cqw 2cqw 0;border-radius:1cqw;background:#F2F0ED;margin-top:1.6cqw}
.ux .u207{flex:1;border-radius:.6cqw .6cqw 0 0;background:linear-gradient(#8A3A22, #270100);--h:6cqw}
.ux .u208{flex:1;border-radius:.6cqw .6cqw 0 0;background:linear-gradient(#8A3A22, #270100);--h:9cqw}
.ux .u209{flex:1;border-radius:.6cqw .6cqw 0 0;background:linear-gradient(#8A3A22, #270100);--h:7.5cqw}
.ux .u210{flex:1;border-radius:.6cqw .6cqw 0 0;background:linear-gradient(#8A3A22, #270100);--h:11cqw}
.ux .u211{flex:1;border-radius:.6cqw .6cqw 0 0;background:linear-gradient(#8A3A22, #270100);--h:8.5cqw}
.ux .u212{flex:1;border-radius:.6cqw .6cqw 0 0;background:linear-gradient(#8A3A22, #270100);--h:11.5cqw}
.ux .u213{flex:1;border-radius:.6cqw .6cqw 0 0;background:linear-gradient(#8A3A22, #270100);--h:10cqw}
.ux .u214{display:flex;align-items:center;gap:1.4cqw;margin-top:1.4cqw;--p0:12%;--p:88%}
.ux .u215{width:2.4cqw;height:2.8cqw;border-radius:.5cqw;background:#E4DDD9}
.ux .u216{width:13cqw;height:1cqw;border-radius:.5cqw;background:rgba(0,0,0,.14)}
.ux .u217{flex:1;height:1.1cqw;border-radius:.6cqw;background:#E4DDD9;overflow:hidden}
.ux .u218{display:flex;align-items:center;gap:1.4cqw;margin-top:1.4cqw;--p0:12%;--p:62%}
.ux .u219{display:flex;align-items:center;gap:1.4cqw;margin-top:1.4cqw;--p0:12%;--p:76%}
.ux .u220{position:absolute;right:6cqw;bottom:3cqw;width:15cqw;height:21cqw;border:1cqw solid #17171a;border-radius:2.4cqw;background:#FFFFFC;padding:1.8cqw;box-shadow:0 2cqw 4cqw rgba(30,10,5,.3)}
.ux .u221{width:7cqw;height:1.4cqw;border-radius:.5cqw;background:#270100}
.ux .u222{margin-top:1.4cqw;height:4.6cqw;border-radius:1cqw;box-shadow:0 0 0 1px #E4DDD9;padding:1cqw;--p0:10%;--p:82%}
.ux .u223{width:6cqw;height:1cqw;border-radius:.5cqw;background:rgba(0,0,0,.14)}
.ux .u224{margin-top:1cqw;height:.8cqw;border-radius:.4cqw;background:#E4DDD9;overflow:hidden}
.ux .u225{margin-top:1.4cqw;height:4.6cqw;border-radius:1cqw;box-shadow:0 0 0 1px #E4DDD9;padding:1cqw;--p0:10%;--p:54%}
.ux .u226{margin-top:1.4cqw;height:4.6cqw;border-radius:1cqw;box-shadow:0 0 0 1px #E4DDD9;padding:1cqw;--p0:10%;--p:30%}
.ux .u227{position:absolute;left:19cqw;top:7cqw;width:62cqw;height:46cqw;background:#FFFFFC;border-radius:2cqw;box-shadow:0 2.4cqw 5cqw rgba(30,10,5,.22);padding:3cqw 3.4cqw}
.ux .u228{display:flex;align-items:center;gap:2cqw;margin-bottom:1.4cqw}
.ux .u229{width:6.4cqw;height:6.4cqw;border-radius:50%;background:#270100;color:#FFFFFC;padding:1.6cqw}
.ux .u230{width:18cqw;height:1.8cqw;border-radius:.5cqw;background:#270100}
.ux .u231{width:12cqw;height:1cqw;border-radius:.5cqw;background:rgba(0,0,0,.14);margin-top:1cqw}
.ux .u232{display:flex;align-items:center;gap:1.8cqw;height:6.8cqw;border-bottom:1px solid #EEE6E1;--d:0.0s}
.ux .u233{width:3.4cqw;height:3.4cqw;border-radius:50%;background:#E4DDD9}
.ux .u234{width:18cqw;height:1.1cqw;border-radius:.5cqw;background:rgba(0,0,0,.14)}
.ux .u235{margin-left:auto;width:8.4cqw;height:3cqw;border-radius:1.5cqw;background:#E4DDD9;color:#14532D;padding:.5cqw 3cqw}
.ux .u236{display:flex;align-items:center;gap:1.8cqw;height:6.8cqw;border-bottom:1px solid #EEE6E1;--d:0.35s}
.ux .u237{width:22cqw;height:1.1cqw;border-radius:.5cqw;background:rgba(0,0,0,.14)}
.ux .u238{display:flex;align-items:center;gap:1.8cqw;height:6.8cqw;border-bottom:1px solid #EEE6E1;--d:0.7s}
.ux .u239{width:15cqw;height:1.1cqw;border-radius:.5cqw;background:rgba(0,0,0,.14)}
.ux .u240{display:flex;gap:.55cqw;margin-top:2.2cqw}
.ux .u241{--d:0.00s}
.ux .u242{--d:0.04s}
.ux .u243{--d:0.08s}
.ux .u244{--d:0.12s}
.ux .u245{--d:0.16s}
.ux .u246{--d:0.20s}
.ux .u247{--d:0.24s}
.ux .u248{--d:0.28s}
.ux .u249{--d:0.32s}
.ux .u250{--d:0.36s}
.ux .u251{--d:0.40s}
.ux .u252{--d:0.44s}
.ux .u253{--d:0.48s}
.ux .u254{--d:0.52s}
.ux .u255{--d:0.56s}
.ux .u256{--d:0.60s}
.ux .u257{--d:0.64s}
.ux .u258{--d:0.68s}
.ux .u259{--d:0.72s}
.ux .u260{--d:0.76s}
.ux .u261{--d:0.80s}
.ux .u262{--d:0.84s}
.ux .u263{--d:0.88s}
.ux .u264{--d:0.92s}
.ux .u265{--d:0.96s}
.ux .u266{--d:1.00s}
.ux .u267{--d:1.04s}
.ux .u268{--d:1.08s}
.ux .u269{--d:1.12s}
.ux .u270{--d:1.16s}
.ux .u271{position:absolute;left:6cqw;top:10cqw;width:19cqw;height:28cqw;border-radius:1cqw;background:#270100;box-shadow:0 2cqw 4cqw rgba(30,10,5,.35);overflow:hidden}
.ux .u272{position:absolute;left:-4cqw;top:-4cqw;width:14cqw;height:14cqw;border-radius:50%;background:#E9B38A}
.ux .u273{width:13cqw;height:2cqw;border-radius:.5cqw;background:#FFFFFC;position:absolute;left:2.4cqw;bottom:3.4cqw}
.ux .u274{width:9cqw;height:2cqw;border-radius:.5cqw;background:#FFFFFC;position:absolute;left:2.4cqw;bottom:6.6cqw}
.ux .u275{position:absolute;right:6cqw;top:8cqw;width:18cqw;height:26cqw;border-radius:1cqw;background:#E9B38A;box-shadow:0 2cqw 4cqw rgba(30,10,5,.3);overflow:hidden}
.ux .u276{position:absolute;right:-2cqw;top:4cqw;width:12cqw;height:12cqw;border-radius:2cqw;background:#270100;transform:rotate(18deg)}
.ux .u277{width:11cqw;height:1.8cqw;border-radius:.5cqw;background:#270100;position:absolute;left:2.2cqw;bottom:3cqw}
.ux .u278{position:absolute;left:24cqw;top:5cqw;width:52cqw;height:46cqw;border:1cqw solid #17171a;border-radius:1.6cqw;background:#1b0e0d;box-shadow:0 3cqw 5cqw rgba(30,10,5,.35);overflow:hidden}
.ux .u279{position:absolute;left:2cqw;top:2cqw;right:2cqw;height:22cqw;border-radius:1cqw;background:linear-gradient(135deg,#3A0804,#8A3A22);overflow:hidden}
.ux .u280{position:absolute;left:21cqw;top:5cqw;width:8cqw;height:8cqw;border-radius:50%;background:#E9B38A}
.ux .u281{position:absolute;left:31cqw;top:8cqw;width:6cqw;height:6cqw;border-radius:1.4cqw;border:.6cqw solid #FFFFFC}
.ux .u282{position:absolute;left:14cqw;top:15cqw;width:18cqw;height:2.4cqw;border-radius:.6cqw;background:#FFFFFC}
.ux .u283{position:absolute;left:2cqw;right:2cqw;top:26cqw;bottom:2cqw;border-radius:1cqw;background:#2E1B19;padding:1.6cqw 1.8cqw}
.ux .u284{position:relative;height:2.6cqw;margin-top:1.1cqw}
.ux .u285{position:absolute;left:2cqw;width:24cqw;height:2.6cqw;border-radius:.6cqw;background:#E9B38A}
.ux .u286{position:absolute;left:9cqw;width:28cqw;height:2.6cqw;border-radius:.6cqw;background:#8A3A22}
.ux .u287{position:absolute;left:5cqw;width:20cqw;height:2.6cqw;border-radius:.6cqw;background:#D7C8C0}
.ux .u288{position:absolute;left:20cqw;width:25cqw;height:2.6cqw;border-radius:.6cqw;background:#E9B38A}
.ux .u289{position:absolute;left:6cqw;top:0;bottom:0;width:.35cqw;background:#FF6B4A}
.ux .u290{display:flex;align-items:center;justify-content:center;gap:30px;padding:16px 0;border-bottom:0.8px solid var(--ink)}
.ux .u291{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:16px}
.ux .u292{border:0.8px solid var(--border);border-radius:8px;padding:28px;display:flex;flex-direction:column;gap:22px;box-sizing:border-box;height:100%;background:var(--bg)}
.ux .u293{display:flex;flex-direction:column;gap:10px}
.ux .u294{margin:0;font-family:'Lexend', sans-serif;font-size:1.625rem;font-weight:600;line-height:1.25;letter-spacing:normal;color:var(--ink)}
.ux .u295{margin:0;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted)}
.ux .u296{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.ux .u297{margin:0;font-family:'Lexend', sans-serif;font-size:1.75rem;font-weight:600;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u298{margin:0;font-family:'DM Sans', sans-serif;font-size:0.9375rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted)}
.ux .u299{display:flex;flex-direction:column;gap:14px;flex-grow:1}
.ux .u300{display:flex;gap:10px;align-items:flex-start}
.ux .u301{width:22px;height:22px;border-radius:50%;background:var(--btn);color:var(--btn-fg);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.ux .u302{margin:0;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--ink)}
.ux .u303{height:52px;padding:0 28px;border-radius:8px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:10px;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;white-space:nowrap;flex-shrink:0;background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink);width:100%}
.ux .u304{margin:0;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted);text-align:center}
.ux .u305{display:flex;flex-direction:column}
.ux .u306{display:flex;align-items:center;justify-content:space-between;padding:24px 0;border-bottom:0.8px solid var(--ink);position:relative}
.ux .u307{display:flex;gap:16px;align-items:flex-start;width:50%}
.ux .u308{display:flex;flex-direction:column;gap:8px}
.ux .u309{margin:0;font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:600;line-height:1.55;letter-spacing:normal;color:var(--ink)}
.ux .u310{margin:0;font-family:'DM Sans', sans-serif;font-size:0.875rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted)}
.ux .u311{width:120px;height:72px;border-radius:4px;background:var(--band);color:var(--on-band);display:flex;align-items:center;justify-content:center}
.ux .u312{margin:0;font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:600;line-height:1.55;letter-spacing:normal;color:var(--ink);text-align:right}
.ux .u313{display:flex;gap:12px;align-items:flex-start;padding-bottom:24px;min-height:calc(1680px + 45vh)}
.ux .u314{flex:1 1 0;min-width:0;margin-top:0px;position:sticky;top:112px;align-self:flex-start;display:flex;flex-direction:column;gap:12px}
.ux .u315{height:270px;border:0.8px solid var(--border);border-radius:4px;padding:25px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;gap:40px;background:var(--bg)}
.ux .u316{margin:0;font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:500;line-height:1.55;letter-spacing:normal;color:var(--muted)}
.ux .u317{display:flex;flex-direction:column;gap:14px}
.ux .u318{margin:0;font-family:'Lexend', sans-serif;font-size:1.5rem;font-weight:600;line-height:1.25;letter-spacing:normal;color:var(--ink)}
.ux .u319{height:270px;border-radius:4px;background:var(--band);color:var(--on-band);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
.ux .u320{font-family:'Lexend', sans-serif;font-size:7.5rem;font-weight:600;line-height:1;opacity:0.18}
.ux .u321{position:absolute}
.ux .u322{flex:1 1 0;min-width:0;margin-top:282px;position:sticky;top:112px;align-self:flex-start;display:flex;flex-direction:column;gap:12px}
.ux .u323{flex:1 1 0;min-width:0;margin-top:564px;position:sticky;top:112px;align-self:flex-start;display:flex;flex-direction:column;gap:12px}
.ux .u324{flex:1 1 0;min-width:0;margin-top:846px;position:sticky;top:112px;align-self:flex-start;display:flex;flex-direction:column;gap:12px}
.ux .u325{flex:1 1 0;min-width:0;margin-top:1128px;position:sticky;top:112px;align-self:flex-start;display:flex;flex-direction:column;gap:12px}
.ux .u326{height:240px;border:0.8px solid var(--border);border-radius:4px;padding:25px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;gap:40px;background:var(--bg)}
.ux .u327{height:240px;border-radius:4px;background:var(--band);color:var(--on-band);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
.ux .u328{font-family:'Lexend', sans-serif;font-size:6.875rem;font-weight:600;line-height:1;opacity:0.18}
.ux .u329{position:sticky;top:112px;background:var(--bg);border:0.8px solid var(--border);border-radius:4px;padding:40px;display:flex;gap:40px}
.ux .u330{height:296px;border-radius:4px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box;flex:1 1 0}
.ux .u331{display:flex;flex-direction:column;gap:24px;flex:2.5 1 0;min-width:0}
.ux .u332{display:flex;justify-content:space-between;align-items:center;padding-bottom:24px;border-bottom:0.8px solid var(--border)}
.ux .u333{display:flex;align-items:center;gap:10px;color:var(--ink)}
.ux .u334{color:var(--ink);flex-shrink:0;display:block}
.ux .u335{display:flex;gap:16px}
.ux .u336{display:flex;gap:32px}
.ux .u337{display:flex;flex-direction:column;gap:24px;flex:1 1 0;min-width:0}
.ux .u338{margin:0;font-family:'Lexend', sans-serif;font-size:2rem;font-weight:600;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u339{position:sticky;top:128px;background:var(--bg);border:0.8px solid var(--border);border-radius:4px;padding:40px;display:flex;gap:40px}
.ux .u340{position:sticky;top:144px;background:var(--bg);border:0.8px solid var(--border);border-radius:4px;padding:40px;display:flex;gap:40px}
.ux .u341{position:sticky;top:160px;background:var(--bg);border:0.8px solid var(--border);border-radius:4px;padding:40px;display:flex;gap:40px}
.ux .u342{display:flex;gap:64px}
.ux .u343{flex-grow:1;min-width:0}
.ux .u344{padding:24px 0;border-bottom:0.8px solid var(--line-strong)}
.ux .u345{list-style:none;cursor:pointer;display:flex;gap:12px;align-items:flex-start}
.ux .u346{width:90px;flex-shrink:0;padding-top:4px}
.ux .u347{margin:0;font-family:'DM Sans', sans-serif;font-size:1.25rem;font-weight:500;line-height:1.55;letter-spacing:normal;color:var(--muted)}
.ux .u348{flex-grow:1;font-family:'DM Sans', sans-serif;font-size:1.25rem;font-weight:600;line-height:1.35;color:var(--ink);padding-top:4px}
.ux .u349{width:40px;height:40px;border-radius:50%;background:var(--alt);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--ink)}
.ux .u350{padding:12px 52px 0 102px}
.ux .u351{padding:24px 0}
.ux .u352{display:flex;flex-direction:column;justify-content:flex-start;gap:32px;width:336px;flex-shrink:0;align-self:flex-start;position:sticky;top:120px}
.ux .u353{height:380px;border-radius:12px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box}
.ux .u354{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:55% 50%;display:block}
.ux .u355{margin:0;font-family:'Lexend', sans-serif;font-size:2rem;font-weight:600;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u356{display:flex;gap:12px}
.ux .u357{flex:2 1 0;min-width:0}
.ux .u358{background:var(--alt);border-radius:4px;padding:24px;display:flex;gap:48px}
.ux .u359{display:flex;flex-direction:column;justify-content:space-between;gap:40px;flex:1 1 0;min-width:0}
.ux .u360{display:flex;align-items:center;gap:8px}
.ux .u361{width:8px;height:8px;border-radius:50%;background:var(--ink)}
.ux .u362{margin:0;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:500;line-height:1.55;letter-spacing:normal;color:var(--muted)}
.ux .u363{align-self:flex-start;font-family:'Lexend', sans-serif;font-size:2rem;font-weight:600;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u364{display:flex;flex-direction:column;gap:32px}
.ux .u365{display:flex;gap:16px;align-items:center}
.ux .u366{width:68px;height:68px;border-radius:4px;background:var(--band);color:var(--on-band);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-family:'Lexend', sans-serif;font-size:1.5rem;font-weight:600;letter-spacing:-0.02em}
.ux .u367{align-self:flex-start;display:flex;align-items:center;gap:8px;font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:500;color:var(--ink);padding-bottom:3px}
.ux .u368{height:482px;border-radius:4px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box;flex:1.3 1 0}
.ux .u369{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block}
.ux .u370{background:var(--alt);border-radius:4px;padding:24px;display:flex;gap:48px}
.ux .u371{align-self:flex-start;font-family:'Lexend', sans-serif;font-size:1.75rem;font-weight:600;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u372{align-self:flex-start;display:flex;align-items:center;gap:8px;font-family:'DM Sans', sans-serif;font-size:1.0625rem;font-weight:500;color:var(--ink);padding-bottom:3px}
.ux .u373{height:300px;border-radius:4px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box;flex:1.3 1 0}
.ux .u374{flex:1 1 0;display:flex;flex-direction:column;gap:12px}
.ux .u375{background:var(--alt);border-radius:4px;padding:24px;display:flex;flex-direction:column;gap:20px}
.ux .u376{align-self:flex-start;font-family:'Lexend', sans-serif;font-size:1.5rem;font-weight:600;line-height:1.3;color:var(--ink)}
.ux .u377{display:flex;justify-content:center;padding:16px 0;border-bottom:0.8px solid var(--ink)}
.ux .u378{margin:0;font-family:'Lexend', sans-serif;font-size:3.75rem;font-weight:600;line-height:1.1;letter-spacing:-0.03em;color:var(--ink)}
.ux .u379{font-weight:300;font-style:italic;color:var(--muted)}
.ux .u380{display:flex;flex-direction:row;gap:80px;background:var(--alt);border-radius:8px;padding:40px}
.ux .u381{margin:0;font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted)}
.ux .u382{flex:1 1 0;min-width:0}
.ux .u383{height:65px;border-radius:6px;border:0.8px solid var(--field-line);background:var(--bg);padding:0 20px;font-family:'DM Sans', sans-serif;font-size:1rem;color:var(--ink);box-sizing:border-box;width:100%}
.ux .u384{height:140px;border-radius:6px;border:0.8px solid var(--field-line);background:var(--bg);padding:18px 20px;font-family:'DM Sans', sans-serif;font-size:1rem;color:var(--ink);box-sizing:border-box;width:100%;resize:vertical}
.ux .u385{height:16px}
.ux .u386{height:52px;border:0;border-radius:8px;background:var(--btn);color:var(--btn-fg);font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;cursor:pointer}
.ux .u387{padding:80px 40px 40px;display:flex;flex-direction:column;gap:56px;margin-top:auto;border-top:0.8px solid var(--border);overflow:hidden}
.ux .u388{width:100%;max-width:1040px;margin:0 auto;display:flex;flex-direction:column;gap:48px}
.ux .u389{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:48px}
.ux .u390{color:currentColor;flex-shrink:0;display:block}
.ux .u391{padding:20px 40px 0}
.ux .u392{padding:80px 40px 100px;background:transparent;display:flex;flex-direction:column;gap:60px;position:relative}
.ux .u393{display:flex;gap:48px}
.ux .u394{display:flex;flex-direction:column;gap:48px;flex:2.5 1 0;min-width:0}
.ux .u395{background:var(--alt);padding:8px 60px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.ux .u396{margin:0;font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--ink)}
.ux .u397{height:262px;border-radius:12px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box;flex:1 1 0}
.ux .u398{animation-delay:0.1s;padding:32px 0;border-top:0.8px solid var(--border);border-bottom:0.8px solid var(--border)}
.ux .u399{margin:0;font-family:'Lexend', sans-serif;font-size:5.375rem;font-weight:500;line-height:1.1;letter-spacing:-0.03em;color:var(--ink)}
.ux .u400{display:flex;flex-direction:column;gap:60px}
.ux .u401{position:relative}
.ux .u402{margin:0;font-family:'Lexend', sans-serif;font-size:2.25rem;font-weight:600;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u403{display:grid;grid-template-columns:1fr 1fr;gap:60px}
.ux .u404{display:flex;gap:12px}
.ux .u405{height:344px;border-radius:12px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box;flex:1 1 0}
.ux .u406{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:32px;align-content:end}
.ux .u407{height:66px;display:flex;align-items:center;font-family:'Lexend', sans-serif;font-size:3.75rem;font-weight:500;line-height:1;letter-spacing:-0.03em}
.ux .u408{width:52px;height:52px}
.ux .u409{margin:0;font-family:'DM Sans', sans-serif;font-size:1.25rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted);max-width:720px}
.ux .u410{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:12px}
.ux .u411{background:var(--alt);border-radius:4px;padding:32px;display:flex;flex-direction:column;gap:40px;height:538px;box-sizing:border-box}
.ux .u412{border:0.8px solid var(--border);border-radius:4px;background:var(--bg);height:300px;overflow:hidden;display:flex;flex-direction:column}
.ux .u413{height:30px;border-bottom:0.8px solid var(--border);display:flex;gap:6px;align-items:center;padding:0 12px}
.ux .u414{width:8px;height:8px;border-radius:50%;background:var(--border)}
.ux .u415{flex-grow:1;padding:20px;display:flex;flex-direction:column;gap:12px}
.ux .u416{height:18px;width:60%;border-radius:4px;background:var(--ink)}
.ux .u417{height:10px;width:85%;border-radius:4px;background:var(--border)}
.ux .u418{height:10px;width:70%;border-radius:4px;background:var(--border)}
.ux .u419{flex-grow:1;border-radius:4px;background:var(--band);margin-top:8px}
.ux .u420{display:flex;flex-direction:column;gap:16px;text-align:center}
.ux .u421{margin:0 auto;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted);max-width:720px}
.ux .u422{border-radius:4px;padding:32px;display:flex;gap:20px;background:var(--band);color:var(--on-band);align-items:center}
.ux .u423{margin:0;font-family:'Lexend', sans-serif;font-size:1.5rem;font-weight:600;line-height:1.25;letter-spacing:normal;color:var(--on-band)}
.ux .u424{margin:0;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:500;line-height:1.55;letter-spacing:normal;color:var(--on-band-muted)}
.ux .u425{border:0.8px solid var(--border);border-radius:4px;padding:32px;display:flex;flex-direction:column;gap:32px;height:538px;box-sizing:border-box}
.ux .u426{display:flex;flex-direction:column;gap:18px}
.ux .u427{display:flex;justify-content:space-between}
.ux .u428{margin:0;font-family:'DM Sans', sans-serif;font-size:0.9375rem;font-weight:500;line-height:1.55;letter-spacing:normal;color:var(--ink)}
.ux .u429{height:8px;border-radius:99px;background:var(--alt)}
.ux .u430{height:100%;width:100%;border-radius:99px;background:var(--ink)}
.ux .u431{height:100%;width:60%;border-radius:99px;background:var(--ink)}
.ux .u432{height:100%;width:0%;border-radius:99px;background:var(--ink)}
.ux .u433{flex:1 1 0;background:var(--alt);border-radius:4px;padding:24px;display:flex;flex-direction:column;gap:12px}
.ux .u434{margin:0;font-family:'DM Sans', sans-serif;font-size:0.9375rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted);max-width:720px}
.ux .u435{background:var(--alt);border-radius:4px;padding:32px;display:flex;flex-direction:column;justify-content:space-between;gap:32px;height:538px;box-sizing:border-box}
.ux .u436{display:flex;gap:8px}
.ux .u437{border:0.8px solid var(--border);border-radius:4px;padding:32px;display:flex;flex-direction:column;gap:16px}
.ux .u438{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:40px}
.ux .u439{display:flex;gap:16px;align-items:flex-start}
.ux .u440{display:flex;gap:40px}
.ux .u441{height:472px;border-radius:12px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box;flex:1 1 0}
.ux .u442{flex:1.2 1 0;display:flex;flex-direction:column;justify-content:space-between;gap:32px}
.ux .u443{margin:0;font-family:'Lexend', sans-serif;font-size:3rem;font-weight:600;line-height:1.1;letter-spacing:-0.02em;color:var(--ink)}
.ux .u444{margin:0;font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted);max-width:720px}
.ux .u445{padding:80px 40px 0px;background:transparent;display:flex;flex-direction:column;gap:64px;position:relative}
.ux .u446{display:flex;flex-direction:column;gap:24px;max-width:1000px}
.ux .u447{margin:0;font-family:'Lexend', sans-serif;font-size:5.375rem;font-weight:500;line-height:1.1;letter-spacing:-0.03em;color:var(--ink);animation-delay:0.08s}
.ux .u448{animation-delay:0.16s}
.ux .u449{padding:64px 40px 100px;background:transparent;display:flex;flex-direction:column;gap:64px;position:relative}
.ux .u450{display:flex;flex-direction:column;border-top:0.8px solid var(--ink)}
.ux .u451{display:flex;flex-direction:row-reverse;gap:64px;align-items:center;padding:56px 0;border-bottom:0.8px solid var(--border)}
.ux .u452{flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:24px}
.ux .u453{display:flex;flex-direction:row;gap:64px;align-items:center;padding:56px 0;border-bottom:0.8px solid var(--border)}
.ux .u454{display:flex;justify-content:space-between;align-items:flex-end;gap:24px}
.ux .u455{margin:0;font-family:'Lexend', sans-serif;font-size:3.75rem;font-weight:500;line-height:1.1;letter-spacing:-0.03em;color:var(--ink)}
.ux .u456{max-width:450px}
.ux .u457{animation-delay:0.1s;width:100%;max-width:980px;margin:0 auto}
.ux .u458{display:grid;grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);gap:60px;align-items:start}
.ux .u459{display:flex;flex-direction:column;gap:48px}
.ux .u460{display:flex;gap:12px;align-items:flex-start}
.ux .u461{margin:0;font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--ink);max-width:720px}
.ux .u462{background:var(--alt);border-radius:4px;padding:40px;display:flex;flex-direction:column;gap:16px}
.ux .u463{display:flex;gap:16px;align-items:flex-start;padding:16px 0}
.ux .u464{min-width:36px}
.ux .u465{margin:0;font-family:'Lexend', sans-serif;font-size:1.5rem;font-weight:600;line-height:1.25;letter-spacing:normal;color:var(--subtle)}
.ux .u466{display:flex;flex-direction:column;gap:6px}
.ux .u467{display:flex;gap:16px;align-items:flex-start;padding:16px 0;border-top:0.8px solid var(--border)}
.ux .u468{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));border:0.8px solid var(--border);border-radius:4px}
.ux .u469{display:flex;flex-direction:column;gap:10px;padding:24px}
.ux .u470{height:57px;display:flex;align-items:center;font-family:'Lexend', sans-serif;font-size:3.25rem;font-weight:500;line-height:1;letter-spacing:-0.03em}
.ux .u471{display:flex;flex-direction:column;gap:10px;padding:24px;border-left:0.8px solid var(--border)}
.ux .u472{--ux-to:1}
.ux .u473{height:52px;padding:0 28px;border-radius:8px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:10px;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;white-space:nowrap;flex-shrink:0;background:var(--btn);color:var(--btn-fg);width:100%}
.ux .u474{background:var(--alt);border-radius:4px;padding:32px;display:flex;flex-direction:column;gap:16px}
.ux .u475{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));border:0.8px solid var(--border);border-radius:4px}
.ux .u476{height:49px;display:flex;align-items:center;font-family:'Lexend', sans-serif;font-size:2.75rem;font-weight:500;line-height:1;letter-spacing:-0.03em}
.ux .u477{width:40px;height:40px}
.ux .u478{position:sticky;top:100px}
.ux .u479{display:flex;flex-direction:column;gap:24px}
.ux .u480{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px;border-radius:4px;background:var(--alt);color:var(--ink)}
.ux .u481{display:flex;align-items:center;gap:14px}
.ux .u482{font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:600}
.ux .u483{padding:56px 40px 100px;background:transparent;display:flex;flex-direction:column;gap:64px;position:relative}
.ux .u484{display:flex;flex-wrap:wrap;gap:24px}
.ux .u485{font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:600;color:var(--ink);padding-bottom:4px;background-size:100% 1.5px}
.ux .u486{font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:400;color:var(--muted);padding-bottom:4px}
.ux .u487{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:12px;row-gap:40px}
.ux .u488{display:flex;flex-direction:column;gap:16px;color:var(--ink)}
.ux .u489{position:relative;height:280px;border-radius:12px;overflow:hidden}
.ux .u490{height:280px;border-radius:0px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box}
.ux .u491{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.ux .u492{margin:0;font-family:'Lexend', sans-serif;font-size:2rem;font-weight:600;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u493{animation-delay:0.1s}
.ux .u494{height:640px;border-radius:12px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box}
.ux .u495{height:300px;border-radius:12px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box;flex:1 1 0}
.ux .u496{height:220px;border-radius:12px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box;flex:1 1 0}
.ux .u497{position:sticky;top:100px}
.ux .u498{background:var(--alt);border-radius:4px;padding:32px;display:flex;flex-direction:column;gap:16px}
.ux .u499{display:flex;justify-content:space-between;gap:16px;padding:16px 0}
.ux .u500{margin:0;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:600;line-height:1.55;letter-spacing:normal;color:var(--ink);text-align:right}
.ux .u501{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-top:0.8px solid var(--border)}
.ux .u502{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:12px}
.ux .u503{border:0.8px solid var(--border);border-radius:4px;padding:40px;display:flex;flex-direction:column;gap:40px;position:sticky;top:112px;background:var(--bg)}
.ux .u504{display:flex;justify-content:space-between;align-items:center;padding-bottom:32px;border-bottom:0.8px solid var(--border)}
.ux .u505{display:flex;align-items:center;gap:10px}
.ux .u506{display:flex;gap:60px}
.ux .u507{flex:1 1 0;display:flex;flex-direction:column;gap:16px}
.ux .u508{height:221px;border-radius:4px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box;flex:1.4 1 0}
.ux .u509{background:var(--alt);border-radius:4px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;gap:32px;flex:1 1 0}
.ux .u510{border:0.8px solid var(--border);border-radius:4px;padding:24px;display:flex;gap:32px;flex:2 1 0}
.ux .u511{flex:1 1 0;display:flex;flex-direction:column;gap:12px}
.ux .u512{flex:1 1 0}
.ux .u513{display:flex;gap:12px;padding:16px 0}
.ux .u514{margin:0;font-family:'Lexend', sans-serif;font-size:1.125rem;font-weight:600;line-height:1.55;letter-spacing:normal;color:var(--subtle)}
.ux .u515{margin:0;font-family:'DM Sans', sans-serif;font-size:1.125rem;font-weight:500;line-height:1.55;letter-spacing:normal;color:var(--ink)}
.ux .u516{display:flex;gap:12px;padding:16px 0;border-top:0.8px solid var(--border)}
.ux .u517{border:0.8px solid var(--border);border-radius:4px;padding:40px;display:flex;flex-direction:column;gap:40px;position:sticky;top:128px;background:var(--bg)}
.ux .u518{border:0.8px solid var(--border);border-radius:4px;padding:40px;display:flex;flex-direction:column;gap:40px;position:sticky;top:144px;background:var(--bg)}
.ux .u519{border:0.8px solid var(--border);border-radius:4px;padding:40px;display:flex;flex-direction:column;gap:40px;position:sticky;top:160px;background:var(--bg)}
.ux .u520{display:flex;flex-direction:column;justify-content:space-between;gap:32px;flex:1.3 1 0;min-width:0}
.ux .u521{align-self:flex-start;font-family:'Lexend', sans-serif;font-size:2rem;font-weight:600;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u522{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.ux .u523{height:320px;border-radius:4px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box;flex:1 1 0}
.ux .u524{margin:0;font-family:'Lexend', sans-serif;font-size:3.75rem;font-weight:500;line-height:1.1;letter-spacing:-0.03em;color:var(--ink)}
.ux .u525{display:flex;gap:24px;flex-wrap:wrap;align-items:center}
.ux .u526{height:600px;border-radius:12px;background:var(--ph);position:relative;overflow:hidden;box-sizing:border-box}
.ux .u527{display:flex;flex-direction:column;gap:48px}
.ux .u528{border-left:3px solid var(--ink);padding:8px 0 8px 24px}
.ux .u529{margin:0;font-family:'Lexend', sans-serif;font-size:1.75rem;font-weight:500;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u530{margin:0;font-family:'Lexend', sans-serif;font-size:1.5rem;font-weight:500;line-height:1.25;letter-spacing:normal;color:var(--ink)}
.ux .u531{display:flex;flex-direction:column;gap:24px}
.ux .u532{background:var(--alt);border-radius:4px;padding:24px;display:flex;flex-direction:column;gap:16px}
.ux .u533{margin:0;font-family:'DM Sans', sans-serif;font-size:0.875rem;font-weight:600;line-height:1.55;letter-spacing:0.04em;color:var(--muted);text-transform:uppercase}
.ux .u534{display:flex;flex-direction:column;gap:12px}
.ux .u535{display:flex;gap:60px}
.ux .u536{display:flex;flex-direction:column;gap:12px;flex:1 1 0;min-width:0}
.ux .u537{background:var(--alt);border-radius:4px;padding:32px;display:flex;flex-direction:column;gap:16px}
.ux .u538{display:flex;flex-direction:column;gap:14px;padding-top:8px}
.ux .u539{display:flex;gap:12px;align-items:center;color:var(--ink)}
.ux .u540{margin:0;font-family:'DM Sans', sans-serif;font-size:1rem;font-weight:500;line-height:1.55;letter-spacing:normal;color:var(--ink)}
.ux .u541{margin:0;background:var(--band);border-radius:4px;padding:32px;display:flex;flex-direction:column;gap:20px}
.ux .u542{margin:0;font-family:'DM Sans', sans-serif;font-size:1.25rem;font-weight:600;line-height:1.35;color:var(--on-band)}
.ux .u543{font-family:'DM Sans', sans-serif;font-size:0.9375rem;color:var(--on-band-muted)}
.ux .u544{display:flex;flex-direction:column;gap:20px;flex:1.4 1 0;min-width:0}
.ux .u545{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:16px}
.ux .u546{font-family:'DM Sans', sans-serif;font-size:0.875rem;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;color:var(--ink)}
.ux .u547{border-radius:6px;border:0.8px solid var(--field-line);background:var(--bg);font-family:'DM Sans', sans-serif;font-size:1rem;color:var(--ink);box-sizing:border-box;width:100%;height:56px;padding:0 20px}
.ux .u548{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ux .u549{font-family:'DM Sans', sans-serif;font-size:0.875rem;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;color:var(--ink);padding:0 0 10px}
.ux .u550{display:flex;flex-wrap:wrap;gap:8px}
.ux .u551{display:flex;align-items:center;gap:8px;padding:12px 16px;border-radius:6px;border:0.8px solid var(--field-line);font-family:'DM Sans', sans-serif;font-size:0.9375rem;color:var(--ink);cursor:pointer}
.ux .u552{accent-color:var(--ink);margin:0}
.ux .u553{border-radius:6px;border:0.8px solid var(--field-line);background:var(--bg);font-family:'DM Sans', sans-serif;font-size:1rem;color:var(--ink);box-sizing:border-box;width:100%;padding:16px 20px;resize:vertical}
.ux .u554{padding:0px 40px 100px;background:transparent;display:flex;flex-direction:column;gap:64px;position:relative}
.ux .u555{border-radius:8px;border:1.5px dashed var(--border);height:420px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--muted);font-family:'DM Sans', sans-serif;font-size:0.9375rem;text-align:center;padding:24px}
.ux .u556{animation-delay:0.2s}
.ux .u557{max-width:900px;border-top:0.8px solid var(--ink)}
.ux .u558{display:flex;flex-direction:column;gap:14px;padding:32px 0;border-bottom:0.8px solid var(--border)}
.ux .u559{margin:0;font-family:'Lexend', sans-serif;font-size:1.75rem;font-weight:600;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u560{padding:80px 40px 100px;background:transparent;display:flex;flex-direction:column;gap:64px;position:relative}
.ux .u561{display:flex;flex-direction:column;align-items:center;text-align:center;gap:28px}
.ux .u562{display:flex;align-items:center;justify-content:center;gap:24px;font-family:'Lexend', sans-serif;font-size:18.75rem;font-weight:600;line-height:0.9;letter-spacing:-0.04em;color:var(--ink)}
.ux .u563{color:var(--ink);flex-shrink:0;display:block;width:255px;height:255px}
.ux .u564{margin:0;font-family:'Lexend', sans-serif;font-size:2.75rem;font-weight:600;line-height:1.1;letter-spacing:-0.02em;color:var(--ink);animation-delay:0.1s}
.ux .u565{animation-delay:0.15s}
.ux .u566{padding:48px 40px 100px;background:transparent;display:flex;flex-direction:column;gap:64px;position:relative}
.ux .u567{padding:80px 40px 100px;background:transparent;display:flex;flex-direction:column;gap:64px;position:relative}
/* ----- tablet ----- */
@media (max-width:1099px){
.ux .u1{grid-template-columns:initial;height:80px;padding:0 24px;display:flex}
.ux .u3{width:50px;height:50px}
.ux .u5{justify-self:initial;gap:10px}
.ux .u6{padding:0 22px}
.ux .u16{padding:24px 24px 24px}
.ux .u19{gap:10px;font-size:5.75rem}
.ux .u20{min-height:520px;gap:48px}
.ux .u26{font-size:2.125rem}
.ux .u101{grid-template-columns:repeat(2, minmax(0, 1fr))}
.ux .u105{padding:8px 0}
.ux .u107{gap:16px 44px}
.ux .u108{font-size:1.375rem}
.ux .u109{padding:80px 24px 80px;gap:48px}
.ux .u110{align-items:initial;flex-direction:column;gap:32px}
.ux .u111{flex:initial;min-width:initial;padding:36px}
.ux .u112{width:400px;height:400px}
.ux .u121{gap:28px}
.ux .u124{font-size:0.9375rem}
.ux .u125{font-size:1.875rem}
.ux .u126{font-size:1.0625rem}
.ux .u128{gap:24px}
.ux .u130{height:51px;font-size:2.875rem}
.ux .u133{font-size:1rem}
.ux .u134{width:42px;height:42px}
.ux .u136{padding:80px 24px 80px;gap:48px}
.ux .u137{gap:24px}
.ux .u138{font-size:2.75rem;letter-spacing:-0.02em}
.ux .u140{grid-template-columns:repeat(1, minmax(0, 1fr))}
.ux .u141{height:280px}
.ux .u143{height:280px}
.ux .u145{align-items:initial;left:14px;right:14px;bottom:12px;padding:12px 16px;flex-direction:column;gap:4px}
.ux .u146{gap:12px}
.ux .u147{font-size:1.5rem}
.ux .u149{font-size:0.875rem}
.ux .u191{font-size:2.125rem;line-height:1.25}
.ux .u195{font-size:1.0625rem}
.ux .u290{gap:24px}
.ux .u291{grid-template-columns:repeat(2, minmax(0, 1fr))}
.ux .u307{width:initial}
.ux .u313{display:block;gap:initial;align-items:initial;padding-bottom:initial;min-height:initial}
.ux .u329{padding:32px;flex-direction:column;gap:24px}
.ux .u330{flex:initial;height:260px}
.ux .u338{font-size:1.75rem}
.ux .u339{padding:32px;flex-direction:column;gap:24px}
.ux .u340{padding:32px;flex-direction:column;gap:24px}
.ux .u341{padding:32px;flex-direction:column;gap:24px}
.ux .u342{flex-direction:column;gap:40px}
.ux .u348{font-size:1.1875rem}
.ux .u352{width:initial;flex-shrink:initial;align-self:initial;position:initial;top:initial}
.ux .u353{height:260px}
.ux .u356{flex-direction:column}
.ux .u374{flex:initial;flex-direction:initial;display:grid;grid-template-columns:repeat(2, minmax(0, 1fr))}
.ux .u378{font-size:2.75rem}
.ux .u380{flex-direction:column;gap:40px;padding:32px}
.ux .u387{padding:64px 24px 32px;gap:48px}
.ux .u388{max-width:720px;gap:40px}
.ux .u389{gap:40px}
.ux .u391{padding:16px 24px 0}
.ux .u392{padding:64px 24px 80px}
.ux .u393{flex-direction:column;gap:32px}
.ux .u395{padding:8px 32px}
.ux .u397{flex:initial}
.ux .u399{font-size:3.75rem}
.ux .u402{font-size:1.75rem}
.ux .u403{grid-template-columns:initial;display:flex;flex-direction:column;gap:40px}
.ux .u405{height:260px}
.ux .u407{height:58px;font-size:3.25rem}
.ux .u408{width:46px;height:46px}
.ux .u409{font-size:1.125rem}
.ux .u410{grid-template-columns:repeat(1, minmax(0, 1fr))}
.ux .u411{height:initial;box-sizing:initial}
.ux .u425{height:initial;box-sizing:initial}
.ux .u435{height:initial;box-sizing:initial}
.ux .u438{gap:32px}
.ux .u440{flex-direction:column;gap:24px}
.ux .u441{flex:initial;height:380px}
.ux .u443{font-size:2.5rem}
.ux .u445{padding:64px 24px 0px;gap:48px}
.ux .u447{font-size:3.75rem}
.ux .u449{padding:48px 24px 80px;gap:48px}
.ux .u451{flex-direction:column;gap:40px;padding:48px 0}
.ux .u452{gap:22px}
.ux .u453{flex-direction:column;gap:40px;padding:48px 0}
.ux .u454{justify-content:initial;align-items:initial;flex-direction:column}
.ux .u455{font-size:3rem;letter-spacing:-0.02em}
.ux .u458{grid-template-columns:initial;align-items:initial;display:flex;flex-direction:column;gap:48px}
.ux .u459{display:block;flex-direction:initial;gap:initial;margin:0;font-family:'Lexend', sans-serif;font-size:1.75rem;font-weight:600;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u478{position:initial;top:initial;display:flex;flex-direction:column;gap:24px}
.ux .u479{display:block;flex-direction:initial;gap:initial;margin:0;font-family:'Lexend', sans-serif;font-size:2rem;font-weight:600;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u483{padding:48px 24px 80px;gap:48px}
.ux .u487{grid-template-columns:repeat(2, minmax(0, 1fr))}
.ux .u489{height:240px}
.ux .u490{height:240px}
.ux .u492{font-size:1.625rem;letter-spacing:normal}
.ux .u494{height:440px}
.ux .u497{position:initial;top:initial;background:var(--alt);border-radius:4px;padding:32px;display:flex;flex-direction:column;gap:16px}
.ux .u498{background:initial;border-radius:initial;padding:initial;display:block;flex-direction:initial;gap:initial;margin:0;font-family:'Lexend', sans-serif;font-size:1.75rem;font-weight:600;line-height:1.25;letter-spacing:-0.02em;color:var(--ink)}
.ux .u502{grid-template-columns:repeat(2, minmax(0, 1fr))}
.ux .u503{padding:32px}
.ux .u506{flex-direction:column;gap:24px}
.ux .u508{flex:initial;height:240px}
.ux .u517{padding:32px}
.ux .u518{padding:32px}
.ux .u519{padding:32px}
.ux .u521{font-size:1.75rem}
.ux .u523{height:280px}
.ux .u524{font-size:3rem;letter-spacing:-0.02em}
.ux .u526{height:420px}
.ux .u527{gap:16px}
.ux .u531{background:var(--alt);border-radius:4px;padding:24px;gap:16px}
.ux .u532{background:initial;border-radius:initial;padding:initial;display:block;flex-direction:initial;gap:initial;margin:0;font-family:'DM Sans', sans-serif;font-size:0.875rem;font-weight:600;line-height:1.55;letter-spacing:0.04em;color:var(--muted);text-transform:uppercase}
.ux .u534{flex-direction:initial;gap:16px;align-items:center}
.ux .u535{flex-direction:column;gap:40px}
.ux .u554{padding:0px 24px 80px;gap:48px}
.ux .u555{height:360px}
.ux .u559{font-size:1.625rem;letter-spacing:normal}
.ux .u560{padding:64px 24px 80px;gap:48px}
.ux .u562{gap:16px;font-size:12.5rem}
.ux .u563{width:170px;height:170px}
.ux .u564{font-size:2.25rem;line-height:1.25}
.ux .u566{padding:40px 24px 80px;gap:48px}
.ux .u567{padding:64px 24px 80px;gap:48px}
}
/* ----- mobile ----- */
@media (max-width:699px){
.ux .u1{height:72px;padding:0 16px}
.ux .u3{width:44px;height:44px}
.ux .u10{top:72px;left:16px;right:16px;padding:16px}
.ux .u11{grid-template-columns:repeat(1, minmax(0, 1fr))}
.ux .u12{padding:20px}
.ux .u15{font-size:0.9375rem}
.ux .u16{padding:16px 16px 16px}
.ux .u19{gap:6px;font-size:3.375rem}
.ux .u20{min-height:560px;padding:20px;gap:32px}
.ux .u26{font-size:1.625rem}
.ux .u105{padding:0px 0}
.ux .u107{gap:16px 28px}
.ux .u108{font-size:1.25rem}
.ux .u109{padding:64px 16px 64px;gap:40px}
.ux .u111{padding:28px}
.ux .u112{width:260px;height:260px}
.ux .u121{gap:24px}
.ux .u124{font-size:0.875rem}
.ux .u125{font-size:1.625rem;letter-spacing:normal}
.ux .u126{font-size:1rem}
.ux .u128{gap:14px}
.ux .u130{height:42px;font-size:2.375rem}
.ux .u133{font-size:0.875rem}
.ux .u134{width:36px;height:36px}
.ux .u136{padding:64px 16px 64px;gap:40px}
.ux .u137{align-items:initial;justify-content:initial;padding:initial;flex-direction:column;gap:12px;padding-bottom:16px}
.ux .u138{font-size:2.125rem;line-height:1.25}
.ux .u141{height:240px}
.ux .u143{height:240px}
.ux .u145{left:12px;right:12px;padding:10px 14px}
.ux .u146{gap:10px}
.ux .u147{font-size:1.375rem}
.ux .u149{font-size:0.8125rem}
.ux .u151{font-size:0.9375rem}
.ux .u152{grid-template-columns:repeat(1, minmax(0, 1fr))}
.ux .u191{font-size:1.75rem}
.ux .u195{font-size:1rem}
.ux .u290{align-items:initial;justify-content:initial;padding:initial;flex-direction:column;gap:12px;padding-bottom:16px}
.ux .u291{grid-template-columns:repeat(1, minmax(0, 1fr))}
.ux .u292{padding:24px}
.ux .u303{font-size:0.9375rem}
.ux .u306{align-items:initial;flex-direction:column;gap:10px}
.ux .u312{text-align:initial}
.ux .u326{height:auto}
.ux .u327{height:180px}
.ux .u328{font-size:6rem}
.ux .u329{padding:20px}
.ux .u330{height:200px}
.ux .u336{flex-direction:column;gap:24px}
.ux .u338{font-size:1.5rem;letter-spacing:normal}
.ux .u339{padding:20px}
.ux .u340{padding:20px}
.ux .u341{padding:20px}
.ux .u348{font-size:1.125rem}
.ux .u350{padding:12px 52px 0 0px}
.ux .u353{height:220px}
.ux .u370{flex-direction:column-reverse;gap:24px}
.ux .u371{font-size:1.5rem}
.ux .u372{font-size:1rem}
.ux .u373{flex:initial;height:220px}
.ux .u374{grid-template-columns:repeat(1, minmax(0, 1fr))}
.ux .u378{font-size:2.125rem}
.ux .u380{padding:20px}
.ux .u387{padding:56px 16px 24px;gap:40px}
.ux .u388{max-width:358px;gap:32px}
.ux .u389{grid-template-columns:repeat(1, minmax(0, 1fr));gap:32px}
.ux .u391{padding:12px 16px 0}
.ux .u392{padding:40px 16px 64px}
.ux .u395{padding:8px 16px}
.ux .u399{font-size:2.75rem;letter-spacing:-0.02em}
.ux .u402{font-size:1.375rem;letter-spacing:normal}
.ux .u405{height:200px}
.ux .u407{height:50px;font-size:2.75rem}
.ux .u408{width:38px;height:38px}
.ux .u409{font-size:1.0625rem}
.ux .u438{grid-template-columns:repeat(1, minmax(0, 1fr));gap:28px}
.ux .u441{height:320px}
.ux .u443{font-size:2.125rem;line-height:1.25}
.ux .u445{padding:40px 16px 0px;gap:40px}
.ux .u447{font-size:2.75rem;letter-spacing:-0.02em}
.ux .u449{padding:40px 16px 64px;gap:40px}
.ux .u451{gap:28px;padding:32px 0}
.ux .u452{gap:20px}
.ux .u453{gap:28px;padding:32px 0}
.ux .u455{font-size:2.375rem;line-height:1.25}
.ux .u459{font-size:1.5rem;letter-spacing:normal}
.ux .u474{padding:20px}
.ux .u475{grid-template-columns:repeat(1, minmax(0, 1fr))}
.ux .u476{height:41px;font-size:2.25rem}
.ux .u477{width:34px;height:34px}
.ux .u483{padding:40px 16px 64px;gap:40px}
.ux .u487{grid-template-columns:repeat(1, minmax(0, 1fr))}
.ux .u489{height:220px}
.ux .u490{height:220px}
.ux .u492{font-size:1.5rem}
.ux .u494{height:240px}
.ux .u496{height:160px}
.ux .u502{grid-template-columns:repeat(1, minmax(0, 1fr))}
.ux .u503{padding:20px}
.ux .u508{height:200px}
.ux .u510{flex-direction:column;gap:20px}
.ux .u517{padding:20px}
.ux .u518{padding:20px}
.ux .u519{padding:20px}
.ux .u521{font-size:1.5rem}
.ux .u523{flex:initial;height:200px}
.ux .u524{font-size:2.25rem;line-height:1.25}
.ux .u526{height:240px}
.ux .u530{font-size:1.375rem}
.ux .u545{grid-template-columns:repeat(1, minmax(0, 1fr))}
.ux .u554{padding:0px 16px 64px;gap:40px}
.ux .u555{height:300px}
.ux .u559{font-size:1.5rem}
.ux .u560{padding:48px 16px 64px;gap:40px}
.ux .u562{gap:10px;font-size:7.5rem}
.ux .u563{width:102px;height:102px}
.ux .u564{font-size:1.75rem}
.ux .u566{padding:32px 16px 64px;gap:40px}
.ux .u567{padding:40px 16px 64px;gap:40px}
}
/* =====================================================================
   Polish layer: press feedback, icon swaps, menu, entrances, text
   ===================================================================== */
.ux{--ease-out:cubic-bezier(.23,1,.32,1);--ease-icon:cubic-bezier(.2,0,0,1)}
html{-webkit-text-size-adjust:100%}
.ux{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.ux a,.ux button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.ux h1,.ux h2,.ux h3{text-wrap:balance}
.ux p{text-wrap:pretty}
.ux-count,.ux-count::before{font-variant-numeric:tabular-nums}

/* ---------- press feedback: every button gives a small squeeze ---------- */
.ux .ux-btn{transition:background-color .2s ease,box-shadow .2s ease,scale .16s var(--ease-out)}
.ux .ux-iconbtn{transition:background-color .2s ease,scale .16s var(--ease-out)}
.ux .ux-tab{transition:background-color .2s ease,color .2s ease,scale .16s var(--ease-out)}
.ux .ux-soc,.ux .ux-tile{transition:transform .25s ease,background-color .25s ease,scale .16s var(--ease-out)}
.ux .ux-btn:active,.ux .ux-iconbtn:active,.ux .ux-tab:active,.ux .ux-soc:active{scale:.96}

/* ---------- icon swaps (theme sun/moon, menu open/close): fade, grow and un-blur ---------- */
.ux .ux-iconbtn{position:relative}
.ux .ux-iconbtn [data-if]{display:contents}
.ux .ux-iconbtn [data-if] svg{position:absolute;opacity:0;scale:.25;filter:blur(4px);
  transition:opacity .2s var(--ease-icon),scale .2s var(--ease-icon),filter .2s var(--ease-icon)}
.ux[data-theme="dark"] [data-if="isDark"] svg,.ux:not([data-theme="dark"]) [data-if="isLight"] svg,
.ux[data-menu="open"] [data-if="menuOpen"] svg,.ux:not([data-menu="open"]) [data-if="menuClosed"] svg{opacity:1;scale:1;filter:blur(0)}

/* ---------- menu: eases in, leaves faster and softer, groups arrive one after another ---------- */
header+[data-if]{display:contents}
.ux .ux-menu{animation:none;transform-origin:top center;
  transition:opacity .15s ease-out,transform .15s ease-out,visibility 0s .15s}
.ux:not([data-menu="open"]) .ux-menu{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-8px) scale(.98)}
.ux[data-menu="open"] .ux-menu{opacity:1;visibility:visible;transform:none;
  transition:opacity .22s var(--ease-out),transform .22s var(--ease-out),visibility 0s}
.ux .ux-menu>div>div,.ux .ux-menu>a{transition:opacity .12s ease-out,transform .12s ease-out}
.ux:not([data-menu="open"]) .ux-menu>div>div,.ux:not([data-menu="open"]) .ux-menu>a{opacity:0;transform:translateY(-6px)}
.ux[data-menu="open"] .ux-menu>div>div,.ux[data-menu="open"] .ux-menu>a{opacity:1;transform:none;transition:opacity .28s var(--ease-out),transform .28s var(--ease-out)}
.ux[data-menu="open"] .ux-menu>div>div:nth-child(1){transition-delay:50ms}
.ux[data-menu="open"] .ux-menu>div>div:nth-child(2){transition-delay:100ms}
.ux[data-menu="open"] .ux-menu>div>div:nth-child(3){transition-delay:150ms}
.ux[data-menu="open"] .ux-menu>a{transition-delay:200ms}

/* page chrome does not replay its entrance on every page */
.ux header.ux-drop{animation:none}

/* ---------- entrances: rise, un-blur, and stagger when several arrive together (see js/site.js) ---------- */
.ux[data-ux-scroll] .ux-reveal{opacity:0;transform:translateY(16px);filter:blur(4px);
  transition:opacity .7s var(--ease-out),transform .7s var(--ease-out),filter .7s var(--ease-out)}
.ux[data-ux-scroll] .ux-reveal.ux-in{opacity:1;transform:none;filter:none}

/* ---------- theme switch: nothing smears while every colour changes at once ---------- */
.ux.ux-no-tr *:not(svg),.ux.ux-no-tr *:not(svg)::before,.ux.ux-no-tr *:not(svg)::after{transition:none!important}

/* ---------- images: a neutral 1px edge for depth (no photos yet, ready for when they arrive) ---------- */
.ux img{outline:1px solid oklch(0 0 0/.1);outline-offset:-1px}
.ux[data-theme="dark"] img{outline-color:oklch(1 0 0/.1)}

/* ---------- hover extras (mouse only) ---------- */
.ux .ux-card{transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s ease}
@media (hover:hover) and (pointer:fine){
  .ux .ux-card:hover{box-shadow:0 20px 40px -20px oklch(0 0 0/.28)}
}

/* ---------- FAQ: the answer opens and closes with a short slide ---------- */
.ux .ux-faq[open] .ux-faq-a{animation:ux-fade .3s var(--ease-out) both}
.ux .ux-faq summary{cursor:pointer}

/* ---------- soft crossfade between pages, smooth "back to top" ---------- */
@media (prefers-reduced-motion:no-preference){
  html{scroll-behavior:smooth}
  @view-transition{navigation:auto}
  ::view-transition-old(root),::view-transition-new(root){animation-duration:.18s;animation-timing-function:cubic-bezier(.23,1,.32,1)}
}

/* ---------- reduced motion: keep fades and colour, drop movement ---------- */
@media (prefers-reduced-motion:reduce){
  .ux .ux-btn:active,.ux .ux-iconbtn:active,.ux .ux-tab:active,.ux .ux-soc:active{scale:1}
  .ux .ux-iconbtn [data-if] svg{scale:1;filter:none}
  .ux[data-ux-scroll] .ux-reveal{filter:none}
}


/* =====================================================================
   Apple pass: springs, materials, spatial consistency, wayfinding
   ===================================================================== */
.ux{--spring:linear(0, 0.034, 0.114, 0.214, 0.319, 0.421, 0.514, 0.597, 0.669, 0.73, 0.781, 0.824, 0.859, 0.887, 0.91, 0.929, 0.944, 0.956, 0.965, 0.973, 0.979, 0.983, 0.987, 0.99, 0.992, 0.994, 0.995, 0.996, 0.997, 0.998, 0.998, 0.999, 1);--spring-dur:0.59s;
  --scrim:rgba(39,1,0,.24);--glass:color-mix(in srgb,var(--bg) 72%,transparent)}
.ux[data-theme="dark"]{--scrim:rgba(0,0,0,.5)}
html{scroll-padding-top:96px}
.ux{font-optical-sizing:auto}

/* ---------- header: a translucent material, content scrolls beneath it ---------- */
.ux header.ux-drop{position:sticky;top:0;z-index:40;background:var(--bg);
  transition:box-shadow .2s ease-out,background-color .3s ease}
@supports (backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px)){
  .ux header.ux-drop{background:var(--glass);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%)}
}
/* a hairline appears only once content actually slides under the header (no permanent divider) */
.ux.is-stuck header.ux-drop{box-shadow:0 1px 0 var(--border)}

/* ---------- menu: a floating layer that grows out of the button that opened it ---------- */
.ux .ux-menu{position:fixed;transform-origin:calc(100% - 26px) -44px;
  max-height:calc(100vh - 110px);max-height:calc(100dvh - 110px);overflow-y:auto;overscroll-behavior:contain;background:var(--bg)}
@supports (backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px)){
  .ux .ux-menu{background:color-mix(in srgb,var(--bg) 86%,transparent);-webkit-backdrop-filter:blur(28px) saturate(180%);backdrop-filter:blur(28px) saturate(180%)}
}
.ux:not([data-menu="open"]) .ux-menu{transform:scale(.96);filter:blur(4px)}
.ux[data-menu="open"] .ux-menu{filter:blur(0)}
.ux .ux-menu{transition:opacity .15s ease-out,transform .15s ease-out,filter .15s ease-out,visibility 0s .15s}
.ux[data-menu="open"] .ux-menu{transition:opacity .22s var(--ease-out),transform .22s var(--ease-out),filter .22s var(--ease-out),visibility 0s}
/* the page behind is dimmed so the menu reads as the one thing to act on */
.ux::after{content:"";position:fixed;inset:0;z-index:25;background:var(--scrim);opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .15s ease-out,visibility 0s .15s}
.ux[data-menu="open"]::after{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .22s ease-out,visibility 0s}

/* ---------- where am I? the current page is marked in the menu and footer ---------- */
.ux a[aria-current="page"]{color:var(--ink)}
.ux .ux-link[aria-current="page"]{background-size:100% 1.5px}

/* ---------- springs: press responds instantly, release settles like a physical thing ---------- */
@supports (transition-timing-function:linear(0,1)){
  .ux .ux-btn{transition:background-color .2s ease,box-shadow .2s ease,scale var(--spring-dur) var(--spring)}
  .ux .ux-iconbtn{transition:background-color .2s ease,scale var(--spring-dur) var(--spring)}
  .ux .ux-tab{transition:background-color .2s ease,color .2s ease,scale var(--spring-dur) var(--spring)}
  .ux .ux-soc,.ux .ux-tile{transition:transform .25s ease,background-color .25s ease,scale var(--spring-dur) var(--spring)}
  .ux .ux-btn:active,.ux .ux-iconbtn:active,.ux .ux-tab:active,.ux .ux-soc:active{transition-duration:.2s,.1s;transition-timing-function:ease,ease-out}
  .ux .ux-card{transition:transform var(--spring-dur) var(--spring),box-shadow .3s ease}
  .ux[data-ux-scroll] .ux-reveal{transition:opacity .5s ease-out,transform var(--spring-dur) var(--spring),filter .5s ease-out}
  .ux[data-menu="open"] .ux-menu{transition:opacity .22s var(--ease-out),transform var(--spring-dur) var(--spring),filter .22s var(--ease-out),visibility 0s}
}
.ux .ux-hscroll{overscroll-behavior-x:contain}

/* ---------- theme switch: a gentle whole-page crossfade, no abrupt brightness jump ---------- */
html.ux-theme-vt::view-transition-old(root),html.ux-theme-vt::view-transition-new(root){animation-duration:.28s;animation-timing-function:ease}

/* ---------- accessibility: less transparency, more contrast, on request ---------- */
@media (prefers-reduced-transparency:reduce){
  .ux header.ux-drop{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none}
  .ux .ux-menu{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none;filter:none!important}
}
@media (prefers-contrast:more){
  .ux header.ux-drop{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 1px 0 var(--ink)}
  .ux .ux-menu{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none;border-color:var(--ink)}
}
@media (prefers-reduced-motion:reduce){
  .ux:not([data-menu="open"]) .ux-menu{transform:none;filter:none}
}


/* =====================================================================
   Floating back-to-top: stays on screen once you have scrolled
   ===================================================================== */
.ux .ux-top{position:fixed;right:24px;bottom:24px;bottom:calc(24px + env(safe-area-inset-bottom));z-index:35;width:52px;height:52px;border:0;border-radius:10px;
  background:var(--btn);color:var(--btn-fg);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;
  box-shadow:0 10px 30px -8px rgba(0,0,0,.35);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(10px) scale(.9);
  transition:opacity .18s ease-out,transform .18s ease-out,visibility 0s .18s,scale .16s var(--ease-out),background-color .2s ease}
.ux .ux-top.is-visible{opacity:1;visibility:visible;pointer-events:auto;transform:none;transition:opacity .22s var(--ease-out),transform .3s var(--ease-out),visibility 0s,scale .16s var(--ease-out),background-color .2s ease}
.ux .ux-top:active{scale:.96}
.ux .ux-top svg{width:22px;height:22px}
@media (hover:hover) and (pointer:fine){.ux .ux-top:hover{background:var(--btn-hover)}}
@media (max-width:699px){.ux .ux-top{right:16px;bottom:16px;bottom:calc(16px + env(safe-area-inset-bottom));width:48px;height:48px}}
@media (prefers-reduced-motion:reduce){.ux .ux-top{transform:none}}


/* =====================================================================
   Service drawings: little animated scenes that play on hover
   ===================================================================== */
.ux{--art-bg:linear-gradient(135deg,#F2F0ED 0%,#DDD3CD 100%)}
.ux[data-theme="dark"]{--art-bg:linear-gradient(135deg,#3A2422 0%,#241311 100%)}
.ux .ua{container-type:inline-size;position:relative;overflow:hidden;border-radius:12px;aspect-ratio:16/10;background:var(--art-bg);isolation:isolate;width:100%}
.ux .ua *{box-sizing:border-box}
.ux .ua-lap{position:absolute;left:15cqw;top:7cqw;width:70cqw;filter:drop-shadow(0 3cqw 4cqw rgba(30,10,5,.28))}
.ux .ua-scr{position:relative;height:41cqw;background:#FFFFFC;border:1.1cqw solid #17171a;border-bottom-width:1.5cqw;border-radius:2cqw 2cqw .5cqw .5cqw;overflow:hidden}
.ux .ua-base{height:1.8cqw;margin:0 -4.5cqw;border-radius:0 0 3cqw 3cqw;background:linear-gradient(#d9d9dd,#a9a9b0)}
/* websites: the page scrolls past */
.ux .ua-page{transition:transform 3.6s cubic-bezier(.45,0,.2,1)}
.ux .is-play .ua-page{transform:translateY(-34cqw)}
/* custom software: bars grow, progress fills, the tablet lifts */
.ux .ua-bar{height:calc(var(--h) * .4);transition:height .9s cubic-bezier(.23,1,.32,1)}
.ua-bar:nth-child(2){transition-delay:0.06s}.ua-bar:nth-child(3){transition-delay:0.12s}.ua-bar:nth-child(4){transition-delay:0.18s}.ua-bar:nth-child(5){transition-delay:0.24s}.ua-bar:nth-child(6){transition-delay:0.30s}.ua-bar:nth-child(7){transition-delay:0.36s}
.ux .is-play .ua-bar{height:var(--h)}
.ux .ua-fill{display:block;height:100%;border-radius:.6cqw;background:#270100;width:var(--p0);transition:width 1.4s cubic-bezier(.23,1,.32,1) .2s}
.ux .is-play .ua-fill{width:var(--p)}
.ux .ua-tab{transition:transform .9s cubic-bezier(.23,1,.32,1)}
.ux .is-play .ua-tab{transform:translateY(-2cqw)}
/* managed services: checks tick through, the uptime strip fills, the shield grows */
.ux .ua-pill{transition:background-color .4s ease var(--d,0s)}
.ux .ua-pill svg{opacity:0;transform:scale(.4);transition:opacity .3s ease var(--d,0s),transform .4s cubic-bezier(.23,1,.32,1) var(--d,0s)}
.ux .is-play .ua-pill{background:#CFE8D5}
.ux .is-play .ua-pill svg{opacity:1;transform:none}
.ux .ua-up{display:block;width:1.2cqw;height:3.4cqw;border-radius:.4cqw;background:#CFE8D5;opacity:.25;transition:opacity .3s ease var(--d,0s)}
.ux .is-play .ua-up{opacity:1}
.ux .ua-shield{transition:transform .6s cubic-bezier(.23,1,.32,1)}
.ux .is-play .ua-shield{transform:scale(1.12)}
/* motion graphics: the playhead runs, shapes move, posters tilt */
.ux .ua-head{transition:left 3s linear}
.ux .is-play .ua-head{left:42cqw}
.ux .ua-s1{transition:transform 2.4s cubic-bezier(.45,0,.2,1)}
.ux .is-play .ua-s1{transform:translateX(8cqw)}
.ux .ua-s2{transition:transform 2.4s cubic-bezier(.45,0,.2,1)}
.ux .is-play .ua-s2{transform:translate(-3cqw,2cqw) rotate(140deg)}
.ux .ua-s3{transition:width 2.4s cubic-bezier(.45,0,.2,1)}
.ux .is-play .ua-s3{width:26cqw}
.ux .ua-pl{transform:rotate(-7deg);transition:transform 1.2s cubic-bezier(.23,1,.32,1)}
.ux .is-play .ua-pl{transform:rotate(-3deg) translateY(-1.4cqw)}
.ux .ua-pr{transform:rotate(6deg);transition:transform 1.2s cubic-bezier(.23,1,.32,1)}
.ux .is-play .ua-pr{transform:rotate(2deg) translateY(1.4cqw)}
@media (prefers-reduced-motion:reduce){.ux .is-play .ua-page{transform:none}}


/* =====================================================================
   Header navigation: the main pages are visible, the rest sit under More
   ===================================================================== */
.ux .ux-nav{display:flex;align-items:center;gap:4px}
.ux .ux-nl{height:44px;padding:0 16px;border:0;border-radius:8px;background:transparent;color:var(--ink);display:flex;align-items:center;gap:6px;
  font-family:'DM Sans',sans-serif;font-size:16px;font-weight:500;cursor:pointer;transition:background-color .2s ease,scale .16s var(--ease-out)}
.ux .ux-nl:active{scale:.96}
.ux .ux-nl svg{transition:transform .2s var(--ease-out)}
.ux .ux-nl[aria-current="page"]{font-weight:600;background:var(--alt)}
.ux .ux-more{position:relative}
.ux .ux-more.is-open .ux-nl svg{transform:rotate(180deg)}
.ux .ux-mm{position:absolute;top:100%;left:50%;margin-top:10px;z-index:50;display:flex;gap:8px;padding:18px;border-radius:12px;background:var(--bg);
  border:.8px solid var(--border);box-shadow:0 20px 50px -12px rgba(39,1,0,.25);transform-origin:top center;
  transform:translateX(-50%) translateY(-6px) scale(.98);opacity:0;visibility:hidden;transition:opacity .15s ease-out,transform .15s ease-out,visibility 0s .15s}
.ux .ux-mm::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.ux .ux-more.is-open .ux-mm,.ux .ux-more:focus-within .ux-mm{opacity:1;visibility:visible;transform:translateX(-50%);transition:opacity .2s var(--ease-out),transform .25s var(--ease-out),visibility 0s}
.ux .ux-mg{display:flex;flex-direction:column;gap:8px;min-width:170px;padding:6px 14px}
.ux .ux-mgt{font-family:'Lexend',sans-serif;font-weight:600;font-size:15px;color:var(--ink);margin-bottom:4px}
.ux .ux-mgl{align-self:flex-start;font-family:'DM Sans',sans-serif;font-size:16px;color:var(--muted);padding:4px 0}
.ux .ux-mgl[aria-current="page"]{color:var(--ink)}
@media (hover:hover) and (pointer:fine){
  .ux .ux-nl:hover{background:var(--alt)}
  .ux .ux-more:hover .ux-nl svg{transform:rotate(180deg)}
  .ux .ux-more:hover .ux-mm{opacity:1;visibility:visible;transform:translateX(-50%);transition:opacity .2s var(--ease-out),transform .25s var(--ease-out),visibility 0s}
}

/* =====================================================================
   Scroll progress: how far you have read and how far is left
   ===================================================================== */
.ux .ux-progress{position:fixed;left:16px;top:50%;transform:translateY(-50%);z-index:34;display:flex;flex-direction:column;align-items:center;gap:10px;
  opacity:0;pointer-events:none;transition:opacity .25s ease}
.ux .ux-progress.is-on{opacity:1}
.ux .ux-pg-track{display:block;width:4px;height:45vh;min-height:225px;max-height:480px;border-radius:2px;background:var(--border);overflow:hidden}
.ux .ux-pg-fill{display:block;width:100%;height:100%;border-radius:2px;background:var(--ink);transform-origin:top center;transform:scaleY(0)}
@media (max-width:699px){.ux .ux-progress{left:6px}.ux .ux-pg-track{width:3px;height:33vh;min-height:165px}}

/* =====================================================================
   FAQ: a smoother slide (the answer moves, the question row stays put)
   ===================================================================== */
.ux .ux-faq-a{box-sizing:border-box}
.ux .ux-faq[open] .ux-faq-a{animation:none}
.ux .ux-faq-i{transition:transform .4s cubic-bezier(.32,.72,0,1),background-color .3s ease,color .3s ease}
.ux .ux-faq.is-closing[open] .ux-faq-i{transform:none;background:var(--alt)!important;color:var(--ink)!important}


/* =====================================================================
   About logo panel: the little items follow the pointer, and grow and tilt when touched
   ===================================================================== */
.ux .ux-abt svg g.ux-float{transform-box:fill-box;transform-origin:center;cursor:pointer;
  transition:scale .35s cubic-bezier(.23,1,.32,1),rotate .35s cubic-bezier(.23,1,.32,1),translate .3s ease-out}
.ux .ux-abt svg g.ux-float *{pointer-events:all}
.ux .ux-abt svg g.ux-float:nth-of-type(odd){translate:calc(var(--mx,0) * 16px) calc(var(--my,0) * 11px)}
.ux .ux-abt svg g.ux-float:nth-of-type(even){translate:calc(var(--mx,0) * -11px) calc(var(--my,0) * -16px)}
.ux .ux-abt svg g.ux-float:hover{scale:1.32;rotate:9deg}
.ux .ux-abt svg g.ux-float:active{scale:1.18}


/* =====================================================================
   Round 7
   ===================================================================== */
/* More menu: centred on the screen (positioned from the header, not from the button) */
.ux .ux-nav,.ux .ux-more{position:static}
.ux header.ux-drop{position:sticky}
.ux .ux-mm{left:50%;top:100%;margin-top:0}
.ux .ux-mm::before{top:-14px;height:14px}
.ux .ux-more::after{content:"";position:absolute;left:0;right:0;top:100%;height:10px}
.ux .ux-more{position:relative}
.ux .ux-more .ux-mm{position:fixed;left:50%;top:var(--ux-hdr,88px)}

/* Breadcrumbs: small, grey, quiet */
.ux .ux-crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-family:'DM Sans',sans-serif;font-size:.8125rem;line-height:1.4;color:var(--subtle)}
.ux .ux-crumbs li{display:flex;align-items:center;gap:6px;opacity:.85}
.ux .ux-crumbs li+li::before{content:"/";opacity:.6}
.ux .ux-crumbs a{color:var(--subtle);text-decoration:none;transition:color .2s ease}
.ux .ux-crumbs li[aria-current]{color:var(--muted);opacity:.9}
@media (hover:hover) and (pointer:fine){.ux .ux-crumbs a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}}

/* Footer: the big Utilox spans end to end and fades into the background */
.ux footer{position:relative}
.ux .ux-fbig{display:flex;align-items:center;justify-content:center;gap:.06em;width:100%;margin:0;font-family:'Lexend',sans-serif;font-weight:700;line-height:.9;letter-spacing:-.04em;
  font-size:26vw;color:var(--ink);opacity:.1;margin-bottom:-.06em;-webkit-mask-image:linear-gradient(to bottom,#000 25%,transparent 96%);mask-image:linear-gradient(to bottom,#000 25%,transparent 96%);user-select:none;pointer-events:none;white-space:nowrap}
.ux .ux-fbig svg{height:.78em;width:auto;flex-shrink:0}
.ux .ux-fbig span{display:block}

/* Pricing: one row per service, prices in US dollars */
.ux .pz-note{display:flex;align-items:center;gap:10px;margin:0 0 20px;font-family:'DM Sans',sans-serif;font-size:1rem;line-height:1.5;color:var(--muted)}
.ux .pz-note svg{flex-shrink:0;color:var(--ink)}
.ux .pz-wrap{border:0.8px solid var(--border);border-radius:12px;overflow:hidden;background:var(--bg)}
.ux .pz-row{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,0.9fr) minmax(0,1.1fr) auto;gap:32px;align-items:center;padding:36px 40px;background:var(--bg);transition-property:background-color;transition-duration:.2s;transition-timing-function:ease}
.ux .pz-row+.pz-row{border-top:0.8px solid var(--border)}
.ux .pz-row:hover{background:var(--alt)}
.ux .pz-main{display:flex;flex-direction:column;gap:10px}
.ux .pz-num{font-family:'DM Sans',sans-serif;font-size:0.875rem;font-weight:500;letter-spacing:0.04em;color:var(--subtle);font-variant-numeric:tabular-nums}
.ux .pz-name{margin:0;font-family:'Lexend',sans-serif;font-size:1.75rem;font-weight:600;line-height:1.2;letter-spacing:-0.02em;color:var(--ink);text-wrap:balance}
.ux .pz-desc{margin:0;max-width:36ch;font-family:'DM Sans',sans-serif;font-size:1rem;line-height:1.55;color:var(--muted);text-wrap:pretty}
.ux .pz-price{display:flex;flex-direction:column;gap:4px}
.ux .pz-from{font-family:'DM Sans',sans-serif;font-size:0.875rem;font-weight:500;line-height:1.4;color:var(--muted)}
.ux .pz-amt{font-family:'Lexend',sans-serif;font-size:2.25rem;font-weight:600;line-height:1.1;letter-spacing:-0.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.ux .pz-unit{font-family:'DM Sans',sans-serif;font-size:0.9375rem;line-height:1.45;color:var(--muted)}
.ux .pz-row .u299{gap:12px;flex-grow:0}
@media (max-width:1099px){
  .ux .pz-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 32px;padding:32px}
  .ux .pz-list{grid-column:1/2}
  .ux .pz-cta{grid-column:2/3;justify-self:start;align-self:end}
}
@media (max-width:699px){
  .ux .pz-row{grid-template-columns:minmax(0,1fr);gap:20px;padding:24px 20px}
  .ux .pz-list,.ux .pz-cta{grid-column:auto}
  .ux .pz-cta{justify-self:stretch;width:100%}
  .ux .pz-amt{font-size:2rem}
}
