/* Light finish for the deployed design, verified against production 2026-09-17.
   Preserve its layout, photographs, geometry and motion paths.
   Typography unified 2026-09-18: Noto Serif JP for Japanese, Inter for Latin. */
:root,
.production-light .on-cream,
.production-light .section-light {
  color-scheme: light;
  --font-site: "Inter", "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  --paper: #fafbfc;
  --surface: #ffffff;
  --surface-soft: #f1f3f6;
  --text: #202838;
  --text-muted: #586375;
  --text-faint: #687386;
  --rule: rgba(32, 40, 56, .16);
  --rule-soft: rgba(32, 40, 56, .08);
  --bg: var(--paper);
  --fg: var(--text);
  --fg-50: var(--text-muted);
  --fg-25: var(--text-faint);
  --cream: var(--paper);
  --cream-elev: var(--surface);
  --ink: var(--text);
  --ink-muted: var(--text-muted);
  --ink-faint: var(--text-faint);
  --line: var(--rule);
  --hairline: var(--rule);
  --hairline-soft: var(--rule-soft);
  --brand: #0040ff;
  --brand-soft: rgba(0, 64, 255, .13);
  --brand-faint: rgba(0, 64, 255, .035);
  --brand-lt: #2455c8;
  --peach: #0040ff;
  --cyan: #2455c8;
  --tech-0: #fafbfc;
  --tech-1: #f1f4f9;
  --tech-blue: #0040ff;
  --tech-ice: #2455c8;
  --tech-dim: #687386;
  --grad: linear-gradient(120deg, #0040ff, #315bba);
  --gradB: linear-gradient(118deg, #173f93, #0040ff 65%, #476ca5);
}

.production-light { background: var(--paper); color: var(--text); font-weight: 400; }
.production-light :is(button, input, select, textarea, option) { font-family: var(--font-site); }
::selection { background: #dce6ff; color: #202838; }
:focus-visible { outline-color: var(--brand); }

/* The original header, in translucent porcelain rather than navy. */
.production-light .uh {
  background: rgba(250, 251, 252, .96);
  border-bottom-color: var(--rule);
}
.production-light .uh-brand b { color: var(--text); }
.production-light .uh-nav a { color: var(--text-muted); }
.production-light .uh-nav a:hover { color: var(--brand); }
.production-light .uh-nav .uh-cta { color: var(--text); border-color: var(--rule); }
.production-light .uh-cta:hover { background: var(--surface); border-color: var(--brand); }
.production-light .uh-burger span { background: var(--text); }
.production-light .uh-menu { background: var(--surface); border-bottom-color: var(--rule); }
.production-light .uh-menu a { color: var(--text); border-bottom-color: var(--rule-soft); }
.production-light .uh-menu a:last-child { color: var(--brand); }

/* Existing spatial home / service scenes. */
.production-light .vig {
  background: radial-gradient(ellipse at 50% 46%, transparent 36%, rgba(250,251,252,.4) 75%, rgba(250,251,252,.88));
}
.production-light .grain { opacity: .055; mix-blend-mode: multiply; }
.production-light .scene.arrive .in::before,
.production-light .arrive .in::before,
.production-light .scene.hero .in::before {
  background: radial-gradient(ellipse at center, rgba(250,251,252,.96), rgba(250,251,252,.78) 42%, transparent 72%);
}
.production-light .scene.arrive .big,
.production-light .scene.arrive .big b,
.production-light .svc-name,
.production-light .svc-desc { text-shadow: none; }
.production-light .scene.arrive .lede,
.production-light .arrive .contact,
.production-light .svc-desc { color: var(--text-muted); }
/* Inter's descenders exceed the old 1em gradient painting area (notably "y"). */
.production-light .scenes .wordmark { filter: none; line-height: 1.2; }
.production-light .debris div,
.production-light .idx {
  background: rgba(255,255,255,.96);
  border-color: var(--rule);
  box-shadow: 0 8px 28px -22px rgba(32,40,56,.2);
}
.production-light .idx:hover { background: #fff; border-color: #7c99d3; }
.production-light .scenes .pill {
  background: var(--brand);
  color: #fff;
  box-shadow: 0 8px 24px -14px rgba(0,64,255,.4);
}
.production-light .toc-back { color: var(--text-muted); background: rgba(255,255,255,.96); }
.production-light .toc-back:hover { color: var(--brand); }
/* The deployed speed readout shared the phase label's left position. */
.production-light > .hud.spd { left: auto; right: 30px; }

/* Existing canvas hero: paper, blue ink and fine silver borders. */
.production-light .hero-tech {
  background: radial-gradient(100% 100% at 78% 26%, #eef2f9, #fafbfc 72%);
}
.production-light .hero-vig {
  background: radial-gradient(95% 85% at 50% 45%, transparent 55%, rgba(250,251,252,.7)),
              linear-gradient(90deg, #fafbfc, rgba(250,251,252,.94) 32%, transparent 65%);
}
.production-light .hero-scan { opacity: .28; mix-blend-mode: multiply; }
.production-light .hero-dots { opacity: .045; }
.production-light .hero-seam {
  background: linear-gradient(180deg, rgba(250,251,252,0), #fafbfc 82%);
  border-bottom-color: var(--rule);
}
.production-light .hero-tech .pill {
  color: var(--text-muted); background: rgba(255,255,255,.7); border-color: var(--rule);
}
.production-light .hero-tech .pill .dot { box-shadow: 0 0 0 4px var(--brand-faint); }
.production-light .hero-tech h1 { color: var(--text); }
.production-light .hero-tech h1 .accent { background-image: var(--gradB); }
.production-light .hero-tech .lede { color: var(--text-muted); }
.production-light .hero-tech .lede .en { color: var(--text-faint); }
.production-light .hero-tech .btn-ghost { color: var(--text); border-color: var(--rule); }
.production-light .hero-tech .btn-ghost:hover { background: var(--surface); border-color: #7c99d3; }
@media (max-width: 979px) {
  .production-light.message-page .hero-vig {
    background: linear-gradient(180deg, rgba(250,251,252,.3), rgba(250,251,252,.88) 30%, rgba(250,251,252,.9) 75%, #fafbfc);
  }
}
.production-light .hero-term { background: rgba(255,255,255,.7); border-color: var(--rule); }
.production-light .hero-hud .crn { border-color: #c5cfdf; }
.production-light .hero-hud .sdot { box-shadow: none; }
.production-light .grid-base { opacity: .022; }
.production-light .grid-glow { opacity: .16; }
.production-light .noise { opacity: .014; }
.production-light .scroll-prog { box-shadow: none; }

/* Quiet surfaces preserve the original cards, tables and photographs. */
.production-light .section-light,
.production-light .on-cream,
.production-light .letter.on-cream { background: var(--paper); }
.production-light .section-light + .cta-light,
.production-light .cta-band.cta-light { background: var(--surface-soft); }
.production-light .btn-primary {
  background: var(--brand);
  color: #fff;
  box-shadow: 0 8px 24px -16px rgba(0,64,255,.45);
}
.production-light .btn-primary:hover { box-shadow: 0 12px 26px -16px rgba(0,64,255,.5); }
.production-light button.btn:not(.btn-ghost) { border: 1px solid transparent; }
.production-light .btn,
.production-light .scenes .pill { min-height: 48px; touch-action: manipulation; }
.production-light .btn-ghost { box-shadow: inset 0 1px 0 rgba(255,255,255,.8); }
.production-light .biz-card:hover,
.production-light .benefit-card:hover { box-shadow: 0 18px 42px -28px rgba(32,40,56,.26); }
.production-light .statement .st-mark span.on,
.production-light .define .emblem span.on { box-shadow: none; }
.production-light .define-panel,
.production-light .conv-card.dark {
  background: linear-gradient(135deg, #fff, #f1f4f9);
  border-color: var(--rule);
  box-shadow: 0 16px 44px -32px rgba(32,40,56,.25);
}
.production-light .define .formula,
.production-light .conv-card.dark h3,
.production-light .conv-math .val,
.production-light .conv-math .row.total .lbl { color: var(--text); }
.production-light .define .formula b { background-image: var(--gradB); }
.production-light .define .formula .x,
.production-light .define .desc,
.production-light .conv-math .lbl,
.production-light .conv-math .note2 { color: var(--text-muted); }
.production-light .define .emblem span { background: #dce4f1; }
.production-light .conv-card.dark .ck,
.production-light .conv-math .row.total .val { color: var(--brand); }
.production-light .conv-math .row { border-top-color: var(--rule); }
.production-light .flow-dot,
.production-light .flow::after { box-shadow: 0 0 0 5px var(--brand-faint); }

/* Same form, with readable labels, placeholders and confirmation states. */
.production-light .cta-band.cta-light .cta-box {
  background: var(--surface); color: var(--text); border-color: var(--rule);
  box-shadow: 0 20px 60px -44px rgba(32,40,56,.3);
}
.production-light .cta-band.cta-light .cta-box::before { opacity: .28; }
.production-light .cta-band.cta-light .cta-box::after { opacity: .12; }
.production-light .cta-band.cta-light .cta-box h2,
.production-light .cta-band.cta-light .cf-done h3,
.production-light .cta-band.cta-light .cf-review dd,
.production-light .cta-band.cta-light .cf-steps li.is-on { color: var(--text); }
.production-light .cta-box p,
.production-light .cta-band.cta-light .cf-field label,
.production-light .cta-band.cta-light .cf-status,
.production-light .cta-band.cta-light .cf-privacy,
.production-light .cta-band.cta-light .cf-done p,
.production-light .cta-band.cta-light .cf-lead,
.production-light .cta-band.cta-light .cf-review dt,
.production-light .cta-band.cta-light .url,
.production-light .cta-band.cta-light .url a { color: var(--text-muted); }
.production-light .cta-band.cta-light .cf-opt,
.production-light .cta-band.cta-light .cf-steps li,
.production-light .cta-band.cta-light .cf-steps li::before,
.production-light .cta-band.cta-light .cf-review dd.is-empty { color: var(--text-faint); }
.production-light .cta-band.cta-light .cf-field input,
.production-light .cta-band.cta-light .cf-field textarea,
.production-light .cta-band.cta-light .cf-field select,
.production-light .cta-band.cta-light .cf-field select option {
  color: var(--text); background-color: var(--surface); border-color: #b9c1cd;
}
.production-light .cta-band.cta-light .cf-field input::placeholder,
.production-light .cta-band.cta-light .cf-field textarea::placeholder,
.production-light .cta-band.cta-light .cf-field select:invalid { color: var(--text-faint); }
.production-light .cta-band.cta-light .cf-field input:focus,
.production-light .cta-band.cta-light .cf-field textarea:focus,
.production-light .cta-band.cta-light .cf-field select:focus {
  border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-faint);
}
.production-light .cta-band.cta-light .cf-steps li.is-on::before { color: #fff; }
.production-light .cta-band.cta-light .cf-steps li.is-done::before { color: var(--brand); }
.production-light .cta-band.cta-light .cf-status.is-err { color: #b42335; }
.production-light .cta-band.cta-light .cf-privacy a,
.production-light .cta-band.cta-light .url a:hover { color: var(--brand); }
.production-light .cta-band.cta-light .cta-box .btn-ghost { color: var(--text); border-color: var(--rule); }
.production-light .cta-band.cta-light .cta-box .btn-ghost:hover { background: var(--surface-soft); border-color: #7c99d3; }

/* Legal pages and the original compact error page. */
.production-light .doc p,
.production-light .doc li { color: var(--text); }
.production-light .site-footer { color: var(--text-faint); }
.production-light.\34 04-page a { color: #fff; background: var(--brand); }

/* The original 300px minimum overflowed narrow phones; retain one column. */
@media (max-width: 360px) {
  .production-light .benefit-grid { grid-template-columns: minmax(0, 1fr); }
}

/* Phones: a comfortable reading flow over the original spatial background.
   Fixed scenes cannot fit long text on small screens or in landscape. */
@media (max-width: 860px), (max-height: 600px), (prefers-reduced-motion: reduce) {
  .production-light .scenes { position: relative; inset: auto; pointer-events: auto; }
  .production-light .scene {
    position: relative;
    inset: auto;
    overflow: clip;
    min-height: calc(100svh - 60px);
    padding: 64px 0 80px;
    opacity: 1 !important;
    transform: none !important;
    will-change: auto;
    scroll-margin-top: 60px;
  }
  .production-light .scene + .scene { border-top: 1px solid var(--rule-soft); }
  .production-light .scene .in { min-width: 0; padding-inline: 24px; }
  .production-light .track { display: none; }
  .production-light .svc-index { pointer-events: auto !important; }
  .production-light > .hud { display: none; }
  .production-light .toc-back {
    bottom: max(12px, env(safe-area-inset-bottom));
    height: 44px;
    max-width: calc(100% - 48px);
    font-size: 12px;
    letter-spacing: .06em;
  }
}

@media (max-width: 860px) {
  .production-light .uh-in {
    min-height: 60px;
    padding: 6px max(18px, env(safe-area-inset-right)) 6px max(18px, env(safe-area-inset-left));
  }
  .production-light .uh-burger { width: 44px; height: 44px; flex-shrink: 0; }
  .production-light .uh-burger span { left: 9px; right: 9px; height: 1.5px; }
  .production-light .uh-burger span:nth-child(1) { top: 13px; }
  .production-light .uh-burger span:nth-child(2) { top: 21px; }
  .production-light .uh-burger span:nth-child(3) { top: 29px; }
  .production-light .uh-burger.open span:nth-child(1),
  .production-light .uh-burger.open span:nth-child(3) { top: 21px; }
  .production-light .uh-menu {
    max-height: calc(100dvh - 60px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-bottom: max(18px, env(safe-area-inset-bottom));
    box-shadow: 0 20px 40px -30px rgba(32,40,56,.25);
  }
  .production-light .uh-menu a { min-height: 48px; }
  .production-light .debris { margin-top: 32px; gap: 12px; }
  .production-light .debris div { padding: 18px 14px; }
  .production-light .debris h3 { font-size: 14px; line-height: 1.85; }
  .production-light .debris .n { font-size: 10px; letter-spacing: .12em; }
  .production-light .phases { margin-top: 32px; }
  .production-light .phases h3 { font-size: 17px; line-height: 1.65; }
  .production-light .phases p { font-size: 14px; line-height: 1.95; }
  .production-light .lede,
  .production-light .lede-sm,
  .production-light .svc-desc { font-size: 15px; line-height: 1.95; max-width: 100%; }
  .production-light .big { font-size: clamp(24px, 6.4vw, 34px); line-height: 1.7; }
  .production-light .svc-name { font-size: clamp(26px, 7vw, 38px); line-height: 1.5; }
  .production-light .wordline { font-size: clamp(29px, 8vw, 44px); line-height: 1.45; }
  .production-light .svc-index { gap: 12px !important; margin-top: 30px !important; }
  .production-light .idx { padding: 18px 14px !important; gap: 10px; min-height: 112px; }
  .production-light .idx-name { font-size: 14px; line-height: 1.7; }
  .production-light .idx-name { text-wrap: balance; }
  .production-light .hero-tech h1 { font-size: clamp(28px, 7.2vw, 40px); line-height: 1.5; }
  .production-light .hero-actions { gap: 12px; }
  .production-light .cf-field input,
  .production-light .cf-field textarea,
  .production-light .cf-field select { font-size: 16px; min-height: 48px; }
  .production-light .cf-field textarea { line-height: 1.8; }
  .production-light .cf-field { min-width: 0; }
  .production-light .cf-actions { flex-wrap: wrap; gap: 12px; }
  .production-light .cf-review dd { overflow-wrap: anywhere; }
  .production-light .cta-box h2 { font-size: clamp(22px, 5.8vw, 30px); line-height: 1.65; }
  .production-light .member-grid { grid-template-columns: minmax(0, 1fr); }
  .production-light .member-top { flex-wrap: wrap; gap: 18px; }
  .production-light .member .who { flex: 1 1 150px; min-width: 0; }
  .production-light .member .who .nm { white-space: normal; line-height: 1.7; }
  .production-light .member .who .nm small { display: block; margin: 4px 0 0; white-space: normal; }
  .production-light .member .who .roletag .rt-area { white-space: normal; }
  .production-light .table-scroll { overscroll-behavior-inline: contain; }
}

@media (max-width: 480px) {
  .production-light .scene .eyebrow { font-size: 10px; letter-spacing: .16em; }
  .production-light .cta-box { padding-inline: 20px; }
  .production-light .cf-steps { gap: 10px; }
}

@media (max-width: 360px) {
  .production-light .svc-index { grid-template-columns: 1fr !important; }
  .production-light .idx { min-height: 86px; }
}

@media (prefers-reduced-motion: reduce) {
  .production-light #ride,
  .production-light #stage { display: none; }
}