/* v14: one clear reading order above the illustrated workshop. */
:root {
  --muted: #40575a;
}

body {
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.7;
}

/* The pixel voice stays in the identity; long-form text uses the same clean face. */
.site-header nav {
  font-size: 16px;
  line-height: 1.5;
}

.site-header nav > a,
.menu-toggle {
  min-height: 44px;
}

.button,
.text-link,
.form-actions .button,
.form-actions .copy-button {
  font-size: 16px;
  line-height: 1.5;
  min-height: 48px;
}

.eyebrow,
.card-number,
.work-preview-kicker,
.form-heading,
.mission-summary-kicker,
.tip-label {
  font-size: 13px;
  line-height: 1.6;
  letter-spacing: .035em;
}

.journey-copy,
.journey-copy[data-chapter='1'],
.journey-copy[data-chapter='2'] {
  z-index: 3;
  isolation: isolate;
  text-align: center;
}

.journey-copy .journey-title,
.journey-copy h2,
.journey-copy[data-chapter='1'] h2 {
  font-family: var(--sans);
  font-weight: 700;
  line-height: 1.06;
  letter-spacing: -.045em;
  max-width: 100%;
  margin: 0;
  text-shadow: none;
}

.journey-copy .pixel-word {
  font-family: var(--sans);
  font-size: 1em;
  font-weight: 700;
  letter-spacing: inherit;
}

.journey-copy .eyebrow {
  justify-content: center;
  color: #3a5458;
  font-size: 13px;
  line-height: 1.5;
  margin: 0 0 12px;
  letter-spacing: .065em;
}

.journey-copy .journey-lede,
.journey-copy[data-chapter='1'] .journey-lede,
.journey-copy[data-chapter='2'] .journey-lede {
  position: static;
  width: 100%;
  max-width: 650px !important;
  margin: 14px auto 20px;
  padding: 0;
  border: 0;
  background: none;
  color: #213c42;
  font-family: var(--sans);
  font-size: 20px;
  font-weight: 400;
  line-height: 1.55;
  backdrop-filter: none;
  text-wrap: pretty;
}

.journey-copy > .actions,
.journey-copy > .button,
.journey-copy > .text-link {
  position: static;
  inset: auto;
}

.journey-copy > .actions {
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 16px 28px;
}

.journey-copy > .button,
.journey-copy > .actions .button,
.journey-copy > .text-link,
.journey-copy > .actions .text-link,
.journey-copy[data-chapter='1'] > .text-link {
  font-size: 16px;
  line-height: 1.5;
  min-height: 50px;
}

.journey-copy[data-chapter='1'] > .text-link {
  padding: 9px 0;
  border: 0;
  border-bottom: 1px solid currentColor;
  background: none;
  box-shadow: none;
}

.journey-pager > a {
  min-width: 44px;
  min-height: 44px;
  font-size: 13px;
}

.journey-skip {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  font: 600 14px/1.5 var(--sans);
}

.journey-world-label {
  font-size: 11px;
  line-height: 1.6;
  letter-spacing: .025em;
}

.actor-motion-control,
.living-robot-label {
  font-family: var(--sans);
  font-size: 13px;
  line-height: 1.4;
}

.actor-motion-control {
  min-height: 44px;
}

.living-toast-message,
.living-toast-actions > a,
.living-open-log,
.living-dialog-note,
.living-replay,
.living-dialog-cta {
  font-size: 14px;
  line-height: 1.6;
}

.living-toast-actions > a,
.living-open-log {
  min-height: 44px;
}

.section-intro,
.faq .section-intro,
.skill-card.offer-card p,
.offer-help p,
.steps p,
.contact-copy > p:not(.eyebrow),
.studio-copy > p:not(.eyebrow),
#work-preview-description,
.work-enhanced .picnic-status,
.picnic-status,
details p,
#project-description,
.living-dialog-body > p:not(.living-dialog-eyebrow):not(.living-dialog-note):not(.sr-only) {
  font-size: 17px;
  line-height: 1.75;
}

.skill-card.offer-card {
  gap: 20px;
}

.skill-card.offer-card > .card-link,
.offer-help .text-link,
.project-info p,
.work-enhanced .picnic-files > a,
.picnic-files > a,
#work-try-seefood,
.work-open {
  font-size: 15px;
  line-height: 1.6;
  min-height: 44px;
}

.skill-card.offer-card > .card-link {
  padding-top: 16px;
}

