/*
 Theme Name:   GeneratePerf Child Theme
 Theme URI:    https://agencewebperformance.fr/prestations/creation-site-performant/
 Author:       Agence Web Performance
 Author URI:   https://agencewebperformance.fr/
 Template:     generatepress
 Text Domain:  generateperf_child
 Version:      1.0.7
 License: GPLv3
 License URI: https://www.gnu.org/licenses/gpl-3.0.html
*/

/**
 * Compatibilité old CSS variables.
 */

 :root {
  --primary: var(--darker);
  --secondary:var(--contrast-2);
  --light:var(--base);
  --medium:var(--contrast-3);
  --dark:var(--contrast-2);
  --darkest:var(--contrast);
}

/**
 * Beautiful lists.
 */

li::marker {
  color: var(--primary);
}

/**
 * Beautiful inputs.
 */

input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--primary);
}

/**
 * Beautiful Blockquotes.
 */

 blockquote cite {
  display: block;
  font-style: normal;
  font-size: 1rem;
  margin-top: 1rem;
  color: var(--dark);
}

/**
 * Add missing space.
 */

.wp-block-image,
.wp-block-embed {
  margin-bottom: 1.5em;
}

/**
 * Prevent footer rendering on initial rendering.
 */

.site-footer {
  content-visibility: auto;
  contain-intrinsic-height: 400px;
}

@media(min-width: 768px) {
  .site-footer {
    contain-intrinsic-height: 300px;
  }
}

/**
 * Add external icons to _blank links.
 */

.entry-content p a[target="_blank"]::after,
.entry-content li a[target="_blank"]::after {
   display: inline-block;
   content: "";
   margin-left: .25em;
   width: .8em;
   height: .8em;
   mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M320 0a32 32 0 1 0 0 64h82.7L201.4 265.4a32 32 0 0 0 45.3 45.3L448 109.3V192a32 32 0 1 0 64 0V32a32 32 0 0 0-32-32H320zM80 32a80 80 0 0 0-80 80v320a80 80 0 0 0 80 80h320a80 80 0 0 0 80-80V320a32 32 0 1 0-64 0v112a16 16 0 0 1-16 16H80a16 16 0 0 1-16-16V112a16 16 0 0 1 16-16h112a32 32 0 1 0 0-64H80z"/></svg>') no-repeat 50% 50%;
   mask-size: cover;
   -webkit-mask-size: cover;
   vertical-align: -.075em;
   background-color: currentColor;
 }

/**
 * Improve default links style
 */

 .entry-content a:not(.simple):not(.wp-block-latest-posts__post-title) {
  color: var(--darkest);
  text-decoration-line: underline;
  text-decoration-thickness: 2px;
  text-decoration-color: var(--primary);
  text-underline-offset: .25em;
}

.entry-content a:not(.simple):not(.wp-block-latest-posts__post-title):hover {
  color: var(--primary);
  text-decoration-color: var(--darkest);
}

/**
 * Separator.
 */

 .separator {
  display: grid;
  grid-template-columns: 1fr 40px 1fr;
  grid-gap: 20px;
  align-items: center;
  text-align: center;
  width: 100%;
  overflow: hidden;
  margin-top: var(--spacing);
  margin-bottom: var(--spacing);
}

.separator span {
  display: block;
  margin-top: -1px;
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 211.6 210.8" width="40" height="40" fill="%23d1d1d1"><path d="M70 15a53 53 0 0 1 73 0 76 76 0 0 0-17 6l-5-3c-11-5-24-4-34 3-6-3-11-5-17-6zM35 32v23a57 57 0 0 0 14 39l-10 9a68 68 0 0 1-18-47V18h-1l1-1h33l9 1c17 2 31 10 43 23a2775 2775 0 0 0 51 52l-11 10-38-39-9-9a62 62 0 0 0-39-22l-25-1z"/><path d="M177 32h-23a58 58 0 0 0-35 17l-10-10v-1c13-12 30-20 48-20h34v47c-3 17-10 30-22 42a5367 5367 0 0 1-51 49l-10-10 40-39 16-17a57 57 0 0 0 13-37V32zM62 81c-7-7-11-15-11-24a65 65 0 0 1 0-9h10c1 9 6 16 12 22L62 81z"/><path d="M151 48h10c1 13-2 24-11 33l-11-12c6-6 11-12 12-21zM59 91a2947 2947 0 0 1 36-35l10 10-45 44a67 67 0 0 0-24 41l-1 9v18h21c12 0 25-6 34-13l3-3 10 10v1a72 72 0 0 1-49 20H21v-36c0-18 7-35 20-49l18-17zm136-25c22 22 22 56 0 79a106 106 0 0 0-5-19c9-12 9-30 0-42l5-18zM16 67v-1h1c1 6 2 12 5 18a35 35 0 0 0 0 43 109 109 0 0 0-5 18c-22-23-23-55-1-78z"/><path d="m67 109 50 51c10 10 21 16 34 18h26v-28a55 55 0 0 0-15-31l11-10a73 73 0 0 1 19 49v35h-34l-9-1c-15-2-29-9-40-20l-17-16a3158 3158 0 0 1-36-37l10-10h1zm-16 53c-1-12 2-22 11-30 0-1 0-1 0 0l11 11c1 0 1 0 0 0-5 5-11 12-11 19H51z"/><path d="M161 162h-10c-1-8-7-14-12-20l11-10c0-1 0-1 0 0a38 38 0 0 1 12 30h-1zm-91 34a66 66 0 0 0 17-6c11 8 28 8 39 0 0-1 0-1 0 0l17 6a54 54 0 0 1-41 15c-11-1-20-5-28-11l-4-4zm36-113a22 22 0 1 0 0 45 22 22 0 0 0 0-45zm0 32a10 10 0 1 1 0-19 10 10 0 0 1 0 19z"/></svg>');
}

