/*
Theme Name: Ecila Agenda
Theme URI: https://eciladigital.com.br/agenda/
Author: Ecila
Author URI: https://eciladigital.com.br
Description: Este tema é exclusivo da plataforma Ecila.
Requires at least: 6.7
Tested up to: 6.8
Requires PHP: 7.2
Version: 1.1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ecilaagenda
*/

/* ===========================================
  VARIÁVEIS CSS - OTIMIZADO
  Neste arquivo você vai encontrar as variáveis do site:
  - Cores
  - Fontes
  - Espaçamentos
  - Bordas
  - Sombras
  - Transições
=========================================== */

:root {
  /* ========================================
     CORES PRINCIPAIS
     ======================================== */
  
  --color-primary: #005eff;              /* Cor principal do site */
  --color-primary-dark: #0048cc;         /* Variação escura da cor principal */
  --color-primary-light: #3380ff;        /* Variação clara da cor principal */
  
  --color-secondary: #ff9b00;            /* Cor secundária do site */
  --color-secondary-dark: #cc7c00;       /* Variação escura da cor secundária */
  --color-secondary-light: #ffb033;      /* Variação clara da cor secundária */
  
  --color-contrast: #ffffff;             /* Cor de contraste */
  
  /* ========================================
     CORES DE TEXTO
     ======================================== */
  
  --color-text: #333333;                 /* Cor do texto padrão */
  --color-heading: #000000;              /* Cor dos títulos */
  
  /* ========================================
     CORES NEUTRAS (CINZAS)
     ======================================== */
  
  --color-white: #ffffff;                /* Branco puro */
  --color-black: #000000;                /* Preto puro */
  --color-gray-50: #f9fafb;              /* Cinza muito claro */
  --color-gray-100: #f4f4f4;             /* Cinza claro */
  --color-gray-200: #eeeeee;             /* Cinza claro médio */
  --color-gray-300: #d1d5db;             /* Cinza médio claro */
  --color-gray-400: #9ca3af;             /* Cinza médio */
  --color-gray-500: #6b7280;             /* Cinza */
  --color-gray-600: #4b5563;             /* Cinza médio escuro */
  --color-gray-700: #374151;             /* Cinza escuro */
  --color-gray-800: #222222;             /* Cinza muito escuro */
  --color-gray-900: #111111;             /* Quase preto */
  
  /* ========================================
     TOPBAR (Barra Superior de Contatos)
     ======================================== */
  
  --topbar-bg: #f4f4f4;                  /* Fundo da barra superior */
  --topbar-text: #111111;                /* Texto da barra superior */
  
  /* ========================================
     HEADER (Cabeçalho)
     ======================================== */
  
  --header-bg: #ffffff;                  /* Fundo do cabeçalho */
  --header-text: #111111;                /* Texto do cabeçalho */
  --header-link-hover: #005eff;          /* Cor dos links no hover */
  --header-btn: #222222;                 /* Fundo do botão redes sociais */
  --header-icon: #ffffff;                /* Cor do ícone redes sociais */
  
  /* ========================================
     BOTÕES
     ======================================== */
  
  --btn-bg: #000000;                     /* Fundo dos botões */
  --btn-text: #ffffff;                   /* Texto dos botões */
  --btn-bg-hover: #ff0000;               /* Fundo dos botões no hover */
  --btn-text-hover: #ffffff;             /* Texto dos botões no hover */
  
  /* ========================================
     BARRA DE TÍTULOS (Páginas Internas)
     ======================================== */
  
  --pagebar-bg: #eeeeee;                 /* Fundo da barra de título */
  --pagebar-text: #111111;               /* Texto da barra de título */
  
  /* ========================================
     FOOTER (Rodapé)
     ======================================== */
  
  --footer-bg: #000000;                  /* Fundo do rodapé */
  --footer-text: #ffffff;                /* Texto do rodapé */
  --footer-btn: #222222;                 /* Fundo do botão redes sociais */
  --footer-icon: #ffffff;                /* Cor do ícone redes sociais */
  
  /* ========================================
     TIPOGRAFIA - FONTES
     ======================================== */
  
  /* Famílias de Fonte */
  --font-primary: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-heading: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "Fira Code", "Courier New", monospace;
  
  /* Pesos de Fonte */
  --font-weight-light: 300;              /* Leve */
  --font-weight-normal: 400;             /* Normal/Regular */
  --font-weight-medium: 500;             /* Médio */
  --font-weight-semibold: 600;           /* Semi-negrito */
  --font-weight-bold: 700;               /* Negrito */
  --font-weight-extrabold: 800;          /* Extra negrito */
  
  /* ========================================
     TIPOGRAFIA - TAMANHOS DE FONTE (FLUIDOS)
     Responsivos automaticamente
     ======================================== */
  
  --font-size-xs: clamp(0.75rem, 0.9vw, 0.875rem);     /* 12-14px */
  --font-size-sm: clamp(0.875rem, 1vw, 1rem);          /* 14-16px */
  --font-size-base: clamp(1rem, 1.1vw, 1.125rem);      /* 16-18px */
  --font-size-lg: clamp(1.125rem, 1.2vw, 1.25rem);     /* 18-20px */
  --font-size-xl: clamp(1.25rem, 1.5vw, 1.5rem);       /* 20-24px */
  --font-size-2xl: clamp(1.5rem, 2vw, 1.875rem);       /* 24-30px */
  --font-size-3xl: clamp(1.875rem, 2.5vw, 2.25rem);    /* 30-36px */
  --font-size-4xl: clamp(2.25rem, 3vw, 3rem);          /* 36-48px */
  
  /* ========================================
     TIPOGRAFIA - ALTURAS DE LINHA
     ======================================== */
  
  --line-height-tight: 1.25;             /* Apertado - para títulos */
  --line-height-snug: 1.375;             /* Justo */
  --line-height-normal: 1.5;             /* Normal - para textos */
  --line-height-relaxed: 1.625;          /* Relaxado */
  --line-height-loose: 2;                /* Solto - para textos longos */
  
  /* ========================================
     ESPAÇAMENTOS
     Sistema baseado em múltiplos de 4px
     ======================================== */
  
  --space-0: 0;                          /* 0px */
  --space-1: 0.25rem;                    /* 4px */
  --space-2: 0.5rem;                     /* 8px */
  --space-3: 0.75rem;                    /* 12px */
  --space-4: 1rem;                       /* 16px */
  --space-5: 1.25rem;                    /* 20px */
  --space-6: 1.5rem;                     /* 24px */
  --space-7: 1.75rem;                    /* 28px */
  --space-8: 2rem;                       /* 32px */
  --space-10: 2.5rem;                    /* 40px */
  --space-12: 3rem;                      /* 48px */
  --space-15: 3.75rem;                   /* 60px */
  --space-16: 4rem;                      /* 64px */
  --space-20: 5rem;                      /* 80px */
  --space-24: 6rem;                      /* 96px */
  --space-30: 7.5rem;                    /* 120px */
  
  /* ========================================
     BORDAS - RAIOS
     ======================================== */
  
  --radius-none: 0;                      /* Sem arredondamento */
  --radius-sm: 0.25rem;                  /* 4px - Pequeno */
  --radius-md: 0.5rem;                   /* 8px - Médio */
  --radius-lg: 0.75rem;                  /* 12px - Grande */
  --radius-xl: 1rem;                     /* 16px - Extra grande */
  --radius-2xl: 1.25rem;                 /* 20px */
  --radius-3xl: 1.875rem;                /* 30px */
  --radius-full: 9999px;                 /* Totalmente arredondado */
  --radius-circle: 50%;                  /* Circular */
  
  /* Bordas - Espessuras */
  --border-thin: 1px;                    /* Fina */
  --border-medium: 2px;                  /* Média */
  --border-thick: 4px;                   /* Grossa */
  
  /* ========================================
     SOMBRAS
     ======================================== */
  
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);           /* Pequena */
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);         /* Média */
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);       /* Grande */
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1);       /* Extra grande */
  --shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);    /* Gigante */
  --shadow-none: none;                   /* Sem sombra */
  
  /* ========================================
     TRANSIÇÕES
     ======================================== */
  
  --transition-fast: 150ms ease;         /* Rápida */
  --transition-base: 300ms ease;         /* Padrão */
  --transition-slow: 500ms ease;         /* Lenta */
  
  /* Curvas de animação */
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  
  /* ========================================
     Z-INDEX (Camadas)
     ======================================== */
  
  --z-base: 0;                           /* Base */
  --z-dropdown: 1000;                    /* Dropdowns */
  --z-sticky: 1020;                      /* Elementos sticky */
  --z-fixed: 1030;                       /* Elementos fixos */
  --z-modal-backdrop: 1040;              /* Fundo do modal */
  --z-modal: 1050;                       /* Modal */
  --z-popover: 1060;                     /* Popover */
  --z-tooltip: 1070;                     /* Tooltip */
  
  /* ========================================
     LARGURAS MÁXIMAS (Containers)
     ======================================== */
  
  --container-sm: 640px;                 /* Pequeno */
  --container-md: 768px;                 /* Médio */
  --container-lg: 1024px;                /* Grande */
  --container-xl: 1170px;                /* Extra grande (padrão do site) */
  --container-2xl: 1280px;               /* Gigante */
}

