/*

 * JDias official CSS theme

 */



/*
 * Fonts
 */

/* Títulos e Slogan (Substituto da Trajan) */
div#top_slogan,
nav#site-navigation,
div#news_slider p.bjqs-caption,
#teste p,
h1, h2, h3, h4, h5, h6, span, li, div,
.menu-toggle,
.entry-title {
	font-family: 'Cinzel', serif !important;
	font-weight: 600;
}

/* Links e navegação */
a, a:visited {color: #e0a236; text-decoration: none;}
a:hover {color: #333; text-decoration: none;}

hr {margin-top: 20px; margin-bottom: 20px; border: 0; border-top: 3px solid #bd7d07;}

/* Texto de corpo (Substituto da Frutiger) */
.roboto_slab, body, p {
	font-family: 'Lora', sans-serif !important;
}

p { font-weight: 400; line-height: 1.6em; }




/*
 * General
 */

html, body {height: 100%; max-width: 100%;}

body {
	padding-top: 0;
	background: #eee;
}

body.home {
	padding-top: 32px;
}

img {	max-width: 100%;}



#page {	height: 100%;    width: 100%;}



/* --- NOVO HERO SECTION (Slogan Centrado) --- */

/* --- HERO SECTION CORRIGIDO --- */

#hero_wrapper {
    position: fixed !important;
    top: 0; left: 0; right: 0; bottom: 0;
    width: 100% !important;
    height: 100vh !important;
    
    /* Centralização */
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    
    z-index: 10;
    pointer-events: none;
    
    /* TRUQUE PRO: Sombra interior para focar o centro e escurecer o vídeo */
    box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.3); /* 30% de escurecimento global */
}

/* --- NOVO DESIGN HERO: O SELO DO ARTESÃO --- */

/* --- TEXTO PRINCIPAL --- */
/* --- CORREÇÃO DE CENTRAMENTO + DESIGN PREMIUM --- */

/* --- CORREÇÃO DE CENTRAMENTO + DESIGN PREMIUM --- */

div#top_slogan {
    /* 1. Forçar largura total para garantir o centro exato */
    position: relative;
    width: 100% !important; 
    left: 0 !important;
    right: 0 !important;
    margin: 0 !important;
    padding: 0 0px; /* Margem de segurança lateral */
    
    /* 2. Alinhamento */
    text-align: center !important;
    display: flex; /* Truque extra para centrar o conteúdo verticalmente se preciso */
    flex-direction: column;
    align-items: center;
    justify-content: center;
    
    z-index: 20;
    
    /* 3. Estilo de Luxo (Mantido) */
    color: #f0f0f0;
    text-transform: uppercase;
    font-size: 3em; 
    line-height: 1.4em;
    letter-spacing: 0.15em; 
    text-shadow: 0px 0px 20px rgba(0,0,0,0.8);
    display: none; /* O PHP ativa isto depois */
    pointer-events: auto;
}


/* O resto do código (linhas e span) mantém-se igual, 
   mas certifica-te que tens este bloco das linhas também: */


div#top_slogan::before,
div#top_slogan::after {
    content: "";
    display: block;
    width: 120px;
    height: 1px;
    margin: 0 auto;
    background: linear-gradient(90deg, transparent, #c6a664, transparent);
}

div#top_slogan::before { margin-bottom: 30px; }
div#top_slogan::after  { margin-top: 30px; }


/* --- PALAVRAS DESTAQUE (Gradient Text) --- */
div#top_slogan span {
    /* Cor base de segurança */
    color: #c6a664; 
    font-weight: 700; /* Não uses 800/900, o luxo quer-se mais fino e definido */
    letter-spacing: 0.15em; /* Mantém o espaçamento igual ao resto */    
    /* Efeito Ouro Brilhante no Texto (Webkit) */
    background: linear-gradient(45deg, #ae8625, #f7ef8a, #d2ac47, #edc967);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;   
    /* Nota: Se o gradiente falhar em browsers antigos, ele usa a cor base definida acima */
    filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.5)); /* Sombra suave para destacar o ouro */
}


/* Ajustes Finais para Telemóvel */
@media (max-width: 700px) {
    div#top_slogan {
        font-size: 1.8em; /* Reduz tamanho */
        letter-spacing: 0.1em; /* Reduz espaçamento */
    }
    div#top_slogan::before,
    div#top_slogan::after {
        width: 80px; /* Linhas menores */
    }
}

/* Mostra apenas na Homepage */
body.home div#top_slogan {
	display:block
}

div#top_slogan span {
    color: #e0a236 !important; /* O !important obriga a cor a mudar */
    font-weight: 800;
}


@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
  40% {transform: translateY(-10px);}
  60% {transform: translateY(-5px);}
}

/* Empurra o conteúdo para baixo do vídeo */
#content {
    background: #fff;
    position: relative;
    z-index: 2;
    padding-top: 60px; /* Espaço extra no topo do conteúdo */
}





#whitefadeout {

	height: 100%;

	width: 100%;

	position: fixed;

	top: 0;

	left: 0;

	z-index: 999;

	background: #fff;

}



#supersized-loader {

	display: none;

}



.no-padding-h {

	padding-left: 0;

	padding-right: 0;

}



.no-padding-v {

	padding-top: 0;

	padding-bottom: 0;

}



.no-padding-all {

	padding: 0;

}



section img {

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	border-radius: 5px;

}



