/*
Theme Name: Gailitis Journal
Description: Research Journal child theme of Twenty Twenty-Five for gailitis.ceo - an evidence-based data center and cloud publication. Paper background, Newsreader serif display, terracotta accent.
Author: Andris Gailitis
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Requires PHP: 7.4
Text Domain: gailitis-journal
*/

/* ---------- Fonts ---------- */
@font-face {
  font-family: 'Newsreader';
  src: url('assets/fonts/newsreader.woff2') format('woff2');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Newsreader';
  src: url('assets/fonts/newsreader-italic.woff2') format('woff2');
  font-weight: 400 700;
  font-style: italic;
  font-display: swap;
}

/* ---------- Tokens ---------- */
:root {
  --gj-paper: #faf8f4;
  --gj-ink: #211d18;
  --gj-body: #37322a;
  --gj-soft: #4a443b;
  --gj-muted: #8a8071;
  --gj-line: #e2dcd2;
  --gj-cream: #f3efe7;
  --gj-accent: #9a3412;
  --gj-accent-dark: #7c2d12;
  --gj-serif: 'Newsreader', Georgia, 'Times New Roman', serif;
  --gj-text: Georgia, 'Times New Roman', serif;
  --gj-sans: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --gj-pad: clamp(20px, 4vw, 48px);
}

/* ---------- Base ---------- */
body {
  background: var(--gj-paper);
  color: var(--gj-body);
  font-family: var(--gj-text);
  font-size: 17px;
  line-height: 1.7;
}
a { color: var(--gj-accent); text-decoration: none; }
a:hover { color: var(--gj-accent-dark); text-decoration: underline; text-underline-offset: 3px; }
h1, h2, h3, h4, h5, h6 {
  font-family: var(--gj-serif);
  font-weight: 600;
  color: var(--gj-ink);
  letter-spacing: -0.015em;
  line-height: 1.18;
  text-wrap: balance;
}
img { max-width: 100%; height: auto; }

.gj-label {
  font-family: var(--gj-sans);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gj-accent);
  line-height: 1.4;
}
.gj-label a { color: var(--gj-accent); }
.gj-label-muted, .gj-label-muted a { color: var(--gj-muted); }

.gj-btn a, a.gj-btn, .gj-btn {
  display: inline-block;
  background: var(--gj-ink);
  color: var(--gj-paper) !important;
  padding: 13px 22px;
  font-family: var(--gj-sans);
  font-size: 13px;
  letter-spacing: 0.04em;
  text-decoration: none !important;
}
.gj-btn a:hover, a.gj-btn:hover { background: var(--gj-accent-dark); color: var(--gj-paper); }

/* ---------- Header ---------- */
.gj-header {
  border-bottom: 1px solid var(--gj-line);
  padding: 26px var(--gj-pad) 22px var(--gj-pad);
}
.gj-header-inner {
  max-width: 1180px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 24px;
  flex-wrap: wrap;
}
.gj-brand-name { margin: 0; font-family: var(--gj-serif); font-size: 25px; font-weight: 600; letter-spacing: -0.01em; }
.gj-brand-name a { color: var(--gj-ink); text-decoration: none; }
.gj-brand-name a:hover { color: var(--gj-accent); text-decoration: none; }
.gj-brand-tag { margin: 3px 0 0 0; font-family: var(--gj-sans); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gj-muted); }
.gj-nav-links { margin: 0; display: flex; gap: 30px; flex-wrap: wrap; font-family: var(--gj-sans); font-size: 13px; letter-spacing: 0.04em; }
.gj-nav-links a { color: var(--gj-soft); text-decoration: none; }
.gj-nav-links a:hover { color: var(--gj-accent); }

/* ---------- Sections ---------- */
.gj-section { max-width: 1180px; margin: 0 auto; padding: 0 var(--gj-pad); }
.gj-section-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  border-top: 1px solid var(--gj-line);
  padding-top: 26px;
  margin-bottom: 28px;
}
.gj-section-head .gj-label { color: var(--gj-muted); }

/* ---------- Hero (latest post) ---------- */
.gj-hero-query { max-width: 1180px; margin: 0 auto; padding: 0 var(--gj-pad); }
.gj-hero-query ul.wp-block-post-template { list-style: none; margin: 0; padding: 0; }
.gj-hero-query li { margin: 0; }
.gj-hero-grid {
  display: grid;
  grid-template-columns: 7fr 5fr;
  gap: clamp(28px, 4vw, 56px);
  align-items: center;
  padding: clamp(36px, 5vw, 60px) 0;
}
.gj-hero-left { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
.gj-hero-meta { display: flex; align-items: baseline; gap: 10px; }
.gj-hero-meta time { font-family: var(--gj-sans); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gj-muted); }
h1.gj-hero-title { margin: 0; font-size: clamp(30px, 3.6vw, 46px); }
h1.gj-hero-title a { color: var(--gj-ink); text-decoration: none; }
h1.gj-hero-title a:hover { color: var(--gj-accent); }
.gj-hero-dek, .gj-hero-dek p { margin: 0; font-size: 18px; line-height: 1.55; color: var(--gj-soft); }
.gj-hero-dek .wp-block-post-excerpt__more-text { display: none; }
.gj-hero-img img { border: 1px solid var(--gj-line); display: block; }

