/*
Theme Name: Farad Gameworks
Theme URI: https://faradgameworks.com/
Author: Farad Gameworks
Author URI: https://faradgameworks.com/
Description: Custom native WordPress block theme for Farad Gameworks. Built to remain visually editable in the WordPress Site Editor.
Version: 0.3.1
Requires at least: 6.6
Requires PHP: 7.4
Text Domain: farad-gameworks
*/

/* ---------- Base ---------- */
html { scroll-behavior: smooth; }

body {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.wp-site-blocks {
    overflow-x: clip;
}

a {
    text-underline-offset: 0.18em;
}

::selection {
    background: #b78842;
    color: #111416;
}

/* ---------- Header ---------- */
.fg-site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    border-bottom: 1px solid rgba(212, 175, 106, 0.18);
    background: rgba(17, 20, 22, 0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.admin-bar .fg-site-header {
    top: 32px;
}

.fg-brand .wp-block-site-title {
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.fg-brand-sub {
    letter-spacing: 0.18em;
    text-transform: uppercase;
    opacity: 0.72;
}

.fg-site-header .wp-block-navigation-item__content {
    text-decoration: none;
}

.fg-site-header .wp-block-navigation-item__content:hover,
.fg-site-header .wp-block-navigation-item__content:focus {
    color: var(--wp--preset--color--brass-light);
}

/* ---------- Hero ---------- */
.fg-hero {
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(212, 175, 106, 0.14);
    background:
        radial-gradient(circle at 75% 25%, rgba(119, 200, 212, 0.15), transparent 27%),
        radial-gradient(circle at 18% 68%, rgba(183, 136, 66, 0.16), transparent 30%),
        linear-gradient(135deg, #111416 0%, #1b2226 50%, #121517 100%);
}

.fg-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.24;
    background-image:
        linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
    background-size: 34px 34px;
    mask-image: linear-gradient(to bottom, black, transparent 88%);
}

.fg-hero::after {
    content: "";
    position: absolute;
    width: 520px;
    height: 520px;
    right: -120px;
    bottom: -220px;
    border: 1px solid rgba(212, 175, 106, 0.18);
    border-radius: 50%;
    box-shadow:
        0 0 0 42px rgba(212, 175, 106, 0.025),
        0 0 0 86px rgba(119, 200, 212, 0.02);
    pointer-events: none;
}

.fg-hero > * {
    position: relative;
    z-index: 1;
}

.fg-kicker {
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-size: 0.78rem;
    font-weight: 700;
}

.fg-hero-title {
    max-width: 950px;
    text-wrap: balance;
}

.fg-lead {
    max-width: 780px;
    font-size: clamp(1.08rem, 1.8vw, 1.28rem);
    line-height: 1.65;
    color: #cbd0d4;
}

/* ---------- Panels / cards ---------- */
.fg-panel,
.fg-card {
    border: 1px solid rgba(212, 175, 106, 0.2);
    background:
        linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.012)),
        #171c1f;
    box-shadow: 0 18px 45px rgba(0,0,0,0.18);
}

.fg-card {
    height: 100%;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.fg-card:hover {
    transform: translateY(-3px);
    border-color: rgba(212, 175, 106, 0.44);
    box-shadow: 0 22px 52px rgba(0,0,0,0.28);
}

.fg-project-mark {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
}

.fg-project-mark::before {
    content: "";
    width: 36px;
    height: 2px;
    background: linear-gradient(90deg, #b78842, #77c8d4);
}

.fg-divider {
    border-top: 1px solid rgba(212, 175, 106, 0.18);
}

.fg-muted {
    color: #aeb6bd;
}

/* ---------- Buttons ---------- */
.wp-block-button__link {
    transition: transform 160ms ease, filter 160ms ease, box-shadow 160ms ease;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus {
    transform: translateY(-1px);
    filter: brightness(1.08);
    box-shadow: 0 8px 24px rgba(0,0,0,0.24);
}

.wp-block-button.is-style-outline .wp-block-button__link {
    color: var(--wp--preset--color--bone);
    border-color: rgba(232, 226, 215, 0.42);
}

/* ---------- Query / posts ---------- */
.fg-post-grid .wp-block-post {
    border: 1px solid rgba(255,255,255,0.09);
    border-radius: 10px;
    padding: 1.4rem;
    background: rgba(255,255,255,0.018);
}

.fg-post-grid .wp-block-post-title a {
    text-decoration: none;
}

.fg-post-grid .wp-block-post-title a:hover {
    color: var(--wp--preset--color--brass-light);
}

/* ---------- Footer ---------- */
.fg-site-footer {
    border-top: 1px solid rgba(212, 175, 106, 0.18);
    background: #0e1113;
}

.fg-site-footer a {
    text-decoration: none;
}

/* ---------- Content pages ---------- */
.fg-page-hero {
    border-bottom: 1px solid rgba(212, 175, 106, 0.13);
    background:
        radial-gradient(circle at 85% 15%, rgba(119, 200, 212, 0.1), transparent 23%),
        #14191c;
}

.fg-prose > * + * {
    margin-block-start: 1.25rem;
}

.fg-prose h2 {
    margin-block-start: 2.5rem;
}

/* ---------- Small screens ---------- */
@media (max-width: 782px) {
    .admin-bar .fg-site-header {
        top: 46px;
    }

    .fg-site-header {
        position: relative;
        top: auto;
    }

    .fg-hero::after {
        width: 360px;
        height: 360px;
        right: -180px;
        bottom: -130px;
    }

    .fg-hide-mobile {
        display: none !important;
    }
}


/* =========================
   Farad Gameworks v0.2
   ========================= */

.fg-logo-lockup {
    gap: .72rem;
}
.fg-logo-lockup::before {
    content: "";
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: block;
    background: url("assets/farad-mark.svg") center/contain no-repeat;
}
.fg-logo-lockup .wp-block-site-title {
    margin: 0;
}
.fg-logo-copy {
    min-width: 0;
}

.fg-hero-v2 {
    min-height: min(820px, 85vh);
}
.fg-hero-grid {
    position: relative;
    z-index: 1;
}
.fg-engine-art {
    min-height: 520px;
    border: 1px solid rgba(212,175,106,.22);
    border-radius: 18px;
    background:
        linear-gradient(180deg, rgba(17,20,22,.05), rgba(17,20,22,.55)),
        url("assets/concordance-engine-epic-schematic.png") center/cover no-repeat,
        radial-gradient(circle at 50% 40%, rgba(119,200,212,.08), transparent 54%),
        #121719;
    box-shadow: inset 0 0 80px rgba(0,0,0,.35), 0 25px 70px rgba(0,0,0,.25);
    overflow: hidden;
}
.fg-engine-art .fg-art-label {
    align-self: flex-end;
    margin: 1rem;
    padding: .55rem .72rem;
    border: 1px solid rgba(212,175,106,.24);
    border-radius: 6px;
    background: rgba(14,17,19,.82);
    backdrop-filter: blur(8px);
}

.fg-stat-strip {
    border-top: 1px solid rgba(212,175,106,.18);
    border-bottom: 1px solid rgba(212,175,106,.18);
}
.fg-stat-number {
    font-family: var(--wp--preset--font-family--display);
    font-size: clamp(2rem,4vw,3.1rem);
    font-weight: 800;
    line-height: 1;
}
.fg-stat-label {
    letter-spacing: .11em;
    text-transform: uppercase;
    font-size: .72rem;
    color: #aeb6bd;
}

.fg-station-grid .wp-block-column {
    min-width: 0;
}
.fg-station {
    position: relative;
    overflow: hidden;
}
.fg-station::after {
    content: "";
    position: absolute;
    height: 3px;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(90deg, #b78842, #77c8d4);
    opacity: .7;
}

.fg-cta-band {
    border-block: 1px solid rgba(212,175,106,.18);
    background:
        radial-gradient(circle at 75% 50%, rgba(119,200,212,.09), transparent 35%),
        #151a1d;
}

.fg-notice {
    border-left: 3px solid #b78842;
    padding-left: 1rem;
}
.fg-legal-note {
    border: 1px dashed rgba(212,175,106,.34);
    border-radius: 8px;
    padding: 1rem;
    color: #d2c8b7;
    background: rgba(183,136,66,.05);
}

.fg-newsletter-box,
.fg-gamefound-box {
    border: 1px solid rgba(212,175,106,.2);
    border-radius: 14px;
    padding: clamp(1.4rem,4vw,2.3rem);
    background: linear-gradient(160deg, rgba(255,255,255,.03), rgba(255,255,255,.008));
}

.fg-shortcode-button a {
    display: inline-block;
    padding: .78rem 1.15rem;
    border-radius: 5px;
    background: #b78842;
    color: #111416;
    font-weight: 750;
    letter-spacing: .035em;
    text-decoration: none;
}
.fg-shortcode-button a:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
}

@media (max-width: 900px) {
    .fg-engine-art { min-height: 390px; }
}
@media (max-width: 782px) {
    .fg-logo-lockup::before { width: 36px; height: 36px; flex-basis: 36px; }
    .fg-hero-v2 { min-height: auto; }
    .fg-engine-art { min-height: 330px; }
}


/* =========================
   Farad Gameworks v0.3 — Concordance visual presentation
   ========================= */
.fg-engine-art {
    background-position: center center;
    min-height: 560px;
}
.fg-ce-hero-art {
    min-height: clamp(360px, 56vw, 720px);
    border: 1px solid rgba(212,175,106,.24);
    border-radius: 16px;
    background:
        linear-gradient(180deg, rgba(17,20,22,.04), rgba(17,20,22,.4)),
        url("assets/concordance-engine-epic-schematic.png") center/cover no-repeat;
    box-shadow: 0 24px 70px rgba(0,0,0,.34), inset 0 0 90px rgba(0,0,0,.18);
}
.fg-ce-visual-grid .wp-block-group {
    height: 100%;
}
.fg-ce-image-slot {
    min-height: 260px;
    border: 1px dashed rgba(212,175,106,.35);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background:
      linear-gradient(135deg, rgba(183,136,66,.06), rgba(119,200,212,.04)),
      #14191c;
}
.fg-ce-image-slot p {
    max-width: 22rem;
    text-align: center;
    color: #aeb6bd;
}
.fg-prototype-note {
    padding: .7rem 1rem;
    border-left: 3px solid var(--wp--preset--color--signal);
    background: rgba(119,200,212,.05);
    color: #cbd0d4;
}


/* =========================
   Farad Gameworks v0.3.1 — Concordance origin story
   ========================= */
.fg-origin-story {
    width: min(1480px, calc(100vw - 2rem));
    max-width: none !important;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-block: clamp(3rem, 7vw, 6rem);
    padding: clamp(1rem, 2.5vw, 1.8rem);
    border: 1px solid rgba(212,175,106,.28);
    border-radius: 18px;
    background:
        radial-gradient(circle at 50% 0%, rgba(183,136,66,.09), transparent 38%),
        linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.008)),
        #0e1113;
    box-shadow: 0 28px 90px rgba(0,0,0,.42);
}
.fg-origin-story__intro {
    width: min(860px, 100%);
    margin: 0 auto clamp(1.35rem, 3vw, 2.2rem);
    text-align: center;
}
.fg-origin-story__intro h2 {
    margin: .2rem 0 .65rem;
    font-size: clamp(2rem, 5vw, 4.2rem);
}
.fg-origin-story__intro p {
    margin-inline: auto;
    max-width: 760px;
    color: #aeb6bd;
}
.fg-origin-story__kicker {
    margin: 0;
    color: #d4af6a !important;
    font-size: .76rem;
    font-weight: 750;
    letter-spacing: .18em;
    text-transform: uppercase;
}
.fg-origin-story__image-link {
    display: block;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(212,175,106,.24);
    background: #080a0b;
    box-shadow: 0 16px 55px rgba(0,0,0,.38);
}
.fg-origin-story__image-link img {
    display: block;
    width: 100%;
    height: auto;
    transition: transform 240ms ease, filter 240ms ease;
}
.fg-origin-story__image-link:hover img,
.fg-origin-story__image-link:focus img {
    transform: scale(1.006);
    filter: brightness(1.035);
}
.fg-origin-story__caption {
    width: min(900px, 100%);
    margin: 1.1rem auto 0;
    text-align: center;
    color: #aeb6bd;
    font-size: .92rem;
}
.fg-origin-story__caption strong {
    color: #e8e2d7;
}
@media (max-width: 782px) {
    .fg-origin-story {
        width: calc(100vw - 1rem);
        padding: .65rem;
        border-radius: 12px;
    }
    .fg-origin-story__image-link { border-radius: 8px; }
}