/*
Theme Name: CLTV
Theme URI: https://cltv.film/
Description: Child theme of Twenty Twenty-Five that matches the cltv.film design.
Author: Collective Films
Template: twentytwentyfive
Version: 1.5
Text Domain: cltv
*/

/* The main site stylesheet is enqueued from functions.php — it carries the
   fonts, the header and the footer. This file only does two jobs:
   1. restore the page shell the static pages get from .main
   2. undo the bits of the site CSS that were written for hand-built pages
      and fight WordPress post content. */

/* ---- page shell -------------------------------------------------------
   The site CSS paints body dark and relies on .main for the light content
   area. WordPress has no .main, so without this the whole page renders
   near-black with near-black text. Values copied from .main in the site CSS. */
body {
  background: rgb(235, 235, 235);
  color: rgb(20, 20, 20);
}

.wp-site-blocks {
  position: relative;
  background: rgb(235, 235, 235);
  min-height: 100vh;
  padding: 7vw 3.5vw 100px;
}

/* .header is position:absolute with no left/right, so it lands at its static
   position — inside the padding above — and then width:100% adds the full
   viewport on top, overflowing the page by 2x the padding. The static site
   never hits this because its header sits outside the padded .main wrapper.
   Pin it to the edges instead. */
.wp-site-blocks .header {
  left: 0;
  right: 0;
  width: auto;
}

/* ---- typography -------------------------------------------------------
   Mabry everywhere, as on the main site. Schnyder is reserved for the home
   page intro block there, so it is available as a preset but not applied. */
.header h1, .header h2,
.footer h2, .footer-cols h2 {
  font-family: Mabry, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* ---- post content -----------------------------------------------------
   The site gives every h1 a centred decorative rule and 4rem of padding.
   Fine on a landing page, wrong above a blog post. */
.wp-block-post-title:after,
.wp-block-post-content h1:after,
.wp-block-post-content h2:after {
  content: none;
}

.wp-block-post-title,
.wp-block-post-content h1,
.wp-block-post-content h2,
.wp-block-post-content h3 {
  padding-bottom: 0;
  text-align: left;
}

/* Site CSS zeroes margins on every text element via a global reset.
   Blog prose needs them back. */
.wp-block-post-content p,
.wp-block-post-content ul,
.wp-block-post-content ol,
.wp-block-post-content blockquote {
  margin: 0 0 1.2em;
}

.wp-block-post-content ul,
.wp-block-post-content ol {
  padding-left: 1.5em;
  list-style: revert;
}

.wp-block-post-content li {
  display: list-item;
  margin-bottom: 0.4em;
}

.wp-block-post-content a {
  text-decoration: underline;
}

.wp-block-post-content img {
  max-width: 100%;
  height: auto;
}

/* ---- header -----------------------------------------------------------
   The site hides these links on the home page and reveals them via the JS
   router, which the blog does not load. */
.header .left,
.header .right {
  display: block;
}

/* WordPress also puts `home` on the blog index, which collides with the main
   site's `.home .header{mix-blend-mode:normal}` rule — that exists there to
   keep the white logo visible over the homepage video tiles. On this light
   page it leaves #ebebeb links on an #ebebeb background, i.e. invisible.
   Restore the site's default inverting header. Both selectors are needed:
   `.home .header` is (0,2,0), so a bare `.header` loses to it. */
.wp-site-blocks .header,
body.home .header {
  mix-blend-mode: difference;
}
