/*****************************************************************************************
 LEUK — Página “ENGENHARIA” (Elementor / WordPress)
 CSS (Boxed containers) — mantém LOOK atual e torna cores/dimensões configuráveis

 ─────────────────────────────────────────────────────────────────────────────────────────
 ✅ O QUE ESTA VERSÃO GARANTE
 ─────────────────────────────────────────────────────────────────────────────────────────
 1) HERO/VÍDEO como no início
    - Full-bleed (100vw + margens negativas)
    - Sem overlay forçado via CSS

 2) Acordeão simples
    - Linhas separadoras + hover discreto
    - Sem cards, sem efeitos extra

 3) FIX definitivo do “saltinho” / página a subir pixel a pixel
    - Scroll Anchoring desligado APENAS na área do Processo:
        overflow-anchor: none;
    - Linhas desenhadas via box-shadow inset (não alteram layout)
    - border:0 forçado em todos os estados relevantes

 4) Títulos à ESQUERDA + ícone à DIREITA (estável)

 5) Controlo de paddings do conteúdo das abas:
    - role="region": --acc-content-pad-*
    - grelha:        --grid-pad-* e --grid-gap*
    - colunas:       --tab-text-pad / --tab-media-pad

******************************************************************************************/

/*=========================================================================================
 [A] PAINEL DE CONTROLO (VARIÁVEIS)
=========================================================================================*/
:root{
  /* CORES (defaults atuais) */
  --eng-accent:        #000000;
  --eng-line:          #e0e0e0;
  --eng-hover-bg:      #f9f9f9;
  --eng-dark-bg:       #111111;
  --eng-text-light:    #ffffff;
  --eng-text-muted:    #cccccc;

  /* HERO (defaults atuais) */
  --hero-height:       70vh;
  --hero-height-md:    50vh;
  --hero-title-shadow: 0 5px 15px rgba(0,0,0,0.5);

  /* LARGURAS (defaults atuais) */
  --intro-max-width:   1200px;
  --process-max-width: 1200px;
  --cert-max-width:    1200px;
  --boxed-pad-x:       0px;

  /* ESPAÇAMENTOS (defaults atuais) */
  --intro-pad-top:     80px;
  --intro-pad-bot:     60px;
  --process-pad-bot:   100px;

  /* Accordion title (summary) */
  --acc-title-pad-y:   25px;
  --acc-title-pad-x:   0px;
  --acc-title-gap:     30px;
  --acc-icon-slot-w:   28px;

  /* Conteúdo aberto (region) */
  --acc-content-pad-top:    0px;
  --acc-content-pad-bot:   40px;
  --acc-content-pad-left:  0px;
  --acc-content-pad-right: 0px;

  /* Grid interno (texto + imagem) */
  --grid-pad-top:      30px;
  --grid-pad-bot:      50px;
  --grid-pad-x:        0px;
  --grid-gap:          50px;
  --grid-gap-md:       30px;
  --img-max-width:     450px;

  /* Padding por coluna (opcional) */
  --tab-text-pad:      0px;
  --tab-media-pad:     0px;

  /* Certificações */
  --cert-pad-y:        100px;
  --cert-margin-top:   80px;

  /* Breakpoint principal */
  --bp-md: 1024px;
}


/*=========================================================================================
 [B] HERO — como no início (full-bleed, sem overlay forçado)
=========================================================================================*/
.leuk-tech-hero{
  width: 100vw !important;
  margin-left: calc(-50vw + 50%) !important;
  margin-right: calc(-50vw + 50%) !important;

  min-height: var(--hero-height) !important;
  position: relative !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  background-size: cover !important;
  background-position: center !important;
}

.leuk-tech-hero .elementor-heading-title{
  color: #ffffff !important;
  text-shadow: var(--hero-title-shadow);
  z-index: 2;
}


/*=========================================================================================
 [C] INTRO — BOXED: largura no .e-con-inner
=========================================================================================*/
.leuk-tech-intro{
  padding-top: var(--intro-pad-top) !important;
  padding-bottom: var(--intro-pad-bot) !important;
}

.leuk-tech-intro .e-con-inner{
  width: 100% !important;
  max-width: var(--intro-max-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--boxed-pad-x) !important;
  padding-right: var(--boxed-pad-x) !important;
}


/*=========================================================================================
 [D] PROCESSO — BOXED: largura no .e-con-inner + FIX “saltinho”
=========================================================================================*/
.leuk-tech-process{
  padding-bottom: var(--process-pad-bot) !important;
}

.leuk-tech-process .e-con-inner{
  width: 100% !important;
  max-width: var(--process-max-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--boxed-pad-x) !important;
  padding-right: var(--boxed-pad-x) !important;
}

/* ──────────────────────────────────────────────────────────────────────────────
   FIX PRINCIPAL: desligar Scroll Anchoring na zona do acordeão
   (resolve o “pixel drift” / a página a subir aos poucos)
────────────────────────────────────────────────────────────────────────────── */
.leuk-tech-process,
.leuk-tech-process .e-n-accordion,
.leuk-tech-process .e-n-accordion-item,
.leuk-tech-process .e-n-accordion-item > div[role="region"]{
  overflow-anchor: none !important;
}

/* Reset do widget */
.leuk-tech-process .e-n-accordion{
  --n-accordion-border-width: 0px !important;
  gap: 0 !important;
}

/* Item (<details>) sem bordas (evita saltos) */
.leuk-tech-process .e-n-accordion-item{
  border: none !important;
  background: transparent !important;
  transition: none !important;
}

