*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

:root {
    --azul: #425464;
    --coral: #FF8873;
    --gris: #B5A89F;
    --arcilla: #A58065;
    --marron: #443635;
    --font: 'IBM Plex Sans', sans-serif;
}

html {
    scroll-behavior: smooth;
}

#portafolio,
#contacto {
    scroll-margin-top: 88px;
}

body {
    font-family: var(--font);
    background: #fff;
    color: var(--azul);
    overflow-x: hidden;
}

/* Estilo global para los iconos configurados como la referencia */
.material-symbols-rounded {
    font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
    display: inline-block;
    vertical-align: middle;
}