/* The 10th Dentist: responsive hero repair, 2026-11-02.
   Loaded AFTER Pass 2; the earlier selector capped every hero child at 55%.
   This design intentionally has ONE content column and a photographic backdrop. */
body:has(.td-trust-strip) .hero.hero-warm {
  display:block;
  isolation:isolate;
  min-height:0;
  background-color:#28473b;
  background-image:linear-gradient(90deg,#29483d 0%,rgba(41,72,61,.96) 26%,rgba(41,72,61,.79) 42%,rgba(41,72,61,.08) 70%),url('/assets/editorial/chair-ten-warm-medellin.webp');
  background-position:center center;
  background-size:cover;
  background-repeat:no-repeat;
  padding:76px 0 72px;
  overflow:hidden;
}
/* Remove old spooky chair overlay, not only its opacity. */
body:has(.td-trust-strip) .hero.hero-warm::before {content:none !important;display:none !important}
body:has(.td-trust-strip) .hero.hero-warm .wrap.hero-grid {
  display:block;
  width:100%;
  max-width:1320px;
  margin:0 auto;
  padding:0 clamp(22px,4vw,52px);
}
body:has(.td-trust-strip) .hero.hero-warm .wrap > * {max-width:none}
body:has(.td-trust-strip) .hero.hero-warm .hero-copy {
  width:min(100%, 620px);
  max-width:620px;
  margin:0;
  min-width:0;
}
body:has(.td-trust-strip) .hero.hero-warm h1 {
  max-width:620px;
  font-size:clamp(2.12rem,3.65vw,3.65rem);
  line-height:1.13;
  letter-spacing:-.03em;
  color:#fff9ed;
  text-wrap:pretty;
  overflow-wrap:normal;
  word-break:normal;
}
body:has(.td-trust-strip) .hero.hero-warm h1 .tenth {
  display:inline;
  font-size:1em;
  font-style:italic;
  font-weight:900;
  line-height:1.16;
  transform:none;
  text-decoration:underline;
  text-decoration-color:#e8bd22;
  text-decoration-thickness:.065em;
  text-underline-offset:.12em;
  color:#ffdea8;
}
body:has(.td-trust-strip) .hero.hero-warm .kicker {font-size:.72rem;color:#f7e1b9;letter-spacing:.16em}
body:has(.td-trust-strip) .hero.hero-warm p.sub {
  max-width:550px;
  margin:24px 0 28px;
  font-size:clamp(1.02rem,1.35vw,1.17rem);
  line-height:1.55;
  color:#f1f5ed;
}
body:has(.td-trust-strip) .hero.hero-warm .ctas {max-width:none;gap:12px;flex-wrap:wrap}
body:has(.td-trust-strip) .hero.hero-warm .chalknote {max-width:none;margin-top:24px;color:#ffeabf;font-size:1.28rem}
.hero-photo-credit {
  position:absolute;
  right:clamp(20px,3vw,54px);
  bottom:24px;
  z-index:2;
  color:#18291f;
  background:rgba(255,251,239,.88);
  padding:5px 9px;
  font:600 .71rem 'Alegreya Sans',sans-serif;
  border-radius:3px;
}
/* Chair 10 tricolor: cheerful, but readable and not a fake national endorsement. */
.premise.is-chair10 .premise-panel{position:relative;overflow:hidden;padding-top:32px}
.premise.is-chair10 .premise-panel::before{
  content:"";position:absolute;inset:0 0 auto;height:9px;
  background:linear-gradient(90deg,#f7d21f 0 50%,#205cbd 50% 75%,#c93632 75% 100%);
}
.premise.is-chair10 .chair-btn.chair-ten.active{background:#ffda3d;color:#173f37;border-color:#ddab12}
/* Tablet: lay a consistent shade behind text so it never meets the chair. */
@media(max-width:1100px){
  body:has(.td-trust-strip) .hero.hero-warm {
    background-image:linear-gradient(90deg,#29483d 0%,rgba(41,72,61,.99) 32%,rgba(41,72,61,.85) 55%,rgba(41,72,61,.26) 100%),url('/assets/editorial/chair-ten-warm-medellin.webp');
  }
  body:has(.td-trust-strip) .hero.hero-warm .hero-copy{width:min(100%,600px)}
}
@media(max-width:760px){
  body:has(.td-trust-strip) .hero.hero-warm {
    background-image:linear-gradient(90deg,rgba(35,67,54,.98),rgba(35,67,54,.90)),url('/assets/editorial/chair-ten-warm-medellin.webp');
    background-position:65% center;
    padding:56px 0 70px;
  }
  body:has(.td-trust-strip) .hero.hero-warm h1 {max-width:100%;font-size:clamp(2.05rem,7.3vw,3rem);letter-spacing:-.025em}
  body:has(.td-trust-strip) .hero.hero-warm p.sub{max-width:100%;font-size:1.08rem}
  body:has(.td-trust-strip) .hero.hero-warm .ctas .btn{padding:12px 17px}
  .hero-photo-credit{bottom:16px;right:16px;font-size:.66rem}
}
@media(max-width:420px){
  body:has(.td-trust-strip) .hero.hero-warm h1{font-size:clamp(1.87rem,8.2vw,2.25rem)}
  body:has(.td-trust-strip) .hero.hero-warm .ctas .btn{width:100%;text-align:center}
}
/* Keep the brand legible rather than stacking every word on a phone. */
@media(max-width:720px){
  nav .navin {padding:12px 14px;gap:8px}
  nav .brand {flex:0 1 auto;min-width:0;white-space:nowrap;gap:5px;align-items:center}
  nav .brand .ten {font-size:1.56rem}
  nav .brand .name {font-size:clamp(.75rem,3.1vw,.98rem);white-space:nowrap;letter-spacing:-.035em}
  nav .navlinks {gap:9px;flex:0 0 auto}
  nav .navlinks a.chair {white-space:nowrap;font-size:1rem}
  nav .navlinks .nav-cta {padding:8px 10px;font-size:.84rem;white-space:nowrap}
}
@media(max-width:375px){
  nav .navlinks a.chair {display:none}
  nav .navin {padding:11px 12px}
}