/* Estilo compartido de las guías para dueños de local (juegos-para-bares, como-atraer-clientes…): clonado de libear.html */

  @view-transition{ navigation:auto; }
  html{ background:#101012; }
  :root{ --bg:#101012; --surface:#1c1c1e; --line:#2a2a2e; --ink:#f8f7f4; --dim:#a8a8b3; --accent:#ff8a00; }
  *{ box-sizing:border-box; }
  body{ margin:0; background:var(--bg); color:var(--ink); font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; line-height:1.6; }
  .wrap{ max-width:760px; margin:0 auto; padding:34px 22px 70px; }
  .marca{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:26px; letter-spacing:-.02em; color:var(--ink); text-decoration:none; display:inline-block; margin-bottom:34px; }
  .marca span{ color:var(--accent); }
  h1{ font-family:'Bricolage Grotesque',sans-serif; font-size:clamp(32px,6.5vw,48px); font-weight:800; letter-spacing:-.03em; line-height:1.05; margin:0 0 18px; }
  .def{ font-size:19px; line-height:1.55; border-left:1px solid rgba(255,104,0,.55); padding-left:18px; margin:0 0 34px; }
  h2{ font-family:'Bricolage Grotesque',sans-serif; font-size:24px; font-weight:800; letter-spacing:-.02em; margin:40px 0 12px; }
  h3{ font-family:'Bricolage Grotesque',sans-serif; font-size:18px; font-weight:800; letter-spacing:-.01em; margin:22px 0 6px; }
  p{ color:#d8d8de; margin:0 0 14px; }
  ul.lista{ padding-left:20px; color:#d8d8de; margin:0 0 14px; }
  ul.lista li{ margin-bottom:8px; }
  .juegos{ list-style:none; padding:0; margin:0; counter-reset:p; }
  .juegos li{ counter-increment:p; position:relative; padding:14px 0 14px 52px; border-bottom:1px solid var(--line); }
  .juegos li::before{ content:counter(p); position:absolute; left:0; top:14px; width:34px; height:34px; border-radius:50%; background:var(--surface); border:1px solid var(--line); color:var(--accent); font-weight:800; display:grid; place-items:center; }
  .juegos li b{ color:var(--ink); }
  .juegos li small{ display:block; color:var(--dim); font-size:13.5px; margin-top:4px; }
  .q{ font-weight:700; color:var(--ink); margin:22px 0 4px; }
  .nota{ background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:16px 18px; margin:26px 0; color:#d8d8de; }
  .cta{ display:inline-block; margin-top:30px; background:var(--accent); color:#141414; font-weight:800; text-decoration:none; padding:15px 30px; border-radius:13px; }
  a{ color:var(--accent); }
  footer{ margin-top:50px; padding-top:22px; border-top:1px solid var(--line); color:#8a8a95; font-size:13px; }
  footer a{ color:#8a8a95; }
  .fecha{ margin-top:8px; font-size:12px; color:#71717c; }
  .rel{ margin-top:36px; padding-top:20px; border-top:1px solid var(--line); }
  .rel a{ display:block; margin:6px 0; }