/* crowngradingpro.com shared chrome: header, menu, footer and their light seams.
   Every page loads it, including the WP-era bodies (Astra base CSS), so every rule is
   cg- scoped and sets its own font, color and line-height rather than inheriting. */
:root {
  --cg-gold: #d4af37; --cg-gold-bright: #f5c842; --cg-gold-pale: #fffbe8;
  --cg-purple: #4e0e99; --cg-text: #f1ecfa; --cg-muted: #b9acd4;
  --cg-shine: linear-gradient(180deg, #9a6e00 0%, #d4af37 18%, #ffe88a 38%, #fffbe0 50%, #ffe88a 62%, #d4af37 82%, #9a6e00 100%);
  --cg-glow: rgba(245, 200, 66, .55);
  --cg-display: 'Orbitron', sans-serif; --cg-body: 'Rajdhani', sans-serif;
}
.cg-main { display: block; overflow-x: clip; }
.cg-wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 24px; box-sizing: border-box; }
.cg-skip { position: absolute; left: -999px; top: 8px; z-index: 30; background: var(--cg-gold); color: #000; padding: 8px 14px; font: 700 1rem var(--cg-body); }
.cg-skip:focus { left: 8px; }
.cg-hdr :focus-visible, .cg-ftr :focus-visible { outline: 2px solid var(--cg-gold-bright); outline-offset: 3px; }

/* header: royal, big crown, crisp gold seam with a light pulse running along it */
.cg-hdr { position: sticky; top: 0; z-index: 50; background: linear-gradient(180deg, #1d0745, #12042c); box-shadow: 0 1px 0 rgba(212, 175, 55, .55), 0 12px 30px -18px #000; }
.cg-hdr::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, var(--cg-gold-bright) 45%, #fff 50%, var(--cg-gold-bright) 55%, transparent) no-repeat;
  background-size: 28% 100%; filter: drop-shadow(0 0 4px var(--cg-glow)); animation: cg-seam 9s ease-in-out infinite; }
@keyframes cg-seam { 0% { background-position: -40% 0; } 60%, 100% { background-position: 140% 0; } }
.cg-hdr-in { display: flex; align-items: center; gap: 24px; height: 84px; }
.cg-brand { display: flex; align-items: center; gap: 12px; flex-shrink: 0; text-decoration: none; }
.cg-brand img { display: block; width: 58px; height: 58px; }
.cg-brand span { font: 900 .95rem/1 var(--cg-display); letter-spacing: .3em; text-transform: uppercase; color: var(--cg-gold); }
.cg-brand small { display: block; margin-top: 6px; font: 700 .52rem/1 var(--cg-display); letter-spacing: .5em; color: var(--cg-muted); }
.cg-nav { display: flex; gap: 2px; margin-left: auto; }
.cg-nav a { white-space: nowrap; padding: 10px 11px; font: 700 .72rem/1 var(--cg-display); letter-spacing: .14em; text-transform: uppercase; color: #d9cfee; text-decoration: none; transition: color .2s; }
.cg-nav a:hover, .cg-nav a[aria-current] { color: var(--cg-gold); }
.cg-act { display: flex; align-items: center; gap: 12px; }
.cg-portal { display: inline-flex; align-items: center; min-height: 40px; padding: 0 18px; border-radius: 3px; text-decoration: none; white-space: nowrap;
  font: 700 .68rem/1 var(--cg-display); letter-spacing: .16em; text-transform: uppercase; color: var(--cg-gold-pale);
  box-shadow: inset 0 0 0 1px rgba(212, 175, 55, .7), inset 0 1px 0 rgba(255, 255, 255, .1); transition: background .2s, box-shadow .2s; }
.cg-portal:hover { color: var(--cg-gold-pale); background: rgba(212, 175, 55, .1); box-shadow: inset 0 0 0 1px var(--cg-gold), 0 0 20px -4px var(--cg-glow); }
.cg-menu { position: relative; }
.cg-menu summary { list-style: none; width: 44px; height: 44px; border-radius: 3px; display: grid; place-content: center; gap: 6px; cursor: pointer; box-shadow: inset 0 0 0 1px rgba(212, 175, 55, .6); }
.cg-menu summary::-webkit-details-marker { display: none; }
.cg-menu summary span { display: block; width: 18px; height: 2px; background: var(--cg-gold); transition: transform .2s; }
.cg-menu[open] summary span:first-child { transform: translateY(4px) rotate(45deg); }
.cg-menu[open] summary span:last-child { transform: translateY(-4px) rotate(-45deg); }
.cg-menu:not([open]) .cg-menu-pane { display: none; }
.cg-menu-pane { position: absolute; right: 0; top: 56px; width: 300px; background: #14052f; border-radius: 6px; padding: 8px; display: grid; max-height: calc(100dvh - 110px); overflow: auto;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 0 0 1px rgba(212, 175, 55, .35), 0 24px 48px -16px #000; }
.cg-menu-pane a { padding: 11px 14px; font: 600 1.02rem/1.2 var(--cg-body); color: var(--cg-text); text-decoration: none; border-radius: 3px; }
.cg-menu-pane a:hover { background: rgba(212, 175, 55, .08); color: var(--cg-gold); }
.cg-menu-pane b { padding: 14px 14px 4px; font: 700 .6rem/1 var(--cg-display); letter-spacing: .22em; text-transform: uppercase; color: var(--cg-gold); }
.cg-menu-pane .cg-menu-cta { color: var(--cg-gold); font-weight: 700; }

/* footer */
.cg-ftr { position: relative; background: #08011a; color: var(--cg-text); box-shadow: inset 0 1px 0 rgba(212, 175, 55, .4); padding: 56px 0 28px; font: 500 1rem/1.5 var(--cg-body); }
.cg-ftr::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, var(--cg-gold-bright) 45%, #fff 50%, var(--cg-gold-bright) 55%, transparent) no-repeat;
  background-size: 28% 100%; filter: drop-shadow(0 0 4px var(--cg-glow)); animation: cg-seam 11s ease-in-out infinite reverse; }
.cg-ftr-in { display: grid; grid-template-columns: 1.3fr 1.1fr 1fr 1fr 1fr; gap: 28px; }
.cg-ftr-brand { display: flex; gap: 14px; align-items: center; align-self: start; }
.cg-ftr-brand img { display: block; }
.cg-ftr-brand b { display: block; font: 900 .9rem/1.3 var(--cg-display); letter-spacing: .22em; text-transform: uppercase; color: #fff; }
.cg-ftr-brand span { color: var(--cg-gold); font-weight: 600; }
.cg-ftr-col { display: grid; gap: 4px; align-content: start; color: var(--cg-muted); }
.cg-ftr-col a { min-height: 32px; display: flex; align-items: center; color: var(--cg-muted); text-decoration: none; }
.cg-ftr-col a:hover { color: var(--cg-gold); }
.cg-copy { margin-top: 40px; margin-bottom: 0; color: #7c7096; font-size: .9rem; }

@media (max-width: 1240px) {
  .cg-nav { display: none; }
  .cg-act { margin-left: auto; }
}
@media (max-width: 1100px) {
  .cg-ftr-in { grid-template-columns: 1fr 1fr; }
  .cg-ftr-brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .cg-wrap { padding: 0 16px; }
  .cg-hdr-in { height: 68px; gap: 10px; }
  .cg-brand img { width: 44px; height: 44px; }
  .cg-brand span { font-size: .78rem; letter-spacing: .22em; }
  .cg-brand small { font-size: .46rem; letter-spacing: .36em; }
  .cg-portal { display: none; }
  .cg-menu-pane { position: fixed; left: 12px; right: 12px; top: 76px; width: auto; }
  .cg-ftr-in { grid-template-columns: 1fr; gap: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .cg-hdr::after, .cg-ftr::before { animation: none; }
}

/* logged-in actions (crowndatabase.com) */
.cg-logout { margin: 0; }
button.cg-portal { background: none; border: 0; cursor: pointer; color: #ffb3bb; box-shadow: inset 0 0 0 1px rgba(220, 53, 69, .55); }
button.cg-portal:hover { color: #ffd0d5; background: rgba(220, 53, 69, .12); box-shadow: inset 0 0 0 1px rgba(220, 53, 69, .8); }
@media (max-width: 560px) { .cg-logout { display: none; } }
.cg-menu-logout { margin: 0; }
.cg-menu-logout button { width: 100%; text-align: left; padding: 11px 14px; background: none; border: 0; border-radius: 3px; cursor: pointer; font: 600 1.02rem/1.2 var(--cg-body); color: #ffb3bb; }
.cg-menu-logout button:hover { background: rgba(220, 53, 69, .12); }
.cg-brand + .cg-act { margin-left: auto; }