/* ============================================================
   JDIAIS - ULTIMATE LUXURY NAVIGATION (FUNCTIONAL & PREMIUM)
   ============================================================ */

/* 1. Limpeza do tema original */
div#menu_background, 
nav#site-navigation a.menu-toggle {
    display: none !important;
}

/* 2. Estrutura do Menu */
nav#site-navigation {
    position: fixed;
    top: 0;
    width: 100%;
    min-height: 75px;
    z-index: 9999;
    text-align: center;
    pointer-events: auto;
    cursor: pointer; 
}

/* 3. A BARRA PRETA COM DENTADA CIRCULAR E LINHA DOURADA */
nav#site-navigation::before {
    content: '';
    position: absolute;
    top: -450px; 
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 75px;
    
    /* REMOVIDO: background-color: #080808; (O preto vem do radial-gradient agora) */

    /* AS DUAS CAMADAS NUMA SÓ PROPRIEDADE */
    background-image: 
        /* CAMADA 1: A Linha Dourada (em cima) */
        linear-gradient(to right, 
            rgba(198, 166, 100, 1) 0%, 
            rgba(198, 166, 100, 1) 20%, 
            rgba(198, 166, 100, 0) calc(50% - 60px), 
            transparent calc(50% + 60px), 
            rgba(198, 166, 100, 1) 80%, 
            rgba(198, 166, 100, 1) 100%),
        
        /* CAMADA 2: A Barra Preta com o Círculo Transparente (em baixo) */
        radial-gradient(circle at 50% 143%, 
            transparent 89px, 
            #080808 90px);

    /* IMPORTANTE: Definir o tamanho para cada imagem (Linha: 1px de altura | Barra: 100% de altura) */
    background-size: 100% 1px, 100% 100%;
    background-repeat: no-repeat;
    
    /* A linha fica no fundo (bottom) e a barra preta ocupa tudo (center) */
    background-position: bottom center, center center;

    filter: drop-shadow(0 15px 25px rgba(0,0,0,0.9));
    transition: top 0.7s cubic-bezier(0.19, 1, 0.22, 1);
    z-index: -2;
}

/* 5. O LOGOTIPO */

nav#site-navigation .logo img { display: none !important; }



nav#site-navigation .logo {

    display: block !important;

    width: 175px;

    height: 175px;

    position: absolute;

    top: 15px;

    left: 50%;

    transform: translateX(-50%);

    margin: 0 !important;

    background-image: url('https://jdiascooperage.pt/wp-content/uploads/2026/01/white-full.png');

    background-repeat: no-repeat;

    background-position: center;

    background-size: contain;

    z-index: 100;

    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);

}



/* 6. DISTRIBUIÇÃO E CENTRAGEM VERTICAL */

nav#site-navigation .menu_inner_container {

    position: absolute;

    top: 0; left: 0; width: 100%; height: 75px;

    display: flex; 

    justify-content: space-evenly; 

    align-items: center; /* Centra verticalmente tudo o que está lá dentro */

    opacity: 0; visibility: hidden;

    transform: translateY(-15px);

    transition: all 0.4s ease 0s;

}



nav#site-navigation .menu_inner_container ul.menu_inner_ul {

    display: flex !important;

    width: 100% !important;

    max-width: 100%; /* Altera este valor para o menu abrir mais ou menos para as pontas */

    margin: 0 auto !important;

    padding: 0 !important;

    list-style: none !important;

    align-items: center; /* Garante que a lista está centrada */

}



nav#site-navigation .menu_inner_container ul.menu_inner_ul > li {

    flex: auto;

    display: flex;

    align-items: center; /* Centra o texto da li verticalmente */

	margin: 0 !important;
	
	padding: 0 5% 0 5%;

    position: relative;

}



/* --- CONTROLO DE POSIÇÃO EXATA --- */



/* Lado Esquerdo: Texto encosta à direita (direção ao logo) */

nav#site-navigation .menu_inner_container ul.menu_inner_ul > li:nth-child(-n+2) {

    justify-content: flex-end;

}



/* Lado Direito: Texto encosta à esquerda (direção ao logo) */

nav#site-navigation .menu_inner_container ul.menu_inner_ul > li:nth-child(n+3) {

    justify-content: flex-start;

}



/* ESPAÇO DO LOGO: Controla a distância exata dos tópicos centrais ao círculo */

nav#site-navigation .menu_inner_container ul.menu_inner_ul > li:nth-child(2) { 

    margin-right: 150px !important; /* Aumenta para afastar o texto do logo */

}

nav#site-navigation .menu_inner_container ul.menu_inner_ul > li:nth-child(3) { 

    margin-left: 150px !important; /* Mantém igual ao de cima para simetria */

}


/* 7. ESTÉTICA DO TEXTO (Refinada) */
nav#site-navigation .menu_inner_container ul.menu_inner_ul > li a {
    color: #c6a664;
    font-family: 'Cinzel', serif;
    font-size: 13px;
    letter-spacing: 5px;
    text-transform: uppercase;
    font-weight: 600;
    transition: 0.3s;
    text-decoration: none;
    line-height: 1; /* Evita que o texto "caia" para baixo */
}

nav#site-navigation .menu_inner_container ul.menu_inner_ul > li a:hover {
    color: #fff;
    letter-spacing: 6px; /* O texto "expande" ligeiramente no hover */
    text-shadow: 0 0 10px rgba(198, 166, 100, 0.4);
}

