/* ─────────────────────────────────────────────────────────────
   HEADINGS
───────────────────────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6,
.entry-title {
  font-family: var(--f-heading);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: 0.01em;
  margin-top: var(--s7);
  margin-bottom: var(--s5);
}

/* H1 — Soft cyan, subtle glow */
h1, .entry-title {
  font-size: clamp(1.6rem, 5vw, 2.8rem);
  font-weight: 800;
  color: rgba(1, 191, 255, 0.85);
  text-shadow: var(--glow-cyan);
  border-bottom: 1px solid var(--border-soft);
  padding-bottom: var(--s4);
  margin-bottom: var(--s6);
  margin-top: 0;
}

/* H2 — Left accent bar */
h2 {
  font-size: clamp(1.25rem, 3.5vw, 2rem);
  font-weight: 600;
  color: var(--text-hi);
  position: relative;
  padding-left: var(--s5);
}

h2::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.1em;
  bottom: 0.1em;
  width: 2px;
  border-radius: 2px;
  background: rgba(1, 191, 255, 0.6);
}

h3 {
  font-size: clamp(1rem, 2.8vw, 1.5rem);
  font-weight: 600;
  color: var(--text-hi);
}

h4 { font-size: clamp(0.9rem, 2.2vw, 1.2rem); font-weight: 500; color: var(--text-hi); }
h5 { font-size: clamp(0.85rem, 1.8vw, 1rem);  font-weight: 500; color: var(--text-mid); }
h6 {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--text-lo);
  letter-spacing: 0.14em;
}

/* First element in content needs no top margin */
.entry-content > *:first-child { margin-top: 0; }

/* ─────────────────────────────────────────────────────────────
   PARAGRAPHS & BODY TEXT
───────────────────────────────────────────────────────────── */
p {
  font-size: 1.0625rem;
  line-height: 1.75;
  color: var(--text-hi);
  margin-bottom: var(--s5);
}

.entry-content p { max-width: 70ch; }

/* Lead — first paragraph of post */
.entry-content > p:first-of-type {
  font-size: 1.2rem;
  font-weight: 300;
  color: var(--text-hi);
  line-height: 1.82;
}

/* Drop cap */
.has-drop-cap:not(:focus)::first-letter {
  font-family: var(--f-body);
  font-size: 4.5em;
  font-weight: 400;
  color: rgba(1, 191, 255, 0.80);
  text-shadow: var(--glow-cyan);
  float: left;
  line-height: 0.82;
  margin-right: 0.08em;
  margin-top: 0.08em;
}

strong, b { font-weight: 600; color: var(--text-hi); }
em, i     { font-style: italic; color: inherit; }
small     { font-size: 0.78rem; color: var(--text-lo); }

mark {
  background: rgba(0, 220, 255, 0.18);
  color: var(--cyan);
  padding: 0 0.25em;
  border-radius: 2px;
}

/* ─────────────────────────────────────────────────────────────
   LINKS
───────────────────────────────────────────────────────────── */
a {
  color: var(--cyan);
  text-decoration: none;
  transition: color var(--ease-fast), text-shadow var(--ease-fast);
}

a:hover {
  color: var(--cyan);
  text-shadow: var(--glow-cyan);
}

.entry-content a {
  color: var(--cyan);
  text-decoration: underline;
  text-decoration-color: rgba(1, 191, 255, 0.35);
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  border-bottom: none;
  padding-bottom: 0;
  transition: text-decoration-color var(--ease-fast), text-shadow var(--ease-fast);
}

.entry-content a:hover {
  color: var(--cyan);
  text-decoration-color: var(--cyan);
  text-shadow: var(--glow-cyan);
}

/* ─────────────────────────────────────────────────────────────
   IMAGES — no crop, fully responsive
───────────────────────────────────────────────────────────── */
img {
  display: block;
  max-width: 100%;
  height: auto;
  width: auto;
}

.entry-content img,
.post-thumbnail img,
.wp-post-image,
figure img {
  max-width: 100%;
  height: auto;
  width: auto;
  display: block;
  border-radius: var(--r-md);
  border: 1px solid var(--border-dim);
  margin: var(--s6) auto;
  box-shadow:
    0 4px 24px rgba(0, 0, 0, 0.6),
    0 0  60px rgba(0, 0, 0, 0.4);
  transition: box-shadow var(--ease-slow), border-color var(--ease-slow);
}

.entry-content img:hover {
  border-color: var(--border-bright);
  box-shadow:
    0 8px 40px rgba(0, 0, 0, 0.7),
    var(--glow-cyan);
}

