/* Final executive presentation layer. Loaded after the legacy stylesheet. */
:root {
  --ink: #102538;
  --muted: #647585;
  --line: #dbe4e8;
  --paper: #f4f7f8;
  --panel: #fff;
  --forest: #0b4c4a;
  --teal: #087d78;
  --gold: #c7a15a;
  --sky: #e4f1f1;
  --shadow: 0 24px 70px rgba(14, 35, 50, 0.11);
}

body {
  background: radial-gradient(circle at 10% 2%, rgba(8, 125, 120, 0.06), transparent 24rem), var(--paper);
  color: var(--ink);
  letter-spacing: -0.008em;
}

.site-header {
  min-height: 76px;
  padding: 12px clamp(20px, 4vw, 64px);
  border-bottom-color: rgba(219, 228, 232, 0.72);
  background: rgba(247, 250, 250, 0.86);
  box-shadow: 0 10px 40px rgba(14, 35, 50, 0.045);
  backdrop-filter: blur(22px) saturate(145%);
}

.brand span {
  width: 42px;
  height: 42px;
  background: linear-gradient(145deg, #0a5450, #092c3e);
  box-shadow: 0 10px 26px rgba(9, 44, 62, 0.2);
}

.brand strong { color: #102538; letter-spacing: -0.025em; }
nav { gap: clamp(9px, 1.25vw, 20px); }
nav a { color: #445968; font-size: clamp(0.68rem, 0.72vw, 0.8rem); letter-spacing: 0.005em; white-space: nowrap; }

.icon-link {
  padding: 10px 18px;
  border-color: rgba(11, 76, 74, 0.16);
  background: #0b4c4a;
  color: #fff;
  box-shadow: 0 9px 24px rgba(11, 76, 74, 0.16);
}

.icon-link:hover { background: #087d78; color: #fff; }

.hero {
  min-height: min(780px, calc(100vh - 96px));
  margin: 16px;
  padding: clamp(82px, 10vw, 132px) clamp(24px, 6vw, 88px) 104px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 28px;
  background: linear-gradient(90deg, rgba(6,24,36,.98), rgba(8,39,47,.94) 41%, rgba(8,42,48,.38) 72%, rgba(6,24,36,.18)), linear-gradient(180deg, transparent 66%, rgba(5,22,31,.72)), url("hero-ai-transformation.png") center right / cover no-repeat;
  box-shadow: 0 34px 100px rgba(7, 30, 42, 0.2);
}

.hero-content { max-width: 850px; }
.hero .eyebrow { display: inline-flex; gap: 9px; align-items: center; padding: 7px 12px; border: 1px solid rgba(255,255,255,.17); border-radius: 999px; background: rgba(255,255,255,.07); color: #c9e9e4; backdrop-filter: blur(12px); }
.hero .eyebrow::before { width: 7px; height: 7px; border-radius: 50%; background: #70d6c9; content: ""; box-shadow: 0 0 0 5px rgba(112,214,201,.12); }
.hero h1 { max-width: none; margin-top: 22px; color: #fff; font-size: clamp(4.4rem, 10vw, 8.5rem); line-height: .86; letter-spacing: -.075em; text-shadow: 0 12px 42px rgba(0,0,0,.2); }
.hero-subtitle { max-width: 820px; color: #f1f8f7; font-weight: 650; line-height: 1.16; }
.hero-copy { max-width: 720px; color: #c9d8da; line-height: 1.68; }
.button { min-height: 50px; border-radius: 999px; transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease; }
.button:hover { transform: translateY(-2px); }
.hero .button.primary { background: #f4d69b; color: #102538; box-shadow: 0 14px 34px rgba(0,0,0,.2); }
.hero .button.secondary { border-color: rgba(255,255,255,.25); background: rgba(255,255,255,.08); color: #fff; backdrop-filter: blur(12px); }
.signal-card { border-color: rgba(255,255,255,.14); border-radius: 18px; background: rgba(7,31,40,.66); }

.metrics {
  width: min(1240px, calc(100% - 64px));
  margin-top: -58px;
  border: 1px solid rgba(219,228,232,.8);
  border-radius: 22px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 28px 80px rgba(14,35,50,.13);
}

.metrics .metric-card { min-height: 180px; padding: 30px 26px; border-color: #e5ecef; background: rgba(255,255,255,.88); }
.metrics .revenue-card { background: linear-gradient(145deg, #eaf5f3, #fff9ec); }
.section { padding-block: clamp(76px, 9vw, 124px); }
.section-heading::before { width: 54px; height: 4px; border-radius: 999px; background: linear-gradient(90deg, var(--teal), var(--gold)); }
h2 { color: #123b4a; letter-spacing: -.045em; line-height: 1.04; }
h3 { color: #143a48; letter-spacing: -.022em; }
.eyebrow { color: var(--teal); letter-spacing: .1em; }

.board-panel { border: 1px solid rgba(255,255,255,.1); border-radius: 30px; background: radial-gradient(circle at 90% 8%, rgba(72,189,179,.18), transparent 30%), linear-gradient(145deg, #0a2637, #0b4444); box-shadow: 0 34px 90px rgba(7,31,43,.2); }
.board-mandates article, .timeline article, .leadership-grid article, .advisory-grid article, .training-card, .education-timeline article, .innovation-grid article, .patent-grid article, .publication-card, .award-card { border-color: rgba(205,219,225,.85); border-radius: 18px; background: rgba(255,255,255,.94); box-shadow: 0 14px 44px rgba(14,35,50,.065); }
.timeline article:hover, .leadership-grid article:hover, .advisory-grid article:hover, .training-card:hover, .innovation-grid article:hover, .publication-card:hover, .award-card:hover { transform: translateY(-5px); border-color: rgba(8,125,120,.3); box-shadow: 0 26px 66px rgba(14,35,50,.12); }
.profile-photo, .defense-figure { border-radius: 24px; box-shadow: 0 24px 70px rgba(14,35,50,.14); }
.companies, .published, .jami-products { background: radial-gradient(circle at 90% 5%, rgba(8,125,120,.08), transparent 28rem), linear-gradient(180deg, #eef4f5, #f8faf9); }
.capability-list span { border-color: rgba(8,125,120,.14); background: #fff; color: #284c58; }
.product-card { border-color: rgba(8,125,120,.16); border-radius: 24px; background: rgba(255,255,255,.94); box-shadow: 0 18px 54px rgba(14,35,50,.09); transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease; }
.product-card:hover { transform: translateY(-4px); border-color: rgba(8,125,120,.32); box-shadow: 0 28px 72px rgba(14,35,50,.14); }
.product-link { background: linear-gradient(135deg, #0b4c4a, #087d78); box-shadow: 0 12px 26px rgba(8,125,120,.18); }

.contact { width: min(1240px, calc(100% - 40px)); margin: 30px auto 70px; padding: clamp(40px, 6vw, 72px); border: 1px solid rgba(255,255,255,.1); border-radius: 28px; background: radial-gradient(circle at 88% 20%, rgba(199,161,90,.25), transparent 30%), linear-gradient(135deg, #091b2a, #0b4c4a); box-shadow: 0 30px 86px rgba(7,30,42,.2); }
footer { min-height: 88px; padding-inline: clamp(20px, 5vw, 72px); border-top: 1px solid var(--line); background: #edf3f4; }

@media (max-width: 1059px) {
  .site-header { grid-template-columns: 1fr auto; }
  .hero { min-height: 700px; }
}

@media (max-width: 759px) {
  .site-header { min-height: 66px; padding: 10px 16px; }
  .brand strong { display: inline; }
  .icon-link { padding: 9px 14px; }
  .hero { min-height: auto; margin: 8px; padding: 64px 22px 72px; border-radius: 22px; background: linear-gradient(180deg, rgba(6,25,37,.88), rgba(6,28,38,.96)), url("hero-ai-transformation.png") 68% center / cover no-repeat; }
  .hero h1 { margin-top: 18px; font-size: clamp(3.25rem, 16vw, 4.6rem); letter-spacing: -.065em; }
  .hero-copy { color: #d4e0e1; }
  .metrics { width: calc(100% - 28px); margin-top: -30px; border: 1px solid var(--line); border-radius: 20px; }
  .metrics .metric-card { min-height: auto; padding: 24px; }
  .section { padding: 68px 20px; }
  .board-panel, .product-card, .profile-photo, .defense-figure { border-radius: 20px; }
  .contact { width: calc(100% - 16px); margin: 8px auto 42px; padding: 42px 22px; border-radius: 22px; }
}

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