/* IPGS — Mapeamento de Aptidões · Direct Response · tokens v2 */
:root {
  --ipgs-deep:  #062947;
  --ipgs-gold:  #c69c50;
  --ipgs-mint:  #abf9c6;
  --ipgs-paper: #f1f1f1;
  --ipgs-ink:   #0a0a0a;

  --deep-50:  oklch(0.97 0.012 240);
  --deep-100: oklch(0.93 0.025 240);
  --deep-200: oklch(0.85 0.045 240);
  --deep-300: oklch(0.74 0.065 240);
  --deep-500: oklch(0.46 0.095 240);
  --deep-700: oklch(0.28 0.075 240);
  --deep-800: oklch(0.22 0.060 240);
  --deep-900: oklch(0.18 0.050 240);

  --gold-300: oklch(0.82 0.080 80);
  --gold-500: oklch(0.71 0.105 80);
  --gold-700: oklch(0.52 0.080 76);

  --mint-200: oklch(0.93 0.075 150);
  --mint-700: oklch(0.50 0.090 150);

  --paper-100: #f5f5f3;
  --paper-200: #f1f1f1;
  --paper-300: #e7e7e5;
  --ink-900: #0a0a0a;

  --font-display: "Instrument Serif", Georgia, serif;
  --font-sans:    "Geist", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --r-md: 14px;
  --r-lg: 22px;

  --shadow-sm: 0 1px 2px rgba(6,41,71,.06);
  --shadow-md: 0 8px 24px -8px rgba(6,41,71,.18), 0 2px 6px rgba(6,41,71,.06);
  --shadow-lg: 0 24px 60px -20px rgba(6,41,71,.30);
  --shadow-gold: 0 30px 80px -30px rgba(198,156,80,.55);
}

* { box-sizing: border-box; }
html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink-900);
  background: var(--ipgs-paper);
}
::selection { background: var(--ipgs-mint); color: var(--ipgs-deep); }

img, video, svg { max-width: 100%; display: block; }

.serif { font-family: var(--font-display); font-style: italic; font-weight: 400; }
.mono  { font-family: var(--font-mono); }

.container-x {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}
@media (min-width: 720px) { .container-x { padding: 0 32px; } }

/* sections */
section { padding: 64px 0; position: relative; }
@media (min-width: 720px) { section { padding: 96px 0; } }

/* eyebrow */
.eyebrow {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-700);
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.eyebrow::before {
  content: "";
  width: 22px; height: 1px;
  background: var(--ipgs-gold);
}
.dark .eyebrow { color: var(--gold-300); }
.dark .eyebrow::before { background: var(--ipgs-gold); }

/* CTA — único, repetido em toda página */
.cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 18px 26px;
  border-radius: 999px;
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: 16px;
  letter-spacing: -0.005em;
  cursor: pointer;
  border: none;
  background: var(--ipgs-gold);
  color: var(--ipgs-deep);
  text-decoration: none;
  transition: transform .18s cubic-bezier(.2,.7,.2,1), box-shadow .25s, background .2s;
  box-shadow: 0 14px 30px -12px rgba(198,156,80,.55), inset 0 1px 0 rgba(255,255,255,.18);
  text-align: center;
  line-height: 1.2;
  will-change: transform;
}
.cta:hover, .cta:focus-visible {
  background: #d6ad62;
  box-shadow: 0 18px 38px -12px rgba(198,156,80,.65), 0 0 0 4px rgba(198,156,80,.20);
}
.cta .arrow { display: inline-block; transition: transform .25s; }
.cta:hover .arrow { transform: translateX(4px); }

.cta--full { width: 100%; }
.cta--lg   { padding: 22px 32px; font-size: 18px; }

/* focus */
:focus-visible {
  outline: 2px solid var(--ipgs-gold);
  outline-offset: 3px;
  border-radius: 4px;
}

/* noise grain */
.grain { position: relative; }
.grain::after {
  content: "";
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  opacity: .045;
  mix-blend-mode: multiply;
  pointer-events: none;
  z-index: 1;
}
.dark.grain::after { mix-blend-mode: screen; opacity: .07; }

/* dark sections */
.dark { background: var(--ipgs-deep); color: var(--ipgs-paper); }

/* placeholders */
.ph {
  position: relative;
  background:
    repeating-linear-gradient(135deg, rgba(6,41,71,.06) 0 1px, transparent 1px 14px),
    var(--paper-100);
  border: 1px dashed rgba(6,41,71,.22);
  border-radius: var(--r-md);
  display: flex; align-items: center; justify-content: center;
  color: var(--deep-700);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.dark .ph {
  background:
    repeating-linear-gradient(135deg, rgba(241,241,241,.07) 0 1px, transparent 1px 14px),
    rgba(255,255,255,.02);
  border-color: rgba(241,241,241,.18);
  color: rgba(241,241,241,.72);
}

/* reveal */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  animation: reveal-in .9s cubic-bezier(.2,.7,.2,1) forwards;
  animation-timeline: view();
  animation-range: entry 0% cover 25%;
}
@keyframes reveal-in {
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; animation: none; }
  html { scroll-behavior: auto; }
}

/* display headline */
.display {
  font-family: var(--font-sans);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.0;
  font-size: clamp(34px, 6.4vw, 64px);
  color: var(--ipgs-deep);
  margin: 0;
  text-wrap: balance;
}
.display em {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  color: var(--gold-700);
}
.dark .display { color: var(--ipgs-paper); }
.dark .display em { color: var(--ipgs-mint); }

/* body */
.lede {
  font-size: 17px;
  line-height: 1.55;
  color: var(--deep-800);
  max-width: 50ch;
}
.dark .lede { color: rgba(241,241,241,.78); }
@media (min-width: 720px) { .lede { font-size: 18.5px; } }