/* ============================================================
   overA Capital — page: Carreiras (careers) — v6, DENSITY rebuild

   Why v6: v5 was rejected as "too big, not enough detail — look at how
   much detail igcp.com.br/carreiras has." Diagnosis was concrete: v5's
   stat numerals rendered at 112px, every .section carried 160px of
   vertical padding, and each section held only a handful of oversized
   elements floating in whitespace — the page was actually TALLER than
   IGC's yet read emptier.

   v6 keeps the winning concept (a two-founder table, "à mesa on day one")
   but rebuilds the EXECUTION for density, grounded in a research pass over
   IGC + offdeal + Evercore/PJT/Moelis/PWP + Linear/Ramp/Stripe + Qatalyst.
   The devices those pages use to feel rich, not big:
     · a tight labeled PROOF-METRIC strip (mid-size numeral + label + line),
       never a lonely giant number;
     · NUMBERED belief/principle rows — a manifesto packed onto one screen;
     · a DEEP two-founder block (go deep on the two we have, never fake a
       wall of faces) + a short founders' note;
     · a "what you'll actually do" mandate ledger paired with the real
       deal shelf + a text strip of real closed deals;
     · a densified numbered hiring ladder with sub-detail;
     · a candid FAQ accordion (native <details>, no JS, no scroll-reveal);
     · an honest "not for everyone" filter over the form.

   Scale is dialled DOWN and rhythm TIGHTENED via page-local token
   overrides (this file loads only on the carreiras mirrors, so redefining
   :root here is safe and page-scoped). Warm paper, one earned espresso
   band, terracotta rationed to one phrase per section + CTAs. Flat
   surfaces, hairlines, whitespace. Everything page-scoped under .car-.
   ============================================================ */

/* ---- page-local scale: smaller giant type, TIGHTER section rhythm.
   These win over tokens.css because this file is loaded after it and only
   on carreiras pages. The point of the whole rebuild lives here. ---- */
:root {
  --section-y:    clamp(3rem, 2.1rem + 3.6vw, 5.5rem);   /* was up to 160px -> ~85px */
  --section-y-lg: clamp(3.6rem, 2.4rem + 4.4vw, 6.5rem);
  --fs-stat:      clamp(2.6rem, 1.9rem + 2.4vw, 4.2rem); /* was up to 112px -> ~65px */
}
@media (min-width: 1700px) {
  :root {
    --section-y:    6.5rem;   /* was 11.5rem */
    --section-y-lg: 7.5rem;
    --fs-stat:      4.8rem;   /* was 8.1rem */
  }
}

/* ---- header over the paper hero: repaint the transparent nav in ink
   tones (matching the Transações / Blog siblings) until it solidifies ---- */
.site-header:not(.site-header--solid) .nav-links a { color: var(--ink-muted); opacity: 1; }
.site-header:not(.site-header--solid) .nav-links a:hover,
.site-header:not(.site-header--solid) .nav-links a.is-active { color: var(--ink); opacity: 1; }
.site-header:not(.site-header--solid) .nav-cta.btn--ghost { border-color: var(--line); color: var(--ink); }
.site-header:not(.site-header--solid) .nav-cta.btn--ghost:hover { background: var(--ink); color: var(--paper); }
.site-header:not(.site-header--solid) .nav-toggle span { background: var(--ink); }

/* ---- dark cinematic hero variant (body.car-hero-dark, PT): the header
   floats CREAM over the full-bleed brand-wall image. Higher specificity
   (extra body class) beats the ink override above, so the not-yet-migrated
   language mirrors — which lack the body class — keep their ink nav. ---- */
body.car-hero-dark .site-header:not(.site-header--solid) .nav-links a { color: rgba(251,247,238,0.80); }
body.car-hero-dark .site-header:not(.site-header--solid) .nav-links a:hover,
body.car-hero-dark .site-header:not(.site-header--solid) .nav-links a.is-active { color: var(--paper); }
body.car-hero-dark .site-header:not(.site-header--solid) .lang-switch > summary { color: rgba(251,247,238,0.80); }
body.car-hero-dark .site-header:not(.site-header--solid) .nav-cta.btn--ghost { border-color: rgba(251,247,238,0.42); color: var(--paper); }
body.car-hero-dark .site-header:not(.site-header--solid) .nav-cta.btn--ghost:hover { background: var(--paper); color: var(--espresso); border-color: var(--paper); }
body.car-hero-dark .site-header:not(.site-header--solid) .nav-toggle span { background: var(--paper); }
/* the warm multi-colour mark goes muddy on espresso (its grey "CAPITAL" vanishes);
   render it clean cream on the dark hero, like IGC's white mark on navy. Reverts
   to full colour once the header solidifies on scroll. */
body.car-hero-dark .site-header:not(.site-header--solid) .brand img { filter: brightness(0) invert(1); opacity: 0.94; }

/* ============================================================
   1b — SIGNATURE HERO  (v9)  — original, IGC-caliber but unmistakably overA.
   A solid warm-espresso field, a crescendo serif headline, and overA's OWN
   geometric signature: "a mesa" drawn as a single hairline table bearing
   three seats — two filled (the founders) + one open terracotta ring (você),
   the page's whole thesis as one elegant line. Centered, spacious, confident;
   an IGC-style square CTA in terracotta. No photo. (Old .car-hero* rules stay
   below for the not-yet-migrated mirrors.)
   ============================================================ */
