/* Services v3 — three open chapters with one typographic system.
   Two faces, as across the site: Wildcard for section, package and number display;
   Roboto Mono for everything you read (titles, leads, prices, body).
   Roboto Mono: reading and interface text. Glass recipe comes from flow.css. */

.services-v3{--sv-line:color-mix(in srgb,var(--paper) 12%,transparent);--sv-muted:color-mix(in srgb,var(--paper) 64%,transparent);--sv-faint:color-mix(in srgb,var(--paper) 34%,transparent);--sv-radius:24px;--sv-ease:cubic-bezier(.22,1,.36,1);position:relative;padding:clamp(96px,11vw,170px) var(--gutter) clamp(72px,8vw,120px);color:var(--paper);font-family:var(--mono)}
.services-v3 *{box-sizing:border-box}
.services-v3 :is(h2,h3,h4,h5,p,ul,ol,dl,dd,figure){margin:0}
.services-v3 :is(ul,ol){padding:0;list-style:none}
.services-v3 a{color:inherit;text-decoration:none}
.services-v3 button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.services-v3 i{font-style:normal}

/* ---------- Shared type ---------- */
.sv-eyebrow{font:500 11px/1.4 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--sv-muted)}
.sv-eyebrow span{color:var(--paper)}
.sv-link{display:inline-flex;align-items:center;gap:10px;font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--paper);padding:12px 0;border-bottom:1px solid var(--sv-line);transition:border-color .4s,gap .4s var(--sv-ease)}
.sv-link:hover,.sv-link:focus-visible{border-color:var(--paper);gap:16px}
.sv-cta{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:0 22px;border-radius:999px;background:var(--paper);color:var(--ink)!important;font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;transition:transform .5s var(--sv-ease),box-shadow .5s,background .3s}
.sv-cta:hover,.sv-cta:focus-visible{transform:translateY(-2px);box-shadow:0 12px 30px rgb(0 0 0/.28)}
.sv-cta i,.sv-link i,.sv-index i,.sv-cap-list i{display:inline-block;transition:transform .5s var(--sv-ease)}
.sv-cta:hover i,.sv-link:hover i,.sv-index a:hover i,.sv-cap-list a:hover i{transform:translate(2px,-2px)}
.sv-ghost{min-height:48px;padding:0 18px;border-radius:999px;border:1px solid var(--sv-line)!important;font:500 11px/1 var(--mono)!important;letter-spacing:.14em;text-transform:uppercase;color:var(--sv-muted)!important;transition:border-color .3s,color .3s}
.sv-ghost:hover,.sv-ghost:focus-visible{border-color:var(--paper)!important;color:var(--paper)!important}

/* ---------- Section head ---------- */
.sv-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(32px,5vw,96px);align-items:end;padding-bottom:clamp(56px,6vw,96px)}
.sv-head-title{display:grid;gap:22px;container-type:inline-size}
.services-v3 .sv-title{font:400 clamp(32px,11cqi,118px)/.9 'Wildcard',Arial,sans-serif;letter-spacing:.005em;margin:0;text-wrap:balance}
.sv-head-copy{display:grid;gap:34px}
.sv-lead{font:400 clamp(16px,1.3vw,19px)/1.62 var(--mono);letter-spacing:-.015em;color:var(--paper);max-width:34ch;text-wrap:pretty}
.sv-index{display:grid;border-top:1px solid var(--sv-line)}
.sv-index a{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:12px;padding:18px 0;border-bottom:1px solid var(--sv-line);font-size:14px;line-height:1.4;color:var(--sv-muted);transition:color .3s,padding .5s var(--sv-ease)}
.sv-index a span{font-size:11px;letter-spacing:.14em;color:var(--sv-faint)}
.sv-index a:hover,.sv-index a:focus-visible{color:var(--paper);padding-left:8px}

