/* Revisión Home y Áreas - 07/11/2026. */

/* Home: todos los ítems principales del menú comparten una única escala. */
.home-page .home-masthead #home-nav > a,
.home-page .home-masthead #home-nav .home-dropdown > a {
  color: #171313 !important;
  font: 600 11px/1.3 Lato, Arial, sans-serif !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  white-space: nowrap;
}
.home-page .home-masthead #home-nav .home-submenu-toggle {
  font-size: 13px !important;
  line-height: 1 !important;
}

/* Acerca Áreas al cierre de "Quién soy" sin eliminar su separación. */
.home-page .home-areas { padding-top: 36px !important; }

/* Botón flotante: un único círculo nítido y ligeramente mayor en escritorio. */
.home-page .global-footer > .wa-link {
  width: 54px !important;
  height: 54px !important;
  border: 2px solid #fff !important;
  background: var(--wine) !important;
  color: #fff !important;
  box-shadow: 0 4px 13px rgba(0, 0, 0, .23) !important;
}
.home-page .global-footer > .wa-link svg {
  width: 29px !important;
  height: 29px !important;
  fill: currentColor !important;
  stroke: none !important;
}

/* Áreas: continuidad entre bloques y menor espacio final de Contratos. */
.page-areas .practice-area { padding-bottom: 28px; }
.page-areas .practice-area + .practice-area { margin-top: 6px; }
.page-areas .practice-area--contracts { padding-bottom: 18px; }

/* Familia: la tarjeta se alinea con la fotografía, pero conserva su altura
   propia. Así se evita tanto el hueco bajo la tarjeta como los espacios
   artificiales entre los asuntos. */
.page-areas .family-layout__detail .practice-topics {
  align-self: start;
  display: block;
  margin-top: clamp(130px, 11vw, 170px);
  padding: 20px 22px;
}
.page-areas .family-layout__detail .practice-topics ul {
  align-content: normal;
  row-gap: 10px;
}

/* El título entra en una línea en escritorio sin afectar su lectura móvil. */
#penal .penal-family-support > h2 {
  max-width: none !important;
  font-size: clamp(19px, 1.55vw, 22px) !important;
  line-height: 1.22 !important;
  white-space: nowrap;
}

/* El footer de Áreas adopta exactamente el sistema compacto de la Home. */
.page-areas .global-footer {
  background: var(--footer) !important;
  color: #fff9f4 !important;
  padding: 23px 0 25px !important;
}
.page-areas .global-footer .footer-columns {
  width: min(var(--content), calc(100% - 48px)) !important;
  grid-template-columns: 1.05fr .95fr 1fr !important;
  gap: 34px !important;
}
.page-areas .global-footer .footer-brand {
  font: 400 19px/1.16 'Julius Sans One', sans-serif !important;
}
.page-areas .global-footer .footer-identity p,
.page-areas .global-footer .footer-identity small,
.page-areas .global-footer .footer-navigation a,
.page-areas .global-footer .footer-detail {
  font: 400 13px/1.35 Lato, Arial, sans-serif !important;
  color: #fff9f4 !important;
}
.page-areas .global-footer .footer-navigation h2,
.page-areas .global-footer .footer-contact h2 {
  font: 400 13px/1.2 'Julius Sans One', sans-serif !important;
}
.page-areas .global-footer > .wa-link {
  width: 54px !important;
  height: 54px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  line-height: 0 !important;
  border: 2px solid #fff !important;
  background: var(--wine) !important;
}
.page-areas .global-footer > .wa-link svg {
  display: block !important;
  width: 29px !important;
  height: 29px !important;
  flex: none !important;
  fill: currentColor !important;
  stroke: none !important;
}