/* 8. TEXTO "EXPLORE" MULTI-LÍNGUA */
nav#site-navigation::after {
    content: "E X P L O R E"; /* Default (serve para Inglês e fallback) */
    position: absolute;
    top: 205px;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    font-size: 12px;
    letter-spacing: 8px;
    font-family: 'Cinzel', serif;
    transition: 0.5s;
    opacity: 0.7;
}

/* Traduções Específicas */

/* Português (apanha pt-PT e pt-BR) */
html[lang*="pt"] nav#site-navigation::after { 
    content: "E X P L O R A R"; 
}

/* Francês */
html[lang*="fr"] nav#site-navigation::after { 
    content: "E X P L O R E R"; 
}

/* Espanhol (NOVO) */
html[lang*="es"] nav#site-navigation::after { 
    content: "E X P L O R A R"; 
}
/* 9. INTERAÇÕES */
nav#site-navigation:hover::before { top: 0; }

nav#site-navigation:hover .logo {
    transform: translateX(-50%) scale(1);
    margin-top: 05px;
    background-image: url('https://jdiascooperage.pt/wp-content/uploads/2026/01/gold.png');
}

nav#site-navigation:hover .menu_inner_container {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

nav#site-navigation:hover::after { opacity: 0; transform: translateX(-50%)}


/*

 * Homepage

 */

ul#supersized {
    display: none;
    z-index: -1 !important; /* Força o vídeo para trás do texto */
    position: fixed !important; /* Garante que não mexe */
}

/*

 * page

 */

/* ============================================================
   JDIAIS - INDUSTRIAL LUXURY (INTERNAL PAGES ONLY)
   ============================================================ */

/* --- 2. FUNDO E ESTRUTURA (PROTEGIDO DA HOMEPAGE) --- */

/* O seletor ":not(.home)" garante que isto só acontece nas páginas de dentro */
body:not(.home), 
body:not(.home) #page {
    background-color: #f9f9f9 !important; /* Cinza "Pedra" muito claro */
}

/* Fundo do Topo (Header) */
body:not(.home) div#page_nav_background {
    width: 100%;
    height: 550px;
    position: absolute;
    top: 0;
    z-index: -1;
    /* Gradiente suave estilo aço escovado claro */
    background: linear-gradient(to bottom, #eeeeee 0%, #f9f9f9 100%);
    border-bottom: 1px solid #e0e0e0;
}

/* --- 3. MENU DE NAVEGAÇÃO "INDUSTRIAL" --- */
body:not(.home) nav#top_items_nav {
    width: 100%;
    text-align: center;
    /* Padding calibrado para o logo não tapar o menu */
    padding: 280px 0 80px 0 !important; 
    max-width: 100%;
    display: block !important;
    position: relative;
	justify-content: space-evenly;
}

/* Título "INSIDE J.DIAS" (A "Etiqueta" Industrial) */
body:not(.home) nav#top_items_nav div#top_items_title {
    display: block !important;
    font-family: 'Cinzel', serif;
    font-size: 10px;
    letter-spacing: 6px; /* Muito espaçado */
    text-transform: uppercase;
    color: #888;
    margin-bottom: 25px;
    font-weight: 700;
	text-align: center;
    position: relative;
}

/* Linha decorativa atrás do "Inside J.Dias" */
body:not(.home) nav#top_items_nav div#top_items_title::after {
    content: '';
    display: block;
    width: 40px;
    height: 1px;
    background: #c6a664;
    margin: 10px auto 0;
}

/* O CONTENTOR DOS BOTÕES */
body:not(.home) nav#top_items_nav {
    /* Barra superior e inferior finas */
    border-bottom: 1px solid rgba(0,0,0,0.05);
}

/* OS BOTÕES INDIVIDUAIS */
body:not(.home) nav#top_items_nav div.top_nav_item {
    display: inline-block;
    background: transparent;
    border: none;
    margin: 0; /* Margem a 0 para colarem uns aos outros */
    padding: 0 25px; /* Espaço interno */
    box-shadow: none;
    vertical-align: middle;
    /* O TOQUE INDUSTRIAL: Linhas divisórias verticais */
    border-right: 1px solid #e0e0e0; 
}

/* Remover a linha do último item */
body:not(.home) nav#top_items_nav div.top_nav_item:last-child {
    border-right: none;
}

/* Texto dos Botões */
body:not(.home) nav#top_items_nav div.top_nav_item a {
    display: block;
    font-family: 'Cinzel', serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    color: #555; /* Cinza Metal */
    text-transform: uppercase;
    text-decoration: none;
    padding: 10px 0;
    transition: all 0.3s ease;
    position: relative;
}

/* Efeito Hover (Texto Dourado) */
body:not(.home) nav#top_items_nav div.top_nav_item a:hover,
body:not(.home) nav#top_items_nav div.top_nav_item.no-color-spect.current-menu-item a {
    color: #c6a664 !important;
    background: transparent !important;
}


/* --- 4. TÍTULO PRINCIPAL (HISTORY & PHILOSOPHY) --- */
body:not(.home) article.page_simple.no_nav {
    margin-top: 60px !important;
    padding-bottom: 80px;
}

body:not(.home) article.page_simple.no_nav .entry-title,
body:not(.home) div.the_content h2 {
    font-family: 'Cinzel', serif !important;
    text-align: center; /* Centrado para combinar com o menu */
    font-size: 2.8em !important;
    color: #c6a664 !important;
    margin-bottom: 50px;
    letter-spacing: 4px;
    font-weight: 500;
    line-height: 1.2;
    text-transform: uppercase;
}

