/*
Theme Name:   Astra · Planet Vibe Check
Theme URI:    https://planetvibecheck.com
Description:  Child theme for Astra implementing the Planet Vibe Check visual language.
Author:       Planet Vibe Check
Template:     astra
Version:      1.0.0
Text Domain:  astra-pvc
*/

/* ------- Planet Vibe Check — design tokens ------- */
:root {
  --pvc-forest: #2d5a3d;
  --pvc-forest-deep: #1f4129;
  --pvc-sage: #4a7c5e;
  --pvc-sage-soft: #e6efe7;
  --pvc-gold: #e8b04a;
  --pvc-gold-soft: #f7e9c4;
  --pvc-terracotta: #c97b5f;
  --pvc-terracotta-link: #a85636;
  --pvc-sky: #a4c5d8;
  --pvc-sky-soft: #e3edf3;
  --pvc-cream: #faf6ed;
  --pvc-ink: #1f2e26;
  --pvc-muted: #5a6b62;
  --pvc-hairline: rgba(31, 46, 38, .10);
  --pvc-radius: 10px;
  --pvc-radius-lg: 14px;
  --pvc-shadow-1: 0 1px 2px rgba(31, 46, 38, .04), 0 2px 8px rgba(31, 46, 38, .05);
  --pvc-shadow-2: 0 4px 14px rgba(31, 46, 38, .08), 0 12px 32px rgba(31, 46, 38, .06);
  --pvc-ease: cubic-bezier(.2, .7, .2, 1);
}

/* Anti-pure-black on body copy; Fraunces axes opened up */
body {
  color: var(--pvc-ink);
}

h1, h2, h3, h4, h5, h6,
.entry-title {
  font-variation-settings: "opsz" 36, "SOFT" 50;
  letter-spacing: -0.01em;
  text-wrap: balance;
}

h1, .entry-title {
  font-variation-settings: "opsz" 120, "SOFT" 100;
}

/* Links: gold underline on hover (Astra hover-color hits color only) */
.entry-content a {
  text-decoration-color: rgba(168, 86, 54, .35);
  text-underline-offset: 3px;
  transition: color .15s var(--pvc-ease), text-decoration-color .15s var(--pvc-ease);
}

.entry-content a:hover {
  text-decoration-color: var(--pvc-gold);
}

/* ------- Buttons (Astra .wp-block-button + .ast-button) ------- */
.wp-block-button__link,
.ast-button,
.ast-custom-button {
  font-weight: 600;
  border-radius: 999px;
  padding: 12px 22px;
  box-shadow: 0 1px 0 rgba(31, 46, 38, .04), 0 6px 18px rgba(232, 176, 74, .35);
  transition: box-shadow .2s var(--pvc-ease), transform .15s var(--pvc-ease);
}

.wp-block-button__link:hover {
  box-shadow: 0 1px 0 rgba(31, 46, 38, .04), 0 10px 24px rgba(232, 176, 74, .45);
}

.wp-block-button__link:active {
  transform: translateY(1px);
}

/* Secondary button — add .is-style-outline in editor, or class .pvc-btn-secondary */
.wp-block-button.is-style-outline .wp-block-button__link,
.pvc-btn-secondary {
  background: transparent;
  color: var(--pvc-forest-deep);
  border: 1px solid var(--pvc-forest);
  box-shadow: none;
}

/* ------- Comparison table ------- */
.entry-content table,
.wp-block-table table,
table.pvc-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  font-size: 14px;
  border-radius: var(--pvc-radius);
  overflow: hidden;
  box-shadow: var(--pvc-shadow-1);
}

.entry-content table thead th,
.wp-block-table thead th {
  background: var(--pvc-forest);
  color: var(--pvc-cream);
  font-family: "Fraunces", serif;
  font-weight: 600;
  text-align: left;
  padding: 14px 16px;
}

.entry-content table tbody td {
  padding: 14px 16px;
  border-bottom: 1px solid var(--pvc-hairline);
  vertical-align: top;
}

.entry-content table tbody tr:nth-child(even) td {
  background: var(--pvc-cream);
}

.entry-content table tbody td:first-child {
  font-family: "Fraunces", serif;
  font-weight: 600;
  color: var(--pvc-forest-deep);
}

/* Mono everywhere a number appears */
.entry-content table tbody td.num,
.entry-content table tbody td .num,
.entry-content table tbody td.spec {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-feature-settings: "tnum" 1;
}

/* Mobile: horizontal scroll wrapper added automatically by Gutenberg .wp-block-table */
@media (max-width: 600px) {
  .wp-block-table {
    overflow-x: auto;
  }
}

/* ------- TL;DR / verdict box ------- */
.pvc-verdict {
  background: var(--pvc-gold-soft);
  border-left: 4px solid var(--pvc-gold);
  border-radius: var(--pvc-radius);
  padding: 22px 26px;
  margin: 2em 0;
}

.pvc-verdict.is-sage {
  background: var(--pvc-sage-soft);
  border-left-color: var(--pvc-sage);
}

.pvc-verdict .pvc-stamp {
  font-family: "IBM Plex Mono", monospace;
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--pvc-forest-deep);
  margin-bottom: 8px;
}