/* ---------- Chapters ---------- */
.sv-chapter{padding-top:clamp(72px,8vw,128px);margin-top:clamp(40px,4vw,64px);border-top:1px solid var(--sv-line);scroll-margin-top:calc(var(--header) + 20px)}
.sv-chapter-head{display:grid;grid-template-columns:clamp(64px,7vw,112px) minmax(0,1.25fr) minmax(0,.9fr);gap:clamp(20px,3vw,56px);align-items:start}
.sv-num{font:400 clamp(30px,3.2vw,52px)/.9 'Wildcard',Arial,sans-serif;letter-spacing:.04em;color:transparent;-webkit-text-stroke:1px var(--sv-faint);align-self:start;padding-top:.08em}
.sv-chapter-title{font:300 clamp(26px,2.8vw,44px)/1.14 var(--mono);letter-spacing:-.04em;max-width:17ch;text-wrap:balance}
.sv-chapter-aside{display:grid;gap:18px;justify-items:start;padding-top:.5em}
.sv-chapter-aside p{font-size:14.5px;line-height:1.75;color:var(--sv-muted);max-width:46ch}
.sv-sub-head{display:flex;align-items:end;justify-content:space-between;gap:24px;padding-bottom:18px;border-bottom:1px solid var(--sv-line);margin-bottom:22px}
.sv-sub-note{font-size:13px;line-height:1.6;color:var(--sv-muted);max-width:44ch;text-align:right}

/* ---------- Glass surfaces ---------- */
.sv-plan,.sv-cap-panel,.services-v3 .fs-ai-study,.sv-why{background:var(--glass-fill);border:1px solid var(--glass-edge);box-shadow:var(--glass-shine);-webkit-backdrop-filter:blur(22px) saturate(1.5);backdrop-filter:blur(22px) saturate(1.5);border-radius:var(--sv-radius)}

