/*
Theme Name: Ecliptica Child
Template: ecliptica
Author: Extend Themes
Author URI: https://extendthemes.com/
Description: A beautiful, very customizable, multipurpose theme that you can use to create amazing websites through drag and drop. It comes with a pre-designed home page, 5 header designs and over 35 ready-to-use content blocks that you can easily customize. You can also design your own custom blocks by combining more than 25 drag and drop components. It offers lots of customization options (video background, slideshow background, header content types, etc) to help you create a website that stands out in no time. It is also designed with responsiveness, to work on mobile devices right out of the box. It is the only theme you will ever need! CHECK OUT THE DEMOS: https://colibriwp.com/go/demos
Tags: entertainment,food-and-drink,portfolio,one-column,two-columns,right-sidebar,grid-layout,custom-header,custom-menu,custom-logo,full-width-template,theme-options,translation-ready,featured-images,threaded-comments
Version: 1.0.12.1755377526
Updated: 2025-08-16 17:52:06

*/
/* ========================================
   FOOTER UNIMT - CSS COMPLETO
   Adicione ao final do style.css do seu tema
   ======================================== */

.site-footer {
  background-color: #000000;
  margin-top: 0;
  width: 100%;
}

.footer-main {
  padding: 50px 20px 40px;
  background-color: #000000;
}

.footer-container {
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 200px repeat(3, 1fr) 280px;
  gap: 40px;
  align-items: start;
}

/* Colunas do Footer */
.footer-column {
  display: flex;
  flex-direction: column;
}

/* ========================================
   LOGO
   ======================================== */
.footer-logo {
  justify-content: flex-start;
}

.footer-logo img {
  width: 196px;
  height: 63px;
  object-fit: contain;
  transition: all 0.4s ease;
  filter: brightness(1);
}

.footer-logo img:hover {
  filter: brightness(1.2);
  transform: scale(1.05);
}

/* ========================================
   TÍTULOS
   ======================================== */
.footer-column h3 {
  color: #ffffff;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 20px;
  margin-top: 0;
  text-transform: uppercase;
  letter-spacing: 1px;
  position: relative;
  padding-bottom: 10px;
}

