/*
 * BAC Deep Service UX — Hero profundo y primer pantallazo.
 * CHAT 06. La composición es única para Familia, Laboral, Penal y Civil.
 * El contenido, los activos, los controles y las rutas siguen gobernados por
 * sus contratos previos; esta hoja sólo ordena geometría, lectura y viewport.
 */
.bac-deep-service-canonical{
  overflow-x:clip;
  background:var(--canvas,var(--bac-color-canvas,#f4f1ea));
}

/*
 * Hero canónico mobile-first.
 * El selector incorpora `main` para prevalecer de forma explícita sobre el
 * cierre de cascada de rescate sin modificar esa capa ni otros componentes.
 */
main.bac-deep-service-canonical .bac-service-hero{
  padding-block:clamp(2rem,4.4vw,3.5rem)!important;
}
main.bac-deep-service-canonical .bac-service-hero__inner,
main.bac-deep-service-canonical .bac-service-hero__inner--canonical{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) clamp(7rem,31vw,9.25rem)!important;
  grid-template-areas:
    "title portrait"
    "body body"!important;
  column-gap:clamp(.7rem,2.8vw,1.1rem)!important;
  row-gap:clamp(.85rem,2.5vw,1.25rem)!important;
  align-items:start!important;
}
main.bac-deep-service-canonical .bac-service-hero__inner--single{
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-areas:
    "title"
    "body"!important;
}
main.bac-deep-service-canonical .bac-service-hero__title{
  grid-area:title!important;
  min-width:0;
  align-self:start!important;
}
main.bac-deep-service-canonical .bac-service-hero__body,
main.bac-deep-service-canonical .bac-service-hero__content{
  grid-area:body!important;
  min-width:0;
  align-self:start!important;
}
main.bac-deep-service-canonical .bac-service-hero h1,
main.bac-deep-service-canonical .bac-service-hero__title h1{
  max-width:15ch!important;
  margin:0;
  font-size:var(--bac-type-h1,clamp(2rem,9vw,4.4rem))!important;
  line-height:var(--bac-leading-display,.98)!important;
  letter-spacing:var(--bac-tracking-display,-.035em)!important;
  text-wrap:balance;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
main.bac-deep-service-canonical .bac-service-hero__lede{
  max-width:44rem;
  margin:0;
  font-size:clamp(1rem,3.9vw,1.12rem);
  line-height:1.5;
  text-wrap:pretty;
}
main.bac-deep-service-canonical .bac-service-hero__actions{
  margin-top:clamp(.85rem,2.5vw,1.25rem);
}
main.bac-deep-service-canonical .bac-service-hero .bac-home-route{
  min-height:4rem;
  gap:clamp(.7rem,2vw,1rem);
  padding:.8rem 0;
  border:0;
  border-bottom:1px solid color-mix(in srgb,var(--paper,#fffcf6) 38%,transparent);
  border-radius:0;
  background:transparent!important;
  color:var(--paper,#fffcf6)!important;
  text-align:left!important;
}
main.bac-deep-service-canonical .bac-service-hero .bac-home-route:first-child{
  border-top:1px solid color-mix(in srgb,var(--paper,#fffcf6) 38%,transparent);
}
main.bac-deep-service-canonical .bac-service-hero .bac-home-route strong{
  font-size:clamp(1.25rem,5.4vw,1.6rem);
  line-height:1.08;
}
main.bac-deep-service-canonical .bac-service-hero .bac-home-route__copy{
  gap:.3rem;
}
main.bac-deep-service-canonical .bac-service-hero .bac-home-route__copy>span:last-child{
  max-width:36rem;
  font-size:clamp(.84rem,3.4vw,.94rem);
  line-height:1.4;
}
main.bac-deep-service-canonical .bac-service-hero .bac-home-route:hover,
main.bac-deep-service-canonical .bac-service-hero .bac-home-route:focus-visible{
  padding-inline:.55rem;
  background:color-mix(in srgb,var(--paper,#fffcf6) 9%,transparent)!important;
  color:var(--paper,#fffcf6)!important;
}
main.bac-deep-service-canonical .bac-service-hero__professional{
  grid-area:portrait!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  aspect-ratio:4/5!important;
  align-self:start!important;
  justify-self:end!important;
  border-color:color-mix(in srgb,var(--paper,#fffcf6) 35%,transparent);
  overflow:hidden;
}
main.bac-deep-service-canonical .bac-service-hero__portrait,
main.bac-deep-service-canonical .bac-service-hero__image,
main.bac-deep-service-canonical .bac-service-hero__portrait .bac-home-media-placeholder,
main.bac-deep-service-canonical .bac-service-portrait-placeholder{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  aspect-ratio:4/5!important;
  object-fit:cover;
}
main.bac-deep-service-canonical .bac-service-hero__zocalo{
  min-height:3.25rem;
}

/* El resto del sistema profundo conserva su gramática aprobada. */
.bac-deep-service-canonical .bac-service-professional{
  position:relative;
  z-index:1;
}
.bac-deep-service-canonical .bac-deep-service-main,
.bac-deep-service-canonical .bac-family-ux1-main,
.bac-deep-service-canonical .bac-labor-ux1-main,
.bac-deep-service-canonical .bac-penal-ux1-main,
.bac-deep-service-canonical .bac-civil-ux1-main{
  padding-block:clamp(3.25rem,6vw,6rem);
}
.bac-deep-service-canonical :where(
 .bac-family-ux1-option,
 .bac-labor-ux1-option,
 .bac-penal-ux1-option,
 .bac-civil-ux1-option
){
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  min-height:5.2rem;
  color:var(--institutional,var(--bac-color-ink,#072f49));
  background:transparent;
  text-align:left;
}
.bac-deep-service-canonical :where(a,button,summary):focus-visible{
  outline:3px solid var(--accent,var(--bac-color-accent,#9b432c));
  outline-offset:3px;
}

@media(min-width:48rem){
  main.bac-deep-service-canonical .bac-service-hero{
    padding-block:clamp(2.5rem,3.3vw,2.9rem)!important;
  }
  main.bac-deep-service-canonical .bac-service-hero__inner,
  main.bac-deep-service-canonical .bac-service-hero__inner--canonical{
    grid-template-columns:minmax(0,1.16fr) minmax(18rem,.72fr)!important;
    grid-template-areas:
      "title portrait"
      "body portrait"!important;
    column-gap:clamp(2rem,4vw,4rem)!important;
    row-gap:clamp(1rem,2vw,1.5rem)!important;
  }
  main.bac-deep-service-canonical .bac-service-hero h1,
  main.bac-deep-service-canonical .bac-service-hero__title h1{
    max-width:18ch!important;
  }
  main.bac-deep-service-canonical .bac-service-hero__lede{
    font-size:var(--bac-type-lead,clamp(1.08rem,1.6vw,1.34rem));
    line-height:var(--bac-leading-body,1.5);
  }
  main.bac-deep-service-canonical .bac-service-hero .bac-home-route{
    min-height:4.15rem;
    padding:.75rem 0;
  }
  main.bac-deep-service-canonical .bac-service-hero .bac-home-route strong{
    font-size:clamp(1.35rem,1.8vw,1.65rem);
  }
  main.bac-deep-service-canonical .bac-service-hero__professional{
    width:min(100%,22rem)!important;
  }
}

@media(min-width:68.75rem){
  main.bac-deep-service-canonical .bac-service-hero__inner,
  main.bac-deep-service-canonical .bac-service-hero__inner--canonical{
    grid-template-columns:minmax(0,1.22fr) minmax(21rem,.68fr)!important;
  }
}

@media(max-width:22rem){
  main.bac-deep-service-canonical .bac-service-hero__inner,
  main.bac-deep-service-canonical .bac-service-hero__inner--canonical{
    grid-template-columns:minmax(0,1fr) 7rem!important;
    column-gap:.65rem!important;
  }
  main.bac-deep-service-canonical .bac-service-hero h1,
  main.bac-deep-service-canonical .bac-service-hero__title h1{
    font-size:clamp(1.82rem,8.4vw,2.2rem)!important;
  }
}

@media(prefers-contrast:more){
  main.bac-deep-service-canonical .bac-service-hero .bac-home-route{
    border-color:currentColor;
  }
}

@media(forced-colors:active){
  main.bac-deep-service-canonical .bac-service-hero .bac-home-route,
  main.bac-deep-service-canonical .bac-service-hero__professional{
    border-color:CanvasText;
    forced-color-adjust:auto;
  }
}

@media(prefers-reduced-motion:reduce){
  .bac-deep-service-canonical *,
  .bac-deep-service-canonical *::before,
  .bac-deep-service-canonical *::after{
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
  }
}
