/*
Theme Name: MARANDA.DEV
Author: MARANDA.DEV
Description: Site personnel éditorial brutaliste : accueil, récit, projets, vigies, écrits et contact.
Version: 1.2.16
Update URI: https://github.com/maranda-dev/maranda-brutaliste
Requires at least: 6.6
Requires PHP: 8.1
License: GNU General Public License v2 or later
Text Domain: maranda
*/
@font-face{font-family:Anton;src:url('assets/anton.ttf') format('truetype');font-display:swap}@font-face{font-family:Caveat;src:url('assets/caveat.ttf') format('truetype');font-display:swap}
:root{--paper:#f6f3e9;--ink:#111110;--line:#77766e;color-scheme:light}/* Palette sombre Kubuntu relevée sur la capture : fond du panneau et bleu des libellés. */
html[data-theme=dark]{--paper:#141a21;--ink:#61afef;--line:#61afef;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.45 'Courier New',monospace}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}a{color:inherit;text-decoration:none}button:hover,a:hover{text-decoration:underline;text-underline-offset:5px}button:focus-visible,a:focus-visible{outline:2px solid var(--ink);outline-offset:6px}.scene{position:relative;width:100%;height:max(100svh,66.6667vw);overflow:hidden;isolation:isolate}.scene:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.15;z-index:8;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23808080' filter='url(%23n)' opacity='.25' d='M0 0h170v170H0z'/%3E%3C/svg%3E")}.brand{position:absolute;top:3.3%;left:5%;font-weight:bold;letter-spacing:.07em;font-size:clamp(12px,1.8vw,24px)}nav{position:absolute;top:3.4%;left:56%;border-left:1px solid;padding-left:1.7%;z-index:10}ol{list-style:none;margin:0;padding:0;counter-reset:nav}li{counter-increment:nav;font-size:clamp(10px,1.45vw,20px);line-height:1.4;white-space:nowrap}li:before{content:'0' counter(nav);margin-right:1.7em;font-size:.9em}li button{padding:0;font-weight:bold;letter-spacing:.03em}.theme{position:absolute;right:4%;top:2.2%;font:clamp(28px,4.5vw,60px)/1 sans-serif;width:1.2em;height:1.2em;z-index:10}.theme:hover span{display:inline-block;transform:rotate(45deg)}.intro{position:absolute;top:15%;left:9.5%;margin:0;font-size:clamp(11px,1.45vw,20px);z-index:4}figure{margin:0}.upper-photo{position:absolute;top:14.8%;left:59%;width:17.5%;height:15.8%;overflow:hidden;z-index:1}.upper-photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.2)}.cross{position:absolute;width:6%;height:5%;z-index:3}.cross:before,.cross:after{content:'';position:absolute;background:var(--line)}.cross:before{width:100%;height:1px;top:50%}.cross:after{width:1px;height:100%;left:50%}.cross-top{left:82.7%;top:21.5%}.photo-index{position:absolute;left:88.2%;top:28.4%;font-size:clamp(9px,1.25vw,17px)}.arc{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}.arc path{fill:none;stroke:var(--line);stroke-width:.5}.name{margin:0;position:absolute;inset:26.4% 0 auto;font-family:Anton,Impact,sans-serif;font-weight:400;font-size:27vw;line-height:.9;letter-spacing:-.035em;z-index:3}.name span{display:block;white-space:nowrap;width:max-content;transform-origin:left top}.first{margin-left:3.5%;transform:scaleX(1.01)}.last{margin-left:13.4%;transform:scaleX(.86)}.explore{position:absolute;top:35.3%;left:75%;display:flex;gap:2vw;align-items:flex-end;padding:0;z-index:6;font-size:clamp(10px,1.65vw,23px);letter-spacing:.13em}.pointer-disc{width:8vw;height:8vw;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center}.pointer-disc svg{width:65%;height:65%;fill:var(--ink);transform:translate(15%,20%)}.explore:hover .pointer-disc{background:var(--ink)}.explore:hover svg{fill:var(--paper)}.handwriting{position:absolute;top:64.3%;left:6.4%;font:3.4vw/.95 Caveat,cursive;transform:rotate(-14deg);margin:0;z-index:4}.handwriting span{padding-left:1.2em}.small-line{position:absolute;top:75.4%;left:18.5%;width:6.5%;height:1px;background:var(--ink);transform:rotate(-13deg)}.summary{position:absolute;top:69.3%;left:68.5%;font-size:clamp(10px,1.45vw,20px);z-index:4}.summary p{margin:0}.edition{display:flex;gap:1.2em;align-items:center;margin-top:1.4em;font-size:.85em}.edition i{width:4.4em;height:1px;background:var(--ink)}.lower-photo{position:absolute;left:-1%;bottom:4%;width:30%;height:22%;clip-path:polygon(0 0,26% 11%,45% 27%,56% 46%,100% 48%,100% 100%,0 77%);z-index:1;overflow:hidden}.lower-photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.35)}.cross-bottom{top:80.8%;left:23.5%}.coordinates{position:absolute;left:5.7%;bottom:3.3%;font-size:clamp(9px,1.35vw,18px);letter-spacing:.04em;line-height:1.6;z-index:4}.scroll{position:absolute;right:7%;bottom:2.1%;font-size:clamp(9px,1.3vw,18px);line-height:1.4;letter-spacing:.09em;text-align:left;z-index:5}.scroll span{display:block;font:5vw/1.2 serif;margin-top:.12em;text-align:center}.prototype-note{padding:14px;text-align:center;border-top:1px solid var(--line);font-size:11px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.skip{position:fixed;top:-100px;left:10px;background:var(--paper);padding:12px;z-index:30}.skip:focus{top:10px}dialog{background:var(--paper);color:var(--ink);border:1px solid var(--ink);max-width:560px;width:calc(100% - 40px);padding:45px}dialog::backdrop{background:#0009}dialog h2{font:54px/1.1 Anton,sans-serif;margin:24px 0}dialog .close{position:absolute;right:14px;top:8px;font:30px sans-serif}.eyebrow,.dialog-note{font-size:11px}.dialog-note{margin-top:30px}.cursor{display:none;position:fixed;left:0;top:0;width:52px;height:52px;border:1px solid var(--ink);border-radius:50%;pointer-events:none;z-index:100;transform:translate(-50%,-50%)}.cursor svg{width:30px;height:36px;fill:var(--ink);position:absolute;left:22px;top:22px}.cursor.active{width:72px;height:72px;background:var(--ink)}.cursor.active svg{fill:var(--paper)}@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){html.custom-cursor,html.custom-cursor *{cursor:none!important}html.custom-cursor .cursor.visible{display:block}}
@media(min-aspect-ratio:1/1){.scene{height:100svh;min-height:700px}.name{font-size:min(27vw,28vh)}.first{transform:scaleX(1.03)}.last{transform:scaleX(.88)}.upper-photo{width:17.5%;height:17%}.handwriting{font-size:min(3.4vw,4vh)}}
@media(max-width:600px){.scene{height:900px;min-height:100svh}.brand{top:3%;left:6%;font-size:13px}nav{top:8%;left:57%;padding-left:12px}li{font-size:10px}.theme{top:2%;right:5%;font-size:32px}.intro{top:17%;left:8%;font-size:11px}.upper-photo{top:22%;left:63%;width:26%;height:13%}.cross-top{left:86%;top:35%;width:8%;height:4%}.photo-index{left:87%;top:40%;font-size:9px}.name{top:33%;font-size:29vw;line-height:1;letter-spacing:-.025em}.first{margin-left:5%;transform:scaleX(1.02)}.last{margin-left:9%;transform:scaleX(.8)}.arc{top:10%;height:75%;width:120%;left:-13%}.explore{top:61%;left:61%;font-size:10px;gap:12px}.pointer-disc{width:44px;height:44px}.handwriting{top:65%;left:9%;font-size:24px}.small-line{top:76%;left:19%;width:12%}.summary{top:77%;left:43%;font-size:10px}.lower-photo{bottom:3%;width:37%;height:19%}.cross-bottom{left:28%;top:88%;width:8%;height:4%}.coordinates{left:6%;bottom:1%;font-size:9px}.scroll{right:6%;bottom:1.5%;font-size:9px}.scroll span{font-size:34px}.edition{margin-top:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* Ajustement après comparaison visuelle au panneau 768 × 1024. */
/* Native square scrollbars: shown only when there is overflowing content.
   Keep the platform's keyboard, dragging and forced-colour behaviour. */
html{scrollbar-width:auto;scrollbar-color:var(--ink) var(--paper)}
@supports selector(::-webkit-scrollbar){
 html{scrollbar-color:auto}
 html::-webkit-scrollbar{width:20px;height:20px;background:var(--paper)}
 html::-webkit-scrollbar-track{background:var(--paper);border-left:2px solid var(--ink)}
 html::-webkit-scrollbar-thumb{background:var(--ink);border:3px solid var(--paper);border-radius:0;min-height:64px}
 html::-webkit-scrollbar-thumb:hover{border-width:1px}
 html::-webkit-scrollbar-corner{background:var(--paper)}
 @media(max-width:600px){html::-webkit-scrollbar{width:14px;height:14px}}
}
@media(forced-colors:active){html{scrollbar-color:auto}html::-webkit-scrollbar-track,html::-webkit-scrollbar-thumb{background:revert;border:revert}}
.first{transform:scaleX(.84)}.last{transform:scaleX(.84)}
@media(min-aspect-ratio:1/1){.first{transform:scaleX(.84)}.last{transform:scaleX(.84)}}
@media(max-width:600px){.first{transform:scaleX(.93)}.last{transform:scaleX(.8)}}
@media(min-aspect-ratio:1/1){
.brand{font-size:14px}li{font-size:12px}.theme{font-size:36px}.intro{font-size:12px;top:16%}.summary{font-size:12px;top:76%;left:69%}.upper-photo{top:16%;left:60%;width:16%;height:17%}.name{top:28%;font-size:28vh}.first,.last{transform:scaleX(1.3)}.handwriting{top:76%;font-size:27px}.small-line{top:89%}.lower-photo{bottom:1%;height:17%;width:25%}.coordinates{font-size:10px;bottom:1%}.scroll{font-size:10px;right:5%;bottom:1%}.scroll span{font-size:42px}.cross-bottom{top:87%;left:20%}.explore{font-size:12px;gap:20px}.pointer-disc{width:62px;height:62px}.photo-index{font-size:10px}
}

@media(min-aspect-ratio:1/1){.summary{top:83%}.handwriting{left:30%;top:81%}.small-line{left:40%;top:96%}.coordinates{left:2%;bottom:0}.lower-photo{width:23%;height:14%;bottom:0}}

.name{mask-image:url(assets/ink-mask.svg);mask-mode:luminance;mask-size:260px 260px;mask-repeat:repeat}
@media(min-aspect-ratio:1/1){.coordinates{background:var(--paper);padding:3px 6px}}

/* Révision des proportions après retour visuel. */
.scene{height:100svh;min-height:0}
.name span{transform:scaleX(var(--name-fit,.84))}
.arc path{stroke-width:.7}html[data-theme=dark] .arc path{stroke:var(--line);stroke-width:.8}
.cursor{width:38px;height:38px}.cursor svg{width:20px;height:25px;left:17px;top:17px}
.cursor.active{width:46px;height:46px;background:transparent;border-width:2px}.cursor.active svg{fill:var(--ink)}
@media(max-width:600px){
.scene{height:100svh;min-height:0}.name{top:32%;font-size:min(27vw,14svh)}
.intro{top:18%;font-size:10px}.upper-photo{top:23%;height:13%}
.explore{top:58%;left:62%;font-size:9px;gap:8px}.pointer-disc{width:38px;height:38px}
.handwriting{top:63%;left:7%;font-size:21px}.small-line{top:74%;left:19%}
.summary{top:76%;left:43%;font-size:9px}.lower-photo{bottom:6%;height:16%;width:35%}
.cross-bottom{top:87%}.coordinates{bottom:1%;font-size:8px}.scroll{bottom:1%;font-size:8px}
.scroll span{font-size:28px}.edition{margin-top:8px}li button{padding:3px 0}
}
@media(max-width:600px),(hover:none),(pointer:coarse){html.custom-cursor,html.custom-cursor *{cursor:auto!important}html.custom-cursor .cursor.visible{display:none}}

/* Intermediate portrait widths: place editorial fragments below the measured name.
   Desktop landscape and the validated mobile layout are intentionally unaffected. */
@media (min-width:601px) and (max-width:999px) and (max-aspect-ratio:1/1){
 .handwriting{top:calc(var(--name-bottom, 65svh) + 40px);left:32%}
 .summary{top:calc(var(--name-bottom, 65svh) + 50px)}
 .small-line{top:calc(var(--name-bottom, 65svh) + 165px);left:43%}
}

nav li a{font-weight:bold;letter-spacing:.03em}nav li a:hover{text-decoration:underline}nav .sub-menu{display:none}
body.admin-bar .scene{height:calc(100svh - 32px)}
@media(max-width:782px){body.admin-bar .scene{height:calc(100svh - 46px)}}

/* Two independent editorial gestures, proposed locally for visual approval. */
.home-destination{position:absolute;z-index:6;color:var(--ink);text-decoration:none;min-width:44px;min-height:44px}
.home-destination:hover{text-decoration:none}
/* Projets: a direction cut into an open registration corner. */
.home-project-link{left:3.8%;top:70%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:68px}
.home-project-mark{display:block;width:54px;height:54px;fill:none;stroke:currentColor;stroke-linecap:square;stroke-linejoin:miter}
.project-registration{stroke-width:.8}
.project-direction{stroke-width:4}
.home-project-label{font:700 12px/1.4 'Courier New',monospace;letter-spacing:.11em;padding-left:2px}
.home-project-link:hover .project-registration{stroke-width:2}
/* Contact: a handwritten word floating above an offset horizontal arrow. */
.home-contact-link{left:57%;bottom:4%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:flex-start;width:132px}
.home-contact-label{display:block;margin-left:21px;font:700 30px/1 Caveat,cursive;letter-spacing:.015em;transform:rotate(-7deg);transform-origin:left bottom}
.home-contact-stroke{display:block;width:132px;height:28px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:square;margin-top:2px}
.home-contact-link:hover .home-contact-stroke{stroke-width:2.4}
.site-copyright{padding:14px 20px;border-top:1px solid var(--line);text-align:center;font:11px/1.6 'Courier New',monospace;overflow-wrap:anywhere}
@media(max-width:600px){
 .home-project-link{left:7%;top:calc(var(--name-bottom,57svh) + 1px);width:auto;max-width:45%;min-height:44px;flex-direction:row;align-items:center;gap:8px}
 .home-project-mark{width:34px;height:34px;flex-shrink:0}
 .home-project-label{font-size:11px;padding-left:0}
 .home-contact-link{bottom:5%;width:112px;min-height:44px}
 .home-contact-label{font-size:27px;margin-left:15px}
 .home-contact-stroke{width:112px;height:24px;margin-top:0}
 .site-copyright{font-size:10px}
}

@media(min-width:601px) and (max-width:999px) and (max-aspect-ratio:1/1){
 .home-project-link{top:calc(var(--name-bottom,65svh) + 30px)}
}

/* Le changement de palette reste identifiable sans survol, y compris en tactile. */
.theme::after{content:attr(aria-label);position:absolute;top:100%;right:0;display:block;width:max-content;font:11px/1.4 'Courier New',monospace;letter-spacing:.02em;white-space:nowrap}
@media(max-width:600px){.theme::after{font-size:9px;letter-spacing:0}}

/* Garder les visuels d’accueil entiers, notamment les logos de la médiathèque. */
.scene :is(.upper-photo,.lower-photo) img{display:block;object-fit:contain;object-position:center}
.scene .lower-photo{left:1%;clip-path:none}
@media(max-width:600px){.scene .upper-photo{height:9%}}

/* Duotone Kubuntu : photographies éditoriales et agrandissements, hors fonds cartographiques. */
html[data-theme=dark] :is(.upper-photo img,.lower-photo img,.about-photo img,.vigie-card img,.vigie-photo img,.record-content img,.reading-photo img,.reading-content img,.reading-author-avatar,.wp-block-image img,.maranda-photo-dialog .maranda-photo-large){filter:url(#maranda-kubuntu-duotone)}

/* Introduction plein écran : le GIF conserve toutes ses proportions. */
.home-intro[hidden]{display:none}
.home-intro{position:fixed;inset:0;z-index:100000;background:#141a21;display:grid;place-items:center;color:#61afef}
.home-intro img{display:block;width:100%;height:100%;object-fit:contain;min-height:0}
html.home-intro-active{overflow:hidden}
.home-intro-active body>:not(.home-intro){visibility:hidden}
.home-intro-active .home-intro,.home-intro-active .home-intro *{cursor:auto!important}
@media(prefers-reduced-motion:reduce){.home-intro{display:none}}

/* Les logos d’accueil gardent leur bleu d’origine, agrandissements compris. */
html .scene :is(.upper-photo,.lower-photo) :is([data-photo-tone="original"],[data-photo-tone="logo"]) img,
html .maranda-photo-dialog:is([data-tone="original"],[data-tone="logo"]) .maranda-photo-large{filter:none}

/* Option par page : couleurs originales en mode sombre, agrandissements compris. */
html[data-theme=dark] body.maranda-photo-filter-off :is(.upper-photo img,.lower-photo img,.about-photo img,.vigie-card img,.vigie-photo img,.record-content img,.reading-photo img,.reading-content img,.reading-author-avatar,.wp-block-image img,.maranda-photo-dialog .maranda-photo-large){filter:none}

/* Un même groupe réserve l’espace du lien au-dessus du logo à toute largeur. */
.scene .home-logo-projects{position:absolute;left:1%;bottom:0;width:23%;display:flex;flex-direction:column;align-items:flex-start;gap:16px;z-index:5}
.scene .home-logo-projects .home-project-link{position:static;flex-direction:column;align-items:flex-start;width:max-content;max-width:100%;min-height:44px;margin-left:12px;gap:4px}
.scene .home-logo-projects .lower-photo{position:static;width:100%;height:14svh;flex:none}
html[data-theme=light] .scene .lower-photo [data-photo-tone="logo"] img,
html[data-theme=light] .maranda-photo-dialog[data-tone="logo"] .maranda-photo-large{filter:brightness(0)}
@media(max-width:600px){
 .scene .home-logo-projects{width:35%;bottom:6%;gap:12px}
 .scene .home-logo-projects .lower-photo{height:16svh}
 .scene .home-logo-projects .home-project-link{margin-left:10px}
}
