/* ===========================================================
   Programa Semear 2026 - estilos da LP (pagina 11348)
   Coordenadas convertidas do Figma: px / 19.2 = vw
   =========================================================== */

/* header flutua sobre o hero, mas sempre por cima dele */
.elementor-location-header{position:relative;z-index:20;}

/* ==================== HERO (Figma 2006:166) ==================== */
.semear-hero{position:relative;}
.semear-hero > .elementor-element{position:absolute;margin:0;}
.semear-hero .elementor-widget-image img{display:block;width:100%;height:auto;}
.semear-hero .elementor-widget-container{margin:0;}
.semear-hero .sh-painel{left:35.417vw;top:16.016vw;width:97.448vw;z-index:1;}
.semear-hero .sh-est2{left:-0.5vw;top:9vw;width:37vw;z-index:2;}
.semear-hero .sh-est1{left:14.051vw;top:6.458vw;width:42.719vw;z-index:3;}
.semear-hero .sh-lockup{left:57.083vw;top:23.5vw;width:32vw;z-index:4;}
.semear-hero .sh-data{left:59.479vw;top:41.693vw;width:auto;z-index:5;}
.semear-hero .sh-data .elementor-heading-title{white-space:nowrap;margin:0;}
.semear-hero .sh-selo{left:71.680vw;top:47.578vw;width:8.516vw;z-index:6;}
.semear-hero .sh-badge{left:76.354vw;top:11.328vw;width:13.571vw;z-index:7;}
.semear-hero .sh-flor{left:86.458vw;top:17.161vw;width:30vw;z-index:8;}
.semear-hero .sh-folha1{left:40.938vw;top:50.365vw;width:16.5vw;z-index:9;}
.semear-hero .sh-folha2{left:51.771vw;top:15.182vw;width:15.434vw;z-index:10;}
.semear-hero .sh-folha3{left:83.906vw;top:54.557vw;width:16.719vw;z-index:11;}
.semear-hero .sh-cred1,.semear-hero .sh-cred2{z-index:12;transform:rotate(-90deg);transform-origin:top left;white-space:nowrap;width:auto;}
.semear-hero .sh-cred1{left:50.5vw;top:50.5vw;}
.semear-hero .sh-cred2{left:6.5vw;top:60vw;display:none;} /* aguardando nome e cargo do estagiario da capa */
.semear-hero .sh-cred1 .elementor-heading-title,.semear-hero .sh-cred2 .elementor-heading-title{margin:0;}
.semear-hero::after{content:"";position:absolute;left:-1px;right:-1px;bottom:-1px;height:3.646vw;min-height:26px;background:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-ondinha-bege.svg) center bottom / 100% 100% no-repeat;z-index:15;pointer-events:none;}

