/* Selectum · capa legal: banner de cookies, casilla de autorización y páginas legales.
   Valores fijos (no variables) para que funcione igual en index (v2) y en las fichas (site.css). */

/* ---------- casilla de autorización ---------- */
.consent-field{ display:grid; gap:6px; grid-column:1/-1; margin-top:4px; }
.consent{ display:grid; grid-template-columns:20px 1fr; gap:12px; align-items:start; cursor:pointer; }
.consent input{ position:absolute; opacity:0; width:20px; height:20px; margin:0; }
.consent-box{
  width:20px; height:20px; border:1px solid rgba(255,255,255,.35); border-radius:2px; background:#0a0a0a;
  display:grid; place-items:center; transition:border-color .16s ease-out, background .16s ease-out, transform .16s ease-out;
}
.consent-box::after{
  content:''; width:10px; height:6px; border:2px solid #000; border-top:0; border-right:0;
  transform:rotate(-45deg) scale(.6); opacity:0; margin-top:-2px;
  transition:opacity .16s ease-out, transform .16s ease-out;
}
.consent input:checked + .consent-box{ background:#efbd2e; border-color:#efbd2e; }
.consent input:checked + .consent-box::after{ opacity:1; transform:rotate(-45deg) scale(1); }
.consent input:focus-visible + .consent-box{ outline:2px solid #efbd2e; outline-offset:3px; }
.consent:active .consent-box{ transform:scale(.94); }
.consent-text{ font-size:11.5px; line-height:1.6; color:#c9c9c9; }
.consent-text a{ color:#efbd2e; text-decoration:underline; text-underline-offset:3px; }
.consent-field.has-error .consent-box{ border-color:#efbd2e; background:rgba(188,148,45,.12); }
.consent-field .field-error{ display:none; color:#fff; font-size:11px; line-height:1.5; font-weight:600; }
.consent-field.has-error .field-error{ display:block; }

/* ---------- banner de cookies ---------- */
.ck{
  position:fixed; z-index:3000; left:12px; right:12px; bottom:12px; max-width:720px;
  background:#0a0a0a; color:#fff; border:1px solid rgba(188,148,45,.55); border-radius:2px;
  padding:18px 18px 16px; font-family:inherit; font-size:13px; line-height:1.55;
  box-shadow:0 18px 60px rgba(0,0,0,.6);
  opacity:0; transform:translateY(14px); visibility:hidden;
  transition:opacity .28s cubic-bezier(.23,1,.32,1), transform .28s cubic-bezier(.23,1,.32,1), visibility 0s linear .28s;
}
.ck.is-open{ opacity:1; transform:none; visibility:visible; transition-delay:0s; }
.ck h2{ font-size:13px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#efbd2e; margin:0 0 8px; }
.ck p{ margin:0 0 14px; color:#d4d4d4; }
.ck a{ color:#efbd2e; text-decoration:underline; text-underline-offset:3px; }
.ck-actions{ display:grid; grid-template-columns:1fr; gap:8px; }
.ck-btn{
  min-height:46px; padding:0 18px; border:1px solid rgba(255,255,255,.28); border-radius:2px; background:transparent; color:#fff;
  font-family:inherit; font-weight:800; font-size:11px; line-height:1; letter-spacing:.14em; text-transform:uppercase; cursor:pointer;
  transition:transform .16s ease-out, border-color .16s ease-out, background .16s ease-out, color .16s ease-out;
}
.ck-btn:active{ transform:scale(.97); }
.ck-btn:focus-visible{ outline:2px solid #efbd2e; outline-offset:3px; }
.ck-btn--main{ background:#efbd2e; border-color:#efbd2e; color:#000; }
@media (hover:hover) and (pointer:fine){
  .ck-btn:hover{ border-color:#efbd2e; color:#efbd2e; }
  .ck-btn--main:hover{ background:#f5cd57; color:#000; }
}
.ck-cfg{ display:none; margin:0 0 14px; border-top:1px solid rgba(255,255,255,.14); }
.ck.is-config .ck-cfg{ display:block; }
.ck.is-config .ck-main-actions{ display:none; }
.ck-row{ display:grid; grid-template-columns:1fr auto; gap:6px 16px; align-items:center; padding:12px 0; border-bottom:1px solid rgba(255,255,255,.14); }
.ck-row b{ font-size:12.5px; }
.ck-row small{ grid-column:1; color:#a8a8a8; font-size:11.5px; line-height:1.5; }
.ck-sw{ position:relative; width:44px; height:26px; grid-row:1; grid-column:2; }
.ck-sw input{ position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; z-index:1; }
.ck-sw span{ position:absolute; inset:0; border-radius:26px; background:#2a2a2a; transition:background .18s ease-out; }
.ck-sw span::after{ content:''; position:absolute; left:3px; top:3px; width:20px; height:20px; border-radius:50%; background:#fff; transition:transform .18s cubic-bezier(.23,1,.32,1); }
.ck-sw input:checked + span{ background:#bc942d; }
.ck-sw input:checked + span::after{ transform:translateX(18px); }
.ck-sw input:disabled{ cursor:not-allowed; }
.ck-sw input:disabled + span{ opacity:.55; }
.ck-sw input:focus-visible + span{ outline:2px solid #efbd2e; outline-offset:3px; }
@media (min-width:720px){
  .ck{ left:24px; right:auto; bottom:24px; padding:22px; }
  .ck-actions{ grid-template-columns:repeat(3,1fr); }
}
@media (prefers-reduced-motion:reduce){
  .ck{ transform:none; transition:opacity .2s linear, visibility 0s linear .2s; }
  .consent-box,.consent-box::after,.ck-sw span,.ck-sw span::after{ transition:none; }
}
.ck-link{ background:none; border:0; padding:0; font:inherit; color:inherit; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.ck-link:hover{ color:#efbd2e; }

/* ---------- aviso de tercero (Financiakarz) ---------- */
.fin-notice{ margin-top:14px; max-width:46ch; font-size:11.5px; line-height:1.6; color:#a8a8a8; }
.fin-notice a{ color:#efbd2e; text-decoration:underline; text-underline-offset:3px; }

/* ---------- páginas legales (diseño v2) ---------- */
.lg{ background:#000; color:#fff; min-height:100vh; font-family:'Manrope',system-ui,sans-serif; }
.lg-bar{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px clamp(20px,4.4vw,72px); border-bottom:1px solid rgba(188,148,45,.28); position:sticky; top:0; background:rgba(0,0,0,.92); z-index:50; backdrop-filter:blur(8px); }
.lg-bar img{ height:44px; width:auto; }
.lg-bar nav{ display:flex; gap:18px; align-items:center; font:800 10.5px/1 'Manrope',sans-serif; letter-spacing:.16em; text-transform:uppercase; }
.lg-bar nav a{ color:#c9c9c9; padding:10px 0; transition:color .16s ease-out; }
.lg-bar nav a:hover{ color:#efbd2e; }
.lg-head{ padding:clamp(40px,7vw,96px) clamp(20px,4.4vw,72px) clamp(20px,3vw,36px); max-width:1440px; margin:0 auto; }
.lg-kicker{ font:800 10.5px/1 'Manrope',sans-serif; letter-spacing:.2em; text-transform:uppercase; color:#bc942d; }
.lg-head h1{ font-family:'Bodoni Moda',serif; font-weight:500; font-size:clamp(30px,5vw,60px); line-height:1.06; margin:14px 0 12px; max-width:20ch; }
.lg-updated{ color:#808080; font-size:12.5px; }
.lg-body{ display:grid; gap:28px; padding:0 clamp(20px,4.4vw,72px) clamp(56px,8vw,112px); max-width:1440px; margin:0 auto; }
.lg-toc{ border:1px solid rgba(255,255,255,.12); padding:16px 18px; align-self:start; }
.lg-toc b{ display:block; font:800 10px/1 'Manrope',sans-serif; letter-spacing:.18em; text-transform:uppercase; color:#bc942d; margin-bottom:12px; }
.lg-toc ol{ margin:0; padding-left:20px; display:grid; gap:7px; font-size:13px; color:#c9c9c9; }
.lg-toc a:hover{ color:#efbd2e; }
.lg-doc{ max-width:74ch; }
.lg-doc h2{ font-family:'Bodoni Moda',serif; font-weight:500; font-size:clamp(21px,2.4vw,28px); line-height:1.2; margin:40px 0 12px; scroll-margin-top:90px; }
.lg-doc h2:first-child{ margin-top:0; }
.lg-doc h3{ font:800 11px/1.4 'Manrope',sans-serif; letter-spacing:.14em; text-transform:uppercase; color:#efbd2e; margin:24px 0 8px; }
.lg-doc p,.lg-doc li{ font-size:15px; line-height:1.75; color:#d6d6d6; }
.lg-doc p{ margin:0 0 14px; }
.lg-doc ul,.lg-doc ol{ margin:0 0 16px; padding-left:22px; display:grid; gap:6px; }
.lg-doc a{ color:#efbd2e; text-decoration:underline; text-underline-offset:3px; }
.lg-doc strong{ color:#fff; font-weight:700; }
.lg-box{ border:1px solid rgba(188,148,45,.45); background:rgba(188,148,45,.06); padding:16px 18px; margin:0 0 20px; }
.lg-box p:last-child{ margin-bottom:0; }
.lg-table{ width:100%; border-collapse:collapse; margin:0 0 18px; font-size:13.5px; }
.lg-table th,.lg-table td{ text-align:left; vertical-align:top; padding:10px 12px; border:1px solid rgba(255,255,255,.14); color:#d6d6d6; line-height:1.55; }
.lg-table th{ color:#efbd2e; font:800 10px/1.3 'Manrope',sans-serif; letter-spacing:.14em; text-transform:uppercase; background:#0a0a0a; }
.lg-scroll{ overflow-x:auto; }
.lg-foot{ border-top:1px solid rgba(188,148,45,.28); padding:32px clamp(20px,4.4vw,72px) 40px; max-width:1440px; margin:0 auto; display:grid; gap:18px; font-size:12.5px; line-height:1.7; color:#808080; }
.lg-foot nav{ display:flex; flex-wrap:wrap; gap:8px 20px; }
.lg-foot a{ color:#c9c9c9; text-decoration:underline; text-underline-offset:3px; }
.lg-foot a:hover{ color:#efbd2e; }
@media (min-width:980px){
  .lg-body{ grid-template-columns:260px minmax(0,1fr); gap:64px; }
  .lg-toc{ position:sticky; top:96px; }
}
@media (max-width:560px){ .lg-bar nav a:not(.lg-wa){ display:none; } }

/* ---------- páginas de inventario por ciudad / marca y vender ---------- */
.lg-body--wide{ grid-template-columns:1fr; }
.lg-doc--wide{ max-width:1100px; }
.sx-grid{ list-style:none; margin:24px 0 28px; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:18px; }
.sx-card a{ display:grid; gap:6px; text-decoration:none; color:#fff; border:1px solid rgba(255,255,255,.12); padding:0 0 14px; transition:border-color .18s ease-out, transform .18s ease-out; }
.sx-card a:active{ transform:scale(.985); }
@media (hover:hover) and (pointer:fine){ .sx-card a:hover{ border-color:#bc942d; } }
.sx-card img{ width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; background:#111; }
.sx-name{ font-family:'Bodoni Moda',serif; font-size:19px; padding:6px 14px 0; line-height:1.2; }
.sx-meta{ font-size:12.5px; color:#a8a8a8; padding:0 14px; }
.sx-price{ font-weight:800; font-size:16px; color:#efbd2e; padding:2px 14px 0; }
.sx-btn{ display:inline-flex; align-items:center; min-height:48px; padding:0 22px; background:#efbd2e; color:#000 !important; text-decoration:none !important; font:800 10.5px/1 'Manrope',sans-serif; letter-spacing:.16em; text-transform:uppercase; border-radius:2px; transition:transform .16s ease-out; }
.sx-btn:active{ transform:scale(.97); }
.sx-links{ list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:10px 22px; margin:0 0 24px; }
.sx-links span{ color:#808080; font-size:13px; }
.vdetail-specs .v a{ color:inherit; text-decoration:underline; text-decoration-color:rgba(255,255,255,.3); text-underline-offset:3px; }
.lg-doc .sx-grid{ display:grid; padding-left:0; gap:18px; }
.lg-doc .sx-links{ display:flex; padding-left:0; gap:10px 22px; }
.sx-card{ display:block; } .sx-card a{ height:100%; align-content:start; box-sizing:border-box; }
