/*
Theme Name: David Vieira
Theme URI: https://davidvieira.fr
Author: Vieira Gestion Privée
Author URI: https://davidvieira.fr
Description: Thème WordPress éditorial premium et entièrement personnalisable pour la marque personnelle de David Vieira. Construit à partir de la charte graphique officielle : typographies Bodoni Moda / Inter / IBM Plex Mono, palette Marine Éditorial, Or Vieilli, Or Lumière et Ivoire. Logos, page d'accueil (par blocs réutilisables), couleurs et typographies sont modifiables depuis l'administration WordPress sans toucher au code.
Version: 2.0.0
Requires at least: 6.3
Tested up to: 6.6
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: david-vieira
*/

/* ==========================================================================
   0. POLICES — auto-hébergées
   ========================================================================== */
@font-face{ font-family:'Bodoni Moda'; src:url('assets/fonts/bodoni-moda-latin-400-normal.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:'Bodoni Moda'; src:url('assets/fonts/bodoni-moda-latin-400-italic.woff2') format('woff2'); font-weight:400; font-style:italic; font-display:swap; }
@font-face{ font-family:'Bodoni Moda'; src:url('assets/fonts/bodoni-moda-latin-500-normal.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face{ font-family:'Bodoni Moda'; src:url('assets/fonts/bodoni-moda-latin-500-italic.woff2') format('woff2'); font-weight:500; font-style:italic; font-display:swap; }
@font-face{ font-family:'Bodoni Moda'; src:url('assets/fonts/bodoni-moda-latin-600-normal.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }
@font-face{ font-family:'Bodoni Moda'; src:url('assets/fonts/bodoni-moda-latin-700-normal.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
@font-face{ font-family:'Bodoni Moda'; src:url('assets/fonts/bodoni-moda-latin-800-normal.woff2') format('woff2'); font-weight:800; font-style:normal; font-display:swap; }
@font-face{ font-family:'Inter'; src:url('assets/fonts/inter-latin-300-normal.woff2') format('woff2'); font-weight:300; font-style:normal; font-display:swap; }
@font-face{ font-family:'Inter'; src:url('assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:'Inter'; src:url('assets/fonts/inter-latin-500-normal.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face{ font-family:'Inter'; src:url('assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }
@font-face{ font-family:'Inter'; src:url('assets/fonts/inter-latin-700-normal.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
@font-face{ font-family:'IBM Plex Mono'; src:url('assets/fonts/ibm-plex-mono-latin-400-normal.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:'IBM Plex Mono'; src:url('assets/fonts/ibm-plex-mono-latin-500-normal.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face{ font-family:'IBM Plex Mono'; src:url('assets/fonts/ibm-plex-mono-latin-600-normal.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }

/* ==========================================================================
   1. VARIABLES — reprises depuis theme.json (source de vérité pour l'éditeur)
   ========================================================================== */
:root{
  --navy:#0F294E;
  --navy-deep:#0A1B32;
  --navy-soft:#1C3A63;
  --gold-deep:#8A6A3B;
  --gold:#C0985D;
  --gold-pale:#DBBD8E;
  --ivoire:#EBE7E4;
  --ivoire-deep:#E0DAD2;
  --text-1:#0F294E;
  --text-2:#726B60;
  --white:#FCFAF6;
  --hairline: rgba(15,41,78,0.14);
  --hairline-dark: rgba(235,231,228,0.18);
  --max: 1140px;
  --gutter: 6vw;
}

/* ==========================================================================
   2. RESET & BASE
   ========================================================================== */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--ivoire);
  color:var(--text-1);
  font-family:'Inter',-apple-system,sans-serif;
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3,h4,h5,h6{ font-family:'Bodoni Moda', serif; font-weight:600; line-height:1.14; color:var(--navy); margin:0 0 0.5em; }
h1{ font-size:clamp(2.4rem, 5vw, 4.2rem); font-weight:700; letter-spacing:-0.01em; }
h2{ font-size:clamp(1.9rem, 3.4vw, 2.7rem); }
h3{ font-size:1.4rem; }
p{ margin:0 0 1.2em; }
.container{ max-width:var(--max); margin:0 auto; padding:0 var(--gutter); }
.screen-reader-text{ position:absolute!important; clip:rect(1px,1px,1px,1px); overflow:hidden; height:1px; width:1px; }
::selection{ background:var(--gold-pale); color:var(--navy-deep); }

.eyebrow{
  font-family:'IBM Plex Mono'; font-weight:500; font-size:0.72rem;
  letter-spacing:0.18em; text-transform:uppercase; color:var(--gold-deep);
  display:inline-block; margin-bottom:1rem;
}

.btn, .wp-block-button__link{
  display:inline-flex; align-items:center; gap:0.6em;
  font-family:'IBM Plex Mono'!important; font-size:0.78rem; font-weight:600;
  letter-spacing:0.09em; text-transform:uppercase;
  padding:0.95em 1.7em!important; border:1px solid var(--navy); color:var(--navy)!important;
  background:transparent!important; border-radius:0!important;
  transition:all .25s ease;
}
.btn:hover, .wp-block-button__link:hover{ background:var(--navy)!important; color:var(--ivoire)!important; }
.btn.btn-gold, .is-style-gold .wp-block-button__link{ border-color:var(--gold); color:var(--gold-deep)!important; }
.btn.btn-gold:hover, .is-style-gold .wp-block-button__link:hover{ background:var(--gold)!important; border-color:var(--gold); color:var(--navy-deep)!important; }
.btn.btn-invert, .is-style-invert .wp-block-button__link{ border-color:var(--ivoire); color:var(--ivoire)!important; }
.btn.btn-invert:hover, .is-style-invert .wp-block-button__link:hover{ background:var(--ivoire)!important; color:var(--navy-deep)!important; }
.wp-block-button.is-style-fill .wp-block-button__link{ background:var(--navy)!important; color:var(--ivoire)!important; }
.wp-block-button.is-style-fill .wp-block-button__link:hover{ background:var(--navy-deep)!important; }

/* ==========================================================================
   3. LOGO — image personnalisable (Site Identity + réglage "logo fond sombre")
   ========================================================================== */
.site-logo-img{ display:block; height:auto; }
.site-branding .site-logo-img{ max-height:44px; width:auto; }
.footer-brand .site-logo-img{ max-height:64px; width:auto; }
.hero-logo .site-logo-img{ max-height:120px; width:auto; margin:0 auto; }

/* ==========================================================================
   4. HEADER / NAVIGATION
   ========================================================================== */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(235,231,228,0.92); backdrop-filter:blur(6px);
  border-bottom:1px solid var(--hairline);
}
.site-header .container{ display:flex; align-items:center; justify-content:space-between; height:84px; }
.site-branding{ display:flex; align-items:center; gap:0.8em; }
.site-branding a{ display:flex; align-items:center; gap:0.7em; }
.site-title-text{ font-family:'Bodoni Moda'; font-weight:600; font-size:1.05rem; letter-spacing:0.02em; color:var(--navy); }

.primary-nav ul{ display:flex; align-items:center; gap:2.1em; }
.primary-nav a{
  font-family:'IBM Plex Mono'; font-size:0.74rem; letter-spacing:0.06em;
  text-transform:uppercase; color:var(--text-1); position:relative; padding:0.3em 0;
}
.primary-nav a::after{
  content:""; position:absolute; left:0; right:100%; bottom:-2px; height:1px;
  background:var(--gold-deep); transition:right .25s ease;
}
.primary-nav a:hover::after, .primary-nav .current-menu-item a::after{ right:0; }
.nav-toggle{ display:none; background:none; border:1px solid var(--hairline); padding:0.5em 0.7em; cursor:pointer; }
.nav-toggle span{ display:block; width:20px; height:1.5px; background:var(--navy); margin:4px 0; }

@media (max-width: 860px){
  .primary-nav{
    position:fixed; inset:84px 0 0 0; background:var(--ivoire);
    transform:translateY(-8px); opacity:0; visibility:hidden;
    transition:all .25s ease; padding:2rem var(--gutter); overflow-y:auto;
  }
  .primary-nav ul{ flex-direction:column; align-items:flex-start; gap:0; }
  .primary-nav li{ width:100%; border-bottom:1px solid var(--hairline); }
  .primary-nav a{ display:block; padding:1.1em 0; font-size:0.9rem; }
  .site-header.nav-open .primary-nav{ transform:translateY(0); opacity:1; visibility:visible; }
  .nav-toggle{ display:block; }
}

/* ==========================================================================
   5. GABARITS DE BLOCS — patterns "David Vieira" (page d'accueil éditable)
   ========================================================================== */
.dv-hero{
  background:
    radial-gradient(circle at 18% 12%, rgba(192,152,93,0.10), transparent 42%),
    radial-gradient(circle at 85% 92%, rgba(192,152,93,0.07), transparent 45%),
    var(--navy-deep);
  color:var(--ivoire);
  text-align:center;
}
.dv-hero h1{ color:var(--white); }
.dv-hero .wp-block-paragraph{
  font-family:'Bodoni Moda'; font-style:italic; font-weight:500;
  font-size:clamp(1.05rem,2vw,1.4rem); color:var(--gold-pale); max-width:560px;
  margin:0 auto 1.6rem;
}

.dv-eyebrow{
  font-family:'IBM Plex Mono'!important; font-weight:500; font-size:0.72rem!important;
  letter-spacing:0.18em; text-transform:uppercase; color:var(--gold-deep)!important;
}

.dv-card{
  background:var(--white); border:1px solid var(--hairline); padding:2.4rem 2rem!important;
  transition:transform .25s ease, box-shadow .25s ease;
}
.dv-card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px rgba(15,41,78,0.08); }
.dv-card h3{ margin-top:0.6em; }
.dv-card.is-style-dark, .dv-card.has-marine-profond-background-color{ color:var(--ivoire); }
.dv-card.is-style-dark h3{ color:var(--white); }

.dv-quote{ text-align:center; }
.dv-quote p, .dv-quote blockquote{
  font-family:'Bodoni Moda'!important; font-style:italic; font-weight:500;
  font-size:clamp(1.4rem,3vw,2.2rem)!important; line-height:1.4; color:var(--navy);
  max-width:820px; margin:0 auto;
}
.dv-quote cite{ display:block; margin-top:1.4rem; font-family:'IBM Plex Mono'; font-style:normal; font-size:0.75rem; letter-spacing:0.1em; color:var(--text-2); text-transform:uppercase; }

.dv-articles .wp-block-post-title{ font-size:1.2rem; margin-bottom:0.4rem; }
.dv-articles .wp-block-post-title a{ color:var(--navy); }
.dv-articles .wp-block-post-excerpt{ color:var(--text-2); font-size:0.92rem; }
.dv-articles .wp-block-post-date{ font-family:'IBM Plex Mono'; font-size:0.68rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold-deep); }
.dv-articles .wp-block-post-featured-image img{ aspect-ratio:4/3; object-fit:cover; }

.dv-cta{ background:var(--navy-deep); color:var(--ivoire); text-align:center; }
.dv-cta h2{ color:var(--white); }

/* ==========================================================================
   6. CONTENU ÉDITORIAL (page / article)
   ========================================================================== */
.page-header-band{ padding:5rem 0 3rem; border-bottom:1px solid var(--hairline); }
.page-header-band .eyebrow{ margin-bottom:1rem; }
.entry-meta{ font-family:'IBM Plex Mono'; font-size:0.72rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-2); }
.entry-content{ font-size:1.05rem; }
.entry-content.is-boxed{ max-width:720px; margin:3.5rem auto 0; }
.entry-content h2{ margin-top:1.2em; }
.entry-content h3{ margin-top:1em; }
.entry-content a{ color:var(--gold-deep); text-decoration:underline; text-underline-offset:3px; }
.entry-content blockquote{
  font-family:'Bodoni Moda'; font-style:italic; font-size:1.4rem; color:var(--navy);
  border-left:2px solid var(--gold); margin:2.2em 0; padding:0.2em 0 0.2em 1.4em;
}
.entry-content img{ margin:2em 0; }
.entry-content ul, .entry-content ol{ margin:0 0 1.4em 1.4em; }
.entry-content li{ margin-bottom:0.5em; }
.single-cover{ max-width:960px; margin:0 auto; padding:0 var(--gutter); }
.single-cover img{ width:100%; }

.post-nav{ max-width:720px; margin:4rem auto 0; padding-top:2rem; border-top:1px solid var(--hairline); display:flex; justify-content:space-between; gap:2rem; font-family:'IBM Plex Mono'; font-size:0.78rem; text-transform:uppercase; letter-spacing:0.04em; }

.author-box{ max-width:720px; margin:4rem auto 0; padding:2.2rem; background:var(--ivoire-deep); display:flex; gap:1.4rem; align-items:center; }
.author-box img{ width:64px; height:64px; border-radius:50%; object-fit:cover; margin:0; }
.author-box h4{ font-family:'Bodoni Moda'; margin:0 0 0.3em; font-size:1.05rem; }
.author-box p{ margin:0; color:var(--text-2); font-size:0.9rem; }

.post-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2.4rem 2rem; }
.post-card{ display:flex; flex-direction:column; }
.post-card .post-thumb{ aspect-ratio:4/3; overflow:hidden; margin-bottom:1.1rem; background:var(--ivoire-deep); }
.post-card .post-thumb img{ width:100%; height:100%; object-fit:cover; margin:0; transition:transform .4s ease; }
.post-card:hover .post-thumb img{ transform:scale(1.04); }
.post-card .post-meta{ font-family:'IBM Plex Mono'; font-size:0.68rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold-deep); margin-bottom:0.5rem; }
.post-card h3{ font-size:1.2rem; margin-bottom:0.4rem; }
.post-card p{ color:var(--text-2); font-size:0.92rem; }
.post-card a.stretched{ position:relative; }
.post-card a.stretched::after{ content:""; position:absolute; inset:0; }

.pagination{ display:flex; justify-content:center; gap:0.6rem; margin-top:3.5rem; font-family:'IBM Plex Mono'; font-size:0.8rem; }
.pagination a, .pagination span{ padding:0.6em 1em; border:1px solid var(--hairline); }
.pagination .current{ background:var(--navy); color:var(--ivoire); border-color:var(--navy); }

/* ==========================================================================
   7. FOOTER
   ========================================================================== */
.site-footer{ background:var(--navy-deep); color:var(--ivoire); padding:5rem 0 2.5rem; }
.footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:3rem; padding-bottom:3.5rem; border-bottom:1px solid var(--hairline-dark); }
.footer-brand p{ color:var(--gold-pale); font-size:0.9rem; max-width:280px; margin-top:1.2rem; }
.footer-col h4{ font-family:'IBM Plex Mono'; font-size:0.72rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--gold); margin-bottom:1.2rem; }
.footer-col ul li{ margin-bottom:0.7em; }
.footer-col a{ color:var(--ivoire); font-size:0.9rem; opacity:0.85; }
.footer-col a:hover{ opacity:1; color:var(--gold-pale); }
.footer-bottom{ display:flex; justify-content:space-between; align-items:center; padding-top:2rem; flex-wrap:wrap; gap:1rem; }
.footer-bottom p{ margin:0; font-family:'IBM Plex Mono'; font-size:0.7rem; letter-spacing:0.04em; color:var(--text-2); }
.social-links{ display:flex; gap:1.2rem; }
.social-links a{ font-family:'IBM Plex Mono'; font-size:0.7rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold-pale); }

/* ==========================================================================
   8. RESPONSIVE
   ========================================================================== */
@media (max-width: 900px){
  .post-grid{ grid-template-columns:1fr 1fr; }
  .footer-top{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 600px){
  .post-grid{ grid-template-columns:1fr; }
  .footer-top{ grid-template-columns:1fr; gap:2.2rem; }
  body{ font-size:16px; }
}

.alignwide{ width:100%; }
.alignfull{ width:100vw; margin-left:calc(50% - 50vw); }
.wp-block-image{ margin:2em 0; }
.wp-caption-text, .wp-element-caption{ font-family:'IBM Plex Mono'; font-size:0.72rem; color:var(--text-2); }