.car-hero3 {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: min(94vh, 920px);
  display: flex; align-items: center; justify-content: center;
  padding-top: calc(var(--header-h) + clamp(2rem, 5vw, 4rem));
  padding-bottom: clamp(3rem, 6vw, 5rem);
  background:
    radial-gradient(130% 100% at 50% 4%, #251b0c 0%, var(--espresso) 44%, #120d05 100%);
  color: var(--on-dark); text-align: center;
}
/* overA's α mark, giant + ghosted, as quiet brand texture behind it all */
.car-hero3__mark {
  position: absolute; z-index: -1; left: 50%; top: 46%; transform: translate(-50%,-50%);
  font-family: var(--display); font-style: italic; font-weight: 400;
  font-size: clamp(26rem, 58vw, 54rem); line-height: 1; color: var(--paper);
  opacity: 0.028; pointer-events: none; user-select: none;
}
.car-hero3 .container { position: relative; z-index: 1; }
.car-hero3__inner { max-width: 44rem; margin-inline: auto; }
.car-hero3__over {
  font-family: var(--sans); font-weight: 600; font-size: var(--fs-xs);
  letter-spacing: 0.22em; text-transform: uppercase;
  color: rgba(251,247,238,0.55); margin: 0 0 1.1rem;
}
.car-hero3__title {
  font-family: var(--display); font-weight: 400; color: var(--paper);
  font-size: clamp(3.4rem, 2rem + 6.2vw, 7.2rem); line-height: 0.98; letter-spacing: -0.026em; margin: 0;
}
.car-hero3__title .accent { color: var(--accent-soft); }
.car-hero3__sub {
  font-family: var(--sans); font-size: var(--fs-lead); line-height: 1.5;
  color: rgba(251,247,238,0.76); margin: clamp(1.2rem,2.4vw,1.8rem) auto 0; max-width: 40ch;
}
/* the signature: one hairline table + three seats */
.car-hero3__table { position: relative; width: min(560px, 82%); margin: clamp(2.6rem,5vw,4rem) auto 0; height: 52px; }
.car-hero3__table::before {
  content: ""; position: absolute; left: 0; right: 0; top: 8px; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(251,247,238,0.42) 14%, rgba(251,247,238,0.42) 86%, transparent);
}
.car-hero3__seats { position: absolute; left: 0; right: 0; top: 8px; display: flex; justify-content: space-between; padding: 0 14%; }
.car-seat { display: flex; flex-direction: column; align-items: center; gap: 0.62rem; transform: translateY(-50%); }
.car-seat__dot { width: 13px; height: 13px; border-radius: 50%; box-shadow: 0 0 0 5px rgba(18,13,5,0.9); }
.car-seat--filled .car-seat__dot { background: var(--accent-soft); }
.car-seat--open .car-seat__dot { background: transparent; border: 1.5px solid var(--accent-soft); }
.car-seat__label { font-family: var(--sans); font-size: var(--fs-xs); color: rgba(251,247,238,0.55); white-space: nowrap; }
.car-seat--open .car-seat__label { color: var(--accent-soft); }
.car-hero3__cta { margin-top: clamp(2.2rem,4vw,3.2rem); display: inline-flex; align-items: center; justify-content: center; gap: 1.5rem; flex-wrap: wrap; }
.car-hero3__apply { display: inline-flex; align-items: center; gap: 0.85rem; font-family: var(--sans); font-weight: 500; font-size: var(--fs-body); color: var(--accent-soft); }
.car-hero3__apply .sq {
  display: inline-flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; background: var(--accent); color: var(--paper);
  border-radius: 5px; font-size: 1.25rem;
  transition: background-color var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.car-hero3__apply:hover .sq { background: var(--accent-soft); transform: translate(2px,-2px); }
.car-hero3__link { font-family: var(--sans); font-size: var(--fs-small); color: rgba(251,247,238,0.66); border-bottom: 1px solid rgba(251,247,238,0.28); padding-bottom: 2px; }
.car-hero3__link:hover { color: var(--paper); border-color: var(--paper); }
@media (max-width: 480px) {
  .car-hero3__table { width: 92%; }
  .car-hero3__seats { padding: 0 6%; }
  .car-seat__label { font-size: 0.72rem; }
}

/* ---- shared contained plate (used by the hero + the deal-shelf photo) ---- */
.car-plate {
  position: relative; margin: 0;
  border-radius: var(--r); overflow: hidden;
  border: 1px solid var(--line); background: var(--paper-2);
  box-shadow: var(--shadow-lg);
}
.car-plate > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.car-cap {
  margin-top: 0.8rem; font-family: var(--sans); font-size: var(--fs-xs);
  letter-spacing: 0.01em; color: var(--ink-faint);
  display: flex; align-items: center; gap: 0.6em;
}
.car-cap::before { content: ""; width: 1.6em; height: 1px; background: var(--line-strong); flex: none; }
.car-hero__figure, .car-do__figure { margin: 0; }

/* shared section heads — tight, two-tier: capped h2 + a lead that can run wider */
.car-head { max-width: 60ch; margin-bottom: clamp(1.8rem, 3vw, 2.6rem); }
.car-head h2 {
  font-size: var(--fs-h2); line-height: 1.04; letter-spacing: -0.02em;
  margin: 0; max-width: 22ch;
}
.car-head h2 .accent { color: var(--accent); }
.car-head .lead { margin-top: 0.9rem; max-width: 54ch; color: var(--ink-muted); }

/* ============================================================
   1 — HERO  (paper split: a confident statement column + a real,
   contained B&W plate of overA's own branded office; a slim inline
   fact strip fills the old dead space under the CTAs with substance.)
   ============================================================ */
.car-hero { background: var(--paper); }
/* opt out of the >=1700px tall-centered hero band (base.css) — this hero
   is a split composition, not a single centered type block */
@media (min-width: 1700px) { .car-hero { min-height: 0; justify-content: flex-start; } }

.car-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr);
  gap: clamp(2rem, 4.5vw, 4.5rem);
  align-items: center;
}
.car-hero__copy { max-width: 40ch; }
.car-hero h1 {
  font-size: var(--fs-page-title);
  line-height: 1.02; letter-spacing: -0.021em;
  margin: 0; max-width: 15ch;
}
.car-hero h1 .accent { color: var(--accent); }
.car-hero__lede {
  font-family: var(--sans); font-size: var(--fs-lead); line-height: 1.5;
  color: var(--ink-muted); margin: clamp(1.1rem, 2vw, 1.5rem) 0 0; max-width: 48ch;
}
.car-hero__actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: clamp(1.3rem, 2.2vw, 1.9rem); }

/* slim identity strip — 3 non-numeric facts, hairline-separated */
.car-hero__facts {
  margin-top: clamp(1.5rem, 2.6vw, 2.1rem);
  padding-top: clamp(1.1rem, 2vw, 1.5rem);
  border-top: 1px solid var(--line);
  display: flex; flex-wrap: wrap; gap: 0.55rem 1.4rem;
}
.car-hero__fact {
  position: relative; font-family: var(--sans); font-size: var(--fs-small);
  color: var(--ink-muted); letter-spacing: 0.005em;
}
.car-hero__fact b { color: var(--ink); font-weight: 600; }
.car-hero__fact + .car-hero__fact::before {
  content: ""; position: absolute; left: -0.75rem; top: 0.15em; bottom: 0.15em;
  width: 1px; background: var(--line-strong);
}

.car-hero__plate { aspect-ratio: 16 / 11; }
.car-hero__plate img {
  object-position: center 44%;
  filter: saturate(1.05) contrast(1.02);   /* v8: warm COLOUR — grayscale was the literal cause of "grey" */
}
/* the photo now runs in warm colour; a soft bottom vignette gives it
   cinematic depth without muddying the warm-paper palette */
.car-hero__plate::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, transparent 58%, rgba(28,21,8,0.14));
}

/* ============================================================
   2 — OS NÚMEROS  (proof-metric strip: a mid-size numeral + a small-caps
   label + one tight descriptor line, four across in a hairline band.
   The Qatalyst/Evercore/William Blair device — every big element carries
   a REAL figure and a label, so it reads substantive, never a lonely
   112px vanity number floating in whitespace.)
   ============================================================ */
.car-metrics { background: var(--paper); }
.car-metrics__strip {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: clamp(1.6rem, 3.4vw, 3.4rem);
}
/* un-boxed: each figure hairline-topped, giant serif — the site's premium
   .stats register + IGC's loud-numbers confidence, on warm paper */
