/*
Theme Name: Estudi Arrel - Pro Writer
Theme URI: https://demo.estudiarrel.cat
Author: Estudiarrel
Author URI: https://estudiarrel.cat
Description: Tema WordPress profesional para escritores, autores, editoriales y blogs literarios. Compatible con Elementor, diseno moderno y elegante, widgets personalizados e instalador de demo con un clic.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: prowriterarrel
Tags: writer, blog, literary, elementor, custom-widgets
*/

/* ==========================================================================
   Design System: "Midnight Literary"
   ========================================================================== */

:root {
    /* Primary - Dark Navy */
    --color-primary: #1a1a2e;
    --color-primary-light: #2a2a42;
    --color-primary-dim: #12121f;
    --color-on-primary: #f5f3ef;

    /* Secondary - Night Blue */
    --color-secondary: #16213e;
    --color-secondary-light: #1f3056;
    --color-secondary-dim: #0e1729;

    /* Accent - Antique Gold */
    --color-accent: #c9a84c;
    --color-accent-light: #e0c068;
    --color-accent-dim: #a88a3e;
    --color-on-accent: #1a1a2e;

    /* Surface & Backgrounds */
    --color-surface: #f5f3ef;
    --color-surface-warm: #ece8e0;
    --color-surface-card: #ffffff;
    --color-surface-dark: #0f0f1a;
    --color-surface-darker: #0a0a12;

    /* Text */
    --color-text: #1a1a2e;
    --color-text-secondary: #5a5a6e;
    --color-text-light: #8a8a99;
    --color-text-on-dark: #e8e6e0;

    /* Borders */
    --color-border: #ddd9d0;
    --color-border-light: #ebe8e2;

    /* Typography */
    --font-headline: 'Cormorant Garamond', Georgia, serif;
    --font-body: 'Inter', -apple-system, sans-serif;
    --font-label: 'Inter', -apple-system, sans-serif;

    /* Spacing & Radius */
    --radius-sm: 4px;
    --radius-default: 8px;
    --radius-lg: 12px;
    --radius-xl: 20px;
}

/* Skip Link (Accessibility) */
.skip-link.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.skip-link.screen-reader-text:focus {
    position: fixed;
    top: 10px;
    left: 10px;
    z-index: 100000;
    width: auto;
    height: auto;
    padding: 0.8rem 1.5rem;
    margin: 0;
    overflow: visible;
    clip: auto;
    white-space: normal;
    background: #fff;
    color: var(--color-primary);
    font-family: var(--font-body);
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: none;
    border-radius: var(--radius-default);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

/* Focus Visible (Accessibility WCAG 2.4.7) */
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
}
*:focus:not(:focus-visible) { outline: none; }

/* Base Reset */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { overflow-x: clip; }

body {
    font-family: var(--font-body);
    color: var(--color-text);
    background: var(--color-surface);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    overflow-x: clip;
    width: 100%;
}

img { max-width: 100%; height: auto; }
a { color: var(--color-primary); }

/* Elementor full width fix */
.elementor-section.elementor-section-boxed > .elementor-container { max-width: 100%; }
.elementor-section.elementor-section-stretched { max-width: 100%; }
.elementor-widget-wrap { width: 100%; }

/* Nav is fixed, so its Elementor section should not take space */
.elementor-widget-pwa_nav { margin: 0 !important; padding: 0 !important; }
.elementor-widget-pwa_nav > .elementor-widget-container { margin: 0 !important; padding: 0 !important; }

