/* ============================================================
   The Krumholz Group — shared stylesheet
   Palette matched to rsnycconsulting.com: deep navy + antique gold
   Used by index.html, law.html, management.html
   ============================================================ */

:root{
  --navy:#101B2D;
  --navy-2:#16243A;
  --navy-3:#0B1420;
  --gold:#C9A961;
  --gold-lt:#DCC189;
  --cream:#FAF8F5;
  --white:#FFFFFF;
  --ink:#1C2536;
  --ink-soft:#5C6879;
  --on-dark:#B9C2CE;
  --rule-lt:#E6E1D8;
  --rule-gold:rgba(201,169,97,.28);

  --display:"Playfair Display", Georgia, serif;
  --sans:"Jost", system-ui, sans-serif;

  --pad:clamp(1.25rem,4vw,3.5rem);
  --maxw:1200px;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; scroll-padding-top:80px; }
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation:none!important; transition:none!important; }
}

body{
  background:var(--cream); color:var(--ink);
  font-family:var(--sans); font-size:1rem; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; }
:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 var(--pad); }

/* ---------- type ---------- */
.eyebrow{
  font-size:.75rem; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase; color:var(--gold);
}

h1{
  font-family:var(--display); font-weight:700;
  font-size:clamp(2.5rem,5.2vw,3.75rem);
  line-height:1.14; letter-spacing:-.01em;
  color:var(--white); max-width:14ch; margin-top:1.5rem;
}
h1 em{ font-style:italic; color:var(--gold); }

h2.big{
  font-family:var(--display); font-weight:700;
  font-size:clamp(1.875rem,3.4vw,2.75rem);
  line-height:1.2; letter-spacing:-.01em;
  margin-top:1rem; text-wrap:balance;
}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;
  font-weight:600; font-size:.875rem; letter-spacing:.02em;
  padding:.95rem 1.75rem; text-decoration:none;
  border:1px solid transparent;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .12s ease;
}
.btn-gold{ background:var(--gold); color:var(--navy); border-color:var(--gold); }
.btn-gold:hover{ background:var(--gold-lt); border-color:var(--gold-lt); }
.btn-outline{ background:transparent; color:var(--white); border-color:rgba(255,255,255,.32); }
.btn-outline:hover{ border-color:var(--gold); color:var(--gold); }
.btn-dark{ background:var(--navy); color:var(--white); border-color:var(--navy); }
.btn-dark:hover{ background:var(--gold); color:var(--navy); border-color:var(--gold); }
.btn:active{ transform:translateY(1px); }

/* ---------- header ---------- */
header{
  position:sticky; top:0; z-index:60;
  background:var(--navy);
  border-bottom:1px solid rgba(255,255,255,.07);
}
.bar{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.85rem 0; }
.mark{
  font-family:var(--display); font-weight:700; font-size:1.25rem;
  color:var(--white); text-decoration:none; line-height:1.2;
}
.mark span{
  display:block; font-family:var(--sans); font-weight:400; font-size:.5625rem;
  letter-spacing:.24em; text-transform:uppercase; color:var(--gold); margin-top:.2rem;
}
nav ul{ display:flex; align-items:center; gap:2rem; list-style:none; }
nav a{
  font-size:.75rem; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase;
  color:var(--on-dark); text-decoration:none;
  transition:color .18s;
}
nav a:hover{ color:var(--gold); }
nav a[aria-current="page"]{ color:var(--gold); }
nav .btn{ padding:.7rem 1.35rem; font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; }
nav .btn:hover{ color:var(--navy); }
@media (max-width:900px){ nav ul li:not(.nav-cta){ display:none; } }

/* ---------- hero ---------- */
.hero{
  background:var(--navy); color:var(--on-dark);
  padding:clamp(3.5rem,7vw,5.5rem) 0 clamp(4rem,8vw,6.5rem);
}
.hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
@media (max-width:900px){ .hero-grid{ grid-template-columns:1fr; } }
.lede{ margin-top:1.5rem; font-size:1.0625rem; max-width:46ch; color:var(--on-dark); }
.cta-row{ display:flex; flex-wrap:wrap; gap:.875rem; margin-top:2.25rem; }