.car-metric {
  border-top: 1px solid var(--line-ink);
  padding: clamp(1.2rem, 2vw, 1.6rem) 0 0;
  display: flex; flex-direction: column; gap: 0.55rem;
}
.car-metric__n {
  font-family: var(--display); font-weight: 400;
  font-size: clamp(3.1rem, 2rem + 3.4vw, 5rem); line-height: 0.88; letter-spacing: -0.035em;
  color: var(--ink); font-feature-settings: "tnum" 1, "lnum" 1;
}
.car-metric__n .u { font-size: 0.42em; letter-spacing: 0.01em; color: var(--accent); margin-left: 0.12em; }   /* v8: terracotta unit accent */
.car-metric__l {
  font-family: var(--sans); font-size: var(--fs-xs); font-weight: 600;
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--accent-deep);
}
.car-metric__d { font-family: var(--sans); font-size: var(--fs-small); line-height: 1.42; color: var(--ink-muted); margin: 0; }
.car-metric__d b { color: var(--ink); font-weight: 600; }
.car-metrics__foot {
  margin: clamp(1rem, 1.8vw, 1.4rem) 0 0;
  font-family: var(--sans); font-size: var(--fs-xs); color: var(--ink-faint); line-height: 1.5;
}
@media (max-width: 860px) { .car-metrics__strip { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 460px) { .car-metrics__strip { grid-template-columns: 1fr; } }

/* ============================================================
   3 — COMO A GENTE TRABALHA  (EDITORIAL MANIFESTO — v7 anti-monotony pass.
   Was a boxed 2x3 grid that visually echoed the metrics strip above it.
   Now a magazine-style split: a big section-head anchored LEFT (sticky),
   the six beliefs set RIGHT as bold serif statements on hairlines — no
   cards, no big number column. A different DEVICE, not another list, so
   the eye doesn't glaze past a fourth grey grid.)
   ============================================================ */
.car-work { background: var(--oat); }
.car-work .container {
  display: grid;
  grid-template-columns: minmax(200px, 280px) 1fr;
  gap: clamp(1.8rem, 4.2vw, 4.2rem);
  align-items: start;
}
.car-work .car-head {
  margin-bottom: 0;
  position: sticky; top: calc(var(--header-h) + 1.6rem);
}
.car-principles {
  display: grid; grid-template-columns: repeat(2, 1fr);
  column-gap: clamp(1.6rem, 3vw, 3rem); row-gap: 0;
}
.car-principle {
  display: block;
  padding: clamp(1rem, 1.8vw, 1.5rem) 0;
  border-top: 1px solid var(--line-strong);
}
.car-principle__n {
  font-family: var(--display); font-weight: 400;
  font-size: clamp(1.55rem, 1.1rem + 1vw, 2.25rem); line-height: 1;
  letter-spacing: -0.01em;
  color: var(--accent); display: block; margin-bottom: 0.4rem;   /* v8: terracotta serif drop-figure */
  font-feature-settings: "tnum" 1, "lnum" 1;
}
.car-principle__t {
  font-family: var(--display); font-weight: 400;
  font-size: clamp(1.2rem, 0.85rem + 0.95vw, 1.6rem); line-height: 1.15;
  letter-spacing: -0.015em; color: var(--ink); margin: 0 0 0.4rem;
}
.car-principle__d { font-family: var(--sans); font-size: var(--fs-small); line-height: 1.5; color: var(--ink-muted); margin: 0; }
.car-principle__d b { color: var(--ink); font-weight: 600; }
@media (max-width: 860px) {
  .car-work .container { grid-template-columns: 1fr; gap: clamp(1.5rem, 4vw, 2rem); }
  .car-work .car-head { position: static; }
}
@media (max-width: 560px) { .car-principles { grid-template-columns: 1fr; } }

/* ============================================================
   4 — À MESA NO PRIMEIRO DIA  (the one espresso band: the anti-pyramid
   thesis via the shared .statement crescendo, then a SUBSTANTIVE two-
   founder block — proper portraits, a real line each, and a short
   founders' note — because "somos nós dois, e a gente lê cada
   candidatura" IS the pitch. Go deep on the two, never fake a crowd.)
   ============================================================ */
.car-thesis { background: var(--espresso); color: var(--on-dark); }

.car-founders {
  margin-top: clamp(2.4rem, 4.5vw, 3.8rem);
  padding-top: clamp(2rem, 3.4vw, 2.8rem);
  border-top: 1px solid var(--line-on-dark);
}
.car-founders__note {
  font-family: var(--display); font-weight: 400;
  font-size: var(--fs-h4); line-height: 1.42; color: var(--on-dark);
  margin: 0 auto clamp(2rem, 3.6vw, 3rem); max-width: 58ch; text-align: center; text-wrap: pretty;
}
.car-founders__note .accent { color: var(--accent-soft); }
.car-founders__row {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 1px; background: var(--line-on-dark);
  border: 1px solid var(--line-on-dark); border-radius: var(--r); overflow: hidden;
  max-width: 760px; margin-inline: auto;
}
.car-founder {
  background: var(--espresso-2);
  padding: clamp(1.3rem, 2.4vw, 1.9rem);
  display: grid; grid-template-columns: auto 1fr; gap: clamp(1rem, 2vw, 1.4rem); align-items: center;
}
.car-founder__photo {
  width: clamp(64px, 7vw, 84px); aspect-ratio: 1; border-radius: 50%;
  overflow: hidden; background: var(--espresso-3);
  border: 1px solid var(--line-on-dark-strong); flex: none;
}
.car-founder__photo img {
  width: 100%; height: 100%; object-fit: cover; object-position: top center;
  filter: saturate(1.04) contrast(1.02);   /* v8: the two real faces, warm — not desaturated */
}
.car-founder__name { font-family: var(--display); font-size: var(--fs-h4); line-height: 1.05; color: var(--on-dark); }
.car-founder__role { display: block; font-family: var(--sans); font-size: var(--fs-xs); letter-spacing: 0.05em; text-transform: uppercase; color: var(--accent-soft); margin-top: 0.3rem; }
.car-founder__line { font-family: var(--sans); font-size: var(--fs-small); line-height: 1.45; color: var(--on-dark-muted); margin: 0.5rem 0 0; }
@media (max-width: 620px) { .car-founders__row { grid-template-columns: 1fr; } }

/* ============================================================
   5 — O QUE VOCÊ VAI FAZER  (the mandate end-to-end as a dense numbered
   ledger, paired with the real deal-shelf photo + a text strip of REAL
   closed deals. "What you'll actually work on" made concrete — the
   Centerview/Qatalyst proof-on-the-careers-page device, in overA's own
   typographic register rather than a cloned tombstone wall.)
   ============================================================ */
.car-do { background: var(--paper); }
.car-do__grid {
  display: grid; grid-template-columns: 1.05fr 0.95fr;
  gap: clamp(2rem, 4.5vw, 4.5rem); align-items: start;
}
.car-do__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-ink); }
.car-do__item {
  display: grid; grid-template-columns: auto 1fr; gap: clamp(0.9rem, 2vw, 1.5rem);
  align-items: baseline; padding: clamp(0.95rem, 1.8vw, 1.35rem) 0;
  border-bottom: 1px solid var(--line);
}
.car-do__n {
  font-family: var(--display); font-weight: 400; font-size: var(--fs-h4);
  line-height: 1; color: var(--accent-deep); font-feature-settings: "tnum" 1;
}
.car-do__t { font-family: var(--display); font-weight: 400; font-size: var(--fs-h4); line-height: 1.1; letter-spacing: -0.01em; color: var(--ink); margin: 0 0 0.25rem; }
.car-do__d { font-family: var(--sans); font-size: var(--fs-small); line-height: 1.48; color: var(--ink-muted); margin: 0; }
.car-do__d b { color: var(--ink); font-weight: 600; }

.car-do__aside { position: sticky; top: calc(var(--header-h) + 1.4rem); }
.car-do__figure {}
.car-do__plate { aspect-ratio: 4 / 3; }
.car-do__plate img { object-position: center 42%; filter: saturate(1.06) contrast(1.02); }   /* v8: full-colour deal shelf */
.car-do__cap {
  margin-top: 0.8rem; font-family: var(--sans); font-size: var(--fs-xs);
  line-height: 1.5; color: var(--ink-faint);
}
.car-do__cap b { color: var(--ink-muted); font-weight: 600; }
/* real closed-deal text strip — dense, typographic, NOT a logo wall */
.car-do__deals {
  margin-top: clamp(1.1rem, 2vw, 1.5rem); padding-top: clamp(1rem, 1.8vw, 1.4rem);
  border-top: 1px solid var(--line);
}
.car-do__deals-h {
  font-family: var(--sans); font-size: var(--fs-xs); font-weight: 600;
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-faint); margin: 0 0 0.7rem;
}
.car-do__deal-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.5rem; }
.car-do__deal {
  font-family: var(--sans); font-size: var(--fs-small); line-height: 1.35; color: var(--ink-muted);
  display: flex; align-items: baseline; gap: 0.45em; flex-wrap: wrap;
}
.car-do__deal b { color: var(--ink); font-weight: 600; }
.car-do__deal .to { color: var(--ink-faint); font-size: 0.86em; }
.car-do__deal .sec { color: var(--ink-faint); font-size: 0.82em; margin-left: 0.1em; }
.car-do__more { margin-top: 0.9rem; font-family: var(--sans); font-size: var(--fs-small); }
.car-do__more a { color: var(--accent); display: inline-flex; align-items: center; gap: 0.4em; }
.car-do__more a:hover { color: var(--accent-deep); }
@media (max-width: 900px) {
  .car-do__grid { grid-template-columns: 1fr; gap: clamp(1.8rem, 5vw, 2.6rem); }
  .car-do__aside { position: static; }
}

/* ============================================================
   6 — COMO VOCÊ ENTRA  (HORIZONTAL STEP TIMELINE — v7 anti-monotony pass.
   Was a vertical numbered ladder that read the same as the belief list and
   the mandate ledger. Now the four steps run LEFT-TO-RIGHT as a timeline:
   each on a hairline segment with a node dot, a big serif numeral, a title,
   a line, and its honest duration pill pinned to a common baseline. A new
   AXIS breaks the vertical-list drumbeat; the offer node is the terracotta
   moment.)
   ============================================================ */
.car-process { background: var(--oat); }
.car-steps {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: clamp(1.1rem, 2.5vw, 2.2rem);
}
.car-step {
  display: flex; flex-direction: column; align-items: flex-start;
  padding-top: clamp(1.4rem, 2.6vw, 2.1rem);
  border-top: 1px solid var(--line-strong);
  position: relative;
}
.car-step::before {
  content: ""; position: absolute; top: 0; left: 0;
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--oat); border: 1.5px solid var(--ink-faint);
  transform: translateY(-50%);
}
.car-step--offer::before { border-color: var(--accent); background: var(--accent); }
.car-step__n {
  font-family: var(--display); font-weight: 400;
  font-size: clamp(1.9rem, 1.2rem + 1.5vw, 2.7rem); line-height: 1;
  color: var(--ink); letter-spacing: -0.02em; margin-bottom: 0.7rem;
  font-feature-settings: "tnum" 1;
}
.car-step__t { font-family: var(--display); font-weight: 400; font-size: var(--fs-h4); line-height: 1.12; letter-spacing: -0.01em; color: var(--ink); margin: 0 0 0.4rem; }
.car-step__d { font-family: var(--sans); font-size: var(--fs-small); line-height: 1.5; color: var(--ink-muted); margin: 0 0 1.1rem; }
.car-step__d b { color: var(--ink); font-weight: 600; }
.car-step__when {
  margin-top: auto; white-space: nowrap;
  font-family: var(--sans); font-size: var(--fs-xs); letter-spacing: 0.01em;
  color: var(--ink-muted);
  border: 1px solid var(--line-strong); border-radius: var(--r-pill);
  padding: 0.4em 0.9em;
}
.car-step--offer .car-step__n,
.car-step--offer .car-step__t { color: var(--accent-deep); }
.car-step--offer .car-step__when { color: var(--accent-deep); border-color: color-mix(in srgb, var(--accent) 42%, transparent); background: var(--accent-wash); }
.car-process__promise {
  margin-top: clamp(1.6rem, 3vw, 2.4rem);
  font-family: var(--display); font-weight: 400;
  font-size: var(--fs-h4); line-height: 1.3; color: var(--ink); max-width: 52ch;
}
@media (max-width: 900px) { .car-steps { grid-template-columns: repeat(2, 1fr); row-gap: clamp(1.8rem, 4vw, 2.4rem); } }
@media (max-width: 520px) { .car-steps { grid-template-columns: 1fr; row-gap: clamp(1.6rem, 6vw, 2rem); } }

