.cities{color:#33241a;background-color:#f6f5f2;padding:3rem 0}.cities__grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"head""map""choice";gap:1.5rem;display:grid}.cities__head{grid-area:head}.cities__title{letter-spacing:-.02em;margin:0;font-size:clamp(1.625rem,1.2rem + 1.6vw,2.125rem);font-weight:800;line-height:1.1}.cities__lead{color:#6e5645;margin:.5rem 0 0;font-size:1.0625rem;line-height:1.4}.cities__choice{grid-area:choice}.cities__list{grid-template-rows:repeat(4,auto);grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:column;column-gap:1.5rem;margin:0;padding:0;list-style:none;display:grid}.cities__list>li:nth-child(4n+1){border-top:1px solid #e4d5c0}.cities__link{color:#33241a;border-bottom:1px solid #e4d5c0;align-items:center;gap:.625rem;padding:.875rem .25rem;font-size:1.125rem;font-weight:700;line-height:1.2;text-decoration:none;transition:padding-left .25s cubic-bezier(.2,.8,.2,1),border-color .25s,background-color .25s;display:flex}.cities__mark{flex:none;width:.875rem;height:1.1875rem;transition:transform .25s cubic-bezier(.2,.8,.2,1)}.cities__mark path{fill:#d3a976;transition:fill .25s}.cities__mark circle{fill:#fff}.cities__link:hover,.cities__link.is-active{background-color:#fff;border-bottom-color:#a9793f;padding-left:.75rem}.cities__link:hover .cities__mark,.cities__link.is-active .cities__mark{transform:translateY(-3px)}.cities__link:hover .cities__mark path,.cities__link.is-active .cities__mark path{fill:#33241a}.cities__link:focus-visible,.cities__other:focus-visible{outline-offset:2px;outline:2px solid #33241a}.cities__other{color:#33241a;text-underline-offset:5px;margin-top:1.25rem;font-weight:700;text-decoration:underline 2px #d3a976;transition:text-decoration-color .2s,text-underline-offset .2s;display:inline-block}.cities__other:hover{text-underline-offset:3px;text-decoration-color:#33241a}.cities__sr{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.cities__map{grid-area:map;justify-self:center;width:100%;max-width:21rem;position:relative}.cities__france{width:100%;height:auto;display:block;overflow:visible}.cities__edge{fill:#d3a976}.cities__land{fill:#f3e6cf;stroke:#a9793f;stroke-width:1.25px;stroke-linejoin:round}.cities__pin{width:1.375rem;height:1.875rem;margin:-1.875rem 0 0 -.6875rem;position:absolute}.cities__pin.is-active{z-index:1}.cities__drop,.cities__needle{width:100%;height:100%;display:block}.cities__needle{transform-origin:50% 100%;transition:transform .25s cubic-bezier(.2,.8,.2,1.4);overflow:visible}.cities__needle path{fill:#33241a;stroke:#fbf6ee;stroke-width:1.5px}.cities__needle circle{fill:#fbf6ee;transition:fill .25s}.cities__pin.is-active .cities__needle{transform:scale(1.4)}.cities__pin.is-active .cities__needle circle{fill:#d3a976}.cities__tag{color:#fbf6ee;white-space:nowrap;opacity:0;pointer-events:none;background-color:#33241a;border-radius:.375rem;padding:.1875rem .5rem;font-size:.8125rem;font-weight:700;line-height:1.3;transition:opacity .2s,transform .2s;position:absolute;bottom:calc(100% + 1rem);left:50%;transform:translate(-50%,4px)}.cities__pin.is-active .cities__tag{opacity:1;transform:translate(-50%)}@media (hover:none){.cities__pin{pointer-events:none}}@media (width>=900px){.cities{padding:4rem 0}.cities__grid{grid-template:"head map""choice map"1fr/minmax(0,1fr) minmax(0,25rem);align-items:start;gap:1.5rem 4rem}.cities__map{align-self:center;max-width:none}}@media (prefers-reduced-motion:no-preference){.cities--armed .cities__land{fill-opacity:0;stroke-dasharray:1;stroke-dashoffset:1px}.cities--armed .cities__edge,.cities--armed .cities__drop{opacity:0}.cities--armed.cities--seen .cities__land{animation:1.1s cubic-bezier(.6,0,.3,1) both cities-trace,.5s .7s both cities-fill}.cities--armed.cities--seen .cities__edge{animation:.4s cubic-bezier(.2,.8,.2,1) 1s both cities-thicken}.cities--armed.cities--seen .cities__drop{animation:.55s cubic-bezier(.3,1.5,.5,1) both cities-drop;animation-delay:calc(1.15s + var(--i,0) * 80ms)}}@keyframes cities-trace{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@keyframes cities-fill{0%{fill-opacity:0}to{fill-opacity:1}}@keyframes cities-thicken{0%{opacity:0;transform:translate(0)}to{opacity:1;transform:translateY(7px)}}@keyframes cities-drop{0%{opacity:0;transform:translateY(-1.75rem)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.cities__link,.cities__mark,.cities__mark path,.cities__needle,.cities__tag,.cities__other{transition:none}}