/* ==========================================================================
   builder.css — layout das páginas convertidas do construtor visual antigo.
   Cada bloco tem uma classe .e{id}; o CSS da página (assets/css/pages/*.css)
   ajusta as variáveis abaixo por bloco e por breakpoint (≤1024px tablet, ≤767px mobile).
   ========================================================================== */

/* Container flex (.box). .box--boxed tem .box__in centralizado com largura máxima. */
.box {
    --display: flex; --flex-direction: column; --flex-wrap: nowrap; --justify-content: normal; --align-items: normal; --align-content: normal;
    --row-gap: 20px; --column-gap: 20px; --content-width: min(100%, 1140px); --width: 100%; --min-height: initial; --height: auto;
    --padding-top: 10px; --padding-right: 10px; --padding-bottom: 10px; --padding-left: 10px;
    --margin-top: 0px; --margin-right: 0px; --margin-bottom: 0px; --margin-left: 0px;
    --border-radius: 0; --border-style: initial; --border-color: initial;
    --border-top-width: 0px; --border-right-width: 0px; --border-bottom-width: 0px; --border-left-width: 0px;
    --container-widget-width: 100%; --container-widget-flex-grow: 0; --container-widget-align-self: initial; --container-widget-height: initial;
    --flex-grow: 0; --flex-shrink: 1; --flex-basis: auto; --align-self: initial; --order: initial;
    --position: relative; --z-index: revert; --overflow: visible; --text-align: initial; --flex-wrap-mobile: wrap;
    display: var(--display); position: var(--position); z-index: var(--z-index); overflow: var(--overflow);
    flex: var(--flex-grow) var(--flex-shrink) var(--flex-basis); align-self: var(--align-self); order: var(--order);
    width: var(--width); min-width: 0; min-height: var(--min-height); height: var(--height);
    margin: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
    padding: var(--padding-top) var(--padding-right) var(--padding-bottom) var(--padding-left);
    border-style: var(--border-style); border-color: var(--border-color); border-radius: var(--border-radius);
    border-width: var(--border-top-width) var(--border-right-width) var(--border-bottom-width) var(--border-left-width);
    text-align: var(--text-align);
}
.box--full { flex-direction: var(--flex-direction); flex-wrap: var(--flex-wrap); justify-content: var(--justify-content); align-items: var(--align-items); align-content: var(--align-content); gap: var(--row-gap) var(--column-gap); }
.box--boxed { flex-direction: column; padding-block: 0; }
/* como no Elementor: em container "boxed" o padding vertical fica no interno */
.box--boxed > .box__in { padding-block: var(--padding-top) var(--padding-bottom); }
.box__in { display: var(--display); flex-direction: var(--flex-direction); flex-wrap: var(--flex-wrap); justify-content: var(--justify-content); align-items: var(--align-items); align-content: var(--align-content); gap: var(--row-gap) var(--column-gap); flex: 1 1 auto; width: 100%; max-width: var(--content-width); height: 100%; margin: 0 auto; }
.box--full.box--grid, .box--boxed.box--grid > .box__in { display: grid; grid-template-columns: var(--e-con-grid-template-columns, repeat(3, 1fr)); grid-template-rows: var(--e-con-grid-template-rows, auto); grid-auto-flow: var(--grid-auto-flow, row); }
.page-builder > .box { --margin-left: auto; --margin-right: auto; max-width: min(100%, var(--width)); }
.box::before { content: none; position: absolute; inset: 0; z-index: 0; pointer-events: none; border-radius: inherit; }
.box > * { position: relative; }

