/* Engravous — base.css
   Loaded on every page directly after tokens.css (handle engravous-base), before layout.css
   and the per-template files. Scope: document defaults, the mockup's heading scale, the shared
   layout helpers (.eg-container, .eg-section, .eg-kicker), generic form / button / notice
   mappings for WooCommerce and WordPress markup, and the generic templates written by the
   same build step (page.php, index.php, search.php, 404.php, template-parts/post-card.php).
   Colors only via tokens.css variables. Header, nav and footer live in layout.css; product
   cards in card.css; every screen has its own file. */

:root {
  /* Softened ink for body copy (the mockup's grey-green paragraph color, expressed through
     the tokens). about.css / account.css pick this up as their muted color. */
  --eg-muted: color-mix(in srgb, var(--color-text) 78%, var(--color-bg));
  --eg-muted-soft: color-mix(in srgb, var(--color-text) 55%, transparent);
  --eg-line-soft: color-mix(in srgb, var(--color-text) 8%, transparent);
  --eg-hover-wash: color-mix(in srgb, var(--color-text) 7%, transparent);
}

/* ---- document ------------------------------------------------------------- */
html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
.eg-main,
#primary {
  flex: 1 0 auto;
  min-width: 0;
}

/* ---- headings (mockup scale) --------------------------------------------- */
h1, h2, h3, h4, h5, h6,
.eg-h1, .eg-h2, .eg-h3 {
  font-family: var(--font-heading);
  font-weight: var(--font-heading-weight);
  color: inherit;
  margin: 0 0 var(--space-2);
  overflow-wrap: anywhere;
}
h1, .eg-h1 {
  font-size: 60px;
  line-height: 1.05;
  letter-spacing: -0.02em;
}
h2, .eg-h2 {
  font-size: 40px;
  line-height: 1.12;
  letter-spacing: -0.015em;
}
h3, .eg-h3 {
  font-size: 24px;
  line-height: 1.2;
  letter-spacing: -0.01em;
}
h4 { font-size: 20px; line-height: 1.25; }
h5 { font-size: 16px; line-height: 1.3; }
h6 { font-size: 13px; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; }

@media (max-width: 1100px) {
  h1, .eg-h1 { font-size: 48px; }
  h2, .eg-h2 { font-size: 34px; }
}
@media (max-width: 720px) {
  h1, .eg-h1 { font-size: 38px; }
  h2, .eg-h2 { font-size: 30px; }
  h3, .eg-h3 { font-size: 22px; }
}

/* ---- text ----------------------------------------------------------------- */
p { margin: 0 0 var(--space-3); }
a {
  color: var(--color-accent-700);
  text-decoration: none;
  text-underline-offset: 3px;
}
a:hover,
a:focus-visible { text-decoration: underline; }
strong, b { font-weight: 600; }
small { font-size: 13px; }
hr {
  height: 1px;
  border: 0;
  margin: var(--space-6) 0;
  background: var(--color-divider);
}
ul, ol { padding-left: 1.3em; }
blockquote {
  margin: 0 0 var(--space-4);
  padding: 4px 0 4px 20px;
  border-left: 3px solid var(--color-accent-2);
  color: var(--eg-muted);
}
code, kbd, pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.92em;
}
pre {
  overflow-x: auto;
  padding: 14px 18px;
  border-radius: var(--radius-md);
  background: var(--color-surface);
}
img, svg, video { max-width: 100%; height: auto; }
img { display: block; }
table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
th, td {
  text-align: left;
  padding: 10px 12px;
  border-bottom: 1px solid var(--eg-line-soft);
}
th {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--eg-muted-soft);
  border-bottom-color: var(--color-divider);
}

.eg-lead {
  font-size: 17px;
  line-height: 1.7;
  color: var(--eg-muted);
  max-width: 62ch;
}
.eg-muted { color: var(--eg-muted); }
.eg-link {
  display: inline-block;
  font-weight: 600;
  color: var(--color-accent-700);
  text-decoration: none;
}
.eg-link:hover,
.eg-link:focus-visible { text-decoration: underline; }
.eg-link--lg { font-size: 16px; }

/* ---- accessibility ---------------------------------------------------------- */
/* .eg-sr-only is defined in layout.css (always loaded); WordPress' own class is mapped here
   because core does not ship front-end CSS for it. */
.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.screen-reader-text:focus {
  position: static !important;
  width: auto;
  height: auto;
  margin: 0;
  clip: auto;
  clip-path: none;
  white-space: normal;
}

