@font-face {
  font-family: "Mansalva";
  src: url("assets/fonts/Mansalva-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Cagliostro";
  src: url("assets/fonts/Cagliostro-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  --cream: #fff4dc;
  --ink: #101a34;
  --accent: #3c96ba;
  --purple: #8a5cc7;
  --yellow: #f6c852;
  --blue: #3c96ba;
  --pink: #eb8f9d;
  --green: #90b93f;
  --line: rgba(16, 26, 52, .22);
  --font-display: "Mansalva", "Comic Sans MS", cursive;
  --font-body: "Cagliostro", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; color: var(--ink); background: var(--cream); font-family: var(--font-body); -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, input { font: inherit; }

.skip-link { position: fixed; top: 10px; left: 10px; z-index: 100; padding: 10px 14px; color: #fff; background: var(--ink); transform: translateY(-150%); }
.skip-link:focus { transform: none; }

.site-header {
  position: relative;
  z-index: 20;
  width: min(1440px, calc(100% - 72px));
  min-height: 98px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  border-bottom: 2px solid var(--ink);
}

.wordmark { color: var(--accent); font-family: var(--font-display); font-size: clamp(32px, 3vw, 46px); line-height: 1; text-decoration: none; transform: rotate(-2deg); transform-origin: left; }
.coming-soon { margin: 0; font-size: 17px; }
.header-cta { justify-self: end; padding: 13px 18px; color: #fff; background: var(--ink); border: 2px solid var(--ink); box-shadow: 4px 4px 0 var(--accent); font-size: 16px; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.header-cta:hover { transform: translate(-2px, -2px) rotate(-1deg); box-shadow: 7px 7px 0 var(--accent); }

.hero {
  position: relative;
  width: min(1440px, calc(100% - 72px));
  min-height: min(calc(100svh - 98px), 982px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: .93fr 1.07fr;
  align-items: center;
  gap: clamp(40px, 3vw, 64px);
  padding: 62px 0 74px;
  overflow: hidden;
}

.hero-copy, .hero-title-frame { position: relative; }
.hero-copy { z-index: 10; width: 100%; min-width: 0; }
.mobile-title-character { display: none; }
.eyebrow { margin: 0 0 17px; color: var(--accent); font-family: var(--font-display); font-size: 19px; }
.eyebrow::before { content: ""; display: inline-block; width: 31px; height: 3px; margin: 0 10px 5px 0; background: currentColor; transform: rotate(-5deg); }

h1, h2, h3, p { font-weight: 400; }
h1, h2, h3 { font-family: var(--font-display); }
h1 { margin: 0; font-size: clamp(76px, 8.7vw, 136px); letter-spacing: -.06em; line-height: .77; }
h1 em { color: var(--accent); font-style: normal; }
.intro { width: min(590px, 94%); margin: 38px 0 32px; font-size: clamp(20px, 1.75vw, 27px); line-height: 1.35; }
.intro span { display: block; }
.intro span + span { margin-top: .7em; }
.intro-anchor { scroll-margin-top: clamp(24px, 8vh, 90px); }

.form-wrap { width: min(600px, 100%); }
.signup-form label { display: block; margin: 0 0 9px; font-size: 17px; }
.form-row { display: grid; grid-template-columns: 1fr auto; padding: 6px; background: #fff; border: 2px solid var(--ink); box-shadow: 7px 7px 0 var(--accent); }
.signup-form input { min-width: 0; height: 56px; padding: 0 16px; color: var(--ink); background: transparent; border: 0; outline: 0; font-size: 18px; }
.signup-form input::placeholder { color: #777b88; }
.signup-form input:focus-visible { outline: 2px dashed var(--accent); outline-offset: -4px; }
.signup-form button { height: 56px; padding: 0 21px; color: #fff; background: var(--ink); border: 0; font-size: 17px; cursor: pointer; transition: background .2s, transform .2s; }
.signup-form button:hover { background: var(--accent); }
.signup-form button:active { transform: translateY(1px); }
.mailchimp-honeypot { position: absolute; left: -5000px; }
.form-status { min-height: 22px; margin: 15px 0 0; color: var(--accent); font-size: 16px; }
.privacy-note { margin: 15px 0 0; color: #626675; font-size: 13px; line-height: 1.5; }
.privacy-note a { color: var(--ink); font-weight: 700; text-underline-offset: 3px; }
.privacy-note a:hover { color: var(--accent); }

.character-stage { position: relative; align-self: stretch; min-height: 610px; }
.card-stack { position: absolute; z-index: 0; inset: 6% 5% 3%; }
.stack-card {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 48%;
  aspect-ratio: .68;
  background-image: linear-gradient(
    110deg,
    transparent 42%,
    rgba(255, 255, 255, .88) 48%,
    rgba(246, 200, 82, .62) 50%,
    rgba(255, 255, 255, .88) 52%,
    transparent 58%
  );
  background-position: 150% 0;
  background-repeat: no-repeat;
  background-size: 250% 100%;
  background-blend-mode: screen;
  border: 3px solid var(--ink);
  border-radius: 18px;
  box-shadow: 7px 9px 0 rgba(16, 26, 52, .18);
  transform-origin: 50% 90%;
  animation: card-glint 8s ease-in-out var(--card-glint-delay) infinite;
}
.stack-card::before { content: ""; position: absolute; inset: 13px; border: 2px dashed rgba(16, 26, 52, .42); border-radius: 10px; }
.stack-card::after { content: ""; position: absolute; left: max(24px, 9%); right: max(24px, 9%); bottom: max(24px, 8%); height: 30%; background: rgba(255, 255, 255, .24); border: 2px solid rgba(16, 26, 52, .28); border-radius: 8px; }
.stack-card-purple { z-index: 1; --card-glint-delay: .6s; background-color: var(--purple); transform: translate(-80%, -49%) rotate(-21deg); }
.stack-card-blue { z-index: 2; --card-glint-delay: 1.04s; background-color: var(--blue); transform: translate(-31%, -52%) rotate(18deg); }
.stack-card-yellow { z-index: 3; --card-glint-delay: .82s; background-color: var(--yellow); transform: translate(-56%, -50%) rotate(-2deg); }
.character { position: absolute; object-fit: contain; filter: drop-shadow(9px 11px 0 rgba(16, 26, 52, .16)); animation: character-float 5s ease-in-out infinite; }
.character-evie { z-index: 4; width: 69%; right: 2%; bottom: 0; transform: rotate(4deg); animation: hero-evie-wiggle 5.2s steps(1, end) -1.7s infinite; }
.character-bunny { z-index: 3; width: 44%; left: 0; top: 1%; --float-y: -9px; transform: rotate(-12deg); animation-duration: 5.6s; animation-delay: -1.2s; }
.character-chirpy { z-index: 2; width: 41%; right: -2%; top: -2%; --float-y: -15px; transform: rotate(10deg); animation-duration: 4.4s; animation-delay: -2.7s; }
.burst { position: absolute; z-index: 8; color: var(--accent); font-size: 30px; }
.burst-one { left: 0; bottom: 18%; transform: rotate(-13deg); }
.burst-two { right: 2%; bottom: 7%; color: var(--blue); font-size: 52px; }

@keyframes character-float {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 var(--float-y); }
}

@keyframes hero-evie-wiggle {
  0%, 60%, 100% { rotate: 0deg; }
  64% { rotate: -.65deg; }
  70% { rotate: 1.1deg; }
  76% { rotate: -.45deg; }
  82% { rotate: .7deg; }
  88% { rotate: 0deg; }
}

@keyframes card-glint {
  0%, 3% { background-position: 150% 0; }
  24%, 100% { background-position: -50% 0; }
}

.crew-section { padding: 105px max(36px, calc((100vw - 1368px) / 2)) 125px; color: #fff; background: var(--ink); }
.crew-heading { display: grid; grid-template-columns: 1fr 2fr 1fr; align-items: end; gap: 32px; margin-bottom: 58px; }
.crew-heading .eyebrow { margin: 0; color: var(--yellow); }
.crew-heading h2 { margin: 0; font-size: clamp(48px, 5vw, 74px); line-height: .95; text-align: center; }
.crew-heading > p:last-child { margin: 0; color: #d1d4de; font-size: 18px; line-height: 1.3; text-align: right; }
.crew-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }
.crew-card { position: relative; min-width: 0; aspect-ratio: .83; padding: 22px 22px 0; overflow: hidden; color: var(--ink); border: 3px solid #fff; box-shadow: 8px 8px 0 var(--accent); }
.crew-card:nth-child(1) { transform: rotate(-2deg); }
.crew-card:nth-child(2) { transform: translateY(13px) rotate(1deg); }
.crew-card:nth-child(3) { transform: rotate(2deg); }
.crew-card-yellow { background: var(--yellow); }
.crew-card-blue { background: var(--blue); }
.crew-card-green { background: var(--green); }
.crew-card img {
  width: 100%;
  height: 82%;
  object-fit: contain;
  transform-origin: 50% 80%;
}
.crew-card:nth-child(1) img { animation: whiskers-wiggle 3.8s steps(1, end) -.4s infinite; }
.crew-card:nth-child(2) img { animation: leo-wiggle 4.4s steps(1, end) -2.1s infinite; }
.crew-card:nth-child(3) img { animation: evie-wiggle 3.4s steps(1, end) -1.2s infinite; }
.crew-card h3 { position: absolute; left: 25px; bottom: 13px; margin: 0; color: #fff; font-size: clamp(33px, 3vw, 50px); text-shadow: 2px 3px 0 var(--ink); }
.card-number { position: absolute; z-index: 2; top: 20px; right: 22px; display: grid; place-items: center; width: 42px; height: 42px; background: #fff; border: 2px solid var(--ink); border-radius: 50%; font-size: 17px; }

@keyframes whiskers-wiggle {
  0%, 52%, 100% { rotate: 0deg; }
  56% { rotate: -1.8deg; }
  62% { rotate: 1.5deg; }
  68% { rotate: -1.4deg; }
  74% { rotate: .9deg; }
  80% { rotate: 0deg; }
}

@keyframes leo-wiggle {
  0%, 40%, 100% { rotate: 0deg; }
  46% { rotate: .8deg; }
  54% { rotate: -1.2deg; }
  62% { rotate: 1deg; }
  70% { rotate: -.35deg; }
  78% { rotate: 0deg; }
}

@keyframes evie-wiggle {
  0%, 58%, 100% { rotate: 0deg; }
  62% { rotate: -1.5deg; }
  68% { rotate: 2.4deg; }
  74% { rotate: -1deg; }
  80% { rotate: 1.4deg; }
  86% { rotate: 0deg; }
}

.closing-cta { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 68px max(36px, calc((100vw - 1368px) / 2)); background: var(--accent); color: #fff; }
.closing-cta p { margin: 0; font-family: var(--font-display); font-size: clamp(40px, 5vw, 72px); line-height: .9; }
.closing-cta a { padding-bottom: 5px; border-bottom: 2px solid currentColor; font-size: clamp(21px, 2vw, 29px); text-decoration: none; }

.site-footer { min-height: 105px; padding: 0 max(36px, calc((100vw - 1368px) / 2)); display: flex; align-items: center; justify-content: space-between; background: var(--cream); }
.wordmark-footer { font-size: 36px; }
.site-footer p { margin: 0; font-size: 15px; }
.footer-meta { display: flex; align-items: center; gap: 22px; }
.footer-meta a { color: var(--ink); font-size: 15px; text-underline-offset: 4px; }
.footer-meta a:hover { color: var(--accent); }

.policy-hero {
  width: min(1160px, calc(100% - 72px));
  margin: 0 auto;
  padding: clamp(72px, 9vw, 132px) 0 86px;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  align-items: end;
  gap: 70px;
}
.policy-hero h1 { font-size: clamp(80px, 10vw, 142px); }
.policy-summary { padding: 28px 0 7px; border-top: 3px solid var(--ink); }
.policy-summary > p:first-child { margin: 0; font-size: clamp(21px, 2vw, 28px); line-height: 1.35; }
.policy-summary .policy-date { margin: 24px 0 0; color: #626675; font-size: 14px; }
.policy-layout {
  padding: 86px max(36px, calc((100vw - 1160px) / 2)) 120px;
  display: grid;
  grid-template-columns: 280px minmax(0, 720px);
  justify-content: space-between;
  gap: 80px;
  color: #f8f9fc;
  background: var(--ink);
}
.policy-nav { position: sticky; top: 28px; align-self: start; }
.policy-nav > p {
  margin: 0 0 18px;
  color: var(--yellow);
  font-family: var(--font-display);
  font-size: 25px;
}
.policy-nav ol { margin: 0; padding: 0; list-style: none; counter-reset: policy-sections; }
.policy-nav li { counter-increment: policy-sections; border-top: 1px solid rgba(255, 255, 255, .2); }
.policy-nav li:last-child { border-bottom: 1px solid rgba(255, 255, 255, .2); }
.policy-nav a {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 8px;
  padding: 10px 0;
  color: #dce0eb;
  font-size: 14px;
  line-height: 1.35;
  text-decoration: none;
}
.policy-nav a::before {
  content: counter(policy-sections, decimal-leading-zero);
  color: var(--blue);
  font-size: 12px;
}
.policy-nav a:hover, .policy-nav a:focus-visible { color: #fff; }
.policy-content { min-width: 0; }
.policy-content section {
  padding: 0 0 64px;
  margin: 0 0 64px;
  border-bottom: 2px solid rgba(255, 255, 255, .15);
  scroll-margin-top: 30px;
}
.policy-content section:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }
.policy-content section#who-we-are { padding-bottom: 0; border-bottom: 0; }
.policy-content h2 {
  margin: 0 0 27px;
  color: var(--yellow);
  font-size: clamp(39px, 4vw, 58px);
  line-height: 1;
}
.policy-content p, .policy-content li, .policy-content dd { font-size: 17px; line-height: 1.7; }
.policy-content p { margin: 0 0 20px; }
.policy-content p:last-child { margin-bottom: 0; }
.policy-content ul { margin: 0 0 24px; padding-left: 24px; }
.policy-content li { margin-bottom: 9px; padding-left: 7px; }
.policy-content a { color: #fff; text-decoration-color: var(--blue); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.policy-content a:hover { color: var(--yellow); }
.company-details { margin: 30px 0 0; border-top: 2px solid rgba(255, 255, 255, .18); }
.company-details div {
  padding: 17px 0;
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 28px;
  border-bottom: 2px solid rgba(255, 255, 255, .18);
}
.company-details dt { color: #aeb6c9; font-size: 13px; letter-spacing: .05em; text-transform: uppercase; }
.company-details dd { margin: 0; }
.policy-callout {
  margin-top: 30px;
  padding: 26px 28px;
  color: var(--ink);
  background: var(--yellow);
  border: 2px solid #fff;
  box-shadow: 7px 7px 0 var(--blue);
}
.policy-callout strong { display: block; font-family: var(--font-display); font-size: 25px; font-weight: 400; line-height: 1.25; }
.policy-callout p { margin: 12px 0 0; font-size: 15px; line-height: 1.6; }
.success-page {
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  background: var(--cream);
}
.success-header { flex: 0 0 auto; }
.success-main { flex: 1 0 auto; display: flex; }
.success-hero {
  width: min(1220px, calc(100% - 72px));
  min-height: 670px;
  margin: 0 auto;
  padding: 70px 0 82px;
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  align-items: center;
  gap: clamp(45px, 7vw, 105px);
}
.success-copy { position: relative; z-index: 2; }
.success-copy h1 { font-size: clamp(76px, 8.5vw, 124px); }
.success-message {
  width: min(590px, 100%);
  margin: 38px 0 30px;
  font-size: clamp(20px, 1.8vw, 26px);
  line-height: 1.4;
}
.success-message span { display: block; }
.success-message span + span { margin-top: .7em; }
.success-actions { display: flex; align-items: flex-start; flex-direction: column; gap: 22px; }
.success-primary {
  padding: 15px 20px;
  color: #fff;
  background: var(--ink);
  border: 2px solid var(--ink);
  box-shadow: 5px 5px 0 var(--accent);
  font-size: 17px;
  text-decoration: none;
  transition: transform .2s, box-shadow .2s;
}
.success-primary:hover { transform: translate(-2px, -2px) rotate(-1deg); box-shadow: 8px 8px 0 var(--accent); }
.success-unsubscribe a:hover { color: var(--accent); }
.success-unsubscribe {
  margin: 27px 0 0;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 6px;
  color: #626675;
  font-size: 14px;
  line-height: 1.55;
}
.success-unsubscribe a { color: var(--ink); text-underline-offset: 3px; }
.success-art {
  position: relative;
  min-height: 510px;
  display: grid;
  place-items: center;
}
.success-card {
  position: absolute;
  inset: 7% 10% 6%;
  overflow: hidden;
  background: var(--yellow);
  border: 3px solid var(--ink);
  border-radius: 20px;
  box-shadow: 10px 12px 0 var(--accent);
  transform: rotate(4deg);
}
.success-card::before {
  content: "";
  position: absolute;
  inset: 16px;
  border: 2px dashed rgba(16, 26, 52, .48);
  border-radius: 12px;
}
.success-art img {
  position: absolute;
  z-index: 2;
  width: 88%;
  max-height: 90%;
  object-fit: contain;
  filter: drop-shadow(9px 11px 0 rgba(16, 26, 52, .17));
  --float-y: -8px;
  transform: translate(-5%, 1%) rotate(-5deg);
  animation: character-float 5.4s -1.6s ease-in-out infinite;
}
.success-art > p {
  position: absolute;
  z-index: 4;
  right: 3%;
  bottom: 7%;
  margin: 0;
  padding: 11px 16px;
  color: #fff;
  background: var(--ink);
  border: 2px solid var(--cream);
  box-shadow: 4px 4px 0 var(--purple);
  font-family: var(--font-display);
  font-size: clamp(24px, 2.5vw, 35px);
  transform: rotate(-4deg);
}
.success-burst { position: absolute; z-index: 5; color: var(--accent); font-family: var(--font-display); }
.success-burst-one { top: 3%; left: 0; font-size: 34px; transform: rotate(-12deg); }
.success-burst-two { top: 11%; right: -1%; color: var(--purple); font-size: 52px; }
.success-burst-three { left: 1%; bottom: 7%; color: var(--pink); font-size: 38px; transform: rotate(12deg); }
.success-footer { flex: 0 0 auto; border-top: 2px solid var(--ink); }

.success-primary:focus-visible,
.success-unsubscribe a:focus-visible {
  outline: 3px dashed var(--accent);
  outline-offset: 5px;
}

@media (max-width: 650px) {
  html, body { overflow-x: hidden; overflow-x: clip; }
  .site-header, .hero, .policy-hero { width: min(100% - 44px, 820px); }
  .site-header { grid-template-columns: 1fr 1fr; }
  .coming-soon { display: none; }
  .hero { grid-template-columns: 1fr; min-height: auto; padding-top: 16px; overflow: visible; }
  .hero-copy { text-align: center; }
  .hero-copy .eyebrow { justify-content: center; }
  .hero-title-frame {
    --mobile-title-size: clamp(76px, 8.7vw, 136px);
    /* φ² scale with 1em outside the viewport leaves roughly 61.8% visible. */
    --mobile-character-size: clamp(176px, 2.618em, 252px);
    --mobile-character-gutter: clamp(14px, 2.5vw, 20px);
    --mobile-character-offset: calc(-1em - var(--mobile-character-gutter));
    --mobile-evie-drop: calc(clamp(52px, .667em, 64px) - 6px);
    --mobile-bunny-lift: clamp(7px, .1em, 10px);
    z-index: 2;
    isolation: isolate;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    padding: clamp(28px, 6vw, 58px) clamp(48px, 14vw, 150px);
    font-size: var(--mobile-title-size);
    overflow: visible;
  }
  .hero-title-frame h1 { position: relative; z-index: 2; font-size: 1em; }
  .mobile-title-character {
    position: absolute;
    z-index: 1;
    top: 50%;
    display: block;
    width: var(--mobile-character-size);
    object-fit: contain;
    filter: drop-shadow(9px 11px 0 rgba(16, 26, 52, .16));
    pointer-events: none;
    animation: character-float 5s ease-in-out infinite;
  }
  .mobile-title-bunny {
    right: var(--mobile-character-offset);
    top: calc(50% - var(--mobile-bunny-lift));
    --float-y: -6px;
    transform: translateY(-50%) rotate(-3deg);
    animation-duration: 5.6s;
    animation-delay: -1.2s;
  }
  .mobile-title-evie {
    left: var(--mobile-character-offset);
    top: calc(50% + var(--mobile-evie-drop));
    --float-y: -7px;
    transform: translateY(-50%) rotate(15deg) scaleX(-1);
    animation-duration: 5.2s;
    animation-delay: -1.7s;
  }
  .intro, .form-wrap { margin-left: auto; margin-right: auto; }
  .signup-form label { text-align: left; }
  .form-status, .privacy-note { text-align: left; }
  .character-stage { display: none; }
  .crew-heading { grid-template-columns: 1fr; text-align: center; }
  .crew-heading .eyebrow { margin: 0 auto; }
  .crew-heading > p:last-child { text-align: center; }
  .policy-hero { grid-template-columns: 1fr; gap: 55px; }
  .policy-summary { width: min(600px, 100%); }
  .policy-layout { grid-template-columns: 1fr; gap: 72px; }
  .policy-nav { position: static; }
  .policy-nav ol { display: grid; grid-template-columns: 1fr 1fr; column-gap: 30px; }
  .success-hero { width: min(100% - 44px, 820px); grid-template-columns: 1fr; padding-top: 75px; text-align: center; }
  .success-message { margin-right: auto; margin-left: auto; }
  .success-actions { align-items: center; }
  .success-unsubscribe { align-items: center; }
  .success-art { width: min(550px, 100%); min-height: 550px; margin: 5px auto 0; }
}

@media (min-width: 651px) and (max-width: 1200px) {
  .hero { min-height: auto; padding-top: 52px; padding-bottom: 64px; }
  .character-stage {
    align-self: center;
    justify-self: center;
    width: min(100%, clamp(300px, calc(83.333svh - 178px), 722px));
    min-height: 0;
    height: auto;
    /* A fixed design canvas keeps every percentage-positioned piece together. */
    aspect-ratio: 5 / 6;
  }
}

@media (max-width: 760px) {
  .crew-section { padding: 85px 22px 100px; }
  .crew-grid { grid-template-columns: 1fr; gap: 40px; width: min(430px, 100%); margin: auto; }
  .crew-card { aspect-ratio: .9; }
  .crew-card:nth-child(2) { transform: rotate(1deg); }
  .closing-cta { padding: 55px 24px; align-items: flex-start; flex-direction: column; }
  .policy-layout { padding: 70px 24px 90px; }
  .policy-nav ol { grid-template-columns: 1fr; }
  .policy-content section { padding-bottom: 50px; margin-bottom: 50px; }
  .success-hero { gap: 45px; }
}

@media (max-width: 560px) {
  .site-header { min-height: 78px; width: calc(100% - 36px); }
  .wordmark { font-size: 33px; }
  .header-cta { padding: 10px 12px; font-size: 14px; box-shadow: 3px 3px 0 var(--accent); }
  .hero { width: calc(100% - 36px); padding: 12px 0 35px; }
  .hero-title-frame { --mobile-title-size: clamp(67px, 21vw, 96px); }
  h1 { font-size: clamp(67px, 21vw, 96px); }
  .intro { width: 100%; margin-top: 30px; font-size: 21px; }
  .form-row { grid-template-columns: 1fr; }
  .signup-form input { text-align: center; }
  .crew-heading { margin-bottom: 45px; }
  .crew-heading h2 { font-size: 50px; }
  .site-footer { min-height: 115px; padding: 25px 22px; align-items: flex-start; flex-direction: column; justify-content: center; gap: 12px; }
  .footer-meta { align-items: flex-start; flex-direction: column; gap: 10px; }
  .policy-hero { width: calc(100% - 36px); padding: 58px 0 62px; gap: 38px; }
  .policy-hero h1 { font-size: clamp(72px, 23vw, 105px); }
  .policy-summary { padding-top: 20px; }
  .policy-layout { padding-right: 20px; padding-left: 20px; }
  .company-details div { grid-template-columns: 1fr; gap: 7px; }
  .policy-content p, .policy-content li, .policy-content dd { font-size: 16px; line-height: 1.65; }
  .policy-callout { padding: 22px; box-shadow: 5px 5px 0 var(--blue); }
  .success-hero { width: calc(100% - 36px); min-height: 0; padding: 58px 0 65px; }
  .success-copy h1 { font-size: clamp(66px, 21vw, 96px); }
  .success-message { margin-top: 30px; font-size: 20px; }
  .success-actions { gap: 19px; }
  .success-art { min-height: 420px; }
  .success-card { inset: 8% 7% 5%; }
  .success-art img { width: 92%; --float-y: -5px; }
  .success-art > p { right: 1%; bottom: 6%; }
  .success-burst-one { left: -1%; font-size: 28px; }
  .success-burst-two { right: 0; font-size: 42px; }
  .success-footer { min-height: 165px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
  .character, .mobile-title-character, .crew-card img, .success-art img, .card-stack, .stack-card { animation: none; translate: none; }
  .crew-card img { rotate: none; }
}