.stat-cards{ display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
@media (max-width:520px){ .stat-cards{ grid-template-columns:1fr; } }
.stat-card{
  background:var(--navy-2); border:1px solid rgba(255,255,255,.09);
  padding:1.75rem 1.5rem;
}
.stat-card .num{
  font-family:var(--display); font-weight:700; font-size:2rem;
  color:var(--gold); line-height:1;
}
.stat-card .cap{ font-size:.8125rem; color:var(--on-dark); margin-top:.75rem; line-height:1.5; }

/* ---------- credential strip ---------- */
.creds{ background:var(--cream); border-bottom:1px solid var(--rule-lt); padding:1.5rem 0; }
.creds-inner{ display:flex; flex-wrap:wrap; align-items:center; gap:.75rem 2.25rem; }
.creds .label{
  font-size:.6875rem; font-weight:500; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gold);
}
.creds .item{ font-size:.875rem; font-weight:500; color:var(--ink); }
.creds .item::before{ content:"✦"; color:var(--gold); margin-right:.6rem; font-size:.75rem; }

/* ---------- sections ---------- */
section{ padding:clamp(3.75rem,7vw,6rem) 0; }
.sec-head{ max-width:58ch; margin-bottom:3rem; }
.sec-head p{ margin-top:1.25rem; color:var(--ink-soft); }
.panel{ background:var(--white); border-top:1px solid var(--rule-lt); border-bottom:1px solid var(--rule-lt); }
.dark{ background:var(--navy); color:var(--on-dark); }
.dark .sec-head p{ color:var(--on-dark); }
.dark h2.big{ color:var(--white); }

/* ---------- practice cards ---------- */
.practices{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
@media (max-width:880px){ .practices{ grid-template-columns:1fr; } }
.practice{
  background:var(--white); border:1px solid var(--rule-lt);
  border-top:3px solid var(--gold);
  padding:clamp(1.75rem,3vw,2.5rem);
  display:flex; flex-direction:column; text-decoration:none;
  transition:transform .16s ease, box-shadow .2s ease;
}
.practice:hover{ transform:translateY(-4px); box-shadow:0 16px 40px rgba(16,27,45,.10); }
.practice h3{
  font-family:var(--display); font-weight:700; font-size:1.75rem;
  margin:.75rem 0 .875rem; color:var(--ink);
}
.practice > p{ color:var(--ink-soft); font-size:.9375rem; }
.practice .keys{ list-style:none; margin-top:1.5rem; display:flex; flex-wrap:wrap; gap:.4rem; }
.practice .keys li{
  font-size:.6875rem; font-weight:500; letter-spacing:.08em;
  text-transform:uppercase; color:var(--ink-soft);
  border:1px solid var(--rule-lt); padding:.35rem .6rem;
}
.practice .go{
  margin-top:auto; padding-top:1.75rem;
  font-size:.8125rem; font-weight:600; letter-spacing:.1em;
  text-transform:uppercase; color:var(--gold);
}
.practice .go::after{ content:" →"; }

/* ---------- problem / threads ---------- */
.problem-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,4rem); align-items:start; }
@media (max-width:900px){ .problem-grid{ grid-template-columns:1fr; } }
.problem-grid p{ margin-top:1.25rem; color:var(--ink-soft); }
.problem-grid strong{ color:var(--ink); font-weight:600; }
.threads{ display:flex; flex-direction:column; gap:.875rem; }
.thread{
  background:var(--cream); border:1px solid var(--rule-lt);
  border-left:3px solid var(--gold); padding:1.15rem 1.25rem;
}
.thread .meta{ font-size:.75rem; color:var(--ink-soft); margin-bottom:.4rem; }
.thread .title{ font-family:var(--display); font-weight:600; font-size:1.0625rem; line-height:1.4; color:var(--ink); }
.thread .votes{ font-size:.75rem; color:var(--ink-soft); margin-top:.5rem; }

/* ---------- service lists ---------- */
.cols{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); }
@media (max-width:880px){ .cols{ grid-template-columns:1fr; } }
.col h3{
  font-family:var(--display); font-weight:700; font-size:1.375rem;
  padding-bottom:.85rem; margin-bottom:.25rem;
  border-bottom:1px solid var(--gold); color:var(--ink);
}
.list{ list-style:none; }
.list li{
  display:grid; grid-template-columns:auto 1fr; gap:1.25rem;
  align-items:baseline; padding:.9rem 0; border-bottom:1px solid var(--rule-lt);
}
.list li:last-child{ border-bottom:none; }
.list .tag{
  font-size:.6875rem; font-weight:600; letter-spacing:.1em;
  text-transform:uppercase; color:var(--gold); white-space:nowrap;
  min-width:5.5rem;
}
.list .thing{ font-size:.9375rem; color:var(--ink-soft); }

/* ---------- process ---------- */
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }
@media (max-width:820px){ .steps{ grid-template-columns:1fr; } }
.step{ border-top:1px solid var(--rule-gold); padding-top:1.75rem; }
.step .n{
  font-family:var(--display); font-weight:700; font-size:2.5rem;
  line-height:1; color:var(--gold);
}
.step h3{ font-family:var(--display); font-weight:600; font-size:1.25rem; color:var(--white); margin:1rem 0 .6rem; }
.step p{ color:var(--on-dark); font-size:.9375rem; }

