:root{
    --bg:#090D0B;
    --bg2:#0F1C14;
    --card:#131E17;
    --card2:#17251C;
    --green:#3ED916;
    --green-dark:#2AA80F;
    --teal:#02C4D4;
    --blue:#0086F5;
    --pink:#FF4FA0;
    --white:#F3FFF5;
    --silver:#AEC0B7;
    --line: rgba(243,255,245,0.12);
    --shadow-glow: 0 0 0 1px rgba(124,242,60,0.15), 0 20px 50px rgba(0,0,0,0.5);
    --radius: 18px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--bg);
    color:var(--white);
    font-family:'Inter',sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3,.display{
    font-family:'Baloo 2',sans-serif;
    font-weight:700;
    line-height:1.05;
    letter-spacing:-0.01em;
    margin:0;
  }
  .mono{font-family:'IBM Plex Mono',monospace;}
  a{color:inherit;text-decoration:none;}
  img,svg{max-width:100%;display:block;}
  .wrap{max-width:1200px;margin:0 auto;padding:0 24px;}
  ::selection{background:var(--green);color:#08130A;}

  .eyebrow{
    font-family:'IBM Plex Mono',monospace;
    font-size:12px;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--green);
    display:inline-flex;
    align-items:center;
    gap:9px;
    background:rgba(124,242,60,0.1);
    border:1px solid rgba(124,242,60,0.25);
    padding:7px 14px 7px 10px;
    border-radius:20px;
  }
  .eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--pink);display:inline-block;box-shadow:0 0 8px var(--pink);}

  .btn{
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:15px 26px;
    border-radius:14px;
    font-family:'Inter',sans-serif;
    font-weight:700;
    font-size:14.5px;
    letter-spacing:.01em;
    border:none;
    cursor:pointer;
    transition:transform .25s cubic-bezier(.2,.8,.3,1.2), box-shadow .25s ease, filter .2s ease;
    position:relative;
  }
  .btn svg{width:17px;height:17px;}
  .btn-primary{background:linear-gradient(135deg,var(--green),var(--teal));color:#06210C;box-shadow:0 8px 24px rgba(124,242,60,0.35);}
  .btn-primary:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(124,242,60,0.5);filter:brightness(1.05);}
  .btn-primary:active{transform:translateY(0);}
  .btn-ghost{background:rgba(255,255,255,0.06);color:var(--white);border:1.5px solid rgba(243,255,245,0.25);backdrop-filter:blur(6px);}
  .btn-ghost:hover{border-color:var(--green);transform:translateY(-3px);background:rgba(124,242,60,0.08);}
  .btn-dark{background:var(--card2);color:var(--white);border:1.5px solid var(--line);}
  .btn-dark:hover{transform:translateY(-3px);border-color:var(--green);}
  .btn-wa{background:linear-gradient(135deg,#25D366,#128C43);color:#07200F;box-shadow:0 8px 22px rgba(37,211,102,0.4);}
  .btn-wa:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(37,211,102,0.55);}

  .icon{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}

  /* reveal */
  .reveal{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);}
  .reveal.in{opacity:1;transform:translateY(0);}
  .reveal-stagger.in .stagger-item{opacity:1;transform:translateY(0);}
  .stagger-item{opacity:0;transform:translateY(22px);transition:opacity .6s ease, transform .6s ease;}

  /* HEADER */
  header{
    position:sticky;top:0;z-index:80;
    background:rgba(9,13,11,0.72);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    border-bottom:1px solid var(--line);
    transition:box-shadow .2s ease;
  }
  header.scrolled{box-shadow:0 4px 30px rgba(0,0,0,0.4);}
  .nav{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 24px;max-width:1200px;margin:0 auto;
  }
  .logo-brand{display:flex;align-items:center;gap:11px;flex-shrink:0;}
  .logo-wordmark-img{height:30px;width:auto;display:block;flex-shrink:0;}
  .logo-text-new{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.05em;color:var(--silver);text-transform:uppercase;margin-left:2px;white-space:nowrap;flex-shrink:0;}
  .foot-brand{display:flex;align-items:center;gap:10px;}
  .foot-wordmark-img{height:24px;width:auto;display:block;}
  .hero-logo-full{width:100%;max-width:340px;margin-bottom:20px;}
  .hero-logo-full img{width:100%;height:auto;display:block;filter:drop-shadow(0 8px 24px rgba(0,0,0,0.4));}
  .nav-links{display:flex;gap:2px;font-size:14px;font-weight:600;position:relative;flex-shrink:0;}
  .nav-links a{position:relative;padding:9px 15px;border-radius:20px;transition:color .2s ease;z-index:1;white-space:nowrap;}
  .nav-links a.active{color:#06210C;}
  .nav-pill{
    position:absolute;top:0;height:100%;background:linear-gradient(135deg,var(--green),var(--teal));
    border-radius:20px;transition:left .3s cubic-bezier(.2,.8,.2,1), width .3s cubic-bezier(.2,.8,.2,1);z-index:0;
  }
  .nav-cta{display:flex;align-items:center;gap:14px;flex-shrink:0;}
  .social-links{display:flex;gap:8px;}
  .social-icon{
    position:relative;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    background:var(--card2);border:1px solid var(--line);color:var(--silver);
    transition:transform .2s cubic-bezier(.2,.8,.3,1.2), color .2s ease, border-color .2s ease, background .2s ease;
    box-shadow:0 2px 8px rgba(0,0,0,0.15);
  }
  .social-icon:hover{transform:translateY(-3px) scale(1.06);box-shadow:0 8px 18px rgba(0,0,0,0.25);}
  .social-icon:active{transform:translateY(-1px) scale(0.94);}
  .social-icon svg{width:18px;height:18px;position:relative;z-index:1;}
  .social-icon[href*="instagram"]:hover{color:#fff;background:radial-gradient(circle at 30% 110%, #ffdb4d 0%, #fd5949 26%, #d6249f 61%, #285AEB 100%);border-color:transparent;}
  .social-icon[href*="facebook"]:hover{color:#fff;background:#1877F2;border-color:transparent;}
  /* Tooltip accesible en hover, vía data-tooltip (sin JS) */
  .social-icon[data-tooltip]::after{
    content:attr(data-tooltip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(4px);
    background:#0A0E0C;color:#fff;font-size:11px;font-family:'Inter',sans-serif;font-weight:600;white-space:nowrap;
    padding:6px 10px;border-radius:6px;opacity:0;pointer-events:none;transition:opacity .2s ease, transform .2s ease;
    box-shadow:0 4px 12px rgba(0,0,0,0.3);
  }
  .social-icon[data-tooltip]:hover::after{opacity:1;transform:translateX(-50%) translateY(0);}
  .menu-toggle{display:none;background:none;border:none;font-size:24px;cursor:pointer;color:var(--white);}
  .mobile-menu{display:none;flex-direction:column;gap:2px;padding:10px 24px 18px;border-top:1px solid var(--line);}
  .mobile-menu a{padding:12px 6px;font-size:15px;font-weight:600;border-bottom:1px solid var(--line);}
  .mobile-menu.open{display:flex;}

  /* HERO */
  .hero{
    position:relative;
    padding:80px 0 100px;
    overflow:hidden;
    background:var(--bg);
  }
  .blob{
    position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;pointer-events:none;
  }
  .blob-1{width:480px;height:480px;background:radial-gradient(circle,var(--green),transparent 70%);top:-160px;left:-120px;animation:float1 16s ease-in-out infinite;}
  .blob-2{width:420px;height:420px;background:radial-gradient(circle,var(--blue),transparent 70%);top:60px;right:-140px;animation:float2 20s ease-in-out infinite;}
  .blob-3{width:360px;height:360px;background:radial-gradient(circle,var(--pink),transparent 70%);bottom:-160px;left:35%;animation:float3 18s ease-in-out infinite;opacity:.35;}
  @keyframes float1{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(40px,50px) scale(1.1);}}
  @keyframes float2{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(-50px,30px) scale(0.95);}}
  @keyframes float3{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(30px,-40px) scale(1.15);}}

  .hero-grid{
    display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;
    position:relative;z-index:2;
  }
  @keyframes spin{to{transform:rotate(360deg);}}

  .hero h1{font-size:clamp(36px,5.2vw,60px);color:var(--white);}
  .hero h1 .grad{color:var(--green);}
  @supports (background-clip: text) or (-webkit-background-clip: text) {
    .hero h1 .grad{background:linear-gradient(135deg,var(--green),var(--teal) 60%,var(--blue));-webkit-background-clip:text;background-clip:text;color:transparent;}
  }
  .hero p.lead{font-size:18px;line-height:1.6;color:rgba(243,255,245,0.72);max-width:52ch;margin:22px 0 32px;}
  .hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:34px;}
  .hero-benefits{display:grid;grid-template-columns:1fr 1fr;gap:12px 22px;max-width:520px;}
  .hb-item{display:flex;align-items:center;gap:9px;font-size:13.5px;color:rgba(243,255,245,0.75);}
  .hb-item svg{width:18px;height:18px;flex-shrink:0;color:var(--green);}
  .hero-stats{display:flex;gap:34px;flex-wrap:wrap;}
  .hstat{font-family:'IBM Plex Mono',monospace;}
  .hstat b{display:block;font-size:28px;font-weight:600;color:var(--green);}
  @supports (background-clip: text) or (-webkit-background-clip: text) {
    .hstat b{background:linear-gradient(135deg,var(--green),var(--teal));-webkit-background-clip:text;background-clip:text;color:transparent;}
  }
  .hstat span{font-size:12px;color:rgba(243,255,245,0.55);letter-spacing:.03em;}

  /* HERO BANNER (imagen real) */
  .hero-banner-img{
    width:100%;height:auto;display:block;border-radius:22px;
    border:1px solid var(--line);box-shadow:var(--shadow-glow);
    transition:transform .3s ease;
  }
  .hero-banner-img:hover{transform:translateY(-6px);}

  section{padding:100px 0;}
  .section-head{max-width:660px;margin-bottom:50px;}
  .section-head h2{font-size:clamp(28px,3.6vw,40px);margin-top:16px;}
  .section-head p{font-size:16.5px;line-height:1.6;color:rgba(243,255,245,0.62);margin-top:16px;}

  /* TRUST STRIP */
  .trust{background:var(--card);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;overflow:hidden;}
  .trust-track{display:flex;gap:50px;animation:scroll-trust 22s linear infinite;white-space:nowrap;width:max-content;}
  .trust:hover .trust-track{animation-play-state:paused;}
  @keyframes scroll-trust{from{transform:translateX(0);}to{transform:translateX(-50%);}}
  .trust-item{display:flex;align-items:center;gap:10px;font-family:'IBM Plex Mono',monospace;font-size:12.5px;font-weight:600;color:var(--silver);}
  .trust-item .icon{width:18px;height:18px;color:var(--green);}

  /* CATEGORIAS */
  .cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  .cat-card{
    background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
    padding:32px 28px 28px;position:relative;overflow:hidden;
    transition:transform .3s cubic-bezier(.2,.8,.2,1.1), border-color .3s ease, box-shadow .3s ease;
  }
  .cat-card::before{
    content:"";position:absolute;inset:0;opacity:0;transition:opacity .3s ease;
    background:radial-gradient(circle at 30% 0%, rgba(124,242,60,0.15), transparent 60%);
  }
  .cat-card:hover{transform:translateY(-8px);border-color:rgba(124,242,60,0.4);box-shadow:0 20px 50px rgba(0,0,0,0.4);}
  .cat-card:hover::before{opacity:1;}
  .cat-icon{
    width:58px;height:58px;border-radius:16px;
    display:flex;align-items:center;justify-content:center;margin-bottom:20px;color:#06210C;
    transition:transform .3s ease;
  }
  .cat-card:hover .cat-icon{transform:scale(1.08) rotate(-4deg);}
  .cat-icon.g1{background:linear-gradient(135deg,var(--green),var(--teal));}
  .cat-icon.g2{background:linear-gradient(135deg,var(--blue),var(--teal));}
  .cat-icon.g3{background:linear-gradient(135deg,var(--pink),#FF9E6D);}
  .cat-icon.g4{background:linear-gradient(135deg,#C9A6FF,#8B5CF6);}
  .cat-card .stub{
    position:absolute;top:20px;right:20px;
    font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:700;
    padding:5px 11px;letter-spacing:.05em;border-radius:20px;
    background:rgba(124,242,60,0.12);color:var(--green);border:1px solid rgba(124,242,60,0.3);
  }
  .cat-card h3{font-size:21px;margin-bottom:11px;position:relative;z-index:1;}
  .cat-card p{font-size:14.5px;line-height:1.6;color:rgba(243,255,245,0.62);margin-bottom:16px;position:relative;z-index:1;}
  .cat-card ul{margin:0;padding:0;list-style:none;font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--silver);display:flex;flex-direction:column;gap:6px;position:relative;z-index:1;}
  .cat-card li{display:flex;align-items:center;gap:7px;}
  .cat-card li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--green);flex-shrink:0;}

  /* COMO FUNCIONA */
  .steps{background:var(--bg2);position:relative;overflow:hidden;}
  .step-row{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;position:relative;z-index:1;}
  .step{
    background:var(--card);border:1px solid var(--line);
    border-radius:var(--radius);padding:28px 22px;position:relative;
    transition:transform .3s ease, border-color .3s ease;
  }
  .step:hover{transform:translateY(-6px);border-color:rgba(124,242,60,0.4);}
  .step .num{font-family:'IBM Plex Mono',monospace;color:var(--green);font-size:12.5px;font-weight:700;letter-spacing:.05em;}
  .step .snum{
    position:absolute;top:16px;right:18px;font-family:'Baloo 2',sans-serif;
    font-size:36px;color:rgba(243,255,245,0.06);font-weight:700;
  }
  .step h3{font-size:18.5px;margin:16px 0 9px;color:var(--white);}
  .step p{font-size:14px;line-height:1.55;color:rgba(243,255,245,0.6);margin:0;}
  .step .icon{color:var(--green);margin-bottom:6px;}

  /* CATALOGO */
  .catalog-search-input{
    width:100%;max-width:420px;display:block;margin-bottom:18px;
    padding:13px 16px;border-radius:12px;border:1.5px solid var(--line);
    background:var(--card);color:var(--white);font-family:'Inter',sans-serif;font-size:14px;
  }
  .catalog-search-input:focus{outline:none;border-color:var(--green);}
  .filter-bar{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:36px;background:var(--card);border:1px solid var(--line);border-radius:30px;padding:6px;width:fit-content;}
  .filter-btn{
    font-family:'Inter',sans-serif;font-size:13.5px;font-weight:700;
    padding:10px 20px;border-radius:24px;border:none;
    background:transparent;color:var(--silver);cursor:pointer;transition:color .2s ease;
  }
  .filter-btn.active{background:linear-gradient(135deg,var(--green),var(--teal));color:#06210C;}
  .prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  .prod-card{
    background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
    overflow:hidden;display:flex;flex-direction:column;
    transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  }
  .prod-card:hover{transform:translateY(-6px);box-shadow:0 20px 50px rgba(0,0,0,0.4);border-color:rgba(124,242,60,0.35);}
  .prod-photo{
    height:180px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;
  }
  .out-of-stock-badge{
    position:absolute;bottom:8px;right:8px;background:var(--pink);color:#2A0518;
    font-family:'IBM Plex Mono',monospace;font-size:10px;font-weight:700;
    padding:4px 9px;border-radius:20px;letter-spacing:.03em;
  }
  .tier-btn:disabled, .stepper button:disabled, .add-btn:disabled{
    opacity:.4;cursor:not-allowed;
  }
  .tier-btn:disabled:hover{transform:none;}
  .prod-photo .icon{width:42px;height:42px;color:rgba(9,13,11,0.55);transition:transform .35s ease;}
  .prod-card:hover .prod-photo .icon{transform:scale(1.15) rotate(6deg);}
  .prod-photo.abarrotes{background:linear-gradient(135deg,#B8F26B,#6FCB3E);}
  .prod-photo.cuidadopersonal{background:linear-gradient(135deg,#C9A6FF,#8B5CF6);}
  .prod-photo.aseo{background:linear-gradient(135deg,#7FE0FF,#2FC3FF);}
  .prod-photo.perfumeria{background:linear-gradient(135deg,#FF9EC9,#FF4FA0);}
  .prod-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;background:#fff;padding:10px;}
  .prod-top{padding:14px 18px 0;position:absolute;top:0;left:0;right:0;}
  .prod-cat{
    font-family:'IBM Plex Mono',monospace;font-size:10.5px;text-transform:uppercase;
    letter-spacing:.06em;color:#06210C;background:rgba(255,255,255,0.85);
    padding:4px 9px;border-radius:4px;font-weight:700;
  }
  .prod-body{padding:16px 18px 18px;flex:1;display:flex;flex-direction:column;}
  .prod-body h4{font-family:'Inter',sans-serif;font-weight:700;font-size:16px;margin:0 0 5px;}
  .prod-body .desc{font-size:13px;color:rgba(243,255,245,0.55);margin-bottom:14px;flex:1;}
  .prod-price{font-family:'IBM Plex Mono',monospace;font-weight:700;font-size:17px;margin-bottom:4px;color:var(--teal);display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
  .unit-badge{
    background:rgba(124,242,60,0.14);border:1px solid rgba(124,242,60,0.35);color:var(--green);
    font-size:11.5px;font-weight:700;padding:3px 8px;border-radius:20px;letter-spacing:.01em;
  }
  .prod-price small{width:100%;font-weight:400;font-size:11px;color:var(--silver);display:block;font-family:'Inter',sans-serif;margin-top:0;}
  .tier-row{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0 14px;}
  .tier-btn{
    font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:700;
    padding:6px 10px;border-radius:8px;border:1.5px solid var(--line);background:var(--card2);
    color:var(--silver);cursor:pointer;transition:all .2s ease;letter-spacing:.02em;
  }
  .tier-btn:hover{border-color:var(--green);color:var(--white);}
  .tier-btn.active{background:linear-gradient(135deg,var(--green),var(--teal));color:#06210C;border-color:transparent;}
  .qty-row{display:flex;align-items:center;justify-content:space-between;gap:10px;}
  .stepper{display:flex;align-items:center;border:1.5px solid var(--line);border-radius:10px;overflow:hidden;}
  .stepper button{
    background:var(--card2);border:none;width:32px;height:32px;font-size:16px;cursor:pointer;font-weight:700;color:var(--white);
    transition:background .15s ease;
  }
  .stepper button:hover{background:var(--green);color:#06210C;}
  .stepper span{width:34px;text-align:center;font-family:'IBM Plex Mono',monospace;font-weight:600;}
  .qty-input{
    width:40px;text-align:center;font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:14px;
    background:transparent;border:none;color:var(--white);padding:6px 0;
  }
  .qty-input:focus{outline:none;background:rgba(124,242,60,0.08);}
  /* Quita las flechitas nativas del navegador (ya tenemos los botones +/-) */
  .qty-input::-webkit-outer-spin-button, .qty-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
  .qty-input[type=number]{-moz-appearance:textfield;}
  .add-btn{
    background:var(--card2);color:var(--white);border:1.5px solid var(--line);border-radius:10px;
    padding:9px 15px;font-family:'Inter',sans-serif;font-size:12.5px;font-weight:700;cursor:pointer;
    transition:all .2s ease;
  }
  .add-btn:hover{border-color:var(--green);transform:translateY(-2px);}
  .add-btn.added{background:linear-gradient(135deg,var(--green),var(--teal));color:#06210C;border-color:transparent;}

  /* MAYORISTA */
  .split{
    border-radius:24px;
    display:grid;grid-template-columns:1fr 1fr;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,0.4);
  }
  .split-col{padding:48px 44px;position:relative;}
  .split-col:first-child{background:linear-gradient(135deg,var(--green),var(--teal));color:#06210C;}
  .split-col:last-child{background:linear-gradient(135deg,var(--card2),var(--card));color:var(--white);}
  .split-col .icon-badge{
    width:50px;height:50px;border-radius:14px;background:rgba(6,33,12,0.14);
    display:flex;align-items:center;justify-content:center;margin-bottom:18px;
  }
  .split-col:last-child .icon-badge{background:rgba(124,242,60,0.12);color:var(--green);}
  .split-col h3{font-size:23px;margin-bottom:6px;}
  .split-col .tag{font-family:'IBM Plex Mono',monospace;font-size:12px;text-transform:uppercase;letter-spacing:.08em;}
  .split-col ul{margin:20px 0 0;padding:0;list-style:none;}
  .split-col li{padding:11px 0;border-top:1px dashed rgba(6,33,12,0.18);font-size:14.5px;display:flex;gap:10px;align-items:flex-start;}
  .split-col:last-child li{border-top:1px dashed var(--line);}
  .split-col li svg{width:17px;height:17px;flex-shrink:0;margin-top:2px;}

  /* TESTIMONIOS - carousel */
  .testi-wrap{position:relative;max-width:640px;margin:0 auto;}
  .testi-track{position:relative;min-height:200px;}
  .testi-slide{
    position:absolute;inset:0;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
    padding:32px 30px;opacity:0;transform:translateX(20px);transition:opacity .5s ease, transform .5s ease;pointer-events:none;
  }
  .testi-slide.active{opacity:1;transform:translateX(0);pointer-events:auto;}
  .testi-slide .quote-mark{font-family:'Baloo 2',sans-serif;font-size:44px;color:var(--green);line-height:1;margin-bottom:6px;}
  @supports (background-clip: text) or (-webkit-background-clip: text) {
    .testi-slide .quote-mark{background:linear-gradient(135deg,var(--green),var(--teal));-webkit-background-clip:text;background-clip:text;color:transparent;}
  }
  .testi-slide p{font-size:16px;line-height:1.65;color:var(--white);margin:0 0 20px;}
  .testi-slide .who-row{display:flex;align-items:center;gap:12px;}
  .testi-slide .avatar{
    width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--green),var(--teal));color:#06210C;
    display:flex;align-items:center;justify-content:center;font-family:'IBM Plex Mono',monospace;font-weight:700;font-size:14px;
  }
  .testi-slide .who{font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:700;}
  .testi-slide .role{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--silver);}
  .testi-dots{display:flex;justify-content:center;gap:8px;margin-top:220px;}
  .testi-dots button{width:9px;height:9px;border-radius:50%;background:var(--line);border:none;cursor:pointer;transition:all .25s ease;}
  .testi-dots button.active{background:linear-gradient(135deg,var(--green),var(--teal));width:26px;border-radius:5px;}

  /* CONTACTO */
  .contact{background:var(--bg2);position:relative;overflow:hidden;}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;position:relative;z-index:1;}
  .contact p.lead{color:rgba(243,255,245,0.62);font-size:16px;line-height:1.6;margin:18px 0 28px;}
  .info-row{display:flex;gap:14px;align-items:center;margin-bottom:18px;font-size:14.5px;}
  .info-row .ic{width:38px;height:38px;border-radius:10px;background:rgba(124,242,60,0.1);border:1px solid rgba(124,242,60,0.25);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--green);}
  .info-row .ic svg{width:17px;height:17px;}
  form.orderform{background:var(--card);border:1px solid var(--line);color:var(--white);border-radius:var(--radius);padding:32px;box-shadow:0 20px 50px rgba(0,0,0,0.35);}
  form.orderform label{font-family:'IBM Plex Mono',monospace;font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;display:block;margin-bottom:7px;color:var(--green);}
  form.orderform input, form.orderform select, form.orderform textarea{
    width:100%;padding:12px 13px;border:1.5px solid var(--line);border-radius:10px;
    font-family:'Inter',sans-serif;font-size:14px;margin-bottom:17px;background:var(--card2);color:var(--white);
    transition:border-color .2s ease;
  }
  form.orderform input:focus, form.orderform select:focus, form.orderform textarea:focus{
    outline:none;border-color:var(--green);
  }
  form.orderform textarea{resize:vertical;min-height:84px;}
  .phone-input-group{display:flex;gap:8px;margin-bottom:6px;}

  /* Modal previo al envío por WhatsApp */
  .checkout-overlay{
    position:fixed;inset:0;background:rgba(0,0,0,0.65);z-index:90;display:none;
    align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(3px);
  }
  .checkout-overlay.show{display:flex;}
  .checkout-modal{
    background:var(--card);border:1px solid var(--line);border-radius:20px;padding:30px;
    max-width:420px;width:100%;position:relative;box-shadow:0 24px 60px rgba(0,0,0,0.5);
    animation:checkoutIn .28s cubic-bezier(.2,.8,.2,1);
  }
  @keyframes checkoutIn{from{opacity:0;transform:translateY(14px) scale(.97);}to{opacity:1;transform:translateY(0) scale(1);}}
  .checkout-close{
    position:absolute;top:16px;right:16px;background:var(--card2);border:none;color:var(--silver);
    width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:14px;transition:all .2s ease;
  }
  .checkout-close:hover{color:var(--white);background:var(--pink);}
  .checkout-modal h3{font-family:'Baloo 2',sans-serif;font-weight:700;font-size:19px;margin:0 0 6px;}
  .checkout-sub{font-size:13.5px;color:var(--silver);margin:0 0 20px;line-height:1.5;}
  .checkout-modal label{display:block;font-family:'IBM Plex Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--green);margin-bottom:6px;}
  .checkout-modal input{
    width:100%;background:var(--card2);border:1.5px solid var(--line);color:var(--white);
    border-radius:10px;padding:12px 14px;font-size:14px;margin-bottom:14px;font-family:'Inter',sans-serif;
  }
  .checkout-modal input:focus{outline:none;border-color:var(--green);}
  .checkout-modal .phone-input-group input{margin-bottom:0;}
  .checkout-status{font-size:13px;margin:4px 0 14px;min-height:18px;}
  .checkout-status.ok{color:var(--green);}
  .checkout-status.err{color:var(--pink);}
  .checkout-confirm:disabled{opacity:.6;cursor:not-allowed;}
  @media(max-width:480px){
    .checkout-modal{padding:24px 20px;}
  }
  .phone-prefix{
    display:flex;align-items:center;padding:0 13px;border-radius:10px;
    background:var(--card2);border:1.5px solid var(--line);color:var(--silver);
    font-family:'IBM Plex Mono',monospace;font-size:14px;font-weight:600;flex-shrink:0;
  }
  .phone-input-group input{margin-bottom:0;}
  .field-error{color:var(--pink);font-size:12.5px;margin:-2px 0 14px;min-height:16px;font-family:'Inter',sans-serif;}
  form.orderform input.input-invalid, form.orderform select.input-invalid, form.orderform textarea.input-invalid{border-color:var(--pink);}

  footer{background:var(--bg);border-top:1px solid var(--line);color:rgba(243,255,245,0.5);padding:40px 0;font-size:13px;}
  .foot-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;}
  .foot-brand{display:flex;align-items:center;gap:10px;}
  .foot-brand img{width:30px;height:30px;border-radius:50%;}
  .foot-links{display:flex;gap:22px;}
  .foot-links a:hover{color:var(--green);}
  .foot-legal{
    display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;
    margin-top:22px;padding-top:22px;border-top:1px solid var(--line);font-size:12px;
  }
  .foot-legal-info{color:rgba(243,255,245,0.55);font-family:'IBM Plex Mono',monospace;letter-spacing:.02em;}
  .foot-legal-links{display:flex;gap:18px;flex-wrap:wrap;}
  .foot-legal-links a{color:rgba(243,255,245,0.5);}
  .foot-legal-links a:hover{color:var(--green);}
  .foot-copy{margin-top:14px;font-size:11.5px;color:rgba(243,255,245,0.35);}

  /* FLOATING ORDER BAR */
  .order-bar{
    position:fixed;bottom:22px;right:22px;z-index:60;
    background:linear-gradient(135deg,var(--green),var(--teal));color:#06210C;border-radius:50px;
    padding:14px 22px;display:flex;align-items:center;gap:12px;
    box-shadow:0 12px 34px rgba(124,242,60,0.4);cursor:pointer;
    font-family:'Inter',sans-serif;font-size:13.5px;font-weight:800;
    transition:transform .2s ease;
  }
  .order-bar:hover{transform:translateY(-3px) scale(1.03);}
  .order-bar svg{width:18px;height:18px;}
  .order-bar .count{
    background:#06210C;color:var(--green);border-radius:50%;
    width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:12px;
    transition:transform .25s ease;
  }
  .count.bump{animation:bump .35s ease;}
  @keyframes bump{0%{transform:scale(1);}50%{transform:scale(1.4);}100%{transform:scale(1);}}

  .float-social-group{
    position:fixed;bottom:22px;left:22px;z-index:60;
    display:flex;flex-direction:column-reverse;align-items:center;gap:12px;
  }
  .float-social-item{
    position:relative;width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    color:#fff;box-shadow:0 8px 22px rgba(0,0,0,0.3);
    transition:transform .2s cubic-bezier(.2,.8,.3,1.2), box-shadow .2s ease;
  }
  .float-social-item:hover{transform:translateY(-4px) scale(1.06);box-shadow:0 12px 28px rgba(0,0,0,0.4);}
  .float-social-item:active{transform:translateY(-1px) scale(0.92);}
  .float-social-item svg{width:24px;height:24px;position:relative;z-index:1;}
  .float-whatsapp{background:linear-gradient(135deg,#25D366,#128C43);}
  .float-whatsapp::before{
    content:"";position:absolute;inset:0;border-radius:50%;background:#25D366;opacity:.55;
    animation:pulseRing 2.2s ease-out infinite;
  }
  .float-instagram{background:radial-gradient(circle at 30% 110%, #ffdb4d 0%, #fd5949 26%, #d6249f 61%, #285AEB 100%);}
  .float-facebook{background:#1877F2;}
  @keyframes pulseRing{0%{transform:scale(1);opacity:.55;}100%{transform:scale(1.9);opacity:0;}}
  /* Tooltip a la derecha (el grupo está a la izquierda de la pantalla) */
  .float-social-item[data-tooltip]::after{
    content:attr(data-tooltip);position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%) translateX(-4px);
    background:#0A0E0C;color:#fff;font-size:12px;font-family:'Inter',sans-serif;font-weight:600;white-space:nowrap;
    padding:7px 12px;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .2s ease, transform .2s ease;
    box-shadow:0 4px 12px rgba(0,0,0,0.3);
  }
  .float-social-item[data-tooltip]:hover::after{opacity:1;transform:translateY(-50%) translateX(0);}

  @media(max-width:600px){
    .float-social-group{bottom:16px;left:14px;gap:10px;}
    .float-social-item{width:46px;height:46px;}
    .float-social-item svg{width:21px;height:21px;}
    /* En celular el tooltip lateral no cabe bien — se oculta, el ícono ya es autoexplicativo */
    .float-social-item[data-tooltip]::after{display:none;}
  }

  .order-panel{
    position:fixed;top:0;right:-420px;width:400px;max-width:92vw;height:100%;
    background:var(--bg2);border-left:1px solid var(--line);z-index:70;box-shadow:-8px 0 40px rgba(0,0,0,0.5);
    transition:right .32s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;
  }
  .order-panel.open{right:0;}
  .order-panel-head{
    padding:24px 24px 18px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;
  }
  .order-panel-head h3{font-size:20px;color:var(--white);}
  .order-panel-head button{background:none;border:none;font-size:20px;cursor:pointer;color:var(--white);}
  .order-items{flex:1;overflow-y:auto;padding:16px 24px;}
  .order-item{
    display:flex;justify-content:space-between;align-items:center;
    padding:13px 0;border-bottom:1px dotted var(--line);gap:10px;
  }
  .order-item .oi-name{font-size:14px;font-weight:600;color:var(--white);}
  .order-item .oi-meta{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--silver);}
  .order-item .oi-remove{background:none;border:none;color:var(--pink);cursor:pointer;font-size:13px;font-family:'IBM Plex Mono',monospace;}
  .order-empty{text-align:center;color:var(--silver);padding:70px 20px;font-size:14px;}
  .order-panel-foot{padding:22px 24px 28px;border-top:1px solid var(--line);background:var(--card);}
  .sum-row{display:flex;justify-content:space-between;font-family:'IBM Plex Mono',monospace;font-size:13px;margin-bottom:8px;color:var(--silver);}
  .sum-row.free{color:var(--green);}
  .order-panel-foot .tot-row{display:flex;justify-content:space-between;font-family:'IBM Plex Mono',monospace;font-weight:700;font-size:16px;margin:10px 0 15px;padding-top:10px;border-top:1px dashed var(--line);color:var(--white);}
  .ship-hint{font-size:11px;color:var(--silver);margin-bottom:14px;font-family:'Inter',sans-serif;line-height:1.5;}
  .ship-hint b{color:var(--green);}
  .overlay{
    position:fixed;inset:0;background:rgba(0,0,0,0.6);z-index:65;opacity:0;pointer-events:none;transition:opacity .3s;
  }
  .overlay.show{opacity:1;pointer-events:auto;}

  @media(max-width:1500px){
    .logo-text-new{display:none;}
  }

  @media(max-width:1100px){
    .logo-wordmark-img{height:26px;}
    .nav-links{display:none;}
    .menu-toggle{display:block;}
  }
  @media(max-width:920px){
    .hero-grid{grid-template-columns:1fr;}
    .hero-stats{gap:24px;}
    .cat-grid,.prod-grid,.step-row{grid-template-columns:1fr 1fr;}
    .split{grid-template-columns:1fr;}
    .contact-grid{grid-template-columns:1fr;}
    section{padding:80px 0;}
  }
  @media(max-width:600px){
    .nav-cta .btn-primary{display:none;}
    .cat-grid,.step-row{grid-template-columns:1fr;}
    .prod-grid{grid-template-columns:repeat(2,1fr);gap:10px;}
    .prod-photo{height:110px;}
    .prod-body{padding:10px 12px 12px;}
    .prod-body h4{font-size:13px;line-height:1.25;}
    .prod-body .desc{font-size:11px;margin-bottom:8px;}
    .prod-price{font-size:14px;margin-bottom:8px;}
    .unit-badge{font-size:10px;padding:2px 7px;}
    .tier-row{gap:4px;margin:8px 0 10px;}
    .tier-btn{font-size:9px;padding:5px 7px;}
    .qty-row{flex-direction:column;align-items:stretch;gap:8px;}
    .stepper{justify-content:center;}
    .add-btn{width:100%;justify-content:center;padding:9px;}
    section{padding:64px 0;}
    .order-bar span.label{display:none;}
    .split-col{padding:36px 26px;}
    .hero{padding:56px 0 70px;}
    .hero-benefits{grid-template-columns:1fr;}
    .testi-dots{margin-top:260px;}
  }
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{transition:none !important;animation:none !important;}
    .reveal{opacity:1;transform:none;}
  }