/*
 * Theme Name:   Hello Elementor Child
 * Theme URI:    https://elosbensevalores.com.br
 * Description:  Tema filho do Hello Elementor para ELOS Bens e Valores - Consultoria de Investimentos
 * Author:       Daniel Cambria
 * Author URI:   https://bureau.it
 * Template:     hello-elementor
 * Version:      1.3.0
 * License:      GNU General Public License v2 or later
 * License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain:  hello-elementor-child
 *
 * ============================================================================
 * IMPORTANTE - REGRAS BUREAU IT (ELEMENTOR-RULES.md)
 * ============================================================================
 *
 * 1. USAR ELEMENTOR para: cores, tipografia, espaçamentos, alinhamentos,
 *    responsivo, imagens, botões, efeitos simples (hover opacity, scale)
 *
 * 2. USAR ESTE ARQUIVO para: pseudo-elementos (::before, ::after),
 *    animações @keyframes, seletores avançados (:nth-child, :has),
 *    classes globais reutilizáveis, overrides de plugins
 *
 * 3. NUNCA USAR: campo "CSS personalizado" do Elementor, CSS inline
 *
 * 4. PREFIXO: Classes customizadas usam prefixo .bit-* ou .elos-*
 *
 * ============================================================================
 */

/* ==========================================================================
   1. CSS VARIABLES - Design System ELOS
   Adicionado: 2024-12-29
   ========================================================================== */

:root {
    /* ----------------------------------------
       Cores Principais (do InDesign)
       ---------------------------------------- */
    --elos-navy: #20303b;
    --elos-orange: #e3824a;
    --elos-cream: #faf5ed;
    --elos-white: #ffffff;
    --elos-black: #000000;
    
    /* ----------------------------------------
       Cores Auxiliares
       ---------------------------------------- */
    --elos-gray-light: #f8f8f8;
    --elos-gray: #666666;
    --elos-navy-light: rgba(32, 48, 59, 0.8);
    --elos-navy-dark: #1a252e;
    --elos-orange-hover: #d4704a;
    
    /* ----------------------------------------
       Transparências
       ---------------------------------------- */
    --elos-cream-10: rgba(250, 245, 237, 0.1);
    --elos-cream-30: rgba(250, 245, 237, 0.3);
    --elos-cream-50: rgba(250, 245, 237, 0.5);
    --elos-cream-60: rgba(250, 245, 237, 0.6);
    --elos-navy-10: rgba(32, 48, 59, 0.1);
    --elos-navy-20: rgba(32, 48, 59, 0.2);
    
    /* ----------------------------------------
       Fontes
       ---------------------------------------- */
    --font-primary: 'Ofelia Display', 'Montserrat', sans-serif;
    --font-serif: 'Minion Pro', 'Times New Roman', Georgia, serif;
    
    /* ----------------------------------------
       Tipografia - Tamanhos
       ---------------------------------------- */
    --text-xs: 0.75rem;     /* 12px */
    --text-sm: 0.875rem;    /* 14px */
    --text-base: 1rem;      /* 16px */
    --text-lg: 1.125rem;    /* 18px */
    --text-xl: 1.25rem;     /* 20px */
    --text-2xl: 1.5rem;     /* 24px */
    --text-3xl: 2rem;       /* 32px */
    --text-4xl: 2.5rem;     /* 40px */
    --text-5xl: 3rem;       /* 48px */
    
    /* ----------------------------------------
       Espaçamentos
       ---------------------------------------- */
    --spacing-xs: 0.5rem;   /* 8px */
    --spacing-sm: 1rem;     /* 16px */
    --spacing-md: 1.5rem;   /* 24px */
    --spacing-lg: 2rem;     /* 32px */
    --spacing-xl: 3rem;     /* 48px */
    --spacing-2xl: 4rem;    /* 64px */
    --spacing-3xl: 6rem;    /* 96px */
    
    /* ----------------------------------------
       Layout
       ---------------------------------------- */
    --container-max: 1200px;
    --container-wide: 1440px;
    --header-height: 80px;
    
    /* ----------------------------------------
       Transições
       ---------------------------------------- */
    --transition-fast: 0.2s ease;
    --transition-base: 0.3s ease;
    --transition-slow: 0.5s ease;
    
    /* ----------------------------------------
       Sombras
       ---------------------------------------- */
    --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 40px rgba(0, 0, 0, 0.15);
    --shadow-orange: 0 10px 30px rgba(227, 130, 74, 0.3);
    --shadow-navy: 0 15px 40px rgba(32, 48, 59, 0.2);
    
    /* ----------------------------------------
       Bordas
       ---------------------------------------- */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 16px;
    --radius-full: 50px;
}

