.tci{container:tci/inline-size;--tci-encre:var(--encre,#0f2e3f);--tci-accent:var(--mag,#d60f6e);--tci-btn:var(--sr-mag,#d60f6e);--tci-btn-hover:var(--sr-encre,#0f2e3f);--tci-bleu:var(--bleu,#2b67a6);--tci-gris:var(--gris,#4a5f6c);--tci-creme:var(--creme,#f7f5ef);--tci-trait:var(--trait,#d6e2ea);--tci-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;--tci-pin:36px;color:var(--tci-encre)}
.tci-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.tci-lab{display:block;font-family:var(--tci-mono);font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;line-height:1.4}
.tci-tete{margin-bottom:42px}
.tci-tete .tci-lab{color:var(--tci-gris);margin-bottom:16px}
.tci-titre{max-width:16ch;margin:0}
.tci-lien-h{display:inline-flex;align-items:center;gap:9px;margin-top:14px;font-weight:700;color:var(--tci-bleu);text-decoration:none}
.tci-lien-h:hover{text-decoration:underline}
.tci-duo{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(250px,1fr);border:2px solid var(--tci-encre);border-radius:18px;overflow:hidden;background:#fff}
.tci-col{display:flex;flex-direction:column;min-width:0}
.tci-scene{container:tci-scene/inline-size;position:relative;background:#e3ebc6;border-right:2px solid var(--tci-encre);overflow:hidden;contain:paint}
.tci-svg{display:block;width:100%;height:100%}
.tci-legende{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;align-content:flex-start;gap:8px 16px;padding:14px 20px;border-top:2px solid var(--tci-encre);border-right:2px solid var(--tci-encre);font-size:.8rem;color:var(--tci-gris);flex:1}
.tci-legende p{margin:0}
.tci-legende summary{cursor:pointer;font-weight:700;color:var(--tci-bleu)}
.tci-legende ol{display:grid;gap:6px;margin:12px 0 0 18px;padding:0}
.tci-legende a{color:inherit}
.tci-volet{background:var(--tci-creme)}
.tci-fiche{padding:24px 24px 26px}
.tci-fiche .tci-lab{color:var(--tci-bleu);margin-bottom:10px}
.tci-n{display:inline-grid;place-items:center;min-width:2.1em;padding:2px 6px;margin-right:6px;border-radius:6px;background:var(--tci-accent);color:#fff;letter-spacing:0}
.tci-fiche-titre{margin:0 0 10px;font-size:1.2rem;line-height:1.2;outline:0}
.tci-texte{color:var(--tci-gris);font-size:.82rem;line-height:1.6}
.tci-texte p{margin:0 0 10px}
.tci-plus:not(#_){display:inline-flex;align-items:center;gap:10px;margin-top:6px;padding:17px 32px;border:0;border-radius:10px;background:var(--tci-btn);color:#fff;font-size:1rem;font-weight:600;line-height:1;letter-spacing:normal;text-transform:none;text-decoration:none;box-shadow:none;transition:background-color .18s}
.tci-plus svg{flex:none;transition:transform .25s cubic-bezier(.34,1.56,.64,1)}
.tci-plus:not(#_):hover,.tci-plus:not(#_):focus-visible{background:var(--tci-btn-hover);color:#fff}
.tci-plus:hover svg,.tci-plus:focus-visible svg{transform:translateX(4px)}
.tci-pin{position:absolute;z-index:1;width:var(--tci-pin);height:var(--tci-pin);padding:0;margin:0;border:0;background:none;cursor:pointer;transform:translate(-50%,-50%);-webkit-tap-highlight-color:transparent}
.tci-pin::after{content:"";position:absolute;inset:-8px;border:2px solid var(--tci-accent);border-radius:50%;animation:tci-onde 2.6s ease-out infinite;animation-delay:calc(var(--i)*.37s);pointer-events:none}
.tci-b{position:absolute;inset:0;z-index:2;display:grid;place-items:center;border:3px solid #fff;border-radius:50%;background:var(--tci-accent);color:#fff;font:600 .85rem/1 var(--tci-mono);box-shadow:0 4px 12px rgba(0,0,0,.3);transition:transform .3s cubic-bezier(.34,1.56,.64,1),background-color .2s}
.tci-pin[aria-pressed="true"]{z-index:2}
.tci-pin:hover,.tci-pin:focus-visible{z-index:3}
.tci-pin[aria-pressed="true"] .tci-b{background:var(--tci-encre);transform:scale(1.14)}
.tci-pin[aria-pressed="true"]::after{border-color:var(--tci-encre)}
.tci-pin:focus-visible{outline:0}
.tci-pin:focus-visible .tci-b{outline:3px solid var(--tci-encre);outline-offset:4px}
.tci-et{position:absolute;left:50%;bottom:calc(100% + 10px);z-index:3;padding:6px 12px;border-radius:8px;background:var(--tci-encre);color:#fff;font-size:.78rem;font-weight:600;line-height:1.3;white-space:nowrap;opacity:0;transform:translate(-50%,6px);transition:opacity .2s,transform .25s;pointer-events:none}
.tci-pin--debut .tci-et{left:-6px;transform:translateY(6px)}
.tci-pin--fin .tci-et{left:auto;right:-6px;transform:translateY(6px)}
.tci-pin--bas .tci-et{top:calc(100% + 10px);bottom:auto;transform:translate(-50%,-6px)}
.tci-pin--bas.tci-pin--debut .tci-et,.tci-pin--bas.tci-pin--fin .tci-et{transform:translateY(-6px)}
.tci-pin:focus-visible .tci-et{opacity:1;transform:translate(-50%,0)}
.tci-pin--debut:focus-visible .tci-et,.tci-pin--fin:focus-visible .tci-et{transform:none}
@media (hover:hover){.tci-pin:hover .tci-b{transform:scale(1.16)}.tci-pin:hover .tci-et{opacity:1;transform:translate(-50%,0)}.tci-pin--debut:hover .tci-et,.tci-pin--fin:hover .tci-et{transform:none}}
.tci--js .tci-svg{opacity:0;transform:scale(1.04);transition:opacity .8s ease-out,transform 1.4s cubic-bezier(.2,.7,.2,1)}
.tci--js.is-in .tci-svg{opacity:1;transform:none}
.tci--js .tci-pin{opacity:0;transform:translate(-50%,-50%) scale(.3)}
.tci--js.is-in .tci-pin{opacity:1;transform:translate(-50%,-50%);transition:opacity .35s ease-out,transform .6s cubic-bezier(.34,1.56,.64,1);transition-delay:calc(.45s + var(--i)*.09s)}
.tci-a{transform-box:fill-box}
.tci-vagues{animation:tci-vagues 26s linear infinite}
.tci-pointilles{animation:tci-tiret 5s linear infinite}
.tci-courant{animation:tci-courant 10s linear infinite}
.tci-courant-2{animation-name:tci-courant-2;animation-duration:16s}
.tci-ride{animation:tci-ride 9s linear infinite}
.tci-ride:nth-child(2){animation-delay:-1.8s}
.tci-ride:nth-child(3){animation-delay:-5.4s}
.tci-ride:nth-child(4){animation-delay:-3.6s}
.tci-ride:nth-child(5){animation-delay:-7.2s}
.tci-velo{transform-origin:50% 100%;animation:tci-velo 2.6s ease-in-out infinite alternate}
.tci-navire{opacity:0;animation:tci-sortie 34s linear infinite}
.tci-navire--entree{animation-name:tci-entree;animation-delay:-17s}
.tci-ressac{animation:tci-ressac 7s ease-in-out infinite alternate}
.tci-ressac--2{animation-duration:9s;animation-delay:-3s}
.tci-remous{transform-origin:50% 50%;animation:tci-remous 4.2s ease-in-out infinite}
.tci-touffe{transform-origin:50% 100%;animation:tci-vent 2.6s ease-in-out infinite alternate}
.tci-touffe:nth-child(2n){animation-delay:-.9s;animation-duration:3.1s}
.tci-touffe:nth-child(3n){animation-delay:-1.7s;animation-duration:2.2s}
.tci--js:not(.is-visible) .tci-a,.tci--js:not(.is-visible) .tci-pin::after{animation-play-state:paused}
@keyframes tci-onde{0%{transform:scale(.72);opacity:.9}100%{transform:scale(1.6);opacity:0}}
@keyframes tci-vagues{to{transform:translateX(-140px)}}
@keyframes tci-tiret{to{stroke-dashoffset:-68}}
@keyframes tci-courant{to{stroke-dashoffset:-94}}
@keyframes tci-courant-2{to{stroke-dashoffset:-144}}
@keyframes tci-ride{0%{transform:translateX(-22px);opacity:0}20%,75%{opacity:1}100%{transform:translateX(26px);opacity:0}}
@keyframes tci-velo{from{transform:translateY(0) rotate(-1deg)}to{transform:translateY(-7px) rotate(1deg)}}
@keyframes tci-sortie{0%{transform:translate(1380px,952px);opacity:0}5%,80%{opacity:1}38%{transform:translate(1650px,952px)}54%{transform:translate(1750px,902px)}88%{transform:translate(1900px,692px);opacity:0}100%{transform:translate(1900px,692px);opacity:0}}
@keyframes tci-entree{0%{transform:translate(1920px,662px);opacity:0}8%,80%{opacity:1}41%{transform:translate(1750px,902px)}56%{transform:translate(1650px,952px)}88%{transform:translate(1430px,952px);opacity:0}100%{transform:translate(1430px,952px);opacity:0}}
@keyframes tci-ressac{to{transform:translateX(-8px)}}
@keyframes tci-remous{0%,100%{transform:scale(.6);opacity:.15}50%{transform:scale(1.15);opacity:.6}}
@keyframes tci-vent{from{transform:rotate(-8deg)}to{transform:rotate(8deg)}}
@container tci (max-width:639px){.tci-duo{grid-template-columns:1fr}.tci-scene,.tci-legende{border-right:0}.tci-legende{border-bottom:2px solid var(--tci-encre)}.tci-duo{--tci-pin:32px}.tci-b{font-size:.78rem;border-width:2px}.tci-pin::after{inset:-6px}.tci-fiche{padding:22px 20px}.tci-plus:not(#_){padding:15px 26px}}
@container tci (min-width:640px) and (max-width:820px){.tci-duo{--tci-pin:30px}.tci-b{font-size:.74rem;border-width:2px}.tci-pin::after{inset:-6px}.tci-fiche{padding:20px 18px}.tci-plus:not(#_){padding:14px 22px;font-size:.92rem}}
@container tci-scene (max-width:460px){.tci-communes{display:none}}
@media (prefers-reduced-motion:reduce){.tci .tci-a,.tci .tci-pin::after{animation:none}.tci--js .tci-svg,.tci--js .tci-pin{opacity:1;transition:none}.tci--js .tci-svg{transform:none}.tci--js .tci-pin{transform:translate(-50%,-50%)}.tci-b,.tci-et,.tci-plus svg{transition:none}}