/* /bazar no desenho novo. As fotos (carrossel 8eea78d) ficam como estão. */

/* ---------- a seção ocupa a tela toda (o header fica em cima, 102px no desktop) ---------- */
.elementor-3895 .elementor-element.elementor-element-3163a88 {
    --abz-header: 102px;
    padding: 32px 10px !important;
}
.elementor-3895 .elementor-element.elementor-element-3163a88 > .elementor-container {
    min-height: calc(100dvh - var(--abz-header) - 64px) !important;
    align-items: center;
}
/* as fotos cabem na tela: até 550px, menos em telas baixas */
.elementor-3895 .elementor-element.elementor-element-8eea78d {
    --height: clamp(360px, calc(100dvh - var(--abz-header) - 120px), 550px) !important;
}

/* ---------- coluna do texto: tudo empilhado, botão e setas na mesma linha ---------- */
.elementor-3895 .elementor-element-d18c897 > .elementor-widget-wrap {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
    gap: 0 10px;
}
:where(.elementor-3895 .elementor-element-d18c897 > .elementor-widget-wrap) > .elementor-widget { margin: 0 !important; }
.elementor-3895 .elementor-element-d18c897 :is(.elementor-element-352cdb5, .elementor-element-8b8b5de, .elementor-element-acb35bf) { flex: 0 0 100%; }
.elementor-3895 .elementor-element-d8bfd3b { order: 5; width: auto !important; margin-top: 32px !important; }
.elementor-3895 .elementor-element-484665e { order: 6; width: auto !important; margin: 32px 0 0 auto !important; }
.elementor-3895 .elementor-element-4a313b1 { order: 7; width: auto !important; margin-top: 32px !important; }

