/* ========================================================================== DHF Studios — Design tokens Valores exatos do design system (dhf-studios-design-system-39ca512d). Poppins e Bebas Neue são carregadas por no de cada página. Dunhill Script é auto-hospedada a partir do arquivo licenciado da marca. ========================================================================== */ @font-face { font-family: "Dunhill"; src: url("../fonts/DunhillScript-Medium.otf") format("opentype"); font-weight: 500; font-style: normal; font-display: swap; } :root { /* --- Paleta da marca (brand book, página 6) --- */ --dhf-orange: #ffa063; --dhf-blue: #81afff; --dhf-pink: #f888bb; --dhf-green: #9dba2e; --dhf-yellow: #fbc93f; --dhf-cream: #fff8ee; /* --- Ink --- */ --dhf-ink: #353535; --dhf-ink-90: rgba(53, 53, 53, .90); --dhf-ink-70: rgba(53, 53, 53, .70); --dhf-ink-45: rgba(53, 53, 53, .45); --dhf-ink-18: rgba(53, 53, 53, .18); --dhf-ink-08: rgba(53, 53, 53, .08); --dhf-white: #ffffff; /* --- Rampa creme (papel) --- */ --cream-0: #fffdf9; --cream-1: #fff8ee; --cream-2: #f7efe2; --cream-3: #eae1d3; /* --- Superfícies --- */ --surface-page: var(--cream-1); --surface-card: var(--dhf-white); --surface-raised: var(--cream-0); --surface-sunken: var(--cream-2); --surface-inverse: var(--dhf-ink); /* --- Texto --- */ --text-body: var(--dhf-ink); --text-muted: var(--dhf-ink-70); --text-faint: var(--dhf-ink-45); --text-on-color: var(--dhf-ink); --text-on-inverse: var(--cream-1); /* --- Linhas --- */ --line-hairline: var(--dhf-ink-18); --line-strong: var(--dhf-ink); /* --- Interativo --- */ --accent: var(--dhf-orange); --accent-2: var(--dhf-pink); --accent-3: var(--dhf-blue); --focus-ring: var(--dhf-ink); /* --- Status (reaproveitam a paleta, sem inventar matiz) --- */ --status-positive: var(--dhf-green); --status-warning: var(--dhf-yellow); --status-info: var(--dhf-blue); --status-attention: var(--dhf-pink); /* --- Famílias --- */ --font-display: "Dunhill", "Poppins", cursive; --font-body: "Poppins", system-ui, sans-serif; --font-condensed: "Bebas Neue", "Poppins", sans-serif; --font-mono: ui-monospace, "SFMono-Regular", Menlo, monospace; /* --- Escala tipográfica (razão 1.25 sobre base 16px) --- */ --text-2xs: 11px; --text-xs: 12px; --text-sm: 14px; --text-md: 16px; --text-lg: 20px; --text-xl: 25px; --text-2xl: 31px; --text-3xl: 39px; --text-4xl: 49px; --text-5xl: 61px; --text-6xl: 76px; --text-7xl: 96px; /* --- Pesos (Poppins) --- */ --weight-light: 300; --weight-regular: 400; --weight-medium: 500; --weight-semibold: 600; --weight-bold: 700; /* --- Entrelinha --- */ --leading-tight: .92; /* Bebas Neue */ --leading-snug: 1.15; --leading-normal: 1.5; --leading-loose: 1.7; /* --- Tracking --- */ --tracking-tight: -.01em; --tracking-normal: 0; --tracking-wide: .04em; --tracking-caps: .14em; --tracking-condensed: .01em; /* --- Espaçamento --- */ --space-0: 0px; --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; --gutter-page: 32px; --gutter-page-lg: 64px; --measure-prose: 62ch; --container-max: 1240px; /* --- Raios --- */ --radius-xs: 4px; --radius-sm: 8px; --radius-md: 14px; --radius-lg: 22px; --radius-xl: 32px; --radius-pill: 999px; --radius-chip: 22px; --border-hairline: 1px; --border-strong: 2px; --border-chip: 10px; /* --- Elevação: marca print-flat, sombras raras, quentes, nunca azuladas --- */ --shadow-none: none; --shadow-sm: 0 1px 2px rgba(53, 53, 53, .06); --shadow-md: 0 6px 18px rgba(53, 53, 53, .08); --shadow-lg: 0 18px 44px rgba(53, 53, 53, .12); --shadow-inset-hairline: inset 0 0 0 1px var(--line-hairline); --shadow-focus: 0 0 0 3px var(--cream-1), 0 0 0 5px var(--dhf-ink); /* --- Motion --- */ --duration-fast: 120ms; --duration-base: 200ms; --duration-slow: 420ms; --ease-standard: cubic-bezier(.2, .8, .2, 1); --ease-out: cubic-bezier(0, 0, .2, 1); --ease-in-out: cubic-bezier(.4, 0, .2, 1); --hover-lift: -2px; --press-scale: .97; }