/* ═══════ UTILITY CLASSES — Wild Roots ═══════ */
/* Replaces top inline styles for maintainability */

/* --- Links --- */
.link-inherit { color: inherit; text-decoration: underline; }
.link-plain { text-decoration: none; }

/* --- Padding --- */
.pad-btn { padding: 0.4rem 0.75rem; }
.pad-card { padding: 1rem; background: rgba(255,255,255,0.04); border-radius: var(--radius-md); }
.pad-block { padding: 0.5rem 0.75rem; border-radius: 8px; }

/* --- Typography — Size --- */
.text-3xl { font-size: 1.5rem; }
.text-sm { font-size: 0.85rem; }
.text-xs { font-size: 0.82rem; }
.text-xxs { font-size: 0.78rem; }

/* --- Typography — Combos --- */
.heading-section { font-size: 1.5rem; font-weight: 800; margin-bottom: 1.5rem; color: var(--dark); }
.heading-card { font-size: 1.5rem; margin-bottom: 0.5rem; }
.label-sand { color: var(--sand); font-size: 0.85rem; }
.label-fire { color: var(--fire); font-weight: 600; }
.label-muted { font-size: 0.82rem; color: var(--medium); }
.label-light { font-size: 0.78rem; color: var(--light); font-weight: 600; }
.label-light-sub { font-size: 0.78rem; color: var(--light); margin-top: 0.75rem; }
.subtitle-faded { color: rgba(254,250,224,0.6); font-size: 0.82rem; margin-top: 0.5rem; }
.subtitle-muted { color: rgba(254,250,224,0.7); font-size: 0.9rem; margin-top: 0.25rem; }
.detail-muted { margin-left: 1.5rem; color: var(--medium); font-size: 0.82rem; }
.cta-link { display: inline-block; margin-top: 1rem; color: var(--primary); font-weight: 600; font-size: 0.9rem; }

/* --- Color --- */
.text-sand { color: var(--sand); }

/* --- Margin --- */
.mb-1 { margin-bottom: 0.75rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }
.mt-3 { margin-top: 2rem; }

/* --- Layout --- */
.text-left { text-align: left; }
.img-cover { width: 100%; height: 100%; object-fit: cover; }
.bg-var { background: var(--bg); }

/* --- Flag icons --- */
.flag-icon { width: 18px; height: 12px; border-radius: 2px; vertical-align: middle; margin-right: 4px; }

/* --- Card backgrounds --- */
.card-s2 { background: var(--s2); border-radius: 12px; padding: 1rem; border: 1px solid var(--brd); }
.code-block { display: block; background: rgba(0,0,0,0.04); padding: 0.5rem 0.75rem; border-radius: 8px; }