
:root {
  --paper:    #F5F1E6;
  --paper-2:  #EFEADB;
  --paper-3:  #E7E0CD;
  --ink:      #16130F;
  --ink-soft: #3A342C;
  --muted:    #7C7566;
  --signal:   #FF4A1C;
  --accent:   #8B5CF6;
  --line:     rgba(22, 19, 15, .16);

  --fs-hero:   clamp(4rem, 15vw, 11rem);
  --fs-h2-big: clamp(2.1rem, 6vw, 4.6rem);
  --fs-h2:     clamp(1.8rem, 4.4vw, 3.2rem);
  --fs-h3:     clamp(1.25rem, 2.5vw, 1.9rem);
  --fs-lead:   clamp(1.02rem, 1.1rem + .45vw, 1.4rem);

  --sans: "Inter", "Helvetica Neue", Helvetica, "Segoe UI", Arial, system-ui, sans-serif;
  --mono: ui-monospace, "SFMono-Regular", "SF Mono", Menlo, Consolas, "Roboto Mono", monospace;

  --grad: linear-gradient(158deg, #D7AAF1 0%, #FD9868 100%);
  --hero-ink: #1E1E1E;

  --nav-h: calc(6.75rem + env(safe-area-inset-bottom, 0px));
  --wrap: 1120px;
  --pad:  clamp(1.25rem, 5vw, 4rem);
  --ease: cubic-bezier(.2, .7, .2, 1);
}

* { box-sizing: border-box; }

html, body {
  height: 100%;
  margin: 0;
  overflow: hidden;
}

html { -webkit-text-size-adjust: 100%; }

body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 450;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .5;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.35'/%3E%3C/svg%3E");
}

img { max-width: 100%; display: block; }
[hidden] { display: none !important; }
a { color: inherit; }

::selection { background: var(--signal); color: var(--paper); }

:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
  border-radius: 2px;
}

.skip {
  position: fixed;
  top: .5rem; left: .5rem;
  z-index: 200;
  transform: translateY(-160%);
  background: var(--ink);
  color: var(--paper);
  padding: .6rem 1rem;
  border-radius: 8px;
  font: 600 .9rem/1 var(--sans);
  text-decoration: none;
  transition: transform .2s var(--ease);
}
.skip:focus-visible { transform: none; }

