/* ============================================================================
   INK FIRE · tienda
   ========================================================================== */

.page-shop{padding-top:0}

.shop-head{padding:9rem var(--pad) 0;max-width:var(--maxw);margin-inline:auto}
.shop-head .h-display{margin-bottom:1.25rem}
.shop-head__sub{color:rgba(243,238,228,.75);max-width:46ch}

.shop{padding-block:clamp(3rem,6vw,5rem)}
.shop__cat{display:flex;align-items:baseline;gap:1rem;font-family:var(--serif);
  font-size:clamp(1.5rem,1.1rem + 1.2vw,2.25rem);padding-bottom:1.25rem;
  border-bottom:1px solid var(--line);margin-bottom:clamp(1.5rem,3vw,2.5rem)}
.shop__cat .mono{color:var(--champagne)}

/* ── tarjeta de producto ──────────────────────────────────────────────── */
.p-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,2rem)}
.p-card{display:flex;flex-direction:column;gap:.6rem}
.p-card__media{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:var(--r);
  background:var(--ink-2);border:1px solid var(--line)}
.p-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.6,.2,1)}
.p-card:hover .p-card__media img{transform:scale(1.04)}
.p-card__ph{display:grid;place-items:center;height:100%;
  background:radial-gradient(120% 90% at 50% 30%,rgba(235,220,169,.09),transparent 70%)}
.p-card__ph svg{width:34px;fill:rgba(235,220,169,.45)}
.p-card__badge{position:absolute;inset:auto .6rem .6rem auto;background:var(--ink);
  color:var(--cream);padding:.35rem .6rem;border-radius:var(--r)}
.p-card h3{font-family:var(--serif);font-size:1.25rem;margin-top:.4rem}
.p-card__desc{color:rgba(243,238,228,.65);font-size:.875rem;margin:0}
.p-card__foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:auto;padding-top:.5rem}
.p-card__price{font-family:var(--serif);font-size:1.5rem;color:var(--champagne)}
.p-card__opt{display:flex;flex-direction:column;gap:.25rem;text-align:right}
.p-card__opt select{min-width:4.5rem;font:inherit;font-size:.875rem;color:var(--cream);background:transparent;
  border:0;border-bottom:1px solid var(--line);padding:.3rem 0;-webkit-appearance:none;appearance:none;text-align:right}
.p-card__opt select option{background:var(--ink-2)}
.p-card__add{width:100%;padding-block:.85rem}
.p-card.is-out{opacity:.5}
.p-card.is-out .p-card__add{cursor:not-allowed}

/* ── info ─────────────────────────────────────────────────────────────── */
.shop-info{border-top:1px solid var(--line)}
.shop-info__list{list-style:none;margin:2rem 0;padding:0;display:grid;
  grid-template-columns:repeat(3,1fr);gap:2rem;max-width:none}
.shop-info__list li{color:rgba(243,238,228,.7);border-top:1px solid var(--line);padding-top:1.25rem;font-size:.9375rem}

/* ── botón del carrito en la nav ──────────────────────────────────────── */
.cart-btn{position:relative;background:none;border:0;padding:.25rem;cursor:pointer;line-height:0}
.cart-btn svg{width:20px;height:20px;fill:var(--cream)}
.cart-btn__n{position:absolute;top:-4px;right:-6px;min-width:17px;height:17px;
  display:grid;place-items:center;background:var(--champagne);color:var(--ink);
  border-radius:999px;font-size:.625rem;letter-spacing:0}

/* ── panel del carrito ────────────────────────────────────────────────── */
.cart-scrim{position:fixed;inset:0;z-index:70;background:rgba(10,9,7,.6);
  opacity:0;pointer-events:none;transition:opacity .35s}
body.cart-open .cart-scrim{opacity:1;pointer-events:auto}
.cart{
  position:fixed;top:0;right:0;bottom:0;z-index:71;width:min(420px,100%);
  display:flex;flex-direction:column;background:var(--ink-2);
  border-left:1px solid var(--line);transform:translateX(100%);
  transition:transform .45s cubic-bezier(.2,.6,.2,1);
}
body.cart-open .cart{transform:none}
.cart__head{display:flex;align-items:center;justify-content:space-between;
  padding:1.5rem var(--pad);border-bottom:1px solid var(--line)}
.cart__head h2{color:var(--cream)}
.cart__close{background:none;border:0;color:var(--cream);font-size:1.75rem;line-height:1;cursor:pointer;padding:0 .25rem}
.cart__lines{list-style:none;margin:0;padding:1rem var(--pad);overflow-y:auto;flex:1}
.c-line{display:grid;grid-template-columns:1fr auto auto;gap:1rem;align-items:center;
  padding:1rem 0;border-bottom:1px solid var(--line)}
.c-line__name{margin:0;font-size:.9375rem}
.c-line__opt,.c-line__price{margin:.2rem 0 0;color:var(--muted)}
.c-line__qty{display:flex;align-items:center;gap:.6rem}
.c-line__qty button{width:26px;height:26px;border:1px solid var(--line);background:none;
  color:var(--cream);border-radius:50%;cursor:pointer;line-height:1;transition:border-color .3s}
.c-line__qty button:hover{border-color:var(--champagne)}
.c-line__del{background:none;border:0;color:var(--muted);font-size:1.25rem;cursor:pointer;transition:color .3s}
.c-line__del:hover{color:#e0876f}
.c-empty{color:var(--muted);padding:2rem 0;text-align:center}
.cart__foot{padding:1.25rem var(--pad) 1.75rem;border-top:1px solid var(--line)}
.cart__ship{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.25rem}
.cart__ship select{font:inherit;font-size:.9375rem;color:var(--cream);background:transparent;
  border:0;border-bottom:1px solid var(--line);padding:.5rem 0;-webkit-appearance:none;appearance:none}
.cart__ship select option{background:var(--ink-2)}
.cart__totals{display:grid;grid-template-columns:1fr auto;gap:.4rem 1rem;margin:0 0 1.25rem}
.cart__totals dd{margin:0;text-align:right;font-size:.9375rem}
.cart__grand{font-family:var(--serif);font-size:1.375rem!important;color:var(--champagne);letter-spacing:0}
.cart__pay,.cart__send{width:100%;margin-bottom:.6rem}
.cart__send:disabled,.cart__pay:disabled{opacity:.4;cursor:not-allowed}
.cart__msg{margin:.4rem 0 0;color:var(--champagne)}
.cart__note{margin:.9rem 0 0;font-size:.8125rem;color:var(--muted);line-height:1.5}

/* ── banda de tienda en la landing ────────────────────────────────────── */
.shop-teaser{border-block:1px solid var(--line);background:var(--ink-2)}
.shop-teaser__grid{display:flex;align-items:center;justify-content:space-between;
  gap:2rem;flex-wrap:wrap}
.shop-teaser .h-display{max-width:18ch}

@media (max-width:1024px){
  .p-grid{grid-template-columns:repeat(3,1fr)}
  .shop-info__list{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .p-grid{grid-template-columns:1fr 1fr}
  .shop-info__list{grid-template-columns:1fr}
  .shop-head{padding-top:7rem}
  .cart{width:100%}
  .p-card__foot{flex-direction:column;align-items:flex-start;gap:.5rem}
  .p-card__opt{text-align:left;width:100%}
  .p-card__opt select{text-align:left}
}