/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 08-17-2025, 09:53:11 AM
    Author     : JOSE POLANCO
*/

  /* Estilos para el botón de Instagram */
    .btn-instagram {
      background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
      color: white;
      padding: 1rem 2rem;
      border-radius: 50px;
      font-size: 1.1rem;
      font-weight: 600;
      border: none;
      cursor: pointer;
      transition: all 0.3s ease;
      box-shadow: 0 4px 15px rgba(220, 39, 67, 0.3);
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }
    
    .btn-instagram:hover {
      transform: translateY(-2px);
      box-shadow: 0 6px 20px rgba(220, 39, 67, 0.4);
    }
    
    .btn-instagram:active {
      transform: translateY(0);
    }
    
    /* Estilos para las tarjetas de Instagram */
    .instagram-card {
      border: none;
      background: transparent;
      transition: all 0.3s ease;
      margin-bottom: 0;
      display: flex;
      justify-content: center;
    }
    
    .instagram-card:hover {
      transform: translateY(-2px);
    }
    
    .instagram-preview {
      min-height: 120px;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.3s ease;
    }
    
    .instagram-preview:hover {
      background-color: #f8f9fa;
      border-color: #e6683c;
    }
    
    /* Estilos para el embed de Instagram */
    .instagram-embed {
      min-height: 120px;
      border-radius: 8px;
      overflow: hidden;
      background: transparent;
      padding: 0;
      border: none;
      box-shadow: none;
    }
    
    .instagram-embed iframe {
      width: 100%;
      min-height: 400px;
      border: none;
      border-radius: 8px;
      box-shadow: none;
    }
    
    .instagram-embed blockquote {
      margin: 0;
      padding: 0;
    }
    
    .instagram-embed .instagram-media {
      margin: 0 auto !important;
      max-width: 100% !important;
      border-radius: 8px;
    }
    
    /* Contenedor del embed con mejor presentación */
    .instagram-embed-container {
      text-align: center;
      background: transparent;
      border-radius: 8px;
      overflow: hidden;
      margin: 0;
      padding: 0;
      width: 100%;
      max-width: 100%;
    }
    
    /* Botón ver más */
    .btn-ver-mas {
      background: linear-gradient(45deg, #667eea 0%, #764ba2 100%);
      color: white;
      padding: 0.75rem 1.5rem;
      border-radius: 25px;
      font-weight: 600;
      text-decoration: none;
      transition: all 0.3s ease;
      display: inline-flex;
      align-items: center;
      box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
    }
    
    .btn-ver-mas:hover {
      transform: translateY(-2px);
      box-shadow: 0 6px 20px rgba(102, 126, 234, 0.4);
      color: white;
    }
    
    /* Animación de scroll suave */
    html {
      scroll-behavior: smooth;
    }
    
    /* Responsive para la sección de Instagram */
    @media (max-width: 768px) {
      .instagram-card {
        margin-bottom: 1rem;
      }
      
      .btn-instagram {
        padding: 0.75rem 1.5rem;
        font-size: 1rem;
      }
      
      .instagram-embed-container {
        width: 100%;
        max-width: 100%;
      }
    }
    
    /* Animación pulse para efectos visuales */
    @keyframes pulse {
      0% {
        transform: scale(1);
      }
      50% {
        transform: scale(1.02);
      }
      100% {
        transform: scale(1);
      }
    }