:root {
  --ink: #102033;
  --ink-soft: #344657;
  --paper: #f4f8f9;
  --white: #ffffff;
  --line: #d8e5ea;
  --blue: #0b67b2;
  --blue-dark: #081f35;
  --teal: #00a3a7;
  --lime: #7bbf3f;
  --coral: #e05d45;
  --mint: #e8f7f2;
  --sand: #f2efe8;
  --steel: #eaf1f5;
  --shadow: 0 22px 70px rgba(14, 42, 61, 0.16);
  --radius: 8px;
  --header-height: 76px;
  color-scheme: light;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--ink);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(234, 245, 244, 0.86)),
    repeating-linear-gradient(90deg, rgba(0, 163, 167, 0.045) 0 1px, transparent 1px 80px);
  font-family:
    "Noto Sans JP",
    "Hiragino Kaku Gothic ProN",
    "Yu Gothic",
    Meiryo,
    system-ui,
    sans-serif;
  line-height: 1.75;
}

body.nav-open {
  overflow: hidden;
}

img {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

h1,
h2,
h3,
p,
li,
dd,
td,
th {
  overflow-wrap: break-word;
  word-break: normal;
  line-break: strict;
  text-wrap: pretty;
}

@supports (word-break: auto-phrase) {
  h1,
  h2,
  h3,
  p,
  li,
  dd,
  td,
  th {
    word-break: auto-phrase;
  }
}

.skip-link,
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link:focus {
  z-index: 100;
  top: 12px;
  left: 12px;
  width: auto;
  height: auto;
  padding: 10px 14px;
  clip: auto;
  background: var(--white);
  border: 2px solid var(--blue);
}

.site-header {
  position: fixed;
  z-index: 30;
  inset: 0 0 auto;
  height: var(--header-height);
  background: rgba(250, 253, 253, 0.88);
  border-bottom: 1px solid rgba(185, 210, 220, 0.75);
  backdrop-filter: blur(18px);
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(1180px, calc(100% - 40px));
  height: 100%;
  margin: 0 auto;
  gap: 22px;
}

.brand {
  flex: 0 0 auto;
}

.brand img,
.footer-logo img {
  width: 190px;
  height: auto;
  filter: brightness(0) saturate(100%) invert(21%) sepia(46%) saturate(1116%) hue-rotate(175deg) brightness(92%) contrast(93%);
}

.site-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 18px;
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.nav-item {
  position: relative;
}

.site-nav a {
  position: relative;
  padding: 8px 0;
}

.has-dropdown > .nav-link {
  display: inline-flex;
  gap: 6px;
  align-items: center;
}

.has-dropdown > .nav-link::after {
  width: 6px;
  height: 6px;
  content: "";
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
}

.site-nav a[aria-current="page"],
.site-nav a:hover,
.site-nav a:focus-visible {
  color: var(--blue);
}

.nav-dropdown {
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  z-index: 40;
  display: grid;
  min-width: 220px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: var(--radius);
  box-shadow: 0 24px 54px rgba(16, 32, 45, 0.16);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -6px);
  transition: opacity 160ms ease, transform 160ms ease;
}

.nav-dropdown::before {
  position: absolute;
  inset: -16px 0 auto;
  height: 16px;
  content: "";
}

.nav-dropdown a {
  padding: 10px 12px;
  color: var(--ink);
  border-radius: 6px;
}

.nav-dropdown a:hover,
.nav-dropdown a:focus-visible {
  color: var(--blue);
  background: rgba(42, 181, 184, 0.1);
}

.nav-item:hover .nav-dropdown,
.nav-item:focus-within .nav-dropdown {
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, 0);
}

.site-nav .nav-contact {
  padding: 10px 15px;
  color: var(--white);
  background: linear-gradient(135deg, var(--blue), var(--teal));
  border-radius: var(--radius);
}

.nav-toggle {
  display: none;
  width: 44px;
  height: 44px;
  padding: 0;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.nav-toggle span:not(.sr-only) {
  display: block;
  width: 20px;
  height: 2px;
  margin: 5px auto;
  background: var(--ink);
  transition: transform 180ms ease, opacity 180ms ease;
}

.nav-open .nav-toggle span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.nav-open .nav-toggle span:nth-child(2) {
  opacity: 0;
}

.nav-open .nav-toggle span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

.hero {
  position: relative;
  display: grid;
  align-items: center;
  min-height: min(540px, 64svh);
  padding: calc(var(--header-height) + 48px) 0 40px;
  color: var(--white);
  overflow: hidden;
  isolation: isolate;
  background: var(--blue-dark);
}

.hero-media {
  position: absolute;
  inset: 0;
  z-index: -3;
  background-size: cover;
  background-position: center;
  transform: scale(1.03);
  filter: saturate(0.78) contrast(1.08);
}

.hero::before {
  position: absolute;
  inset: 0;
  z-index: -2;
  content: "";
  background:
    linear-gradient(90deg, rgba(5, 17, 28, 0.96), rgba(5, 36, 52, 0.78) 52%, rgba(5, 17, 28, 0.32)),
    linear-gradient(135deg, rgba(0, 163, 167, 0.34), rgba(123, 191, 63, 0.18) 48%, rgba(224, 93, 69, 0.2));
}

.hero-pattern {
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: 0.56;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.09) 1px, transparent 1px) 0 0 / 80px 80px,
    linear-gradient(0deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px) 0 0 / 80px 80px,
    linear-gradient(135deg, transparent 0 45%, rgba(0, 163, 167, 0.22) 45% 46%, transparent 46% 100%);
  mask-image: linear-gradient(90deg, #000, rgba(0, 0, 0, 0.72) 56%, transparent);
}

.hero-content,
.section-inner,
.footer-inner,
.footer-bottom {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
}

.hero-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  align-items: center;
  max-width: min(1180px, calc(100% - 40px));
}

.eyebrow,
.section-kicker,
.label {
  margin: 0 0 12px;
  color: var(--teal);
  font-size: 12px;
  font-weight: 900;
  line-height: 1.3;
  letter-spacing: 0;
  text-transform: uppercase;
}

.hero .eyebrow {
  color: #a9e2df;
}

.nowrap {
  white-space: nowrap;
}

.hero h1 {
  max-width: 100%;
  margin: 0;
  font-size: clamp(42px, 5.5vw, 74px);
  font-weight: 900;
  line-height: 1.08;
  letter-spacing: 0;
  white-space: nowrap;
}

.hero-lead {
  max-width: 100%;
  margin: 22px 0 0;
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 800;
  line-height: 1.7;
  white-space: nowrap;
}

.hero-actions,
.button-row,
.cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 20px;
  border: 1px solid transparent;
  border-radius: var(--radius);
  font-size: 15px;
  font-weight: 900;
  line-height: 1.35;
  cursor: pointer;
  transition: transform 180ms ease, background 180ms ease, border-color 180ms ease;
}

.button:hover,
.button:focus-visible {
  transform: translateY(-2px);
}

.button-primary {
  color: var(--white);
  background: linear-gradient(135deg, var(--coral), #f0784d);
}

.button-secondary {
  color: var(--white);
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.62);
}

.button-light {
  color: var(--blue-dark);
  background: var(--white);
}

.button-outline {
  color: var(--blue-dark);
  background: var(--white);
  border-color: rgba(13, 55, 78, 0.22);
}

.button-outline-light {
  color: var(--white);
  border-color: rgba(255, 255, 255, 0.64);
}

.section {
  padding: 92px 0;
  position: relative;
}

section[id] {
  scroll-margin-top: calc(var(--header-height) + 28px);
}

.muted {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.58), rgba(234, 241, 245, 0.84)),
    var(--steel);
}

.band-blue {
  color: var(--white);
  background:
    linear-gradient(90deg, rgba(8, 31, 53, 0.98), rgba(0, 163, 167, 0.72)),
    url("https://www.reseau.co.jp/theme/reseau/images/top/img_02.jpg") center / cover;
}

.band-blue .section-kicker {
  color: #a9e2df;
}

.recruit-summary-section {
  padding: 70px 0;
}

.recruit-summary-section .split {
  align-items: center;
}

.recruit-summary-section h2 {
  font-size: clamp(24px, 2.6vw, 34px);
  line-height: 1.22;
}

.recruit-summary-section p:not(.section-kicker) {
  margin-bottom: 0;
  font-size: 16px;
  line-height: 1.75;
}

.recruit-summary-section .button-row {
  justify-content: flex-end;
  margin-top: 0;
}

.section-heading {
  max-width: 760px;
  margin-bottom: 40px;
}

.section-heading.compact {
  max-width: 560px;
}

.heading-with-actions {
  display: flex;
  gap: 18px 24px;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.heading-with-actions h2 {
  margin: 0;
}

.button-row.compact {
  gap: 10px;
  margin-top: 0;
}

.button-row.compact .button {
  min-height: 48px;
  padding: 14px 22px;
  font-size: 14px;
  white-space: nowrap;
}

.section h2 {
  margin: 0;
  font-size: clamp(28px, 4vw, 46px);
  font-weight: 900;
  line-height: 1.3;
  letter-spacing: 0;
}

.concept-title {
  font-size: clamp(52px, 7vw, 88px);
  line-height: 1.08;
}

.concept-subtitle {
  margin: 18px 0 0;
  color: var(--ink);
  font-size: clamp(17px, 1.7vw, 22px);
  font-weight: 900;
  line-height: 1.5;
}

.section-heading p:not(.section-kicker),
.lead-copy,
.content-card p,
.detail-card p,
.prose,
.cta-box p {
  color: var(--ink-soft);
  font-size: 16px;
}

.band-blue p,
.band-blue .lead-copy {
  color: rgba(255, 255, 255, 0.94);
}

.lead-grid,
.split,
.listing-grid,
.contact-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 58px;
  align-items: start;
}

.lead-grid > *,
.split > *,
.listing-grid > *,
.contact-layout > *,
.card-grid > *,
.feature-grid > *,
.service-detail-list > * {
  min-width: 0;
}

.lead-copy p:first-child {
  margin-top: 0;
}

.lead-copy p:last-child {
  margin-bottom: 0;
}

.lead-grid,
.split:has(> .lead-copy) {
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
}

.lead-grid > .lead-copy,
.split:has(> .lead-copy) > .lead-copy,
.message-copy {
  max-width: 920px;
  padding-top: 0;
}

.signature {
  color: var(--ink);
  font-weight: 900;
}

.card-grid {
  display: grid;
  gap: 18px;
}

.card-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.card-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.card-grid.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.business-summary-section {
  padding-top: 78px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 249, 250, 0.96));
}

.business-summary-heading {
  max-width: 900px;
}

.business-summary-heading p:not(.section-kicker) {
  max-width: 820px;
}

.business-summary-heading h2 {
  white-space: nowrap;
}

.business-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.business-summary-grid > * {
  min-width: 0;
}

.business-summary-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 188px;
  padding: 22px 18px;
  overflow: hidden;
  color: var(--ink);
  text-decoration: none;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(255, 255, 255, 0.88)),
    var(--white);
  border: 1px solid rgba(185, 210, 220, 0.88);
  border-radius: var(--radius);
  box-shadow: 0 18px 44px rgba(18, 39, 58, 0.08);
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.business-summary-card::before {
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  content: "";
  background: linear-gradient(90deg, #d6be7a, var(--teal), var(--coral));
}

.business-summary-card::after {
  margin-top: auto;
  color: var(--teal);
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
  content: "→";
  transition: transform 0.22s ease;
}

.business-summary-card span {
  display: inline-flex;
  margin-bottom: 14px;
  color: #9b7b2f;
  font-size: 11px;
  font-weight: 900;
}

.business-summary-card h3 {
  margin: 0 0 10px;
  font-size: clamp(18px, 1.35vw, 21px);
  line-height: 1.3;
  white-space: nowrap;
}

.business-summary-card p {
  margin: 0 0 18px;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.7;
  line-break: strict;
  overflow-wrap: break-word;
  text-wrap: pretty;
  word-break: normal;
}

.business-summary-card:hover,
.business-summary-card:focus-visible {
  border-color: rgba(42, 181, 184, 0.58);
  box-shadow: 0 24px 54px rgba(18, 39, 58, 0.13);
  transform: translateY(-3px);
}

.business-summary-card:hover::after,
.business-summary-card:focus-visible::after {
  transform: translateX(8px);
}

.business-summary-card:focus-visible {
  outline: 3px solid rgba(42, 181, 184, 0.24);
  outline-offset: 3px;
}

.business-map-shell {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  padding: 28px;
  overflow: hidden;
  isolation: isolate;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 251, 0.94)),
    repeating-linear-gradient(90deg, rgba(7, 42, 68, 0.05) 0 1px, transparent 1px 82px),
    var(--white);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: var(--radius);
  box-shadow: 0 28px 72px rgba(18, 39, 58, 0.11);
}

.business-map-shell::before {
  position: absolute;
  inset: 68px 11%;
  z-index: 0;
  pointer-events: none;
  content: "";
  opacity: 0.65;
  background:
    linear-gradient(135deg, transparent calc(50% - 1px), rgba(42, 181, 184, 0.28) calc(50% - 1px), rgba(42, 181, 184, 0.28) calc(50% + 1px), transparent calc(50% + 1px)),
    linear-gradient(45deg, transparent calc(50% - 1px), rgba(155, 123, 47, 0.24) calc(50% - 1px), rgba(155, 123, 47, 0.24) calc(50% + 1px), transparent calc(50% + 1px));
}

.business-map-core {
  position: relative;
  z-index: 1;
  display: grid;
  grid-column: 2;
  grid-row: 2;
  align-content: center;
  justify-items: center;
  min-height: 206px;
  padding: 28px 24px;
  color: var(--white);
  text-align: center;
  background:
    linear-gradient(135deg, rgba(8, 31, 53, 0.98), rgba(8, 75, 90, 0.96)),
    var(--blue-dark);
  border: 1px solid rgba(214, 190, 122, 0.42);
  border-radius: var(--radius);
  box-shadow: 0 28px 64px rgba(8, 31, 53, 0.22);
}

.business-map-core span,
.business-map-node span {
  color: #9b7b2f;
  font-size: 12px;
  font-weight: 900;
}

.business-map-core span {
  color: #d6be7a;
}

.business-map-core strong {
  display: block;
  margin-top: 10px;
  font-size: clamp(25px, 2.6vw, 34px);
  line-height: 1.25;
}

.business-map-core p {
  max-width: 280px;
  margin: 16px 0 0;
  color: rgba(255, 255, 255, 0.9);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.7;
}

.business-map-node {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: 184px;
  padding: 24px;
  overflow: hidden;
  color: var(--ink);
  text-decoration: none;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.9)),
    var(--white);
  border: 1px solid rgba(185, 210, 220, 0.92);
  border-radius: var(--radius);
  box-shadow: 0 18px 44px rgba(18, 39, 58, 0.08);
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.business-map-node::before {
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  content: "";
  background: linear-gradient(90deg, #d6be7a, var(--teal), var(--coral));
}

.business-map-node h3 {
  margin: 14px 0 10px;
  font-size: clamp(19px, 1.45vw, 23px);
  line-height: 1.32;
  white-space: nowrap;
}

.business-map-node p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.65;
}

.business-map-node em {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin-top: auto;
  padding-top: 18px;
  color: var(--blue);
  font-style: normal;
  font-weight: 900;
}

.business-map-node em::after {
  width: 24px;
  height: 8px;
  margin-left: 10px;
  content: "";
  background: var(--coral);
  clip-path: polygon(0 43%, calc(100% - 8px) 43%, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, calc(100% - 8px) 57%, 0 57%);
  transition: width 180ms ease, transform 180ms ease;
}

.business-map-node:hover,
.business-map-node:focus-visible {
  border-color: rgba(42, 181, 184, 0.6);
  box-shadow: 0 24px 54px rgba(18, 39, 58, 0.13);
  transform: translateY(-3px);
}

.business-map-node:hover em::after,
.business-map-node:focus-visible em::after {
  width: 38px;
  transform: translateX(2px);
}

.business-map-node:focus-visible {
  outline: 3px solid rgba(42, 181, 184, 0.24);
  outline-offset: 3px;
}

.map-it {
  grid-column: 1;
  grid-row: 1;
}

.map-people {
  grid-column: 3;
  grid-row: 1;
}

.map-telecom {
  grid-column: 1;
  grid-row: 3;
}

.map-infra {
  grid-column: 3;
  grid-row: 3;
}

@media (max-width: 940px) {
  .business-map-shell {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 22px;
  }

  .business-map-shell::before {
    display: none;
  }

  .business-map-core {
    grid-column: 1 / -1;
    grid-row: auto;
    min-height: 0;
    order: -1;
  }

  .business-map-node {
    grid-column: auto;
    grid-row: auto;
    min-height: 0;
  }

  .business-map-node h3 {
    white-space: normal;
  }
}

@media (max-width: 640px) {
  .business-map-shell {
    grid-template-columns: 1fr;
    padding: 18px;
  }

  .business-map-core,
  .business-map-node {
    padding: 22px;
  }
}

.business-premium-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.business-premium-card {
  position: relative;
  display: flex;
  min-height: 390px;
  padding: 24px;
  overflow: hidden;
  color: var(--white);
  text-decoration: none;
  background:
    linear-gradient(180deg, rgba(8, 31, 53, 0.18), rgba(8, 31, 53, 0.88)),
    var(--card-image) center / cover;
  border: 1px solid rgba(214, 190, 122, 0.38);
  border-radius: var(--radius);
  box-shadow: 0 28px 68px rgba(18, 39, 58, 0.16);
  transition: transform 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease;
}

.business-premium-card::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 34%),
    linear-gradient(90deg, rgba(214, 190, 122, 0.26), transparent 42%);
  opacity: 0.86;
}

.business-premium-card::after {
  position: absolute;
  inset: auto 0 0;
  height: 5px;
  content: "";
  background: linear-gradient(90deg, #d6be7a, var(--teal), var(--coral));
}

.premium-index {
  position: absolute;
  top: 20px;
  right: 22px;
  z-index: 1;
  color: rgba(255, 255, 255, 0.55);
  font-size: clamp(42px, 4.4vw, 72px);
  font-weight: 900;
  line-height: 0.9;
}

.premium-card-body {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-self: flex-end;
  min-width: 0;
}

.premium-card-body p {
  width: fit-content;
  margin: 0 0 12px;
  padding: 6px 10px;
  color: #102d3d;
  font-size: 11px;
  font-weight: 900;
  background: rgba(214, 190, 122, 0.92);
  border-radius: 999px;
}

.premium-card-body h3 {
  margin: 0;
  font-size: clamp(22px, 1.9vw, 28px);
  line-height: 1.28;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.34);
}

.premium-card-body strong {
  display: block;
  margin-top: 13px;
  color: rgba(255, 255, 255, 0.94);
  font-size: 14px;
  line-height: 1.72;
}

.premium-card-body em {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin-top: 22px;
  color: var(--white);
  font-style: normal;
  font-weight: 900;
}

.premium-card-body em::after {
  width: 24px;
  height: 8px;
  margin-left: 10px;
  content: "";
  background: #d6be7a;
  clip-path: polygon(0 43%, calc(100% - 8px) 43%, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, calc(100% - 8px) 57%, 0 57%);
  transition: width 180ms ease, transform 180ms ease;
}

.business-premium-card:hover,
.business-premium-card:focus-visible {
  border-color: rgba(214, 190, 122, 0.78);
  box-shadow: 0 34px 76px rgba(18, 39, 58, 0.22);
  transform: translateY(-4px);
}

.business-premium-card:hover .premium-card-body em::after,
.business-premium-card:focus-visible .premium-card-body em::after {
  width: 40px;
  transform: translateX(2px);
}

.business-premium-card:focus-visible {
  outline: 3px solid rgba(42, 181, 184, 0.24);
  outline-offset: 3px;
}

@media (max-width: 1120px) {
  .business-premium-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .business-premium-card {
    min-height: 320px;
  }
}

