/* Estilos de las páginas legales de Clova Sales
   Comparten la tipografía y los colores de la web principal. */

/* fuentes alojadas en la propia web, como en index.html */
@font-face{font-family:'Bebas Neue';font-style:normal;font-weight:400;font-display:swap;
  src:url(fonts/bebas-neue-latin.woff2) format('woff2');}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:300 700;font-display:swap;
  src:url(fonts/dm-sans-latin.woff2) format('woff2');}

:root{
  --blue:#0A84FF;
  --blue-ink:#006BD6;   /* azul para botones y textos: contraste 5:1 sobre blanco */
  --blue-dark:#1C3F75;
  --blue-glow:#4FC3FF;
  --blue-light:rgba(10,132,255,0.07);
  --silver-hi:#F5F7FA;
  --text:#1a1a2e;
  --text-mid:#4a4a6a;
  --text-soft:#6B7079;
  --nav-h:72px;
}

a:focus-visible,button:focus-visible{outline:2px solid var(--blue-ink);outline-offset:3px;}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'DM Sans',sans-serif;background:#fff;color:var(--text);
  font-size:16px;line-height:1.8;font-weight:300;
}

/* cabecera */
.lg-nav{
  position:sticky;top:0;z-index:100;height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;padding:0 32px;
  background:rgba(255,255,255,0.96);backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(0,0,0,0.06);
}
.lg-nav img{height:36px;width:auto;display:block;}
.lg-volver{
  font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:500;
  color:var(--text-mid);text-decoration:none;transition:color .2s;
  display:inline-flex;align-items:center;gap:8px;padding:12px 4px;
}
.lg-volver:hover{color:var(--blue-ink);}

/* contenido */
.lg-wrap{max-width:820px;margin:0 auto;padding:64px 32px 96px;}
.lg-eyebrow{
  font-size:12px;letter-spacing:.25em;text-transform:uppercase;color:var(--blue-ink);
  display:flex;align-items:center;gap:10px;margin-bottom:16px;
}
.lg-eyebrow::before{content:'';width:24px;height:1px;background:var(--blue);flex-shrink:0;}
h1{
  font-family:'Bebas Neue',sans-serif;font-size:clamp(38px,6vw,62px);
  line-height:1;letter-spacing:.02em;margin-bottom:14px;font-weight:400;
}
.lg-fecha{font-size:13px;color:var(--text-soft);margin-bottom:48px;}
h2{
  font-family:'Bebas Neue',sans-serif;font-size:clamp(24px,3.4vw,32px);
  line-height:1.1;letter-spacing:.03em;margin:48px 0 16px;font-weight:400;
}
h3{font-size:16px;font-weight:600;margin:28px 0 10px;color:var(--text);}
p{margin-bottom:16px;color:var(--text-mid);}
ul,ol{margin:0 0 20px 22px;color:var(--text-mid);}
li{margin-bottom:9px;}
strong{color:var(--text);font-weight:600;}
a{color:var(--blue-ink);text-decoration:underline;text-underline-offset:3px;}
a:hover{color:var(--blue-dark);}

/* tabla de datos */
table{
  width:100%;border-collapse:collapse;margin:20px 0 28px;font-size:14.5px;
  display:block;overflow-x:auto;
}
th,td{
  border:1px solid rgba(0,0,0,.1);padding:13px 16px;text-align:left;
  vertical-align:top;color:var(--text-mid);
}
th{background:var(--silver-hi);color:var(--text);font-weight:600;white-space:nowrap;}

/* avisos */
.lg-aviso{
  background:var(--blue-light);border-left:3px solid var(--blue);
  padding:20px 24px;border-radius:0 6px 6px 0;margin:28px 0;
}
.lg-aviso p:last-child{margin-bottom:0;}
.lg-pendiente{
  background:#FFF8E5;border-left:3px solid #E0A800;
  padding:20px 24px;border-radius:0 6px 6px 0;margin:28px 0;font-size:14.5px;
}
.lg-pendiente p:last-child{margin-bottom:0;}

/* botón */
.lg-btn{
  display:inline-flex;align-items:center;gap:10px;background:var(--blue-ink);color:#fff;
  text-decoration:none;font-size:13px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;padding:15px 32px;border-radius:3px;border:none;
  cursor:pointer;font-family:inherit;transition:all .25s;margin-top:8px;
}
.lg-btn:hover{background:var(--blue-dark);color:#fff;
  box-shadow:0 8px 30px rgba(10,132,255,.3);}

/* pie */
.lg-foot{
  border-top:1px solid rgba(0,0,0,.06);padding:32px;text-align:center;
  font-size:12px;color:var(--text-soft);letter-spacing:.04em;
}
.lg-foot a{color:var(--text-soft);text-decoration:none;margin:0 10px;
  display:inline-block;padding:6px 0;}
.lg-foot a:hover{color:var(--blue-ink);}
.lg-foot-legal{margin-top:12px;}

@media(max-width:700px){
  .lg-nav{padding:0 20px;}
  .lg-wrap{padding:44px 20px 72px;}
  .lg-volver span{display:none;}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{transition-duration:.01ms!important;}
}