/*
Theme Name: RingJing Local
Theme URI: https://ringjing.com/
Author: RingJing
Description: A refined local editorial theme for Howard County businesses, celebrations, family ideas, and community stories.
Version: 1.0.0
Requires at least: 6.6
Tested up to: 7.0
Requires PHP: 8.0
Text Domain: ringjing-local
*/

:root {
  --rj-ink: #172522;
  --rj-cream: #fbf8f0;
  --rj-paper: #ffffff;
  --rj-green: #1f5b4f;
  --rj-green-dark: #143f37;
  --rj-coral: #e46f51;
  --rj-gold: #e9b949;
  --rj-sage: #dce9df;
  --rj-line: rgba(23, 37, 34, 0.13);
  --rj-shadow: 0 18px 50px rgba(23, 37, 34, 0.10);
  --rj-radius: 22px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--rj-cream);
  color: var(--rj-ink);
  -webkit-font-smoothing: antialiased;
}

a {
  text-underline-offset: 0.18em;
  text-decoration-thickness: 1px;
}

::selection {
  background: var(--rj-gold);
  color: var(--rj-ink);
}

.rj-site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid var(--rj-line);
  background: rgba(251, 248, 240, 0.94);
  backdrop-filter: blur(14px);
}

.admin-bar .rj-site-header {
  top: 32px;
}

.rj-brand a {
  text-decoration: none;
}

.rj-brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  margin-right: 10px;
  border-radius: 50% 50% 50% 12%;
  background: var(--rj-coral);
  color: #fff;
  font: 800 20px/1 Arial, sans-serif;
  transform: rotate(-7deg);
}

.rj-nav .wp-block-navigation-item__content {
  position: relative;
  text-decoration: none;
}

.rj-nav .wp-block-navigation-item__content::after {
  position: absolute;
  right: 0;
  bottom: -6px;
  left: 0;
  height: 2px;
  background: var(--rj-coral);
  content: "";
  transform: scaleX(0);
  transition: transform 180ms ease;
}

.rj-nav .wp-block-navigation-item__content:hover::after {
  transform: scaleX(1);
}

