/* Approved paper hero. All resets and animation names are isolated to this island. */
.hb .hb-hero {
  font-family:var(--font-inter-tight),Arial,sans-serif;
  color:#f5efe6;
  background:#10142e;
  font-synthesis:none;
  --navy:#1d1f45;
  --ink:#17192f;
  --cream:#f5efe6;
  --yellow:#ffe26b
}
.hb .hb-hero * {
  box-sizing:border-box
}
.hb .hb-hero {
  margin:0
}
.hb .hb-hero button,.hb .hb-hero input {
  font:inherit
}
.hb .hb-hero button,.hb .hb-hero a,.hb .hb-hero input {
  -webkit-tap-highlight-color:transparent
}
.hb .hb-hero a {
  color:inherit
}
.hb .hb-hero button,.hb .hb-hero a {
  touch-action:manipulation
}
.hb .hb-hero button {
  cursor:pointer
}
.hb .hb-hero button:disabled {
  cursor:default
}
.hb .hb-hero button:focus-visible,.hb .hb-hero a:focus-visible,.hb .hb-hero input:focus-visible,.hb .hb-hero summary:focus-visible {
  outline:3px solid #ec4899;
  outline-offset:5px
}
.hb .hb-hero button {
  min-height:48px
}
.hb .hb-hero button:disabled {
  opacity:.7
}
.hb .hb-hero h1,.hb .hb-hero h2,.hb .hb-hero h3,.hb .hb-hero h4,.hb .hb-hero p,.hb .hb-hero figure {
  margin-top:0
}
.hb .hb-hero p {
  line-height:1.5
}
.hb .hb-hero img {
  max-width:100%;
  display:block
}
.hb .hb-hero summary {
  cursor:pointer;
  min-height:48px;
  padding:12px 0
}
.hb .hb-hero {
  scroll-padding-top:24px
}
.hb .hb-hero .sb-wrap {
  width:min(1180px,calc(100% - 96px));
  margin-inline:auto
}
.hb .hb-hero {
  position:relative;
  isolation:isolate;
  --camera-progress:0;
  background:#10142e
}
.hb .hb-hero .sb-art-track {
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none
}
.hb .hb-hero .sb-room {
  position:sticky;
  top:0;
  height:100svh;
  overflow:hidden;
  background:#121733
}
.hb .hb-hero .sb-room-art {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  transform:scale(calc(1 + var(--camera-progress)*.18)) translateY(calc(var(--camera-progress)*2%));
  transform-origin:58% 32%;
  will-change:transform
}
.hb .hb-hero .sb-room picture {
  display:block;
  width:100%;
  height:100%
}
.hb .hb-hero .sb-room img {
  width:100%;
  height:100%;
  object-fit:fill;
  object-position:50% 50%
}
.hb .hb-hero .sb-veil {
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(10,15,35,.7),rgba(13,18,40,.52));
  box-shadow:inset 0 -80px 80px -50px #10142e
}
.hb .hb-hero .sb-veil::after {
  content:"";
  position:absolute;
  inset:0;
  background:rgba(8,12,30,.36)
}
.hb .hb-hero .sb-distant-notes {
  position:absolute;
  left:35%;
  top:14%;
  width:15%;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:4.5%;
  opacity:calc(.34*(1 - var(--camera-progress)));
  filter:blur(.2px)
}
.hb .hb-hero .sb-distant-notes span {
  min-width:0;
  overflow:hidden;
  aspect-ratio:1;
  padding:5px;
  color:#1d1f45;
  font-size:clamp(2px,.25vw,4px);
  line-height:1.25;
  box-shadow:2px 3px 5px #080b1b
}
.hb .hb-hero .sb-header {
  width:min(1300px,calc(100% - 96px));
  margin-inline:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:24px 0;
  gap:24px
}
.hb .hb-hero .sb-brand {
  color:var(--yellow);
  width:170px;
  height:57px;
  fill:currentColor;
  flex-shrink:0
}
.hb .hb-hero .sb-brand-footer {
  color:var(--cream);
  width:130px;
  height:44px
}
.hb .hb-hero .sb-header nav {
  display:flex;
  align-items:center;
  gap:28px
}
.hb .hb-hero .sb-header nav>a {
  display:flex;
  align-items:center;
  min-height:48px;
  text-decoration:none;
  font-size:18px;
  font-weight:500
}
.hb .hb-hero .sb-primary {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  padding:18px 26px;
  background:var(--yellow);
  color:#17192f;
  border:0;
  text-decoration:none;
  font-size:22px;
  font-weight:800;
  min-height:60px;
  line-height:1.25;
  transition:background .16s ease
}
.hb .hb-hero .sb-primary:hover {
  background:#fff09b
}
.hb .hb-hero .sb-header .sb-primary {
  min-height:48px;
  font-size:18px;
  padding:14px 22px
}
.hb .hb-hero .sb-opening {
  min-height:max(670px,calc(100svh - 110px));
  padding-top:40px;
  padding-bottom:38px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:38px
}
.hb .hb-hero .sb-opening-copy {
  max-width:920px
}
.hb .hb-hero .sb-opening h1 {
  font-weight:800;
  letter-spacing:-.055em;
  font-size:clamp(48px,5.5vw,82px);
  line-height:1.05;
  margin-bottom:24px
}
.hb .hb-hero .sb-opening em {
  display:block;
  font-family:var(--font-marker),cursive;
  font-style:normal;
  font-weight:400;
  letter-spacing:0;
  line-height:1.24;
  color:var(--yellow);
  font-size:clamp(34px,3.6vw,54px);
  max-width:920px;
  margin-top:12px
}
.hb .hb-hero .sb-sub {
  max-width:655px;
  font-size:22px;
  line-height:1.55;
  margin-bottom:32px
}
.hb .hb-hero .sb-conversion {
  display:flex;
  align-items:flex-start;
  gap:34px
}
.hb .hb-hero .sb-fine {
  font-size:16px;
  margin:12px 0 0;
  color:#dadbe5
}
.hb .hb-hero .sb-qr {
  display:flex;
  align-items:center;
  gap:16px
}
.hb .hb-hero .sb-qr>a {
  display:block;
  line-height:0;
  flex-shrink:0;
  padding:5px;
  background:var(--cream)
}
.hb .hb-hero .sb-qr svg {
  width:104px;
  height:104px
}
.hb .hb-hero .sb-qr p {
  font-size:17px;
  line-height:1.4;
  margin:0;
  max-width:190px
}
.hb .hb-hero .sb-scroll {
  display:flex;
  flex-direction:column;
  align-items:center;
  align-self:center;
  text-decoration:none;
  font-size:16px;
  gap:2px;
  min-width:130px;
  min-height:48px
}
.hb .hb-hero .sb-scroll span {
  font-size:28px
}
.hb .hb-hero .sb-wall {
  padding-top:80px;
  padding-bottom:100px;
  scroll-margin-top:24px;
  min-height:80svh;
  overflow-anchor:none
}
.hb .hb-hero .sb-wall-intro {
  text-align:center;
  margin-bottom:46px
}
.hb .hb-hero .sb-wall h2 {
  font-size:clamp(36px,3.8vw,56px);
  letter-spacing:-.035em;
  line-height:1.1;
  margin-bottom:16px
}
.hb .hb-hero .sb-wall-intro>p {
  font-size:22px;
  margin-bottom:0
}
.hb .hb-hero .sb-notes {
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:24px;
  width:min(960px,100%);
  margin-inline:auto;
  align-items:start
}
.hb .hb-hero .sb-note {
  grid-column:span 3
}
.hb .hb-hero .sb-note:nth-child(n+5) {
  grid-column:span 4
}
.hb .hb-hero .sb-note>button {
  position:relative;
  display:block;
  border:0;
  padding:26px 24px 24px;
  background:var(--note);
  color:var(--ink);
  text-align:left;
  width:100%;
  min-height:205px;
  box-shadow:3px 8px 14px #080b1b80;
  font-size:22px;
  font-weight:500;
  line-height:1.3;
  transition:box-shadow .18s,transform .18s;
  transform:rotate(-1deg)
}
.hb .hb-hero .sb-note:nth-child(2n)>button {
  transform:rotate(1deg)
}
.hb .hb-hero .sb-note:nth-child(3n)>button {
  transform:rotate(-2deg)
}
.hb .hb-hero .sb-note>button:hover,.hb .hb-hero .sb-note>button[aria-expanded=true] {
  box-shadow:0 0 0 3px #f5efe6,4px 10px 16px #080b1b80
}
.hb .hb-hero .sb-plus {
  position:absolute;
  right:10px;
  top:6px;
  font-size:27px;
  font-weight:400
}
.hb .hb-hero .sb-answer {
  width:min(960px,100%);
  margin:42px auto 0;
  padding:32px;
  color:var(--ink);
  background:#fffdf8;
  border-top:8px solid var(--note);
  box-shadow:0 16px 60px #080b1b55;
  animation:hb-hero-sb-open .28s ease-out
}
.hb .hb-hero .sb-answer-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  margin-bottom:20px
}
.hb .hb-hero .sb-sample {
  font-size:15px;
  margin:0;
  color:#515469
}
.hb .hb-hero .sb-answer button:not(.sb-primary) {
  padding:10px 16px;
  border:1px solid #292d4f;
  background:#fffdf8;
  color:var(--ink);
  font-weight:700;
  line-height:1.3
}
.hb .hb-hero .sb-answer button:hover:not(:disabled):not(.sb-primary) {
  background:#eaeafa
}
.hb .hb-hero .sb-answer button[aria-pressed=true] {
  background:var(--note)
}
.hb .hb-hero .sb-answer-top button {
  border:0!important;
  background:transparent!important;
  text-decoration:underline
}
.hb .hb-hero .sb-answer h3 {
  font-size:clamp(28px,3vw,40px);
  line-height:1.12;
  letter-spacing:-.025em;
  max-width:760px;
  margin-bottom:18px
}
.hb .hb-hero .sb-recognition {
  color:#515469;
  font-size:19px;
  max-width:700px;
  margin-bottom:14px
}
.hb .hb-hero .sb-answer-copy {
  font-size:21px;
  max-width:720px;
  line-height:1.5;
  margin-bottom:24px
}
.hb .hb-hero .sb-example {
  padding:24px;
  background:var(--note);
  border:1px solid #1d1f4520
}
.hb .hb-hero .sb-photo {
  margin:0 0 18px
}
.hb .hb-hero .sb-photo img {
  height:200px;
  object-fit:contain;
  background:#fffdf8;
  width:100%
}
.hb .hb-hero .sb-photo figcaption {
  font-size:14px;
  margin-top:8px
}
.hb .hb-hero .sb-draft {
  background:#fffdf8;
  padding:24px
}
.hb .hb-hero .sb-draft h4 {
  font-size:24px;
  margin-bottom:12px
}
.hb .hb-hero .sb-price {
  font-size:36px;
  font-weight:800;
  margin:16px 0
}
.hb .hb-hero .sb-draft details {
  margin-bottom:16px
}
.hb .hb-hero .sb-draft details p {
  white-space:pre-line
}
.hb .hb-hero .sb-actions {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:16px 0
}
.hb .hb-hero .sb-example form {
  display:grid;
  gap:10px;
  width:min(480px,100%);
  margin-top:20px
}
.hb .hb-hero .sb-example label {
  font-weight:700
}
.hb .hb-hero .sb-example input {
  width:100%;
  min-width:0;
  border:1px solid #424664;
  min-height:48px;
  padding:12px;
  background:#fffdf8;
  color:var(--ink)
}
.hb .hb-hero .sb-example form button {
  justify-self:start
}
.hb .hb-hero .sb-feedback {
  font-size:17px;
  line-height:1.45;
  padding:16px;
  background:#fffdf8;
  border-left:3px solid #8b5cf6;
  margin:20px 0 0
}
.hb .hb-hero .sb-batch {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px
}
.hb .hb-hero .sb-batch article {
  padding:16px;
  background:#fffdf8
}
.hb .hb-hero .sb-batch img {
  height:130px;
  object-fit:contain;
  width:100%
}
.hb .hb-hero .sb-batch h4 {
  font-size:17px;
  line-height:1.3;
  margin:16px 0 8px
}
.hb .hb-hero .sb-batch p {
  font-size:22px;
  margin:0;
  font-weight:800
}
.hb .hb-hero .sb-proof {
  font-weight:800;
  font-size:22px;
  margin:22px 0 0
}
.hb .hb-hero .sb-mini-item {
  display:flex;
  align-items:center;
  gap:20px;
  margin-bottom:24px
}
.hb .hb-hero .sb-mini-item img {
  width:110px;
  height:100px;
  object-fit:contain;
  background:#fffdf8
}
.hb .hb-hero .sb-mini-item h4 {
  font-size:20px;
  line-height:1.3;
  margin:0;
  max-width:470px
}
.hb .hb-hero .sb-reason {
  max-width:580px
}
.hb .hb-hero .sb-queue {
  list-style:none;
  padding:0;
  margin:20px 0
}
.hb .hb-hero .sb-queue li {
  display:flex;
  align-items:center;
  gap:16px;
  padding:18px 16px;
  border-bottom:1px solid #1d1f4530;
  background:#fffdf8
}
.hb .hb-hero .sb-avatar {
  display:flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  background:#e7e7f0;
  font-weight:700;
  flex-shrink:0
}
.hb .hb-hero .sb-queue li>div {
  flex:1;
  min-width:0
}
.hb .hb-hero .sb-queue small {
  display:block;
  margin-top:4px;
  font-size:15px
}
.hb .hb-hero .sb-queue li>b {
  font-size:16px
}
.hb .hb-hero .sb-booking {
  padding:20px;
  background:#fffdf8
}
.hb .hb-hero .sb-address {
  display:flex;
  flex-direction:column;
  padding:18px 20px;
  margin-bottom:12px;
  background:#fffdf8;
  gap:6px
}
.hb .hb-hero .sb-address small {
  font-size:15px
}
.hb .hb-hero .sb-address strong {
  font-size:24px
}
.hb .hb-hero .sb-answer-bottom {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-top:24px
}
.hb .hb-hero .sb-answer-bottom .sb-primary {
  font-size:20px
}
.hb .hb-hero .sb-disclaimer {
  font-size:14px;
  color:#515469;
  margin:20px 0 0
}
.hb .hb-hero .sb-fallback details {
  margin-top:16px;
  padding:16px;
  background:#fffdf8;
  color:var(--ink)
}
.hb .hb-hero .sb-fallback summary {
  padding:16px
}
@keyframes hb-hero-sb-open {
  from {
  opacity:.6;
  transform:translateY(6px)
}
to {
  opacity:1;
  transform:translateY(0)
}

}

