/* ---------- SGO new site: every page other than home. Hand-built, no page builder ---------- */

/* page head: breadcrumbs, the page's own H1 and its opening line, with the live mark beside it */
.ph{position:relative;padding:calc(var(--hdr) + clamp(40px,9vh,110px)) 0 clamp(48px,8vh,96px)}
.ph-in{position:relative;z-index:2}
.ph-in>*{max-width:min(760px,56%)}
.pg-bc{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-bottom:clamp(18px,3vh,28px);font:600 13px/1.4 var(--body);color:var(--mute)}
.pg-bc a{color:var(--mute);text-decoration:none;transition:color .3s}
.pg-bc a:hover{color:var(--ink)}
.pg-bc span[aria-current]{color:var(--ink)}
.pg-bc span[aria-hidden]{opacity:.4}
.ph-t{margin:0;font:700 clamp(38px,5.4vw,84px)/1.02 var(--display);letter-spacing:-.03em;color:var(--ink);text-wrap:balance}
.ph-s{margin:clamp(14px,2.4vh,24px) 0 0;font:400 clamp(17px,1.35vw,21px)/1.55 var(--body);color:var(--mute);letter-spacing:0;text-wrap:pretty}
.ph-s p{margin:0}
.ph-ar .ph-t{font-size:clamp(34px,4.4vw,64px)}
.ar-d{margin:14px 0 0;font:600 14px/1 var(--body);color:var(--mute)}

