/*
Theme Name: Kodaj Studio
Theme URI: https://kodaj-studio.fr
Author: Kodaj Studio
Author URI: https://kodaj-studio.fr
Description: Thème bloc sur mesure de Kodaj Studio. Tout le contenu est en blocs natifs, modifiable dans l'éditeur.
Version: 1.0.4
Requires at least: 6.6
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kodaj-studio
Tags: block-theme, full-site-editing, one-column
*/

/* Note de méthode : les règles qui posent une marge sont préfixées par « body »
   pour passer devant « :root :where(.is-layout-flow) > * » de WordPress (0,1,0). */

:root{
  --vn:#38333D;          /* violet-noir */
  --brun:#6B4E3A;
  --vert:#3C4A38;
  --beige:#E8E0D2;
  --vert-clair:#56654F;  /* éclat du vert, pour le relief des pilules */
  --verre:rgba(40,36,44,.34);
  --verre-bord:rgba(255,255,255,.16);
  --large:"Unbounded", "Inter", system-ui, sans-serif;
  --texte:"Inter", system-ui, sans-serif;
  --r:28px;
  --barre:97px;
  --i-fleche-vn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2338333D' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E");
  --i-fleche-beige:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E8E0D2' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E");
  --i-fleche-blanc:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E");
  --i-code-vn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2338333D' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4' width='19' height='16' rx='3'/%3E%3Cpath d='M2.5 8.5h19M9.5 12.5 7.5 14.5l2 2M14.5 12.5l2 2-2 2'/%3E%3C/svg%3E");
  --i-code-beige:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E8E0D2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4' width='19' height='16' rx='3'/%3E%3Cpath d='M2.5 8.5h19M9.5 12.5 7.5 14.5l2 2M14.5 12.5l2 2-2 2'/%3E%3C/svg%3E");
  --i-code-blanc:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4' width='19' height='16' rx='3'/%3E%3Cpath d='M2.5 8.5h19M9.5 12.5 7.5 14.5l2 2M14.5 12.5l2 2-2 2'/%3E%3C/svg%3E");
  --i-refonte-vn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2338333D' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a8 8 0 0 0-14.3-4.9L4 8M4 4v4h4M4 13a8 8 0 0 0 14.3 4.9L20 16M20 20v-4h-4'/%3E%3C/svg%3E");
  --i-refonte-beige:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E8E0D2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a8 8 0 0 0-14.3-4.9L4 8M4 4v4h4M4 13a8 8 0 0 0 14.3 4.9L20 16M20 20v-4h-4'/%3E%3C/svg%3E");
  --i-refonte-blanc:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a8 8 0 0 0-14.3-4.9L4 8M4 4v4h4M4 13a8 8 0 0 0 14.3 4.9L20 16M20 20v-4h-4'/%3E%3C/svg%3E");
  --i-bouclier-vn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2338333D' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 4.5 6v5.5c0 4.6 3.2 8.2 7.5 9.5 4.3-1.3 7.5-4.9 7.5-9.5V6L12 3Z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
  --i-bouclier-beige:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E8E0D2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 4.5 6v5.5c0 4.6 3.2 8.2 7.5 9.5 4.3-1.3 7.5-4.9 7.5-9.5V6L12 3Z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
  --i-bouclier-blanc:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 4.5 6v5.5c0 4.6 3.2 8.2 7.5 9.5 4.3-1.3 7.5-4.9 7.5-9.5V6L12 3Z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
  --i-bulle-vn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2338333D' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 12a8.5 8.5 0 0 1-12.6 7.4L3.5 20.5l1.2-4.1A8.5 8.5 0 1 1 20.5 12Z'/%3E%3Cpath d='M8.5 12h.01M12 12h.01M15.5 12h.01'/%3E%3C/svg%3E");
  --i-bulle-beige:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E8E0D2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 12a8.5 8.5 0 0 1-12.6 7.4L3.5 20.5l1.2-4.1A8.5 8.5 0 1 1 20.5 12Z'/%3E%3Cpath d='M8.5 12h.01M12 12h.01M15.5 12h.01'/%3E%3C/svg%3E");
  --i-bulle-blanc:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 12a8.5 8.5 0 0 1-12.6 7.4L3.5 20.5l1.2-4.1A8.5 8.5 0 1 1 20.5 12Z'/%3E%3Cpath d='M8.5 12h.01M12 12h.01M15.5 12h.01'/%3E%3C/svg%3E");
  --i-mail-vn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2338333D' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5.5' width='17' height='13' rx='2.5'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E");
  --i-mail-beige:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E8E0D2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5.5' width='17' height='13' rx='2.5'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E");
  --i-mail-blanc:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5.5' width='17' height='13' rx='2.5'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E");
  --i-lecture-beige:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23E8E0D2'%3E%3Cpath d='M8 5.5v13l10.5-6.5L8 5.5Z'/%3E%3C/svg%3E");
  --i-kodaj-beige:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 88' fill='%23E8E0D2'%3E%3Cpath d='M36,1 H52 Q58,1 58,7 V24 Q58,31 65,32 C70,34 73,38 73,44.5 C73,52 67,58 59,58 Q52,58 52,65 V81 Q52,87 46,87 H18 Q12,87 12,81 V65 Q12,58 19,58 H24 Q30,58 30,52 V7 Q30,1 36,1 Z'/%3E%3Ccircle cx='86' cy='44.5' r='8.5'/%3E%3C/svg%3E");
  --i-kodaj-voile:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 88' fill='%23E8E0D2' fill-opacity='.1'%3E%3Cpath d='M36,1 H52 Q58,1 58,7 V24 Q58,31 65,32 C70,34 73,38 73,44.5 C73,52 67,58 59,58 Q52,58 52,65 V81 Q52,87 46,87 H18 Q12,87 12,81 V65 Q12,58 19,58 H24 Q30,58 30,52 V7 Q30,1 36,1 Z'/%3E%3Ccircle cx='86' cy='44.5' r='8.5'/%3E%3C/svg%3E");
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--texte);font-size:16px;line-height:1.55;color:#fff;background:var(--vn);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3{margin:0;font-weight:300;hyphens:none;text-wrap:balance}
p{margin:0}
ul,ol{list-style:none;margin:0;padding:0}
em{font-style:normal}
strong{font-weight:500}

