El logotipo OKANE se compone del wordmark en Montserrat 600, transformado con scaleX(1.2) para aportar presencia horizontal. Se usa con el gradiente cream-to-transparent sobre fondos oscuros, y en color sólido oscuro sobre fondos claros.
Base oscura cálida con acentos cream. El sistema evita blancos puros y negros fríos — todo tiene un tono ligeramente dorado.
Dos familias: Montserrat para display/branding y Host Grotesk para todo lo demás. Host Grotesk aporta calidez legible en textos largos, mientras Montserrat da impacto en titulares grandes.
Botón pill con efecto expanding dark circle desde el icono. El fondo oscuro se expande al hacer hover, revelando el texto en tono cream. Dos variantes: light (para fondos claros) e inverted (para fondos oscuros).
Grid de propiedades: 3 columnas en desktop, 2 en tablet, 1 en móvil. Gutter adaptativo con clamp(). Contenido contenido a 1440px máximo con padding responsivo usando max() para ultra-wide screens.
Breakpoints: 2560px, 2200px, 1800px, 1440px, 1024px, 860px, 768px, 640px, 380px
Max-width: 1440px (default) → 1600px (2200px+) → 1700px (2560px+)
GSAP 3.12 con ScrollTrigger para reveal animations. Lenis para smooth scroll. Preloader con wipe-reveal del wordmark OKANE. Hero ensō con conic-gradient wipe. Cards aparecen staggered per row. Statement heading con word-by-word reveal.
Easing principal: power3.out para reveals, power2.inOut para transiciones
Parallax: Hero bg (scrub 1.5), CTA bg (scrub 1.5), -30px a +40px range