/*
Theme Name: Mc Donald Dev 2025
Theme URI: 
Author: RVADV Rafa
Author URI: 
Description: A starter theme for home builders 2025.
Requires at least: 6.7
Tested up to: 6.7
Requires PHP: 5.7
Version: 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mcdonalddev2025
Tags: 
*/

/* Font CDNS */
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&family=Mona+Sans:ital,wght@0,200..900;1,200..900&display=swap');

/* ---------------------------------------- */
/* ------------ GLOBAL STYLES ------------- */
/* ---------------------------------------- */
html { box-sizing: border-box; scroll-behavior: smooth; }
*, *:before, *:after { box-sizing: inherit; }
* { touch-action: manipulation; }
header + div { margin-top: 0; }
a {
    color: var(--primary);
}
hr {
    border-color: #fff !important;
    background: #fff !important;
}
:root {
    --primary: #ec2028;
    --primary: var(--wp--preset--color--primary);
    --secondary: #2e2e2e;
    --background: #0e0e0e;
    --text: #ffffff;
    
    --max-width: 1400px;
}
input, textarea, select { 
  -webkit-appearance: none; 
  -moz-appearance: none; 
  appearance: none; border-radius: 0; 
  background-image: none; 
  background-color: #fff;
}
input[type="submit"] {
    font-family: var(--wp--preset--font-family--josefin-sans) !important;
    text-transform: uppercase;
    color: #fff;
    background: var(--background);
    cursor: pointer;
    font-size: 1.2rem;
    padding: 12px 64px 8px 64px;
    width: fit-content;
}
/* ---------------------------------------- */
/* Editor-only styles       .editor-styles-wrapper {}               */  
/* Frontend-only styles     body:not(.editor-styles-wrapper) {}     */

.single-post-hero-image img { 
    max-height: 400px;
    margin: auto;
    display: block;
}

