@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:light;--paper:#faf8f2;--ink:#302c27;--soft:#655e53;--accent:#52604a;--line:#dfd8c9;--wash:#efece3;--serif:"Instrument Serif",Georgia,serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 "DM Sans",Arial,sans-serif}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible{outline:2px solid #774d31;outline-offset:5px}p{margin:0 0 14px}.shell{width:min(1280px,calc(100% - 92px));margin:auto}.header,.footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 0}.header{border-bottom:1px solid var(--line)}.brand{display:inline-flex;align-items:center;gap:9px;font:1.43rem/1 var(--serif);white-space:nowrap}.brand img{width:auto;height:50px;object-fit:contain}.header nav{display:flex;gap:25px;font-size:.82rem;color:var(--soft)}.header nav a:hover,.text-link:hover{color:#844e31}.button{display:inline-flex;align-items:center;justify-content:center;gap:12px;background:var(--accent);color:white;padding:13px 19px;font-weight:700;font-size:.83rem}.button:hover{background:#3e4c37}.button-small{padding:10px 14px}.text-link{font-weight:700;font-size:.85rem;text-decoration:underline;text-underline-offset:4px}.hero{display:grid;grid-template-columns:.88fr 1.12fr;gap:34px;align-items:center;padding-block:25px 37px;border-bottom:1px solid var(--line)}.hero-copy{padding:30px 0}.eyebrow{font-size:.68rem;letter-spacing:.15em;text-transform:uppercase;font-weight:700;color:var(--accent);margin-bottom:15px}h1,h2,h3,blockquote{font-family:var(--serif);font-weight:400;margin:0;line-height:.98}h1{font-size:clamp(4.2rem,8vw,7.2rem);max-width:590px;letter-spacing:-.024em}h1 em,h2 em{color:var(--accent);font-weight:400}h2{font-size:clamp(3.1rem,6.1vw,5.2rem);letter-spacing:-.018em}h3{font-size:2rem}.lead{margin-top:20px;color:var(--soft);font-size:1.05rem;max-width:465px}.actions{display:flex;flex-wrap:wrap;align-items:center;gap:19px;margin-top:23px}.hero-image{margin:0;overflow:hidden;background:var(--wash)}.hero-image img{width:100%;height:clamp(390px,44vw,610px);display:block;object-fit:cover;object-position:44% center}.section{padding-block:76px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:27px}.section-head>p{max-width:330px;color:var(--soft);margin:0}.films{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:23px 17px}.film-image{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--wash)}.film-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}.film-link:hover img{transform:scale(1.04)}.play{position:absolute;left:14px;bottom:14px;display:grid;place-items:center;width:42px;height:42px;background:var(--paper);color:var(--accent);border-radius:50%;font-size:.8rem}.film-caption{display:flex;justify-content:space-between;gap:9px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}.film-caption span{color:var(--soft);font-size:.72rem;white-space:nowrap}.collection{background:var(--wash);border-block:1px solid var(--line);padding-block:65px}.collection-grid{display:grid;grid-template-columns:.85fr 1fr;gap:55px}.price{font-family:var(--serif);font-size:1.7rem;margin:17px 0}.price strong{font-weight:400;font-size:2.6rem}.stack{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}.stack li{padding:12px 0 12px 22px;border-bottom:1px solid var(--line);position:relative}.stack li::before{content:"✓";position:absolute;left:0;color:var(--accent)}.stack strong,.stack span{display:block}.stack span{color:var(--soft);font-size:.88rem}.approach{display:grid;grid-template-columns:.7fr 1fr;gap:clamp(26px,7vw,100px);align-items:center}.approach img{width:100%;height:440px;object-fit:cover;object-position:center 35%;display:block}.approach h2{margin-bottom:15px}.approach p:not(.eyebrow),.steps{color:var(--soft)}.steps{padding-left:20px;margin:20px 0 0}.steps li{padding:8px 0}.steps strong{color:var(--ink)}.quote{padding:47px 0;text-align:center;background:#e9eee2}.quote blockquote{font-size:clamp(2.8rem,6vw,5rem);color:#414b3a}.quote p{margin:12px 0 0;color:var(--soft)}.inquiry{display:grid;grid-template-columns:.66fr 1fr;gap:36px;align-items:start}.inquiry-panel{min-width:0;padding:10px 15px;background:#fffdf7;border:1px solid var(--line)}.form-fallback{font-size:.78rem;color:var(--soft);padding:12px 5px 0;margin:0}.form-fallback a{text-decoration:underline;text-underline-offset:3px}.guide{display:flex;align-items:center;flex-wrap:wrap;gap:15px 28px;border-block:1px solid var(--line);padding:22px 0}.guide>div{margin-right:auto}.guide h2{font-size:2.3rem}.guide p{margin:3px 0 0;color:var(--soft)}.footer{font-size:.86rem;color:var(--soft)}.footer .brand img{height:42px}dialog{width:min(1050px,96vw);max-height:94dvh;overflow:auto;border:1px solid var(--line);padding:0;background:var(--paper);color:var(--ink)}dialog::backdrop{background:#211b18c9}.viewer-bar{display:flex;justify-content:space-between;align-items:center;padding:10px 15px;gap:12px}.viewer-bar h2{font-size:clamp(2rem,5vw,3.1rem)}.viewer-bar button{border:0;background:transparent;font-size:2rem;cursor:pointer;color:var(--ink);width:42px;height:42px}.viewer-link{display:inline-block;margin:12px 15px}
@media(max-width:850px){.shell{width:calc(100% - 44px)}.header nav{gap:11px}.hero{gap:20px}.hero-image img{height:420px}.films{grid-template-columns:repeat(2,minmax(0,1fr))}.collection-grid,.inquiry{gap:25px}.section{padding-block:57px}.approach img{height:370px}}
@media(max-width:630px){.shell{width:calc(100% - 32px)}.header nav{display:none}.brand{font-size:1.22rem}.brand img{height:41px}.header .button{font-size:.73rem}.hero,.collection-grid,.approach,.inquiry{grid-template-columns:1fr}.hero{gap:8px;padding-block:8px 24px}.hero-copy{padding:22px 0 13px}h1{font-size:clamp(3.4rem,15vw,5.5rem)}.hero-image img{height:290px}.section-head{display:block}.section-head>p{margin-top:10px}.film-caption{display:block;padding:9px 0}.film-caption h3{font-size:1.6rem}.films{gap:16px 12px}.play{width:32px;height:32px;left:8px;bottom:8px}.approach img{height:340px}.footer{flex-wrap:wrap;justify-content:flex-start}.section{padding-block:48px}.collection{padding-block:44px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.film-image img{transition:none}}

.opening{position:fixed;inset:0;z-index:12;display:grid;place-items:center;pointer-events:none;background:var(--paper);animation:opening-away 1.35s ease both}
.opening[hidden]{display:none}
.opening img{height:min(38vh,230px);width:auto;animation:logo-arrive .65s cubic-bezier(.16,1,.3,1) both}
@keyframes logo-arrive{from{opacity:0;transform:translate(-18px,12px) scale(.94)}to{opacity:1;transform:none}}
@keyframes opening-away{0%,67%{opacity:1}100%{opacity:0}}
.hero-image{position:relative}
.hero-image video{width:100%;height:clamp(390px,44vw,610px);display:block;object-fit:cover;object-position:50% center}
.stack-title{margin-bottom:12px}
.testimonials{padding-top:0}
.testimonial-videos{display:grid;grid-template-columns:1fr 1.35fr;gap:18px}
.testimonial-videos article{background:var(--wash);border:1px solid var(--line);display:grid;place-items:center}
.testimonial-videos video{display:block;width:100%;height:clamp(280px,38vw,470px);object-fit:contain}
@media(max-width:850px){.hero-image video{height:420px}}
@media(max-width:630px){.hero-image video{height:290px}.testimonial-videos{grid-template-columns:1fr}.testimonial-videos video{height:330px}}
@media(prefers-reduced-motion:reduce){.opening{display:none}}

.review-rotation { max-width: 58rem; }
.review-rotation h2 { margin-bottom: 1.5rem; }
.review-slides { display: grid; }
.review-slides figure { margin: 0; }
.review-slides.is-rotating figure { grid-area: 1 / 1; }
.review-slides.is-rotating figure[aria-hidden="true"] { visibility: hidden; }
.review-slides figure p,
.review-slides blockquote { margin: 0 auto 0.75rem; font-size: clamp(1.15rem, 2vw, 1.5rem); }
.review-slides figcaption { font-weight: 650; }
.review-controls:not([hidden]) {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin: 1.25rem 0;
}
.review-controls button {
  min-width: 2.75rem;
  min-height: 2.75rem;
  padding: 0 0.75rem;
  border: 1px solid currentColor;
  border-radius: 2rem;
  background: transparent;
  color: inherit;
  cursor: pointer;
}

.sneak-links {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(13rem, 1fr);
  gap: 0.75rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding: 0.25rem 0.25rem 0.75rem;
}
.sneak-links a {
  display: grid;
  align-content: space-between;
  min-height: 6.25rem;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 0.5rem;
  background: var(--wash);
  color: inherit;
  text-decoration: none;
  scroll-snap-align: start;
}
.sneak-links a:hover span { text-decoration: underline; }
.sneak-links a { align-content: start; gap: 0.35rem; }
.sneak-links img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 9 / 16;
  object-fit: cover;
  border-radius: 0.35rem;
  margin-bottom: 0.35rem;
}