.footer-column h3::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 50px;
  height: 3px;
  background: linear-gradient(90deg, #4ac66d 0%, #3088d8 100%);
  border-radius: 2px;
  animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse {
  0%, 100% {
    width: 50px;
    opacity: 1;
  }
  50% {
    width: 70px;
    opacity: 0.7;
  }
}

.footer-subtitle {
  font-size: 16px;
  margin-top: 25px;
  margin-bottom: 10px;
}

/* ========================================
   LISTAS
   ======================================== */
.footer-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer-list li {
  margin-bottom: 12px;
  position: relative;
  padding-left: 18px;
}

.footer-list li::before {
  content: '▸';
  position: absolute;
  left: 0;
  color: #4ac66d;
  font-size: 14px;
  opacity: 0.7;
  transition: all 0.3s ease;
}

.footer-list li:hover::before {
  opacity: 1;
  left: 3px;
}

.footer-list li a {
  color: #ffffff;
  text-decoration: none;
  font-size: 15px;
  line-height: 1.6;
  transition: all 0.3s ease;
  display: inline-block;
  position: relative;
}

.footer-list li a::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background: linear-gradient(90deg, #f0bf4c 0%, #3088d8 100%);
  transition: width 0.3s ease;
}

.footer-list li a:hover {
  color: #f0bf4c;
  padding-left: 5px;
}

.footer-list li a:hover::after {
  width: 100%;
}

/* ========================================
   CONTATOS
   ======================================== */
.footer-contacts li a {
  color: #ffffff;
  font-size: 15px;
}

.footer-contacts li a::after {
  background: linear-gradient(90deg, #3088d8 0%, #4ac66d 100%);
}

.footer-contacts li a:hover {
  color: #3088d8;
  text-shadow: 0 0 10px rgba(48, 136, 216, 0.5);
}

/* ========================================
   ENDEREÇO
   ======================================== */
.footer-address {
  color: #cccccc;
  font-size: 14px;
  line-height: 1.6;
  margin: 0 0 15px 0;
  padding-left: 18px;
  position: relative;
}

.footer-address::before {
  content: '📍';
  position: absolute;
  left: 0;
  top: 0;
}

/* ========================================
   MAPA CLICÁVEL
   ======================================== */
.footer-map-link {
  display: block;
  text-decoration: none;
  margin-top: 15px;
}

.footer-map {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(64, 198, 109, 0.3);
  border: 2px solid #4ac66d;
  transition: all 0.3s ease;
  cursor: pointer;
}

.footer-map:hover {
  box-shadow: 0 6px 30px rgba(64, 198, 109, 0.6);
  border-color: #3088d8;
  transform: translateY(-3px);
}

.footer-map iframe {
  display: block;
  width: 100%;
  height: 200px;
}

/* Overlay do Mapa */
.map-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.footer-map:hover .map-overlay {
  opacity: 1;
}

.map-overlay-text {
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 12px 24px;
  background: linear-gradient(90deg, #4ac66d 0%, #3088d8 100%);
  border-radius: 25px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
  transform: scale(0.9);
  transition: transform 0.3s ease;
}

.footer-map:hover .map-overlay-text {
  transform: scale(1);
}

/* ========================================
   E-MEC E REDES SOCIAIS
   ======================================== */
.footer-emec-social {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
}

.emec-link {
  display: block;
  transition: all 0.4s ease;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(48, 136, 216, 0.4);
  border: 3px solid transparent;
  position: relative;
}

.emec-link::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(45deg, #4ac66d, #3088d8, #f0bf4c);
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: -1;
}

.emec-link:hover {
  transform: scale(1.08) rotate(2deg);
  box-shadow: 0 8px 35px rgba(240, 191, 76, 0.6);
}

.emec-link:hover::before {
  opacity: 0.3;
}

.emec-link img {
  width: 277px;
  height: 182px;
  object-fit: cover;
  display: block;
  transition: all 0.4s ease;
}

.emec-link:hover img {
  filter: brightness(1.1);
}

/* ========================================
   REDES SOCIAIS
   ======================================== */
.footer-social {
  width: 100%;
  text-align: center;
}

.footer-social h3 {
  font-size: 16px;
  margin-bottom: 15px;
}

.social-icons {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
}

.social-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px;
  border-radius: 25px;
  text-decoration: none;
  color: #ffffff;
  font-size: 15px;
  font-weight: 600;
  transition: all 0.3s ease;
  border: 2px solid transparent;
  min-width: 160px;
  justify-content: center;
}

.social-link svg {
  width: 20px;
  height: 20px;
}

.social-link.instagram {
  background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
}

.social-link.instagram:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(225, 48, 108, 0.6);
  border-color: #ffffff;
}

.social-link.facebook {
  background: #1877f2;
}

.social-link.facebook:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(24, 119, 242, 0.6);
  border-color: #ffffff;
}

.social-link.youtube {
  background: #FF0000;
}

.social-link.youtube:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(255, 0, 0, 0.6);
  border-color: #ffffff;
}

/* ========================================
   COPYRIGHT
   ======================================== */
.footer-copyright {
  background-color: #000000;
  color: #ffffff;
  text-align: center;
  padding: 25px 20px;
  margin: 0;
  border-top: 2px solid #333333;
  position: relative;
  overflow: hidden;
}

.footer-copyright::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent, #4ac66d, #3088d8, #f0bf4c, transparent);
  animation: shine 3s infinite;
}

@keyframes shine {
  0% {
    left: -100%;
  }
  100% {
    left: 100%;
  }
}

.footer-copyright p {
  margin: 0;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.8px;
  color: #ffffff;
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.1);
}

/* ========================================
   RESPONSIVO
   ======================================== */

/* Tablets grandes */
@media (max-width: 1200px) {
  .footer-container {
    grid-template-columns: 180px repeat(3, 1fr) 250px;
    gap: 30px;
  }

  .footer-logo img {
    width: 180px;
    height: auto;
  }

  .emec-link img {
    width: 250px;
    height: auto;
  }
}

