@font-face{font-family:'Surface Mono';src:url('/assets/pitched-hotel-surface-mono-bold.woff') format('woff');font-weight:700;font-display:swap}
@font-face{font-family:'Surface Sans';src:url('/assets/pitched-hotel-surface-sans-bold.woff') format('woff');font-weight:700;font-display:swap}
.landing-study{color-scheme:dark;--ink:#fff;--paper:#121413;--motion:.85}
.landing-study *{box-sizing:border-box}.landing-study,.landing-study{margin:0;background:var(--paper);color:var(--ink);font-family:'Surface Mono',monospace}.landing-study button{font:inherit;color:inherit}.landing-study button:focus-visible{outline:1px solid #fff;outline-offset:5px}.landing-study button{-webkit-tap-highlight-color:transparent}.landing-study button[hidden]{display:none!important}
.landing-study.stage{position:relative;width:100%;height:var(--viewport-height,100dvh);padding:0;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#111312}
.landing-study .scene{position:relative;width:100%;height:100%;max-height:100%;flex-shrink:0;overflow:hidden;isolation:isolate}
.landing-study .canvas,.landing-study .still,.landing-study .water,.landing-study .ocean,.landing-study .diagram{position:absolute;inset:0;width:100%;height:100%}
.landing-study .still,.landing-study .ocean{object-fit:cover;object-position:50% 50%}.landing-study .still{display:block}.landing-study .water{pointer-events:none}.landing-study .ocean{opacity:0;transition:opacity .85s linear}.landing-study .ocean.visible{opacity:1}
.landing-study .diagram{overflow:visible}.landing-study .diagram text{font-family:'Surface Mono',monospace!important;font-weight:700;paint-order:stroke;stroke:#111;stroke-width:.65;stroke-opacity:.26;stroke-linejoin:round}.landing-study .field{pointer-events:none}.landing-study .annotation{cursor:pointer;transition:opacity .3s ease}.landing-study .hit-area{pointer-events:all}.landing-study .leader{stroke-dasharray:1;stroke-dashoffset:0}.landing-study .point,.landing-study .note-copy{opacity:1}.landing-study .note-copy{filter:drop-shadow(0 1px 2px #0004)}
.landing-study.js .field,.landing-study.js .point,.landing-study.js .note-copy{opacity:0}.landing-study.js .leader{stroke-dashoffset:1}.landing-study.revealing .field{animation:surface-field-in 1.1s .45s ease both}.landing-study.revealing .point{animation:surface-fade-in .3s ease both;animation-delay:calc(1.55s + var(--i)*.9s)}.landing-study.revealing .leader{animation:surface-draw-line .72s cubic-bezier(.4,0,.2,1) both;animation-delay:calc(1.7s + var(--i)*.9s)}.landing-study.revealing .note-copy{animation:surface-fade-in .5s ease both;animation-delay:calc(2.12s + var(--i)*.9s)}
.landing-study.complete .field{opacity:.85;animation:none}.landing-study.complete .point,.landing-study.complete .note-copy{opacity:1;animation:none}.landing-study.complete .leader{stroke-dashoffset:0;animation:none}.landing-study.is-focused .annotation{opacity:.25}.landing-study.is-focused .annotation.active{opacity:1}.landing-study .annotation:focus-visible{outline:none}.landing-study .annotation:focus-visible .hit-area{stroke:white;stroke-width:1;stroke-dasharray:3 5}
.landing-study .brand{position:absolute;left:50%;top:4.3%;width:clamp(300px,30vw,470px);transform:translateX(-50%);pointer-events:none}.landing-study .brand h1{margin:0;line-height:0}.landing-study .brand img{display:block;width:100%;height:auto;filter:drop-shadow(0 1px 6px #0002)}.landing-study .edition{position:absolute;right:2.5%;top:2.2%;text-align:right;pointer-events:none}.landing-study .edition strong{display:block;font-family:'Surface Sans',sans-serif;font-size:clamp(20px,1.42vw,30px);letter-spacing:.1em}.landing-study .edition span{display:block;margin-top:9px;font-size:clamp(8px,.48vw,11px);letter-spacing:.18em}
.landing-study .replay{position:absolute;left:50%;transform:translateX(-50%);bottom:.5%;border:0;background:transparent;font-size:12px;font-weight:700;letter-spacing:.12em;cursor:pointer;padding:10px 0 10px 14px;text-shadow:0 1px 4px #0008;opacity:.82;transition:opacity .2s}.landing-study .replay:hover{opacity:1}.landing-study .replay span{font-size:18px;vertical-align:-1px;margin-right:8px}
.landing-study .start-video{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:16px 22px;border:1px solid #ffffff80;background:#1118;backdrop-filter:blur(12px);font-family:Arial,sans-serif;font-size:15px;cursor:pointer}.landing-study .start-video span{margin-left:16px}
.landing-study .drawing-footer{position:absolute;left:2.6%;right:2.6%;bottom:20px;border-top:1px solid #ffffff60;padding-top:10px;display:flex;justify-content:space-between;gap:120px;pointer-events:none;font-size:clamp(7px,.46vw,10px);letter-spacing:.08em;line-height:1.4}.landing-study .drawing-footer span:last-child{text-align:right}.landing-study .mobile-detail{display:none}.landing-study .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:-1px}
@keyframes surface-fade-in{from{opacity:0}to{opacity:1}}@keyframes surface-field-in{from{opacity:0}to{opacity:.85}}@keyframes surface-draw-line{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@media(max-width:760px){
 .landing-study.stage{display:flex;flex-direction:column;min-height:0;overflow:hidden}.landing-study .scene{width:100%;height:auto;aspect-ratio:16/9;min-height:0;max-height:none}.landing-study .canvas{inset:0;width:100%;height:100%;aspect-ratio:auto;transform:none}
 .landing-study .brand{left:50%;top:20px;width:clamp(220px,64vw,300px)}.landing-study .edition{right:22px;top:23px}.landing-study .edition strong{font-size:19px}.landing-study .edition span{display:none}.landing-study .replay{left:auto;right:22px;bottom:12px;transform:none;font-size:11px}
 .landing-study .drawing-footer,.landing-study .responsive-copy,.landing-study .floating-dimension,.landing-study .field>path,.landing-study .field>text,.landing-study .field>circle,.landing-study .field>g[transform],.landing-study .note-copy,.landing-study .leader{display:none!important}.landing-study .diagram .point text{font-size:20px;stroke-width:1}.landing-study .point circle{stroke-width:1.5}.landing-study .annotation{opacity:.52}.landing-study .annotation.active{opacity:1}.landing-study.is-focused .annotation{opacity:.35}.landing-study.is-focused .annotation.active{opacity:1}
 .landing-study .mobile-detail{display:block;width:100%;padding:0 23px 22px;height:min(252px,calc(var(--viewport-height,100dvh) * .5));min-height:0;flex-shrink:0;overflow-y:auto;border-top:1px solid #ffffff26;background:var(--paper)}.landing-study .note-nav{display:grid;grid-template-columns:repeat(8,1fr);gap:4px;border-bottom:1px solid #ffffff22}.landing-study .note-nav button{background:none;border:0;border-bottom:1px solid transparent;min-height:46px;padding:0;font-size:13px;opacity:.45;cursor:pointer}.landing-study .note-nav button[aria-pressed=true]{border-bottom-color:#fff;opacity:1}.landing-study .detail-copy{padding-top:18px}.landing-study .detail-kicker{font-family:Arial,sans-serif;font-size:11px;letter-spacing:.12em;color:#c0c4c0;margin:0 0 10px}.landing-study .detail-kicker span:first-child{font-family:'Surface Mono',monospace}.landing-study .detail-copy h2{font-size:16px;letter-spacing:.05em;margin:0 0 12px;line-height:1.45}.landing-study .detail-copy #surface-detail-body{font-family:Arial,sans-serif;font-size:14px;line-height:1.65;color:#d6dad6;overflow-wrap:anywhere}.landing-study .detail-copy #surface-detail-body p{margin:0}.landing-study .detail-copy.changing{animation:surface-fade-in .24s ease both}
}
@media(prefers-reduced-motion:reduce){.landing-study .ocean,.landing-study .annotation{transition:none}.landing-study.js .field,.landing-study.js .point,.landing-study.js .note-copy{opacity:1;animation:none}.landing-study.js .leader{stroke-dashoffset:0;animation:none}.landing-study .detail-copy.changing{animation:none}}

/* The study is a first viewport, with direct entry to the existing website. */
.landing-study .brand{pointer-events:auto;z-index:3}
.landing-study .brand a{display:block;line-height:0}
.landing-study a:focus-visible{outline:1px solid white;outline-offset:8px}
.landing-study .enter-site{position:absolute;bottom:19px;left:50%;transform:translateX(-50%);z-index:4;display:flex;align-items:center;gap:14px;padding:12px 18px;color:#fff;font-family:Arial,'Malgun Gothic',sans-serif;font-size:12px;letter-spacing:.04em;text-shadow:0 1px 5px #000;white-space:nowrap}
.landing-study .enter-site span{font-size:19px;transition:transform .25s}
.landing-study .enter-site:hover span{transform:translateY(3px)}
.landing-study .drawing-footer{bottom:20px;padding-bottom:0}
.landing-study .replay{left:auto;right:2.6%;bottom:57px;transform:none;font-size:10px}
@media(max-width:760px){
 .landing-study.stage{min-height:580px}
 .landing-study .replay{right:22px;bottom:12px}
 .landing-study .enter-site{bottom:max(15px,env(safe-area-inset-bottom))}
 .landing-study .brand{width:clamp(205px,60vw,300px)}
}
@media(max-width:760px) and (max-height:620px){
 .landing-study.stage{justify-content:flex-start;padding-bottom:62px;height:auto;min-height:100svh}
 .landing-study .mobile-detail{height:252px}
}

.landing-study .note-focus-frame{display:none;pointer-events:none}

/* Shared outlined wordmark, sized for each screen. */
:root{--desktop-wordmark-width:clamp(180px,18vw,282px);--desktop-wordmark-top:max(1.8svh,28px)}
.site-header .wordmark,.site-footer .wordmark,.menu-top .menu-wordmark{
  width:var(--desktop-wordmark-width);
  flex-shrink:0;
  font-size:0;
  line-height:0;
  letter-spacing:0;
}
.site-header .wordmark{color:#fff}
.site-header .wordmark>sup,.site-header .wordmark>span,
.site-footer .wordmark>sup,.site-footer .wordmark>span{display:none}
.site-header .wordmark::before,.site-footer .wordmark::before,.menu-top .menu-wordmark::before{
  content:'';
  display:block;
  width:100%;
  aspect-ratio:490 / 76;
  background:currentColor;
  -webkit-mask:url('/assets/pitched-hotel-wordmark.svg') center / contain no-repeat;
  mask:url('/assets/pitched-hotel-wordmark.svg') center / contain no-repeat;
}
@media(max-width:760px){
  .landing-study.stage{display:none}
  .site-header .wordmark,.menu-top .menu-wordmark{width:clamp(180px,54vw,230px)}
  .site-footer .wordmark{width:clamp(150px,43vw,210px);max-width:100%}
}

/* Desktop landing refinement. */
.landing-study .landing-statement{
  position:absolute;
  left:2.6%;
  bottom:76px;
  margin:0;
  color:#fff;
  font-family:var(--sans);
  font-size:clamp(15px,1.3vw,22px);
  font-weight:400;
  line-height:1.5;
  letter-spacing:-.035em;
  white-space:nowrap;
  pointer-events:none;
}
@media (min-width:761px){
  .landing-study .brand{
    left:2.6%;
    top:var(--desktop-wordmark-top);
    width:var(--desktop-wordmark-width);
    transform:none;
  }
  .site-header .wordmark{position:absolute;left:2.6%;top:var(--desktop-wordmark-top)}
  .site-header .desktop-nav,.site-header .menu-toggle{margin-left:auto}
  /* Selection boxes belong only to the opening landing. */
  body .landing-study :is(a,button,input,select,textarea,summary,[tabindex]):is(:focus,:focus-visible){
    outline:1px solid #fff;
    outline-offset:calc(5px + .5cm);
  }
  body .landing-study a:is(:focus,:focus-visible){outline-offset:calc(8px + .5cm)}
  /* Keep the opening logo and REPLAY free of pointer/focus boxes. */
  body .landing-study :is(.brand a,#surface-replay):is(:hover,:focus,:focus-visible){outline:none}
  /* Focus belongs to the explanation, not the full line running to the tent. */
  body .landing-study .annotation:is(:focus,:focus-visible){outline:none}
  .landing-study .annotation:is(:focus,:focus-visible) .note-focus-frame{display:block}
}

@media (min-width:761px){
  .landing-study .brand img{
    filter:none;
  }
  body :is(#home,#explore,#practice,.site-footer,dialog) :is(a,button,input,select,textarea,summary,[tabindex]):is(:focus,:focus-visible){
    outline:none;
  }
  /* Keep keyboard location visible without drawing a surrounding box. */
  body :is(#home,#explore,#practice,.site-footer,dialog) :is(a,button,summary):focus-visible{
    text-decoration:underline;
    text-underline-offset:5px;
    text-decoration-thickness:1px;
  }
  body :is(#home,#explore,#practice,.site-footer,dialog) :is(input,select,textarea):focus-visible{
    box-shadow:inset 0 -2px 0 currentColor;
  }
}

.footer-social{display:flex;align-items:center;gap:22px}
.footer-social a{font-size:9px;letter-spacing:.8px;white-space:nowrap}
.footer-social a:hover{text-decoration:underline;text-underline-offset:5px}
@media(max-width:650px){.footer-social{gap:16px}}

/* Match MATERIAL STUDY's rule and text ink edges on desktop. */
@media(min-width:761px){
 .landing-study .drawing-footer{inset:0;bottom:0;margin:0;padding:0;border:0;display:block;font-size:initial;line-height:normal}
 .landing-study .study-footer-diagram{display:block;width:100%;height:100%;overflow:visible}
}

/* Reuse study 02's outlined label and its 1920px design scale exactly. */
.landing-study .surface-edition-label{display:block;margin:9px 0 0 auto;width:5.13509422vw;height:auto;overflow:visible}