:root{
  --bg:#FAF7F2;--bg2:#F3EEE5;--card:#FFFFFF;--line:#E3DED5;
  --ink:#12212E;--ink2:#1B3044;--on-ink:#E6EDF4;
  --t1:#12212E;--t2:#3D4C5A;--t3:#6B7A88;
  --cta:#DB4A31;--cta-d:#B93A24;--cta-t:#FFFFFF;--glow:rgba(219,74,49,.5);
  --hi:#C9402B;--hi-ink:#F2A93B;
  --val:#1F8C79;--val-ink:#2FB8A0;
  --c1:#E8563F;--c2:#F08A24;--c3:#2FB8A0;--c4:#3B82F6;
  --fh:'Fraunces','Playfair Display',Georgia,serif;--fb:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --r:18px;--rb:14px;
  --franja:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='112' height='20' viewBox='0 0 112 20'%3E%3Crect width='112' height='20' fill='%23FAF7F2'/%3E%3Crect x='0' width='16' height='20' fill='%23E8563F'/%3E%3Crect x='32' width='16' height='20' fill='%23F08A24'/%3E%3Crect x='64' width='16' height='20' fill='%232FB8A0'/%3E%3Crect x='96' width='16' height='20' fill='%233B82F6'/%3E%3Cpath d='M16 0V20M32 0V20M48 0V20M64 0V20M80 0V20M96 0V20M112 0V20' stroke='%2312212E' stroke-opacity='.35' stroke-width='1'/%3E%3Cg fill='%2312212E'%3E%3Crect x='11' width='10' height='12' rx='1.5'/%3E%3Crect x='27' width='10' height='12' rx='1.5'/%3E%3Crect x='59' width='10' height='12' rx='1.5'/%3E%3Crect x='75' width='10' height='12' rx='1.5'/%3E%3Crect x='91' width='10' height='12' rx='1.5'/%3E%3C/g%3E%3C/svg%3E");
}
/* Fraunces y Playfair no tienen griego: en /pianoxoris los títulos van en Source Serif 4 (tiene griego) */
html[lang="el"]{--fh:'Source Serif 4',Georgia,'Times New Roman',serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--t2);font-family:var(--fb);font-size:16px;line-height:1.55;min-height:100vh;min-height:100dvh}
[hidden]{display:none!important}
h1,h2,h3{text-wrap:balance;font-family:var(--fh);color:var(--t1);font-weight:700;margin:0;line-height:1.15}
p{margin:0}
img{display:block;max-width:100%}
button{font:inherit;cursor:pointer}

.franja{height:20px;background:var(--franja) repeat-x left top/112px 20px}

