/* ==========================================================================
   THE CHECKOUT — Ghost Theme Stylesheet
   Editorial design system: black & white, serif + sans-serif
   ========================================================================== */

/* ---------- Reset & Base ---------- */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  /* Black & white editorial palette */
  --background: #FFFFFF;
  --card: #F5F5F5;
  --foreground: #0D0D0D;
  --card-foreground: #0D0D0D;
  --primary: #0D0D0D;
  --primary-foreground: #FFFFFF;
  --muted: #F5F5F5;
  --muted-foreground: #6B6B6B;
  --accent: #0D0D0D;
  --accent-foreground: #FFFFFF;
  --border: #E5E5E5;
  --radius: 0.25rem;

  /* Fonts */
  --font-sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-serif: 'Instrument Serif', Georgia, 'Times New Roman', serif;
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: var(--font-sans);
  background-color: var(--background);
  color: var(--foreground);
  line-height: 1.6;
  min-height: 100vh;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

button, input {
  font-family: inherit;
}

/* ---------- Typography ---------- */
.font-serif {
  font-family: var(--font-serif);
}

.font-sans {
  font-family: var(--font-sans);
}

/* ---------- Layout ---------- */
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.container-narrow {
  max-width: 720px;
  margin: 0 auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

@media (min-width: 640px) {
  .container, .container-narrow {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

@media (min-width: 1024px) {
  .container {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}

/* ---------- Header ---------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background-color: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-bottom: 1px solid var(--border);
}

.site-header-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: stretch;
}

.site-logo {
  display: flex;
  align-items: center;
  padding: 0.5rem 0;
  font-weight: 900;
  font-size: 1rem;
  letter-spacing: -0.02em;
  transition: opacity 0.5s;
  white-space: nowrap;
  flex-shrink: 0;
}

.site-logo img {
  height: 28px;
  width: auto;
}

@media (min-width: 1024px) {
  .site-logo img {
    height: 32px;
  }
}

.site-logo:hover {
  opacity: 0.7;
}

/* Desktop Nav */
.site-nav {
  display: none;
  align-items: center;
  gap: 0;
  border-left: 1px solid var(--border);
}

@media (min-width: 768px) {
  .site-nav {
    display: flex;
  }
}

.site-nav a {
  display: flex;
  align-items: center;
  padding: 1rem 1.25rem;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--muted-foreground);
  transition: all 0.5s;
  border-right: 1px solid var(--border);
  text-transform: uppercase;
}

.site-nav a:hover {
  color: var(--foreground);
  background-color: var(--card);
}

.header-spacer {
  flex: 1;
}

/* Subscribe Button (header) */
.header-subscribe {
  display: none;
  align-items: center;
  gap: 0.5rem;
  padding: 0 2rem;
  border-left: 1px solid var(--border);
  background-color: var(--accent);
  color: var(--accent-foreground);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.15em;
  transition: background-color 0.5s;
}

@media (min-width: 640px) {
  .header-subscribe {
    display: flex;
  }
}

.header-subscribe:hover {
  background-color: rgba(13, 13, 13, 0.9);
}

/* Mobile Menu Button */
.mobile-menu-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  background-color: var(--foreground);
  color: var(--background);
  border: none;
  border-left: 1px solid rgba(255,255,255,0.2);
  cursor: pointer;
}

@media (min-width: 768px) {
  .mobile-menu-btn {
    display: none;
  }
}

.mobile-menu-btn svg {
  width: 1.25rem;
  height: 1.25rem;
}

/* Mobile Menu */
.mobile-menu {
  display: none;
  border-top: 1px solid var(--border);
  background-color: var(--background);
}

.mobile-menu.is-open {
  display: block;
}

@media (min-width: 768px) {
  .mobile-menu {
    display: none !important;
  }
}

.mobile-menu a {
  display: block;
  padding: 1rem 1.5rem;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--muted-foreground);
  border-bottom: 1px solid var(--border);
  transition: all 0.3s;
  text-transform: uppercase;
}

.mobile-menu a:hover {
  color: var(--foreground);
  background-color: var(--card);
}

.mobile-menu .mobile-subscribe {
  background-color: var(--accent);
  color: var(--accent-foreground);
  letter-spacing: 0.15em;
}

.mobile-menu .mobile-subscribe:hover {
  background-color: rgba(13, 13, 13, 0.9);
}

/* ---------- Hero ---------- */
.hero {
  border-bottom: 1px solid var(--border);
}

.hero-inner {
  padding: 5rem 0;
  text-align: center;
}

@media (min-width: 640px) {
  .hero-inner {
    padding: 7rem 0;
  }
}

@media (min-width: 1024px) {
  .hero-inner {
    padding: 9rem 0;
  }
}

.hero-kicker {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.25em;
  color: var(--muted-foreground);
  margin-bottom: 1.5rem;
}

@media (min-width: 640px) {
  .hero-kicker {
    font-size: 11px;
    margin-bottom: 2rem;
  }
}

.hero h1 {
  font-family: var(--font-serif);
  font-size: 2.5rem;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.05;
  margin-bottom: 2rem;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  text-wrap: balance;
}

@media (min-width: 640px) {
  .hero h1 {
    font-size: 3.75rem;
    line-height: 1;
    margin-bottom: 2.5rem;
  }
}

@media (min-width: 1024px) {
  .hero h1 {
    font-size: 5.5rem;
  }
}

.hero h1 em {
  font-family: var(--font-serif);
  font-style: italic;
}

.hero-subtitle {
  font-size: 1rem;
  color: var(--muted-foreground);
  line-height: 1.625;
  margin-bottom: 2.5rem;
  max-width: 540px;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 640px) {
  .hero-subtitle {
    font-size: 1.125rem;
  }
}

/* Newsletter Form */
.newsletter-form {
  max-width: 28rem;
  margin: 0 auto;
}

.newsletter-form form {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

@media (min-width: 640px) {
  .newsletter-form form {
    flex-direction: row;
    gap: 0;
  }
}

.newsletter-form input[type="email"] {
  flex: 1;
  background-color: var(--background);
  border: 1px solid var(--border);
  padding: 0.875rem 1rem;
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  outline: none;
  transition: border-color 0.5s;
}

.newsletter-form input[type="email"]::placeholder {
  color: rgba(107, 107, 107, 0.5);
}

.newsletter-form input[type="email"]:focus {
  border-color: var(--foreground);
}

.newsletter-form button {
  background-color: var(--foreground);
  color: var(--background);
  padding: 0.875rem 2rem;
  font-weight: 700;
  font-size: 0.875rem;
  letter-spacing: 0.1em;
  border: none;
  cursor: pointer;
  transition: all 0.5s;
  white-space: nowrap;
}

.newsletter-form button:hover {
  background-color: rgba(13, 13, 13, 0.9);
}

.newsletter-form .form-note {
  font-size: 10px;
  letter-spacing: 0.15em;
  color: var(--muted-foreground);
  margin-top: 1rem;
  text-align: center;
}

/* Trusted By */
.trusted-by {
  margin-top: 4rem;
}

@media (min-width: 640px) {
  .trusted-by {
    margin-top: 5rem;
  }
}

.trusted-by-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.3em;
  color: var(--muted-foreground);
  margin-bottom: 2rem;
}

.trusted-by-logos {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 3rem 3rem;
}

@media (min-width: 1024px) {
  .trusted-by-logos {
    gap: 1.5rem 4rem;
  }
}

.trusted-by-logos span {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  color: rgba(107, 107, 107, 0.4);
  transition: color 0.5s;
  cursor: pointer;
}

@media (min-width: 1024px) {
  .trusted-by-logos span {
    font-size: 1.5rem;
  }
}

.trusted-by-logos span:hover {
  color: var(--foreground);
}

/* ---------- Featured Stories (Latest Drops) ---------- */
.featured-stories {
  border-bottom: 1px solid var(--border);
  background-color: var(--foreground);
  color: var(--background);
}

.featured-stories-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
}