/* Tablets */
@media (max-width: 968px) {
  .footer-container {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }

  .footer-logo {
    grid-column: 1 / -1;
    justify-content: center;
    align-items: center;
  }

  .footer-logo img {
    width: 196px;
    height: 63px;
  }

  .footer-column h3 {
    font-size: 17px;
  }

  .footer-emec-social {
    grid-column: 1 / -1;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    gap: 50px;
  }

  .emec-link img {
    width: 250px;
    height: auto;
  }

  .footer-map iframe {
    height: 220px;
  }
}

/* Mobile */
@media (max-width: 640px) {
  .footer-container {
    grid-template-columns: 1fr;
    gap: 35px;
  }

  .footer-main {
    padding: 40px 20px 30px;
  }

  .footer-column {
    text-align: left;
  }

  .footer-logo {
    text-align: center;
  }

  .footer-logo img {
    width: 180px;
    height: auto;
  }

  .footer-column h3 {
    font-size: 16px;
  }

  .footer-column h3::after {
    left: 0;
  }

  .footer-list li a {
    font-size: 14px;
  }

  .footer-emec-social {
    flex-direction: column;
    gap: 30px;
  }

  .emec-link img {
    width: 100%;
    max-width: 280px;
    height: auto;
  }

  .footer-map iframe {
    height: 200px;
  }

  .social-icons {
    width: 100%;
  }

  .social-link {
    width: 100%;
    max-width: 250px;
  }

  .footer-copyright p {
    font-size: 12px;
  }

  .map-overlay-text {
    font-size: 14px;
    padding: 10px 20px;
  }
}

/* Mobile Pequeno */
@media (max-width: 400px) {
  .footer-logo img {
    width: 150px;
  }

  .footer-column h3 {
    font-size: 15px;
  }

  .footer-list li a {
    font-size: 13px;
  }

  .emec-link img {
    max-width: 240px;
  }
}

/* Estilo do item principal já configurado */
#menu-item-825 > a {
    background-color: transparent !important;
    color: #ffffff !important;
    font-weight: 600;
    transition: all 0.3s ease;
}

/* Hover do item principal */
#menu-item-825 > a:hover {
    background-color: #4AC66d !important;
    color: #ffffff !important;
}

/* Estado ativo/focado do item principal */
#menu-item-825.current-menu-item > a,
#menu-item-825.current-menu-ancestor > a,
#menu-item-825 > a:focus {
    background-color: transparent !important;
    color: #3088d8 !important;
}

/* Submenu do item 825 - container */
#menu-item-825 .sub-menu {
    background-color: #ffffff !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1) !important; /* sombra sutil */
}

/* Itens do submenu - garantindo especificidade máxima */
#menu-item-825 .sub-menu li {
    background-color: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Links dentro do submenu - estado normal */
#menu-item-825 .sub-menu li a,
#menu-item-825 ul.sub-menu li a {
    background-color: #ffffff !important;
    color: #000000 !important;
    padding: 10px 15px !important;
    display: block !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    border: none !important;
    text-decoration: none !important;
}

/* Hover nos links do submenu - máxima especificidade */
#menu-item-825 .sub-menu li a:hover,
#menu-item-825 ul.sub-menu li a:hover,
#menu-item-825 .sub-menu li:hover a {
    background-color: #3088d8 !important;
    color: #ffffff !important;
}

/* Estados ativos do submenu */
#menu-item-825 .sub-menu li.current-menu-item a,
#menu-item-825 .sub-menu li a:focus {
    background-color: #3088d8 !important;
    color: #ffffff !important;
}

/* Garantindo que não haja conflitos com outros estilos */
#menu-item-825 .sub-menu li a:before,
#menu-item-825 .sub-menu li a:after {
    display: none !important;
}

/* Estilo do item principal já configurado */
#menu-item-882 > a {
    background-color: transparent !important;
    color: #ffffff !important;
    font-weight: 600;
    transition: all 0.3s ease;
}

/* Hover do item principal */
#menu-item-882 > a:hover {
    background-color: #4AC66d !important;
    color: #ffffff !important;
}

