/* UPLINK-Toyama / floating editorial flow inspired by spatial portfolio galleries */
.hero-v4:has([data-toyama-flow]){
  min-height:100svh;
  overflow:hidden;
  background:#17191a;
  perspective:1200px;
  isolation:isolate;
}
.hero-v4:has([data-toyama-flow])>picture,
.hero-v4:has([data-toyama-flow]) .uplink-webgl-scene,
.hero-v4:has([data-toyama-flow]) .toyama-film-canvas,
.hero-v4:has([data-toyama-flow]) .toyama-journey-ui,
.hero-v4:has([data-toyama-flow]) .toyama-opening-skip,
.hero-v4:has([data-toyama-flow]) .hero-depth-architecture,
.hero-v4:has([data-toyama-flow]) .toyama-sculpture{display:none!important}

.hero-v4:has([data-toyama-flow])::before{
  z-index:3!important;
  background:
    linear-gradient(90deg,rgba(12,14,15,.38),rgba(10,12,13,.08) 58%,rgba(8,10,11,.28)),
    linear-gradient(0deg,rgba(8,10,11,.62),transparent 42%,rgba(8,10,11,.18))!important;
}

.toyama-flow-stage{
  position:absolute;
  z-index:1;
  inset:0;
  overflow:hidden;
  color:#fff;
  background:#161819;
  --flow-px:0;
  --flow-py:0;
}
.toyama-flow-backdrops{position:absolute;inset:-7%;filter:blur(54px) saturate(.7) brightness(.38);transform:scale(1.16)}
.toyama-flow-backdrops img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.8s cubic-bezier(.16,1,.3,1)}
.toyama-flow-backdrops img.is-active{opacity:.78}
.toyama-flow-noise{position:absolute;inset:0;opacity:.12;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E")}

.toyama-flow-feature{display:none!important}
.toyama-flow-feature::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,8,10,.02) 42%,rgba(3,8,10,.86));pointer-events:none}
.toyama-flow-feature-media,.toyama-flow-feature-media img{position:absolute;inset:0;width:100%;height:100%}
.toyama-flow-webgl{position:absolute;z-index:2;inset:0;width:100%;height:100%;opacity:0;transition:opacity .5s}
.toyama-flow-feature-media.is-webgl-ready .toyama-flow-webgl{opacity:1}
.toyama-flow-feature-media.is-webgl-ready>img{opacity:0!important}
.toyama-flow-feature-media img{object-fit:cover;opacity:0;transform:scale(1.06);filter:saturate(.92);transition:opacity 1.15s cubic-bezier(.16,1,.3,1),transform 6s ease-out}
.toyama-flow-feature-media img.is-active{opacity:1;transform:scale(1);filter:saturate(1.05)}
.toyama-flow-feature-caption{position:absolute;z-index:2;right:clamp(1.2rem,2vw,2.2rem);bottom:clamp(1rem,1.8vw,1.8rem);left:clamp(1.2rem,2vw,2.2rem);display:flex;align-items:end;gap:1rem;color:#fff;text-shadow:0 .3rem 1.5rem rgba(0,0,0,.76)}
.toyama-flow-feature-caption>b{color:#baffea;font:500 clamp(2.4rem,4vw,4.8rem)/.78 ui-monospace,monospace;letter-spacing:-.1em}
.toyama-flow-feature-caption>span{display:grid;gap:.25rem}
.toyama-flow-feature-caption em{font:700 .58rem/1 ui-monospace,monospace;letter-spacing:.18em;color:#baffea}
.toyama-flow-feature-caption strong{font-size:clamp(1.65rem,3.2vw,3.8rem);font-weight:500;line-height:.95;letter-spacing:-.045em;white-space:nowrap}
.toyama-flow-feature-caption small{font:650 .58rem/1 ui-monospace,monospace;letter-spacing:.16em;color:rgba(255,255,255,.72)}

.toyama-flow-card{
  position:absolute;
  z-index:2;
  margin:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.13);
  background:#101415;
  box-shadow:0 2rem 5rem rgba(0,0,0,.34);
  will-change:transform,filter,opacity;
  transition:filter .9s cubic-bezier(.16,1,.3,1),opacity .9s,box-shadow .9s;
  transform-style:preserve-3d;
}
.toyama-flow-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 52%,rgba(0,8,11,.78))}
.toyama-flow-card img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.045);transition:transform 1.4s cubic-bezier(.16,1,.3,1),filter .9s}
.toyama-flow-card figcaption{position:absolute;z-index:2;right:.9rem;bottom:.75rem;left:.9rem;display:flex;align-items:end;gap:.65rem;color:#fff;opacity:.25;transform:translateY(.5rem);transition:opacity .8s,transform .8s}
.toyama-flow-card figcaption>b{color:#baffea;font:500 1.4rem/1 ui-monospace,monospace}
.toyama-flow-card figcaption span{display:grid;gap:.15rem;font-size:clamp(.78rem,1vw,1rem);font-weight:700;letter-spacing:.06em}
.toyama-flow-card figcaption small{font:600 .48rem/1 ui-monospace,monospace;letter-spacing:.14em;color:rgba(255,255,255,.66)}
.toyama-flow-card.is-focus{z-index:8;filter:saturate(1.08) brightness(1.08);box-shadow:0 3.5rem 10rem rgba(0,0,0,.62),0 0 0 1px rgba(187,255,235,.34),inset 0 0 0 1px rgba(255,255,255,.08)}
.toyama-flow-card.is-focus img{transform:scale(1)}
.toyama-flow-card.is-focus figcaption{right:1.2rem;bottom:1.1rem;left:1.2rem;align-items:end;gap:1rem;padding:1rem 1.1rem;border:1px solid rgba(255,255,255,.17);background:linear-gradient(90deg,rgba(4,20,23,.78),rgba(4,20,23,.28));backdrop-filter:blur(18px);opacity:1;transform:none}
.toyama-flow-card.is-focus figcaption>b{font-size:clamp(2rem,3.2vw,4rem)}
.toyama-flow-card.is-focus figcaption span{font-size:clamp(1.25rem,2.35vw,2.8rem);font-weight:520;line-height:1;letter-spacing:-.03em}
.toyama-flow-card.is-focus figcaption small{margin-top:.3rem;font-size:.55rem;letter-spacing:.18em}
.toyama-flow-card.is-focus::before{content:"";position:absolute;z-index:3;inset:-40% -15%;pointer-events:none;background:linear-gradient(105deg,transparent 38%,rgba(188,255,237,.18) 49%,transparent 60%);transform:translateX(-62%);animation:flow-focus-light 5.6s cubic-bezier(.16,1,.3,1) both}
@keyframes flow-focus-light{0%{transform:translateX(-62%)}42%,100%{transform:translateX(62%)}}
.flow-card-1{left:-4vw;top:0;width:27vw;aspect-ratio:1.42}
.flow-card-2{left:42vw;top:0;width:23vw;aspect-ratio:1.48}
.flow-card-3{right:-3vw;top:0;width:28vw;aspect-ratio:1.5}
.flow-card-4{left:31vw;top:0;width:24vw;aspect-ratio:1.42}
.flow-card-5{right:7vw;top:0;width:31vw;aspect-ratio:1.68}
.flow-card-6{left:-8vw;top:0;width:29vw;aspect-ratio:1.58}
.flow-card-7{left:39vw;top:0;width:25vw;aspect-ratio:1.58}
.flow-card-8{right:-6vw;top:0;width:30vw;aspect-ratio:1.58}
.flow-card-1 img{object-position:37% 50%}.flow-card-2 img{object-position:50% 42%}.flow-card-3 img{object-position:58% 50%}.flow-card-4 img{object-position:56% 50%}.flow-card-5 img{object-position:50% 45%}

.toyama-flow-index{position:absolute;z-index:5;right:clamp(1.6rem,4vw,4.5rem);bottom:clamp(5rem,8vh,7rem);display:grid;justify-items:end;gap:.45rem;color:rgba(255,255,255,.74);font:650 .58rem/1 ui-monospace,monospace;letter-spacing:.16em}
.toyama-flow-index::before{content:"";width:clamp(4rem,9vw,8rem);height:1px;background:linear-gradient(90deg,transparent,#baffea)}
.toyama-flow-index b{font-size:.72rem;color:#baffea}

.hero-v4.toyama-flow-ready .hero-master-grid{position:relative;z-index:6;min-height:100svh;display:block!important;padding-top:0}
.hero-v4.toyama-flow-ready .hero-v4-copy{
  position:absolute;
  left:clamp(1.6rem,4.8vw,6rem);
  top:50%;
  width:min(54rem,68vw);
  opacity:1!important;
  filter:none!important;
  transform:translateY(-50%)!important;
  pointer-events:none;
}
.hero-v4.toyama-flow-ready .hero-v4-copy .hero-kicker{margin:0 0 1.4rem;color:#baffea;font:700 .64rem/1 ui-monospace,monospace;letter-spacing:.22em;text-shadow:0 .2rem 1.3rem rgba(0,0,0,.65)}
.hero-v4.toyama-flow-ready .hero-v4-copy h1{margin:0;color:#f8fbfa;font-size:clamp(3.8rem,7.2vw,8.6rem);font-weight:430;line-height:.86;letter-spacing:-.075em;text-shadow:0 .35rem 2.5rem rgba(0,0,0,.38)}
.hero-v4.toyama-flow-ready .hero-v4-copy h1 span,.hero-v4.toyama-flow-ready .hero-v4-copy h1 strong{display:block;font:inherit;color:inherit;white-space:nowrap}
.hero-v4.toyama-flow-ready .hero-v4-copy>p:not(.hero-kicker){max-width:34rem;margin:1.6rem 0 0;color:rgba(249,255,253,.86);font-size:clamp(.86rem,1.2vw,1.05rem);line-height:1.8;text-shadow:0 .2rem 1.2rem rgba(0,0,0,.72)}
.hero-v4.toyama-flow-ready .hero-links{pointer-events:auto;display:flex;align-items:center;gap:.55rem;margin-top:1.55rem}
.hero-v4.toyama-flow-ready .hero-links .button{min-height:3.15rem;padding:.9rem 1.25rem;border-color:rgba(255,255,255,.38);background:rgba(10,17,18,.48);backdrop-filter:blur(16px);color:#fff}
.hero-v4.toyama-flow-ready .hero-links .button.primary{border-color:#baffea;background:#baffea;color:#0b1b1d}
.hero-v4.toyama-flow-ready .hero-links .text-link{color:#fff}
.hero-v4.toyama-flow-ready .hero-offer-key{display:none!important}
.hero-v4.toyama-flow-ready .hero-now{display:none!important}
.hero-v4.toyama-flow-ready .hero-field-dock{z-index:8}

@media(max-width:900px){
  .flow-card-1{width:34vw}.flow-card-2{left:52vw;width:30vw}.flow-card-3{width:35vw}.flow-card-4{left:23vw;width:34vw}.flow-card-5{width:42vw}
  .flow-card-6{width:34vw}.flow-card-7{left:48vw;width:31vw}.flow-card-8{width:36vw}
  .hero-v4.toyama-flow-ready .hero-v4-copy{width:82vw}
}
@media(max-width:700px){
  .hero-v4:has([data-toyama-flow]){min-height:100svh}
  .toyama-flow-backdrops{inset:-12%;filter:blur(38px) saturate(.68) brightness(.34)}
  .toyama-flow-card figcaption{right:.55rem;bottom:.55rem;left:.55rem}
  .toyama-flow-card figcaption span{font-size:.66rem}.toyama-flow-card figcaption>b{font-size:1rem}
  .flow-card-1{left:-17vw;width:58vw}.flow-card-2{left:53vw;width:57vw}.flow-card-3{right:-23vw;width:66vw}.flow-card-4{left:5vw;width:58vw}.flow-card-5{right:-10vw;width:70vw}
  .flow-card-6{left:-20vw;width:64vw}.flow-card-7{left:48vw;width:62vw}.flow-card-8{right:-24vw;width:68vw}
  .toyama-flow-card.is-focus figcaption{top:.75rem;right:.75rem;bottom:auto;left:.75rem;padding:.7rem .8rem}
  .toyama-flow-card.is-focus figcaption>b{font-size:1.75rem}.toyama-flow-card.is-focus figcaption span{font-size:clamp(1.15rem,5.8vw,1.8rem)}
  .hero-v4.toyama-flow-ready .hero-v4-copy{left:1.25rem;top:47%;width:calc(100vw - 2.5rem);transform:translateY(-50%)!important}
  .hero-v4.toyama-flow-ready .hero-v4-copy h1{font-size:clamp(3.05rem,15.4vw,5rem);line-height:.9;letter-spacing:-.075em}
  .hero-v4.toyama-flow-ready .hero-v4-copy h1 span,.hero-v4.toyama-flow-ready .hero-v4-copy h1 strong{white-space:normal}
  .hero-v4.toyama-flow-ready .hero-v4-copy>p:not(.hero-kicker){margin-top:1.1rem;font-size:.84rem;line-height:1.7}
  .hero-v4.toyama-flow-ready .hero-links{display:grid;grid-template-columns:1fr 1fr;gap:.42rem;margin-top:1.1rem}
  .hero-v4.toyama-flow-ready .hero-links .button{justify-content:center;min-height:3rem;padding:.75rem .5rem;font-size:.76rem}
  .hero-v4.toyama-flow-ready .hero-links .text-link{grid-column:1/-1;margin-top:.35rem}
  .toyama-flow-index{right:1rem;bottom:5.4rem}
}
@media(prefers-reduced-motion:reduce){
  .toyama-flow-card{transform:none!important}
  .toyama-flow-card:not(.flow-card-1):not(.flow-card-3){display:none}
}