
:root{
  --bg:#070706;
  --fg:#f2eee6;
  --muted:#a8a199;
  --dim:#706b65;
  --line:rgba(242,238,230,.16);
  --line-strong:rgba(242,238,230,.34);
  --paper:#e9e1d3;
  --ink:#181714;
  --sans:"Helvetica Neue",Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;min-width:320px;background:var(--bg);color:var(--fg);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit}
.grain{position:fixed;inset:0;z-index:100;pointer-events:none;opacity:.065;mix-blend-mode:screen;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 150 150' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E")}
.site-header{position:absolute;z-index:50;top:0;left:0;right:0;padding:calc(18px + env(safe-area-inset-top)) 24px 18px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#fff}
.brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  width:max-content;
  line-height:1;
}
.brand strong{
  display:block;
  font-size:1.08rem;
  line-height:.9;
  letter-spacing:.12em;
  padding-left:.12em;
}
.brand span{
  display:block;
  width:100%;
  text-align:center;
  font:600 .56rem/1 var(--sans);
  letter-spacing:.19em;
  padding-left:.19em;
  transform:translateX(-3px);
}
.header-links{
  display:flex;
  align-items:center;
  font:600 .86rem/1 var(--sans);
  letter-spacing:.10em;
}
.header-links a{
  padding:7px 0 5px;
  border-bottom:1px solid rgba(255,255,255,.48);
}
.header-links a:hover{
  border-color:currentColor;
}

.hero{position:relative;width:100%;height:100svh;min-height:min(620px,100svh);overflow:hidden;border-bottom:1px solid var(--line-strong);background:#111}
.hero-poster{position:absolute;inset:0;background:url("media-r61/hugo-boss-poster.jpg") center/cover no-repeat;transform:scale(1.02)}
.hero-video{position:absolute;inset:0;overflow:hidden}.hero-video iframe{position:absolute;left:50%;top:50%;width:100vw;height:56.25vw;min-width:177.778svh;min-height:100svh;transform:translate(-50%,-50%);border:0;pointer-events:none}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08),transparent 32%,transparent 70%,rgba(0,0,0,.18));pointer-events:none}
.hero-meta{position:absolute;z-index:3;left:24px;right:24px;top:82px;display:flex;justify-content:flex-end;gap:20px;padding-top:12px;border-top:1px solid rgba(255,255,255,.35);font:500 .57rem/1.2 var(--sans);letter-spacing:.1em}
.hero-copy{position:absolute;z-index:3;left:24px;right:24px;bottom:25px}.hero-copy>p{margin:0 0 14px;font:600 .6rem/1 var(--sans);letter-spacing:.13em}
h1{margin:0}
.hero-title{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  width:max-content;
  max-width:100%;
  text-transform:uppercase;
}
.hero-title .title-main{
  display:block;
  font-size:clamp(5rem,14vw,13rem);
  line-height:.72;
  letter-spacing:-.075em;
  font-weight:800;
}
.hero-title .title-sub{
  display:block;
  margin-top:12px;
  font-size:clamp(1.06rem,1.9vw,1.72rem);
  line-height:1;
  letter-spacing:.26em;
  padding-left:.26em;
  font-weight:600;
}
.hero-foot{margin-top:30px;padding-top:13px;border-top:1px solid rgba(255,255,255,.35);display:flex;justify-content:space-between;gap:20px;font:500 .57rem/1.35 var(--sans);letter-spacing:.08em;text-transform:uppercase}

/* Seamless high-resolution festival-laurel marquee */
.laurels{
  overflow:hidden;
  height:124px;
  display:flex;
  align-items:center;
  border-bottom:1px solid var(--line-strong);
  background:#000000 !important;
  isolation:isolate;
}
.laurels-track{
  display:flex;
  align-items:center;
  width:max-content;
  will-change:transform;
  animation:none;
}
.laurels-group{
  display:flex;
  flex:none;
  align-items:center;
  gap:66px;
  padding-right:66px;
}
.laurels-group img{
  display:block;
  flex:none;
  width:auto;
  height:78px;
  max-width:250px;
  object-fit:contain;
  opacity:.94;
}
@keyframes laurels{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}

.section{padding:76px 24px 92px;border-bottom:1px solid var(--line-strong)}
.section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,390px);gap:60px;align-items:end;margin-bottom:38px}
.section-index{margin:0 0 18px;color:var(--muted);font:500 .58rem/1 var(--sans);letter-spacing:.09em;text-transform:uppercase}
.section h2,.contact-section h2{margin:0;font-size:clamp(3rem,6.6vw,7rem);line-height:.88;letter-spacing:-.06em;font-weight:500}
.section-side p{margin:0 0 22px;color:var(--muted);font-size:.84rem;line-height:1.55}.section-side a{display:inline-block;padding-bottom:4px;border-bottom:1px solid var(--line-strong);font:500 .59rem/1 var(--sans);letter-spacing:.09em}

