/* /maps/point/: one point at the full size of the screen, only the button Back (order of 09.10.2026). The words and the
   marks of the dossier are those of the card in the column of a map (maps/atlas.css, .dz); here they stand larger */
html,body.pt-page{margin:0;background:#000;color:var(--ink,#f3f5f8)}
body.pt-page{min-height:100vh;font:400 16px/1.5 "IBM Plex Sans",sans-serif;-webkit-font-smoothing:antialiased}
.pt-back{position:fixed;z-index:5;top:clamp(16px,2.6vh,28px);left:clamp(16px,2.6vw,44px);display:block;min-width:140px;padding:11px 18px;text-align:center;
  border:1px solid var(--rule,#2a1a1a);border-radius:4px;background:rgba(8,8,8,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;text-decoration:none;
  font:600 13px/1.2 var(--font-map);letter-spacing:.2em;text-indent:.2em;text-transform:uppercase;transition:border-color .25s,color .25s,box-shadow .25s}
.pt-back:hover,.pt-back:focus-visible{border-color:var(--red);color:var(--red);box-shadow:0 0 18px rgba(255,45,45,.35);outline:0}
.pt-none{margin:0;padding:40vh 16px 0;text-align:center;font:600 14px/1.4 var(--font-map);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3)}

/* the top: the photo of the place across the screen, dark under the words; without a photo the words stand on black */
.dz-page .dz-hero{position:relative;display:flex;align-items:flex-end;min-height:clamp(320px,58vh,640px);overflow:hidden;
  background:radial-gradient(900px 420px at 50% 100%,color-mix(in srgb,var(--dz) 14%,transparent),transparent 70%)}
.dz-page .dz-hero .dz-ph{position:absolute;inset:0;margin:0}
.dz-page .dz-hero .dz-ph img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;border:0;filter:grayscale(1) contrast(1.08) brightness(.62);
  animation:pt-in 1.6s ease both}
.dz-page .dz-hero .dz-ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,.55) 62%,#000 100%)}
.dz-page .dz-hero .dz-ph figcaption{position:absolute;z-index:2;right:clamp(16px,2.6vw,44px);top:clamp(22px,3.2vh,34px);margin:0;color:#9aa3ad;text-shadow:0 0 8px #000}
.dz-page .dz-hero:hover .dz-ph img{filter:grayscale(.2) contrast(1.05) brightness(.66);transition:filter 1.2s ease}
@keyframes pt-in{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:none}}
.dz-page .dz-head{position:relative;z-index:2;width:min(1180px,100%);margin:0 auto;padding:110px clamp(16px,4vw,48px) 34px;box-sizing:border-box;text-align:left}
.dz-page .dz-ruling{margin:0;font-size:clamp(34px,5.2vw,72px);line-height:1;letter-spacing:.03em}
.dz-page .dz-name{margin:18px 0 0;font:700 clamp(26px,3vw,44px)/1.1 var(--font-map);letter-spacing:.01em;color:#fff;text-wrap:balance;max-width:24em}
.dz-page .dz-place{margin:8px 0 0;font-size:clamp(14px,1.1vw,17px);color:#b9c1ca}
.dz-page .dz-did{margin:16px 0 0;font-size:clamp(15px,1.3vw,19px)}

/* under it: the money and the place on the left, the whole dossier on the right */
.dz-page .dz-body{display:grid;grid-template-columns:minmax(220px,320px) minmax(0,1fr);gap:clamp(24px,4vw,64px);width:min(1180px,100%);
  margin:0 auto;padding:30px clamp(16px,4vw,48px) 80px;box-sizing:border-box;border-top:1px solid var(--rule,#2a1a1a)}
.dz-page .dz-side{align-self:start;position:sticky;top:90px}
.dz-page .dz-m{margin:0;padding:14px 0}
.dz-page .dz-m:first-of-type{margin-top:0;border-top:1px solid var(--rule)}
.dz-page .dz-m b{font-size:clamp(20px,1.7vw,26px)}
.dz-page .dz-date{margin:14px 0 0;font:500 11px/1.6 "IBM Plex Mono",monospace;letter-spacing:.1em;text-transform:uppercase;color:#f3f5f8}
.dz-page .dz-dossier{min-width:0}
.dz-page .dz-what{margin:0 0 18px;font-size:17px;line-height:1.6;color:#eef1f4}
.dz-page .dz-part{margin:0 0 16px;padding:16px 20px;background:linear-gradient(90deg,rgba(255,255,255,.025),transparent 70%)}
.dz-page .dz-part .lb{font-size:12px;margin-bottom:10px}
.dz-page .dz-kv{padding:8px 0}
.dz-page .dz-kv .k{font-size:12px}
.dz-page .dz-kv .v{font-size:15px}
.dz-page .dz-tx,.dz-page .dz-facts{font-size:15px}
.dz-page .dz-src{font-size:11.5px}
.dz-page.s-late .dz-part:first-child{border-left-color:var(--red)}
@media (max-width:820px){
  .dz-page .dz-head{padding-top:96px}
  .dz-page .dz-body{grid-template-columns:minmax(0,1fr)}
  .dz-page .dz-side{position:static}
}
@media (prefers-reduced-motion:reduce){.dz-page .dz-hero .dz-ph img{animation:none}}