/* Drawings from Fabien’s actual sheets mark a few routes through the site. */
:where(a.tp-illustrated, a.tp-chapter-link, a.tp-plain-route, a.tp-edition) {
  box-sizing:border-box;
  -webkit-tap-highlight-color:rgba(53,151,198,.16);
}
.tp-route-arrow {
  display:inline-grid; place-items:center; flex:none;
  font:600 1.1rem/1 system-ui,sans-serif;
}
body main a.tp-illustrated,
.picasso-home main :is(.tp-link,.mission-action).tp-illustrated,
.picasso-home #accueil.hero .hero-content .actions .tp-main-route {
  --route-paper:#fefcf5; --route-ink:#102d42; --route-border:#b4c7cf;
  box-sizing:border-box; display:inline-grid; grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center; gap:.72rem; width:fit-content; max-width:100%;
  min-height:3.35rem; margin:0; padding:.36rem .65rem .36rem .4rem;
  color:var(--route-ink); background:var(--route-paper); border:1px solid var(--route-border);
  border-radius:.55rem; text-decoration:none; text-align:start; letter-spacing:normal;
  font:680 1rem/1.32 system-ui,sans-serif;
}
body main .tp-illustrated .tp-route-art {
  position:relative; display:grid; place-items:center; flex:none; width:3.35rem; height:2.65rem;
}
body main .tp-illustrated .tp-route-art img {
  display:block; position:static; margin:0; width:100%; height:100%; max-height:none; object-fit:contain;
  border:0; border-radius:0; background:none; box-shadow:none;
}
body main a.tp-illustrated .tp-route-arrow {
  width:1.85rem; height:1.85rem; border:1px solid #9fb3bd; border-radius:50%; color:#153e54;
}
.picasso-home #accueil.hero .hero-content .actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.55rem; align-items:stretch; margin-top:1.2rem; }
.picasso-home #accueil.hero .hero-content .actions .tp-main-route {
  grid-column:1/-1; justify-self:start; gap:.85rem; padding:.24rem .73rem .24rem .3rem;
  font-size:clamp(1.05rem,1.4vw,1.22rem); border-color:#e2dfd4;
  box-shadow:0 3px 0 #a7c9d4;
}
.picasso-home #accueil .tp-main-route .tp-route-art { width:4.35rem; height:3.15rem; }
.picasso-home #accueil .tp-main-route .tp-route-arrow { color:white; background:#b91d37; border-color:#b91d37; margin-left:.15rem; }
.picasso-home #accueil.hero .hero-content .actions .tp-plain-route {
  display:flex; justify-content:space-between; gap:.45rem; align-self:stretch; width:100%;
  box-sizing:border-box; padding:.55rem .65rem; min-height:44px;
  background:transparent; border:1px solid #456277; border-radius:.4rem; text-decoration:none;
  font-size:.9rem; font-weight:580; line-height:1.3;
}
.picasso-home #accueil .tp-plain-route .tp-route-arrow { color:#9bd8ed; }
.picasso-home #accueil a.hero-worlds-link { margin-top:.42rem; }
.picasso-home #responsables .mission-links { align-items:center; gap:.8rem 1.2rem; }
.picasso-home #photos .tp-illustrated { margin-top:1rem; background:#f0f6f8; }
.picasso-home main :is(#reperes,#mission) .tp-chapter-link {
  display:inline-flex; align-items:center; gap:.85rem; min-height:44px; box-sizing:border-box;
  color:#fff; background:#103d56; text-decoration:none; line-height:1.35;
  padding:.65rem .92rem; border-radius:.35rem;
}
body main a.tp-inner-route { margin-block:.4rem; }
body main a.tp-inner-route[href$="golden-25/"] { --route-paper:#242420; --route-ink:#fff3d3; --route-border:#5e5034; }
body main a.tp-inner-route[href$="golden-25/"] .tp-route-art { width:2.55rem; height:2.7rem; }
body main a.tp-inner-route[href$="golden-25/"] .tp-route-arrow {border-color:#b39863;color:#fae5b1;}
/* The signed note introduces the pieces; each complete piece points to its own destination. */
.picasso-home main #creations {
  background:#f2eee5; color:#132c3c; border:0; border-block:1px solid #d0cbbf;
}
#creations .tp-collection-intro {display:grid;grid-template-columns:minmax(14rem,.75fr) minmax(0,1.25fr);gap:clamp(1.6rem,6vw,6rem); align-items:start; margin-bottom:clamp(1.6rem,3vw,2.9rem);}
.picasso-home main #creations h2 {color:#142e3e;font:italic 600 clamp(2.4rem,4.8vw,4.9rem)/1.04 Georgia,serif;letter-spacing:-.05em;text-wrap:balance;margin:0;max-width:13ch;}
#creations .tp-collection-intro blockquote {margin:0;padding:0 0 0 clamp(1rem,2vw,1.65rem);border:0;border-inline-start:2px solid #b4223c;background:none;}
.picasso-home main #creations blockquote p {margin:0;max-width:64ch;color:#243e4e;font:440 clamp(1rem,1.2vw,1.12rem)/1.65 system-ui,sans-serif;}
#creations blockquote cite {display:block;color:#122f43;margin-top:.75rem;font:700 .92rem/1.4 system-ui,sans-serif;}
#creations .tp-collection-links {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.85rem,1.8vw,1.5rem);}
.picasso-home #creations a.tp-edition {
  display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto 1fr;
  min-width:0;align-items:center; gap:0; margin:0;padding:0;overflow:hidden;
  background:#fbfaf6;color:#132f43;border:1px solid #bbc5c6;border-radius:.65rem;
  text-align:start;text-decoration:none;box-shadow:0 2px 0 #152e3e0e; font-family:system-ui,sans-serif;
}
#creations .tp-display {
  grid-column:1/-1; position:relative; display:block; width:100%; aspect-ratio:1.84;
  overflow:hidden;isolation:isolate; border-bottom:1px solid #162c3826;
  background-color:#c5dbe0;background-image:radial-gradient(#345d6d33 .7px,transparent .85px);background-size:7px 7px;
}
#creations .tp-edition-tattoos .tp-display {background-color:#d6cde0;background-image:radial-gradient(#5f537031 .7px,transparent .85px);}
#creations .tp-display img {display:block;position:absolute;max-width:none;object-fit:contain;margin:0;border:0;border-radius:0;}
#creations .tp-piece {
  top:9%;left:11%;height:83%;width:60%;transform:rotate(-8deg);filter:drop-shadow(1px 5px 3px #162e422b);
}
#creations .tp-enlargement {width:39%;height:66%;right:5%;bottom:9%;transform:rotate(7deg);filter:drop-shadow(1px 3px 1px #09273e31);}
#creations .tp-edition-tattoos .tp-piece {left:9%;top:9%;transform:rotate(-5deg);}
#creations .tp-edition-tattoos .tp-enlargement {right:4%;bottom:7%;transform:rotate(-12deg);}
#creations .tp-edition-gold .tp-display {background:radial-gradient(ellipse at 50% 85%,#514535,#282923 52%,#171e20);}
#creations .tp-edition-gold .tp-display::before,#creations .tp-edition-gold .tp-display::after {
  content:"";position:absolute;top:50%;left:50%;width:48%;aspect-ratio:1;border:1px solid #cab17349;border-radius:50%;transform:translate(-50%,-50%);
}
#creations .tp-edition-gold .tp-display::after {width:60%;border-color:#cab1731f;z-index:-1;}
#creations .tp-edition-gold .tp-piece {z-index:1;width:65%;height:84%;left:17.5%;top:8%;transform:rotate(3deg);filter:drop-shadow(2px 5px 6px #0009);}
#creations .tp-edition-info {padding:1.05rem 0 1.1rem 1.15rem;display:grid;align-items:center;gap:.3rem;}
#creations .tp-edition-info strong {color:inherit;font:680 clamp(1.04rem,1.65vw,1.4rem)/1.2 system-ui,sans-serif;letter-spacing:-.027em;}
#creations .tp-edition-action {color:#465c68;font:520 .9rem/1.45 system-ui,sans-serif;}
#creations .tp-edition .tp-route-arrow {margin:0 1rem 0 .5rem;width:2.3rem;height:2.3rem;background:#fff;border:1px solid #a8b5ba;color:#173b4e;border-radius:50%;}
#creations .tp-edition-gold .tp-route-arrow {background:#f0dfb3;border-color:#b9a776;}
:is(.tp-illustrated,.tp-chapter-link,.tp-edition,.tp-plain-route):focus-visible {outline:3px solid #d58b18!important;outline-offset:3px;}
@media (hover:hover) {
  body main a.tp-illustrated:hover,.picasso-home main a.tp-illustrated:hover,.picasso-home #accueil.hero .actions a.tp-main-route:hover{color:#0c2836; background:#e0f1f7;border-color:#6994a8;}
  body main a.tp-inner-route[href$="golden-25/"]:hover {background:#35342b;color:#fff;}
  .picasso-home #accueil.hero .hero-content .actions .tp-plain-route:hover {background:#18384b;color:#fff;border-color:#95bbce;}
  .picasso-home main :is(#mission,#reperes) .tp-chapter-link:hover {background:#195773;}
  #creations a.tp-edition:hover {border-color:#587585;box-shadow:0 3px 12px #172f4221;}
  #creations a.tp-edition:hover .tp-edition-action {text-decoration:underline;text-underline-offset:.25em;}
}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  #creations .tp-display img,.tp-illustrated .tp-route-art img{transition:transform .18s ease;}
  #creations .tp-edition:hover .tp-enlargement{transform:rotate(0deg) translateY(-2px);}
  #creations .tp-edition-gold:hover .tp-piece{transform:rotate(0deg) translateY(-2px);}
  .tp-illustrated:hover .tp-route-art img{transform:rotate(-3deg);}
}
@media(max-width:51rem) {
  #creations .tp-collection-intro {grid-template-columns:1fr;gap:1.1rem;}
  .picasso-home main #creations h2 {max-width:none;}
  #creations .tp-edition-info {padding:.85rem 0 .85rem .75rem;}
  #creations .tp-edition .tp-route-arrow {margin-right:.6rem;width:1.85rem;height:1.85rem;}
}
@media(max-width:40rem) {
  #creations .tp-collection-links {grid-template-columns:1fr;gap:.7rem;}
  .picasso-home #creations a.tp-edition {grid-template-columns:clamp(6.5rem,32%,9rem) minmax(0,1fr) auto;grid-template-rows:1fr;}
  #creations .tp-display {grid-column:1;align-self:stretch;width:100%;height:100%;min-height:6.1rem;aspect-ratio:auto;border:0;border-inline-end:1px solid #162c3826;}
  #creations .tp-edition-info {padding:.85rem 0 .85rem .8rem;}
  #creations .tp-edition .tp-piece {width:75%;left:1%;height:85%;top:7%;}
  #creations .tp-edition .tp-enlargement {width:40%;right:3%;height:56%;bottom:8%;}
  #creations .tp-edition-gold .tp-piece {width:76%;left:12%;height:82%;top:9%;}
}
@media(max-width:24rem){.picasso-home #accueil.hero .hero-content .actions {column-gap:.37rem;}.picasso-home #accueil.hero .hero-content .actions .tp-plain-route{font-size:.86rem;padding:.5rem;gap:.3rem;}}