/* ============================================================
   7 — PERGUNTAS DIRETAS  (a candid FAQ — native <details>/<summary>, no
   JS, no scroll motion. Progressive disclosure = huge substance in a
   tiny footprint, the Moelis/PJT/Ramp device. Answers the real questions
   a two-founder shop should answer plainly.)
   ============================================================ */
.car-faq { background: var(--paper); }
.car-faq__list { border-top: 1px solid var(--line); max-width: 900px; }
.car-q { border-bottom: 1px solid var(--line); }
.car-q > summary {
  list-style: none; cursor: pointer;
  display: flex; align-items: baseline; justify-content: space-between; gap: 1.5rem;
  padding: clamp(1rem, 2vw, 1.4rem) 0;
  font-family: var(--display); font-weight: 400; font-size: var(--fs-h4);
  line-height: 1.2; letter-spacing: -0.01em; color: var(--ink);
  transition: color var(--dur) var(--ease);
}
.car-q > summary::-webkit-details-marker { display: none; }
.car-q > summary:hover { color: var(--accent-deep); }
.car-q__sign { flex: none; position: relative; width: 0.85em; height: 0.85em; align-self: center; }
.car-q__sign::before, .car-q__sign::after {
  content: ""; position: absolute; background: var(--accent); transition: transform var(--dur) var(--ease), background var(--dur) var(--ease);
}
.car-q__sign::before { left: 0; right: 0; top: 50%; height: 1.5px; transform: translateY(-50%); }
.car-q__sign::after  { top: 0; bottom: 0; left: 50%; width: 1.5px; transform: translateX(-50%); }
.car-q[open] .car-q__sign::after { transform: translateX(-50%) scaleY(0); }
.car-q[open] > summary { color: var(--ink); }
.car-q[open] .car-q__sign::before { background: var(--accent); }
.car-q__a {
  padding: 0 0 clamp(1.1rem, 2vw, 1.5rem); margin: 0;
  font-family: var(--sans); font-size: var(--fs-body); line-height: 1.6;
  color: var(--ink-muted); max-width: 68ch;
}
.car-q__a b { color: var(--ink); font-weight: 600; }
.car-q__a a { color: var(--accent); }
.car-q__a a:hover { color: var(--accent-deep); }

/* ============================================================
   8 — DEIXE O SEU NOME  (the always-open invitation + working form, now
   with an honest "not for everyone" filter line — the Ramp/Stripe candour
   device that flatters by filtering. Keeps [data-careers-form] + mailto.)
   ============================================================ */
/* v9: the close is now a DRAMATIC DARK band (espresso) — the second bookend
   to the dark hero. Cream headline + terracotta accent, the filter on a
   raised espresso panel, and the working form as a clean white card that
   pops off the dark. */
.car-apply { background: var(--espresso); color: var(--on-dark); }
.car-apply__grid {
  display: grid; grid-template-columns: 0.92fr 1.08fr;
  gap: clamp(2rem, 4.5vw, 4.5rem); align-items: start;
}
.car-apply__intro h2 { font-size: var(--fs-h2); line-height: 1.04; letter-spacing: -0.02em; margin: 0; max-width: 17ch; color: var(--paper); }
.car-apply__intro h2 .accent { color: var(--accent-soft); }
.car-apply__intro .lead { margin-top: 1.1rem; max-width: 42ch; color: var(--on-dark-muted); }
.car-apply__filter {
  margin-top: clamp(1.3rem, 2.4vw, 1.8rem); padding: clamp(1.1rem, 2vw, 1.5rem) clamp(1.2rem, 2.2vw, 1.6rem);
  background: var(--espresso-2); border: 1px solid var(--line-on-dark); border-left: 2px solid var(--accent-soft);
  border-radius: var(--r-sm);
  font-family: var(--sans); font-size: var(--fs-small); line-height: 1.55; color: var(--on-dark-muted);
}
.car-apply__filter b { color: var(--on-dark); font-weight: 600; }
.car-apply__aside {
  margin-top: clamp(1.3rem, 2.4vw, 1.8rem); padding-top: clamp(1.2rem, 2vw, 1.5rem);
  border-top: 1px solid var(--line-on-dark); display: flex; flex-direction: column; gap: 0.65rem;
}
.car-apply__aside a { display: inline-flex; align-items: center; gap: 0.5em; font-family: var(--sans); font-size: var(--fs-small); color: var(--on-dark-muted); transition: color var(--dur) var(--ease); }
.car-apply__aside a:hover { color: var(--accent-soft); }
.car-apply__aside .msym { font-size: 1.1rem; color: var(--on-dark-faint); }

.car-apply__form { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); padding: clamp(1.5rem, 2.8vw, 2.3rem); box-shadow: var(--shadow-dark); }
.car-apply__note { margin-top: 0.5rem; font-family: var(--sans); font-size: var(--fs-xs); color: var(--ink-faint); line-height: 1.5; }

.car-apply .form__success {
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
  padding: clamp(1.7rem, 3.2vw, 2.6rem); box-shadow: var(--shadow);
}
.car-apply .form__success h3 { font-family: var(--display); font-weight: 400; font-size: var(--fs-h3); margin: 0 0 0.5rem; color: var(--ink); }
.car-apply .form__success p { font-family: var(--sans); font-size: var(--fs-body); line-height: 1.55; color: var(--ink-muted); margin: 0; max-width: 44ch; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 980px) {
  .car-hero__grid { grid-template-columns: 1fr; gap: clamp(1.6rem, 5vw, 2.4rem); align-items: start; }
  .car-hero__copy { max-width: none; }
  .car-hero h1 { max-width: 18ch; }
  .car-hero__figure { order: -1; }               /* photo leads on narrow screens */
  .car-hero__plate { aspect-ratio: 16 / 10; }
}
@media (max-width: 860px) {
  .car-apply__grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .car-apply__aside a, .car-q > summary, .car-q__sign::before, .car-q__sign::after { transition: none; }
}

/* ============================================================
   CARREIRAS — v13 PHOTOGRAPHIC REBUILD  (client-chosen 2026-07-06:
   "human / photographic, closest to IGC — no product UI").
   A tight FOUR-beat page carried by REAL overA imagery, not text lists:
     1 · dark split hero on the branded office corridor (words beside a
         contained photo card — no type over photo, per the opening rules);
     2 · the à-mesa thesis + four honest reasons + the two founders (who
         read every application) — IGC's "por que" + people beat, made
         honest (deep on the two we have, never a faked crowd);
     3 · the deal shelf + the real numbers on espresso — IGC's tombstone
         wall + big stats, done with overA's own figures, no projection;
     4 · the always-open apply form.
   Everything is a NEW .crr- prefix. The legacy .car-* rules ABOVE are kept
   ONLY so the not-yet-resynced language mirrors keep rendering — prune them
   once the EN/ES/JA/ZH mirrors are rebuilt on this structure.
   ============================================================ */

/* accent stays ROMAN in display type (site-wide de-italic ruling) */
.crr-hero__title .accent,
.crr-mast__title .accent,
.crr-founders__note .accent,
.crr-apply__h .accent { font-style: normal; }

/* ---- shared contained media plate + hairline caption (hero + proof) ---- */
.crr-plate {
  position: relative; margin: 0; overflow: hidden;
  border-radius: var(--r); border: 1px solid var(--line-on-dark);
  background: var(--espresso-2); box-shadow: var(--shadow-hero);
}
.crr-plate img { width: 100%; height: 100%; object-fit: cover; display: block; }
.crr-cap {
  margin: 0.85rem 0 0; font-family: var(--sans); font-size: var(--fs-xs);
  letter-spacing: 0.01em; color: var(--on-dark-faint);
  display: flex; align-items: center; gap: 0.6em;
}
.crr-cap::before { content: ""; width: 1.6em; height: 1px; background: var(--line-on-dark-strong); flex: none; }

