/*
Theme Name: Yoland
Theme URI: https://example.com
Author: Yoland Moutama
Description: Editorial lifestyle-blog block theme. All serif, spaced capitals, hairline rules, full posts on the front page, light right sidebar.
Version: 3.6.1
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 8.1
License: GNU General Public License v2 or later
Text Domain: yoland
*/

/* Most visual settings live in theme.json. This file holds the layout bits
   theme.json can't express. */

:root {
  --yoland-transition: 150ms ease;
  --yoland-sidebar: 15rem;
}

html { scroll-behavior: smooth; }

a {
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
  transition: color var(--yoland-transition);
}

:focus-visible {
  outline: 2px solid var(--wp--preset--color--accent);
  outline-offset: 3px;
}

/* ---------- Header ---------- */
.yoland-header { text-align: center; }
.yoland-header .wp-block-site-logo img { max-height: 180px; width: auto; }
.yoland-logo img { width: 270px; max-width: 80vw; height: auto; }

/* Double hairline rule, Mimi style: a thin line above and below the menu */
.yoland-nav-bar {
  border-top: 1px solid var(--wp--preset--color--line);
  border-bottom: 1px solid var(--wp--preset--color--line);
  position: relative;
}
.yoland-nav-bar::before,
.yoland-nav-bar::after {
  content: "";
  position: absolute;
  left: 0; right: 0;
  height: 1px;
  background: var(--wp--preset--color--line);
}
.yoland-nav-bar::before { top: 3px; }
.yoland-nav-bar::after { bottom: 3px; }
.yoland-nav-bar .wp-block-navigation__container { gap: var(--wp--preset--spacing--50); }
.yoland-nav-bar .wp-block-navigation .current-menu-item > a { color: var(--wp--preset--color--accent); }

/* Painting banner as the header, name on top */
.yoland-banner { margin: 0; min-height: clamp(150px, 18vw, 230px) !important; }
.yoland-banner .wp-block-cover__image-background { object-fit: cover; }
.yoland-wordmark { margin: 0; }
.yoland-wordmark img { width: 260px; max-width: 70vw; height: auto; filter: drop-shadow(0 1px 8px rgba(0,0,0,0.35)); }
.yoland-nav-bar { border-top: 0; }
.yoland-nav-bar::before { display: none; }

/* Section label: small caps with a short rule under it */
.yoland-label {
  font-family: var(--wp--preset--font-family--typewriter);
  font-size: 0.78rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--wp--preset--color--muted);
}

/* ---------- Two-column layout: content + sidebar ---------- */
.yoland-layout {
  max-width: var(--wp--style--global--wide-size, 74rem);
  margin-inline: auto;
  box-sizing: border-box;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--wp--preset--spacing--70);
  align-items: start;
}
@media (min-width: 960px) {
  .yoland-layout { grid-template-columns: minmax(0, 1fr) var(--yoland-sidebar); }
  .yoland-sidebar { position: sticky; top: var(--wp--preset--spacing--50); }
}
.yoland-sidebar { font-size: var(--wp--preset--font-size--small); text-align: center; }
.yoland-sidebar > * + * { margin-top: var(--wp--preset--spacing--60); }
.yoland-sidebar h2,
.yoland-sidebar h3 {
  font-family: var(--wp--preset--font-family--typewriter);
  font-size: 0.78rem;
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--wp--preset--color--muted);
  margin-bottom: var(--wp--preset--spacing--30);
}
.yoland-sidebar h2::after {
  content: "";
  display: block;
  width: 2rem;
  height: 1px;
  background: var(--wp--preset--color--line);
  margin: 0.75rem auto 0;
}
.yoland-author-card img { width: 100%; height: auto; display: block; }
.yoland-author-card .yoland-name {
  font-family: var(--wp--preset--font-family--typewriter);
  font-size: 0.85rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin: var(--wp--preset--spacing--30) 0 var(--wp--preset--spacing--20);
}
.yoland-author-card .yoland-name::after { display: none; }
.yoland-author-card .yoland-bio { font-style: italic; color: var(--wp--preset--color--muted); }
.yoland-sidebar .wp-block-categories,
.yoland-sidebar .wp-block-archives { text-align: center; }
.yoland-sidebar .wp-block-social-links { justify-content: center; }

/* ---------- Post stream (front page / archives): full posts ---------- */
.yoland-stream .wp-block-post {
  padding-bottom: var(--wp--preset--spacing--70);
  margin-bottom: var(--wp--preset--spacing--70);
  border-bottom: 1px solid var(--wp--preset--color--line);
}
.yoland-stream .wp-block-post:last-child { border-bottom: 0; margin-bottom: 0; }
.yoland-post-head { text-align: center; }
.yoland-post-head .wp-block-post-terms { margin-bottom: var(--wp--preset--spacing--30); }
.yoland-post-head .wp-block-post-title { margin-bottom: var(--wp--preset--spacing--30); }
.yoland-post-head .wp-block-post-date { color: var(--wp--preset--color--muted); }
.wp-block-post-terms__separator { margin: 0 0.6em; }

/* Content images go edge to edge of the column */
.entry-content > .wp-block-image,
.wp-block-post-content > .wp-block-image,
.wp-block-post-featured-image { width: 100%; }
.entry-content img,
.wp-block-post-content img,
.wp-block-post-featured-image img { width: 100%; height: auto; }

/* The stream already has its own link; hide the default (more…) */
.yoland-stream .more-link { display: none; }

/* Read more */
.yoland-read-more { text-align: center; }
.yoland-read-more a {
  font-family: var(--wp--preset--font-family--typewriter);
  font-size: 0.78rem;
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 0.2em;
}

/* Comments */
.wp-block-comments { font-size: var(--wp--preset--font-size--small); }
.wp-block-post-comments-form input:not([type=submit]),
.wp-block-post-comments-form textarea {
  border: 1px solid var(--wp--preset--color--line);
  border-radius: 0;
  padding: 0.6em 0.75em;
  font: inherit;
}

/* Code blocks */
pre.wp-block-code {
  background: var(--wp--preset--color--surface);
  border: 1px solid var(--wp--preset--color--line);
  padding: 1rem 1.25rem;
  overflow-x: auto;
}
code { font-size: 0.9em; }

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