/* Itens (widgets) dentro dos containers */
/* Como .elementor-element: variáveis de flex não são herdadas do container pai */
.w, .sec, .col { --flex-direction: initial; --flex-wrap: initial; --justify-content: initial; --align-items: initial; --align-content: initial; --flex-basis: initial; --flex-grow: initial; --flex-shrink: initial; --order: initial; --align-self: initial; }
.w { position: relative; min-width: 0; max-width: 100%; flex-grow: var(--flex-grow, 0); flex-shrink: var(--flex-shrink, 1); flex-basis: var(--flex-basis, auto); align-self: var(--align-self, auto); order: var(--order, initial); }
.w img { display: inline-block; vertical-align: middle; }
.w-heading .hd { margin: 0; padding: 0; line-height: 1; }
.w-heading .hd a { color: inherit; text-decoration: none; }
.w-image { margin: 0; text-align: center; }
.w-image img { height: auto; max-width: 100%; }
.w-image figcaption { margin-top: 8px; font-size: 14px; }
.w-button .bt { display: inline-block; padding: 12px 24px; border-radius: 3px; background-color: #69727d; color: #fff; fill: #fff; font-size: 15px; line-height: 1; text-align: center; text-decoration: none; transition: all .3s; }
.w-button .bt__wrap { display: flex; flex-direction: row; gap: 5px; justify-content: center; }
.w-button .bt__icon { display: flex; align-items: center; }
.w-button .bt__icon svg { width: 1em; height: auto; }
.w-button .bt__icon img { width: 1em; height: auto; }
.w-button .bt__text { display: inline-block; }
.w-spacer .sp { height: var(--spacer-size, 50px); }
.w-divider { --divider-border-style: solid; --divider-color: #000; --divider-border-width: 1px; --divider-pattern-height: 20px; padding-block: 15px; }
.w-divider .dv { display: flex; width: var(--divider-width, 100%); }
.w-divider .dv__line { display: block; width: 100%; border-top: var(--divider-border-width) var(--divider-border-style) var(--divider-color); }
.w-video .video { border-radius: inherit; }
.w-icon-list ul { list-style: none; margin: 0; padding: 0; }
.w-icon-list li { display: flex; align-items: center; gap: 8px; }
.w-icon-list li + li { margin-top: calc(var(--icon-list-gap, 0px)); }
.w-icon-list svg { width: var(--e-icon-list-icon-size, 14px); height: var(--e-icon-list-icon-size, 14px); fill: currentColor; flex: 0 0 auto; }
.w-icon-list a { display: flex; align-items: center; gap: 8px; color: inherit; text-decoration: none; }
.w-social { display: flex; flex-wrap: wrap; gap: var(--grid-column-gap, 5px); }
.w-social a { display: inline-grid; place-items: center; width: calc(var(--icon-size, 25px) + 2 * var(--icon-padding, .5em)); height: calc(var(--icon-size, 25px) + 2 * var(--icon-padding, .5em)); border-radius: 10%; background: var(--c-primary); color: #fff; }
.w-social svg { width: var(--icon-size, 25px); height: var(--icon-size, 25px); fill: currentColor; }
.w-icon .ic { display: inline-flex; font-size: 50px; }
.w-icon svg { width: 1em; height: 1em; fill: currentColor; }
.w-html { overflow-wrap: anywhere; }
.w-map iframe { width: 100%; height: 300px; border: 0; }
.w-gallery { display: grid; grid-template-columns: repeat(var(--gallery-columns, 4), 1fr); gap: var(--gallery-gap, 10px); }
.w-gallery img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 1; }

/* Visibilidade por dispositivo */
@media (min-width: 1025px) { .hide-desktop { display: none !important; } }
@media (min-width: 768px) and (max-width: 1024px) { .hide-tablet { display: none !important; } }
@media (max-width: 767px) {
    .hide-mobile { display: none !important; }
    .box { --width: 100%; --flex-wrap: var(--flex-wrap-mobile); }
}
.w-video, .w-map, .w-testimonials, .w-posts { width: 100%; }

/* Cores/tipografia globais referenciadas pelo CSS das páginas convertidas */
:root {
    --e-global-color-primary: #6EC1E4; --e-global-color-secondary: #54595F; --e-global-color-text: #7A7A7A; --e-global-color-accent: #61CE70;
    --e-global-color-eb4d8c9: #007377; --e-global-color-4b88599: #26CCC0; --e-global-color-8074b0d: #FFFFFF; --e-global-color-9686985: #FF7500; --e-global-color-4faea3c: #FFFFFF;
    --e-global-typography-primary-font-family: "Vinila"; --e-global-typography-primary-font-weight: 600;
    --e-global-typography-secondary-font-family: "Vinila"; --e-global-typography-secondary-font-weight: 400;
    --e-global-typography-text-font-family: "Vinila"; --e-global-typography-text-font-weight: 400;
    --e-global-typography-accent-font-family: "Vinila"; --e-global-typography-accent-font-weight: 500;
}

/* Seções/colunas (layout antigo, anterior aos containers) */
.sec { position: relative; }
.sec__in { display: flex; margin-inline: auto; max-width: 1140px; position: relative; }
.sec--full > .sec__in { max-width: none; }
.col { position: relative; display: flex; min-height: 1px; width: 100%; }
.col__in { display: flex; flex-wrap: wrap; align-content: flex-start; width: 100%; padding: 10px; position: relative; }
.col__in > .w { width: 100%; }
.col__in > .w:not(:last-child) { margin-block-end: 20px; }
.sec::before, .col__in::before { content: none; position: absolute; inset: 0; pointer-events: none; }
@media (max-width: 767px) { .sec__in { flex-wrap: wrap; } .col { width: 100% !important; } }
@media (max-width: 1024px) { .sec__in { max-width: 1024px; } }

/* Tipografia-base herdada do tema antigo (aplicada só às páginas convertidas) */
.page-builder { font-family: Georgia, Cambria, "Times New Roman", Times, serif; font-size: 14px; font-weight: 400; line-height: 18px; letter-spacing: .5px; color: #676767; }
:where(.page-builder) p { margin: 0; padding-bottom: 1.5em; font-size: 1.4em; line-height: 1.5; letter-spacing: .01rem; font-weight: 400; color: #333; }
:where(.page-builder) :is(ul, ol) { margin: 0 0 30px 30px; padding: 0; font-size: 1.4em; color: #333; list-style: none; }
:where(.page-builder) blockquote { margin: 4.5px 0; padding: 4.5px 40px; font: 300 18px/1.45 Georgia, serif; color: #383838; }
/* títulos do tema antigo (fora dos widgets de título, que têm estilo próprio) */
:where(.page-builder) :is(h1, h2, h3, h4, h5, h6) { margin: 0 0 7px; font-family: "Bebas Neue", arial, helvetica, sans-serif; font-weight: 400; color: #333; }
:where(.page-builder) h1 { font-size: 54px; line-height: 62px; }
:where(.page-builder) h2 { font-size: 35px; line-height: 44px; text-transform: uppercase; }
:where(.page-builder) h3 { font-family: Georgia, serif; font-size: 22px; line-height: 34px; }
:where(.page-builder) h4 { font-family: Georgia, serif; font-size: 18px; line-height: 32px; }
:where(.page-builder) h5 { font-size: 16px; line-height: 26px; }
:where(.page-builder) h6 { font-size: 14px; line-height: 24px; }
@media (max-width: 767px) {
    :where(.page-builder) h2 { font-size: 26px; line-height: 32px; }
    :where(.page-builder) h3 { font-size: 18px; line-height: 24px; }
    :where(.page-builder) h4 { font-size: 17px; line-height: 26px; }
}
@font-face { font-family: "Vinila Variable Test 300"; font-weight: 300; font-display: swap; src: url("../fonts/vinila-test-300.woff2") format("woff2"); }
@font-face { font-family: "Vinila Variable Test 700"; font-weight: 700; font-display: swap; src: url("../fonts/vinila-test-700.woff2") format("woff2"); }
@font-face { font-family: "Bebas Neue"; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/bebas-neue.woff2") format("woff2"); }
:where(.page-builder) a { color: #27ccc0; }
.page-builder .testimonials, .page-builder .form:not(.form--ac), .page-builder .card, .page-builder .video-item { font-family: var(--font); letter-spacing: .01em; }

/* Alinhamento de botões/widgets (classes al-*, al-t-* tablet, al-m-* mobile) */
.w-button.al-justify .bt { width: 100%; } .al-left { text-align: left; } .al-center { text-align: center; } .al-right { text-align: right; } .al-justify .bt { width: 100%; }
@media (max-width: 1024px) { .al-t-left { text-align: left; } .al-t-center { text-align: center; } .al-t-right { text-align: right; } .al-t-justify .bt { width: 100%; } }
@media (max-width: 767px) { .al-m-left { text-align: left; } .al-m-center { text-align: center; } .al-m-right { text-align: right; } .al-m-justify .bt { width: 100%; } }
/* Como no original: widget nunca ultrapassa o container (vence larguras fixas por elemento) */
.page-builder .box > .w, .page-builder .box__in > .w { max-width: 100%; }

/* Padrão do widget de título no construtor antigo (sobrescrito pelo CSS de cada elemento) */
.w-heading .hd { font-family: "Roboto", sans-serif; font-weight: 600; color: #6ec1e4; letter-spacing: normal; }
:where(.w-heading) :where(h1.hd) { font-size: 54px; }
:where(.w-heading) :where(h2.hd) { font-size: 35px; text-transform: uppercase; }
:where(.w-heading) :where(h3.hd) { font-size: 22px; }
:where(.w-heading) :where(h4.hd) { font-size: 18px; }
:where(.w-heading) :where(h5.hd) { font-size: 16px; }
:where(.w-heading) :where(h6.hd) { font-size: 14px; }

/* Seções antigas: altura de tela cheia / mínima e alinhamento vertical */
@media (min-width: 768px) { .sec--h-full { height: 100vh; display: flex; } .sec--h-full > .sec__in { height: 100%; } }
.sec--h-full > .sec__in, .sec--h-min > .sec__in { width: 100%; }
.sec--middle > .sec__in { align-items: center; } .sec--top > .sec__in { align-items: flex-start; } .sec--bottom > .sec__in { align-items: flex-end; }
.sec--h-full.sec--middle { align-items: center; }
/* Padrões de texto e botão do construtor antigo (kit global) */
.w-text { font-family: "Roboto", sans-serif; font-weight: 400; color: #7a7a7a; }
.w-button .bt { font-family: "Roboto", sans-serif; font-weight: 500; background-color: #61ce70; }

/* Galeria "justified": linhas com altura ideal; imagens crescem para preencher a linha */
.w-gallery--justified { display: flex; flex-wrap: wrap; gap: var(--gap); width: 100%; }
.w-gallery--justified img { flex: 1 1 auto; width: auto; height: var(--row); max-width: 100%; object-fit: cover; aspect-ratio: auto; }
@media (max-width: 1024px) { .w-gallery--justified { gap: var(--gap-t); } .w-gallery--justified img { height: var(--row-t); } }
@media (max-width: 767px) { .w-gallery--justified { gap: var(--gap-m); } .w-gallery--justified img { height: var(--row-m); } }

/* Template "padrão" do tema antigo: conteúdo dentro do container do tema */
.theme-container { width: 88%; max-width: 1100px; margin: 0 auto; padding-top: 40px; }
@media (min-width: 690px) and (max-width: 999px) { .theme-container { max-width: 600px; } }
@media (min-width: 1000px) and (max-width: 1299px) { .theme-container { max-width: 880px; } }
.breadcrumbs { margin: 0; padding-bottom: 1.5em; font: 400 19.6px/1.5 Georgia, Cambria, "Times New Roman", serif; letter-spacing: .16px; color: #333; }
.breadcrumbs a { color: #27ccc0; text-decoration: none; }

/* Ícones (como .elementor-icon): tamanho por font-size, SVG 1em */
.ic { display: inline-block; font-size: 50px; line-height: 1; text-align: center; color: #69727d; fill: currentColor; transition: all .3s; }
.ic svg { display: block; width: 1em; height: 1em; position: relative; }
.view-stacked .ic { padding: .5em; background-color: #69727d; color: #fff; fill: #fff; }
.view-framed .ic { padding: .5em; border: 3px solid #69727d; background-color: transparent; color: #69727d; }
.shape-circle .ic { border-radius: 50%; } .shape-rounded .ic { border-radius: 10%; } .shape-square .ic { border-radius: 0; }
.ic-link { color: inherit; }
.w-icon-list .ic { font-size: inherit; color: inherit; line-height: 1; }
.w-icon-list .ic svg { width: var(--e-icon-list-icon-size, 14px); height: var(--e-icon-list-icon-size, 14px); }

/* Icon-box / image-box (.ib) */
.ib { display: flex; flex-direction: column; text-align: center; }
.ib__icon { display: inline-block; flex: 0 0 auto; line-height: 0; }
.ib__content { flex-grow: 1; width: 100%; }
.ib__title a { color: inherit; }
.ib__desc { margin: 0; }
.pos-inline-start .ib, .pos-left .ib { flex-direction: row; text-align: start; }
.pos-inline-end .ib, .pos-right .ib { flex-direction: row-reverse; text-align: end; }
.pos-block-start .ib, .pos-top .ib { flex-direction: column; text-align: center; align-items: unset !important; }
.pos-block-end .ib { flex-direction: column-reverse; text-align: center; align-items: unset !important; }
@media (max-width: 1024px) {
    .pos-t-inline-start .ib { flex-direction: row; text-align: start; } .pos-t-inline-end .ib { flex-direction: row-reverse; text-align: end; }
    .pos-t-block-start .ib { flex-direction: column; text-align: center; align-items: unset !important; } .pos-t-block-end .ib { flex-direction: column-reverse; text-align: center; align-items: unset !important; }
}
@media (max-width: 767px) {
    .pos-m-inline-start .ib { flex-direction: row; text-align: start; } .pos-m-inline-end .ib { flex-direction: row-reverse; text-align: end; }
    .pos-m-block-start .ib { flex-direction: column; text-align: center; align-items: unset !important; } .pos-m-block-end .ib { flex-direction: column-reverse; text-align: center; align-items: unset !important; }
}
.w-image-box .ib { display: block; text-align: center; }
.w-image-box .ib__img { display: inline-block; margin: 0; }
.w-image-box .ib__img img { display: block; line-height: 0; }
.w-image-box .ib__content { width: 100%; }
.w-image-box.pos-top .ib__img { margin: auto; }
@media (min-width: 768px) {
    .w-image-box.pos-left .ib, .w-image-box.pos-right .ib { display: flex; }
    .w-image-box.pos-right .ib { flex-direction: row-reverse; text-align: end; }
    .w-image-box.pos-left .ib { flex-direction: row; text-align: start; }
}
.valign-top .ib { align-items: flex-start; } .valign-middle .ib { align-items: center; } .valign-bottom .ib { align-items: flex-end; }
@media (max-width: 767px) { .w-image-box .ib__img { margin-inline: auto !important; margin-bottom: 15px; } }

/* Seções antigas: ordem invertida no tablet/celular */
@media (max-width: 1024px) and (min-width: 768px) { .sec--rev-t > .sec__in { flex-direction: row-reverse; } }
@media (max-width: 767px) { .sec--rev-m > .sec__in { flex-direction: column-reverse; } }

/* Formulário do construtor antigo (Elementor Form) nas páginas convertidas */
.form--el { display: flex; flex-wrap: wrap; gap: 0; margin: 0 -5px; }
.form--el .form__field, .form--el .form__actions { width: 100%; padding: 0 5px; margin-bottom: 10px; gap: 0; }
.form--el .form__label { display: block; padding-bottom: 5px; font: 400 18px/1 "Roboto", sans-serif; color: #7a7a7a; }
.form--el input { min-height: 0; padding: 10px; border: 1px solid #69727d; border-radius: 4px; background: #fff; color: #7a7a7a; font: 14px/24px "Roboto", sans-serif; letter-spacing: normal; }
.form--el textarea { min-height: 0; padding: 5px 14px; border: 1px solid #69727d; border-radius: 3px; background: #fff; color: #7a7a7a; font: 15px/21px "Roboto", sans-serif; letter-spacing: normal; resize: vertical; }
.form--el input::placeholder, .form--el textarea::placeholder { color: #7a7a7a; }
.form--el .btn.bt { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 40px; padding: 0 11px; border-radius: 2px; font-size: 15px; letter-spacing: normal; }
.form--el .form__status { width: 100%; padding: 0 5px; }

/* Espaçamento das colunas nas seções antigas */
.sec--gap-no > .sec__in > .col > .col__in { padding: 0; }
.sec--gap-narrow > .sec__in > .col > .col__in { padding: 5px; }
.sec--gap-extended > .sec__in > .col > .col__in { padding: 15px; }
.sec--gap-wide > .sec__in > .col > .col__in { padding: 20px; }
.sec--gap-wider > .sec__in > .col > .col__in { padding: 30px; }
.ib__title a { text-decoration: none; }

/* Alinhamento de imagens em texto (classes do editor antigo) */
.page-builder .align-right { float: right; display: block; margin: 0 0 0 15px; }
.page-builder .align-left { float: left; display: block; margin: 0 15px 0 0; }
.page-builder .align-center { display: block; margin-inline: auto; }
.w-text::after { content: ""; display: table; clear: both; }

/* Animações de entrada (equivalentes às do construtor antigo / animate.css). O main.js adiciona .is-in ao entrar na tela.
   Sem JavaScript (scripting: none) ou com movimento reduzido, o conteúdo aparece direto. */
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) {
    .anim:not(.is-in) { visibility: hidden; }
    .anim.is-in { animation-duration: 1.25s; animation-fill-mode: both; }
    .anim--slow.is-in { animation-duration: 2s; } .anim--fast.is-in { animation-duration: .75s; }
    .anim--fadeIn.is-in { animation-name: a-fadeIn; } .anim--fadeInUp.is-in { animation-name: a-fadeInUp; }
    .anim--fadeInDown.is-in { animation-name: a-fadeInDown; } .anim--fadeInLeft.is-in { animation-name: a-fadeInLeft; }
    .anim--fadeInRight.is-in { animation-name: a-fadeInRight; } .anim--zoomIn.is-in { animation-name: a-zoomIn; }
    .anim--slideInUp.is-in { animation-name: a-slideInUp; }
    @media (max-width: 1024px) and (min-width: 768px) { .anim--off-t:not(.is-in), .anim--off-t.is-in { visibility: visible; animation: none; } }
    @media (max-width: 767px) { .anim--off-m:not(.is-in), .anim--off-m.is-in { visibility: visible; animation: none; } }
}
@keyframes a-fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes a-fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0); } to { opacity: 1; transform: none; } }
@keyframes a-fadeInDown { from { opacity: 0; transform: translate3d(0, -100%, 0); } to { opacity: 1; transform: none; } }
@keyframes a-fadeInLeft { from { opacity: 0; transform: translate3d(-100%, 0, 0); } to { opacity: 1; transform: none; } }
@keyframes a-fadeInRight { from { opacity: 0; transform: translate3d(100%, 0, 0); } to { opacity: 1; transform: none; } }
@keyframes a-zoomIn { from { opacity: 0; transform: scale3d(.3, .3, .3); } 50% { opacity: 1; } }
@keyframes a-slideInUp { from { visibility: visible; transform: translate3d(0, 100%, 0); } to { transform: none; } }
