/*
Theme Name: Vincenzo-Critic
Theme URI: https://davidgagne.net/tags/wordpress/
Author: David Vincent Gagne
Author URI: https://davidgagne.net/
Description: Kid Critic — restaurant reviews by an eleven-year-old, set as a restaurant menu. Titles on the left, dates where the prices go, and an arbitrary star system, because he grades the water. Bootstrap 5 and Font Awesome.
Version: 0.3.2
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: vincenzo-critic
Tags: blog, one-column, custom-logo, custom-menu, featured-images, threaded-comments
*/

/*--------------------------------------------------
-    Title:    Main Stylesheet (vincenzo-critic)
-    File:     /style.css
-    Author:   (c) David Vincent Gagne, dvg@davidgagne.net
-    Created:  Wed Jul 15 2026 @ 13:11:33 EDT
-    Modified: Wed Jul 15 2026 @ 22:05:41 EDT
-    Version:  0.3.0
-
-    The whole site is a restaurant menu: a white sheet on a table, one serif family, and every
-    listing is an item on the left with leader dots running to a "price" on the right. On the
-    front page the price is the date; on a review it is the rating.
-
-    Layered over Bootstrap 5, which is enqueued first so everything here wins.
-
-    The WordPress theme header above has to stay the first comment in this file, so this block sits
-    underneath it rather than at the very top.
--------------------------------------------------*/

/*--------------------------------------------------
     tokens
--------------------------------------------------*/

:root {
     --kc-table: #e9e5dc;
     --kc-paper: #fdfcf9;
     --kc-ink: #1c1a17;
     --kc-mid: #5d574e;

     /*
          Contrast against --kc-paper, measured, WCAG AA wants 4.5:1 for body text:
               --kc-ink    16.92:1
               --kc-mid     6.97:1
               --kc-muted   4.83:1   (was #9a9287 at 2.99:1 -- failed, and it was carrying the
                                      smallest text on the sheet, which is the worst combination)
               --kc-dot     3.25:1   (was #b5ac9d at 2.19:1 -- the leaders were nearly invisible)
     */
     --kc-muted: #776f63;
     --kc-rule: #ddd7cb;
     --kc-dot: #978b7a;

     /*
          Two teals on purpose. --kc-teal is the brand: stars, the colouring-in on the logo, borders
          -- decoration, where 2.34:1 is fine. --kc-teal-text is the same hue dropped to 4.69:1 so it
          can legally carry text (the restaurant name, link hovers). Do not use --kc-teal on words.
     */
     --kc-teal: #2ebaae;
     --kc-teal-text: #1f7f77;

     --kc-serif: "Cormorant Garamond", Garamond, "Times New Roman", serif;

     /*
          The one tracking value the menu furniture leans on.
     */
     --kc-track: 0.3em;
     --kc-sheet: 780px;
}

/*--------------------------------------------------
     the table and the sheet
--------------------------------------------------*/

/*
     rem resolves against the ROOT element, not body -- so setting body { font-size: 20px } left
     every rem in this file resolving against html's 16px and the whole sheet rendered a fifth
     smaller than it was drawn (the footer legal line came out at 9.9px). Set it here instead.

     A percentage, not a pixel value: 125% of whatever the reader has chosen. Someone who has set
     their browser to 20px gets 25px, which is the entire point of them setting it.
*/
html {
     font-size: 125%;
}

body {
     margin: 0;
     background: var(--kc-table);
     color: var(--kc-ink);
     font-family: var(--kc-serif);
     font-size: 1rem;
     font-weight: 400;
     line-height: 1.75;
     -webkit-font-smoothing: antialiased;
     overflow-wrap: break-word;
}

.kc-table {
     padding: 3rem 1.25rem 4rem;
}

.kc-sheet {
     max-width: var(--kc-sheet);
     margin: 0 auto;
     padding: 4.5rem 4.5rem 3rem;
     background: var(--kc-paper);
     box-shadow: 0 1px 2px rgba(28, 26, 23, 0.06), 0 12px 34px rgba(28, 26, 23, 0.08);
}