.rj-hero {
  position: relative;
  overflow: hidden;
  border-radius: 0 0 42px 42px;
  background:
    radial-gradient(circle at 88% 14%, rgba(233, 185, 73, 0.52) 0 8%, transparent 8.2%),
    radial-gradient(circle at 92% 64%, rgba(228, 111, 81, 0.42) 0 15%, transparent 15.2%),
    linear-gradient(135deg, #143f37 0%, #1f5b4f 58%, #2f7565 100%);
  color: #fff;
}

.rj-hero::after {
  position: absolute;
  right: -55px;
  bottom: -110px;
  width: 310px;
  height: 310px;
  border: 2px solid rgba(255, 255, 255, 0.2);
  border-radius: 48% 52% 62% 38%;
  content: "";
  transform: rotate(18deg);
}

.rj-eyebrow {
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.rj-hero-title {
  max-width: 850px;
  text-wrap: balance;
}

.rj-hero-copy {
  max-width: 650px;
  color: rgba(255, 255, 255, 0.82);
}

.rj-button .wp-block-button__link,
.wp-element-button {
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.rj-button .wp-block-button__link:hover,
.wp-element-button:hover {
  box-shadow: 0 10px 28px rgba(23, 37, 34, 0.18);
  transform: translateY(-2px);
}

.rj-topic-card {
  height: 100%;
  border: 1px solid var(--rj-line);
  border-radius: var(--rj-radius);
  background: var(--rj-paper);
  box-shadow: 0 8px 28px rgba(23, 37, 34, 0.06);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.rj-topic-card:hover {
  box-shadow: var(--rj-shadow);
  transform: translateY(-5px);
}

.rj-topic-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 15px;
  background: var(--rj-sage);
  color: var(--rj-green);
  font: 800 18px/1 Arial, sans-serif;
}

.rj-topic-card:nth-child(2) .rj-topic-icon {
  background: #fde4dc;
  color: #a53f28;
}

.rj-topic-card:nth-child(3) .rj-topic-icon {
  background: #fff1c9;
  color: #815f08;
}

.rj-section-title {
  text-wrap: balance;
}

.rj-post-grid .wp-block-post {
  overflow: hidden;
  border: 1px solid var(--rj-line);
  border-radius: var(--rj-radius);
  background: var(--rj-paper);
  box-shadow: 0 8px 30px rgba(23, 37, 34, 0.06);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.rj-post-grid .wp-block-post:hover {
  box-shadow: var(--rj-shadow);
  transform: translateY(-5px);
}

.rj-post-grid .wp-block-post-featured-image {
  overflow: hidden;
  aspect-ratio: 16 / 10;
  margin: 0;
  background:
    linear-gradient(135deg, rgba(31, 91, 79, 0.86), rgba(228, 111, 81, 0.70)),
    var(--rj-green);
}

.rj-post-grid .wp-block-post-featured-image img {
  height: 100%;
  object-fit: cover;
  transition: transform 300ms ease;
}

.rj-post-grid .wp-block-post:hover .wp-block-post-featured-image img {
  transform: scale(1.035);
}

.rj-post-grid .wp-block-post-title,
.rj-post-grid .wp-block-post-excerpt,
.rj-post-grid .wp-block-post-date,
.rj-post-grid .wp-block-post-terms {
  margin-right: 24px;
  margin-left: 24px;
}

.rj-post-grid .wp-block-post-terms {
  margin-top: 22px;
}

.rj-post-grid .wp-block-post-excerpt {
  margin-bottom: 24px;
}

.rj-post-grid .wp-block-post-title a {
  text-decoration: none;
}

.rj-post-grid .wp-block-post-title a:hover {
  color: var(--rj-coral);
}

.rj-spotlight {
  overflow: hidden;
  border-radius: 32px;
  background: var(--rj-green);
  color: #fff;
  box-shadow: var(--rj-shadow);
}

.rj-spotlight-art {
  min-height: 390px;
  background:
    linear-gradient(25deg, rgba(20, 63, 55, 0.08), rgba(20, 63, 55, 0.72)),
    radial-gradient(circle at 30% 35%, #e9b949 0 8%, transparent 8.5%),
    radial-gradient(circle at 72% 62%, #e46f51 0 16%, transparent 16.5%),
    linear-gradient(135deg, #cfe3d4, #f6e6b8);
}

.rj-newsletter {
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  background: #f4d6cc;
}

.rj-newsletter::after {
  position: absolute;
  top: -58px;
  right: -28px;
  width: 190px;
  height: 190px;
  border-radius: 50%;
  background: rgba(233, 185, 73, 0.68);
  content: "";
}

.rj-footer {
  background: var(--rj-ink);
  color: rgba(255, 255, 255, 0.78);
}

.rj-footer a {
  color: #fff;
}

.rj-article-header {
  border-bottom: 1px solid var(--rj-line);
}

.rj-article-shell {
  background: var(--rj-paper);
}

.rj-article-shell .wp-block-post-content {
  font-size: clamp(1.05rem, 1.5vw, 1.18rem);
  line-height: 1.78;
}

.rj-article-shell .wp-block-post-content h2 {
  margin-top: 2.2em;
}

.rj-article-shell .wp-block-post-content blockquote {
  margin-right: 0;
  margin-left: 0;
  padding: 18px 28px;
  border-left: 4px solid var(--rj-coral);
  background: var(--rj-cream);
}

.rj-page-hero {
  border-radius: 0 0 34px 34px;
  background: var(--rj-sage);
}

.wp-block-query-pagination a {
  text-decoration: none;
}

@media (max-width: 781px) {
  .admin-bar .rj-site-header {
    top: 46px;
  }

  .rj-site-header {
    position: relative;
  }

  .rj-site-header .rj-header-cta {
    display: none !important;
  }

  .rj-hero {
    border-radius: 0 0 28px 28px;
  }

  .rj-hero .wp-block-spacer {
    height: 54px !important;
  }

  .rj-hero-title {
    font-size: clamp(2.5rem, 12vw, 4.1rem) !important;
  }

  .rj-topic-card {
    padding: 24px !important;
  }

  .rj-spotlight-art {
    min-height: 260px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    transition-duration: 0.01ms !important;
  }
}