/* Remove marker nativo do <summary> */
.leuk-tech-process summary.e-n-accordion-item-title{
  list-style: none;
}
.leuk-tech-process summary.e-n-accordion-item-title::-webkit-details-marker{
  display: none;
}
/* FIX extra: desliga scroll anchoring em TODOS os elementos do Processo */
.leuk-tech-process,
.leuk-tech-process *{
  overflow-anchor: none !important;
}
/*────────────────────────────────────────────────────────────────────────────────────────
  TÍTULO (summary) — linhas via box-shadow (não alteram layout)
────────────────────────────────────────────────────────────────────────────────────────*/
.leuk-tech-process .e-n-accordion-item-title{
  padding: var(--acc-title-pad-y) var(--acc-title-pad-x) !important;
  background: transparent !important;
  cursor: pointer;

  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;

  /* CRÍTICO: impedir borders dinâmicas do Elementor */
  border: 0 !important;
  box-sizing: border-box !important;

  /* Linha superior (sem mexer em altura) */
  box-shadow: inset 0 1px 0 var(--eng-line);
}

/* Último item: acrescenta linha inferior */
.leuk-tech-process .e-n-accordion-item:last-child > .e-n-accordion-item-title{
  border: 0 !important;
  box-shadow:
    inset 0 1px 0 var(--eng-line),
    inset 0 -1px 0 var(--eng-line);
}

/* Hover simples (não altera layout) */
.leuk-tech-process .e-n-accordion-item-title:hover{
  background: var(--eng-hover-bg) !important;
}

/* Segurança extra: garantir border 0 em estados open/focus/active */
.leuk-tech-process .e-n-accordion-item[open] > .e-n-accordion-item-title,
.leuk-tech-process .e-n-accordion-item-title:focus,
.leuk-tech-process .e-n-accordion-item-title:active{
  border: 0 !important;
}

/* Header (número + título) à esquerda */
.leuk-tech-process .e-n-accordion-item-title-header{
  flex: 1 1 auto !important;
  min-width: 0 !important;
  text-align: left !important;
}

/* “01” + “Título” com gap configurável */
.leuk-tech-process .e-n-accordion-item-title-text{
  display: flex !important;
  align-items: baseline !important;
  gap: var(--acc-title-gap) !important;
  width: 100% !important;
  text-align: left !important;
  line-height: 1.25 !important;
}

/* Ícone à direita, estável */
.leuk-tech-process .e-n-accordion-item-title-icon{
  margin-left: auto !important;
  width: var(--acc-icon-slot-w) !important;
  min-width: var(--acc-icon-slot-w) !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  line-height: 1 !important;
}

.leuk-tech-process .e-n-accordion-item-title-icon i{
  display: inline-block;
  width: 1.25em;
  text-align: center;
  line-height: 1 !important;
}

/* Conteúdo aberto (region) */
.leuk-tech-process .e-n-accordion-item > div[role="region"]{
  padding-top: var(--acc-content-pad-top) !important;
  padding-bottom: var(--acc-content-pad-bot) !important;
  padding-left: var(--acc-content-pad-left) !important;
  padding-right: var(--acc-content-pad-right) !important;
  border: none !important;
}


/*=========================================================================================
 [E] GRID INTERNO (texto + imagem) — com controlo de paddings
=========================================================================================*/
.leuk-tech-content-grid{
  padding: var(--grid-pad-top) var(--grid-pad-x) var(--grid-pad-bot) var(--grid-pad-x) !important;

  display: flex !important;
  flex-direction: row !important;
  gap: var(--grid-gap) !important;

  align-items: flex-start !important;
  width: 100%;
}

.leuk-tech-content-grid .elementor-widget-text-editor{
  flex: 1;
  padding: var(--tab-text-pad) !important;
}

.leuk-tech-content-grid .elementor-widget-image{
  flex: 1;
  max-width: var(--img-max-width) !important;
  padding: var(--tab-media-pad) !important;
}

.leuk-tech-content-grid img{
  height: auto;
  display: block;
}


/*=========================================================================================
 [F] CERTIFICAÇÕES — mantido como estava + BOXED inner control
=========================================================================================*/
.leuk-tech-cert{
  padding: var(--cert-pad-y) 0 !important;
  background-color: var(--eng-dark-bg) !important;
  color: var(--eng-text-light) !important;
  margin-top: var(--cert-margin-top) !important;
}

.leuk-tech-cert .e-con-inner{
  width: 100% !important;
  max-width: var(--cert-max-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--boxed-pad-x) !important;
  padding-right: var(--boxed-pad-x) !important;
}

.leuk-tech-cert h1,
.leuk-tech-cert h2,
.leuk-tech-cert h3,
.leuk-tech-cert .elementor-heading-title{
  color: #ffffff !important;
}

.leuk-tech-cert p,
.leuk-tech-cert .elementor-widget-text-editor{
  color: var(--eng-text-muted) !important;
}


/*=========================================================================================
 [G] RESPONSIVIDADE (<= 1024px) — mantida como estava
=========================================================================================*/
@media (max-width: 1024px){
  .leuk-tech-hero{
    min-height: var(--hero-height-md) !important;
  }

  .leuk-tech-content-grid{
    flex-direction: column !important;
    gap: var(--grid-gap-md) !important;
  }

  .leuk-tech-content-grid .elementor-widget-image{
    width: 100% !important;
    max-width: 100% !important;
    order: -1;
  }
}


/*****************************************************************************************
 ATALHOS ÚTEIS
 ─────────────────────────────────────────────────────────────────────────────────────────
 - Processo com a mesma largura do Intro:
     --process-max-width: var(--intro-max-width);

 - Padding lateral dentro das abas:
     --grid-pad-x: 12px;

 - Padding só no texto:
     --tab-text-pad: 8px 0 0 0;

******************************************************************************************/