@media (min-width: 1024px) {
  .featured-stories-inner {
    grid-template-columns: 1fr 2fr;
  }
}

.featured-stories-header {
  padding: 3rem 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

@media (min-width: 640px) {
  .featured-stories-header {
    padding: 3rem 2rem;
  }
}

@media (min-width: 1024px) {
  .featured-stories-header {
    padding: 4rem 3rem;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
  }
}

.featured-stories-header .kicker {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.25em;
  color: rgba(255, 255, 255, 0.5);
  margin-bottom: 1rem;
}

.featured-stories-header h2 {
  font-family: var(--font-serif);
  font-size: 2.5rem;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.05;
}

@media (min-width: 1024px) {
  .featured-stories-header h2 {
    font-size: 3rem;
  }
}

.featured-stories-header .view-all {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.2em;
  margin-top: 2.5rem;
  color: rgba(255, 255, 255, 0.5);
  transition: color 0.5s;
}

.featured-stories-header .view-all:hover {
  color: var(--background);
}

.featured-stories-header .view-all .arrow {
  display: inline-block;
  transition: transform 0.5s;
}

.featured-stories-header .view-all:hover .arrow {
  transform: translateX(4px);
}

/* Stories Grid */
.stories-grid {
  display: grid;
}

@media (min-width: 640px) {
  .stories-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.story-card {
  padding: 2rem 1.5rem;
  transition: background-color 0.5s;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

@media (min-width: 640px) {
  .story-card {
    padding: 2rem 2rem;
    border-bottom: none;
  }
  .story-card:nth-child(even) {
    border-left: 1px solid rgba(255, 255, 255, 0.1);
  }
  .story-card:nth-child(n+3) {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
  }
}

@media (min-width: 1024px) {
  .story-card {
    padding: 2.5rem 2rem;
  }
}

.story-card:hover {
  background-color: rgba(255, 255, 255, 0.05);
}

.story-card-meta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}

.story-card-tag {
  font-size: 9px;
  font-weight: 700;
  padding: 0.25rem 0.625rem;
  letter-spacing: 0.15em;
  background-color: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.7);
}

.story-card-tag.tag-featured {
  background-color: var(--background);
  color: var(--foreground);
}

.story-card-time {
  font-size: 10px;
  color: rgba(255, 255, 255, 0.4);
  font-weight: 500;
  letter-spacing: 0.05em;
}

.story-card h3 {
  font-family: var(--font-serif);
  font-size: 1.125rem;
  font-weight: 400;
  letter-spacing: -0.01em;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.9);
  transition: color 0.5s;
}

@media (min-width: 1024px) {
  .story-card h3 {
    font-size: 1.25rem;
  }
}

.story-card:hover h3 {
  color: var(--background);
}

/* ---------- Section Headings ---------- */
.section-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 4rem;
}

.section-heading-left {
  display: flex;
  align-items: baseline;
  gap: 1rem;
}

.section-heading h2 {
  font-family: var(--font-serif);
  font-size: 3rem;
  font-weight: 400;
  letter-spacing: -0.02em;
}

@media (min-width: 1024px) {
  .section-heading h2 {
    font-size: 3.75rem;
  }
}

.section-heading-line {
  display: none;
  width: 4rem;
  height: 2px;
  background-color: var(--foreground);
  margin-bottom: 0.5rem;
}

