:root {
  --bg: #050505;
  --bg-soft: #0a0a0a;
  --panel: #0d0d0f;
  --panel-2: #111114;
  --text: #f5f5f2;
  --muted: #a5a5a2;
  --line: rgba(255,255,255,.12);
  --line-strong: rgba(255,255,255,.22);
  --accent: #d9ff4a;
  --accent-2: #7a5cff;
  --reboot: #ffae1a;
  --go: #725cff;
  --max: 1240px;
  --radius: 28px;
  --shadow: 0 30px 80px rgba(0,0,0,.42);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  color: var(--text);
  background:
    radial-gradient(circle at 15% 8%, rgba(122,92,255,.10), transparent 30rem),
    radial-gradient(circle at 85% 24%, rgba(217,255,74,.06), transparent 28rem),
    var(--bg);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  line-height: 1.5;
  overflow-x: hidden;
}
body.nav-open { overflow: hidden; }
a { color: inherit; }
img { display: block; max-width: 100%; }
button, a { -webkit-tap-highlight-color: transparent; }
::selection { background: var(--accent); color: #050505; }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 999; background: white; color: black; padding: .75rem 1rem; border-radius: 8px; text-decoration: none; }
.skip-link:focus { top: 1rem; }

.noise {
  position: fixed;
  inset: 0;
  opacity: .035;
  pointer-events: none;
  z-index: 100;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}

.site-header {
  position: fixed;
  z-index: 90;
  top: 0;
  left: 0;
  right: 0;
  height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 clamp(1.2rem, 4vw, 4rem);
  border-bottom: 1px solid transparent;
  transition: background .3s ease, border-color .3s ease, backdrop-filter .3s ease;
}
.site-header.scrolled {
  background: rgba(5,5,5,.78);
  border-color: var(--line);
  backdrop-filter: blur(18px);
}
.brand { display: inline-flex; align-items: center; gap: .7rem; text-decoration: none; font-weight: 750; font-size: .82rem; letter-spacing: .18em; }
.brand-mark {
  display: inline-grid;
  place-items: center;
  width: 35px;
  height: 35px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  font-size: .67rem;
  letter-spacing: -.06em;
  font-weight: 900;
}
.site-nav { display: flex; align-items: center; gap: 1.7rem; }
.site-nav a { color: #c7c7c3; font-size: .82rem; text-decoration: none; transition: color .2s ease; }
.site-nav a:hover { color: white; }
.site-nav .nav-cta { color: #080808; background: var(--text); padding: .62rem .9rem; border-radius: 999px; font-weight: 700; }
.nav-toggle { display: none; }

.hero {
  position: relative;
  min-height: 100svh;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(380px, .92fr);
  grid-template-rows: 1fr auto;
  align-items: center;
  gap: 3rem;
  padding: 8rem clamp(1.4rem, 5vw, 5rem) 2rem;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
}
.hero-copy { z-index: 3; max-width: 850px; }
.eyebrow, .section-label {
  color: #bcbcb8;
  font-size: .72rem;
  font-weight: 750;
  letter-spacing: .2em;
  text-transform: uppercase;
}
.hero h1 {
  max-width: 1000px;
  margin: 1.1rem 0 1.4rem;
  font-size: clamp(3.7rem, 7.2vw, 8rem);
  line-height: .87;
  letter-spacing: -.072em;
  font-weight: 820;
}
.hero h1 span { color: #bdbdb9; }
.hero-lede { max-width: 710px; margin: 0; color: #c8c8c5; font-size: clamp(1.08rem, 1.55vw, 1.32rem); line-height: 1.58; }
.hero-actions, .contact-actions { display: flex; gap: .8rem; flex-wrap: wrap; margin-top: 2rem; }
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: .8rem 1.15rem;
  border-radius: 999px;
  border: 1px solid var(--line-strong);
  text-decoration: none;
  font-size: .86rem;
  font-weight: 750;
  transition: transform .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button-primary { color: #090909; background: var(--accent); border-color: var(--accent); }
.button-primary:hover { background: #e3ff70; }
.button-ghost { color: white; background: rgba(255,255,255,.035); }
.button-ghost:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.34); }

.hero-logo-wrap { position: relative; z-index: 2; justify-self: end; width: min(44vw, 630px); aspect-ratio: 1; }
.hero-logo-wrap img { position: relative; z-index: 2; width: 100%; height: 100%; object-fit: cover; border-radius: 36px; box-shadow: var(--shadow); border: 1px solid rgba(255,255,255,.09); }
.logo-halo { position: absolute; z-index: 1; inset: -10%; background: conic-gradient(from 120deg, rgba(122,92,255,.28), rgba(217,255,74,.08), transparent 55%, rgba(122,92,255,.22)); filter: blur(55px); opacity: .75; }
.hero-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.026) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.026) 1px, transparent 1px); background-size: 58px 58px; mask-image: linear-gradient(to bottom, black, transparent 80%); }
.hero-orbit { position: absolute; border: 1px solid rgba(255,255,255,.07); border-radius: 50%; }
.orbit-one { width: 65vw; aspect-ratio: 1; right: -17vw; top: -20vw; }
.orbit-two { width: 35vw; aspect-ratio: 1; right: 7vw; top: 11vw; border-color: rgba(217,255,74,.10); }
.hero-foot { z-index: 4; grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 1rem; color: #777773; font-size: .65rem; letter-spacing: .18em; }

.section { max-width: var(--max); margin: 0 auto; padding: clamp(5.5rem, 10vw, 10rem) clamp(1.4rem, 4vw, 3rem); }
.section-label { margin-bottom: 2.4rem; }
.manifesto-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(3rem, 8vw, 8rem); align-items: start; }
.manifesto-title h2, .projects-head h2, .games-head h2, .contact h2 {
  margin: 0;
  font-size: clamp(3rem, 6.2vw, 6.8rem);
  line-height: .94;
  letter-spacing: -.06em;
}
.manifesto-title h2 span { color: var(--accent); }
.manifesto-copy { max-width: 600px; padding-top: .5rem; }
.manifesto-copy p { color: #bdbdba; font-size: 1.08rem; }
.manifesto-copy .large-copy { color: white; font-size: clamp(1.45rem, 2.5vw, 2rem); line-height: 1.25; font-weight: 670; margin-top: 0; }
.studio-facts { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; margin-top: 2.5rem; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; background: var(--line); }
.studio-facts div { background: #080808; padding: 1.25rem; }
.studio-facts strong { display: block; font-size: 1.6rem; letter-spacing: -.03em; }
.studio-facts span { display: block; color: #8f8f8b; font-size: .72rem; margin-top: .15rem; }

.projects, .games, .identity, .contact { max-width: 1380px; }
.projects-head, .games-head { display: grid; grid-template-columns: 1.15fr .85fr; gap: 4rem; align-items: end; margin-bottom: 3rem; }
.projects-head .section-label, .games-head .section-label { margin-bottom: 2rem; }
.projects-head h2, .games-head h2 { font-size: clamp(3rem, 5.5vw, 6rem); }
.projects-head > p, .games-head > p { color: #a8a8a5; max-width: 520px; margin: 0 0 .6rem; font-size: 1.08rem; }

.flagship-card { display: grid; grid-template-columns: 1.05fr .95fr; min-height: 640px; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--panel); box-shadow: var(--shadow); }
.flagship-visual {
  position: relative;
  min-height: 620px;
  overflow: hidden;
  background:
    radial-gradient(circle at 28% 30%, rgba(122,92,255,.46), transparent 25%),
    radial-gradient(circle at 75% 75%, rgba(217,255,74,.12), transparent 30%),
    linear-gradient(145deg, #0c0b14, #050505 65%);
}
.flagship-visual::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size: 38px 38px; opacity: .6; }
.phone-frame { position: absolute; z-index: 3; width: 42%; height: 72%; min-width: 220px; left: 12%; top: 14%; border: 2px solid rgba(255,255,255,.22); border-radius: 38px; background: rgba(6,6,8,.72); box-shadow: 0 50px 90px rgba(0,0,0,.5); transform: rotate(-5deg); backdrop-filter: blur(10px); }
.phone-top { width: 26%; height: 5px; background: rgba(255,255,255,.22); border-radius: 9px; margin: 14px auto; }
.message { position: absolute; max-width: 70%; padding: .7rem .9rem; border-radius: 16px; font-size: .74rem; background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.08); }
.m1 { top: 22%; left: 10%; }
.m2 { top: 39%; right: 10%; background: rgba(122,92,255,.26); }
.m3 { top: 58%; left: 10%; color: #070707; background: var(--accent); font-weight: 900; letter-spacing: .08em; }
.typing { position: absolute; display: flex; gap: 4px; bottom: 12%; left: 10%; padding: .75rem 1rem; border-radius: 20px; background: rgba(255,255,255,.08); }
.typing i { width: 6px; height: 6px; border-radius: 50%; background: #a9a9a9; animation: blink 1.2s infinite ease-in-out; }
.typing i:nth-child(2) { animation-delay: .15s; }
.typing i:nth-child(3) { animation-delay: .3s; }
@keyframes blink { 0%, 60%, 100% { opacity: .35; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }
.tmb-title { position: absolute; z-index: 4; right: 7%; bottom: 9%; font-size: clamp(3.5rem, 7vw, 7rem); line-height: .72; text-align: right; font-weight: 900; letter-spacing: -.08em; mix-blend-mode: screen; }
.signal-line { position: absolute; z-index: 2; height: 1px; background: linear-gradient(90deg, transparent, rgba(217,255,74,.8), transparent); transform: rotate(-24deg); opacity: .35; }
.s1 { width: 80%; left: -10%; top: 20%; }.s2 { width: 90%; left: 10%; top: 47%; }.s3 { width: 70%; left: 30%; top: 72%; }
.flagship-content { padding: clamp(2rem, 5vw, 5rem); display: flex; flex-direction: column; justify-content: center; }
.pill { align-self: flex-start; padding: .45rem .7rem; border-radius: 999px; border: 1px solid rgba(217,255,74,.28); color: var(--accent); background: rgba(217,255,74,.06); font-size: .72rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.flagship-content h3 { margin: 1.2rem 0 .8rem; font-size: clamp(3.2rem, 6vw, 6.5rem); line-height: .9; letter-spacing: -.07em; }
.flagship-content p { color: #a9a9a6; }
.flagship-kicker { color: white !important; font-size: 1.22rem; line-height: 1.45; }
.feature-list { display: flex; flex-wrap: wrap; gap: .55rem; margin: 1.4rem 0 .6rem; }
.feature-list span { padding: .5rem .72rem; border-radius: 999px; background: rgba(255,255,255,.05); border: 1px solid var(--line); color: #d0d0cc; font-size: .76rem; }
.muted { color: #676763 !important; font-size: .8rem; }

.app-projects { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1.1rem; margin-top: 1.1rem; }
.app-card {
  position: relative;
  min-height: 560px;
  padding: clamp(1.3rem, 3vw, 2.1rem);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  text-decoration: none;
  transition: transform .25s ease, border-color .25s ease;
}
.app-card:hover { transform: translateY(-5px); border-color: rgba(255,255,255,.25); }
.app-card::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .72; }
.app-card-reboot { background: linear-gradient(145deg, #15100a, #090909 55%); }
.app-card-reboot::before { background: radial-gradient(circle at 78% 16%, rgba(255,174,26,.17), transparent 28rem); }
.app-card-go { background: linear-gradient(145deg, #100d20, #090909 58%); }
.app-card-go::before { background: radial-gradient(circle at 82% 18%, rgba(114,92,255,.28), transparent 28rem); }
.app-card-top, .app-logo, .app-copy, .app-linkline { position: relative; z-index: 2; }
.app-card-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.external-mark { color: #777; font-size: 1.2rem; }
.pill-reboot { color: #ffc04d; background: rgba(255,174,26,.07); border-color: rgba(255,174,26,.26); }
.pill-go { color: #b5aaff; background: rgba(114,92,255,.08); border-color: rgba(114,92,255,.32); }
.app-logo { min-height: 148px; display: flex; align-items: center; margin: 1.8rem 0 .8rem; padding: 1.4rem; border: 1px solid rgba(255,255,255,.07); border-radius: 20px; overflow: hidden; }
.app-logo-reboot { background: #080a0f; }
.app-logo-go { background: #2e2281; }
.app-logo-reboot img { width: min(100%, 380px); }
.app-logo-go img { width: min(100%, 680px); }
.app-copy h3 { margin: 1rem 0 .7rem; max-width: 540px; font-size: clamp(2.2rem, 4vw, 4.1rem); line-height: .94; letter-spacing: -.055em; }
.app-copy p { color: #a5a5a2; max-width: 650px; margin: 0; }
.app-card .feature-list { margin-top: 1.3rem; }
.app-linkline { margin-top: auto; padding-top: 1.6rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: #868681; font-size: .72rem; letter-spacing: .05em; border-top: 1px solid rgba(255,255,255,.08); }
.app-card-reboot:hover .app-linkline { color: #ffc04d; }
.app-card-go:hover .app-linkline { color: #b5aaff; }

.games-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.1rem; }
.game-card { display: block; padding: .8rem; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.024); text-decoration: none; transition: transform .25s ease, background .25s ease, border-color .25s ease; }
.game-card:hover { transform: translateY(-5px); background: rgba(255,255,255,.045); border-color: rgba(255,255,255,.22); }
.game-image { aspect-ratio: 460/215; overflow: hidden; border-radius: 15px; background: #111; }
.game-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease, filter .35s ease; }
.game-card:hover .game-image img { transform: scale(1.025); }
.game-meta { display: flex; justify-content: space-between; gap: 1rem; padding: .95rem .25rem 0; color: #72726f; font-size: .67rem; letter-spacing: .08em; text-transform: uppercase; }
.game-card h3 { margin: .45rem .25rem .25rem; font-size: 1.35rem; letter-spacing: -.03em; }
.game-card p { margin: 0 .25rem .8rem; color: #9b9b97; font-size: .88rem; }
.catalog-strip { margin-top: 1.1rem; padding: 1.4rem 1.5rem; display: flex; align-items: center; justify-content: space-between; gap: 2rem; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,.022); }
.catalog-kicker { color: #6d6d69; font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; }
.catalog-strip p { margin: .15rem 0 0; color: #c4c4c0; }

.identity-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; border: 1px solid var(--line); background: var(--line); border-radius: var(--radius); overflow: hidden; }
.identity-card { min-height: 370px; padding: 2.2rem; background: #090909; display: flex; flex-direction: column; }
.identity-number { color: #555551; font-size: .72rem; letter-spacing: .15em; }
.identity-card h3 { margin: auto 0 .6rem; font-size: clamp(2.2rem, 4vw, 4rem); letter-spacing: -.05em; }
.identity-card p { margin: 0; color: #92928e; max-width: 340px; }
.identity-card:nth-child(2) { background: linear-gradient(145deg, rgba(255,174,26,.09), #090909 55%); }
.identity-card:nth-child(3) { background: linear-gradient(145deg, rgba(114,92,255,.15), #090909 55%); }

.contact-shell { position: relative; overflow: hidden; padding: clamp(2.5rem, 7vw, 7rem); border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(140deg, #101012, #090909 60%); }
.contact-shell::after { content: "SG"; position: absolute; right: -2%; bottom: -25%; font-weight: 900; font-size: clamp(12rem, 28vw, 30rem); line-height: 1; letter-spacing: -.12em; color: rgba(255,255,255,.025); pointer-events: none; }
.contact h2 { position: relative; z-index: 2; max-width: 980px; font-size: clamp(3.2rem, 7vw, 7.5rem); }
.contact-shell > p:not(.eyebrow) { position: relative; z-index: 2; max-width: 690px; color: #a8a8a5; font-size: 1.05rem; }
.contact-actions { position: relative; z-index: 2; align-items: center; }
.text-link { color: #c8c8c5; font-size: .86rem; text-underline-offset: 4px; }

.site-footer { max-width: 1380px; margin: 0 auto; padding: 2rem clamp(1.4rem, 4vw, 3rem) 3rem; display: grid; grid-template-columns: 1fr auto; gap: 2rem; align-items: center; border-top: 1px solid var(--line); }
.footer-brand { display: flex; gap: .8rem; align-items: center; }
.footer-brand strong { display: block; font-size: .75rem; letter-spacing: .18em; }
.footer-brand small { display: block; color: #5d5d5a; font-size: .58rem; letter-spacing: .16em; margin-top: .2rem; }
.footer-links { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: flex-end; }
.footer-links a { color: #83837f; font-size: .76rem; text-decoration: none; }
.footer-links a:hover { color: white; }
.copyright { grid-column: 1/-1; margin: 0; color: #4f4f4c; font-size: .68rem; }

.reveal { opacity: 1; transform: none; }
.js .reveal { opacity: 0; transform: translateY(20px); transition: opacity .75s cubic-bezier(.2,.7,.2,1), transform .75s cubic-bezier(.2,.7,.2,1); }
.js .reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1050px) {
  .hero { grid-template-columns: 1fr .72fr; }
  .hero h1 { font-size: clamp(3.5rem, 7.5vw, 6.8rem); }
  .games-grid { grid-template-columns: repeat(2,1fr); }
  .flagship-card { grid-template-columns: 1fr 1fr; }
  .phone-frame { width: 50%; left: 8%; }
}

@media (max-width: 900px) {
  .app-projects { grid-template-columns: 1fr; }
  .app-card { min-height: 500px; }
}

@media (max-width: 820px) {
  .site-header { height: 68px; padding: 0 1.1rem; }
  .brand { font-size: .72rem; }
  .nav-toggle { display: grid; place-content: center; gap: 6px; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 50%; background: rgba(0,0,0,.4); color: white; }
  .nav-toggle span:not(.sr-only) { width: 17px; height: 1px; background: currentColor; transition: transform .2s ease; }
  .nav-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] span:nth-child(2) { transform: translateY(-3.5px) rotate(-45deg); }
  .site-nav { position: fixed; inset: 68px 0 0; padding: 2rem 1.2rem; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: .2rem; background: rgba(5,5,5,.98); transform: translateX(100%); visibility: hidden; pointer-events: none; transition: transform .28s ease, visibility .28s ease; }
  .site-nav.open { transform: translateX(0); visibility: visible; pointer-events: auto; }
  .site-nav a { padding: 1rem .4rem; font-size: 1.2rem; border-bottom: 1px solid var(--line); }
  .site-nav .nav-cta { text-align: center; margin-top: 1rem; border: 0; }

  .hero { min-height: auto; grid-template-columns: 1fr; grid-template-rows: auto auto auto; gap: 2.3rem; padding: 8rem 1.2rem 1.6rem; }
  .hero h1 { font-size: clamp(3.7rem, 15vw, 6.6rem); }
  .hero-logo-wrap { justify-self: stretch; width: 100%; max-width: 620px; }
  .hero-foot { font-size: .57rem; }
  .hero-foot span:nth-child(2) { display: none; }

  .section { padding: 5.5rem 1.2rem; }
  .manifesto-grid, .projects-head, .games-head { grid-template-columns: 1fr; gap: 2rem; }
  .flagship-card { grid-template-columns: 1fr; }
  .flagship-visual { min-height: 520px; }
  .flagship-content { padding: 2rem 1.4rem 2.6rem; }
  .identity-grid { grid-template-columns: 1fr; }
  .identity-card { min-height: 280px; }
  .site-footer { grid-template-columns: 1fr; }
  .footer-links { justify-content: flex-start; }
}

@media (max-width: 560px) {
  .hero h1 { font-size: clamp(3.35rem, 16vw, 5.3rem); }
  .hero-lede { font-size: 1.02rem; }
  .hero-actions .button { width: 100%; }
  .studio-facts { grid-template-columns: 1fr; }
  .games-grid { grid-template-columns: 1fr; }
  .catalog-strip { align-items: stretch; flex-direction: column; }
  .catalog-strip .button { width: 100%; }
  .flagship-visual { min-height: 440px; }
  .phone-frame { width: 56%; height: 68%; min-width: 190px; left: 6%; top: 13%; }
  .tmb-title { right: 5%; bottom: 8%; font-size: clamp(3.2rem, 19vw, 5.5rem); }
  .app-card { min-height: 0; padding: 1.05rem; }
  .app-logo { min-height: 115px; margin: 1.2rem 0 .5rem; padding: 1rem; }
  .app-copy h3 { font-size: clamp(2.3rem, 12vw, 3.4rem); }
  .app-linkline { align-items: flex-start; flex-direction: column; gap: .2rem; }
  .contact-actions .button { width: 100%; font-size: .8rem; }
}

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


@media (max-width:820px) { .header-actions { margin-left:auto; } }
@media (max-width:470px) { .brand>span:last-child { display:none; } }


/* Project & press pages */
.project-hero { min-height: 100svh; padding-top: 10rem; display:grid; grid-template-columns:1fr 1fr; gap:clamp(2.5rem,7vw,7rem); align-items:center; }
.project-hero-copy h1 { margin:.85rem 0 1rem; font-size:clamp(4rem,8vw,8.5rem); line-height:.86; letter-spacing:-.075em; }
.project-kicker { color:#fff; max-width:720px; font-size:clamp(1.3rem,2.4vw,2rem); line-height:1.2; font-weight:700; }
.project-description { color:var(--muted); max-width:720px; font-size:1.08rem; }
.project-page-actions,.project-card-actions { display:flex; gap:.8rem; flex-wrap:wrap; align-items:center; margin-top:1.8rem; }
.project-card-actions .text-link { text-decoration:none; }
.project-hero-art { position:relative; min-height:560px; display:grid; place-items:center; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:#0b0b0d; }
.project-tmb .project-hero-art { background:radial-gradient(circle at 30% 25%,rgba(122,92,255,.45),transparent 26%),radial-gradient(circle at 75% 80%,rgba(217,255,74,.12),transparent 30%),#08080c; }
.project-reboot .project-hero-art { background:radial-gradient(circle at 70% 20%,rgba(255,174,26,.2),transparent 34%),#080a0f; }
.project-go .project-hero-art { background:radial-gradient(circle at 70% 20%,rgba(114,92,255,.34),transparent 35%),#120d29; }
.project-phone { position:absolute; inset:0; }
.project-phone .phone-frame { left:12%; top:13%; width:42%; height:72%; }
.project-giant-word { position:absolute; right:6%; bottom:8%; z-index:4; font-weight:900; font-size:clamp(4rem,8vw,8rem); line-height:.72; letter-spacing:-.08em; text-align:right; }
.project-logo-panel { width:min(82%,760px); padding:clamp(2rem,5vw,5rem); border-radius:28px; border:1px solid rgba(255,255,255,.1); }
.reboot-panel { background:#080a0f; }.go-panel { background:#2e2281; }
.project-logo-panel img { width:100%; height:auto; }
.app-linkline a { color:inherit; text-decoration:none; }
.app-linkline a:hover { color:white; }
.press-hero { padding-top:12rem; padding-bottom:5rem; }
.press-hero h1 { margin:1rem 0 1.5rem; font-size:clamp(4rem,8.5vw,9rem); line-height:.84; letter-spacing:-.075em; }
.press-hero h1 span { color:var(--accent); }.press-hero>p:last-child{max-width:720px;color:var(--muted);font-size:1.2rem}
.press-grid { padding-top:0; display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.press-block { border:1px solid var(--line); border-radius:24px; padding:clamp(1.5rem,4vw,3rem); background:rgba(255,255,255,.025); }
.press-block h2 { margin:.75rem 0 1rem; font-size:clamp(2rem,4vw,4rem); line-height:.95; letter-spacing:-.05em; }.press-block p{color:var(--muted);max-width:760px}
.press-wide { grid-column:1/-1; }.press-facts { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; border:1px solid var(--line); background:var(--line); border-radius:16px; overflow:hidden; }.press-facts span{background:#090909;padding:1.2rem;color:#d5d5d1}
.press-projects { display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; }.press-projects a{padding:1.4rem;border:1px solid var(--line);border-radius:16px;text-decoration:none;background:#090909}.press-projects strong,.press-projects span{display:block}.press-projects span{margin-top:.35rem;color:#777;font-size:.75rem}
.asset-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; margin:1.5rem 0; }.asset-grid>a{border:1px solid var(--line);border-radius:18px;overflow:hidden;text-decoration:none;background:#090909}.asset-grid>a>img,.asset-pad{width:100%;aspect-ratio:1.6;object-fit:cover}.asset-pad{display:grid;place-items:center;padding:1.5rem}.asset-pad img{max-height:100%;max-width:100%}.asset-reboot{background:#080a0f}.asset-go{background:#2e2281}.asset-grid>a>span{display:block;padding:.9rem 1rem;color:#a6a6a2;font-size:.78rem}
@media(max-width:820px){.project-hero{grid-template-columns:1fr;padding-top:8rem}.project-hero-art{min-height:480px}.press-grid{grid-template-columns:1fr}.press-wide{grid-column:auto}.press-projects,.asset-grid{grid-template-columns:1fr}.press-facts{grid-template-columns:1fr}}

/* =========================================================
   2026 project-page rebuild + scroll-reactive project worlds
   ========================================================= */
:root {
  --tmb: #ff4f9a;
  --tmb-violet: #765dff;
  --reboot-gold: #ffae1a;
  --go-violet: #725cff;
  --go-cyan: #58d7ff;
}

.project-atmosphere {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: 0;
  transition: opacity .7s ease, background .7s ease;
}
.project-atmosphere::before,
.project-atmosphere::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: .7;
  transition: background .7s ease, transform .9s cubic-bezier(.2,.7,.2,1);
}
.project-atmosphere::before { width: 44vw; height: 44vw; min-width: 420px; min-height: 420px; left: -12vw; top: 18vh; }
.project-atmosphere::after { width: 48vw; height: 48vw; min-width: 440px; min-height: 440px; right: -14vw; bottom: -10vh; }

body[data-project-theme="tmb"] .project-atmosphere {
  opacity: .9;
  background: linear-gradient(180deg, rgba(255,79,154,.025), rgba(118,93,255,.018));
}
body[data-project-theme="tmb"] .project-atmosphere::before { background: rgba(255,79,154,.14); transform: translate3d(8vw,-2vh,0); }
body[data-project-theme="tmb"] .project-atmosphere::after { background: rgba(118,93,255,.14); transform: translate3d(-8vw,0,0); }
body[data-project-theme="reboot"] .project-atmosphere {
  opacity: .9;
  background: linear-gradient(180deg, rgba(255,174,26,.028), rgba(255,106,0,.015));
}
body[data-project-theme="reboot"] .project-atmosphere::before { background: rgba(255,174,26,.14); transform: translate3d(10vw,4vh,0); }
body[data-project-theme="reboot"] .project-atmosphere::after { background: rgba(255,99,0,.09); transform: translate3d(-10vw,-4vh,0); }
body[data-project-theme="go"] .project-atmosphere {
  opacity: .95;
  background: linear-gradient(180deg, rgba(114,92,255,.035), rgba(88,215,255,.012));
}
body[data-project-theme="go"] .project-atmosphere::before { background: rgba(114,92,255,.18); transform: translate3d(8vw,1vh,0); }
body[data-project-theme="go"] .project-atmosphere::after { background: rgba(88,215,255,.09); transform: translate3d(-8vw,-4vh,0); }

body[data-project-theme] .site-header.scrolled { background: rgba(5,5,7,.82); }
body[data-project-theme="tmb"] .site-header.scrolled { box-shadow: 0 14px 45px rgba(255,79,154,.045); }
body[data-project-theme="reboot"] .site-header.scrolled { box-shadow: 0 14px 45px rgba(255,174,26,.045); }
body[data-project-theme="go"] .site-header.scrolled { box-shadow: 0 14px 45px rgba(114,92,255,.065); }

/* Let each current project bend the Shoho visual language while it is centered. */
.flagship-card,
.app-card { transition: transform .35s ease, border-color .5s ease, box-shadow .5s ease, background .5s ease; }
body[data-project-theme="tmb"] .flagship-card { border-color: rgba(255,79,154,.38); box-shadow: 0 34px 95px rgba(255,79,154,.10), var(--shadow); }
body[data-project-theme="reboot"] .app-card-reboot { border-color: rgba(255,174,26,.42); box-shadow: 0 30px 80px rgba(255,174,26,.09); }
body[data-project-theme="go"] .app-card-go { border-color: rgba(114,92,255,.52); box-shadow: 0 30px 85px rgba(114,92,255,.13); }

.flagship-visual {
  background:
    radial-gradient(circle at 24% 25%, rgba(255,79,154,.38), transparent 27%),
    radial-gradient(circle at 78% 76%, rgba(118,93,255,.20), transparent 31%),
    linear-gradient(145deg, #100810, #050507 67%);
}
.flagship-visual .m2 { background: rgba(255,79,154,.22); }
.flagship-visual .m3 { background: var(--tmb); color: #090509; }
.flagship-visual .signal-line { background: linear-gradient(90deg, transparent, rgba(255,79,154,.86), transparent); }
.flagship-visual .phone-frame { border-color: rgba(255,255,255,.27); box-shadow: 0 50px 90px rgba(0,0,0,.55), 0 0 45px rgba(255,79,154,.10); }

/* Rebuilt project pages */
.project-page {
  min-height: 100vh;
  background: #050505;
}
.project-page .project-atmosphere-static { opacity: .95; }
.project-main { position: relative; z-index: 1; }
.project-hero-v2 {
  width: min(1480px, calc(100% - 3rem));
  min-height: min(900px, 100svh);
  margin: 0 auto;
  padding: 9.5rem 0 4.5rem;
  display: grid;
  grid-template-columns: minmax(0,.94fr) minmax(420px,1.06fr);
  gap: clamp(2.5rem,6vw,6rem);
  align-items: center;
}
.project-hero-v2 > * { min-width: 0; }
.project-hero-copy { position: relative; z-index: 3; }
.project-hero-copy .eyebrow { margin: 0 0 1.2rem; }
.project-pill { display: inline-flex; margin-bottom: 1.35rem; }
.project-display-title {
  margin: 0 0 1.45rem;
  max-width: 860px;
  font-size: clamp(4.1rem,7.1vw,8.1rem);
  line-height: .82;
  letter-spacing: -.075em;
  font-weight: 880;
  text-wrap: balance;
}
.project-display-title span { display: block; color: rgba(255,255,255,.70); }
.project-display-title small {
  display: block;
  margin-top: .42rem;
  font-size: .29em;
  line-height: 1;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.55);
}
.project-display-title-go { font-size: clamp(3.3rem,5.8vw,6.5rem); letter-spacing: -.065em; }
.project-display-title-go span { color: #c5bcff; }
.project-tmb .project-display-title span { color: #ff93c2; }
.project-reboot .project-display-title span { color: var(--reboot-gold); }

.project-hero-v2 .project-kicker {
  margin: 0 0 1rem;
  max-width: 720px;
  color: #f7f7f5;
  font-size: clamp(1.25rem,2vw,1.8rem);
  font-weight: 720;
  line-height: 1.25;
}
.project-hero-v2 .project-description {
  max-width: 720px;
  margin: 0;
  color: #aaa9a6;
  font-size: clamp(1rem,1.2vw,1.1rem);
  line-height: 1.68;
}
.project-feature-row {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: 1.7rem;
}
.project-feature-row span {
  padding: .62rem .82rem;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  color: #d1d1cd;
  background: rgba(255,255,255,.028);
  font-size: .75rem;
}
.project-tmb .project-feature-row span { border-color: rgba(255,79,154,.22); }
.project-reboot .project-feature-row span { border-color: rgba(255,174,26,.22); }
.project-go .project-feature-row span { border-color: rgba(114,92,255,.30); }
.project-page-actions { margin-top: 2rem; }
.project-tmb .project-primary { background: var(--tmb); border-color: var(--tmb); }
.project-tmb .project-primary:hover { background: #ff79b3; }
.project-reboot .project-primary { background: var(--reboot-gold); border-color: var(--reboot-gold); }
.project-reboot .project-primary:hover { background: #ffc24f; }
.project-go .project-primary { background: #8b78ff; border-color: #8b78ff; color: #fff; }
.project-go .project-primary:hover { background: #a394ff; }

.project-hero-v2 .project-hero-art {
  position: relative;
  min-height: 610px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 34px;
  overflow: hidden;
  isolation: isolate;
  box-shadow: 0 40px 110px rgba(0,0,0,.44);
}
.project-hero-v2 .project-hero-art::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.8), transparent 86%);
  z-index: 8;
}

/* Text Me Back project art */
.project-art-tmb { background: #0a070b; }
.tmb-project-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 24%; filter:saturate(.78) contrast(1.05) brightness(.66); }
.tmb-project-vignette { position:absolute; inset:0; z-index:2; background:linear-gradient(90deg,rgba(6,4,7,.3),rgba(6,4,7,.05) 42%,rgba(6,4,7,.58)),linear-gradient(0deg,rgba(5,4,6,.76),transparent 55%),radial-gradient(circle at 22% 25%,rgba(255,79,154,.25),transparent 35%); }
.tmb-project-phone { position:absolute; z-index:4; left:7%; bottom:8%; width:min(41%,290px); aspect-ratio:.54; border-radius:34px; border:1px solid rgba(255,255,255,.3); background:rgba(10,7,12,.55); backdrop-filter:blur(14px); transform:rotate(-5deg); box-shadow:0 36px 80px rgba(0,0,0,.55),0 0 55px rgba(255,79,154,.12); }
.mini-phone-bar { width:28%; height:4px; margin:14px auto; border-radius:20px; background:rgba(255,255,255,.24); }
.mini-message { position:absolute; padding:.62rem .72rem; border-radius:14px; font-size:.66rem; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.08); }
.mini-message-a { left:9%; top:24%; }
.mini-message-b { right:9%; top:43%; background:rgba(118,93,255,.28); }
.mini-message-c { left:9%; top:63%; background:var(--tmb); color:#160812; font-weight:900; letter-spacing:.09em; }
.tmb-project-wordmark { position:absolute; z-index:5; right:5%; bottom:7%; text-align:right; font-size:clamp(4.2rem,7vw,7.5rem); line-height:.72; letter-spacing:-.08em; font-weight:900; text-shadow:0 10px 50px rgba(0,0,0,.55); }

/* RebootRanks project art */
.project-art-reboot { background:radial-gradient(circle at 70% 18%,rgba(255,174,26,.20),transparent 32%),linear-gradient(145deg,#12100c,#07090d 64%); }
.reboot-grid-lines { position:absolute; inset:0; opacity:.38; background-image:linear-gradient(rgba(255,174,26,.10) 1px,transparent 1px),linear-gradient(90deg,rgba(255,174,26,.10) 1px,transparent 1px); background-size:56px 56px; transform:perspective(700px) rotateX(62deg) scale(1.4); transform-origin:center bottom; }
.reboot-visual-logo { position:absolute; z-index:5; left:8%; top:9%; width:min(58%,430px); padding:1rem 1.1rem; border:1px solid rgba(255,174,26,.16); border-radius:18px; background:rgba(7,9,13,.68); backdrop-filter:blur(12px); }
.reboot-visual-logo img { width:100%; height:auto; }
.rank-stack { position:absolute; z-index:4; inset:27% 7% 8% 14%; display:flex; flex-direction:column; justify-content:center; gap:.72rem; }
.rank-step { display:flex; align-items:center; gap:1rem; min-height:66px; padding:.85rem 1rem; border:1px solid rgba(255,174,26,.15); border-radius:16px; background:linear-gradient(90deg,rgba(255,174,26,.11),rgba(7,8,10,.86)); box-shadow:0 15px 40px rgba(0,0,0,.22); }
.rank-step b { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; border-radius:10px; color:#120b00; background:var(--reboot-gold); font-size:.74rem; }
.rank-step span { color:#f0eee8; font-size:.86rem; font-weight:720; letter-spacing:.04em; text-transform:uppercase; }
.rank-step-2 { transform:translateX(6%); }
.rank-step-3 { transform:translateX(12%); }
.rank-step-4 { transform:translateX(18%); }
.reboot-orbit { position:absolute; border-radius:50%; border:1px solid rgba(255,174,26,.14); }
.reboot-orbit-a { width:420px; height:420px; right:-180px; top:-120px; }
.reboot-orbit-b { width:280px; height:280px; right:-70px; top:-30px; }

/* GO INTERNATIONAL project art */
.project-art-go { background:radial-gradient(circle at 50% 48%,rgba(114,92,255,.30),transparent 38%),linear-gradient(145deg,#171035,#090815 70%); }
.world-orbit { position:absolute; left:50%; top:48%; border:1px solid rgba(177,166,255,.18); border-radius:50%; transform:translate(-50%,-50%) rotate(-12deg); }
.world-orbit-1 { width:78%; aspect-ratio:1; }
.world-orbit-2 { width:60%; aspect-ratio:1; transform:translate(-50%,-50%) rotate(36deg) scaleY(.56); }
.world-orbit-3 { width:90%; aspect-ratio:1; transform:translate(-50%,-50%) rotate(-42deg) scaleY(.44); }
.go-world-core { position:absolute; z-index:3; left:50%; top:48%; width:min(42%,285px); aspect-ratio:1; transform:translate(-50%,-50%); border-radius:50%; border:1px solid rgba(255,255,255,.2); background:radial-gradient(circle at 32% 25%,rgba(255,255,255,.22),transparent 18%),linear-gradient(145deg,#7d69ff,#4431b4); box-shadow:0 0 90px rgba(114,92,255,.28); overflow:hidden; display:grid; place-items:center; }
.go-world-grid { position:absolute; inset:-12%; border-radius:50%; opacity:.35; background-image:linear-gradient(rgba(255,255,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px); background-size:32px 32px; transform:rotate(22deg); }
.go-world-core>span { position:relative; z-index:2; font-size:clamp(3rem,7vw,6rem); color:#fff; text-shadow:0 10px 30px rgba(0,0,0,.25); }
.go-visual-logo { position:absolute; z-index:5; left:7%; right:7%; bottom:7%; padding:1.2rem 1.4rem; border-radius:18px; border:1px solid rgba(255,255,255,.12); background:rgba(24,17,61,.72); backdrop-filter:blur(14px); }
.go-visual-logo img { width:100%; height:auto; }
.go-chip { position:absolute; z-index:6; padding:.62rem .78rem; border-radius:999px; border:1px solid rgba(255,255,255,.15); background:rgba(11,9,28,.74); backdrop-filter:blur(10px); color:#e8e5ff; font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; }
.go-chip-a { left:7%; top:15%; }
.go-chip-b { right:6%; top:23%; }
.go-chip-c { left:11%; top:67%; }

.project-bottom-band {
  width: min(1480px, calc(100% - 3rem));
  margin: 0 auto 6rem;
  padding: 1rem;
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  border-top: 1px solid rgba(255,255,255,.10);
  border-bottom: 1px solid rgba(255,255,255,.10);
}
.project-bottom-band span { color:#747470; font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; }
.project-bottom-band span + span::before { content:"•"; margin-right:.65rem; color:#3f3f3c; }

/* Press page cleanup */
.press-page .press-hero { width:min(1480px,calc(100% - 3rem)); max-width:none; }
.press-page .press-grid { width:min(1480px,calc(100% - 3rem)); max-width:none; }
.press-block { overflow:hidden; }
.press-projects a,
.asset-grid>a { min-width:0; }
.press-projects strong { overflow-wrap:anywhere; }
.asset-pad img { object-fit:contain; }

@media (max-width: 1050px) {
  .project-hero-v2 { grid-template-columns:minmax(0,.95fr) minmax(360px,1.05fr); gap:2.4rem; }
  .project-display-title { font-size:clamp(3.6rem,7vw,6.5rem); }
  .project-display-title-go { font-size:clamp(3rem,5.4vw,5rem); }
  .project-hero-v2 .project-hero-art { min-height:540px; }
  .rank-step-4 { transform:translateX(12%); }
}

@media (max-width: 820px) {
  .project-atmosphere::before,.project-atmosphere::after { filter:blur(65px); }
  .project-hero-v2 {
    width:min(100% - 2.2rem,720px);
    min-height:0;
    grid-template-columns:1fr;
    gap:2.3rem;
    padding:8.5rem 0 3rem;
  }
  .project-display-title { font-size:clamp(3.65rem,15vw,6rem); }
  .project-display-title-go { font-size:clamp(2.9rem,12.5vw,5rem); }
  .project-hero-v2 .project-hero-art { min-height:520px; border-radius:26px; }
  .project-bottom-band { width:calc(100% - 2.2rem); margin-bottom:4rem; }
  .tmb-project-wordmark { font-size:clamp(4.2rem,18vw,6.5rem); }
  .tmb-project-phone { width:38%; }
  .rank-stack { inset:27% 6% 8% 9%; }
  .rank-step-2,.rank-step-3,.rank-step-4 { transform:none; }
  .press-page .press-hero,.press-page .press-grid { width:calc(100% - 2.2rem); }
}

@media (max-width: 560px) {
  .project-hero-v2 { width:calc(100% - 1.6rem); padding-top:7.4rem; }
  .project-display-title { font-size:clamp(3.25rem,17vw,5rem); }
  .project-display-title-go { font-size:clamp(2.6rem,13vw,4.2rem); overflow-wrap:normal; }
  .project-hero-v2 .project-kicker { font-size:1.18rem; }
  .project-page-actions .button { width:100%; }
  .project-hero-v2 .project-hero-art { min-height:430px; border-radius:22px; }
  .tmb-project-phone { left:5%; bottom:6%; width:43%; border-radius:25px; }
  .tmb-project-wordmark { right:4%; bottom:6%; font-size:clamp(3.4rem,19vw,5.2rem); }
  .reboot-visual-logo { left:6%; top:7%; width:72%; }
  .rank-stack { inset:28% 5% 5% 6%; gap:.5rem; }
  .rank-step { min-height:58px; padding:.7rem .8rem; }
  .rank-step b { flex-basis:32px; width:32px; height:32px; }
  .rank-step span { font-size:.72rem; }
  .go-world-core { width:48%; }
  .go-chip { font-size:.55rem; }
  .go-chip-a { left:4%; top:13%; }.go-chip-b{right:4%;top:23%}.go-chip-c{left:7%;top:65%}
  .go-visual-logo { left:5%; right:5%; bottom:5%; padding:.9rem 1rem; }
  .project-bottom-band { width:calc(100% - 1.6rem); padding:.8rem 0; }
  .project-bottom-band span { font-size:.61rem; }
  .press-page .press-hero,.press-page .press-grid { width:calc(100% - 1.6rem); }
}

/* Current work reads as three consecutive worlds, so scroll can transition through them. */
@media (min-width: 901px) {
  .app-projects { grid-template-columns: 1fr; gap: 1.1rem; }
  .app-card {
    min-height: 500px;
    display: grid;
    grid-template-columns: minmax(280px,.82fr) minmax(0,1.18fr);
    grid-template-rows: auto 1fr auto;
    column-gap: clamp(2rem,5vw,5rem);
    row-gap: 1rem;
    align-items: center;
  }
  .app-card-top { grid-column: 1 / -1; grid-row: 1; }
  .app-logo { grid-column: 1; grid-row: 2; margin: 0; min-height: 250px; justify-content: center; }
  .app-copy { grid-column: 2; grid-row: 2; align-self: center; }
  .app-copy h3 { font-size: clamp(3rem,5vw,5.6rem); }
  .app-copy p { font-size: 1.03rem; line-height: 1.65; }
  .app-linkline { grid-column: 1 / -1; grid-row: 3; margin-top: 0; }
  .app-logo-reboot img { width: min(90%,440px); }
  .app-logo-go img { width: min(94%,680px); }
}

/* Keep ambient project color above the base page background but behind all content. */
.project-atmosphere { z-index: 0; }
body > main,
body > .site-footer { position: relative; z-index: 1; }

/* =========================================================
   V4 VISUAL SYSTEM: project worlds + robust standalone pages
   This file is intentionally versioned so deployment cannot
   accidentally keep an older cached stylesheet.
   ========================================================= */

/* Strong, unmistakable project-world transitions on the homepage. */
.projects {
  position: relative;
  isolation: isolate;
}
.projects::before {
  content: "";
  position: absolute;
  z-index: -2;
  top: -5rem;
  bottom: -5rem;
  left: calc(50% - 50vw);
  right: calc(50% - 50vw);
  opacity: 0;
  transition: opacity .55s ease, background .7s ease;
  pointer-events: none;
}
.projects::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -2rem;
  bottom: -2rem;
  left: calc(50% - 50vw);
  right: calc(50% - 50vw);
  opacity: 0;
  pointer-events: none;
  transition: opacity .55s ease;
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, transparent, #000 10%, #000 90%, transparent);
}
body[data-project-theme="tmb"] .projects::before {
  opacity: 1;
  background:
    radial-gradient(circle at 10% 30%, rgba(255,62,151,.18), transparent 34rem),
    radial-gradient(circle at 88% 68%, rgba(118,93,255,.17), transparent 36rem),
    linear-gradient(180deg, rgba(23,7,21,.88), rgba(7,5,10,.90));
}
body[data-project-theme="tmb"] .projects::after {
  opacity: .5;
  background-image:
    linear-gradient(rgba(255,94,171,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,94,171,.04) 1px, transparent 1px);
}
body[data-project-theme="reboot"] .projects::before {
  opacity: 1;
  background:
    radial-gradient(circle at 12% 42%, rgba(255,174,26,.19), transparent 31rem),
    radial-gradient(circle at 85% 55%, rgba(255,96,0,.105), transparent 34rem),
    linear-gradient(180deg, rgba(24,15,4,.91), rgba(6,7,8,.94));
}
body[data-project-theme="reboot"] .projects::after {
  opacity: .62;
  background-image:
    linear-gradient(rgba(255,174,26,.075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,174,26,.06) 1px, transparent 1px);
}
body[data-project-theme="go"] .projects::before {
  opacity: 1;
  background:
    radial-gradient(circle at 15% 38%, rgba(114,92,255,.24), transparent 35rem),
    radial-gradient(circle at 86% 54%, rgba(88,215,255,.11), transparent 34rem),
    linear-gradient(180deg, rgba(15,11,41,.94), rgba(6,6,13,.94));
}
body[data-project-theme="go"] .projects::after {
  opacity: .48;
  background-image:
    radial-gradient(circle at center, rgba(180,171,255,.22) 0 1px, transparent 1.5px);
  background-size: 32px 32px;
}

body[data-project-theme="tmb"] .projects-head .section-label,
body[data-project-theme="tmb"] .brand-mark { color:#ff76b5; }
body[data-project-theme="reboot"] .projects-head .section-label,
body[data-project-theme="reboot"] .brand-mark { color:#ffb52e; }
body[data-project-theme="go"] .projects-head .section-label,
body[data-project-theme="go"] .brand-mark { color:#a79aff; }
body[data-project-theme="tmb"] .brand-mark { border-color:rgba(255,79,154,.50); box-shadow:0 0 28px rgba(255,79,154,.12); }
body[data-project-theme="reboot"] .brand-mark { border-color:rgba(255,174,26,.52); box-shadow:0 0 28px rgba(255,174,26,.12); }
body[data-project-theme="go"] .brand-mark { border-color:rgba(114,92,255,.58); box-shadow:0 0 30px rgba(114,92,255,.15); }

/* Give every project its own visual grammar even before it becomes the active scroll world. */
.flagship-card[data-project-theme="tmb"] {
  background:
    radial-gradient(circle at 95% 12%, rgba(255,79,154,.09), transparent 34%),
    linear-gradient(145deg,#130a12,#0b0a0f 60%);
  border-color: rgba(255,79,154,.20);
}
.flagship-card[data-project-theme="tmb"] .feature-list span {
  border-color:rgba(255,79,154,.20);
  background:rgba(255,79,154,.055);
}
.flagship-card[data-project-theme="tmb"] .pill { color:#ff8fc1; border-color:rgba(255,79,154,.30); background:rgba(255,79,154,.07); }
.flagship-card[data-project-theme="tmb"] .button-primary { background:#ff4f9a; border-color:#ff4f9a; color:#11070d; }

.app-card-reboot {
  border-color:rgba(255,174,26,.20);
  background:
    linear-gradient(rgba(255,174,26,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,174,26,.035) 1px, transparent 1px),
    radial-gradient(circle at 78% 16%,rgba(255,174,26,.17),transparent 30rem),
    linear-gradient(145deg,#181007,#08090b 61%);
  background-size:44px 44px,44px 44px,auto,auto;
}
.app-card-reboot .feature-list span { border-color:rgba(255,174,26,.21); background:rgba(255,174,26,.045); }
.app-card-reboot .app-copy h3 { color:#ffd074; }

.app-card-go {
  border-color:rgba(114,92,255,.28);
  background:
    radial-gradient(circle at 86% 17%, rgba(88,215,255,.08), transparent 25rem),
    radial-gradient(circle at 70% 28%, rgba(114,92,255,.26), transparent 32rem),
    linear-gradient(145deg,#171038,#090914 62%);
}
.app-card-go::after {
  content:"";
  position:absolute;
  width:330px;
  height:330px;
  right:-120px;
  top:80px;
  border:1px solid rgba(180,170,255,.13);
  border-radius:50%;
  box-shadow:0 0 0 54px rgba(137,119,255,.025), 0 0 0 108px rgba(137,119,255,.018);
  pointer-events:none;
}
.app-card-go .feature-list span { border-color:rgba(114,92,255,.25); background:rgba(114,92,255,.055); }
.app-card-go .app-copy h3 { color:#c9c2ff; }

body[data-project-theme="tmb"] .flagship-card[data-project-theme="tmb"],
body[data-project-theme="reboot"] .app-card-reboot,
body[data-project-theme="go"] .app-card-go {
  transform:translateY(-2px);
}

/* Standalone project pages: each one is a complete visual identity, not a generic Shoho template. */
.project-page {
  --project-accent:#d9ff4a;
  --project-secondary:#7a5cff;
  --project-accent-rgb:217,255,74;
  background:#050507;
}
.project-page.project-tmb { --project-accent:#ff4f9a; --project-secondary:#765dff; --project-accent-rgb:255,79,154; }
.project-page.project-reboot { --project-accent:#ffae1a; --project-secondary:#ff6a00; --project-accent-rgb:255,174,26; }
.project-page.project-go { --project-accent:#8b78ff; --project-secondary:#58d7ff; --project-accent-rgb:139,120,255; }

.project-page::before {
  content:"";
  position:fixed;
  z-index:0;
  inset:0;
  pointer-events:none;
  opacity:.92;
}
.project-tmb::before {
  background:
    radial-gradient(circle at 5% 28%,rgba(255,79,154,.19),transparent 35rem),
    radial-gradient(circle at 90% 63%,rgba(118,93,255,.18),transparent 38rem),
    linear-gradient(140deg,#110812 0%,#060609 57%,#090711 100%);
}
.project-reboot::before {
  background:
    linear-gradient(rgba(255,174,26,.038) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,174,26,.032) 1px,transparent 1px),
    radial-gradient(circle at 10% 32%,rgba(255,174,26,.18),transparent 34rem),
    linear-gradient(140deg,#160f06,#060708 61%);
  background-size:54px 54px,54px 54px,auto,auto;
}
.project-go::before {
  background:
    radial-gradient(circle at 82% 21%,rgba(88,215,255,.09),transparent 28rem),
    radial-gradient(circle at 9% 35%,rgba(114,92,255,.25),transparent 38rem),
    linear-gradient(140deg,#151034,#070713 63%);
}
.project-page::after {
  content:"";
  position:fixed;
  z-index:0;
  pointer-events:none;
  width:43vw;
  aspect-ratio:1;
  right:-17vw;
  top:18vh;
  border:1px solid rgba(var(--project-accent-rgb),.10);
  border-radius:50%;
  box-shadow:0 0 0 70px rgba(var(--project-accent-rgb),.022),0 0 0 140px rgba(var(--project-accent-rgb),.014);
}
.project-page > * { position:relative; }
.project-page .noise { position:fixed; }
.project-page .site-header { border-bottom-color:rgba(var(--project-accent-rgb),.12); }
.project-page .brand-mark { color:var(--project-accent); border-color:rgba(var(--project-accent-rgb),.45); box-shadow:0 0 25px rgba(var(--project-accent-rgb),.10); }
.project-page .site-nav a:hover { color:var(--project-accent); }

.project-hero-v2 {
  position:relative;
  z-index:2;
}
.project-hero-v2::before {
  content:"CURRENT PROJECT";
  position:absolute;
  top:8.15rem;
  left:0;
  color:rgba(var(--project-accent-rgb),.72);
  font-size:.61rem;
  font-weight:850;
  letter-spacing:.27em;
  text-transform:uppercase;
}
.project-hero-v2 .project-hero-copy {
  padding-left:clamp(1rem,2.4vw,2.2rem);
  border-left:1px solid rgba(var(--project-accent-rgb),.33);
}
.project-hero-v2 .eyebrow { color:rgba(var(--project-accent-rgb),.78); }
.project-page .project-pill {
  color:var(--project-accent);
  border-color:rgba(var(--project-accent-rgb),.34);
  background:rgba(var(--project-accent-rgb),.075);
}
.project-page .project-feature-row span {
  border-color:rgba(var(--project-accent-rgb),.23);
  background:rgba(var(--project-accent-rgb),.045);
}
.project-page .project-primary {
  background:var(--project-accent);
  border-color:var(--project-accent);
  color:#08080a;
  box-shadow:0 16px 42px rgba(var(--project-accent-rgb),.13);
}
.project-go .project-primary { color:white; }
.project-page .project-bottom-band { border-color:rgba(var(--project-accent-rgb),.18); }
.project-page .project-bottom-band span:first-child { color:var(--project-accent); }
.project-page .project-bottom-band span + span::before { color:rgba(var(--project-accent-rgb),.43); }

.project-tmb .project-hero-art { border-color:rgba(255,79,154,.26); box-shadow:0 45px 120px rgba(255,79,154,.08),0 40px 100px rgba(0,0,0,.55); }
.project-reboot .project-hero-art { border-color:rgba(255,174,26,.27); box-shadow:0 45px 120px rgba(255,174,26,.075),0 40px 100px rgba(0,0,0,.55); }
.project-go .project-hero-art { border-color:rgba(139,120,255,.32); box-shadow:0 45px 125px rgba(114,92,255,.11),0 40px 100px rgba(0,0,0,.55); }

/* Press kit: card-first editorial layout with stable dimensions. */
.press-page {
  background:
    radial-gradient(circle at 88% 16%,rgba(217,255,74,.07),transparent 30rem),
    radial-gradient(circle at 10% 30%,rgba(122,92,255,.10),transparent 34rem),
    #050505;
}
.press-page main { position:relative; z-index:1; }
.press-page .press-hero {
  max-width:1480px;
  width:min(1480px,calc(100% - 3rem));
  padding:11rem 0 4rem;
}
.press-page .press-hero .eyebrow { color:var(--accent); }
.press-page .press-hero h1 { max-width:1050px; }
.press-page .press-grid {
  max-width:1480px;
  width:min(1480px,calc(100% - 3rem));
  padding:0 0 7rem;
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:1rem;
}
.press-page .press-block { grid-column:span 6; min-width:0; }
.press-page .press-wide { grid-column:1/-1; }
.press-page .press-block .section-label { color:var(--accent); margin:0 0 1.1rem; }
.press-page .press-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }
.press-page .press-facts span { min-width:0; }
.press-page .press-projects { grid-template-columns:repeat(3,minmax(0,1fr)); }
.press-page .press-projects a { min-height:128px; display:flex; flex-direction:column; justify-content:flex-end; }
.press-page .press-projects a:first-child { background:linear-gradient(145deg,rgba(255,79,154,.12),#090909 64%); border-color:rgba(255,79,154,.18); }
.press-page .press-projects a:nth-child(2) { background:linear-gradient(145deg,rgba(255,174,26,.12),#090909 64%); border-color:rgba(255,174,26,.18); }
.press-page .press-projects a:nth-child(3) { background:linear-gradient(145deg,rgba(114,92,255,.16),#090909 64%); border-color:rgba(114,92,255,.22); }
.press-page .asset-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.press-page .asset-grid > a { min-width:0; }
.press-page .asset-grid > a > img,
.press-page .asset-pad { aspect-ratio:1.75; }
.press-page .asset-grid > a > img { object-fit:cover; }
.press-page .asset-pad { display:flex; align-items:center; justify-content:center; padding:clamp(1.25rem,3vw,2.5rem); }
.press-page .asset-pad img { width:100%; max-width:680px; max-height:150px; object-fit:contain; }
.press-page .asset-go { background:linear-gradient(145deg,#2e2281,#19133e); }
.press-page .asset-reboot { background:linear-gradient(145deg,#15100a,#08090c); }

@media (max-width:1000px) {
  .press-page .press-block { grid-column:1/-1; }
  .press-page .press-projects,
  .press-page .asset-grid { grid-template-columns:1fr; }
  .project-hero-v2::before { top:7.2rem; }
}

@media (max-width:820px) {
  .projects::before,.projects::after { top:-3rem; bottom:-3rem; }
  .project-hero-v2 .project-hero-copy { padding-left:1rem; }
  .project-page::after { width:70vw; right:-38vw; }
  .press-page .press-hero,
  .press-page .press-grid { width:calc(100% - 2.2rem); }
  .press-page .press-facts { grid-template-columns:1fr; }
}

@media (max-width:560px) {
  .press-page .press-hero,
  .press-page .press-grid { width:calc(100% - 1.6rem); }
  .project-hero-v2::before { top:6.35rem; }
}

/* Final polish: decorative project rail without repeating the visible CURRENT PROJECT label. */
.project-hero-v2::before {
  content:"";
  top:8.55rem;
  width:3.2rem;
  height:2px;
  background:linear-gradient(90deg,var(--project-accent),transparent);
  border-radius:999px;
}
@media (max-width:1000px) { .project-hero-v2::before { top:7.55rem; } }
@media (max-width:560px) { .project-hero-v2::before { top:6.7rem; } }

/* Root clipping keeps decorative off-canvas orbits from creating horizontal scrollbars. */
html { overflow-x: clip; }
@supports not (overflow: clip) { html { overflow-x: hidden; } }