/* ---- layout helpers --------------------------------------------------------- */
.eg-container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 56px;
  min-width: 0;
}
.eg-section { padding-top: 88px; }
.eg-section--last { padding-bottom: 88px; }
.eg-narrow {
  max-width: 760px;
  margin: 0 auto;
  min-width: 0;
}
.eg-wide {
  max-width: 1100px;
  margin: 0 auto;
  min-width: 0;
}
.eg-cover {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.eg-icon { display: block; flex: none; }

/* Kicker — the 11px uppercase label used above nearly every headline */
.eg-kicker {
  display: block;
  margin: 0 0 14px;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--color-accent-700);
}

.eg-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

/* ---- buttons: size variant + WooCommerce / block mapping ----------------------- */
.eg-btn-lg,
.btn.eg-btn-lg {
  min-height: 48px;
  padding: 14px 28px;
  font-size: 15px;
}

/* WooCommerce and block-editor buttons get the tokens .btn / .btn-primary look */
.woocommerce .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.wc-block-components-button,
.wp-element-button,
.wp-block-button__link,
.eg-theme .button,
.eg-theme button.button,
.eg-theme input.button,
.eg-theme input[type="submit"]:not(.input):not(.eg-search__submit),
.eg-theme button[type="submit"]:not(.btn):not(.eg-search__submit):not(.btn-secondary) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  box-sizing: border-box;
  margin: 0;
  padding: 12px 24px;
  min-height: 44px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: var(--color-accent);
  color: var(--color-bg);
  font-family: var(--font-heading);
  font-weight: var(--font-heading-weight);
  font-size: 14px;
  line-height: 1.2;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
.woocommerce .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.wc-block-components-button:hover,
.wp-element-button:hover,
.wp-block-button__link:hover,
.eg-theme .button:hover,
.eg-theme button.button:hover,
.eg-theme input.button:hover,
.eg-theme input[type="submit"]:not(.input):not(.eg-search__submit):hover,
.eg-theme button[type="submit"]:not(.btn):not(.eg-search__submit):not(.btn-secondary):hover {
  background: var(--color-accent-600);
  color: var(--color-bg);
  text-decoration: none;
}
.woocommerce .button:active,
.woocommerce a.button:active,
.woocommerce button.button:active,
.wp-element-button:active {
  background: var(--color-accent-700);
}
.woocommerce .button.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background: var(--color-accent);
  color: var(--color-bg);
}
.woocommerce .button.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
  background: var(--color-accent-600);
  color: var(--color-bg);
}
.woocommerce .button.disabled,
.woocommerce .button:disabled,
.woocommerce a.button.disabled,
.woocommerce button.button.disabled,
.woocommerce button.button:disabled,
.woocommerce input.button:disabled,
.wp-element-button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  background: var(--color-accent);
  color: var(--color-bg);
}
.woocommerce .button.loading { opacity: 0.6; }
/* secondary WooCommerce actions (e.g. "Zurück zum Shop", coupon, wishlist) */
.woocommerce a.button.wc-backward,
.woocommerce .return-to-shop .button,
.woocommerce .woocommerce-message .button,
.woocommerce .woocommerce-info .button,
.woocommerce .woocommerce-error .button {
  background: transparent;
  color: var(--color-text);
  border-color: var(--color-divider);
}
.woocommerce a.button.wc-backward:hover,
.woocommerce .return-to-shop .button:hover,
.woocommerce .woocommerce-message .button:hover,
.woocommerce .woocommerce-info .button:hover,
.woocommerce .woocommerce-error .button:hover {
  background: var(--eg-hover-wash);
  color: var(--color-text);
}
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  color: var(--color-text);
  border-color: var(--color-divider);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--eg-hover-wash);
  color: var(--color-text);
}