@media (min-width: 640px) {
  .section-heading-line {
    display: block;
  }
}

.view-all-link {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.2em;
  color: var(--muted-foreground);
  transition: color 0.5s;
}

.view-all-link:hover {
  color: var(--foreground);
}

.view-all-link .arrow {
  display: inline-block;
  transition: transform 0.5s;
}

.view-all-link:hover .arrow {
  transform: translateX(4px);
}

/* ---------- Content Sections ---------- */
.content-section {
  padding: 5rem 0;
  border-bottom: 1px solid var(--border);
}

@media (min-width: 1024px) {
  .content-section {
    padding: 7rem 0;
  }
}

/* ---------- News Section ---------- */

/* Featured Article */
.featured-article {
  display: block;
  margin-bottom: 4rem;
}

@media (min-width: 1024px) {
  .featured-article {
    margin-bottom: 5rem;
  }
}

.featured-article-grid {
  display: grid;
  gap: 2rem;
}

@media (min-width: 1024px) {
  .featured-article-grid {
    grid-template-columns: 1fr 1.2fr;
    gap: 3rem;
  }
}

.featured-article-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.article-meta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}

.article-tag {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.2em;
  color: var(--foreground);
  text-transform: uppercase;
}

.article-date {
  font-size: 10px;
  color: var(--muted-foreground);
}

.article-read-time {
  font-size: 10px;
  color: var(--muted-foreground);
}

.article-separator {
  font-size: 10px;
  color: rgba(107, 107, 107, 0.5);
}

.featured-article h3 {
  font-family: var(--font-serif);
  font-size: 1.875rem;
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin-bottom: 1.5rem;
}

@media (min-width: 640px) {
  .featured-article h3 {
    font-size: 2.25rem;
  }
}

@media (min-width: 1024px) {
  .featured-article h3 {
    font-size: 3rem;
  }
}

.featured-article .excerpt {
  font-size: 1rem;
  color: var(--muted-foreground);
  line-height: 1.625;
  max-width: 540px;
}

@media (min-width: 1024px) {
  .featured-article .excerpt {
    font-size: 1.125rem;
  }
}

.read-more {
  margin-top: 2rem;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.2em;
  color: var(--muted-foreground);
  transition: color 0.5s;
}

.featured-article:hover .read-more,
.read-more:hover {
  color: var(--foreground);
}

.section-divider {
  border-top: 1px solid var(--border);
  margin-bottom: 3rem;
}

/* Article Grid */
.article-grid {
  display: grid;
  gap: 3rem;
}

@media (min-width: 1024px) {
  .article-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 3rem;
  }
}

.article-grid-2col {
  display: grid;
  gap: 0 3rem;
}

@media (min-width: 1024px) {
  .article-grid-2col {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Post Card */
.post-card {
  display: block;
}

.post-card-image {
  width: 100%;
  height: 200px;
  background-color: var(--card);
  margin-bottom: 1.25rem;
  overflow: hidden;
  position: relative;
}

.post-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: filter 0.7s cubic-bezier(0.25, 0.1, 0.25, 1), transform 0.7s cubic-bezier(0.25, 0.1, 0.25, 1);
  filter: grayscale(0.3) contrast(1.05) brightness(1.02);
}

.post-card:hover .post-card-image img {
  filter: grayscale(0) contrast(1) brightness(1);
  transform: scale(1.03);
}

.post-card .article-meta {
  margin-bottom: 1rem;
}

.post-card h3 {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.4;
  margin-bottom: 0.75rem;
}

@media (min-width: 1024px) {
  .post-card h3 {
    font-size: 1.5rem;
  }
}

.post-card .excerpt {
  font-size: 0.875rem;
  color: var(--muted-foreground);
  line-height: 1.625;
}

/* ---------- Card Lift Animation ---------- */
.card-lift {
  transition: transform 0.5s cubic-bezier(0.25, 0.1, 0.25, 1), background-color 0.5s ease;
}

.card-lift:hover {
  transform: translateY(-3px);
}

/* ---------- Headline Hover ---------- */
.headline-hover {
  display: inline;
  background-image: linear-gradient(var(--foreground), var(--foreground));
  background-position: 0% 100%;
  background-repeat: no-repeat;
  background-size: 0% 1.5px;
  transition: background-size 0.5s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.post-card:hover .headline-hover,
.featured-article:hover .headline-hover,
a:hover .headline-hover,
.headline-hover:hover {
  background-size: 100% 1.5px;
}

/* White variant for dark backgrounds */
.headline-hover-white {
  display: inline;
  background-image: linear-gradient(var(--background), var(--background));
  background-position: 0% 100%;
  background-repeat: no-repeat;
  background-size: 0% 1.5px;
  transition: background-size 0.5s cubic-bezier(0.25, 0.1, 0.25, 1);
}

a:hover .headline-hover-white {
  background-size: 100% 1.5px;
}

/* ---------- Analysis Section ---------- */
.deep-dive {
  background-color: var(--card);
  padding: 2rem;
  margin: 0 -1.5rem;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  margin-bottom: 3rem;
}

@media (min-width: 640px) {
  .deep-dive {
    padding: 2rem;
    margin: 0 -2rem;
    margin-bottom: 3rem;
  }
}

@media (min-width: 1024px) {
  .deep-dive {
    padding: 3rem;
    margin: 0 -3rem;
    margin-bottom: 3rem;
  }
}

.deep-dive h3 {
  font-family: var(--font-serif);
  font-size: 1.875rem;
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin-bottom: 1.5rem;
  max-width: 800px;
}

@media (min-width: 640px) {
  .deep-dive h3 {
    font-size: 2.25rem;
  }
}

@media (min-width: 1024px) {
  .deep-dive h3 {
    font-size: 3rem;
  }
}

.deep-dive .excerpt {
  font-size: 1rem;
  color: var(--muted-foreground);
  line-height: 1.625;
  max-width: 620px;
}

@media (min-width: 1024px) {
  .deep-dive .excerpt {
    font-size: 1.125rem;
  }
}

/* Analysis list items */
.analysis-item {
  display: block;
  padding: 2rem 0;
  border-bottom: 1px solid var(--border);
}

.analysis-item h3 {
  font-family: var(--font-serif);
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1.4;
  margin-bottom: 1rem;
  max-width: 540px;
}

@media (min-width: 1024px) {
  .analysis-item h3 {
    font-size: 1.875rem;
  }
}

.analysis-item .excerpt {
  font-size: 0.875rem;
  color: var(--muted-foreground);
  line-height: 1.625;
  max-width: 480px;
}

/* ---------- Data Section ---------- */
.data-list {
  border-top: 1px solid var(--border);
}

.data-item {
  display: flex;
  flex-direction: column;
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--border);
}

@media (min-width: 1024px) {
  .data-item {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 2rem 0;
  }
}

.data-item h3 {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.4;
  max-width: 600px;
}

@media (min-width: 1024px) {
  .data-item h3 {
    font-size: 1.5rem;
  }
}

.data-item .arrow {
  display: inline-block;
  margin-top: 1rem;
  transition: transform 0.5s;
}

@media (min-width: 1024px) {
  .data-item .arrow {
    margin-top: 0;
    margin-left: 2rem;
  }
}

.data-item:hover .arrow {
  transform: translateX(4px);
}

.data-item .sponsored {
  font-size: 10px;
  color: rgba(107, 107, 107, 0.6);
}

/* ---------- Interviews Section ---------- */
.interview-featured {
  display: grid;
  gap: 2rem;
  margin-bottom: 3rem;
}

@media (min-width: 1024px) {
  .interview-featured {
    grid-template-columns: 320px 1fr;
    gap: 3rem;
  }
}

.interview-photo {
  width: 100%;
  height: 320px;
  background-color: var(--card);
  overflow: hidden;
  position: relative;
}

@media (min-width: 1024px) {
  .interview-photo {
    height: 400px;
  }
}

.interview-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
  transition: filter 0.7s cubic-bezier(0.25, 0.1, 0.25, 1), transform 0.7s cubic-bezier(0.25, 0.1, 0.25, 1);
  filter: grayscale(0.3) contrast(1.05) brightness(1.02);
}

