/* =========================================================================
   unidadeconomica.cl — estética Laboralízate
   Tokens portados 1:1 desde laboral-pro (src/index.css, tailwind.config.ts)
   Fuentes self-hosted Sora + Manrope (mismas woff2 de Laboralízate)
   ========================================================================= */

/* ---------- Fuentes ---------- */
@font-face { font-family:'Manrope'; font-style:normal; font-weight:400; font-display:swap; src:url('/fonts/manrope-400-latin.woff2') format('woff2'); }
@font-face { font-family:'Manrope'; font-style:normal; font-weight:400; font-display:swap; src:url('/fonts/manrope-400-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Manrope'; font-style:normal; font-weight:500; font-display:swap; src:url('/fonts/manrope-500-latin.woff2') format('woff2'); }
@font-face { font-family:'Manrope'; font-style:normal; font-weight:600; font-display:swap; src:url('/fonts/manrope-600-latin.woff2') format('woff2'); }
@font-face { font-family:'Manrope'; font-style:normal; font-weight:700; font-display:swap; src:url('/fonts/manrope-700-latin.woff2') format('woff2'); }
@font-face { font-family:'Sora'; font-style:normal; font-weight:400; font-display:swap; src:url('/fonts/sora-400-latin.woff2') format('woff2'); }
@font-face { font-family:'Sora'; font-style:normal; font-weight:600; font-display:swap; src:url('/fonts/sora-600-latin.woff2') format('woff2'); }
@font-face { font-family:'Sora'; font-style:normal; font-weight:700; font-display:swap; src:url('/fonts/sora-700-latin.woff2') format('woff2'); }
@font-face { font-family:'Sora'; font-style:normal; font-weight:800; font-display:swap; src:url('/fonts/sora-800-latin.woff2') format('woff2'); }

/* ---------- Tokens de marca (HSL, idénticos a Laboralízate) ---------- */
:root{
  --background:0 0% 98%;
  --foreground:0 0% 15%;
  --card:0 0% 100%;
  --card-foreground:0 0% 15%;
  --primary:0 76% 42%;            /* rojo editorial #BC1A1A */
  --primary-foreground:0 0% 100%;
  --muted:0 0% 94%;
  --muted-foreground:0 0% 40%;
  --accent:0 60% 95%;
  --accent-foreground:0 76% 42%;
  --border:0 0% 88%;
  --corp:0 0% 35%;
  --radius:0.5rem;
  --shadow-soft:0 4px 20px -4px hsl(215 60% 22% / 0.08);
  --shadow-elevated:0 8px 40px -8px hsl(215 60% 22% / 0.12);
  --font-display:'Sora',sans-serif;
  --font-body:'Manrope',sans-serif;
  --container:1200px;
}

/* ---------- Base ---------- */
*{box-sizing:border-box;margin:0;padding:0;border-color:hsl(var(--border));}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  font-family:var(--font-body);
  background:hsl(var(--background));
  color:hsl(var(--foreground));
  line-height:1.6;
  font-size:16px;
}
h1,h2,h3,h4{font-family:var(--font-display);line-height:1.15;font-weight:700;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.container{max-width:var(--container);margin:0 auto;padding:0 1.5rem;}
section[id]{scroll-margin-top:6rem;}   /* desfase para que el header fijo no tape la sección al hacer clic en el menú */
.muted{color:hsl(var(--muted-foreground));}
.red{color:hsl(var(--primary));}

/* ---------- Botones ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-family:var(--font-body);font-weight:600;font-size:.95rem;
  padding:.7rem 1.3rem;border-radius:var(--radius);cursor:pointer;border:1px solid transparent;
  transition:opacity .2s,background .2s,color .2s;white-space:nowrap;
}
.btn-primary{background:hsl(var(--primary));color:hsl(var(--primary-foreground));}
.btn-primary:hover{opacity:.9;}
.btn-ghost{background:transparent;color:hsl(var(--foreground));border-color:hsl(var(--border));}
.btn-ghost:hover{background:hsl(var(--muted));}
.btn-lg{padding:.95rem 1.7rem;font-size:1.05rem;}

/* ---------- Header ---------- */
.site-header{
  position:fixed;top:0;left:0;width:100%;z-index:50;height:88px;
  background:hsl(var(--background)/.82);backdrop-filter:blur(12px);
  border-bottom:1px solid hsl(var(--border)/.5);
}
.site-header .container{height:100%;display:flex;align-items:center;justify-content:space-between;}
.site-header .logo img{height:44px;width:auto;}
.site-nav{display:flex;align-items:center;gap:2rem;font-size:.9rem;font-weight:500;color:hsl(var(--muted-foreground));}
.site-nav a:hover{color:hsl(var(--foreground));}
.header-cta{margin-left:1.5rem;}
.menu-btn{display:none;background:none;border:none;cursor:pointer;color:hsl(var(--foreground));padding:.4rem;}

/* ---------- Hero ---------- */
.hero{padding:160px 0 80px;text-align:center;}
.hero .eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;
  background:hsl(var(--accent));color:hsl(var(--accent-foreground));
  font-weight:600;font-size:.8rem;padding:.4rem .9rem;border-radius:999px;margin-bottom:1.5rem;
}
.hero .dot{width:8px;height:8px;border-radius:50%;background:hsl(142 71% 45%);box-shadow:0 0 0 0 hsl(142 71% 45%/.6);animation:pulse 2s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 hsl(142 71% 45%/.5);}70%{box-shadow:0 0 0 8px hsl(142 71% 45%/0);}100%{box-shadow:0 0 0 0 hsl(142 71% 45%/0);}}
.hero h1{font-size:clamp(2rem,5vw,3.4rem);font-weight:800;letter-spacing:-.02em;max-width:18ch;margin:0 auto 1.2rem;}
.hero .lead{font-size:clamp(1.05rem,2.2vw,1.3rem);color:hsl(var(--muted-foreground));max-width:60ch;margin:0 auto 2.2rem;}