/* Estado ativo/focado do item principal */
#menu-item-882.current-menu-item > a,
#menu-item-882.current-menu-ancestor > a,
#menu-item-882 > a:focus {
    background-color: transparent !important;
    color: #3088d8 !important;
}

/* Submenu do item 825 - container */
#menu-item-882 .sub-menu {
    background-color: #ffffff !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1) !important; /* sombra sutil */
}

/* Itens do submenu - garantindo especificidade máxima */
#menu-item-882 .sub-menu li {
    background-color: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Links dentro do submenu - estado normal */
#menu-item-882 .sub-menu li a,
#menu-item-882 ul.sub-menu li a {
    background-color: #ffffff !important;
    color: #000000 !important;
    padding: 10px 15px !important;
    display: block !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    border: none !important;
    text-decoration: none !important;
}

/* Hover nos links do submenu - máxima especificidade */
#menu-item-882 .sub-menu li a:hover,
#menu-item-882 ul.sub-menu li a:hover,
#menu-item-882 .sub-menu li:hover a {
    background-color: #3088d8 !important;
    color: #ffffff !important;
}

/* Estados ativos do submenu */
#menu-item-882 .sub-menu li.current-menu-item a,
#menu-item-882 .sub-menu li a:focus {
    background-color: #3088d8 !important;
    color: #ffffff !important;
}

/* Garantindo que não haja conflitos com outros estilos */
#menu-item-882 .sub-menu li a:before,
#menu-item-882 .sub-menu li a:after {
    display: none !important;
}

/* Seções com fundo transparente recebem cinza leve */
section[style*="transparent"],
div[style*="transparent"],
.has-transparent-background {
    background-color: #f8f9fa !important;
}

/* Container principal */
.container,
.content-wrapper,
.page-content {
    background-color: transparent;
}

/* Cards e boxes brancos sobre o fundo cinza */
.card,
.box,
.widget,
.post,
.entry {
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* Remove qualquer gradiente roxo */
[style*="linear-gradient"][style*="#9266ea"],
[style*="background: linear-gradient"] {
    background-image: none !important;
    background-color: #f8f9fa !important;
}

/*Force remove inline styles com roxo */
[style*="#9266ea"] {
    background-color: #f5f5f5 !important;
    background-image: none !important;
}

/* Opções de tons de cinza (escolha um comentando os outros) */

/* OPÇÃO 1: Cinza Ultra Leve (quase branco) - RECOMENDADO */
body {
    background-color: #fafbfc !important;
}

/* ========================================
   COMPATIBILIDADE COM EDITOR WORDPRESS
   ======================================== */

/* Editor de blocos Gutenberg */
.editor-styles-wrapper,
.block-editor-writing-flow,
.edit-post-visual-editor {
    background-color: #f8f9fa !important;
}

/* Elementor */
.elementor-section,
.elementor-container {
    background-color: transparent;
}

.elementor-section[data-settings*="transparent"] {
    background-color: #f8f9fa !important;
}

/* WPBakery */
.vc_row,
.vc_section {
    background-color: transparent;
}

.vc_row[data-vc-full-width="true"] {
    background-color: #f8f9fa !important;
}

/* ========================================
   OVERLAY SUAVE (opcional)
   Para dar profundidade visual
   ======================================== */

body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #fafbfc 0%, #f5f6f7 100%);
    z-index: -1;
    pointer-events: none;
}


/* ========================================
   CORREÇÃO ALINHAMENTO FOOTER - Desktop
   Força alinhamento à esquerda em todas as telas
   ======================================== */

/* Força alinhamento à esquerda nas listas do footer */
.footer-list,
.footer-list li,
.footer-list li a {
    text-align: left !important;
}

/* Garante que as colunas também estejam alinhadas à esquerda */
.footer-column {
    text-align: left !important;
    align-items: flex-start !important;
}

/* Títulos alinhados à esquerda */
.footer-column h3,
.footer-subtitle {
    text-align: left !important;
}

/* Contatos alinhados à esquerda */
.footer-contacts,
.footer-contacts li,
.footer-contacts li a {
    text-align: left !important;
}

/* Endereço alinhado à esquerda */
.footer-address {
    text-align: left !important;
}

