diff --git a/src/app/layout.tsx b/src/app/layout.tsx index ba1a783..09e3670 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,14 +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 }: { children: React.ReactNode }) { return ( - +
- {children} + {children} - ) + ); } diff --git a/src/app/styles/base/_globales.scss b/src/app/styles/base/_globales.scss index 0905223..79744f6 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 { + font-family: 'Inter', sans-serif; /* 👈 Fuente principal */ + font-style: normal; + font-size: 2rem; + font-optical-sizing: auto; - font-optical-sizing: auto; - font-style: normal; - - 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; +}