/*
Theme Name: RanitaCreation Theme 2026
Theme URI: https://ranitacreation.fr
Description: Thème OnePage Néo-Brutaliste fidèle (Tailwind + Custom Admin).
Version: 4.0.0
Author: Atelier Glaz
*/

/* --- RÈGLES ORIGINALES DU FICHIER HTML --- */

/* Background à points */
body {
    background-image: radial-gradient(#B4B59F 1px, transparent 1px);
    background-size: 24px 24px;
}
.dark body {
    background-image: radial-gradient(#56603D 1px, transparent 1px);
}

/* no scrollbar */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* --- BOUTON FANCY --- */
.fancy {
    background-color: transparent;
    border: 2px solid #353B2C;
    border-radius: 0;
    box-sizing: border-box;
    color: #353B2C;
    cursor: pointer;
    display: inline-block;
    float: right;
    font-weight: 700;
    letter-spacing: 0.05em;
    margin: 0;
    outline: none;
    overflow: visible;
    padding: 1.25em 2em;
    position: relative;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: all 0.3s ease-in-out;
    user-select: none;
    font-size: 13px;
}
.fancy::before {
    content: " ";
    width: 1.5625rem;
    height: 2px;
    background: #353B2C;
    top: 50%;
    left: 1.5em;
    position: absolute;
    transform: translateY(-50%);
    transform-origin: center;
    transition: background 0.3s linear, width 0.3s linear;
}
.fancy .text {
    font-size: 1.125em;
    line-height: 1.33333em;
    padding-left: 2em;
    display: block;
    text-align: left;
    transition: all 0.3s ease-in-out;
    text-decoration: none;
    color: #353B2C;
}
.fancy .top-key {
    height: 2px;
    width: 1.5625rem;
    top: -2px;
    left: 0.625rem;
    position: absolute;
    background: #F6F5F3;
    transition: width 0.5s ease-out, left 0.3s ease-out;
}
.fancy .bottom-key-1 {
    height: 2px;
    width: 1.5625rem;
    right: 1.875rem;
    bottom: -2px;
    position: absolute;
    background: #F6F5F3;
    transition: width 0.5s ease-out, right 0.3s ease-out;
}
.fancy .bottom-key-2 {
    height: 2px;
    width: 0.625rem;
    right: 0.625rem;
    bottom: -2px;
    position: absolute;
    background: #F6F5F3;
    transition: width 0.5s ease-out, right 0.3s ease-out;
}
.fancy:hover {
    color: white;
    background: #353B2C;
}
.fancy:hover::before {
    width: 0.9375rem;
    background: white;
}
.fancy:hover .text {
    color: white;
    padding-left: 1.5em;
}
.fancy:hover .top-key {
    left: -2px;
    width: 0px;
}
.fancy:hover .bottom-key-1,
.fancy:hover .bottom-key-2 {
    right: 0;
    width: 0;
}

/* --- Reveal Animation --- */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.9s ease-out, transform 0.9s ease-out;
}
.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* --- CONTENT TYPO (Pages, Posts) --- */
.entry-content {
    font-family: 'Manrope', sans-serif;
    color: #353B2C;
    line-height: 1.8;
    font-size: 1.05rem;
    max-width: 780px;
    margin: 0 auto;
}

.dark .entry-content {
    color: #F6F5F3;
}

/* --- TITRES --- */
.entry-content h1,
.entry-content h2,
.entry-content h3 {
    font-family: 'Outfit', sans-serif;
    font-weight: 800;
    line-height: 1.15;
    margin: 2.2em 0 0.8em;
    letter-spacing: -0.02em;
}

.entry-content h1 {
    font-size: 2.6rem;
    margin-top: 0;
}

.entry-content h2 {
    font-size: 2.1rem;
    border-left: 6px solid #CB997E;
    padding-left: 0.75em;
}

.entry-content h3 {
    font-size: 1.6rem;
    opacity: 0.9;
}

/* --- PARAGRAPHES --- */
.entry-content p {
    margin-bottom: 1.3em;
    max-width: 70ch;
}

.entry-content strong {
    color: #CB997E;
    font-weight: 700;
}

.entry-content a {
    color: #CB997E;
    text-decoration: underline;
    text-underline-offset: 4px;
    font-weight: 600;
    transition: 0.3s;
}
.entry-content a:hover {
    color: #56603D;
    background: rgba(203, 153, 126, 0.1);
}

/* --- LISTES --- */
.entry-content ul, 
.entry-content ol {
    margin-bottom: 1.5em;
    padding-left: 1.5em;
}

.entry-content ul li {
    list-style-type: disc;
    margin-bottom: 0.5em;
    padding-left: 0.5em;
}

.entry-content ol li {
    list-style-type: decimal;
    margin-bottom: 0.5em;
    padding-left: 0.5em;
}

/* --- CITATIONS --- */
.entry-content blockquote {
    background: rgba(180, 181, 159, 0.15);
    border-left: 6px solid #56603D;
    padding: 1.5em 2em;
    margin: 2em 0;
    font-style: italic;
    color: #353B2C;
}

.dark .entry-content blockquote {
    background: rgba(246, 245, 243, 0.06);
    border-left-color: #CB997E;
    color: #F6F5F3;
}

/* --- IMAGES --- */
.entry-content img {
    border: 2px solid rgba(53, 59, 44, 0.15);
    box-shadow: 6px 6px 0px rgba(53, 59, 44, 0.35);
    margin: 1.5em 0;
    max-width: 100%;
    height: auto;
}

.dark .entry-content img {
    border-color: rgba(246, 245, 243, 0.18);
    box-shadow: 6px 6px 0px rgba(246, 245, 243, 0.15);
}

/* --- SÉPARATEURS --- */
.entry-content hr {
    border: none;
    border-top: 2px dashed rgba(53, 59, 44, 0.2);
    margin: 3em 0;
}

.dark .entry-content hr {
    border-top-color: rgba(246, 245, 243, 0.2);
}

/* --- TABLES --- */
.entry-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 2em 0;
    font-size: 0.95rem;
}

