/* Self-hosted Space Mono and Unbounded fonts (no external requests to Google Fonts). */
@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/space-mono-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/space-mono-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/space-mono-700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/space-mono-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('assets/fonts/unbounded-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('assets/fonts/unbounded-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/unbounded-700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/unbounded-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('assets/fonts/unbounded-800-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('assets/fonts/unbounded-800-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Shared type scale, layout rhythm, and brand chrome for every ULTARA STUDIO page. */
:root {
  --site-font-body: "Space Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --site-font-display: "Unbounded", system-ui, sans-serif;
  --site-max-w: 1180px;
}

html {
  font-family: var(--site-font-body) !important;
  font-size: 15px !important;
  scroll-padding-top: 88px;
}

body {
  font-family: var(--site-font-body) !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  color: #14101f;
  background: #f8f2e8;
}

/* Keyboard accessibility: skip link and focus-visible rings (WCAG 2.4.1 & 2.4.7) */
.skip-link {
  position: absolute;
  top: -100px;
  left: 16px;
  z-index: 9999;
  padding: 10px 16px;
  background: #14101f;
  color: #f8f2e8 !important;
  border: 2px solid #ffb892;
  border-radius: 8px;
  font-family: var(--site-font-body) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-decoration: none;
  transition: top 160ms ease;
}

.skip-link:focus {
  top: 12px;
}

a:focus-visible,
button:focus-visible,
summary:focus-visible,
.btn:focus-visible {
  outline: 2px solid #4d3471 !important;
  outline-offset: 3px !important;
}

.hero a:focus-visible,
.studio-intro a:focus-visible,
.service-intro a:focus-visible,
.game-hero a:focus-visible,
.game-support a:focus-visible,
.cta a:focus-visible,
.footer a:focus-visible {
  outline-color: #ffb892 !important;
}

p,
li {
  font-family: var(--site-font-body) !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
}

h1,
h2,
h3,
h4 {
  font-family: var(--site-font-display) !important;
  font-weight: 700 !important;
}

h1,
.hero h1,
.studio-intro h1,
.service-intro h1,
.game-hero h1,
.legal-page .legal-hero h1 {
  font-size: clamp(32px, 4.2vw, 52px) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.035em !important;
}

h2,
.story h2,
.contact h2,
.cta h2,
.studio-section h2,
.game-heading,
.app-store-gallery__head h2 {
  font-size: clamp(24px, 3vw, 36px) !important;
  line-height: 1.18 !important;
  letter-spacing: -0.03em !important;
}

.legal-page .panel h2 {
  font-size: clamp(20px, 2.2vw, 26px) !important;
  line-height: 1.25 !important;
  letter-spacing: -0.025em !important;
}

h3,
.svc h3,
.studio-card h3,
.product-card h3 {
  font-size: clamp(18px, 1.8vw, 21px) !important;
  line-height: 1.25 !important;
  letter-spacing: -0.02em !important;
}

/* Shared container grid across all pages */
.wrap,
.site-nav__inner.wrap,
.legal-page .legal-hero,
.legal-page .content,
.legal-page .footer__inner {
  width: min(var(--site-max-w), calc(100% - 48px)) !important;
  max-width: var(--site-max-w) !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}

/* Shared eyebrows, metadata, and captions */
.eyebrow,
.product-card__meta,
.svc__num {
  font-family: var(--site-font-body) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}

.eyebrow {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px !important;
}

.eyebrow::before {
  content: none !important;
}

.studio-intro .eyebrow,
.hero .eyebrow,
.game-hero .eyebrow,
.cta .eyebrow {
  color: #fff4ea !important;
  text-shadow: 0 1px 8px rgba(20, 16, 31, 0.45);
}

.studio-intro h1,
.studio-intro p,
.service-intro h1,
.service-intro p,
.legal-page .hero h1,
.legal-page .hero p,
.cta h2,
.cta p {
  text-shadow: 0 1px 10px rgba(20, 16, 31, 0.35);
}

figcaption,
.app-store-gallery figcaption,
.game-gallery figcaption {
  font-family: var(--site-font-body) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
}

.game-tagline {
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  color: #ffb892 !important;
  margin-bottom: 14px !important;
}

.game-facts span,
.facts-row,
.chip {
  font-family: var(--site-font-body) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.game-note,
.contact-secondary {
  font-size: 13px !important;
  line-height: 1.65 !important;
}

.product-card__link,
.studio-text-link {
  font-family: var(--site-font-body) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
}

/* Shared buttons across all pages */
button,
.btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 12px 20px !important;
  border-radius: 999px !important;
  font-family: var(--site-font-body) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  text-align: center;
}

/* Shared navigation header across all pages */
.site-nav {
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 100 !important;
  color: #14101f !important;
  background: rgba(248, 242, 232, 0.96) !important;
  backdrop-filter: saturate(130%) blur(12px);
  -webkit-backdrop-filter: saturate(130%) blur(12px);
  border-bottom: 1px solid rgba(20, 16, 31, 0.1) !important;
}

.site-nav__inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  min-height: 72px !important;
}

.site-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: inherit !important;
}

