/* MIXED CSS PACK */
/* Template: fidelfiel.com.ar/index.html */
/* Template mtime: 2026-04-01 15:47:29 */

/* external link (no embedded): https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=DM+Sans:wght@400;500;600;700&display=swap */
/* external link (no embedded): https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css */
/* external link (no embedded): https://unpkg.com/aos@2.3.1/dist/aos.css */

/* ===== INLINE <style> BLOCK #1 ===== */
/* ===== VARIABLES ===== */
    :root {
      --accent:      #ff0086;
      --accent-2:    #1f1ab4;
      --accent-3:    #0098df;
      --text:        #12131a;
      --muted:       #5f6472;
      --line:        #dde1ec;
      --bg:          #f1f3f7;        /* base gris frío */
      --bg-white:    #ffffff;
      --bg-soft:     #eef1f7;
      --bg-dark:     #111827;        /* footer / secciones premium */
      --bg-darker:   #0d1320;
      --bg-brand:    #1a1760;        /* azul profundo marca */
      --shadow-sm:   0 4px 18px rgba(15,23,42,.06);
      --shadow-md:   0 16px 40px rgba(15,23,42,.10);
      --shadow-lg:   0 28px 60px rgba(15,23,42,.14);
      --radius:      22px;
      --radius-sm:   16px;
      --container:   1180px;
      --nav-h:       86px;
      --transition:  all 0.38s cubic-bezier(0.2, 0.9, 0.3, 1);

      /* tipografía */
      --font-display: 'Barlow Condensed', sans-serif;
      --font-body:    'DM Sans', sans-serif;
    }

    *, *::before, *::after { box-sizing: border-box; }
    html { scroll-behavior: smooth; width: 100%; overflow-x: clip; }
    body {
      margin: 0; width: 100%; max-width: 100%;
      font-family: var(--font-body);
      color: var(--text);
      background: var(--bg);
      overflow-x: clip;
    }
    img { max-width: 100%; display: block; }
    a { text-decoration: none; color: inherit; }

    .container-custom {
      max-width: var(--container);
      padding: 0 24px;
      margin: 0 auto;
      width: 100%;
    }
    .section { padding: 110px 0; }
    .bg-white-section { background: var(--bg-white); }
    .bg-soft-section  { background: var(--bg-soft); }
    .bg-dark-section  { background: var(--bg-dark); }
    .bg-brand-section { background: var(--bg-brand); }

    /* ===== TIPOGRAFÍA ===== */
    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      font-family: var(--font-body);
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--accent);
      background: rgba(255, 0, 134, 0.07);
      border: 1px solid rgba(255, 0, 134, 0.18);
      padding: 0.55rem 1.1rem;
      border-radius: 100px;
      margin-bottom: 1.4rem;
    }
    .eyebrow::before {
      content: '';
      width: 6px; height: 6px;
      background: var(--accent);
      border-radius: 50%;
      flex-shrink: 0;
    }
    .eyebrow-light {
      color: rgba(255,255,255,0.85);
      background: rgba(255,255,255,0.08);
      border-color: rgba(255,255,255,0.18);
    }
    .eyebrow-light::before { background: rgba(255,255,255,0.8); }

    .section-title {
      font-family: var(--font-display);
      font-size: clamp(2.4rem, 5vw, 3.6rem);
      font-weight: 800;
      line-height: 1.0;
      letter-spacing: -0.01em;
      color: var(--text);
      margin: 0 0 1.2rem;
      text-transform: uppercase;
    }
    .section-title-light { color: #ffffff; }

    .section-subtitle {
      font-size: 1.05rem;
      color: var(--muted);
      max-width: 700px;
      margin: 0 auto 3rem;
      line-height: 1.85;
    }
    .section-subtitle-light { color: rgba(255,255,255,0.72); }

    .text-gradient {
      background: linear-gradient(125deg, var(--accent) 0%, #b200ff 50%, var(--accent-2) 100%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      display: inline;
    }
    .text-gradient-cool {
      background: linear-gradient(125deg, var(--accent-3) 0%, var(--accent-2) 100%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      display: inline;
    }

    /* ===== NAVBAR ===== */
    .navbar {
      --bs-navbar-padding-y: 0;
      min-height: var(--nav-h);
      background: rgba(17, 24, 39, 0.96);
      backdrop-filter: blur(20px);
      border-bottom: 1px solid rgba(255,255,255,0.07);
      box-shadow: 0 4px 30px rgba(0,0,0,0.25);
    }

    .navbar .container-custom {
      min-height: var(--nav-h);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      flex-wrap: wrap;
    }

    .navbar-brand {
      display: flex;
      align-items: center;
      gap: 0.75rem;
      font-family: var(--font-display);
      font-size: 1.4rem;
      font-weight: 800;
      color: #ffffff;
      letter-spacing: 0.03em;
      text-transform: uppercase;
    }
    .navbar-brand img {
      height: 42px;
      width: auto;
      transition: var(--transition);
    }
    .navbar-brand:hover img { transform: scale(1.04); }

    .navbar-nav { gap: 0.15rem; }

    .navbar .nav-link {
      color: rgba(255,255,255,0.78);
      font-weight: 600;
      font-size: 0.88rem;
      letter-spacing: 0.03em;
      padding: 0.65rem 1.1rem !important;
      border-radius: 100px;
      transition: var(--transition);
      text-transform: uppercase;
    }
    .navbar .nav-link:hover {
      color: #fff;
      background: rgba(255,255,255,0.08);
    }

    .navbar-toggler {
      margin-left: auto;
      flex-shrink: 0;
      border: 1px solid rgba(255,255,255,0.2);
      padding: 0.55rem;
      border-radius: 12px;
      background: rgba(255,255,255,0.06);
    }
    .navbar-toggler-icon {
      filter: invert(1);
    }

    .navbar-collapse { flex-basis: 100%; width: 100%; min-width: 0; }

    @media (min-width: 992px) {
      .navbar .container-custom { flex-wrap: nowrap; gap: 0.75rem; }
      .navbar-brand { flex: 0 0 auto; margin-right: 0.75rem; }
      .navbar-collapse {
        flex-basis: auto; width: auto; min-width: 0;
        display: flex !important;
        align-items: center;
        justify-content: flex-end;
        gap: 0.85rem;
      }
      .navbar-nav { flex-wrap: nowrap; align-items: center; gap: 0.05rem; }
      .navbar .nav-link { font-size: 0.82rem; padding: 0.65rem 0.78rem !important; white-space: nowrap; }
      .navbar-collapse .ms-lg-4 {
        margin-top: 0 !important;
        margin-left: 0.65rem !important;
        flex: 0 0 auto;
      }
      .btn-nav { padding: 0.78rem 1.35rem; white-space: nowrap; }
    }

    /* ===== BOTONES ===== */
    .btn-main, .btn-outline-main, .btn-nav, .btn-light-outline {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 0.5rem;
      border-radius: 60px;
      font-family: var(--font-body);
      font-weight: 700;
      padding: 0.95rem 2rem;
      transition: var(--transition);
      border: 2px solid transparent;
      line-height: 1;
      font-size: 0.92rem;
      letter-spacing: 0.03em;
      text-transform: uppercase;
    }
    .btn-main {
      background: linear-gradient(135deg, var(--accent) 0%, #b200ff 50%, var(--accent-2) 100%);
      background-size: 200% 200%;
      color: white;
      box-shadow: 0 12px 30px -6px rgba(255, 0, 134, 0.35);
    }
    .btn-main:hover {
      transform: translateY(-3px);
      box-shadow: 0 20px 40px -6px rgba(255, 0, 134, 0.45);
      color: white;
      background-position: right center;
    }
    .btn-outline-main {
      background: transparent;
      border-color: rgba(255,255,255,0.3);
      color: white;
      backdrop-filter: blur(8px);
    }
    .btn-outline-main:hover {
      border-color: white;
      background: rgba(255,255,255,0.12);
      color: white;
      transform: translateY(-3px);
    }
    .btn-dark-outline {
      background: transparent;
      border-color: rgba(17,17,17,0.2);
      color: var(--text);
    }
    .btn-dark-outline:hover {
      border-color: var(--accent-2);
      color: var(--accent-2);
      transform: translateY(-3px);
    }
    .btn-nav {
      background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
      color: white;
      padding: 0.75rem 1.6rem;
      box-shadow: 0 8px 22px -6px rgba(255, 0, 134, 0.4);
      font-size: 0.82rem;
    }
    .btn-nav:hover {
      transform: translateY(-2px) scale(1.02);
      color: white;
      box-shadow: 0 14px 32px -6px rgba(255, 0, 134, 0.5);
    }

    /* ===== HERO ===== */
    .hero {
      position: relative;
      padding-top: calc(var(--nav-h) + 60px);
      padding-bottom: 120px;
      overflow: hidden;
      background: var(--bg-dark);
    }
    /* Fondo con textura/degradado */
    .hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background:
        radial-gradient(ellipse 80% 60% at 70% 50%, rgba(31,26,180,0.45) 0%, transparent 60%),
        radial-gradient(ellipse 50% 70% at 10% 20%, rgba(255,0,134,0.3) 0%, transparent 55%),
        radial-gradient(ellipse 40% 40% at 90% 80%, rgba(0,152,223,0.2) 0%, transparent 50%);
      z-index: 0;
    }
    /* Puntos / noise sutil */
    .hero::after {
      content: '';
      position: absolute;
      inset: 0;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
      opacity: 0.35;
      z-index: 0;
    }
    .hero > * { position: relative; z-index: 1; }

    .hero-title {
      font-family: var(--font-display);
      font-size: clamp(3rem, 7vw, 5.5rem);
      font-weight: 900;
      line-height: 0.95;
      letter-spacing: -0.01em;
      color: #ffffff;
      margin-bottom: 1.5rem;
      text-transform: uppercase;
    }
    .hero-text {
      font-size: 1.1rem;
      color: rgba(255,255,255,0.72);
      max-width: 580px;
      margin-bottom: 2rem;
      line-height: 1.85;
    }
    .hero-text strong { color: rgba(255,255,255,0.95); }

    .hero-actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 2.5rem; }

    .hero-badges { display: flex; flex-wrap: wrap; gap: 0.75rem; }
    .hero-badge {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      padding: 0.6rem 1.1rem;
      background: rgba(255,255,255,0.08);
      border: 1px solid rgba(255,255,255,0.15);
      backdrop-filter: blur(8px);
      border-radius: 60px;
      font-weight: 600;
      font-size: 0.88rem;
      color: rgba(255,255,255,0.9);
    }
    .hero-badge::before {
      content: '✓';
      color: #4ade80;
      font-weight: 900;
    }

    .hero-visual { position: relative; z-index: 2; }
    .hero-card {
      background: rgba(255,255,255,0.06);
      border-radius: var(--radius);
      box-shadow: 0 40px 80px rgba(0,0,0,0.4);
      padding: 10px;
      border: 1px solid rgba(255,255,255,0.12);
      transition: var(--transition);
      backdrop-filter: blur(12px);
    }
    .hero-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 50px 90px rgba(0,0,0,0.5);
    }
    .hero-media {
      border-radius: calc(var(--radius) - 6px);
      overflow: hidden;
      background: linear-gradient(135deg, rgba(255,0,134,0.1), rgba(31,26,180,0.12));
      min-height: 500px;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .hero-media img {
      width: 100%;
      height: 100%;
      min-height: 500px;
      object-fit: cover;
      transition: var(--transition);
    }
    .hero-card:hover .hero-media img { transform: scale(1.02); }

    .hero-floating {
      position: absolute;
      left: -20px;
      bottom: 30px;
      background: rgba(17,24,39,0.9);
      backdrop-filter: blur(16px);
      border-radius: 20px;
      padding: 1.4rem 1.6rem;
      max-width: 270px;
      border: 1px solid rgba(255,255,255,0.1);
      box-shadow: var(--shadow-lg);
      border-left: 4px solid var(--accent);
    }
    .hero-floating strong {
      font-family: var(--font-display);
      font-size: 1.1rem;
      font-weight: 800;
      display: block;
      margin-bottom: 0.3rem;
      color: #fff;
      text-transform: uppercase;
      letter-spacing: 0.02em;
    }
    .hero-floating span { color: rgba(255,255,255,0.65); font-size: 0.88rem; line-height: 1.5; }

    /* ===== QUIÉNES SOMOS — fondo blanco ===== */
    .about-section { background: var(--bg-white); }

    /* ===== CARDS PREMIUM ===== */
    .card-premium {
      background: var(--bg-white);
      border-radius: var(--radius);
      padding: 2.4rem 2rem;
      height: 100%;
      border: 1px solid rgba(17,17,17,0.07);
      box-shadow: var(--shadow-sm);
      transition: var(--transition);
      position: relative;
      overflow: hidden;
    }
    .card-premium::after {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 3px;
      background: linear-gradient(90deg, var(--accent), var(--accent-2), var(--accent-3));
      transform: scaleX(0);
      transform-origin: left;
      transition: var(--transition);
    }
    .card-premium:hover {
      transform: translateY(-7px);
      box-shadow: var(--shadow-md);
      border-color: rgba(255,0,134,0.15);
    }
    .card-premium:hover::after { transform: scaleX(1); }

    /* Cards en fondo soft */
    .bg-soft-section .card-premium { background: var(--bg-white); }

    /* Card glass para sección oscura */
    .card-glass {
      background: rgba(255,255,255,0.05);
      border: 1px solid rgba(255,255,255,0.1);
      backdrop-filter: blur(12px);
      border-radius: var(--radius);
      padding: 2.4rem 2rem;
      height: 100%;
      transition: var(--transition);
      position: relative;
      overflow: hidden;
    }
    .card-glass:hover {
      transform: translateY(-7px);
      background: rgba(255,255,255,0.08);
      border-color: rgba(255,0,134,0.3);
    }
    .card-glass .card-title { color: #ffffff; }
    .card-glass .card-text { color: rgba(255,255,255,0.65); }
    .card-glass .card-icon {
      background: rgba(255,255,255,0.08);
      color: rgba(255,255,255,0.9);
    }
    .card-glass:hover .card-icon {
      background: linear-gradient(135deg, var(--accent), var(--accent-2));
      color: white;
    }

    .card-icon {
      width: 66px; height: 66px;
      background: linear-gradient(135deg, rgba(255,0,134,0.09), rgba(31,26,180,0.09));
      border-radius: 18px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 1.8rem;
      color: var(--accent-2);
      transition: var(--transition);
    }
    .card-icon img { width: 32px; height: 32px; object-fit: contain; }
    .card-icon svg { width: 32px; height: 32px; stroke: currentColor; stroke-width: 1.7; fill: none; }
    .card-premium:hover .card-icon {
      background: linear-gradient(135deg, var(--accent), var(--accent-2));
      color: white;
    }

    .card-title {
      font-family: var(--font-display);
      font-size: 1.45rem;
      font-weight: 800;
      margin-bottom: 0.9rem;
      letter-spacing: 0.01em;
      text-transform: uppercase;
      color: var(--text);
    }
    .card-text { color: var(--muted); line-height: 1.85; margin-bottom: 0; }

    .product-tag {
      display: inline-block;
      font-size: 0.7rem;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--accent-3);
      background: rgba(0,152,223,0.09);
      padding: 0.4rem 1rem;
      border-radius: 60px;
      margin-bottom: 1.4rem;
    }
    .product-highlight {
      margin-top: 1.8rem;
      padding: 1.4rem 1.6rem;
      background: linear-gradient(135deg, rgba(255,0,134,0.04), rgba(31,26,180,0.04));
      border-radius: var(--radius-sm);
      border-left: 4px solid var(--accent);
      font-weight: 500;
      line-height: 1.75;
      color: var(--muted);
    }

    /* ===== MINI STATS ===== */
    .mini-stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1rem;
      margin-top: 2rem;
    }
    .mini-stat {
      background: linear-gradient(160deg, var(--bg-soft) 0%, var(--bg-white) 100%);
      border-radius: 18px;
      padding: 1.5rem 1rem;
      text-align: center;
      border: 1px solid rgba(17,17,17,0.07);
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    .mini-stat-icon { margin-bottom: 8px; }
    .mini-stat-icon img { width: 30px; height: 30px; object-fit: contain; opacity: 0.85; }
    .mini-stat strong {
      font-family: var(--font-display);
      font-size: 1.9rem;
      font-weight: 900;
      background: linear-gradient(135deg, var(--accent), var(--accent-2));
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      display: block;
      line-height: 1.05;
      margin-bottom: 0.3rem;
      text-transform: uppercase;
    }
    .mini-stat span { color: var(--muted); font-size: 0.82rem; font-weight: 600; }

    /* ===== TICKER ===== */
    .ticker-section {
      overflow: hidden;
      padding: 60px 0;
      background: var(--bg-dark);
      position: relative;
    }
    .ticker-section::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, var(--bg-dark) 0%, transparent 8%, transparent 92%, var(--bg-dark) 100%);
      z-index: 2;
      pointer-events: none;
    }
    .ticker-label {
      text-align: center;
      margin-bottom: 2rem;
      font-family: var(--font-display);
      font-size: 0.75rem;
      font-weight: 700;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.35);
    }
    .ticker-wrapper { width: 100%; overflow: hidden; position: relative; z-index: 1; }
    .ticker-track {
      display: flex;
      gap: 24px;
      width: max-content;
      animation: tickerMove 20s linear infinite;
    }
    .ticker-track img {
      height: 300px;
      width: auto;
      object-fit: contain;
      border-radius: 16px;
      box-shadow: 0 16px 40px rgba(0,0,0,0.5);
      transition: transform .4s ease;
      border: 1px solid rgba(255,255,255,0.06);
    }
    .ticker-track img:hover { transform: scale(1.06); }
    @keyframes tickerMove {
      0% { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }

    /* ===== PRODUCTOS — fondo blanco ===== */
    .productos-section { background: var(--bg-white); }

    /* ===== CTA BAND ===== */
    .cta-band {
      background: linear-gradient(125deg, var(--accent-2) 0%, #0d0b6b 40%, var(--accent) 100%);
      border-radius: var(--radius);
      padding: 4rem;
      color: white;
      margin: 4rem 0;
      box-shadow: 0 30px 70px rgba(31,26,180,0.35);
      position: relative;
      overflow: hidden;
    }
    .cta-band::before {
      content: '';
      position: absolute;
      top: -60%;
      right: -20%;
      width: 500px; height: 500px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 65%);
    }
    .cta-band::after {
      content: '';
      position: absolute;
      bottom: -40%;
      left: -10%;
      width: 350px; height: 350px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(255,0,134,0.2) 0%, transparent 65%);
    }
    .cta-band > * { position: relative; z-index: 1; }
    .cta-band h3 {
      font-family: var(--font-display);
      font-size: clamp(1.6rem, 3vw, 2.2rem);
      font-weight: 800;
      margin-bottom: 0.8rem;
      letter-spacing: 0.01em;
      text-transform: uppercase;
    }
    .cta-band p { font-size: 1.05rem; opacity: 0.88; max-width: 600px; line-height: 1.75; }

    /* ===== POR QUÉ ELEGIRNOS — fondo dark ===== */
    .porque-section {
      background: var(--bg-dark);
      position: relative;
      overflow: hidden;
    }
    .porque-section::before {
      content: '';
      position: absolute;
      top: -30%;
      right: -10%;
      width: 600px; height: 600px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(31,26,180,0.18) 0%, transparent 65%);
    }
    .porque-section > * { position: relative; z-index: 1; }

    /* ===== FAQs — fondo soft ===== */
    .faq-wrap { max-width: 900px; margin: 0 auto; }
    .accordion-item {
      border: none !important;
      background: var(--bg-white);
      border-radius: 20px !important;
      overflow: hidden;
      box-shadow: var(--shadow-sm);
      border: 1px solid rgba(17,17,17,0.07) !important;
      margin-bottom: 0.9rem;
    }
    .accordion-button {
      font-family: var(--font-display);
      font-weight: 800;
      color: var(--text);
      padding: 1.4rem 1.6rem;
      background: var(--bg-white) !important;
      box-shadow: none !important;
      font-size: 1.05rem;
      letter-spacing: 0.02em;
      text-transform: uppercase;
    }
    .accordion-button:not(.collapsed) {
      color: var(--accent-2);
      background: rgba(31,26,180,0.02) !important;
    }
    .accordion-body {
      padding: 0 1.6rem 1.6rem;
      color: var(--muted);
      line-height: 1.85;
    }

    /* ===== CONTACTO ===== */
    .contact-card {
      background: var(--bg-white);
      border-radius: var(--radius);
      padding: 2.8rem;
      border: 1px solid rgba(17,17,17,0.07);
      box-shadow: var(--shadow-md);
      height: 100%;
    }
    .contact-item {
      display: flex;
      align-items: flex-start;
      gap: 1.1rem;
      padding: 1.1rem 1.2rem;
      background: var(--bg-soft);
      border-radius: 16px;
      border: 1px solid var(--line);
      transition: var(--transition);
    }
    .contact-item:hover {
      transform: translateX(5px);
      border-color: var(--accent);
      background: rgba(255,0,134,0.03);
    }
    .contact-item .icon {
      width: 48px; height: 48px;
      flex: 0 0 48px;
      background: linear-gradient(135deg, rgba(255,0,134,0.08), rgba(31,26,180,0.08));
      border-radius: 14px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--accent-2);
    }
    .contact-item .icon svg { width: 20px; height: 20px; stroke: currentColor; stroke-width: 1.8; fill: none; }
    .contact-item strong { display: block; margin-bottom: 0.15rem; font-size: 0.95rem; }
    .contact-item a, .contact-item span { color: var(--muted); line-height: 1.6; font-size: 0.92rem; }

    .form-control, .form-select {
      border-radius: 14px;
      border: 1.5px solid rgba(17,17,17,0.12);
      min-height: 56px;
      padding: 0.8rem 1.2rem;
      font-size: 0.97rem;
      transition: var(--transition);
      background: var(--bg-soft);
      font-family: var(--font-body);
    }
    .form-control:focus, .form-select:focus {
      border-color: var(--accent-3);
      box-shadow: 0 0 0 4px rgba(0,152,223,0.1);
      background: var(--bg-white);
    }
    .form-label { font-weight: 700; margin-bottom: 0.5rem; color: var(--text); font-size: 0.9rem; }

    /* ===== GALERÍA ===== */
    .gal-gallery { background: var(--bg-soft); padding-bottom: 80px; }
    .gal-gallery .carousel { max-width: 980px; margin: 0 auto; }
    .gal-frame {
      width: 100%;
      height: 500px;
      background: var(--bg-white);
      border-radius: var(--radius);
      overflow: hidden;
      box-shadow: var(--shadow-md);
      border: 1px solid rgba(17,17,17,0.07);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 10px;
    }
    .gal-img { width: auto !important; max-width: 100%; height: auto !important; max-height: 100%; object-fit: contain; cursor: zoom-in; }
    .gal-gallery .carousel-control-prev,
    .gal-gallery .carousel-control-next {
      width: 52px; height: 52px;
      top: 50%; transform: translateY(-50%);
      opacity: 1;
      background: var(--accent);
      border-radius: 50%;
      margin: 0 16px;
      border: none;
      box-shadow: 0 12px 28px rgba(255,0,134,0.35);
    }
    .gal-gallery .carousel-control-prev:hover,
    .gal-gallery .carousel-control-next:hover { background: var(--accent-2); }
    .gal-gallery .carousel-indicators { bottom: -50px; }
    .gal-gallery .carousel-indicators button {
      width: 9px; height: 9px;
      border-radius: 50%;
      background: rgba(17,17,17,0.25);
    }
    .gal-gallery .carousel-indicators button.active { background: var(--accent); }

    /* ===== FOOTER premium oscuro ===== */
    .footer {
      background: var(--bg-darker);
      color: white;
      padding: 90px 0 34px;
      position: relative;
      overflow: hidden;
    }
    .footer::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent, var(--accent), var(--accent-2), transparent);
    }
    .footer::after {
      content: '';
      position: absolute;
      bottom: -30%;
      right: -10%;
      width: 500px; height: 500px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(31,26,180,0.1) 0%, transparent 65%);
      pointer-events: none;
    }
    .footer > * { position: relative; z-index: 1; }

    .footer-brand {
      display: flex;
      align-items: center;
      gap: 1rem;
      margin-bottom: 1.5rem;
    }
    .footer-logo { height: 46px; width: auto; }
    .footer-brand-name {
      font-family: var(--font-display);
      font-size: 1.5rem;
      font-weight: 800;
      color: #fff;
      text-transform: uppercase;
      letter-spacing: 0.05em;
    }

    .footer-text { color: rgba(255,255,255,0.55); line-height: 1.85; max-width: 380px; font-size: 0.95rem; }

    .footer-divider {
      width: 40px; height: 3px;
      background: linear-gradient(90deg, var(--accent), var(--accent-2));
      border-radius: 3px;
      margin: 1.5rem 0;
    }

    .footer-title {
      font-family: var(--font-display);
      font-size: 0.78rem;
      font-weight: 800;
      margin-bottom: 1.4rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.4);
    }
    .footer-nav, .footer-contact {
      list-style: none; padding: 0; margin: 0;
      display: grid; gap: 0.75rem;
    }
    .footer-nav a, .footer-contact a {
      color: rgba(255,255,255,0.65);
      transition: var(--transition);
      font-size: 0.95rem;
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
    }
    .footer-nav a::before {
      content: '→';
      color: var(--accent);
      font-size: 0.75rem;
      opacity: 0;
      transition: var(--transition);
      transform: translateX(-4px);
    }
    .footer-nav a:hover { color: #fff; padding-left: 2px; }
    .footer-nav a:hover::before { opacity: 1; transform: translateX(0); }
    .footer-contact a:hover { color: var(--accent); }

    .footer-bottom {
      margin-top: 4rem;
      padding-top: 2rem;
      border-top: 1px solid rgba(255,255,255,0.08);
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      gap: 0.5rem;
      color: rgba(255,255,255,0.35);
      font-size: 0.88rem;
    }
    .footer-bottom a { font-weight: 700; color: rgba(255,255,255,0.6); }
    .footer-bottom a:hover { color: var(--accent); }

    /* ===== DISTRIBUIDORES — quitamos section extra, queda inline ===== */
    .distribuidores-wrapper { background: var(--bg); padding: 0 0 110px; }

    /* ===== RESPONSIVE ===== */
    @media (max-width: 991px) {
      :root { --nav-h: 78px; }
      .section { padding: 80px 0; }
      .container-custom { padding-left: 16px; padding-right: 16px; }
      .navbar-collapse {
        background: rgba(13,19,32,0.98);
        backdrop-filter: blur(20px);
        margin-top: 0.5rem;
        border-radius: 20px;
        padding: 1rem;
        box-shadow: var(--shadow-lg);
        border: 1px solid rgba(255,255,255,0.08);
      }
      .navbar-nav, .navbar-nav .nav-item, .navbar .nav-link,
      .navbar-collapse .ms-lg-4, .navbar-collapse .btn-nav { width: 100%; }
      .navbar .nav-link { display: block; padding: 0.85rem 1rem !important; }
      .navbar-collapse .btn-nav { padding-inline: 1rem; }
      .hero-media { min-height: 380px; }
      .hero-media img { min-height: 380px; }
      .hero-floating { left: 10px; bottom: 10px; }
      .cta-band { padding: 2.5rem; }
      .mini-stats { grid-template-columns: 1fr; }
      .contact-card { padding: 1.8rem; }
    }

    @media (max-width: 767px) {
      .hero-actions { flex-direction: column; }
      .btn-main, .btn-outline-main, .btn-dark-outline { width: 100%; }
      .hero-badges { flex-direction: column; }
      .hero-floating { position: static; max-width: 100%; margin-top: 1.5rem; }
      .gal-frame { height: 360px; }
      .cta-band { padding: 1.8rem; margin: 2rem 0; }
      .cta-band h3 { font-size: 1.5rem; }
    }

    @media (max-width: 575px) {
      .hero-media { min-height: 260px; }
      .hero-media img { min-height: 260px; }
      .gal-frame { height: 240px; }
      .ticker-track img { height: 200px; }
    }

/* ===== INLINE <style> BLOCK #2 ===== */
@media (max-width: 767px) {
      html, body { overflow-x: hidden !important; }
      .section { padding: 64px 0 !important; }
      .container-custom { padding-left: 14px !important; padding-right: 14px !important; }
      .row { --bs-gutter-x: 1rem; margin-left: 0 !important; margin-right: 0 !important; }
      .hero { padding-top: calc(var(--nav-h) + 28px) !important; }
      .hero-title { font-size: clamp(2.4rem, 11vw, 3rem) !important; }
      .hero-media, .hero-media[style] { min-height: 0 !important; height: auto !important; aspect-ratio: 4/3; padding: 10px; }
      .hero-media img, .hero-media img[style] { min-height: 0 !important; height: 100% !important; width: 100% !important; object-fit: contain !important; }
      #inicio .hero-media { aspect-ratio: 1/1; }
    }
    @media (max-width: 480px) {
      .section-title { font-size: clamp(1.9rem, 9.5vw, 2.4rem) !important; }
      .hero-title { font-size: clamp(2rem, 10.5vw, 2.6rem) !important; }
    }

/* ===== INLINE <style> BLOCK #3 ===== */
#inicio .hero-media { padding: 16px; }
    #inicio .hero-media img { width: 100%; height: 100%; max-height: 500px; object-fit: contain; object-position: center; }
    @media (max-width: 767px) {
      #inicio.hero,
      #inicio {
        padding-top: calc(var(--nav-h) + 72px) !important;
      }
      #inicio .container-custom {
        padding-top: 8px;
      }
      #inicio .row { display: flex; flex-direction: column; }
      #inicio .row > .col-lg-6:first-child { display: contents; }
      #inicio .row > .col-lg-6:last-child { order: 4; width: 100%; }
      #inicio .eyebrow {
        order: 1;
        margin-top: 4px;
        margin-bottom: 1rem;
      }
      #inicio .hero-title { order: 2; }
      #inicio .hero-text { order: 3; margin-bottom: 1rem; }
      #inicio .hero-actions { order: 5; margin-top: 1rem; }
      #inicio .hero-badges { order: 6; }
      #inicio .hero-visual { margin-top: .25rem; }
      #inicio .hero-media { aspect-ratio: 1/1; padding: 12px; }
      #inicio .hero-media img { max-height: none; }
    }

