/* NewTouch · peaufinage V7 : l'âme visuelle de l'ancien NewTouch (noir chaud, ivoire, rouge brique, grandes typographies)
   posée sur le moteur V6. S'ajoute à nt.css et nt-v6.css sans les modifier. */

/* ---------- Palette : noir chaud, ivoire, rouge NewTouch ---------- */
:root{
  --noir:#121110; --noir-g:#1B1917; --anthracite:#2A2622; --ivoire:#F7F0E8; --ivoire-2:#EFE6DA;
  --blanc-2:#FBF8F4; --gris-1:#F4EEE6; --gris-2:#E5DDD2; --gris-m:#7A736B; --texte-2:#5E5750; --texte-sombre:#CFC6BB;
  --rouge:#C13A2B; --rouge-l:#D9503B;
}
body{background:var(--blanc-2)}

/* ---------- Logo bicolore : New (encre ou ivoire) · Touch. (rouge) ---------- */
.logo{letter-spacing:.005em}
.logo i{font-style:normal;color:var(--rouge)}
.entete.sombre .logo{color:var(--ivoire)}
.entete.sombre .logo i{color:var(--rouge-l)}
.entete{background:rgba(251,248,244,.9);border-color:var(--gris-2)}
.entete.sombre{background:rgba(18,17,16,.82)}
.pied .logo i{color:var(--rouge-l)}

/* ---------- Apparition du nom, à la fin de l'ouverture lumineuse ---------- */
.titre-zone{position:relative}
.sig-nt{position:absolute;left:0;top:50%;transform:translateY(-50%);font-family:var(--serif);font-size:clamp(64px,9vw,150px);line-height:1;letter-spacing:.02em;white-space:nowrap;opacity:0;pointer-events:none}
.sig-nt i{font-style:normal;color:var(--rouge-l)}
.sig-en-cours #titre{opacity:0}
@media (max-width:900px){.sig-nt{font-size:clamp(52px,15vw,84px)}}

