/*
Theme Name:  Mielance Média
Theme URI:   https://mielance.media
Author:      EHTYMARKETING
Author URI:  https://ehtymarketing.fr
Description: Thème officiel de Mielance Média — Le plus mielleux des médias généralistes francophones.
Version:     2.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License:     GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mielance-media
Tags:        magazine, news, blog, custom-colors, custom-menu, featured-images, responsive-layout
*/

/* ==========================================================================
   VARIABLES — Palette Miel ambré & Noir
   ========================================================================== */
:root {
    --mm-miel:       #E8940A;
    --mm-miel-dark:  #C47A00;
    --mm-miel-light: #FFF4DC;
    --mm-miel-glow:  rgba(232,148,10,.18);
    --mm-black:      #0F0F0F;
    --mm-black-soft: #1A1A1A;
    --mm-black-card: #222222;
    --mm-ivory:      #FFFBF2;
    --mm-white:      #FFFFFF;
    --mm-border:     #2E2E2E;
    --mm-border-light: #E8DCC8;
    --mm-text-on-dark:  rgba(255,251,242,.85);
    --mm-text-muted:    rgba(255,251,242,.45);
    --mm-font-titre: 'Playfair Display', Georgia, serif;
    --mm-font-corps: 'Outfit', system-ui, sans-serif;
    --mm-container:  1200px;
    --mm-radius-sm:  4px;
    --mm-radius-md:  8px;
    --mm-radius-lg:  12px;
    --mm-radius-pill:999px;
    --mm-shadow-sm:  0 1px 4px rgba(0,0,0,.18);
    --mm-shadow-md:  0 4px 18px rgba(0,0,0,.22);
    --mm-shadow-lg:  0 8px 36px rgba(0,0,0,.28);
    --mm-shadow-miel:0 4px 24px rgba(232,148,10,.25);
}

/* ==========================================================================
   RESET & BASE
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{font-size:16px;scroll-behavior:smooth;}
body{
    font-family:var(--mm-font-corps);
    background:var(--mm-black);
    color:var(--mm-text-on-dark);
    line-height:1.7;
    -webkit-font-smoothing:antialiased;
}
img,video{max-width:100%;height:auto;display:block;}
a{color:var(--mm-miel);text-decoration:none;transition:color .2s;}
a:hover{color:var(--mm-miel-dark);}
ul,ol{list-style:none;}
button,input,textarea,select{font-family:inherit;font-size:inherit;}
h1,h2,h3,h4,h5,h6{font-family:var(--mm-font-titre);line-height:1.15;color:var(--mm-white);}
p{margin-bottom:1rem;line-height:1.75;}
p:last-child{margin-bottom:0;}

/* ==========================================================================
   LAYOUT
   ========================================================================== */
.mm-container{width:100%;max-width:var(--mm-container);margin:0 auto;padding:0 1.5rem;}
.mm-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

.mm-section-header{display:flex;align-items:center;gap:1rem;margin-bottom:2rem;}
.mm-section-header__title{
    font-family:var(--mm-font-corps);
    font-size:.68rem;font-weight:700;
    letter-spacing:.2em;text-transform:uppercase;
    color:var(--mm-miel);white-space:nowrap;
}
.mm-section-header__line{flex:1;height:1px;background:var(--mm-border);}

/* ==========================================================================
   BOUTONS
   ========================================================================== */
.mm-btn{
    display:inline-flex;align-items:center;gap:.4em;
    font-family:var(--mm-font-corps);font-size:.875rem;font-weight:600;
    padding:.7em 1.4em;border-radius:var(--mm-radius-sm);
    border:2px solid transparent;cursor:pointer;
    transition:background .2s,color .2s,border-color .2s,transform .15s;
    text-decoration:none;line-height:1;
}
.mm-btn:active{transform:scale(.98);}
.mm-btn--primary{background:var(--mm-miel);color:var(--mm-black);border-color:var(--mm-miel);}
.mm-btn--primary:hover{background:var(--mm-miel-dark);border-color:var(--mm-miel-dark);color:var(--mm-white);}
.mm-btn--ghost{background:transparent;color:var(--mm-miel);border-color:rgba(232,148,10,.4);}
.mm-btn--ghost:hover{background:var(--mm-miel-glow);border-color:var(--mm-miel);}
.mm-btn--sm{font-size:.75rem;padding:.5em 1em;}
.mm-btn--lg{font-size:1rem;padding:.85em 1.8em;}

/* ==========================================================================
   BACK TO TOP
   ========================================================================== */
.mm-back-to-top{
    position:fixed;bottom:2rem;right:1.75rem;z-index:300;
    width:44px;height:44px;background:var(--mm-miel);color:var(--mm-black);
    border:none;border-radius:50%;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    box-shadow:var(--mm-shadow-miel);
    opacity:0;pointer-events:none;transform:translateY(12px);
    transition:opacity .3s,transform .3s,background .2s;
}
.mm-back-to-top.is-visible{opacity:1;pointer-events:auto;transform:translateY(0);}
.mm-back-to-top:hover{background:var(--mm-miel-dark);}

/* Skip link */
.mm-skip-link{position:absolute;left:-9999px;top:0;z-index:9999;background:var(--mm-miel);color:var(--mm-black);font-weight:700;padding:.5rem 1rem;}
.mm-skip-link:focus{left:0;}

/* WP natives */
.aligncenter{display:block;margin:0 auto;}
.alignleft{float:left;margin:0 1.5rem 1rem 0;}
.alignright{float:right;margin:0 0 1rem 1.5rem;}
blockquote,.wp-block-quote{border-left:4px solid var(--mm-miel);padding-left:1.5rem;margin:2rem 0;font-family:var(--mm-font-titre);font-size:1.2rem;font-style:italic;color:var(--mm-text-muted);}
hr,.wp-block-separator{border:none;border-top:1px solid var(--mm-border);margin:2rem 0;}

@media(max-width:768px){.mm-container{padding:0 1rem;}}