/* Only the store shell; leave Spreadshop's internal components to its theme. */
.shop-main { width: min(1440px, calc(100% - 40px)); margin: 0 auto; padding: calc(var(--header-h) + 50px) 0 60px; }
.shop-intro { max-width: 760px; margin: 0 auto 32px; text-align: center; }
.shop-eyebrow { color: var(--accent-gold); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .2em; }
.shop-intro h1 { color: #fff; font-size: clamp(32px, 5vw, 50px); line-height: 1.2; margin: 10px 0 16px; }
.shop-surface { min-width: 0; border: 1px solid var(--line-2); border-radius: var(--r-lg); background: var(--surface-2); }
#shop { min-height: 280px; font-family: "Inter", system-ui, sans-serif; font-size: 16px; line-height: 1.5; }
#shop[data-state="unavailable"], #shop[data-state="loading"], #shop[data-state="error"] { display: grid; place-items: center; padding: 30px; text-align: center; }
.shop-fallback { margin: 20px 0; padding: 20px; border: 1px solid var(--line-2); border-radius: var(--r-md); text-align: center; }
.shop-fallback p { margin-bottom: 15px; }
.shop-button { display: inline-flex; justify-content: center; padding: 12px 24px; border-radius: var(--r-pill); background: var(--accent-gold); color: #06090f; font-weight: 700; }
.shop-button:hover { background: #ffdb75; }
.shop-retry { margin: 10px; padding: 10px; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: transparent; color: #fff; cursor: pointer; font: inherit; }
.shop-note { margin: 20px auto 0; max-width: 760px; text-align: center; font-size: 13px; }
.shop-note a { color: var(--accent-gold); text-decoration: underline; }
.shop-page [aria-current="page"] { color: var(--accent-gold); }
.shop-page [hidden] { display: none !important; }
@media (max-width: 47.999em) {
  .shop-page .header__container { min-height: 56px; padding: 7px; }
  .shop-page .header__left { width: 100%; min-height: 40px; }
  .shop-page .header__left::after {
    content: "";
    position: absolute;
    left: 48px;
    height: 30px;
    border-left: 1px solid rgba(204, 210, 224, .45);
  }
  .shop-page .header__left .header__wordmark {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    padding-left: 0;
    border-left: 0;
  }
  .shop-page .header__right { flex-shrink: 0; }
}
@media (max-width: 479px) {
  .shop-main { width: calc(100% - 24px); padding-top: calc(var(--header-h) + 30px); }
  .shop-intro { margin-bottom: 20px; }
  .shop-surface { border-radius: var(--r-sm); }
}
/* Yield the host's fixed header while Spreadshop owns the mobile overlay.
   Only the Fenómenos header changes; no provider component styles are overridden. */
.shop-page:has(#shop .sprd-burgermenu--open) > .header { visibility: hidden; pointer-events: none; }
/* Visible, crawlable catalog; identical content for visitors and search engines. */
.shop-catalog-jump{display:inline-block;margin-top:16px;color:var(--accent-gold);text-decoration:underline}
.shop-catalog{margin:32px 0 48px}
.shop-collection{display:flex;align-items:center;gap:28px;padding:24px;border:1px solid var(--line-2);border-radius:20px;background:var(--surface-2)}
.shop-collection>img{width:150px;height:150px;object-fit:contain;background:#fff;border-radius:12px;flex-shrink:0}
.shop-collection h2{color:#fff;font-size:clamp(22px,3vw,30px);line-height:1.3;margin:8px 0 12px}
.shop-collection p{max-width:780px;line-height:1.7}
.shop-catalog-note{font-size:13px;color:#acb7cc;line-height:1.7;margin:20px 0}
.shop-product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;list-style:none;padding:0;margin:0}
.shop-product{min-width:0;display:flex;flex-direction:column;padding:16px;border:1px solid var(--line-2);border-radius:16px;background:var(--surface-2)}
.shop-product img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;border-radius:10px;background:white}
.shop-product h3{color:#fff;font:600 17px/1.5 Inter, sans-serif;margin:16px 0 10px}
.shop-product p{font-size:13px;line-height:1.6;margin-bottom:12px;color:#bac3d5}
.shop-product .shop-product-price{font-size:22px;color:var(--accent-gold);font-weight:700;margin-top:auto;margin-bottom:4px}
.shop-product-price span{font-size:12px}
.shop-product .shop-product-stock{font-size:12px}
.shop-product-link{color:var(--accent-gold);font-size:14px;min-height:44px;display:inline-flex;align-items:center}
.shop-product a:focus-visible,.shop-catalog-jump:focus-visible{outline:2px solid var(--accent-gold);outline-offset:4px}
#comprar{scroll-margin-top:100px}
@media(max-width:1100px){.shop-product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.shop-product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.shop-collection{flex-direction:column;align-items:flex-start;padding:20px;gap:16px}.shop-product{padding:12px}.shop-product h3{font-size:15px}}
@media(max-width:380px){.shop-product-grid{grid-template-columns:1fr}}

/* Compact opt-in entry to the interactive shop; native catalog stays visible. */
.shop-explorer{border:1px solid var(--line-2);border-radius:16px;background:var(--surface-2)}
.shop-explorer>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;cursor:pointer;list-style:none;color:var(--accent-gold);font-size:17px;font-weight:600}
.shop-explorer>summary::-webkit-details-marker{display:none}
.shop-explorer>summary small{display:block;margin-top:5px;color:#acb7cc;font-size:13px;font-weight:400}
.shop-explorer>summary:focus-visible{outline:2px solid var(--accent-gold);outline-offset:4px;border-radius:16px}
.shop-explorer-icon{font-size:28px;font-weight:400;transition:transform .2s}
.shop-explorer[open] .shop-explorer-icon{transform:rotate(45deg)}
.shop-explorer-content{padding:0 16px 20px}
@media(max-width:479px){.shop-explorer>summary{padding:16px;font-size:16px}.shop-explorer-content{padding:0 8px 16px}}
.shop-product>a:first-child{color:#fff;text-decoration:none}
.shop-product>a:first-child:hover h3{color:var(--accent-gold)}

.shop-info{padding:24px;margin:28px 0;border:1px solid var(--line-2);border-radius:16px;background:var(--surface-2)}
.shop-info h2{color:#fff;font-size:24px;margin-bottom:12px}
.shop-info h3{font:600 16px/1.4 Inter,sans-serif;color:#fff;margin:0 0 8px}
.shop-info p{font-size:14px;line-height:1.7;color:#bac3d5}
.shop-info a{color:var(--accent-gold)}
.shop-info-links{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:16px;font-size:14px}
@media(max-width:600px){.shop-info{padding:18px}}

 .shop-info .shop-info-brief{font-size:12px;margin:10px 0 18px;color:#acb7cc}
.shop-info-topics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;align-items:start}
.shop-info-topics details{border:1px solid var(--line-2);border-radius:10px;padding:12px 14px}
.shop-info-topics summary{color:var(--accent-gold);cursor:pointer;font-size:14px;font-weight:600}
.shop-info-topics summary:focus-visible{outline:2px solid var(--accent-gold);outline-offset:4px}
.shop-info-topics p{margin:12px 0;font-size:13px}
.shop-info-topics a{font-size:13px}
.shop-info .shop-info-support{font-size:12px;margin-top:16px}
.shop-info-links{margin-top:8px;font-size:12px}
#shop-info-title{scroll-margin-top:110px}
@media(max-width:600px){.shop-info-topics{grid-template-columns:1fr}.shop-info{padding:16px}.shop-info h2{font-size:21px}}