/* Espacement automatique de Gutenberg : coupé à la source dans theme.json
   (blockGap 0px), filet de sécurité ici à spécificité nulle. */
:where(.wp-block-group)>:where(*),:where(.wp-block-buttons){margin-block:0}
figure.wp-block-image{margin:0}
.wp-site-blocks{position:relative}
.wp-site-blocks>*{margin-block:0}
.wp-block-buttons{display:flex;flex-wrap:wrap;align-items:center;gap:0}
.wp-block-button{display:inline-block}
:where(a,.wp-block-button__link):focus-visible{outline:2px solid var(--beige);outline-offset:3px}

/* Image de fond éditable : un vrai bloc image, sorti du flux. */
.wp-block-image.fond{position:absolute;inset:0;z-index:-2;margin:0}
.wp-block-image.fond img{width:100%;height:100%;object-fit:cover}

/* ---------- boutons ---------- */
.wp-block-button.pilule-blanche .wp-block-button__link{display:inline-flex;align-items:center;gap:12px;padding:15px 24px;border-radius:999px;background:var(--beige);color:var(--vn);font-family:var(--texte);font-weight:500;font-size:15px;line-height:1.55;white-space:nowrap;transition:transform .25s}
.wp-block-button.pilule-blanche .wp-block-button__link::after{content:"";width:18px;height:18px;flex:none;background:var(--i-fleche-vn) center/contain no-repeat}
.wp-block-button.pilule-blanche .wp-block-button__link:hover{transform:translateY(-2px)}
.wp-block-button.pilule-blanche.grande .wp-block-button__link{font-family:var(--large);font-weight:300;font-size:20px;padding:22px 34px}
.wp-block-button.pilule-blanche.grande .wp-block-button__link::after{content:none}

.wp-block-button.pilule-sombre .wp-block-button__link{display:inline-flex;align-items:center;gap:12px;padding:14px 22px;border-radius:999px;background:var(--vn);color:var(--beige);font-family:var(--texte);font-weight:500;font-size:15px;line-height:1.55;white-space:nowrap}
.wp-block-button.pilule-sombre .wp-block-button__link::after{content:"";width:17px;height:17px;flex:none;background:var(--i-fleche-beige) center/contain no-repeat}
.wp-block-button.pilule-sombre.claire .wp-block-button__link{background:var(--beige);color:var(--vn)}
.wp-block-button.pilule-sombre.claire .wp-block-button__link::after{background-image:var(--i-fleche-vn)}

