/* ==========================================================================
   Cyber Arsenals — Unified Design System
   White + Red theme · Professional typography · Clean layout
   ========================================================================== */

:root {
  /* Brand palette */
  --ca-red: #c8102e;
  --ca-red-dark: #9b0c24;
  --ca-red-light: #fef2f4;
  --ca-red-muted: rgba(200, 16, 46, 0.12);

  --ca-white: #ffffff;
  --ca-off-white: #fafafa;
  --ca-gray-50: #f5f5f5;
  --ca-gray-100: #ebebeb;
  --ca-gray-200: #d4d4d4;
  --ca-gray-600: #525252;
  --ca-gray-800: #262626;
  --ca-gray-900: #171717;

  --ca-text: #171717;
  --ca-text-secondary: #525252;
  --ca-text-muted: #737373;
  --ca-border: #e5e5e5;

  /* Override legacy dark tokens used across page CSS */
  --ca-bg-dark: var(--ca-white);
  --ca-bg-dark-elevated: var(--ca-off-white);
  --ca-navbar-bg: rgba(255, 255, 255, 0.97);
  --ca-navbar-text: var(--ca-text);
  --ca-navbar-active: var(--ca-red);
  --ca-navbar-cta-bg: var(--ca-red);
  --ca-navbar-cta-fg: var(--ca-white);
  --ca-hero-banner-bg: var(--ca-white);
  --ca-hero-banner-accent: var(--ca-red);
  --ca-border-light: var(--ca-border);
  --ca-text-muted-legacy: var(--ca-text-secondary);

  --cyber-red: var(--ca-red);
  --cyber-red-soft: #fecdd3;
  --cyber-dark: var(--ca-white);
  --cyber-dark-2: var(--ca-off-white);
  --cyber-black: var(--ca-text);
  --cyber-light: var(--ca-off-white);
  --cyber-light-line: var(--ca-border);
  --cyber-light-muted: var(--ca-text-secondary);
  --cyber-muted: var(--ca-text-secondary);
  --cyber-line: var(--ca-border);
  --cyber-panel: var(--ca-off-white);

  --legal-red: var(--ca-red);
  --legal-dark: var(--ca-white);
  --df-dark: var(--ca-white);
  --tr-dark: var(--ca-white);
  --insights-dark: var(--ca-white);
  --article-dark: var(--ca-white);
  --products-shield-navy: var(--ca-text);

  --ca-font-heading: "Plus Jakarta Sans", system-ui, sans-serif;
  --ca-font-body: "Source Sans 3", system-ui, sans-serif;
}

/* ——— Base ——— */
html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--ca-font-body) !important;
  color: var(--ca-text) !important;
  background-color: var(--ca-white) !important;
  text-align: left;
  -webkit-font-smoothing: antialiased;
}

/* No `text-align` here on purpose: a directly-declared value on the heading
   itself would beat any `text-align: center` set on a centered-content
   wrapper further up the tree (direct rules always win over inherited
   ones, regardless of specificity) — that silently broke every
   intentionally-centered heading site-wide. Let alignment inherit from
   each section's own wrapper instead. */
h1, h2, h3, h4, h5, h6,
.ca-navbar-brand-text,
.cybersecurity-hero h1,
.cybersecurity-section-heading h2 {
  font-family: var(--ca-font-heading) !important;
  color: var(--ca-text) !important;
}

p, li, span, a, label, input, select, textarea, button {
  text-align: inherit;
}

/* Consistent content alignment */
.ca-hero-banner-inner,
.ca-who-we-are-inner,
.ca-partners-inner,
.ca-products-inner,
.ca-services-inner,
.ca-faq-inner,
.ca-home-contact-inner,
.cybersecurity-hero-inner,
.cybersecurity-commitment-inner,
.cybersecurity-section-inner,
.cybersecurity-cta-inner,
.about-hero-inner,
.about-shell,
.legal-shell,
.products-ref-container,
.df-shell,
.tr-shell,
.contact-hero-inner,
.contact-inquiry-inner,
.training-hero-inner,
.reg-inner,
.blog-hero-inner,
.article-inner,
.service-detail-inner,
.ca-site-footer-inner {
  width: min(var(--ca-site-content-max, 1179px), calc(100% - 2 * var(--ca-site-gutter-x, 1.6rem)));
  margin-inline: auto;
  text-align: left;
}

/* ——— Hide decorative grids & patterns ——— */
.ca-hero-banner-grid,
.cybersecurity-hero-grid,
.cybersecurity-hero-line,
.cybersecurity-hero::before,
.about-hero-bg-grid,
.about-hero-bg-grid::before,
.legal-bg-grid,
.legal-grid,
.products-ref-grid,
.df-hud-grid,
.tr-grid-overlay,
.article-grid-overlay,
.services-modern .grid-bg,
.ca-site-footer-bg-boxes,
.loader-particles {
  display: none !important;
}

