/* Shared editorial appearance, loaded after component layouts. */
:root {
    --fx-accent: #a83c2e; --fx-accent-strong: #862e23; --fx-ink: #242d36; --fx-muted: #58616a; --fx-bg: #f7f5ef; --fx-border: #d9d5cd; --fx-radius: 8px; --fx-radius-lg: 10px; --fx-shadow: none; --fx-ring: #a83c2e30; --fx-surface: #fffdf8; --fx-card: #fffdf8;
}

html {
    scroll-padding-top: 24px;
}

body {
    background: var(--fx-bg); color: var(--fx-ink);
}

a {
    text-underline-offset: 4px;
}

a:focus-visible,
button:focus-visible,
summary:focus-visible {
    outline: 3px solid var(--fx-accent); outline-offset: 4px;
}

.fx-header {
    background: rgb(255, 253, 248); border-bottom: 1px solid var(--fx-border);
}

.fx-header-inner {
    max-width: 1240px; margin: auto; padding: 18px 24px; display: flex; align-items: center; justify-content: space-between; gap: 28px;
}

.fx-brand {
    display: flex; align-items: center; gap: 12px; color: var(--fx-ink); text-decoration: none; flex-shrink: 0;
}

.fx-brand img {
    width: 52px; height: 52px; object-fit: contain;
}

.fx-brand strong {
    display: block; font-size: 22px; letter-spacing: 2px;
}

.fx-brand small {
    display: block; font-size: 10px; color: var(--fx-muted);
}

.fx-navigation {
    display: flex; gap: 22px; align-items: center;
}

.fx-navigation a {
    color: var(--fx-ink); font-size: 13px; font-weight: 600; text-decoration: none; padding-block: 12px;
}

.fx-navigation a:hover,
.fx-navigation a[aria-current],
.fx-navigation .fx-services-active {
    color: var(--fx-accent); text-decoration: underline;
}

.fx-navigation .fx-login {
    border-left: 1px solid var(--fx-border); padding-left: 22px;
}

.fx-navigation .fx-access,
.fx-menu-toggle {
    background: var(--fx-accent); color: white; padding: 12px 16px; border: 0px; border-radius: 5px;
}

.fx-navigation .fx-access:hover {
    background: var(--fx-accent-strong); color: white;
}

.fx-menu-toggle {
    font-size: 14px;
}

.fx-menu-toggle[hidden] {
    display: none;
}

body .page-content .fx-page-hero,
body.page-home .page-content > .home-container:first-child {
    background: transparent; border: 0px; border-radius: 0px; box-shadow: none; overflow: visible;
}

body .page-content .fx-page-hero {
    max-width: 1180px; padding: 64px 20px; gap: 56px; align-items: center;
}

body.page-home .page-content > .home-container:first-child {
    max-width: 1220px; margin: 0px auto; min-height: 0px !important;
}

body.page-home .page-content > .home-container:first-child::before,
body.page-home .page-content > .home-container:first-child::after {
    display: none;
}

body.page-home .page-content > .home-container:first-child .home-hero-inner {
    padding: 64px 24px !important;
}

body.page-home .home-hero-content {
    margin-top: 0px !important;
}

body .page-content .fx-page-hero h1,
body.page-home .page-content .home-hero-title {
    letter-spacing: -0.045em; max-width: 19ch; color: var(--fx-ink) !important; font-size: clamp(36px, 4.6vw, 62px) !important; line-height: 1.09 !important; text-shadow: none !important;
}

body .page-content .fx-page-hero p,
body.page-home .page-content .home-hero-description,
body.page-home .page-content .home-hero-subtitle {
    color: var(--fx-muted) !important; text-shadow: none !important; font-size: 17px !important; line-height: 1.75 !important;
}

body .page-content .fx-page-hero [class$="-kicker"],
body.page-home .foxiam-hero-kicker {
    color: var(--fx-accent); letter-spacing: 1.8px; font-size: 11px;
}

body .page-content .fx-hero-aside {
    background: rgb(234, 230, 220); border: 1px solid var(--fx-border); border-radius: 8px; box-shadow: none; padding: 30px;
}

body .page-content .fx-hero-aside :is(h2, h3, strong, li) {
    color: var(--fx-ink) !important;
}

body .page-content .fx-hero-aside a {
    color: var(--fx-accent);
}

body .page-content .fx-hero-aside li::before {
    background: var(--fx-accent);
}