/* --- 5. CORPO DE TEXTO (Editorial Limpo) --- */
body:not(.home) article.page_simple div.entry-content {
    font-family: 'Lora', serif !important;
    color: #333;
    font-size: 17px;
    line-height: 2em; /* Espaço generoso */
    font-weight: 400;
    
    /* A MELHOR LEITURA: Alinhado à esquerda numa coluna central */
    text-align: left; 
    max-width: 850px; /* Coluna estreita = leitura de luxo */
    margin: 0 auto; /* Centrar a coluna */
    padding: 0 20px;
}

/* Capitular (Drop Cap) */
body:not(.home) article.page_simple div.entry-content > p:first-of-type::first-letter {
    font-family: 'Cinzel', serif;
    font-size: 4.5em;
    float: left;
    line-height: 0.8;
    margin-right: 15px;
    margin-top: 8px;
    color: #c6a664;
}

/* Imagens */
body:not(.home) article.page_simple div.col-sm-4 img {
    box-shadow: 0 15px 30px rgba(0,0,0,0.1);
    border: 1px solid #eee; /* Moldura fina */
    padding: 5px; /* Efeito passe-partout */
    background: #fff;
}

/* --- 6. RESPONSIVO (TELEMÓVEL) --- */
@media (max-width: 1280px) {
    body:not(.home) nav#top_items_nav {
        padding-top: 50px !important;
        border-bottom: none;
    }
    body:not(.home) nav#top_items_nav div.top_nav_item {
        display: block;
        border-right: none;
        border-bottom: 1px solid #eee;
        margin: 0 auto;
        width: 80%;
    }
    body:not(.home) article.page_simple.no_nav .entry-title {
        font-size: 2em !important;
    }
}


/*

 * Product Range

 */

article.page_simple h1.product_title {	color: #bd7d07;	font-weight: normal;	text-transform: uppercase;	font-size: 2em;	margin-top: 0;}
div#banner-slide.product_slider ul.bjqs li.bjqs-slide a img {	margin: 0 auto;}
div#banner-slide.product_slider ul.bjqs-controls li.bjqs-next a,
div#banner-slide.product_slider ul.bjqs-controls li.bjqs-prev a {
	text-indent: -999999px;
	width: 55px;
	height: 55px;
	margin-top: 0;
	top: 36% !important;
}

/*.postid-138 div#banner-slide.product_slider ul.bjqs-controls li.bjqs-next a, .postid-136 div#banner-slide.product_slider ul.bjqs-controls li.bjqs-next a, .postid-131 div#banner-slide.product_slider ul.bjqs-controls li.bjqs-next a, 
.postid-138 div#banner-slide.product_slider ul.bjqs-controls li.bjqs-prev a, .postid-136 div#banner-slide.product_slider ul.bjqs-controls li.bjqs-prev a, .postid-131 div#banner-slide.product_slider ul.bjqs-controls li.bjqs-prev a {
	margin-top: -80px;
}*/

div#banner-slide.product_slider ul.bjqs-controls li.bjqs-next a {
	background: rgba(227, 172, 73, .5) url('../img/arrow_white_right.png') no-repeat center center;}
div#banner-slide.product_slider ul.bjqs-controls li.bjqs-prev a {
	background: rgba(227, 172, 73, .5) url('../img/arrow_white_left.png') no-repeat center center;}
div#banner-slide.product_slider ol.bjqs-markers {display: none;}


/*



 * Services



 */


#servicos h2 {
	display: inline-block;
	font-size: 1.5em;
	color: #bd7d07;
}

#servicos div.servicos_galeria {
	padding-bottom: 20px;
	border-bottom: 3px solid #bd7d07;
}

#servicos div.servicos_galeria:last-child {
	border-bottom: 0;
}

#servicos div.servicos_galeria div.col-sm-15 {
	padding: 5px;
}

#servicos div.servicos_galeria div.col-sm-15 img {
	border: 3px solid #fff;
}


/*
 * Our Crew
 */
div.crew_member {
	padding-bottom: 25px;
	margin-bottom: 25px;
	border-bottom: 2px solid #ccc;
}

div.crew_member:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

div.crew_member h3 {
	color: #bd7d07;
	margin: 0 0 5px 0;
}

div.crew_member span {
	font-weight: 300;
	font-size: 18px;
}







div.crew_member p {



	color: #999;



	font-style: italic;



	margin-top: 10px;



}







div.crew_member a {
	color: #333;
	font-weight: bold;
}



/*
 * Contacts
 */


#contacts {
	font-size: 1em;
}

#contacts img {
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}



#contacts div.entry-content {
	margin-top: 2%;
}

#contacts div.entry-content div.contacts_information div.contacts_simple_information > div,
#contacts div.entry-content div.contacts_information div.contacts_emails_information > div > div {	display: table;	margin-bottom: 10px;	width: 100%;}

#contacts div.entry-content div.contacts_information div.contacts_emails_information > div {	width: 100%;}

#contacts div.entry-content div.contacts_information div.contacts_emails_information > div h5 { font-size: 12px; }

#contacts div.entry-content div.contacts_information div.contacts_simple_information div div,
#contacts div.entry-content div.contacts_information div.contacts_emails_information div div div {	display: table-cell;	vertical-align: middle;}


