@charset "UTF-8";
/* =========================================================================
   Cobsen · convivência com o Elementor (v2.0.0)
   ---------------------------------------------------------------------
   A partir da v2.0.0 a Home é montada com Containers e widgets NATIVOS do
   Elementor, não mais com widgets de seção fechados. Este arquivo faz só
   duas coisas:
     1. Garante que o layout do Figma (grids, alturas, empilhamento do
        hero) vence o CSS que o próprio Elementor gera por elemento —
        por isso os !important nos blocos de LAYOUT abaixo. Sem eles, o
        editor visual continua funcionando, mas o layout de grade pode não
        bater exatamente com o Figma em instalações com versões diferentes
        do Elementor. O conteúdo continua 100% editável de qualquer forma:
        isso é só uma garantia de estilo, não trava a estrutura.
     2. "Traduz" a marcação que os widgets NATIVOS geram (heading, button,
        icon, icon-list, text-editor) para as classes visuais do tema, já
        que o Elementor embrulha cada widget em divs próprias.
   Nenhum estilo novo de marca mora aqui: as variáveis e valores vêm todos
   de cobsen.css, extraído do Figma.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. LAYOUT — grids e empilhamentos que precisam vencer o CSS por elemento
      que o próprio Elementor gera (especificidade por ID de elemento).
   ------------------------------------------------------------------------- */
.hero.cobsen-hero{display:flex!important;flex-direction:column!important;position:relative!important}
.reformas__grid{display:grid!important;grid-template-columns:repeat(3,1fr)!important}
.solucoes__grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:13px!important}
.clientes__logos{display:grid!important;grid-template-columns:repeat(6,1fr)!important}
.orcamento__grid{display:grid!important;grid-template-columns:minmax(0,1.06fr) auto auto!important}
.sobre__top{display:grid!important;grid-template-columns:minmax(0,1fr) 596px!important}
.numeros{display:grid!important;grid-template-columns:352px repeat(4,1fr)!important}
.difs{display:grid!important;grid-template-columns:1fr 1fr auto!important}
.contato__grid{display:grid!important;grid-template-columns:minmax(0,662px) minmax(0,805px)!important}
.unidades{display:grid!important;grid-template-columns:1fr 1fr!important}
@media(max-width:1200px){
  .solucoes__grid{grid-template-columns:repeat(2,1fr)!important}
}
@media(max-width:1100px){
  .orcamento__grid{grid-template-columns:1fr 1fr!important}
}
@media(max-width:1080px){
  .reformas__grid{grid-template-columns:1fr!important}
  .sobre__top{grid-template-columns:1fr!important}
  .difs{grid-template-columns:1fr!important}
  .contato__grid{grid-template-columns:1fr!important}
  .numeros{grid-template-columns:repeat(2,1fr)!important}
}
@media(max-width:900px){
  .clientes__logos{grid-template-columns:repeat(3,1fr)!important}
}
@media(max-width:640px){
  .orcamento__grid{grid-template-columns:1fr!important}
  .solucoes__grid{grid-template-columns:1fr!important}
}
@media(max-width:560px){
  .numeros{grid-template-columns:1fr!important}
  .unidades{grid-template-columns:1fr!important}
}

/* Cada Container do Elementor já é um <div> puro (sem wrapper extra), então
   as classes de card/coluna (.rcard, .scard, .dl, .num, .unidade...) caem
   direto nele e o cobsen.css já resolve o resto sem necessidade de regra
   adicional aqui. */

/* -------------------------------------------------------------------------
   2. HERO — slides como Containers empilhados (crossfade).
   ------------------------------------------------------------------------- */
.hero__slide{position:absolute;inset:0;z-index:1;opacity:0;visibility:hidden;
  transition:opacity .6s ease;display:flex!important;flex-direction:column!important;
  background-size:cover;background-position:center;justify-content:center}
.hero__slide.is-active{opacity:1;visibility:visible;z-index:2;position:relative}
.elementor-editor-active .hero__slide{position:relative;opacity:1;visibility:visible;margin-bottom:1px}

