/* Mobile archive alignment: visual hierarchy inspired by the approved catalog direction; not a commerce checkout. */
.zf-catalog-mobile-hero,
.zf-catalog-mobile-filters,
.zf-catalog-mobile-summary,
.zf-mobile-inquiry-bar { display: none; }
.zf-catalog-pagination { margin-top: 36px; }

@media (max-width: 760px) {
  body.zf-site { padding-bottom: calc(86px + env(safe-area-inset-bottom)); }
  .zf-site-notice { display: none; }
  .zf-header { position: sticky; top: 0; }
  .zf-header-inner { width: min(100% - 16px, 650px); min-height: 66px; gap: 3px; }
  .zf-menu-toggle { flex: 0 0 44px; width: 44px; height: 44px; font-size: 24px; }
  .zf-brand { flex: 0 1 auto; gap: 5px; overflow: hidden; color: #244f70; }
  .zf-brand-mark { width: 28px; height: 28px; flex: 0 0 28px; border-color: #244f70; color: #244f70; background: #f8fbfa; font-size: 15px; }
  .zf-brand-name { font-size: clamp(18px, 5vw, 22px); letter-spacing: .09em; white-space: nowrap; }
  .zf-header-tools { flex: 1 0 auto; justify-content: flex-end; gap: 0; }
  .zf-header-tools .zf-control { display: inline-flex; min-height: 33px; padding: 0 4px; font-size: 10px; }
  .zf-header-tools .zf-control:nth-child(1) { width: 43px; }
  .zf-header-tools .zf-control:nth-child(2) { width: 72px; overflow: hidden; border: 1px solid rgba(49,95,127,.42); border-radius: 3px; color: #244f70; }
  .zf-icon-link { min-width: 27px; padding: 0 3px; font-size: 20px; }
  .zf-icon-link small { display: none; }
  .zf-header-tools .zf-icon-link:last-child { display: none; }
  .zf-nav { top: 66px; }

  .zf-catalog-desktop-hero { display: none; }
  .zf-catalog-mobile-hero { position: relative; display: block; min-height: 184px; overflow: hidden; border-bottom: 1px solid #dde5e5; background: linear-gradient(180deg, #f7f4ed 0%, #f8f8f5 100%); }
  .zf-catalog-mobile-hero::before { position: absolute; top: 18px; left: -30px; width: 172px; height: 100px; content: ""; opacity: .54; background: radial-gradient(ellipse at 30% 62%, rgba(153,175,183,.38) 0 16%, transparent 17%), radial-gradient(ellipse at 57% 51%, rgba(153,175,183,.25) 0 18%, transparent 19%), radial-gradient(ellipse at 82% 67%, rgba(153,175,183,.25) 0 16%, transparent 17%); filter: blur(2px); }
  .zf-catalog-mobile-hero::after { position: absolute; right: -33px; bottom: -13px; width: 255px; height: 130px; content: ""; opacity: .52; background: linear-gradient(147deg, transparent 0 39%, rgba(126,150,159,.18) 40% 42%, transparent 43% 54%, rgba(126,150,159,.19) 55% 57%, transparent 58% 68%, rgba(126,150,159,.12) 69% 71%, transparent 72%), radial-gradient(ellipse at 58% 72%, rgba(137,158,165,.14) 0 39%, transparent 40%); }
  .zf-catalog-mobile-ink { position: absolute; inset: 0; opacity: .3; background-image: repeating-linear-gradient(169deg, transparent 0 15px, rgba(63,89,102,.035) 16px 17px, transparent 18px 31px); }
  .zf-catalog-mobile-hero-inner { position: relative; z-index: 1; display: flex; min-height: 184px; flex-direction: column; align-items: center; justify-content: center; padding: 22px 0; text-align: center; }
  .zf-catalog-mobile-eyebrow { margin: 0 0 6px; color: #687e84; font-size: 10px; letter-spacing: .17em; }
  .zf-catalog-mobile-hero h1 { margin: 0; color: #244f70; font-family: var(--zf-serif); font-size: clamp(35px, 10vw, 44px); font-weight: 700; letter-spacing: .18em; line-height: 1.22; }
  .zf-catalog-mobile-hero h1 + p { margin: 8px 0 0; color: #35586e; font-family: var(--zf-serif); font-size: 16px; letter-spacing: .16em; }
  .zf-catalog-section { padding: 0 0 24px; }
  .zf-catalog-layout { display: block; padding-top: 0; }
  .zf-catalog-layout > .zf-filter { display: none; }
  .zf-catalog-results { min-width: 0; }
  .zf-catalog-mobile-filters { display: grid; gap: 9px; padding: 15px 0 10px; }
  .zf-filter-scroll { display: flex; gap: 9px; overflow-x: auto; padding: 0 2px 4px; scrollbar-width: none; }
  .zf-filter-scroll::-webkit-scrollbar { display: none; }
  .zf-filter-scroll a { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; min-height: 39px; padding: 0 14px; border: 1px solid rgba(49,95,127,.45); border-radius: 999px; color: #315f7f; background: rgba(255,255,255,.48); font-family: var(--zf-serif); font-size: 14px; letter-spacing: .06em; white-space: nowrap; }
  .zf-filter-scroll a span { margin-right: 5px; font-family: var(--zf-serif); font-size: 15px; }
  .zf-filter-scroll a.active { border-color: #315f7f; color: #fff; background: linear-gradient(135deg, #2f6080, #264c68); box-shadow: 0 4px 10px rgba(49,95,127,.18); }
  .zf-filter-tiers a { min-height: 34px; padding: 0 17px; color: #3d4f5b; border-color: rgba(93,73,47,.24); background: #fbfaf6; }
  .zf-filter-tiers a.active { border-color: #315f7f; color: #fff; background: #315f7f; }
  .zf-catalog-mobile-summary { display: flex; align-items: center; justify-content: space-between; margin: 6px 0 10px; padding-top: 9px; border-top: 1px solid rgba(93,73,47,.14); }
  .zf-catalog-mobile-summary p { margin: 0; color: #234b67; font-family: var(--zf-serif); font-size: 20px; font-weight: 700; letter-spacing: .1em; }
  .zf-catalog-mobile-summary span { color: var(--zf-muted); font-size: 11px; }
  .zf-catalog-artifact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
  .zf-catalog-artifact-grid .zf-artifact-card { min-height: 229px; border: 1px solid #89a7ba; border-radius: 2px; background: #fbfaf6; box-shadow: 0 4px 12px rgba(49,95,127,.08); }
  .zf-catalog-artifact-grid .zf-artifact-card::before { top: 5px; left: 5px; width: 13px; height: 13px; border-color: #5c8ca8; }
  .zf-catalog-artifact-grid .zf-artifact-card::after { position: absolute; z-index: 3; right: 5px; bottom: 5px; width: 12px; height: 12px; content: ""; border-right: 1px solid #5c8ca8; border-bottom: 1px solid #5c8ca8; pointer-events: none; }
  .zf-catalog-artifact-grid .zf-artifact-card.zf-tier-premium { border-color: #c49c46; background: #fffdf8; box-shadow: 0 4px 13px rgba(184,149,77,.15); }
  .zf-catalog-artifact-grid .zf-artifact-card.zf-tier-limited { border: 1px solid #c8a344; border-image: none; background: linear-gradient(135deg, #fffefb, #fff8de); box-shadow: 0 5px 14px rgba(196,156,70,.16); }
  .zf-catalog-artifact-grid .zf-artifact-image { height: 128px; color: #315f7f; background: linear-gradient(145deg, #eef2f1 0%, #faf8f0 55%, #dde7ea 100%); }
  .zf-catalog-artifact-grid .zf-artifact-image::before { position: absolute; inset: 0; content: ""; opacity: .63; background: radial-gradient(ellipse at 20% 83%, rgba(139,164,174,.26) 0 24%, transparent 25%), radial-gradient(ellipse at 75% 72%, rgba(139,164,174,.18) 0 30%, transparent 31%), linear-gradient(152deg, transparent 0 43%, rgba(120,149,162,.17) 44% 46%, transparent 47% 62%, rgba(120,149,162,.11) 63% 65%, transparent 66%); }
  .zf-catalog-artifact-grid .zf-artifact-card.zf-tier-premium .zf-artifact-image { color: #f7e6b5; background: radial-gradient(circle at 75% 30%, rgba(223,186,91,.16), transparent 28%), linear-gradient(135deg, #0e645e, #063f3b); }
  .zf-catalog-artifact-grid .zf-artifact-card.zf-tier-limited .zf-artifact-image { color: #315f7f; background: linear-gradient(145deg, #f4edcf, #f9faf6 57%, #dae6ea); }
  .zf-catalog-artifact-grid .zf-artifact-image .zf-symbol { position: relative; z-index: 1; font-size: 72px; text-shadow: 1px 2px 0 rgba(255,255,255,.5); }
  .zf-catalog-artifact-grid .zf-artifact-image .zf-family-text { right: 8px; bottom: 8px; z-index: 1; display: block; color: currentColor; font-size: 10px; opacity: .55; }
  .zf-catalog-artifact-grid .zf-artifact-body { padding: 10px 12px 11px; }
  .zf-catalog-artifact-grid .zf-badges { position: absolute; z-index: 5; top: 7px; right: 7px; min-height: 0; }
  .zf-catalog-artifact-grid .zf-badge { min-height: 20px; padding: 2px 7px; border-radius: 2px 2px 2px 8px; color: #315f7f; background: rgba(248,248,244,.91); font-size: 9px; box-shadow: 0 1px 3px rgba(0,0,0,.1); }
  .zf-catalog-artifact-grid .zf-badge-premium { color: #fff; background: #087267; }
  .zf-catalog-artifact-grid .zf-badge-limited { color: #5b4619; background: #e3bd62; }
  .zf-catalog-artifact-grid .zf-artifact-card h3 { margin: 0 0 3px; color: #294f6a; font-size: 19px; line-height: 1.28; letter-spacing: .07em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .zf-catalog-artifact-grid .zf-artifact-number { margin: 0; color: #5f737e; font-size: 10px; letter-spacing: .08em; }
  .zf-catalog-artifact-grid .zf-artifact-meta { margin-top: 6px; padding-top: 6px; border-top: 0; }
  .zf-catalog-artifact-grid .zf-artifact-meta span { display: none; }
  .zf-catalog-artifact-grid .zf-artifact-meta a { display: flex; align-items: center; gap: 3px; margin-left: auto; color: #315f7f; font-size: 11px; }
  .zf-catalog-artifact-grid .zf-artifact-meta a::after { display: inline-grid; place-items: center; width: 17px; height: 17px; margin-left: 2px; border-radius: 50%; color: #fff; background: #315f7f; content: "→"; font-size: 10px; }
  .zf-catalog-pagination { margin-top: 23px; text-align: center; }
  .zf-catalog-pagination .page-numbers { display: inline-block; margin: 0 3px; padding: 6px 9px; border: 1px solid var(--zf-sand); font-size: 12px; }
  .zf-mobile-inquiry-bar { position: fixed; z-index: 30; right: 0; bottom: 0; left: 0; display: flex; align-items: center; justify-content: space-between; min-height: 68px; padding: 9px max(16px, calc((100% - 650px) / 2)); border-top: 1px solid rgba(226,202,142,.48); color: #f8f0dc; background: linear-gradient(105deg, #1e4866, #295979); box-shadow: 0 -8px 22px rgba(38,61,75,.16); }
  .zf-mobile-inquiry-bar > div { display: flex; align-items: center; gap: 7px; }
  .zf-mobile-inquiry-bar > div > span { display: inline-grid; place-items: center; width: 25px; height: 25px; border: 1px solid currentColor; border-radius: 50%; font-size: 14px; }
  .zf-mobile-inquiry-bar strong { font-family: var(--zf-serif); font-size: 16px; letter-spacing: .08em; }
  .zf-mobile-inquiry-bar small { display: block; padding-left: 8px; border-left: 1px solid rgba(248,240,220,.4); color: rgba(248,240,220,.78); font-size: 10px; }
  .zf-mobile-inquiry-bar a { display: inline-flex; align-items: center; justify-content: center; min-height: 43px; padding: 0 15px; border-radius: 999px; color: #59431a; background: linear-gradient(135deg, #eed38f, #f5c64f); font-family: var(--zf-serif); font-size: 14px; font-weight: 700; letter-spacing: .06em; }
  .zf-mobile-inquiry-bar a span { margin-left: 4px; }
  .zf-footer { margin-bottom: 0; }
}

@media (max-width: 360px) {
  .zf-header-tools .zf-control:nth-child(2) { display: none; }
  .zf-header-tools .zf-control:nth-child(1) { width: 42px; }
  .zf-brand-name { font-size: 18px; }
  .zf-catalog-artifact-grid .zf-artifact-card { min-height: 218px; }
  .zf-catalog-artifact-grid .zf-artifact-image { height: 116px; }
  .zf-mobile-inquiry-bar strong { font-size: 14px; }
  .zf-mobile-inquiry-bar a { padding: 0 12px; font-size: 13px; }
}