@media (max-width: 640px) {
  .business-premium-grid {
    grid-template-columns: 1fr;
  }

  .business-premium-card {
    min-height: 280px;
  }
}

.business-problem-shell {
  display: grid;
  grid-template-columns: minmax(280px, 0.78fr) minmax(0, 1.22fr);
  gap: 22px;
  padding: 26px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 251, 0.95)),
    repeating-linear-gradient(90deg, rgba(7, 42, 68, 0.045) 0 1px, transparent 1px 82px),
    var(--white);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: var(--radius);
  box-shadow: 0 28px 72px rgba(18, 39, 58, 0.1);
}

.problem-hero {
  display: grid;
  align-content: center;
  min-height: 100%;
  padding: 34px;
  color: var(--white);
  background:
    linear-gradient(135deg, rgba(8, 31, 53, 0.98), rgba(8, 75, 90, 0.95)),
    var(--blue-dark);
  border: 1px solid rgba(214, 190, 122, 0.4);
  border-radius: var(--radius);
  box-shadow: 0 24px 56px rgba(8, 31, 53, 0.2);
}

.problem-hero span {
  color: #d6be7a;
  font-size: 12px;
  font-weight: 900;
}

.problem-hero h3 {
  margin: 16px 0 0;
  font-size: clamp(27px, 2.7vw, 38px);
  line-height: 1.24;
}

.problem-hero p {
  margin: 18px 0 0;
  color: rgba(255, 255, 255, 0.9);
  font-size: 15px;
  font-weight: 800;
  line-height: 1.85;
}

.problem-route-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.problem-route-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 280px;
  padding: 24px;
  overflow: hidden;
  color: var(--ink);
  text-decoration: none;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.9)),
    var(--white);
  border: 1px solid rgba(185, 210, 220, 0.92);
  border-radius: var(--radius);
  box-shadow: 0 18px 44px rgba(18, 39, 58, 0.07);
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.problem-route-card::before {
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  content: "";
  background: linear-gradient(90deg, #d6be7a, var(--teal), var(--coral));
}

.problem-tag {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  color: #9b7b2f;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.55;
}

.problem-route-card h3 {
  margin: 12px 0 10px;
  font-size: clamp(19px, 1.55vw, 23px);
  line-height: 1.35;
}

.problem-route-card p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.72;
}

.problem-route-card ul {
  display: grid;
  gap: 6px;
  padding: 0;
  margin: 16px 0 0;
  list-style: none;
}

.problem-route-card li {
  position: relative;
  padding-left: 16px;
  color: var(--ink);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.55;
}

.problem-route-card li::before {
  position: absolute;
  top: 0.68em;
  left: 0;
  width: 6px;
  height: 6px;
  content: "";
  background: var(--teal);
  border-radius: 50%;
}

.problem-route-card em {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin-top: auto;
  padding-top: 18px;
  color: var(--blue);
  font-style: normal;
  font-weight: 900;
}

.problem-route-card em::after {
  width: 24px;
  height: 8px;
  margin-left: 10px;
  content: "";
  background: var(--coral);
  clip-path: polygon(0 43%, calc(100% - 8px) 43%, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, calc(100% - 8px) 57%, 0 57%);
  transition: width 180ms ease, transform 180ms ease;
}

.problem-route-card:hover,
.problem-route-card:focus-visible {
  border-color: rgba(42, 181, 184, 0.6);
  box-shadow: 0 24px 54px rgba(18, 39, 58, 0.13);
  transform: translateY(-3px);
}

.problem-route-card:hover em::after,
.problem-route-card:focus-visible em::after {
  width: 38px;
  transform: translateX(2px);
}

.problem-route-card:focus-visible {
  outline: 3px solid rgba(42, 181, 184, 0.24);
  outline-offset: 3px;
}

@media (max-width: 1040px) {
  .business-problem-shell {
    grid-template-columns: 1fr;
  }

  .problem-hero {
    min-height: 0;
  }
}

@media (max-width: 640px) {
  .business-problem-shell {
    padding: 18px;
  }

  .problem-hero {
    padding: 24px;
  }

  .problem-route-grid {
    grid-template-columns: 1fr;
  }

  .problem-route-card {
    min-height: 0;
    padding: 22px;
  }
}

.business-dashboard {
  display: grid;
  grid-template-columns: minmax(300px, 0.72fr) minmax(0, 1.28fr);
  gap: 24px;
  padding: 26px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 251, 0.94)),
    repeating-linear-gradient(90deg, rgba(7, 42, 68, 0.045) 0 1px, transparent 1px 82px),
    var(--white);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: var(--radius);
  box-shadow: 0 28px 72px rgba(18, 39, 58, 0.1);
}

.dashboard-lead {
  display: grid;
  align-content: center;
  min-height: 100%;
  padding: 36px;
  color: var(--white);
  background:
    linear-gradient(135deg, rgba(8, 31, 53, 0.98), rgba(8, 75, 90, 0.95)),
    var(--blue-dark);
  border: 1px solid rgba(214, 190, 122, 0.42);
  border-radius: var(--radius);
  box-shadow: 0 24px 56px rgba(8, 31, 53, 0.2);
}

.dashboard-lead span {
  color: #d6be7a;
  font-size: 12px;
  font-weight: 900;
}

.dashboard-lead h3 {
  margin: 16px 0 0;
  font-size: clamp(28px, 2.8vw, 40px);
  line-height: 1.24;
}

.dashboard-lead p {
  margin: 18px 0 0;
  color: rgba(255, 255, 255, 0.92);
  font-size: 15px;
  font-weight: 800;
  line-height: 1.85;
}

.dashboard-lead .text-link {
  margin-top: 28px;
  color: var(--white);
}

.dashboard-lead .text-link::after {
  background: #d6be7a;
}

.dashboard-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.dashboard-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 260px;
  padding: 24px;
  overflow: hidden;
  color: var(--ink);
  text-decoration: none;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.9)),
    var(--white);
  border: 1px solid rgba(185, 210, 220, 0.92);
  border-radius: var(--radius);
  box-shadow: 0 18px 44px rgba(18, 39, 58, 0.07);
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.dashboard-card::before {
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  content: "";
  background: linear-gradient(90deg, #d6be7a, var(--teal), var(--coral));
}

.dashboard-card span {
  color: #9b7b2f;
  font-size: 12px;
  font-weight: 900;
}

.dashboard-card h3 {
  margin: 12px 0 16px;
  font-size: clamp(19px, 1.5vw, 23px);
  line-height: 1.35;
}

.dashboard-card dl {
  display: grid;
  gap: 10px;
  margin: 0;
}

.dashboard-card dl div {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(185, 210, 220, 0.74);
}

.dashboard-card dt,
.dashboard-card dd {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
}

.dashboard-card dt {
  color: var(--ink);
  font-weight: 900;
  white-space: nowrap;
}

.dashboard-card dd {
  color: var(--ink-soft);
  font-weight: 800;
}

.dashboard-card em {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin-top: auto;
  padding-top: 18px;
  color: var(--blue);
  font-style: normal;
  font-weight: 900;
}

.dashboard-card em::after {
  width: 24px;
  height: 8px;
  margin-left: 10px;
  content: "";
  background: var(--coral);
  clip-path: polygon(0 43%, calc(100% - 8px) 43%, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, calc(100% - 8px) 57%, 0 57%);
  transition: width 180ms ease, transform 180ms ease;
}

.dashboard-card:hover,
.dashboard-card:focus-visible {
  border-color: rgba(42, 181, 184, 0.6);
  box-shadow: 0 24px 54px rgba(18, 39, 58, 0.13);
  transform: translateY(-3px);
}

.dashboard-card:hover em::after,
.dashboard-card:focus-visible em::after {
  width: 38px;
  transform: translateX(2px);
}

.dashboard-card:focus-visible {
  outline: 3px solid rgba(42, 181, 184, 0.24);
  outline-offset: 3px;
}

@media (max-width: 1080px) {
  .business-dashboard {
    grid-template-columns: 1fr;
  }

  .dashboard-lead {
    min-height: 0;
  }
}

@media (max-width: 640px) {
  .business-dashboard {
    padding: 18px;
  }

  .dashboard-lead {
    padding: 24px;
  }

  .dashboard-card-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-card {
    min-height: 0;
    padding: 22px;
  }

  .dashboard-card dl div {
    grid-template-columns: 1fr;
    gap: 3px;
  }
}

.business-pillar-visual {
  padding: 28px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 251, 0.95)),
    repeating-linear-gradient(90deg, rgba(7, 42, 68, 0.045) 0 1px, transparent 1px 82px),
    var(--white);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: var(--radius);
  box-shadow: 0 28px 72px rgba(18, 39, 58, 0.1);
}

.pillar-visual-lead {
  display: grid;
  grid-template-columns: minmax(260px, 0.42fr) minmax(0, 1fr);
  gap: 24px;
  align-items: end;
  padding: 0 0 26px;
  border-bottom: 1px solid rgba(185, 210, 220, 0.82);
}

.pillar-visual-lead span {
  color: #9b7b2f;
  font-size: 12px;
  font-weight: 900;
}

.pillar-visual-lead h3 {
  margin: 12px 0 0;
  font-size: clamp(30px, 3vw, 44px);
  line-height: 1.18;
}

.pillar-visual-lead p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.8;
}

.pillar-visual-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  padding-top: 26px;
}

.pillar-visual-card {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr;
  min-height: 430px;
  overflow: hidden;
  color: var(--ink);
  text-decoration: none;
  background: var(--white);
  border: 1px solid rgba(185, 210, 220, 0.92);
  border-radius: var(--radius);
  box-shadow: 0 18px 44px rgba(18, 39, 58, 0.08);
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.pillar-visual-card::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.16), transparent 34%),
    linear-gradient(90deg, rgba(214, 190, 122, 0.1), transparent 48%);
}

.pillar-number {
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 2;
  color: rgba(255, 255, 255, 0.54);
  font-size: clamp(38px, 4.2vw, 64px);
  font-weight: 900;
  line-height: 1;
}

.pillar-bar {
  position: relative;
  min-height: 124px;
  background:
    linear-gradient(135deg, rgba(8, 31, 53, 0.98), rgba(8, 75, 90, 0.96)),
    var(--blue-dark);
}

.pillar-bar::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 5px;
  content: "";
  background: linear-gradient(90deg, #d6be7a, var(--teal), var(--coral));
}

.pillar-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  padding: 24px;
}

.pillar-content p {
  width: fit-content;
  margin: 0 0 13px;
  color: #9b7b2f;
  font-size: 12px;
  font-weight: 900;
}

.pillar-content h3 {
  margin: 0;
  font-size: clamp(20px, 1.65vw, 25px);
  line-height: 1.34;
}

.pillar-content strong {
  display: block;
  margin-top: 14px;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.72;
}

.pillar-content em {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin-top: auto;
  padding-top: 24px;
  color: var(--blue);
  font-style: normal;
  font-weight: 900;
}

.pillar-content em::after {
  width: 24px;
  height: 8px;
  margin-left: 10px;
  content: "";
  background: var(--coral);
  clip-path: polygon(0 43%, calc(100% - 8px) 43%, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, calc(100% - 8px) 57%, 0 57%);
  transition: width 180ms ease, transform 180ms ease;
}

.pillar-visual-card:hover,
.pillar-visual-card:focus-visible {
  border-color: rgba(214, 190, 122, 0.64);
  box-shadow: 0 26px 62px rgba(18, 39, 58, 0.14);
  transform: translateY(-4px);
}

.pillar-visual-card:hover .pillar-content em::after,
.pillar-visual-card:focus-visible .pillar-content em::after {
  width: 38px;
  transform: translateX(2px);
}

.pillar-visual-card:focus-visible {
  outline: 3px solid rgba(42, 181, 184, 0.24);
  outline-offset: 3px;
}

@media (max-width: 1120px) {
  .pillar-visual-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pillar-visual-card {
    min-height: 340px;
  }
}

@media (max-width: 760px) {
  .pillar-visual-lead {
    grid-template-columns: 1fr;
    align-items: start;
  }
}

@media (max-width: 640px) {
  .business-pillar-visual {
    padding: 18px;
  }

  .pillar-visual-grid {
    grid-template-columns: 1fr;
  }

  .pillar-visual-card {
    min-height: 0;
  }

  .pillar-bar {
    min-height: 94px;
  }
}

.home-job-section {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 249, 250, 0.94)),
    var(--white);
}

.home-job-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(360px, 1.08fr);
  gap: 42px;
  align-items: center;
}

.home-job-copy {
  max-width: 560px;
}

.home-job-copy h2 {
  white-space: nowrap;
}

.home-job-copy p:not(.section-kicker) {
  margin: 18px 0 0;
  color: var(--ink-soft);
  font-size: 16px;
  line-height: 1.85;
  line-break: strict;
  overflow-wrap: break-word;
  word-break: normal;
}

.home-job-copy .button-row.compact {
  margin-top: 24px;
}

.home-job-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.home-job-item {
  position: relative;
  display: grid;
  gap: 10px;
  align-content: start;
  min-height: 182px;
  padding: 22px;
  overflow: hidden;
  color: var(--ink);
  text-decoration: none;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.9)),
    var(--white);
  border: 1px solid rgba(185, 210, 220, 0.88);
  border-radius: var(--radius);
  box-shadow: 0 18px 44px rgba(18, 39, 58, 0.08);
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.home-job-item::before {
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  content: "";
  background: linear-gradient(90deg, #d6be7a, var(--teal), var(--coral));
}

.home-job-item::after {
  align-self: end;
  margin-top: auto;
  color: var(--teal);
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
  content: "→";
  transition: transform 0.22s ease;
}

.home-job-item strong {
  font-size: 17px;
  line-height: 1.45;
  line-break: strict;
  overflow-wrap: break-word;
  word-break: normal;
}

.home-job-item > span:not(.status-tag) {
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.6;
}

.home-job-item:hover,
.home-job-item:focus-visible {
  border-color: rgba(42, 181, 184, 0.58);
  box-shadow: 0 24px 54px rgba(18, 39, 58, 0.13);
  transform: translateY(-3px);
}

.home-job-item:hover::after,
.home-job-item:focus-visible::after {
  transform: translateX(8px);
}

.home-job-item:focus-visible {
  outline: 3px solid rgba(42, 181, 184, 0.24);
  outline-offset: 3px;
}

.strength-section .section-heading {
  max-width: 860px;
}

.strength-grid .content-card {
  display: grid;
  grid-template-rows: auto auto 1fr;
  min-height: 228px;
  box-shadow: 0 18px 44px rgba(18, 39, 58, 0.08);
}

.strength-grid .card-number {
  margin-bottom: 14px;
  color: #9b7b2f;
}

.strength-grid .content-card p {
  line-height: 1.75;
}

.trust-list .status-tag {
  width: fit-content;
}

.about-strength-section .card-grid.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.about-strength-card {
  min-height: 188px;
  padding: 24px 18px;
}

.about-strength-card h3 {
  white-space: nowrap;
}

.about-strength-card p {
  font-size: 14px;
  line-height: 1.72;
  line-break: strict;
  overflow-wrap: break-word;
  text-wrap: pretty;
  word-break: normal;
}

.about-strength-copy span {
  display: block;
  max-width: 100%;
  white-space: nowrap;
}

.about-strength-copy span + span {
  margin-left: 0;
}

.pillar-section {
  position: relative;
  overflow: hidden;
  color: var(--white);
  background:
    linear-gradient(135deg, #061823 0%, #0d2d31 48%, #17271f 100%);
  isolation: isolate;
}

.pillar-section::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  opacity: 0.34;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px) 0 0 / 84px 84px,
    linear-gradient(0deg, rgba(255, 255, 255, 0.06) 1px, transparent 1px) 0 0 / 84px 84px,
    linear-gradient(135deg, transparent 0 42%, rgba(214, 190, 122, 0.18) 42% 43%, transparent 43% 100%);
}

.pillar-section::after {
  position: absolute;
  inset: auto 0 0;
  z-index: -1;
  height: 7px;
  content: "";
  background: linear-gradient(90deg, var(--teal), #d6be7a, var(--coral));
}

.pillar-heading {
  max-width: 880px;
}

.pillar-heading .section-kicker {
  color: #d6be7a;
}

.pillar-heading h2 {
  color: var(--white);
}

.pillar-heading p:not(.section-kicker) {
  max-width: none;
  color: rgba(255, 255, 255, 0.94);
  white-space: nowrap;
}

.pillar-section .card-grid.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.pillar-section .content-card.strong {
  min-height: 330px;
  padding: 26px 20px;
  color: var(--white);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.06)),
    rgba(255, 255, 255, 0.04);
  border-color: rgba(214, 190, 122, 0.38);
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.24);
}

.pillar-section .content-card.strong::before {
  height: 4px;
  background: linear-gradient(90deg, #d6be7a, var(--teal), var(--coral));
}

.pillar-section .card-number {
  color: #d6be7a;
  font-size: 14px;
}

.pillar-section .content-card h3 {
  color: var(--white);
}

.pillar-section .content-card p,
.pillar-section .mini-list li {
  color: rgba(255, 255, 255, 0.94);
}

.pillar-section .content-card p,
.service-lineup-section .content-card p,
.business-domain-section .content-card p {
  font-size: 13px;
  line-height: 1.68;
  line-break: strict;
  overflow-wrap: break-word;
  text-wrap: pretty;
  word-break: normal;
}

.service-copy span {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
}

.service-copy span + span {
  margin-left: 0.1em;
}

.pillar-section .mini-list li::before {
  background: #d6be7a;
}

.pillar-section .text-link {
  color: var(--white);
}

.service-lineup-section {
  position: relative;
  overflow: hidden;
  color: var(--white);
  background:
    radial-gradient(circle at 20% 10%, rgba(214, 190, 122, 0.16), transparent 32%),
    linear-gradient(135deg, #071b28 0%, #113238 54%, #162a23 100%);
  isolation: isolate;
}

.service-lineup-section::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  opacity: 0.26;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px) 0 0 / 86px 86px,
    linear-gradient(0deg, rgba(255, 255, 255, 0.07) 1px, transparent 1px) 0 0 / 86px 86px;
}

.service-lineup-heading {
  max-width: 920px;
}

.service-lineup-heading .section-kicker {
  color: #d6be7a;
}

.service-lineup-heading h2 {
  color: var(--white);
}

.service-lineup-heading p:not(.section-kicker) {
  max-width: 860px;
  color: rgba(255, 255, 255, 0.94);
}

.service-lineup-section .card-grid.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.service-lineup-section .content-card.strong {
  min-height: 330px;
  padding: 26px 20px;
  color: var(--white);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.06)),
    rgba(255, 255, 255, 0.04);
  border-color: rgba(214, 190, 122, 0.36);
  box-shadow: 0 26px 68px rgba(0, 0, 0, 0.22);
}

.service-lineup-section .content-card.strong::before {
  height: 4px;
  background: linear-gradient(90deg, #d6be7a, var(--teal), var(--coral));
}

.service-lineup-section .card-number {
  color: #d6be7a;
}

.service-lineup-section .content-card h3 {
  color: var(--white);
}

.service-lineup-section .content-card p,
.service-lineup-section .mini-list li {
  color: rgba(255, 255, 255, 0.94);
}

.service-lineup-section .mini-list li::before {
  background: #d6be7a;
}

.service-lineup-section .text-link {
  color: var(--white);
}

.business-domain-section {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 250, 250, 0.92)),
    var(--white);
}

.business-domain-section::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  opacity: 0.7;
  background:
    linear-gradient(90deg, rgba(7, 42, 68, 0.05) 1px, transparent 1px) 0 0 / 86px 86px,
    linear-gradient(0deg, rgba(7, 42, 68, 0.04) 1px, transparent 1px) 0 0 / 86px 86px;
}

.business-domain-section .section-inner {
  position: relative;
}

.business-domain-heading {
  max-width: 900px;
}

.business-domain-heading .section-kicker {
  color: #9b7b2f;
}

.business-domain-heading h2 {
  color: var(--ink);
}

