/*
 * CARAVELLI OLYMPE V90 — Signature interactive haute couture
 * Couche d'harmonisation non destructive, sans image ni dépendance externe.
 * Direction : précision éditoriale, lumière minérale, mouvement utile.
 */
:root{
  --cv90-gold:oklch(.8077 calc(var(--ol-c-pat)*.87) var(--ol-h-pat));
  --cv90-gold-hi:oklch(.957 calc(var(--ol-c-pat)*.608) var(--ol-h-pat));
  --cv90-platinum:oklch(.944 calc(var(--ol-c-body)*.109) var(--ol-h));
  --cv90-ink:oklch(.2173 calc(var(--ol-c-body)*.625) var(--ol-h));
  --cv90-bordeaux:oklch(.2886 calc(var(--ol-c-sang)*1.04) var(--ol-h-sang));
  --cv90-bg:oklch(.1717 calc(var(--ol-c-body)*.344) var(--ol-h));
  --cv90-line:oklch(.8503 calc(var(--ol-c-pat)*.622) var(--ol-h-pat) / .24);
  --cv90-glow:oklch(.8278 calc(var(--ol-c-body)*.457) var(--ol-h) / .20);
  --cv90-pointer-x:50vw;
  --cv90-pointer-y:50vh;
  --cv90-progress:0;
  --cv90-ease:cubic-bezier(.22,.78,.18,1);
  --cv90-ease-out:cubic-bezier(.16,1,.3,1);
}
html.cv90-signature{
  color-scheme:dark;
  background:oklch(.1261 calc(var(--ol-c-body)*.136) var(--ol-h));
  text-rendering:geometricPrecision;
  -webkit-font-smoothing:antialiased;
  font-kerning:normal;
}
html.cv90-signature.cv90-branch{
  --cv90-bg:oklch(.1586 calc(var(--ol-c-sang)*.299) calc(var(--ol-h-sang) + -14.6));
  --cv90-ink:oklch(.1899 calc(var(--ol-c-sang)*.572) var(--ol-h-sang));
  --cv90-line:oklch(.8184 calc(var(--ol-c-pat)*1.037) calc(var(--ol-h-pat) + -3.1) / .28);
  --cv90-glow:oklch(.3894 calc(var(--ol-c-sang)*1.375) var(--ol-h-sang) / .27);
}
body.cv90-signature{
  isolation:isolate;
}
body.cv90-signature ::selection{
  color:#111;
  background:var(--cv90-gold-hi);
}

/* Atmosphère réactive, purement CSS. */
.cv90-ambient{
  position:fixed;
  z-index:4;
  inset:0;
  pointer-events:none;
  overflow:hidden;
  opacity:.72;
  contain:strict;
}
.cv90-ambient::before{
  content:"";
  position:absolute;
  inset:-22%;
  background:
    radial-gradient(34rem 28rem at var(--cv90-pointer-x) var(--cv90-pointer-y),oklch(.949 calc(var(--ol-c-body)*.179) var(--ol-h) / .075),transparent 68%),
    radial-gradient(54rem 44rem at 7% 88%,var(--cv90-glow),transparent 72%),
    radial-gradient(42rem 34rem at 94% 8%,oklch(.7148 calc(var(--ol-c-pat)*1.05) calc(var(--ol-h-pat) + -3.6) / .075),transparent 70%);
  filter:blur(12px) saturate(112%);
  transform:translateZ(0);
  transition:opacity .45s ease;
}
html.cv90-branch .cv90-ambient::before{
  background:
    radial-gradient(34rem 28rem at var(--cv90-pointer-x) var(--cv90-pointer-y),oklch(.9335 calc(var(--ol-c-pat)*.77) var(--ol-h-pat) / .075),transparent 68%),
    radial-gradient(56rem 45rem at 3% 86%,oklch(.3484 calc(var(--ol-c-sang)*1.274) var(--ol-h-sang) / .30),transparent 72%),
    radial-gradient(42rem 34rem at 96% 6%,oklch(.6825 calc(var(--ol-c-pat)*1.18) calc(var(--ol-h-pat) + -12.4) / .08),transparent 70%);
}
.cv90-ambient::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.014) 1px,transparent 1px);
  background-size:clamp(72px,8vw,132px) clamp(72px,8vw,132px);
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.45),transparent 68%);
  opacity:.27;
}

