.fes-trame-fig { position: relative; color: var(--bone); }
@media (min-width: 900px) {
  .wip-page .sct-mask-photo.fes-trame-fig {
    position: absolute; top: 0; right: 0; left: 52%;
    width: auto; height: 100%;
    border-radius: 0;
  }
}
.fes-trame { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.fes-trame circle { fill: currentColor; }
.fes-trame .ring { fill: none; stroke: currentColor; stroke-width: 1.4; vector-effect: non-scaling-stroke; }

.fes-planches { padding: var(--wip-gap-3) var(--wip-sec-x) 0; background: var(--bone); color: var(--ink); }
.fes-planches-fig { margin: 0; }
.fes-planches-fig img { display: block; width: 100%; height: auto; border-radius: 12px; }
.fes-planches-fig figcaption { margin-top: 14px; max-width: 62ch; font-size: 0.92rem; line-height: 1.5; opacity: 0.85; }
.fes-planches-k { display: block; font-family: var(--wip-mono); font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 4px; opacity: 0.7; }

.fes-gap { position: relative; height: var(--wip-sec-y); background: var(--bone); }
.fes-calques-fig { margin: var(--wip-gap-3) 0 0; width: 100%; max-width: 680px; }
.fes-calques { display: block; width: 100%; height: auto; overflow: visible; }
.fes-calques path, .fes-calques ellipse, .fes-calques circle, .fes-calques rect { vector-effect: non-scaling-stroke; }
.fes-calques .cal-shadow { transition: opacity 0.3s ease; }
.fes-calques .cal-shadow path { fill: currentColor; opacity: 0.07; stroke: none; }
.fes-calques .cal-sheet { fill: currentColor; fill-opacity: 0.06; stroke: currentColor; stroke-opacity: 0.55; stroke-width: 0.6; }
.fes-calques .cal-grain circle { fill: currentColor; opacity: 0.35; }
.fes-calques .cal-wall { fill: none; stroke: currentColor; stroke-width: 1.2; }
.fes-calques .cal-line { fill: none; stroke: currentColor; stroke-width: 1; }
.fes-calques .cal-ring { fill: none; stroke: currentColor; stroke-width: 0.8; }
.fes-calques .cal-dot { fill: currentColor; }
.fes-calques .cal-path { fill: none; stroke: currentColor; stroke-width: 0.8; stroke-dasharray: 3 2; }
.fes-calques .cal-bar { fill: currentColor; fill-opacity: 0.45; stroke: currentColor; stroke-width: 0.8; }
.fes-calques .cal-fill { fill: currentColor; stroke: none; }
.fes-calques .cal-zone { fill: none; stroke: var(--wip-orange); stroke-width: 0.8; stroke-dasharray: 2 2; transform-box: fill-box; transform-origin: center; }
.fes-calques .cal-src { fill: var(--wip-orange); }
@media (min-width: 1024px) {
  .wip-morph.fes-morph .sct-morph-inner {
    grid-template-columns: minmax(0, 4fr) minmax(0, 6fr);
    grid-template-rows: 1fr auto auto auto 1fr;
    column-gap: clamp(32px, 4vw, 80px);
  }
  .wip-morph.fes-morph .sct-morph-inner > .sct-morph-eyebrow { grid-row: 2; align-self: end; }
  .wip-morph.fes-morph .sct-morph-inner > .sct-morph-title { grid-row: 3; }
  .wip-morph.fes-morph .sct-morph-inner > .sct-morph-sub { grid-row: 4; align-self: start; }
  .wip-morph .sct-morph-inner > .fes-calques-fig {
    grid-column: 2; grid-row: 1 / span 5;
    margin: 0; justify-self: end;
    width: 100%; max-width: min(820px, 104vh);
  }
  .wip-morph.fes-morph { height: calc(240vh + var(--wip-sec-y)); }
  .wip-morph.fes-morph .sct-morph-stage {
    height: calc(100vh + var(--wip-sec-y));
    padding-top: clamp(5rem, 12vh, 9rem);
    padding-bottom: calc(clamp(5rem, 12vh, 9rem) + var(--wip-sec-y));
  }
}

.fes-nuit-head { display: grid; grid-template-columns: 1fr; gap: var(--wip-gap-2); }
.fes-nuit-text .sct-copy + .sct-copy { margin-top: var(--wip-gap-p); }
@media (min-width: 900px) {
  .fes-nuit-head { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: end; }
  .fes-nuit-head > :first-child { grid-column: 1 / span 6; }
  .fes-nuit-text { grid-column: 8 / span 5; }
}
.fes-saison-fig { margin: var(--wip-gap-3) 0 0; color: var(--ink); overflow-x: auto; }
.fes-saison { display: block; width: 100%; min-width: 760px; height: auto; overflow: visible; }
.fes-saison .sa-on { fill: currentColor; }
.fes-saison .sa-off { fill: currentColor; opacity: 0.35; }
.fes-saison text { fill: currentColor; font-family: var(--wip-mono); }
.fes-saison .sa-day, .fes-saison .sa-wk { font-size: 8px; opacity: 0.6; }
.fes-saison .sa-wk { text-anchor: middle; }
.fes-saison .sa-lg { font-size: 9px; letter-spacing: 0.06em; }
.fes-saison .sa-cap { letter-spacing: 0.16em; }
.fes-saison .sa-mute { opacity: 0.6; }
.fes-saison .sa-n { font-family: 'General Sans', sans-serif; font-size: 40px; font-weight: 500; letter-spacing: -0.02em; }

.fes-niveau-fig { margin: var(--wip-gap-2) auto 0; max-width: 460px; color: var(--ink); }
.fes-niveau { display: block; width: 100%; height: auto; }
.fes-niveau .fn-frame { fill: none; stroke: currentColor; stroke-opacity: 0.45; stroke-width: 1; }
.fes-niveau text { fill: currentColor; font-family: var(--wip-mono); }
.fes-niveau .fn-lg { font-size: 9px; letter-spacing: 0.14em; }
.fes-niveau .fn-mute { opacity: 0.55; }
.fes-niveau .fn-main { font-family: 'General Sans', sans-serif; font-size: 64px; font-weight: 500; letter-spacing: -0.03em; }
.fes-niveau .fn-sub { font-family: 'General Sans', sans-serif; font-size: 26px; font-weight: 500; letter-spacing: -0.02em; }
.fes-niveau .fn-arrow { fill: var(--wip-orange); transform-box: fill-box; transform-origin: center; transition: transform 0.35s ease; }
.fes-niveau .fn-arrow.down { transform: rotate(180deg); }