/* MIXED CSS PACK */
/* Template: estrilogic.com.ar/index.html */
/* Template mtime: 2025-10-23 22:30:53 */

/* external link (no embedded): https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css */
/* external link (no embedded): https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css */
/* external link (no embedded): https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap */

/* ===== INLINE <style> BLOCK #1 ===== */
:root {
      --primary: #0d6efd;
      --primary-dark: #0a58ca;
      --primary-light: #3d8bfd;
      --secondary: #6c757d;
      --success: #198754;
      --dark: #0f1113;
      --soft: #22262a;
      --text: #212529;
      --light: #f8f9fa;
      --accent: #9aa4ae;
      --link: #e6e9ec;
      --whatsapp: #25D366;
      --gradient-primary: linear-gradient(135deg, #0d6efd 0%, #0a58ca 100%);
      --gradient-dark: linear-gradient(135deg, #0f1113 0%, #22262a 100%);
      --gradient-light: linear-gradient(135deg, #f9fbff 0%, #f0f5ff 100%);
      --gradient-hero: linear-gradient(135deg, #0d6efd 0%, #0dcaf0 100%);
      --gradient-silver: linear-gradient(135deg, #c0c0c0 0%, #e8e8e8 50%, #a0a0a0 100%);
      --gradient-silver-light: linear-gradient(135deg, #e8e8e8 0%, #f8f8f8 50%, #d8d8d8 100%);
      --gradient-silver-dark: linear-gradient(135deg, #a0a0a0 0%, #c0c0c0 50%, #808080 100%);
      --shadow-sm: 0 2px 12px rgba(0,0,0,0.08);
      --shadow-md: 0 8px 30px rgba(0,0,0,0.12);
      --shadow-lg: 0 15px 50px rgba(0,0,0,0.15);
      --shadow-xl: 0 25px 60px rgba(0,0,0,0.2);
      --border-radius: 12px;
      --border-radius-lg: 20px;
      --border-radius-xl: 30px;
      --transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
      --transition-slow: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }

    /* ====== Base ====== */
    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }
    
    html {
      scroll-behavior: smooth;
    }
    
    body {
      background: #fff;
      color: var(--text);
      font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif;
      line-height: 1.7;
      overflow-x: hidden;
      font-weight: 400;
    }
    
    .container-narrow {
      max-width: 1200px;
      margin: 0 auto;
    }
    
    .section-title {
      font-weight: 800;
      letter-spacing: -0.5px;
      position: relative;
      display: inline-block;
      font-size: clamp(2rem, 4vw, 3rem);
      margin-bottom: 1.5rem;
    }
    
    .section-title::after {
      content: '';
      position: absolute;
      bottom: -12px;
      left: 0;
      width: 80px;
      height: 6px;
      background: var(--gradient-silver);
      border-radius: 3px;
      transition: var(--transition);
    }
    
    .text-center .section-title::after {
      left: 50%;
      transform: translateX(-50%);
    }
    
    .section-title:hover::after {
      width: 120px;
    }
    
    .muted {
      color: #6b737b;
    }
    
    a {
      text-decoration: none;
      transition: var(--transition);
    }
    
    /* ====== Navbar: Ultra Moderna ====== */
    .navbar {
      box-shadow: var(--shadow-sm);
      background: rgba(255, 255, 255, 0.95);
      backdrop-filter: blur(20px);
      padding: 1rem 0;
      transition: var(--transition-slow);
      border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }
    
    .navbar.scrolled {
      padding: 0.7rem 0;
      box-shadow: var(--shadow-md);
      background: rgba(255, 255, 255, 0.98);
    }
    
    .navbar-brand img {
      transition: var(--transition);
      filter: drop-shadow(0 2px 4px rgba(0,0,0,0.1));
    }
    
    .navbar-brand:hover img {
      transform: scale(1.05);
    }
    
    .navbar .nav-link {
      font-weight: 600;
      color: #1d232a;
      position: relative;
      padding: 0.7rem 1.2rem !important;
      border-radius: 10px;
      transition: var(--transition);
      margin: 0 0.2rem;
    }
    
    .navbar .nav-link:hover, 
    .navbar .nav-link:focus {
      color: var(--primary);
      background: rgba(13, 110, 253, 0.08);
      transform: translateY(-2px);
    }
    
    .navbar .nav-link::after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 50%;
      width: 0;
      height: 3px;
      background: var(--gradient-silver);
      transition: var(--transition);
      transform: translateX(-50%);
      border-radius: 2px;
    }
    
    .navbar .nav-link:hover::after {
      width: 70%;
    }
    
    .navbar .btn-primary {
      background: var(--gradient-silver);
      border: none;
      border-radius: 12px;
      font-weight: 700;
      padding: 0.7rem 1.5rem;
      transition: var(--transition);
      box-shadow: 0 6px 20px rgba(192, 192, 192, 0.3);
      position: relative;
      overflow: hidden;
      color: #333;
    }
    
    .navbar .btn-primary::before {
      content: '';
      position: absolute;
      top: 0;
      left: -100%;
      width: 100%;
      height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
      transition: var(--transition-slow);
    }
    
    .navbar .btn-primary:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 25px rgba(192, 192, 192, 0.4);
    }
    
    .navbar .btn-primary:hover::before {
      left: 100%;
    }
    
    .navbar .navbar-toggler {
      border: 1px solid rgba(29, 35, 42, 0.1);
      padding: 0.5rem 0.7rem;
      border-radius: 10px;
      transition: var(--transition);
      background: rgba(255, 255, 255, 0.8);
    }
    
    .navbar .navbar-toggler:focus {
      box-shadow: none;
    }
    
    .navbar .navbar-toggler .tog-dot {
      width: 24px;
      height: 2px;
      background: #1d232a;
      display: block;
      margin: 5px 0;
      border-radius: 2px;
      transition: var(--transition);
    }
    
    .navbar .navbar-toggler[aria-expanded="true"] .tog-dot:nth-child(1) {
      transform: rotate(45deg) translate(6px, 6px);
    }
    
    .navbar .navbar-toggler[aria-expanded="true"] .tog-dot:nth-child(2) {
      opacity: 0;
    }
    
    .navbar .navbar-toggler[aria-expanded="true"] .tog-dot:nth-child(3) {
      transform: rotate(-45deg) translate(6px, -6px);
    }

    /* ====== HERO ULTRA MODERNO ====== */
    .hero-ultimate {
      background: var(--gradient-light);
      position: relative;
      padding: 0;
      font-family: 'Inter', system-ui, -apple-system, sans-serif;
      overflow: hidden;
      min-height: 100vh;
      display: flex;
      align-items: center;
    }
    
    /* Efectos de fondo avanzados */
    .hero-ultimate::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: 
        radial-gradient(circle at 20% 80%, rgba(192, 192, 192, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(232, 232, 232, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 40% 40%, rgba(160, 160, 160, 0.03) 0%, transparent 50%);
      z-index: 0;
    }
    
    .hero-ultimate::after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: 
        linear-gradient(135deg, rgba(255,255,255,0.8) 0%, transparent 30%),
        linear-gradient(225deg, rgba(255,255,255,0.6) 0%, transparent 30%);
      z-index: 0;
    }
    
    .hero-container-ultimate {
      max-width: 1400px;
      margin: 0 auto;
      padding: 100px 40px;
      position: relative;
      z-index: 2;
      display: grid;
      grid-template-columns: 1.2fr 1fr;
      gap: 80px;
      align-items: center;
    }
    
    /* Columna de contenido */
    .hero-content-ultimate {
      padding-right: 40px;
    }
    
    .hero-brand-ultimate {
      margin-bottom: 30px;
    }
    
    .hero-logo-ultimate {
      height: 70px;
      width: auto;
      filter: drop-shadow(0 6px 12px rgba(15, 23, 42, 0.15));
      transition: var(--transition);
    }
    
    .hero-logo-ultimate:hover {
      transform: scale(1.05);
      filter: drop-shadow(0 8px 16px rgba(15, 23, 42, 0.2));
    }
    
    .hero-title-ultimate {
      font-size: clamp(2.4rem, 4.5vw, 3.8rem);
      font-weight: 900;
      line-height: 1.1;
      letter-spacing: -0.02em;
      margin-bottom: 30px;
      background: linear-gradient(135deg, #0f172a 0%, #808080 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      position: relative;
    }
    
    .hero-title-ultimate::after {
      content: '';
      position: absolute;
      bottom: -15px;
      left: 0;
      width: 100px;
      height: 6px;
      background: var(--gradient-silver);
      border-radius: 3px;
    }
    
    .hero-lead-ultimate {
      font-size: 1.3rem;
      line-height: 1.7;
      color: #475569;
      margin-bottom: 40px;
      max-width: 90%;
      font-weight: 500;
    }
    
    /* Chips mejoradas */
    .hero-chips-ultimate {
      display: flex;
      flex-wrap: wrap;
      gap: 15px;
      margin-bottom: 50px;
    }
    
    .hero-chip-ultimate {
      background: rgba(255, 255, 255, 0.9);
      backdrop-filter: blur(10px);
      border: 1px solid rgba(226, 232, 240, 0.8);
      color: #0f172a;
      padding: 12px 20px;
      border-radius: 50px;
      font-weight: 700;
      font-size: 0.95rem;
      box-shadow: 0 4px 15px rgba(15, 23, 42, 0.08);
      transition: all 0.3s ease;
      position: relative;
      overflow: hidden;
    }
    
    .hero-chip-ultimate::before {
      content: '';
      position: absolute;
      top: 0;
      left: -100%;
      width: 100%;
      height: 100%;
      background: linear-gradient(90deg, transparent, rgba(192, 192, 192, 0.1), transparent);
      transition: var(--transition-slow);
    }
    
    .hero-chip-ultimate:hover {
      transform: translateY(-5px);
      box-shadow: 0 8px 20px rgba(15, 23, 42, 0.15);
      border-color: #a0a0a0;
    }
    
    .hero-chip-ultimate:hover::before {
      left: 100%;
    }
    
    /* Botones mejorados */
    .hero-actions-ultimate {
      display: flex;
      gap: 20px;
      flex-wrap: wrap;
      margin-bottom: 40px;
    }
    
    .hero-btn-primary {
      background: var(--gradient-silver);
      color: #333;
      border: none;
      border-radius: 15px;
      padding: 18px 35px;
      font-weight: 800;
      font-size: 1.1rem;
      box-shadow: 0 8px 25px rgba(192, 192, 192, 0.4);
      transition: var(--transition);
      display: inline-flex;
      align-items: center;
      gap: 12px;
      position: relative;
      overflow: hidden;
    }
    
    .hero-btn-primary::before {
      content: '';
      position: absolute;
      top: 0;
      left: -100%;
      width: 100%;
      height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
      transition: var(--transition-slow);
    }
    
    .hero-btn-primary:hover {
      transform: translateY(-5px);
      box-shadow: 0 15px 35px rgba(192, 192, 192, 0.5);
    }
    
    .hero-btn-primary:hover::before {
      left: 100%;
    }
    
    .hero-btn-outline {
      background: white;
      color: #808080;
      border: 2px solid #e2e8f0;
      border-radius: 15px;
      padding: 18px 35px;
      font-weight: 800;
      font-size: 1.1rem;
      box-shadow: 0 4px 15px rgba(15, 23, 42, 0.1);
      transition: var(--transition);
      display: inline-flex;
      align-items: center;
      gap: 12px;
      position: relative;
      overflow: hidden;
    }
    
    .hero-btn-outline::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 0;
      height: 100%;
      background: var(--gradient-silver);
      transition: var(--transition);
      z-index: -1;
    }
    
    .hero-btn-outline:hover {
      transform: translateY(-5px);
      border-color: #a0a0a0;
      box-shadow: 0 8px 20px rgba(192, 192, 192, 0.2);
      color: #333;
    }
    
    .hero-btn-outline:hover::before {
      width: 100%;
    }
    
    /* Ubicación */
    .hero-location-ultimate {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-top: 30px;
      color: #64748b;
      font-size: 1rem;
      font-weight: 500;
    }
    
    /* Columna visual */
    .hero-visual-ultimate {
      position: relative;
      perspective: 1000px;
    }
    
    .hero-visual-container {
      background: white;
      border-radius: var(--border-radius-xl);
      padding: 40px;
      box-shadow: var(--shadow-xl);
      border: 1px solid rgba(226, 232, 240, 0.8);
      position: relative;
      overflow: hidden;
      transform-style: preserve-3d;
      transition: var(--transition);
    }
    
    .hero-visual-container::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 8px;
      background: var(--gradient-silver);
      border-radius: var(--border-radius-xl) var(--border-radius-xl) 0 0;
    }
    
    .hero-visual-container::after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: 
        radial-gradient(circle at 30% 70%, rgba(192, 192, 192, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 70% 30%, rgba(232, 232, 232, 0.05) 0%, transparent 50%);
      z-index: 0;
    }
    
    .hero-product-showcase {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 25px;
      position: relative;
      z-index: 1;
    }
    
    .hero-product-item {
      background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
      border-radius: 18px;
      padding: 25px 20px;
      text-align: center;
      border: 1px solid #e2e8f0;
      transition: var(--transition);
      position: relative;
      overflow: hidden;
    }
    
    .hero-product-item::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 4px;
      background: var(--gradient-silver);
      transform: scaleX(0);
      transition: var(--transition);
      transform-origin: left;
    }
    
    .hero-product-item:hover {
      transform: translateY(-10px) rotateX(5deg);
      box-shadow: var(--shadow-lg);
    }
    
    .hero-product-item:hover::before {
      transform: scaleX(1);
    }
    
    .hero-product-icon {
      width: 70px;
      height: 70px;
      margin: 0 auto 15px;
      background: var(--gradient-silver);
      border-radius: 18px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #333;
      font-size: 1.8rem;
      box-shadow: 0 6px 15px rgba(192, 192, 192, 0.3);
      transition: var(--transition);
    }
    
    .hero-product-item:hover .hero-product-icon {
      transform: scale(1.1) rotate(5deg);
      box-shadow: 0 8px 20px rgba(192, 192, 192, 0.4);
    }
    
    .hero-product-title {
      font-weight: 800;
      color: #0f172a;
      margin-bottom: 10px;
      font-size: 1.1rem;
    }
    
    .hero-product-desc {
      font-size: 0.9rem;
      color: #64748b;
      line-height: 1.5;
    }
    
    /* Elementos decorativos avanzados */
    .hero-decoration {
      position: absolute;
      z-index: 0;
      border-radius: 50%;
    }
    
    .hero-decoration-1 {
      width: 300px;
      height: 300px;
      background: radial-gradient(circle, rgba(192, 192, 192, 0.08) 0%, transparent 70%);
      top: 10%;
      right: 5%;
      animation: float 8s ease-in-out infinite;
    }
    
    .hero-decoration-2 {
      width: 200px;
      height: 200px;
      background: radial-gradient(circle, rgba(232, 232, 232, 0.06) 0%, transparent 70%);
      bottom: 20%;
      left: 3%;
      animation: float 10s ease-in-out infinite reverse;
    }
    
    .hero-decoration-3 {
      width: 150px;
      height: 150px;
      background: radial-gradient(circle, rgba(160, 160, 160, 0.05) 0%, transparent 70%);
      top: 60%;
      right: 20%;
      animation: float 12s ease-in-out infinite;
    }
    
    @keyframes float {
      0%, 100% {
        transform: translateY(0) rotate(0deg);
      }
      50% {
        transform: translateY(-20px) rotate(5deg);
      }
    }
    
    /* Responsive */
    @media (max-width: 1200px) {
      .hero-container-ultimate {
        gap: 60px;
      }
    }
    
    @media (max-width: 992px) {
      .hero-container-ultimate {
        grid-template-columns: 1fr;
        gap: 50px;
        text-align: center;
        padding: 80px 30px;
      }
      
      .hero-content-ultimate {
        padding-right: 0;
      }
      
      .hero-lead-ultimate {
        max-width: 100%;
      }
      
      .hero-chips-ultimate {
        justify-content: center;
      }
      
      .hero-actions-ultimate {
        justify-content: center;
      }
    }
    
    @media (max-width: 768px) {
      .hero-container-ultimate {
        padding: 60px 20px;
      }
      
      .hero-actions-ultimate {
        flex-direction: column;
        align-items: center;
      }
      
      .hero-btn-primary,
      .hero-btn-outline {
        width: 100%;
        max-width: 300px;
        justify-content: center;
      }
      
      .hero-product-showcase {
        grid-template-columns: 1fr;
      }
      
      .hero-decoration-1,
      .hero-decoration-2,
      .hero-decoration-3 {
        display: none;
      }
    }

    /* ====== Secciones mejoradas ====== */
    section {
      padding: clamp(100px, 12vw, 150px) 0;
      position: relative;
    }
    
    .bg-light {
      background: var(--gradient-light) !important;
    }
    
    /* Cards mejoradas */
    .soft-card {
      border: 1px solid rgba(226, 232, 240, 0.8);
      border-radius: var(--border-radius-xl);
      padding: 2.5rem;
      background: rgba(255, 255, 255, 0.7);
      backdrop-filter: blur(10px);
      box-shadow: var(--shadow-sm);
      transition: var(--transition);
      height: 100%;
      position: relative;
      overflow: hidden;
    }
    
    .soft-card::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 6px;
      background: var(--gradient-silver);
      transform: scaleX(0);
      transition: var(--transition);
      transform-origin: left;
    }
    
    .soft-card:hover {
      transform: translateY(-10px);
      box-shadow: var(--shadow-lg);
    }
    
    .soft-card:hover::before {
      transform: scaleX(1);
    }
    
    .soft-card h5 {
      font-weight: 800;
      margin-bottom: 1.2rem;
      display: flex;
      align-items: center;
      font-size: 1.3rem;
    }
    
    .soft-card h5 i {
      margin-right: 0.7rem;
      font-size: 1.4rem;
      background: var(--gradient-silver);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
    }

    /* Icon bullets mejorados */
    .icon-li {
      display: flex;
      gap: 1.2rem;
      align-items: flex-start;
      margin-bottom: 1.5rem;
    }
    
    .icon-li i {
      font-size: 1.6rem;
      background: var(--gradient-silver);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      margin-top: 0.1rem;
      flex-shrink: 0;
      transition: var(--transition);
    }
    
    .icon-li:hover i {
      transform: scale(1.2);
    }

    /* ====== Ticker / Carousel mejorado ====== */
    .square-500 {
      width: 100%;
      max-width: 550px;
      aspect-ratio: 1/1;
      margin-inline: auto;
      background: #000;
      border-radius: var(--border-radius-xl);
      overflow: hidden;
      box-shadow: var(--shadow-xl);
      transition: var(--transition);
      position: relative;
    }
    
    .square-500::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(45deg, rgba(192, 192, 192, 0.1), rgba(232, 232, 232, 0.1));
      opacity: 0;
      transition: var(--transition);
      z-index: 1;
    }
    
    .square-500:hover {
      transform: translateY(-10px) scale(1.02);
      box-shadow: 0 25px 60px rgba(0, 0, 0, 0.25);
    }
    
    .square-500:hover::before {
      opacity: 1;
    }
    
    .square-500 .carousel-item,
    .square-500 img {
      width: 100%;
      height: 100%;
    }
    
    .square-500 img {
      object-fit: cover;
      background: #000;
      transition: transform 0.8s ease;
    }
    
    .square-500:hover img {
      transform: scale(1.1);
    }
    
    .carousel-control-prev, 
    .carousel-control-next {
      width: 60px;
      height: 60px;
      background: rgba(255, 255, 255, 0.9);
      border-radius: 50%;
      top: 50%;
      transform: translateY(-50%);
      margin: 0 20px;
      filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.3));
      transition: var(--transition);
      opacity: 0.8;
    }
    
    .carousel-control-prev:hover, 
    .carousel-control-next:hover {
      background: white;
      transform: translateY(-50%) scale(1.1);
      opacity: 1;
    }

    /* ====== Footer mejorado ====== */
    footer {
      background: var(--gradient-dark);
      color: #c7cdd4;
      position: relative;
      overflow: hidden;
    }
    
    footer::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 6px;
      background: var(--gradient-silver);
    }
    
    footer::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: 
        radial-gradient(circle at 20% 80%, rgba(192, 192, 192, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(232, 232, 232, 0.05) 0%, transparent 50%);
      z-index: 0;
    }
    
    footer a {
      color: #e7ebef;
      transition: var(--transition);
      position: relative;
    }
    
    footer a::after {
      content: '';
      position: absolute;
      bottom: -2px;
      left: 0;
      width: 0;
      height: 2px;
      background: var(--gradient-silver);
      transition: var(--transition);
    }
    
    footer a:hover {
      color: #fff;
    }
    
    footer a:hover::after {
      width: 100%;
    }
    
    footer .small {
      color: #9aa4ae;
    }
    
    .footer-logo {
      transition: var(--transition);
    }
    
    .footer-logo:hover {
      transform: translateY(-5px);
    }
    
    /* Mejoras al accordion */
    .accordion-button {
      font-weight: 700;
      padding: 1.5rem 1.5rem;
      border: none;
      box-shadow: none;
      background: rgba(255, 255, 255, 0.7);
      backdrop-filter: blur(10px);
      border-radius: 12px !important;
      transition: var(--transition);
    }
    
    .accordion-button:not(.collapsed) {
      background: rgba(192, 192, 192, 0.08);
      color: #808080;
      box-shadow: none;
    }
    
    .accordion-button::after {
      background-size: 1.2rem;
    }
    
    .accordion-item {
      border: 1px solid rgba(226, 232, 240, 0.8);
      border-radius: 12px !important;
      overflow: hidden;
      margin-bottom: 1rem;
      box-shadow: var(--shadow-sm);
      background: transparent;
    }
    
    .accordion-item:last-of-type {
      margin-bottom: 0;
    }
    
    /* Mejoras al formulario */
    .form-control, .form-select {
      padding: 0.9rem 1.2rem;
      border: 1px solid #e1e5e9;
      border-radius: 12px;
      transition: var(--transition);
      background: rgba(255, 255, 255, 0.8);
    }
    
    .form-control:focus, .form-select:focus {
      border-color: #a0a0a0;
      box-shadow: 0 0 0 0.3rem rgba(192, 192, 192, 0.15);
      background: white;
    }
    
    .btn-primary {
      background: var(--gradient-silver);
      border: none;
      border-radius: 12px;
      font-weight: 700;
      padding: 0.9rem 1.8rem;
      transition: var(--transition);
      position: relative;
      overflow: hidden;
      color: #333;
    }
    
    .btn-primary::before {
      content: '';
      position: absolute;
      top: 0;
      left: -100%;
      width: 100%;
      height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
      transition: var(--transition-slow);
    }
    
    .btn-primary:hover {
      transform: translateY(-3px);
      box-shadow: 0 8px 20px rgba(192, 192, 192, 0.4);
    }
    
    .btn-primary:hover::before {
      left: 100%;
    }
    
    .btn-outline-success {
      border-radius: 12px;
      font-weight: 700;
      padding: 0.9rem 1.8rem;
      transition: var(--transition);
      position: relative;
      overflow: hidden;
    }
    
    .btn-outline-success::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 0;
      height: 100%;
      background: var(--success);
      transition: var(--transition);
      z-index: -1;
    }
    
    .btn-outline-success:hover {
      transform: translateY(-3px);
      border-color: var(--success);
      color: white;
    }
    
    .btn-outline-success:hover::before {
      width: 100%;
    }
    
    /* Mejoras a las alertas */
    .alert {
      border-radius: 15px;
      border: none;
      padding: 1.2rem 1.8rem;
      box-shadow: var(--shadow-md);
    }
    
    /* Responsive adjustments */
    @media (max-width: 768px) {
      .section-title::after {
        width: 60px;
      }
      
      .soft-card {
        padding: 2rem;
      }
    }
    
    @media (max-width: 576px) {
      .soft-card {
        padding: 1.5rem;
      }
      
      .square-500 {
        border-radius: 15px;
      }
      
      section {
        padding: 80px 0;
      }
    }
    /* Texto al lado del logo */