a {
     color: var(--kc-ink);
     text-decoration: none;
     border-bottom: 1px solid var(--kc-rule);
     transition: color 0.15s ease, border-color 0.15s ease;
}

a:hover,
a:focus {
     color: var(--kc-teal-text);
     border-bottom-color: var(--kc-teal);
}

:focus-visible {
     outline: 2px solid var(--kc-teal);
     outline-offset: 3px;
}

.kc-skip {
     position: absolute;
     top: 10px;
     left: 10px;
     z-index: 100;
}

/*--------------------------------------------------
     rules
--------------------------------------------------*/

.kc-rule {
     margin: 2rem 0;
     height: 0;
     border: 0;
     border-top: 1px solid var(--kc-rule);
     opacity: 1;
}

.kc-rule--double {
     height: 3px;
     border-top: 1px solid var(--kc-rule);
     border-bottom: 1px solid var(--kc-rule);
}

.kc-rule--short {
     width: 90px;
     margin: 1.75rem auto;
     border-top-width: 1px;
}

/*--------------------------------------------------
     letterhead
--------------------------------------------------*/

.kc-letterhead {
     text-align: center;
}

.kc-letterhead__mark {
     display: inline-block;
     width: 46px;
     margin-bottom: 1.25rem;
     border: 0;
     color: var(--kc-ink);
}

.kc-mark {
     display: block;
     width: 100%;
     height: auto;
     overflow: visible;
}

.kc-mark__fill { fill: var(--kc-teal); }
.kc-mark__slip { stroke: var(--kc-teal); opacity: 0.5; }
.kc-mark__pen  { stroke: currentColor; }

/*
     The cap is sized so "Kid Critic" holds one line inside the sheet (780px less 9rem of padding).
     It was 4rem back when 1rem meant 16px; once the root was corrected to 20px that became 80px and
     the wordmark broke onto two lines. A longer site name will still wrap, which is fine.
*/
.kc-letterhead__brand {
     margin: 0;
     font-size: clamp( 2rem, 6vw, 3.2rem );
     font-weight: 300;
     letter-spacing: var(--kc-track);
     line-height: 1.1;
     text-transform: uppercase;
     text-indent: var(--kc-track);
}

.kc-letterhead__brand a {
     border: 0;
     color: var(--kc-ink);
}

.kc-letterhead__brand a:hover {
     color: var(--kc-teal-text);
}

.kc-letterhead__tagline {
     margin: 0.9rem 0 0;
     color: var(--kc-muted);
     font-size: 0.78rem;
     font-weight: 400;
     letter-spacing: var(--kc-track);
     text-transform: uppercase;
     text-indent: var(--kc-track);
}

/*--------------------------------------------------
     courses (the nav, and the section headings)
--------------------------------------------------*/

.kc-courses__list {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     gap: 0 2.25rem;
     margin: 0;
     padding: 0;
     list-style: none;
}

.kc-courses__list a {
     border: 0;
     color: var(--kc-mid);
     font-size: 0.75rem;
     letter-spacing: var(--kc-track);
     text-indent: var(--kc-track);
     text-transform: uppercase;
     white-space: nowrap;
}

.kc-courses__list a:hover,
.kc-courses__list .current-menu-item > a,
.kc-courses__list .current_page_item > a {
     color: var(--kc-teal-text);
}

.kc-course {
     margin: 3.25rem 0 1.75rem;
     color: var(--kc-ink);
     font-size: 0.8rem;
     font-weight: 600;
     letter-spacing: var(--kc-track);
     text-align: center;
     text-indent: var(--kc-track);
     text-transform: uppercase;
}

.kc-course::before,
.kc-course::after {
     display: inline-block;
     margin: 0 0.9rem;
     color: var(--kc-dot);
     content: "\002217";
     text-indent: 0;
     vertical-align: 0.1em;
}

