diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 0bfcdf4..e4b0d55 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,4 +1,18 @@ import Header from "../components/header"; +import { Inter, Montserrat } from "next/font/google"; +import "../app/styles/base/_globales.scss"; // si tienes estilos globales + +// Carga optimizada de fuentes +const inter = Inter({ + subsets: ["latin"], + weight: ["400", "700"], + variable: "--font-inter", +}); +const montserrat = Montserrat({ + subsets: ["latin"], + weight: ["400", "700"], + variable: "--font-montserrat", +}); export default function RootLayout({ children, @@ -6,7 +20,7 @@ export default function RootLayout({ children: React.ReactNode; }) { return ( - +
{children} diff --git a/src/app/styles/base/_globales.scss b/src/app/styles/base/_globales.scss index 86c66f3..6a0beae 100644 --- a/src/app/styles/base/_globales.scss +++ b/src/app/styles/base/_globales.scss @@ -1,59 +1,69 @@ - html { - font-size: 62.5%; - box-sizing: border-box; - scroll-padding-top: 0rem; + font-size: 62.5%; + box-sizing: border-box; + scroll-padding-top: 0rem; } + *, *:before, *:after { - margin: 0; - padding: 0; - box-sizing: inherit; + margin: 0; + padding: 0; + box-sizing: inherit; } + body { - background-color: #f5f5f7; - font-optical-sizing: auto; - font-style: normal; + background-color: #f5f5f7; font-family: 'Inter', sans-serif; /* 👈 Fuente principal */ + font-style: normal; + font-size: 2rem; + font-optical-sizing: auto; - font-size: 2rem; - - &.overflow-hidden { - overflow: hidden; - } + &.overflow-hidden { + overflow: hidden; + } } + p { - font-size: 2rem; - line-height: 1.5; + font-size: 2rem; + line-height: 1.5; } + .contenedor { - width: 95%; - max-width: 120rem; - margin: 0 auto; + width: 95%; + max-width: 120rem; + margin: 0 auto; } + a { - text-decoration: none; + text-decoration: none; } + h1, h2, h3 { - margin: 0 0 5rem 0; - font-weight: 900; + margin: 0 0 5rem 0; + font-weight: 900; + font-family: 'Montserrat', sans-serif; /* 👈 Títulos con Montserrat */ } + h1 { - font-size: 4rem; + font-size: 4rem; } + h2 { - font-size: 4.6rem; + font-size: 4.6rem; } + h3 { - font-size: 6rem; - text-align: center; + font-size: 6rem; + text-align: center; } + img { - max-width: 100%; - width: 100%; - height: auto; - display: block; + max-width: 100%; + width: 100%; + height: auto; + display: block; } + body > section { - padding: 10rem 0 -} \ No newline at end of file + padding: 10rem 0; +}