/*
Theme Name: Kiernan Milling
Theme URI: http://kiernanmilling.ie
Author: AMW Creative
Author URI: https://amw.ie
Description: Lightweight replacement for the Porton theme. Plain HTML/CSS, no page builder or slider. Runs on PHP 7.4 and 8.x.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: kiernan-milling
*/

/* ==========================================================================
   Tokens — taken from the live Porton header (Oct 2026)
   ========================================================================== */
:root {
	--km-blue: #0055a4;
	--km-blue-60: rgba(0, 85, 164, 0.6);
	--km-yellow: #fcc200;
	--km-text: #333333;
	--km-menu-text: #444444;
	--km-sub-bg: #111111;
	--km-sub-text: #cccccc;
	--km-mob-bg: #383838;
	--km-mob-sub-bg: #444444;
	--km-mob-sub2-bg: #4f4f4f;
	--km-mob-border: #4c4c4c;
	--km-mob-text: #dddddd;
	--km-font: Calibri, Carlito, "Segoe UI", Arial, sans-serif;
	--km-container: 1170px;
	--km-nav-h: 100px;
	--km-panel-w: 280px;
	--km-admin-bar: var(--wp-admin--admin-bar--height, 0px);
}

/* ==========================================================================
   Base
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html { font-size: 14px; -webkit-text-size-adjust: 100%; } /* old theme root size; some page HTML uses rem */

body {
	margin: 0;
	background: #fff;
	color: var(--km-text);
	font-family: var(--km-font);
	font-size: 17px;
	line-height: 1.86;
	overflow-x: hidden; /* as the old theme: full-width rows never cause sideways scrolling */
}

img { max-width: 100%; height: auto; }

a { color: var(--km-blue); text-decoration: none; }
a:hover { text-decoration: underline; }