/* ---- shared masthead: serif title beside an intro line (IGC device) ---- */
.crr-mast {
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(1.4rem, 4vw, 4rem); align-items: end;
  margin-bottom: clamp(2.2rem, 4vw, 3.6rem);
}
.crr-mast__title {
  font-family: var(--display); font-weight: 400;
  font-size: var(--fs-h2); line-height: 1.02; letter-spacing: -0.022em;
  color: var(--ink); margin: 0; text-wrap: balance;
}
.crr-mast__title .accent { color: var(--accent); }
.crr-mast__lead {
  font-family: var(--sans); font-size: var(--fs-lead); line-height: 1.5;
  color: var(--ink-muted); margin: 0; max-width: 46ch; padding-bottom: 0.35rem;
}
.crr-mast--dark .crr-mast__title { color: var(--on-dark); }
.crr-mast--dark .crr-mast__title .accent { color: var(--accent-soft); }
.crr-mast--dark .crr-mast__lead { color: var(--on-dark-muted); }
@media (max-width: 820px) {
  .crr-mast { grid-template-columns: 1fr; gap: clamp(0.9rem, 3vw, 1.4rem); align-items: start; }
  .crr-mast__lead { padding-bottom: 0; }
}

/* =========================================================
   1 · HERO  (dark espresso split)
   ========================================================= */
.crr-hero {
  position: relative; isolation: isolate; overflow: hidden;
  background: var(--espresso); color: var(--on-dark);
  min-height: min(94vh, 900px);
  display: flex; align-items: center;
  padding-top: calc(var(--header-h) + clamp(1.6rem, 4vh, 3rem));
  padding-bottom: clamp(2.4rem, 5vh, 4rem);
}
.crr-hero__wash {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(60% 60% at 88% 22%, rgba(225,142,56,0.12), transparent 62%),
    linear-gradient(180deg, #14100a 0%, var(--espresso) 46%, #120d05 100%);
}
.crr-hero .container { position: relative; z-index: 1; width: 100%; }
.crr-hero__grid {
  display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(2rem, 4.5vw, 4.5rem); align-items: center;
}
.crr-hero__copy { max-width: 34rem; }
.crr-hero__title {
  font-family: var(--display); font-weight: 400; color: var(--paper);
  font-size: var(--fs-page-title); line-height: 1.0; letter-spacing: -0.024em; margin: 0;
}
.crr-hero__title .accent { color: var(--accent-soft); }
.crr-hero__lead {
  font-family: var(--sans); font-size: var(--fs-lead); line-height: 1.5;
  color: rgba(239,231,213,0.82); margin: clamp(1.1rem, 2.2vw, 1.6rem) 0 0; max-width: 42ch;
}
.crr-hero__cta { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: clamp(1.5rem, 2.6vw, 2.1rem); }
.crr-hero .btn--ghost { color: var(--paper); border-color: rgba(239,231,213,0.42); background: transparent; }
.crr-hero .btn--ghost:hover { background: var(--paper); border-color: var(--paper); color: var(--espresso); }
.crr-hero__figure { margin: 0; }
.crr-hero__plate { aspect-ratio: 16 / 12; }
.crr-hero__plate img { object-position: center 42%; }
@media (max-width: 980px) {
  .crr-hero { min-height: 0; }
  .crr-hero__grid { grid-template-columns: 1fr; gap: clamp(1.8rem, 5vw, 2.6rem); }
  .crr-hero__copy { max-width: none; }
  .crr-hero__figure { order: -1; }
  .crr-hero__plate { aspect-ratio: 16 / 10; }
}
/* opt out of the >=1700px centered-hero band from base.css */
@media (min-width: 1700px) { .crr-hero { min-height: 0; align-items: center; } }

/* =========================================================
   2 · A MESA  (light paper)
   ========================================================= */
.crr-mesa { background: var(--paper); }
.crr-reasons {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--line-ink);
}
.crr-reason { padding: clamp(1.2rem, 2vw, 1.7rem) clamp(1rem, 1.6vw, 1.5rem) 0 0; }
.crr-reason + .crr-reason { border-left: 1px solid var(--line); padding-left: clamp(1rem, 1.6vw, 1.5rem); }
.crr-reason__t {
  font-family: var(--display); font-weight: 400; font-size: var(--fs-h4);
  line-height: 1.14; letter-spacing: -0.012em; color: var(--ink); margin: 0 0 0.5rem;
}
.crr-reason__d { font-family: var(--sans); font-size: var(--fs-small); line-height: 1.5; color: var(--ink-muted); margin: 0; text-wrap: pretty; }
.crr-reason__d b { color: var(--ink); font-weight: 600; }
@media (max-width: 820px) {
  .crr-reasons { grid-template-columns: repeat(2, 1fr); }
  .crr-reason { padding-right: clamp(1rem, 3vw, 1.5rem); }
  .crr-reason:nth-child(odd) { border-left: 0; padding-left: 0; }
  .crr-reason:nth-child(even) { border-left: 1px solid var(--line); padding-left: clamp(1rem, 3vw, 1.5rem); }
  .crr-reason:nth-child(n+3) { border-top: 1px solid var(--line); padding-top: clamp(1.2rem, 3vw, 1.6rem); }
}
@media (max-width: 500px) {
  .crr-reasons { grid-template-columns: 1fr; }
  .crr-reason { border-left: 0; padding-left: 0; padding-right: 0; }
  .crr-reason + .crr-reason { border-top: 1px solid var(--line); padding-top: clamp(1.1rem, 4vw, 1.5rem); }
}

.crr-founders {
  margin-top: clamp(2.6rem, 5vw, 4.2rem);
  padding-top: clamp(2rem, 3.5vw, 3rem);
  border-top: 1px solid var(--line);
}
.crr-founders__note {
  font-family: var(--display); font-weight: 400; font-size: var(--fs-h3);
  line-height: 1.28; letter-spacing: -0.01em; color: var(--ink);
  margin: 0 0 clamp(1.8rem, 3.5vw, 2.8rem); max-width: 42ch; text-wrap: pretty;
}
.crr-founders__note .accent { color: var(--accent); }
.crr-founders__row { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(1.4rem, 3vw, 2.4rem); }
.crr-founder {
  margin: 0; display: grid; grid-template-columns: clamp(120px, 22%, 168px) 1fr;
  gap: clamp(1.1rem, 2vw, 1.6rem); align-items: center;
}
.crr-founder__photo {
  aspect-ratio: 4 / 5; border-radius: var(--r); overflow: hidden;
  background: var(--oat); border: 1px solid var(--line);
}
.crr-founder__photo img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.crr-founder__name { font-family: var(--display); font-weight: 400; font-size: var(--fs-h4); line-height: 1.05; color: var(--ink); }
.crr-founder__role { display: block; font-family: var(--sans); font-size: var(--fs-xs); font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--accent-deep); margin-top: 0.35rem; }
.crr-founder__line { font-family: var(--sans); font-size: var(--fs-small); line-height: 1.48; color: var(--ink-muted); margin: 0.6rem 0 0; }
@media (max-width: 620px) { .crr-founders__row { grid-template-columns: 1fr; gap: clamp(1.4rem, 5vw, 2rem); } }

/* =========================================================
   3 · A PRATELEIRA  (dark espresso: tombstone shelf + big stats)
   ========================================================= */
