@font-face {
    font-family: 'Gravtune';
    src: url('../fonts/Gravtune-Regular.ttf') format('woff2'),
        url('../fonts/Gravtune-Regular.woff') format('woff'),
        url('../fonts/Gravtune-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'GC GRIND ExtBd';
    src: url('../fonts/GCGRIND-ExtraBold.woff2') format('woff2'),
        url('../fonts/GCGRIND-ExtraBold.woff') format('woff'),
        url('../fonts/GCGRIND-ExtraBold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Venice Magnefia';
    src: url('../fonts/VeniceMagnefia-Regular.woff2') format('woff2'),
        url('../fonts/VeniceMagnefia-Regular.woff') format('woff'),
        url('../fonts/VeniceMagnefia-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


:root{
    --color1: rgb(239,65,54);
    --color2: rgb(177,56,37);
    --color3: rgb(98,55,31);
    --color4: rgb(242,171,89);
    --color5: rgb(250,229,178);
    --color6: rgb(28,26,27);
    --bg: var(--color6);
    --white: #f9f9f9;
    --grey: #dfdfdf;
    --greylight: #f0f0f0;
    --font: "Google Sans Flex", sans-serif;
    --font2: 'GC GRIND ExtBd';
    --font3: 'Venice Magnefia';
    --fontsize: 16px;
    --lineHeight: 24px;
    --buttonRadius: 8px;
    --paddingSide: 40px;
    --imgRadius: 12px;
    --containerSize: 1440px;
    --clampItem: calc(100vw / 5);
    --clampSpacer: clamp(60px, 8vw, 100px);
}
/* RESP */
@media screen and (min-width: 1280px) {
    :root{
        --fontsize: 20px;
        --lineHeight: calc(var(--fontsize) * 1.61);
    }
}
@media screen and (max-width: 1280px) {
    :root{
        --containerSize: 960px;
    }
}
@media screen and (max-width: 1080px) {
    :root{
        --containerSize: 960px;
    }
}
@media screen and (max-width: 767px) {
    :root{
        --containerSize: 600px;
    }
}

/* RESET */
*,::before,::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}*,a{margin:0;padding:0}a,html{font-size:100%}.clearfix,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,img,menu,nav,section,summary{display:block}*,:focus{outline:0}a,img{border:0}body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin-block-end:0}a,abbr,acronym,address,applet,article,aside,audio,big,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,font,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,s,samp,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,ul,var,video{margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;background:0 0}em,mark{font-style:italic}ins,mark{background-color:#ff9;color:#000}html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}ul[role='list'],ol[role='list']{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}a{vertical-align:baseline;background:0 0}ins{text-decoration:none}mark{font-weight:700}del{text-decoration:line-through}input,select,.vertalign{vertical-align:middle}table{border-collapse:separate;border-spacing:0}caption,td,th{text-align:left;font-weight:400}input[type=submit]{-webkit-appearance:none}img,object{max-width:100%}p{margin-bottom:30px}.gallery-caption{margin-left:0;margin-bottom:10px;padding:0 10px}.aligncenter,.aligncenter img{margin-left:auto;margin-right:auto;clear:both}.clear{clear:both;height:0}.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}.none{display:none}.alignleft{float:left}.alignright{float:right;text-align:right}.aligncenter{display:block}.alignleft img{float:left}.alignright img{float:right}.aligncenter img{display:block}img.alignleft{float:left;margin:0 30px 0 0}img.alignright{float:right;margin:0 0 0 30px}img.aligncenter{margin-left:auto;margin-right:auto;display:block;clear:both}iframe{display:block}input,textarea{font-size:inherit;line-height:inherit;font-family:inherit;outline:0}.inv{display:none}a img{border:none}img{margin:0;padding:0;white-space:normal;display:block;object-fit:cover}.alignleft{text-align:left}.aligncenter{text-align:center}.alignRight{text-align:right}.alignLeft{text-align:left}.alignCenter{text-align:center}.right{text-align:right}.left{text-align:left}.center{text-align:center}.wp-smiley{display:inline}

/* MARK: STRUCTURE
------------------------------------------------------------------- */
html{scroll-behavior: smooth;}

body{ background: var(--white); color: var(--color6); font-size: var(--fontsize); font-weight: 400; line-height: var(--lineHeight); margin: 0; padding: 0; position: relative; overflow-x: hidden; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.globalFont, body { font-family: var(--font); font-optical-sizing: auto; font-style: normal; font-weight: 400; }

::selection { background-color: var(--color4); color: var(--color3); }
::-moz-selection { background-color: var(--color4); color:var(--color3); }
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--color6); }
::-webkit-scrollbar-thumb { background: var(--color1); border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { cursor: ns-resize !important; }

/* MARK: SIZES
------------------------------------------------------------------- */

.limiter{
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: var(--containerSize);
    padding-left: var(--paddingSide);
    padding-right: var(--paddingSide);
}

.w55p{width: 55%;}
.w65p{width: 65%;}
.w75p{width: 75%;}
.mw300{ max-width: 300px; }
.mw600{ max-width: 600px; }
.mw800{ max-width: 800px; }
.mw1000{ max-width: 1000px; }
.mw1200{ max-width: 1200px; }

.padTB-2{ padding-top: clamp(40px, 2vw, 100px); padding-bottom: clamp(40px, 2vw, 100px); }
.padTB-5{ padding-top: clamp(40px, 5vw, 100px); padding-bottom: clamp(40px, 5vw, 100px); }
.padT-2{ padding-top: clamp(40px, 2vw, 100px); }
.padB-2{ padding-bottom: clamp(40px, 2vw, 100px); }
.padT-5{ padding-top: clamp(40px, 5vw, 100px); }
.padB-5{ padding-bottom: clamp(40px, 5vw, 100px); }

.m-t-30{ margin-top:30px; }
.m-b-30{ margin-bottom:30px; }

.centerBox{
    margin-left: auto;
    margin-right: auto;
}
.negativeSide{ margin-left: calc(-1 * var(--paddingSide)); margin-right: calc(-1 * var(--paddingSide)); }

.darkBg{
    background: var(--color6) url('../img/patternDark.png') repeat center center;
    color: var(--white);
}
.vanillaBg{
    background: var(--color5);
    color: var(--color6);
}

.cols2{ display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--paddingSide); }
.cols1-2{ display: grid; grid-template-columns: 0.5fr 1fr; column-gap: var(--paddingSide); }
.vcenter{ align-items: center; }
.reverse div:nth-child(1){ order: 2; }

@media screen and (max-width: 767px) {
    .cols2{ grid-template-columns: 1fr; }
    .reverse div:nth-child(1){ order: 0; }
}
/* MARK: TYPOGRAPHY
------------------------------------------------------------------- */
a, input.button { cursor: pointer; text-decoration: none;
    -webkit-transition: color 0.2s ease-in-out;
    -moz-transition: color 0.2s ease-in-out;
    -o-transition: color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out;
}
a{ color: var(--textColor); }
a:hover{ color: var(--color1); }

h1 , h2 , h3 , h4 , h5 , h6 { color: inherit; font-family: var(--font2); font-style: normal; }
h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong { font-weight: bold; font-weight: 700; }
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img { display: inline-block; }

h1{ font-size: 60px; line-height:1.15; margin-bottom: 20px; }
h2{ font-size: clamp(30px, 6.5vw, 84px); line-height:1.15; margin-bottom: 20px; }
h3{ font-size: 24px; line-height:1.1; margin-bottom: 20px; }
h4{ font-size: 24px; line-height:1.1; margin-bottom: 20px; }
h5{ font-size: 18px; line-height:1.1; margin-bottom: 20px; }
h6{ font-size: 15px; line-height:1.1; margin-bottom: 20px; }

.biglines{ font-weight: 500; font-size: 20px; line-height:1.35; margin-bottom: 20px; }
.upper{ text-transform: uppercase;}
.font2{ font-family: var(--font2);}
.font3{ font-family: var(--font3);}
.bold{ font-weight: bold; }
.suptitle{ color: var(--color1); display: inline-block; font-family: var(--font3); font-size: 24px; margin-bottom: 10px; text-transform: uppercase; }
.sloganTxt{ font-size: clamp(30px, 5vw, 80px); }
.massiveTitle{ font-size: clamp(40px, 8vw, 120px); }
.balanced{ text-wrap: balance; }
small{ font-size: 80%; }

.button{
    background-color: var(--color1);
    border-radius: var(--buttonRadius);
    box-shadow:inset 0px 0px 10px 1px var(--color1), 0px 0px 0px 0px hsl(from var(--color1) h s l / 0.5);
    color: var(--white);
    display: inline-block;
    font-size: 13px;
    font-weight: bold;
    padding: 4px 20px;
    text-transform: uppercase;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    @supports (corner-shape: squircle) {
        corner-shape: squircle;
        border-radius: 24px;
    }
}
.button:hover{
    background-color: var(--color6);
    box-shadow:inset 0px 0px 0px 1px var(--color1), 0px 0px 0px 6px hsl(from var(--color1) h s l / 0.2);
}

.red{ color: var(--color1); }
.redDark{ color: var(--color2); }
.brown{ color: var(--color3); }
.sugar{ color: var(--color4); }
.vanilla{ color: var(--color5); }
.dark{ color: var(--color6); }

svg.red, svg.red path{ fill: var(--color1); }
svg.redDark, svg.redDark path{ fill: var(--color2); }
svg.brown, svg.brown path{ fill: var(--color3); }
svg.sugar, svg.sugar path{ fill: var(--color4); }
svg.vanilla, svg.vanilla path{ fill: var(--color5); }
svg.dark, svg.dark path{ fill: var(--color6); }

.dot_list{ padding: 0 0 0 30px; }
.dot_list li{
    position: relative;
    font-size: 20px;
    display: block;
    margin-bottom: 10px;
}
.dot_list li:before{content: '';background: var(--color1);width: 10px;height: 10px;display: block;position: absolute;top: 50%;left: -23px;border-radius: 3px; transform: translateY(-4px);}

.inColumn2{ column-count: 2; }


.mainBox{
    width: 100%;
    overflow: hidden;
}

.startScreen{
    background: var(--color1) url("../img/churroscamps-logo01.svg") no-repeat center center; background-size: 200px; width: 100%;height: 100svh;display: block;position: fixed;top: 0;left: 0; z-index:100;
    -webkit-transition: height 0.6s ease-in-out;
    -moz-transition: height 0.6s ease-in-out;
    -o-transition: height 0.6s ease-in-out;
    transition: height 0.6s ease-in-out;
}
.startScreen.active{ height: 0svh; }
/* MARK: FIRSTFOLD
------------------------------------------------------------------- */
.firstfold{
    position: relative;
}
.firstfold-illustration {
    padding-top: 80px;
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
}
.firstfold-illustration svg{ height: 100%; margin-left: auto; }
.firstfold-container {
    display: flex;
    max-width: 50%;
    min-height: 100lvh;
    flex-direction: column;
    justify-content: space-between;
}
.firstfold-circle {
    background-color: var(--color1);
    position: absolute;
    top: 0;
    right: 0;
    width: 30vw;
    height: 100%;
    z-index: 1;
    display: block;
}
.animIcons{ background:url('../img/churros_icons_anim.svg') repeat-y; position: absolute; left: -40px; height: 100%; width: 40px; display: block;}
.firstfold h1{ font-size: clamp(40px, 5vw, 90px); }
.firstfold-logo{ max-width: 120px; padding-top: clamp(30px, 3vw, 60px);}
.firstfold-contact{
    position: absolute;
    left: 50%;
    top: clamp(50px, 5vw, 80px);
    z-index: 5;
    width: 100%;
    text-align: right;
    max-width: var(--containerSize);
    transform: translateX(-50%);
    font-weight: bold;
    padding-right: 40px;
}
.firstfold-contact a{ border:1px solid var(--white); border-radius: var(--buttonRadius); padding: 6px 16px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.firstfold-contact a:hover{ background-color: var(--color5); border:1px solid var(--color5); color: var(--color3); }
.firstfold-contact svg{
    width: 24px;
    display: inline-block;
    vertical-align: middle;
}
.firstfold-contact svg path{ fill: #fff;
    -webkit-transition: fill 0.2s ease-in-out;
    -moz-transition: fill 0.2s ease-in-out;
    -o-transition: fill 0.2s ease-in-out;
    transition: fill 0.2s ease-in-out; }
.firstfold-contact a:hover svg path{ fill: var(--color3); }
.startArrowBox{
    padding-bottom: 2vw;
}
.startArrow {
    display: inline-block;
    animation: arrowFloat 3s infinite;
    opacity: 1;
    -webkit-transition: opacity 0.4s ease-out;
    -moz-transition: opacity 0.4s ease-out;
    -o-transition: opacity 0.4s ease-out;
    transition: opacity 0.4s ease-out;
}
.startArrow svg{
    display: block;
    width: 40px;
    height: 40px;
    fill: var(--color1);
}
.startArrow:hover svg{
    fill: var(--color4);
}

.isScrolling .startArrow {
    opacity: 0;
}

/* Animation */
@keyframes arrowFloat {
0% {
    transform: translateY(0);
    animation-timing-function: cubic-bezier(.2,.8,.4,1);
}

85% {
    transform: translateY(-10px); /* slow up */
    animation-timing-function: cubic-bezier(.2,.8,.4,1);
}

90% {
    transform: translateY(0px); /* slow up */
    animation-timing-function: cubic-bezier(.2,.8,.4,1);
}

95% {
    transform: translateY(-10px); /* slow up */
    animation-timing-function: cubic-bezier(.2,.8,.4,1);
}

100% {
    transform: translateY(0);
}
}

@media screen and (max-width: 1024px) {
    .firstfold-container {
        max-width: 100%;
        text-align: center;
    }
    .firstfold-illustration {
        padding-top: 0px;
        position: relative;
        width: 100%;
        max-width: 600px;
        margin: 0 auto;
    }
    .firstfold-circle {
        top: 20%;
        height: 20%;
        width: 100%;
    }
    .animIcons{ background:url('../img/churros_icons_anim2.svg') repeat-x; position: absolute; top: -40px; left: 0px; height: 40px; width: 100%; display: block;}
}
/* MARK: TRANSITION + SEPARATORS
------------------------------------------------------------------- */
.relative{ position:relative; z-index: 1; }

.transition-1{}
.transition-1 img{ margin: 0 auto; max-width: 800px; width:clamp(300px, 50%, 800px); }

.separ-churros{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
}
.separ-churros svg{ display: block; width: 100%;}
/* .separ-churros svg path{ fill: var(--color1); } */
.separ-churros div:nth-child(1){}
.separ-churros div:nth-child(2){
    max-width: 80px;
    padding: 0 20px;
}
.separ-churros div:nth-child(3){}

/* MARK: FIDELITY
------------------------------------------------------------------- */
.fidelity{}
.fidelity--title{ max-width: 1000px; margin: 0 auto 40px auto;}
.fidelity--title span{ color: var(--color1); display: block; font-size: calc(100% * 2); margin-bottom: 0px; }

.fidelity--box {
    padding: 5px 0 10px 20px;
    position: relative;
    font-size: 18px;
    line-height: 1.5;
    margin-bottom: 30px;
}
.fidelity--box p:last-child{ margin-bottom: 0; }

.fidelity--box h3{ margin-bottom: 10px;}
.fidelity--box:before{
    content:'';
    height: 34px;
    width: 5px;
    background-color: var(--color1);
    position:absolute; top: 0; left: 0;
    border-radius: 8px;
}

.iconsFloat90{
    position: relative;
    max-width: 1100px;
    margin: 0 auto;
    padding-left: 60px;
    padding-right: 60px;
}
.iconsFloat90 .iconBox {
    background-repeat: no-repeat;
    display: block;
    position: absolute;
    width: 50px;
    height: 50px;
}
.iconsFloat90 .float1 {
    background-image: url(../img/icon-color-churros.svg);
    top: 15%;
    left: 5%;
    transform: rotate(-90deg);
    animation: floatIcon1 3s infinite ease-in-out alternate-reverse;
}
.iconsFloat90 .float2 {
    background-image: url(../img/icon-color-churros2.svg);
    top: 70%;
    right: -30px;
    transform: rotate(16deg);
    animation: floatIcon2 2s infinite ease-in-out alternate-reverse;
}
.iconsFloat90 .float3 {
    background-image: url(../img/icon-color-churros-vector.svg);
    top: 10%;
    right: 5%;
    transform: rotate(30deg);
    animation: floatIcon3 0.4s infinite ease-in-out alternate-reverse;
}
.iconsFloat90 .float4 {
    background-image: url(../img/icon-color-churros-vector.svg);
    top: 75%;
    left: -20px;
    transform: rotate(-120deg);
    animation: floatIcon4 0.4s 0.1s infinite ease-in-out alternate-reverse;
}

@keyframes floatIcon1 {
  from { transform: translateY(-10px) rotate(-90deg); }
  to { transform: translateY(10px) rotate(-60deg); }
}

@keyframes floatIcon2 {
  from { transform: translateY(-10px) rotate(20deg); }
  to { transform: translateY(10px) rotate(6deg); }
}
@keyframes floatIcon3 {
  from { transform: scale(0.9) rotate(30deg); }
  to { transform: scale(1,1) rotate(30deg); }
}
@keyframes floatIcon4 {
  from { transform: scale(0.9) rotate(-120deg); }
  to { transform: scale(1,1) rotate(-120deg); }
}

@media screen and (max-width: 767px) {
    .iconsFloat90 .iconBox { width: 32px; height: 32px; }
}
/* MARK: TESTIMONIALS
------------------------------------------------------------------- */
.testimonials-box{
    display: grid;
    grid-template-columns: 180px 1fr;
    column-gap: 30px;
    max-width: 900px;
    margin: 30px auto 50px auto;
    align-items: center;
}
.testimonials-box.atRight{ direction: rtl; }
.testimonials-box.atRight .testimonials--citation {
    direction: ltr;
    text-align: right;
}
.testimonials--picture{}
.testimonials--citation{}
.testimonials--citation blockquote{color: var(--color1);font-family: var(--font3);font-size: 20px; line-height: 1.35; text-wrap: balance;}

.testimonials--citation blockquote p:last-child{ margin-bottom: 0; }
.testimonials--citation figcaption{font-weight: bold;}


@media screen and (max-width: 767px) {
    .testimonials-box {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }
    .testimonials--picture{ max-width: 140px;}
    .testimonials-box.atRight{ direction: ltr; }
    .testimonials--citation blockquote{font-size: 18px;}
    .testimonials-box.atRight .testimonials--citation { text-align: center;}
}

/* MARK: STRENGTH POINTS
------------------------------------------------------------------- */
.strengthPoints{
    position: relative;
    z-index: 2;
    display: grid;
    align-items: center;
    grid-template-columns: clamp(180px, 20vw, 260px) 1fr;
    width: fit-content;
    margin: 0 auto;
}
.strengthPoints figure{
    margin: -69px 0 20px 0;
}
.strengthPoints .content{
    padding: 40px;
}
.strengthPoints h2{ text-transform: uppercase; }


@media screen and (max-width: 767px) {
    .strengthPoints{
        display: flex;
        flex-direction: column;
    }
    .strengthPoints .content {
        padding: 0 0 20px 0;
    }
    .strengthPoints figure {
        margin: -39px auto 20px auto;
        max-width: 200px;
    }
}
/* MARK: ANCHOR POINTS
------------------------------------------------------------------- */
.target-shape{ position: absolute; top: 10%; left: 70%; width: 80%; z-index: -1; fill: var(--color1);
    animation: turnInRound 10s infinite linear forwards; }
@keyframes turnInRound {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(-360deg);
  }
}


/* MARK: FRANCHISÉ BANNER
------------------------------------------------------------------- */
.franchiseCTA{}
.franchiseCTA--logo{ text-align: center;}
.franchiseCTA--logo{ display: block; position:relative; }
.franchiseCTA--logo::after{
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    width: 100%;
    height: 50%;
    background: var(--bg);
}
.franchiseCTA--logo a{
    display: inline-block;
    max-width: 300px;
    position: relative;
    z-index: 1;
}

/* MARK: GALLERY
------------------------------------------------------------------- */
.churrosGallery {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    /* grid-template-rows: repeat(6, 1fr); */
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    margin-bottom: 40px;
}

@media screen and (min-width: 960px) {
    .churrosGallery--item1 { grid-area: 1 / 1 / 5 / 6; }
    .churrosGallery--item2 { grid-area: 1 / 6 / 3 / 9; }
    .churrosGallery--item3 { grid-area: 1 / 9 / 3 / 11; }
    .churrosGallery--item4 { grid-area: 3 / 6 / 5 / 8; }
    .churrosGallery--item5 { grid-area: 3 / 8 / 5 / 11; }
    .churrosGallery--item6 { grid-area: 5 / 1 / 7 / 3; }
    .churrosGallery--item7 { grid-area: 5 / 3 / 7 / 5; }
    .churrosGallery--item8 { grid-area: 5 / 5 / 7 / 9; }
    .churrosGallery--item9 { grid-area: 5 / 9 / 7 / 11; }
}
.churrosGallery div { background-color: #ff9; overflow: hidden; border-radius: 12px;}

.churrosGallery div img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

@media screen and (max-width: 959px) {
    .churrosGallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    }
}


/* MARK: EVENTS
------------------------------------------------------------------- */
.eventsLogosGrid{
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    justify-content: space-evenly;
    align-items: center;
    align-content: center;
    list-style: none;
    column-gap: 1vw;
    row-gap: 1vw;
}
.eventsLogosGrid li{
    background-color: var(--greylight);
    border: 1px solid var(--grey);
    border-radius: 8px;
    padding: 8px;
    /* aspect-ratio: 1 / 1; */
    display: flex;
    justify-content: center;
    align-items: center;
}
.eventsLogosGrid li a{ display: block; margin: 0; padding: 0;}
.eventsLogosGrid li img{
    mix-blend-mode: multiply;
    margin: 0 auto;
}

@media screen and (max-width: 767px) {
    .eventsLogosGrid{ grid-template-columns: repeat(3, 1fr); }
}



/* MARK: FOOTER
------------------------------------------------------------------- */
.churrosFooter{
    text-align: center;
}
.logoFooter{ display: block; position:relative; }
.logoFooter::after{
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    width: 100%;
    height: 50%;
    background: var(--white);
}
.logoFooter div{
    display: inline-block;
    max-width: 500px;
    position: relative;
    z-index: 1;
}
.socialLinks{ padding: 40px 0 20px 0; }
.socialLinks h2{
    color: var(--color1);
    font-size: 18px; line-height: normal;
    margin-bottom: 0px;
}
.socialLinks ul{
    display: flex;
    justify-content: center;
    align-items: center;
}
.socialLinks ul li{ list-style: none; }
.socialLinks ul a{ display: block; padding: 10px; width:80px; }
.socialLinks ul svg{ fill: #fff;  width:40px;
    -webkit-transition: fill 0.2s ease-in-out;
    -moz-transition: fill 0.2s ease-in-out;
    -o-transition: fill 0.2s ease-in-out;
    transition: fill 0.2s ease-in-out;
 }
.socialLinks ul a:hover svg{ fill: var(--color4); }

.churrosFooter .address{ margin-bottom: 0px; }
.churrosFooter .cta{
    font-size: 27px;
    font-weight: bold;
    margin: 10px 0;
}
.churrosFooter .cta a{ display: inline-block; margin: 10px 20px; vertical-align: middle; }
.churrosFooter .copyright{
    font-size: 11px;
    text-transform: uppercase;
    padding: 20px 10px 30px 10px;
}
.churrosFooter .copyright .centerBox{ margin-bottom: 20px; }


.scaleAppear {
  transform: scale(0.8);
}
.smoothV{
    transform: translateY(80px); opacity: 0;
}
.split-parent, .split-child {
  overflow: hidden;
}
.split-child {
  display: inline-block;
}



.leadPopin{
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100vh;
  background: rgb(28 26 27 / 97%);
  z-index: 9999;

  display: flex;
  align-items: center;
  justify-content: center;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transition: opacity 0.35s ease, visibility 0.35s ease;
}

.leadPopin.isActive{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.leadPopin-inner{
    width: min(92%, 600px);
    background: white;
    border-radius: 12px;
    padding: 24px;
    position: relative;
    text-align: center;
    max-height: 95svh;
    overflow: hidden;
    overflow-y: auto;
}

.closeLeadPopin{
  position: absolute;
  top: 25px;
  right: 25px;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  font-size: 18px;
  background: var(--color1);
  color: var(--white);
}

.leadForm{
  display: flex;
  flex-direction: column;
  margin-top: 24px;
  align-items: flex-start;
  row-gap: 0px;
}

.leadForm div{ width: 100%; margin-bottom: 5px; }

.leadForm .half{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    column-gap: 10px; row-gap:10px;
    width: 100%;
}

.leadPopin-inner h2{ font-size: 30px; line-height: 1.3; margin-bottom: 0px; text-align: center;}
.leadForm label{
    display: block;
    text-align: left;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    margin-top: 5px;
    margin-bottom: 2px;
}
.leadForm input,
.leadForm select,
.leadForm textarea{
  width: 100%;
  display: block;
  padding: 5px 14px;
  border: 1px solid #ddd;
  border-radius: 10px;
  font-size: 12px;
  min-height: 44px;
}
.leadForm input:focus,
.leadForm textarea:focus,
.leadForm input:active,
.leadForm textarea:active{ border: 1px solid var(--color5); }

.leadForm input::placeholder,
.leadForm textarea::placeholder{ font-style: italic; }

.leadForm textarea{
  min-height: 40px;
  resize: vertical;
}

.leadForm button{
  border: none;
  padding: 8px 16px;
  cursor: pointer;
  display: inline-block;
  width: auto;
    @supports (corner-shape: squircle) {
        corner-shape: squircle;
        border-radius: 24px;
    }
}

#formResponse {
    margin-top: 20px;
    font-size: 14px;
    transition: .3s ease;
}

.form-success {
    color: #2ecc71;
}

.form-error {
    color: #ff4d4d;
}

.error-field {
    border: 1px solid #ff4d4d !important;
}

.button.loading {
    opacity: .7;
    pointer-events: none;
}

.button.loading span {
    opacity: 0;
}

.button.loading::after {
    content: "Envoi...";
}


body.popinOpen{
  overflow: hidden;
}

.photo img{ border-radius: var(--imgRadius);}

.video-container{
    display: block;
    aspect-ratio: 16 / 9;
    width: 100%;
    position: relative;
}
.video-container:after{
    display:block; content: ''; position:absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 2;
}