/* Pacto pelo Esporte, experiência territorial integrada à landing. */
.pp-shell {
  --pp-navy: oklch(22% .085 283);
  --pp-deep: oklch(27% .09 282);
  --pp-blue: oklch(57% .24 267);
  --pp-orange: oklch(72% .18 48);
  --pp-purple: oklch(59% .18 327);
  --pp-ground: oklch(96% .018 80);
  --pp-paper: oklch(98% .012 80);
  --pp-ink: oklch(23% .07 276);
  --pp-muted: oklch(51% .035 276);
  --pp-progress: 0%;
  position: relative;
  overflow: clip;
  color: var(--pp-ink);
  background: var(--pp-ground);
  font-family: var(--f-sans);
}

.pp-shell h2, .pp-shell h3, .pp-shell h4 { text-wrap: balance; }
.pp-shell p { text-wrap: pretty; }
.pp-shell em { color: var(--pp-orange); font-family: var(--f-serif); font-weight: 700; }
.pp-figure { margin: 0; }
.pp-figure img { display: block; width: 100%; }
.pp-label {
  margin: 0 0 20px;
  color: var(--pp-orange);
  font-family: var(--f-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.pp-progress {
  position: fixed;
  z-index: 91;
  top: 68px;
  right: 0;
  left: 0;
  height: 3px;
  pointer-events: none;
  background: transparent;
  opacity: 0;
  transition: opacity 180ms;
}
.pp-shell.is-traversing .pp-progress { opacity: 1; }
.pp-progress span {
  display: block;
  width: var(--pp-progress);
  height: 100%;
  background: linear-gradient(90deg, var(--pp-orange), var(--pp-blue) 58%, var(--pp-purple));
  transition: width 420ms cubic-bezier(.16, 1, .3, 1);
}

.pp-index {
  position: fixed;
  z-index: 90;
  top: 50%;
  left: max(18px, calc((100vw - 1510px) / 2));
  display: flex;
  flex-direction: column;
  gap: 2px;
  transform: translateY(-50%);
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms;
}
.pp-shell.is-traversing .pp-index { opacity: 1; pointer-events: auto; }
.pp-index a {
  display: grid;
  grid-template-columns: 28px 1fr;
  align-items: center;
  min-height: 38px;
  color: color-mix(in oklch, var(--pp-ink) 58%, transparent);
  font-size: 11px;
  text-decoration: none;
}
.pp-index b { color: inherit; font-family: var(--f-display); font-size: 10px; }
.pp-index span {
  padding: 2px 6px;
  opacity: 0;
  background: color-mix(in oklch, var(--pp-ground) 90%, transparent);
  transform: translateX(-5px);
  transition: opacity 160ms, transform 160ms;
}
.pp-index a:hover span, .pp-index a:focus-visible span, .pp-index a[aria-current="step"] span {
  opacity: 1;
  transform: none;
}
.pp-index a[aria-current="step"], .pp-index a.is-active { color: var(--pp-orange); }

.pp-hero {
  min-height: 100svh;
  display: grid;
  grid-template-columns: minmax(350px, .72fr) 1.35fr;
  align-items: center;
  gap: clamp(40px, 5vw, 82px);
  padding: clamp(110px, 10vw, 160px) var(--lp-grid-edge) 90px;
  color: var(--pp-paper);
  background: var(--pp-navy);
}
.pp-hero h2 {
  margin: 0 0 28px;
  color: var(--pp-paper);
  font-family: var(--f-display);
  font-size: clamp(70px, 8vw, 126px);
  line-height: .88;
  letter-spacing: -.045em;
}
.pp-lead { max-width: 34rem; color: oklch(89% .025 278); font-size: clamp(17px, 1.4vw, 21px); line-height: 1.65; }
.pp-hero .pp-figure img { clip-path: polygon(8% 0, 100% 0, 100% 100%, 0 100%, 0 17%); }
.pp-hero figcaption {
  margin-top: 9px;
  color: oklch(75% .03 278);
  font-size: 10px;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.pp-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  min-height: 48px;
  margin-top: 18px;
  padding: 12px 22px;
  color: var(--pp-paper);
  background: var(--pp-blue);
  border: 0;
  border-radius: 4px;
  font-family: var(--f-display);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: background 160ms, transform 160ms;
}
.pp-button:hover { background: color-mix(in oklch, var(--pp-blue) 82%, var(--pp-navy)); transform: translateY(-2px); }
.pp-button:focus-visible, .pp-plan-link:focus-visible, .pp-section-link:focus-visible, .pp-ending-link:focus-visible, .pp-index a:focus-visible, .pp-shell summary:focus-visible { outline: 3px solid var(--pp-orange); outline-offset: 4px; }
.pp-plan-link { display: inline-flex; gap: 10px; margin: 24px 0 0 18px; color: var(--pp-paper); font-family: var(--f-display); font-size: 13px; font-weight: 700; text-decoration: underline; text-decoration-color: color-mix(in oklch, var(--pp-orange) 70%, transparent); text-underline-offset: 6px; }
.pp-plan-link:hover { color: var(--pp-orange); }
.pp-section-link { display: flex; align-items: center; justify-content: space-between; gap: 24px; width: min(100%,420px); margin: 46px 0 0 auto; padding: 15px 0; color: inherit; border-top: 1px solid currentColor; font-family: var(--f-display); font-size: 13px; font-weight: 700; text-decoration: none; }
.pp-section-link span { font-size: 18px; transition: transform 180ms cubic-bezier(.16,1,.3,1); }
.pp-section-link:hover span { transform: translate(3px,-3px); }
.pp-manifesto .pp-section-link { color: var(--pp-ink); }
.pp-chapter--base .pp-section-link, .pp-budget .pp-section-link { color: var(--pp-ink); }
.pp-chapter--structure .pp-section-link, .pp-chapter--athlete .pp-section-link { color: var(--pp-paper); }
.pp-ending-link { display: block; width: fit-content; margin-top: 22px; color: var(--pp-paper); font-size: 13px; font-weight: 700; text-underline-offset: 5px; }

.pp-manifesto {
  position: relative;
  min-height: 78svh;
  display: grid;
  align-content: center;
  padding: clamp(120px, 14vw, 210px) max(12vw, calc((100vw - 1080px) / 2));
  background: var(--pp-paper);
}
.pp-manifesto::before { content: ""; position: absolute; top: 0; left: 0; width: 38%; height: 8px; background: var(--pp-orange); }
.pp-manifesto h3 {
  max-width: 980px;
  margin: 0;
  font-family: var(--f-display);
  font-size: clamp(52px, 6.4vw, 96px);
  line-height: .94;
  letter-spacing: -.045em;
}
.pp-manifesto em { color: var(--pp-blue); }
.pp-manifesto p { max-width: 610px; margin: 64px 0 0 auto; font-size: 19px; }

.pp-chapter { padding: clamp(120px, 12vw, 190px) var(--lp-grid-edge); }
.pp-heading { display: flex; align-items: flex-start; gap: 26px; margin-bottom: clamp(55px, 7vw, 98px); }
.pp-heading > span {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  color: var(--pp-navy);
  background: var(--pp-orange);
  font-family: var(--f-display);
  font-size: 12px;
}
.pp-heading p { margin: 0 0 6px; font-family: var(--f-display); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.pp-heading h3 { margin: 0; font-family: var(--f-display); font-size: clamp(64px, 8vw, 118px); line-height: .84; letter-spacing: -.045em; }
.pp-chapter--base { background: oklch(93% .027 73); }
.pp-base-grid { display: grid; grid-template-columns: 1.38fr .62fr; align-items: center; gap: clamp(42px, 7vw, 110px); }
.pp-base-grid > .pp-figure { margin-left: -8vw; }
.pp-copy h4, .pp-athlete h4 { margin: 0 0 25px; font-family: var(--f-serif); font-size: clamp(30px, 3vw, 48px); line-height: 1.04; }
.pp-copy > p { max-width: 60ch; }
.pp-metrics { display: flex; margin: 38px 0; border-top: 1px solid oklch(30% .04 276 / .24); border-bottom: 1px solid oklch(30% .04 276 / .24); }
.pp-metrics div { flex: 1; padding: 18px 14px 20px 0; }
.pp-metrics div + div { padding-left: 14px; border-left: 1px solid oklch(30% .04 276 / .2); }
.pp-metrics dt { color: var(--pp-orange); font-family: var(--f-display); font-size: clamp(28px, 3.5vw, 52px); font-weight: 700; line-height: 1; }
.pp-metrics dd { max-width: 108px; margin: 7px 0 0; font-size: 13px; line-height: 1.4; }
.pp-shell details { border-top: 1px solid oklch(30% .04 276 / .22); padding-top: 16px; }
.pp-shell summary { font-family: var(--f-display); font-size: 13px; font-weight: 700; cursor: pointer; }

.pp-chapter--structure { min-height: 100svh; color: var(--pp-paper); background: var(--pp-blue); }
.pp-chapter--structure .pp-heading > span { color: var(--pp-blue); background: var(--pp-paper); }
.pp-structure-intro { display: grid; grid-template-columns: .65fr 1.35fr; align-items: end; gap: 36px; margin: 0 0 38px; }
.pp-structure-intro .pp-label { margin: 0; color: oklch(88% .12 76); }
.pp-structure-intro h4 { max-width: 760px; margin: 0; color: var(--pp-paper); font-family: var(--f-display); font-size: clamp(28px,3.1vw,48px); line-height: 1.05; letter-spacing: -.025em; }
.pp-route {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: stretch;
  margin: 0;
  padding: 0;
  border-top: 1px solid oklch(95% .025 275 / .45);
  border-bottom: 1px solid oklch(95% .025 275 / .22);
  list-style: none;
}
.pp-route::before { content: ""; position: absolute; top: -2px; right: 0; left: 0; height: 4px; background: linear-gradient(90deg, var(--pp-orange), oklch(75% .12 270), var(--pp-paper)); }
.pp-route li { position: relative; display: grid; grid-template-columns: 48px 1fr; gap: 16px; min-width: 0; padding: 32px clamp(16px,2vw,30px) 34px; text-align: left; }
.pp-route li + li { border-left: 1px solid oklch(95% .025 275 / .2); }
.pp-route li > span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  margin: 0;
  color: var(--pp-paper);
  background: transparent;
  border: 1px solid oklch(95% .025 275 / .62);
  border-radius: 50%;
  font-family: var(--f-display);
  font-size: 11px;
  font-weight: 700;
}
.pp-route b, .pp-route small { display: block; }
.pp-route small { margin: 1px 0 8px; color: oklch(86% .12 76); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.pp-route b { font-family: var(--f-display); font-size: 20px; }
.pp-route li p { max-width: 23ch; margin: 8px 0 0; color: oklch(89% .035 275); font-size: 13px; line-height: 1.5; }
.pp-structure-result { display: grid; grid-template-columns: repeat(3,auto); justify-content: end; gap: clamp(24px,4vw,60px); margin: 32px 0 0; }
.pp-structure-result div { display: grid; grid-template-columns: auto minmax(90px,150px); align-items: baseline; gap: 10px; }
.pp-structure-result dt { color: oklch(86% .13 77); font-family: var(--f-display); font-size: clamp(25px,3vw,44px); font-weight: 700; }
.pp-structure-result dd { margin: 0; font-size: 12px; line-height: 1.4; }

.pp-chapter--athlete { color: var(--pp-paper); background: var(--pp-navy); }
.pp-chapter--athlete .pp-heading > span { color: var(--pp-paper); background: var(--pp-purple); }
.pp-athlete { max-width: 1060px; margin-left: auto; }
.pp-athlete h4 { max-width: 800px; font-size: clamp(44px, 5vw, 76px); }
.pp-athlete ol { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); margin: 80px 0 45px; padding: 0; list-style: none; }
.pp-athlete ol::before { content: ""; position: absolute; right: 7%; left: 7%; top: -26px; height: 4px; background: linear-gradient(90deg, var(--pp-orange), var(--pp-blue), var(--pp-purple)); }
.pp-athlete li { padding: 18px; }
.pp-athlete li + li { border-left: 1px solid oklch(95% .02 275 / .18); }
.pp-athlete li span { display: block; margin-bottom: 12px; color: var(--pp-orange); font-family: var(--f-display); font-size: 11px; }
.pp-athlete li b, .pp-athlete li small { display: block; }
.pp-athlete li b { font-family: var(--f-display); font-size: 18px; }
.pp-athlete li small { color: oklch(82% .025 276); font-size: 14px; line-height: 1.45; }

.pp-budget { position: relative; min-height: 100svh; display: grid; grid-template-columns: .95fr 1.05fr; align-items: center; gap: clamp(70px, 9vw, 150px); padding: clamp(140px, 14vw, 220px) var(--lp-grid-edge); background: var(--pp-paper); }
.pp-budget::before { content: ""; position: absolute; top: 0; left: 0; width: 52%; height: 8px; background: var(--pp-blue); }
.pp-budget h3, .pp-ending h3 { margin: 0 0 30px; font-family: var(--f-display); font-size: clamp(54px, 6vw, 94px); line-height: .92; letter-spacing: -.045em; }
.pp-budget em { color: var(--pp-blue); }
.pp-budget-total { display: flex; justify-content: space-between; align-items: baseline; }
.pp-budget-total b { font-family: var(--f-display); font-size: clamp(31px, 3.7vw, 56px); line-height: 1; }
.pp-budget-total span, .pp-budget-scale small { color: var(--pp-muted); font-size: 14px; }
.pp-budget-track { position: relative; height: 28px; margin: 22px 0 10px; background: var(--pp-orange); }
.pp-budget-track span { position: absolute; inset: 0 auto 0 0; width: max(2px, .00697%); background: var(--pp-blue); box-shadow: 0 0 0 5px var(--pp-paper), 0 0 0 7px var(--pp-blue); }
.pp-budget-scale dl { margin: 64px 0 0; border-top: 1px solid oklch(30% .04 276 / .22); }
.pp-budget-scale dl div { display: flex; justify-content: space-between; align-items: baseline; padding: 18px 0; border-bottom: 1px solid oklch(30% .04 276 / .22); }
.pp-budget-scale dt { color: var(--pp-muted); font-size: 14px; }
.pp-budget-scale dd { margin: 0; font-family: var(--f-display); font-size: clamp(19px, 2vw, 28px); font-weight: 700; }

.pp-ending { min-height: 88svh; display: grid; grid-template-columns: 1.15fr .85fr; align-items: stretch; color: var(--pp-paper); background: var(--pp-deep); }
.pp-ending .pp-figure { min-height: 640px; overflow: hidden; }
.pp-ending .pp-figure img { width: 100%; height: 100%; object-fit: cover; }
.pp-ending .pp-copy { display: grid; align-content: center; padding: 70px clamp(30px, 7vw, 115px) 70px 7vw; }
.pp-ending .pp-copy > p:not(.pp-label) { max-width: 44ch; }
.pp-ending em { color: oklch(68% .16 329); }

@media (max-width: 900px) {
  .pp-index { top: auto; right: 0; bottom: 0; left: 0; flex-direction: row; justify-content: space-around; padding: 7px 8px; background: var(--pp-navy); transform: none; }
  .pp-index a { display: flex; flex-direction: column; justify-content: center; min-width: 50px; color: oklch(83% .02 278); }
  .pp-index span { padding: 0; opacity: 1; color: inherit; background: transparent; font-size: 9px; transform: none; }
  .pp-progress { top: auto; bottom: 52px; }
  .pp-hero { grid-template-columns: 1fr; padding: 110px 20px 72px; }
  .pp-hero h2 { font-size: clamp(64px, 19vw, 92px); }
  .pp-hero .pp-figure img { clip-path: none; }
  .pp-manifesto { min-height: 72svh; padding: 110px 20px; }
  .pp-manifesto h3 { font-size: clamp(46px, 13vw, 72px); }
  .pp-manifesto p { margin: 45px 0 0; font-size: 17px; }
  .pp-chapter { padding: 105px 20px; }
  .pp-base-grid { grid-template-columns: 1fr; }
  .pp-base-grid > .pp-figure { margin: 0 -20px; }
  .pp-heading h3 { font-size: clamp(62px, 18vw, 94px); }
  .pp-metrics { justify-content: space-between; }
  .pp-structure-intro { grid-template-columns: 1fr; gap: 10px; margin-bottom: 32px; }
  .pp-structure-intro h4 { font-size: clamp(27px,9vw,38px); }
  .pp-route { grid-template-columns: 1fr; border: 0; }
  .pp-route::before { top: 20px; right: auto; bottom: 20px; left: 21px; width: 1px; height: auto; background: oklch(95% .025 275 / .42); }
  .pp-route li { grid-template-columns: 44px 1fr; gap: 18px; padding: 0 0 34px; }
  .pp-route li + li { border: 0; }
  .pp-route li > span { z-index: 1; width: 42px; height: 42px; background: var(--pp-blue); }
  .pp-route li p { max-width: 27ch; }
  .pp-structure-result { grid-template-columns: 1fr; justify-content: stretch; gap: 0; margin-top: 8px; border-top: 1px solid oklch(95% .025 275 / .25); }
  .pp-structure-result div { grid-template-columns: 82px 1fr; padding: 13px 0; border-bottom: 1px solid oklch(95% .025 275 / .18); }
  .pp-structure-result dt { font-size: 28px; }
  .pp-structure-result dd { max-width: 22ch; font-size: 12px; }
  .pp-athlete ol { grid-template-columns: 1fr; margin-top: 42px; }
  .pp-athlete ol::before { top: 0; right: auto; bottom: 0; left: 20px; width: 4px; height: auto; }
  .pp-athlete li { padding-left: 58px; }
  .pp-athlete li + li { border: 0; }
  .pp-budget { grid-template-columns: 1fr; padding: 120px 20px; }
  .pp-ending { grid-template-columns: 1fr; }
  .pp-ending .pp-figure { min-height: 54svh; }
  .pp-ending .pp-copy { padding: 75px 20px 110px; }
}

.pp-shell.is-traversing ~ .lp-whatsapp-fab {
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
}

@media (prefers-reduced-motion: reduce) {
  .pp-shell *, .pp-shell *::before, .pp-shell *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Encaixe pós-QA: dock estável e composição otimizada para telas largas/baixas. */
@media (min-width: 901px) {
  .pp-index {
    top: 50%;
    left: 18px;
    width: 48px;
    gap: 3px;
    padding: 8px 6px;
    color: var(--pp-paper);
    background: color-mix(in oklch, var(--pp-navy) 94%, transparent);
    border: 1px solid oklch(96% .02 278 / .14);
    border-radius: 6px;
    box-shadow: 0 16px 38px oklch(10% .04 280 / .18);
    overflow: visible;
    transition: width 220ms cubic-bezier(.16, 1, .3, 1), opacity 180ms, box-shadow 180ms;
  }
  .pp-index:hover, .pp-index:focus-within { width: 150px; }
  .pp-index a {
    grid-template-columns: 34px 84px;
    min-height: 40px;
    padding: 0;
    color: oklch(84% .025 278 / .62);
    border-radius: 3px;
  }
  .pp-index a:hover, .pp-index a:focus-visible { color: var(--pp-paper); background: oklch(98% .01 278 / .07); }
  .pp-index a[aria-current="step"], .pp-index a.is-active { color: var(--pp-navy); background: var(--pp-orange); }
  .pp-index a[aria-current="step"] b, .pp-index a.is-active b { color: var(--pp-navy); }
  .pp-index span {
    padding: 0;
    opacity: 0;
    color: inherit;
    background: transparent;
    transform: translateX(-5px);
    font-size: 12px;
    white-space: nowrap;
    transition: opacity 140ms, transform 180ms;
  }
  .pp-index:hover span, .pp-index:focus-within span { opacity: 1; transform: none; }
  .pp-index b { display: grid; place-items: center; width: 34px; min-height: 30px; }
  .pp-chapter { min-height: 100svh; display: grid; align-content: center; }
  .pp-heading { margin-bottom: clamp(42px, 5vh, 70px); }
  .pp-chapter--base { padding-top: clamp(92px, 10vh, 130px); padding-bottom: clamp(92px, 10vh, 130px); }
  .pp-base-grid { align-items: center; }
  .pp-base-grid > .pp-figure { align-self: center; }
  .pp-base-grid > .pp-copy { max-width: 480px; }
  .pp-chapter--structure { padding-top: clamp(90px, 9vh, 125px); padding-bottom: clamp(80px, 8vh, 110px); }
  .pp-chapter--structure .pp-heading { margin-bottom: clamp(34px, 4vh, 55px); }
  .pp-route { min-height: 0; }
  .pp-chapter--athlete {
    grid-template-columns: minmax(270px, .42fr) minmax(620px, 1fr);
    column-gap: clamp(55px, 7vw, 120px);
    align-items: center;
  }
  .pp-chapter--athlete .pp-heading { align-self: start; margin: 0; }
  .pp-chapter--athlete .pp-heading h3 { font-size: clamp(66px, 7vw, 108px); }
  .pp-athlete { width: 100%; }
  .pp-athlete h4 { font-size: clamp(44px, 4.3vw, 70px); }
  .pp-budget { min-height: 100svh; }
  .pp-ending .pp-button { justify-self: start; width: auto; }
}

@media (max-height: 760px) and (min-width: 901px) {
  .pp-hero { min-height: 760px; padding-top: 100px; padding-bottom: 64px; }
  .pp-manifesto { min-height: 720px; padding-top: 110px; padding-bottom: 110px; }
  .pp-chapter { min-height: 720px; }
  .pp-chapter--base, .pp-chapter--structure, .pp-chapter--athlete { padding-top: 86px; padding-bottom: 70px; }
  .pp-heading { margin-bottom: 36px; }
  .pp-heading h3 { font-size: clamp(62px, 6vw, 92px); }
  .pp-route { min-height: 0; }
  .pp-budget { min-height: 720px; padding-top: 105px; padding-bottom: 90px; }
}

@media (max-width: 900px) {
  .pp-index { box-shadow: 0 -8px 24px oklch(10% .04 280 / .18); }
  .pp-index a[aria-current="step"] b, .pp-index a[aria-current="step"] span,
  .pp-index a.is-active b, .pp-index a.is-active span { color: var(--pp-orange); }
  .pp-ending .pp-button { justify-self: start; width: auto; }
  .pp-chapter, .pp-budget, .pp-ending .pp-copy { padding-bottom: 132px; }
  .pp-metrics { margin-bottom: 20px; }
  .pp-section-link { width: 100%; margin-top: 32px; }
}
