/*
Theme Name: GWEL
Theme URI: https://gwel.art
Author: kimlanprod
Author URI: https://kimlanprod.com
Description: Dessin d’humour, peinture, papier découpé et volume : j’explore diverses expressions artistiques. Bonne visite ! Email : contact@gwel.art
Version: 1.0
Template: gwel
*/


/* Landing « Bientôt » : page d'attente en attendant la fin du site */
.page-id-4163 .site-header { display: none; }
.page-id-4163 .wrapper { min-height: 100vh; display: flex; flex-direction: column; }
.page-id-4163 .vc-container, .page-id-4163 .wpb-content-wrapper { flex: 1 1 auto; display: flex; flex-direction: column; }
.page-id-4163 .parent--gwel-landing-hero { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; }
.page-id-4163 .gwel-landing-hero { width: 100%; text-align: center; padding-top: 4vh; }
.page-id-4163 .gwel-landing-logo img { width: 78px; height: auto; margin: 0 auto; }
.page-id-4163 h1.gwel-landing-title, .page-id-4163 .gwel-landing-title h1 { font-family: 'fg-light', 'fg-regular', sans-serif; font-weight: 400; font-size: clamp(54px, 7.5vw, 112px); line-height: 1; letter-spacing: -0.02em; color: #333; margin: 28px 0 14px; text-align: center; }
.page-id-4163 .gwel-landing-text p { font-family: 'fg-text-light', sans-serif; font-size: clamp(18px, 1.7vw, 26px); color: #333; text-align: center; margin: 0; }
.page-id-4163 .parent--gwel-landing-strip { flex: 0 0 auto; margin-bottom: 4vh; }
.page-id-4163 .gwel-landing-strip { display: flex; flex-wrap: nowrap; gap: 14px; height: 40vh; min-height: 220px; margin: 0; }
.page-id-4163 .gwel-landing-strip::before, .page-id-4163 .gwel-landing-strip::after { display: none; }
.page-id-4163 .gwel-landing-cell { flex: 1 1 0; width: auto; min-width: 0; float: none; overflow: hidden; transition: flex-grow .8s cubic-bezier(.22, .8, .2, 1); }
.page-id-4163 .gwel-landing-cell:hover { flex-grow: 3.4; }
.page-id-4163 .gwel-landing-cell > .vc_column-inner,
.page-id-4163 .gwel-landing-cell .wpb_wrapper,
.page-id-4163 .gwel-landing-cell .wpb_single_image,
.page-id-4163 .gwel-landing-cell .vc_figure,
.page-id-4163 .gwel-landing-cell .vc_single_image-wrapper { display: block; width: 100%; height: 100%; padding: 0; margin: 0; }
.page-id-4163 .gwel-landing-cell img { display: block; width: 100%; height: 100%; object-fit: cover; transition: filter .8s ease, transform .8s ease; }
.page-id-4163 .gwel-landing-cell:hover img { filter: blur(0); transform: scale(1); }
@media (hover: none) {
	.page-id-4163 .gwel-landing-cell img { filter: none; transform: none; }
}
@media (max-width: 767px) {
	.page-id-4163 .gwel-landing-strip { gap: 6px; height: 32vh; }
}

/* ===== Page A propos (mise en page image + texte) ===== */
.gwel-about { padding: 30px 0 80px !important; }
@media (min-width: 992px) { .gwel-about { max-width: 1320px; margin-left: auto !important; margin-right: auto !important; } }
.gwel-about > .wpb_column { padding-top: 0 !important; }
@media (max-width: 991px) { .gwel-about { padding-top: 0 !important; margin-top: -45px !important; } }
@media (max-width: 767px) { .gwel-about { margin-left: -15px !important; margin-right: -15px !important; } .gwel-about > .wpb_column { padding-left: 0 !important; padding-right: 0 !important; } }
.gwel-about .wpb_text_column p { font-size: 16px; line-height: 1.8; letter-spacing: .02em; color: #333; margin: 0 0 1.6em; }
.gwel-about .wpb_text_column { margin-bottom: 10px; }
.gwel-about .gwel-about-social { display: inline-block; margin: 0 6px 0 0 !important; }
.gwel-about .gwel-about-social .vc_icon_element-inner { width: 1.6em; height: 1.6em; }
@media (max-width: 767px) { .gwel-about .wpb_single_image { margin-bottom: 30px; } }

/* ===== Logo responsive : taille finale dès le chargement (évite l'effet de zoom) ===== */
@media (max-width: 991px) {
	.site-header .header-logo.logo-image { width: 40px !important; height: 55px !important; transition: none !important; }
	.site-header .header-block { padding-top: 20px !important; padding-bottom: 20px !important; transition: none !important; }
	.site-header--sticky-spacer { height: 144px !important; }
}

/* ===== Navigation entre projets (précédent · actif · suivant) ===== */
.gwel-pnav { max-width: 900px; margin: 0 auto; }
.gwel-pnav a { text-decoration: none !important; transition: color .3s ease; }
.gwel-pnav__row { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 6px 36px; font-size: 18px; line-height: 1.5; text-align: center; }
.gwel-pnav__prev, .gwel-pnav__next { color: #d2d2d2 !important; }
.gwel-pnav__current { color: #333333; }
.gwel-pnav a:hover { color: #333333 !important; }
@media (max-width: 767px) {
	.gwel-pnav__row { gap: 4px 20px; font-size: 15px; }
}

/* Version responsive : flèches à la place des noms de projets précédent / suivant
   (uniquement les menus avec projet en cours, pas le lien « Travaux artistiques ») */
.vc_hidden-lg .gwel-pnav:has(.gwel-pnav__current) { max-width: none; }
.vc_hidden-lg .gwel-pnav:has(.gwel-pnav__current) .gwel-pnav__row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 0; }
.vc_hidden-lg .gwel-pnav:has(.gwel-pnav__current) .gwel-pnav__prev,
.vc_hidden-lg .gwel-pnav:has(.gwel-pnav__current) .gwel-pnav__next { font-size: 0 !important; line-height: 1; padding: 10px; }
.vc_hidden-lg .gwel-pnav:has(.gwel-pnav__current) .gwel-pnav__prev { justify-self: center; }
.vc_hidden-lg .gwel-pnav:has(.gwel-pnav__current) .gwel-pnav__next { justify-self: center; }
.vc_hidden-lg .gwel-pnav:has(.gwel-pnav__current) .gwel-pnav__prev::before,
.vc_hidden-lg .gwel-pnav:has(.gwel-pnav__current) .gwel-pnav__next::before { font-size: 22px; line-height: 1; }
.vc_hidden-lg .gwel-pnav:has(.gwel-pnav__current) .gwel-pnav__prev::before { content: "<"; }
.vc_hidden-lg .gwel-pnav:has(.gwel-pnav__current) .gwel-pnav__next::before { content: ">"; }

/* ===== Page Erreur 404 ===== */
.gwel-404 { max-width: 900px; margin: 0 auto; padding: 0 0 120px; text-align: center; }
.gwel-404__title { margin: 0 0 50px; font-family: "fg-regular", sans-serif; font-size: 55px; font-weight: normal; line-height: 1.1; letter-spacing: 0; text-transform: uppercase; color: #333; }
.gwel-404__img { display: block; width: 320px; max-width: 70%; height: auto; margin: 0 auto 60px; }
.gwel-404__text { margin: 0; font-size: 20px; line-height: 1.8; color: #333; }
.gwel-404__text a { color: #333 !important; text-decoration: none !important; }
.gwel-404__text strong { font-family: "fg-regular", sans-serif; font-weight: 700; }
.gwel-404__text a:hover { opacity: .6; }
@media (max-width: 767px) {
	.gwel-404 { margin-top: -15px; padding: 0 0 80px; }
	.gwel-404__title { margin-bottom: 35px; font-size: 38px; }
	.gwel-404__img { width: 200px; margin-bottom: 40px; }
	.gwel-404__text { font-size: min(20px, calc((100vw - 40px) / 21.7)); white-space: nowrap; }
}

/* ===== Bandeau cookies (CookieYes) : style épuré Gwel ===== */
.cky-consent-container, .cky-modal, .cky-consent-container *, .cky-modal * { font-family: "fg-text-light", sans-serif !important; letter-spacing: 0 !important; }
.cky-consent-container .cky-consent-bar { padding: 28px !important; border: 1px solid #ececec !important; border-radius: 0 !important; box-shadow: 0 12px 40px rgba(0, 0, 0, .06) !important; }
.cky-consent-container .cky-title,
.cky-modal .cky-preference-title,
.cky-modal .cky-accordion-btn { font-family: "fg-regular", sans-serif !important; font-weight: normal !important; color: #333 !important; }
.cky-consent-container .cky-title { margin-bottom: 14px !important; font-size: 20px !important; line-height: 1.4 !important; }
.cky-consent-container .cky-notice-des,
.cky-consent-container .cky-notice-des p { font-size: 16px !important; line-height: 1.8 !important; color: #333 !important; }
.cky-consent-container .cky-notice-btn-wrapper { margin-top: 22px !important; }
.cky-consent-container .cky-notice-des a.cky-policy { margin-left: 0 !important; font-size: 16px !important; line-height: 1.8 !important; color: #333 !important; text-decoration: none !important; border-bottom: 1px solid #d2d2d2 !important; transition: border-color .3s ease !important; }
.cky-consent-container .cky-notice-des a.cky-policy:hover { border-bottom-color: #333 !important; }
.cky-consent-container .cky-notice-btn-wrapper .cky-btn { padding: 12px 14px 8px !important; font-family: "fg-regular", sans-serif !important; }
.cky-btn { padding: 10px 14px !important; border-width: 1px !important; border-radius: 0 !important; font-size: 14px !important; font-weight: normal !important; line-height: 1.2 !important; transition: color .3s ease, background-color .3s ease, border-color .3s ease !important; }
.cky-btn:hover { opacity: 1 !important; }
.cky-btn.cky-btn-customize, .cky-btn.cky-btn-reject, .cky-btn.cky-btn-preferences { color: #333 !important; background: transparent !important; border-color: #d2d2d2 !important; }
.cky-btn.cky-btn-customize:hover, .cky-btn.cky-btn-reject:hover, .cky-btn.cky-btn-preferences:hover { border-color: #333 !important; }
.cky-btn.cky-btn-accept { color: #fff !important; background: #333 !important; border-color: #333 !important; }
.cky-btn.cky-btn-accept:hover { background: #000 !important; border-color: #000 !important; }
.cky-modal .cky-preference-center { border-radius: 0 !important; box-shadow: 0 12px 40px rgba(0, 0, 0, .08) !important; }
.cky-modal .cky-preference-title { font-size: 20px !important; }
.cky-modal .cky-preference-content-wrapper, .cky-modal .cky-preference-content-wrapper p,
.cky-modal .cky-accordion-header-des, .cky-modal .cky-accordion-header-des p { font-size: 16px !important; line-height: 1.8 !important; color: #333 !important; }
.cky-modal .cky-prefrence-btn-wrapper .cky-btn { padding: 12px 14px 8px !important; font-family: "fg-regular", sans-serif !important; }
.cky-modal .cky-accordion-btn { font-size: 16px !important; }
.cky-modal .cky-always-active { color: #333 !important; font-size: 13px !important; font-weight: normal !important; }
.cky-modal .cky-show-desc-btn { color: #333 !important; text-decoration: underline !important; }
.cky-modal .cky-switch input[type="checkbox"]:checked { background: #333 !important; }
/* Bouton « revenir sur son choix » : fond #F2F2F2, icône #333, 30px */
.cky-btn-revisit-wrapper { width: 30px !important; height: 30px !important; background-color: #F2F2F2 !important; }
.cky-btn-revisit-wrapper .cky-btn-revisit { position: relative; width: 30px !important; height: 30px !important; }
.cky-btn-revisit-wrapper .cky-btn-revisit img { opacity: 0 !important; width: 20px !important; height: 20px !important; }
.cky-btn-revisit-wrapper .cky-btn-revisit::before { content: ""; position: absolute; top: 5px; left: 5px; width: 20px; height: 20px; background-color: #333; -webkit-mask: url("/wp-content/plugins/cookie-law-info/lite/frontend/images/revisit.svg") center / contain no-repeat; mask: url("/wp-content/plugins/cookie-law-info/lite/frontend/images/revisit.svg") center / contain no-repeat; pointer-events: none; }
@media (max-width: 576px) {
	.cky-consent-container .cky-consent-bar { padding: 22px 20px !important; }
}

/* ===== Page Mentions légales ===== */
.gwel-legal { padding: 0; color: #333; }
.gwel-legal__title { margin: 50px 0 70px; font-family: "fg-regular", sans-serif; font-size: 50px; font-weight: normal; line-height: 1.1; letter-spacing: 0; text-transform: none; text-align: left; color: #333; }
.gwel-legal__section { padding: 40px 0 0; border-top: 1px solid #ececec; }
.gwel-legal__section + .gwel-legal__section { margin-top: 30px; }
.gwel-legal__section:last-child { padding-bottom: 20px; border-bottom: 1px solid #ececec; }
.gwel-legal h2 { margin: 0 0 20px; font-family: "fg-regular", sans-serif; font-size: 24px; font-weight: normal; line-height: 1.3; letter-spacing: 0; text-transform: none; color: #333; }
.gwel-legal p { margin: 0 0 20px; font-size: 20px; line-height: 1.8; color: #333; }
.gwel-legal strong { font-family: "fg-regular", sans-serif; font-weight: 700; line-height: 1; }
.gwel-legal a { color: #333 !important; text-decoration: none !important; border-bottom: 0; transition: opacity .3s ease; }
.gwel-legal a:hover { opacity: .6; }
@media (max-width: 767px) {
	.gwel-legal { margin-top: -15px; padding-bottom: 0; }
	.gwel-legal__title { margin-top: 0; margin-bottom: 40px; font-size: 32px; }
	.gwel-legal__section { padding-top: 30px; }
	.gwel-legal__section + .gwel-legal__section { margin-top: 20px; }
	.gwel-legal__section:last-child { padding-bottom: 14px; }
	.gwel-legal h2 { margin-bottom: 14px; font-size: 20px; }
	.gwel-legal p { margin-bottom: 16px; font-size: 16px; }
}

/* ===== Page Plan de site ===== */
.gwel-legal .gwel-sitemap { margin: 0 0 20px; padding: 0; list-style: none; }
.gwel-legal .gwel-sitemap li { margin: 0; padding: 0; font-size: 20px; line-height: 1.8; color: #333; }
.gwel-legal .gwel-sitemap li::before { content: none; }
.gwel-legal .gwel-sitemap a { border-bottom: 0; transition: opacity .3s ease; }
.gwel-legal .gwel-sitemap a:hover { opacity: .6; }
@media (max-width: 767px) {
	.gwel-legal .gwel-sitemap { margin-bottom: 16px; }
	.gwel-legal .gwel-sitemap li { font-size: 16px; }
}

/* ===== Menu responsive : fond blanc plein écran (y compris sous la barre Safari iOS) ===== */
.mobile-menu-overlay { top: -120px !important; bottom: -240px !important; height: auto !important; background-color: #fff !important; }
html:has(body.mobile-menu-open), body.mobile-menu-open { background-color: #fff !important; }
body.mobile-menu-open .cky-btn-revisit-wrapper { display: none !important; }

/* Header responsive : hamburger à gauche, logo G centré, Instagram à droite */
@media (max-width: 1024px) {
	.site-header .header-block__row--main { display: grid; grid-template-columns: 1fr auto 1fr; }
	.site-header .header-block__row--main > .header-block__logo { grid-column: 2; grid-row: 1; }
	.site-header .header-block__row--main > .header-block__logo ~ .header-block__column { grid-column: 1; grid-row: 1; justify-self: start; justify-content: flex-start; }
	.gwel-header-insta { grid-column: 3; grid-row: 1; justify-self: end; align-self: center; display: flex; padding: 0 15px; line-height: 0; color: #333 !important; border: 0 !important; transition: opacity .3s ease; }
	.gwel-header-insta:hover { opacity: .6; }
	.gwel-header-insta svg { width: 22px; height: 22px; }
	.gwel-mobile-menu-insta { position: fixed; z-index: 150001; }
}
@media (min-width: 1025px) {
	.gwel-header-insta { display: none !important; }
}

/* Page Contact (responsive) : marge sous le bloc texte */
@media (max-width: 1024px) {
	.wpb_text_column.vc_custom_1792678070325 { margin-bottom: 30px !important; }
}

/* Mobile : évite le saut de l'en-tête au chargement (avant que le thème insère l'espace de 144px) */
@media (max-width: 991px) {
	.site-header:not(.site-header--sticky-initialized) { margin-bottom: 49px; }
}

/* Menu mobile : croix, logo et Instagram affichés dès l'ouverture (sans attendre le fondu du menu) */
.gwel-mobile-menu-top { position: fixed; top: 0; left: 0; width: 0; height: 0; z-index: 150002; visibility: hidden; opacity: 0; transition: opacity .15s ease, visibility 0s linear .15s; }
body.mobile-menu-open .gwel-mobile-menu-top { visibility: visible; opacity: 1; transition: opacity .15s ease; }
.gwel-mobile-menu-top .mobile-menu-close-link { position: fixed; visibility: inherit !important; opacity: 1 !important; }

/* Mobile : logo G toujours visible (pas de fondu du logo sticky à chaque chargement de page) */
@media (max-width: 1024px) {
	.site-header .header-logo .main-logo,
	.gwel-mobile-menu-logo .main-logo { opacity: 1 !important; visibility: visible !important; transition: none !important; }
	.site-header .header-logo .alternate-logo,
	.gwel-mobile-menu-logo .alternate-logo { display: none !important; }
}

/* Mobile : en-tête fixé dès le départ (évite l'à-coup quand le thème passe de absolute à fixed au début du scroll) */
@media (max-width: 1024px) {
	.site-header.site-header--sticky-initialized { position: fixed !important; top: 0 !important; left: 0 !important; width: 100% !important; }
}

/* Mobile : icône Instagram écrite dans la page (plus de clignotement), alignée sur le hamburger, 23px */
@media (max-width: 1024px) {
	.gwel-header-insta.gwel-header-insta--fixed { position: fixed; top: 35.5px; right: 15px; z-index: 150003; padding: 0; display: flex; }
	.gwel-header-insta.gwel-header-insta--fixed svg { width: 23px; height: 23px; }
}

/* Mobile : croix et logo G du menu fixés en CSS (ne remontent plus au scroll quand le menu est ouvert) */
@media (max-width: 991px) {
	.gwel-mobile-menu-top .gwel-mobile-menu-logo { top: 20px !important; left: 50% !important; width: 40px !important; transform: translateX(-50%); }
	.gwel-mobile-menu-top .mobile-menu-close-link { top: 33.5px !important; left: 15px !important; right: auto !important; }
}

/* SEO / accessibilité : titres H1/H2 lus par Google et les lecteurs d'écran, invisibles à l'écran (aucun impact sur le design) */
.gwel-sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }