/*
Theme Name: Making a Scene Artist Site Starter
Theme URI: https://www.makingascene.org/
Author: Making a Scene
Author URI: https://www.makingascene.org/
Description: A mobile-first block theme for indie artists building an owned music platform: music, shows, merch, newsletter, fan passport, membership, and community funnels.
Version: 0.3.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 7.4
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mas-artist-site
Tags: block-patterns, full-site-editing, music, entertainment, portfolio, e-commerce
*/

html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
a { text-decoration-thickness: 1px; text-underline-offset: .2em; }
.mas-pill { border-radius: 999px; padding: .35rem .75rem; display: inline-block; }
.mas-card { border: 1px solid rgba(255,255,255,.12); border-radius: 24px; padding: clamp(1rem, 2vw, 2rem); }
.mas-grid { display: grid; gap: 1.2rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.mas-sticky-player-placeholder { position: sticky; bottom: 0; z-index: 30; border-top: 1px solid rgba(255,255,255,.15); }


/* AJAX navigation shell for uninterrupted artist-site listening. */
.mas-ajax-navigation-enabled #mas-ajax-content {
  outline: none;
}
.mas-ajax-navigation-enabled.mas-ajax-is-loading #mas-ajax-content,
html.mas-ajax-is-loading #mas-ajax-content {
  opacity: .55;
  transition: opacity .18s ease;
}
#mas-ajax-page-loader {
  position: fixed;
  left: 50%;
  top: .85rem;
  transform: translateX(-50%);
  z-index: 99998;
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .55rem .85rem;
  border-radius: 999px;
  background: rgba(17, 19, 26, .92);
  color: #f1faee;
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 16px 48px rgba(0,0,0,.28);
  font-size: .875rem;
  backdrop-filter: blur(10px);
}
#mas-ajax-page-loader[hidden] { display: none; }
#mas-ajax-page-loader span {
  width: .75rem;
  height: .75rem;
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.25);
  border-top-color: #ffb703;
  animation: mas-ajax-spin .8s linear infinite;
}
@keyframes mas-ajax-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  #mas-ajax-page-loader span { animation: none; }
  .mas-ajax-navigation-enabled.mas-ajax-is-loading #mas-ajax-content,
  html.mas-ajax-is-loading #mas-ajax-content { transition: none; }
}