/* ---------- pills ---------- */
.pill-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
@media (max-width:880px){ .pill-grid{ grid-template-columns:1fr; } }
.pill{
  background:var(--cream); border:1px solid var(--rule-lt);
  border-top:3px solid var(--gold); padding:1.85rem;
}
.pill h3{ font-family:var(--display); font-weight:700; font-size:1.3125rem; margin-bottom:.75rem; color:var(--ink); }
.pill p{ color:var(--ink-soft); font-size:.9375rem; }

/* ---------- about ---------- */
.about-grid{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,5vw,4.5rem); align-items:start; }
@media (max-width:880px){ .about-grid{ grid-template-columns:1fr; } }
.about-photo{
  background:linear-gradient(165deg, var(--navy) 0%, var(--navy-2) 100%);
  border:1px solid var(--rule-gold);
  padding:clamp(1.75rem,3vw,2.5rem);
  display:flex; align-items:center; justify-content:center;
}
.about-photo img{
  width:100%; max-width:300px; display:block;
  aspect-ratio:1/1; object-fit:cover;
  border-radius:50%;
  border:3px solid var(--gold);
}
.facts{ display:grid; grid-template-columns:1fr 1fr; margin-top:1.5rem; border-top:1px solid var(--rule-lt); border-left:1px solid var(--rule-lt); }
.fact{ padding:1.1rem 1.25rem; border-right:1px solid var(--rule-lt); border-bottom:1px solid var(--rule-lt); }
.fact dt{ font-size:.625rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); }
.fact dd{ font-family:var(--display); font-weight:600; font-size:1rem; margin-top:.35rem; color:var(--ink); }
.about-copy p{ margin-top:1.25rem; color:var(--ink-soft); }
.about-copy strong{ color:var(--ink); font-weight:600; }

/* ---------- residents strip ---------- */
.tenants{ background:var(--gold); color:var(--navy); padding:clamp(2.5rem,5vw,3.25rem) 0; }
.tenants-inner{ display:flex; flex-wrap:wrap; gap:1.5rem 3rem; align-items:center; justify-content:space-between; }
.tenants .eyebrow{ color:var(--navy); opacity:.65; }
.tenants h2{ font-family:var(--display); font-weight:700; font-size:clamp(1.5rem,2.6vw,1.875rem); margin-top:.5rem; }
.tenants p{ color:rgba(16,27,45,.75); margin-top:.4rem; max-width:48ch; font-size:.9375rem; }
.tenants .btn{ background:var(--navy); color:var(--gold); border-color:var(--navy); }
.tenants .btn:hover{ background:var(--navy-3); border-color:var(--navy-3); }

/* ---------- contact ---------- */
.contact .sec-head{ margin-left:auto; margin-right:auto; text-align:center; }
.cards{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
@media (max-width:760px){ .cards{ grid-template-columns:1fr; } }
.card{
  background:var(--navy-2); border:1px solid var(--rule-gold);
  padding:2rem; text-decoration:none; display:block;
  transition:border-color .2s, transform .14s, background-color .2s;
}
.card:hover{ border-color:var(--gold); transform:translateY(-3px); background:var(--navy); }
.card .who{ font-family:var(--display); font-weight:700; font-size:1.25rem; color:var(--white); }
.card .role{
  font-size:.6875rem; font-weight:500; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold); margin:.5rem 0 1.5rem;
}
.card .addr{
  font-size:.9375rem; color:var(--on-dark);
  border-top:1px solid rgba(255,255,255,.12); padding-top:1.15rem; word-break:break-all;
}
.card .addr::after{ content:" ↗"; color:var(--gold); }

/* ---------- footer ---------- */
footer{ background:var(--navy-3); color:rgba(185,194,206,.65); padding:3rem 0 3.5rem; border-top:1px solid var(--rule-gold); }
.foot{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:1.25rem; align-items:center; font-size:.8125rem; }
.foot-nav{ display:flex; gap:1.5rem; list-style:none; }
.foot a{ text-decoration:none; transition:color .18s; }
.foot a:hover{ color:var(--gold); }
.adv{ font-size:.6875rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); opacity:.75; }
.disclaimer{
  margin-top:2rem; padding-top:1.5rem;
  border-top:1px solid rgba(255,255,255,.09);
  font-size:.8125rem; max-width:72ch; color:rgba(185,194,206,.5); line-height:1.65;
}