/* ---------- Accueil « cine » : le film devient la matière de la page ---------- */
.ambiance{display:none}
[data-accueil="cine"] .accueil{position:relative;overflow:hidden;background:var(--noir);color:var(--ivoire);min-height:min(100svh,980px);display:flex;align-items:center}
[data-accueil="cine"] .accueil>.wrap{position:relative;z-index:2}
/* lumière du film : une vignette minuscule du plan en cours, agrandie et floutée derrière toute la section */
[data-accueil="cine"] .ambiance{display:block;position:absolute;inset:-8%;width:116%;height:116%;z-index:0;filter:blur(38px) saturate(1.15);opacity:.62;transition:opacity .6s}
[data-accueil="cine"] .accueil:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(120% 90% at 78% 40%,transparent 0,rgba(18,17,16,.35) 45%,rgba(18,17,16,.9) 100%),linear-gradient(180deg,rgba(18,17,16,.2),rgba(18,17,16,.05) 60%,var(--noir) 100%)}
[data-accueil="cine"] .accueil h1{color:var(--ivoire);font-size:clamp(52px,7vw,116px);max-width:10ch}
[data-accueil="cine"] .accueil em{color:var(--rouge-l)}
[data-accueil="cine"] .accueil .idx{color:#B8AEA2}[data-accueil="cine"] .accueil .idx b{color:var(--rouge-l)}
[data-accueil="cine"] .liens-services a{background:rgba(247,240,232,.08);color:var(--ivoire);border:1px solid rgba(247,240,232,.16);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
[data-accueil="cine"] .liens-services a:hover{background:var(--rouge);border-color:var(--rouge);color:#fff}
[data-accueil="cine"] .accueil .btn-k{background:var(--ivoire);color:var(--noir)}[data-accueil="cine"] .accueil .btn-k:hover{background:var(--rouge);color:#fff}
[data-accueil="cine"] .accueil .btn-l{background:transparent;color:var(--ivoire);border-color:rgba(247,240,232,.3)}[data-accueil="cine"] .accueil .btn-l:hover{border-color:var(--ivoire)}
/* l'écran n'est plus un cadre posé sur la page : bords fondus, pas d'ombre portée */
[data-accueil="cine"] .reel{box-shadow:0 40px 120px -40px rgba(0,0,0,.9),0 0 0 1px rgba(247,240,232,.06);border-radius:3px}
[data-accueil="cine"] .reel:before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(18,17,16,.35),transparent 22%,transparent 62%,rgba(18,17,16,.75))}
[data-accueil="cine"] .chips button{border-color:rgba(247,240,232,.16);color:#B8AEA2}
[data-accueil="cine"] .chips button.on{background:var(--ivoire);color:var(--noir);border-color:var(--ivoire)}
[data-accueil="cine"] .preuve{background:rgba(247,240,232,.06);border:1px solid rgba(247,240,232,.12);color:var(--texte-sombre);padding:12px 14px}
[data-accueil="cine"] .preuve b{color:var(--ivoire)}[data-accueil="cine"] .preuve button{color:var(--rouge-l)}
/* 12 univers : la barre de progression suffit, les pastilles chargeaient la composition */
[data-accueil="cine"] .chips{display:none}
@media (max-width:900px){
  /* téléphone : le plan vertical occupe tout l'écran, le texte se pose dessus */
  [data-accueil="cine"] .accueil{min-height:100svh;align-items:flex-end;padding:0}
  [data-accueil="cine"] .accueil>.wrap{position:static;display:block;padding-bottom:22px}
  [data-accueil="cine"] .accueil>.wrap>div:first-child{position:relative;z-index:2;width:100%}
  [data-accueil="cine"] .accueil>.wrap>div:last-child{position:absolute;inset:0;z-index:0}
  [data-accueil="cine"] .reel{position:absolute;inset:0;max-height:none;height:100%;aspect-ratio:auto;border-radius:0;box-shadow:none}
  [data-accueil="cine"] .reel:before{background:linear-gradient(180deg,rgba(18,17,16,.55),transparent 22%,transparent 38%,rgba(18,17,16,.92) 74%,var(--noir))}
  [data-accueil="cine"] .reel-lien{top:calc(var(--entete) + 30px);bottom:auto;font-size:15px;font-family:var(--sans)}
  [data-accueil="cine"] .reel-lien span{display:inline;margin-left:8px}
  [data-accueil="cine"] .reel .bars{top:calc(var(--entete) + 12px)}
  [data-accueil="cine"] .reel .pp{bottom:auto;top:calc(var(--entete) + 22px)}
  [data-accueil="cine"] .chips{display:none}
  [data-accueil="cine"] .ambiance{display:none}
  [data-accueil="cine"] .accueil h1{font-size:clamp(42px,12vw,60px)}
  [data-accueil="cine"] .m-acts{display:none}
  [data-accueil="cine"] .accueil .acts{display:flex;margin-top:16px}[data-accueil="cine"] .accueil .acts .btn{flex:1}
  [data-accueil="cine"] .liens-services{margin-top:4px}
}

/* ---------- Showreel : un étalonnage commun, des plans qui respirent ---------- */
.reel-v{filter:contrast(1.05) saturate(.94) sepia(.06)}
.reel-v.on{animation:respire 2.4s linear both}
@keyframes respire{from{transform:scale(1.045)}to{transform:scale(1)}}
:root{--fondu:420ms}
@media (prefers-reduced-motion:reduce){.reel-v.on{animation:none}}

/* ---------- Film signature (Bercy) ---------- */
.preuve{border-radius:6px}
.preuve .sig{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--rouge-l);margin-bottom:2px}

/* ---------- Cartes : une table de cinéma, plus grande et plus profonde ---------- */
.travaux{background:linear-gradient(var(--ivoire),var(--gris-1) 60%,var(--gris-1))}
[data-accueil="cine"] .travaux{background:linear-gradient(var(--noir) 0,var(--anthracite) 26px,var(--ivoire-2) 96px,var(--ivoire) 160px,var(--gris-1) 70%);padding-top:clamp(96px,9vw,140px)}
[data-accueil="cine"] .travaux .t-tete{color:var(--encre)}
.table{height:clamp(560px,56vw,820px);perspective:1500px}
.plateau:before{border-color:rgba(37,34,30,.12);background-image:linear-gradient(rgba(37,34,30,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(37,34,30,.05) 1px,transparent 1px)}
.carte{border-width:5px;box-shadow:0 1px 2px rgba(0,0,0,.2),0 14px 30px -10px rgba(0,0,0,.35)}
.carte.principale{border-width:6px}
.carte.principale .ci b{font-size:clamp(26px,2.6vw,44px)}
.carte .ci small{color:#F1E6D8}
.ombre{background:rgba(18,12,8,.38);box-shadow:0 0 40px 14px rgba(18,12,8,.26)}
.carte.joue{outline:3px solid var(--rouge-l);outline-offset:2px}
.table.proposition .plateau:after{content:"Proposition à valider";position:absolute;right:3%;top:5%;font-family:var(--mono);font-size:11px;color:var(--rouge);border:1px dashed var(--rouge);padding:4px 8px;border-radius:3px}
@media (max-width:700px){.table{height:640px}.carte{border-width:3px}}

/* ---------- À l'affiche : galerie bento (sélection d'ouverture) ---------- */
.salle{background:var(--noir)}
.a-tete{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;flex-wrap:wrap;margin:clamp(20px,3vw,40px) 0 22px}
.a-tete h2{font-size:clamp(42px,5.6vw,92px);margin-top:12px}
.a-l{max-width:340px;font-size:15px;color:#B8AEA2}
.bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(150px,15vw,230px);grid-auto-flow:dense;gap:10px;margin-bottom:clamp(48px,7vw,96px)}
.tuile{position:relative;overflow:hidden;border-radius:4px;background:var(--noir-g);text-align:left;color:var(--ivoire);isolation:isolate}
.tuile.h{grid-column:span 2}.tuile.v{grid-row:span 2}
.tuile.grande{grid-column:span 2;grid-row:span 2}
.tuile img,.tuile video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease),opacity .35s}
.tuile video{opacity:0}.tuile video.on{opacity:1}
.tuile:hover img{transform:scale(1.03)}
.tuile:after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(18,17,16,.88));z-index:1;pointer-events:none}
.tuile .tx{position:absolute;z-index:2;left:14px;right:14px;bottom:12px}
.tuile .tx small{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:#D9CFC3}
.tuile .tx small.m{color:var(--rouge-l)}
.tuile .tx b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(20px,1.8vw,30px);line-height:1.04;margin-top:4px}
.tuile.grande .tx b{font-size:clamp(30px,3.4vw,56px)}
.tuile .tx span{display:block;font-size:13px;color:#CFC6BB;margin-top:6px}
.tuile.toute{background:linear-gradient(135deg,var(--rouge) 0,#7A1D14 100%)}.tuile.toute:after{display:none}.tuile.toute .tx small{color:#F7D9D2}.tuile.toute:hover{filter:brightness(1.08)}
.tuile:focus-visible{outline:2px solid var(--rouge-l);outline-offset:3px}
@media (max-width:900px){
  .bento{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:44vw;gap:8px}
  .tuile.grande{grid-column:span 2;grid-row:span 1}
  .tuile.h{grid-column:span 2}
}
/* collection complète : plus compacte sous la sélection */
.h2-c{font-size:clamp(30px,3.2vw,48px)!important}
.fiche .meta .m{background:rgba(217,80,59,.16);color:#F3B7AB}
.fiche .meta .e{opacity:.75}

/* ---------- 3D & architecture : le bâtiment de jour, dans sa rue ---------- */
.studio3d{background:linear-gradient(var(--blanc-2),#E4E2DD 70%);padding-bottom:0}
.s3-d{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.studio3d .s3-l{max-width:440px}
.s3-scene{background:#E4E2DD}
.s3-scene.pret .affiche{opacity:0}
.s3-geste{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:3;display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:999px;background:rgba(18,17,16,.66);border:1px solid rgba(247,240,232,.18);color:var(--ivoire);font-size:14px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:opacity .6s;pointer-events:none}
.s3-geste svg{width:34px;height:17px;color:var(--rouge-l);animation:geste 1.8s var(--ease-io) infinite alternate}
.s3-geste.vu{opacity:0}
@keyframes geste{from{transform:translateX(-5px)}to{transform:translateX(5px)}}
.s3-cmd{position:absolute;right:var(--gutter);bottom:20px;z-index:3;display:flex;gap:6px}
.s3-cmd button{width:44px;height:44px;border-radius:50%;background:rgba(18,17,16,.66);border:1px solid rgba(247,240,232,.2);color:var(--ivoire);font-size:18px}
.s3-cmd button:hover{border-color:var(--rouge-l)}
.s3-cmd .s3-rue{width:auto;height:44px;padding:0 18px;border-radius:999px;font-size:14px}
.s3-cmd .s3-rue[aria-pressed="true"]{background:var(--rouge);border-color:var(--rouge)}
.s3-aide{display:none}
@media (max-width:700px){.s3-geste{bottom:80px;font-size:13px}.s3-etat{display:none}}
@media (prefers-reduced-motion:reduce){.s3-geste svg{animation:none}}

/* ---------- Offres : note de catégorie (3D & architecture) ---------- */
.cat-note{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:18px 20px;border:1px dashed var(--gris-2);border-radius:6px;font-size:14px;color:var(--texte-2)}
.cat-note p{max-width:640px}

/* ---------- Contact : quatre accès ---------- */
.reseaux-v7{display:contents}

/* passages : noir chaud */
.p-clair{background:linear-gradient(var(--noir),var(--anthracite) 35%,var(--gris-2) 80%,var(--blanc-2))}

/* ---------- Bande de chiffres : sobre, une ligne, pas une section ---------- */
.chiffres{background:var(--noir);color:#CFC6BB;border-top:1px solid rgba(247,240,232,.08)}
.chiffres .wrap{display:flex;justify-content:space-between;gap:10px 28px;flex-wrap:wrap;padding-top:14px;padding-bottom:14px;font-family:var(--mono);font-size:12px;letter-spacing:.02em}
.chiffres b{font-family:var(--serif);font-weight:400;font-size:22px;color:var(--ivoire);margin-right:8px;letter-spacing:0;vertical-align:-2px}
.chiffres span:last-child b{color:var(--rouge-l)}
[data-accueil="blanc"] .chiffres{background:var(--ivoire-2);color:var(--texte-2);border:0}
[data-accueil="blanc"] .chiffres b{color:var(--encre)}
@media (max-width:900px){.chiffres .wrap{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px}.chiffres b{font-size:19px;display:block;margin:0 0 2px}}