.kc-main > .kc-course:first-child {
     margin-top: 2.5rem;
}

/*--------------------------------------------------
     the menu line

     Item name, leader dots, price. The leader is a flex spacer painted with a repeating radial
     gradient, so the dots are actually round and their size and spacing are ours to set -- a
     dotted border renders as squares in some engines and cannot be tuned.
--------------------------------------------------*/

.kc-line {
     display: flex;
     align-items: baseline;
     gap: 0;
     margin: 0;
}

.kc-line__name {
     flex: 0 1 auto;
     font-size: 1.05rem;
     font-weight: 500;
     line-height: 1.4;
}

.kc-line__name a {
     border: 0;
     color: var(--kc-ink);
}

.kc-line__name a:hover {
     color: var(--kc-teal-text);
}

.kc-line__leader {
     flex: 1 1 auto;
     min-width: 1.5rem;
     height: 0.65em;
     margin: 0 0.55rem;
     background-image: radial-gradient( circle at center, var(--kc-dot) 1px, transparent 1.2px );
     background-position: left bottom;
     background-repeat: repeat-x;
     background-size: 6px 6px;
}

.kc-line__price {
     flex: 0 0 auto;
     color: var(--kc-mid);
     font-size: 0.92rem;
     font-variant-numeric: tabular-nums;
     white-space: nowrap;
}

/*
     the description under an item
*/
.kc-item {
     margin-bottom: 1.6rem;
}

.kc-item__blurb {
     max-width: 92%;
     margin: 0.2rem 0 0;
     padding-left: 1.25rem;
     color: var(--kc-mid);
     font-size: 0.92rem;
     font-style: italic;
     line-height: 1.6;
}

.kc-tally {
     margin: 0.25rem 0 0;
     padding-left: 1.25rem;
     color: var(--kc-muted);
     font-size: 0.78rem;
     letter-spacing: 0.14em;
     text-transform: uppercase;
}

.kc-tally__value {
     color: var(--kc-mid);
     font-variant-numeric: tabular-nums;
}

.kc-dot {
     color: var(--kc-dot);
     padding: 0 0.15em;
}

/*--------------------------------------------------
     page heads (archives, search)
--------------------------------------------------*/

.kc-pagehead {
     margin-bottom: 1rem;
     padding-top: 2.5rem;
     text-align: center;
}

.kc-pagehead__eyebrow {
     margin: 0 0 0.5rem;
     color: var(--kc-muted);
     font-size: 0.78rem;
     letter-spacing: var(--kc-track);
     text-indent: var(--kc-track);
     text-transform: uppercase;
}

.kc-pagehead__title {
     margin: 0;
     font-size: 1.9rem;
     font-weight: 400;
     letter-spacing: 0.08em;
}

.kc-pagehead__text {
     margin-top: 0.75rem;
     color: var(--kc-mid);
     font-size: 0.95rem;
     font-style: italic;
}

.kc-pagehead__count {
     margin: 0.6rem 0 0;
     color: var(--kc-muted);
     font-size: 0.78rem;
     letter-spacing: var(--kc-track);
     text-indent: var(--kc-track);
     text-transform: uppercase;
}

/*--------------------------------------------------
     a single dish (single.php / page.php)
--------------------------------------------------*/

.kc-dish__head {
     padding-top: 2.5rem;
     text-align: center;
}

.kc-dish__course {
     margin: 0 0 1rem;
     color: var(--kc-teal-text);
}

.kc-dish__course::before,
.kc-dish__course::after {
     color: var(--kc-dot);
}

.kc-dish__title {
     margin: 0;
     font-size: clamp( 1.9rem, 4.5vw, 2.6rem );
     font-weight: 400;
     letter-spacing: 0.04em;
     line-height: 1.2;
}

.kc-dish__meta {
     margin: 0.9rem 0 0;
     color: var(--kc-muted);
     font-size: 0.78rem;
     letter-spacing: 0.16em;
     text-transform: uppercase;
}

