/* Minimal, modern, responsive styles */
:root{
  --bg:#0c0c0d;
  --paper:#ffffff;
  --ink:#111114;
  --muted:#6b7280;
  --accent:#c9a227; /* luxe gold accent */
  --line:#e5e7eb;
  --radius:14px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color:var(--ink);
  background:#fafafa;
  line-height:1.5;
}

/* Layout */
.container{width:min(1100px,92vw);margin-inline:auto}
.section{padding:72px 0}
.section.alt{background:#f5f6f8}
.lead{font-size:1.125rem;max-width:60ch;color:#2b2f36}
.muted{color:var(--muted)}
.small{font-size:.9rem;color:var(--muted)}
.fineprint{margin-top:12px;color:var(--muted);font-size:.9rem}

.site-header{
  position:sticky;top:0;z-index:40;
  backdrop-filter:saturate(180%) blur(8px);
  background:rgba(255,255,255,.8);
  border-bottom:1px solid var(--line);
}
.nav{display:flex;align-items:center;gap:16px;justify-content:space-between;padding:12px 0}
.brand{font-weight:800;letter-spacing:.4px;text-decoration:none;color:var(--ink)}
#nav{display:flex;gap:20px;align-items:center}
#nav a{text-decoration:none;color:var(--ink)}
#nav .btn-sm{padding:.5rem .8rem;border:1px solid var(--ink);border-radius:999px}
.burger{display:none;background:none;border:0;font-size:1.4rem}

.hero{position:relative;display:grid}
.hero-photo{
  background-image:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.35)), url('assets/hero.jpg');
  background-size:cover;background-position:center;
  height:48vh;min-height:360px;border-bottom:1px solid var(--line);
}
.hero-inner{position:relative;padding:40px 0 28px;display:flex;flex-direction:column;gap:14px}
.hero-badge{display:inline-block;font-size:.85rem;color:#fff;background:var(--ink);padding:.35rem .65rem;border-radius:999px;width:max-content}
.hero h1{font-size:clamp(2rem,4vw,3.25rem);margin:0;color:var(--ink)}
.hero p{max-width:60ch;margin:0}

.cta{display:flex;gap:12px;margin-top:6px}
.btn{display:inline-block;text-decoration:none;background:var(--ink);color:#fff;padding:.8rem 1.1rem;border-radius:12px;border:1px solid var(--ink)}
.btn-outline{background:transparent;color:var(--ink)}

.trust{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff}
.trust-inner{display:flex;gap:18px;align-items:center;padding:10px 0;flex-wrap:wrap}
.trust-inner ul{display:flex;gap:18px;list-style:none;padding:0;margin:0;color:var(--muted);font-size:.95rem;flex-wrap:wrap}

.grid{display:grid;gap:18px}
.cards{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px}
.card .price{margin-top:10px;font-weight:800}

.cases{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.case{background:#fff;border:1px dashed var(--line);border-radius:var(--radius);padding:18px}
.tags{list-style:none;display:flex;gap:8px;padding:0;margin:8px 0 0}
.tags li{font-size:.8rem;background:#111114;color:#fff;border-radius:999px;padding:.2rem .55rem;opacity:.9}

.about{display:grid;grid-template-columns:2fr 1fr;gap:24px}
.bio-card{background:#111114;color:#fff;border-radius:var(--radius);padding:18px}

.cols{display:flex;gap:24px;flex-wrap:wrap}
.check{list-style: none;padding-left:0}
.check li{margin:.3rem 0;padding-left:1.1rem;position:relative}
.check li::before{content:"✓";position:absolute;left:0;color:var(--accent)}

.contact .form{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px}
.form label{display:block;font-weight:600;margin:8px 0}
.form input,.form textarea{
  width:100%;padding:.75rem;border-radius:10px;border:1px solid var(--line);background:#fff
}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ways{margin-top:10px}

.site-footer{border-top:1px solid var(--line);background:#fff}
.foot{display:flex;justify-content:space-between;align-items:center;padding:18px 0;flex-wrap:wrap;gap:10px}

/* Mobile */
@media (max-width: 820px){
  #nav{display:none}
  .burger{display:block}
  .about{grid-template-columns:1fr}
  .hero-photo{height:40vh}
  .form .row{grid-template-columns:1fr}
}

/* Open menu (applied via JS) */
.open #nav{display:flex;flex-direction:column;gap:10px;position:absolute;right:16px;top:60px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 14px}
<div class="grid cards">
  <article class="card">
    <h3>Vocal Health Package</h3>
    <p class="muted">For singers preparing for performances.</p>
    <ul>
      <li>Two 1:1 coaching calls</li>
      <li>Show preparation essentials checklist</li>
      <li>Performance tips, warmups & cooldown strategies</li>
    </ul>
    <div class="price">$250 (Pre or Post) / $400 Full Consult</div>
  </article>

  <article class="card">
    <h3>Performance Coaching Package</h3>
    <p class="muted">Refine your artistry and stage identity.</p>
    <ul>
      <li>Stage presence and movement coaching</li>
      <li>Style & wardrobe guidance</li>
      <li>Crowd engagement techniques</li>
      <li>Set list planning & show flow support</li>
    </ul>
    <div class="price">$499</div>
  </article>

  <article class="card">
    <h3>Business Filing Consultation</h3>
    <p class="muted">Start your business the right way.</p>
    <ul>
      <li>LLC or Nonprofit formation guidance</li>
      <li>EIN registration included</li>
      <li>Custom Operating Agreement included</li>
    </ul>
    <div class="price">$350</div>
  </article>

  <article class="card">
    <h3>Conflict Coaching</h3>
    <p class="muted">Navigate life and leadership with clarity.</p>
    <ul>
      <li>Personal, interpersonal, or organizational conflict</li>
      <li>Negotiation & communication strategies</li>
      <li>Mediation-informed guidance for hard conversations</li>
      <li>Relationship repair support</li>
    </ul>
    <div class="price">$399 and up</div>
  </article>
</div>

/* Make header Contact button outlined (not solid) */
.site-header #nav .btn {
  background: transparent;
  color: #111;
  border: 1px solid #111;
}
.site-header #nav .btn:hover {
  background: #111;
  color: #fff;
}
