/* CDID — Mouvement éditorial, non intrusif / v1.1.
   Toutes les animations sont décoratives, sans dépendance externe. */

/* Un fin repère de lecture, sans modifier la mise en page. */
.cdid-scroll-progress {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1003;
  width: 100%;
  height: 2px;
  transform: scaleX(0);
  transform-origin: left center;
  background: #7b866b;
  pointer-events: none;
}
body.admin-bar .cdid-scroll-progress { top: 32px; }

/* Navigation fixée, mais sans saut d'affichage. */
.cdid-brand-site .cdid-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  transition: box-shadow .35s ease, background-color .35s ease;
  -webkit-backdrop-filter: blur(11px);
  backdrop-filter: blur(11px);
}
body.admin-bar.cdid-brand-site .cdid-header { top: 32px; }
.cdid-brand-site .cdid-header.cdid-header-scrolled {
  background: rgba(251,248,243,.94);
  box-shadow: 0 13px 30px rgba(65,49,33,.1);
}
.cdid-header .cdid-identity:hover .cdid-monogram {
  color: var(--cdid-sage,#59654a);
}
.cdid-header .cdid-monogram { transition: color .25s ease; }

/* Entrée douce, déclenchée seulement quand le JS est fonctionnel. */
html.cdid-motion-on .cdid-reveal {
  opacity: 0;
  transform: translate3d(0,23px,0);
  transition: opacity .75s cubic-bezier(.2,.75,.25,1),
              transform .8s cubic-bezier(.17,.85,.28,1);
  transition-delay: var(--cdid-stagger,0ms);
}
html.cdid-motion-on .cdid-reveal.cdid-revealed {
  opacity: 1;
  transform: translate3d(0,0,0);
}
html.cdid-motion-on .cdid-services-grid > .cdid-reveal.cdid-revealed:hover,
html.cdid-motion-on .cdid-portfolio-grid > .cdid-reveal.cdid-revealed:hover {
  transform: translate3d(0,-5px,0);
}

/* Grand visuel de l'accueil : léger zoom cinématique à l'arrivée. */
html.cdid-motion-on .cdid-home .cdid-hero-columns > .wp-block-column:last-child img {
  animation: cdid-first-picture 2.1s cubic-bezier(.17,.67,.24,1) both;
}
html.cdid-motion-on .cdid-home .cdid-hero-columns > .wp-block-column:first-child h1 {
  animation: cdid-first-title .95s cubic-bezier(.2,.75,.3,1) both;
}
html.cdid-motion-on .cdid-home .cdid-hero-columns > .wp-block-column:first-child > p:not(.cdid-eyebrow) {
  animation: cdid-first-title 1.1s .18s cubic-bezier(.2,.75,.3,1) both;
}
@keyframes cdid-first-picture {
  from { opacity: .85; transform: scale(1.065); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes cdid-first-title {
  from { opacity: 0; transform: translate3d(0,15px,0); }
  to { opacity: 1; transform: translate3d(0,0,0); }
}

/* Prestations : de vraies interactions vers la page de services. */
.cdid-home .cdid-services-grid > .wp-block-column {
  background-color: #f2eee8;
  border: 1px solid rgba(120,100,74,.09);
}
.cdid-home .cdid-services-grid > .wp-block-column::before {
  transition: filter .55s ease, transform .75s ease;
}
.cdid-home .cdid-services-grid > .wp-block-column:hover::before {
  filter: saturate(1.06) brightness(1.035);
}
.cdid-home .cdid-services-grid .cdid-card {
  padding-bottom: 48px !important;
}
.cdid-service-more {
  display: inline-flex;
  align-items: center;
  position: absolute;
  left: 20px;
  bottom: 19px;
  color: #56624a !important;
  text-decoration: none !important;
  font: 600 11px/1.4 'DM Sans',sans-serif;
  letter-spacing: .025em;
  border-bottom: 1px solid rgba(86,98,74,.42);
  padding-bottom: 3px;
  transition: color .2s ease, border-color .2s ease;
}
.cdid-service-more:hover { color: #35472d !important; border-color: #35472d; }
.cdid-service-more:focus-visible { outline: 2px solid #56624a; outline-offset: 4px; }

/* Réalisations : petite invitation discrète à ouvrir l'image. */
.cdid-portfolio-grid figure.wp-block-image { position: relative; }
.cdid-portfolio-grid .cdid-open-photo {
  appearance: none;
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: zoom-in;
  color: transparent;
  font-size: 0;
}
.cdid-portfolio-grid .cdid-open-photo::after {
  content: '↗';
  position: absolute;
  right: 15px;
  bottom: 15px;
  display: grid;
  place-items: center;
  width: 41px;
  height: 41px;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 50%;
  background: rgba(250,247,241,.92);
  color: #4f5c44;
  box-shadow: 0 4px 20px rgba(36,28,19,.12);
  font: 500 22px/1 Georgia,serif;
  opacity: .90;
  transition: transform .25s ease, background .25s ease;
}
.cdid-portfolio-grid .cdid-open-photo:hover::after,
.cdid-portfolio-grid .cdid-open-photo:focus-visible::after {
  transform: translate3d(0,-2px,0);
  background: #fff;
}
.cdid-portfolio-grid .cdid-open-photo:focus-visible {
  outline: 3px solid #5c6a50;
  outline-offset: -4px;
}

/* Visionneuse native <dialog> : navigable au clavier, responsive. */
.cdid-lightbox {
  position: fixed;
  padding: 0;
  width: min(94vw,1100px);
  max-width: 1100px;
  max-height: min(94vh,960px);
  color: #41362d;
  background: #faf7f1;
  border: 1px solid rgba(240,232,221,.5);
  border-radius: 13px;
  box-shadow: 0 24px 90px rgba(0,0,0,.28);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.cdid-lightbox::backdrop {
  background: rgba(29,24,20,.78);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.cdid-lightbox-panel { position:relative;padding:17px 17px 25px; }
.cdid-lightbox-photo {
  display:block;
  width:100%;
  max-height: min(69vh,740px);
  object-fit:contain;
  background:#eee8df;
  border-radius:7px;
}
.cdid-lightbox-close {
  position:absolute;
  z-index:4;
  right:28px;top:28px;
  width:41px;height:41px;
  display:grid;place-items:center;
  color:#453e34;
  background:rgba(252,249,243,.96);
  border:1px solid #e3dbd0;
  border-radius:50%;
  cursor:pointer;
  font:400 30px/1 Georgia,serif;
}
.cdid-lightbox-meta {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:20px;
  padding:16px 12px 0;
}
.cdid-lightbox-title { font:500 clamp(27px,3.2vw,37px)/1 'Cormorant Garamond',Georgia,serif; }
.cdid-lightbox-count { font:600 11px/1 'DM Sans',sans-serif;color:#8c806f;letter-spacing:.1em;white-space:nowrap; }
.cdid-lightbox-note { margin:3px 12px 0;font:400 11px/1.5 'DM Sans',sans-serif;color:#847669; }
.cdid-lightbox-nav { display:flex;gap:7px;justify-content:flex-end;margin:-26px 12px 0; }
.cdid-lightbox-nav button {
  display:grid;place-items:center;
  width:36px;height:36px;
  border:1px solid #d5cbbb;
  border-radius:50%;
  background:#fff;
  color:#55624a;
  cursor:pointer;
  font:400 20px/1 Georgia,serif;
}
.cdid-lightbox button:hover { background:#eae4d9; }
.cdid-lightbox button:focus-visible { outline:3px solid #59654a;outline-offset:3px; }

/* Retour en haut : pas de surcharge sur le parcours utilisateur. */
.cdid-to-top {
  position:fixed;
  right:clamp(14px,3vw,38px);
  bottom:94px;
  z-index:90;
  width:43px;height:43px;
  display:grid;place-items:center;
  padding:0;
  color:#4d5c44;
  background:rgba(251,249,245,.95);
  border:1px solid rgba(92,103,76,.32);
  box-shadow:0 6px 21px rgba(52,39,25,.1);
  border-radius:50%;
  font:400 24px/1 Georgia,serif;
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  pointer-events:none;
  transition:opacity .2s ease,transform .2s ease,visibility .2s;
  cursor:pointer;
}
.cdid-to-top.is-visible { opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto; }
.cdid-to-top:hover { color:#fff;background:#59654a; }
.cdid-to-top:focus-visible {outline:3px solid #59654a;outline-offset:3px;}
@media(max-width:782px) {
  body.admin-bar .cdid-scroll-progress{top:46px;}
  body.admin-bar.cdid-brand-site .cdid-header{top:46px;}
}
@media(max-width:660px) {
  .cdid-to-top {right:13px;bottom:74px;width:38px;height:38px;}
  .cdid-portfolio-grid .cdid-open-photo::after {width:36px;height:36px;right:11px;bottom:11px;}
  .cdid-lightbox {width:96vw;max-height:90vh;}
  .cdid-lightbox-panel {padding:9px 9px 20px;}
  .cdid-lightbox-close {right:18px;top:18px;}
  .cdid-lightbox-meta {padding:12px 8px 0;}
  .cdid-lightbox-note {padding-right:80px;margin-left:8px;}
  .cdid-lightbox-nav {margin-top:-7px;margin-right:8px;}
}
@media(prefers-reduced-motion:reduce) {
  html.cdid-motion-on .cdid-reveal,
  html.cdid-motion-on .cdid-home .cdid-hero-columns img,
  html.cdid-motion-on .cdid-home .cdid-hero-columns h1,
  html.cdid-motion-on .cdid-home .cdid-hero-columns p {
    opacity:1!important;transform:none!important;
    animation:none!important;transition:none!important;
  }
  .cdid-to-top,.cdid-header,.cdid-header .cdid-monogram,
  .cdid-service-more,.cdid-portfolio-grid .cdid-open-photo::after {
    transition:none!important;
  }
}