/* Search box (centro del hero; se conecta al backend en Fase 2) */
.search{display:flex;gap:.5rem;max-width:560px;margin:0 auto;background:hsl(var(--card));
  border:1px solid hsl(var(--border));border-radius:calc(var(--radius) + 4px);
  padding:.5rem;box-shadow:var(--shadow-soft);}
.search input{flex:1;border:none;outline:none;background:transparent;font-family:var(--font-body);
  font-size:1rem;padding:.6rem .8rem;color:hsl(var(--foreground));}
.search .hint{margin-top:.9rem;font-size:.85rem;color:hsl(var(--muted-foreground));}

/* ---------- Resultados de búsqueda ---------- */
.search-results{max-width:560px;margin:.7rem auto 0;text-align:left;}
.sr-msg{color:hsl(var(--foreground));font-size:.95rem;padding:.85rem 1rem;background:hsl(var(--card));
  border:1px solid hsl(var(--border));border-radius:var(--radius);box-shadow:var(--shadow-soft);}
.sr-msg.err{border-color:hsl(var(--primary));}
.sr-msg.egg{border-color:hsl(var(--primary));font-size:1rem;}
.sr-msg.egg a{color:hsl(var(--primary));font-weight:700;white-space:nowrap;}
.confetti-pc{position:fixed;top:-14px;width:9px;height:14px;z-index:9999;border-radius:2px;
  pointer-events:none;animation:confetti-fall 3s linear forwards;}
@keyframes confetti-fall{to{transform:translateY(106vh) rotate(720deg);opacity:.85;}}
.sr-item{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem .95rem;
  background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:var(--radius);
  margin-bottom:.45rem;box-shadow:var(--shadow-soft);}
.sr-item:hover{border-color:hsl(var(--primary));}
.sr-nom{font-weight:600;color:hsl(var(--foreground));}
.sr-rut{color:hsl(var(--muted-foreground));font-size:.85rem;white-space:nowrap;}

/* ---------- Stats strip ---------- */
.stats{display:flex;flex-wrap:wrap;justify-content:center;gap:2.5rem;margin-top:3rem;}
.stat{text-align:center;}
.stat .num{font-family:var(--font-display);font-size:2rem;font-weight:800;color:hsl(var(--primary));}
.stat .lbl{font-size:.85rem;color:hsl(var(--muted-foreground));}