.km-container {
	width: 100%;
	max-width: calc(var(--km-container) + 30px);
	margin: 0 auto;
	padding: 0 15px;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.km-skip-link:focus {
	position: fixed; top: 10px; left: 10px; z-index: 100000;
	width: auto; height: auto; clip: auto;
	padding: 10px 16px; background: #fff; color: var(--km-blue);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.km-icon { width: 1em; height: 1em; fill: currentColor; flex: none; }

#km-page { position: relative; }

/* ==========================================================================
   Header — shared
   ========================================================================== */
.km-header {
	position: relative;
	z-index: 999;
	background: #fff;
}

.km-header ul { list-style: none; margin: 0; padding: 0; }

/* ==========================================================================
   Header — desktop (1200px and up)
   The old theme switched at 992px, which made the 10-item menu wrap onto two
   rows between 992 and 1199px. The desktop header now starts at 1200px.
   ========================================================================== */
.km-topbar,
.km-navbar { display: none; }

@media (min-width: 1200px) {
	.km-topbar,
	.km-navbar { display: block; }
	.km-mobilebar { display: none; }
}

/* Top bar: email, phone, search, social */
.km-topbar {
	padding: 18px 0;
	background: #fff;
}

.km-topbar__inner {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 20px;
	min-height: 41px;
}

.km-topbar__info {
	display: flex;
	align-items: center;
	font-size: 13px;
	line-height: 39px;
	letter-spacing: 0.85px;
}

.km-topbar__info li {
	display: flex;
	align-items: center;
	height: 39px;
	padding-right: 40px;
}

.km-topbar__info a {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--km-blue);
}

.km-topbar__info .km-icon { font-size: 22px; }

.km-search {
	position: relative;
	display: flex;
	margin: 0;
}

.km-search input[type="search"] {
	width: 233px;
	height: 41px;
	padding: 0 41px 0 20px;
	border: 1px solid var(--km-blue);
	border-radius: 0;
	background: #fff;
	color: #888;
	font: 17px/39px var(--km-font);
	-webkit-appearance: none;
	appearance: none;
}

.km-search input[type="search"]::placeholder { color: #888; opacity: 1; }
.km-search input[type="search"]:focus { outline: 2px solid var(--km-blue); outline-offset: -2px; color: var(--km-text); }

.km-search button {
	position: absolute;
	top: 0; right: 0;
	width: 41px; height: 41px;
	display: grid; place-items: center;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--km-text);
	font-size: 15px;
	cursor: pointer;
}

.km-social {
	display: flex;
	align-items: center;
}

/* Matches the old social widget's 198px box with the icons centred in it */
.km-topbar .km-social {
	width: 198px;
	justify-content: center;
}

.km-social a {
	display: grid;
	place-items: center;
	width: 24px;
	height: 24px;
	margin: 5px;
	border-radius: 50%;
	background: #fff;
	color: var(--km-blue);
	font-size: 16px;
	transition: opacity 0.3s;
}

.km-social a:hover { opacity: 0.7; text-decoration: none; }

/* Nav bar: logo + menu */
.km-navbar {
	position: relative;
	z-index: 999;
	height: calc(var(--km-nav-h) + 1px);
	border-top: 1px solid rgba(0, 0, 0, 0.05);
	background: #fff;
}

.km-navbar__inner {
	position: relative;
	display: flex;
	align-items: stretch;
	justify-content: flex-end;
	height: var(--km-nav-h);
}

.km-logo {
	position: absolute;
	top: 16px;
	left: 15px;
	display: block;
	line-height: 0;
}

.km-logo img { width: 120px; height: auto; }

/* Desktop menu */
.km-menu {
	display: flex;
	align-items: stretch;
	height: var(--km-nav-h);
}

.km-menu > li {
	position: relative;
	display: flex;
	align-items: center;
	padding-left: 5px;
}

/* The old theme used 40px, which pushed "Home" underneath the logo.
   18px at 1200px wide, growing to 24px at 1600px+, keeps all 10 items (in Montserrat) on one row and clear of it. */
.km-menu > li + li { margin-left: clamp(18px, 1.5vw, 24px); }

.km-menu > li { flex-shrink: 0; }

/* Never let the menu slide under the logo */
.km-nav { margin-left: 145px; }

.km-menu > li > a {
	display: inline-flex;
	align-items: center;
	height: 100%;
	color: var(--km-blue);
	font-family: Montserrat, Arial, sans-serif;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	line-height: 1;
	white-space: nowrap;
	text-decoration: none;
}

/* Down-arrow after top-level items that have a dropdown */
.km-menu > li.menu-item-has-children > a::after {
	content: "";
	width: 6px;
	height: 6px;
	margin: -3px 0 0 6px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
}

/* Toggle buttons are for mobile and keyboard users; hidden on desktop hover menus */
.km-menu .km-subtoggle { display: none; }

/* Dropdowns */
.km-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 1000;
	width: max-content;
	min-width: 210px;
	padding: 10px 0;
	background: var(--km-sub-bg);
	border-bottom: 2px solid var(--km-blue);
	box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.15);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s linear 0.2s;
}

.km-menu .sub-menu .sub-menu {
	top: -10px;
	left: 100%;
}

/* Dropdowns of the last two menu items open leftwards so they never run off the screen */
.km-menu > li:nth-last-child(-n+2) > .sub-menu { left: auto; right: 0; }

/* Flip third-level menus left when they would run off the right edge (set by nav.js) */
.km-menu li.km-flip > .sub-menu { left: auto; right: 100%; }

.km-menu li:hover > .sub-menu,
.km-menu li:focus-within > .sub-menu,
.km-menu li.km-open > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s;
}

.km-menu .sub-menu li { position: relative; }

.km-menu .sub-menu a {
	display: block;
	padding: 0 20px;
	color: var(--km-sub-text);
	font-family: Montserrat, Arial, sans-serif;
	font-size: 13px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	white-space: nowrap;
	transition: background 0.3s ease-out, color 0.3s ease-out;
}

.km-menu .sub-menu li.menu-item-has-children > a { padding-right: 40px; }