/* Garantindo em telas grandes (Desktop) */
@media (min-width: 969px) {
    .footer-column {
        text-align: left !important;
        align-items: flex-start !important;
    }
    
    .footer-list,
    .footer-list li,
    .footer-list li a {
        text-align: left !important;
    }
    
    .footer-column h3 {
        text-align: left !important;
    }
}

/* Exceções: Logo e E-MEC/Redes Sociais continuam centralizados */
.footer-logo {
    text-align: center !important;
    align-items: center !important;
    justify-content: center !important;
}

.footer-emec-social {
    text-align: center !important;
    align-items: center !important;
}

.footer-social {
    text-align: center !important;
}

.footer-social h3 {
    text-align: center !important;
}

/* ========================================
   PÁGINA 404 ERRO - UNIMT
   Design personalizado com cores da marca
   ======================================== */

.error-404-container {
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    position: relative;
    overflow: hidden;
}

/* Efeito de fundo decorativo */
.error-404-container::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(47, 187, 37, 0.05) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
}

.error-404-container::after {
    content: '';
    position: absolute;
    bottom: -50%;
    left: -20%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(48, 136, 216, 0.05) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
}

.error-404-content {
    max-width: 800px;
    width: 100%;
    text-align: center;
    background: #ffffff;
    padding: 60px 40px;
    border-radius: 20px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
    position: relative;
    z-index: 1;
}

/* ========================================
   LOGO
   ======================================== */
.error-404-logo {
    margin-bottom: 40px;
    animation: fadeInDown 0.6s ease-out;
}

.error-404-logo img {
    max-width: 280px;
    height: auto;
    display: inline-block;
}

/* ========================================
   NÚMERO 404
   ======================================== */
.error-404-number {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-bottom: 30px;
    animation: fadeInUp 0.8s ease-out;
}

.error-number {
    font-size: 120px;
    font-weight: 900;
    background: linear-gradient(135deg, #2fbb25 0%, #3088d8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1;
    animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.05);
        opacity: 0.8;
    }
}

/* ========================================
   TEXTOS
   ======================================== */
.error-404-title {
    font-size: 36px;
    font-weight: 700;
    color: #000000;
    margin-bottom: 20px;
    animation: fadeIn 1s ease-out;
}

.error-404-text {
    font-size: 18px;
    color: #333333;
    line-height: 1.6;
    margin-bottom: 40px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    animation: fadeIn 1.2s ease-out;
}

.error-404-subtitle {
    font-size: 16px;
    font-weight: 600;
    color: #000000;
    margin-bottom: 15px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* ========================================
   SUGESTÕES
   ======================================== */
.error-404-suggestions {
    background: #f8f9fa;
    padding: 30px;
    border-radius: 12px;
    margin-bottom: 40px;
    border-left: 4px solid #2fbb25;
    animation: fadeIn 1.4s ease-out;
}

.error-404-list {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: left;
    max-width: 400px;
    margin: 0 auto;
}

.error-404-list li {
    padding: 10px 0 10px 30px;
    color: #333333;
    font-size: 16px;
    position: relative;
}

.error-404-list li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: #2fbb25;
    font-weight: bold;
    font-size: 18px;
}

/* ========================================
   BOTÕES
   ======================================== */
.error-404-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 50px;
    animation: fadeInUp 1.6s ease-out;
}

.error-404-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 32px;
    border-radius: 30px;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
    border: 2px solid transparent;
}

.error-404-btn svg {
    width: 20px;
    height: 20px;
}

/* Botão Primário - Verde */
.btn-primary {
    background: linear-gradient(135deg, #2fbb25 0%, #27a01f 100%);
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(47, 187, 37, 0.3);
}

.btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 25px rgba(47, 187, 37, 0.5);
    background: linear-gradient(135deg, #27a01f 0%, #2fbb25 100%);
}

/* Botão Secundário - Azul */
.btn-secondary {
    background: #ffffff;
    color: #3088d8;
    border: 2px solid #3088d8;
}

.btn-secondary:hover {
    background: #3088d8;
    color: #ffffff;
    transform: translateY(-3px);
    box-shadow: 0 6px 25px rgba(48, 136, 216, 0.4);
}

/* ========================================
   LINKS RÁPIDOS
   ======================================== */
.error-404-quick-links {
    animation: fadeIn 1.8s ease-out;
}

.quick-links-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 15px;
    margin-top: 20px;
}

