/* Lever et coucher du soleil */
.sn { display: flex; flex-direction: column; align-items: center; gap: clamp(10px, 2vh, 22px); text-align: center; width: 100%; }
.sn .sn-q { text-wrap: balance; }
.sn-main { position: relative; width: min(100%, calc(620px * var(--cs, 1))); }
.sn-arc { display: block; width: 100%; height: auto; overflow: visible; }
.sn-day { fill: var(--white); opacity: .13; }
.sn-curve { fill: none; stroke: var(--white); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.sn-curve--dn { stroke-width: 2; opacity: .5; stroke-dasharray: 2 7; }
.sn-hz { stroke: var(--white); stroke-width: 1.5; opacity: .55; vector-effect: non-scaling-stroke; }
.sn-twl { stroke: var(--white); stroke-width: 1; opacity: .3; stroke-dasharray: 3 6; vector-effect: non-scaling-stroke; }
.sn-dot { fill: var(--white); }
.sn-dot.is-down { opacity: .55; }
.sn-big { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-top: -6px; }
.sn-ev { margin: 0; display: flex; flex-direction: column; align-items: flex-start; }
.sn-ev--b { align-items: flex-end; }
.sn-l { font-size: 14px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; opacity: .88; }
.sn-tt { display: inline-flex; align-items: baseline; gap: .2em; }
.sn-t { font-family: var(--f-display); font-weight: 400; font-size: calc(clamp(60px, 8.4vw, 118px) * var(--cs, 1)); line-height: .98; font-variant-numeric: tabular-nums; letter-spacing: .005em; white-space: nowrap; }
.sn-ap { font-size: calc(clamp(18px, 2vw, 26px) * var(--cs, 1)); font-weight: 700; white-space: nowrap; }
.sn-polar { flex: 1; margin: 0; align-self: center; font-family: var(--f-display); font-size: calc(clamp(40px, 5vw, 68px) * var(--cs, 1)); line-height: 1; }
.sn.is-polar .sn-ev { display: none; }
.sn-detail { margin: 0; font-size: clamp(16px, 1.8vw, 21px); font-weight: 500; max-width: 920px; text-wrap: balance; }
.sn-detail + .sn-detail { margin-top: calc(-1 * clamp(4px, 1vh, 12px)); opacity: .9; }
.sn-bar [aria-busy="true"] { opacity: .6; }
@media (max-width: 720px) {
  .sn-bar { position: relative; } /* la pastille glissante se place par rapport à la barre */
  .sn-t { font-size: calc(clamp(48px, 15vw, 72px) * var(--cs, 1)); }
  .sn-l { font-size: 12px; }
}
@media (max-width: 520px) { .sn-bar .bar-sep, .sn-bar [data-sn-today] { display: none; } .sn-bar .chip-btn { padding: 0 13px; } }
.hero.is-fs .sn-bar, .hero.is-fs .sn-q { display: none; }
