.sec > .wrap.rl { display: block; }
.sec > .wrap.rl > div { max-width: none; }      
.sec > .wrap.rl > * { grid-column: 2; min-width: 0; }
.sec > .wrap.rl > .sk { grid-column: 1; grid-row: 1 / span 30; align-self: start; position: sticky; top: 120px; }
.sec > .off { padding-left: 0; }
.sk { margin: 14px 0 0; font-size: 14px; color: var(--text-3); letter-spacing: .04em; display: flex; gap: 14px; align-items: baseline; }
.sk .n { font-family: var(--mono); color: var(--signal); }
#about .ab { display: block; }
.pwrap.off { grid-template-columns: minmax(0, 1fr) minmax(0, 340px); }
@media (max-width: 900px) { .pwrap.off { grid-template-columns: 1fr; } }   
#rnd .themes .theme b { font-size: clamp(22px, 2vw, 30px); margin: 0; }
#rnd .themes .theme { padding-top: 28px; }
#process .step b { margin-bottom: 0; }
.closing .wrap.rl .big { font-size: clamp(40px, 6vw, 88px); }
#team .person { background: none; border: 0; border-top: 1px solid var(--line); padding: 26px 0 28px; }
#team .person .nm { font-size: 22px; margin-top: 8px; }
#team .person p { margin-top: 12px; }
.sol .h3 { margin-top: 22px; }
#products { padding-top: 96px; }
#products .more-h { color: var(--text-2); }
#products .pwrap { margin-top: 32px; }
@media (max-width: 1360px) {
  .row { grid-template-columns: minmax(0, 1fr) 24px; gap: 8px 16px; min-height: 0; padding: 24px 0; }
  .row .ds-w { grid-column: 1; grid-row: 2; }
  .row .go { grid-column: 2; grid-row: 1 / 3; }
  .row.on .ds-w { transform: translateX(20px); }
  .row .ds-w { transition: transform .35s var(--ease-out); }
}
@media (max-width: 1180px) {
  .vsteps { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 1100px) {
  .sec > .wrap.rl { grid-template-columns: 1fr; }
  .sec > .wrap.rl > *, .sec > .wrap.rl > .sk { grid-column: 1; grid-row: auto; position: static; }
  .sk { margin: 0 0 24px; }
  .sec > .off { padding-left: 0; }
  .team { grid-template-columns: 1fr; }
}
@media (max-width: 900px) { .row.on .ds-w, .row.on .nm { transform: none; } .row.on { padding-left: 14px; } }
#rnd .themes { gap: 32px; margin-top: 56px; }
#rnd .themes .theme { border-top: 0; padding-top: 0; }
#rnd .ph { margin: 0 0 22px; aspect-ratio: 4 / 3; overflow: hidden; background: var(--surface); }
#rnd .ph img { width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(.82) brightness(.9) contrast(1.04); transform: scale(1.001); transition: transform 1.2s cubic-bezier(.2,.8,.2,1), filter .6s ease; }
#rnd .ph img.dim { filter: saturate(.8) brightness(.72) contrast(1.08); }
#rnd .theme:hover .ph img { transform: scale(1.04); filter: saturate(1) brightness(1); }
#about .ab-m { margin: 0; font-weight: 600; letter-spacing: -0.025em; line-height: 1.22; font-size: clamp(36px, 5.6vw, 84px); }
#about .ab-m em, #about .ab-vt em { font-style: normal; }   
#about .ab-sub { margin: 36px 0 0; max-width: 720px; font-size: clamp(16px, 1.25vw, 18px); line-height: 1.9; color: var(--text-2); }
#about .ab-v { margin-top: 88px; }
#about .ab-vt { margin: 0; font-size: clamp(22px, 2.3vw, 34px); font-weight: 500; line-height: 1.5; letter-spacing: -0.01em; color: var(--text-2); }
#about .vals-w { margin: 96px 0 0; }
#about .vals-h { margin: 0 0 28px; font-size: 20px; font-weight: 600; }
#about .vals { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px; }
#about .val { border-top: 1px solid var(--text-3); padding-top: 28px; }
#about .vt { margin: 0; font-size: clamp(22px, 1.9vw, 28px); font-weight: 600; line-height: 1.45; letter-spacing: -0.01em; }
#about .vt .from { display: block; color: var(--text-2); font-weight: 500; }
#about .vd { margin: 18px 0 0; font-size: 16px; line-height: 1.85; color: var(--text-2); text-wrap: pretty; }
#about .ab-more { margin-top: 56px; }
.feature { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); margin-top: 48px; }
.feature .pane { border-right: 0; }
.feature .side { border: 1px solid var(--line); background: var(--surface); padding: 30px 30px 32px; display: flex; flex-direction: column; gap: 14px; }
.feature .side .h3 { font-size: clamp(22px, 2vw, 30px); margin: 0; }
.feature .side { justify-content: center; }
.feature .side .offer { margin-top: 18px; }
.sol .note { display: block; }
.sol .sol-go { display: inline-flex; margin-top: 14px; }
.person .nm { display: block; font-size: 19px; font-weight: 600; margin-top: 6px; }
.person .nm small { font-family: system-ui, -apple-system, "Segoe UI", sans-serif; font-size: 13px; font-weight: 400; color: var(--text-3); margin-left: 8px; }
#about .abx { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; }
#about .abx > .abx-lbl { grid-column: 1 / -1; }
#about .abx-lbl { margin: 0 0 20px; display: flex; align-items: center; gap: 12px; }
#about .abx-lbl::before { content: ""; width: 6px; height: 6px; background: #2c7aff; flex: none; }
#about .abx-m { grid-column: 1 / span 7; margin: 0; }
#about .abx-lead { grid-column: 9 / span 4; align-self: end; margin: 0 0 14px; }
#about .abx-v { grid-column: 5 / span 8; margin-top: clamp(80px, 9vw, 140px); }
#about .abx-vt { margin: 0; }
#about .vx-w { margin-top: clamp(100px, 11vw, 160px); }
#about .vx { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(242,239,233,.35); }
#about .vx li { display: grid; grid-template-columns: 48px minmax(0, 2.2fr) 240px minmax(0, 3.2fr) minmax(0, 3.4fr); gap: 28px; align-items: center; padding: 40px 0; border-bottom: 1px solid rgba(242,239,233,.14); }
#about .vx-from, #about .vx-to, #about .vx-d { margin: 0; }
#about .vx-to { word-break: keep-all; overflow-wrap: anywhere; }
#about .vx-fig { width: 240px; height: auto; display: block; overflow: visible; shape-rendering: geometricPrecision; }
#about .vx-fig .dw { opacity: 0; transition: opacity .8s ease .3s; }
#about .reveal.in .vx-fig .dw { opacity: 1; }
@media (prefers-reduced-motion: reduce) { #about .vx-fig .dw { opacity: 1; transition: none; } }
@media (max-width: 1100px) {
  #about .abx-m { grid-column: 1 / -1; }
  #about .abx-lead { grid-column: 1 / span 8; margin-top: 32px; }
  #about .abx-v { grid-column: 3 / -1; }
  #about .vx li { grid-template-columns: 40px minmax(0, 1fr) 160px minmax(0, 1.3fr); }
  #about .vx-fig { width: 160px; }
  #about .vx-d { grid-column: 2 / -1; }
}
@media (max-width: 700px) {
  #about .abx-lead, #about .abx-v { grid-column: 1 / -1; }
  #about .vx li { grid-template-columns: 32px minmax(0, 1fr); gap: 8px 12px; padding: 28px 0; }
  #about .vx-fig { grid-column: 2; width: 180px; margin: 10px 0 6px; }
  #about .vx-to, #about .vx-d { grid-column: 2; }
}
.hero.hx { height: calc(100svh - 72px); min-height: 640px; max-height: none; padding: 0 var(--gutter); }
.hx .hx-cv { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.hx .hx-vig { position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse 70% 80% at 72% 48%, transparent 0%, rgba(13,12,11,.15) 45%, rgba(13,12,11,.85) 100%),
              linear-gradient(90deg, rgba(13,12,11,.92) 0%, rgba(13,12,11,.55) 34%, transparent 60%),
              linear-gradient(0deg, rgba(13,12,11,1) 0%, transparent 28%); }
.hx .wrap { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: clamp(96px, 12vh, 140px); }
.hx .head { padding: 0; max-width: 640px; }
.hx .lead { max-width: 560px; margin-top: 24px; }
.hx .hx-steps { position: absolute; top: clamp(32px, 6vh, 64px); left: 0; list-style: none; margin: 0; padding: 0; display: flex; gap: 28px; }
.hx .hx-steps li { display: flex; align-items: center; gap: 10px; color: #f2efe9; transition: color .6s; }
.hx .hx-steps li span { display: inline-block; padding-top: 6px; border-top: 1px solid rgba(242,239,233,.25); min-width: 28px; transition: color .6s, border-color .6s; }
.hx .hx-steps li.on { color: #f2efe9; } .hx .hx-steps li.on span { color: var(--signal); border-color: var(--signal); }
.hx .hx-band { position: absolute; left: 0; right: 0; bottom: 0; border-top: 1px solid rgba(242,239,233,.12); overflow: hidden; padding: 18px 0; background: rgba(13,12,11,.6); }
.hx .hx-track { display: flex; width: max-content; animation: hxmarq 48s linear infinite; }
.hx .hx-track span { padding: 0 28px; white-space: nowrap; color: #f2efe9; }
.hx .hx-track span::after { content: ""; display: inline-block; width: 5px; height: 5px; margin-left: 56px; background: var(--signal); vertical-align: middle; transform: rotate(45deg); opacity: .8; }
@keyframes hxmarq { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .hx .hx-track { animation: none; } }
#hozen { padding-top: clamp(72px, 8vw, 112px); }
@media (max-width: 760px) {
  .hero.hx { height: calc(100svh - 64px); min-height: 600px; }
  .hx .hx-vig { background: linear-gradient(0deg, rgba(13,12,11,1) 0%, rgba(13,12,11,.75) 42%, transparent 70%); }
  .hx .hx-steps { gap: 16px; }
}
@media (max-width: 900px) {
  .sec > .wrap.rl { grid-template-columns: 1fr; }
  .sec > .wrap.rl > *, .sec > .wrap.rl > .sk { grid-column: 1; grid-row: auto; position: static; }
  .sk { margin: 0 0 20px; }
  .sec > .off { padding-left: 0; }
  .feature { grid-template-columns: 1fr; }
  #about .ab-v { margin-top: 48px; }
  #about .vals-w { margin: 64px 0 0; }
  #about .vals { grid-template-columns: 1fr; gap: 36px; }
  .feature .pane { border-right: 1px solid var(--line); border-bottom: 0; }
}
.sec.has-dust { position: relative; overflow: hidden; }
.sec.has-dust > .wrap { position: relative; z-index: 1; }
.dust { position: absolute; pointer-events: none; display: block; z-index: 0; }
#about .dust { top: clamp(380px, 30vw, 460px); right: 0; width: 44%; height: 560px; -webkit-mask-image: radial-gradient(closest-side at 60% 50%, #000 55%, transparent); mask-image: radial-gradient(closest-side at 60% 50%, #000 55%, transparent); }
#process .dust { inset: 0; width: 100%; height: 100%; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
#contact .dust { top: 0; right: 0; width: 60%; height: 100%; -webkit-mask-image: radial-gradient(closest-side at 62% 50%, #000 60%, transparent); mask-image: radial-gradient(closest-side at 62% 50%, #000 60%, transparent); }
@media (max-width: 767px) { #about .dust { width: 100%; height: 420px; opacity: .7; } #contact .dust { width: 100%; opacity: .7; } }
.glow { color: #3d8cff; -webkit-font-smoothing: antialiased; text-shadow: 0 0 16px rgba(40,120,255,.55), 0 0 40px rgba(40,120,255,.24); }  
@media (prefers-reduced-motion: no-preference) {
  .glow { animation: glowb 4.8s ease-in-out infinite; }
  @keyframes glowb { 50% { text-shadow: 0 0 20px rgba(40,120,255,.7), 0 0 52px rgba(40,120,255,.32); } }
}