#contacts div.entry-content div.contacts_information div.contacts_emails_information div div div a {font-size: .8em;color: #000;}

#contacts div.entry-content div.contacts_information div.contacts_simple_information div div:first-child {	width: 51px;}

#contacts div.entry-content div.contacts_information div.contacts_emails_information div div div:first-child {	width: 10px;}

#contacts div.entry-content div.contacts_information div.contacts_simple_information div div:last-child,
#contacts div.entry-content div.contacts_information div.contacts_emails_information div div div:last-child {	background: #fff;	padding-left: 10px;}

#contacts div.entry-content div.google_maps {	width: 100%;	height: 300px;	border: #ccc solid 1px;	margin: 20px 0;}

#contact_form h3 {	text-transform: uppercase;	margin: 0 0 20px 0;}
#contact_form {	background: #e6bf7a;	padding: 25px;}

#contact_form input[type="text"],#contact_form input[type="email"],#contact_form textarea {	font-size: .9em;padding-left: 15px;	padding-right: 15px;	margin-bottom: 10px;	width: 100%;}

#contact_form span[role="alert"].wpcf7-not-valid-tip {	display: none;}

#contact_form input.wpcf7-not-valid,
#contact_form textarea.wpcf7-not-valid {
	border: 1px solid #ff0000;
}


/*

 * News

 */



div#news {}


div#news aside {	width: 100%;	padding: 0;}

div.post-show {	background: rgba(250, 250, 250, .8);	margin-top: 4%;	padding: 25px;}

div.post-list {
	display: table;
	height: 100%;
	margin-top: 25px;
	margin-bottom: 0;
}


div.post-list div.post-list-image {
	display: table-cell;
	vertical-align: top;
	width: 24%;
	padding-right: 1%;
}


div.post-list div.post-list-image img {
	border: 2px solid #fff;
	width: 100%;
}

div.post-list header.post-header {
	width: 75%;
	display: table-cell;
	vertical-align: middle;
	background: #fff;
	-webkit-box-shadow: 0px 6px 6px -4px rgba(100, 100, 100, 0.5);
	-moz-box-shadow:    0px 6px 6px -4px rgba(100, 100, 100, 0.5);
	box-shadow:         0px 6px 6px -4px rgba(100, 100, 100, 0.5);
}


div.post-list header div.inner_content_header {
	width: 100%;
	padding: 0 15px;
}



div.post-show div.news_top_line,
div.post-list div.news_top_line {
	width: 15%;
	height: 8px;
	background: rgb(227, 172, 72);
	position: absolute;
	left: 0;
	top: 0;
}


div.post-list div.news_top_line {

	left: 24%;

}



div.post-list div.post-meta {

	color: #999;

	font-size: .6em;

	margin-top: 10px;

}



div.post-show h2.post-title,

div.post-list h2.post-title {

	margin-top: 0;

}



div.post-show h2.post-title a,
div.post-list h2.post-title a {
	text-transform: uppercase;
	color: #bd7d07;}

div.post-show h2.post-title a:hover,
div.post-list h2.post-title a:hover {
	color: #333; 
	text-decoration: none;}



div.post-list h2.post-title {
	font-size: .7em;
	line-height: 1.2em;
	font-weight: 300;
	/*height: 45px;
	overflow: hidden;
	display: block;
	position: relative;*/
}

div.post-list h2.post-title a {
	overflow: hidden;
	line-height: 1;
}

div.post-list h2.post-title a:after {
	content: '...';
	position: absolute;
	display: block;
	width: 100%;
	height: 1em;
	bottom: 0px;
	left: 0px;
}

div.post-list h2.post-title a:before {
	content: '...';
	text-align: right;
	position: absolute;
	display: block;
	width: 2em;
	height: 1em;
	bottom: 1em;
	right: 20px;
}



div.post-show div.post-content img {
	margin-bottom: 15px;
}


div#categorias {
	background: rgb(227, 172, 72);
	padding: 15px;
	margin-top: 25px;
}



div#categorias h3 {
	color: #fff;
	text-transform: uppercase;
	font-size: 1.2em;
	margin-top: 0;
	padding-bottom: 10px;
	border-bottom: 1px solid #fff;
	display: none;
	font-weight: 800;
}


div#categorias ul {
	list-style: none;
	margin: 0;
	padding: 0;
}


div#categorias li {
	display: inline-block;
	margin-right: 15px;
}


div#categorias li:last-child {

	margin-right: 0;

}



div#categorias li a {

	color: #fff;

	text-transform: uppercase;

}



div#ultimas-noticias {

	text-align: center;

	margin-top: 25px;

	display: none;

}


div#ultimas-noticias h3 {
	margin-top: 0;
	font-size: 1.3em;
	font-weight: bold;
	text-transform: uppercase;
}


div#ultimas-noticias ul {
	background: rgba(250, 250, 250, .9);
	padding: 15px;
	margin: 15px 0 0 0;
	list-style: none;
	text-align: left;
	-webkit-box-shadow: 1px 2px 5px -1px rgba(50, 50, 50, 0.75);
	-moz-box-shadow:    1px 2px 5px -1px rgba(50, 50, 50, 0.75);
	box-shadow:         1px 2px 5px -1px rgba(50, 50, 50, 0.75);
}


div#ultimas-noticias li {
	padding: 5px 0;
	border-bottom: 1px solid rgb(189, 125, 7);
}


