/* CoCreate base — Vedics design system.
   Loaded AFTER tokens.css. Sets body color/bg + heading defaults +
   the .eyebrow and .stat-number utilities that the homepage uses. */

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-primary);
  background: var(--bg-primary);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
  transition: background var(--transition-speed) ease, color var(--transition-speed) ease;
}

img, picture, video, canvas, svg { display: block; max-width: 100%; }
input, button, textarea, select { font: inherit; color: inherit; }
button { background: none; border: 0; cursor: pointer; }
a { color: inherit; text-decoration: none; }

a:focus-visible, button:focus-visible, [tabindex]:focus-visible {
  outline: none;
  box-shadow: var(--sh-focus);
  border-radius: var(--r-sm);
}

h1, h2, h3, h4, h5, h6, .font-display {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: var(--track-tight);
}
h1, .h-1 {
  font-weight: 700;
  font-size: clamp(2.25rem, 5vw, 4.5rem);
  line-height: 1.05;
  letter-spacing: var(--track-display);
}
h2, .h-2 {
  font-size: clamp(1.75rem, 3.5vw, 3rem);
  line-height: 1.1;
}
h3, .h-3 {
  font-size: 1.4rem;
  line-height: 1.25;
}
h4, .h-4 {
  font-size: 1.05rem;
  font-weight: 500;
  letter-spacing: -0.01em;
}

p { line-height: var(--lh-normal); }

.eyebrow {
  display: inline-block;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--fs-caption);
  letter-spacing: var(--track-eyebrow);
  text-transform: uppercase;
  color: var(--accent);
}

.stat-number {
  font-family: var(--font-stat);
  font-weight: 700;
  background: var(--grad-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

::selection { background: var(--accent); color: var(--cc-ink); }

/* ---- Text legibility over the cinematic photo backdrop ----
   The cc-bg-fixed::after scrim is directional (dark left/top, transparent
   middle/right), so bright peach photo regions show through where bare text
   (text not inside a .cc-card) sits in section content. Text inside .cc-card
   has its own dark glass background and reads fine; "bare" text needs a
   scrim shadow to read.

   Hero text (page-hero__h1/sub) is one such region. Below it, the section
   eyebrows + h2s + ledes + bullets/list-items live directly on the photo.
   Apply the scrim to all bare text on cc-bg-fixed pages. */

/* Hero text */
.cc-bg-fixed .page-hero__sub {
  color: rgba(255, 255, 255, 0.92);
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.55), 0 1px 2px rgba(0, 0, 0, 0.35);
}
.cc-bg-fixed .page-hero__h1 {
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.45);
}

/* All bare text inside <section> on cc-bg-fixed pages (excluding text inside
   .cc-card) gets a soft text-shadow scrim so it reads against bright photo
   regions. Card-internal text is excluded by :not(.cc-card *) because cards
   have their own dark glass backdrop and don't need the scrim.

   Covers both markup styles in use across the site:
   - Wave-B Tier-1 pages: <p class="eyebrow section__eyebrow-c">, <h2 class="section__h2-c">
   - Wave-C tail pages (culture, careers, investors, etc.) and homepage hybrid:
     Tailwind utilities like <p class="text-sm tracking-widest uppercase"> with
     inline style="color: var(--accent)" and <h2 class="text-3xl font-display"> */
.cc-bg-fixed section :is(h1, h2, h3, h4, h5, h6, p, li, strong, blockquote):not(.cc-card):not(.cc-card *):not(.page-hero__h1):not(.page-hero__sub) {
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.55), 0 1px 2px rgba(0, 0, 0, 0.35);
}

/* Brighten body-text color utilities to near-white when they sit on the photo
   backdrop. Inside cards these classes keep their dim color (intentional). */
.cc-bg-fixed section .lede:not(.cc-card *),
.cc-bg-fixed section .text-theme-secondary:not(.cc-card *),
.cc-bg-fixed section [class*="text-theme-muted"]:not(.cc-card *) {
  color: rgba(255, 255, 255, 0.92);
}