/* GNA Machinery — Global design system (typography, color, spacing, WCAG)
   Loaded last; canonical tokens and polish layer. */

:root {
  /* —— Brand (main content; header/footer use custom.css / portal.css) —— */
  --sky-band-deep: #073d66;
  --sky-band: #0a5c9e;
  --sky-band-mid: #0d6bae;
  --sky-accent: #3d9fd9;
  --lake: #0c4a6e;
  --lake-dark: #073549;
  --light-blue: #f2f7fc;
  --light-blue-deep: #e4edf7;
  --gray-band: #e9eff6;
  --gray-band-deep: #dfe8f2;

  /* Surfaces & borders */
  --band-white-bg: #ffffff;
  --band-light-top: #f8fbfe;
  --band-light-bg: #f0f6fc;
  --band-gray-bg: #e9eff6;
  --band-gray-deep: #e1e9f2;
  --surface-card: #ffffff;
  --surface-muted: #f4f8fc;
  --surface-inset: #eef4fa;
  --border-subtle: #d4dfe9;
  --border-card: #c5d4e4;
  --border-strong: #b0c4d8;
  --brand-red: #c62828;
  --brand-red-accent: #dc2626;
  --shadow-soft: 0 4px 18px rgba(7, 53, 73, 0.07);
  --shadow-lift: 0 12px 32px rgba(7, 53, 73, 0.11);

  /* —— Typography: 16px base, 1.25 modular scale (h6→h1), fluid headings —— */
  --text-xs: 0.75rem;      /* 12px */
  --text-sm: 0.875rem;     /* 14px */
  --text-base: 1rem;       /* 16px — body */
  --text-lg: 1.125rem;     /* 18px — h5 / lead */
  --text-xl: 1.25rem;      /* 20px — h4 */
  --text-2xl: 1.5rem;      /* 24px — h3 */
  --text-3xl: 1.875rem;    /* 30px — h2 */
  --text-4xl: 2.25rem;     /* 36px — h1 cap */
  --text-h1: clamp(1.875rem, 2.5vw + 1.125rem, 2.875rem);
  --text-h2: clamp(1.5rem, 1.5vw + 1rem, 2.25rem);
  --text-h3: clamp(1.25rem, 0.85vw + 0.95rem, 1.625rem);
  --text-h4: clamp(1.0625rem, 0.3vw + 1rem, 1.3125rem);
  --text-h5: clamp(1rem, 0.15vw + 0.95rem, 1.125rem);
  --text-h6: clamp(0.9375rem, 0.1vw + 0.9rem, 1rem);

  --leading-display: 1.1;
  --leading-heading: 1.2;
  --leading-subhead: 1.3;
  --leading-tight: var(--leading-display);
  --leading-snug: var(--leading-subhead);
  --leading-normal: 1.5;
  --leading-relaxed: 1.625;
  --leading-body: var(--leading-relaxed);

  --tracking-tight: -0.03em;
  --tracking-heading: -0.022em;
  --tracking-caps: 0.07em;
  --tracking-body: 0.01em;

  /* WCAG AA — body ≥4.5:1 on light bands; muted ≥4.5:1; large ≥3:1 on sky */
  --text-on-light: #041f2e;
  --text-on-light-body: #152d40;
  --text-on-light-muted: #2f4558;
  --text-on-dark: #ffffff;
  --text-on-dark-muted: #e8f2f9;
  --link-on-light: #084a6e;
  --link-on-light-hover: #052a3d;

  /* Premium caps labels */
  --label-premium: #001454;
  --label-premium-accent: #0a5c9e;
  --label-premium-muted: #073549;
  --label-on-image-shadow:
    0 0 1px rgba(0, 20, 84, 0.5),
    0 1px 0 rgba(0, 20, 84, 0.32),
    0 0 10px rgba(255, 255, 255, 0.92),
    0 0 20px rgba(255, 255, 255, 0.7);

  /* —— Spacing: 4px / 8px grid —— */
  --space-0: 0;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-7: 1.75rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;

  --container-gutter: clamp(1rem, 4vw, 2rem);
  --container: 100%;
  --section-y: clamp(2.25rem, 3.25vw + 1rem, 4.75rem);
  --section-head-gap: clamp(0.75rem, 1.75vw + 0.35rem, 1.5rem);
  --grid-gap: var(--space-6);
  --grid-gap-lg: var(--space-8);
  --card-pad: clamp(1.125rem, 1.75vw + 0.75rem, 1.625rem);
  --stack-gap: var(--space-4);
  --copy-max: 65ch;

  /* Aliases for custom.css / legacy rules (canonical values above) */
  --space-section-y: var(--section-y);
  --space-page-x: var(--container-gutter);
  --space-grid: var(--space-6);
  --space-grid-lg: var(--space-8);

  --header-h: 4.25rem;
  --radius-ui: 6px;
  --transition-ui: all 0.25s ease;
}

