/*
Theme Name: ReadTheFiction
Theme URI: https://readthefiction.com/
Author: ReadTheFiction
Description: A cinematic reading-first theme for complete original fiction.
Version: 0.2.2
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: readthefiction
*/

:root { --background:#0b0e12; --foreground:#f6f2eb; --muted:#b7b5b4; --accent:#f1b769; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--background); color:var(--foreground); font-family:Arial,Helvetica,sans-serif; } a { color:inherit; text-decoration:none; } a:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.page-width { width:min(100% - 7.5rem,1450px); margin-inline:auto; }
.site-header { position:absolute; z-index:10; inset:0 0 auto; height:86px; display:flex; align-items:center; gap:5rem; padding:0 max(3.75rem,calc((100vw - 1450px)/2)); background:linear-gradient(180deg,rgba(6,9,14,.72),transparent); }
.wordmark { display:inline-flex; align-items:center; gap:.75rem; font-size:1.03rem; font-weight:900; letter-spacing:.15em; white-space:nowrap; }.wordmark-mark { display:inline-grid; place-items:center; width:2.15rem; height:2.15rem; border:1px solid rgba(242,184,105,.75); border-radius:50%; color:var(--accent); font-size:1.15rem; font-weight:400; }.wordmark-light { color:var(--accent); margin-left:.28em; }
.main-nav { display:flex; gap:2.25rem; color:#e7e3df; font-size:.9rem; font-weight:600; }.main-nav a:hover { color:var(--accent); }.header-note { margin-left:auto; color:#d7d1c9; font-size:.75rem; text-transform:uppercase; letter-spacing:.17em; white-space:nowrap; }
.hero { position:relative; min-height:690px; height:min(780px,88vh); display:flex; align-items:center; overflow:hidden; background:#131923; }.hero-art { position:absolute; inset:0; background-image:url('assets/hero-world.png'); background-size:cover; background-position:center; opacity:.93; }.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,#0a0d13 0%,rgba(10,13,19,.97) 24%,rgba(10,13,19,.65) 49%,rgba(10,13,19,.1) 82%),linear-gradient(0deg,#0b0e12 0%,transparent 25%,rgba(5,7,11,.16) 100%); }.hero-content { position:relative; z-index:1; padding-top:3rem; }
.eyebrow { color:var(--accent); font-size:.73rem; line-height:1.5; font-weight:800; letter-spacing:.22em; }.hero-eyebrow { display:flex; align-items:center; gap:.85rem; margin:0 0 1.4rem; }.eyebrow-line { display:block; width:2.3rem; height:1px; background:var(--accent); } h1,h2,h3,p { margin-top:0; }
.hero h1 { margin-bottom:1.4rem; max-width:750px; font-family:Georgia,'Times New Roman',serif; font-size:clamp(4.4rem,7.5vw,8.2rem); font-weight:400; letter-spacing:-.055em; line-height:.96; text-wrap:balance; }.hero-description { max-width:560px; color:#dfdedc; font-size:1.15rem; line-height:1.68; }.hero-actions { display:flex; gap:.85rem; flex-wrap:wrap; margin-top:2rem; }.button { display:inline-flex; align-items:center; justify-content:center; gap:1.4rem; min-height:51px; padding:.8rem 1.35rem; border-radius:3px; font-size:.9rem; font-weight:800; transition:transform .2s,background .2s; }.button:hover { transform:translateY(-2px); }.button-primary { background:var(--accent); color:#1b1511; }.button-primary:hover { background:#ffd19a; }.button-secondary { border:1px solid rgba(255,255,255,.38); background:rgba(13,17,24,.4); }.button-secondary:hover { background:rgba(255,255,255,.13); }
.hero-bottom { position:absolute; z-index:1; bottom:2.15rem; left:50%; transform:translateX(-50%); display:flex; justify-content:space-between; color:#babec3; font-size:.75rem; font-weight:700; letter-spacing:.19em; }.scroll-cue { display:flex; gap:.6rem; align-items:center; }.scroll-cue span { font-size:1.05rem; color:var(--accent); }
.section { padding-block:6.75rem; }.section-heading { display:flex; align-items:end; justify-content:space-between; gap:4rem; margin-bottom:2.4rem; }.section-heading .eyebrow { margin-bottom:1.1rem; }.section h2 { margin-bottom:0; max-width:720px; font-family:Georgia,'Times New Roman',serif; font-size:clamp(2.5rem,4.5vw,4.4rem); font-weight:400; letter-spacing:-.05em; line-height:1.1; }.section-heading > p { max-width:370px; margin-bottom:.25rem; color:var(--muted); font-size:1rem; line-height:1.6; }
.genre-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.85rem; }.genre-card { position:relative; min-height:188px; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; padding:1.4rem; border:1px solid rgba(255,255,255,.11); border-radius:4px; background-color:#242832; }.genre-card::before { content:''; position:absolute; inset:0; opacity:.68; background:radial-gradient(circle at 95% 3%,rgba(255,255,255,.2),transparent 34%),linear-gradient(140deg,transparent 35%,rgba(0,0,0,.33)); }.genre-card::after { content:''; position:absolute; inset:auto -25% -80% 15%; height:150%; transform:rotate(-28deg); border-left:1px solid rgba(255,255,255,.16); box-shadow:-20px 0 50px rgba(255,255,255,.045); }.genre-card > span { position:relative; z-index:1; }.genre-card-kicker { color:rgba(255,255,255,.72); font-size:.75rem; font-weight:800; letter-spacing:.22em; }.genre-card-title { font-family:Georgia,'Times New Roman',serif; font-size:clamp(1.65rem,2.4vw,2.5rem); letter-spacing:-.045em; }.genre-rose { background-color:#663b49; }.genre-slate { background-color:#303a44; }.genre-blue { background-color:#253e54; }.genre-violet { background-color:#473b5e; }.genre-teal { background-color:#20535a; }.genre-amber { background-color:#705137; }.genre-umber { background-color:#514132; }.genre-plum { background-color:#3f3145; }
.library-section { background:#151a20; border-block:1px solid rgba(255,255,255,.06); }.library-inner { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:4rem; align-items:center; }.library-copy h2 { margin:1.15rem 0 1.3rem; }.library-copy > p:last-child { max-width:470px; color:var(--muted); font-size:1.05rem; line-height:1.7; }.empty-shelf { min-width:0; border:1px solid rgba(255,255,255,.14); background:#0f141a; padding:1.3rem; box-shadow:0 20px 50px rgba(0,0,0,.18); }.empty-shelf-top,.empty-shelf-bottom { display:flex; justify-content:space-between; gap:1rem; color:#aaaeb3; font-size:.75rem; font-weight:700; letter-spacing:.16em; }.empty-shelf-bottom { padding-top:1.25rem; color:#d3d1cf; font-size:.75rem; letter-spacing:.04em; }.shelf-placeholders { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; margin-top:1.3rem; }.shelf-cover { aspect-ratio:2/3; border:1px solid rgba(255,255,255,.09); background:linear-gradient(155deg,#3d4754,#1c242e); }.cover-two { background:linear-gradient(155deg,#5b3d43,#231b27); }.cover-three { background:linear-gradient(155deg,#54503b,#24271f); }.cover-four { background:linear-gradient(155deg,#3b4e50,#192427); }
.experience-section { padding-bottom:7.8rem; }.experience-heading { margin-bottom:3.3rem; }.experience-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid rgba(255,255,255,.2); }.experience-item { padding:1.8rem 3rem 0 0; }.experience-item:not(:first-child) { border-left:1px solid rgba(255,255,255,.17); padding-left:2rem; }.experience-number { color:var(--accent); font-size:.75rem; letter-spacing:.18em; }.experience-item h3 { margin:2.1rem 0 .9rem; font-family:Georgia,'Times New Roman',serif; font-size:1.85rem; font-weight:400; letter-spacing:-.035em; }.experience-item p { max-width:330px; color:var(--muted); font-size:1rem; line-height:1.65; }
.site-footer { border-top:1px solid rgba(255,255,255,.11); background:#080a0d; }.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-block:2.3rem; color:#a9abad; font-size:.8rem; }.footer-brand { color:#f5f0e8; font-weight:900; letter-spacing:.15em; }.footer-star { color:var(--accent); margin-left:.3rem; }
@media (max-width:980px) { .page-width { width:min(100% - 3rem,1450px); }.site-header { padding-inline:1.5rem; gap:2rem; }.header-note { display:none; }.main-nav { margin-left:auto; }.genre-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.library-inner { gap:2rem; } }
@media (max-width:650px) { .page-width { width:min(100% - 2.25rem,1450px); }.site-header { height:72px; padding-inline:1.125rem; }.wordmark { font-size:.78rem; gap:.5rem; }.wordmark-mark { width:1.75rem; height:1.75rem; font-size:.9rem; }.main-nav { gap:1.15rem; font-size:.75rem; }.main-nav a:last-child { display:none; }.hero { min-height:650px; height:87vh; align-items:end; }.hero-art { background-position:63% center; }.hero-shade { background:linear-gradient(0deg,#0b0e12 1%,rgba(10,13,19,.95) 18%,rgba(10,13,19,.5) 58%,rgba(10,13,19,.13) 100%); }.hero-content { padding:0 0 7rem; }.hero h1 { font-size:clamp(3.7rem,14vw,5.8rem); }.hero-description { font-size:1rem; line-height:1.55; }.hero-bottom { bottom:1.3rem; }.hero-bottom > span:first-child { display:none; }.section { padding-block:4.5rem; }.section-heading { display:block; }.section-heading > p { margin-top:1.3rem; }.genre-grid { gap:.55rem; }.genre-card { min-height:146px; padding:.95rem; }.genre-card-title { font-size:1.55rem; }.library-inner { grid-template-columns:1fr; gap:2.2rem; }.empty-shelf { padding:.85rem; }.shelf-placeholders { gap:.35rem; }.experience-grid { grid-template-columns:1fr; }.experience-item { padding:1.7rem 0 1.3rem !important; border-left:0 !important; border-bottom:1px solid rgba(255,255,255,.17); }.experience-item h3 { margin-top:1rem; }.footer-inner { flex-direction:column; align-items:start; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.button { transition:none; } }


@media (max-width:390px) { .main-nav a:nth-child(2) { display:none; } }

.skip-link { position:absolute; left:-9999px; top:0; z-index:100; padding:.7rem 1rem; background:#f1b769; color:#0b0e12; }
.skip-link:focus { left:1rem; top:1rem; }
.admin-bar .site-header { top:32px; }
.genre-card:hover { filter:brightness(1.14); transform:translateY(-2px); }
.genre-card { transition:filter .2s,transform .2s; }
.library-link { display:inline-flex; gap:.8rem; margin-top:1.25rem; border-bottom:1px solid #f1b769; padding-bottom:.4rem; color:#f1b769; font-size:.95rem; font-weight:700; }
.featured-books { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.7rem; }
.featured-book { min-width:0; color:#f6f2eb; font-family:Georgia,serif; font-size:1.15rem; }
.featured-book img,.featured-book .book-cover-fallback { display:block; width:100%; aspect-ratio:2/3; object-fit:cover; margin-bottom:.7rem; }
.book-cover-fallback { display:block; background:linear-gradient(145deg,#354352,#202734); }
.inner-main { min-height:70vh; padding-top:10rem; padding-bottom:7rem; }
.inner-heading { margin-bottom:3.3rem; }
.inner-heading h1,.standard-entry h1,.novel-detail h1,.library-empty h1 { font-family:Georgia,'Times New Roman',serif; font-size:clamp(3rem,6vw,6.5rem); font-weight:400; letter-spacing:-.055em; line-height:1; margin:.8rem 0 1.2rem; }
.inner-heading > p:last-child { color:#b7b5b4; font-size:1.1rem; }
.inner-main .site-header { background:#0b0e12; }
.novel-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:2rem 1rem; }
.novel-card { display:flex; flex-direction:column; gap:.6rem; min-width:0; }
.novel-cover,.novel-cover img,.novel-cover .book-cover-fallback { display:block; width:100%; aspect-ratio:2/3; object-fit:cover; }
.novel-cover { margin-bottom:.35rem; overflow:hidden; }
.novel-cover img { transition:transform .25s; }
.novel-card:hover .novel-cover img { transform:scale(1.04); }
.novel-title { font-family:Georgia,'Times New Roman',serif; font-size:1.5rem; line-height:1.2; }
.novel-excerpt { color:#b7b5b4; font-size:.92rem; line-height:1.5; }
.library-empty { padding:3.4rem; border:1px solid rgba(255,255,255,.12); background:#151a20; }
.library-empty h2 { font-family:Georgia,'Times New Roman',serif; font-size:clamp(2rem,4vw,3rem); font-weight:400; margin:0 0 .7rem; }
.library-empty p { max-width:580px; color:#b7b5b4; font-size:1.05rem; line-height:1.6; }
.library-empty .button { margin-top:1rem; }
.novel-detail { display:grid; grid-template-columns:minmax(220px,330px) minmax(0,1fr); gap:4rem; align-items:center; }
.novel-detail-cover img,.novel-detail-cover .book-cover-fallback { display:block; width:100%; aspect-ratio:2/3; object-fit:cover; }
.novel-genres { color:#f1b769; font-size:.9rem; }
.novel-summary { max-width:690px; color:#d9d8d5; font-size:1.2rem; line-height:1.7; }
.novel-body { max-width:740px; margin:5rem auto 0; font-family:Georgia,'Times New Roman',serif; font-size:1.2rem; line-height:1.85; }
.novel-body p { margin-bottom:1.5rem; }
.standard-entry { max-width:800px; border-top:1px solid rgba(255,255,255,.12); padding:2rem 0; color:#ddd; font-size:1.05rem; line-height:1.7; }
.standard-entry h2 { font-family:Georgia,serif; font-size:2rem; font-weight:400; }
.pagination { margin-top:3rem; }
.pagination a,.pagination .current { display:inline-block; padding:.5rem .7rem; margin-right:.3rem; border:1px solid rgba(255,255,255,.2); }
@media (max-width:980px) { .novel-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .novel-detail { gap:2rem; } }
@media (max-width:650px) { .admin-bar .site-header { top:46px; } .inner-main { padding-top:7.5rem; } .novel-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.5rem .7rem; } .novel-detail { grid-template-columns:1fr; } .novel-detail-cover { max-width:270px; } .library-empty { padding:2rem 1.25rem; } .featured-books { grid-template-columns:repeat(2,minmax(0,1fr)); } }