/* ================================================================
 KREYASYONPEYI — MASTER DESIGN SYSTEM LOCKED V1
 NE PAS MODIFIER POUR CHANGER UN ARTISTE OU UNE OEUVRE.
 Les contenus/images sont dans /data/*.js
 ================================================================ */
:root{
  --kp-green:#073d2c;
  --kp-green-2:#0a4a35;
  --kp-green-dark:#052e22;
  --kp-copper:#c36f28;
  --kp-gold:#d6a52e;
  --kp-ink:#191a16;
  --kp-muted:#66675f;
  --kp-white:#fff;
  --kp-line:rgba(34,35,29,.12);
  --kp-panel:rgba(255,255,255,.955);
  --kp-panel-soft:rgba(255,255,255,.88);
  --kp-shadow:0 18px 52px rgba(21,17,9,.19);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; color:var(--kp-ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:#201509; min-height:100vh;
}
body::before{
  content:"";position:fixed;inset:-45px;z-index:-5;
  background:
    linear-gradient(rgba(31,22,12,.22),rgba(31,22,12,.24)),
    var(--page-bg) center/cover no-repeat;
  filter:blur(31px) saturate(.82) brightness(.66);
  transform:scale(1.11);
}
body::after{
  content:"";position:fixed;inset:0;z-index:-4;pointer-events:none;
  background:
    radial-gradient(circle at 16% 88%,rgba(255,255,255,.65),transparent 32%),
    radial-gradient(circle at 90% 18%,rgba(16,72,47,.12),transparent 30%),
    linear-gradient(to bottom,rgba(10,7,3,.12) 0 28%,rgba(255,255,255,.03) 56%,rgba(255,255,255,.56) 100%);
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
button,input,select{font:inherit}
.kp-shell{width:min(1110px,calc(100% - 44px));margin:18px auto 30px}
.kp-nav{
  height:62px;border-radius:16px;background:rgba(255,255,255,.96);
  border:1px solid rgba(255,255,255,.75);box-shadow:0 10px 30px rgba(0,0,0,.12);
  display:flex;align-items:center;justify-content:space-between;padding:0 22px 0 25px;
  backdrop-filter:blur(14px);position:relative;z-index:20
}
.kp-logo{font:italic 700 21px Georgia,serif}
.kp-logo small{display:block;font:500 7px Inter,system-ui;margin-top:2px;color:#565b53}
.kp-navlinks{display:flex;gap:30px;align-items:center;font-size:11px}
.kp-navlinks .active{border-bottom:2px solid var(--kp-green);padding-bottom:7px}
.kp-pill{background:var(--kp-green);color:#fff;border-radius:999px;padding:11px 21px;font-size:10px;font-weight:800}
.kp-panel{
  background:var(--kp-panel);border:1px solid rgba(255,255,255,.8);
  box-shadow:var(--kp-shadow);backdrop-filter:blur(18px);border-radius:14px
}
.kp-title{font:700 28px/1.05 Georgia,serif;margin:0}
.kp-kicker{font-size:8px;font-weight:800;letter-spacing:.16em;color:var(--kp-copper)}
.kp-muted{color:var(--kp-muted)}
.kp-btn{display:inline-flex;align-items:center;justify-content:center;border-radius:7px;padding:12px 17px;font-size:9px;font-weight:800;border:1px solid var(--kp-line)}
.kp-btn.primary{background:var(--kp-green);color:white;border-color:var(--kp-green)}
.kp-btn.secondary{background:white}
.kp-footer{
  margin-top:14px;padding:32px 36px 18px;background:rgba(255,255,255,.91);
  border-radius:13px;box-shadow:0 14px 35px rgba(0,0,0,.10);backdrop-filter:blur(15px);
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:38px
}
.kp-footer h4{font:800 8px Inter,system-ui;letter-spacing:.14em;margin:0 0 10px}
.kp-footer p,.kp-footer a{font-size:8px;line-height:1.65;color:#44483f}
.kp-footer-brand{font:italic 700 17px Georgia,serif}
.kp-footer-bottom{grid-column:1/-1;border-top:1px solid var(--kp-line);padding-top:11px;margin-top:10px;display:flex;justify-content:space-between;font-size:7px;color:#70736c}

/* CREATOR DETAIL */
.creator-hero{height:390px;position:relative;overflow:hidden}
.creator-hero .bg{position:absolute;inset:0;background:var(--hero-bg) center/cover no-repeat}
.creator-hero .shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,6,3,.83),rgba(10,7,3,.42) 28%,rgba(7,5,2,.05) 54%,rgba(5,26,17,.48) 77%,rgba(3,20,13,.67))}
.creator-hero .identity{position:absolute;z-index:2;left:30px;top:62px;width:290px;color:white}
.creator-hero h1{font:700 47px/.88 Georgia,serif;letter-spacing:-.035em;margin:0 0 9px}
.creator-brand{font:700 23px Georgia,serif;color:var(--kp-copper);margin-bottom:9px}
.creator-craft{font:800 12px Georgia,serif;text-transform:uppercase;margin-bottom:17px}
.creator-meta{display:grid;gap:13px;font-size:9px}
.creator-quote{position:absolute;z-index:2;right:27px;top:38px;width:284px;color:white;padding:24px;border-radius:11px;background:linear-gradient(145deg,rgba(8,65,45,.95),rgba(6,45,32,.91));border:1px solid rgba(255,255,255,.30)}
.creator-quote blockquote{font:italic 700 16px/1.5 Georgia,serif;margin:10px 0 9px}
.creator-tags{display:flex;gap:7px;flex-wrap:wrap;margin:14px 0;border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:13px}
.creator-tag{font-size:7px;padding:6px 9px;background:rgba(255,255,255,.13);border-radius:999px}
.creator-main{overflow:hidden;border-radius:14px}
.creator-story{padding:24px;display:grid;grid-template-columns:235px 1fr;gap:22px;border-bottom:1px solid var(--kp-line)}
.creator-story p{font-size:9px;line-height:1.72}
.creator-story-images{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.creator-story-images img{width:100%;height:176px;object-fit:cover;border-radius:7px}
.creator-creations{padding:23px 24px 25px;display:grid;grid-template-columns:1fr 210px;gap:20px}
.creator-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.creator-works{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}
.creator-work{background:white;border:1px solid var(--kp-line);border-radius:8px;overflow:hidden}
.creator-work img{width:100%;height:106px;object-fit:cover}
.creator-work .body{padding:9px}
.creator-work h3{font:700 10px/1.25 Georgia,serif;margin:0 0 8px}
.creator-work .price{display:inline-block;font-size:7px;font-weight:800;background:var(--kp-green);color:white;border-radius:999px;padding:4px 7px}
.creator-contact{padding:17px;border:1px solid var(--kp-line);border-radius:9px;background:rgba(255,255,255,.83)}
.creator-contact h3{font:700 17px Georgia,serif;margin:0 0 12px}
.creator-contact p{font-size:8px;line-height:1.6}
.creator-around{margin-top:14px;padding:23px 24px}
.creator-around-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:16px}
.creator-around-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:12px}
.creator-around-card{min-height:130px;border-radius:9px;border:1px solid var(--kp-line);padding:15px;background:rgba(255,255,255,.80)}
.creator-around-card.dark{background:linear-gradient(145deg,#0a4b35,#063420);color:white}
.creator-around-card h3{font:700 14px Georgia,serif;margin:6px 0 10px}
.creator-around-card p{font-size:7px;line-height:1.55;margin:0}

/* CREATORS INDEX */
.index-hero{height:300px;position:relative;overflow:hidden}
.index-hero .photo{position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.90) 0 35%,rgba(255,255,255,.48) 55%,rgba(255,255,255,.05) 100%),var(--index-hero) center/cover no-repeat}
.index-hero .copy{position:absolute;left:38px;top:68px;width:420px}
.index-hero h1{font:700 43px Georgia,serif;margin:0 0 8px}
.index-hero h2{font:700 16px Georgia,serif;margin:0 0 16px}
.index-hero p{font-size:10px;line-height:1.7;width:330px}
.index-values{display:grid;grid-template-columns:repeat(4,1fr);padding:22px 28px;border-top:1px solid var(--kp-line);border-bottom:1px solid var(--kp-line)}
.index-value{display:grid;grid-template-columns:48px 1fr;gap:10px;align-items:center;padding:0 17px;border-right:1px solid var(--kp-line)}
.index-value:last-child{border-right:0}
.index-value .icon{font-size:28px;color:var(--kp-green)}
.index-value b{font:700 11px Georgia,serif}
.index-value p{font-size:7px;line-height:1.45;margin:5px 0 0}
.directory{padding:25px 28px 28px}
.directory-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;gap:14px}
.directory-controls{display:flex;gap:8px}
.directory-controls input,.directory-controls select{height:34px;border:1px solid var(--kp-line);border-radius:7px;background:white;padding:0 10px;font-size:8px}
.creator-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.creator-card{overflow:hidden;background:white;border:1px solid var(--kp-line);border-radius:9px}
.creator-card>img{width:100%;height:166px;object-fit:cover}
.creator-card .body{padding:11px}
.creator-card .cat{color:var(--kp-copper);font-size:7px;font-weight:900;letter-spacing:.14em}
.creator-card h3{font:700 17px Georgia,serif;margin:5px 0}
.creator-card p{font-size:8px;line-height:1.5;margin:0 0 10px;min-height:38px}
.creator-card .location{font-size:8px;margin-bottom:10px}
.creator-miniworks{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:10px}
.creator-miniworks img{height:54px;width:100%;object-fit:cover;border-radius:4px}
.creator-card .discover{font-size:8px;font-weight:800;color:var(--kp-green)}
.creator-cta{margin-top:17px;border-radius:10px;padding:22px 32px;background:linear-gradient(110deg,#0a4a35,#063923);color:white;display:flex;align-items:center;justify-content:space-between}
.creator-cta h3{font:700 19px Georgia,serif;margin:0 0 5px}
.creator-cta p{font-size:8px;margin:0}

/* CREATION DETAIL */
.creation-wrap{padding:25px 28px 30px}
.creation-topbar{display:flex;justify-content:space-between;align-items:center;margin:4px 0 18px;font-size:9px}
.creation-hero{display:grid;grid-template-columns:250px 1fr;gap:26px}
.creation-info{padding:20px 0}
.creation-info h1{font:700 38px Georgia,serif;margin:0 0 18px}
.creation-artist{font:800 13px Georgia,serif;margin-bottom:6px}
.creation-info p{font-size:9px;line-height:1.6}
.creation-price{font:700 22px Georgia,serif;margin:18px 0 4px}
.creation-fields{margin-top:25px}
.creation-field{padding:9px 0;border-bottom:1px solid var(--kp-line);font-size:8px}
.creation-field b{display:block;font-size:8px;margin-bottom:3px}
.creation-cert{margin-top:20px;padding:14px;border-radius:8px;background:#f1ece3;font-size:8px;line-height:1.5}
.creation-gallery-main{width:100%;height:565px;object-fit:cover;border-radius:8px}
.creation-thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.creation-thumbs img{width:100%;height:130px;object-fit:cover;border-radius:7px}
.creation-tabs{margin:32px 15px 0;border-top:1px solid transparent}
.creation-tabnav{display:flex;gap:50px;border-bottom:1px solid var(--kp-line);padding-left:15px}
.creation-tabnav span{padding:12px 0;font-size:10px}
.creation-tabnav .active{color:var(--kp-green)}
.creation-description{padding:25px 15px 18px;font-size:10px;line-height:1.75;max-width:700px}
.creation-values{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:20px 10px 35px}
.creation-value{display:grid;grid-template-columns:42px 1fr;gap:10px}
.creation-value .icon{font-size:26px;color:var(--kp-green)}
.creation-value b{font:700 11px Georgia,serif}
.creation-value p{font-size:7px;line-height:1.5;margin:5px 0 0}
.related{margin-top:14px;padding:28px;background:linear-gradient(110deg,#113e2a,#092f22);color:white;border-radius:14px}
.related h2{font:700 24px Georgia,serif;margin:0 0 18px}
.related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.related-card img{width:100%;height:175px;object-fit:cover;border-radius:8px}
.related-card h3{font:700 11px Georgia,serif;margin:9px 0 3px}
.related-card p{font-size:8px;margin:2px 0;color:#e2e7e2}

@media(max-width:900px){
  .kp-shell{width:min(100% - 20px,1110px)}
  .kp-navlinks{display:none}
  .creator-hero{height:660px}
  .creator-hero .identity{top:55px;left:22px}
  .creator-quote{left:22px;right:22px;top:auto;bottom:20px;width:auto}
  .creator-story,.creator-creations,.creation-hero{grid-template-columns:1fr}
  .creator-around-grid,.creator-grid,.related-grid{grid-template-columns:1fr 1fr}
  .index-values{grid-template-columns:1fr 1fr}
  .directory-head{display:block}.directory-controls{margin-top:12px;flex-wrap:wrap}
  .creation-gallery-main{height:auto}
  .kp-footer{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .creator-story-images,.creator-works,.creator-around-grid,.creator-grid,.related-grid,.creation-values,.index-values{grid-template-columns:1fr}
  .kp-footer{grid-template-columns:1fr}
  .index-hero .copy{left:22px;width:85%}
}