/* —— Base typography —— */

.portal-body {
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  letter-spacing: var(--tracking-body);
  color: var(--text-on-light-body);
}

.portal-body h1,
.portal-body h2,
.portal-body h3,
.portal-body h4,
.portal-body h5,
.portal-body h6 {
  font-weight: 700;
  color: var(--text-on-light);
  margin-top: 0;
  text-wrap: balance;
}

.portal-body h1 {
  font-size: var(--text-h1);
  line-height: var(--leading-display);
  letter-spacing: var(--tracking-tight);
  margin-bottom: var(--space-4);
}

.portal-body h2 {
  font-size: var(--text-h2);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  margin-bottom: var(--space-3);
}

.portal-body h3 {
  font-size: var(--text-h3);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  margin-bottom: var(--space-3);
}

.portal-body h4 {
  font-size: var(--text-h4);
  line-height: var(--leading-subhead);
  letter-spacing: var(--tracking-heading);
  margin-bottom: var(--space-2);
}

.portal-body h5 {
  font-size: var(--text-h5);
  line-height: var(--leading-subhead);
  letter-spacing: var(--tracking-heading);
  font-weight: 600;
  margin-bottom: var(--space-2);
  text-wrap: balance;
}

.portal-body h6 {
  font-size: var(--text-h6);
  line-height: var(--leading-subhead);
  letter-spacing: var(--tracking-body);
  font-weight: 600;
  margin-bottom: var(--space-2);
  text-wrap: balance;
}

.portal-body p {
  margin: 0 0 var(--stack-gap);
  line-height: var(--leading-body);
  color: var(--text-on-light-body);
  max-width: var(--copy-max);
}

.portal-body p:last-child {
  margin-bottom: 0;
}

.portal-body .lead {
  font-size: var(--text-lg);
  line-height: var(--leading-body);
  color: var(--text-on-light-body);
  max-width: var(--copy-max);
}

.portal-body .eyebrow,
.portal-body .label {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: var(--label-tone, var(--label-premium)) !important;
  margin-bottom: var(--space-3);
  padding: 0.4rem 0.95rem 0.4rem 0.7rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--label-tone-accent, var(--label-premium-accent)) 7%, transparent);
  border: 1px solid color-mix(in srgb, var(--label-tone-accent, var(--label-premium-accent)) 16%, transparent);
  box-shadow:
    0 1px 2px rgba(0, 20, 84, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.portal-body .label {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
}

.portal-body .label::before {
  content: "";
  width: 1.75rem;
  height: 3px;
  flex-shrink: 0;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    var(--label-tone-accent, var(--label-premium-accent)) 18%,
    var(--label-tone, var(--label-premium)) 82%,
    transparent 100%
  );
  box-shadow: 0 0 10px var(--label-tone-glow, rgba(61, 159, 217, 0.28));
  opacity: 0.92;
}

