:root{--ease-premium:cubic-bezier(.22,1,.36,1);--scroll-progress:0%}

/* Scroll progress and persistent brand motion */
.rail::after{content:"";position:absolute;top:0;right:0;width:3px;height:var(--scroll-progress);background:rgba(255,255,255,.92);box-shadow:0 0 14px rgba(255,255,255,.45);transition:height .1s linear}
.rail-mark{animation:rail-mark-breathe 4.8s ease-in-out infinite}
.rail-title{animation:rail-title-drift 7s ease-in-out infinite}
.menu-toggle span{transform-origin:center;transition:transform .4s var(--ease-premium),width .35s var(--ease-premium)}
.menu-toggle:hover span:first-child{transform:translateY(4.5px) rotate(35deg)}
.menu-toggle:hover span:last-child{transform:translateY(-4.5px) rotate(-35deg)}

/* Hero choreography begins as the entrance clears */
.hero .photo-slide>img{transform:scale(1.08);transition:transform 7s var(--ease-premium)}
.site-entered .hero .photo-slide>img{transform:scale(1)}
.slide.is-active.photo-slide>img{animation:slide-image-in 1.7s var(--ease-premium) both}
.slide.is-active .hero-caption>*{animation:slide-copy-in .85s var(--ease-premium) both}
.slide.is-active .hero-caption>*:nth-child(2){animation-delay:.1s}.slide.is-active .hero-caption>*:nth-child(3){animation-delay:.2s}
.hero-header,.hero-caption,.hero-controls{opacity:0;transform:translateY(24px)}
.site-entered .hero-header{animation:hero-arrive .9s var(--ease-premium) .08s forwards}
.site-entered .hero-caption{animation:hero-arrive 1.05s var(--ease-premium) .2s forwards}
.site-entered .hero-controls{animation:hero-arrive .9s var(--ease-premium) .42s forwards}
.hero-caption h1{background:linear-gradient(100deg,#fff 20%,#c5c5c5 45%,#fff 70%);background-size:220% auto;color:transparent;background-clip:text;-webkit-background-clip:text;animation:text-shimmer 7s linear infinite}
.slide-nav button{transition:transform .35s var(--ease-premium),background .3s ease,color .3s ease}
.slide-nav button:hover{transform:rotate(12deg) scale(1.08);background:#fff;color:#171717;opacity:1}
.text-link span,.quote-action span,.header-contact{display:inline-block;transition:transform .35s var(--ease-premium)}
.text-link:hover span,.quote-action:hover span{transform:translate(6px,-4px)}
.header-contact:hover{transform:translateX(5px)}

/* Viewport reveals */
.motion-ready [data-reveal]{transition-property:opacity,transform,clip-path,filter;transition-duration:.9s;transition-timing-function:var(--ease-premium);transition-delay:var(--delay,0ms);will-change:opacity,transform}
.motion-ready [data-reveal="fade-up"]{opacity:0;transform:translateY(34px);filter:blur(4px)}
.motion-ready [data-reveal="title-up"]{opacity:0;transform:translateY(58px)}
.motion-ready [data-reveal="card-up"]{opacity:0;transform:translateY(65px) rotate(.5deg)}
.motion-ready [data-reveal="image-in"]{opacity:0;transform:scale(.92)}
.motion-ready [data-reveal="scale-in"]{opacity:0;transform:scale(.96) translateY(25px)}
.motion-ready [data-reveal="chip-in"]{opacity:0;transform:translateX(-18px)}
.motion-ready [data-reveal="slide-in"]{opacity:0;transform:translateX(26px)}
.motion-ready [data-reveal].is-visible{opacity:1;transform:none;clip-path:inset(0);filter:none}

/* Project, team and gallery interaction */
.team-portrait,.founder-image,.work-visual{overflow:hidden}
.team-portrait img,.founder-image img{transition:transform 1.1s var(--ease-premium),filter .6s ease}
.team-member:hover img,.founder-card:hover img{transform:scale(1.045)}
.team-member,.founder-card,.work-card{transition:transform .5s var(--ease-premium),box-shadow .5s ease}
.team-member:hover,.founder-card:hover{transform:translateY(-8px)}
.work-card:hover{transform:translateY(-10px);box-shadow:0 24px 60px rgba(0,0,0,.09)}
.insta-media::after,.google-media::after{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,0);transition:border-color .35s ease,transform .5s var(--ease-premium);pointer-events:none}
.insta-media:hover::after,.google-media:hover::after{border-color:rgba(255,255,255,.75);transform:scale(.94)}
.insta-media span,.google-media span{transition:transform .4s var(--ease-premium),background .3s ease}
.insta-media:hover span,.google-media:hover span{transform:translate(5px,-5px)}

/* Buttons, tags and information surfaces */
.disciplines span,.service-list span,.highlight-links a,.profile-links a,.facebook-actions a{transition:transform .3s var(--ease-premium),background .3s ease,color .3s ease}
.disciplines span:hover,.service-list span:hover{transform:translateY(-4px)}
.service-list span:hover{background:#fff;color:var(--red)}
.facebook-card{overflow:hidden;position:relative}
.facebook-card::before{content:"";position:absolute;width:280px;height:280px;border-radius:50%;right:-170px;top:-185px;background:#287bea;opacity:.22;transition:transform .9s var(--ease-premium)}
.facebook-card:hover::before{transform:scale(1.55)}
.facebook-monogram{transition:transform .65s var(--ease-premium),box-shadow .4s ease}
.facebook-card:hover .facebook-monogram{transform:rotate(-8deg) scale(1.08);box-shadow:0 12px 28px rgba(0,0,0,.25)}
.google-rating strong,.profile-snapshot strong,.portfolio-stats strong,.facebook-stats strong{font-variant-numeric:tabular-nums}
.studio-map{transition:filter .7s ease,transform .7s var(--ease-premium)}
.studio-map:hover{filter:grayscale(0) contrast(1);transform:scale(1.01)}

/* Dialog motion */
#menu[open]{animation:menu-in .55s var(--ease-premium)}
#menu[open] nav a{opacity:0;animation:menu-link-in .6s var(--ease-premium) forwards}
#menu[open] nav a:nth-child(1){animation-delay:.08s}#menu[open] nav a:nth-child(2){animation-delay:.12s}#menu[open] nav a:nth-child(3){animation-delay:.16s}#menu[open] nav a:nth-child(4){animation-delay:.2s}#menu[open] nav a:nth-child(5){animation-delay:.24s}#menu[open] nav a:nth-child(6){animation-delay:.28s}#menu[open] nav a:nth-child(7){animation-delay:.32s}#menu[open] nav a:nth-child(8){animation-delay:.36s}#menu[open] nav a:nth-child(9){animation-delay:.4s}
#project-dialog[open]{animation:dialog-in .55s var(--ease-premium)}

@keyframes hero-arrive{to{opacity:1;transform:none}}
@keyframes slide-image-in{from{opacity:.55;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}
@keyframes slide-copy-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes text-shimmer{to{background-position:220% center}}
@keyframes rail-mark-breathe{0%,100%{transform:scale(1);filter:brightness(1.25) drop-shadow(0 0 0 rgba(255,255,255,0))}50%{transform:scale(1.08);filter:brightness(1.55) drop-shadow(0 0 10px rgba(255,255,255,.42))}}
@keyframes rail-title-drift{0%,100%{transform:rotate(180deg) translateX(0)}50%{transform:rotate(180deg) translateX(8px)}}
@keyframes menu-in{from{opacity:0;transform:translateX(100%)}to{opacity:1;transform:none}}
@keyframes menu-link-in{from{opacity:0;transform:translateX(35px)}to{opacity:1;transform:none}}
@keyframes dialog-in{from{opacity:0;transform:translateY(35px) scale(.96)}to{opacity:1;transform:none}}

@media(max-width:800px){
  .motion-ready [data-reveal="card-up"]{transform:translateY(38px)}
  .motion-ready [data-reveal="title-up"]{transform:translateY(35px)}
  .team-member:hover,.founder-card:hover,.work-card:hover{transform:none}
  .rail-title{animation:none}
}

@media(prefers-reduced-motion:reduce){
  .rail::after{transition:none}.rail-mark,.rail-title,.hero-caption h1{animation:none!important}
  .hero .photo-slide>img,.hero-header,.hero-caption,.hero-controls{opacity:1;transform:none;transition:none}
  [data-reveal]{opacity:1!important;transform:none!important;clip-path:none!important;filter:none!important;transition:none!important}
  #menu[open],#menu[open] nav a,#project-dialog[open]{animation:none!important;opacity:1}
}

/* Expanded studio story */
.studio-intro{display:grid;grid-template-columns:1fr 1fr;gap:24px 38px;margin:38px 0;color:var(--grey);line-height:1.85}
.studio-intro strong{color:var(--ink);font-weight:600}
.studio-belief{display:grid;grid-template-columns:1fr 1.5fr;gap:38px;padding:38px 0;border-top:1px solid #ddd;border-bottom:1px solid #ddd}
.studio-belief p{font-size:14px;color:var(--grey)}
.studio-belief strong{font-size:clamp(23px,2.4vw,38px);font-weight:400;line-height:1.35;letter-spacing:-.7px}
.studio-disciplines{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:44px;border-top:1px solid #ddd;border-bottom:1px solid #ddd}
.studio-disciplines article{padding:26px 26px 30px 0;transition:background .35s ease,transform .45s var(--ease-premium)}
.studio-disciplines article+article{padding-left:26px;border-left:1px solid #ddd}
.studio-disciplines article:hover{background:#f5f5f3;transform:translateY(-6px)}
.studio-disciplines span{font-size:10px;letter-spacing:1.5px;color:var(--red)}
.studio-disciplines h3{font-size:22px;font-weight:400;margin:28px 0 12px}
.studio-disciplines p{font-size:14px;line-height:1.65;color:var(--grey)}
.studio-punchline{display:flex;justify-content:space-between;gap:25px;align-items:baseline;margin-top:48px;font-size:clamp(25px,3vw,46px);line-height:1.15;letter-spacing:-1.2px}
.studio-punchline span{font-size:12px;letter-spacing:1.8px;text-transform:uppercase;color:var(--red)}
@media(max-width:800px){.studio-intro{grid-template-columns:1fr;gap:20px;margin:28px 0}.studio-belief{grid-template-columns:1fr;gap:20px;padding:30px 0}.studio-disciplines{grid-template-columns:1fr}.studio-disciplines article,.studio-disciplines article+article{padding:24px 0;border-left:0;border-bottom:1px solid #ddd}.studio-disciplines article:last-child{border-bottom:0}.studio-disciplines article:hover{transform:none}.studio-punchline{display:block;margin-top:36px}.studio-punchline span{display:block;margin-bottom:13px}}