/* VANTELLE editorial motion — lightweight, mobile-safe, designed for video-heavy pages. */
:root { --v-motion-ease: cubic-bezier(.21,.78,.23,1); }

/* A significantly larger opening film, retaining the original video aspect and correct frame borders. */
@media (min-width:1101px) {
  .hero.shell { grid-template-columns:minmax(0,.87fr) minmax(0,1.13fr); gap:clamp(26px,3.3vw,54px); min-height:760px; padding-block:60px 48px; }
  .hero-aside { display:none; }
  .hero-copy { min-width:0; }
  .hero h1 { font-size:clamp(64px,6.5vw,96px); }
  .hero-film { width:min(100%,640px); justify-self:stretch; padding-top:0; }
  .hero-film .film-window { aspect-ratio:4/5; }
}
@media (min-width:761px) and (max-width:1100px) {
  .hero.shell { display:flex; flex-direction:column; gap:32px; padding-block:44px 38px; }
  .hero-film { width:min(100%,680px); max-width:680px; margin-inline:auto; }
  .hero-film .film-window { aspect-ratio:4/5; }
}
@media (max-width:760px) {
  .hero.shell { gap:24px; }
  .hero-film { width:calc(100% + 44px); max-width:none; margin-inline:-22px; padding-top:0; }
  .hero-film .film-window { width:100%; aspect-ratio:4/4.8; }
  .film-caption,.film-seek,.film-status { padding-inline:0!important; margin-inline:22px; }
  .film-caption > span { font-size:11px; }
  .film-window::after { inset:9px; }
  .hero-film .film-label { left:20px; bottom:20px; }
}
@media(max-width:350px) {
  .hero-film { width:calc(100% + 36px); margin-inline:-18px; }
  .film-caption,.film-seek,.film-status { margin-inline:18px; }
}
.film-window { overflow:hidden; border-radius:1px; isolation:isolate; box-shadow:0 28px 70px rgba(39,34,25,.19); }
.film-window::before { z-index:4; inset:0; border:1px solid rgba(103,88,69,.92); }
.film-window::after { z-index:4; border:1px solid rgba(247,239,223,.62); }
.film-window video,.film-poster { object-fit:cover; object-position:50% 50%; }

/* Page movement — animations occur only if JavaScript has initialized. */
@keyframes v-page-arrive {
  from { opacity:.45; transform:translate3d(0,12px,0); }
  to { opacity:1; transform:translate3d(0,0,0); }
}
@keyframes v-hero-enter {
  from { opacity:0; transform:translate3d(0,22px,0); filter:blur(5px); }
  to { opacity:1; transform:translate3d(0,0,0); filter:blur(0); }
}
html.v-motion-ready main { animation:v-page-arrive 560ms var(--v-motion-ease) both; }
html.v-motion-ready .hero-copy > .eyebrow { animation:v-hero-enter 820ms .06s var(--v-motion-ease) both; }
html.v-motion-ready .hero-copy > h1 { animation:v-hero-enter 920ms .16s var(--v-motion-ease) both; }
html.v-motion-ready .hero-copy > .hero-intro { animation:v-hero-enter 840ms .32s var(--v-motion-ease) both; }
html.v-motion-ready .hero-actions { animation:v-hero-enter 840ms .45s var(--v-motion-ease) both; }
html.v-motion-ready .hero-film { animation:v-hero-enter 950ms .28s var(--v-motion-ease) both; }
html.v-motion-ready.v-page-leaving main,
html.v-motion-ready.v-page-leaving .site-footer { animation:none; opacity:0; transform:translate3d(0,11px,0); transition:opacity 210ms ease,transform 210ms ease; }
html.v-motion-ready .site-footer { transition:opacity 210ms ease,transform 210ms ease; }

