/* ========================================================================== BRAND — Bryan Locatelli Advocacia Overrides de marca sobre a cópia controlada do design system. Decisões: blueprint §7 + blueprint-addendum §2.3/2.4. - Acento dessaturado "aço claro" #a8cfe0 (contraste ≈12.9:1 sobre #050505) - Lavanda eliminada (secundário remapeado para o próprio ciano) - Glow "palha" exclusivo do território rural - Corpo 17px (leitor estressado, telas baratas) - Spotlight discreto (base menos escurecida, reveal mais suave) - Progressive enhancement (.no-js) e fontes por fallback (sem rede) ========================================================================== */ :root { /* Acento primário dessaturado — mesmo matiz, sem neon */ --color-accent-primary: #a8cfe0; --color-accent-primary-rgb: 168, 207, 224; --color-accent-hover-bg: #e8f3f9; /* Lavanda eliminada: o secundário aponta para o mesmo ciano dessaturado (afeta --glow-ambient-2 e o radial do .hero-scrim herdados) */ --color-accent-secondary-rgb: 168, 207, 224; --glow-ambient-2: rgba(168, 207, 224, 0.035); /* Território rural — único vestígio cromático do campo (blueprint §7) */ --glow-palha: rgba(226, 209, 176, 0.05); --glow-palha-strong: rgba(226, 209, 176, 0.09); /* Corpo elevado para 17px — única alteração métrica prevista */ --text-body: 1.0625rem; } /* -------------------------------------------------------------------------- FONTES — self-hosted (fontsource, subset latin, font-display: swap). Sem nenhuma dependência de CDN (blueprint §13). -------------------------------------------------------------------------- */ @font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/inter-latin-400-normal.woff2") format("woff2"); } @font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/inter-latin-500-normal.woff2") format("woff2"); } @font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/inter-latin-600-normal.woff2") format("woff2"); } @font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/inter-latin-700-normal.woff2") format("woff2"); } @font-face { font-family: "Inter"; font-style: normal; font-weight: 800; font-display: swap; src: url("../fonts/inter-latin-800-normal.woff2") format("woff2"); } @font-face { font-family: "Playfair Display"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/playfair-display-latin-400-italic.woff2") format("woff2"); } @font-face { font-family: "Playfair Display"; font-style: italic; font-weight: 500; font-display: swap; src: url("../fonts/playfair-display-latin-500-italic.woff2") format("woff2"); } /* -------------------------------------------------------------------------- SPOTLIGHT ADAPTADO — clareza, não espetáculo (NEW-TASK §10) Base menos escurecida; reveal mais contido. A máscara ampliada (900×700) e os stops suaves são definidos via data-attributes + interactions.js. -------------------------------------------------------------------------- */ .spotlight__base { filter: grayscale(0.55) brightness(0.65) contrast(1.04); } .spotlight__reveal { filter: brightness(1.06) contrast(1.05) saturate(1.04); } /* Touch: sem efeito obrigatório — camada tratada estática, sem máscara */ @media (hover: none) { .spotlight__reveal { -webkit-mask-image: none !important; mask-image: none !important; opacity: 0.92; } } /* -------------------------------------------------------------------------- PROGRESSIVE ENHANCEMENT — sem JS nada fica invisível (NEW-TASK) O carrega class="no-js", trocada para "js" por script inline. -------------------------------------------------------------------------- */ .no-js .reveal, .no-js .media-mask { opacity: 1; transform: none; filter: none; clip-path: none; transition: none; } .no-js .text-mask > span { transform: none; transition: none; } .no-js .hero-anim { animation: none; opacity: 1; } .no-js .spotlight__reveal { -webkit-mask-image: none; mask-image: none; opacity: 0.92; } .no-js .nav-float { opacity: 1; transform: translate(-50%, 0) scale(1); } .no-js .faq-body { max-height: none; } .no-js .faq-icon { display: none; } .no-js .scroll-rail { display: none; } /* -------------------------------------------------------------------------- TIPOGRAFIA DE MARCA Títulos de card de situação SEMPRE em Inter (a serif esteticiza a dor — blueprint §7); a serif fica na palavra de ênfase dos headings de seção. -------------------------------------------------------------------------- */ .situation-card__title { font-family: var(--font-sans); font-style: normal; font-weight: 500; } /* Selo OAB discreto (hero + contato) */ .badge-oab { display: inline-flex; align-items: center; gap: 10px; padding: 9px 14px; border: 1px solid var(--color-border-default); border-radius: var(--radius-pill); background: rgba(0, 0, 0, 0.32); color: var(--color-text-secondary); font-size: var(--text-caption-sm); font-weight: 600; letter-spacing: 0.02em; backdrop-filter: blur(var(--blur-tag)); } .badge-oab::before { content: ""; width: 6px; height: 6px; border-radius: var(--radius-pill); background: var(--color-accent-primary); box-shadow: 0 0 14px rgba(var(--color-accent-primary-rgb), 0.6); }