@media(min-width:1700px) {
  .hb .hb-hero .sb-wrap {
  width:1300px
}
.hb .hb-hero .sb-opening {
  padding-top:65px
}
.hb .hb-hero .sb-opening-copy {
  max-width:1020px
}
.hb .hb-hero .sb-sub {
  max-width:710px
}
.hb .hb-hero .sb-room img {
  object-position:center bottom
}

}

@media(max-width:1000px) {
  .hb .hb-hero .sb-header nav {
  gap:18px
}
.hb .hb-hero .sb-header nav>a {
  font-size:16px
}
.hb .hb-hero .sb-notes {
  gap:20px
}
.hb .hb-hero .sb-note>button {
  font-size:19px;
  padding:24px 18px;
  min-height:205px
}
.hb .hb-hero .sb-sub {
  font-size:21px
}
.hb .hb-hero .sb-conversion {
  gap:24px
}
.hb .hb-hero .sb-qr p {
  font-size:16px
}
.hb .hb-hero .sb-qr svg {
  width:96px;
  height:96px
}

}

@media(max-width:780px) {
  .hb .hb-hero .sb-wrap,.hb .hb-hero .sb-header {
  width:calc(100% - 40px)
}
.hb .hb-hero .sb-header {
  padding:16px 0;
  gap:12px
}
.hb .hb-hero .sb-header nav { gap:8px; }
.hb .hb-hero .sb-brand {
  width:132px;
  height:44px
}
.hb .hb-hero .sb-header nav>a:not(.sb-primary) {
  display:none
}
.hb .hb-hero .sb-header .sb-primary {
  font-size:16px;
  padding:12px 16px
}
.hb .hb-hero .sb-room-art {
  transform:none;
  will-change:auto
}
.hb .hb-hero .sb-room img {
  object-fit:fill;
  object-position:center bottom
}
.hb .hb-hero .sb-veil {
  background:rgba(10,15,35,.63)
}
.hb .hb-hero .sb-distant-notes {
  display:none
}
.hb .hb-hero .sb-opening {
  min-height:0;
  padding-top:36px;
  padding-bottom:20px;
  gap:clamp(96px,18vw,140px)
}
.hb .hb-hero .sb-opening h1 {
  font-size:clamp(34px,9vw,48px);
  letter-spacing:-.045em;
  margin-bottom:20px
}
.hb .hb-hero .sb-opening em {
  font-size:clamp(26px,6.3vw,36px);
  margin-top:12px;
  line-height:1.24
}
.hb .hb-hero .sb-sub {
  font-size:clamp(18px,4.3vw,20px);
  line-height:1.45;
  margin-bottom:24px
}
.hb .hb-hero .sb-conversion {
  display:block
}
.hb .hb-hero .sb-opening .sb-primary {
  font-size:19px;
  padding:16px 20px;
  min-height:56px;
  max-width:100%
}
.hb .hb-hero .sb-fine {
  font-size:15px;
  margin-top:10px
}
.hb .hb-hero .sb-qr {
  display:none
}
.hb .hb-hero .sb-scroll {
  font-size:15px
}
.hb .hb-hero .sb-wall {
  padding-top:36px;
  padding-bottom:40px;
  min-height:0
}
.hb .hb-hero .sb-wall-intro {
  text-align:left;
  margin-bottom:28px
}
.hb .hb-hero .sb-wall h2 {
  font-size:clamp(30px,7.8vw,38px);
  line-height:1.1;
  margin-bottom:12px
}
.hb .hb-hero .sb-wall-intro>p {
  font-size:19px
}
.hb .hb-hero .sb-notes {
  display:flex;
  flex-direction:column;
  gap:14px;
  width:100%
}
.hb .hb-hero .sb-note {
  width:100%
}
.hb .hb-hero .sb-note>button,.hb .hb-hero .sb-note:nth-child(2n)>button,.hb .hb-hero .sb-note:nth-child(3n)>button {
  transform:none;
  min-height:88px;
  padding:20px 44px 20px 20px;
  font-size:20px;
  box-shadow:0 3px 8px #080b1b60;
  line-height:1.4
}
.hb .hb-hero .sb-plus {
  top:20px;
  right:14px
}
.hb .hb-hero .sb-answer {
  width:100%;
  margin:14px 0 4px;
  padding:20px 16px;
  border-top-width:6px;
  box-shadow:none
}
.hb .hb-hero .sb-answer-top {
  align-items:start;
  gap:8px;
  margin-bottom:20px
}
.hb .hb-hero .sb-sample {
  font-size:14px;
  max-width:80px
}
.hb .hb-hero .sb-answer-top button {
  font-size:15px;
  padding:4px 0!important;
  white-space:nowrap
}
.hb .hb-hero .sb-answer h3 {
  font-size:28px;
  line-height:1.15;
  margin-bottom:18px
}
.hb .hb-hero .sb-recognition {
  font-size:17px
}
.hb .hb-hero .sb-answer-copy {
  font-size:19px;
  margin-bottom:22px
}
.hb .hb-hero .sb-example {
  padding:16px 12px
}
.hb .hb-hero .sb-photo img {
  height:165px
}
.hb .hb-hero .sb-draft {
  padding:16px 12px
}
.hb .hb-hero .sb-draft h4 {
  font-size:20px
}
.hb .hb-hero .sb-draft p {
  font-size:17px
}
.hb .hb-hero .sb-example button {
  width:100%;
  font-size:16px
}
.hb .hb-hero .sb-example-action.sb-primary {
  font-size:18px
}
.hb .hb-hero .sb-actions {
  gap:10px
}
.hb .hb-hero .sb-feedback {
  font-size:16px;
  padding:14px 12px
}
.hb .hb-hero .sb-batch {
  grid-template-columns:1fr;
  gap:12px
}
.hb .hb-hero .sb-batch article {
  display:grid;
  grid-template-columns:75px 1fr;
  gap:4px 12px;
  padding:12px
}
.hb .hb-hero .sb-batch img {
  width:75px;
  height:75px;
  grid-row:span 2
}
.hb .hb-hero .sb-batch h4 {
  font-size:15px;
  margin:0
}
.hb .hb-hero .sb-batch p {
  font-size:20px
}
.hb .hb-hero .sb-mini-item {
  gap:12px;
  margin-bottom:20px
}
.hb .hb-hero .sb-mini-item img {
  width:76px;
  height:84px;
  flex-shrink:0
}
.hb .hb-hero .sb-mini-item h4 {
  font-size:17px
}
.hb .hb-hero .sb-queue li {
  gap:10px;
  padding:14px 10px
}
.hb .hb-hero .sb-avatar {
  width:30px;
  height:30px;
  font-size:15px
}
.hb .hb-hero .sb-queue li>b {
  font-size:14px
}
.hb .hb-hero .sb-queue small {
  font-size:13px
}
.hb .hb-hero .sb-address {
  padding:16px 12px
}
.hb .hb-hero .sb-address strong {
  font-size:22px
}
.hb .hb-hero .sb-address small {
  font-size:14px
}
.hb .hb-hero .sb-answer-bottom {
  display:block
}
.hb .hb-hero .sb-answer-bottom .sb-primary {
  font-size:18px;
  width:100%;
  padding:18px 12px
}
.hb .hb-hero .sb-answer-bottom button {
  margin-top:14px;
  width:100%
}
.hb .hb-hero .sb-disclaimer {
  font-size:14px
}

}

