@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Manrope:wght@400;500;600;700&display=swap');
:root{--paper:#f7f6f2;--ink:#252622;--muted:#898a82;--line:#deded6;--olive:#69745f;--wine:#7e252d;--serif:Georgia,'Times New Roman',serif;--sans:'DM Sans',Arial,sans-serif;--display:Manrope,'Arial',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.site-header{position:absolute;top:0;right:clamp(24px,5vw,78px);z-index:20;padding:0;display:flex;align-items:center;justify-content:flex-end}.home-mark.menu-toggle{position:relative;width:49px;height:49px;padding:0;border:0;background:transparent;display:block;border-radius:50%;overflow:hidden;cursor:pointer;transition:transform .3s ease}.home-mark.menu-toggle:hover{transform:scale(1.04)}.home-mark img{width:100%;height:100%;object-fit:cover;display:block}.mark-menu{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:#242521b8;opacity:0;transition:opacity .2s}.home-mark:hover .mark-menu,.home-mark:focus-visible .mark-menu,.menu-open .mark-menu{opacity:1}.mark-menu i{width:15px;height:1px;background:#f7f6f2;transition:transform .25s}.menu-open .mark-menu i:first-child{transform:translateY(3px) rotate(45deg)}.menu-open .mark-menu i:last-child{transform:translateY(-3px) rotate(-45deg)}.menu-panel{position:fixed;inset:0;z-index:15;background:#eeede7;display:grid;align-items:center;padding:100px clamp(24px,10vw,160px);opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}.menu-open .menu-panel{opacity:1;visibility:visible}.menu-panel-inner{max-width:950px;width:100%;margin:auto}.eyebrow{font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--olive);display:block;margin:0 0 15px}.menu-panel-inner>a{display:flex;align-items:baseline;justify-content:space-between;border-bottom:1px solid #d7d6ce;padding:14px 0 18px;text-decoration:none;color:var(--ink);font:500 clamp(38px,7vw,84px)/1.1 var(--display);letter-spacing:-.065em}.menu-panel-inner>a:hover{color:var(--olive)}.menu-panel-inner>a span{font:11px var(--sans);letter-spacing:.1em;color:var(--muted)}.menu-note{margin-top:42px;color:#77786f;font:italic 19px var(--serif)}.film-section{padding:0}.film-frame{position:relative;width:100%;max-width:none;margin:0 auto;height:75svh;min-height:480px;aspect-ratio:auto;background:#d7d5ce;overflow:hidden;color:#f5f3ec}.street-film,.film-placeholder{width:100%;height:100%;position:absolute;inset:0}.street-film{z-index:1;object-fit:cover;display:none}.film-frame.has-film .street-film{display:block}.film-frame.has-film .film-placeholder{display:none}.film-placeholder{overflow:hidden;background:linear-gradient(112deg,#292a26 0%,#35352f 44%,#565247 100%);display:flex;flex-direction:column;justify-content:space-between;padding:clamp(20px,4vw,58px)}.placeholder-grid{position:absolute;inset:0;background:linear-gradient(90deg,transparent 49.8%,#ffffff0c 50%,transparent 50.2%),linear-gradient(0deg,transparent 49.8%,#ffffff0b 50%,transparent 50.2%);background-size:13.5% 100%,100% 22%;opacity:.8}.placeholder-grid:after{content:"";position:absolute;left:15%;right:14%;top:-40%;bottom:-30%;border-left:1px solid #ffffff12;border-right:1px solid #ffffff12;transform:skew(-13deg);background:linear-gradient(90deg,#b7a98c08,transparent 45%,#b7a98c12)}.placeholder-small,.placeholder-title,.placeholder-index{position:relative;z-index:1}.placeholder-small,.placeholder-index{font-size:9px;letter-spacing:.15em;color:#d4d0c5}.placeholder-title{font:500 clamp(46px,10vw,132px)/.92 var(--display);letter-spacing:-.075em;max-width:820px}.placeholder-title em{font:italic 400 1em var(--serif);letter-spacing:-.065em;color:#d7cbb6}.placeholder-index{display:flex;gap:12px;align-items:center}.placeholder-index b{color:#a8a08e;font-weight:400}.placeholder-orb{position:absolute;width:clamp(100px,23vw,290px);height:clamp(100px,23vw,290px);border:1px solid #d3c8b17a;border-radius:50%;right:17%;top:19%;box-shadow:0 0 0 24px #d3c8b10a,0 0 0 55px #d3c8b108}.placeholder-orb:after{content:"";position:absolute;width:13px;height:13px;background:#b3443b;border-radius:50%;left:50%;top:-7px}.film-caption{position:absolute;z-index:2;bottom:17px;left:clamp(20px,4vw,58px);right:clamp(20px,4vw,58px);display:flex;justify-content:space-between;color:#f3f1e9b8;font-size:9px;text-transform:uppercase;letter-spacing:.13em;pointer-events:none}.beta-section{background:#fff;max-width:none;margin:clamp(55px,8vw,112px) auto 0;padding:44px clamp(24px,8vw,116px);display:grid;grid-template-columns:1fr auto;column-gap:34px;align-items:center}.beta-rule{grid-column:1/-1;border-top:1px solid var(--line);margin-bottom:29px}.beta-cta{display:flex;align-items:center;gap:clamp(18px,3vw,38px);color:inherit;text-decoration:none;width:fit-content}.beta-logo{width:clamp(82px,12vw,142px);height:clamp(82px,12vw,142px);border-radius:50%;overflow:hidden;flex:none;background:white;box-shadow:0 0 0 1px #e7e4dc}.beta-logo img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.beta-cta:hover .beta-logo img{transform:scale(1.07)}.beta-copy{display:flex;flex-direction:column;align-items:flex-start}.beta-copy .eyebrow{margin-bottom:9px}.beta-title{font:500 clamp(18px,2.7vw,32px)/1.26 var(--display);letter-spacing:-.045em}.beta-link{display:inline-flex;gap:17px;align-items:center;margin-top:16px;color:var(--olive);font-size:11px;text-transform:uppercase;letter-spacing:.11em}.beta-link span{font-size:17px;transition:transform .2s}.beta-cta:hover .beta-link span{transform:translate(3px,-3px)}.beta-aside{margin:0;color:#84857c;font:italic 15px/1.6 var(--serif);text-align:right}.about-section{margin:clamp(95px,14vw,185px) clamp(24px,8vw,116px) 0;padding:24px 0 70px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 2fr;gap:32px}.about-section .eyebrow{margin-top:5px}.about-section>p:last-child{font:400 clamp(23px,4vw,48px)/1.28 var(--display);letter-spacing:-.055em;max-width:780px;margin:0}.site-footer{padding:23px clamp(24px,5vw,78px);border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;color:#898a82;font-size:9px;letter-spacing:.13em;text-transform:uppercase}.site-footer a{color:inherit;text-decoration:none}.site-footer a:hover{color:var(--ink)}.registration{border:0;padding:0;width:min(560px,calc(100% - 32px));max-height:calc(100% - 32px);background:var(--paper);color:var(--ink);box-shadow:0 25px 100px #191a1650}.registration::backdrop{background:#20211db8;backdrop-filter:blur(5px)}.registration[open]{animation:dialog-in .25s ease-out}@keyframes dialog-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.registration-form{position:relative;padding:clamp(27px,6vw,55px)}.close-dialog{position:absolute;right:22px;top:18px;border:0;background:none;font:300 30px var(--sans);color:#77786f;cursor:pointer}.registration-form h2{font:500 clamp(42px,8vw,66px)/1.02 var(--display);letter-spacing:-.07em;margin:0 0 15px}.registration-form h2 em{font:italic 400 1em var(--serif);color:var(--olive)}.form-intro{color:#77786f;font-size:13px;line-height:1.6;margin:0 0 27px}.registration-form label{display:block;font-size:10px;color:#5e6058;margin:17px 0 7px}.registration-form label span{color:#9a9b93}.registration-form input,.registration-form textarea{display:block;width:100%;border:0;border-bottom:1px solid #c9c9c0;background:transparent;padding:9px 2px;font:14px var(--sans);color:var(--ink);outline:none;resize:vertical}.registration-form input:focus,.registration-form textarea:focus{border-color:var(--olive)}.submit-button{width:100%;margin-top:24px;border:0;background:var(--ink);color:white;padding:15px 18px;display:flex;justify-content:space-between;cursor:pointer;font:500 11px var(--sans);text-transform:uppercase;letter-spacing:.1em}.submit-button:hover{background:var(--olive)}.form-privacy{font-size:10px;color:#898a82;margin:13px 0 0;text-align:center}.form-notice{font-size:12px;line-height:1.6;padding:11px 13px;background:#ebece5;color:#555d4f;margin:16px 0 0}.form-notice a{color:inherit}@media(max-width:650px){.site-header{right:18px}.home-mark{width:43px;height:43px}.menu-toggle{width:43px;height:43px}.film-frame{height:75svh;min-height:360px}.film-placeholder{padding:22px}.placeholder-title{font-size:clamp(43px,12vw,70px)}.placeholder-orb{right:11%;top:27%}.film-caption{bottom:12px;font-size:8px}.beta-section{grid-template-columns:1fr;padding:0 22px}.beta-aside{display:none}.beta-cta{gap:17px}.beta-logo{width:76px;height:76px}.beta-title{font-size:19px}.beta-link{font-size:9px;margin-top:12px}.about-section{grid-template-columns:1fr;gap:4px;margin:90px 22px 0;padding-bottom:55px}.about-section>p:last-child{font-size:31px}.site-footer{font-size:8px;letter-spacing:.08em}.site-footer span:nth-child(2){display:none}}

/* Keep the opening film and beta invitation together in the first viewport. */
.film-frame {
  height: 70svh;
  min-height: 360px;
}
.street-film {
  object-fit: cover;
  object-position: center;
}
.beta-section {
  margin-top: 0;
  padding: 18px clamp(22px, 8vw, 116px);
}
.beta-rule {
  margin-bottom: 14px;
}
.beta-logo {
  width: clamp(64px, 8vw, 88px);
  height: clamp(64px, 8vw, 88px);
}
.beta-title {
  font-size: clamp(19px, 2.5vw, 30px);
  line-height: 1.18;
}
.beta-link {
  margin-top: 9px;
}
@media (max-width: 650px) {
  .film-frame {
    height: 68svh;
    min-height: 320px;
  }
  .beta-section {
    padding: 16px 22px;
  }
  .beta-rule {
    margin-bottom: 12px;
  }
  .beta-logo {
    width: 60px;
    height: 60px;
  }
}

/* Minimal menu mark and browser-native video controls. */
.site-header {
  right: clamp(24px, 5vw, 78px);
}
.home-mark.menu-toggle {
  width: 42px;
  height: 42px;
  border-radius: 0;
  overflow: visible;
  background: transparent;
}
.menu-icon {
  width: 25px;
  height: 20px;
  margin: auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.menu-icon i {
  display: block;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background: #343632;
  transition: transform .2s ease, opacity .2s ease;
}
.menu-open .menu-icon i:first-child {
  transform: translateY(9px) rotate(45deg);
}
.menu-open .menu-icon i:nth-child(2) {
  opacity: 0;
}
.menu-open .menu-icon i:last-child {
  transform: translateY(-9px) rotate(-45deg);
}
.home-mark.menu-toggle:hover {
  transform: none;
}

.sound-cue {
  position: absolute;
  z-index: 4;
  right: clamp(24px, 5vw, 72px);
  bottom: 82px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: #252622;
  opacity: 0;
  pointer-events: none;
  transform: translateY(5px);
  transition: opacity .35s ease, transform .35s ease;
}
.sound-cue.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.sound-icon {
  width: 52px;
  height: 52px;
  padding: 10px;
  border-radius: 50%;
  background: #f7f6f2ed;
  box-shadow: 0 2px 16px #0003;
}
.sound-cue > span {
  padding: 6px 10px;
  border-radius: 20px;
  background: #f7f6f2ed;
  font: 600 10px/1 var(--sans);
  letter-spacing: .1em;
  text-transform: uppercase;
  white-space: nowrap;
}
@media (max-width: 650px) {
  .sound-cue {
    right: 20px;
    bottom: 76px;
  }
  .sound-icon {
    width: 46px;
    height: 46px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .sound-cue {
    transition: none;
  }
}

/* Aim the sound cue at Chrome's mute button (just left of fullscreen). */
.sound-cue {
  right: 29%;
  bottom: 82px;
}
@media (max-width: 650px) {
  .sound-cue {
    right: 29%;
    bottom: 76px;
  }
  }

/* Compact unmute hint, positioned just above the native controls. */
.sound-cue {
  right: 20%;
  bottom: 66px;
  gap: 5px;
}
.sound-icon {
  width: 40px;
  height: 40px;
  padding: 8px;
}
.sound-cue > span {
  padding: 4px 8px;
  font-size: 9px;
  letter-spacing: .08em;
}
@media (max-width: 650px) {
  .sound-cue {
    right: 20%;
    bottom: 60px;
  }
  .sound-icon {
    width: 36px;
    height: 36px;
    padding: 7px;
  }
  }

/* Keep the 16:9 source edge-to-edge when the viewport narrows. */
.film-frame {
  height: min(70svh, 56.25vw);
  min-height: 0;
}
@media (max-width: 650px) {
  .film-frame {
    height: min(68svh, 56.25vw);
  }
}

.film-placeholder {
  display: block;
  padding: 0;
  background: #11131a;
}
.film-poster {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}


/* Give the Textile Designer name a restrained signature in the beta headline. */
.textile-brand {
  position: relative;
  display: inline-block;
  padding-bottom: 4px;
  color: #1a2788;
  font-weight: 600;
  letter-spacing: .012em;
  white-space: nowrap;
}
.textile-brand::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: #d86c52;
  content: "";
}


/* Registration delivery states */
.form-trap {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
}
.submit-button:disabled {
  opacity: .65;
  cursor: wait;
}
.form-error {
  margin: 14px 0 0;
  color: #8a2727;
  font-size: 12px;
  line-height: 1.5;
}
.registration-success {
  padding: clamp(30px, 7vw, 60px);
}
.registration-success h2 {
  font: 500 clamp(42px, 8vw, 66px)/1.02 var(--display);
  letter-spacing: -.07em;
  margin: 0 0 18px;
}
.registration-success > p:not(.eyebrow) {
  margin: 0;
  color: #5e6058;
  font-size: 15px;
  line-height: 1.7;
}
.registration-success .success-close {
  margin-top: 28px;
}
[hidden] {
  display: none !important;
}