/* ---------- Sección genérica ---------- */
.section{padding:72px 0;}
.section.alt{background:hsl(var(--muted)/.4);}
.section-head{text-align:center;max-width:60ch;margin:0 auto 3rem;}
.section-head h2{font-size:clamp(1.6rem,3.5vw,2.4rem);font-weight:700;margin-bottom:.8rem;}
.section-head p{color:hsl(var(--muted-foreground));font-size:.98rem;max-width:52ch;margin:0 auto;}

/* ---------- Cards "qué hacemos" ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
.card{background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:calc(var(--radius) + 2px);
  padding:1.8rem;box-shadow:var(--shadow-soft);}
.card .ico{width:46px;height:46px;border-radius:12px;background:hsl(var(--accent));color:hsl(var(--primary));
  display:flex;align-items:center;justify-content:center;margin-bottom:1.1rem;}
.card .ico svg{width:24px;height:24px;}
.card h3{font-size:1.2rem;margin-bottom:.5rem;}
.card p{color:hsl(var(--muted-foreground));font-size:.97rem;}

/* ---------- CTA band ---------- */
.cta-band{background:hsl(var(--foreground));color:hsl(var(--background));text-align:center;padding:64px 0;}
.cta-band h2{font-size:clamp(1.6rem,3.5vw,2.3rem);margin-bottom:.8rem;color:hsl(var(--background));}
.cta-band p{color:hsl(var(--background)/.75);max-width:55ch;margin:0 auto 2rem;font-size:1.05rem;}

/* ---------- Footer ---------- */
.site-footer{background:hsl(var(--foreground));color:hsl(var(--background));padding:56px 0 28px;border-top:1px solid hsl(var(--background)/.1);}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1.2fr;gap:2rem;margin-bottom:2rem;}
.site-footer .brand{font-family:var(--font-display);font-size:1.3rem;font-weight:700;}
.site-footer p,.site-footer a,.site-footer span{font-size:.9rem;color:hsl(var(--background)/.72);}
.site-footer h4{font-family:var(--font-display);font-size:.9rem;margin-bottom:.8rem;color:hsl(var(--background)/.92);font-weight:600;}
.site-footer nav{display:flex;flex-direction:column;gap:.5rem;}
.site-footer nav a:hover{color:hsl(var(--background));}
.contact-line{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem;}
.contact-line svg{width:16px;height:16px;flex-shrink:0;}
.socials{display:flex;gap:.8rem;margin-top:1rem;}
.socials a{color:hsl(var(--background)/.72);}
.socials a:hover{color:hsl(var(--background));}
.footer-bottom{border-top:1px solid hsl(var(--background)/.18);padding-top:1.3rem;text-align:center;font-size:.78rem;color:hsl(var(--background)/.5);}
.footer-bottom .notice{display:block;margin-top:.4rem;}

/* ---------- WhatsApp bubble ---------- */
.wa-bubble{position:fixed;right:20px;bottom:20px;z-index:60;width:56px;height:56px;border-radius:50%;
  background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-elevated);
  transition:transform .2s;}
.wa-bubble:hover{transform:scale(1.06);}
.wa-bubble svg{width:30px;height:30px;fill:#fff;}

/* ---------- Página de empresa ---------- */
.emp-main{padding:120px 0 40px;}
.breadcrumb{font-size:.85rem;color:hsl(var(--muted-foreground));margin-bottom:1.2rem;}
.breadcrumb a:hover{color:hsl(var(--primary));}
.emp-head h1{font-size:clamp(1.7rem,4vw,2.6rem);font-weight:800;letter-spacing:-.02em;margin-bottom:.5rem;}
.emp-rut{font-size:1rem;color:hsl(var(--muted-foreground));margin-bottom:1.2rem;}
.emp-rut .warn{color:hsl(var(--primary));font-weight:600;}
.emp-summary{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:.5rem;}
.emp-stat{background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:var(--radius);
  padding:.9rem 1.2rem;box-shadow:var(--shadow-soft);}
.emp-stat .n{font-family:var(--font-display);font-size:1.6rem;font-weight:800;color:hsl(var(--primary));line-height:1;}
.emp-stat .l{font-size:.82rem;color:hsl(var(--muted-foreground));margin-top:.25rem;}
.emp-section{margin-top:2.6rem;}
.emp-section h2{font-size:1.4rem;font-weight:700;margin-bottom:1rem;}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid hsl(var(--border));
  border-radius:var(--radius);background:hsl(var(--card));}