.wp-block-button.rond{position:relative;display:grid;place-items:center;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.wp-block-button.rond .wp-block-button__link{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:142px;height:142px;padding:0;border-radius:50%;background:radial-gradient(circle at 35% 25%, var(--vert-clair), var(--vert) 70%);box-shadow:0 18px 40px rgba(20,24,18,.45), inset 0 1px 0 rgba(255,255,255,.25);font-family:var(--large);font-weight:400;font-size:17px;line-height:1.15;text-align:center;color:var(--beige);transition:transform .3s}
.wp-block-button.rond .wp-block-button__link::before{content:"";width:18px;height:18px;background:var(--i-fleche-beige) center/contain no-repeat}
.wp-block-button.rond:hover .wp-block-button__link{transform:scale(1.05)}

/* ---------- EN-TÊTE (template part) ---------- */
.barre{position:absolute;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;gap:28px;height:var(--barre);padding:0 28px;color:#fff}
.marque{display:flex;align-items:center;color:var(--beige)}
.marque::before{content:"";width:38px;height:35px;flex:none;margin-right:14px;background:var(--i-kodaj-beige) center/contain no-repeat}
.marque a{display:block;font-family:var(--large);font-weight:400;font-size:8px;letter-spacing:.78em;line-height:1.35;text-transform:uppercase}
.marque a::first-line{font-weight:300;font-size:19px;letter-spacing:.34em}

.barre nav.wp-block-navigation.menu{margin-left:24px;font-family:var(--texte);font-size:15px;font-weight:500}
.wp-block-navigation.menu .wp-block-navigation__container{display:flex;gap:10px}
.wp-block-navigation.menu .wp-block-navigation-item__content{display:block;padding:12px 20px;border-radius:999px;background:var(--verre);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#fff;line-height:1.55;transition:background .25s}
.wp-block-navigation.menu .wp-block-navigation-item__content:hover{background:rgba(40,36,44,.55)}
.wp-block-navigation.menu .current-menu-item>.wp-block-navigation-item__content,
.wp-block-navigation.menu .est-actif>.wp-block-navigation-item__content{background:linear-gradient(180deg,var(--vert-clair),var(--vert));box-shadow:0 8px 24px rgba(20,24,18,.4), inset 0 1px 0 rgba(255,255,255,.22);color:var(--beige)}
.wp-block-navigation.menu .wp-block-navigation__responsive-container-open,
.wp-block-navigation.menu .wp-block-navigation__responsive-container-close{color:#fff}
/* Le panneau mobile s'ouvre blanc sur blanc sans ceci (CSS du bloc imprimé après le thème). */
.wp-block-navigation.menu .wp-block-navigation__responsive-container.is-menu-open{background-color:var(--vn)!important;color:#fff!important;padding:28px 22px}
.wp-block-navigation.menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container{flex-direction:column;align-items:flex-start;gap:12px}
.wp-block-navigation.menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{font-size:20px;padding:14px 24px}
body .barre .barre-cta{margin-left:auto}

/* ---------- HÉROS ---------- */
.heros{position:relative;isolation:isolate;overflow:hidden;min-height:max(100svh,900px);padding-top:var(--barre)}
.heros>.fond img{object-position:center 40%}
.heros::before{content:"";position:absolute;inset:0;z-index:-1;background:
    radial-gradient(ellipse 55% 38% at 48% 28%, rgba(56,51,61,.5), rgba(56,51,61,0) 100%),
    linear-gradient(180deg, rgba(56,51,61,.55) 0%, rgba(56,51,61,.1) 30%, rgba(56,51,61,.15) 55%, rgba(40,34,30,.85) 100%),
    linear-gradient(90deg, rgba(107,78,58,.35), rgba(107,78,58,0) 60%)}
.heros::after{content:"";position:absolute;top:0;bottom:0;left:70%;width:1px;background:rgba(255,255,255,.3);z-index:0}

.reseaux{position:absolute;left:28px;top:260px;z-index:2;display:flex;flex-direction:column;align-items:center;gap:14px}
.reseau-mail a{display:block;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.55);font-size:0;color:transparent;background:var(--i-mail-blanc) center/18px no-repeat;transition:background-color .25s}
.reseau-mail a:hover{background-color:rgba(255,255,255,.14)}
body .reseaux-texte{writing-mode:vertical-rl;transform:rotate(180deg);margin-top:22px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;opacity:.85}

body .accroche{position:relative;z-index:1;width:min(1000px,86vw);margin:clamp(24px,4vh,56px) auto 0;text-align:center}
.accroche-titre{font-family:var(--large);font-weight:300;font-size:clamp(42px,5.6vw,86px);line-height:1.02;letter-spacing:-.015em}
.accroche-titre em{color:var(--beige);font-weight:400}
body .accroche-texte{margin-top:34px;font-family:var(--large);font-weight:300;font-size:clamp(15px,1.45vw,21px);letter-spacing:.005em}
.accroche-bouton{position:absolute;left:calc(70vw - (100vw - min(1000px,86vw))/2 - 100px);top:calc(100% - 150px)}

.bas{position:absolute;left:28px;right:28px;bottom:30px;z-index:1;display:grid;grid-template-columns:27% 34% 1fr;gap:4%;align-items:end}
.carte-claire{display:flex;flex-direction:column;justify-content:space-between;min-height:300px;padding:40px 30px 28px;border-radius:var(--r);background:var(--beige);color:var(--brun);box-shadow:0 30px 60px rgba(20,16,14,.35)}
.carte-claire-titre{font-family:var(--large);font-weight:300;font-size:clamp(26px,2.6vw,38px);line-height:1.1}
.carte-claire-texte{padding-top:20px;border-top:1px solid rgba(107,78,58,.35);color:var(--vn);font-size:15px}

.carte-photo,.projet{position:relative;isolation:isolate;overflow:hidden;min-height:330px;border-radius:var(--r);box-shadow:0 30px 60px rgba(20,16,14,.35)}
.carte-photo>.fond img,.projet>.fond img{transition:transform .8s}
.carte-photo:hover>.fond img,.projet.avec-lien:hover>.fond img{transform:scale(1.04)}
.carte-photo::before,.projet.avec-lien::before{content:"";position:absolute;top:18px;right:18px;z-index:1;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.6);background:var(--i-fleche-blanc) center/18px no-repeat, rgba(40,36,44,.2);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.carte-photo::after{content:"";position:absolute;left:50%;top:42%;z-index:1;translate:-50% -50%;width:78px;height:78px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:var(--i-lecture-beige) 54% center/26px no-repeat, rgba(40,36,44,.25);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.verre{position:absolute;left:0;right:0;bottom:0;z-index:1;display:flex;flex-direction:column;gap:4px;padding:22px 24px 24px;background:linear-gradient(180deg,rgba(56,51,61,0),rgba(56,51,61,.55) 35%);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.verre-titre{font-weight:500;font-size:21px;line-height:1.25}
.verre-lien{font-size:14px;opacity:.85}
.verre-lien a:hover{text-decoration:underline}

.liste{align-self:end}
.liste li{position:relative;display:flex;align-items:center;gap:20px;padding:24px 28px;border-top:1px solid rgba(255,255,255,.35);font-size:18px}
.liste li:last-child{border-bottom:1px solid rgba(255,255,255,.35)}
.liste li::before{content:"";width:30px;height:30px;flex:none;background:center/contain no-repeat}
.liste li:nth-child(1)::before{background-image:var(--i-code-blanc)}
.liste li:nth-child(2)::before{background-image:var(--i-refonte-beige)}
.liste li:nth-child(3)::before{background-image:var(--i-bouclier-blanc)}
.liste li:nth-child(4)::before{background-image:var(--i-bulle-blanc)}
body .liste li:nth-child(2){margin:0 0 0 -30px;padding-left:58px;border-radius:999px;border-color:transparent;background:linear-gradient(90deg,var(--vert-clair),var(--vert));box-shadow:0 14px 34px rgba(20,24,18,.45), inset 0 1px 0 rgba(255,255,255,.2);color:var(--beige)}
.liste li:nth-child(3){border-top-color:transparent}

/* ---------- EN-TÊTE DES PAGES INTÉRIEURES ---------- */
.page-tete{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:660px;padding:calc(var(--barre) + 80px) 28px 110px;text-align:center}
.page-tete::before{content:"";position:absolute;inset:0;z-index:-1;background:
    radial-gradient(ellipse 55% 45% at 50% 50%, rgba(56,51,61,.55), rgba(56,51,61,0) 100%),
    linear-gradient(180deg, rgba(56,51,61,.6) 0%, rgba(56,51,61,.3) 45%, rgba(40,34,30,.85) 100%)}
.page-tete::after{content:"";position:absolute;top:0;bottom:0;left:70%;width:1px;background:rgba(255,255,255,.3)}
.page-tete>:not(.fond){position:relative;z-index:1}
.page-tete-surtitre{font-size:13px;letter-spacing:.22em;text-transform:uppercase;opacity:.85}
body .page-tete-titre{margin-top:26px;font-family:var(--large);font-weight:300;font-size:clamp(40px,5.2vw,80px);line-height:1.04;letter-spacing:-.015em}
.page-tete-titre em{color:var(--beige);font-weight:400}
body .page-tete-texte{margin-top:30px;max-width:52ch;font-size:18px;opacity:.92}

/* ---------- titres de section ---------- */
.titre-section{font-family:var(--large);font-weight:300;font-size:clamp(34px,4.4vw,64px);line-height:1.08;letter-spacing:-.01em;text-align:center}
.titre-section em{color:var(--beige)}
.titre-section.sombre{color:var(--vn)}
.titre-section.sombre em{color:var(--brun)}

/* ---------- SERVICES ---------- */
.services{padding:150px 28px 120px;background:var(--vn)}
body .grille-services{display:grid;grid-template-columns:1.05fr .8fr 1.15fr;gap:28px;margin-top:150px;align-items:stretch}
.service-principal{display:flex;flex-direction:column;align-items:flex-start;gap:22px;padding:44px 40px 40px;border-radius:var(--r);background:var(--beige);color:var(--vn)}
.etiquette{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--brun)}
body .service-principal-titre{margin-top:auto;font-family:var(--large);font-weight:300;font-size:clamp(34px,3.6vw,54px);line-height:1.02;color:var(--brun)}
.service-principal-texte{font-size:17px;max-width:34ch}
body figure.wp-block-image.service-photo{margin:-90px 0 0;min-height:520px;border-radius:var(--r);overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.35)}
.wp-block-image.service-photo img{width:100%;height:100%;object-fit:cover}
.service-liste{display:flex;flex-direction:column}
.service-item{display:grid;grid-template-columns:34px 1fr;column-gap:22px;padding:30px 4px;border-top:1px solid rgba(255,255,255,.22)}
.service-item:last-child{border-bottom:1px solid rgba(255,255,255,.22)}
.service-item::before{content:"";grid-row:1 / 3;width:34px;height:34px;margin-top:2px;background:center/contain no-repeat}
.service-item:nth-child(1)::before{background-image:var(--i-refonte-beige)}
.service-item:nth-child(2)::before{background-image:var(--i-bouclier-beige)}
.service-item:nth-child(3)::before{background-image:var(--i-bulle-beige)}
.service-item:nth-child(4)::before{background-image:var(--i-code-beige)}
body .service-item h3{grid-column:2;margin-bottom:8px;font-family:var(--large);font-weight:300;font-size:22px}
.service-item p{grid-column:2;opacity:.78;font-size:15.5px}
body .bientot{display:flex;align-items:center;justify-content:center;gap:16px;width:fit-content;margin:70px auto 0;padding:10px 26px 10px 10px;border-radius:999px;border:1px solid var(--verre-bord);font-size:15px;opacity:.95}
.bientot strong{padding:8px 16px;border-radius:999px;background:var(--vert);color:var(--beige);font-weight:500;font-size:13px;letter-spacing:.08em;text-transform:uppercase}

/* ---------- DÉTAIL DES PRESTATIONS (page Services) ---------- */
.details{padding:150px 7% 150px;background:var(--beige);color:var(--vn)}
body .details .titre-section{margin-bottom:100px}
.detail{display:grid;grid-template-columns:110px 1fr 1.35fr;gap:40px;padding:56px 0;border-top:1px solid rgba(56,51,61,.2)}
.detail:last-of-type{border-bottom:1px solid rgba(56,51,61,.2)}
.detail-num{padding-top:10px;font-family:var(--large);font-weight:300;font-size:15px;color:var(--brun)}
.detail-titre{font-family:var(--large);font-weight:300;font-size:clamp(28px,3vw,44px);line-height:1.05;color:var(--brun)}
.detail-corps>p{font-size:17px;max-width:54ch}
body .detail-liste{margin-top:24px}
.detail-liste li{position:relative;padding:12px 0 12px 28px;border-top:1px solid rgba(56,51,61,.12);font-size:15.5px}
.detail-liste li::before{content:"";position:absolute;left:0;top:20px;width:10px;height:10px;border-radius:50%;background:var(--vert)}
.details .bientot{border-color:rgba(56,51,61,.22)}

/* ---------- DÉMARCHE ---------- */
.demarche{position:relative;isolation:isolate;overflow:hidden;padding:170px 28px 90px}
.demarche::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg, var(--vn) 0%, rgba(56,51,61,.35) 30%, rgba(56,51,61,.5) 65%, rgba(40,34,30,.9) 100%)}
body .etapes{display:grid;grid-template-columns:repeat(4,1fr);margin-top:220px}
.etape{padding:30px 30px 34px;border-left:1px solid rgba(255,255,255,.3)}
.etape:first-child{border-left:0}
body .etape-num{margin-bottom:44px;font-family:var(--large);font-weight:300;font-size:15px;opacity:.8}
body .etape h3{margin-bottom:12px;font-family:var(--large);font-weight:300;font-size:26px}
.etape-texte{max-width:30ch;font-size:15.5px;opacity:.85}
.etape:nth-child(2){border-radius:var(--r);border-left-color:transparent;background:linear-gradient(160deg,rgba(86,101,79,.92),rgba(60,74,56,.92));box-shadow:0 24px 50px rgba(20,24,18,.45), inset 0 1px 0 rgba(255,255,255,.18);color:var(--beige);transform:translateY(-36px)}
.etape:nth-child(3){border-left-color:transparent}

/* ---------- RÉALISATIONS ---------- */
.realisations{padding:150px 28px;background:var(--beige);color:var(--vn)}
body .grille-realisations{display:grid;grid-template-columns:1.25fr 1fr .8fr;gap:28px;margin-top:80px;align-items:end}
body .realisations>.grille-realisations:first-child{margin-top:0}
.projet{min-height:560px;color:#fff}
.projet:nth-child(2){min-height:460px}
.statut{position:absolute;top:18px;left:18px;z-index:1;padding:9px 16px;border-radius:999px;background:rgba(232,224,210,.9);color:var(--brun);font-size:13px;font-weight:500}
.projet-type{font-size:12px;letter-spacing:.12em;text-transform:uppercase;opacity:.85}
body .projet-titre{margin:2px 0 4px;font-family:var(--large);font-weight:300;font-size:24px;line-height:1.25}
.projet-titre a:hover{text-decoration:underline}
.projet-texte{font-size:14px;opacity:.85}
.projet-vide{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:24px;min-height:400px;padding:36px 32px 32px;border-radius:var(--r);background:var(--vert);color:var(--beige)}
.projet-vide::before,.contact-carte::before{content:"";position:absolute;right:-60px;top:-40px;width:240px;height:220px;background:var(--i-kodaj-voile) center/contain no-repeat}
body .projet-vide h3{position:relative;margin-top:auto;font-family:var(--large);font-weight:300;font-size:clamp(22px,2vw,28px);line-height:1.15}
.projet-vide .wp-block-buttons{position:relative}

/* ---------- STUDIO ---------- */
.studio{display:grid;grid-template-columns:1fr 1.1fr;gap:6%;align-items:center;overflow:hidden;padding:150px 7%;background:var(--vert);color:#fff}
.studio-nom{display:grid;place-items:center}
.disque{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;width:min(460px,80vw);aspect-ratio:1;border-radius:50%;border:1px solid rgba(232,224,210,.3);background:radial-gradient(circle at 35% 25%, rgba(232,224,210,.14), rgba(232,224,210,.03) 70%);box-shadow:0 0 0 46px rgba(232,224,210,.04), 0 0 0 47px rgba(232,224,210,.14)}
.disque::before{content:"";width:120px;height:110px;background:var(--i-kodaj-beige) center/contain no-repeat}
.disque p{text-align:center;font-size:15px;opacity:.9}
.disque strong{font-family:var(--large);font-weight:300;font-size:30px;letter-spacing:.06em}
.studio-texte h2{font-family:var(--large);font-weight:300;font-size:clamp(30px,3.4vw,50px);line-height:1.1}
.studio-texte h2 em{color:var(--beige)}
body .studio-intro{margin:28px 0 40px;max-width:52ch;font-size:18px;opacity:.88}
.engagements li{padding:20px 6px;border-top:1px solid rgba(232,224,210,.28);font-size:17px}
.engagements li:last-child{border-bottom:1px solid rgba(232,224,210,.28)}
body .engagements li:nth-child(2){margin:0 -26px;padding:20px 32px;border-radius:999px;border-color:transparent;background:var(--beige);color:var(--brun);font-weight:500;box-shadow:0 16px 36px rgba(20,24,18,.35)}
.engagements li:nth-child(3){border-top-color:transparent}

/* ---------- CONTACT (appel final) ---------- */
.contact{position:relative;isolation:isolate;overflow:hidden;padding:190px 28px 170px;text-align:center}
.contact::before{content:"";position:absolute;inset:0;z-index:-1;background:
    radial-gradient(ellipse 50% 45% at 50% 42%, rgba(56,51,61,.6), rgba(56,51,61,0) 100%),
    linear-gradient(180deg, rgba(56,51,61,.6), rgba(56,51,61,.35) 45%, rgba(56,51,61,.9))}
.contact-titre{font-family:var(--large);font-weight:300;font-size:clamp(42px,6.4vw,100px);line-height:1.02}
.contact-titre em{color:var(--beige);font-weight:400}
body .contact-texte{margin:30px auto 0;max-width:46ch;font-size:18px;opacity:.9}
body .contact-actions{justify-content:center;gap:34px;margin-top:56px}

/* ---------- CONTACT (page) ---------- */
.contact-detail{display:grid;grid-template-columns:1fr 1.1fr;gap:6%;align-items:stretch;padding:150px 7%;background:var(--beige);color:var(--vn)}
.contact-carte{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:24px;min-height:480px;padding:44px 40px 40px;border-radius:var(--r);background:var(--vert);color:var(--beige)}
.contact-carte>*{position:relative}
body .contact-carte h2{margin-top:auto;font-family:var(--large);font-weight:300;font-size:clamp(28px,2.8vw,40px);line-height:1.1}
.contact-carte p:not(.etiquette){max-width:40ch;opacity:.9}
.contact-carte .etiquette{color:var(--beige);opacity:.8}
.contact-infos h2{font-family:var(--large);font-weight:300;font-size:clamp(26px,2.6vw,38px);line-height:1.12;color:var(--brun)}
body .contact-liste{margin-top:34px}
.contact-liste li{padding:18px 6px;border-top:1px solid rgba(56,51,61,.2);font-size:17px}
.contact-liste li:last-child{border-bottom:1px solid rgba(56,51,61,.2)}
body .contact-note{margin-top:28px;font-size:15px;color:var(--brun)}

/* ---------- TEXTE (mentions légales) ---------- */
.texte-page{padding:120px 28px 150px;background:var(--beige);color:var(--vn)}
body .texte-page>*{max-width:760px;margin-left:auto;margin-right:auto}
body .texte-page h2{margin-top:56px;margin-bottom:14px;font-family:var(--large);font-weight:300;font-size:26px;line-height:1.2;color:var(--brun)}
body .texte-page h2:first-child{margin-top:0}
body .texte-page p{margin-bottom:12px;font-size:17px}
body .texte-page p:last-child{margin-bottom:0}
.texte-page a{text-decoration:underline}

/* ---------- PIED (template part) ---------- */
.pied{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:30px;padding:46px 28px;background:var(--vn);font-size:14.5px;color:#fff}
.pied .wp-block-navigation{font-size:14.5px}
.pied .wp-block-navigation__container{display:flex;gap:30px}
.pied .wp-block-navigation-item__content{opacity:.8}
.pied .wp-block-navigation-item__content:hover{opacity:1}
.pied-mention{text-align:right;opacity:.7;line-height:1.7}
.pied-mention a:hover{text-decoration:underline}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* ---------- ÉCRANS MOYENS ---------- */
@media (max-width:1100px){
  .reseaux,.heros::after,.page-tete::after{display:none}
  .heros{min-height:auto;padding-bottom:30px}
  body .accroche-bouton{position:relative;left:auto;top:auto;justify-content:center;margin:40px auto 0}
  body .bas{position:relative;left:auto;right:auto;bottom:auto;margin:60px 28px 0;grid-template-columns:1fr 1fr;gap:20px}
  .liste{grid-column:1/-1}
  .grille-services{grid-template-columns:1fr 1fr}
  body figure.wp-block-image.service-photo{margin:0;min-height:380px}
  .service-liste{grid-column:1/-1}
  .grille-realisations{grid-template-columns:1fr 1fr}
  .projet-vide{grid-column:1/-1;min-height:260px}
  .studio,.contact-detail{grid-template-columns:1fr;gap:70px}
  body .etapes{grid-template-columns:1fr 1fr;margin-top:120px;row-gap:20px}
  .etape:nth-child(2){transform:none}
  .etape:nth-child(3){border-left:0}
  .detail{grid-template-columns:70px 1fr;gap:24px}
  .detail-corps{grid-column:2}
  .barre nav.wp-block-navigation.menu{margin-left:8px}
  .wp-block-navigation.menu .wp-block-navigation-item__content{padding:10px 15px;font-size:14px}
}
@media (max-width:960px){
  .barre .barre-cta{display:none}
}
@media (max-width:760px){
  .marque a{display:none}
  .barre nav.wp-block-navigation.menu{margin-left:auto}
}

/* ---------- TÉLÉPHONE ---------- */
@media (max-width:640px){
  .barre{padding:0 16px}
  .marque a{display:block}
  body .accroche{width:auto;margin:50px 16px 0}
  body .accroche-texte{margin-top:22px}
  .wp-block-button.rond{width:168px;height:168px}
  .wp-block-button.rond .wp-block-button__link{width:120px;height:120px;font-size:15px}
  body .bas{margin:50px 16px 0;grid-template-columns:1fr}
  .carte-claire{min-height:260px}
  body .liste li:nth-child(2){margin-left:0;padding-left:28px}
  .services,.realisations{padding:100px 16px}
  body .grille-services,body .grille-realisations{grid-template-columns:1fr;margin-top:50px}
  .service-principal{padding:34px 26px}
  body figure.wp-block-image.service-photo{min-height:300px}
  .projet,.projet:nth-child(2){min-height:420px}
  body .bientot{flex-direction:column;border-radius:var(--r);padding:16px;text-align:center}
  .demarche{padding:110px 16px 60px}
  body .etapes{grid-template-columns:1fr;margin-top:70px}
  .etape{border-left:0;border-top:1px solid rgba(255,255,255,.3);padding:26px 22px}
  .etape:nth-child(3){border-top-color:transparent}
  body .etape-num{margin-bottom:18px}
  .studio,.details,.contact-detail{padding:100px 16px}
  body .engagements li:nth-child(2){margin:0 -10px;padding:18px 20px;border-radius:22px}
  .contact{padding:120px 16px}
  .wp-block-button.pilule-blanche.grande .wp-block-button__link{font-size:15px;padding:18px 22px}
  .page-tete{min-height:520px;padding:calc(var(--barre) + 50px) 16px 80px}
  .detail{grid-template-columns:1fr;gap:14px;padding:40px 0}
  .detail-corps{grid-column:auto}
  .contact-carte{padding:34px 26px;min-height:380px}
  .texte-page{padding:80px 16px 100px}
  .pied{grid-template-columns:1fr;text-align:left;padding:40px 16px}
  .pied .wp-block-navigation__container{flex-wrap:wrap;gap:14px 24px}
  .pied-mention{text-align:left}
}