/* ===== INLINE <style> BLOCK #4 ===== */
.offers-section{
          position: relative;
          overflow: hidden;
          background:
            radial-gradient(circle at 10% 15%, rgba(255,0,134,.05) 0%, transparent 26%),
            radial-gradient(circle at 90% 10%, rgba(31,26,180,.05) 0%, transparent 28%),
            linear-gradient(180deg, #eef1f7 0%, #f5f7fb 100%);
        }
    
        .offers-section .container-custom{
          position: relative;
          z-index: 1;
        }
    
        .offers-shell{
          margin-top: 2.2rem;
          display: grid;
          grid-template-columns: minmax(0, 1.12fr) minmax(320px, 460px);
          gap: 32px;
          align-items: start;
        }
    
        .offers-cards-grid{
          display: grid;
          grid-template-columns: repeat(2, minmax(0, 1fr));
          gap: 22px;
          align-content: start;
        }
    
        .offers-section .card-premium{
          padding: 1.65rem 1.45rem;
          border-radius: 22px;
          min-height: 100%;
          box-shadow: 0 10px 28px rgba(15,23,42,.06);
        }
    
        .offers-section .card-premium:hover{
          transform: translateY(-6px);
          box-shadow: 0 18px 34px rgba(15,23,42,.10);
        }
    
        .offers-section .card-icon{
          width: 58px;
          height: 58px;
          border-radius: 16px;
          margin-bottom: 1.15rem;
        }
    
        .offers-section .card-icon img{
          width: 28px;
          height: 28px;
        }
    
        .offers-section .card-icon svg{
          width: 28px;
          height: 28px;
        }
    
        .offers-section .card-title{
          font-size: 1.18rem;
          margin-bottom: .65rem;
          line-height: 1.02;
        }
    
        .offers-section .card-text{
          font-size: .96rem;
          line-height: 1.72;
          margin-bottom: 0;
        }
    
        .offers-media-col{
          position: sticky;
          top: 108px;
        }
    
        .offers-media-card{
          position: relative;
          border-radius: 28px;
          overflow: hidden;
          background:
            radial-gradient(circle at top right, rgba(255,0,134,.12), transparent 34%),
            linear-gradient(135deg, #111827 0%, #1a1760 100%);
          padding: 10px;
          border: 1px solid rgba(17,17,17,.08);
          box-shadow: 0 26px 60px rgba(15,23,42,.16);
          min-height: 100%;
        }
    
        .offers-media-inner{
          position: relative;
          border-radius: 22px;
          overflow: hidden;
          background: #0f172a;
          min-height: 620px;
          display: flex;
          align-items: stretch;
          justify-content: stretch;
        }
    
        .offers-media-inner video{
          width: 100%;
          height: 100%;
          min-height: 620px;
          object-fit: cover;
          display: block;
        }
    
        .offers-media-badge{
          position: absolute;
          left: 18px;
          bottom: 18px;
          z-index: 2;
          max-width: 290px;
          padding: 1rem 1.05rem;
          border-radius: 18px;
          background: rgba(17,24,39,.78);
          backdrop-filter: blur(12px);
          border: 1px solid rgba(255,255,255,.12);
          box-shadow: 0 16px 36px rgba(0,0,0,.28);
        }
    
        .offers-media-badge strong{
          display: block;
          margin-bottom: .28rem;
          color: #fff;
          font-family: var(--font-display);
          font-size: 1rem;
          letter-spacing: .03em;
          text-transform: uppercase;
        }
    
        .offers-media-badge span{
          color: rgba(255,255,255,.78);
          font-size: .88rem;
          line-height: 1.5;
          display: block;
        }
    
        @media (max-width: 1199px){
          .offers-shell{
            grid-template-columns: minmax(0,1fr) minmax(280px,390px);
            gap: 24px;
          }
    
          .offers-media-inner,
          .offers-media-inner video{
            min-height: 560px;
          }
        }
    
        @media (max-width: 991px){
          .offers-shell{
            grid-template-columns: 1fr;
          }
    
          .offers-media-col{
            position: relative;
            top: auto;
          }
    
          .offers-media-card{
            max-width: 760px;
            margin: 0 auto;
          }
    
          .offers-media-inner,
          .offers-media-inner video{
            min-height: 420px;
          }
        }
    
        @media (max-width: 767px){
          .offers-cards-grid{
            grid-template-columns: 1fr;
            gap: 18px;
          }
    
          .offers-section .card-premium{
            padding: 1.35rem 1.15rem;
          }
    
          .offers-media-inner,
          .offers-media-inner video{
            min-height: 320px;
          }
    
          .offers-media-badge{
            left: 14px;
            right: 14px;
            bottom: 14px;
            max-width: none;
          }
        }
    
        @media (max-width: 575px){
          .offers-shell{
            margin-top: 1.6rem;
          }
    
          .offers-media-card{
            padding: 8px;
            border-radius: 22px;
          }
    
          .offers-media-inner{
            border-radius: 16px;
          }
        }

/* ===== INLINE <style> BLOCK #5 ===== */
.productos-section{
          background: var(--bg-white);
          position: relative;
          overflow: hidden;
        }
    
        .productos-section::before{
          content: "";
          position: absolute;
          inset: 0;
          background:
            radial-gradient(circle at 12% 18%, rgba(255,0,134,.045) 0%, transparent 28%),
            radial-gradient(circle at 88% 16%, rgba(31,26,180,.045) 0%, transparent 30%),
            radial-gradient(circle at 50% 100%, rgba(0,152,223,.04) 0%, transparent 34%);
          pointer-events: none;
        }
    
        .productos-section > .container-custom{
          position: relative;
          z-index: 1;
        }
    
        .productos-top-row{
          margin-top: 1.2rem;
        }
    
        .producto-card-rollo .hero-media{
          min-height: 320px !important;
          margin-bottom: 1.5rem;
          background:
            radial-gradient(circle at top right, rgba(255,0,134,.05), transparent 34%),
            linear-gradient(135deg, #ffffff 0%, #f7f8fc 100%);
          border: 1px solid rgba(17,17,17,0.05);
          padding: 18px;
        }
    
        .producto-card-rollo .hero-media img{
          min-height: 320px !important;
          width: 100%;
          object-fit: contain !important;
          background: transparent !important;
        }
    
        .perfumina-block{
          margin-top: 4.2rem;
          padding: 2.6rem 2rem 2.2rem;
          border-radius: var(--radius);
          background:
            radial-gradient(circle at top right, rgba(255,0,134,.06), transparent 28%),
            radial-gradient(circle at bottom left, rgba(31,26,180,.06), transparent 32%),
            linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
          border: 1px solid rgba(17,17,17,0.07);
          box-shadow: var(--shadow-sm);
          overflow: hidden;
          position: relative;
        }
    
        .perfumina-block::after{
          content:'';
          position:absolute;
          top:0;
          left:0;
          right:0;
          height:3px;
          background: linear-gradient(90deg, var(--accent), var(--accent-2), var(--accent-3));
        }
    
        .perfumina-head{
          max-width: 760px;
          margin: 0 auto 2.2rem;
          text-align: center;
        }
    
        .perfumina-head .product-tag{
          margin-bottom: 1rem;
        }
    
        .perfumina-head .card-title{
          margin-bottom: .8rem;
        }
    
        .perfumina-head .card-text{
          margin-bottom: 0;
        }
    
        .flashes-loop-holder{
          max-width: 1120px;
          margin: 0 auto;
        }
    
        .flashes-stage{
          position: relative;
          min-height: 470px;
          display: flex;
          align-items: center;
          justify-content: center;
          isolation: isolate;
        }
    
        .flashes-stage::before{
          content: "";
          position: absolute;
          left: 50%;
          bottom: 10px;
          transform: translateX(-50%);
          width: min(760px, 82%);
          height: 120px;
          background: radial-gradient(circle, rgba(10,43,74,.10) 0%, rgba(10,43,74,.04) 42%, transparent 72%);
          filter: blur(22px);
          z-index: 0;
          pointer-events: none;
        }
    
        .flash-loop-card{
          position: absolute;
          width: clamp(250px, 28vw, 355px);
          aspect-ratio: 4 / 5;
          border-radius: 30px;
          background:
            radial-gradient(circle at top right, rgba(200,169,110,.16), transparent 35%),
            linear-gradient(135deg, #fcfcfc 0%, #f5f7fa 100%);
          border: 1px solid rgba(10,43,74,.06);
          box-shadow: 0 18px 40px rgba(7,29,53,.10);
          overflow: hidden;
          display: flex;
          align-items: center;
          justify-content: center;
          padding: 18px;
          will-change: transform, opacity, filter;
          transition:
            transform 1s cubic-bezier(.22,.8,.2,1),
            opacity 1s ease,
            filter 1s ease,
            box-shadow 1s ease;
          backface-visibility: hidden;
        }
    
        .flash-loop-card::before{
          content:"";
          position:absolute;
          inset:0;
          background: linear-gradient(180deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,0) 32%);
          pointer-events:none;
          z-index:1;
        }
    
        .flash-loop-card::after{
          content:"";
          position:absolute;
          inset:-10%;
          background: linear-gradient(115deg, transparent 24%, rgba(255,255,255,.70) 50%, transparent 76%);
          transform: translateX(-140%);
          opacity: 0;
          pointer-events:none;
          z-index:2;
        }
    
        .flash-loop-card img{
          position: relative;
          z-index: 0;
          width: 100%;
          height: 100%;
          object-fit: contain;
          object-position: center;
          display: block;
          filter: drop-shadow(0 16px 24px rgba(10,43,74,.14));
          pointer-events: none;
          user-select: none;
          transition: transform 1s cubic-bezier(.22,.8,.2,1), filter 1s ease;
        }
    
        .flash-pos-center{
          transform: translateX(0) scale(1) rotate(0deg);
          opacity: 1;
          z-index: 5;
          filter: blur(0) saturate(1.08) brightness(1.02);
          box-shadow: 0 28px 64px rgba(7,29,53,.20);
          animation: flashCenterBoom .92s cubic-bezier(.2,.88,.24,1);
        }
    
        .flash-pos-center::after{
          animation: flashFrontSweep .9s ease;
        }
    
        .flash-pos-center img{
          transform: scale(1.03);
          filter: drop-shadow(0 20px 30px rgba(10,43,74,.18));
        }
    
        .flash-pos-right{
          transform: translateX(265px) scale(.88) rotate(4deg);
          opacity: .62;
          z-index: 3;
          filter: blur(5px) saturate(.72) brightness(.92);
          box-shadow: 0 12px 22px rgba(7,29,53,.07);
        }
    
        .flash-pos-right img{
          transform: scale(.96);
          filter: drop-shadow(0 10px 16px rgba(10,43,74,.10));
        }
    
        .flash-pos-left{
          transform: translateX(-265px) scale(.88) rotate(-4deg);
          opacity: .62;
          z-index: 2;
          filter: blur(5px) saturate(.72) brightness(.92);
          box-shadow: 0 12px 22px rgba(7,29,53,.07);
        }
    
        .flash-pos-left img{
          transform: scale(.96);
          filter: drop-shadow(0 10px 16px rgba(10,43,74,.10));
        }
    
        .flash-pos-hidden{
          transform: translateX(430px) scale(.74) rotate(8deg);
          opacity: 0;
          z-index: 1;
          filter: blur(14px) saturate(.55) brightness(.86);
          pointer-events: none;
          box-shadow: none;
        }
    
        .flash-pos-hidden-left{
          transform: translateX(-430px) scale(.74) rotate(-8deg);
          opacity: 0;
          z-index: 1;
          filter: blur(14px) saturate(.55) brightness(.86);
          pointer-events: none;
          box-shadow: none;
        }
    
        @keyframes flashCenterBoom{
          0%{
            transform: translateX(110px) scale(.68) rotate(10deg);
            opacity: 0;
            filter: blur(14px) brightness(1.08);
          }
          38%{
            transform: translateX(-18px) scale(1.10) rotate(-2.6deg);
            opacity: 1;
            filter: blur(0) brightness(1.06);
          }
          60%{
            transform: translateX(8px) scale(.985) rotate(.8deg);
          }
          78%{
            transform: translateX(-4px) scale(1.02) rotate(-.35deg);
          }
          100%{
            transform: translateX(0) scale(1) rotate(0deg);
            opacity: 1;
            filter: blur(0) brightness(1);
          }
        }
    
        @keyframes flashFrontSweep{
          0%{
            transform: translateX(-140%);
            opacity: 0;
          }
          18%{
            opacity: .9;
          }
          100%{
            transform: translateX(140%);
            opacity: 0;
          }
        }
    
        .perfumina-flavors{
          display: flex;
          flex-wrap: wrap;
          justify-content: center;
          gap: .7rem;
          margin-top: 1rem;
        }
    
        .perfumina-flavors span{
          display: inline-flex;
          align-items: center;
          justify-content: center;
          padding: .55rem 1rem;
          border-radius: 999px;
          font-size: .72rem;
          font-weight: 800;
          letter-spacing: .08em;
          text-transform: uppercase;
          color: var(--accent-2);
          background: rgba(31,26,180,.06);
          border: 1px solid rgba(31,26,180,.12);
        }
    
        .productos-extra-visual{
          margin-top: 2rem;
        }
    
        .productos-extra-visual .hero-card{
          background: rgba(17,24,39,0.04);
          border-color: rgba(17,17,17,0.08);
        }
    
        .productos-extra-visual .hero-media{
          background: linear-gradient(135deg, rgba(17,24,39,0.04), rgba(31,26,180,0.04));
        }
    
        .productos-extra-visual .hero-media img{
          object-fit: contain;
        }
    
        @media (max-width: 991px){
          .producto-card-rollo .hero-media,
          .producto-card-rollo .hero-media img{
            min-height: 280px !important;
          }
    
          .flashes-stage{
            min-height: 390px;
          }
    
          .flash-loop-card{
            width: min(40vw, 295px);
            border-radius: 26px;
          }
    
          .flash-pos-right{
            transform: translateX(170px) scale(.86) rotate(4deg);
            filter: blur(5px) saturate(.7) brightness(.92);
          }
    
          .flash-pos-left{
            transform: translateX(-170px) scale(.86) rotate(-4deg);
            filter: blur(5px) saturate(.7) brightness(.92);
          }
    
          .flash-pos-hidden{
            transform: translateX(300px) scale(.72) rotate(8deg);
          }
    
          .flash-pos-hidden-left{
            transform: translateX(-300px) scale(.72) rotate(-8deg);
          }
        }
    
        @media (max-width: 640px){
          .producto-card-rollo{
            padding-left: 14px;
            padding-right: 14px;
          }

          .producto-card-rollo .hero-media{
            min-height: 240px !important;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 14px !important;
            width: 100%;
            margin: 0 auto 1.5rem !important;
          }

          .producto-card-rollo .hero-media img{
            min-height: 0 !important;
            width: auto !important;
            max-width: 88%;
            max-height: 210px;
            margin: 0 auto;
            display: block;
            object-fit: contain !important;
            object-position: center center !important;
            transform: translateX(-8px);
          }

          .perfumina-block{
            margin-top: 3rem;
            padding: 2rem 1rem 1.6rem;
          }
    
          .flashes-stage{
            min-height: 315px;
          }
    
          .flash-loop-card{
            width: min(72vw, 276px);
            padding: 14px;
            border-radius: 22px;
          }
    
          .flash-pos-center{
            transform: translateX(0) scale(1);
          }
    
          .flash-pos-right{
            transform: translateX(68px) scale(.82) rotate(4deg);
            opacity: .38;
            filter: blur(7px) saturate(.66) brightness(.9);
          }
    
          .flash-pos-left{
            transform: translateX(-68px) scale(.82) rotate(-4deg);
            opacity: .38;
            filter: blur(7px) saturate(.66) brightness(.9);
          }
    
          .flash-pos-hidden,
          .flash-pos-hidden-left{
            opacity: 0;
          }
    
          @keyframes flashCenterBoom{
            0%{
              transform: translateX(75px) scale(.7) rotate(9deg);
              opacity: 0;
              filter: blur(12px) brightness(1.06);
            }
            42%{
              transform: translateX(-8px) scale(1.08) rotate(-1.6deg);
              opacity: 1;
              filter: blur(0);
            }
            100%{
              transform: translateX(0) scale(1) rotate(0deg);
              opacity: 1;
              filter: blur(0);
            }
          }
        }

/* ===== INLINE <style> BLOCK #6 ===== */
/* FILA IMAGEN + CTA + VIDEO */
.productos-cta-row--triple{
  display: grid;
  grid-template-columns: minmax(240px, 340px) minmax(320px, 1fr) minmax(240px, 340px);
  align-items: stretch;
  gap: 26px;
  margin: 40px 0 0;
}

/* CARD BASE */
.producto-card-side,
.producto-video-card{
  background: rgba(17,24,39,0.04);
  border: 1px solid rgba(17,17,17,0.08);
  padding: 20px;
  border-radius: 18px;
  height: 100%;
  display: flex;
  box-shadow: 0 10px 24px rgba(15,23,42,.06);
}

/* IMAGEN IZQUIERDA */
.producto-card-side .producto-img-wrap{
  background: linear-gradient(135deg, rgba(17,24,39,0.04), rgba(31,26,180,0.04));
  padding: 12px;
  border-radius: 14px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 100%;
}

.producto-card-side .producto-img-wrap img{
  width: 100%;
  max-width: 420px;
  height: auto;
  display: block;
  border-radius: 10px;
  object-fit: contain;
}

/* CTA MEDIO */
.cta-band-middle{
  margin: 0;
  min-height: 100%;
  display: flex;
  align-items: center;
  padding: 0;
  background: linear-gradient(135deg, var(--accent-2) 0%, #0d0b6b 38%, var(--accent) 100%);
  border-radius: 24px;
  box-shadow: 0 26px 54px rgba(31,26,180,.22);
}

.cta-band-middle-inner{
  width: 100%;
  padding: 2.4rem 2rem;
  position: relative;
  z-index: 2;
}

.cta-band-middle .product-tag{
  display: inline-flex;
  margin-bottom: 1rem;
  color: #fff;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.14);
}

.cta-band-middle h3{
  margin-bottom: .9rem;
  font-size: clamp(1.45rem, 2vw, 2rem);
  line-height: 1.02;
}

.cta-band-middle p{
  margin-bottom: 1.15rem;
  max-width: 560px;
}

.cta-band-features{
  list-style: none;
  padding: 0;
  margin: 0 0 1.4rem;
  display: grid;
  gap: .65rem;
}

.cta-band-features li{
  display: flex;
  align-items: center;
  gap: .55rem;
  color: rgba(255,255,255,.92);
  font-size: .94rem;
  font-weight: 600;
}

.cta-band-features li::before{
  content: "✓";
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255,255,255,.14);
  color: #fff;
  font-size: .82rem;
  font-weight: 800;
}

.cta-band-middle .btn-outline-main{
  width: auto;
  border-color: rgba(255,255,255,.34);
  background: rgba(255,255,255,.08);
}

.cta-band-middle .btn-outline-main:hover{
  background: rgba(255,255,255,.16);
}

/* VIDEO DERECHA */
.producto-video-card{
  position: relative;
}

.producto-video-wrap{
  position: relative;
  width: 100%;
  min-height: 100%;
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(17,24,39,0.12), rgba(31,26,180,0.12));
  display: flex;
}

.producto-video-wrap video{
  width: 100%;
  height: 100%;
  min-height: 100%;
  object-fit: cover;
  display: block;
}

.producto-video-badge{
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 14px;
  padding: .9rem .95rem;
  border-radius: 14px;
  background: rgba(17,24,39,.74);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.12);
}

.producto-video-badge strong{
  display: block;
  color: #fff;
  font-family: var(--font-display);
  font-size: .98rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  margin-bottom: .18rem;
}

.producto-video-badge span{
  display: block;
  color: rgba(255,255,255,.78);
  font-size: .84rem;
  line-height: 1.45;
}

/* DESKTOP MEDIO */
@media (max-width: 1199px){
  .productos-cta-row--triple{
    grid-template-columns: minmax(220px, 290px) minmax(280px, 1fr) minmax(220px, 290px);
    gap: 20px;
  }

  .cta-band-middle-inner{
    padding: 2rem 1.5rem;
  }
}

/* TABLET */
@media (max-width: 991px){
  .productos-cta-row--triple{
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .producto-card-side,
  .producto-video-card{
    max-width: 560px;
    width: 100%;
    margin: 0 auto;
  }

  .cta-band-middle{
    max-width: 760px;
    margin: 0 auto;
  }

  .producto-video-wrap{
    min-height: 360px;
  }
}

/* PHONE */
@media (max-width: 640px){
  .producto-card-side,
  .producto-video-card{
    padding: 14px;
  }

  .producto-card-side .producto-img-wrap{
    padding: 10px;
  }

  .cta-band-middle-inner{
    padding: 1.6rem 1.2rem;
  }

  .cta-band-middle .btn-outline-main{
    width: 100%;
  }

  .producto-video-wrap{
    min-height: 280px;
  }
}

/* ===== INLINE <style> BLOCK #7 ===== */
:root { --wa:#25D366; }
    .tt-float { position:fixed; right:18px; bottom:166px; z-index:9997; width:52px; height:52px; border-radius:50%; display:grid; place-items:center; color:#fff; text-decoration:none; background:linear-gradient(180deg,#111,#000); box-shadow:0 8px 24px rgba(0,0,0,.3); transition:transform .25s,box-shadow .25s; }
    .tt-float:hover { transform:translateY(-3px) scale(1.05); box-shadow:0 12px 32px rgba(0,0,0,.4); }
    .ig-float { position:fixed; right:18px; bottom:92px; z-index:9998; width:52px; height:52px; border-radius:50%; display:grid; place-items:center; color:#fff; text-decoration:none; background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); box-shadow:0 8px 24px rgba(0,0,0,.25); transition:transform .25s,box-shadow .25s; }
    .ig-float:hover { transform:translateY(-3px) scale(1.05); }
    .wa-float { position:fixed; right:18px; bottom:18px; z-index:9999; font-family:var(--font-body,sans-serif); }
    .wa-btn { background:var(--wa); color:#fff; border:0; width:58px; height:58px; border-radius:50%; display:grid; place-items:center; box-shadow:0 8px 28px rgba(0,0,0,.22); cursor:pointer; transition:transform .3s,box-shadow .3s; z-index:9999; position:relative; }
    .wa-btn:hover { transform:translateY(-3px) scale(1.05); }
    .wa-card { position:absolute; right:0; bottom:72px; width:min(360px,92vw); background:#fff; color:#12131a; border-radius:18px; overflow:hidden; box-shadow:0 18px 60px rgba(0,0,0,.22); border:1px solid #dde4df; transform:translateY(10px); opacity:0; transition:transform .3s,opacity .3s; z-index:10000; }
    .wa-card[aria-modal="true"] { transform:translateY(0); opacity:1; }
    .wa-head { display:flex; align-items:center; gap:12px; padding:14px 16px; background:linear-gradient(135deg,#fff,#ecf6f0); border-bottom:1px solid #dde4df; }
    .wa-avatar { width:40px; height:40px; border-radius:10px; background:#e9f7ef; display:grid; place-items:center; border:1px solid #cfeeda; overflow:hidden; }
    .wa-title { font-weight:800; font-size:1rem; }
    .wa-status { font-size:.82rem; color:#6c756f; display:flex; align-items:center; gap:5px; }
    .wa-status::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--wa); }
    .wa-close { margin-left:auto; background:transparent; color:#6c756f; border:0; font-size:22px; cursor:pointer; width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; transition:.2s; }
    .wa-close:hover { background:rgba(0,0,0,.04); }
    .wa-body { padding:12px 14px; max-height:38vh; overflow:auto; background:#f6f8f7; display:flex; flex-direction:column; gap:8px; }
    .wa-bubble { max-width:88%; padding:9px 11px; border-radius:14px; line-height:1.35; box-shadow:0 2px 8px rgba(0,0,0,.06); font-size:.88rem; animation:fadeIn .25s ease; }
    @keyframes fadeIn { from{opacity:0;transform:translateY(5px)} to{opacity:1;transform:none} }
    .wa-bot { background:#fff; border:1px solid #dde4df; align-self:flex-start; border-bottom-left-radius:4px; }
    .wa-user { background:var(--wa); color:#fff; align-self:flex-end; border-bottom-right-radius:4px; }
    .wa-compose { display:grid; grid-template-columns:1fr auto; gap:8px; padding:10px 12px; background:#fff; border-top:1px solid #dde4df; }
    .wa-compose textarea { resize:none; border-radius:12px; padding:10px 12px; border:1px solid #dde4df; background:#f9fbfa; outline:none; min-height:44px; font-size:.88rem; transition:.2s; font-family:inherit; }
    .wa-compose textarea:focus { border-color:var(--wa); box-shadow:0 0 0 2px rgba(37,211,102,.15); background:#fff; }
    .wa-send { background:var(--wa); color:#fff; border:0; border-radius:12px; padding:0 14px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.2s; }
    .wa-send:hover { background:#1fb85a; transform:scale(1.04); }
    @media (max-width:480px) { .tt-float{right:12px;bottom:158px;width:48px;height:48px;} .ig-float{right:12px;bottom:84px;width:48px;height:48px;} .wa-float{right:12px;bottom:12px;} .wa-btn{width:54px;height:54px;} .wa-card{width:calc(100vw - 24px);right:0;} }