div#ultimas-noticias li:last-child {
	border-bottom: 0;
}


div#ultimas-noticias li a {
	color: #000;
	text-transform: uppercase;
}

div#ultimas-noticias li a:hover {
	color: rgb(189, 125, 7);
	text-decoration: none;
}





/*

 * Footer

 */



footer#colophon {

	height: 30px;

	background: #fff;

	position: fixed;

	width: 100%;

	bottom: 0;

	-webkit-box-shadow: 0px -4px 19px 0px rgba(50, 50, 50, 0.5);

	-moz-box-shadow:    0px -4px 19px 0px rgba(50, 50, 50, 0.5);

	box-shadow:         0px -4px 19px 0px rgba(50, 50, 50, 0.5);

	display: none;

}



footer#colophon div {

	display: inline-block;

	height: 100%;

	line-height: 30px;

	color: #333;

}



footer#colophon div#languages {

	padding-left: 10px;

}



footer#colophon div#languages a {

	font-size: .875em;

	color: #333;

}



footer#colophon div#languages a:hover {

	text-decoration: none;

}



footer#colophon div#social {

	padding-right: 10px;

}



footer#colophon div#social a {

	display: inline-block;

	height: 100%;

	line-height: 30px;

}



#contacts_footer {
	position: fixed;
	background: url('../img/contacts.png') no-repeat;
	background-size: cover;
	bottom: 30px;
	right: 0;
	width: 150px;
	height: 36px;
	padding: 12px 0 0 57px;
	display: none;

}



#contacts_footer a {
	color: #111;
	font-weight: 600;
	text-decoration: none;
	text-transform: uppercase;
}

#contacts_footer a:hover {
	color: #fff;
	font-weight: 600;
	text-decoration: none;
}



/*

 * Responsive

 */


/* ============================================================
   JDIAIS - MOBILE LUXURY NAVIGATION
   ============================================================ */

/* 1. Esconder o Menu Desktop em Telas Menores que 1024px */
@media screen and (max-width: 1280px) {
    nav#site-navigation {
        display: none !important;
    }
    
	nav#site-navigation {
        display: block !important;
        position: absolute;
        top: 10px; /* Distância do topo */
        
        /* O CÓDIGO PARA CENTRAR PERFEITAMENTE: */
        left: 50%;
        transform: translateX(-50%);
        
        z-index: 9990;
        width: auto;
        padding: 0;
        border: none;
        background: transparent;
    }
	
	nav#site-navigation {
        display: block !important;
        height: 25px;
        width: auto;
        
  
        content: url('https://jdiascooperage.pt/wp-content/uploads/2026/01/white-full.png');
    }
	
/* ============================================================
   MOBILE: LOGO PRETO NAS PÁGINAS INTERNAS
   ============================================================ */

	
    /* Mostrar o Trigger Mobile */
    #mobile-menu-trigger {
        display: flex !important;
    }
}

/* 2. Botão Hambúrguer (Fixo no Topo) */
#mobile-menu-trigger {
    display: none; /* Escondido em desktop */
    position: fixed;
    top: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    background: #080808;
    border: 1px solid #c6a664;
    border-radius: 50%;
    z-index: 10000;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 5px 15px rgba(0,0,0,0.8);
    transition: all 0.3s ease;
}

#mobile-menu-trigger span {
    display: block;
    width: 20px;
    height: 2px;
    background: #c6a664;
    position: relative;
    transition: all 0.3s ease;
}

#mobile-menu-trigger span::before,
#mobile-menu-trigger span::after {
    content: '';
    position: absolute;
    width: 20px;
    height: 2px;
    background: #c6a664;
    transition: all 0.3s ease;
}

#mobile-menu-trigger span::before { top: -6px; }
#mobile-menu-trigger span::after { top: 6px; }

/* Animação do Botão quando aberto */
#mobile-menu-trigger.is-active span { background: transparent; }
#mobile-menu-trigger.is-active span::before { top: 0; transform: rotate(45deg); }
#mobile-menu-trigger.is-active span::after { top: 0; transform: rotate(-45deg); }

/* 3. O Overlay (O Menu em Si) */
#jd-mobile-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: linear-gradient(180deg, #080808 0%, #1a1a1a 100%);
    z-index: 9999;
    padding: 80px 20px 40px; /* Espaço para não bater no botão fechar */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; /* Centra tudo verticalmente */
    
    /* Estado Inicial: Escondido lá em cima */
    opacity: 0;
    visibility: hidden;
    transform: translateY(-100%);
    transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1);
}

#jd-mobile-overlay.is-open {
    opacity: 0.95;
    visibility: visible;
    transform: translateY(0);
}

/* 4. Links do Menu Mobile */
#jd-mobile-menu-list {
    list-style: none;
    padding: 0;
    margin: 0 0 30px 0;
    text-align: center;
    width: 100%;
}

#jd-mobile-menu-list li {
    margin-bottom: 20px;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.4s ease;
}

/* Efeito cascata na entrada dos itens */
#jd-mobile-overlay.is-open #jd-mobile-menu-list li:nth-child(1) { transition-delay: 0.1s; opacity: 1; transform: translateY(0); }
#jd-mobile-overlay.is-open #jd-mobile-menu-list li:nth-child(2) { transition-delay: 0.2s; opacity: 1; transform: translateY(0); }
#jd-mobile-overlay.is-open #jd-mobile-menu-list li:nth-child(3) { transition-delay: 0.3s; opacity: 1; transform: translateY(0); }
#jd-mobile-overlay.is-open #jd-mobile-menu-list li:nth-child(4) { transition-delay: 0.4s; opacity: 1; transform: translateY(0); }
#jd-mobile-overlay.is-open #jd-mobile-menu-list li:nth-child(5) { transition-delay: 0.5s; opacity: 1; transform: translateY(0); }


