/* Identidade EGO por cima do tema criativatek-shop-1: cabeçalho, homepage, rodapé, listagens e ficha de produto
   (layouts/ego/*, layouts/partials/product, pages/main, pages/products/*).
   Medidas tiradas do egopowerplus.pt a 1440px. Cores: verde #77bc1f, cinzento-escuro #282828. */

@font-face {
    font-family: "League Gothic";
    src: url("/ego/fonts/league-gothic.woff2") format("woff2");
    font-display: swap;
}
/* Texto: Barlow (OFL, subconjunto latin, que cobre o português e o €). O site original usa Arial. */
@font-face { font-family: "Barlow"; src: url("/ego/fonts/barlow-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/ego/fonts/barlow-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/ego/fonts/barlow-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/ego/fonts/barlow-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/ego/fonts/barlow-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }

:root {
    /* largura do site (cabeçalho, secções, listagens, ficha, rodapé): mais larga só em monitores grandes, o portátil fica igual */
    --ego-largura: 1320px;
    --ego-verde: #77bc1f;
    --ego-escuro: #282828;
    --ego-titulos: "League Gothic", "Oswald", "Arial Narrow", sans-serif;
    --ego-texto: "Barlow", Arial, Helvetica, sans-serif;
}
@media (min-width: 1800px) { :root { --ego-largura: 1640px; } } /* 4 cartões por linha com a largura dos do portátil (~299px) */

/* o tema dá ao body Poppins 300 e põe a Poppins outra vez em a e p */
body { font-family: var(--ego-texto); font-weight: 400; color: #333; }
a, p, li { font-family: var(--ego-texto); }
.ego-verde { color: var(--ego-verde); }
/* O polish.js do tema mete categorias em "chips" por cima da homepage em mobile; o site da EGO não tem isso */
.ck-cats { display: none !important; }

/* Títulos do resto do site (categorias, produto) na tipografia da marca */
.page-header h1, .page-title, .product-title, h1.product-title {
    font-family: var(--ego-titulos);
    font-weight: 400;
    letter-spacing: .01em;
    text-transform: uppercase;
}

/* ---------- Cabeçalho ---------- */
.ego-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: #000;
}
.ego-header__barra {
    display: flex;
    align-items: center;
    gap: 32px;
    max-width: var(--ego-largura);
    min-height: 96px;
    margin: 0 auto;
    padding: 0 20px;
}
/* o SVG do logótipo tem ~7px de folga à esquerda: assim o desenho alinha com o texto das secções */
.ego-header__logo { margin-left: -7px; }
.ego-header__logo img { display: block; height: 64px; width: auto; }
.ego-header__menu-mobile { display: none; background: none; border: 0; color: #fff; font-size: 26px; padding: 0; }

.ego-nav { flex: 1; }
.ego-nav__lista { display: flex; justify-content: center; gap: 30px; margin: 0; padding: 0; list-style: none; }
.ego-nav__item { position: relative; }
.ego-nav__item > a {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 34px 0;
    color: #fff;
    font-family: var(--ego-titulos);
    font-size: 21px;
    letter-spacing: .03em;
    text-transform: uppercase;
    text-decoration: none;
}
.ego-nav__item--sub > a::after {
    content: "";
    width: 7px;
    height: 7px;
    margin-top: -4px;
    border-right: 1.5px solid #8a8a8a;
    border-bottom: 1.5px solid #8a8a8a;
    transform: rotate(45deg);
}
.ego-nav__item > a:hover, .ego-nav__item > a:focus-visible { color: var(--ego-verde); }
.ego-nav__sub {
    position: absolute;
    top: 100%;
    left: -18px;
    min-width: 240px;
    margin: 0;
    padding: 12px 0;
    list-style: none;
    background: #111;
    border-top: 3px solid var(--ego-verde);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity .15s, transform .15s, visibility .15s;
}
.ego-nav__item:hover > .ego-nav__sub, .ego-nav__item:focus-within > .ego-nav__sub { opacity: 1; visibility: visible; transform: none; }
.ego-nav__sub a { display: block; padding: 8px 18px; color: #eee; font-size: 14px; text-decoration: none; }
.ego-nav__sub a:hover { color: var(--ego-verde); background: #1b1b1b; }

/* Painel de Produtos: as subcategorias em fotos, a toda a largura por baixo do cabeçalho (o item fica static para
   o painel se medir pelo .ego-header, que é sticky). Fica display: none até abrir: assim as fotos, com
   loading="lazy", só se pedem quando alguém abre o menu. */
.ego-nav__item--painel { position: static; }
.ego-painel { position: absolute; top: 100%; right: 0; left: 0; display: none; background: #fff; border-top: 3px solid var(--ego-verde); box-shadow: 0 22px 40px rgba(0, 0, 0, .22); }
.ego-nav__item--painel:hover > .ego-painel, .ego-nav__item--painel:focus-within > .ego-painel { display: block; animation: ego-painel .18s ease-out; }
@keyframes ego-painel { from { opacity: 0; transform: translateY(8px); } }
.ego-painel__conteudo { display: flex; flex-direction: column; max-width: var(--ego-largura); margin: 0 auto; padding: 24px 20px 20px; }
/* "Ver tudo em …" no canto inferior direito, como botão */
.ego-painel__todos { align-self: flex-end; gap: 10px; min-height: 42px; margin-top: 10px; font-size: 18px; }
/* Os três painéis (Produtos, Acessórios, Gamas) com a altura do de Produtos: quadrados da largura dos de 9 colunas e
   linhas de altura fixa (foto + 2 linhas de nome); um nome de 3 linhas encolhe a foto em vez de esticar a linha.
   As gamas, numa linha só, ocupam as duas. */
.ego-painel__conteudo { container-type: inline-size; }
.ego-painel .ego-mosaico { --quadrado: min(150px, (100cqi - 48px) / 9); grid-template-columns: repeat(var(--colunas), var(--quadrado)); grid-auto-rows: calc(var(--quadrado) + 49px); }
.ego-painel .ego-mosaico__imagem { flex: 1; min-height: 0; }
.ego-painel .ego-mosaico__imagem img { height: 100%; aspect-ratio: auto; }
.ego-painel .ego-mosaico__nome { flex: none; min-height: 2.5em; }
.ego-painel .ego-mosaico:has(.ego-mosaico__item--logo) { grid-template-columns: repeat(var(--colunas), minmax(0, 400px)); }
.ego-painel .ego-mosaico:has(.ego-mosaico__item--logo) > li { grid-row: span 2; }
.ego-painel .ego-mosaico__item--logo { justify-content: center; gap: 14px; padding: 24px 28px; }
.ego-painel .ego-mosaico__item--logo .ego-mosaico__imagem { flex: none; width: min(100%, 280px); }
.ego-painel .ego-mosaico__item--logo .ego-mosaico__imagem img { height: auto; }
.ego-painel .ego-mosaico__item--logo .ego-mosaico__nome { flex: none; min-height: 0; margin-top: 6px; font-family: var(--ego-titulos); font-size: 30px; font-weight: 400; line-height: 1; text-transform: uppercase; }
.ego-mosaico__texto { display: none; }
/* 3 linhas de texto reservadas em todas: os logótipos ficam alinhados mesmo quando uma descrição parte em mais linhas */
.ego-painel .ego-mosaico__texto { display: block; min-height: 4.5em; color: #555; font-size: 14px; line-height: 1.5; }

/* Mosaico das subcategorias (layouts/ego/mosaico): painel do menu e topo de Produtos, Acessórios e Gamas.
   Cartões até 134px ao centro; o número de colunas (--colunas) vem da view. */
.ego-mosaico { display: grid; grid-template-columns: repeat(var(--colunas, 9), minmax(0, 150px)); justify-content: center; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ego-mosaico__item { background: #f2f2f269; display: flex; flex-direction: column; align-items: center; gap: 8px; height: 100%; padding: 10px 8px 12px; border-radius: 4px; color: #1d1d1d; text-align: center; text-decoration: none; transition: background .15s; }
.ego-mosaico__item:focus-visible { background: #f2f2f2; color: #1d1d1d; }
.ego-mosaico__imagem { display: block; width: 100%; }
/* multiply: o fundo branco das fotos (JPG) some no cinzento do hover */
.ego-mosaico__imagem img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; mix-blend-mode: multiply; transition: transform .25s; }
/* gamas: o logótipo (SVG com fundo próprio) em vez da foto, em quadrados mais largos e mais baixos — o painel não cresce */
.ego-mosaico:has(.ego-mosaico__item--logo) { grid-template-columns: repeat(var(--colunas), minmax(0, 260px)); }
.ego-mosaico__item--logo .ego-mosaico__imagem img { aspect-ratio: 2; mix-blend-mode: normal; }
/* o nome ocupa o espaço que sobra por baixo da foto e fica ao meio: os de 1 linha alinham pelo meio dos de 2 */
.ego-mosaico__nome { display: flex; flex: 1; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; line-height: 1.25; }
/* passar o rato só com rato e ecrã de computador: no telemóvel o quadrado tocado ficava diferente dos outros */
@media (hover: hover) and (min-width: 992px) {
    .ego-mosaico__item:hover { background: #f2f2f2; color: #1d1d1d; }
    .ego-mosaico__item:hover .ego-mosaico__imagem img { transform: scale(1.07); }
    .ego-mosaico__item:hover .ego-mosaico__nome { color: #3f7409; }
    .ego-mosaico__mais button:hover .ego-mosaico__circulo { border-color: var(--ego-verde); background: var(--ego-verde); color: #fff; transform: scale(1.07); }
}
/* "Ver mais" (homepage e topo das listagens): só a 1.ª linha até se clicar; o JS está no mosaico.blade */
.ego-mosaico--recolhido .ego-mosaico__extra, .ego-mosaico__mais { display: none; }
.ego-mosaico--recolhido .ego-mosaico__mais { display: list-item; }
.ego-mosaico__mais button { width: 100%; border: 0; background: none; font: inherit; cursor: pointer; }
.ego-mosaico__mais .ego-mosaico__imagem { display: grid; place-items: center; aspect-ratio: 1; }
.ego-mosaico__circulo { display: grid; place-items: center; width: 50%; aspect-ratio: 1; border: 1.5px solid #1d1d1d; border-radius: 50%; color: #1d1d1d; transition: background .2s, border-color .2s, color .2s, transform .25s; }
.ego-mosaico__circulo svg { width: 36%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.ego-mosaico__mais button:focus-visible .ego-mosaico__circulo { border-color: var(--ego-verde); background: var(--ego-verde); color: #fff; transform: scale(1.07); }

.ego-header__icones { display: flex; align-items: center; gap: 22px; color: #fff; font-size: 21px; }
.ego-header__icones a, .ego-header__icones i { color: #fff; }
.ego-header__icones a:hover i { color: var(--ego-verde); }
/* Carrinho, favoritos e conta com o nome por baixo (a pesquisa fica só com o ícone, alinhado com os outros) */
.ego-header__icones { align-items: flex-start; }
.ego-header__carrinho > a, .ego-header__icones .ego-header__favoritos, .ego-header__icones .ego-header__conta { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 0; text-decoration: none; }
.ego-header__rotulo { color: #fff; font-family: var(--ego-texto); font-size: 11.5px; font-weight: 500; letter-spacing: .02em; line-height: 1; white-space: nowrap; transition: color .15s; }
.ego-header__icones a:hover .ego-header__rotulo { color: var(--ego-verde); }
.ego-header__icones .ego-pesquisa__abrir { font-size: 26px; }
/* a mesma caixa para os quatro ícones: assim ficam na mesma linha e os nomes também */
.ego-header__icones .ego-pesquisa__abrir, .ego-header__carrinho .icon, .ego-header__favoritos .ego-header__icone, .ego-header__conta > i { display: flex; align-items: center; justify-content: center; height: 28px; line-height: 1; }
/* Pesquisa: faixa a toda a largura por baixo do cabeçalho, como o painel do menu */
.ego-pesquisa__abrir { display: block; padding: 0; border: 0; background: none; color: #fff; font-size: 30px; line-height: 1; cursor: pointer; }
.ego-pesquisa__abrir:hover, .ego-pesquisa__abrir[aria-expanded="true"] { color: var(--ego-verde); }
/* .ego-header__icones i põe os ícones a branco */
.ego-header__icones .ego-pesquisa__abrir i { color: inherit; }
.ego-header__icones .ego-pesquisa__lupa { color: #8a8a8a; font-size: 22px; }
.ego-pesquisa__painel { position: absolute; top: 100%; right: 0; left: 0; background: #fff; border-top: 3px solid var(--ego-verde); box-shadow: 0 22px 40px rgba(0, 0, 0, .22); animation: ego-painel .18s ease-out; }
.ego-pesquisa__conteudo { display: flex; align-items: center; gap: 14px; max-width: 1100px; margin: 0 auto; padding: 22px 20px; }
.ego-pesquisa__conteudo input[type=search] { flex: 1; min-width: 0; height: 52px; padding: 0 4px; border: 0; border-bottom: 2px solid #ddd; border-radius: 0; background: none; color: #1d1d1d; font: 400 20px var(--ego-texto); outline: 0; box-shadow: none; }
.ego-pesquisa__conteudo input[type=search]:focus { border-bottom-color: var(--ego-verde); }
.ego-pesquisa__conteudo input[type=search]::placeholder { color: #9a9a9a; }
/* o × do browser ficava ao lado do × de fechar */
.ego-pesquisa__conteudo input[type=search]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.ego-pesquisa__ir { min-height: 46px; padding: 0 28px; font-size: 18px; }
.ego-pesquisa__fechar { flex: 0 0 auto; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 50%; background: none; color: #555; font-size: 30px; line-height: 1; cursor: pointer; }
.ego-pesquisa__fechar:hover, .ego-pesquisa__fechar:focus-visible { background: #f2f2f2; color: #1d1d1d; }
/* Sugestões (layouts/ego/sugestoes). O painel está dentro de .ego-header__icones, que põe cor branca e 21px em tudo:
   daí o .ego-pesquisa__painel à frente. */
.ego-pesquisa__resultados { max-width: 1100px; margin: 0 auto; padding: 2px 20px 24px; color: #333; font-size: 15px; }
.ego-pesquisa__resultados:empty { display: none; }
.ego-sugestoes__topo { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.ego-sugestoes__titulo { margin: 0; color: #1d1d1d; font-family: var(--ego-titulos); font-size: 22px; font-weight: 400; letter-spacing: .02em; line-height: 1.1; text-transform: uppercase; }
.ego-sugestoes__titulo span { color: #8a8a8a; }
.ego-pesquisa__painel .ego-sugestoes__todos { flex: 0 0 auto; color: #3f7409; font-size: 14px; font-weight: 600; text-decoration: none; }
.ego-pesquisa__painel .ego-sugestoes__todos:hover { color: #1d1d1d; }
.ego-sugestoes__lista { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.ego-pesquisa__painel .ego-sugestao { display: flex; flex-direction: column; height: 100%; padding: 10px 10px 12px; border: 1px solid #e6e6e6; color: #1d1d1d; text-decoration: none; transition: border-color .15s, box-shadow .15s; }
.ego-pesquisa__painel .ego-sugestao:hover, .ego-pesquisa__painel .ego-sugestao:focus-visible { border-color: var(--ego-verde); box-shadow: 0 8px 20px rgba(0, 0, 0, .08); color: #1d1d1d; }
.ego-sugestao__imagem img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; }
.ego-sugestao__categoria { margin-top: 8px; color: #8a8a8a; font-size: 10px; font-weight: 600; letter-spacing: .08em; line-height: 1.3; text-transform: uppercase; }
.ego-sugestao__nome { margin-top: 3px; font-size: 13px; font-weight: 600; line-height: 1.3; }
.ego-sugestao__nome mark { padding: 0; background: none; color: #3f7409; }
.ego-sugestao__preco { margin-top: auto; padding-top: 8px; font-family: var(--ego-titulos); font-size: 20px; letter-spacing: .02em; line-height: 1; }
.ego-header__carrinho .icon { position: relative; }
.ego-header__favoritos .ego-header__icone { position: relative; }
.ego-header__carrinho .cart-count:not(:empty), .ego-header__numero {
    position: absolute;
    top: -8px;
    right: -11px;
    min-width: 17px;
    height: 17px;
    border-radius: 9px;
    background: var(--ego-verde);
    color: #fff;
    font-size: 10px;
    line-height: 17px;
    text-align: center;
}

/* ---------- Menu do telemóvel (layouts/ego/menu-movel) ---------- */
/* Ecrã inteiro e por cima do cabeçalho (sticky, z-index 1000). O tema abria 280px e empurrava a página 200px. */
.mobile-menu-container.ego-menu { left: 0; z-index: 1200; display: flex; flex-direction: column; width: 100%; max-width: none; height: 100dvh; padding: 0; overflow-y: auto; overscroll-behavior: contain; background: #0d0d0d; box-shadow: none; transform: translateX(-100%); }
.mmenu-active .mobile-menu-container.ego-menu { transform: none; }
.mmenu-active .page-wrapper { transform: none; }
body.mmenu-active { overflow: hidden; }
.ego-menu ~ .mobile-menu-overlay, .mobile-menu-overlay { display: none; }
.ego-menu__topo { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; min-height: 68px; padding: 0 16px; border-bottom: 1px solid rgba(255, 255, 255, .08); background: #000; }
.ego-menu__logo img { display: block; width: auto; height: 46px; }
.ego-menu .ego-menu__fechar { position: static; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .1); color: #fff; }
.ego-menu__fechar svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.ego-menu__nav { flex: 1; padding: 6px 16px 24px; }
.ego-menu__nav > ul { margin: 0; padding: 0; list-style: none; }
.ego-menu__nav > ul > li { border-bottom: 1px solid rgba(255, 255, 255, .08); }
.ego-menu__link, .ego-menu__grupo > summary { display: flex; align-items: center; justify-content: space-between; padding: 18px 4px; color: #fff; font-family: var(--ego-titulos); font-size: 30px; letter-spacing: .02em; line-height: 1; text-decoration: none; text-transform: uppercase; list-style: none; cursor: pointer; }
.ego-menu__link:hover, .ego-menu__link:focus-visible { color: var(--ego-verde); }
.ego-menu__grupo > summary::-webkit-details-marker { display: none; }
.ego-menu__grupo > summary::after { content: ""; width: 10px; height: 10px; margin: -6px 6px 0 0; border-right: 2px solid var(--ego-verde); border-bottom: 2px solid var(--ego-verde); transform: rotate(45deg); transition: transform .2s; }
.ego-menu__grupo[open] > summary { color: var(--ego-verde); }
.ego-menu__grupo[open] > summary::after { margin-top: 4px; transform: rotate(-135deg); }
/* o mosaico em 3 colunas, com as fotos em cartões brancos (o multiply escurecia-as sobre o preto) */
.ego-menu .ego-mosaico { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding-bottom: 4px; }
/* Quadrados do menu do telemóvel: cartão escuro com borda fina, a foto num painel claro em degradé (o fundo branco das
   fotos some nele pelo multiply) e o nome em League Gothic, como os itens do menu. Ao tocar, a borda fica verde. */
.ego-menu .ego-mosaico__item { gap: 9px; padding: 5px 5px 11px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 8px; background: linear-gradient(180deg, #1e1e1e 0%, #141414 100%); color: #f4f4f4; transition: border-color .15s; }
.ego-menu .ego-mosaico__item:active, .ego-menu .ego-mosaico__item:focus-visible { border-color: var(--ego-verde); }
.ego-menu .ego-mosaico__imagem { padding: 8px; border-radius: 5px; background: radial-gradient(circle at 50% 38%, #ffffff 0%, #eceeea 100%); }
/* o logótipo das gamas já traz a sua caixa escura: sem o painel claro, a toda a largura do cartão */
.ego-menu .ego-mosaico__item--logo .ego-mosaico__imagem { padding: 0; background: none; }
.ego-menu .ego-mosaico__nome { padding: 0 2px; font-family: var(--ego-titulos); font-size: 16px; font-weight: 400; letter-spacing: .03em; line-height: 1.05; text-transform: uppercase; }
.ego-menu .ego-mosaico__item:focus-visible .ego-mosaico__nome { color: var(--ego-verde); }
.ego-menu__todos { display: inline-block; margin: 10px 0 18px; color: var(--ego-verde); font-size: 15px; font-weight: 600; text-decoration: none; }
.ego-menu__rodape { display: grid; gap: 2px; padding: 18px 16px calc(24px + env(safe-area-inset-bottom)); background: #000; }
.ego-menu__acao { display: flex; align-items: center; gap: 12px; padding: 10px 4px; color: #fff; font-size: 16px; font-weight: 500; text-decoration: none; }
.ego-menu__acao:hover { color: var(--ego-verde); }
.ego-menu__acao svg { flex: 0 0 auto; width: 22px; height: 22px; fill: none; stroke: var(--ego-verde); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ego-menu .ego-rodape__redes { margin-top: 10px; }
/* Barra de baixo do polish.js (Início, Pesquisar, Carrinho, Conta): repetia a pesquisa e o carrinho do cabeçalho, e a
   pesquisa dela não tem sugestões. A conta passou para o menu. Sem ela, a barra fixa de compra e o WhatsApp descem. */
.ck-tabbar { display: none !important; }
body.ck-has-tabbar { padding-bottom: 0 !important; }
.ck-has-tabbar .ck-sticky-cart { bottom: 0 !important; }
.ck-has-tabbar .ego-whatsapp { bottom: 22px !important; }

/* ---------- Homepage (pages/main) ---------- */
/* Entrar ao descer: só com JS (a classe ego-revelar vem do script no topo da main) e sem "reduzir movimento" */
.ego-revelar [data-revelar] { opacity: 0; transform: translateY(28px); transition: opacity .7s ease, transform .7s ease; }
.ego-revelar [data-revelar].ego-visivel { opacity: 1; transform: none; }
@keyframes ego-entrar { from { opacity: 0; transform: translateY(20px); } }
/* .ego-escalonar: os filhos entram um a um quando o [data-revelar] aparece. Animação e não transição, e só com
   fill backwards, para não prender o transform (o hover dos cartões continua a funcionar depois de entrarem). */
.ego-revelar [data-revelar]:not(.ego-visivel) .ego-escalonar > *, .ego-revelar .ego-escalonar[data-revelar]:not(.ego-visivel) > * { opacity: 0; }
.ego-revelar [data-revelar].ego-visivel .ego-escalonar > *, .ego-revelar .ego-escalonar[data-revelar].ego-visivel > * { animation: ego-entrar .6s ease-out backwards; }
.ego-escalonar > :nth-child(2) { animation-delay: .1s; }
.ego-escalonar > :nth-child(3) { animation-delay: .2s; }
.ego-escalonar > :nth-child(4) { animation-delay: .3s; }
.ego-escalonar > :nth-child(5) { animation-delay: .4s; }
/* Ligados ao scroll (scroll-driven animations; onde o browser não as tem, as imagens ficam paradas):
   .ego-sobre-zoom aproxima a imagem ao entrar; o fundo do topo da "Sobre a EGO" desce mais devagar que a página */
@media (prefers-reduced-motion: no-preference) {
    @supports (animation-timeline: view()) {
        .ego-sobre-zoom img { animation: ego-aproximar linear both; animation-timeline: view(); animation-range: entry 0% cover 55%; }
        .ego-sobre-topo__fundo { animation: ego-paralaxe linear both; animation-timeline: scroll(root); animation-range: 0 100vh; }
    }
}
@keyframes ego-aproximar { from { transform: scale(1.14); } to { transform: scale(1); } }
@keyframes ego-paralaxe { to { transform: translateY(22%) scale(1.05); } }

/* Botões grandes, de contorno (sobre o vídeo) e de WhatsApp. Com .ego-botao à frente porque o .ego-botao vem mais
   abaixo neste ficheiro e ganhava (padding, borda e fundo). */
.ego-botao.ego-botao--grande { min-height: 52px; padding: 0 32px; font-size: 21px; }
.ego-botao.ego-botao--contorno { border: 2px solid rgba(255, 255, 255, .75); background: transparent; }
.ego-botao.ego-botao--contorno:hover, .ego-botao.ego-botao--contorno:focus-visible { border-color: var(--ego-verde); background: var(--ego-verde); }
.ego-botao.ego-botao--whatsapp { background: #1f9d55; }
.ego-botao.ego-botao--whatsapp:hover, .ego-botao.ego-botao--whatsapp:focus-visible { background: #178045; }

/* Topo: vídeo quase a ecrã inteiro, escurecido à esquerda e em baixo para o texto */
.ego-hero { position: relative; height: clamp(520px, calc(100svh - 107px), 820px); overflow: hidden; background: #000; }
.ego-hero__media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: left center; }
/* o vídeo é mais largo que 16:9 e traz o logótipo EGO na margem direita: encostado à esquerda, o botão de ligar
   fica à direita do texto e o logótipo (repetido no cabeçalho) sai inteiro em vez de cortado a meio */
.ego-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0, 0, 0, .85) 0%, rgba(0, 0, 0, .55) 42%, rgba(0, 0, 0, 0) 75%), linear-gradient(0deg, rgba(0, 0, 0, .55) 0%, rgba(0, 0, 0, 0) 35%); }
.ego-hero__conteudo { position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; height: 100%; max-width: var(--ego-largura); margin: 0 auto; padding: 0 20px; }
.ego-hero__titulo { max-width: 760px; margin: 0; color: #fff; font-family: var(--ego-titulos); font-size: clamp(56px, 7.4vw, 112px); font-weight: 400; line-height: .92; text-transform: uppercase; animation: ego-entrar .8s ease-out both; }
/* no topo, a parte a verde vai para a linha seguinte ("Potência de gasolina. / Sem gasolina.") */
.ego-hero__titulo .ego-verde { display: block; }
.ego-hero__texto { max-width: 520px; margin: 22px 0 0; color: rgba(255, 255, 255, .86); font-size: 19px; line-height: 1.55; animation: ego-entrar .8s .15s ease-out both; }
.ego-hero__botoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; animation: ego-entrar .8s .3s ease-out both; }

/* Faixa de confiança (fixa, em pages/main) */
.ego-confianca { border-bottom: 1px solid #e6e6e6; background: #fff; }
.ego-confianca__lista { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: var(--ego-largura); margin: 0 auto; padding: 0 20px; list-style: none; }
.ego-confianca__item { display: flex; align-items: center; gap: 14px; height: 100%; padding: 20px; color: #1d1d1d; text-decoration: none; }
.ego-confianca__lista > li + li > .ego-confianca__item { border-left: 1px solid #ececec; }
.ego-confianca__item svg { flex: 0 0 auto; width: 40px; height: 40px; }
.ego-confianca__copia { display: none; }
@keyframes ego-deslizar { to { transform: translateX(-50%); } }
.ego-confianca__item strong { display: block; font-size: 16px; font-weight: 700; line-height: 1.25; }
.ego-confianca__item small { display: block; margin-top: 3px; color: #6f6f6f; font-size: 14px; line-height: 1.4; }
a.ego-confianca__item:hover strong { color: #3f7409; }

/* Secções com etiqueta, título e link ("Ver todos…") */
.ego-seccao { padding: 84px 0; background: #fff; }
.ego-seccao--cinza { background: #f4f4f4; }
.ego-seccao__dentro { max-width: var(--ego-largura); margin: 0 auto; padding: 0 20px; }
/* Página 404: pesquisa e as secções da loja */
.ego-erro .ego-seccao__dentro { max-width: 760px; text-align: center; }
.ego-erro__texto { margin: 16px auto 0; color: #555; font-size: 17px; line-height: 1.6; }
.ego-erro__pesquisa { display: flex; margin-top: 30px; }
.ego-erro__pesquisa input { flex: 1; min-width: 0; height: 52px; padding: 0 16px; border: 1px solid #d4d4d4; border-right: 0; border-radius: 0; font-size: 16px; }
.ego-erro__pesquisa input:focus { outline: 0; border-color: var(--ego-verde); }
.ego-erro__pesquisa .ego-botao { min-height: 52px; font-size: 20px; }
.ego-erro__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 28px; }
.ego-erro__links a { padding: 10px 18px; border: 1px solid #d4d4d4; color: #1d1d1d; font-family: var(--ego-titulos); font-size: 18px; letter-spacing: .03em; text-transform: uppercase; text-decoration: none; transition: border-color .15s, color .15s; }
.ego-erro__links a:focus-visible { border-color: var(--ego-verde); color: #3f7409; }
@media (hover: hover) and (min-width: 992px) { .ego-erro__links a:hover { border-color: var(--ego-verde); color: #3f7409; } }
.ego-seccao__cabeca { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 36px; }
.ego-seccao__cabeca--centro { justify-content: center; text-align: center; }
.ego-seccao__etiqueta { display: block; margin: 0 0 10px; color: #3f7409; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.ego-seccao__titulo { margin: 0; text-wrap: balance; color: #1d1d1d; font-family: var(--ego-titulos); font-size: clamp(42px, 4.4vw, 62px); font-weight: 400; line-height: .95; text-transform: uppercase; }
/* o verde da marca em letra grande sobre branco fica abaixo do contraste mínimo: um tom mais escuro */
.ego-seccao__titulo .ego-verde, .ego-final__ajuda .ego-verde { color: #5a9a12; }
.ego-seccao__link { flex: 0 0 auto; padding-bottom: 3px; border-bottom: 2px solid var(--ego-verde); color: #1d1d1d; font-size: 15px; font-weight: 600; text-decoration: none; }
.ego-seccao__link:hover { color: #3f7409; }
.ego-home .ego-subcategorias { margin-bottom: 0; }

/* Kits em destaque: o carrossel do tema com os cartões da loja */
.ego-carrossel-home .ego-cartao { width: 100%; height: 100%; }
.ego-carrossel-home .owl-stage { display: flex; }
.ego-carrossel-home .owl-item { display: flex; }

/* Uma bateria para todas as ferramentas, com os números (zona ego-numeros) */
.ego-bateria { overflow: hidden; background: radial-gradient(ellipse at 75% 50%, #5c5c5c 0%, #393939 42%, #1b1b1b 100%); color: #fff; }
.ego-bateria__grelha { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 60px; max-width: var(--ego-largura); margin: 0 auto; padding: 96px 20px; }
.ego-bateria .ego-seccao__etiqueta, .ego-tec .ego-seccao__etiqueta, .ego-final__catalogo .ego-seccao__etiqueta { color: var(--ego-verde); }
.ego-bateria__titulo { margin: 0; text-wrap: balance; color: #fff; font-family: var(--ego-titulos); font-size: clamp(46px, 5vw, 74px); font-weight: 400; line-height: .95; text-transform: uppercase; }
.ego-bateria__frase { max-width: 520px; margin-top: 20px; color: rgba(255, 255, 255, .82); font-size: 18px; line-height: 1.6; }
.ego-bateria__frase p { margin: 0 0 10px; color: inherit; }
.ego-numeros { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 520px; margin: 30px 0 36px; }
.ego-numeros > div { padding: 18px 20px 18px 0; border-top: 1px solid rgba(255, 255, 255, .15); }
.ego-numeros dt { color: var(--ego-verde); font-family: var(--ego-titulos); font-size: 58px; font-weight: 400; line-height: 1; }
.ego-numeros dd { margin: 6px 0 0; color: rgba(255, 255, 255, .75); font-size: 14px; }
/* Uma bateria para tudo: a bateria ao centro e as máquinas num anel à volta. O anel roda (60 s por volta) e cada
   máquina roda ao contrário para ficar direita; entram uma a uma quando a secção aparece (.ego-visivel). */
.ego-orbita { position: relative; justify-self: center; width: min(580px, 100%); aspect-ratio: 1; container-type: inline-size; }
.ego-orbita::before { content: ""; position: absolute; inset: 22%; border-radius: 50%; background: radial-gradient(circle, rgba(119, 188, 31, .45) 0%, rgba(119, 188, 31, 0) 70%); animation: ego-pulsar 3.2s ease-in-out infinite; }
@keyframes ego-pulsar { 50% { opacity: .55; transform: scale(.92); } }
.ego-orbita__bateria { position: absolute; top: 50%; left: 50%; z-index: 1; width: 46%; transform: translate(-50%, -50%); filter: drop-shadow(0 26px 34px rgba(0, 0, 0, .6)); }
.ego-orbita__anel { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; animation: ego-rodar 60s linear infinite; }
.ego-orbita__anel::before { content: ""; position: absolute; inset: 9%; border: 1px dashed rgba(255, 255, 255, .22); border-radius: 50%; }
.ego-orbita__anel > li { --tam: 19cqw; --angulo: calc(var(--i) * 360deg / var(--itens)); position: absolute; top: 50%; left: 50%; width: var(--tam); height: var(--tam); margin: calc(var(--tam) / -2) 0 0 calc(var(--tam) / -2); transform: rotate(var(--angulo)) translate(41cqw) rotate(calc(var(--angulo) * -1)); }
.ego-orbita__anel > li > a { display: block; width: 100%; height: 100%; color: #fff; text-decoration: none; animation: ego-rodar 60s linear infinite reverse; }
.ego-orbita__anel:hover, .ego-orbita__anel:hover > li > a { animation-play-state: paused; }
.ego-orbita__foto { display: block; width: 100%; height: 100%; padding: 14%; border-radius: 50%; background: #fff; box-shadow: 0 10px 26px rgba(0, 0, 0, .45); transition: transform .2s, box-shadow .2s; }
.ego-orbita__foto img { display: block; width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.ego-orbita__nome { position: absolute; top: 100%; left: 50%; width: 150%; margin-top: 6px; font-size: clamp(10px, 2.3cqw, 13px); font-weight: 600; line-height: 1.2; text-align: center; transform: translateX(-50%); }
.ego-orbita__anel > li > a:hover .ego-orbita__foto, .ego-orbita__anel > li > a:focus-visible .ego-orbita__foto { box-shadow: 0 0 0 3px var(--ego-verde), 0 10px 26px rgba(0, 0, 0, .45); transform: scale(1.08); }
.ego-orbita__anel > li > a:hover .ego-orbita__nome { color: var(--ego-verde); }
@keyframes ego-rodar { to { transform: rotate(360deg); } }
/* entrada: uma a uma, a sair do centro, quando a secção aparece */
.ego-revelar .ego-bateria:not(.ego-visivel) .ego-orbita__anel > li { opacity: 0; transform: rotate(var(--angulo)) translate(0) rotate(calc(var(--angulo) * -1)) scale(.4); }
.ego-orbita__anel > li { transition: transform .8s cubic-bezier(.2, .8, .2, 1), opacity .6s ease; transition-delay: calc(var(--i) * 90ms + .2s); }
@media (prefers-reduced-motion: reduce) {
    .ego-orbita::before, .ego-orbita__anel, .ego-orbita__anel > li > a { animation: none; }
}

/* Escolha a sua gama */
.ego-gamas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.ego-gama { display: flex; flex-direction: column; padding: 30px 28px 26px; border: 1px solid #e6e6e6; background: #fff; color: #1d1d1d; text-decoration: none; transition: border-color .2s, box-shadow .2s, transform .2s; }
.ego-gama:hover, .ego-gama:focus-visible { border-color: var(--ego-verde); box-shadow: 0 18px 36px rgba(0, 0, 0, .09); color: #1d1d1d; transform: translateY(-4px); }
.ego-gama__logo img { display: block; width: auto; height: 54px; }
.ego-gama__nome { margin-top: 24px; font-family: var(--ego-titulos); font-size: 36px; line-height: 1; text-transform: uppercase; }
.ego-gama__texto { margin-top: 10px; color: #555; font-size: 16px; line-height: 1.55; }
.ego-gama__rodape { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 24px; color: #8a8a8a; font-size: 14px; }
.ego-gama__ir { color: #3f7409; font-weight: 700; }

/* Tecnologia: título e três cartões com vídeo sobre o fundo de partículas */
.ego-tec { padding: 96px 0; background: #000 center / cover no-repeat; color: #fff; }
.ego-tec .ego-seccao__titulo { max-width: 900px; color: #fff; }
.ego-tec__cartoes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.ego-tec__cartao { overflow: hidden; border: 1px solid rgba(255, 255, 255, .14); background: rgba(12, 12, 12, .72); }
.ego-tec__media video, .ego-tec__media img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.ego-tec__corpo { padding: 22px 24px 26px; }
.ego-tec__corpo h3 { margin: 0 0 10px; color: #fff; font-family: var(--ego-titulos); font-size: 30px; font-weight: 400; line-height: 1; text-transform: uppercase; }
.ego-tec__corpo p { margin: 0; color: rgba(255, 255, 255, .76); font-size: 15px; line-height: 1.6; }

/* Catálogo e "Precisa de ajuda a escolher?" */
.ego-final { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; }
.ego-final__catalogo, .ego-final__ajuda { display: flex; flex-direction: column; align-items: flex-start; padding: 44px; }
.ego-final__catalogo { background: #1d1d1d; color: #fff; text-decoration: none; }
/* com .ego-final__catalogo à frente: o .ego-final__link (escuro) vem depois e deixava-o da cor do fundo */
.ego-final__catalogo .ego-final__link--claro { color: #fff; }
.ego-final__catalogo .ego-final__link--claro:hover, .ego-final__catalogo .ego-final__link--claro:focus-visible { color: var(--ego-verde); }
.ego-final__catalogo svg { width: 44px; height: 44px; margin-bottom: 18px; fill: var(--ego-verde); }
.ego-final__ajuda { background: #f4f4f4; }
.ego-final__titulo { display: block; margin: 0; color: #1d1d1d; font-family: var(--ego-titulos); font-size: clamp(36px, 3.4vw, 48px); font-weight: 400; line-height: 1; text-transform: uppercase; }
.ego-final__catalogo .ego-final__titulo { color: #fff; }
.ego-final__texto { display: block; margin: 12px 0 28px; color: #555; font-size: 16px; line-height: 1.55; }
.ego-final__catalogo .ego-final__texto { color: rgba(255, 255, 255, .75); }
.ego-final__botoes { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: auto; }
.ego-final__link { color: #1d1d1d; font-weight: 600; text-decoration: underline; text-decoration-color: var(--ego-verde); text-decoration-thickness: 2px; text-underline-offset: 5px; }
.ego-final__link:hover { color: #3f7409; }

/* ---------- Rodapé ---------- */
.ego-rodape { background: var(--ego-escuro); color: #fff; }
.ego-rodape__colunas {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width: var(--ego-largura);
    margin: 0 auto;
    padding: 36px 20px 30px;
}
.ego-rodape__titulo { margin: 0 0 10px; color: var(--ego-verde); font-family: var(--ego-titulos); font-size: 29px; font-weight: 400; }
.ego-rodape__lista { margin: 0; padding: 0; list-style: none; }
.ego-rodape__lista a { display: inline-block; padding: 3px 0; color: #fff; font-size: 15px; text-decoration: none; }
.ego-rodape__lista a:hover { color: var(--ego-verde); }
.ego-rodape__reclamacoes { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; color: #fff; font-size: 12px; font-weight: 700; line-height: 1.05; text-decoration: none; text-transform: uppercase; }
.ego-rodape__reclamacoes-circulo { width: 22px; height: 22px; border-radius: 50%; background: #fff; }
.ego-rodape__contacto img { display: block; width: 180px; height: auto; margin-bottom: 18px; }
.ego-rodape__contacto .ego-rodape__titulo { margin-bottom: 6px; }
.ego-rodape__telefone { color: #fff; font-size: 16px; text-decoration: none; }
.ego-rodape__contacto small { display: block; color: #ddd; font-size: 12px; }
.ego-rodape__fundo {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    max-width: var(--ego-largura);
    margin: 0 auto;
    padding: 16px 20px 22px;
    border-top: 1px solid rgba(255, 255, 255, .08);
    font-size: 12px;
}
.ego-rodape__fundo p { margin: 0; color: #aaa; }
.ego-rodape__fundo p a { color: #fff; font-weight: 600; text-decoration: none; }
.ego-rodape__fundo p a:hover { color: var(--ego-verde); }
.ego-rodape__feder img { display: block; width: 360px; max-width: 100%; height: auto; }
.ego-rodape__redes { display: flex; gap: 10px; margin: 18px 0 0; padding: 0; list-style: none; }
.ego-rodape__redes a { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 50%; color: #fff; font-size: 16px; transition: background .15s, border-color .15s; }
.ego-rodape__redes a:hover { border-color: var(--ego-verde); background: var(--ego-verde); color: #fff; }
.ego-whatsapp { position: fixed; right: 22px; bottom: 22px; z-index: 900; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #25d366; box-shadow: 0 8px 24px rgba(0, 0, 0, .25); transition: transform .15s; }
.ego-whatsapp:hover { transform: scale(1.07); }
.ego-whatsapp svg { width: 30px; height: 30px; fill: #fff; }

/* ---------- Carrinho ---------- */
/* O tema empurra a página inteira 400px para a esquerda ao abrir a gaveta (body.open-drawer [data-drawer-push],
   e o .page-wrapper tem o atributo). Como no site deles, a gaveta abre por cima. A própria gaveta entra com a mesma
   regra, por isso só se trava o .page-wrapper. */
body.open-drawer .page-wrapper[data-drawer-push] { transform: none !important; overflow: visible !important; }
/* gaveta e fundo escuro (z-index 25 no tema) por cima do cabeçalho EGO, que é sticky com 1000. Com "body" à frente
   porque o CSS do tema vem num <style> do próprio carrinho, depois deste ficheiro. */
body .drawer-cover, body .cart-loader-cover { z-index: 1090; }
body .drawer { z-index: 1100; }

/* ---------- Botões e etiquetas (cartões e ficha) ---------- */
.ego-botao {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 0 22px;
    border: 0;
    border-bottom: 3px solid #3d3d3d;
    background: var(--ego-verde);
    color: #fff;
    font-family: var(--ego-titulos);
    font-size: 15px;
    letter-spacing: .04em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
}
.ego-botao:hover, .ego-botao:focus-visible { background: #659f1a; color: #fff; }
.ego-etiqueta { display: inline-block; padding: 3px 7px; background: #8a8a8a; color: #fff; font-family: var(--ego-texto); font-size: 11px; letter-spacing: .04em; line-height: 1.2; text-transform: uppercase; }
.ego-etiqueta--promo { background: var(--ego-verde); }

/* ---------- Choques com o CSS do tema nas listagens e na ficha ---------- */
/* .page-wrapper é flex em coluna: com margin auto e sem largura, o main media o conteúdo (os carrosséis alargavam-no) */
.ego-listagem, .ego-ficha { width: 100%; }
/* O tema põe a Poppins em p, a e li */
.ego-listagem a:not(.ego-botao), .ego-listagem p, .ego-ficha a:not(.ego-botao), .ego-ficha p, .ego-ficha li, .ego-ficha dt, .ego-ficha dd { font-family: inherit; }
/* .product-media > a { display: unset !important } e min-height: 200px deixavam as fotos dos cartões sem altura */
.ego-cartao .ego-cartao__foto { display: block !important; }
.ego-cartao .ego-cartao__media { min-height: 0; }
/* .btn-cart do tema: cinzento, com ícone antes e max-width de 198px */
.ego-ficha__comprar .btn-cart.ego-botao { min-width: 0; max-width: none; padding: 0 26px; border: 0; border-bottom: 3px solid #3d3d3d; color: #fff; }
.ego-ficha__comprar .btn-cart.ego-botao::before { content: none; }
.ego-ficha__comprar .btn-cart.ego-botao:hover { background: #659f1a; color: #fff; }

/* ---------- Cartão de produto ---------- */
.ego-cartao { position: relative; display: flex; flex-direction: column; height: 100%; margin: 0; padding: 0; border: 1px solid #e6e6e6; background: #fff; box-shadow: none; text-align: left; transition: border-color .2s, box-shadow .2s; }
.ego-cartao .ego-cartao__media { position: relative; margin: 0; padding: 16px; overflow: hidden; background: #fff; }
.ego-cartao__foto { display: block; position: relative; aspect-ratio: 4 / 3; }
.ego-cartao__imagem { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; transition: opacity .3s, transform .4s; }
.ego-cartao__imagem--segunda { opacity: 0; }
.ego-cartao__etiquetas { position: absolute; top: 12px; left: 12px; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; pointer-events: none; }
.ego-cartao .ego-cartao__media img.ego-cartao__gama { width: 58px; height: auto; }
.ego-cartao__corpo { display: flex; flex: 1; flex-direction: column; padding: 14px 16px 12px; border-top: 1px solid #f0f0f0; }
.ego-cartao__categoria { margin-bottom: 6px; color: #8a8a8a; font-size: 11px; font-weight: 600; letter-spacing: .09em; line-height: 1.3; text-transform: uppercase; }
/* "Pacote" (máquina com bateria e carregador) em etiqueta cheia, para se ver logo */
.ego-cartao__pacote { display: inline-block; margin-right: 8px; padding: 3px 7px 2px; background: var(--ego-verde); color: #fff; font-size: 10.5px; font-weight: 700; letter-spacing: .1em; line-height: 1.2; vertical-align: 1px; }
.ego-cartao__nome { margin: 0; font-family: var(--ego-texto); font-size: 14px; font-weight: 600; letter-spacing: .01em; line-height: 1.35; text-transform: uppercase; }
/* sempre 2 linhas (o espaço das 2 fica reservado): os cartões ficam todos da mesma altura; o nome inteiro está no title */
.ego-cartao__nome { display: -webkit-box; overflow: hidden; min-height: 2.7em; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.ego-cartao__nome a { color: #1d1d1d; text-decoration: none; }
.ego-cartao__preco { margin-top: auto; padding-top: 10px; color: var(--ego-verde); font-family: var(--ego-titulos); font-size: 29px; letter-spacing: .02em; line-height: 1; }
.ego-cartao__preco del { margin-left: 8px; color: #9a9a9a; font-size: 19px; }
/* "Adicionar" mais baixo, com o coração dos favoritos ao lado (mesma altura) */
/* "Adicionar" por cima do fundo da foto: sobe ao passar o rato ou com o foco do teclado; nos ecrãs de toque não há */
/* !important: o style.css do tema tem .product-media > a { display: unset !important } e o polish.css, no telemóvel,
   width/height: 100% (com mais especificidade) */
.ego-cartao .ego-cartao__botao { display: flex !important; justify-content: center; position: absolute; right: 12px; bottom: 12px; left: 12px; z-index: 2; width: auto !important; height: auto !important; min-height: 40px; margin: 0; font-size: 17px; opacity: 0; transform: translateY(14px); transition: opacity .2s, transform .25s ease-out; pointer-events: none; }
/* :focus-visible e não :focus-within: um clique no coração deixava o foco no cartão e o botão ficava à vista */
.ego-cartao:has(:focus-visible) .ego-cartao__botao { opacity: 1; transform: none; pointer-events: auto; }
/* Efeitos de passar o rato só com rato e ecrã de computador: no telemóvel um toque deixava o cartão "com o rato em
   cima" (borda verde, outra foto) até se tocar noutro sítio */
@media (hover: hover) and (min-width: 992px) {
    .ego-cartao:hover { border-color: var(--ego-verde); box-shadow: 0 14px 30px rgba(0, 0, 0, .09); }
    .ego-cartao:hover .ego-cartao__imagem { transform: scale(1.04); }
    .ego-cartao:hover .ego-cartao__imagem--segunda { opacity: 1; }
    .ego-cartao:hover .ego-cartao__imagem:not(.ego-cartao__imagem--segunda):has(+ .ego-cartao__imagem--segunda) { opacity: 0; }
    .ego-cartao__nome a:hover { color: #4f8a0c; }
    .ego-cartao:hover .ego-cartao__botao { opacity: 1; transform: none; pointer-events: auto; }
    .ego-cartao .ego-favorito:hover { color: #3f7409; }
}
/* sem rato, ou em ecrãs de tablet/telemóvel (o modo telemóvel do Chrome diz que há rato): sem botão, adiciona-se na ficha */
@media (hover: none), (max-width: 991px) { .ego-cartao .ego-cartao__botao { display: none !important; } }
/* ⊕ dos favoritos no canto de cima à direita da foto */
.ego-cartao .ego-cartao__favorito { position: absolute; top: 8px; right: 8px; z-index: 2; width: 36px; height: 36px; border: 0; background: none; }
.ego-cartao .ego-cartao__favorito i { font-size: 22px; }
.ego-favorito { display: grid; flex: 0 0 42px; place-items: center; padding: 0; border: 1px solid #d4d4d4; background: #fff; color: #1d1d1d; cursor: pointer; transition: border-color .15s, color .15s; }
/* o ⊕ do logótipo EGO Power+ (anel e cruz com as medidas do logótipo, mas o anel fechado), o mesmo do cabeçalho; nos favoritos, o disco cheio */
.ego-favorito i { font-size: 20px; line-height: 1; transition: transform .2s; }
.ego-mais { display: inline-block; width: 1em; height: 1em; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='45 7.65 8.35 8.35'%3E%3Cpath fill-rule='evenodd' d='M49.18 7.65a4.17 4.17 0 1 0 0 8.34a4.17 4.17 0 1 0 0-8.34ZM49.18 8.69a3.13 3.13 0 1 1 0 6.26a3.13 3.13 0 1 1 0-6.26Z'/%3E%3Cpath d='M49.72 14.03H48.73V12.29H47.03V11.3H48.73V9.57H49.72V11.3H51.41V12.29H49.72Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='45 7.65 8.35 8.35'%3E%3Cpath fill-rule='evenodd' d='M49.18 7.65a4.17 4.17 0 1 0 0 8.34a4.17 4.17 0 1 0 0-8.34ZM49.18 8.69a3.13 3.13 0 1 1 0 6.26a3.13 3.13 0 1 1 0-6.26Z'/%3E%3Cpath d='M49.72 14.03H48.73V12.29H47.03V11.3H48.73V9.57H49.72V11.3H51.41V12.29H49.72Z'/%3E%3C/svg%3E") center / contain no-repeat; }
.ego-favorito--sim .ego-mais { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='45 7.65 8.35 8.35'%3E%3Cpath fill-rule='evenodd' d='M49.18 7.65a4.17 4.17 0 1 0 0 8.34a4.17 4.17 0 1 0 0-8.34ZM49.72 14.03H48.73V12.29H47.03V11.3H48.73V9.57H49.72V11.3H51.41V12.29H49.72Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='45 7.65 8.35 8.35'%3E%3Cpath fill-rule='evenodd' d='M49.18 7.65a4.17 4.17 0 1 0 0 8.34a4.17 4.17 0 1 0 0-8.34ZM49.72 14.03H48.73V12.29H47.03V11.3H48.73V9.57H49.72V11.3H51.41V12.29H49.72Z'/%3E%3C/svg%3E"); }
.ego-favorito:focus-visible { border-color: var(--ego-verde); color: #3f7409; }
.ego-favorito--sim { border-color: var(--ego-verde); color: var(--ego-verde); }
.ego-favorito--sim i { animation: ego-coracao .35s ease-out; }
@keyframes ego-coracao { 50% { transform: scale(1.25); } }
/* O "+" rápido do polish.js: o cartão EGO já tem o botão Adicionar */
.ego-cartao .ck-quick-add { display: none !important; }

/* ---------- Listagens (categoria, produtos, pesquisa) ---------- */
.ego-faixa {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: clamp(130px, 16.5vw, 240px);
    padding: 20px;
    background: #111 center / cover no-repeat;
    text-align: center;
}
.ego-faixa__titulo { margin: 0 0 6px; color: #fff; font-family: var(--ego-titulos); font-size: clamp(30px, 3.4vw, 46px); font-weight: 400; line-height: 1.1; text-transform: uppercase; text-shadow: 0 2px 12px rgba(0, 0, 0, .7); }
.ego-migalhas { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; color: #bbb; font-family: var(--ego-texto); font-size: 13px; }
.ego-migalhas a { color: #ddd; text-decoration: none; }
.ego-migalhas a:hover { color: var(--ego-verde); }
.ego-listagem__conteudo { max-width: var(--ego-largura); margin: 0 auto; padding: 44px 20px 90px; }
.ego-listagem__vazio { padding: 40px 0; color: #777; text-align: center; }
.ego-listagem__barra { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 22px; padding-bottom: 12px; border-bottom: 1px solid #e6e6e6; }
.ego-listagem__barra h2 { margin: 0; color: #1d1d1d; font-family: var(--ego-titulos); font-size: 30px; font-weight: 400; letter-spacing: .02em; line-height: 1; text-transform: uppercase; }
.ego-listagem__total { color: #777; font-size: 14px; font-weight: 500; }
/* o primeiro (título "Todos os produtos" ou o total) empurra o resto para a direita */
.ego-listagem__barra { flex-wrap: wrap; align-items: center; }
.ego-listagem__barra > :first-child { margin-right: auto; }
.ego-ordenar { display: flex; align-items: center; gap: 10px; margin: 0; }
.ego-ordenar__rotulo { color: #777; font-size: 14px; font-weight: 500; white-space: nowrap; }
/* menu de ordenar próprio (layouts/ego/listagem) */
.ego-ordenar__menu { position: relative; }
.ego-ordenar__menu > summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-width: 210px; height: 42px; padding: 0 14px; border: 1px solid #d6d6d6; background: #fff; color: #1d1d1d; font: 500 15px var(--ego-texto); cursor: pointer; list-style: none; user-select: none; transition: border-color .15s; }
.ego-ordenar__menu > summary::-webkit-details-marker { display: none; }
.ego-ordenar__menu > summary::after { content: ""; width: 16px; height: 16px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d1d1d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat; transition: transform .2s; }
.ego-ordenar__menu[open] > summary, .ego-ordenar__menu > summary:hover { border-color: #1d1d1d; }
.ego-ordenar__menu[open] > summary::after { transform: rotate(180deg); }
.ego-ordenar__menu > summary:focus-visible { border-color: var(--ego-verde); outline: 2px solid rgba(119, 188, 31, .35); outline-offset: 1px; }
.ego-ordenar__menu ul { position: absolute; top: calc(100% + 6px); right: 0; z-index: 30; min-width: 100%; margin: 0; padding: 6px 0; border: 1px solid #e2e2e2; background: #fff; box-shadow: 0 14px 34px rgba(0, 0, 0, .12); list-style: none; animation: ego-ordenar-abrir .16s ease-out; }
.ego-ordenar__menu a { display: flex; align-items: center; gap: 10px; padding: 10px 16px 10px 14px; border-left: 3px solid transparent; color: #1d1d1d; font: 500 15px var(--ego-texto); text-decoration: none; white-space: nowrap; }
.ego-ordenar__menu a:hover, .ego-ordenar__menu a:focus-visible { background: #f4f4f4; outline: none; }
.ego-ordenar__menu a[aria-current] { border-left-color: var(--ego-verde); color: #3f7409; font-weight: 600; }
@keyframes ego-ordenar-abrir { from { opacity: 0; transform: translateY(-4px); } }
/* cartões com 250px no mínimo: 3 por linha ao lado da coluna lateral, 4 sem ela */
.ego-grelha { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 24px; }
.ego-paginacao { display: flex; flex-wrap: nowrap; justify-content: center; align-items: center; gap: 6px; margin-top: 50px; font-family: var(--ego-texto); font-size: 14px; }
.ego-paginacao a, .ego-paginacao > span { min-width: 24px; padding: 3px 7px; white-space: nowrap; color: #333; line-height: 18px; text-align: center; text-decoration: none; }
.ego-paginacao a:hover { color: var(--ego-verde); }
.ego-paginacao .ego-paginacao__actual { background: var(--ego-verde); color: #fff; }

/* Coluna lateral: árvore das categorias com o total de cada uma */
.ego-listagem__conteudo--lateral { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 0 44px; align-items: start; }
/* Com a coluna das categorias: a barra (total e ordenar) fica numa linha só por cima dos produtos e a paginação numa
   linha por baixo, para as categorias começarem e acabarem à altura dos cartões. A coluna dos produtos "desaparece"
   (display: contents) e as peças dela vão para as áreas da grelha. */
.ego-listagem__conteudo--lateral { grid-template-areas: ". barra" "lateral produtos" ". paginas"; }
.ego-listagem__conteudo--lateral > .ego-listagem__produtos { display: contents; }
.ego-listagem__conteudo--lateral .ego-listagem__barra { grid-area: barra; }
.ego-listagem__conteudo--lateral .ego-grelha, .ego-listagem__conteudo--lateral .ego-listagem__vazio { grid-area: produtos; }
.ego-listagem__conteudo--lateral > .ego-listagem__paginas { grid-area: paginas; }
.ego-listagem__lateral { grid-area: lateral; align-self: stretch; }
/* fica à vista ao descer a página, 20px por baixo do cabeçalho (107px); se for mais alta que o ecrã, desliza por dentro */
.ego-categorias { position: sticky; top: 127px; max-height: calc(100vh - 147px); overflow-y: auto; scrollbar-width: thin; padding: 24px 18px 20px; background: #f4f4f4; border-top: 3px solid var(--ego-verde); }
.ego-categorias__abrir { display: none; }
.ego-categorias__titulo { margin: 0 0 14px; padding: 0 12px; color: #1d1d1d; font-family: var(--ego-titulos); font-size: 31px; font-weight: 400; letter-spacing: .02em; line-height: 1; text-transform: uppercase; }
.ego-categorias ul { margin: 0; padding: 0; list-style: none; }
.ego-categorias__lista a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px; border-radius: 3px; color: #2b2b2b; font-size: 16px; font-weight: 500; line-height: 1.3; text-decoration: none; transition: background .15s, color .15s; }
.ego-categorias__lista a:hover { background: #fff; color: #1d1d1d; }
.ego-categorias__lista a[aria-current] { background: #1d1d1d; color: #fff; }
.ego-categorias__total { flex: 0 0 auto; color: #8a8a8a; font-size: 13px; font-weight: 600; }
.ego-categorias__lista a[aria-current] .ego-categorias__total { color: var(--ego-verde); }
.ego-categorias__lista summary { display: flex; align-items: center; list-style: none; cursor: pointer; }
.ego-categorias__lista summary::-webkit-details-marker { display: none; }
.ego-categorias__lista summary > a { flex: 1; min-width: 0; }
/* a seta abre e fecha o ramo; o nome leva à categoria */
.ego-categorias__lista summary::after { content: ""; flex: 0 0 auto; width: 7px; height: 7px; margin: -4px 8px 0 10px; border-right: 1.5px solid #666; border-bottom: 1.5px solid #666; transform: rotate(45deg); transition: transform .15s; }
.ego-categorias__lista details[open] > summary::after { margin-top: 4px; transform: rotate(-135deg); }
.ego-categorias__lista details ul { margin: 2px 0 4px 12px; padding-left: 6px; border-left: 2px solid #dedede; }
.ego-categorias__lista details ul a { padding: 7px 12px; color: #555; font-size: 15px; font-weight: 400; }
/* 3 subcategorias à vista; "Ver mais" mostra as outras */
.ego-categorias__filhas:not(.ego-categorias__filhas--todas) > li:nth-child(n+4) { display: none; }
.ego-categorias__mais { margin: 0 0 10px 20px; padding: 4px 12px; border: 0; background: none; color: #3f7409; font: 600 14px var(--ego-texto); cursor: pointer; }
.ego-categorias__mais:hover, .ego-categorias__mais:focus-visible { color: #1d1d1d; text-decoration: underline; text-decoration-color: var(--ego-verde); text-decoration-thickness: 2px; text-underline-offset: 4px; }

/* Categorias-mãe (Produtos, Acessórios, Gamas): o mosaico do menu por cima dos produtos */
.ego-subcategorias { margin-bottom: 44px; }

/* ---------- Páginas de conteúdo (editor): texto simples e "Sobre a EGO" ---------- */
.ego-texto { max-width: 960px; margin: 0 auto; padding: 50px 20px 80px; color: #555; font-family: var(--ego-texto); font-size: 14px; line-height: 1.7; }
.ego-texto p, .ego-texto li, .ego-texto a { font-family: inherit; }
.ego-texto h2, .ego-texto h3 { margin: 30px 0 12px; color: #222; font-family: var(--ego-titulos); font-weight: 400; text-transform: uppercase; }
.ego-texto a { color: var(--ego-verde); }

/* "Sobre a EGO" (resources/ego/sobre-a-ego.html, importado pelo ego:paginas): topo com foto, manifesto, números,
   duas secções texto + imagem, porquê EGO, garantias por gama e o compromisso. Etiquetas e títulos da homepage. */
.ego-sobre { color: #555; font-size: 16px; line-height: 1.65; }
.ego-sobre img { display: block; max-width: 100%; height: auto; }
.ego-sobre p { margin: 0 0 14px; }
.ego-sobre .ego-seccao__titulo .ego-verde { color: #5a9a12; }
.ego-sobre__destaque { color: #1d1d1d; font-size: 19px; font-weight: 600; line-height: 1.5; }
.ego-sobre__botoes { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 28px; }
.ego-sobre__link { color: #1d1d1d; font-weight: 600; text-decoration: underline; text-decoration-color: var(--ego-verde); text-decoration-thickness: 2px; text-underline-offset: 5px; }
.ego-sobre__link:hover { color: #3f7409; }
.ego-sobre__cabeca { margin-bottom: 40px; text-align: center; }

/* Topo: foto a quase ecrã inteiro com o h1 em baixo e a seta para descer */
.ego-sobre-topo { position: relative; display: flex; align-items: flex-end; min-height: clamp(520px, calc(100svh - 107px), 780px); overflow: hidden; background: #000; }
.ego-sobre .ego-sobre-topo__fundo { position: absolute; inset: 0; width: 100%; max-width: none; height: 100%; object-fit: cover; }
.ego-sobre-topo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .45) 55%, rgba(0, 0, 0, .15) 100%); }
.ego-sobre-topo__conteudo { position: relative; z-index: 1; width: 100%; max-width: var(--ego-largura); margin: 0 auto; padding: 0 20px 90px; }
.ego-sobre-topo .ego-seccao__etiqueta { color: var(--ego-verde); animation: ego-entrar .8s ease-out both; }
.ego-sobre-topo__titulo { max-width: 900px; margin: 0; color: #fff; font-family: var(--ego-titulos); font-size: clamp(56px, 8vw, 120px); font-weight: 400; line-height: .9; text-transform: uppercase; text-wrap: balance; animation: ego-entrar .8s .1s ease-out both; }
.ego-sobre-topo__titulo .ego-verde { color: var(--ego-verde); }
.ego-sobre .ego-sobre-topo__texto { max-width: 560px; margin: 22px 0 0; color: rgba(255, 255, 255, .86); font-size: 19px; animation: ego-entrar .8s .25s ease-out both; }
.ego-sobre-topo__descer { position: absolute; right: max(20px, calc((100% - 1320px) / 2 + 20px)); bottom: 90px; z-index: 1; display: grid; place-items: center; width: 56px; height: 56px; border: 2px solid rgba(255, 255, 255, .5); border-radius: 50%; color: #fff; animation: ego-descer 2s ease-in-out infinite; }
.ego-sobre-topo__descer:hover { border-color: var(--ego-verde); color: var(--ego-verde); }
.ego-sobre-topo__descer svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
@keyframes ego-descer { 50% { transform: translateY(8px); } }

/* Manifesto: a frase grande e dois parágrafos */
.ego-sobre-manifesto { max-width: 1100px; margin: 0 auto; padding: 110px 20px 90px; }
.ego-sobre .ego-sobre-manifesto__frase { margin: 0 0 48px; color: #1d1d1d; font-size: clamp(28px, 3.3vw, 46px); font-weight: 500; line-height: 1.2; letter-spacing: -.01em; text-wrap: balance; }
.ego-sobre-manifesto__frase .ego-verde { color: #5a9a12; }
.ego-sobre-manifesto__colunas { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; padding-top: 32px; border-top: 1px solid #e6e6e6; font-size: 17px; }

/* Números (contam ao aparecer: data-contar, script no master) */
.ego-sobre-numeros { background: #1d1d1d; color: #fff; }
.ego-sobre-numeros dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: var(--ego-largura); margin: 0 auto; padding: 0 20px; }
.ego-sobre-numeros dl > div { padding: 64px 28px; border-left: 1px solid rgba(255, 255, 255, .1); }
.ego-sobre-numeros dl > div:first-child { padding-left: 0; border-left: 0; }
.ego-sobre-numeros dt { color: var(--ego-verde); font-family: var(--ego-titulos); font-size: clamp(56px, 6vw, 84px); font-weight: 400; line-height: 1; }
.ego-sobre-numeros dd { margin: 10px 0 0; color: rgba(255, 255, 255, .72); font-size: 15px; line-height: 1.5; }

/* Texto ao lado de uma imagem (Arc Lithium; Uma bateria, todas as ferramentas) */
.ego-sobre-dupla { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 72px; max-width: var(--ego-largura); margin: 0 auto; padding: 110px 20px; }
.ego-sobre-dupla + .ego-sobre-dupla { padding-top: 0; }
.ego-sobre-dupla--invertida .ego-sobre-dupla__imagem { order: -1; }
.ego-sobre-dupla .ego-seccao__titulo { margin-bottom: 22px; }
.ego-sobre-dupla__imagem { margin: 0; overflow: hidden; }
.ego-sobre .ego-sobre-dupla__imagem img { width: 100%; }
.ego-sobre .ego-sobre-dupla__imagem--foto img { aspect-ratio: 1; object-fit: cover; }
.ego-sobre__pontos { display: grid; gap: 12px; margin: 26px 0 0; padding: 0; list-style: none; }
.ego-sobre__pontos li { position: relative; padding-left: 30px; color: #444; }
.ego-sobre__pontos li::before { content: ""; position: absolute; top: .3em; left: 0; width: 19px; height: 19px; border-radius: 50%; background: var(--ego-verde) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center / 12px no-repeat; }
.ego-sobre__pontos strong { color: #1d1d1d; }

/* Porquê EGO: três cartões */
.ego-sobre-porque { padding: 100px 20px; background: #f4f4f4; }
.ego-sobre-porque__cartoes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; max-width: var(--ego-largura); margin: 0 auto; }
.ego-sobre-porque article { padding: 36px 32px; border-top: 3px solid var(--ego-verde); background: #fff; transition: transform .2s, box-shadow .2s; }
.ego-sobre-porque article:hover { box-shadow: 0 18px 36px rgba(0, 0, 0, .08); transform: translateY(-4px); }
.ego-sobre-porque svg { width: 40px; height: 40px; margin-bottom: 20px; fill: none; stroke: #5a9a12; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ego-sobre-porque h3 { margin: 0 0 10px; color: #1d1d1d; font-family: var(--ego-titulos); font-size: 30px; font-weight: 400; line-height: 1; text-transform: uppercase; }
.ego-sobre .ego-sobre-porque p { margin: 0; font-size: 15px; }

/* EGO contra gasolina: barras que crescem quando aparecem (--v = largura em relação à gasolina) */
.ego-sobre-comparar { max-width: var(--ego-largura); margin: 0 auto; padding: 0 20px 110px; }
.ego-sobre .ego-sobre-comparar__intro { max-width: 620px; margin: 14px auto 0; font-size: 17px; }
.ego-sobre-comparar__grupos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.ego-comparar { padding: 28px 26px 24px; background: #f4f4f4; }
.ego-comparar h3 { margin: 0 0 18px; color: #1d1d1d; font-family: var(--ego-titulos); font-size: 30px; font-weight: 400; line-height: 1; text-transform: uppercase; }
.ego-comparar h3 small { display: block; margin-top: 6px; color: #8a8a8a; font-family: var(--ego-texto); font-size: 13px; letter-spacing: .04em; text-transform: none; }
.ego-comparar__barra { position: relative; display: flex; align-items: center; justify-content: space-between; height: 44px; margin-top: 10px; padding: 0 14px; color: #fff; font-size: 14px; font-weight: 600; }
.ego-comparar__barra::before { content: ""; position: absolute; inset: 0 auto 0 0; z-index: 0; width: var(--v); background: #8a8a8a; transition: width 1.1s cubic-bezier(.2, .8, .2, 1) .2s; }
.ego-comparar__barra--ego::before { background: var(--ego-verde); }
.ego-comparar__barra > * { position: relative; z-index: 1; }
.ego-comparar__barra strong { color: #1d1d1d; font-family: var(--ego-titulos); font-size: 26px; font-weight: 400; }
.ego-comparar__barra span { color: #1d1d1d; }
.ego-revelar [data-revelar]:not(.ego-visivel) .ego-comparar__barra::before { width: 0; }
.ego-sobre .ego-sobre-comparar__nota { max-width: 760px; margin: 22px auto 0; color: #8a8a8a; font-size: 13px; text-align: center; }

/* Garantias: um cartão por gama */
.ego-sobre-garantias { max-width: var(--ego-largura); margin: 0 auto; padding: 110px 20px; }
.ego-sobre .ego-sobre-garantias__intro { max-width: 640px; margin: 16px auto 0; font-size: 17px; }
.ego-sobre-garantias__gamas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.ego-sobre-garantias__gamas article { padding: 30px 28px; border: 1px solid #e6e6e6; }
.ego-sobre .ego-sobre-garantias__gamas article > img { width: auto; height: 50px; margin-bottom: 16px; }
.ego-sobre .ego-sobre-garantias__gamas article > p { min-height: 3.3em; font-size: 15px; }
.ego-sobre-garantias__gamas dl { display: grid; gap: 14px; margin: 18px 0 0; }
.ego-sobre-garantias__gamas dl > div { display: grid; grid-template-columns: 80px 1fr 1fr; align-items: end; gap: 10px; padding-top: 14px; border-top: 1px solid #ececec; }
.ego-sobre-garantias__gamas dt { color: #1d1d1d; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.ego-sobre-garantias__gamas dd { margin: 0; color: #8a8a8a; font-size: 12px; line-height: 1.3; }
.ego-sobre-garantias__gamas dd strong { display: block; color: #1d1d1d; font-family: var(--ego-titulos); font-size: 30px; font-weight: 400; line-height: 1; }
.ego-sobre-garantias__registo { display: flex; align-items: center; justify-content: space-between; gap: 28px; margin-top: 24px; padding: 30px 34px; border-left: 4px solid var(--ego-verde); background: #f4f4f4; }
.ego-sobre-garantias__registo h3 { margin: 0 0 8px; color: #1d1d1d; font-family: var(--ego-titulos); font-size: 28px; font-weight: 400; line-height: 1.05; text-transform: uppercase; }
.ego-sobre .ego-sobre-garantias__registo p { max-width: 720px; margin: 0; font-size: 15px; }
.ego-sobre-garantias__registo .ego-botao { flex: 0 0 auto; }

/* O nosso compromisso: o bidão riscado e os botões para a loja. Bloco à largura do conteúdo, com branco à volta:
   a toda a largura, o cinzento-escuro colava-se ao do rodapé. */
.ego-sobre-futuro { display: grid; grid-template-columns: 240px minmax(0, 1fr); align-items: center; gap: 72px; width: calc(100% - 40px); max-width: calc(var(--ego-largura) - 40px); margin: 0 auto 110px; padding: 72px; background: radial-gradient(ellipse at 14% 50%, rgba(119, 188, 31, .26) 0%, rgba(119, 188, 31, 0) 42%), linear-gradient(135deg, #2c2c2c 0%, #141414 100%); color: rgba(255, 255, 255, .8); }
.ego-sobre .ego-sobre-futuro > img { width: 100%; }
.ego-sobre-futuro .ego-seccao__etiqueta, .ego-sobre .ego-sobre-futuro .ego-verde { color: var(--ego-verde); }
.ego-sobre-futuro .ego-seccao__titulo { margin-bottom: 20px; color: #fff; }
.ego-sobre .ego-sobre-futuro p { max-width: 640px; color: rgba(255, 255, 255, .82); font-size: 17px; }

/* ---------- Perguntas frequentes (resources/ego/perguntas-frequentes.html) ---------- */
.ego-faq { max-width: 960px; margin: 0 auto; padding: 56px 20px 90px; color: #444; font-size: 16px; line-height: 1.65; }
.ego-faq p, .ego-faq li { color: #444; }
.ego-faq .ego-faq__intro { margin: 0 0 44px; color: #555; font-size: 18px; }
.ego-faq__grupo { margin-bottom: 52px; }
.ego-faq__grupo h2 { margin: 0 0 10px; color: #1d1d1d; font-family: var(--ego-titulos); font-size: 36px; font-weight: 400; line-height: 1; text-transform: uppercase; }
.ego-faq__item { border-bottom: 1px solid #e6e6e6; }
.ego-faq__item > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 4px; color: #1d1d1d; font-size: 18px; font-weight: 600; line-height: 1.35; list-style: none; cursor: pointer; }
.ego-faq__item > summary::-webkit-details-marker { display: none; }
.ego-faq__item > summary::after { content: "+"; flex: 0 0 auto; color: #5a9a12; font-size: 28px; font-weight: 400; line-height: 1; }
.ego-faq__item[open] > summary::after { content: "−"; }
.ego-faq__item > summary:hover { color: #3f7409; }
.ego-faq__resposta { padding: 0 4px 22px; }
.ego-faq__resposta p { margin: 0 0 12px; }
.ego-faq__resposta ul { margin: 0 0 12px; padding-left: 20px; }
.ego-faq a:not(.ego-botao) { color: #3f7409; font-weight: 600; }
.ego-faq__tabela { overflow-x: auto; }
.ego-faq__tabela table { width: 100%; border-collapse: collapse; font-size: 14px; }
.ego-faq__tabela th, .ego-faq__tabela td { padding: 10px 12px; border-bottom: 1px solid #ececec; text-align: left; white-space: nowrap; }
.ego-faq__tabela thead th { background: #1d1d1d; color: #fff; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.ego-faq__tabela tbody tr:nth-child(odd) { background: #f7f7f7; }
.ego-faq__tabela small { color: #8a8a8a; font-size: 11px; font-weight: 500; }
.ego-faq__tabela thead small { color: rgba(255, 255, 255, .6); }
.ego-faq .ego-faq__fonte { color: #8a8a8a; font-size: 13px; }

/* ---------- Contactos ---------- */
.ego-contactos { display: grid; grid-template-columns: 1fr 1.7fr; gap: 60px; width: 100%; max-width: 960px; margin: 0 auto; padding: 50px 20px 90px; color: #555; font-family: var(--ego-texto); font-size: 14px; }
.ego-contactos h2 { margin: 0 0 10px; color: #282828; font-family: var(--ego-titulos); font-size: 26px; font-weight: 400; text-transform: uppercase; }
.ego-contactos__info h2 + * { margin-bottom: 4px; }
.ego-contactos__info small { display: block; margin-bottom: 28px; color: #888; font-size: 12px; }
.ego-contactos__info a { color: #282828; font-size: 18px; text-decoration: none; }
.ego-contactos__info a:hover { color: var(--ego-verde); }
.ego-contactos__formulario form { display: grid; gap: 14px; }
.ego-contactos label { display: grid; gap: 6px; margin: 0; color: #333; font-size: 13px; font-weight: 700; }
.ego-contactos input[type=text], .ego-contactos input[type=tel], .ego-contactos input[type=email], .ego-contactos textarea {
    width: 100%; padding: 10px 12px; border: 1px solid #ddd; border-radius: 0; background: #fff; color: #333; font: 400 14px var(--ego-texto);
}
.ego-contactos input:focus, .ego-contactos textarea:focus { border-color: var(--ego-verde); outline: 0; }
.ego-contactos__par { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ego-contactos .ego-contactos__consentimento { display: block; font-weight: 400; line-height: 1.5; }
.ego-contactos__consentimento input { margin-right: 6px; accent-color: var(--ego-verde); }
.ego-contactos__consentimento a { color: var(--ego-verde); }
.ego-contactos button.ego-botao { justify-self: start; min-width: 160px; }
.ego-contactos__aviso { margin: 0 0 12px; padding: 10px 14px; border-left: 3px solid #c0392b; background: #fbeeee; color: #8a2a20; }
.ego-contactos__aviso--ok { border-color: var(--ego-verde); background: #f1f8e8; color: #3c6b0c; }

/* ---------- Ficha de produto (pages/products/show) ---------- */
.ego-ficha { max-width: var(--ego-largura); margin: 0 auto; padding: 24px 20px 90px; font-family: var(--ego-texto); }
.ego-migalhas--ficha { justify-content: flex-start; margin-bottom: 22px; color: #999; font-size: 13px; }
.ego-migalhas--ficha a { color: #777; }
.ego-migalhas--ficha a:hover { color: #3f7409; }
.ego-migalhas--ficha [aria-current] { color: #1d1d1d; }
.ego-ficha__topo { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: 64px; align-items: start; }

/* Galeria: presa ao descer enquanto se lê a coluna de compra; fundo cinzento e multiply para o branco das fotos sumir */
/* Com várias fotos, as miniaturas ficam numa coluna à esquerda (em baixo ficavam fora do ecrã e não se via que havia mais).
   A foto nunca passa da altura do ecrã por baixo do cabeçalho: quadrada, ou mais baixa num portátil com pouca altura
   (width: 100% explícito, senão o max-height passava à largura pelo aspect-ratio e a caixa encolhia). */
.ego-ficha__galeria { position: sticky; top: 127px; }
.ego-ficha__galeria--miniaturas { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 14px; align-items: start; }
.ego-ficha__galeria--miniaturas .ego-ficha__imagem { grid-column: 2; grid-row: 1; }
.ego-ficha__imagem { position: relative; width: 100%; aspect-ratio: 1; max-height: max(400px, calc(100vh - 210px)); margin: 0; padding: 32px; background: #f4f4f4; }
.ego-ficha__foto { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.ego-ficha__foto img { display: block; width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.ego-ficha__etiquetas { position: absolute; top: 16px; left: 16px; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.ego-ficha__ampliar { position: absolute; right: 16px; bottom: 16px; z-index: 2; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: #fff; box-shadow: 0 2px 10px rgba(0, 0, 0, .12); color: #1d1d1d; }
.ego-ficha__ampliar:hover { color: #3f7409; }
.ego-ficha__miniaturas { display: flex; flex-direction: column; grid-column: 1; grid-row: 1; gap: 10px; max-height: max(400px, calc(100vh - 210px)); overflow-y: auto; scrollbar-width: thin; }
.ego-ficha__miniaturas button { flex: 0 0 auto; }
.ego-ficha__miniaturas button { padding: 6px; border: 2px solid transparent; background: #f4f4f4; cursor: pointer; }
.ego-ficha__miniaturas button.active, .ego-ficha__miniaturas button:hover { border-color: var(--ego-verde); }
.ego-ficha__miniaturas img { display: block; width: 100%; aspect-ratio: 1; object-fit: contain; mix-blend-mode: multiply; }

/* Galeria em grande (<dialog> .ego-galeria): fundo claro como a ficha; um clique amplia 2,5× no ponto clicado */
.ego-galeria { width: 100vw; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; background: #f4f4f4; color: #1d1d1d; }
.ego-galeria::backdrop { background: rgba(0, 0, 0, .6); }
.ego-galeria[open] { display: flex; flex-direction: column; animation: ego-galeria .25s ease-out; }
@keyframes ego-galeria { from { opacity: 0; } }
.ego-galeria__palco { display: flex; flex: 1; align-items: center; justify-content: center; min-height: 0; overflow: hidden; padding: 72px 96px 12px; }
.ego-galeria__foto { max-width: 100%; max-height: 100%; object-fit: contain; mix-blend-mode: multiply; cursor: zoom-in; transition: transform .25s ease; touch-action: none; user-select: none; -webkit-user-drag: none; }
.ego-galeria__foto.is-zoom { cursor: zoom-out; transform: scale(2.5); }
.ego-galeria__fechar, .ego-galeria__seta { position: absolute; z-index: 2; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: #fff; box-shadow: 0 4px 16px rgba(0, 0, 0, .14); color: #1d1d1d; cursor: pointer; }
.ego-galeria__fechar { top: 16px; right: 16px; width: 48px; height: 48px; }
.ego-galeria__seta { top: 50%; width: 54px; height: 54px; margin-top: -27px; }
.ego-galeria__seta--anterior { left: 24px; }
.ego-galeria__seta--seguinte { right: 24px; }
.ego-galeria__fechar:hover, .ego-galeria__seta:hover { color: #3f7409; }
.ego-galeria svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ego-galeria__rodape { display: flex; justify-content: center; gap: 16px; margin: 0; padding: 12px 20px 22px; color: #6f6f6f; font-size: 14px; }
.ego-galeria__contador { color: #1d1d1d; font-weight: 700; }

/* Coluna de compra */
.ego-ficha__info { padding-top: 6px; }
.ego-ficha__etiqueta { margin-bottom: 12px; }
.ego-ficha__cabecalho { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.ego-ficha__titulo { margin: 0; color: #1d1d1d; font-family: var(--ego-titulos); font-size: clamp(36px, 3.4vw, 52px); font-weight: 400; line-height: .98; text-transform: uppercase; text-wrap: balance; }
.ego-ficha__gama { flex: 0 0 auto; }
.ego-ficha__gama img { display: block; width: 76px; height: auto; }
.ego-ficha__ref { margin: 10px 0 0; color: #8a8a8a; font-size: 13px; letter-spacing: .04em; }
/* .ego-ficha à frente: o .product-details .product-price do tema ganhava (tamanho e cor) */
.ego-ficha .ego-ficha__preco { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 22px 0 0; padding-top: 20px; border-top: 1px solid #e6e6e6; color: #1d1d1d; font-family: var(--ego-titulos); font-size: clamp(40px, 3.6vw, 54px); letter-spacing: .01em; line-height: 1; }
.ego-ficha .ego-ficha__preco del { color: #9a9a9a; font-size: .55em; }
.ego-ficha .ego-ficha__preco small { color: #777; font-family: var(--ego-texto); font-size: 13px; letter-spacing: 0; }
.ego-ficha__promo { margin: 6px 0 0; color: #777; font-size: 13px; }
/* estado do stock com um ponto: verde em stock, âmbar por encomenda, vermelho esgotado */
.ego-ficha__entrega { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; min-height: 22px; margin: 14px 0 22px; color: #1d1d1d; font-size: 15px; font-weight: 600; }
.ego-ficha__entrega .product-status-label::before { content: ""; display: inline-block; width: 9px; height: 9px; margin-right: 9px; border-radius: 50%; background: var(--ego-verde); box-shadow: 0 0 0 4px rgba(119, 188, 31, .22); vertical-align: 1px; }
.ego-ficha__entrega .ego-ficha__encomenda::before { background: #e0a100; box-shadow: 0 0 0 4px rgba(224, 161, 0, .2); }
.ego-ficha__entrega .ego-ficha__esgotado { color: #c0392b; }
.ego-ficha__entrega .ego-ficha__esgotado::before { background: #c0392b; box-shadow: 0 0 0 4px rgba(192, 57, 43, .18); }
.ego-ficha__variacao { margin-bottom: 18px; color: #555; font-size: 14px; font-weight: 600; }
.ego-ficha__variacao ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 0; padding: 0; list-style: none; }
.ego-ficha__variacao input { position: absolute; opacity: 0; }
.ego-ficha__variacao .radio-label { display: inline-block; padding: 9px 16px; border: 1px solid #d6d6d6; color: #1d1d1d; font-weight: 500; cursor: pointer; }
.ego-ficha__variacao input:checked + .radio-label { border-color: #1d1d1d; background: #1d1d1d; color: #fff; }
.ego-ficha__variacao input:focus-visible + .radio-label { outline: 2px solid var(--ego-verde); outline-offset: 2px; }

/* Este pacote contém, com a poupança face às peças em separado */
.ego-pacote { margin: 0 0 22px; padding: 18px 18px 14px; background: #f6f6f6; }
.ego-pacote__titulo { margin: 0 0 6px; color: #1d1d1d; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.ego-pacote__item { display: grid; grid-template-columns: 46px 1fr auto; align-items: center; gap: 12px; padding: 8px 0; border-top: 1px solid #e3e3e3; color: #1d1d1d; font-size: 14px; text-decoration: none; }
.ego-pacote__titulo + .ego-pacote__item { border-top: 0; }
.ego-pacote__item img { width: 46px; height: 46px; object-fit: contain; mix-blend-mode: multiply; }
.ego-pacote__item:hover .ego-pacote__nome { color: #3f7409; }
.ego-pacote__nome { font-weight: 500; line-height: 1.3; }
.ego-pacote__quantidade { color: #3f7409; font-weight: 700; }
.ego-pacote__preco { color: #555; font-size: 13px; white-space: nowrap; }
.ego-pacote__poupanca { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 6px 0 0; padding-top: 12px; border-top: 1px solid #e3e3e3; color: #555; font-size: 14px; }
.ego-pacote__poupanca strong { margin-left: auto; padding: 4px 10px; background: var(--ego-verde); color: #1d1d1d; font-size: 13px; font-weight: 700; }

/* Comprar: quantidade e botão grande */
.ego-ficha__comprar { display: flex; align-items: stretch; gap: 10px; }
/* o tema empilha .product-details-action em coluna no telemóvel; aqui a quantidade fica ao lado do botão */
.ego-ficha__comprar.product-details-action { flex-direction: row; flex-wrap: nowrap; margin-bottom: 0; }
.ego-ficha__comprar .btn-cart.ego-botao, .ego-ficha__comprar .ego-botao { flex: 1; min-height: 58px; font-size: 22px; }
/* barra fixa "Adicionar ao carrinho" do polish.js (telemóvel) com o botão EGO */
/* barra fixa "Adicionar ao carrinho" do polish.js (telemóvel): escondida por baixo do ecrã enquanto o botão da ficha
   está à vista (body.ego-comprar-fora, script na ficha); preço grande à esquerda, botão EGO, pouco padding */
@media (max-width: 768px) {
    .ck-sticky-cart { gap: 14px; padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); transform: translateY(calc(100% + 24px)); pointer-events: none; }
    body.ego-comprar-fora .ck-sticky-cart { transform: none; pointer-events: auto; }
    body.ck-has-sticky-cart { padding-bottom: 64px; }
    .ck-sticky-cart .ck-sticky-cart__price { color: #1d1d1d; font-family: var(--ego-titulos); font-size: 30px; font-weight: 400; letter-spacing: .02em; line-height: 1; }
    .ck-sticky-cart .ck-sticky-cart__btn { min-height: 48px; padding: 0 14px; border-radius: 0; border-bottom: 3px solid #3d3d3d; background: var(--ego-verde); font-family: var(--ego-titulos); font-size: 19px; font-weight: 400; letter-spacing: .04em; text-transform: uppercase; }
}
.ego-quantidade { display: flex; border: 1px solid #d6d6d6; }
.ego-quantidade button { width: 40px; border: 0; background: #fff; color: #555; font-size: 20px; line-height: 1; cursor: pointer; }
.ego-quantidade button:hover { color: #3f7409; }
.ego-quantidade input { width: 50px; border: 0; border-right: 1px solid #eee; border-left: 1px solid #eee; font-size: 17px; text-align: center; appearance: textfield; -moz-appearance: textfield; }
.ego-quantidade input::-webkit-inner-spin-button, .ego-quantidade input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.ego-ficha__vantagens { display: grid; gap: 11px; margin: 24px 0 0; padding: 20px 0 0; border-top: 1px solid #e6e6e6; list-style: none; }
.ego-ficha__vantagens li { display: flex; align-items: center; gap: 12px; color: #444; font-size: 15px; }
.ego-ficha__vantagens svg { flex: 0 0 auto; width: 24px; height: 24px; fill: none; stroke: #5a9a12; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ego-ficha__vantagens strong { color: #1d1d1d; }
.ego-ficha__vantagens a { color: inherit; text-decoration: none; }
.ego-ficha__vantagens a:hover strong { color: #3f7409; }

/* Secções por baixo: título à esquerda (preso ao descer) e conteúdo à direita */
.ego-ficha__seccao { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.8fr); gap: 64px; margin-top: 96px; padding-top: 56px; border-top: 1px solid #e6e6e6; }
.ego-ficha__seccao > div:first-child { position: sticky; top: 127px; align-self: start; }
.ego-ficha__seccao .ego-seccao__titulo { font-size: clamp(34px, 3.2vw, 48px); }
.ego-ficha__texto { color: #444; font-size: 17px; line-height: 1.7; }
/* as descrições do PrestaShop trazem tabelas e palavras compridas: não podem alargar a página no telemóvel */
.ego-ficha__texto { overflow-wrap: anywhere; }
.ego-ficha__texto table { display: block; max-width: 100%; overflow-x: auto; }
.ego-ficha__texto img { max-width: 100%; height: auto; }
.ego-ficha__texto p { margin: 0 0 16px; }
.ego-ficha__texto strong { color: #1d1d1d; }
.ego-ficha__texto a { color: #3f7409; }
.ego-ficha__tabela { margin: 0; border-top: 1px solid #ececec; }
.ego-ficha__tabela > div { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 24px; padding: 14px 16px; border-bottom: 1px solid #ececec; }
.ego-ficha__tabela > div:nth-child(odd) { background: #f7f7f7; }
.ego-ficha__tabela dt { color: #1d1d1d; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.ego-ficha__tabela dd { margin: 0; color: #444; font-size: 15px; }
.ego-ficha__tabela dd ul, .ego-ficha__tabela dd ol { margin: 0; padding-left: 18px; }
.ego-ficha__tabela dd li { margin: 2px 0; }
.ego-ficha__nota { margin: 14px 0 0; color: #8a8a8a; font-size: 13px; }
.ego-ficha__nota a { color: #3f7409; font-weight: 600; }
.ego-ficha__intro { max-width: 340px; margin: 16px 0 0; color: #555; font-size: 15px; line-height: 1.55; }
.ego-ficha__tabela dt small { margin-left: 6px; color: #8a8a8a; font-size: 11px; font-weight: 500; letter-spacing: .04em; }
/* Autonomia por bateria: cabeçalho, a bateria que o kit traz a verde e as não recomendadas esbatidas */
.ego-ficha__tabela--baterias > .ego-ficha__tabela-cabeca { background: #1d1d1d !important; }
.ego-ficha__tabela--baterias > .ego-ficha__tabela-cabeca dt, .ego-ficha__tabela--baterias > .ego-ficha__tabela-cabeca dd { color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ego-ficha__tabela--baterias dt { text-transform: none; letter-spacing: 0; font-size: 15px; }
.ego-ficha__tabela--baterias dd { font-weight: 600; color: #1d1d1d; }
.ego-ficha__tabela--baterias > .is-incluida { background: #eef7e2 !important; box-shadow: inset 3px 0 0 var(--ego-verde); }
.ego-ficha__tabela--baterias > .is-fora dd { color: #9a9a9a; font-weight: 400; }
.ego-ficha__tabela--baterias .ego-etiqueta { margin-left: 8px; vertical-align: 2px; }
.ego-pacote__autonomia { display: flex; align-items: center; gap: 10px; margin: 6px 0 0; padding-top: 12px; border-top: 1px solid #e3e3e3; color: #444; font-size: 14px; }
.ego-pacote__autonomia svg { flex: 0 0 auto; width: 22px; height: 22px; fill: none; stroke: #5a9a12; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ego-pacote__autonomia strong { color: #1d1d1d; }
.ego-ficha__ficheiros { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); align-self: start; gap: 14px; margin: 0; padding: 0; list-style: none; }
.ego-ficha__ficheiros a { display: flex; align-items: center; gap: 14px; padding: 18px 20px; border: 1px solid #e6e6e6; color: #1d1d1d; font-weight: 600; text-decoration: none; transition: border-color .15s, box-shadow .15s; }
.ego-ficha__ficheiros a:hover { border-color: var(--ego-verde); box-shadow: 0 10px 22px rgba(0, 0, 0, .07); color: #1d1d1d; }
.ego-ficha__ficheiros svg { flex: 0 0 auto; width: 30px; height: 30px; fill: none; stroke: #5a9a12; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ego-ficha__ficheiros small { display: block; color: #8a8a8a; font-weight: 400; }

/* Carrosséis: Poderá também necessitar de / Produtos relacionados */
.ego-carrossel { margin-top: 96px; padding-top: 56px; border-top: 1px solid #e6e6e6; }

/* ---------- Tablet e telemóvel ---------- */
@media (max-width: 991px) {
    .ego-header__barra { min-height: 68px; gap: 16px; }
    .ego-header__menu-mobile { display: block; }
    .ego-header__logo { margin-left: 0; }
    .ego-header__logo img { height: clamp(34px, 10.5vw, 46px); } /* com os quatro ícones, o logótipo cabe até nos 360px */
    .ego-nav { display: none; }
    .ego-header__icones { margin-left: auto; gap: 18px; }
    /* no telemóvel ficam também os favoritos e a conta (o polish.css escondia a conta): rótulos mais pequenos */
    .ego-header__barra { padding: 0 14px; gap: 10px; }
    .ego-header__icones { gap: 9px; }
    .ego-header__icones .ck-account-btn { display: flex; }
    .ego-header__logo { flex-shrink: 0; }
    .ego-header__rotulo { font-size: 10px; letter-spacing: 0; }
    .ego-header__icones .ego-pesquisa__abrir { font-size: 23px; }

    .ego-hero { height: clamp(500px, 78svh, 640px); }
    .ego-hero::after { background: linear-gradient(0deg, rgba(0, 0, 0, .88) 0%, rgba(0, 0, 0, .45) 55%, rgba(0, 0, 0, .15) 100%); }
    .ego-hero__conteudo { justify-content: flex-end; padding-bottom: 48px; }
    .ego-hero__media { object-position: 45% center; }
    /* a faixa desliza sem parar (duas voltas iguais: andar metade é voltar ao início); pára com o dedo em cima */
    .ego-confianca { overflow: hidden; }
    .ego-confianca__lista { display: flex; width: max-content; padding: 0; animation: ego-deslizar 28s linear infinite; }
    .ego-confianca:active .ego-confianca__lista { animation-play-state: paused; }
    .ego-confianca__lista > li { flex: 0 0 auto; }
    .ego-confianca .ego-confianca__copia { display: list-item; }
    .ego-confianca__item { padding: 14px 24px; white-space: nowrap; }
    .ego-confianca__item svg { width: 34px; height: 34px; }
    .ego-seccao, .ego-tec { padding: 60px 0; }
    .ego-seccao__cabeca { flex-direction: column; align-items: flex-start; gap: 14px; margin-bottom: 26px; }
    .ego-seccao__cabeca--centro { align-items: center; }
    .ego-bateria__grelha { grid-template-columns: 1fr; gap: 30px; padding: 64px 20px; }
    .ego-orbita { order: -1; width: min(420px, 100%); }
    .ego-gamas, .ego-tec__cartoes, .ego-final { grid-template-columns: 1fr; }


    .ego-rodape__colunas { grid-template-columns: 1fr; }

    .ego-ficha__topo { grid-template-columns: 1fr; gap: 28px; }
    .ego-ficha__galeria, .ego-ficha__seccao > div:first-child { position: static; }
    /* no telemóvel e tablet: foto quadrada a toda a largura e as miniaturas por baixo, numa fila que desliza */
    .ego-ficha__galeria--miniaturas { grid-template-columns: minmax(0, 1fr); gap: 10px; }
    .ego-ficha__galeria--miniaturas .ego-ficha__imagem { grid-column: 1; }
    .ego-ficha__imagem { max-height: none; }
    .ego-ficha__miniaturas { flex-direction: row; grid-row: 2; max-height: none; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
    .ego-ficha__miniaturas button { width: 72px; }
    .ego-ficha__seccao { grid-template-columns: minmax(0, 1fr); gap: 22px; margin-top: 56px; padding-top: 40px; }
    .ego-carrossel { margin-top: 56px; padding-top: 40px; }

    /* coluna lateral passa a caixa "Categorias" fechada por cima da grelha */
    .ego-listagem__conteudo--lateral { grid-template-columns: 1fr; grid-template-areas: "lateral" "barra" "produtos" "paginas"; gap: 0; }
    .ego-listagem__lateral { margin-bottom: 20px; }
    .ego-categorias { position: static; max-height: none; overflow: visible; padding: 0 12px; }
    .ego-categorias__abrir { display: flex; justify-content: space-between; align-items: center; padding: 13px 10px; color: #1d1d1d; font-family: var(--ego-titulos); font-size: 22px; line-height: 1; text-transform: uppercase; list-style: none; cursor: pointer; }
    .ego-categorias__abrir::-webkit-details-marker { display: none; }
    .ego-categorias__abrir::after { content: "+"; color: #666; font-family: var(--ego-texto); font-size: 22px; font-weight: 400; }
    .ego-categorias[open] > .ego-categorias__abrir::after { content: "−"; }
    .ego-categorias__titulo { display: none; }
    .ego-categorias__lista { padding-bottom: 12px !important; }
    .ego-sugestoes__lista { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    /* as setas do owl ficavam fora do ecrã e alargavam a página (390px → 426px, deslizava de lado); no toque desliza-se */
    .ego-carrossel-home .owl-nav { display: none; }
    .ego-galeria__palco { padding: 68px 12px 8px; }
    .ego-galeria__seta { top: auto; bottom: 14px; width: 44px; height: 44px; margin-top: 0; }
    .ego-galeria__seta--anterior { left: 14px; }
    .ego-galeria__seta--seguinte { right: 14px; }
    .ego-galeria__rodape { padding: 12px 70px 26px; text-align: center; }
    /* no tablet as colunas fixas ficavam minúsculas: tantas de 134px quantas couberem */
    .ego-subcategorias .ego-mosaico { grid-template-columns: repeat(auto-fit, 134px); }

    .ego-contactos, .ego-contactos__par { grid-template-columns: 1fr; gap: 30px; }

    .ego-sobre-topo { min-height: 72svh; }
    .ego-sobre-topo__conteudo { padding-bottom: 56px; }
    .ego-sobre-topo__descer { display: none; }
    .ego-sobre-manifesto { padding: 64px 20px 50px; }
    .ego-sobre-manifesto__colunas { grid-template-columns: 1fr; gap: 0; }
    .ego-sobre-numeros dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ego-sobre-numeros dl > div, .ego-sobre-numeros dl > div:first-child { padding: 34px 16px 30px 0; border-top: 1px solid rgba(255, 255, 255, .1); border-left: 0; }
    .ego-sobre-dupla { grid-template-columns: 1fr; gap: 36px; padding: 64px 20px; }
    .ego-sobre-dupla--invertida .ego-sobre-dupla__imagem { order: 0; }
    .ego-sobre-porque, .ego-sobre-garantias { padding: 64px 20px; }
    .ego-sobre-porque__cartoes, .ego-sobre-garantias__gamas { grid-template-columns: 1fr; }
    .ego-sobre-comparar { padding: 0 20px 64px; }
    .ego-sobre-comparar__grupos { grid-template-columns: 1fr; }
    .ego-sobre-garantias__registo { flex-direction: column; align-items: flex-start; padding: 24px 22px; }
    .ego-sobre-futuro { grid-template-columns: 1fr; gap: 28px; width: calc(100% - 28px); margin-bottom: 64px; padding: 44px 24px; }
    .ego-sobre .ego-sobre-futuro > img { width: 110px; }
}

@media (max-width: 767px) {
    /* a frase da imagem da faixa fica cortada atrás do título: mostra-se o corta-relvas, escurecido */
    .ego-faixa { position: relative; min-height: 170px; background-position: 100% center; }
    .ego-faixa::before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .55); }
    .ego-faixa > * { position: relative; }
}

@media (max-width: 575px) {
    .ego-grelha { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .ego-listagem__conteudo { padding: 24px 14px 60px; }
    .ego-hero__texto { font-size: 16px; }
    .ego-hero__botoes { align-self: stretch; }
    .ego-hero__botoes .ego-botao--grande { flex: 1; padding: 0 14px; font-size: 19px; }
    .ego-confianca__item { gap: 10px; padding: 12px 20px; }
    .ego-confianca__item svg { width: 30px; height: 30px; }
    .ego-confianca__item strong { font-size: 14px; }
    .ego-confianca__item small { font-size: 12.5px; }
    .ego-seccao__dentro { padding: 0 14px; }
    .ego-numeros dt { font-size: 46px; }
    .ego-final__catalogo, .ego-final__ajuda { padding: 30px 22px; }
    .ego-cartao .ego-cartao__media { padding: 12px; }
    .ego-cartao__corpo { padding: 12px 12px 10px; }
    .ego-cartao__categoria { font-size: 10px; letter-spacing: .06em; }
    .ego-cartao__nome { font-size: 13px; -webkit-line-clamp: 3; line-clamp: 3; } /* em 2 linhas, 9 kits ficavam com o mesmo nome à vista (broca 10/15/20 cm, baterias 7,5/10 Ah) */
    .ego-cartao__preco { font-size: 25px; }
    /* coração à direita do preço: o corpo passa a ser a referência e o coração tem a altura da linha do preço */
    .ego-cartao__corpo { position: relative; }
    .ego-cartao__preco { padding-right: 34px; }
    .ego-cartao .ego-cartao__favorito { top: auto; right: 4px; bottom: 10px; width: 32px; height: 25px; }
    .ego-cartao .ego-cartao__favorito i { font-size: 21px; }
    .ego-cartao__pacote { margin-right: 6px; padding: 2px 5px 1px; font-size: 9.5px; letter-spacing: .06em; }
    .ego-cartao .ego-cartao__media img.ego-cartao__gama { width: 42px; }
    .ego-cartao__etiquetas { top: 8px; left: 8px; }
    /* as 18 subcategorias de Produtos em 3 colunas: todas à vista sem empurrar os produtos para muito longe */
    /* duas linhas a deslizar na horizontal: as 18 de Produtos ocupavam um ecrã antes dos produtos */
    .ego-subcategorias { margin-bottom: 30px; }
    .ego-subcategorias .ego-mosaico { grid-auto-flow: column; grid-template-columns: none; grid-template-rows: repeat(2, auto); grid-auto-columns: 100px; justify-content: start; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; }
    .ego-subcategorias .ego-mosaico > li { scroll-snap-align: start; }
    .ego-mosaico__item { padding: 6px 4px 8px; }
    .ego-mosaico__nome { font-size: 12.5px; }
    .ego-pesquisa__conteudo { gap: 8px; padding: 14px 14px 16px; }
    .ego-pesquisa__conteudo input[type=search] { height: 46px; font-size: 17px; }
    .ego-pesquisa__ir { display: none; }
    /* sugestões numa linha a deslizar */
    .ego-pesquisa__resultados { padding: 0 14px 18px; }
    .ego-sugestoes__topo { flex-direction: column; gap: 4px; }
    .ego-sugestoes__lista { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 132px; overflow-x: auto; scrollbar-width: none; }
    .ego-listagem__barra h2 { font-size: 26px; }
    .ego-ficha { padding: 16px 14px 60px; }
    .ego-ficha__imagem { padding: 18px; }
    .ego-ficha__gama img { width: 60px; }
    .ego-ficha__comprar .btn-cart.ego-botao, .ego-ficha__comprar .ego-botao { min-height: 52px; font-size: 19px; }
    .ego-pacote { padding: 14px 14px 10px; }
    .ego-ficha__tabela > div { grid-template-columns: 1fr; gap: 4px; padding: 12px; }
    .ego-ficha__texto { font-size: 16px; }
}

/* Faixa de confiança com "reduzir movimento": parada, desliza-se com o dedo */
@media (max-width: 991px) and (prefers-reduced-motion: reduce) {
    .ego-confianca { overflow-x: auto; scrollbar-width: none; }
    .ego-confianca__lista { animation: none; }
    .ego-confianca .ego-confianca__copia { display: none; }
}

@media (max-width: 575px) {
    /* poucas subcategorias (as 3 gamas): numa linha, em vez das duas filas a deslizar */
    .ego-subcategorias .ego-mosaico--poucas { grid-auto-flow: row; grid-template-rows: none; grid-template-columns: repeat(var(--colunas), minmax(0, 1fr)); overflow: visible; }
    /* paginação numa linha: só as 5 páginas e as setas */
    .ego-paginacao { gap: 4px; }
    .ego-paginacao__texto, .ego-paginacao__ponta { display: none; }
}

/* No telemóvel o mosaico já desliza de lado: aparecem todas, sem o "Ver mais" */
@media (max-width: 575px) {
    .ego-mosaico--recolhido .ego-mosaico__extra { display: list-item; }
    .ego-mosaico--recolhido .ego-mosaico__mais { display: none; }
}

/* Carrosséis de produtos no telemóvel: 2 cartões e o 3.º a espreitar. O Owl fica com 2 itens inteiros (com 2,2 calculava
   uma posição que não existe e, ao largar o dedo, voltava ao início) numa caixa com a largura de 2 cartões; o 3.º vê-se
   ao lado porque o .owl-stage-outer deixa de cortar, e a secção corta na borda. */
@media (max-width: 767px) {
    .ego-carrossel-home { width: calc((100% - 24px) / 1.1 + 12px); }
    .ego-carrossel-home .owl-stage-outer { overflow: visible; }
    .ego-seccao__dentro:has(> .ego-carrossel-home), .ego-carrossel { overflow: hidden; }
}