a:hover .interview-photo img {
  filter: grayscale(0) contrast(1) brightness(1);
  transform: scale(1.03);
}

.interview-featured .interview-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.interview-featured h3 {
  font-family: var(--font-serif);
  font-size: 1.875rem;
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin-bottom: 1.25rem;
}

@media (min-width: 640px) {
  .interview-featured h3 {
    font-size: 2.25rem;
  }
}

@media (min-width: 1024px) {
  .interview-featured h3 {
    font-size: 3rem;
  }
}

.interview-featured .excerpt {
  font-size: 1rem;
  color: var(--muted-foreground);
  line-height: 1.625;
  max-width: 540px;
  margin-bottom: 1.5rem;
}

@media (min-width: 1024px) {
  .interview-featured .excerpt {
    font-size: 1.125rem;
  }
}

.interview-author-info {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.interview-author-info .name {
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.interview-author-info .role {
  font-size: 10px;
  letter-spacing: 0.15em;
  color: var(--muted-foreground);
  margin-top: 0.125rem;
}

/* Interview list */
.interview-item {
  display: flex;
  gap: 1.5rem;
  padding: 2rem 0;
  border-bottom: 1px solid var(--border);
}

.interview-item-photo {
  width: 5rem;
  height: 5rem;
  flex-shrink: 0;
  background-color: var(--card);
  overflow: hidden;
}

@media (min-width: 1024px) {
  .interview-item-photo {
    width: 6rem;
    height: 6rem;
  }
}

.interview-item-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
  transition: filter 0.7s cubic-bezier(0.25, 0.1, 0.25, 1), transform 0.7s cubic-bezier(0.25, 0.1, 0.25, 1);
  filter: grayscale(0.3) contrast(1.05) brightness(1.02);
}

a:hover .interview-item-photo img {
  filter: grayscale(0) contrast(1) brightness(1);
  transform: scale(1.03);
}

.interview-item-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.interview-item h3 {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.4;
  margin-bottom: 0.5rem;
}

@media (min-width: 1024px) {
  .interview-item h3 {
    font-size: 1.5rem;
  }
}

.interview-item .guest-info {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--muted-foreground);
}

.interview-item .guest-info .divider {
  font-weight: 400;
  color: rgba(107, 107, 107, 0.5);
  margin: 0 0.25rem;
}

.interview-item .guest-info .company {
  font-weight: 400;
}

/* ---------- Newsletter CTA Section ---------- */
.newsletter-section {
  padding: 6rem 0;
  border-bottom: 1px solid var(--border);
  background-color: var(--card);
  position: relative;
  overflow: hidden;
}

@media (min-width: 1024px) {
  .newsletter-section {
    padding: 8rem 0;
  }
}

.newsletter-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: var(--foreground);
}

.newsletter-section .newsletter-content {
  max-width: 700px;
}

.newsletter-section .kicker {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.25em;
  color: var(--muted-foreground);
  margin-bottom: 1.5rem;
}