/* ——— Hide decorative label pills/badges ——— */
.cybersecurity-pill,
.cybersecurity-small-pill,
.ca-hero-banner-badge,
.ca-who-we-are-badge,
.ca-partners-badge,
.ca-products-badge,
.ca-services-badge,
.ca-faq-badge,
.about-pill,
.about-partners-pill,
.about-vision-pill,
.about-team-pill,
.about-case-pill,
.about-innovations-pill,
.about-ceo-pill,
.about-advantages-pill,
.legal-live-badge,
.df-hero-badge,
.tr-hero-badge,
.services-hero-pill,
.services-showcase-pill,
.contact-inquiry-pill,
.insights-badge,
.ai-priority-badge,
.ai-software-badge,
.training-hero-pill,
.cybersecurity-section-heading > span:first-child:not(h2):not(h3) {
  display: none !important;
}

/* Hide decorative hero orbit graphics */
.cybersecurity-hero-visual,
.cybersecurity-orbit,
.cybersecurity-orbit-dot {
  display: none !important;
}

/* ——— Navbar ——— */
.ca-navbar {
  background: var(--ca-navbar-bg) !important;
  color: var(--ca-text) !important;
  border-bottom: 1px solid var(--ca-border) !important;
  box-shadow: 0 1px 12px rgba(0, 0, 0, 0.06) !important;
}

.ca-navbar,
.ca-navbar-brand-text,
.ca-navbar-link,
.ca-navbar-dropdown-menu a,
.ca-navbar-submenu a,
.ca-navbar-cta-text {
  font-family: 'Roboto', 'Poppins', sans-serif !important;
}

.ca-navbar::after {
  background: linear-gradient(90deg, transparent 4%, var(--ca-red) 50%, transparent 96%) !important;
  opacity: 0.35 !important;
}

.ca-navbar-brand,
.ca-navbar-link {
  color: var(--ca-text) !important;
}

.ca-navbar-link:hover,
.ca-navbar-link:focus-visible,
.ca-navbar-link-active {
  color: var(--ca-red) !important;
}

.ca-navbar-nav {
  background: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 1023.9px) {
  .ca-navbar-open .ca-navbar-nav {
    background: #ffffff !important;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08) !important;
  }
}

.ca-navbar-dropdown-menu a,
.ca-navbar-submenu a {
  color: #171717 !important;
}

.ca-navbar-dropdown-menu a:hover,
.ca-navbar-submenu a:hover {
  color: #c8102e !important;
}

.ca-navbar-brand-text {
  color: var(--ca-text) !important;
}

.ca-navbar-cta-button {
  background: var(--ca-red) !important;
  color: var(--ca-white) !important;
  border: 1px solid var(--ca-red) !important;
}

.ca-navbar-cta-button:hover {
  background: var(--ca-red-dark) !important;
  border-color: var(--ca-red-dark) !important;
}

.ca-navbar-toggle-line {
  background: var(--ca-text) !important;
}

/* ——— Footer ——— */
.ca-site-footer {
  background: var(--ca-gray-900) !important;
  color: var(--ca-white) !important;
  border-top: 3px solid var(--ca-red) !important;
}

.ca-site-footer-heading {
  color: var(--ca-white) !important;
}

.ca-site-footer a {
  color: rgba(255, 255, 255, 0.82) !important;
}

.ca-site-footer a:hover {
  color: var(--ca-red-soft) !important;
}

.ca-site-footer-email {
  color: var(--ca-white) !important;
}

/* ——— Hero sections (all pages) ——— */
.ca-hero-banner,
.cybersecurity-hero,
.about-hero,
.legal-hero,
.products-ref-hero,
.df-training-hero,
.tr-hero,
.contact-hero,
.training-hero,
.reg-hero,
.blog-hero,
.article-hero,
.service-detail-hero {
  background: var(--ca-white) !important;
  color: var(--ca-text) !important;
}

.cybersecurity-hero {
  background: linear-gradient(180deg, var(--ca-white) 0%, var(--ca-off-white) 100%) !important;
  min-height: auto !important;
  padding-block: clamp(3rem, 8vw, 5rem);
}

.cybersecurity-page,
.ai-service-page {
  background: var(--ca-white) !important;
  color: var(--ca-text) !important;
}

.cybersecurity-hero-inner {
  grid-template-columns: 1fr !important;
  gap: 2rem !important;
  padding: 2rem 0 !important;
}