/* ---------- Web packages ---------- */
.sv-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.5vw,22px);margin-top:clamp(44px,4.5vw,72px)}
.sv-plan{position:relative;display:flex;flex-direction:column;overflow:hidden;transition:transform .7s var(--sv-ease),border-color .5s,box-shadow .7s}
.sv-plan[data-active]{transform:translateY(-6px);border-color:color-mix(in srgb,var(--paper) 26%,transparent);box-shadow:var(--glass-shine),0 30px 70px rgb(0 0 0/.32)}
.sv-plan-media{position:relative;aspect-ratio:16/10;overflow:hidden;-webkit-mask-image:linear-gradient(#000 62%,transparent);mask-image:linear-gradient(#000 62%,transparent)}
.sv-plan-media .ascii-scene{border-radius:0}
.sv-plan-media .ascii-poster{object-fit:cover}
.sv-plan-body{display:flex;flex-direction:column;gap:22px;padding:4px clamp(22px,2vw,32px) clamp(24px,2.2vw,34px);flex:1}
.sv-plan-head{display:grid;gap:14px}
.sv-plan-name{font:400 clamp(22px,2vw,30px)/1 'Wildcard',Arial,sans-serif;letter-spacing:.04em}
.sv-price{display:flex;align-items:baseline;gap:10px}
.sv-price small{font:500 10px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--sv-muted)}
.sv-price>span{font:400 clamp(24px,2vw,30px)/1 var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.04em}
.sv-currency{font-size:.62em;vertical-align:.3em;margin-right:2px;color:var(--sv-muted)}
.sv-plan-copy{font-size:13.5px;line-height:1.72;color:var(--sv-muted);flex:1}
.sv-meta{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--sv-line)}
.sv-meta div{padding:14px 0 15px;display:grid;gap:7px}
.sv-meta div+div{padding-left:14px;border-left:1px solid var(--sv-line)}
.sv-meta dt{font:500 9.5px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--sv-faint)}
.sv-meta dd{font-size:13.5px;line-height:1.2;color:var(--paper)}
.sv-features{display:grid;gap:11px}
.sv-features li{position:relative;padding-left:22px;font-size:13px;line-height:1.5;color:color-mix(in srgb,var(--paper) 84%,transparent)}
.sv-features li:before{content:'';position:absolute;left:2px;top:.5em;width:9px;height:5px;border-left:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);opacity:.7}
.sv-plan-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.sv-plan-actions .sv-cta{flex:1}
.sv-dots{display:none}
.sv-plan-media .ascii-retry{position:absolute;left:16px;bottom:16px;top:auto;right:auto;transform:none;z-index:3;padding:9px 14px;border-radius:999px;border:1px solid var(--glass-edge);background:rgb(10 10 12/.5);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font:500 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#f3f1ed}

/* Selected web work */
.sv-work{margin-top:clamp(64px,7vw,104px)}
.sv-work-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(12px,1.2vw,18px)}
.sv-work-card{display:grid;gap:14px}
/* Each project as a small desktop browser — the same mockup as Featured works. */
.sv-work-shot{display:block;border-radius:12px;overflow:hidden;background:#0c0c0f;border:1px solid var(--glass-edge);box-shadow:0 18px 40px -24px rgb(0 0 0/.8);transition:transform .9s var(--sv-ease),border-color .4s,box-shadow .9s var(--sv-ease)}
.sv-work-bar{display:flex;align-items:center;gap:4px;height:16px;padding:0 8px;background:linear-gradient(#1a1a1e,#131316);border-bottom:1px solid rgb(255 255 255/.06)}
.sv-work-bar i{width:5px;height:5px;border-radius:50%;background:rgb(255 255 255/.16)}
.sv-work-card img{width:100%;aspect-ratio:2/1;object-fit:cover;object-position:50% 0;display:block;background:#050506;transition:transform 1.2s var(--sv-ease)}
.sv-work-card:hover .sv-work-shot,.sv-work-card:focus-visible .sv-work-shot{transform:translateY(-4px);border-color:color-mix(in srgb,var(--paper) 30%,transparent);box-shadow:0 26px 50px -24px rgb(0 0 0/.85)}
.sv-work-card:hover img,.sv-work-card:focus-visible img{transform:scale(1.035)}
[data-theme=light] .sv-work-shot{background:#fff;border-color:rgb(0 0 0/.09);box-shadow:0 18px 40px -26px rgb(30 24 18/.4)}
[data-theme=light] .sv-work-bar{background:linear-gradient(#f8f7f4,#eeede8);border-bottom-color:rgb(0 0 0/.07)}
[data-theme=light] .sv-work-bar i{background:rgb(0 0 0/.14)}
.sv-work-cap{display:grid;gap:6px}
.sv-work-cap b{font:400 13px/1.2 'Wildcard',Arial,sans-serif;letter-spacing:.06em;font-weight:400}
.sv-work-cap small{font-size:11.5px;line-height:1.4;color:var(--sv-muted)}

/* ---------- Capability explorer ---------- */
.sv-explorer{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(18px,2.5vw,40px);align-items:start;margin-top:clamp(44px,4.5vw,72px);scroll-margin-top:calc(var(--header) + 20px)}
.sv-caps{display:grid;border-top:1px solid var(--sv-line)}
.sv-caps [role=tab]{position:relative;display:grid;grid-template-columns:40px 1fr;align-items:center;text-align:left;padding:17px 16px 17px 0;border-bottom:1px solid var(--sv-line);font-size:14.5px;line-height:1.35;color:var(--sv-muted);transition:color .3s,padding .5s var(--sv-ease)}
.sv-caps [role=tab] span{font-size:10.5px;letter-spacing:.14em;color:var(--sv-faint);transition:color .3s}
.sv-caps [role=tab]:after{content:'';position:absolute;left:-1px;top:16px;bottom:16px;width:2px;border-radius:2px;background:var(--paper);transform:scaleY(0);transition:transform .5s var(--sv-ease)}
.sv-caps [role=tab]:hover{color:var(--paper)}
.sv-caps [role=tab][aria-selected=true]{color:var(--paper);padding-left:16px}
.sv-caps [role=tab][aria-selected=true] span{color:var(--paper)}
.sv-caps [role=tab][aria-selected=true]:after{transform:scaleY(1)}
.sv-cap-panel{position:sticky;top:calc(var(--header) + 28px);padding:clamp(26px,3vw,44px);display:grid;gap:18px;min-height:100%}
.sv-cap-title{font:300 clamp(22px,2vw,30px)/1.2 var(--mono);letter-spacing:-.035em;text-wrap:balance}
.sv-cap-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px;margin-top:10px}
.sv-cap-list a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 0;border-top:1px solid var(--sv-line);font-size:14px;line-height:1.4;color:color-mix(in srgb,var(--paper) 86%,transparent);transition:color .3s}
.sv-cap-list a:hover,.sv-cap-list a:focus-visible{color:var(--paper)}
.sv-cap-panel.is-swapping :is([data-cap-title],.sv-cap-list li){animation:sv-swap .62s var(--sv-ease) both}
.sv-cap-panel.is-swapping .sv-cap-list li:nth-child(2n){animation-delay:.04s}
.sv-cap-panel.is-swapping .sv-cap-list li:nth-child(n+3){animation-delay:.07s}
.sv-cap-panel.is-swapping .sv-cap-list li:nth-child(n+5){animation-delay:.1s}
@keyframes sv-swap{from{opacity:0;transform:translateY(10px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}

/* ---------- Software portfolio: Mobile / Desktop ----------
   The two earlier views, rebuilt clean: seven phone screens in one even row,
   or three desktop studies on a single stage with a 01–03 index. */
.sv-sub-head .sv-switch{flex:none}
.sv-sub-head:has(.sv-switch){align-items:center;margin-bottom:clamp(24px,2.4vw,36px)}
.sv-switch{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:999px;background:var(--glass-fill);border:1px solid var(--glass-edge);box-shadow:var(--glass-shine);-webkit-backdrop-filter:blur(22px) saturate(1.5);backdrop-filter:blur(22px) saturate(1.5);isolation:isolate}
.sv-switch button{position:relative;z-index:1;min-width:96px;height:36px;padding:0 18px;border-radius:999px;font:500 10.5px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--sv-muted);transition:color .45s var(--sv-ease)}
.sv-switch button[aria-pressed=true]{color:var(--ink)}
.sv-switch button:focus-visible{outline:2px solid var(--paper);outline-offset:2px}
.sv-switch-thumb{position:absolute;z-index:0;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:var(--paper);box-shadow:0 6px 18px rgb(0 0 0/.22);transition:transform .6s var(--sv-ease)}
[data-view=desktop] .sv-switch-thumb{transform:translateX(100%)}

.sv-devices{position:relative;transition:height .7s var(--sv-ease)}
.sv-devices.is-switching{overflow:hidden}
.sv-view{transition:opacity .45s var(--sv-ease),transform .7s var(--sv-ease)}
.sv-view.is-leaving{position:absolute;inset:0 0 auto;opacity:0;transform:translateY(-10px);pointer-events:none}

/* Mobile: one even row, the device frames carry the rhythm. */
.sv-phones{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(10px,1.3vw,20px);margin:0;padding:6px 0 4px;list-style:none;outline:none}
.sv-phone{display:grid;gap:14px;justify-items:center;transition:transform .9s var(--sv-ease)}
.sv-phone img{display:block;width:100%;height:auto;filter:drop-shadow(0 18px 18px rgb(0 0 0/.32));transition:transform .9s var(--sv-ease)}
[data-theme=light] .sv-phone img{filter:drop-shadow(0 16px 16px rgb(40 30 20/.2))}
.sv-phone:hover img{transform:translateY(-8px)}
.sv-phone-cap{display:flex;gap:8px;align-items:baseline;font-size:11px;line-height:1.3;color:var(--sv-muted);text-align:center;white-space:nowrap}
.sv-phone-cap i{font-size:9.5px;letter-spacing:.14em;color:var(--sv-faint)}
.sv-view--mobile.is-entering .sv-phone{opacity:0;transform:translateY(34px)}
.sv-view--mobile .sv-phone{transition:opacity .8s var(--sv-ease) calc(var(--sv-p,0) * 55ms),transform 1s var(--sv-ease) calc(var(--sv-p,0) * 55ms)}

/* Desktop: one stage, three studies, an index that doubles as the timer. */
.sv-view--desktop{display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,.34fr);gap:clamp(16px,2vw,32px);align-items:stretch}
.sv-view--desktop[hidden]{display:none}
.sv-stage{position:relative;aspect-ratio:16/9;border-radius:var(--sv-radius);overflow:hidden;border:1px solid var(--glass-edge);background:radial-gradient(70% 80% at 50% 45%,#16161b,#060607 72%);box-shadow:0 40px 80px -46px rgb(0 0 0/.9);isolation:isolate}
.sv-slide{position:absolute;inset:0;margin:0;opacity:0;transform:scale(1.035);transition:opacity .9s var(--sv-ease),transform 1.4s var(--sv-ease)}
.sv-slide.is-active{opacity:1;transform:none}
.sv-slide>img:first-child{width:100%;height:100%;object-fit:cover;display:block}
.sv-slide--contain{padding:5% 0 3%}.sv-slide--contain>img:first-child{object-fit:contain;filter:drop-shadow(0 30px 40px rgb(0 0 0/.55))}
.sv-slide-mark{position:absolute;z-index:2;right:4.5%;bottom:7%;width:clamp(30px,3vw,46px);height:auto;opacity:.92}
.sv-slides-nav{display:grid;align-content:center;margin:0;padding:0;list-style:none;border-top:1px solid var(--sv-line)}
.sv-slides-nav li{border-bottom:1px solid var(--sv-line)}
.sv-slides-nav button{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr);row-gap:6px;width:100%;padding:20px 0 20px;text-align:left;color:var(--sv-muted);transition:color .4s,padding .6s var(--sv-ease)}
.sv-slides-nav .sv-sn{grid-row:span 2;font-size:10.5px;letter-spacing:.14em;color:var(--sv-faint);padding-top:3px}
.sv-slides-nav b{font-weight:400;font-size:15px;line-height:1.3;letter-spacing:-.02em}
.sv-slides-nav small{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--sv-faint)}
.sv-slides-nav button[aria-pressed=true]{color:var(--paper);padding-left:8px}
.sv-slides-nav button:hover{color:var(--paper)}
.sv-progress{position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--paper);transform:scaleX(0);transform-origin:0 50%}
.sv-slides-nav button[aria-pressed=true] .sv-progress{animation:sv-progress var(--sv-dwell,6.5s) linear forwards}
.sv-gallery.is-holding .sv-progress{animation-play-state:paused!important}
.sv-gallery.is-still .sv-slides-nav button[aria-pressed=true] .sv-progress{animation:none;transform:scaleX(1)}
@keyframes sv-progress{to{transform:scaleX(1)}}
[data-theme=light] .sv-stage{border-color:rgb(0 0 0/.08);box-shadow:0 36px 70px -44px rgb(30 24 18/.45)}

/* ---------- Gallery block ---------- */
.sv-gallery{margin-top:clamp(64px,7vw,104px);scroll-margin-top:calc(var(--header) + 20px)}

/* AI design studies */
.sv-studies{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(14px,1.5vw,22px)}
.services-v3 .fs-ai-study{position:relative;height:auto;display:grid;grid-template-rows:auto 1fr;overflow:hidden;isolation:isolate;padding:0;margin:0}
.sv-study-visual{position:relative;height:clamp(280px,29vw,440px);overflow:hidden;background:#08090a}
.sv-studies .fs-ai-study:nth-child(2) .sv-study-visual{background:#050506}
/* The context study is a close crop of a wider canvas: its cut edges dissolve instead of clipping. */
.sv-studies .fs-ai-study:nth-child(2) .sv-study-visual img{object-position:50% 40%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.sv-study-visual img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s var(--sv-ease)}
.fs-ai-study:hover .sv-study-visual img{transform:scale(1.035)}
.sv-study-copy{display:grid;align-content:start;gap:12px;padding:clamp(22px,2.2vw,32px)}
.sv-study-copy h5{font:400 clamp(18px,1.45vw,22px)/1.3 var(--mono);letter-spacing:-.025em;margin-top:4px}
.sv-study-copy p{font-size:13.5px;line-height:1.7;color:var(--sv-muted);max-width:48ch}
.sv-study-copy ul{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.sv-study-copy li{padding:8px 12px;border-radius:999px;border:1px solid var(--sv-line);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--sv-muted)}

/* Why us */
.sv-why{margin-top:clamp(40px,4vw,64px);padding:clamp(28px,3.4vw,56px);display:grid;grid-template-columns:minmax(0,.4fr) minmax(0,1fr) auto;gap:clamp(18px,3vw,48px);align-items:center}
.sv-why-lead{font:400 clamp(18px,1.6vw,24px)/1.5 var(--mono);letter-spacing:-.03em;text-wrap:pretty;max-width:40ch}
.sv-why-list{grid-column:2;display:grid;gap:10px}
.sv-why-list li{position:relative;padding-left:22px;font-size:13.5px;line-height:1.6;color:var(--sv-muted)}
.sv-why-list li:before{content:'';position:absolute;left:0;top:.72em;width:10px;height:1px;background:currentColor}
.sv-why:has(.sv-why-list) .sv-cta{grid-column:3;grid-row:1/3;align-self:center}

/* ---------- Arrival motion (only once JS confirms) ---------- */
.sv-motion .sv-reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--sv-ease) calc(var(--sv-i,0)*90ms),transform 1.1s var(--sv-ease) calc(var(--sv-i,0)*90ms)}
.sv-motion .sv-reveal.is-in{opacity:1;transform:none}
.sv-motion .sv-reveal.is-settled{transition:transform .7s var(--sv-ease),border-color .5s,box-shadow .7s}
.sv-motion .sv-plan.sv-reveal.is-in[data-active]{transform:translateY(-6px)}
@media(prefers-reduced-motion:reduce){.sv-motion .sv-reveal{opacity:1;transform:none;transition:none}.sv-cap-panel.is-swapping :is([data-cap-title],.sv-cap-list li){animation:none}.sv-plan,.sv-work-card img,.sv-work-shot,.sv-phone,.sv-phone img,.sv-slide,.sv-view,.sv-switch-thumb{transition:none!important}.sv-progress{animation:none!important}}
.is-paused .sv-reveal{transition:none}

/* ---------- White mode ---------- */
[data-theme=light] .sv-study-visual{background:#e7e5e0}
[data-theme=light] .sv-plan-media{background:radial-gradient(70% 90% at 20% 25%,rgb(var(--flow-1,40 40 48)/.95),transparent 72%),rgb(var(--flow-0,9 9 11))}
[data-theme=light] .sv-cta:hover{box-shadow:0 12px 30px rgb(40 30 60/.18)}

/* ---------- Tablet ---------- */
@media(max-width:1100px){
 .sv-head{grid-template-columns:1fr;align-items:start}
 .sv-chapter-head{grid-template-columns:clamp(56px,9vw,84px) minmax(0,1fr)}
 .sv-chapter-aside{grid-column:2}
 .sv-plans{grid-template-columns:repeat(3,minmax(270px,1fr));overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:calc(var(--gutter)*-1);padding:8px var(--gutter) 18px;scroll-padding-inline:var(--gutter)}
 .sv-plans::-webkit-scrollbar{display:none}
 .sv-plan{scroll-snap-align:start}
 .sv-work-row{grid-template-columns:repeat(5,minmax(200px,1fr));overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:calc(var(--gutter)*-1);padding:0 var(--gutter) 8px;scroll-padding-inline:var(--gutter)}
 .sv-work-row::-webkit-scrollbar{display:none}
 .sv-work-card{scroll-snap-align:start}
 .sv-explorer{grid-template-columns:1fr}
 .sv-cap-panel{position:relative;top:auto}
 .sv-studies{grid-template-columns:1fr 1fr}
 .sv-why{grid-template-columns:1fr}
 .sv-why-list{grid-column:auto}
 .sv-why:has(.sv-why-list) .sv-cta{grid-column:auto;grid-row:auto;justify-self:start}
}

/* ---------- Phone ---------- */
@media(max-width:700px){
 .services-v3{padding-top:84px}
 .sv-head{gap:28px;padding-bottom:44px}
 .sv-lead{font-size:16px}
 .sv-index a{grid-template-columns:30px minmax(0,1fr) auto;font-size:12.5px;padding:15px 0}

 .sv-chapter{padding-top:56px;margin-top:28px}
 .sv-chapter-head{grid-template-columns:1fr;gap:14px}
 .sv-num{font-size:32px}
 .sv-chapter-aside{grid-column:auto}
 .sv-chapter-title{font-size:clamp(25px,7.2vw,32px);max-width:16ch}
 .sv-plans{grid-template-columns:repeat(3,84%);gap:12px;margin-top:32px}
 .sv-plan-body{padding:2px 20px 24px;gap:18px}
 .sv-dots{display:flex;justify-content:center;gap:8px;margin-top:6px}
 .sv-dots i{width:6px;height:6px;border-radius:6px;background:var(--sv-faint);transition:width .4s var(--sv-ease),background .3s}
 .sv-dots i.is-on{width:22px;background:var(--paper)}
 .sv-work{margin-top:56px}
 .sv-work-row{grid-template-columns:repeat(5,68%)}
 .sv-sub-head{flex-direction:column;align-items:flex-start;gap:8px}
 .sv-sub-note{text-align:left}
 .sv-explorer{margin-top:32px;gap:16px}
 .sv-caps{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;border:0;margin-inline:calc(var(--gutter)*-1);padding:0 var(--gutter) 4px}
 .sv-caps::-webkit-scrollbar{display:none}
 .sv-caps [role=tab]{display:flex;gap:8px;flex:none;white-space:nowrap;padding:12px 16px;border:1px solid var(--sv-line);border-radius:999px;font-size:12.5px;scroll-snap-align:start}
 .sv-caps [role=tab][aria-selected=true]{padding-left:16px;background:var(--paper);color:var(--ink);border-color:var(--paper)}
 .sv-caps [role=tab][aria-selected=true] span{color:var(--ink)}
 .sv-caps [role=tab]:after{display:none}
 .sv-cap-panel{padding:24px 20px}
 .sv-cap-list{grid-template-columns:1fr}
 .sv-gallery{margin-top:56px}
 .sv-studies{grid-template-columns:1fr}
 .sv-study-visual{height:auto;aspect-ratio:4/3}
 .sv-why{padding:26px 22px;margin-top:28px}
 .sv-plan-actions .sv-ghost{flex:none}
}

/* Portfolio views on smaller screens */
@media(max-width:1023px){
 .sv-phones{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:clamp(150px,26vw,210px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:calc(var(--gutter)*-1);padding:6px var(--gutter) 10px;scroll-padding-inline:var(--gutter)}
 .sv-phones::-webkit-scrollbar{display:none}
 .sv-phone{scroll-snap-align:start}
 .sv-view--desktop{grid-template-columns:1fr}
 .sv-slides-nav{grid-template-columns:repeat(3,minmax(0,1fr));border-top:0;gap:10px}
 .sv-slides-nav li{border-bottom:1px solid var(--sv-line)}
 .sv-slides-nav button{grid-template-columns:1fr;padding:14px 0}
 .sv-slides-nav .sv-sn{grid-row:auto;padding:0}
 .sv-slides-nav button[aria-pressed=true]{padding-left:0}
}
@media(max-width:700px){
 .sv-sub-head:has(.sv-switch){flex-direction:row;align-items:center}
 .sv-switch button{min-width:0;height:32px;padding:0 14px;font-size:9.5px}
 .sv-phones{grid-auto-columns:44vw;gap:12px}
 .sv-stage{border-radius:16px;aspect-ratio:4/3}
 .sv-slides-nav b{font-size:12.5px}
 .sv-slides-nav small{display:none}
}

/* Ṛ in the Wildcard display face: an R with the dot drawn below (the face has no Ṛ glyph). */
.udot{position:relative;display:inline-block}
.udot:after{content:'';position:absolute;left:50%;bottom:-.34em;width:.2em;height:.2em;margin-left:-.1em;border-radius:50%;background:currentColor}
.sv-work-cap .wk-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Product studies take the media lens (js/interaction-v2.js): only the slide on show answers the pointer. */
.sv-slide:not(.is-active){pointer-events:none}
.sv-phone>img,.sv-slide>img{-webkit-user-drag:none;user-select:none}