.business-domain-heading p:not(.section-kicker) {
  max-width: 820px;
}

.business-domain-section .card-grid.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.business-domain-section .content-card.strong {
  min-height: 330px;
  padding: 26px 20px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 251, 0.94)),
    var(--white);
  border-color: rgba(155, 123, 47, 0.3);
  box-shadow:
    0 28px 64px rgba(14, 42, 61, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.business-domain-section .content-card.strong::before {
  height: 4px;
  background: linear-gradient(90deg, #9b7b2f, var(--teal), var(--coral));
}

.business-domain-section .card-number {
  color: #9b7b2f;
}

.business-domain-section .text-link {
  color: var(--blue);
}

.benefit-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
}

.environment-link-grid .content-card {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.environment-link-grid .text-link {
  margin-top: auto;
  padding-top: 18px;
}

.telecom-intro-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(320px, 0.98fr);
  gap: 44px;
  align-items: center;
}

.telecom-intro-copy .lead-copy {
  margin-top: 24px;
}

.telecom-intro-visual {
  margin: 0;
  padding: 12px;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: var(--radius);
  box-shadow: 0 24px 60px rgba(18, 39, 58, 0.1);
}

.telecom-intro-visual img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 6px;
}

.telecom-intro-visual figcaption {
  margin-top: 12px;
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.65;
}

.telecom-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.telecom-summary-card {
  display: grid;
  grid-template-columns: minmax(180px, 0.9fr) minmax(0, 1fr);
  gap: 22px;
  align-items: stretch;
  padding: 20px;
  background: var(--white);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: var(--radius);
  box-shadow: 0 20px 48px rgba(18, 39, 58, 0.08);
}

.telecom-summary-card img {
  width: 100%;
  height: 100%;
  min-height: 242px;
  object-fit: cover;
  border-radius: 6px;
}

.telecom-summary-card > div {
  display: grid;
  align-content: start;
  gap: 12px;
  min-width: 0;
}

.telecom-summary-card span {
  color: #9b7b2f;
  font-size: 12px;
  font-weight: 900;
}

.telecom-summary-card h3 {
  margin: 0;
  font-size: clamp(20px, 2vw, 25px);
  line-height: 1.35;
  overflow-wrap: break-word;
}

.telecom-summary-card p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.75;
}

.telecom-summary-card .mini-list {
  margin-top: 2px;
}

.it-solution-summary-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.it-solution-summary-card {
  grid-template-columns: 1fr;
  align-content: start;
  padding: 18px;
}

.it-solution-summary-card img {
  height: auto;
  min-height: 0;
  aspect-ratio: 16 / 9;
}

.it-solution-summary-card h3 {
  font-size: clamp(19px, 1.7vw, 23px);
}

.content-card,
.detail-card,
.job-card {
  position: relative;
  padding: 28px;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.86)),
    var(--white);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: var(--radius);
}

.content-card::before,
.detail-card::before,
.job-card::before {
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  content: "";
  background: linear-gradient(90deg, var(--teal), var(--lime), var(--coral));
}

.content-card.strong,
.detail-card,
.job-card {
  box-shadow: var(--shadow);
}

.content-card h3,
.detail-card h3,
.job-card h3,
.feature-panel h3 {
  margin: 0 0 12px;
  font-size: 23px;
  line-height: 1.35;
}

.detail-card h3 {
  word-break: keep-all;
  overflow-wrap: normal;
}

.content-card p,
.detail-card p,
.job-card p {
  margin: 0;
}

.staffing-feature-card {
  display: grid;
  grid-template-rows: 92px minmax(34px, auto) 1fr;
  align-content: start;
  gap: 14px;
  min-height: 340px;
}

.staffing-feature-heading {
  max-width: 980px;
}

.staffing-feature-heading p:not(.section-kicker) {
  max-width: none;
  white-space: nowrap;
}

.staffing-feature-card h3 {
  margin-bottom: 0;
}

.staffing-feature-card p {
  line-height: 1.72;
}

.staffing-card-visual {
  display: grid;
  place-items: center;
  width: 92px;
  height: 92px;
  background: rgba(42, 181, 184, 0.1);
  border: 1px solid rgba(42, 181, 184, 0.24);
  border-radius: 50%;
}

.staffing-card-visual img {
  display: block;
  width: 58px;
  height: 58px;
  object-fit: contain;
}

.service-meta {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(185, 210, 220, 0.72);
}

.service-meta div {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.service-meta dt {
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
}

.service-meta dd {
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.55;
}

.service-summary {
  grid-column: 2 / -1;
  margin-top: 12px !important;
  padding-top: 10px;
  border-top: 1px solid rgba(185, 210, 220, 0.72);
  color: var(--ink-soft);
  font-size: 14px !important;
  line-height: 1.55;
}

.service-summary strong {
  color: var(--ink);
  font-size: 13px;
}

.service-summary-list div {
  display: grid;
  grid-template-columns: 42px minmax(360px, 1fr);
  gap: 12px;
  align-items: start;
}

.service-summary-list div + div {
  margin-top: 4px;
}

.service-summary-list dt {
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
}

.service-summary-list dd {
  margin: 0;
  color: var(--ink-soft);
}

.infra-map-section {
  padding-top: 36px;
}

.infra-map-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.72fr) minmax(0, 1.28fr);
  gap: 44px;
  align-items: center;
}

.infra-map {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  min-height: 430px;
}

.infra-map::before,
.infra-map::after {
  position: absolute;
  inset: 50% auto auto 50%;
  z-index: 0;
  content: "";
  background: rgba(34, 139, 151, 0.24);
  transform: translate(-50%, -50%);
}

.infra-map::before {
  width: 72%;
  height: 1px;
}

.infra-map::after {
  width: 1px;
  height: 72%;
}

.infra-map-core {
  position: absolute;
  inset: 50% auto auto 50%;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 150px;
  height: 150px;
  color: var(--white);
  text-align: center;
  background: linear-gradient(135deg, var(--blue), var(--teal));
  border: 6px solid var(--white);
  border-radius: 50%;
  box-shadow: var(--shadow);
  transform: translate(-50%, -50%);
}

.infra-map-core strong {
  font-size: 18px;
  line-height: 1.45;
}

.infra-map-item {
  position: relative;
  z-index: 1;
  display: grid;
  align-content: start;
  min-height: 190px;
  padding: 24px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.88)),
    var(--white);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: var(--radius);
  box-shadow: 0 18px 44px rgba(18, 39, 58, 0.08);
  color: inherit;
  text-decoration: none;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.infra-map-item:hover,
.infra-map-item:focus-visible {
  border-color: rgba(42, 181, 184, 0.8);
  box-shadow: 0 24px 58px rgba(18, 39, 58, 0.13);
  transform: translateY(-3px);
}

.infra-map-item span {
  justify-self: center;
  width: fit-content;
  margin-bottom: 12px;
  color: var(--teal);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-align: center;
}

.infra-map-item h3 {
  margin: 0 0 8px;
  font-size: 19px;
  line-height: 1.35;
}

.infra-map-item p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.65;
}

.relationship-layout {
  display: grid;
  grid-template-columns: minmax(240px, 0.72fr) minmax(360px, 1fr);
  gap: 28px 46px;
  align-items: center;
}

.detail-card[id],
.telecom-summary-card[id] {
  scroll-margin-top: calc(var(--header-height) + 28px);
}

.relationship-layout > * {
  min-width: 0;
}

.relationship-layout > .relationship-copy {
  grid-column: 1 / -1;
}

.relationship-layout .section-kicker + h2 {
  margin-bottom: 16px;
}

.relationship-layout p {
  color: var(--ink-soft);
}

.relationship-figure {
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: var(--radius);
  box-shadow: 0 18px 44px rgba(18, 39, 58, 0.08);
}

.relationship-figure img {
  display: block;
  width: 100%;
  max-width: 560px;
  height: auto;
}

.history-aside {
  align-self: start;
  position: relative;
  padding-left: 22px;
}

.history-section .split {
  grid-template-columns: minmax(240px, 0.34fr) minmax(680px, 1fr);
  gap: 44px;
}

.history-aside::before {
  content: "";
  position: absolute;
  inset: 8px auto 8px 0;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--teal), var(--blue));
}

.history-aside p:not(.section-kicker) {
  max-width: 420px;
  margin: 20px 0 0;
  color: var(--ink-soft);
  line-height: 1.85;
}

.history-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  max-width: 420px;
  margin-top: 28px;
}

.history-stats div {
  display: grid;
  justify-items: center;
  padding: 16px 8px;
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: 8px;
  text-align: center;
}

.history-stats strong {
  display: block;
  color: var(--teal);
  font-size: clamp(20px, 2vw, 24px);
  line-height: 1;
  text-align: center;
  transform: translateX(-5px);
  white-space: nowrap;
}

.history-stats span {
  display: block;
  margin-top: 8px;
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.4;
}

.history-note {
  padding-top: 18px;
  border-top: 1px solid rgba(126, 160, 174, 0.38);
  font-size: 14px;
}

.compact-flow {
  gap: 14px;
}

.compact-flow article {
  padding: 20px;
}

.compact-flow article h3 {
  margin-bottom: 6px;
  font-size: 17px;
}

.compact-flow article p {
  font-size: 14px;
  line-height: 1.6;
}

.card-grid.four .content-card.strong {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.card-grid.four .content-card.strong h3 {
  white-space: nowrap;
  font-size: clamp(18px, 1.35vw, 21px);
  line-height: 1.25;
}

.card-grid.four .content-card.strong .text-link {
  margin-top: auto;
  padding-top: 18px;
}

.cert-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.cert-card {
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 20px;
  min-width: 0;
  padding: 24px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: var(--radius);
  box-shadow: 0 18px 44px rgba(18, 39, 58, 0.08);
}

.cert-image,
.cert-image-grid a {
  display: grid;
  place-items: center;
  min-width: 0;
  background: var(--white);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: 8px;
}

.cert-image {
  min-height: 190px;
  padding: 22px;
}

.cert-image img,
.cert-image-grid img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cert-image-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.cert-image-grid a {
  min-height: 190px;
  padding: 10px;
}

.cert-card-privacy .cert-image {
  min-height: 190px;
  padding: 34px 42px;
}

.cert-card-privacy .cert-image img {
  max-width: 170px;
  max-height: 120px;
}

.cert-body {
  display: grid;
  grid-template-rows: auto auto 1fr;
  align-content: start;
  gap: 12px;
  height: 100%;
}

.cert-body h3 {
  margin: 0;
  font-size: 22px;
  line-height: 1.35;
}

.cert-body p {
  margin: 0;
  color: var(--ink-soft);
}

.cert-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0 18px;
  align-self: end;
  margin-top: 2px;
}

.cert-links .text-link {
  margin-top: 8px;
  font-size: 14px;
}

.card-number {
  display: inline-flex;
  margin-bottom: 22px;
  color: var(--teal);
  font-size: 13px;
  font-weight: 900;
}

.mini-list {
  display: grid;
  gap: 7px;
  padding: 0;
  margin: 22px 0;
  list-style: none;
}

.mini-list li {
  position: relative;
  padding-left: 18px;
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 700;
}

.mini-list li::before {
  position: absolute;
  top: 0.75em;
  left: 0;
  width: 6px;
  height: 6px;
  content: "";
  background: var(--teal);
  border-radius: 50%;
}

.text-link {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin-top: 18px;
  color: var(--blue);
  font-weight: 900;
}

.text-link::after {
  width: 24px;
  height: 8px;
  margin-left: 10px;
  content: "";
  background: var(--coral);
  clip-path: polygon(0 43%, calc(100% - 8px) 43%, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, calc(100% - 8px) 57%, 0 57%);
  transition: width 180ms ease, transform 180ms ease;
}

.text-link:hover::after,
.text-link:focus-visible::after {
  width: 38px;
  transform: translateX(2px);
}

.feature-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.feature-panel {
  min-height: 420px;
  display: flex;
  align-items: end;
  padding: 34px;
  overflow: hidden;
  color: var(--white);
  border-radius: var(--radius);
  background:
    linear-gradient(0deg, rgba(8, 31, 53, 0.92), rgba(8, 31, 53, 0.24)),
    var(--panel-image) center / cover;
}

.feature-panel .section-kicker {
  color: #a9e2df;
}

.feature-panel p {
  max-width: 520px;
  margin: 0;
  color: rgba(255, 255, 255, 0.94);
}

.list-block,
.news-list,
.timeline {
  display: grid;
  border-top: 1px solid var(--line);
}

.list-block a,
.news-list article,
.timeline div {
  display: grid;
  gap: 5px;
  padding: 22px 0;
  border-bottom: 1px solid var(--line);
}

.list-block time,
.news-list time,
.timeline time,
.job-meta time {
  color: var(--coral);
  font-size: 13px;
  font-weight: 900;
}

.list-block strong,
.news-list h3 {
  margin: 0;
  font-size: 17px;
  line-height: 1.55;
}

.list-block span {
  color: var(--ink-soft);
  font-size: 14px;
}

.blog-index-list {
  display: grid;
  border-top: 1px solid var(--line);
}

.blog-index-card {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) auto;
  gap: 22px;
  align-items: center;
  padding: 22px 0;
  border-bottom: 1px solid var(--line);
}

.blog-index-card time {
  color: var(--coral);
  font-size: 13px;
  font-weight: 900;
}

.blog-index-card h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.5;
}

.blog-index-card span {
  color: var(--blue);
  font-size: 13px;
  font-weight: 900;
}

.blog-list-count {
  margin: -10px 0 20px;
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 700;
}

.blog-pagination {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-top: 28px;
}

.blog-pagination a,
.blog-pagination span {
  display: grid;
  place-items: center;
  min-width: 42px;
  height: 42px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--white);
  color: var(--ink);
  font-size: 14px;
  font-weight: 900;
}

.blog-pagination a:hover {
  border-color: var(--blue);
  color: var(--blue);
}

.blog-pagination .is-current {
  border-color: var(--blue);
  background: var(--blue);
  color: var(--white);
}

.blog-pagination .is-disabled {
  color: rgba(34, 52, 64, 0.38);
  pointer-events: none;
}

.blog-article-shell {
  padding: clamp(28px, 4vw, 48px);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.blog-article-head {
  display: grid;
  gap: 10px;
  margin-bottom: 32px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--line);
}

.blog-article-head time {
  color: var(--coral);
  font-size: 13px;
  font-weight: 900;
}

.blog-article-head h2 {
  margin: 0;
  font-size: clamp(26px, 3.2vw, 40px);
  line-height: 1.28;
}

.blog-article {
  line-height: 2;
}

.blog-article p {
  margin: 0 0 18px;
}

.blog-article a {
  color: var(--blue);
  font-weight: 700;
  overflow-wrap: anywhere;
}

.blog-article img {
  width: min(100%, 260px);
  height: 180px;
  margin: 8px 6px;
  object-fit: cover;
  border-radius: 8px;
  box-shadow: 0 10px 24px rgba(12, 38, 54, 0.12);
  vertical-align: middle;
}

.blog-article table {
  width: 100%;
  margin: 24px 0;
  border-collapse: collapse;
}

.blog-article th,
.blog-article td {
  padding: 12px;
  border: 1px solid var(--line);
  vertical-align: top;
}

.blog-post-nav {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
  margin-top: 28px;
}

.blog-post-nav a {
  display: grid;
  gap: 6px;
  min-height: 74px;
  padding: 16px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.blog-post-nav a:last-child {
  text-align: right;
}

.blog-post-nav span {
  color: var(--coral);
  font-size: 12px;
  font-weight: 900;
}

.blog-post-nav strong {
  font-size: 14px;
  line-height: 1.45;
}

.blog-post-nav-index {
  place-content: center;
  color: var(--blue);
  font-weight: 900;
  white-space: nowrap;
}

.cta-section {
  background: var(--mint);
}

.cta-box {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 420px);
  gap: 42px;
  align-items: center;
}

.cta-box h2 {
  font-size: clamp(24px, 2.6vw, 34px);
  line-height: 1.22;
  white-space: nowrap;
}

.cta-box > div:first-child > p:not(.section-kicker) {
  max-width: none;
  white-space: nowrap;
}

.cta-box .cta-actions {
  flex-wrap: nowrap;
  align-items: stretch;
}

.cta-box .button,
.phone-link span,
.phone-link strong,
.phone-link small {
  white-space: nowrap;
}

.phone-link {
  display: grid;
  gap: 2px;
  padding: 24px;
  color: var(--ink);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.phone-link.large {
  margin: 22px 0;
}

.phone-link span,
.phone-link small {
  color: var(--ink-soft);
  font-weight: 800;
}

.phone-link strong {
  color: var(--blue);
  font-size: 30px;
  line-height: 1.2;
}

.access-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
  gap: 42px;
  align-items: stretch;
}

.access-copy {
  display: grid;
  align-content: center;
}

.access-copy p {
  margin: 22px 0 0;
  color: var(--ink-soft);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.9;
}

.access-copy strong {
  color: var(--ink);
  font-size: 20px;
}

.access-map {
  min-height: 380px;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.access-map iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 380px;
  border: 0;
}

.flow-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 1px;
  overflow: hidden;
  background: var(--line);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.flow-list article {
  padding: 26px;
  background: var(--white);
}

.flow-list span {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-bottom: 20px;
  color: var(--white);
  background: var(--blue);
  border-radius: 50%;
  font-weight: 900;
}

.flow-list h3 {
  margin: 0 0 8px;
  font-size: 19px;
}

.flow-list p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 14px;
}

.service-detail-list {
  display: grid;
  gap: 22px;
}

.it-detail-section {
  padding-top: 52px;
}

.it-intro-section {
  padding-bottom: 56px;
}

.it-detail-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
}

.detail-card {
  display: grid;
  grid-template-columns: 72px minmax(300px, 0.95fr) minmax(0, 1.05fr);
  gap: 22px 28px;
  align-items: start;
}

.it-detail-grid .detail-card {
  grid-template-columns: 1fr;
  grid-template-rows: auto auto 1fr auto;
  gap: 12px;
}

.it-detail-grid .detail-card h3 {
  font-size: 21px;
}

.detail-card .card-number {
  margin: 0;
}

.detail-card .chip-row {
  grid-column: 2 / -1;
  margin-top: -6px;
}

.it-detail-grid .detail-card .chip-row {
  grid-column: auto;
  margin-top: 6px;
}

.chip-row,
.partner-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.partner-showcase {
  display: grid;
  gap: 28px;
}

.partner-logo-list,
.partner-name-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.partner-logo-list {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

.partner-logo-list li {
  display: grid;
  place-items: center;
  min-height: 96px;
  padding: 16px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.partner-logo-list img {
  display: block;
  width: 100%;
  max-width: 180px;
  max-height: 66px;
  object-fit: contain;
}

.partner-name-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px 18px;
  padding: 22px;
  background: rgba(238, 248, 245, 0.58);
  border: 1px solid #cae7df;
  border-radius: 8px;
}

.partner-name-list li {
  position: relative;
  padding-left: 15px;
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.55;
}

.partner-name-list li::before {
  content: "";
  position: absolute;
  top: 0.72em;
  left: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--teal);
}

.chip-row.large {
  margin-top: 0;
}

.chip-row span,
.partner-list span,
.status-tag {
  padding: 8px 12px;
  color: var(--blue-dark);
  background: #eef8f5;
  border: 1px solid #cae7df;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
  white-space: nowrap;
}

.status-tag {
  display: inline-flex;
  width: fit-content;
  color: #166b45;
}

.table-wrap {
  overflow-x: auto;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.data-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 660px;
}

