/* ============================================================
   Napier Law — shared site stylesheet
   Extracted from the approved homepage (commit 57ce6ec) so every
   interior page inherits the same look without re-declaring it.
   ============================================================ */

:root{ color-scheme: dark; }
*{box-sizing:border-box; margin:0; padding:0;}
html{ scroll-behavior:smooth; }
html,body{width:100%; min-height:100%;}
body{ font-family:-apple-system,'Segoe UI',Helvetica,Arial,sans-serif; -webkit-font-smoothing:antialiased; background:#03050a; }
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}

/* ---------- top nav (shared across every page) ---------- */
.topbar{
  position:relative; z-index:10;
  display:flex; align-items:center; justify-content:space-between;
  padding:24px 40px;
}
.brand{ font-size:19px; font-weight:700; color:#F4F6F8; letter-spacing:.01em; }
nav{ display:flex; gap:26px; align-items:center; }
nav a{ font-size:13px; color:#C7CDD4; }
nav a:hover{ color:#fff; }
nav a.current{ color:#fff; border-bottom:1px solid rgba(255,255,255,.5); padding-bottom:4px; }
.callbtn{ background:#F4F6F8; color:#0A0F14; padding:10px 18px; border-radius:2px; font-weight:800; font-size:13px; letter-spacing:.02em; }

@media (max-width:820px){
  .topbar{ padding:20px 22px; }
  nav a:not(.callbtn):not(.mobile-show){ display:none; }
}

/* ---------- generic CTA buttons (used on every page) ---------- */
.cta{ display:inline-block; background:#F4F6F8; color:#0A0F14; padding:16px 28px; border-radius:2px; font-weight:800; font-size:14px; letter-spacing:.02em; }
.cta-secondary{ font-size:14px; color:#D3D8DE; border-bottom:1px solid rgba(255,255,255,.4); padding-bottom:14px; display:inline-block; }
.cta-row{ display:flex; gap:16px; align-items:center; margin-top:32px; flex-wrap:wrap; }

/* ---------- simple page header (interior pages, no video) ---------- */
.page-header{
  position:relative; background:#03050a;
  padding-bottom:64px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.page-header-inner{ padding:0 40px; max-width:1180px; margin:0 auto; }
.breadcrumb{ font-size:12px; color:#6B7482; margin-bottom:22px; }
.breadcrumb a{ color:#9FB4C2; }
.breadcrumb a:hover{ color:#fff; }
.page-eyebrow{ font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:#9FB4C2; font-weight:700; margin-bottom:16px; }
.page-header h1{ font-size:clamp(30px,4.4vw,50px); line-height:1.1; font-weight:800; color:#F4F6F8; letter-spacing:-.01em; max-width:760px; }
.page-dek{ font-size:16px; line-height:1.7; color:#D3D8DE; margin-top:18px; max-width:600px; }

@media (max-width:820px){
  .page-header-inner{ padding:0 22px; }
}

/* ---------- credibility strip ---------- */
.credibility{
  background:#05070c; border-top:1px solid rgba(255,255,255,.08); border-bottom:1px solid rgba(255,255,255,.08);
  padding:34px 40px;
}
.credibility-inner{
  max-width:1180px; margin:0 auto;
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px;
}
.cred-item{ text-align:left; }
.cred-item b{ display:block; font-size:19px; color:#F4F6F8; font-weight:700; margin-bottom:4px; }
.cred-item span{ font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:#8891A0; }

@media (max-width:820px){
  .credibility-inner{ grid-template-columns:1fr 1fr; }
}

/* ---------- main sections ---------- */
main{ background:#03050a; }
section{ padding:96px 40px; }
.section-wrap{ max-width:1180px; margin:0 auto; }
.eyebrow2{ font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:#9FB4C2; font-weight:700; margin-bottom:18px; }
h2{ font-size:clamp(28px,3.2vw,40px); font-weight:800; color:#F4F6F8; letter-spacing:-.01em; max-width:640px; }
h3{ color:#F4F6F8; }
.section-dek{ font-size:16px; line-height:1.7; color:#B8BFC9; max-width:560px; margin-top:16px; }
section.alt{ background:#05070c; }

/* body copy inside interior pages */
.prose p{ font-size:16px; line-height:1.8; color:#C7CDD4; margin-bottom:18px; max-width:760px; }
.prose h3{ font-size:20px; font-weight:800; margin:36px 0 14px; }
.prose ul{ margin:0 0 20px 20px; }
.prose li{ font-size:15px; line-height:1.8; color:#C7CDD4; margin-bottom:8px; }

/* ---------- practice-area / service "pillar" cards ---------- */
.pillars{ display:grid; grid-template-columns:1fr 1fr; gap:2px; margin-top:48px; background:rgba(255,255,255,.08); }
.pillars.single{ grid-template-columns:1fr; max-width:640px; }
.pillars.three{ grid-template-columns:1fr 1fr 1fr; }
.pillar{ background:#03050a; padding:44px; }
.pillar-tag{ font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:#6B7482; margin-bottom:18px; }
.pillar h3{ font-size:24px; font-weight:800; color:#F4F6F8; margin-bottom:14px; }
.pillar p{ font-size:15px; line-height:1.7; color:#B8BFC9; margin-bottom:22px; }
.pillar ul{ list-style:none; margin-bottom:26px; }
.pillar li{ font-size:14px; color:#B8BFC9; padding:10px 0; border-top:1px solid rgba(255,255,255,.08); }
.pillar li:first-child{ border-top:none; }
.pillar a.link{ font-size:13px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#F4F6F8; border-bottom:2px solid #9FB4C2; padding-bottom:4px; }

@media (max-width:820px){
  .pillars, .pillars.three{ grid-template-columns:1fr; }
}

/* ---------- about-style bio grid (reused on /about) ---------- */
.about-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:64px; margin-top:44px; align-items:center; }
.photo-slot{
  aspect-ratio:4/5; border-radius:2px; border:1px dashed rgba(255,255,255,.2);
  display:flex; align-items:center; justify-content:center; text-align:center; padding:24px;
  background:rgba(255,255,255,.02);
}
.photo-slot span{ font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:#5C6472; line-height:1.8; }
.photo{ aspect-ratio:4/5; border-radius:2px; overflow:hidden; background:rgba(255,255,255,.02); }
.photo img{ width:100%; height:100%; object-fit:cover; object-position:50% 15%; display:block; }
.about-copy p{ font-size:16px; line-height:1.8; color:#C7CDD4; margin-bottom:18px; }
.about-facts{ margin-top:28px; border-top:1px solid rgba(255,255,255,.1); }
.about-facts .row{ display:flex; justify-content:space-between; padding:14px 0; border-bottom:1px solid rgba(255,255,255,.1); font-size:14px; gap:24px; }
.about-facts .row span:first-child{ color:#8891A0; flex-shrink:0; }
.about-facts .row span:last-child{ color:#F4F6F8; font-weight:600; text-align:right; }

@media (max-width:820px){
  .about-grid{ grid-template-columns:1fr; }
}

/* ---------- reviews / testimonials (homepage + reused) ---------- */
.reviews{ text-align:center; }
.reviews .section-wrap{ display:flex; flex-direction:column; align-items:center; }
.reviews h2{ margin:0 auto; }
.reviews .section-dek{ margin-left:auto; margin-right:auto; }
.testimonials{
  display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:44px;
  text-align:left; width:100%; max-width:1000px;
}
.testimonial{
  background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.1);
  border-radius:2px; padding:32px;
}
.testimonial .stars{ color:#9FB4C2; font-size:14px; letter-spacing:.14em; margin-bottom:16px; }
.testimonial p{ font-size:15px; line-height:1.7; color:#C7CDD4; margin-bottom:20px; }
.testimonial .attribution{ font-size:13px; color:#8891A0; font-weight:700; letter-spacing:.02em; }

@media (max-width:820px){
  .testimonials{ grid-template-columns:1fr; }
}

/* ---------- contact form ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:64px; margin-top:44px; align-items:start; }
.contact-form{ display:flex; flex-direction:column; gap:18px; }
.contact-form label{ font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:#8891A0; margin-bottom:8px; display:block; }
.contact-form input, .contact-form textarea, .contact-form select{
  width:100%; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.14);
  border-radius:2px; padding:14px 16px; font-size:15px; color:#F4F6F8; font-family:inherit;
}
.contact-form input:focus, .contact-form textarea:focus, .contact-form select:focus{ outline:none; border-color:#9FB4C2; }
.contact-form textarea{ resize:vertical; min-height:140px; }
.contact-form select option{ background:#0A0F14; color:#F4F6F8; }
.contact-form button{
  background:#F4F6F8; color:#0A0F14; border:none; padding:16px 28px; border-radius:2px;
  font-weight:800; font-size:14px; letter-spacing:.02em; cursor:pointer; align-self:flex-start;
}
.contact-form button:disabled{ opacity:.6; cursor:default; }
.form-heading{ font-size:22px; font-weight:800; color:#F4F6F8; margin-bottom:8px; }
.form-intro{ font-size:14px; line-height:1.7; color:#B8BFC9; margin-bottom:8px; }
.form-success{ display:none; }
.form-success.show{ display:block; }
.form-success h3{ font-size:22px; font-weight:800; color:#F4F6F8; margin-bottom:12px; }
.form-success p{ font-size:15px; line-height:1.7; color:#C7CDD4; }
.form-error{ display:none; font-size:13px; color:#E8A6A6; margin-top:-6px; }
.form-error.show{ display:block; }
.contact-info{ font-size:15px; line-height:2; color:#C7CDD4; }
.contact-info b{ display:block; font-size:18px; color:#F4F6F8; margin-bottom:6px; }
.contact-info .big-phone{ font-size:32px; font-weight:800; color:#F4F6F8; display:block; margin:8px 0 20px; }
.map-wrap{ margin-top:28px; border-radius:2px; overflow:hidden; border:1px solid rgba(255,255,255,.1); aspect-ratio:16/10; }
.map-wrap iframe{ width:100%; height:100%; border:0; filter:grayscale(35%) invert(92%) contrast(90%); }

@media (max-width:820px){
  .contact-grid{ grid-template-columns:1fr; }
}

/* ---------- footer (shared) ---------- */
footer{ background:#020308; padding:64px 40px 32px; border-top:1px solid rgba(255,255,255,.08); }
.foot-grid{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:36px; max-width:1180px; margin:0 auto; }
.foot-nap{ font-size:14px; line-height:1.9; color:#B8BFC9; }
.foot-nap b{ display:block; font-size:18px; color:#F4F6F8; margin-bottom:8px; }
.foot-phone{ font-size:28px; font-weight:800; color:#F4F6F8; }
.foot-bottom{ max-width:1180px; margin:44px auto 0; padding-top:22px; border-top:1px solid rgba(255,255,255,.08); font-size:11px; color:#5C6472; }

@media (max-width:820px){
  section{ padding:64px 24px; }
}

/* ---------- free-consultation line (sitewide) ---------- */
.consult-line{
  margin-top:20px; font-size:14px; line-height:1.6; color:#9FB4C2;
  letter-spacing:.01em;
}
.consult-line b{ color:#F4F6F8; font-weight:700; }
.cta-row + .consult-line{ margin-top:22px; }
section[style*="text-align:center"] .consult-line{ margin-left:auto; margin-right:auto; max-width:520px; }

/* ---------- /information/ articles + index ---------- */
.article-meta{ font-size:13px; letter-spacing:.04em; color:#6B7482; margin-top:26px; }
.article-body h2{ font-size:26px; font-weight:800; color:#F4F6F8; margin:52px 0 18px; line-height:1.3; max-width:760px; }
.article-body h3{ margin:34px 0 12px; }
.article-body blockquote{ margin:28px 0; padding:2px 0 2px 24px; border-left:2px solid #9FB4C2; max-width:760px; }
.article-body blockquote p{ font-size:17px; line-height:1.75; color:#D3D8DE; font-style:italic; margin-bottom:12px; }
.article-body blockquote p:last-child{ margin-bottom:0; }
.article-body hr{ border:none; border-top:1px solid rgba(255,255,255,.08); margin:46px 0; max-width:760px; }
.article-body strong{ color:#F4F6F8; font-weight:700; }
.postlist{ margin-top:44px; }
.post-card{ padding:34px 0; border-top:1px solid rgba(255,255,255,.08); max-width:820px; }
.post-card:first-child{ border-top:none; padding-top:0; }
.post-date{ font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:#6B7482; margin-bottom:12px; }
.post-card h3{ font-size:24px; font-weight:800; line-height:1.3; margin-bottom:12px; }
.post-card h3 a{ color:#F4F6F8; }
.post-card p{ font-size:16px; line-height:1.75; color:#C7CDD4; margin-bottom:18px; max-width:760px; }
.post-card a.link{ font-size:13px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#F4F6F8; border-bottom:2px solid #9FB4C2; padding-bottom:4px; }
.article-source{ margin-top:40px; padding-top:22px; border-top:1px solid rgba(255,255,255,.08); max-width:760px; font-size:14px; color:#8891A0; }
.article-source a{ color:#C7CDD4; border-bottom:1px solid #9FB4C2; }
