/**
 * Typography System — Editorial Foundation
 *
 * Generic — defines hierarchy, rhythm, reading comfort. No component-
 * specific typography (recipe titles etc. live in components/recipe-typography.css).
 * References tokens only, never raw font names.
 *
 * @package    Recipes_Lola
 * @version    1.0.0
 */

h1, .rl-h1 { font-family: var(--rl-font-display); font-size: var(--rl-text-4xl); font-weight: var(--rl-weight-regular); line-height: var(--rl-leading-tighter); letter-spacing: var(--rl-tracking-tight); color: var(--rl-color-foreground); text-wrap: balance; }
h2, .rl-h2 { font-family: var(--rl-font-display); font-size: var(--rl-text-3xl); font-weight: var(--rl-weight-regular); line-height: var(--rl-leading-tight); letter-spacing: var(--rl-tracking-tight); color: var(--rl-color-foreground); text-wrap: balance; }
h3, .rl-h3 { font-family: var(--rl-font-display); font-size: var(--rl-text-2xl); font-weight: var(--rl-weight-regular); line-height: var(--rl-leading-snug); letter-spacing: var(--rl-tracking-tight); color: var(--rl-color-foreground); text-wrap: balance; }
h4, .rl-h4 { font-family: var(--rl-font-sans); font-size: var(--rl-text-xl); font-weight: var(--rl-weight-semibold); line-height: var(--rl-leading-snug); color: var(--rl-color-foreground); text-wrap: balance; }
h5, .rl-h5 { font-family: var(--rl-font-sans); font-size: var(--rl-text-lg); font-weight: var(--rl-weight-semibold); line-height: var(--rl-leading-snug); color: var(--rl-color-foreground); }
h6, .rl-h6 { font-family: var(--rl-font-sans); font-size: var(--rl-text-xs); font-weight: var(--rl-weight-semibold); line-height: var(--rl-leading-normal); letter-spacing: var(--rl-tracking-widest); text-transform: uppercase; color: var(--rl-color-foreground-muted); }

p { font-size: var(--rl-text-base); line-height: var(--rl-leading-relaxed); color: var(--rl-color-foreground); margin-block-end: var(--rl-paragraph-spacing); }
p:last-child { margin-block-end: 0; }

.rl-display-xl { font-family: var(--rl-font-display); font-size: var(--rl-text-6xl); font-weight: var(--rl-weight-regular); line-height: var(--rl-leading-none); letter-spacing: var(--rl-tracking-tighter); color: var(--rl-color-foreground); text-wrap: balance; }
.rl-display-lg { font-family: var(--rl-font-display); font-size: var(--rl-text-5xl); font-weight: var(--rl-weight-regular); line-height: var(--rl-leading-tighter); letter-spacing: var(--rl-tracking-tight); color: var(--rl-color-foreground); text-wrap: balance; }
.rl-display-md { font-family: var(--rl-font-display); font-size: var(--rl-text-4xl); font-weight: var(--rl-weight-regular); line-height: var(--rl-leading-tight); letter-spacing: var(--rl-tracking-tight); color: var(--rl-color-foreground); text-wrap: balance; }

.rl-prose, .rl-prose-md { max-inline-size: var(--rl-prose-md); }
.rl-prose-xs { max-inline-size: var(--rl-prose-xs); }
.rl-prose-sm { max-inline-size: var(--rl-prose-sm); }
.rl-prose-lg { max-inline-size: var(--rl-prose-lg); }
.rl-prose-xl { max-inline-size: var(--rl-prose-xl); }

.rl-prose, .rl-prose-xs, .rl-prose-sm, .rl-prose-md, .rl-prose-lg, .rl-prose-xl {
  hyphens: auto;
  hanging-punctuation: first last;
  widows: 3;
  orphans: 3;
  overflow-wrap: break-word;
  text-size-adjust: 100%;
  font-variant-numeric: oldstyle-nums proportional-nums;
  font-variant-ligatures: common-ligatures contextual;
}