.navbar .brand-text{
  font-weight: 800;
  font-size: 1.05rem;           /* ajustá si lo querés más grande */
  letter-spacing: .2px;
  line-height: 1;
  color: #0f172a;
  margin-top: 2px;              /* microalineación óptica con el logo */
  white-space: nowrap;
}

.navbar .brand-text-strong{
  background: var(--gradient-silver);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;           /* "Estri" con degradado */
}

/* Hover sutil en brand */
.navbar .navbar-brand:hover .brand-text{
  color: #808080;
}

/* Responsive: ocultar texto en pantallas muy chicas si hace falta */
@media (max-width: 380px){
  .navbar .brand-text{ display: none; }
}

/* ===== INLINE <style> BLOCK #2 ===== */
/* SAFE GUARD: prevent accidental horizontal scroll on small screens */
html, body { max-width: 100%; overflow-x: hidden; }
[class*="col-"] { min-width: 0; } /* prevent flex overflow */
.navbar .navbar-toggler { z-index: 1040; } /* ensure hamburger stays clickable */

/* ===== INLINE <style> BLOCK #3 ===== */
/* === Scoped Mobile Overflow Hotfix (structure untouched) === */
@media (max-width: 576px){
  html, body { max-width: 100%; overflow-x: hidden; }
  /* Bootstrap rows can overflow if a .row is outside .container */
  .row { margin-left: 0; margin-right: 0; }
  /* Prevent any internal navbar element from pushing width */
  .navbar, .navbar > .container, .navbar > .container-fluid { overflow-x: clip; }
  /* Avoid long words breaking layout */
  h1, h2, h3, .display-1, .display-2, .display-3 { word-wrap: break-word; overflow-wrap: anywhere; }
  /* Media should never exceed viewport width */
  img, svg, video, canvas { max-width: 100%; height: auto; }
}