.newsletter-section h2 {
  font-family: var(--font-serif);
  font-size: 3rem;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1;
  margin-bottom: 1rem;
}

@media (min-width: 640px) {
  .newsletter-section h2 {
    font-size: 3.75rem;
  }
}

@media (min-width: 1024px) {
  .newsletter-section h2 {
    font-size: 4.5rem;
  }
}

.newsletter-section .subtitle {
  font-size: 1rem;
  color: var(--muted-foreground);
  line-height: 1.625;
  margin-bottom: 3rem;
  max-width: 480px;
}

@media (min-width: 640px) {
  .newsletter-section .subtitle {
    font-size: 1.125rem;
  }
}

.newsletter-section .newsletter-form {
  max-width: 24rem;
  margin: 0;
}

.newsletter-section .newsletter-form input[type="email"] {
  border-width: 2px;
}

.newsletter-stats {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.2em;
  color: var(--muted-foreground);
  margin-top: 1.5rem;
}

.newsletter-stats-divider {
  color: var(--border);
}

.newsletter-section .trusted-by-logos {
  justify-content: flex-start;
}

/* ---------- Footer ---------- */
.site-footer {
  background-color: var(--foreground);
  color: var(--background);
  overflow: hidden;
}

.footer-logo-section {
  padding: 5rem 0 4rem;
}

@media (min-width: 1024px) {
  .footer-logo-section {
    padding: 7rem 0 5rem;
  }
}

.footer-logo {
  font-weight: 900;
  font-size: 2.25rem;
  letter-spacing: -0.02em;
  color: rgba(255, 255, 255, 0.9);
  line-height: 1;
}

@media (min-width: 640px) {
  .footer-logo {
    font-size: 3.75rem;
  }
}

@media (min-width: 1024px) {
  .footer-logo {
    font-size: 6rem;
  }
}

.footer-accent-line {
  width: 6rem;
  height: 3px;
  background-color: rgba(255, 255, 255, 0.3);
  margin-top: 1.5rem;
  margin-bottom: 2rem;
}

.footer-tagline {
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.4);
  max-width: 400px;
  line-height: 1.625;
}

/* Footer Links */
.footer-links {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-links-inner {
  padding: 3rem 0;
}

@media (min-width: 1024px) {
  .footer-links-inner {
    padding: 4rem 0;
  }
}

.footer-links-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}

@media (min-width: 640px) {
  .footer-links-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 3rem;
  }
}

.footer-links-column h4 {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.2em;
  color: rgba(255, 255, 255, 0.3);
  margin-bottom: 1.25rem;
}

.footer-links-column ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.footer-links-column a {
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.5);
  transition: color 0.5s;
}

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

.footer-links-column p {
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.5);
  line-height: 1.625;
  margin-bottom: 1rem;
}

.footer-apply-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.2em;
  color: rgba(255, 255, 255, 0.7);
  transition: color 0.5s;
}

.footer-apply-link:hover {
  color: var(--background);
}

.footer-apply-link .arrow {
  display: inline-block;
  transition: transform 0.5s;
}

.footer-apply-link:hover .arrow {
  transform: translateX(4px);
}

/* Footer Bottom */
.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-bottom-inner {
  padding: 1.5rem 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
}

@media (min-width: 640px) {
  .footer-bottom-inner {
    flex-direction: row;
    justify-content: space-between;
  }
}

.footer-copyright {
  font-size: 10px;
  letter-spacing: 0.15em;
  color: rgba(255, 255, 255, 0.25);
}