.cartridge-name small,
#work-preview-tags span,
.work-control-hint,
.work-note,
.privacy-note p,
.credential p,
.step-output,
.project-type,
.picnic-caption > span,
.picnic-files span,
.project-id,
.art-note,
#work-preview-note,
.art-caption,
.contact-world > span {
  font-size: 13px;
  line-height: 1.6;
}

.work-console-bar,
.work-enhanced .seefood-demo-label,
.living-dialog-bar,
.living-dialog-eyebrow {
  font-size: 13px;
  line-height: 1.6;
}

.work-enhanced .picnic-controls button,
.picnic-controls button,
.picnic-open,
.picnic-ar,
.form-body label,
.form-actions .button,
.form-actions .copy-button {
  font-size: 15px;
  min-height: 44px;
}

.work-enhanced .picnic-turn button,
.work-enhanced .picnic-zoom button,
.picnic-turn button,
.picnic-zoom button {
  font-size: 22px;
}

summary {
  font-size: 18px;
  line-height: 1.55;
}

.form-body input,
.form-body select,
.form-body textarea {
  font-size: 17px;
  line-height: 1.6;
  min-height: 50px;
}

.optional,
.form-note,
.brief-intro,
#form-status,
#mission-summary-text,
#clear-mission,
.credential strong,
.footer-top p,
.back-top,
.footer-bottom p,
.footer-quest > span {
  font-size: 14px;
  line-height: 1.7;
}

.brief-intro {
  font-size: 17px;
}

.footer-bottom p {
  font-family: var(--sans);
}

@media (min-width: 761px) and (min-height: 481px) {
  .journey-copy,
  .journey-copy[data-chapter='1'],
  .journey-copy[data-chapter='2'] {
    top: 24px;
    left: 50%;
    width: min(880px, calc(100% - 64px));
    max-width: 880px;
    transform: translate(-50%, var(--copy-y, 0px));
  }

  .journey-copy::before {
    content: '';
    position: absolute;
    z-index: -1;
    top: -26px;
    left: 50%;
    width: 100vw;
    height: calc(100% + 32px);
    transform: translateX(-50%);
    background: linear-gradient(180deg, #f3f3eaf7 0%, #f0f3eaf0 48%, #eaf3efb3 76%, #eaf3ef00 100%);
    pointer-events: none;
  }

  .journey-copy .journey-title,
  .journey-copy h2,
  .journey-copy[data-chapter='1'] h2 {
    font-size: clamp(56px, 4.5vw, 68px);
  }

  .journey-footer {
    bottom: 20px;
  }

  .actor-motion-control {
    bottom: 24px;
    left: calc(var(--gutter, 24px) + 206px);
  }
}

@media (min-width: 761px) and (max-width: 1100px) and (min-height: 481px) {
  .journey-copy,
  .journey-copy[data-chapter='1'],
  .journey-copy[data-chapter='2'] {
    top: 20px;
    width: min(760px, calc(100% - 56px));
  }

  .journey-copy .journey-title,
  .journey-copy h2,
  .journey-copy[data-chapter='1'] h2 {
    font-size: 56px;
  }

  .journey-copy .journey-lede,
  .journey-copy[data-chapter='1'] .journey-lede,
  .journey-copy[data-chapter='2'] .journey-lede {
    max-width: 610px !important;
    font-size: 19px;
    margin: 12px auto 16px;
  }

  .journey-world-label {
    display: none;
  }

  .site-header nav {
    gap: 22px;
  }

  .navcta {
    gap: 14px;
    padding-left: 18px;
  }
}

/* Switch to the existing menu before larger navigation type runs out of room. */
@media (min-width: 901px) and (max-width: 1100px) {
  body.js-ready .site-header .menu-toggle {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 9px 14px;
    border: 1px solid #7e9184;
    background: transparent;
    color: var(--ink);
    font: 600 15px/1.5 var(--sans);
  }

  body.js-ready .site-header nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    padding: 20px var(--gutter);
    border-bottom: 1px solid var(--line);
    background: var(--paper);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }

  body.js-ready .site-header nav.is-open {
    display: flex;
  }

  .site-header nav > a {
    padding-block: 13px;
  }

  .site-header nav .navcta {
    margin-top: 10px;
    padding: 17px 0 13px;
    border-left: 0;
    border-top: 1px solid var(--line);
  }
}