.portal-body .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.portal-body .eyebrow::before {
  content: "";
  width: 0.4375rem;
  height: 0.4375rem;
  flex-shrink: 0;
  border-radius: 50%;
  background: radial-gradient(
    circle at 35% 35%,
    color-mix(in srgb, var(--label-tone-accent, var(--label-premium-accent)) 88%, #fff) 0%,
    var(--label-tone-accent, var(--label-premium-accent)) 100%
  );
  box-shadow:
    0 0 0 2px color-mix(in srgb, var(--label-tone-accent, var(--label-premium-accent)) 20%, transparent),
    0 0 10px 1px var(--label-tone-glow, rgba(61, 159, 217, 0.22));
}

/* Three blues — darker text + medium outline accents */
.label-tone-1 {
  --label-tone: #001454;
  --label-tone-accent: #0a5c9e;
  --label-tone-glow: rgba(10, 92, 158, 0.28);
}

.label-tone-2 {
  --label-tone: #002470;
  --label-tone-accent: #0d6bae;
  --label-tone-glow: rgba(13, 107, 174, 0.28);
}

.label-tone-3 {
  --label-tone: #073549;
  --label-tone-accent: #073d66;
  --label-tone-glow: rgba(7, 61, 102, 0.28);
}

.portal-page-hero--image .label-tone-1,
.portal-page-hero--image .label-tone-2,
.portal-page-hero--image .label-tone-3 {
  -webkit-text-stroke: 0;
  text-shadow: var(--label-on-image-shadow);
}

.portal-page-hero--image .eyebrow,
.portal-page-hero--image .label {
  background: rgba(255, 255, 255, 0.78);
  border-color: rgba(255, 255, 255, 0.92);
  box-shadow:
    0 2px 12px rgba(0, 20, 84, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.65);
  backdrop-filter: blur(6px);
}

.portal-page-hero--image .label-tone-1 {
  --label-tone: #001454;
  --label-tone-accent: #0a5c9e;
}

.portal-page-hero--image .label-tone-2 {
  --label-tone: #002470;
  --label-tone-accent: #0d6bae;
}

.portal-page-hero--image .label-tone-3 {
  --label-tone: #073549;
  --label-tone-accent: #073d66;
}

/* Dark sky bands — medium blues (darker than pale, readable on navy) */
.band-sky:not(.portal-page-hero--image) .label-tone-1 {
  --label-tone: #3d9fd9;
  --label-tone-accent: #0a5c9e;
  --label-tone-glow: rgba(10, 92, 158, 0.38);
}

.band-sky:not(.portal-page-hero--image) .label-tone-2 {
  --label-tone: #0d6bae;
  --label-tone-accent: #073d66;
  --label-tone-glow: rgba(7, 61, 102, 0.38);
}

.band-sky:not(.portal-page-hero--image) .label-tone-3 {
  --label-tone: #7ec8f0;
  --label-tone-accent: #0a5c9e;
  --label-tone-glow: rgba(10, 92, 158, 0.35);
}

.portal-body main a:not(.btn-primary):not(.btn-outline):not(.nav-link):not(.pillar-link):not(.service-card):not(.hero-pitch__btn) {
  color: var(--link-on-light);
  font-weight: 600;
  text-underline-offset: 0.15em;
}

.portal-body main a:not(.btn-primary):not(.btn-outline):not(.nav-link):not(.pillar-link):not(.service-card):not(.hero-pitch__btn):hover {
  color: var(--link-on-light-hover);
}

.portal-body :focus-visible {
  outline: 2px solid var(--sky-band);
  outline-offset: 2px;
}

/* —— Accessible bands —— */

.band-sky {
  background: linear-gradient(
    128deg,
    var(--sky-band-deep) 0%,
    var(--sky-band) 45%,
    var(--sky-band-mid) 100%
  );
  color: var(--text-on-dark);
}

.band-white {
  background: var(--band-white-bg);
}

.band-light {
  background: linear-gradient(180deg, var(--band-light-top) 0%, var(--band-light-bg) 100%);
}

.band-gray {
  background: linear-gradient(180deg, var(--band-gray-bg) 0%, var(--band-gray-deep) 100%);
}

.band-sky h1,
.band-sky h2,
.band-sky h3,
.band-sky h4,
.band-sky p:not(.eyebrow):not(.label),
.band-sky li,
.band-sky .lead {
  color: var(--text-on-dark);
}

.band-sky .eyebrow,
.band-sky .label {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.16);
  box-shadow:
    0 1px 3px rgba(0, 20, 84, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.band-sky .eyebrow::before,
.band-sky .label::before {
  box-shadow:
    0 0 0 2px rgba(255, 255, 255, 0.12),
    0 0 12px 2px var(--label-tone-glow, rgba(126, 200, 240, 0.28));
}

.band-sky .lead {
  color: var(--text-on-dark-muted);
}

.band-sky .btn-primary {
  background: #fff;
  color: var(--lake-dark);
  border-color: #fff;
}

.band-sky .btn-primary:hover {
  background: var(--light-blue);
  color: var(--lake-dark);
  opacity: 1;
}

.band-lake,
.portal-cta-band,
section.portal-cta-band {
  background: var(--lake-dark);
  color: var(--text-on-dark);
}

.band-lake h1,
.band-lake h2,
.band-lake h3,
.band-lake p,
.portal-cta-band h2,
.portal-cta-band p {
  color: var(--text-on-dark);
}

.band-lake .eyebrow,
.portal-cta-band .eyebrow {
  color: var(--text-on-dark-muted);
}

.band-white,
.band-light,
.band-gray {
  color: var(--text-on-light);
}

.band-white h1,
.band-white h2,
.band-white h3,
.band-white h4,
.band-light h1,
.band-light h2,
.band-light h3,
.band-light h4,
.band-gray h1,
.band-gray h2,
.band-gray h3,
.band-gray h4 {
  color: var(--text-on-light);
}

.band-white p:not(.eyebrow):not(.label),
.band-white li,
.band-light p:not(.eyebrow):not(.label),
.band-light li,
.band-gray p:not(.eyebrow):not(.label),
.band-gray li {
  color: var(--text-on-light-body);
}

.band-white .eyebrow,
.band-white .label,
.band-light .eyebrow,
.band-light .label,
.band-gray .eyebrow,
.band-gray .label {
  color: var(--label-tone, var(--label-premium)) !important;
}

.band-sky .lead,
.band-lake .lead {
  color: var(--text-on-dark-muted);
  max-width: var(--copy-max);
}

/* —— Layout rhythm —— */

.portal-container {
  width: var(--container);
  max-width: none;
  margin-inline: 0;
  padding-inline: var(--container-gutter);
  box-sizing: border-box;
}

.enterprise-section,
.content-block,
.portal-section {
  padding-block: var(--section-y);
}

.enterprise-section .portal-container,
.content-block .portal-container,
.portal-section .portal-container {
  padding-inline: var(--container-gutter);
  width: var(--container);
  max-width: none;
  margin-inline: 0;
  box-sizing: border-box;
}

.nav-bar .section-width,
.nav-bar #mobile-menu,
.site-footer .section-width {
  padding-inline: var(--container-gutter) !important;
  box-sizing: border-box;
}

.enterprise-section .section-head {
  margin-bottom: var(--section-head-gap);
  max-width: 42rem;
}

.enterprise-section .section-head p,
.content-block .portal-container > p {
  max-width: var(--copy-max);
}

.section-head--left {
  text-align: left;
}

.section-head .btn-primary,
.section-cta {
  margin-top: var(--space-4);
  display: inline-flex;
}

.content-block .portal-container {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.content-block .portal-container > .label:first-child,
.content-block .portal-container > .eyebrow:first-child {
  margin-bottom: 0;
}

.content-block .portal-container > h2 {
  margin-top: 0;
  margin-bottom: var(--space-3);
}

.content-block .portal-container > p + h2,
.content-block .portal-container > ul + h2,
.content-block .portal-container > figure + h2 {
  margin-top: var(--space-6);
}

/* Inner page heroes */
.portal-page-hero.band-sky {
  margin-top: var(--header-h);
  padding-block: var(--section-y);
}

.portal-page-hero.band-sky:not(.portal-page-hero--image) h1 {
  color: var(--text-on-dark);
  margin-bottom: var(--space-4);
}

.portal-page-hero.band-sky .lead {
  color: var(--text-on-dark-muted);
  max-width: 52ch;
  margin-bottom: 0;
}

/* —— Components —— */

.btn-primary,
.btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0.75rem 1.5rem;
  font-size: var(--text-sm);
  font-weight: 700;
  line-height: 1.3;
  border-radius: var(--radius-ui);
  text-decoration: none;
  transition: var(--transition-ui);
}

.band-white .btn-primary,
.band-light .btn-primary,
.band-gray .btn-primary {
  background: var(--sky-band-deep);
  color: var(--text-on-dark);
  border: 1px solid var(--sky-band-deep);
}

.band-white .btn-primary:hover,
.band-light .btn-primary:hover,
.band-gray .btn-primary:hover {
  background: var(--lake-dark);
  border-color: var(--lake-dark);
}

.band-white .btn-outline {
  border: 1px solid var(--lake);
  color: var(--lake);
  background: transparent;
  font-weight: 600;
}

.band-white .btn-outline:hover {
  background: var(--light-blue);
  color: var(--lake-dark);
}

.prose-list {
  list-style: disc;
  padding-left: 1.25rem;
  margin: 0;
  color: var(--text-on-light-body);
  line-height: var(--leading-relaxed);
}

.prose-list li + li {
  margin-top: var(--space-2);
}

.prose-ol {
  padding-left: 1.25rem;
  margin: 0;
  color: var(--text-on-light-body);
  font-size: var(--text-sm);
  line-height: var(--leading-relaxed);
}

.pillar-card {
  padding: var(--card-pad);
}

.pillar-card h3 {
  font-size: var(--text-xl);
  line-height: var(--leading-snug);
  margin-bottom: var(--space-3);
}

.pillar-card ul {
  font-size: var(--text-sm);
  line-height: var(--leading-relaxed);
  color: var(--text-on-light-body);
}

.pillar-card .pillar-link {
  color: var(--sky-band-deep);
  font-weight: 700;
}

.pillar-card .pillar-link:hover {
  color: var(--lake-dark);
}

.spotlight-split h2 {
  color: var(--text-on-light);
  margin-bottom: var(--space-4);
}

.spotlight-split p {
  line-height: var(--leading-relaxed);
  max-width: 58ch;
  color: var(--text-on-light-body);
}

.trust-stats .stat-label {
  color: var(--text-on-light-muted);
}

.trust-stats .stat-value {
  color: var(--lake-dark);
}

.partner-group h3 {
  font-size: var(--text-lg);
  font-weight: 800;
  color: var(--text-on-light);
}

.partner-group ul {
  font-size: var(--text-sm);
  line-height: var(--leading-relaxed);
  color: var(--text-on-light-body);
}

.spec-table th {
  color: var(--lake-dark);
  font-size: var(--text-xs);
}

.spec-table td {
  color: var(--text-on-light-body);
  line-height: var(--leading-normal);
}

.portal-footer--minimal .brand p,
.portal-footer--minimal .portal-footer-copy {
  color: var(--text-on-light-muted);
  line-height: var(--leading-normal);
}

.portal-footer--minimal .footer-tagline {
  color: var(--lake);
}

.copy-constrained {
  max-width: 68ch;
  margin-top: var(--space-8);
}

.copy-link-footer {
  margin-top: var(--space-6);
  font-size: var(--text-sm);
}

.content-figure--spaced {
  margin-top: var(--space-8);
}

.layout-two-col {
  display: grid;
  gap: var(--grid-gap-lg);
}

.panel-box h3 {
  margin: 0 0 var(--space-4);
  font-size: var(--text-lg);
  font-weight: 800;
}

.note-muted {
  font-size: var(--text-sm);
  color: var(--text-on-light-muted);
  margin-top: var(--space-3);
  line-height: var(--leading-normal);
}

.copy-spaced {
  margin-top: var(--space-6);
}

.container-narrow {
  max-width: 40rem;
  margin-inline: auto;
}

.form-note {
  font-size: var(--text-sm);
  margin-top: var(--space-4);
  color: var(--text-on-light-muted);
  line-height: var(--leading-normal);
}

.form-note--strong {
  font-weight: 600;
  color: var(--text-on-light-body);
}

.form-success {
  margin-top: var(--space-4);
  padding: var(--space-4);
  border: 1px solid var(--lake);
  background: var(--light-blue);
  font-size: var(--text-sm);
  color: var(--text-on-light-body);
  line-height: var(--leading-normal);
}

.nav-bar #lang-zh:hover {
  color: var(--accent-blue-light, #f0f7ff) !important;
}

.font-display {
  font-family: Syne, "Plus Jakarta Sans", system-ui, sans-serif;
}

/* —— Mobile: fluid type & tighter section rhythm —— */
@media (max-width: 767px) {
  :root {
    --container-gutter: clamp(1rem, 4vw, 1.25rem);
    --section-y: clamp(2rem, 4vw + 0.75rem, 3.25rem);
    --section-head-gap: clamp(0.625rem, 2vw + 0.25rem, 1.125rem);
    --grid-gap: var(--space-4);
    --grid-gap-lg: var(--space-5);
    --card-pad: var(--space-5);
    --stack-gap: var(--space-3);
    --text-h1: clamp(1.75rem, 5vw + 0.95rem, 2.25rem);
    --text-h2: clamp(1.375rem, 3.5vw + 0.8rem, 1.75rem);
    --text-h3: clamp(1.125rem, 2vw + 0.75rem, 1.375rem);
    --text-h4: clamp(1.0625rem, 1.25vw + 0.9rem, 1.1875rem);
    --text-h5: clamp(1rem, 0.5vw + 0.92rem, 1.0625rem);
    --text-h6: 0.9375rem;
  }

  .enterprise-section .section-head,
  .section-head--left {
    text-align: left;
  }

  .portal-body p,
  .portal-body .lead {
    max-width: none;
  }

  .hero-lockup--picture .hero-lockup__copy h1 {
    font-size: clamp(1.75rem, 5.5vw, 2.5rem);
    text-align: center;
    line-height: var(--leading-display);
  }
}

@media (min-width: 768px) {
  .layout-two-col {
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }
}

/* —— Main content color polish (header / footer excluded) —— */

html,
.portal-body {
  overflow-x: clip;
}

.hero-lockup--stacked .hero-lockup__media.w-screen {
  width: 100vw;
  max-width: 100vw;
}

/* Home hero — white field + watermark drawing + centered copy (index.html) */
.hero-fullscreen {
  position: relative;
  display: grid;
  grid-template: 1fr / 1fr;
  width: 100%;
  max-width: 100vw;
  min-height: calc(100svh - var(--header-h));
  margin-top: var(--header-h);
  overflow-x: clip;
  overflow-y: visible;
  isolation: isolate;
}

.hero-fullscreen__media,
.hero-fullscreen__inner {
  grid-area: 1 / 1;
}

.hero-fullscreen__media {
  position: relative;
  z-index: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 100%;
  min-height: calc(100svh - var(--header-h));
  background: #ffffff;
}

.hero-fullscreen__media .parallax-layer {
  position: relative;
  width: 100%;
  height: auto;
}

.hero-fullscreen__img {
  display: block;
  width: 100%;
  min-width: 100%;
  height: auto;
  max-width: none;
  max-height: none;
  object-fit: contain;
  object-position: center center;
  opacity: 0.56;
  filter: saturate(1);
  pointer-events: none;
  user-select: none;
  vertical-align: top;
}

.hero-fullscreen__scrim {
  display: none;
}

.hero-fullscreen__inner {
  position: relative;
  z-index: 2;
  place-self: center;
  width: 100%;
  max-width: 64rem;
  margin-inline: auto;
  padding: clamp(1.5rem, 4vw, 2.5rem) var(--container-gutter);
  text-align: center;
  pointer-events: none;
}

.hero-fullscreen__inner a {
  pointer-events: auto;
}

.hero-fullscreen__copy {
  padding: 0;
  background: transparent;
}

.hero-fullscreen__kicker {
  margin: 0 0 var(--space-4);
  font-size: clamp(0.75rem, 1.2vw, 0.875rem);
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #ea580c;
  text-shadow: 0 1px 12px rgba(255, 255, 255, 0.85);
}

.hero-fullscreen__title {
  margin: 0 0 clamp(1.75rem, 4vw, 2.5rem);
  text-wrap: balance;
}

.hero-fullscreen__line-main,
.hero-fullscreen__line-accent {
  display: block;
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: #ea580c;
  -webkit-text-stroke: 0.5px rgba(194, 65, 12, 0.35);
  text-shadow:
    0 0 32px rgba(255, 255, 255, 0.92),
    0 2px 0 rgba(255, 255, 255, 0.75),
    0 4px 20px rgba(255, 255, 255, 0.5);
}

.hero-fullscreen__line-main {
  font-size: clamp(2.25rem, 6.5vw + 0.75rem, 4.75rem);
}

.hero-fullscreen__line-accent {
  margin-top: 0.12em;
  font-size: clamp(1.75rem, 5vw + 0.5rem, 3.75rem);
}

.hero-fullscreen__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--space-3);
}

