/**
 * Progressisme Theme - BRUTALIST Stylesheet
 * Raw. Bold. Uncompromising.
 */

/* ==========================================================================
   BRUTALIST RESET
   ========================================================================== */

:root {
    --brutal-black: #0A0A0A;
    --brutal-white: #F5F5F0;
    --brutal-red: #FF0000;
    --brutal-yellow: #FFFF00;
    --brutal-border: 4px solid #0A0A0A;
    --brutal-border-accent: 4px solid #FF0000;
    --brutal-shadow: 8px 8px 0 #0A0A0A;
    --brutal-shadow-hover: 12px 12px 0 #FF0000;
}

*,
*::before,
*::after {
    box-sizing: border-box;
    border-radius: 0 !important;
}

/* ==========================================================================
   BASE TYPOGRAPHY
   ========================================================================== */

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background-color: var(--brutal-white);
    font-size: 1.125rem;
}

h1, h2, h3, h4, h5, h6,
.has-heading-font-family {
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 0.9;
    font-weight: 400;
}

/* BRUTAL LINKS */
a {
    color: var(--brutal-black);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
    transition: none;
}

a:hover {
    background-color: var(--brutal-red);
    color: var(--brutal-white);
    text-decoration: none;
}

/* ==========================================================================
   HEADER - SOLID BLACK BAR
   ========================================================================== */

.site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background-color: var(--brutal-black) !important;
    border-bottom: var(--brutal-border-accent);
}

.site-header * {
    color: var(--brutal-white) !important;
}

.site-header .wp-block-navigation__responsive-container-open {
    padding: 0.5rem;
}

.site-header .wp-block-navigation__responsive-container.is-menu-open {
    padding: 2rem;
    background: var(--brutal-black) !important;
}

/* Navigation links - NO GRADIENTS */
.site-header .wp-block-navigation-item a {
    position: relative;
    padding: 0.5rem 1rem;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-family: 'Bebas Neue', Impact, sans-serif;
    font-size: 1.25rem;
    font-weight: 400;
}

.site-header .wp-block-navigation-item a:hover {
    background-color: var(--brutal-red) !important;
    color: var(--brutal-white) !important;
}

/* Current page indicator */
.site-header .wp-block-navigation-item.current-menu-item a {
    background-color: var(--brutal-red) !important;
}

/* Search - BRUTAL STYLE */
.site-header .wp-block-search__input {
    border: var(--brutal-border);
    border-color: var(--brutal-white);
    background: transparent;
    color: var(--brutal-white);
    padding: 0.75rem 1rem;
    min-width: 180px;
}

.site-header .wp-block-search__input::placeholder {
    color: rgba(245, 245, 240, 0.6);
}

.site-header .wp-block-search__button {
    background: var(--brutal-red) !important;
    color: var(--brutal-white) !important;
    border: 4px solid var(--brutal-red) !important;
    padding: 0.75rem 1.5rem !important;
    font-family: 'Bebas Neue', Impact, sans-serif !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    box-shadow: 4px 4px 0 var(--brutal-black) !important;
}

.site-header .wp-block-search__button:hover {
    background: var(--brutal-white) !important;
    border-color: var(--brutal-white) !important;
    color: var(--brutal-black) !important;
    transform: translate(-2px, -2px);
    box-shadow: 6px 6px 0 var(--brutal-black) !important;
}

.site-header .wp-block-search__button svg {
    fill: var(--brutal-black);
}

.site-header .wp-block-search__button:hover svg {
    fill: var(--brutal-black);
}

/* ==========================================================================
   CARDS - BRUTAL BOXES
   ========================================================================== */

.article-card,
.featured-card {
    border: var(--brutal-border);
    box-shadow: var(--brutal-shadow);
    background: var(--brutal-white);
    overflow: hidden;
    transition: none;
}

/* HOVER: Simple lift + red shadow - NO background change */
.article-card:hover,
.featured-card:hover {
    transform: translate(-4px, -4px);
    box-shadow: var(--brutal-shadow-hover);
}

/* Title turns red on hover */
.article-card:hover .wp-block-post-title a,
.featured-card:hover .wp-block-post-title a {
    color: #FF0000 !important;
    background: transparent !important;
}