.kc-dish__meta a {
     border: 0;
     color: var(--kc-muted);
}

.kc-dish__meta a:hover {
     color: var(--kc-teal-text);
}

.kc-dish__logo {
     margin: 1.5rem 0 0;
}

.kc-dish__logo img {
     width: auto;
     max-width: 110px;
     max-height: 60px;
     object-fit: contain;
     mix-blend-mode: multiply;
}

.kc-dish__plate {
     margin: 0 0 2.5rem;
}

.kc-dish__plate img {
     display: block;
     width: 100%;
}

/*--------------------------------------------------
     the report card -- menu lines whose price is a rating
--------------------------------------------------*/

.kc-report {
     margin: 0 0 2.75rem;
}

.kc-report__title {
     margin-top: 0;
}

.kc-line--rating {
     margin-bottom: 0.85rem;
}

.kc-line--rating .kc-line__name {
     font-size: 1rem;
     font-weight: 400;
}

.kc-line--rating .kc-line__price {
     display: inline-flex;
     align-items: center;
     gap: 0.65rem;
}

.kc-line__score {
     color: var(--kc-mid);
     font-size: 0.85rem;
     font-variant-numeric: tabular-nums;
}

.kc-line__of {
     color: var(--kc-muted);
}

/*
     stars -- two identical rows stacked, the filled one clipped by width, so any fraction of any
     scale renders without needing a half-star glyph
*/
.kc-stars {
     position: relative;
     display: inline-block;
     flex-shrink: 0;
     line-height: 1;
     white-space: nowrap;
}

.kc-stars__track,
.kc-stars__fill {
     display: block;
     line-height: 1;
     white-space: nowrap;
}

.kc-stars__fill {
     position: absolute;
     top: 0;
     left: 0;
     overflow: hidden;
}

.kc-stars i {
     display: inline-block;
     margin-right: 1px;
     font-size: 9px;
}

.kc-stars__track i { color: var(--kc-rule); }
.kc-stars__fill i  { color: var(--kc-teal); }

/*--------------------------------------------------
     the verdict
--------------------------------------------------*/

.kc-verdict {
     margin: 2rem 0 0;
     padding: 0;
     text-align: center;
}

.kc-verdict p {
     margin: 0;
     font-size: 1.35rem;
     font-style: italic;
     font-weight: 400;
     line-height: 1.5;
}

.kc-verdict p::before { content: "\201C"; }
.kc-verdict p::after  { content: "\201D"; }

/*--------------------------------------------------
     notebook
--------------------------------------------------*/

.kc-notebook {
     margin: 3rem 0 0;
}

.kc-notebook__page {
     margin: 0;
}

.kc-notebook__page a {
     display: block;
     border: 0;
}

.kc-notebook__page img {
     display: block;
     width: 100%;
     border: 1px solid var(--kc-rule);
}

/*--------------------------------------------------
     prose
--------------------------------------------------*/

.kc-prose {
     font-size: 1.05rem;
     line-height: 1.85;
}

.kc-prose > *:first-child {
     margin-top: 0;
}

.kc-prose p {
     margin: 0 0 1.4em;
}

.kc-prose a {
     border-bottom-color: var(--kc-dot);
}

.kc-prose h1, .kc-prose h2, .kc-prose h3,
.kc-prose h4, .kc-prose h5, .kc-prose h6 {
     margin: 2em 0 0.7em;
     font-weight: 600;
     letter-spacing: 0.06em;
     line-height: 1.3;
}

.kc-prose h1 { font-size: 1.6rem; }
.kc-prose h2 { font-size: 1.4rem; }
.kc-prose h3 { font-size: 1.2rem; }
.kc-prose h4 { font-size: 1.05rem; }
.kc-prose h5 { font-size: 0.95rem; }
.kc-prose h6 {
     font-size: 0.75rem;
     letter-spacing: var(--kc-track);
     text-transform: uppercase;
     color: var(--kc-muted);
}

