
/**
 * Random Name Generator Wheel — Final Logo-Matched Identity
 * Canonical palette sampled from the finalized logo.
 */
:root {
    --rngw-brand-midnight: #011141;
    --rngw-brand-royal: #042B90;
    --rngw-brand-cobalt: #024BD8;
    --rngw-brand-electric: #0984F4;
    --rngw-brand-cyan: #45D7F6;
    --rngw-brand-teal: #09C3C6;
    --rngw-brand-violet: #5C3AFC;
    --rngw-brand-gold: #F0C551;
    --rngw-brand-gold-deep: #AB7324;
    --rngw-brand-ice: #F4F9FF;
    --rngw-brand-line: #D6E8FF;
    --rngw-brand-copy: #536782;
}

.rngw-branded-site,
.rngw-home-page,
.rngw-archive-page {
    background: #fff;
    color: var(--rngw-brand-midnight);
}

.rngw-kicker,
.rngw-home-eyebrow,
.rngw-archive-eyebrow,
.rngw-card-kicker {
    color: var(--rngw-brand-teal) !important;
}

/* Header */
.rngw-brand-header {
    border-bottom-color: rgba(2,75,216,.10);
    background: rgba(255,255,255,.96);
    box-shadow: 0 10px 32px rgba(1,17,65,.07);
}
.rngw-brand-nav a { color: #445879; }
.rngw-brand-nav a:hover,
.rngw-brand-nav a:focus-visible,
.rngw-brand-nav a.is-current { color: var(--rngw-brand-cobalt); }
.rngw-brand-nav a.is-current::after {
    height: 3px;
    background: linear-gradient(90deg, var(--rngw-brand-teal), var(--rngw-brand-cobalt));
}
.rngw-brand-header__cta {
    background: linear-gradient(135deg, var(--rngw-brand-cobalt), var(--rngw-brand-electric) 65%, var(--rngw-brand-teal) 130%);
    box-shadow: 0 11px 26px rgba(2,75,216,.22);
}
.rngw-brand-header__cta:hover,
.rngw-brand-header__cta:focus-visible {
    background: linear-gradient(135deg, var(--rngw-brand-royal), var(--rngw-brand-cobalt));
}

/* Hero */
.rngw-home-hero {
    background:
        radial-gradient(circle at 86% 8%, rgba(69,215,246,.22), transparent 25%),
        radial-gradient(circle at 70% 82%, rgba(92,58,252,.13), transparent 26%),
        linear-gradient(128deg, var(--rngw-brand-midnight) 0%, #021C58 38%, var(--rngw-brand-royal) 72%, #063E9F 100%);
}
.rngw-home-eyebrow { color: var(--rngw-brand-cyan) !important; }
.rngw-home-hero-line { color: var(--rngw-brand-cyan); }
.rngw-home-intro { color: rgba(232,245,255,.84); }

.rngw-home-btn--primary {
    background: linear-gradient(135deg, var(--rngw-brand-gold), #FFD66D 55%, #DCA932);
    color: var(--rngw-brand-midnight);
    box-shadow: 0 15px 36px rgba(240,197,81,.20);
}
.rngw-home-btn--secondary {
    border-color: rgba(69,215,246,.28);
    background: rgba(9,132,244,.10);
}
.rngw-home-btn--secondary:hover,
.rngw-home-btn--secondary:focus-visible {
    border-color: rgba(69,215,246,.50);
    background: rgba(69,215,246,.14);
}
.rngw-home-stats div {
    border-color: rgba(69,215,246,.15);
    background: linear-gradient(145deg, rgba(9,132,244,.12), rgba(9,195,198,.07));
}
.rngw-home-showcase {
    border-color: rgba(69,215,246,.20);
    background:
        radial-gradient(circle at 100% 0%, rgba(9,195,198,.13), transparent 40%),
        linear-gradient(160deg, rgba(255,255,255,.10), rgba(2,75,216,.09));
}
.rngw-home-mini-grid > div {
    border-color: rgba(69,215,246,.13);
    background: rgba(9,132,244,.075);
}

/* Light cards and informational sections */
.rngw-home-section--soft,
.rngw-home-faq-section {
    background: linear-gradient(180deg, #F8FBFF 0%, var(--rngw-brand-ice) 100%);
}
.rngw-home-steps article,
.rngw-home-category-card,
.rngw-generator-card,
.rngw-related-card,
.rngw-home-use-card,
.rngw-home-faqs details {
    border-color: var(--rngw-brand-line);
    background:
        radial-gradient(circle at 100% 0%, rgba(69,215,246,.08), transparent 34%),
        linear-gradient(145deg, #fff 0%, #F6FAFF 100%);
    box-shadow: 0 14px 36px rgba(1,17,65,.055);
}
.rngw-home-category-card:hover,
.rngw-home-category-card:focus-visible,
.rngw-generator-card:hover,
.rngw-generator-card:focus-visible,
.rngw-related-card:hover,
.rngw-related-card:focus-visible {
    border-color: rgba(2,75,216,.35);
    box-shadow: 0 20px 46px rgba(2,75,216,.10);
}
.rngw-home-steps span,
.rngw-related-icon {
    background: linear-gradient(145deg, var(--rngw-brand-royal), var(--rngw-brand-cobalt));
    color: #fff;
}
.rngw-card-link,
.rngw-related-arrow { color: var(--rngw-brand-cobalt) !important; }
.rngw-section-heading h2,
.rngw-home-info-copy h2,
.rngw-home-info-copy h3,
.rngw-home-use-card h2,
.rngw-generator-article h2,
.rngw-generator-article h3,
.rngw-related-copy strong {
    color: var(--rngw-brand-midnight);
}
.rngw-home-info-copy p,
.rngw-home-use-list span,
.rngw-home-faqs p,
.rngw-generator-article,
.rngw-related-copy small,
.rngw-archive-intro {
    color: var(--rngw-brand-copy);
}

/* Archive */
.rngw-archive-hero {
    background:
        radial-gradient(circle at 79% 7%, rgba(69,215,246,.23), transparent 27%),
        radial-gradient(circle at 65% 100%, rgba(92,58,252,.11), transparent 31%),
        linear-gradient(132deg, var(--rngw-brand-midnight), var(--rngw-brand-royal) 70%, var(--rngw-brand-cobalt));
}

/* Footer */
.rngw-brand-footer {
    background:
        radial-gradient(circle at 80% 0%, rgba(69,215,246,.16), transparent 26%),
        linear-gradient(135deg, var(--rngw-brand-midnight) 0%, var(--rngw-brand-royal) 67%, #064AA7 100%);
}
.rngw-brand-footer .rngw-kicker { color: var(--rngw-brand-cyan) !important; }
.rngw-brand-footer__grid { border-top-color: rgba(69,215,246,.16); }
.rngw-brand-footer__grid a:hover,
.rngw-brand-footer__grid a:focus-visible { color: var(--rngw-brand-cyan); }

/* Premium wheel */
.rngw-app {
    --rngw-ink: var(--rngw-brand-midnight);
    --rngw-ink-2: var(--rngw-brand-royal);
    --rngw-gold: var(--rngw-brand-gold);
    --rngw-gold-light: var(--rngw-brand-cyan);
    --rngw-ivory: var(--rngw-brand-ice);
    --rngw-paper: #fff;
    --rngw-muted: var(--rngw-brand-copy);
    --rngw-line: var(--rngw-brand-line);
    --rngw-success: var(--rngw-brand-teal);
    --rngw-shadow: 0 26px 72px rgba(2,75,216,.11);
}
.rngw-shell {
    border-color: var(--rngw-brand-line);
    background:
        radial-gradient(circle at 10% 0%, rgba(69,215,246,.11), transparent 31%),
        linear-gradient(145deg, #fff 0%, #F2F8FF 100%);
    box-shadow: 0 26px 72px rgba(1,17,65,.11);
}
.rngw-wheel-zone {
    border-color: rgba(69,215,246,.20);
    background:
        radial-gradient(circle at 52% 21%, rgba(9,132,244,.26), transparent 35%),
        radial-gradient(circle at 85% 85%, rgba(92,58,252,.12), transparent 25%),
        linear-gradient(150deg, var(--rngw-brand-midnight), #021E61 55%, var(--rngw-brand-royal));
}
.rngw-ready-badge,
.rngw-icon-btn {
    border-color: rgba(69,215,246,.23);
    background: rgba(9,132,244,.10);
}
.rngw-ready-badge { color: #DDF7FF; }
.rngw-icon-btn:hover {
    border-color: rgba(69,215,246,.48);
    background: rgba(69,215,246,.14);
}
.rngw-wheel-frame {
    background: linear-gradient(145deg,
        var(--rngw-brand-cyan),
        var(--rngw-brand-cobalt) 24%,
        var(--rngw-brand-gold) 48%,
        var(--rngw-brand-electric) 72%,
        var(--rngw-brand-teal));
    box-shadow:
        0 0 0 1px rgba(69,215,246,.25),
        0 24px 56px rgba(0,19,75,.42),
        0 0 34px rgba(9,132,244,.16),
        inset 0 0 0 2px rgba(255,255,255,.22);
}
.rngw-wheel-rotor { background: var(--rngw-brand-midnight); }
.rngw-pointer { border-top-color: var(--rngw-brand-gold); }
.rngw-pointer::after {
    background: var(--rngw-brand-midnight);
    box-shadow: inset 0 0 0 3px var(--rngw-brand-gold);
}
.rngw-hub-button {
    border-color: #FFD96E;
    background: radial-gradient(circle at 35% 28%, #FFF1B7, var(--rngw-brand-gold) 45%, var(--rngw-brand-gold-deep));
    color: var(--rngw-brand-midnight);
}
.rngw-hub-button:focus-visible,
.rngw-icon-btn:focus-visible,
.rngw-primary-btn:focus-visible,
.rngw-secondary-btn:focus-visible,
.rngw-count-control button:focus-visible,
.rngw-result-actions button:focus-visible,
.rngw-text-btn:focus-visible,
.rngw-editor summary:focus-visible {
    outline-color: rgba(69,215,246,.72);
}
.rngw-control-panel {
    border-color: var(--rngw-brand-line);
    background:
        radial-gradient(circle at 100% 0%, rgba(69,215,246,.08), transparent 36%),
        rgba(255,255,255,.96);
    box-shadow: 0 16px 36px rgba(1,17,65,.075);
}
.rngw-primary-btn {
    background: linear-gradient(135deg, var(--rngw-brand-royal), var(--rngw-brand-cobalt) 58%, var(--rngw-brand-electric)) !important;
    color: #fff !important;
    box-shadow: 0 11px 25px rgba(2,75,216,.20);
}
.rngw-secondary-btn,
.rngw-count-control,
.rngw-editor,
.rngw-winner-card,
.rngw-favorites-card {
    border-color: var(--rngw-brand-line) !important;
}
.rngw-winner-card {
    background:
        radial-gradient(circle at 100% 0%, rgba(69,215,246,.12), transparent 40%),
        linear-gradient(145deg, #fff, #F1F7FF) !important;
}
.rngw-result-state {
    color: var(--rngw-brand-cobalt) !important;
    border-color: rgba(2,75,216,.18) !important;
    background: rgba(9,132,244,.07) !important;
}
.rngw-result-actions button:first-child {
    background: var(--rngw-brand-cobalt) !important;
    color: #fff !important;
}

@media (max-width: 900px) {
    .rngw-mobile-menu summary { border-color: var(--rngw-brand-line); }
    .rngw-mobile-menu nav {
        border-color: var(--rngw-brand-line);
        background: #fff;
        box-shadow: 0 18px 44px rgba(1,17,65,.15);
    }
    .rngw-mobile-menu nav a:hover {
        background: var(--rngw-brand-ice);
        color: var(--rngw-brand-cobalt);
    }
}


/* ---------- Phase 7: archive shell + manual publishing content ---------- */

/* Generator archives should start directly below the custom header and use the
   same edge-to-edge presentation as the homepage. */
.rngw-generator-archive #page,
.rngw-generator-archive #content,
.rngw-generator-archive .site-content,
.rngw-generator-archive .content-area,
.rngw-generator-archive #primary,
.rngw-generator-archive .rngw-archive-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.rngw-generator-archive #page.grid-container,
.rngw-generator-archive #content.grid-container {
    max-width: none !important;
}

.rngw-generator-archive .rngw-archive-hero {
    width: 100%;
    margin: 0;
}

.rngw-generator-archive .rngw-archive-content {
    padding-left: 0;
    padding-right: 0;
}

.rngw-generator-sources,
.rngw-generator-faqs {
    max-width: 920px;
    margin: clamp(42px, 6vw, 72px) auto 0;
}

.rngw-generator-sources {
    padding: 24px 26px;
    border: 1px solid var(--rngw-brand-line);
    border-radius: 20px;
    background:
        radial-gradient(circle at 100% 0%, rgba(69,215,246,.08), transparent 32%),
        linear-gradient(145deg, #fff, #F7FBFF);
    box-shadow: 0 12px 34px rgba(1,17,65,.05);
}

.rngw-generator-sources ul {
    display: grid;
    gap: 8px;
    margin: 0;
    padding-left: 1.2em;
}

.rngw-generator-sources a {
    color: var(--rngw-brand-cobalt);
    word-break: break-word;
}

.rngw-generator-faq-list {
    display: grid;
    gap: 12px;
}

.rngw-generator-faq-list details {
    overflow: hidden;
    border: 1px solid var(--rngw-brand-line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(1,17,65,.045);
}

.rngw-generator-faq-list summary {
    cursor: pointer;
    padding: 18px 20px;
    color: var(--rngw-brand-midnight);
    font-weight: 800;
}

.rngw-generator-faq-answer {
    padding: 0 20px 18px;
    color: var(--rngw-brand-copy);
    line-height: 1.75;
}

.rngw-generator-faq-answer p {
    margin: 0;
}

@media (max-width: 640px) {
    .rngw-generator-sources {
        padding: 20px;
        border-radius: 16px;
    }
}


/* ---------- Phase 8: trust / informational pages ---------- */

.rngw-trust-page #page,
.rngw-trust-page #content,
.rngw-trust-page #primary,
.rngw-trust-page #main,
.rngw-trust-page article,
.rngw-trust-page .inside-article,
.rngw-trust-page .entry-content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

.rngw-trust-page #content,
.rngw-trust-page .inside-article {
    padding: 0 !important;
}

.rngw-trust-page .entry-content {
    margin-top: 0 !important;
}

.rngw-trust-shell {
    background: #fff;
    color: var(--rngw-brand-midnight);
}

.rngw-trust-container {
    width: min(980px, calc(100% - 40px));
    margin: 0 auto;
}

.rngw-trust-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(64px, 8vw, 104px) 0 clamp(58px, 7vw, 92px);
    background:
        radial-gradient(circle at 82% 5%, rgba(69,215,246,.23), transparent 25%),
        radial-gradient(circle at 66% 100%, rgba(92,58,252,.12), transparent 28%),
        linear-gradient(130deg, var(--rngw-brand-midnight), var(--rngw-brand-royal) 66%, var(--rngw-brand-cobalt));
    color: #fff;
}

.rngw-trust-hero::after {
    content: "";
    position: absolute;
    left: -4%;
    right: -4%;
    bottom: -60px;
    height: 100px;
    border-radius: 50% 50% 0 0;
    background: #fff;
}

.rngw-trust-hero .rngw-trust-container {
    position: relative;
    z-index: 1;
}

.rngw-trust-hero h1 {
    max-width: 820px;
    margin: 8px 0 16px;
    color: #fff;
    font-size: clamp(2.55rem, 5vw, 4.65rem);
    line-height: 1.03;
    letter-spacing: -.04em;
}

.rngw-trust-hero p {
    max-width: 790px;
    margin: 0;
    color: rgba(233,246,255,.84);
    font-size: clamp(1rem, 1.6vw, 1.15rem);
    line-height: 1.8;
}

.rngw-trust-body {
    padding: clamp(56px, 7vw, 90px) 0;
}

.rngw-trust-section {
    max-width: 820px;
    margin: 0 0 clamp(38px, 5vw, 58px);
}

.rngw-trust-section h2,
.rngw-trust-card h2,
.rngw-trust-callout h2 {
    margin: 0 0 12px;
    color: var(--rngw-brand-midnight);
    line-height: 1.15;
    letter-spacing: -.02em;
}

.rngw-trust-section h2 {
    font-size: clamp(1.55rem, 2.8vw, 2.2rem);
}

.rngw-trust-section p,
.rngw-trust-card p,
.rngw-trust-callout p,
.rngw-trust-list {
    color: var(--rngw-brand-copy);
    font-size: 1.02rem;
    line-height: 1.82;
}

.rngw-trust-section p {
    margin: 0 0 14px;
}

.rngw-trust-section a,
.rngw-trust-card a {
    color: var(--rngw-brand-cobalt);
}

.rngw-trust-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin: 0 0 clamp(42px, 6vw, 64px);
}

.rngw-trust-card {
    padding: 26px;
    border: 1px solid var(--rngw-brand-line);
    border-radius: 22px;
    background:
        radial-gradient(circle at 100% 0%, rgba(69,215,246,.10), transparent 34%),
        linear-gradient(145deg, #fff, #F6FAFF);
    box-shadow: 0 14px 38px rgba(1,17,65,.055);
}

.rngw-trust-card h2 {
    margin-top: 6px;
    font-size: 1.45rem;
}

.rngw-trust-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: clamp(42px, 6vw, 64px);
}

.rngw-trust-steps section {
    padding: 24px;
    border: 1px solid var(--rngw-brand-line);
    border-radius: 20px;
    background: linear-gradient(145deg, #fff, #F5FAFF);
}

.rngw-trust-steps section > span {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    margin-bottom: 14px;
    border-radius: 50%;
    background: linear-gradient(145deg, var(--rngw-brand-royal), var(--rngw-brand-cobalt));
    color: #fff;
    font-weight: 800;
}

.rngw-trust-steps h2 {
    margin: 0 0 8px;
    color: var(--rngw-brand-midnight);
    font-size: 1.35rem;
}

.rngw-trust-steps p {
    margin: 0;
    color: var(--rngw-brand-copy);
    line-height: 1.72;
}

.rngw-trust-list {
    padding-left: 1.25em;
}

.rngw-trust-list li {
    margin-bottom: 9px;
}

.rngw-trust-callout {
    padding: clamp(26px, 4vw, 38px);
    border: 1px solid rgba(2,75,216,.18);
    border-radius: 24px;
    background:
        radial-gradient(circle at 100% 0%, rgba(69,215,246,.13), transparent 36%),
        linear-gradient(145deg, #F9FCFF, #EEF7FF);
    box-shadow: 0 18px 46px rgba(2,75,216,.08);
}

.rngw-trust-callout h2 {
    font-size: clamp(1.55rem, 2.6vw, 2.05rem);
}

.rngw-trust-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 18px;
}

.rngw-trust-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 20px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--rngw-brand-cobalt), var(--rngw-brand-electric));
    color: #fff !important;
    font-weight: 800;
    text-decoration: none;
    box-shadow: 0 12px 28px rgba(2,75,216,.18);
}

.rngw-trust-button--secondary {
    border: 1px solid var(--rngw-brand-line);
    background: #fff;
    color: var(--rngw-brand-cobalt) !important;
    box-shadow: none;
}

.rngw-trust-updated {
    margin: 0 0 34px;
    color: #64748b;
}

.rngw-trust-section code,
.rngw-trust-card code {
    padding: .12em .36em;
    border-radius: 6px;
    background: #EEF6FF;
    color: #073E9F;
    font-size: .92em;
}

@media (max-width: 860px) {
    .rngw-trust-grid,
    .rngw-trust-steps {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .rngw-trust-container {
        width: min(100% - 28px, 980px);
    }

    .rngw-trust-hero {
        padding-top: 48px;
    }

    .rngw-trust-callout,
    .rngw-trust-card,
    .rngw-trust-steps section {
        border-radius: 18px;
    }

    .rngw-trust-actions {
        flex-direction: column;
    }

    .rngw-trust-button {
        width: 100%;
    }
}
