/* pcd-base.css — Pulsecadence base styles, CSS custom properties, resets */

:root {
  /* Palette */
  --pcd-bg-dark:          #0A0E1A;
  --pcd-bg-dark-alt:      #111827;
  --pcd-bg-dark-surface:  #1A2236;
  --pcd-bg-dark-card:     #1E2A40;
  --pcd-bg-light:         #F4F7FB;
  --pcd-bg-light-alt:     #EBF0F8;
  --pcd-bg-white:         #FFFFFF;

  --pcd-accent:           #00D4FF;
  --pcd-accent-on-light:  #006F8A;
  --pcd-accent-warn:      #F59E0B;
  --pcd-accent-ok:        #22D3A0;
  --pcd-accent-critical:  #F43F5E;

  --pcd-fg-dark-primary:   #F0F4FF;
  --pcd-fg-dark-secondary: #94A3B8;
  --pcd-fg-dark-muted:     #60748F;
  --pcd-fg-light-primary:  #0A0E1A;
  --pcd-fg-light-secondary:#374560;
  --pcd-fg-light-muted:    #6B7A99;

  --pcd-border-dark:  #2A3550;
  --pcd-border-light: #D1D9E8;

  /* Typography */
  --pcd-font-sans: Inter, system-ui, sans-serif;
  --pcd-font-mono: 'JetBrains Mono', 'Fira Code', Consolas, monospace;

  /* Spacing */
  --pcd-container: 1200px;
  --pcd-gap:       24px;
  --pcd-radius:    8px;
  --pcd-radius-lg: 12px;
}

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

html { scroll-behavior: smooth; }

body {
  font-family: var(--pcd-font-sans);
  font-size: 15px;
  line-height: 1.65;
  background: var(--pcd-bg-dark);
  color: var(--pcd-fg-dark-primary);
  -webkit-font-smoothing: antialiased;
}

body.pcd-page--light-top {
  background: var(--pcd-bg-white);
  color: var(--pcd-fg-light-primary);
}

/* Typography base */
h1, h2, h3, h4, h5, h6 { line-height: 1.2; font-weight: 700; letter-spacing: -0.02em; }
h1 { font-size: clamp(36px, 5vw, 56px); }
h2 { font-size: clamp(28px, 3.5vw, 36px); }
h3 { font-size: clamp(20px, 2.5vw, 24px); }
h4 { font-size: 18px; }
h5 { font-size: 16px; }

p { margin-bottom: 1em; }
p:last-child { margin-bottom: 0; }

a { color: inherit; text-decoration: none; }

ul { list-style: none; }

img { display: block; max-width: 100%; height: auto; }

/* Monospace nums */
.pcd-mono {
  font-family: var(--pcd-font-mono);
  font-variant-numeric: tabular-nums;
}

/* Container */
.pcd-container {
  max-width: var(--pcd-container);
  margin: 0 auto;
  padding: 0 clamp(16px, 5vw, 48px);
}

/* Section rhythm */
.pcd-section {
  padding: clamp(64px, 8vw, 112px) 0;
}
.pcd-section--tight {
  padding: clamp(40px, 5vw, 64px) 0;
}

/* Section bg variants */
.pcd-section--dark {
  background: var(--pcd-bg-dark);
  color: var(--pcd-fg-dark-primary);
}
.pcd-section--dark-alt {
  background: var(--pcd-bg-dark-alt);
  color: var(--pcd-fg-dark-primary);
}
.pcd-section--dark-surface {
  background: var(--pcd-bg-dark-surface);
  color: var(--pcd-fg-dark-primary);
}
.pcd-section--light {
  background: var(--pcd-bg-light);
  color: var(--pcd-fg-light-primary);
}
.pcd-section--light-alt {
  background: var(--pcd-bg-light-alt);
  color: var(--pcd-fg-light-primary);
}
.pcd-section--white {
  background: var(--pcd-bg-white);
  color: var(--pcd-fg-light-primary);
}

/* Eyebrow label */
.pcd-eyebrow {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.pcd-section--dark .pcd-eyebrow,
.pcd-section--dark-alt .pcd-eyebrow,
.pcd-section--dark-surface .pcd-eyebrow {
  color: var(--pcd-accent);
}
.pcd-section--light .pcd-eyebrow,
.pcd-section--light-alt .pcd-eyebrow,
.pcd-section--white .pcd-eyebrow {
  color: var(--pcd-accent-on-light);
}

/* Headings on sections */
.pcd-section--dark h1,
.pcd-section--dark h2,
.pcd-section--dark h3,
.pcd-section--dark h4,
.pcd-section--dark-alt h1,
.pcd-section--dark-alt h2,
.pcd-section--dark-alt h3,
.pcd-section--dark-alt h4,
.pcd-section--dark-surface h1,
.pcd-section--dark-surface h2,
.pcd-section--dark-surface h3,
.pcd-section--dark-surface h4 {
  color: var(--pcd-fg-dark-primary);
}

.pcd-section--light h1,
.pcd-section--light h2,
.pcd-section--light h3,
.pcd-section--light h4,
.pcd-section--light-alt h1,
.pcd-section--light-alt h2,
.pcd-section--light-alt h3,
.pcd-section--light-alt h4,
.pcd-section--white h1,
.pcd-section--white h2,
.pcd-section--white h3,
.pcd-section--white h4 {
  color: var(--pcd-fg-light-primary);
}

/* Paragraph / body text on sections */
.pcd-section--dark p,
.pcd-section--dark li,
.pcd-section--dark-alt p,
.pcd-section--dark-alt li,
.pcd-section--dark-surface p,
.pcd-section--dark-surface li {
  color: var(--pcd-fg-dark-secondary);
}
.pcd-section--light p,
.pcd-section--light li,
.pcd-section--light-alt p,
.pcd-section--light-alt li,
.pcd-section--white p,
.pcd-section--white li {
  color: var(--pcd-fg-light-secondary);
}

/* Links on sections */
.pcd-section--dark a:not([class]),
.pcd-section--dark-alt a:not([class]),
.pcd-section--dark-surface a:not([class]) {
  color: var(--pcd-accent);
  text-decoration: underline;
}
.pcd-section--light a:not([class]),
.pcd-section--light-alt a:not([class]),
.pcd-section--white a:not([class]) {
  color: var(--pcd-accent-on-light);
  text-decoration: underline;
}

/* Fade-in animation */
.pcd-fade-in {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.pcd-fade-in.is-visible {
  opacity: 1;
  transform: none;
}

/* Responsive helpers */
@media (max-width: 768px) {
  .pcd-hide-mobile { display: none !important; }
}
@media (min-width: 769px) {
  .pcd-hide-desktop { display: none !important; }
}