#jd-mobile-menu-list li a {
    font-family: 'Cinzel', serif;
    font-size: 18px;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 4px;
    text-decoration: none;
    display: block;
    padding: 10px;
    border-bottom: 1px solid rgba(198, 166, 100, 0.1); /* Linha subtil separadora */
}

#jd-mobile-menu-list li a:hover {
    color: #c6a664;
    letter-spacing: 6px;
}

/* 5. Área das Linguas (Mobile) */
.mobile-langs {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-bottom: 20px; /* Espaço até ao logo */
}

/* Reaproveita o estilo das bandeiras do footer, mas ajusta tamanhos */
.mobile-langs .flag-circle {
    width: 45px;
    height: 45px;
    border: 2px solid #c6a664;
    margin: 0;
}

/* 6. O Logo Dourado com Link */
.mobile-bottom-logo-link {
    display: block;
    text-decoration: none !important;
    margin: 20px auto 40px auto; /* Centra o link e dá o espaçamento que querias */
    width: 80px; /* Largura igual ao logo */
}

.mobile-bottom-logo {
    display: block;
    width: 80px;
    height: 80px;
    background-image: url('https://jdiascooperage.pt/wp-content/uploads/2026/01/gold.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.8;
    filter: drop-shadow(0 0 10px rgba(198, 166, 100, 0.3));
    transition: transform 0.3s ease, opacity 0.3s ease;
    cursor: pointer;
}

/* Efeito ao tocar no logo */
.mobile-bottom-logo:active {
    transform: scale(0.9); /* Pequeno feedback visual de clique */
    opacity: 1;
}

/* ============================================================
   MOBILE: ESCONDER LOGO NAS PÁGINAS INTERNAS
   Homepages = Logo Branco (comportamento normal)
   Outras    = Sem Logo (apenas o botão de menu fica visível)
   ============================================================ */

@media only screen and (max-width: 1280px) {
    /* Em todas as páginas que NÃO são as Homes (368, 61, 367)... */
    body:not(.page-id-368):not(.page-id-61):not(.page-id-367) nav#site-navigation {
        display: none !important; /* ...o logo desaparece totalmente */
    }
}


/*
fim menu
*/

@media (min-width: 400px) {

	#contacts div.entry-content div.contacts_information div.contacts_emails_information div div div a {

		font-size: 1em;

	}

	div.post-list div.post-meta {

		font-size: .9em;

	}

	div.post-list h2.post-title {

		font-size: 1.1em;

		line-height: 1.5em;

	}

}


@media (max-width: 600px) {

	.main-navigation ul {

		display: block;

	}

}


@media (min-width: 768px) {

	ul#supersized {

		display: block;

	}

	

	div#news_slider {
		display: block;
	}

	

	nav#top_items_nav div.top_nav_item {
		width: 19%;
		height: 75px;
	}

	
	article.page_simple div.col-sm-8 {
		float: right;
		margin-bottom: 0;
	}
	
	article.page_simple.no_nav header.entry-header.simple-page-header {
		top: 0;
	}

	article section {
		padding: 0 0;
	}
	
	#contacts div.entry-content div.contacts_information {
		padding-right: 15px;
	}
	
	#contacts div.entry-content div.contacts_information div.contacts_simple_information div.col-sm-6 {
		width: 50%;
	}
	
	#contacts div.entry-content div.contacts_information div.contacts_emails_information div div div a {
		font-size: .8em;
	}
	
	#contact_form input[name="nome"] {
		width: 64.66666667%;
		margin-right: 2%;
	}

	#contact_form input[name="telefone"] {

		width: 33.33333333%;

	}

	

	#contact_form input[name="email"] {

		width: 48%;

		margin-right: 2%;

	}

	

	#contact_form input[name="empresa"] {

		width: 50%;

	}

	

	div#news aside {
		width: 33.33333333%;
		padding-left: 15px;
		padding-right: 15px;
	}

	

	div#categorias {

		background: rgba(189, 125, 7, .7);
		border: 2px solid #fff;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		border-radius: 2px;
		-webkit-box-shadow: 1px 2px 5px -1px rgba(50, 50, 50, 0.75);
		-moz-box-shadow:    1px 2px 5px -1px rgba(50, 50, 50, 0.75);
		box-shadow:         1px 2px 5px -1px rgba(50, 50, 50, 0.75);

	}

	
	div#categorias h3 {
		display: inline-block;
	}

	
	div#categorias li {
		padding-left: 26px;
		text-indent: -25px;
		margin-right: 0;
		display: block;
	}
	
	div#categorias li:before {
		content: "○ ";
		color: #fff;
	}

	
	div#categorias li a {
		color: #000;
	}
		div#categorias li a:hover {
			text-decoration: none;
			color: #fff;
	}

	
	div#ultimas-noticias {
		display: block;
	}

	
	div#contacts_footer,
	footer#colophon {
		display: block;

	}

}