.pvc-verdict h2,
.pvc-verdict h3,
.pvc-verdict h4 {
  margin-top: 0;
}

/* ------- FAQ (built on <details>, no JS) ------- */
.pvc-faq details {
  border-bottom: 1px solid var(--pvc-hairline);
  padding: 18px 0;
}

.pvc-faq details:first-child {
  border-top: 1px solid var(--pvc-hairline);
}

.pvc-faq summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  font-family: "Fraunces", serif;
  font-weight: 600;
  font-size: 19px;
  color: var(--pvc-forest-deep);
}

.pvc-faq summary::-webkit-details-marker {
  display: none;
}

.pvc-faq summary::after {
  content: "+";
  font-family: "IBM Plex Mono", monospace;
  color: var(--pvc-terracotta);
  transition: transform .2s var(--pvc-ease);
}

.pvc-faq details[open] summary::after {
  transform: rotate(45deg);
}

/* ------- Tags & categories ------- */
.pvc-tag,
.tagcloud a,
.cat-links a {
  display: inline-flex;
  align-items: center;
  font-size: 12px !important;
  font-weight: 500;
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(201, 123, 95, .12);
  color: var(--pvc-terracotta-link);
  border: 1px solid rgba(201, 123, 95, .25);
  text-decoration: none;
}

.pvc-tag.is-sage {
  background: rgba(74, 124, 94, .10);
  color: var(--pvc-forest);
  border-color: rgba(74, 124, 94, .28);
}

.pvc-tag.is-sky {
  background: rgba(164, 197, 216, .22);
  color: #3a6a83;
  border-color: rgba(164, 197, 216, .6);
}

.pvc-tag.is-gold {
  background: rgba(232, 176, 74, .18);
  color: #7a5413;
  border-color: rgba(232, 176, 74, .5);
}

/* ------- Article cards (Astra archive grid) ------- */
.ast-article-post,
.ast-grid-common-col .ast-article-post {
  background: #fff;
  border-radius: var(--pvc-radius-lg);
  border: 1px solid var(--pvc-hairline);
  border-top: 3px solid var(--pvc-sage);
  overflow: hidden;
  box-shadow: var(--pvc-shadow-1);
  transition: transform .25s var(--pvc-ease), box-shadow .25s var(--pvc-ease);
}

.ast-article-post:hover {
  transform: translateY(-3px);
  box-shadow: var(--pvc-shadow-2);
}

/* Category color tag — added via body_class filter in functions.php */
.category-energy-storage .ast-article-post {
  border-top-color: var(--pvc-terracotta);
}

.category-grid-policy .ast-article-post {
  border-top-color: var(--pvc-sky);
}

.category-solarpunk .ast-article-post {
  border-top-color: var(--pvc-gold);
}

.ast-article-post .post-thumb-img-content,
.ast-article-post .ast-blog-featured-section img {
  border-radius: 0;
}

/* ------- Blockquote & pull quote ------- */
.entry-content blockquote,
blockquote.wp-block-quote {
  border-left: 3px solid var(--pvc-sage);
  padding: 4px 0 4px 24px;
  margin: 1.5em 0;
  font-family: "Fraunces", serif;
  font-style: italic;
  font-size: 19px;
  color: var(--pvc-ink);
}

.entry-content blockquote cite {
  display: block;
  margin-top: 10px;
  font-family: "IBM Plex Mono", monospace;
  font-style: normal;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--pvc-muted);
}

.wp-block-pullquote {
  border: none;
  padding: 1em 0;
}

.wp-block-pullquote p {
  font-family: "Fraunces", serif;
  font-size: clamp(28px, 3.4vw, 40px);
  line-height: 1.18;
  font-weight: 500;
  color: var(--pvc-forest-deep);
  font-variation-settings: "opsz" 60, "SOFT" 100;
}

/* ------- Inline citations & source callout ------- */
.pvc-cite {
  font-size: .78em;
  color: var(--pvc-terracotta-link);
  text-decoration: none;
  border-bottom: 1px dotted var(--pvc-terracotta-link);
  vertical-align: .15em;
}

.pvc-cite::before {
  content: "[";
  opacity: .7;
}

.pvc-cite::after {
  content: "]";
  opacity: .7;
}

.pvc-source {
  background: var(--pvc-sky-soft);
  border-left: 4px solid var(--pvc-sky);
  padding: 16px 20px;
  border-radius: var(--pvc-radius);
  font-size: 14px;
  margin: 1.5em 0;
}

.pvc-source .pvc-src-label {
  font-family: "IBM Plex Mono", monospace;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #3a6a83;
}

/* ------- Generous reading measure on single posts ------- */
.single-post .entry-content > p,
.single-post .entry-content > h2,
.single-post .entry-content > h3,
.single-post .entry-content > ul,
.single-post .entry-content > ol {
  max-width: 68ch;
}

.single-post .entry-content > .wp-block-table,
.single-post .entry-content > .pvc-verdict,
.single-post .entry-content > figure,
.single-post .entry-content > .pvc-source {
  max-width: none; /* full content-width for tables & callouts */
}

/* ------- Motion: gentle & respectful ------- */
html {
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  * {
    transition: none !important;
    animation: none !important;
  }
}