/* ==========================================
   MO.CA DESIGN SYSTEM v1.1
========================================== */


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

:root{

    /* Brand */

    --bg:#E4E1D9;
    --text:#000000;

    --blue:#3B4B59;
    --red:#B2331E;
    --orange:#ED8008;

    --inactive:#D2CEC3;


    /* Layout */

    --container:1920px;
    --sidebar:480px;
    --content:900px;
    --gap:64px;


    /* Spacing */

    --space-1:8px;
    --space-2:16px;
    --space-3:24px;
    --space-4:32px;
    --space-5:48px;
    --space-6:64px;
    --space-7:96px;


    /* Border */

    --border:1px solid #000000;


    /* Motion */

    --speed-fast:.2s;
    --speed:.35s;
    --speed-slow:.6s;

    --ease:cubic-bezier(.22,.61,.36,1);

}



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

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

    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

}

body{

    margin:0;

    background:var(--bg);

    color:var(--text);

}

img{

    display:block;

    max-width:100%;

    height:auto;

}

a{

    color:inherit;

    text-decoration:none;

}

button{

    border:none;

    background:none;

    padding:0;

    margin:0;

    cursor:pointer;

    font:inherit;

}



/* ==========================================
   CONTAINER
========================================== */

.container{

    width:100%;
    max-width:var(--container);
    margin:0 auto;

}



/* ==========================================
   BOTONES MO.CA
========================================== */

.btn-line{

    position:relative;

    display:inline-block;

    overflow:hidden;

    color:inherit;

    text-decoration:none;

    line-height:1.2;

}

.btn-line::after{

    content:"";

    position:absolute;

    left:0;

    width:100%;

    height:6px;

    bottom:-2px;

    background:var(--orange);

    border-radius:999px;

    transform:translateX(calc(-100% - 12px));

    transition:transform .45s var(--ease);

}

.btn-line:hover::after{

    transform:translateX(0);

}

.btn-line:active::after,
.btn-line.active::after{

    transform:translateX(0);

}

.btn-line:hover::after,
.btn-line:focus-visible::after,
.btn-line:active::after,
.btn-line.active::after{

    transform:translateX(0) scaleX(1);

}

.btn-line:focus-visible{

    outline:none;

}

.btn-line,
.btn-line:link,
.btn-line:visited{

    color:var(--text);

}

/* ==========================================
   BOTÓN ELEMENTOR
========================================== */

.elementor-button{

    position:relative;

    overflow:hidden;

}

.elementor-button::after{

    content:"";

    position:absolute;

    left:18px;

    right:18px;

    bottom:10px;

    height:6px;

    background:var(--orange);

    border-radius:999px;

    transform:translateX(-140%) scaleX(.35);

    transform-origin:left center;

    transition:transform .45s var(--ease);

}

.elementor-button:hover::after,
.elementor-button:active::after{

    transform:translateX(0) scaleX(1);

}

.elementor-button:focus-visible{

    outline:none;

}



/* ==========================================
   UTILIDADES
========================================== */

.hidden{

    display:none !important;

}

.no-scroll{

    overflow:hidden;

}