/* Mima Mova — maquette v2 (12 nov. 2026). Typo : Anton (titres géants), Inter (texte), Caveat (notes de Mima). */
:root{
  --ink:#17110f; --muted:#6f625c; --line:#e9dfd7; --cream:#fbf7f2; --paper:#ffffff;
  --rose:#b0305f; --rose-d:#8c1f49; --blush:#f8e1e8; --butter:#f6eba9; --mint:#d9efe4; --sky:#dcebf8; --lilac:#ebe1f7; --peach:#fde3d3;
  --radius:18px; --wrap:1280px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font:15px/1.5 Inter,system-ui,sans-serif;color:var(--ink);background:var(--cream);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block} a{color:inherit;text-decoration:none} button{font:inherit;cursor:pointer}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}
.display{font-family:Anton,Impact,sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.005em;line-height:.86;margin:0}
.hand{font-family:Caveat,cursive;color:var(--rose);font-size:26px;line-height:1}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.btn{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:999px;padding:14px 26px;font-weight:700;font-size:14px;letter-spacing:.02em;background:var(--ink);color:#fff;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-1px);background:var(--rose)} .btn.light{background:#fff;color:var(--ink)} .btn.rose{background:var(--rose)} .btn.rose:hover{background:var(--rose-d)}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)} .btn.ghost:hover{background:var(--ink);color:#fff}
.chip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:600;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}

