@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans:wght@400;500;600;700&family=Source+Serif+4:opsz,wght@8..60,400;8..60,600&display=swap");

:root {
    --font-sans: "Inter", "Noto Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;

    /* Skala umum (admin & fallback) */
    --text-xs: 0.75rem;
    --text-sm: 0.8125rem;
    --text-base: 1rem;
    --text-md: 1.0625rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: clamp(1.3125rem, 0.35vw + 1.15rem, 1.5rem);
    --text-3xl: clamp(1.625rem, 0.55vw + 1.35rem, 2rem);
    --text-display: clamp(1.875rem, 0.85vw + 1.35rem, 2.5rem);

    /* Skala frontend — sedikit lebih compact, seragam antar halaman */
    --fe-xs: 0.75rem;
    --fe-sm: 0.8125rem;
    --fe-body: 0.9375rem;
    --fe-md: 1rem;
    --fe-lg: 1.0625rem;
    --fe-xl: 1.1875rem;
    --fe-2xl: clamp(1.25rem, 0.4vw + 1.05rem, 1.375rem);
    --fe-3xl: clamp(1.5rem, 0.55vw + 1.15rem, 1.75rem);
    --fe-display: clamp(1.875rem, 1.1vw + 1.3rem, 2.375rem);

    --leading-tight: 1.35;
    --leading-normal: 1.55;
    --leading-relaxed: 1.65;
}

html {
    font-size: clamp(15px, 0.35vw + 14px, 16px);
    font-family: var(--font-sans);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-size-adjust: 100%;
}

body {
    font-family: var(--font-sans);
    font-size: var(--text-base);
    line-height: var(--leading-normal);
}

button,
input,
select,
textarea,
optgroup {
    font-family: inherit;
}

.readable-content,
.formal-content {
    font-size: var(--text-md);
    line-height: var(--leading-relaxed);
}

.formal-content {
    font-family: var(--font-serif);
}