.crr-proof { background: var(--espresso); color: var(--on-dark); }
.crr-proof__grid {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr);
  gap: clamp(2rem, 4.5vw, 4.5rem); align-items: center;
}
.crr-stats { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.4rem, 2.6vw, 2.2rem) clamp(1.4rem, 3vw, 2.6rem); }
.crr-stat { border-top: 1px solid var(--line-on-dark-strong); padding-top: clamp(0.9rem, 1.6vw, 1.3rem); display: flex; flex-direction: column; gap: 0.4rem; }
.crr-stat__n {
  font-family: var(--display); font-weight: 400;
  font-size: clamp(2.8rem, 1.9rem + 2.6vw, 4.4rem); line-height: 0.9; letter-spacing: -0.035em;
  color: var(--on-dark); font-feature-settings: "tnum" 1, "lnum" 1;
}
.crr-stat__n .u { font-size: 0.34em; letter-spacing: 0.01em; color: var(--accent-soft); margin-left: 0.14em; }
.crr-stat__l { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: var(--accent-soft); }
.crr-stat__d { font-family: var(--sans); font-size: var(--fs-small); line-height: 1.42; color: var(--on-dark-muted); margin: 0; }
.crr-proof__figure { margin: 0; }
.crr-proof__plate { aspect-ratio: 4 / 5; border-color: var(--line-on-dark); }
.crr-proof__plate img { object-position: center 45%; }
.crr-proof__foot {
  margin: clamp(1.8rem, 3.4vw, 2.8rem) 0 0; padding-top: clamp(1.2rem, 2vw, 1.6rem);
  border-top: 1px solid var(--line-on-dark);
  font-family: var(--sans); font-size: var(--fs-xs); color: var(--on-dark-faint); line-height: 1.5;
  display: flex; flex-wrap: wrap; gap: 0.35rem 1rem; align-items: baseline;
}
.crr-proof__foot a { color: var(--accent-soft); }
.crr-proof__foot a:hover { color: var(--paper); }
@media (max-width: 900px) {
  .crr-proof__grid { grid-template-columns: 1fr; gap: clamp(2rem, 6vw, 3rem); }
  .crr-proof__figure { order: -1; }
  .crr-proof__plate { aspect-ratio: 16 / 10; }
}
@media (max-width: 460px) { .crr-stats { grid-template-columns: 1fr; } }

/* =========================================================
   4 · DEIXE O SEU NOME  (light paper: intro + working form)
   ========================================================= */