body .page-content .fx-section-inner {
    max-width: 1180px; padding: 44px 24px; border-right: 0px; border-bottom: 0px; border-left: 0px; border-image: initial; border-top: 1px solid var(--fx-border); border-radius: 0px; box-shadow: none; background: transparent;
}

body .page-content .fx-card {
    background: rgb(255, 253, 248); border: 1px solid var(--fx-border); border-radius: 6px; box-shadow: none;
}

body .page-content :is(h2, h3) {
    letter-spacing: -0.025em;
}

body .page-content [class$="-section-header"] h2 {
    font-size: clamp(28px, 3vw, 38px); line-height: 1.2;
}

body .page-content a[class*="-button"],
body.page-home .page-content .home-button,
body .foxiam-site-footer-button-primary,
body #contact-submit {
    letter-spacing: 0px; min-height: 44px; border-radius: 5px !important; box-shadow: none !important;
}

body .page-content a[class*="-button-primary"],
body.page-home .page-content .home-button,
body .foxiam-site-footer-button-primary,
body #contact-submit {
    background: var(--fx-accent) !important; color: rgb(255, 255, 255) !important; border-color: var(--fx-accent) !important;
}

body .page-content a[class*="-button-primary"]:hover,
body.page-home .page-content .home-button:hover,
body #contact-submit:hover {
    background: var(--fx-accent-strong) !important;
}

body .page-content .fx-page-hero a[class*="-button-secondary"],
body.page-home .foxiam-hero-secondary {
    border-color: rgb(188, 183, 172); background: transparent; box-shadow: none; border-radius: 5px; color: var(--fx-ink) !important;
}

body.page-home .foxiam-hero-note,
body.page-home .foxiam-hero-note a {
    color: var(--fx-muted);
}

body.page-home .foxiam-hero-layout {
    grid-template-columns: 1.05fr 1fr; gap: 48px; align-items: center;
}

.fx-book-showcase {
    margin: 0px; padding: 26px; background: rgb(231, 227, 216); border-radius: 8px; min-width: 0px;
}

.fx-showcase-label {
    display: flex; justify-content: space-between; gap: 12px; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: rgb(85, 86, 79);
}

.fx-book-covers {
    display: flex; justify-content: center; align-items: center; padding: 50px 12px;
}

.fx-book-covers img {
    width: 35%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; box-shadow: rgba(36, 45, 54, 0.2) 0px 15px 22px;
}

.fx-book-covers img:first-child {
    transform: rotate(-12deg) translateX(10px);
}

.fx-book-covers img:nth-child(2) {
    transform: translateY(-10px); z-index: 1;
}

.fx-book-covers img:last-child {
    transform: rotate(12deg) translateX(-10px);
}

.fx-book-showcase figcaption {
    display: grid; gap: 6px; padding-top: 18px; border-top: 1px solid rgb(201, 198, 188); color: var(--fx-ink);
}

.fx-book-showcase figcaption strong {
    font-size: 22px;
}

.fx-book-showcase figcaption span {
    font-size: 12px; color: rgb(97, 96, 89);
}

body .site-primary-footer-wrap[data-section="section-primary-footer-builder"],
body .page-content [class*="-section-cta"] .fx-section-inner,
body.page-home .foxiam-home-cta-panel {
    border-radius: 8px; box-shadow: none; background: rgb(34, 46, 57) !important;
}

body .site-primary-footer-wrap[data-section="section-primary-footer-builder"] {
    border-radius: 0px; margin-top: 48px;
}

body .page-content [class*="-section-cta"] .fx-section-inner {
    padding: 36px;
}

body .page-content [class*="-section-cta"] .fx-section-inner :is(h2, p) {
    color: rgb(247, 245, 239) !important;
}

body .foxiam-site-footer-kicker {
    color: rgb(240, 175, 150);
}

body .page-content .foxiam-contact-form-card,
body .page-content .foxiam-contact-info-card {
    box-shadow: none; border-radius: 8px; border-color: var(--fx-border); background: rgb(255, 253, 248);
}

body #contact-form :is(input:not([type="hidden"]), textarea) {
    border-radius: 5px; border-color: rgb(188, 183, 172); background: rgb(255, 255, 255); color: var(--fx-ink);
}

body #contact-form :is(input, textarea):focus {
    border-color: var(--fx-accent); box-shadow: 0 0 0 3px var(--fx-ring);
}