/* En-tête */
.ticker{background:var(--ink);color:#fff;overflow:hidden;white-space:nowrap;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.ticker div{display:inline-block;padding:9px 0;animation:tick 32s linear infinite}
.ticker span{margin:0 26px} .ticker b{color:var(--butter)}
@keyframes tick{to{transform:translateX(-50%)}}
header.top{position:sticky;top:0;z-index:20;background:rgba(251,247,242,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;align-items:center;gap:28px;height:68px}
.logo{font-family:Anton,sans-serif;font-size:26px;letter-spacing:.02em;text-transform:uppercase;display:flex;align-items:center;gap:6px}
.logo i{font-style:normal;color:var(--rose)}
nav.main{display:flex;gap:22px;font-size:14px;font-weight:600}
nav.main a{position:relative;padding:4px 0} nav.main a:hover,nav.main a.on{color:var(--rose)}
nav.main a.on::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;background:var(--rose);border-radius:2px}
.tools{margin-left:auto;display:flex;align-items:center;gap:14px}
.search{display:flex;align-items:center;gap:8px;background:#fff;border-radius:999px;padding:9px 16px;min-width:240px;box-shadow:inset 0 0 0 1px var(--line);color:var(--muted);font-size:13px}
.icon{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.lang{font-size:12px;font-weight:700}

/* Héros : mot géant derrière Mima */
.hero{position:relative;overflow:hidden;background:radial-gradient(120% 90% at 50% 100%,#f7d4df 0%,#fbeef1 45%,var(--cream) 80%)}
.hero .wrap{position:relative;height:640px}
.hero .giant{position:absolute;left:0;right:0;top:46px;text-align:center;font-size:clamp(120px,19vw,260px);color:var(--rose);opacity:.95;z-index:1;pointer-events:none}
.hero .giant.two{top:auto;bottom:-22px;color:transparent;-webkit-text-stroke:2px var(--rose);opacity:.55}
.hero .stage{position:absolute;inset:auto 0 0 0;height:600px;display:flex;justify-content:center;align-items:flex-end;gap:0;z-index:2}
.hero .stage img{height:560px;width:auto;filter:drop-shadow(0 30px 30px rgba(80,20,40,.18));transition:transform .5s}
.hero .stage img:nth-child(1){height:470px;transform:translateX(40px) rotate(-2deg)}
.hero .stage img:nth-child(3){height:470px;transform:translateX(-40px) rotate(2deg)}
.hero .stage img:hover{transform:translateY(-10px) scale(1.02)}
.hero .copy{position:absolute;left:28px;bottom:56px;z-index:3;max-width:330px}
.hero .copy p{margin:10px 0 18px;color:var(--muted);font-size:16px}
.hero .note{position:absolute;right:60px;top:190px;z-index:3;transform:rotate(-6deg)}
.hero .codes{position:absolute;right:28px;bottom:56px;z-index:3;display:flex;flex-direction:column;gap:8px;align-items:flex-end}

/* Bandeau défilant */
.marquee{background:var(--rose);color:#fff;overflow:hidden;white-space:nowrap;border-block:2px solid var(--ink)}
.marquee div{display:inline-block;animation:tick 26s linear infinite;padding:14px 0}
.marquee span{font-family:Anton,sans-serif;font-size:30px;text-transform:uppercase;margin:0 22px}
.marquee em{font-style:normal;color:var(--butter)}

section{padding:72px 0}
.head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:26px}
.head h2{font-size:56px}
.head a{font-weight:700;font-size:14px;border-bottom:2px solid currentColor}

/* Tuiles tendances */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.tile{position:relative;border-radius:var(--radius);height:420px;overflow:hidden;display:flex;align-items:flex-end;justify-content:center;transition:transform .25s}
.tile:hover{transform:translateY(-4px)}
.tile img{height:92%;width:auto;position:relative;z-index:2;transition:transform .35s}
.tile:hover img{transform:scale(1.04)}
.tile .word{position:absolute;top:18px;left:18px;right:18px;font-size:72px;z-index:1;color:rgba(23,17,15,.9)}
.tile .go{position:absolute;bottom:16px;right:16px;z-index:3;background:#fff;border-radius:999px;padding:8px 14px;font-size:13px;font-weight:700}

/* Cartes tenues */
.row{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 72px)/5);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px}
.row::-webkit-scrollbar{height:6px}.row::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
.card{scroll-snap-align:start;display:flex;flex-direction:column;gap:10px}
.card .pic{position:relative;border-radius:var(--radius);aspect-ratio:3/4.2;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.card .pic img{height:94%;width:auto;transition:transform .35s}
.card:hover .pic img{transform:translateY(-6px) scale(1.03)}
.card .code{position:absolute;top:12px;left:12px;font-size:11px;font-weight:800;letter-spacing:.08em;background:rgba(255,255,255,.85);border-radius:999px;padding:4px 9px}
.card .heart{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:15px}
.card .pieces{position:absolute;left:10px;right:10px;bottom:10px;display:flex;gap:6px;opacity:0;transform:translateY(8px);transition:.25s}
.card:hover .pieces{opacity:1;transform:none}
.card .pieces img{width:46px;height:46px;object-fit:cover;border-radius:10px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.card h3{margin:0;font-size:15px;line-height:1.3;font-weight:700}
.card .meta{font-size:13px;color:var(--muted)}

/* Bannière éditoriale */
.banner{position:relative;border-radius:28px;overflow:hidden;background:var(--butter);height:520px}
.banner .giant{position:absolute;left:-10px;right:-10px;top:40px;text-align:center;font-size:clamp(110px,15vw,210px);color:var(--ink)}
.banner img{position:absolute;bottom:0;left:50%;transform:translateX(-50%);height:96%;z-index:2}
.banner .side{position:absolute;z-index:3;bottom:36px;max-width:280px}
.banner .side.l{left:36px}.banner .side.r{right:36px;text-align:right}

/* Mosaïque d'ambiances */
.mosaic{columns:4 260px;column-gap:16px}
.mosaic a{display:block}.mosaic figure{margin:0 0 16px;break-inside:avoid;border-radius:16px;overflow:hidden;position:relative}
.mosaic figcaption{position:absolute;left:10px;bottom:10px;background:rgba(255,255,255,.9);border-radius:999px;padding:5px 11px;font-size:12px;font-weight:700}

/* Pièces */
.products{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.prod{background:#fff;border-radius:16px;padding:12px;display:flex;flex-direction:column;gap:8px;box-shadow:inset 0 0 0 1px var(--line)}
.prod img{aspect-ratio:1;object-fit:contain;border-radius:10px;background:#faf8f6}
.prod b{font-size:13px;line-height:1.3}
.prod span{font-size:12px;color:var(--muted)}

/* Infolettre */
.news{background:var(--ink);color:#fff;border-radius:28px;display:grid;grid-template-columns:1.2fr 1fr;overflow:hidden}
.news .txt{padding:56px}
.news h2{font-size:64px}
.news form{display:flex;gap:10px;margin-top:22px}
.news input{flex:1;border:0;border-radius:999px;padding:15px 20px;font:inherit}
.news .pics{display:flex;align-items:flex-end;justify-content:center;background:linear-gradient(180deg,#2a1f1c,#3a2028)}
.news .pics img{height:360px;margin:0 -30px}

footer{background:#fff;border-top:1px solid var(--line);padding:56px 0 30px;margin-top:72px;font-size:14px}
footer .cols{display:grid;grid-template-columns:2fr repeat(4,1fr);gap:30px}
footer h4{margin:0 0 12px;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
footer a{display:block;color:var(--muted);margin:6px 0} footer a:hover{color:var(--rose)}
footer .legal{margin-top:36px;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:12px}

/* Catalogue */
.cat-hero{padding:48px 0 18px}
.cat-hero .display{font-size:120px}
.filters{position:sticky;top:68px;z-index:10;background:var(--cream);padding:14px 0;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.filters .chip{cursor:pointer} .filters .chip.on{background:var(--ink);color:#fff;box-shadow:none}
.filters select{margin-left:auto;border:0;border-radius:999px;padding:8px 14px;font:inherit;font-size:13px;box-shadow:inset 0 0 0 1px var(--line);background:#fff}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px 18px;padding:28px 0}
.pager{display:flex;justify-content:center;gap:8px}

/* Page tenue */
.crumbs{font-size:13px;color:var(--muted);padding:22px 0}
.crumbs a:hover{color:var(--rose)}
.look{display:grid;grid-template-columns:1.15fr 1fr;gap:48px;align-items:start}
.look .stage{position:relative;border-radius:28px;overflow:hidden;height:760px;background:radial-gradient(90% 70% at 50% 100%,#f6d7e0,#fbeef1 60%,#fff)}
.look .stage .giant{position:absolute;left:0;right:0;top:34px;text-align:center;font-size:150px;color:var(--rose);opacity:.9}
.look .stage img.mima{position:absolute;bottom:0;left:50%;transform:translateX(-50%);height:94%;z-index:2}
.look .stage .hand{position:absolute;left:34px;bottom:40px;z-index:3;transform:rotate(-4deg)}
.look .thumbs{display:flex;gap:10px;margin-top:12px}
.look .thumbs > *{width:92px;height:118px;border-radius:12px;overflow:hidden;object-fit:cover;box-shadow:inset 0 0 0 1px var(--line);background:#fff}
.look .thumbs .on{outline:2px solid var(--ink);outline-offset:2px}
.look aside{position:sticky;top:96px;display:flex;flex-direction:column;gap:18px}
.look h1{font-size:44px;line-height:1.05;margin:0;font-family:Inter,sans-serif;font-weight:800;letter-spacing:-.02em}
.look .lead{font-size:16px;color:#3c322e;margin:0}
.piece{display:grid;grid-template-columns:76px 1fr auto;gap:14px;align-items:center;background:#fff;border-radius:16px;padding:10px;box-shadow:inset 0 0 0 1px var(--line)}
.piece img{width:76px;height:76px;object-fit:contain;border-radius:10px;background:#faf8f6}
.piece b{font-size:14px;line-height:1.3;display:block}
.piece small{color:var(--muted)}
.piece .btn{padding:10px 16px;font-size:13px}
.disclose{font-size:12px;color:var(--muted);background:#fff;border-radius:12px;padding:10px 12px;box-shadow:inset 0 0 0 1px var(--line)}
.wear{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.wear div{background:#fff;border-radius:18px;padding:22px;box-shadow:inset 0 0 0 1px var(--line)}
.wear h3{margin:0 0 8px;font-size:18px}
.wear p{margin:0;color:var(--muted)}
.faq details{background:#fff;border-radius:14px;padding:16px 20px;margin-bottom:10px;box-shadow:inset 0 0 0 1px var(--line)}
.faq summary{font-weight:700;cursor:pointer}

/* Lien en bio (mobile) */
.phone{width:400px;margin:40px auto;background:#fff;border-radius:38px;padding:22px;box-shadow:0 30px 80px rgba(60,20,40,.18),inset 0 0 0 1px var(--line)}
.phone .me{display:flex;gap:12px;align-items:center}
.phone .me .av{width:58px;height:58px;border-radius:50%;background:var(--blush);overflow:hidden;display:flex;align-items:flex-start;justify-content:center}
.phone .me .av img{width:130%;max-width:none;margin-top:-4px}
.phone .find{margin:18px 0;background:var(--cream);border-radius:18px;padding:16px}
.phone .find input{width:100%;border:0;border-radius:999px;padding:13px 16px;font:inherit;font-weight:700;letter-spacing:.06em;margin-top:8px;box-shadow:inset 0 0 0 1px var(--line)}
.phone .two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.phone .two .card .pic{aspect-ratio:3/4}
.phone .socials{display:flex;gap:8px;justify-content:center;margin-top:16px}

/* Bandeau de maquette */
.mock-nav{position:fixed;bottom:14px;left:50%;transform:translateX(-50%);z-index:50;background:var(--ink);color:#fff;border-radius:999px;padding:6px;display:flex;gap:2px;box-shadow:0 10px 30px rgba(0,0,0,.25);font-size:12px;max-width:96vw;overflow-x:auto}
.mock-nav a{padding:8px 14px;border-radius:999px}.mock-nav a.on,.mock-nav a:hover{background:var(--rose)}
@media (max-width:900px){.tiles,.products,.grid{grid-template-columns:repeat(2,1fr)}.row{grid-auto-columns:46%}.look,.news{grid-template-columns:1fr}.hero .wrap{height:560px}.search{display:none}nav.main{display:none}}

/* ===== Révision 2 (retours de Carl) ===== */
/* Mima détourée sur fond clair, avec seulement un bandeau de couleur mince derrière elle */
.card .pic{background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.card .pic::before{content:"";position:absolute;left:0;right:0;top:44%;height:22%;background:var(--tint,#f3c6d3);opacity:.75}
.card .pic::after{content:"";position:absolute;left:0;right:0;top:calc(44% + 22% + 6px);height:3px;background:var(--tint,#f3c6d3);opacity:.75}
.card .pic img{position:relative;z-index:1}
.tile{background:#fff!important;box-shadow:inset 0 0 0 1px var(--line)}
.tile::before{content:"";position:absolute;left:0;right:0;top:50%;height:24%;background:var(--tint)}
.look .stage{background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.look .stage::before{content:"";position:absolute;left:0;right:0;top:48%;height:20%;background:#f3c6d3;opacity:.8}
.look .stage .giant{z-index:1}

/* Menu déroulant */
.has-mega{position:static}
.has-mega > a{display:inline-block;padding:4px 0}
.mega{position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--line);box-shadow:0 30px 60px rgba(40,20,20,.12);opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s;font-weight:400}
.has-mega:hover .mega,.has-mega:focus-within .mega{opacity:1;visibility:visible;transform:none}
.mega-in{display:grid;grid-template-columns:210px 1fr 200px;gap:28px;padding:22px 28px 26px}
.mega-side{display:flex;flex-direction:column;border-right:1px solid var(--line);padding-right:14px}
.mega-side a{display:flex;justify-content:space-between;padding:9px 12px;border-radius:8px;font-size:14px;color:var(--ink)}
.mega-side a.on,.mega-side a:hover{background:#f4eeea}
.mega-side.right{border-right:0;border-left:1px solid var(--line);padding:0 0 0 14px}
.mega-side.right a{padding:5px 0;color:var(--muted)} .mega-side.right a:hover{background:none;color:var(--rose)}
.mega h4{margin:0 0 12px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--rose)}
.circles{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:14px 10px;margin-bottom:20px}
.circ{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px;text-align:center}
.circ span{width:84px;height:84px;border-radius:50%;background:#f6f0ec;overflow:hidden;display:flex;justify-content:center;align-items:flex-start;transition:transform .2s}
.circ span img{height:200%;max-width:none;margin-top:4px}
.circ.pc span img{height:100%;width:100%;object-fit:cover;margin:0}
.circ.all span img{opacity:.25}
.circ:hover span{transform:scale(1.06)}

/* Catalogue classique avec colonne de filtres */
.shop{display:grid;grid-template-columns:250px 1fr;gap:34px;padding:10px 0 30px}
.side-filters{position:sticky;top:84px;align-self:start;max-height:calc(100vh - 100px);overflow:auto;padding-right:6px}
.fgroup{border-bottom:1px solid var(--line);padding:14px 0}
.fgroup summary{font-weight:700;font-size:14px;cursor:pointer;list-style:none;display:flex;justify-content:space-between}
.fgroup summary::after{content:"−";color:var(--muted)} .fgroup:not([open]) summary::after{content:"+"}
.fgroup label{display:flex;align-items:center;gap:10px;font-size:14px;padding:5px 0;cursor:pointer}
.fgroup label input{accent-color:var(--rose);width:16px;height:16px}
.fgroup label em{margin-left:auto;font-style:normal;color:var(--muted);font-size:12px}
.swatches{display:flex;flex-wrap:wrap;gap:8px;padding-top:8px}
.swatches label{display:block;padding:0}
.swatches input{position:absolute;opacity:0}
.swatches span{display:block;width:28px;height:28px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15);cursor:pointer}
.swatches input:checked + span{outline:2px solid var(--ink);outline-offset:2px}
.topbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-bottom:14px;border-bottom:1px solid var(--line)}
.topbar .count{font-weight:700}
.topbar .active{display:flex;gap:6px;flex-wrap:wrap}
.topbar .active button{border:0;border-radius:999px;background:var(--ink);color:#fff;padding:5px 10px;font-size:12px}
.topbar select{margin-left:auto;border:0;border-radius:999px;padding:9px 14px;font:inherit;font-size:13px;box-shadow:inset 0 0 0 1px var(--line);background:#fff}
.view{display:flex;gap:4px}.view button{border:0;background:#fff;border-radius:8px;width:34px;height:34px;box-shadow:inset 0 0 0 1px var(--line)}.view button.on{background:var(--ink);color:#fff}
.shop .grid{grid-template-columns:repeat(var(--cols,4),1fr)}
.empty-msg{grid-column:1/-1;text-align:center;color:var(--muted);padding:60px 0}

/* Magasiner par tenue : portant de cartes tassées en perspective + pièces à droite */
.rack-page{display:grid;grid-template-columns:1.25fr 1fr;gap:36px;align-items:start;padding:20px 0 40px}
.rack{position:relative;height:640px;perspective:1400px;overflow:hidden;border-radius:28px;background:linear-gradient(180deg,#fff 0%,#fbf4f1 100%);box-shadow:inset 0 0 0 1px var(--line)}
.rack .rail{position:absolute;top:34px;left:6%;right:6%;height:4px;border-radius:2px;background:linear-gradient(90deg,transparent,#cdbab2,transparent)}
.rcard{position:absolute;top:60px;left:50%;width:250px;height:520px;margin-left:-125px;border-radius:22px;background:#fff;box-shadow:0 18px 40px rgba(60,30,30,.14);transition:transform .55s cubic-bezier(.2,.7,.2,1),opacity .4s,filter .4s;cursor:pointer;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;transform-style:preserve-3d}
.rcard::before{content:"";position:absolute;left:0;right:0;top:46%;height:20%;background:var(--tint)}
.rcard img{position:relative;height:94%}
.rcard .code{position:absolute;top:12px;left:12px;font-size:11px;font-weight:800;background:#fff;border-radius:999px;padding:3px 8px;z-index:2;box-shadow:0 1px 4px rgba(0,0,0,.08)}
.rack .arrows{position:absolute;bottom:16px;left:0;right:0;display:flex;justify-content:center;gap:10px;z-index:30}
.rack .arrows button{width:46px;height:46px;border-radius:50%;border:0;background:var(--ink);color:#fff;font-size:18px}
.rack .hint{position:absolute;bottom:26px;left:22px;font-size:12px;color:var(--muted);z-index:30}
.panel{position:sticky;top:96px;display:flex;flex-direction:column;gap:14px}
.panel h2{font-size:34px;line-height:1.05;margin:0;font-family:Inter,sans-serif;font-weight:800;letter-spacing:-.02em}

/* Essayage */
.fit{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;padding:10px 0 30px}
.step{background:#fff;border-radius:22px;padding:22px;box-shadow:inset 0 0 0 1px var(--line);display:flex;flex-direction:column;gap:14px}
.step .n{width:34px;height:34px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:800}
.drop{border:2px dashed #d9c9c0;border-radius:18px;height:300px;display:grid;place-items:center;text-align:center;color:var(--muted);background:#fbf7f4}
.pickgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-height:330px;overflow:auto}
.pickgrid button{border:0;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);height:120px;overflow:hidden;position:relative;--tint:#f3c6d3}
.pickgrid button::before{content:"";position:absolute;left:0;right:0;top:46%;height:20%;background:var(--tint);opacity:.7}
.pickgrid button img{position:relative;height:100%;margin:0 auto}
.pickgrid button.on{outline:3px solid var(--rose)}
.result{height:300px;border-radius:18px;background:#fbf7f4;position:relative;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.result img{height:96%;opacity:.9}
.result .ghost{position:absolute;inset:0;display:grid;place-items:center;font-weight:700;color:var(--muted);background:rgba(255,255,255,.55)}

/* Garde-robe, journal, à propos */
.boards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.board{background:#fff;border-radius:20px;padding:12px;box-shadow:inset 0 0 0 1px var(--line)}
.board .mini{display:grid;grid-template-columns:1fr 1fr;gap:6px;height:220px}
.board .mini div{border-radius:12px;background:#f8f2ee;display:flex;justify-content:center;align-items:flex-end;overflow:hidden}
.board .mini img{height:96%}
.board b{display:block;margin-top:10px}
.articles{display:grid;grid-template-columns:2fr 1fr 1fr;gap:20px}
.article{display:flex;flex-direction:column;gap:10px}
.article .img{border-radius:20px;overflow:hidden;aspect-ratio:4/5;background:#f4eeea}
.article .img img{width:100%;height:100%;object-fit:cover}
.article.big .img{aspect-ratio:auto;height:560px}
.article h3{margin:0;font-size:20px;line-height:1.2}
.article p{margin:0;color:var(--muted)}
.about-hero{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding:40px 0}
.about-hero .stage{position:relative;height:600px;display:flex;justify-content:center;align-items:flex-end}
.about-hero .stage::before{content:"";position:absolute;left:0;right:0;top:50%;height:18%;background:#f3c6d3}
.about-hero .stage img{position:relative;height:96%}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.facts div{background:#fff;border-radius:20px;padding:24px;box-shadow:inset 0 0 0 1px var(--line)}
.facts b{font-family:Anton,sans-serif;font-size:48px;display:block;color:var(--rose)}
.bio-chips{display:flex;gap:6px;overflow-x:auto;margin:-4px 0 12px;padding-bottom:4px}
.bio-chips button{border:0;border-radius:999px;padding:7px 12px;font-size:12px;font-weight:700;background:#f4eeea;white-space:nowrap}
.bio-chips button.on{background:var(--ink);color:#fff}
@media (max-width:900px){.shop,.rack-page,.fit,.about-hero{grid-template-columns:1fr}.side-filters{position:static;max-height:none}.boards,.articles,.facts{grid-template-columns:1fr 1fr}}

nav.main{gap:18px;white-space:nowrap} nav.main a{white-space:nowrap} .search{min-width:190px} .mock-nav a{white-space:nowrap}
@media (max-width:1250px){.search{display:none}}

header.top .mega .wrap.mega-in{display:grid;height:auto;align-items:start;white-space:normal}

/* ===== Révision 3 (retours de Carl) : Mima détourée sur fond transparent partout, palette et police approuvées ===== */
@font-face{font-family:"Louis George";src:url(assets/old/LouisGeorge.ttf) format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"Louis George";src:url(assets/old/LouisGeorgeBold.ttf) format("truetype");font-weight:700;font-display:swap}
:root{--ink:#28241f;--cream:#fcfaf7;--rose:#742d43;--rose-d:#5a2134;--pink:#e6a6ae;--sage:#b8c4b2;--line:#ebe3dc;--muted:#6f655e}
body{font-family:Inter,system-ui,sans-serif} /* Carl préfère Inter (12 nov.) ; Louis George gardée en réserve */
.card .pic,.tile,.look .stage,.rcard,.pickgrid button,.about-hero .stage,.result{background:transparent!important;box-shadow:none!important}
.card .pic::before,.card .pic::after,.tile::before,.look .stage::before,.rcard::before,.pickgrid button::before,.about-hero .stage::before{display:none!important}
.card .pic{border-radius:0;overflow:visible}
.card .pieces img{background:#fff}
.tile{border-radius:0}
.tile .word{color:var(--pink);opacity:.9}
.tile .go{box-shadow:0 0 0 1px var(--line)}
.hero{background:var(--cream)}
.hero .giant{color:var(--rose)} .hero .giant.two{-webkit-text-stroke:2px var(--pink)}
.banner{background:transparent;border-radius:0;border-block:1px solid var(--line)}
.banner .giant{color:var(--pink)}
.marquee{border-block:0;background:var(--rose)}
.marquee em{color:var(--pink)}
.ticker b{color:var(--pink)}
.btn.rose{background:var(--rose)} .btn:hover{background:var(--rose)}
.look .stage .giant{color:var(--pink)}
.rcard{border-radius:0}
.rack{background:transparent;box-shadow:none;border-block:1px solid var(--line);border-radius:0}
/* Listes déroulantes : flèche à distance égale du bord */
select{-webkit-appearance:none;appearance:none;padding-right:40px!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2328241f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 16px center!important;background-color:#fff!important}
/* Catalogue : 5 tenues par ligne */
.shop .grid{grid-template-columns:repeat(5,1fr)!important;gap:30px 18px}
.view{display:none!important}
/* Pièces : bouton et code alignés */
.prod .acts{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto}
.prod .acts .btn{padding:8px 14px;font-size:12px}
.prod .acts a.code{font-size:11px;font-weight:700;color:var(--muted);white-space:nowrap}
.prod .acts a.code:hover{color:var(--rose)}
/* Menu déroulant : zone continue (pas de trou entre « Tenues » et le menu) et vignettes détourées sans cercle */
header.top .wrap{position:relative}
.has-mega{display:flex;align-items:center;height:68px}
.mega{top:68px}
.mega::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.circles{grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:16px 10px}
.circ span{width:auto;height:118px;border-radius:0;background:transparent;overflow:visible;align-items:flex-end}
.circ span img{height:100%;width:auto;max-width:100%;margin:0;object-fit:contain}
.circ.pc span{height:92px}
.circ.pc span img{height:100%;width:auto;object-fit:contain;border-radius:8px}
.circ:hover span{transform:translateY(-3px)}
.mega-side a[data-cat]{cursor:pointer}

nav.main{align-items:center;height:68px}
nav.main > a{display:flex;align-items:center;height:68px;padding:0}
nav.main a.on::after{bottom:14px}
.circ{min-width:0}
.circ{font-size:11px;line-height:1.25}
.circ.pc{max-width:96px}
.circ.pc{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.circ.pc span{display:flex;justify-content:center}

.mega a.on::after,.mega a::after{display:none!important}
.mega a{font-weight:400}

.prod .acts .btn{white-space:nowrap;flex:0 0 auto}
.prod .acts a.code{overflow:hidden;text-overflow:ellipsis}

/* ===== Révision 4 (retours du 12 nov.) ===== */
/* « Tenues » n'est plus barré : le lien du menu déroulant a la même hauteur que les autres */
.has-mega > a{display:flex;align-items:center;height:68px;padding:0}
/* Cartes de tenue : toutes la même taille (même cadre portrait), Mima calée en bas ; les pièces passent toujours devant */
.card .pic{aspect-ratio:3/4.6;display:block}
.card .pic img{position:absolute!important;left:0;right:0;bottom:0;top:auto;margin:0 auto;height:96%!important;width:100%!important;object-fit:contain;object-position:center bottom;z-index:1}
.card .pieces{z-index:3}
.card .code,.card .heart{z-index:4}
.card h3{min-height:2.5em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* Page tenue : vignettes sans fond */
.look .thumbs > *{background:transparent!important}
/* Essayage : la tenue choisie est encadrée sans être coupée par la zone qui défile */
.pickgrid{padding:4px}
.pickgrid button.on{outline:0;box-shadow:inset 0 0 0 3px var(--rose)!important;border-radius:12px}
.pickgrid button img{object-fit:contain}
/* Titres très grands : un peu d'air entre les lignes */
h1.display{line-height:.98}
/* Banderole de toutes les tenues (en bas de chaque page) */
.parade{overflow:hidden;padding:18px 0 6px;border-top:1px solid var(--line);margin-top:30px;-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.parade .track{display:flex;gap:14px;width:max-content;animation:parade 60s linear infinite}
.parade:hover .track{animation-play-state:paused}
.parade a{display:block;flex:0 0 auto;transition:transform .3s}
.parade a:hover{transform:translateY(-6px)}
.parade img{height:var(--ph,120px);width:auto;display:block}
.parade.big{--ph:220px}
@keyframes parade{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.parade .track{animation:none}}
/* Pied de page : réseaux et lien en bio */
.socials-f{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.socials-f a{display:inline-flex!important;align-items:center;gap:6px;border-radius:999px;padding:7px 12px;box-shadow:inset 0 0 0 1px var(--line);font-size:12px;font-weight:700;color:var(--ink)!important}
.socials-f a:hover{background:var(--rose);color:#fff!important;box-shadow:none}
.socials-f svg{width:14px;height:14px}

[hidden]{display:none!important}

/* ===== Révision 5 (retours du 12 nov., nuit) ===== */
/* En-tête : loupe qui ouvre le champ de recherche ; boutons ronds de même taille ; FR / EN sur une ligne */
.tools{gap:10px}
.icon{width:40px;height:40px;flex:0 0 40px;color:var(--ink);border:0;cursor:pointer;padding:0}
.icon:hover{color:var(--rose)}
.lang{white-space:nowrap;font-weight:400;color:var(--muted)}.lang b{color:var(--ink)}
.srch{display:flex;align-items:center;gap:0;position:relative}
.srch input{width:0;opacity:0;border:0;padding:0;height:40px;border-radius:999px;font:inherit;font-size:13px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);transition:width .3s,opacity .2s,padding .3s;margin-right:6px}
.srch.open input{width:240px;opacity:1;padding:0 16px}
/* Cartes : code MIMA au-dessus du titre (plus sur l'image) ; Mima plus grande ; 4 tenues par ligne */
.kcode{display:block;font-size:11px;font-weight:800;letter-spacing:.1em;color:var(--rose);margin:8px 0 2px}
.card .pic{aspect-ratio:3/4.4}
.card .pic img{height:100%!important}
.shop .grid{grid-template-columns:repeat(4,1fr)!important;gap:34px 22px}
.row{grid-auto-columns:calc((100% - 54px)/4)}
/* Portants : code centré sous la tenue */
.rcard .code{top:auto;bottom:-30px;left:50%;transform:translateX(-50%);box-shadow:none;background:transparent;color:var(--muted);letter-spacing:.08em;white-space:nowrap}
.rcard.on .code{color:var(--rose)}
/* Banderole : même espace au-dessus et en dessous, et le pied de page colle dessous */
.parade{padding:22px 0;margin-top:40px;border-bottom:1px solid var(--line)}
.parade + footer{margin-top:0;border-top:0}
/* Pied de page : icônes des réseaux, sans espace perdu */
.socials-f{gap:6px;margin-top:12px}
.socials-f a{width:38px;height:38px;padding:0!important;justify-content:center;border-radius:50%;margin:0!important;color:var(--ink)!important}
.socials-f svg{width:18px;height:18px}
footer{padding:44px 0 26px}
footer .cols{align-items:start}
footer .legal{margin-top:24px}

/* Essayage : la tenue choisie a un gribouillis rose derrière elle, sans cadre */
.pickgrid button.on{box-shadow:none!important;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 160'%3E%3Cpath d='M58 18c-26 2-44 26-42 58 2 34 22 62 50 64 28 2 44-28 42-62-2-30-20-58-46-58-20 0-34 14-36 30' fill='none' stroke='%23e6a6ae' stroke-width='7' stroke-linecap='round'/%3E%3Cpath d='M96 20l6-10M104 30l12-4M100 10l2-8' stroke='%23742d43' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") center/86% 96% no-repeat!important}
.pickgrid button.on img{transform:scale(1.04)}
.pickgrid button img{transition:transform .25s}

/* ===== Téléphone et tablette ===== */
.burger{display:none;border:0;background:none;width:40px;height:40px;padding:9px 8px;flex-direction:column;justify-content:space-between;cursor:pointer}
.burger span{display:block;height:2px;background:var(--ink);border-radius:2px;transition:.25s}
@media (max-width:1100px){
  .shop .grid{grid-template-columns:repeat(3,1fr)!important}
  nav.main{gap:12px;font-size:13px}
}
@media (max-width:900px){
  .burger{display:flex}
  header.top .wrap{gap:10px}
  .logo{font-size:22px}
  /* Menu : panneau qui glisse depuis la gauche */
  nav.main{display:flex!important;position:fixed;top:0;left:0;bottom:0;width:min(84vw,340px);height:auto!important;flex-direction:column;align-items:stretch!important;gap:0;background:var(--cream);z-index:80;padding:80px 22px 30px;transform:translateX(-102%);transition:transform .3s;box-shadow:20px 0 60px rgba(0,0,0,.15);overflow:auto;font-size:18px}
  nav.main > a,nav.main .has-mega > a{height:auto!important;padding:14px 0!important;border-bottom:1px solid var(--line)}
  nav.main a.on::after{display:none}
  .has-mega{height:auto!important;display:block}
  .has-mega .mega{display:none!important}
  body.menu-open nav.main{transform:none}
  body.menu-open::after{content:"";position:fixed;inset:0;background:rgba(40,36,31,.35);z-index:70}
  body.menu-open .burger{position:relative;z-index:90}
  body.menu-open .burger span:nth-child(1){transform:translateY(9px) rotate(45deg)}
  body.menu-open .burger span:nth-child(2){opacity:0}
  body.menu-open .burger span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}
  .lang{display:none}
  .srch.open input{width:min(52vw,220px)}
  .tools{gap:6px}
  /* Accueil */
  .hero .wrap{height:520px}
  .hero .stage{height:470px}.hero .stage img{height:420px}.hero .stage img:nth-child(1),.hero .stage img:nth-child(3){height:340px}
  .hero .copy{left:16px;right:16px;bottom:18px;max-width:none;background:rgba(252,250,247,.85);padding:12px;border-radius:16px}
  .hero .copy h2{font-size:34px!important}
  .hero .codes{display:none}
  .head{flex-wrap:wrap}.head h2{font-size:38px}
  .tiles{grid-template-columns:1fr 1fr}.tile{height:300px}.tile .word{font-size:44px}
  .products{grid-template-columns:repeat(2,1fr)}
  .mosaic{columns:2}
  .news .txt{padding:28px}.news h2{font-size:42px}.news form{flex-direction:column}.news .pics img{height:240px}
  .feat{grid-template-columns:1fr;gap:14px;min-height:0}.feat-stage{height:440px}
  .feat-wins{overflow-x:auto;justify-content:flex-start}
  /* Grilles de tenues */
  .shop .grid,.grid{grid-template-columns:repeat(2,1fr)!important;gap:22px 12px}
  .row{grid-auto-columns:46%}
  .side-filters{position:static!important;max-height:none!important}
  .shop > aside details:not([open]){margin-bottom:0}
  h1.display{font-size:44px!important}
  /* Page tenue */
  .look{grid-template-columns:1fr;gap:20px}.look .stage{height:520px}.look aside{position:static}.look h1{font-size:32px}
  .look .thumbs{overflow-x:auto}
  .wear{grid-template-columns:1fr}
  /* Portants */
  .rk{grid-template-columns:1fr!important}.rack{height:400px!important}.rk-head h2{font-size:30px!important}
  /* Essayage, garde-robe, compte, journal */
  .fit{grid-template-columns:1fr}
  .boards{grid-template-columns:1fr 1fr}
  .prods-w{grid-template-columns:repeat(2,1fr)!important}
  .acc{grid-template-columns:1fr!important}.acc-nav{position:static!important;flex-direction:row!important;overflow-x:auto;gap:4px}.acc-nav a{white-space:nowrap}
  .f2{grid-template-columns:1fr!important}
  .how{grid-template-columns:1fr!important}
  .ab{grid-template-columns:1fr!important;min-height:0!important}.ab-mima{height:420px!important}
  /* Pied de page */
  footer .cols{grid-template-columns:1fr 1fr;gap:24px}
  footer .cols > div:first-child{grid-column:1/-1}
  footer .legal{flex-direction:column;padding-bottom:70px}
  .parade{--ph:90px}.parade.big{--ph:160px}
  .mock-nav{font-size:11px;bottom:8px}
  .phone{width:auto;margin:16px;border-radius:28px}
}
@media (max-width:520px){
  .wrap{padding:0 16px}
  .tiles{grid-template-columns:1fr 1fr;gap:10px}.tile{height:240px}.tile .word{font-size:32px}
  .head h2{font-size:32px}
  .hero .giant{font-size:96px}
  .credits li{grid-template-columns:28px 52px 1fr auto;gap:8px}.credits img{width:52px;height:52px}
  .feat-side h3{font-size:28px}
}

.filt-btn{display:none}
@media (max-width:900px){
  body.menu-open header.top{z-index:100}
  header.top{z-index:60}
  /* Accueil : le texte passe sous les tenues */
  .hero .wrap{height:auto!important;padding-top:10px;padding-bottom:20px}
  .hero .giant{position:relative;top:0}.hero .giant.two{display:none}
  .hero .stage{position:relative;height:380px}.hero .stage img{height:360px}.hero .stage img:nth-child(1),.hero .stage img:nth-child(3){height:290px}
  .hero .copy{position:static;background:none;padding:14px 0 0}
  /* Catalogue : filtres repliés derrière un bouton */
  .filt-btn{display:flex;width:100%;justify-content:center;margin-bottom:12px}
  .side-filters{display:none}
  .side-filters.show{display:block}
}
@media (max-width:900px){header.top{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--cream)}}

/* ===== Révision 6 (13 nov.) ===== */
/* Code MIMA : pastille blanche, au-dessus du titre */
.kcode{display:inline-block;background:#fff;color:var(--ink);border-radius:999px;padding:4px 10px;font-size:11px;font-weight:800;letter-spacing:.08em;box-shadow:0 1px 5px rgba(40,36,31,.1);margin:10px 0 6px}
/* Catalogue et rangées : Mima environ 25 % plus grande */
.card .pic{aspect-ratio:3/5.4}
/* Portants : pastille centrée sous la tenue ; fondu sur les bords ; têtes jamais coupées ; hauteur fixe */
.rcard .code{background:#fff;color:var(--ink);box-shadow:0 1px 5px rgba(40,36,31,.1);padding:3px 9px;border-radius:999px}
.rcard.on .code{color:var(--rose)}
.rack{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 84%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 84%,transparent 100%)}
.rk{align-items:start!important}
.rk .panel{min-height:540px;align-content:start}
.rk .panel h3{min-height:2.3em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rk .panel .piece b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* Infolettre : plus douce, dans la palette (papier rosé), Mima qui ne touche plus le haut */
.news{background:#f4e9e6;color:var(--ink);border-radius:28px;box-shadow:inset 0 0 0 1px var(--line)}
.news h2{color:var(--ink)}
.news .pics{background:transparent;padding-top:34px;align-items:flex-end}
.news .pics img{height:320px}
.news input{box-shadow:inset 0 0 0 1px var(--line)}

/* Essayage : croquis au crayon (traits irréguliers, hachures) derrière la tenue choisie */
.pickgrid button.on{background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 160%22 fill=%22none%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M61 14c-21-3-41 14-45 42-5 33 9 70 37 86 24 13 49-6 52-38 3-34-11-71-36-86-9-5-21-4-29 3%22 stroke=%22%23d98f9a%22 stroke-width=%222.4%22/%3E%3Cpath d=%22M57 19c-19 1-36 20-37 46-1 31 14 63 39 73 22 8 42-12 43-42 1-29-15-63-37-74-11-5-24-2-31 8%22 stroke=%22%23742d43%22 stroke-width=%221.3%22 opacity=%22.75%22/%3E%3Cpath d=%22M66 12c-25-1-47 21-48 49%22 stroke=%22%23d98f9a%22 stroke-width=%221.6%22 opacity=%22.8%22/%3E%3Cpath d=%22M22 128l9-7M27 134l12-9M33 139l11-8M86 132l9-8M90 138l10-9%22 stroke=%22%23e6a6ae%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M98 16l1 12M93 22l11 0M95 18l7 8M102 18l-7 8%22 stroke=%22%23742d43%22 stroke-width=%221.5%22/%3E%3C/svg%3E") center/92% 98% no-repeat!important}

/* Petites fenêtres à droite */
.pops{position:fixed;right:18px;bottom:78px;z-index:65;display:flex;flex-direction:column;gap:10px;width:310px;pointer-events:none}
.pop{pointer-events:auto;position:relative;background:#fff;border-radius:18px;padding:16px 16px 14px;box-shadow:0 14px 40px rgba(40,36,31,.16),inset 0 0 0 1px var(--line);display:flex;flex-direction:column;gap:6px;animation:popin .45s cubic-bezier(.2,.8,.2,1)}
.pop.out{opacity:0;transform:translateX(30px);transition:.3s}
@keyframes popin{from{opacity:0;transform:translateX(40px)}}
.pop .x{position:absolute;top:6px;right:8px;border:0;background:none;font-size:20px;line-height:1;color:var(--muted);cursor:pointer}
.pop b{font-size:15px;line-height:1.25;padding-right:14px}
.pop .btn{padding:7px 12px;font-size:12px;align-self:flex-start;margin-top:4px}
.pop-row{display:grid;grid-template-columns:62px 1fr;gap:12px;align-items:center}
.pop-row img{height:96px;width:62px;object-fit:contain}
.pop-row > div{display:flex;flex-direction:column;gap:3px}
.pop-f{display:flex;gap:6px;margin-top:4px}.pop-f input{flex:1;min-width:0;border:0;border-radius:999px;padding:9px 12px;font:inherit;font-size:13px;box-shadow:inset 0 0 0 1px var(--line)}
.pop-f .btn{margin:0}
@media (max-width:600px){.pops{left:12px;right:12px;width:auto;bottom:66px}}