:root{
  /* Sostituisci con il giallo di provai.it se vuoi: */
  --brand-yellow: #FFD400;
  --ink: #111;
  --bg: #fff;
  --muted: #6b6b6b;
  --alt: #0f0f0f;
  --alt-ink: #f5f5f5;
  --radius: 14px;
  --shadow: 0 10px 30px rgba(0,0,0,.08);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: 'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--ink); background:var(--bg); line-height:1.55;
}

/* Header */
.site-header{background:#000; position:sticky; top:0; z-index:1000}
.header-row{display:flex; align-items:center; justify-content:space-between; padding:10px 0}
.container{width:min(1100px, 92%); margin:0 auto}

.logo-text{font-weight:800; font-size:28px; letter-spacing:0.2px; color:#fff; line-height:1}
.logo-strong{color:#fff}
.logo-ai{color:var(--brand-yellow)}
.logo-records{font-weight:600; opacity:.9}

.nav a{color:#fff; text-decoration:none; margin-left:18px; font-weight:600; opacity:.9}
.nav a:hover{opacity:1}

/* Hero */
.hero{
  background: linear-gradient(180deg, #000 0%, #111 60%, #141414 100%);
  color:#fff; padding:72px 0 64px; text-align:left;
}
.hero h1{font-size:44px; line-height:1.1; margin:0 0 10px}
.hero .subtitle{opacity:.9; max-width:780px; margin:0 0 24px}
.cta-row{display:flex; gap:12px; flex-wrap:wrap}

.btn{
  display:inline-block; padding:12px 18px; border-radius:999px; border:2px solid transparent;
  font-weight:700; text-decoration:none; cursor:pointer
}
.btn.primary{background:var(--brand-yellow); color:#000}
.btn.primary:hover{filter:brightness(0.95)}
.btn.ghost{background:transparent; color:#fff; border-color:#fff}
.btn.ghost:hover{background:#fff; color:#000}

/* Sections */
.section{padding:56px 0; background:#fff}
.section.alt{background:#f7f7f9}
.section h2{font-size:30px; margin:0 0 22px}

/* Grids & Cards */
.grid{
  display:grid; gap:22px;
}
.releases-grid{grid-template-columns: repeat(auto-fill, minmax(240px, 1fr))}
.artists-grid{grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); justify-items:center;}
.services-grid{grid-template-columns: repeat(auto-fill, minmax(260px, 1fr))}

.card{
  background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden;
}
.card img{width:100%; height:220px; object-fit:cover; display:block}
.card-body{padding:14px 14px 16px}
.card h3{margin:0 0 6px; font-size:20px}
.card .artist{margin:0 0 10px; color:var(--muted); font-weight:600}

.chip{
  display:inline-block; padding:6px 10px; border-radius:999px; text-decoration:none;
  background:#eee; color:#000; font-weight:700; font-size:13px; margin:0 6px 6px 0
}
.chip:hover{background:var(--brand-yellow)}

/* Services simple cards */
.service{
  background:#fff; border-radius:var(--radius); padding:18px; box-shadow:var(--shadow)
}
.service h3{margin:0 0 8px}

/* Contact */
.contact-form{background:#fff; padding:18px; border-radius:var(--radius); box-shadow:var(--shadow)}
.contact-form .row{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.contact-form label{display:block}
.contact-form span{display:block; font-weight:700; margin-bottom:6px}
input, textarea{
  width:100%; padding:12px 12px; border:1px solid #ddd; border-radius:10px; font:inherit
}
input:focus, textarea:focus{outline:2px solid var(--brand-yellow); border-color:transparent}
.contact-form button{margin-top:12px}

/* Inline contacts */
.contacts-inline{display:flex; gap:10px; align-items:center; margin-top:14px; flex-wrap:wrap}
.contacts-inline a{color:#000; text-decoration:none; font-weight:700}
.contacts-inline a:hover{text-decoration:underline}

/* Footer */
.site-footer{background:#000; color:#fff; padding:24px 0; margin-top:24px}
.footer-row{display:flex; align-items:center; justify-content:space-between; gap:16px}
.footer-nav a{color:#fff; text-decoration:none}
.footer-nav a:hover{text-decoration:underline}

/* Artists: square, responsive thumbnails */
.artists-grid .card img{
  width:100%;
  height:auto;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:12px;
  box-shadow:0 6px 18px rgba(0,0,0,.12);
}

@media (max-width:720px){
  .hero h1{font-size:34px}
  .contact-form .row{grid-template-columns:1fr}
  .artists-grid .card img{width:300px; height:300px}
}
@media (max-width:480px){
  .artists-grid .card img{width:240px; height:240px}
  .btn{width:100%; text-align:center}
}


/* Releases square images */
.releases-grid img{
  width:100%;
  height:auto;
  aspect-ratio:1/1;
  object-fit:cover;
}