/* Duratex — CSS portado del sitio actual (duratexcol.com). Editable. */
body { margin:0; padding:0; background:#f8fafc; overflow-x:hidden; }
  * { box-sizing:border-box; }
  html { scroll-behavior:smooth; }
  @keyframes heroPing { 0%,100%{opacity:1} 50%{opacity:.4} }
  @keyframes waRing { 0%{transform:scale(1);opacity:.6} 100%{transform:scale(1.6);opacity:0} }
  @keyframes faqOpen { from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)} }
  .tax-slider { -webkit-appearance:none; width:100%; background:transparent; }
  .tax-slider::-webkit-slider-thumb { -webkit-appearance:none; height:24px; width:24px; border-radius:50%; background:#16a34a; cursor:pointer; margin-top:-10px; box-shadow:0 0 0 4px #dcfce7; transition:box-shadow .2s; }
  .tax-slider::-webkit-slider-thumb:hover { box-shadow:0 0 0 6px #bbf7d0; }
  .tax-slider::-webkit-slider-runnable-track { width:100%; height:4px; cursor:pointer; background:#e2e8f0; border-radius:2px; }
  input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
  .product-card { background:#fff; border-radius:16px; overflow:hidden; border:1px solid #e2e8f0; box-shadow:0 2px 12px rgba(0,0,0,.04); transition:transform .3s cubic-bezier(.22,.68,0,1.2), box-shadow .3s; cursor:pointer; position:relative !important; }
  .product-card:hover { transform:translateY(-6px) scale(1.02) !important; box-shadow:0 20px 40px rgba(22,163,74,.14) !important; }
  .dtx-prod-img-wrap { position:relative !important; overflow:hidden; aspect-ratio:1/1; background:#fff; }
  .product-card .product-img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; display:block; }
  .product-card:hover .product-img { transform:scale(1.08) !important; }
  .product-card .product-overlay { position:absolute !important; inset:0; background:rgba(5,46,22,.6); display:flex !important; align-items:center; justify-content:center; opacity:0; transition:opacity .3s; pointer-events:none; }
  .product-card:hover .product-overlay { opacity:1 !important; pointer-events:auto; }
  .product-card .product-btn { background:#16a34a; color:#fff; font-family:'DM Sans',sans-serif; font-weight:700; font-size:14px; padding:10px 22px; border-radius:100px; text-decoration:none; transform:translateY(8px); transition:all .3s; display:inline-block; pointer-events:auto; }
  .product-card:hover .product-btn { transform:translateY(0) !important; }
  .product-card .product-btn:hover { background:#15803d; }
  .dtx-form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
  .dtx-input { width:100%; padding:12px 16px; border:1.5px solid #e2e8f0; border-radius:12px; font-family:'DM Sans',sans-serif; font-size:15px; color:#374151; background:#f8fafc; transition:all .2s; outline:none; }
  .dtx-input:focus { border-color:#16a34a; box-shadow:0 0 0 3px rgba(22,163,74,.12); background:#fff; }
  .dtx-label { font-family:'DM Sans',sans-serif; font-size:14px; font-weight:600; color:#374151; display:block; margin-bottom:6px; }
  /* Tarjeta de marca clickeable */
  .marca-wrap { position:relative; border-radius:24px; overflow:hidden; border:1px solid #e2e8f0; box-shadow:0 2px 16px rgba(0,0,0,.04); transition:transform .3s ease, box-shadow .3s ease; cursor:pointer; }
  .marca-wrap:hover { transform:translateY(-6px); box-shadow:0 20px 48px rgba(22,163,74,.13); }
  .marca-wrap .marca-overlay { position:absolute; bottom:0; left:0; width:100%; background:rgba(22,163,74,.85); color:#fff; font-family:'DM Sans',sans-serif; font-weight:700; font-size:15px; text-align:center; padding:14px; opacity:0; transition:opacity .25s; pointer-events:none; }
  .marca-wrap:hover .marca-overlay { opacity:1; }
  .marca-wrap a.marca-link { position:absolute; inset:0; z-index:10; display:block; text-decoration:none; }
  .marca-img { width:100%; height:auto; display:block; transition:transform .4s ease; }
  .marca-wrap:hover .marca-img { transform:scale(1.04); }
  /* ── ESCAPE DEL CONTENEDOR DUDA — va de borde a borde ── */
  .dtx-full-bleed { width:100%; max-width:100%; position:relative; margin-left:0; margin-right:0; left:auto; right:auto; }
  @media (max-width:600px) { .dtx-form-row { grid-template-columns:1fr; } }
  @media (max-width:900px) { .marcas-grid { grid-template-columns:repeat(2,1fr) !important; } }
  @media (max-width:500px) { .marcas-grid { grid-template-columns:1fr !important; } }

.dtxf * { box-sizing: border-box; margin: 0; padding: 0; }
.dtxf {
  background: #0a1220;
  font-family: 'DM Sans', sans-serif;
  padding: 64px 5% 0;
}
.dtxf-grid {
  display: grid;
  grid-template-columns: 1.7fr 1fr 1fr 1fr 1.4fr;
  gap: 40px;
  padding-bottom: 52px;
  border-bottom: 1px solid rgba(255,255,255,0.12);
}
/* ── Bloque de contacto del footer ── */
.dtxf-contact { display: flex; flex-direction: column; gap: 10px; margin-top: 18px; }
.dtxf-contact-item {
  display: inline-flex !important; align-items: center; gap: 10px;
  font-size: 13.5px !important; color: rgba(255,255,255,0.82) !important;
  text-decoration: none !important; margin-bottom: 0 !important; transition: color .2s !important;
  word-break: break-word;
}
.dtxf-contact-item:hover { color: #4ade80 !important; }
.dtxf-contact-ico {
  width: 30px; height: 30px; flex-shrink: 0; border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(74,222,128,0.12); border: 1px solid rgba(74,222,128,0.22);
  color: #4ade80; font-size: 13px;
}
/* ── Títulos de columna ── */
.dtxf .dtxf-col h4 {
  font-size: 11px !important; font-weight: 700 !important;
  color: #4ade80 !important;
  letter-spacing: .12em !important; text-transform: uppercase !important;
  margin-bottom: 20px !important;
  font-family: 'DM Sans', sans-serif !important;
}
/* ── Links de navegación ── */
.dtxf .dtxf-col a {
  display: block !important; font-size: 14px !important;
  color: rgba(255,255,255,0.80) !important;
  text-decoration: none !important; margin-bottom: 11px !important;
  transition: color .2s, padding-left .2s !important;
}
.dtxf .dtxf-col a:hover { color: #4ade80 !important; padding-left: 4px !important; }
/* ── Descripción de empresa ── */
.dtxf .dtxf-desc {
  font-size: 14px !important; color: rgba(255,255,255,0.65) !important;
  line-height: 1.75 !important; margin-top: 18px !important;
}
/* ── Insignia eco ── */
.dtxf-badge {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 20px; padding: 6px 12px;
  background: rgba(74,222,128,0.12);
  border: 1px solid rgba(74,222,128,0.25);
  border-radius: 100px;
  font-size: 11px; font-weight: 700;
  color: #4ade80; letter-spacing: .04em;
}
/* ── REDES SOCIALES ── */
.dtxf-social-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 4px;
}
.dtxf-social-btn {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 14px; border-radius: 12px;
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.12);
  text-decoration: none !important;
  transition: all .2s; cursor: pointer;
  margin-bottom: 0 !important;
}
.dtxf-social-btn:hover {
  background: rgba(255,255,255,0.14) !important;
  border-color: rgba(74,222,128,0.35) !important;
  transform: translateY(-2px);
  color: inherit !important;
}
.dtxf-social-icon {
  width: 32px; height: 32px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 15px; flex-shrink: 0; color: #fff;
}
.dtxf .dtxf-social-name {
  font-size: 12px !important; font-weight: 700 !important;
  color: rgba(255,255,255,0.92) !important; line-height: 1 !important;
  display: block !important;
}
.dtxf .dtxf-social-handle {
  font-size: 10px !important; color: rgba(255,255,255,0.50) !important;
  margin-top: 3px !important; line-height: 1 !important; display: block !important;
}
.dtxf-fb { background: #1877f2; }
.dtxf-ig { background: linear-gradient(135deg,#f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); }
.dtxf-li { background: #0a66c2; }
.dtxf-tt { background: #111; border: 1px solid rgba(255,255,255,0.15); }
/* ── BARRA INFERIOR ── */
.dtxf-bottom {
  display: flex; flex-wrap: wrap;
  justify-content: space-between; align-items: center;
  gap: 16px; padding: 24px 0;
}
.dtxf .dtxf-copy { font-size: 13px !important; color: rgba(255,255,255,0.50) !important; }
.dtxf-dev {
  font-size: 12px; color: rgba(255,255,255,0.50);
  display: flex; align-items: center; gap: 5px;
}
.dtxf-dev a {
  color: #4ade80 !important; text-decoration: none !important;
  font-weight: 700; margin-bottom: 0 !important;
}
.dtxf-dev a:hover { opacity: .8; }
@media (max-width: 960px) {
  .dtxf-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 560px) {
  .dtxf-grid { grid-template-columns: 1fr; gap: 28px; }
  .dtxf-bottom { flex-direction: column; text-align: center; }
}

/* ============================================================
   TICKER DE ALIADOS COMERCIALES (sin Tailwind)
============================================================ */
.dtx-ticker { background: #fff; border-top: 1px solid #eef2f5; border-bottom: 1px solid #eef2f5; padding: 30px 0; overflow: hidden; }
.dtx-ticker__title { text-align: center; font-family: 'DM Sans', sans-serif; font-size: 12px; font-weight: 700; color: #94a3b8; letter-spacing: .2em; text-transform: uppercase; margin: 0 0 22px; }
.dtx-ticker__viewport { overflow: hidden; width: 100%; }
.dtx-ticker__track { display: flex; align-items: center; gap: 64px; width: max-content; padding: 0 32px; animation: dtxScroll 32s linear infinite; }
.dtx-ticker:hover .dtx-ticker__track { animation-play-state: paused; }
.dtx-ally { display: flex; align-items: center; gap: 12px; flex-shrink: 0; filter: grayscale(1); opacity: .7; transition: all .3s ease; }
.dtx-ally:hover { filter: grayscale(0); opacity: 1; }
.dtx-ally__logo { font-family: 'Sora', sans-serif; font-size: 22px; font-weight: 900; line-height: 1; }
.dtx-ally__badge { width: 34px; height: 34px; border-radius: 7px; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; font-family: 'Sora', sans-serif; flex-shrink: 0; }
.dtx-ally__meta { display: flex; flex-direction: column; }
.dtx-ally__meta b { font-family: 'DM Sans', sans-serif; font-size: 12px; font-weight: 700; color: #0f172a; line-height: 1.1; }
.dtx-ally__meta i { font-family: 'DM Sans', sans-serif; font-size: 10px; font-style: normal; color: #64748b; }
@keyframes dtxScroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* ============================================================
   BANDA "YA PUEDES COMPRAR EN LÍNEA" (integración tienda)
============================================================ */
.dtx-shopband { padding: 64px 5%; background: #f8fafc; }
.dtx-shopband__box {
  max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: 40px;
  background: linear-gradient(145deg,#052e16 0%,#166534 100%); border-radius: 28px; padding: 44px 44px;
  box-shadow: 0 24px 60px rgba(5,46,22,.25); position: relative; overflow: hidden;
}
.dtx-shopband__tag {
  display: inline-block; font-family: 'DM Sans', sans-serif; font-size: 12px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: #4ade80; background: rgba(74,222,128,.14); border: 1px solid rgba(74,222,128,.3);
  padding: 6px 14px; border-radius: 100px; margin-bottom: 16px;
}
.dtx-shopband__text h2 { font-family: 'Sora', sans-serif; font-size: clamp(1.8rem,3.4vw,2.6rem); font-weight: 800; color: #fff; margin: 0 0 12px; line-height: 1.15; }
.dtx-shopband__text p { font-family: 'DM Sans', sans-serif; font-size: 1.02rem; color: rgba(255,255,255,.82); line-height: 1.7; margin: 0 0 24px; }
.dtx-shopband__text p strong { color: #4ade80; }
.dtx-shopband__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.dtx-btn--onlight { background: #fff; color: #052e16; box-shadow: 0 8px 22px rgba(0,0,0,.18); }
.dtx-btn--onlight:hover { background: #f0fdf4; transform: translateY(-2px); }
.dtx-shopband__note { font-family: 'DM Sans', sans-serif; font-size: 13px; color: rgba(255,255,255,.75); }
.dtx-shopband__thumbs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.dtx-shopband__thumb { border-radius: 16px; overflow: hidden; aspect-ratio: 1/1; background: #fff; display: block; box-shadow: 0 8px 24px rgba(0,0,0,.15); }
.dtx-shopband__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.dtx-shopband__thumb:hover img { transform: scale(1.07); }
@media (max-width: 860px) {
  .dtx-shopband__box { grid-template-columns: 1fr; padding: 34px 26px; }
}