/* ═════════════════════════════════════════════════════════════
   polish.css — La Pousterle de Sabran
   Couche de raffinement additive (non-destructive).
   Charge APRES common.css et APRES le <style> inline de la page.
   N'altere aucune couleur, texte, ou layout — purement perceptuel :
   easings, hovers, ombres chaudes, grain, ornements, transitions.
   Respecte prefers-reduced-motion.
   ═════════════════════════════════════════════════════════════ */

/* ── 1. Defaults generaux : easings plus lents, smooth scroll ── */
html{scroll-behavior:smooth}

/* Easings "Slow Provence" — courbe lente, fin respirante */
:root{
  --ease-slow: cubic-bezier(.22,.61,.36,1);
  --ease-linger: cubic-bezier(.16,.84,.24,1);
  --shadow-warm-sm: 0 2px 6px rgba(70,50,30,.06), 0 1px 2px rgba(70,50,30,.04);
  --shadow-warm-md: 0 6px 20px rgba(70,50,30,.08), 0 2px 6px rgba(70,50,30,.05);
  --shadow-warm-lg: 0 18px 48px rgba(70,50,30,.12), 0 6px 16px rgba(70,50,30,.06);
  --shadow-gold-glow: 0 0 0 1px rgba(201,169,110,.25), 0 8px 24px rgba(201,169,110,.22);
}

/* ── 2. Accessibilite : respect de prefers-reduced-motion ── */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .pl-reveal,[data-reveal]{opacity:1 !important;transform:none !important;transition:none !important}
  .pl-kenburns,.pl-shimmer::before{animation:none !important}
}

/* ── 3. Revelations au scroll (IntersectionObserver via polish.js) ── */
[data-reveal]{opacity:0;transform:translate3d(0,22px,0);transition:opacity 1.1s var(--ease-linger),transform 1.1s var(--ease-linger);will-change:opacity,transform}
[data-reveal="left"]{transform:translate3d(-28px,0,0)}
[data-reveal="right"]{transform:translate3d(28px,0,0)}
[data-reveal="scale"]{transform:scale(.96);transform-origin:center}
[data-reveal].is-in{opacity:1;transform:none}

/* ── 4. Images : hover fluide, transitions longues, overlay doux ── */
.u-card-soft img,
.ev-card img,
.xp-bloc img,
.log-card img,
[data-polish="img-zoom"]{overflow:hidden}

.u-card-soft,.ev-card,.xp-bloc,.log-card{overflow:hidden}

.u-card-soft img,.ev-card img,.xp-bloc img,.log-card img{
  transition: transform 1.4s var(--ease-slow), filter .8s var(--ease-slow), opacity 1.2s var(--ease-linger) !important;
  will-change: transform;
}
.u-card-soft:hover img,.ev-card:hover img,.xp-bloc:hover img,.log-card:hover img{
  transform: scale(1.045);
  filter: brightness(1.03) saturate(1.05);
}

/* ── 5. Cartes : elevation chaude au hover (override .u-card-soft) ── */
.u-card-soft{transition:transform .6s var(--ease-slow),box-shadow .6s var(--ease-slow) !important;box-shadow:var(--shadow-warm-sm)}
.u-card-soft:hover{transform:translateY(-4px) !important;box-shadow:var(--shadow-warm-lg) !important}

.ev-card,.xp-bloc,.log-card,.avis-card{transition:transform .7s var(--ease-slow),box-shadow .7s var(--ease-slow)}
.ev-card:hover,.xp-bloc:hover,.log-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-warm-md)}

/* ── 6. Liens : soulignement anime en or (sous-titres de paragraphe) ── */
.pl-link,
article a:not(.btn):not(.nav-cta):not(.mob-footer-cta):not(.nav-tel):not([class*="footer"]):not([class*="cb-"]){
  position:relative;
  text-decoration:none;
  background-image:linear-gradient(var(--or,#C9A96E),var(--or,#C9A96E));
  background-size:0% 1px;
  background-repeat:no-repeat;
  background-position:0 100%;
  transition:background-size .55s var(--ease-slow),color .3s;
  padding-bottom:1px;
}
.pl-link:hover,
article a:not(.btn):not(.nav-cta):not(.mob-footer-cta):not(.nav-tel):not([class*="footer"]):not([class*="cb-"]):hover{
  background-size:100% 1px;
  color:inherit;
}

/* ── 7. Boutons CTA dores : shimmer subtil + lift ── */
.nav-cta,
.mob-footer-cta,
a[href^="mailto"].btn,
button.btn,
a.btn,
.cta-primary,
[data-polish="cta"]{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  transition:transform .5s var(--ease-slow),box-shadow .5s var(--ease-slow),filter .5s var(--ease-slow);
}
.nav-cta::before,
.mob-footer-cta::before,
a.btn::before,
button.btn::before,
.cta-primary::before,
[data-polish="cta"]::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.28) 50%,transparent 70%);
  transform:translateX(-120%);
  transition:transform 1.1s var(--ease-linger);
  pointer-events:none;
  z-index:1;
}
.nav-cta:hover::before,
.mob-footer-cta:hover::before,
a.btn:hover::before,
button.btn:hover::before,
.cta-primary:hover::before,
[data-polish="cta"]:hover::before{
  transform:translateX(120%);
}
.nav-cta:hover,
.mob-footer-cta:hover,
a.btn:hover,
button.btn:hover,
.cta-primary:hover,
[data-polish="cta"]:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-warm-md);
}

