@import url("/artigos/gasto-energetico-atletas-formulas-pontzer/article.css");

.hero h1 { max-width: 1100px; font-size: clamp(46px, 5.7vw, 84px); }
.hero::after { transform: rotate(-3deg); }
.system-principles {
  display: grid;
  gap: 1px;
  margin: 38px 0 58px;
  padding: 1px;
  background: rgba(27,32,39,.14);
  list-style: none;
}
.system-principles li {
  display: grid;
  grid-template-columns: 126px minmax(0,1fr);
  gap: 22px;
  margin: 0;
  padding: 22px 24px;
  background: #fbf2e4;
}
.system-principles strong {
  color: #7b5924;
  font: 500 10px/1.5 "JetBrains Mono", monospace;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.system-principles span { color: #4d463f; font-size: 14px; line-height: 1.68; }
.visual-panel {
  position: relative;
  overflow: hidden;
  padding: 10px;
  background: radial-gradient(circle at 88% 8%, rgba(224,180,95,.16), transparent 28%), #0b1828;
  border: 1px solid rgba(224,180,95,.34);
  box-shadow: 0 24px 60px rgba(27,32,39,.2);
}
.visual-panel img { width: 100%; height: auto; }
.hypotheses {
  margin: 40px 0 58px;
  border-top-color: rgba(145,106,47,.34);
}
.hypotheses li {
  grid-template-columns: 52px minmax(0,1fr);
  gap: 20px;
  padding: 25px 4px 25px 0;
  align-items: start;
  border-bottom-color: rgba(27,32,39,.13);
}
.hypotheses li::before {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 1px solid rgba(145,106,47,.36);
  border-radius: 50%;
  background: rgba(224,180,95,.08);
  color: #865f27;
}
.hypothesis-copy { min-width: 0; }
.hypothesis-copy strong {
  display: block;
  margin: 0 0 7px;
  color: #2a2421;
  font: 600 25px/1.16 "Cormorant Garamond", serif;
  letter-spacing: -.012em;
}
.hypothesis-copy span {
  display: block;
  color: #564e46;
  font-size: 14px;
  line-height: 1.72;
}
.governance-cycle {
  margin: 46px 0 64px;
  padding: clamp(26px,4vw,42px);
  background: radial-gradient(circle at 90% 8%, rgba(224,180,95,.17), transparent 30%), #0b1828;
  color: #fff7ea;
  border: 1px solid rgba(224,180,95,.3);
}
.governance-cycle .mono { display: block; margin-bottom: 13px; color: #e0b45f; font-size: 8px; }
.governance-cycle h3 { margin: 0 0 26px; color: #fff7ea; font-size: clamp(29px,4vw,42px); }
.cycle-line { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; }
.cycle-line span:not(.arrow) {
  padding: 10px 13px;
  border: 1px solid rgba(255,247,234,.17);
  background: rgba(255,247,234,.055);
  color: #eadfce;
  font-size: 11px;
}
.cycle-line .arrow { color: #e0b45f; font-size: 13px; }
.faq { margin-top: 84px; }
.faq > h2 { margin-bottom: 24px; }
.faq details { border-top: 1px solid rgba(27,32,39,.18); }
.faq details:last-child { border-bottom: 1px solid rgba(27,32,39,.18); }
.faq summary {
  position: relative;
  padding: 22px 42px 22px 0;
  color: #282228;
  cursor: pointer;
  list-style: none;
  font: 600 23px/1.25 "Cormorant Garamond", serif;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 5px; top: 19px; color: #916a2f; font: 400 27px/1 Inter,sans-serif; }
.faq details[open] summary::after { content: "−"; }
.faq details p { padding: 0 42px 22px 0; font-size: 15px; }

@media (max-width: 820px) {
  .hero h1 { font-size: clamp(43px,11.2vw,64px); }
  .system-principles li { grid-template-columns: 1fr; gap: 8px; }
  .visual-panel { padding: 6px; }
}

@media (max-width: 520px) {
  .hero h1 { font-size: 42px; }
  .hypotheses li { grid-template-columns: 42px minmax(0,1fr); gap: 12px; padding: 22px 0; }
  .hypotheses li::before { width: 34px; height: 34px; }
  .hypothesis-copy strong { font-size: 23px; }
  .hypothesis-copy span { font-size: 13px; line-height: 1.68; }
  .cycle-line { display: grid; grid-template-columns: 1fr; }
  .cycle-line .arrow { transform: rotate(90deg); justify-self: center; }
}