.kc-prose ul,
.kc-prose ol {
     margin: 0 0 1.4em;
     padding-left: 1.4em;
}

.kc-prose li {
     margin-bottom: 0.3em;
}

.kc-prose blockquote {
     margin: 2em 0;
     padding-left: 1.5em;
     border-left: 1px solid var(--kc-rule);
     color: var(--kc-mid);
     font-style: italic;
}

.kc-prose blockquote cite {
     display: block;
     margin-top: 0.7em;
     color: var(--kc-muted);
     font-size: 0.78rem;
     font-style: normal;
     letter-spacing: 0.16em;
     text-transform: uppercase;
}

/*
     Bootstrap ships <code> in hot pink (#d63384). A menu is printed in one ink.
*/
.kc-prose code,
.kc-prose kbd,
.kc-prose tt,
.kc-prose var,
.kc-prose samp {
     padding: 0.1em 0.35em;
     background: rgba(28, 26, 23, 0.04);
     border: 1px solid var(--kc-rule);
     color: var(--kc-ink);
     font-family: "Courier New", Courier, monospace;
     font-size: 0.8em;
}

.kc-prose pre {
     margin: 2em 0;
     padding: 1.25em;
     background: rgba(28, 26, 23, 0.04);
     border: 1px solid var(--kc-rule);
     font-family: "Courier New", Courier, monospace;
     font-size: 0.78rem;
     line-height: 1.7;
     overflow-x: auto;
     tab-size: 5;
}

.kc-prose pre code {
     padding: 0;
     background: none;
     border: 0;
}

.kc-prose table {
     width: 100%;
     margin: 2em 0;
     border-collapse: collapse;
     font-size: 0.9rem;
}

.kc-prose th,
.kc-prose td {
     padding: 0.6em 0.7em;
     border-bottom: 1px solid var(--kc-rule);
     text-align: left;
}

.kc-prose th {
     font-size: 0.78rem;
     font-weight: 600;
     letter-spacing: 0.16em;
     text-transform: uppercase;
}

.kc-prose hr {
     margin: 2.5em 0;
     border: 0;
     border-top: 1px solid var(--kc-rule);
     opacity: 1;
}

.kc-prose dt {
     font-weight: 600;
}

.kc-prose dd {
     margin: 0 0 1em;
     padding-left: 1.2em;
}

.kc-prose img {
     height: auto;
}

.kc-prose figure {
     margin: 2em 0;
}

.kc-prose abbr[title] {
     text-decoration: underline dotted;
     cursor: help;
}

.kc-prose address {
     margin: 0 0 1.4em;
     color: var(--kc-mid);
     font-style: italic;
}

/*--------------------------------------------------
     required WordPress classes
--------------------------------------------------*/

img {
     max-width: 100%;
     height: auto;
}

.alignleft {
     float: left;
     margin: 0.4em 1.8em 1.2em 0;
}

.alignright {
     float: right;
     margin: 0.4em 0 1.2em 1.8em;
}

.aligncenter {
     display: block;
     margin-left: auto;
     margin-right: auto;
}

.alignnone {
     margin: 1.2em 0;
}

.kc-prose::after {
     display: block;
     clear: both;
     content: "";
}

.wp-caption {
     max-width: 100%;
     margin-bottom: 1.6em;
}

.wp-caption img {
     display: block;
     margin: 0 auto;
}

.wp-caption-text,
.gallery-caption,
.kc-prose figcaption {
     margin: 0.7em 0 0;
     color: var(--kc-muted);
     font-size: 0.78rem;
     font-style: italic;
     text-align: center;
     line-height: 1.6;
}

.sticky,
.bypostauthor {
     display: block;
}

.kc-item.sticky .kc-line__name::before {
     margin-right: 0.5em;
     color: var(--kc-teal-text);
     content: "\002217";
}

.gallery {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 0.75rem;
     margin: 2em 0;
}

