/* css/division-pages.css
   One-accent system: every division carries the core brand orange.
   (Former per-division palette retired with the 2026 redesign; the
   per-page .page-* overrides collapsed with it.) */

.division-page-content {
  padding-bottom: var(--space-l);
}

.division-hero .eyebrow {
  margin-left: auto;
  margin-right: auto;
}

.division-tagline {
  font-family: var(--mono-font, monospace);
  font-size: 0.9rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--dark-ui);
  margin: 0 auto;
}

/* Hero section for the division page */
.division-hero {
  text-align: center;
  padding: var(--space-l) 0 var(--space-xl) 0; /* More padding at bottom */
  margin-bottom: var(--space-xl);
  position: relative; /* For pseudo-element background */
}

/* Subtle brand wash behind every division hero */
.division-hero::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--primary-accent);
  opacity: 0.05; /* Very subtle */
  z-index: -1;
}

.division-hero-icon {
  max-width: 40%;
  margin: 0 auto var(--space-m) auto;
}

.division-main-title {
  font-family: var(--heading-font);
  font-size: clamp(2.8rem, 7vw, 4.2rem);
  font-weight: 700;
  color: var(--primary-accent);
  /* No uppercase transform: titles are brand wordmarks (STRATEGY.design) —
     the caps prefix is in the source, ".design" stays lowercase */
  margin-bottom: var(--space-s);
  line-height: 1.1;
}

/* Styling for sub-section titles like Overview, Expertise */
.section-title-alt {
  font-family: var(--heading-font);
  font-size: clamp(
    1.8rem,
    5vw,
    2.5rem
  ); /* Slightly smaller than .section-title */
  color: var(--dark-ui);
  margin-bottom: var(--space-m);
  padding-bottom: var(--space-s); /* Increased padding */
  border-bottom: 3px solid var(--primary-accent); /* Make border more prominent */
  display: inline-block;
  text-transform: uppercase; /* Match main page section titles */
  letter-spacing: 1px; /* Match main page section titles */
}

.division-overview,
.division-expertise,
.division-approach,
.division-cta-section {
  /* Renamed for clarity */
  padding: var(--space-l) 0;
}

.division-overview .container,
.division-expertise .container,
.division-approach .container {
  max-width: 800px; /* Constrain content width for readability */
  margin-left: auto;
  margin-right: auto;
}

.division-overview p,
.division-approach p {
  font-size: var(--font-size-lg);
  line-height: 1.7; /* Increased line height for readability */
  color: #333; /* Slightly softer black */
}

.division-expertise ul {
  list-style: none;
  padding-left: 0;
  margin-top: var(--space-s);
}

.division-expertise ul li {
  font-size: var(--font-size-lg);
  line-height: 1.7;
  color: #333;
  margin-bottom: var(--space-m); /* More spacing between items */
  padding-left: calc(var(--space-m) + 5px); /* Space for icon + gap */
  position: relative;
}

.division-expertise ul li::before {
  content: "✓"; /* Checkmark as default */
  position: absolute;
  left: 0;
  top: 5px; /* Adjust vertical alignment */
  font-weight: bold;
  font-size: var(--font-size-lg);
  color: var(--primary-accent);
}

/* Call to Action Section */
.division-cta-section {
  text-align: center;
  background-color: var(--light-grey);
  margin-top: var(--space-xl);
  padding: var(--space-xl) 0; /* More padding */
}

.division-cta-section h2 {
  /* Using existing h2 style, can be .section-title-alt if preferred */
  font-size: clamp(1.8rem, 5vw, 2.5rem);
  color: var(--primary-accent); /* Use main brand accent for CTA title */
  margin-bottom: var(--space-s);
}
.division-cta-section p {
  font-size: var(--font-size-lg);
  color: var(--dark-ui);
  margin-bottom: var(--space-l);
  max-width: 60ch;
  margin-left: auto;
  margin-right: auto;
}

.division-cta-section .btn-primary {
  /* Reusing a common button class name */
  display: inline-block;
  padding: var(--space-m) var(--space-xl); /* Larger padding */
  background-color: var(--primary-accent);
  color: var(--dark-ui); /* ink-on-orange: AA-safe */
  border: 2px solid transparent;
  border-radius: var(--border-radius);
  font-family: var(--heading-font);
  font-size: var(--font-size-lg);
  font-weight: 700;
  text-transform: uppercase;
  cursor: pointer;
  text-decoration: none;
  transition: background-color 0.3s ease, color 0.3s ease,
    border-color 0.3s ease;
}

.division-cta-section .btn-primary:hover {
  background-color: var(--secondary-accent);
  color: var(--light-ui);
  border-color: var(--secondary-accent);
}

/* Responsive adjustments for division pages */
@media (min-width: 768px) {
  .division-page-content {
    padding-bottom: var(--space-xl);
  }

  .division-hero-icon {
    max-width: 20%; /* Slightly larger on desktop */
  }
}

/* (Inquiry bubble styles live in store.css) */