.km-menu .sub-menu li:hover > a,
.km-menu .sub-menu li:focus-within > a,
.km-menu .sub-menu a:focus,
.km-menu .sub-menu .current-menu-item > a {
	background: var(--km-blue-60);
	color: #fff;
	text-decoration: none;
}

/* Right-arrow on submenu items that open a further level */
.km-menu .sub-menu li.menu-item-has-children > a::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 20px;
	width: 6px;
	height: 6px;
	margin-top: -3px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(-45deg);
}

/* "#" parent links (Dairy Feeds, Pig Feeds…) are labels, not pages */
.km-menu a[href="#"] { cursor: default; }

/* ==========================================================================
   Header — mobile / tablet (below 1200px)
   ========================================================================== */
.km-mobilebar {
	background: #fff;
}

.km-mobilebar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 92px;
}

.km-mobilebar .km-logo {
	position: static;
	padding: 15px 0;
}

.km-mobilebar .km-logo img { width: 90px; }

.km-burger {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	margin-right: -10px;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
}

.km-burger__lines,
.km-burger__lines::before,
.km-burger__lines::after {
	display: block;
	width: 24px;
	height: 2px;
	background: #000;
	transition: transform 0.25s ease, background 0.25s ease;
}

.km-burger__lines { position: relative; }

.km-burger__lines::before,
.km-burger__lines::after {
	content: "";
	position: absolute;
	left: 0;
}

.km-burger__lines::before { top: -8px; }
.km-burger__lines::after { top: 8px; }

.km-menu-open .km-burger__lines { background: transparent; }
.km-menu-open .km-burger__lines::before { transform: translateY(8px) rotate(45deg); }
.km-menu-open .km-burger__lines::after { transform: translateY(-8px) rotate(-45deg); }

/* Fly-out panel */
.km-panel {
	position: fixed;
	top: var(--km-admin-bar);
	bottom: 0;
	left: 0;
	z-index: 100002;
	width: var(--km-panel-w);
	overflow-y: auto;
	overscroll-behavior: contain;
	background: var(--km-mob-bg);
	visibility: hidden;
	transform: translateX(-100%);
	transition: transform 0.3s ease, visibility 0s linear 0.3s;
}

.km-menu-open .km-panel {
	visibility: visible;
	transform: none;
	transition: transform 0.3s ease, visibility 0s;
}

/* The old theme pushed the whole page sideways, which widened the page and made
   phones zoom out. The panel now slides over the page, with a shade behind it. */
.km-menu-open { overflow: hidden; }

/* Tap anywhere on the page to close */
.km-panel-shade {
	position: fixed;
	inset: 0;
	z-index: 100001;
	display: none;
	padding: 0;
	border: 0;
	background: rgba(0, 0, 0, 0.25);
	cursor: pointer;
}

.km-menu-open .km-panel-shade { display: block; }

@media (min-width: 1200px) {
	.km-panel,
	.km-panel-shade { display: none !important; }
	.km-menu-open { overflow: auto; }
}

.km-panel__search {
	position: relative;
	margin: 0;
	padding: 15px;
}

.km-panel__search input[type="search"] {
	width: 100%;
	height: 44px;
	padding: 12px 44px 12px 12px;
	border: 0;
	border-radius: 0;
	background: #333;
	color: #fff;
	font: 17px/20px var(--km-font);
	-webkit-appearance: none;
	appearance: none;
}

