/* Ferromateriales El Castillo · gris luminoso + verde del letrero */
:root{
  --fondo:#eceef1; --fondo2:#f6f7f9; --blanco:#fff; --acero:#d5d9df; --acero2:#b9bfc8;
  --grafito:#2b2f36; --tinta:#1d2026; --gris:#5e6571; --gris2:#878e9a;
  --verde:#6cbf3c; --verde2:#4c9a27; --verde-luz:#9be06a;
  --luz:0 1px 0 rgba(255,255,255,.9) inset, 0 18px 40px -18px rgba(30,36,46,.28);
  --r:18px; --anc:1200px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:Inter,system-ui,sans-serif;color:var(--tinta);line-height:1.55;font-size:16px;
  background:radial-gradient(1200px 600px at 85% -10%,#fff 0%,rgba(255,255,255,0) 60%),radial-gradient(900px 500px at -10% 30%,#fbfcfd 0%,rgba(251,252,253,0) 60%),var(--fondo);
  background-attachment:fixed;overflow-x:hidden}
img,video,iframe{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
.ico{width:1em;height:1em;flex:none}
h1,h2,h3{font-family:Archivo,Inter,sans-serif;letter-spacing:-.02em;line-height:1.05}
em{font-style:normal}
.saltar{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 14px;border-radius:8px;z-index:200}
.saltar:focus{left:8px}
:focus-visible{outline:3px solid var(--verde);outline-offset:3px;border-radius:6px}
.eti{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--verde2)}
.eti:before{content:'';width:22px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--verde),var(--verde-luz))}

/* ── botones ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 22px;border-radius:999px;font-weight:700;text-decoration:none;transition:transform .2s,box-shadow .2s,background .2s;font-size:15.5px;white-space:nowrap}
.btn .ico{width:18px;height:18px}
.btn:hover{transform:translateY(-2px)}
.btn-luz{background:linear-gradient(180deg,#fff,#e9ecef);color:var(--tinta);box-shadow:0 10px 30px -8px rgba(255,255,255,.55),0 0 0 1px rgba(255,255,255,.7) inset}
.btn-vidrio{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.btn-verde{background:linear-gradient(180deg,var(--verde-luz),var(--verde) 45%,var(--verde2));color:#0f2a05;box-shadow:0 12px 28px -10px rgba(76,154,39,.7),0 1px 0 rgba(255,255,255,.6) inset}
.btn-borde{border:1.5px solid var(--acero2);background:var(--blanco);color:var(--tinta)}

/* ── barra superior ── */
.barra{position:sticky;top:0;z-index:50;transition:background .3s,box-shadow .3s}
.barra-in{max-width:var(--anc);margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:20px}
.barra{background:rgba(246,247,249,.82);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);box-shadow:0 1px 0 rgba(0,0,0,.06)}
.barra.sobre-hero{position:fixed;left:0;right:0;background:linear-gradient(180deg,rgba(15,17,21,.55),rgba(15,17,21,0));box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;color:#fff}
.barra.sobre-hero.solida{background:rgba(246,247,249,.9);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);box-shadow:0 1px 0 rgba(0,0,0,.06);color:var(--tinta)}
.marca{display:flex;align-items:center;gap:11px;text-decoration:none}
.marca-sello{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;font-family:Archivo;font-weight:900;font-size:18px;color:#10300a;
  background:linear-gradient(145deg,var(--verde-luz),var(--verde) 50%,var(--verde2));box-shadow:0 6px 18px -6px rgba(76,154,39,.8),0 1px 0 rgba(255,255,255,.7) inset}
