/* Thomas Machicoane V7 — compatibility + identity refinement */
html { min-height: 100%; overflow-x: hidden; overflow-y: auto; }
body { min-height: 100%; overflow-x: hidden; overflow-y: auto; }
body.tm-menu-open { overflow: hidden !important; }
.tm-site { overflow: visible !important; }

/* Restore the lighter handwritten V5 identity and crop out the old Photographer baseline. */
.header-logo {
  width: 210px; height: 76px; overflow: hidden; border: 0; box-shadow: none;
  transform: none; animation: none; display: block;
}
.header-logo img {
  width: 214px; height: auto; max-width: none; transform: translate(-2px,-5px);
  clip-path: inset(0 0 18% 0); object-fit: initial;
}

/* Loader: hand-written mark + frequency/orbit rather than a static framed logo. */
.site-loader {
  display: grid; place-items: center; padding: 24px; overflow: hidden;
  pointer-events: auto; background: var(--petrol-deep);
  transition: opacity .5s ease, transform .75s cubic-bezier(.72,0,.18,1), visibility .75s;
  animation: tmLoaderFailsafe .72s 2.4s cubic-bezier(.72,0,.18,1) forwards;
}
.site-loader.is-loaded { opacity: 0; transform: translateY(-104%); visibility: hidden; pointer-events: none; }
.loader-stage { position: relative; width: min(720px,88vw); aspect-ratio: 16/8.8; display: grid; place-items: center; }
.loader-logo-crop { position: relative; z-index: 3; width: min(490px,72vw); height: min(235px,34vw); overflow: hidden; transform: rotate(-2deg); }
.loader-logo-crop img { width: 100%; height: auto; transform: translateY(-2%); clip-path: inset(0 0 18% 0); }
.loader-orbit { position:absolute; inset: 8% 5%; border:1px solid #f5a62370; border-radius:50%; transform:rotate(-6deg); animation:tmOrbit 1.8s ease-in-out infinite alternate; }
.loader-orbit i { position:absolute; width:8px; height:8px; border-radius:50%; background:var(--coral); }
.loader-orbit i:nth-child(1){left:7%;top:44%}.loader-orbit i:nth-child(2){right:9%;top:27%;background:var(--mint)}.loader-orbit i:nth-child(3){right:23%;bottom:5%;background:var(--amber)}
.loader-frequency { position:absolute; z-index:4; left:8%; right:8%; bottom:15%; height:38px; display:flex; align-items:center; justify-content:center; gap:7px; }
.loader-frequency b { width:3px; height:12px; background:var(--mint); border-radius:4px; animation:tmLoadFreq .55s ease-in-out infinite alternate; }
.loader-frequency b:nth-child(2n){animation-delay:-.2s}.loader-frequency b:nth-child(3n){animation-delay:-.35s}.loader-frequency b:nth-child(4n){animation-delay:-.1s}
.loader-note { position:absolute; z-index:5; font:italic 48px/1 Georgia,serif; color:var(--coral); animation:tmLoaderNote 1.25s cubic-bezier(.2,1.4,.3,1) infinite alternate; }
.loader-note--a { left:8%; top:18%; transform:rotate(-16deg); }.loader-note--b { right:7%; top:12%; color:var(--mint); animation-delay:-.55s; }
.loader-stage small { position:absolute; z-index:5; bottom:5%; left:0; right:0; text-align:center; font-size:8px; letter-spacing:.28em; }
@keyframes tmLoadFreq { to { height:34px; } }
@keyframes tmOrbit { to { transform:rotate(5deg) scale(.985); } }
@keyframes tmLoaderNote { to { transform:translateY(-10px) rotate(8deg) scale(1.12); } }
@keyframes tmLoaderFailsafe { to { opacity:0; transform:translateY(-104%); visibility:hidden; pointer-events:none; } }

/* Hero video — explicit browser-safe behavior. */
.hero-video { transform: translateZ(0); backface-visibility: hidden; }
.hero-section { isolation: isolate; }

/* Actual-photo portrait, with the graphic treatment applied as an overlay rather than redrawing the face. */
.portrait-section { overflow: visible; }
.portrait-stage { isolation: isolate; background:var(--ink); }
.portrait-face { filter: saturate(.78) contrast(1.08); transform-origin:50% 50%; }
.portrait-face--neutral { object-position:center 37%; }
.portrait-face--expression { object-position:center 44%; filter:saturate(.64) contrast(1.13); }
.portrait-print { position:absolute; z-index:3; inset:0; pointer-events:none; opacity:.22; mix-blend-mode:multiply; background-image:radial-gradient(circle at center,#101615 0 1px,transparent 1.25px); background-size:5px 5px; }
.portrait-stage::before { content:""; position:absolute; z-index:2; inset:0; pointer-events:none; background:linear-gradient(125deg,#f5a62318 0 30%,transparent 52%),linear-gradient(0deg,#003b3c50,transparent 58%); mix-blend-mode:screen; }

/* Réunion de famille: official film still, with the verified music credit made central. */
.score-poster--film { min-height:min(680px,70vw); padding:0; background:#101615; box-shadow:18px 18px 0 var(--petrol-deep); }
.score-poster--film > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(.78) contrast(1.04); transform:scale(1.015); transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.score-poster--film:hover > img { transform:scale(1.055); }
.score-film-shade { position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,#00171925,#00171905 42%,#001719dd 100%); }
.score-poster--film .score-poster__top { z-index:3; color:var(--paper); border-color:#fbf5e860; text-shadow:0 1px 9px #000; }
.score-credit-card { position:absolute; z-index:4; left:clamp(18px,4vw,56px); right:clamp(18px,5vw,72px); bottom:clamp(55px,8vw,104px); display:grid; gap:5px; padding:18px 20px; border:1px solid #fbf5e888; background:#001719c8; color:var(--paper); backdrop-filter:blur(3px); }
.score-credit-card em { font:normal 8px/1 Arial,sans-serif; letter-spacing:.28em; color:var(--amber); }
.score-credit-card strong { font:12px/1.2 Arial,sans-serif; letter-spacing:.18em; }
.score-credit-card b { font:italic clamp(31px,4.4vw,70px)/.9 Georgia,serif; font-weight:400; letter-spacing:-.045em; }
.score-film-caption { position:absolute; z-index:4; left:24px; right:24px; bottom:18px; font-size:8px; letter-spacing:.12em; text-transform:uppercase; color:#fbf5e8cc; }

@media (max-width:650px) {
  .header-logo { width:154px; height:58px; }
  .header-logo img { width:158px; transform:translate(-1px,-3px); }
  .loader-stage { width:94vw; }
  .loader-logo-crop { width:76vw; height:38vw; }
  .loader-frequency { bottom:10%; }
  .portrait-section { overflow:hidden; }
  .score-poster--film { min-height:580px; }
  .score-credit-card b { font-size:clamp(30px,11vw,55px); }
}

@media (prefers-reduced-motion: reduce) {
  .loader-orbit,.loader-frequency b,.loader-note { animation:none !important; }
  .site-loader { animation-duration:.01ms; animation-delay:.9s; }
}