/* Shared product-page typography */
:root{
  --book-type-title:clamp(2rem,4vw,2.6rem);
  --book-type-section:clamp(1.55rem,2.5vw,1.8rem);
  --book-type-subtitle:clamp(1.05rem,1.6vw,1.2rem);
  --book-type-body:clamp(.95rem,1.1vw,1rem);
  --book-type-supporting:clamp(.75rem,.9vw,.82rem);
  --book-leading-heading:1.18;
  --book-leading-body:1.75;
}

.nav-links a,
.bd-back{line-height:1.35}

.bd-back{
  font-size:var(--book-type-supporting);
  letter-spacing:.02em;
}

.bd-title{
  font-size:var(--book-type-title);
  line-height:var(--book-leading-heading);
  letter-spacing:-.01em;
  overflow-wrap:break-word;
  text-wrap:balance;
}

.bd-subtitle{
  font-size:var(--book-type-subtitle);
  line-height:1.35;
}

.bd-age-chip,
.bd-buy-note{
  font-size:var(--book-type-supporting);
  line-height:1.5;
}

.bd-hero .body-text,
.bd-section .body-text{
  font-size:var(--book-type-body);
  line-height:var(--book-leading-body);
  max-width:68ch;
}

.bd-section-title{
  font-size:var(--book-type-section);
  line-height:var(--book-leading-heading);
  letter-spacing:-.01em;
  overflow-wrap:break-word;
  text-wrap:balance;
}

.bd-desc-emotional{
  font-size:clamp(1.12rem,1.8vw,1.3rem);
  line-height:1.65;
  max-width:62ch;
}

.bd-learn-item strong,
.bi-title{
  line-height:1.25;
  overflow-wrap:break-word;
  text-wrap:balance;
}

.bd-learn-item p,
.bd-reviews-empty p,
.bd-faq details p{
  font-size:.875rem;
  line-height:1.65;
}

.bd-word-card .tagalog{line-height:1.2}
.bd-word-card .pron{line-height:1.45}

.bd-spec-label{
  font-size:clamp(.7rem,1vw,.75rem);
  line-height:1.45;
}

.bd-spec-value{
  font-size:clamp(.875rem,1.15vw,.94rem);
  line-height:1.6;
}

.btn-primary,
.btn-outline,
.btn-dark,
.btn-mango-outline,
.bi-order{
  font-size:.78rem;
  letter-spacing:.08em;
  line-height:1.25;
}

.cta-heading{
  line-height:1.1;
  overflow-wrap:break-word;
  text-wrap:balance;
}

.cta-sub{
  font-size:var(--book-type-body);
  line-height:1.75;
  max-width:48ch;
}

.inside-book-arrow,
.inside-book-lightbox button{line-height:1}

.footer-tagline,
.footer-col ul a{
  color:rgba(245,237,214,.62);
  line-height:1.65;
}

.footer-col-title{color:rgba(245,237,214,.45)}
.footer-bottom{color:rgba(245,237,214,.42)}
.footer-bottom a{color:rgba(245,237,214,.55)}

@media(max-width:680px){
  .bd-title{font-size:clamp(2rem,9vw,2.35rem)}
  .bd-section-title{text-wrap:pretty}
  .bd-desc-emotional{line-height:1.6}
  .bd-buy-note{max-width:42ch}
}