.rail-shell{position:relative}.project-rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(250px,30vw);gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 2px 12px}.project-rail::-webkit-scrollbar{display:none}
.project-card{position:relative;scroll-snap-align:start;min-width:0}.project-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#111;transition:transform .35s ease,filter .35s ease}.project-card:hover img{transform:scale(.985);filter:brightness(.88)}
.project-card strong{display:block;margin-top:12px;font-size:1rem;letter-spacing:-.02em}.project-card small{display:block;margin-top:5px;color:var(--muted);font:500 .58rem/1.35 var(--sans)}
.rail-button{position:absolute;z-index:5;top:calc(50% - 44px);width:42px;height:42px;border:1px solid rgba(255,255,255,.38);border-radius:50%;background:rgba(7,7,6,.72);backdrop-filter:blur(10px);color:#fff;cursor:pointer}.rail-button.prev{left:12px}.rail-button.next{right:12px}.rail-button:hover{background:var(--paper);color:var(--ink)}

/* Additional credits: horizontal project rail */
.external-rail-shell{
  position:relative;
}
.external-rail{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(330px,33.333vw);
  gap:1px;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  background:var(--line);
  border:1px solid var(--line);
}
.external-rail::-webkit-scrollbar{display:none}

.external-card{
  position:relative;
  min-height:clamp(360px,38vw,560px);
  overflow:hidden;
  isolation:isolate;
  background:#10100f;
  scroll-snap-align:start;
}
.external-image{
  position:absolute;
  inset:0;
  z-index:-3;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  transition:transform .55s cubic-bezier(.2,.7,.2,1),filter .4s ease;
}

.external-image.equal-eire{background-image:url("https://i.vimeocdn.com/video/2157703278-9897e2fc90bc10a1535573dcf194c2a58d0d05ae62c8ca00291030db48f6c7c7-d_2400?region=us")}
.external-image.marin{background-image:url("https://i.vimeocdn.com/video/2062742046-b9e3c106ec3792824ee6c8e646330af06537155f42300f7a6668948e00d550f4-d_2400?region=us")}
.external-image.unrooted{background-image:url("https://images.squarespace-cdn.com/content/v1/5d77f5f7d7a34a11c94a2141/18f09a41-ff75-4ce4-ac64-2cc5ba455258/A002_05091344_C024%2BAmber%2Bwalks%2Bthrough%2Bforest.png")}
.external-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(0,0,0,.06) 25%,rgba(0,0,0,.82) 100%)}
.external-copy{position:absolute;left:20px;right:20px;bottom:20px}
.external-copy>span,.external-copy small{font:500 .55rem/1.25 var(--sans);letter-spacing:.1em;color:#d1ccc4}
.external-copy strong{display:block;margin:11px 0 12px;font-size:clamp(1.55rem,2.9vw,3rem);line-height:.95;letter-spacing:-.045em;font-weight:500}
.external-copy p{margin:0 0 23px;color:#c9c4ba;font:.67rem/1.45 var(--sans)}
.external-card:hover .external-image{transform:scale(1.035);filter:saturate(.9) brightness(.9)}



.contact-section{
  border-bottom:1px solid var(--line-strong);
}
.contact-statement{
  padding:76px 24px 64px;
  border-bottom:1px solid var(--line);
}
.contact-statement h2{
  margin:0;
  max-width:1100px;
  font-size:clamp(3rem,6.6vw,7rem);
  line-height:.88;
  letter-spacing:-.06em;
  font-weight:500;
}
.contact-body{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,.72fr);
  min-height:560px;
}
.contact-form{
  padding:42px 24px 56px;
  display:flex;
  flex-direction:column;
  gap:24px;
}
.form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.contact-form label{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.contact-form label>span{
  color:var(--muted);
  font:500 .56rem/1 var(--sans);
  letter-spacing:.1em;
  text-transform:uppercase;
}
.contact-form input,
.contact-form textarea{
  width:100%;
  border:0;
  border-bottom:1px solid var(--line-strong);
  border-radius:0;
  background:transparent;
  color:var(--fg);
  padding:12px 0 13px;
  font:400 1rem/1.45 var(--sans);
  outline:none;
  resize:vertical;
}
.contact-form textarea{
  min-height:132px;
}
.contact-form input:focus,
.contact-form textarea:focus{
  border-color:var(--fg);
}
.contact-form button{
  width:max-content;
  margin-top:8px;
  padding:0 0 6px;
  border:0;
  border-bottom:1px solid var(--fg);
  background:transparent;
  color:var(--fg);
  cursor:pointer;
  font:600 .6rem/1 var(--sans);
  letter-spacing:.1em;
}
.contact-form button:hover{
  opacity:.72;
}
.form-note{
  margin:0;
  color:var(--dim);
  font:500 .53rem/1.45 var(--sans);
  letter-spacing:.05em;
}
.contact-links{
  border-left:1px solid var(--line);
}
.contact-links a{
  min-height:112px;
  padding:0 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-bottom:1px solid var(--line);
  transition:background .2s,color .2s,padding .2s;
}
.contact-links a:last-child{border-bottom:0}
.contact-links span{
  font-size:clamp(1.2rem,2.35vw,2.2rem);
  letter-spacing:-.03em;
}
.contact-links small{
  color:var(--muted);
  font:500 .55rem/1.3 var(--sans);
  text-align:right;
}
.contact-links a:hover{
  background:var(--paper);
  color:var(--ink);
  padding-left:34px;
}
.contact-links a:hover small{color:#6d685f}





.hero-capabilities{
  display:flex;
  flex-direction:column;
  gap:7px;
}




/* Compact specialties strip */
.capabilities-strip{
  border-top:1px solid var(--line-strong);
  border-bottom:1px solid var(--line-strong);
  background:#090908;
}
.capabilities-kicker{
  padding:15px 24px 12px;
  color:var(--muted);
  border-bottom:1px solid var(--line);
  font:600 .78rem/1 var(--sans);
  letter-spacing:.10em;
}
.capabilities-list{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.capabilities-list article{
  min-height:0;
  padding:18px 24px 20px;
  border-right:1px solid var(--line);
}
.capabilities-list article:last-child{
  border-right:0;
}
.capabilities-list h3{
  margin:0 0 8px;
  font-size:clamp(1.25rem,1.7vw,1.7rem);
  line-height:1;
  letter-spacing:-.035em;
  font-weight:500;
}
.capabilities-list p{
  margin:0;
  color:var(--muted);
  font:500 .88rem/1.42 var(--sans);
  letter-spacing:.01em;
}
@media(max-width:760px){
  .capabilities-kicker{
    padding:13px 15px 11px;
    font-size:.76rem;
  }
  .capabilities-list{
    grid-template-columns:1fr;
  }
  .capabilities-list article{
    padding:15px 15px 16px;
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .capabilities-list article:last-child{
    border-bottom:0;
  }
  .capabilities-list h3{
    font-size:1.18rem;
  }
  .capabilities-list p{
    font-size:.84rem;
    line-height:1.45;
  }
}

footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:22px 24px calc(26px + env(safe-area-inset-bottom));color:var(--dim);font:500 .55rem/1.2 var(--sans);letter-spacing:.1em}


/* Tablet + desktop readability pass */
.hero-film-link{
  position:relative;
  display:inline-block;
  padding-bottom:3px;
  border-bottom:1px solid rgba(255,255,255,.55);
  pointer-events:auto;
}
.hero-film-link:hover{
  opacity:.72;
}

@media (min-width: 700px){
  .hero-meta{
    font-size:.92rem;
    line-height:1.3;
  }
  .hero-copy>p{
    font-size:.92rem;
  }
  .hero-foot{
    font-size:.88rem;
    line-height:1.45;
  }

  .section-index{
    font-size:.94rem;
    line-height:1.2;
  }
  .section-side p{
    font-size:1.12rem;
    line-height:1.6;
  }
  .section-side a{
    font-size:.92rem;
  }

  
  .project-card strong{
    font-size:1.35rem;
    line-height:1.12;
  }
  .project-card small{
    font-size:.92rem;
    line-height:1.45;
  }

  .external-copy>span,
  .external-copy small{
    font-size:.88rem;
    line-height:1.3;
  }
  .external-copy p{
    font-size:.96rem;
    line-height:1.5;
  }

  .contact-form label>span{
    font-size:.9rem;
  }
  .form-note{
    font-size:.82rem;
    line-height:1.5;
  }
  .contact-form button{
    font-size:.9rem;
  }

  .contact-links small{
    font-size:.88rem;
    line-height:1.4;
  }

  footer{
    font-size:.82rem;
    line-height:1.35;
  }
}

@media(max-width:850px){
  .section-head{grid-template-columns:1fr;gap:28px}
  .project-rail{grid-auto-columns:minmax(245px,72vw)}
  .external-rail{grid-auto-columns:minmax(320px,72vw)}
  .external-card{min-height:64vw}
  .contact-body{grid-template-columns:1fr}.contact-links{border-left:0;border-top:1px solid var(--line)}
  .laurels{height:100px}.laurels-group{gap:48px;padding-right:48px}.laurels-group img{height:64px;max-width:215px}
}
@media(max-width:560px){
  .site-header{padding-left:15px;padding-right:15px}
  .hero{min-height:620px}.hero-meta,.hero-copy{left:15px;right:15px}.hero-meta{top:70px}.hero-meta{justify-content:flex-end}
  .hero-title .title-main{font-size:clamp(4rem,22vw,6.3rem)}.hero-title .title-sub{font-size:clamp(.96rem,4.2vw,1.12rem);margin-top:10px}.hero-foot{flex-direction:column;gap:7px;font-size:.51rem}
  .laurels{height:86px}.laurels-group{gap:36px;padding-right:36px}.laurels-group img{height:54px;max-width:185px}
  .section{padding:54px 15px 66px}.project-rail{grid-auto-columns:78vw;gap:10px}.rail-button{display:none}
  .external-rail{grid-auto-columns:84vw}
  .external-card{min-height:78vw}
  .contact-statement{padding:58px 15px 48px}.contact-form{padding:34px 15px 44px}.form-row{grid-template-columns:1fr}.contact-links a{padding-left:15px;padding-right:15px}.contact-links small{max-width:150px}
  footer{padding-left:15px;padding-right:15px}
}
@media(prefers-reduced-motion:reduce){.laurels-track{animation:none}.project-card img,.external-image{transition:none}}


/* Readability pass: larger, easier-to-glance supporting type */
body{
  font-size:16px;
}

.hero-meta{
  font-size:.86rem;
  line-height:1.35;
}
.hero-copy>p{
  font-size:.84rem;
  line-height:1.25;
}
.hero-foot{
  font-size:.88rem;
  line-height:1.45;
}
.hero-capabilities{
  gap:8px;
}
.hero-capabilities span{
  font-size:.92rem;
  line-height:1.35;
}
.hero-foot>span{
  font-size:.9rem;
}

.section-index{
  font-size:.82rem;
  line-height:1.2;
}
.section-side p{
  font-size:1rem;
  line-height:1.55;
}
.section-side a{
  font-size:.82rem;
  line-height:1.2;
}
.project-card strong{
  font-size:1.12rem;
  line-height:1.12;
}
.project-card small{
  font-size:.82rem;
  line-height:1.42;
}
.external-copy>span,
.external-copy small{
  font-size:.78rem;
  line-height:1.3;
}
.external-copy p{
  font-size:.88rem;
  line-height:1.45;
}
.contact-form label>span{
  font-size:.8rem;
}
.form-note{
  font-size:.76rem;
  line-height:1.45;
}
.contact-form button{
  font-size:.82rem;
}
.contact-links small{
  font-size:.8rem;
  line-height:1.35;
}
footer{
  font-size:.74rem;
  line-height:1.35;
}

/* Desktop + tablet: keep supporting type comfortably readable */
@media(min-width:700px){
  .hero-meta{
    font-size:1rem;
  }
  .hero-copy>p{
    font-size:.96rem;
  }
  .hero-foot{
    font-size:1rem;
  }
  .hero-capabilities span{
    font-size:1.05rem;
  }
  .hero-foot>span{
    font-size:1rem;
  }

  .section-index{
    font-size:.95rem;
  }
  .section-side p{
    font-size:1.12rem;
  }
  .section-side a{
    font-size:.92rem;
  }

  .project-card strong{
    font-size:1.32rem;
  }
  .project-card small{
    font-size:.96rem;
  }

  .external-copy>span,
  .external-copy small{
    font-size:.9rem;
  }
  .external-copy p{
    font-size:1rem;
  }

  .contact-form label>span{
    font-size:.9rem;
  }
  .form-note{
    font-size:.84rem;
  }
  .contact-form button{
    font-size:.9rem;
  }
  .contact-links small{
    font-size:.9rem;
  }
  footer{
    font-size:.82rem;
  }
}

/* Phones: still readable, but not bloated */
@media(max-width:560px){
  .hero-meta{
    font-size:.76rem;
  }
  .hero-copy>p{
    font-size:.78rem;
  }
  .hero-capabilities span{
    font-size:.86rem;
  }
  .hero-foot>span{
    font-size:.82rem;
  }

  .section-index{
    font-size:.76rem;
  }
  .section-side p{
    font-size:.95rem;
  }
  .section-side a{
    font-size:.78rem;
  }

  .project-card strong{
    font-size:1.08rem;
  }
  .project-card small{
    font-size:.8rem;
  }

  .external-copy>span,
  .external-copy small{
    font-size:.74rem;
  }
  .external-copy p{
    font-size:.84rem;
  }

  .contact-form label>span{
    font-size:.76rem;
  }
  .form-note{
    font-size:.72rem;
  }
  .contact-links small{
    font-size:.76rem;
  }
  footer{
    font-size:.7rem;
  }
}


/* Hero dark-mode hardening */
html,
body,
.hero,
.hero-video,
.hero-poster{
  background-color:#000;
}
.hero-video iframe{
  background:#000 !important;
  color-scheme:dark;
}


/* Give the specialties strip breathing room on wider screens only */
@media(min-width:761px){
  .capabilities-kicker{
    padding-top:34px;
    padding-bottom:13px;
  }
}


/* Anchor Additional Credits supporting copy to the right edge */
@media(min-width:851px){
  .credits-section .section-side{
    justify-self:end;
    text-align:right;
    max-width:390px;
  }
  .credits-section .section-side p{
    margin-left:auto;
  }
}


/* Final header lockup */
@media(min-width:700px){
  .brand strong{font-size:1.18rem}
  .brand span{font-size:.62rem}
  .header-links{font-size:.98rem}
}
@media(max-width:699px){
  .brand strong{font-size:1rem}
  .brand span{font-size:.52rem}
  .header-links{font-size:.82rem}
}


.laurels-track,
.laurels-group{
  background:transparent !important;
}




/* Refined hero typography: darker tone, softer shadow, subtle filmic texture */
.site-header,
.hero-meta,
.hero-copy{
  color:#cbc4b8;
  text-shadow:
    0 1px 1px rgba(0,0,0,.34),
    0 5px 18px rgba(0,0,0,.14);
}

.hero-title,
.brand strong,
.brand span{
  text-shadow:
    0 1px 1px rgba(0,0,0,.30),
    0 6px 20px rgba(0,0,0,.12);
}

.hero-title .title-main,
.hero-title .title-sub,
.brand strong,
.brand span{
  background-image:
    linear-gradient(180deg, #d1cabd 0%, #c3bbad 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E");
  background-size:100% 100%, 140px 140px;
  background-repeat:no-repeat, repeat;
  background-blend-mode:normal, multiply;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.hero-copy>p,
.hero-foot,
.hero-meta,
.header-links{
  color:#c7c0b4;
}

.hero-film-link{
  border-bottom-color:rgba(199,192,180,.46);
}

.hero-film-link:hover,
.header-links a:hover{
  opacity:.78;
}


/* V26 — restore original bright hero font treatment, remove clutter, and size STUDIOS correctly */
.hero-copy > p{display:none !important;}

.hero-title{
  display:inline-flex;
  flex-direction:column;
  align-items:flex-start;
  width:max-content;
  max-width:100%;
  text-transform:uppercase;
  filter:none !important;
}
.hero-title .title-main,
.hero-title .title-sub{
  background:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  color:#ebe6de !important;
  opacity:1 !important;
  text-shadow:
    0 4px 20px rgba(0,0,0,.16),
    0 1px 0 rgba(255,255,255,.04),
    0 0 34px rgba(0,0,0,.06) !important;
}
.hero-title .title-main{
  display:block;
  font-size:clamp(5rem, 14vw, 13rem);
  line-height:.72;
  letter-spacing:-.075em;
  font-weight:800;
}
.hero-title .title-sub{
  display:block;
  margin-top:10px;
  width:100%;
  text-align:center;
  font-size:clamp(2rem, 5.55vw, 5.3rem);
  line-height:.88;
  letter-spacing:.085em;
  padding-left:.085em;
  font-weight:400;
}

/* Keep top-left logo unchanged except slight refinement */
.brand{align-items:flex-start}
.brand strong,.brand span{
  background:none !important;
  color:#f0ebe3 !important;
  text-shadow:
    0 2px 10px rgba(0,0,0,.18),
    0 0 18px rgba(0,0,0,.06) !important;
}
.brand span{margin-left:-.03em}

/* slightly soften ancillary text but keep clean */
.hero-meta,
.hero-foot,
.hero-film-link,
.site-header,
.header-links{
  text-shadow:0 2px 12px rgba(0,0,0,.16), 0 0 22px rgba(0,0,0,.05);
}

@media(max-width: 900px){
  .hero-title .title-sub{
    font-size:clamp(1.6rem, 8vw, 3.4rem);
    margin-top:8px;
  }
}
@media(max-width:560px){
  .hero-title .title-main{font-size:clamp(4.2rem, 21vw, 6.4rem)}
  .hero-title .title-sub{font-size:clamp(1.46rem, 7vw, 2.1rem); letter-spacing:.09em; padding-left:.09em}
}


/* V28 — stable hero video + exact ATHY/STUDIOS proportional lockup */

/* Keep the mobile/tablet viewport from changing the hero crop as browser chrome moves. */
.hero{
  height:100svh !important;
  min-height:620px;
  overflow:hidden;
  overflow-anchor:none;
}
.hero-video{
  position:absolute;
  inset:0;
  overflow:hidden;
  background:#000;
  overflow-anchor:none;
}
.hero-video iframe{
  position:absolute;
  left:50%;
  top:50%;
  width:max(100vw, 177.778svh) !important;
  height:max(100svh, 56.25vw) !important;
  min-width:0 !important;
  min-height:0 !important;
  transform:translate3d(-50%,-50%,0) !important;
  border:0;
  pointer-events:none;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  overflow-anchor:none;
}

/* Mini top-left lockup: restore visual centering beneath ATHY. */
.brand{
  align-items:center !important;
}
.brand span{
  width:100% !important;
  text-align:center !important;
  margin-left:0 !important;
  transform:translateX(0) !important;
  padding-left:.10em !important;
  letter-spacing:.16em !important;
}

/* Main lockup: preserve the original bright feel and make STUDIOS exactly span ATHY. */
.hero-title{
  display:inline-flex !important;
  flex-direction:column;
  align-items:stretch !important;
  width:max-content;
  max-width:100%;
  text-transform:uppercase;
  filter:none !important;
}
.hero-title .title-main,
.hero-title .title-sub,
.hero-title .title-sub > span{
  background:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  color:#eee9e1 !important;
  filter:none !important;
}
.hero-title .title-main{
  display:block;
  font-size:clamp(5rem,14vw,13rem) !important;
  line-height:.72 !important;
  letter-spacing:-.075em !important;
  font-weight:800 !important;
  text-shadow:
    0 8px 26px rgba(0,0,0,.15),
    0 2px 8px rgba(0,0,0,.08) !important;
}
.hero-title .title-sub{
  display:flex !important;
  width:100% !important;
  align-items:center;
  justify-content:space-between;
  margin-top:8px !important;
  padding:0 .02em 0 .015em !important;
  font-family:var(--sans) !important;
  font-size:clamp(2.15rem,4.6vw,4.6rem) !important;
  line-height:.9 !important;
  letter-spacing:0 !important;
  font-weight:300 !important;
  text-shadow:none !important;
}
.hero-title .title-sub > span{
  display:block;
  line-height:.9;
  text-shadow:
    0 8px 26px rgba(0,0,0,.15),
    0 2px 8px rgba(0,0,0,.08) !important;
}

/* Clean, soft ancillary text shadow only. */
.hero-meta,
.hero-foot,
.hero-film-link,
.site-header,
.header-links{
  text-shadow:
    0 6px 20px rgba(0,0,0,.13),
    0 2px 7px rgba(0,0,0,.07) !important;
}

@media(max-width:900px){
  .hero-title .title-sub{
    font-size:clamp(1.9rem,7.2vw,3.25rem) !important;
    margin-top:7px !important;
  }
}
@media(max-width:560px){
  .hero-title .title-main{
    font-size:clamp(4.2rem,21vw,6.5rem) !important;
  }
  .hero-title .title-sub{
    font-size:clamp(1.75rem,7vw,2.65rem) !important;
    margin-top:6px !important;
    padding-left:.01em !important;
    padding-right:.01em !important;
  }
}


/* V29 — stronger readable hero shadows + cream inquiry form */

/* Apply one soft diffused shadow language to every piece of text over the moving hero. */
.site-header,
.site-header .brand,
.site-header .brand strong,
.site-header .brand span,
.header-links,
.header-links a,
.hero-meta,
.hero-meta a,
.hero-film-link,
.hero-copy,
.hero-title,
.hero-title .title-main,
.hero-title .title-sub,
.hero-title .title-sub > span,
.hero-foot,
.hero-foot span,
.hero-capabilities,
.hero-capabilities span{
  text-shadow:
    0 3px 10px rgba(0,0,0,.34),
    0 8px 28px rgba(0,0,0,.22),
    0 0 36px rgba(0,0,0,.14) !important;
}

/* Keep the bright warm hero typography intact. */
.site-header,
.hero-meta,
.hero-film-link,
.hero-foot,
.hero-capabilities{
  color:#eee9e1;
}

/* Cream inquiry area: clearly distinguishes the editable/contact region. */
.contact-form{
  background:var(--paper);
  color:var(--ink);
}

.contact-form label>span{
  color:#5f5a52;
}

.contact-form input,
.contact-form textarea{
  color:var(--ink);
  border-bottom-color:rgba(24,23,20,.38);
  caret-color:var(--ink);
}

.contact-form input::placeholder,
.contact-form textarea::placeholder{
  color:rgba(24,23,20,.55);
  opacity:1;
}

.contact-form input:focus,
.contact-form textarea:focus{
  border-bottom-color:var(--ink);
}

.contact-form button{
  color:var(--ink);
  border-bottom-color:var(--ink);
}

.contact-form .form-note,
.form-note{
  color:#6d675e;
}

/* Preserve the black social-links side of Contact on desktop. */
.contact-links{
  background:var(--bg);
}

/* Give the form a little more optical separation without turning it into a card. */
@media(min-width:851px){
  .contact-form{
    border-right:1px solid rgba(24,23,20,.16);
  }
}

@media(max-width:850px){
  .contact-form{
    border-bottom:1px solid rgba(24,23,20,.18);
  }
}


/* V33 — Brave/iOS-safe external-card stacking */
.external-card{
  isolation:isolate;
}
.external-image,
.external-image-img{
  z-index:0 !important;
}
.external-shade{
  z-index:1 !important;
  pointer-events:none;
}
.external-copy{
  z-index:2 !important;
}
.external-image-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  background:#10100f;
  -webkit-transform:translateZ(0);
  transform:translateZ(0);
}
.external-card:hover .external-image-img{
  transform:scale(1.035) translateZ(0);
  filter:saturate(.9) brightness(.9);
}

/* Peach inquiry form, based on the supplied reference but slightly deeper. */
.contact-form{
  background:#efb99f !important;
  color:#1c1714 !important;
}
.contact-form label>span{
  color:#55433a !important;
}
.contact-form input,
.contact-form textarea{
  color:#1c1714 !important;
  border-bottom-color:rgba(28,23,20,.42) !important;
  caret-color:#1c1714 !important;
}
.contact-form input::placeholder,
.contact-form textarea::placeholder{
  color:rgba(28,23,20,.56) !important;
}
.contact-form input:focus,
.contact-form textarea:focus{
  border-bottom-color:#1c1714 !important;
}
.contact-form button{
  color:#1c1714 !important;
  border-bottom-color:#1c1714 !important;
}
.contact-form .form-note,
.form-note{
  color:#675047 !important;
}


/* V34 — interactive weighted laurels */
.laurels{
  cursor:grab;
  touch-action:pan-y;
  user-select:none;
  -webkit-user-select:none;
  -webkit-tap-highlight-color:transparent;
}
.laurels.is-dragging{
  cursor:grabbing;
}
.laurels-track{
  animation:none !important;
  transform:translate3d(0,0,0);
  will-change:transform;
}
.laurels-group img{
  pointer-events:none;
  -webkit-user-drag:none;
}
@media(prefers-reduced-motion:reduce){
  .laurels{cursor:default}
}


/* V35 — velocity-driven laurel motion blur */
.laurels-track{
  filter:none;
  transform-origin:center center;
}
@media(prefers-reduced-motion:reduce){
  .laurels-track{filter:none !important}
}


/* V37 — mobile cinematic fit pass
   Phone-only hero scroll reveal + smaller, more breathable project rails. */
.hero-scroll-shell{position:relative;}

@media(max-width:699px){
  /* Give the opening image room to transform before the page continues. */
  .hero-scroll-shell{
    height:148svh;
    background:#000;
  }
  .hero-scroll-shell .hero{
    position:sticky !important;
    top:0;
    height:100svh !important;
    min-height:0 !important;
    overflow:hidden;
    border-bottom:0;
    background:#000;
  }

  /* The film is 4:3. Start heavily cropped, then JS eases --hero-zoom to 1. */
  .hero-video{background:#000;}
  .hero-video iframe{
    width:100vw !important;
    height:75vw !important;
    min-width:0 !important;
    min-height:0 !important;
    left:50% !important;
    top:50% !important;
    transform:translate3d(-50%,-50%,0) scale(var(--hero-zoom,2.9)) !important;
    transform-origin:center center !important;
    will-change:transform;
  }

  /* Keep the lockup premium, but stop it from feeling oversized on a phone. */
  .hero-copy{left:18px !important;right:18px !important;bottom:22px !important;}
  .hero-meta{left:18px !important;right:18px !important;top:78px !important;}
  .hero-title .title-main{font-size:clamp(4rem,18.5vw,5.55rem) !important;}
  .hero-title .title-sub{font-size:clamp(1.5rem,6.1vw,2.15rem) !important;}
  .hero-foot{margin-top:24px !important;gap:8px !important;}
  .hero-capabilities span,.hero-foot>span{font-size:.49rem !important;line-height:1.45 !important;}

  /* The laurels become the clean hand-off from the hero to the portfolio. */
  .laurels{height:104px;}
  .laurels-group{gap:50px;padding-right:50px;}
  .laurels-group img{height:64px;max-width:205px;}

  /* More comfortable mobile rhythm. */
  .section{padding:50px 18px 62px !important;}
  .section-head{gap:22px !important;margin-bottom:30px !important;}
  .section-index{margin-bottom:14px !important;}
  .section h2,.contact-section h2{
    font-size:clamp(2.65rem,13vw,3.8rem) !important;
    line-height:.91 !important;
    letter-spacing:-.055em !important;
  }
  .section-side p{font-size:.78rem !important;line-height:1.52 !important;max-width:31rem;}

  /* Selected Work: cards sized so roughly one and a half fit across a phone screen. */
  .project-rail{
    grid-auto-columns:70vw !important;
    gap:12px !important;
    padding:0 10vw 12px 0 !important;
    scroll-padding-left:0;
  }
  .project-card img{aspect-ratio:16/9;}
  .project-card strong{font-size:.91rem !important;line-height:1.08 !important;margin-top:10px !important;}
  .project-card small{font-size:.54rem !important;margin-top:5px !important;}

  /* Additional Credits: less zoomed-in, proper 4:3 card proportions. */
  .external-rail{
    grid-auto-columns:76vw !important;
    gap:10px !important;
    border:0 !important;
    background:transparent !important;
    padding-right:12vw;
  }
  .external-card{
    min-height:0 !important;
    aspect-ratio:4/3;
    border:1px solid var(--line-strong);
  }
  .external-copy{left:16px !important;right:16px !important;bottom:16px !important;}
  .external-copy strong{font-size:clamp(1.35rem,6vw,1.8rem) !important;margin:8px 0 9px !important;}
  .external-copy p{font-size:.58rem !important;margin-bottom:15px !important;}
  .external-copy>span,.external-copy small{font-size:.49rem !important;}

  .capabilities-strip{padding-left:18px !important;padding-right:18px !important;}
  .contact-statement{padding-left:18px !important;padding-right:18px !important;}
  .contact-form{padding-left:18px !important;padding-right:18px !important;}
}

@media(max-width:380px){
  .project-rail .auto-rail-group{grid-auto-columns:58vw !important;}
  .external-rail{grid-auto-columns:80vw !important;}
  .hero-title .title-main{font-size:18vw !important;}
}

/* V39 — compact inline hero sound controls and iOS-safe credit rail sizing. */
.hero-meta{
  justify-content:flex-start !important;
  border-top:0 !important;
  padding-top:0 !important;
}
.hero-project-block{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.hero-project-block .hero-film-link{border:0;padding:0;font-size:.68rem;letter-spacing:.12em}
.hero-audio-row{display:flex;align-items:center;gap:8px;color:#fff}
.audio-control{
  position:static;
  display:grid;
  place-items:center;
  flex:none;
  width:20px;
  height:22px;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:#fff;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.audio-control:hover{background:transparent;color:#fff;transform:none;opacity:.76}
.audio-control:focus-visible{outline:2px solid #fff;outline-offset:3px}
.audio-control:disabled{opacity:.6;cursor:default}
.audio-icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.audio-wave{display:none}
.audio-control.is-on .audio-wave{display:block}
.audio-cross{display:block}
.audio-control.is-on .audio-cross{display:none}
.audio-volume{
  appearance:none;
  -webkit-appearance:none;
  display:block;
  width:94px;
  height:20px;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  cursor:ew-resize;
  touch-action:pan-y;
}
.audio-volume:focus-visible{outline:1px solid rgba(255,255,255,.8);outline-offset:4px}
.audio-volume::-webkit-slider-runnable-track{height:1px;background:rgba(255,255,255,.9)}
.audio-volume::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:8px;
  height:8px;
  margin-top:-3.5px;
  border:0;
  border-radius:50%;
  background:#fff;
}
.audio-volume::-moz-range-track{height:1px;background:rgba(255,255,255,.9)}
.audio-volume::-moz-range-progress{height:1px;background:#fff}
.audio-volume::-moz-range-thumb{width:8px;height:8px;border:0;border-radius:50%;background:#fff}

.project-rail.is-auto-rail,.external-rail.is-auto-rail{
  display:block;
  overflow:hidden;
  touch-action:pan-y;
  user-select:none;
  -webkit-user-select:none;
  -webkit-tap-highlight-color:transparent;
  cursor:grab;
  scroll-snap-type:none;
}
.project-rail.is-auto-rail.is-dragging,.external-rail.is-auto-rail.is-dragging{cursor:grabbing}
.auto-rail-track{display:flex;width:max-content;will-change:transform}
.auto-rail-group{display:grid;flex:none;grid-auto-flow:column;align-items:stretch}
.project-rail.is-auto-rail .auto-rail-group{
  grid-auto-columns:minmax(250px,30vw);
  gap:12px;
  padding-right:12px;
}
.external-rail.is-auto-rail .auto-rail-group{
  grid-auto-columns:minmax(330px,33.333vw);
  gap:1px;
  padding-right:1px;
}
.external-rail{height:clamp(360px,38vw,560px)}
.external-rail .auto-rail-track,
.external-rail .auto-rail-group,
.external-rail .external-card{height:100%}
.auto-rail-copy{pointer-events:auto}
.project-rail.is-auto-rail .project-card,.external-rail.is-auto-rail .external-card{min-width:0}
.project-rail.is-auto-rail .project-card img,.external-rail.is-auto-rail .external-card img{-webkit-user-drag:none}



@media(max-width:850px){
  .project-rail.is-auto-rail .auto-rail-group{grid-auto-columns:minmax(245px,72vw)}
  .external-rail.is-auto-rail .auto-rail-group{grid-auto-columns:minmax(320px,72vw)}
  .external-rail{height:64vw}
}
@media(max-width:560px){
  .project-rail.is-auto-rail .auto-rail-group{grid-auto-columns:58vw;gap:12px;padding-right:12px}
  .external-rail.is-auto-rail .auto-rail-group{grid-auto-columns:76vw;gap:10px;padding-right:10px}
  .external-rail{height:57vw}
  .rail-button{display:none}
}
@media(max-width:380px){
  .project-rail.is-auto-rail .auto-rail-group{grid-auto-columns:58vw}
  .external-rail.is-auto-rail .auto-rail-group{grid-auto-columns:80vw}
  .external-rail{height:60vw}
}
@media(prefers-reduced-motion:reduce){
  .project-rail.is-auto-rail,.external-rail.is-auto-rail{cursor:auto}
  .auto-rail-track{will-change:auto}
}


/* V42 — bounded inline video cards and independent gentle motion. */
.project-rail.is-auto-rail .auto-rail-group{grid-auto-columns:minmax(250px,30vw)}
.project-rail.is-auto-rail .project-card{display:block;min-width:0;overflow:hidden}
.project-media{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;background:#080808;isolation:isolate}
.project-media img{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;transition:filter .25s ease}
.project-card:hover .project-media img{transform:none;filter:brightness(.92)}
.project-media iframe{position:absolute;inset:0;display:block;width:100%;height:100%;border:0;background:#050505}
.project-media-close{position:absolute;z-index:2;top:8px;right:8px;display:grid;place-items:center;width:32px;height:32px;border:1px solid rgba(255,255,255,.55);border-radius:50%;background:rgba(0,0,0,.78);color:#fff;font-size:23px;line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent}
.project-media-close:focus-visible{outline:2px solid #fff;outline-offset:3px}
.auto-rail-copy{pointer-events:none}
@media(max-width:850px){.project-rail.is-auto-rail .auto-rail-group{grid-auto-columns:minmax(245px,40vw)}}
@media(max-width:600px){
 .project-rail.is-auto-rail .auto-rail-group{grid-auto-columns:64vw !important;gap:12px;padding-right:12px}
 .project-card strong{font-size:.91rem;line-height:1.08;margin-top:10px}
 .project-card small{font-size:.54rem;margin-top:5px}
 .project-media-close{top:6px;right:6px;width:30px;height:30px}
}
@media(max-width:380px){.project-rail.is-auto-rail .auto-rail-group{grid-auto-columns:66vw !important}}
@media(prefers-reduced-motion:reduce){.auto-rail-track{will-change:auto}.project-card img{transition:none}}



.project-media-launch{position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%;margin:0;padding:0;border:0;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}
.project-media-launch img{position:absolute;inset:0}
.project-media-launch:focus-visible{outline:2px solid #fff;outline-offset:-4px}
.project-media-launch[hidden]{display:none}


/* V42 — browse the live YouTube playlist as native selected-work title cards. */
.youtube-library{margin-top:42px;padding-top:0;border-top:0}
.youtube-library-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:26px}
.youtube-library-head .section-index{margin-bottom:12px}
.youtube-library-head h3{margin:0;font-size:clamp(2.35rem,4vw,4.2rem);line-height:.92;letter-spacing:-.055em;font-weight:500}
.youtube-library-head>a{flex:none;display:inline-block;padding-bottom:5px;border-bottom:1px solid var(--line-strong);font:500 .59rem/1 var(--sans);letter-spacing:.09em}

.youtube-rail .project-media-launch img{object-fit:cover}
.youtube-rail .project-card strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:2.15em}
.youtube-card-titleline{display:flex;align-items:flex-start;gap:8px;margin-top:10px}
.youtube-card-titleline strong{flex:1;min-width:0;margin:0 !important}
.youtube-view-count{flex:none;white-space:nowrap;margin-top:2px;color:var(--fg);font:650 .82rem/1.3 var(--sans);letter-spacing:0}
.rail-shell.is-playing .rail-button{display:grid;place-items:center}
@media(max-width:600px){.youtube-library{margin-top:32px;padding-top:0}.youtube-library-head{align-items:start;flex-direction:column;gap:14px;margin-bottom:20px}.youtube-library-head h3{font-size:clamp(2.2rem,10vw,3.4rem)}}


/* External-link arrows use a small monochrome vector, avoiding emoji glyph substitution on mobile browsers. */
.external-arrow-icon{display:inline-block;width:.72em;height:.72em;margin-left:.16em;vertical-align:-.04em;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* V48 — Keep section titles on one line, sized to portrait width and height. */
@media(max-width:850px){
  .work-section h2,.credits-section h2{
    width:max-content;
    max-width:100%;
    white-space:nowrap;
    font-size:clamp(1.3rem,min(7.5vw,4.1svh),2.15rem) !important;
    line-height:1 !important;
    letter-spacing:-.06em !important;
  }
  .contact-statement h2{
    font-size:clamp(1.1rem,min(6.4vw,3.5svh),1.8rem) !important;
    line-height:1 !important;
    letter-spacing:-.06em !important;
  }
}

/* V49 — Let each work heading fill its section without a vacant link column. */
.work-section>.section-head{grid-template-columns:minmax(0,1fr);gap:0}
.youtube-library-head{display:block}

/* V50 — Consistent inset section rules, modeled on the hero-foot divider. */
:root{--quiet-rule:rgba(242,238,230,.22)}
.hero{border-bottom:0!important}
.section{position:relative;border-bottom:0!important}
.section::after{content:"";position:absolute;z-index:1;left:clamp(18px,2.3vw,32px);right:clamp(18px,2.3vw,32px);bottom:0;height:1px;background:var(--quiet-rule);pointer-events:none}
.laurels{position:relative;border-bottom:0!important}
.laurels::before,.laurels::after{content:"";position:absolute;z-index:2;left:clamp(18px,2.3vw,32px);right:clamp(18px,2.3vw,32px);height:1px;background:var(--quiet-rule);pointer-events:none}
.laurels::before{top:0}.laurels::after{bottom:0}
.capabilities-strip{position:relative;border-top:0!important;border-bottom:0!important}
.capabilities-strip::before,.capabilities-strip::after{content:"";position:absolute;z-index:2;left:clamp(18px,2.3vw,32px);right:clamp(18px,2.3vw,32px);height:1px;background:var(--quiet-rule);pointer-events:none}
.capabilities-strip::before{top:0}.capabilities-strip::after{bottom:0}
.capabilities-kicker{position:relative;border-bottom:0!important}
.capabilities-kicker::after{content:"";position:absolute;left:24px;right:24px;bottom:0;height:1px;background:var(--quiet-rule)}
.capabilities-list article{position:relative;overflow:hidden;isolation:isolate;border-right:1px solid rgba(242,238,230,.12)!important;border-bottom:0!important;min-height:clamp(190px,18vw,240px)}
.capabilities-list article:last-child{border-right:0!important}
.capabilities-list article:not(:last-child)::after{content:"";position:absolute;z-index:-1;left:24px;right:24px;bottom:0;height:1px;background:var(--quiet-rule)}
.capabilities-list h3,.capabilities-list p{position:relative}
.contact-section{position:relative;border-bottom:0!important}
.contact-statement{position:relative;border-bottom:0!important}
.contact-statement::after{content:"";position:absolute;left:clamp(18px,2.3vw,32px);right:clamp(18px,2.3vw,32px);bottom:0;height:1px;background:var(--quiet-rule)}
.contact-links{position:relative;border-left-color:rgba(242,238,230,.12)!important}
.contact-links a{position:relative;border-bottom:0!important}
.contact-links a:not(:last-child)::after{content:"";position:absolute;left:22px;right:22px;bottom:0;height:1px;background:var(--quiet-rule)}
@media(min-width:761px){.capabilities-list article:not(:last-child)::after{display:none}}
@media(max-width:760px){
  .capabilities-list article{min-height:176px;border-right:0!important}
  .capabilities-list article:not(:last-child)::after{left:15px;right:15px}
  .capabilities-kicker::after{left:15px;right:15px}
  .contact-links{border-top:0!important}
  .contact-links::before{content:"";position:absolute;left:18px;right:18px;top:0;height:1px;background:var(--quiet-rule)}
  .contact-links a:not(:last-child)::after{left:18px;right:18px}
}

/* V51 — Cinematography becomes a continuous, subdued stills rail. */
.capabilities-list article.capability-cinematography{background:#080807!important}
.capabilities-list article.capability-editorial{background:#080807!important}
.capabilities-list article.capability-color{background:linear-gradient(90deg,rgba(7,7,6,.56),rgba(7,7,6,.28)),url("media-r61/capabilities/color-finishing-suite.webp") center 72%/cover no-repeat!important}
.capabilities-list article.capability-cinematography h3,.capabilities-list article.capability-cinematography p,.capabilities-list article.capability-editorial h3,.capabilities-list article.capability-editorial p,.capabilities-list article.capability-color h3,.capabilities-list article.capability-color p{z-index:1}
.cinematography-carousel{position:absolute;z-index:0;inset:0;overflow:hidden;pointer-events:none}
.cinematography-carousel::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,7,6,.58),rgba(7,7,6,.34) 48%,rgba(7,7,6,.56));}
.cinematography-track{display:flex;width:max-content;height:100%;animation:cinematography-drift 170s linear infinite;will-change:transform}
.cinematography-group{display:flex;flex:none;height:100%;gap:0}
.cinematography-frame{position:relative;flex:none;width:clamp(360px,38vw,620px);height:100%;overflow:hidden}
.cinematography-frame img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.18);filter:brightness(.72) saturate(.88)}
@keyframes cinematography-drift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media(max-width:760px){
  .capabilities-list article.capability-cinematography{min-height:176px}
  .cinematography-frame{width:78vw}
  .cinematography-track{animation-duration:135s}
  .capabilities-list article.capability-color{background-position:center 72%;}
}
@media(prefers-reduced-motion:reduce){.cinematography-track{animation:none;transform:none}}

@media(min-width:761px) and (max-width:900px){
  .capabilities-list{grid-template-columns:1fr}
  .capabilities-list article{min-height:200px;border-right:0!important}
  .capabilities-list article:not(:last-child)::after{display:block;left:24px;right:24px}
}
.capabilities-list article:not(:last-child)::after{z-index:2}

/* V52 — trim baked-in black mattes and restore direct, inertial rail dragging. */
.cinematography-carousel{pointer-events:auto;touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;cursor:grab;outline:none}
.cinematography-carousel:focus-visible{outline:1px solid rgba(242,238,230,.55);outline-offset:2px}
.cinematography-carousel.is-dragging{cursor:grabbing}
.cinematography-track{display:flex;width:max-content;height:100%;animation:none!important;will-change:transform}
.cinematography-group{display:flex;flex:none;align-items:stretch;height:100%;gap:0}
.cinematography-frame{position:relative;flex:0 0 auto;width:auto;height:100%;overflow:hidden}
.cinematography-frame img{display:block;width:auto;height:100%;max-width:none;object-fit:contain;transform:none;filter:brightness(.76) saturate(.9);-webkit-user-drag:none;user-select:none}
.capabilities-list article.capability-cinematography h3,.capabilities-list article.capability-cinematography p{pointer-events:none}
@media(max-width:760px){.cinematography-track{animation:none!important}}

/* V53 — every still fills a fixed, cropped viewport so no matte or dark slit can appear between mobile frames. */
.cinematography-track{display:flex;width:max-content;height:100%;gap:0;animation:none!important}
.cinematography-group{display:flex;flex:none;align-items:stretch;height:100%;width:max-content;gap:0;margin:0;padding:0}
.cinematography-frame{display:block;position:relative;flex:0 0 clamp(320px,38vw,620px);width:clamp(320px,38vw,620px);height:100%;overflow:hidden;border:0;margin:0;padding:0;background:transparent}
.cinematography-frame img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;transform:scale(1.1);transform-origin:center;filter:brightness(.76) saturate(.9);border:0;margin:0;padding:0;-webkit-user-drag:none;user-select:none}
@media(max-width:760px){
  .cinematography-frame{flex-basis:78vw;width:78vw}
  .cinematography-frame img{transform:scale(1.12)}
}


/* V54 — smaller standard 16:9 YouTube thumbnails on desktop and tablet. */
.youtube-rail.is-auto-rail .auto-rail-group{grid-auto-columns:clamp(230px,19vw,330px);gap:12px;padding-right:12px}
.youtube-rail .project-media{aspect-ratio:16/9}
.youtube-rail .project-media-launch img{object-fit:cover}
.youtube-rail .youtube-card>img{aspect-ratio:16/9;object-fit:cover}
@media (min-width:761px) and (max-width:1100px){.youtube-rail.is-auto-rail .auto-rail-group{grid-auto-columns:clamp(210px,23vw,280px)}}
@media (max-width:760px){.youtube-rail.is-auto-rail .auto-rail-group{grid-auto-columns:64vw}}

/* V59 — compact the YouTube rail on phones and keep shared Vimeo rail sizing unchanged. */
@media (max-width:600px){
  .youtube-library{margin-top:22px!important}
  .youtube-library-head{margin:0 0 14px!important}
  .youtube-library-head h3{font-size:clamp(1.25rem,5vw,1.65rem)!important;line-height:1!important}
  .youtube-rail.is-auto-rail .auto-rail-group{grid-auto-columns:clamp(145px,38vw,180px)!important;gap:9px!important;padding-right:9px!important}
  .youtube-card-titleline{gap:5px;margin-top:7px}
  .youtube-card-titleline strong{font-size:12.5px;line-height:1.2}
  .youtube-view-count{font-size:11.5px;line-height:1.2}
  .youtube-card>small{font-size:10.5px}
}
/* V60 — keep availability, copyright, and development in stable footer columns. */
.site-footer{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:start;
  gap:16px;
  padding:22px clamp(15px,2vw,24px) calc(26px + env(safe-area-inset-bottom,0px));
  font-size:clamp(11px,.82vw,13px);
  line-height:1.4;
  letter-spacing:.055em;
}
.site-footer>span{min-width:0;white-space:nowrap}
.footer-availability{text-align:left}
.footer-copyright{text-align:center}
.footer-development{text-align:right}
@media(max-width:600px){
  .site-footer{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;font-size:clamp(10px,2.8vw,12px);line-height:1.5;letter-spacing:0}
  .site-footer>span{white-space:normal}
  .site-footer>span>span{display:block;white-space:nowrap}
}
/* V61: reveal the hero only after the player renders; keep the poster usable on failure. */
.hero-video{background:transparent}
.hero-video iframe{opacity:0;transition:opacity .3s ease}
.hero.has-playing-video .hero-video iframe{opacity:1}
.hero-audio-row{visibility:hidden}
.hero.has-playing-video .hero-audio-row{visibility:visible}
.auto-rail-copy{pointer-events:auto}
.project-media-close{width:44px;height:44px}
.contact-statement h2.contact-headline{
  font-size:var(--contact-fit,clamp(26px,5vw,80px))!important;
  line-height:1.14!important;letter-spacing:-.045em!important;font-weight:500;
}
.contact-headline .contact-line{display:flex;align-items:baseline;gap:.16em;white-space:nowrap;width:max-content;max-width:100%;}
.contact-headline .contact-line>span{flex:none}
.contact-headline .contact-word-medium{font-size:.64em;letter-spacing:-.035em}
.contact-headline .contact-word-small{font-size:.42em;letter-spacing:0}
.attention-text{opacity:.72;transition:opacity .9s cubic-bezier(.2,.65,.25,1)}
.attention-detail{opacity:.88}
.attention-text.is-in-focus{opacity:.94}
.attention-detail.is-in-focus{opacity:.97}
@media(hover:hover){
  .attention-text:hover,.section:hover>.section-head .attention-text,.capabilities-list article:hover .attention-text{opacity:.97}
}
.attention-text:focus-within{opacity:.97}
@media(prefers-reduced-motion:reduce){.hero-video iframe{transition:none}}
@media(prefers-reduced-motion:reduce){.attention-text{transition:none;opacity:.94}.attention-detail{opacity:.97}}

/* V62: uniform capitals, stronger title weight, and proportional company suffix. */
.work-section h2,.youtube-library-head h3,.credits-section h2,.capabilities-list h3{
  text-transform:uppercase;font-variant-caps:normal;font-weight:700!important;white-space:nowrap;
}
.contact-statement h2.contact-headline{font-weight:700!important;font-variant-caps:normal;text-transform:uppercase}
.project-card strong,.external-copy strong{font-weight:700!important}
.section-head>div{min-width:0}
.footer-company{display:inline;font-size:.5em;font-weight:500;letter-spacing:.025em;white-space:nowrap}
@media(max-width:600px){.footer-copyright{font-size:clamp(9px,2.55vw,11px)}}

/* V63: the phone poster shares the video aperture; exposed space remains black. */
.hero,.hero-scroll-shell{background-color:#000}
@media(max-width:699px){
  .hero-poster{
    inset:auto!important;left:50%!important;top:50%!important;width:100vw;height:75vw;
    transform:translate3d(-50%,-50%,0) scale(var(--hero-zoom,2.9));
    transform-origin:center center;will-change:transform;
  }
}

/* V64: anchor specialty copy below faces and use localized shading for readability. */
.capabilities-list article{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start}
.capabilities-list h3,.capabilities-list p{flex:none;max-width:100%}
.capability-cinematography h3,.capability-cinematography p,
.capability-color h3,.capability-color p{text-shadow:0 1px 5px rgba(0,0,0,.5)}
.capability-cinematography p,.capability-color p{color:rgba(242,238,230,.92)}
.cinematography-frame img{filter:brightness(.98) saturate(.95)}
.cinematography-carousel::after{
  pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,.08) 35%,rgba(0,0,0,.72) 100%);
}
.capabilities-list article.capability-color{
  background:linear-gradient(180deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,.08) 35%,rgba(0,0,0,.72) 100%),url("media-r61/capabilities/color-finishing-suite.webp") center 72%/cover no-repeat!important;
}
@media(max-width:600px){
  .site-footer{font-size:clamp(9px,2.35vw,10px);line-height:1.45;gap:6px}
}

/* V65: one composited video surface and stable phone geometry. */
.hero-aperture{position:absolute;inset:0}
@keyframes hero-scroll-reveal{
  from{transform:translate3d(-50%,-50%,0) scale(var(--hero-cover,2.9))}
  to{transform:translate3d(-50%,-50%,0) scale(1)}
}
@media(max-width:699px){
  .hero-scroll-shell{height:calc(var(--hero-height,100svh) * 1.48)}
  .hero-scroll-shell .hero{height:var(--hero-height,100svh)!important;isolation:isolate}
  .hero-aperture{
    inset:auto;left:50%;top:50%;width:100vw;height:75vw;
    transform:translate3d(-50%,-50%,0) scale(var(--hero-cover,2.9));
    transform-origin:center;will-change:transform;
  }
  .hero .hero-aperture .hero-poster,
  .hero .hero-aperture .hero-video iframe{
    inset:0!important;left:0!important;top:0!important;width:100%!important;height:100%!important;
    transform:none!important;will-change:auto;min-width:0!important;min-height:0!important;
  }
  .hero-native-scroll .hero-aperture{
    animation:hero-scroll-reveal 1s cubic-bezier(.42,0,.58,1) both;
    animation-timeline:scroll(root block);
    animation-range:var(--hero-range-start,0px) var(--hero-range-end,400px);
  }
  /* Keep the fixed grain blend off the mobile scroll composition path. */
  .grain{display:none}
}
@media(max-width:699px) and (prefers-reduced-motion:reduce){
  .hero .hero-aperture{animation:none;transform:translate3d(-50%,-50%,0) scale(1)!important}
}

/* V66: consistent black canvas, soft media edges, and compact phone inquiry. */
:root{--bg:#000;--media-radius:12px}
html,body,main,.site-footer,.contact-links,.capabilities-strip{background-color:#000}
.grain{display:none}
.capabilities-list article.capability-editorial,
.capabilities-list article.capability-cinematography{background-color:#000!important}
.hero-aperture,.project-media,.external-card{
  border-radius:var(--media-radius);overflow:hidden;
}
.external-card{border:0!important}
.external-rail{border:0!important;background:transparent!important}
.external-rail.is-auto-rail .auto-rail-group{gap:10px;padding-right:10px}
.project-media{background:#000}
.project-media iframe{background:#000}
.project-media-launch{border-radius:inherit}
.project-card>img{border-radius:var(--media-radius)}
.capabilities-list article{border:0!important;border-radius:var(--media-radius)}
.capabilities-list article:not(:last-child)::after{display:none}
.rail-button,.project-media-close{
  border:0;
  background:linear-gradient(140deg,rgba(255,255,255,.08),rgba(0,0,0,.72));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 0 0 1px rgba(255,255,255,.1);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
.rail-button:focus-visible,.project-media-close:focus-visible{outline:2px solid var(--fg);outline-offset:3px}
.contact-form{margin:18px;border:0!important;border-radius:16px;overflow:hidden}
.contact-links a{border-radius:10px}
.contact-links{border-left:0!important}
.contact-form input,.contact-form textarea{border-radius:4px;-webkit-appearance:none;appearance:none;box-shadow:none}
.contact-form button{border-radius:8px}
@media(max-width:760px){
  :root{--media-radius:9px}
  .contact-body{min-height:0}
  .contact-form{padding:22px 18px 24px!important;gap:16px;margin:18px;border-radius:14px}
  .contact-form .form-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .contact-form label{gap:6px;min-width:0}
  .contact-form input{font-size:16px;line-height:1.25;min-height:44px;padding:10px 0}
  .contact-form textarea{font-size:16px;line-height:1.4;min-height:96px;height:96px;padding:10px 0}
  .contact-form button{margin-top:0;min-height:44px;display:flex;align-items:center;gap:6px;padding:0 0 2px}
}

/* V67: concise one-line phone specialty details, with more exposed image area. */
.capability-detail-phone{display:none}
@media(max-width:600px){
  .capabilities-list article,.capabilities-list article.capability-cinematography{min-height:160px}
  .capabilities-list h3{font-size:clamp(15px,4.3vw,18px);margin-bottom:6px}
  .capabilities-list p{font-size:clamp(12px,3.2vw,12.5px);line-height:1.4;letter-spacing:0;white-space:nowrap}
  .capability-detail-full{display:none}
  .capability-detail-phone{display:inline}
}

/* V68: text-only inquiry action and compact, quiet contact links. */
.capabilities-list article.capability-color{background:#000!important}
.capability-color-surface{position:absolute;inset:0;z-index:0;pointer-events:none}
.cinematography-carousel,.capability-color-surface{
  border-radius:var(--media-radius);overflow:hidden;
  clip-path:inset(0 round var(--media-radius));
}
.capability-color-surface img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 72%}
.capability-color-surface::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,.08) 35%,rgba(0,0,0,.72) 100%);
}
.contact-form button{
  border:0!important;background:transparent;box-shadow:none;outline:0;
  -webkit-appearance:none;appearance:none;border-radius:6px;
}
.contact-form button:focus-visible{outline:2px solid #1c1714;outline-offset:4px}
.contact-body{min-height:0;align-items:start}
.contact-links a{
  min-height:64px;padding:0 18px;gap:12px;border-radius:10px;
  transition:color .2s ease;
}
.contact-links span{font-size:clamp(16px,1.4vw,20px);line-height:1.2;letter-spacing:-.025em}
.contact-links small{font-size:clamp(10px,.8vw,12px);line-height:1.3}
.contact-links a:hover{background:#000;color:var(--fg);padding-left:18px}
.contact-links a:hover small{color:var(--fg)}
.contact-links a:focus-visible{outline:1px solid rgba(242,238,230,.65);outline-offset:-4px}
@media(max-width:760px){
  .contact-links a{min-height:56px}
  .contact-links span{font-size:clamp(15px,4vw,17px)}
  .contact-links small{font-size:10.5px}
}
@media(prefers-reduced-motion:reduce){.contact-links a{transition:none}}
