/* ===================================================================== Lumivie - camada de tema Tudo que o painel do editor controla vive aqui, como variavel CSS. Trocar uma paleta = trocar o atributo data-palette no . Nada de estilo estrutural neste arquivo. ===================================================================== */ :root { /* ---- Paleta padrao: Nude Rose (herdada do site atual) ---- */ --c-bg: #FBF7F4; --c-surface: #FFFFFF; --c-surface-2: #F4EDE7; --c-ink: #2E2A2A; --c-muted: #857A75; --c-accent: #C97B84; --c-accent-ink:#FFFFFF; --c-gold: #E0A96D; --c-line: #EBE1D9; /* ---- Tipografia ---- */ --font-h: "Fraunces", Georgia, serif; --font-b: "Sora", system-ui, -apple-system, "Segoe UI", sans-serif; --scale: 1; /* multiplicador global de tamanho de texto */ --tracking-h: -0.02em; /* ---- Forma e ritmo ---- */ --radius: 16px; --radius-sm: 10px; --radius-pill: 999px; --space: 1; /* multiplicador de respiro entre secoes */ --maxw: 1160px; --maxw-narrow: 720px; /* ---- Sombras: discretas, nunca decorativas ---- */ --shadow-sm: 0 1px 2px rgba(46,42,42,.05), 0 4px 12px rgba(46,42,42,.04); --shadow-md: 0 2px 6px rgba(46,42,42,.06), 0 18px 40px rgba(46,42,42,.08); /* ---- Escala tipografica fluida (respeita --scale) ---- */ --t-display: calc(clamp(2.6rem, 1.6rem + 4.2vw, 4.6rem) * var(--scale)); --t-h1: calc(clamp(2.1rem, 1.4rem + 2.9vw, 3.3rem) * var(--scale)); --t-h2: calc(clamp(1.7rem, 1.25rem + 1.9vw, 2.5rem) * var(--scale)); --t-h3: calc(clamp(1.15rem, 1rem + 0.6vw, 1.4rem) * var(--scale)); --t-body: calc(clamp(1rem, .96rem + .2vw, 1.075rem) * var(--scale)); --t-sm: calc(0.875rem * var(--scale)); --t-xs: calc(0.75rem * var(--scale)); /* ---- Respiro vertical das secoes ---- */ --sec-y: calc(clamp(3.5rem, 2rem + 5vw, 7rem) * var(--space)); } /* ===================== PALETAS PRONTAS ============================ */ [data-palette="areia"] { --c-bg: #F7F3EC; --c-surface: #FFFFFF; --c-surface-2: #EFE7DA; --c-ink: #33302B; --c-muted: #7D7568; --c-accent: #B08968; --c-accent-ink: #FFFFFF; --c-gold: #C9A227; --c-line: #E5DCCC; } [data-palette="sage"] { --c-bg: #F4F6F1; --c-surface: #FFFFFF; --c-surface-2: #E7EDE2; --c-ink: #2B322A; --c-muted: #6F7A6B; --c-accent: #7C8B6B; --c-accent-ink: #FFFFFF; --c-gold: #C0A87C; --c-line: #DDE4D6; } [data-palette="lavanda"] { --c-bg: #F8F5FA; --c-surface: #FFFFFF; --c-surface-2: #EFE9F3; --c-ink: #2E2A33; --c-muted: #7C7387; --c-accent: #8B7BA8; --c-accent-ink: #FFFFFF; --c-gold: #D9A7B0; --c-line: #E5DEEA; } [data-palette="terracota"] { --c-bg: #FAF4F0; --c-surface: #FFFFFF; --c-surface-2: #F2E3D9; --c-ink: #33251F; --c-muted: #866A5D; --c-accent: #C1674F; --c-accent-ink: #FFFFFF; --c-gold: #E3A76F; --c-line: #EDDCD1; } [data-palette="noite"] { --c-bg: #17151A; --c-surface: #201D25; --c-surface-2: #2A262F; --c-ink: #F3EEE9; --c-muted: #A79C97; --c-accent: #D8A0A8; --c-accent-ink: #1A171C; --c-gold: #E0A96D; --c-line: #322D38; --shadow-sm: 0 1px 2px rgba(0,0,0,.4); --shadow-md: 0 2px 6px rgba(0,0,0,.35), 0 18px 40px rgba(0,0,0,.45); } /* ===================== PARES DE FONTE ============================= */ /* O nome do par vira data-fonts no ; o carregamento do Google Fonts e feito por theme.js, que so baixa o par realmente em uso. */ [data-fonts="fraunces-sora"] { --font-h: "Fraunces", Georgia, serif; --font-b: "Sora", system-ui, sans-serif; } [data-fonts="playfair-inter"] { --font-h: "Playfair Display", Georgia, serif; --font-b: "Inter", system-ui, sans-serif; } [data-fonts="cormorant-jost"] { --font-h: "Cormorant Garamond", Georgia, serif; --font-b: "Jost", system-ui, sans-serif; } [data-fonts="dmserif-dmsans"] { --font-h: "DM Serif Display", Georgia, serif; --font-b: "DM Sans", system-ui, sans-serif; } [data-fonts="marcellus-karla"] { --font-h: "Marcellus", Georgia, serif; --font-b: "Karla", system-ui, sans-serif; }