/* Inévitable Tattoo — composants de l’accueil (planche, styles empilés, héros typographique). */
/* ----- accueil : styles en planches empilées ----- */
.enc-stack{margin-top:clamp(36px,5vw,64px)}
.enc-card{position:sticky;display:grid;grid-template-columns:1.05fr .95fr;min-height:min(64vh,540px);border-radius:22px;overflow:hidden;margin-bottom:26px;box-shadow:0 -20px 40px -30px rgba(0,0,0,.8);text-decoration:none;color:inherit}
.enc-card:nth-child(1){top:calc(var(--nav-h) + 16px)} .enc-card:nth-child(2){top:calc(var(--nav-h) + 34px)} .enc-card:nth-child(3){top:calc(var(--nav-h) + 52px)}
.enc-card:nth-child(4){top:calc(var(--nav-h) + 70px)} .enc-card:nth-child(5){top:calc(var(--nav-h) + 88px)} .enc-card:nth-child(6){top:calc(var(--nav-h) + 106px)}
.enc-card:nth-child(odd){background:var(--ivory2);color:var(--ink)}
.enc-card:nth-child(odd) :is(h3,p,span,div){color:var(--ink)}
.enc-card:nth-child(even) :is(h3,p,span,div){color:var(--ivory)}
.enc-card:nth-child(even){background:#1C1B19;color:var(--ivory);border:1px solid var(--line-d)}
.enc-card .ph{position:relative;overflow:hidden;min-height:260px}
.enc-card .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.enc-card:hover .ph img{transform:scale(1.04)}
.enc-card .tx{padding:clamp(22px,3.4vw,46px);display:flex;flex-direction:column;justify-content:space-between;gap:22px}
.enc-card .no{font-family:var(--disp);font-style:italic;font-weight:300;font-size:20px;opacity:.6}
.enc-card h3{margin:0;font-weight:300;font-size:clamp(36px,5vw,72px);line-height:.92}
.enc-card p{margin:0;max-width:36ch;font-size:16px;opacity:.86}
.enc-card .go{font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.enc-card .pill{align-self:flex-start;margin-bottom:12px;font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:5px 11px;border-radius:999px;border:1px solid currentColor}
@media (max-width:760px){.enc-card{grid-template-columns:1fr;min-height:0}.enc-card .ph{height:280px}}

/* ----- v13 : écriture au stylo, planche scotchée, machine du héros ----- */
@font-face{font-family:"Nanum Pen Script";src:url(/fonts/NanumPenScript-latin.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
:root{--hand:"Nanum Pen Script","Segoe Print","Comic Sans MS",cursive;--bic:#2940A6}
.hand{font-family:var(--hand);color:var(--bic);font-weight:400;letter-spacing:0;text-transform:none}

.board-head{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:clamp(30px,4vw,48px)}
.board-head .hand{display:block;font-size:28px;transform:rotate(-2deg);margin-top:8px}
.board{display:grid;grid-template-columns:repeat(4,1fr);gap:40px 28px;align-items:start;list-style:none;margin:0;padding:0}
.board li{margin:0}
.pin{margin:0;background:#F8F7F3;padding:10px 10px 46px;position:relative;box-shadow:0 14px 28px -18px rgba(0,0,0,.55);transition:transform .45s var(--ease),box-shadow .45s}
.board li:nth-child(4n+1) .pin{transform:rotate(-2.2deg)} .board li:nth-child(4n+2) .pin{transform:rotate(1.6deg);margin-top:34px}
.board li:nth-child(4n+3) .pin{transform:rotate(-1deg)} .board li:nth-child(4n) .pin{transform:rotate(2.4deg);margin-top:22px}
.board li .pin:hover{transform:rotate(0) scale(1.03);box-shadow:0 22px 40px -20px rgba(0,0,0,.6)}
.pin::before{content:"";position:absolute;top:-13px;left:50%;width:92px;height:26px;margin-left:-46px;background:rgba(214,200,160,.72);transform:rotate(-5deg);z-index:2}
.pin img{width:100%;aspect-ratio:3/4;object-fit:cover}
.pin figcaption{position:absolute;left:12px;right:12px;bottom:9px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.pin figcaption .hand{font-size:27px;line-height:1;color:var(--ink)}
.pin figcaption small{font-size:12px;color:var(--min-l)}
.board-more{display:flex;align-items:center;gap:12px;margin-top:38px;font-size:28px;text-decoration:none}
.board-more svg{width:92px;flex:none}
.enc-card .go{font-family:var(--hand);font-size:27px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--bic)}
.enc-card:nth-child(even) .go{color:#A9B7FF}
@media (max-width:900px){.board{grid-template-columns:repeat(2,1fr);gap:30px 18px}.board li .pin{margin-top:0!important}}
@media (prefers-reduced-motion:reduce){.pin{transition:none}}


/* ----- v17 : héros sans image ----- */
.hero-home--txt .hero-in{min-height:min(calc(100svh - var(--nav-h)),760px)}
.hero-home--txt .hero-copy{max-width:none}
.hero-home--txt .hero-title{font-size:clamp(52px,11.4vw,168px)}
.hero-home--txt .hero-sub{max-width:52ch}
.hero-styles{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:clamp(26px,3.6vw,40px);padding:0;list-style:none}
.hero-styles a{display:inline-block;padding:7px 14px;border:1px solid var(--line-l);border-radius:999px;font-size:13.5px;text-decoration:none;color:var(--ink);transition:border-color .25s,background .25s}
.hero-styles a:hover{border-color:var(--ink)}
.hero-styles a.sig{background:var(--ink);color:var(--ivory);border-color:var(--ink)}
.hero-down{display:inline-flex;align-items:center;gap:10px;margin-top:clamp(26px,4vw,44px);font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--ink)}
.hero-down span{display:inline-grid;place-items:center;width:34px;height:34px;border:1px solid var(--ink);border-radius:50%;animation:hd 2.4s ease-in-out infinite}
@keyframes hd{50%{transform:translateY(5px)}}
@media (prefers-reduced-motion:reduce){.hero-down span{animation:none}}

/* ----- v19 : menu mobile, formulaires, ancres, filet sans JS, en-tête stable ----- */
.mobile-nav{justify-content:flex-start;overflow-y:auto;overscroll-behavior:contain;padding-top:84px;padding-bottom:32px}
.mobile-nav ul{margin-block:auto}
@media (max-height:620px){.mobile-nav a{font-size:21px;padding:8px 0}}
.field input[type=text],.field input[type=email],.field select,.field textarea{font-size:16px}
[id]{scroll-margin-top:calc(var(--nav-h) + 16px)}
html.reveal-all .rev,html.reveal-all [data-anim]{opacity:1!important;transform:none!important}
html.reveal-all .mask img,html.reveal-all [data-anim] img{clip-path:none!important;transform:none!important;opacity:1!important}
html.reveal-all .ht-in{transform:none!important}
.form__status{margin-top:14px;font-weight:700}
.form__status[data-kind=ok]{color:#1d6b3a}
.form__status[data-kind=err]{color:#b3261e}
.form .field [aria-invalid=true]{border-color:#b3261e;box-shadow:inset 0 0 0 1px #b3261e}
@media (min-width:900px){.portrait-sticky{position:sticky;top:calc(var(--nav-h) + 24px)}}
@media (max-width:760px) and (max-height:800px),(max-height:700px){.enc-stack .enc-card{position:relative;top:0}}
.is-scrolled .site-header__inner{height:var(--nav-h)}
.paire{grid-template-rows:auto auto}
.paire>.work{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0}
.paire>.work>picture{align-self:end}
.paire>.work>figcaption{align-self:start}
.eyebrow{align-items:baseline}
.eyebrow:before{position:relative;top:-.35em;flex:none}
@media (max-width:359px){.site-header__inner{gap:8px}.wm-group,.wm{gap:7px}.wm span{letter-spacing:.05em}.menu-toggle{flex:none;padding:0 10px}.pin figcaption .hand{font-size:21px;white-space:nowrap}.pin figcaption small{font-size:11px}}