.data-table{width:100%;border-collapse:collapse;font-size:.92rem;}
.res-legend{font-size:.85rem;color:hsl(var(--muted-foreground));margin:-.3rem 0 .8rem;}
.res-ico{font-size:1.1rem;}
.data-table td:last-child,.data-table th:last-child{text-align:center;width:1%;white-space:nowrap;}
.data-table th{text-align:left;font-family:var(--font-display);font-size:.8rem;text-transform:uppercase;
  letter-spacing:.03em;color:hsl(var(--muted-foreground));padding:.7rem .9rem;border-bottom:1px solid hsl(var(--border));background:hsl(var(--muted)/.4);}
.data-table td{padding:.7rem .9rem;border-bottom:1px solid hsl(var(--border));vertical-align:top;}
.data-table tr:last-child td{border-bottom:none;}
.data-table a{color:hsl(var(--primary));font-weight:600;}
.badge{display:inline-block;font-size:.78rem;font-weight:600;padding:.2rem .6rem;border-radius:999px;white-space:nowrap;}
.badge-dec{background:hsl(142 50% 92%);color:hsl(142 60% 25%);}
.badge-rech{background:hsl(0 60% 95%);color:hsl(0 76% 38%);}
.badge-otro{background:hsl(0 0% 92%);color:hsl(0 0% 35%);}
.vinc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.8rem;}
.vinc-card{display:block;background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:var(--radius);
  padding:.9rem 1.1rem;box-shadow:var(--shadow-soft);transition:border-color .15s;}
a.vinc-card:hover{border-color:hsl(var(--primary));}
.vinc-card .nom{font-weight:600;color:hsl(var(--foreground));}
.vinc-card .meta{font-size:.82rem;color:hsl(var(--muted-foreground));margin-top:.2rem;}
.emp-disclaimer{margin-top:2rem;font-size:.82rem;color:hsl(var(--muted-foreground));border-top:1px solid hsl(var(--border));padding-top:1rem;}

/* ---------- Animación de aparición (gated por .js: sin JS, todo visible) ---------- */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease-out,transform .6s ease-out;}
.js .reveal.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  .js .reveal{opacity:1 !important;transform:none !important;transition:none;}
}

/* ---------- Menú móvil ---------- */
.mobile-nav{display:none;flex-direction:column;background:hsl(var(--background));
  border-top:1px solid hsl(var(--border));box-shadow:var(--shadow-soft);padding:.4rem 0 .8rem;}
.mobile-nav a:not(.btn){padding:.95rem 1.5rem;font-weight:600;font-size:1.05rem;color:hsl(var(--foreground));}
.mobile-nav a:not(.btn):active{background:hsl(var(--muted));}
.mobile-nav .btn{margin:.6rem 1.5rem .2rem;}
.menu-btn .ico-close{display:none;}
.menu-btn[aria-expanded="true"] .ico-open{display:none;}
.menu-btn[aria-expanded="true"] .ico-close{display:inline-flex;}

/* ---------- Responsive ---------- */
@media (max-width:860px){
  .site-nav{display:none;}
  .header-cta{display:none;}
  .menu-btn{display:inline-flex;}
  .mobile-nav.open{display:flex;}
  .cards{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .hero{padding:120px 0 56px;}
  .search{flex-direction:column;}
  .search .btn{width:100%;}
  .stats{gap:1.6rem 2rem;}
  .data-table{font-size:.82rem;}
  .data-table th,.data-table td{padding:.5rem .45rem;}
  .emp-main{padding:104px 0 32px;}
}