.data-table th,
.data-table td {
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

.data-table th {
  width: 210px;
  color: var(--blue-dark);
  background: #eef4f7;
  font-weight: 900;
}

.data-table tr:last-child th,
.data-table tr:last-child td {
  border-bottom: 0;
}

.info-list {
  display: grid;
  gap: 1px;
  padding: 0;
  margin: 22px 0 0;
  overflow: hidden;
  background: var(--line);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.info-list div {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 16px;
  padding: 14px 16px;
  background: var(--white);
}

.info-list.compact div {
  grid-template-columns: 100px minmax(0, 1fr);
  padding: 12px 0;
  background: transparent;
  border-bottom: 1px solid var(--line);
}

.info-list.compact {
  background: transparent;
  border: 0;
  border-radius: 0;
}

.info-list.compact div:last-child {
  border-bottom: 0;
}

.info-list dt {
  color: var(--ink-soft);
  font-weight: 900;
}

.info-list dd {
  margin: 0;
}

.statement-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 24px;
}

.statement-grid strong {
  padding: 18px;
  color: var(--blue-dark);
  background: var(--mint);
  border: 1px solid #cce1da;
  border-radius: var(--radius);
}

.job-list {
  display: grid;
  gap: 18px;
}

.job-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 16px;
}

.job-meta span {
  padding: 4px 10px;
  color: var(--white);
  background: var(--blue);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
}

.stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.stat-grid article {
  padding: 28px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.stat-grid strong {
  display: block;
  color: var(--blue);
  font-size: 44px;
  line-height: 1;
}

.stat-grid span {
  display: block;
  margin-top: 12px;
  color: var(--ink-soft);
  font-weight: 900;
}

.infographic-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 18px;
}

.infographic-card {
  min-width: 0;
  padding: 28px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 18px 44px rgba(18, 39, 58, 0.07);
}

.infographic-card.is-half {
  grid-column: span 3;
}

.infographic-card.is-third {
  grid-column: span 2;
}

.infographic-card.is-two-third {
  grid-column: span 4;
}

.chart-kicker {
  margin: 0 0 8px;
  color: #9b7b2f;
  font-size: 12px;
  font-weight: 900;
}

.infographic-card h3 {
  margin: 0 0 20px;
  font-size: clamp(20px, 1.8vw, 25px);
  line-height: 1.35;
}

.stacked-chart {
  display: flex;
  height: 38px;
  overflow: hidden;
  background: rgba(7, 42, 68, 0.08);
  border-radius: 999px;
}

.chart-segment {
  display: grid;
  min-width: 0;
  place-items: center;
}

.stacked-chart .segment-tech {
  width: 92%;
}

.stacked-chart .segment-sales {
  width: 4%;
}

.stacked-chart .segment-admin {
  width: 3%;
}

.stacked-chart .segment-other {
  width: 1%;
}

.segment-tech,
.gender-ratio span:first-child,
.segment-career {
  background: var(--blue);
}

.segment-sales,
.segment-fresh {
  background: var(--teal);
}

.segment-admin,
.gender-ratio span:last-child {
  background: #d6be7a;
}

.segment-other {
  background: var(--coral);
}

.stacked-chart em {
  color: var(--white);
  font-style: normal;
  font-weight: 900;
}

.chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  padding: 0;
  margin: 18px 0 0;
  list-style: none;
}

.chart-legend.compact {
  margin-top: 14px;
}

.chart-legend li {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 900;
}

.chart-legend i {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  flex: 0 0 auto;
}

.chart-legend strong {
  color: var(--ink);
}

.ratio-chart {
  display: grid;
  min-height: 118px;
  overflow: hidden;
  color: var(--white);
  border: 1px solid rgba(185, 210, 220, 0.82);
  border-radius: 8px;
}

.gender-ratio {
  grid-template-columns: 8fr 2fr;
}

.career-ratio {
  grid-template-columns: minmax(116px, 0.26fr) minmax(0, 0.74fr);
}

.ratio-chart span {
  display: grid;
  align-content: center;
  justify-items: center;
  min-width: 0;
  padding: 16px 10px;
}

.ratio-chart span:first-child {
  background: var(--teal);
}

.ratio-chart span:last-child {
  background: var(--blue);
}

.gender-ratio span:first-child {
  background: var(--blue);
}

.gender-ratio span:last-child {
  background: #d6be7a;
  color: var(--ink);
}

.career-ratio span:first-child {
  background: var(--teal);
}

.career-ratio span:last-child {
  background: var(--blue);
}

.ratio-chart strong {
  font-size: clamp(28px, 3vw, 44px);
  line-height: 1;
  white-space: nowrap;
}

.career-ratio strong {
  font-size: clamp(22px, 2vw, 32px);
}

.ratio-chart small {
  margin-top: 7px;
  font-size: 12px;
  font-weight: 900;
}

.chart-note {
  margin: 16px 0 0;
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.7;
}

.age-stat {
  display: flex;
  align-items: flex-end;
  gap: 7px;
  min-height: 118px;
}

.age-stat strong {
  color: var(--blue);
  font-size: clamp(56px, 5vw, 78px);
  line-height: 0.9;
}

.age-stat span {
  color: var(--ink);
  font-size: 22px;
  font-weight: 900;
}

@media (max-width: 1080px) {
  .infographic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .infographic-card.is-half,
  .infographic-card.is-third {
    grid-column: auto;
  }

  .infographic-card.is-two-third {
    grid-column: span 2;
  }
}

@media (max-width: 640px) {
  .infographic-grid {
    grid-template-columns: 1fr;
  }

  .infographic-card,
  .infographic-card.is-two-third {
    grid-column: auto;
  }

  .ratio-chart {
    min-height: 96px;
  }

  .career-ratio {
    grid-template-columns: 1fr;
  }

  .age-stat {
    min-height: 96px;
  }
}

.timeline div {
  grid-template-columns: 130px minmax(0, 1fr);
}

.timeline p {
  margin: 0;
}

.history-timeline {
  gap: 12px;
  border-top: 0;
}

.history-timeline div {
  position: relative;
  grid-template-columns: 126px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  padding: 18px 22px 18px 26px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 12px 28px rgba(12, 38, 54, 0.08);
}

.history-timeline div::before {
  content: "";
  position: absolute;
  left: 0;
  top: 14px;
  bottom: 14px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--teal), var(--blue));
}

.history-timeline time {
  color: var(--ink);
  line-height: 1.5;
}

.history-timeline p {
  color: var(--ink-soft);
  line-height: 1.75;
  max-width: 100%;
}

.partner-list {
  margin-top: 0;
}

.contact-side {
  position: sticky;
  top: calc(var(--header-height) + 24px);
}

.contact-form {
  display: grid;
  gap: 16px;
  padding: 28px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.contact-form fieldset {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  padding: 0;
  margin: 0;
  border: 0;
}

.contact-form legend,
.contact-form label {
  font-weight: 900;
}

.contact-form input,
.contact-form textarea {
  width: 100%;
  margin-top: 6px;
  padding: 12px 13px;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  font: inherit;
}

.contact-form fieldset label,
.contact-form .agree {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
}

.contact-form fieldset input,
.contact-form .agree input {
  width: auto;
  margin: 0;
}

.form-note {
  margin: 0;
  color: var(--ink-soft);
  font-size: 13px;
}

.form-note.is-visible {
  color: var(--blue);
  font-weight: 900;
}

.narrow {
  max-width: 880px;
}

.prose h2 {
  margin-top: 44px;
  font-size: 30px;
}

.prose h2:first-child {
  margin-top: 0;
}

.prose p,
.prose li {
  color: var(--ink-soft);
}

.policy-date {
  padding: 18px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.privacy-policy {
  max-width: 980px;
}

.privacy-policy .policy-date {
  display: grid;
  gap: 3px;
  margin: 0 0 24px auto;
  width: fit-content;
  min-width: min(100%, 360px);
  color: var(--ink);
  font-weight: 800;
  line-height: 1.9;
  text-align: left;
}

.policy-date-row {
  display: grid;
  grid-template-columns: 4em 4.25em 4.75em;
  column-gap: 0;
  justify-content: end;
}

.policy-date-row span:first-child {
  text-align: right;
}

.policy-date-row span:nth-child(2),
.policy-date-row span:last-child {
  font-variant-numeric: tabular-nums;
}

.policy-date-row span:nth-child(2) {
  text-align: left;
}

.policy-date-row span:last-child {
  text-align: right;
}

.policy-date-name {
  display: block;
  text-align: right;
}

.privacy-policy-card {
  padding: clamp(28px, 4vw, 44px);
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(185, 210, 220, 0.9);
  border-radius: var(--radius);
  box-shadow: 0 24px 60px rgba(18, 39, 58, 0.08);
}

.privacy-policy-card h2 {
  margin: 0 0 18px;
}

.privacy-policy-card h3 {
  margin: 0 0 14px;
  color: var(--ink);
  font-size: 20px;
  line-height: 1.45;
}

.policy-lead {
  margin-bottom: 30px;
}

.privacy-policy-list {
  display: grid;
  gap: 24px;
  margin: 0;
}

.privacy-policy-list dt {
  padding: 0 0 0 14px;
  color: var(--ink);
  border-left: 4px solid var(--teal);
  font-size: 22px;
  font-weight: 900;
  line-height: 1.45;
}

.privacy-policy-list dd {
  margin: 0;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(185, 210, 220, 0.72);
}

.privacy-policy-list dd:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.privacy-policy-list p {
  margin: 0 0 18px;
}

.privacy-policy-list ol,
.privacy-policy-list ul {
  display: grid;
  gap: 10px;
  margin: 16px 0 0;
  padding-left: 1.45em;
}

.privacy-policy-list li {
  padding-left: 0.1em;
}

.privacy-policy-list li > ul,
.privacy-policy-list li > ol {
  margin-top: 12px;
}

.policy-dash-list {
  list-style: none;
  padding-left: 0 !important;
}

.policy-note {
  margin: 16px 0 4px;
  padding: 18px;
  background: rgba(42, 181, 184, 0.08);
  border: 1px solid rgba(42, 181, 184, 0.24);
  border-radius: var(--radius);
}

.policy-note h3 {
  margin-bottom: 10px;
  font-size: 17px;
}

.policy-note p {
  margin-bottom: 10px;
}

.sitemap-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.sitemap-grid div {
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 24px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.sitemap-grid h2 {
  margin-bottom: 8px;
  font-size: 22px;
}

.sitemap-grid a {
  color: var(--blue);
  font-weight: 800;
}

@supports (word-break: auto-phrase) {
  .section-heading p:not(.section-kicker),
  .lead-copy,
  .lead-copy p,
  .content-card p,
  .detail-card p,
  .job-card p,
  .business-summary-card p,
  .home-job-copy p:not(.section-kicker),
  .home-job-item strong,
  .about-strength-card p,
  .pillar-section .content-card p,
  .service-lineup-section .content-card p,
  .business-domain-section .content-card p,
  .prose,
  .prose p,
  .prose li,
  .cta-box p,
  .service-summary,
  .service-meta dd {
    word-break: auto-phrase;
  }
}

.site-footer {
  color: var(--white);
  background:
    linear-gradient(135deg, rgba(8, 31, 53, 0.98), rgba(5, 48, 65, 0.98)),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.05) 0 1px, transparent 1px 80px);
}

.footer-inner {
  display: grid;
  grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1.25fr);
  gap: 54px;
  padding: 52px 0;
}

.footer-logo img {
  filter: brightness(0) invert(1);
}

.footer-profile p {
  color: rgba(255, 255, 255, 0.92);
  font-size: 14px;
}

.footer-nav {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
}

.footer-nav div {
  display: grid;
  align-content: start;
  gap: 8px;
}

.footer-nav a {
  color: rgba(255, 255, 255, 0.9);
  font-size: 13px;
  font-weight: 700;
}

.footer-nav .footer-heading {
  color: var(--white);
  font-size: 14px;
  font-weight: 900;
}

.footer-bottom {
  padding: 16px 0 24px;
  color: rgba(255, 255, 255, 0.9);
  border-top: 1px solid rgba(255, 255, 255, 0.15);
}

