/*!
Theme Name: Lauren Bradshaw
Theme URI: http://underscores.me/
Author: David Sloan
Author URI: http://underscores.me/
Description: Custom theme: Lauren Bradshaw , developed by David Sloan
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: lauren-bradshaw
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Lauren Bradshaw is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

:root {
  --ink: #1a1208;
  --paper: #f5efe4;
  --aged: #e8ddc8;
  --rust: #b34a2a;
  --gold: #c9922a;
  --muted: #7a6a55;
  --light-rule: #d4c9b0;
}

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--paper);
  color: var(--ink);
  font-family: "EB Garamond", Georgia, serif;
  font-size: 18px;
  line-height: 1.7;
  overflow-x: hidden;
}

/* ── MASTHEAD ── */
.masthead {
  border-bottom: 3px double var(--ink);
  padding: 1.2rem 0 0;
  text-align: center;
  background: var(--paper);
  position: sticky;
  top: 0;
  z-index: 100;
}

.masthead-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 3rem 1rem;
}

.masthead-date {
  font-family: "DM Mono", monospace;
  font-size: 0.7rem;
  color: var(--muted);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.masthead-name {
  font-family: "Playfair Display", serif;
  font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 900;
  letter-spacing: -0.01em;
  line-height: 1;
}

.masthead-name span {
  color: var(--rust);
}

.masthead-tagline {
  font-family: "EB Garamond", serif;
  font-style: italic;
  font-size: 0.95rem;
  color: var(--muted);
  letter-spacing: 0.08em;
}

nav {
  border-top: 1px solid var(--light-rule);
  display: flex;
  justify-content: center;
  gap: 0;
}
nav ul {
  display: flex;
  flex-direction: row;
  list-style: none;
  margin: 0;
  padding: 0;
}

nav a {
  display: block;
  padding: 0.55rem 1.6rem;
  font-family: "DM Mono", monospace;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--ink);
  text-decoration: none;
  border-right: 1px solid var(--light-rule);
  transition:
    background 0.2s,
    color 0.2s;
}

nav a:first-child {
  border-left: 1px solid var(--light-rule);
}

nav a:hover {
  background: var(--ink);
  color: var(--paper);
}

/* ── HERO GRID ── */
.hero {
  display: grid;
  grid-template-columns: 1fr 2px 1.4fr;
  min-height: 88vh;
  max-width: 1400px;
  margin: 0 auto;
}

.hero-rule {
  background: var(--light-rule);
}

.hero-left {
  padding: 4rem 3rem 3rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
}

.entry-content {
  max-width: 1000px;
}

.hero-left::before {
  content: '"';
  font-family: "Playfair Display", serif;
  font-size: 18rem;
  color: var(--aged);
  position: absolute;
  top: -2rem;
  left: 1rem;
  line-height: 1;
  z-index: 0;
  pointer-events: none;
}

.hero-label {
  font-family: "DM Mono", monospace;
  font-size: 0.68rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--rust);
  margin-bottom: 1rem;
  position: relative;
  z-index: 1;
}

.hero-headline {
  font-family: "Playfair Display", serif;
  font-size: clamp(2.4rem, 4.5vw, 4.2rem);
  font-weight: 700;
  line-height: 1.1;
  position: relative;
  z-index: 1;
  margin-bottom: 1.8rem;
}

.hero-headline-name {
  font-style: italic;
  color: var(--rust);
}

.main-centered-container {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 75vh;
  padding: 1rem;
}

.para-spacer {
  margin-bottom: 20px;
}

.main-centered-box {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  padding: 2rem;
}

.hero-body {
  font-size: 1.05rem;
  color: var(--muted);
  max-width: 36ch;
  position: relative;
  z-index: 1;
  margin-bottom: 2rem;
}

.btn-primary {
  display: inline-block;
  background: var(--ink);
  color: var(--paper);
  padding: 0.75rem 2rem;
  font-family: "DM Mono", monospace;
  font-size: 0.75rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  text-decoration: none;
  transition:
    background 0.2s,
    color 0.2s;
  position: relative;
  z-index: 1;
  align-self: flex-start;
}

.btn-primary:hover {
  background: var(--rust);
}

.hero-right {
  padding: 0rem 0rem 0rem 0rem;
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  justify-content: center;
}

/* portrait */
.portrait-frame {
  position: relative;
  align-self: flex-start;
}

.portrait-img {
  width: 260px;
  height: 320px;
  object-fit: cover;
  display: block;
  filter: sepia(25%) contrast(1.05);
}

.portrait-placeholder {
  width: 260px;
  height: 320px;
  background: var(--aged);
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--light-rule);
}

.portrait-placeholder span {
  font-family: "Playfair Display", serif;
  font-size: 5rem;
  color: var(--muted);
}

.portrait-frame::after {
  content: "";
  position: absolute;
  bottom: -10px;
  right: -10px;
  width: 100%;
  height: 100%;
  border: 2px solid var(--rust);
  z-index: -1;
}

.paragraph-break {
  padding-bottom: 0rem;
}

