/*
Theme Name: PACAPAC Blog
Theme URI: https://pacapac83.fr
Author: PACAPAC
Author URI: https://pacapac83.fr
Description: Theme blog aux couleurs de PACAPAC. Reprend a l'identique le header, le footer, la navigation et les polices du site principal pacapac83.fr, afin qu'un visiteur qui clique sur "Blog" n'ait pas l'impression de changer de site. Provence Alpes Cote d'Azur, pompe a chaleur & energie solaire.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
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: pacapac-blog
*/

/* =========================================================
   PACAPAC Blog — variables (couleurs prelevees sur le site)
   ========================================================= */
:root{
  --pac-navy:        #0b1f3a; /* fond du header */
  --pac-navy-deep:   #07131f; /* fond du footer */
  --pac-navy-soft:   #12294a; /* survols / bordures header */
  --pac-gold:        #f0a500; /* bouton Devis / Email */
  --pac-gold-dark:   #d18f00;
  --pac-green:       #25d366; /* bouton Appeler */
  --pac-green-dark:  #1eb257;
  --pac-text:        #1c2b3a; /* texte courant */
  --pac-muted:       #5a6b7b; /* texte secondaire */
  --pac-bg:          #ffffff;
  --pac-bg-alt:      #f5f7fa;
  --pac-border:      #e3e8ee;
  --pac-radius:      10px;
  --pac-shadow:      0 6px 24px rgba(11,31,58,.08);
  --pac-wrap:        1160px;
  --font-body:       "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-head:       "Syne", "DM Sans", sans-serif;
}

/* =========================================================
   Base
   ========================================================= */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.7;
  color:var(--pac-text);
  background:var(--pac-bg);
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; }
a{ color:var(--pac-navy); text-decoration:none; }
a:hover{ text-decoration:underline; }
h1,h2,h3,h4,h5,h6{
  font-family:var(--font-head);
  color:var(--pac-navy);
  line-height:1.2;
  margin:0 0 .6em;
  font-weight:700;
  letter-spacing:-.01em;
}
h1{ font-size:2.2rem; }
h2{ font-size:1.7rem; }
h3{ font-size:1.35rem; }
p{ margin:0 0 1.1em; }
.wrap{ max-width:var(--pac-wrap); margin:0 auto; padding:0 22px; }

/* Accessibilite : lien d'evitement */
.skip-link{
  position:absolute; left:-9999px; top:0; z-index:1000;
  background:var(--pac-gold); color:var(--pac-navy);
  padding:10px 16px; font-weight:600; border-radius:0 0 8px 0;
}
.skip-link:focus{ left:0; }

/* =========================================================
   Header (identique au site) — fond navy #0b1f3a
   ========================================================= */