/* print friendly styles */
@media print {
    header, footer, .button, svg, ::before, ::after { display: none !important; }
    * { color: #333 !important; box-shadow: none !important; }
    img { page-break-inside: avoid; }
    @page { margin: 1cm; }
}


/*----------------------------------------- */
/*------------ Template Styles ------------ */
/*----------------------------------------- */
body {
    background: var(--background);
    color: var(--text);
}
a.wp-element-button:hover {
    background: var(--background);
    box-shadow: inset 0px 0px 0px 3px var(--primary);
}

/*----------------------------------------- */
/*-----  L/R - R/L MCD Content Block  ----- */
/*----------------------------------------- */
.mcd-content-block {
    margin-top: 0; gap: 0 !important;
    box-shadow: inset -24px 0 0 var(--background);
    position: relative;
    > * { width: 50%; }
    > figure img { object-fit: cover; width: 100%; min-height: 600px; max-height: 600px; }
    > .wp-block-group {
        padding-left: 42px;
        padding-right: max(16px, calc( (100vw - var(--max-width)) / 2));
        position: relative; overflow: hidden;
        h2 {
            display: inline;
            background: var(--background);
            box-shadow: 24px 0 0 0 var(--background);
            position: relative;
        }
        h2::after {
            content: ''; display: block;
            width: 600px; height: 3px;
            background-color: #fff;
            position: absolute;
            left: 0; bottom: 20px;
            z-index: -1;
        }
        p {
            font-weight: 300;
            line-height: 142%;
        }
    }
    &::before, &::after {
        content: ''; display: block;
        position: absolute;
        width: 50%; height: 100%;
        right: 0; top: 0;
        background: rgba(255, 255, 255, 0.03);
        clip-path: polygon(48% 0, 100% 0, 100% 100%, 100% 100%);
        z-index: 1;
        pointer-events: none;
    }
    &::before {
        clip-path: polygon(55% 0, 100% 0, 100% 70%, 100% 85%);
    }
    &.reversed {
        & > figure img { box-shadow: -42px 0 0 0 var(--background); }
        & > .wp-block-group {
            padding-right: 42px;
            padding-left: max(16px, calc( (100vw - var(--max-width)) / 2));
            h2::after { background-color: var(--primary); }
        }
        &::before, &::after {
            left: 0; right: unset;
            clip-path: polygon(0 0, 53% 0, 0 100%, 0 100%);
        }
        &::before{
            clip-path: polygon(0 0, 46% 0, 0 86%, 0 82%);
        }

    }
    @media only screen and (max-width: 1000px) {
        > * { width: 100%; }
        flex-direction: column;
        > figure img { min-height: unset; }
        &.reversed { flex-direction: column-reverse; }
        > .wp-block-group {
            padding: 100px 12px;
            max-width: 600px;
            h2::after { bottom: 14px; }
        }
        &::before, &::after {
            width: 100%;
        }
    }
}

/*----------------------------------------- */
/*--------  Tri Card Content Block  ------- */
/*----------------------------------------- */

.tri-card-container {
    margin-top: 200px;
    margin-bottom: 200px;
    padding: 16px;
    > div.wp-block-group > div.wp-block-group {
        position: relative;
        height: fit-content;
        min-height: 564px;
        /* background: linear-gradient( #0000 30%, #696969 54%); */
        background: linear-gradient( #0000 30%, var(--primary) 54%);
        figure{
            position: absolute;
            height: 100%;
            z-index: -1;
            background: var(--primary);
            img {
                object-fit: contain;
                object-position: 50% 0%;
                height: 100%;
            }
        }
        &:nth-child(2) {
            background: linear-gradient( #0000 30%, var(--primary) 54%);
            /* margin-top: -64px; */
            figure {
                background: var(--primary);
            }
        }
        > div.wp-block-group {
            position: relative;
            z-index: 1;
            padding: 0 24px;
            padding-top: 54%;
            h2 {
                text-align: center;
            }
            p {
                line-height: 142%;
                padding-bottom: 24px;
            }
        }
    }
}

@media only screen and (max-width: 1000px) {
    .tri-card-container {
        margin-top: 64px;
        margin-bottom: 64px;
        > div.wp-block-group {
            display: flex;
            flex-direction: column;
            > div.wp-block-group {
                max-width: 442px;
                /* background: linear-gradient( #0000 24%, #696969 50%); */
                background: linear-gradient( #0000 24%, var(--primary) 50%);
                &:nth-child(2) { margin-top: 0px; background: linear-gradient( #0000 24%, var(--primary) 50%); }
                > div.wp-block-group {
                    padding-top: 64%;
                }
            }
        }
    }
}

/*----------------------------------------- */
/*-------  Seis Card Content Block  ------- */
/*----------------------------------------- */
@property --seis-grad {
    syntax: '<color>';
    inherits: false;
    initial-value: #ec202833;
  }
a.seis-card {
    text-decoration: none;
    position: relative;
    display: block;
    padding: 24px 42px 16px 0;
    background: radial-gradient(ellipse at 100% 100%, var(--seis-grad) -64%, transparent 72%);
    transition: --seis-grad 0.4s ease-in-out;

    &::before, &::after {
        content: ''; display: block;
        position: absolute;
        right: 0; bottom: 0;
        background: var(--primary);
        opacity: 0;
        transition: all 0.4s ease-in-out;
    }
    &::before { width: 1px; height: 0%; }
    &::after { width: 0%; height: 1px; }
    &:hover { 
        --seis-grad: hsl(from var(--primary) h s l / 100%);
        &::before { height: 100%; opacity: 1; } &::after { width: 100%; opacity: 1; }
    }
}
.seis-card-wrapper {
    padding: 16px;
    margin-bottom: 82px;
    > h2 {
        color: var(--primary);
    }
    .seis-card-stack {
        .seis-card-row {
            a.seis-card {
                width: 33%;
                p:nth-child(3):last-child { 
                    color: var(--primary);
                    position: relative;
                    width: fit-content;
                    &::after {
                        content: ''; display: block;
                        width: 30px; height: 110%;
                        position: absolute;
                        left: calc(100% + 12px); top: 0;
                        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23EC2028cc' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m18 8l4 4l-4 4M2 12h20'/%3E%3C/svg%3E");
                        background-size: contain;
                        background-repeat: no-repeat;
                        background-position: 50%;
                        translate: -12px; opacity: 0;
                        transition: all 0.4s ease-in-out;
                    } 
                }
                &:hover {
                    p:nth-child(3):last-child::after {
                        translate: 0px; opacity: 1;

                    }
                    
                }
            }
        }
    }
}
@media only screen and (max-width: 1000px) {
    .seis-card-wrapper {
        > h2 { text-align: center; }
        padding: 0px;
        .seis-card-stack {
            .seis-card-row {
                display: flex;
                flex-direction: column;
                flex-wrap: wrap;
                width: 100%;
                a.seis-card {
                    width: 100%;
                    max-width: 500px;
                    margin: auto;
                    padding: 0px 16px 0px 16px
                }
            }
        }
    }
}


/*----------------------------------------- */
/*-------- Project Single Template -------- */
/*----------------------------------------- */

.project-wrapper {
    margin-top: 142px;
    padding-left: 12px;
    padding-right: 12px;
    padding-bottom: 124px;
}
.project-header {
    h2 + div{
        margin: 0;
        margin-top: 4px;
    }
    .project-single-location{
        background: var(--primary);
        color: #fff;
        padding: 8px 24px 6px 24px;
        text-transform: uppercase;
    }
    .project-single-sqft{

    }
}
.project-content-wrapper {
    align-items:start;
}
.project-content-wrapper p{
    max-width: 642px;
    line-height: 142%;
}
.project-left-side {
    width: calc(100% - 400px);
}
.contact-us-address {
    font-weight: 300;
    div.prefix {
        font-weight: 600;
        padding-bottom: 4px;
    }
    p {
        font-size: 1rem;
        padding-top: 0;
        margin-top: 0;
    }
}
.project-contact-form {
    width: 400px;
    position: sticky;
    top: 100px;
    padding: 40px;
    min-height: 600px;
}
.project-contact-form a{
    color: inherit;
    text-decoration: none;
}
.project-contact-form a:hover {
    text-decoration: underline;
}
.project-contact-form hr {
    margin-top: 12px;
}
.editor-styles-wrapper .project-gallery-wrapper{ max-width: 800px; }
.project-contact-form form > p > span > input {
    margin-bottom: 12px;
}
.project-contact-form :is(input, textarea) {
    border: none;
    font-family: var(--wp--preset--font-family--mona-sans);
    padding: 8px 12px;
    box-shadow: 0 4px 4px 0 #0003;
    width: 100%;
}
.project-contact-form textarea {
    height: 84px;
    resize: vertical;
    max-height: 142px;
}
.project-contact-form input[type="submit"]:hover {
    color: var(--primary);
    box-shadow: inset 0 0 0 1px #fff;
}
.project-contact-form span.wpcf7-not-valid-tip{
    padding: 0;
    color: #fff;
    font-size: 0.8rem;
    line-height: 100%;
    margin-top: -4px;
    margin-bottom: -8px;
    user-select: none;
    pointer-events: none;
}


@media only screen and (max-width: 1000px) {
    .project-wrapper {
        padding-bottom: 24px;
        margin-top: 100px;
    }
    .project-content-wrapper {
        flex-direction: column;
    }
    .project-left-side {
        width: 100%;
    }
    .project-contact-form {
        position: relative; top: 0;
        width: 100%;
        max-width: 500px;
        margin-top: 42px !important;
    }
}

/*----------------------------------------- */
/*------- Project Archive Template -------- */
/*----------------------------------------- */
.project-archive-content {
    margin-bottom: 64px;
    margin-top: 100px !important;
    padding-right: calc((100vw - var(--max-width)) / 2);
    > div:nth-child(1){
        width: calc(100% - 400px);
        > div {
            width: 100%;
        }
    }
    > div:nth-child(2){
        width: 400px;
        padding-right: 8px;
    }
}
@media only screen and (max-width: 1000px) {
    .project-archive-content {
        flex-direction: column;
        margin-top: 75px !important;
        > div:nth-child(1){
            width: 100%;
            box-shadow: 0 12px 0 0 #fff2;
        }
        > div:nth-child(2){
            padding-right: 0px;
            padding-left: 8px;
        }
    }
}
.project-listings {
    width: 100%;
    & * {
        margin-block-start: 4px !important;
    }
    ul {
        height: 700px; 
        overflow-y: scroll;
        padding-right: 8px;

        &::-webkit-scrollbar { width: 8px;}
        &::-webkit-scrollbar-thumb {
            background-color: #aaa;
            border-radius: 4px;
        }
        &* {
            scrollbar-width: thin;
            scrollbar-color: #333 transparent; 
        }
    }
    li {
        height: 200px;
        overflow: hidden;
        position: relative;
        figure {
            width: 100%; height: 100%;
            &::after {
                content: '';
                display: block;
                position: absolute;
                left: 0; right: 0;
                top: 0; bottom: 0;
                background: linear-gradient(12deg, #000b 20%, #0000);
                height: 100%; width: 100%;
                pointer-events: none;
                transition: opacity 0.2s ease-in-out;
            }
            img {
                width: 100%; height: 100%;
                object-fit: cover;
                object-position: 50% 50%;
            }
        }
        h2 {
            position: absolute;
            top: 82%; 
            left: 12px; right: 12px;
            font-family: var(--wp--preset--font-family--josefin-sans);
            text-transform: uppercase;
            font-size: 1rem;
            font-weight: 500;
            pointer-events: none;
        }
        h2 + div.is-acf-field.is-text-field {
            position: absolute;
            top: 68%;
            left: 12px;
            background: var(--primary);
            text-transform: uppercase;
            pointer-events: none;
            padding: 3px 16px;
            font-size: 0.7rem;
            .value { margin: 0 !important; }
        }
        &:hover figure::after {
            opacity: 0.6;
        }
    }
}
@media only screen and (max-width: 1000px) {
    .project-listings {
        ul {
            height: fit-content;
            overflow-y: visible;
        }
    }
}

/*----------------------------------------- */
/*---------- Portfolio Carousel ----------- */
/*----------------------------------------- */
.portfolio-carousel {
    background: linear-gradient(90deg, var(--primary), hsl(from var(--primary) h s calc(l - 20)));
    overflow: hidden;
    padding: 42px 12px;
    
    a.wp-element-button {
        white-space: nowrap;
    }
    a.wp-element-button:hover {
        background: #0004;
        box-shadow: none;
    }
}
.portfolio-carousel ul {
    display: flex;
    gap: 12px;
    transition: translate 0.4s ease-in-out;
}
.portfolio-carousel ul li {
    width: calc(33.33% - 12px);
    min-width: calc(33.33% - 12px);
    margin: 0;
    position: relative;
    transition: scale 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    box-shadow: 0 0 0 0 #0000;
    &:hover {
        scale: 1.06;
        z-index: 2;
        box-shadow:0 0 0 2px #fff,  0 4px 8px 2px #0006;
    }
    figure {
        width: 100%; height: 100%;
        aspect-ratio: 1.9 / 1;
        overflow: hidden;
        img {
            height: 100%;
            width: 100%;
            object-fit: cover;
            user-select: none;
            pointer-events: none;
        }
        &::after {
            content: ''; display: block;
            position: absolute; left: 0; right: 0; top: 0; bottom: 0;
            width: 100%; height: 100%;
            background: linear-gradient(10deg, #000a -8%, #0000 50%);
            pointer-events: none;
        }
    }
    > h2 {
        user-select: none;
        pointer-events: none;
        position: absolute;
        bottom: 0; left: 12px;
        font-size: 1.2rem;
        text-transform: uppercase;
        font-weight: 400;
        font-family: var(--wp--preset--font-family--josefin-sans);
        width: 94%;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        margin-bottom: 10px;
    }
    > div {
        user-select: none;
        pointer-events: none;
        position: absolute;
        bottom: 40px; left: 12px;
        background: var(--primary);
        font-size: 0.9em;
        padding: 2px 22px 3px 22px;
    }
}
.portfolio-carousel .prev a,
.portfolio-carousel .next a {
    user-select: none;
    color: transparent;
    border-color: #fff;
    aspect-ratio: 1 / 1;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-width='2' d='m9 6l6 6l-6 6'/%3E%3C/svg%3E");
    background-size: 80%;
    background-position: center;
    background-repeat: no-repeat;
    &:hover {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-width='2' d='m9 6l6 6l-6 6'/%3E%3C/svg%3E");
        background-size: 80%;
        background-position: center;
        background-repeat: no-repeat;
    }
}
.portfolio-carousel .prev a {
    rotate: 180deg;
    border: none !important;
}


@media only screen and (max-width: 1000px) {
    .portfolio-carousel {
        h2 + div.wp-block-buttons a.wp-element-button {
            font-size: 0.7rem;
            margin-bottom: 8px;
        }
        a.wp-element-button:hover {
            background: #0004;
            box-shadow: none;
        }
        .prev a,
        .next a {
            &:hover {
                background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-width='2' d='m9 6l6 6l-6 6'/%3E%3C/svg%3E");
                background-size: 80%;
                background-position: center;
                background-repeat: no-repeat;
            }
        }
        ul {
            display: flex;
            gap: 12px;
            transition: translate 0.4s ease-in-out;
            li {
                width: calc(100% - 12px);
                min-width: calc(100% - 12px);
                margin: 0;
                position: relative;
                &:hover {
                    scale: 1;
                    box-shadow: none;
                }
            }
        }
    }
}

/*----------------------------------------- */
/*--------- News Single Template ---------- */
/*----------------------------------------- */
.news-single-date {
    width: fit-content;
    background: var(--primary);
    color: #fff;
    padding: 8px 24px 6px 24px;
}
.post-template-default.single .project-content-wrapper .project-left-side a {
    color: var(--primary);
    text-decoration: none;
    &:hover {
        text-decoration: underline;
    }
}
/* hide download button */
.post-template-default.single .project-content-wrapper .project-left-side .wp-block-file a { display: none !important; }
.back-to-news a { white-space: nowrap; color: #fff !important; }
.back-to-news a:hover { text-decoration: none !important; }
/*----------------------------------------- */
/*-------- Homepage news section ---------- */
/*----------------------------------------- */
.homepage-news {
    background: linear-gradient(90deg, var(--primary), hsl(from var(--primary) h s calc(l - 20)));
    padding: 42px 12px;
    a.wp-element-button:hover {
        background: #0004;
        box-shadow: none;
    }
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.news-cards ul {
    --gap: 16px;
    --pad: 16px;
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
    padding: 0;
    position: relative;

    &::before {
        display: block;
        content: '';
        position: absolute;
        width: 100%; height: 100%;
        scale: 1.34;
        top: 10%;
        z-index: -1;
        background-image: url("data:image/svg+xml,%3Csvg width='1593' height='626' viewBox='0 0 1593 626' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='0.42'%3E%3Cpath d='M838.516 361.285C690.857 410.561 543.197 459.628 395.538 509.324C380.061 514.566 375.041 512.05 375.459 495.065C376.296 449.143 375.878 403.432 375.459 357.51C375.459 348.494 377.132 339.058 372.949 330.461C373.786 329.412 374.623 328.154 375.459 327.106C408.714 310.96 445.315 305.508 480.452 296.072C508.687 288.523 536.923 281.813 565.158 274.684C577.707 271.538 586.491 264.828 586.073 250.779C584.818 196.89 590.465 142.79 582.308 88.9008C703.406 67.5127 824.503 46.3344 945.392 24.9463C988.058 17.3975 1030.72 10.4778 1073.18 2.3C1085.73 -0.216251 1092.63 0.412828 1090.54 15.3006C1090.54 16.1394 1090.54 16.9781 1090.54 17.8169C1090.12 42.7697 1097.65 72.3356 1086.78 90.9977C1076.32 108.821 1028.48 119.473 1005.68 127.022C955.279 143.797 920.084 149.081 869.47 165.437C863.196 175.082 844.582 174.244 846.882 191.438C846.673 237.15 847.3 282.862 846.673 328.573C846.673 339.896 848.555 352.268 837.889 360.865L838.516 361.285Z' fill='black' fill-opacity='0.64'/%3E%3Cpath d='M372.375 329.941C253.697 360.247 135.229 390.343 16.7604 421.276C5.03918 424.411 0.434406 424.411 0.434406 410.408C0.643714 305.069 0.643714 199.522 0.225098 93.9751C0.225098 80.3898 6.50433 77.2547 17.807 75.7917C203.882 51.1292 389.747 26.4667 575.613 1.59516C585.45 0.341129 592.357 1.17714 590.892 13.5084C590.892 14.3444 590.892 15.1804 590.892 16.0165C592.567 45.2771 590.892 69.5025 579.282 72.6165C528.629 86.2018 448.563 98.3641 398.119 112.785C391.422 114.666 379.7 111.322 379.072 124.072C382.212 186.146 380.328 248.429 379.91 310.712C379.91 317.401 378.445 323.88 373.421 329.105L372.165 330.359L372.375 329.941Z' fill='black' fill-opacity='0.64'/%3E%3Cpath d='M373.788 329.493C373.578 266.959 373.369 204.425 372.949 141.681C372.949 134.965 372.949 128.25 379.237 123.634C446.937 110.833 514.427 97.8227 582.756 88.7993C595.751 91.3175 593.655 101.6 593.655 110.413C593.655 158.468 593.655 206.733 593.655 254.788C593.655 265.28 593.236 275.352 580.87 278.5C511.912 295.498 442.745 312.285 373.788 329.283V329.493Z' fill='black'/%3E%3Cpath d='M837.979 361.67C838.399 301.211 839.03 240.753 839.45 180.294C850.381 173.157 862.573 171.267 875.396 171.267C943.925 154.893 1012.66 138.729 1081.19 122.565C1084.35 121.725 1087.71 121.725 1091.07 121.515C1097.17 127.183 1098.01 134.74 1098.22 142.298C1098.64 181.554 1098.64 220.81 1098.22 259.856C1098.22 274.761 1092.12 285.257 1077.2 290.295C1004.89 314.856 932.363 338.578 860.051 362.299C852.693 364.609 845.336 366.078 838.189 361.88L837.979 361.67Z' fill='black'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1135.32 111.199C1193.58 96.9581 1251.88 82.7173 1310.19 68.4764C1368.5 54.2369 1426.8 39.9974 1485.05 25.758C1519.83 17.3814 1554.62 9.00482 1592.33 0V95.2835C1592.33 109.768 1592.29 124.268 1592.24 138.775V138.818C1592.12 177.571 1591.99 216.374 1592.75 255.067C1593.17 270.982 1587.31 278.312 1573.48 284.804C1339.21 393.28 871.086 611.281 871.086 611.281L851.632 619.667C845.68 622.233 839.049 617.859 839.07 611.377C839.151 585.974 839.327 531.377 839.445 500.186C839.602 458.565 839.759 416.944 839.864 375.271L840.067 375.219L840.074 375.271C849.294 381.344 858.514 379.459 868.572 376.108C942.75 351.188 1017.14 326.268 1091.74 302.394C1108.71 296.95 1116.46 288.154 1115.62 270.145C1114.58 246.9 1114.58 223.445 1115.62 200.2C1115.87 193.984 1115.48 187.607 1115.1 181.217C1113.83 160.27 1112.56 139.182 1133.43 123.136C1135.14 121.855 1135.21 118.639 1135.27 115.461C1135.3 113.963 1135.33 112.474 1135.53 111.199L1135.18 111.276L1135.53 110.99L1135.32 111.199ZM838.013 361.019L837.979 360.821V361.03L838.013 361.019Z' fill='black' fill-opacity='0.64'/%3E%3Cpath d='M1108.5 263.653C1108.71 280.825 1101.58 291.714 1084.82 296.95C1055.53 306.158 1026.51 316.116 997.505 326.067C945.445 343.929 893.445 361.77 840.067 375.219L840.074 375.271C849.294 381.344 858.514 379.459 868.572 376.108C942.75 351.188 1017.14 326.268 1091.74 302.394C1108.71 296.95 1116.46 288.154 1115.62 270.145C1114.58 246.9 1114.58 223.445 1115.62 200.2C1115.87 193.984 1115.48 187.607 1115.1 181.217C1113.83 160.27 1112.56 139.182 1133.43 123.136C1135.14 121.855 1135.21 118.639 1135.27 115.461C1135.3 113.963 1135.33 112.474 1135.53 111.199L1135.18 111.276C1112.83 129.663 1106 153.229 1108.08 181.562C1109.25 198.454 1108.97 215.426 1108.69 232.429C1108.51 242.829 1108.34 253.241 1108.5 263.653Z' fill='black' fill-opacity='0.64'/%3E%3Cpath d='M1084.82 296.95C1101.58 291.714 1108.71 280.825 1108.5 263.653C1108.34 253.241 1108.51 242.829 1108.69 232.429C1108.97 215.426 1109.25 198.454 1108.08 181.562C1106 153.229 1112.83 129.663 1135.18 111.276C1120.02 114.598 1105.06 117.919 1090.1 121.241L1090.06 121.251C1090.13 136.538 1090.13 151.803 1090.13 167.059C1090.13 197.57 1090.13 228.054 1090.69 258.627C1090.9 272.658 1086.92 279.568 1073.3 283.966C1012.87 303.452 952.565 323.309 892.289 343.158L892.206 343.185C874.14 349.134 856.076 355.082 838.013 361.019C838.831 365.753 839.45 370.486 840.067 375.219C893.445 361.77 945.445 343.929 997.505 326.067C1026.51 316.116 1055.53 306.158 1084.82 296.95Z' fill='black' fill-opacity='0.64'/%3E%3C/g%3E%3C/svg%3E%0A");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        opacity: 0.8;
    }
}
.news-cards ul li {
    margin-top: 0;
    width: calc(33.33% - ( var(--gap) * (2 / 3)));
    background: var(--background);
    position: relative;
    height: 424px;
    
    figure a {
        position: absolute;
        display: block;
        height: 424px; width: 100%;
        z-index: 1;
        &:hover {
            box-shadow: 0 0 0 1px #fff;
        }
        
        img {
            object-fit: cover;
            height: 200px;
            object-position: 50% 68%;
        }
    }
    h2.wp-block-post-title,
    div.wp-block-post-date,
    hr.wp-block-separator,
    div.wp-block-post-excerpt {
        padding-left: var(--pad);
        padding-right: var(--pad);
        width: calc(100% - (var(--pad) * 2));
        display: block;
    }
    h2.wp-block-post-title {
        margin-top: 212px;
        line-height: 110%;
        color: #fff;
        margin-bottom: 4px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;  
        overflow: hidden;
    }
    hr.wp-block-separator {
        position: absolute;
        top: 286px;
        left: var(--pad);
        border: none;
        height: 1px;
        background: #fff;
    }
    div.wp-block-post-excerpt {
        position: absolute;
        bottom: 0;
        font-weight: 300;

        p.wp-block-post-excerpt__excerpt {
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;  
            overflow: hidden;
        }
        p.wp-block-post-excerpt__more-text {
            margin-top: 12px;
        }
        a {
            font-weight: 500;
            color: var(--primary);
            text-decoration: none;
        }
    }
}
@media only screen and (max-width: 1000px) {
    .news-cards ul {
        flex-direction: column;
        li {
            margin-top: 0;
            width: 100%;
            max-width: 500px;

            height: 354px;
            figure a {
                height: 354px;
            }
            div.wp-block-post-excerpt {
                p.wp-block-post-excerpt__excerpt {
                    display: none;
                }
                p.wp-block-post-excerpt__more-text {
                }
            }
        }
    }
}

.index-page-news {
    padding-top: 64px !important;
    padding-bottom: 124px !important;
    margin-top: 64px !important;
    overflow: hidden;
    padding-left: 16px;
    padding-right: 16px;

    ul li {
        background: var(--secondary);
    }

    nav {
        a {
            color: var(--primary);
            text-decoration: none;
            &:hover {
                text-decoration: underline;
            }
        }
        .current {
            color: #fff;
        }
    }
}


/*----------------------------------------- */
/*------- Team member page - single ------- */
/*----------------------------------------- */
.team-member-page {
    padding: 16px;
    padding-top: 124px;
    padding-bottom: 64px;
}
.member-content-row {
    position: relative;
    align-items: flex-start;
}
.member-content-row > div:nth-child(1) {
    position: sticky;
    top: 100px;
    width: 400px;
}
.member-content-row > div:nth-child(2) {
    width: 100%;
    padding-right: 20%;
    > h2,
    > h2 + div {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
}
@media only screen and (max-width: 1000px) {
    .team-member-page {
        padding-top: 94px !important;
    }
    .member-content-row {
        flex-direction: column;
        margin-bottom: 42px !important;
    }
    .member-content-row > div:nth-child(1) {
        position: relative;
        top: 0;
        width: 100%;
        figure {
            max-width: 342px;
        }
    }
    .member-content-row > div:nth-child(2) {
        padding-right: 16px;
    }
}
/*----------------------------------------- */
/*------- Team member page - archive ------ */
/*----------------------------------------- */
.team-member-grid {
    padding: 16px;
}
.team-member-grid ul {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}
.team-member-grid ul li {
    width: calc(25% - 12px);
    position: relative;
    .wp-block-post-excerpt__excerpt {
        display: none;
    }
    figure {
        img {
            height: 100%;
        }
    }
}
.team-member-grid ul li:nth-child(1){
    width: 100%;
    padding-left: 26cqw;
    height: 25cqw;
    max-height: 364px;
    min-height: 264px;
    figure {
        position: absolute;
        width: calc(25% - 16px); 
        height: 25cqw;
        max-height: 100%;
        left: 0;
        img {
            height: 100%;
        }
        &::before, &::after {
            content: ''; display: block; position: absolute;
            background: #fff; opacity: 0;
            transition: all 0.4s ease-in-out;
        }
        &::before {
            left: 100%; top: -2px;
            width: 2px; height: 0%;
        }
        &::after {
            bottom: 100%; right: 0;
            height: 2px; width: 0%;
        }
        &:has( a:hover ) {
            &::before { height: 100%; opacity: 1; }
            &::after { width: 100%; opacity: 1; }
        }
    }
    .wp-block-post-excerpt__excerpt {
        max-width: 600px;
    }
}
.team-member-grid ul li:nth-child(1) {
    .wp-block-post-excerpt__excerpt {
        display: block;
        font-weight: 300;
        line-height: 142%;
    }
    h2 {
        margin-bottom: 4px;
    }
    div.is-acf-field.wp-block-mfb-meta-field-block {
        font-weight: 500;
    }
    a.wp-block-post-excerpt__more-link {
        background: #555;
        color: #fff;
        text-decoration: none;
        padding: 6px 24px;
        &:hover {
            background: none;
            box-shadow: 0 0 0 2px #fff;
        }
    }
}
.team-member-grid ul li:nth-child(n+2) {
    a.wp-block-post-excerpt__more-link {
        position: absolute;
        left: 0; right: 0;
        top: 0; bottom: 0;
        width: 100%; height: 100%;
        color: transparent;
    }
    &::before, &::after {
        content: ''; display: block; position: absolute;
        background: #fff; opacity: 0;
        transition: all 0.4s ease-in-out;
    }
    &::before {
        left: 100%; top: -2px;
        width: 2px; height: 0%;
    }
    &::after {
        bottom: 100%; right: 0;
        height: 2px; width: 0%;
    }
    &:has(a.wp-block-post-excerpt__more-link:hover) {
        &::before { height: 100%; opacity: 1; }
        &::after { width: 100%; opacity: 1; }
    }
    h2 {
        position: absolute;
        bottom: -2px;
        background: var(--background);
        padding-bottom: 24px;
        padding-top: 12px;
        padding-right: 16px;
        min-width: 86%;
        font-size: clamp(1rem, 1.6vw, 1.5rem) !important;
        white-space: nowrap;
        overflow: hidden;
    }
    div.is-acf-field.wp-block-mfb-meta-field-block {
        position: absolute;
        font-weight: 500;
        bottom: 22px;
        padding-top: 4px;
        padding-right: 12px;
        background: var(--background);
        font-size: clamp(0.8rem, 1vw, 1rem) !important;
        white-space: nowrap;
        overflow: hidden;
    }
}
@media only screen and (max-width: 1000px) {
    .team-member-grid ul li:nth-child(1) {
        height: fit-content;
        max-height:unset;
        max-width: 500px;
        padding-left: 0;
        figure {
            height: fit-content;
            position: relative;
            width: 100%;
        }
    }
    .team-member-grid ul li { width: calc(50% - 12px); }
    .team-member-grid ul li:nth-child(n+2) {
        h2 { bottom: 4px; }
    }
}
@media only screen and (max-width: 700px) {
    .team-member-grid ul li { width: 100%; }
}
/*----------------------------------------- */
/*------- Team member page - single  ------ */
/*----------------------------------------- */
.member-template-default.single.single-member div.entry-content.wp-block-post-content p {
    font-weight: 300;
}

/*----------------------------------------- */
/*------------ Contact Page --------------- */
/*----------------------------------------- */
.contact-page-wrapper {
    padding-top: 0px;
    padding-left: max( 16px, calc((100vw - 1400px) / 2));
    container-type: inline-size;
}
.contact-page-wrapper > div {
    width: 55%;
    padding-right: 32px;
    padding-top: 142px;
    p {
        max-width: 500px;
    }
}
.contact-page-wrapper .project-contact-form {
    width: 500px;
    margin-top: 64px;
    padding-bottom: 8px;
    position: relative;
    top: 0;
    min-height: unset;
}
.contact-page-wrapper figure {
    width: 60%;
    height: 100cqh;
    position: sticky;
    top: 0;
    &::after {
        content: '';
        display: block;
        position: absolute;
        left: 0; top: 0;
        width: 100%; height: 100%;
        background: linear-gradient(90deg, hsl( from var(--background) h s l / 0.4), #0003);
    }
    img {
        height: 100%;
        width: 100%;
        object-fit: cover;
        position: relative;
    }
}

@media only screen and (max-width: 1000px) {
    .contact-page-wrapper {
        > div {
            width: 100%;
            padding-right: 16px;
        }
        .project-contact-form {
            width: 500px;
            max-width: 100%;
            margin-top: 64px;
            padding-bottom: 8px;
            position: relative;
            top: 0;
            min-height: unset;
        }
        figure {
            position: absolute;
            z-index: -1;
            width: 100%;
            left: 0;
            opacity: 0.3;
        }
    }
}

/*----------------------------------------- */
/*--------- Availabilities Page ----------- */
/*----------------------------------------- */
.availabilities-hero {
    padding: 16px;
    p { max-width: 700px; }
}
.availabilities-section {
    background: linear-gradient( 90deg,  #0000, #aaa2);
    width: max( 320px, calc(((100vw - 1400px) / 2) + 342px));
    padding-left: max(16px, calc((100vw - 1400px) / 2));
    margin-top: 100px;
    box-shadow: 0 0 0 1px #fff2;
    > h2 {
        padding-top: 42px;
        padding-bottom: 24px;
    }
    > div.wp-block-query ul {
        margin-left: 64px;
        padding-bottom: 8px;
        li {
            position: relative;
            width: 600px;
            background: var(--secondary);
            box-shadow: 0 0 0 1px #fff2;
            padding: 28px 16px 16px 16px;
            margin-bottom: 46px;

            p{
                max-width: 364px;
            }
            h2 {
                position: absolute;
                top: -32px;
                color: var(--background);
                background: #fff;
                font-size: 1rem;
                font-weight: 500;
                padding: 4px 12px;
            }
            figure {
                position: absolute;
                right: 0; top: 24px;
                width: 400px; height: 242px;
                overflow: hidden;
                translate: 200px;
                box-shadow: 0 0 0 1px #fff4;
                img {
                    object-position: center;
                    width: 100%; height: 100%;
                }
            }
            a.wp-element-button:hover {
                color: var(--primary) !important;
            }
            
            &::before {
                content: ''; display: block;
                background: var(--background);
                position: absolute; top: -1px; right: -1px;
                width: 100px; height: 100px;
                translate: 71px; transform-origin: 100% 0%;
                rotate: 45deg; box-shadow: 0 2px 0 -1px #fff2;
                clip-path:polygon( -100% 191%, 53% 41%, 200% 200%);
            }
        }
    }
    &::before {
        content: ''; display: block;
        background: var(--background);
        position: absolute; top: -1px; right: -1px;
        width: 100px; height: 100px;
        translate: 71px; transform-origin: 100% 0%;
        rotate: 45deg; box-shadow: 0 2px 0 -1px #fff2;
        clip-path: polygon( -100% 200%, 80% 0%, 200% 200%);

    }
}

@media only screen and (max-width: 1000px) {
    .availabilities-hero {
        padding-top: 124px !important;
        .wp-block-buttons {
            gap: 10px;
        }
        p {
            strong {
                font-size: 18px;
            }
        }
    }
    .availabilities-section {
        > h2 {
            font-size: 1.4rem !important;
            padding-top: 24px;
            padding-bottom: 12px;
            padding-left: 22px;
        }
        > div.wp-block-query ul {
            margin-left: 6px;
            li {
                width: min(500px, calc(100vw - 64px));
                padding-top: 16px;
                h2 {
                    position: relative;
                    background: none;
                    color: #fff;
                    padding-right: 22px;
                    top: 0; left: 0;
                    padding-left: 0;
                    font-size: 1.2rem;
                    margin-top: 0;
                }
                figure {
                    position: relative;
                    right: unset; top: 16px;
                    left: 0; translate: 0;
                    width: 100%; max-width: 400px;
                }
                &::before { width: 50px; height: 50px; translate: 35px; }
            }
        }
        &::before { width: 50px; height: 50px; translate: 35px; }
    }
}
@media only screen and (max-width: 400px) {
    .availabilities-section {
        > div.wp-block-query ul { li { &::before { display: none; } } }
        &::before { display: none; }
    }
}


/*----------------------------------------- */
/*------------ Investors Page ------------- */
/*----------------------------------------- */
.page-template-default .register-link {
    cursor: pointer;
    text-decoration: underline;
}
.investor-registration-modal {
    padding-top: 24px;
    padding-bottom: 100px;
    .investor-wrap {
        display: none;
        padding: 24px 32px;
        background: linear-gradient(90deg, var(--primary), hsl(from var(--primary) h s calc(l - 20)));
        max-width: 532px;
        margin-left: 0 !important;
        line-height: 124%;
        font-size: 0.9em;
        a {
            color: #fff;
        }
        hr {
            margin-top: 8px;
            max-width: 300px;
            margin-left: 0 !important;
        }
        input:not([type="checkbox"]){
            width: 100%;
            margin-bottom: 12px;
            padding: 12px 16px;
            font-family: var(--wp--preset--font-family--mona-sans);
            border: none;
            font-size: 0.9em;
            box-shadow: 0 2px 6px 0 #0006;
        }
        input[type="checkbox"] {
            -webkit-appearance: none;
            appearance: none;
            background-color: #fff;
            margin: 0;
            font: inherit;
            color: currentColor;
            width: 1.2em;
            height: 1.2em;
            border: 0.15em solid currentColor;
            border-radius: 0;
            transform: translateY(-0.075em);
            display: grid;
            place-content: center;
            cursor: pointer;
        }
        input[type="checkbox"]::before {
            content: "";
            width: 0.8em;
            height: 0.8em;
            transform: scale(0);
            transition: 120ms transform ease-in-out;
            box-shadow: inset 1em 1em #000;
        }
        input[type="checkbox"]:checked::before {
            transform: scale(1);
        }
        .wpcf7-form-control-wrap .wpcf7-form-control.wpcf7-checkbox {
            display: flex;
            flex-direction: column;
            gap: 12px;
            .wpcf7-list-item {
                margin-left: 0;
                display: flex;
                gap: 12px;
            }
        }
        .terms-conditions {
            box-shadow: inset 0 2px 6px 0 #0004;
            overflow-y: scroll;
            height: 200px;
            background: #dcdcdc;
            color: #2e2e2e;
            padding: 16px;
            font-size: 0.8em;
            line-height: 142%;
            font-weight: 500;
        }
        .wpcf7-not-valid-tip { color: #fff; margin-top: -4px;}
        .wpcf7-checkbox + .wpcf7-not-valid-tip { margin-left: 30px; margin-top: 4px; color: #000; }
        .post-terms-link {
            position: absolute;
            bottom: -32px;
            right: 0;
        }
    }
}