.rl-prose p, .rl-prose-xs p, .rl-prose-sm p, .rl-prose-md p, .rl-prose-lg p, .rl-prose-xl p {
  font-size: var(--rl-text-base); line-height: var(--rl-leading-relaxed); color: var(--rl-color-foreground); margin-block-end: var(--rl-paragraph-spacing);
}
.rl-prose p:last-child, .rl-prose-xs p:last-child, .rl-prose-sm p:last-child, .rl-prose-md p:last-child, .rl-prose-lg p:last-child, .rl-prose-xl p:last-child { margin-block-end: 0; }

.rl-prose h2, .rl-prose-xs h2, .rl-prose-sm h2, .rl-prose-md h2, .rl-prose-lg h2, .rl-prose-xl h2 { margin-block-start: var(--rl-space-12); margin-block-end: var(--rl-space-4); }
.rl-prose h3, .rl-prose-xs h3, .rl-prose-sm h3, .rl-prose-md h3, .rl-prose-lg h3, .rl-prose-xl h3 { margin-block-start: var(--rl-space-10); margin-block-end: var(--rl-space-3); }
.rl-prose h4, .rl-prose-xs h4, .rl-prose-sm h4, .rl-prose-md h4, .rl-prose-lg h4, .rl-prose-xl h4 { margin-block-start: var(--rl-space-8); margin-block-end: var(--rl-space-2); }

.rl-prose ul, .rl-prose-xs ul, .rl-prose-sm ul, .rl-prose-md ul, .rl-prose-lg ul, .rl-prose-xl ul { list-style-type: disc; padding-inline-start: var(--rl-space-6); margin-block-end: var(--rl-paragraph-spacing); }
.rl-prose ol, .rl-prose-xs ol, .rl-prose-sm ol, .rl-prose-md ol, .rl-prose-lg ol, .rl-prose-xl ol { list-style-type: decimal; padding-inline-start: var(--rl-space-6); margin-block-end: var(--rl-paragraph-spacing); }
.rl-prose li, .rl-prose-xs li, .rl-prose-sm li, .rl-prose-md li, .rl-prose-lg li, .rl-prose-xl li { line-height: var(--rl-leading-relaxed); margin-block-end: var(--rl-space-2); }
.rl-prose li:last-child, .rl-prose-xs li:last-child, .rl-prose-sm li:last-child, .rl-prose-md li:last-child, .rl-prose-lg li:last-child, .rl-prose-xl li:last-child { margin-block-end: 0; }

.rl-prose a, .rl-prose-xs a, .rl-prose-sm a, .rl-prose-md a, .rl-prose-lg a, .rl-prose-xl a { color: var(--rl-color-primary); text-decoration: underline; text-decoration-thickness: var(--rl-border-width); text-underline-offset: var(--rl-space-1); transition: color var(--rl-transition-fast); }
.rl-prose a:hover, .rl-prose-xs a:hover, .rl-prose-sm a:hover, .rl-prose-md a:hover, .rl-prose-lg a:hover, .rl-prose-xl a:hover { color: var(--rl-color-primary-hover); }

.rl-prose strong, .rl-prose-xs strong, .rl-prose-sm strong, .rl-prose-md strong, .rl-prose-lg strong, .rl-prose-xl strong { font-weight: var(--rl-weight-semibold); color: var(--rl-color-foreground); }

.rl-prose blockquote, .rl-prose-xs blockquote, .rl-prose-sm blockquote, .rl-prose-md blockquote, .rl-prose-lg blockquote, .rl-prose-xl blockquote { padding-inline-start: var(--rl-space-6); border-inline-start: var(--rl-border-width-2) solid var(--rl-color-primary); color: var(--rl-color-foreground-muted); margin-block: var(--rl-space-8); }
.rl-prose blockquote p, .rl-prose-xs blockquote p, .rl-prose-sm blockquote p, .rl-prose-md blockquote p, .rl-prose-lg blockquote p, .rl-prose-xl blockquote p { font-size: var(--rl-text-lg); font-style: italic; margin-block-end: 0; }