.site-brand__mark {
  display: block !important;
  width: 32px !important;
  height: 32px !important;
  flex: 0 0 auto !important;
}

.site-brand__name {
  font-family: var(--site-font-display) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.site-nav__links {
  display: flex !important;
  align-items: center !important;
  gap: 28px !important;
  font-family: var(--site-font-body) !important;
  font-size: 13px !important;
}

.site-nav__links a {
  opacity: 0.85;
  transition: opacity 160ms ease, color 160ms ease;
}

.site-nav__links a:hover {
  opacity: 1;
  color: #4d3471;
}

.site-menu {
  display: none !important;
  position: relative !important;
}

.site-menu summary {
  font-family: var(--site-font-body) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 10px 8px !important;
  cursor: pointer !important;
  list-style: none;
}

.site-menu > div {
  position: absolute !important;
  right: 0 !important;
  top: calc(100% + 4px) !important;
  display: grid !important;
  gap: 4px !important;
  min-width: 190px !important;
  padding: 12px !important;
  background: #f8f2e8 !important;
  color: #14101f !important;
  border: 1px solid #d9cab3 !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 32px rgba(20, 16, 31, 0.14) !important;
}

.site-menu a {
  display: block !important;
  padding: 10px 12px !important;
  font-size: 13px !important;
  border-radius: 8px;
}

.site-menu a:hover {
  background: rgba(77, 52, 113, 0.08);
}

/* Shared section & hero spacing */
.studio-intro,
.service-intro,
.legal-page .hero {
  padding-block: 56px !important;
  padding-inline: 0 !important;
}

.service-intro {
  background: radial-gradient(120% 90% at 15% 60%, #ffb892 0%, #f47b6b 18%, #e96e9a 38%, #7c5caa 62%, #2a1f4a 90%) !important;
  color: #f4e8d8 !important;
  border-bottom: none !important;
}

.service-intro .eyebrow {
  color: #ffb892 !important;
}

.service-intro h1 {
  max-width: 20ch !important;
}

.service-intro p {
  color: rgba(244, 232, 216, 0.88) !important;
  max-width: 60ch !important;
}

.game-page .game-hero,
body[style*="--accent"] .hero {
  min-height: 0 !important;
  padding-block: 64px !important;
  padding-inline: 0 !important;
}

.legal-page .legal-hero {
  gap: 14px !important;
}

.legal-page .legal-hero h1 {
  max-width: none !important;
}

.legal-page .content {
  padding-block: 48px !important;
  gap: 18px !important;
}

.legal-page .panel,
.studio-card,
.svc {
  padding: 24px !important;
  border-radius: 16px !important;
}

.legal-page .panel {
  gap: 14px !important;
  border-color: rgba(20, 16, 31, 0.12) !important;
  background: rgba(255, 255, 255, 0.55) !important;
}

/* Shared footer across all pages */
.footer {
  background: #14101f !important;
  color: #f4e8d8 !important;
  padding-block: 36px !important;
  padding-inline: 0 !important;
  border-top: 1px solid rgba(244, 232, 216, 0.1) !important;
}

.footer__row,
.footer-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 24px !important;
  flex-wrap: wrap !important;
}

.footer__links,
.footer-links {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 14px 20px !important;
  font-family: var(--site-font-body) !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: rgba(244, 232, 216, 0.78) !important;
  opacity: 1 !important;
}

.footer__links a:hover,
.footer-links a:hover {
  color: #ffffff !important;
}

footer p {
  font-size: 11px !important;
  line-height: 1.65 !important;
}

footer .entity,
footer .footer__entity {
  max-width: 90ch !important;
  margin: 20px 0 0 !important;
  color: rgba(244, 232, 216, 0.82) !important;
  font-size: 11px !important;
  line-height: 1.65 !important;
}

footer .entity a,
footer .footer__entity a {
  color: #f4e8d8 !important;
  text-decoration: underline !important;
  text-underline-offset: 4px !important;
}

footer .legal,
footer .footer__legal {
  margin-top: 14px !important;
  color: rgba(244, 232, 216, 0.72) !important;
  font-family: var(--site-font-body) !important;
  font-size: 10px !important;
  line-height: 1.6 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}

footer .domain-text {
  text-transform: none !important;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto !important;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

@media (max-width: 720px) {
  .wrap,
  .site-nav__inner.wrap,
  .legal-page .legal-hero,
  .legal-page .content,
  .legal-page .footer__inner {
    width: calc(100% - 32px) !important;
  }

  .site-nav__inner {
    min-height: 64px !important;
  }

  .site-nav__links {
    display: none !important;
  }

  .site-menu {
    display: block !important;
  }

  .studio-intro,
  .service-intro,
  .legal-page .hero,
  .game-page .game-hero,
  body[style*="--accent"] .hero {
    padding-block: 40px !important;
  }

  .legal-page .content {
    padding-block: 32px !important;
    gap: 14px !important;
  }

  .legal-page .panel,
  .studio-card,
  .svc {
    padding: 20px !important;
  }

  .footer__row,
  .footer-row {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 16px !important;
  }
}