/* Kill ALL gaps between sections — seamless dark theme */
.elementor-section { margin: 0 !important; padding: 0 !important; }
.elementor-section .elementor-container { padding: 0 !important; }
.elementor-column-gap-default > .elementor-column > .elementor-element-populated { padding: 0 !important; }
.elementor-column-gap-no > .elementor-column > .elementor-element-populated { padding: 0 !important; }
.elementor-widget { margin-bottom: 0 !important; }
.elementor-widget > .elementor-widget-container { margin: 0 !important; padding: 0 !important; }
.elementor-section-wrap > .elementor-section { margin-bottom: 0 !important; }
/* Force dark background on all page gaps */
body.elementor-page { background: var(--color-surface-dark, #0a0a0f) !important; }
.elementor { background: var(--color-surface-dark, #0a0a0f) !important; }

/* ══════════════════════════════════════════════════════
   Contact Form 7 — Writer Dark Theme
   ══════════════════════════════════════════════════════ */
.pwa-cf7-row { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-bottom:1.5rem; }
@media (max-width:600px) { .pwa-cf7-row { grid-template-columns:1fr; } }
.pwa-cf7-field { margin-bottom:1.5rem; }
.pwa-cf7-row .pwa-cf7-field { margin-bottom:0; }
.pwa-cf7-label { display:block; font-size:0.78rem; font-weight:600; color:rgba(245,240,232,0.55); text-transform:uppercase; letter-spacing:0.08em; margin-bottom:0.5rem; }
.pwa-cf7-input,
.wpcf7 input.pwa-cf7-input,
.wpcf7 select.pwa-cf7-input,
.wpcf7 textarea.pwa-cf7-input {
    width:100%; padding:0.85rem 1rem; min-height:44px;
    background:rgba(255,255,255,0.03);
    border:1px solid rgba(201,168,76,0.28); border-radius:var(--radius-sm);
    color:#f5f0e8;
    font-family:var(--font-body); font-size:0.95rem; outline:none;
    transition:border-color 0.3s, background 0.3s;
}
.pwa-cf7-input::placeholder,
.wpcf7 input.pwa-cf7-input::placeholder,
.wpcf7 textarea.pwa-cf7-input::placeholder {
    color:rgba(245,240,232,0.35); font-family:var(--font-body);
}
.pwa-cf7-input:focus, .wpcf7 input.pwa-cf7-input:focus,
.wpcf7 select.pwa-cf7-input:focus, .wpcf7 textarea.pwa-cf7-input:focus {
    border-color:var(--color-accent); background:rgba(255,255,255,0.05);
}
.wpcf7 textarea.pwa-cf7-input { resize:vertical; min-height:150px; }
.wpcf7 select.pwa-cf7-input {
    cursor:pointer; appearance:none;
    background:rgba(15,15,20,0.9) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c9a84c' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 0.5rem center;
    padding-right:2rem;
}
.wpcf7 select.pwa-cf7-input option {
    background:#1a1a24; color:#f5f0e8; padding:0.75rem;
}
.pwa-cf7-consent { margin:1.5rem 0; font-size:0.8rem; color:rgba(245,240,232,0.55); line-height:1.5; }
.pwa-cf7-consent a { color:var(--color-accent); text-decoration:underline; text-underline-offset:2px; }
.pwa-cf7-consent input[type="checkbox"] { accent-color:var(--color-accent); margin-right:0.5rem; }
.pwa-cf7-submit, .wpcf7 input.pwa-cf7-submit {
    width:100%; padding:1rem; background:transparent; border:1px solid var(--color-accent);
    color:var(--color-accent); font-family:var(--font-body); font-weight:600;
    font-size:0.9rem; letter-spacing:0.06em; cursor:pointer; border-radius:4px;
    transition:all 0.3s; margin-top:0.5rem;
}
.pwa-cf7-submit:hover, .wpcf7 input.pwa-cf7-submit:hover {
    background:var(--color-accent); color:var(--color-surface-dark);
}
/* Hide CF7 spinner */
.wpcf7-spinner { display:none !important; }
/* Loading state */
.wpcf7-form.submitting .pwa-cf7-submit { pointer-events:none; opacity:0.7; }
/* CF7 ships no CSS here (wpcf7_load_css off) — hide its helpers ourselves */
.wpcf7 .hidden-fields-container { display:none; }
.wpcf7 fieldset { border:0; padding:0; margin:0; min-width:0; }
.wpcf7 .screen-reader-response {
    position: absolute;
    width: 1px; height: 1px;
    margin: -1px; padding: 0; border: 0;
    overflow: hidden; clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

/* Field errors — gold marking, consistent with the validation message */
.wpcf7-not-valid { border-color:var(--color-accent-light) !important; background:rgba(201,168,76,0.06) !important; }
.wpcf7-not-valid-tip {
    color:var(--color-accent-light); font-family:var(--font-body);
    font-size:0.78rem; font-style:italic; margin-top:0.4rem; display:block;
}

/* The notice box only exists after a submit — hide the empty shell (CF7's own CSS used to do this) */
.wpcf7 form.init .wpcf7-response-output,
.wpcf7 form.resetting .wpcf7-response-output,
.wpcf7 form.submitting .wpcf7-response-output {
    display: none;
}

/* Response notice — minimal card in the site's line */
.wpcf7 .wpcf7-response-output {
    margin:1.75rem 0 0; padding:0.9rem 1.25rem;
    border:1px solid rgba(245,240,232,0.2); border-radius:var(--radius-sm);
    background:rgba(255,255,255,0.03);
    color:rgba(245,240,232,0.85);
    font-family:var(--font-body); font-size:0.85rem; line-height:1.6;
    text-align:center;
}
.wpcf7 form.sent .wpcf7-response-output {
    border-color:var(--color-accent); color:var(--color-accent-light);
    background:rgba(201,168,76,0.07);
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output {
    border-color:rgba(201,168,76,0.35);
}
.wpcf7 .wpcf7-form-control-wrap { display:block; }

/* Mobile full-width */
@media (max-width: 768px) {
    .pwh-content { margin: 0 auto !important; padding: 3rem 1.5rem !important; text-align: center; }
    .pwh-content div:first-child { margin: 0 auto 1.5rem !important; }
    .pwh-content h1 { font-size: clamp(1.8rem, 8vw, 2.5rem) !important; }
    .pwh-content p { font-size: 0.95rem !important; }
    .pwh-content div:last-child { justify-content: center; }
    section { overflow-x: clip; }
}

/* (Legacy light CF7 block removed — the dark canonical block above owns all form styling) */

/* Literary Decorative Masks */
.literary-mask-1 { border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%; }
.literary-mask-2 { border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%; }
.literary-mask-3 { border-radius: 40% 60% 60% 40% / 60% 40% 60% 40%; }

/* ==========================================================================
   Templates (404, page, archive, search)
   ========================================================================== */

/* ── Shared ── */
.pwa-tpl-label {
    display: inline-block;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.15em;
    color: var(--color-accent);
    text-transform: uppercase;
    margin-bottom: 0.75rem;
}
.pwa-tpl-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.85rem 2rem;
    background: var(--color-accent);
    color: var(--color-primary);
    font-weight: 700;
    font-size: 0.9rem;
    text-decoration: none;
    border-radius: var(--radius-default);
    transition: all 0.3s;
}
.pwa-tpl-btn:hover {
    filter: brightness(1.1);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
}

/* ── 404 ── */
.pwa-tpl-404 {
    background: var(--color-surface-dark);
    min-height: calc(100vh - 60px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}
.pwa-tpl-404__inner { max-width: 560px; }
.pwa-tpl-404__code {
    font-family: var(--font-headline);
    font-size: clamp(6rem, 15vw, 10rem);
    font-weight: 700;
    color: var(--color-accent);
    line-height: 1;
    opacity: 0.15;
    display: block;
    margin-bottom: -1.5rem;
}
.pwa-tpl-404__title {
    font-family: var(--font-headline);
    font-size: clamp(1.5rem, 4vw, 2.2rem);
    font-weight: 700;
    color: #fff;
    margin-bottom: 0.75rem;
}
.pwa-tpl-404__text {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.6);
    line-height: 1.7;
    margin-bottom: 2rem;
}
.pwa-tpl-404__search { margin-top: 2.5rem; }
.pwa-tpl-404__search-label {
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 0.75rem;
}
.pwa-tpl-404 .search-form {
    display: flex;
    gap: 0.5rem;
    max-width: 400px;
    margin: 0 auto;
}
.pwa-tpl-404 .search-field {
    flex: 1;
    padding: 0.75rem 1rem;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-default);
    color: #fff;
    font-family: var(--font-body);
    font-size: 0.9rem;
}
.pwa-tpl-404 .search-field::placeholder { color: rgba(255, 255, 255, 0.4); }
.pwa-tpl-404 .search-submit {
    padding: 0.75rem 1.25rem;
    background: var(--color-accent);
    color: var(--color-primary);
    border: none;
    border-radius: var(--radius-default);
    font-weight: 700;
    font-size: 0.85rem;
    cursor: pointer;
    font-family: var(--font-body);
    transition: background 0.3s;
}
.pwa-tpl-404 .search-submit:hover { background: var(--color-accent-light); }

/* ── Page ── */
.pwa-tpl-page {
    background: var(--color-surface);
    padding: 4rem 2rem 5rem;
    min-height: calc(100vh - 60px);
}
.pwa-tpl-page__inner { max-width: 800px; margin: 0 auto; }
.pwa-tpl-page__title {
    font-family: var(--font-headline);
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    font-weight: 700;
    color: var(--color-primary);
    margin-bottom: 2rem;
    line-height: 1.2;
}
.pwa-tpl-page__content {
    font-size: 1.05rem;
    line-height: 1.85;
    color: var(--color-text);
}
.pwa-tpl-page__content h2 {
    font-family: var(--font-headline);
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--color-primary);
    margin: 2.5rem 0 1rem;
}
.pwa-tpl-page__content h3 {
    font-family: var(--font-headline);
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--color-primary);
    margin: 2rem 0 0.75rem;
}
.pwa-tpl-page__content p { margin-bottom: 1.25rem; }
.pwa-tpl-page__content a { color: var(--color-accent); text-decoration-thickness: 1px; text-underline-offset: 2px; }
.pwa-tpl-page__content blockquote {
    border-left: 3px solid var(--color-accent);
    padding: 0.75rem 1.5rem;
    margin: 1.5rem 0;
    font-style: italic;
    color: var(--color-text-light);
}
.pwa-tpl-page__content img { border-radius: var(--radius-default); margin: 1.5rem 0; }
.pwa-tpl-page__content ul, .pwa-tpl-page__content ol { padding-left: 1.5rem; margin-bottom: 1.25rem; }
.pwa-tpl-page__content li { margin-bottom: 0.4rem; }

/* ── Archive / Search ── */
.pwa-tpl-archive {
    background: var(--color-surface-dark);
    min-height: calc(100vh - 60px);
    padding: 0 2rem 5rem;
}
.pwa-tpl-archive__header {
    max-width: 1100px;
    margin: 0 auto;
    padding: 4rem 0 3rem;
    text-align: center;
}
.pwa-tpl-archive__title {
    font-family: var(--font-headline);
    font-size: clamp(1.5rem, 4vw, 2.4rem);
    font-weight: 700;
    color: #fff;
    margin-bottom: 0.75rem;
}
.pwa-tpl-archive__desc {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.6);
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.7;
}

/* ── Card Grid ── */
.pwa-tpl-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    max-width: 1100px;
    margin: 0 auto;
}
@media (min-width: 640px)  { .pwa-tpl-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px)  { .pwa-tpl-grid { grid-template-columns: repeat(3, 1fr); } }

