/*
Theme Name: Fanfic da Duda Trilha Sonora
Theme URI: https://fanficdaduda.com.br/
Author: Fanfic da Duda
Description: Tema editorial com trilha sonora manual do Spotify dentro dos capítulos.
Version: 0.6.5
Requires at least: 6.4
Requires PHP: 8.0
License: GNU General Public License v2 or later
Text Domain: fanfic-da-duda
*/

:root {
    --fd-blue: #E5487B;
    --fd-blue-dark: #C93667;
    --fd-cyan: #F25D92;
    --fd-aqua: #F9D5E2;
    --fd-navy: #332A30;
    --fd-text: #51474D;
    --fd-muted: #857B81;
    --fd-border: #F0E4E9;
    --fd-soft: #FFF9FB;
    --fd-white: #FFFFFF;
    --fd-pink: #E5487B;
    --fd-purple: #D98AA7;
    --fd-shadow: 0 16px 42px rgba(83, 53, 66, .09);
    --fd-radius: 21px;
    --fd-container: 1360px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    margin: 0;
    color: var(--fd-text);
    background: #fff;
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.6;
}

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

a { color: inherit; text-decoration: none; }

img { display: block; max-width: 100%; }

button, input, textarea, select { font: inherit; }

.fd-container {
    width: min(calc(100% - 48px), var(--fd-container));
    margin-inline: auto;
}

.fd-section { padding: 23px 0; }

.fd-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 15px;
}

.fd-section-heading h2,
.fd-story-title,
.fd-chapter-title {
    margin: 0;
    color: var(--fd-navy);
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 500;
}

.fd-section-heading h2 { font-size: clamp(1.8rem, 3vw, 2.45rem); }

.fd-link {
    color: var(--fd-blue);
    font-weight: 700;
}

.fd-site-header {
    position: sticky;
    top: 0;
    z-index: 40;
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(15px);
    border-bottom: 1px solid rgba(240,220,228,.92);
}

.fd-header-inner {
    min-height: 88px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}

.fd-logo img { width: 205px; height: auto; }

.fd-main-nav {
    display: flex;
    align-items: center;
    gap: 27px;
    font-size: .95rem;
    font-weight: 650;
}

.fd-main-nav a { position: relative; }

.fd-main-nav a:hover,
.fd-main-nav a:focus { color: var(--fd-blue); }

.fd-header-cta {
    padding: 11px 19px;
    border-radius: 999px;
    color: #fff !important;
    background: var(--fd-blue);
    box-shadow: 0 10px 24px rgba(229,72,123,.24);
}

.fd-menu-toggle {
    display: none;
    border: 0;
    background: transparent;
    font-size: 1.5rem;
    color: var(--fd-navy);
    cursor: pointer;
}

.fd-hero { padding: 18px 0 9px; }

.fd-hero-card {
    overflow: hidden;
    min-height: 370px;
    display: grid;
    grid-template-columns: .82fr 1.42fr;
    border: 1px solid var(--fd-border);
    border-radius: 21px;
    background:
        radial-gradient(circle at 7% 15%, rgba(242,93,146,.17), transparent 22%),
        linear-gradient(135deg, #fffafb 0%, #fff2f7 100%);
    box-shadow: var(--fd-shadow);
}

.fd-hero-copy {
    padding: clamp(28px, 3.5vw, 50px);
    position: relative;
    z-index: 2;
}

.fd-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
    padding: 8px 13px;
    border-radius: 999px;
    color: #B52B5D;
    background: #FBE1EA;
    font-size: .77rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.fd-hero-title {
    max-width: 560px;
    margin: 0 0 18px;
    color: var(--fd-navy);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.55rem, 4vw, 4.2rem);
    font-weight: 500;
    line-height: .98;
}

.fd-hero-copy p {
    max-width: 560px;
    margin: 0 0 21px;
    color: var(--fd-muted);
    font-size: 1.05rem;
}

.fd-actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }

.fd-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 50px;
    padding: 0 22px;
    border: 0;
    border-radius: 13px;
    cursor: pointer;
    font-weight: 800;
    transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}

.fd-button:hover { transform: translateY(-2px); }

.fd-button-primary {
    color: #fff;
    background: var(--fd-blue);
    box-shadow: 0 12px 26px rgba(229,72,123,.25);
}

.fd-button-aqua {
    color: #fff;
    background: linear-gradient(135deg, #F25D92, #E5487B);
    box-shadow: 0 12px 26px rgba(229,72,123,.22);
}

.fd-button-soft {
    color: var(--fd-blue);
    background: #FFF0F5;
}

.fd-hero-media {
    min-height: 370px;
    position: relative;
    background:
        radial-gradient(circle at 70% 20%, rgba(255,255,255,.45), transparent 25%),
        linear-gradient(145deg, #A98A96, #4D3B44 52%, #281F24);
}

.fd-hero-media img {
    width: 100%;
    height: 100%;
    min-height: 370px;
    object-fit: cover;
}

.fd-hero-media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(87,35,56,.03), rgba(37,20,27,.34));
}

.fd-hero-quote {
    position: absolute;
    right: 28px;
    bottom: 28px;
    z-index: 2;
    width: min(300px, calc(100% - 56px));
    padding: 19px;
    border-radius: 18px;
    color: #fff;
    background: rgba(48,25,35,.58);
    backdrop-filter: blur(10px);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.17rem;
    line-height: 1.35;
}

.fd-hero-quote::before {
    content: "“";
    display: block;
    height: 24px;
    color: var(--fd-cyan);
    font-size: 3rem;
    line-height: 1;
}

.fd-personalizer-wrap { padding: 8px 0; }

.fd-personalizer {
    display: grid;
    grid-template-columns: .9fr 2.45fr;
    gap: 27px;
    align-items: center;
    padding: 22px 30px;
    border: 1px solid #F3B9CE;
    border-radius: var(--fd-radius);
    background:
        radial-gradient(circle at 5% 60%, rgba(242,93,146,.14), transparent 25%),
        radial-gradient(circle at 95% 30%, rgba(229,72,123,.09), transparent 23%),
        linear-gradient(135deg, #fffafb, #fff2f7);
}

.fd-personalizer h2 {
    margin: 0 0 7px;
    color: var(--fd-navy);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.9rem, 2.5vw, 2.65rem);
    line-height: 1;
}

.fd-personalizer h2 span { color: var(--fd-cyan); }

.fd-personalizer p { margin: 0; color: var(--fd-muted); }

.fd-personalizer-form {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 14px;
    align-items: end;
}

.fd-field label {
    display: block;
    margin-bottom: 7px;
    color: var(--fd-navy);
    font-size: .78rem;
    font-weight: 800;
}

.fd-field input {
    width: 100%;
    height: 52px;
    padding: 0 15px;
    border: 1px solid var(--fd-border);
    border-radius: 12px;
    outline: 0;
    background: #fff;
    color: var(--fd-text);
    box-shadow: 0 6px 18px rgba(137,54,88,.05);
}

.fd-field input:focus {
    border-color: var(--fd-cyan);
    box-shadow: 0 0 0 4px rgba(242,93,146,.13);
}

.fd-chapter-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.fd-chapter-card {
    min-height: 155px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: end;
    border-radius: 17px;
    background: linear-gradient(135deg, #5A3C49, #281D23);
    box-shadow: 0 12px 28px rgba(100,38,63,.14);
}

.fd-card-media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fd-card-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(5,18,33,.06), rgba(5,18,33,.88));
}

.fd-chapter-card-content {
    position: relative;
    z-index: 2;
    width: 100%;
    padding: 17px;
    color: #fff;
}

.fd-chip {
    display: inline-flex;
    padding: 5px 8px;
    border-radius: 7px;
    color: #7B2144;
    background: #F9D5E2;
    font-size: .67rem;
    font-weight: 900;
}

.fd-chapter-card h3 {
    margin: 8px 0 2px;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.25rem;
    font-weight: 500;
    line-height: 1.12;
}

