:root {
  --bg: #f6f8fb;
  --bg-soft: #fbfcfe;
  --bg-tint: #eef3f8;
  --surface: rgba(255,255,255,.82);
  --surface-strong: #ffffff;
  --surface-dark: #0d1728;
  --text: #0f1728;
  --text-soft: #58657a;
  --line: rgba(14, 26, 43, 0.12);
  --line-strong: rgba(14, 26, 43, 0.2);
  --navy: #0d1f38;
  --blue: #164b9a;
  --cyan: #38c0df;
  --emerald: #65d0b8;
  --shadow-soft: 0 20px 60px rgba(11, 24, 43, 0.06);
  --shadow-medium: 0 30px 80px rgba(10, 22, 40, 0.10);
  --radius-xl: 34px;
  --radius-lg: 24px;
  --radius-md: 18px;
  --radius-pill: 999px;
  --container: 1240px;
  --serif: "Noto Serif JP", "Hiragino Mincho ProN", serif;
  --sans: "Inter", "Noto Sans JP", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--sans);
  color: var(--text);
  background:
    radial-gradient(circle at top right, rgba(56,192,223,.12), transparent 28%),
    linear-gradient(180deg, #fbfcff 0%, #f4f7fb 100%);
  line-height: 1.8;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
p { margin: 0 0 1rem; color: var(--text-soft); }
h1, h2, h3, h4 { margin: 0 0 1rem; color: var(--text); }
h1, h2, .display-title, .page-title {
  font-family: var(--serif);
  font-weight: 500;
  letter-spacing: -0.04em;
}
h1, .display-title {
  font-size: clamp(3rem, 6vw, 5.5rem);
  line-height: 1.08;
}
h2, .page-title {
  font-size: clamp(2rem, 3.4vw, 3.4rem);
  line-height: 1.2;
}
h3 { font-size: 1.2rem; line-height: 1.35; }
small, .eyebrow, .mini-label, .kicker {
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.container { width: min(calc(100% - 48px), var(--container)); margin: 0 auto; }
.narrow { width: min(calc(100% - 48px), 900px); }
.section { padding: 120px 0; position: relative; }
.section-tight { padding: 84px 0; }
.section-dark {
  color: #eff5ff;
  background:
    radial-gradient(circle at top left, rgba(56,192,223,.18), transparent 22%),
    linear-gradient(145deg, #08111f 0%, #10213d 62%, #132846 100%);
}
.section-dark p, .section-dark li, .section-dark .eyebrow, .section-dark .section-lead { color: rgba(239,245,255,.78); }
.section-dark h2, .section-dark h3 { color: #fff; }
.bg-tint { background: linear-gradient(180deg, rgba(233,240,247,.65) 0%, rgba(247,250,253,.8) 100%); }
.bg-white { background: rgba(255,255,255,.55); }
.divider-line {
  height: 1px; width: 100%;
  background: linear-gradient(90deg, transparent, rgba(22,75,154,.22), transparent);
  margin-top: 36px;
}
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: .78rem;
  font-weight: 700;
  color: var(--blue);
  margin-bottom: 22px;
}
.eyebrow::before {
  content: "";
  width: 34px;
  height: 1px;
  background: linear-gradient(90deg, var(--cyan), transparent);
}
.section-heading {
  display: grid;
  gap: 8px;
  margin-bottom: 42px;
}
.section-heading.center { text-align: center; justify-items: center; }
.section-heading .section-lead { max-width: 760px; }
.muted { color: var(--text-soft); }
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(248,250,253,.72);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(15, 23, 40, 0.06);
}
.nav-shell {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  min-height: 88px;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-width: 220px;
}
.brand-mark {
  width: 42px;
  height: 42px;
  border-radius: 16px;
  background:
    radial-gradient(circle at 34% 28%, rgba(255,255,255,.95), rgba(255,255,255,.2) 28%, transparent 30%),
    linear-gradient(145deg, #0f1f37 0%, #164b9a 50%, #38c0df 100%);
  position: relative;
  box-shadow: 0 16px 34px rgba(22,75,154,.22);
}
.brand-mark::after {
  content: "";
  position: absolute;
  inset: 9px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.36);
}
.brand-copy strong {
  display: block;
  font-size: .96rem;
  line-height: 1.1;
}
.brand-copy span {
  display: block;
  font-size: .72rem;
  color: var(--text-soft);
  margin-top: 4px;
}
.nav-links {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  justify-content: center;
}
.nav-links a {
  color: var(--text-soft);
  font-size: .93rem;
  transition: color .2s ease;
}
.nav-links a:hover, .nav-links a.is-active { color: var(--navy); }
.nav-actions { display: flex; align-items: center; gap: 12px; }
.mobile-toggle {
  display: none;
  width: 44px; height: 44px; border-radius: 14px; border: 1px solid var(--line);
  background: rgba(255,255,255,.7);
}
.mobile-panel { display: none; }
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 15px 22px;
  border-radius: var(--radius-pill);
  font-weight: 700;
  transition: transform .24s ease, box-shadow .24s ease, background .24s ease;
  border: 1px solid transparent;
  white-space: nowrap;
}
.btn:hover { transform: translateY(-1px); }
.btn-primary {
  color: #fff;
  background: linear-gradient(135deg, #0d1f38 0%, #164b9a 62%, #1d6ac4 100%);
  box-shadow: 0 18px 34px rgba(17, 58, 120, 0.22);
}
.btn-secondary {
  color: var(--navy);
  background: rgba(255,255,255,.78);
  border-color: rgba(13,31,56,.14);
}
.btn-ghost {
  color: #fff;
  border-color: rgba(255,255,255,.18);
  background: rgba(255,255,255,.05);
}
.hero {
  padding: 88px 0 64px;
  min-height: calc(100vh - 88px);
  display: grid;
  align-items: center;
}
.hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(420px, .94fr);
  gap: 48px;
  align-items: center;
}
.hero-copy { max-width: 660px; }
.hero-copy p { font-size: 1.04rem; }
.hero-actions {
  display: flex; gap: 14px; flex-wrap: wrap;
  margin-top: 34px; margin-bottom: 24px;
}
.meta-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.meta-chips span {
  padding: 8px 14px;
  border-radius: var(--radius-pill);
  border: 1px solid rgba(15,23,40,.10);
  background: rgba(255,255,255,.68);
  color: var(--text-soft);
  font-size: .86rem;
}
.hero-visual-wrap {
  position: relative;
  min-height: 660px;
  display: grid;
  place-items: center;
}
.glass-stage {
  width: min(100%, 610px);
  aspect-ratio: 1 / 1;
  position: relative;
  border-radius: 38px;
  background:
    radial-gradient(circle at 20% 22%, rgba(255,255,255,.85), transparent 18%),
    radial-gradient(circle at 75% 24%, rgba(56,192,223,.18), transparent 24%),
    linear-gradient(180deg, rgba(255,255,255,.66) 0%, rgba(232,239,247,.42) 100%);
  border: 1px solid rgba(255,255,255,.58);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.68), 0 28px 90px rgba(14,26,43,.09);
  backdrop-filter: blur(10px);
  overflow: hidden;
}
.glass-stage::before,
.glass-stage::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.glass-stage::before {
  background:
    linear-gradient(135deg, rgba(255,255,255,.35), transparent 22%, transparent 68%, rgba(255,255,255,.08)),
    radial-gradient(circle at 50% 50%, transparent 54%, rgba(20, 66, 132, .06) 56%, transparent 60%);
}
.glass-stage::after {
  inset: 18px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.35);
}
.orb {
  width: 68%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  position: absolute;
  inset: 50% auto auto 52%;
  transform: translate(-50%, -50%);
  background:
    radial-gradient(circle at 30% 22%, rgba(255,255,255,.95) 0%, rgba(255,255,255,.58) 14%, transparent 28%),
    radial-gradient(circle at 60% 65%, rgba(101,208,184,.26), transparent 28%),
    radial-gradient(circle at 52% 52%, rgba(56,192,223,.16), transparent 46%),
    linear-gradient(145deg, rgba(19,40,70,.16), rgba(255,255,255,.12) 44%, rgba(22,75,154,.16) 100%);
  box-shadow:
    inset -24px -22px 44px rgba(255,255,255,.12),
    inset 22px 18px 44px rgba(255,255,255,.48),
    0 44px 100px rgba(17, 45, 90, .18);
  overflow: hidden;
}
.orb::before,
.orb::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  inset: 8%;
  border: 1px solid rgba(255,255,255,.34);
}
.orb::after {
  inset: 18%;
  border-color: rgba(56,192,223,.28);
}
.orb-ring, .orb-ring::before, .orb-ring::after {
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.26);
}
.orb-ring {
  width: 82%; height: 36%;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%) rotate(-12deg);
  box-shadow: 0 0 30px rgba(56,192,223,.12);
}
.orb-ring::before, .orb-ring::after { content: ""; inset: -18% 8%; }
.orb-ring::after { inset: 18% -6%; transform: rotate(44deg); border-color: rgba(101,208,184,.18); }
.glow-line {
  position: absolute;
  width: 74%; height: 1px;
  left: 13%; top: 72%;
  background: linear-gradient(90deg, transparent, rgba(56,192,223,.46), transparent);
  filter: blur(.2px);
}
.panel-note {
  position: absolute;
  padding: 14px 18px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.55);
  background: rgba(255,255,255,.56);
  box-shadow: 0 18px 40px rgba(14,26,43,.08);
  backdrop-filter: blur(8px);
}
.panel-note small {
  display: block; color: var(--text-soft); letter-spacing: .08em; text-transform: uppercase; margin-bottom: 6px;
}
.panel-note strong { display: block; font-size: 1rem; }
.panel-note.note-a { top: 12%; left: 8%; }
.panel-note.note-b { right: 8%; bottom: 12%; }
.editorial-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .86fr);
  gap: 52px;
  align-items: center;
}
.editorial-card {
  padding: 42px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(255,255,255,.72);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(12px);
}
.statement-card {
  position: relative;
  min-height: 360px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.statement-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(145deg, rgba(255,255,255,.46), transparent 44%, rgba(56,192,223,.08) 100%);
  pointer-events: none;
}
.statement-accent {
  height: 160px;
  border-radius: 26px;
  background:
    radial-gradient(circle at 18% 22%, rgba(255,255,255,.9), transparent 20%),
    linear-gradient(135deg, rgba(12,31,56,.98), rgba(22,75,154,.94) 60%, rgba(56,192,223,.78));
  position: relative;
  overflow: hidden;
}
.statement-accent::before,
.statement-accent::after {
  content: "";
  position: absolute;
  inset: auto -10% 16% auto;
  width: 72%; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
  transform: rotate(-8deg);
}
.statement-accent::after {
  inset: 30% auto auto -6%;
  width: 58%; transform: rotate(14deg);
}
.side-notes {
  display: grid; gap: 18px;
}
.side-notes article {
  padding: 18px 0 18px 18px;
  border-left: 1px solid rgba(15,23,40,.14);
}
.motif-surface {
  position: relative;
  min-height: 420px;
  border-radius: var(--radius-xl);
  border: 1px solid rgba(255,255,255,.68);
  background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(239,244,249,.66));
  box-shadow: var(--shadow-soft);
  overflow: hidden;
}
.motif-surface::before {
  content: "";
  position: absolute;
  inset: 22px;
  border-radius: calc(var(--radius-xl) - 12px);
  border: 1px solid rgba(255,255,255,.5);
}
.system-flow {
  position: absolute;
  inset: 0;
}
.system-flow .path {
  position: absolute;
  left: 12%; top: 20%; width: 76%; height: 58%;
  border-left: 1px solid rgba(22,75,154,.18);
  border-bottom: 1px solid rgba(22,75,154,.18);
  border-radius: 0 0 120px 120px;
}
.system-flow .curve {
  position: absolute;
  left: 16%; top: 18%; width: 66%; height: 52%;
  border: 1px solid rgba(56,192,223,.34);
  border-color: rgba(56,192,223,.26) transparent transparent transparent;
  border-radius: 80% 80% 0 0;
  transform: rotate(-10deg);
}
.system-flow .node {
  position: absolute;
  width: 16px; height: 16px; border-radius: 50%;
  background: linear-gradient(135deg, #fff, rgba(56,192,223,.9));
  box-shadow: 0 0 0 8px rgba(56,192,223,.08);
}
.system-flow .node.n1 { left: 18%; top: 24%; }
.system-flow .node.n2 { left: 42%; top: 38%; }
.system-flow .node.n3 { left: 63%; top: 26%; }
.system-flow .node.n4 { left: 76%; top: 58%; }
.system-flow .label {
  position: absolute;
  padding: 10px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.84);
  border: 1px solid rgba(255,255,255,.75);
  color: var(--text-soft);
  font-size: .84rem;
}
.system-flow .l1 { left: 12%; top: 30%; }
.system-flow .l2 { left: 36%; top: 48%; }
.system-flow .l3 { left: 58%; top: 20%; }
.system-flow .l4 { right: 10%; top: 60%; }
.sequence {
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 18px;
}
.sequence article {
  position: relative;
  padding: 28px 22px 24px;
  border-radius: 22px;
  background: rgba(255,255,255,.68);
  border: 1px solid rgba(255,255,255,.72);
  box-shadow: 0 16px 36px rgba(14,26,43,.05);
}
.sequence article::before {
  content: attr(data-step);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px; height: 42px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(13,31,56,.96), rgba(22,75,154,.84));
  color: #fff;
  font-weight: 700;
  margin-bottom: 18px;
}
.curated-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(320px, 1.1fr);
  gap: 42px;
  align-items: start;
}
.curated-list {
  display: grid;
  gap: 12px;
}
.curated-list span {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border-radius: 18px;
  background: rgba(255,255,255,.76);
  border: 1px solid rgba(15,23,40,.08);
}
.curated-list span::before {
  content: "";
  width: 8px; height: 8px; border-radius: 50%;
  background: linear-gradient(135deg, var(--blue), var(--cyan));
}
.form-architecture {
  min-height: 440px;
  position: relative;
  border-radius: var(--radius-xl);
  overflow: hidden;
  background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(239,245,251,.68));
  border: 1px solid rgba(255,255,255,.82);
  box-shadow: var(--shadow-medium);
}
.form-architecture::before {
  content: "";
  position: absolute;
  inset: 20px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.56);
}
.form-topbar {
  position: absolute; left: 24px; right: 24px; top: 24px;
  display: flex; gap: 8px;
}
.form-topbar span {
  width: 10px; height: 10px; border-radius: 50%; background: rgba(13,31,56,.18);
}
.field {
  position: absolute; left: 32px; right: 32px;
  height: 54px;
  border-radius: 18px;
  background: rgba(255,255,255,.84);
  border: 1px solid rgba(15,23,40,.08);
}
.field.f1 { top: 78px; }
.field.f2 { top: 148px; }
.field.f3 { top: 218px; }
.field.f4 { top: 288px; height: 92px; }
.field::before {
  content: "";
  position: absolute;
  left: 18px; right: 25%; top: 18px; height: 8px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(13,31,56,.14), rgba(13,31,56,.04));
}
.form-checks {
  position: absolute;
  right: 32px;
  bottom: 30px;
  width: 180px;
  display: grid; gap: 10px;
}
.form-checks span {
  display: block; padding: 12px 14px; border-radius: 16px; background: rgba(255,255,255,.86); border: 1px solid rgba(15,23,40,.08); font-size: .84rem;
}
.form-checks span::before { content: "✓ "; color: var(--emerald); font-weight: 700; }
.capability-ribbon {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 42px;
  align-items: center;
}
.capability-map {
  min-height: 360px;
  position: relative;
}
.capability-map::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 50%; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(56,192,223,.48), transparent);
}
.capability-item {
  position: absolute;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(255,255,255,.84);
  box-shadow: 0 14px 30px rgba(14,26,43,.05);
  max-width: 220px;
}
.capability-item strong { display: block; margin-bottom: 4px; }
.capability-item.c1 { left: 0; top: 18px; }
.capability-item.c2 { right: 14%; top: 0; }
.capability-item.c3 { left: 12%; top: 140px; }
.capability-item.c4 { right: 0; top: 150px; }
.capability-item.c5 { left: 28%; bottom: 0; }
.capability-item::after {
  content: "";
  position: absolute;
  width: 8px; height: 8px; border-radius: 50%; background: linear-gradient(135deg, var(--blue), var(--cyan));
  bottom: -24px; left: 24px; box-shadow: 0 0 0 8px rgba(56,192,223,.08);
}
.data-story {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}
.case-panel {
  padding: 32px;
  border-radius: 30px;
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(240,245,251,.84));
  border: 1px solid rgba(255,255,255,.86);
  box-shadow: var(--shadow-medium);
}
.metric-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
  margin: 24px 0;
}
.metric-strip div {
  padding: 18px 16px;
  border-radius: 18px;
  background: rgba(255,255,255,.8);
  border: 1px solid rgba(15,23,40,.06);
}
.metric-strip strong { display: block; font-size: 1.36rem; color: var(--navy); }
.chart {
  height: 180px;
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.2), rgba(255,255,255,.1)),
    linear-gradient(180deg, rgba(15,23,40,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,23,40,.03) 1px, transparent 1px),
    linear-gradient(180deg, rgba(226,234,243,.8), rgba(243,247,251,.4));
  background-size: auto, 100% 36px, 56px 100%, auto;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.7);
}
.chart svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.compare-wrap {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 24px;
}
.compare-panel {
  padding: 34px;
  border-radius: 30px;
  background: rgba(255,255,255,.8);
  border: 1px solid rgba(255,255,255,.86);
  box-shadow: var(--shadow-soft);
}
.compare-panel.bad { background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(243,246,249,.84)); }
.compare-panel ul { margin: 18px 0 0; padding-left: 1.15rem; color: var(--text-soft); }
.process-line {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 22px;
  align-items: start;
}
.process-line::before {
  content: "";
  position: absolute;
  left: 8%; right: 8%; top: 28px; height: 1px;
  background: linear-gradient(90deg, rgba(56,192,223,.2), rgba(22,75,154,.4), rgba(56,192,223,.2));
}
.process-line article {
  position: relative;
  padding-top: 58px;
}
.process-line article::before {
  content: attr(data-step);
  position: absolute;
  top: 0; left: 0;
  width: 56px; height: 56px; border-radius: 50%;
  display: grid; place-items: center;
  font-weight: 700; color: #fff;
  background: linear-gradient(135deg, #0d1f38, #164b9a);
  box-shadow: 0 16px 26px rgba(22,75,154,.16);
}
.service-modules {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}
.service-module {
  padding: 32px;
  border-radius: 30px;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(255,255,255,.86);
  box-shadow: var(--shadow-soft);
  position: relative;
  overflow: hidden;
}
.service-module::after {
  content: "";
  position: absolute;
  right: -20px; bottom: -20px;
  width: 180px; height: 180px;
  border-radius: 28px;
  background: linear-gradient(145deg, rgba(56,192,223,.12), rgba(22,75,154,.06));
  transform: rotate(18deg);
}
.faqs {
  display: grid; gap: 12px;
}
.faq-item {
  border-radius: 22px;
  border: 1px solid rgba(15,23,40,.08);
  background: rgba(255,255,255,.82);
  overflow: hidden;
}
.faq-item button {
  width: 100%; text-align: left; background: transparent; border: 0; font: inherit; color: inherit;
  padding: 22px 24px; display: flex; justify-content: space-between; align-items: center; gap: 20px; cursor: pointer;
}
.faq-item .answer {
  max-height: 0; overflow: hidden; transition: max-height .28s ease; padding: 0 24px;
}
.faq-item.open .answer { max-height: 240px; padding-bottom: 22px; }
.cta-slab {
  padding: 56px;
  border-radius: 36px;
  border: 1px solid rgba(255,255,255,.18);
  background: linear-gradient(145deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  box-shadow: 0 34px 90px rgba(2,8,18,.26);
}
.footer {
  padding: 36px 0 48px;
  background: #0a1321;
  color: rgba(255,255,255,.82);
}
.footer-shell {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 26px;
}
.footer p, .footer a { color: rgba(255,255,255,.68); }
.footer-links {
  display: flex; flex-wrap: wrap; gap: 12px 18px; justify-content: flex-end;
}
.page-hero {
  padding: 76px 0 40px;
}
.page-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .92fr);
  gap: 48px;
  align-items: center;
}
.page-hero-copy { max-width: 700px; }
.page-visual {
  min-height: 420px;
  border-radius: 34px;
  background: linear-gradient(180deg, rgba(255,255,255,.84), rgba(238,243,248,.64));
  border: 1px solid rgba(255,255,255,.84);
  box-shadow: var(--shadow-medium);
  position: relative;
  overflow: hidden;
}
.path-visual .trail {
  position: absolute; inset: 16% 12% 20% 12%;
  border: 1px solid rgba(22,75,154,.12);
  border-radius: 120px;
  transform: rotate(-8deg);
}
.path-visual .trail.t2 { inset: 26% 18% 26% 18%; transform: rotate(10deg); border-color: rgba(56,192,223,.2); }
.path-visual .mark {
  position: absolute; width: 16px; height: 16px; border-radius: 50%;
  background: linear-gradient(135deg, #fff, var(--cyan)); box-shadow: 0 0 0 8px rgba(56,192,223,.08);
}
.path-visual .m1 { left: 18%; top: 22%; }
.path-visual .m2 { left: 48%; top: 38%; }
.path-visual .m3 { right: 16%; top: 20%; }
.path-visual .m4 { left: 34%; bottom: 18%; }
.path-visual .m5 { right: 22%; bottom: 22%; }
.checklist-visual .stack {
  position: absolute; inset: 56px 42px 56px 42px;
  display: grid; gap: 14px;
}
.checklist-visual .stack div {
  border-radius: 18px;
  background: rgba(255,255,255,.84);
  border: 1px solid rgba(15,23,40,.08);
  position: relative;
}
.checklist-visual .stack div::before {
  content: "";
  position: absolute; left: 18px; top: 20px; width: 46%; height: 8px; border-radius: 999px;
  background: linear-gradient(90deg, rgba(13,31,56,.14), rgba(13,31,56,.04));
}
.checklist-visual .stack div::after {
  content: "";
  position: absolute; right: 18px; top: 18px; width: 20px; height: 20px; border-radius: 50%;
  background: linear-gradient(135deg, var(--emerald), var(--cyan));
}
.compare-visual::before, .compare-visual::after {
  content: "";
  position: absolute; top: 12%; bottom: 12%; width: 38%; border-radius: 30px;
}
.compare-visual::before { left: 10%; background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(236,244,248,.84)); border: 1px solid rgba(15,23,40,.08); }
.compare-visual::after { right: 10%; background: linear-gradient(180deg, rgba(16,33,61,.92), rgba(18,45,88,.92)); }
.compare-visual .split-line {
  position: absolute; inset: 18% 50% 18% auto; width: 1px; background: linear-gradient(180deg, transparent, rgba(56,192,223,.5), transparent);
}
.compare-visual .bullet, .compare-visual .bullet2 {
  position: absolute; left: 16%; right: 56%; height: 10px; border-radius: 999px; background: rgba(13,31,56,.1);
}
.compare-visual .bullet { top: 24%; box-shadow: 0 52px 0 rgba(13,31,56,.08), 0 104px 0 rgba(13,31,56,.06); }
.compare-visual .bullet2 { left: auto; right: 16%; width: 22%; top: 30%; background: rgba(255,255,255,.28); box-shadow: 0 56px 0 rgba(255,255,255,.2), 0 112px 0 rgba(255,255,255,.16); }
.analytics-visual .axis {
  position: absolute; left: 14%; right: 10%; bottom: 18%; top: 18%;
  border-left: 1px solid rgba(15,23,40,.12);
  border-bottom: 1px solid rgba(15,23,40,.12);
}
.analytics-visual svg { position: absolute; inset: 12% 8% 14% 12%; width: 80%; height: 74%; }
.tiles-visual {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 32px;
}
.tiles-visual div {
  border-radius: 24px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(15,23,40,.08);
  min-height: 148px;
  position: relative;
  overflow: hidden;
}
.tiles-visual div::before {
  content: "";
  position: absolute; left: 18px; top: 18px; width: 42px; height: 42px; border-radius: 14px;
  background: linear-gradient(145deg, rgba(13,31,56,.95), rgba(56,192,223,.82));
}
.tiles-visual div::after {
  content: "";
  position: absolute; left: 18px; right: 22%; bottom: 24px; height: 8px; border-radius: 999px;
  background: linear-gradient(90deg, rgba(13,31,56,.12), rgba(13,31,56,.04));
  box-shadow: 0 -18px 0 rgba(13,31,56,.08);
}
.identity-visual {
  position: relative;
}
.identity-visual::before, .identity-visual::after {
  content: "";
  position: absolute;
  border-radius: 28px;
  border: 1px solid rgba(15,23,40,.08);
  background: rgba(255,255,255,.78);
}
.identity-visual::before { inset: 58px 34% 160px 46px; }
.identity-visual::after { inset: 120px 48px 58px 48%; }
.identity-visual .grid-line {
  position: absolute; inset: 32px;
  background:
    linear-gradient(90deg, rgba(15,23,40,.05) 1px, transparent 1px),
    linear-gradient(180deg, rgba(15,23,40,.05) 1px, transparent 1px);
  background-size: 64px 100%, 100% 56px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,.86), transparent);
}
.hero-summary {
  margin-top: 54px;
  display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px;
}
.hero-summary .mini {
  padding: 20px; border-radius: 22px; background: rgba(255,255,255,.72); border: 1px solid rgba(255,255,255,.78); box-shadow: 0 18px 40px rgba(14,26,43,.04);
}
.stat-callout {
  display: grid; grid-template-columns: minmax(0,.92fr) minmax(320px,1.08fr); gap: 42px; align-items: center;
}
.signature-quote {
  font-family: var(--serif);
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1.28;
  letter-spacing: -0.04em;
  max-width: 720px;
}
.page-grid-2 {
  display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 24px;
}
.info-table {
  display: grid; gap: 16px;
}
.info-row {
  display: grid; grid-template-columns: 180px 1fr; gap: 20px;
  padding: 22px 24px; border-radius: 22px; background: rgba(255,255,255,.82); border: 1px solid rgba(15,23,40,.08);
}
.table-list { margin: 0; padding-left: 1.2rem; color: var(--text-soft); }
.helper-note {
  padding: 18px 22px; border-radius: 20px; background: rgba(56,192,223,.08); border: 1px dashed rgba(22,75,154,.18); color: var(--text-soft);
}
.form-embed-card {
  padding: clamp(22px, 4vw, 44px);
  background: var(--surface-strong);
  border: 1px solid rgba(15,23,40,.08);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-medium);
}
.diagnosis-form { display: grid; gap: 34px; }
.form-group { display: grid; gap: 18px; }
.form-group-title {
  font-family: var(--serif);
  font-size: 1.18rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  margin: 0;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 20px; }
