/* Content pages: contact, about, topic pages, forms (Contact Form 7), catlist. */

/* ── Contact ─────────────────────────────────────────────────────────────── */
.contact-page__layout { display: grid; gap: var(--s-6); padding-bottom: var(--section-y); }
@media (min-width: 1024px) { .contact-page__layout { grid-template-columns: 380px minmax(0, 1fr); gap: var(--s-10); align-items: start; } }

.contact-card { padding: var(--s-6); border-radius: var(--r-card-lg); background: var(--c-yellow); }
.contact-card__photo { width: 88px; height: 88px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 3px var(--c-white); margin-bottom: var(--s-3); }
.contact-card__name { margin: 0 0 var(--s-4); font-family: var(--font-heading); font-size: 1.375rem; font-weight: 700; }
.contact-card__list { display: grid; gap: var(--s-3); margin: 0 0 var(--s-6); padding: 0; list-style: none; }
.contact-card__list li { display: flex; gap: var(--s-3); align-items: flex-start; font-weight: 600; }
.contact-card__list .icon { margin-top: 2px; }
.contact-card__list a { text-decoration-color: rgb(0 0 0 / 0.35); overflow-wrap: anywhere; }
.contact-card__business { margin: 0 0 var(--s-4); font-size: var(--fs-xs); color: var(--c-grey-700); }
.contact-card__links { display: flex; flex-wrap: wrap; gap: var(--s-2); padding-top: var(--s-5); border-top: 1px solid rgb(0 0 0 / 0.12); }
.contact-card__links-title { width: 100%; margin: 0 0 var(--s-1); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.contact-card .chip { background: var(--c-white); border-color: transparent; }

.form-card { padding: var(--s-6); border-radius: var(--r-card-lg); background: var(--c-white); box-shadow: 0 0 0 1px var(--c-border), var(--shadow-md); }
@media (max-width: 1023.98px) { .form-card { order: -1; } } /* phones: the form first, the contact card (and its long list) after it */
@media (min-width: 768px) { .form-card { padding: var(--s-10); } }
.form-card__title { margin-bottom: var(--s-5); font-size: var(--fs-h3); }

/* ── Contact Form 7 (new markup from `wp knk cf7`, and the old one) ──────── */
.wpcf7 form { display: grid; gap: var(--s-4); }
.wpcf7 form > p { margin: 0; }
.knk-form { display: grid; gap: var(--s-4); }
.knk-form__row { display: grid; gap: var(--s-4); }
@media (min-width: 640px) { .knk-form__row { grid-template-columns: 1fr 1fr; } }
.wpcf7 .field { margin: 0; }
.wpcf7 label { display: grid; gap: var(--s-1); font-size: var(--fs-small); font-weight: 600; }
.wpcf7 .field__label { font-size: var(--fs-small); font-weight: 600; }
.wpcf7-form-control-wrap { display: block; }
.wpcf7 input[type='text'], .wpcf7 input[type='email'], .wpcf7 textarea { font-weight: 400; }
.wpcf7 br { display: none; } /* CF7 autop between label text and field */
.knk-form__check .wpcf7-list-item, .wpcf7-checkbox .wpcf7-list-item { margin: 0; }
.wpcf7-checkbox label, .knk-form__check label { display: flex; gap: var(--s-2); align-items: flex-start; font-weight: 400; }
.wpcf7-checkbox input { margin-top: 0.15rem; flex-shrink: 0; }
.knk-form__legal { margin: 0; font-size: var(--fs-xs); color: var(--c-text-muted); }
.knk-form__required { margin: 0; font-size: var(--fs-xs); color: var(--c-text-muted); }
.wpcf7-submit { justify-self: start; min-height: 44px; padding: 0.625rem 1.375rem; /* = .btn */ border: 0; border-radius: var(--r-pill); background: var(--c-black); color: var(--c-yellow); font: 700 1rem/1 var(--font-body); cursor: pointer; }
.wpcf7-submit:hover { background: #262626; }
.wpcf7-spinner { margin: 0 0 0 var(--s-3); }

/* Validation + response (CF7 states) */
.wpcf7-not-valid { border-color: var(--c-alert) !important; box-shadow: 0 0 0 3px rgb(220 38 38 / 0.15) !important; }
.wpcf7-not-valid-tip { margin-top: var(--s-1); font-size: var(--fs-xs); font-weight: 600; color: var(--c-alert); }
.wpcf7 form .wpcf7-response-output { margin: 0; padding: var(--s-4) var(--s-5); border: 0 !important; border-radius: var(--r-md); background: var(--c-grey-100); font-weight: 600; }
.wpcf7 form.sent .wpcf7-response-output { background: #e8f5ec; color: var(--c-success); }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.failed .wpcf7-response-output, .wpcf7 form.spam .wpcf7-response-output { background: #fdecec; color: var(--c-alert); }
.wpcf7 .screen-reader-response { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ── About ───────────────────────────────────────────────────────────────── */
.about-hero { padding-block: var(--s-10) var(--s-6); overflow-x: clip; } /* the rotated badge must not widen the page */
.about-hero__inner { display: grid; gap: var(--s-8); align-items: center; }
@media (min-width: 1024px) { .about-hero__inner { grid-template-columns: minmax(280px, 520px) 1fr; gap: var(--s-16); } }
.about-hero__photo { position: relative; margin: 0; }
.about-hero__photo > img:first-child { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: var(--r-card-lg); }
.about-hero__badge { position: absolute; right: -12px; bottom: -12px; width: 110px; height: 110px; transform: rotate(-8deg); }
.about-hero__lead { max-width: 48ch; }
.about-hero__cta { display: flex; flex-wrap: wrap; gap: var(--s-3); margin-top: var(--s-6); }
.about-page > .container--reading.section { padding-top: var(--s-8); }
.about-page__content > :first-child { margin-top: 0; }
.about-page__content img.aligncenter { max-width: 260px; }
@media (min-width: 1024px) {
	.about-hero { padding-bottom: var(--s-8); }
	.about-page > .container--reading.section { padding-top: 0; }
}

.about-ways { display: grid; gap: var(--s-5); margin-top: var(--s-8); }
@media (min-width: 768px) { .about-ways { grid-template-columns: 1fr 1fr; } }
.about-way { display: grid; gap: var(--s-3); padding: var(--s-6); border-radius: var(--r-card-lg); background: var(--c-white); text-decoration: none; box-shadow: var(--shadow-sm); transition: box-shadow var(--t-fast) var(--ease), transform var(--t-fast) var(--ease); }
.about-way:hover { box-shadow: var(--shadow-lg); transform: translateY(-2px); }
.about-way__title { font-family: var(--font-heading); font-size: var(--fs-h3); font-weight: 700; }
.about-way__more { display: inline-flex; align-items: center; gap: var(--s-2); font-weight: 700; }

/* ── Topic pages / content products / catlist ─────────────────────────────── */
.aip-hero { padding-block: clamp(3rem, 7vw, 6.5rem); background: var(--c-white); }
.aip-hero__inner, .aip-consult__inner { display: grid; gap: var(--s-8); align-items: center; }
@media (min-width: 768px) { .aip-hero__inner, .aip-consult__inner { grid-template-columns: minmax(0, 1fr) minmax(280px, 0.9fr); gap: clamp(var(--s-10), 8vw, var(--s-20)); } }
.aip-hero__copy { max-width: 56ch; }
.aip-hero h1 { max-width: 14ch; margin-bottom: var(--s-5); font-size: var(--fs-h1); line-height: var(--lh-tight); }
.aip-hero__lead { max-width: 52ch; margin-bottom: var(--s-6); font-size: var(--fs-lead); color: var(--c-grey-700); }
.aip-hero__note, .aip-steps__note { margin: var(--s-5) 0 0; font-size: var(--fs-xs); color: var(--c-text-muted); }
.aip-hero__art { display: grid; place-items: center; min-height: 240px; }
.aip-hero__art img { width: min(100%, 480px); max-height: 340px; object-fit: contain; }
.aip-steps h2, .aip-resources h2 { margin: 0 0 var(--s-8); font-size: var(--fs-h2); }
.aip-steps__grid { display: grid; gap: var(--s-6); margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .aip-steps__grid { grid-template-columns: repeat(3, 1fr); gap: 0; } .aip-steps__grid li + li { border-left: 1px solid var(--c-border); } }
.aip-steps__grid li { padding: 0 var(--s-6); }
.aip-steps__grid li:first-child { padding-left: 0; }
.aip-steps__grid li:last-child { padding-right: 0; }
.aip-steps__number { display: block; margin-bottom: var(--s-2); color: var(--c-text-subtle); font-size: var(--fs-xs); letter-spacing: 0.1em; text-transform: uppercase; }
.aip-steps__grid h3 { margin: 0 0 var(--s-2); font-family: var(--font-heading); font-size: var(--fs-h3); }
.aip-steps__grid p { max-width: 34ch; margin: 0; color: var(--c-text-muted); }
.aip-consult__copy { max-width: 58ch; }
.aip-consult__copy h2 { margin: 0 0 var(--s-4); font-size: var(--fs-h2); }
.aip-consult__copy p:not(.eyebrow) { color: var(--c-grey-700); }
.aip-consult__copy .btn { margin-top: var(--s-3); }
.aip-consult__photo { margin: 0; }
.aip-consult__photo img { width: 100%; max-height: 440px; aspect-ratio: 1.5; object-fit: cover; object-position: center 35%; border-radius: var(--r-card); }
@media (min-width: 1024px) { .aip-consult__photo img { border-radius: var(--r-card-lg); } }
.aip-resources .eyebrow { margin-bottom: var(--s-2); }
.aip-resources__columns { display: grid; grid-template-columns: 1fr; gap: 0 var(--s-8); }
.aip-resources__list { display: grid; grid-template-columns: 1fr; align-content: start; margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .aip-resources__columns { grid-template-columns: 1fr 1fr; } .aip-resources__list + .aip-resources__list { border-left: 1px solid var(--c-border); padding-left: var(--s-8); } }
.aip-resources__list li { border-bottom: 1px solid var(--c-border); }
.aip-resources__list a { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); min-height: 56px; padding-block: var(--s-3); color: var(--c-text); text-decoration: none; }
.aip-resources__list a:hover span { text-decoration: underline; text-decoration-color: var(--c-yellow-deep); text-underline-offset: 0.18em; }
.aip-resources__list .icon { flex: 0 0 auto; }
.aip-recipes .section-head { margin-bottom: var(--s-8); }
@media (max-width: 767.98px) { .aip-steps__grid li { padding-inline: 0; } }

.section-head--inline { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-4); margin-bottom: var(--s-8); }
.section-head--inline h2 { margin: 0; }
/* Product cards inside a page break out of the 760px reading column to the container width. */
.prose .content-products {
  position: relative;
  left: 50%;
  width: min(var(--container), 100vw - 2 * var(--gutter));
  max-width: none;
  margin: var(--s-10) 0;
  transform: translateX(-50%);
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
}
@media (min-width: 1024px) { .prose .content-products { grid-template-columns: repeat(3, 1fr); } }
/* On pages the column starts at the container edge → the cards simply take the container width. */
.container--reading .prose .content-products { left: 0; width: min(var(--container), 100vw - 2 * var(--gutter)); transform: none; }
.prose .lcp_catlist { padding: 0; list-style: none; display: grid; gap: var(--s-2); }
.prose .lcp_catlist li { padding: var(--s-3) var(--s-4); border-radius: var(--r-md); background: var(--c-surface-alt); }
.prose .lcp_catlist li a { font-weight: 600; text-decoration: none; }

/* Cards inside long-form content must not inherit article typography (heading margins, rounded images, link underline colour). */
.prose .card h2, .prose .card h3 { margin: 0; }
.prose .card img { border-radius: 0; }
.prose .card a { text-decoration: none; }
.prose .card ul { padding-left: 0; }
.prose .card li + li { margin-top: 0; }

/* Wide tables (privacy policy) take the container width on desktop instead of four squeezed columns in 760 px. */
@media (min-width: 1024px) {
  .container--reading .prose .table--stack { width: min(var(--container), 100vw - 2 * var(--gutter)); max-width: none; }
  .container--reading .prose .table--stack th:first-child, .container--reading .prose .table--stack td:first-child { width: 18%; }
}