/* Cadre architectural périphérique. */
.cv90-frame{
  position:fixed;
  z-index:118;
  inset:10px;
  pointer-events:none;
  border:1px solid oklch(.8695 calc(var(--ol-c-pat)*.431) var(--ol-h-pat) / .11);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.012);
  opacity:0;
  transition:opacity 1.2s var(--cv90-ease);
}
html.cv90-ready .cv90-frame{opacity:1}
.cv90-frame::before,.cv90-frame::after{
  content:"";
  position:absolute;
  width:34px;
  height:34px;
  border-color:oklch(.8836 calc(var(--ol-c-pat)*.688) var(--ol-h-pat) / .42);
  border-style:solid;
}
.cv90-frame::before{left:-1px;top:-1px;border-width:1px 0 0 1px}
.cv90-frame::after{right:-1px;bottom:-1px;border-width:0 1px 1px 0}
.cv90-frame__mark{
  position:absolute;
  /* V923 — le cartouche occupait 28→36 px et l'étiquette de chapitre du rail
     30→48 px : les deux mentions verticales se chevauchaient sur toutes les
     pages, Maison comme Luxury Branch. On les sépare dans la gouttière, en
     serrant le cartouche contre le bord pour que l'ensemble tienne dans les
     53 px disponibles (voir le point d'arrêt plus bas). */
  left:2px;
  top:50%;
  transform:translateY(-50%) rotate(180deg);
  writing-mode:vertical-rl;
  font:500 8px/1 "Instrument Sans",Inter,Arial,sans-serif;
  letter-spacing:.34em;
  text-transform:uppercase;
  color:oklch(.8943 calc(var(--ol-c-pat)*.46) var(--ol-h-pat) / .46);
}

/* Lecture périphérique : progression et chapitre actif. */
.cv90-progress{
  position:fixed;
  z-index:121;
  left:24px;          /* V923 — dégagé du cartouche de Maison, voir ci-dessus.
                         Bord droit du rail : 24 + 1 + 10 + 18 = 53 px. */
  top:50%;
  transform:translateY(-50%);
  display:grid;
  grid-template-columns:1px 18px;
  gap:10px;
  align-items:center;
  pointer-events:none;
  opacity:0;
  transition:opacity .8s ease;
}
html.cv90-ready .cv90-progress{opacity:1}
.cv90-progress__track{
  position:relative;
  width:1px;
  height:min(31vh,280px);
  background:oklch(.8818 calc(var(--ol-c-pat)*.43) var(--ol-h-pat) / .14);
  overflow:hidden;
}
.cv90-progress__fill{
  position:absolute;
  inset:0;
  transform-origin:50% 0;
  transform:scaleY(var(--cv90-progress));
  background:linear-gradient(to bottom,var(--cv90-gold-hi),var(--cv90-gold));
  box-shadow:0 0 15px oklch(.8168 calc(var(--ol-c-pat)*1.077) var(--ol-h-pat) / .52);
}
.cv90-progress__copy{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  width:18px;
}
.cv90-progress__index{
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  font:500 8px/1 "IBM Plex Mono",ui-monospace,monospace;
  letter-spacing:.16em;
  color:oklch(.9002 calc(var(--ol-c-pat)*.619) var(--ol-h-pat) / .72);
}
.cv90-progress__label{
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  max-height:150px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  font:500 7px/1 "Instrument Sans",Inter,Arial,sans-serif;
  letter-spacing:.20em;
  text-transform:uppercase;
  color:oklch(.9442 calc(var(--ol-c-body)*.077) var(--ol-h-pap) / .54);
  transition:opacity .25s ease,transform .4s var(--cv90-ease-out);
}
.cv90-progress.cv90-changing .cv90-progress__label{opacity:0;transform:rotate(180deg) translateY(-5px)}

