/* ============================================================
   Gonzalo Collarte — blog post brand styling  (v6 — final)
   Full pass against Visual Identity Guidelines v1.3
   Paste into: Appearance → Customize → Additional CSS
   Scope: SINGLE BLOG POSTS ONLY (.single-post body class).
   ============================================================

   FONTS — read once:
   Your WordPress font library now hosts Open Sans locally.
   The @import below is a safety net: it guarantees Open Sans
   loads even if the theme doesn't print the local font for
   CSS-only references. TEST: delete the @import line, hard-
   refresh a post. If body text still shows Open Sans, the
   local fonts are serving and you can leave the line out
   (slightly faster). If text reverts to the theme font,
   restore the line.

   Per the Visual Identity: Aller is wordmark-only and never
   appears in post content, so it is deliberately absent here.
   Oswald / Roboto / Museo Sans are not part of the identity
   and are not used.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;1,300&display=swap');

/* ---- Post title: Open Sans Bold, charcoal (alignment left to theme) ----
   (.entry-title is the usual theme class for the post H1;
   if your title doesn't change, the class differs — tell me.) */
.single-post .entry-title {
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  color: #404042;
  line-height: 1.25;
}

/* ---- Byline / post meta: Open Sans Regular, mid grey ----
   (.entry-meta is the usual class; may differ by theme.) */
.single-post .entry-meta,
.single-post .entry-meta a {
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #8A8A8C;
}

/* ---- Body copy: Open Sans Light, charcoal, generous leading ---- */
.single-post .entry-content p {
  font-family: 'Open Sans', sans-serif;
  font-weight: 300;
  font-size: 17px;
  line-height: 1.62;
  color: #404042;
}

/* ---- Subheadings: Open Sans Semibold, cyan, centred ----
   (Cyan is safe here: headings are large text, which passes
   accessibility — the reason cyan is banned for body copy.) */
.single-post .entry-content h2,
.single-post .entry-content h3,
.single-post .entry-content h4 {
  font-family: 'Open Sans', sans-serif;
  font-weight: 600;
  color: #049BD8;
  line-height: 1.3;
  margin-top: 2.2em;
  text-align: center !important;
}

/* ---- Numbered headings: charcoal number, cyan text ----
   Write the heading WITHOUT the number, then in the editor:
   Heading block → Advanced → Additional CSS class(es) → num  */
.single-post .entry-content { counter-reset: section; }
.single-post .entry-content h2.num::before {
  counter-increment: section;
  content: counter(section);
  color: #404042; /* inverted: charcoal number against cyan heading text */
  font-weight: 700;
  margin-right: 12px;
}

/* ---- Links: cyan, underlined ---- */
.single-post .entry-content a {
  color: #049BD8;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}
.single-post .entry-content a:hover {
  color: #0380B3; /* placeholder — swap for deep blue once contrast blues are locked */
}

/* ---- Bullets and list numbers in cyan; list text matches body ---- */
.single-post .entry-content ul li::marker,
.single-post .entry-content ol li::marker {
  color: #049BD8;
  font-weight: 600;
}
.single-post .entry-content li {
  font-family: 'Open Sans', sans-serif;
  font-weight: 300;
  font-size: 17px;
  line-height: 1.62;
  color: #404042;
}

/* ---- Bold: Semibold, charcoal ---- */
.single-post .entry-content strong {
  font-weight: 600;
  color: #404042;
}

/* ---- Pull quotes: Open Sans Light italic, charcoal, cyan left border ---- */
.single-post .entry-content blockquote {
  border-left: 3px solid #049BD8;
  padding: 6px 0 6px 22px;
  margin: 2.2em 0;
  font-family: 'Open Sans', sans-serif;
  font-style: italic;
  font-weight: 300;
  font-size: 19px;
  line-height: 1.55;
  color: #404042;
  background: none;
}
.single-post .entry-content blockquote p {
  font-size: 19px;
  font-style: italic;
}

/* ---- Image captions: Open Sans Regular (not Light — under 14px),
        mid grey, per identity rule for captions/metadata ---- */
.single-post .entry-content figcaption,
.single-post .entry-content .wp-caption-text {
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 1.5;
  color: #8A8A8C;
}

/* ---- Section dividers: light grey ---- */
.single-post .entry-content hr {
  border: none;
  border-top: 1px solid #EBEBEB;
  margin: 2.5em 0;
}

/* ---- Text selection in brand cyan ---- */
.single-post .entry-content ::selection {
  background: #049BD8;
  color: #FFFFFF;
}

/* ============================================================
   Brand palette reference (do not paste colours not listed here)
   Cyan      #049BD8  — links, subheadings, markers, accents
   Charcoal  #404042  — title, body, bold, quotes, heading numbers
   Mid grey  #8A8A8C  — byline, meta, captions
   Light grey #EBEBEB — dividers
   White     #FFFFFF  — background, selection text
   Optional accents (gold/magenta/violet/sage): never in posts.
   ============================================================ */