/* ===========================================
  RESET CSS OTIMIZADO PARA PERFORMANCE
  - Minimalista: apenas o essencial
  - Seletores específicos (evita * quando possível)
  - Sem redundâncias
  - Otimizado para rendering
  =========================================== */

  /* 1) Box-sizing - Método mais performático */
  html {
    box-sizing: border-box;
    -webkit-text-size-adjust: 100%;
  }

  *,
  *::before,
  *::after {
    box-sizing: inherit; /* inherit é mais rápido que repetir border-box */
  }

  /* 2) Reset de margens/paddings - Seletores específicos */
  body, h1, h2, h3, h4, h5, h6, p, 
  ul, ol, li, figure, figcaption, 
  blockquote, dl, dd {
    margin: 0;
    padding: 0;
  }

  /* 3) Body - Base otimizada */
  body {
    min-height: 100vh;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  /* 4) Imagens e mídia - Crítico para CLS (Cumulative Layout Shift) */
  img,
  picture,
  video,
  svg {
    display: block;
    max-width: 100%;
    height: auto;
  }

  /* 5) Forms - Reset mínimo necessário */
  input,
  button,
  textarea,
  select {
    font: inherit; /* Mais conciso que font-family + font-size + line-height */
  }

  /* 6) Links - Apenas o essencial */
  a {
    color: inherit;
    text-decoration: none;
  }

  /* 7) Listas */
  ul, ol {
    list-style: none;
  }

  /* 8) Tabelas */
  table {
    border-collapse: collapse;
    width: 100%;
  }

  /* 9) Acessibilidade - Focus */
  :focus-visible {
    outline: 2px solid var(--c1);
    outline-offset: 2px;
  }

  /* 10) Reduced motion - Performance + Acessibilidade */
  @media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
      scroll-behavior: auto !important;
    }
  }

  /* 11) Utilitários essenciais */
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  /* ===========================================
    DEFINIÇÕES CONTRA RESET
    (Específicas do seu tema)
  =========================================== */
  
  .box-conteudo-ctp p { 
    margin-bottom: var(--space-5); 
  }

  .box-conteudo-ctp strong,
  .box-conteudo-ctp b {
    font-weight: 700;
  }

  .box-conteudo-ctp em, 
  .box-conteudo-ctp i {
    font-style: italic;
  }

  .box-conteudo-ctp ul,
  .box-conteudo-ctp ol {
    margin-bottom: 16px;
    padding-left: 24px;
  }

  .box-conteudo-ctp ul {
    list-style: disc;
  }

  .box-conteudo-ctp ol {
    list-style: decimal;
  }

  .box-conteudo-ctp a {
    color: var(--color-primary, #0066cc);
    text-decoration: underline;
  }

  .box-conteudo-ctp h1,
  .box-conteudo-ctp h2,
  .box-conteudo-ctp h3,
  .box-conteudo-ctp h4,
  .box-conteudo-ctp h5,
  .box-conteudo-ctp h6 {
    margin-bottom: 12px;
    font-weight: 700;
    line-height: 1.2;
  }

  .titulo-box-conteudo-ctp {
    display: block;
    margin-bottom: var(--space-8) !important; 
  }

/* FIM RESET */




/* GERAL */
    html {scroll-behavior: smooth;}
    body {
        font-family: var(--font-primary);
        font-size: var(--font-size-sm);
        line-height: var(--line-height-normal);
        font-weight: var(--font-weight-normal);
        color: var(--txt);
    }
    .site-main {
        display: flex;
        flex-direction: column;
    }
    .sec-ecila {
        padding: var(--space-15) 0;
        transition: order 0.3s ease;
    }
    .sec-agendamento-home {
        padding: var(--space-8) 0;
    }
    .sec-banner {
        width: 100%;
        height: auto;
        border-radius: 0px 0px var(--radius-lg) var(--radius-lg);
        background: var(--head-bg);
        overflow: hidden;
        position: relative;
        z-index: 10;
    }
    .sec-box-titulo-page {
        position: relative;
        margin-top: -20px;
        padding: var(--space-12) 0 var(--space-8) 0 !important;
    }
    .sec-box-titulo-page-overlay {
        position: absolute;
        top: 0; left: 0;
        width: 100%;
        height: 100%;
        background: var(--c1);
        opacity: .1;
    }
    .container {
        width: var(--container-xl);
        margin: auto;
        padding: 0 var(--space-3);
    }
    .container-page-padrao {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
    .container-pagina-area-cliente {
        padding: var(--space-6);
        border-radius: var(--radius-3xl);
        margin-top: -60px;
        background: #ffff;
        box-shadow: 0px 20px 28px -20px rgba(0,0,0,0.20);
        -webkit-box-shadow: 0px 20px 28px -20px rgba(0,0,0,0.20);
        -moz-box-shadow: 0px 20px 28px -20px rgba(0,0,0,0.20);
        border: 1px solid #eee;
    }
    .titulo-primario {
        font-size: var(--font-size-xl);
        font-weight: var(--font-weight-bold);
        color: var(--ttl);
    }
    .titulo-secundario {
        font-size: var(--font-size-xl);
        font-weight: var(--font-weight-bold);
        color: var(--ttl);
    }
    .titulo-terceario {
        font-size: var(--font-size-xl);
        font-weight: var(--font-weight-bold);
        color: var(--ttl);
    }

/* FIM GERAL */


/* HEADER */
    .header-site {
        background-color: var(--head-bg);
        padding: var(--space-8) 0 var(--space-3) 0;
        border-bottom: 1px solid #00000014;
        border-radius: 0px 0px var(--radius-lg) var(--radius-lg);
        position: relative;
        z-index: 9;
        margin-top: -20px;
    }
    .container-topo {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .box-elementos-topo-essencial {
        display: flex;
        flex-direction: row;
        gap: 20px;
        align-items: center;
    }
    .nome-header {
        font-size: var(--font-size-base);
        font-weight: var(--font-weight-bold);
        width: 100%;
        color: var(--head-txt);
    }
    .box-elementos-topo-essencial .custom-logo-link {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 70px;
        height: 70px;
        flex-shrink: 0;
        border-radius: var(--radius-circle);
        position: relative;
        z-index: 1;
        border: 4px solid #eee;
        overflow: hidden;
    }
    .box-elementos-topo-essencial .custom-logo {
        width: 70px;
        height: 70px;
        max-width: 100%;
        object-fit: contain;
        object-position: left center;
        border-radius: var(--radius-circle);
    }
    .box-itens-cabecalho {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 5px;
        flex-direction: column;
    }
    .descricao-cabecalho {
        margin-bottom: var(--space-2);
        color: var(--header-text);
    }
    .cont-bts-acao-topo {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 15px;
    }
    .box-itens-cabecalho {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 5px;
        flex-direction: column;
    }
    .ico-acao {
        width: 40px;
        height: 40px;
        border-radius: var(--radius-circle);
        background: var(--c1);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        color: white;
        transition: var(--transition-base);
    }
    .ico-acao:hover {
        opacity: .6;
    }
    .ico-acao-compartilhar {
        color: var(--txt);
        background: #eee;
        cursor: pointer;
        border: 0px;
    }
    .share-menu{
        position:fixed; /* fixed em vez de absolute: evita bug de scroll no mobile */
        display:none;
        background:#fff;
        border:1px solid #ddd;
        border-radius:8px;
        box-shadow:0 5px 20px rgba(0,0,0,.15);
        min-width:200px;
        max-width:calc(100vw - 16px); /* nunca estoura a tela */
        padding:8px 0;
        z-index:9999;
    }
    .share-menu a{
        display:block;
        padding:10px 15px;
        color:#333;
        text-decoration:none;
        font-size:14px;
    }
    .share-menu a:hover{ background:#f5f5f5; }

/* FIM HEADER */


/* TABS HOME */
/* ====== O TRUQUE: radio inputs escondidos controlam tudo via :checked ====== */
  .tabs {
    position: relative;
  }

  .tabs input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
  }

  .tab-list {
    display: flex;
    gap: 4px;
    padding: 6px;
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-full);
  }

  .tab-list label {
    flex: 1;
    text-align: center;
    padding: 10px 14px;
    border-radius: var(--radius-full);
    font-size: 14px;
    font-weight: 500;
    color: var(--txt);
    cursor: pointer;
    user-select: none;
    transition: color 0.2s ease, background-color 0.2s ease;
  }

  .tab-list label:hover {
    color: var(--c1);
    background: rgb(250 250 250);
  }

  /* Foco visível via teclado (o input escondido recebe o foco, não o label) */
  input#tab1:focus-visible ~ .tab-list label[for="tab1"],
  input#tab2:focus-visible ~ .tab-list label[for="tab2"],
  input#tab3:focus-visible ~ .tab-list label[for="tab3"],
  input#tab4:focus-visible ~ .tab-list label[for="tab4"] {
    outline: 2px solid var(--c1);
    outline-offset: 2px;
  }

  /* Estado ativo da aba */
  #tab1:checked ~ .tab-list label[for="tab1"],
  #tab2:checked ~ .tab-list label[for="tab2"],
  #tab3:checked ~ .tab-list label[for="tab3"],
  #tab4:checked ~ .tab-list label[for="tab4"] {
    background: var(--c1);
    color: #fff;
  }

  .panels {
    position: relative;
    min-height: 180px;
  }

  .panel {
    position: absolute;
    inset: 0;
    padding: 40px 0px 0px 0px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(4px);
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
  }

  #tab1:checked ~ .panels .panel[data-panel="1"],
  #tab2:checked ~ .panels .panel[data-panel="2"],
  #tab3:checked ~ .panels .panel[data-panel="3"],
  #tab4:checked ~ .panels .panel[data-panel="4"] {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    position: relative;
  }

  .panel h2 {
    margin-bottom: 20px;
    font-size: 22px;
    color: var(--txt);
  }

  @media (prefers-reduced-motion: reduce) {
    .panel { transition: none; }
  }

