/* Home Litani v1.6.0
   Generado desde el diseño aprobado. */

body { margin: 0; background: #fffaf9; }
  a { text-decoration: none; color: inherit; }
  a:hover { color: #c92f52; }
  .cl { --accent:#f9526b; --accent-dark:#c92f52; --accent-2:#b44086; --coral:#ff7b67;
        --wa:#25d366; --wa-dark:#1da851; --r:14px;
        --bg:#fffaf9; --bg-alt:#fbedef; --surface:#fff; --border:#f0dbe0; --text:#241417; --dim:#71585d;
        background:var(--bg); color:var(--text); font-family:Inter,system-ui,sans-serif; line-height:1.6; overflow-x:hidden; }
  .cl h1, .cl h2, .cl h3 { font-family:Sora,Inter,sans-serif; margin:0; }
  .cl ::selection { background:#f9526b; color:#fff; }
  .wrap { max-width:1180px; margin:0 auto; padding:0 24px; }
  .btn2 { display:inline-flex; align-items:center; gap:8px; padding:12px 22px; border-radius:999px;
          font-weight:600; font-size:.95rem; border:1px solid transparent; white-space:nowrap;
          transition:transform .15s ease, box-shadow .15s ease, background .15s ease; }
  .btn2:hover { transform:translateY(-2px); }
  .btn2 svg { width:18px; height:18px; fill:currentColor; }
  .btn-wa { background:var(--wa); color:#06210f; }
  .btn-wa:hover { background:var(--wa-dark); color:#06210f; box-shadow:0 8px 24px rgba(37,211,102,.35); }
  .btn-ol { background:transparent; color:var(--text); border-color:var(--border); }
  .btn-ol:hover { border-color:var(--accent); color:var(--accent); }
  .btn-lg2 { padding:15px 28px; font-size:1.02rem; }
  .cl a:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
  @keyframes drift1 { 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(-40px,30px) scale(1.12);} }
  @keyframes drift2 { 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(30px,-30px) scale(1.08);} }
  @keyframes floaty { 0%,100%{transform:rotate(3deg) translateY(0);} 50%{transform:rotate(3deg) translateY(-14px);} }
  @keyframes marquee { from{transform:translateX(0);} to{transform:translateX(-50%);} }
  .marq { overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,black 10%,black 90%,transparent);
          mask-image:linear-gradient(90deg,transparent,black 10%,black 90%,transparent); }
  .marq-row { display:flex; flex-wrap:nowrap; align-items:center; width:max-content; gap:44px;
              animation:marquee 26s linear infinite;
              font-family:Sora,sans-serif; font-weight:700; font-size:1.25rem; color:#fff; }
  .marq-row span { transition:color .15s ease; }
  .marq-row span:hover { color:#ffd9c9; }
  .marq-dot { width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.5); flex:none; }
  .marq:hover .marq-row { animation-play-state:paused; }
  .bento { display:grid; grid-template-columns:repeat(4,1fr); gap:20px;
           grid-template-areas:"cel cel note note" "cel cel audio gaming" "tv tv acc acc"; }
  .card-cat { position:relative; border-radius:var(--r); overflow:hidden; border:1px solid var(--border);
              min-height:170px; isolation:isolate; display:block; }
  .card-cat img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
  .card-cat::after { content:""; position:absolute; inset:0; z-index:1;
                     background:linear-gradient(180deg,rgba(11,15,25,.05) 40%,rgba(11,15,25,.92) 100%); }
  .card-cat:hover img { transform:scale(1.06); }
  .cat-ov { position:absolute; left:0; right:0; bottom:0; z-index:2; padding:22px; }
  .cat-ov h3 { font-size:1.15rem; margin-bottom:4px; color:#f8eeef; text-shadow:0 2px 12px rgba(0,0,0,.5); }
  .cat-ov p { margin:0; color:#cfc0c3; font-size:.88rem; max-width:32ch; }
  .feat-icon { width:46px; height:46px; display:flex; align-items:center; justify-content:center;
               background:var(--surface); border:1px solid var(--border); border-radius:12px; font-size:1.2rem; }
  .rev { background:var(--surface); border:1px solid var(--border); border-radius:var(--r); padding:28px; }
  .soc { display:inline-flex; align-items:center; gap:10px; padding:12px 22px; border-radius:999px;
         font-weight:600; font-size:.95rem; color:#fff; border:1px solid transparent;
         transition:transform .15s ease, box-shadow .15s ease, filter .15s ease; }
  .soc:hover { transform:translateY(-2px); color:#fff; filter:saturate(1.1); }
  .soc svg { width:20px; height:20px; fill:currentColor; flex:none; }
  .soc-ig { background:linear-gradient(45deg,#f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); }
  .soc-ig:hover { box-shadow:0 10px 26px rgba(220,39,67,.38); }
  .soc-fb { background:#1877f2; }
  .soc-fb:hover { box-shadow:0 10px 26px rgba(24,119,242,.38); }
  .pc { position:relative; text-align:center; }
  .pc img { width:100%; aspect-ratio:4/5; object-fit:cover; object-position:50% 18%;
            border-radius:999px 999px 0 0; border:1px solid var(--border); display:block;
            transition:transform .2s ease; }
  .pc .plinth { height:7px; border-radius:0 0 var(--r) var(--r); background-color:var(--accent);
                background-image:
                  repeating-linear-gradient(45deg, rgba(255,255,255,.6) 0 1.5px, transparent 1.5px 8px),
                  repeating-linear-gradient(-45deg, rgba(255,255,255,.6) 0 1.5px, transparent 1.5px 8px);
                transition:transform .2s ease; }
  .pc .frame { position:relative; filter:drop-shadow(0 14px 26px rgba(36,20,23,.20)) drop-shadow(0 3px 6px rgba(36,20,23,.10));
               transition:filter .2s ease; }
  .pc .frame::before { content:""; position:absolute; left:6%; right:6%; top:14px; bottom:-10px; z-index:-1;
                       border-radius:999px 999px var(--r) var(--r);
                       background:linear-gradient(180deg, rgba(249,82,107,.22), rgba(180,64,134,.10));
                       filter:blur(14px); }
  .pc:hover .frame { filter:drop-shadow(0 22px 38px rgba(180,64,134,.32)) drop-shadow(0 4px 8px rgba(36,20,23,.12)); }
  .pc:hover img, .pc:hover .plinth { transform:translateY(-4px); }
  .pc h3 { font-size:1.02rem; margin-top:14px; }
  .pc span { display:block; color:var(--dim); font-size:.8rem; }
  /* Guardilla levantina */
  .frieze { height:26px; background-color:var(--accent);
            background-image:
              repeating-linear-gradient(45deg, rgba(255,255,255,.55) 0 2px, transparent 2px 13px),
              repeating-linear-gradient(-45deg, rgba(255,255,255,.55) 0 2px, transparent 2px 13px),
              repeating-linear-gradient(0deg, rgba(255,255,255,.28) 0 1px, transparent 1px 13px),
              repeating-linear-gradient(90deg, rgba(255,255,255,.28) 0 1px, transparent 1px 13px); }
  .brands-band { background:linear-gradient(100deg,var(--accent) 0%,var(--accent-2) 100%); }
  .brands-band .frieze { margin-bottom:22px; }
  .wa-float { position:sticky; bottom:24px; margin-left:auto; margin-right:24px; width:56px; height:56px;
              background:var(--wa); border-radius:50%; display:flex; align-items:center; justify-content:center;
              box-shadow:0 8px 24px rgba(37,211,102,.4); z-index:20; transition:transform .15s ease; }
  .wa-float:hover { transform:scale(1.08); }
  .wa-float svg { width:28px; height:28px; fill:#06210f; }
  @media (max-width:960px) {
    .hero-in { grid-template-columns:1fr !important; }
    .bento { grid-template-columns:repeat(2,1fr); grid-template-areas:"cel cel" "note audio" "gaming tv" "acc acc"; }
    .g-feat { grid-template-columns:repeat(2,1fr) !important; }
    .g-rev, .g-ubi, .g-maps { grid-template-columns:1fr !important; }
  }

/* ---------- Reglas de páginas internas ---------- */