@font-face {
  font-family: "Ugly Dave";
  src: url("media/ugly-dave.otf") format("opentype");
  font-display: swap;
}
.header .brand span {
  font-family: "Ugly Dave", var(--serif);
  font-size: 1.65rem;
  color: var(--accent);
}
#viewer-films {
  position: relative;
  height: min(66dvh, 660px);
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-snap-type: y mandatory;
  scrollbar-gutter: stable;
  background: var(--wash);
}
.viewer-film {
  position: relative;
  height: 100%;
  margin-inline: clamp(0.65rem, 3vw, 2rem);
  scroll-snap-align: start;
  scroll-snap-stop: always;
}
.viewer-film img, .viewer-film iframe {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}
.viewer-film img { object-fit: cover; }
.viewer-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.45rem 0.75rem;
  gap: 0.25rem;
}
.viewer-controls button {
  min-height: 2.75rem;
  padding: 0 0.55rem;
  background: transparent;
  color: inherit;
  border: 1px solid var(--line);
  cursor: pointer;
}
.viewer-controls button:disabled { opacity: 0.4; cursor: default; }
.viewer-controls .viewer-link { margin-inline: 0; text-align: center; }
main em {
  font-family: "Ugly Dave", var(--serif);
  color: var(--accent);
  font-style: normal;
  font-size: 0.72em;
  letter-spacing: 0;
}

.header .brand span,
main em {
  text-transform: uppercase;
}

.review-booking { margin-top: 1rem; }
