/* Honorarios: lectura clara de tarifas, proceso y ejemplo. */
.page-index section#honorarios {
  padding-block: 0;
}
.fees-panel {
  display: grid;
  grid-template-columns: 1fr;
  gap: 36px 48px;
  padding: 48px;
  background: #fff;
  border: 1px solid #ded0d9;
  border-top: 4px solid var(--plum);
  border-radius: 10px;
}
.fees-heading,
.fees-rates,
.fees-note {
  grid-column: 1 / -1;
}
.fees-guide {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  gap: 48px;
}
.fee-step-description { display: block; }
.fees-heading h2 {
  color: var(--plum);
  margin-bottom: 20px;
}
.fees-heading p {
  max-width: 880px;
  font-size: 16px;
  line-height: 1.85;
  color: #51424c;
}
.fees-rates {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.fees-rate {
  padding: 24px 22px;
  background: #f7f0f4;
  border: 1px solid #e6d6e0;
  border-radius: 6px;
}
.fees-rate:first-child {
  background: #eee0e9;
  border-color: #d8bbcd;
}
.fees-rate:last-child {
  background: #f5f5f3;
  border-color: #e0e0dc;
}
.fees-rate > div:first-child {
  display: flex;
  align-items: center;
  min-height: 58px;
  margin-bottom: 14px;
  color: var(--plum);
  font: 600 43px/1.15 var(--sans);
  letter-spacing: -.045em;
}
.fees-rate:last-child > div:first-child {
  font-size: 21px;
  line-height: 1.3;
  letter-spacing: -.025em;
  color: #51484e;
}
.fees-rate > div:nth-child(2) {
  font-size: 15px;
  font-weight: 600;
  color: #442c3c;
}
.fees-rate > div:last-child {
  margin-top: 3px;
  font-size: 14px;
  color: #61515b;
}
.fees-process h3 {
  margin: 0 0 24px;
  color: var(--plum);
  font: 600 34px/1.15 var(--serif);
}
.fees-process ol {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  padding: 0;
  margin: 0;
  list-style: none;
  counter-reset: fee-step;
}
.fees-process li {
  position: relative;
  padding-left: 42px;
  color: #51424c;
  font-size: 15px;
  line-height: 1.75;
  counter-increment: fee-step;
}
.fees-process li::before {
  content: counter(fee-step);
  position: absolute;
  left: 0;
  top: 0;
  width: 27px;
  height: 27px;
  border: 1px solid #d2bfca;
  border-radius: 50%;
  background: #f7f0f4;
  color: var(--plum);
  font: 500 12px/27px var(--sans);
  text-align: center;
}
.fees-process strong {
  display: block;
  margin-bottom: 3px;
  color: #3b2735;
  font-weight: 600;
}
.fees-example {
  align-self: start;
  padding: 30px;
  margin-top: 0;
  background: #edf2eb;
  border: 1px solid #d6dfd2;
  border-radius: 6px;
  color: #3e4d3b;
  font-size: 16px;
  line-height: 1.95;
}
.fees-example > strong:first-child {
  display: block;
  margin-bottom: 15px;
  color: #354631;
  font: 600 31px/1.2 var(--serif);
}
.fees-example .fees-total {
  white-space: nowrap;
  font-weight: 700;
}
.fees-panel > .fees-note {
  margin: 0;
  padding-top: 24px;
  border-top: 1px solid var(--line);
  color: #61515b;
  font-size: 14px;
  line-height: 1.85;
  max-width: none;
}
/* Iconos de servicios coherentes con la balanza de marca. */
.service-card > .service-symbol {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #74516a;
  margin-bottom: 18px;
}
.service-symbol svg {
  width: 27px;
  height: 27px;
  flex-shrink: 0;
}
.service-symbol span {
  color: #7c6273;
  font: 500 11px var(--sans);
}
.brand-icon img {
  width: 40px;
  height: 40px;
}
@media (max-width: 1100px) {
  .fees-panel { padding: 36px; gap: 30px; }
  .fees-guide { gap: 30px; }
  .fees-rate { padding: 20px 16px; }
  .fees-rate > div:nth-child(2) { font-size: 13px; }
  .fees-rate > div:last-child { font-size: 13px; }
}
@media (max-width: 800px) {
  .fees-panel { grid-template-columns: 1fr; }
  .fees-guide { grid-template-columns: 1fr; gap: 20px; }
  .fees-process ol { grid-template-columns: 1fr; }
  .fees-rates { grid-template-columns: 1fr 1fr; }
  .fees-example { max-width: none; }
}
@media (max-width: 640px) {
  .page-index section#honorarios { padding: 0 4%; }
  .fees-panel { padding: 30px 20px; gap: 28px; }
  .fees-heading h2 { font-size: 41px; }
  .fees-heading p { font-size: 15px; line-height: 1.8; }
  .fees-rates { gap: 10px; }
  .fees-rate { padding: 18px 13px; }
  .fees-rate > div:first-child { font-size: 36px; min-height: 48px; margin-bottom: 12px; }
  .fees-rate:last-child > div:first-child { font-size: 18px; }
  .fees-rate > div:nth-child(2) { font-size: 12px; }
  .fees-rate > div:last-child { font-size: 12px; }
  .fees-guide { gap: 16px; }
  .fees-process h3 { font-size: 32px; margin-bottom: 16px; }
  .fees-process ol { gap: 10px; }
  .fees-process li { font-size: 14px; padding: 16px; border: 1px solid #e6dbe2; border-radius: 6px; background: #faf7f9; }
  .fees-process li::before { left: 16px; top: 16px; width: 24px; height: 24px; line-height: 24px; background: #fff; }
  .fees-process strong { min-height: 24px; padding-left: 34px; margin: 0; line-height: 24px; }
  .fees-process .fee-step-description { margin-top: 9px; line-height: 1.75; }
  .fees-example { padding: 20px 16px; font-size: 14px; line-height: 1.8; }
  .fees-example > strong:first-child { font-size: 26px; margin-bottom: 10px; }
  .fees-panel > .fees-note { font-size: 14px; }
  .service-card > .service-symbol { left: 0; top: 28px; }
  .service-symbol { flex-direction: column; gap: 6px !important; }
  .service-symbol svg { width: 23px; height: 23px; }
  .brand-icon img { width: 34px; height: 34px; }
}