/* ==========================================================================
   BASE STYLES
   ========================================================================== */

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-primary);
    color: var(--elos-navy);
    background-color: var(--elos-white);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ==========================================================================
   TYPOGRAPHY UTILITIES
   ========================================================================== */

/* Font Families */
.font-primary {
    font-family: var(--font-primary) !important;
}

.font-serif {
    font-family: var(--font-serif) !important;
}

/* Text Colors */
.text-navy {
    color: var(--elos-navy) !important;
}

.text-orange {
    color: var(--elos-orange) !important;
}

.text-cream {
    color: var(--elos-cream) !important;
}

.text-white {
    color: var(--elos-white) !important;
}

/* Background Colors */
.bg-navy {
    background-color: var(--elos-navy) !important;
}

.bg-orange {
    background-color: var(--elos-orange) !important;
}

.bg-cream {
    background-color: var(--elos-cream) !important;
}

.bg-white {
    background-color: var(--elos-white) !important;
}

/* ==========================================================================
   ELEMENTOR OVERRIDES
   ========================================================================== */

/* Botões com estilo ELOS */
.elementor-button.elos-btn-primary {
    background-color: var(--elos-orange) !important;
    color: var(--elos-white) !important;
    border: none !important;
    padding: 15px 30px !important;
    font-weight: 500 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    transition: var(--transition-base) !important;
}

.elementor-button.elos-btn-primary:hover {
    background-color: var(--elos-orange-hover) !important;
    transform: translateY(-2px);
    box-shadow: var(--shadow-orange);
}

.elementor-button.elos-btn-outline {
    background-color: transparent !important;
    color: var(--elos-cream) !important;
    border: 1px solid var(--elos-cream-30) !important;
    padding: 15px 30px !important;
    transition: var(--transition-base) !important;
}

.elementor-button.elos-btn-outline:hover {
    border-color: var(--elos-orange) !important;
    background-color: var(--elos-orange) !important;
}

/* WhatsApp Button */
.elos-whatsapp-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 15px !important;
    background-color: #25D366 !important;
    color: var(--elos-white) !important;
    padding: 18px 30px !important;
    border-radius: var(--radius-full) !important;
    text-decoration: none !important;
    transition: var(--transition-base) !important;
}

.elos-whatsapp-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(37, 211, 102, 0.3);
}

/* ==========================================================================
   SECTION STYLES
   ========================================================================== */

/* Hero com overlay laranja */
.elos-hero-overlay {
    position: relative;
}

.elos-hero-overlay::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(227, 130, 74, 0.7) 0%, rgba(227, 130, 74, 0.4) 100%);
    mix-blend-mode: multiply;
    pointer-events: none;
}

.elos-hero-overlay img {
    filter: grayscale(100%);
}

/* Service Cards */
.elos-service-card {
    background-color: var(--elos-navy) !important;
    padding: 50px 40px !important;
    text-align: center !important;
    transition: var(--transition-base) !important;
}

.elos-service-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-navy);
}

.elos-service-card h3 {
    color: var(--elos-white) !important;
    font-size: 1.1rem !important;
    font-weight: 400 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    line-height: 1.5 !important;
}

/* MVP Section (Missão/Visão/Propósito) */
.elos-mvp-label {
    font-size: var(--text-4xl) !important;
    font-weight: 200 !important;
    color: var(--elos-cream) !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important;
    opacity: 0.9;
}

.elos-mvp-label-outline {
    -webkit-text-stroke: 1px var(--elos-cream);
    color: transparent !important;
}

/* Values Grid */
.elos-value-number {
    font-size: var(--text-sm) !important;
    font-weight: 700 !important;
    color: var(--elos-white) !important;
    margin-bottom: 5px !important;
}

.elos-value-title {
    font-size: var(--text-base) !important;
    font-weight: 700 !important;
    color: var(--elos-white) !important;
}

.elos-value-text {
    font-size: var(--text-sm) !important;
    font-weight: 300 !important;
    color: var(--elos-cream) !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   HEADER STYLES
   Adicionado: 2026-01-29
   ========================================================================== */

/**
 * Header fixo via CSS puro
 * Usa position: fixed para garantir funcionamento
 */
.elementor-location-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 1000 !important;
    background-color: var(--elos-navy) !important;
    transition: background-color 0.3s ease, box-shadow 0.3s ease !important;
}

/**
 * Espaçamento para compensar header fixo
 * Header altura: ~103px desktop, ~60px tablet/mobile
 */