.cybersecurity-hero h1 {
  color: var(--ca-text) !important;
  font-size: clamp(2rem, 5vw, 3.25rem) !important;
  line-height: 1.15 !important;
  margin-top: 0 !important;
}

.cybersecurity-hero h1 span,
.cybersecurity-hero h1 strong {
  background: none !important;
  -webkit-text-fill-color: var(--ca-text) !important;
  color: var(--ca-text) !important;
}

.cybersecurity-hero h1 strong {
  color: var(--ca-red) !important;
  -webkit-text-fill-color: var(--ca-red) !important;
}

.cybersecurity-hero p {
  color: var(--ca-text-secondary) !important;
  max-width: 640px;
  line-height: 1.65 !important;
}

/* Home hero — intentionally a full-bleed dark video with white text overlay,
   like the footer, this is a deliberate dark "spotlight" section, not an
   oversight; do not force it into the light/dark-text pattern used elsewhere.
   The blanket `h1, h2, h3...{ color: var(--ca-text) !important }` rule above
   still matches this heading (it's an h1/h2), so it must be re-overridden
   here with a more specific selector, or the hero title goes invisible. */
.ca-hero-banner-title,
.ca-hero-banner-title-line {
  color: #ffffff !important;
}

/* Full-bleed red CTA banners (Digital Forensics + Legal pages) — same
   deliberate-dark-section case as the hero above. Without this, the
   blanket h1-h6 rule forces these headings to near-black, which reads
   as illegible/off-brand text sitting on top of the same red used
   everywhere else on the site with white type. */
.forensic-cta h2,
.legal-crisis h2 {
  color: #ffffff !important;
}

.ca-hero-banner-accent-line {
  background: var(--ca-red) !important;
}

/* ——— Buttons ——— */
.cybersecurity-primary-btn,
.ca-navbar-cta-button,
.ca-home-contact-submit,
.contact-inquiry-submit,
.reg-submit-btn,
.training-cta-btn,
.df-primary-btn,
.tr-primary-btn {
  background: var(--ca-red) !important;
  color: var(--ca-white) !important;
  border: 1px solid var(--ca-red) !important;
}

.cybersecurity-primary-btn:hover,
.ca-home-contact-submit:hover,
.contact-inquiry-submit:hover,
.reg-submit-btn:hover {
  background: var(--ca-red-dark) !important;
  border-color: var(--ca-red-dark) !important;
}

.cybersecurity-secondary-btn,
.cybersecurity-ghost-btn {
  background: transparent !important;
  color: var(--ca-red) !important;
  border: 1px solid var(--ca-red) !important;
}

.cybersecurity-secondary-btn:hover {
  background: var(--ca-red-light) !important;
}

/* ——— Sections ——— */
.cybersecurity-commitment,
.cybersecurity-section,
.cybersecurity-section-light,
.cybersecurity-section-dark,
.cybersecurity-cta,
.ca-who-we-are,
.ca-partners,
.ca-products,
.ca-services,
.ca-faq,
.ca-home-contact,
.about-section,
.legal-section,
.products-ref-section,
.df-section,
.tr-section,
.contact-inquiry-section,
.training-section,
.blog-section {
  background: var(--ca-white) !important;
  color: var(--ca-text) !important;
}

.cybersecurity-section-dark,
.cybersecurity-cta,
.cybersecurity-commitment {
  background: var(--ca-off-white) !important;
}

.cybersecurity-section-light {
  background: var(--ca-white) !important;
}

.cybersecurity-commitment h2,
.cybersecurity-section-heading h2,
.ca-who-we-are-title,
.ca-partners-heading,
.ca-products-heading,
.ca-services-heading,
.ca-faq-heading,
.about-hero-title,
.legal-hero-title,
.products-hero-title,
.training-hero-title,
.contact-hero-title {
  color: var(--ca-text) !important;
}

.cybersecurity-commitment p,
.cybersecurity-section-heading p {
  color: var(--ca-text-secondary) !important;
}

/* Stat row */
.cybersecurity-stat-row article {
  background: var(--ca-white) !important;
  border: 1px solid var(--ca-border) !important;
  color: var(--ca-text) !important;
}

.cybersecurity-stat-row strong {
  color: var(--ca-red) !important;
}

.cybersecurity-stat-row span {
  color: var(--ca-text-secondary) !important;
}

/* Cards */
.cybersecurity-card,
.service-card,
.product-card,
.about-advantage-card,
.about-team-card,
.blog-card,
.course-card,
.legal-domain-card,
.products-ref-feature-card {
  background: var(--ca-white) !important;
  border: 1px solid var(--ca-border) !important;
  color: var(--ca-text) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04) !important;
}

