:root {
  --bg:        #FAFAF7;
  --surface:   #FFFFFF;
  --surface2:  #FCFCF9;
  --accent:    #D4B052;
  --accent-ink: #8F7226;
  --accent-dim: rgba(212,176,82,0.16);
  --text:      #0A0E1A;
  --muted:     #5B6472;
  --border:    #E5E3DA;
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  background:var(--bg); color:var(--text);
  font-family:'Inter',sans-serif; font-size:16px; line-height:1.75;
  -webkit-font-smoothing:antialiased;
}
h1, h2, .serif { font-family:'Cormorant Garamond',serif; font-weight:400; }

/* ── Nav ── */
nav {
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 40px; background:rgba(250,250,247,.9);
  backdrop-filter:blur(12px); border-bottom:1px solid var(--border);
}
.nav-brand { display:flex; align-items:center; gap:14px; }
.nav-logo { height:34px; width:auto; }
.nav-name { font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:var(--text); }
.nav-links { display:flex; gap:34px; list-style:none; }
.nav-links a {
  font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted); text-decoration:none; transition:color .2s;
}
.nav-links a:hover { color:var(--accent-ink); }
.nav-links a.active { color:var(--accent-ink); border-bottom:1px solid var(--accent); padding-bottom:2px; }

/* ── Hero ── */
#hero {
  position:relative; min-height:88vh;
  display:flex; align-items:center; justify-content:center; text-align:center;
  overflow:hidden;
}
    .hero-content { position:relative; z-index:1; padding:40px 24px; }
.hero-content p { margin-left:auto; margin-right:auto; }
.hero-mark { width:62px; height:62px; display:block; margin:0 auto 20px; }
.hero-content { transform: translateY(-5.2vh); }
.hero-kicker {
  font-size:12px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--accent-ink); margin-bottom:22px;
}
h1 { font-size:clamp(52px, 8vw, 96px); line-height:1.05; }
.hero-sub {
  margin-top:26px; font-size:17px; color:var(--muted); max-width:520px;
  margin-left:auto; margin-right:auto;
}
.hero-cta-row { display:flex; gap:18px; justify-content:center; flex-wrap:wrap; margin-top:40px; }
.cta {
  display:inline-block; font-size:13px; letter-spacing:.1em; text-transform:uppercase;
  padding:13px 32px; border-radius:8px; text-decoration:none; transition:all .25s ease;
}
.cta-solid { background:var(--accent); color:#0A0E1A; font-weight:600; }
.cta-solid:hover { background:#C7A140; }
.cta-ghost { border:1px solid var(--border); color:var(--muted);
  background:transparent;
  box-shadow:0 1px 10px rgba(10,14,26,0.12); }
.cta-ghost:hover { border-color:var(--accent); color:var(--text); }

/* ── Sections ── */
section { padding:110px 24px; }
.wrap { max-width:960px; margin:0 auto; }
.section-label {
  font-size:12px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--accent-ink); margin-bottom:18px;
}
h2 { font-size:clamp(34px, 4.5vw, 52px); line-height:1.15; margin-bottom:26px; }
section p { color:var(--muted); max-width:68ch; }
section p + p { margin-top:18px; }
.rule { border:none; height:2px; margin:0 auto; max-width:960px; background:rgba(212,176,82,0.55); clip-path:polygon(0 0.5px, 50% 0, 100% 0.5px, 100% 1.5px, 50% 2px, 0 1.5px); }
.rule.rule-full { max-width:none; margin-top:-1px; position:relative; z-index:2; }
.inline-link { color:var(--accent-ink); text-decoration:none; border-bottom:1px solid var(--accent-dim); }
.inline-link:hover { border-bottom-color:var(--accent); }

/* ── About grid ── */
.about-grid { display:grid; grid-template-columns:260px 1fr; gap:48px; align-items:start; }
.headshot { width:100%; border-radius:2px; border:1px solid var(--border); }
.cred-list { margin-top:26px; display:grid; gap:10px; list-style:none; }
.cred-list li { color:var(--muted); font-size:14.5px; padding-left:20px; position:relative; }
.cred-list li::before { content:"◆"; position:absolute; left:0; top:1px; color:var(--accent); font-size:9px; }
.cred-list b { color:var(--text); font-weight:500; }

/* ── Work cards ── */
.card-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:44px; }
.card {
  background:var(--surface2); border:1px solid var(--border); border-radius:3px;
  padding:34px 32px; transition:border-color .25s;
}
.card:hover { border-color:rgba(212,176,82,.55); }
.card.flagship { grid-column:1 / -1; border-color:rgba(212,176,82,.45); background:linear-gradient(120deg, rgba(212,176,82,.08), var(--surface2) 55%); }
.card h3 { font-size:20px; font-weight:500; margin-bottom:12px; letter-spacing:.01em; }
.card h3 .serif { font-size:26px; }
.card p { font-size:14.5px; }
 .client-logos { display:flex; gap:26px; align-items:center; justify-content:center; margin-top:18px; }