/* the body: one reading column with the side card */
.pg{position:relative;z-index:2;padding-bottom:clamp(72px,10vh,140px)}
.pg-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:clamp(32px,5vw,88px);align-items:start}
.pg-main{min-width:0}
.pg-main>*+*{margin-top:clamp(18px,2.2vw,26px)}
.pg-h{margin:0;font-family:var(--display);letter-spacing:-.02em;color:var(--ink);text-wrap:balance}
.pg-h2{font-size:clamp(28px,2.8vw,44px);line-height:1.1;margin-top:clamp(48px,6vw,88px)!important}
.pg-h3{font-size:clamp(21px,1.7vw,27px);line-height:1.2;margin-top:clamp(28px,3vw,40px)!important}
.pg-h4,.pg-h5,.pg-h6{font-size:19px;line-height:1.3}
.pg-main>.pg-h2:first-child,.pg-main>div:first-child>.pg-h2:first-child{margin-top:0!important}
.pg-txt,.ar-body{font:400 clamp(17px,1.2vw,19px)/1.75 var(--body);color:#2B2836;max-width:72ch}
.pg-txt p,.ar-body p{margin:0 0 1em}
.pg-txt p:last-child{margin-bottom:0}
.pg-txt a,.ar-body a{color:var(--m);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.pg-txt strong,.ar-body strong{color:var(--ink)}
.pg-txt ul,.pg-txt ol,.ar-body ul,.ar-body ol{margin:0 0 1em;padding-inline-start:1.2em}
.pg-txt li,.ar-body li{margin:.35em 0}
.pg-txt li::marker,.ar-body li::marker{color:var(--m)}

/* numbers from the page's own stat blocks */
.sgo-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:clamp(28px,4vw,48px) 0;border-radius:var(--r);overflow:hidden;background:var(--line);box-shadow:0 0 0 1px var(--line)}
.sgo-stat-cube{padding:clamp(18px,2vw,28px);background:#fff}
.sgo-stat-number{font:700 clamp(26px,2.6vw,40px)/1 var(--display);letter-spacing:-.02em;color:var(--ink)}
.sgo-stat-label{margin-top:10px;font:500 14px/1.4 var(--body);color:var(--mute)}
/* the page's mid-content call to action, on phones only (the side card carries it on desktop) */
.sgo-mob-cta{display:none;padding:26px 22px;border-radius:var(--r);background:var(--ink);color:#fff}
.sgo-mob-cta>div:first-child{font:600 12px/1 var(--body);letter-spacing:.06em;color:var(--m-l)}
.sgo-mob-cta h3{margin:10px 0 8px;font:700 24px/1.15 var(--display)}
.sgo-mob-cta p{margin:0 0 18px;color:rgba(255,255,255,.72);font-size:16px;line-height:1.6}
.sgo-mob-cta>a{display:flex;align-items:center;justify-content:center;height:54px;border-radius:999px;background:var(--grad);color:#fff;font:700 16px/1 var(--display);text-decoration:none}
.sgo-mob-cta>div:last-child{display:flex;gap:10px;margin-top:10px}
.sgo-mob-cta>div:last-child a{flex:1;display:flex;align-items:center;justify-content:center;height:48px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);color:#fff;font:600 15px/1 var(--display);text-decoration:none}

/* tables, anywhere in the content */
.pg-html table,.pg-txt table,.ar-body table{width:100%;border-collapse:collapse;margin:clamp(20px,3vw,32px) 0;font-size:15px;line-height:1.5;background:#fff;border-radius:var(--r-s);overflow:hidden;box-shadow:0 0 0 1px var(--line)}
.pg-html th,.pg-txt th,.ar-body th{padding:14px 16px;background:var(--ink);color:#fff!important;font:700 14px/1.3 var(--display);text-align:start}
.pg-html td,.pg-txt td,.ar-body td{padding:13px 16px;border-top:1px solid var(--line);color:#2B2836;vertical-align:top}
.pg-tbl{overflow-x:auto}

/* rows of cards */
.pg-row{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:clamp(12px,1.4vw,18px);margin-top:clamp(20px,2.4vw,28px)}
.pg-col{min-width:0;display:flex}
.pg-col>*{flex:1}
.pg-card{height:100%;padding:clamp(22px,2vw,30px);border-radius:var(--r);background:linear-gradient(#fff,#fff) padding-box,var(--rim-d) border-box;border:1px solid transparent;box-shadow:0 30px 60px -48px rgba(40,24,70,.45)}
.pg-card-t{margin:0 0 10px;font:700 clamp(19px,1.5vw,23px)/1.2 var(--display);color:var(--ink)}
.pg-card-t a{color:inherit;text-decoration:none}
.pg-card-p{margin:0;font-size:15.5px;line-height:1.65;color:var(--mute)}

/* questions */
.pg-faq{display:grid;gap:10px;margin-top:clamp(20px,2.4vw,28px)}
.pg-faq details{border-radius:var(--r-s);background:#fff;box-shadow:0 0 0 1px var(--line);transition:box-shadow .3s}
.pg-faq details[open]{box-shadow:0 0 0 1px rgba(11,10,16,.18),0 24px 48px -36px rgba(40,24,70,.4)}
.pg-faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;cursor:pointer;list-style:none}
.pg-faq summary::-webkit-details-marker{display:none}
.pg-faq-q{margin:0;font:700 clamp(16px,1.2vw,18px)/1.35 var(--display);color:var(--ink)}
.pg-faq summary i{flex:none;position:relative;width:14px;height:14px}
.pg-faq summary i::before,.pg-faq summary i::after{content:"";position:absolute;inset:6px 0 auto;height:2px;border-radius:2px;background:var(--ink);transition:transform .35s var(--ease)}
.pg-faq summary i::after{transform:rotate(90deg)}
.pg-faq details[open] summary i::after{transform:rotate(0)}
.pg-faq summary:focus-visible{outline:2px solid var(--m);outline-offset:-2px;border-radius:var(--r-s)}
.pg-faq-a{padding:0 22px 20px;font-size:16px;line-height:1.7;color:#2B2836}
.pg-faq-a p{margin:0 0 .8em}.pg-faq-a p:last-child{margin:0}

/* projects and posts */
.pg-proj{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,22px);margin-top:clamp(20px,2.4vw,28px)}
.pg-main .pg-proj{grid-template-columns:repeat(2,minmax(0,1fr))}
.pg-pc{display:block;text-decoration:none;color:var(--ink)}
.pg-pc-img{display:block;aspect-ratio:3/2;border-radius:var(--r);overflow:hidden;background:#15121D}
.pg-pc-img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.pg-pc-t{display:block;margin-top:12px;font:700 18px/1.3 var(--display)}
@media (hover:hover){.pg-pc:hover .pg-pc-img img{transform:scale(1.04)}}
.pg-posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3vw,40px) clamp(16px,2vw,28px)}
.pg-post{display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--ink)}
.pg-post-img{display:block;aspect-ratio:16/10;border-radius:var(--r);overflow:hidden;background:var(--paper-2)}
.pg-post-img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.pg-post-d{font:600 13px/1 var(--body);color:var(--mute)}
.pg-post-t{margin:0;font:700 clamp(19px,1.5vw,22px)/1.3 var(--display)}
.pg-post-x{font-size:15px;line-height:1.6;color:var(--mute)}
@media (hover:hover){.pg-post:hover .pg-post-img img{transform:scale(1.04)}.pg-post:hover .pg-post-t{color:var(--m)}}
.pg-pager{display:flex;justify-content:center;gap:8px;margin-top:clamp(40px,5vw,64px)}
.pg-pager a,.pg-pager span{display:grid;place-items:center;min-width:44px;height:44px;padding:0 12px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);font:600 15px/1 var(--display);color:var(--ink);text-decoration:none}
.pg-pager span{background:var(--ink);color:#fff}

/* smaller parts */
.pg-list{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.pg-list li{padding:14px 18px;border-radius:var(--r-s);background:#fff;box-shadow:0 0 0 1px var(--line);font-size:16px}
.pg-list a{color:var(--ink);text-decoration:none;font-weight:600}
.pg-bar{position:relative;display:flex;justify-content:space-between;padding-bottom:14px;font:600 15px/1.3 var(--display);color:var(--ink)}
.pg-bar i{position:absolute;left:0;right:0;bottom:0;height:4px;border-radius:4px;background:var(--line);overflow:hidden}
.pg-bar i::after{content:"";position:absolute;top:0;bottom:0;right:0;width:var(--p);background:var(--grad);border-radius:4px}
.pg-btn{margin-top:clamp(20px,2.4vw,28px)}
.pg-img img{display:block;width:100%;height:auto;border-radius:var(--r)}
.pg-reviews{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 24px;border-radius:var(--r);background:linear-gradient(#fff,#fff) padding-box,var(--rim-d) border-box;border:1px solid transparent}
.pg-reviews b{font:700 44px/1 var(--display)}
.pg-reviews span{color:var(--mute);font-size:15px}

/* the side card */
.pg-side{position:sticky;top:calc(var(--hdr) + 24px)}
.pg-side-card{padding:clamp(24px,2.2vw,32px);border-radius:calc(var(--r) + 4px);background:var(--ink);color:#fff;box-shadow:0 40px 80px -50px rgba(40,24,70,.7)}
.pg-side-t{margin:0 0 10px;font:700 clamp(22px,1.8vw,28px)/1.15 var(--display);color:#fff}
.pg-side-p{font-size:15.5px;line-height:1.65;color:rgba(255,255,255,.72)}
.pg-side-p p{margin:0 0 .6em}
.pg-side-b{display:grid;gap:10px;margin-top:20px}
.pg-side .btn-ghost{color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);background:transparent}
.pg-side-tel{justify-self:center;margin-top:6px;color:#fff;font:700 18px/1 var(--display);text-decoration:none;direction:ltr}

/* posts written by our content system */
.art{position:relative;z-index:2;max-width:880px;padding-bottom:clamp(72px,10vh,140px)}
.ar-cover{margin:0 0 clamp(28px,4vw,48px)}
.ar-cover img{display:block;width:100%;height:auto;border-radius:var(--r)}
.ar-body h2{margin:1.8em 0 .6em;font:700 clamp(26px,2.4vw,36px)/1.15 var(--display);letter-spacing:-.02em;color:var(--ink)}
.ar-body h3{margin:1.5em 0 .5em;font:700 clamp(20px,1.6vw,25px)/1.25 var(--display);color:var(--ink)}
.ar-body img{max-width:100%;height:auto;border-radius:var(--r-s)}
.ar-body blockquote{margin:1.4em 0;padding:4px 20px;border-inline-start:3px solid var(--m);color:var(--ink);font-size:1.05em}
.ar-body .sgo-toc{margin:1.4em 0;padding:20px 24px;border-radius:var(--r-s);background:#fff;box-shadow:0 0 0 1px var(--line)}

@media (max-width:1100px){.pg-layout{grid-template-columns:minmax(0,1fr) 300px}.pg-posts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .ph-in>*{max-width:none}
  .pg-layout{grid-template-columns:1fr}
  .pg-side{position:static}
  .sgo-mob-cta{display:block}
  .sgo-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pg-row{grid-template-columns:1fr}
  .pg-proj{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  /* on a phone the live mark stands in its own band above the title */
  .ph{padding-top:calc(var(--hdr) + 20px)}
  .ph-in::before{content:"";display:block;height:clamp(110px,16vh,140px)}
  .pg-posts,.pg-proj,.pg-main .pg-proj{grid-template-columns:1fr}
  .pg-html table,.pg-txt table,.ar-body table{display:block;overflow-x:auto}
}

/* v6.2: blocks the text-parity pass brought back */
.pg-pc-t{margin-bottom:0}
.pg-pc-d{display:block;margin-top:6px;color:var(--mute,#5b5866);font-size:15px;line-height:1.55}
.pg-bar{flex-wrap:wrap;row-gap:4px}
.pg-bar small{flex:0 0 100%;order:3;color:var(--mute,#5b5866);font:400 14px/1.5 var(--body,inherit)}
.pg-tiles{align-items:stretch}
.pg-price{height:100%;display:flex;flex-direction:column;padding:clamp(22px,2.2vw,30px);border-radius:var(--r);background:#fff;box-shadow:0 0 0 1px var(--line),0 18px 40px -28px rgba(20,16,40,.35)}
.pg-price-t{margin:0;font:700 clamp(22px,1.8vw,26px)/1.2 var(--display)}
.pg-price-s{margin:6px 0 0;font:600 15px/1.4 var(--display);color:var(--mute,#5b5866)}
.pg-price-v{margin:18px 0 16px;display:flex;align-items:baseline;gap:6px}
.pg-price-v b{font:800 clamp(34px,3vw,44px)/1 var(--display);background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.pg-price-v span{color:var(--mute,#5b5866);font-size:15px}
.pg-price .pg-list{flex:1;gap:0}
.pg-price .pg-list li{padding:10px 0;border-radius:0;box-shadow:none;background:none;border-top:1px solid var(--line);font-size:15px}
.pg-price .pg-btn{margin:18px 0 0}
.pg-tiles .pg-col .pg-row,.pg-tiles .pg-col>div>.pg-row{margin-top:0}
@media (max-width:1100px){.pg-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.pg-tiles{grid-template-columns:1fr}}
/* the 3D pieces pass behind the page's content, never across it */
.v3-inner .pg,.v3-inner .art{position:relative;z-index:2}
.pg-main .pg-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
.pg-price-v b{white-space:nowrap}
@media (max-width:760px){.pg-main .pg-tiles{grid-template-columns:1fr}}
/* the home page's article rules (review cards) set a shrink-to-fit width; the reading column fills its wrap */
.v3-inner main article.art{width:100%;max-width:880px;display:block}
.ar-cta{margin:clamp(28px,4vw,44px) 0;padding:clamp(22px,3vw,34px);border-radius:var(--r);background:linear-gradient(#fff,#fff) padding-box,var(--rim-d) border-box;border:1px solid transparent;box-shadow:0 30px 60px -44px rgba(40,24,70,.5)}
.ar-cta-t{margin:0 0 8px!important;font:700 clamp(20px,1.7vw,24px)/1.3 var(--display)}
.ar-cta-p{color:var(--mute);font-size:16px}
.ar-cta-p p{margin:0 0 .4em}
.ar-cta .pg-btn{margin:16px 0 0}
.art .btn,.ar-body .btn,.pg-txt .btn{color:#fff!important;text-decoration:none!important}

/* v6.3 (owner: the inner head must flow with the home page) — dark hero in the home hero's language, content rises as a sheet */
.ih{position:relative;display:flex;align-items:flex-end;min-height:min(88vh,860px);min-height:min(88svh,860px);padding:calc(var(--hdr) + 40px) 0 clamp(96px,13vh,150px);background:#09070F;color:#fff;overflow:hidden}
.ih-ar{min-height:min(76vh,760px);min-height:min(76svh,760px)}
.ih-bg{position:absolute;inset:0;z-index:0}
.ih-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5;transform:scale(1.04);animation:ihBg 2.4s var(--ease) both}
@keyframes ihBg{from{opacity:.01;transform:scale(1.12)}to{opacity:.5;transform:scale(1.04)}}
.ih-shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(9,7,15,.97) 0%,rgba(9,7,15,.86) 36%,rgba(9,7,15,.55) 66%,rgba(9,7,15,.25) 100%),linear-gradient(to left,rgba(9,7,15,.55),rgba(9,7,15,0) 60%)}
.v3 main .ih-in{position:relative;z-index:2;width:100%}
.ih-in>*{animation:dheroIn 1.1s var(--ease) both}
.ih-in>:nth-child(2){animation-delay:.08s}.ih-in>:nth-child(3){animation-delay:.18s}.ih-in>:nth-child(4){animation-delay:.28s}
.ih .pg-bc{color:rgba(255,255,255,.62)}
.ih .pg-bc a{color:rgba(255,255,255,.78)}
.ih .pg-bc [aria-current]{color:#fff}
.ih-t{margin:clamp(12px,1.8vh,18px) 0 0;max-width:15ch;font:700 clamp(44px,6.4vw,112px)/.94 var(--display);letter-spacing:-.035em;color:#fff;text-wrap:balance}
.ih-ar .ih-t{max-width:18ch;font-size:clamp(38px,4.8vw,80px);line-height:1}
.ih-t em{font-style:normal;background:linear-gradient(270deg,#F2B8EE,#C9A8FF 55%,#9D8CF0);-webkit-background-clip:text;background-clip:text;color:transparent}
.ih-s{margin-top:clamp(14px,2.2vh,22px);max-width:620px;font-size:clamp(16px,1.3vw,20px);line-height:1.55;color:rgba(255,255,255,.84)}
.ih-s p{margin:0 0 .45em}
.ih-s a{color:#fff}
.ih-s .ar-d{color:rgba(255,255,255,.7)}
.ih-h{margin:10px 0 0;font:600 clamp(18px,1.5vw,22px)/1.35 var(--display);color:#fff}
.ih-foot{margin-top:clamp(20px,3.4vh,34px);display:flex;align-items:center;justify-content:space-between;gap:20px 28px;flex-wrap:wrap}
.ih-foot .hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.ih .v4-proof{margin:0;color:rgba(255,255,255,.84)}
.ih .v4-proof b{color:#fff}
.sheet{position:relative;margin-top:calc(-1 * clamp(52px,8vh,90px));padding-top:clamp(44px,5.4vw,80px);background:var(--paper,#F4F3F8);border-radius:clamp(24px,2.6vw,40px) clamp(24px,2.6vw,40px) 0 0}
.sheet>.pg,.sheet>.art{padding-top:0}
.v3-inner .ph{display:none}
@media (max-width:760px){
  .ih{min-height:0;padding:calc(var(--hdr) + 18px) 0 clamp(80px,11vh,110px)}
  .ih-t{font-size:clamp(38px,11vw,56px)}
  .ih-ar .ih-t{font-size:clamp(32px,9vw,44px)}
  .ih-foot{flex-direction:column;align-items:stretch;gap:16px}
  .ih-foot .hero-cta{flex-direction:column}
  .ih-foot .hero-cta .btn{width:100%}
  .ih .v4-proof{justify-content:center}
}
@media (prefers-reduced-motion:reduce){.ih-in>*,.ih-img{animation:none}}
.ih-in>.ih-foot{max-width:none}
@media (min-width:761px){.ih-t{max-width:min(12ch,60%)}.ih-ar .ih-t{max-width:min(18ch,60%)}.ih-s{max-width:min(620px,56%)}}
@media (min-width:761px){.ih-ar .ih-t{max-width:min(16ch,54%);font-size:clamp(36px,4.2vw,72px)}.ih .pg-bc{max-width:54%}}

/* ================= v6.4 service pages, composed (owner: "the pages themselves are weak") =================
   One page = a run of sections. Each one has a number, a display title and a layout made for what it holds.
   Same words and heading levels as the live page; only the presentation is new. */
.pg-sv{padding-top:0!important}
.sheet-sv{padding-top:clamp(12px,2vw,28px)}
.pg-sv .sv{position:relative;padding-block:clamp(64px,8.4vw,136px)}
.pg-sv .sv:first-child{padding-top:clamp(40px,5vw,80px)}
.pg-sv .sv-head{display:flex;flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:clamp(28px,3.6vw,56px)}
.pg-sv .sv-n{display:inline-flex;align-items:center;gap:14px;font:600 13px/1 var(--display);letter-spacing:.16em;color:var(--m)}
.pg-sv .sv-n::after{content:"";width:56px;height:1px;background:currentColor;opacity:.45}
.pg-sv .sv-head>h2,.pg-sv .sv-head>h3{margin:0;max-width:17ch;font:700 clamp(32px,4.2vw,66px)/1.02 var(--display);letter-spacing:-.032em;color:var(--ink);text-wrap:balance}
.pg-sv .sv-head>h2::after,.pg-sv .sv-head>h3::after{display:none}
.pg-sv .sv-body{font:400 clamp(17px,1.12vw,19px)/1.78 var(--body);color:#2E2A3A}
.pg-sv .sv-body>p,.pg-sv .sv-body>ul,.pg-sv .sv-body>ol{max-width:66ch}
.pg-sv .sv-body p{margin:0 0 1.05em}
.pg-sv .sv-body strong{color:var(--ink);font-weight:700}
.pg-sv .sv-body a{color:var(--m);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.pg-sv .sv-body>h2,.pg-sv .sv-body>h3{margin:0 0 18px;max-width:28ch;font:700 clamp(22px,2vw,32px)/1.18 var(--display);letter-spacing:-.02em;color:var(--ink)}
.pg-sv .sv-body>h2::after,.pg-sv .sv-body>h3::after,.pg-sv .sgo-section-header::after{display:none!important}
.pg-sv .sv-body h4{margin:0 0 8px;font:700 clamp(19px,1.4vw,22px)/1.25 var(--display);color:var(--ink)}
.pg-sv .sv-body ul{padding:0;list-style:none}
.pg-sv .sv-body ul>li{position:relative;padding-inline-start:28px;margin:.55em 0}
.pg-sv .sv-body ul>li::before{content:"";position:absolute;inset-inline-start:0;top:.62em;width:12px;height:12px;border-radius:4px;background:var(--grad);transform:rotate(45deg) scale(.7)}
.pg-sv .sv-body ol{padding-inline-start:1.3em}

/* the opening section reads as a lead */
.pg-sv .sv:first-child .sv-body>p:first-of-type{font-size:clamp(20px,1.55vw,26px);line-height:1.55;color:var(--ink)}

/* text: the title holds its place on the right while the words run beside it */
@media (min-width:1001px){
  .pg-sv .sv-text .sv-in,.pg-sv .sv-faq .sv-in:has(.sv-head),.pg-sv .sv-links .sv-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,6vw,120px);align-items:start}
  .pg-sv .sv-text .sv-head,.pg-sv .sv-faq .sv-head,.pg-sv .sv-links .sv-head{position:sticky;top:calc(var(--hdr) + 36px);margin-bottom:0}
  .pg-sv .sv-text .sv-body:only-child{grid-column:1/-1}
}

/* boxes the pages already carry: an answer, key points, an entity note */
.pg-sv .sgo-answer-box,.pg-sv .sgo-key-takeaways,.pg-sv .entity-note{position:relative;margin:0 0 clamp(24px,3vw,40px);padding:clamp(22px,2.4vw,34px);border-radius:var(--r);background:#fff;box-shadow:0 0 0 1px var(--line),0 30px 60px -48px rgba(40,24,70,.45);max-width:none!important}
.pg-sv .sgo-answer-box::before{content:"";position:absolute;inset-block:22px;inset-inline-start:0;width:3px;border-radius:3px;background:var(--grad)}
.pg-sv .entity-note{font-size:15px;color:var(--mute)}

/* cards: every item its own tile, numbered, lit by the pointer */
.pg-sv .sgo-cards-grid,.pg-sv .sgo-types-grid,.pg-sv .sgo-process-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(14px,1.4vw,22px);margin:clamp(20px,2.6vw,36px) 0 0;counter-reset:card;max-width:none!important}
.pg-sv .sgo-card,.pg-sv .sgo-type,.pg-sv .sgo-step-card{position:relative;display:flex;flex-direction:column;min-height:100%;padding:clamp(26px,2.6vw,40px);border-radius:calc(var(--r) + 6px);background:#fff;box-shadow:0 0 0 1px var(--line);overflow:hidden;counter-increment:card;transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
.pg-sv .sgo-card::before,.pg-sv .sgo-type::before,.pg-sv .sgo-step-card::before{content:counter(card,decimal-leading-zero);position:absolute;top:clamp(22px,2.2vw,32px);inset-inline-end:clamp(24px,2.4vw,36px);font:600 13px/1 var(--display);letter-spacing:.12em;color:var(--mute)}
.pg-sv .sgo-card::after,.pg-sv .sgo-type::after,.pg-sv .sgo-step-card::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(157,140,240,.16),transparent 62%)}
@media (hover:hover){
  .pg-sv .sgo-card:hover,.pg-sv .sgo-type:hover,.pg-sv .sgo-step-card:hover{transform:translateY(-6px);box-shadow:0 0 0 1px rgba(157,140,240,.45),0 40px 70px -40px rgba(60,30,110,.4)}
  .pg-sv .sgo-card:hover::after,.pg-sv .sgo-type:hover::after,.pg-sv .sgo-step-card:hover::after{opacity:1}
}
.pg-sv .sgo-card-icon{display:grid;place-items:center;width:60px;height:60px;margin-bottom:22px;border-radius:18px;background:linear-gradient(145deg,#F4EEFF,#FBEFFA);box-shadow:inset 0 0 0 1px rgba(157,140,240,.25);font-size:28px}
.pg-sv .sgo-card h4,.pg-sv .sgo-type h4,.pg-sv .sgo-step-card h4,.pg-sv .sgo-step-card h3{margin:0 0 10px;padding-inline-end:40px;font:700 clamp(20px,1.55vw,24px)/1.22 var(--display);color:var(--ink)}
.pg-sv .sgo-type h4 a{color:var(--ink);text-decoration:none}
.pg-sv .sgo-type h4 a::after{content:"";position:absolute;inset:0;z-index:1}
.pg-sv .sgo-card p,.pg-sv .sgo-type p,.pg-sv .sgo-step-card p{margin:0;font-size:16px;line-height:1.7;color:#4A4656}
.pg-sv .sgo-type{padding-bottom:clamp(76px,6vw,88px)}
.pg-sv .sgo-price{position:absolute;bottom:clamp(24px,2.4vw,34px);inset-inline-start:clamp(26px,2.6vw,40px);display:inline-flex;align-items:center;height:36px;margin:0;padding:0 16px;border-radius:999px;background:linear-gradient(#fff,#fff) padding-box,var(--grad) border-box;border:1px solid transparent;font:700 15px/1 var(--display);color:var(--ink)}
.pg-sv .sgo-type:hover .sgo-price{background:var(--grad);color:#fff}

/* steps written inside the text (numbered) */
.pg-sv .sgo-step{display:grid;grid-template-columns:clamp(56px,5vw,80px) 1fr;column-gap:clamp(16px,2vw,28px);padding:clamp(22px,2.4vw,32px) 0;border-top:1px solid var(--line);max-width:none!important}
.pg-sv .sgo-step:last-child{border-bottom:1px solid var(--line)}
.pg-sv .sgo-step-num{grid-row:1/span 3;font:700 clamp(34px,3.4vw,54px)/1 var(--display);letter-spacing:-.04em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.pg-sv .sgo-step>*:not(.sgo-step-num){grid-column:2}

/* the process: a dark chapter with the steps read across */
.pg-sv .sv-steps{color:#fff;background:#0B0A10;box-shadow:0 0 0 100vmax #0B0A10;clip-path:inset(0 -100vmax)}
.pg-sv .sv-steps::before{content:"";position:absolute;inset:0 -30vw;pointer-events:none;background:radial-gradient(40% 70% at 80% 0%,rgba(157,140,240,.22),transparent 70%),radial-gradient(40% 60% at 15% 100%,rgba(242,184,238,.12),transparent 70%)}
.pg-sv .sv-steps .sv-in{position:relative}
.pg-sv .sv-steps .sv-head>h2,.pg-sv .sv-steps .sv-head>h3{color:#fff}
.pg-sv .sv-steps .sv-n{color:#C9A8FF}
.pg-sv .sv-steps .sv-body{color:rgba(255,255,255,.78)}
.pg-sv .sv-steps .sv-body strong{color:#fff}
.pg-sv .sv-steps .pg-row,.pg-sv .sv-steps .sv-body:has(>.pg-card){display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:0;margin:0;counter-reset:step;border-top:1px solid rgba(255,255,255,.16)}
.pg-sv .sv-steps .pg-col{min-width:0}
.pg-sv .sv-steps .pg-card{position:relative;height:100%;margin:0;padding:clamp(28px,2.6vw,40px) clamp(18px,1.8vw,28px) 8px;border:0;border-radius:0;background:none;box-shadow:none;counter-increment:step}
.pg-sv .sv-steps .pg-col+.pg-col .pg-card,.pg-sv .sv-steps .pg-card+.pg-card{box-shadow:inset -1px 0 0 rgba(255,255,255,.1)}
.pg-sv .sv-steps .pg-card::before{content:counter(step,decimal-leading-zero);display:block;margin-bottom:clamp(18px,2vw,30px);font:700 clamp(54px,5.6vw,96px)/.9 var(--display);letter-spacing:-.05em;background:linear-gradient(270deg,#F2B8EE,#C9A8FF 55%,#9D8CF0);-webkit-background-clip:text;background-clip:text;color:transparent}
.pg-sv .sv-steps .pg-card-t{margin:0 0 10px;font:700 clamp(19px,1.5vw,23px)/1.25 var(--display);color:#fff}
.pg-sv .sv-steps .pg-card-t a{color:#fff;text-decoration:none}
.pg-sv .sv-steps .pg-card-p{margin:0;font-size:16px;line-height:1.7;color:rgba(255,255,255,.72)}
.pg-sv .sv-steps .pg-card::after{content:"";position:absolute;top:-4px;inset-inline-start:clamp(18px,1.8vw,28px);width:7px;height:7px;border-radius:50%;background:#C9A8FF;box-shadow:0 0 0 5px rgba(201,168,255,.18)}

/* numbers: one dark band, figures large, counted up when reached */
.pg-sv .sv-stats{padding-block:clamp(56px,7vw,112px);color:#fff;background:#0B0A10;box-shadow:0 0 0 100vmax #0B0A10;clip-path:inset(0 -100vmax)}
.pg-sv .sv-stats .sgo-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0;background:none;box-shadow:none;border-radius:0;overflow:visible}
.pg-sv .sv-stats .sgo-stat-cube{padding:6px clamp(18px,2.4vw,40px);background:none;box-shadow:inset -1px 0 0 rgba(255,255,255,.14)}
.pg-sv .sv-stats .sgo-stat-cube:first-child{box-shadow:none;padding-inline-start:0}
.pg-sv .sv-stats .sgo-stat-number{font:700 clamp(44px,5.6vw,98px)/.95 var(--display);letter-spacing:-.045em;background:linear-gradient(270deg,#F2B8EE,#C9A8FF 55%,#9D8CF0);-webkit-background-clip:text;background-clip:text;color:transparent;white-space:nowrap}
.pg-sv .sv-stats .sgo-stat-label{margin-top:14px;font:500 clamp(14px,1vw,16px)/1.45 var(--body);color:rgba(255,255,255,.7)}
.pg-sv .sv-stats+.sv-steps,.pg-sv .sv-steps+.sv-stats{padding-top:0}

/* the offer inside the page: one warm band, not a mobile box */
.pg-sv .sv-band{padding-block:clamp(24px,3vw,48px)}
.pg-sv .sgo-mob-cta{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px clamp(24px,4vw,64px);padding:clamp(30px,4vw,64px);border-radius:calc(var(--r) + 14px);background:radial-gradient(80% 140% at 100% 0%,#9D5BD2 0%,transparent 60%),linear-gradient(120deg,#1B1230,#3B1B5E 55%,#6B2E8F);color:#fff;box-shadow:0 50px 90px -60px rgba(60,20,110,.8)}
.pg-sv .sgo-mob-cta>div:first-child{grid-column:1;font:600 13px/1 var(--display);letter-spacing:.14em;color:#F2B8EE}
.pg-sv .sgo-mob-cta h3{grid-column:1;margin:4px 0 0;font:700 clamp(28px,3.2vw,50px)/1.05 var(--display);letter-spacing:-.03em;color:#fff}
.pg-sv .sgo-mob-cta p{grid-column:1;margin:6px 0 0;max-width:56ch;color:rgba(255,255,255,.8);font-size:clamp(16px,1.15vw,18px)}
.pg-sv .sgo-mob-cta>a{grid-column:2;grid-row:1/span 3;align-self:center;height:60px;padding:0 34px;border-radius:999px;background:#fff;color:#1B1230!important;font:700 17px/1 var(--display);text-decoration:none!important;display:inline-flex;align-items:center;justify-content:center;transition:transform .4s var(--ease)}
.pg-sv .sgo-mob-cta>a:hover{transform:translateY(-2px)}
.pg-sv .sgo-mob-cta>div:last-child{grid-column:2;display:flex;justify-content:center;gap:18px;margin:0}
.pg-sv .sgo-mob-cta>div:last-child a{height:auto;padding:0 0 3px;background:none;border-radius:0;color:rgba(255,255,255,.86)!important;font:600 15px/1 var(--display);text-decoration:none!important;border-bottom:1px solid rgba(255,255,255,.3)}

/* tables and prices: a clean sheet, the recommended column lit */
.pg-sv .sv-body table{width:100%;min-width:560px;border-collapse:separate;border-spacing:0;margin:clamp(20px,2.6vw,36px) 0 0;border-radius:calc(var(--r) + 4px);overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--line),0 40px 80px -60px rgba(40,24,70,.45);font:400 16px/1.5 var(--body)}
.pg-sv .sv-body table th{padding:18px 20px;background:#0B0A10;color:#fff!important;font:700 15px/1.3 var(--display);text-align:start}
.pg-sv .sv-body table td{padding:16px 20px;border-top:1px solid var(--line);color:#2E2A3A;vertical-align:top;background:#fff}
.pg-sv .sv-body table tr:nth-child(even) td{background:#FAF9FC}
.pg-sv .sv-body table td:first-child{font-weight:700;color:var(--ink)}
.pg-sv .sgo-pricing-table th.sgo-recommended{background:linear-gradient(135deg,#6B2E8F,#9D8CF0)}
.pg-sv .sgo-pricing-wrap,.pg-sv .sgo-table-wrap,.pg-sv .sgo-cmp-wrap{max-width:none!important;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* questions: the title on the side, answers open in place */
.pg-sv .sv-faq .sv-in:not(:has(.sv-head))::before{content:"שאלות נפוצות";display:block;margin-bottom:clamp(24px,3vw,44px);font:700 clamp(32px,4.2vw,66px)/1.02 var(--display);letter-spacing:-.032em;color:var(--ink)}
.pg-sv .pg-faq{display:block;max-width:none}
.pg-sv .pg-faq details{border:0;border-top:1px solid var(--line);border-radius:0;background:none;box-shadow:none;margin:0;padding:0}
.pg-sv .pg-faq details:last-child{border-bottom:1px solid var(--line)}
.pg-sv .pg-faq summary{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:clamp(20px,2vw,28px) 0;cursor:pointer;list-style:none}
.pg-sv .pg-faq summary::-webkit-details-marker{display:none}
.pg-sv .pg-faq-q{margin:0;font:600 clamp(18px,1.45vw,22px)/1.35 var(--display);color:var(--ink)}
.pg-sv .pg-faq summary i{position:relative;flex:0 0 40px;width:40px;height:40px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line);transition:background .4s}
.pg-sv .pg-faq summary i::before,.pg-sv .pg-faq summary i::after{content:"";position:absolute;top:50%;left:50%;width:14px;height:2px;margin:-1px 0 0 -7px;border-radius:2px;background:var(--ink);border:0;transform:none}
.pg-sv .pg-faq summary i::after{transform:rotate(90deg);transition:transform .5s var(--ease)}
.pg-sv .pg-faq details[open] summary i{background:var(--grad);box-shadow:none}
.pg-sv .pg-faq details[open] summary i::before,.pg-sv .pg-faq details[open] summary i::after{background:#fff}
.pg-sv .pg-faq details[open] summary i::after{transform:rotate(0)}
.pg-sv .pg-faq-a{padding:0 0 clamp(20px,2vw,28px);max-width:64ch;color:#4A4656;font-size:17px;line-height:1.75}

/* reviews: the home page's own written reviews */
.pg-sv .sv-rq{max-width:none}
.pg-sv .sv-rq .rq{margin-top:0}

/* work: large frames, staggered like the home page */
.pg-sv .sv-work .pg-proj{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,48px)}
.pg-sv .sv-work .pg-pc:nth-child(even){margin-top:clamp(40px,7vw,120px)}
.pg-sv .sv-work .pg-pc-img{aspect-ratio:16/11;border-radius:calc(var(--r) + 8px)}
.pg-sv .sv-work .pg-pc-t{margin-top:18px;font:700 clamp(20px,1.7vw,26px)/1.2 var(--display)}
.pg-sv .sv-work .pg-pc-d{font-size:16px;max-width:52ch}
.pg-sv .sv-work .pg-btn,.pg-sv .sv-work .btn{margin-top:clamp(24px,3vw,40px)}

/* links: clusters of related pages as chips */
.pg-sv .sgo-city-cluster ul,.pg-sv .sgo-related ul{display:flex;flex-wrap:wrap;gap:10px;padding:0}
.pg-sv .sgo-city-cluster li,.pg-sv .sgo-related li{margin:0;padding:0}
.pg-sv .sgo-city-cluster li::before,.pg-sv .sgo-related li::before{display:none}
.pg-sv .sgo-city-cluster a,.pg-sv .sgo-related a{display:inline-flex;min-height:44px;align-items:center;padding:0 18px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--line);color:var(--ink);text-decoration:none;font:600 15px/1.2 var(--display);transition:box-shadow .3s,transform .3s}
.pg-sv .sgo-city-cluster a:hover,.pg-sv .sgo-related a:hover{box-shadow:0 0 0 1px var(--m);transform:translateY(-2px)}
.pg-sv .sv-trust{padding-block:clamp(28px,3vw,48px)}
.pg-sv .sgo-trust-strip{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 36px;font:600 15px/1.4 var(--display);color:var(--mute)}

/* the close: one invitation, in the brand's colours */
.pg-sv .sv-cta{padding-block:clamp(40px,6vw,96px) clamp(80px,10vw,160px)}
.pg-sv .sv-cta .sv-in{position:relative;overflow:hidden;padding:clamp(44px,7vw,120px) clamp(24px,5vw,96px);border-radius:clamp(28px,3vw,48px);background:radial-gradient(70% 120% at 100% 0%,rgba(157,91,210,.9),transparent 60%),radial-gradient(60% 100% at 0% 100%,rgba(242,184,238,.35),transparent 65%),linear-gradient(135deg,#120C1E,#2A1747 60%,#4B2270);color:#fff;text-align:center}
.pg-sv .sv-cta-src{display:flex;flex-direction:column;align-items:center}
.pg-sv .sv-cta-t{margin:0;max-width:16ch;font:700 clamp(38px,5.6vw,92px)/.98 var(--display);letter-spacing:-.04em;color:#fff;text-wrap:balance}
.pg-sv .sv-cta-p{margin-top:clamp(14px,2vw,24px);max-width:52ch;font-size:clamp(17px,1.3vw,20px);line-height:1.6;color:rgba(255,255,255,.82)}
.pg-sv .sv-cta-p p{margin:0}
.pg-sv .sv-cta-p a{color:#fff}
.pg-sv .sv-cta-b{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px 16px;margin-top:clamp(26px,3.4vw,44px)}
.pg-sv .sv-cta-tel{color:#fff!important;font:600 16px/1 var(--display);text-decoration:none!important;border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:4px}

.pg-sv .pg-img img{border-radius:var(--r);box-shadow:0 30px 60px -44px rgba(40,24,70,.45)}

/* sections arrive as they are reached */
.sv-js .pg-sv .sv>.sv-in{opacity:0;transform:translateY(46px);transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
.sv-js .pg-sv .sv.in>.sv-in{opacity:1;transform:none}
.sv-js .pg-sv .sv .sgo-card,.sv-js .pg-sv .sv .sgo-type,.sv-js .pg-sv .sv-steps .pg-card{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease),box-shadow .6s var(--ease)}
.sv-js .pg-sv .sv.in .sgo-card,.sv-js .pg-sv .sv.in .sgo-type,.sv-js .pg-sv .sv-steps.in .pg-card{opacity:1;transform:none}
.sv-js .pg-sv .sv.in :is(.sgo-card,.sgo-type,.pg-col,.pg-card):nth-child(2){transition-delay:.08s}
.sv-js .pg-sv .sv.in :is(.sgo-card,.sgo-type,.pg-col,.pg-card):nth-child(3){transition-delay:.16s}
.sv-js .pg-sv .sv.in :is(.sgo-card,.sgo-type,.pg-col,.pg-card):nth-child(4){transition-delay:.24s}
.sv-js .pg-sv .sv.in :is(.sgo-card,.sgo-type,.pg-col,.pg-card):nth-child(5){transition-delay:.32s}
.sv-js .pg-sv .sv.in :is(.sgo-card,.sgo-type,.pg-col,.pg-card):nth-child(n+6){transition-delay:.4s}
@media (prefers-reduced-motion:reduce){.sv-js .pg-sv .sv>.sv-in,.sv-js .pg-sv .sv .sgo-card,.sv-js .pg-sv .sv .sgo-type,.sv-js .pg-sv .sv-steps .pg-card{opacity:1!important;transform:none!important;transition:none!important}}

@media (max-width:1000px){
  .pg-sv .sv-stats .sgo-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:36px}
  .pg-sv .sv-stats .sgo-stat-cube:nth-child(odd){box-shadow:none;padding-inline-start:0}
}
@media (max-width:760px){
  .pg-sv .sv{padding-block:clamp(52px,14vw,76px)}
  .pg-sv .sv-head>h2,.pg-sv .sv-head>h3{font-size:clamp(30px,8.6vw,40px)}
  .pg-sv .sv-steps .pg-row,.pg-sv .sv-steps .sv-body:has(>.pg-card){grid-template-columns:1fr;border-top:0}
  .pg-sv .sv-steps .pg-card{display:grid;grid-template-columns:auto 1fr;column-gap:18px;padding:22px 0;border-top:1px solid rgba(255,255,255,.14);box-shadow:none!important}
  .pg-sv .sv-steps .pg-card::before{grid-row:1/span 2;margin:0;font-size:46px}
  .pg-sv .sv-steps .pg-card::after{display:none}
  .pg-sv .sv-stats .sgo-stat-number{font-size:clamp(38px,11vw,54px)}
  .pg-sv .sgo-mob-cta{grid-template-columns:1fr}
  .pg-sv .sgo-mob-cta>a,.pg-sv .sgo-mob-cta>div:last-child{grid-column:1;grid-row:auto}
  .pg-sv .sgo-mob-cta>a{width:100%;margin-top:14px}
  .pg-sv .sgo-mob-cta>div:last-child{margin-top:8px}
  .pg-sv .sv-work .pg-proj{grid-template-columns:1fr}
  .pg-sv .sv-work .pg-pc:nth-child(even){margin-top:0}
  .pg-sv .sv-cta-b{flex-direction:column;align-items:stretch}
  .pg-sv .sv-cta-b .btn{width:100%}
  .pg-sv .sv-cta-tel{align-self:center}
}
.pg-sv .sgo-mob-cta>div:last-child a{flex:none;width:auto;min-width:0;height:auto;border:0!important;border-bottom:1px solid rgba(255,255,255,.35)!important;border-radius:0!important;box-shadow:none!important;background:none!important;white-space:nowrap}
.pg-sv .pg-faq summary i::before,.pg-sv .pg-faq summary i::after{inset:auto!important;left:50%!important;top:50%!important;right:auto!important}
.pg-sv .pg-pc,.pg-sv .pg-pc:hover{text-decoration:none!important;color:var(--ink)}
.pg-sv .pg-pc-t{color:var(--ink)}
.pg-sv .pg-pc-d{color:var(--mute)}
.pg-sv .sv-cta .btn-ghost{color:#fff!important;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.32)}
.pg-sv .sv-cta .btn-ghost svg{color:#4ADE80}
.pg-sv .sv-steps .sv-body{counter-reset:step}
.pg-sv .sv-steps .pg-row{counter-reset:none}
.pg-sv .sv-steps .pg-row+.pg-row{border-top:0}
.pg-sv .sv-steps::before{inset:0}
.v3-inner main{overflow-x:clip}

/* ================= v6.5 service pages, stronger (owner: "still not good enough") =================
   A big quiet number behind every chapter, an opening statement, a line of the sites we built,
   bento tiles, headings that wipe in, and a process line that draws itself. */

/* every chapter carries its number, huge and outlined, drifting slower than the page */
.pg-sv .sv-head{position:relative;isolation:isolate}
.pg-sv .sv-head[data-n]::before{content:attr(data-n);position:absolute;z-index:-1;top:-.42em;inset-inline-start:-.04em;font:800 clamp(120px,15vw,250px)/1 var(--display);letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1.5px rgba(155,45,148,.16);transform:translate3d(0,var(--py,0px),0);pointer-events:none;user-select:none}
.pg-sv .sv-steps .sv-head[data-n]::before{-webkit-text-stroke-color:rgba(183,166,240,.2)}
.pg-sv .sv-head>h2,.pg-sv .sv-head>h3{position:relative}

/* headings wipe in from the reading side, the number's rule draws after them */
.sv-js .pg-sv .sv .sv-head>:is(h2,h3){clip-path:inset(-.2em 0 -.3em 100%);transition:clip-path 1.25s .12s cubic-bezier(.77,0,.18,1)}
.sv-js .pg-sv .sv.in .sv-head>:is(h2,h3){clip-path:inset(-.2em 0 -.3em 0)}
.sv-js .pg-sv .sv .sv-n::after{transform:scaleX(0);transform-origin:right;transition:transform 1s .5s var(--ease)}
.sv-js .pg-sv .sv.in .sv-n::after{transform:none}

/* the opening statement: the page's first words, set large */
.pg-sv .sv-intro .sv-head>:is(h2,h3){max-width:20ch;font-size:clamp(38px,5.4vw,88px)}
.pg-sv .sv-intro .sv-body{display:grid;grid-template-columns:1fr;gap:0 clamp(40px,5vw,96px)}
.pg-sv .sv-intro .sv-body>*{max-width:none!important}
.pg-sv .sv-intro .sv-body>p:first-of-type{grid-column:1/-1;max-width:34ch!important;margin-bottom:clamp(28px,3vw,48px);font:500 clamp(23px,2.35vw,38px)/1.38 var(--display)!important;letter-spacing:-.018em;color:var(--ink)!important}
.pg-sv .sv-intro .sv-body>p:first-of-type strong{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
@media (min-width:1001px){
  .pg-sv .sv-intro .sv-body{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pg-sv .sv-intro .sv-body>:is(table,div,ul,ol,h2,h3,h4,figure,blockquote){grid-column:1/-1}
}

/* the sites we built, running past between the numbers and the rest of the page */
.pg-sv .sv-marquee{padding-block:clamp(34px,4.4vw,70px);width:100vw;margin-inline:calc(50% - 50vw);overflow:hidden;border-bottom:1px solid var(--line)}
.pg-sv .sv-marquee .mq{display:flex;width:max-content;animation:svMq 60s linear infinite}
.pg-sv .sv-marquee:hover .mq{animation-play-state:paused}
.pg-sv .sv-marquee .mq-t{display:flex;align-items:center;margin:0;padding:0;list-style:none}
.pg-sv .sv-marquee .mq-t li{display:flex;align-items:center;margin:0!important;padding:0!important;white-space:nowrap;font:700 clamp(34px,5.2vw,84px)/1.1 var(--display);letter-spacing:-.035em;color:transparent;-webkit-text-stroke:1.2px rgba(11,10,16,.32)}
.pg-sv .sv-marquee .mq-t li::before{display:none!important}
.pg-sv .sv-marquee .mq-t li:nth-child(3n+1){color:var(--ink);-webkit-text-stroke:0}
.pg-sv .sv-marquee .mq-t li::after{content:"";flex:none;width:.34em;height:.34em;margin-inline:.55em;border-radius:50%;background:var(--grad)}
@keyframes svMq{to{transform:translateX(50%)}}

/* cards: the icon gives way to a big gradient number; four or more become a bento with a dark lead tile */
.pg-sv .sgo-card-icon{display:none!important}
.pg-sv .sgo-card::before,.pg-sv .sgo-type::before{position:static;display:block;margin:0 0 clamp(26px,3vw,48px);font:700 clamp(40px,3.6vw,60px)/.9 var(--display);letter-spacing:-.05em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:1}
.pg-sv .sgo-card h4,.pg-sv .sgo-type h4{padding-inline-end:0}
@media (min-width:1001px){
  .pg-sv .sgo-cards-grid:has(>:nth-child(4)),.pg-sv .sgo-types-grid:has(>:nth-child(4)){grid-template-columns:repeat(3,minmax(0,1fr))}
  .pg-sv :is(.sgo-cards-grid,.sgo-types-grid):has(>:nth-child(4)):has(>:nth-child(3n+1):last-child)>:first-child,
  .pg-sv :is(.sgo-cards-grid,.sgo-types-grid):has(>:nth-child(4)):has(>:nth-child(3n+1):last-child)>:last-child,
  .pg-sv :is(.sgo-cards-grid,.sgo-types-grid):has(>:nth-child(5)):has(>:nth-child(3n+2):last-child)>:first-child{grid-column:span 2}
  .pg-sv :is(.sgo-cards-grid,.sgo-types-grid):has(>:nth-child(4)):not(:has(>:nth-child(3n):last-child))>:first-child{background:#0B0A10;box-shadow:none;color:#fff}
  .pg-sv :is(.sgo-cards-grid,.sgo-types-grid):has(>:nth-child(4)):not(:has(>:nth-child(3n):last-child))>:first-child::before{font-size:clamp(64px,6vw,104px)}
  .pg-sv :is(.sgo-cards-grid,.sgo-types-grid):has(>:nth-child(4)):not(:has(>:nth-child(3n):last-child))>:first-child :is(h3,h4,h4 a){color:#fff;font-size:clamp(24px,2.1vw,34px)}
  .pg-sv :is(.sgo-cards-grid,.sgo-types-grid):has(>:nth-child(4)):not(:has(>:nth-child(3n):last-child))>:first-child p{color:rgba(255,255,255,.74);font-size:17px;max-width:48ch}
  .pg-sv :is(.sgo-cards-grid,.sgo-types-grid):has(>:nth-child(4)):not(:has(>:nth-child(3n):last-child))>:first-child::after{opacity:1;background:radial-gradient(520px circle at var(--mx,20%) var(--my,0%),rgba(155,45,148,.4),transparent 60%)}
}

/* the process: a line runs across the steps as the chapter arrives */
.pg-sv .sv-steps .pg-row,.pg-sv .sv-steps .sv-body:has(>.pg-card){position:relative}
.pg-sv .sv-steps .pg-row::after,.pg-sv .sv-steps .sv-body:has(>.pg-card)::after{content:"";position:absolute;top:-1px;inset-inline:0;height:2px;background:linear-gradient(270deg,#B7A6F0,#9B2D94 45%,#614994);transform-origin:right;transform:scaleX(0);transition:transform 2.2s .35s cubic-bezier(.65,0,.35,1)}
.pg-sv .sv-steps.in .pg-row::after,.pg-sv .sv-steps.in .sv-body:has(>.pg-card)::after{transform:none}
html:not(.sv-js) .pg-sv .sv-steps .pg-row::after,html:not(.sv-js) .pg-sv .sv-steps .sv-body:has(>.pg-card)::after{transform:none}

/* a hairline between two light chapters, fading at both ends */
.pg-sv .sv:is(.sv-intro,.sv-text,.sv-cards,.sv-table,.sv-faq,.sv-links,.sv-flow,.sv-work,.sv-reviews)+.sv:is(.sv-text,.sv-cards,.sv-table,.sv-faq,.sv-links,.sv-flow,.sv-work,.sv-reviews)::after{content:"";position:absolute;top:0;inset-inline:0;height:1px;background:linear-gradient(90deg,transparent,rgba(11,10,16,.14) 20%,rgba(11,10,16,.14) 80%,transparent)}

@media (max-width:1000px){
  .pg-sv .sv-head[data-n]::before{font-size:clamp(96px,30vw,150px);top:-.3em}
  .pg-sv .sv-intro .sv-body>p:first-of-type{font-size:clamp(21px,5.6vw,26px)!important}
}
@media (prefers-reduced-motion:reduce){
  .pg-sv .sv-marquee .mq{animation:none}
  .sv-js .pg-sv .sv .sv-head>:is(h2,h3){clip-path:none}
}

/* ================= v6.6 one language with the home page (owner: "a strong purple that the home page doesn't have") =================
   The home page is black, white and paper. Purple is only an accent: the mark, one word, the buttons, the numbers.
   So no surface is purple any more; the logo's own gradient stays only where the home page uses it. */
.pg-sv .sgo-mob-cta{background:#fff;color:var(--ink);box-shadow:0 0 0 1px var(--line),0 40px 80px -60px rgba(11,10,16,.35)}
.pg-sv .sgo-mob-cta>div:first-child{color:var(--m)}
.pg-sv .sgo-mob-cta h3{color:var(--ink)}
.pg-sv .sgo-mob-cta p{color:var(--mute)}
.pg-sv .sgo-mob-cta>a{background:var(--grad);color:#fff!important}
.pg-sv .sgo-mob-cta>div:last-child a{color:var(--ink)!important;border-bottom-color:var(--line)}
.pg-sv .sv-cta .sv-in{background:#0B0A10;box-shadow:0 0 0 1px rgba(255,255,255,.06)}
.pg-sv .sv-cta .sv-in::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 90% at 50% 0%,rgba(255,255,255,.07),transparent 70%)}
.pg-sv .sv-cta .sv-in>*{position:relative}
.pg-sv .sv-cta .btn:not(.btn-ghost),.pg-sv .sv-cta-b .btn:not(.btn-ghost){background:var(--grad)!important;color:#fff!important}
/* the numbers band reads like the home page's: paper, a hairline, numbers in the mark's gradient */
.pg-sv .sv-stats{color:var(--ink);background:transparent;box-shadow:none;clip-path:none;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pg-sv .sv-stats .sgo-stat-number{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.pg-sv .sv-stats .sgo-stat-label{color:var(--mute)}
.pg-sv .sv-stats .sgo-stat-cube{box-shadow:inset -1px 0 0 var(--line)}
.pg-sv .sv-stats .sgo-stat-cube:first-child{box-shadow:none}
.pg-sv .sv-stats+.sv-steps,.pg-sv .sv-steps+.sv-stats{padding-top:clamp(64px,8.4vw,136px)}
/* the process stays a black chapter, like the home page's, without the violet haze */
.pg-sv .sv-steps::before{background:radial-gradient(50% 60% at 50% 0%,rgba(255,255,255,.05),transparent 70%)}
.pg-sv .sv-steps .sv-n{color:rgba(255,255,255,.55)}
.pg-sv .sv-steps .pg-card::before{background:none!important;-webkit-text-fill-color:currentColor;color:#fff}
.pg-sv .sv-steps .sv-head[data-n]::before{-webkit-text-stroke-color:rgba(255,255,255,.12)}
/* cards: black numbers, a neutral light under the pointer, the lead tile black */
.pg-sv .sgo-card::before,.pg-sv .sgo-type::before{background:none;-webkit-text-fill-color:currentColor;color:var(--ink)}
.pg-sv .sgo-card::after,.pg-sv .sgo-type::after,.pg-sv .sgo-step-card::after{background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(11,10,16,.05),transparent 60%)}
@media (hover:hover){.pg-sv .sgo-card:hover,.pg-sv .sgo-type:hover,.pg-sv .sgo-step-card:hover{box-shadow:0 0 0 1px rgba(11,10,16,.18),0 40px 70px -44px rgba(11,10,16,.35)}}
@media (min-width:1001px){
  .pg-sv :is(.sgo-cards-grid,.sgo-types-grid):has(>:nth-child(4)):not(:has(>:nth-child(3n):last-child))>:first-child::before{color:#fff}
  .pg-sv :is(.sgo-cards-grid,.sgo-types-grid):has(>:nth-child(4)):not(:has(>:nth-child(3n):last-child))>:first-child::after{background:radial-gradient(520px circle at var(--mx,20%) var(--my,0%),rgba(255,255,255,.08),transparent 60%)}
}
.pg-sv .sv-head[data-n]::before{-webkit-text-stroke-color:rgba(11,10,16,.1)}
.pg-sv .sgo-pricing-table th.sgo-recommended{background:#0B0A10;box-shadow:inset 0 3px 0 #9B2D94}
/* the page heads sit on a grey photograph, like the home page's film, so a client's colours never tint the chapter */
.ih-img{filter:grayscale(1) contrast(1.06) brightness(.92)}

/* ================= v6.8 app feel: a chapter navigator and a first-visit hint ================= */
.chx{position:fixed;z-index:44;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translate(-50%,140%);transition:transform .6s var(--ease-2,cubic-bezier(.22,1,.36,1));direction:rtl;max-width:calc(100vw - 32px)}
.chx.on{transform:translate(-50%,0)}
.chx-b{position:relative;display:flex;align-items:center;gap:12px;height:52px;max-width:100%;padding:0 22px 0 20px;border-radius:999px;background:rgba(11,10,16,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#fff;box-shadow:0 18px 40px -18px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.08);overflow:hidden;cursor:pointer}
.chx-p{position:absolute;inset:auto 0 0 0;height:2px;background:var(--grad);transform-origin:right;transform:scaleX(0)}
.chx-n{font:700 15px/1 var(--display);letter-spacing:.04em;color:#B7A6F0}
.chx-t{min-width:0;max-width:42ch;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:500 15px/1 var(--display)}
.chx-b em{font-style:normal;font:500 13px/1 var(--display);color:rgba(255,255,255,.45)}
.chx-b::after{content:"";width:7px;height:7px;margin-inline-start:4px;border:solid rgba(255,255,255,.7);border-width:1.5px 1.5px 0 0;transform:rotate(-45deg) translateY(2px);transition:transform .4s var(--ease)}
.chx.open .chx-b::after{transform:rotate(135deg) translate(2px,2px)}
.chx-list{position:absolute;bottom:calc(100% + 10px);left:50%;width:min(420px,calc(100vw - 32px));max-height:min(62vh,520px);overflow:auto;margin:0;padding:8px;list-style:none;border-radius:22px;background:#0B0A10;box-shadow:0 30px 70px -20px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.08);transform:translateX(-50%)}
.chx-list[hidden]{display:none}
.chx.open .chx-list{animation:chxIn .35s var(--ease) both}
@keyframes chxIn{from{opacity:0;transform:translate(-50%,12px)}}
.chx-list a{display:flex;align-items:baseline;gap:12px;padding:11px 14px;border-radius:14px;color:rgba(255,255,255,.78);text-decoration:none;font:500 15.5px/1.35 var(--display)}
.chx-list a span{flex:none;font:700 12.5px/1 var(--display);letter-spacing:.06em;color:rgba(255,255,255,.4)}
.chx-list a:hover,.chx-list a.is-cur{background:rgba(255,255,255,.07);color:#fff}
.chx-list a.is-cur span{color:#B7A6F0}
@media (max-width:760px){
  .chx{bottom:calc(84px + env(safe-area-inset-bottom))}
  .chx-b{height:46px;gap:10px;padding:0 18px 0 16px}
  .chx-t{max-width:52vw;font-size:14px}
}
.ih-hint{position:absolute;z-index:3;left:50%;bottom:calc(clamp(52px,8vh,90px) + 22px);display:flex;flex-direction:column;align-items:center;gap:10px;transform:translateX(-50%);color:rgba(255,255,255,.7);font:500 12.5px/1 var(--display);letter-spacing:.14em;transition:opacity .5s,transform .6s var(--ease);animation:ihHint 1s 1.4s var(--ease) both}
.ih-hint i{position:relative;width:1.5px;height:42px;background:rgba(255,255,255,.18);overflow:hidden}
.ih-hint i::after{content:"";position:absolute;inset:0;background:#fff;transform:translateY(-100%);animation:ihHintLine 1.8s 1.8s cubic-bezier(.65,0,.35,1) infinite}
.ih-hint.gone{opacity:0;transform:translate(-50%,12px);pointer-events:none}
@keyframes ihHint{from{opacity:0;transform:translate(-50%,10px)}}
@keyframes ihHintLine{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}
@media (prefers-reduced-motion:reduce){.ih-hint{display:none}.chx{transition:none}}
.chx-b em,.chx-n{white-space:nowrap;flex:none}
@media (max-width:760px){.ih-hint{display:none}}

/* v7.3 project page */
.ih-pj .ih-t{max-width:14ch}
.pj{padding-block:clamp(40px,6vw,96px)}
.pj-shot{margin:0 0 clamp(36px,5vw,72px);border-radius:clamp(14px,1.4vw,22px);overflow:hidden;background:#0B0A10;box-shadow:0 50px 100px -40px rgba(11,10,16,.45),0 0 0 1px rgba(11,10,16,.08)}
.pj-bar{display:flex;align-items:center;gap:7px;height:38px;padding-inline:16px;background:#16141c}
.pj-bar i{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.18)}
.pj-bar span{margin-inline:auto;padding:4px 18px;border-radius:99px;background:rgba(255,255,255,.07);font-size:12.5px;color:rgba(255,255,255,.6);direction:ltr}
.pj-shot img{display:block;width:100%;height:auto}
.pj-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(28px,5vw,88px);align-items:start}
.pj-txt{font-size:clamp(17px,1.3vw,20px);line-height:1.75;color:#2a2833}
.pj-txt p{margin:0 0 1em}
.pj-side{position:sticky;top:110px;display:flex;flex-direction:column;gap:12px;padding:clamp(22px,2vw,30px);border-radius:var(--r,18px);background:#fff;box-shadow:0 0 0 1px rgba(11,10,16,.08),0 30px 60px -40px rgba(11,10,16,.35)}
.pj-meta{margin:0 0 10px}
.pj-m{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:13px 0;border-bottom:1px solid rgba(11,10,16,.08)}
.pj-m dt{font-size:14px;color:rgba(11,10,16,.55)}
.pj-m dd{margin:0;font-weight:700;text-align:left}
.pj-m dd a{color:inherit}
.pj-sw{display:flex;gap:6px}
.pj-sw i{width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(11,10,16,.12)}
.pj-more{margin-top:clamp(56px,8vw,120px);padding-top:clamp(32px,4vw,56px);border-top:1px solid rgba(11,10,16,.1)}
.pj-more-h{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:clamp(20px,2.4vw,34px)}
.pj-more-h .pg-h{margin:0}
.pj-more-h a{color:inherit;font-weight:600}
@media (max-width:860px){.pj-grid{grid-template-columns:1fr}.pj-side{position:static}}
/* v7.3 contact page */
.cx{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(32px,6vw,110px);align-items:start;padding-block:clamp(44px,6vw,100px)}
.cx-intro{font-size:clamp(17px,1.3vw,20px);line-height:1.7;color:#2a2833}
.cx-intro .pg-h{margin-top:.2em}
.cx-note{font-size:15px;color:rgba(11,10,16,.6)}
.cx-ways{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.cx-ways a,.cx-hours{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 16px;padding:clamp(20px,2vw,28px);border-radius:var(--r,18px);background:#fff;color:#0B0A10;text-decoration:none;box-shadow:0 0 0 1px rgba(11,10,16,.08);transition:box-shadow .3s,transform .4s var(--ease,ease)}
.cx-ways span{grid-column:1;font-size:13px;letter-spacing:.08em;color:rgba(11,10,16,.5)}
.cx-ways b{grid-column:1;font:700 clamp(19px,1.7vw,26px)/1.25 var(--display,inherit);overflow-wrap:anywhere}
.cx-ways b[dir=ltr]{text-align:right}
.cx-ways i{grid-column:2;grid-row:1/3;font-style:normal;font-size:22px;color:var(--m,#9B2D94);transition:transform .35s var(--ease,ease)}
.cx-ways a:hover{box-shadow:0 0 0 1px rgba(11,10,16,.18),0 24px 50px -30px rgba(11,10,16,.35);transform:translateY(-2px)}
.cx-ways a:hover i{transform:translateX(-5px)}
.cx-ways a:focus-visible{outline:2px solid var(--m,#9B2D94);outline-offset:3px}
.cx-hours{background:#0B0A10;color:#fff}
.cx-hours span{color:rgba(255,255,255,.55)}
.cx-hours b{font-size:clamp(16px,1.3vw,19px)}
@media (max-width:860px){.cx{grid-template-columns:1fr}}
/* contact page: the ways to reach us already stand as cards above, the closing keeps only the form */
body.page-id-1872 .contact .ct-ways{display:none}
/* v7.5 tools by name, not meters */
.pg-chip{display:inline-flex;align-items:center;margin:0 0 8px 8px;padding:8px 14px;border-radius:99px;background:#fff;box-shadow:0 0 0 1px rgba(11,10,16,.1);font-size:14.5px;font-weight:600;color:#0B0A10}

/* v7.9 project page, results-led */
.pj{padding-block:clamp(28px,4vw,64px) 0}
.pj>.wrap,.pj .pj-scroll .wrap,.pj-mob .wrap{width:min(100%,1320px);margin-inline:auto}
.pj-facts-w{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;padding-bottom:clamp(28px,3.4vw,48px);border-bottom:1px solid rgba(11,10,16,.1)}
.pj-facts{display:flex;flex-wrap:wrap;gap:16px clamp(24px,3.4vw,56px);margin:0;padding:0;list-style:none}
.pj-facts li{display:flex;flex-direction:column;gap:6px}
.pj-facts span{font-size:12.5px;letter-spacing:.06em;color:rgba(11,10,16,.5)}
.pj-facts b{font:700 clamp(15px,1.15vw,18px)/1.3 var(--display,inherit);color:#0B0A10}
.pj-facts b a{color:inherit}
.pj-acts{display:flex;flex-wrap:wrap;gap:10px}
.pj-sw{display:flex;gap:6px}
.pj-sw i{width:22px;height:22px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(11,10,16,.14)}
.pj-shot{margin:clamp(28px,4vw,60px) auto 0;border-radius:clamp(12px,1.2vw,20px);overflow:hidden;background:#0B0A10;box-shadow:0 60px 120px -50px rgba(11,10,16,.5),0 0 0 1px rgba(11,10,16,.08)}
.pj-shot img{display:block;width:100%;height:auto}
.pj-txt-w{display:grid;grid-template-columns:minmax(0,.55fr) minmax(0,1.45fr);gap:clamp(20px,4vw,72px);padding-block:clamp(48px,7vw,110px)}
.pj-txt{font-size:clamp(18px,1.45vw,22px);line-height:1.75;color:#2a2833;max-width:68ch}
.pj-txt p{margin:0 0 1em}
/* the whole site scrolls inside the frame */
.pj-scroll{height:260vh;position:relative}
.pj-scroll-pin{position:sticky;top:calc(var(--hdr,72px) + 8px);padding-top:4px}
.pj-scroll .kicker{margin:0 0 12px}
.pj-full{margin:0}
.pj-full-v{height:calc(100vh - var(--hdr,72px) - 120px);overflow:hidden;background:#fff}
.pj-full-i{transform:translateY(calc(var(--p,0) * -1 * (100% - (100vh - var(--hdr,72px) - 120px))));will-change:transform}
/* the phone */
.pj section.pj-mob{padding-block:clamp(64px,8vw,130px);background:#0B0A10;color:#fff;margin-top:clamp(40px,5vw,80px)}
.pj-mob .kicker{color:rgba(255,255,255,.6)}
.pj-mob .pg-h{color:#fff;margin:.2em 0 0}
.pj-phones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,3vw,48px);margin-top:clamp(28px,4vw,56px);align-items:start}
.pj-phone{margin:0;padding:clamp(6px,.7vw,10px);border-radius:clamp(26px,2.6vw,44px);background:#1b1924;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1),0 40px 80px -40px rgba(0,0,0,.8);transform:translateY(calc(var(--i) * 48px))}
.pj-phone img{display:block;width:100%;height:auto;border-radius:clamp(20px,2vw,34px)}
.pj-cta{padding-block:clamp(64px,8vw,120px)}
.pj-cta-in{text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px}
.pj-cta-in p{margin:0;max-width:48ch;font-size:clamp(16px,1.3vw,19px);color:rgba(11,10,16,.7)}
.pj-more{padding-bottom:clamp(48px,6vw,96px)}
@media (max-width:860px){
  .pj-txt-w{grid-template-columns:1fr}
  .pj-scroll{height:220vh}
  .pj-phones{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .pj-phone{transform:translateY(calc(var(--i) * 18px));padding:4px;border-radius:20px}
  .pj-phone img{border-radius:16px}
  .pj-facts-w{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){.pj-scroll{height:auto}.pj-scroll-pin{position:static}.pj-full-v{overflow-y:auto}.pj-full-i{transform:none}}
.pj-phones{max-width:940px;margin-inline:auto}
.pj section.pj-cta{padding-block:clamp(64px,8vw,120px) clamp(32px,4vw,56px)}
/* v8.0 numbers never cut: gradient text paints only inside its box, so the box must hold every glyph */
.pg-sv .sv-stats .sgo-stat-number,.sgo-stat-number{padding-inline:.06em;margin-inline:-.06em;overflow:visible}

/* v8.1 pricing: each card carries only what sets it apart; what every plan includes sits once, under the row */
.pg-price{padding:clamp(22px,2vw,28px)}
.pg-price-v{margin:14px 0 12px}
.pg-price .pg-list li{padding:9px 0 9px;font-size:15px;line-height:1.4}
.pg-price .pg-list li:first-child{border-top:0}
.pg-price .pg-list{border-top:1px solid var(--line)}
.pg-common{margin-top:clamp(16px,2vw,24px);padding:clamp(18px,2vw,26px) clamp(20px,2.4vw,32px);border-radius:var(--r);background:#fff;box-shadow:0 0 0 1px var(--line)}
.pg-common-t{margin:0 0 12px;font:700 clamp(17px,1.3vw,19px)/1.3 var(--display)}
.pg-common-l{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px 28px;margin:0;padding:0;list-style:none}
.pg-common-l li{position:relative;font-size:15px;line-height:1.45;color:var(--ink)}
/* phones: the plans sit side by side and the reader swipes between them, instead of four screens of lists */
@media (max-width:760px){
  .pg-row.pg-tiles:has(.pg-price){display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;margin-inline:-16px;padding:4px 16px 14px;scrollbar-width:none}
  .pg-row.pg-tiles:has(.pg-price)::-webkit-scrollbar{display:none}
  .pg-row.pg-tiles:has(.pg-price)>.pg-col{flex:0 0 84%;scroll-snap-align:center;min-width:0}
  .pg-common-l{grid-template-columns:1fr}
}

/* the article typography gives every li a margin; inside cards and the shared strip the rows set their own rhythm */
.sheet .pg-price .pg-list li,.sheet .pg-common-l li,.pg-price .pg-list li,.pg-common-l li{margin:0}
.pg-common-l{row-gap:12px}
@media (max-width:760px){.pg-common-l{grid-template-columns:1fr 1fr;gap:10px 16px}.pg-common-l li{font-size:14px}}
.pg-pager{flex-wrap:wrap;align-items:center}
.pg-pager i{font-style:normal;color:var(--mute,#5b5866);padding:0 2px}
.pg-pager .pg-pager-x{font-size:18px}

/* v8.2 the project stage: the live site on a big screen with its phone beside it, lit by the project's own colour */
.pj-stage{position:relative;margin-top:clamp(32px,5vw,80px);perspective:2400px;--s:1}
.pj-stage::before{content:"";position:absolute;inset:8% 6% 0;border-radius:50%;background:radial-gradient(closest-side,var(--pc,#5b5bd6),transparent);opacity:.28;filter:blur(60px);pointer-events:none;z-index:0}
.pj-stage-in{position:relative;z-index:1;padding-bottom:clamp(28px,5vw,80px)}
.pj-lap{position:relative;margin:0;border-radius:clamp(12px,1.2vw,20px);overflow:hidden;background:#0B0A10;box-shadow:0 80px 140px -60px rgba(11,10,16,.55),0 0 0 1px rgba(11,10,16,.08);transform-origin:50% 100%;transform:rotateX(calc((1 - var(--s)) * 16deg)) scale(calc(.92 + var(--s) * .08));will-change:transform}
.pj-lap img{display:block;width:100%;height:auto}
.pj-stage-ph{position:absolute;bottom:0;left:clamp(-8px,-1.5vw,0px);width:clamp(118px,17%,250px);margin:0;padding:clamp(5px,.55vw,9px);border-radius:clamp(22px,2.4vw,40px);background:#1b1924;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),0 50px 90px -30px rgba(11,10,16,.7);transform:translateY(calc((1 - var(--s)) * 90px)) rotate(calc((1 - var(--s)) * -6deg));will-change:transform}
.pj-stage-ph img{display:block;width:100%;height:auto;border-radius:clamp(17px,1.9vw,32px)}
@media (max-width:760px){
  .pj-stage-in{padding-bottom:48px}
  .pj-stage-ph{width:30%;left:6px;bottom:0}
  .pj-lap{transform:rotateX(calc((1 - var(--s)) * 10deg))}
}
@media (prefers-reduced-motion:reduce){.pj-lap,.pj-stage-ph{transform:none}}
@media (max-width:760px){
  .pj-stage-in{padding-bottom:64px}
  .pj-stage-ph{width:24%;left:2px;bottom:0;padding:3px;border-radius:16px}
  .pj-stage-ph img{border-radius:13px}
}
@media (min-width:761px){.pj-stage-ph{bottom:-2%}}

/* v8.2 related guides: the pages that point here, linked back */
.rel-l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:12px}
.rel-l a{display:flex;align-items:center;justify-content:space-between;gap:14px;height:100%;padding:18px 20px;border-radius:16px;background:#fff;color:var(--ink,#0B0A10);text-decoration:none;font-weight:600;line-height:1.45;box-shadow:0 0 0 1px rgba(11,10,16,.08),0 18px 36px -28px rgba(11,10,16,.35);transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s}
.rel-l i{font-style:normal;color:#7b3fe4;transition:transform .4s cubic-bezier(.22,1,.36,1)}
@media (hover:hover){.rel-l a:hover{transform:translateY(-2px);box-shadow:0 0 0 1px rgba(123,63,228,.35),0 24px 44px -28px rgba(11,10,16,.45)}.rel-l a:hover i{transform:translateX(-4px)}}
.sv-extra .sv-body{max-width:none}

/* v8.2 (CRO R15) a way in on every price card, and a short one between long reads */
.pg-price{display:flex;flex-direction:column}
.pg-price .pg-pick{margin-top:auto;align-self:stretch;margin-block-start:18px}
.sv-mini{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;margin:clamp(8px,2vw,24px) 0 clamp(28px,4vw,56px);padding:clamp(18px,2.2vw,26px) clamp(20px,2.6vw,34px);border-radius:20px;background:#0B0A10;color:#fff;box-shadow:0 30px 60px -40px rgba(11,10,16,.6)}
.sv-mini p{margin:0;font:700 clamp(17px,1.5vw,21px)/1.35 var(--display,inherit)}
.sv-mini .sv-cta-b{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.sv-mini .sv-cta-tel{color:rgba(255,255,255,.8)}
.sv-mini .btn-ghost{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.25)}
@media (max-width:760px){.sv-mini{flex-direction:column;align-items:stretch;text-align:center}.sv-mini .sv-cta-b{justify-content:center}}
/* v8.2 owner bug "כפתור לא תקין": the in-content link colour (purple, underlined) is stronger than .btn and painted button
   labels purple on the purple gradient. Buttons inside content keep their own colours */
:is(.pg-sv .sv-body,.pg-txt,.ar-body) a.btn{color:#fff;text-decoration:none}
:is(.pg-sv .sv-body,.pg-txt,.ar-body) a.btn.btn-ghost{color:inherit}
@media (hover:hover){:is(.pg-sv .sv-body,.pg-txt,.ar-body) a.btn.btn-ghost:hover{color:#fff}}

/* v8.4 projects gallery: filter chips, kind label on each card, ask tiles */
.pj-filter{display:flex;flex-wrap:wrap;gap:8px;margin:clamp(20px,2.4vw,30px) 0 0}
.pj-chip{appearance:none;-webkit-appearance:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border:1px solid rgba(20,17,28,.14);border-radius:999px;background:#fff;color:var(--ink);font-family:inherit;font-size:15px;font-weight:600;line-height:1;cursor:pointer;white-space:nowrap;transition:background-color .25s,color .25s,border-color .25s}
.pj-chip i{font-style:normal;font-size:12px;font-weight:700;opacity:.55;font-variant-numeric:tabular-nums}
.pj-chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.pj-chip[aria-pressed="true"] i{opacity:.75}
.pj-chip:focus-visible{outline:2px solid #7B3FE4;outline-offset:3px}
@media (hover:hover){.pj-chip[aria-pressed="false"]:hover{border-color:#7B3FE4;color:#5B21B6}}
.pj-count{min-height:1.4em;margin:12px 0 0;color:var(--mute,#5b5866);font-size:14px}
.pj-grid{transition:opacity .2s ease}
.pj-grid.pj-fade{opacity:0}
.pj-grid .pj-out{display:none!important}
.pj-grid .pj-in{animation:pjIn .55s cubic-bezier(.16,1,.3,1) both}
@keyframes pjIn{from{opacity:0;transform:translateY(22px)}}
.pj-grid .pg-pc-img{position:relative}
.pg-pc-k{position:absolute;top:12px;right:12px;padding:7px 11px;border-radius:999px;background:rgba(11,10,16,.74);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font-size:12px;font-weight:600;line-height:1;letter-spacing:.01em}
.pj-grid .pg-pc{border-radius:calc(var(--r) + 4px)}
@media (hover:hover){.pj-grid a.pg-pc .pg-pc-t{transition:color .25s}.pj-grid a.pg-pc:hover .pg-pc-t{color:#5B21B6}}
.pj-ask{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 28px;margin:clamp(6px,1vw,12px) 0;padding:clamp(24px,3vw,38px) clamp(22px,3.4vw,46px);border-radius:calc(var(--r) + 8px);background:#0B0A10;color:#fff}
.pj-ask b{flex:1 1 360px;font:700 clamp(20px,2vw,28px)/1.25 var(--display)}
.pj-ask>span{flex:1 1 260px;color:rgba(255,255,255,.72);font-size:16px;line-height:1.55}
.pj-ask .btn{flex:0 0 auto}
@media (max-width:700px){
  .pj-filter{flex-wrap:nowrap;overflow-x:auto;margin-inline:-16px;padding:2px 16px 6px;scrollbar-width:none;scroll-snap-type:x proximity}
  .pj-filter::-webkit-scrollbar{display:none}
  .pj-chip{scroll-snap-align:start;flex:0 0 auto}
  .pj-ask .btn{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){.pj-grid,.pj-grid .pj-in{transition:none;animation:none}}
/* v8.4b the gallery is an even grid, never the alternating "selected works" rhythm it sat inside */
.pj-grid.pg-proj,.pg-main .pj-grid.pg-proj,.pg-sv .sv-work .pj-grid.pg-proj{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(30px,3vw,44px) clamp(16px,1.8vw,26px);align-items:start}
.pg-sv .pj-grid .pg-pc,.pg-sv .sv-work .pj-grid .pg-pc:nth-child(even),.pj-grid .pg-pc{margin-top:0;grid-column:auto}
.pg-sv .sv-work .pj-grid .pg-pc-img,.pj-grid .pg-pc-img{aspect-ratio:3/2;border-radius:calc(var(--r) + 4px)}
.pg-sv .sv-work .pj-grid .pg-pc-t,.pj-grid .pg-pc-t{margin-top:14px;font:700 clamp(17px,1.25vw,20px)/1.3 var(--display)}
.pg-sv .sv-work .pj-grid .pg-pc-d,.pj-grid .pg-pc-d{margin-top:6px;font-size:15px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pg-sv .pj-grid .pj-ask{grid-column:1/-1}
@media (max-width:1100px){.pj-grid.pg-proj,.pg-main .pj-grid.pg-proj,.pg-sv .sv-work .pj-grid.pg-proj{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.pj-grid.pg-proj,.pg-main .pj-grid.pg-proj,.pg-sv .sv-work .pj-grid.pg-proj{grid-template-columns:1fr}}
@media (max-width:700px){.pj-filter{-webkit-mask-image:linear-gradient(to left,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to left,#000 calc(100% - 28px),transparent)}}
/* v8.4 summary boxes carry their own ✓: one marker per line, never a diamond beside it */
.pg-sv :is(.sgo-answer-box,.sgo-key-takeaways) ul>li:has(>span:first-child)::before{display:none}
.pg-sv :is(.sgo-answer-box,.sgo-key-takeaways) ul>li>span:first-child{position:absolute;inset-inline-start:0;top:0;color:#7B3FE4;font-weight:800}
/* v8.4 breadcrumbs and contents links large enough for a finger, nothing moves visually */
@media (max-width:760px){
  .pg-bc a{display:inline-flex;align-items:center;min-height:36px}
  .sgo-toc li a{display:inline-flex;align-items:center;min-height:40px}
  .sgo-toc li{margin-block:0!important}
}
@media (max-width:760px){
  .pg-bc a{padding-inline:4px;margin-inline:-4px}
  .sgo-related li a{display:inline-flex;align-items:center;min-height:40px}
}
@media (max-width:760px){
  .pj-facts b a{display:inline-flex;align-items:center;min-height:36px}
  .pj-more-h a{display:inline-flex;align-items:center;min-height:40px}
}
/* v8.5 phone: the 3D mark sits in its own band; the breadcrumbs start clear of it */
@media (max-width:760px){html.has-3d .ih .ph-in>.pg-bc:first-child{margin-top:16px}}
/* v8.5 the browser lays out and paints only what is near the screen: a page change (and a first load) no longer pays
   for the whole page. `auto` remembers each block's real size once it has been seen, so the scrollbar stays steady. */
.pg-sv .sv~.sv,.pj-grid .pg-pc:nth-child(n+7),.sv-rel,.pj>section~section,.ar-body>*:nth-child(n+12){content-visibility:auto;contain-intrinsic-size:auto 700px}
.pj-grid .pg-pc:nth-child(n+7){contain-intrinsic-size:auto 340px}
.ar-body>*:nth-child(n+12){contain-intrinsic-size:auto 120px}

/* v8.6 contrast: same hue, a step lighter so small text clears 4.5:1 */
.chx-b em{color:rgba(255,255,255,.52)}
.pj-svc{font-weight:600;color:var(--ink);text-decoration:underline;text-underline-offset:4px;padding:10px 4px}
@media (hover:hover){.pj-svc:hover{color:var(--m)}}

/* v8.8 regional landing pages */
.ih-reg .reg-k{display:inline-flex;align-items:center;gap:10px;margin:0 0 14px;padding:7px 14px;border-radius:99px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);font:600 13.5px/1 var(--display);color:#fff}
.ih-reg .reg-k i{width:5px;height:5px;border-radius:50%;background:var(--grad)}
.ih-reg .ih-s p:not(.reg-k){max-width:52ch}
.reg{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(36px,4vw,64px);align-items:start;padding-top:clamp(36px,4vw,64px)}
.reg .art{max-width:none;margin:0;padding-bottom:clamp(40px,6vh,80px)}
.reg .ar-body{max-width:74ch}
.reg-side{position:sticky;top:calc(var(--hdr) + 28px);display:grid;gap:18px}
.reg-card{display:grid;gap:12px;padding:26px 24px;border-radius:calc(var(--r) + 6px);background:radial-gradient(120% 90% at 100% 0%,rgba(155,45,148,.28),transparent 60%),#0B0A10;color:#fff;box-shadow:0 30px 60px -30px rgba(11,10,16,.55)}
.reg-card-k{margin:0;font:600 12.5px/1.2 var(--display);letter-spacing:.04em;color:rgba(255,255,255,.66)}
.reg-card-t{margin:0;font:700 22px/1.25 var(--display)}
.reg-card-p{margin:0;font-size:15px;line-height:1.6;color:rgba(255,255,255,.76)}
.reg-card .btn{justify-content:center;margin-top:6px}
.reg-tel{justify-self:center;padding:8px;font:600 14.5px/1 var(--display);color:#fff;text-decoration:none;opacity:.85}
.reg-areas{display:flex;flex-wrap:wrap;gap:8px;padding:20px;border-radius:calc(var(--r) + 6px);background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.reg-areas p{flex-basis:100%;margin:0 0 4px;font:700 15px/1.2 var(--display);color:var(--ink)}
.reg-areas a,.reg-chips a{display:inline-flex;align-items:center;min-height:38px;padding:8px 14px;border-radius:99px;background:#F4F3F7;font:600 14px/1.2 var(--display);color:var(--ink);text-decoration:none;transition:background .25s,color .25s}
.reg-areas a.reg-up,.reg-chips a.reg-up{background:var(--ink);color:#fff}
@media (hover:hover){.reg-areas a:hover,.reg-chips a:hover{background:#ECE6F2;color:var(--m)}.reg-areas a.reg-up:hover,.reg-chips a.reg-up:hover{background:#2a2633;color:#fff}}
.reg-after{padding-block:clamp(36px,5vw,72px) 0}
.reg-after .pj-more-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.reg-rv .rq{margin-top:clamp(20px,2.4vw,32px)}
.reg-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.reg-more{padding-bottom:clamp(64px,8vw,120px)}
@media (max-width:1060px){.reg{grid-template-columns:minmax(0,1fr)}.reg-side{position:static;grid-template-columns:1fr 1fr}}
@media (max-width:760px){.reg-side{grid-template-columns:1fr}.reg-card{display:none}.reg .reg-areas{display:none}}

/* v8.8 tables on phones: a stack of cards, nothing cut off at the side, no sideways scroll */
@media (max-width:760px){
main :is(.sgo-table-wrap,.sgo-pricing-wrap,.sgo-cmp-wrap):has(table.is-cards){overflow:visible!important}
main table.is-cards{display:block!important;width:100%!important;min-width:0!important;margin-inline:0!important;background:none!important;box-shadow:none!important;border-radius:0!important;overflow:visible!important;font-size:15px}
main table.is-cards thead,main table.is-cards tr.tc-head{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
main table.is-cards tbody{display:grid;gap:12px}
main table.is-cards tr{display:block;border-radius:18px;background:#fff;box-shadow:0 0 0 1px var(--line),0 14px 30px -22px rgba(11,10,16,.35);overflow:hidden}
main table.is-cards td,main table.is-cards tbody th{display:grid;grid-template-columns:minmax(0,42%) minmax(0,1fr);gap:14px;align-items:baseline;width:auto!important;padding:12px 16px!important;border:0!important;border-top:1px solid var(--line)!important;background:#fff!important;color:#2E2A3A!important;text-align:start!important;font-weight:400}
main table.is-cards td::before,main table.is-cards tbody th::before{content:attr(data-label);font:600 13px/1.45 var(--display);color:#6B6778}
main table.is-cards td:first-child,main table.is-cards tbody th:first-child{display:block;border-top:0!important;background:#0B0A10!important;color:#fff!important;font:700 16px/1.35 var(--display)}
main table.is-cards td:first-child::before,main table.is-cards tbody th:first-child::before{content:none}
main table.is-cards td:first-child *{color:#fff!important}
main table.is-cards .tc-v{min-width:0;overflow-wrap:anywhere}
}
/* v8.8 links in running text: a deeper purple with a quiet underline that fills in on hover */
.pg-txt a,.ar-body a,.pg-sv .sv-body a{color:#74266F;text-decoration:underline;text-decoration-color:rgba(155,45,148,.35);text-decoration-thickness:1px;text-underline-offset:4px;transition:color .2s,text-decoration-color .2s}
@media (hover:hover){.pg-txt a:hover,.ar-body a:hover,.pg-sv .sv-body a:hover{color:#9B2D94;text-decoration-color:currentColor}}
.pg-txt a:focus-visible,.ar-body a:focus-visible,.pg-sv .sv-body a:focus-visible{outline:2px solid #9B2D94;outline-offset:3px;border-radius:3px}

/* v8.8 the short answer at the top of a service page */
.pg-sv .sgo-atomic-answer{grid-column:1/-1;margin:clamp(20px,2.4vw,32px) 0 0;padding:22px 26px;border-radius:calc(var(--r) + 4px);background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 24px 50px -36px rgba(11,10,16,.35);border-inline-start:4px solid var(--m);font:400 clamp(16px,1.15vw,18px)/1.7 var(--body);color:#2B2836;max-width:none}
.pg-sv .sgo-atomic-answer strong{color:var(--ink);font-weight:700}

/* v9.1 About and every page built from the old blocks: value and tool cards share the card grid instead of one wide card a row */
.pg-sv .sgo-vals-grid,.pg-sv .sgo-ait-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:clamp(14px,1.4vw,22px);margin:clamp(20px,2.6vw,36px) 0 0;counter-reset:card;max-width:none!important}
.pg-sv .sgo-vals-grid .sgo-card h3,.pg-sv .sgo-ait-grid .sgo-card h3{margin:0 0 10px;font:700 clamp(19px,1.4vw,22px)/1.25 var(--display);color:var(--ink)}
.pg-sv .sgo-vals-grid .sgo-card::before,.pg-sv .sgo-ait-grid .sgo-card::before{margin-bottom:clamp(18px,2vw,28px)}
/* a row of technology names: they wrap as pills, never squeezed into circles or pushed off the screen */
.pg-row:has(>.pg-col>.pg-chip){display:flex;flex-wrap:wrap;gap:8px}
.pg-row:has(>.pg-col>.pg-chip)>.pg-col{display:contents}
.pg-chip{flex:0 0 auto!important;margin:0;white-space:nowrap;unicode-bidi:isolate}
.pg-sv .sv-body>.pg-chip,.pg-sv .sv-body p+.pg-chip{margin:0 0 8px 8px}
/* v9.1b hidden means gone: on phones the navigator floats 84px up, so sliding it down by its own height left it in view */
.chx{opacity:0;visibility:hidden;transition:transform .6s var(--ease-2,cubic-bezier(.22,1,.36,1)),opacity .3s ease,visibility 0s linear .6s}
.chx.on{opacity:1;visibility:visible;transition:transform .6s var(--ease-2,cubic-bezier(.22,1,.36,1)),opacity .3s ease,visibility 0s}
@media (prefers-reduced-motion:reduce){.chx,.chx.on{transition:none}}
/* v9.3 the heading reveal leaves room at both sides: a final letter whose tail reaches past its box (ן, ך) is never cut */
.sv-js .pg-sv .sv .sv-head>:is(h2,h3){clip-path:inset(-.2em -.3em -.3em 100%)}
.sv-js .pg-sv .sv.in .sv-head>:is(h2,h3){clip-path:inset(-.2em -.3em -.3em -.3em)}

/* v9.3 the closing "why SGO" note reads in the text face like the rest of the page */
.pg-sv .sv-trust :is(p,li){font-family:var(--body)!important;font-weight:400!important;letter-spacing:0!important}
/* v9.3 the city list as rows: the link, and under it its one-line description */
.pg-sv .sgo-city-cluster ul:has(.cc-row){list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:10px}
.pg-sv .sgo-city-cluster li.cc-row{display:grid;gap:4px;margin:0;padding:16px 18px;border-radius:16px;background:#fff;box-shadow:0 0 0 1px var(--line)}
.pg-sv .sgo-city-cluster li.cc-row::before{display:none}
.pg-sv .sgo-city-cluster li.cc-row>a{display:inline;min-height:0;padding:0;border-radius:0;background:none;box-shadow:none;font:700 16px/1.3 var(--display);color:var(--ink);text-decoration:none}
.pg-sv .sgo-city-cluster li.cc-row .cc-d{font-size:14.5px;line-height:1.5;color:#5C5868}
@media (hover:hover){.pg-sv .sgo-city-cluster li.cc-row:hover{box-shadow:0 0 0 1px rgba(155,45,148,.45)}.pg-sv .sgo-city-cluster li.cc-row:hover>a{color:var(--m)}}

/* v9.4 the marquee carries client logos, all at one optical size */
.pg-sv .sv-logos{padding-block:clamp(28px,3.4vw,52px)}
.pg-sv .sv-logos .mq{animation-duration:48s}
.pg-sv .sv-logos .mq-t li{font-size:0;-webkit-text-stroke:0;padding-inline:clamp(22px,3vw,48px)!important}
.pg-sv .sv-logos .mq-t li::after{display:none}
.pg-sv .sv-logos img{display:block;height:clamp(34px,3.4vw,46px);width:auto;max-width:none;opacity:.55;filter:grayscale(1);transition:opacity .35s,filter .35s}
@media (hover:hover){.pg-sv .sv-logos li:hover img{opacity:1;filter:none}}
@media (prefers-reduced-motion:reduce){.pg-sv .sv-logos .mq{animation:none;flex-wrap:wrap;width:auto;justify-content:center}.pg-sv .sv-logos .mq-t[aria-hidden]{display:none}.pg-sv .sv-logos .mq-t{flex-wrap:wrap;justify-content:center;row-gap:20px}}

/* v9.6 optical sizing per logo (--k) and enough contrast that thin marks never wash out */
.pg-sv .sv-logos img{height:calc(clamp(32px,3.1vw,42px) * var(--k,1));opacity:.74;filter:grayscale(1) contrast(1.15)}

/* v9.9 projects: the gallery shows each real site in a browser frame; the index is a typographic list */
.pj-view{display:inline-flex;gap:4px;margin:14px 0 0;padding:4px;border-radius:999px;background:#ECEAF1}
.pj-view button{appearance:none;-webkit-appearance:none;display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 16px;border:0;border-radius:999px;background:none;font:600 14px/1 var(--display);color:var(--ink);cursor:pointer;transition:background .3s,color .3s,box-shadow .3s}
.pj-view button[aria-pressed="true"]{background:#fff;box-shadow:0 1px 2px rgba(20,17,28,.08),0 6px 16px -8px rgba(20,17,28,.25)}
.pj-view button:focus-visible{outline:2px solid #7B3FE4;outline-offset:2px}
.pj-view i{position:relative;display:block;width:14px;height:12px}
.pjv-g{background:linear-gradient(currentColor 0 0) 0 0/6px 5px no-repeat,linear-gradient(currentColor 0 0) 100% 0/6px 5px no-repeat,linear-gradient(currentColor 0 0) 0 100%/6px 5px no-repeat,linear-gradient(currentColor 0 0) 100% 100%/6px 5px no-repeat}
.pjv-l{background:linear-gradient(currentColor 0 0) 0 0/100% 2px no-repeat,linear-gradient(currentColor 0 0) 0 50%/100% 2px no-repeat,linear-gradient(currentColor 0 0) 0 100%/100% 2px no-repeat}
.pj-grid{gap:clamp(36px,3.6vw,56px) clamp(18px,2vw,30px)}
.pj-grid .pg-pc{position:relative}
.pj-grid .pg-pc-img.pc-real{aspect-ratio:auto;background:#fff;border-radius:calc(var(--r) + 2px);box-shadow:0 0 0 1px rgba(20,17,28,.08),0 24px 50px -30px rgba(20,17,28,.45);transition:transform .7s var(--ease),box-shadow .7s var(--ease)}
.pc-bar{display:flex;align-items:center;gap:5px;height:28px;padding:0 12px;border-bottom:1px solid rgba(20,17,28,.07);background:#F6F5F9}
.pc-bar i{width:7px;height:7px;border-radius:50%;background:#D9D6E0}
.pc-bar em{flex:1;margin-inline-start:10px;overflow:hidden;font:500 11.5px/1 var(--body,inherit);font-style:normal;color:#7A7685;text-align:center;white-space:nowrap;text-overflow:ellipsis;direction:ltr}
.pc-scr{display:block;aspect-ratio:16/9;overflow:hidden}
.pc-scr img{width:100%;height:100%;object-fit:cover;object-position:top center}
.pg-pc-n{display:none}
.pg-pc-m{display:block;margin-top:16px;font:600 11.5px/1.2 var(--display);letter-spacing:.06em;color:#7A7685}
.pj-grid .pg-pc-m+.pg-pc-t{margin-top:6px}
.pj-grid .pg-pc-t{font:700 clamp(19px,1.5vw,23px)/1.25 var(--display)}
.pj-grid .pg-pc-d{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:46ch}
.pg-pc-go{display:none}
@media (hover:hover){
  .pj-grid:not(.is-list) a.pg-pc:hover .pc-real{transform:translateY(-6px);box-shadow:0 0 0 1px rgba(123,63,228,.35),0 34px 60px -30px rgba(91,33,182,.5)}
  .pj-grid:not(.is-list) a.pg-pc:hover .pc-real img{transform:scale(1.03)}
}
/* the index */
.pj-grid.is-list{display:block;border-top:1px solid rgba(20,17,28,.12)}
.pj-grid.is-list .pg-pc{display:grid;grid-template-columns:56px minmax(0,1.4fr) minmax(0,1fr) 40px;align-items:center;gap:0 20px;padding:22px 6px;border-bottom:1px solid rgba(20,17,28,.12);border-radius:0;transition:background .35s,padding .35s var(--ease)}
.pj-grid.is-list .pg-pc-img,.pj-grid.is-list .pg-pc-d{display:none}
.pj-grid.is-list .pg-pc-n{display:block;grid-row:1/3;font:600 13px/1 var(--display);color:#A9A5B3;font-variant-numeric:tabular-nums}
.pj-grid.is-list .pg-pc-t{grid-column:2;grid-row:1/3;margin:0;font:700 clamp(22px,2.6vw,40px)/1.1 var(--display);letter-spacing:-.02em}
.pj-grid.is-list .pg-pc-m{grid-column:3;grid-row:1/3;margin:0;font-size:12.5px}
.pj-grid.is-list .pg-pc-go{display:block;grid-column:4;grid-row:1/3;width:36px;height:36px;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(20,17,28,.18);background:linear-gradient(currentColor 0 0) 50% 50%/12px 1.6px no-repeat;position:relative;transition:background-color .35s,color .35s,box-shadow .35s}
.pj-grid.is-list .pg-pc-go::after{content:"";position:absolute;top:50%;left:11px;width:7px;height:7px;border-left:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:translateY(-50%) rotate(45deg)}
@media (hover:hover){
  .pj-grid.is-list a.pg-pc:hover{background:#F4F1FA;padding-inline:18px}
  .pj-grid.is-list a.pg-pc:hover .pg-pc-t{color:#5B21B6}
  .pj-grid.is-list a.pg-pc:hover .pg-pc-go{background-color:#5B21B6;color:#fff;box-shadow:none}
}
.pj-grid.is-list .pj-ask{margin:28px 0}
.pj-peek{position:fixed;left:0;top:0;z-index:70;width:clamp(280px,26vw,420px);aspect-ratio:16/10;border-radius:14px;overflow:hidden;pointer-events:none;opacity:0;scale:.86;box-shadow:0 30px 70px -20px rgba(20,17,28,.55);transition:opacity .3s ease,scale .45s cubic-bezier(.16,1,.3,1)}
.pj-peek.on{opacity:1;scale:1}
.pj-peek img{width:100%;height:100%;object-fit:cover;object-position:top center}
@media (max-width:700px){
  .pj-grid.is-list .pg-pc{grid-template-columns:34px minmax(0,1fr) 30px;padding:16px 2px}
  .pj-grid.is-list .pg-pc-t{grid-row:1;font-size:21px}
  .pj-grid.is-list .pg-pc-m{grid-column:2;grid-row:2;margin-top:6px}
  .pj-grid.is-list .pg-pc-go{grid-column:3;width:30px;height:30px}
  .pj-view{display:flex;width:max-content}
}
@media (prefers-reduced-motion:reduce){.pj-peek{display:none}}

/* v10.1 service-page process: the line follows the scroll and each step lights when it is reached */
html.st-js .pg-sv .sv-steps .pg-row::after,html.st-js .pg-sv .sv-steps .sv-body:has(>.pg-card)::after{transition:none;transform:scaleX(var(--sp,0))}
.pg-sv .sv-steps .pg-card::before{transition:opacity .7s var(--ease),filter .7s var(--ease)}
.pg-sv .sv-steps .pg-card::after{transition:background-color .5s,box-shadow .5s,transform .6s var(--ease)}
.pg-sv .sv-steps .pg-card-t,.pg-sv .sv-steps .pg-card-p{transition:opacity .6s var(--ease)}
html.st-js .pg-sv .sv-steps .pg-card:not(.on)::before{opacity:.22;filter:saturate(.3)}
html.st-js .pg-sv .sv-steps .pg-card:not(.on) .pg-card-t,html.st-js .pg-sv .sv-steps .pg-card:not(.on) .pg-card-p{opacity:.45}
html.st-js .pg-sv .sv-steps .pg-card:not(.on)::after{background:rgba(255,255,255,.28);box-shadow:0 0 0 5px rgba(255,255,255,.06)}
html.st-js .pg-sv .sv-steps .pg-card.st-cur{background:radial-gradient(80% 60% at 70% 0%,rgba(157,140,240,.16),transparent 70%)}
html.st-js .pg-sv .sv-steps .pg-card.st-cur::after{transform:scale(1.4);box-shadow:0 0 0 6px rgba(201,168,255,.22),0 0 18px 2px rgba(201,168,255,.5)}
@media (max-width:760px){
  html.st-js .pg-sv .sv-steps .pg-row::after,html.st-js .pg-sv .sv-steps .sv-body:has(>.pg-card)::after{display:none}
  .pg-sv .sv-steps .pg-card{transition:border-color .6s var(--ease)}
  html.st-js .pg-sv .sv-steps .pg-card.on{border-top-color:#C9A8FF}
}
@media (prefers-reduced-motion:reduce){.pg-sv .sv-steps .pg-card::before,.pg-sv .sv-steps .pg-card::after{transition:none!important}}

/* v10.5 the project frame fits the visible screen (svh, and above the phone's action bar), and the picture travels
   exactly its own height, so the end of the site is always seen */
.pj-full-v{height:calc(100svh - var(--hdr,72px) - 120px)}
.pj-full-i{transform:translateY(calc(var(--p,0) * -1 * var(--t,0px)))}
@media (max-width:760px){.pj-full-v{height:calc(100svh - var(--hdr,72px) - 200px)}}

/* v10.5 service pages, from the audit */
/* nothing sits glued to the grid or table above it */
.pg-sv .sv :is(.sgo-cards-grid,.sgo-types-grid,table,.pg-row,.sgo-process-grid)+*{margin-top:clamp(24px,2.6vw,36px)}
.pg-sv .sv :is(.sgo-cards-grid,.sgo-types-grid,table,.pg-row,.sgo-process-grid)+:is(h3,h4){margin-top:clamp(32px,3.4vw,48px)}
/* headings inside the long text keep a heading's leading */
.pg-sv .sv-body :is(h3,h4){line-height:1.25}
/* four cards make two rows of two, never three and an orphan */
@media (min-width:861px){.pg-sv .sv :is(.sgo-cards-grid,.sgo-types-grid):has(>:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}}
/* steps not yet reached stay readable */
html.st-js .pg-sv .sv-steps .pg-card:not(.on) .pg-card-t,html.st-js .pg-sv .sv-steps .pg-card:not(.on) .pg-card-p{opacity:.62}
html.st-js .pg-sv .sv-steps .pg-card:not(.on)::before{opacity:.32}

/* v11.7 the works, given room. Project hero: the work itself, bright, beside the title (it was a half-opacity cover under a
   dark shade). Gallery: two big columns instead of three, and every fifth work wide across the page */
.ih-pj-work{align-items:center}
.ih-pj-work .ih-shade{display:none}
.ih-pj-work .ih-bg{position:absolute;inset:calc(var(--hdr) + 36px) auto 56px clamp(20px,3.4vw,64px);width:min(54%,860px);display:flex;align-items:center;z-index:1;
  background:radial-gradient(60% 60% at 50% 55%,rgba(155,45,148,.28),rgba(97,73,148,.12) 55%,transparent 75%)}
.ih-pj-art{position:relative;width:100%;animation:pjArtIn 1.2s var(--ease) .15s both}
.ih-pj-lap{margin:0;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.1),0 50px 100px -40px rgba(0,0,0,.85),0 20px 40px -24px rgba(155,45,148,.45)}
.ih-pj-lap img{display:block;width:100%;height:auto}
.ih-pj-ph{position:absolute;left:6%;bottom:-9%;width:21%;margin:0;border-radius:24px;overflow:hidden;background:#000;border:5px solid #121016;box-shadow:0 30px 60px -20px rgba(0,0,0,.8);animation:pjPhIn 1.2s var(--ease) .45s both}
.ih-pj-ph img{display:block;width:100%;height:auto}
@media (min-width:901px){.ih-pj-work .ih-in{padding-inline-end:min(58%,900px)}}
.ih-pj-work .ih-t{max-width:12ch;font-size:clamp(40px,4.4vw,80px)}
.ih-pj-work .ih-s{max-width:520px}
@keyframes pjArtIn{from{opacity:0;transform:translateY(34px) scale(.97)}to{opacity:1;transform:none}}
@keyframes pjPhIn{from{opacity:0;transform:translateY(50px)}to{opacity:1;transform:none}}
@media (max-width:900px){
  .ih-pj-work{flex-direction:column;align-items:stretch}
  .ih-pj-work .ih-in{order:1}
  .ih-pj-work .ih-bg{position:relative;inset:auto;order:2;width:auto;margin:34px 16px 0 26px}
  .ih-pj-ph{left:-8px;width:26%;border-width:3px;border-radius:14px}
}
@media (prefers-reduced-motion:reduce){.ih-pj-art,.ih-pj-ph{animation:none}}

@media (min-width:861px){
  .pg-main .pj-grid.pg-proj-all:not(.is-list),.pj-grid.pg-proj-all:not(.is-list){grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(60px,5.6vw,96px) clamp(28px,3vw,52px);grid-auto-flow:dense}
  .pj-grid.pg-proj-all:not(.is-list) .pg-pc.pj-big{grid-column:1/-1}
  .pj-grid.pg-proj-all:not(.is-list) .pj-big .pc-scr{aspect-ratio:2.3/1}
  .pj-grid.pg-proj-all:not(.is-list) .pj-big .pc-bar{height:34px}
  .pj-grid.pg-proj-all:not(.is-list) .pg-pc-t{margin-top:18px;font-size:clamp(22px,1.9vw,30px)}
  .pj-grid.pg-proj-all:not(.is-list) .pj-big .pg-pc-t{font-size:clamp(28px,2.8vw,46px);letter-spacing:-.02em}
  .pj-grid.pg-proj-all:not(.is-list) .pg-pc-d{font-size:16.5px;max-width:62ch;-webkit-line-clamp:3}
  .pj-grid.pg-proj-all:not(.is-list) .pc-bar em{font-size:12.5px}
  .pj-grid.pg-proj-all:not(.is-list) .pg-pc .pg-pc-img.pc-real{border-radius:16px;box-shadow:0 0 0 1px rgba(20,17,28,.08),0 40px 80px -44px rgba(20,17,28,.55)}
}

/* v11.8 mobile: thumb-size hit areas for the small WhatsApp/phone text links in the service CTA card */
.pg-sv .sgo-mob-cta>div:last-child a{position:relative}.pg-sv .sgo-mob-cta>div:last-child a::after{content:"";position:absolute;inset:-13px -9px}
/* v11.8: the whole city card is the link, not only its title (it looks like a card, a thumb taps the card) */
.pg-sv .sgo-city-cluster li.cc-row{position:relative}.pg-sv .sgo-city-cluster li.cc-row>a::after{content:"";position:absolute;inset:0;border-radius:16px}.pg-sv .sgo-city-cluster li.cc-row>a:focus-visible{outline:0}.pg-sv .sgo-city-cluster li.cc-row:has(>a:focus-visible){box-shadow:0 0 0 2px var(--m)}
/* v11.9 gallery tags: readable size and AA contrast on the light page */
.pg-pc-m{font-size:12.5px;color:#615D6B}
.sv-body .tgs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:22px}
.sv-body .tg{padding:20px 22px 16px;border-radius:var(--r-s);background:#fff;box-shadow:0 0 0 1px var(--line)}
.sv-body .tg h4{margin:0 0 6px;font-size:17px;line-height:1.35}
.sv-body .tg p{margin:0 0 10px;font-size:14.5px;line-height:1.6;color:#4a4655}
.sv-body .tg ul{margin:0;padding-inline-start:18px}
.sv-body .tg li{margin:3px 0;font-size:15px;line-height:1.55}
@media (max-width:760px){.sv-body .tgs{grid-template-columns:1fr;gap:10px}.sv-body .tg{padding:16px 18px 12px}}
/* v11.12 404 and search */
.srch{display:flex;gap:8px;margin-top:clamp(16px,2.4vh,24px);max-width:520px}
.srch input{flex:1;min-width:0;height:52px;padding:0 18px;border:0;border-radius:999px;background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);color:#fff;font:400 16px/1 "Heebo",system-ui,sans-serif}
.srch input::placeholder{color:rgba(255,255,255,.6)}
.srch input:focus-visible{outline:2px solid #fff;outline-offset:2px}
.srch .btn{flex:none;height:52px}
.srch .btn svg{width:18px;height:18px}
.pg-sp{padding-block:clamp(40px,6vw,80px)}
.sp-sec+.sp-sec{margin-top:clamp(44px,6vw,72px)}
.sp-h{margin:0 0 20px;font:700 clamp(22px,2.2vw,30px)/1.2 var(--display);color:var(--ink)}
.sp-go{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.sp-go a{display:flex;flex-direction:column;gap:4px;height:100%;padding:18px 20px;border-radius:var(--r-s);background:#fff;box-shadow:0 0 0 1px var(--line);text-decoration:none;color:var(--ink);transition:box-shadow .2s,transform .2s}
.sp-go b{font-weight:700;font-size:17px}
.sp-go span{font-size:14.5px;color:#615D6B;line-height:1.5}
@media (hover:hover){.sp-go a:hover{box-shadow:0 0 0 1.5px #7A3A96;transform:translateY(-2px)}}
.sp-go a:focus-visible{outline:2px solid #7A3A96;outline-offset:2px}
.sp-pager{display:flex;justify-content:space-between;gap:12px;margin-top:28px}
@media (max-width:1100px){.sp-go{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.sp-go{grid-template-columns:1fr}.srch input,.srch .btn{height:48px}}

/* v11.12 magazine: sticky topic chips, twelve at a time, cards that arrive */
.mg-bar{position:sticky;top:88px;z-index:20;margin:0 0 clamp(22px,3vw,34px);padding:8px 0}
.mg-bar::before{content:"";position:absolute;inset:0 -9999px;background:rgba(244,243,248,.86);backdrop-filter:blur(12px) saturate(1.2);-webkit-backdrop-filter:blur(12px) saturate(1.2);opacity:0;transition:opacity .25s;pointer-events:none}
.mg-bar.stuck::before{opacity:1;box-shadow:0 1px 0 var(--line)}
.mg-chips{position:relative;display:flex;flex-wrap:wrap;gap:8px}
.mg-chip{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 18px;border:0;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);color:var(--ink);font:600 15px/1 "Heebo",system-ui,sans-serif;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s,box-shadow .2s,transform .2s}
.mg-chip small{font-size:12px;font-weight:500;color:#615D6B;transition:color .2s}
.mg-chip[aria-pressed="true"]{background:linear-gradient(120deg,#614994,#9B2D94);color:#fff;box-shadow:0 8px 20px -10px rgba(122,58,150,.7)}
.mg-chip[aria-pressed="true"] small{color:rgba(255,255,255,.82)}
@media (hover:hover){.mg-chip[aria-pressed="false"]:hover{box-shadow:inset 0 0 0 1.5px #7A3A96;color:#7A3A96}}
.mg-chip:active{transform:scale(.97)}
.mg-chip:focus-visible{outline:2px solid #7A3A96;outline-offset:2px}
.mg-grid{transition:opacity .16s ease}
.mg-grid.swap{opacity:0}
.mg-grid .pg-post-d b{font-weight:600;color:#7A3A96}
.mg-grid .pg-post.in{animation:mgIn .62s cubic-bezier(.22,1,.36,1) var(--d,0ms) both}
@keyframes mgIn{from{opacity:0;transform:translateY(22px) scale(.985)}to{opacity:1;transform:none}}
.mg-grid .pg-post-img{overflow:hidden}
.mg-grid .pg-post-img img{transition:transform .7s cubic-bezier(.22,1,.36,1)}
@media (hover:hover){.mg-grid .pg-post:hover .pg-post-img img{transform:scale(1.04)}}
.mg-grid .pg-post:active{transform:scale(.99);transition:transform .15s}
.mg:not(.js) .pg-post[data-more]{display:flex}
.mg-foot{display:flex;justify-content:center;margin-top:clamp(28px,4vw,44px)}
@media (max-width:760px){
  .mg-bar{top:72px;margin-inline:-16px 44px;padding:8px 0;padding-inline-start:16px}
  .mg-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin-block:-4px;padding-block:4px;-webkit-mask-image:linear-gradient(to left,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to left,#000 calc(100% - 28px),transparent)}
  .mg-chips::-webkit-scrollbar{display:none}
  .mg-chip{min-height:42px;padding:0 15px;font-size:14.5px}
}
@media (prefers-reduced-motion:reduce){.mg-grid,.mg-chip,.mg-bar::before,.mg-grid .pg-post-img img{transition:none}.mg-grid .pg-post.in{animation:none}}