.footer-legal {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.footer-legal a {
  font-size: 10px;
  letter-spacing: 0.15em;
  color: rgba(255, 255, 255, 0.25);
  transition: color 0.5s;
}

.footer-legal a:hover {
  color: rgba(255, 255, 255, 0.5);
}

/* ---------- Post Page ---------- */
.post-header {
  padding-top: 2.5rem;
  padding-bottom: 1.5rem;
}

@media (min-width: 640px) {
  .post-header {
    padding-top: 3rem;
  }
}

@media (min-width: 1024px) {
  .post-header {
    padding-top: 3.5rem;
  }
}

.post-header .post-tag-date {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 2rem;
}

.post-header .post-tag-date .tag-line {
  width: 1.5rem;
  height: 1.5px;
  background-color: var(--border);
}

.post-header h1 {
  font-family: var(--font-serif);
  font-size: 2.25rem;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.1;
  margin-bottom: 2rem;
}

@media (min-width: 640px) {
  .post-header h1 {
    font-size: 3rem;
  }
}

@media (min-width: 1024px) {
  .post-header h1 {
    font-size: 3.5rem;
  }
}

.post-accent-line {
  width: 4rem;
  height: 2px;
  background-color: var(--foreground);
  margin-bottom: 2rem;
}

.post-lead {
  font-size: 1.125rem;
  color: var(--muted-foreground);
  line-height: 1.625;
  margin-bottom: 2.5rem;
  max-width: 600px;
}

/* Author byline */
a.post-author-byline {
  display: flex;
  align-items: center;
  padding: 1.5rem 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  text-decoration: none;
  color: inherit;
}

a.post-author-byline:hover .author-name {
  opacity: 0.7;
}

.post-author-byline .author-avatar {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  margin-right: 0.75rem;
  background-color: var(--card);
}

.post-author-byline .author-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.post-author-byline .author-name {
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.2;
}

.post-author-byline .author-title {
  font-size: 0.75rem;
  color: var(--muted-foreground);
}

/* Post body / Ghost content */
.post-body {
  padding: 1.5rem 0 2rem;
}

.post-body .gh-content p {
  color: rgba(13, 13, 13, 0.85);
  font-size: 1.0625rem;
  line-height: 1.85;
  margin-bottom: 1.75rem;
}

.post-body .gh-content h2 {
  font-family: var(--font-serif);
  font-size: 2rem;
  font-weight: 400;
  margin: 3rem 0 1.5rem;
  letter-spacing: -0.02em;
}

.post-body .gh-content h3 {
  font-family: var(--font-serif);
  font-size: 1.5rem;
  font-weight: 400;
  margin: 2.5rem 0 1rem;
}

.post-body .gh-content blockquote {
  position: relative;
  margin: 2.5rem 0;
  padding: 0 0 0 2rem;
  border-left: 3px solid var(--foreground);
}

.post-body .gh-content blockquote p {
  font-family: var(--font-serif);
  font-size: 1.375rem;
  line-height: 1.45;
  font-style: italic;
  color: var(--foreground);
  letter-spacing: -0.01em;
}

.post-body .gh-content ul,
.post-body .gh-content ol {
  color: rgba(13, 13, 13, 0.85);
  font-size: 1.0625rem;
  line-height: 1.85;
  margin-bottom: 1.75rem;
  padding-left: 1.5rem;
}

.post-body .gh-content li {
  margin-bottom: 0.5rem;
}

.post-body .gh-content a {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: var(--border);
  transition: text-decoration-color 0.3s;
}

.post-body .gh-content a:hover {
  text-decoration-color: var(--foreground);
}

.post-body .gh-content img {
  width: 100%;
  margin: 2rem 0;
}

.post-body .gh-content figure {
  margin: 2rem 0;
}

.post-body .gh-content figcaption {
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  text-align: center;
  margin-top: 0.75rem;
}

.post-body .gh-content hr {
  border: none;
  border-top: 1px solid var(--border);
  margin: 3rem 0;
}

/* Feature Image */
.post-feature-image {
  display: none;
  width: 100%;
  margin-bottom: 2rem;
  overflow: hidden;
}

.post-feature-image img {
  width: 100%;
  height: auto;
  filter: grayscale(0.3) contrast(1.05) brightness(1.02);
}

/* ---------- Venice Founders CTA ---------- */
.venice-cta {
  margin-top: 3rem;
  padding-top: 2.5rem;
  padding-bottom: 4rem;
  border-top: 1px solid var(--border);
}

.venice-cta-inner {
  border: 1px solid var(--border);
  background-color: var(--card);
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

@media (min-width: 1024px) {
  .venice-cta-inner {
    flex-direction: row;
    align-items: center;
    gap: 2rem;
    padding: 1.25rem;
  }
}

.venice-cta-tagline {
  background-color: var(--muted, #EBEBEB);
  padding: 1rem 1.25rem;
  flex-shrink: 0;
}

@media (min-width: 1024px) {
  .venice-cta-tagline {
    width: 20rem;
    padding: 1.25rem;
  }
}

.venice-cta-headline {
  font-size: 1.125rem;
  font-weight: 400;
  line-height: 1.4;
}

@media (min-width: 1024px) {
  .venice-cta-headline {
    font-size: 1.25rem;
  }
}

.venice-highlight {
  background-color: var(--foreground);
  color: var(--background);
  padding: 0 0.25rem;
}

.venice-cta-brand {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.15em;
  color: var(--muted-foreground);
  margin-top: 0.75rem;
}

.venice-cta-body {
  flex: 1;
}

.venice-cta-body h3 {
  font-size: 1.125rem;
  font-weight: 400;
  margin-bottom: 0.5rem;
}

@media (min-width: 1024px) {
  .venice-cta-body h3 {
    font-size: 1.25rem;
  }
}

.venice-cta-body p {
  font-size: 0.875rem;
  color: var(--muted-foreground);
  line-height: 1.625;
  margin-bottom: 0.75rem;
}

.venice-cta-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--foreground);
  transition: opacity 0.3s;
}

.venice-cta-link:hover {
  opacity: 0.7;
}

.venice-cta-link .arrow {
  transition: transform 0.5s;
}

.venice-cta-link:hover .arrow {
  transform: translateX(4px);
}

/* ---------- Up Next / Related ---------- */
.up-next {
  border-top: 1px solid var(--border);
  padding: 5rem 0;
}

@media (min-width: 1024px) {
  .up-next {
    padding: 6rem 0;
  }
}

.up-next-grid {
  display: grid;
  gap: 2.5rem 2.5rem;
}

@media (min-width: 640px) {
  .up-next-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .up-next-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ---------- Tag Page ---------- */
.tag-header {
  border-bottom: 1px solid var(--border);
  padding: 4rem 0 5rem;
}

.tag-header h1 {
  font-family: var(--font-serif);
  font-size: 3rem;
  font-weight: 400;
  letter-spacing: -0.02em;
  margin-bottom: 1rem;
}

@media (min-width: 1024px) {
  .tag-header h1 {
    font-size: 3.75rem;
  }
}

.tag-header .tag-description {
  font-size: 1.125rem;
  color: var(--muted-foreground);
  max-width: 640px;
}

.tag-header .heading-row {
  display: flex;
  align-items: baseline;
  gap: 1.5rem;
}

/* Tag article list */
.tag-article-list {
  border-bottom: 1px solid var(--border);
}

.tag-article-item {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 2rem 0;
  border-bottom: 1px solid var(--border);
  transition: background-color 0.5s;
}

@media (min-width: 1024px) {
  .tag-article-item {
    flex-direction: row;
    padding: 2.5rem 0;
  }
}

.tag-article-item:last-child {
  border-bottom: none;
}

.tag-article-image {
  width: 100%;
  height: 12rem;
  flex-shrink: 0;
  background-color: var(--card);
  overflow: hidden;
}

@media (min-width: 1024px) {
  .tag-article-image {
    width: 20rem;
    height: 12rem;
  }
}

.tag-article-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: filter 0.7s cubic-bezier(0.25, 0.1, 0.25, 1), transform 0.7s cubic-bezier(0.25, 0.1, 0.25, 1);
  filter: grayscale(0.3) contrast(1.05) brightness(1.02);
}

.tag-article-item:hover .tag-article-image img {
  filter: grayscale(0) contrast(1) brightness(1);
  transform: scale(1.03);
}

.tag-article-content h2 {
  font-family: var(--font-serif);
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1.4;
  margin-bottom: 0.75rem;
}

@media (min-width: 1024px) {
  .tag-article-content h2 {
    font-size: 1.875rem;
  }
}

.tag-article-content .excerpt {
  font-size: 0.875rem;
  color: var(--muted-foreground);
  line-height: 1.625;
}

@media (min-width: 1024px) {
  .tag-article-content .excerpt {
    font-size: 1rem;
  }
}

/* ---------- About / Custom Pages ---------- */
.page-hero {
  border-bottom: 1px solid var(--border);
  padding: 5rem 0;
}

@media (min-width: 1024px) {
  .page-hero {
    padding: 7rem 0;
  }
}

.page-hero h1 {
  font-family: var(--font-serif);
  font-size: 2.25rem;
  font-weight: 400;
  line-height: 1.15;
  margin-bottom: 2rem;
  max-width: 700px;
  text-wrap: balance;
}

@media (min-width: 640px) {
  .page-hero h1 {
    font-size: 3rem;
  }
}

@media (min-width: 1024px) {
  .page-hero h1 {
    font-size: 3.75rem;
  }
}

.page-hero .lead {
  font-size: 1.125rem;
  color: var(--muted-foreground);
  line-height: 1.625;
  max-width: 700px;
}

@media (min-width: 1024px) {
  .page-hero .lead {
    font-size: 1.25rem;
  }
}

/* Page sections */
.page-section {
  border-bottom: 1px solid var(--border);
  padding: 5rem 0;
}

@media (min-width: 1024px) {
  .page-section {
    padding: 6rem 0;
  }
}

.page-section-bg {
  border-bottom: 1px solid var(--border);
  background-color: var(--card);
  padding: 5rem 0;
}

@media (min-width: 1024px) {
  .page-section-bg {
    padding: 6rem 0;
  }
}

.page-section h2 {
  font-family: var(--font-serif);
  font-size: 1.875rem;
  font-weight: 400;
  margin-bottom: 1.5rem;
}

@media (min-width: 1024px) {
  .page-section h2 {
    font-size: 2.25rem;
  }
}

.page-section-grid {
  display: grid;
  gap: 3rem;
}

@media (min-width: 1024px) {
  .page-section-grid {
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
  }
}

/* ---------- Subscribe Page Styles ---------- */
.subscribe-hero {
  border-bottom: 1px solid var(--border);
}

.subscribe-hero-grid {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
}

@media (min-width: 1024px) {
  .subscribe-hero-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.subscribe-form-area {
  padding: 2rem 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media (min-width: 640px) {
  .subscribe-form-area {
    padding: 3rem 2rem;
  }
}

@media (min-width: 1024px) {
  .subscribe-form-area {
    padding: 4rem;
    border-right: 1px solid var(--border);
  }
}

.subscribe-stats-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.subscribe-stat {
  padding: 2rem;
  border-left: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media (min-width: 1024px) {
  .subscribe-stat {
    padding: 2.5rem;
  }
}

.subscribe-stat .value {
  font-size: 1.875rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

@media (min-width: 1024px) {
  .subscribe-stat .value {
    font-size: 2.25rem;
  }
}

.subscribe-stat .label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--muted-foreground);
  margin-top: 0.75rem;
}

.subscribe-stat .desc {
  font-size: 0.875rem;
  color: var(--muted-foreground);
  margin-top: 0.25rem;
}

/* Benefits grid */
.benefits-grid {
  display: grid;
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .benefits-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (min-width: 1024px) {
  .benefits-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.benefit-card {
  padding: 2rem;
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.benefit-card h3 {
  font-weight: 600;
  font-size: 1.125rem;
  margin-bottom: 0.5rem;
  margin-top: 1rem;
}

.benefit-card p {
  font-size: 0.875rem;
  color: var(--muted-foreground);
  line-height: 1.625;
}

/* Testimonials */
.testimonials-grid {
  display: grid;
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .testimonials-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.testimonial-card {
  padding: 2rem;
  border-right: 1px solid var(--border);
}

@media (min-width: 1024px) {
  .testimonial-card {
    padding: 2.5rem;
  }
}

.testimonial-card blockquote {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.625;
  margin-bottom: 1.5rem;
}

.testimonial-author {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.testimonial-author .avatar {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-color: var(--muted);
}

.testimonial-author .name {
  font-weight: 600;
}

.testimonial-author .role {
  font-size: 0.875rem;
  color: var(--muted-foreground);
}

/* Dark CTA section */
.dark-cta {
  background-color: var(--foreground);
  color: var(--background);
  padding: 5rem 0;
  text-align: center;
}

@media (min-width: 1024px) {
  .dark-cta {
    padding: 6rem 0;
  }
}

.dark-cta h2 {
  font-family: var(--font-serif);
  font-size: 2.25rem;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 0.9;
  margin-bottom: 1.5rem;
}

@media (min-width: 1024px) {
  .dark-cta h2 {
    font-size: 3rem;
  }
}

.dark-cta p {
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 2.5rem;
  line-height: 1.625;
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}

/* Topics tags */
.topics-flex {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.topic-tag {
  padding: 0.5rem 1rem;
  background-color: var(--card);
  font-size: 0.875rem;
  font-weight: 500;
  transition: background-color 0.3s;
}

.topic-tag:hover {
  background-color: var(--muted);
}

/* FAQ */
.faq-list {
  border-top: 1px solid var(--border);
}

.faq-item {
  display: grid;
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--border);
  gap: 0.5rem;
}

@media (min-width: 1024px) {
  .faq-item {
    grid-template-columns: 1fr 2fr;
    padding: 2rem 0;
    gap: 0;
  }
}

.faq-item .question {
  font-weight: 600;
}

.faq-item .answer {
  color: var(--muted-foreground);
}

/* ---------- Author Page ---------- */
.author-header {
  border-bottom: 1px solid var(--border);
  padding: 4rem 0;
}

@media (min-width: 1024px) {
  .author-header {
    padding: 5rem 0;
  }
}

.author-header-content {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.author-header .author-avatar-lg {
  width: 6rem;
  height: 6rem;
  border-radius: 50%;
  overflow: hidden;
  background-color: var(--card);
  flex-shrink: 0;
}

.author-header .author-avatar-lg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.author-header h1 {
  font-family: var(--font-serif);
  font-size: 2.5rem;
  font-weight: 400;
  margin-bottom: 0.5rem;
}

@media (min-width: 1024px) {
  .author-header h1 {
    font-size: 3rem;
  }
}

.author-header .author-bio {
  font-size: 1rem;
  color: var(--muted-foreground);
  line-height: 1.625;
  max-width: 500px;
}

/* ---------- Pagination ---------- */
.pagination {
  border-bottom: 1px solid var(--border);
  padding: 3rem 0;
  display: flex;
  justify-content: center;
  gap: 1rem;
}

.pagination a,
.pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 1.5rem;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  transition: all 0.5s;
}

.pagination a {
  background-color: var(--foreground);
  color: var(--background);
}

.pagination a:hover {
  background-color: rgba(13, 13, 13, 0.9);
}

.pagination span.current {
  color: var(--muted-foreground);
}

/* ---------- Animations ---------- */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in-up {
  animation: fadeInUp 0.8s cubic-bezier(0.25, 0.1, 0.25, 1) forwards;
  opacity: 0;
}

.animate-fade-in-up-delay-1 {
  animation: fadeInUp 0.8s cubic-bezier(0.25, 0.1, 0.25, 1) 0.15s forwards;
  opacity: 0;
}

.animate-fade-in-up-delay-2 {
  animation: fadeInUp 0.8s cubic-bezier(0.25, 0.1, 0.25, 1) 0.3s forwards;
  opacity: 0;
}

.animate-fade-in-up-delay-3 {
  animation: fadeInUp 0.8s cubic-bezier(0.25, 0.1, 0.25, 1) 0.45s forwards;
  opacity: 0;
}

/* Footer reveal animation */
.footer-reveal {
  opacity: 0;
  transform: translateY(2rem);
  transition: all 1.2s ease-out;
}

.footer-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.footer-reveal-delay {
  opacity: 0;
  transform: translateY(1rem);
  transition: all 1.2s ease-out 0.3s;
}

.footer-reveal-delay.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.footer-links-reveal {
  opacity: 0;
  transform: translateY(1.5rem);
  transition: all 1.2s ease-out 0.5s;
}

.footer-links-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ---------- Image Editorial Treatment ---------- */
.image-editorial {
  position: relative;
  overflow: hidden;
}

.image-editorial img {
  transition: filter 0.7s cubic-bezier(0.25, 0.1, 0.25, 1), transform 0.7s cubic-bezier(0.25, 0.1, 0.25, 1);
  filter: grayscale(0.3) contrast(1.05) brightness(1.02);
}

a:hover .image-editorial img,
.image-editorial:hover img {
  filter: grayscale(0) contrast(1) brightness(1);
  transform: scale(1.03);
}

/* ---------- Utilities ---------- */
.text-balance {
  text-wrap: balance;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* ---------- Ghost Koenig Editor: Width Classes ---------- */
.gh-content .kg-width-wide {
  position: relative;
  width: 85vw;
  min-width: 100%;
  margin-left: calc(50% - 42.5vw);
  margin-right: calc(50% - 42.5vw);
}

.gh-content .kg-width-full {
  position: relative;
  width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

.gh-content .kg-width-full img {
  max-width: 100%;
}

.gh-content .kg-width-wide img {
  max-width: 100%;
}

/* ---------- Ghost-specific: Members & Portal ---------- */
.gh-portal-close {
  z-index: 99999 !important;
}

/* Subscription form overrides (Ghost default portal) */
.gh-subscribe-form {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

@media (min-width: 640px) {
  .gh-subscribe-form {
    flex-direction: row;
    gap: 0;
  }
}

/* Error page */
.error-page {
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 4rem 2rem;
}

.error-page h1 {
  font-family: var(--font-serif);
  font-size: 6rem;
  font-weight: 400;
  letter-spacing: -0.02em;
  margin-bottom: 1rem;
}

.error-page p {
  color: var(--muted-foreground);
  font-size: 1.125rem;
  margin-bottom: 2rem;
}

.error-page a {
  display: inline-block;
  background-color: var(--foreground);
  color: var(--background);
  padding: 0.875rem 2rem;
  font-weight: 700;
  font-size: 0.875rem;
  letter-spacing: 0.1em;
  transition: background-color 0.5s;
}

.error-page a:hover {
  background-color: rgba(13, 13, 13, 0.9);
}