@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700&display=swap");

:root {
  color-scheme: dark;
  --bg: #000000;
  --ink: #f5f5f5;
  --muted: #a8a8a8;
  --logo-ink: #707070;
  --line: rgba(255, 255, 255, 0.12);
  --soft: rgba(255, 255, 255, 0.06);
  --header-height: 0px;
  --carousel-height: 0px;
  --page-pad-top: 0px;
  --page-pad-bottom: 0px;
}

html[data-theme="light"] {
  color-scheme: light;
  --bg: #f7f7f4;
  --ink: #0a0a0a;
  --muted: #3c3c3c;
  --logo-ink: #bdbdbd;
  --line: rgba(10, 10, 10, 0.18);
  --soft: rgba(10, 10, 10, 0.06);
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: "Manrope", sans-serif;
  background: var(--bg);
  color: var(--ink);
  line-height: 1.4;
  padding: 0 clamp(16px, 3vw, 40px) 0;
  min-height: 100vh;
  scroll-behavior: smooth;
}

main {
  padding-bottom: 64px;
}
.site-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding-top: 36px;
  margin-bottom: 48px;
}

.logo {
  font-size: 1.05rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--logo-ink);
}

.site-nav {
  display: flex;
  gap: 24px;
  font-size: 0.95rem;
}

.site-nav a {
  text-decoration: none;
  color: var(--muted);
  transition: color 0.2s ease;
}

.site-nav a:hover,
.site-nav a:focus {
  color: var(--ink);
}

.theme-toggle {
  background: transparent;
  color: var(--ink);
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 999px;
  outline: none;
  box-shadow: none;
  padding: 0;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: border 0.2s ease, background 0.2s ease;
  position: fixed;
  top: 24px;
  right: clamp(16px, 3vw, 40px);
  z-index: 6;
}

.theme-toggle:hover,
.theme-toggle:focus {
  background: transparent;
}

.theme-toggle svg {
  width: 18px;
  height: 18px;
}

.theme-toggle .icon-full {
  fill: currentColor;
}

.theme-toggle .icon-half {
  fill: var(--bg);
}

