/* WordPress glue: legacy (Elementor) pages and core blocks inside the new chrome. */
.kna-legacy{ padding-top:var(--nav-safe) }                 /* fixed nav clearance on non-hero pages */
.wp-site-blocks{ padding:0 }                                /* our sections handle their own spacing */
.wp-site-blocks > *{ margin-block-start:0 }

/* Legacy pages still load the old "Simple Custom CSS" file, whose `.hidden{animation:slideDown…}` (meant for an old popup)
   pushes every Tailwind `hidden` element off-screen, including the desktop nav. Neutralise it outside Elementor content. */
.hidden:not(.elementor .hidden){ animation:none }

/* Global styles now match the prototype (16px/1.5 body; headings inherit line-height and colour). Plain legacy pages
   (privacy policy, cookie policy, 404…) keep the brand's tighter green headings and roomier body text. */
.kna-legacy{ font-size:17px; line-height:1.7 }
.kna-legacy :is(h1,h2,h3,h4,h5,h6){ line-height:1.1; color:var(--wp--preset--color--green-700) }

/* Menus: the current section reads like the hover state (the prototype had no current-page state). */
#nav .nv-link[aria-current="page"]{ color:var(--green-700) }
#nav .nv-link[aria-current="page"]::after{ transform:scaleX(1) }
#nav.over-hero .navpill .nv-link[aria-current="page"]{ color:#fff }
#nav .nv-mlink[aria-current="page"]{ color:var(--green-700); font-weight:600 }
.ft .ft-link[aria-current="page"]{ background-size:100% 1px }

/* Article banners: cards (16:9, top of the card) and the article page (natural shape). See kna_post_thumb()/kna_post_banner(). */
/* The banner artwork is transparent PNG/WebP drawn for the firm's green (#004225, as on the old site): the green is part of the image. */
.kna-thumb{ position:relative; aspect-ratio:16/9; overflow:hidden; border-radius:2px; background:var(--green-700); margin-bottom:22px }
.kna-thumb-img{ display:block; width:100%; height:100%; transition:transform .5s cubic-bezier(.2,.7,.2,1) }
.kna-thumb--cover .kna-thumb-img{ object-fit:cover }
.kna-thumb--contain .kna-thumb-img{ object-fit:contain }
.on-dark .kna-thumb{ background:var(--green-800) }   /* on the green featured card: a shade deeper, so the image keeps its edge */
article:hover > .kna-thumb .kna-thumb-img, article:focus-within > .kna-thumb .kna-thumb-img{ transform:scale(1.025) }
@media (prefers-reduced-motion: reduce){ .kna-thumb-img{ transition:none } article:hover > .kna-thumb .kna-thumb-img{ transform:none } }
.kna-banner{ margin:0 0 36px }
.kna-banner-img{ display:block; width:100%; height:auto; border-radius:2px; background:var(--green-700) }