/* Card images - GRAYSCALE with color on hover */
.article-card .wp-block-post-featured-image img,
.featured-card .wp-block-post-featured-image img,
.article-card figure img,
.featured-card figure img {
    filter: grayscale(30%) contrast(1.1);
    transition: filter 0.2s;
}

.article-card:hover .wp-block-post-featured-image img,
.featured-card:hover .wp-block-post-featured-image img,
.article-card:hover figure img,
.featured-card:hover figure img {
    filter: grayscale(0%) contrast(1.2);
}

/* Card titles */
.article-card .wp-block-post-title,
.featured-card .wp-block-post-title {
    text-transform: uppercase;
    line-height: 0.95;
}

.article-card .wp-block-post-title a,
.featured-card .wp-block-post-title a {
    text-decoration: none;
}

/* Title links - ensure visibility on hover */
.article-card .wp-block-post-title a,
.featured-card .wp-block-post-title a {
    text-decoration: none;
    background: transparent !important;
}

/* Category labels container - hide separators, use flex gap */
.wp-block-post-terms {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* Hide the comma separators generated by WordPress */
.wp-block-post-terms__separator {
    display: none;
}

/* Category labels - RED BADGES */
.wp-block-post-terms a {
    background: var(--brutal-red);
    color: var(--brutal-white) !important;
    padding: 0.25rem 0.75rem;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 700;
    display: inline-block;
}

.wp-block-post-terms a:hover {
    background: var(--brutal-black);
    color: var(--brutal-white) !important;
}

/* Keep category badges visible on card hover */
.article-card:hover .wp-block-post-terms a,
.featured-card:hover .wp-block-post-terms a {
    background: #F5F5F0 !important;
    color: #0A0A0A !important;
}

/* ==========================================================================
   INDEX NUMBERS ON CARDS
   ========================================================================== */

.article-card {
    position: relative;
    counter-increment: card-counter;
}

.article-card::before {
    content: counter(card-counter, decimal-leading-zero);
    position: absolute;
    top: -0.5rem;
    left: -0.5rem;
    font-family: 'Bebas Neue', Impact, sans-serif;
    font-size: 4rem;
    color: var(--brutal-red);
    opacity: 0.3;
    line-height: 1;
    z-index: 1;
    pointer-events: none;
}

.articles-grid {
    counter-reset: card-counter;
}

/* ==========================================================================
   ARTICLE CONTENT
   ========================================================================== */

.article-content {
    font-size: 1.125rem;
    line-height: 1.75;
}

.article-content.wp-block-group {
    --wp--style--block-gap: 1em !important;
}

.article-content p,
.wp-block-post-content p {
    margin-bottom: 1em !important;
    margin-top: 0 !important;
}

.article-content h2,
.wp-block-post-content h2 {
    margin-top: 2em !important;
    margin-bottom: 0.75em;
    padding-bottom: 0.4em;
    border-bottom: 2px solid var(--brutal-red);
    font-size: clamp(1.5rem, 4vw, 2rem);
}

.article-content h3 {
    margin-top: 2.5em;
    margin-bottom: 0.75em;
}

.article-content ul,
.article-content ol {
    margin-bottom: 1.5em;
    padding-left: 1.5em;
}

.article-content li {
    margin-bottom: 0.5em;
}

/* ==========================================================================
   ESSENTIAL BLOCK - L'ESSENTIEL
   ========================================================================== */

.essential-block {
    margin: 2em 0;
    padding: 1.5rem 2rem;
    border-left: 8px solid var(--brutal-red);
    background: rgba(10, 10, 10, 0.08);
}

.essential-block::before {
    content: "L'ESSENTIEL";
    display: block;
    font-family: 'Bebas Neue', Impact, sans-serif;
    font-size: 2rem;
    font-weight: 400;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--brutal-red);
    margin-bottom: 1rem;
}

.essential-block p {
    margin-bottom: 0.75em !important;
    margin-top: 0 !important;
    line-height: 1.6;
}

.essential-block p:last-child {
    margin-bottom: 0 !important;
}