/* titulozinho com o coração desenhado à mão */
.abz-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 16px;
    font-family: Quicksand, sans-serif;
    font-size: var(--t-mini, 14px);
    font-weight: 700;
    color: #1f1e1a;
}
.abz-eyebrow .hx-eb-coracao {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    overflow: visible;
    fill: none;
    stroke: var(--hx-eb, #cd2121);
    stroke-width: 2.3;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 90;
    animation: abz-nasce 1.1s .2s cubic-bezier(.5, 0, .2, 1) backwards;
}
@keyframes abz-nasce { from { stroke-dashoffset: 90; } }

.abz-titulo {
    margin: 0;
    font-family: Quicksand, sans-serif;
    font-size: var(--t-topo-coluna, 48px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -.02em;
    color: #1f1e1a;
}
.abz-marca { position: relative; display: inline-block; color: #cd212a; }
.abz-risco {
    position: absolute;
    left: 0;
    bottom: -.12em;
    width: 100%;
    height: .24em;
    overflow: visible;
    fill: none;
    stroke: #fcce45;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-dasharray: 220;
    animation: abz-risca .9s .5s cubic-bezier(.5, 0, .2, 1) backwards;
}
@keyframes abz-risca { from { stroke-dashoffset: 220; } }

.abz-texto {
    margin: 24px 0 0;
    max-width: 440px;
    font-family: Quicksand, sans-serif;
    font-size: var(--t-texto, 16px);
    font-weight: 500;
    line-height: 1.6;
    color: #5b5750;
}

.abz-info {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 24px 0 0;
    padding: 0;
    list-style: none;
}
.abz-info li {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    font-family: Quicksand, sans-serif;
    font-size: var(--t-texto, 16px);
    font-weight: 600;
    color: #1f1e1a;
}
.abz-info svg {
    flex: 0 0 auto;
    box-sizing: content-box;
    padding: 8px;
    border-radius: 50%;
    background: #faf0f0;
    color: #cd212a;
}

/* setas: bolinhas no padrão do botão, sem a caixa preta de antes */
.elementor-3895 :is(.elementor-element-484665e, .elementor-element-4a313b1, .elementor-element-aae01a8, .elementor-element-cdd42fd) .elementor-widget-container { padding: 0 !important; border: 0 !important; background: none !important; }
button.abz-seta,
button.abz-seta:hover,
button.abz-seta:focus {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #f7eeec !important; /* sem borda: o rosinha do site (a pílula dos cards do blog) */
    color: #1f1e1a !important;
    box-shadow: none;
    cursor: pointer;
    transition: color .2s;
    position: relative;
    isolation: isolate;
}
/* hover da bolinha do "Voltar para o blog": uma vermelha nasce do centro, com a mola, e a seta fica branca */
button.abz-seta::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 50%; background: #cd212a; transform: scale(0); transition: transform .4s var(--amace-curva); }
@media (hover: hover) { button.abz-seta:hover { color: #fff !important; } button.abz-seta:hover::before { transform: scale(1); } }
button.abz-seta:focus-visible { color: #fff !important; }
button.abz-seta:focus-visible::before { transform: scale(1); }
button.abz-seta:focus-visible { outline: 3px solid rgba(205, 33, 42, .35); outline-offset: 3px; }

/* ---------- botão no padrão da Home (.hx-btn, copiado de amace-hero-extras) ---------- */
.hx-btn {
    --hx-btn-icone: 40px;
    --hx-btn-pad: 10px;
    --hx-btn-gap: 8px;
    --hx-mola: cubic-bezier(.17, .67, .3, 1.33);
    position: relative;
    display: inline-flex;
    align-items: center;
    height: 60px;
    padding: var(--hx-btn-pad);
    padding-left: calc(var(--hx-btn-pad) + 6px);
    font-family: Quicksand, sans-serif;
    font-size: 17px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none !important;
    white-space: nowrap;
    isolation: isolate;
}
.hx-btn::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 10px; background: var(--hx-btn-fundo); transition: transform .4s var(--amace-curva); }
.hx-btn--vermelho-cheio { --hx-btn-fundo: #cd212a; --hx-btn-bola: #fff; --hx-btn-seta: #cd212a; color: #fff !important; }
.hx-btn__texto { padding: 0 var(--hx-btn-pad); transition: transform .4s var(--amace-curva); }
.hx-btn__icone { display: inline-grid; place-items: center; width: var(--hx-btn-icone); height: var(--hx-btn-icone); border-radius: 50%; background: var(--hx-btn-bola); color: var(--hx-btn-seta); transition: transform .4s var(--amace-curva); }
.hx-btn__icone--padrao { margin-left: var(--hx-btn-gap); }
.hx-btn__icone--hover { position: absolute; top: 50%; left: var(--hx-btn-pad); transform: translateY(-50%) scale(0); }
.hx-btn:hover::before, .hx-btn:focus-visible::before { transform: scale(1.05); }
.hx-btn:hover .hx-btn__texto, .hx-btn:focus-visible .hx-btn__texto { transform: translateX(calc(var(--hx-btn-icone) + var(--hx-btn-gap) - 6px)); }
.hx-btn:hover .hx-btn__icone--padrao, .hx-btn:focus-visible .hx-btn__icone--padrao { transform: scale(0); }
.hx-btn:hover .hx-btn__icone--hover, .hx-btn:focus-visible .hx-btn__icone--hover { transform: translateY(-50%) scale(1); }
.hx-btn:focus-visible { outline: 3px solid rgba(205, 33, 42, .35); outline-offset: 3px; border-radius: 10px; }

@media (prefers-reduced-motion: reduce) {
    .abz-eyebrow .hx-eb-coracao, .abz-risco { animation: none; }
    .hx-btn::before, .hx-btn__texto, .hx-btn__icone, button.abz-seta, button.abz-seta::before { transition: none; }
}

/* ---------- mobile ---------- */
@media (max-width: 767px) {
    .elementor-3895 .elementor-element.elementor-element-3163a88 { --abz-header: 80px; padding: 24px 16px 40px !important; }
    .elementor-3895 .elementor-element.elementor-element-8eea78d { --height: 420px !important; }
    .elementor-3895 .elementor-element-d8bfd3b { margin-top: 28px !important; }
    .hx-btn { --hx-btn-icone: 32px; height: 48px; font-size: 15px; }
    button.abz-seta, button.abz-seta:hover, button.abz-seta:focus { width: 44px; height: 44px; }
}

/* desktop: a coluna do texto um pouco mais larga, para botão e setas caberem na mesma linha */
@media (min-width: 1025px) {
    .elementor-3895 .elementor-element.elementor-element-d18c897 { width: 36% !important; }
    .elementor-3895 .elementor-element.elementor-element-e6d900e { width: 64% !important; }
    .elementor-3895 .elementor-element-4a313b1 { margin-left: 0 !important; }
}
.elementor-3895 :is(.elementor-element-484665e, .elementor-element-4a313b1) { flex: 0 0 auto; width: auto !important; }
.elementor-3895 :is(.elementor-element-484665e, .elementor-element-4a313b1) .elementor-widget-container { width: auto !important; }
.elementor-3895 .elementor-element.elementor-element-484665e { margin-left: 6px !important; }
.elementor-3895 :is(.elementor-element-484665e, .elementor-element-4a313b1) > .elementor-widget-container { margin: 0 !important; }

/* mobile: tudo alinhado à esquerda e sem a altura mínima (o conteúdo empilhado já passa da tela) */
@media (max-width: 767px) {
    .elementor-3895 .elementor-element.elementor-element-3163a88 > .elementor-container { min-height: 0 !important; }
    .elementor-3895 .elementor-element-d18c897 :is(.elementor-widget-container, .abz-titulo, .abz-texto) { text-align: left !important; }
    .elementor-3895 .elementor-element-d18c897 > .elementor-widget-wrap { justify-content: flex-start; }
    .elementor-3895 .elementor-element.elementor-element-e6d900e > .elementor-widget-wrap { padding-top: 28px !important; }
}
.elementor-3895 :is(.elementor-element-aae01a8, .elementor-element-cdd42fd) > .elementor-widget-container { margin: 0 5px !important; }

/* o ícone do calendário não é mais cortado no topo */
.abz-info svg { overflow: visible; }

/* setas embaixo da primeira foto, à esquerda (as da coluna das fotos, que antes só apareciam no celular) */
.elementor-3895 .elementor-element-d18c897 :is(.elementor-element-484665e, .elementor-element-4a313b1) { display: none !important; }
.elementor-3895 .elementor-element.elementor-element-e6d900e .elementor-widget.elementor-element-aae01a8,
.elementor-3895 .elementor-element.elementor-element-e6d900e .elementor-widget.elementor-element-cdd42fd { display: block !important; width: auto !important; margin: 20px 10px 0 0 !important; }
.elementor-3895 :is(.elementor-element-aae01a8, .elementor-element-cdd42fd) > .elementor-widget-container { margin: 0 !important; }
.elementor-3895 .elementor-element.elementor-element-e6d900e > .elementor-widget-wrap { display: flex !important; flex-wrap: wrap; justify-content: flex-start !important; align-content: center; }
.elementor-3895 .elementor-element.elementor-element-e6d900e .elementor-element-8eea78d { flex: 0 0 100%; }

/* centro visual: a seção centraliza a foto com o texto; as setas ficam penduradas
   embaixo da foto sem entrar na conta (a margem negativa anula a altura delas) */
@media (min-width: 768px) {
    .elementor-3895 .elementor-element.elementor-element-e6d900e .elementor-widget.elementor-element-aae01a8,
    .elementor-3895 .elementor-element.elementor-element-e6d900e .elementor-widget.elementor-element-cdd42fd { margin-bottom: -72px !important; }
}
@media (min-width: 768px) {
    .elementor-3895 .elementor-element.elementor-element-e6d900e .elementor-widget.elementor-element-8eea78d { margin-bottom: 0 !important; }
    .elementor-3895 .elementor-element.elementor-element-e6d900e .elementor-widget.elementor-element-aae01a8,
    .elementor-3895 .elementor-element.elementor-element-e6d900e .elementor-widget.elementor-element-cdd42fd { margin-top: 24px !important; margin-bottom: -76px !important; }
}

/* "apoio" em preto, com o rabisco do "Como surgiu a AMACE?" da Home
   (o zigue-zague à mão do Elementor, em vermelho, mesmo encaixe) */
.abz-marca { color: #1f1e1a; z-index: 0; }
.abz-risco {
    left: 50%;
    top: 50%;
    bottom: auto;
    width: calc(100% + 20px);
    height: calc(100% + 20px);
    transform: translate(-50%, -50%);
    z-index: -1;
    stroke: #cd212a;
    stroke-width: 5;
    stroke-linejoin: round;
    stroke-dasharray: 1500;
    animation: abz-risca 1.2s .4s cubic-bezier(.5, 0, .2, 1) backwards;
}
@keyframes abz-risca { from { stroke-dashoffset: 1500; } }
/* rabisco em verde (o verde da AMACE) */
.abz-risco { stroke: #30ae16; }
/* mobile: o título à esquerda, como o resto do texto (04/10: deixou de ser centralizado) */
@media (max-width: 767px) {
    .elementor-3895 .elementor-element-352cdb5 .abz-titulo,
    .elementor-3895 .elementor-element-352cdb5 > .elementor-widget-container { text-align: left !important; }
}
/* mobile: setas centralizadas; o carrossel vai até a borda direita da tela,
   com a próxima foto aparecendo num pedacinho (o JS muda para 1,15 foto por vez) */
@media (max-width: 767px) {
    /* as setas à esquerda, alinhadas com o texto; o carrossel até a borda (a margem do celular é 20px) */
    .elementor-3895 .elementor-element.elementor-element-e6d900e > .elementor-widget-wrap { justify-content: flex-start !important; }
    .elementor-3895 .elementor-element.elementor-element-e6d900e .elementor-widget.elementor-element-8eea78d { margin-right: calc(-1 * var(--amace-lado, 20px)) !important; flex-basis: calc(100% + var(--amace-lado, 20px)); max-width: none; }
}
@media (max-width: 767px) {
    .elementor-3895 .elementor-element.elementor-element-8eea78d .swiper { overflow: hidden !important; }
    .elementor-3895 .elementor-element.elementor-element-e6d900e .elementor-widget.elementor-element-aae01a8,
    .elementor-3895 .elementor-element.elementor-element-e6d900e .elementor-widget.elementor-element-cdd42fd { margin: 20px 10px 0 0 !important; }
}
/* mobile: mesmo respiro entre o header e o título das outras páginas (~60px) */
@media (max-width: 767px) {
    .elementor-3895 .elementor-element.elementor-element-3163a88 { padding-top: 50px !important; }
}

/* "vira" e "apoio" sempre na mesma linha (no celular o "vira" ficava sozinho no fim da primeira) */
.abz-junto { white-space: nowrap; }
