/* Páginas para Google (las escribe seo.py al publicar): camiseta, temas. Se apoyan en tienda.css (letras, barra, botón, pie). */
.menu-pag { display:flex; gap:18px; }
.menu-pag a { color:var(--negro); text-decoration:none; font-size:14px; font-weight:500; min-height:44px; display:inline-flex; align-items:center; }
.menu-pag a:hover { text-decoration:underline; text-underline-offset:4px; }
.pag-caja { padding-top:8px; }
.migas { font-size:13px; color:var(--gris); margin:4px 6px 18px; display:flex; flex-wrap:wrap; gap:4px 6px; align-items:center; }
.migas a { color:var(--gris); min-height:32px; display:inline-flex; align-items:center; }
.migas [aria-current] { color:var(--negro); }
.btn.negro { background:var(--negro); color:#fff; }
.btn.negro span { width:36px; height:36px; border-radius:50%; background:#fff; color:var(--negro); display:grid; place-items:center; }
.btn span { display:grid; place-items:center; }

.p-ficha { display:grid; gap:24px; }
.p-foto { background:var(--tarjeta); border-radius:22px; overflow:hidden; }
.p-foto img { width:100%; height:auto; }
.p-datos { padding:0 6px; }
.p-datos h1 { font-size:clamp(30px, 7vw, 46px); font-weight:500; letter-spacing:-.035em; line-height:1.05; margin:0 0 10px; }
.p-datos h2 { font-size:16px; font-weight:600; margin:28px 0 6px; }
.p-datos p, .p-datos li { color:#3a3a3a; }
.p-datos ul { padding-left:18px; margin:6px 0; }
.p-verso { font-size:15px; color:var(--gris); margin:0 0 16px; }
.p-precio { font-size:16px; margin:0 0 2px; }
.p-precio b { font-size:26px; font-weight:600; letter-spacing:-.02em; margin-right:6px; }
.p-sm { color:var(--gris); font-size:14px; margin:0 0 20px; }
.enlace-pag { display:inline-flex; align-items:center; min-height:44px; margin-left:16px; color:var(--negro); font-size:14px; font-weight:500; }
.p-tabla { width:100%; border-collapse:collapse; font-size:14px; }
.p-tabla th, .p-tabla td { text-align:left; padding:10px 8px 10px 0; border-bottom:1px solid var(--linea); }
.p-tabla thead th { font-weight:500; color:var(--gris); font-size:13px; }
.p-tabla small { color:var(--gris); font-weight:400; }

.pag-h1 { font-size:clamp(34px, 9vw, 64px); font-weight:500; letter-spacing:-.045em; line-height:1; margin:0 6px 14px; }
.pag-h2 { font-size:22px; font-weight:500; letter-spacing:-.02em; margin:36px 6px 14px; }
.pag-intro { color:var(--gris); font-size:16px; max-width:62ch; margin:0 6px 26px; }
.pag-sec { margin:44px 6px 0; }
.pag-sec h2 { font-size:22px; font-weight:500; letter-spacing:-.02em; margin:0 0 14px; }
.pag-cta { margin:30px 6px 0; }
.pasos-pag { padding-left:20px; max-width:62ch; }
.pasos-pag li { margin:0 0 10px; }
.rejilla-pag, .colores-pag { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px 10px; }
.t-pag { display:block; color:var(--negro); text-decoration:none; }
.t-pag img, .colores-pag img { width:100%; height:auto; background:var(--tarjeta); border-radius:16px; }
.t-pag b { display:block; font-weight:500; margin:10px 2px 0; }
.t-verso { display:block; color:var(--gris); font-size:13px; margin:0 2px; }
.t-pag .t-precio { display:block; font-size:14px; margin:2px 2px 0; }
.colores-pag span { display:block; font-size:14px; margin:8px 2px 0; }
.pag-sec details { border-bottom:1px solid var(--linea); max-width:72ch; }
.pag-sec summary { cursor:pointer; min-height:48px; display:flex; align-items:center; font-weight:500; }
.pag-sec details p { color:#3a3a3a; margin:0 0 14px; }

@media (min-width:900px) {
  .p-ficha { grid-template-columns:1.1fr 1fr; gap:48px; align-items:start; }
  .p-datos { padding-top:12px; }
  .rejilla-pag, .colores-pag { grid-template-columns:repeat(4, minmax(0, 1fr)); gap:26px 18px; }
}
