/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jan 20 2026 | 10:43:55 */
/**
 * ==================================================================================
 * 🛑 MANUAL DE OPERAÇÕES: PORTFÓLIO (HOME)
 * ==================================================================================
 * @description Portfolio System (Responsive Control Edition)
 * @version 17.0.0
 * @date 2026-01-20
 *
 * 1️⃣ ESTRUTURA DO ELEMENTOR (LOOP ITEM)
 * ----------------------------------------------------------------------------------
 * A. CONTENTOR PAI (.leuk-port-card) -> Padding: 0px | Link: Post URL
 * B. IMAGEM (.leuk-port-img) -> Tamanho: Full | Posição: Absoluto
 * C. TÍTULO (.leuk-port-title) -> Tag: H3
 * D. EXCERTO (.leuk-port-excerpt)
 *
 * 2️⃣ COMO CONFIGURAR RESPONSIVIDADE
 * ----------------------------------------------------------------------------------
 * Edite os valores no PAINEL DE CONTROLO abaixo.
 * Existem 3 secções: DESKTOP, TABLET e MOBILE.
 * O sistema assume automaticamente os valores corretos conforme o ecrã.
 * ==================================================================================
 */

/* ============================================================
   ⚙️ PAINEL DE CONTROLO (CONFIGURAÇÕES)
   ============================================================ */
:root {
    /* ------------------------------------------------------
       💻 DESKTOP (Padrão)
       ------------------------------------------------------ */
    --leuk-card-height: 550px; 

    /* Cores das Etiquetas */
    --leuk-title-bg: rgba(255, 255, 255, 0.9);        
    --leuk-excerpt-bg: rgba(255, 255, 255, 0.9);      
    --leuk-inner-pad: 8px 10px; /* Padding dentro da etiqueta */

    /* Posicionamento TÍTULO (Desktop) */
    --leuk-title-left: 80px;     
    --leuk-title-right: 60px;    
    --leuk-title-bottom: 10px;   

    /* Posicionamento EXCERTO (Desktop) */
    --leuk-excerpt-left: 80px;    
    --leuk-excerpt-right: 60px;   
    --leuk-excerpt-bottom: 60px; 
}

/* ----------------------------------------------------------
   📱 TABLET (Ecrãs até 1024px)
   ---------------------------------------------------------- */
@media (max-width: 1024px) {
    :root {
        --leuk-card-height: 500px; /* Cartão ligeiramente menor */
        
        /* Reduzimos as margens laterais */
        --leuk-title-left: 40px;     
        --leuk-title-right: 40px;    
        
        --leuk-excerpt-left: 40px;    
        --leuk-excerpt-right: 40px;
        --leuk-excerpt-bottom: 40px; 
    }
}

/* ----------------------------------------------------------
   📲 MOBILE (Ecrãs até 767px)
   ---------------------------------------------------------- */
@media (max-width: 767px) {
    :root {
        --leuk-card-height: 450px; /* Altura ideal para telemóvel */
        
        /* Margens mais apertadas para aproveitar o ecrã */
        --leuk-title-left: 20px;     
        --leuk-title-right: 20px;    
        --leuk-title-bottom: 5px;
        
        --leuk-excerpt-left: 20px;    
        --leuk-excerpt-right: 20px;
        --leuk-excerpt-bottom: 20px; 
    }
}

/* ============================================================
   ⛔ NÃO EDITAR ABAIXO (LÓGICA DO SISTEMA)
   ============================================================ */

/* A. O CARTÃO (Contentor Pai) */
.leuk-port-card {
    position: relative;
    width: 100%;
    height: var(--leuk-card-height); 
    overflow: hidden;
    cursor: pointer;
    background: transparent !important;
    border: none !important;
    padding: 0 !important; 
    
    display: flex;
    flex-direction: column;
    justify-content: flex-end; 
    align-items: flex-start;
    isolation: isolate;
}

/* B. A IMAGEM (Full Bleed & Fixed Height) */
.leuk-port-img {
    position: absolute !important;
    top: 0; left: 0; right: 0; bottom: 0;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important; padding: 0 !important;
    z-index: 0;
    pointer-events: none;
}

.leuk-port-img .elementor-widget-container,
.leuk-port-img .elementor-image {
    width: 100% !important; height: 100% !important; display: block;
}

.leuk-port-img img {
    width: 100% !important; height: 100% !important;
    object-fit: cover !important; object-position: center center;
    max-width: none !important; min-height: 100% !important;
    display: block; border: none !important; transition: none;
}

/* C. O TÍTULO (Etiqueta) */
.leuk-port-title {
    z-index: 2;
    pointer-events: none;
    width: auto !important;
    max-width: calc(100% - var(--leuk-title-right));
    
    /* Aplica as variáveis responsivas */
    margin-top: 0 !important;
    margin-left: var(--leuk-title-left) !important;
    margin-right: var(--leuk-title-right) !important;
    margin-bottom: var(--leuk-title-bottom) !important;
}

.leuk-port-title .elementor-heading-title {
    background-color: var(--leuk-title-bg);
    padding: var(--leuk-inner-pad);
    display: inline; 
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    line-height: 1.5;
}

/* D. O EXCERTO (Etiqueta) */
.leuk-port-excerpt {
    z-index: 2;
    pointer-events: none;
    width: auto !important;
    max-width: calc(100% - var(--leuk-excerpt-right));
    
    /* Aplica as variáveis responsivas */
    margin-top: 0 !important;
    margin-left: var(--leuk-excerpt-left) !important;
    margin-right: var(--leuk-excerpt-right) !important;
    margin-bottom: var(--leuk-excerpt-bottom) !important;
}

.leuk-port-excerpt .elementor-widget-container {
    background-color: var(--leuk-excerpt-bg);
    padding: var(--leuk-inner-pad);
    display: inline-block;
}

.leuk-port-excerpt p {
    margin: 0;
}