.form-field { display: grid; gap: 8px; align-content: start; }
.form-field-wide { grid-column: 1 / -1; }
.form-field label, .form-label {
  font-size: .9rem; font-weight: 600; color: var(--navy);
  display: inline-flex; align-items: center; gap: 8px;
}
.req {
  font-size: .66rem; font-weight: 700; letter-spacing: .04em; color: #fff;
  background: linear-gradient(135deg, var(--blue), var(--cyan));
  padding: 2px 8px; border-radius: var(--radius-pill);
}
.form-field input[type="text"],
.form-field input[type="email"],
.form-field input[type="tel"],
.form-field input[type="url"],
.form-field select,
.form-field textarea {
  width: 100%;
  font: inherit;
  color: var(--text);
  padding: 13px 16px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,40,.14);
  background: rgba(255,255,255,.92);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.form-field textarea { resize: vertical; min-height: 104px; line-height: 1.7; }
.form-field select {
  appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: 42px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23164b9a' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 16px center;
}
.form-field input::placeholder, .form-field textarea::placeholder { color: rgba(88,101,122,.6); }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus {
  outline: none; border-color: var(--blue); box-shadow: 0 0 0 4px rgba(22,75,154,.12);
}
.choice-row { display: flex; flex-wrap: wrap; gap: 10px; }
.choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.choice {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 11px 16px; border-radius: 14px;
  border: 1px solid rgba(15,23,40,.12); background: rgba(255,255,255,.7);
  cursor: pointer; font-size: .92rem; color: var(--text-soft);
  transition: border-color .2s ease, background .2s ease, color .2s ease;
}
.choice input { accent-color: var(--blue); width: 17px; height: 17px; flex: none; }
.choice:hover { border-color: rgba(22,75,154,.4); }
.choice:has(input:checked) { border-color: var(--blue); background: rgba(22,75,154,.06); color: var(--navy); }
.form-foot { display: grid; gap: 16px; justify-items: center; text-align: center; margin-top: 4px; }
.form-consent { font-size: .82rem; color: var(--text-soft); margin: 0; max-width: 540px; }
.form-submit { min-width: 260px; }
.form-error { color: #c0392b; font-size: .88rem; margin: 0; }
.form-success { display: grid; justify-items: center; text-align: center; gap: 12px; padding: 48px 24px; }
.form-success-mark {
  width: 60px; height: 60px; border-radius: 50%;
  display: grid; place-items: center; font-size: 1.6rem; color: #fff;
  background: linear-gradient(135deg, var(--blue), var(--emerald));
  box-shadow: 0 16px 34px rgba(22,75,154,.22);
}
.form-success strong { font-size: 1.3rem; font-family: var(--serif); font-weight: 600; color: var(--navy); }
@media (max-width: 640px) {
  .form-grid, .choice-grid { grid-template-columns: 1fr; }
}
@media (max-width: 1100px) {
  .nav-links, .nav-actions .btn { display: none; }
  .mobile-toggle { display: inline-flex; align-items: center; justify-content: center; }
  .mobile-panel {
    display: none;
    padding: 0 0 20px;
  }
  .mobile-panel.open { display: grid; }
  .mobile-panel a {
    padding: 12px 0; border-top: 1px solid rgba(15,23,40,.06); color: var(--text-soft);
  }
  .hero-grid, .editorial-split, .curated-grid, .capability-ribbon, .stat-callout, .page-hero-grid { grid-template-columns: 1fr; }
  .hero-visual-wrap { min-height: 520px; }
  .sequence, .process-line, .compare-wrap, .data-story, .service-modules, .page-grid-2, .hero-summary { grid-template-columns: 1fr; }
  .footer-shell { grid-template-columns: 1fr; }
  .footer-links { justify-content: flex-start; }
}
@media (max-width: 780px) {
  .section { padding: 88px 0; }
  .hero { padding-top: 42px; }
  .container, .narrow { width: min(calc(100% - 28px), var(--container)); }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .btn { width: 100%; }
  .editorial-card, .case-panel, .compare-panel, .service-module, .cta-slab { padding: 28px; }
  .metric-strip { grid-template-columns: 1fr; }
  .info-row { grid-template-columns: 1fr; }
  .hero-visual-wrap { min-height: 420px; }
  .glass-stage { width: 100%; }
}
