/* ═══════════════════════════════════════════════════════════════
   GUZTEC - SCALE ADJUSTMENT
   Ajuste fino da escala visual para 80% (ideal para desktop)
   ═══════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────────────────────── */
/* APLICAR APENAS EM DESKTOP (>1024px) */
/* ─────────────────────────────────────────────────────────────── */

@media (min-width: 1024px) {
  
  /* ─────────────────────────────────────────────────────────────── */
  /* 1. AJUSTE DE VARIÁVEIS CSS (80% do original) */
  /* ─────────────────────────────────────────────────────────────── */
  
  :root {
    /* Typography - 80% do tamanho original */
    --font-size-hero: 2.8rem;        /* Era 3.5rem */
    --font-size-h1: 2.4rem;          /* Era 3rem */
    --font-size-h2: 1.8rem;          /* Era 2.25rem */
    --font-size-h3: 1.2rem;          /* Era 1.5rem */
    --font-size-h4: 1rem;            /* Era 1.25rem */
    --font-size-body: 0.9rem;        /* Era 1rem */
    --font-size-small: 0.75rem;      /* Era 0.875rem */
    
    /* Spacing - 80% do original */
    --space-xs: 0.4rem;              /* Era 0.5rem */
    --space-sm: 0.8rem;              /* Era 1rem */
    --space-md: 1.6rem;              /* Era 2rem */
    --space-lg: 3.2rem;              /* Era 4rem */
    --space-xl: 4.8rem;              /* Era 6rem */
    --space-2xl: 6.4rem;             /* Era 8rem */
    
    /* Container */
    --container-max-width: 1024px;   /* Era 1280px */
    --header-height: 64px;           /* Era 80px */
  }
  
  /* ─────────────────────────────────────────────────────────────── */
  /* 2. AJUSTES ESPECÍFICOS DE COMPONENTES */
  /* ─────────────────────────────────────────────────────────────── */
  
  /* Container principal */
  .container {
    max-width: 1024px !important;    /* 80% de 1280px */
    padding: 0 1.6rem !important;    /* 80% de 2rem */
  }
  
  /* Header */
  .header {
    height: 64px !important;         /* 80% de 80px */
    padding: 0.8rem 0 !important;    /* 80% */
  }
  
  .logo-image {
    width: 336px !important; /* 80% de 420px para desktop escalonado */
    height: auto !important;
  }
  
  /* Ajuste do padding do body */
  body {
    padding-top: 176px !important;   /* 80% de 220px (novo padding) */
  }
  
  body.header-scrolled {
    padding-top: 64px !important;    /* 80% de 80px */
  }
  
  /* Hero Banner */
  .hero-banner-industrial {
    height: 360px !important;        /* Reduzido 10% (400px → 360px) */
    margin-top: 64px !important;     /* 80% */
  }
  
  /* Títulos */
  h1, .h1 {
    font-size: 2.4rem !important;    /* 80% de 3rem */
  }
  
  h2, .h2 {
    font-size: 1.8rem !important;    /* 80% de 2.25rem */
  }
  
  h3, .h3 {
    font-size: 1.2rem !important;    /* 80% de 1.5rem */
  }
  
  h4, .h4 {
    font-size: 1rem !important;      /* 80% de 1.25rem */
  }
  
  /* Section titles */
  .section-title {
    font-size: 1.8rem !important;    /* 80% de 2.25rem */
    margin-bottom: 2.4rem !important; /* 80% de 3rem */
  }
  
  /* Banner titles */
  .banner-title {
    font-size: 2.8rem !important;    /* 80% de 3.5rem */
    margin-bottom: 0.8rem !important; /* 80% */
  }
  
  .banner-subtitle {
    font-size: 1.2rem !important;    /* 80% de 1.5rem */
  }
  
  /* Body text */
  p, .card-text, body {
    font-size: 0.9rem !important;    /* 80% de 1rem */
    line-height: 1.5 !important;     /* Mantém legibilidade */
  }
  
  /* ─────────────────────────────────────────────────────────────── */
  /* 3. CARDS E COMPONENTES */
  /* ─────────────────────────────────────────────────────────────── */
  
  /* Cards */
  .card,
  .expertise-card,
  .award-card,
  .news-card {
    padding: 1.6rem !important;      /* 80% de 2rem */
    margin-bottom: 1.6rem !important; /* 80% */
    border-radius: 9.6px !important; /* 80% de 12px */
  }
  
  .card-title {
    font-size: 1.2rem !important;    /* 80% de 1.5rem */
    margin-bottom: 0.8rem !important;
  }
  
  /* Ícones hexagonais */
  .hexagon-icon,
  .icon-hexagon {
    width: 96px !important;          /* 80% de 120px */
    height: 96px !important;
  }
  
  .hexagon-icon i,
  .icon-hexagon i {
    font-size: 2.4rem !important;    /* 80% de 3rem */
  }
  
  /* ─────────────────────────────────────────────────────────────── */
  /* 4. GRID E LAYOUT */
  /* ─────────────────────────────────────────────────────────────── */
  
  /* Grid gaps */
  .grid {
    gap: 1.6rem !important;          /* 80% de 2rem */
  }
  
  .grid-2,
  .grid-3,
  .grid-4 {
    gap: 1.6rem !important;
  }
  
  /* Sections */
  .section {
    padding: 3.2rem 0 !important;    /* 80% de 4rem */
  }
  
  /* ─────────────────────────────────────────────────────────────── */
  /* 5. BOTÕES E NAVEGAÇÃO */
  /* ─────────────────────────────────────────────────────────────── */
  
  /* Botões */
  .btn,
  .btn-primary,
  .btn-secondary {
    padding: 0.64rem 1.6rem !important; /* 80% de 0.8rem 2rem */
    font-size: 0.9rem !important;    /* 80% de 1rem */
    border-radius: 24px !important;  /* 80% de 30px */
  }
  
  /* Menu */
  .nav-menu li a {
    padding: 0.64rem 1.2rem !important; /* 80% */
    font-size: 0.84rem !important;   /* 80% de 1.05rem */
  }
  
  /* ─────────────────────────────────────────────────────────────── */
  /* 6. TIMELINE E FOUNDER */
  /* ─────────────────────────────────────────────────────────────── */
  
  /* Timeline */
  .timeline-item {
    padding: 1.6rem !important;      /* 80% */
    margin-bottom: 1.6rem !important;
  }
  
  .timeline-icon {
    width: 48px !important;          /* 80% de 60px */
    height: 48px !important;
    font-size: 1.6rem !important;    /* 80% de 2rem */
  }
  
  .timeline-year {
    font-size: 1.6rem !important;    /* 80% de 2rem */
  }
  
  /* Founder section */
  .founder-photo img {
    border-radius: 9.6px !important; /* 80% de 12px */
  }
  
  /* ─────────────────────────────────────────────────────────────── */
  /* 7. FOOTER */
  /* ─────────────────────────────────────────────────────────────── */
  
  /* Footer */
  .footer {
    padding: 3.2rem 0 !important;    /* 80% de 4rem */
  }
  
  .social-icon {
    width: 40px !important;          /* 80% de 50px */
    height: 40px !important;
    font-size: 1.2rem !important;    /* 80% de 1.5rem */
  }
  
  /* ─────────────────────────────────────────────────────────────── */
  /* 8. FORMS E INPUTS */
  /* ─────────────────────────────────────────────────────────────── */
  
  input,
  textarea,
  select {
    padding: 0.64rem 0.8rem !important; /* 80% */
    font-size: 0.9rem !important;
    border-radius: 6.4px !important; /* 80% de 8px */
  }
  
  /* ─────────────────────────────────────────────────────────────── */
  /* 9. AJUSTES FINOS ESPECÍFICOS */
  /* ─────────────────────────────────────────────────────────────── */
  
  /* Logo row específica */
  .logo-row {
    height: 64px !important;         /* 80% de 80px */
  }
  
  /* Language selector */
  .language-selector {
    padding: 0.48rem 0.8rem !important; /* 80% */
    border-radius: 20px !important;  /* 80% de 25px */
  }
  
  .lang-option {
    width: 17px !important;          /* 85% de 20px */
    height: 17px !important;
    padding: 0 !important;           /* ZERO padding para manter circular */
    aspect-ratio: 1 / 1 !important;  /* Círculo perfeito */
    flex-shrink: 0 !important;
    border-radius: 50% !important;   /* Garante circular */
    overflow: hidden !important;
  }
  
  .lang-option img {
    width: 17px !important;          /* 85% de 20px */
    height: 17px !important;
    display: block !important;       /* Remove espaçamento */
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 50% !important;   /* Garante circular */
  }
  
  /* Hexágonos decorativos */
  .hexagon-decor.large {
    width: 120px !important;         /* 80% de 150px */
    height: 120px !important;
  }
  
  .hexagon-decor.medium {
    width: 96px !important;          /* 80% de 120px */
    height: 96px !important;
  }
  
  .hexagon-decor.small {
    width: 64px !important;          /* 80% de 80px */
    height: 64px !important;
  }
  
  /* ─────────────────────────────────────────────────────────────── */
  /* 10. AJUSTES DE MARGEM E PADDING GLOBAIS */
  /* ─────────────────────────────────────────────────────────────── */
  
  /* Margens gerais */
  .mb-sm { margin-bottom: 0.8rem !important; }
  .mb-md { margin-bottom: 1.6rem !important; }
  .mb-lg { margin-bottom: 3.2rem !important; }
  
  .mt-sm { margin-top: 0.8rem !important; }
  .mt-md { margin-top: 1.6rem !important; }
  .mt-lg { margin-top: 3.2rem !important; }
  
  /* Padding gerais */
  .p-sm { padding: 0.8rem !important; }
  .p-md { padding: 1.6rem !important; }
  .p-lg { padding: 3.2rem !important; }

}

/* ═══════════════════════════════════════════════════════════════
   FIM DOS AJUSTES DE ESCALA 80%
   
   NOTA: Estes ajustes são aplicados APENAS em desktop (>1024px)
   Mobile e tablet mantêm os tamanhos originais
   ═══════════════════════════════════════════════════════════════ */