/* Pais com Clareza — design tokens
Ported from the Claude Design canvas export
(_ds/escola-para-pais-design-system/tokens/*.css) — values unchanged. */
/* As webfonts (Cabin, Manrope) são carregadas por no
do index.html, não por @import aqui: um @import só é descoberto depois
deste arquivo baixar e ser parseado, o que põe o CSS das fontes em série
atrás dele. Ao mexer nos pesos usados, atualizar aquele . */
:root{
/* Fonts */
--font-sans:'Manrope',-apple-system,'Segoe UI',Roboto,sans-serif;
/* Cabin — used selectively in the Hero for expressive/brand text (see
styles.css); Manrope stays the fallback so a slow font load never shows
a visibly different typeface or shifts layout. */
--font-display:'Cabin',var(--font-sans);
/* Palette */
--teal-900:#0A2E3B;--teal-700:#094B5F;--teal-600:#0F6480;--teal-500:#3D7D93;
--blue-500:#61A4BF;--blue-300:#9BC6D8;--blue-100:#EEF6F7;
--green-700:#6E8F2E;--green-500:#8BB33C;--green-300:#B9D68A;
--ivory-50:#F7F5EF;--sage-100:#EAF0E1;--sage-200:#DCE7CE;
--ink-900:#16232A;--ink-800:#16323A;--ink-600:#3A5158;--ink-400:#6B8189;--ink-200:#A9B7BA;
--white:#FFFFFF;
--border-subtle:#DCE3DC;--border-strong:#B9C6BC;
/* Semantic colors */
--surface-page:var(--ivory-50);
--surface-card:var(--white);
--surface-card-alt:var(--sage-100);
--surface-mist:var(--blue-100);
--surface-inverse:var(--teal-900);
--text-primary:var(--ink-800);
--text-secondary:var(--ink-600);
--text-muted:var(--ink-400);
--text-on-dark:var(--ivory-50);
--text-on-dark-muted:var(--blue-300);
--action-primary:var(--teal-700);
--action-primary-hover:#073A49;
--action-primary-active:#052A36;
--action-secondary:var(--green-500);
--action-secondary-hover:var(--green-700);
--accent:var(--blue-500);
--accent-brand:var(--green-500);
--accent-brand-strong:var(--green-700);
--accent-support:var(--blue-500);
--focus-ring:var(--blue-500);
--border-default:var(--border-subtle);
--border-hover:var(--border-strong);
--link:var(--teal-700);
--link-hover:var(--green-700);
/* Typography scale */
--display-xl:clamp(2.75rem,2.1rem + 3vw,4.5rem);
--display-lg:clamp(2.25rem,1.8rem + 2vw,3.375rem);
--display-md:clamp(1.75rem,1.5rem + 1vw,2.375rem);
--heading-lg:1.75rem;
--heading-md:1.375rem;
--heading-sm:1.125rem;
--body-lg:1.1875rem;
--body-md:1.0625rem;
--body-sm:0.9375rem;
--caption:0.8125rem;
--eyebrow:0.8125rem;
--lh-tight:1.08;
--lh-snug:1.25;
--lh-normal:1.5;
--lh-relaxed:1.7;
--ls-tight:-0.01em;
--ls-display:-0.01em;
--ls-wide:0.08em;
--weight-regular:400;
--weight-medium:500;
--weight-semibold:600;
--weight-bold:700;
--weight-display:800;
/* Spacing scale (4px base) */
--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;
--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--space-10:128px;--space-11:160px;
--content-max:1200px;
--content-narrow:760px;
--gutter:24px;
/* Effects */
--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:22px;--radius-pill:999px;
--shadow-sm:0 1px 3px rgba(20,40,46,0.08),0 1px 2px rgba(20,40,46,0.06);
--shadow-md:0 8px 20px -10px rgba(20,40,46,0.16);
--shadow-lg:0 20px 40px -18px rgba(20,40,46,0.22);
--shadow-inset:inset 0 1px 0 rgba(255,255,255,0.4);
--ease-standard:cubic-bezier(.4,0,.2,1);
--ease-out:cubic-bezier(0,0,.2,1);
--duration-fast:150ms;--duration-base:220ms;--duration-slow:400ms;
--overlay-scrim:rgba(10,30,38,0.55);
--overlay-teal-wash:linear-gradient(180deg,rgba(10,46,59,0) 0%,rgba(10,46,59,0.72) 100%);
}