/* Cómo trabajo: la navegación interna usa el mismo comportamiento fijo que Áreas. */
.work-pilot__section-nav--sticky {
  position: relative;
  z-index: 25;
  width: 100%;
  max-width: none;
  min-height: 43px;
  margin: 8px 0 18px;
  padding: 0 !important;
  border-top: 1px solid rgba(158, 32, 43, .18);
  border-bottom: 1px solid rgba(158, 32, 43, .25);
  background: rgba(247, 243, 236, .96);
  backdrop-filter: blur(8px);
}
.work-pilot__section-nav--sticky.is-fixed { position: fixed; top: 0; left: 0; right: 0; z-index: 100; }
.work-pilot__section-nav--sticky.is-stopped { position: absolute; top: auto; bottom: 0; left: 0; right: 0; }
.work-pilot__section-nav--sticky .work-pilot__section-nav-inner {
  width: min(100% - 84px, 1220px);
  min-height: 43px;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: stretch;
}
.work-pilot__section-nav--sticky a {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 20px;
  border-right: 1px solid rgba(158, 32, 43, .32);
  color: #7d4a43;
  font: 700 11px/1.25 Lato, Arial, sans-serif;
  letter-spacing: .055em;
  text-align: center;
  text-decoration: none;
}
.work-pilot__section-nav--sticky a:last-child { border-right: 0; }
.work-pilot__section-nav--sticky a.is-active { color: #9e202b; background: #f0e5d7; }

@media (max-width: 760px) {
  .home-page .home-areas { padding-top: 28px !important; }
  .home-page .global-footer > .wa-link { width: 46px !important; height: 46px !important; }
  .home-page .global-footer > .wa-link svg { width: 25px !important; height: 25px !important; }
  .page-areas .global-footer .footer-columns { width: calc(100% - 32px) !important; grid-template-columns: 1fr !important; gap: 18px !important; }
  .page-areas .family-layout__detail .practice-topics { margin-top: 0; }
  #penal .penal-family-support > h2 { white-space: normal; }
  .page-areas .global-footer > .wa-link { width: 46px !important; height: 46px !important; }
  .page-areas .global-footer > .wa-link svg { width: 25px !important; height: 25px !important; }
  .work-pilot__section-nav--sticky { min-height: 38px; margin: 6px 0 12px; }
  .work-pilot__section-nav--sticky .work-pilot__section-nav-inner { width: 100%; min-height: 38px; }
  .work-pilot__section-nav--sticky a { flex: 1; padding: 6px 3px; font-size: 10.5px; }
}

/* Ajuste final de las áreas: las tarjetas comparten el mismo lenguaje y acompañan la fotografía, sin estirarse para llenar un espacio vacío. */
.page-areas .practice-topics { padding: 19px 21px !important; }
.page-areas .practice-topics li { position: relative; padding-left: 15px; color: #3b2924; font: 700 15px/1.34 Lato, Arial, sans-serif !important; }
.page-areas .practice-topics li::before { content: "•"; position: absolute; left: 0; top: 0; color: #9e202b; }
.page-areas .family-layout__detail .practice-topics { margin-top: 165px; padding: 20px 21px !important; }
.page-areas .family-layout__detail .practice-topics ul { gap: 10px 22px; }
.page-areas .family-layout__photo-copy { grid-template-columns: minmax(190px, .78fr) minmax(0, 1.22fr); gap: 24px; }
.page-areas .family-layout__photo-copy img { height: 202px; }

/* Contratos: la tarjeta y la foto arrancan en el mismo recorrido visual. */
.page-areas .contracts-layout__damage .practice-topics { align-self: start; margin-top: 138px; }
.page-areas .contracts-layout__photo-copy { grid-template-columns: minmax(195px, .76fr) minmax(0, 1.24fr); gap: 24px; }
.page-areas .contracts-layout__photo-copy img { height: 210px; }

/* Defensa penal: actuaciones en tarjeta y contrapunto derecho más compacto. */
#penal .penal-layout__upper { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: clamp(28px, 3.5vw, 48px) !important; align-items: start !important; }
#penal .penal-service .penal-situations { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px 23px !important; max-width: none !important; margin: 19px 0 0 !important; padding: 20px 21px !important; border: 1px solid rgba(123, 67, 53, .45) !important; background: #f3e9db !important; }
#penal .penal-service .penal-situations span { position: relative; display: block !important; min-height: 0 !important; padding: 0 0 0 15px !important; color: #3b2924 !important; font: 700 15px/1.34 Lato, Arial, sans-serif !important; }
#penal .penal-service .penal-situations span::before { content: "•" !important; position: absolute !important; left: 0 !important; top: 0 !important; color: #9e202b !important; }
#penal .penal-service .penal-situations span:not(:last-child)::after { content: none !important; }
#penal .penal-defense__right { padding-top: 0 !important; }
#penal .penal-defense__right .penal-layout__shield { margin: 0 0 12px !important; text-align: center; }
#penal .penal-defense__right .practice-watercolor--penal { width: min(100%, 220px) !important; max-width: 220px !important; margin: 0 auto !important; }
#penal .penal-defense__continuation { margin-top: 0 !important; }
#penal .penal-family-support { margin-top: 30px !important; padding-top: 30px !important; }
#penal .penal-family-support__services p { font-size: 16px !important; line-height: 1.56 !important; }
.page-areas .areas-pilot { padding-bottom: 34px !important; }

@media (max-width: 760px) {
  .page-areas .family-layout__detail .practice-topics, .page-areas .contracts-layout__damage .practice-topics { margin-top: 0; }
  .page-areas .family-layout__photo-copy img, .page-areas .contracts-layout__photo-copy img { height: 220px; }
  #penal .penal-service .penal-situations { grid-template-columns: 1fr !important; padding: 18px !important; }
  .page-areas .areas-pilot { padding-bottom: 30px !important; }
}

/* Ajuste de revisión: una lectura más continua en las áreas. */
.page-areas .family-layout__intro {
  grid-template-columns: minmax(0, 1.32fr) minmax(225px, .68fr) !important;
  gap: clamp(24px, 3vw, 42px) !important;
}
.page-areas .family-layout__detail .practice-topics {
  margin-top: 0 !important;
  align-self: start;
}
.page-areas .contracts-layout__damage .practice-topics { margin-top: 108px !important; }
#penal .penal-service > p { width: 100%; max-width: none !important; }
#penal .penal-layout__opening {
  margin-bottom: 18px !important;
  color: #9e202b !important;
  font: 400 clamp(19px, 1.75vw, 24px)/1.25 'Julius Sans One', Arial, sans-serif !important;
  letter-spacing: .045em !important;
  -webkit-text-stroke: .28px currentColor;
}
.page-areas .global-footer .footer-action-main {
  display: inline !important;
  margin: 2px 0 4px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #fff9f4 !important;
}
@media (max-width: 760px) {
  .page-areas .family-layout__intro { grid-template-columns: 1fr !important; gap: 22px !important; }
  .page-areas .contracts-layout__damage .practice-topics { margin-top: 0 !important; }
  #penal .penal-layout__opening { font-size: 18px !important; }
}

/* Familia y Civil: mayor presencia de las enumeraciones sin alterar su ancho ni la composición. */
.page-areas #familia .practice-topics li,
.page-areas #contratos .practice-topics li {
  font-size: 16.5px !important;
  line-height: 1.45 !important;
}
.page-areas #familia .practice-topics ul,
.page-areas #contratos .practice-topics ul {
  gap: 13px 22px !important;
  align-content: start !important;
}
.page-areas #familia .practice-topics,
.page-areas #contratos .practice-topics {
  min-height: 0 !important;
  height: auto !important;
}