.portrait-caption {
  font-family: "DM Mono", monospace;
  font-size: 0.65rem;
  color: var(--muted);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-top: 0.8rem;
  padding-left: 20px;
}

/* featured quote */
.pull-quote {
  border-left: 4px solid var(--rust);
  padding-left: 1.5rem;
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 1.25rem;
  color: var(--ink);
  line-height: 1.5;
}

.pull-quote cite {
  display: block;
  font-family: "DM Mono", monospace;
  font-style: normal;
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  margin-top: 0.6rem;
}

.cite {
  display: block;
  font-family: "DM Mono", monospace;
  font-style: normal;
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  margin-top: 0.6rem;
}

/* ── SECTION BASE ── */
section {
  padding: 5rem 3rem;
}

.section-inner {
  max-width: 1200px;
  margin: 0 auto;
}

.section-rule {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 2.5rem;
}

.section-rule h2 {
  font-family: "Playfair Display", serif;
  font-size: clamp(1.6rem, 2.5vw, 2.4rem);
  font-weight: 700;
  white-space: nowrap;
}

.section-rule::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--ink);
}

.section-label {
  font-family: "DM Mono", monospace;
  font-size: 0.65rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--rust);
  margin-bottom: 0.5rem;
}

/* ── ABOUT ── */
.about {
  background: var(--aged);
}

.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: start;
}

.about-text {
  margin-bottom: 1.1rem;
  color: #3a2e1e;
}

.about-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}

.stat-card {
  border-top: 2px solid var(--rust);
  padding-top: 0.8rem;
}

.stat-number {
  font-family: "Playfair Display", serif;
  font-size: 2.8rem;
  font-weight: 900;
  line-height: 1;
  color: var(--rust);
}

.stat-label {
  font-family: "DM Mono", monospace;
  font-size: 0.65rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  margin-top: 0.3rem;
}

.expertise-list {
  margin-top: 2rem;
  list-style: none;
}

.expertise-list li {
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--light-rule);
  font-family: "EB Garamond", serif;
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.expertise-list li::before {
  content: "✦";
  color: var(--rust);
  font-size: 0.6rem;
}

/* ── PUBLICATIONS ── */
.publications {
  background: var(--paper);
}

.pub-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}

.pub-card {
  border-top: 1px solid var(--ink);
  padding-top: 1.2rem;
  position: relative;
  cursor: pointer;
  transition: transform 0.2s;
}

.pub-card:hover {
  transform: translateY(-4px);
}

.pub-type {
  font-family: "DM Mono", monospace;
  font-size: 0.62rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--rust);
  margin-bottom: 0.5rem;
}

.pub-title {
  font-family: "Playfair Display", serif;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 0.5rem;
}

.pub-meta {
  font-family: "DM Mono", monospace;
  font-size: 0.65rem;
  color: var(--muted);
  letter-spacing: 0.05em;
  margin-bottom: 0.7rem;
}

.pub-desc {
  font-size: 0.9rem;
  color: var(--muted);
  line-height: 1.5;
}

.pub-link {
  display: inline-block;
  margin-top: 1rem;
  font-family: "DM Mono", monospace;
  font-size: 0.65rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink);
  text-decoration: none;
  border-bottom: 1px solid var(--rust);
  padding-bottom: 1px;
  transition: color 0.2s;
}

.pub-link:hover {
  color: var(--rust);
}

/* ── FOOTER ── */
footer {
  background: var(--ink);
  color: var(--paper);
  padding: 3rem;
  text-align: center;
}

.footer-name {
  font-family: "Playfair Display", serif;
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.footer-sub {
  font-family: "DM Mono", monospace;
  font-size: 0.65rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #b0a080;
}

.footer-links ul {
  display: flex;
  flex-direction: row;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 20px;
}

.right-border {
  border-right: 1px solid var(--light-rule);
}

.footer-links {
  margin-top: 1.5rem;
  display: flex;
  justify-content: center;
  gap: 2rem;
}

.footer-links a {
  color: #b0a080;
  text-decoration: none;
  font-family: "DM Mono", monospace;
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  transition: color 0.2s;
}

.footer-links a:hover {
  color: var(--paper);
}

/* ── ANIMATIONS ── */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(24px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.hero-label {
  animation: fadeUp 0.6s 0.1s both;
}

.hero-headline {
  animation: fadeUp 0.7s 0.25s both;
}

.hero-body {
  animation: fadeUp 0.7s 0.4s both;
}

.btn-primary {
  animation: fadeUp 0.6s 0.55s both;
}

.portrait-frame {
  animation: fadeUp 0.8s 0.3s both;
}

.pull-quote {
  animation: fadeUp 0.7s 0.5s both;
}

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

  .hero-rule {
    display: none;
  }

  .hero-right {
    padding: 2rem 2rem 3rem;
  }

  .about-grid {
    grid-template-columns: 1fr;
  }

  .pub-grid {
    grid-template-columns: 1fr 1fr;
  }

  .masthead-top {
    flex-direction: column;
    gap: 0.5rem;
  }
}

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

  section {
    padding: 3rem 1.5rem;
  }
}