/* agegate.css — shared age-gate styling for every funnel entry page.
   Single source of truth (was inline in sixstar_gateway.html per #42).
   Colours source the page's own palette vars with hard fallbacks, so the
   gate renders identically whether or not a given page defines --panel-bg
   etc. (only sixstar_gateway.html defines the full set). */
.age-gate { position: fixed; inset: 0; z-index: 10001; display: none; align-items: center; justify-content: center;
    padding: 24px; background: rgba(5, 5, 5, 0.82); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.age-gate.open { display: flex; }
.age-gate-card { width: 100%; max-width: 440px; padding: 40px 32px 30px; text-align: center;
    background: var(--panel-bg, rgba(8, 8, 8, 0.92)); border: 1px solid rgba(255, 255, 255, 0.09);
    border-top: 3px solid var(--gold, #e7c582);
    box-shadow: 0 0 0 1px rgba(231, 197, 130, 0.10), 0 30px 80px rgba(0, 0, 0, 0.6), 0 0 60px rgba(231, 197, 130, 0.35);
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%); }
.age-gate-brand { font-family: 'Bebas Neue', sans-serif; font-weight: 400; letter-spacing: .14em; text-transform: uppercase;
    font-size: 30px; line-height: 1; margin: 0 0 6px; color: #fff; text-shadow: 0 0 18px rgba(231, 197, 130, 0.35); }
.age-gate-brand .star { color: var(--gold, #e7c582); }
.age-gate-sub { color: var(--teal, #4aedd4); font-size: 11px; letter-spacing: .32em; text-transform: uppercase;
    margin: 0 0 22px; font-weight: 700; }
.age-gate-age { font-size: 19px; font-weight: 700; margin: 0 0 8px; color: #fff; }
.age-gate-age b { color: var(--gold, #e7c582); }
.age-gate-fine { color: #9b9b9b; font-size: 13px; line-height: 1.5; margin: 0 0 24px; }
.age-gate-fine a { color: var(--teal, #4aedd4); text-decoration: none; transition: color .2s ease; }
.age-gate-fine a:hover { color: var(--gold, #e7c582); }
.age-gate-btn { display: inline-block; cursor: pointer; border: none; font-family: inherit;
    font-weight: 800; letter-spacing: .10em; text-transform: uppercase; font-size: 13px; padding: 14px 22px;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
    clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px); }
.age-gate-btn.primary { background: var(--gold, #e7c582); color: #12100a; box-shadow: 0 0 24px rgba(231, 197, 130, 0.35); }
.age-gate-btn.primary:hover { transform: translateY(-2px); box-shadow: 0 6px 34px rgba(231, 197, 130, 0.35); }
.age-gate-btn.ghost { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, 0.09); margin-left: 8px; }
.age-gate-btn.ghost:hover { color: var(--teal, #4aedd4); border-color: var(--teal, #4aedd4); }
.age-gate-foot { color: #9b9b9b; font-size: 11px; line-height: 1.6; margin: 22px 0 0; }