/* ---- form fields: generic inputs get the tokens .input look --------------------- */
.eg-theme input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="hidden"]):not(.eg-search__input):not(.qty),
.eg-theme textarea,
.eg-theme select,
.woocommerce .input-text,
.woocommerce select,
.woocommerce textarea,
.woocommerce .select2-container .select2-selection--single {
  box-sizing: border-box;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 8px 16px;
  font: inherit;
  font-size: 14px;
  line-height: 1.4;
  color: var(--color-text);
  caret-color: var(--color-accent);
  background: var(--color-surface);
  border: 1px solid var(--color-divider);
  border-radius: 999px;
  box-shadow: none;
  -webkit-appearance: none;
  appearance: none;
}
.eg-theme textarea,
.woocommerce textarea {
  min-height: 110px;
  padding-top: 12px;
  padding-bottom: 12px;
  border-radius: var(--radius-md);
  resize: vertical;
  line-height: 1.5;
}
.eg-theme select,
.woocommerce select {
  padding-right: 40px;
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  cursor: pointer;
}
.eg-theme select::-ms-expand { display: none; }
.eg-theme input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):hover,
.eg-theme textarea:hover,
.eg-theme select:hover {
  border-color: color-mix(in srgb, var(--color-text) 45%, transparent);
}
.eg-theme input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):focus-visible,
.eg-theme textarea:focus-visible,
.eg-theme select:focus-visible {
  border-color: var(--color-accent);
  outline: 2px solid var(--color-accent);
  outline-offset: 0;
}
.eg-theme ::placeholder {
  color: var(--eg-muted-soft);
  opacity: 1;
}
.eg-theme input[type="checkbox"],
.eg-theme input[type="radio"] {
  width: 16px;
  height: 16px;
  margin: 0 8px 0 0;
  accent-color: var(--color-accent);
  vertical-align: -2px;
}
.eg-input-lg,
.input.eg-input-lg {
  min-height: 48px;
  font-size: 15px;
  padding-inline: 20px;
}
/* label look comes from tokens.css (.field > label); WooCommerce rows are mapped below */
.eg-theme .required { color: var(--color-accent); text-decoration: none; }
.eg-theme .field { min-width: 0; }
.eg-form__row {
  display: flex;
  gap: 12px;
  align-items: stretch;
  max-width: 560px;
}
.eg-form__row .input,
.eg-form__row input[type="search"] {
  flex: 1;
  min-width: 0;
}
.eg-form__row .btn { flex: none; white-space: nowrap; }

/* WooCommerce form rows */
.woocommerce form .form-row {
  margin: 0 0 16px;
  padding: 0;
}
.woocommerce form .form-row label {
  display: block;
  font-size: 12px;
  line-height: 1.4;
  margin-bottom: 5px;
  color: color-mix(in srgb, var(--color-text) 70%, transparent);
}
.woocommerce form .form-row .required { color: var(--color-accent); }
.woocommerce form .form-row .input-checkbox { width: auto; min-height: 0; }
.woocommerce form .form-row.woocommerce-invalid .input-text,
.woocommerce form .form-row.woocommerce-invalid select {
  border-color: var(--color-accent-600);
}
.woocommerce form .form-row.woocommerce-validated .input-text,
.woocommerce form .form-row.woocommerce-validated select {
  border-color: var(--color-accent-2);
}
.woocommerce .quantity .qty {
  box-sizing: border-box;
  width: 72px;
  min-height: 44px;
  padding: 8px 12px;
  font: inherit;
  font-size: 14px;
  text-align: center;
  color: var(--color-text);
  background: var(--color-surface);
  border: 1px solid var(--color-divider);
  border-radius: 999px;
}

/* ---- notices --------------------------------------------------------------- */
.eg-notice {
  margin: 0 0 24px;
  padding: 14px 20px;
  border-radius: var(--radius-md);
  border-top: 3px solid var(--color-accent);
  background: var(--color-surface);
  color: var(--color-text);
  font-size: 14px;
  line-height: 1.5;
}
.eg-notice--ok { border-top-color: var(--color-accent-2); }
.eg-notice--error { border-top-color: var(--color-accent-600); }
.eg-notice a { color: inherit; text-decoration: underline; }

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-notice,
.wc-block-components-notice-banner {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  width: auto;
  margin: 0 0 24px;
  padding: 14px 20px;
  list-style: none;
  border: 0;
  border-top: 3px solid var(--color-accent);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  color: var(--color-text);
  font-size: 14px;
  line-height: 1.5;
  word-wrap: break-word;
}
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before,
.woocommerce-notice::before { content: none; display: none; }
.woocommerce-message { border-top-color: var(--color-accent-2); }
.woocommerce-info { border-top-color: var(--color-accent); }
.woocommerce-error { border-top-color: var(--color-accent-600); }
.woocommerce-error li { margin: 0; padding: 0; list-style: none; }
.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
  order: 2;
  margin-left: auto;
  min-height: 36px;
  padding: 8px 18px;
  font-size: 13px;
}
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce .woocommerce-notices-wrapper { margin: 0; }