body.elementor-page {
    padding-top: 103px !important;
}

@media (max-width: 1024px) {
    body.elementor-page {
        padding-top: 60px !important;
    }
}

/**
 * Seção apresentacao - grudada no header
 */
#apresentacao {
    margin-top: 0 !important;
}

/**
 * Header - efeito visual ao rolar
 * Classe .scrolled adicionada via JavaScript
 */
.elementor-location-header.scrolled {
    background-color: rgba(32, 48, 59, 0.98) !important;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.15) !important;
}

/**
 * Mobile/Tablet: Logo + Hamburguer na mesma linha, header compacto
 * Estrutura: 86c8bac contém [60ba826 (logo), 1c65180 (nav-menu)]
 */
@media (max-width: 1024px) {
    /* Container principal - padding compacto */
    .elementor-location-header [data-id="86c8bac"] {
        padding: 8px 20px !important;
        min-height: auto !important;
    }

    /* Inner container - flex row, alinhamento central */
    .elementor-location-header [data-id="86c8bac"] > .e-con-inner {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        min-height: auto !important;
        gap: 10px !important;
    }

    /* Forçar alinhamento vertical em todos os filhos */
    .elementor-location-header [data-id="86c8bac"] .e-con,
    .elementor-location-header [data-id="86c8bac"] .e-con-inner,
    .elementor-location-header [data-id="86c8bac"] .elementor-widget {
        display: flex !important;
        align-items: center !important;
        align-self: center !important;
    }

    /* Container do logo - compacto */
    .elementor-location-header [data-id="60ba826"],
    .elementor-location-header [data-id="60ba826"] > .e-con-inner {
        --width: auto !important;
        width: auto !important;
        flex: 0 0 auto !important;
        max-width: 150px !important;
        padding: 0 !important;
        min-height: auto !important;
    }

    /* Logo img */
    .elementor-location-header [data-id="60ba826"] img {
        max-width: 120px !important;
        height: auto !important;
    }

    /* Container do nav-menu - compacto */
    .elementor-location-header [data-id="1c65180"],
    .elementor-location-header [data-id="1c65180"] > .e-con-inner {
        --width: auto !important;
        width: auto !important;
        flex: 0 0 auto !important;
        margin-left: auto !important;
        padding: 0 !important;
        min-height: auto !important;
        height: auto !important;
    }

    /* Widget do nav-menu - forçar altura do toggle */
    .elementor-location-header .elementor-widget-nav-menu {
        padding: 0 !important;
        margin: 0 !important;
        min-height: auto !important;
        height: auto !important;
    }

    /* Nav menu wrapper */
    .elementor-location-header .elementor-nav-menu--main,
    .elementor-location-header .elementor-nav-menu__container {
        height: auto !important;
        min-height: auto !important;
    }

    /* Menu toggle - tamanho compacto */
    .elementor-location-header .elementor-menu-toggle {
        padding: 8px !important;
        min-width: 44px !important;
        min-height: 44px !important;
        height: 44px !important;
        margin: 0 !important;
    }

    /* ================================================================
       MENU LATERAL (Drawer) - Desliza da direita
       ================================================================ */

    /* Menu lateral (drawer) */
    .elementor-location-header .elementor-nav-menu--dropdown.elementor-nav-menu__container {
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        width: 260px !important;
        max-width: 75vw !important;
        height: 100vh !important;
        background-color: var(--elos-navy) !important;
        border-left: 1px solid var(--elos-orange) !important;
        border-top: none !important;
        transform: translateX(100%) !important;
        transition: transform 0.3s ease !important;
        z-index: 10000 !important;
        padding: 70px 25px 30px !important;
        overflow-y: auto !important;
        display: flex !important;
        flex-direction: column !important;
        box-shadow: -5px 0 30px rgba(0, 0, 0, 0.3) !important;
    }

    /* Menu aberto */
    .elementor-nav-menu--toggle .elementor-menu-toggle.elementor-active + .elementor-nav-menu--dropdown,
    .elementor-nav-menu--dropdown[style*="display: block"],
    .elementor-nav-menu--dropdown[style*="display:block"] {
        transform: translateX(0) !important;
    }

    /* Overlay escuro atrás do menu */
    .elementor-location-header .elementor-nav-menu--dropdown::before {
        content: '' !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 280px !important;
        bottom: 0 !important;
        background: rgba(0, 0, 0, 0.5) !important;
        z-index: -1 !important;
        opacity: 0 !important;
        transition: opacity 0.3s ease !important;
        pointer-events: none !important;
    }

    .elementor-nav-menu--toggle .elementor-menu-toggle.elementor-active + .elementor-nav-menu--dropdown::before {
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    /* Itens do menu lateral */
    .elementor-location-header .elementor-nav-menu--dropdown li {
        border-bottom: 1px solid var(--elos-cream-10) !important;
        margin: 0 !important;
    }

    .elementor-location-header .elementor-nav-menu--dropdown li a {
        padding: 18px 0 !important;
        font-size: 16px !important;
        font-weight: 400 !important;
        letter-spacing: 2px !important;
        text-transform: uppercase !important;
        color: var(--elos-cream) !important;
        display: block !important;
        transition: color 0.2s ease, padding-left 0.2s ease !important;
    }

    .elementor-location-header .elementor-nav-menu--dropdown li a:hover {
        color: var(--elos-orange) !important;
        padding-left: 10px !important;
    }

    /* Botão X para fechar (usar o toggle existente) */
    .elementor-menu-toggle.elementor-active {
        position: fixed !important;
        top: 20px !important;
        right: 20px !important;
        z-index: 10001 !important;
    }
}

.elos-nav-link {
    color: var(--elos-cream) !important;
    font-size: var(--text-sm) !important;
    font-weight: 300 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    position: relative !important;
    transition: var(--transition-base) !important;
}

.elos-nav-link::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 0;
    height: 1px;
    background: var(--elos-orange);
    transition: var(--transition-base);
}

