/*
Theme Name: VPW Child
Template: generatepress
Description: Charte Vos Projets Web (tokens, polices locales, composants partagés).
Version: 0.1.0
Text Domain: vpw-child
*/

@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:500 800;font-display:swap;src:url(fonts/bricolage-grotesque-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:500 800;font-display:swap;src:url(fonts/bricolage-grotesque-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/inter-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

:root {
  --vpw-ink: #17152E;
  --vpw-text: #2A2848;
  --vpw-muted: #5A5873;
  --vpw-indigo: #5451A8;
  --vpw-indigo-deep: #3F3C8C;
  --vpw-magenta: #C0508D;
  --vpw-cta: #A83B77;
  --vpw-cta-hover: #8F2F63;
  --vpw-pink-on-dark: #F5A3CC;
  --vpw-tint: #F4F3FB;
  --vpw-line: #E3E1F1;
  --vpw-white: #FFFFFF;
  --vpw-radius: 12px;
  --vpw-radius-sm: 8px;
  --vpw-rail: 72rem;
  --vpw-font-head: 'Bricolage Grotesque', system-ui, sans-serif;
  --vpw-font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

html { scroll-behavior: smooth; scroll-padding-top: 5.5rem; }
body {
  font-family: var(--vpw-font-body);
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--vpw-text);
  background: var(--vpw-white);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 {
  font-family: var(--vpw-font-head);
  color: var(--vpw-ink);
  letter-spacing: -0.02em;
  text-wrap: balance;
}
p { text-wrap: pretty; }
a { text-underline-offset: 0.2em; }
.site-content, .inside-article { padding: 0; margin: 0; }
.separate-containers .inside-article, .separate-containers .site-main { margin: 0; padding: 0; }
.separate-containers .site-main > * { margin-bottom: 0; }
.entry-content { margin: 0; }
.vpw-skip { position: absolute; left: -9999px; }
.vpw-skip:focus { left: 1rem; top: 1rem; z-index: 9999; background: #fff; padding: .75rem 1rem; }

/* Boutons */
.vpw-btn {
  box-sizing: border-box;
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  min-height: 3rem; padding: .75rem 1.5rem;
  border-radius: var(--vpw-radius-sm);
  font-family: var(--vpw-font-body); font-weight: 600; font-size: 1rem; line-height: 1.2;
  text-decoration: none; cursor: pointer;
  transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease, color .2s ease, border-color .2s ease;
}
.vpw-btn:focus-visible { outline: 3px solid var(--vpw-pink-on-dark); outline-offset: 3px; }
.vpw-btn--primary { background: var(--vpw-cta); color: #fff; }
.vpw-btn--primary:hover { background: var(--vpw-cta-hover); color: #fff; transform: translateY(-1px); box-shadow: 0 8px 20px -8px rgba(168,59,119,.55); }
.vpw-btn--ghost { background: transparent; color: var(--vpw-ink); border: 1px solid var(--vpw-line); }
.vpw-btn--ghost:hover { border-color: var(--vpw-indigo); color: var(--vpw-indigo-deep); }
.vpw-btn--ghost-dark { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.35); }
.vpw-btn--ghost-dark:hover { border-color: #fff; color: #fff; }
.vpw-btn .gb-text { color: inherit; }

/* Lien flèche */
.vpw-link { color: var(--vpw-indigo-deep); font-weight: 600; text-decoration: none; display: inline-flex; gap: .4rem; align-items: center; }
.vpw-link:hover { color: var(--vpw-cta); }
.vpw-link .gb-text { color: inherit; }

/* Lignes de liste (problèmes, étapes) */
.vpw-row { border-top: 1px solid var(--vpw-line); }

/* Révélation douce, uniquement si le navigateur sait le faire */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .vpw-reveal { animation: vpw-rise both ease-out; animation-timeline: view(); animation-range: entry 0% entry 35%; }
    @keyframes vpw-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
  }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition-duration: .01ms !important; } }

/* Formulaire Contact Form 7 */
.vpw-form .wpcf7 label { display: block; font-weight: 600; font-size: .95rem; color: var(--vpw-ink); margin-bottom: 1rem; }
.vpw-form .wpcf7 input[type=text], .vpw-form .wpcf7 input[type=email], .vpw-form .wpcf7 input[type=tel], .vpw-form .wpcf7 textarea {
  width: 100%; margin-top: .35rem; padding: .8rem 1rem; font: inherit; color: var(--vpw-ink);
  background: #fff; border: 1px solid var(--vpw-line); border-radius: var(--vpw-radius-sm);
}
.vpw-form .wpcf7 input:focus, .vpw-form .wpcf7 textarea:focus { outline: 3px solid rgba(84,81,168,.25); border-color: var(--vpw-indigo); }
.vpw-form .wpcf7 input[type=submit] {
  background: var(--vpw-cta); color: #fff; border: 0; border-radius: var(--vpw-radius-sm);
  padding: .9rem 1.75rem; font: 600 1rem var(--vpw-font-body); cursor: pointer; transition: background-color .2s ease;
}
.vpw-form .wpcf7 input[type=submit]:hover { background: var(--vpw-cta-hover); }
.vpw-form .wpcf7-acceptance label { font-weight: 400; font-size: .85rem; color: var(--vpw-muted); }

/* En-tête */
.site-header { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,.94); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: 1px solid var(--vpw-line); }
.admin-bar .site-header { top: 32px; }
.inside-header { max-width: var(--vpw-rail); padding: .7rem clamp(1.25rem,4vw,2rem); align-items: center; }
.site-branding-container, .site-branding { margin: 0; }
.main-title { margin: 0; line-height: 1; }
.vpw-brand { display: inline-flex; align-items: center; gap: .65rem; text-decoration: none; }
.vpw-brand__mark { height: 2.4rem; width: auto; display: block; }
.vpw-brand__name { font-family: var(--vpw-font-head); font-weight: 700; font-size: 1.3rem; letter-spacing: -0.02em; line-height: 1; }
.vpw-brand__name .c1 { color: #A5437F; }
.vpw-brand__name .c2 { color: var(--vpw-indigo); }
.vpw-brand__name .c3 { color: #753758; }
.main-navigation, .main-navigation ul ul { background: transparent; }
.main-navigation .main-nav ul li a { font-size: .95rem; font-weight: 500; color: var(--vpw-ink); line-height: 2.75rem; padding-left: .85rem; padding-right: .85rem; transition: color .2s ease; }
.main-navigation .main-nav ul li a:hover, .main-navigation .main-nav ul li[class*="current-menu-"] > a { color: var(--vpw-indigo-deep); background: transparent; }
.main-navigation .main-nav ul li.vpw-menu-tel > a { font-weight: 600; color: var(--vpw-indigo-deep); }
.main-navigation .main-nav ul li.vpw-menu-cta > a { background: var(--vpw-cta); color: #fff; border-radius: var(--vpw-radius-sm); line-height: 1.2; padding: .8rem 1.25rem; margin-left: .5rem; font-weight: 600; }
.main-navigation .main-nav ul li.vpw-menu-cta > a:hover { background: var(--vpw-cta-hover); color: #fff; }
.main-navigation .menu-toggle { color: var(--vpw-ink); font-weight: 600; }
.main-navigation.toggled .main-nav ul li.vpw-menu-cta > a { margin: .5rem 1rem 1rem; text-align: center; display: block; }
@media (max-width: 768px) { .admin-bar .site-header { top: 46px; } .vpw-brand__name { font-size: 1.15rem; } }

/* Tablette et mobile : en-tête compact (logo à gauche, menu à droite) */
@media (max-width: 1024px) {
  .inside-header { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; padding-top: .5rem; padding-bottom: .5rem; }
  .site-branding-container, .site-branding { width: auto; flex: 0 0 auto; text-align: left; }
  .main-navigation { width: auto; margin-left: auto; float: none; }
  .main-navigation.toggled { width: 100%; order: 3; }
  .main-navigation .menu-toggle { padding: 0 .25rem; line-height: 2.75rem; }
}
@media (max-width: 767px) { .vpw-btn { width: 100%; } }

/* FAQ (core/details) */
.vpw-faq__item { border-top: 1px solid var(--vpw-line); padding: 0; margin: 0; }
.vpw-faq__item:last-child { border-bottom: 1px solid var(--vpw-line); }
.vpw-faq__item summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; padding: 1.25rem 0; font-family: var(--vpw-font-head); font-weight: 700; font-size: 1.1875rem; line-height: 1.3; letter-spacing: -0.01em; color: var(--vpw-ink); }
.vpw-faq__item summary::-webkit-details-marker { display: none; }
.vpw-faq__item summary::after { content: '+'; flex-shrink: 0; font-size: 1.5rem; line-height: 1; color: var(--vpw-cta); transition: transform .2s ease; }
.vpw-faq__item[open] summary::after { transform: rotate(45deg); }
.vpw-faq__item summary:focus-visible { outline: 3px solid var(--vpw-indigo); outline-offset: 2px; border-radius: 4px; }
.vpw-faq__item p { margin: 0 0 1.25rem; color: var(--vpw-muted); max-width: 40rem; }

/* Fiches portfolio (contenu existant en blocs core) */
.single-portfolio .site-content { display: block; }
body.single-portfolio .site-main .inside-article { padding: clamp(2rem,5vw,4rem) clamp(1.25rem,4vw,2rem) clamp(2.5rem,5vw,4rem); max-width: 54rem; margin: 0 auto; }
.single-portfolio .entry-content > * { max-width: 46rem; margin-left: auto; margin-right: auto; }
.single-portfolio .entry-content > .wp-block-image, .single-portfolio .entry-content > figure { max-width: 54rem; }
.single-portfolio .entry-content h1 { font-size: clamp(2rem,1.4rem + 2.4vw,3.25rem); line-height: 1.08; letter-spacing: -0.03em; margin-bottom: 1rem; }
.single-portfolio .entry-content h2 { font-size: clamp(1.4rem,1.1rem + 1vw,1.875rem); margin-top: 2.5rem; letter-spacing: -0.02em; }
.single-portfolio .entry-content img { border-radius: var(--vpw-radius); height: auto; }
.single-portfolio .entry-content .wp-block-spacer { max-height: 2rem; }
.single-portfolio .entry-content ul { padding-left: 1.25rem; }
.single-portfolio .entry-content li { margin-bottom: .4rem; }
.single-portfolio .post-navigation, .single-portfolio .comments-area, .single-portfolio footer.entry-meta { display: none; }
.single-portfolio .entry-content .wp-block-group { padding-left: 0; padding-right: 0; }
.single-portfolio .entry-content .wp-block-spacer { height: 1.25rem !important; }
.single-portfolio .entry-content h1 { margin-top: 0; }

/* Supprime l'espace de 20 px entre l'en-tête et le contenu (conteneur d'image mise en avant vide de GeneratePress) */
.featured-image.page-header-image, .featured-image.page-header-image-single { display: none; margin: 0; }

/* Pages standard (non refaites en blocs pleine largeur, ex. politique de confidentialité) : colonne de lecture */
body:not(.full-width-content) .site-main .inside-article { max-width: 48rem; margin-left: auto; margin-right: auto; padding: clamp(2rem,5vw,4rem) clamp(1.25rem,4vw,2rem); }