@media (min-width: 992px) {

	#contacts div.entry-content div.contacts_information div.contacts_emails_information div div div a {font-size: 1em;	}
	.postid-131 article section {height:453px;}

}



@media (min-width: 1200px) {
	/*.postid-138 article section, .postid-136 article section {	height: 264px;	}*/
	.postid-131 article section {height: 377px;}

    

}



@media (min-width: 1300px) {


	/*.postid-138 article section, .postid-136 article section {	height: 264px;	}*/
	.postid-131 article section {height: 359px;}


    #contacts div.entry-content div.contacts_information div.contacts_emails_information div div div a {

		font-size: .8em;

	}

	#contacts div.entry-content div.contacts_information div.contacts_emails_information > div {

		width: 50%;

	}

	div.post-list div.post-meta {

		font-size: 1.1em;

	}

	div.post-list h2.post-title {

		font-size: 1.6em;

		line-height: 1.5em;

	}

	

	div.post-list header.post-header {

		vertical-align: top;

	}

	

	div.post-list div.post-meta {

		margin-top: 15px;

	}

}


@media (min-width: 1450px) {

	/*.postid-138 article section, .postid-136 article section {	height: 264px;	}*/
	.postid-131 article section {height: 310px;}

}


/*

 * Bootstrap 5 Column Layout

*/



.col-xs-15,

.col-sm-15,

.col-md-15,

.col-lg-15 {

    position: relative;

    min-height: 1px;

    padding-right: 10px;

    padding-left: 10px;

}



.col-xs-15 {

    width: 20%;

    float: left;

}

@media (min-width: 768px) {

.col-sm-15 {

        width: 20%;

        float: left;

    }

}

@media (min-width: 992px) {

    .col-md-15 {

        width: 20%;

        float: left;

    }

}

@media (min-width: 1200px) {

    .col-lg-15 {

        width: 20%;

        float: left;

    }

}

/* 3. PORTÁTEIS E TABLETS (Onde estava a ficar cinzento e cortado) */
@media (max-width: 1100px) {
    div#top_slogan span {
        font-size: 3rem !important; /* Texto ligeiramente menor */
        line-height: 1.3em;
    }
    
    /* Ajusta as linhas douradas */
    div#top_slogan::before,
    div#top_slogan::after {
        width: 80px !important;
        margin: 15px auto !important;
    }
}

/* 4. TELEMÓVEIS (Ajuste final) */
@media (max-width: 600px) {
    div#top_slogan span {
        font-size: 2,5rem !important; 
    }
}

/* 5. OVERRIDE BRUTAL PARA ECRÃS BAIXOS (Remove o quadrado cinzento #333) */
@media (max-height: 625px) {
    div#top_slogan {
        background: transparent !important; /* Anula o cinzento antigo */
        position: relative !important;
        top: auto !important;
    }
}

/* ============================================================
   SOLUÇÃO CORRIGIDA (COM HOVER A FUNCIONAR)
   ============================================================ */

/* ------------------------------------------------------------
   CENÁRIO 1: PÁGINAS INTERNAS (O Padrão)
   (Aplica-se a tudo o que NÃO É a Homepage)
   ------------------------------------------------------------ */
body:not(.home) nav#site-navigation::before {
    top: 0 !important; /* Barra sempre em baixo */
}
body:not(.home) nav#site-navigation .logo {
    background-image: url('https://jdiascooperage.pt/wp-content/uploads/2026/01/gold.png') !important;
    transform: translateX(-50%) scale(1) !important;
    margin-top: 0px !important;
}
body:not(.home) nav#site-navigation .menu_inner_container {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}
body:not(.home) nav#site-navigation::after {
    display: none !important; /* Esconde o EXPLORE */
}

/* ------------------------------------------------------------
   CENÁRIO 2: HOMEPAGE - ESTADO NORMAL (Sem rato em cima)
   (Aqui forçamos a fechar, usar logo branco e mostrar EXPLORE)
   ------------------------------------------------------------ */
body.home nav#site-navigation::before {
    top: -450px !important; /* Barra recolhida */
    transition: top 0.5s ease; /* Suaviza a animação */
}
body.home nav#site-navigation .logo {
    background-image: url('https://jdiascooperage.pt/wp-content/uploads/2026/01/white-full.png') !important;
    transform: translateX(-50%);
    margin-top: 15px !important;
    transition: all 0.3s ease;
}
body.home nav#site-navigation .menu_inner_container {
    opacity: 0;
    visibility: hidden;
}
body.home nav#site-navigation::after {
    display: block !important; /* Mostra o EXPLORE */
    /* Garante que o texto volta se tirares o rato */
}

/* ------------------------------------------------------------
   CENÁRIO 3: HOMEPAGE - AO PASSAR O RATO (HOVER)
   (Isto foi o que faltou antes! Reverte para o estilo Dourado)
   ------------------------------------------------------------ */
/* 1. Baixar a barra */
body.home nav#site-navigation:hover::before {
    top: 0 !important; 
}

/* 2. Logo volta a Dourado */
body.home nav#site-navigation:hover .logo {
    background-image: url('https://jdiascooperage.pt/wp-content/uploads/2026/01/gold.png') !important;
    margin-top: 0px !important;
    transform: translateX(-50%) scale(1) !important;
}

/* 3. Mostrar os Links */
body.home nav#site-navigation:hover .menu_inner_container {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

/* 4. Esconder o EXPLORE */
body.home nav#site-navigation:hover::after {
    display: none !important;
}