/* Shared Roboweb visual language. Enhancements are scoped to public page types. */
.rw[data-rw-visual]{--vs-orange:#f36a3c;--vs-cream:#e9e5dc;--vs-stroke:rgba(217,211,198,.33)}
.rw[data-rw-visual] main h1{letter-spacing:-.045em;text-wrap:balance;overflow-wrap:break-word}
.rw[data-rw-visual] main h1 .nw{white-space:normal}
.rw[data-rw-visual] main h2{letter-spacing:-.025em;text-wrap:balance}
.rw[data-rw-visual] .crumbs{font-size:11px;line-height:1.65}
.rw[data-rw-visual] .eyebrow{letter-spacing:.16em}
.rw[data-rw-visual] .lead-box{border-radius:20px;border-color:var(--line);background:linear-gradient(115deg,rgba(243,106,60,.06),transparent 50%),var(--panel)}
.rw[data-rw-visual] .rd-toc{border-radius:0;border-width:1px 0;background:transparent}
.rw[data-rw-visual] .rd-toc a{transition:color .18s ease,transform .18s ease}
.rw[data-rw-visual] .rd-toc a:hover{transform:translateX(3px)}
.rw[data-rw-visual] :is(.postcard,.srv,.kh){transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.rw[data-rw-visual] :is(.postcard,.srv,.kh):hover{border-color:rgba(243,106,60,.45)}

/* Service heroes: a proper image column, never a background beneath the copy. */
.rw[data-rw-visual=service] .phero{padding-top:52px;padding-bottom:38px;overflow:hidden}
.rw[data-rw-visual=service] .phero>[data-vs-hero]{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(20px,3vw,60px);align-items:center}
.vs-hero-copy{min-width:0;position:relative;z-index:1}
.rw[data-rw-visual=service] .phero h1{font-size:clamp(34px,4.2vw,60px);line-height:1.11;margin-top:20px}
.rw[data-rw-visual=service] .phero .hero-sub{font-size:16px;line-height:1.75;max-width:66ch}
.rw[data-rw-visual=service] .hero-mini{gap:20px 26px;padding-top:22px;border-top:1px solid var(--line)}
.rw[data-rw-visual=service] .hero-mini .mi{flex:1 1 135px;min-width:0}
.rw[data-rw-visual=service] .hero-mini .mi .v{font-size:23px}
.rw[data-rw-visual=service] .hero-mini .mi .l{font-size:10px;letter-spacing:.07em;line-height:1.65}
.rw[data-rw-visual=service] .hcta{gap:18px 24px}
.vs-motion-wrap{position:relative;min-width:0}.vs-motion-service{width:100%}.vs-hero-art{position:relative;min-width:0;height:500px;isolation:isolate}
.vs-hero-art img{position:absolute;inset:0 -8%;width:116%;height:100%;max-width:none;object-fit:cover;object-position:51% center;mask-image:radial-gradient(ellipse 68% 69% at 51% 49%,#000 50%,transparent 83%);z-index:1}
.vs-hero-halo{position:absolute;inset:8% -3% 8%;border:1px solid rgba(243,106,60,.23);border-radius:50%;transform:rotate(-24deg);background:radial-gradient(ellipse at center,rgba(243,106,60,.05),transparent 68%)}
.vs-hero-halo:after{content:"";position:absolute;inset:11%;border:1px dashed rgba(200,195,183,.18);border-radius:50%}
.vs-hero-art .vs-diagram{position:absolute;width:82%;height:auto;bottom:-25px;right:0;z-index:2;color:var(--vs-stroke);opacity:.85;filter:drop-shadow(0 2px 3px #000)}
.vs-diagram .vs-hot{stroke:var(--vs-orange);stroke-width:2}
.vs-registration{position:absolute;width:15px;height:15px;z-index:2;border-color:rgba(231,226,214,.55)}
.vs-registration-a{left:4%;top:14%;border-top:1px solid;border-left:1px solid}
.vs-registration-b{right:2%;bottom:19%;border-right:1px solid;border-bottom:1px solid}
.rw[data-theme=light] .vs-hero-art{overflow:hidden;border-radius:44% 47% 39% 45%;background:#14130f;--vs-stroke:rgba(217,211,198,.5)}
.rw[data-theme=light] .vs-hero-art img{inset:0;width:100%;mask-image:radial-gradient(ellipse 69% 64% at 51% 49%,#000 49%,transparent 86%)}

/* Editorial illustrations add visual rhythm without changing reading widths. */
.vs-motion-editorial{margin:28px 0 34px}.vs-editorial-art{height:250px;position:relative;overflow:hidden;isolation:isolate;background:#0e100d;border:1px solid rgba(214,208,190,.19);border-radius:2px 28px 2px 28px;color:rgba(217,211,198,.62)}
.vs-editorial-image{position:absolute;inset:0 auto 0 -3%;width:69%;height:100%;max-width:none;object-fit:cover;object-position:center;mask-image:linear-gradient(90deg,#000 35%,rgba(0,0,0,.95) 60%,transparent 100%);z-index:1}.vs-editorial-art .vs-diagram{position:absolute;right:-2%;top:5%;width:55%;height:86%;z-index:2;opacity:.86;filter:drop-shadow(0 1px 8px #050805)}
.vs-art-glow{position:absolute;inset:-90%;background:radial-gradient(ellipse at 60% 50%,rgba(243,106,60,.2),transparent 28%),radial-gradient(ellipse at 40% 50%,rgba(98,138,124,.07),transparent 32%);transform:rotate(-18deg)}
.vs-art-track{position:absolute;left:18px;right:18px;top:16px;height:1px;background:linear-gradient(90deg,var(--vs-orange) 0 8%,rgba(217,211,198,.2) 8% 100%);opacity:.65}
.vs-art-track:after{content:"";position:absolute;width:4px;height:4px;border-radius:50%;background:var(--vs-orange);right:0;top:-1px}
.rw[data-rw-visual=article] .article h1{line-height:1.14}
.rw[data-rw-visual=article] .a-meta{font-size:12px;line-height:1.6}
.rw[data-rw-visual=article] .article h2{margin-top:44px}
.rw[data-rw-visual=journal] .vs-motion-editorial{max-width:1000px}.rw[data-rw-visual=journal] .vs-editorial-art{height:280px}
.rw[data-rw-visual=journal] .phero{padding-bottom:20px}
.rw[data-rw-visual=journal] .postcard{border-radius:6px 22px 6px 22px}
.rw[data-rw-visual=journal] .pc-cat{letter-spacing:.09em}
.rw[data-rw-visual=about] .vs-editorial-art{height:280px}

/* Preserve the gallery and device framing; tie case headings into the new style. */
.rw[data-rw-visual=case] .cs-hero{position:relative}
.rw[data-rw-visual=case] .cs-tag{letter-spacing:.11em}
.rw[data-rw-visual=case] .cs-feat{border-radius:4px 22px 4px 22px}
.rw[data-rw-visual=case] .cs-sglab,.rw[data-rw-visual=case] .sglab{letter-spacing:.1em}
.rw[data-rw-visual=portfolio] .rg-hero{position:relative}
.rw[data-rw-visual=portfolio] .rg-hero:after{content:"";position:absolute;width:clamp(100px,18vw,280px);height:1px;right:0;bottom:-14px;background:linear-gradient(90deg,transparent,var(--vs-orange));pointer-events:none}
.rw[data-rw-visual=utility] main h1,.rw[data-rw-visual=editorial] main h1{letter-spacing:-.035em}

@media(max-width:1099px){
 .rw[data-rw-visual=service] .phero>[data-vs-hero]{grid-template-columns:minmax(0,1fr);gap:10px}
 .rw[data-rw-visual=service] .phero h1{font-size:clamp(34px,5.6vw,54px);max-width:900px}
 .vs-motion-service{width:min(100%,700px);margin:10px auto 0}.vs-hero-art{height:380px;width:100%;margin:0}
 .vs-hero-art img{inset:-4% 0;width:100%;height:110%;object-fit:contain}
 .vs-hero-art .vs-diagram{width:64%;bottom:-5px;right:2%}
 .vs-hero-halo{inset:5% 6%}
}
@media(max-width:600px){
 .rw[data-rw-visual=service] .phero{padding-top:30px}
 .rw[data-rw-visual=service] .phero h1{font-size:34px;letter-spacing:-.04em}
 .rw[data-rw-visual=service] .phero .hero-sub{font-size:15px;line-height:1.75}
 .rw[data-rw-visual=service] .hero-mini .mi .v{font-size:21px}
 .vs-motion-service{margin-top:6px}.vs-hero-art{height:300px}
 .vs-hero-art img{inset:-10% -4%;width:108%;height:120%}
 .vs-hero-art .vs-diagram{width:70%;bottom:-20px}
 .vs-motion-editorial{margin:22px 0 26px}.vs-editorial-art,.rw[data-rw-visual=journal] .vs-editorial-art,.rw[data-rw-visual=about] .vs-editorial-art{height:205px;border-radius:2px 20px 2px 20px}.vs-editorial-image{left:-8%;width:83%;object-position:52% center}.vs-editorial-art .vs-diagram{width:60%;right:-5%;top:9%;height:74%;opacity:.7}
 .rw[data-rw-visual=article] .article h2{margin-top:32px}
 .rw[data-rw-visual=portfolio] .rg-hero:after{display:none}
}
@media(prefers-reduced-motion:reduce){
 .rw[data-rw-visual] .rd-toc a,.vs-hero-art img{transition:none!important;transform:none!important}
 .rw[data-rw-visual] :is(.postcard,.srv,.kh){transition:none!important}
}

/* Controls remain outside decorative aria-hidden artwork. */
.vs-motion-toggle{position:absolute;right:15px;bottom:14px;z-index:8;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:7px 13px;border:1px solid #b6b8a84a;border-radius:30px;background:#10130edb;color:#e7e6dc;font-family:inherit;font-size:11px;line-height:1.25;cursor:pointer;backdrop-filter:blur(8px);transition:border-color .2s,background .2s}
.vs-motion-toggle[hidden]{display:none!important}.vs-motion-toggle:hover{border-color:#f36a3c;background:#27231be8}.vs-motion-toggle:focus-visible{outline:2px solid #f36a3c;outline-offset:4px}.vs-motion-toggle:disabled{cursor:default;opacity:.7}.vs-motion-toggle>span:first-child{font:12px/1 monospace;color:#ff8156}
.vs-motion-service>.vs-motion-toggle{right:10%;bottom:0}
@media(max-width:600px){.vs-motion-toggle{right:11px;bottom:11px;font-size:10px;min-height:34px;padding:6px 10px}.vs-motion-service>.vs-motion-toggle{right:8%;bottom:0}}
@media(prefers-reduced-motion:reduce){.vs-motion-toggle{transition:none}}