/* ==========================================================================
   King & Watkins — Global styles
   Palette: Ink #0B1420, Parchment #F6F4EE, Brass #A9822C, Charcoal #1C2126,
            Slate #5B6470, Line #DCD6C8
   Type: Montserrat throughout (display + body + utility)
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400;1,500&display=swap');

:root{
  --ink:#0B1420;
  --ink-soft:#131F30;
  --parchment:#F6F4EE;
  --parchment-dim:#EDEADF;
  --brass:#A9822C;
  --brass-light:#C9A44E;
  --charcoal:#1C2126;
  --slate:#5B6470;
  --line:#DCD6C8;
  --line-dark:#25313F;
  --max:1180px;
  --radius:2px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
html:focus-within{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important;}
}

body{
  margin:0;
  font-family:'Montserrat',sans-serif;
  background:var(--parchment);
  color:var(--charcoal);
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4{margin:0;font-family:'Montserrat',sans-serif;font-weight:700;letter-spacing:-0.01em;color:var(--ink);}
p{margin:0;}

:focus-visible{outline:2px solid var(--brass);outline-offset:3px;}

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

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:11.5px;
  font-weight:600;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--brass);
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--brass);display:inline-block;}

/* ---------- Header / Nav ---------- */
.topbar{
  background:var(--ink);
  color:#CFCABB;
  font-size:12.5px;
  letter-spacing:0.04em;
}
.topbar .wrap{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding-top:9px;
  padding-bottom:9px;
  flex-wrap:wrap;
  gap:8px;
}
.topbar-contact{display:flex;gap:22px;flex-wrap:wrap;}
.topbar-contact a{color:#E9E5D6;font-weight:500;transition:color .15s ease;}
.topbar-contact a:hover{color:var(--brass-light);}
.topbar-tag{color:#8B93A0;font-weight:400;}

header.site-header{
  background:var(--parchment);
  border-bottom:1px solid var(--line);
  position:sticky;
  top:0;
  z-index:50;
}
nav.mainnav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:20px 0;
}
.brand{
  display:flex;
  align-items:center;
  gap:14px;
}
.brand-mark{
  width:46px;height:46px;
  border:1px solid var(--ink);
  display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:700;letter-spacing:0.03em;
  color:var(--ink);
  flex-shrink:0;
}
.brand-text{display:flex;flex-direction:column;line-height:1.2;}
.brand-name{font-size:16.5px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;color:var(--ink);}
.brand-sub{font-size:10.5px;letter-spacing:0.16em;text-transform:uppercase;color:var(--brass);font-weight:600;margin-top:3px;}

.navlinks{display:flex;align-items:center;gap:38px;}
.navlinks a{
  font-size:13px;
  font-weight:600;
  letter-spacing:0.05em;
  text-transform:uppercase;
  color:var(--charcoal);
  position:relative;
  padding:4px 0;
}
.navlinks a::after{
  content:"";
  position:absolute;left:0;bottom:0;
  width:0;height:2px;background:var(--brass);
  transition:width .2s ease;
}
.navlinks a:hover::after,.navlinks a.active::after{width:100%;}
.navlinks a.active{color:var(--brass);}

.btn{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:13px 24px;
  font-size:12.5px;
  font-weight:600;
  letter-spacing:0.08em;
  text-transform:uppercase;
  border:1px solid transparent;
  border-radius:var(--radius);
  transition:all .18s ease;
  cursor:pointer;
  white-space:nowrap;
}
.btn-brass{background:var(--brass);color:#0B1420;border-color:var(--brass);}
.btn-brass:hover{background:var(--brass-light);border-color:var(--brass-light);}
.btn-outline{background:transparent;color:var(--ink);border-color:var(--ink);}
.btn-outline:hover{background:var(--ink);color:var(--parchment);}
.btn-outline-light{background:transparent;color:#F1EEE3;border-color:#4A5666;}
.btn-outline-light:hover{background:#F1EEE3;color:var(--ink);border-color:#F1EEE3;}
.btn-ghost{background:transparent;color:var(--brass);border:none;padding-left:0;padding-right:0;}
.btn-ghost::after{content:"→";margin-left:6px;transition:transform .15s ease;}
.btn-ghost:hover::after{transform:translateX(4px);}

.navlinks .btn{padding:11px 20px;}

.navtoggle{display:none;background:none;border:none;cursor:pointer;padding:6px;}
.navtoggle span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;}

/* ---------- Hero ---------- */
.hero{
  background:var(--ink);
  color:#EDEADF;
  position:relative;
  overflow:hidden;
  padding:110px 0 96px;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(169,130,44,0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(169,130,44,0.06) 1px, transparent 1px);
  background-size:64px 64px;
  pointer-events:none;
}
.hero .wrap{position:relative;display:grid;grid-template-columns:1.15fr 0.85fr;gap:56px;align-items:center;}
.hero-eyebrow{color:var(--brass-light);}
.hero-eyebrow::before{background:var(--brass-light);}
.hero h1{
  color:#F7F5EC;
  font-size:clamp(38px,4.6vw,58px);
  line-height:1.08;
  margin:22px 0 24px;
  font-weight:800;
}
.hero h1 em{color:var(--brass-light);font-style:normal;}
.hero-lede{
  font-size:16.5px;
  color:#BFC4CC;
  max-width:520px;
  font-weight:400;
  margin-bottom:36px;
}
.hero-ctas{display:flex;gap:16px;flex-wrap:wrap;}
.hero-stats{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:var(--line-dark);
  border:1px solid var(--line-dark);
  margin-top:56px;
}
.hero-stat{background:var(--ink);padding:22px 24px;}
.hero-stat .num{font-size:26px;font-weight:800;color:var(--brass-light);}
.hero-stat .lbl{font-size:11px;letter-spacing:0.09em;text-transform:uppercase;color:#8B93A0;margin-top:6px;}

/* Signature globe/network graphic */
.hero-graphic{position:relative;}
.hero-graphic svg{width:100%;height:auto;}
.node-pulse{animation:pulse 2.6s ease-in-out infinite;}
@keyframes pulse{
  0%,100%{opacity:0.35;r:3;}
  50%{opacity:1;r:5;}
}

/* ---------- Section scaffolding ---------- */
section{padding:96px 0;}
.section-tight{padding:72px 0;}
.section-head{max-width:640px;margin-bottom:56px;}
.section-head h2{font-size:clamp(28px,3vw,38px);margin-top:16px;line-height:1.15;}
.section-head p{color:var(--slate);font-size:15.5px;margin-top:16px;max-width:560px;}
.bg-ink{background:var(--ink);color:#EDEADF;}
.bg-ink h2,.bg-ink h3,.bg-ink h4{color:#F5F3E8;}
.bg-ink .section-head p{color:#A9AFB9;}
.bg-dim{background:var(--parchment-dim);}

/* ---------- Practice areas ---------- */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.practice-card{background:var(--parchment);padding:38px 34px;transition:background .2s ease;}
.practice-card:hover{background:#FBFAF5;}
.practice-icon{width:42px;height:42px;margin-bottom:22px;color:var(--brass);}
.practice-icon svg{width:100%;height:100%;}
.practice-card h3{font-size:18px;margin-bottom:12px;}
.practice-card p{color:var(--slate);font-size:14px;line-height:1.65;}

/* ---------- Global reach ---------- */
.reach-layout{display:grid;grid-template-columns:0.9fr 1.1fr;gap:64px;align-items:center;}
.reach-list{display:grid;gap:0;border-top:1px solid var(--line-dark);}
.reach-item{
  display:flex;justify-content:space-between;align-items:baseline;
  padding:18px 0;border-bottom:1px solid var(--line-dark);
}
.reach-item .city{font-weight:600;font-size:15px;color:#F1EEE3;}
.reach-item .region{font-size:11.5px;letter-spacing:0.1em;text-transform:uppercase;color:#8B93A0;}

/* ---------- Why us / features ---------- */
.feature-row{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;}
.feature{border-top:2px solid var(--brass);padding-top:20px;}
.feature h4{font-size:15.5px;margin-bottom:10px;}
.feature p{font-size:13.5px;color:var(--slate);line-height:1.65;}

/* ---------- Testimonials ---------- */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.testi-card{
  background:var(--parchment);
  border:1px solid var(--line);
  padding:34px 30px;
  display:flex;flex-direction:column;
  gap:22px;
}
.testi-quote{font-size:16px;line-height:1.7;font-weight:400;font-style:italic;color:var(--charcoal);}
.testi-quote::before{content:"“";color:var(--brass);font-size:28px;font-style:normal;line-height:0;display:inline-block;vertical-align:-6px;margin-right:2px;}
.testi-who{display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--line);padding-top:16px;}
.testi-name{font-weight:700;font-size:13.5px;letter-spacing:0.02em;}
.testi-role{font-size:12px;color:var(--slate);}
.stars{color:var(--brass);letter-spacing:2px;font-size:13px;}

/* ---------- FAQ ---------- */
.faq-list{border-top:1px solid var(--line);max-width:820px;}
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{
  width:100%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  background:none;
  border:none;
  text-align:left;
  padding:24px 0;
  cursor:pointer;
  font-family:'Montserrat',sans-serif;
  font-size:16px;
  font-weight:600;
  color:var(--ink);
}
.faq-q .plus{
  flex-shrink:0;
  width:22px;height:22px;
  border:1px solid var(--brass);
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:var(--brass);
  font-size:14px;
  transition:transform .2s ease;
}
.faq-item[open] .faq-q .plus{transform:rotate(45deg);}
.faq-a{padding:0 0 26px;color:var(--slate);font-size:14.5px;line-height:1.75;max-width:700px;}
.faq-q::-webkit-details-marker{display:none;}

/* ---------- CTA banner ---------- */
.cta-banner{
  background:var(--ink);
  color:#EDEADF;
  padding:72px 0;
  text-align:center;
}
.cta-banner h2{color:#F7F5EC;font-size:clamp(26px,3vw,34px);margin-bottom:14px;}
.cta-banner p{color:#A9AFB9;font-size:15px;margin-bottom:34px;}
.cta-btns{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}

/* ---------- Footer ---------- */
footer{background:var(--ink);color:#8B93A0;border-top:1px solid var(--line-dark);padding:56px 0 28px;}
.footer-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-bottom:44px;border-bottom:1px solid var(--line-dark);}
.footer-brand .brand-name{color:#F1EEE3;}
.footer-desc{font-size:13.5px;color:#8B93A0;margin-top:16px;line-height:1.7;max-width:280px;}
.footer-col h5{font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:#D7D2C2;margin-bottom:18px;font-weight:700;}
.footer-col a{display:block;font-size:13.5px;color:#9AA1AC;padding:6px 0;transition:color .15s ease;}
.footer-col a:hover{color:var(--brass-light);}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:26px;font-size:12px;color:#6D7581;flex-wrap:wrap;gap:12px;}

/* ---------- Page hero (interior pages) ---------- */
.page-hero{background:var(--ink);color:#EDEADF;padding:76px 0 64px;}
.page-hero h1{color:#F7F5EC;font-size:clamp(32px,4vw,46px);margin-top:16px;}
.page-hero p{color:#A9AFB9;font-size:15.5px;margin-top:16px;max-width:560px;}
.breadcrumb{font-size:12px;color:#8B93A0;letter-spacing:0.05em;text-transform:uppercase;}
.breadcrumb a{color:var(--brass-light);}

/* ---------- About page ---------- */
.about-layout{display:grid;grid-template-columns:0.85fr 1.15fr;gap:64px;align-items:start;}
.about-card{
  border:1px solid var(--line);
  background:var(--parchment-dim);
  padding:0;
}
.about-portrait{
  aspect-ratio:4/5;
  background:linear-gradient(160deg,var(--ink) 0%,#1A2537 100%);
  display:flex;align-items:center;justify-content:center;
  position:relative;
  overflow:hidden;
}
.about-portrait::before{
  content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(169,130,44,0.08) 1px, transparent 1px),linear-gradient(90deg, rgba(169,130,44,0.08) 1px, transparent 1px);
  background-size:28px 28px;
}
.about-monogram{font-size:96px;font-weight:800;color:var(--brass);letter-spacing:0.02em;position:relative;}
.about-card-meta{padding:26px 28px;border-top:1px solid var(--line);}
.about-card-meta .name{font-size:17px;font-weight:700;color:var(--ink);}
.about-card-meta .role{font-size:12.5px;color:var(--brass);text-transform:uppercase;letter-spacing:0.08em;margin-top:4px;font-weight:600;}
.about-card-meta .contact{margin-top:18px;display:flex;flex-direction:column;gap:8px;font-size:13px;}
.about-card-meta .contact a{color:var(--charcoal);font-weight:500;}
.about-card-meta .contact a:hover{color:var(--brass);}

.about-body p{color:var(--slate);font-size:15px;line-height:1.85;margin-bottom:20px;}
.about-body h3{font-size:13px;letter-spacing:0.1em;text-transform:uppercase;color:var(--brass);margin:36px 0 18px;}

.creds-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:6px;}
.cred-item{border:1px solid var(--line);padding:16px 18px;background:var(--parchment);font-size:13.5px;color:var(--charcoal);}
.cred-item strong{display:block;color:var(--ink);font-size:14px;margin-bottom:3px;}

.timeline{border-left:1px solid var(--line);margin-top:6px;}
.tl-item{padding:0 0 28px 28px;position:relative;}
.tl-item::before{content:"";position:absolute;left:-5px;top:4px;width:9px;height:9px;background:var(--brass);border-radius:50%;}
.tl-year{font-size:12px;letter-spacing:0.08em;color:var(--brass);font-weight:700;text-transform:uppercase;}
.tl-item h4{font-size:15.5px;margin:6px 0 6px;}
.tl-item p{font-size:13.5px;color:var(--slate);line-height:1.7;}

/* ---------- Blog / Insights ---------- */
.blog-filter{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:44px;}
.blog-filter span{
  font-size:11.5px;letter-spacing:0.08em;text-transform:uppercase;font-weight:600;
  padding:9px 16px;border:1px solid var(--line);color:var(--slate);
}
.blog-filter span.active{border-color:var(--ink);color:var(--ink);background:var(--parchment-dim);}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.blog-card{background:var(--parchment);padding:32px 30px;display:flex;flex-direction:column;gap:16px;}
.blog-meta{display:flex;justify-content:space-between;font-size:11px;letter-spacing:0.06em;text-transform:uppercase;color:var(--brass);font-weight:700;}
.blog-card h3{font-size:17px;line-height:1.35;}
.blog-card p{font-size:13.5px;color:var(--slate);line-height:1.7;}
.blog-foot{display:flex;justify-content:space-between;align-items:center;font-size:11.5px;color:var(--slate);margin-top:auto;padding-top:6px;border-top:1px solid var(--line);}

.blog-feature{
  display:grid;grid-template-columns:1fr 1fr;gap:0;
  border:1px solid var(--line);margin-bottom:56px;
}
.blog-feature-media{background:linear-gradient(150deg,var(--ink),#1A2537);position:relative;min-height:280px;overflow:hidden;}
.blog-feature-media::before{
  content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(169,130,44,0.09) 1px, transparent 1px),linear-gradient(90deg, rgba(169,130,44,0.09) 1px, transparent 1px);
  background-size:30px 30px;
}
.blog-feature-tag{
  position:absolute;top:24px;left:24px;
  background:var(--brass);color:var(--ink);
  font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;
  padding:8px 14px;
}
.blog-feature-body{padding:44px 42px;display:flex;flex-direction:column;justify-content:center;gap:16px;}
.blog-feature-body h3{font-size:24px;line-height:1.3;}
.blog-feature-body p{color:var(--slate);font-size:14.5px;line-height:1.75;}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .hero .wrap{grid-template-columns:1fr;}
  .hero-graphic{order:-1;max-width:360px;}
  .grid-3{grid-template-columns:1fr;}
  .feature-row{grid-template-columns:1fr 1fr;row-gap:32px;}
  .testi-grid{grid-template-columns:1fr;}
  .reach-layout{grid-template-columns:1fr;}
  .about-layout{grid-template-columns:1fr;}
  .footer-top{grid-template-columns:1fr 1fr;row-gap:36px;}
  .blog-grid{grid-template-columns:1fr 1fr;}
  .blog-feature{grid-template-columns:1fr;}
}
@media (max-width:760px){
  .navlinks{
    position:fixed;inset:73px 0 0 0;
    background:var(--parchment);
    flex-direction:column;
    align-items:flex-start;
    padding:32px;
    gap:22px;
    transform:translateX(100%);
    transition:transform .25s ease;
    border-top:1px solid var(--line);
  }
  .navlinks.open{transform:translateX(0);}
  .navtoggle{display:block;}
  .topbar-contact{gap:14px;}
  .feature-row{grid-template-columns:1fr;}
  .blog-grid{grid-template-columns:1fr;}
  .footer-top{grid-template-columns:1fr;}
}