/* ---------- botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:12px 22px;border:0;border-bottom:3px solid var(--cta-d);border-radius:var(--rb);background:var(--cta);color:var(--cta-t);font-weight:800;font-size:1rem;text-decoration:none;box-shadow:0 8px 22px -10px var(--glow);transition:transform .12s,filter .12s}
.btn:hover{filter:brightness(1.05)}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.65;cursor:progress}
.btn-sec{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 16px;border:2px solid var(--ink);border-radius:var(--rb);background:transparent;color:var(--ink);font-weight:800;font-size:.95rem;text-decoration:none}
.btn-sec:hover{background:var(--ink);color:#fff}
.btn-peq{min-height:44px;padding:8px 18px;font-size:.95rem}
.btn:focus-visible,.btn-sec:focus-visible,button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid var(--c4);outline-offset:2px}

/* ---------- entrada ---------- */
.entrada{background:var(--ink);color:var(--on-ink);min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
.entrada-top{display:flex;justify-content:flex-end;padding:14px 16px 0}
.idiomas{display:inline-flex;border:1px solid rgba(230,237,244,.28);border-radius:999px;padding:3px}
.idiomas button{border:0;background:transparent;color:var(--on-ink);font-weight:800;font-size:.8rem;letter-spacing:.06em;padding:6px 14px;border-radius:999px;min-height:32px}
.idiomas button[aria-pressed="true"]{background:var(--on-ink);color:var(--ink)}
.entrada-cuerpo{flex:1;width:100%;max-width:520px;margin:0 auto;padding:28px 16px 40px;display:flex;flex-direction:column;justify-content:center}
.eyebrow{font-size:.75rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--hi-ink)}
.producto{font-family:var(--fh);font-style:italic;font-weight:700;font-size:1.15rem;color:var(--on-ink);margin:6px 0 18px}
.entrada h1{color:#fff;font-size:clamp(2rem,8.4vw,3rem);letter-spacing:-.01em}
.entrada .lead{margin:14px 0 26px;color:#C9D6E2;font-size:1.05rem}
.entrada label{display:block;font-weight:600;font-size:.9rem;color:var(--on-ink);margin-bottom:8px}
.entrada input{width:100%;min-height:54px;padding:12px 16px;border-radius:var(--rb);border:2px solid #34506A;background:var(--ink2);color:#fff;font:inherit;font-size:1.05rem}
.entrada input::placeholder{color:#7F94A8}
.entrada input:focus{border-color:var(--c3);outline:none}
.entrada .btn{width:100%;margin-top:14px}
.entrada .ayuda{margin-top:12px;font-size:.88rem;color:#9FB1C2}
.aviso-form{margin-top:16px;padding:14px 16px;border-radius:var(--rb);background:#2A2030;border:1px solid #6E3A44;color:#FFD9D2;font-size:.95rem}
.aviso-form p+p{margin-top:8px;padding-top:8px;border-top:1px solid #6E3A44}

/* ---------- biblioteca: cabecera ---------- */
.cabecera{background:var(--ink);color:var(--on-ink)}
.cabecera-in{max-width:960px;margin:0 auto;padding:18px 16px 22px}
.cab-fila{display:flex;justify-content:space-between;align-items:center;gap:12px}
.salir{border:0;background:transparent;color:#C9D6E2;font-weight:600;font-size:.9rem;text-decoration:underline;text-underline-offset:3px;min-height:40px;padding:0 4px}
.cabecera h1{color:#fff;font-size:clamp(1.9rem,7.4vw,2.7rem);margin-top:6px}
.conectado{margin-top:8px;font-size:.9rem;color:#9FB1C2;overflow-wrap:anywhere}
.conectado b{color:var(--on-ink);font-weight:600}
.pestanas{display:inline-flex;margin-top:18px;border:1px solid rgba(230,237,244,.28);border-radius:999px;padding:3px}
.pestanas button{border:0;background:transparent;color:var(--on-ink);font-weight:800;font-size:.9rem;letter-spacing:.06em;padding:8px 22px;border-radius:999px;min-height:40px}
.pestanas button[aria-selected="true"]{background:var(--on-ink);color:var(--ink)}

/* ---------- biblioteca: contenido ---------- */
.contenido{max-width:960px;margin:0 auto;padding:30px 16px 56px}
.seccion+.seccion{margin-top:44px}
.seccion h2{font-size:clamp(1.6rem,6vw,2.1rem)}
.seccion .sub{margin-top:8px;color:var(--t3);max-width:60ch}
.rejilla{display:grid;gap:12px;margin-top:20px;grid-template-columns:1fr}

.card{position:relative;display:grid;grid-template-columns:88px 1fr;gap:14px;align-items:start;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px}
.card .img{position:relative;border-radius:12px;overflow:hidden;background:var(--bg2);aspect-ratio:1}
.card .img img{width:100%;height:100%;object-fit:cover}
.cuerpo{display:flex;flex-direction:column;gap:6px;min-width:0}
.etq{font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--t3)}
.card h3{font-size:1.08rem;overflow-wrap:anywhere}
.card .desc{font-size:.9rem;color:var(--t2)}
.acciones{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:6px}
.estado{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:800;color:var(--val)}
.estado svg{flex:none}
.pendiente{font-size:.88rem;font-weight:600;color:var(--t3)}
.nota{font-size:.85rem;color:var(--t2);background:var(--bg2);border-radius:10px;padding:8px 10px}
.precio{font-family:var(--fh);font-weight:700;font-size:1.25rem;color:var(--t1)}

.card.libro{grid-template-columns:112px 1fr;border-color:var(--ink);border-width:2px}
.card.libro .img{aspect-ratio:3/4;box-shadow:0 12px 24px -14px rgba(18,33,46,.55)}
.card.libro h3{font-size:1.35rem}

.card.upsell{grid-template-columns:104px 1fr}
.card.bloqueado{background:var(--bg2);border-style:dashed}
.card.bloqueado .img img{filter:grayscale(1) contrast(.92);opacity:.5}
.candado{position:absolute;right:6px;bottom:6px;width:30px;height:30px;border-radius:50%;background:var(--ink);display:grid;place-items:center}
.card.bloqueado h3{color:var(--t2)}
.fila-precio{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:6px}

@media (min-width:640px){
  .rejilla.dos{grid-template-columns:1fr 1fr}
  .card{grid-template-columns:104px 1fr}
  .card.libro{grid-template-columns:150px 1fr}
  .card.upsell{grid-template-columns:128px 1fr}
}
@media (min-width:640px){.entrada-cuerpo{padding-top:56px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

.soporte{max-width:760px;margin:40px auto 0;padding:22px 20px 40px;border-top:2px solid var(--line,#e6dfcf);color:var(--t2)}
.soporte .s-titulo{font-family:var(--fh);font-weight:700;font-size:1.1rem;color:var(--t1);margin:0 0 6px}
.soporte .s-texto{margin:0;font-size:.95rem;line-height:1.5}
.soporte a{color:var(--ink);font-weight:800;text-decoration:underline}

/* ---------- móvil: tarjetas más limpias (29-10) ---------- */
body{overflow-x:clip}
@media (max-width:639px){
  .contenido{padding:26px 16px 44px}
  .seccion h2{font-size:1.55rem}
  .rejilla{gap:14px}
  .card{display:grid;grid-template-columns:84px 1fr;column-gap:14px;row-gap:0;padding:14px;border-radius:20px;box-shadow:0 10px 24px -18px rgba(18,33,46,.5)}
  .card .cuerpo{display:contents}
  .card .img{grid-column:1;grid-row:1 / span 3;align-self:start;width:84px}
  .card .etq,.card h3,.card .desc{grid-column:2}
  .card .etq{align-self:end}
  .card h3{margin-top:4px;font-size:1.05rem;line-height:1.2}
  .card .desc{margin-top:6px;font-size:.88rem;line-height:1.45}
  .card .nota,.card .acciones,.card .fila-precio{grid-column:1 / -1}
  .card .nota{margin-top:12px}
  .card .acciones{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
  .card .acciones>.estado{grid-column:1 / -1;justify-content:center;padding:6px 10px;border-radius:999px;background:rgba(31,140,121,.12)}
  .card .acciones>:last-child:nth-child(even){grid-column:1 / -1}
  .card .acciones .btn,.card .acciones .btn-sec{width:100%;min-height:48px;padding:10px 12px}
  .card .acciones .pendiente{grid-column:1 / -1;text-align:center}
  .card .fila-precio{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;margin-top:14px}
  .card .fila-precio .btn{width:100%;min-height:48px}
  .card .fila-precio .precio:only-child{grid-column:1 / -1}

  /* el libro: portada grande arriba, centrada */
  .card.libro{grid-template-columns:1fr;justify-items:center;text-align:center;padding:20px 16px 16px;background:linear-gradient(180deg,#fff 0,#FBF6EC 100%)}
  .card.libro .img{grid-column:1;grid-row:auto;width:min(190px,56%);box-shadow:0 18px 30px -16px rgba(18,33,46,.6)}
  .card.libro .etq,.card.libro h3,.card.libro .desc{grid-column:1}
  .card.libro .etq{margin-top:18px;align-self:auto}
  .card.libro h3{font-size:1.45rem}
  .card.libro .acciones,.card.libro .nota{width:100%}
}

/* ---------- pack completo ---------- */
.card.pack{grid-template-columns:1fr;margin-top:20px;padding:0;overflow:hidden;border:2px solid var(--hi-ink);background:linear-gradient(180deg,#FFF9EC 0,#fff 60%);box-shadow:0 18px 36px -22px rgba(201,64,43,.55)}
.card.pack .img{aspect-ratio:16/10;border-radius:0;background:var(--bg2)}
.card.pack .img img{object-fit:cover}
.card.pack .cuerpo{padding:16px 16px 18px}
.card.pack .etq{color:var(--hi)}
.card.pack h3{font-size:1.35rem}
.pack-valor{margin-top:2px;font-size:.9rem;color:var(--t3)}
.pack-ahorro{font-weight:800;color:var(--val);font-size:.98rem}
.card.pack .fila-precio{margin-top:10px}
.card.pack .precio{font-size:1.6rem}
@media (min-width:640px){
  .card.pack{grid-template-columns:minmax(260px,5fr) 6fr;align-items:stretch}
  .card.pack .img{aspect-ratio:auto;min-height:100%}
  .card.pack .cuerpo{padding:22px 24px;justify-content:center}
}
@media (max-width:639px){
  .card.pack{display:block;padding:0}
  .card.pack .cuerpo{display:flex}
  .card.pack .img{width:100%;grid-row:auto}
  .card.pack .fila-precio{display:grid;grid-template-columns:auto 1fr}
}

.card.pack .etq{align-self:flex-start!important}

/* ---------- inicio con «Mis productos» y carpetas (29-10) ---------- */
.mis-productos,.carpeta>summary{display:flex;align-items:center;gap:14px;width:100%;text-align:left;cursor:pointer;list-style:none}
.carpeta>summary::-webkit-details-marker{display:none}
.mis-productos{padding:18px 18px;border:0;border-bottom:4px solid #0a1620;border-radius:var(--r);background:var(--ink);color:var(--on-ink);box-shadow:0 16px 30px -18px rgba(18,33,46,.8)}
.mis-productos:hover{filter:brightness(1.08)}
.mp-ico{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:var(--c2);color:var(--ink)}
.mp-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mp-txt strong{font-family:var(--fh);font-size:1.3rem;line-height:1.15}
.mp-txt span{font-size:.88rem;color:#B9C8D6}
.mis-productos .flecha{flex:none;color:var(--c2)}
.obten{margin-top:34px}
.volver{border:0;background:transparent;color:var(--t2);font-weight:800;font-size:.95rem;min-height:44px;padding:0;margin-bottom:6px}
.volver:hover{color:var(--t1);text-decoration:underline}
.seccion>.rejilla{margin-bottom:0}
.carpeta{margin-top:18px;border:2px solid var(--line);border-radius:var(--r);background:var(--card);overflow:hidden}
.carpeta[open]{border-color:var(--ink)}
.carpeta>summary{padding:14px 16px;background:var(--bg2)}
.carpeta>summary .mp-ico{width:46px;height:46px;background:var(--ink);color:var(--hi-ink)}
.carpeta>summary .mp-txt strong{color:var(--t1);font-size:1.15rem}
.carpeta>summary .mp-txt span{color:var(--t3)}
.carpeta>summary .flecha{flex:none;color:var(--t3);transition:transform .15s}
.carpeta[open]>summary .flecha{transform:rotate(90deg)}
.carpeta-in{padding:4px 14px 16px;background:var(--bg)}
.carpeta-in .rejilla{margin-top:14px}
.carpeta-in .card.pack{margin-top:16px}
@media (max-width:639px){
  .mis-productos{padding:16px}
  .carpeta-in{padding:2px 12px 14px}
}