/* Animated editorial text, individual words moving into place. */
html.v-motion-ready .v-split-title .v-word {
  display:inline-block; white-space:nowrap; opacity:0; filter:blur(3px);
  transform:translate3d(0,22px,0);
  transition:opacity 720ms var(--v-motion-ease), transform 720ms var(--v-motion-ease), filter 720ms ease;
  transition-delay:var(--v-word-delay,0ms);
}
html.v-motion-ready .v-split-title.v-visible .v-word {
  opacity:1; filter:blur(0); transform:translate3d(0,0,0);
}
html.v-motion-ready .v-rise { opacity:0; transform:translate3d(0,24px,0); transition:opacity 850ms var(--v-motion-ease),transform 850ms var(--v-motion-ease); transition-delay:var(--v-delay,0ms); }
html.v-motion-ready .v-rise.v-visible { opacity:1; transform:translate3d(0,0,0); }
html.v-motion-ready .v-text-fade { opacity:0; transform:translate3d(0,12px,0); transition:opacity 780ms var(--v-motion-ease), transform 780ms var(--v-motion-ease); transition-delay:var(--v-delay,0ms); }
html.v-motion-ready .v-text-fade.v-visible { opacity:1; transform:translate3d(0,0,0); }

/* Quiet hover detail on photos, cards and navigation (never a distracting bounce). */
@media(hover:hover) and (pointer:fine){
  .gallery-item img,.wallpaper-card img,.work-main img,.work-detail img,.product-row img { transition:transform 900ms var(--v-motion-ease); }
  .gallery-item:hover img,.wallpaper-card:hover img,.work-main:hover img,.work-detail:hover img,.product-row:hover img { transform:scale(1.035); }
  .site-menu .menu-links a { transition:padding-left 300ms var(--v-motion-ease),color 300ms ease; }
  .site-menu .menu-links a:hover { padding-left:10px; }
}

/* Cursor-following illumination + tiny light flecks. No canvas or external libraries. */
.v-cursor-light { position:fixed; width:240px; height:240px; left:0; top:0; z-index:48; pointer-events:none; opacity:0;
  border-radius:50%; background:radial-gradient(circle,rgba(176,139,84,.19) 0%,rgba(172,144,96,.09) 32%,rgba(206,168,100,0) 70%);
  transform:translate3d(-350px,-350px,0); will-change:transform,opacity; mix-blend-mode:multiply;
  transition:opacity 230ms ease; }
.v-cursor-light.v-active {opacity:1;}
.v-cursor-fleck { position:fixed; z-index:47; border-radius:50%; background:#a28c6b; pointer-events:none; opacity:0; width:3px; height:3px; box-shadow:0 0 8px rgba(172,140,85,.32); transform:translate3d(-20px,-20px,0); }
@keyframes v-tap-wave { from {opacity:.55; transform:translate3d(-50%,-50%,0) scale(.25)} to{opacity:0; transform:translate3d(-50%,-50%,0) scale(2)} }
.v-tap-wave { position:fixed; left:0; top:0; width:56px; height:56px; z-index:80; pointer-events:none;
  border:1px solid rgba(153,122,79,.55); border-radius:50%; animation:v-tap-wave 600ms ease-out forwards; }
@media(hover:none), (pointer:coarse){.v-cursor-light,.v-cursor-fleck{display:none!important;}}
@media(prefers-reduced-motion:reduce){
  html.v-motion-ready main,html.v-motion-ready .hero-copy > *,html.v-motion-ready .hero-film {animation:none!important;opacity:1!important;transform:none!important;filter:none!important;}
  html.v-motion-ready .v-split-title .v-word,html.v-motion-ready .v-rise,html.v-motion-ready .v-text-fade {opacity:1!important;transform:none!important;filter:none!important;transition:none!important;}
  .v-cursor-light,.v-cursor-fleck,.v-tap-wave{display:none!important;}
}
@media print { html.v-motion-ready main,html.v-motion-ready .v-rise,html.v-motion-ready .v-text-fade,html.v-motion-ready .v-split-title .v-word {animation:none!important;opacity:1!important;transform:none!important;filter:none!important;}}
