/* CARAVELLI · SCULPTURE MÉDIÉVALE LUXE
   Deux salles existantes, deux œuvres originales. Aucun moteur graphique,
   aucune couche devant le texte, aucune décoration hors récit. */

body:is([data-page="about"],[data-page="savoir-faire"]) .hc-atelier > .container{
  display:grid;
  grid-template-columns:minmax(250px,.72fr) minmax(440px,1.28fr);
  grid-template-areas:
    "eyebrow artwork"
    "title artwork"
    "rule artwork"
    "note artwork";
  column-gap:clamp(42px,6vw,100px);
  align-items:center;
  text-align:left;
}

body:is([data-page="about"],[data-page="savoir-faire"]) .hc-atelier .hc-capitale{
  grid-area:eyebrow;
  align-self:end;
  margin:0 0 12px;
}

body:is([data-page="about"],[data-page="savoir-faire"]) .hc-atelier .hc-eclat{
  grid-area:title;
  max-width:12ch;
  margin:0;
}

body:is([data-page="about"],[data-page="savoir-faire"]) .hc-atelier .hc-filet{
  grid-area:rule;
  width:min(240px,72%);
  margin:34px 0 26px;
}

body:is([data-page="about"],[data-page="savoir-faire"]) .hc-atelier .hc-atelier-note{
  grid-area:note;
  max-width:42ch;
  margin:0;
}

body:is([data-page="about"],[data-page="savoir-faire"]) .cv-medieval-sculpture{
  grid-area:artwork;
  position:relative;
  isolation:isolate;
  min-height:clamp(620px,64vw,780px);
  width:100%;
  margin:0;
  overflow:hidden;
  border:1px solid rgb(232 228 220 / .18);
  border-radius:2px;
  background:
    radial-gradient(72% 68% at 50% 42%,rgb(201 174 124 / .16),transparent 68%),
    linear-gradient(142deg,#070809 0%,#131518 52%,#060708 100%);
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / .09),
    inset 0 -90px 140px rgb(0 0 0 / .36),
    0 38px 90px rgb(0 0 0 / .34);
}

body:is([data-page="about"],[data-page="savoir-faire"]) .cv-medieval-sculpture::before{
  display:block!important;
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  background:
    linear-gradient(90deg,transparent 0 49.92%,rgb(232 228 220 / .12) 50%,transparent 50.08%),
    linear-gradient(180deg,transparent 0 49.92%,rgb(232 228 220 / .08) 50%,transparent 50.08%);
  background-size:100% 100%;
  opacity:.56;
  mix-blend-mode:normal;
  transform:none;
  pointer-events:none;
}

body:is([data-page="about"],[data-page="savoir-faire"]) .cv-medieval-sculpture::after{
  display:block!important;
  content:"";
  position:absolute;
  z-index:3;
  inset:0;
  background:
    linear-gradient(108deg,transparent 24%,rgb(255 248 230 / .12) 42%,transparent 57%),
    linear-gradient(180deg,transparent 62%,rgb(0 0 0 / .26) 100%);
  opacity:.74;
  mix-blend-mode:screen;
  transform:none;
  pointer-events:none;
}

body:is([data-page="about"],[data-page="savoir-faire"]) .cv-medieval-sculpture > img{
  position:absolute;
  z-index:2;
  inset:3% 4% 0;
  display:block;
  width:92%;
  height:97%;
  object-fit:contain;
  object-position:50% 100%;
  filter:
    saturate(.82)
    contrast(1.035)
    drop-shadow(0 32px 30px rgb(0 0 0 / .54));
}

body[data-page="savoir-faire"] .cv-medieval-sculpture--fragment > img{
  inset:5% 3% 3%;
  width:94%;
  height:92%;
  object-position:50% 50%;
}

body:is([data-page="about"],[data-page="savoir-faire"]) .cv-medieval-sculpture > :is(canvas:not(.k3-sculpture-live),.hc-veine2,.hc-sculpture-polish){
  display:none!important;
}