.elos-nav-link:hover {
    color: var(--elos-orange) !important;
}

.elos-nav-link:hover::after {
    width: 100%;
}

/* ==========================================================================
   FOOTER STYLES
   ========================================================================== */

.elos-footer {
    background-color: var(--elos-navy) !important;
    border-top: 1px solid var(--elos-cream-10);
}

.elos-footer-link {
    color: var(--elos-cream) !important;
    text-decoration: none !important;
    transition: var(--transition-base) !important;
}

.elos-footer-link:hover {
    color: var(--elos-orange) !important;
}

.elos-social-icon {
    width: 32px;
    height: 32px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid var(--elos-cream-30) !important;
    border-radius: 50% !important;
    transition: var(--transition-base) !important;
}

.elos-social-icon:hover {
    border-color: var(--elos-orange) !important;
    background-color: var(--elos-orange) !important;
}

.elos-social-icon svg {
    width: 14px;
    height: 14px;
    fill: var(--elos-cream);
}

/* ==========================================================================
   FORM STYLES
   ========================================================================== */

.elos-form-input {
    padding: 15px 20px !important;
    border: 1px solid var(--elos-cream-30) !important;
    background: transparent !important;
    color: var(--elos-cream) !important;
    font-family: var(--font-primary) !important;
    font-size: var(--text-sm) !important;
    transition: var(--transition-base) !important;
}

.elos-form-input::placeholder {
    color: var(--elos-cream-50) !important;
}

.elos-form-input:focus {
    outline: none !important;
    border-color: var(--elos-orange) !important;
}

/* ==========================================================================
   ANIMATIONS - Entrada Customizada (Intersection Observer)
   ========================================================================== */