/* ---------- Library grid ---------- */
.gj-grid-query ul.wp-block-post-template {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 40px;
}
.gj-grid-query li.wp-block-post { display: flex; flex-direction: column; gap: 13px; margin: 0; }
.gj-grid-query .wp-block-post-featured-image img { border: 1px solid var(--gj-line); display: block; }
.gj-grid-query .wp-block-post-terms { font-family: var(--gj-sans); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; }
.gj-grid-query .wp-block-post-terms a { color: var(--gj-accent); text-decoration: none; }
.gj-card-title { margin: 0; font-size: 21px; line-height: 1.28; }
.gj-card-title a { color: var(--gj-ink); text-decoration: none; }
.gj-card-title a:hover { color: var(--gj-accent); }
.gj-grid-query .wp-block-post-excerpt p { margin: 0; font-size: 14.5px; line-height: 1.55; color: var(--gj-soft); }
.gj-grid-query .wp-block-post-excerpt__more-text { display: none; }
.gj-grid-query .wp-block-post-date { font-family: var(--gj-sans); font-size: 11.5px; color: var(--gj-muted); }
.gj-grid-query .wp-block-post-date a { color: var(--gj-muted); }

/* Pagination */
.gj-grid-query .wp-block-query-pagination {
  margin-top: 40px;
  font-family: var(--gj-sans);
  font-size: 13px;
}
.gj-grid-query .wp-block-query-pagination a { color: var(--gj-accent); }
.gj-grid-query .wp-block-query-pagination-numbers .current { color: var(--gj-ink); font-weight: 700; }

/* ---------- Reference guides ---------- */
.gj-pillars { max-width: 1180px; margin: 0 auto; padding: 0 var(--gj-pad) 48px var(--gj-pad); }
.gj-pillars-head { border-top: 1px solid var(--gj-line); padding-top: 26px; margin-bottom: 22px; }
.gj-pillars-head .gj-label { color: var(--gj-muted); }
.gj-pillars-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; }
.gj-pillar { border-left: 2px solid var(--gj-accent); padding-left: 20px; }
.gj-pillar h3 { margin: 0 0 8px 0; font-size: 20px; }
.gj-pillar h3 a { color: var(--gj-ink); text-decoration: none; }
.gj-pillar h3 a:hover { color: var(--gj-accent); }
.gj-pillar p { margin: 0; font-size: 14px; color: var(--gj-soft); }

/* ---------- Footer ---------- */
.gj-footer { border-top: 1px solid var(--gj-line); margin-top: 24px; padding: 24px var(--gj-pad); }
.gj-footer-inner {
  max-width: 1180px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  font-family: var(--gj-sans);
  font-size: 12px;
  color: var(--gj-muted);
}
.gj-footer-inner p { margin: 0; }
.gj-footer-inner a { color: var(--gj-muted); }
.gj-footer-inner a:hover { color: var(--gj-accent); }

/* ---------- Article (single) ---------- */
.gj-article { max-width: 760px; margin: 0 auto; padding: clamp(36px, 5vw, 56px) var(--gj-pad) 24px var(--gj-pad); display: flex; flex-direction: column; gap: 20px; }
.gj-article .wp-block-post-terms { font-family: var(--gj-sans); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; }
h1.gj-article-title { margin: 0; font-size: clamp(30px, 4vw, 42px); }
.gj-article-meta { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; font-family: var(--gj-sans); font-size: 13px; color: var(--gj-muted); }
.gj-article-meta a { color: var(--gj-muted); }

.gj-article-content { max-width: 760px; margin: 0 auto; padding: 0 var(--gj-pad) 40px var(--gj-pad); }
.gj-article-content p { font-size: 17.5px; line-height: 1.7; }
.gj-article-content h2 { font-size: 28px; margin-top: 1.6em; }
.gj-article-content h3 { font-size: 22px; margin-top: 1.4em; }
.gj-article-content ul, .gj-article-content ol { font-size: 17px; line-height: 1.7; }
.gj-article-content figcaption { font-family: var(--gj-sans); font-size: 12px; color: var(--gj-muted); }
.gj-article-content .wp-block-image.alignright { margin: 6px 0 12px 24px; }
.gj-article-content blockquote {
  border-left: 2px solid var(--gj-accent);
  margin-left: 0;
  padding: 4px 0 4px 20px;
  color: var(--gj-soft);
  font-style: italic;
}

/* Tables (mockup style) */
.gj-article-content table { border-collapse: collapse; width: 100%; font-size: 15px; border: 1px solid var(--gj-line); }
.gj-article-content table thead th, .gj-article-content table tr:first-child th {
  background: var(--gj-ink);
  color: var(--gj-paper);
  font-family: var(--gj-sans);
  font-size: 12px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-weight: 500;
  text-align: left;
}
.gj-article-content table th, .gj-article-content table td { padding: 11px 16px; border: none; border-bottom: 1px solid var(--gj-cream); }
.gj-article-content figure.wp-block-table { overflow-x: auto; }

/* Separators */
.gj-article-content hr, hr.wp-block-separator { border: none; border-top: 1px solid var(--gj-line); }

/* ---------- Archive title ---------- */
.gj-archive-head { max-width: 1180px; margin: 0 auto; padding: 40px var(--gj-pad) 4px var(--gj-pad); }
.gj-archive-head h1 { font-size: 32px; margin: 0; }
.gj-archive-head h1 span { color: var(--gj-accent); }

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .gj-hero-grid { grid-template-columns: 1fr; }
  .gj-grid-query ul.wp-block-post-template { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
  .gj-pillars-grid { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 600px) {
  .gj-grid-query ul.wp-block-post-template { grid-template-columns: 1fr; }
  .gj-header-inner { flex-direction: column; gap: 12px; }
}