/* ---- pagination (pill, as in the mockup list) ----------------------------------- */
.eg-pagination,
.woocommerce nav.woocommerce-pagination {
  margin: 48px 0 0;
  text-align: center;
}
.eg-pagination .nav-links,
.woocommerce nav.woocommerce-pagination ul.page-numbers {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  border: 0;
}
.woocommerce nav.woocommerce-pagination ul.page-numbers li {
  margin: 0;
  padding: 0;
  border: 0;
  float: none;
  overflow: visible;
}
.eg-pagination .page-numbers,
.woocommerce nav.woocommerce-pagination ul.page-numbers li .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 14px;
  border: 1px solid var(--color-divider);
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  color: var(--color-text);
  text-decoration: none;
  background: transparent;
}
.eg-pagination a.page-numbers:hover,
.eg-pagination a.page-numbers:focus-visible,
.woocommerce nav.woocommerce-pagination ul.page-numbers li a.page-numbers:hover,
.woocommerce nav.woocommerce-pagination ul.page-numbers li a.page-numbers:focus-visible {
  background: var(--eg-hover-wash);
  text-decoration: none;
}
.eg-pagination .page-numbers.current,
.woocommerce nav.woocommerce-pagination ul.page-numbers li .page-numbers.current {
  background: var(--color-text);
  border-color: var(--color-text);
  color: var(--color-bg);
}
.eg-pagination .page-numbers.dots,
.woocommerce nav.woocommerce-pagination ul.page-numbers li .page-numbers.dots {
  border-color: transparent;
  min-width: 24px;
  padding: 0;
}
.eg-pagination .screen-reader-text { position: absolute !important; }

/* ---- generic page / post templates (page.php, index.php, search.php) ------------------ */
.eg-page,
.eg-single,
.eg-archive,
.eg-search-page,
.eg-404 {
  padding: 56px 0 96px;
}
.eg-page__head,
.eg-archive__head {
  margin-bottom: 32px;
}
.eg-page__title {
  font-size: 48px;
  line-height: 1.08;
  letter-spacing: -0.02em;
  margin: 0;
}
.eg-archive__lead {
  margin-top: 14px;
  font-size: 16px;
  line-height: 1.7;
  color: var(--eg-muted);
  max-width: 62ch;
}
.eg-archive__lead p:last-child { margin-bottom: 0; }
.eg-page__media {
  margin: 0 0 32px;
  overflow: hidden;
  border-radius: var(--radius-lg);
  background: var(--color-surface);
}
.eg-page__img {
  width: 100%;
  height: auto;
  display: block;
}
.eg-search-page__term { color: var(--color-accent-700); }
.eg-search-page__empty { max-width: 640px; }
.eg-search-page__form { margin: 8px 0 20px; }
.eg-empty {
  font-size: 16px;
  color: var(--eg-muted);
}

/* Editor content ("prose"): readable defaults for the classic / block editor output */
.eg-prose {
  font-size: 16px;
  line-height: 1.7;
  color: var(--color-text);
}
.eg-prose > *:first-child { margin-top: 0; }
.eg-prose > *:last-child { margin-bottom: 0; }
.eg-prose p,
.eg-prose ul,
.eg-prose ol,
.eg-prose table,
.eg-prose figure,
.eg-prose blockquote,
.eg-prose pre { margin-bottom: 20px; }
.eg-prose h2 { font-size: 32px; margin: 44px 0 14px; }
.eg-prose h3 { font-size: 24px; margin: 32px 0 10px; }
.eg-prose h4 { margin: 24px 0 8px; }
.eg-prose li { margin-bottom: 6px; }
.eg-prose a { text-decoration: underline; }
.eg-prose img { border-radius: var(--radius-md); }
.eg-prose figcaption {
  font-size: 12px;
  margin-top: 8px;
  color: var(--eg-muted-soft);
}
.eg-prose .wp-block-image,
.eg-prose .wp-block-gallery { margin-bottom: 24px; }
.eg-prose .alignwide { margin-left: 0; margin-right: 0; max-width: 100%; }
.eg-prose .alignfull { margin-left: 0; margin-right: 0; max-width: 100%; }
.eg-prose .alignleft { float: left; margin: 4px 24px 16px 0; }
.eg-prose .alignright { float: right; margin: 4px 0 16px 24px; }
.eg-prose .aligncenter { margin-left: auto; margin-right: auto; }
.eg-prose .wp-block-separator {
  border: 0;
  height: 1px;
  background: var(--color-divider);
  max-width: 120px;
  margin: 32px auto;
}
.eg-prose .wp-block-quote,
.eg-prose .wp-block-pullquote {
  border-left: 3px solid var(--color-accent-2);
  padding-left: 20px;
  margin-left: 0;
  margin-right: 0;
  font-style: normal;
}
.eg-prose .wp-block-pullquote { border-top: 0; border-bottom: 0; text-align: left; }
.eg-prose .wp-block-table table { margin: 0; }
.eg-prose .wp-block-buttons { gap: 12px; }
.eg-page-links {
  margin-top: 32px;
  font-size: 14px;
  color: var(--eg-muted);
}
.eg-page-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  padding: 0 10px;
  margin-left: 6px;
  border: 1px solid var(--color-divider);
  border-radius: 999px;
  color: var(--color-text);
  font-weight: 600;
  text-decoration: none;
}
.eg-page-links a:hover { background: var(--eg-hover-wash); }

