/* Kanak Bullion — shared Assayer's Ledger theme for the imported site pages. */
:root {
  --bg: #f7f7f5;
  --bg-soft: #fffefa;
  --panel: #ffffff;
  --panel-solid: #ffffff;
  --border: #c7b878;
  --border-strong: #171713;
  --text: #080908;
  --muted: #625d4f;
  --accent: #f5c936;
  --accent-strong: #ffe784;
  --accent2: #d6d6d6;
  --accent3: #c8920d;
  --up: #0b9b5c;
  --down: #d9273e;
  --warn: #9b6e00;
  --radius: 14px;
  --radius-sm: 10px;
  --font-ui: Arial, Helvetica, sans-serif;
  --font-mono: Arial, Helvetica, sans-serif;
  --sidebar-w: 300px;
  --topbar-h: 88px;
}

html { background: #171712; }

body {
  color: var(--text);
  background: #171712;
}

body::selection { color: #080908; background: #ffe784; }

.aurora-field {
  background:
    radial-gradient(circle at 48% -10%, rgba(245, 201, 54, .18), transparent 34rem),
    #171712;
}

.aurora-blob,
.aurora-grid { display: none; }

.app-shell { background: var(--bg); }

.app-sidebar {
  border-right: 2px solid #c8920d;
  color: #fffefa;
  background:
    radial-gradient(circle at 50% 0, rgba(245, 201, 54, .17), transparent 260px),
    linear-gradient(180deg, #080908, #020302 78%);
  box-shadow: 14px 0 30px rgba(0, 0, 0, .2);
  backdrop-filter: none;
}

.sidebar-brand,
.app-sidebar .sidebar-brand {
  min-height: 148px;
  padding: 22px 20px;
  border-bottom: 2px solid #9a710b;
}

.kanak-brand-lockup {
  display: grid;
  grid-template-columns: 96px 1fr;
  align-items: center;
  gap: 14px;
  width: 100%;
  color: #f7d567;
  text-decoration: none;
}

.kanak-brand-lockup img {
  width: 96px;
  height: 84px;
  border-radius: 12px;
  object-fit: cover;
}

.kanak-brand-lockup strong {
  display: block;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 32px;
  line-height: .95;
  letter-spacing: .035em;
}

.kanak-brand-lockup small {
  display: block;
  margin-top: 8px;
  color: #fff9e8;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.app-sidebar .ma-navigation { padding: 12px 10px; }
.app-sidebar .ma-menu {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

.app-sidebar .ma-menu > li {
  display: block;
  width: 100%;
  margin: 0 0 3px;
  list-style: none;
}

.ma-menu-link,
.ma-menu-trigger {
  display: flex;
  width: 100%;
  min-height: 45px;
  align-items: center;
  justify-content: space-between;
  padding: 11px 14px;
  border-radius: 9px;
  color: #e9e4d5;
  text-align: left;
  font-size: 13px;
  font-weight: 800;
}

.ma-menu-link:hover,
.ma-menu-trigger:hover,
.ma-menu-trigger.is-current {
  color: #ffe784;
  background: rgba(245, 201, 54, .1);
  box-shadow: none;
}

.ma-menu-trigger[aria-expanded="true"] {
  color: #ffe784;
  background: rgba(245, 201, 54, .1);
  box-shadow: inset 3px 0 #c8920d;
}

.ma-menu-link[aria-current=page] {
  color: #080908;
  background: linear-gradient(180deg, #ffe784, #e6b824);
  box-shadow: 0 5px 12px rgba(0, 0, 0, .25);
}

.ma-menu-link:focus-visible,
.ma-menu-trigger:focus-visible {
  outline: 3px solid #fff;
  outline-offset: -3px;
}

.ma-chevron { border-color: currentColor; }

.ma-submenu {
  position: static;
  min-width: 0;
  margin: 2px 0 7px;
  padding: 3px 0 3px 12px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.ma-submenu .ma-menu-link { min-height: 39px; color: #cfc7b1; font-size: 12px; }
.ma-submenu .ma-menu-link:hover { color: #ffe784; background: rgba(245, 201, 54, .1); }
.ma-submenu .ma-menu-link[aria-current=page] { color: #080908; background: #f5c936; }

.ma-menu-account .ma-menu-link {
  color: #080908;
  background: #f5c936;
}

.app-sidebar .ma-menu-account { margin: 12px 0 4px; }

.ma-menu-account .ma-menu-link:hover { color: #080908; background: #ffe784; }

.sidebar-foot {
  padding: 17px 19px;
  border-top: 1px solid #7d5d12;
  color: #d7cfb8;
  font-size: 11px;
}

.sidebar-foot b { color: #ffe784; }
.sidebar-scrim { background: rgba(0, 0, 0, .72); }

/* Font Awesome animated side-nav glyphs */
.ma-menu-link,
.sidebar-link {
  gap: 10px;
}

.ma-menu-link { justify-content: flex-start; }
.ma-menu-trigger { justify-content: space-between; }

.sidebar-link .glyph.fas,
.sidebar-link .glyph.far,
.sidebar-link .glyph.fab,
.ma-menu-link .glyph.fas,
.ma-menu-link .glyph.far,
.ma-menu-link .glyph.fab {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  border: 1px solid rgba(245, 201, 54, .35);
  border-radius: 8px;
  background: rgba(245, 201, 54, .1);
  color: var(--gold);
  font-size: 14px;
  transition: transform .25s ease, color .25s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.sidebar-link:hover .glyph.fas,
.sidebar-link:hover .glyph.far,
.sidebar-link:hover .glyph.fab,
.ma-menu-link:hover .glyph.fas,
.ma-menu-link:hover .glyph.far,
.ma-menu-link:hover .glyph.fab {
  transform: scale(1.2) rotate(-8deg);
  color: var(--gold-pale);
  background: rgba(245, 201, 54, .2);
  border-color: rgba(245, 201, 54, .7);
  box-shadow: 0 0 14px rgba(245, 201, 54, .3);
}

.sidebar-link.active .glyph.fas,
.sidebar-link.active .glyph.far,
.sidebar-link.active .glyph.fab,
.ma-menu-link[aria-current=page] .glyph.fas,
.ma-menu-link[aria-current=page] .glyph.far,
.ma-menu-link[aria-current=page] .glyph.fab {
  color: #171306;
  background: linear-gradient(145deg, var(--gold), var(--gold-deep));
  border-color: var(--gold);
  box-shadow: 0 0 16px rgba(245, 201, 54, .45);
}

.ma-menu-account .ma-menu-link .glyph.fas,
.ma-menu-account .ma-menu-link .glyph.far,
.ma-menu-account .ma-menu-link .glyph.fab {
  color: #080908;
  background: rgba(8, 9, 8, .14);
  border-color: rgba(8, 9, 8, .45);
}

.ma-menu-account .ma-menu-link:hover .glyph.fas,
.ma-menu-account .ma-menu-link:hover .glyph.far,
.ma-menu-account .ma-menu-link:hover .glyph.fab {
  color: #080908;
  background: rgba(8, 9, 8, .24);
  border-color: rgba(8, 9, 8, .7);
  box-shadow: none;
}

.fa-beat-fade { animation: faBeatFade 2.2s ease-in-out infinite; }
.fa-beat { animation: faBeat 1.6s ease-in-out infinite; }
.fa-bounce { animation: faBounce 2s ease-in-out infinite; }
.fa-fade { animation: faFade 2.4s ease-in-out infinite; }
.fa-flip { animation: faFlip 2.4s ease-in-out infinite; }
.fa-shake { animation: faShake 2s ease-in-out infinite; }
.fa-spin { animation: faSpin 2.6s linear infinite; }
.fa-spin-pulse { animation: faSpinPulse 1.4s ease-in-out infinite; }
.fa-roll { animation: faRoll 2.4s linear infinite; }

@keyframes faBeat {
  0%, 90%, 100% { transform: scale(1); }
  45% { transform: scale(1.25); }
}
@keyframes faBounce {
  0%, 100% { transform: translateY(0); }
  30% { transform: translateY(-7px); }
  55% { transform: translateY(0); }
  75% { transform: translateY(-3px); }
}
@keyframes faFade {
  0%, 100% { opacity: 1; }
  50% { opacity: .35; }
}
@keyframes faBeatFade {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .4; transform: scale(1.12); }
}
@keyframes faFlip {
  0%, 70%, 100% { transform: rotateY(0); }
  35% { transform: rotateY(360deg); }
}
@keyframes faShake {
  0%, 100% { transform: rotate(0); }
  20% { transform: rotate(-12deg); }
  40% { transform: rotate(10deg); }
  60% { transform: rotate(-8deg); }
  80% { transform: rotate(6deg); }
}
@keyframes faSpin {
  0% { transform: rotate(0); }
  100% { transform: rotate(360deg); }
}
@keyframes faSpinPulse {
  0% { transform: rotate(0) scale(1); }
  50% { transform: rotate(180deg) scale(.75); }
  100% { transform: rotate(360deg) scale(1); }
}
@keyframes faRoll {
  0% { transform: rotate(0) translateX(0); }
  50% { transform: rotate(180deg) translateX(6px); }
  100% { transform: rotate(360deg) translateX(0); }
}

.app-main { background: var(--bg); }

.app-topbar {
  height: var(--topbar-h);
  border-bottom: 2px solid #c8920d;
  color: #fffefa;
  background: rgba(4, 5, 4, .98);
  box-shadow: 0 8px 20px rgba(0, 0, 0, .16);
  backdrop-filter: none;
}

.topbar-toggle {
  border: 2px solid #c8920d;
  color: #ffe784;
  background: #11120f;
}

.topbar-toggle span,
.topbar-toggle span::before,
.topbar-toggle span::after { background: #ffe784; }

.kanak-mobile-brand {
  display: block;
  width: 52px;
  height: 52px;
  border-radius: 9px;
  object-fit: cover;
}

.ticker-chip { color: #d9d3c3; font-size: 15px; gap: 10px; }
.ticker-chip .sym,
.ticker-chip .px { color: #fffefa; }
.ticker-chip .dir-up { color: #17d884; }
.ticker-chip .dir-down { color: #ff3d52; }

.pill-btn {
  border: 1px solid #d3aa2c;
  color: #fffefa;
  background: #11120f;
}

.pill-btn:hover { color: #080908; border-color: #ffe784; background: #ffe784; }
.pill-btn.accent { color: #080908; background: linear-gradient(180deg, #ffe784, #dfa90c); }

.app-content {
  max-width: 1120px;
  padding: 0px 34px 24px;
}

.feed-status {
  margin-bottom: 24px;
  border: 1px solid #bd9220;
  color: #4a3600;
  background: #fff0a9;
}

.feed-status.feed-error {
  border-color: #b91f35;
  color: #8a1022;
  background: #ffe6e9;
}

.page-head {
  align-items: flex-end;
  margin: 10px 0 28px;
}

.page-head h1 {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(32px, 4vw, 49px);
  line-height: 1;
  letter-spacing: -.025em;
}

.page-head p { max-width: 58ch; color: #625d4f; font-size: 14px; line-height: 1.55; }

.page-head--centered {
  justify-content: center;
  text-align: center;
}

.page-head--centered > div {
  flex: 1 1 100%;
  min-width: 0;
}

.page-head--centered p {
  margin-right: auto;
  margin-left: auto;
}

.eyebrow { display: none !important; }

.glass {
  border: 2px solid #151510;
  color: #080908;
  background: #fff;
  box-shadow: 0 9px 22px rgba(0, 0, 0, .11);
  backdrop-filter: none;
}

.tilt { transform: none !important; transition: box-shadow .18s ease; }
.tilt:hover { box-shadow: 0 13px 28px rgba(0, 0, 0, .16); }
.panel-pad { padding: 24px 26px; }
.panel-title { font-size: 17px; }
.panel-title .dot { background: #c8920d; box-shadow: none; }

.demo-banner,
.verify-note {
  border: 1px solid #b7880b;
  color: #473400;
  background: #fff0a9;
}

.segmented {
  border: 1px solid #8c6c19;
  background: #fff8dc;
}

.segmented button { color: #514b3b; }
.segmented button.active { color: #080908; background: linear-gradient(180deg, #ffe784, #dfab14); box-shadow: none; }

.btn {
  min-height: 44px;
  border: 1px solid #171713;
  border-radius: 10px;
  color: #080908;
  background: #fffefa;
  box-shadow: 0 4px 10px rgba(0, 0, 0, .09);
}

.btn:hover { background: #fff5bd; box-shadow: 0 6px 13px rgba(0, 0, 0, .13); }
.btn:focus-visible { outline: 3px solid #080908; outline-offset: 3px; }
.btn.primary,
.btn.buy { color: #080908; border-color: #b48400; background: linear-gradient(180deg, #ffe784, #dfa90c); box-shadow: 0 6px 14px rgba(0, 0, 0, .14); }
.btn.sell { color: #fff; border-color: #9f1327; background: #c6233b; box-shadow: 0 6px 14px rgba(0, 0, 0, .14); }
.btn.ghost { background: #fff; }

.field span { color: #4f4a3d; }

.field input,
.field select,
.field textarea {
  border: 1px solid #7f7865;
  color: #080908;
  background: #fffefa;
}

.field input::placeholder,
.field textarea::placeholder { color: #6c6658; }

.field input:focus,
.field select:focus,
.field textarea:focus {
  border-color: #080908;
  outline: 3px solid #f5c936;
  outline-offset: 1px;
}

.readout {
  border: 1px solid #a59a73;
  color: #080908;
  background: #fff8dc;
}

.readout .lbl { color: #625d4f; }

.table-wrap { border-radius: 12px; }
.data-table { border-collapse: separate; border-spacing: 0; }
.data-table th {
  border-bottom: 2px solid #080908;
  color: #080908;
  background: linear-gradient(180deg, #dcae16, #ffea3e 50%, #dba70e);
}
.data-table td { border-bottom: 1px solid #bab29d; color: #080908; background: #fff; }
.data-table tr:hover td { background: #fff7d4; }
.data-table tr.row-buy td { color: #086e42; }
.data-table tr.row-sell td { color: #b01930; }
.empty-state { color: #625d4f; }

/* ---------------------------------------------------------------------- */
/* Orders & Trades tables — Kanak gold ledger (keeps header inside the box)*/
/* ---------------------------------------------------------------------- */
.table-scroll {
  overflow-x: auto;
  width: 100%;
  -webkit-overflow-scrolling: touch;
  border: 1px solid #151510;
  border-radius: 12px;
  background: #fff;
}

.orders-table {
  min-width: 1160px;
  table-layout: fixed;
}

.trades-table {
  min-width: 780px;
}

.orders-table thead th,
.trades-table thead th {
  height: 48px;
  padding: 8px 12px;
  border-bottom: 2px solid #080908;
  color: #080908;
  background: linear-gradient(180deg, #dcae16 0%, #ffea3e 48%, #dba70e 100%);
  font-size: 11px;
  letter-spacing: .06em;
  white-space: nowrap;
}

.orders-table thead th:first-child,
.trades-table thead th:first-child {
  border-radius: 10px 0 0 10px;
  text-align: left;
}

.orders-table thead th:last-child,
.trades-table thead th:last-child {
  border-radius: 0 10px 10px 0;
}

.orders-table thead th:last-child {
  position: sticky;
  right: 0;
  z-index: 5;
  border-left: 2px solid #c8920d;
  background: linear-gradient(180deg, #ffe784 0%, #f4cf3b 48%, #c8920d 100%);
  text-align: right;
}

.orders-table tbody th,
.orders-table tbody td,
.trades-table tbody th,
.trades-table tbody td {
  height: 62px;
  padding: 8px 12px;
  border-top: 2px solid #111;
  border-bottom: 2px solid #111;
  color: #080908;
  background: #fff;
  text-align: center;
  text-transform: none;
  letter-spacing: 0;
  font-size: 13.5px;
  font-weight: 700;
}

.orders-table tbody th:first-child,
.trades-table tbody th:first-child {
  border-left: 2px solid #111;
  border-radius: 10px 0 0 10px;
  text-align: left;
  font-size: 15px;
  font-weight: 800;
}

.orders-table tbody td:last-child,
.trades-table tbody td:last-child {
  border-right: 2px solid #111;
  border-radius: 0 10px 10px 0;
}

.orders-table tbody tr:nth-child(even) td,
.orders-table tbody tr:nth-child(even) th,
.trades-table tbody tr:nth-child(even) td,
.trades-table tbody tr:nth-child(even) th {
  background: #fdf8ea;
}

.orders-table tbody tr:hover td,
.orders-table tbody tr:hover th,
.trades-table tbody tr:hover td,
.trades-table tbody tr:hover th {
  background: #fff3bd !important;
}

.orders-table .order-actions-cell {
  position: sticky;
  right: 0;
  z-index: 3;
  border-left: 2px solid #c8920d;
  background: #fff !important;
  box-shadow: -12px 0 16px rgba(0, 0, 0, .08);
}

.orders-table tbody tr:nth-child(even) .order-actions-cell {
  background: #fdf8ea !important;
}

.orders-table tbody tr:hover .order-actions-cell {
  background: #fff3bd !important;
}

.order-rate-pill.is-neutral { color: #080908; }

.order-actions .btn {
  min-height: 0;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}

.order-actions .btn:hover { box-shadow: 0 4px 10px rgba(0, 0, 0, .12); }

.order-actions .order-market {
  color: #08612f;
  border-color: #8fceab;
  background: #e8f6ee;
}

.order-actions .order-market:hover { color: #08612f; border-color: #6db98d; background: #d3efe0; }

.order-actions .danger {
  color: #991b1b;
  border-color: #f0b3b3;
  background: #fdeaea;
}

.order-actions .danger:hover { color: #991b1b; border-color: #e38b8b; background: #fbd7d7; }

.side-label.buy { background: #e2f4eb; color: #08612f; }
.side-label.sell { background: #fdecef; color: #b01930; }

.trades-table th,
.trades-table td {
  text-align: left;
  font-size: 13px;
}

.trades-table tbody th small,
.trades-table tbody td small {
  display: block;
  color: #625d4f;
  font-size: 11px;
  font-weight: 400;
}

.trades-table tbody th:first-child { text-align: left; }
.trades-table thead th:nth-last-child(-n+2),
.trades-table td:nth-last-child(-n+2) { text-align: right; }

.trades-table tbody td:first-child,
.trades-table thead th:first-child {
  width: 52px;
  text-align: center;
}

.trades-table input[type=checkbox],
#selectAllTrades {
  width: 18px;
  height: 18px;
  accent-color: #c8920d;
  cursor: pointer;
}

@media (max-width: 900px) {
  .table-scroll::before {
    content: "Swipe or scroll to see all columns →";
    display: block;
    position: sticky;
    left: 0;
    width: fit-content;
    max-width: 100%;
    margin: 0 0 10px;
    padding: 10px 12px;
    border: 1px solid #bd9220;
    border-radius: 8px;
    color: #4a3600;
    background: #fff0a9;
    font-size: 11px;
    font-weight: 800;
  }

  .orders-table {
    min-width: 1080px;
  }

  .orders-table th:nth-child(1) { width: 150px; }
  .orders-table th:nth-child(9) { width: 230px; }

  .orders-table thead th,
  .trades-table thead th {
    height: 46px;
    padding: 8px;
    font-size: 10.5px;
  }

  .order-actions .btn { padding: 8px 9px; font-size: 11px; }
}

.message-card {
  border: 1px solid #9c947e;
  color: #080908;
  background: #fff;
}
.message-card .meta { color: #625d4f; }

.bank-card {
  border: 2px solid #151510;
  background: #fff;
}
.bank-card .bank-head {
  border-bottom: 1px solid #8b7f5b;
  background: linear-gradient(180deg, #ffe784, #dfab14);
}
.bank-card .bank-head .glyph { border-color: #9b760e; background: #fff7d2; }
.bank-card .bank-head small,
.bank-rows .row .k { color: #5c5647; }
.bank-rows .row { border-bottom-color: #d9d2bf; }

.contact-row .glyph {
  border: 1px solid #ad8211;
  background: #fff0a9;
}
.contact-row strong { color: #625d4f; }
.contact-row a,
.contact-row p { color: #080908; }
.placeholder-text { color: #8c6400; }
.contact-map-fallback {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  gap: 15px;
  margin-top: 22px;
  padding: 16px;
  border: 2px solid #151510;
  border-radius: 12px;
  background: linear-gradient(135deg, #fffefa, #fff5c7);
}

.contact-map-mark {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 50%;
  color: #080908;
  background: #f5c936;
  font-size: 24px;
}

.contact-map-fallback strong {
  display: block;
  margin-bottom: 3px;
  color: #080908;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 17px;
}

.contact-map-fallback p {
  margin: 0;
  color: #625d4f;
  font-size: 12px;
  line-height: 1.45;
}

.contact-map-fallback .btn { white-space: nowrap; }

.copy h2 { color: #7c5800; }
.copy p,
.copy li { color: #4f4a3d; }

.gauge-track { stroke: #d9d2bf; }
.gauge-value { stroke: #c8920d; }
.gauge-readout strong { color: #7c5800; }
.gauge-readout span,
.gauge-legend { color: #625d4f; }

#modifyOrderDialog {
  border: 2px solid #151510;
  color: #080908;
  background: #fffefa;
}
#modifyOrderDialog::backdrop { background: rgba(0, 0, 0, .72); }
#modifyOrderDialog h2 { color: #7c5800; }

.app-footer {
  margin-top: 48px;
  border-top: 3px solid #c8920d;
  color: #fffefa;
  background:
    radial-gradient(circle at 15% 0, rgba(245, 201, 54, .13), transparent 320px),
    #050605;
}

.footer-brand-lockup {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #f7d567;
}

.footer-brand-lockup img {
  width: 64px;
  height: 56px;
  border-radius: 8px;
  object-fit: cover;
}

.footer-brand-lockup strong {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 22px;
}

.footer-brand-col p,
.footer-acc .acc-body,
.footer-acc .acc-body a,
.footer-bottom { color: #cfc7b1; }
.footer-acc { border-bottom-color: #44370f; }
.footer-acc summary { color: #fffefa; }
.footer-acc summary i { margin-right: 8px; color: var(--gold-deep); }
.footer-acc summary:hover i { animation-play-state: paused; }
.footer-acc summary::after { color: #ffe784; }
.footer-acc .acc-body a:hover { color: #ffe784; }
.footer-acc .acc-body a i { margin-right: 6px; }
.footer-acc .acc-body a:hover i { animation-play-state: paused; }

/* Footer menu icon animations */
.footer-acc .fa-beat { animation: footerBeat 1.5s ease-in-out infinite; }
.footer-acc .fa-bounce { animation: footerBounce 2s ease-in-out infinite; }
.footer-acc .fa-fade { animation: footerFade 2.4s ease-in-out infinite; }
.footer-acc .fa-flip { animation: footerFlip 2.4s ease-in-out infinite; }
.footer-acc .fa-shake { animation: footerShake 2s ease-in-out infinite; }
.footer-acc .fa-spin-pulse { animation: footerSpinPulse 1.4s ease-in-out infinite; }
.footer-acc .fa-beat-fade { animation: footerBeatFade 2.2s ease-in-out infinite; }

@keyframes footerFade {
  0%, 100% { opacity: 1; }
  50% { opacity: .35; }
}

@keyframes footerFlip {
  0%, 70%, 100% { transform: rotateY(0); }
  35% { transform: rotateY(360deg); }
}

@keyframes footerShake {
  0%, 100% { transform: rotate(0); }
  20% { transform: rotate(-12deg); }
  40% { transform: rotate(10deg); }
  60% { transform: rotate(-8deg); }
  80% { transform: rotate(6deg); }
}

@keyframes footerSpinPulse {
  0% { transform: rotate(0) scale(1); }
  50% { transform: rotate(180deg) scale(.75); }
  100% { transform: rotate(360deg) scale(1); }
}

@keyframes footerBeatFade {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .4; transform: scale(1.12); }
}
}
.footer-social a { 
  border-color: #876711; 
  color: #ffe784; 
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  transition: all 0.3s ease;
  margin-right: 8px;
}
.footer-social a:last-child {
  margin-right: 0;
}
.footer-social a:hover { 
  color: #080908; 
  border-color: #ffe784; 
  background: #ffe784; 
  transform: scale(1.1);
}
.footer-social a:hover i {
  animation-play-state: paused;
}
.footer-social a i {
  font-size: 18px;
}

/* FontAwesome animations for footer icons */
.footer-social .fa-beat {
  animation: footerBeat 1.5s ease-in-out infinite;
}

.footer-social .fa-bounce {
  animation: footerBounce 2s ease-in-out infinite;
}

@keyframes footerBeat {
  0%, 90%, 100% { transform: scale(1); }
  45% { transform: scale(1.15); }
}

@keyframes footerBounce {
  0%, 100% { transform: translateY(0); }
  30% { transform: translateY(-4px); }
  55% { transform: translateY(0); }
  75% { transform: translateY(-2px); }
}

.footer-bottom { border-top-color: #44370f; }

#maSpinner { background: rgba(0, 0, 0, .75); }
#maSpinner .ring { border-color: rgba(255, 255, 255, .2); border-top-color: #f5c936; }

/* Home page */
.home-page { max-width: 1180px; color: #413d32; }

.home-slider {
  border: 2px solid #c8920d;
  border-radius: 14px;
  color: #fffefa;
  background:
    radial-gradient(circle at 84% 18%, rgba(245, 201, 54, .17), transparent 280px),
    linear-gradient(150deg, #050605, #15160f);
  box-shadow: 0 16px 35px rgba(0, 0, 0, .2);
}

.home-slide-copy { min-width: 0; }

.home-slider::after {
  position: absolute;
  right: -10%;
  bottom: -84px;
  left: 40%;
  height: 150px;
  content: "";
  border-radius: 50%;
  border-top: 18px solid #d59e16;
  box-shadow: 0 -12px 0 #ffe47c, 0 -24px 0 #8f6108;
  pointer-events: none;
}

.home-script { color: #f5c936; font-family: Arial, Helvetica, sans-serif; font-size: 18px; font-style: normal; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.home-slide h1,
.home-slide h2 { color: #f7d567; }
.home-slide-copy > p:not(.home-script) { color: #f3eddb; }
.home-text-link { color: #f5c936; }
.home-metal-art::before { border-color: #8f6a12; }
.home-metal-art img { filter: drop-shadow(0 22px 18px rgba(0, 0, 0, .45)); }
.home-slider-controls { z-index: 2; color: #ffe784; }
.home-slider-controls button { border-color: #c8920d; color: #ffe784; background: #11120f; }
.home-slider-controls button:hover { color: #080908; background: #ffe784; }

.home-section-nav {
  top: 70px;
  border-bottom: 1px solid #b99738;
  background: rgba(255, 254, 250, .97);
  box-shadow: 0 5px 14px rgba(0, 0, 0, .08);
}
.home-section-nav a { color: #4c473a; }
.home-section-nav a[aria-current=true] { color: #080908; box-shadow: 0 3px #c8920d; }
.home-section h2 { color: #080908; }
.home-section .home-script { color: #7c5800; }
.home-facts { border-top-color: #b8aa7c; }
.home-facts dd { color: #7c5800; }

.home-bullion,
.home-visit {
  border: 2px solid #151510;
  border-radius: 14px;
  color: #fffefa;
  background: #080908;
  box-shadow: 0 10px 22px rgba(0, 0, 0, .14);
}
.home-bullion h2,
.home-visit h2 { color: #f7d567; }
.home-bullion .home-script,
.home-visit .home-script,
.home-bullion .home-text-link,
.home-visit .home-text-link { color: #ffe784; }
.home-services { border-top-color: #b8aa7c; }
.home-service-links > a { border-bottom-color: #b8aa7c; color: #7c5800; }
.home-service-links small { color: #625d4f; }
.home-steps li { border-top-color: #c8920d; }
.home-steps h3,
.home-steps a { color: #7c5800; }
.home-page a:focus-visible,
.home-page button:focus-visible { outline: 3px solid #c8920d; }

@media (max-width: 900px) {
  .app-sidebar { width: min(312px, 88vw); }
  .app-content { padding: 26px 18px 14px; }
  .ma-submenu { background: transparent; box-shadow: none; }
  .ma-submenu .ma-menu-link { color: #d9d2bf; }
  .home-section-nav { top: 70px; }
}

@media (max-width: 600px) {
  .app-main,
  .app-content,
  .home-page,
  .contact-grid,
  .contact-grid > *,
  .glass,
  .contact-map-fallback {
    min-width: 0;
    max-width: 100%;
  }

  .contact-map-fallback {
    grid-template-columns: 42px minmax(0, 1fr);
    padding: 14px;
  }

  .contact-map-mark { width: 42px; height: 42px; font-size: 21px; }
  .contact-map-fallback .btn { grid-column: 1 / -1; width: 100%; }

  .app-main,
  .app-content,
  .home-page { overflow-x: clip; }

  .app-topbar { gap: 9px; padding: 0 12px; }
  .ticker { min-width: 0; }
  .topbar-actions .pill-btn { width: 48px; height: 48px; justify-content: center; padding: 10px; font-size: 0; }
  .topbar-actions .pill-btn img { width: 24px; height: 24px; }
  .page-head h1 { font-size: 34px; }
  .panel-pad { padding: 20px 18px; }
  .home-page { padding-inline: 10px; }
  .home-slide { min-height: 640px; }
  .home-slide-copy { width: 100%; min-width: 0; }
  .home-slide h1,
  .home-slide h2,
  .home-slide-copy > p { max-width: 100%; overflow-wrap: anywhere; }
  .home-section { padding-inline: 12px; }
  .home-bullion,
  .home-visit { padding-inline: 24px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
