/*
Theme Name: CyberWave
Theme URI: https://cyberwave.ca
Author: CyberWave
Author URI: https://cyberwave.ca
Description: CyberWave advisory, Sentinel, and Academy website theme.
Version: 1.0.5
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: cyberwave
*/

html,
body {
  margin: 0;
  padding: 0;
}

body.cyberwave-app {
  overflow-x: clip;
}

body.cyberwave-app #root {
  min-width: 0;
  min-height: 100vh;
  overflow-x: clip;
}

body.cyberwave-app #root,
body.cyberwave-app #root *,
body.cyberwave-app #root *::before,
body.cyberwave-app #root *::after {
  box-sizing: border-box;
}

body.cyberwave-app #root {
  font-family: var(--font-body) !important;
}

body.cyberwave-app #root :is(h1, h2, h3) {
  font-family: var(--font-display) !important;
  font-weight: 650 !important;
  letter-spacing: -0.025em !important;
}

/* WordPress plugins and page builders often add late global heading styles. */
body.cyberwave-app #root .section--dark,
body.cyberwave-app #root .page-hero--dark,
body.cyberwave-app #root .guidance-half--dark,
body.cyberwave-app #root .hero {
  color: var(--paper) !important;
}

body.cyberwave-app #root .section--dark :is(h1, h2, h3),
body.cyberwave-app #root .page-hero--dark :is(h1, h2, h3),
body.cyberwave-app #root .guidance-half--dark :is(h1, h2, h3),
body.cyberwave-app #root .hero :is(h1, h2, h3) {
  color: inherit !important;
}

body.cyberwave-app #root .hero-copy h1 {
  max-width: 720px !important;
  font-size: clamp(3.15rem, 5vw, 5.1rem) !important;
  line-height: 1.04 !important;
}

body.cyberwave-app #root .wordmark,
body.cyberwave-app #root .wordmark:visited {
  color: var(--ink) !important;
  font-weight: 700 !important;
}

body.cyberwave-app #root .page-hero-copy h1 {
  max-width: 980px !important;
  font-size: clamp(3.15rem, 4.8vw, 4.9rem) !important;
  line-height: 1.03 !important;
}

body.cyberwave-app #root .sentinel-page-hero {
  grid-template-columns: minmax(0, 0.85fr) minmax(540px, 1.15fr);
  gap: clamp(2.5rem, 5vw, 5rem);
}

body.cyberwave-app #root .sentinel-page-hero h1 {
  max-width: 650px !important;
  font-size: clamp(3.05rem, 4.35vw, 4.55rem) !important;
  line-height: 1.04 !important;
  overflow-wrap: break-word;
}

body.cyberwave-app #root .academy-hero h1 {
  max-width: 760px !important;
  font-size: clamp(3.1rem, 4.6vw, 4.85rem) !important;
  line-height: 1.04 !important;
}

body.cyberwave-app #root .solution-path h3,
body.cyberwave-app #root .workflow-steps h3,
body.cyberwave-app #root .engagement-flow h3,
body.cyberwave-app #root .capability-grid h2 {
  font-size: 1.5rem !important;
  line-height: 1.15 !important;
}

@media (max-width: 1120px) {
  body.cyberwave-app #root .sentinel-page-hero {
    grid-template-columns: 1fr;
  }
}

body.cyberwave-app #root .outcome-item h2 {
  max-width: 250px !important;
  font-size: clamp(1.3rem, 2vw, 1.7rem) !important;
  line-height: 1.08 !important;
}

body.cyberwave-app #root .guidance-content h2 {
  font-size: clamp(2.5rem, 3.7vw, 3.9rem) !important;
}

body.cyberwave-app #root .sentinel-story-copy h2 {
  font-size: clamp(2.7rem, 4vw, 4.35rem) !important;
}

body.cyberwave-app #root .final-cta h2 {
  font-size: clamp(2rem, 4vw, 4rem) !important;
}

body.cyberwave-app #root button.mode-tab {
  min-width: 0;
  min-height: 150px;
  border: 0;
  border-right: 1px solid rgba(216, 228, 233, 0.22);
  border-radius: 0;
  background: transparent !important;
  color: inherit !important;
  box-shadow: none;
  font: inherit;
}

body.cyberwave-app #root button.mode-tab strong,
body.cyberwave-app #root button.mode-tab span {
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
}

body.cyberwave-app #root .sentinel-modes-section .section-heading h2 {
  max-width: 960px !important;
  font-size: clamp(2.35rem, 3.5vw, 3.45rem) !important;
}

body.cyberwave-app #root button.mode-tab--active {
  background: rgba(17, 184, 166, 0.08) !important;
  box-shadow: inset 0 3px 0 var(--teal);
}

body.cyberwave-app #root .button--ghost {
  color: var(--mint) !important;
}

body.cyberwave-app #root .site-footer .footer-group h2 {
  margin: 0 0 0.35rem !important;
  color: var(--ink) !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  white-space: nowrap;
}

body.cyberwave-app #root .site-footer .footer-group a {
  font-size: 0.9rem !important;
  line-height: 1.5 !important;
}

@media (max-width: 800px) {
  body.cyberwave-app #root .hero-copy h1 {
    font-size: clamp(2.75rem, 13vw, 4.25rem) !important;
  }

  body.cyberwave-app #root button.mode-tab {
    min-height: auto;
    border-right: 0;
  }

  body.cyberwave-app #root .page-hero-copy h1,
  body.cyberwave-app #root .sentinel-page-hero h1,
  body.cyberwave-app #root .academy-hero h1 {
    font-size: clamp(2.75rem, 13vw, 4.25rem) !important;
  }
}