/* Prev / next post navigation */
.eg-post-nav {
  margin-top: 56px;
  padding-top: 28px;
  border-top: 1px solid var(--color-divider);
}
.eg-post-nav .nav-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.eg-post-nav .nav-next { text-align: right; }
.eg-post-nav a {
  display: inline-flex;
  flex-direction: column;
  gap: 6px;
  color: var(--color-text);
  text-decoration: none;
}
.eg-post-nav a:hover .eg-post-nav__title { color: var(--color-accent-700); }
.eg-post-nav__label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--color-accent-700);
}
.eg-post-nav__title {
  font-family: var(--font-heading);
  font-weight: var(--font-heading-weight);
  font-size: 20px;
  line-height: 1.25;
}

/* Card grid for posts / generic search results (product cards: card.css) */
.eg-post-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}
.eg-post-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border-radius: calc(var(--radius-lg) * 1.15);
  background: var(--color-surface);
}
.eg-post-card__media {
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: color-mix(in srgb, var(--color-text) 6%, var(--color-surface));
}
.eg-post-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}
.eg-post-card:hover .eg-post-card__img { transform: scale(1.03); }
.eg-post-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 10px;
  padding: 22px 24px 26px;
}
.eg-post-card__meta {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-accent-700);
}
.eg-post-card__title {
  font-size: 22px;
  line-height: 1.2;
  margin: 0;
}
.eg-post-card__title a {
  color: var(--color-text);
  text-decoration: none;
}
.eg-post-card__title a:hover { color: var(--color-accent-700); }
.eg-post-card__excerpt {
  flex: 1;
  margin: 0;
  font-size: 14px;
  line-height: 1.6;
  color: var(--eg-muted);
}
.eg-post-card .eg-link { margin-top: 4px; font-size: 14px; }

/* ---- 404 -------------------------------------------------------------------------------- */
.eg-404 { padding: 88px 0 120px; }
.eg-404__inner { max-width: 720px; }
.eg-404__title { margin-bottom: 20px; max-width: 14ch; }
.eg-404__lead { margin-bottom: 32px; }
.eg-404__actions { margin-bottom: 32px; }
.eg-404__search { margin-bottom: 36px; }
.eg-404__cats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.eg-404__cat {
  padding: 8px 18px;
  font-size: 13px;
  text-decoration: none;
}
.eg-404__cat:hover {
  background: var(--color-accent);
  color: var(--color-bg);
  text-decoration: none;
}

/* ---- contact form shortcode [engravous_contact_form] ------------------------------------- */
.eg-contact {
  scroll-margin-top: 24px;
  max-width: 760px;
  margin: 0 0 var(--space-6);
}
.eg-contact-form {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  min-width: 0;
  margin: 0;
}
.eg-contact-form__field--wide,
.eg-contact-form__submit { grid-column: span 2; }
.eg-contact-form .eg-contact-form__submit {
  justify-self: start;
  min-height: 48px;
  font-size: 15px;
  padding: 14px 28px;
}
/* honeypot: off-screen, never display:none */
.eg-contact-form__hp {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* ---- responsive ------------------------------------------------------------------------ */
@media (max-width: 1100px) {
  .eg-container { padding: 0 32px; }
  .eg-post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .eg-page__title { font-size: 42px; }
}
@media (max-width: 720px) {
  .eg-container { padding: 0 20px; }
  .eg-section { padding-top: 48px; }
  .eg-section--last { padding-bottom: 48px; }
  .eg-page,
  .eg-single,
  .eg-archive,
  .eg-search-page { padding: 36px 0 64px; }
  .eg-404 { padding: 56px 0 80px; }
  .eg-page__title { font-size: 34px; }
  .eg-post-grid { grid-template-columns: 1fr; gap: 18px; }
  .eg-post-nav .nav-links { grid-template-columns: 1fr; }
  .eg-post-nav .nav-next { text-align: left; }
  .eg-form__row { flex-direction: column; max-width: none; }
  .eg-form__row .btn { width: 100%; }
  .eg-contact-form { grid-template-columns: 1fr; }
  .eg-contact-form__field--wide,
  .eg-contact-form__submit { grid-column: auto; }
  .eg-contact-form .eg-contact-form__submit { width: 100%; }
  .eg-prose .alignleft,
  .eg-prose .alignright { float: none; margin: 0 0 16px; }
}