.gallery-columns-1 { grid-template-columns: 1fr; }
.gallery-columns-2 { grid-template-columns: repeat(2, 1fr); }
.gallery-columns-4 { grid-template-columns: repeat(4, 1fr); }
.gallery-columns-5 { grid-template-columns: repeat(5, 1fr); }
.gallery-columns-6 { grid-template-columns: repeat(6, 1fr); }
.gallery-columns-7 { grid-template-columns: repeat(7, 1fr); }
.gallery-columns-8 { grid-template-columns: repeat(8, 1fr); }
.gallery-columns-9 { grid-template-columns: repeat(9, 1fr); }

.gallery-item {
     margin: 0;
     text-align: center;
}

.gallery-icon img {
     display: block;
     width: 100%;
     border: 1px solid var(--kc-rule);
}

.post-password-form {
     margin: 2em 0;
}

.post-password-form label {
     display: block;
     margin-bottom: 0.5em;
     color: var(--kc-muted);
     font-size: 0.78rem;
     letter-spacing: 0.16em;
     text-transform: uppercase;
}

.post-password-form input[type="password"] {
     padding: 0.5em 0.7em;
     background: transparent;
     border: 1px solid var(--kc-rule);
     border-radius: 0;
     font-family: var(--kc-serif);
     font-size: 1rem;
}

.post-password-form input[type="submit"],
.kc-commentform input[type="submit"] {
     padding: 0.55em 1.6em;
     background: transparent;
     border: 1px solid var(--kc-ink);
     border-radius: 0;
     color: var(--kc-ink);
     font-family: var(--kc-serif);
     font-size: 0.78rem;
     letter-spacing: var(--kc-track);
     text-indent: var(--kc-track);
     text-transform: uppercase;
     cursor: pointer;
     transition: background 0.15s ease, color 0.15s ease;
}

.post-password-form input[type="submit"]:hover,
.kc-commentform input[type="submit"]:hover {
     background: var(--kc-ink);
     color: var(--kc-paper);
}

.kc-linkpages {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
     gap: 0.6rem;
     margin-top: 2.5em;
     font-size: 0.85rem;
}

.kc-linkpages__label {
     color: var(--kc-muted);
     font-size: 0.78rem;
     letter-spacing: 0.16em;
     text-transform: uppercase;
}

/*--------------------------------------------------
     terms
--------------------------------------------------*/

.kc-terms {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     gap: 1.5rem 3rem;
     margin-top: 3rem;
     padding-top: 2rem;
     border-top: 1px solid var(--kc-rule);
     text-align: center;
}

.kc-terms__group {
     flex: 0 1 auto;
}

.kc-terms__label {
     margin: 0 0 0.6rem;
     color: var(--kc-muted);
     font-size: 0.75rem;
     font-weight: 400;
     letter-spacing: var(--kc-track);
     text-indent: var(--kc-track);
     text-transform: uppercase;
}

.kc-terms__list {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     gap: 0.3rem 1rem;
     font-size: 0.85rem;
     font-style: italic;
}

.kc-terms__list a {
     border-bottom-color: var(--kc-dot);
     color: var(--kc-mid);
}

/*--------------------------------------------------
     pagination and post nav
--------------------------------------------------*/

.kc-pagination {
     margin-top: 3rem;
     text-align: center;
}

.kc-pagination .nav-links {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
     justify-content: center;
     gap: 0.9rem;
}

.kc-pagination .page-numbers {
     border: 0;
     color: var(--kc-mid);
     font-size: 0.75rem;
     letter-spacing: 0.16em;
     text-transform: uppercase;
}

.kc-pagination a.page-numbers:hover {
     color: var(--kc-teal-text);
}

.kc-pagination .page-numbers.current {
     color: var(--kc-ink);
     text-decoration: underline;
     text-underline-offset: 5px;
}

.kc-postnav {
     margin-top: 3rem;
     padding-top: 2rem;
     border-top: 1px solid var(--kc-rule);
}

.kc-postnav .nav-links {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 2rem;
}

