/*
====================================================================
  SEÇÃO INÍCIO - DESKTOP MEDIA QUERIES
  Local: sites/public/componentes/landingpage_portifolio/01_inicio/01_inicio_desktop_media.css
  
  DESCRIÇÃO:
    Configurações responsivas específicas para desktop da seção início.
    Breakpoints: 1200px+ (desktop), 1024px+ (notebook), 768px+ (tablet grande)

  PADRÃO:
    - Desktop First (min-width)
    - 3 breakpoints: 1200px+, 1024px+ e 768px+
    - Sem duplicatas

  Autor: #@HD
  Data de criação: 14/08/2025
  Última atualização: 14/08/2025
====================================================================
*/

/* ====================================================================
   MEDIA QUERIES ESPECÍFICAS PARA DESKTOP
   ==================================================================== */

/* -- Breakpoint: 1200px+ (Desktop) -- */
@media (min-width: 1200px) {
  .inicio_image {
    max-width: 400px;
  }
  
  .liquid_shape, .liquid_shape svg { 
    max-width: 400px; 
    max-height: 400px; 
  }
  
  .change_text h3 {
    font-size: 2.2rem;
  }
  
  .change_text h3 .word {
    font-size: 2.2rem;
  }
  
  .inicio_content h1 {
    font-size: 1.8rem;
  }
  
  .inicio_content h3 { 
    font-size: 2.2rem; 
  }
  
  section#inicio.desktop_inicio .inicio_desktop_paragrafo_01,
  section#inicio.desktop_inicio .inicio_desktop_paragrafo_02 {
    font-size: 1.2rem !important;
    padding: 0 !important;
    line-height: 1.6 !important;
    margin-bottom: 1.5rem !important;
  }
  
  section#inicio.desktop_inicio .inicio_desktop_content .inicio_desktop_paragrafo_01,
  section#inicio.desktop_inicio .inicio_desktop_content .inicio_desktop_paragrafo_02 {
    font-size: 1.2rem !important;
    padding: 0 !important;
    line-height: 1.6 !important;
    margin-bottom: 1.5rem !important;
  }
}

/* -- Breakpoint: 1024px+ (Notebook) -- */
@media (min-width: 1024px) {
  .inicio_image {
    max-width: 400px;
  }
  
  .liquid_shape, .liquid_shape svg { 
    max-width: 400px; 
    max-height: 400px; 
  }
  
  .inicio_content { 
    margin-left: 20px; 
    margin-top: -30px;
  }
  
  .inicio_content h1 {
    font-size: 1.8rem;
  }
  
  .inicio_content h3 { 
    font-size: 2.8rem; 
  }
  
  .change_text h3 {
    font-size: 2.8rem;
  }
  
  .change_text h3 .word {
    font-size: 2.8rem;
  }
  
  section#inicio.desktop_inicio .inicio_desktop_paragrafo_01,
  section#inicio.desktop_inicio .inicio_desktop_paragrafo_02 {
    font-size: 1.2rem !important;
    padding: 0 !important;
    line-height: 1.6 !important;
    margin-bottom: 1.5rem !important;
  }
  
  section#inicio.desktop_inicio .inicio_desktop_content .inicio_desktop_paragrafo_01,
  section#inicio.desktop_inicio .inicio_desktop_content .inicio_desktop_paragrafo_02 {
    font-size: 1.2rem !important;
    padding: 0 !important;
    line-height: 1.6 !important;
    margin-bottom: 1.5rem !important;
  }
}

/* -- Breakpoint: 768px+ (Tablet Grande) -- */
@media (min-width: 768px) {
  /* Garantir que a seção início funcione corretamente em tablets grandes */
  #inicio.desktop_inicio {
    display: flex ;
    flex-direction: column ;
    justify-content: center ;
    align-items: center ;
    min-height: calc(100vh - 80px) ;
  }
  
  .inicio_image {
    max-width: 350px ;
    width: 100% ;
    height: auto ;
  }
  
  .liquid_shape, .liquid_shape svg { 
    max-width: 350px ; 
    max-height: 350px ; 
  }
  
  .inicio_content { 
    margin-left: 15px ; 
    margin-top: -20px ;
    width: 100% ;
  }
  
  .inicio_content h1 {
    font-size: 1.6rem;
  }
  
  .inicio_content h3 { 
    font-size: 2.4rem ; 
  }
  
  .change_text h3 {
    font-size: 2.4rem ;
  }
  
  .change_text h3 .word {
    font-size: 2.4rem ;
  }
  
  /* Garantir que os parágrafos tenham o tamanho correto no tablet grande */
  section#inicio.desktop_inicio .inicio_desktop_paragrafo_01,
  section#inicio.desktop_inicio .inicio_desktop_paragrafo_02 {
    font-size: 1.2rem !important;
    padding: 0 !important;
    line-height: 1.6 !important;
    margin-bottom: 1.5rem !important;
  }
  
  section#inicio.desktop_inicio .inicio_desktop_content .inicio_desktop_paragrafo_01,
  section#inicio.desktop_inicio .inicio_desktop_content .inicio_desktop_paragrafo_02 {
    font-size: 1.2rem !important;
    padding: 0 !important;
    line-height: 1.6 !important;
    margin-bottom: 1.5rem !important;
  }
  
  /* Garantir que as colunas funcionem corretamente */
  .SECTION_DESKTOP_COLUMN_LEFT,
  .SECTION_DESKTOP_COLUMN_RIGHT {
    display: flex ;
    flex-direction: column ;
    justify-content: center ;
    align-items: center ;
    width: 100% ;
  }
  
  /* Garantir que o container de bordas funcione */
  .borda_container {
    width: 100% ;
    max-width: 100% ;
  }
}