.entry-content table th,
.entry-content table td {
    border: 1px solid rgba(53, 59, 44, 0.15);
    padding: 0.85em 1em;
}

.entry-content table th {
    background: rgba(180, 181, 159, 0.18);
    font-weight: 700;
}

.dark .entry-content table th {
    background: rgba(246, 245, 243, 0.06);
}

/* --- CODE --- */
.entry-content pre,
.entry-content code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    background: rgba(53, 59, 44, 0.06);
    padding: 0.2em 0.4em;
    border-radius: 4px;
    font-size: 0.95em;
}

.entry-content pre {
    padding: 1.2em 1.4em;
    overflow-x: auto;
    border: 1px solid rgba(53, 59, 44, 0.12);
    box-shadow: 4px 4px 0 rgba(53, 59, 44, 0.15);
}

.dark .entry-content pre,
.dark .entry-content code {
    background: rgba(246, 245, 243, 0.06);
    border-color: rgba(246, 245, 243, 0.12);
    box-shadow: 4px 4px 0 rgba(246, 245, 243, 0.1);
}

/* Anim marquee partenaires */
@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.animate-marquee {
    animation: marquee 20s linear infinite;
}

/* Pause au survol */
.hover\:pause:hover {
    animation-play-state: paused;
}

/* Footer links (menu WP) */
.footer-links { list-style: none; }
.footer-links li { margin: 0; padding: 0; }
.footer-links a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 4px;
    transition: 0.25s;
}
.footer-links a:hover { opacity: 1; }



/* =========================================
   Gabarit: Page Texte (Long format)
   ========================================= */
.text-page .entry-content {
  text-wrap: pretty;
  hyphens: auto;
  max-width: 780px; /* garde une vraie largeur de lecture */
  margin: 0 auto;
}

.text-page .entry-content p {
  margin-bottom: 1.25em;
}

.text-page .entry-content h2 {
  margin-top: 2.4em;
  margin-bottom: 0.9em;
}

.text-page .entry-content h3 {
  margin-top: 2em;
  margin-bottom: 0.75em;
}

.text-page .entry-content ul,
.text-page .entry-content ol {
  margin-bottom: 1.25em;
}

@media (max-width: 639px) {
  .text-page .entry-content {
    font-size: 1rem;
    line-height: 1.75;
  }
}


/* --- CORRECTION BOUTONS HOME (Style Néo-Brutaliste) --- */

/* On cible uniquement les boutons .fancy sur la home */
.home .fancy {
    /* 1. On annule le float qui casse souvent la mise en page */
    float: none;
    display: inline-block;
    
    /* 2. Nouveau style visuel plus impactant */
    background-color: #F6F5F3; /* Fond clair */
    color: #353B2C;            /* Texte foncé */
    border: 2px solid #353B2C; /* Bordure épaisse */
    box-shadow: 5px 5px 0px #353B2C; /* Ombre dure décalée */
    
    /* 3. Ajustements de taille */
    padding: 1em 2.5em;
    margin: 10px 0; /* Un peu d'espace autour */
    transform: translate(0, 0); /* Prépare l'animation */
}

/* On cache les petits éléments décoratifs de l'ancien style qui buggent */
.home .fancy::before,
.home .fancy .top-key, 
.home .fancy .bottom-key-1, 
.home .fancy .bottom-key-2 {
    display: none;
}

/* Réinitialisation du texte */
.home .fancy .text {
    padding: 0;
    color: inherit;
}

/* Animation au survol : effet "bouton pressé" */
.home .fancy:hover {
    background-color: #CB997E; /* Couleur accent (Terracotta) */
    color: #F6F5F3;
    box-shadow: 2px 2px 0px #353B2C; /* L'ombre rétrécit */
    transform: translate(3px, 3px); /* Le bouton descend */
}

/* Support du Dark Mode pour la home */
.dark.home .fancy {
    background-color: #353B2C;
    color: #F6F5F3;
    border-color: #F6F5F3;
    box-shadow: 5px 5px 0px #F6F5F3;
}
.dark.home .fancy:hover {
    background-color: #CB997E;
    box-shadow: 2px 2px 0px #F6F5F3;
}