/* ===== INLINE <style> BLOCK #4 ===== */
/* ===== Mobile Navbar Fix: smaller logo + tighter spacing (<=576px) ===== */
@media (max-width: 576px){
  .navbar { padding: .5rem 0 !important; }
  .navbar .container, .navbar .container-fluid { gap: .5rem; }
  .navbar-brand { gap: .4rem !important; }
  .navbar-brand img.brand-logo { max-height: 34px !important; height: 34px !important; width: auto !important; }
  /* ocultar texto al lado del logo en pantallas chicas para que no desborde */
  .navbar .brand-text { display: none !important; }
  /* botón hamburguesa compacto y siempre clickeable */
  .navbar .navbar-toggler { padding: .35rem .5rem !important; border-radius: 8px; z-index: 1050; }
  .navbar .tog-dot { width: 22px; height: 2px; margin: 4px 0; }
  /* evitar que el collapse empuje el ancho */
  .navbar .collapse.navbar-collapse { max-width: 100vw; overflow-x: hidden; }
}
/* Quitar ocultamiento en mobile */
@media (max-width: 576px){
  .navbar .brand-text{ 
    display:inline-block !important;   /* antes lo ocultabas */
    font-size:.95rem;                  /* bajamos tamaño para que no desborde */
  }
  .navbar-brand{ gap:.35rem !important; } /* menos espacio entre logo y texto */
}

