/* Fourth-level hyaluronic-acid pages: faithful Elementor composition in code. */
.treatment-ah-level4{
  --ah-ink:#171717;
  --ah-line:#8d8d8d;
  --ah-gold:#a88748;
}

/* The shared hero and overlapping introduction already reproduce the old
   geometry. Keep the gel visual large and undistorted in its white column. */
.treatment-ah-level4 .ah-intro{margin-bottom:52px!important}
.treatment-ah-level4 .treatment-intro-image img{
  width:min(100%,430px)!important;
  max-height:360px!important;
  object-fit:contain;
}

/* Validated full-bar TOC, always a single readable column. */
.treatment-ah-level4 .ah-toc-wrap{margin-bottom:54px!important}
.treatment-ah-level4 .postpartum-toc ol{
  display:block!important;
  columns:1!important;
  column-count:1!important;
}
.treatment-ah-level4 .postpartum-toc li{
  width:100%!important;
  break-inside:avoid;
}
.treatment-ah-level4 .postpartum-toc li:last-child{border-bottom:0!important}

/* The old pages pair every editorial chapter inside a bordered card. Equal
   horizontal and vertical gaps remove the oversized row spacing of the
   migrated version while preserving its exact content order. */
.treatment-ah-level4 .ah-sections-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px!important;
  align-items:stretch;
  margin-bottom:64px!important;
  padding-bottom:0!important;
}
.treatment-ah-level4 .ah-section-card{
  box-sizing:border-box;
  min-width:0;
  height:100%;
  padding:24px 22px 26px;
  border:1px solid var(--ah-line);
  background:#fff;
  overflow-wrap:anywhere;
}
body #main#main .treatment-ah-level4 .ah-section-card>h2{
  clear:none;
  margin:0!important;
  border:0!important;
  color:var(--ah-ink)!important;
  font-family:"Josefin Sans",sans-serif!important;
  font-size:25px!important;
  font-weight:600!important;
  line-height:1.3!important;
  text-align:left!important;
  text-wrap:balance;
}
.treatment-ah-level4 .ah-section-card>h2::before{display:none!important;content:none!important}
.treatment-ah-level4 .ah-section-card>h2::after{
  display:block!important;
  width:42px!important;
  height:4px!important;
  margin:13px 0 20px!important;
  background:var(--ah-ink)!important;
  content:""!important;
}
.treatment-ah-level4 .ah-section-copy{min-width:0}
.treatment-ah-level4 .ah-section-copy>*:first-child{margin-top:0!important}
.treatment-ah-level4 .ah-section-copy>*:last-child{margin-bottom:0!important}
.treatment-ah-level4 .ah-section-copy :is(p,li){text-align:left!important}
.treatment-ah-level4 .ah-section-copy img{
  display:block;
  width:auto!important;
  max-width:100%!important;
  height:auto!important;
  margin:22px auto!important;
}

/* Future/native FAQs occupy the complete article width and use the same
   reliable accordion already validated elsewhere on the site. */
.treatment-ah-level4 .ah-section-card--faq{
  grid-column:1/-1;
  height:auto;
  padding:0;
  border:0;
}
.treatment-ah-level4 .ah-section-card--wide{
  grid-column:1/-1;
  height:auto;
  margin-top:30px;
  padding:0;
  border:0;
}
body #main#main .treatment-ah-level4 .ah-section-card--wide>h2{font-size:29px!important}
body #main#main .treatment-ah-level4 .ah-section-card--faq .postpartum-faq{margin:0!important}
body #main#main .treatment-ah-level4 .postpartum-faq summary::before{display:none!important;content:none!important}
body #main#main .treatment-ah-level4 .postpartum-faq details>p,
body #main#main .treatment-ah-level4 .postpartum-faq details>ul,
body #main#main .treatment-ah-level4 .postpartum-faq details>ol{
  margin:0!important;
  padding:2px 24px 20px!important;
}

/* Exact old directory rhythm: six image cards on the first row and five on
   the second. The whole rectangle remains clickable. */