/* Invitation au défilement : disparaît après le premier mouvement. */
.cv90-scroll-cue{
  position:fixed;
  z-index:116;
  left:clamp(24px,4vw,64px);
  bottom:clamp(22px,4vh,46px);
  display:flex;
  align-items:center;
  gap:12px;
  pointer-events:none;
  opacity:.74;
  transition:opacity .55s ease,transform .7s var(--cv90-ease-out);
}
.cv90-scroll-cue__line{
  position:relative;
  width:54px;
  height:1px;
  overflow:hidden;
  background:oklch(.8978 calc(var(--ol-c-pat)*.637) var(--ol-h-pat) / .22);
}
.cv90-scroll-cue__line::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,transparent,var(--cv90-gold-hi),transparent);
  transform:translateX(-100%);
  animation:cv90-cue 2.8s ease-in-out infinite;
}
.cv90-scroll-cue__text{
  font:500 8px/1 "Instrument Sans",Inter,Arial,sans-serif;
  letter-spacing:.30em;
  text-transform:uppercase;
  color:oklch(.9246 calc(var(--ol-c-pat)*.367) var(--ol-h-pat) / .68);
}
html.cv90-has-scrolled .cv90-scroll-cue{opacity:0;transform:translateY(10px)}
@keyframes cv90-cue{0%,18%{transform:translateX(-110%)}72%,100%{transform:translateX(110%)}}

/* Transition entre pages : deux voiles minéraux, sans image. */
.cv90-transition{
  position:fixed;
  z-index:10050;
  inset:0;
  pointer-events:none;
  display:grid;
  place-items:center;
  visibility:hidden;
}
.cv90-transition__veil{
  position:absolute;
  inset:0;
  transform:scaleY(0);
  transform-origin:50% 100%;
  background:
    radial-gradient(circle at 50% 44%,oklch(.9634 calc(var(--ol-c-pat)*.479) var(--ol-h-pat) / .08),transparent 32%),
    linear-gradient(145deg,oklch(.1431 calc(var(--ol-c-body)*.225) var(--ol-h)) 0%,oklch(.2036 calc(var(--ol-c-body)*.507) var(--ol-h)) 48%,oklch(.1258 calc(var(--ol-c-body)*.196) var(--ol-h)) 100%);
  transition:transform .62s var(--cv90-ease);
}
html.cv90-branch .cv90-transition__veil{
  background:
    radial-gradient(circle at 50% 44%,oklch(.9355 calc(var(--ol-c-pat)*.778) var(--ol-h-pat) / .08),transparent 32%),
    linear-gradient(145deg,oklch(.1367 calc(var(--ol-c-sang)*.269) calc(var(--ol-h-sang) + -17.6)) 0%,oklch(.2687 calc(var(--ol-c-sang)*.909) var(--ol-h-sang)) 52%,oklch(.1192 calc(var(--ol-c-sang)*.265) var(--ol-h-sang)) 100%);
}
.cv90-transition__word{
  position:relative;
  z-index:2;
  overflow:hidden;
  font-family:"Bodoni Moda",Gloock,Didot,serif;
  font-size:clamp(1.5rem,4vw,4.2rem);
  font-weight:500;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:oklch(.9533 calc(var(--ol-c-pat)*.161) var(--ol-h-pat));
  opacity:0;
  transform:translateY(18px);
  transition:opacity .34s ease .12s,transform .56s var(--cv90-ease-out) .08s;
}
.cv90-transition__rule{
  position:absolute;
  left:50%;
  top:calc(50% + clamp(38px,7vw,90px));
  width:min(180px,36vw);
  height:1px;
  transform:translateX(-50%) scaleX(0);
  background:linear-gradient(90deg,transparent,var(--cv90-gold-hi),transparent);
  transition:transform .55s var(--cv90-ease) .18s;
}
html.cv90-is-leaving .cv90-transition{visibility:visible}
html.cv90-is-leaving .cv90-transition__veil{transform:scaleY(1)}
html.cv90-is-leaving .cv90-transition__word{opacity:1;transform:none}
html.cv90-is-leaving .cv90-transition__rule{transform:translateX(-50%) scaleX(1)}