/* -------------------------------------------------------------------------
   3. BOTÃO NATIVO (widget Button) → visual do .btn do tema.
   O Elementor gera CSS próprio por elemento para o botão (fundo azul
   padrão, etc.); os !important abaixo garantem que o visual do Figma
   prevaleça independentemente da ordem de carregamento das folhas de
   estilo.
   ------------------------------------------------------------------------- */
.btn .elementor-button,
.btn.elementor-widget-button .elementor-button{
  display:inline-flex!important;align-items:center!important;gap:1rem!important;
  min-height:50px!important;padding:0 .45rem 0 1.2rem!important;
  border-radius:var(--r)!important;font-size:var(--fs-body)!important;font-weight:600!important;
  color:#fff!important;background:var(--navy)!important;border:0!important;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease!important;
}
.btn .elementor-button:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(0,4,52,.24)}
.btn .elementor-button-icon{
  display:grid!important;place-items:center!important;width:35px!important;height:35px!important;
  border-radius:50%!important;background:#fff!important;color:var(--navy)!important;margin:0!important;
}
.btn .elementor-button-icon svg,.btn .elementor-button-icon i{width:9px;height:14px;font-size:9px}
.btn .elementor-button-text{order:-1}
.btn--orange .elementor-button{background:var(--orange)!important;color:var(--navy)!important}
.btn--orange .elementor-button-icon{background:#fff!important;color:var(--orange)!important}
.btn--orange .elementor-button:hover{box-shadow:0 10px 26px rgba(242,160,3,.34)}
.hero__scroll .elementor-button,
.hero__play .elementor-button{
  display:inline-flex!important;align-items:center!important;gap:.6rem!important;
  background:transparent!important;padding:0!important;min-height:0!important;color:inherit!important;
}
.hero__scroll .elementor-button-icon,.hero__play .elementor-button-icon{display:none!important}
.hero__scroll{display:inline-flex;align-items:center;gap:.6rem;color:rgba(255,255,255,.75);
  font-size:var(--fs-xs);letter-spacing:.16em;text-transform:uppercase}
@media(max-width:760px){.hero__scroll{display:none}}
.dl__link .elementor-button{
  display:inline-block!important;background:transparent!important;color:var(--orange)!important;
  padding:0!important;min-height:0!important;text-decoration:underline;text-underline-offset:3px;
  font-size:var(--fs-sm)!important;margin-top:.65rem!important;
}
.dl__link .elementor-button-icon{display:none!important}

/* -------------------------------------------------------------------------
   4. ÍCONE NATIVO (widget Icon) → bolhas .rcard__ico / .dl__ico / .scard__arrow.
   ------------------------------------------------------------------------- */
.rcard__ico,.dl__ico,.scard__arrow{display:grid;place-items:center}
.rcard__ico{flex:none;width:clamp(54px,4.7vw,90px);height:clamp(54px,4.7vw,90px);
  border-radius:50%;background:rgba(255,255,255,.14);color:#fff}
.rcard__ico i,.rcard__ico svg{font-size:clamp(22px,2.2vw,42px);width:46%;height:46%}
.dl__ico{width:71px;height:71px;color:var(--orange)}
.dl__ico i,.dl__ico svg{font-size:44px;width:100%;height:auto}
.scard__arrow{flex:none;width:36px;height:36px;border-radius:50%;background:var(--grey-100);
  color:var(--navy);transition:.18s}
.scard:hover .scard__arrow{background:var(--orange);color:#fff}
.scard__arrow i,.scard__arrow svg{font-size:13px;width:13px;height:13px}

/* -------------------------------------------------------------------------
   5. LISTA COM ÍCONE NATIVA (widget Icon List) → visual de .difs.
   O seletor .difs ul li do cobsen.css já alcança a marcação do Elementor
   (<ul class="elementor-icon-list-items"><li class="elementor-icon-list-item">)
   por ser um seletor descendente; só o ícone precisa de ajuste de cor.
   ------------------------------------------------------------------------- */
.difs .elementor-icon-list-icon{color:var(--orange)}
.difs .elementor-icon-list-icon i{font-size:1.1em}
.difs .elementor-icon-list-item{padding:.42rem 0}

/* -------------------------------------------------------------------------
   6. LOGOS DE CLIENTES (widget Image dentro do grid) → visual do <li> original.
   ------------------------------------------------------------------------- */
.clientes__logos>.elementor-widget-image{display:grid;place-items:center;height:45px;
  filter:grayscale(1);opacity:.62;transition:.2s}
.clientes__logos>.elementor-widget-image:hover{filter:none;opacity:1}
.clientes__logos img{max-height:45px;width:auto;object-fit:contain;margin:0 auto}

/* -------------------------------------------------------------------------
   7. NORMALIZAÇÕES GERAIS — remover embrulhos do Elementor que limitariam
      a largura das seções de largura total do tema.
   ------------------------------------------------------------------------- */
.e-con.hero,.e-con.reformas,.e-con.solucoes,.e-con.clientes,
.e-con.orcamento,.e-con.sobre,.e-con.blog,.e-con.contato{
  max-width:100%;width:100%;
}
[class*="elementor-widget-heading"] .elementor-heading-title,
.eyebrow.elementor-widget-heading .elementor-heading-title{margin:0}
.eyebrow .elementor-heading-title{
  display:inline-flex;align-items:center;gap:.5rem;background:var(--navy);color:#fff;
  font-size:var(--fs-xs);font-weight:500;letter-spacing:.1em;text-transform:uppercase;
  padding:.44rem 1.1rem;border-radius:var(--r);
}
.eyebrow--light .elementor-heading-title{background:rgba(255,255,255,.14);backdrop-filter:blur(6px)}
.h2 .elementor-heading-title,.sechead__t.elementor-widget-heading .elementor-heading-title{
  font-size:var(--fs-h2);line-height:1.12;font-weight:600;color:var(--navy);letter-spacing:-.02em
}
.h2--sm .elementor-heading-title{font-size:var(--fs-h2s)}
.hero__title .elementor-heading-title{color:#fff}
.sobre__title .elementor-heading-title,.contato__h .elementor-heading-title{color:var(--navy)}
.lede .elementor-text-editor,.sechead__d .elementor-text-editor{
  color:var(--muted);font-size:var(--fs-body);line-height:1.55;max-width:60ch
}
.lede--light .elementor-text-editor{color:rgba(255,255,255,.86)}
.tipos .elementor-text-editor{display:block;margin-top:auto;padding-top:1.25rem;
  font-size:var(--fs-2xs);letter-spacing:.04em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.tipos b{color:var(--orange);font-weight:500}
.num__v{color:inherit}
.num .elementor-widget:first-child .elementor-text-editor{margin-top:0}

/* Dentro do editor, o hero precisa de altura mesmo sem viewport cheia. */
.elementor-editor-active .hero{min-height:640px}

/* Páginas internas do tema (sem alteração da v1.1.0). */
.cob-page{padding-block:clamp(2.5rem,5vw,90px)}
.cob-entry + .cob-entry{margin-top:clamp(2rem,4vw,3.5rem)}
.cob-entry__thumb{margin:1.75rem 0;border-radius:var(--r-sm);overflow:hidden}
.cob-entry__content{margin-top:1.5rem;max-width:72ch}
.cob-entry__content > * + *{margin-top:1.15rem}
.cob-entry__content h2{font-size:var(--fs-h2s);color:var(--navy);margin-top:2.25rem}
.cob-entry__content h3{font-size:var(--fs-h3);color:var(--navy);margin-top:1.75rem}
.cob-entry__content ul,.cob-entry__content ol{padding-left:1.25rem;list-style:disc}
.cob-entry__content ol{list-style:decimal}
.cob-entry__content a{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.cob-page__head{margin-bottom:2.5rem}
.navigation.pagination{margin-top:3rem;display:flex;justify-content:center}
.navigation.pagination .page-numbers{
  display:inline-grid;place-items:center;min-width:44px;height:44px;padding:0 .75rem;
  border-radius:var(--r);color:var(--navy);font-weight:500;
}
.navigation.pagination .page-numbers.current{background:var(--navy);color:#fff}