.crr-apply { background: var(--paper); }
.crr-apply__grid { display: grid; grid-template-columns: 0.92fr 1.08fr; gap: clamp(2rem, 4.5vw, 4.5rem); align-items: start; }
.crr-apply__h { font-family: var(--display); font-weight: 400; font-size: var(--fs-h2); line-height: 1.03; letter-spacing: -0.02em; margin: 0; max-width: 17ch; color: var(--ink); }
.crr-apply__h .accent { color: var(--accent); }
.crr-apply__lead { font-family: var(--sans); font-size: var(--fs-lead); line-height: 1.5; color: var(--ink-muted); margin: 1.1rem 0 0; max-width: 42ch; }
.crr-apply__filter {
  margin-top: clamp(1.3rem, 2.4vw, 1.8rem); padding: clamp(1.1rem, 2vw, 1.5rem) clamp(1.2rem, 2.2vw, 1.6rem);
  background: var(--oat); border: 1px solid var(--line); border-left: 2px solid var(--accent);
  border-radius: var(--r-sm);
  font-family: var(--sans); font-size: var(--fs-small); line-height: 1.55; color: var(--ink-muted);
}
.crr-apply__filter b { color: var(--ink); font-weight: 600; }
.crr-apply__aside { margin-top: clamp(1.3rem, 2.4vw, 1.8rem); padding-top: clamp(1.2rem, 2vw, 1.5rem); border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 0.65rem; }
.crr-apply__aside a { display: inline-flex; align-items: center; gap: 0.5em; font-family: var(--sans); font-size: var(--fs-small); color: var(--ink-muted); transition: color var(--dur) var(--ease); }
.crr-apply__aside a:hover { color: var(--accent-deep); }
.crr-apply__aside .msym { font-size: 1.1rem; color: var(--ink-faint); }
.crr-apply__form { background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r); padding: clamp(1.5rem, 2.8vw, 2.3rem); box-shadow: var(--shadow-lg); }
.crr-apply__note { margin-top: 0.5rem; font-family: var(--sans); font-size: var(--fs-xs); color: var(--ink-faint); line-height: 1.5; }
.crr-apply .form__success { background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r); padding: clamp(1.7rem, 3.2vw, 2.6rem); box-shadow: var(--shadow); }
.crr-apply .form__success h3 { font-family: var(--display); font-weight: 400; font-size: var(--fs-h3); margin: 0 0 0.5rem; color: var(--ink); }
.crr-apply .form__success p { font-family: var(--sans); font-size: var(--fs-body); line-height: 1.55; color: var(--ink-muted); margin: 0; max-width: 44ch; }
@media (max-width: 860px) { .crr-apply__grid { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: reduce) {
  .crr-apply__aside a { transition: none; }
}

/* ============================================================
   CARREIRAS — v14 PERSONAL pass
   Client 2026-07-06: "it's better, but you LITERALLY copied the abordagem
   page — that's not what I want. And I want something with more PERSONAL
   feel." The v13 dark words-left / media-right hero WAS abordagem's exact
   composition, so it read as a copy. v14 kills that: a WARM paper opening
   (centered first-person invite + a full-width office band, not a dark
   side-card split) and, as the core, a real FOUNDERS' LETTER on a paper
   note card, signed with Petersen + Vianna's faces — the on-point personal
   device for a two-partner firm, impossible to read as a copy. Warm paper
   dominates; the deal-shelf + numbers stay as the one dark beat, reflowed
   as a full-width band (no more L/R split). The v13 .crr-hero/.crr-mesa/
   .crr-reason/.crr-founder rules above are now dead (PT no longer uses
   them; mirrors never did) — prune with the .car-* legacy on mirror re-sync.
   ============================================================ */

/* ink caption variant (warm/light bands) */
.crr-cap--ink { color: var(--ink-faint); }
.crr-cap--ink::before { background: var(--line-strong); }

/* --- 1 · HERO (warm paper, personal, centered) --- */
.crr-hero2 {
  position: relative; overflow: hidden;
  background: var(--paper); color: var(--ink);
  padding-top: calc(var(--header-h) + clamp(2.4rem, 6vh, 4.5rem));
  padding-bottom: clamp(2.6rem, 5vw, 4.5rem);
}
.crr-hero2 .container { position: relative; z-index: 1; }
.crr-hero2__inner { max-width: 42rem; margin-inline: auto; text-align: center; }
.crr-hero2__title {
  font-family: var(--display); font-weight: 400; color: var(--ink);
  font-size: var(--fs-page-title); line-height: 1.0; letter-spacing: -0.024em; margin: 0;
}
.crr-hero2__title .accent { color: var(--accent); font-style: normal; }
.crr-hero2__lead {
  font-family: var(--sans); font-size: var(--fs-lead); line-height: 1.5;
  color: var(--ink-muted); margin: clamp(1.1rem, 2.2vw, 1.6rem) auto 0; max-width: 50ch;
}
.crr-hero2__cta { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: clamp(1.5rem, 2.6vw, 2.1rem); justify-content: center; }
.crr-hero2__figure { margin: clamp(2.6rem, 5vw, 4.2rem) 0 0; }
.crr-hero2__band { aspect-ratio: 21 / 9; border: 1px solid var(--line); background: var(--paper-2); box-shadow: var(--shadow-lg); }
.crr-hero2__band img { object-position: center 44%; }
@media (max-width: 720px) { .crr-hero2__band { aspect-ratio: 16 / 10; } }

/* --- 2 · A CARTA (warm oat: a founders' letter on a paper note card) --- */
.crr-letter { background: var(--oat); }
.crr-letter__card {
  max-width: 52rem; margin-inline: auto;
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
  box-shadow: var(--shadow-lg);
  padding: clamp(1.8rem, 4vw, 3.6rem);
}
.crr-letter__h {
  font-family: var(--display); font-weight: 400; font-size: var(--fs-h3);
  line-height: 1.12; letter-spacing: -0.015em; color: var(--ink);
  margin: 0 0 clamp(1.2rem, 2.4vw, 1.8rem); text-wrap: balance;
}
.crr-letter__h .accent { color: var(--accent); font-style: normal; }
.crr-letter__body {
  font-family: var(--display); font-weight: 400;
  font-size: clamp(1.12rem, 1.02rem + 0.5vw, 1.34rem); line-height: 1.58; color: var(--ink);
}
.crr-letter__body p { margin: 0 0 0.9em; text-wrap: pretty; }
.crr-letter__body p:last-child { margin-bottom: 0; }
.crr-letter__body b { font-weight: 600; color: var(--ink); }
.crr-letter__sign {
  margin-top: clamp(1.7rem, 3vw, 2.4rem); padding-top: clamp(1.4rem, 2.4vw, 1.9rem);
  border-top: 1px solid var(--line);
  display: flex; align-items: center; gap: 1rem;
}
.crr-sign__faces { display: inline-flex; flex: none; }
.crr-sign__faces a { display: inline-flex; border-radius: var(--r-pill); }
.crr-sign__faces a + a { margin-left: -14px; }
.crr-sign__faces a:hover { position: relative; z-index: 1; }
.crr-sign__faces a:hover img { border-color: var(--accent); }
.crr-sign__faces a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.crr-sign__name a { color: inherit; text-decoration: none; transition: color var(--dur) var(--ease); }
.crr-sign__name a:hover { color: var(--accent-deep); text-decoration: underline; text-underline-offset: 3px; }
.crr-sign__faces img {
  width: 54px; height: 54px; border-radius: 50%;
  object-fit: cover; object-position: top center;
  border: 2px solid var(--paper); background: var(--oat); box-shadow: var(--shadow-sm);
}

.crr-sign__by { display: flex; flex-direction: column; }
.crr-sign__name { font-family: var(--display); font-weight: 400; font-size: var(--fs-h4); color: var(--ink); line-height: 1.12; }
.crr-sign__role { font-family: var(--sans); font-size: var(--fs-xs); font-weight: 600; letter-spacing: 0.01em; text-transform: none; color: var(--accent-deep); margin-top: 0.25rem; }   /* mixed case: "overA" is never set in caps */
@media (max-width: 520px) { .crr-letter__sign { align-items: flex-start; gap: 0.85rem; } }

/* --- 3 · A PRATELEIRA (dark): full-width deal-shelf band + a stat row (v14
   reflow — the v13 stats/photo L-R split is retired to avoid another split) --- */
.crr-proof__figure { margin: 0 0 clamp(2rem, 3.6vw, 3rem); }
.crr-proof__band { aspect-ratio: 21 / 8; border-color: var(--line-on-dark); }
.crr-proof__band img { object-position: center 46%; }
.crr-stats { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 820px) { .crr-stats { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 460px) { .crr-stats { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .crr-proof__band { aspect-ratio: 16 / 9; } }

/* ============================================================
   CARREIRAS — v15 "make it all like the CARD"
   Client 2026-07-06: "the ONLY thing I like is the card. The rest is
   useless — understand what makes it good and REMAKE the rest." What makes
   the card good: a warm, tactile PAPER OBJECT (border + soft shadow + air +
   warm Newsreader) with a PERSONAL first-person founder VOICE, real FACES,
   and a calm focused read. So the whole page becomes a warm OAT ground
   holding the founders' PAPER CARDS: a quiet letterhead -> the note card
   (kept, the anchor) -> the deal shelf as a warm show-and-tell card -> the
   apply as a warm invitation card. No dark data band, no photo hero, no
   feature grids. The v13/v14 hero/proof/stat/reason/founder rules are DEAD
   (prune on mirror re-sync).
   ============================================================ */

/* --- 1 · LETTERHEAD (quiet warm opening on the oat ground) --- */
.crr-open {
  background: var(--oat); color: var(--ink);
  padding-top: calc(var(--header-h) + clamp(2.8rem, 7vh, 5.5rem));
  padding-bottom: clamp(1.6rem, 3.5vw, 3rem);
}
.crr-open__inner { max-width: 40rem; }
.crr-open__title {
  font-family: var(--display); font-weight: 400; color: var(--ink);
  font-size: var(--fs-page-title); line-height: 1.0; letter-spacing: -0.024em; margin: 0;
}
.crr-open__title .accent { color: var(--accent); font-style: normal; }
.crr-open__lead {
  font-family: var(--sans); font-size: var(--fs-lead); line-height: 1.5;
  color: var(--ink-muted); margin: clamp(1.05rem, 2.2vw, 1.5rem) 0 0; max-width: 46ch;
}
.crr-open__cta { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: clamp(1.4rem, 2.4vw, 2rem); }

/* the note card follows the letterhead as one letter: tighten its top gap */
.crr-letter { padding-top: clamp(1.4rem, 3vw, 2.4rem); }

/* --- 3 · A NOSSA PRATELEIRA (warm show-and-tell card: framed photo + a
   caption in the founders' voice) --- */
.crr-shelf { background: var(--oat); }
.crr-shelf__card {
  max-width: 52rem; margin-inline: auto;
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
  box-shadow: var(--shadow-lg);
  padding: clamp(0.9rem, 1.8vw, 1.4rem);
}
.crr-shelf__figure {
  margin: 0; border-radius: var(--r-sm); overflow: hidden;
  aspect-ratio: 16 / 9; background: var(--oat);
}
.crr-shelf__figure img { width: 100%; height: 100%; object-fit: cover; object-position: center 46%; display: block; }
.crr-shelf__body { padding: clamp(1.3rem, 2.6vw, 2rem) clamp(0.6rem, 1.4vw, 1.2rem) clamp(0.5rem, 1vw, 0.9rem); }
.crr-shelf__h {
  font-family: var(--display); font-weight: 400; font-size: var(--fs-h3);
  line-height: 1.1; letter-spacing: -0.015em; color: var(--ink); margin: 0 0 clamp(0.8rem, 1.6vw, 1.1rem);
}
.crr-shelf__h .accent { color: var(--accent); font-style: normal; }
.crr-shelf__p {
  font-family: var(--display); font-weight: 400;
  font-size: clamp(1.08rem, 1rem + 0.4vw, 1.28rem); line-height: 1.55; color: var(--ink);
  margin: 0; max-width: 62ch; text-wrap: pretty;
}
.crr-shelf__more { margin: clamp(1rem, 2vw, 1.4rem) 0 0; font-family: var(--sans); font-size: var(--fs-small); }
.crr-shelf__more a { color: var(--accent); }
.crr-shelf__more a:hover { color: var(--accent-deep); }

/* --- 4 · DEIXE O SEU NOME (warm invitation on the oat ground; form is a
   paper card; the filter is a warm accent-LINE, not a boxed alert) --- */
.crr-apply { background: var(--oat); }
.crr-apply__filter {
  background: none; border: 0; border-left: 2px solid var(--accent); border-radius: 0;
  padding: 0.1rem 0 0.1rem clamp(0.9rem, 1.6vw, 1.2rem);
}
.crr-apply__form { background: var(--paper); box-shadow: var(--shadow-lg); }

/* ============================================================
   CARREIRAS — v16 PREMIUM CRAFT pass
   Client 2026-07-06: "it looks too CHEAP still — the IDEA is good, FIX it.
   Focus on the card; the card is cool, the rest sucks." Pure material/craft
   upgrade (no layout change) so the whole page reads EXPENSIVE, with the note
   card as the bar: (a) a fine FILM-GRAIN over the page = real-paper feel;
   (b) every card becomes a PHYSICAL paper object — top sheen + inset highlight
   + a soft WARM layered ambient shadow (never a flat grey box) + squircle
   radius + a barely-there hairline; (c) a faint α monogram fills the sparse
   letterhead; (d) premium form fields + refined button physics. Scroll-reveal
   stays banned (client). The loved note card changes only in MATERIAL.
   ============================================================ */

/* (a) fine film-grain — the biggest single "expensive paper" lever */
.crr-grain {
  position: fixed; inset: 0; z-index: 3; pointer-events: none;
  mix-blend-mode: soft-light; opacity: 0.42;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  background-size: 160px 160px; background-repeat: repeat;
}

/* (b) physical paper cards — top sheen + inset highlight + soft WARM layered
   depth + squircle radius. This is the core cheap->expensive move. */
.crr-letter__card,
.crr-shelf__card,
.crr-apply__card {
  background: linear-gradient(180deg, #FFFEFB 0%, var(--paper) 58%);
  border: 1px solid rgba(28,21,8,0.07);
  border-radius: 20px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.85),
    0 1px 2px rgba(28,21,8,0.05),
    0 10px 22px -14px rgba(48,34,14,0.20),
    0 34px 64px -32px rgba(48,34,14,0.32);
}

/* the framed shelf photo gets a crisp inner hairline (machined edge) */
.crr-shelf__figure { box-shadow: inset 0 0 0 1px rgba(28,21,8,0.07); }

/* the note card's signature faces: a warmer ring so they read as pressed-in */
.crr-sign__faces img { border: 2px solid #FFFEFB; box-shadow: 0 1px 2px rgba(28,21,8,0.12); transition: border-color var(--dur) var(--ease); }

/* (c) letterhead: a faint α monogram fills the empty right, premium stationery */
.crr-open { position: relative; overflow: hidden; }
.crr-open__mark {
  position: absolute; z-index: 0; right: -1.5%; top: 54%;
  transform: translateY(-50%);
  font-family: var(--display); font-style: normal; font-weight: 400;
  font-size: clamp(18rem, 37vw, 42rem); line-height: 0.72;
  color: var(--accent); opacity: 0.055;
  pointer-events: none; user-select: none;
}
.crr-open .container { position: relative; z-index: 1; }
@media (max-width: 720px) { .crr-open__mark { font-size: 26rem; right: -12%; top: 60%; opacity: 0.045; } }

/* (d) refined button physics (scoped; no scroll-reveal) */
.crr-open .btn--primary,
.crr-apply .btn--primary {
  box-shadow: 0 1px 2px rgba(28,21,8,0.06), 0 12px 24px -14px rgba(186,112,39,0.42);
  transition: transform var(--dur) var(--ease), background-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.crr-open .btn--primary:hover,
.crr-apply .btn--primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(28,21,8,0.08), 0 16px 30px -14px rgba(186,112,39,0.52);
}
.crr-open .btn--ghost { transition: transform var(--dur) var(--ease), background-color var(--dur) var(--ease), color var(--dur) var(--ease), border-color var(--dur) var(--ease); }
.crr-open .btn--ghost:hover { transform: translateY(-1px); }
.crr-open .btn:active, .crr-apply .btn:active { transform: translateY(0) scale(0.985); }

/* (d) premium form fields inside the invitation card */
.crr-apply .field input,
.crr-apply .field textarea {
  background: #FFFEFB;
  border: 1px solid rgba(28,21,8,0.12);
  border-radius: 11px;
  box-shadow: inset 0 1px 2px rgba(28,21,8,0.05);
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.crr-apply .field input:focus,
.crr-apply .field textarea:focus {
  outline: none; border-color: var(--accent);
  box-shadow: inset 0 1px 2px rgba(28,21,8,0.03), 0 0 0 3px var(--accent-wash-2);
}

/* the "ver todas" / aside links: a refined hairline underline that grows on hover */
.crr-shelf__more a, .crr-apply__aside a { position: relative; }
@media (prefers-reduced-motion: reduce) {
  .crr-open .btn, .crr-apply .btn, .crr-apply .field input, .crr-apply .field textarea { transition: none; }
}

/* apply is now ONE centered premium card (was a sparse intro + a detached form
   that read unbalanced) — the same card language as the note + shelf */
.crr-apply__card { max-width: 52rem; margin-inline: auto; padding: clamp(1.8rem, 4vw, 3.4rem); }
.crr-apply__form { background: none; border: 0; box-shadow: none; padding: 0; margin-top: clamp(1.4rem, 3vw, 2rem); }
.crr-apply__aside { margin-top: clamp(1.4rem, 2.6vw, 2rem); }

/* ============================================================
   CARREIRAS — v17 "the LETTER is the centerpiece"
   Client 2026-07-06: "I don't know what that α in the background is / where it
   came from" + "I want the card to be the centerpiece — an actual card, 'uma
   carta dos fundadores', come work with us — and then 'leave your name' under."
   → Removed the letterhead hero (and its α monogram) and the shelf card. The
   page is now exactly: the founders' LETTER as the one hero card (the whole
   pitch in their voice, ending "vem trabalhar com a gente"), then the "Deixe o
   seu nome" form directly UNDER it, kept lighter so the letter stays the star.
   Keeps the v16 premium card material + the film-grain. .crr-open/.crr-shelf/
   .crr-apply rules above are now DEAD.
   ============================================================ */

/* the page opens on the letter — clear the fixed header + a generous top */
.crr-letter { padding-top: calc(var(--header-h) + clamp(2.6rem, 6vh, 4.8rem)); padding-bottom: clamp(2rem, 4vw, 3rem); }

/* the letter is the centerpiece: a touch larger, more presence */
.crr-letter__card { max-width: 54rem; padding: clamp(2rem, 4.5vw, 4rem); }

/* a refined "from" superscription — a warm letter's subject line, NOT a
   tiny-caps eyebrow (sentence-case muted serif + a short terracotta rule) */
.crr-letter__from {
  font-family: var(--display); font-weight: 400; font-style: normal;
  font-size: var(--fs-small); color: var(--ink-muted);
  margin: 0 0 clamp(0.9rem, 1.8vw, 1.3rem);
  display: flex; align-items: center; gap: 0.7em;
}
.crr-letter__from::before { content: ""; width: 1.9em; height: 1px; background: var(--accent); flex: none; }
.crr-letter__h { font-size: var(--fs-h2); margin-bottom: clamp(1.1rem, 2.2vw, 1.6rem); }

/* --- DEIXE O SEU NOME — the form, UNDER the letter (on the oat ground; kept
   lighter than the card so the letter stays the centerpiece) --- */
.crr-name { background: var(--oat); padding-top: clamp(1.8rem, 3.5vw, 3rem); }
.crr-name__inner { max-width: 44rem; margin-inline: auto; }
.crr-name__h { font-family: var(--display); font-weight: 400; font-size: var(--fs-h3); line-height: 1.08; letter-spacing: -0.015em; color: var(--ink); margin: 0; }
.crr-name__h .accent { color: var(--accent); font-style: normal; }
.crr-name__lead { font-family: var(--sans); font-size: var(--fs-lead); line-height: 1.5; color: var(--ink-muted); margin: 0.85rem 0 clamp(1.6rem, 3vw, 2.2rem); max-width: 48ch; }
.crr-name__note { margin-top: 0.6rem; font-family: var(--sans); font-size: var(--fs-xs); color: var(--ink-faint); line-height: 1.5; }
.crr-name__aside { margin-top: clamp(1.4rem, 2.6vw, 2rem); padding-top: clamp(1.2rem, 2vw, 1.5rem); border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 0.5rem 1.8rem; }
.crr-name__aside a { display: inline-flex; align-items: center; gap: 0.5em; font-family: var(--sans); font-size: var(--fs-small); color: var(--ink-muted); transition: color var(--dur) var(--ease); }
.crr-name__aside a:hover { color: var(--accent-deep); }
.crr-name__aside .msym { font-size: 1.1rem; color: var(--ink-faint); }

/* premium form fields under the letter */
.crr-name .field input, .crr-name .field textarea {
  background: #FFFEFB; border: 1px solid rgba(28,21,8,0.12); border-radius: 11px;
  box-shadow: inset 0 1px 2px rgba(28,21,8,0.05);
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.crr-name .field input:focus, .crr-name .field textarea:focus {
  outline: none; border-color: var(--accent);
  box-shadow: inset 0 1px 2px rgba(28,21,8,0.03), 0 0 0 3px var(--accent-wash-2);
}
.crr-name .btn--primary {
  box-shadow: 0 1px 2px rgba(28,21,8,0.06), 0 12px 24px -14px rgba(186,112,39,0.42);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.crr-name .btn--primary:hover { transform: translateY(-1px); box-shadow: 0 2px 4px rgba(28,21,8,0.08), 0 16px 30px -14px rgba(186,112,39,0.52); }
.crr-name .btn:active { transform: translateY(0) scale(0.985); }
.crr-name .form__success {
  background: linear-gradient(180deg, #FFFEFB 0%, var(--paper) 58%);
  border: 1px solid rgba(28,21,8,0.07); border-radius: 20px;
  padding: clamp(1.6rem, 3vw, 2.4rem);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.85), 0 10px 22px -14px rgba(48,34,14,0.20), 0 34px 64px -32px rgba(48,34,14,0.32);
}
.crr-name .form__success h3 { font-family: var(--display); font-weight: 400; font-size: var(--fs-h3); margin: 0 0 0.5rem; color: var(--ink); }
.crr-name .form__success p { font-family: var(--sans); font-size: var(--fs-body); line-height: 1.55; color: var(--ink-muted); margin: 0; max-width: 44ch; }
@media (prefers-reduced-motion: reduce) {
  .crr-name .btn, .crr-name .field input, .crr-name .field textarea { transition: none; }
}

/* switcher summary must match the nav links over the light hero (added 2026-07-07) */
.site-header:not(.site-header--solid) .lang-switch > summary { color: var(--ink-muted); }
.site-header:not(.site-header--solid) .lang-switch > summary:hover,
.site-header:not(.site-header--solid) .lang-switch[open] > summary { color: var(--ink); }

/* CV upload (added 2026-07-08): the native file input dressed to the system,
   with the picker button as a small ghost pill */
.crr-name .field input.crr-cv {
  padding: 0.62em 0.7em;
  color: var(--ink-muted);
  cursor: pointer;
}
.crr-name .field input.crr-cv::file-selector-button {
  font-family: var(--sans);
  font-size: 0.88rem;
  font-weight: 500;
  color: var(--ink);
  background: transparent;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  padding: 0.4em 1.1em;
  margin-right: 0.9em;
  cursor: pointer;
  transition: background-color var(--dur) var(--ease), color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.crr-name .field input.crr-cv::file-selector-button:hover {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
}