body{margin:0;background:#2A0C15}
html{scroll-behavior:smooth}
a{color:#913246}
a:hover{color:#5C1A2C}

.sv *{box-sizing:border-box}
.sv{font-family:'IBM Plex Sans Arabic','Segoe UI',Tahoma,sans-serif;color:#4D4749;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.sv{--ar:1}
.sv[dir="rtl"]{--ar:1.12}
.sv .disp{font-family:'Alexandria','Segoe UI',Tahoma,sans-serif}
.sv h1,.sv h2,.sv h3{text-wrap:balance}
.sv a.skip{position:absolute;inset-inline-start:12px;top:-80px;z-index:90;padding:12px 18px;border-radius:8px;background:#C9A24B;color:#2A0C15;font-weight:600;text-decoration:none;transition:top .2s}
.sv a.skip:focus{top:12px}
.sv[dir="ltr"] .disp{letter-spacing:-0.025em}
.sv :focus-visible{outline:2px solid #913246;outline-offset:3px}
.sv header :focus-visible,.sv #process :focus-visible,.sv #contact :focus-visible,.sv .dark :focus-visible,.sv .bar :focus-visible{outline-color:#C9A24B}
.sv .bar :focus-visible{outline-offset:-3px}
.sv ::selection{background:#913246;color:#FFFFFF}
.sv section{scroll-margin-top:72px}

/* navigation */
.sv a.brand{color:#F6F1F2;text-decoration:none;font-weight:800;font-size:24px;line-height:44px}
.sv .nav-links{display:flex;gap:clamp(18px,2.4vw,36px)}
.sv a.navlink{color:#F6F1F2;text-decoration:none;font-size:calc(15px * var(--ar));line-height:44px;background-image:linear-gradient(#C9A24B,#C9A24B);background-repeat:no-repeat;background-size:0% 2px;background-position:0 82%;transition:background-size .35s cubic-bezier(.2,.8,.2,1)}
.sv[dir="rtl"] a.navlink{background-position:100% 82%}
.sv a.navlink:hover{color:#F6F1F2;background-size:100% 2px}
.sv .lang-btn{min-height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(246,241,242,.35);background:transparent;color:#F6F1F2;font:inherit;font-size:15px;cursor:pointer;transition:background .25s,border-color .25s}
.sv .lang-btn:hover{background:rgba(246,241,242,.1);border-color:rgba(246,241,242,.7)}
.sv .lang-btn.lang-sm{padding:0 14px;font-size:14px}

/* floating bar that appears after the hero */
.sv .bar{position:fixed;top:12px;left:12px;right:12px;z-index:50;margin:0 auto;max-width:1040px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:8px;padding-inline:24px 8px;border-radius:999px;background:rgba(42,12,21,.88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(232,180,190,.22);overflow:hidden;transform:translateY(-170%);visibility:hidden;transition:transform .6s cubic-bezier(.2,.8,.2,1),visibility 0s .6s}
.sv .bar.show{transform:none;visibility:visible;transition:transform .6s cubic-bezier(.2,.8,.2,1),visibility 0s}
.sv .bar-prog{position:absolute;left:0;right:0;bottom:0;height:2px;background:#C9A24B;transform:scaleX(0);transform-origin:left center}
.sv[dir="rtl"] .bar-prog{transform-origin:right center}

/* primary action, pulled slightly toward the cursor */
.sv a.cta,.sv button.cta{white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 30px;border-radius:999px;background:#C9A24B;color:#2A0C15;font-weight:600;font-size:calc(16px * var(--ar));text-decoration:none;transform:translate(var(--mx,0px),var(--my,0px));transition:transform .35s cubic-bezier(.2,.8,.2,1),background .3s,box-shadow .3s}
.sv a.cta:hover,.sv button.cta:hover{background:#F6F1F2;color:#2A0C15;box-shadow:0 10px 30px rgba(201,162,75,.28)}
.sv a.cta:active,.sv button.cta:active{transform:translate(var(--mx,0px),var(--my,0px)) scale(.97)}
.sv a.cta.cta-sm{min-height:44px;padding:0 22px;font-size:calc(15px * var(--ar))}

/* hero entrance */
@keyframes sv-fade{from{opacity:0}to{opacity:1} }
@keyframes sv-rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none} }
@keyframes sv-word{from{opacity:0;transform:translateY(.55em);filter:blur(10px)}to{opacity:1;transform:none;filter:blur(0)} }
.sv .in0{animation:sv-fade 1.2s .15s both}
.sv .in2{animation:sv-rise 1s 1.75s cubic-bezier(.2,.8,.2,1) both}
.sv .in3{animation:sv-rise 1s 1.95s cubic-bezier(.2,.8,.2,1) both}
.sv .hw{display:inline-block}
.sv .hwi{display:inline-block;animation:sv-word .95s cubic-bezier(.2,.8,.2,1) both}
.sv .hd0{animation-delay:.95s}
.sv .hd1{animation-delay:1.02s}
.sv .hd2{animation-delay:1.09s}
.sv .hd3{animation-delay:1.16s}
.sv .hd4{animation-delay:1.23s}
.sv .hd5{animation-delay:1.30s}
.sv .hd6{animation-delay:1.37s}
.sv .hd7{animation-delay:1.44s}
.sv .hd8{animation-delay:1.51s}
.sv .hd9{animation-delay:1.58s}
.sv .hd10{animation-delay:1.65s}
.sv .hd11{animation-delay:1.72s}
.sv .hd12{animation-delay:1.79s}
.sv .hd13{animation-delay:1.86s}
.sv .hd14{animation-delay:1.93s}
.sv .hd15{animation-delay:2.00s}
.sv .hd16{animation-delay:2.07s}
.sv .hd17{animation-delay:2.14s}
.sv .hd18{animation-delay:2.21s}
.sv .hd19{animation-delay:2.28s}

/* reveal on scroll, active only once the script switches it on */
.sv-on .rv{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1)}
.sv-on .rv.is-in{opacity:1;transform:none}
.sv-on .rv.d1{transition-delay:.1s}
.sv-on .rv.d2{transition-delay:.2s}
.sv-on .rv.d3{transition-delay:.3s}
.sv .rvi{display:block}
.sv-on .rvh .rvi{clip-path:inset(0 0 100% 0);transform:translateY(38%);transition:clip-path 1.1s cubic-bezier(.2,.8,.2,1),transform 1.1s cubic-bezier(.2,.8,.2,1)}
.sv-on .rvh.is-in .rvi{clip-path:inset(-20% -5% -20% -5%);transform:none}

/* services list */
.sv .svc-row{position:relative}
.sv .svc-btn{position:relative;z-index:1;width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 0;min-height:44px;background:none;border:0;cursor:pointer;text-align:start;color:#30292C;font:inherit}
.sv .svc-title{font-weight:500;font-size:clamp(24px,4.6vw,46px);line-height:1.15;transition:color .3s,transform .45s cubic-bezier(.2,.8,.2,1)}
.sv .svc-btn[aria-expanded="true"] .svc-title{color:#913246}
.sv .svc-ico{position:relative;flex:none;width:22px;height:22px;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.sv .svc-ico::before,.sv .svc-ico::after{content:"";position:absolute;left:0;top:10px;width:22px;height:2px;background:#913246;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.sv .svc-ico::after{transform:rotate(90deg)}
.sv .svc-btn[aria-expanded="true"] .svc-ico::after{transform:rotate(0deg)}
.sv .svc-panel{position:relative;z-index:1;display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s cubic-bezier(.2,.8,.2,1)}
.sv .svc-panel > div{overflow:hidden}
.sv .svc-in{opacity:0;transform:translateY(10px);transition:opacity .4s,transform .5s cubic-bezier(.2,.8,.2,1)}
.sv .svc-btn[aria-expanded="true"] + .svc-panel{grid-template-rows:1fr}
.sv .svc-btn[aria-expanded="true"] + .svc-panel .svc-in{opacity:1;transform:none;transition-delay:.15s}
@media (hover:hover){
  .sv .svc-row::before{content:"";position:absolute;top:0;bottom:0;left:-20px;right:-20px;border-radius:6px;background:#F6F1F2;transform:scaleY(0);transform-origin:center bottom;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
  .sv .svc-row:hover::before{transform:scaleY(1)}
  .sv .svc-btn:hover .svc-title{color:#913246;transform:translateX(12px)}
  .sv .svc-btn:hover .gl{fill:#913246}
  .sv[dir="rtl"] .svc-btn:hover .svc-title{transform:translateX(-12px)}
  .sv .svc-btn:hover .svc-ico{transform:rotate(90deg)}
}

/* project sequence */
.sv .step-line{height:2px;background:#C9A24B;transform-origin:left center}
.sv[dir="rtl"] .step-line{transform-origin:right center}
.sv-on .seq .step-line{transform:scaleX(0);transition:transform 1.1s cubic-bezier(.6,0,.2,1)}
.sv-on .seq .step-body{opacity:0;transform:translateY(20px);transition:opacity .8s,transform .8s cubic-bezier(.2,.8,.2,1)}
.sv-on .seq.is-in .step-line{transform:scaleX(1)}
.sv-on .seq.is-in .step-body{opacity:.4;transform:none}
.sv-on .seq.is-in .lit .step-body{opacity:1}
.sv-on .seq .s2 .step-line,.sv-on .seq .s2 .step-body{transition-delay:.2s}
.sv-on .seq .s3 .step-line,.sv-on .seq .s3 .step-body{transition-delay:.4s}
.sv-on .seq .s4 .step-line,.sv-on .seq .s4 .step-body{transition-delay:.6s}

/* product visit card */
.sv .vdot{position:relative;z-index:1;flex:none;width:28px;height:28px;border-radius:50%;border:2px solid #913246;background:#913246;display:grid;place-items:center}
.sv .vdot svg{width:14px;height:14px;stroke:#FFFFFF;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:20;stroke-dashoffset:0}
.sv .vfill{transform-origin:top center}
.sv-on .visit .vdot{background:#FEFDFD;border-color:#DED3D6;transition:background .45s,border-color .45s}
.sv-on .visit .vdot svg{stroke-dashoffset:20;transition:stroke-dashoffset .5s}
.sv-on .visit .vtxt{opacity:.35;transition:opacity .5s}
.sv-on .visit .vfill{transform:scaleY(0);transition:transform 1.6s cubic-bezier(.6,0,.2,1) .3s}
.sv-on .visit.is-in .vdot{background:#913246;border-color:#913246}
.sv-on .visit.is-in .vdot svg{stroke-dashoffset:0}
.sv-on .visit.is-in .vtxt{opacity:1}
.sv-on .visit.is-in .vfill{transform:scaleY(1)}
.sv-on .visit .v1 .vdot,.sv-on .visit .v1 .vdot svg,.sv-on .visit .v1 .vtxt{transition-delay:.2s}
.sv-on .visit .v2 .vdot,.sv-on .visit .v2 .vdot svg,.sv-on .visit .v2 .vtxt{transition-delay:.9s}
.sv-on .visit .v3 .vdot,.sv-on .visit .v3 .vdot svg,.sv-on .visit .v3 .vtxt{transition-delay:1.6s}

/* dotted edges where a dark band meets a light one */
.sv .ht{position:absolute;left:0;right:0;height:56px;pointer-events:none;z-index:1;background:radial-gradient(circle,var(--c) 6.6px,transparent 7.2px) center 49px / 14px 14px repeat-x,radial-gradient(circle,var(--c) 4.8px,transparent 5.4px) center 35px / 14px 14px repeat-x,radial-gradient(circle,var(--c) 3.1px,transparent 3.7px) center 21px / 14px 14px repeat-x,radial-gradient(circle,var(--c) 1.6px,transparent 2.2px) center 7px / 14px 14px repeat-x}
.sv .ht-b{bottom:0}
.sv .ht-t{top:0;transform:scaleY(-1)}

/* running band of services */
@keyframes sv-mq{from{transform:translateX(0)}to{transform:translateX(-50%)} }
.sv .mq{overflow:hidden;direction:ltr}
.sv .mq-track{display:flex;align-items:center;gap:clamp(24px,4vw,56px);padding-right:clamp(24px,4vw,56px);width:max-content;animation:sv-mq 70s linear infinite;will-change:transform}
.sv .mq-track.js{animation:none}
.sv .mq-w{font-weight:800;font-size:clamp(40px,7vw,96px);line-height:1.3;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(232,180,190,.6)}
.sv .mq-w.fill{color:#F6F1F2;-webkit-text-stroke:0}
.sv[dir="rtl"] .mq-w{color:rgba(232,180,190,.38);-webkit-text-stroke:0}
.sv[dir="rtl"] .mq-w.fill{color:#F6F1F2}
.sv .mq-sq{flex:none;width:clamp(10px,1.2vw,16px);height:clamp(10px,1.2vw,16px);background:#C9A24B}

/* statement that lights up word by word on scroll */
.sv .mw{display:inline-block;color:#30292C;transition:color .4s}
.sv .mw.k{color:#913246}
.sv-on .mw,.sv-on .mw.k{color:#DACED2}
.sv-on .mw.on{color:#30292C}
.sv-on .mw.k.on{color:#913246}

/* dot glyphs */
.sv .gl path{display:none}
.sv .gl.k0 .g0,.sv .gl.k1 .g1,.sv .gl.k2 .g2,.sv .gl.k3 .g3,.sv .gl.k4 .g4,.sv .gl.k5 .g5{display:inline}
.sv .gl{flex:none;width:clamp(26px,3.2vw,40px);height:clamp(26px,3.2vw,40px);fill:#CBBCC1;transition:fill .35s,transform .5s cubic-bezier(.2,.8,.2,1)}
.sv .svc-btn[aria-expanded="true"] .gl{fill:#913246;transform:scale(1.14)}

/* card that leans toward the cursor */
.sv .tilt{position:relative;transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.sv .tilt::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at var(--gx,50%) var(--gy,0%),rgba(201,162,75,.20),transparent 55%);opacity:var(--go,0);transition:opacity .4s}

/* cursor ring and language curtain */
.sv .cur{position:fixed;left:0;top:0;z-index:60;width:calc(36px * var(--s,1));height:calc(36px * var(--s,1));border-radius:50%;border:1px solid #C9A24B;pointer-events:none;opacity:0;transform:translate3d(var(--x,-100px),var(--y,-100px),0) translate(-50%,-50%);transition:opacity .3s,background .3s}
.sv .cur.on{opacity:1}
.sv .cur.hot{background:rgba(201,162,75,.2)}
.sv .cur.field{opacity:.55}
@keyframes sv-wipe{0%{transform:translateX(-101%)}20%{transform:translateX(0)}76%{transform:translateX(0)}100%{transform:translateX(101%)} }
@keyframes sv-wipe-r{0%{transform:translateX(101%)}20%{transform:translateX(0)}76%{transform:translateX(0)}100%{transform:translateX(-101%)} }
.sv .wipe{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;background:#913246;transform:translateX(-101%);pointer-events:none}
.sv .wipe.go{animation:sv-wipe 1.9s cubic-bezier(.7,0,.2,1) both}
.sv .wipe.go.rtl{animation-name:sv-wipe-r}
.sv a.navlink.is-active{background-size:100% 2px}

/* project brief */
.sv .chip{min-height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(232,180,190,.4);background:transparent;color:#F6F1F2;font:inherit;font-size:calc(15px * var(--ar));cursor:pointer;transition:background .25s,border-color .25s,color .25s,transform .25s cubic-bezier(.2,.8,.2,1)}
.sv .chip:hover{border-color:#C9A24B}
.sv .chip:active{transform:scale(.95)}
.sv .chip[aria-pressed="true"]{background:#C9A24B;border-color:#C9A24B;color:#2A0C15}
.sv .lbl{font-size:calc(14px * var(--ar));line-height:1.5;color:#E8B4BE}
.sv .fld{display:block;width:100%;min-height:48px;padding:10px 0;background:transparent;border:0;border-bottom:1px solid rgba(232,180,190,.4);border-radius:0;color:#F6F1F2;font:inherit;font-size:calc(17px * var(--ar));line-height:1.5;resize:vertical;transition:border-color .3s,box-shadow .3s}
.sv .fld:focus{outline:none;border-bottom-color:#C9A24B;box-shadow:0 1px 0 0 #C9A24B}

/* closing wordmark: a problem creeps toward "our client" and Sollvo drives it off with a ball of dots */
.sv .fm-stage{position:relative}
.sv .fm-lane{position:relative;height:clamp(48px,8.4vw,116px);margin-bottom:clamp(8px,1.4vw,20px);display:none}
.sv .fm-stage.on .fm-lane{display:block}
.sv .fm-client{position:absolute;top:50%;inset-inline-start:0;transform:translateY(-50%);display:inline-flex;align-items:center;gap:.55em;padding:.5em 1.05em;border:1.5px solid #C9A24B;border-radius:999px;color:#C9A24B;font-weight:600;font-size:clamp(12.5px,1.9vw,24px);line-height:1.2;white-space:nowrap}
.sv .fm-client::before{content:"";flex:none;width:.55em;height:.55em;border-radius:50%;background:#C9A24B}
.sv .fm-client.safe{animation:fm-safe .5s cubic-bezier(.3,.7,.3,1)}
@keyframes fm-safe{0%,100%{transform:translateY(-50%)}40%{transform:translateY(-50%) scale(1.09)} }
.sv .fm-word{position:absolute;left:0;top:50%;white-space:nowrap;font-weight:700;font-size:clamp(17px,4.6vw,68px);line-height:1.3;color:#E8B4BE;opacity:0;transform:translate(-300vw,-50%);will-change:transform}
.sv .fmark2{position:relative;width:max-content;max-width:100%;margin-inline:auto;font-weight:800;font-size:clamp(64px,21vw,310px);line-height:1;letter-spacing:0;user-select:none}
.sv .fm-solvo{display:block;color:#C9A24B}
.sv .fmark2.throw{animation:fm-throw .36s cubic-bezier(.3,.7,.3,1)}
@keyframes fm-throw{0%{transform:none}35%{transform:scale(1.03,.965)}100%{transform:none} }
.sv .fm-ball{position:absolute;left:0;top:0;width:clamp(26px,3.8vw,56px);height:clamp(26px,3.8vw,56px);margin:calc(clamp(26px,3.8vw,56px) / -2) 0 0 calc(clamp(26px,3.8vw,56px) / -2);border-radius:50%;opacity:0;pointer-events:none;background:radial-gradient(circle,#C9A24B 1.7px,rgba(201,162,75,0) 2.3px) 0 0 / 6px 6px,radial-gradient(circle,#F6F1F2 1.2px,rgba(246,241,242,0) 1.8px) 3px 3px / 6px 6px}

/* contact, closing wordmark and footer links */
.sv a.mail{color:#F6F1F2;text-decoration:none;background-image:linear-gradient(#C9A24B,#C9A24B);background-repeat:no-repeat;background-size:100% 1px;background-position:0 100%;padding-bottom:3px;transition:color .3s}
.sv a.mail:hover{color:#C9A24B}
.sv .fmark.disp{position:relative;display:block;width:max-content;max-width:100%;margin-inline:auto;font-weight:800;font-size:clamp(64px,21vw,310px);line-height:1;letter-spacing:0;color:transparent;-webkit-text-stroke:1px rgba(232,180,190,.5);user-select:none}
.sv .fmark-fill{position:absolute;inset:0;color:#C9A24B;-webkit-text-stroke:0;clip-path:inset(0 calc((1 - var(--p,1)) * 100%) 0 0)}
.sv .fmark-cv{position:absolute;left:0;top:0;pointer-events:none;display:none}
.sv .fmark.dots .fmark-cv{display:block}
.sv .fmark.dots.disp{-webkit-text-stroke:1px rgba(232,180,190,.2)}
.sv .fmark.dots .fmark-fill{z-index:1;clip-path:none;opacity:var(--f,0);-webkit-mask-image:radial-gradient(circle at var(--hx,0px) var(--hy,0px),transparent 0,transparent calc(var(--hr,0px) * .5),#000 var(--hr,0px));mask-image:radial-gradient(circle at var(--hx,0px) var(--hy,0px),transparent 0,transparent calc(var(--hr,0px) * .5),#000 var(--hr,0px))}
.sv a.flink{color:#E8B4BE;text-decoration:none;font-size:calc(14px * var(--ar));line-height:44px}
.sv a.flink:hover{color:#F6F1F2}

@media (max-width:860px){
  .sv .nav-links{display:none}
}
@media (max-width:520px){
  .sv a.cta.nav-cta{display:none}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .sv .in0,.sv .in2,.sv .in3,.sv .hwi,.sv .mq-track{animation:none}
  .sv *{transition-duration:.01s}
}

/* inner pages */
.sv.sub .hd0{animation-delay:.15s}
.sv.sub .hd1{animation-delay:.23s}
.sv.sub .hd2{animation-delay:.31s}
.sv.sub .hd3{animation-delay:.39s}
.sv.sub .hd4{animation-delay:.47s}
.sv.sub .in2{animation-delay:.55s}
.sv.sub .in3{animation-delay:.7s}
.sv .onlight .chip{border-color:#CDBFC3;color:#30292C}
.sv .onlight .chip:hover{border-color:#913246}
.sv .onlight .chip[aria-pressed="true"]{background:#913246;border-color:#913246;color:#FFFFFF}
.sv .onlight .lbl{color:#6E696B}
.sv .onlight .fld{color:#30292C;border-bottom-color:#B9A9AE}
.sv .onlight .fld:focus{border-bottom-color:#913246;box-shadow:0 1px 0 0 #913246}
.sv .onlight a.cta,.sv .onlight button.cta{background:#913246;color:#FFFFFF}
.sv .onlight a.cta:hover,.sv .onlight button.cta:hover{background:#5C1A2C;color:#FFFFFF;box-shadow:0 10px 30px rgba(92,26,44,.25)}
.sv .onlight a.mail{color:#913246;background-image:linear-gradient(#913246,#913246)}
.sv .onlight a.mail:hover{color:#5C1A2C}
.sv .steps3 .step-line{background:#913246}
.sv a.toc{display:block;padding:11px 0;color:#4D4749;text-decoration:none;font-size:calc(15px * var(--ar));line-height:1.45;border-bottom:1px solid #EFE1E4;transition:color .25s,padding .3s cubic-bezier(.2,.8,.2,1)}
.sv a.toc:hover{color:#913246;padding-inline-start:8px}
.sv article section{scroll-margin-top:24px}

/* submit button (the contact form posts to the site) */
.sv button.cta{border:0;font-family:inherit;cursor:pointer}
.sv .fld[aria-invalid="true"]{border-color:#913246}