/* Versión desktop: ya la tenés, pero por si acaso */
.navbar .brand-text{
  font-weight:800; letter-spacing:.2px; line-height:1; white-space:nowrap;
}
.navbar .brand-text-strong{
  background: var(--gradient-silver);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* Badge responsive */
.badge {
  font-size: 1rem !important;
}
@media (max-width: 576px) {
  .badge {
    font-size: 0.85rem !important;
    padding: 0.5rem 1rem !important;
  }
}

/* ===== INLINE <style> BLOCK #5 ===== */
.hero-ultimate .hero-container-ultimate{padding:64px 28px;gap:56px}
      .hero-ultimate .hero-content-ultimate{padding-right:16px}
  
      /* LOGO ENORME Y CENTRADO */
      .hero-ultimate .brand-right{
        display:flex; justify-content:center; align-items:center;
        margin-bottom:16px;
      }
      .hero-ultimate .brand-right img{
        height:420px;             /* << MAS GRANDE */
        width:auto; max-width:100%;
        filter: drop-shadow(0 18px 34px rgba(15,23,42,.22));
      }
  
      /* Contenedor de cards más angosto para resaltar el logo */
      .hero-ultimate .hero-visual-container{
        width:clamp(320px,30vw,460px);
        padding:14px; border-radius:20px;
        background:rgba(255,255,255,.92);
        border:1px solid rgba(226,232,240,.9);
        box-shadow:0 20px 44px rgba(2,6,23,.10);
        margin-inline:auto;
      }
  
      /* Cards mini */
      .hero-ultimate .feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
      .hero-ultimate .fcard{
        border-radius:14px;padding:10px 10px 12px;
        background:linear-gradient(180deg,#f8fbff 0%, #f2f6fb 100%);
        border:1px solid #e6ebf2; box-shadow:0 6px 14px rgba(2,6,23,.06);
        transition:transform .2s ease, box-shadow .2s ease;
      }
      .hero-ultimate .fcard:hover{transform:translateY(-4px);box-shadow:0 12px 22px rgba(2,6,23,.10)}
      .hero-ultimate .f-icon{
        width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;
        background: var(--gradient-silver);color:#333;font-size:1.05rem;margin-bottom:6px;
        box-shadow:0 8px 16px rgba(192, 192, 192,.30);
      }
      .hero-ultimate .f-title{font-weight:800;font-size:.95rem;color:#0f172a;margin-bottom:4px;letter-spacing:-.1px}
      .hero-ultimate .f-desc{font-size:.78rem;color:#5b6878;line-height:1.35;margin:0}
  
      /* Breakpoints */
      @media (min-width:1600px){
        .hero-ultimate .brand-right img{height:500px;} /* XL aún más grande */
      }
      @media (max-width:1200px){
        .hero-ultimate .brand-right img{height:320px;}
      }
      @media (max-width:992px){
        .hero-ultimate .hero-container-ultimate{grid-template-columns:1fr;gap:34px}
        .hero-ultimate .brand-right img{height:220px}
        .hero-ultimate .hero-visual-container{width:100%;max-width:480px}
      }
      @media (max-width:576px){
        .hero-ultimate .brand-right img{height:140px}
        .hero-ultimate .hero-visual-container{padding:12px}
        .hero-ultimate .feature-grid{grid-template-columns:1fr;gap:10px}
      }

/* ===== INLINE <style> BLOCK #6 ===== */
/* Scope local */
      .quienes-clean{position:relative;overflow:hidden}
      .quienes-clean .visual-frame{
        width:100%; max-width:560px; aspect-ratio:1/1;
        margin-inline:auto;
        border-radius:22px;
        background: rgba(255,255,255,.75);               /* SIN FONDO NEGRO */
        border:1px solid #e6ebf2;
        box-shadow:0 22px 50px rgba(2,6,23,.10);
        position:relative; overflow:hidden; isolation:isolate;
        transform: translateZ(0);
        transition: transform .35s ease, box-shadow .35s ease;
      }
      /* Línea superior sutil */
      .quienes-clean .visual-frame::before{
        content:""; position:absolute; inset:0 0 auto 0; height:8px;
        background: var(--gradient-silver);
        opacity:.9; z-index:2;
      }
      /* Brillo diagonal animado */
      .quienes-clean .visual-frame::after{
        content:""; position:absolute; inset:-40% -40%;
        background:linear-gradient(115deg, transparent 45%, rgba(255,255,255,.35) 50%, transparent 55%);
        transform: rotate(5deg) translateX(-30%);
        animation: shine 4.5s ease-in-out infinite;
        z-index:1; pointer-events:none;
      }
      @keyframes shine{
        0%{transform: rotate(5deg) translateX(-30%)}
        100%{transform: rotate(5deg) translateX(30%)}
      }
      /* Imagen */
      .quienes-clean .visual-frame img{
        position:relative; z-index:0; width:100%; height:100%;
        object-fit: contain; background: transparent;   /* sin fondo */
        transform: scale(1.02);
        transition: transform .35s ease, filter .35s ease;
        filter: drop-shadow(0 10px 20px rgba(192, 192, 192,.15));
      }
      .quienes-clean .visual-frame:hover{
        transform: translateY(-6px);
        box-shadow:0 30px 70px rgba(2,6,23,.16);
      }
      .quienes-clean .visual-frame:hover img{ transform: scale(1.05) }
  
      /* Blobs decorativos (muy sutiles) */
      .quienes-clean .blob{
        position:absolute; border-radius:50%; filter: blur(20px);
        opacity:.25; pointer-events:none; z-index:0;
        animation: float 12s ease-in-out infinite;
      }
      .quienes-clean .blob.b1{width:320px;height:320px;right:-80px;top:-60px;
        background: radial-gradient(circle, rgba(192, 192, 192,.25), transparent 60%);}
      .quienes-clean .blob.b2{width:280px;height:280px;left:-80px;bottom:-60px; 
        background: radial-gradient(circle, rgba(232, 232, 232,.25), transparent 60%); 
        animation-direction: reverse;}
      @keyframes float{
        0%,100%{ transform: translateY(0) }
        50%{ transform: translateY(-18px) }
      }
  
      /* Reveal suave al entrar (se acopla a tu IntersectionObserver) */
      .quienes-clean .reveal{
        opacity:0; transform: translateY(26px); transition: opacity .6s ease, transform .6s ease;
      }
      .quienes-clean .reveal.is-visible{
        opacity:1; transform: translateY(0);
      }
      @media (max-width: 576px){
        .quienes-clean .visual-frame{border-radius:18px}
      }

/* ===== INLINE <style> BLOCK #7 ===== */
.placasXL2{padding:64px 0}
    .placasXL2 .plaquita{
      border:1px solid #e6ebf2; border-radius:22px; background:#fff;
      box-shadow:0 14px 34px rgba(2,6,23,.10);
      transition:transform .2s ease, box-shadow .2s ease;
      padding:14px; height:100%; cursor: zoom-in;
    }
    .placasXL2 .plaquita:hover{transform:translateY(-6px); box-shadow:0 22px 60px rgba(2,6,23,.16)}

    /* Plaquitas GRANDES, sin recorte en desktop */
    .placasXL2 .plaquita-media{
      height: clamp(360px, 44vw, 700px);
      border-radius:16px; background:#fff;
      display:flex; align-items:center; justify-content:center; overflow:hidden;
    }
    @media (min-width:1600px){
      .placasXL2 .plaquita-media{ height: clamp(420px, 40vw, 780px); }
    }

    /* >>> Mobile: 1 por fila y MUCHO más altas (aprovecha la pantalla) */
    @media (max-width: 576px){
      .placasXL2{padding:40px 0}
      .placasXL2 .plaquita-media{
        height: min(68vh, 560px); /* bien grandes en phone, sin recortar */
      }
    }
    @media (max-width: 380px){
      .placasXL2 .plaquita-media{ height: min(72vh, 600px); }
    }

    .placasXL2 img{max-width:100%; max-height:100%; object-fit:contain; display:block}

    /* ===== Modal Lightbox ===== */
    #pxl2Modal .modal-dialog{max-width:min(1280px,96vw)}
    #pxl2Modal .modal-content{background:transparent; border:none}
    #pxl2Modal .viewer{
      position:relative; display:flex; align-items:center; justify-content:center;
      min-height:40vh; text-align:center;
    }
    #pxl2Modal #pxl2Img{
      max-height:85vh; max-width:100%; width:auto; margin:0 auto;
      border-radius:18px; box-shadow:0 32px 90px rgba(0,0,0,.5); background:#000;
    }
    .pxl2-nav{
      position:absolute; top:50%; transform:translateY(-50%);
      width:58px; height:58px; border-radius:50%;
      background:#fff; border:1px solid #e6ebf2; opacity:1;
      display:flex; align-items:center; justify-content:center; z-index:5;
      filter: drop-shadow(0 14px 30px rgba(2,6,23,.24));
    }
    .pxl2-prev{left:12px}
    .pxl2-next{right:12px}
    .pxl2-nav i{font-size:20px}
    .pxl2-counter{
      position:absolute; bottom:8px; right:12px;
      background:rgba(0,0,0,.55); color:#fff; font-weight:700;
      border-radius:10px; padding:6px 10px; font-size:.9rem;
    }
    @media (max-width:576px){
      .pxl2-nav{width:46px;height:46px}
    }

/* ===== INLINE <style> BLOCK #8 ===== */
.carousel-image {
    max-height: 500px;
    width: auto;
    object-fit: contain;
  }
  
  /* Ajustes responsivos */
  @media (max-width: 768px) {
    .carousel-image {
      max-height: 400px;
    }
  }
  
  @media (max-width: 576px) {
    .carousel-image {
      max-height: 300px;
    }
  }

/* ===== INLINE <style> BLOCK #9 ===== */
/* ==== FOOTER STYLES ==== */
  .footer {
    background: #111;
    color: #ccc;
    font-size: 14px;
  }
  .footer-nav a {
    color: #ccc;
    margin: 0 6px;
    text-decoration: none;
    transition: color 0.3s ease;
  }
  .footer-nav a:hover {
    color: #fff;
  }
  .footer-brand img {
    filter: drop-shadow(0 0 3px rgba(255,255,255,0.1));
  }
  .footer hr {
    opacity: 0.2;
  }
  
  /* Ajustes responsive */
  @media (max-width: 576px) {
    .footer {
      padding-top: 20px !important;
      padding-bottom: 15px !important;
    }
    .footer h6 {
      font-size: 16px;
    }
    .footer-nav a {
      display: inline-block;
      margin: 3px 8px;
      font-size: 13px;
    }
    .footer img {
      height: 32px;
    }
  }

/* ===== INLINE <style> BLOCK #10 ===== */
:root{
    --wa:#25D366; --wa-dark:#128C7E; --wa-darker:#075E54;
    /* tonos más industriales para el panel */
    --dark-bg:#0f1116; --darker-bg:#0c121b;
    --light-text:#ffffff; --muted-text:rgba(255,255,255,.7);
  }
  .wa-float{position:fixed; right:18px; bottom:18px; z-index:9999; font-family:inherit;}
  .wa-btn{
    background:linear-gradient(135deg,var(--wa),var(--wa-dark));
    color:#fff; border:0; width:60px; height:60px; border-radius:50%;
    display:grid; place-items:center; box-shadow:0 10px 30px rgba(0,0,0,.25);
    cursor:pointer; transition:transform .3s, box-shadow .3s, background .3s; position:relative; overflow:hidden;
  }
  .wa-btn::after{content:""; position:absolute; inset:0;
    background:radial-gradient(circle at 50% 50%, rgba(255,255,255,.18), rgba(255,255,255,0) 70%);
    opacity:0; transition:opacity .3s;}
  .wa-btn:hover{transform:translateY(-3px) scale(1.05); box-shadow:0 14px 36px rgba(0,0,0,.35);}
  .wa-btn:hover::after{opacity:1;}

  .wa-card{
    position:absolute; right:0; bottom:74px; width:min(360px,92vw);
    background:var(--dark-bg); color:var(--light-text); border-radius:18px; overflow:hidden;
    box-shadow:0 18px 60px rgba(0,0,0,.5); border:1px solid rgba(255,255,255,.08);
    transform:translateY(10px); opacity:0; transition:transform .3s, opacity .3s;
  }
  .wa-card[aria-modal="true"]{transform:translateY(0); opacity:1;}
  .wa-head{display:flex; align-items:center; gap:12px; padding:14px;
    background:linear-gradient(180deg,#121a26,var(--darker-bg)); border-bottom:1px solid rgba(255,255,255,.06);}
  .wa-avatar{width:40px; height:40px; border-radius:8px; background:#101722;
    display:grid; place-items:center; border:1px solid rgba(255,255,255,.08); overflow:hidden;}
  .wa-title{font-weight:700; font-size:1.05rem;}
  .wa-status{font-size:.85rem; color:var(--muted-text); display:flex; align-items:center; gap:6px;}
  .wa-status::before{content:""; width:8px; height:8px; border-radius:50%; background:var(--wa);}
  .wa-close{margin-left:auto; background:transparent; color:#fff; border:0; font-size:24px; cursor:pointer; opacity:.7;
    width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; transition:.2s;}
  .wa-close:hover{opacity:1; background:rgba(255,255,255,.1);}

  .wa-body{padding:12px 14px; max-height:40vh; overflow:auto; background:var(--dark-bg);
    display:flex; flex-direction:column; gap:8px;}
  .wa-bubble{max-width:88%; padding:10px 12px; border-radius:14px; line-height:1.35; box-shadow:0 4px 14px rgba(0,0,0,.25); animation:fadeIn .25s ease;}
  @keyframes fadeIn{from{opacity:0; transform:translateY(5px)} to{opacity:1; transform:none}}
  .wa-bot{background:#0e1622; border:1px solid rgba(255,255,255,.06); align-self:flex-start; border-bottom-left-radius:4px;}
  .wa-user{background:var(--wa-darker); align-self:flex-end; border-bottom-right-radius:4px;}

  .wa-compose{display:grid; grid-template-columns:1fr auto; gap:8px; padding:10px; background:var(--dark-bg); border-top:1px solid rgba(255,255,255,.08);}
  .wa-compose textarea{
    resize:none; border-radius:12px; padding:10px 12px; border:1px solid rgba(255,255,255,.12);
    background:#0b121c; color:var(--light-text); outline:none; min-height:44px; font-family:inherit; transition:.2s;}
  .wa-compose textarea:focus{border-color:var(--wa); box-shadow:0 0 0 2px rgba(37,211,102,.15);}
  .wa-send{background:var(--wa); color:#0b1220; border:0; border-radius:12px; padding:0 16px; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.2s;}
  .wa-send:hover{background:var(--wa-dark); transform:scale(1.05);}

  /* Scrollbar */
  .wa-body::-webkit-scrollbar{width:6px;}
  .wa-body::-webkit-scrollbar-track{background:rgba(255,255,255,.05); border-radius:3px;}
  .wa-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2); border-radius:3px;}
  .wa-body::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.3);}

  @media (max-width:480px){
    .wa-float{right:12px; bottom:12px;}
    .wa-card{width:calc(100vw - 24px); right:0;}
  }