/* Estilos compartidos por index.html, bodega.html, inventario.html y software-inventario.html.
   Antes vivían repetidos dentro de cada página; ahora hay un solo lugar donde tocarlos.
   Lo propio de cada página va en su <style>, no acá.

   Identidad (27/09/2026, pedido de Joel): negro, amarillo industrial y gris claro, como la
   señalética de una planta. Títulos en Barlow Condensed, en mayúsculas; botones rectangulares
   amarillos con texto negro; fotos de terreno a todo el ancho con el texto sobre un panel oscuro.
   Los textos no cambiaron: solo la forma. */

:root{
    --bg:#f2f3f5; --surface:#ffffff; --surface-2:#e8eaee; --line:#d7dae0;
    --ink:#0b0b0b; --ink-2:#161616; --ink-line:#2a2a2a;
    --amber:#f5a800; --amber-dim:#c98a00; --on-amber:#111111;
    --text:#111111; --text-dim:#4a4f57; --text-faint:#6b7079;
    --on-ink:#ffffff; --on-ink-dim:#c9ccd1; --on-ink-faint:#8d9198;
    --good:#2f7d46; --good-bg:rgba(47,125,70,.12);
    --radius:0px;
  }
*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:'Inter',sans-serif;-webkit-font-smoothing:antialiased;}
h1,h2,h3,.display{font-family:'Barlow Condensed',sans-serif;font-weight:800;letter-spacing:0;text-transform:uppercase;line-height:1.02;margin:0;}
.mono{font-family:'IBM Plex Mono',monospace;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px;}
img{max-width:100%;}
::selection{background:var(--amber);color:var(--on-amber);}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;}
/* ---- reveal on scroll ---- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease;}
.reveal.in{opacity:1;transform:translateY(0);}
@media (prefers-reduced-motion:reduce){ .reveal{opacity:1;transform:none;transition:none;} }
/* ---- nav: barra negra, logo a la izquierda, botón amarillo a la derecha ---- */
.nav{position:sticky;top:0;z-index:40;background:var(--ink);color:var(--on-ink);border-bottom:1px solid var(--ink-line);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0;}
.brand{display:flex;align-items:center;gap:10px;}
.brand-badge{width:32px;height:32px;border-radius:var(--radius);background:var(--amber);display:flex;align-items:center;justify-content:center;font-family:'Barlow Condensed';font-weight:800;font-size:13px;letter-spacing:-0.03em;color:var(--on-amber);flex-shrink:0;}
.brand-name{font-family:'Barlow Condensed',sans-serif;font-size:24px;font-weight:800;letter-spacing:0;text-transform:uppercase;line-height:1;}
.ia{color:var(--amber);}
.nav-links{display:flex;align-items:center;gap:28px;font-size:13.5px;font-weight:600;letter-spacing:.02em;color:var(--on-ink-dim);}
.nav-links a:hover{color:var(--on-ink);}
.nav-links a[aria-current="page"]{color:var(--amber);}
.nav-cta{padding:11px 20px;border-radius:var(--radius);background:var(--amber);color:var(--on-amber);font-family:'Barlow Condensed',sans-serif;font-size:16px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;}
.nav-cta:hover{background:#ffb81c;}
.nav-toggle{display:none;width:40px;height:40px;border-radius:var(--radius);align-items:center;justify-content:center;background:none;border:none;flex-shrink:0;cursor:pointer;}
.nav-toggle:hover{background:var(--ink-2);}
.nav-toggle svg{width:20px;height:20px;stroke:var(--on-ink);}
.nav-toggle .icon-close{display:none;}
.nav-toggle.open .icon-menu{display:none;}
.nav-toggle.open .icon-close{display:block;}
@media (max-width:680px){ .nav-toggle{display:flex;order:3;margin-left:10px;} .nav-cta{order:2;padding:9px 14px;font-size:15px;} .nav-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:2px;background:var(--ink);border-bottom:1px solid var(--ink-line);padding:8px 24px 16px;} .nav-links.open{display:flex;} .nav-links a{padding:12px 4px;} .nav-links a:hover{color:var(--amber);} }
/* ---- hero: foto de terreno a todo el ancho, panel oscuro a la izquierda ---- */
.hero{position:relative;text-align:left;color:var(--on-ink);background:var(--ink) url(../img/terreno-tablet-conteo.jpg) center 35%/cover no-repeat;}
.hero.wrap{max-width:none;padding:104px max(24px,calc((100% - 1080px) / 2)) 88px;}
.hero::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,6,6,.9) 0%,rgba(6,6,6,.82) 42%,rgba(6,6,6,.38) 100%);}
.hero > *{position:relative;z-index:1;}
@media (max-width:680px){ .hero.wrap{padding:56px 24px 48px;} .hero::before{background:linear-gradient(180deg,rgba(6,6,6,.9),rgba(6,6,6,.78));} }
.kicker{display:inline-flex;align-items:flex-start;gap:10px;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--amber);margin-bottom:26px;max-width:640px;line-height:1.5;}
.kicker::before{content:'';flex-shrink:0;width:10px;height:10px;background:var(--amber);margin-top:4px;}
.hero h1{font-size:clamp(2.6rem,6.2vw,4.9rem);line-height:.98;margin:0 0 22px;max-width:760px;color:var(--on-ink);}
.hero h1 span{color:var(--amber);}
.hero-sub{font-size:clamp(1.05rem,2vw,1.3rem);line-height:1.55;color:var(--on-ink-dim);max-width:600px;margin:0 0 36px;}
.cta{display:inline-block;padding:16px 34px;border-radius:var(--radius);border:none;background:var(--amber);color:var(--on-amber);font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:19px;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;transition:background .15s ease,transform .15s ease;}
.cta:hover{background:#ffb81c;transform:translateY(-1px);}
.cta .ia{color:inherit;}
.cta-ghost{display:inline-block;padding:16px 8px;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:18px;letter-spacing:.04em;text-transform:uppercase;color:var(--on-ink);margin-left:12px;}
.cta-ghost span{color:var(--amber);}
.cta-sub{margin-top:18px;font-size:13px;color:var(--on-ink-faint);max-width:560px;line-height:1.5;}
/* ---- sections: gris claro por defecto; las bandas negras y amarillas las pone cada página ---- */
section{padding:104px 0;}
@media (max-width:680px){ section{padding:64px 0;} }
.section-head{text-align:center;margin:0 auto 56px;max-width:720px;}
.section-title{font-size:clamp(2rem,4.4vw,3.2rem);margin-bottom:14px;}
.section-title::after{content:'';display:block;width:56px;height:5px;background:var(--amber);margin:18px auto 0;}
.section-sub{color:var(--text-dim);font-size:17px;line-height:1.55;}
.banda-negra{background:var(--ink);color:var(--on-ink);}
.banda-negra .section-title{color:var(--on-ink);}
.banda-negra .section-sub{color:var(--on-ink-dim);}
.banda-amarilla{background:var(--amber);color:var(--on-amber);}
.banda-amarilla .section-title::after{background:var(--ink);}
.banda-amarilla .section-sub{color:#2b2400;}
/* ---- vista (segunda imagen: screenshot del dashboard) ---- */
.vista-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
@media (max-width:820px){ .vista-grid{grid-template-columns:1fr;gap:40px;text-align:center;} .vista-text .section-title{text-align:center;} .vista-points li{text-align:left;} }
@media (min-width:821px){ .vista-text{text-align:left;} .vista-text .section-title::after{margin-left:0;} }
.vista-text .section-title{text-align:left;margin-bottom:14px;}
.vista-text > p{font-size:16px;line-height:1.6;color:var(--text-dim);margin:0 0 26px;}
.vista-points{list-style:none;margin:0;padding:0;display:grid;gap:15px;max-width:420px;}
@media (max-width:820px){ .vista-points{margin:0 auto;} }
.vista-points li{font-size:14.5px;line-height:1.55;color:var(--text-dim);padding-left:22px;position:relative;}
.vista-points li::before{content:'';position:absolute;left:0;top:8px;width:8px;height:8px;background:var(--amber);}
.vista-points li b{color:var(--text);font-weight:700;}
.phone-frame{position:relative;width:min(272px,78vw);margin:0 auto;border-radius:36px;background:#0e0e0f;padding:9px;box-shadow:0 40px 80px -28px rgba(0,0,0,.55);}
.phone-frame::before{content:'';position:absolute;top:9px;left:50%;transform:translateX(-50%);width:66px;height:15px;background:#0e0e0f;border-radius:0 0 11px 11px;z-index:2;}
.phone-frame img{display:block;width:100%;height:auto;border-radius:28px;}
.phone-frame.ancho{width:min(312px,80vw);}
.phone-frame-fade{position:absolute;left:9px;right:9px;bottom:9px;height:84px;background:linear-gradient(180deg,rgba(14,14,15,0),#0e0e0f);border-radius:0 0 28px 28px;pointer-events:none;}
/* ---- cierre: banda negra a todo el ancho, título amarillo ---- */
.closing{margin:0;border-radius:0;background:var(--ink) url(../img/dashboard-sala-control.jpg) center/cover no-repeat;position:relative;text-align:center;padding:96px 24px;color:var(--on-ink);}
.closing::before{content:'';position:absolute;inset:0;background:rgba(6,6,6,.86);}
.closing > *{position:relative;z-index:1;}
.closing h2{font-size:clamp(2rem,4.4vw,3.2rem);color:var(--amber);margin:0 auto 16px;max-width:820px;}
.closing p{color:var(--on-ink-dim);font-size:16px;margin:0 auto 32px;max-width:560px;}
/* Cierre con dos salidas: la demo (ahora) y el piloto con datos propios (se coordina). */
.closing-acciones{display:flex;align-items:center;justify-content:center;gap:6px 14px;flex-wrap:wrap;}
.closing-acciones .cta-ghost{margin-left:0;white-space:nowrap;}
@media (max-width:480px){ .closing-acciones .cta-ghost{font-size:16px;padding:12px 4px;} }
.closing .cta-sub-link{display:block;margin-top:18px;font-size:13px;color:var(--on-ink-faint);}
.closing .cta-sub-link a{text-decoration:underline;text-underline-offset:3px;}
/* ---- faq ---- */
.faq-list{max-width:760px;margin:0 auto;display:grid;gap:10px;}
.faq-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:6px 24px;}
.faq-item summary{cursor:pointer;list-style:none;padding:18px 0;font-weight:700;font-size:15.5px;display:flex;justify-content:space-between;align-items:center;gap:16px;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:'+';flex-shrink:0;font-family:'Barlow Condensed';font-size:24px;font-weight:700;color:var(--amber);transition:transform .2s ease;}
.faq-item[open] summary::after{transform:rotate(45deg);}
.faq-item p{margin:0 0 20px;font-size:14.5px;line-height:1.65;color:var(--text-dim);}
.faq-item p a{text-decoration:underline;text-underline-offset:2px;}
/* ---- botón flotante de WhatsApp ---- */
.whatsapp-float{position:fixed;right:20px;bottom:20px;width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px -8px rgba(0,0,0,.5);z-index:90;transition:transform .15s ease;}
.whatsapp-float:hover{transform:scale(1.08);}
.whatsapp-float svg{width:30px;height:30px;}
@media (max-width:640px){ .whatsapp-float{right:16px;bottom:16px;width:52px;height:52px;} .whatsapp-float svg{width:27px;height:27px;} }
/* ---- modal demo ---- */
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(3px);z-index:100;display:none;align-items:center;justify-content:center;padding:20px;}
.modal-backdrop.open{display:flex;}
.modal-card{background:var(--surface);border-top:6px solid var(--amber);max-width:440px;width:100%;max-height:88vh;overflow-y:auto;padding:32px;position:relative;box-shadow:0 40px 80px -30px rgba(0,0,0,.6);}
.modal-close{position:absolute;top:18px;right:18px;width:30px;height:30px;border-radius:var(--radius);background:var(--surface-2);border:none;color:var(--text-dim);font-size:16px;line-height:1;cursor:pointer;}
.modal-card h3{font-size:26px;margin-bottom:8px;}
.modal-card .modal-sub{font-size:14px;color:var(--text-dim);line-height:1.55;margin-bottom:22px;}
.modal-card label{display:block;font-size:12.5px;font-weight:600;color:var(--text-dim);margin:14px 0 6px;}
.modal-card label:first-of-type{margin-top:0;}
.modal-card input{width:100%;padding:11px 13px;border-radius:var(--radius);border:1.5px solid var(--line);background:var(--bg);color:var(--text);font-family:'Inter';font-size:14.5px;}
.modal-card input:focus{outline:none;border-color:var(--amber);}
.modal-submit{width:100%;margin-top:22px;padding:14px;border-radius:var(--radius);border:none;background:var(--amber);color:var(--on-amber);font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:18px;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;}
.modal-submit:disabled{opacity:.6;cursor:default;}
.modal-error{margin-top:12px;font-size:13px;color:#b9432f;}
.modal-ok{display:none;}
.modal-ok.open{display:block;}
.modal-ok .check{width:44px;height:44px;border-radius:var(--radius);background:var(--amber);color:var(--on-amber);display:flex;align-items:center;justify-content:center;margin-bottom:16px;font-weight:800;}
.demo-creds{background:var(--ink);color:var(--on-ink);border-radius:var(--radius);padding:16px 18px;margin:18px 0;}
.demo-creds div{display:flex;justify-content:space-between;gap:10px;font-family:'IBM Plex Mono';font-size:13.5px;padding:5px 0;}
.demo-creds div span:first-child{color:var(--on-ink-faint);}
.modal-ok .modal-note{font-size:12.5px;color:var(--text-faint);line-height:1.6;margin:14px 0 0;}
.modal-ok .cta{display:block;text-align:center;margin-top:20px;padding:13px;font-size:17px;}
/* ---- pie: negro, como la barra de arriba ---- */
footer{background:var(--ink);color:var(--on-ink-faint);padding:56px 24px 44px;text-align:center;font-size:13px;border-top:6px solid var(--amber);}
footer .brand{justify-content:center;margin-bottom:14px;color:var(--on-ink);}
footer .footer-links a{text-decoration:underline;text-underline-offset:2px;}
footer .footer-links a:hover{color:var(--on-ink);}
footer .footer-star{display:inline-block;margin-top:22px;line-height:0;border-radius:50%;transition:transform .15s ease,opacity .15s ease;}
footer .footer-star img{width:96px;height:96px;display:block;}
footer .footer-star:hover{transform:translateY(-1px);}
footer .footer-star:focus-visible{outline:2px solid var(--amber);outline-offset:4px;}
.footer-credit{margin-top:16px;font-size:12px;color:var(--on-ink-faint);}
.footer-credit a{display:inline-flex;align-items:center;gap:5px;margin-left:4px;color:var(--amber);font-weight:600;text-decoration:none;border-bottom:1px solid transparent;padding-bottom:1px;transition:border-color .15s ease,color .15s ease;}
.footer-credit a:hover{border-color:var(--amber);}
.footer-credit a svg{width:13px;height:13px;}
html{scroll-behavior:smooth;}