.hero {
  margin-bottom: 0;
  padding-bottom: 24px;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.hero-intro {
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: var(--muted);
  margin-bottom: 18px;
}

.hero h1 {
  font-size: clamp(1.6rem, 2.6vw, 2.4rem);
  font-weight: 500;
  line-height: 1.12;
}

.section-title {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  margin-bottom: 18px;
}

.section-title h2 {
  font-size: 1.5rem;
  font-weight: 600;
}

.section-title p {
  color: var(--muted);
  max-width: 420px;
}

.featured {
  margin-top: 0;
}

.carousel {
  display: grid;
  gap: 16px;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.carousel__viewport {
  overflow: hidden;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.carousel__track {
  display: flex;
  gap: 0;
  padding: 0;
  will-change: transform;
}

.carousel__track.is-loading {
  visibility: hidden;
}

.work-card {
  display: block;
  text-decoration: none;
  color: inherit;
  flex: 0 0 auto;
}

.work-card__media {
  margin: 0;
  position: relative;
}

.work-card__media img,
.work-card__media video {
  height: 425px;
  width: auto;
  max-width: none;
  display: block;
  object-fit: contain;
}

.work-card__media figcaption {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 4px;
  padding: 18px 20px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.78));
  opacity: 0;
  transition: opacity 0.2s ease;
}

.work-card__title {
  font-weight: 600;
  font-size: 0.85rem;
  color: var(--ink);
}

.work-card__subtitle {
  font-size: 0.72rem;
  color: var(--muted);
}

.work-card__desc {
  font-size: 0.78rem;
  color: var(--muted);
}

.work-card:hover figcaption,
.work-card:focus-within figcaption {
  opacity: 1;
}

.carousel__controls {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

.ghost {
  border: 1px solid var(--line);
  background: transparent;
  color: var(--ink);
  padding: 10px 18px;
  border-radius: 999px;
  font-size: 0.9rem;
  cursor: pointer;
  transition: background 0.2s ease, border 0.2s ease;
}

.ghost:hover,
.ghost:focus {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.3);
}

.about {
  margin-top: 48px;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.about-grid {
  display: grid;
  gap: 24px;
  font-size: clamp(1.6rem, 2.6vw, 2.4rem);
  line-height: 1.5;
}

.about-grid p {
  color: var(--ink);
}

.about-grid a {
  color: #b5b5b5;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s ease;
}

.about-grid a:hover,
.about-grid a:focus {
  border-color: currentColor;
}

html[data-theme="light"] .hero h1,
html[data-theme="light"] .about-grid p {
  color: #0a0a0a;
}

html[data-theme="light"] .about-grid a {
  color: #b5b5b5;
}

html[data-theme="light"] .about-grid a:hover,
html[data-theme="light"] .about-grid a:focus {
  color: #b5b5b5;
}

.contact {
  margin-top: 48px;
}

.contact-card {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 24px 0;
  display: grid;
  gap: 12px;
}

.contact-card p {
  color: var(--muted);
  max-width: 520px;
}

.contact-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.site-footer {
  margin-top: 64px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  color: var(--muted);
  font-size: 0.85rem;
  border-top: 1px solid var(--line);
  padding-top: 24px;
}

@media (max-width: 900px) {
  .site-header {
    flex-direction: column;
    align-items: flex-start;
  }

  .section-title {
    flex-direction: column;
    align-items: flex-start;
  }

  .carousel__controls {
    justify-content: flex-start;
  }
}

@media (min-width: 901px) {
  .hero {
    min-height: calc(
      100vh - var(--header-height) - var(--carousel-height) - var(--page-pad-top) -
        var(--page-pad-bottom)
    );
  }
}

@media (max-width: 720px) {
  .work-card__media img,
  .work-card__media video {
    height: 56.25vw;
  }
}

@media (max-width: 560px) {
  body {
    padding: 0 16px 0;
    font-size: 14px;
  }

  .site-header {
    padding-top: 24px;
    margin-bottom: 32px;
  }

  .logo {
    font-size: 0.95rem;
  }

  .theme-toggle {
    width: 24px;
    height: 24px;
    top: 18px;
    right: 16px;
  }

  .theme-toggle svg {
    width: 12px;
    height: 12px;
  }

  .hero {
    padding-bottom: 12px;
  }

  .hero-intro {
    font-size: 0.6rem;
    letter-spacing: 0.2em;
    margin-bottom: 10px;
  }

  .hero h1 {
    font-size: clamp(1.15rem, 5.2vw, 1.7rem);
    line-height: 1.3;
  }

  .featured {
    margin-top: 18px;
  }

  .work-card__media img,
  .work-card__media video {
    height: 56.25vw;
  }

  .work-card__title {
    font-size: 0.7rem;
  }

  .work-card__subtitle {
    font-size: 0.6rem;
  }

  .work-card__desc {
    font-size: 0.62rem;
  }
}

.site-nav{margin-left:auto;margin-right:55px}






/* Touch keeps vertical page scrolling native; horizontal gestures drive the loop. */
.carousel__viewport{width:calc(100% + 2 * clamp(16px,3vw,40px));margin-inline:calc(-1 * clamp(16px,3vw,40px))}
.carousel__viewport,#sat-proposal .sat-viewport{touch-action:pan-y pinch-zoom;cursor:grab;user-select:none;-webkit-user-select:none;overscroll-behavior-x:contain}
.carousel__viewport.is-dragging,.sat-viewport.is-dragging{cursor:grabbing}
.carousel__viewport img,.sat-viewport img{-webkit-user-drag:none}
@media(min-width:901px){.site-nav,#sat-proposal .sat-nav{display:none!important}}
@media(max-width:900px){
 html{scroll-snap-type:y proximity;scroll-padding-top:20px}
 .hero,.featured,#about,.contact,#sat-proposal .sat-hero,#sat-proposal .sat-section{scroll-snap-align:start;scroll-snap-stop:normal}
 .carousel{scroll-snap-align:none}
 .about,.contact{scroll-snap-stop:normal}
}
@media(prefers-reduced-motion:reduce){html,body{scroll-behavior:auto}}

/* Keep the first carousel flush with the bottom of the initial screen. */
.intro-screen{min-height:100vh;min-height:100svh;display:flex;flex-direction:column}
.intro-screen>.site-header{flex:none}
.intro-screen>.hero{flex:1 0 auto;min-height:0!important}
.intro-screen>.featured{flex:none;margin-top:0}
.intro-screen .carousel{gap:0}
.intro-screen .section-title{margin-bottom:12px}
.intro-screen .section-title h2{font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}

@media(max-width:900px){.intro-screen{scroll-snap-align:start}.intro-screen>.hero{scroll-snap-align:none}}

@media(hover:hover) and (pointer:fine){.carousel__viewport,.carousel__viewport.is-dragging,#sat-proposal .sat-viewport,#sat-proposal .sat-viewport.is-dragging{cursor:default}}

#sat-proposal .sat-film.sat-vimeo{display:block;position:relative;width:calc(100% + 2 * clamp(16px,3vw,40px));max-width:none;margin:26px calc(-1 * clamp(16px,3vw,40px)) 0;border:0;background:#000;aspect-ratio:16/9}
#sat-proposal .sat-vimeo iframe{position:absolute;inset:0;display:block;width:100%;height:100%;border:0}
@media(max-width:650px){#sat-proposal .sat-film.sat-vimeo{width:calc(100% + 32px);margin-inline:-16px}}

#sat-proposal .sat-vimeo iframe{pointer-events:none}
#sat-proposal .sat-video-controls{position:absolute;z-index:2;bottom:0;left:0;right:0;display:flex;align-items:center;gap:10px;padding:32px 18px 14px;background:linear-gradient(transparent,#000c);opacity:0;pointer-events:none;transition:opacity .18s}
#sat-proposal .sat-vimeo:focus-within .sat-video-controls,#sat-proposal .sat-vimeo.is-controls-visible .sat-video-controls{opacity:1;pointer-events:auto}
#sat-proposal .sat-video-controls button{color:#fff;border-color:#ffffff66;background:#0004;font-size:12px;white-space:nowrap}
#sat-proposal .sat-video-controls input{min-width:25px;flex:1;accent-color:white}
#sat-proposal .sat-vimeo:fullscreen{width:100%;height:100%;margin:0;aspect-ratio:auto}
@media(max-width:500px){#sat-proposal .sat-video-controls{gap:6px;padding-inline:10px}#sat-proposal .sat-video-controls button{padding:8px;font-size:10px}}

#sat-proposal .sat-video-controls button{width:36px;min-width:36px;height:36px;padding:8px;flex:none}#sat-proposal .sat-video-controls svg{display:block;flex:none}

/* Navigation is intentionally absent on every screen size. */
.site-nav,#sat-proposal .sat-nav{display:none!important}
/* Keep mobile section stops sparse so native fling scrolling stays fluid. */
@media(hover:none),(pointer:coarse){
 html{scroll-snap-type:y proximity;scroll-behavior:auto}
 .intro-screen>.hero,.intro-screen>.featured,.carousel{scroll-snap-align:none;scroll-snap-stop:normal}
 .intro-screen,#about,.contact{scroll-snap-align:start;scroll-snap-stop:normal}
}

/* Native horizontal scrolling on phones; native section snapping in the page. */
.native-touch-carousel .carousel__viewport,#sat-proposal .native-touch-carousel .sat-viewport{overflow-x:auto!important;overflow-y:hidden;touch-action:pan-x pan-y pinch-zoom!important;-webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain;scroll-behavior:auto}
.native-touch-carousel .carousel__viewport::-webkit-scrollbar,.native-touch-carousel .sat-viewport::-webkit-scrollbar{display:none}
.native-touch-carousel .carousel__track,.native-touch-carousel .sat-track{transform:none!important;width:max-content;will-change:auto}
@media(max-width:900px),(hover:none),(pointer:coarse){
 html{scroll-snap-type:y mandatory!important;scroll-padding-top:0;scroll-behavior:auto}
 .intro-screen,#about,.contact,#sat-proposal>.sat-hero,#sat-proposal>.sat-section{scroll-snap-align:start!important;scroll-snap-stop:always!important;scroll-margin-top:0}
 .intro-screen>.hero,.intro-screen>.featured,.carousel{scroll-snap-align:none!important}
}

@media(hover:hover) and (pointer:fine){#sat-proposal .sat-vimeo:hover .sat-video-controls{opacity:1;pointer-events:auto}}
#sat-proposal .sat-vimeo[data-touch-controls="hidden"] .sat-video-controls{opacity:0;pointer-events:none}

/* First mobile scroll brings the carousel above About into view. */
@media(max-width:900px),(hover:none),(pointer:coarse){
 .intro-screen .carousel{scroll-snap-align:start!important;scroll-snap-stop:always!important;scroll-margin-top:0}
 #about{scroll-margin-top:0!important}
}

#sat-proposal .sat-opening{min-height:100vh;min-height:100svh;display:flex;flex-direction:column}
#sat-proposal .sat-opening>.sat-header{flex:none;margin:0;padding:36px clamp(16px,3vw,40px) 48px}
#sat-proposal .sat-opening>.sat-hero{flex:1 0 auto;padding:0 clamp(16px,3vw,40px) 24px}
#sat-proposal .sat-hero h1{font-size:clamp(26px,2.6vw,39px);font-weight:500;letter-spacing:-.025em;margin:0 0 18px}
#sat-proposal .sat-lede{font-size:16px;color:var(--ink)}
#sat-proposal .sat-draft-note{font-size:14px;line-height:1.5;max-width:620px;border:0;padding:0;margin-top:18px}
#sat-proposal .sat-opening>#sat-work{flex:none;padding:0;border:0}
#sat-proposal .sat-frame-media{height:425px!important}
#sat-proposal .sat-frame figcaption,#sat-proposal .sat-heading{display:none}
#sat-proposal #sat-project .sat-placeholder{border:0;padding:0;max-width:680px}
#sat-proposal .sat-section:has(.sat-vimeo){padding-top:0;border:0}
#sat-proposal .sat-section:has(.sat-vimeo) .sat-vimeo{margin-top:0}
@media(max-width:720px){#sat-proposal .sat-carousel .sat-frame-media{height:100vw!important}#sat-proposal .sat-opening>.sat-header{padding:24px 16px 32px}#sat-proposal .sat-opening>.sat-hero{padding-inline:16px;padding-bottom:20px}}
@media(max-width:900px),(hover:none),(pointer:coarse){#sat-proposal .sat-opening{scroll-snap-align:start;scroll-snap-stop:always}#sat-proposal .sat-opening .sat-hero{scroll-snap-align:none!important}#sat-proposal #sat-work{scroll-snap-align:start!important;scroll-snap-stop:always}}

#sat-proposal #sat-project{border-top:0}
/* Match the film's native frame rather than adding 16:9 letterboxing. */
#sat-proposal .sat-film.sat-vimeo{aspect-ratio:2730/1440}

#sat-proposal #sat-project,#sat-proposal .sat-additional{padding-top:72px;padding-bottom:72px}
#sat-proposal #sat-work-secondary{padding:0;border:0}
#sat-proposal .sat-additional{border:0}
#sat-proposal .sat-additional .sat-placeholder{border:0;padding:0;max-width:680px}
@media(max-width:720px){
 #sat-proposal .sat-hero h1{font-size:22px;line-height:1.2}
 #sat-proposal h2{font-size:20px}
 #sat-proposal .sat-lede{font-size:13px}
 #sat-proposal .sat-draft-note,#sat-proposal .sat-placeholder{font-size:12px;line-height:1.65}
 #sat-proposal .sat-wordmark{font-size:12px}
 #sat-proposal #sat-project,#sat-proposal .sat-additional{padding-top:52px;padding-bottom:52px}
}

@media(max-width:720px){
 #sat-proposal .sat-section h2{font-size:20px}
 #sat-proposal .sat-hero .sat-lede{font-size:13px}
 #sat-proposal .sat-hero .sat-draft-note{font-size:11px;line-height:1.65}
 #sat-proposal .sat-section .sat-placeholder{font-size:12px;line-height:1.65}
 #sat-proposal .sat-header .sat-wordmark{font-size:12px}
}

/* Inline project studies */
#sat-proposal .sat-inline-study{margin:40px 0;max-width:760px}
#sat-proposal .sat-inline-study .sat-frame-media{height:auto;display:block;background:transparent}
#sat-proposal .sat-inline-study .sat-frame{width:100%!important}
#sat-proposal .sat-inline-study img{display:block;width:100%!important;height:auto!important;max-width:100%!important;max-height:none!important}
@media(max-width:720px){#sat-proposal .sat-inline-study{margin:28px 0}}

/* Space around the final film only, in both background modes. */
#sat-proposal #sat-film-secondary{padding:70px 0!important;background:#000;border:0}
#sat-proposal #sat-film-secondary .sat-film{margin:0!important}

#sat-proposal #sat-film-context{padding:72px clamp(16px,3vw,40px);border:0}
@media(max-width:720px){#sat-proposal #sat-film-context{padding:52px 16px}}

/* The final film is already inside an edge-to-edge section. */
#sat-proposal #sat-film-secondary .sat-film.sat-vimeo{width:100%;max-width:100%;margin:0!important}
#sat-proposal .sat-video-controls{width:100%;max-width:100%;min-width:0;box-sizing:border-box}
#sat-proposal .sat-video-controls input{width:0;min-width:0;max-width:100%;flex:1 1 0}

/* Stable carousel sizing from saved image dimensions, before decoding or JS. */
#sat-proposal .sat-carousel{--sat-carousel-height:425px}
#sat-proposal .sat-carousel .sat-frame{width:calc(var(--sat-carousel-height) * var(--sat-ratio,1))!important;flex:0 0 auto}
#sat-proposal .sat-carousel .sat-frame .sat-frame-media{display:block;width:100%;height:var(--sat-carousel-height)!important}
#sat-proposal .sat-carousel .sat-frame .sat-frame-media img{display:block;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain}
@media(max-width:720px){#sat-proposal .sat-carousel{--sat-carousel-height:100vw}}

#sat-proposal #sat-film-before-context{padding:0!important;border:0}
#sat-proposal #sat-film-before-context .sat-film.sat-vimeo{width:100%;max-width:100%;margin:0!important}

/* Quiet audio controls beneath the first inline project image. */
#sat-proposal .sat-audio-player{color:var(--ink);margin:20px 0 40px;width:100%;max-width:760px}
#sat-proposal .sat-audio-player canvas{display:block;width:100%;height:40px;margin:0 0 12px;opacity:.7}
#sat-proposal .sat-audio-row{display:grid;grid-template-columns:24px auto minmax(0,1fr) auto;align-items:center;gap:12px}
#sat-proposal .sat-audio-player [data-audio-play]{display:grid;place-items:center;width:24px;height:24px;min-width:24px;min-height:24px;border:0;background:none;padding:0;color:inherit;border-radius:0}
#sat-proposal .sat-audio-player svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
#sat-proposal .sat-audio-player time{font:10px/1.2 Arial,Helvetica,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap}
#sat-proposal .sat-audio-player input[type=range]{appearance:none;-webkit-appearance:none;display:block;width:100%;min-width:0;height:24px;margin:0;padding:0;border:0;border-radius:0;background:linear-gradient(to right,currentColor 0 var(--audio-progress,0%),#9996 var(--audio-progress,0%) 100%) center/100% 1px no-repeat;color:inherit;cursor:pointer}
#sat-proposal .sat-audio-player input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:1px;height:10px;background:currentColor;border:0;border-radius:0}
#sat-proposal .sat-audio-player input[type=range]::-moz-range-thumb{width:1px;height:10px;background:currentColor;border:0;border-radius:0}
#sat-proposal .sat-audio-player [data-audio-status]{font-size:11px;margin:8px 0 0}
#sat-proposal .sat-audio-player [data-audio-status]:empty{display:none}
@media(prefers-reduced-motion:reduce){#sat-proposal .sat-audio-player canvas{display:none}}

#sat-proposal .sat-opening .sat-hero h1{font-size:16px;font-weight:400;letter-spacing:0;text-transform:lowercase;line-height:1.4}
@media(max-width:720px){#sat-proposal .sat-opening .sat-hero h1{font-size:14px}}

/* Crop the final landscape film to an edge-to-edge square on phones. */
@media(max-width:720px){
 #sat-proposal #sat-film-secondary .sat-film.sat-vimeo{aspect-ratio:1 / 1!important;overflow:hidden}
 #sat-proposal #sat-film-secondary .sat-vimeo iframe{left:50%;top:50%;right:auto;bottom:auto;width:177.777778%;height:100%;max-width:none;transform:translate(-50%,-50%)}
}

#sat-proposal #sat-dome-slideshow{padding:0!important;border:0;background:#000}
#sat-proposal .sat-slideshow{position:relative;width:100%;aspect-ratio:1;max-height:90svh;background:#000;overflow:hidden}
#sat-proposal .sat-slideshow img{position:absolute;inset:0;display:block;width:100%!important;height:100%!important;object-fit:contain;opacity:0;filter:blur(6px);transition:opacity .28s ease,filter .28s ease;pointer-events:none}
#sat-proposal .sat-slideshow img.is-active{opacity:1;filter:blur(0)}
#sat-proposal .sat-slideshow [data-slideshow-toggle]{position:absolute;z-index:2;right:12px;bottom:12px;display:grid;place-items:center;width:32px;height:32px;min-width:32px;min-height:32px;margin:0;padding:7px;border:1px solid #fff6;border-radius:50%;background:#0005;color:#fff}
#sat-proposal .sat-slideshow [data-slideshow-toggle][hidden]{display:none}
#sat-proposal .sat-slideshow button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round}
@media(prefers-reduced-motion:reduce){#sat-proposal .sat-slideshow img{transition:none;filter:none}}

/* Dark means true black, including the proposal and overscroll canvas. */
html #sat-proposal:not([data-theme="light"]){--paper:#000000;background:#000000}
body:has(#sat-proposal:not([data-theme="light"])){background:#000000!important}
html:has(#sat-proposal:not([data-theme="light"])){background:#000000}

#sat-proposal #sat-dome-slideshow{padding:70px 0!important;background:#000}
#sat-proposal .sat-slideshow img{filter:blur(12px);transition:opacity 1.6s ease-in-out,filter 1.6s ease-in-out}
#sat-proposal .sat-slideshow img.is-active{filter:blur(0)}
@media(prefers-reduced-motion:reduce){#sat-proposal .sat-slideshow img{transition:none;filter:none}}

#sat-proposal .sat-slideshow{cursor:pointer;touch-action:pan-y pinch-zoom}
#sat-proposal .sat-slideshow:focus-visible{outline:1px solid #aaa;outline-offset:-1px}

/* No touch flash or image selection when advancing the slideshow. */
#sat-proposal .sat-slideshow,#sat-proposal .sat-slideshow *{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}
#sat-proposal .sat-slideshow img{-webkit-user-drag:none}
#sat-proposal .sat-slideshow:focus:not(:focus-visible){outline:none}

#sat-proposal #sat-dome-slideshow{padding:70px 20px!important;background:#000}

/* Match the homepage and proposal carousel height on mobile. */
@media (max-width: 720px) {
  .intro-screen .work-card__media img,
  .intro-screen .work-card__media video { height: 100vw; }
}

/* Quiet, centered password screen and unframed theme controls. */
#sat-proposal .sat-theme, .theme-toggle { border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; }
#sat-proposal .sat-theme {padding:0; width:36px; height:36px; min-width:36px; display:grid; place-items:center;}
#sat-proposal .sat-hero .sat-project-context,
#sat-proposal .sat-hero .sat-duration,
#sat-proposal .sat-hero .sat-lede {font-size:14px; line-height:1.6; font-weight:400; color:var(--dim); margin:0 0 12px;}
#sat-proposal .sat-opening .sat-hero h1 {margin:0 0 12px;}
#sat-proposal .sat-hero .sat-lede {margin-top:24px;}
body:has(.post-password-form) {background:var(--bg); color:var(--muted); padding:0 24px;}
body:has(.post-password-form) .wp-page-content {min-height:100svh; display:grid; place-items:center; padding:40px 0;}
body.admin-bar:has(.post-password-form) .wp-page-content {min-height:calc(100svh - 32px);}
.post-password-form {width:min(100%,320px); margin:0 auto; font:400 13px/1.7 "Manrope",sans-serif; text-align:center; color:var(--muted);}
.post-password-form p {margin:0 0 24px;}
.post-password-form p:last-child {display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:center; gap:16px;}
.post-password-form label {display:block; flex:1 1 100%; text-align:left; font-size:12px;}
.post-password-form input[type="password"] {display:block; width:100%; margin:8px 0 0; padding:10px 0; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; color:var(--ink); font:inherit; outline-offset:4px;}
.post-password-form input[type="submit"] {appearance:none; padding:5px 0; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; color:var(--muted); font:inherit; cursor:pointer;}
@media(max-width:720px){#sat-proposal .sat-hero .sat-project-context,#sat-proposal .sat-hero .sat-duration,#sat-proposal .sat-hero .sat-lede{font-size:12px;}}

#sat-proposal .sat-audio-player .sat-audio-caption {margin:16px 0 0;font-size:12px;line-height:1.5;color:var(--dim);}
/* Roomier desktop presentation; retain the existing phone layout. */
@media(min-width:901px) {
 .intro-screen .work-card__media img,.intro-screen .work-card__media video {height:552.5px;}
 #sat-proposal .sat-carousel {--sat-carousel-height:552.5px;}
 #sat-proposal .sat-carousel .sat-frame-media {height:552.5px!important;}
 #sat-proposal .sat-section .sat-placeholder {font-size:20px;line-height:1.7;}
 #sat-proposal #sat-project .sat-placeholder,#sat-proposal .sat-additional .sat-placeholder {max-width:960px;}
 #sat-proposal .sat-section h2 {font-size:32px;margin-bottom:36px;}
 #sat-proposal .sat-section p {margin-bottom:30px;}
 #sat-proposal #sat-project,#sat-proposal .sat-additional {padding-top:90px;padding-bottom:90px;}
 #sat-proposal .sat-inline-study {width:100%;max-width:1100px;margin:60px 0;}
 #sat-proposal .sat-inline-study .sat-frame-media {height:auto!important;}
 #sat-proposal .sat-audio-player {max-width:1100px;margin-bottom:60px;}
 #sat-proposal .sat-audio-player canvas {height:56px;}
 #sat-proposal .sat-audio-player time {font-size:12px;}
 #sat-proposal .sat-audio-player .sat-audio-caption {font-size:14px;margin-bottom:0;}
 #sat-proposal #sat-film-context .sat-placeholder {max-width:960px;}
 #sat-proposal .sat-footer {font-size:14px;}
}

/* Standalone studies must use the complete image, independent of carousel sizing. */
#sat-proposal .sat-inline-study .sat-frame {width:100%!important;max-width:100%;margin:0;overflow:visible;}
#sat-proposal .sat-inline-study .sat-frame-media {width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:auto!important;overflow:visible;display:block;}
#sat-proposal .sat-inline-study .sat-frame-media img {width:100%!important;height:auto!important;max-width:100%!important;max-height:none!important;object-fit:contain!important;object-position:center;aspect-ratio:auto!important;display:block;}

.portfolio-contact-footer {padding:40px 0 48px;color:var(--muted);font-size:13px;line-height:1.7;}
.portfolio-contact-footer a {color:inherit;text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:3px;}
.portfolio-contact-footer a:hover {color:var(--ink);}
@media(max-width:720px) {
 .intro-screen .hero h1,.about .about-grid {font-size:clamp(16px,4.35vw,20px);line-height:1.45;font-weight:400;letter-spacing:-.015em;}
 .intro-screen>.hero {padding-bottom:32px;}
 .intro-screen .section-title {margin-bottom:14px;}
 .about .about-grid {gap:28px;}
 .portfolio-contact-footer {font-size:12px;padding:32px 0 40px;}
}

html[data-theme="light"] {--bg:#ffffff;}

#sat-proposal .sat-footer.sat-film-credit {display:block;background:#000;color:#fff;border:0;padding:32px clamp(16px,3vw,40px) 48px;margin:0;font-size:14px;line-height:1.5;}
#sat-proposal .sat-footer.sat-film-credit p {margin:0;color:#fff;}
@media(max-width:720px){#sat-proposal .sat-footer.sat-film-credit{font-size:12px;padding:28px 16px 40px;}}

/* The SAT opening has three native vertical stops: intro, carousel, project text. */
html:has(#sat-proposal) {scroll-snap-type:y mandatory!important;scroll-padding-top:0;}
#sat-proposal .sat-opening {scroll-snap-align:start!important;scroll-snap-stop:always!important;}
#sat-proposal .sat-opening .sat-header,#sat-proposal .sat-opening .sat-hero {scroll-snap-align:none!important;}
#sat-proposal .sat-opening #sat-work,
#sat-proposal > #sat-project {scroll-snap-align:start!important;scroll-snap-stop:always!important;scroll-margin-top:0!important;}

/* SAT opening gestures are controlled explicitly; avoid competing native snap areas. */
html:has(#sat-proposal) {scroll-snap-type:none!important;}

html.home-reading {scroll-snap-type:none!important;}
.portfolio-contact-footer {scroll-snap-align:end;scroll-snap-stop:normal;}

#sat-proposal #sat-film-context {background:#000;color:#fff;}
#sat-proposal #sat-film-context h2 {font-size:14px;font-weight:400;letter-spacing:0;line-height:1.5;color:#fff;margin:0 0 24px;}
#sat-proposal #sat-film-context .sat-placeholder {border:0;padding:0;color:#fff;margin:0;max-width:960px;}
@media(max-width:720px){#sat-proposal #sat-film-context h2{font-size:12px;}}

#sat-proposal .sat-section:has(.sat-vimeo):has(+ #sat-film-before-context) {padding:0!important;margin:0;border:0;background:#000;}
#sat-proposal .sat-section:has(.sat-vimeo):has(+ #sat-film-before-context) .sat-vimeo {width:100%;max-width:100%;margin:0!important;}

#sat-proposal .sat-film-description {background:#000;color:#fff;border:0;padding:64px clamp(16px,3vw,40px);}
#sat-proposal .sat-film-description h2 {color:#fff;font-size:14px;font-weight:400;letter-spacing:0;line-height:1.5;margin:0 0 24px;}
#sat-proposal .sat-film-description .sat-placeholder {color:#fff;border:0;padding:0;max-width:960px;margin:0;}
#sat-proposal .sat-film-credit .sat-credit-description {font-size:20px;line-height:1.7;max-width:960px;margin-top:24px;color:#fff;}
#sat-proposal .sat-section:has(iframe[src*="787089285"]) {padding:0!important;background:#000;border:0;}
#sat-proposal .sat-section:has(iframe[src*="787089285"]) .sat-vimeo {width:100%;max-width:100%;margin:0!important;}
@media(max-width:720px){#sat-proposal .sat-film-description{padding:52px 16px;}#sat-proposal .sat-film-description h2{font-size:12px;}#sat-proposal .sat-film-credit .sat-credit-description{font-size:12px;line-height:1.65;}}

/* Join each film to its black description without the section's bottom gutter. */
#sat-proposal .sat-section:has(> .sat-vimeo) {padding:0!important;margin:0!important;border:0!important;background:#000;}
#sat-proposal .sat-section:has(> .sat-vimeo) > .sat-vimeo {width:100%;max-width:100%;margin:0!important;}
#sat-proposal #sat-film-secondary {padding:70px 0!important;}
#sat-proposal .sat-film-intro {background:#fff;color:#111;border:0;padding:64px clamp(16px,3vw,40px);}
#sat-proposal .sat-film-intro .sat-placeholder {color:#555;border:0;padding:0;margin:0;max-width:960px;}
@media(max-width:720px){#sat-proposal .sat-film-intro{padding:52px 16px;}}

#sat-proposal .sat-caption:empty {display:none!important;margin:0!important;padding:0!important;}

/* Seamless slideshow-to-text transition in either viewing mode. */
#sat-proposal #sat-dome-slideshow,
#sat-proposal #sat-dome-slideshow + .sat-section {border:0!important;outline:0;box-shadow:none;background:#000;}
#sat-proposal #sat-dome-slideshow + .sat-section {color:#fff;}
#sat-proposal #sat-dome-slideshow + .sat-section .sat-placeholder {border:0!important;color:#fff;}
#sat-proposal #sat-dome-slideshow .sat-slideshow {border:0;outline:0;box-shadow:none;}

#sat-proposal .sat-header .sat-budget-link {margin-left:auto;color:var(--dim);font-size:12px;font-weight:400;text-decoration:none;line-height:1.5;letter-spacing:0;}
#sat-proposal .sat-header .sat-budget-link:hover {color:var(--ink);}
@media(max-width:720px){#sat-proposal .sat-header .sat-budget-link{font-size:11px;}#sat-proposal .sat-header .sat-theme{margin-left:0;}}