@media (max-width: 760px), (max-height: 480px) {
  .journey-stage,
  .scene-ready .journey-stage {
    background: #edf3eb;
  }

  .journey-copy,
  .journey-copy[data-chapter='1'],
  .journey-copy[data-chapter='2'] {
    position: relative;
    inset: auto;
    width: 100%;
    max-width: 680px;
    margin-inline: auto;
    padding-bottom: 30px;
    transform: none !important;
  }

  .journey-copy::before {
    display: none;
  }

  .journey-copy .journey-title,
  .journey-copy h2,
  .journey-copy[data-chapter='1'] h2 {
    font-size: clamp(44px, 8.5vw, 60px);
    line-height: 1.08;
    letter-spacing: -.045em;
  }

  .journey-copy .eyebrow {
    font-size: 12px;
    margin-bottom: 14px;
    letter-spacing: .03em;
  }

  .journey-copy .journey-lede,
  .journey-copy[data-chapter='1'] .journey-lede,
  .journey-copy[data-chapter='2'] .journey-lede {
    font-size: 18px;
    line-height: 1.6;
    margin: 18px auto 20px;
    max-width: 540px !important;
  }

  .journey-copy > .actions,
  .journey-copy > .button,
  .journey-copy > .text-link {
    position: static;
    inset: auto;
  }

  .journey-copy > .actions {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 12px 24px;
  }

  .journey-copy > .button,
  .journey-copy > .actions .button,
  .journey-copy > .text-link,
  .journey-copy > .actions .text-link {
    font-size: 15px;
    min-height: 48px;
    gap: 16px;
  }

  .actor-motion-control {
    font-size: 13px;
    min-height: 44px;
    right: 16px;
    bottom: 4px;
  }

  .living-robot-label {
    font-size: 13px;
  }

  .journey-skip {
    font: 600 14px/1.5 var(--sans);
    min-height: 44px;
  }

  .intro-band > p {
    font-size: 15px;
    line-height: 1.6;
  }

  .intro-band > a {
    min-width: 44px;
    min-height: 44px;
    display: grid;
    place-items: center;
  }

  .work-preview-actions .button,
  .dialog-body .button,
  .living-dialog-cta {
    font-size: 15px;
  }

  .email {
    font-size: 17px;
    line-height: 1.6;
  }
}

@media (max-width: 500px) {
  .site-header .menu-toggle {
    font: 600 14px/1.5 var(--sans);
  }

  .journey-stage,
  .scene-ready .journey-stage {
    padding-top: 30px;
  }

  .journey-copy .journey-title,
  .journey-copy h2,
  .journey-copy[data-chapter='1'] h2 {
    font-size: 44px;
  }

  .journey-copy > .actions {
    flex-direction: column;
    gap: 8px;
  }

  .journey-copy > .actions .button {
    width: 100%;
    max-width: 315px;
    padding: 14px 18px;
  }

  .journey-copy > .actions .text-link {
    min-height: 44px;
  }

  .form-body label {
    font-size: 16px;
  }

  .form-body .optional {
    display: inline-block;
    margin-left: 7px;
    font-size: 13px;
  }

  .work-console-bar {
    font-size: 12px;
    gap: 10px;
  }

  .work-preview-actions {
    padding-top: 20px;
  }

  .skill-card.offer-card > .card-link,
  .offer-help .text-link {
    font-size: 15px;
  }

  .living-dialog-bar {
    font-size: 12px;
  }

  .living-terminal-code {
    font-size: 13px;
    line-height: 1.8;
  }
}

@media (max-width: 350px) {
  .journey-copy .journey-title,
  .journey-copy h2,
  .journey-copy[data-chapter='1'] h2 {
    font-size: 40px;
  }

  .journey-copy .eyebrow {
    font-size: 11px;
  }

  .email {
    font-size: 15px;
  }
}

@media (prefers-reduced-motion: reduce) and (min-width: 761px) and (min-height: 481px) {
  .journey-copy,
  .journey-copy[data-chapter='1'],
  .journey-copy[data-chapter='2'] {
    left: 0;
    right: 0;
    margin-inline: auto;
  }
}

/* A single headline keeps the centered planning room clear on larger screens. */
@media (min-width:761px) and (min-height:481px){
 .journey-copy br{display:none}
}
.journey-copy>.text-link,
.journey-copy>.actions .text-link,
.journey-copy[data-chapter='1']>.text-link{
 background:#f1f3e9f2;
 border:1px solid #52695c70;
 padding:12px 20px;
 box-shadow:none;
}
.journey-copy .text-link:hover{background:#e3edce;color:var(--ink)}
.seefood-stage .seefood-cover{object-fit:contain;background:#fff}