.cybersecurity-card:hover,
.service-card:hover,
.blog-card:hover {
  border-color: var(--ca-red) !important;
  box-shadow: 0 8px 24px rgba(200, 16, 46, 0.08) !important;
}

.cybersecurity-card h3,
.service-card-title,
.feature-title {
  color: var(--ca-text) !important;
}

.cybersecurity-card p,
.service-card-description,
.feature-desc {
  color: var(--ca-text-secondary) !important;
}

/* Section red accent bar */
.ca-who-we-are-title::before,
.ca-services-heading::after,
.section-red-accent {
  background: var(--ca-red) !important;
}

/* Marquee */
.o-marquee {
  background: var(--ca-red) !important;
  color: var(--ca-white) !important;
}

/* FAQ */
.ca-faq-item {
  background: var(--ca-white) !important;
  border: 1px solid var(--ca-border) !important;
}

.ca-faq-question {
  color: var(--ca-text) !important;
}

.ca-faq-answer {
  color: var(--ca-text-secondary) !important;
}

/* Forms */
.contact-inquiry-input,
.contact-inquiry-textarea,
.contact-inquiry-select,
.reg-input,
.reg-textarea,
.reg-select,
.services-input {
  background: var(--ca-white) !important;
  border: 1px solid var(--ca-border) !important;
  border-radius: 8px !important;
  color: var(--ca-text) !important;
  padding: 14px 16px !important;
  min-height: 48px !important;
  box-sizing: border-box !important;
}

.contact-inquiry-textarea,
.reg-textarea {
  min-height: 120px !important;
}

.contact-inquiry-input:focus,
.reg-input:focus {
  border-color: var(--ca-red) !important;
  outline: 2px solid var(--ca-red-muted) !important;
}

/* About page */
.about-page,
.about-command-page {
  background: var(--ca-white) !important;
  color: var(--ca-text) !important;
}

.about-hero {
  background: var(--ca-white) !important;
}

/* Legal page */
.legal-page {
  background: var(--ca-white) !important;
  color: var(--ca-text) !important;
}

/* Products page */
.products-ref-page {
  background: var(--ca-white) !important;
  color: var(--ca-text) !important;
}

/* Training pages */
.training-main,
.training-registration-page {
  background: var(--ca-white) !important;
  color: var(--ca-text) !important;
}

/* Blog */
.insights-page,
.article-page {
  background: var(--ca-white) !important;
  color: var(--ca-text) !important;
}

/* Contact */
.contact-page {
  background: var(--ca-white) !important;
}

/* Back to top */
.ca-back-to-top {
  background: var(--ca-red) !important;
  border-color: var(--ca-red) !important;
  color: var(--ca-white) !important;
}

/* Loader */
#ca-loader {
  background: var(--ca-white) !important;
}

.loader-text {
  color: var(--ca-text) !important;
}

.loader-progress-inner {
  background: var(--ca-red) !important;
}

/* Links (excludes navbar/footer links and any button-styled anchor, so solid-red
   button-links keep their own white text instead of inheriting red-on-red) */
a:not(.ca-navbar-link):not(.ca-navbar-cta-button):not(.ca-site-footer a):not([class*="btn"]):not([class*="button"]):not([class*="-cta"]):not([class*="-submit"]):not([class*="text-white"]):not([class*="bg-alert-red"]):not([class*="bg-c8102e"]) {
  color: var(--ca-red);
}

a:not(.ca-navbar-link):not(.ca-navbar-cta-button):not([class*="btn"]):not([class*="button"]):not([class*="-cta"]):not([class*="-submit"]):not([class*="text-white"]):not([class*="bg-alert-red"]):not([class*="bg-c8102e"]):hover {
  color: var(--ca-red-dark);
}

/* Course badges (functional — restyle, don't hide) */
.course-badge {
  background: var(--ca-red-light) !important;
  color: var(--ca-red) !important;
  border: 1px solid rgba(200, 16, 46, 0.2) !important;
}

/* Hero dots (functional slider) */
.ca-hero-dot {
  background: var(--ca-gray-200) !important;
}

.ca-hero-dot.is-active {
  background: var(--ca-red) !important;
}

/* Service detail generic */
.service-detail-page {
  background: var(--ca-white) !important;
  color: var(--ca-text) !important;
}

.service-detail-title {
  color: var(--ca-text) !important;
}

.service-detail-desc {
  color: var(--ca-text-secondary) !important;
}

/* Digital forensic */
.digital-forensic-page,
.df-page {
  background: var(--ca-white) !important;
  color: var(--ca-text) !important;
}

/* Responsive typography tightening */
@media (max-width: 768px) {
  .cybersecurity-hero-inner {
    padding: 1.5rem 0 !important;
  }
}