/*
Theme Name: MotoGraphix V9
Theme URI: https://motogrpx.com
Author: MotoGraphix
Description: MotoGraphix V9
Version: 9.0.0
Text Domain: motographix-v9
*/


/* =========================================================
   MOTOGRAPHIX V9
   BASE GLOBAL
   ========================================================= */


/* =========================================================
   VARIABLES
   ========================================================= */

:root {

    --mgx-red: #E30613;
    --mgx-red-dark: #B9000B;

    --mgx-black: #000000;
    --mgx-black-soft: #0A0A0A;
    --mgx-dark: #151515;
    --mgx-dark-soft: #202020;

    --mgx-white: #FFFFFF;
    --mgx-gray: #999999;
    --mgx-gray-light: #CCCCCC;

    --mgx-border: rgba(255, 255, 255, 0.10);

}


/* =========================================================
   RESET
   ========================================================= */

html {

    margin: 0;
    padding: 0;

    scroll-behavior: smooth;

    background: var(--mgx-black);

}


body {

    margin: 0;
    padding: 0;

    background: var(--mgx-black);

    color: var(--mgx-white);

    font-family:
        Helvetica,
        Arial,
        sans-serif;

    font-size: 16px;

    font-weight: 600;

    line-height: 1.5;

}


/* =========================================================
   BOX SIZING
   ========================================================= */

*,
*::before,
*::after {

    box-sizing: border-box;

}


/* =========================================================
   IMÁGENES
   ========================================================= */

img {

    max-width: 100%;

    height: auto;

    display: block;

}


/* =========================================================
   ENLACES
   ========================================================= */

a {

    color: inherit;

    text-decoration: none;

}


/* =========================================================
   BOTONES
   TODOS LOS BOTONES V9
   ========================================================= */

button,
input[type="button"],
input[type="submit"],
input[type="reset"] {

    font-family:
        Helvetica,
        Arial,
        sans-serif;

}


/*
   Los botones visibles de V9 tendrán
   puntas completamente redondeadas.
*/

button,
input[type="button"],
input[type="submit"],
input[type="reset"] {

    border-radius: 999px;

}


/* =========================================================
   TIPOGRAFÍA PRINCIPAL
   ========================================================= */

h1,
h2,
h3,
h4,
h5,
h6 {

    margin-top: 0;

    font-family:
        Helvetica,
        Arial,
        sans-serif;

    font-weight: 900;

    line-height: 1.15;

}


h1 {

    font-weight: 900;

}


h2 {

    font-weight: 900;

}


h3,
h4,
h5,
h6 {

    font-weight: 800;

}


p {

    font-weight: 600;

}


/* =========================================================
   TEXTO DESTACADO
   ========================================================= */

strong,
b {

    font-weight: 900;

}


/* =========================================================
   CONTENEDOR PRINCIPAL
   ========================================================= */

.site-content {

    width: 100%;

    margin: 0;

    padding: 0;

}


/* =========================================================
   ELIMINAR ESPACIOS INESPERADOS
   ========================================================= */

.site-content > :first-child {

    margin-top: 0;

}


/* =========================================================
   WORDPRESS
   ========================================================= */

.wp-site-blocks {

    padding: 0;

}


/* =========================================================
   SELECCIÓN DE TEXTO
   ========================================================= */

::selection {

    background: var(--mgx-red);

    color: var(--mgx-white);

}


/* =========================================================
   BARRA DE SCROLL
   ========================================================= */

html {

    scrollbar-width: thin;

    scrollbar-color:
        var(--mgx-red)
        var(--mgx-black-soft);

}


/* CHROME / EDGE / SAFARI */

::-webkit-scrollbar {

    width: 10px;

}


::-webkit-scrollbar-track {

    background: var(--mgx-black-soft);

}


::-webkit-scrollbar-thumb {

    background: var(--mgx-red);

    border-radius: 999px;

    border: 2px solid var(--mgx-black-soft);

}


::-webkit-scrollbar-thumb:hover {

    background: var(--mgx-red-dark);

}


/* =========================================================
   ACCESIBILIDAD
   ========================================================= */

button:focus-visible,
a:focus-visible,
input:focus-visible {

    outline: 2px solid var(--mgx-red);

    outline-offset: 3px;

}


/* =========================================================
   EVITAR RESALTADO AZUL EN MÓVILES
   ========================================================= */

a,
button {

    -webkit-tap-highlight-color: transparent;

}