/*
    Theme Name:   Move Engineering
    Author:       Indaba Solutions
    Template:     bricks
    Version:      1.0
    Text Domain:  move
*/

    :root {

        --ample-contenidor: 1366px;
        
        --color-primari: #204378;
        --color-primari-hover: #122644;
        --color-secundari: #5296FE;
        --color-accio: #5296FE;
        --color-base: #2D2D2D;
        --color-text: #2D2D2D;

        --espai-g: clamp(5rem, 6.41vw + 2.949rem, 10rem);
        --espai-m: clamp(3rem, 2.868vw + 2.082rem, 6rem);
        --espai-p: clamp(2rem, 1.282vw + 1.59rem, 3rem);
        --espai-p2: calc(var(--espai-p) * 1.5);
        --espai-mp: 1rem;
        --espai-mp2: 1.5rem;
        --espai-solapat: var(--espai-m);
        --espai-seccio-x: var(--espai-p);
        --espai-seccio-y: var(--espai-g);
        --espai-carta: 2rem;
        
        --espaiat-footer: var(--espai-p);
        --espaiat-seccio: var(--espai-p);
        --espaiat-contenidors: var(--espai-p);

        --radi-vora: 5px;
        --vora-menu: 1px;
        --radi-vora-menu: 4rem;
        
        --interlinia-menu-mobil: 4.5rem;
        --font-menu: 1.4rem;
        --font-boto: 1.4rem;
        
        --h1: clamp(4.8rem, 5.385vw + 3.077rem, 9rem);
        --alt-hero: clamp(30rem, 19.12vw + 23.881rem, 50rem);
        
        --avantitol-seccio: 1.3rem;
        --max-ample-text: 60ch;
        
    }

    .color-primari {
        color: var(--color-primari);
    }

    .color-secundari {
        color: var(--color-secundari);
    }

    .fons-primari {
        background-color: var(--color-primari);
    }

    .fons-secundari {
        background-color: var(--color-secundari);
    }

    .ocult:not(:focus):not(:active) {
        clip: rect(0 0 0 0); 
        clip-path: inset(50%);
        height: 1px;
        overflow: hidden;
        position: absolute;
        white-space: nowrap; 
        width: 1px;
    }

    h1, h2, h3 {
        line-height: 1.2;
    }

    .espaiat-m > * + * {
        margin-top: var(--espai-m);
    }

    .espaiat-g > * + * {
        margin-top: var(--espai-g);
    }

    .ombra {
        box-shadow: var(--ombra);
    }
    
    header .bricks-nav-menu .current-menu-item {
        color: var(--color-primari);
        font-weight: 600;
    }
    
    .text-light {
        font-weight: 300;
    }

    .multiplica::after {
        content: "";
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        position: absolute;
        display: block;
        mix-blend-mode: multiply;
    }

    #brx-header {
        padding-left: var(--espai-seccio-x);
        padding-right: var(--espai-seccio-x);
    }

    .avantitol-seccio + .titol-seccio {
        margin-top: var(--espai-mp);
    }


/*
    Elements clicables
*/

    .clicable,
    .descarrega-pdf {
        position: relative; 
    }

    .clicable * {
        position: static;
    }

    .descarrega-pdf .icon a::after,
    a.clicable__link::after,
    .clicable .clicable__link a::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
    }

    .clicable .clicable__link--top {
        z-index: 2;
    }


/*
    Widgets
*/

    .brxe-wordpress {
        width: 100%;
        padding: 2rem 3rem 3rem;
        border: 1px solid #e6e6e6;
        border-radius: 4px;
    }

    .brxe-wordpress .bricks-widget-title {
        position: relative;
        margin-bottom: 1em;
        padding-bottom: 10px;
        border-bottom: 1px solid #e6e6e6;
    }

    .brxe-wordpress .bricks-widget-title::after {
        content: '';
        width: 45px;
        height: 2px;
        background-color: var(--color-primari);
        position: absolute;
        bottom: -1px;
        left: 0;
    }

        
/*
    Capçalera
*/


    .cap-enganxosa {
        --fons-seccio-fixa: white;
        --altura-seccio-fixa: 10rem;
    }

    .cap-enganxosa.bricks-is-frontend.admin-bar #brx-header #seccio-fixa {
        top: 32px;
        top: var(--wp-admin--admin-bar--height);
    }

    .cap-enganxosa #brx-header #seccio-fixa,
    .cap-solapada #brx-header #seccio-fixa {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        transition: background-color .2s,transform .4s, top .5s;
        width: 100%;
        z-index: 998
    }

    .cap-enganxosa #brx-header #seccio-fixa {
        position: fixed;
    }

    .cap-enganxosa #brx-header #seccio-fixa.scrolling,
    .cap-enganxosa:not(.cap-negativa) #seccio-fixa {
        background-color: var(--fons-seccio-fixa);
        box-shadow: 0 5px 15px -8px rgb(0 0 0 / 10%);
    }

    .cap-enganxosa #brx-header #seccio-fixa.slide-up {
        overflow-x: hidden;
        top: -100% !important;
    }

    .cap-enganxosa:not(.cap-solapada) {
        margin-top: var(--altura-seccio-fixa);
    }

    .cap-negativa #brx-header #seccio-fixa:not(.scrolling),
    .cap-negativa .bricks-mobile-menu-toggle { 
        color: white 
    } 


/*
    Caixes ample total alineades
*/

    .marge-esquerre-automatic {
        padding-left: max(1px, calc( (100vw - var(--ample-contenidor) ) / 2 + var(--espai-seccio-x) ));
    }

    .marge-dret-automatic {
        padding-right: max(1px,  calc( (100vw - var(--ample-contenidor) ) / 2 + var(--espai-seccio-x) ));
    }


/*
    Focus
*/

    body.bricks-is-frontend :focus,
    #piotnetgrid input:focus, 
    #piotnetgrid select:focus, 
    #piotnetgrid textarea:focus {
        outline: 2px solid #7b7b7b;
    }