.pwa-tpl-card {
    display: block;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-lg);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: transform 0.4s, border-color 0.4s;
}
.pwa-tpl-card:hover {
    transform: translateY(-4px);
    border-color: rgba(201, 168, 76, 0.25);
}
.pwa-tpl-card:focus-visible {
    transform: translateY(-4px);
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
}
.pwa-tpl-card__img {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--color-secondary);
}
.pwa-tpl-card__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}
.pwa-tpl-card:hover .pwa-tpl-card__img img { transform: scale(1.04); }
.pwa-tpl-card__body { padding: 1.25rem; }
.pwa-tpl-card__cat {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-accent);
    margin-bottom: 0.4rem;
}
.pwa-tpl-card__title {
    font-family: var(--font-headline);
    font-size: 1.05rem;
    font-weight: 600;
    color: #fff;
    line-height: 1.35;
    margin-bottom: 0.5rem;
    transition: color 0.3s;
}
.pwa-tpl-card:hover .pwa-tpl-card__title { color: var(--color-accent); }
.pwa-tpl-card__meta {
    font-size: 0.78rem;
    color: rgba(255, 255, 255, 0.55);
}
.pwa-tpl-card__excerpt {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.6);
    line-height: 1.6;
}

/* ── Pagination ── */
.pwa-tpl-pagination {
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    max-width: 1100px;
    margin: 3rem auto 0;
    padding-top: 2rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.pwa-tpl-pagination a {
    color: var(--color-accent);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.9rem;
    transition: opacity 0.2s;
}
.pwa-tpl-pagination a:hover { opacity: 0.8; }

/* ── Empty state ── */
.pwa-tpl-empty {
    text-align: center;
    padding: 4rem 2rem;
    max-width: 500px;
    margin: 0 auto;
}
.pwa-tpl-empty p { color: rgba(255, 255, 255, 0.6); font-size: 1rem; }
.pwa-tpl-empty .search-form {
    display: flex;
    gap: 0.5rem;
    max-width: 400px;
    margin: 0 auto;
}
.pwa-tpl-empty .search-field {
    flex: 1;
    padding: 0.75rem 1rem;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-default);
    color: #fff;
    font-family: var(--font-body);
    font-size: 0.9rem;
}
.pwa-tpl-empty .search-field::placeholder { color: rgba(255, 255, 255, 0.4); }
.pwa-tpl-empty .search-submit {
    padding: 0.75rem 1.25rem;
    background: var(--color-accent);
    color: var(--color-primary);
    border: none;
    border-radius: var(--radius-default);
    font-weight: 700;
    font-size: 0.85rem;
    cursor: pointer;
    font-family: var(--font-body);
}