/* Familia: título de ancho completo y contenidos alineados desde el texto. */
.page-areas .family-layout__detail {
  display: block;
  margin-top: 28px;
}
.page-areas .family-layout__detail-title {
  margin: 0 0 14px !important;
  text-align: center;
  white-space: nowrap;
}
.page-areas .family-layout__detail-grid {
  display: grid;
  grid-template-columns: minmax(285px, .76fr) minmax(0, 1.24fr);
  gap: clamp(34px, 4.5vw, 62px);
  align-items: start;
}
.page-areas .family-layout__detail-grid > div { max-width: 74ch; }
.page-areas .family-layout__detail-grid .practice-topics { margin-top: 0 !important; }

/* Contratos: el recuadro se alinea con el inicio del cuerpo de texto. */
.page-areas .contracts-layout__damage .practice-topics { margin-top: 60px !important; }
.page-areas .contracts-layout__intro {
  gap: clamp(26px, 3.5vw, 42px) !important;
}
.page-areas .contracts-layout__intro .practice-watercolor--civil {
  width: 85% !important;
  max-width: 268px !important;
}
@media (max-width: 850px) {
  .page-areas .family-layout__detail-grid { grid-template-columns: minmax(235px, .78fr) minmax(0, 1.22fr); gap: 30px; }
}
@media (max-width: 760px) {
  .page-areas .family-layout__detail-title { white-space: normal; text-align: left; }
  .page-areas .family-layout__detail-grid { grid-template-columns: 1fr; gap: 22px; }
  .page-areas .contracts-layout__intro { gap: 22px !important; }
  .page-areas .contracts-layout__intro .practice-watercolor--civil { width:auto !important; max-width:235px !important; }
}

