/* TITC's original arcade identity, layered over the shared information layout. */
:root {
  --ink: #ece8df;
  --muted: #b6b0a5;
  --paper: #05060a;
  --tint: #0e0f15;
  --line: #373741;
  --accent: #ffd840;
  --blue: #719dff;
  --red: #e00310;
  --game-color: #e00310;
  --game-light: #ff5963;
  --game-shadow: #75000a;
  --pixel: 'DotGothic16', 'Noto Sans JP', sans-serif;
  --terminal: 'VT323', monospace;
  color-scheme: dark;
}
body { background: var(--paper); color: var(--ink); }
.page-jisouka-training { --accent: #ffd840; --game-color: #2665e8; --game-light: #88acff; --game-shadow: #122e6c; }
h1, h2, h3 { font-family: var(--pixel); font-weight: 400; letter-spacing: .01em; }
h2 { text-shadow: 2px 2px 0 var(--game-shadow); }
.eyebrow, .hero-meta, .breadcrumb, .text-link, .header-inner nav, .section-nav, .facts dt,
.button, .credentials, .portrait figcaption, .footer-bottom, .form-panel legend, .form-panel label {
  font-family: var(--pixel);
}
.eyebrow { color: var(--game-light); letter-spacing: .1em; font-weight: 400; }
.scanlines { position: fixed; inset: 0; z-index: 90; pointer-events: none; background: repeating-linear-gradient(0deg,rgba(0,0,0,.12) 0 1px,transparent 1px 4px); }
::selection { background: var(--red); color: white; }
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,[tabindex]:focus-visible { outline-color: var(--accent); }
.site-header { background: #05060a; border-bottom: 3px solid var(--game-color); }
.brand { font-family: var(--terminal); font-size: 2.2rem; font-weight: 400; letter-spacing: .08em; }
.brand-candy { width: 36px; height: 28px; image-rendering: pixelated; margin-right: 3px; }
.brand-sub { font-family: var(--terminal); font-size: .875rem; letter-spacing: .08em; max-width: none; color: #c5bfb3; }
.header-inner nav a { font-weight: 400; }
.header-inner nav a[aria-current] { color: var(--accent); box-shadow: 0 3px 0 var(--accent); }
.header-inner nav .nav-contact { background: var(--game-color); border: 1px solid var(--game-light); color: white; border-radius: 0; box-shadow: 3px 3px 0 var(--game-shadow); }
.header-inner nav a:hover { color: var(--accent); }
.button { border-radius: 0; background: var(--game-color); color: #fff; border: 2px solid #ece8df; box-shadow: 5px 5px 0 var(--game-shadow); font-weight: 400; }
.button span { color: var(--accent); }
.button:hover { background: #b3000a; color: white; transform: translate(-2px,-2px); box-shadow: 7px 7px 0 var(--game-shadow); }
.button:active { transform: translate(3px,3px); box-shadow: 2px 2px 0 var(--game-shadow); }
.button-secondary { background: #121319; border-color: #898780; color: var(--ink); box-shadow: 5px 5px 0 #34343b; }
.button-secondary:hover { background: #24252b; }
.text-link { color: var(--accent); text-decoration-color: #69603f; }
.text-link:hover { color: white; }
.home-hero, .service-hero { background: #05060a; position: relative; isolation: isolate; overflow: hidden; }
.home-hero:before, .service-hero:before {
  content: ''; position: absolute; inset: 0; z-index: -1; opacity: .42;
  background-image: radial-gradient(#aaa 1px, transparent 1px),radial-gradient(#e00310 1px, transparent 1px);
  background-size: 79px 91px, 143px 127px; background-position: 12px 24px,48px 69px;
}
.home-hero { padding: 108px 0 84px; border-bottom: 6px double var(--red); }
.home-hero-grid { gap: 64px; position: relative; z-index: 2; }
.home-hero .eyebrow { color: var(--game-light); font-size: .8125rem; }
.home-hero h1.retro-home-title { font-family: var(--pixel); font-size: clamp(3.5rem,6.2vw,6rem); line-height: 1.4; font-weight: 400; letter-spacing: .03em; text-shadow: 3px 3px 0 #e00310,6px 6px 0 #75000a,9px 9px 0 #3e0005; }
.retro-x { color: var(--red); text-shadow: 3px 3px 0 #650006; }
.retro-title-sub { display: block; font-size: clamp(1.15rem,2.15vw,1.9rem); letter-spacing: -.03em; line-height: 1.8; text-shadow: none; margin-top: 12px; }
.retro-title-sub>span { color: var(--game-light); }
.hero-lead { font-family: var(--pixel); font-weight: 400; color: #ece8df; }
.hero-description { color: #c6c0b5; }
.hero-meta { color: #c2b9a7; }
.accent-text { background: none; color: var(--game-light); }
.service-hero h1 { text-shadow: 3px 3px 0 var(--game-shadow),5px 5px 0 #272028; }
.service-hero .accent-text { color: var(--game-light); }
.retro-hud { position: absolute; top: 26px; left: 40px; right: 40px; display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; font: 1rem var(--terminal); letter-spacing: .1em; color: var(--game-light); }
.retro-hud b { display: block; color: #ece8df; font-size: 1.5rem; letter-spacing: .15em; font-weight: 400; margin-top: 4px; }
.retro-hud>span:last-child { text-align: right; }
.retro-hud>span:last-child b { color: #e00310; font: 1rem var(--pixel); }
.retro-hud>span:nth-child(2) { color: #a69b88; padding-top: 8px; }
.retro-sprites { position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: .9; }
.retro-sprite { position: absolute; image-rendering: pixelated; width: 42px; height: auto; animation: retro-float 3s steps(6) infinite; }
.sprite-a { left: 2%; top: 40%; transform: rotate(-10deg); }
.sprite-b { right: 1.3%; top: 20%; width: 30px; animation-delay: -.7s; }
.sprite-c { left: 43%; top: 10%; width: 32px; animation-delay: -1.4s; }
.sprite-d { right: 5%; bottom: 18px; width: 42px; animation-delay: -2s; }
.home-hero .sprite-a { top: 18%; left: 1%; width: 34px; }
.home-hero .sprite-b { top: 55%; }
.home-hero .sprite-c { top: 85%; left: 46%; width: 25px; }
.home-hero .sprite-d { right: 49%; bottom: 15px; }
@keyframes retro-float { 0%,100% { translate: 0 0; } 50% { translate: 0 -9px; } }
.path-board { background: #0d0e15; color: #ece8df; border: 3px solid #ece8df; border-radius: 0; box-shadow: 8px 8px 0 #75000a; padding: 28px; }
.board-top { font-family: var(--terminal); color: #ffd840; font-size: 1.25rem; letter-spacing: .14em; border-bottom: 1px dashed #6a6255; padding-bottom: 16px; }
.board-top img { width: 36px; height: 32px; image-rendering: pixelated; }
.board-heading { font-family: var(--pixel); font-size: 1.6rem; font-weight: 400; color: #ece8df; }
.path-row { border-radius: 0; border: 2px solid #536180; background: #10131f; box-shadow: 4px 4px 0 #030407; }
.path-row:hover { background: #1d2440; border-color: #ffd840; transform: translate(-2px,-2px); }
.path-row small { color: #8baeff; font: 1rem var(--terminal); letter-spacing: .08em; }
.path-row strong { font-family: var(--pixel); font-weight: 400; }
.path-row p { color: #c3bcaf; }
.path-index { color: #ffd840; font: 1.5rem var(--terminal); line-height: 1; }
.path-row>span:last-child { color: #ffd840; }
.path-build { border-color: #e00310; background: #1c0e12; }
.path-build small { color: #ff6e76; }
.path-build:hover { background: #2c1118; }
.path-connector { font-family: var(--terminal); color: #a29a8c; }
.board-goal { color: #ffd840; font-family: var(--terminal); font-size: 1rem; }
.board-goal strong { font-family: var(--pixel); font-weight: 400; font-size: .8125rem; color: #ece8df; }
.trust-strip { background: #0e0f15; border-block-color: #514238; }
.trust-grid strong { color: #ffd840; font-family: var(--terminal); font-size: 3rem; font-weight: 400; letter-spacing: .02em; }
.trust-grid strong span, .trust-grid p, .trust-grid .trust-label { font-family: var(--pixel); }
.trust-grid .trust-label { color: #ece8df; line-height: 1.65; font-size: 1rem; }
.trust-grid p { color: #bdb5a8; }
.section { border-bottom: 1px solid #28282d; }
.section-heading .eyebrow { color: var(--game-light); }
.section-heading>p, .service-card>p:not(.price), .facts dt { color: #bdb5a8; }
.service-card { background: #0e0f15; border: 2px solid #435d9e; border-top: 5px solid #3866d4; border-radius: 0; box-shadow: 6px 6px 0 #111c3c; }
.program-card { background: #130d12; border: 2px solid #70313b; border-top: 5px solid #e00310; box-shadow: 6px 6px 0 #450008; }
.card-top .eyebrow { color: #90b0ff; }
.program-card .eyebrow { color: #ff737a; }
.service-number { color: #747a8a; font-family: var(--terminal); font-size: 3rem; font-weight: 400; }
.service-card h3 { color: #ece8df; text-shadow: 2px 2px 0 #293667; }
.program-card h3 { text-shadow: 2px 2px 0 #79000b; }
.facts dd { font-weight: 500; }
.price strong { font-family: var(--terminal); color: #ffd840; font-size: 4rem; font-weight: 400; }
.price strong span { font-family: var(--pixel); font-size: 1.3rem; }
.training-card>.button { background: #2250be; border-color: #e4eaff; box-shadow: 5px 5px 0 #162956; }
.connection-note { border-radius: 0; border: 1px dashed #736c5c; background: #101014; }
.connection-symbol { color: #ffd840; }
.dark-section { background: #05060a; color: #ece8df; }
.dark-section .section-heading .eyebrow { color: var(--game-light); }
.dark-section .section-heading>p { color: #bdb5a8; }
.principles article { border-top: 2px dashed #6a5445; }
.principles .eyebrow { color: #ffd840; font-family: var(--terminal); font-size: 1.8rem; }
.principles p:not(.eyebrow) { color: #bdb5a8; }
.portrait img { border-radius: 0; border: 3px solid #ece8df; box-shadow: 7px 7px 0 var(--game-shadow); }
.person-name { font-family: var(--pixel); color: #ffd840; font-weight: 400; }
.resource-card { background: #101117; border: 2px solid #49464a; border-radius: 0; box-shadow: 5px 5px 0 #22212a; }
.other-services article { border-top: 3px double #8a7560; }
.faq-list details[open] { background: #0e0f15; }
.faq-list summary { padding-inline: 14px; font-family: var(--pixel); font-weight: 400; }
.q-mark { color: #ffd840; font-family: var(--terminal); font-size: 1.5rem; }
.faq-icon { color: #ffda60; }
.final-cta { background: #10080b; border-block: 4px double #e00310; text-align: center; }
.final-cta .eyebrow { color: #ffd840; font-family: var(--terminal); font-size: 1.3rem; }
.final-cta .hero-actions { justify-content: center; }
.site-footer { background: #05060a; border-top: 2px solid #e00310; }
.site-footer .brand { color: #ece8df; }
.footer-top nav a { font-family: var(--pixel); color: #c6bfb2; }
.footer-top nav a:hover { color: #ffd840; }
.footer-bottom { color: #aba395; border-color: #51433d; }
.breadcrumb { color: #b8aea0; }
.section-nav { background: #121218; border-block: 1px dashed #75644f; }
.section-nav a { color: #d4cdbf; }
.section-nav a:hover { color: #ffd840; }
.offer-summary, .page-jisouka-training .offer-summary { background: #11121a; color: #ece8df; border-radius: 0; border: 3px solid #ece8df; box-shadow: 7px 7px 0 var(--game-shadow); }
.offer-summary .eyebrow, .page-jisouka-training .offer-summary .eyebrow { color: var(--game-light); }
.summary-title { font-family: var(--pixel); font-weight: 400; }
.summary-price { font-family: var(--terminal); color: #ffd840; font-size: 5.4rem; font-weight: 400; }
.summary-price>span { font-family: var(--pixel); }
.offer-summary dt, .page-jisouka-training .offer-summary dt { color: #bdb5a8; }
.offer-summary .facts>div, .page-jisouka-training .offer-summary .facts>div { border-color: #45434c; }
.offer-summary .text-link, .page-jisouka-training .offer-summary .text-link { color: #ffd840; }
.use-cases article { border-top: 3px double var(--game-color); }
.use-cases .eyebrow { color: var(--game-light); }
.scope-note { background: #151319; border-left: 4px solid #ffd840; }
.scope-note strong { color: #ffd840; font-family: var(--pixel); font-weight: 400; }
.program-steps>li { border-bottom-style: dashed; }
.step-number { color: #ffd840; font-family: var(--terminal); font-size: 3rem; }
.program-steps .step-result { background: #15161d; border: 1px solid #48434b; border-radius: 0; color: #d2c7af; }
.pricing-layout>div>p:not(.eyebrow) { color: #c5bbae; }
.pricing-layout .button { background: var(--game-color); border-color: #fff; color: #fff; }
.pricing-panel { border-radius: 0; border: 3px solid #ffd840; background: #100d11; box-shadow: 7px 7px 0 #6d5317; }
.pricing-panel .summary-price { color: #ffd840; }
.included li { border-bottom-color: #49404a; }
.pricing-notes { color: #bdb3a5; }
.related-section { background: #101015; border-block: 2px dashed #685a43; }
.related-inner .eyebrow { color: #ffd840; }
.contact-section { background: #08080d; color: #ece8df; border-top: 5px solid var(--game-color); }
.contact-intro .eyebrow { color: #ffd840; }
.contact-note { color: #bdb3a5; border-top-color: #51464d; }
.form-panel { background: #111219; border-radius: 0; border: 2px solid #676170; box-shadow: 7px 7px 0 #28252d; }
.form-panel input:not([type=radio]), .form-panel textarea { background: #08090e; border-radius: 0; border-color: #797281; color: #ece8df; }
.form-panel input::placeholder, .form-panel textarea::placeholder { color: #a29a8e; }
.form-panel #interest-options label, .form-panel #seminar-date-options label { border-radius: 0; border-color: #6c6874; }
.form-panel label:has(input:checked) { background: #182853!important; border-color: #97b4ff!important; color: white!important; }
.form-panel .button[type=submit], .page-jisouka-training .form-panel .button[type=submit] { background: var(--game-color); border-color: #fff; color: white; }
.form-panel .button[type=submit]:hover { background: #b8000d; color: white; }
.page-jisouka-training .form-panel .button[type=submit]:hover { background: #3464d8; color: white; }
.form-panel .date-chip { background: #111219; border-color: #75707a; color: #ece8df; border-radius: 0; }
.form-panel .date-chip[aria-pressed=true] { background: #e00310; color: white; border-color: #ffd840; }
.form-panel .small { color: #bdb3a5; }
.required { color: #ffd840; }
.deliverable { background: #11182b; border-radius: 0; border: 2px solid #5974bc; border-left: 5px solid #719dff; }
.deliverable .eyebrow { color: #91b0ff; }
.curriculum-grid article { background: #11121c; border: 2px solid #445687; border-top: 5px solid #4874e3; box-shadow: 5px 5px 0 #1c294b; }
.thinking-flow li:before { font-family: var(--terminal); color: #ffd840; font-size: 1.5rem; }
.training-prices>article { background: #0e0f15; border: 2px solid #514951; border-radius: 0; box-shadow: 5px 5px 0 #26212b; }
.training-prices .featured-price { background: #111a30; border: 3px solid #7f9fee; box-shadow: 6px 6px 0 #253e78; }
.training-prices .featured-price .eyebrow { color: #ffd840; }
.page-jisouka-training .button:not(.button-secondary) { background: #2250be; border-color: #edf1ff; box-shadow: 5px 5px 0 #1b2c59; }
.page-jisouka-training .button:not(.button-secondary):hover { background: #3464d8; }
.seminar-section { background: #0c1020; border-block: 3px double #486ac2; }
.seminar-topics>span { border-radius: 0; border-color: #4a609c; background: #131a30; color: #d8e1ff; }
#seminar-dates>div { background: #141a2b; border: 2px solid #536bab; border-radius: 0; box-shadow: 4px 4px 0 #222f50; }
#seminar-dates>div>div:nth-child(1) { font-family: var(--terminal); color: #ffd840; font-size: 1.2rem; }
#seminar-dates>div>div:nth-child(2) { font-family: var(--pixel); color: #ece8df; font-weight: 400; }
#seminar-dates button, #seminar-dates+button { background: #2250be; color: white; border: 1px solid #edf1ff; border-radius: 0; box-shadow: 3px 3px 0 #061132; font-family: var(--pixel); font-weight: 400; }
#retro-oneup { position: fixed; left: 50%; top: 42%; transform: translate(-50%,-50%); z-index: 100; background: #07080e; border: 4px solid #ffd840; padding: 24px 30px; box-shadow: 8px 8px 0 #7a0010; text-align: center; width: min(420px,90vw); }
#retro-oneup[hidden] { display: none; }
#retro-oneup strong { display: block; font: 5rem var(--terminal); color: #ffd840; }
#retro-oneup span { display: block; font: .875rem/1.8 var(--pixel); }
.skip-link { color: #05060a; }
@media(max-width:1100px) {
  .brand-sub { display: none; }
  .home-hero h1.retro-home-title { font-size: 4.9rem; }
  .retro-title-sub { font-size: 1.45rem; }
  .board-heading { font-size: 1.4rem; }
  .home-hero-grid { gap: 38px; }
}
@media(max-width:800px) {
  .home-hero { padding: 108px 0 55px; }
  .home-hero-grid { gap: 42px; }
  .path-board { max-width: 620px; }
  .retro-hud { left: 24px; right: 24px; }
  .retro-hud>span:nth-child(2) { display: none; }
  .retro-sprites .sprite-a { left: auto; right: 10%; top: 16%; opacity: .6; }
  .retro-sprites .sprite-b { right: 5%; top: 40%; opacity: .5; }
  .retro-sprites .sprite-c { display: none; }
  .service-hero .retro-sprites { opacity: .35; }
  .trust-grid strong { font-size: 2.6rem; }
}
@media(max-width:560px) {
  .header-inner .brand { font-size: 1.85rem; }
  .brand-candy { width: 27px; height: 21px; }
  .home-hero { padding-top: 103px; }
  .home-hero h1.retro-home-title { font-size: 4rem; text-shadow: 2px 2px 0 #e00310,4px 4px 0 #75000a,6px 6px 0 #3e0005; }
  .retro-title-sub { font-size: 1.125rem; letter-spacing: -.05em; }
  .retro-hud { top: 22px; left: 18px; right: 18px; font-size: .9375rem; }
  .retro-hud b { font-size: 1.25rem; }
  .hero-lead { font-size: 1rem; }
  .home-hero .eyebrow { font-size: .75rem; }
  .path-board { padding: 20px; box-shadow: 5px 5px 0 #75000a; }
  .path-row strong { font-size: .9375rem; }
  .path-row small { font-size: .9375rem; }
  .path-index { font-size: 1.35rem; }
  .board-heading { font-size: 1.35rem; }
  .retro-sprites .sprite-a { top: 10%; right: 6%; width: 27px; }
  .retro-sprites .sprite-b { display: none; }
  .service-hero h1 { font-size: 2.2rem; }
  .service-card h3 { font-size: 1.6rem; }
  .service-card { box-shadow: 4px 4px 0 #1b2440; }
  .program-card { box-shadow: 4px 4px 0 #450008; }
  .summary-price, .offer-summary .summary-price { font-size: 4.8rem; }
  .offer-summary { box-shadow: 5px 5px 0 var(--game-shadow); }
  .training-prices .summary-price { font-size: 4.5rem; }
  .form-panel { box-shadow: 4px 4px 0 #28252d; }
  .faq-list summary { padding-inline: 8px; }
  .final-cta .eyebrow { font-size: 1.125rem; }
  .final-cta h2 { font-size: 1.65rem; }
  #seminar-dates>div>div:nth-child(2) { font-size: 1rem; }
}
.motion-control { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; padding: 8px 12px; background: #111219; color: #ffd840; border: 1px solid #75652e; font: .75rem var(--pixel); cursor: pointer; }
.motion-control::before { content: 'Ⅱ'; font: 1rem var(--terminal); }
.motion-control[aria-pressed=true]::before { content: '▶'; }
html[data-motion=playing] .home-hero:before, html[data-motion=playing] .service-hero:before { animation: star-travel 28s linear infinite; }
html[data-motion=playing] .home-hero:after, html[data-motion=playing] .service-hero:after { content: ''; position: absolute; bottom: 12px; left: -40px; width: 32px; height: 32px; background: url('/assets/retro-bot.svg') center/contain no-repeat; image-rendering: pixelated; pointer-events: none; animation: stage-run 18s linear infinite; z-index: 3; }
html[data-motion=playing] .retro-sprite { animation: sprite-adventure 4s steps(8,end) infinite; }
html[data-motion=playing] .sprite-b { animation-name: star-dance; animation-duration: 6s; }
html[data-motion=playing] .sprite-c { animation-name: heart-hop; animation-duration: 3s; }
html[data-motion=playing] .sprite-d { animation-duration: 5s; }
html[data-motion=playing] .board-top img { animation: heart-hop 2.4s steps(6,end) infinite; image-rendering: pixelated; }
html[data-motion=playing] .brand-candy { animation: candy-hello 7s steps(5,end) infinite; }
html[data-motion=playing] .path-board, html[data-motion=playing] .offer-summary { animation: arcade-glow 4s ease-in-out infinite; }
html[data-motion=playing] .board-top::after { content: '◀'; color: #ffd840; font: 1.1rem var(--terminal); animation: menu-cursor 1.5s steps(3,end) infinite; }
html[data-motion=playing] .path-row, html[data-motion=playing] .service-card, html[data-motion=playing] .curriculum-grid article { transition: translate .2s ease, border-color .2s ease, box-shadow .2s ease; }
html[data-motion=playing] .path-row:hover, html[data-motion=playing] .path-row:focus-visible { translate: 5px -3px; border-color: #ffd840; box-shadow: 5px 5px 0 #695416; }
html[data-motion=playing] .service-card:hover, html[data-motion=playing] .curriculum-grid article:hover { translate: 0 -5px; border-color: #ffd840; }
html[data-motion=playing] .button:hover span, html[data-motion=playing] .button:focus-visible span { animation: menu-cursor .8s steps(3,end) infinite; }

@keyframes star-travel { to { background-position: 91px 206px, -95px 196px; } }
@keyframes stage-run { 0% { left: -40px; transform: translateY(0); } 25% { transform: translateY(-8px); } 50% { transform: translateY(0); } 75% { transform: translateY(-8px); } 100% { left: 100%; transform: translateY(0); } }
@keyframes sprite-adventure { 0%,100% { translate: 0 0; rotate: -8deg; } 25% { translate: 12px -16px; rotate: 0deg; } 50% { translate: 24px -4px; rotate: 8deg; } 75% { translate: 8px 8px; rotate: 0deg; } }
@keyframes star-dance { 0%,100% { translate: 0 0; rotate: 0deg; scale: 1; } 50% { translate: -14px -22px; rotate: 90deg; scale: 1.18; } }
@keyframes heart-hop { 0%,55%,100% { translate: 0 0; } 25% { translate: 0 -12px; } 40% { translate: 0 -4px; } }
@keyframes candy-hello { 0%,75%,100% { rotate: 0deg; } 80% { rotate: -15deg; } 90% { rotate: 15deg; } }
@keyframes arcade-glow { 0%,100% { outline: 1px solid transparent; outline-offset: 3px; } 50% { outline: 1px solid #ffd84088; outline-offset: 7px; } }
@keyframes menu-cursor { 0%,100% { translate: 0 0; } 50% { translate: 5px 0; } }
html[data-motion=paused] *, html[data-motion=paused] *::before, html[data-motion=paused] *::after { animation-play-state: paused!important; transition: none!important; }
@media(prefers-reduced-motion:reduce) { .retro-sprite { animation: none; } .scanlines { display: none; } }
@media print { .scanlines,.retro-sprites,.retro-hud,#retro-oneup { display: none; } body,.section,.path-board,.service-card,.offer-summary,.pricing-panel { background: white!important; color: black!important; box-shadow: none!important; } h1,h2,h3 { text-shadow: none!important; } }