.quick-link {
    padding: 12px 20px;
    background: #f8f9fa;
    color: #000000;
    text-decoration: none;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 500;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.quick-link:hover {
    background: linear-gradient(135deg, #2fbb25 0%, #3088d8 100%);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(47, 187, 37, 0.3);
}

/* ========================================
   ANIMAÇÕES
   ======================================== */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ========================================
   RESPONSIVO
   ======================================== */

/* Tablets */
@media (max-width: 768px) {
    .error-404-content {
        padding: 40px 30px;
    }

    .error-404-logo img {
        max-width: 220px;
    }

    .error-number {
        font-size: 90px;
    }

    .error-404-title {
        font-size: 28px;
    }

    .error-404-text {
        font-size: 16px;
    }

    .error-404-buttons {
        flex-direction: column;
        gap: 15px;
    }

    .error-404-btn {
        width: 100%;
        max-width: 300px;
        justify-content: center;
    }

    .quick-links-grid {
        grid-template-columns: 1fr 1fr;
    }
}

/* Mobile */
@media (max-width: 480px) {
    .error-404-container {
        padding: 40px 15px;
    }

    .error-404-content {
        padding: 30px 20px;
    }

    .error-404-logo img {
        max-width: 180px;
    }

    .error-number {
        font-size: 70px;
        gap: 10px;
    }

    .error-404-title {
        font-size: 24px;
    }

    .error-404-text {
        font-size: 15px;
    }

    .error-404-suggestions {
        padding: 20px;
    }

    .quick-links-grid {
        grid-template-columns: 1fr;
    }
}

/* === CORREÇÃO MOLDURA BRANCA - BODY COLIBRI === */

/* Remove o overlay que cria a moldura */
body#colibri::before {
    display: none !important;
    content: none !important;
}

/* Remove qualquer margem/padding do body */
body#colibri {
    background-color: #fafbfc !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
}

/* Corrige o wrapper principal do Colibri */
body#colibri #page,
body#colibri .site {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* Garante que o header cole no topo */
body#colibri .site-header,
body#colibri #masthead,
body#colibri header {
    margin-top: 0 !important;
    top: 0 !important;
}

/* Garante que o footer cole na base */
body#colibri .site-footer,
body#colibri footer {
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}

/* ========================================
   CORREÇÃO COMPLETA - UNIMT
   ======================================== */

/* Remove o overlay que criava a moldura branca */
body#colibri::before {
    display: none !important;
    content: none !important;
}

/* Fundo geral cinza claro (remove o roxo do tema) */
body#colibri {
    background-color: #fafbfc !important;
    background-image: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
}

/* Remove roxo de qualquer elemento que use a cor do tema */
body#colibri [style*="#9266ea"],
body#colibri [style*="9266ea"] {
    background-color: #fafbfc !important;
    background-image: none !important;
}

/* Corrige wrapper principal */
body#colibri #page,
body#colibri .site {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    background-color: #fafbfc !important;
    background-image: none !important;
}

/* Header e footer sem moldura */
body#colibri .site-header,
body#colibri #masthead,
body#colibri header {
    margin-top: 0 !important;
    top: 0 !important;
}

body#colibri .site-footer,
body#colibri footer {
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}

/* ========================================
   HERO - AJUSTE TEXTO TOPO
   ======================================== */
body#colibri .ct-section:first-of-type {
    padding-top: 60px !important;
}

body#colibri .ct-section:first-of-type .ct-container {
    padding-left: 60px !important;
    padding-top: 30px !important;
}

/* Mobile */
@media (max-width: 768px) {
    body#colibri .ct-section:first-of-type {
        padding-top: 30px !important;
    }

    body#colibri .ct-section:first-of-type .ct-container {
        padding-left: 20px !important;
        padding-top: 15px !important;
    }
}