@media(max-width:360px) {
  .hb .hb-hero .sb-wrap,.hb .hb-hero .sb-header {
  width:calc(100% - 32px)
}
.hb .hb-hero .sb-brand {
  width:118px;
  height:40px
}
.hb .hb-hero .sb-header .sb-primary {
  font-size:15px;
  padding:12px
}
.hb .hb-hero .sb-opening h1 {
  font-size:34px
}
.hb .hb-hero .sb-opening em {
  font-size:26px
}
.hb .hb-hero .sb-sub {
  font-size:18px
}
.hb .hb-hero .sb-opening .sb-primary {
  font-size:18px
}
.hb .hb-hero .sb-wall h2 {
  font-size:30px
}

.hb .hb-hero .sb-note>button {
  font-size:19px
}
.hb .hb-hero .sb-answer {
  padding:18px 12px
}
.hb .hb-hero .sb-example {
  padding:14px 10px
}
.hb .hb-hero .sb-answer-top button {
  font-size:14px
}
.hb .hb-hero .sb-photo img {
  height:150px
}

}

@media(min-width:781px) and (max-width:1100px) {
  .hb .hb-hero .sb-opening { min-height:0; gap:clamp(112px,15vw,160px); padding-block:32px; }
  .hb .hb-hero .sb-notes { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
  .hb .hb-hero .sb-note,.hb .hb-hero .sb-note:nth-child(n+5) { grid-column:auto; }
  .hb .hb-hero .sb-note:last-child { grid-column:1/-1; }
  .hb .hb-hero .sb-note>button { min-height:155px; }
  .hb .hb-hero .sb-wall { padding-top:64px; }
}
@media(max-width:1100px) {
  .hb .hb-hero .sb-opening h1,.hb .hb-hero .sb-opening em,.hb .hb-hero .sb-wall h2 { text-wrap:balance; }
}
@media(max-width:480px) {
  .hb .hb-hero .sb-brand { width:118px; height:40px; }
  .hb .hb-hero .sb-header .sb-primary { font-size:15px; padding:12px; }
  .hb .hb-hero .sb-opening .sb-primary { width:100%; }
}

@media(prefers-reduced-motion:reduce) {
  .hb .hb-hero *,.hb .hb-hero *::before,.hb .hb-hero *::after {
  animation:none!important;
  transition:none!important
}
.hb .hb-hero .sb-room-art {
  transform:none;
  will-change:auto
}
.hb .hb-hero .sb-distant-notes {
  display:none
}

}


.hb .hb-hero .sb-brand {
  --logo-ink:currentColor;
  --logo-dot:#ec4899
}



.hb .hb-hero .sb-notes {
  display:none
}
.hb .hb-hero .sb-wall.is-enhanced .sb-notes {
  display:grid
}
@media(max-width:780px) {
  .hb .hb-hero .sb-wall.is-enhanced .sb-notes {
  display:flex
}

}



.hb .hb-hero .ps-scene {
  position:absolute;
  inset:0;
  overflow:hidden;
  isolation:isolate;
}
.hb .hb-hero .ps-wall {
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,#1a2543 0%,#17213d 73%,#111b34 74%,#0d152c 100%);
}
.hb .hb-hero .ps-wall::after {
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(ellipse at 64% 68%,transparent 20%,#080f2580 100%);
}
.hb .hb-hero .ps-camera { z-index:0; overflow:visible; isolation:isolate; }
.hb .hb-hero .ps-object { position:absolute; filter:brightness(.55) drop-shadow(1px 5px 5px #050a1a80); }
.hb .hb-hero .sb-room .ps-object img,.hb .hb-hero .ps-drawing { width:100%; height:100%; object-fit:contain; object-position:center bottom; }
.hb .hb-hero .ps-right { z-index:1; }
.hb .hb-hero .ps-left { z-index:2; }
.hb .hb-hero .ps-dog { z-index:3; }
.hb .hb-hero .ps-cat { z-index:4; }
.hb .hb-hero .ps-laptop { z-index:3; }
.hb .hb-hero .ps-dog-body { position:absolute; inset:0; }
.hb .hb-hero .ps-dog-tail {
  position:absolute;
  width:57%;
  height:35%;
  left:-49%;
  bottom:5%;
  transform-origin:94% 67%;
  animation:hb-hero-paper-tail 22s linear infinite;
}
.hb .hb-hero .ps-cat-puppet {
  width:100%;
  height:100%;
  transform-origin:50% 98%;
  animation:hb-hero-paper-cat 24s linear infinite;
}
.hb .hb-hero .is-still .ps-cat-puppet,.hb .hb-hero .is-still .ps-dog-tail { animation-play-state:paused; }
.hb .hb-hero .sb-room-motion .sb-veil { z-index:1; }
.hb .hb-hero .sb-room-motion .sb-veil::after { background:rgba(8,12,30,.44); }
.hb .hb-hero .ps-mobile-pause { display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; width:44px; min-height:48px; padding:0; border:1px solid #70768c; background:transparent; color:#f5efe6; }
@keyframes hb-hero-paper-tail {
  0%,31%,43%,100% { transform:rotate(0); }
  33%,37%,41% { transform:rotate(-14deg); }
  35%,39% { transform:rotate(9deg); }
}
@keyframes hb-hero-paper-cat {
  0%,11%,100% { transform:translate(0,0) rotate(0) scale(1,1); }
  12% { transform:translate(0,0) rotate(0) scale(1.06,.86); animation-timing-function:ease-out; }
  14% { transform:translate(calc(var(--hop-x)*.46),calc(var(--hop-y)*.46 - var(--hop-arc))) rotate(-9deg) scale(1.08,.95); animation-timing-function:ease-in; }
  16% { transform:translate(var(--hop-x),var(--hop-y)) rotate(0) scale(1.06,.9); }
  17%,57% { transform:translate(var(--hop-x),var(--hop-y)) rotate(0) scale(1,1); }
  58% { transform:translate(var(--hop-x),var(--hop-y)) rotate(0) scale(1.06,.86); animation-timing-function:ease-out; }
  60% { transform:translate(calc(var(--hop-x)*.48),calc(var(--hop-y)*.48 - var(--hop-arc))) rotate(8deg) scale(1.08,.95); animation-timing-function:ease-in; }
  62% { transform:translate(0,0) rotate(0) scale(1.06,.9); }
  63% { transform:translate(0,0) rotate(0) scale(1,1); }
}
@media(prefers-reduced-motion:reduce) {
  .hb .hb-hero .ps-cat-puppet,.hb .hb-hero .ps-dog-tail { animation:none!important; transform:none!important; }
}

.hb .hb-hero .ps-wall-notes {
  position:absolute;
  z-index:6;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-rows:repeat(2,minmax(0,1fr));
  gap:5%;
  transform:skewY(-4deg);
  filter:brightness(.7);
  opacity:calc(.92 * (1 - var(--camera-progress)));
}
.hb .hb-hero .ps-wall-notes span {
  min-width:0;
  overflow:hidden;
  padding:2px;
  color:#1d2841;
  font-size:clamp(1.7px,.24vw,3.8px);
  line-height:1.15;
  box-shadow:1px 2px 3px #050a24a0;
  transform:rotate(-1.5deg);
}
.hb .hb-hero .ps-wall-notes span:nth-child(even) { transform:rotate(1.7deg); }
.hb .hb-hero .ps-scene[data-scene-mode="artwork"] .ps-camera {
  transform-origin:var(--camera-x) var(--camera-y);
  transform:translate3d(calc(var(--camera-progress) * var(--camera-pan-x)),calc(var(--camera-progress) * var(--camera-pan-y)),0) scale(calc(1 + var(--camera-progress) * .4));
}
@media(max-width:1100px) {
  .hb .hb-hero .ps-scene[data-scene-mode="artwork"] .ps-camera { transform:translate3d(calc(var(--camera-progress) * var(--camera-pan-x) * .7),calc(var(--camera-progress) * var(--camera-pan-y) * .7),0) scale(calc(1 + var(--camera-progress) * .2)); }
}
@media(max-width:780px) {
  .hb .hb-hero .ps-scene[data-scene-mode="artwork"] .ps-camera { transform:translate3d(calc(var(--camera-progress) * var(--camera-pan-x) * .45),calc(var(--camera-progress) * var(--camera-pan-y) * .45),0) scale(calc(1 + var(--camera-progress) * .12)); }
}
.hb .hb-hero .ps-cat-refined .ps-cat-puppet { animation-name:hb-hero-paper-cat-refined; }
.hb .hb-hero .ps-cat-figure { position:relative; width:100%; height:100%; transform-origin:50% 50%; transform:scaleX(1); animation:hb-hero-paper-cat-facing 24s steps(1,end) infinite; }
.hb .hb-hero .ps-cat-pose { position:absolute; inset:0; animation-duration:24s; animation-timing-function:steps(1,end); animation-iteration-count:infinite; }
.hb .hb-hero .ps-cat-rest { animation-name:hb-hero-paper-cat-rest; }
.hb .hb-hero .ps-cat-crouch { opacity:0; animation-name:hb-hero-paper-cat-crouch; }
.hb .hb-hero .ps-cat-air { opacity:0; left:-12%; width:124%; animation-name:hb-hero-paper-cat-air; }
.hb .hb-hero .ps-cat-shadow { position:absolute; z-index:2; border-radius:50%; background:#020718; filter:blur(2px); transform-origin:center; animation-duration:24s; animation-iteration-count:infinite; animation-timing-function:linear; }
.hb .hb-hero .ps-shadow-high { animation-name:hb-hero-paper-shadow-high; }
.hb .hb-hero .ps-shadow-low { opacity:0; animation-name:hb-hero-paper-shadow-low; }
.hb .hb-hero .ps-inquiries { position:absolute; inset:0; z-index:2; width:100%; height:100%; overflow:hidden; pointer-events:none; opacity:0; }
.hb .hb-hero .ps-inquiries[data-ready="true"] { opacity:1; }
.hb .hb-hero .ps-inquiry { opacity:0; transform-origin:0 0; animation:hb-hero-paper-inquiry 78s linear infinite both; }
.hb .hb-hero .ps-inquiry-bubble { transform-origin:0 -28px; filter:drop-shadow(0 3px 4px #050a2440); animation:hb-hero-paper-inquiry-pop 78s linear infinite both; }
.hb .hb-hero .ps-flood { position:absolute; inset:0; z-index:3; overflow:hidden; pointer-events:none; mask-size:100% 100%; mask-repeat:no-repeat; }
.hb .hb-hero .ps-flood-inquiry { position:absolute; width:208px; height:60px; opacity:0; transform-origin:104px 26px; will-change:transform,opacity; animation:hb-hero-bubble-avalanche 5.5s ease-out both; }
.hb .hb-hero .ps-flood-inquiry svg { display:block; width:100%; height:100%; }
.hb .hb-hero .ps-cat-alert { position:relative; width:100%; height:100%; transform-origin:50% 98%; }
.hb .hb-hero .ps-cat-alert-eye { position:absolute; inset:0; width:100%; height:100%; }
.hb .hb-hero .ps-dog-alert-pose { position:absolute; inset:0; width:100%; height:100%; }
.hb .hb-hero .ps-dog-alert-head { transform-origin:280px 150px; animation:hb-hero-dog-alert 6s ease-out both; }
.hb .hb-hero .is-cat-away .ps-cat-alert { will-change:transform; animation:hb-hero-cat-escape var(--cat-escape-duration,10s) linear both; }
.hb .hb-hero .is-cat-away .ps-cat-figure,.hb .hb-hero .is-cat-away .ps-cat-shadow { visibility:hidden; }
.hb .hb-hero .is-cat-away .ps-cat-puppet,.hb .hb-hero .is-cat-away .ps-cat-figure,.hb .hb-hero .is-cat-away .ps-cat-pose,.hb .hb-hero .is-cat-away .ps-cat-shadow { animation-play-state:paused; }
.hb .hb-hero .ps-cat-flee-figure { position:absolute; inset:0; width:100%; height:100%; animation:hb-hero-cat-escape-facing var(--cat-escape-duration,10s) steps(1,end) both; }
.hb .hb-hero .ps-cat-flee-pose { position:absolute; inset:0; animation-duration:var(--cat-escape-duration,10s); animation-timing-function:steps(1,end); animation-fill-mode:both; }
.hb .hb-hero .ps-cat-flee-rest { animation-name:hb-hero-cat-escape-rest; }
.hb .hb-hero .ps-cat-flee-crouch { opacity:0; animation-name:hb-hero-cat-escape-crouch; }
.hb .hb-hero .ps-cat-flee-air { opacity:0; left:-12%; width:124%; animation-name:hb-hero-cat-escape-air; }
.hb .hb-hero .is-startled .ps-dog-body { opacity:0; }
.hb .hb-hero .is-startled .ps-inquiry { visibility:hidden; }
.hb .hb-hero .is-startled .ps-cat-puppet,.hb .hb-hero .is-startled .ps-cat-figure,.hb .hb-hero .is-startled .ps-cat-pose,.hb .hb-hero .is-startled .ps-cat-shadow,.hb .hb-hero .is-startled .ps-dog-tail { animation-play-state:paused; }
.hb .hb-hero .is-still .ps-flood-inquiry,.hb .hb-hero .is-still .ps-cat-alert,.hb .hb-hero .is-still .ps-dog-alert-head { animation-play-state:paused; }
.hb .hb-hero .is-still .ps-cat-flee-figure,.hb .hb-hero .is-still .ps-cat-flee-pose { animation-play-state:paused; }
.hb .hb-hero .is-still .ps-cat-figure,.hb .hb-hero .is-still .ps-cat-pose,.hb .hb-hero .is-still .ps-cat-shadow,.hb .hb-hero .is-still .ps-inquiry,.hb .hb-hero .is-still .ps-inquiry-bubble { animation-play-state:paused; }

@keyframes hb-hero-bubble-avalanche {
  0% { opacity:0; transform:translate(0,0) rotate(0) scale(.45); }
  3% { opacity:.67; transform:translate(4px,-6px) rotate(var(--flood-angle)) scale(.85); }
  22% { opacity:.67; transform:translate(var(--flood-x),var(--flood-y)) rotate(var(--flood-angle)) scale(var(--flood-scale)); }
  72% { opacity:.62; transform:translate(calc(var(--flood-x) + var(--flood-drift)),calc(var(--flood-y) - 16px)) rotate(var(--flood-angle)) scale(var(--flood-scale)); }
  100% { opacity:0; transform:translate(calc(var(--flood-x) + var(--flood-drift)*1.5),calc(var(--flood-y) - 46px)) rotate(var(--flood-angle)) scale(var(--flood-scale)); }
}
@keyframes hb-hero-cat-escape {
  0%,100% { transform:translate(0,0) rotate(0) scale(1); }
  3% { transform:translate(0,0) rotate(0) scale(1.03,.88); animation-timing-function:cubic-bezier(.2,.6,.4,1); }
  6% { transform:translate(calc(var(--cat-escape-x)*.42),calc(var(--cat-escape-y)*.6)) rotate(-7deg) scale(1.04,1); }
  11%,79% { transform:translate(var(--cat-escape-x),var(--cat-escape-y)) rotate(0) scale(1); }
  83% { transform:translate(calc(var(--cat-escape-x)*.94),calc(var(--cat-escape-y)*.8)) rotate(4deg) scale(1); animation-timing-function:cubic-bezier(.5,0,.8,.4); }
  91% { transform:translate(calc(var(--cat-escape-x)*.16),calc(var(--cat-escape-y)*.22)) rotate(5deg) scale(1); }
  94% { transform:translate(0,0) rotate(0) scale(1.02,.94); }
  97% { transform:translate(0,0) rotate(0) scale(1); }
}
@keyframes hb-hero-cat-escape-facing { 0%,100% { transform:scaleX(1); } 3% { transform:scaleX(-1); } 79% { transform:scaleX(1); } }
@keyframes hb-hero-cat-escape-rest { 0%,2.9%,96%,100% { opacity:1; } 3%,95.9% { opacity:0; } }
@keyframes hb-hero-cat-escape-crouch { 0%,2.9%,6%,92.9%,96%,100% { opacity:0; } 3%,5.9%,93%,95.9% { opacity:1; } }
@keyframes hb-hero-cat-escape-air { 0%,5.9%,93%,100% { opacity:0; } 6%,92.9% { opacity:1; } }
@keyframes hb-hero-dog-alert {
  0%,100% { transform:rotate(0); }
  10% { transform:rotate(-22deg); }
  18%,78% { transform:rotate(-17deg); }
}

@keyframes hb-hero-paper-cat-refined {
  0%,10.5%,100% { transform:translate(0,0) rotate(0) scale(1,1); }
  12% { transform:translate(0,0) rotate(-1deg) scale(1.01,.98); animation-timing-function:cubic-bezier(.2,.65,.35,1); }
  13.5% { transform:translate(calc(var(--hop-x)*.45),calc(var(--hop-y)*.45 - var(--hop-arc))) rotate(-5deg) scale(1,1); animation-timing-function:cubic-bezier(.55,0,.8,.3); }
  15% { transform:translate(var(--hop-x),var(--hop-y)) rotate(0) scale(1.02,.97); }
  16%,57.5% { transform:translate(var(--hop-x),var(--hop-y)) rotate(0) scale(1,1); }
  58.5% { transform:translate(var(--hop-x),var(--hop-y)) rotate(1deg) scale(1.01,.98); animation-timing-function:cubic-bezier(.2,.65,.35,1); }
  59.5% { transform:translate(calc(var(--hop-x)*.48),calc(var(--hop-y)*.48 - var(--hop-arc))) rotate(5deg) scale(1,1); animation-timing-function:cubic-bezier(.55,0,.8,.3); }
  61% { transform:translate(0,0) rotate(0) scale(1.02,.97); }
  62% { transform:translate(0,0) rotate(0) scale(1,1); }
}
@keyframes hb-hero-paper-cat-facing {
  0%,16%,62%,100% { transform:scaleX(1); }
  10.5% { transform:scaleX(var(--cat-facing-start,1)); }
  57.5% { transform:scaleX(var(--cat-facing-return,-1)); }
}
@keyframes hb-hero-paper-cat-rest { 0%,16%,62%,100% { opacity:1; } 10.5%,57.5% { opacity:0; } }
@keyframes hb-hero-paper-cat-crouch { 0%,12.1%,16%,58.6%,62%,100% { opacity:0; } 10.5%,14.8%,57.5%,60.8% { opacity:1; } }
@keyframes hb-hero-paper-cat-air { 0%,14.8%,60.8%,100% { opacity:0; } 12.1%,58.6% { opacity:1; } }
@keyframes hb-hero-paper-shadow-high { 0%,10.5%,62%,100% { opacity:.45; transform:scale(1); } 12%,61% { opacity:.32; transform:scale(.8); } 13.5%,16%,57.5%,59.5% { opacity:0; transform:scale(.6); } }
@keyframes hb-hero-paper-shadow-low { 0%,12%,62%,100% { opacity:0; transform:scale(.6); } 15%,58.5% { opacity:.32; transform:scale(.8); } 16%,57.5% { opacity:.45; transform:scale(1); } 59.5%,61% { opacity:0; transform:scale(.6); } }
@keyframes hb-hero-paper-inquiry {
  0% { opacity:0; transform:translate(0,0) rotate(var(--message-angle)); }
  .25% { opacity:.67; transform:translate(8px,-6px) rotate(var(--message-angle)); }
  3% { opacity:.62; transform:translate(calc(var(--message-x)*.52),calc(var(--message-y)*.16 + var(--message-stack)*.35)) rotate(var(--message-angle)); }
  6% { opacity:.62; transform:translate(calc(var(--message-x)*.88),calc(var(--message-y)*.34 + var(--message-stack)*.7)) rotate(var(--message-angle)); }
  12% { opacity:.6; transform:translate(calc(var(--message-x)*.98),calc(var(--message-y)*.65 + var(--message-stack)*.5)) rotate(var(--message-angle)); }
  17% { opacity:.46; transform:translate(var(--message-x),calc(var(--message-y)*.96 + var(--message-stack)*.1)) rotate(var(--message-angle)); }
  18%,100% { opacity:0; transform:translate(var(--message-x),var(--message-y)) rotate(var(--message-angle)); }
}
@keyframes hb-hero-paper-inquiry-phone {
  0% { opacity:0; transform:translate(0,0) rotate(var(--message-angle)); }
  .25% { opacity:.67; transform:translate(3px,-6px) rotate(var(--message-angle)); }
  3% { opacity:.62; transform:translate(calc(var(--message-x)*.25),calc(var(--message-y)*.13 + var(--message-stack)*.2)) rotate(var(--message-angle)); }
  12% { opacity:.6; transform:translate(calc(var(--message-x)*.8),calc(var(--message-y)*.68 + var(--message-stack)*.1)) rotate(var(--message-angle)); }
  17% { opacity:.46; transform:translate(var(--message-x),calc(var(--message-y)*.96 + var(--message-stack)*.04)) rotate(var(--message-angle)); }
  18%,100% { opacity:0; transform:translate(var(--message-x),var(--message-y)) rotate(var(--message-angle)); }
}
@keyframes hb-hero-paper-inquiry-pop {
  0%,100% { transform:scale(.72); }
  .25% { transform:scale(1.06); }
  .5%,18% { transform:scale(1); }
}
@media(max-width:780px) { .hb .hb-hero .ps-inquiry { animation-name:hb-hero-paper-inquiry-phone; } }
@media(prefers-reduced-motion:reduce) {
  .hb .hb-hero .ps-scene[data-scene-mode="artwork"] .ps-camera { transform:none; }
  .hb .hb-hero .ps-cat-figure,.hb .hb-hero .ps-cat-pose,.hb .hb-hero .ps-cat-shadow,.hb .hb-hero .ps-inquiry,.hb .hb-hero .ps-inquiry-bubble { animation:none!important; }
  .hb .hb-hero .ps-cat-rest { opacity:1; }
  .hb .hb-hero .ps-cat-crouch,.hb .hb-hero .ps-cat-air,.hb .hb-hero .ps-inquiry,.hb .hb-hero .ps-shadow-low { opacity:0!important; }
  .hb .hb-hero .ps-shadow-high { opacity:.45; }
  .hb .hb-hero .ps-flood-inquiry,.hb .hb-hero .ps-cat-alert,.hb .hb-hero .ps-dog-alert-head { animation:none!important; }
  .hb .hb-hero .ps-flood-inquiry { display:none; }
  .hb .hb-hero .ps-cat-flee-figure { display:none; }
  .hb .hb-hero .ps-cat-alert { transform:none!important; }
  .hb .hb-hero .is-cat-away .ps-cat-figure,.hb .hb-hero .is-cat-away .ps-cat-shadow { visibility:visible; }
}

.hb .hb-hero .sb-brand-label{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
.hb .hb-hero .ps-wall picture{position:relative;}
.hb .hb-hero :where(h1,h2,h3,h4){font-weight:700;}
.hb .hb-hero h1{font-weight:800;}

/* Keep the choices and the opened module's heading together on short desktops. */
@media(min-width:781px) and (max-height:850px) {
  .hb .hb-hero .sb-wall-intro { margin-bottom:20px; }
  .hb .hb-hero .sb-note>button { min-height:130px; padding:18px; font-size:19px; }
  .hb .hb-hero .sb-answer { margin-top:24px; padding:24px; }
}
@media(min-width:781px) and (max-width:1100px) and (max-height:850px) {
  .hb .hb-hero .sb-notes { grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
  .hb .hb-hero .sb-note,.hb .hb-hero .sb-note:nth-child(n+5) { grid-column:auto; }
  .hb .hb-hero .sb-note:last-child { grid-column:1/-1; }
  .hb .hb-hero .sb-note:last-child>button { min-height:64px; }
}

/* Phones: the whole room scene (wall, furniture, cat, dog, bubbles and the
   dark veil) 25% brighter. The hero text sits outside .ps-scene and is unchanged. */
@media(max-width:780px) {
  .hb .hb-hero .ps-scene { filter:brightness(1.25); }
}