/* Estado inicial: invisível e deslocado */
.elos-animate {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s cubic-bezier(0.22, 0.61, 0.36, 1),
                transform 0.8s cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Estado final: visível e posicionado */
.elos-animate.elos-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Delays para efeito cascata */
.elos-delay-1 { transition-delay: 0.1s; }
.elos-delay-2 { transition-delay: 0.2s; }
.elos-delay-3 { transition-delay: 0.3s; }
.elos-delay-4 { transition-delay: 0.4s; }
.elos-delay-5 { transition-delay: 0.5s; }

/* Desabilitar animações se usuário prefere movimento reduzido */
@media (prefers-reduced-motion: reduce) {
    .elos-animate {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* ==========================================================================
   RESPONSIVE ADJUSTMENTS
   ========================================================================== */

@media (max-width: 1024px) {
    :root {
        --text-4xl: 2rem;
        --text-5xl: 2.5rem;
    }
}

@media (max-width: 768px) {
    :root {
        --text-3xl: 1.75rem;
        --text-4xl: 2rem;
        --text-5xl: 2.25rem;
        --spacing-xl: 2rem;
        --spacing-2xl: 3rem;
    }
}

/**
 * Cores de fundo específicas para mobile/tablet
 * Aplicadas somente em viewports <= 1024px
 */
@media (max-width: 1024px) {
    .bg-verde {
        background-color: #152F3A !important;
    }

    .bg-verdeescuro {
        background-color: #121C22 !important;
    }

    .bg-laranja {
        background-color: #E2814A !important;
    }
}

/* ==========================================================================
   6. RESPONSIVIDADE - Correções de Overflow
   Adicionado: 2026-01-29
   Identificado via: Playwright test-responsiveness.js
   ========================================================================== */

/**
 * FIX 1: Prevenir overflow horizontal global
 * Problema: Scroll horizontal indesejado em todas as viewports
 */
html,
body {
    overflow-x: hidden;
    max-width: 100vw;
}

.elementor-section,
.elementor-container,
.elementor-widget-wrap,
.e-con,
.e-con-inner {
    max-width: 100%;
}

/**
 * FIX 2: Elementos com posicionamento absoluto
 * Elementos: .elementor-element-1ddddf1 (+93px), .elementor-element-622014a (+30px)
 * Causa: Coordenadas absolutas não responsivas
 */
@media (max-width: 1024px) {
    .elementor-absolute {
        max-width: 100vw !important;
    }

    /* Elemento que ultrapassa +93px */
    .elementor-element-1ddddf1 {
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        max-width: 100vw !important;
    }

    .elementor-element-1ddddf1 img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }

    /* Elemento que ultrapassa +30px (foto ivan-rossi) */
    .elementor-element-622014a {
        left: 50% !important;
        transform: translateX(-50%) !important;
        max-width: 45vw !important;
    }

    .elementor-element-622014a img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }
}

/**
 * FIX 3: Imagens responsivas
 * Garantir que todas as imagens respeitem container
 */
img {
    max-width: 100%;
    height: auto;
}

.elementor-widget-image img,
.elementor-image img,
.elementor-absolute img {
    max-width: 100% !important;
    height: auto !important;
}

/**
 * FIX 4: Alvos de toque (mínimo 44x44px)
 * Apple Human Interface Guidelines & Google Material Design
 * Problema: 4 elementos com área de toque insuficiente
 */
@media (max-width: 1024px) {
    .elementor-button {
        min-height: 44px;
        min-width: 44px;
        padding: 12px 20px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .elementor-nav-menu a,
    .menu-item a {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        padding: 10px 15px;
    }

    .elementor-social-icon {
        min-width: 44px;
        min-height: 44px;
    }

    .elementor-menu-toggle {
        min-width: 44px;
        min-height: 44px;
        padding: 10px;
    }
}

/**
 * FIX 5: Tipografia legível em mobile
 * Garantir font-size mínimo de 14px
 */
@media (max-width: 480px) {
    body {
        font-size: 16px;
        line-height: 1.6;
    }

    p, li, td, th, label, span {
        font-size: max(14px, 1em);
    }

    .elementor-widget-text-editor,
    .elementor-text-editor {
        font-size: max(14px, inherit);
    }

    blockquote,
    .elementor-blockquote p {
        font-size: max(15px, 1em);
    }
}

/**
 * FIX 6: Espaçamentos mobile
 */
@media (max-width: 767px) {
    .elementor-section {
        padding-left: 15px;
        padding-right: 15px;
    }

    .elementor-container {
        padding-left: 0;
        padding-right: 0;
    }

    .elementor-widget-wrap {
        padding: 0 10px;
    }

    .elementor-section-boxed .elementor-container {
        max-width: calc(100% - 30px);
    }
}

/* ==========================================================================
   7. OVERRIDES DE PLUGINS
   Adicionado: 2026-01-29
   ========================================================================== */

/* Contact Form 7 */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea {
    padding: 15px 20px;
    border: 1px solid var(--elos-cream-30);
    background: transparent;
    color: var(--elos-cream);
    font-family: var(--font-primary);
    font-size: var(--text-sm);
    transition: var(--transition-base);
}

.wpcf7-form input:focus,
.wpcf7-form textarea:focus {
    outline: none;
    border-color: var(--elos-orange);
}

/* ==========================================================================
   8. PRINT STYLES
   ========================================================================== */

@media print {
    .elementor-menu-toggle,
    .elos-whatsapp-btn,
    .elementor-social-icon {
        display: none !important;
    }

    body {
        background: white !important;
        color: black !important;
    }

    a[href]::after {
        content: " (" attr(href) ")";
        font-size: 0.8em;
        color: #666;
    }
}

/* ==========================================================================
   DEBUG (descomentar para visualizar problemas)
   ========================================================================== */

/*
* {
    outline: 1px solid rgba(255, 0, 0, 0.2);
}

.elementor-absolute {
    outline: 2px solid red !important;
}
*/