.km-panel__search input[type="search"]::placeholder { color: #888; opacity: 1; }

.km-panel__search button {
	position: absolute;
	top: 15px;
	right: 15px;
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	padding: 0;
	border: 0;
	background: transparent;
	color: #888;
	font-size: 15px;
	cursor: pointer;
}

.km-panel ul { list-style: none; margin: 0; padding: 0; }

.km-panel .km-menu-mobile > li { border-bottom: 1px solid var(--km-mob-border); }
.km-panel .km-menu-mobile > li:first-child { border-top: 1px solid var(--km-mob-border); }

.km-panel li {
	position: relative;
}

.km-panel a {
	display: block;
	padding: 14px 54px 14px 15px;
	color: #fff;
	font-family: Montserrat, Arial, sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 27.9px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
}

.km-panel .current-menu-item > a { color: #6aa9e9; }

.km-panel .sub-menu {
	display: none;
	background: var(--km-mob-sub-bg);
}

.km-panel .sub-menu .sub-menu { background: var(--km-mob-sub2-bg); }

.km-panel li.km-open > .sub-menu { display: block; }

.km-panel .sub-menu li { border-top: 1px solid rgba(255, 255, 255, 0.06); }

.km-panel .sub-menu a {
	padding-left: 25px;
	color: var(--km-mob-text);
	font-size: 13px;
	font-weight: 500;
	line-height: 26px;
}

.km-panel .sub-menu .sub-menu a { padding-left: 40px; }

/* Arrow button that opens a submenu */
.km-panel .km-subtoggle {
	position: absolute;
	top: 0;
	right: 0;
	width: 54px;
	height: 56px;
	display: grid;
	place-items: center;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--km-mob-text);
	cursor: pointer;
}

.km-panel .sub-menu .km-subtoggle { height: 54px; }

.km-panel .km-subtoggle::before {
	content: "";
	width: 8px;
	height: 8px;
	margin-top: -4px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.2s ease, margin 0.2s ease;
}

.km-panel li.km-open > .km-subtoggle::before {
	margin-top: 4px;
	transform: rotate(-135deg);
}

/* ==========================================================================
   Focus styles
   ========================================================================== */
.km-header a:focus-visible,
.km-header button:focus-visible,
.km-panel a:focus-visible,
.km-panel button:focus-visible,
.km-panel input:focus-visible {
	outline: 2px solid var(--km-yellow);
	outline-offset: -2px;
}

/* ==========================================================================
   Homepage hero — replaces the Slider Revolution video slider
   Measured from the live slider at 1440px: 868px tall, panel 717px wide.
   ========================================================================== */
/* A small gap between the logo and the hero on desktop (phones already have one) */
@media (min-width: 1200px) {
	.km-hero { margin-top: 20px; }
}

.km-hero {
	position: relative;
	display: flex;
	align-items: flex-start;
	height: clamp(420px, 61vw, 880px);
	overflow: hidden;
	background: #1d2a1a;
}

.km-hero__video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.km-hero__inner {
	position: relative;
	z-index: 1;
	padding-top: clamp(16px, 11vw, 160px);
}

.km-hero__panel {
	width: 100%;
	max-width: 717px;
	margin-left: 8px;
	padding: 33px 40px 40px;
	border-radius: 10px;
	background: rgba(210, 210, 210, 0.72);
}

.km-hero__kicker {
	margin: 0 0 18px;
	color: #fff;
	font-size: 20px;
	font-weight: 700;
	line-height: 22px;
	letter-spacing: 0;
	text-transform: uppercase;
}

.km-hero__title {
	margin: 0 0 20px;
	font-family: "Times New Roman", Times, serif;
	font-size: 60px;
	font-weight: 400;
	line-height: 52px;
	letter-spacing: 0;
	text-transform: uppercase;
}

.km-hero__kiernan { color: #ffcc00; }
.km-hero__milling { color: #fff; }

.km-hero__text {
	margin: 0 0 22px;
	color: #333;
	font-size: 18px;
	line-height: 30px;
	letter-spacing: 0;
}

.km-hero__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 16px 37px;
}

.km-btn {
	display: inline-block;
	padding: 15px 35px;
	border-radius: 10px;
	font-family: Montserrat, Arial, sans-serif;
	font-size: 15px;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: 0;
	text-transform: uppercase;
	text-decoration: none;
	transition: filter 0.2s ease;
}

.km-btn:hover { filter: brightness(1.1); text-decoration: none; }
.km-btn:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

.km-btn--blue { background: var(--km-blue); color: #fff; }
.km-btn--yellow { background: #ffd302; color: #144da4; }

@media (max-width: 767px) {
	.km-hero { height: auto; min-height: 420px; }
	.km-hero__inner { padding-top: 16px; padding-bottom: 24px; }
	.km-hero__panel { margin-left: 0; padding: 22px 20px 24px; }
	.km-hero__kicker { font-size: 16px; margin-bottom: 12px; }
	.km-hero__title { font-size: 40px; line-height: 40px; margin-bottom: 14px; }
	.km-hero__text { font-size: 16px; line-height: 26px; }
}

/* ==========================================================================
   Content area (page conversions come next)
   ========================================================================== */
.km-main { min-height: 40vh; overflow-x: clip; }

.km-entry { display: flow-root; padding-bottom: 50px; }

/* Home page: rows run the full width of the window, as in the old theme;
   rows set to "container" keep the normal content width. */
.km-entry--home { max-width: none; padding-left: 0; padding-right: 0; }
.km-entry--home .km-row-container { max-width: calc(var(--km-container) + 30px); margin: 0 auto; padding: 0 15px; }

/* Typography inside page content — measured from Porton */
.km-entry { font-size: 17px; line-height: 1.86; }
.km-entry p { margin: 0 0 10px; }
.km-entry h1, .km-entry h2, .km-entry h3, .km-entry h4, .km-entry h6 { font-family: Montserrat, Arial, sans-serif; color: var(--km-blue); letter-spacing: 0; }
.km-entry h1 { font-size: 80px; font-weight: 700; line-height: 1.1; margin: 20px 0 10px; }
.km-entry h2 { font-size: 50px; font-weight: 700; line-height: 1.1; margin: 20px 0 10px; }
.km-entry h3 { font-size: 40px; font-weight: 400; line-height: 1.1; margin: 20px 0 10px; }
.km-entry h4 { font-size: 24px; font-weight: 400; line-height: 1.1; margin: 10px 0; }
.km-entry h5 { font-family: Arial, Helvetica, sans-serif; font-size: 18px; font-weight: 400; line-height: 1.1; margin: 10px 0; color: var(--km-blue); }
.km-entry h6 { font-size: 18px; font-weight: 400; line-height: 1.1; margin: 10px 0; }
.km-entry ul, .km-entry ol { margin: 0 0 10px; padding: 0 0 0 40px; }
.km-entry a { color: var(--km-blue); }
.km-entry blockquote { margin: 0 0 20px; padding: 10px 20px; font-size: 17.5px; }
.km-entry table { width: 100%; margin: 0 0 30px; border: 1px solid #f5f5f5; border-collapse: collapse; }
.km-entry th { font-weight: 700; }
.km-entry table > tbody > tr > td,
.km-entry table > tbody > tr > th {
	font-size: 14px;
	line-height: 1.2;
	padding: 19px 30px;
	border-top: 1px solid #f5f5f5;
	letter-spacing: 0.05em;
	vertical-align: middle;
}
.km-entry table > thead > tr > th {
	font-family: Montserrat, sans-serif;
	text-transform: uppercase;
	background-color: #0055a4;
	border-top: 0;
	color: #fff;
	font-weight: 400;
	vertical-align: bottom;
}
.km-entry hr { margin: 20px 0; border: 0; border-top: 1px solid #ddd; }
.km-entry img { height: auto; }
/* Same image alignment margins as the old theme */
.km-entry .alignnone { margin: 15px 15px 0 0; }
.km-entry .aligncenter { display: block; margin: 15px auto; clear: both; }
.km-entry .alignleft { float: left; margin: 15px 15px 15px 0; }
.km-entry .alignright { float: right; margin: 15px 0 15px 15px; }
.km-entry a img.alignleft { margin: 15px 15px 0 0; }
.km-entry a img.alignright { margin: 15px 0 0 15px; }
.km-entry a img.alignnone { margin: 15px 15px 0 0; }
.km-entry a img.aligncenter { margin-left: auto; margin-right: auto; }
.km-entry .wp-caption.alignnone,
.km-entry .wp-caption.alignleft { margin: 15px 15px 30px 0; }
.km-entry .wp-caption.alignright { margin: 15px 0 30px 15px; }

/* The old theme kept the same heading sizes on phones, so there is no smaller mobile size here. */

/* Rows and columns (replace WPBakery's vc_row / vc_col-sm-*) */
.km-row {
	display: flex;
	flex-wrap: wrap;
	margin-left: -15px;
	margin-right: -15px;
}

.km-row::after { content: ""; display: table; clear: both; }

.km-row--middle { align-items: center; }
.km-row--bottom { align-items: flex-end; }
.km-row--equal > .km-col { display: flex; flex-direction: column; }
.km-col__inner { flex: 1 1 auto; }

/* Full-width background rows */
.km-row--full {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding-left: calc(50vw - 50% - 15px);
	padding-right: calc(50vw - 50% - 15px);
}

/* Column gaps (WPBakery's "gap" setting) */
.km-row--gap-1 { margin-left: -15.5px; margin-right: -15.5px; }
.km-row--gap-1 > .km-col { padding: 0.5px 15.5px; }
.km-row--gap-2 { margin-left: -16px; margin-right: -16px; }
.km-row--gap-2 > .km-col { padding: 1px 16px; }
.km-row--gap-3 { margin-left: -16.5px; margin-right: -16.5px; }
.km-row--gap-3 > .km-col { padding: 1.5px 16.5px; }
.km-row--gap-4 { margin-left: -17px; margin-right: -17px; }
.km-row--gap-4 > .km-col { padding: 2px 17px; }
.km-row--gap-5 { margin-left: -17.5px; margin-right: -17.5px; }
.km-row--gap-5 > .km-col { padding: 2.5px 17.5px; }
.km-row--gap-10 { margin-left: -20px; margin-right: -20px; }
.km-row--gap-10 > .km-col { padding: 5px 20px; }
.km-row--gap-15 { margin-left: -22.5px; margin-right: -22.5px; }
.km-row--gap-15 > .km-col { padding: 7.5px 22.5px; }
.km-row--gap-20 { margin-left: -25px; margin-right: -25px; }
.km-row--gap-20 > .km-col { padding: 10px 25px; }
.km-row--gap-25 { margin-left: -27.5px; margin-right: -27.5px; }
.km-row--gap-25 > .km-col { padding: 12.5px 27.5px; }
.km-row--gap-30 { margin-left: -30px; margin-right: -30px; }
.km-row--gap-30 > .km-col { padding: 15px 30px; }
.km-row--gap-35 { margin-left: -32.5px; margin-right: -32.5px; }
.km-row--gap-35 > .km-col { padding: 17.5px 32.5px; }

.km-col {
	position: relative;
	width: 100%;
	min-height: 1px;
	padding-left: 15px;
	padding-right: 15px;
}

@media (min-width: 768px) {
	.km-col-1 { width: 8.3333%; }
	.km-col-2 { width: 16.6667%; }
	.km-col-3 { width: 25%; }
	.km-col-4 { width: 33.3333%; }
	.km-col-5 { width: 41.6667%; }
	.km-col-6 { width: 50%; }
	.km-col-7 { width: 58.3333%; }
	.km-col-8 { width: 66.6667%; }
	.km-col-9 { width: 75%; }
	.km-col-10 { width: 83.3333%; }
	.km-col-11 { width: 91.6667%; }
	.km-col-12 { width: 100%; }
}

/* Content blocks. Text blocks had no bottom margin on this site, and (as in
   WPBakery) the last element inside a block loses its bottom margin. */
.km-block { margin-bottom: 0; }
.km-block :last-child { margin-bottom: 0; }

/* Form fields inside page content (Contact Form 7 and similar), matching the old theme */
.km-entry input,
.km-entry button,
.km-entry select,
.km-entry textarea { margin: 0; color: inherit; font: inherit; line-height: inherit; outline: none; }
.km-entry label { display: inline-block; max-width: 100%; margin-bottom: 5px; font-weight: 700; }
.km-entry textarea { overflow: auto; }
.km-entry input[type="text"],
.km-entry input[type="search"],
.km-entry input[type="email"],
.km-entry input[type="url"],
.km-entry input[type="password"],
.km-entry input[type="tel"],
.km-entry input[type="number"],
.km-entry textarea,
.km-entry select {
	padding: 0 20px;
	color: #888;
	background-color: #fff;
	border: 1px solid #f2f2f2;
	border-radius: 0;
	transition: 0.5s;
}
.km-entry input[type="text"]:focus,
.km-entry input[type="search"]:focus,
.km-entry input[type="email"]:focus,
.km-entry input[type="url"]:focus,
.km-entry input[type="password"]:focus,
.km-entry input[type="tel"]:focus,
.km-entry input[type="number"]:focus,
.km-entry textarea:focus,
.km-entry select:focus { border-color: var(--km-blue); }
.km-entry input[type="submit"] {
	min-width: 170px;
	padding: 16px 20px;
	border: 0;
	border-bottom: 2px solid rgba(0, 0, 0, 0.2);
	border-radius: 0;
	background-color: var(--km-blue);
	color: #fff;
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	line-height: 1.2;
	letter-spacing: 0.1em;
	text-align: center;
	text-transform: uppercase;
	cursor: pointer;
	appearance: none;
	transition: 0.3s;
}
.km-entry input[type="submit"]:hover { background-color: #000; color: #fff; }

/* The old theme removed WPBakery's 35px element margin; only buttons kept one */
.km-image,
.km-video,
.km-carousel { margin-bottom: 0; }
.km-btn-wrap { margin-bottom: 21.74px; }

.km-image { margin-top: 0; margin-left: 0; margin-right: 0; line-height: 0; }
.km-image--center { text-align: center; }
.km-image--right { text-align: right; }
.km-image img { display: inline-block; max-width: 100%; }
.km-image--rounded img { border-radius: 4px; }

.km-space { display: block; }

.km-video { position: relative; width: 100%; aspect-ratio: 16 / 9; }
.km-video--43 { aspect-ratio: 4 / 3; }
.km-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.km-map { margin-bottom: 0; }
.km-map iframe { display: block; width: 100%; border: 0; }

.km-carousel {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(220px, 1fr);
	gap: 10px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
}

.km-carousel img { width: 100%; height: auto; scroll-snap-align: start; }

/* Buttons carried over from WPBakery */
.km-vcbtn {
	display: inline-block;
	padding: 14px 20px;
	border: 0;
	border-radius: 5px;
	background: var(--km-blue);
	color: #fff !important;
	font-size: 14px;
	line-height: normal;
	text-decoration: none !important;
	transition: filter 0.2s;
}

.km-vcbtn:hover { filter: brightness(0.9); }
.km-vcbtn--sm { padding: 11px 16px; font-size: 12px; }
.km-vcbtn--lg { padding: 18px 25px; font-size: 18px; }
.km-vcbtn--round { border-radius: 2em; }
.km-vcbtn--square { border-radius: 0; }
.km-vcbtn--grey { background: #ebebeb; color: #666 !important; }

/* The older WPBakery button (plain grey) */
.km-oldbtn {
	display: inline-block;
	margin: 5px 0;
	padding: 4px 10px;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 2px;
	background: #f7f7f7;
	color: #333 !important;
	font-size: 13px;
	line-height: 18px;
	text-decoration: none !important;
}
.km-oldbtn:hover { background: #ebebeb; }

.km-entry .km-sep { height: 0; margin: 0 0 1px; border: 0; border-top: 1px solid #ebebeb; }

/* Site-specific classes carried over from the Porton child theme */
@media (min-width: 992px) {
	.gapbox { margin-top: 0; margin-bottom: 50px; }
	.hbbtn1 .km-vcbtn { border-radius: 5px; padding: 10px 20px; font-size: 16px; font-family: var(--km-font); background-image: none !important; }
	.hbbtn1 .km-vcbtn:hover { background-color: #444 !important; color: #fff !important; filter: none; }
}

/* ==========================================================================
   Footer
   ========================================================================== */
/* Footer: blue band with three centred columns and a copyright strip */
.km-footer {
	background: #0055a5;
	color: #fff;
	font-size: 16px;
	line-height: 1.75;
	text-align: center;
}

.km-footer a { color: #fff; text-decoration: none; }
.km-footer a:hover { text-decoration: underline; }

/* Three equal, centred columns with thin dividers */
.km-footer__inner {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: stretch; /* equal-height dividers; each column centres its own content */
	max-width: 1000px;
	padding-top: 45px;
	padding-bottom: 45px;
}

.km-footer__col {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 5px 30px;
}
.km-footer__col + .km-footer__col { border-left: 1px solid rgba(255, 255, 255, 0.35); }

.km-footer__col--logo img {
	display: block;
	width: 160px;
	height: auto;
	margin: 0 auto;
}

.km-footer__title {
	margin: 0 0 12px;
	color: #ffd302;
	font-family: Montserrat, Arial, sans-serif;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.km-footer p { margin: 0 0 8px; }

.km-footer__label { color: #ffd302; }

.km-footer .km-social { justify-content: center; margin: 12px 0 0; padding: 0; list-style: none; }
.km-footer .km-social a { background: #fff; color: var(--km-blue); padding: 4px 0; }

.km-footer__links {
	list-style: none;
	margin: 0;
	padding: 0;
}

.km-footer__links li + li { margin-top: 6px; }

.km-footer__links a { color: #fff; }
.km-footer__links a:hover { color: #ffd302; }

.km-footer__bottom {
	padding: 14px 0;
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	background: #004a90;
	color: rgba(255, 255, 255, 0.8);
	font-size: 13px;
	line-height: 1.5;
}

.km-footer__bottom-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 6px 20px;
	max-width: 1000px;
}

.km-footer__bottom a { color: #fff; font-weight: 700; }
.km-footer__bottom a:hover { color: #ffd302; }

@media (max-width: 767px) {
	.km-footer__bottom-inner { flex-direction: column; align-items: center; }
	.km-footer__inner {
		grid-template-columns: 1fr;
		max-width: 360px;
		padding-top: 30px;
		padding-bottom: 20px;
	}
	.km-footer__col { padding: 22px 0; }
	.km-footer__col + .km-footer__col {
		border-left: 0;
		border-top: 1px solid rgba(255, 255, 255, 0.35);
	}
	.km-footer__col--logo { padding-top: 0; }
	.km-footer__col--logo img { width: 130px; }
}

/* ==========================================================================
   Page title band (blue strip with breadcrumbs) — matches Porton
   ========================================================================== */
.km-pagetitle {
	margin: 0 0 25px;
	padding: 0;
	border-top: 1px solid #f3f3f3;
	border-bottom: 1px solid #f3f3f3;
	background: var(--km-blue);
}

.km-pagetitle__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 30px;
	min-height: 164px;
}

.km-pagetitle h1 {
	margin: 0 0 5px;
	color: #fff;
	font-family: Montserrat, Arial, sans-serif;
	font-size: 24px;
	font-weight: 500;
	line-height: 28.8px;
	letter-spacing: 0;
	text-transform: uppercase;
}

.km-breadcrumbs ol {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin: 0;
	padding: 0;
	color: #ffd302;
	font-size: 14px;
	line-height: 16.8px;
	text-transform: capitalize;
}

.km-breadcrumbs li + li::before {
	content: "\203A";
	margin: 0 8px;
	color: #ffd302;
}

.km-breadcrumbs a { color: #ffd302; }

@media (max-width: 767px) {
	.km-pagetitle__inner { min-height: 110px; padding-top: 20px; padding-bottom: 20px; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition-duration: 0s !important; }
}