/* ── 8. Titres : ornement dore optionnel (opt-in via classe) ── */
.pl-ornament{position:relative;display:inline-block}
.pl-ornament::after{
  content:"";
  display:block;
  margin:.9rem auto 0;
  width:44px;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--or,#C9A96E) 30%,var(--or,#C9A96E) 70%,transparent);
}
.pl-ornament-center{text-align:center}
.pl-ornament-center::after{margin-left:auto;margin-right:auto}

/* ── 9. Hero : Ken Burns tres lent (opt-in via .pl-kenburns) ── */
.pl-kenburns{animation:pl-kb 26s var(--ease-linger) infinite alternate;transform-origin:center center}
@keyframes pl-kb{
  from{transform:scale(1.03) translate3d(0,0,0)}
  to{transform:scale(1.1) translate3d(-1.5%,-1%,0)}
}

/* ── 10. Grain chaud sur sections sombres (opt-in via .pl-grain) ── */
.pl-grain{position:relative}
.pl-grain::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.045;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .4 0 0 0 0 .3 0 0 0 0 .2 0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  z-index:1;
}

/* ── 11. Section dividers : hairline + point dore (opt-in) ── */
.pl-divider{display:flex;align-items:center;justify-content:center;gap:12px;margin:2rem auto;max-width:220px;opacity:.55}
.pl-divider::before,.pl-divider::after{content:"";flex:1;height:1px;background:currentColor}
.pl-divider::before{background:linear-gradient(90deg,transparent,currentColor)}
.pl-divider::after{background:linear-gradient(90deg,currentColor,transparent)}
.pl-divider-dot{width:5px;height:5px;border-radius:50%;background:var(--or,#C9A96E);flex-shrink:0}

/* ── 12. Focus raffine (override common.css ring plus doux) ── */
:is(a,button,[role="button"]):focus-visible{
  outline:none !important;
  box-shadow:0 0 0 2px var(--blanc,#FFF),0 0 0 4px var(--or,#C9A96E);
  border-radius:6px;
  transition:box-shadow .2s;
}

/* ── 13. Nav : transition plus elegante au scroll (opt-in via body.scrolled) ── */
.nav{transition:background .4s var(--ease-slow),box-shadow .4s var(--ease-slow),backdrop-filter .4s}
body.pl-scrolled .nav{background:rgba(253,251,247,.88) !important;box-shadow:0 4px 28px rgba(70,50,30,.08) !important}

/* ── 14. Images : fade-in au chargement (lazy) ── */
img[loading="lazy"]{opacity:0;transition:opacity 1.2s var(--ease-linger)}
img[loading="lazy"].pl-loaded,
img[loading="lazy"].loaded{opacity:1}

/* ── 15. Selection text : palette "provence" ── */
::selection{background:var(--or,#C9A96E);color:#1A1814}
::-moz-selection{background:var(--or,#C9A96E);color:#1A1814}

/* ── 16. FAQ : animation ouverture plus douce ── */
.faq-a{overflow:hidden;max-height:0;transition:max-height .6s var(--ease-slow),padding-top .4s var(--ease-slow);display:block !important;padding-top:0}
.faq-a.open,.faq-item.open .faq-a{max-height:1200px;padding-top:.8rem}
.faq-q::after{transition:transform .5s var(--ease-slow)}
.faq-q[aria-expanded="true"]::after{transform:rotate(180deg)}

/* ── 17. Breadcrumb : hover plus doux ── */
.breadcrumb a{transition:color .3s var(--ease-slow),opacity .3s}
.breadcrumb a:hover{opacity:1}

/* ── 18. Petit parallax "float" pour elements decoratifs (opt-in) ── */
.pl-float{animation:pl-float 7s var(--ease-linger) infinite alternate}
@keyframes pl-float{from{transform:translateY(0)}to{transform:translateY(-8px)}}

/* ── 19. Bords arrondis plus organiques sur cartes (opt-in via data attr) ── */
[data-polish="soft-radius"]{border-radius:14px;overflow:hidden}

/* ── 20. Texte : largeur de lecture confortable pour articles ── */
article p,.blog-content p{max-width:68ch}

/* ── Fin polish.css ─────────────────────────────────────────── */