@media (max-width:1024px){
.semear-hero{min-height:auto;background-color:#035F35;padding:26vw 6vw 108vw;align-items:center;justify-content:flex-start;}
.semear-hero > .elementor-element{position:relative;left:auto;top:auto;right:auto;bottom:auto;transform:none;width:auto;z-index:2;}
.semear-hero::before{content:"";position:absolute;inset:0;background:rgba(3,95,53,.78);z-index:1;}
.semear-hero::after{height:5.5vw;min-height:20px;}
.semear-hero .sh-painel,.semear-hero .sh-flor,.semear-hero .sh-folha1,.semear-hero .sh-folha2,.semear-hero .sh-folha3,.semear-hero .sh-badge,.semear-hero .sh-cred1,.semear-hero .sh-cred2{display:none;}
.semear-hero .sh-lockup{width:80vw;margin:0 auto;}
.semear-hero .sh-data{width:100%;margin-top:3vw;}
.semear-hero .sh-data .elementor-heading-title{text-align:center;white-space:normal;font-size:5.4vw;line-height:1.25em;}
.semear-hero .sh-selo{position:absolute;top:23vw;right:6vw;width:20vw;margin:0;z-index:6;}
.semear-hero .sh-est1,.semear-hero .sh-est2{position:absolute;bottom:0;z-index:2;height:108vw;overflow:hidden;}
.semear-hero .sh-est2{left:-18vw;width:88vw;}
.semear-hero .sh-est1{right:-18vw;width:86vw;}
.semear-hero .sh-est1 img,.semear-hero .sh-est2 img{width:100%;height:auto;display:block;}
}
@media (max-width:767px){
.semear-hero{padding:26vw 5vw 122vw;}
.semear-hero .sh-lockup{width:84vw;}
.semear-hero .sh-data .elementor-heading-title{font-size:6.2vw;}
.semear-hero .sh-selo{top:21vw;right:7vw;width:23vw;}
.semear-hero .sh-est1,.semear-hero .sh-est2{height:122vw;}
.semear-hero .sh-est2{left:-21vw;width:96vw;}
.semear-hero .sh-est1{right:-21vw;width:94vw;}
}

/* ==================== O PROGRAMA (Figma 2006:127) ==================== */
.semear-programa{position:relative;overflow:hidden;}
.semear-programa > .elementor-element{position:relative;z-index:2;}
.semear-programa .sp-flor-a,.semear-programa .sp-flor-b{position:absolute;z-index:1;pointer-events:none;}
.semear-programa .sp-flor-a img,.semear-programa .sp-flor-b img{display:block;width:100%;height:auto;}
.semear-programa .sp-flor-a{left:-9vw;top:2vw;width:24vw;transform:rotate(135deg);}
.semear-programa .sp-flor-b{right:-6vw;bottom:-1vw;width:24vw;transform:rotate(90deg);}
.semear-programa .sp-card{--justify-content:flex-start;justify-content:flex-start;}
.semear-programa .sp-card > .elementor-element{width:100%;}
.semear-programa .sp-card > .elementor-element > .elementor-widget-container{padding-left:0 !important;padding-right:0 !important;}
.semear-programa .sp-card .sp-icone{margin-bottom:auto;}
.semear-programa .sp-card .sp-icone svg,.semear-programa .sp-card .sp-icone i{fill:#005D31;color:#005D31;}
.semear-programa .sp-card .elementor-heading-title{color:#005D31;}
.semear-programa .sp-card .elementor-widget-heading + .elementor-widget-heading{margin-top:.4vw;}
@media (max-width:1024px){
.semear-programa{--padding-top:12vw !important;}
.semear-programa .sp-card{--padding-top:5vw !important;--padding-right:5vw !important;--padding-bottom:5vw !important;--padding-left:5vw !important;}
.semear-programa .sp-card .elementor-widget-heading + .elementor-widget-heading{margin-top:1.5vw;}
}
@media (max-width:767px){
.semear-programa{--padding-top:18vw !important;}
.semear-programa .sp-card{--padding-top:8vw !important;--padding-right:8vw !important;--padding-bottom:8vw !important;--padding-left:8vw !important;}
.semear-programa .sp-card .sp-icone{margin-bottom:5vw;}
.semear-programa .sp-card .elementor-widget-heading + .elementor-widget-heading{margin-top:2.5vw;}
.semear-programa .sp-flor-a,.semear-programa .sp-flor-b{display:none;}
}

/* ==================== PRE-REQUISITOS (Figma 2006:116) ==================== */
/* a onda do topo e recortada da propria imagem de fundo, como no Figma:
   a secao sobe 3.6vw e a mascara abre o vazio que revela a secao anterior */
.semear-prereq{position:relative;overflow:hidden;margin-top:-3.6vw;z-index:1;
  -webkit-mask-image:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-mascara-onda.svg),linear-gradient(#000,#000);
          mask-image:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-mascara-onda.svg),linear-gradient(#000,#000);
  -webkit-mask-size:100% 3.65vw,100% calc(100% - 3.35vw);
          mask-size:100% 3.65vw,100% calc(100% - 3.35vw);
  -webkit-mask-position:top center,bottom center;
          mask-position:top center,bottom center;
  -webkit-mask-repeat:no-repeat,no-repeat;
          mask-repeat:no-repeat,no-repeat;}
.semear-prereq{--padding-top:9vw !important;--padding-bottom:11vw !important;}
.semear-prereq .sp-card-escuro .elementor-heading-title{color:#FFFFFF !important;}
/* o selo do Figma e o icone branco multiplicado sobre um circulo amarelo */
.semear-prereq .sp-selo .elementor-widget-container{display:inline-block;line-height:0;border-radius:50%;background:#FFBD03;}
.semear-prereq .sp-selo img{display:block;width:6.5vw !important;height:6.5vw !important;max-width:none !important;mix-blend-mode:multiply;}
@media (max-width:1024px){
.semear-prereq .sp-selo img{width:12vw !important;height:12vw !important;}
}
@media (max-width:1024px){
.semear-prereq{margin-top:-5.5vw;-webkit-mask-size:100% 5.6vw,100% calc(100% - 5.2vw);mask-size:100% 5.6vw,100% calc(100% - 5.2vw);--padding-top:14vw !important;--padding-bottom:16vw !important;}
}
@media (max-width:767px){
.semear-prereq .sp-selo img{width:19vw !important;height:19vw !important;}
}

/* ==================== DEPOIMENTOS (Figma 2019:5106) ==================== */
.semear-depo{position:relative;overflow:hidden;}
.semear-depo > .elementor-element{position:relative;z-index:2;}
/* o fundo do depoimento e a forma organica do Figma, nao um retangulo girado */
.semear-depo-painel{
  transform:none;background-color:transparent !important;background-image:none;
  --padding-top:4.5vw !important;--padding-right:12vw !important;--padding-bottom:5vw !important;--padding-left:5vw !important;
  margin:0;position:relative;width:53vw !important;min-height:24vw;
}
/* a forma organica e uma camada propria, girada 7.614deg como no Figma,
   para o texto continuar na horizontal */
.semear-depo-painel::after{
  content:"";position:absolute;left:50%;top:50%;
  width:57vw;height:25.51vw;min-width:68.4rem;min-height:30.62rem;
  transform:translate(-50%,-50%) rotate(7.614deg);
  background:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-blob.svg) center/100% 100% no-repeat;
  z-index:1;pointer-events:none;
}
.semear-depo-conteudo{transform:none;position:relative;z-index:5;}
/* tira o swiper do papel de ancora para as setas escaparem do recorte */
.semear-depo .elementor-main-swiper{position:static !important;}
/* forma branca: fica ATRAS do blob, so a ponta superior direita aparece */
.semear-depo-painel::before{
  content:"";position:absolute;left:auto !important;bottom:auto !important;right:-2vw;top:3vw;
  width:23vw;height:10.3vw;
  transform:rotate(4deg);
  background:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-depo-setas.svg) center/100% 100% no-repeat;
  z-index:0;pointer-events:none;
}
.semear-depo .elementor-testimonial__text,
.semear-depo .elementor-testimonial__name,
.semear-depo .elementor-testimonial__title{font-style:normal;}
.semear-depo .elementor-testimonial__text{max-width:31vw;margin-left:auto;margin-right:auto;font-size:.88vw !important;line-height:1.35em !important;}
/* setas sobre a forma branca */
.semear-depo .elementor-swiper-button{width:2.1vw !important;height:2.1vw !important;min-width:32px;min-height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;top:0.1vw !important;bottom:auto !important;transform:none !important;z-index:4;}
.semear-depo .elementor-swiper-button-prev{left:auto !important;right:-2vw !important;background:#D9D9D9;}
.semear-depo .elementor-swiper-button-next{left:auto !important;right:-6vw !important;background:#035F35;}
.semear-depo .elementor-swiper-button-next svg,.semear-depo .elementor-swiper-button-next i{fill:#fff !important;color:#fff !important;}
.semear-depo .elementor-swiper-button-prev svg,.semear-depo .elementor-swiper-button-prev i{fill:#035F35 !important;color:#035F35 !important;}
.semear-depo .elementor-testimonial__name{font-size:1.35vw !important;margin-top:1.2vw;}
.semear-depo .elementor-testimonial__title{font-size:.72vw !important;}
.semear-depo .swiper-pagination{display:none;}
/* o recorte fica no contêiner do carrossel; as setas escapam porque
   o bloco que as ancora (.semear-depo-conteudo) esta fora dele */
.semear-depo .elementor-main-swiper{overflow:hidden;}
/* folhas */
.semear-depo .sd-folha-a,.semear-depo .sd-folha-b,.semear-depo .sd-folha-c{position:absolute;z-index:1;pointer-events:none;}
.semear-depo .sd-folha-a img,.semear-depo .sd-folha-b img,.semear-depo .sd-folha-c img{display:block;width:100%;height:auto;}
.semear-depo .sd-folha-a{left:92.484vw;top:24.596vw;width:24.219vw;transform:rotate(155deg);transform-origin:top left;}
.semear-depo .sd-folha-b{left:20.975vw;top:23.438vw;width:13.731vw;transform:rotate(5deg);transform-origin:top left;}
.semear-depo .sd-folha-c{left:23.958vw;top:6.198vw;width:10.176vw;}
@media (max-width:1024px){
.semear-depo-painel{--padding-left:9vw !important;--padding-right:9vw !important;}
.semear-depo .elementor-testimonial__text{max-width:100%;}
.semear-depo .sd-folha-a,.semear-depo .sd-folha-b,.semear-depo .sd-folha-c{display:none;}
}
@media (max-width:767px){
.semear-depo-painel{background-image:none;background-color:#035F35 !important;border-radius:6vw;--padding-top:12vw !important;--padding-right:7vw !important;--padding-bottom:12vw !important;--padding-left:7vw !important;}
.semear-depo-painel::before{display:none;}
.semear-depo .elementor-swiper-button{top:auto !important;bottom:4vw !important;}
.semear-depo .elementor-swiper-button-prev{right:auto !important;left:33vw !important;}
.semear-depo .elementor-swiper-button-next{left:auto !important;right:33vw !important;}
}

/* ==================== BENEFICIOS (Figma 2006:84) ==================== */
.semear-benef{position:relative;overflow:hidden;}
.semear-benef > .elementor-element{position:relative;z-index:2;}
.semear-benef .sb-folha-a,.semear-benef .sb-folha-b{position:absolute;z-index:1;pointer-events:none;}
.semear-benef .sb-folha-a img,.semear-benef .sb-folha-b img{display:block;width:100%;height:auto;}
.semear-benef .sb-folha-a{left:70.833vw;top:0;width:24.219vw;transform:rotate(180deg);transform-origin:top left;}
.semear-benef .sb-folha-b{left:3.75vw;top:53.058vw;width:13.731vw;transform:rotate(-21deg);transform-origin:top left;}
/* saida em onda na cor da secao seguinte (#005D31 das Etapas) */
.semear-benef::after{content:"";position:absolute;left:-1px;right:-1px;bottom:-1px;height:3.646vw;min-height:26px;background:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-ondinha.svg) center bottom / 100% 100% no-repeat;z-index:5;pointer-events:none;}
@media (max-width:767px){
.semear-benef .sb-folha-a,.semear-benef .sb-folha-b{display:none;}
.semear-benef::after{height:5.5vw;min-height:20px;}
}

/* ==================== ETAPAS (Figma 2016:4995) ==================== */
.semear-etapas{position:relative;overflow:hidden;}
.semear-etapas > .elementor-element{position:relative;z-index:2;}
.semear-etapas .se-flor-a,.semear-etapas .se-flor-b,.semear-etapas .se-badge{position:absolute;pointer-events:none;}
.semear-etapas .se-flor-a img,.semear-etapas .se-flor-b img,.semear-etapas .se-badge img{display:block;width:100%;height:auto;}
.semear-etapas .se-flor-a{left:90.753vw;top:-1.094vw;width:39.464vw;transform:rotate(40deg);transform-origin:top left;z-index:1;}
.semear-etapas .se-flor-b{right:120.05vw;top:24.27vw;width:39.464vw;transform:scaleX(-1) rotate(40deg);transform-origin:top right;z-index:1;}
.semear-etapas .se-badge{left:64.115vw;top:7.135vw;width:9.896vw;z-index:6;}
/* duas colunas: 1-2-3 a esquerda, 4-5 a direita */
.semear-etapas .se-coluna{align-self:flex-start;--width:46% !important;row-gap:2.2vw;}
.semear-etapas .se-coluna .elementor-widget-heading{width:100% !important;}
@media (max-width:767px){
.semear-etapas .se-flor-a,.semear-etapas .se-flor-b{display:none;}
.semear-etapas .se-coluna{--width:100% !important;}
.semear-etapas .se-badge{left:auto;right:4vw;top:3vw;width:20vw;}
}


/* PRE-REQUISITOS: saida em onda na cor da secao seguinte (#F8E7CB dos Beneficios) */
.semear-prereq::after{content:"";position:absolute;left:-1px;right:-1px;bottom:-1px;height:3.646vw;min-height:26px;background:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-ondinha-bege.svg) center bottom / 100% 100% no-repeat;z-index:5;pointer-events:none;}
@media (max-width:767px){.semear-prereq::after{height:5.5vw;min-height:20px;}}

/* ==================== A CULTURA CITROSUCO (Figma 2006:74) ==================== */
.semear-cultura{position:relative;overflow:hidden;}
.semear-cultura > .elementor-element{position:relative;z-index:2;}
/* thumb do video institucional (Figma 2019:5095) */
.semear-cultura .elementor-element-ce172ad img{width:36vw !important;max-width:none !important;height:auto !important;}
.semear-cultura .sc-video-wrap{position:relative;margin-top:6vw;}
.semear-cultura .sc-video{width:41.615vw;max-width:100%;position:relative;}
.semear-cultura .sc-video img{display:block;width:100%;height:auto;border-radius:2.2vw;}
/* o iframe mantem a proporcao do wrapper do Elementor; so arredondamos */
.semear-cultura .sc-video iframe{display:block;width:100%;border:0;}
.semear-cultura .sc-video .elementor-wrapper{border-radius:2.2vw;overflow:hidden;}
@media (max-width:1024px){
.semear-cultura .sc-video{width:82vw;}
.semear-cultura .sc-video .elementor-wrapper{border-radius:4vw;}
}
@media (max-width:767px){
.semear-cultura .sc-video{width:90vw;}
}

/* ==================== INSCRICOES 2027 (Figma 2071:78) ==================== */
/* foto do trio na esquerda, sangrando pela base */
.semear-inscricoes .si-trio{position:absolute;left:5.2vw;bottom:0;width:41vw;z-index:3;pointer-events:none;}
.semear-inscricoes .si-trio img{display:block;width:100%;height:auto;}
@media (max-width:1024px){
.semear-inscricoes .si-trio{position:relative;left:auto;bottom:auto;width:80vw;margin:0 auto 5vw;}
}
.semear-inscricoes{position:relative;overflow:hidden;margin-top:-3.6vw;z-index:1;
  -webkit-mask-image:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-mascara-onda.svg),linear-gradient(#000,#000);
          mask-image:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-mascara-onda.svg),linear-gradient(#000,#000);
  -webkit-mask-size:100% 3.65vw,100% calc(100% - 3.35vw);
          mask-size:100% 3.65vw,100% calc(100% - 3.35vw);
  -webkit-mask-position:top center,bottom center;
          mask-position:top center,bottom center;
  -webkit-mask-repeat:no-repeat,no-repeat;
          mask-repeat:no-repeat,no-repeat;
  --padding-top:13vw !important;--padding-bottom:13vw !important;}
@media (max-width:1024px){
.semear-inscricoes{margin-top:-5.5vw;-webkit-mask-size:100% 5.6vw,100% calc(100% - 5.2vw);mask-size:100% 5.6vw,100% calc(100% - 5.2vw);--padding-top:14vw !important;}
}
/* painel verde inclinado 8 graus atras do conteudo, como no Figma */
.semear-inscricoes .si-palco{position:relative;width:40%;margin-left:auto;margin-right:6vw;}
.semear-inscricoes .si-palco > .elementor-element{width:100% !important;}
.semear-inscricoes .si-palco > .elementor-element > .elementor-widget-container{padding-left:0 !important;padding-right:0 !important;}
.semear-inscricoes .si-palco > .elementor-element{position:relative;z-index:2;}
.semear-inscricoes .si-palco::before{
  content:"";position:absolute;left:50%;top:50%;
  width:63.553rem;height:30.98rem;min-height:calc(100% + 8vw);
  transform:translate(-50%,-50%) rotate(7.614deg);
  background:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-blob-inscricoes.svg) center/100% 100% no-repeat;
  z-index:1;
}
@media (max-width:1024px){
.semear-inscricoes .si-palco{width:82%;}
.semear-inscricoes .si-palco::before{width:52rem;height:25.34rem;}
}
@media (max-width:767px){
.semear-inscricoes .si-palco{width:92%;}
.semear-inscricoes .si-palco::before{width:100%;height:calc(100% + 16vw);background:#035F35;transform:translate(-50%,-50%);border-radius:4vw;}
}

/* ======================================================
   CORRECOES DE MOBILE (<=767px)
   Valores em vw do desktop vazavam para o celular; aqui
   cada secao recebe o seu proprio tamanho.
   ====================================================== */
@media (max-width:767px){

/* --- DEPOIMENTOS: a forma organica nao cabe; vira cartao arredondado --- */
.semear-depo-painel{width:92% !important;min-height:0 !important;}
.semear-depo-painel::after,.semear-depo-painel::before{display:none !important;}
.semear-depo .elementor-testimonial__text{max-width:100% !important;font-size:3.6vw !important;line-height:1.5em !important;}
.semear-depo .elementor-testimonial__name{font-size:5vw !important;margin-top:5vw !important;}
.semear-depo .elementor-testimonial__title{font-size:3.4vw !important;}
/* setas nas extremidades do cartao, centradas na vertical */
.semear-depo .elementor-swiper-button{top:50% !important;bottom:auto !important;transform:translateY(-50%) !important;}
.semear-depo .elementor-swiper-button-prev{left:-16% !important;right:auto !important;}
.semear-depo .elementor-swiper-button-next{left:auto !important;right:-16% !important;}

/* --- PRE-REQUISITOS: o selo transborda o topo do card (e o desenho),
       entao o card desce para nao bater no titulo --- */
.semear-prereq .sp-selo .elementor-widget-container{width:19vw;height:19vw;line-height:0;}
.semear-prereq .sp-card-escuro{margin-top:15vw !important;}

/* --- ETAPAS: folga entre o selo e o titulo --- */
.semear-etapas .se-badge{top:1vw;}
.semear-etapas{--padding-top:14vw !important;}

/* --- A CULTURA: mandala legivel no celular --- */
.semear-cultura .elementor-element-ce172ad img{width:72vw !important;}
.semear-cultura .sc-video-wrap{margin-top:10vw;}
}


/* ======================================================
   ORDEM NOVA DAS SECOES - cada onda usa a cor da seguinte
   Hero > Cultura > O programa > Depoimentos > Pre-requisitos
   > Cursos > Areas > Beneficios > Etapas > Inscricoes
   ====================================================== */
/* O programa entrega para Depoimentos (#F8E7CB) */
.semear-programa::after{content:"";position:absolute;left:-1px;right:-1px;bottom:-1px;height:3.646vw;min-height:26px;background:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-ondinha-bege.svg) center bottom / 100% 100% no-repeat;z-index:5;pointer-events:none;}
@media (max-width:767px){.semear-programa::after{height:5.5vw;min-height:20px;}}

/* ==================== CURSOS ELEGIVEIS ==================== */
.semear-cursos{position:relative;overflow:hidden;}
.semear-cursos .sc-colunas .elementor-heading-title{column-count:3;column-gap:3vw;}
@media (max-width:1024px){.semear-cursos .sc-colunas .elementor-heading-title{column-count:2;}}
@media (max-width:767px){.semear-cursos .sc-colunas .elementor-heading-title{column-count:1;}}
/* Cursos entrega para Areas (#035F35) */
.semear-cursos::after{content:"";position:absolute;left:-1px;right:-1px;bottom:-1px;height:3.646vw;min-height:26px;background:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-ondinha.svg) center bottom / 100% 100% no-repeat;z-index:5;pointer-events:none;}
@media (max-width:767px){.semear-cursos::after{height:5.5vw;min-height:20px;}}

/* ==================== AREAS ==================== */
.semear-areas{position:relative;overflow:hidden;}
.semear-areas .sa-colunas .elementor-heading-title{column-count:3;column-gap:3vw;}
@media (max-width:1024px){.semear-areas .sa-colunas .elementor-heading-title{column-count:2;}}
@media (max-width:767px){
.semear-areas .sa-colunas .elementor-heading-title{column-count:1;}
.semear-areas .sa-dupla{flex-direction:column;}
.semear-areas .sa-dupla > .elementor-element{width:100% !important;}
}
/* Areas entrega para Beneficios (#F8E7CB) */
.semear-areas::after{content:"";position:absolute;left:-1px;right:-1px;bottom:-1px;height:3.646vw;min-height:26px;background:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-ondinha-bege.svg) center bottom / 100% 100% no-repeat;z-index:5;pointer-events:none;}
@media (max-width:767px){.semear-areas::after{height:5.5vw;min-height:20px;}}

/* ==================== texto de abertura no hero ==================== */
.semear-hero .sh-intro{left:59.479vw;top:55.2vw;width:24vw;z-index:5;}
.semear-hero .sh-intro .elementor-heading-title{margin:0;}
@media (max-width:1024px){
.semear-hero .sh-intro{position:relative;left:auto;top:auto;width:100%;margin-top:4vw;}
.semear-hero .sh-intro .elementor-heading-title{text-align:center;}
}


/* ==================== ABERTURA (Figma 2071:42) ==================== */
.semear-intro{position:relative;overflow:hidden;}
.semear-intro > .elementor-element{position:absolute;margin:0;}
.semear-intro .elementor-widget-image img{display:block;width:100%;height:auto;}
/* a foto ocupa a altura inteira da secao; a tela 2:3 do recorte sangra pela esquerda */
.semear-intro .si-foto{left:-6vw;bottom:0;width:33vw;z-index:3;}
.semear-intro .si-folha-topo{left:67.3vw;top:0.4vw;width:9.6vw;z-index:1;}
.semear-intro .si-folha-dir{left:68.6vw;top:23.2vw;width:14.6vw;z-index:1;}
.semear-intro .si-folha-esq{left:11.8vw;top:21.8vw;width:12.3vw;z-index:4;}
.semear-intro .si-texto{left:29vw;top:6.6vw;width:49.6vw;z-index:2;}
.semear-intro .si-cta{left:36.4vw;top:23.6vw;width:27.7vw;z-index:2;}
.semear-intro .si-seta{left:44.8vw;top:28.2vw;width:10vw;z-index:2;}
.semear-intro .si-cred{left:15vw;top:36.6vw;width:30vw;z-index:5;}
.semear-intro .si-cred .elementor-heading-title,.semear-intro .si-texto .elementor-heading-title,.semear-intro .si-cta .elementor-heading-title{margin:0;}
/* entrega para A Cultura (#035F35) */
.semear-intro::after{content:"";position:absolute;left:-1px;right:-1px;bottom:-1px;height:3.646vw;min-height:26px;background:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-ondinha.svg) center bottom / 100% 100% no-repeat;z-index:6;pointer-events:none;}

@media (max-width:1024px){
.semear-intro{min-height:0;}
.semear-intro > .elementor-element{position:relative;left:auto;top:auto;right:auto;bottom:auto;width:auto;}
.semear-intro .si-folha-topo,.semear-intro .si-folha-dir,.semear-intro .si-folha-esq{display:none;}
.semear-intro .si-foto{width:40vw;margin:0 auto 4vw;}
.semear-intro .si-texto,.semear-intro .si-cta{width:100%;}
.semear-intro .si-cta{margin-top:4vw;}
.semear-intro .si-seta{width:100%;margin-top:3vw;}
.semear-intro .si-cred{width:100%;margin-top:5vw;}
.semear-intro .si-cred .elementor-heading-title{text-align:center;}
.semear-intro::after{height:5.5vw;min-height:20px;}
}

/* ======================================================
   ANIMACOES DE ENTRADA
   O JS marca .sm-anim nos elementos e .sm-vis quando entram
   na tela. Sem JS, ou com "reduzir movimento", tudo aparece
   normalmente -- a animacao nunca esconde conteudo.
   ====================================================== */
.sm-anim{opacity:0;transform:translateY(28px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1);
  will-change:opacity,transform;}
.sm-anim.sm-vis{opacity:1;transform:none;}
/* decorativos entram com um leve zoom em vez de subir */
.sm-anim.sm-deco{transform:scale(.88);}
.sm-anim.sm-deco.sm-vis{transform:none;}
/* escalonamento dos filhos (cards, etapas, beneficios) */
.sm-anim.sm-d1{transition-delay:.08s}
.sm-anim.sm-d2{transition-delay:.16s}
.sm-anim.sm-d3{transition-delay:.24s}
.sm-anim.sm-d4{transition-delay:.32s}
.sm-anim.sm-d5{transition-delay:.40s}
@media (prefers-reduced-motion:reduce){
.sm-anim,.sm-anim.sm-deco{opacity:1 !important;transform:none !important;transition:none !important;}
}

/* --- entrada do hero: acontece no carregamento, nao no scroll --- */
.semear-hero .sh-est2,.semear-hero .sh-est1,
.semear-hero .sh-lockup,.semear-hero .sh-data,.semear-hero .sh-selo,
.semear-hero .sh-painel{
  opacity:0;transition:opacity .9s cubic-bezier(.22,.61,.36,1),transform .9s cubic-bezier(.22,.61,.36,1);
}
.semear-hero .sh-painel{transform:translateX(5vw);}
.semear-hero .sh-est2{transform:translateX(-7vw);}
.semear-hero .sh-est1{transform:translateX(-5vw);}
.semear-hero .sh-lockup,.semear-hero .sh-data,.semear-hero .sh-selo{transform:translateY(32px);}
/* escalonamento: painel > pessoas > titulo > data > selo */
.semear-hero.sm-entrou .sh-painel{opacity:1;transform:none;transition-delay:.05s}
.semear-hero.sm-entrou .sh-est2{opacity:1;transform:none;transition-delay:.18s}
.semear-hero.sm-entrou .sh-est1{opacity:1;transform:none;transition-delay:.28s}
.semear-hero.sm-entrou .sh-lockup{opacity:1;transform:none;transition-delay:.42s}
.semear-hero.sm-entrou .sh-data{opacity:1;transform:none;transition-delay:.56s}
.semear-hero.sm-entrou .sh-selo{opacity:1;transform:none;transition-delay:.68s}
@media (prefers-reduced-motion:reduce){
.semear-hero .sh-est2,.semear-hero .sh-est1,.semear-hero .sh-lockup,
.semear-hero .sh-data,.semear-hero .sh-selo,.semear-hero .sh-painel{
  opacity:1 !important;transform:none !important;transition:none !important;}
}


/* ======================================================
   CELULAR: secoes de abertura e inscricoes sem as fotos
   Em tela estreita os recortes ficavam soltos; sai a foto
   e o conteudo assume uma ordem de leitura clara.
   ====================================================== */
@media (max-width:767px){

/* --- ABERTURA: texto > chamada > seta --- */
.semear-intro{display:flex;flex-direction:column;}
.semear-intro .si-foto,
.semear-intro .si-cred{display:none;}
.semear-intro .si-texto{order:1;margin:0;}
.semear-intro .si-cta{order:2;margin-top:7vw;}
.semear-intro .si-seta{order:3;margin-top:4vw;}

/* --- INSCRICOES: sem a foto do trio --- */
.semear-inscricoes .si-trio{display:none;}
.semear-inscricoes .si-palco{width:100%;margin-right:auto;}
}

/* ======================================================
   AJUSTES DE REVISAO
   ====================================================== */

/* O PROGRAMA: os icones tem alturas diferentes (cada glifo
   tem sua proporcao), o que empurrava cada titulo para uma
   altura. Altura fixa no icone alinha todos. */
/* espaco fixo depois do icone: com margin-bottom:auto a sobra variava
   por card e cada titulo caia numa altura diferente */
.semear-programa .sp-card .sp-icone{display:flex;align-items:center;min-height:3.6vw;margin-bottom:2vw !important;}
.semear-programa .sp-card .sp-icone .elementor-icon-wrapper{line-height:0;}
@media (max-width:1024px){.semear-programa .sp-card .sp-icone{min-height:7vw;margin-bottom:4vw !important;}}
@media (max-width:767px){.semear-programa .sp-card .sp-icone{min-height:13vw;margin-bottom:6vw !important;}}

/* DEPOIMENTOS: a forma precisa acomodar o depoimento mais
   longo; antes o texto passava da silhueta. So no desktop -- sem o
   guard estas regras vinham depois do media query e vazavam para o
   mobile, deixando a citacao com 3,6px. */
@media (min-width:1025px){
.semear-depo-painel{
  --padding-top:6vw !important;--padding-right:14vw !important;
  --padding-bottom:6.5vw !important;--padding-left:7vw !important;
  width:62vw !important;min-height:27vw;
}
/* sem minimos em rem: abaixo de 1920 eles venciam o vw e a forma
   crescia sozinha, passando por cima do titulo e da secao */
.semear-depo-painel::after{width:66vw;height:29.55vw;min-width:0;min-height:0;}
.semear-depo .elementor-testimonial__text{max-width:34vw !important;font-size:.92vw !important;line-height:1.45em !important;}
.semear-depo .elementor-testimonial__name{font-size:1.45vw !important;}
.semear-depo .elementor-testimonial__title{font-size:.78vw !important;}
}

/* AREAS: tres cards na linha de baixo */
.semear-areas .sa-dupla{flex-wrap:wrap;}
/* tres por linha em qualquer largura: 32% + os dois gaps de 24px
   estourava a linha por 4px e jogava o terceiro card para baixo */
.semear-areas .sa-dupla > .elementor-element{--width:calc((100% - 50px) / 3) !important;}
@media (max-width:767px){.semear-areas .sa-dupla > .elementor-element{--width:100% !important;}}

/* forma branca um pouco mais a esquerda: com o painel mais largo
   ela estava sobrando demais na direita */
@media (min-width:1025px){.semear-depo-painel::before{right:2vw;}}

/* Plano de Saude: "sem coparticipacao" so cabe inteiro numa linha com
   um pouco mais de largura util; o widget estava limitado a 90% */
@media (min-width:1025px){
.elementor-11348 .elementor-element.elementor-element-bc295fa{--padding-left:0.3vw !important;--padding-right:0.3vw !important;}
}
.elementor-11348 .elementor-element.elementor-element-b5d01d7{width:100% !important;}
.elementor-11348 .elementor-element.elementor-element-b5d01d7 > .elementor-widget-container{padding-left:0 !important;padding-right:0 !important;}
.elementor-11348 .elementor-element.elementor-element-b5d01d7 .elementor-heading-title{width:100% !important;max-width:100% !important;}
/* as caixas dos beneficios eram dimensionadas pelo conteudo, entao mexer
   no padding de uma encolhia so ela; fixa a largura das oito */
@media (min-width:1025px){
.elementor-11348 .elementor-element.elementor-element-9c335a5 > .e-con,
.elementor-11348 .elementor-element.elementor-element-55d12ed > .e-con{width:11.615vw !important;flex:0 0 11.615vw !important;}
}

/* emendas entre secoes: as alturas caem em coordenada fracionaria e cada
   secao compoe sozinha contra o branco do body, deixando um fio de 1px
   mais claro. 1px de sobreposicao elimina. */
.semear-hero,.semear-intro,.semear-cultura,.semear-programa,.semear-depo,
.semear-prereq,.semear-cursos,.semear-areas,.semear-benef,.semear-etapas{margin-bottom:-1px !important;}

/* Etapas: as linhas de apoio sao 0.45em inline, o que no celular
   derrubava para 10,5px -- menor que qualquer texto da pagina */
@media (max-width:767px){
.semear-etapas .elementor-heading-title span[style*="display:block"]{font-size:0.62em !important;}
}



/* ======================================================
   TABLET (768-1024)
   A faixa herdava do bloco max-width:1024 valores em vw
   calibrados para ~768px: a 1024 tudo estourava, e as
   secoes com posicionamento de desktop se sobrepunham.
   ====================================================== */
@media (min-width:768px) and (max-width:1024px){

/* CAPA: a 1024 o padding de 108vw dava 1900px de altura */
.semear-hero{padding:17vw 6vw 52vw;}
.semear-hero .sh-lockup{width:48vw;}
.semear-hero .sh-data .elementor-heading-title{font-size:3.2vw;}
.semear-hero .sh-selo{top:15vw;right:4vw;width:12vw;}
.semear-hero .sh-est1,.semear-hero .sh-est2{height:52vw;}
.semear-hero .sh-est2{left:5vw;width:42.4vw;}
.semear-hero .sh-est1{right:5vw;width:41.4vw;}

/* ABERTURA: mesma hierarquia do celular, sem a foto solta */
.semear-intro{--padding-left:6vw !important;--padding-right:6vw !important;display:flex;flex-direction:column;}
.semear-intro .si-foto,.semear-intro .si-cred{display:none;}
.semear-intro .si-texto{order:1;margin:0;}
.semear-intro .si-cta{order:2;margin-top:5vw;}
.semear-intro .si-seta{order:3;margin-top:3vw;}

/* A CULTURA: no desktop as colunas se encaixam por margem
   negativa; aqui elas colidiam, entao empilham */
.semear-cultura > .elementor-element{--width:100% !important;width:100% !important;
  margin-left:0 !important;margin-right:0 !important;margin-top:0 !important;margin-bottom:5vw !important;}
.semear-cultura .elementor-element-cf79722{justify-content:center;}
.semear-cultura .elementor-element-ce172ad img{width:50vw !important;margin:0 auto;}
.semear-cultura{--padding-left:6vw !important;--padding-right:6vw !important;}
/* a Aspiracao era a coluna da direita; empilhada alinha a esquerda */
.semear-cultura .elementor-element-4d67075 .elementor-heading-title,
.semear-cultura .elementor-element-f57d0de .elementor-heading-title{text-align:left !important;}

/* DEPOIMENTOS: a forma organica tem minimos em rem e cobria
   o titulo; aqui vale o cartao chapado do celular */
.semear-depo-painel{background-image:none;background-color:#035F35 !important;border-radius:3vw;
  width:82% !important;min-height:0 !important;
  --padding-top:6vw !important;--padding-right:6vw !important;--padding-bottom:6vw !important;--padding-left:6vw !important;}
.semear-depo-painel::after,.semear-depo-painel::before{display:none !important;}
.semear-depo .elementor-testimonial__text{max-width:100% !important;font-size:1.65vw !important;line-height:1.5em !important;}
.semear-depo .elementor-testimonial__name{font-size:2.6vw !important;margin-top:3vw !important;}
.semear-depo .elementor-testimonial__title{font-size:1.5vw !important;}
.semear-depo .elementor-swiper-button{top:50% !important;bottom:auto !important;transform:translateY(-50%) !important;}
.semear-depo .elementor-swiper-button-prev{left:-6% !important;right:auto !important;}
.semear-depo .elementor-swiper-button-next{left:auto !important;right:-6% !important;}

/* PRE-REQUISITOS: o selo cobria o titulo */
.semear-prereq .sp-selo img{width:9vw !important;height:9vw !important;}
.semear-prereq .sp-selo .elementor-widget-container{width:9vw;height:9vw;line-height:0;}
.semear-prereq .sp-card-escuro{margin-top:7vw !important;}

/* AREAS: o texto encostava nas bordas e o terceiro card caia
   de linha por 13px */
.semear-areas{--padding-left:6vw !important;--padding-right:6vw !important;}
.semear-areas .sa-dupla > .elementor-element{--width:calc((100% - 50px) / 3) !important;}
}

/* BENEFICIOS: largura fixa tambem no tablet, senao o card do
   Plano de Saude encolhe e o "sem" volta a ficar sozinho */
@media (min-width:768px) and (max-width:1024px){
.elementor-11348 .elementor-element.elementor-element-9c335a5 > .e-con,
.elementor-11348 .elementor-element.elementor-element-55d12ed > .e-con{
  width:auto !important;flex-grow:1 !important;flex-shrink:1 !important;flex-basis:0 !important;min-width:0 !important;}
/* 2vw dava 20,5px de titulo num card de 186px uteis */
.elementor-11348 .elementor-element-9c335a5 .elementor-heading-title,
.elementor-11348 .elementor-element-55d12ed .elementor-heading-title{font-size:1.75vw !important;}
}

/* no celular e no tablet o painel e verde chapado, entao a seta
   "proxima" sumia: circulo verde sobre fundo verde */
@media (max-width:1024px){
.semear-depo .elementor-swiper-button-next{background:#9BC74C !important;}
.semear-depo .elementor-swiper-button-next svg,
.semear-depo .elementor-swiper-button-next i{fill:#035F35 !important;color:#035F35 !important;}
}

/* celular: as caixas dos beneficios eram dimensionadas pelo conteudo
   e alternavam 225/233px, desalinhando a coluna */
@media (max-width:767px){
.elementor-11348 .elementor-element.elementor-element-9c335a5 > .e-con,
.elementor-11348 .elementor-element.elementor-element-55d12ed > .e-con{width:60vw !important;flex:0 0 60vw !important;
  margin-left:auto !important;margin-right:auto !important;}
}

/* ======================================================
   CAPA v2 (Figma 2074:261) -- Raul Araujo entra no lugar
   do estagiario anterior e a Bia reposiciona
   ====================================================== */
@media (min-width:1025px){
/* a dupla entra 0,8696 menor que no Figma, ancorada na base --
   o tamanho do frame deixava as pessoas grandes demais */
.semear-hero .sh-est2{left:3.820vw;top:8.259vw;width:28.670vw;}
.semear-hero .sh-est1{left:13.431vw;top:4.980vw;width:42.719vw;}
.semear-hero .sh-cred1{left:50.745vw;top:50.698vw;}
.semear-hero .sh-cred2{left:6.6vw;top:60.026vw;display:block;}
}
/* a foto do Raul e bem mais alta que a do estagiario anterior
   (1,885 contra 1,501 de proporcao): nos recortes de altura fixa
   do tablet e do celular ela cortaria a cabeca dele */
@media (min-width:768px) and (max-width:1024px){
.semear-hero .sh-est2{left:21.63vw;width:30.5vw;}
.semear-hero .sh-est1{right:20.88vw;width:41.4vw;}
}
@media (max-width:767px){
.semear-hero .sh-est2{left:-11.55vw;width:71.7vw;}
}

/* ======================================================
   INSCRICOES v2 (Figma 2074:82)
   Sai a foto do trio; entram uma pessoa de cada lado e o
   texto centralizado sobre a forma.
   Ordem de pilha do Figma: homem < forma < texto < mulher
   ====================================================== */
.semear-inscricoes .si-pessoa-e,.semear-inscricoes .si-pessoa-d{margin:0;pointer-events:none;}
.semear-inscricoes .si-pessoa-e img,.semear-inscricoes .si-pessoa-d img{display:block;width:100%;height:auto;}

@media (min-width:1025px){
/* a secao passa a ter exatamente a altura do frame (604px) e todos
   os elementos usam top, como no Figma */
.semear-inscricoes{min-height:31.458vw;}
.elementor-11348 .semear-inscricoes .elementor-element.si-pessoa-e{position:absolute !important;left:14.375vw;top:0;right:auto;bottom:auto;width:22.969vw !important;height:31.510vw;max-width:none;overflow:hidden;z-index:2;display:block !important;}
.semear-inscricoes .si-pessoa-e .elementor-widget-container{position:absolute;inset:0;}
.semear-inscricoes .si-pessoa-e img{position:absolute;left:-3.43%;top:-18.18%;width:115.47%;height:126.28%;max-width:none;}
.elementor-11348 .semear-inscricoes .elementor-element.si-pessoa-d{position:absolute !important;left:63.333vw;top:-3.125vw;right:auto;bottom:auto;width:23.125vw !important;height:34.635vw;max-width:none;z-index:5;display:block !important;}
/* a caixa dela precisa de altura propria: com height:auto e a imagem
   em loading=lazy a caixa colapsava para 0 e a imagem nunca carregava.
   No Figma esta camada e object-cover de 444x665. */
.semear-inscricoes .si-pessoa-d > .elementor-widget-container{height:100%;}
.semear-inscricoes .si-pessoa-d img{height:100% !important;object-fit:cover;object-position:center top;}

/* a forma passa a pertencer a secao, nao a coluna de texto */
.semear-inscricoes::before{content:"";position:absolute;left:28.490vw;top:3.646vw;
  width:49.479vw;height:24.115vw;z-index:3;pointer-events:none;
  background:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-forma-inscricao-v2.svg) center/100% 100% no-repeat;}
.semear-inscricoes .si-palco::before{display:none;}
.semear-inscricoes > .elementor-element:not(.si-pessoa-e):not(.si-pessoa-d),
.semear-inscricoes .si-palco{position:static;width:auto;margin:0;}
.semear-inscricoes .si-palco > .elementor-element{position:absolute;transform:none;margin:0;z-index:4;width:auto !important;}
/* o will-change da animacao no palco criava bloco de contencao e os
   widgets absolutos se ancoravam nele, nao na secao */
.semear-inscricoes .si-palco{will-change:opacity !important;z-index:4;}
.semear-inscricoes .si-palco > .elementor-element > .elementor-widget-container{padding:0 !important;}

/* a secao vira o sistema de coordenadas do frame */
.elementor-11348 .elementor-element.semear-inscricoes{--padding-top:0 !important;--padding-bottom:0 !important;--padding-left:0 !important;--padding-right:0 !important;}
.elementor-11348 .semear-inscricoes .elementor-element.elementor-element-b673934{left:37.448vw;top:8.188vw;bottom:auto;right:auto;width:25.885vw !important;}
.semear-inscricoes .elementor-element-b673934 .elementor-heading-title{text-align:center;font-size:3.5vw;line-height:.9em;color:#9BC74C;}
.elementor-11348 .semear-inscricoes .elementor-element.elementor-element-0c80d9a{left:32.969vw;top:12.406vw;bottom:auto;right:auto;width:33.958vw !important;}
.semear-inscricoes .elementor-element-0c80d9a .elementor-heading-title{text-align:center;font-size:1.302vw;line-height:1.198em;}
.elementor-11348 .semear-inscricoes .elementor-element.elementor-element-ad8e49e{left:42.552vw;top:20.365vw;bottom:auto;right:auto;width:16vw !important;}
.semear-inscricoes .si-redes .elementor-grid{justify-content:center;flex-wrap:nowrap;--grid-column-gap:0.6vw;--grid-row-gap:0px;}
.semear-inscricoes .si-redes .elementor-social-icon{width:2.879vw;height:2.879vw;font-size:1.2vw;}
}

/* tablet: sem as pessoas, texto centralizado na forma nova */
@media (min-width:768px) and (max-width:1024px){
.semear-inscricoes .si-pessoa-e,.semear-inscricoes .si-pessoa-d{display:none;}
.semear-inscricoes .si-palco::before{transform:translate(-50%,-50%);
  background-image:url(https://www.citrosuco.com.br/wp-content/uploads/figma-semear/semear-forma-inscricao-v2.svg);}
}
@media (max-width:767px){
.semear-inscricoes .si-pessoa-e,.semear-inscricoes .si-pessoa-d{display:none;}
}

/* lockup com # (Figma 2072:9): proporcao 2.145 contra 1.876 do anterior.
   A largura cresce para o texto manter o mesmo tamanho de antes. */
@media (min-width:1025px){
.semear-hero .sh-lockup{left:51.976vw;width:37.19vw;}
/* a data acompanha a borda esquerda do logo */
.semear-hero .sh-data{left:51.976vw;}
}