/* FIM - TABS HOME */



/* FOOTER */
    .footer-site {
        background-color: var(--foot-bg);
        border-radius: var(--radius-lg) var(--radius-lg) 0px 0px;
        position: relative;
        overflow: hidden;
    }
    .footer-site-overlay {
        width: 100%;
        height: 100%;
        position:absolute;
        top: 0;
        left:0;
        background-color: var(--c1);
        opacity: 0.05;
    }
    .ajuste-footer {
        display: flex;
        padding: var(--space-15) 0;
        color: var(--txt);
        gap: 40px;
            position: relative;
        z-index: 1;
    }
    .box-footer {
        width: 25%;
        display: flex;
        flex-direction: column;
        gap: 20px;
        color: var(--foot-txt)
    }
    .alinhamento-elementos-superior {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .sec-lista-padrao {
        padding-top: 0;
        margin-top: -60px;
        background-color: transparent;
        position: relative;
        z-index: 1;
    }
    .ajuste-zindex {
        position: relative;
        z-index: 2;
    }
    .ajuste-bloco-texto-conteudo {
        margin-top: 60px;
        padding-top: 40px;
        border-top: 1px solid #eee;
    }
    .t-footer {
        font-weight: var(--font-weight-semibold);
        display: block;
        font-size: var(--font-size-sm);
    }
    .social-footer li a {
        color: var(--foot-ico);
        background-color: var(--foot-btn);
        border: 1px solid var(--foot-btn);
    }
    .social-footer li a:hover {
        background-color: transparent;
        color: var(--foot-btn);
    }
    #menu-menu-rodape {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    #menu-menu-rodape a {
        color: var(--foot-txt);
        text-decoration: none;
        transition: var(--transition-base);
        font-size: var(--font-size-xs);
        line-height: var(--line-height-relaxed);
    }
    #menu-menu-rodape a:hover {
        opacity: 0.6;
    }
    #menu-menu-rodape .menu-item::after,
    #menu-menu-categorias-servico .menu-item::after {
        display: none;
    }
    .menu-item::after {
        display: none;
    }
    .ajuste-footer hr {
        display: none;
    }
    .footer-logo-link {
        display: flex;
        width: 160px;
        height: 80px;
        flex-shrink: 0;
    }
    .logo-rodape {
        width: 160px;
        min-height: 80px;
        max-width: 100%;
        object-fit: contain;
        object-position: left top;
        }
    .grupo-contatos-footer {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .contatos-fixos,
    .contatos-whatsapp,
    .contatos-emails {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .contato-item a {
        display: flex;
        align-items: center;
        gap: 5px;
        font-size: var(--font-size-xs);
        color: var(--foot-txt);
    }
    .box-complemento-footer {
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding-top: 10px;
    }
    .box-endereco-footer {
        padding: 0;
    }
    .box-social-footer {
        display: flex;
        flex-direction: column;
        gap: 20px;
        padding-top: 0px;
    }
    /* Copy */
    .copy-ecila {
        background-color: var(--c1);
        padding: var(--space-4) 0;
        color: #fff;
        border-radius: var(--radius-lg) var(--radius-lg) 0px 0px;
        position: relative;
    }
    .ajuste-copy-site {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
    }
    .info-empresa-footer {
        display: flex;
        align-items: flex-start;
        flex-wrap: wrap;
        font-size: var(--font-size-xs);
        flex-direction: column;
        gap: 6px;
    }
	.info-empresa-footer-simplificado {
		color: var(--footer-text);
		padding: var(--space-10) 0;
		text-align: center;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 5px;
	}
    .nome-footer {
        font-weight: var(--font-weight-semibold);
        font-size: var(--font-size-sm);
        margin-bottom: 10px;
    }
    .nome-copy-footer {
        display: flex;
    }
    .info-empresa-footer a {
        transition: var(--transition-base);
    }
    .info-empresa-footer a:hover {
        opacity: 0.6;
    }
    .ass-ecila {
        text-decoration: none;
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: var(--font-size-xs);
        flex-direction: row;
        font-weight: var(--font-weight-normal);
        letter-spacing: 0.5px;
    }

/* FIM FOOTER */


/* MOBILE */

    /* 1280PX */
    @media (max-width: 1280px) {
        .sec-agendamento-home {padding-top: var(--space-6); padding-bottom: 0px !important;}
        .container {width: 100%;}
        .container-agenda-mobile {padding: 0;}
        .tab-list {margin-right: 15px;margin-left: 15px;}
        .panel h2 {font-size: 20px;padding: 0 20px;}
        .ajuste-footer {padding: var(--space-15) var(--space-3);}
        
    }
    /* FIM 1280PX */

    /* 1024PX */
    @media (max-width: 1024px) {
        .sec-ecila {padding: var(--space-8) 0;}
        .box-elementos-topo {gap: 20px;}
        .agrupa-acoes-topo {gap: 20px;}
        .box-elementos-topo .search-form {display: none;} 
        .box-itens-principal-topo {padding: var(--space-0);}
        .ajuste-topo-principal {display: flex; justify-content: space-between; align-items: center; padding: var(--space-3); flex-wrap: wrap; gap: 0px 15px;}
        .social-footer {display:flex;}
        .ajuste-footer {flex-direction: column; gap: 20px;}
        .box-footer {width: 100%;}
        .ajuste-footer hr, .box-footer hr {width: 100%; opacity: 0.1; border: none; border-top: 1px solid var(--foot-txt); display: block;}
        .hr-footer {margin: 15px 0;}
        .box-complemento-footer {padding: 0;}
        .ajuste-copy-site {gap: 20px;}
        .info-empresa-footer {width: 100%; justify-content: center;}
        .ass-ecila { width: 100%; flex-direction: column; justify-content: center; margin-top: var(--esp-20); text-align: center;}
    }
    /* FIM - 1024PX */

    /* 768PX */
    @media (max-width: 768px) {
        .cont-bts-acao-topo{display: flex; flex-direction: column-reverse; align-items: center; gap: 6px;}
        .ico-acao {width: 32px; height: 32px;}
    }
    /* FIM 768PX */

    /* 640PX */
    @media (max-width: 640px) {
        .tab-list label {padding: 5px 6px; font-size: 13px;}
    }
    /* FIM 640PX */

    /* 480PX */
    @media (max-width: 480px) {
        
    }
    /* FIM 480PX */

    /* 320PX */
    @media (max-width: 320px) {
        
    }
    /* FIM 320PX */



/* FIM - MOBILE */