/* editorial.css — supplements theme.json for the bits the editor can't express.
   Enqueue from functions.php:  wp_enqueue_style('ss-editorial', get_stylesheet_directory_uri().'/assets/editorial.css', [], '1.0'); */

:root {
  --accent-2: color-mix(in oklab, var(--wp--preset--color--accent) 80%, black);
}

/* Sticky, translucent header */
.site-head {
  position: sticky; top: 0; z-index: 50;
  background: color-mix(in oklab, var(--wp--preset--color--paper) 86%, transparent);
  backdrop-filter: saturate(1.1) blur(8px);
}

/* Display headline italic accent (type "Apple platforms" inside <em>) */
.hero h1 em, .wp-block-post-title em { font-style: italic; color: var(--wp--preset--color--accent); }

/* Links: quiet by default, accent on hover */
a { transition: color .18s ease; }
.site-head a:hover, .site-foot a:hover,
.apps a:hover, .posts a:hover, .article-nav a:hover { color: var(--wp--preset--color--accent); }
.wp-block-navigation .current-menu-item a { color: var(--wp--preset--color--ink); }

/* App rows — icon sizing + hover lift on the arrow */
.apps .wp-block-image img { box-shadow: 0 1px 0 rgba(0,0,0,.04); }
.apps .wp-block-group:first-child { border-top: none !important; }

/* App "↗" rendered as a text glyph (mono), never an emoji */
.app-arrow {
  font-family: var(--wp--preset--font-family--mono);
  font-size: .82em;
  color: var(--wp--preset--color--faint);
  font-variant-emoji: text;   /* force text presentation where supported */
  display: inline-block;
  transition: transform .2s ease, color .2s ease;
}
.apps a:hover .app-arrow { color: var(--wp--preset--color--accent); transform: translate(2px, -2px); }

/* Writing rows — date column on wide screens */
@media (min-width: 600px) {
  .posts .post { display: grid; grid-template-columns: 8.5rem 1fr; column-gap: 1.6rem; align-items: baseline; }
  .posts .post .wp-block-post-date { grid-row: 1 / span 3; padding-top: .35rem; }
}
.posts .post:first-child { border-top: none !important; }
.posts .wp-block-post-title { letter-spacing: -.012em; line-height: 1.3; }
.posts .wp-block-post-excerpt { max-width: 52ch; margin-top: .25rem; }

/* Prose / single article */
.prose { max-width: 38rem; }
.prose > * + * { margin-top: 1.5rem; }
.prose h2 { font-size: 1.55rem; font-weight: 600; margin-top: 2.6rem; }
.prose h3 { font-size: 1.25rem; font-weight: 600; margin-top: 2rem; }
.prose a { color: var(--wp--preset--color--accent); text-decoration: underline;
  text-decoration-color: color-mix(in oklab, var(--wp--preset--color--accent) 40%, transparent);
  text-underline-offset: 3px; }
.prose a:hover { text-decoration-color: var(--wp--preset--color--accent); }
.prose blockquote {
  border-left: 2px solid var(--wp--preset--color--accent);
  padding-left: 1.3rem; margin-left: 0;
  color: var(--wp--preset--color--ink-soft); font-style: italic;
}
.prose :where(pre, code) { font-family: var(--wp--preset--font-family--mono); }
.prose code { font-size: .86em; background: var(--wp--preset--color--paper-2);
  border: 1px solid var(--wp--preset--color--rule); border-radius: .3rem; padding: .1em .4em; }
.prose pre { font-size: .82rem; line-height: 1.7; background: var(--wp--preset--color--paper-2);
  border: 1px solid var(--wp--preset--color--rule); border-radius: .6rem; padding: 1.15rem 1.3rem; overflow-x: auto; }
.prose pre code { background: none; border: none; padding: 0; }
.prose hr { border: none; border-top: 1px solid var(--wp--preset--color--rule); margin-block: 2.5rem; }

::selection { background: color-mix(in oklab, var(--wp--preset--color--accent) 18%, transparent); }

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