/* ===== Identité lucashroll / Parhelion — Playfair + DM Sans, noir + doré ===== */
:root{
  --bg:#080808; --fg:#fafafa; --card:#0f0f0f; --muted:#1f1f1f; --muted-fg:#999;
  --accent:hsl(35 80% 50%); --line:rgba(255,255,255,.10); --radius:4px;
  --serif:'Playfair Display', serif; --sans:'DM Sans', system-ui, sans-serif;
}
*{box-sizing:border-box;}
html,body{margin:0;}
body{font-family:var(--sans);color:var(--fg);background:var(--bg);-webkit-font-smoothing:antialiased;}
::selection{background:var(--accent);color:var(--bg);}
a{color:inherit;text-decoration:none;}

nav{display:flex;align-items:center;justify-content:space-between;padding:18px 28px;border-bottom:1px solid var(--line);
    position:sticky;top:0;background:rgba(8,8,8,.82);backdrop-filter:blur(8px);z-index:30;}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:1px;font-size:18px;}
.brand .mk{width:22px;height:22px;border:2px solid var(--accent);border-radius:3px;position:relative;flex:0 0 auto;}
.brand .mk:after{content:"";position:absolute;inset:4px;background:var(--accent);border-radius:1px;}
.navlinks{display:flex;align-items:center;gap:24px;font-size:13px;color:var(--muted-fg);}
.navlinks a{color:var(--muted-fg);letter-spacing:.5px;transition:color .2s;}
.navlinks a:hover{color:var(--accent);}
@media (max-width:600px){.navlinks .hideMob{display:none;}}

.kicker{color:var(--accent);text-transform:uppercase;letter-spacing:.3em;font-size:12px;font-weight:600;}
.hd{text-align:center;padding:54px 24px 22px;}
.hd h1{font-family:var(--serif);font-weight:800;letter-spacing:-.02em;font-size:clamp(40px,7vw,76px);margin:14px 0 8px;line-height:1;}
.hd p{color:var(--muted-fg);font-size:15px;margin:0 auto 18px;max-width:520px;}
.filter{font-family:var(--sans);font-size:15px;padding:12px 16px;border:1px solid var(--line);border-radius:var(--radius);
        width:240px;text-align:center;background:#0a0a0a;color:var(--fg);outline:none;}
.filter:focus{border-color:var(--accent);}
.filter::placeholder{color:#5a5a5a;}

.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));max-width:1000px;margin:24px auto 50px;padding:0 24px;}
.card{cursor:pointer;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:border-color .25s,transform .2s;display:block;}
.card:hover{border-color:rgba(230,160,40,.4);transform:translateY(-3px);}
.media{position:relative;aspect-ratio:3/4;background:#000;overflow:hidden;filter:grayscale(1) contrast(1.04);transition:filter .5s;}
.card:hover .media,.card.active .media{filter:none;}
.media img,.media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.media video{opacity:0;transition:opacity .3s;}
.card:hover .media video,.card.active .media video{opacity:1;}
.media .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .25s;}
.media .play span{width:54px;height:54px;border-radius:50%;background:rgba(255,255,255,.2);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;font-size:17px;color:#fff;}
.card:hover .media .play{opacity:0;}
.meta{padding:13px 14px;}
.meta .nm{font-family:var(--serif);font-size:21px;font-weight:700;line-height:1.05;transition:color .2s;}
.card:hover .meta .nm{color:var(--accent);}
.meta .row{display:flex;align-items:center;justify-content:space-between;margin-top:5px;}
.meta .num{color:var(--accent);font-size:12px;letter-spacing:.18em;font-weight:600;}
.meta .cnt{font-size:11px;color:var(--muted-fg);text-transform:uppercase;letter-spacing:.1em;}
.empty{text-align:center;color:var(--muted-fg);margin:40px auto;}

.page{padding:40px 28px 56px;max-width:1000px;margin:0 auto;}
.back{display:inline-flex;align-items:center;gap:8px;color:var(--muted-fg);font-size:13px;cursor:pointer;transition:color .2s;margin-bottom:20px;}
.back:hover{color:var(--accent);}
.ridhead{display:flex;align-items:flex-end;gap:18px;border-bottom:1px solid var(--line);padding-bottom:22px;margin-bottom:26px;}
.ridhead .num{color:var(--accent);text-transform:uppercase;letter-spacing:.28em;font-size:12px;font-weight:600;}
.ridhead h2{font-family:var(--serif);font-weight:800;letter-spacing:-.02em;margin:6px 0 0;font-size:clamp(30px,5vw,52px);line-height:1;}
.ridhead .sub{color:var(--muted-fg);font-size:13px;margin-top:8px;}

.clips{display:grid;gap:26px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));}
.clip .vid{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden;border-radius:var(--radius);}
.clip .vid video{width:100%;height:100%;object-fit:cover;display:block;}
.clip .vid .wm{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);text-align:center;font-family:var(--serif);font-weight:700;letter-spacing:.22em;font-size:24px;color:rgba(255,255,255,.22);pointer-events:none;}
.clip .body{margin-top:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:16px;gap:12px;}
.clip .body .t{font-family:var(--serif);font-size:22px;font-weight:600;text-transform:capitalize;transition:color .2s;}
.clip:hover .body .t{color:var(--accent);}
.clip .body .price{font-size:12px;color:var(--muted-fg);text-transform:uppercase;letter-spacing:.1em;margin-top:3px;}
.buy{font-family:var(--sans);border:none;border-radius:var(--radius);padding:11px 18px;font-weight:700;font-size:13px;background:var(--accent);color:#1a1206;cursor:pointer;white-space:nowrap;transition:opacity .2s;}
.buy:hover{opacity:.88;}.buy:active{transform:translateY(1px);}

.success{text-align:center;max-width:520px;margin:56px auto;padding:0 24px;}
.success h2{font-family:var(--serif);font-weight:800;font-size:clamp(32px,5vw,52px);margin:12px 0;}
.success p{color:var(--muted-fg);line-height:1.6;}
.success p b{color:var(--fg);}
.dl{display:inline-flex;align-items:center;gap:10px;margin-top:22px;background:var(--accent);color:#1a1206;border:none;border-radius:var(--radius);padding:15px 26px;font-size:15px;font-weight:700;cursor:pointer;}
.dl:hover{opacity:.9;}

/* ===== Panier (find.html) — à ajouter à la fin de style.css ===== */
.addbtn{font-family:var(--sans);border:1px solid var(--accent);background:transparent;color:var(--accent);
  border-radius:var(--radius);padding:11px 18px;font-weight:700;font-size:13px;cursor:pointer;white-space:nowrap;transition:.2s;}
.addbtn:hover{background:var(--accent);color:#1a1206;}
.addbtn.in{background:var(--accent);color:#1a1206;}
.cartbar{position:fixed;left:0;right:0;bottom:0;transform:translateY(130%);
  transition:transform .35s cubic-bezier(.65,.05,.25,1);background:rgba(15,15,15,.96);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line);
  padding:14px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px;z-index:50;}
.cartbar.show{transform:translateY(0);}
.cartbar .info{font-size:14px;color:var(--fg);}
.cartbar .info b{font-family:var(--serif);font-size:18px;color:var(--accent);}
.cartbar .sub2{color:var(--muted-fg);font-size:12px;margin-top:2px;}
body{padding-bottom:84px;}