.essential-block p strong {
    color: var(--brutal-red);
}

/* ==========================================================================
   PRECEDENT BLOCK
   ========================================================================== */

.precedent-block {
    margin: 2em 0;
    padding: 2rem 2.5rem;
    background: var(--brutal-black);
    color: var(--brutal-white);
    border-left: 8px solid var(--brutal-red);
    font-style: normal;
    font-size: 1.125rem;
    line-height: 1.7;
}

.precedent-block p {
    color: var(--brutal-white);
    margin-bottom: 0 !important;
}

/* BRUTAL BLOCKQUOTES */
.article-content blockquote,
blockquote {
    margin: 2em 0;
    padding: 2rem 2.5rem;
    background: var(--brutal-black);
    color: var(--brutal-white);
    border: none;
    border-left: 8px solid var(--brutal-red);
    font-size: 1.125rem;
    font-style: italic;
    line-height: 1.7;
}

.article-content blockquote p,
blockquote p {
    color: var(--brutal-white);
    margin-bottom: 0;
}

.article-content blockquote cite,
blockquote cite {
    color: rgba(245, 245, 240, 0.7);
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 0.875rem;
    display: block;
    margin-top: 1rem;
}

/* BRUTAL PULLQUOTES */
.wp-block-pullquote {
    border-top: 8px solid var(--brutal-red);
    border-bottom: 8px solid var(--brutal-red);
    padding: 2rem 0;
}

.wp-block-pullquote blockquote {
    background: transparent;
    color: var(--brutal-black);
    border: none;
    padding: 0;
}

.wp-block-pullquote p {
    font-size: 2rem;
    text-transform: uppercase;
    line-height: 1.1;
    color: var(--brutal-black);
}

.article-content figure {
    margin: 2.5em 0;
}

.article-content figure img {
    border: var(--brutal-border);
}

