/* Reusable SEO/blog page styles. Used by pages/seo and pages/blog. */
/* UNIVERSAL SEO / BLOG PAGE */
.seo-page {
  background: #070706;
  color: #fffdf9;
  font-family: "Outfit", sans-serif;
}

.seo-hero {
  min-height: 70vh;
  padding: 150px 6vw 80px;
  background: radial-gradient(
      circle at 75% 20%,
      rgba(200, 96, 26, 0.18),
      transparent 38%
    ),
    linear-gradient(180deg, #0b0a09 0%, #070706 100%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.seo-container {
  max-width: 980px;
  margin: 0 auto;
}

.seo-kicker {
  color: #d47a3a;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 0.78rem;
  font-weight: 800;
  margin-bottom: 22px;
}

.seo-title {
  font-family: "Playfair Display", serif;
  font-size: clamp(3rem, 8vw, 6.4rem);
  line-height: 0.96;
  letter-spacing: -0.05em;
  font-weight: 400;
  margin: 0;
}

.seo-title em {
  color: #e88443;
  font-style: italic;
}

.seo-subtitle {
  max-width: 720px;
  margin-top: 26px;
  font-size: 1.12rem;
  line-height: 1.8;
  color: rgba(255, 253, 249, 0.68);
}

.seo-content {
  padding: 80px 6vw;
}

.seo-card-section {
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 28px;
  padding: clamp(28px, 5vw, 52px);
  margin-bottom: 28px;
}

.seo-card-section h2 {
  font-size: clamp(1.8rem, 4vw, 3rem);
  line-height: 1.05;
  margin: 0 0 18px;
  letter-spacing: -0.04em;
}

.seo-card-section h3 {
  font-size: 1.25rem;
  margin: 26px 0 8px;
}

.seo-card-section p,
.seo-card-section li {
  color: rgba(255, 253, 249, 0.68);
  font-size: 1.02rem;
  line-height: 1.85;
}

.seo-card-section ul {
  padding-left: 22px;
}

.seo-cta-box {
  background: linear-gradient(
    135deg,
    rgba(200, 96, 26, 0.22),
    rgba(255, 255, 255, 0.04)
  );
  border: 1px solid rgba(232, 132, 67, 0.28);
  border-radius: 30px;
  padding: clamp(30px, 5vw, 56px);
  margin-top: 42px;
}

.seo-cta-box h2 {
  font-size: clamp(2rem, 5vw, 4rem);
  line-height: 1;
  margin: 0 0 18px;
}

.seo-btn {
  display: inline-flex;
  margin-top: 22px;
  padding: 16px 26px;
  border-radius: 999px;
  background: linear-gradient(135deg, #d56f2e, #f2a45f);
  color: #fff;
  font-weight: 800;
  text-decoration: none;
}

.seo-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  padding: 24px 6vw;
  background: rgba(7, 7, 6, 0.82);
  backdrop-filter: blur(18px);
  z-index: 99;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.seo-nav a {
  color: #fffdf9;
  text-decoration: none;
  font-weight: 800;
}

.seo-nav .seo-home {
  font-family: "Playfair Display", serif;
  font-size: 1.4rem;
}

/* Homepage SEO cards and shared SEO helper text */
.seo-hidden {
  font-size: 0.9rem;
  line-height: 1.75;
  color: rgba(26, 21, 18, 0.62);
  max-width: 760px;
  margin: 12px 0 0;
}
.seo-card {
  text-decoration: none;
  color: inherit;
  display: block;
  cursor: pointer;
  transition: 0.3s ease;
}
.seo-card:hover {
  transform: translateY(-5px);
  border-color: rgba(200, 96, 26, 0.45);
  box-shadow: 0 24px 70px rgba(26, 21, 18, 0.1);
}
.pc-desc {
  margin: 10px 0 0;
  font-size: 0.86rem;
  line-height: 1.55;
  color: rgba(26, 21, 18, 0.6);
}