.vh {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.deck {
  position: fixed;
  inset: 0;
  z-index: 2;
}

.slide {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  background: var(--paper);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.slide.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.slide--tint { background: var(--paper-2); }
.slide--dark {
  background: var(--ink);
  color: var(--paper);
}
.slide--dark .sec__num b { color: #FF7A54; }
.slide--dark .dim { color: rgba(245, 241, 230, .55); }
.slide--dark .arrowlink { color: var(--paper); }
.slide--dark ::selection { background: var(--paper); color: var(--ink); }

.slide .wrap {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: var(--wrap);
  margin-inline: auto;
  padding: clamp(6.5rem, 16vh, 9rem) var(--pad)
           max(var(--nav-h), clamp(6rem, 14vh, 8rem));
}

.sec__num {
  font-family: var(--mono);
  font-size: .78rem;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 clamp(1.5rem, 4vw, 2.5rem);
}
.sec__num b { color: var(--signal); font-weight: 600; }

.sec__title {
  font-size: var(--fs-h2);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.03;
  margin: 0;
  max-width: 20ch;
}
.sec__title--big { font-size: var(--fs-h2-big); max-width: 17ch; }
.dim { color: var(--muted); }

.sec__lead {
  font-size: var(--fs-lead);
  line-height: 1.5;
  max-width: 42ch;
  margin: clamp(1.5rem, 4vw, 2.25rem) 0 0;
  color: var(--ink-soft);
}
.slide--dark .sec__lead { color: rgba(245, 241, 230, .82); }
.sec__lead em { font-style: normal; box-shadow: inset 0 -.5em 0 rgba(255, 74, 28, .28); }

.site-head {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 90;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem var(--pad);
}
.wordmark {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}
.wordmark img {
  display: block;
  width: auto;
  height: clamp(1.7rem, 2.4vw, 2rem);
}

.btn {
  --bg: var(--ink);
  --fg: var(--paper);
  display: inline-flex;
  align-items: center;
  gap: .5em;
  background: var(--bg);
  color: var(--fg);
  border: 1.5px solid var(--ink);
  border-radius: 999px;
  padding: .7em 1.35em;
  font: 600 .92rem/1 var(--sans);
  text-decoration: none;
  cursor: pointer;
  transition: transform .16s var(--ease), background .16s var(--ease), color .16s var(--ease);
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn--ghost { --bg: transparent; --fg: var(--ink); }
.btn--ghost:hover { --bg: var(--ink); --fg: var(--paper); }
.slide--dark .btn { --bg: var(--paper); --fg: var(--ink); border-color: var(--paper); }

.arrowlink {
  display: inline-flex;
  align-items: center;
  gap: .55em;
  margin-top: clamp(1.75rem, 4vw, 2.5rem);
  font: 650 1.05rem/1 var(--sans);
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  color: var(--signal);
}
.arrowlink::after { content: "\2192"; transition: transform .2s var(--ease); }
.arrowlink:hover::after { transform: translateX(5px); }

.mail {
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  text-decoration-color: var(--signal);
}
.mail:hover { color: var(--signal); }

.menu {
  position: fixed;
  inset: 0;
  z-index: 110;
  display: flex;
  justify-content: flex-end;
}
.menu[hidden] { display: none; }
.menu__scrim {
  position: absolute;
  inset: 0;
  border: 0;
  cursor: pointer;
  background: rgba(30, 30, 30, .38);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  animation: fade .25s var(--ease);
}
.menu__panel {
  position: relative;
  width: min(28rem, 92vw);
  height: 100%;
  overflow-y: auto;
  background: var(--grad);
  color: var(--hero-ink);
  padding: clamp(4.5rem, 12vh, 7rem) clamp(1.75rem, 5vw, 3.25rem) 3rem;
  box-shadow: -30px 0 80px -30px rgba(30, 30, 30, .5);
  animation: menuIn .32s var(--ease);
}
@keyframes fade { from { opacity: 0; } }
@keyframes menuIn { from { transform: translateX(24px); opacity: 0; } }
.menu__close {
  position: absolute;
  top: 1.4rem;
  right: 1.4rem;
  width: 2.6rem;
  height: 2.6rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  border: 2px solid var(--hero-ink);
  background: transparent;
  color: var(--hero-ink);
  cursor: pointer;
  transition: background .15s var(--ease), color .15s var(--ease);
}
.menu__close svg { width: 55%; }
.menu__close:hover { background: var(--hero-ink); color: #E6E6E6; }
.menu__eyebrow {
  font-family: var(--mono);
  font-size: .72rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  margin: 0 0 1.5rem;
  opacity: .6;
}
.menu__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; }
.menu__list button {
  position: relative;
  display: flex;
  align-items: baseline;
  gap: .9rem;
  width: 100%;
  text-align: left;
  background: none;
  border: 0;
  border-top: 1px solid rgba(30, 30, 30, .18);
  padding: .85rem 0;
  cursor: pointer;
  color: var(--hero-ink);
  font: 700 clamp(1.1rem, 3.5vw, 1.5rem)/1.15 var(--sans);
  letter-spacing: -.02em;
  opacity: .52;
  transition: padding-left .18s var(--ease), opacity .18s var(--ease);
}
.menu__list button::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: .32rem;
  height: 1.15em;
  border-radius: 999px;
  background: var(--hero-ink);
  transform: translateY(-50%) scaleY(0);
  transform-origin: 50% 50%;
  opacity: 0;
  transition: transform .22s var(--ease), opacity .22s var(--ease);
}
.menu__list li:last-child button { border-bottom: 1px solid rgba(30, 30, 30, .18); }
.menu__list button i {
  font-style: normal;
  font-family: var(--mono);
  font-size: .8rem;
  font-weight: 500;
  letter-spacing: .05em;
  opacity: .55;
}
.menu__list button:hover,
.menu__list button:focus-visible { opacity: .82; padding-left: .5rem; }
.menu__list button.is-current { opacity: 1; padding-left: 1.05rem; }
.menu__list button.is-current::before { transform: translateY(-50%) scaleY(1); opacity: 1; }
.menu__list button.is-current i { opacity: 1; }

.progress {
  position: fixed;
  inset: 0 0 auto 0;
  height: 3px;
  z-index: 95;
}
.progress span {
  display: block;
  height: 100%;
  width: 100%;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .6s var(--ease);
}

.deck-nav {
  position: fixed;
  inset: auto 0 0 0;
  z-index: 90;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .55rem;
  padding: 1rem var(--pad) calc(1.1rem + env(safe-area-inset-bottom, 0px));
  /* the bar spans the full width; only its controls should catch clicks,
     so page content underneath (e.g. .contact__back) stays clickable */
  pointer-events: none;
}
.deck-nav__row { display: flex; align-items: center; gap: .7rem; pointer-events: auto; }
.deck-nav .counter { pointer-events: auto; }

.navbtn {
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  transition: transform .14s var(--ease), background .14s var(--ease),
              color .14s var(--ease), opacity .14s var(--ease), border-color .14s var(--ease);
}
.navbtn:disabled { opacity: .3; cursor: not-allowed; }
.navbtn:not(:disabled):hover { transform: translateY(-2px); }
.navbtn:not(:disabled):active { transform: translateY(0); }

.navbtn--prev,
.navbtn--next {
  width: 3.7rem;
  height: 2.9rem;
  background: var(--hero-ink);
  color: #E6E6E6;
}
.navbtn--prev svg,
.navbtn--next svg { width: 1.15rem; height: 1.15rem; }
.navbtn--prev:not(:disabled):hover,
.navbtn--next:not(:disabled):hover { background: #000; }

.navbtn--menu {
  width: 2.9rem;
  height: 2.9rem;
  background: transparent;
  border: 3px solid var(--hero-ink);
}
.navbtn--menu .burger,
.navbtn--menu .burger::before,
.navbtn--menu .burger::after {
  display: block;
  width: 1.05rem;
  height: 3px;
  border-radius: 2px;
  background: var(--hero-ink);
}
.navbtn--menu .burger { position: relative; }
.navbtn--menu .burger::before,
.navbtn--menu .burger::after { content: ""; position: absolute; left: 0; }
.navbtn--menu .burger::before { top: -.34rem; }
.navbtn--menu .burger::after { top: .34rem; }
.navbtn--menu:hover { background: var(--hero-ink); }
.navbtn--menu:hover .burger,
.navbtn--menu:hover .burger::before,
.navbtn--menu:hover .burger::after { background: #E6E6E6; }

.counter {
  font-family: var(--mono);
  font-size: .74rem;
  letter-spacing: .14em;
  color: var(--ink-soft);
  opacity: .7;
}
.counter b { color: var(--hero-ink); font-weight: 600; }

.wipe {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  pointer-events: none;
  visibility: hidden;
}
.no-js .wipe { display: none; }

.wipe__stage {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.wipe__stage.is-back { transform: scaleY(-1); }

.wipe__sheet {
  --bleed: 2px;

  position: absolute;
  left: calc(-1 * var(--bleed));
  top: calc(-1 * var(--bleed));
  width: calc(100% + 2 * var(--bleed));
  height: calc(100% + 2 * var(--bleed));
}

.wipe__shape {
  position: absolute;
  inset: 0;
  background: #E6E6E6;
  will-change: clip-path;
}

.wipe__trail {
  --flight: 308.5deg;
  --edge: -6%;
  --feather: 2.6%;

  position: absolute;
  inset: 0;
  z-index: 1;
  display: none;
  background: linear-gradient(var(--flight), #CE98ED, #5A41BF 78%);
  will-change: mask-image;
}
.wipe.is-trail .wipe__stage { display: none; }
.wipe.is-trail .wipe__trail { display: block; }

.wipe__trail {
  -webkit-mask-image: linear-gradient(var(--flight),
    #000 calc(var(--edge) - var(--feather)),
    transparent calc(var(--edge) + var(--feather)));
          mask-image: linear-gradient(var(--flight),
    #000 calc(var(--edge) - var(--feather)),
    transparent calc(var(--edge) + var(--feather)));
}
.wipe__trail.is-out {
  -webkit-mask-image: linear-gradient(var(--flight),
    transparent calc(var(--edge) - var(--feather)),
    #000 calc(var(--edge) + var(--feather)));
          mask-image: linear-gradient(var(--flight),
    transparent calc(var(--edge) - var(--feather)),
    #000 calc(var(--edge) + var(--feather)));
}
.wipe.is-trail .wipe__title { color: #E6E6E6; }
.wipe.is-trail .wipe__num { color: rgba(230, 230, 230, .62); }

.wipe__num {
  position: relative;
  z-index: 4;
  font-family: var(--mono);
  font-size: .8rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: rgba(30, 30, 30, .55);
  will-change: opacity, transform;
}
.wipe__title {
  position: relative;
  z-index: 4;
  font-size: clamp(2.4rem, 9vw, 7rem);
  font-weight: 900;
  letter-spacing: -.045em;
  line-height: .9;
  color: var(--hero-ink);
  text-align: center;
  padding-inline: 1rem;
  max-width: 16ch;
  will-change: opacity, transform;
}

.slide--hero {
  background: var(--grad);
  background-size: 200% 200%;
  background-position: 0% 0%;
  color: var(--hero-ink);
}
.slide--hero .wrap {
  padding-block: clamp(4.5rem, 11vh, 7rem) max(var(--nav-h), clamp(5.5rem, 14vh, 8rem));
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.hero__grain {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .55;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
}
.hero__title {
  text-transform: uppercase;
  font-size: clamp(5rem, min(22vw, 30vh), 17rem);
  font-weight: 900;
  letter-spacing: -.055em;
  line-height: .86;
  margin: 0;
  color: var(--hero-ink);
}
.hero__subtitle {
  font-size: clamp(1.3rem, .9rem + 2.1vw, 2.7rem);
  font-style: italic;
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -.01em;
  max-width: 42rem;
  margin: clamp(1.25rem, 3.5vw, 2.25rem) 0 0;
  color: var(--hero-ink);
}

.pill-btn {
  margin-top: clamp(1.5rem, 4vw, 2.5rem);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 269px;
  max-width: 88vw;
  height: 89px;
  border: 0;
  border-radius: 44.5px;
  background: #E6E6E6;
  color: #1E1E1E;
  text-align: center;
  font-family: var(--sans);
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.8px;
  cursor: pointer;
  box-shadow: 0 12px 30px -14px rgba(30, 30, 30, .4);
  transition: transform .16s var(--ease), background .16s var(--ease), box-shadow .16s var(--ease);
}
@media (max-width: 380px) { .pill-btn { font-size: 1.5rem; } }
.pill-btn:hover {
  transform: translateY(-2px);
  background: #fff;
  box-shadow: 0 18px 40px -14px rgba(30, 30, 30, .5);
}
.pill-btn:active { transform: translateY(0); }

.hero__cue {
  margin: clamp(2.5rem, 7vw, 5.5rem) 0 0;
  font-size: clamp(1.35rem, .55rem + 2.1vw, 2.6rem);
  font-weight: 900;
  letter-spacing: -.02em;
  line-height: 1.2;
  color: var(--hero-ink);
}
.hero__cue .text-highlight {
  display: inline;
  padding: .1em .25em;
  background: url("stay-highlighter.svg") no-repeat;
  background-size: 100% 100%;
  -webkit-box-decoration-break: clone;
          box-decoration-break: clone;
}
.hero__cue-sub {
  margin: clamp(.4rem, 1.2vw, .9rem) 0 0;
  font-size: clamp(.95rem, .6rem + 1.1vw, 1.45rem);
  font-weight: 400;
  line-height: 1.3;
  color: var(--hero-ink);
}

@media (max-width: 640px) {
  .slide--hero .wrap {
    padding-block: min(27vh, 260px) max(var(--nav-h), min(17vh, 160px));
  }
  .hero__title {
    font-size: min(26.5vw, 25vh);
    letter-spacing: -.045em;
    line-height: .8;
  }
  .hero__subtitle {
    margin-top: min(8.7vw, 4.5vh);
    font-size: min(4.9vw, 1.3rem);
    line-height: 1.45;
    max-width: 19ch;
  }
  .pill-btn {
    margin-top: min(3.5vw, 2vh);
    width: min(48.5vw, 215px);
    height: min(12.7vw, 56px);
    font-size: min(4.7vw, 1.25rem);
    letter-spacing: -.01em;
  }
  .hero__cue {
    margin-top: min(26vw, 12.5vh);
    font-size: min(6.5vw, 1.7rem);
    line-height: 1.4;
    max-width: 9.5em;
    margin-inline: auto;
  }
  .hero__cue-sub {
    margin-top: min(3.7vw, 1.8vh);
    font-size: min(3.8vw, 1rem);
  }
}

@media (max-height: 800px) {
  .slide--hero .wrap { padding-block-start: clamp(3.5rem, 9vh, 5rem); }
  .hero__subtitle { margin-top: clamp(.8rem, 2vw, 1.5rem); }
  .pill-btn { margin-top: clamp(1rem, 2.5vw, 1.75rem); }
  .hero__cue { margin-top: clamp(1.5rem, 4vw, 2.75rem); }
  .hero__cue-sub { margin-top: .35rem; }
}

.slide--stay {
  background: #FD9868;
  color: var(--hero-ink);
  overflow: hidden;
}
.slide--stay .wrap {
  position: relative;
  z-index: 2;
  max-width: min(1220px, 94vw);
  padding-block: clamp(5rem, 12vh, 7rem);
  padding-inline: clamp(1rem, 4vw, 2.5rem);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.stay__grain {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .5;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}
.stay__eyebrow {
  margin: 0 0 clamp(1.75rem, 5vw, 3rem);
  font-size: clamp(1.05rem, .78rem + 1vw, 1.7rem);
  font-weight: 500;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--hero-ink);
}
.stay__title {
  align-self: stretch;
  margin: 0;
  text-align: center;
  font-size: clamp(2.15rem, .4rem + 5.4vw, 4.7rem);
  font-weight: 900;
  letter-spacing: -.03em;
  line-height: 1.2;
  color: var(--hero-ink);
}
.stay__title .text-highlight,
.stay__title .highlight--problem {
  position: relative;
  display: inline-block;
  white-space: nowrap;
}
.stay__title .text-highlight::after,
.stay__title .highlight--problem::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.stay__title .text-highlight::after {
  inset: -.1em -.2em;
  background-image: url("stay-highlighter.svg");
}
.stay__title .highlight--problem::after {
  left: -.15em;
  top: .3em;
  width: min(9em, 58vw);
  aspect-ratio: 671 / 393;
  background-image: url("stay-squiggle.svg");
  -webkit-mask-image: linear-gradient(to bottom, #000 45%, transparent 92%);
          mask-image: linear-gradient(to bottom, #000 45%, transparent 92%);
}

@media (max-width: 640px) {
  .slide--stay {
    --m: min(calc(min(402px, 100vw) / 341),
             calc((100vh - var(--nav-h) - 4.75rem) / 571));
    align-items: flex-start;
  }
  .slide--stay .wrap {
    max-width: none;
    padding-block: max(4.75rem, calc(96 * var(--m)))
                   max(var(--nav-h), calc(150 * var(--m)));
    padding-inline: min(calc(23 * var(--m)), 2.4vw);
  }
  .stay__eyebrow {
    margin-bottom: calc(38 * var(--m));
    font-size: calc(24 * var(--m));
    letter-spacing: .06em;
  }
  .stay__title {
    align-self: center;
    max-width: calc(352 * var(--m));
    font-size: calc(46 * var(--m));
    line-height: 1.22;
  }
  .stay__title .highlight--problem::after {
    left: -.55em;
    top: .35em;
    width: min(11em, 108vw);
  }
}

.slide--about {
  background: #5A41BF;
  color: #E6E6E6;
  align-items: center;
  overflow: hidden;
}
.slide--about .wrap {
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: 1728px;
  margin-inline: auto;
  padding-block: clamp(2.5rem, 8vh, 7rem) calc(clamp(2.5rem, 8vh, 7rem) + 1.678vw);
  padding-inline: clamp(1.25rem, 5.5556vw, 6rem);
  display: block;
  text-align: left;
}

.about__grain {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .25;
  background-size: 300px 300px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='2' numOctaves='3' stitchTiles='stitch'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncG type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncB type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncA type='discrete' tableValues='1 0'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
}

.about__art {
  position: absolute;
  inset: 0;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
}
.about__plane {
  position: absolute;
  right: -13.83vw;
  bottom: -9.79vw;
  width: 49.71vw;
  height: auto;
  min-width: 340px;
}

.about__head {
  margin: 0;
  font-weight: 900;
  color: #E6E6E6;
  letter-spacing: -.01em;
}

.about__num {
  --z: clamp(2.1rem, 5.99vw, 6.47rem);
  display: flex;
  align-items: center;
  height: calc(var(--z) * 1.7);
  color: #FD9868;
  font-weight: 900;
  letter-spacing: -.02em;
  line-height: 1;
}
.about__num-sr {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.about__num-art { display: flex; align-items: center; }
.about__num-15 {
  font-size: calc(var(--z) * 1.249);
  margin-inline-end: calc(var(--z) * .135);
}
.about__comma {
  position: relative;
  z-index: 1;
  font-size: calc(var(--z) * 1.249);
  margin-inline: calc(var(--z) * -.092) calc(var(--z) * -.116);
}
.about__zero {
  flex: none;
  position: relative;
  width: var(--z);
  height: var(--z);
  border-radius: 50%;
  background: #E6E6E6;
}
.about__zero + .about__zero { margin-inline-start: calc(var(--z) * .029); }
.about__zero::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: linear-gradient(90deg, #CE98ED 0%, #FD9868 100%);
}
.about__zero--1::after { opacity: 1; }
.about__zero--2::after { opacity: .62; }
.about__zero--3::after { opacity: .33; }
.about__zero--4::after { opacity: .08; }

.about__row {
  display: grid;
  grid-template-columns: clamp(0px, 17.593vw, 19rem) minmax(0, min(39.352vw, 42.5rem));
  align-items: baseline;
  column-gap: 0;
}
.about__hl {
  color: #FD9868;
  font-weight: 900;
  font-size: clamp(2.15rem, 4.6296vw, 5rem);
  line-height: 1;
  letter-spacing: -.02em;
}
.about__rest {
  font-weight: 900;
  font-size: clamp(1.15rem, 2.3727vw, 2.5625rem);
  line-height: 1.2439;
  letter-spacing: -.01em;
}

.about__lead {
  margin: clamp(2rem, 7.986vw, 8.625rem) 0 0;
  margin-inline-start: clamp(0px, 17.593vw, 19rem);
  max-width: min(39.352vw, 42.5rem);
  color: #E6E6E6;
  font-weight: 500;
  font-size: clamp(1rem, 2.0255vw, 2.1875rem);
  line-height: 1.4571;
}

.slide--about ::selection { background: #FD9868; color: var(--ink); }

@media (max-width: 860px),
       (max-height: 520px) and (orientation: landscape),
       (min-width: 641px) and (max-width: 1100px) and (orientation: portrait) {
  .about__row { grid-template-columns: minmax(0, 1fr); row-gap: .5em; }
  .about__lead { margin-inline-start: 0; }
  .about__rest, .about__lead { max-width: 34ch; }
  .about__rest br, .about__lead br { display: none; }
  .about__plane { right: -22vw; bottom: -14vw; width: 78vw; }
}

@media (max-width: 640px) {
  .slide--about {
    --m: min(calc(min(402px, 100vw) / 352),
             calc((100vh - var(--nav-h) - 4.75rem) / 616));
    align-items: flex-start;
  }
  .slide--about .wrap {
    max-width: none;
    padding-block: max(4.75rem, calc(88 * var(--m)))
                   max(var(--nav-h), calc(60 * var(--m)));
    padding-inline: calc(30 * var(--m));
  }
  .about__num { --z: calc(56 * var(--m)); }
  .about__row { row-gap: 0; margin-top: calc(-12 * var(--m)); }
  .about__hl { font-size: calc(44 * var(--m)); letter-spacing: 0; }
  .about__rest {
    margin-top: calc(8 * var(--m));
    max-width: calc(310 * var(--m));
    font-size: calc(32 * var(--m));
    line-height: 1.08;
    letter-spacing: 0;
  }
  .about__lead {
    margin-top: calc(30 * var(--m));
    max-width: calc(205 * var(--m));
    font-size: calc(23 * var(--m));
    line-height: 1.26;
  }
  .about__plane {
    right: calc(-150 * var(--m));
    bottom: calc(34 * var(--m));
    width: calc(365 * var(--m));
    min-width: 0;
    transform: rotate(16.5deg);
  }
}

.on-about .wordmark img { box-shadow: 0 0 0 1px rgba(230, 230, 230, .18); border-radius: 999px; }
.on-about .btn--ghost { --fg: #E6E6E6; border-color: #E6E6E6; }
.on-about .btn--ghost:hover { --bg: #E6E6E6; --fg: var(--ink); }
.on-about .counter { color: rgba(230, 230, 230, .6); }
.on-about .counter b { color: #E6E6E6; }
.on-about .progress span { background: #E6E6E6; }

.slide--believe {
  background: #BBE6CB;
  color: #1E1E1E;
  align-items: center;
  /* x only: blanket `hidden` also killed the base overflow-y, which stranded
     the footnotes under the deck nav on short viewports with no way to scroll.
     The wedge bleeds off the top and right, and both stay clipped either way. */
  overflow-x: hidden;
}
.slide--believe .wrap {
  z-index: 3;
  max-width: 1728px;
  padding-block: clamp(2.5rem, 8vh, 7rem)
                 max(var(--nav-h), calc(clamp(2.5rem, 8vh, 7rem) + 1.54vw));
  padding-inline: clamp(1.25rem, 5.5556vw, 6rem);
  text-align: center;
}

.believe__grain {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .25;
  background-size: 300px 300px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='2' numOctaves='3' stitchTiles='stitch'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncG type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncB type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncA type='discrete' tableValues='1 0'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
}

.believe__art {
  position: absolute;
  inset: 0;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
}
.believe__wedge {
  position: absolute;
  top: -6.597vw;
  right: -1.273vw;
  width: 42.187vw;
  height: 42.187vw;
}

.beliefs {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  max-width: min(69.44vw, 75rem);
  display: grid;
  gap: clamp(1.1rem, 3.183vw, 3.4375rem);
}
.beliefs li { margin: 0; }
.beliefs h3 {
  margin: 0;
  font-weight: 900;
  font-size: clamp(1.55rem, 3.762vw, 4.0625rem);
  line-height: 1.0154;
  letter-spacing: 0;
}
.beliefs h3 sup,
.beliefs__notes sup {
  font-family: inherit;
  font-weight: inherit;
  color: inherit;
  font-size: .6em;
  line-height: 0;
  vertical-align: baseline;
  position: relative;
  top: -.605em;
  margin-left: 0;
}

.tw-run .tw__c {
  visibility: hidden;
  position: relative;
}
.tw-run .tw__c.is-on { visibility: visible; }

.tw-run .tw__c.is-caret::after {
  content: "";
  position: absolute;
  left: 100%;
  top: .1em;
  margin-left: .07em;
  width: .07em;
  height: .82em;
  background: currentColor;
  animation: tw-caret .8s steps(1) infinite;
}
.tw-run.tw-settled .tw__c.is-caret::after {
  animation: none;
  opacity: 0;
  transition: opacity .35s ease;
}

@keyframes tw-caret { 50% { opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
  .tw-run .tw__c { visibility: visible; }
  .tw-run .tw__c.is-caret::after { display: none; }
}

.beliefs__notes {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: clamp(1.5rem, 4.572vw, 4.9375rem);
  row-gap: clamp(1.1rem, 2.662vw, 2.875rem);
  margin: clamp(2.5rem, 9.303vw, 10.05rem) auto 0;
  max-width: min(88.89vw, 96rem);
}
.beliefs__notes p {
  margin: 0;
  max-width: min(41.088vw, 44.375rem);
  font-weight: 400;
  font-size: clamp(.9rem, 1.736vw, 1.875rem);
  line-height: 1.3333;
}

@media (max-width: 860px),
       (max-height: 520px) and (orientation: landscape),
       (min-width: 641px) and (max-width: 1100px) and (orientation: portrait) {
  .beliefs h3 br,
  .beliefs__notes br { display: none; }
  .beliefs__notes { display: grid; justify-items: center; }
  .beliefs__notes p { max-width: 44ch; }
}

@media (max-width: 640px) {
  .slide--believe {
    --m: min(calc(min(402px, 100vw) / 366),
             calc((100vh - var(--nav-h) - 4.75rem) / 716));
    align-items: flex-start;
  }
  .slide--believe .wrap {
    max-width: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100%;
    padding-block: max(4.75rem, calc(64 * var(--m))) max(var(--nav-h), calc(40 * var(--m)));
    padding-inline: calc(23 * var(--m));
  }
  .believe__wedge {
    top: calc(-22 * var(--m));
    left: calc(119 * var(--m));
    right: auto;
    width: calc(468 * var(--m));
    height: calc(468 * var(--m));
  }
  .beliefs {
    max-width: calc(352 * var(--m));
    gap: calc(26 * var(--m));
  }
  .beliefs h3 {
    font-size: calc(37 * var(--m));
    line-height: 1.14;
    text-wrap: pretty;
  }
  .beliefs__notes {
    margin-top: calc(50 * var(--m));
    max-width: none;
    row-gap: calc(20 * var(--m));
  }
  .beliefs__notes p {
    max-width: calc(330 * var(--m));
    font-size: calc(19.5 * var(--m));
    line-height: 1.38;
  }
}

.slide--do {
  /* 1080 = this slide's content height in design px (header + 3-up card row).
     Below ~860vh the card text hits its 13px floor while the column keeps
     shrinking, so the copy rewraps and the row grows back: no k fits there and
     the single-column fallback below takes over instead. */
  --k: min(0.05208vw, calc((100vh - var(--nav-h) - 3.5rem - 56px) / 1080));
  background: #F4F4F5;
  color: #2A2A2D;
  align-items: center;
  overflow-x: hidden;
}
.slide--do .wrap {
  z-index: 3;
  width: 100%;
  max-width: none;
  padding: max(3.5rem, calc(60 * var(--k))) var(--pad)
           max(var(--nav-h), calc(60 * var(--k)));
}

.do__grain {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .14;
  background-size: 300px 300px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='2' numOctaves='3' stitchTiles='stitch'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncG type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncB type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncA type='discrete' tableValues='1 0'/%3E%3C/feComponentTransfer%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
}

.do__head {
  width: calc(1208 * var(--k));
  max-width: 100%;
  margin: 0 auto;
  text-align: left;
  color: #38383C;
}
.do__eyebrow {
  margin: 0;
  font-size: max(15px, calc(40 * var(--k)));
  line-height: 1.05;
  font-weight: 450;
  letter-spacing: -.01em;
}
.do__title {
  margin: calc(18 * var(--k)) 0 0;
  font-size: calc(90 * var(--k));
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -.025em;
}
.do__sub {
  margin: calc(26 * var(--k)) 0 0;
  font-size: max(14px, calc(32 * var(--k)));
  line-height: 1.05;
  font-weight: 450;
  letter-spacing: -.01em;
}

.cards {
  display: grid;
  grid-template-columns: repeat(3, calc(380 * var(--k)));
  gap: calc(34 * var(--k));
  justify-content: center;
  width: calc(1208 * var(--k));
  max-width: 100%;
  margin: calc(164 * var(--k)) auto 0;
  padding: 0;
  list-style: none;
}
.card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: calc(578 * var(--k));
  padding: calc(95 * var(--k)) calc(28 * var(--k)) calc(84 * var(--k));
  border: 0;
  border-radius: calc(73 * var(--k));
  overflow: visible;
  text-align: left;
  color: #2A2A2D;
  transition: transform .28s var(--ease), box-shadow .28s var(--ease);
}
.card--digital    { background: linear-gradient(180deg, #FD9868 0%, #94CAA8 100%); }
.card--presencial { background: linear-gradient(180deg, #CE98ED 0%, #FFB896 100%); }
.card--webinars   { background: linear-gradient(180deg, rgba(148, 202, 168, .7) 0%, rgba(90, 65, 191, .7) 100%); }

.card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  border-radius: inherit;
  pointer-events: none;
  opacity: .35;
  background-size: 220px 220px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='2' numOctaves='3' stitchTiles='stitch'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncG type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncB type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncA type='discrete' tableValues='1 0'/%3E%3C/feComponentTransfer%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");
}

.card:hover {
  transform: translateY(calc(-8 * var(--k)));
  box-shadow: 0 calc(26 * var(--k)) calc(60 * var(--k)) rgba(42, 42, 45, .18);
}

.card__star {
  position: absolute;
  z-index: 1;
  pointer-events: none;
}
.card__star--burst8 {
  width: calc(216 * var(--k));
  left: calc(-108 * var(--k));
  top: calc(-109 * var(--k));
}
.card__star--spark4 {
  width: calc(187 * var(--k));
  left: 50%;
  margin-left: calc(-93.5 * var(--k));
  top: calc(-96 * var(--k));
}
.card__star--burst16 {
  width: calc(177 * var(--k));
  right: calc(-62.5 * var(--k));
  top: calc(-100 * var(--k));
}

.card__tag {
  position: relative;
  z-index: 3;
  margin: 0;
  font-family: var(--sans);
  font-weight: 800;
  font-size: max(22px, calc(42 * var(--k)));
  line-height: 1.1;
  letter-spacing: -.015em;
  color: #2A2A2D;
}
.card__body {
  position: relative;
  z-index: 3;
  margin: calc(22 * var(--k)) 0 calc(26 * var(--k));
  font-weight: 450;
  font-size: max(13px, calc(20 * var(--k)));
  line-height: 1.35;
  color: #2A2A2D;
}
.card__list {
  position: relative;
  z-index: 3;
  margin: auto 0 0;
  padding: 0;
  list-style: none;
  font-weight: 450;
  font-size: max(13px, calc(20 * var(--k)));
  line-height: 1.35;
  color: #2A2A2D;
}
.card__list li {
  padding-bottom: calc(9 * var(--k));
  border-bottom: 1px solid rgba(42, 42, 45, .38);
}
.card__list li + li { margin-top: calc(6 * var(--k)); }

@media (max-width: 1199px),
       (max-height: 560px) and (orientation: landscape) {
  .slide--do { overflow-y: auto; align-items: flex-start; }
  .slide--do .wrap {
    padding: clamp(4.5rem, 12vh, 7rem) var(--pad)
             max(var(--nav-h), clamp(6rem, 14vh, 8rem));
  }
  .do__head { width: auto; }
  .do__eyebrow { font-size: clamp(1rem, 3.6vw, 1.3rem); }
  .do__title   { margin-top: .5rem; font-size: clamp(2.4rem, 10vw, 4rem); }
  .do__sub     { margin-top: .75rem; font-size: clamp(1rem, 3.6vw, 1.3rem); }

  .cards {
    grid-template-columns: minmax(0, 26rem);
    gap: clamp(5rem, 18vw, 7rem);
    width: auto;
    margin-top: clamp(5rem, 16vw, 7rem);
  }
  .card {
    min-height: 0;
    padding: clamp(3.5rem, 13vw, 4.5rem) clamp(1.6rem, 6vw, 2.2rem) clamp(2.2rem, 8vw, 3rem);
    border-radius: clamp(2rem, 8vw, 3.2rem);
  }
  .card:hover { transform: none; box-shadow: none; }

  .card__star--burst8  { width: clamp(7rem, 28vw, 9rem); left: -2rem;  top: clamp(-4.5rem, -14vw, -3.5rem); }
  .card__star--spark4  { width: clamp(6rem, 24vw, 8rem); margin-left: clamp(-4rem, -12vw, -3rem); top: clamp(-4rem, -12vw, -3rem); }
  .card__star--burst16 { width: clamp(6rem, 24vw, 8rem); right: -1.6rem; top: clamp(-4rem, -12vw, -3rem); }

  .card__tag  { font-size: clamp(1.6rem, 6.4vw, 2.1rem); }
  .card__body { margin: 1rem 0 1rem; font-size: clamp(1rem, 4vw, 1.1rem); line-height: 1.45; }
  .card__list { margin-top: auto; font-size: clamp(1rem, 4vw, 1.1rem); line-height: 1.45; }
  .card__list li { padding-bottom: .45rem; }
  .card__list li + li { margin-top: .5rem; }
}

/* Wide but short: keep the 3-up grid (a single 26rem column reads as a phone
   layout on a 1280 screen) and buy the height back from the gap instead. Below
   ~740 of viewport no k fits at all, so the row is allowed to scroll — the
   wrap's own nav-height bottom padding clears the controls at the end of it. */
@media (min-width: 1200px) and (max-height: 860px) {
  .slide--do { align-items: flex-start; }
  .cards { margin-top: calc(100 * var(--k)); }
}

.slide--dont {
  --k: min(0.05787vw, calc((100vh - 2 * var(--nav-h)) / 566));
  background: #E9C2FF;
  color: #1E1E1E;
  align-items: center;
  overflow: hidden;
}
.slide--dont .wrap {
  z-index: 3;
  width: 100%;
  max-width: none;
  padding-block: 0 max(2.5rem, calc(52 * var(--k)));
  padding-inline: max(1.25rem, 10.44vw) max(1.25rem, 9.72vw);
  display: grid;
  grid-template-columns: auto calc(632 * var(--k));
  justify-content: space-between;
  align-items: start;
  column-gap: clamp(1.5rem, 4vw, 6rem);
  text-align: left;
}

.dont__grain {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .25;
  background-size: 300px 300px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='2' numOctaves='3' stitchTiles='stitch'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncG type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncB type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncA type='discrete' tableValues='1 0'/%3E%3C/feComponentTransfer%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
}

.dont__head {
  margin: calc(198.2 * var(--k)) 0 0;
  font-weight: 900;
  font-size: calc(140 * var(--k));
  line-height: .964;
  letter-spacing: -.02em;
  color: #1E1E1E;
  mix-blend-mode: multiply;
}

.dont__col { display: block; }

.dont__card {
  position: relative;
  width: calc(632 * var(--k));
  min-height: calc(451 * var(--k));
  padding: calc(72.4 * var(--k)) calc(59 * var(--k)) calc(49.6 * var(--k));
  background: #FAFAFA;
  border-radius: 0;
  box-shadow: 0 calc(4 * var(--k)) calc(34 * var(--k)) rgba(0, 0, 0, .25);
}

.dont__clip {
  position: absolute;
  left: 50.8%;
  top: calc(-39.4 * var(--k));
  width: calc(38 * var(--k));
  height: calc(57.4 * var(--k));
  transform: translateX(-50%);
  pointer-events: none;
}

.dont__lead {
  margin: 0;
  font-weight: 900;
  font-size: calc(35 * var(--k));
  line-height: 1.2;
  letter-spacing: 0;
  color: #1E1E1E;
}

.dont__list {
  list-style: none;
  margin: calc(21 * var(--k)) 0 0;
  padding: 0;
}
.dont__list li { margin: 0; }
.dont__list span.is-narrow { display: none; }
.dont__list li + li { margin-top: calc(36 * var(--k)); }

.dont__list span {
  position: relative;
  z-index: 0;
  display: block;
  width: fit-content;
  font-weight: 400;
  font-size: calc(35 * var(--k));
  line-height: 1.3143;
  letter-spacing: 0;
  color: #1E1E1E;
}
.dont__list span::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: calc(-12 * var(--k));
  right: calc(-14 * var(--k));
  top: calc(20 * var(--k));
  height: calc(22 * var(--k));
  border-radius: calc(11 * var(--k));
  background: #BBE6CB;
}

.dont__note {
  margin: calc(42 * var(--k)) 0 0;
  padding-inline: calc(13 * var(--k));
  font-weight: 500;
  font-size: calc(26 * var(--k));
  line-height: 1.5385;
  color: #352281;
}
.dont__note b {
  display: block;
  font-weight: 900;
}

@media (max-width: 860px),
       (max-height: 520px) and (orientation: landscape),
       (min-width: 641px) and (max-width: 1100px) and (orientation: portrait) {
  .slide--dont { overflow-y: auto; align-items: flex-start; }
  .slide--dont .wrap {
    grid-template-columns: minmax(0, 1fr);
    row-gap: clamp(2rem, 8vw, 3rem);
    padding-block: clamp(4.5rem, 12vh, 7rem) clamp(7.5rem, 18vh, 10rem);
    padding-inline: var(--pad);
  }
  .dont__head { font-size: clamp(2.6rem, 13vw, 4.6rem); line-height: 1; }
  .dont__head br { display: none; }
  .dont__card {
    width: auto;
    min-height: 0;
    padding: 2.6rem 1.5rem 1.8rem;
  }
  .dont__clip { top: -1.9rem; width: 2.6rem; height: 2.9rem; }
  .dont__lead { font-size: clamp(1.1rem, 4.8vw, 1.4rem); }
  .dont__list { margin-top: 1.1rem; }
  .dont__list li + li { margin-top: 1.1rem; }
  .dont__list span {
    display: inline;
    font-size: clamp(1rem, 4.4vw, 1.25rem);
    line-height: 1.55;
    background: linear-gradient(#BBE6CB, #BBE6CB) no-repeat 0 .197em / 100% .629em;
    padding-inline: .28em;
    margin-inline: -.28em;
    -webkit-box-decoration-break: clone;
            box-decoration-break: clone;
  }
  .dont__list span::after { content: none; }
  .dont__note {
    margin-top: 1.5rem;
    padding-inline: 0;
    font-size: clamp(.95rem, 4vw, 1.1rem);
    line-height: 1.5;
  }
  .dont__note br { display: none; }
}

@media (max-width: 640px) {
  .slide--dont {
    --m: min(calc(min(402px, 100vw) / 366),
             calc((100vh - var(--nav-h) - 4.75rem) / 629));
  }
  .slide--dont .wrap {
    row-gap: 0;
    min-height: 100%;
    align-content: center;
    padding-block: max(4.75rem, calc(60 * var(--m))) max(var(--nav-h), calc(40 * var(--m)));
    padding-inline: calc(34 * var(--m));
    text-align: center;
  }
  .dont__head {
    margin: 0;
    font-size: calc(60 * var(--m));
    line-height: 1.0833;
  }
  .dont__head br { display: initial; }

  .dont__col {
    width: min(calc(322 * var(--m)), 100%);
    margin: calc(46 * var(--m)) auto 0;
    text-align: left;
  }
  .dont__card {
    width: auto;
    min-height: 0;
    padding: calc(33 * var(--m)) calc(29.5 * var(--m)) calc(36 * var(--m));
    box-shadow: 0 4px 34px rgba(0, 0, 0, .25);
  }
  .dont__clip {
    left: 51.9%;
    top: calc(-32 * var(--m));
    width: calc(29 * var(--m));
    height: calc(43.8 * var(--m));
  }
  .dont__lead { font-size: calc(30 * var(--m)); line-height: 1.2; }

  .dont__list { margin-top: calc(20 * var(--m)); }
  .dont__list li + li { margin-top: calc(39 * var(--m)); }
  .dont__list span {
    display: block;
    width: fit-content;
    font-size: calc(20 * var(--m));
    line-height: 1.25;
    background: none;
    padding-inline: 0;
    margin-inline: 0;
  }
  .dont__list span.is-wide { display: none; }
  .dont__list span.is-narrow { display: block; }
  .dont__list span::after {
    content: "";
    left: calc(-7 * var(--m));
    right: calc(-12 * var(--m));
    top: calc(10.8 * var(--m));
    height: calc(15 * var(--m));
    border-radius: calc(7.5 * var(--m));
  }
  .dont__note {
    margin-top: calc(30 * var(--m));
    padding-inline: calc(6 * var(--m));
    font-size: calc(20 * var(--m));
    line-height: 1.25;
  }
}

.slide--reel {
  --k: min(0.05787vw, calc((100vh - 2 * var(--nav-h)) / 762));
  background-color: #E6E6E6;
  background-image: linear-gradient(123.5deg,
    rgba(253, 152, 104, .7) 10.8%, rgba(90, 65, 191, .7) 90.9%);
  color: #1E1E1E;
  align-items: center;
  overflow: hidden;
}
.slide--reel .wrap {
  z-index: 3;
  width: 100%;
  max-width: none;
  padding-block: 0 max(2.5rem, calc(64.5 * var(--k)));
  padding-inline: max(1.25rem, calc(262 * var(--k)));
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.reel__grain {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .25;
  background-size: 300px 300px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='2' numOctaves='3' stitchTiles='stitch'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncG type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncB type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncA type='discrete' tableValues='1 0'/%3E%3C/feComponentTransfer%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
}

.reel__head {
  margin: 0 0 calc(34.5 * var(--k));
  font-weight: 500;
  font-size: calc(50 * var(--k));
  line-height: 1.1;
  letter-spacing: -.01em;
  color: #1E1E1E;
  mix-blend-mode: multiply;
}
.reel__head b { font-weight: 900; }

.reelword {
  display: block;
  width: calc(1204 * var(--k));
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: center;
  cursor: pointer;
  position: relative;
  -webkit-tap-highlight-color: transparent;
}

.reelword__stage {
  display: none;
  position: relative;
  width: 100%;
  height: 0;
  overflow: hidden;
  clip-path: url(#reelWordClip);
  -webkit-clip-path: url(#reelWordClip);
}
.reelword.is-ready .reelword__stage { display: block; }

.reelword__video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #1E1E1E;
  pointer-events: none;
}

.reelword__label {
  display: block;
  font-size: calc(165 * var(--k));
  font-weight: 900;
  line-height: .82;
  text-transform: uppercase;
  letter-spacing: -.035em;
  color: #1E1E1E;
  mix-blend-mode: multiply;
}
.reelword.is-ready .reelword__label {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
}

.reelword__cue {
  display: block;
  margin-top: calc(26 * var(--k));
  font-family: var(--mono);
  font-size: calc(15 * var(--k));
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(30, 30, 30, .62);
  transition: color .22s var(--ease), transform .22s var(--ease);
}
.reelword:hover .reelword__cue,
.reelword:focus-visible .reelword__cue { color: #1E1E1E; transform: translateY(2px); }

.reelword:focus-visible { outline: 3px solid #1E1E1E; outline-offset: calc(14 * var(--k)); }

.reelword__stage { transition: transform .5s var(--ease); }
.reelword:hover .reelword__stage { transform: scale(1.012); }
.reelword.is-playing .reelword__stage { transition: none; transform: none; }

.reelfs {
  position: fixed;
  inset: 0;
  z-index: 200;
}
.reelfs[hidden] { display: none; }
.reelfs__scrim {
  position: absolute;
  inset: 0;
  background: #0A0A0A;
  opacity: 0;
}
.reelfs .reelword__stage {
  display: block;
  position: absolute;
  transition: none;
  transform: none;
}

.reelfs.is-turned .reelword__video {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100vh;
  height: 100vw;
  transform: translate(-50%, -50%) rotate(90deg);
}

.reelfs__turn {
  position: absolute;
  z-index: 3;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  display: none;
  flex-direction: column;
  align-items: center;
  gap: .9rem;
  padding: 1.4rem 1.6rem;
  border-radius: 14px;
  background: rgba(10, 10, 10, .55);
  backdrop-filter: blur(10px);
  font-family: var(--mono);
  font-size: .74rem;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #E6E6E6;
  opacity: 0;
  pointer-events: none;
}
.reelfs.is-turned .reelfs__turn { display: flex; }
.reelfs__turn svg { display: block; width: 2.6rem; height: 2.6rem; }

.reelfs__chrome {
  position: absolute;
  top: clamp(1rem, 2.4vw, 1.75rem);
  right: clamp(1rem, 2.4vw, 1.75rem);
  z-index: 2;
  display: flex;
  gap: .6rem;
  opacity: 0;
}
.reelfs__btn {
  width: 2.85rem;
  height: 2.85rem;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: rgba(255, 255, 255, .1);
  backdrop-filter: blur(8px);
  color: #E6E6E6;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: background .18s var(--ease), transform .18s var(--ease);
}
.reelfs__btn:hover { background: rgba(255, 255, 255, .2); transform: scale(1.06); }
.reelfs__btn:active { transform: scale(1); }
.reelfs__btn svg { display: block; width: 55%; height: 55%; }
.reelfs__btn .reelfs__off { display: none; }
#reelSound[aria-pressed="false"] .reelfs__on { display: none; }
#reelSound[aria-pressed="false"] .reelfs__off { display: block; }

body.reel-open { overflow: hidden; }
body.reel-open .site-head,
body.reel-open .deck-nav,
body.reel-open .progress { pointer-events: none; opacity: 0; transition: opacity .3s var(--ease); }

@media (max-width: 860px),
       (max-height: 520px) and (orientation: landscape),
       (min-width: 641px) and (max-width: 1100px) and (orientation: portrait) {
  .slide--reel { overflow-y: auto; align-items: flex-start; }
  .slide--reel .wrap {
    min-height: 100%;
    justify-content: center;
    padding-block: clamp(4.5rem, 12vh, 7rem) clamp(7.5rem, 18vh, 10rem);
    padding-inline: var(--pad);
  }
  .reel__head {
    margin-bottom: clamp(1.6rem, 6vw, 2.4rem);
    font-size: clamp(1.15rem, 5vw, 1.6rem);
    line-height: 1.25;
  }
  .reel__head br { display: none; }
  .reelword { width: 100%; }
  .reelword__label { font-size: clamp(2.6rem, 13.5vw, 8rem); }
  .reelword__cue { margin-top: 1.35rem; font-size: .68rem; letter-spacing: .14em; }
}

@media (max-width: 640px) {
  .slide--reel .wrap {
    min-height: 100%;
    justify-content: center;
    padding-block: clamp(4rem, 11vh, 6rem) max(var(--nav-h), 7rem);
    padding-inline: max(1rem, 4vw);
  }
  .reel__head {
    margin-bottom: clamp(1.75rem, 7vh, 3.5rem);
    font-size: clamp(1.3rem, min(9.6vw, 4.55vh), 2.6rem);
    line-height: 1.18;
    text-wrap: pretty;
  }
  .reelword__label {
    max-width: 5ch;
    margin-inline: auto;
    font-size: min(24vw, 20vh);
    line-height: .82;
  }
  .reelword__cue { margin-top: 1.1rem; }
  .reelfs__btn { width: 2.5rem; height: 2.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  .reelword__stage, .reelword:hover .reelword__stage { transition: none; transform: none; }
}

.slide--why {
  background: #5A41BF;
  color: #FFF;
  align-items: center;
  overflow: hidden;
}
.slide--why ::selection { background: #FFF; color: #5A41BF; }

.slide--why .wrap {
  z-index: 3;
  max-width: 1728px;
  padding-block: clamp(2.5rem, 8vh, 7rem) calc(clamp(2.5rem, 8vh, 7rem) + 3.472vw);
  padding-inline: clamp(1.25rem, 5.5556vw, 6rem);
  text-align: center;
}

.why__grain {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .25;
  background-size: 300px 300px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='2' numOctaves='3' stitchTiles='stitch'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncG type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncB type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncA type='discrete' tableValues='1 0'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
}

.why__head {
  margin: 0 auto;
  max-width: min(72.92vw, 78.75rem);
  font-weight: 400;
  font-size: clamp(2rem, 4.6296vw, 5rem);
  line-height: 1.1875;
  letter-spacing: 0;
}
.why__head span {
  display: block;
  max-width: min(58.45vw, 63.125rem);
  margin-inline: auto;
}
.why__head b { display: block; font-weight: 900; }

.why__lead {
  margin: clamp(1.5rem, 4.427vw, 4.7812rem) auto 0;
  max-width: min(47.45vw, 51.25rem);
  font-weight: 400;
  font-size: clamp(1.05rem, 2.3148vw, 2.5rem);
  line-height: 1.125;
}
.why__lead em { font-style: normal; }

@media (max-width: 860px),
       (max-height: 520px) and (orientation: landscape),
       (min-width: 641px) and (max-width: 1100px) and (orientation: portrait) {
  .slide--why .wrap { padding-block: clamp(2.5rem, 8vh, 7rem); text-align: left; }
  .why__head { max-width: none; line-height: 1.08; }
  .why__head span { max-width: none; margin-inline: 0; display: inline; }
  .why__head b { display: inline; }
  .why__lead { max-width: 42ch; margin-inline: 0; line-height: 1.35; }
}

@media (max-width: 600px) {
  .slide--why .wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: clamp(1.35rem, 4.5vh, 2.5rem);
    min-height: 100%;
    padding-block: clamp(4rem, 10vh, 5.5rem) max(var(--nav-h), 6rem);
  }
  .why__head {
    font-size: clamp(2.2rem, min(13.5vw, 6.4vh), 3.9rem);
    line-height: 1.04;
    letter-spacing: -.025em;
  }
  .why__lead {
    margin: 0;
    max-width: none;
    font-size: clamp(1.05rem, min(5.2vw, 2.5vh), 1.7rem);
    line-height: 1.3;
  }
}

.why__cta {
  margin: clamp(1.5rem, 3.5vw, 3.25rem) 0 0;
  display: flex;
  justify-content: center;
}

.proofbtn {
  -webkit-appearance: none;
  appearance: none;
  border: 0;
  cursor: pointer;
  font: inherit;
  display: inline-flex;
  align-items: center;
  gap: clamp(.5rem, .9vw, 1rem);
  padding: clamp(.7rem, 1.16vw, 1.25rem) clamp(1.1rem, 2vw, 2.15rem);
  border-radius: 999px;
  background: #FFF;
  color: #5A41BF;
  font-weight: 900;
  font-size: clamp(.85rem, 1.5046vw, 1.625rem);
  line-height: 1;
  letter-spacing: -.01em;
  text-align: left;
  transition: transform .28s var(--ease), box-shadow .28s var(--ease);
  box-shadow: 0 0 0 0 rgba(255, 255, 255, .35);
}
.proofbtn:hover,
.proofbtn:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 0 0 .375rem rgba(255, 255, 255, .22);
}
.proofbtn__icon {
  flex: none;
  width:  clamp(.85rem, 1.157vw, 1.25rem);
  height: clamp(.85rem, 1.157vw, 1.25rem);
  transition: transform .35s var(--ease);
}
.proofbtn[aria-expanded="true"] .proofbtn__icon { transform: rotate(135deg); }

.proof {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(.75rem, 3vw, 2.5rem);
}
.proof[hidden] { display: none; }

.proof__scrim {
  position: absolute;
  inset: 0;
  background: rgba(12, 8, 30, .66);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  opacity: 0;
}

.proof__sheet {
  position: relative;
  z-index: 1;
  width: min(100%, 72rem);
  max-height: 100%;
  display: flex;
  flex-direction: column;
  background: #FFF;
  color: #1E1E1E;
  border-radius: clamp(.9rem, 1.6vw, 1.5rem);
  overflow: hidden;
  box-shadow: 0 2.5rem 5rem rgba(0, 0, 0, .35);
  opacity: 0;
}

.proof__bar {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: clamp(1rem, 2.2vw, 1.9rem) clamp(1.1rem, 2.6vw, 2.35rem);
  border-bottom: 1px solid rgba(30, 30, 30, .12);
}
.proof__title {
  margin: 0;
  font-weight: 900;
  font-size: clamp(1rem, 1.7vw, 1.5rem);
  line-height: 1.15;
  letter-spacing: -.02em;
}
.proof__close {
  -webkit-appearance: none;
  appearance: none;
  flex: none;
  cursor: pointer;
  border: 1px solid rgba(30, 30, 30, .18);
  background: transparent;
  color: #1E1E1E;
  width:  clamp(2.25rem, 3.2vw, 2.875rem);
  height: clamp(2.25rem, 3.2vw, 2.875rem);
  border-radius: 999px;
  display: grid;
  place-items: center;
  transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.proof__close svg { display: block; width: 42%; height: 42%; }
.proof__close:hover,
.proof__close:focus-visible { background: #1E1E1E; border-color: #1E1E1E; color: #FFF; }

.proof__grid {
  margin: 0;
  padding: clamp(1rem, 2.6vw, 2.35rem);
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(.85rem, 1.7vw, 1.5rem);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.pcard {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: clamp(14rem, 20vw, 18.5rem);
  padding: clamp(1.1rem, 2vw, 1.85rem);
  border-radius: clamp(.7rem, 1.1vw, 1rem);
  background: #E6E6E6;
  color: #0A0A0A;
}

.pcard__num {
  position: absolute;
  z-index: 0;
  left: clamp(.55rem, 1.1vw, 1rem);
  top:  clamp(.1rem, .4vw, .45rem);
  font-weight: 900;
  font-size: clamp(5rem, 9vw, 8.5rem);
  line-height: .82;
  color: #FFF;
  letter-spacing: -.04em;
  user-select: none;
}

.pcard__art {
  position: absolute;
  z-index: 0;
  right: -5%;
  bottom: 17%;
  width: 70%;
  height: auto;
}

.pcard__head {
  position: relative;
  z-index: 2;
  margin: 0 0 clamp(.7rem, 1.4vw, 1.15rem);
  padding-left: clamp(2.6rem, 4.6vw, 4.35rem);
  font-weight: 900;
  font-size: clamp(1.35rem, 2.5vw, 2.25rem);
  line-height: 1.06;
  letter-spacing: -.025em;
}

.pcard__body {
  position: relative;
  z-index: 2;
  margin: 0;
  max-width: 30ch;
  font-weight: 500;
  font-size: clamp(.95rem, 1.25vw, 1.1875rem);
  line-height: 1.28;
}

.pcard__src {
  position: relative;
  z-index: 2;
  margin: auto 0 0;
  padding-top: clamp(.9rem, 1.8vw, 1.5rem);
  max-width: 44ch;
  font-style: italic;
  font-weight: 450;
  font-size: clamp(.72rem, .93vw, .875rem);
  line-height: 1.32;
  color: #2A2A2A;
}

@media (max-width: 860px) {
  .proof__grid { grid-template-columns: minmax(0, 1fr); }
  .pcard { min-height: clamp(13.5rem, 40vw, 16rem); }
  .pcard__art { width: 44%; right: -3%; bottom: 14%; }
  .pcard__body { max-width: 32ch; }
}

@media (max-width: 600px) {
  .proof { padding: 0; }
  .proof__sheet { width: 100%; height: 100%; max-height: 100%; border-radius: 0; }
  .pcard__num { font-size: clamp(4rem, 17vw, 6rem); }
  .pcard__head { padding-left: clamp(2.3rem, 12vw, 3.4rem); }
  .pcard__art { width: 52%; right: -6%; bottom: 16%; }
  .pcard__body { max-width: 26ch; }
  .why__cta { margin-top: 0; }
}

@media (max-height: 560px) and (orientation: landscape) {
  .why__lead { margin-top: clamp(.7rem, 3.2vh, 1.5rem); }
  .why__cta { margin-top: clamp(.5rem, 2.2vh, 1.15rem); }
  .proofbtn {
    padding: clamp(.4rem, 1.6vh, .7rem) clamp(.85rem, 2.4vh, 1.35rem);
    font-size: clamp(.74rem, 2.4vh, .95rem);
  }
  .proofbtn__icon { width: .85rem; height: .85rem; }
}

@media (prefers-reduced-motion: reduce) {
  .proofbtn, .proofbtn__icon, .proof__close { transition: none; }
}

.slide--cases {
  background: #BBE6CB;
  color: #1E1E1E;
  align-items: center;
  /* x only, so the fanned deck still can't push a sideways scrollbar, but the
     last rows stay reachable when the viewport is too short for the stage */
  overflow-x: hidden;
  --fcard-w: min(47.859vw, 51.6875rem);
  --fcard-h: min(39.236vw, 42.375rem);
  --fstage:  min(88.484vw, 95.5625rem);
  --fclose:  min(3.7037vw, 4rem);
}
.slide--cases ::selection { background: #1E1E1E; color: #BBE6CB; }

.slide--cases .wrap {
  z-index: 3;
  max-width: 1728px;
  padding-block: clamp(1rem, 2vh, 2rem) calc(clamp(1rem, 2vh, 2rem) + 7.552vw);
  padding-inline: clamp(1.25rem, 5.5556vw, 6rem);
  text-align: center;
}

.cases__grain,
.voices__grain,
.more__grain,
.contact__grain {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .25;
  background-size: 300px 300px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='2' numOctaves='3' stitchTiles='stitch'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncG type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncB type='linear' slope='2' intercept='-0.5'/%3E%3CfeFuncA type='discrete' tableValues='1 0'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
}

.cases__head {
  margin: 0;
  font-weight: 900;
  font-size: clamp(1.95rem, 4.1667vw, 4.5rem);
  line-height: 1;
  letter-spacing: 0;
}

.fdeck {
  position: relative;
  width:  var(--fcard-w);
  height: var(--fcard-h);
  margin: clamp(1.25rem, 3.5561vw, 3.84rem) auto 0;
}

.fcase {
  position: absolute;
  inset: 0;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: min(1.6782vw, 1.8125rem);
  text-align: left;
  font: inherit;
  color: #FFF;
  cursor: pointer;
  transform-origin: 50% 50%;
  transition: transform .5s var(--ease);
}
.fcase--1 { --grad: linear-gradient(153deg, #94CAA8 6%,  #5A41BF 102%); --shade: rgba(0, 0, 0, 0); }
.fcase--2 { --grad: linear-gradient(151deg, #FD9868 6%,  #CE98ED 102%); --shade: rgba(0, 0, 0, .16); }
.fcase--3 { --grad: linear-gradient(136deg, #FFB897 6%,  #94CAA8 102%); --shade: rgba(0, 0, 0, .24); }
.fcase { background-image: var(--grad); }

.fcase[data-pos="0"] { z-index: 3; transform: none; }
.fcase[data-pos="1"] { z-index: 2; transform: translateX(min(3.4722vw, 3.75rem)) rotate(1.895deg); }
.fcase[data-pos="2"] { z-index: 1; transform: translateX(min(7.581vw, 8.1875rem)) rotate(5.012deg); }
.fcase:focus-visible { outline: 3px solid #1E1E1E; outline-offset: 4px; }

.fcase__pill {
  position: absolute;
  left:  min(9.375vw, 10.125rem);
  top:   min(4.2245vw, 4.5625rem);
  width:  min(26.794vw, 28.9375rem);
  height: min(6.4815vw, 7rem);
  border-radius: 999px;
  background: #FFF;
  color: #1E1E1E;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: min(1.9676vw, 2.125rem);
  font-weight: 900;
  font-size: clamp(.85rem, 2.0255vw, 2.1875rem);
  line-height: 1;
  letter-spacing: 0;
}
.fcase__icon {
  flex: none;
  width:  min(2.517vw, 2.7188rem);
  height: min(2.517vw, 2.7188rem);
}

.fcase__folder {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  line-height: 0;
  filter: drop-shadow(0 -6px 12px rgba(0, 0, 0, .15));
}
.fcase__folder svg { display: block; width: 100%; height: auto; }

.fcase--2 .fcase__folder svg { filter: brightness(.86); }
.fcase--3 .fcase__folder svg { filter: brightness(.76); }

.fcase__tag {
  position: absolute;
  left: min(2.7778vw, 3rem);
  top:  min(15.8478vw, 17.1156rem);
  font-weight: 300;
  font-size: clamp(.8rem, 2.8935vw, 3.125rem);
  line-height: 1;
  letter-spacing: .026em;
  text-transform: uppercase;
}

.fcase__head {
  position: absolute;
  left:  min(2.8565vw, 3.085rem);
  top:   min(20.4959vw, 22.1356rem);
  right: min(3.3356vw, 3.6025rem);
  font-weight: 900;
  font-size: clamp(.95rem, 3.4722vw, 3.75rem);
  line-height: 1;
  letter-spacing: -.01em;
}

.fcase__detail {
  position: absolute;
  left:  min(2.8565vw, 3.085rem);
  right: min(2.8565vw, 3.085rem);
  top:   min(20.4959vw, 22.1356rem);
  bottom: min(1.85vw, 2rem);
  display: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  font-size: clamp(.8rem, 1.3889vw, 1.5rem);
  line-height: 1.45;
}
.fcase[aria-expanded="true"] .fcase__head { display: none; }
.fcase[aria-expanded="true"] .fcase__detail { display: block; }
.fcase__copy { display: block; }
.fcase__nda {
  display: block;
  margin-top: 1em;
  font-family: var(--mono);
  font-size: .68em;
  letter-spacing: .1em;
  text-transform: uppercase;
  opacity: .72;
}
.slide--cases .rd { background: rgba(255, 255, 255, .82); }

.fscrim {
  position: fixed;
  inset: 0;
  z-index: 2;
  margin: 0;
  padding: 0;
  border: 0;
  background: rgba(0, 0, 0, .6);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transition: opacity .42s var(--ease), visibility 0s .42s;
}
.fscrim.is-on {
  opacity: 1;
  visibility: visible;
  transition: opacity .42s var(--ease);
}

.fclose {
  position: fixed;
  z-index: 4;
  right: calc((100vw - var(--fstage)) / 2);
  top: calc((100vh - var(--fcard-h)) / 2
            + var(--fcard-h) * .11504
            - var(--fclose) - min(1.3889vw, 1.5rem));
  display: grid;
  place-items: center;
  width:  var(--fclose);
  height: var(--fclose);
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #FFF;
  color: #1E1E1E;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: scale(.8);
  transition: opacity .3s var(--ease), transform .3s var(--ease), visibility 0s .3s;
}
.fclose.is-on {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition: opacity .3s var(--ease) .34s, transform .3s var(--ease) .34s;
}
.fclose svg { width: 45%; height: 45%; display: block; }
.fclose:hover { background: #1E1E1E; color: #FFF; }
.fclose:focus-visible { outline: 3px solid #FFF; outline-offset: 4px; }

.fdeck.is-open { z-index: 3; transform: none !important; }
.fdeck.is-open .fcase { transition-property: opacity, visibility; }
.fdeck.is-open .fcase:not(.is-open) {
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s var(--ease), visibility 0s .3s;
}

.fcase.is-open .fcase__pill {
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s var(--ease);
}
.fcase[aria-expanded="true"].is-open .fcase__head { display: block; }

.fcase.is-open .fcase__detail {
  z-index: -1;
  left:  79.807%;
  right: auto;
  top:   11.504%;
  bottom: auto;
  width: 105.079%;
  overflow: visible;
  font-size: min(1.7361vw, 1.875rem);
  line-height: 1.5;
  font-weight: 400;
}
.fcase.is-open .fcase__copy {
  height: min(29.398vw, 31.75rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  border-radius: min(2.4884vw, 2.6875rem);
  background: #FFF;
  color: #1E1E1E;
  padding: min(2.7778vw, 3rem) min(4.1088vw, 4.4375rem)
           min(2.7778vw, 3rem) min(12.4421vw, 13.4375rem);
}
.fcase.is-open .fcase__copy .rd { background: #E9C2FF; }
.fcase.is-open .fcase__nda {
  margin: min(2.3148vw, 2.5rem) 0 0;
  padding-left: min(12.4421vw, 13.4375rem);
  font-family: inherit;
  font-size: min(1.4468vw, 1.5625rem);
  letter-spacing: .02em;
  opacity: 1;
}

@media (max-width: 900px),
       (max-height: 520px) and (orientation: landscape),
       (min-width: 641px) and (max-width: 1100px) and (orientation: portrait) {
  .slide--cases { overflow: hidden; align-items: center; }
  .slide--cases .wrap {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding-block: clamp(3.9rem, 8vh, 5rem) max(var(--nav-h), 4.5rem);
    text-align: left;
  }
  .cases__head { flex: none; font-size: clamp(1.5rem, 6.6vw, 2.1rem); }
  .fdeck {
    flex: 1 1 auto;
    width: 100%;
    height: auto;
    min-height: 0;
    margin-top: clamp(.7rem, 2.2vh, 1.5rem);
    display: grid;
    grid-template-rows: repeat(3, minmax(0, 1fr));
    gap: clamp(.5rem, 1.6vh, 1rem);
  }
  .fcase {
    position: relative;
    inset: auto;
    transform: none !important;
    z-index: auto !important;
    cursor: pointer;
    overflow: hidden;
    border-radius: 1.1rem;
    padding: clamp(.7rem, 1.8vh, 1.1rem);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: .5rem;
  }
  .fcase__pill {
    position: relative;
    left: auto; top: auto;
    flex: none;
    width: 100%;
    height: auto;
    padding: clamp(.45rem, 1.2vh, .8rem) 1rem;
    gap: .6rem;
    font-size: clamp(.8rem, 3.4vw, 1.05rem);
  }
  .fcase__icon { width: 1.15rem; height: 1.15rem; }
  .fcase__folder { display: none; }
  .fcase__tag,
  .fcase__head,
  .fcase__detail {
    position: static;
    left: auto; top: auto; right: auto; bottom: auto;
  }
  .fcase__tag, .fcase__head { display: block; }
  .fcase { background-image: linear-gradient(var(--shade), var(--shade)), var(--grad); }
  .fcase__foot { flex: 0 1 auto; min-height: 0; overflow: hidden; }
  .fcase__tag { font-size: clamp(.7rem, 2.8vw, .9rem); letter-spacing: .12em; opacity: .85; }
  .fcase__head {
    margin: .3em 0 0;
    font-size: clamp(1.05rem, 4.8vw, 1.6rem);
    line-height: 1.08;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
  }
  .fcase:not(.is-open) .fcase__detail { display: none; }

  .slide--cases {
    --fstage-top: max(4.25rem, env(safe-area-inset-top, 0px) + 4.25rem);
    --fgutter: clamp(.75rem, 3.5vw, 1.5rem);
    --fopen-w: min(calc(100vw - 2 * var(--fgutter)), 30rem);
    --ffolder-h: calc(var(--fopen-w) * .5503);
  }
  .fscrim { display: block; }
  .fclose {
    display: grid;
    z-index: 5;
    right: calc((100vw - var(--fopen-w)) / 2);
    top:   var(--fstage-top);
    width: 2.5rem;
    height: 2.5rem;
  }
  .fclose svg { width: 40%; height: 40%; }
  .fcase.is-open {
    position: fixed;
    z-index: 4;
    left:   var(--fgutter);
    right:  var(--fgutter);
    width:  var(--fopen-w);
    margin-inline: auto;
    top:    var(--fstage-top);
    bottom: max(var(--nav-h), 5.5rem);
    max-height: none;
    display: block;
    overflow: visible;
    border-radius: 0;
    padding: 0;
    background: none;
    background-image: none;
  }
  .fcase.is-open .fcase__pill { display: none; }
  .fcase.is-open .fcase__folder {
    display: block;
    position: absolute;
    left: 0; right: 0; bottom: 0;
    margin: 0;
  }
  .fcase.is-open .fcase__folder svg { display: block; width: 100%; height: auto; }
  .fcase.is-open .fcase__folder::before { content: none; }
  .fcase.is-open .fcase__foot {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    overflow: visible;
    padding: 0 clamp(.9rem, 4vw, 1.4rem) 2.6rem;
  }
  .fcase.is-open .fcase__detail {
    z-index: auto;
    position: absolute;
    left: 0; right: 0; top: 0;
    bottom: calc(var(--ffolder-h) - 2.4rem);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: auto;
    overflow: visible;
    font-size: clamp(.9rem, 3.8vw, 1.05rem);
    line-height: 1.5;
    font-weight: 400;
  }
  .fcase.is-open .fcase__copy {
    position: relative;
    z-index: -1;
    flex: 0 1 auto;
    height: auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    border-radius: 1.1rem;
    background: #FFF;
    color: #1E1E1E;
    padding: clamp(.9rem, 2.6vh, 1.35rem) clamp(1rem, 4vw, 1.4rem) 3.1rem;
  }
  .fcase.is-open .fcase__tag {
    flex: none;
    font-size: clamp(.7rem, 2.8vw, .9rem);
    padding-right: 3rem;
  }
  .fcase[aria-expanded="true"].is-open .fcase__head {
    flex: none;
    display: block;
    -webkit-line-clamp: none;
    margin: .3em 0 0;
    font-size: clamp(1rem, 4.4vw, 1.45rem);
  }
  .fcase.is-open .fcase__nda {
    position: absolute;
    left:  clamp(.9rem, 4vw, 1.4rem);
    right: clamp(.9rem, 4vw, 1.4rem);
    bottom: calc(3.4rem - var(--ffolder-h));
    margin: 0;
    padding-left: 0;
    font-family: var(--mono);
    font-size: .68em;
    opacity: .9;
  }
}

@media (max-height: 520px) and (orientation: landscape) {
  .fcase.is-open {
    border-radius: 1.1rem;
    background-image: linear-gradient(var(--shade), var(--shade)), var(--grad);
  }
  .fcase.is-open .fcase__folder { display: none; }
  .fcase.is-open .fcase__foot {
    justify-content: flex-start;
    padding: clamp(.7rem, 2.4vh, 1.1rem);
  }
  .fcase.is-open .fcase__detail {
    order: 0;
    position: static;
    flex: 1 1 auto;
    min-height: 0;
    justify-content: flex-start;
    margin-top: .5rem;
  }
  .fcase.is-open .fcase__copy {
    z-index: auto;
    padding-bottom: clamp(.9rem, 2.6vh, 1.35rem);
  }
  .fcase.is-open .fcase__nda {
    position: static;
    flex: none;
    margin-top: .6rem;
  }
}

.rd {
  display: inline-block;
  width: calc(var(--w, 3) * .62em);
  height: .95em;
  background: var(--ink);
  border-radius: 2px;
  vertical-align: -.15em;
  margin: 0 .12em;
  user-select: none;
  -webkit-user-select: none;
}

.slide--voices {
  background: #FFB897;
  color: #1E1E1E;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  padding-bottom: var(--nav-h);
}
.slide--voices ::selection { background: #1E1E1E; color: #FFB897; }

.slide--voices .wrap {
  flex: none;
  padding-block: 0;
  text-align: center;
}

.voices__head {
  margin: 0 auto;
  max-width: min(56.25vw, 60.75rem);
  font-weight: 400;
  font-size: clamp(1.8rem, 4.0509vw, 4.375rem);
  line-height: 1.0714;
  letter-spacing: 0;
}
.voices__head b { display: block; font-weight: 900; }

.marquee {
  margin-top: min(4.6296vw, 5rem);
  display: grid;
  gap: min(1.9676vw, 2.125rem);
  padding-bottom: 1.1em;
  overflow: hidden;
}
.marquee__row {
  display: flex;
  width: max-content;
  animation: marq 46s linear infinite;
}
.marquee__row--rev {
  animation-duration: 58s;
  animation-direction: reverse;
  margin-left: max(-10.822vw, -11.6875rem);
}
.marquee:hover .marquee__row { animation-play-state: paused; }
@keyframes marq { to { transform: translateX(-50%); } }

.quote {
  flex: none;
  display: grid;
  place-items: center;
  width:  min(37.7894vw, 40.8125rem);
  height: min(6.1343vw, 6.625rem);
  margin-right: min(1.9676vw, 2.125rem);
  padding-inline: min(2.5463vw, 2.75rem);
  border-radius: 999px;
  text-align: center;
  text-wrap: balance;
  font-size: min(1.1574vw, 1.25rem);
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: -.01em;
  color: #1E1E1E;
  background: #FFD2BB;
}
.quote--deep { background: #FD7647; }

/* speech-bubble tail */
.quote { position: relative; }
.quote::after {
  content: "";
  position: absolute;
  bottom: .06em;
  left: 14%;
  width: 1.5em;
  height: 1.35em;
  background: inherit;
  clip-path: polygon(0 0, 100% 0, 14% 100%);
  transform: translateY(72%);
}
.quote:nth-child(even)::after {
  left: auto;
  right: 14%;
  clip-path: polygon(0 0, 100% 0, 86% 100%);
}

@media (max-width: 900px),
       (max-height: 520px) and (orientation: landscape),
       (min-width: 641px) and (max-width: 1100px) and (orientation: portrait) {
  .marquee { margin-top: clamp(1.75rem, 6vw, 2.5rem); gap: .75rem; }
  .marquee__row--rev { margin-left: -3.5rem; }
  .quote {
    width: auto;
    max-width: min(30rem, 84vw);
    height: auto;
    margin-right: .75rem;
    padding: .8em 1.4em;
    font-size: clamp(.85rem, 3.2vw, 1.05rem);
    line-height: 1.35;
  }
}

@media (max-width: 640px) {
  .slide--voices { padding-top: 4.75rem; }
  .slide--voices .wrap { flex: none; }
  .voices__head {
    max-width: none;
    padding-inline: var(--pad);
    font-size: clamp(1.6rem, min(9vw, 4.3vh), 2.6rem);
    line-height: 1.08;
    letter-spacing: -.02em;
    text-wrap: balance;
  }

  .marquee {
    flex: 1;
    min-height: 0;
    align-content: center;
    margin-top: clamp(1.1rem, 3.5vh, 2rem);
    gap: clamp(.6rem, 2vh, 1rem);
  }
  .marquee__row--rev { margin-left: -6rem; }
  .quote {
    width: auto;
    max-width: 90vw;
    height: auto;
    margin-right: clamp(.6rem, 2vw, 1rem);
    padding: 1.15em 1.5em;
    font-size: clamp(1.05rem, min(5.6vw, 2.75vh), 1.5rem);
    line-height: 1.4;
  }
}

.slide--more {
  background: #CE98ED;
  color: #1E1E1E;
  flex-direction: column;
  justify-content: safe center;
  align-items: stretch;
  padding-top: max(4.25rem, 8vh);
  padding-bottom: var(--nav-h);
}
.slide--more ::selection { background: #1E1E1E; color: #CE98ED; }

.slide--more .wrap {
  flex: none;
  padding-block: 0;
  text-align: center;
}

.more__lead {
  margin: 0 auto;
  max-width: min(52.083vw, 56.25rem);
  font-weight: 400;
  font-size: clamp(1.35rem, 2.9514vw, 3.1875rem);
  line-height: 1.2157;
  letter-spacing: 0;
}
.more__lead b { display: block; font-weight: 900; }

.more__cards {
  display: grid;
  grid-template-columns: repeat(4, min(21.2963vw, 23rem));
  justify-content: center;
  gap: min(2.8356vw, 3.0625rem);
  margin: min(4.5139vw, 4.875rem) 0 0;
  padding: 0;
  list-style: none;
  perspective: 1600px;
}

.mcard {
  position: relative;
  display: flex;
  flex-direction: column;
  height: min(19.9653vw, 21.5625rem);
  padding: min(2.3148vw, 2.5rem) min(1.6204vw, 1.75rem) min(3.4144vw, 3.6875rem);
  border-radius: min(3.5301vw, 3.8125rem);
  background: #E2C0F5;
  box-shadow: 0 4px 22px rgba(0, 0, 0, .25);
  transform-style: preserve-3d;
  cursor: pointer;
}
.mcard:focus-visible {
  outline: 2px solid #1E1E1E;
  outline-offset: 4px;
}
.mcard__icon,
.mcard__title { backface-visibility: hidden; }

.mcard__text {
  position: absolute;
  inset: 0;
  z-index: 2;
  margin: 0;
  padding: inherit;
  display: flex;
  align-items: center;
  border-radius: inherit;
  background: #1E1E1E;
  color: #F2E9DE;
  font-weight: 500;
  font-size: min(1.4468vw, 1.5625rem);
  line-height: 1.4;
  letter-spacing: 0;
  text-align: left;
  transform: rotateY(180deg);
  backface-visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
  .mcard { height: auto; transform: none !important; }
  .mcard__text {
    position: static;
    padding: 0;
    margin-top: .75em;
    background: none;
    color: inherit;
    text-align: center;
    justify-content: center;
    transform: none !important;
  }
}
.mcard__icon {
  flex: none;
  width:  min(4.3981vw, 4.75rem);
  height: min(4.3981vw, 4.75rem);
  margin-left: min(.6944vw, .75rem);
  display: block;
}
.mcard__title {
  margin-block: auto;
  text-align: center;
  font-weight: 900;
  font-size: min(2.3148vw, 2.5rem);
  line-height: 1.1;
  letter-spacing: -.01em;
  hyphens: auto;
  overflow-wrap: break-word;
}

@media (max-width: 900px),
       (max-height: 520px) and (orientation: landscape),
       (min-width: 641px) and (max-width: 1100px) and (orientation: portrait) {
  .more__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    margin: clamp(1.75rem, 6vw, 2.5rem) var(--pad) 0;
  }
  .mcard {
    height: auto;
    min-height: 9.5rem;
    padding: 1.1rem 1rem 1.25rem;
    border-radius: 1.5rem;
  }
  .mcard__icon { width: 2.6rem; height: 2.6rem; margin-left: 0; }
  .mcard__title { font-size: clamp(.85rem, 4.2vw, 1.35rem); }
  .mcard__text { font-size: clamp(.72rem, 3.1vw, .95rem); line-height: 1.35; }

  .more__lead { max-width: min(100%, 26ch); }
  .more__lead,
  .more__lead b { text-wrap: balance; }
}

@media (max-width: 900px) and (max-height: 700px) and (orientation: portrait) {
  .more__lead { font-size: clamp(1.15rem, 5.4vw, 1.5rem); }
  .more__cards { gap: .6rem; margin-top: clamp(1rem, 3.4vh, 1.75rem); }
  .mcard { min-height: 0; padding: .9rem .6rem 1rem; }
  .mcard__icon { width: 2.1rem; height: 2.1rem; }
  .mcard__title { font-size: clamp(.8rem, 4vw, 1.15rem); margin-top: .5rem; }
  .mcard__text { font-size: clamp(.68rem, 2.9vw, .85rem); line-height: 1.3; }
}

.slide--contact {
  background: var(--grad);
  color: #1E1E1E;
  align-items: center;
}
.slide--contact ::selection { background: #1E1E1E; color: #FD9868; }

.contact__art {
  position: absolute;
  z-index: 3;
  left: min(62.384vw, 67.375rem);
  top: calc(50% + min(7.726vw, 8.344rem));
  width:  min(26.852vw, 29rem);
  height: min(19.560vw, 21.125rem);
  background: url("foot.png") 20.419% 49.877% / 818.73% 500.299% no-repeat;
  opacity: .8;
  mix-blend-mode: screen;
  pointer-events: none;
}

.slide--contact .wrap {
  max-width: none;
  padding-block: 0;
  padding-inline: min(10.995vw, 11.875rem);
}

.contact__title {
  margin: 0;
  max-width: min(65.04vw, 70.25rem);
  font-weight: 900;
  font-size: clamp(2.6rem, 8.6806vw, 9.375rem);
  line-height: 1;
  letter-spacing: -.02em;
}

.contact__line {
  display: flex;
  align-items: center;
  gap: min(2.662vw, 2.875rem);
  margin: min(2.0602vw, 2.225rem) 0 0;
  flex-wrap: wrap;
}
.contact__line em {
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.1rem, 3.4722vw, 3.75rem);
  line-height: 1;
}

.mailpill {
  display: inline-flex;
  align-items: center;
  gap: min(1.1806vw, 1.275rem);
  height: min(6.1921vw, 6.6875rem);
  padding-inline: min(2.7778vw, 3rem) min(2.9977vw, 3.2375rem);
  border-radius: min(2.8935vw, 3.125rem);
  background: #2A2A2D;
  color: #FFF;
  font-weight: 700;
  font-size: clamp(.95rem, 2.3148vw, 2.5rem);
  line-height: 1;
  white-space: nowrap;
  text-decoration-line: underline;
  text-decoration-thickness: .068em;
  text-underline-offset: .2em;
  transition: transform .18s var(--ease), background .18s var(--ease);
}
.mailpill:hover { background: #1E1E1E; transform: translateY(-2px); }
.mailpill:active { transform: translateY(0); }
.mailpill__arrow {
  flex: none;
  width:  min(2.1991vw, 2.375rem);
  height: min(1.3889vw, 1.5rem);
  transition: transform .18s var(--ease);
}
.mailpill:hover .mailpill__arrow { transform: translateX(.15em); }

.contact__foot {
  position: absolute;
  z-index: 4;
  left: 0;
  right: 0;
  bottom: min(1.8519vw, 2rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-inline: min(1.9676vw, 2.125rem) min(2.4595vw, 2.6563rem);
  pointer-events: none;
}
.contact__foot > * { pointer-events: auto; }

.contact__fine,
.contact__ends {
  display: flex;
  flex-direction: column;
  gap: min(.463vw, .5rem);
  max-width: min(26vw, 28rem);
}
.contact__ends { align-items: flex-end; text-align: right; }

.contact__note {
  margin: 0;
  color: rgba(30, 30, 30, .62);
  font-size: min(1.0417vw, 1.125rem);
  line-height: 1.4;
}

.contact__back {
  align-self: flex-end;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: #1E1E1E;
  font: inherit;
  font-weight: 600;
  font-size: min(1.1574vw, 1.25rem);
  cursor: pointer;
  text-decoration-line: underline;
  text-decoration-thickness: .068em;
  text-underline-offset: .2em;
  transition: opacity .18s var(--ease);
}
.contact__back:hover { opacity: .68; }

.contact__brand {
  margin: 0;
  font-weight: 600;
  font-size: min(1.1574vw, 1.25rem);
  line-height: 1.2;
  letter-spacing: 0;
}
.contact__brand span { font-weight: 400; }

.contact__social {
  display: flex;
  align-items: center;
  gap: min(1.1574vw, 1.25rem);
  margin: 0;
  padding: 0;
  list-style: none;
}
.contact__social a {
  display: block;
  color: #1E1E1E;
  transition: transform .18s var(--ease), opacity .18s var(--ease);
}
.contact__social a:hover { transform: translateY(-2px); opacity: .72; }
.contact__icon {
  display: block;
  width:  min(3.0093vw, 3.25rem);
  height: min(3.0093vw, 3.25rem);
}

@media (max-width: 900px),
       (max-height: 520px) and (orientation: landscape),
       (min-width: 641px) and (max-width: 1100px) and (orientation: portrait) {
  .slide--contact .wrap {
    padding-block: 0 calc(var(--nav-h) + 5.5rem);
    padding-inline: var(--pad);
  }
  .contact__title { max-width: 12ch; letter-spacing: -.03em; }
  .contact__line { display: block; margin-top: 1.5rem; }
  .contact__line em { display: block; font-size: clamp(1.05rem, 5vw, 1.4rem); }
  .mailpill {
    margin-top: .75rem;
    height: auto;
    padding: .85rem 1.15rem;
    gap: .6rem;
    border-radius: 999px;
    font-size: clamp(.78rem, 3.5vw, 1.05rem);
    white-space: normal;
  }
  .mailpill__arrow { width: 1.3rem; height: .85rem; }
  .contact__art {
    left: auto;
    right: -10vw;
    top: auto;
    bottom: 16vh;
    width: 74vw;
    height: 53.9vw;
  }
  .contact__foot {
    bottom: calc(var(--nav-h) + .9rem);
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: .75rem;
    padding-inline: var(--pad);
  }
  .contact__fine,
  .contact__ends { max-width: none; gap: .5rem; }
  .contact__ends {
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    text-align: left;
    gap: 1rem;
  }
  .contact__note { font-size: .75rem; line-height: 1.35; }
  .contact__back { align-self: auto; font-size: .8rem; }
  .contact__brand { font-size: .8rem; }
  .contact__icon { width: 1.9rem; height: 1.9rem; }
}

@media (max-width: 640px) {
  .slide--contact .wrap {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    justify-content: center;
    padding-block: 4.75rem calc(var(--nav-h) + 7.25rem);
  }
  .contact__title {
    max-width: none;
    font-size: clamp(2.6rem, min(16.5vw, 7.9vh), 5.5rem);
    line-height: .98;
    text-wrap: balance;
  }
  .contact__line { margin-top: clamp(1.5rem, 4vh, 2.25rem); }
  .contact__line em { font-size: clamp(1.15rem, min(6vw, 2.9vh), 1.8rem); }
  .mailpill {
    margin-top: clamp(.85rem, 2.5vh, 1.25rem);
    padding: .95rem 1.05rem;
    gap: .55rem;
    font-size: clamp(.95rem, min(4.55vw, 2.2vh), 1.3rem);
  }
  .mailpill__arrow { width: 1.5rem; height: 1rem; }
}

.dlg {
  --k: calc(min(1105px, 94vw, 190vh) / 1105);
  border: 0;
  padding: 0;
  max-width: none;
  max-height: none;
  overflow: visible;
  background: transparent;
  color: #1E1E1E;
}
.dlg::backdrop { background: rgba(255, 255, 255, .28); backdrop-filter: blur(8px); }
.dlg[open] { animation: dlgIn .28s var(--ease); }
@keyframes dlgIn { from { opacity: 0; transform: translateY(12px) scale(.98); } }

.dlg__inner {
  position: relative;
  width: calc(1105 * var(--k));
  height: calc(526 * var(--k));
}

.dlg__card {
  position: absolute;
  left: calc(24 * var(--k));
  top: calc(20 * var(--k));
  width: calc(771 * var(--k));
  min-height: calc(478 * var(--k));
  padding: calc(67 * var(--k)) calc(66 * var(--k)) calc(46 * var(--k));
  border-radius: calc(29 * var(--k));
  background: #E6E6E6;
  box-shadow: 0 calc(4 * var(--k)) calc(24 * var(--k)) rgba(0, 0, 0, .45);
}

.dlg__eyebrow {
  margin: 0;
  font-family: var(--sans);
  font-size: calc(25 * var(--k));
  font-weight: 300;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #8C41B8;
}
.dlg__body {
  margin: calc(30 * var(--k)) 0 0;
  max-width: calc(639 * var(--k));
  font-size: calc(30 * var(--k));
  font-weight: 500;
  line-height: 1.1;
  color: #1E1E1E;
}
.dlg__body b { font-weight: 900; }
.dlg__ask {
  margin: calc(27 * var(--k)) 0 0;
  font-size: calc(30 * var(--k));
  font-weight: 600;
  line-height: 1.1;
}

.dlg__mail {
  margin-top: calc(16 * var(--k));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(16 * var(--k));
  width: calc(453 * var(--k));
  max-width: 100%;
  height: calc(64 * var(--k));
  padding-inline: calc(32 * var(--k)) calc(27 * var(--k));
  border-radius: calc(32 * var(--k));
  background: #1E1E1E;
  color: #D7AAF1;
  font-size: calc(26 * var(--k));
  font-weight: 500;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition: transform .18s var(--ease), background .18s var(--ease);
}
.dlg__mail:hover { transform: translateY(-2px); background: #000; }
.dlg__mail:active { transform: translateY(0); }
.dlg__arrow { flex: none; width: calc(24 * var(--k)); height: calc(14 * var(--k)); }

.dlg__next {
  position: absolute;
  left: calc(753 * var(--k));
  top: calc(228 * var(--k));
  display: flex;
  align-items: center;
  gap: calc(19 * var(--k));
  width: max-content;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: #1E1E1E;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.dlg__next-dot {
  flex: none;
  width: calc(84 * var(--k));
  height: calc(65 * var(--k));
  border-radius: calc(32.5 * var(--k));
  background: #1E1E1E;
  transition: transform .18s var(--ease), background .18s var(--ease);
}
.dlg__next-dot svg { display: block; width: 100%; height: 100%; }
.dlg__teaser {
  margin: 0;
  font-size: calc(25 * var(--k));
  font-weight: 300;
  line-height: 1.2;
  color: inherit;
  transition: opacity .18s var(--ease);
}
.dlg__next:hover .dlg__next-dot { transform: translateX(2px); background: #000; }
.dlg__next:hover .dlg__teaser { opacity: .68; }
.dlg__next:active .dlg__next-dot { transform: translateX(0); }

.dlg__close { display: none; }

.dlg__vh {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

@media (max-width: 900px),
       (max-height: 520px) and (orientation: landscape),
       (min-width: 641px) and (max-width: 1100px) and (orientation: portrait) {
  .dlg__inner { width: min(94vw, 34rem); height: auto; }
  .dlg__card {
    position: static;
    width: 100%;
    min-height: 0;
    padding: clamp(1.6rem, 6vw, 2.5rem);
    border-radius: 20px;
  }
  .dlg__eyebrow { font-size: .95rem; letter-spacing: .04em; }
  .dlg__body,
  .dlg__ask { font-size: clamp(1rem, 4vw, 1.2rem); max-width: none; }
  .dlg__body br { display: none; }
  .dlg__mail {
    width: auto;
    height: auto;
    gap: .75rem;
    padding: .85rem 1.1rem;
    border-radius: 999px;
    font-size: clamp(.82rem, 3.4vw, 1rem);
  }
  .dlg__arrow { width: 20px; height: 12px; }
  .dlg__next {
    position: static;
    width: auto;
    flex-direction: column-reverse;
    gap: .9rem;
    margin: 1.25rem auto 0;
    text-align: center;
  }
  .dlg__teaser { font-size: 1rem; line-height: 1.4; }
  .dlg__teaser br { display: none; }
  .dlg__next-dot { width: 76px; height: 58px; border-radius: 999px; }
}

@media (max-width: 640px) {
  .dlg { --m: calc(min(402px, 100vw) / 402); }
  .dlg::backdrop { backdrop-filter: blur(20px); }
  .dlg__inner {
    width: calc(402 * var(--m));
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .dlg__card {
    position: relative;
    width: calc(334 * var(--m));
    padding: calc(56 * var(--m)) calc(30 * var(--m)) calc(17 * var(--m));
    border-radius: calc(29 * var(--m));
  }
  .dlg__close {
    display: block;
    position: absolute;
    top: calc(10 * var(--m));
    right: calc(10 * var(--m));
    width: calc(44 * var(--m));
    height: calc(44 * var(--m));
    padding: calc(11 * var(--m));
    border: 0;
    background: none;
    color: #111827;
    cursor: pointer;
  }
  .dlg__close svg { display: block; width: 100%; height: 100%; }
  .dlg__eyebrow { font-size: calc(20 * var(--m)); letter-spacing: 0; }
  .dlg__body {
    margin-top: calc(45 * var(--m));
    font-size: calc(20 * var(--m));
    line-height: 1.68;
  }
  .dlg__ask { margin-top: calc(33 * var(--m)); font-size: calc(20 * var(--m)); }
  .dlg__mail {
    margin: calc(27 * var(--m)) calc(-19 * var(--m)) 0;
    width: calc(310 * var(--m));
    max-width: none;
    height: calc(62 * var(--m));
    gap: calc(10 * var(--m));
    padding-inline: calc(16 * var(--m));
    border-radius: calc(31 * var(--m));
    font-size: calc(16 * var(--m));
    font-weight: 500;
    color: #E6E6E6;
    text-decoration: underline;
    text-underline-offset: calc(4 * var(--m));
  }
  .dlg__arrow { width: calc(18 * var(--m)); height: calc(15 * var(--m)); }
  .dlg__next {
    flex-direction: column;
    gap: calc(12 * var(--m));
    margin-top: calc(21 * var(--m));
    align-items: center;
    text-align: center;
  }
  .dlg__next-dot {
    width: calc(84 * var(--m));
    height: calc(65 * var(--m));
    border-radius: calc(32.5 * var(--m));
  }
  .dlg__teaser {
    max-width: calc(200 * var(--m));
    font-size: calc(16 * var(--m));
    line-height: 1.56;
  }
}

.btn--ghost,
.navbtn, .navbtn--prev, .navbtn--next, .navbtn--menu,
.counter, .counter b, .burger {
  transition: color .35s var(--ease), background-color .35s var(--ease),
              border-color .35s var(--ease);
}
.on-dark .wordmark img { box-shadow: 0 0 0 1px rgba(245, 241, 230, .14); border-radius: 999px; }
.on-dark .btn--ghost { --fg: var(--paper); border-color: var(--paper); }
.on-dark .btn--ghost:hover { --bg: var(--paper); --fg: var(--ink); }
.on-dark .counter { color: rgba(245, 241, 230, .55); }
.on-dark .counter b { color: var(--paper); }
.on-dark .navbtn--prev,
.on-dark .navbtn--next { background: var(--paper); color: var(--ink); }
.on-dark .navbtn--prev:not(:disabled):hover,
.on-dark .navbtn--next:not(:disabled):hover { background: #fff; }
.on-dark .navbtn--menu { border-color: var(--paper); }
.on-dark .navbtn--menu .burger,
.on-dark .navbtn--menu .burger::before,
.on-dark .navbtn--menu .burger::after { background: var(--paper); }
.on-dark .navbtn--menu:hover { background: var(--paper); }
.on-dark .navbtn--menu:hover .burger,
.on-dark .navbtn--menu:hover .burger::before,
.on-dark .navbtn--menu:hover .burger::after { background: var(--ink); }

.on-hero .btn--ghost { color: var(--hero-ink); border-color: var(--hero-ink); }
.on-hero .btn--ghost:hover { --bg: var(--hero-ink); --fg: #E6E6E6; }
.on-hero .progress span { background: var(--hero-ink); }

.reveal { opacity: 0; }

.no-js, .no-js body { overflow: auto; height: auto; }
.no-js .reveal { opacity: 1; }
.no-js .mcard__text,
.no-js .mcard,
.no-js .mcard__icon,
.no-js .mcard__title { transform: none; }
.no-js .mcard { height: auto; }
.no-js .mcard__text {
  position: static;
  padding: 0;
  margin-top: .75em;
  background: none;
  color: inherit;
  text-align: center;
  justify-content: center;
}
.no-js .deck { position: static; }
.no-js .slide {
  position: static;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  min-height: 0;
  border-top: 1px solid var(--line);
}
.no-js .slide:first-child { border-top: 0; }
.no-js .slide .wrap { padding-block: clamp(4rem, 10vh, 6rem); }
.no-js .deck-nav,
.no-js .progress,
.no-js .menu,
.no-js .wipe { display: none; }
.no-js .site-head { position: sticky; background: var(--paper); }
.no-js .slide--hero .wrap { align-items: flex-start; text-align: left; }
.no-js .fdeck { height: auto; display: grid; gap: 1.25rem; }
.no-js .fcase {
  position: relative;
  inset: auto;
  transform: none;
  cursor: default;
  border-radius: 1.25rem;
  padding: 1.5rem 1.5rem .25rem;
  background-image: linear-gradient(var(--shade), var(--shade)), var(--grad);
}
.no-js .fcase__pill,
.no-js .fscrim,
.no-js .fclose,
.no-js .fcase__folder { display: none; }
.no-js .fcase__foot { display: block; }
.no-js .fcase__tag,
.no-js .fcase__head,
.no-js .fcase__detail {
  position: static;
  display: block;
  -webkit-line-clamp: none;
  overflow: visible;
  margin-bottom: 1.25rem;
}

@media (max-width: 720px) {
  .wordmark img { height: 1.55rem; }
  .site-head .btn { padding: .6em 1em; font-size: .85rem; }
  .navbtn--prev, .navbtn--next { width: 3.3rem; height: 2.7rem; }
  .navbtn--menu { width: 2.7rem; height: 2.7rem; }
  .case summary { padding-right: 2rem; }
  .stay__title .highlight--problem::after { width: min(11em, 72vw); }
}

@media (max-height: 520px) and (orientation: landscape) {
  :root { --nav-h: calc(4.5rem + env(safe-area-inset-bottom, 0px)); }

  .site-head { padding-block: .45rem; }
  .wordmark img { height: 1.3rem; }
  .site-head .btn { padding: .45em .85em; font-size: .78rem; }

  .deck-nav {
    gap: .28rem;
    padding: .45rem var(--pad) calc(.5rem + env(safe-area-inset-bottom, 0px));
  }
  .navbtn--prev,
  .navbtn--next { width: 3rem; height: 2.2rem; }
  .navbtn--prev svg,
  .navbtn--next svg { width: .95rem; height: .95rem; }
  .navbtn--menu { width: 2.2rem; height: 2.2rem; border-width: 2px; }
  .counter { font-size: .64rem; }

  .slide--hero .wrap,
  .slide--stay .wrap,
  .slide--about .wrap,
  .slide--believe .wrap,
  .slide--do .wrap,
  .slide--dont .wrap,
  .slide--reel .wrap,
  .slide--why .wrap,
  .slide--cases .wrap,
  .slide--more .wrap {
    padding-block: 3.4rem max(var(--nav-h), 4.5rem);
  }
  .slide--voices { padding-top: 3.4rem; }
  .slide--voices .wrap { padding-block: 0; }

  .hero__title { font-size: min(var(--fs-hero), 16vh); }
  .hero__subtitle { font-size: min(var(--fs-lead), 5vh); }

  .stay__eyebrow { font-size: min(1.7rem, 4vh); margin-bottom: 1.6vh; }
  .stay__title { font-size: min(4.7rem, 7.6vh); line-height: 1.14; }

  .about__num { --z: min(6.47rem, 11vh); }
  .about__hl { font-size: min(5rem, 9vh); }
  .about__rest { font-size: min(2.5625rem, 6vh); }
  .about__lead { font-size: min(2.1875rem, 4.6vh); margin-top: 3vh; }

  .beliefs { gap: 2.2vh; }
  .beliefs h3 { font-size: min(4.0625rem, 7.4vh); }
  .beliefs__notes { margin-top: 3vh; row-gap: 1.4vh; }
  .beliefs__notes p { font-size: min(1.875rem, 4.2vh); }

  .do__head { font-size: min(4rem, 8.4vh); }
  .dont__head { font-size: min(4.6rem, 9.6vh); }
  .dont__card { padding: 4vh 1.2rem 3vh; }
  .dont__list span { font-size: min(1.25rem, 4.2vh); }
  .dont__note { font-size: min(1.1rem, 3.8vh); }

  .reel__head { font-size: min(1.6rem, 5.2vh); margin-bottom: 2.6vh; }
  .reelword { width: 100%; }
  .reelword__label { font-size: min(8rem, 22vh); }
  .reelword__cue { margin-top: 2.4vh; font-size: min(.72rem, 2.2vh); }

  .why__head { font-size: min(5rem, 10vh); }
  .why__lead { font-size: min(2.5rem, 5vh); margin-top: 3vh; }

  .voices__head { font-size: min(4.375rem, 8.4vh); }
  .marquee { margin-top: 2.4vh; gap: 1.6vh; }
  .quote { font-size: min(1.25rem, 4vh); padding: .7em 1.2em; }

  .contact__title { font-size: min(9.375rem, 13vh); }
  .contact__line em { font-size: min(3.75rem, 5.4vh); }
  .mailpill { font-size: min(2.5rem, 4.6vh); padding: .7rem 1rem; }

  .hero__subtitle { margin-top: 1.3vh; }
  .pill-btn { margin-top: 1.5vh; height: 2.5rem; font-size: .92rem; }
  .hero__cue { margin-top: 2vh; font-size: min(1.7rem, 4.4vh); }
  .hero__cue-sub { margin-top: .2rem; font-size: min(1.45rem, 3.4vh); }

  .dont__col { margin-top: 2.4vh; }
  .dont__note { margin-top: 2vh; }

  .do__eyebrow { font-size: min(1rem, 2.8vh); }
  .do__title   { font-size: min(2.6rem, 7vh); }
  .do__sub     { font-size: min(1rem, 2.8vh); }
  .cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.6rem;
    margin-top: 2.8vh;
  }
  .card { padding: 2.4vh 1.1rem 2vh; border-radius: min(1.6rem, 5vh); }
  .card__star { display: none; }
  .card__tag  { font-size: min(1.35rem, 4.2vh); }
  .card__body { margin: 1.2vh 0 2.4vh; font-size: min(1rem, 2.6vh); line-height: 1.35; }
  .card__list { margin-top: auto; font-size: min(1rem, 2.5vh); line-height: 1.3; }
  .card__list li { padding-bottom: .5vh; }
  .card__list li + li { margin-top: .5vh; }

  .fdeck { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr); gap: .7rem; margin-top: 2.2vh; }
  .fcase { border-radius: .9rem; padding: .8rem .8rem 0; }
  .fcase__pill { padding: .55rem .8rem; gap: .5rem; font-size: min(1.15rem, 3.6vh); }
  .fcase__icon { width: 1.15rem; height: 1.15rem; }
  .fcase__folder { margin: .8rem -.8rem 0; }
  .fcase__tag { font-size: min(.95rem, 3vh); }
  .fcase__head { font-size: min(2rem, 4.8vh); margin: .4rem 0 .8rem; }
  .fcase__detail { font-size: min(1rem, 3.4vh); margin-bottom: .8rem; }
  .cases__head { font-size: min(2.5rem, 6.4vh); }

  .slide--dont .wrap {
    grid-template-columns: minmax(0, 1fr) minmax(0, 23rem);
    align-items: center;
    column-gap: 1.6rem;
    row-gap: 0;
  }
  .dont__col { margin-top: 0; }
  .dont__head { font-size: min(4.6rem, 12vh); }

  .more__cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .6rem;
    margin-top: 2.2vh;
  }
  .mcard { min-height: 0; padding: 1.6vh .8rem 2vh; border-radius: 1.1rem; }
  .mcard__icon { width: 2rem; height: 2rem; }
  .mcard__title { font-size: min(1.35rem, 3.8vh); }
  .mcard__text { font-size: min(.95rem, 2.4vh); line-height: 1.3; }
  .more__lead { font-size: min(2.5rem, 5.6vh); }

  .slide--contact .wrap { padding-block: 3.4rem calc(var(--nav-h) + 4rem); }

  .about__lead { margin-top: 2vh; }
  .beliefs__notes { margin-top: 2.4vh; }
  .fdeck { margin-top: 1.6vh; }
}

@media (min-width: 641px) and (max-width: 1100px) and (orientation: portrait) {
  .slide--do,
  .slide--dont,
  .slide--reel,
  .slide--cases,
  .slide--about { align-items: center; }
  .slide--do .wrap,
  .slide--dont .wrap,
  .slide--reel .wrap,
  .slide--cases .wrap {
    padding-block: clamp(5rem, 9vh, 8rem) max(var(--nav-h), 9vh);
  }

  .hero__title { font-size: min(30vw, 34vh); }
  .hero__subtitle { font-size: min(3.4rem, 3.6vh); }
  .hero__cue { font-size: min(2.9rem, 3.2vh); }
  .hero__cue-sub { font-size: min(2rem, 2.4vh); }

  .stay__eyebrow { font-size: min(2.3rem, 2.6vh); margin-bottom: 4vh; }
  .stay__title { font-size: min(6.5rem, 9vh, 11vw); line-height: 1.14; }

  .about__num { --z: min(8rem, 8.2vh); }
  .about__hl { font-size: min(8rem, 8.2vh); }
  .about__rest { font-size: min(4rem, 4.6vh); max-width: 22ch; }
  .about__lead { font-size: min(2.8rem, 3.2vh); max-width: 30ch; margin-top: 5vh; }

  .beliefs { gap: 3.4vh; }
  .beliefs h3 { font-size: min(4.8rem, 5.4vh); }
  .beliefs__notes { margin-top: 4vh; row-gap: 2.2vh; }
  .beliefs__notes p { font-size: min(2.4rem, 2.7vh); max-width: 34ch; }

  .do__eyebrow { font-size: min(2.4rem, 2.7vh); }
  .do__title   { font-size: min(5.6rem, 6.6vh); }
  .do__sub     { font-size: min(2.4rem, 2.7vh); }
  .cards { grid-template-columns: minmax(0, 34rem); margin-top: 9vh; gap: 10vh; }
  .card { min-height: 0; padding: 7vh 2.4rem 4.5vh; }
  .card__tag  { font-size: min(3.4rem, 4vh); }
  .card__body { font-size: min(2.4rem, 2.8vh); margin: 2.2vh 0 2vh; }
  .card__list { font-size: min(2.4rem, 2.8vh); margin-top: auto; }
  .card__list li { padding-bottom: .8vh; }
  .card__list li + li { margin-top: .9vh; }

  .dont__head { font-size: min(6.5rem, 7.6vh); }
  .dont__card { min-height: 42vh; padding: 6vh 2.4rem 4.5vh; }
  .dont__lead { font-size: min(2.8rem, 3.3vh); }
  .dont__list span { font-size: min(2.6rem, 3.1vh); }
  .dont__list li + li { margin-top: 3vh; }
  .dont__note { font-size: min(2rem, 2.4vh); margin-top: 3.4vh; }

  .reel__head { font-size: min(4rem, 4.6vh); margin-bottom: 5vh; }
  .reelword__cue { margin-top: 3.4vh; font-size: min(1.6rem, 1.9vh); }

  .why__head { font-size: min(7rem, 8vh); }
  .why__lead { font-size: min(3rem, 3.4vh); margin-top: 5vh; max-width: 34ch; }

  .voices__head { font-size: min(5.5rem, 6.2vh); }
  .marquee { margin-top: 5vh; gap: 2vh; }
  .quote { font-size: min(2.2rem, 2.4vh); padding: 1em 1.6em; max-width: min(40rem, 80vw); }

  .cases__head { font-size: min(4.4rem, 5vh); }
  .fdeck { gap: 1.7vh; margin-top: 3vh; }
  .fcase { padding: 2.2vh 1.8rem 0; }
  .fcase__pill { font-size: min(2rem, 2.4vh); padding: 1.1vh 1.4rem; }
  .fcase__icon { width: 2rem; height: 2rem; }
  .fcase__head { font-size: min(3.2rem, 3.6vh); }
  .fcase__detail { font-size: min(1.9rem, 2.2vh); }

  .more__lead { font-size: min(4.4rem, 5vh); }
  .more__cards { gap: 1.4rem; margin-top: 4.5vh; grid-auto-rows: 1fr; }
  .mcard { min-height: 0; padding: 3.4vh 1.6rem 3.8vh; }
  .mcard__icon { width: 3.6rem; height: 3.6rem; }
  .mcard__title { font-size: min(2.5rem, 2.8vh); margin-top: max(2vh, 1rem); }
  .mcard__text { font-size: min(1.6rem, 2vh); }

  .contact__title { font-size: min(9.375rem, 11vh); }
  .contact__line em { font-size: min(3.75rem, 4vh); }
  .mailpill { font-size: min(2.5rem, 3.2vh); padding: 1.4vh 1.6rem; }
}

@media (max-height: 400px) and (orientation: landscape) {
  :root { --nav-h: calc(4.1rem + env(safe-area-inset-bottom, 0px)); }
  .navbtn--prev,
  .navbtn--next { width: 2.7rem; height: 2rem; }
  .navbtn--menu { width: 2rem; height: 2rem; }

  .slide--hero .wrap,
  .slide--stay .wrap,
  .slide--about .wrap,
  .slide--believe .wrap,
  .slide--do .wrap,
  .slide--dont .wrap,
  .slide--reel .wrap,
  .slide--why .wrap,
  .slide--cases .wrap,
  .slide--more .wrap { padding-block: 2.8rem max(var(--nav-h), 4rem); }
  .slide--voices { padding-top: 2.8rem; }
  .slide--contact .wrap { padding-block: 3.6rem calc(var(--nav-h) + 3.2rem); }

  .hero__title { font-size: min(var(--fs-hero), 14vh); }
  .hero__cue { font-size: min(1.7rem, 3.6vh); }

  .stay__title { font-size: min(4.7rem, 5.6vh); }
  .stay__eyebrow { font-size: min(1.7rem, 3.2vh); }

  .about__hl { font-size: min(5rem, 7.4vh); }
  .about__rest { font-size: min(2.5625rem, 5vh); }
  .about__lead { font-size: min(2.1875rem, 3.8vh); }

  .beliefs h3 { font-size: min(4.0625rem, 6vh); }
  .beliefs__notes p { font-size: min(1.875rem, 3.4vh); }

  .dont__head { font-size: min(4.6rem, 9vh); }
  .dont__list span { font-size: min(1.25rem, 3.1vh); }
  .dont__note { font-size: min(1.1rem, 2.8vh); }

  .cases__head { font-size: min(2.5rem, 5.2vh); }
  .fcase__head { font-size: min(2rem, 4vh); }
  .fcase__detail { font-size: min(1rem, 3vh); }
  .fcase__pill { font-size: min(1.15rem, 3.2vh); }

  .voices__head { font-size: min(4.375rem, 7vh); }
  .quote { font-size: min(1.25rem, 3.4vh); padding: .6em 1em; }

  .mcard__icon { width: 1.6rem; height: 1.6rem; }
  .mcard__title { font-size: min(1.35rem, 3.2vh); }
  .mcard__text { font-size: min(.9rem, 2.1vh); }

  .hero__cue { margin-top: 1.4vh; }
  .hero__cue-sub { margin-top: 0; }
  .dont__col { margin-top: 1.6vh; }
  .dont__card { padding: 2.6vh 1rem 2vh; }
  .dont__note { margin-top: 1.4vh; }
}

@media (max-width: 1199px) and (min-height: 561px) {
  .do--carousel { overflow: hidden; align-items: stretch; }
  .do--carousel .wrap {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding-block: clamp(3.4rem, 7vh, 4.6rem) max(var(--nav-h), 4.5rem);
  }
  .do--carousel .do__head { flex: none; }

  .cards--carousel {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    grid-template-columns: none;
    width: auto;
    justify-content: flex-start;
    margin: clamp(1rem, 3.4vh, 1.8rem) calc(var(--pad) * -1) 0;
    gap: clamp(1rem, 5vw, 1.6rem);
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: var(--pad);
    padding-inline: var(--pad);
    padding-top: clamp(2.2rem, 9vw, 3rem);
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .cards--carousel::-webkit-scrollbar { display: none; }

  .cards--carousel { cursor: grab; }
  .cards--carousel.is-dragging { cursor: grabbing; scroll-behavior: auto; }
  .cards--carousel.is-dragging .card { user-select: none; }

  .cards--carousel .card {
    flex: 0 0 88%;
    min-height: 0;
    scroll-snap-align: start;
    padding: clamp(1.6rem, 6vw, 2.2rem) clamp(1.3rem, 5.5vw, 1.9rem);
    border-radius: clamp(1.4rem, 6vw, 2.2rem);
  }
  .cards--carousel .card__star--burst8  { top: clamp(-2.6rem, -11vw, -3.4rem); left: -1rem; }
  .cards--carousel .card__star--spark4  { top: clamp(-2.4rem, -10vw, -3rem); }
  .cards--carousel .card__star--burst16 { top: clamp(-2.4rem, -10vw, -3rem); right: -.8rem; }

  .cards--carousel .card {
    justify-content: center;
  }
  .cards--carousel .card__tag  { font-size: min(clamp(1.7rem, 7.4vw, 2.4rem), 4.4vh); }
  .cards--carousel .card__body {
    margin: clamp(.7rem, 2vh, 1rem) 0 clamp(1.4rem, 4vh, 2rem);
    font-size: min(clamp(1.05rem, 4.6vw, 1.35rem), 2.9vh);
    line-height: 1.4;
  }
  .cards--carousel .card__list {
    margin-top: 0;
    font-size: min(clamp(1.05rem, 4.6vw, 1.35rem), 2.9vh);
    line-height: 1.4;
  }
  .cards--carousel .card__list li { padding-bottom: clamp(.5rem, 1.4vh, .75rem); }
  .cards--carousel .card__list li + li { margin-top: clamp(.55rem, 1.5vh, .8rem); }

  .do--carousel .do__dots {
    flex: none;
    display: flex;
    justify-content: center;
    gap: .55rem;
    margin-top: clamp(.9rem, 2.4vh, 1.4rem);
  }
  .do__dot {
    width: .5rem;
    height: .5rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(42, 42, 45, .25);
    cursor: pointer;
    transition: background .24s var(--ease), transform .24s var(--ease);
  }
  .do__dot::before {
    content: "";
    position: absolute;
    inset: -.6rem;
  }
  .do__dot { position: relative; }
  .do__dot.is-on { background: #2A2A2D; transform: scale(1.25); }
  .do__dot:focus-visible { outline: 2px solid #2A2A2D; outline-offset: 3px; }
}

@media (max-width: 1199px) and (min-height: 561px) and (max-height: 780px) {
  .cards--carousel .card__body { display: none; }
  .do--carousel .do__eyebrow { display: none; }
  .cards--carousel .card__list { margin-top: clamp(.55rem, 2.2vh, 1.4rem); }
  .cards--carousel .card { padding: clamp(1.1rem, 4vw, 1.6rem) clamp(1.3rem, 5.5vw, 1.9rem); }
  .cards--carousel .card__list li { padding-bottom: clamp(.4rem, 1.1vh, .6rem); }
  .cards--carousel .card__list li + li { margin-top: clamp(.45rem, 1.2vh, .65rem); }
}

@media (max-width: 1199px) and (min-height: 561px) and (max-height: 620px) {
  .do--carousel .do__sub { display: none; }
  .do--carousel .do__title { font-size: clamp(1.9rem, 7.6vw, 2.6rem); }
  .cards--carousel .card__list li { padding-bottom: .3rem; }
  .cards--carousel .card__list li + li { margin-top: .35rem; }
}

.do__dots { display: none; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1 !important; transform: none !important; }
  .marquee__row { animation: none; }
  .case__body { animation: none; }
  .progress span { transition: none; }
  .menu__scrim, .menu__panel { animation: none; }
}

.hero__ch {
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
  padding: .06em .04em .1em;
  margin: -.06em -.04em -.1em;
}
.hero__ch > i {
  display: inline-block;
  font-style: inherit;
  will-change: transform;
}
.hero__title.is-overture { will-change: transform; }

.hero-intro .deck-nav,
.hero-intro .progress { opacity: 0; }
.hero-intro .wordmark { pointer-events: none; }

@media (prefers-reduced-motion: reduce) {
  .hero__ch { overflow: visible; }
  .hero-intro .deck-nav,
  .hero-intro .progress { opacity: 1; }
  .hero-intro .wordmark { pointer-events: auto; }
}