@media (max-width: 1100px) {
    .fx-header-inner {
        flex-wrap: wrap; gap: 12px;
    }

    .fx-menu-toggle:not([hidden]) {
        display: inline-flex; gap: 16px;
    }

    .fx-navigation {
        width: 100%; flex-wrap: wrap; gap: 8px 24px; padding-top: 12px; border-top: 1px solid var(--fx-border);
    }

    .fx-navigation[hidden] {
        display: none;
    }

    .fx-navigation .fx-login {
        border: 0px; padding-left: 0px;
    }

    body .page-content .fx-page-hero {
        gap: 28px;
    }
}

@media (max-width: 768px) {
    .fx-header-inner {
        padding: 12px 20px;
    }

    .fx-brand small {
        font-size: 9px;
    }

    .fx-navigation {
        align-items: stretch; flex-direction: column;
    }

    .fx-navigation a {
        padding: 10px 12px;
    }

    body .page-content .fx-page-hero,
body.page-home .foxiam-hero-layout {
        grid-template-columns: 1fr;
    }

    body .page-content .fx-page-hero {
        padding: 32px 8px;
    }

    body.page-home .page-content > .home-container:first-child .home-hero-inner {
        padding: 32px 16px !important;
    }

    body .page-content .fx-section-inner {
        padding: 28px 14px;
    }

    body .page-content .fx-hero-aside {
        padding: 22px;
    }

    .fx-book-showcase {
        padding: 22px;
    }

    .fx-book-covers {
        max-width: 440px; margin: auto; padding-block: 38px;
    }

    .fx-showcase-label {
        font-size: 9px;
    }

    body .page-content [class*="-section-cta"] .fx-section-inner {
        padding: 26px 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
::before,
::after {
        animation: auto ease 0s 1 normal none running none !important; transition: none !important; scroll-behavior: auto !important;
    }
}

.fx-service-navigation {
    max-width: 1192px; margin: auto; padding: 12px 24px; display: flex; flex-wrap: wrap; gap: 12px 28px; border-top: 1px solid var(--fx-border);
}

.fx-service-navigation a {
    font-size: 12px; color: var(--fx-muted); text-decoration: none; padding: 6px 0px;
}

.fx-service-navigation a:hover,
.fx-service-navigation a[aria-current] {
    color: var(--fx-accent); text-decoration: underline;
}

body .page-content .fx-page-hero [class$="-note"] a {
    color: var(--fx-accent) !important;
}

body .page-content .fx-section-inner :is([class$="-kicker"], [class$="-label"]) {
    color: var(--fx-accent);
}

body .page-content [class*="-section-cta"] .fx-section-inner [class$="-kicker"] {
    color: rgb(240, 175, 150);
}

body .page-content .fx-card :is(h2, h3, strong) {
    color: var(--fx-ink);
}

body .page-content .fx-card :is(p, li) {
    color: var(--fx-muted);
}

body .page-content .fx-card a[class$="-text-link"] {
    color: var(--fx-accent);
}

body .page-content .fx-card a[class$="-text-link"]:is(:hover, :focus-visible) {
    color: var(--fx-accent-strong); text-decoration: underline;
}

body.page-home .foxiam-home-portal-panel {
    background: rgb(234, 230, 220); border-color: var(--fx-border); border-radius: 8px;
}

body.page-home .foxiam-home-step-index {
    background: rgb(238, 229, 221); color: var(--fx-accent); border-radius: 5px;
}

body.page-home .foxiam-home-support-links a {
    background: rgb(238, 229, 221); color: var(--fx-accent); border-radius: 5px;
}

body.page-home .foxiam-home-audience-list span {
    border-radius: 5px; box-shadow: none; border-color: var(--fx-border);
}

body .page-content .fx-page-hero > div {
    min-width: 0px;
}

body.page-home .page-content > .home-container:first-child .home-hero-title {
    color: var(--fx-ink) !important;
}

body.page-home .page-content > .home-container:first-child :is(.home-hero-subtitle, .home-hero-description) {
    color: var(--fx-muted) !important;
}

body.page-home .page-content .foxiam-hero-note {
    color: var(--fx-muted) !important;
}

body .page-content .fx-card [class$="-label"] {
    color: var(--fx-accent);
}

body .page-content .fx-card li::before {
    background: var(--fx-accent); box-shadow: none;
}

body .page-content .foxiam-testimonial-block {
    background: rgb(255, 253, 248); border-radius: 6px; box-shadow: none;
}

body .page-content :is(.foxiam-about-cta, .foxiam-books-cta) {
    background: transparent; border: 0px; border-radius: 0px; box-shadow: none; padding: 0px;
}

body .page-content .foxiam-about-profile-card {
    background: rgb(255, 253, 248); border: 1px solid var(--fx-border); border-radius: 6px; box-shadow: none;
}
