/* moss style overrides
   Uncomment any variable to override the default.
   Changes apply site-wide. */

:root {
  /* Typography */
  --moss-reading-size-base: 1rem;
  /* --moss-font-body: system-ui, sans-serif; */
  /* --moss-font-heading: var(--moss-font-body);  */
  /* --moss-font-mono: ui-monospace, monospace;   */
  /* --moss-reading-size: 1.125rem;                  */
  /* --moss-font-weight: 320;                     */

  /* Layout */
  /* --moss-content-width: 80ch;         */
  /* --moss-content-width-sidebar: 65ch;    */
  /* --moss-sidebar-width: 280px;           */

  /* Color */
  /* --moss-color-accent:   #2d5a2d; */
  /* --moss-color-bg:       #faf8f5; */
  /* --moss-color-text:     #2c2825; */
  /* --moss-color-muted:    #8a8580; */
  /* --moss-color-surface:  #f4f1ec; */
}

/* Cap the hero on wide screens. Moss's default is width:100%; height:auto,
   so a 2.44:1 banner grows toward full-screen on large monitors. Limit the
   height and let object-fit:cover fill the box (anchored top) instead. */
.moss-hero img {
    max-height: 70vh;
    object-fit: cover;
    object-position: top;
}

/* Ma 間 heading rhythm: generous gap above signals section break,
   tight gap below makes heading gravitate toward its content. */
article h1:not(.moss-card-title):not(.moss-folder-title):not(.moss-article-title) {
  margin-top: var(--moss-space-2xl);   /* 64px — chapter break */
  margin-bottom: var(--moss-space-sm); /* 16px — attaches to content */
}

article h2:not(.moss-card-title) {
  margin-top: var(--moss-space-lg);    /* 32px — section sub-heading */
  margin-bottom: var(--moss-space-sm); /* 16px */
}

article h3:not(.moss-card-title) {
  margin-top: var(--moss-space-md);    /* 24px — sub-section */
  margin-bottom: var(--moss-space-xs); /* 8px */
}

/* On hero-led pages (homepage), `# Section` headings render as H2 because the
   hero acts as the visual H1. Give them H1-scale top margin so they read as
   chapter breaks, not mid-section sub-headings. */
.moss-hero ~ main article h2:not(.moss-card-title) {
  margin-top: var(--moss-space-2xl);   /* 64px — same as h1 chapter break */
}

/* Grid cards are layout cells, not prose — strip the article heading rhythm
   so the first heading in a card aligns with the card top edge.
   :not() on each selector matches specificity (0,1,2) of article h*:not(...). */
.moss-grid-card h1:not(.moss-card-title),
.moss-grid-card h2:not(.moss-card-title),
.moss-grid-card h3:not(.moss-card-title),
.moss-grid-card h4:not(.moss-card-title) {
  margin-top: 0;
}
