:root{
    --ink:#1A1A1A;
    --yellow:#F0C426;
    --yellow-deep:#D9A916;
    --steel:#6B6E70;
    --white:#FFFFFF;
    --line:#DDD9D0;
    --gray-section:#E4E4E4;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Inter',sans-serif;
    color:var(--ink);
    background:var(--white);
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  img{display:block; max-width:100%;}
  h1,h2,h3,.eyebrow-label{font-family:'Oswald',sans-serif; text-transform:uppercase;}
  h1{font-size:clamp(2.1rem, 5vw, 3.6rem); font-weight:700; line-height:1.05; letter-spacing:0.5px;}
  h2{font-size:clamp(1.6rem, 3vw, 2.3rem); font-weight:600; letter-spacing:0.5px;}
  h3{font-size:1.05rem; font-weight:600; letter-spacing:0.5px;}
  p{color:var(--steel);}
  a{color:inherit; text-decoration:none;}
  .container{max-width:1180px; margin:0 auto; padding:0 28px;}
  section{padding:88px 0;}
  @media(max-width:640px){ section{padding:56px 0;} }

  /* ---------- NAV ---------- */
  .nav{
    position:sticky; top:0; z-index:50;
    background:var(--white);
    border-bottom:1px solid var(--line);
  }
  .nav-inner{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 28px; max-width:1180px; margin:0 auto;
  }
  .nav-logo img{height:52px; width:auto;}
  .nav-links{display:flex; align-items:center; gap:30px;}
  .nav-links a{
    color:var(--ink); font-family:'Oswald',sans-serif; font-size:0.86rem;
    letter-spacing:0.06em; text-transform:uppercase; font-weight:500;
    padding:6px 0; border-bottom:2px solid transparent; transition:border-color .15s;
  }
  .nav-links a:hover{border-bottom-color:var(--yellow);}
  .nav-cta{
    background:var(--ink); color:var(--white) !important; padding:10px 20px !important;
    border-radius:3px; font-weight:700 !important; border-bottom:none !important;
  }
  .nav-cta:hover{background:#333;}
  .nav-toggle{display:none;}
  @media(max-width:860px){
    .nav-links{
      position:absolute; top:100%; left:0; right:0; background:var(--white);
      flex-direction:column; align-items:flex-start; padding:18px 28px; gap:16px;
      display:none; border-bottom:1px solid var(--line);
    }
    .nav-links.open{display:flex;}
    .nav-toggle{
      display:block; background:none; border:none; color:var(--ink); font-size:1.6rem; cursor:pointer;
    }
    .nav-logo img{height:42px;}
  }

  /* ---------- HERO ---------- */
  .hero{
    position:relative; min-height:88vh; display:flex; align-items:flex-end;
    background:#111 url('img/hero.jpg') center 20%/cover no-repeat;
  }
  .hero::before{
    content:""; position:absolute; inset:0;
    background:linear-gradient(0deg, rgba(10,10,10,.92) 0%, rgba(10,10,10,.55) 42%, rgba(10,10,10,.08) 75%);
  }
  .hero-content{
    position:relative; z-index:2; padding:64px 28px 72px; max-width:1180px; margin:0 auto; width:100%;
  }
  .hero-tab{
    display:inline-block; background:var(--yellow); color:var(--ink);
    font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:0.06em;
    text-transform:uppercase; font-size:0.82rem; padding:7px 16px; border-radius:3px; margin-bottom:22px;
  }
  .hero h1{color:var(--white); max-width:720px;}
  .hero p.lead{color:#E7E5E0; max-width:560px; margin-top:20px; font-size:1.08rem;}
  .hero-actions{display:flex; flex-wrap:wrap; gap:14px; margin-top:34px;}
  .btn{
    display:inline-flex; align-items:center; gap:8px; padding:14px 26px;
    font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:0.04em;
    text-transform:uppercase; font-size:0.9rem; border-radius:3px; cursor:pointer; border:2px solid transparent;
  }
  .btn-primary{background:var(--yellow); color:var(--ink);}
  .btn-primary:hover{background:var(--yellow-deep);}
  .btn-ghost{border-color:rgba(255,255,255,.55); color:var(--white);}
  .btn-ghost:hover{border-color:var(--white); background:rgba(255,255,255,.08);}

  /* ---------- INTRO / QUIENES SOMOS ---------- */
  .intro{background:var(--white);}
  .intro-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:start;}
  @media(max-width:860px){.intro-grid{grid-template-columns:1fr; gap:32px;}}
  .kicker{
    font-family:'Oswald',sans-serif; font-weight:600; color:var(--ink);
    letter-spacing:0.08em; text-transform:uppercase; font-size:0.85rem; margin-bottom:10px; display:block;
  }
  .intro p{font-size:1.02rem; margin-top:16px;}
  .stat-row{display:flex; gap:36px; margin-top:34px; flex-wrap:wrap;}
  .stat b{font-family:'Oswald',sans-serif; font-size:1.9rem; display:block; color:var(--ink);}
  .stat span{font-size:0.85rem; color:var(--steel);}

  /* ---------- CATEGORIAS ---------- */
  .categorias{background:var(--gray-section);}
  .categorias p{color:#3F3F3F;}
  .cat-head{max-width:640px; margin-bottom:48px;}
  .cat-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:22px;}
  @media(max-width:960px){.cat-grid{grid-template-columns:1fr 1fr;}}
  @media(max-width:560px){.cat-grid{grid-template-columns:1fr;}}
  .cat-card{
    position:relative; background:var(--ink); overflow:hidden; aspect-ratio:3/4;
  }
  .cat-card img{width:100%; height:100%; object-fit:cover; opacity:0.88; transition:transform .35s;}
  .cat-card:hover img{transform:scale(1.05);}
  .cat-tag{
    position:absolute; left:14px; bottom:14px; right:14px;
    background:var(--yellow); color:var(--ink); padding:10px 12px; border-radius:3px;
    font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase;
    font-size:0.86rem; letter-spacing:0.02em; line-height:1.2;
  }

  /* ---------- ICONOS ---------- */
  .icon-badge{
    width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
  }
  .icon-badge svg{width:26px; height:26px;}
  .icon-badge.on-yellow{background:var(--yellow);}
  .icon-badge.on-yellow svg{stroke:var(--ink);}
  .icon-badge.on-navy{background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.3);}
  .icon-badge.on-navy svg{stroke:var(--yellow);}
  .icon-badge.on-dark{background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.3);}
  .icon-badge.on-dark svg{stroke:var(--yellow);}
  .icon-badge.on-white{background:var(--gray-section);}
  .icon-badge.on-white svg{stroke:var(--ink);}

  /* ---------- SERVICIOS ANALITICOS (NORTIA) ---------- */
  .lab{
    background:var(--ink); color:var(--white); position:relative;
  }
  .lab-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:56px; align-items:center;}
  @media(max-width:860px){.lab-grid{grid-template-columns:1fr;}}
  .lab h2{color:var(--white);}
  .lab p{color:#C9C9C9;}
  .badge-row{display:flex; flex-wrap:wrap; gap:10px; margin-top:26px;}
  .badge{
    border:1px solid rgba(255,255,255,.35); padding:8px 14px; border-radius:20px;
    font-size:0.82rem; font-weight:600; letter-spacing:0.03em;
  }
  .lab-list{list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:12px 20px; margin-top:26px;}
  .lab-list li{font-size:0.94rem; color:#E4E4E4; padding-left:18px; position:relative;}
  .lab-list li::before{content:"•"; position:absolute; left:0; color:var(--yellow); font-size:1.1rem; line-height:1;}
  .lab-visual{
    background:var(--white) url('img/laboratorio.jpg') center 25%/cover no-repeat;
    aspect-ratio:16/11; border-radius:4px;
  }

  /* ---------- SOLUCIONES LOGISTICAS ---------- */
  .logistica{
    position:relative; color:var(--white);
    background:#111 url('img/logistica-fondo.jpg') center 25%/cover no-repeat;
  }
  .logistica::before{content:""; position:absolute; inset:0; background:rgba(15,15,15,.82);}
  .logistica .container{position:relative; z-index:2;}
  .logistica h2{color:var(--white);}
  .logistica p.lead{color:#E4E1DA; max-width:600px; margin-top:14px;}
  .log-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:40px;}
  @media(max-width:860px){.log-grid{grid-template-columns:1fr 1fr;}}
  @media(max-width:560px){.log-grid{grid-template-columns:1fr;}}
  .log-card{
    position:relative; aspect-ratio:3/4; border-radius:4px; overflow:hidden;
    background-size:cover; background-position:center;
  }
  .log-card::before{
    content:""; position:absolute; inset:0;
    background:linear-gradient(0deg, rgba(10,10,10,.92) 0%, rgba(10,10,10,.55) 45%, rgba(10,10,10,.05) 75%);
  }
  .log-card-content{position:absolute; left:0; right:0; bottom:0; padding:20px; z-index:2;}
  .log-card .icon-badge{margin-bottom:14px; width:44px; height:44px;}
  .log-card .icon-badge svg{width:22px; height:22px;}
  .log-card h3{color:var(--yellow); margin-bottom:6px; font-size:0.98rem;}
  .log-card p{color:#E4E1DA; font-size:0.85rem;}

  /* ---------- POR QUE ELEGIRNOS ---------- */
  .porque{background:var(--white);}
  .porque-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:36px; margin-top:44px;}
  @media(max-width:760px){.porque-grid{grid-template-columns:1fr; gap:28px;}}
  .porque-item{border-top:3px solid var(--yellow); padding-top:18px;}
  .porque-item .icon-badge{margin-bottom:14px;}
  .porque-item h3{margin-bottom:10px;}
  .porque-item p{font-size:0.95rem;}

  /* ---------- ALIADOS ---------- */
  .aliados{background:var(--gray-section);}
  .aliados-top p{color:#3F3F3F;}
  .aliados-top{max-width:680px;}
  .brand-tags{display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-top:24px;}
  .brand-tags .logo-chip{
    background:var(--white); border:1px solid var(--line); border-radius:4px;
    padding:12px 18px; display:flex; align-items:center; justify-content:center; height:56px;
  }
  .brand-tags .logo-chip img{height:100%; width:auto; max-width:130px; object-fit:contain;}
  .pillar-row{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:56px;}
  @media(max-width:640px){.pillar-row{grid-template-columns:1fr;}}
  .pillar{background:var(--white); padding:28px; border-radius:4px; border:1px solid var(--line);}
  .pillar .icon-badge{margin-bottom:14px;}
  .pillar h3{color:var(--ink); margin-bottom:8px;}
  .pillar p{font-size:0.92rem;}

  /* ---------- CONTACTO / FOOTER ---------- */
  .contacto{background:var(--ink); color:var(--white); padding:88px 0 48px;}
  @media(max-width:640px){ .contacto{padding:56px 0 32px;} }
  .contacto-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px;}
  @media(max-width:860px){.contacto-grid{grid-template-columns:1fr; gap:36px;}}
  .contacto h2{color:var(--white);}
  .contacto p{color:#B9B6AE;}
  .contact-list{list-style:none; margin-top:28px; display:flex; flex-direction:column; gap:16px;}
  .contact-list li{font-size:1rem; color:#E7E4DC;}
  .contact-list a{transition:color .15s;}
  .contact-list a:hover{color:var(--yellow);}
  .contact-list b{font-family:'Oswald',sans-serif; display:block; font-size:0.76rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--yellow); margin-bottom:3px; font-weight:600;}
  .foot-panel{background:#242424; border-radius:4px; padding:32px;}
  .foot-panel h3{color:var(--white); margin-bottom:14px;}
  .foot-panel .btn-primary{width:100%; justify-content:center; margin-top:18px;}
  .copyright{
    border-top:1px solid #333; margin-top:64px; padding-top:24px;
    display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
    font-size:0.78rem; color:#8C897F;
  }

  /* ---------- WHATSAPP FLOTANTE ---------- */
  .wa-float{
    position:fixed; right:24px; bottom:24px; z-index:60;
    width:58px; height:58px; border-radius:50%;
    background:#25D366; display:flex; align-items:center; justify-content:center;
    box-shadow:0 6px 18px rgba(0,0,0,.28); transition:transform .15s;
  }
  .wa-float:hover{transform:scale(1.07);}
  .wa-float svg{width:30px; height:30px;}
  @media(max-width:640px){
    .wa-float{right:16px; bottom:16px; width:52px; height:52px;}
  }

/* ---------- AGREGADOS PARA WORDPRESS ---------- */

/* La barra de admin de WP tapa el menu pegajoso cuando estas logueado. */
body.admin-bar .nav{top:32px;}
@media(max-width:782px){ body.admin-bar .nav{top:46px;} }

/* Sin esto, TODA ancla (#nosotros, #categorias, y las que llegan desde la tienda)
   cae tapada por el menu pegajoso, que mide unos 81px. */
section[id], header[id], footer[id], .ancla-alias{ scroll-margin-top:96px; }
@media(max-width:860px){
  section[id], header[id], footer[id], .ancla-alias{ scroll-margin-top:86px; }
}
.ancla-alias{ display:block; height:0; }

/* Las tarjetas de rubro pasaron de <div> a <a>: llevan a su seccion del catalogo. */
.cat-card{ display:block; cursor:pointer; }

/* El boton de WhatsApp, a la esquina opuesta del chatbot.
   Los dos venian en la esquina inferior derecha (WhatsApp en right:24px/bottom:24px,
   el bot de AI Engine en right:30px/bottom:30px con z-index 9999), asi que el bot
   tapaba a WhatsApp y no se podia tocar. Apilarlos en vertical tampoco servia: el
   globo de "Dudas? Estoy para ayudarte!" sale justo arriba del bot y se solapaba igual.
   Separandolos por lado, los dos quedan siempre alcanzables, y ademas no depende del
   tamano del bot, que se puede cambiar desde el escritorio de WordPress. */
.wa-float{ right:auto !important; left:24px !important; }
@media(max-width:640px){
  .wa-float{ right:auto !important; left:16px !important; }
}

/* Carrito en el menu (WooCommerce). */
.nav-cart{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; color:var(--ink); border-bottom:none !important; padding:0 !important;
}
.nav-cart svg{width:22px; height:22px; stroke:currentColor; fill:none; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round;}
.nav-cart:hover{color:var(--yellow-deep);}
.nav-cart-count{
  position:absolute; top:-2px; right:-4px; min-width:18px; height:18px; padding:0 5px;
  background:var(--yellow); color:var(--ink); border-radius:9px;
  font-family:'Oswald',sans-serif; font-size:0.7rem; font-weight:700;
  display:flex; align-items:center; justify-content:center; line-height:1;
}
.nav-cart-count:empty{display:none;}
@media(max-width:860px){
  .nav-cart{width:auto; height:auto; justify-content:flex-start; gap:10px;}
  .nav-cart::after{content:"Carrito"; font-family:'Oswald',sans-serif; font-size:0.86rem;
    letter-spacing:0.06em; text-transform:uppercase; font-weight:500;}
  .nav-cart-count{position:static; margin-left:2px;}
}