.treatment-ah-level4 .ah-related{
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  background:#fff;
}
body #main#main .treatment-ah-level4 .ah-related>h2{
  box-sizing:border-box;
  width:min(435px,calc(100% - 44px));
  margin:0 auto 20px!important;
  padding:14px 18px 12px;
  border-top:2px solid var(--ah-ink)!important;
  border-bottom:2px solid var(--ah-ink)!important;
  color:var(--ah-ink)!important;
  font-family:"Josefin Sans",sans-serif!important;
  font-size:30px!important;
  font-weight:600!important;
  line-height:1.25!important;
  text-align:center!important;
}
.treatment-ah-level4 .ah-related>h2::before,
.treatment-ah-level4 .ah-related>h2::after{display:none!important;content:none!important}
.treatment-ah-level4 .ah-related-row{
  display:grid;
  width:100%;
  margin:0;
  padding:0;
  gap:0;
}
.treatment-ah-level4 .ah-related-row--6{grid-template-columns:repeat(6,minmax(0,1fr))}
.treatment-ah-level4 .ah-related-row--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.treatment-ah-level4 .ah-related-card{
  position:relative;
  display:flex!important;
  min-width:0;
  min-height:250px;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  padding:20px;
  border:1px solid rgba(255,255,255,.25);
  background:#54595f;
  color:#fff!important;
  font-family:"Josefin Sans",sans-serif;
  font-size:20px;
  font-weight:600;
  line-height:1.3;
  text-align:center!important;
  text-decoration:none!important;
}
.treatment-ah-level4 .ah-related-card img{
  position:absolute;
  inset:0;
  display:block;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  margin:0!important;
  object-fit:cover;
  transition:transform .3s ease;
}
.treatment-ah-level4 .ah-related-card::after{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.43);
  content:"";
  transition:background .2s ease;
}
.treatment-ah-level4 .ah-related-card span{
  position:relative;
  z-index:1;
  pointer-events:none;
  text-wrap:balance;
}
.treatment-ah-level4 .ah-related-card:hover::after,
.treatment-ah-level4 .ah-related-card:focus-visible::after{background:rgba(0,0,0,.25)}
.treatment-ah-level4 .ah-related-card:hover img,
.treatment-ah-level4 .ah-related-card:focus-visible img{transform:scale(1.035)}
.treatment-ah-level4 .ah-related-card:focus-visible{outline:3px solid var(--ah-gold);outline-offset:-3px}

@media(max-width:1100px){
  .treatment-ah-level4 .ah-related-row--6,
  .treatment-ah-level4 .ah-related-row--5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .treatment-ah-level4 .ah-related-card{min-height:210px}
}

@media(max-width:820px){
  .treatment-ah-level4 .ah-sections-grid{grid-template-columns:1fr;gap:18px!important;margin-bottom:48px!important}
  .treatment-ah-level4 .ah-section-card--faq,
  .treatment-ah-level4 .ah-section-card--wide{grid-column:auto}
}

@media(max-width:767px){
  .treatment-ah-level4 .ah-intro{margin-bottom:38px!important}
  .treatment-ah-level4 .ah-toc-wrap{margin-bottom:40px!important}
  .treatment-ah-level4 .ah-section-card{padding:21px 20px 23px}
  body #main#main .treatment-ah-level4 .ah-section-card>h2{font-size:23px!important}
  .treatment-ah-level4 .ah-related-row--6,
  .treatment-ah-level4 .ah-related-row--5{grid-template-columns:repeat(2,minmax(0,1fr))}
  body #main#main .treatment-ah-level4 .ah-related>h2{font-size:27px!important}
  .treatment-ah-level4 .ah-related-card{min-height:158px;padding:16px;font-size:17px}
}

@media(max-width:380px){
  .treatment-ah-level4 .ah-section-card{padding-right:17px;padding-left:17px}
  .treatment-ah-level4 .ah-related-card{min-height:145px;font-size:16px}
}

@media(prefers-reduced-motion:reduce){
  .treatment-ah-level4 .ah-related-card img{transition:none}
  .treatment-ah-level4 .ah-related-card:hover img,
  .treatment-ah-level4 .ah-related-card:focus-visible img{transform:none}
}
