:root{
  --black:#000;
  --white:#fff;
  --g100:#111;
  --g200:#222;
  --g300:#333;
  --g400:#444;
  --g500:#555;
  --g600:#666;
  --g700:#777;
  --g800:#888;
  --g900:#999;
}

*{box-sizing:border-box;}
html,body{
  height:100%;
  margin:0;
  background: linear-gradient(180deg, #f7f7f7 0%, #efefef 100%);
  color:#222;
  font-size:19.5px;
  letter-spacing:.2px;
  font-family: "Georgia", "Times New Roman", Times, serif;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.topbar{
  position:fixed;
  top:0;left:0;right:0;
  height:64px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 20px;
  background:#000;
  color:#fff;
  z-index:100;
  border-bottom:1px solid #1f1f1f;
}

.topbar .brand{
  display:flex; align-items:center; gap:12px;
}
.topbar .brand img{ height:32px; display:none; } /* hidden on Home; shown on other sections via JS */

.menus{display:flex; gap:16px; align-items:center;}
.dropdown{ position:relative; }
.dropdown > button{
  background:transparent; border:1px solid #2a2a2a; color:#fff;
  padding:8px 12px; border-radius:10px; cursor:pointer;
  transition:transform .15s ease, background .15s ease;
}
.dropdown > button:hover{ background:#161616; transform:translateY(-1px); }
.dropdown ul{
  position:absolute; top:110%; right:0; background:#0e0e0e; color:#fff;
  border:1px solid #1e1e1e; border-radius:12px; min-width:180px;
  padding:6px; margin:0; list-style:none; display:none;
  box-shadow:0 10px 30px rgba(0,0,0,.4);
}
.dropdown ul.show{ display:block; }
.dropdown li{ padding:10px 12px; border-radius:8px; cursor:pointer; }
.dropdown li:hover{ background:#1b1b1b; }

/* Horizontal sections container */
.sections{
  position:fixed; top:64px; left:0; right:0; bottom:0;
  overflow:hidden;
}
.track{ touch-action: pan-x; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain;
  display:flex; height:100%;
  min-width:100%; /* auto width via flex */
  scroll-snap-type:x mandatory;
  overflow-x:auto; overflow-y:hidden;
  scroll-behavior:smooth;
}
.section{ -webkit-overflow-scrolling: touch;
  scroll-snap-align:start;
  flex:0 0 100vw; height:100%;
  padding:40px 6vw;
  overflow-y:auto;
  position:relative;
}

/* Home */
.home{
  display:flex; align-items:center; justify-content:center; flex-direction:column;
  gap:24px;
}
.home .logo{
  max-width:60vw;
  filter:drop-shadow(0 10px 30px rgba(0,0,0,.06));
}
.tagline{
  font-size:clamp(18px, 2vw, 24px);
  color:#6a6a6a;
}

/* About / Team */
h1{ font-size:clamp(28px, 4vw, 42px); margin:6px 0 16px 0; color:#222;}
h2{ font-size:clamp(22px, 2.6vw, 28px); margin:16px 0 10px 0; color:#333;}
p{ line-height:1.6; color:#444; }
.grid{
  display:grid; gap:16px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.card{
  background:#fff; border:1px solid #e9e9e9; border-radius:16px; padding:16px;
  box-shadow:0 10px 30px rgba(0,0,0,.04);
}
.small{ font-size:14px; color:#666; }

/* Areas of Practice list */
.pills{ display:grid; gap:10px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.pill{ display:flex; align-items:center; justify-content:center; text-align:center;
  padding:10px 14px; background:#fff; border:1px solid #e5e5e5; border-radius:999px;
  font-size:14px; color:#333;
}

/* Contact form */
form{
  display:grid; gap:12px; max-width:640px;
}
input, select, textarea{
  padding:12px 14px; border-radius:12px; border:1px solid #dcdcdc; background:#fff; width:100%;
  font-size:16px;
}
button.primary{
  background:#000; color:#fff; padding:12px 16px; border:none; border-radius:12px; cursor:pointer;
}
button.primary:hover{ opacity:.9; }

/* Bottom nav on Home */
.bottom-links{
  position:absolute; bottom:24px; left:50%; transform:translateX(-50%);
  display:flex; gap:12px; flex-wrap:wrap; justify-content:center;
}
.bottom-links a{
  background:#fff; border:1px solid #e5e5e5; padding:10px 14px; border-radius:999px;
  font-size:14px; color:#333;
}

/* Utilities */
.muted{ color:#6f6f6f; }
.hr{ height:1px; background: #eee; margin:20px 0; }

/* Icon buttons in topbar */
.dropdown > button svg{ display:block; }
.dropdown > button{ width:40px; height:40px; display:flex; align-items:center; justify-content:center; padding:0; }

/* Edge chevrons */
.chevrons{
  position:fixed; top:50%; left:0; right:0; transform:translateY(-50%);
  display:flex; justify-content:space-between; padding:0 8px; pointer-events:none; z-index:95;
}
.chevrons button{
  pointer-events:auto; background:#000; color:#fff; border:none; border-radius:999px; width:42px; height:42px;
  display:flex; align-items:center; justify-content:center; opacity:.8; cursor:pointer;
}
.chevrons button:hover{ opacity:1; }

/* Boutique typography tweaks */
h1, h2, h3 { font-family: "Georgia", "Times New Roman", Times, serif; letter-spacing: .3px; }
h1{ font-weight: 600; }
h2{ font-weight: 600; }
p, .small { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }

/* Elevate cards */
.card{
  border:1px solid #e2e2e2;
  box-shadow:0 20px 40px rgba(0,0,0,.06);
}

/* Contact office cards */
.office-card .office-title{
  font-size:19.5px; font-weight:600; margin-bottom:6px; color:#222;
}
.office-card .office-line{
  font-size:15px; color:#555;
}

/* Contact two-column layout: offices (vertical) + form */
.contact-grid{
  display:grid; gap:16px;
  grid-template-columns: minmax(320px, 1fr) 1fr;
}
@media (max-width: 900px){
  .contact-grid{ grid-template-columns: 1fr; }
}
.offices-stack{ display:grid; gap:16px; }

/* Area cards layout */
.area-grid{
  display:grid; gap:16px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.area-card{
  background:#fff; border:1px solid #e6e6e6; border-radius:16px; padding:16px;
  box-shadow:0 24px 48px rgba(0,0,0,.06);
}
.area-card h3{ margin:0 0 8px 0; font-size:20px; }
.area-card p{ margin:0; font-size:15.5px; color:#555; }

/* Arrow buttons: fade-in on hover and auto-hide via .disabled */
.chevrons button{ transition:opacity .18s ease, transform .18s ease; }
.chevrons button:hover{ transform:translateY(-1px); }
.chevrons button.disabled{ opacity:0; pointer-events:none; }