.client-logos img { height:52px; width:auto; opacity:.85; }
.card-tag {
  display:inline-block; font-size:10.5px; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:var(--accent-ink); border:1px solid rgba(212,176,82,.45);
  border-radius:100px; padding:2px 12px; margin-bottom:16px;
}
.card-tag.green { color:#2E7D57; border-color:rgba(46,125,87,.45); }
.card-links { margin-top:20px; display:flex; gap:16px; flex-wrap:wrap; }

/* ── Services ── */
.svc-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; margin-top:44px; }
.svc {
  border:1px solid var(--border); border-radius:3px; padding:30px 26px;
  background:var(--surface2);
}
.svc h3 { font-size:17px; font-weight:500; margin-bottom:10px; }
.svc p { font-size:14px; }
.svc-btn {
  display:inline-block; margin-top:16px; padding:10px 22px; border-radius:8px;
  background:var(--accent); color:#0A0E1A; font-size:12px; font-weight:600;
  letter-spacing:.1em; text-transform:uppercase; text-decoration:none;
  transition:background .25s;
}
.svc-btn:hover { background:#C7A140; }

/* ── Contact / footer ── */
.contact-links { display:flex; gap:28px; margin-top:30px; flex-wrap:wrap; }
.contact-link {
  font-size:15px; color:var(--accent-ink); text-decoration:none;
  border-bottom:1px solid var(--accent-dim); padding-bottom:2px;
}
.contact-link:hover { border-bottom-color:var(--accent); }
footer {
  display:flex; align-items:center; justify-content:center; gap:14px;
  padding:26px 40px; border-top:1px solid var(--border);
}
footer img { height:36px; }
footer small { color:var(--muted); font-size:12.5px; }
footer a { color:var(--muted); }


  nav { border-bottom:none !important; } nav::after { content:''; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:rgba(212,176,82,0.55); clip-path:polygon(0 0.5px, 50% 0, 100% 0.5px, 100% 1.5px, 50% 2px, 0 1.5px); pointer-events:none; }
footer { position:relative; border-top:none !important; } footer::before { content:''; position:absolute; left:0; right:0; top:0; height:2px; background:rgba(212,176,82,0.55); clip-path:polygon(0 0.5px, 50% 0, 100% 0.5px, 100% 1.5px, 50% 2px, 0 1.5px); pointer-events:none; }
  
.about-hero > img { width: 300px; height: auto; border-radius: 8px; border: 1px solid var(--accent); }
.about-photo-mobile { display:none; }

/* ── Article + writing index ── */
.article { max-width:720px; }
.article h1 { font-size:clamp(32px,4.5vw,46px); line-height:1.2; margin-bottom:10px; }
.article-meta { font-size:13px; color:var(--muted); letter-spacing:.02em; }
.article-body { margin-top:26px; }
.article-body h2 { font-size:clamp(24px,3vw,32px); margin-top:44px; margin-bottom:14px; }
.article-body h3 { font-family:'Inter',sans-serif; font-size:17px; font-weight:600; margin-top:30px; margin-bottom:8px; }
.article-body p { color:var(--muted); margin-bottom:16px; }
.article-body ul, .article-body ol { color:var(--muted); margin:0 0 16px 20px; display:grid; gap:8px; }
.article-body blockquote { border-left:2px solid var(--accent); padding-left:18px; margin:22px 0; }
.article-body blockquote p { color:var(--text); font-style:italic; margin-bottom:0; }
.article-foot { margin-top:48px; padding-top:26px; border-top:1px solid var(--border); }
.writing-list { display:grid; gap:0; margin-top:40px; }
.writing-item { padding:26px 0; border-top:1px solid var(--border); }
.writing-item:last-child { border-bottom:1px solid var(--border); }
.writing-item a { text-decoration:none; color:inherit; display:block; }
.writing-item a:hover h3 { color:var(--accent-ink); }
.writing-item h3 { font-family:'Cormorant Garamond',serif; font-weight:400; font-size:26px; line-height:1.25; margin:8px 0 6px; transition:color .2s; }
.writing-item p { font-size:14.5px; margin:0; }
.writing-kind { font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--accent-ink); }
.writing-date { font-size:11px; letter-spacing:.08em; color:var(--muted); margin-left:10px; }

@media (max-width:760px) {
  .article-body h2 { margin-top:34px; }
  .writing-item { padding:22px 0; }
  .about-hero { gap:22px; padding-top:0; }
  .about-hero > img { display:none; }
  .about-hero .about-photo-mobile { display:block; width:132px; border-radius:10px; border:1px solid var(--accent); flex-shrink:0; }
  .about-idrow { display:flex; gap:16px; align-items:center; margin-top:16px; }
  .about-idmeta { min-width:0; }
  .about-idmeta .role { font-size:15px; line-height:1.5; }
  .about-idmeta .role .role-l2 { display:block; }
  .about-idmeta .role-linkedin { display:inline-block; margin-top:12px; }
  .about-hero > div:last-child { min-width:0; }
  nav { padding:14px 20px; }
  .section-label { text-align:center; }
  .nav-links { display:none; }
  .about-grid { grid-template-columns:1fr; }
  .headshot { max-width:260px; }
  .card-grid, .svc-grid { grid-template-columns:1fr; }
  section { padding:56px 20px; }
  h2 { margin-bottom:18px; }
  .card { padding:26px 22px; }
  .svc { padding:24px 20px; }
  .card-grid, .svc-grid { gap:16px; margin-top:32px; }
  .contact-links { gap:18px; margin-top:24px; }
  .hero-cta-row { margin-top:32px; }
  .section-label { margin-bottom:12px; }
  footer { flex-direction:column; gap:12px; text-align:center; }
}