/* ALQQAMAR — Explore This Deck page styles (PAGE 2).
   Fluid clamp() pass 2026-07-04. Figma 💙 EXPLORE THIS DECK page,
   desktop frame 408:13607 (1440px) / mobile frame 416:14460 (390px).
   Typography standard updated 2026-07-08: buttons/labels → 13px fixed.

   Spacing repass 2026-07-06: full ARB walk of all four frames, ABB-based
   padding derivation.

   Derivation method:
     padding/margin = child_ABB_top − parent_content_top (no leading offset).
   Verified geometry chain:
     Desktop: ed-content(y=173) + deck-title(pt=30) → title ABB y=203 ✓
              deck-title(pb=30) → element bottom=282 = hero frame bottom ✓
              baraja(pt=19) → suit-title ABB y=301 ✓
              suit-title(mb=24) → cards ABB y=345 ✓
     Mobile:  ed-content(y=44) + deck-title(pt=32) → title ABB y=76 ✓
              deck-title(pb=32) → element bottom=132 = hero frame bottom ✓
              baraja(pt=32) → suit-title ABB y=208 ✓
              suit-title(mb=24) → cards ABB y=248 ✓ */

/* ── BOTTOM LINKS ────────────────────────────────────────────────────── */
/* Desktop only — 13px fixed per typography standard 2026-07-08 */
.ed-content .ed-bottom-links a {
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 2px;
  line-height: 15px;
  color: #0b40b4;
}

/* ── BARAJA SIDE PADDING — mobile only ───────────────────────────────── */
@media (max-width: 1439.98px) {
  .ed-content .ed-baraja { padding-left: 16px; padding-right: 16px; }
}

/* ── CARDS GRID ──────────────────────────────────────────────────────── */
.ed-content .ed-cards-grid {
  gap: clamp(8px, calc(8px + (16 - 8) * ((100vw - 390px) / 1050)), 16px);
  max-width: 1040px;
  margin: 0 auto;
}

/* ── CARD ────────────────────────────────────────────────────────────── */
.ed-content .ed-card {
  width: clamp(114px, calc(114px + (116 - 114) * ((100vw - 390px) / 1050)), 116px);
}
@media (min-width: 1440px) {
  .ed-content .ed-card { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12); }
}

/* ── BUY BUTTON ──────────────────────────────────────────────────────── */
/* 13px fixed per typography standard — both breakpoints */
.ed-content .ed-buy-btn {
  width: clamp(208px, calc(208px + (240 - 208) * ((100vw - 390px) / 1050)), 240px);
  height: clamp(40px, calc(44px + (40 - 44) * ((100vw - 390px) / 1050)), 44px);
  line-height: clamp(40px, calc(44px + (40 - 44) * ((100vw - 390px) / 1050)), 44px);
  font-size: 13px;
  letter-spacing: 4px;
}

/* ══════════════════════════════════════════════════════════════════════
   SPACING CORRECTIONS — ABB-based geometry pass 2026-07-06
   ══════════════════════════════════════════════════════════════════════ */

.ed-content .ed-deck-title { padding-top: 30px; padding-bottom: 30px; }

.ed-content .ed-baraja { padding-top: 19px; padding-bottom: 44px; }

.ed-content .ed-suit-title { margin-bottom: 24px !important; }

.ed-content .ed-cta { padding-top: 48px; padding-bottom: 29px; }

/* ── MOBILE OVERRIDES — max-width 1439.98px ─────────────────────────── */
@media (max-width: 1439.98px) {

  .ed-content .ed-deck-title { padding-top: 32px; padding-bottom: 32px; }

  .ed-content .ed-baraja { padding-top: 32px; padding-bottom: 32px; }

  .ed-content .ed-suit-title {
    font-weight: 400 !important;
    line-height: 16px !important;
  }

  .ed-content .ed-bottom-links { display: none; }

  .ed-content .ed-cta { padding-top: 38px; padding-bottom: 38px; }
}

/* ── BUTTON — .btn_filled ─────────────────────────────────────────────
   13px fixed per typography standard 2026-07-08.
   letter-spacing 4px per Figma (deviates from site standard 0.04em).
   ────────────────────────────────────────────────────────────────────── */
.ed-content .btn_filled {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #000;
  color: #fff;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  line-height: 15px;
  font-weight: 500;
  letter-spacing: 4px;
  text-transform: uppercase;
  text-decoration: none;
  height: 40px;
  border: none;
  border-radius: 0;
  cursor: pointer;
  box-sizing: border-box;
}

@media (max-width: 1439.98px) {
  .ed-content .btn_filled {
    height: 44px;
  }
}