/* Derecho Penal: desarrollo editorial propio, sin alterar las demás áreas. */
#penal .penal-introduction {
  display: grid;
  grid-template-columns: minmax(0, 1.34fr) minmax(190px, .66fr);
  gap: clamp(28px, 5vw, 62px);
  align-items: center;
}
#penal .penal-introduction h2 {
  margin: 0 0 13px !important;
  color: #9e202b !important;
  font: 400 clamp(22px, 1.9vw, 26px)/1.24 'Julius Sans One', Arial, sans-serif !important;
  letter-spacing: .045em !important;
}
#penal .penal-introduction__subtitle {
  max-width: 52ch;
  margin: 0 0 16px !important;
  color: #9e202b !important;
  font: 700 clamp(17px, 1.45vw, 20px)/1.38 Lato, Arial, sans-serif !important;
  letter-spacing: .018em;
}
#penal .penal-introduction__copy {
  max-width: 66ch !important;
  margin: 0 !important;
}
#penal .penal-introduction .penal-layout__shield { margin: 0 !important; text-align: center; }
#penal .penal-introduction .practice-watercolor--penal {
  width: min(100%, 205px) !important;
  max-width: 205px !important;
  margin: 0 auto !important;
}
#penal .penal-content {
  display: grid;
  grid-template-columns: minmax(250px, .62fr) minmax(0, 1.38fr);
  gap: clamp(30px, 4.5vw, 56px);
  align-items: stretch;
  margin-top: 28px;
}
#penal .penal-content .penal-situations {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 20px 21px !important;
  border: 1px solid rgba(123, 67, 53, .45) !important;
  background: #f3e9db !important;
}
#penal .penal-content .penal-situations span {
  position: relative;
  display: block !important;
  padding: 0 0 0 15px !important;
  color: #3b2924 !important;
  font: 700 15px/1.3 Lato, Arial, sans-serif !important;
}
#penal .penal-content .penal-situations span::before {
  content: "•" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  color: #9e202b !important;
}
#penal .penal-content .penal-situations span::after { content: none !important; }
#penal .penal-roles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: 1fr auto;
  gap: 0 clamp(24px, 3vw, 36px);
}
#penal .penal-roles article {
  padding: 0 0 18px;
  border-top: 1px solid rgba(158, 32, 43, .36);
}
#penal .penal-roles h3 {
  margin: 14px 0 10px !important;
  color: #9e202b !important;
  font: 700 16px/1.34 Lato, Arial, sans-serif !important;
  letter-spacing: .02em;
}
#penal .penal-roles p { margin: 0 !important; font-size: 16px !important; line-height: 1.56 !important; }
#penal .penal-content__closing {
  grid-column: 1 / -1;
  max-width: none !important;
  margin: 0 !important;
  padding-top: 17px;
  border-top: 1px solid rgba(158, 32, 43, .32);
  color: #9e202b !important;
  font: 700 clamp(20px, 1.65vw, 22px)/1.38 Lato, Arial, sans-serif !important;
  text-align: center;
}
@media (max-width: 760px) {
  #penal .penal-introduction, #penal .penal-content, #penal .penal-roles { grid-template-columns: 1fr !important; }
  #penal .penal-introduction { gap: 20px; }
  #penal .penal-introduction .penal-layout__shield { order: -1; }
  #penal .penal-introduction .practice-watercolor--penal { width: min(100%, 175px) !important; }
  #penal .penal-content { margin-top: 24px; }
  #penal .penal-roles { gap: 18px; }
}