/* Sections, titres et séparateurs : hiérarchie plutôt que surenchère. */
body.cv90-signature main :where(h1,h2,.display,.ph-h1,.hero-title,.property-title){
  font-kerning:normal;
  text-wrap:balance;
}
.cv90-reveal{
  opacity:.001;
  filter:blur(9px);
  translate:0 18px;
  transition:opacity .9s ease,filter 1.15s var(--cv90-ease-out),translate 1.05s var(--cv90-ease-out);
}
.cv90-reveal.cv90-visible{opacity:1;filter:none;translate:0 0}
.cv90-section{
  position:relative;
}
.cv90-section::after{
  content:"";
  position:absolute;
  z-index:0;
  left:clamp(22px,6vw,96px);
  right:clamp(22px,6vw,96px);
  bottom:0;
  height:1px;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--cv90-line) 18%,var(--cv90-line) 82%,transparent);
  transform-origin:0 50%;
  transform:scaleX(.14);
  opacity:.32;
  transition:transform 1.6s var(--cv90-ease-out),opacity .8s ease;
}
.cv90-section.cv90-section-active::after{transform:scaleX(1);opacity:.72}

/* En-têtes : précision vitrée au défilement. */
body.cv90-signature :where(.hd,.site-header,.topbar){
  transition:background-color .55s ease,border-color .55s ease,box-shadow .55s ease,backdrop-filter .55s ease,-webkit-backdrop-filter .55s ease;
}
html.cv90-scrolled body.cv90-signature .hd,
html.cv90-scrolled body.cv90-signature .site-header{
  -webkit-backdrop-filter:blur(18px) saturate(126%);
  backdrop-filter:blur(18px) saturate(126%);
  border-bottom-color:oklch(.8505 calc(var(--ol-c-pat)*.609) var(--ol-h-pat) / .20)!important;
  box-shadow:0 18px 50px rgba(0,0,0,.10);
}
html.cv90-scrolled:not(.cv90-branch) body.cv90-signature .hd{background:oklch(.1565 calc(var(--ol-c-body)*.338) var(--ol-h) / .76)!important}
html.cv90-scrolled.cv90-branch body.cv90-signature .site-header{background:oklch(.1561 calc(var(--ol-c-sang)*.384) var(--ol-h-sang) / .78)!important}

/* Navigation et CTAs : reflet directionnel sobre. */
body.cv90-signature :where(.nl,.desktop-nav>a,.group-home,.po-link,.oc-portale-cta,.ncta){
  background-image:linear-gradient(90deg,transparent,var(--cv90-gold),transparent);
  background-repeat:no-repeat;
  background-position:50% 100%;
  background-size:0 1px;
  transition:background-size .5s var(--cv90-ease-out),color .35s ease,opacity .35s ease,translate .28s var(--cv90-ease-out);
}
body.cv90-signature :where(.nl,.desktop-nav>a,.group-home,.po-link,.oc-portale-cta,.ncta):hover,
body.cv90-signature :where(.nl,.desktop-nav>a,.group-home,.po-link,.oc-portale-cta,.ncta):focus-visible{
  background-size:100% 1px;
}
body.cv90-signature .nl-luxury{
  color:var(--cv90-gold-hi)!important;
  text-shadow:0 0 18px oklch(.7818 calc(var(--ol-c-pat)*1.065) var(--ol-h-pat) / .20);
}
body.cv90-signature :where(a,button,input,select,textarea):focus-visible{
  outline:1px solid var(--cv90-gold-hi)!important;
  outline-offset:5px!important;
}

