@font-face {
    font-family: 'monument_regular';
    src: url("monument-regular.woff2") format('woff2'),
         url("monument-regular.woff") format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'gellix_bold';
    src: url("gellix-bold.woff2") format('woff2'),
         url("gellix-bold.woff") format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'gellix';
    src: url("gellix-regular.woff2") format('woff2'),
         url("gellix-regular.woff") format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/*
    PALETA DA CAMPANHA
    ============
    Cores extraidas da logo oficial (assets/logo-erika-full.png).
    O magenta e um gradiente que vai de #F31A75 a #B20B58; o --magenta
    e o tom medio, usado como cor de fundo do header para casar com o
    fundo da propria logo.
*/

:root {
    --magenta: #E1136E;
    --magenta-vivo: #F31A75;
    --magenta-escuro: #B20B58;
    --amarelo: #F9C30E;
    --rosa-claro: #FDE3EF;
    --texto: #333333;
    --branco: #FFFFFF;
}

/* ============ */

body{font-family: "gellix", sans-serif; font-size: 24px; color: var(--texto);}
a{text-decoration:none;}
a:hover{text-decoration:none;}
textarea, input:focus{outline: none;}

b, strong, h1, h2, h3, h4{font-family: 'gellix_bold';}
.padding{padding: 60px 0px;}
.mob{display: none;}
.column{flex-direction: column;}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/*
    HEADER
    ============
*/

header{background-color: var(--magenta);}
header nav{height: 118px;align-items: center;}
header nav a{font-family: 'gellix_bold';font-size: 15px;line-height: 20px;color: #fff;text-transform: uppercase;white-space: nowrap;}
header .spacer{min-width: 215px;}
header .menu{gap: 34px;text-align: center;line-height: 1.2;align-items: center;}
a.navbar-brand {position: absolute;margin-top: 3px;max-width: 200px;}
.header__actions{flex-direction: column;gap: 6px;}
.header__actions a{width: 156px;height: 33.33px;background: var(--amarelo);font-size: 16px;line-height: 24px;align-items: center;justify-content: center;display: flex;font-family: 'gellix_bold';color: var(--texto);gap: 8px;}
.header__actions a:nth-child(2){background: var(--branco);color: var(--magenta);}

.title__img_title{gap: 35px;font-family: 'monument_regular';text-align: left;margin: 0 0 40px 10px;align-items: flex-start;}
.title__img_title h2{font-size: 52.42px;line-height: 62.3px;font-weight: normal;margin: 6px 0 0;color: var(--magenta);}
.title__img_title h2 span{font-size: .65em;font-family: 'gellix';}
.title__img_title img{width: auto;height: 92px;max-width: 30%;}

/*
    NUMERO DE CAMPANHA
    ============
*/

.numero{display: inline-flex;align-items: center;justify-content: center;gap: 14px;font-family: 'monument_regular';line-height: 1;}
.numero__digitos{font-size: 1em;letter-spacing: .06em;color: var(--amarelo);white-space: nowrap;}
.numero__cargo{display: block;font-family: 'gellix_bold';font-size: .26em;text-transform: uppercase;letter-spacing: .08em;color: #fff;line-height: 1.2;text-align: left;}


/*
    HOME
    ============
*/

a:hover{opacity: 0.7;}

.home__historia{padding: 90px 0 0;}
.home__historia_content{margin-top: 50px;}
.home__historia_content_image {min-width: 380px;max-width: 400px;}
.home__historia_content_text {margin-top: 100px;}
.home__historia_content_text .col {width: 49%;}

.home__voluntario{padding: 120px 0;text-align: center;}
.home__voluntario_title{font-family: 'monument_regular';font-size: 40px;line-height: 48px;color: var(--magenta);margin-bottom: 30px;}
.home__voluntario_numero{margin: 0 auto 40px;background: var(--magenta);padding: 24px 46px;border-radius: 10px;font-size: 56px;}
/* CTAs: mesma altura, mesmo padding e mesmo eixo de texto nos dois botoes */
.home__voluntario_links{display: flex;justify-content: center;flex-wrap: wrap;gap: 24px;}
.cta{box-sizing: border-box;display: inline-flex;align-items: center;justify-content: center;gap: 14px;min-width: 330px;
     padding: 22px 32px;border-radius: 10px;font-family: 'gellix_bold';font-size: 19px;
     line-height: 1;text-transform: uppercase;letter-spacing: .02em;transition: transform .15s ease;}
.cta__ico{width: 30px;height: 30px;flex: none;fill: currentColor;}
.cta span{display: block;}
.cta:hover{transform: translateY(-2px);}
.cta--magenta{background: var(--magenta);color: #fff;}
.cta--amarelo{background: var(--amarelo);color: var(--texto);}

/*
    ASSISTA (reels do Instagram)
    ============
*/

.home__assista{padding: 90px 0;}
.assista__grid{display: grid;grid-template-columns: repeat(4, 1fr);gap: 20px;margin-top: 40px;}
.assista__item{position: relative;display: block;aspect-ratio: 4 / 5;overflow: hidden;border-radius: 8px;background-color: var(--rosa-claro);}
.assista__item img{width: 100%;height: 100%;object-fit: cover;transition: transform .3s ease;}
.assista__item:hover img{transform: scale(1.05);}
.assista__play{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 62px;height: 62px;border-radius: 50%;background: rgba(0,0,0,.45);display: flex;align-items: center;justify-content: center;pointer-events: none;}
.assista__play svg{width: 26px;height: 26px;fill: #fff;margin-left: 4px;}
.assista__legenda{position: absolute;left: 0;right: 0;bottom: 0;padding: 14px 12px;font-size: 14px;line-height: 18px;color: #fff;background: linear-gradient(to top, rgba(0,0,0,.75), rgba(0,0,0,0));font-family: 'gellix_bold';}

/*
    ACOMPANHE NO INSTAGRAM
    ============
*/

.home__videos{background-color: var(--rosa-claro);color: var(--texto);padding: 80px 0;}
.instagram-mosaic {display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 40px;}
.instagram-item {position: relative; aspect-ratio: 1 / 1; overflow: hidden; background-color: #eee;}
.instagram-item img {width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease;}
.instagram-item:hover img {transform: scale(1.05);}
.instagram-item .insta-overlay {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(225, 19, 110, 0.35); opacity: 0; transition: opacity 0.3s ease; display: flex; align-items: center; justify-content: center;}
.instagram-item:hover .insta-overlay {opacity: 1;}
.instagram-item .insta-overlay svg{width: 34px;height: 34px;fill: #fff;}

.instagram-cta{text-align: center;margin-top: 40px;}
.instagram-cta a{display: inline-flex;align-items: center;gap: 10px;background: var(--magenta);color: #fff;font-family: 'gellix_bold';font-size: 18px;text-transform: uppercase;padding: 14px 30px;border-radius: 6px;}

/*
    CONTATO
    ============
*/

.home_v1__contato_social{display: flex;justify-content: center;align-items: center;width: 49.3%;}
.home_v1__contato_social_wrapper{max-width: 440px;}
.home_v1__contato_social_title{font-family: 'monument_regular';font-size: 40px;line-height: 48px;color: var(--magenta); margin-bottom: 20px;}
.home_v1__contato_social_icons {display: flex;gap: 12px;}
.home_v1__contato_social_icons img{width: 44px;height: 44px;}

.home_v1__contato_zap{background-color: var(--magenta);padding: 80px 0;display: flex;justify-content: center;align-items: center;color: #fff;width: 50.1%;font-family: 'gellix_bold';font-size: 27px;line-height: 31.21px;}
.home_v1__contato_zap_wrapper{max-width: 403px;}
.home_v1__contato_zap_text{margin-top: 20px; border: 2px solid var(--amarelo);padding: 6px 15px;gap: 20px;font-family: 'gellix_bold';font-size: 44.12px;line-height: 53.39px;align-items: center;}
.home_v1__contato_zap_text span{float: left;margin: 7px 7px 0 0;font-size: 25.21px;line-height: 30.51px;}
.home_v1__contato_zap_text a{color: #FFF;margin-top: -5px;}

/*
    FOOTER
    ============
*/

footer{background-color: var(--magenta);}
.footer__bar img{filter: none;}
.footer__creditos{text-align: center;padding: 28px 15px;color: #fff;font-size: 14px;line-height: 22px;}
.footer__creditos a{color: var(--amarelo);}

/* ============ */

@media screen and (max-width: 990px) {
	.header__actions a {
		width: 100%;
		color: var(--magenta);
	}
	.assista__grid{grid-template-columns: repeat(3, 1fr);}
	.instagram-mosaic {grid-template-columns: repeat(3, 1fr);}
}

/* ============ */

@media screen and (max-width: 767px) {
	.desk{display: none;}
	.mob{display: block;}
	footer .container.flex.gap-1.space-between.acenter {
		flex-direction: column;
	}
	header{height: 45px;padding-top: 20px;}
	header nav ul li {text-align: left;}
	a.navbar-brand {margin-top: 32px;max-width: 150px;}
	body{font-size: 18px;}
	.title__img_title h2 {font-size: 31px;line-height: 38px;}
	.home__historia_content {margin-top: 0;flex-direction: column;}
	.home__historia_content_image {margin-left: 0;min-width: auto;width: 100%;text-align: center;}
	.home__historia_content_image img{display: inline-block;border-radius: 8px;}
	.home__historia_content_text {margin-top: 0px;flex-direction: column;}
	.home__historia_content_text .col {width: 100%;}

	.home__voluntario_title {font-size: 28px;line-height: 34px;}
	.home__voluntario_title br{display: none;}
	.home__voluntario_numero{font-size: 38px;padding: 18px 24px;}
	.home__voluntario_links{flex-direction: column;}
	.cta{width: 100%;min-width: 0;font-size: 16px;padding: 18px 20px;}

	.home_v1__contato .flex.space-between {flex-direction: column;}
	.home_v1__contato_social {width: 100%;padding: 40px 0;}
	.home_v1__contato_zap {padding: 40px 20px;width: calc(100% - 40px);font-size: 24px;line-height: 28px;margin-bottom: 20px}
	.home_v1__contato_zap_text {padding: 6px 5px;gap: 10px;font-size: 36px;line-height: 40px;align-items: center;}

	.home__assista {padding: 50px 0;}
	.home__videos {padding-top: 40px;padding-bottom: 30px;}
	.home__voluntario {padding: 80px 0;}


	header nav.show-menu {z-index: 99;}
}

/* ============ */

@media screen and (max-width: 600px) {
	.assista__grid {grid-template-columns: repeat(2, 1fr);}
	.instagram-mosaic {grid-template-columns: repeat(2, 1fr);}
}