/* ============ TOKENS ============
     Shared by every press kit. Same tokens, type and components as the
     main site (index.html); each kit only swaps the orange gel for its
     own colour: pink for music, cyan for events (see bottom of :root). */
  :root{
    --bg:        #0B0A0A;
    --bg-1:      #131211;
    --bg-2:      #1B1917;
    --line:      rgba(245,241,234,0.10);
    --line-2:    rgba(245,241,234,0.18);
    --ink:       #F4F0E8;
    --ink-dim:   #A79E90;
    --ink-faint: #6E675C;
    --pink:      #FF3D9A;
    --pink-2:    #FF9CCB;
    --cyan:      #1EF0D8;
    --cyan-2:    #9AFBEF;
    --accent:    var(--pink);
    --accent-2:  var(--pink-2);
    --accent-ink:#1A0010;
    --maxw:      1180px;
    --gutter:    24px;
    color-scheme: dark;
  }

  body.kit-events{--accent:var(--cyan); --accent-2:var(--cyan-2); --accent-ink:#00201C}

  *,*::before,*::after{box-sizing:border-box}
  html{-webkit-text-size-adjust:100%}
  body{
    margin:0;
    padding-inline:max(var(--gutter), env(safe-area-inset-left,0px)) max(var(--gutter), env(safe-area-inset-right,0px));
    background:var(--bg);
    color:var(--ink);
    font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
    font-size:16px;
    line-height:1.55;
    overflow-x:hidden;
  }
  @media (max-width:420px){ :root{--gutter:18px} }
  h1,h2,h3{font-family:'Anton',Impact,'Arial Narrow',sans-serif; font-weight:400; letter-spacing:.01em; text-wrap:balance; margin:0}
  p{margin:0}
  a{color:inherit}
  img{max-width:100%; display:block}
  section{padding-block:88px}
  @media (max-width:640px){ section{padding-block:56px} }
  .wrap{max-width:var(--maxw); margin-inline:auto}
  .eyebrow{
    font:700 12px/1 'Inter',sans-serif; text-transform:uppercase; letter-spacing:.16em;
    color:var(--accent); display:flex; align-items:center; gap:10px;
  }
  .eyebrow::before{content:'';width:22px;height:2px;background:var(--accent);display:inline-block}
  .h2{font-size:clamp(32px,5vw,52px); line-height:1.02; margin-top:14px}
  .lede{font-size:clamp(17px,2vw,20px); color:var(--ink-dim); max-width:62ch; font-weight:400}
  .body{color:var(--ink-dim); font-size:16.5px; max-width:66ch}
  .body strong{color:var(--ink); font-weight:600}
  .stack{display:grid; gap:18px}
  .btn{
    display:inline-flex; align-items:center; gap:10px; justify-content:center;
    font:700 14px/1 'Inter',sans-serif; text-transform:uppercase; letter-spacing:.08em;
    padding:16px 26px; border-radius:2px; border:1.5px solid transparent; cursor:pointer;
    text-decoration:none; transition:transform .15s ease, background .15s ease, border-color .15s ease, color .15s ease;
  }
  .btn:active{transform:scale(.97)}
  .btn-solid{background:var(--accent); color:var(--accent-ink)}
  .btn-solid:hover{background:var(--accent-2)}
  .btn-line{border-color:var(--line-2); color:var(--ink)}
  .btn-line:hover{border-color:var(--accent); color:var(--accent)}
  :focus-visible{outline:2px solid var(--accent); outline-offset:3px}
  @media (prefers-reduced-motion: reduce){
    *{animation-duration:.001ms !important; transition-duration:.001ms !important}
  }
  .skill-chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:26px}
  .skill-chip{
    font:600 12px/1 'Inter'; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-dim);
    border:1px solid var(--line-2); padding:9px 14px; border-radius:2px;
  }

  /* ============ NAV ============ */
  header.nav{
    position:sticky; top:0; z-index:50; padding-block:18px;
    background:linear-gradient(var(--bg) 60%, transparent);
  }
  .nav-row{display:flex; align-items:center; justify-content:space-between; gap:16px}
  .brand{font-family:'Anton'; font-size:20px; letter-spacing:.03em; text-decoration:none; color:var(--ink)}
  .brand span{color:var(--accent)}
  .links{display:flex; gap:28px; list-style:none; margin:0; padding:0}
  .links a{font:600 13px/1 'Inter'; text-transform:uppercase; letter-spacing:.06em; text-decoration:none; color:var(--ink-dim); transition:color .15s}
  .links a:hover{color:var(--accent)}
  @media (max-width:760px){ .links{display:none} }
  .nav-cta{font-size:12px; padding:11px 18px; white-space:nowrap}
  @media (max-width:420px){ .nav-cta{font-size:11px; padding:10px 14px; letter-spacing:.05em} }

  /* ============ HERO ============ */
  .hero{padding-top:36px; padding-bottom:56px}
  .hero-grid{display:grid; grid-template-columns:1fr 1.05fr; gap:48px; align-items:center}
  @media (max-width:900px){ .hero-grid{grid-template-columns:1fr; gap:32px} }
  .hero-name{font-size:clamp(52px,9.2vw,116px); line-height:.95; margin-top:14px}
  .hero-name em{font-style:normal; color:var(--accent)}
  .hero-sub{margin-top:18px; font:700 clamp(16px,2vw,20px)/1.3 'Inter'; text-transform:uppercase; letter-spacing:.06em}
  .hero-copy{margin-top:18px; font-size:clamp(16px,1.8vw,18px); color:var(--ink-dim); max-width:46ch}
  .hero-ctas{display:flex; flex-wrap:wrap; gap:12px; margin-top:30px}
  .hero-photo{
    position:relative; aspect-ratio:3/2; border-radius:4px; overflow:hidden;
    background:var(--bg-1); border:1px solid var(--line);
  }
  .hero-photo img{width:100%; height:100%; object-fit:cover; object-position:50% 30%}
  .hero-photo .tag{
    position:absolute; left:16px; bottom:16px; z-index:2;
    font:700 11px/1 'Inter'; text-transform:uppercase; letter-spacing:.1em; color:#fff;
    background:rgba(11,10,10,.55); backdrop-filter:blur(4px); padding:8px 12px; border-radius:2px;
    border:1px solid rgba(255,255,255,.15);
  }

  /* ============ FACTS ============ */
  .facts{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line)}
  @media (max-width:760px){ .facts{grid-template-columns:repeat(2,minmax(0,1fr))} }
  .fact{background:var(--bg); padding:22px 20px}
  .fact b{display:block; font:400 clamp(36px,5vw,48px)/1 'Anton'; color:var(--accent); font-variant-numeric:tabular-nums}
  .fact span{display:block; margin-top:8px; font:600 12px/1.35 'Inter'; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-dim)}

  /* ============ ABOUT ============ */
  .about-grid{display:grid; grid-template-columns:1.25fr 1fr; gap:56px; align-items:start; margin-top:0}
  @media (max-width:860px){ .about-grid{grid-template-columns:1fr; gap:32px} }
  .about-grid img{width:100%; aspect-ratio:1; object-fit:cover; border-radius:4px; border:1px solid var(--line)}

  /* ============ REPERTOIRE ============ */
  .artists{list-style:none; padding:0; margin:30px 0 0; display:flex; flex-wrap:wrap; gap:4px 26px;
    font:400 clamp(28px,4.4vw,46px)/1.15 'Anton'; text-transform:uppercase; letter-spacing:.01em}
  .artists li:nth-child(odd){color:var(--ink)}
  .artists li:nth-child(even){color:var(--accent)}
  .note{margin-top:30px; padding:18px 20px; border:1px solid var(--line-2); border-radius:2px; color:var(--ink-dim); font-size:15.5px; max-width:66ch}
  .note b{color:var(--ink); font-weight:600}

  /* ============ PHOTOS ============ */
  .gallery{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:18px; margin-top:34px}
  .gallery img{width:100%; height:100%; object-fit:cover; border-radius:4px; border:1px solid var(--line)}
  .g-wide{grid-column:span 4; aspect-ratio:3/2}
  .g-tall{grid-column:span 2; aspect-ratio:3/4.5}
  .g-half{grid-column:span 3; aspect-ratio:3/2}
  .g-third{grid-column:span 2; aspect-ratio:3/4}
  @media (max-width:700px){
    .gallery{grid-template-columns:1fr 1fr; gap:12px}
    .g-wide,.g-half{grid-column:span 2}
    .g-tall{grid-column:span 1; aspect-ratio:3/4}
    .g-third{grid-column:span 1}
    .g-first{grid-column:span 2; aspect-ratio:3/2}
  }

  /* ============ VIDEOS ============ */
  .videos{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-top:34px}
  @media (max-width:860px){ .videos{grid-template-columns:1fr} }
  .vcard{display:block; text-decoration:none; color:var(--ink); border:1px solid var(--line); border-radius:4px; overflow:hidden; background:var(--bg-1); transition:border-color .15s}
  .vcard:hover{border-color:var(--accent)}
  .vthumb{position:relative; aspect-ratio:16/9; background:var(--bg-2)}
  .vthumb img{width:100%; height:100%; object-fit:cover}
  .vthumb::after{content:''; position:absolute; inset:0; background:linear-gradient(0deg, rgba(11,10,10,.55), rgba(11,10,10,.1))}
  .vplay{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:2; width:62px; height:62px; border-radius:50%;
    background:var(--accent); display:grid; place-items:center}
  .vplay::before{content:''; border-left:16px solid var(--accent-ink); border-top:10px solid transparent; border-bottom:10px solid transparent; margin-left:5px}
  .vmeta{padding:16px 18px}
  .vmeta b{display:block; font:400 22px/1.1 'Anton'; letter-spacing:.02em; text-transform:uppercase}
  .vmeta span{display:block; margin-top:6px; font-size:14px; color:var(--ink-dim)}

  /* ============ RIDER ============ */
  .rider{display:grid; grid-template-columns:1.4fr 1fr; gap:40px; align-items:start; margin-top:34px}
  @media (max-width:860px){ .rider{grid-template-columns:1fr; gap:28px} }
  .table-wrap{overflow-x:auto}
  table{width:100%; border-collapse:collapse; font-size:15.5px}
  th,td{text-align:left; padding:14px 12px; border-bottom:1px solid var(--line); vertical-align:top}
  th{font:700 11px/1 'Inter'; text-transform:uppercase; letter-spacing:.14em; color:var(--ink-faint)}
  td.ch{font:400 22px/1 'Anton'; color:var(--accent); font-variant-numeric:tabular-nums; width:56px}
  tr.spare td{color:var(--ink-faint)}
  .box{background:var(--bg-1); border:1px solid var(--line); border-radius:4px; padding:22px 24px}
  .box + .box{margin-top:14px}
  .box h3{font:700 12px/1 'Inter'; text-transform:uppercase; letter-spacing:.16em; color:var(--accent); margin-bottom:14px}
  .box ul{margin:0; padding-left:18px; display:grid; gap:8px; font-size:15.5px; color:var(--ink-dim)}

  /* ============ CONTACT ============ */
  .contact-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; margin-top:34px}
  .cline{display:block; padding:18px 20px; border:1px solid var(--line-2); border-radius:2px; text-decoration:none; color:var(--ink); min-width:0; transition:border-color .15s}
  a.cline:hover{border-color:var(--accent)}
  .cline span{display:block; font:700 11px/1 'Inter'; text-transform:uppercase; letter-spacing:.14em; color:var(--accent)}
  .cline b{display:block; margin-top:10px; font-weight:600; overflow-wrap:anywhere}

  /* ============ FOOTER ============ */
  footer{border-top:1px solid var(--line); padding-block:32px; margin-top:20px}
  .foot-row{display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; font-size:13px; color:var(--ink-faint)}
  .foot-links{display:flex; gap:18px}
  .foot-links a{text-decoration:none; color:var(--ink-faint); transition:color .15s}
  .foot-links a:hover{color:var(--accent)}

  /* ============ PRESS KITS DROPDOWN ============
     Pink = music kit, cyan = events kit. Same block lives in presskit/presskit.css. */
  .pk{position:relative}
  .pk-btn{display:inline-flex; align-items:center; gap:8px; cursor:pointer; white-space:nowrap;
    font:700 12px/1 'Inter',sans-serif; text-transform:uppercase; letter-spacing:.08em; color:var(--ink);
    padding:10px 14px; border-radius:2px; border:1.5px solid transparent;
    background:linear-gradient(var(--bg),var(--bg)) padding-box, linear-gradient(90deg,#FF3D9A,#1EF0D8) border-box;
    transition:box-shadow .15s ease, color .15s ease}
  .pk-btn:hover,.pk.open .pk-btn{color:#fff; box-shadow:0 0 18px rgba(255,61,154,.35), 0 0 18px rgba(30,240,216,.25)}
  .pk-btn svg{width:12px; height:12px; stroke:currentColor; fill:none; stroke-width:2.4; transition:transform .15s}
  .pk.open .pk-btn svg{transform:rotate(180deg)}
  .pk-menu{position:absolute; right:0; top:calc(100% + 12px); width:min(280px, calc(100vw - 32px)); padding:8px; display:none; z-index:60;
    background:var(--bg-1); border:1px solid var(--line-2); border-radius:4px; box-shadow:0 18px 40px rgba(0,0,0,.5)}
  .pk.open .pk-menu{display:grid; gap:4px}
  .pk-menu a{display:flex; align-items:center; gap:12px; padding:13px 14px; border-radius:2px; text-decoration:none; color:var(--ink);
    font:700 13px/1.2 'Inter',sans-serif; text-transform:uppercase; letter-spacing:.06em; transition:background .15s}
  .pk-menu a small{display:block; margin-top:4px; font:500 12px/1.3 'Inter',sans-serif; text-transform:none; letter-spacing:0; color:var(--ink-dim)}
  .pk-menu a i{flex-shrink:0; width:10px; height:10px; border-radius:50%}
  .pk-menu a[data-kit=music] i{background:#FF3D9A; box-shadow:0 0 12px #FF3D9A}
  .pk-menu a[data-kit=events] i{background:#1EF0D8; box-shadow:0 0 12px #1EF0D8}
  .pk-menu a[data-kit=music]:hover{background:rgba(255,61,154,.12)}
  .pk-menu a[data-kit=events]:hover{background:rgba(30,240,216,.10)}
  .pk-menu a[aria-current=page]{background:var(--bg-2)}
  .nav-right{display:flex; align-items:center; gap:12px}
  @media (max-width:420px){ .pk-btn{padding:9px 11px; font-size:11px; letter-spacing:.05em} .brand{font-size:17px} .nav-right{gap:8px} }
  @media (max-width:360px){ .brand{font-size:15px} }
  @media (max-width:480px){ .nav-cta-x{display:none} }

  /* ============ BRAND WALL ============ */
  #clients{padding-block:24px 72px}
  .bw-title{font-size:clamp(40px,6.4vw,72px); line-height:1}
  .bw-title em{font-style:normal; color:var(--accent)}
  .brand-wall{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:30px}
  .bw-tile{position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px;
    min-height:150px; padding:26px 28px; border-radius:6px; background:var(--ink); color:#111;
    transition:transform .2s ease, box-shadow .2s ease}
  .bw-tile:hover{transform:translateY(-3px); box-shadow:0 14px 34px rgba(0,0,0,.45)}
  .bw-logo{display:flex; align-items:center; justify-content:center; width:100%; height:64px}
  .bw-logo img{max-height:100%; max-width:min(100%,220px); width:auto; height:auto; object-fit:contain}
  .bw-name{font:400 clamp(26px,3vw,36px)/1 'Anton',Impact,sans-serif; letter-spacing:.02em; text-transform:uppercase; color:#111; text-align:center}
  .bw-cap{font:700 11px/1.3 'Inter',sans-serif; text-transform:uppercase; letter-spacing:.12em; color:#6b5f52; text-align:center}
  .bw-icon .bw-logo{height:88px}
  .bw-feature{grid-column:span 2; grid-row:span 2; min-height:312px; padding:0; gap:0; justify-content:stretch; overflow:hidden;
    box-shadow:0 0 0 2px var(--accent), 0 0 46px color-mix(in srgb, var(--accent) 28%, transparent)}
  .bw-feature:hover{box-shadow:0 0 0 2px var(--accent), 0 0 60px color-mix(in srgb, var(--accent) 40%, transparent)}
  .bw-feature .bw-logo{flex:1 1 auto; min-height:0; height:auto; padding:28px 32px}
  .bw-feature .bw-logo img{max-width:74%; max-height:82%; width:auto; height:auto; margin:auto}
  .bw-feature .bw-name{font-size:clamp(56px,7vw,96px)}
  .bw-feature .bw-cap{flex:0 0 auto; width:100%; padding:14px 16px;
    background:var(--accent); color:var(--accent-ink); font-size:13px; letter-spacing:.14em}
  .bw-more{display:inline-block; margin-top:22px; font:600 13px/1.4 'Inter',sans-serif; text-transform:uppercase; letter-spacing:.06em;
    color:var(--ink-dim); text-decoration:none; transition:color .15s}
  .bw-more:hover{color:var(--accent)}
  @media (max-width:760px){
    .brand-wall{grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
    .bw-tile{min-height:112px; padding:20px 16px}
    .bw-logo{height:46px}
    .bw-feature{grid-row:span 1; min-height:250px}
    .bw-feature .bw-logo{padding:22px 24px}
    .bw-name{font-size:24px}
    .bw-icon .bw-logo{height:62px}
    .bw-cap{font-size:10px}
  }


  /* client logos (events kit) */
  .logos{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:34px}
  .logos-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  @media (max-width:700px){ .logos{grid-template-columns:repeat(2,minmax(0,1fr))} .logos-3 div{padding:18px 12px; min-height:84px} .logos-3 img{max-height:32px} }
  .logos div{background:var(--bg); display:grid; place-items:center; padding:26px 22px; min-height:104px}
  .logos img{max-height:44px; width:auto; max-width:100%; object-fit:contain; filter:grayscale(1) brightness(1.6); opacity:.8}
  .logos .icon img{max-height:56px}
  .fine{margin-top:14px; font-size:12px; color:var(--ink-faint); max-width:80ch}

  /* services (events kit) */
  .services{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:34px}
  @media (max-width:860px){ .services{grid-template-columns:1fr 1fr} }
  @media (max-width:560px){ .services{grid-template-columns:1fr} }
  .svc{background:var(--bg-1); padding:28px 24px}
  .svc h3{font:700 16px/1.25 'Inter'; text-transform:uppercase; letter-spacing:.02em}
  .svc p{margin-top:10px; color:var(--ink-dim); font-size:14.5px}
  .svc b{display:block; font:400 20px/1 'Anton'; color:var(--accent); margin-bottom:14px}

  /* full-bleed tinted band */
  .band{background:var(--bg-1); margin-inline:calc(-1 * max(var(--gutter), env(safe-area-inset-left,0px))); padding-inline:max(var(--gutter), env(safe-area-inset-left,0px))}

  /* scrolling "also trusted by" strip – same as main site */
  .bw-sub{margin-top:34px; font:700 12px/1 'Inter',sans-serif; text-transform:uppercase; letter-spacing:.16em; color:var(--ink-dim)}
  .clients-marquee{overflow:hidden; margin-top:16px; -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
  .clients-track{display:flex; width:max-content; animation:scroll 34s linear infinite}
  .clients-marquee:hover .clients-track{animation-play-state:paused}
  .client-mark{display:flex; align-items:center; justify-content:center; flex-shrink:0; width:150px; height:80px; margin-inline:7px; padding:16px 20px; border-radius:6px; background:var(--ink); opacity:.92}
  .client-mark img{max-height:100%; max-width:100%; width:auto; height:auto; object-fit:contain}
  .client-mark--icon{padding:8px 20px}
  @keyframes scroll{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
  @media (prefers-reduced-motion: reduce){ .clients-track{animation:none; flex-wrap:wrap; width:auto} .clients-track [aria-hidden]{display:none} }