:root {
  --blue: #126fef;
  --cyan: #19bff2;
  --navy: #07152d;
  --ink: #111827;
  --muted: #667085;
  --line: #dbe3ef;
  --soft: #f5f8fc;
  --white: #fff;
  --radius-lg: 26px;
  --radius-md: 17px;
  --shadow: 0 24px 70px rgba(7, 21, 45, .10);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--white); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif; font-size: 16px; line-height: 1.75; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, select { font: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--navy); font-weight: 740; letter-spacing: -.045em; }
.shell { width: min(1160px, calc(100% - 56px)); margin-inline: auto; }
.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; z-index: 30; top: 12px; left: 12px; padding: 10px 15px; border-radius: 9px; color: var(--white); background: var(--blue); transform: translateY(-180%); transition: transform .2s ease; }
.skip-link:focus { transform: translateY(0); }

.site-header { position: sticky; z-index: 20; top: 0; border-bottom: 1px solid rgba(219,227,239,.88); background: rgba(255,255,255,.95); backdrop-filter: blur(18px); }
.header-row { min-height: 78px; display: flex; align-items: center; gap: 34px; }
.brand { display: inline-flex; align-items: center; gap: 12px; color: var(--navy); font-size: 20px; font-weight: 760; letter-spacing: -.035em; text-decoration: none; white-space: nowrap; }
.brand img { width: 54px; height: 54px; border-radius: 13px; }
.site-nav { margin-left: auto; display: flex; align-items: center; gap: 30px; }
.site-nav a { padding-block: 8px; color: #4e5d73; font-size: .875rem; font-weight: 680; text-decoration: none; white-space: nowrap; transition: color .2s ease; }
.site-nav a:hover, .site-nav a:focus-visible, .site-nav a[aria-current="page"] { color: var(--blue); }
.language-control select { min-width: 174px; min-height: 42px; padding: 0 34px 0 13px; border: 1px solid var(--line); border-radius: 11px; color: var(--navy); background: var(--white); font-size: .875rem; font-weight: 650; cursor: pointer; }
.noscript-languages { padding: 12px 24px; text-align: center; background: #edf4ff; font-size: .82rem; }
.noscript-languages a { color: var(--blue); }
.language-prompt { position: relative; z-index: 30; border-bottom: 1px solid #d8bd58; background: #fff6c9; color: #1b2434; }
.language-prompt-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 58px; }
.language-prompt p { margin: 0; font-size: .95rem; font-weight: 700; }
.language-prompt-actions { display: flex; align-items: center; gap: 10px; }
.language-prompt-actions .button { min-height: 38px; padding: 0 16px; }
.language-prompt-actions .button-secondary { border-color: #c9ae4b; background: transparent; color: #4a3e16; cursor: pointer; }

.hero { position: relative; min-height: 690px; overflow: hidden; color: var(--white); background: var(--navy); }
.hero-media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 54% center; }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4,15,34,.99) 0%, rgba(4,15,34,.94) 31%, rgba(4,15,34,.64) 53%, rgba(4,15,34,.12) 82%), linear-gradient(0deg, rgba(3,12,29,.62), transparent 46%); }
.hero-inner { position: relative; min-height: 690px; display: flex; align-items: center; padding-block: 86px 94px; }
.hero-copy { width: min(585px, 56%); }
.eyebrow, .section-label { margin-bottom: 20px; color: var(--blue); font-size: .79rem; font-weight: 820; letter-spacing: .13em; line-height: 1.45; text-transform: uppercase; }
.hero .eyebrow { color: var(--cyan); }
.hero h1 { max-width: 16ch; margin-bottom: 30px; color: var(--white); font-size: clamp(2.1rem, 3vw, 3.1rem); line-height: 1.12; letter-spacing: -.015em; }
.hero-lead { max-width: 30ch; margin-bottom: 20px; color: #eff5ff; font-size: clamp(1.3rem, 2vw, 1.7rem); font-weight: 580; line-height: 1.45; letter-spacing: -.018em; }
.hero-body { max-width: 52ch; margin-bottom: 34px; color: #b8c7db; font-size: 1rem; line-height: 1.8; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 13px; }
.button { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; padding: 0 20px; border: 1px solid transparent; border-radius: 12px; font-size: .94rem; font-weight: 760; line-height: 1; text-decoration: none; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.button:hover, .button:focus-visible { transform: translateY(-2px); }
.button-primary { color: var(--white); background: var(--blue); box-shadow: 0 12px 28px rgba(18,111,239,.28); }
.button-primary:hover, .button-primary:focus-visible { background: #0d60d2; }
.button-secondary { color: var(--white); border-color: rgba(255,255,255,.35); background: rgba(255,255,255,.07); }
.button-secondary:hover, .button-secondary:focus-visible { border-color: rgba(255,255,255,.75); background: rgba(255,255,255,.12); }
.hero-note { margin: 26px 0 0; color: #8da2bf; font-size: .79rem; letter-spacing: .025em; }
.signal-band { color: var(--white); background: #0b1f3e; }
.signal-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.signal-grid div { min-height: 90px; display: flex; align-items: center; gap: 15px; padding: 18px 30px; border-right: 1px solid rgba(255,255,255,.13); }
.signal-grid div:first-child { padding-left: 0; }
.signal-grid div:last-child { border-right: 0; }
.signal-grid strong { color: var(--cyan); font-size: 1.8rem; letter-spacing: -.055em; }
.signal-grid span { color: #c4d2e6; font-size: .9rem; }

.section { padding-block: 120px; }
.intro-grid, .work-heading { display: grid; grid-template-columns: minmax(0,.92fr) minmax(0,1.08fr); gap: 82px; align-items: end; }
.section-label { margin-bottom: 17px; }
.intro-grid h2, .work-heading h2 { max-width: 20ch; margin-bottom: 0; font-size: clamp(1.85rem, 2.8vw, 2.8rem); line-height: 1.16; }
.section-copy { max-width: 58ch; margin: 0 0 7px; color: var(--muted); font-size: 1.08rem; line-height: 1.85; }
.principles { background: var(--soft); }
.value-grid { margin-top: 62px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.value-grid article { min-height: 236px; padding: 28px 28px 30px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--white); }
.value-grid article > span { color: var(--blue); font-size: .78rem; font-weight: 820; letter-spacing: .1em; }
.value-grid h3 { margin: 34px 0 13px; font-size: 1.42rem; line-height: 1.25; }
.value-grid p { margin-bottom: 0; color: var(--muted); font-size: .96rem; line-height: 1.75; }
.work { background: var(--white); }
.product-grid { margin-top: 62px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.product-card { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--soft); box-shadow: 0 15px 44px rgba(7,21,45,.06); }
.product-media { aspect-ratio: 16 / 9; overflow: hidden; background: #dfeaf8; }
.product-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.product-card:hover .product-media img { transform: scale(1.025); }
.product-body { padding: 28px 30px 32px; }
.product-index { display: flex; justify-content: space-between; margin-bottom: 28px; color: var(--blue); font-size: .75rem; font-weight: 820; letter-spacing: .08em; text-transform: uppercase; }
.product-body h3 { margin-bottom: 9px; font-size: 2rem; line-height: 1.15; }
.product-tagline { min-height: 3em; margin-bottom: 14px; color: var(--navy) !important; font-size: 1.08rem !important; font-weight: 700; line-height: 1.5 !important; }
.product-body > p { min-height: 5.25em; margin-bottom: 22px; color: var(--muted); font-size: .96rem; line-height: 1.75; }
.product-body a, .support-callout a { color: var(--blue); font-weight: 760; text-decoration: none; }
.product-body a:hover, .product-body a:focus-visible, .support-callout a:hover, .support-callout a:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.contact { padding-block: 96px; background: #eaf3ff; }
.contact-grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(280px,.8fr); gap: 60px; align-items: end; }
.contact h2 { max-width: 30ch; margin-bottom: 14px; font-size: clamp(1.7rem, 2.3vw, 2.35rem); line-height: 1.18; }
html[lang="ja"] .contact h2, html[lang="zh-Hans"] .contact h2, html[lang="zh-Hant"] .contact h2, html[lang="ko"] .contact h2 { max-width: 30ch; font-size: clamp(1.65rem, 2.2vw, 2.2rem); }
.contact p:not(.section-label) { margin-bottom: 0; color: var(--muted); font-size: 1.06rem; }
.contact > .shell > a { justify-self: end; color: var(--navy); font-size: clamp(1.05rem, 1.8vw, 1.42rem); font-weight: 760; text-decoration: none; overflow-wrap: anywhere; }
.contact > .shell > a span { color: var(--blue); }

.site-footer { color: #9ba3ad; background: #17191d; }
.footer-bar { min-height: 132px; display: flex; align-items: center; justify-content: space-between; gap: 40px; padding-block: 22px; border-top: 1px solid rgba(255,255,255,.12); }
.footer-logo { display: flex; align-items: center; min-width: 0; }
.footer-logo img { display: block; width: 156px; height: 104px; object-fit: contain; }
.footer-copyright { padding-left: 42px; border-left: 1px solid rgba(255,255,255,.16); color: #9299a3; font-size: .78rem; line-height: 1.6; white-space: nowrap; }

.subpage { background: var(--white); }
.subpage-hero { position: relative; min-height: 440px; overflow: hidden; display: flex; align-items: center; color: var(--white); background: var(--navy); }
.subpage-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 65% center; opacity: .72; }
.subpage-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4,15,34,.99) 0%, rgba(4,15,34,.9) 46%, rgba(4,15,34,.24) 88%); }
.subpage-hero .shell { position: relative; padding-block: 78px; }
.subpage-hero .section-label { color: var(--cyan); }
.subpage-hero h1 { max-width: 30ch; margin-bottom: 22px; color: var(--white); font-size: clamp(2.1rem, 3.2vw, 3.2rem); line-height: 1.12; }
.subpage-hero p:not(.section-label) { max-width: 59ch; margin-bottom: 28px; color: #c7d4e7; font-size: 1.06rem; line-height: 1.8; }
.content-section { padding-block: 94px 120px; }
.content-width { width: min(850px, calc(100% - 56px)); }
.content-width > h2 { max-width: 50ch; margin-bottom: 16px; font-size: 1.55rem; line-height: 1.35; }
.content-lead { max-width: 66ch; color: var(--muted); }
.support-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-top: 30px; }
.support-grid > a { padding: 24px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--soft); text-decoration: none; transition: border-color .2s ease, transform .2s ease; }
.support-grid > a:hover, .support-grid > a:focus-visible { border-color: var(--blue); transform: translateY(-2px); }
.support-grid strong, .support-grid span { display: block; }
.support-grid strong { margin-bottom: 7px; color: var(--navy); font-size: 1.15rem; }
.support-grid span { color: var(--muted); font-size: .92rem; }
.support-callout { margin-top: 54px; padding: 30px; border-radius: var(--radius-md); background: #eaf3ff; }
.support-callout h2 { max-width: 42ch; margin-bottom: 10px; font-size: 1.45rem; line-height: 1.3; }
.support-callout p { margin-bottom: 13px; color: var(--muted); }
.legal > section { padding-block: 30px; border-bottom: 1px solid var(--line); }
.legal > section:first-child { padding-top: 0; }
.legal h2 { max-width: 50ch; margin-bottom: 12px; font-size: 1.35rem; line-height: 1.35; }
.legal p { margin-bottom: 0; color: var(--muted); }
.legal-note { margin-top: 40px !important; padding-top: 24px; border-top: 2px solid var(--navy); color: var(--navy) !important; font-weight: 720; }

html[lang="ja"] .hero h1, html[lang="zh-Hans"] .hero h1, html[lang="zh-Hant"] .hero h1, html[lang="ko"] .hero h1 { max-width: 100%; font-size: clamp(2rem, 2.8vw, 2.9rem); line-height: 1.22; letter-spacing: -.015em; }
html[lang="ja"] .intro-grid h2, html[lang="zh-Hans"] .intro-grid h2, html[lang="zh-Hant"] .intro-grid h2, html[lang="ko"] .intro-grid h2, html[lang="ja"] .work-heading h2, html[lang="zh-Hans"] .work-heading h2, html[lang="zh-Hant"] .work-heading h2, html[lang="ko"] .work-heading h2 { max-width: 100%; }
html[lang="ja"] .hero-lead, html[lang="zh-Hans"] .hero-lead, html[lang="zh-Hant"] .hero-lead, html[lang="ko"] .hero-lead { max-width: 25ch; line-height: 1.6; }
html[lang="ja"] .section-copy, html[lang="zh-Hans"] .section-copy, html[lang="zh-Hant"] .section-copy, html[lang="ko"] .section-copy { line-height: 2; }

@media (max-width: 940px) {
  .header-row { flex-wrap: wrap; gap: 12px 20px; padding-block: 13px; }
  .site-nav { order: 3; width: 100%; margin-left: 0; gap: 22px; overflow-x: auto; scrollbar-width: none; }
  .language-control { margin-left: auto; }
  .hero, .hero-inner { min-height: 660px; }
  .hero-copy { width: min(650px, 78%); }
  .hero-shade { background: linear-gradient(90deg, rgba(4,15,34,.99) 0%, rgba(4,15,34,.91) 43%, rgba(4,15,34,.42) 72%, rgba(4,15,34,.2)); }
  .intro-grid, .work-heading { grid-template-columns: 1fr; gap: 24px; align-items: start; }
  .section-copy { max-width: 68ch; }
  .section { padding-block: 96px; }
}

@media (max-width: 700px) {
  .shell, .content-width { width: min(100% - 36px, 1160px); }
  .brand { font-size: 1.08rem; }
  .brand img { width: 48px; height: 48px; }
  .language-control select { min-width: 148px; }
  .language-prompt-inner { align-items: flex-start; flex-direction: column; padding-top: 12px; padding-bottom: 12px; }
  .language-prompt-actions { width: 100%; }
  .language-prompt-actions .button { flex: 1; }
  .site-nav a { font-size: .81rem; }
  .hero, .hero-inner { min-height: 700px; }
  .hero-media { object-position: 66% center; }
  .hero-shade { background: linear-gradient(180deg, rgba(4,15,34,.62) 0%, rgba(4,15,34,.93) 45%, rgba(4,15,34,.995) 100%); }
  .hero-inner { align-items: end; padding-block: 68px; }
  .hero-copy { width: 100%; }
  .hero h1 { max-width: 16ch; font-size: clamp(1.85rem, 6.5vw, 2.5rem); }
  html[lang="ja"] .hero h1, html[lang="zh-Hans"] .hero h1, html[lang="zh-Hant"] .hero h1, html[lang="ko"] .hero h1 { max-width: 100%; font-size: clamp(1.75rem, 6vw, 2.2rem); line-height: 1.22; }
  .hero-lead { font-size: 1.18rem; }
  .hero-body { font-size: .96rem; }
  .signal-grid { grid-template-columns: 1fr; padding-block: 5px; }
  .signal-grid div { min-height: 62px; padding: 12px 0; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.13); }
  .signal-grid div:last-child { border-bottom: 0; }
  .value-grid, .product-grid, .support-grid { grid-template-columns: 1fr; }
  .value-grid { margin-top: 42px; }
  .value-grid article { min-height: 0; }
  .product-body > p, .product-tagline { min-height: 0; }
  .contact-grid { grid-template-columns: 1fr; gap: 34px; align-items: start; }
  .contact h2 { font-size: clamp(1.6rem, 5.8vw, 2.1rem); }
  html[lang="ja"] .contact h2, html[lang="zh-Hans"] .contact h2, html[lang="zh-Hant"] .contact h2, html[lang="ko"] .contact h2 { font-size: clamp(1.5rem, 5.4vw, 1.95rem); }
  .contact > .shell > a { justify-self: start; }
  .footer-bar { align-items: flex-start; flex-direction: column; gap: 18px; padding-block: 28px; }
  .footer-logo img { width: 142px; height: 95px; }
  .footer-copyright { padding-left: 0; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.16); border-left: 0; white-space: normal; }
  .subpage-hero { min-height: 480px; }
  .subpage-hero h1 { font-size: clamp(1.9rem, 7.5vw, 2.7rem); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}