@media (max-width: 1100px) {
  .history-section .split {
    grid-template-columns: minmax(220px, 0.3fr) minmax(580px, 1fr);
    gap: 34px;
  }

  .partner-logo-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .partner-name-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .site-nav {
    gap: 12px;
    font-size: 12px;
  }

  .brand img {
    width: 170px;
  }

  .card-grid.four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-strength-section .card-grid.four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .business-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .telecom-summary-card {
    grid-template-columns: 1fr;
  }

  .telecom-summary-card img {
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 9;
  }

  .home-job-layout {
    grid-template-columns: 1fr;
  }

  .home-job-copy {
    max-width: none;
  }

  .pillar-section .card-grid.four,
  .service-lineup-section .card-grid.four,
  .business-domain-section .card-grid.four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .infra-map-layout {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .relationship-layout {
    grid-template-columns: 1fr;
  }

  .relationship-layout > .relationship-copy {
    grid-column: auto;
  }

  .lead-grid > .lead-copy,
  .split > .lead-copy,
  .message-copy {
    padding-top: 0;
  }

  .infra-map {
    min-height: 380px;
  }

  .infra-map-core {
    width: 126px;
    height: 126px;
  }

  .infra-map-item {
    min-height: 160px;
  }
}

@media (max-width: 940px) {
  :root {
    --header-height: 68px;
  }

  .history-section .split {
    grid-template-columns: 1fr;
  }

  .header-inner,
  .hero-content,
  .section-inner,
  .footer-inner,
  .footer-bottom {
    width: min(100% - 32px, 760px);
  }

  .telecom-intro-layout {
    grid-template-columns: 1fr;
  }

  .it-solution-summary-grid {
    grid-template-columns: 1fr;
  }

  .nav-toggle {
    display: block;
  }

  .site-nav {
    position: fixed;
    top: var(--header-height);
    right: 0;
    left: 0;
    display: grid;
    gap: 0;
    justify-content: stretch;
    justify-items: stretch;
    max-height: calc(100svh - var(--header-height));
    padding: 12px 16px 20px;
    overflow-y: auto;
    text-align: left;
    background: rgba(255, 255, 255, 0.98);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 24px 50px rgba(16, 32, 45, 0.14);
    transform: translateY(calc(-100% - var(--header-height)));
    transition: transform 220ms ease;
  }

  .nav-open .site-nav {
    transform: translateY(0);
  }

  .site-nav a,
  .site-nav .nav-contact {
    display: flex;
    justify-content: flex-start;
    padding: 14px 4px;
    text-align: left;
    color: var(--ink);
    background: transparent;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
  }

  .nav-item {
    display: grid;
    width: 100%;
    justify-items: stretch;
  }

  .has-dropdown > .nav-link {
    justify-content: space-between;
  }

  .nav-dropdown {
    position: static;
    display: grid;
    justify-items: stretch;
    min-width: 0;
    padding: 0 0 8px 14px;
    text-align: left;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    opacity: 1;
    pointer-events: auto;
    transform: none;
  }

  .nav-dropdown::before {
    display: none;
  }

  .nav-dropdown a {
    padding: 9px 4px;
    color: var(--ink-soft);
    border-bottom: 0;
    border-radius: 0;
    font-size: 12px;
  }

  .nav-dropdown a:hover,
  .nav-dropdown a:focus-visible {
    background: transparent;
  }

  .hero {
    min-height: min(720px, 86svh);
    padding: calc(var(--header-height) + 54px) 0 54px;
  }

  .hero-content {
    grid-template-columns: 1fr;
    gap: 0;
    align-items: start;
  }

  .section {
    padding: 72px 0;
  }

  .it-detail-section {
    padding-top: 44px;
  }

  .it-intro-section {
    padding-bottom: 44px;
  }

  .lead-grid,
  .split,
  .listing-grid,
  .contact-layout,
  .access-layout,
  .cta-box,
  .footer-inner {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .card-grid.two,
  .card-grid.three,
  .cert-grid,
  .feature-grid,
  .stat-grid,
  .sitemap-grid,
  .footer-nav {
    grid-template-columns: 1fr 1fr;
  }

  .about-strength-section .card-grid.four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .flow-list {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  }

  .detail-card {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .service-summary {
    grid-column: auto;
  }

  .detail-card .chip-row {
    grid-column: auto;
    margin-top: 8px;
  }

  .contact-side {
    position: static;
  }
}

@media (max-width: 560px) {
  .partner-logo-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .partner-logo-list li {
    min-height: 82px;
    padding: 12px;
  }

  .partner-logo-list img {
    max-height: 52px;
  }

  .partner-name-list {
    grid-template-columns: 1fr;
    padding: 18px;
  }

  .blog-index-card {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .blog-index-card span {
    justify-self: start;
  }

  .blog-article-shell {
    padding: 22px 18px;
  }

  .blog-article img {
    width: min(100%, 220px);
    height: 150px;
  }

  .blog-post-nav {
    grid-template-columns: 1fr;
  }

  .blog-post-nav a:last-child {
    text-align: left;
  }

  .header-inner,
  .hero-content,
  .section-inner,
  .footer-inner,
  .footer-bottom {
    width: calc(100% - 40px);
  }

  .brand img {
    width: 165px;
  }

  .heading-with-actions {
    display: grid;
    gap: 16px;
    justify-content: stretch;
  }

  .heading-with-actions .button-row {
    width: 100%;
  }

  .pillar-section .content-card.strong {
    min-height: 0;
    padding: 24px 22px;
  }

  .service-lineup-section .content-card.strong {
    min-height: 0;
    padding: 24px 22px;
  }

  .business-domain-section .content-card.strong {
    min-height: 0;
    padding: 24px 22px;
  }

  .business-summary-section {
    padding-top: 58px;
  }

  .business-summary-grid {
    grid-template-columns: 1fr;
  }

  .telecom-summary-grid {
    grid-template-columns: 1fr;
  }

  .telecom-intro-visual {
    padding: 10px;
  }

  .home-job-layout {
    gap: 28px;
  }

  .home-job-copy h2 {
    white-space: normal;
  }

  .home-job-list {
    grid-template-columns: 1fr;
  }

  .home-job-item {
    min-height: 0;
    padding: 20px;
  }

  .pillar-section .card-grid.four,
  .service-lineup-section .card-grid.four,
  .business-domain-section .card-grid.four {
    grid-template-columns: 1fr;
  }

  .business-summary-card {
    min-height: 0;
    padding: 22px;
  }

  .business-summary-card h3 {
    white-space: normal;
  }

  .strength-grid .content-card {
    min-height: 0;
  }

  .pillar-heading p:not(.section-kicker) {
    white-space: normal;
  }

  .hero {
    min-height: 420px;
    padding-bottom: 28px;
  }

  .hero h1 {
    max-width: 100%;
    font-size: clamp(18px, 6.2vw, 34px);
    line-height: 1.18;
  }

  .hero-lead {
    max-width: 100%;
    font-size: 15px;
    line-height: 1.65;
    white-space: normal;
  }

  .button,
  .hero-actions .button,
  .button-row .button,
  .cta-actions .button {
    width: 100%;
  }

  .privacy-policy .policy-date {
    width: 100%;
    min-width: 0;
    text-align: left;
  }

  .privacy-policy-card {
    padding: 24px 20px;
  }

  .privacy-policy-list dt {
    font-size: 19px;
  }

  .privacy-policy-list ol,
  .privacy-policy-list ul {
    padding-left: 1.2em;
  }

  .section h2 {
    font-size: 27px;
    line-height: 1.38;
  }

  .it-detail-section {
    padding-top: 36px;
  }

  .it-intro-section {
    padding-bottom: 36px;
  }

  .it-detail-grid {
    grid-template-columns: 1fr;
  }

  .detail-card h3 {
    font-size: clamp(18px, 5vw, 20px);
    white-space: nowrap;
  }

  .section-heading p:not(.section-kicker),
  .lead-copy,
  .content-card p,
  .detail-card p,
  .prose,
  .cta-box p {
    font-size: 15px;
  }

  .staffing-feature-heading p:not(.section-kicker) {
    white-space: normal;
  }

  .card-grid.two,
  .card-grid.three,
  .card-grid.four,
  .cert-grid,
  .feature-grid,
  .stat-grid,
  .sitemap-grid,
  .footer-nav,
  .flow-list,
  .statement-grid {
    grid-template-columns: 1fr;
  }

  .about-strength-section .card-grid.four {
    grid-template-columns: 1fr;
  }

  .content-card,
  .detail-card,
  .job-card,
  .cert-card,
  .contact-form,
  .sitemap-grid div {
    padding: 22px;
  }

  .cert-image,
  .cert-image-grid a {
    min-height: 160px;
  }

  .cert-card-privacy .cert-image {
    min-height: 150px;
    padding: 28px 34px;
  }

  .cert-card-privacy .cert-image img {
    max-width: 145px;
    max-height: 104px;
  }

  .service-meta div {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .service-summary-list div {
    grid-template-columns: 1fr;
    gap: 2px;
  }

  .staffing-card-visual {
    width: 78px;
    height: 78px;
  }

  .staffing-card-visual img {
    width: 50px;
    height: 50px;
  }

  .history-stats {
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  }

  .infra-map {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .infra-map::before,
  .infra-map::after,
  .infra-map-core {
    display: none;
  }

  .infra-map-item {
    min-height: 0;
    padding: 20px;
  }

  .feature-panel {
    min-height: 360px;
    padding: 24px;
  }

  .info-list div,
  .info-list.compact div,
  .timeline div {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .phone-link strong {
    font-size: 26px;
  }

  .cta-box {
    gap: 22px;
  }

  .cta-box h2 {
    font-size: clamp(17px, 4.8vw, 24px);
  }

  .cta-box > div:first-child > p:not(.section-kicker) {
    font-size: 13px;
    white-space: nowrap;
  }

  .cta-box .cta-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .access-map,
  .access-map iframe {
    min-height: 300px;
  }

  .data-table {
    min-width: 560px;
  }
}

@media (max-width: 500px) {
  .header-inner,
  .hero-content,
  .section-inner,
  .footer-inner,
  .footer-bottom {
    width: min(calc(100% - 40px), 340px);
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 360px) {
  .detail-card {
    padding: 18px;
  }

  .detail-card h3 {
    font-size: 16px;
  }

  .chip-row span,
  .partner-list span,
  .status-tag {
    padding: 7px 10px;
    font-size: 12px;
  }
}

/* Home aqua reference layout. Remove this block and switch homeHeroAqua/businessAquaSummary to restore. */
body[data-page="home"] {
  background:
    radial-gradient(circle at 9% 20%, rgba(69, 130, 236, 0.16), transparent 28%),
    radial-gradient(circle at 89% 24%, rgba(36, 191, 200, 0.18), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #f1fbff 56%, #ffffff 100%);
}

body[data-page="home"] .site-header {
  background: rgba(255, 255, 255, 0.9);
  border-bottom: 1px solid rgba(184, 218, 235, 0.72);
  box-shadow: 0 12px 34px rgba(33, 90, 130, 0.06);
}

body[data-page="home"] .site-nav .nav-contact {
  padding: 11px 20px;
  border-radius: 999px;
  background: linear-gradient(135deg, #3467f2, #17c5ca);
  box-shadow: 0 14px 28px rgba(38, 119, 219, 0.22);
}

body[data-page="home"] .hero {
  min-height: min(640px, 78svh);
  padding: calc(var(--header-height) + 64px) 0 126px;
  color: #0b2b4a;
  background: #f6fcff;
}

body[data-page="home"] .hero-media {
  background-position: center;
  filter: saturate(0.86) brightness(1.16) contrast(0.88);
  opacity: 0.42;
  transform: scale(1.05);
}

body[data-page="home"] .hero::before {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.9) 43%, rgba(233, 250, 255, 0.72) 70%, rgba(217, 245, 252, 0.64) 100%),
    radial-gradient(circle at 84% 28%, rgba(39, 155, 230, 0.2), transparent 34%),
    radial-gradient(circle at 4% 84%, rgba(39, 187, 202, 0.18), transparent 32%);
}

body[data-page="home"] .hero::after {
  position: absolute;
  right: -10%;
  bottom: -112px;
  left: -10%;
  z-index: -1;
  height: 246px;
  content: "";
  background:
    radial-gradient(circle at 69% 28%, rgba(255, 255, 255, 0.94) 0 5px, transparent 6px),
    radial-gradient(circle at 80% 51%, rgba(255, 255, 255, 0.82) 0 4px, transparent 5px),
    radial-gradient(circle at 91% 38%, rgba(255, 255, 255, 0.72) 0 4px, transparent 5px),
    linear-gradient(105deg, rgba(215, 249, 255, 0.78), rgba(71, 190, 218, 0.58) 58%, rgba(73, 130, 230, 0.34));
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  transform: rotate(-2deg);
}

body[data-page="home"] .hero-pattern {
  opacity: 0.58;
  background:
    linear-gradient(125deg, transparent 0 59%, rgba(32, 142, 217, 0.2) 59.2%, transparent 59.8%),
    linear-gradient(155deg, transparent 0 66%, rgba(37, 188, 202, 0.22) 66.2%, transparent 66.8%),
    radial-gradient(circle at 88% 55%, rgba(52, 116, 238, 0.22) 0 2px, transparent 3px),
    radial-gradient(circle at 77% 69%, rgba(33, 187, 202, 0.24) 0 2px, transparent 3px),
    radial-gradient(circle at 94% 72%, rgba(52, 116, 238, 0.2) 0 2px, transparent 3px);
  mask-image: linear-gradient(90deg, transparent 0%, #000 52%, #000 100%);
}

body[data-page="home"] .hero-copy {
  max-width: 720px;
  padding-top: 8px;
}

body[data-page="home"] .hero .eyebrow {
  color: #2c6fe8;
  font-size: 15px;
  font-weight: 900;
}

body[data-page="home"] .hero h1 {
  color: #0a2a4a;
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(48px, 6.2vw, 86px);
  font-weight: 700;
  line-height: 1.28;
  text-shadow: 0 10px 28px rgba(42, 116, 171, 0.08);
  white-space: normal;
}

body[data-page="home"] .hero-lead {
  max-width: 690px;
  color: #183a5a;
  font-size: clamp(16px, 1.45vw, 19px);
  font-weight: 800;
  line-height: 1.95;
  white-space: normal;
}

body[data-page="home"] .hero-actions {
  gap: 16px;
  margin-top: 32px;
}

body[data-page="home"] .hero-actions .button {
  min-width: 212px;
  min-height: 58px;
  border-radius: 999px;
}

body[data-page="home"] .hero-actions .button-primary {
  background: linear-gradient(135deg, #3467f2, #16c3c8);
  box-shadow: 0 18px 42px rgba(31, 118, 221, 0.24);
}

body[data-page="home"] .hero-actions .button-secondary {
  color: #236be1;
  background: rgba(255, 255, 255, 0.78);
  border-color: rgba(55, 113, 231, 0.42);
  box-shadow: 0 14px 34px rgba(33, 107, 164, 0.1);
}

body[data-page="home"] .business-summary-section {
  position: relative;
  z-index: 4;
  padding: 0 0 86px;
  margin-top: -88px;
  background: transparent;
}

body[data-page="home"] .business-summary-heading {
  max-width: 780px;
  margin: 0 auto 24px;
  text-align: center;
}

body[data-page="home"] .business-summary-heading .section-kicker {
  color: #3b8ff0;
}

body[data-page="home"] .business-summary-heading h2 {
  color: #0b2b4a;
  font-size: clamp(28px, 3vw, 40px);
  line-height: 1.25;
}

body[data-page="home"] .business-summary-heading p:not(.section-kicker) {
  max-width: 760px;
  margin: 12px auto 0;
  color: #254662;
  font-weight: 700;
}

.business-aqua-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.business-aqua-card {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  min-height: 132px;
  padding: 24px 22px;
  overflow: hidden;
  color: #0c2e50;
  text-decoration: none;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(178, 218, 238, 0.92);
  border-radius: var(--radius);
  box-shadow: 0 22px 56px rgba(47, 113, 158, 0.13);
  backdrop-filter: blur(12px);
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.business-aqua-card::before {
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  content: "";
  background: linear-gradient(90deg, #386df1, #18c6c9);
}

.business-aqua-card::after {
  position: absolute;
  right: -28px;
  bottom: -38px;
  width: 118px;
  height: 118px;
  content: "";
  background: radial-gradient(circle, rgba(37, 188, 202, 0.16), transparent 68%);
}

.aqua-card-icon {
  position: relative;
  z-index: 1;
  display: inline-grid;
  place-items: center;
  width: 58px;
  height: 58px;
  color: #1c69d8;
  font-size: 15px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(180deg, #ffffff, #ecfbff);
  border: 2px solid rgba(36, 114, 218, 0.82);
  border-radius: var(--radius);
  box-shadow: inset 0 0 0 5px rgba(231, 249, 255, 0.86);
}

.aqua-card-copy {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 6px;
  min-width: 0;
}

.aqua-card-copy strong {
  color: #0a2f54;
  font-size: clamp(17px, 1.3vw, 20px);
  font-weight: 900;
  line-height: 1.3;
  white-space: nowrap;
}

.aqua-card-copy small {
  color: #3d566d;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.55;
}

.business-aqua-card:hover,
.business-aqua-card:focus-visible {
  border-color: rgba(52, 103, 242, 0.5);
  box-shadow: 0 28px 64px rgba(41, 116, 176, 0.18);
  transform: translateY(-4px);
}

.business-aqua-card:focus-visible {
  outline: 3px solid rgba(29, 196, 203, 0.26);
  outline-offset: 3px;
}

@media (max-width: 1120px) {
  .business-aqua-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  body[data-page="home"] .hero {
    min-height: 620px;
    padding-top: calc(var(--header-height) + 42px);
    padding-bottom: 138px;
  }

  body[data-page="home"] .hero::after {
    bottom: -138px;
    height: 238px;
  }

  body[data-page="home"] .business-summary-section {
    margin-top: -92px;
  }
}

@media (max-width: 640px) {
  body[data-page="home"] .hero {
    min-height: 600px;
    padding-bottom: 128px;
  }

  body[data-page="home"] .hero h1 {
    font-size: clamp(36px, 10vw, 48px);
  }

  body[data-page="home"] .hero-actions .button {
    min-width: 0;
  }

  body[data-page="home"] .business-summary-section {
    padding-bottom: 64px;
  }

  .business-aqua-grid {
    grid-template-columns: 1fr;
  }

  .business-aqua-card {
    min-height: 112px;
    padding: 20px;
  }

  .aqua-card-copy strong {
    white-space: normal;
  }
}
/* Home reference image icon and hero tune. Remove this block to revert this fine adjustment. */
body[data-page="home"] .hero {
  min-height: min(690px, 82svh);
  padding: calc(var(--header-height) + 76px) 0 150px;
}

body[data-page="home"] .hero-content {
  width: min(1280px, calc(100% - 72px));
}

body[data-page="home"] .hero-copy {
  max-width: 780px;
}

body[data-page="home"] .hero h1 {
  font-size: clamp(54px, 6.4vw, 88px);
  line-height: 1.26;
}

body[data-page="home"] .hero-lead {
  margin-top: 28px;
}

body[data-page="home"] .hero-actions .button {
  justify-content: space-between;
  gap: 28px;
  padding: 15px 26px 15px 32px;
  border-radius: 999px;
}

body[data-page="home"] .hero-actions .button::after {
  flex: 0 0 auto;
  width: 18px;
  height: 10px;
  content: "";
  background: currentColor;
  clip-path: polygon(0 42%, calc(100% - 7px) 42%, calc(100% - 7px) 0, 100% 50%, calc(100% - 7px) 100%, calc(100% - 7px) 58%, 0 58%);
  transition: transform 180ms ease, width 180ms ease;
}

body[data-page="home"] .hero-actions .button:hover::after,
body[data-page="home"] .hero-actions .button:focus-visible::after {
  width: 28px;
  transform: translateX(2px);
}

body[data-page="home"] .hero::after {
  right: -16%;
  bottom: -128px;
  left: -12%;
  height: 286px;
  background:
    radial-gradient(circle at 67% 30%, rgba(255, 255, 255, 0.95) 0 5px, transparent 6px),
    radial-gradient(circle at 78% 55%, rgba(255, 255, 255, 0.84) 0 4px, transparent 5px),
    radial-gradient(circle at 91% 40%, rgba(255, 255, 255, 0.78) 0 4px, transparent 5px),
    linear-gradient(105deg, rgba(224, 251, 255, 0.86), rgba(86, 199, 224, 0.62) 58%, rgba(78, 139, 234, 0.38));
}

body[data-page="home"] .business-summary-section {
  margin-top: -122px;
  padding-bottom: 82px;
}

.business-aqua-grid {
  gap: 16px;
}

.business-aqua-card {
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 22px;
  min-height: 140px;
  padding: 26px 28px;
  background: rgba(255, 255, 255, 0.94);
  border-color: rgba(206, 230, 243, 0.96);
  box-shadow: 0 24px 52px rgba(49, 111, 158, 0.12);
}

.aqua-card-icon {
  display: inline-grid;
  place-items: center;
  width: 76px;
  height: 76px;
  color: inherit;
  font-size: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.aqua-card-icon img {
  width: 76px;
  height: 76px;
  object-fit: contain;
}

.aqua-card-copy strong {
  font-size: clamp(18px, 1.35vw, 21px);
}

.aqua-card-copy small {
  color: #496176;
  font-size: 13px;
  line-height: 1.45;
}

@media (max-width: 760px) {
  body[data-page="home"] .hero {
    min-height: 650px;
    padding-top: calc(var(--header-height) + 52px);
    padding-bottom: 142px;
  }

  body[data-page="home"] .hero-content {
    width: calc(100% - 40px);
  }

  body[data-page="home"] .business-summary-section {
    margin-top: -98px;
  }
}

@media (max-width: 640px) {
  body[data-page="home"] .hero {
    min-height: 620px;
    padding-bottom: 132px;
  }

  body[data-page="home"] .hero h1 {
    font-size: clamp(38px, 10.2vw, 50px);
  }

  .business-aqua-card {
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 18px;
    min-height: 118px;
    padding: 20px;
  }

  .aqua-card-icon,
  .aqua-card-icon img {
    width: 64px;
    height: 64px;
  }
}
/* Home solid business card fit adjustment. Remove this block to revert the no-transparency card fit. */
body[data-page="home"] .business-summary-section {
  isolation: isolate;
}

body[data-page="home"] .business-summary-section .section-inner {
  position: relative;
  z-index: 2;
}

.business-aqua-grid {
  align-items: stretch;
}

.business-aqua-card {
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  min-height: 128px;
  height: 100%;
  padding: 22px 20px;
  background: #ffffff;
  border: 1px solid #cfe8f5;
  box-shadow: 0 18px 42px rgba(34, 96, 142, 0.12);
  backdrop-filter: none;
}

.business-aqua-card::after {
  display: none;
}

.aqua-card-icon {
  width: 64px;
  height: 64px;
  padding: 8px;
  background: #ffffff;
  border: 1px solid #d6edf8;
  border-radius: 8px;
  box-shadow: inset 0 0 0 1px rgba(53, 118, 224, 0.08);
}

.aqua-card-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.aqua-card-copy {
  align-content: center;
  gap: 5px;
  min-width: 0;
}

.aqua-card-copy strong {
  display: block;
  max-width: 100%;
  overflow: hidden;
  color: #0b3157;
  font-size: clamp(16px, 1.15vw, 19px);
  line-height: 1.28;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aqua-card-copy small {
  display: -webkit-box;
  max-width: 100%;
  overflow: hidden;
  color: #40586f;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (max-width: 1180px) {
  .business-aqua-card {
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 14px;
    padding: 20px 18px;
  }

  .aqua-card-icon {
    width: 58px;
    height: 58px;
    padding: 7px;
  }

  .aqua-card-copy strong {
    font-size: 16px;
  }

  .aqua-card-copy small {
    font-size: 11px;
  }
}

@media (max-width: 1120px) {
  .business-aqua-card {
    min-height: 120px;
  }

  .aqua-card-copy small {
    font-size: 12px;
  }
}

@media (max-width: 640px) {
  .business-aqua-card {
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 14px;
    min-height: 104px;
    padding: 18px;
  }

  .aqua-card-icon {
    width: 56px;
    height: 56px;
    padding: 7px;
  }

  .aqua-card-copy strong {
    white-space: normal;
  }
}
/* Home downloaded solid icon replacement. Remove this block to restore previous icon sizing. */
.aqua-card-icon {
  overflow: hidden;
  padding: 0;
  background: #ffffff;
  border: 0;
  box-shadow: none;
}

.aqua-card-icon img {
  display: block;
  width: 64px;
  height: 64px;
  background: #ffffff;
  border-radius: 8px;
}

.business-aqua-card {
  overflow: hidden;
  background: #ffffff;
}

@media (max-width: 1180px) {
  .aqua-card-icon img {
    width: 58px;
    height: 58px;
  }
}

@media (max-width: 640px) {
  .aqua-card-icon img {
    width: 56px;
    height: 56px;
  }
}
/* Site aqua palette refresh. Remove this block to restore the previous dark/gold color theme. */
body[data-page="home"] .hero-title-line {
  display: block;
  white-space: nowrap;
}

body[data-page="home"] .hero h1 {
  max-width: 840px;
  font-size: clamp(44px, 5.1vw, 76px);
  line-height: 1.28;
}

body[data-page="home"] .hero-copy {
  max-width: 860px;
}

body:not([data-page="home"]) {
  background:
    radial-gradient(circle at 10% 16%, rgba(63, 145, 240, 0.12), transparent 26%),
    radial-gradient(circle at 88% 8%, rgba(25, 196, 204, 0.12), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #f4fbff 58%, #ffffff 100%);
}

body:not([data-page="home"]) .hero {
  color: #0b2b4a;
  background: #f7fcff;
}

body:not([data-page="home"]) .hero-media {
  opacity: 0.24;
  filter: saturate(0.74) brightness(1.18) contrast(0.9);
}

body:not([data-page="home"]) .hero::before {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.9) 48%, rgba(230, 249, 255, 0.74) 100%),
    radial-gradient(circle at 86% 24%, rgba(37, 149, 229, 0.2), transparent 34%);
}

body:not([data-page="home"]) .hero-pattern {
  opacity: 0.52;
  background:
    linear-gradient(90deg, rgba(33, 142, 216, 0.08) 1px, transparent 1px) 0 0 / 80px 80px,
    linear-gradient(0deg, rgba(33, 142, 216, 0.07) 1px, transparent 1px) 0 0 / 80px 80px,
    linear-gradient(135deg, transparent 0 45%, rgba(28, 196, 203, 0.18) 45% 46%, transparent 46% 100%);
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.96), rgba(0, 0, 0, 0.66) 64%, transparent);
}

body:not([data-page="home"]) .hero .eyebrow,
.section-kicker,
.label {
  color: #2677e5;
}

body:not([data-page="home"]) .hero h1,
body:not([data-page="home"]) .hero-lead {
  color: #0a2a4a;
}

.button-primary,
.site-nav .nav-contact {
  background: linear-gradient(135deg, #3467f2, #17c5ca);
}

.button-secondary,
.button-outline-light {
  color: #236be1;
  background: #ffffff;
  border-color: rgba(54, 116, 232, 0.42);
}

.text-link {
  color: #146bd6;
}

.text-link::after {
  background: #18c4cb;
}

.muted,
.cta-section {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.74), rgba(235, 249, 255, 0.9)),
    #eefaff;
}

.band-blue,
.pillar-section,
.service-lineup-section {
  color: #0b2b4a;
  background:
    radial-gradient(circle at 18% 12%, rgba(52, 103, 242, 0.1), transparent 32%),
    linear-gradient(180deg, #ffffff 0%, #eefaff 100%);
}

.band-blue .section-kicker,
.pillar-heading .section-kicker,
.service-lineup-heading .section-kicker,
.business-domain-heading .section-kicker {
  color: #2677e5;
}

.band-blue h2,
.pillar-heading h2,
.service-lineup-heading h2,
.pillar-section .content-card h3,
.service-lineup-section .content-card h3,
.business-domain-section .content-card h3 {
  color: #0b3157;
}

.band-blue p,
.band-blue .lead-copy,
.pillar-heading p:not(.section-kicker),
.service-lineup-heading p:not(.section-kicker),
.pillar-section .content-card p,
.pillar-section .mini-list li,
.service-lineup-section .content-card p,
.service-lineup-section .mini-list li,
.business-domain-section .content-card p {
  color: #344f68;
}

.pillar-section::before,
.service-lineup-section::before {
  opacity: 0.5;
  background:
    linear-gradient(90deg, rgba(33, 142, 216, 0.08) 1px, transparent 1px) 0 0 / 84px 84px,
    linear-gradient(0deg, rgba(33, 142, 216, 0.06) 1px, transparent 1px) 0 0 / 84px 84px;
}

.pillar-section::after,
.content-card::before,
.detail-card::before,
.job-card::before,
.pillar-section .content-card.strong::before,
.service-lineup-section .content-card.strong::before,
.business-domain-section .content-card.strong::before {
  background: linear-gradient(90deg, #3467f2, #17c5ca);
}

.pillar-section .content-card.strong,
.service-lineup-section .content-card.strong,
.business-domain-section .content-card.strong,
.content-card,
.detail-card,
.job-card {
  color: #102033;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 252, 255, 0.94)),
    #ffffff;
  border-color: rgba(197, 229, 244, 0.96);
  box-shadow: 0 18px 46px rgba(36, 99, 145, 0.1);
}

.pillar-section .card-number,
.service-lineup-section .card-number,
.business-domain-section .card-number {
  color: #1d72db;
}

.pillar-section .mini-list li::before,
.service-lineup-section .mini-list li::before {
  background: #17c5ca;
}

.pillar-section .text-link,
.service-lineup-section .text-link,
.business-domain-section .text-link {
  color: #146bd6;
}

.infra-map-core {
  background: linear-gradient(135deg, #3467f2, #17c5ca);
}

.site-footer {
  color: #0b2b4a;
  background:
    linear-gradient(180deg, #f8fdff 0%, #eaf8ff 100%),
    #ffffff;
  border-top: 1px solid #cfe8f5;
}

.footer-logo img {
  filter: brightness(0) saturate(100%) invert(21%) sepia(46%) saturate(1116%) hue-rotate(175deg) brightness(92%) contrast(93%);
}

.footer-profile p,
.footer-nav a,
.footer-bottom {
  color: #344f68;
}

.footer-nav .footer-heading {
  color: #0b3157;
}

.footer-bottom {
  border-top: 1px solid #cfe8f5;
}

@media (max-width: 640px) {
  body[data-page="home"] .hero h1 {
    font-size: clamp(30px, 8.8vw, 42px);
    line-height: 1.3;
  }
}
/* Home business heading spacing after lead removal. Remove this block to restore the compact heading spacing. */
body[data-page="home"] .business-summary-heading {
  margin-bottom: clamp(44px, 4vw, 62px);
}

@media (max-width: 640px) {
  body[data-page="home"] .business-summary-heading {
    margin-bottom: 32px;
  }
}
/* Hero image clarity adjustment. Remove this block to restore the softer hero image. */
body[data-page="home"] .hero-media {
  opacity: 0.52;
  filter: saturate(0.96) brightness(1.08) contrast(1.02);
}

body:not([data-page="home"]) .hero-media {
  opacity: 0.34;
  filter: saturate(0.9) brightness(1.1) contrast(1.02);
}
/* Home side blue haze. Remove this block to restore the previous plain side margins. */
body[data-page="home"] .hero::before {
  background:
    radial-gradient(ellipse at 0% 38%, rgba(61, 112, 242, 0.34) 0%, rgba(96, 184, 245, 0.2) 18%, transparent 40%),
    radial-gradient(ellipse at 100% 34%, rgba(24, 196, 203, 0.32) 0%, rgba(91, 171, 244, 0.2) 20%, transparent 42%),
    linear-gradient(90deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 255, 255, 0.88) 43%, rgba(230, 249, 255, 0.72) 70%, rgba(220, 246, 252, 0.64) 100%),
    radial-gradient(circle at 84% 28%, rgba(39, 155, 230, 0.2), transparent 34%),
    radial-gradient(circle at 4% 84%, rgba(39, 187, 202, 0.18), transparent 32%);
}

body[data-page="home"] .hero-pattern::before,
body[data-page="home"] .hero-pattern::after {
  position: absolute;
  top: 0;
  bottom: 0;
  width: min(18vw, 230px);
  pointer-events: none;
  content: "";
  filter: blur(24px);
}

body[data-page="home"] .hero-pattern::before {
  left: -56px;
  background: linear-gradient(90deg, rgba(57, 111, 242, 0.32), transparent);
}

body[data-page="home"] .hero-pattern::after {
  right: -56px;
  background: linear-gradient(270deg, rgba(23, 196, 203, 0.28), transparent);
}
/* All pages side blue haze. Remove this block to restore plain side margins on lower pages. */
body:not([data-page="home"]) .hero::before {
  background:
    radial-gradient(ellipse at 0% 38%, rgba(61, 112, 242, 0.3) 0%, rgba(96, 184, 245, 0.18) 18%, transparent 40%),
    radial-gradient(ellipse at 100% 34%, rgba(24, 196, 203, 0.28) 0%, rgba(91, 171, 244, 0.18) 20%, transparent 42%),
    linear-gradient(90deg, rgba(255, 255, 255, 0.97) 0%, rgba(255, 255, 255, 0.9) 48%, rgba(230, 249, 255, 0.74) 100%),
    radial-gradient(circle at 86% 24%, rgba(37, 149, 229, 0.2), transparent 34%);
}

body:not([data-page="home"]) .hero-pattern::before,
body:not([data-page="home"]) .hero-pattern::after {
  position: absolute;
  top: 0;
  bottom: 0;
  width: min(18vw, 230px);
  pointer-events: none;
  content: "";
  filter: blur(24px);
}

body:not([data-page="home"]) .hero-pattern::before {
  left: -56px;
  background: linear-gradient(90deg, rgba(57, 111, 242, 0.28), transparent);
}

body:not([data-page="home"]) .hero-pattern::after {
  right: -56px;
  background: linear-gradient(270deg, rgba(23, 196, 203, 0.24), transparent);
}
/* Hero height tighter adjustment. Remove this block to restore the previous hero height. */
body[data-page="home"] .hero {
  min-height: min(560px, 68svh);
  padding-top: calc(var(--header-height) + 46px);
  padding-bottom: 96px;
}

body[data-page="home"] .business-summary-section {
  margin-top: -82px;
}

body:not([data-page="home"]) .hero {
  min-height: min(380px, 46svh);
  padding-top: calc(var(--header-height) + 30px);
  padding-bottom: 28px;
}

@media (max-width: 760px) {
  body[data-page="home"] .hero {
    min-height: 510px;
    padding-top: calc(var(--header-height) + 32px);
    padding-bottom: 96px;
  }

  body[data-page="home"] .business-summary-section {
    margin-top: -72px;
  }

  body:not([data-page="home"]) .hero {
    min-height: 320px;
    padding-top: calc(var(--header-height) + 28px);
    padding-bottom: 28px;
  }
}

@media (max-width: 640px) {
  body[data-page="home"] .hero {
    min-height: 490px;
    padding-bottom: 88px;
  }

  body:not([data-page="home"]) .hero {
    min-height: 300px;
  }
}
/* Reference hero layout refresh. Remove this block to restore the previous hero layout. */
.hero {
  display: grid;
  align-items: center;
  min-height: min(620px, 76svh);
  padding: calc(var(--header-height) + 58px) 0 112px;
  color: #0a2a4a;
  background: #f7fcff;
}

.hero-media {
  background-position: center right;
  opacity: 0.42;
  filter: saturate(0.9) brightness(1.12) contrast(0.96);
  transform: scale(1.04);
}

.hero::before {
  background:
    radial-gradient(ellipse at 0% 34%, rgba(61, 112, 242, 0.26) 0%, rgba(96, 184, 245, 0.16) 18%, transparent 42%),
    radial-gradient(ellipse at 100% 36%, rgba(24, 196, 203, 0.25) 0%, rgba(91, 171, 244, 0.15) 20%, transparent 44%),
    linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.92) 42%, rgba(236, 251, 255, 0.76) 72%, rgba(222, 247, 253, 0.66) 100%);
}

.hero::after {
  position: absolute;
  right: -12%;
  bottom: -118px;
  left: -12%;
  z-index: -1;
  height: 248px;
  content: "";
  background:
    radial-gradient(circle at 68% 30%, rgba(255, 255, 255, 0.92) 0 5px, transparent 6px),
    radial-gradient(circle at 78% 52%, rgba(255, 255, 255, 0.82) 0 4px, transparent 5px),
    radial-gradient(circle at 91% 39%, rgba(255, 255, 255, 0.72) 0 4px, transparent 5px),
    linear-gradient(105deg, rgba(225, 251, 255, 0.82), rgba(78, 197, 224, 0.58) 58%, rgba(76, 137, 235, 0.34));
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  transform: rotate(-2deg);
}

.hero-pattern {
  opacity: 0.54;
  background:
    linear-gradient(125deg, transparent 0 59%, rgba(32, 142, 217, 0.18) 59.2%, transparent 59.8%),
    linear-gradient(155deg, transparent 0 66%, rgba(37, 188, 202, 0.2) 66.2%, transparent 66.8%),
    radial-gradient(circle at 88% 55%, rgba(52, 116, 238, 0.2) 0 2px, transparent 3px),
    radial-gradient(circle at 77% 69%, rgba(33, 187, 202, 0.22) 0 2px, transparent 3px),
    radial-gradient(circle at 94% 72%, rgba(52, 116, 238, 0.18) 0 2px, transparent 3px);
  mask-image: linear-gradient(90deg, transparent 0%, #000 48%, #000 100%);
}

.hero-content {
  width: min(1280px, calc(100% - 72px));
  max-width: min(1280px, calc(100% - 72px));
}

.hero-copy {
  max-width: 790px;
}

.hero .eyebrow {
  color: #2f73e8;
  font-size: 15px;
  font-weight: 900;
}

.hero h1 {
  max-width: 820px;
  color: #092947;
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(44px, 5.2vw, 78px);
  font-weight: 700;
  line-height: 1.26;
  white-space: normal;
  text-shadow: 0 10px 28px rgba(42, 116, 171, 0.08);
}

.hero-lead {
  max-width: 760px;
  margin-top: 28px;
  color: #183a5a;
  font-size: clamp(16px, 1.45vw, 19px);
  font-weight: 800;
  line-height: 1.95;
  white-space: normal;
}

.hero-actions {
  gap: 16px;
  margin-top: 34px;
}

.hero-actions .button {
  justify-content: space-between;
  min-width: 212px;
  min-height: 58px;
  gap: 28px;
  padding: 15px 26px 15px 32px;
  border-radius: 999px;
}

.hero-actions .button-primary {
  background: linear-gradient(135deg, #3467f2, #16c3c8);
  box-shadow: 0 18px 42px rgba(31, 118, 221, 0.24);
}

.hero-actions .button-secondary {
  color: #236be1;
  background: rgba(255, 255, 255, 0.82);
  border-color: rgba(55, 113, 231, 0.42);
  box-shadow: 0 14px 34px rgba(33, 107, 164, 0.1);
}

body[data-page="home"] .business-summary-section {
  margin-top: -94px;
}

@media (max-width: 760px) {
  .hero {
    min-height: 560px;
    padding: calc(var(--header-height) + 42px) 0 106px;
  }

  .hero-content {
    width: calc(100% - 40px);
    max-width: calc(100% - 40px);
  }

  .hero::after {
    bottom: -112px;
    height: 220px;
  }

  body[data-page="home"] .business-summary-section {
    margin-top: -78px;
  }
}

@media (max-width: 640px) {
  .hero {
    min-height: 520px;
    padding-bottom: 96px;
  }

  .hero h1 {
    font-size: clamp(32px, 9vw, 44px);
    line-height: 1.3;
  }

  .hero-lead {
    font-size: 15px;
    line-height: 1.7;
  }

  .hero-actions .button {
    width: 100%;
    min-width: 0;
  }
}
/* Hero arc button clearance adjustment. Remove this block to restore the previous curve position. */
.hero-content,
.hero-copy,
.hero-actions {
  position: relative;
  z-index: 2;
}

.hero::after {
  bottom: -176px;
  height: 258px;
}

body[data-page="home"] .business-summary-section {
  margin-top: -78px;
}

@media (max-width: 760px) {
  .hero::after {
    bottom: -156px;
    height: 226px;
  }

  body[data-page="home"] .business-summary-section {
    margin-top: -66px;
  }
}

@media (max-width: 640px) {
  .hero::after {
    bottom: -144px;
    height: 208px;
  }
}
/* Green desk hero image positioning. Remove this block to restore previous hero image cropping. */
.hero-media {
  background-position: 74% center;
}

@media (max-width: 760px) {
  .hero-media {
    background-position: 68% center;
  }
}
/* Office plants hero image positioning. Remove this block to restore previous hero image cropping. */
.hero-media {
  background-position: 72% center;
}

body[data-page="home"] .hero-media {
  opacity: 0.5;
}

body:not([data-page="home"]) .hero-media {
  opacity: 0.36;
}

@media (max-width: 760px) {
  .hero-media {
    background-position: 66% center;
  }
}
/* Desk plants hero image positioning. Remove this block to restore previous hero image cropping. */
.hero-media {
  background-position: 70% center;
}

body[data-page="home"] .hero-media {
  opacity: 0.52;
}

body:not([data-page="home"]) .hero-media {
  opacity: 0.38;
}

@media (max-width: 760px) {
  .hero-media {
    background-position: 64% center;
  }
}
/* Office room plants hero image positioning. Remove this block to restore previous hero image cropping. */
.hero-media {
  background-position: 72% center;
}

body[data-page="home"] .hero-media {
  opacity: 0.5;
}

body:not([data-page="home"]) .hero-media {
  opacity: 0.36;
}

@media (max-width: 760px) {
  .hero-media {
    background-position: 68% center;
  }
}
/* Working office hero image positioning. Remove this block to restore previous hero image cropping. */
.hero-media {
  background-position: 74% center;
}

body[data-page="home"] .hero-media {
  opacity: 0.48;
}

body:not([data-page="home"]) .hero-media {
  opacity: 0.34;
}

@media (max-width: 760px) {
  .hero-media {
    background-position: 66% center;
  }
}
/* Empty office desk green hero positioning. Remove this block to restore previous hero image cropping. */
.hero-media {
  background-position: 72% center;
}

body[data-page="home"] .hero-media {
  opacity: 0.5;
}

body:not([data-page="home"]) .hero-media {
  opacity: 0.36;
}

@media (max-width: 760px) {
  .hero-media {
    background-position: 66% center;
  }
}
/* Hero arc content clearance all pages. Remove this block to restore the previous curve/content overlap. */
.hero::after {
  bottom: -190px;
  height: 250px;
}

main > .section:first-of-type {
  position: relative;
  z-index: 2;
}

body[data-page="home"] .business-summary-section {
  position: relative;
  z-index: 4;
  margin-top: -58px;
}

body:not([data-page="home"]) .hero::after {
  bottom: -205px;
  height: 250px;
}

body:not([data-page="home"]) main > .section:first-of-type {
  padding-top: 82px;
}

@media (max-width: 760px) {
  .hero::after,
  body:not([data-page="home"]) .hero::after {
    bottom: -174px;
    height: 224px;
  }

  body[data-page="home"] .business-summary-section {
    margin-top: -54px;
  }

  body:not([data-page="home"]) main > .section:first-of-type {
    padding-top: 72px;
  }
}

@media (max-width: 640px) {
  .hero::after,
  body:not([data-page="home"]) .hero::after {
    bottom: -162px;
    height: 210px;
  }
}
/* Hero subtle side gradient decoration. Remove this block to restore plain hero side margins. */
.hero::before {
  background:
    radial-gradient(ellipse at 0% 38%, rgba(52, 103, 242, 0.26) 0%, rgba(113, 196, 246, 0.16) 18%, transparent 42%),
    radial-gradient(ellipse at 100% 36%, rgba(23, 196, 203, 0.24) 0%, rgba(102, 182, 246, 0.14) 20%, transparent 44%),
    linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.92) 42%, rgba(236, 251, 255, 0.76) 72%, rgba(222, 247, 253, 0.66) 100%);
}

.hero-pattern {
  opacity: 0.48;
  background:
    radial-gradient(ellipse at 0% 42%, rgba(52, 103, 242, 0.14) 0%, transparent 38%),
    radial-gradient(ellipse at 100% 42%, rgba(23, 196, 203, 0.14) 0%, transparent 38%);
  mask-image: none;
}

.hero-pattern::before,
.hero-pattern::after {
  display: none;
}
/* Footer aqua polish. Remove this block to restore the previous footer appearance. */
.site-footer {
  position: relative;
  overflow: hidden;
  color: #0b2b4a;
  background:
    radial-gradient(circle at 10% 18%, rgba(52, 103, 242, 0.12), transparent 28%),
    radial-gradient(circle at 88% 10%, rgba(23, 196, 203, 0.14), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #eefaff 100%);
  border-top: 1px solid #bfe3f3;
}

.site-footer::before {
  position: absolute;
  inset: 0 0 auto;
  height: 5px;
  content: "";
  background: linear-gradient(90deg, #3467f2, #17c5ca);
}

.site-footer::after {
  position: absolute;
  right: -120px;
  bottom: -160px;
  width: 420px;
  height: 420px;
  pointer-events: none;
  content: "";
  background: radial-gradient(circle, rgba(23, 196, 203, 0.14), transparent 66%);
}

.footer-inner {
  position: relative;
  z-index: 1;
  align-items: start;
  padding: 58px 0 46px;
}

.footer-profile {
  display: grid;
  gap: 18px;
  align-content: start;
}

.footer-logo {
  display: inline-flex;
  width: fit-content;
  padding: 10px 14px;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(191, 227, 243, 0.92);
  border-radius: 8px;
  box-shadow: 0 14px 34px rgba(36, 99, 145, 0.08);
}

.footer-logo img {
  filter: brightness(0) saturate(100%) invert(21%) sepia(46%) saturate(1116%) hue-rotate(175deg) brightness(92%) contrast(93%);
}

.footer-profile p {
  max-width: 420px;
  margin: 0;
  color: #344f68;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.8;
}

.footer-nav {
  gap: 28px;
}

.footer-nav div {
  gap: 9px;
  padding-left: 16px;
  border-left: 1px solid rgba(191, 227, 243, 0.9);
}

.footer-nav .footer-heading {
  position: relative;
  width: fit-content;
  margin-bottom: 4px;
  color: #0b3157;
  font-size: 14px;
  font-weight: 900;
}

.footer-nav .footer-heading::after {
  position: absolute;
  right: 0;
  bottom: -4px;
  left: 0;
  height: 2px;
  content: "";
  background: linear-gradient(90deg, #3467f2, #17c5ca);
  border-radius: 999px;
}

.footer-nav a {
  color: #3b566d;
  transition: color 160ms ease, transform 160ms ease;
}

.footer-nav a:hover,
.footer-nav a:focus-visible {
  color: #146bd6;
  transform: translateX(2px);
}

.footer-bottom {
  position: relative;
  z-index: 1;
  padding: 16px 0 24px;
  color: #456176;
  border-top: 1px solid #cfe8f5;
}

@media (max-width: 760px) {
  .footer-inner {
    padding: 44px 0 34px;
  }

  .footer-nav div {
    padding-left: 12px;
  }
}
/* Home business clear of hero arc. Remove this block to restore previous overlap positioning. */
body[data-page="home"] .hero::after {
  bottom: -230px;
  height: 250px;
}

body[data-page="home"] .business-summary-section {
  margin-top: -18px;
  padding-top: 18px;
}

body[data-page="home"] .business-summary-section .section-inner {
  position: relative;
  z-index: 5;
}

@media (max-width: 760px) {
  body[data-page="home"] .hero::after {
    bottom: -198px;
    height: 220px;
  }

  body[data-page="home"] .business-summary-section {
    margin-top: -12px;
    padding-top: 16px;
  }
}

@media (max-width: 640px) {
  body[data-page="home"] .hero::after {
    bottom: -184px;
    height: 208px;
  }
}
/* Home arc align with lower pages. Remove this block to restore the previous home-only arc position. */
body[data-page="home"] .hero::after {
  bottom: -205px;
  height: 250px;
}

body[data-page="home"] .business-summary-section {
  margin-top: -42px;
  padding-top: 18px;
}

@media (max-width: 760px) {
  body[data-page="home"] .hero::after {
    bottom: -174px;
    height: 224px;
  }

  body[data-page="home"] .business-summary-section {
    margin-top: -36px;
  }
}

@media (max-width: 640px) {
  body[data-page="home"] .hero::after {
    bottom: -162px;
    height: 210px;
  }
}
/* Home business kicker below arc. Remove this block to restore previous business heading position. */
body[data-page="home"] .business-summary-section {
  margin-top: -20px;
  padding-top: 30px;
}

body[data-page="home"] .business-summary-heading {
  margin-bottom: clamp(36px, 3.4vw, 52px);
}

@media (max-width: 760px) {
  body[data-page="home"] .business-summary-section {
    margin-top: -16px;
    padding-top: 26px;
  }
}
/* Hero section shorter final adjustment. Remove this block to restore the previous hero height. */
body[data-page="home"] .hero {
  min-height: min(520px, 64svh);
  padding-top: calc(var(--header-height) + 42px);
  padding-bottom: 84px;
}

body:not([data-page="home"]) .hero {
  min-height: min(360px, 44svh);
  padding-top: calc(var(--header-height) + 30px);
  padding-bottom: 28px;
}

@media (max-width: 760px) {
  body[data-page="home"] .hero {
    min-height: 490px;
    padding-top: calc(var(--header-height) + 30px);
    padding-bottom: 82px;
  }

  body:not([data-page="home"]) .hero {
    min-height: 320px;
    padding-top: calc(var(--header-height) + 26px);
    padding-bottom: 26px;
  }
}

@media (max-width: 640px) {
  body[data-page="home"] .hero {
    min-height: 470px;
    padding-bottom: 76px;
  }

  body:not([data-page="home"]) .hero {
    min-height: 300px;
  }
}
/* Hero section extra short adjustment. Remove this block to restore the previous shorter hero height. */
body[data-page="home"] .hero {
  min-height: min(460px, 58svh);
  padding-top: calc(var(--header-height) + 34px);
  padding-bottom: 66px;
}

body:not([data-page="home"]) .hero {
  min-height: min(300px, 38svh);
  padding-top: calc(var(--header-height) + 24px);
  padding-bottom: 22px;
}

body[data-page="home"] .hero-lead {
  margin-top: 18px;
}

body[data-page="home"] .hero-actions {
  margin-top: 24px;
}

@media (max-width: 760px) {
  body[data-page="home"] .hero {
    min-height: 440px;
    padding-top: calc(var(--header-height) + 24px);
    padding-bottom: 68px;
  }

  body:not([data-page="home"]) .hero {
    min-height: 280px;
    padding-top: calc(var(--header-height) + 22px);
    padding-bottom: 22px;
  }
}

@media (max-width: 640px) {
  body[data-page="home"] .hero {
    min-height: 420px;
    padding-bottom: 64px;
  }

  body:not([data-page="home"]) .hero {
    min-height: 260px;
  }
}
/* Lower page hero height restore adjustment. Remove this block to restore the extra-short lower page hero. */
body:not([data-page="home"]) .hero {
  min-height: min(340px, 42svh);
  padding-top: calc(var(--header-height) + 30px);
  padding-bottom: 30px;
}

@media (max-width: 760px) {
  body:not([data-page="home"]) .hero {
    min-height: 310px;
    padding-top: calc(var(--header-height) + 26px);
    padding-bottom: 28px;
  }
}

@media (max-width: 640px) {
  body:not([data-page="home"]) .hero {
    min-height: 290px;
  }
}
/* Lower page hero wider adjustment. Remove this block to restore the previous lower page hero height. */
body:not([data-page="home"]) .hero {
  min-height: min(390px, 48svh);
  padding-top: calc(var(--header-height) + 42px);
  padding-bottom: 42px;
}

@media (max-width: 760px) {
  body:not([data-page="home"]) .hero {
    min-height: 340px;
    padding-top: calc(var(--header-height) + 32px);
    padding-bottom: 34px;
  }
}

@media (max-width: 640px) {
  body:not([data-page="home"]) .hero {
    min-height: 320px;
  }
}
/* Lower page hero gothic heading. Remove this block to restore serif headings on lower pages. */
body:not([data-page="home"]) .hero h1 {
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, system-ui, sans-serif;
  font-weight: 900;
  letter-spacing: 0;
}
/* Office service hero single-line lead. Remove this block to restore default hero lead wrapping. */
@media (min-width: 900px) {
  body[data-page="office"] .hero-copy {
    max-width: 1080px;
  }

  body[data-page="office"] .hero-lead {
    max-width: 1040px;
    white-space: nowrap;
  }
}
/* Company history stat label nowrap. Remove this block to restore default history stat wrapping. */
.history-stats span {
  white-space: nowrap;
  font-size: 11.5px;
}
/* Company history founding year alignment. Remove this block to restore the previous 1998 position. */
.history-stats div:first-child strong {
  transform: translateX(-1px);
}
/* Infrastructure overview map placement. Remove this block to restore the standalone service map sizing. */
.infra-overview-layout {
  grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr);
  align-items: center;
}

.infra-overview-map {
  min-height: 390px;
}

.infra-overview-map .infra-map-core {
  width: 128px;
  height: 128px;
}

.infra-overview-map .infra-map-core strong {
  font-size: 16px;
}

.infra-overview-map .infra-map-item {
  min-height: 170px;
  padding: 20px;
}

.infra-overview-map .infra-map-item h3 {
  font-size: 17px;
}

.infra-overview-map .infra-map-item p {
  font-size: 13px;
  line-height: 1.55;
}

@media (max-width: 940px) {
  .infra-overview-layout {
    grid-template-columns: 1fr;
  }
}
/* Phone-only contact page layout. Remove this block to restore the previous form-oriented layout. */
.contact-phone-layout {
  grid-template-columns: minmax(300px, 0.82fr) minmax(0, 1.18fr);
  align-items: stretch;
}

.contact-phone-main {
  position: static;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 100%;
  padding: clamp(28px, 4vw, 44px);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 251, 255, 0.94));
  border: 1px solid #cfe8f5;
  border-radius: 8px;
  box-shadow: 0 18px 48px rgba(18, 69, 118, 0.1);
}

.contact-phone-main > p:not(.section-kicker) {
  margin: 18px 0 0;
  color: #274761;
  line-height: 1.85;
}

.contact-phone-card {
  margin: 28px 0 14px;
  border-color: rgba(52, 103, 242, 0.22);
  box-shadow: 0 16px 36px rgba(31, 118, 221, 0.12);
}

.contact-fax {
  font-weight: 800;
}

.contact-guidance {
  display: grid;
  gap: 16px;
}

.contact-guidance article {
  display: grid;
  gap: 8px;
  padding: clamp(22px, 3vw, 30px);
  background: #ffffff;
  border: 1px solid #d6edf7;
  border-radius: 8px;
  box-shadow: 0 14px 38px rgba(18, 69, 118, 0.08);
}

.contact-guidance span {
  color: #2578df;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.1em;
}

.contact-guidance h3 {
  margin: 0;
  color: #0b3157;
  font-size: clamp(18px, 1.6vw, 22px);
}

.contact-guidance p {
  margin: 0;
  color: #344f68;
  line-height: 1.75;
}

@media (max-width: 940px) {
  .contact-phone-layout {
    grid-template-columns: 1fr;
  }
}
/* Footer privacy utility row. Remove this block to restore the previous footer group placement. */
.footer-privacy-links {
  grid-column: 1 / -1;
  display: flex;
  flex-flow: row wrap;
  gap: 10px 22px;
  align-items: center;
  margin-top: 10px;
  padding-top: 18px;
  border-top: 1px solid rgba(191, 227, 243, 0.9);
}

.footer-nav .footer-privacy-links {
  display: flex;
  flex-direction: row;
  align-content: center;
  align-items: center;
}

.footer-privacy-links .footer-heading {
  display: none;
}

.footer-privacy-links .footer-heading::after {
  display: none;
}

@media (min-width: 941px) {
  .footer-nav {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .footer-nav a {
    white-space: nowrap;
  }
}

@media (max-width: 940px) {
  .footer-privacy-links {
    grid-column: 1 / -1;
    flex-direction: row;
  }
}
/* Home business mobile centering. Remove this block to restore the previous left-biased mobile card layout. */
@media (max-width: 640px) {
  body[data-page="home"] .business-aqua-grid {
    justify-items: center;
  }

  body[data-page="home"] .business-aqua-card {
    width: min(100%, 340px);
    grid-template-columns: 56px minmax(0, max-content);
    justify-content: center;
    text-align: left;
    transform: none;
  }

  body[data-page="home"] .aqua-card-copy {
    width: max-content;
    max-width: 100%;
  }
}

/* Mobile nav toggle right adjustment. Remove this block to restore the previous hamburger position. */
@media (max-width: 640px) {
  .nav-toggle {
    margin-right: -18px;
  }
}

/* Infrastructure overview mobile visual chips. Remove this block to restore the stacked mobile overview map. */
@media (max-width: 760px) {
  .infra-overview-map {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-content: center;
    gap: 8px;
    min-height: 280px;
    padding: 68px 14px 14px;
    overflow: hidden;
    background-image:
      linear-gradient(180deg, rgba(247, 252, 255, 0.12) 0%, rgba(8, 36, 62, 0.26) 42%, rgba(7, 31, 54, 0.72) 100%),
      var(--infra-mobile-bg);
    background-position: center;
    background-size: cover;
    border: 1px solid rgba(191, 227, 243, 0.95);
    border-radius: 8px;
    box-shadow: 0 20px 46px rgba(34, 96, 142, 0.16);
  }

  .infra-overview-map::before {
    position: absolute;
    inset: 18px auto auto 16px;
    z-index: 2;
    display: block;
    width: auto;
    height: auto;
    padding: 8px 12px;
    color: #ffffff;
    content: "社内インフラ環境構築";
    background: rgba(14, 68, 120, 0.82);
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 999px;
    box-shadow: 0 12px 26px rgba(8, 38, 62, 0.16);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0;
    transform: none;
  }

  .infra-overview-map::after,
  .infra-overview-map .infra-map-core {
    display: none;
  }

  .infra-overview-map .infra-map-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    align-content: center;
    min-height: 58px;
    padding: 10px;
    color: #0b3157;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(214, 237, 248, 0.95);
    box-shadow: 0 12px 28px rgba(5, 36, 58, 0.16);
    backdrop-filter: blur(10px);
  }

  .infra-overview-map .infra-map-item span {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    margin: 0;
    color: #ffffff;
    background: linear-gradient(135deg, #3467f2, #17c5ca);
    border-radius: 999px;
    font-size: 11px;
  }

  .infra-overview-map .infra-map-item h3 {
    margin: 0;
    font-size: 12px;
    line-height: 1.35;
  }

  .infra-overview-map .infra-map-item p {
    display: none;
  }
}

@media (max-width: 390px) {
  .infra-overview-map {
    gap: 7px;
    padding-right: 12px;
    padding-left: 12px;
  }

  .infra-overview-map .infra-map-item {
    gap: 6px;
    padding: 9px 8px;
  }

  .infra-overview-map .infra-map-item h3 {
    font-size: 11px;
  }
}

/* Training hero clipping fix. Remove this block to restore the shared lower-page hero sizing. */
body[data-page="training"] .hero {
  min-height: min(390px, 48svh);
  padding-top: calc(var(--header-height) + 42px);
  padding-bottom: 42px;
}

body[data-page="training"] .hero-copy {
  max-width: 920px;
}

body[data-page="training"] .hero h1 {
  line-height: 1.18;
}

@media (max-width: 760px) {
  body[data-page="training"] .hero {
    min-height: 340px;
    padding-top: calc(var(--header-height) + 32px);
    padding-bottom: 34px;
  }

  body[data-page="training"] .hero h1 {
    font-size: clamp(25px, 7.2vw, 34px);
  }
}

@media (max-width: 420px) {
  body[data-page="training"] .hero {
    min-height: 330px;
    padding-top: calc(var(--header-height) + 30px);
    padding-bottom: 32px;
  }

  body[data-page="training"] .hero h1 {
    font-size: clamp(24px, 7vw, 31px);
  }
}
/* Mobile section spacing compact. Remove this block to restore the previous mobile vertical rhythm. */
@media (max-width: 760px) {
  .section {
    padding-top: 56px;
    padding-bottom: 56px;
  }

  main > .section:first-of-type {
    padding-top: 46px;
  }

  .section-heading {
    margin-bottom: 30px;
  }

  .lead-grid,
  .split,
  .listing-grid,
  .contact-layout,
  .access-layout,
  .cta-box,
  .footer-inner {
    gap: 28px;
  }
}

@media (max-width: 560px) {
  .section {
    padding-top: 48px;
    padding-bottom: 48px;
  }

  main > .section:first-of-type {
    padding-top: 38px;
  }

  .section-heading {
    margin-bottom: 24px;
  }
}

/* Company profile mobile no-scroll table. Remove this block to restore the horizontal-scroll company table. */
@media (max-width: 760px) {
  body[data-page="company"] .company-profile-section .table-wrap {
    overflow: visible;
    background: transparent;
    border: 0;
    border-radius: 0;
  }

  body[data-page="company"] .company-profile-section .data-table {
    display: grid;
    width: 100%;
    min-width: 0;
    border-collapse: separate;
    border-spacing: 0;
    gap: 10px;
  }

  body[data-page="company"] .company-profile-section .data-table tbody,
  body[data-page="company"] .company-profile-section .data-table tr,
  body[data-page="company"] .company-profile-section .data-table th,
  body[data-page="company"] .company-profile-section .data-table td {
    display: block;
    width: 100%;
  }

  body[data-page="company"] .company-profile-section .data-table tbody {
    display: grid;
    gap: 10px;
  }

  body[data-page="company"] .company-profile-section .data-table tr {
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #d7e8f1;
    border-radius: 8px;
    box-shadow: 0 12px 28px rgba(34, 96, 142, 0.08);
  }

  body[data-page="company"] .company-profile-section .data-table th,
  body[data-page="company"] .company-profile-section .data-table td {
    border-bottom: 0;
  }

  body[data-page="company"] .company-profile-section .data-table th {
    padding: 10px 14px 6px;
    color: #2677e5;
    background: transparent;
    font-size: 12px;
    letter-spacing: 0;
  }

  body[data-page="company"] .company-profile-section .data-table td {
    padding: 0 14px 12px;
    color: #253f57;
    font-size: 13px;
    line-height: 1.65;
    overflow-wrap: anywhere;
  }
}

/* Employee certificates mobile no-scroll cards. Remove this block to restore the horizontal-scroll certificate table. */
@media (max-width: 760px) {
  body[data-page="about"] #certificate .table-wrap {
    overflow: visible;
    background: transparent;
    border: 0;
    box-shadow: none;
  }

  body[data-page="about"] #certificate .data-table {
    display: block;
    width: 100%;
    min-width: 0;
    border-collapse: separate;
  }

  body[data-page="about"] #certificate .data-table thead {
    display: none;
  }

  body[data-page="about"] #certificate .data-table tbody {
    display: grid;
    gap: 10px;
  }

  body[data-page="about"] #certificate .data-table tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 12px;
    align-items: center;
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(42, 133, 191, 0.18);
    border-radius: 10px;
    box-shadow: 0 10px 24px rgba(20, 81, 126, 0.08);
  }

  body[data-page="about"] #certificate .data-table td {
    display: block;
    padding: 0;
    border: 0;
    color: var(--text);
    line-height: 1.55;
  }

  body[data-page="about"] #certificate .data-table td:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
    padding: 3px 9px;
    color: var(--primary);
    font-size: 0.73rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    background: rgba(46, 137, 210, 0.1);
    border-radius: 999px;
  }

  body[data-page="about"] #certificate .data-table td:nth-child(2) {
    grid-column: 1 / -1;
    grid-row: 2;
    font-size: 0.9rem;
    font-weight: 700;
  }

  body[data-page="about"] #certificate .data-table td:nth-child(3) {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    white-space: nowrap;
    color: var(--primary-dark);
    font-size: 0.86rem;
    font-weight: 800;
  }
}

@media (max-width: 420px) {
  body[data-page="about"] #certificate .data-table tr {
    padding: 11px 12px;
  }

  body[data-page="about"] #certificate .data-table td:nth-child(2) {
    font-size: 0.86rem;
  }
}

/* About message heading mobile wrap adjustment. Remove this block to restore the fixed mobile line break. */
@media (max-width: 760px) {
  body[data-page="about"] main > .section:first-of-type .lead-grid h2 {
    max-width: 100%;
    font-size: clamp(24px, 6.1vw, 28px);
    line-height: 1.42;
    text-wrap: balance;
  }

  body[data-page="about"] main > .section:first-of-type .lead-grid h2 br {
    display: none;
  }
}

@media (max-width: 420px) {
  body[data-page="about"] main > .section:first-of-type .lead-grid h2 {
    font-size: clamp(23px, 6vw, 26px);
  }
}


/* Phone link text center alignment. Remove this block to restore the previous left-aligned phone text. */
.phone-link {
  justify-items: center;
  text-align: center;
}

.contact-phone-card {
  align-self: center;
  width: min(100%, 420px);
}

/* Company profile mobile card refinement. Remove this block to restore the first no-scroll card styling. */
@media (max-width: 760px) {
  body[data-page="company"] .company-profile-section .data-table tr {
    padding: 12px 14px;
  }

  body[data-page="company"] .company-profile-section .data-table th {
    padding: 0 0 6px;
    font-size: 0.76rem;
    line-height: 1.35;
  }

  body[data-page="company"] .company-profile-section .data-table td {
    padding: 0;
    font-size: 0.9rem;
    line-height: 1.72;
    overflow-wrap: anywhere;
    word-break: normal;
  }
}

/* Contact fax center alignment. Remove this block to restore the previous fax alignment. */
.contact-phone-main .contact-fax {
  align-self: center;
  width: min(100%, 420px);
  text-align: center;
}

/* Privacy policy title nowrap. Remove this block to restore the previous two-line privacy heading. */
.privacy-policy-title-nowrap {
  white-space: nowrap;
}

@media (max-width: 760px) {
  .privacy-policy-title-nowrap {
    font-size: clamp(22px, 5.6vw, 27px);
  }
}

@media (max-width: 380px) {
  .privacy-policy-title-nowrap {
    font-size: clamp(20px, 5.2vw, 23px);
  }
}

/* Privacy policy title mobile fit correction. Remove this block to restore the first nowrap sizing. */
@media (max-width: 760px) {
  .privacy-policy-card .privacy-policy-title-nowrap,
  body[data-page="contact"] .privacy-policy-title-nowrap {
    max-width: 100%;
    font-size: clamp(18px, 4.8vw, 24px);
    letter-spacing: 0;
    line-height: 1.3;
  }
}

@media (max-width: 380px) {
  .privacy-policy-card .privacy-policy-title-nowrap,
  body[data-page="contact"] .privacy-policy-title-nowrap {
    font-size: clamp(17px, 4.55vw, 20px);
  }
}

/* About message title desktop single line. Remove this block to restore the fixed two-line title on desktop. */
@media (min-width: 761px) {
  body[data-page="about"] .about-message-title {
    white-space: nowrap;
  }

  body[data-page="about"] .about-message-title br {
    display: none;
  }
}

/* Staffing hero mobile title fit. Remove this block to restore shared lower-page hero title sizing. */
@media (max-width: 760px) {
  body[data-page="staffing"] .hero h1 {
    max-width: 100%;
    font-size: clamp(26px, 7.1vw, 32px);
    line-height: 1.22;
    white-space: nowrap;
    word-break: keep-all;
    overflow-wrap: normal;
  }
}

@media (max-width: 380px) {
  body[data-page="staffing"] .hero h1 {
    font-size: clamp(24px, 6.8vw, 28px);
  }
}

/* Staffing hero title strict no-wrap correction. Remove this block to restore the previous mobile hero title behavior. */
body[data-page="staffing"] .staffing-hero-title-nowrap {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  word-break: keep-all;
  overflow-wrap: normal;
}

@media (max-width: 940px) {
  body[data-page="staffing"] .hero h1 {
    font-size: clamp(22px, 6.2vw, 29px);
    line-height: 1.24;
    white-space: nowrap;
  }
}

@media (max-width: 360px) {
  body[data-page="staffing"] .hero h1 {
    font-size: 21px;
  }
}

/* Infrastructure overview mobile equal chips. Remove this block to restore content-height chips. */
@media (max-width: 760px) {
  body[data-page="infra"] .infra-overview-map,
  body[data-page="infrastructure"] .infra-overview-map {
    grid-auto-rows: 76px;
  }

  body[data-page="infra"] .infra-overview-map .infra-map-item,
  body[data-page="infrastructure"] .infra-overview-map .infra-map-item {
    min-height: 0;
    height: 76px;
    grid-template-columns: 28px minmax(0, 1fr);
    align-content: center;
    align-items: center;
    padding: 10px 9px;
  }

  body[data-page="infra"] .infra-overview-map .infra-map-item h3,
  body[data-page="infrastructure"] .infra-overview-map .infra-map-item h3 {
    display: block;
    min-width: 0;
    line-height: 1.32;
    word-break: keep-all;
    overflow-wrap: normal;
  }
}

@media (max-width: 390px) {
  body[data-page="infra"] .infra-overview-map,
  body[data-page="infrastructure"] .infra-overview-map {
    grid-auto-rows: 74px;
  }

  body[data-page="infra"] .infra-overview-map .infra-map-item,
  body[data-page="infrastructure"] .infra-overview-map .infra-map-item {
    height: 74px;
  }
}

/* Infrastructure overview mobile long label fit. Remove this block to restore the previous chip label sizing. */
@media (max-width: 760px) {
  body[data-page="infra"] .infra-overview-map .infra-map-item h3,
  body[data-page="infrastructure"] .infra-overview-map .infra-map-item h3 {
    font-size: 11px;
    line-height: 1.22;
  }

  body[data-page="infra"] .infra-overview-map .item-automation h3,
  body[data-page="infrastructure"] .infra-overview-map .item-automation h3 {
    font-size: 10.5px;
  }
}

@media (max-width: 390px) {
  body[data-page="infra"] .infra-overview-map .infra-map-item h3,
  body[data-page="infrastructure"] .infra-overview-map .infra-map-item h3 {
    font-size: 10.2px;
    line-height: 1.2;
  }

  body[data-page="infra"] .infra-overview-map .item-automation h3,
  body[data-page="infrastructure"] .infra-overview-map .item-automation h3 {
    font-size: 9.8px;
  }
}

/* Footer privacy links mobile vertical layout. Remove this block to restore horizontal mobile utility links. */
@media (max-width: 760px) {
  .footer-privacy-links,
  .footer-nav .footer-privacy-links {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}

/* Footer privacy links mobile left alignment. Remove this block to restore inherited alignment. */
@media (max-width: 760px) {
  .footer-privacy-links,
  .footer-nav .footer-privacy-links {
    justify-content: flex-start;
    text-align: left;
  }

  .footer-privacy-links a {
    align-self: flex-start;
    text-align: left;
  }
}


/* Footer privacy links mobile align with footer columns. Remove this block to restore independent utility alignment. */
@media (max-width: 760px) {
  .footer-nav .footer-privacy-links {
    grid-column: 1 / -1;
    width: 100%;
    align-items: flex-start;
    padding-left: 12px;
    margin-left: 0;
    border-left: 1px solid rgba(191, 227, 243, 0.9);
  }

  .footer-nav .footer-privacy-links a {
    width: auto;
    align-self: flex-start;
    text-align: left;
  }
}

/* Footer privacy links mobile match recruit column alignment. Remove this block to restore flex utility placement. */
@media (max-width: 760px) {
  .footer-nav .footer-privacy-links {
    display: grid !important;
    grid-column: 1;
    justify-self: stretch;
    justify-content: stretch;
    justify-items: start;
    align-content: start;
    align-items: start;
    width: 100%;
    gap: 8px;
    padding-top: 0;
    padding-left: 12px;
    margin-top: 0;
    border-top: 0;
    border-left: 1px solid rgba(191, 227, 243, 0.9);
    text-align: left;
  }

  .footer-nav .footer-privacy-links a {
    display: block;
    justify-self: start;
    width: auto;
    text-align: left;
  }
}

/* Footer privacy heading underline. Remove this block to hide the privacy utility heading again. */
.footer-privacy-links .footer-heading {
  display: block;
}

.footer-privacy-links .footer-heading::after {
  display: block;
}

/* Footer privacy desktop column placement. Remove this block to restore the previous utility-row layout on PC. */
@media (min-width: 941px) {
  .footer-inner {
    grid-template-columns: minmax(230px, 0.62fr) minmax(0, 1.38fr);
    gap: 42px;
  }

  .footer-nav {
    grid-template-columns: minmax(72px, 0.76fr) minmax(96px, 0.96fr) minmax(138px, 1.16fr) minmax(86px, 0.84fr) minmax(150px, 1.1fr);
    gap: 18px;
  }

  .footer-nav .footer-privacy-links {
    grid-column: auto;
    display: grid;
    align-content: start;
    align-items: start;
    gap: 8px;
    margin-top: 0;
    padding-top: 0;
    padding-left: 18px;
    border-top: 0;
    border-left: 1px solid rgba(191, 227, 243, 0.9);
  }

  .footer-nav .footer-privacy-links .footer-heading {
    display: block;
  }

  .footer-nav .footer-privacy-links .footer-heading::after {
    display: block;
  }
}
/* Training hero line break control. Remove this block to restore natural wrapping. */
body[data-page="training"] .training-hero-title-line {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  word-break: keep-all;
  overflow-wrap: normal;
}

@media (min-width: 761px) {
  body[data-page="training"] .hero-copy {
    max-width: 980px;
  }
}
/* Training intro mobile two-line title. Remove this block to restore natural wrapping. */
body[data-page="training"] .training-intro-title span {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  word-break: keep-all;
  overflow-wrap: normal;
}

@media (max-width: 760px) {
  body[data-page="training"] .training-intro-title {
    font-size: clamp(25px, 6.5vw, 31px);
    line-height: 1.38;
  }
}

@media (max-width: 380px) {
  body[data-page="training"] .training-intro-title {
    font-size: clamp(23px, 6.1vw, 28px);
  }
}
/* Training monitoring mobile two-line copy. Remove this block to restore natural paragraph wrapping. */
body[data-page="training"] .training-monitor-copy span {
  display: inline;
}

@media (max-width: 760px) {
  body[data-page="training"] .training-monitor-copy {
    font-size: clamp(13px, 3.45vw, 15px);
    line-height: 1.65;
  }

  body[data-page="training"] .training-monitor-copy span {
    display: block;
    white-space: nowrap;
    word-break: keep-all;
    overflow-wrap: normal;
  }
}

@media (max-width: 380px) {
  body[data-page="training"] .training-monitor-copy {
    font-size: clamp(12px, 3.25vw, 14px);
  }
}
/* Staffing hero mobile title size refinement. Remove this block to restore the previous compact mobile title. */
@media (max-width: 760px) {
  body[data-page="staffing"] .hero h1 {
    font-size: clamp(24px, 6.75vw, 31px);
    line-height: 1.2;
    white-space: nowrap;
    word-break: keep-all;
    overflow-wrap: normal;
  }

  body[data-page="staffing"] .staffing-hero-title-nowrap {
    white-space: nowrap;
  }
}

@media (max-width: 360px) {
  body[data-page="staffing"] .hero h1 {
    font-size: 23px;
  }
}
/* Lower-page mobile hero title size unification. Remove this block to restore page-specific mobile hero title sizes. */
@media (max-width: 760px) {
  body:not([data-page="home"]) .hero h1 {
    font-size: clamp(18px, 6.2vw, 34px);
    line-height: 1.18;
  }
}

@media (max-width: 640px) {
  body:not([data-page="home"]) .hero h1 {
    font-size: clamp(32px, 9vw, 44px);
    line-height: 1.3;
  }
}
/* Infrastructure support list mobile line control. Remove this block to restore natural list wrapping. */
@media (max-width: 760px) {
  body[data-page="infra"] .telecom-summary-card[id^="infra-"] .mini-list,
  body[data-page="infrastructure"] .telecom-summary-card[id^="infra-"] .mini-list {
    gap: 9px;
    margin-top: 14px;
    margin-bottom: 0;
  }

  body[data-page="infra"] .telecom-summary-card[id^="infra-"] .mini-list li,
  body[data-page="infrastructure"] .telecom-summary-card[id^="infra-"] .mini-list li {
    font-size: 13px;
    line-height: 1.55;
    word-break: keep-all;
    overflow-wrap: normal;
  }

  body[data-page="infra"] .telecom-summary-card[id^="infra-"] .mini-list li span,
  body[data-page="infrastructure"] .telecom-summary-card[id^="infra-"] .mini-list li span {
    display: inline-block;
    max-width: 100%;
    white-space: nowrap;
  }
}

@media (max-width: 380px) {
  body[data-page="infra"] .telecom-summary-card[id^="infra-"] .mini-list li,
  body[data-page="infrastructure"] .telecom-summary-card[id^="infra-"] .mini-list li {
    font-size: 12.5px;
  }
}
/* Privacy policy date block left alignment. Remove this block to restore the previous right-aligned date box. */
.privacy-policy .policy-date {
  margin-right: auto;
  margin-left: 0;
  text-align: left;
}

.privacy-policy .policy-date-row {
  justify-content: start;
}

.privacy-policy .policy-date-name {
  text-align: left;
}
/* Training mobile hero title clipping refinement. Remove this block to restore the unified lower-page mobile title size. */
@media (max-width: 760px) {
  body[data-page="training"] .hero h1 {
    font-size: clamp(24px, 7.1vw, 36px);
    line-height: 1.22;
  }
}

@media (max-width: 420px) {
  body[data-page="training"] .hero h1 {
    font-size: clamp(23px, 6.6vw, 31px);
  }
}

@media (max-width: 360px) {
  body[data-page="training"] .hero h1 {
    font-size: 22px;
  }
}
/* Mobile text wrapping refinements 2026-06-24. Remove this block to restore the previous mobile wrapping behavior. */
@media (max-width: 760px) {
  body[data-page="training"] .training-work-title {
    max-width: 100%;
    font-size: clamp(25px, 6.6vw, 31px);
    line-height: 1.35;
    word-break: keep-all;
    overflow-wrap: normal;
    text-wrap: balance;
  }

  body[data-page="privacy"] .privacy-policy .policy-date {
    width: 100%;
    min-width: 0;
    padding: 16px;
  }

  body[data-page="privacy"] .policy-date-row {
    grid-template-columns: max-content max-content max-content;
    gap: 0;
    justify-content: start;
    white-space: nowrap;
  }

  body[data-page="privacy"] .policy-date-row span,
  body[data-page="privacy"] .policy-date-name {
    white-space: nowrap;
  }

  body[data-page="privacy"] .privacy-policy-card,
  body[data-page="privacy"] .privacy-policy-list,
  body[data-page="privacy"] .privacy-policy-list dd,
  body[data-page="privacy"] .privacy-policy-list p,
  body[data-page="privacy"] .privacy-policy-list li {
    word-break: normal;
    overflow-wrap: anywhere;
    line-break: strict;
    text-wrap: pretty;
  }

  body[data-page="staffing"] .relationship-copy p {
    word-break: normal;
    overflow-wrap: anywhere;
    line-break: strict;
  }

  body[data-page="staffing"] .relationship-copy .nowrap {
    white-space: nowrap;
  }

  body[data-page="recruit"] .hero-lead {
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: normal;
    text-wrap: balance;
  }

  body[data-page="environment"] .career-ratio {
    display: grid;
    grid-template-columns: minmax(0, 18.5fr) minmax(0, 81.5fr);
    min-height: 86px;
  }

  body[data-page="environment"] .career-ratio span {
    display: grid;
    place-items: center;
    min-width: 0;
    padding: 8px 4px;
  }

  body[data-page="environment"] .career-ratio strong {
    white-space: nowrap;
    font-size: clamp(18px, 5vw, 24px);
    line-height: 1;
  }

  body[data-page="environment"] .career-ratio small {
    white-space: nowrap;
  }
}

@media (max-width: 380px) {
  body[data-page="training"] .training-work-title {
    font-size: clamp(23px, 6.1vw, 28px);
  }

  body[data-page="environment"] .career-ratio strong {
    font-size: 17px;
  }
}

@media (min-width: 761px) and (max-width: 1180px) {
  body[data-page="it"] .it-solution-summary-grid,
  body[data-page="it-solution"] .it-solution-summary-grid {
    grid-template-columns: 1fr;
  }

  body[data-page="it"] .it-solution-summary-card,
  body[data-page="it-solution"] .it-solution-summary-card {
    grid-template-columns: minmax(220px, 0.42fr) minmax(0, 1fr);
    align-items: stretch;
    gap: 24px;
  }

  body[data-page="it"] .it-solution-summary-card img,
  body[data-page="it-solution"] .it-solution-summary-card img {
    height: 100%;
    min-height: 210px;
    aspect-ratio: auto;
  }

  body[data-page="it"] .it-solution-summary-card p,
  body[data-page="it-solution"] .it-solution-summary-card p {
    max-width: 42em;
    white-space: normal;
    word-break: normal;
    overflow-wrap: anywhere;
    line-break: strict;
    text-wrap: pretty;
  }
}
/* Training work title no-wrap. Remove this block to restore natural heading wrapping. */
body[data-page="training"] .training-work-title {
  max-width: 100%;
  white-space: nowrap;
  word-break: keep-all;
  overflow-wrap: normal;
}

@media (max-width: 380px) {
  body[data-page="training"] .training-work-title {
    font-size: clamp(22px, 5.9vw, 26px);
  }
}
/* Staffing relationship mobile line control. Remove this block to restore natural relationship paragraph wrapping. */
@media (max-width: 760px) {
  body[data-page="staffing"] .relationship-copy-text {
    word-break: normal;
    overflow-wrap: anywhere;
    line-break: strict;
  }

  body[data-page="staffing"] .relationship-copy-text .relationship-line {
    display: block;
    max-width: 100%;
    white-space: nowrap;
    word-break: keep-all;
    overflow-wrap: normal;
    font-size: clamp(13px, 3.55vw, 15px);
  }

  body[data-page="staffing"] .relationship-copy-text .nowrap {
    white-space: nowrap;
    word-break: keep-all;
    overflow-wrap: normal;
  }
}

@media (max-width: 380px) {
  body[data-page="staffing"] .relationship-copy-text .relationship-line {
    font-size: clamp(12px, 3.35vw, 14px);
  }
}
/* Recruit hero mobile lead line break. Remove this block to restore natural hero lead wrapping. */
body[data-page="recruit"] .recruit-hero-lead-line {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  word-break: keep-all;
  overflow-wrap: normal;
}

@media (max-width: 760px) {
  body[data-page="recruit"] .hero-lead {
    white-space: normal;
    line-height: 1.65;
  }

  body[data-page="recruit"] .recruit-hero-lead-line:first-child {
    font-size: clamp(13px, 3.6vw, 15px);
  }
}

@media (max-width: 380px) {
  body[data-page="recruit"] .recruit-hero-lead-line:first-child {
    font-size: clamp(12px, 3.35vw, 14px);
  }
}
/* Environment mobile career ratio readable columns. Remove this block to restore proportional mobile ratio widths. */
@media (max-width: 760px) {
  body[data-page="environment"] .career-ratio {
    grid-template-columns: minmax(118px, 0.42fr) minmax(0, 0.58fr);
  }

  body[data-page="environment"] .career-ratio span {
    padding-right: 8px;
    padding-left: 8px;
  }

  body[data-page="environment"] .career-ratio strong {
    font-size: clamp(18px, 4.7vw, 23px);
  }
}

@media (max-width: 380px) {
  body[data-page="environment"] .career-ratio {
    grid-template-columns: minmax(104px, 0.44fr) minmax(0, 0.56fr);
  }

  body[data-page="environment"] .career-ratio strong {
    font-size: 16px;
  }
}
/* Environment mobile career ratio no percent in bars. Remove this block to restore percent labels inside the ratio bars. */
@media (max-width: 760px) {
  body[data-page="environment"] .career-ratio {
    grid-template-columns: minmax(0, 18.5fr) minmax(0, 81.5fr);
  }

  body[data-page="environment"] .career-ratio span {
    padding-right: 4px;
    padding-left: 4px;
  }

  body[data-page="environment"] .career-ratio small {
    margin-top: 0;
    font-size: 12px;
    line-height: 1;
  }
}
/* Privacy mobile readable width refinement. Remove this block to restore the previous privacy mobile layout. */
@media (max-width: 760px) {
  body[data-page="privacy"] .section-inner.narrow.privacy-policy {
    width: min(100% - 20px, 980px);
  }

  body[data-page="privacy"] .privacy-policy-card {
    width: 100%;
    padding: 22px 15px;
  }

  body[data-page="privacy"] .privacy-policy-card h2 {
    margin-bottom: 16px;
    line-height: 1.35;
  }

  body[data-page="privacy"] .privacy-policy-card h3,
  body[data-page="privacy"] .privacy-policy-list dt {
    line-height: 1.45;
    word-break: keep-all;
    overflow-wrap: anywhere;
  }

  body[data-page="privacy"] .policy-lead,
  body[data-page="privacy"] .privacy-policy-list p,
  body[data-page="privacy"] .privacy-policy-list li,
  body[data-page="privacy"] .privacy-policy-list dd {
    max-width: 100%;
    font-size: 15px;
    line-height: 1.78;
    word-break: normal;
    overflow-wrap: break-word;
    line-break: strict;
    text-wrap: auto;
  }

  body[data-page="privacy"] .privacy-policy-list {
    gap: 20px;
  }

  body[data-page="privacy"] .privacy-policy-list dt {
    padding-left: 12px;
    font-size: 18px;
  }

  body[data-page="privacy"] .privacy-policy-list ol,
  body[data-page="privacy"] .privacy-policy-list ul {
    padding-left: 1.1em;
    gap: 9px;
  }
}
/* Staffing support heading tablet break. Remove this block to restore the previous iPad wrapping. */
.tablet-only-break {
  display: none;
}

@media (min-width: 761px) and (max-width: 1180px) {
  body[data-page="staffing"] .staffing-feature-heading p:not(.section-kicker) {
    max-width: 100%;
    white-space: normal;
    word-break: normal;
    overflow-wrap: break-word;
    line-break: strict;
    line-height: 1.8;
  }

  body[data-page="staffing"] .staffing-feature-heading .tablet-only-break {
    display: block;
  }
}
/* Staffing relationship mobile typography cleanup. Remove this block to restore the previous relationship mobile text. */
@media (max-width: 760px) {
  body[data-page="staffing"] .relationship-layout p,
  body[data-page="staffing"] .relationship-copy-text {
    font-size: 15px;
    line-height: 1.85;
    letter-spacing: 0;
    word-break: normal;
    overflow-wrap: break-word;
    line-break: strict;
    text-wrap: auto;
  }

  body[data-page="staffing"] .relationship-layout .nowrap,
  body[data-page="staffing"] .relationship-copy-text .nowrap {
    display: inline-block;
    white-space: nowrap;
  }
}