.kc-postnav .nav-next {
     text-align: right;
}

.kc-postnav a {
     border: 0;
}

.kc-postnav__label {
     display: block;
     margin-bottom: 0.35rem;
     color: var(--kc-muted);
     font-size: 0.75rem;
     letter-spacing: var(--kc-track);
     text-transform: uppercase;
}

.kc-postnav__title {
     display: block;
     color: var(--kc-ink);
     font-size: 0.95rem;
     font-style: italic;
     line-height: 1.5;
}

.kc-postnav a:hover .kc-postnav__title {
     color: var(--kc-teal-text);
}

/*--------------------------------------------------
     search
--------------------------------------------------*/

.kc-search__group {
     border: 1px solid var(--kc-rule);
     background: transparent;
}

.kc-search__icon {
     background: transparent;
     border: 0;
     color: var(--kc-muted);
}

.kc-search__input,
.kc-search__input:focus {
     background: transparent;
     border: 0;
     box-shadow: none;
     color: var(--kc-ink);
     font-family: var(--kc-serif);
     font-size: 1rem;
}

.kc-search__input::placeholder {
     color: var(--kc-muted);
     font-style: italic;
}

.kc-eightysix {
     text-align: center;
}

.kc-eightysix__search {
     max-width: 340px;
     margin: 2rem auto;
}

.kc-eightysix .kc-prose {
     max-width: 460px;
     margin: 0 auto;
}

.kc-more {
     margin: 2rem 0 0;
     font-size: 0.75rem;
     letter-spacing: 0.16em;
     text-transform: uppercase;
}

.kc-more a {
     border: 0;
     color: var(--kc-mid);
}

.kc-more a:hover {
     color: var(--kc-teal-text);
}

/*--------------------------------------------------
     comments
--------------------------------------------------*/

.kc-comments {
     margin-top: 3rem;
     padding-top: 2rem;
     border-top: 1px solid var(--kc-rule);
}

.kc-comments__title {
     margin: 0 0 1.75rem;
     font-size: 0.8rem;
     font-weight: 600;
     letter-spacing: var(--kc-track);
     text-align: center;
     text-indent: var(--kc-track);
     text-transform: uppercase;
}

.kc-comments__list,
.kc-comments__list .children {
     margin: 0;
     padding: 0;
     list-style: none;
}

.kc-comments__list .children {
     margin-top: 1.5rem;
     padding-left: 1.5rem;
     border-left: 1px solid var(--kc-rule);
}

.kc-comments__list li.comment,
.kc-comments__list li.pingback,
.kc-comments__list li.trackback {
     margin-bottom: 1.75rem;
}

.kc-comments__list .comment-body {
     font-size: 0.95rem;
}

.kc-comments__list .comment-meta {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
     gap: 0.75rem;
     margin-bottom: 0.5rem;
}

.kc-comments__list .comment-author {
     display: flex;
     align-items: center;
     gap: 0.6rem;
     font-size: 0.75rem;
     letter-spacing: 0.16em;
     text-transform: uppercase;
}

.kc-comments__list .comment-author img {
     border-radius: 50%;
}

.kc-comments__list .comment-author .says {
     display: none;
}

.kc-comments__list .comment-metadata,
.kc-comments__list .comment-metadata a {
     color: var(--kc-muted);
     font-size: 0.76rem;
     letter-spacing: 0.14em;
     text-transform: uppercase;
}

.kc-comments__list .comment-metadata a {
     border: 0;
}

.kc-comments__list .comment-awaiting-moderation {
     display: block;
     margin: 0.5rem 0;
     color: var(--kc-teal-text);
     font-size: 0.85rem;
     font-style: italic;
}

.kc-comments__list .reply a {
     border: 0;
     font-size: 0.76rem;
     letter-spacing: 0.14em;
     text-transform: uppercase;
}

.kc-comments__list li.bypostauthor > .comment-body .comment-author::after {
     margin-left: 0.4em;
     color: var(--kc-teal-text);
     content: "\002217";
}