.article-content figcaption {
    margin-top: 0.75em;
    text-align: left;
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ==========================================================================
   BUTTONS - BRUTAL STYLE
   ========================================================================== */

.wp-block-button__link {
    border: var(--brutal-border) !important;
    background: transparent !important;
    color: var(--brutal-black) !important;
    font-family: 'Bebas Neue', Impact, sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 1rem 2rem;
    transition: none;
    box-shadow: 4px 4px 0 var(--brutal-black);
}

.wp-block-button__link:hover {
    background: var(--brutal-red) !important;
    color: var(--brutal-white) !important;
    border-color: var(--brutal-red) !important;
    transform: translate(-2px, -2px);
    box-shadow: 6px 6px 0 var(--brutal-black);
}

/* Filled button variant */
.is-style-fill .wp-block-button__link {
    background: var(--brutal-black) !important;
    color: var(--brutal-white) !important;
}

.is-style-fill .wp-block-button__link:hover {
    background: var(--brutal-red) !important;
}

/* ==========================================================================
   NEWSLETTER SECTION - BRUTAL
   ========================================================================== */

.newsletter-section,
.newsletter-cta {
    position: relative;
    background: var(--brutal-black) !important;
    border-top: 8px solid var(--brutal-red);
    border-bottom: 8px solid var(--brutal-red);
    overflow: visible;
}

.newsletter-section *,
.newsletter-cta * {
    color: var(--brutal-white) !important;
}

.newsletter-section h2,
.newsletter-section h3,
.newsletter-cta h2,
.newsletter-cta h3 {
    text-transform: uppercase;
}

.newsletter-section .wp-block-button__link,
.newsletter-cta .wp-block-button__link {
    background: var(--brutal-yellow) !important;
    color: var(--brutal-black) !important;
    border-color: var(--brutal-yellow) !important;
}

.newsletter-section .wp-block-button__link:hover,
.newsletter-cta .wp-block-button__link:hover {
    background: var(--brutal-white) !important;
    border-color: var(--brutal-white) !important;
}

/* Remove decorative circles */
.newsletter-section::before,
.newsletter-section::after,
.newsletter-cta::before,
.newsletter-cta::after {
    display: none;
}

/* ==========================================================================
   SHARE BUTTONS
   ========================================================================== */

.share-links .wp-block-social-link {
    transition: none;
}

.share-links .wp-block-social-link a {
    padding: 0.75rem;
    border: 2px solid var(--brutal-black);
    text-decoration: none;
}

.share-links .wp-block-social-link:hover {
    transform: none;
}

.share-links .wp-block-social-link:hover a {
    background: var(--brutal-red);
    border-color: var(--brutal-red);
}

/* X (Twitter) icon - force white color for visibility */
.share-links .wp-social-link-x svg {
    fill: var(--brutal-white) !important;
}

.share-links .wp-social-link-x a {
    background: var(--brutal-black);
}

/* ==========================================================================
   AUTHOR BOX
   ========================================================================== */

.author-box {
    border: var(--brutal-border);
    box-shadow: var(--brutal-shadow);
    background: var(--brutal-white);
}

.author-box .wp-block-post-author__avatar img {
    border-radius: 0 !important;
    border: 2px solid var(--brutal-black);
}

.author-box .wp-block-post-author__name {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.author-box .wp-block-post-author__bio {
    margin-top: 0.5rem;
    color: var(--brutal-black);
    opacity: 0.8;
}

/* Article header author byline */
.article-header .wp-block-post-author__byline {
    font-family: 'Inter', sans-serif;
    font-size: var(--wp--preset--font-size--small) !important;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.article-header .wp-block-post-author__name {
    font-family: 'Inter', sans-serif;
    font-size: var(--wp--preset--font-size--small) !important;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ==========================================================================
   COMMENTS
   ========================================================================== */

.comments-section .comment-form input[type="text"],
.comments-section .comment-form input[type="email"],
.comments-section .comment-form input[type="url"],
.comments-section .comment-form textarea {
    width: 100%;
    padding: 1rem;
    border: var(--brutal-border);
    background: transparent;
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    transition: none;
}

.comments-section .comment-form input:focus,
.comments-section .comment-form textarea:focus {
    outline: 4px solid var(--brutal-red);
    outline-offset: 0;
    border-color: var(--brutal-black);
}

.comments-section .comment-form .submit {
    background: var(--brutal-black);
    color: var(--brutal-white);
    border: var(--brutal-border);
    padding: 1rem 2rem;
    font-family: 'Bebas Neue', Impact, sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    cursor: pointer;
    transition: none;
    box-shadow: 4px 4px 0 var(--brutal-black);
}

.comments-section .comment-form .submit:hover {
    background: var(--brutal-red);
    border-color: var(--brutal-red);
    transform: translate(-2px, -2px);
    box-shadow: 6px 6px 0 var(--brutal-black);
}

/* ==========================================================================
   FOOTER - BRUTAL GRID
   ========================================================================== */

.site-footer {
    background: var(--brutal-black) !important;
    border-top: 8px solid var(--brutal-red);
}

.site-footer * {
    color: var(--brutal-white) !important;
}

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

.site-footer a:hover {
    background: var(--brutal-red);
    color: var(--brutal-white) !important;
    text-decoration: none;
}

.site-footer .wp-block-social-link a {
    border: 2px solid var(--brutal-white);
    text-decoration: none;
}

.site-footer .wp-block-social-link:hover a {
    background: var(--brutal-red);
    border-color: var(--brutal-red);
}

/* Email icon in footer - white border like other icons */
.site-footer .wp-social-link-mail,
.site-footer [class*="mail"] {
    background: transparent !important;
}

.site-footer .wp-social-link-mail a,
.site-footer [class*="mail"] a {
    background: transparent !important;
    border: 2px solid var(--brutal-white) !important;
}

.site-footer .wp-social-link-mail svg,
.site-footer [class*="mail"] svg {
    fill: var(--brutal-white) !important;
}

.site-footer .wp-social-link-mail:hover a,
.site-footer [class*="mail"]:hover a {
    background: var(--brutal-red) !important;
    border-color: var(--brutal-red) !important;
}

/* ==========================================================================
   QUERY LOOP / GRID
   ========================================================================== */

.wp-block-post-template {
    gap: 2rem;
}

.wp-block-post-template.is-flex-container.columns-3 > li {
    width: calc(33.333% - 1.5rem);
}

@media (max-width: 1024px) {
    .wp-block-post-template.is-flex-container.columns-3 > li {
        width: calc(50% - 1rem);
    }
}

@media (max-width: 768px) {
    .wp-block-post-template.is-flex-container.columns-3 > li {
        width: 100%;
    }
}

/* ==========================================================================
   PAGINATION - BRUTAL
   ========================================================================== */

.wp-block-query-pagination {
    gap: 0.5rem;
}

.wp-block-query-pagination-numbers .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 3rem;
    height: 3rem;
    padding: 0 1rem;
    border: 2px solid var(--brutal-black);
    font-family: 'Bebas Neue', Impact, sans-serif;
    font-weight: 700;
    transition: none;
}

.wp-block-query-pagination-numbers .page-numbers:hover {
    background: var(--brutal-black);
    color: var(--brutal-white);
}

.wp-block-query-pagination-numbers .page-numbers.current {
    background: var(--brutal-red);
    color: var(--brutal-white);
    border-color: var(--brutal-red);
}

/* ==========================================================================
   SEARCH
   ========================================================================== */

.wp-block-search__input {
    border: var(--brutal-border);
    padding: 1rem;
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    transition: none;
}

.wp-block-search__input:focus {
    outline: 4px solid var(--brutal-red);
    outline-offset: 0;
}

.wp-block-search__button {
    background: var(--brutal-black);
    color: var(--brutal-white);
    border: var(--brutal-border);
    padding: 1rem 1.5rem;
    font-family: 'Bebas Neue', Impact, sans-serif;
    font-weight: 700;
    text-transform: uppercase;
}

.wp-block-search__button:hover {
    background: var(--brutal-red);
    border-color: var(--brutal-red);
}

/* ==========================================================================
   CODE BLOCKS - YELLOW BACKGROUND
   ========================================================================== */

.wp-block-code,
pre,
code {
    background: var(--brutal-yellow) !important;
    color: var(--brutal-black) !important;
    border: var(--brutal-border);
    font-family: 'Space Mono', monospace;
}

.wp-block-code {
    padding: 1.5rem;
}

/* ==========================================================================
   SEPARATORS
   ========================================================================== */

hr,
.wp-block-separator {
    border: none;
    border-top: 4px solid var(--brutal-black);
    opacity: 1;
}

.wp-block-separator.is-style-wide {
    border-top-width: 8px;
}

/* ==========================================================================
   READING PROGRESS BAR
   ========================================================================== */

.reading-progress {
    position: fixed;
    top: 0;
    left: 0;
    width: 0%;
    height: 8px;
    background: var(--brutal-red);
    z-index: 10001;
    transition: width 50ms steps(10, end);
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width: 1024px) {
    .featured-card .wp-block-columns {
        flex-direction: column;
    }

    .featured-card .wp-block-column {
        flex-basis: 100% !important;
    }

    /* Padding horizontal tablette */
    body > .wp-site-blocks {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}

@media (max-width: 768px) {
    /* Padding horizontal mobile */
    body > .wp-site-blocks {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .site-header {
        padding: 0.75rem 1rem;
    }

    .newsletter-section .wp-block-columns,
    .newsletter-cta .wp-block-columns {
        flex-direction: column;
        text-align: center;
    }

    .newsletter-section .wp-block-column,
    .newsletter-cta .wp-block-column {
        flex-basis: 100% !important;
    }

    .site-header .wp-block-search {
        max-width: 100%;
    }

    .site-header .wp-block-search__input {
        min-width: 0;
        flex: 1 1 auto;
        font-size: 0.75rem;
        padding: 0.5rem;
        border-width: 2px;
    }

    .site-header .wp-block-search__button {
        padding: 0.5rem 0.75rem !important;
        box-shadow: 2px 2px 0 var(--brutal-black) !important;
        flex-shrink: 0;
    }

    .article-content {
        font-size: 1rem;
    }

    .share-buttons-top,
    .share-buttons-bottom {
        justify-content: center;
    }

    h1 {
        font-size: clamp(2.5rem, 10vw, 4rem);
    }

    .article-card::before {
        font-size: 2.5rem;
    }
}

/* ==========================================================================
   NO ANIMATIONS - INSTANT EVERYTHING
   ========================================================================== */

/* Remove all smooth animations */
.article-card,
.featured-card,
.wp-block-button__link,
a,
button,
input {
    transition: none !important;
}

/* ==========================================================================
   PRINT STYLES
   ========================================================================== */

@media print {
    .site-header,
    .site-footer,
    .newsletter-section,
    .newsletter-cta,
    .share-buttons-top,
    .share-buttons-bottom,
    .related-articles,
    .comments-section,
    .reading-progress {
        display: none !important;
    }

    .article-content {
        font-size: 12pt;
        line-height: 1.5;
    }

    a {
        text-decoration: underline;
    }

    a[href]::after {
        content: " (" attr(href) ")";
    }

    * {
        color: black !important;
        background: white !important;
        box-shadow: none !important;
    }
}

/* ==========================================================================
   ACCESSIBILITY
   ========================================================================== */

/* Focus visible for keyboard navigation */
:focus-visible {
    outline: 4px solid var(--brutal-red);
    outline-offset: 2px;
}

/* Skip link */
.skip-link {
    position: absolute;
    top: -100%;
    left: 50%;
    transform: translateX(-50%);
    background: var(--brutal-red);
    color: var(--brutal-white);
    padding: 1rem 2rem;
    z-index: 10000;
    font-family: 'Bebas Neue', Impact, sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    transition: none;
}

.skip-link:focus {
    top: 0;
}

/* Reduced motion - instant everything anyway */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* ==========================================================================
   NOISE TEXTURE OVERLAY (optional)
   ========================================================================== */

.has-noise::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%' height='100%' filter='url(%23noise)'/%3E%3C/svg%3E");
    opacity: 0.03;
    pointer-events: none;
}

/* ==========================================================================
   GLITCH EFFECT ON HOVER
   ========================================================================== */

@keyframes glitch {
    0% { transform: translate(0); }
    20% { transform: translate(-2px, 2px); }
    40% { transform: translate(2px, -2px); }
    60% { transform: translate(-2px, -2px); }
    80% { transform: translate(2px, 2px); }
    100% { transform: translate(0); }
}

.site-title:hover,
.glitch-hover:hover {
    animation: glitch 0.3s steps(5) infinite;
}

@media (prefers-reduced-motion: reduce) {
    .site-title:hover,
    .glitch-hover:hover {
        animation: none;
    }
}

/* ==========================================================================
   MAILPOET FORMS - BRUTAL STYLE
   High specificity selectors to override MailPoet inline styles
   ========================================================================== */

/* Form container */
div[id^="mailpoet_form_"].mailpoet_form {
    font-family: 'Inter', sans-serif !important;
}

div[id^="mailpoet_form_"] form.mailpoet_form {
    padding: 0 !important;
}

/* Labels */
div[id^="mailpoet_form_"] .mailpoet_text_label,
div[id^="mailpoet_form_"] .mailpoet_textarea_label,
div[id^="mailpoet_form_"] .mailpoet_select_label,
div[id^="mailpoet_form_"] .mailpoet_checkbox_label,
div[id^="mailpoet_form_"] .mailpoet_radio_label {
    display: block !important;
    margin-bottom: 0.5rem !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    color: var(--brutal-black) !important;
}

/* Text inputs and textareas - override inline styles */
div[id^="mailpoet_form_"] .mailpoet_text,
div[id^="mailpoet_form_"] .mailpoet_textarea,
div[id^="mailpoet_form_"] .mailpoet_select,
div[id^="mailpoet_form_"] input.mailpoet_text,
div[id^="mailpoet_form_"] textarea.mailpoet_textarea {
    width: 100% !important;
    max-width: 100% !important;
    padding: 1rem !important;
    border: 4px solid var(--brutal-black) !important;
    border-radius: 0 !important;
    background: var(--brutal-white) !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 1rem !important;
    color: var(--brutal-black) !important;
    transition: none !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

div[id^="mailpoet_form_"] .mailpoet_text:focus,
div[id^="mailpoet_form_"] .mailpoet_textarea:focus,
div[id^="mailpoet_form_"] .mailpoet_select:focus {
    outline: 4px solid var(--brutal-red) !important;
    outline-offset: 0 !important;
    border-color: var(--brutal-black) !important;
}

div[id^="mailpoet_form_"] .mailpoet_text::placeholder,
div[id^="mailpoet_form_"] .mailpoet_textarea::placeholder {
    color: #666 !important;
    opacity: 1 !important;
}

/* Submit button - override inline styles */
div[id^="mailpoet_form_"] .mailpoet_submit,
div[id^="mailpoet_form_"] input.mailpoet_submit {
    display: block !important;
    width: 100% !important;
    padding: 1rem 2rem !important;
    margin-top: 1.5rem !important;
    background: var(--brutal-black) !important;
    color: var(--brutal-white) !important;
    border: 4px solid var(--brutal-black) !important;
    border-radius: 0 !important;
    font-family: 'Bebas Neue', Impact, sans-serif !important;
    font-size: 0.875rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    cursor: pointer !important;
    transition: none !important;
    box-shadow: 4px 4px 0 var(--brutal-black) !important;
    box-sizing: border-box !important;
}

div[id^="mailpoet_form_"] .mailpoet_submit:hover,
div[id^="mailpoet_form_"] input.mailpoet_submit:hover {
    background: var(--brutal-red) !important;
    border-color: var(--brutal-red) !important;
    transform: translate(-2px, -2px) !important;
    box-shadow: 6px 6px 0 var(--brutal-black) !important;
}

/* Checkbox and radio inputs */
div[id^="mailpoet_form_"] .mailpoet_checkbox,
div[id^="mailpoet_form_"] .mailpoet_radio {
    width: 1.25rem !important;
    height: 1.25rem !important;
    margin-right: 0.75rem !important;
    border: 3px solid var(--brutal-black) !important;
    border-radius: 0 !important;
    background: var(--brutal-white) !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}

div[id^="mailpoet_form_"] .mailpoet_checkbox:checked,
div[id^="mailpoet_form_"] .mailpoet_radio:checked {
    background: var(--brutal-red) !important;
}

/* Form paragraphs (field wrappers) */
div[id^="mailpoet_form_"] .mailpoet_paragraph {
    margin-bottom: 1.5rem !important;
}

/* Success message */
div[id^="mailpoet_form_"] .mailpoet_validate_success {
    padding: 1.5rem !important;
    background: var(--brutal-black) !important;
    color: var(--brutal-white) !important;
    border: 4px solid var(--brutal-black) !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    text-align: center !important;
}

/* Error messages */
div[id^="mailpoet_form_"] .mailpoet_validate_error,
div[id^="mailpoet_form_"] .mailpoet_error {
    padding: 1rem !important;
    margin-top: 0.5rem !important;
    background: var(--brutal-red) !important;
    color: var(--brutal-white) !important;
    border: none !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
}

/* Required field asterisk */
div[id^="mailpoet_form_"] .mailpoet_required {
    color: var(--brutal-red) !important;
    font-weight: 700 !important;
}

/* Form groups spacing */
div[id^="mailpoet_form_"] .mailpoet_form_group {
    margin-bottom: 1.5rem !important;
}

/* Newsletter form container specific styles */
.newsletter-form-container div[id^="mailpoet_form_"] {
    max-width: 100% !important;
}

/* ==========================================================================
   FOOTER NAVIGATION - Match header style
   ========================================================================== */

.site-footer .wp-block-navigation a,
.site-footer .wp-block-navigation a.wp-block-navigation-item__content,
.site-footer .wp-block-navigation-item a,
footer.site-footer .wp-block-navigation a {
    text-decoration: none !important;
    text-decoration-line: none !important;
}

.site-footer .wp-block-navigation a:hover,
.site-footer .wp-block-navigation a.wp-block-navigation-item__content:hover,
.site-footer .wp-block-navigation-item a:hover,
footer.site-footer .wp-block-navigation a:hover {
    text-decoration: none !important;
    color: var(--wp--preset--color--primary) !important;
}