/* Rail de retour : devient une pièce d'interface signature. */
body.cv90-signature .caravelli-maison-rail{
  box-shadow:-18px 0 52px oklch(.2443 calc(var(--ol-c-sang)*.866) var(--ol-h-sang) / .28),-2px 0 26px oklch(.8113 calc(var(--ol-c-pat)*1.105) var(--ol-h-pat) / .16),inset 1px 0 oklch(.9793 calc(var(--ol-c-pat)*.305) var(--ol-h-pat) / .15);
}
body.cv90-signature .caravelli-maison-rail::before{
  animation:cv90-rail-breath 3.8s ease-in-out infinite;
}
@keyframes cv90-rail-breath{0%,100%{opacity:.58;filter:brightness(.86)}50%{opacity:1;filter:brightness(1.28)}}

/* Effet magnétique non destructif via la propriété translate indépendante. */
.cv90-magnetic{translate:var(--cv90-mx,0) var(--cv90-my,0)}

/* Propriétés et cartes : bord de lumière discret, sans modifier les images. */
html.cv90-branch body.cv90-signature :where(.property-card,.destination-card,.property-hero,.private-office,.po-panel){
  box-shadow:0 0 0 1px oklch(.8327 calc(var(--ol-c-pat)*.91) var(--ol-h-pat) / .05),0 26px 70px oklch(.1349 calc(var(--ol-c-sang)*.4) calc(var(--ol-h-sang) + -13.8) / .10);
}
html.cv90-branch body.cv90-signature :where(.property-card,.destination-card){
  transition:translate .75s var(--cv90-ease-out),box-shadow .75s var(--cv90-ease-out),border-color .55s ease;
}
html.cv90-branch body.cv90-signature :where(.property-card,.destination-card):hover{
  translate:0 -4px;
  box-shadow:0 0 0 1px oklch(.8327 calc(var(--ol-c-pat)*.91) var(--ol-h-pat) / .14),0 34px 88px oklch(.1349 calc(var(--ol-c-sang)*.4) calc(var(--ol-h-sang) + -13.8) / .22);
}

/* V923 — les deux mentions périphériques occupent la bande 12 → 53 px.
   En dessous de 1400 px la gouttière tombe à 51 px sur Luxury Branch et à
   43 px à 1024 : elles empiétaient alors sur la colonne de texte, défaut qui
   existait déjà avant cette version. Elles se retirent donc dès que la
   gouttière ne les porte plus, au lieu de se poser par-dessus le contenu.
   Mesuré : à 1440 la marge la plus étroite du site est de 58 px, soit 5 px
   de dégagement ; à 1280 elle tombe à 51 px, soit 2 px de recouvrement. */
@media (max-width:1399px){
  .cv90-frame__mark,.cv90-progress{display:none}
}

@media (max-width:980px){
  .cv90-frame{inset:7px}
  .cv90-scroll-cue{left:18px;bottom:18px}
}
@media (max-width:760px){
  .cv90-frame{border-color:oklch(.8695 calc(var(--ol-c-pat)*.431) var(--ol-h-pat) / .07)}
  .cv90-scroll-cue{display:none}
  .cv90-ambient{opacity:.52}
  .cv90-section::after{left:18px;right:18px}
}
@media (pointer:coarse){
  .cv90-ambient::before{background-position:center}
}
@media (prefers-reduced-motion:reduce){
  .cv90-scroll-cue__line::after,.caravelli-maison-rail::before{animation:none!important}
  .cv90-reveal{opacity:1!important;filter:none!important;translate:none!important;transition:none!important}
  .cv90-transition{display:none!important}
  .cv90-magnetic{translate:none!important}
  .cv90-section::after{transform:none!important;transition:none!important}
  .cv90-ambient::before{transition:none!important}
}
@media print{
  .cv90-ambient,.cv90-frame,.cv90-progress,.cv90-scroll-cue,.cv90-transition{display:none!important}
}