/* WordPress alignment utilities */
.alignleft  { float: left;  margin: 0 var(--s6) var(--s4) 0; }
.alignright { float: right; margin: 0 0 var(--s4) var(--s6); }
.aligncenter { display: block; margin: var(--s6) auto; }
.alignnone  { max-width: 100%; height: auto; }

/* Captions */
figcaption,
.wp-caption-text,
.blocks-gallery-item figcaption {
  font-size: 0.78rem;
  color: var(--text-lo);
  text-align: center;
  font-style: italic;
  margin-top: var(--s2);
  letter-spacing: 0.06em;
}

/* Gallery grid */
.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--s3);
  margin: var(--s6) 0;
}

.gallery img {
  width: 100%;
  height: auto;
  object-fit: contain;
  margin: 0;
}

/* ─────────────────────────────────────────────────────────────
   BLOCKQUOTES
───────────────────────────────────────────────────────────── */
blockquote,
.wp-block-quote {
  margin: var(--s7) 0;
  padding: var(--s5) var(--s7);
  border-left: 3px solid var(--cyan);
  background: var(--bg-2);
  border-radius: 0 var(--r-md) var(--r-md) 0;
  position: relative;
  overflow: hidden;
}

blockquote::before {
  content: '\201C';
  position: absolute;
  top: -0.6rem;
  left: var(--s4);
  font-family: var(--f-display);
  font-size: 7rem;
  color: rgba(0, 220, 255, 0.06);
  line-height: 1;
  pointer-events: none;
  user-select: none;
}

blockquote p {
  font-family: var(--f-body);
  font-size: 1.08rem;
  font-style: italic;
  color: var(--text-hi);
  line-height: 1.78;
  max-width: none;
}

blockquote cite,
.wp-block-quote__citation {
  display: block;
  margin-top: var(--s4);
  font-size: 0.75rem;
  color: var(--text-lo);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-style: normal;
  font-family: var(--f-display);
}

blockquote cite::before { content: '— '; }

/* Pull quote */
.wp-block-pullquote {
  border: none;
  padding: var(--s7) var(--s6);
  text-align: center;
  background: var(--bg-2);
  border-top: 1px solid var(--border-soft);
  border-bottom: 1px solid var(--border-soft);
  margin: var(--s8) 0;
  border-radius: var(--r-md);
}

.wp-block-pullquote blockquote {
  border: none;
  background: transparent;
  padding: 0;
}

.wp-block-pullquote blockquote::before { display: none; }

.wp-block-pullquote p {
  font-family: var(--f-body);
  font-size: clamp(1.1rem, 3vw, 1.8rem);
  font-style: italic;
  letter-spacing: 0.01em;
  color: var(--cyan);
  text-shadow: var(--glow-cyan);
  max-width: none;
}

/* ─────────────────────────────────────────────────────────────
   TABLES
───────────────────────────────────────────────────────────── */
.wp-block-table,
.entry-content table {
  width: 100%;
  overflow-x: auto;
  display: block;
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}

thead { background: var(--bg-2); }

th {
  font-family: var(--f-display);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  color: var(--cyan);
  padding: var(--s3) var(--s5);
  border-bottom: 1px solid var(--border-soft);
  text-align: left;
  white-space: nowrap;
}

td {
  padding: var(--s3) var(--s5);
  border-bottom: 1px solid var(--border-dim);
  color: var(--text-hi);
  vertical-align: top;
}

tr:hover td { background: rgba(0, 220, 255, 0.025); }

/* ─────────────────────────────────────────────────────────────
   LISTS
───────────────────────────────────────────────────────────── */
ul, ol {
  margin-bottom: var(--s5);
  padding-left: var(--s6);
}

li {
  margin-bottom: var(--s2);
  color: var(--text-hi);
  line-height: 1.75;
}

/* Custom bullets in entry content */
.entry-content ul {
  list-style: none;
  padding-left: var(--s5);
}

.entry-content ul li {
  position: relative;
  padding-left: var(--s5);
}

.entry-content ul li::before {
  content: '▸';
  position: absolute;
  left: 0;
  top: 0.08em;
  color: var(--cyan);
  font-size: 0.78em;
}

.entry-content ol { padding-left: var(--s6); }

ol li::marker {
  color: var(--cyan);
  font-family: var(--f-display);
  font-size: 0.82em;
  font-weight: 700;
}

/* Nested lists */
.entry-content ul ul li::before { color: var(--blue); }
.entry-content ul ul ul li::before { color: var(--purple); }

/* ─────────────────────────────────────────────────────────────
   HORIZONTAL RULE
───────────────────────────────────────────────────────────── */
hr,
.wp-block-separator {
  border: none;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--cyan) 30%, var(--blue) 70%, transparent);
  margin: var(--s7) 0;
  opacity: 0.35;
}