.rl-prose dl, .rl-prose-xs dl, .rl-prose-sm dl, .rl-prose-md dl, .rl-prose-lg dl, .rl-prose-xl dl { margin-block-end: var(--rl-paragraph-spacing); }
.rl-prose dt, .rl-prose-xs dt, .rl-prose-sm dt, .rl-prose-md dt, .rl-prose-lg dt, .rl-prose-xl dt { font-weight: var(--rl-weight-semibold); color: var(--rl-color-foreground); margin-block-start: var(--rl-space-4); }
.rl-prose dd, .rl-prose-xs dd, .rl-prose-sm dd, .rl-prose-md dd, .rl-prose-lg dd, .rl-prose-xl dd { padding-inline-start: var(--rl-space-4); color: var(--rl-color-foreground-muted); }

.rl-prose figure, .rl-prose-xs figure, .rl-prose-sm figure, .rl-prose-md figure, .rl-prose-lg figure, .rl-prose-xl figure { margin-block: var(--rl-space-10); }

.rl-prose table, .rl-prose-xs table, .rl-prose-sm table, .rl-prose-md table, .rl-prose-lg table, .rl-prose-xl table { inline-size: 100%; border-collapse: collapse; font-size: var(--rl-text-sm); margin-block-end: var(--rl-paragraph-spacing); }
.rl-prose th, .rl-prose-xs th, .rl-prose-sm th, .rl-prose-md th, .rl-prose-lg th, .rl-prose-xl th { font-weight: var(--rl-weight-semibold); text-align: start; padding-block: var(--rl-space-2); padding-inline: var(--rl-space-3); border-block-end: var(--rl-border-width-2) solid var(--rl-color-border-strong); color: var(--rl-color-foreground); }
.rl-prose td, .rl-prose-xs td, .rl-prose-sm td, .rl-prose-md td, .rl-prose-lg td, .rl-prose-xl td { padding-block: var(--rl-space-2); padding-inline: var(--rl-space-3); border-block-end: var(--rl-border-width) solid var(--rl-color-border); vertical-align: top; color: var(--rl-color-foreground); }

.rl-lead { font-family: var(--rl-font-sans); font-size: var(--rl-text-lg); font-weight: var(--rl-weight-light); line-height: var(--rl-leading-relaxed); color: var(--rl-color-foreground-muted); max-inline-size: var(--rl-prose-lg); }

.rl-label { font-family: var(--rl-font-sans); font-size: var(--rl-text-xs); font-weight: var(--rl-weight-medium); letter-spacing: var(--rl-tracking-wider); text-transform: uppercase; line-height: var(--rl-leading-none); color: var(--rl-color-foreground-muted); }
.rl-label-sm { font-family: var(--rl-font-sans); font-size: var(--rl-text-2xs); font-weight: var(--rl-weight-medium); letter-spacing: var(--rl-tracking-widest); text-transform: uppercase; line-height: var(--rl-leading-none); color: var(--rl-color-foreground-muted); }

.rl-caption { font-family: var(--rl-font-sans); font-size: var(--rl-text-sm); line-height: var(--rl-leading-normal); color: var(--rl-color-foreground-muted); }
figcaption { font-size: var(--rl-text-sm); line-height: var(--rl-leading-normal); color: var(--rl-color-foreground-muted); margin-block-start: var(--rl-space-2); font-style: italic; }

strong, b { font-weight: var(--rl-weight-semibold); }
em, i { font-style: italic; }
small { font-size: var(--rl-text-sm); }
sup, sub { font-size: var(--rl-text-sub-sup-scale); line-height: 0; position: relative; vertical-align: baseline; }
sup { top: var(--rl-sup-offset); }
sub { bottom: var(--rl-sub-offset); }
cite { font-style: italic; color: var(--rl-color-foreground-muted); }
dfn { font-style: italic; font-weight: var(--rl-weight-medium); }
time { color: var(--rl-color-foreground-muted); font-size: var(--rl-text-sm); }