/* Reduced Motion (Accessibility WCAG 2.3.3) */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ==========================================================================
   Print Styles
   ========================================================================== */
@media print {
    /* Hide non-printable elements */
    nav, .pwn-nav, .pwn-hamburger, .pwn-mobile,
    #pwa-progress,
    .pwa-tpl-btn, .search-form,
    .pwa-tpl-pagination,
    button, [role="button"],
    iframe,
    .skip-link {
        display: none !important;
    }

    /* Reset backgrounds and colors for ink saving */
    *, *::before, *::after {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    body {
        font-family: Georgia, 'Times New Roman', serif;
        font-size: 12pt;
        line-height: 1.6;
        margin: 2cm;
    }

    /* Show URLs after links */
    a[href]::after { content: " (" attr(href) ")"; font-size: 0.85em; color: #555 !important; }
    a[href^="#"]::after, a[href^="javascript"]::after, a[href^="mailto"]::after { content: ""; }

    /* Typography */
    h1, h2, h3 {
        font-family: Georgia, 'Times New Roman', serif;
        page-break-after: avoid;
        orphans: 3;
        widows: 3;
    }
    h1 { font-size: 24pt; }
    h2 { font-size: 18pt; }
    h3 { font-size: 14pt; }
    p, li { orphans: 3; widows: 3; }

    /* Images */
    img {
        max-width: 100% !important;
        page-break-inside: avoid;
    }

    /* Article body */
    article, .pwa-tpl-page__content {
        max-width: 100%;
        margin: 0;
        padding: 0;
    }

    /* Page breaks */
    section { page-break-inside: avoid; }
    .pwa-tpl-card { page-break-inside: avoid; }
}

/* ═══════════════════════════════════════════
   Cinematic motion layer (pairs with js/cinematic.js)
   ═══════════════════════════════════════════ */

/* Cross-page cinematic fade (View Transitions API — progressive enhancement) */
@media (prefers-reduced-motion: no-preference) {
	@view-transition {
		navigation: auto;
	}
	::view-transition-old(root) {
		animation-duration: 0.35s;
	}
	::view-transition-new(root) {
		animation-duration: 0.45s;
	}

	html {
		scroll-behavior: smooth;
	}
}

/* Un-revealed sections are translated 42px down; the last one would extend
   the body and spawn a second scrollbar. They are invisible while translated,
   so clipping costs nothing. */
.pwa-motion body {
	overflow-y: clip;
}

/* Section scroll reveal: armed by JS only (no-JS visitors see everything) */
.pwa-motion [data-elementor-type] > .elementor-section:not(:first-child),
.pwa-motion [data-elementor-type] > .e-con:not(:first-child) {
	opacity: 0;
	transform: translateY(42px);
	transition: opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1), transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}
.pwa-motion [data-elementor-type] > .elementor-section.pwa-inview,
.pwa-motion [data-elementor-type] > .e-con.pwa-inview {
	opacity: 1;
	transform: translateY(0);
}

/* Hero parallax layer promotion */
.pwh-slides {
	will-change: transform;
}

/* CF7 select: comfortable touch target and air before the next label */
.pwa-cf7-field select.pwa-cf7-input {
	margin-bottom: 0.4rem;
	min-height: 44px;
}

/* ═══════════════════════════════════════════
   Legal page template (templates/legal.php)
   ═══════════════════════════════════════════ */
.pwa-legal { background: var(--color-surface); color: var(--color-text); }

.pwa-legal__hero {
	background: var(--color-surface-dark);
	color: var(--color-text-on-dark);
	padding: 9.5rem 2rem 4rem;
	position: relative;
}
.pwa-legal__hero::after {
	content: "";
	position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
	background: linear-gradient(90deg, transparent, rgba(201,168,76,0.45), transparent);
}
.pwa-legal__hero-inner { max-width: 1100px; margin: 0 auto; }
.pwa-legal__eyebrow {
	display: inline-block; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.22em;
	text-transform: uppercase; color: var(--color-accent); margin-bottom: 1rem;
}
.pwa-legal__title {
	font-family: var(--font-headline); font-weight: 500; line-height: 1.05;
	font-size: clamp(2.4rem, 5vw, 4rem); color: #fff; margin-bottom: 1rem; letter-spacing: -0.01em;
}
.pwa-legal__meta {
	display: flex; flex-wrap: wrap; gap: 0.6rem; font-size: 0.85rem;
	color: rgba(245,240,232,0.55);
}
.pwa-legal__summary {
	margin-top: 2.5rem; max-width: 760px;
	border: 1px solid rgba(201,168,76,0.3); border-left: 3px solid var(--color-accent);
	padding: 1.5rem 1.75rem; background: rgba(255,255,255,0.03);
}
.pwa-legal__summary-title {
	font-family: var(--font-body); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.18em;
	text-transform: uppercase; color: var(--color-accent); margin-bottom: 0.9rem;
}
.pwa-legal__summary ul { list-style: none; display: grid; gap: 0.6rem; }
.pwa-legal__summary li {
	position: relative; padding-left: 1.4rem; font-size: 0.95rem; line-height: 1.6;
	color: rgba(245,240,232,0.85);
}
.pwa-legal__summary li::before {
	content: ""; position: absolute; left: 0; top: 0.65em; width: 8px; height: 8px;
	transform: rotate(45deg); background: var(--color-accent); opacity: 0.8;
}

.pwa-legal__body {
	max-width: 1100px; margin: 0 auto; padding: 3.5rem 2rem 5rem;
	display: grid; grid-template-columns: 1fr; gap: 2.5rem;
}
@media (min-width: 960px) {
	.pwa-legal__body { grid-template-columns: 240px minmax(0, 1fr); gap: 5rem; }
}

/* TOC */
.pwa-legal__toc { align-self: start; }
@media (min-width: 960px) {
	.pwa-legal__toc { position: sticky; top: 6.5rem; }
	.pwa-legal__toc-details > summary { pointer-events: none; list-style: none; }
	.pwa-legal__toc-details > summary::-webkit-details-marker { display: none; }
}
.pwa-legal__toc-title {
	font-size: 0.72rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase;
	color: var(--color-text-light); margin-bottom: 1rem; cursor: pointer;
}
.pwa-legal__toc-list { list-style: none; counter-reset: toc; border-left: 1px solid var(--color-border); }
.pwa-legal__toc-list li { counter-increment: toc; }
.pwa-legal__toc-list a {
	display: block; padding: 0.45rem 0 0.45rem 1rem; margin-left: -1px;
	border-left: 2px solid transparent;
	font-size: 0.88rem; line-height: 1.4; color: var(--color-text-secondary); text-decoration: none;
	transition: color 0.2s, border-color 0.2s;
}
.pwa-legal__toc-list a::before { content: counter(toc) ". "; color: var(--color-text-light); }
.pwa-legal__toc-list a:hover,
.pwa-legal__toc-list a[aria-current="true"] { color: var(--color-text); border-left-color: var(--color-accent); }
.pwa-legal__toc-list a[aria-current="true"] { font-weight: 600; }

/* Prose */
.pwa-legal__content { max-width: 68ch; font-size: 1.02rem; line-height: 1.75; }
.pwa-legal__content > p:first-child { font-size: 1.12rem; color: var(--color-text-secondary); }
.pwa-legal__content h2 {
	font-family: var(--font-headline); font-weight: 500; font-size: 1.7rem; line-height: 1.2;
	color: var(--color-primary); margin: 3rem 0 1rem; padding-top: 1.25rem;
	border-top: 1px solid var(--color-border); scroll-margin-top: 6rem;
}
.pwa-legal__content h3 { font-size: 1.15rem; font-weight: 600; margin: 1.75rem 0 0.5rem; color: var(--color-primary); }
.pwa-legal__content p { margin-bottom: 1.1rem; }
.pwa-legal__content ul, .pwa-legal__content ol { margin: 0 0 1.25rem 1.25rem; }
.pwa-legal__content li { margin-bottom: 0.5rem; }
.pwa-legal__content li::marker { color: var(--color-accent); }
.pwa-legal__content strong { font-weight: 600; color: var(--color-primary); }
.pwa-legal__content a { color: var(--color-accent-dim); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.pwa-legal__content a:hover { color: var(--color-primary); }
.pwa-legal__content em { color: var(--color-text-secondary); }

.pwa-legal__help {
	margin-top: 3.5rem; padding: 1.5rem 1.75rem;
	border: 1px solid var(--color-border); border-radius: var(--radius-default);
	background: var(--color-surface-card); font-size: 0.95rem; line-height: 1.6;
}
.pwa-legal__help p { margin: 0; }
.pwa-legal__help a { color: var(--color-accent-dim); font-weight: 600; }

@media (prefers-reduced-motion: reduce) {
	.pwa-legal__toc-list a { transition: none; }
}
@media print {
	.pwa-legal__hero { background: #fff; color: #000; padding-top: 1rem; }
	.pwa-legal__title { color: #000; }
	.pwa-legal__toc, .pwa-legal__help { display: none; }
	.pwa-legal__body { display: block; padding: 0; }
}

/* ═══════════════════════════════════════════
   CookieYes — integrated with the Midnight Literary system.
   The plugin paints its colours inline, hence the !important.
   ═══════════════════════════════════════════ */
.cky-consent-container { font-family: var(--font-body) !important; max-width: 440px; }
.cky-consent-container .cky-consent-bar {
	background: var(--color-surface-dark) !important;
	border: 1px solid rgba(201,168,76,0.35) !important;
	border-radius: var(--radius-default) !important;
	box-shadow: 0 24px 60px rgba(0,0,0,0.55) !important;
	padding: 1.5rem 1.6rem !important;
}
.cky-consent-container .cky-title {
	font-family: var(--font-headline) !important; font-size: 1.35rem !important; font-weight: 500 !important;
	color: #f5f0e8 !important; margin-bottom: 0.5rem !important; letter-spacing: 0.01em;
}
.cky-consent-container .cky-notice-des,
.cky-consent-container .cky-notice-des p {
	color: rgba(245,240,232,0.7) !important; font-size: 0.86rem !important; line-height: 1.6 !important;
}
.cky-consent-container .cky-notice-des a { color: var(--color-accent) !important; }
.cky-consent-container .cky-notice-btn-wrapper { margin-top: 1.25rem !important; gap: 0.5rem; }
.cky-consent-container .cky-btn {
	font-family: var(--font-body) !important; font-size: 0.82rem !important; font-weight: 600 !important;
	letter-spacing: 0.02em; border-radius: var(--radius-sm) !important; min-height: 44px;
	padding: 0.6rem 1.1rem !important; transition: background 0.25s, color 0.25s, border-color 0.25s !important;
	margin: 0 !important;
}
.cky-consent-container .cky-btn-customize,
.cky-consent-container .cky-btn-reject {
	color: rgba(245,240,232,0.8) !important; background: transparent !important;
	border: 1px solid rgba(245,240,232,0.22) !important;
}
.cky-consent-container .cky-btn-customize:hover,
.cky-consent-container .cky-btn-reject:hover {
	color: #fff !important; border-color: rgba(245,240,232,0.5) !important; background: rgba(255,255,255,0.05) !important;
}
.cky-consent-container .cky-btn-accept {
	color: var(--color-primary-dim) !important; background: var(--color-accent) !important;
	border: 1px solid var(--color-accent) !important;
}
.cky-consent-container .cky-btn-accept:hover { background: var(--color-accent-light) !important; border-color: var(--color-accent-light) !important; }
.cky-consent-container .cky-btn:focus-visible { outline: 2px solid var(--color-accent) !important; outline-offset: 2px !important; }

/* Floating "revisit consent" button */
.cky-btn-revisit-wrapper {
	background: var(--color-surface-dark) !important;
	border: 1px solid rgba(201,168,76,0.45) !important;
	box-shadow: 0 8px 24px rgba(0,0,0,0.45) !important;
	width: 44px !important; height: 44px !important;
	transition: border-color 0.25s, transform 0.25s !important;
}
.cky-btn-revisit-wrapper:hover { border-color: var(--color-accent) !important; transform: translateY(-2px); }
.cky-btn-revisit-wrapper .cky-btn-revisit img { display: none !important; }
.cky-btn-revisit-wrapper .cky-btn-revisit::before {
	content: ""; display: block; width: 20px; height: 20px; margin: 0 auto;
	background: var(--color-accent);
	-webkit-mask: url("/wp-content/plugins/cookie-law-info/lite/frontend/images/revisit.svg") center / contain no-repeat;
	        mask: url("/wp-content/plugins/cookie-law-info/lite/frontend/images/revisit.svg") center / contain no-repeat;
}
.cky-btn-revisit-wrapper::before {
	/* tooltip */
	font-family: var(--font-body) !important; font-size: 0.78rem !important;
	background: var(--color-surface-dark) !important; color: #f5f0e8 !important;
	border: 1px solid rgba(201,168,76,0.35) !important; border-radius: var(--radius-sm) !important;
}

/* Preference centre (modal) */
.cky-modal .cky-preference-center {
	background: var(--color-surface-dark) !important; color: #f5f0e8 !important;
	border: 1px solid rgba(201,168,76,0.35) !important; border-radius: var(--radius-default) !important;
	font-family: var(--font-body) !important;
}
.cky-modal .cky-preference-header { border-bottom: 1px solid rgba(245,240,232,0.1) !important; }
.cky-modal .cky-preference-title { font-family: var(--font-headline) !important; font-size: 1.4rem !important; font-weight: 500 !important; color: #f5f0e8 !important; }
.cky-modal .cky-preference-content-wrapper,
.cky-modal .cky-preference-content-wrapper p,
.cky-modal .cky-accordion-header-des p,
.cky-modal .cky-cookie-des-table td { color: rgba(245,240,232,0.7) !important; font-size: 0.88rem !important; }
.cky-modal .cky-accordion { border-bottom: 1px solid rgba(245,240,232,0.1) !important; }
.cky-modal .cky-accordion-btn,
.cky-modal .cky-accordion-header-des { color: #f5f0e8 !important; }
.cky-modal .cky-accordion-btn { font-family: var(--font-body) !important; font-weight: 600 !important; }
.cky-modal .cky-always-active { color: var(--color-accent) !important; }
.cky-modal .cky-switch input[type="checkbox"]:checked { background: var(--color-accent) !important; }
.cky-modal .cky-footer-wrapper { border-top: 1px solid rgba(245,240,232,0.1) !important; }
.cky-modal .cky-footer-shadow { display: none !important; }
.cky-modal .cky-btn-close img { filter: invert(1) opacity(0.7); }
.cky-modal .cky-show-desc-btn,
.cky-modal .cky-hide-desc-btn { color: var(--color-accent) !important; }
.cky-modal .cky-btn {
	font-family: var(--font-body) !important; font-size: 0.82rem !important; font-weight: 600 !important;
	border-radius: var(--radius-sm) !important; min-height: 44px;
}
.cky-modal .cky-btn-reject, .cky-modal .cky-btn-preferences {
	color: rgba(245,240,232,0.8) !important; background: transparent !important;
	border: 1px solid rgba(245,240,232,0.22) !important;
}
.cky-modal .cky-btn-accept { color: var(--color-primary-dim) !important; background: var(--color-accent) !important; border: 1px solid var(--color-accent) !important; }
.cky-modal .cky-cookie-des-table { border-color: rgba(245,240,232,0.1) !important; }
.cky-modal .cky-cookie-des-table tr { border-color: rgba(245,240,232,0.08) !important; }