.separator:before,
.separator:after {
  content: "";
  border-top: 2px solid var(--base-2);
}

/**
 * Simple lists in footer.
 */

 .site-footer ul {
	margin-left: 1em;
}

.site-footer li::marker {
  color: var(--darker);
}

/**
 * Beautiful SVGs in menus.
 */

.menu-item-icon {
  width: 22px;
  height: 22px;
  margin-right: .5em;
  fill: currentColor;
  vertical-align: sub;
}

/**
 * Featured images full width.
 */

.featured-image img {
	width: 100%;
}

/**
 * Custom design for main images captions.
 */

 .featured-image figcaption {
  background-color: var(--lightgrey) !important;
 }

.featured-image figcaption::before {
  content: "";
  display: block;
  position: absolute;
  top: -24px;
  left: 25px;
  height: 0px;
  width: 0px;
  border-right: solid 25px transparent;
  border-left: solid 25px transparent;
  border-bottom: solid 25px var(--lightgrey);
}

/**
 * Custom subtitles styling.
 */

p[role="doc-subtitle"] {
  padding-left: 1em;
  border-left: 4px solid var(--primary);
}

/**
 * Reduce titles size for mobile.
 */

@media(max-width: 768px) {
  h1 {
    font-size: 34px;
  }

  h2 {
    font-size: 29px;
  }

  h3 {
    font-size: 24px;
  }

  h4 {
    font-size: 20px
  }

  h5 {
    font-size: 18px
  }
}

/**
 * Navigation.
 */

 .inside-navigation {
  border-top: 1px solid rgba(255, 255, 255, .25);
}

@media(min-width: 1040px) {
  .menu-item[class*="current-"] {
    position: relative;
  }
  .menu-item[class*="current-"]::after {
    position: absolute;
    content: "";
    display: block;
    bottom: -10px;
    left: 0;
    width: 100%;
    height: 10px;
    background-color: var(--base-3);
  }
}

.main-navigation {
  box-shadow: 0 5px 5px 0 rgba(21,49,177,.15);
}

.top-desktop {
  margin-top: 0 !important;
}

@media (max-width: 768px) {
  .top-desktop {
    display: none !important;
  }
}

@media (min-width: 769px) {
  .menu-bar-items {
    display: none !important;
  }
  .inside-header {
    flex-direction: row !important;
    justify-content: space-between !important;
  }
}

/**
 * Custom code.
 */

.site-footer > .gb-container {
    --s: 150px;
    --c1: #f6f7fc;
    --c2: var(--base-3);
    --_g:radial-gradient(#0000 60%,var(--c1) 61% 63%,#0000 64% 77%,var(--c1) 78% 80%,#0000 81%);
    --_c:,#0000 75%,var(--c2) 0;
    background:
      conic-gradient(at 12% 20% var(--_c)) calc(var(--s)* .44) calc(.9*var(--s)),
      conic-gradient(at 12% 20% var(--_c)) calc(var(--s)*-.06) calc(.4*var(--s)),
      conic-gradient(at 20% 12% var(--_c)) calc(.9*var(--s)) calc(var(--s)* .44),
      conic-gradient(at 20% 12% var(--_c)) calc(.4*var(--s)) calc(var(--s)*-.06),
      var(--_g),var(--_g) calc(var(--s)/2) calc(var(--s)/2) var(--c2);
    background-size: var(--s) var(--s);
}

.pattern {
  --s: 150px;
  --c1: #405cd7;
  --c2: var(--darker);
  --_g:radial-gradient(#0000 60%,var(--c1) 61% 63%,#0000 64% 77%,var(--c1) 78% 80%,#0000 81%);
  --_c:,#0000 75%,var(--c2) 0;
  background:
    conic-gradient(at 12% 20% var(--_c)) calc(var(--s)* .44) calc(.9*var(--s)),
    conic-gradient(at 12% 20% var(--_c)) calc(var(--s)*-.06) calc(.4*var(--s)),
    conic-gradient(at 20% 12% var(--_c)) calc(.9*var(--s)) calc(var(--s)* .44),
    conic-gradient(at 20% 12% var(--_c)) calc(.4*var(--s)) calc(var(--s)*-.06),
    var(--_g),var(--_g) calc(var(--s)/2) calc(var(--s)/2) var(--c2);
  background-size: var(--s) var(--s);
}

.entry-meta {
  font-size: .89rem;
}

.wp-block-image,
.wp-block-embed {
	margin-bottom: 2em;
}

a.button {
  color: var(--lightest) !important;
}

button.gb-tabs__button {
  border-radius: 0 !important;
}

.wp-block-quote svg {
	color: var(--accent);
	margin-bottom: 20px;
}
.meta-separator {opacity: .5;margin-inline: .15rem;}