.fd-chapter-card small { opacity: .82; }

.fd-story-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 18px;
}

.fd-story-card {
    overflow: hidden;
    border: 1px solid var(--fd-border);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(113,43,70,.08);
    transition: transform .2s ease, box-shadow .2s ease;
}

.fd-story-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 38px rgba(113,43,70,.14);
}

.fd-story-cover {
    aspect-ratio: 3 / 4;
    position: relative;
    overflow: hidden;
    background: linear-gradient(145deg, #B68A9B, #46323C);
}

.fd-story-cover img { width: 100%; height: 100%; object-fit: cover; }

.fd-story-cover::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 35%, rgba(8,21,37,.88));
}

.fd-story-cover-title {
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 40px;
    z-index: 2;
    color: #fff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.35rem;
    line-height: 1.08;
    text-align: center;
}

.fd-story-cover-tag {
    position: absolute;
    left: 50%;
    bottom: 14px;
    z-index: 2;
    transform: translateX(-50%);
    padding: 4px 9px;
    border-radius: 999px;
    color: #fff;
    background: rgba(91,42,61,.84);
    font-size: .66rem;
    white-space: nowrap;
}

.fd-placeholder-art {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 72% 23%, rgba(255,255,255,.24), transparent 20%),
        linear-gradient(145deg, var(--a, #667e9f), var(--b, #142b46));
}

.fd-art-1 { --a: #C98AA2; --b: #563846; }
.fd-art-2 { --a: #A58592; --b: #44333B; }
.fd-art-3 { --a: #D8A1B3; --b: #654653; }
.fd-art-4 { --a: #E1A4B9; --b: #74485A; }
.fd-art-5 { --a: #9A7E89; --b: #3D2D34; }
.fd-art-6 { --a: #E0B5C4; --b: #8A6474; }

.fd-quote-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.fd-quote-card {
    min-height: 150px;
    padding: 19px;
    border: 1px solid var(--fd-border);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(113,43,70,.06);
}

.fd-quote-mark {
    color: var(--fd-cyan);
    font-size: 2.5rem;
    line-height: .7;
}

.fd-quote-card blockquote {
    margin: 9px 0 15px;
    color: var(--fd-navy);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.13rem;
    line-height: 1.4;
}

.fd-quote-card cite {
    color: var(--fd-muted);
    font-size: .78rem;
    font-style: normal;
}

.fd-category-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 14px;
}

.fd-category-card {
    min-height: 78px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    padding: 14px;
    border: 1px solid var(--fd-border);
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(113,43,70,.05);
    font-weight: 800;
}

.fd-category-icon { font-size: 1.45rem; }

.fd-site-footer {
    margin-top: 30px;
    padding: 38px 0 22px;
    border-top: 1px solid #F1D5E0;
    background: linear-gradient(180deg, #FFF7FA, #FCEAF1);
}

.fd-footer-grid {
    display: grid;
    grid-template-columns: 1.1fr 1fr 1fr 1.25fr;
    gap: 38px;
}

.fd-footer-logo { width: 195px; margin-bottom: 14px; }

.fd-footer-title {
    margin: 0 0 14px;
    color: var(--fd-blue);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.25rem;
}

.fd-footer-col p,
.fd-footer-col li {
    color: var(--fd-muted);
    font-size: .9rem;
}

.fd-footer-col ul { margin: 0; padding: 0; list-style: none; }

.fd-footer-col li + li { margin-top: 7px; }

.fd-footer-bottom {
    margin-top: 38px;
    padding-top: 20px;
    display: flex;
    justify-content: space-between;
    gap: 24px;
    border-top: 1px solid #F1D5E0;
    color: var(--fd-muted);
    font-size: .8rem;
}

.fd-page-shell { padding: 42px 0 70px; }

.fd-archive-hero,
.fd-story-hero,
.fd-chapter-head {
    padding: 34px;
    border: 1px solid var(--fd-border);
    border-radius: 24px;
    background: linear-gradient(135deg, #FFF9FB, #FFF0F5);
}

.fd-archive-hero h1,
.fd-story-hero h1,
.fd-chapter-head h1 {
    margin: 0;
    color: var(--fd-navy);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.5rem, 5vw, 4.7rem);
    font-weight: 500;
    line-height: 1.02;
}

.fd-archive-hero p,
.fd-story-hero p,
.fd-chapter-head p { color: var(--fd-muted); }

.fd-story-layout {
    display: grid;
    grid-template-columns: 310px 1fr;
    gap: 42px;
    margin-top: 34px;
}

.fd-story-main-cover {
    overflow: hidden;
    aspect-ratio: 3/4;
    border-radius: 20px;
    background: linear-gradient(145deg, #B08B9A, #49343E);
    box-shadow: var(--fd-shadow);
}

.fd-story-main-cover img { width: 100%; height: 100%; object-fit: cover; }

.fd-story-content { font-size: 1.04rem; }

.fd-chapter-list {
    margin-top: 28px;
    border: 1px solid var(--fd-border);
    border-radius: 18px;
    overflow: hidden;
}

.fd-chapter-list a {
    display: grid;
    grid-template-columns: 80px 1fr auto;
    gap: 14px;
    align-items: center;
    padding: 17px 20px;
    background: #fff;
}

.fd-chapter-list a + a { border-top: 1px solid var(--fd-border); }

.fd-chapter-list a:hover { background: #FFF8FA; }

.fd-chapter-number {
    color: var(--fd-blue);
    font-weight: 900;
}

.fd-chapter-reader {
    width: min(100%, 800px);
    margin: 40px auto 0;
}

.fd-reading-personalizer {
    margin-bottom: 28px;
    padding: 19px;
    border: 1px solid #F2BED1;
    border-radius: 17px;
    background: #FFF7FA;
}

.fd-reading-personalizer .fd-personalizer-form {
    grid-template-columns: 1fr 1fr auto;
}

.fd-chapter-content {
    color: #453940;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.18rem, 2vw, 1.38rem);
    line-height: 1.95;
}

.fd-chapter-content p { margin: 0 0 1.3em; }

.fd-chapter-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 48px;
}

.fd-chapter-nav a {
    padding: 20px;
    border: 1px solid var(--fd-border);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 10px 26px rgba(113,43,70,.06);
}

.fd-chapter-nav a:last-child { text-align: right; }

.fd-empty {
    padding: 32px;
    border: 1px dashed #DDB8C7;
    border-radius: 18px;
    color: var(--fd-muted);
    background: #FFF8FA;
    text-align: center;
}

.fd-prose {
    max-width: 820px;
    color: var(--fd-text);
}

.fd-prose img { border-radius: 16px; }

@media (max-width: 1020px) {
    .fd-story-grid { grid-template-columns: repeat(3, 1fr); }
    .fd-chapter-grid, .fd-quote-grid { grid-template-columns: repeat(2, 1fr); }
    .fd-category-grid { grid-template-columns: repeat(3, 1fr); }
    .fd-personalizer { grid-template-columns: 1fr; }
    .fd-personalizer-form { grid-template-columns: 1fr 1fr; }
    .fd-personalizer-form .fd-button { grid-column: 1 / -1; }
    .fd-footer-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 820px) {
    body.admin-bar .fd-site-header { top: 46px; }
    .fd-menu-toggle { display: block; }
    .fd-main-nav {
        display: none;
        position: absolute;
        top: 88px;
        left: 20px;
        right: 20px;
        padding: 19px;
        flex-direction: column;
        align-items: stretch;
        border: 1px solid var(--fd-border);
        border-radius: 18px;
        background: #fff;
        box-shadow: var(--fd-shadow);
    }
    .fd-main-nav.is-open { display: flex; }
    .fd-hero-card { grid-template-columns: 1fr; }
    .fd-hero-media { min-height: 350px; }
    .fd-hero-media img { min-height: 350px; }
    .fd-story-layout { grid-template-columns: 1fr; }
    .fd-story-main-cover { width: min(100%, 340px); }
}

@media (max-width: 650px) {
    .fd-container { width: min(calc(100% - 28px), var(--fd-container)); }
    .fd-section { padding: 21px 0; }
    .fd-hero { padding-top: 14px; }
    .fd-hero-copy { padding: 34px 25px; }
    .fd-hero-media, .fd-hero-media img { min-height: 300px; }
    .fd-hero-quote { right: 18px; bottom: 18px; width: calc(100% - 36px); }
    .fd-personalizer { padding: 25px 20px; gap: 22px; }
    .fd-personalizer-form,
    .fd-reading-personalizer .fd-personalizer-form { grid-template-columns: 1fr; }
    .fd-personalizer-form .fd-button { grid-column: auto; }
    .fd-chapter-grid,
    .fd-quote-grid,
    .fd-story-grid,
    .fd-category-grid,
    .fd-footer-grid { grid-template-columns: 1fr; }
    .fd-story-grid { grid-template-columns: repeat(2, 1fr); }
    .fd-section-heading { align-items: start; flex-direction: column; gap: 8px; }
    .fd-footer-bottom { flex-direction: column; }
    .fd-chapter-nav { grid-template-columns: 1fr; }
    .fd-chapter-nav a:last-child { text-align: left; }
    .fd-archive-hero,
    .fd-story-hero,
    .fd-chapter-head { padding: 25px; }
    .fd-chapter-list a { grid-template-columns: 60px 1fr; }
    .fd-chapter-list a span:last-child { display: none; }
}


/* Ajustes visuais v0.2.0: paleta rosa, menos margens e proporções mais próximas da prévia aprovada. */
.fd-header-inner,
.fd-hero .fd-container,
.fd-personalizer-wrap .fd-container,
.fd-section .fd-container,
.fd-site-footer .fd-container {
    width: min(calc(100% - 48px), var(--fd-container));
}

.fd-section-heading h2 {
    font-size: clamp(1.65rem, 2.3vw, 2.2rem);
}

.fd-chapter-card {
    min-height: 145px;
}

.fd-story-grid {
    gap: 15px;
}

.fd-quote-grid,
.fd-category-grid {
    gap: 13px;
}

.fd-category-card {
    min-height: 70px;
}

@media (max-width: 1100px) {
    .fd-logo img { width: 185px; }
    .fd-main-nav { gap: 18px; }
    .fd-hero-card { grid-template-columns: .95fr 1.25fr; }
    .fd-hero-title { font-size: clamp(2.5rem, 4.8vw, 3.75rem); }
}

@media (max-width: 820px) {
    .fd-header-inner,
    .fd-hero .fd-container,
    .fd-personalizer-wrap .fd-container,
    .fd-section .fd-container,
    .fd-site-footer .fd-container {
        width: min(calc(100% - 30px), var(--fd-container));
    }
    .fd-logo img { width: 165px; }
    .fd-hero-card { grid-template-columns: 1fr; }
    .fd-hero-media,
    .fd-hero-media img { min-height: 320px; }
}

@media (max-width: 650px) {
    .fd-logo img { width: 150px; }
    .fd-hero-title { font-size: clamp(2.35rem, 12vw, 3.3rem); }
    .fd-hero-copy { padding: 30px 22px; }
    .fd-personalizer { padding: 22px 18px; }
}


/* =========================================================
   VERSÃO 0.3.0 — ROSA CLEAN
   Branco predominante, rosa como identidade e mais respiro.
   ========================================================= */

body {
    background: #FFFFFF;
}

.fd-container,
.fd-header-inner,
.fd-hero .fd-container,
.fd-personalizer-wrap .fd-container,
.fd-section .fd-container,
.fd-site-footer .fd-container {
    width: min(calc(100% - 64px), var(--fd-container));
}

/* Mais respiro entre as seções, sem voltar ao excesso inicial. */
.fd-section {
    padding: 36px 0;
}

.fd-section-heading {
    margin-bottom: 21px;
}

.fd-section-heading h2 {
    color: #332A30;
    font-size: clamp(1.8rem, 2.5vw, 2.35rem);
}

/* Cabeçalho branco e leve. */
.fd-site-header {
    background: rgba(255, 255, 255, .97);
    border-bottom-color: #F2E8EC;
}

.fd-header-inner {
    min-height: 90px;
}

.fd-logo img {
    width: 205px;
}

/* Banner: base branca, com rosa apenas como nuance. */
.fd-hero {
    padding: 25px 0 14px;
}

.fd-hero-card {
    min-height: 410px;
    grid-template-columns: .9fr 1.35fr;
    border-color: #EFE6EA;
    background:
        radial-gradient(circle at 8% 14%, rgba(242, 93, 146, .07), transparent 25%),
        linear-gradient(135deg, #FFFFFF 0%, #FFFCFD 60%, #FFF6F9 100%);
    box-shadow: 0 18px 48px rgba(73, 49, 59, .09);
}

.fd-hero-copy {
    padding: clamp(36px, 4.1vw, 58px);
}

.fd-eyebrow {
    color: #B82F60;
    background: #FDEAF1;
}

.fd-hero-title {
    color: #332A30;
    font-size: clamp(2.7rem, 4.3vw, 4.45rem);
}

.fd-hero-copy p {
    color: #756B71;
    margin-bottom: 26px;
}

.fd-hero-media,
.fd-hero-media img {
    min-height: 410px;
}

.fd-hero-media {
    background:
        radial-gradient(circle at 70% 20%, rgba(255, 255, 255, .40), transparent 25%),
        linear-gradient(145deg, #B8A5AD, #66545C 53%, #342A2F);
}

/* Personalização volta a ter presença e tamanho confortável. */
.fd-personalizer-wrap {
    padding: 20px 0 12px;
}

.fd-personalizer {
    grid-template-columns: 1.05fr 2.3fr;
    gap: 36px;
    padding: 30px 36px;
    border-color: #F2D9E2;
    background:
        radial-gradient(circle at 5% 55%, rgba(242, 93, 146, .07), transparent 25%),
        radial-gradient(circle at 95% 30%, rgba(229, 72, 123, .05), transparent 25%),
        linear-gradient(135deg, #FFFFFF, #FFF9FB 58%, #FFF3F7);
    box-shadow: 0 12px 32px rgba(84, 55, 67, .05);
}

.fd-personalizer h2 {
    font-size: clamp(2.05rem, 3vw, 3rem);
}

.fd-personalizer h2 span {
    color: #E5487B;
}

.fd-personalizer-form {
    gap: 16px;
}

.fd-field input {
    height: 54px;
    border-color: #EEE2E7;
    box-shadow: 0 6px 18px rgba(75, 52, 61, .04);
}

/* Cards predominantemente brancos e neutros. */
.fd-story-card,
.fd-quote-card,
.fd-category-card {
    background: #FFFFFF;
    border-color: #F0E4E9;
}

.fd-story-card {
    box-shadow: 0 10px 28px rgba(73, 49, 59, .07);
}

.fd-quote-card {
    min-height: 158px;
    padding: 22px;
    box-shadow: 0 10px 26px rgba(73, 49, 59, .05);
}

.fd-quote-mark,
.fd-link,
.fd-footer-title {
    color: #E5487B;
}

/* Categorias: somente branco e variações de rosa, sem ícones coloridos aleatórios. */
.fd-category-grid {
    gap: 16px;
}

.fd-category-card {
    min-height: 78px;
    color: #704656;
    border: 1px solid #F1DCE4;
    box-shadow: 0 8px 22px rgba(104, 60, 77, .05);
}

.fd-category-card:nth-child(1) { background: #FFF6F9; }
.fd-category-card:nth-child(2) { background: #FFFAFC; }
.fd-category-card:nth-child(3) { background: #FFF4F8; }
.fd-category-card:nth-child(4) { background: #FFF8FA; }
.fd-category-card:nth-child(5) { background: #FFF3F7; }
.fd-category-card:nth-child(6) { background: #FFFAFC; }

.fd-category-card:hover {
    border-color: #F2BFD1;
    background: #FDECF2;
}

.fd-category-icon {
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 38px;
    border: 1px solid #F4CCDA;
    border-radius: 50%;
    color: #E5487B;
    background: #FFFFFF;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.18rem;
    line-height: 1;
}

/* Rodapé muito claro, como na prévia aprovada. */
.fd-site-footer {
    margin-top: 45px;
    padding: 46px 0 24px;
    border-top-color: #F0E3E8;
    background: linear-gradient(180deg, #FFFBFC, #FFF5F8);
}

.fd-footer-bottom {
    border-top-color: #EFDDE4;
}

/* Páginas internas também seguem a direção clean. */
.fd-archive-hero,
.fd-story-hero,
.fd-chapter-head {
    border-color: #F0E2E8;
    background: linear-gradient(135deg, #FFFFFF, #FFF8FA);
}

.fd-reading-personalizer {
    border-color: #F1D8E1;
    background: #FFF9FB;
}

@media (max-width: 1100px) {
    .fd-container,
    .fd-header-inner,
    .fd-hero .fd-container,
    .fd-personalizer-wrap .fd-container,
    .fd-section .fd-container,
    .fd-site-footer .fd-container {
        width: min(calc(100% - 48px), var(--fd-container));
    }

    .fd-hero-card {
        grid-template-columns: .98fr 1.22fr;
    }

    .fd-personalizer {
        gap: 28px;
        padding: 28px 30px;
    }
}

@media (max-width: 820px) {
    .fd-container,
    .fd-header-inner,
    .fd-hero .fd-container,
    .fd-personalizer-wrap .fd-container,
    .fd-section .fd-container,
    .fd-site-footer .fd-container {
        width: min(calc(100% - 30px), var(--fd-container));
    }

    .fd-section {
        padding: 31px 0;
    }

    .fd-personalizer {
        grid-template-columns: 1fr;
        padding: 28px 25px;
    }

    .fd-hero-media,
    .fd-hero-media img {
        min-height: 340px;
    }
}

@media (max-width: 650px) {
    .fd-section {
        padding: 27px 0;
    }

    .fd-personalizer-wrap {
        padding: 16px 0 8px;
    }

    .fd-personalizer {
        padding: 26px 20px;
        gap: 24px;
    }

    .fd-category-card {
        min-height: 72px;
    }
}


/* =========================================================
   VERSÃO 0.3.1 — FUNDO TOTALMENTE BRANCO
   O rosa permanece apenas em detalhes, bordas, ícones e ações.
   ========================================================= */

html,
body,
main,
.fd-page-shell,
.fd-section,
.fd-hero,
.fd-personalizer-wrap {
    background: #FFFFFF !important;
}

.fd-site-header {
    background: rgba(255, 255, 255, .98) !important;
}

/* Grandes blocos também deixam de criar sensação cinza/rosada no fundo. */
.fd-hero-card,
.fd-personalizer,
.fd-archive-hero,
.fd-story-hero,
.fd-chapter-head,
.fd-reading-personalizer {
    background: #FFFFFF !important;
}

/* Cards e categorias: todos brancos, com rosa apenas como detalhe. */
.fd-story-card,
.fd-quote-card,
.fd-category-card,
.fd-chapter-list a,
.fd-chapter-nav a,
.fd-empty {
    background: #FFFFFF !important;
}

.fd-category-card:nth-child(1),
.fd-category-card:nth-child(2),
.fd-category-card:nth-child(3),
.fd-category-card:nth-child(4),
.fd-category-card:nth-child(5),
.fd-category-card:nth-child(6) {
    background: #FFFFFF !important;
}

/* Rodapé branco, sem faixa rosada ou cinza. */
.fd-site-footer {
    background: #FFFFFF !important;
}

/* Mantém identidade rosa apenas nos elementos de ação e acabamento. */
.fd-hero-card,
.fd-personalizer,
.fd-story-card,
.fd-quote-card,
.fd-category-card,
.fd-archive-hero,
.fd-story-hero,
.fd-chapter-head,
.fd-reading-personalizer {
    border-color: #F1DFE6;
}

.fd-category-card:hover {
    background: #FFF8FA !important;
}


/* =========================================================
   VERSÃO 0.4.0 — REFINOS VISUAIS
   Ajustes conforme documento "AJUSTES - parte 2".
   ========================================================= */

/* 1. Fundo branco real em todo o site */
html,
body,
main,
.fd-site-header,
.fd-hero,
.fd-personalizer-wrap,
.fd-section,
.fd-page-shell,
.fd-site-footer,
.fd-archive-hero,
.fd-story-hero,
.fd-chapter-head,
.fd-reading-personalizer,
.fd-hero-card,
.fd-personalizer,
.fd-story-card,
.fd-quote-card,
.fd-category-card,
.fd-chapter-list a,
.fd-chapter-nav a,
.fd-empty {
    background-color: #FFFFFF !important;
}

/* 2. Banner mais próximo da prévia aprovada */
.fd-hero-card {
    min-height: 410px;
    grid-template-columns: 42% 58%;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 18px 46px rgba(70, 45, 56, .10);
}

.fd-hero-copy {
    position: relative;
    padding: 44px 46px 42px 58px;
    background:
        linear-gradient(90deg, rgba(249, 213, 226, .22), rgba(255,255,255,0) 40%),
        #FFFFFF;
}

.fd-hero-copy::before {
    content: "";
    position: absolute;
    left: 18px;
    top: 26px;
    bottom: 26px;
    width: 22px;
    border-left: 2px solid #F6D3DF;
    border-right: 1px solid #F8E6EC;
    opacity: .95;
}

.fd-hero-copy::after {
    content: "♡";
    position: absolute;
    left: 14px;
    top: 82px;
    color: #F25D92;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 2rem;
    transform: rotate(-8deg);
}

.fd-hero-title {
    font-size: clamp(2.8rem, 4.1vw, 4.35rem);
    line-height: 1.01;
}

.fd-hero-media,
.fd-hero-media img {
    min-height: 410px;
}

.fd-hero-media img {
    object-fit: cover;
    object-position: center;
}

.fd-hero-media::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(90deg, rgba(255,255,255,.08), rgba(49,29,37,.12));
    pointer-events: none;
}

.fd-hero-quote {
    z-index: 3;
    right: 26px;
    bottom: 24px;
    width: min(290px, calc(100% - 52px));
    border-radius: 15px;
    background: rgba(57, 31, 42, .60);
}

/* 3. Logo menor e mais delicada */
.fd-logo img {
    width: 172px;
    height: auto;
}

.fd-footer-logo {
    width: 175px;
}

/* 4. Personalização mais delicada e completa */
.fd-personalizer {
    position: relative;
    overflow: hidden;
    padding: 30px 38px;
    border: 1px solid #F3D7E1;
    border-radius: 20px;
    background:
        radial-gradient(circle at 8% 20%, rgba(242,93,146,.08), transparent 22%),
        radial-gradient(circle at 92% 75%, rgba(242,93,146,.06), transparent 24%),
        #FFFFFF !important;
    box-shadow: 0 12px 30px rgba(80, 50, 62, .06);
}

.fd-personalizer::before {
    content: "♡  ✦";
    position: absolute;
    left: 18px;
    top: 14px;
    color: #F25D92;
    font-size: 1.4rem;
    letter-spacing: .35rem;
    opacity: .75;
}

.fd-personalizer::after {
    content: "✎  ♡";
    position: absolute;
    right: 18px;
    bottom: 12px;
    color: #F25D92;
    font-size: 1.55rem;
    letter-spacing: .35rem;
    opacity: .72;
    transform: rotate(-8deg);
}

.fd-personalizer > * {
    position: relative;
    z-index: 2;
}

.fd-personalizer h2 {
    font-size: clamp(2.05rem, 2.7vw, 2.9rem);
}

.fd-personalizer p {
    max-width: 310px;
}

.fd-field input {
    background: #FFFFFF !important;
}

/* 5. Frases com cantos mais arredondados e coração */
.fd-quote-card {
    position: relative;
    overflow: hidden;
    min-height: 165px;
    padding: 24px 24px 22px;
    border-radius: 20px;
}

.fd-quote-card::after {
    content: "♡";
    position: absolute;
    top: 15px;
    right: 17px;
    color: #E9B6C9;
    font-size: 1.35rem;
    line-height: 1;
}

.fd-quote-mark {
    color: #F25D92;
    font-size: 3rem;
}

.fd-quote-card blockquote {
    padding-right: 18px;
}

/* 6. Categorias exatamente no estilo da prévia:
   ícones maiores, rosa, diferentes entre si */
.fd-category-card {
    min-height: 78px;
    justify-content: flex-start;
    padding: 16px 19px;
    color: #E5487B;
    border-radius: 15px;
    background: #FFFFFF !important;
}

.fd-category-icon {
    width: 40px;
    height: 40px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 40px;
    border: 0;
    border-radius: 0;
    color: #F25D92;
    background: transparent !important;
}

.fd-category-icon svg {
    width: 30px;
    height: 30px;
    display: block;
    stroke: currentColor;
}

.fd-category-card:hover {
    color: #C93667;
    border-color: #F0BFD0;
    background: #FFF8FA !important;
}

/* 7. Rodapé com Instagram visível */
.fd-instagram-line {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 10px;
}

.fd-instagram-icon {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
}

.fd-instagram-icon svg {
    width: 24px;
    height: 24px;
    display: block;
}

@media (max-width: 1100px) {
    .fd-logo img { width: 160px; }

    .fd-hero-card {
        grid-template-columns: 46% 54%;
    }

    .fd-hero-copy {
        padding: 38px 34px 38px 50px;
    }
}

@media (max-width: 820px) {
    .fd-logo img { width: 150px; }

    .fd-hero-card {
        grid-template-columns: 1fr;
    }

    .fd-hero-copy {
        padding: 34px 25px 34px 42px;
    }

    .fd-hero-copy::before {
        left: 12px;
    }

    .fd-hero-copy::after {
        left: 8px;
    }
}

@media (max-width: 650px) {
    .fd-logo img { width: 142px; }

    .fd-personalizer {
        padding: 28px 20px;
    }

    .fd-category-card {
        justify-content: center;
    }
}


/* VERSÃO 0.4.1 — BANNER INTEGRADO */
.fd-hero-card {
    position: relative;
    display: block;
    min-height: 430px;
    overflow: hidden;
    border-radius: 20px;
    background: #FFFFFF;
    box-shadow: 0 18px 46px rgba(70, 45, 56, .10);
}

.fd-hero-media {
    position: absolute;
    inset: 0;
    min-height: 430px;
    z-index: 1;
    background:
        radial-gradient(circle at 70% 28%, rgba(255,255,255,.24), transparent 24%),
        linear-gradient(120deg, #F4DDE6 0%, #CDA9B7 42%, #3B2C33 100%);
}

.fd-hero-media img {
    width: 100%;
    height: 100%;
    min-height: 430px;
    object-fit: cover;
    object-position: center;
}

.fd-hero-media::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.98) 0%,
            rgba(255,255,255,.94) 26%,
            rgba(255,255,255,.58) 43%,
            rgba(255,255,255,.10) 62%,
            rgba(33,18,24,.36) 100%
        );
    pointer-events: none;
}

.fd-hero-media::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    background:
        radial-gradient(circle at 15% 20%, rgba(242,93,146,.08), transparent 25%),
        linear-gradient(180deg, rgba(255,255,255,.03), rgba(26,14,19,.12));
    pointer-events: none;
}

.fd-hero-copy {
    position: relative;
    z-index: 4;
    width: min(48%, 650px);
    min-height: 430px;
    padding: 48px 40px 44px 58px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: transparent !important;
}

.fd-hero-copy::before {
    content: "";
    position: absolute;
    left: 18px;
    top: 28px;
    bottom: 28px;
    width: 24px;
    border-left: 2px solid #F6D3DF;
    border-right: 1px solid #F8E6EC;
    opacity: .95;
}

.fd-hero-copy::after {
    content: "♡";
    position: absolute;
    left: 13px;
    top: 92px;
    color: #F25D92;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 2rem;
    transform: rotate(-8deg);
}

.fd-hero-title {
    max-width: 560px;
    font-size: clamp(2.85rem, 4vw, 4.55rem);
    line-height: 1.01;
}

.fd-hero-copy p {
    max-width: 570px;
}

.fd-hero-quote {
    position: absolute;
    right: 30px;
    bottom: 30px;
    z-index: 5;
    width: min(300px, 26vw);
    padding: 20px 22px;
    border-radius: 15px;
    background: rgba(48, 24, 34, .62);
    backdrop-filter: blur(8px);
}

@media (max-width: 1100px) {
    .fd-hero-copy {
        width: 54%;
        padding: 42px 32px 40px 52px;
    }

    .fd-hero-title {
        font-size: clamp(2.55rem, 4.3vw, 3.9rem);
    }

    .fd-hero-quote {
        width: min(280px, 30vw);
    }
}

@media (max-width: 820px) {
    .fd-hero-card,
    .fd-hero-media,
    .fd-hero-media img {
        min-height: 560px;
    }

    .fd-hero-media::before {
        background:
            linear-gradient(
                180deg,
                rgba(255,255,255,.98) 0%,
                rgba(255,255,255,.92) 40%,
                rgba(255,255,255,.35) 68%,
                rgba(34,18,25,.34) 100%
            );
    }

    .fd-hero-copy {
        width: 100%;
        min-height: 360px;
        padding: 38px 26px 32px 44px;
        justify-content: flex-start;
    }

    .fd-hero-quote {
        left: 24px;
        right: 24px;
        bottom: 22px;
        width: auto;
    }
}

@media (max-width: 650px) {
    .fd-hero-card,
    .fd-hero-media,
    .fd-hero-media img {
        min-height: 600px;
    }

    .fd-hero-copy {
        min-height: 390px;
        padding: 34px 22px 28px 38px;
    }

    .fd-hero-title {
        font-size: clamp(2.35rem, 11vw, 3.4rem);
    }

    .fd-hero-copy::before {
        left: 10px;
    }

    .fd-hero-copy::after {
        left: 6px;
    }
}


/* =========================================================
   VERSÃO 0.5.0 — REDESIGN EDITORIAL
   Somente identidade visual: cores e remoção de efeitos.
   Nenhuma alteração de estrutura, grid, tamanho ou espaçamento.
   ========================================================= */

:root {
    --fd-blue: #B98A5B;
    --fd-blue-dark: #5B3A29;
    --fd-cyan: #CDA57A;
    --fd-aqua: #EADBC8;
    --fd-navy: #5B3A29;
    --fd-text: #7A5A46;
    --fd-muted: #7A5A46;
    --fd-border: #E8DDD2;
    --fd-soft: #FBF7F2;
    --fd-white: #FFFFFF;
    --fd-pink: #B98A5B;
    --fd-purple: #CDA57A;
    --fd-shadow: none;
}

/* Fundo 100% branco. */
html,
body,
main,
.fd-site-header,
.fd-hero,
.fd-personalizer-wrap,
.fd-section,
.fd-page-shell,
.fd-site-footer {
    background-color: #FFFFFF !important;
    background-image: none !important;
}

/* Remoção integral dos efeitos proibidos. */
.fd-site-header,
.fd-main-nav,
.fd-hero-card,
.fd-hero-copy,
.fd-hero-media,
.fd-hero-quote,
.fd-personalizer,
.fd-field input,
.fd-button,
.fd-chapter-card,
.fd-story-card,
.fd-quote-card,
.fd-category-card,
.fd-archive-hero,
.fd-story-hero,
.fd-chapter-head,
.fd-story-main-cover,
.fd-chapter-list,
.fd-chapter-list a,
.fd-reading-personalizer,
.fd-chapter-nav a,
.fd-empty,
.fd-site-footer,
.fd-placeholder-art {
    box-shadow: none !important;
    text-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Tipografia e textos. */
body {
    color: #7A5A46;
}

.fd-hero-title,
.fd-section-heading h2,
.fd-story-title,
.fd-chapter-title,
.fd-personalizer h2,
.fd-archive-hero h1,
.fd-story-hero h1,
.fd-chapter-head h1,
.fd-footer-title,
.fd-story-cover-title,
.fd-chapter-card h3 {
    color: #5B3A29;
}

.fd-hero-copy p,
.fd-personalizer p,
.fd-footer-col p,
.fd-footer-col li,
.fd-archive-hero p,
.fd-story-hero p,
.fd-chapter-head p,
.fd-field label,
.fd-chapter-card small,
.fd-quote-card cite {
    color: #7A5A46;
}

/* Links. */
a,
.fd-main-nav a {
    color: #5B3A29;
}

a:hover,
a:focus,
.fd-main-nav a:hover,
.fd-main-nav a:focus,
.fd-link {
    color: #B98A5B;
}

/* Item ativo da navbar e linha inferior discreta. */
body.home .fd-main-nav a:nth-child(1),
body.tax-categoria_historia .fd-main-nav a:nth-child(2),
body.post-type-archive-historia .fd-main-nav a:nth-child(3),
body.single-historia .fd-main-nav a:nth-child(3),
body.post-type-archive-capitulo .fd-main-nav a:nth-child(4),
body.single-capitulo .fd-main-nav a:nth-child(4) {
    color: #B98A5B;
}

body.home .fd-main-nav a:nth-child(1)::after,
body.tax-categoria_historia .fd-main-nav a:nth-child(2)::after,
body.post-type-archive-historia .fd-main-nav a:nth-child(3)::after,
body.single-historia .fd-main-nav a:nth-child(3)::after,
body.post-type-archive-capitulo .fd-main-nav a:nth-child(4)::after,
body.single-capitulo .fd-main-nav a:nth-child(4)::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -10px;
    height: 1px;
    background: #B98A5B;
}

/* Logo recolorida visualmente para Chocolate, sem substituir a imagem. */
.fd-logo img,
.fd-footer-logo {
    filter: brightness(0) saturate(100%) invert(22%) sepia(18%) saturate(1245%) hue-rotate(337deg) brightness(91%) contrast(91%);
}

/* Header e footer totalmente flat. */
.fd-site-header {
    border-bottom: 1px solid #E8DDD2;
}

.fd-site-footer {
    border-top: 1px solid #E8DDD2;
}

.fd-footer-bottom {
    border-top-color: #E8DDD2;
}

/* Botões. */
.fd-button,
.fd-header-cta,
.fd-button-primary,
.fd-button-aqua {
    color: #FFFFFF !important;
    background-color: #B98A5B !important;
    background-image: none !important;
    border: 1px solid #B98A5B;
    box-shadow: none !important;
}

.fd-button:hover,
.fd-button:focus,
.fd-header-cta:hover,
.fd-header-cta:focus,
.fd-button-primary:hover,
.fd-button-primary:focus,
.fd-button-aqua:hover,
.fd-button-aqua:focus {
    color: #FFFFFF !important;
    background-color: #CDA57A !important;
    border-color: #CDA57A;
    transform: none !important;
}

.fd-button-soft {
    color: #5B3A29 !important;
    background-color: #EADBC8 !important;
    background-image: none !important;
    border-color: #E8DDD2;
}

/* Inputs. */
.fd-field input {
    color: #5B3A29;
    background-color: #FFFFFF !important;
    background-image: none !important;
    border: 1px solid #E8DDD2;
    outline: none;
}

.fd-field input::placeholder {
    color: #7A5A46;
    opacity: .72;
}

.fd-field input:focus {
    border-color: #B98A5B;
    box-shadow: none !important;
    outline: none;
}

/* Banner integrado: sem gradientes, sem glass e sem sombra. */
.fd-hero-card {
    background-color: #FFFFFF !important;
    background-image: none !important;
    border: 1px solid #E8DDD2;
}

.fd-hero-copy {
    background-color: rgba(255, 255, 255, .94) !important;
    background-image: none !important;
}

.fd-hero-media {
    background-color: #EADBC8 !important;
    background-image: none !important;
}

.fd-hero-media::before {
    background: rgba(255, 255, 255, .12) !important;
}

.fd-hero-media::after {
    background: transparent !important;
}

.fd-hero-quote {
    color: #5B3A29;
    background-color: #FFFFFF !important;
    background-image: none !important;
    border: 1px solid #E8DDD2;
}

.fd-hero-quote::before,
.fd-hero-copy::after {
    color: #B98A5B;
}

.fd-hero-copy::before {
    border-color: #E8DDD2;
}

/* Badges e chips. */
.fd-eyebrow,
.fd-chip,
.fd-story-cover-tag {
    color: #5B3A29;
    background-color: #EADBC8 !important;
    background-image: none !important;
    border-color: #E8DDD2;
}

/* Área de personalização: apoio Cream Brown extremamente discreto. */
.fd-personalizer {
    background-color: #FBF7F2 !important;
    background-image: none !important;
    border: 1px solid #E8DDD2;
}

.fd-personalizer h2 span,
.fd-personalizer::before,
.fd-personalizer::after {
    color: #B98A5B;
}

/* Cards sempre brancos. */
.fd-story-card,
.fd-quote-card,
.fd-category-card,
.fd-archive-hero,
.fd-story-hero,
.fd-chapter-head,
.fd-reading-personalizer,
.fd-chapter-list,
.fd-chapter-list a,
.fd-chapter-nav a,
.fd-empty {
    background-color: #FFFFFF !important;
    background-image: none !important;
    border-color: #E8DDD2;
}

.fd-story-card:hover,
.fd-quote-card:hover,
.fd-chapter-card:hover,
.fd-chapter-list a:hover,
.fd-chapter-nav a:hover {
    transform: none !important;
    box-shadow: none !important;
}

/* Imagens e overlays: apenas cores sólidas. */
.fd-card-shade {
    background: rgba(91, 58, 41, .58) !important;
}

.fd-story-cover::after {
    background: rgba(91, 58, 41, .34) !important;
}

.fd-placeholder-art,
.fd-art-1,
.fd-art-2,
.fd-art-3,
.fd-art-4,
.fd-art-5,
.fd-art-6 {
    background-color: #EADBC8 !important;
    background-image: none !important;
}

/* Frases e corações. */
.fd-quote-mark,
.fd-quote-card::after {
    color: #B98A5B;
}

/* Categorias. */
.fd-category-card {
    color: #5B3A29;
    background-color: #FFFFFF !important;
    border: 1px solid #E8DDD2;
}

.fd-category-card:nth-child(1),
.fd-category-card:nth-child(2),
.fd-category-card:nth-child(3),
.fd-category-card:nth-child(4),
.fd-category-card:nth-child(5),
.fd-category-card:nth-child(6) {
    background-color: #FFFFFF !important;
}

.fd-category-icon {
    color: #B98A5B;
    background-color: transparent !important;
}

.fd-category-card:hover,
.fd-category-card:focus {
    color: #5B3A29;
    background-color: #FFFFFF !important;
    border-color: #B98A5B;
    transform: none !important;
}

/* Instagram e ícones do rodapé. */
.fd-instagram-icon svg rect {
    fill: #B98A5B !important;
}

.fd-instagram-icon svg circle:first-of-type {
    stroke: #FFFFFF !important;
}

.fd-instagram-icon svg circle:last-of-type {
    fill: #FFFFFF !important;
}

/* Ícones e detalhes secundários. */
.fd-category-icon,
.fd-quote-mark,
.fd-chapter-number,
.fd-current-reader,
.fd-current-crush {
    color: #B98A5B;
}

/* Menu mobile totalmente flat. */
@media (max-width: 820px) {
    .fd-main-nav {
        background-color: #FFFFFF !important;
        background-image: none !important;
        border-color: #E8DDD2;
        box-shadow: none !important;
    }

    .fd-hero-media::before {
        background: rgba(255, 255, 255, .18) !important;
    }
}


/* =========================================================
   VERSÃO 0.5.1 — BANNER COMPLETO
   Exibe a arte inteira sem recorte e sem textos duplicados.
   Mantém apenas o botão "Comece a ler".
   ========================================================= */

.fd-hero-card {
    position: relative;
    display: block;
    min-height: 0 !important;
    overflow: hidden;
    background: #FFFFFF !important;
}

.fd-hero-media {
    position: relative !important;
    inset: auto !important;
    width: 100%;
    min-height: 0 !important;
    background: #FFFFFF !important;
}

.fd-hero-media img {
    display: block;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    object-fit: contain !important;
    object-position: center !important;
}

.fd-hero-media::before,
.fd-hero-media::after,
.fd-hero-copy::before,
.fd-hero-copy::after {
    display: none !important;
    content: none !important;
}

.fd-hero-copy {
    position: absolute !important;
    inset: 0 !important;
    z-index: 5;
    width: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    pointer-events: none;
}

/* Oculta tudo que já está desenhado dentro da própria arte do banner. */
.fd-hero-copy > .fd-eyebrow,
.fd-hero-title,
.fd-hero-copy > p,
.fd-hero-quote,
.fd-actions .fd-link {
    display: none !important;
}

.fd-hero-copy .fd-actions {
    position: absolute;
    left: 12.8%;
    bottom: 10.5%;
    display: block;
    margin: 0;
    pointer-events: auto;
}

.fd-hero-copy .fd-button-primary {
    display: inline-flex !important;
    min-height: 50px;
}

/* O banner acompanha exatamente a proporção da imagem também no mobile. */
@media (max-width: 820px) {
    .fd-hero-card,
    .fd-hero-media,
    .fd-hero-media img {
        min-height: 0 !important;
    }

    .fd-hero-copy {
        min-height: 0 !important;
    }

    .fd-hero-copy .fd-actions {
        left: 8%;
        bottom: 8%;
    }

    .fd-hero-copy .fd-button-primary {
        min-height: 44px;
        padding-inline: 18px;
        font-size: .9rem;
    }
}

@media (max-width: 520px) {
    .fd-hero-copy .fd-actions {
        left: 6%;
        bottom: 6%;
    }

    .fd-hero-copy .fd-button-primary {
        min-height: 38px;
        padding-inline: 14px;
        font-size: .78rem;
        border-radius: 10px;
    }
}


/* =========================================================
   VERSÃO 0.5.2 — AJUSTE DE IMAGENS MENORES
   Evita corte agressivo em cards e capas internas.
   ========================================================= */

/* Cards de histórias em destaque / listagens */
.fd-story-cover,
.fd-story-card .fd-story-cover {
    background: #FBF7F2 !important;
    overflow: hidden;
}

.fd-story-cover img,
.fd-story-card .fd-story-cover img {
    width: 100%;
    height: 100%;
    object-fit: contain !important;
    object-position: center center !important;
    background: #FBF7F2;
}

/* Remove sobreposição escura que piora artes menores com texto já embutido */
.fd-story-cover::after,
.fd-card-shade {
    background: rgba(91, 58, 41, 0.18) !important;
}

/* Capa da página individual da história */
.fd-story-main-cover {
    background: #FBF7F2 !important;
    overflow: hidden;
}

.fd-story-main-cover img {
    width: 100%;
    height: 100%;
    object-fit: contain !important;
    object-position: center center !important;
    background: #FBF7F2;
}

/* Segurança extra para qualquer miniatura de história/capítulo que use o mesmo padrão */
.fd-chapter-card-thumb,
.fd-card-media,
.fd-cover-media {
    background: #FBF7F2 !important;
    overflow: hidden;
}

.fd-chapter-card-thumb img,
.fd-card-media img,
.fd-cover-media img {
    width: 100%;
    height: 100%;
    object-fit: contain !important;
    object-position: center center !important;
    background: #FBF7F2;
}


/* =========================================================
   VERSÃO 0.5.3 — DUAS IMAGENS POR HISTÓRIA
   Banner: Imagem destacada horizontal.
   Cards e capa interna: Imagem de card vertical.
   ========================================================= */

.fd-story-cover img,
.fd-story-main-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover !important;
    object-position: center top !important;
}

.fd-card-media {
    width: 100%;
    height: 100%;
    object-fit: cover !important;
    object-position: center top !important;
}


/* =========================================================
   VERSÃO 0.5.5 — NOMES E APELIDOS NO CAPÍTULO
   A home mantém apenas os dois campos atuais.
   ========================================================= */

.fd-reading-personalizer .fd-personalizer-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.fd-reading-personalizer .fd-personalizer-form .fd-button {
    grid-column: 1 / -1;
    justify-self: start;
}

@media (max-width: 650px) {
    .fd-reading-personalizer .fd-personalizer-form {
        grid-template-columns: 1fr;
    }

    .fd-reading-personalizer .fd-personalizer-form .fd-button {
        grid-column: auto;
        width: 100%;
    }
}


/* =========================================================
   VERSÃO 0.5.6 — PERSONALIZAÇÃO MAIS RETANGULAR E DELICADA
   Apenas o formulário interno dos capítulos foi refinado.
   ========================================================= */

.fd-reading-personalizer {
    width: min(calc(100vw - 64px), var(--fd-container));
    max-width: none;
    margin: 0 0 32px 50%;
    padding: 22px 28px;
    transform: translateX(-50%);
    display: grid;
    grid-template-columns: minmax(230px, .72fr) minmax(0, 2.28fr);
    grid-template-rows: auto auto;
    column-gap: 30px;
    row-gap: 3px;
    align-items: center;
    border-radius: 18px;
}

.fd-reading-personalizer > strong {
    grid-column: 1;
    grid-row: 1;
    align-self: end;
}

.fd-reading-personalizer > p {
    grid-column: 1;
    grid-row: 2;
    align-self: start;
    margin: 4px 0 0 !important;
}

.fd-reading-personalizer .fd-personalizer-form {
    grid-column: 2;
    grid-row: 1 / span 2;
    grid-template-columns: repeat(4, minmax(130px, 1fr)) auto;
    gap: 12px;
    align-items: end;
}

.fd-reading-personalizer .fd-field input {
    height: 48px;
}

.fd-reading-personalizer .fd-personalizer-form .fd-button {
    grid-column: auto;
    justify-self: stretch;
    min-height: 48px;
    white-space: nowrap;
    padding-inline: 20px;
}

@media (max-width: 1250px) {
    .fd-reading-personalizer {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        row-gap: 4px;
    }

    .fd-reading-personalizer > strong {
        grid-column: 1;
        grid-row: 1;
    }

    .fd-reading-personalizer > p {
        grid-column: 1;
        grid-row: 2;
        margin-bottom: 14px !important;
    }

    .fd-reading-personalizer .fd-personalizer-form {
        grid-column: 1;
        grid-row: 3;
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .fd-reading-personalizer .fd-personalizer-form .fd-button {
        grid-column: 1 / -1;
        width: max-content;
    }
}

@media (max-width: 820px) {
    .fd-reading-personalizer {
        width: min(calc(100vw - 30px), var(--fd-container));
        padding: 20px;
    }

    .fd-reading-personalizer .fd-personalizer-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 650px) {
    .fd-reading-personalizer {
        display: block;
        transform: translateX(-50%);
    }

    .fd-reading-personalizer > p {
        margin: 4px 0 16px !important;
    }

    .fd-reading-personalizer .fd-personalizer-form {
        grid-template-columns: 1fr;
    }

    .fd-reading-personalizer .fd-personalizer-form .fd-button {
        grid-column: auto;
        width: 100%;
    }
}

/* =========================================================
   VERSÃO 0.5.7 — BANNER PRINCIPAL SEM MARGENS
   Objetivo: apenas o banner da home ocupa toda a largura,
   preservando o layout e as margens das demais seções.
   ========================================================= */
.fd-hero {
    padding-top: 0 !important;
    padding-bottom: 18px !important;
}

.fd-hero .fd-container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.fd-hero-card {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    border-radius: 0 !important;
}

/* Em telas menores, o banner continua sem margens laterais,
   mantendo o restante do site intacto. */
@media (max-width: 820px) {
    .fd-hero {
        padding-top: 0 !important;
        padding-bottom: 16px !important;
    }

    .fd-hero-card {
        border-radius: 0 !important;
    }
}


/* =========================================================
   VERSÃO 0.6.0 — SEO, PESQUISAS DE IA E NOMES NO SERVIDOR
   ========================================================= */

.fd-personalized-name {
    display: inline;
}

.fd-story-inspiration,
.fd-chapter-inspiration {
    margin: 8px 0 0;
    color: var(--fd-muted);
    font-size: .95rem;
}

.fd-story-inspiration strong,
.fd-chapter-inspiration strong {
    color: var(--fd-text);
    font-weight: 700;
}

.fd-fiction-notice {
    margin-top: 34px;
    padding: 14px 16px;
    border: 1px solid var(--fd-border);
    border-radius: 14px;
    background: var(--fd-soft);
    color: var(--fd-muted);
    font-size: .86rem;
    line-height: 1.55;
}

.fd-fiction-notice strong {
    color: var(--fd-text);
}


/* =========================================================
   VERSÃO 0.6.1 — TAGS VISÍVEIS E AVISO NA HISTÓRIA
   ========================================================= */

.fd-story-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin: 20px 0 28px;
}

.fd-story-tag {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 6px 13px;
    border: 1px solid var(--fd-border);
    border-radius: 999px;
    background: var(--fd-soft);
    color: var(--fd-text);
    font-size: .84rem;
    font-weight: 650;
    line-height: 1.2;
}

.fd-story-notice {
    margin: 24px 0 34px;
    padding: 16px 18px;
    border: 1px solid var(--fd-border);
    border-radius: 15px;
    background: #FCF8F4;
    color: var(--fd-muted);
    font-size: .88rem;
    line-height: 1.6;
}

.fd-story-notice strong {
    color: var(--fd-text);
}

@media (max-width: 650px) {
    .fd-story-tags {
        margin-top: 16px;
        gap: 7px;
    }

    .fd-story-tag {
        min-height: 31px;
        padding: 5px 11px;
        font-size: .8rem;
    }

    .fd-story-notice {
        padding: 14px 15px;
    }
}


/* =========================================================
   VERSÃO 0.6.2 — IMAGEM DESTACADA POR CAPÍTULO
   ========================================================= */

.fd-chapter-card .fd-card-media {
    object-position: center center;
}


/* =========================================================
   VERSÃO 0.6.3 — NAVEGAÇÃO ENTRE CAPÍTULOS CORRIGIDA
   ========================================================= */

.fd-chapter-nav {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 18px !important;
    align-items: stretch;
    margin-top: 42px;
}

.fd-chapter-nav-link {
    display: flex !important;
    width: 100% !important;
    min-width: 0;
    min-height: 92px;
    padding: 18px 20px !important;
    flex-direction: column;
    justify-content: center;
    border: 1px solid var(--fd-border);
    border-radius: 16px;
    background: #fff;
    text-decoration: none;
}

.fd-chapter-nav-link small {
    display: block;
    margin-bottom: 5px;
    color: var(--fd-muted);
    font-size: .78rem;
    font-weight: 650;
    line-height: 1.25;
}

.fd-chapter-nav-link strong {
    display: block;
    color: var(--fd-text);
    font-size: .98rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.fd-chapter-nav-previous {
    grid-column: 1;
    align-items: flex-start;
    text-align: left !important;
}

.fd-chapter-nav-next {
    grid-column: 2;
    align-items: flex-end;
    text-align: right !important;
}

.fd-chapter-nav-link:hover {
    border-color: #CDA57A !important;
}

@media (max-width: 650px) {
    .fd-chapter-nav {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .fd-chapter-nav-previous,
    .fd-chapter-nav-next {
        grid-column: 1;
        align-items: flex-start;
        text-align: left !important;
    }

    .fd-chapter-nav-link {
        min-height: 78px;
        padding: 15px 17px !important;
    }
}


/* =========================================================
   VERSÃO 0.6.4 — CARDS DA HOME SEM TÍTULOS SOBRE AS ARTES
   ========================================================= */

/* As artes já contêm os nomes. Na home, retiramos as camadas
   escuras para que o banner de cada capítulo e história apareça limpo. */
.home .fd-chapter-card .fd-card-shade,
.home .fd-story-cover::after {
    display: none !important;
}

/* Mantém apenas o número do capítulo, pequeno e discreto. */
.home .fd-chapter-card-content {
    position: absolute;
    inset: 0;
    padding: 14px;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    pointer-events: none;
}

/* A categoria continua visível, mas de maneira mais delicada. */
.home .fd-story-cover-tag {
    background: rgba(255, 255, 255, .92) !important;
    color: var(--fd-text) !important;
    border: 1px solid var(--fd-border);
    backdrop-filter: blur(4px);
}

@media (max-width: 650px) {
    .home .fd-chapter-card-content {
        padding: 10px;
    }
}


/* =========================================================
   VERSÃO 0.6.5 — TRILHA SONORA MANUAL NOS CAPÍTULOS
   ========================================================= */

.fd-soundtrack {
    margin: 34px 0;
    padding: 18px;
    border: 1px solid var(--fd-border);
    border-radius: 17px;
    background: #FCF8F4;
}

.fd-soundtrack-heading {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 15px;
}

.fd-soundtrack-icon {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    place-items: center;
    border: 1px solid var(--fd-border);
    border-radius: 50%;
    background: #FFFFFF;
    color: var(--fd-text);
    font-size: 1rem;
}

.fd-soundtrack-copy { min-width: 0; }

.fd-soundtrack-kicker {
    display: block;
    margin-bottom: 2px;
    color: var(--fd-muted);
    font-size: .73rem;
    font-weight: 750;
    letter-spacing: .08em;
    line-height: 1.3;
    text-transform: uppercase;
}

.fd-soundtrack-title {
    display: block;
    color: var(--fd-text);
    font-size: 1rem;
    line-height: 1.35;
}

.fd-soundtrack-artist {
    display: block;
    margin-top: 2px;
    color: var(--fd-muted);
    font-size: .86rem;
    line-height: 1.35;
}

.fd-soundtrack-player {
    overflow: hidden;
    border-radius: 12px;
    background: #FFFFFF;
}

.fd-soundtrack-player iframe {
    display: block;
    width: 100%;
    height: 152px;
    border: 0;
}

.fd-soundtrack-help {
    margin: 10px 2px 0;
    color: var(--fd-muted);
    font-size: .78rem;
    line-height: 1.45;
}

.fd-soundtrack-link {
    display: inline-flex;
    min-height: 44px;
    padding: 10px 17px;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--fd-text);
    color: #FFFFFF;
    font-size: .88rem;
    font-weight: 750;
}

@media (max-width: 650px) {
    .fd-soundtrack {
        margin: 27px 0;
        padding: 15px;
    }

    .fd-soundtrack-heading { gap: 11px; }

    .fd-soundtrack-icon {
        width: 38px;
        height: 38px;
        flex-basis: 38px;
    }
}