.hero-fullscreen__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 1 auto;
  min-width: 10.5rem;
  max-width: none;
  padding: 0.875rem 1.75rem;
  font-size: var(--text-sm);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  border-radius: 0.375rem;
  text-decoration: none;
  transition: var(--transition-ui);
}

.hero-fullscreen__btn--primary {
  background: linear-gradient(180deg, #0a5c9e 0%, #073549 100%);
  color: #ffffff;
  border: 1px solid #073549;
  box-shadow: 0 4px 14px rgba(7, 53, 73, 0.28);
}

.hero-fullscreen__btn--primary:hover {
  background: linear-gradient(180deg, #073549 0%, #041f2e 100%);
  border-color: #041f2e;
  color: #ffffff;
  box-shadow: 0 6px 20px rgba(7, 53, 73, 0.35);
  transform: translateY(-1px);
}

.hero-fullscreen__btn--secondary {
  background: #ffffff;
  color: var(--lake-dark, #073549);
  border: 1px solid var(--lake, #0c4a6e);
  box-shadow: 0 2px 8px rgba(7, 53, 73, 0.08);
}

.hero-fullscreen__btn--secondary:hover {
  background: var(--light-blue, #f2f7fc);
  border-color: var(--sky-band-deep, #073d66);
  color: var(--lake-dark, #073549);
  transform: translateY(-1px);
}

.portal-body .hero-fullscreen__title,
.portal-body .hero-fullscreen__line-main,
.portal-body .hero-fullscreen__line-accent {
  max-width: none;
}

@media (max-width: 767px) {
  .hero-fullscreen__line-main {
    font-size: clamp(1.875rem, 7vw + 0.5rem, 2.75rem);
  }

  .hero-fullscreen__line-accent {
    font-size: clamp(1.375rem, 5vw + 0.35rem, 2rem);
  }

  .hero-fullscreen__actions {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .hero-fullscreen__btn {
    width: 100%;
    max-width: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-fullscreen__btn--primary:hover,
  .hero-fullscreen__btn--secondary:hover {
    transform: none;
  }
}

.portal-body main {
  overflow-x: clip;
}

.portal-body main .pillar-card,
.portal-body main .partner-logo-card,
.portal-body main .company-capability-card,
.portal-body main .company-values__card,
.portal-body main .careers-benefit-card,
.portal-body main .service-card,
.portal-body main .automation-model-card {
  padding: var(--card-pad);
  background: var(--surface-card);
  border-color: var(--border-card);
}

.portal-body main .install-item {
  padding-block: clamp(1.25rem, 3vw, 2rem);
  padding-inline-start: var(--space-5);
}

.portal-body main .pillar-card:hover,
.portal-body main .partner-logo-card:hover,
.portal-body main .company-capability-card--link:hover {
  border-color: var(--border-strong);
  box-shadow: var(--shadow-lift);
}

.portal-body main .install-list {
  border-top-color: var(--border-strong);
}

.portal-body main .install-item {
  border-bottom-color: var(--border-subtle);
  border-left-color: var(--brand-red-accent);
}

.portal-body main .install-jump a {
  color: var(--lake-dark);
  background: var(--surface-muted);
  border-color: var(--border-card);
}

.portal-body main .install-jump a:hover {
  background: var(--light-blue-deep);
  border-color: var(--sky-accent);
  color: var(--lake-dark);
}

.portal-body main .spotlight-media-grid figure,
.portal-body main .install-gallery figure,
.portal-body main .content-figure {
  background: var(--surface-card);
  border-color: var(--border-subtle);
}

.portal-body main .automation-model-card,
.portal-body main .partner-group {
  background: transparent;
}

.portal-body main .automation-model-card {
  background: var(--surface-muted);
  border-color: var(--border-subtle);
}

.portal-body main .company-about-section {
  background: #b0e2ff;
}

.portal-body main .company-clients-award {
  background: #b0e2ff;
}

.portal-body main .company-values-award {
  background: var(--band-white-bg);
}

.portal-body main .company-capabilities-award {
  background: linear-gradient(
    128deg,
    #eef6fc 0%,
    #d9ebf8 46%,
    #c5dff5 100%
  );
}

.portal-body main .mro-services-award {
  background: #d4edff;
}

.portal-body main .automation-services-award {
  background: #e0eded;
}

.portal-body main .engineering-services-award {
  background: #ffffff;
}

.portal-body main .careers-award {
  background: #ffffff;
}

.portal-body main .contact-award {
  background: #ffffff;
}

.portal-body main .company-capabilities {
  background: linear-gradient(165deg, var(--band-light-top) 0%, var(--band-light-bg) 55%, var(--light-blue-deep) 100%);
  border-color: var(--border-card);
}

.portal-body main .home-automation-preview {
  background: linear-gradient(165deg, var(--light-blue-deep) 0%, var(--band-light-top) 42%, var(--band-white-bg) 100%);
  border-top-color: var(--border-card);
  border-bottom-color: var(--border-subtle);
}

.portal-body main .contact-form {
  background: var(--surface-card);
  border: 1px solid var(--border-card);
  border-radius: var(--radius-ui);
  padding: var(--card-pad);
  box-shadow: var(--shadow-soft);
}

.portal-body main .form-input {
  background: var(--surface-card);
  border-color: var(--border-subtle);
  color: var(--text-on-light-body);
}

.portal-body main .form-input:focus {
  border-color: var(--sky-band);
  box-shadow: 0 0 0 3px rgba(61, 159, 217, 0.2);
}

.portal-body main .contact-aside li,
.portal-body main .contact-aside a {
  color: var(--text-on-light-body);
}

.portal-body main .field-label {
  color: var(--text-on-light-muted);
}

.portal-body main .panel-box {
  background: var(--surface-card);
  border-color: var(--border-card);
}

.portal-body main .spec-table-wrap {
  border-color: var(--border-card);
  background: var(--surface-card);
}

.portal-body main .spec-table th {
  background: var(--surface-muted);
  color: var(--lake-dark);
}

.portal-body main .spec-table td {
  border-color: var(--border-subtle);
}

/* Nav & chrome typography */
.nav-bar .nav-link {
  font-size: var(--text-sm);
  font-weight: 700;
  letter-spacing: var(--tracking-body);
  line-height: 1.4;
}

.site-footer {
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
}

/* ═══════════════════════════════════════════════════════════════════════════
   Cross-stylesheet polish — sections, portal components, contrast fixes
   ═══════════════════════════════════════════════════════════════════════════ */

.portal-hero,
.portal-intro,
.portal-section,
.portal-page-hero,
.portal-cta-band,
.portal-footer--minimal .portal-footer-inner {
  padding-block: var(--section-y);
}

.portal-hero {
  padding-bottom: clamp(3rem, 4vw + 1rem, 5rem);
}

.portal-intro-brand {
  margin-bottom: var(--space-8);
  padding-bottom: var(--space-8);
}

.portal-section .solutions-grid,
.pillar-grid,
.spotlight-grid,
.service-cards,
.partner-grid {
  gap: var(--grid-gap);
}

.portal-cta-band p,
.portal-cta-band .lead {
  color: var(--text-on-dark-muted) !important;
  line-height: var(--leading-body);
  max-width: var(--copy-max);
  margin-inline: auto;
}

.portal-cta-band .eyebrow {
  color: var(--text-on-dark-muted) !important;
}

.portal-body .portal-cta-band h2 {
  color: var(--text-on-dark);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
}

.solution-card,
.spotlight-card,
.cap-row,
.panel-box {
  padding: var(--card-pad);
}

.solution-card li a,
.cap-row p,
.spotlight-card p:not(.sub) {
  color: var(--text-on-light-body);
  line-height: var(--leading-body);
  font-size: var(--text-sm);
}

.solution-card-title h3,
.spotlight-card h3 {
  font-size: var(--text-lg);
  line-height: var(--leading-subhead);
  color: var(--text-on-light);
}

.portal-footer--minimal .brand p,
.portal-footer--minimal .portal-footer-copy {
  color: var(--text-on-light-muted);
  line-height: var(--leading-body);
  font-size: var(--text-sm);
}

.hero-lockup--stacked .hero-lockup__copy h1 {
  font-size: var(--text-h1);
  line-height: var(--leading-display);
  letter-spacing: var(--tracking-tight);
}

.hero-lockup--stacked .hero-lockup__copy .lead {
  font-size: var(--text-lg);
  line-height: var(--leading-body);
}

.trust-stats {
  gap: var(--grid-gap);
}

@media (max-width: 767px) {
  .portal-hero,
  .portal-intro,
  .portal-section,
  .portal-page-hero,
  .portal-cta-band {
    padding-block: var(--section-y);
  }

  .hero-lockup--stacked {
    padding-bottom: var(--section-y);
  }

  .home-enterprise .hero-lockup--stacked {
    padding-bottom: 0;
  }

  .home-enterprise .hero-lockup--overlay {
    padding-bottom: 0;
  }
}

/* —— Light-surface utility harmonization (Tailwind + legacy classes) —— */

.portal-body main .band-white .text-slate-300,
.portal-body main .band-light .text-slate-300,
.portal-body main .band-gray .text-slate-300,
.portal-body main .band-white .text-slate-400,
.portal-body main .band-light .text-slate-400,
.portal-body main .band-gray .text-slate-400,
.portal-body main .band-white .text-subtle,
.portal-body main .band-light .text-subtle,
.portal-body main .band-gray .text-subtle {
  color: var(--text-on-light-muted) !important;
}

.portal-body main .band-white .text-slate-600,
.portal-body main .band-light .text-slate-600,
.portal-body main .band-gray .text-slate-600 {
  color: var(--text-on-light-body) !important;
}

.portal-body main .enterprise-section .section-head h2 {
  margin-bottom: var(--space-3);
}

.portal-body main .enterprise-section .section-head p {
  margin-top: 0;
  line-height: var(--leading-body);
}

.portal-body main .enterprise-section .section-head p + p {
  margin-top: var(--space-3);
}

.portal-body main .enterprise-section > .portal-container > * + * {
  margin-top: 0;
}

.portal-body main .pillar-grid,
.portal-body main .partner-grid,
.portal-body main .service-cards,
.portal-body main .solutions-grid,
.portal-body main .spotlight-grid {
  row-gap: var(--grid-gap);
  column-gap: var(--grid-gap);
}

@media (max-width: 767px) {
  .portal-body main .enterprise-section .section-head h2 {
    margin-bottom: var(--space-2);
  }

  .portal-body main section[class*="py-"] {
    padding-block: var(--section-y) !important;
  }
}