.marca-sello.grande{width:58px;height:58px;font-size:23px;border-radius:16px}
.marca-txt{display:flex;flex-direction:column;line-height:1}
.marca-txt small{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;opacity:.75}
.marca-txt b{font-family:Archivo;font-weight:900;font-size:22px;letter-spacing:-.01em}
.menu{margin-left:auto;display:flex;align-items:center;gap:6px}
.menu a{text-decoration:none;font-weight:600;font-size:15px;padding:9px 14px;border-radius:999px;transition:background .2s}
.menu a:hover{background:rgba(127,135,148,.16)}
.menu a[aria-current]{background:rgba(108,191,60,.18);color:var(--verde2)}
.barra.sobre-hero:not(.solida) .menu a[aria-current]{color:#fff;background:rgba(255,255,255,.18)}
.menu .btn-wa{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(180deg,var(--verde-luz),var(--verde));color:#0f2a05;margin-left:6px}
.menu .btn-wa:hover{background:linear-gradient(180deg,var(--verde-luz),var(--verde2))}
.hamburguesa{display:none;margin-left:auto;width:44px;height:44px;border-radius:12px;place-items:center}
.hamburguesa .ico{width:28px;height:28px}

/* ── hero ── */
.hero{position:relative;height:100vh;height:100svh;min-height:520px;overflow:hidden;background:#111317;color:#fff}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 1s ease;pointer-events:none}
.hero-slide.activo{opacity:1;pointer-events:auto}
.hero-fondo{position:absolute;inset:-6%;width:112%;height:112%;object-fit:cover;filter:blur(28px) brightness(.7) saturate(1.2);transform:scale(1.05)}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.hero-velo{position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,14,18,.82) 0%,rgba(12,14,18,.45) 38%,rgba(12,14,18,0) 62%),linear-gradient(0deg,rgba(12,14,18,.6) 0%,rgba(12,14,18,0) 35%);pointer-events:none}
.hero-texto{position:absolute;left:max(24px,calc((100vw - var(--anc))/2 + 20px));bottom:9vh;max-width:620px;z-index:3}
.hero-texto .eti{color:var(--verde-luz)}
.hero-texto h1{font-size:clamp(36px,4.6vw,62px);font-weight:900;margin:14px 0 16px;text-shadow:0 4px 30px rgba(0,0,0,.4)}
.hero-texto h1 em{background:linear-gradient(90deg,#fff,var(--verde-luz));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-texto p{font-size:clamp(16px,1.6vw,19px);color:#e3e7ec;max-width:460px}
.hero-acciones{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.hero-puntos{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:flex;gap:8px;z-index:3}
.hero-puntos button{width:46px;height:20px;display:grid;place-items:center}
.hero-puntos i{display:block;width:100%;height:4px;border-radius:4px;background:rgba(255,255,255,.3);overflow:hidden;position:relative}
.hero-puntos i:after{content:'';position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:left}
.hero-puntos [aria-selected=true] i:after{transform:scaleX(var(--p,0))}
.hero-sonido{position:absolute;right:22px;bottom:22px;z-index:3;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.hero-sonido .ico{width:22px;height:22px}
.hero-sonido .on,.hero-sonido[aria-pressed=true] .off{display:none}
.hero-sonido[aria-pressed=true] .on{display:block}

/* ── atajos ── */
.atajos{max-width:var(--anc);margin:-46px auto 0;padding:0 20px;position:relative;z-index:5;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.atajos a{display:flex;align-items:center;gap:14px;padding:18px 20px;border-radius:var(--r);text-decoration:none;background:linear-gradient(180deg,#fff,var(--fondo2));box-shadow:var(--luz);transition:transform .2s}
.atajos a:hover{transform:translateY(-3px)}
.atajos .ico{width:42px;height:42px;padding:10px;border-radius:12px;color:var(--verde2);background:rgba(108,191,60,.14)}
.atajos b{display:block;font-size:16px}
.atajos small{color:var(--gris);font-size:13.5px}

/* ── bloques ── */
.bloque{max-width:var(--anc);margin:0 auto;padding:84px 20px 20px}
.bloque-cab{max-width:720px;margin-bottom:30px}
.bloque-cab h2{font-size:clamp(30px,4vw,48px);font-weight:900;margin:10px 0 10px}
.bloque-cab p{color:var(--gris);font-size:17px}
.bloque-oscuro{max-width:none;margin-top:84px;padding:84px max(20px,calc((100vw - var(--anc))/2 + 20px));background:radial-gradient(800px 400px at 80% 0%,#3a4049,#23262c 70%);color:#fff}
.bloque-oscuro .bloque-cab p{color:#c4c9d1}
.bloque-oscuro .eti{color:var(--verde-luz)}

/* ── carruseles ── */
.carrusel{position:relative}
.pista{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:6px 2px 18px;scrollbar-width:none}
.pista::-webkit-scrollbar{display:none}
.foto{flex:0 0 clamp(250px,30%,380px);aspect-ratio:4/3;scroll-snap-align:start;border-radius:var(--r);overflow:hidden;box-shadow:var(--luz);background:var(--acero);cursor:zoom-in}
.foto img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.foto:hover img{transform:scale(1.05)}
.vid{flex:0 0 clamp(220px,24%,300px);aspect-ratio:9/16;scroll-snap-align:start;border-radius:var(--r);overflow:hidden;background:#000;box-shadow:0 20px 40px -18px rgba(0,0,0,.6)}
.vid video{width:100%;height:100%;object-fit:cover}
.car-btn{position:absolute;top:calc(50% - 30px);width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,#fff,#e8ebef);color:var(--tinta);box-shadow:0 10px 24px -10px rgba(0,0,0,.45);z-index:2}
.car-btn .ico{width:20px;height:20px}
.car-btn.prev{left:-14px}.car-btn.prev .ico{transform:rotate(180deg)}
.car-btn.next{right:-14px}

/* ── ubicación ── */
.ubica{display:grid;grid-template-columns:1.35fr 1fr;gap:20px}
.mapa{border-radius:var(--r);overflow:hidden;min-height:420px;box-shadow:var(--luz);background:var(--acero)}
.mapa iframe{width:100%;height:100%;min-height:420px;border:0;filter:saturate(.85)}
.contacto{display:flex;flex-direction:column;gap:12px;padding:24px;border-radius:var(--r);background:linear-gradient(180deg,#fff,var(--fondo2));box-shadow:var(--luz)}
.dato{display:flex;gap:14px;padding:12px 4px;border-bottom:1px solid #e3e6ea}
.dato:last-of-type{border-bottom:0}
.dato>.ico{width:40px;height:40px;padding:10px;border-radius:12px;color:var(--verde2);background:rgba(108,191,60,.14)}
.dato small{display:block;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gris2)}
.dato b{display:block;font-size:17px;margin-top:2px}
.dato b a{text-decoration:none}
.dato b span{font-weight:500;color:var(--gris)}
.dato>div>a{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-weight:700;font-size:14px;color:var(--verde2);text-decoration:none}
.contacto .btn{margin-top:auto}

/* ── páginas internas ── */
.cab-pagina{position:relative;padding:150px 20px 70px;background:linear-gradient(90deg,rgba(28,31,37,.92),rgba(28,31,37,.55)),var(--img,linear-gradient(135deg,#3a4049,#23262c)) center/cover;color:#fff}
.cab-pagina.corta{padding:130px 20px 54px;background:radial-gradient(900px 400px at 85% 0%,#4a515c,#2b2f36 70%)}
.cab-in{max-width:var(--anc);margin:0 auto}
.cab-pagina .eti{color:var(--verde-luz)}
.cab-pagina h1{font-size:clamp(36px,5.4vw,66px);font-weight:900;margin-top:12px}
.cab-pagina h1 em{color:var(--verde-luz)}
.cab-pagina p{margin-top:14px;color:#d3d8de;font-size:17px;max-width:560px}
.nosotros{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:start}
.nosotros .grande{font-size:21px;line-height:1.55;color:var(--tinta)}
.nosotros .texto p+p{margin-top:16px;color:var(--gris);font-size:17px}
.valores{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.valores div{padding:20px;border-radius:var(--r);background:linear-gradient(180deg,#fff,var(--fondo2));box-shadow:var(--luz);border-top:3px solid var(--verde)}
.valores b{display:block;font-family:Archivo;font-size:18px}
.valores span{font-size:14.5px;color:var(--gris)}
.mosaico{max-width:var(--anc);margin:60px auto 0;padding:0 20px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mosaico img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px;cursor:zoom-in;box-shadow:var(--luz)}

/* ── catálogo ── */
.filtros{position:sticky;top:68px;z-index:10;padding:14px 0;background:linear-gradient(180deg,var(--fondo) 80%,rgba(236,238,241,0))}
.buscador{display:flex;align-items:center;gap:12px;padding:0 20px;height:56px;border-radius:999px;background:#fff;box-shadow:var(--luz)}
.buscador .ico{width:20px;height:20px;color:var(--gris2)}
.buscador input{flex:1;border:0;outline:0;font:inherit;font-size:16px;background:none;min-width:0}
.chips{display:flex;gap:8px;overflow-x:auto;padding:14px 2px 4px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;padding:8px 14px;border-radius:999px;background:#fff;border:1px solid var(--acero);font-weight:600;font-size:14px;white-space:nowrap}
.chip span{color:var(--gris2);font-weight:500;margin-left:2px}
.chip.activo{background:var(--grafito);border-color:var(--grafito);color:#fff}
.chip.activo span{color:#b5bcc6}
.conteo{color:var(--gris);font-size:14px;margin:10px 2px}
.rejilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}
.prod{display:flex;flex-direction:column;border-radius:var(--r);background:linear-gradient(180deg,#fff,var(--fondo2));box-shadow:var(--luz);overflow:hidden}
.prod .im{aspect-ratio:1;background:radial-gradient(circle at 50% 40%,#fff,#e8ebee);display:grid;place-items:center}
.prod .im img{width:82%;height:82%;object-fit:contain}
.prod .im span{font-family:Archivo;font-weight:900;font-size:40px;color:var(--acero2)}
.prod .tx{padding:14px 16px 16px;display:flex;flex-direction:column;gap:4px;flex:1}
.prod small{font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--verde2)}
.prod h3{font-family:Inter;font-size:15.5px;font-weight:600;letter-spacing:0;line-height:1.3}
.prod .pr{font-family:Archivo;font-weight:800;font-size:21px;margin-top:auto;padding-top:8px}
.prod .pr i{font-family:Inter;font-style:normal;font-weight:500;font-size:12.5px;color:var(--gris2)}
.prod .agregar{margin-top:8px;padding:10px;border-radius:12px;font-weight:700;font-size:14px;background:rgba(108,191,60,.15);color:var(--verde2)}
.prod .agregar.en{background:var(--verde);color:#0f2a05}
.mas{display:flex;margin:26px auto 0}
.vacio{text-align:center;padding:60px 20px;border-radius:24px;background:linear-gradient(180deg,#fff,var(--fondo2));box-shadow:var(--luz);max-width:720px;margin:0 auto}
.vacio>.ico{width:56px;height:56px;padding:14px;border-radius:16px;color:var(--verde2);background:rgba(108,191,60,.14)}
.vacio h2{font-size:30px;margin:18px 0 10px}
.vacio p{color:var(--gris);max-width:480px;margin:0 auto}
.vacio-acc{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:26px}
.cotiza{position:fixed;left:20px;bottom:20px;z-index:60;width:min(360px,calc(100vw - 110px));border-radius:20px;background:#fff;box-shadow:0 24px 60px -20px rgba(0,0,0,.45);overflow:hidden}
.cotiza-cab{display:flex;align-items:center;gap:10px;width:100%;padding:14px 18px;background:var(--grafito);color:#fff;text-align:left}
.cotiza-cab span{display:grid;place-items:center;min-width:26px;height:26px;border-radius:13px;background:var(--verde);color:#0f2a05;font-weight:800;font-size:13px}
.cotiza-cab em{margin-left:auto;font-weight:700}
.cotiza-cuerpo{max-height:0;overflow:auto;transition:max-height .3s}
.cotiza.abierta .cotiza-cuerpo{max-height:45vh}
.cotiza-cuerpo div{display:flex;align-items:center;gap:10px;padding:10px 18px;border-bottom:1px solid #eef0f2;font-size:14px}
.cotiza-cuerpo div span{flex:1}
.cotiza-cuerpo input{width:52px;padding:6px;border:1px solid var(--acero);border-radius:8px;font:inherit;text-align:center}
.cotiza-cuerpo button{color:var(--gris2)}
.cotiza .btn{display:flex;margin:12px;border-radius:14px;white-space:normal;text-align:center;font-size:14.5px}

/* ── pie ── */
.pie{background:#0b0c0e;color:#d9dde3;margin-top:100px}
.pie-in{max-width:var(--anc);margin:0 auto;padding:64px 20px 26px}
.pie-marca{display:flex;align-items:center;gap:16px}
.pie-marca b{font-family:Archivo;font-weight:900;font-size:26px;color:#fff}
.pie-marca p{color:#9aa1ab}
.redes{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:40px 0}
.red{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:18px;text-decoration:none;color:#fff;font-weight:700;font-size:17px;
  background:#16181c;border:1px solid #23262b;transition:transform .2s,box-shadow .2s}
.red .ico{width:52px;height:52px;padding:12px;border-radius:14px;color:#fff}
.red:hover{transform:translateY(-3px)}
.red-facebook .ico{background:#1877f2}.red-facebook:hover{box-shadow:0 14px 34px -12px #1877f2}
.red-instagram .ico{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}.red-instagram:hover{box-shadow:0 14px 34px -12px #d6249f}
.red-tiktok .ico{background:#000;box-shadow:-2px -2px 0 #25f4ee inset,2px 2px 0 #fe2c55 inset;filter:drop-shadow(1.5px 1.5px 0 #fe2c55) drop-shadow(-1.5px -1.5px 0 #25f4ee)}.red-tiktok:hover{box-shadow:0 14px 34px -12px #fe2c55}
.red-linkedin .ico{background:#0a66c2}.red-linkedin:hover{box-shadow:0 14px 34px -12px #0a66c2}
.red[aria-disabled=true]{cursor:default}
.pie-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:30px 0;border-top:1px solid #1f2226}
.pie-cols h3{font-family:Inter;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--verde-luz);margin-bottom:10px}
.pie-cols p{color:#b7bdc6;margin:3px 0}
.pie-cols a{text-decoration:none}
.pie-cols a:hover{color:#fff;text-decoration:underline}
.pie-fin{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;padding-top:22px;border-top:1px solid #1f2226;font-size:13px;color:#7b828c}
.pie-fin a{color:#7b828c;text-decoration:none}

/* ── chat ── */
.chat-boton{position:fixed;right:20px;bottom:20px;z-index:90;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;color:#0f2a05;
  background:linear-gradient(145deg,var(--verde-luz),var(--verde) 55%,var(--verde2));box-shadow:0 16px 36px -10px rgba(76,154,39,.85),0 1px 0 rgba(255,255,255,.7) inset;animation:latido 3s ease-in-out infinite}
.chat-boton .ico{width:28px;height:28px}
@keyframes latido{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.chat-burbuja{position:absolute;right:76px;bottom:12px;white-space:nowrap;padding:10px 14px;border-radius:14px 14px 4px 14px;background:#fff;color:var(--tinta);font-weight:600;font-size:14px;box-shadow:0 12px 30px -12px rgba(0,0,0,.35);
  opacity:0;transform:translateX(10px);transition:.4s;pointer-events:none}
.chat-boton.saluda .chat-burbuja{opacity:1;transform:none}
.chat-boton[aria-expanded=true]{animation:none;transform:scale(.9)}
.chat-boton[aria-expanded=true] .chat-burbuja{display:none}
.chat{position:fixed;right:20px;bottom:96px;z-index:95;width:min(380px,calc(100vw - 24px));height:min(600px,calc(100vh - 120px));height:min(600px,calc(100svh - 120px));display:flex;flex-direction:column;border-radius:24px;overflow:hidden;
  background:var(--fondo2);box-shadow:0 30px 80px -20px rgba(0,0,0,.5),0 0 0 1px rgba(0,0,0,.05);animation:sube .3s ease}
.chat[hidden]{display:none}
@keyframes sube{from{opacity:0;transform:translateY(14px)}}
.chat-cab{display:flex;align-items:center;gap:12px;padding:16px 18px;background:radial-gradient(400px 120px at 90% 0%,#4a515c,#2b2f36);color:#fff}
.chat-avatar{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;font-family:Archivo;font-weight:900;color:#10300a;background:linear-gradient(145deg,var(--verde-luz),var(--verde2))}
.chat-cab b{display:block}
.chat-cab small{display:flex;align-items:center;gap:6px;color:#c9ced6;font-size:12.5px}
.punto{width:8px;height:8px;border-radius:50%;background:var(--verde-luz);box-shadow:0 0 8px var(--verde-luz)}
.chat-cerrar{margin-left:auto;width:36px;height:36px;border-radius:10px;display:grid;place-items:center}
.chat-cerrar:hover{background:rgba(255,255,255,.12)}
.chat-msgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.m{max-width:86%;padding:10px 14px;border-radius:16px;font-size:14.5px;line-height:1.45;white-space:pre-line;word-wrap:break-word}
.m a{color:var(--verde2);font-weight:600}
.m.bot{align-self:flex-start;background:#fff;box-shadow:0 4px 14px -8px rgba(0,0,0,.25);border-bottom-left-radius:4px}
.m.yo{align-self:flex-end;background:var(--grafito);color:#fff;border-bottom-right-radius:4px}
.m.escribe{display:flex;gap:4px;padding:14px}
.m.escribe i{width:7px;height:7px;border-radius:50%;background:var(--gris2);animation:salta 1s infinite}
.m.escribe i:nth-child(2){animation-delay:.15s}.m.escribe i:nth-child(3){animation-delay:.3s}
@keyframes salta{50%{transform:translateY(-5px);opacity:.5}}
.chat-sug{display:flex;gap:6px;overflow-x:auto;padding:0 14px 10px;scrollbar-width:none}
.chat-sug button{flex:none;padding:7px 12px;border-radius:999px;background:#fff;border:1px solid var(--acero);font-size:13px;font-weight:600}
.chat-form{display:flex;gap:8px;padding:10px 12px;background:#fff;border-top:1px solid #e6e9ed}
.chat-form input{flex:1;min-width:0;border:0;outline:0;font:inherit;font-size:16px;padding:8px 6px}
.chat-form button{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--verde);color:#0f2a05}
.chat-wa{display:flex;align-items:center;justify-content:center;gap:8px;padding:9px;font-size:13px;font-weight:600;color:var(--verde2);background:#fff;text-decoration:none;border-top:1px solid #eef0f2}

/* ── visor de fotos ── */
.visor{position:fixed;inset:0;z-index:120;background:rgba(10,11,13,.92);display:grid;place-items:center;padding:20px}
.visor[hidden]{display:none}
.visor img{max-height:90vh;border-radius:12px}
.visor-cerrar{position:absolute;top:16px;right:16px;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff;background:rgba(255,255,255,.12)}
.visor-cerrar .ico{width:22px;height:22px}

/* ── tableta ── */
@media (max-width:980px){
  .ubica,.nosotros{grid-template-columns:1fr}
  .redes{grid-template-columns:repeat(2,1fr)}
  .atajos{grid-template-columns:1fr;margin-top:-30px}
  .atajos a{padding:14px 16px}
}
/* ── celular ── */
@media (max-width:760px){
  .hamburguesa{display:grid}
  .menu{position:fixed;inset:68px 12px auto 12px;flex-direction:column;align-items:stretch;gap:4px;padding:12px;border-radius:20px;background:rgba(250,251,252,.97);color:var(--tinta);
    box-shadow:0 24px 60px -20px rgba(0,0,0,.45);transform:translateY(-12px);opacity:0;pointer-events:none;transition:.25s}
  .menu.abierto{transform:none;opacity:1;pointer-events:auto}
  .menu a{padding:14px 16px;font-size:17px}
  .menu .btn-wa{margin:6px 0 0;justify-content:center}
  .barra.sobre-hero:not(.solida) .menu a[aria-current]{color:var(--verde2);background:rgba(108,191,60,.18)}
  .marca-txt b{font-size:19px}
  .hero-video{object-fit:cover}
  .hero-fondo{display:none}
  .hero-velo{background:linear-gradient(0deg,rgba(12,14,18,.9) 0%,rgba(12,14,18,.35) 50%,rgba(12,14,18,.15) 100%)}
  .hero-texto{left:20px;right:20px;bottom:90px}
  .hero-acciones .btn{flex:1}
  .hero-sonido{bottom:auto;top:84px;right:16px;width:42px;height:42px}
  .bloque{padding-top:60px}
  .car-btn{display:none}
  .foto{flex-basis:78%}
  .vid{flex-basis:62%}
  .mapa,.mapa iframe{min-height:320px}
  .valores{grid-template-columns:1fr}
  .mosaico{grid-template-columns:repeat(2,1fr)}
  .redes{grid-template-columns:1fr 1fr;gap:10px}
  .red{flex-direction:column;text-align:center;font-size:15px;padding:16px 10px}
  .pie-cols{grid-template-columns:1fr}
  .filtros{top:64px}
  .rejilla{grid-template-columns:repeat(2,1fr);gap:10px}
  .prod h3{font-size:14px}.prod .pr{font-size:18px}
  .chat{right:12px;left:12px;width:auto;bottom:90px;height:calc(100svh - 110px)}
  .chat-boton{right:14px;bottom:14px}
  .cotiza{left:12px;bottom:14px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ── cinta de videos de asesores (se desliza sola de izquierda a derecha) ── */
.cinta-videos{overflow:hidden;margin:0 calc(-1 * max(20px, (100vw - var(--anc))/2 + 20px));padding:6px 0 18px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.cinta-pista{display:flex;gap:18px;width:max-content;animation:cinta var(--dur,60s) linear infinite}
.cinta-videos:hover .cinta-pista,.cinta-videos.quieta .cinta-pista{animation-play-state:paused}
@keyframes cinta{from{transform:translateX(calc(-50% - 9px))}to{transform:translateX(0)}}
.cinta-videos .vid{flex:0 0 clamp(210px,22vw,300px);position:relative;cursor:pointer}
.vid-sonido{position:absolute;right:12px;bottom:12px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#fff;
  background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.vid-sonido .ico{width:20px;height:20px}
.vid-sonido .on,.vid.sonando .vid-sonido .off{display:none}
.vid.sonando .vid-sonido .on{display:block}
.vid.sonando{box-shadow:0 0 0 3px var(--verde),0 20px 40px -18px rgba(0,0,0,.6)}
@media (max-width:760px){.cinta-videos .vid{flex-basis:58vw}}
@media (prefers-reduced-motion:reduce){.cinta-pista{animation:none}.cinta-videos{overflow-x:auto}}

/* ── galería de fotos grande (la del centro se agranda y se ilumina) ── */
.galeria{position:relative;margin:0 calc(-1 * max(20px, (100vw - var(--anc))/2 + 20px))}
.gal-pista{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;
  padding:30px calc((100vw - min(70vw, 980px)) / 2) 40px}
.gal-pista::-webkit-scrollbar{display:none}
.gal-foto{flex:0 0 min(70vw,980px);aspect-ratio:16/10;scroll-snap-align:center;border-radius:26px;overflow:hidden;position:relative;cursor:zoom-in;
  transform:scale(.86);opacity:.45;filter:saturate(.6) brightness(.85);transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .7s,filter .7s,box-shadow .7s;
  box-shadow:0 20px 40px -24px rgba(20,24,30,.5);background:var(--acero)}
.gal-foto img{width:100%;height:100%;object-fit:cover;transform:scale(1.02)}
.gal-foto.activa{transform:scale(1);opacity:1;filter:none;box-shadow:0 40px 80px -30px rgba(20,24,30,.55),0 0 0 1px rgba(255,255,255,.8),0 0 60px -10px rgba(155,224,106,.55)}
.gal-foto.activa img{animation:acerca 7s ease-out forwards}
@keyframes acerca{from{transform:scale(1.02)}to{transform:scale(1.12)}}
.gal-foto:after{content:'';position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.35) 0%,rgba(255,255,255,0) 35%);opacity:0;transition:opacity .5s;pointer-events:none}
.gal-foto.activa:hover:after{opacity:1}
.gal-btn{position:absolute;top:calc(50% - 32px);width:58px;height:58px;border-radius:50%;display:grid;place-items:center;z-index:3;color:var(--tinta);
  background:linear-gradient(180deg,#fff,#e8ebef);box-shadow:0 14px 30px -12px rgba(0,0,0,.5);transition:transform .2s,box-shadow .2s}
.gal-btn .ico{width:22px;height:22px}
.gal-btn.prev{left:calc((100vw - min(70vw,980px))/2 - 29px)}.gal-btn.prev .ico{transform:rotate(180deg)}
.gal-btn.next{right:calc((100vw - min(70vw,980px))/2 - 29px)}
.gal-pie{display:flex;align-items:center;gap:16px;width:min(70vw,980px);margin:0 auto}
.gal-num{font-family:Archivo;font-weight:800;font-size:15px;letter-spacing:.08em;color:var(--gris)}
.gal-barra{flex:1;height:4px;border-radius:4px;background:var(--acero);overflow:hidden}
.gal-barra i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--verde),var(--verde-luz))}
@media (max-width:760px){
  .gal-pista{padding:20px 7vw 30px;gap:12px}
  .gal-foto{flex-basis:86vw;aspect-ratio:4/3;border-radius:20px}
  .gal-btn{display:none}
  .gal-pie{width:86vw}
}

/* ── todo se enciende al pasar el cursor ── */
@media (hover:hover){
  .bloque-cab h2,.cab-pagina h1,.vacio h2{transition:text-shadow .4s,color .4s}
  .bloque-cab:hover h2{text-shadow:0 0 28px rgba(155,224,106,.55),0 0 2px rgba(108,191,60,.4)}
  .bloque-oscuro .bloque-cab:hover h2,.cab-pagina:hover h1,.hero-texto:hover h1{text-shadow:0 0 30px rgba(155,224,106,.7),0 0 60px rgba(155,224,106,.35)}
  .eti{transition:text-shadow .3s,letter-spacing .3s}
  .bloque-cab:hover .eti,.cab-pagina:hover .eti,.hero-texto:hover .eti{text-shadow:0 0 14px rgba(155,224,106,.9);letter-spacing:.18em}
  .btn,.menu a,.chip,.car-btn,.gal-btn,.hero-sonido,.vid-sonido,.chat-sug button{transition:transform .2s,box-shadow .25s,background .25s,color .25s,filter .25s}
  .btn:hover{transform:translateY(-3px)}
  .btn-verde:hover,.menu .btn-wa:hover{box-shadow:0 0 0 3px rgba(155,224,106,.35),0 0 34px rgba(155,224,106,.85),0 14px 30px -10px rgba(76,154,39,.8);filter:brightness(1.08)}
  .btn-luz:hover{box-shadow:0 0 0 3px rgba(255,255,255,.35),0 0 40px rgba(255,255,255,.75)}
  .btn-vidrio:hover{background:rgba(255,255,255,.26);box-shadow:0 0 30px rgba(255,255,255,.35)}
  .btn-borde:hover{border-color:var(--verde);box-shadow:0 0 0 3px rgba(108,191,60,.2),0 0 26px rgba(155,224,106,.5)}
  .menu a:hover{box-shadow:0 0 18px rgba(155,224,106,.45);color:var(--verde2)}
  .barra.sobre-hero:not(.solida) .menu a:hover{color:#fff;text-shadow:0 0 12px rgba(155,224,106,.9)}
  .gal-btn:hover,.car-btn:hover{transform:scale(1.1);box-shadow:0 0 0 4px rgba(155,224,106,.35),0 0 30px rgba(155,224,106,.7)}
  .chip:hover{border-color:var(--verde);box-shadow:0 0 18px rgba(155,224,106,.5)}
  .atajos a,.contacto,.valores div,.prod,.dato,.red,.mosaico img,.cotiza,.vacio{transition:transform .3s,box-shadow .35s,border-color .35s,background .35s}
  .atajos a:hover,.valores div:hover,.prod:hover{transform:translateY(-5px);box-shadow:0 0 0 1.5px rgba(108,191,60,.55),0 0 40px -6px rgba(155,224,106,.75),0 24px 40px -20px rgba(30,36,46,.4)}
  .atajos a:hover .ico,.dato:hover>.ico{background:var(--verde);color:#0f2a05;box-shadow:0 0 22px rgba(155,224,106,.9)}
  .atajos .ico,.dato>.ico{transition:background .3s,color .3s,box-shadow .3s}
  .contacto:hover{box-shadow:0 0 0 1.5px rgba(108,191,60,.45),0 0 50px -10px rgba(155,224,106,.6),var(--luz)}
  .dato:hover b{color:var(--verde2)}
  .mosaico img:hover{transform:scale(1.03);box-shadow:0 0 0 2px rgba(155,224,106,.7),0 0 40px rgba(155,224,106,.5)}
  .red:hover{border-color:currentColor;background:#1b1e23}
  .red:hover .ico{transform:scale(1.08)}
  .red .ico{transition:transform .3s}
  .red-facebook:hover{box-shadow:0 0 0 1px #1877f2,0 0 36px -4px #1877f2}
  .red-instagram:hover{box-shadow:0 0 0 1px #d6249f,0 0 36px -4px #d6249f}
  .red-tiktok:hover{box-shadow:0 0 0 1px #25f4ee,0 0 36px -4px #fe2c55}
  .red-linkedin:hover{box-shadow:0 0 0 1px #0a66c2,0 0 36px -4px #0a66c2}
  .cinta-videos .vid{transition:transform .35s,box-shadow .35s}
  .cinta-videos .vid:hover{transform:translateY(-6px) scale(1.03);box-shadow:0 0 0 2px rgba(155,224,106,.8),0 0 44px rgba(155,224,106,.6)}
  .pie-cols a:hover{color:var(--verde-luz);text-shadow:0 0 12px rgba(155,224,106,.8)}
  .chat-boton:hover{box-shadow:0 0 0 6px rgba(155,224,106,.25),0 0 40px rgba(155,224,106,.9)}
  .marca:hover .marca-sello{box-shadow:0 0 26px rgba(155,224,106,.95),0 1px 0 rgba(255,255,255,.7) inset}
  .marca-sello{transition:box-shadow .3s}
}