/* Revision 22. Load after ui21.css. Original SVG marks are direct images,
   so they also render in a file:// preview without external CSS masks.
   Portrait sizing, approved card grids, claim and sticky timeline stay intact. */

#main .h19-art-free{
  overflow:visible;
  isolation:isolate;
}
#main .h19-art-free :is(.h19-free-smile,.h19-free-spark){
  display:block;
  position:absolute;
  visibility:visible;
  opacity:1;
  max-width:none;
  object-fit:contain;
  background:none;
  mask:none;
  -webkit-mask:none;
  pointer-events:none;
  z-index:3;
}
#main .h19-free-smile{
  width:clamp(136px,43%,192px);
  height:auto;
  aspect-ratio:369.123344 / 187.003;
  top:49%;
  bottom:auto;
  left:0;
  right:auto;
  transform:translateY(-50%) rotate(-18deg);
}
#main .h19-free-spark{
  width:clamp(72px,21%,94px);
  height:auto;
  aspect-ratio:1;
  top:13%;
  bottom:auto;
  left:auto;
  right:1%;
  transform:rotate(10deg);
}

/* A photographic pair of hands replaces the giant tooth in the hub hero. */
#main .p22-hub-art{height:440px}
#main .p22-hub-art .p20-hub-field{
  inset:70px 22px 18px 25px;
  background:#ddf6ec;
  border-radius:20px 100px 20px 20px;
  transform:rotate(4deg);
}
#main .p22-hub-hands{
  display:block;
  position:absolute;
  width:108%;
  max-width:none;
  height:104%;
  left:-4%;
  top:-8px;
  object-fit:contain;
  object-position:center;
  transform:rotate(-6deg);
  filter:drop-shadow(0 9px 7px #0c222d10);
}
#main .p22-hub-art .p20-hub-spark{
  top:24px;
  right:1%;
  width:59px;
  height:59px;
  background:none;
  mask:none;
  -webkit-mask:none;
}
#main .p22-hub-art .p20-hub-smile{
  left:0;
  bottom:14px;
  width:90px;
  height:auto;
  aspect-ratio:369.123344 / 187.003;
  background:none;
  mask:none;
  -webkit-mask:none;
}

/* Give sections a clear rhythm without changing the collages inside them. */
/* The contact hero uses a photographic receiver, with room for its coiled cord. */
#main .p20-contact-art>img{
  width:108%;
  height:108%;
  left:-4%;
  top:-18px;
  transform:rotate(-8deg);
  pointer-events:none;
}

#main.home19>:is(.h19-bio,.h19-problems,.h19-treatments,.h19-visit,
                 .h18-cases,.h20-reviews,.h18-studio,.h18-contact){
  padding-block:92px;
}
#main.p20>:is(.p20-care-group,.p20-replacement,.p20-prevent-group,
              .p20-hub-contact,.p20-location,.p20-practical){
  padding-block:90px;
}
#main.p20 .p20-hub-hero,
#main.p20 .p20-contact-hero{padding-bottom:64px}
#main.p20>.p20-email-band{padding-block:64px 82px}

@media(max-width:1180px){
  #main .h19-free-smile{width:clamp(124px,43%,168px);left:1%;top:48%}
  #main .h19-free-spark{width:72px;top:14%;right:1%}
  #main .p22-hub-art{height:395px}
}
@media(max-width:980px) and (min-width:701px){
  #main .h19-free-smile{width:clamp(150px,43%,192px);left:0;top:48%}
  #main .h19-free-spark{width:84px;top:12%;right:2%}
}
@media(max-width:800px){
  #main.home19>:is(.h19-bio,.h19-problems,.h19-treatments,.h19-visit,
                   .h18-cases,.h20-reviews,.h18-studio,.h18-contact){
    padding-block:66px;
  }
  #main.p20>:is(.p20-care-group,.p20-replacement,.p20-prevent-group,
                .p20-hub-contact,.p20-location,.p20-practical){
    padding-block:66px;
  }
  #main.p20 .p20-hub-hero,
  #main.p20 .p20-contact-hero{padding-bottom:44px}
  #main.p20>.p20-email-band{padding-block:48px 64px}
  #main .p22-hub-art{height:315px;margin-right:0}
  #main .p22-hub-art .p20-hub-field{inset:65px 9px 20px 10px}
  #main .p22-hub-art .p20-hub-spark{width:44px;height:44px;top:25px;right:0}
  #main .p22-hub-art .p20-hub-smile{width:68px;bottom:13px;left:0}
}
@media(max-width:700px){
  #main .h19-free-smile{width:132px;left:0;top:46%}
  #main .h19-free-spark{width:65px;right:2%;top:12%}
}
@media(max-width:600px){
  #main .h19-free-smile{width:140px;left:2%;top:51%;transform:translateY(-50%) rotate(-18deg)}
  #main .h19-free-spark{width:76px;top:9%;right:3%}
}
@media(max-width:560px){
  #main .p22-hub-art{width:min(100%,335px);height:320px;margin:15px auto 0}
  #main .p22-hub-art .p20-hub-field{inset:65px 23px 10px 20px}
  #main .p22-hub-hands{width:104%;height:105%;left:-2%;top:-5px}
  #main .p22-hub-art .p20-hub-spark{width:48px;height:48px;top:15px;right:1%}
  #main .p22-hub-art .p20-hub-smile{width:75px;left:0;bottom:10px}
}
@media(max-width:370px){
  #main .h19-free-smile{width:126px;left:0}
  #main .h19-free-spark{width:67px;right:1%}
}