@media (max-width:860px){
  body:is([data-page="about"],[data-page="savoir-faire"]) .hc-atelier > .container{
    grid-template-columns:1fr;
    grid-template-areas:
      "eyebrow"
      "title"
      "artwork"
      "rule"
      "note";
    row-gap:0;
  }

  body:is([data-page="about"],[data-page="savoir-faire"]) .hc-atelier .hc-eclat{
    max-width:15ch;
  }

  body:is([data-page="about"],[data-page="savoir-faire"]) .cv-medieval-sculpture{
    min-height:clamp(500px,130vw,660px);
    margin:clamp(28px,8vw,46px) 0 0;
  }

  body:is([data-page="about"],[data-page="savoir-faire"]) .hc-atelier .hc-filet{
    margin-top:34px;
  }
}

@media (max-width:480px){
  body:is([data-page="about"],[data-page="savoir-faire"]) .cv-medieval-sculpture{
    min-height:510px;
  }

  body:is([data-page="about"],[data-page="savoir-faire"]) .cv-medieval-sculpture > img{
    inset:2% 0 0;
    width:100%;
    height:98%;
  }

  /* Les commandes de son et de visite restent fixes aux angles sur mobile.
     La légende se resserre dans leur axe libre afin qu'aucun mot ne passe
     sous ces commandes, même lors d'un accès direct à l'ancre de la salle. */
  body:is([data-page="about"],[data-page="savoir-faire"]) #sculpture-medievale .hc-atelier-note{
    box-sizing:border-box;
    width:auto;
    max-width:none;
    margin-left:112px!important;
    margin-right:56px!important;
  }
}

@media (prefers-reduced-motion:reduce){
  body:is([data-page="about"],[data-page="savoir-faire"]) .cv-medieval-sculpture,
  body:is([data-page="about"],[data-page="savoir-faire"]) .cv-medieval-sculpture::before,
  body:is([data-page="about"],[data-page="savoir-faire"]) .cv-medieval-sculpture::after,
  body:is([data-page="about"],[data-page="savoir-faire"]) .cv-medieval-sculpture > img{
    animation:none!important;
    transition:none!important;
  }
}

/* Garde-fou de cascade : les couches globales historiques sont chargées
   tardivement par l'orchestrateur. L'identifiant de la salle garantit ici
   que la statuaire reste une image muséale, jamais une dalle claire ou une
   géométrie procédurale superposée. */
body[data-page] #sculpture-medievale{
  color:#f0ede7!important;
  background:
    radial-gradient(88% 62% at 12% 4%,rgb(122 130 134 / .15),transparent 68%),
    linear-gradient(145deg,#292b2d 0%,#0b0c0d 100%)!important;
}

body[data-page] #sculpture-medievale :is(.hc-capitale,.hc-eclat,.hc-atelier-note){
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
  transform:none!important;
}

body[data-page] #sculpture-medievale .hc-eclat{
  color:#f2efe8!important;
  -webkit-text-fill-color:#f2efe8!important;
  background:none!important;
  text-shadow:0 18px 48px rgb(0 0 0 / .36)!important;
}

body[data-page] #sculpture-medievale .hc-capitale{
  color:rgb(224 204 164 / .88)!important;
}

body[data-page] #sculpture-medievale .hc-atelier-note{
  color:rgb(242 239 232 / .92)!important;
}

@media (min-width:861px){
  body[data-page="savoir-faire"] #sculpture-medievale .hc-atelier-note{
    max-width:calc(42ch - 72px);
    margin-left:72px!important;
  }
}

body[data-page] #sculpture-medievale .cv-medieval-sculpture{
  color:#f0ede7!important;
  background:
    radial-gradient(72% 68% at 50% 42%,rgb(201 174 124 / .14),transparent 68%),
    linear-gradient(142deg,#070809 0%,#131518 52%,#060708 100%)!important;
}

body[data-page] #sculpture-medievale .cv-medieval-sculpture::before,
body[data-page] #sculpture-medievale .cv-medieval-sculpture::after,
body[data-page] #sculpture-medievale .cv-medieval-sculpture > :is(canvas:not(.k3-sculpture-live),.hc-veine2,.hc-sculpture-polish){
  display:none!important;
}