.kc-comments__closed {
     color: var(--kc-muted);
     font-size: 0.75rem;
     font-style: italic;
     text-align: center;
}

.kc-commentform__notes {
     color: var(--kc-muted);
     font-size: 0.8rem;
     font-style: italic;
}

.comment-form label {
     display: block;
     margin-bottom: 0.3rem;
     font-size: 0.76rem;
     letter-spacing: 0.16em;
     text-transform: uppercase;
}

.comment-form .form-control {
     background: transparent;
     border: 1px solid var(--kc-rule);
     border-radius: 0;
     font-family: var(--kc-serif);
     font-size: 1rem;
}

.comment-form .form-control:focus {
     background: transparent;
     border-color: var(--kc-teal);
     box-shadow: none;
}

.comment-form p {
     margin-bottom: 1.1rem;
}

/*--------------------------------------------------
     the advisory
--------------------------------------------------*/

.kc-advisory {
     margin-top: 3.5rem;
     text-align: center;
}

.kc-advisory .kc-rule {
     margin-bottom: 1.75rem;
}

.kc-advisory__list {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     gap: 0 2rem;
     margin: 0 0 1.5rem;
     padding: 0;
     list-style: none;
}

.kc-advisory__list a {
     border: 0;
     color: var(--kc-mid);
     font-size: 0.76rem;
     letter-spacing: 0.16em;
     text-transform: uppercase;
}

.kc-advisory__list a:hover {
     color: var(--kc-teal-text);
}

.kc-advisory__note {
     max-width: 46rem;
     margin: 0 auto 1.1rem;
     color: var(--kc-muted);
     font-size: 0.78rem;
     font-style: italic;
     line-height: 1.7;
}

.kc-advisory__mark {
     font-style: normal;
}

.kc-advisory__legal {
     margin: 0;
     color: var(--kc-muted);
     font-size: 0.75rem;
     letter-spacing: 0.18em;
     text-transform: uppercase;
}

.kc-advisory__legal a {
     border: 0;
     color: var(--kc-muted);
}

.kc-advisory__legal a:hover {
     color: var(--kc-teal-text);
}

/*--------------------------------------------------
     responsive
--------------------------------------------------*/

@media ( max-width: 767.98px ) {

     body {
          font-size: 18px;
     }

     .kc-table {
          padding: 0;
     }

     .kc-sheet {
          padding: 2.5rem 1.5rem 2rem;
          box-shadow: none;
     }

     .kc-postnav .nav-links {
          grid-template-columns: 1fr;
          gap: 1.25rem;
     }

     .kc-postnav .nav-next {
          text-align: left;
     }

     /*
          A leader that has to hold a wrapped two-line title alongside a date gets ugly fast, so on
          a phone the line stacks: name, then dots, then the date on its own row.
     */
     .kc-line {
          flex-wrap: wrap;
     }

     .kc-line__name {
          flex: 1 1 100%;
     }

     .kc-line__leader {
          min-width: 1rem;
          margin-left: 0;
     }

     .kc-line--rating .kc-line__name {
          flex: 0 1 auto;
     }

     .alignleft,
     .alignright {
          float: none;
          margin: 1.5em auto;
     }

     .gallery {
          grid-template-columns: repeat(2, 1fr) !important;
     }
}

/*--------------------------------------------------
     motion and print
--------------------------------------------------*/

@media ( prefers-reduced-motion: reduce ) {

     *,
     *::before,
     *::after {
          animation-duration: 0.01ms !important;
          transition-duration: 0.01ms !important;
     }
}

@media print {

     body {
          background: #fff;
          font-size: 11pt;
     }

     .kc-table {
          padding: 0;
     }

     .kc-sheet {
          max-width: none;
          padding: 0;
          box-shadow: none;
     }

     .kc-courses,
     .kc-postnav,
     .kc-pagination,
     .kc-comments {
          display: none;
     }
}