.site-header{
  background:var(--pac-navy);
  position:sticky; top:0; z-index:100;
  box-shadow:0 2px 12px rgba(0,0,0,.18);
}
.site-header .wrap{
  display:flex; align-items:center; justify-content:space-between;
  gap:18px; min-height:76px; padding-top:8px; padding-bottom:8px;
}
.site-brand{ display:flex; align-items:center; flex:0 0 auto; }
.site-brand img{ height:52px; width:auto; display:block; border-radius:8px; }
.site-brand .brand-text{ color:#fff; font-family:var(--font-head); font-weight:800; font-size:1.4rem; }

/* Navigation */
.main-nav{ display:flex; align-items:center; }
.main-nav ul{ list-style:none; margin:0; padding:0; display:flex; align-items:center; gap:6px; }
.main-nav a{
  color:#fff; font-weight:500; font-size:.98rem;
  padding:9px 14px; border-radius:8px; display:inline-block;
  line-height:1; transition:background .15s, color .15s;
}
.main-nav a:hover{ background:var(--pac-navy-soft); text-decoration:none; }

/* Onglet actif (ici "Blog") : accent gold, comme mise en valeur sur le site */
.main-nav .is-active > a,
.main-nav .current-menu-item > a{
  color:var(--pac-gold);
  position:relative;
}
.main-nav .is-active > a::after,
.main-nav .current-menu-item > a::after{
  content:""; position:absolute; left:14px; right:14px; bottom:2px;
  height:2px; background:var(--pac-gold); border-radius:2px;
}

/* Bouton Devis gratuit (gold) */
.nav-cta a,
a.nav-cta{
  background:var(--pac-gold) !important;
  color:var(--pac-navy) !important;
  font-weight:700;
  padding:10px 18px !important;
  border-radius:6px;
}
.nav-cta a:hover{ background:var(--pac-gold-dark) !important; text-decoration:none; }

/* Bouton burger (mobile) */
.nav-toggle{
  display:none; background:transparent; border:0; cursor:pointer;
  padding:8px; color:#fff;
}
.nav-toggle span{ display:block; width:24px; height:2px; background:#fff; margin:5px 0; border-radius:2px; }

/* =========================================================
   Layout principal
   ========================================================= */
.site-main{ padding:42px 0 60px; }
.content-area{
  display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:44px;
  max-width:var(--pac-wrap); margin:0 auto; padding:0 22px;
}
.content-narrow{ max-width:820px; margin:0 auto; padding:0 22px; }

/* En-tete de page */
.page-head{ margin-bottom:30px; }
.page-head .eyebrow{
  color:var(--pac-gold-dark); font-weight:700; text-transform:uppercase;
  letter-spacing:.08em; font-size:.8rem; margin-bottom:6px; display:block;
}
.page-head h1{ margin:0; }
.page-head .lead{ color:var(--pac-muted); margin-top:10px; }

/* =========================================================
   Liste d'articles
   ========================================================= */
.post-list{ display:grid; gap:30px; }
.post-card{
  background:var(--pac-bg);
  border:1px solid var(--pac-border);
  border-radius:var(--pac-radius);
  overflow:hidden;
  transition:box-shadow .18s, transform .18s;
}
.post-card:hover{ box-shadow:var(--pac-shadow); transform:translateY(-2px); }
.post-card .thumb{ display:block; aspect-ratio:16/9; overflow:hidden; background:var(--pac-bg-alt); }
.post-card .thumb img{ width:100%; height:100%; object-fit:cover; }
.post-card .card-body{ padding:22px 24px 26px; }
.post-card h2{ font-size:1.35rem; margin:0 0 .4em; }
.post-card h2 a{ color:var(--pac-navy); }
.post-card h2 a:hover{ color:var(--pac-gold-dark); text-decoration:none; }
.post-meta{
  color:var(--pac-muted); font-size:.85rem; margin-bottom:10px;
  display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center;
}
.post-meta a{ color:var(--pac-muted); }
.post-meta a:hover{ color:var(--pac-gold-dark); }
.post-excerpt{ color:var(--pac-text); }
.read-more{
  display:inline-block; margin-top:6px; font-weight:700; color:var(--pac-navy);
}
.read-more:hover{ color:var(--pac-gold-dark); text-decoration:none; }
.read-more::after{ content:" \2192"; }

/* =========================================================
   Article seul
   ========================================================= */
.single-post .featured{
  border-radius:var(--pac-radius); overflow:hidden; margin:0 0 28px;
  box-shadow:var(--pac-shadow);
}
.single-post .featured img{ width:100%; display:block; }
.entry-header h1{ font-size:2.3rem; }
.entry-content{ font-size:1.08rem; }
.entry-content h2{ margin-top:1.6em; }
.entry-content h3{ margin-top:1.4em; }
.entry-content img{ border-radius:8px; }
.entry-content a{ color:var(--pac-gold-dark); text-decoration:underline; }
.entry-content blockquote{
  margin:1.6em 0; padding:14px 22px; border-left:4px solid var(--pac-gold);
  background:var(--pac-bg-alt); border-radius:0 8px 8px 0; color:var(--pac-text);
}
.entry-content pre{
  background:var(--pac-navy); color:#e8eef5; padding:18px; border-radius:8px;
  overflow:auto; font-size:.92rem;
}
.entry-content code{ background:var(--pac-bg-alt); padding:2px 6px; border-radius:4px; font-size:.92em; }
.entry-footer{
  margin-top:34px; padding-top:22px; border-top:1px solid var(--pac-border);
  display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between;
}
.tag-links a, .cat-links a{
  display:inline-block; background:var(--pac-bg-alt); color:var(--pac-navy);
  padding:5px 12px; border-radius:20px; font-size:.82rem; margin:0 6px 6px 0; font-weight:500;
}
.tag-links a:hover, .cat-links a:hover{ background:var(--pac-gold); color:var(--pac-navy); text-decoration:none; }

/* Navigation entre articles */
.post-nav{ display:flex; justify-content:space-between; gap:16px; margin-top:34px; }
.post-nav a{
  display:block; padding:14px 18px; border:1px solid var(--pac-border);
  border-radius:var(--pac-radius); max-width:48%; color:var(--pac-navy); font-weight:600;
}
.post-nav a:hover{ border-color:var(--pac-gold); text-decoration:none; }
.post-nav .nav-next{ text-align:right; margin-left:auto; }

/* =========================================================
   Sidebar
   ========================================================= */
.sidebar .widget{
  background:var(--pac-bg); border:1px solid var(--pac-border);
  border-radius:var(--pac-radius); padding:22px 22px; margin-bottom:26px;
}
.sidebar .widget-title{
  font-family:var(--font-head); font-size:1.05rem; color:var(--pac-navy);
  margin:0 0 14px; padding-bottom:10px; border-bottom:2px solid var(--pac-gold);
  display:inline-block;
}
.sidebar ul{ list-style:none; margin:0; padding:0; }
.sidebar li{ padding:7px 0; border-bottom:1px solid var(--pac-border); }
.sidebar li:last-child{ border-bottom:0; }
.sidebar a{ color:var(--pac-text); }
.sidebar a:hover{ color:var(--pac-gold-dark); }

/* Encart contact dans la sidebar */
.contact-card{
  background:var(--pac-navy); color:#eaf0f6; border:0;
}
.contact-card .widget-title{ color:#fff; border-color:var(--pac-gold); }
.contact-card a{ color:#fff; }
.contact-card .cc-row{ display:flex; gap:10px; align-items:flex-start; margin-bottom:12px; font-size:.95rem; }
.contact-card .cc-row .ic{ font-size:1.05rem; }
.contact-card .cc-cta{
  display:block; text-align:center; background:var(--pac-gold); color:var(--pac-navy);
  font-weight:700; padding:11px; border-radius:6px; margin-top:6px;
}
.contact-card .cc-cta:hover{ background:var(--pac-gold-dark); text-decoration:none; }

/* =========================================================
   Recherche
   ========================================================= */
.search-form{ display:flex; gap:8px; }
.search-form input[type="search"]{
  flex:1; padding:10px 14px; border:1px solid var(--pac-border);
  border-radius:8px; font:inherit; color:var(--pac-text);
}
.search-form input[type="search"]:focus{ outline:2px solid var(--pac-gold); border-color:var(--pac-gold); }
.search-form button{
  background:var(--pac-navy); color:#fff; border:0; padding:10px 16px;
  border-radius:8px; font-weight:600; cursor:pointer;
}
.search-form button:hover{ background:var(--pac-navy-soft); }

/* =========================================================
   Pagination
   ========================================================= */
.pagination{ margin-top:40px; }
.pagination .nav-links{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.pagination .page-numbers{
  display:inline-block; padding:9px 15px; border:1px solid var(--pac-border);
  border-radius:8px; color:var(--pac-navy); font-weight:600;
}
.pagination .page-numbers.current{ background:var(--pac-gold); border-color:var(--pac-gold); color:var(--pac-navy); }
.pagination a.page-numbers:hover{ border-color:var(--pac-gold); text-decoration:none; }

/* =========================================================
   Commentaires
   ========================================================= */
.comments-area{ margin-top:46px; padding-top:30px; border-top:1px solid var(--pac-border); }
.comments-title, .comment-reply-title{ font-family:var(--font-head); }
.comment-list{ list-style:none; margin:0; padding:0; }
.comment-list li{ margin:0 0 22px; }
.comment-body{
  background:var(--pac-bg-alt); border:1px solid var(--pac-border);
  border-radius:var(--pac-radius); padding:18px 20px;
}
.comment-list .children{ list-style:none; margin:18px 0 0; padding-left:28px; }
.comment-author{ font-weight:700; color:var(--pac-navy); }
.comment-metadata{ font-size:.82rem; color:var(--pac-muted); }
.comment-respond{ margin-top:30px; }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea{
  width:100%; padding:11px 14px; border:1px solid var(--pac-border);
  border-radius:8px; font:inherit; margin-top:4px;
}
.comment-form label{ font-weight:600; font-size:.92rem; }
.comment-form p{ margin-bottom:14px; }
.form-submit .submit,
.comment-form input[type="submit"]{
  background:var(--pac-gold); color:var(--pac-navy); border:0; font-weight:700;
  padding:12px 22px; border-radius:6px; cursor:pointer; font-family:var(--font-head);
}
.form-submit .submit:hover{ background:var(--pac-gold-dark); }

/* =========================================================
   404
   ========================================================= */
.error-404{ text-align:center; padding:40px 0; }
.error-404 .big{ font-family:var(--font-head); font-size:5rem; color:var(--pac-gold); margin:0; line-height:1; }
.btn-gold{
  display:inline-block; background:var(--pac-gold); color:var(--pac-navy) !important;
  font-weight:700; padding:12px 24px; border-radius:6px; font-family:var(--font-head);
}
.btn-gold:hover{ background:var(--pac-gold-dark); text-decoration:none; }

/* =========================================================
   Footer (identique au site) — fond navy #07131f
   ========================================================= */
.site-footer{
  background:var(--pac-navy-deep); color:#9fb0c1;
  padding:46px 0 34px; margin-top:20px;
}
.site-footer .wrap{
  display:flex; align-items:center; justify-content:space-between;
  gap:26px; flex-wrap:wrap;
}
.footer-brand img{ height:80px; width:auto; display:block; border-radius:8px; }
.footer-links{ text-align:right; color:#9fb0c1; font-size:.98rem; }
.footer-links a{ color:#c3d2e2; }
.footer-links a:hover{ color:var(--pac-gold); }
.footer-links .sep{ margin:0 8px; color:#4a5c6e; }

/* Boutons flottants Email + Appeler (identiques au site) */
.floaters{ position:fixed; right:20px; bottom:22px; z-index:200; display:flex; flex-direction:column; gap:12px; }
.floaters a{
  display:inline-flex; align-items:center; gap:9px; padding:13px 22px;
  border-radius:40px; font-weight:700; font-family:var(--font-head);
  box-shadow:0 8px 22px rgba(0,0,0,.28); color:#0b1f3a;
}
.floaters a:hover{ text-decoration:none; transform:translateY(-1px); }
.floaters .fl-email{ background:var(--pac-gold); color:var(--pac-navy); }
.floaters .fl-call{ background:var(--pac-green); color:#fff; }

/* =========================================================
   WordPress core / helpers
   ========================================================= */
.alignleft{ float:left; margin:6px 22px 14px 0; }
.alignright{ float:right; margin:6px 0 14px 22px; }
.aligncenter{ display:block; margin:14px auto; }
.wp-caption{ max-width:100%; }
.wp-caption-text{ color:var(--pac-muted); font-size:.85rem; text-align:center; }
.sticky, .bypostauthor{}
.screen-reader-text{
  position:absolute !important; width:1px; height:1px; overflow:hidden;
  clip:rect(1px,1px,1px,1px); word-wrap:normal !important;
}
.updated:not(.published){ display:none; }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 980px){
  .content-area{ grid-template-columns:1fr; }
  .sidebar{ margin-top:20px; }
}
@media (max-width: 760px){
  body{ font-size:16px; }
  h1{ font-size:1.8rem; }
  .nav-toggle{ display:block; }
  .main-nav{
    position:absolute; top:100%; left:0; right:0;
    background:var(--pac-navy); flex-direction:column; align-items:stretch;
    padding:8px 14px 16px; display:none; box-shadow:0 12px 24px rgba(0,0,0,.28);
  }
  .main-nav.open{ display:flex; }
  .main-nav ul{ flex-direction:column; align-items:stretch; gap:2px; width:100%; }
  .main-nav a{ padding:12px 10px; width:100%; }
  .main-nav .is-active > a::after{ display:none; }
  .nav-cta{ margin-top:6px; }
  .nav-cta a{ text-align:center; }
  .site-footer .wrap{ flex-direction:column; text-align:center; }
  .footer-links{ text-align:center; }
  .floaters a span{ display:none; }
  .floaters a{ padding:14px; border-radius:50%; }
}