/* Komphi base design — used by sites with theme.base: true (sites moved automatically).
   Everything site-specific comes from content/site.json as CSS variables:
     colours --c-*  (text, heading, link, page, primary, accent, alt, header, header-text, topbar,
                     footer, footer-text, footer-bottom, button, button-bg, button-border)
     fonts   --f-heading, --f-body
     sizes   --s-*  (body, body-lh, body-weight, h1–h4, heading-weight, container, container-pct,
                     button-size, button-weight, button-radius, button-transform, button-spacing, button-border,
                     nav-size, nav-weight, logo-h)
   The defaults below follow Divi's, since most moved sites come from it. site.css (after this) holds a
   site's own touches. */

:root {
  --text: var(--c-text, #666);
  --heading: var(--c-heading, #333);
  --link: var(--c-link, #2ea3f2);
  --accent: var(--c-accent, var(--c-primary, var(--link)));
  --page: var(--c-page, #fff);
  --wrap: var(--s-container, 1080px);
  --wrap-pct: var(--s-container-pct, 80%);
  --gap: 5.5%;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; animation: none !important; } }
body { margin: 0; background: var(--page); color: var(--text); font-family: var(--f-body); font-size: var(--s-body, 14px); font-weight: var(--s-body-weight, 400); line-height: var(--s-body-lh, 1.7); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6 { margin: 0; padding-bottom: 10px; color: var(--heading); font-family: var(--f-heading); font-weight: var(--s-heading-weight, 500); line-height: 1.2; }
h1 { font-size: var(--s-h1, 30px); } h2 { font-size: var(--s-h2, 26px); } h3 { font-size: var(--s-h3, 22px); }
h4 { font-size: var(--s-h4, 18px); } h5 { font-size: 16px; } h6 { font-size: 14px; }
p { margin: 0; padding-bottom: 1em; }
p:last-child { padding-bottom: 0; }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; height: auto; }
figure { margin: 0; }
strong, b { font-weight: 700; }
blockquote { margin: 20px 0; padding-left: 20px; border-left: 5px solid var(--accent); }
.prose ul, .prose ol { margin: 0; padding: 0 0 23px 1.2em; }
.prose li { margin-bottom: .3em; }
.prose ul ul, .prose ol ol { padding-bottom: 0; }
.prose > :last-child { padding-bottom: 0; }
.prose .alignright { float: right; margin: 0 0 1em 1.5em; }
.prose .alignleft { float: left; margin: 0 1.5em 1em 0; }
.prose .aligncenter { display: block; margin: 0 auto 1em; }
.t-center { text-align: center; } .t-right { text-align: right; }
.t-center .block-image, .t-center img { margin-left: auto; margin-right: auto; }

.container { width: var(--wrap-pct); max-width: var(--wrap); margin: 0 auto; }
.visually-hidden, .hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: -999px; top: 0; z-index: 100; background: #fff; color: #000; padding: .5em 1em; }
.skip-link:focus { left: 1em; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* ---------- Header: logo left, menu right (Divi's default) ---------- */
.site-header { position: relative; z-index: 50; background: var(--c-header, #fff); box-shadow: 0 1px 0 rgba(0,0,0,.1); }
.site-header > .container { width: var(--s-header-pct, var(--wrap-pct)); max-width: var(--s-header-max, var(--wrap)); }
.topbar > .container { width: var(--s-topbar-pct, var(--s-header-pct, var(--wrap-pct))); max-width: var(--s-topbar-max, var(--s-header-max, var(--wrap))); }
.topbar { background: var(--c-topbar, #222); color: #fff; font-size: 12px; }
.topbar-inner { display: flex; justify-content: flex-end; align-items: center; gap: 20px; min-height: 32px; }
.topbar a { color: #fff; }
.topbar-text { margin-right: auto; }
.header-inner { display: flex; align-items: center; gap: 30px; min-height: 80px; padding: 16px 0; flex-wrap: wrap; }
.logo { display: block; margin-right: auto; }
.logo img { display: block; height: var(--s-logo-h, 50px); width: auto; max-width: 100%; }
.site-nav > ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 22px; }
.site-nav li { position: relative; }
.site-nav a { display: block; padding: 8px 0; color: var(--c-header-text, rgba(0,0,0,.6)); font-size: var(--s-nav-size, 14px); font-weight: var(--s-nav-weight, 600); }
.site-nav a:hover { opacity: .7; text-decoration: none; }
.site-nav a[aria-current="page"], .site-nav .is-ancestor > a { color: var(--c-nav-active, var(--c-header-text, var(--link))); }
.site-nav .has-children > a { padding-right: 16px; }
.site-nav .has-children > a::after { content: ""; position: absolute; right: 2px; top: 50%; width: 6px; height: 6px; margin-top: -5px; border: solid currentColor; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); }
.sub-menu { list-style: none; margin: 0; padding: 12px 0; position: absolute; left: -20px; top: 100%; width: 240px; background: var(--c-header, #fff); border-top: 3px solid var(--accent); box-shadow: 0 2px 5px rgba(0,0,0,.1); visibility: hidden; opacity: 0; transition: opacity .2s, visibility .2s; z-index: 60; }
.site-nav li:hover > .sub-menu, .site-nav li:focus-within > .sub-menu { visibility: visible; opacity: 1; }
.sub-menu a { padding: 6px 20px; }
.header-social .block-social { display: flex; gap: 8px; list-style: none; margin: 0; padding: 0; }
.menu-toggle { display: none; }
.site-search[hidden] { display: none; }
/* A header that sits on the first section's picture */
.site-header.is-overlay { position: absolute; left: 0; right: 0; background: transparent; box-shadow: none; }

/* ---------- Sections and columns (Divi: section 54px, row 27px, gutter 5.5%) ---------- */
main { display: block; }
.section { position: relative; padding: 54px 0; }
.section--alt { background: var(--c-alt, #f7f7f7); }
.section-heading { text-align: center; margin-bottom: 20px; }
.columns { display: flex; flex-wrap: wrap; gap: 30px var(--gap); align-items: flex-start; }
.columns + .columns { margin-top: 54px; }
.columns--center { align-items: center; }
.columns--gap-none { --gap: 0%; column-gap: 0; }
.columns--gap-narrow { --gap: 3%; }
.columns--wide { --gap: 8%; }
/* A column with its own look: a card, a coloured top edge */
.column--styled { background: var(--col-bg, transparent); padding: var(--col-pad, 0); border-top: var(--col-top, 0); align-self: stretch; }
.column--styled.has-shadow { box-shadow: 0 2px 18px rgba(0,0,0,.18); }
.is-light .column--styled[style*="--col-bg"], .is-light .column--styled[style*="--col-bg"] h1, .is-light .column--styled[style*="--col-bg"] h2, .is-light .column--styled[style*="--col-bg"] h3, .is-light .column--styled[style*="--col-bg"] h4 { color: var(--heading); }
.column--styled[style*="--col-bg"] { color: var(--text); }
.column--styled[style*="--col-bg"] h1, .column--styled[style*="--col-bg"] h2, .column--styled[style*="--col-bg"] h3, .column--styled[style*="--col-bg"] h4 { color: var(--heading); }
.column { min-width: 0; flex: 1 1 0; position: relative; }
.column--1 { flex: 0 0 100%; }
.column--1-2 { flex: 0 0 calc((100% - var(--gap)) / 2); }
.column--1-3 { flex: 0 0 calc((100% - 2 * var(--gap)) / 3); }
.column--2-3 { flex: 0 0 calc((100% - var(--gap)) * 2 / 3); }
.column--1-4 { flex: 0 0 calc((100% - 3 * var(--gap)) / 4); }
.column--3-4 { flex: 0 0 calc((100% - var(--gap)) * 3 / 4); }
.column--1-5 { flex: 0 0 calc((100% - 4 * var(--gap)) / 5); }
.column--2-5 { flex: 0 0 calc((100% - 4 * var(--gap)) / 5 * 2 + var(--gap)); }
.column--3-5 { flex: 0 0 calc((100% - 4 * var(--gap)) / 5 * 3 + 2 * var(--gap)); }
.column--4-5 { flex: 0 0 calc((100% - 4 * var(--gap)) / 5 * 4 + 3 * var(--gap)); }
.column--1-6 { flex: 0 0 calc((100% - 5 * var(--gap)) / 6); }
.column--5-6 { flex: 0 0 calc((100% - 5 * var(--gap)) / 6 * 5 + 4 * var(--gap)); }
.column.column--sized { flex: 0 1 var(--col-w); }
.column > * + * { margin-top: 0; }
.column > :not(:last-child) { margin-bottom: 2.75%; }
.column > .block-html:not(:last-child), .column > .block-image:not(:last-child), .column > .block-blurb:not(:last-child) { margin-bottom: 20px; }

/* Styled sections (background colour or photo, light text, padding, height) */
.section--styled { background-color: var(--sec-bg, transparent); }
.section--styled.has-image { background-image: var(--sec-img); background-size: cover; background-position: var(--sec-pos, center); background-repeat: no-repeat; }
.section--styled.has-image::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,var(--sec-shade, 0)); pointer-events: none; }
.section--styled > .container { position: relative; }
.section--styled[style*="--sec-min"] { min-height: var(--sec-min); display: flex; flex-direction: column; justify-content: center; }
.section--styled[style*="--sec-min"] > .container { width: var(--wrap-pct); }
.section--styled[data-pad="none"] { padding: 0; }
.section--styled[data-pad="small"] { padding: 30px 0; }
.section--styled[data-pad="large"] { padding: 90px 0; }
.section--styled[data-width="full"] > .container { width: 100%; max-width: none; }
.section--styled[data-width="wide"] > .container { width: 90%; max-width: 1400px; }
.section--styled[data-width="narrow"] > .container { max-width: 760px; }
.section--styled[data-align="center"] { text-align: center; }
.is-light, .is-light h1, .is-light h2, .is-light h3, .is-light h4, .is-light h5, .is-light h6 { color: #fff; }
.is-light a:not(.button) { color: #fff; text-decoration: underline; }
.is-light .button--outline { color: #fff; border-color: #fff; }

/* ---------- Blocks ---------- */
.block-image img { display: block; }
.block-image--center { margin-left: auto; margin-right: auto; }
.block-image figcaption { font-size: .9em; padding-top: 6px; }

.button { display: inline-block; padding: .3em 1em; font: inherit; font-size: var(--s-button-size, 20px); font-weight: var(--s-button-weight, 500); line-height: 1.7; text-transform: var(--s-button-transform, none); letter-spacing: var(--s-button-spacing, normal);
  color: var(--c-button, var(--accent)); background: var(--c-button-bg, transparent); border: var(--s-button-border, 2px) solid var(--c-button-border, currentColor); border-radius: var(--s-button-radius, 3px); cursor: pointer; transition: all .3s; }
.button:hover { text-decoration: none; background: rgba(0,0,0,.05); }
.button--outline { background: transparent; }
.button--solid { color: #fff; background: var(--accent); border-color: var(--accent); }
.block-button { padding: 0; margin: 0; }

.block-divider { border: 0; margin: 0; height: 23px; background: linear-gradient(var(--line-c, rgba(0,0,0,.1)), var(--line-c, rgba(0,0,0,.1))) top left / 100% var(--line-w, 1px) no-repeat; }
.block-divider--short { background-size: var(--line-l) var(--line-w, 1px); }
.t-center .block-divider--short, .block-divider--short.t-center { background-position: top center; }
.block-divider.spacer { background: none; }

.block-blurb { display: block; }
.block-blurb img { display: block; margin-bottom: 20px; }
.block-blurb.t-center img { margin-left: auto; margin-right: auto; }
.blurb-title { padding-bottom: 6px; }
.block-blurb--icon { position: relative; padding-left: 1.6em; }
.block-blurb--icon > .icon { position: absolute; left: 0; top: .2em; }

/* Icons (drawn with a mask, in the text colour or the accent) */
.icon { display: inline-block; width: 1em; height: 1em; background: var(--accent); -webkit-mask: var(--i) no-repeat center / contain; mask: var(--i) no-repeat center / contain; vertical-align: -.1em; }
.has-icon::before { content: ""; display: inline-block; width: 1em; height: 1em; margin-right: .5em; background: currentColor; -webkit-mask: var(--i) no-repeat center / contain; mask: var(--i) no-repeat center / contain; vertical-align: -.12em; }
.icon--phone { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1z'/%3E%3C/svg%3E"); }
.icon--mobile { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 24'%3E%3Cpath d='M13 0H3a3 3 0 0 0-3 3v18a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3V3a3 3 0 0 0-3-3zM8 22.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zM13 18H3V3h10z'/%3E%3C/svg%3E"); }
.icon--email { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 4h20v16H2zm2 2v.5l8 5 8-5V6zm16 2.8-8 5-8-5V18h16z'/%3E%3C/svg%3E"); }
.icon--linkedin { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.98 3.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.84-2.05 3.78-2.05C20.6 8.65 21 11.3 21 14.6V21h-4v-5.6c0-1.35-.03-3.08-1.88-3.08-1.88 0-2.17 1.47-2.17 2.98V21H9z'/%3E%3C/svg%3E"); }
.icon--location { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5.3 7 13 7 13s7-7.7 7-13a7 7 0 0 0-7-7zm0 9.5a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E"); }
.icon--clock { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm1 10.6 3.5 2.1-.8 1.3L11 13V6h2z'/%3E%3C/svg%3E"); }
.icon--check { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E"); }
.icon--arrow { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 15-1.4-1.4 2.6-2.6H7v-2h6.2l-2.6-2.6L12 7l5 5z'/%3E%3C/svg%3E"); }

/* Slideshows: pictures, or text (testimonials) */
.slideshow { position: relative; overflow: hidden; }
.slideshow.is-ready .slide { display: none; }
.slideshow.is-ready .slide.is-active { display: block; animation: slide-fade .6s ease; }
@keyframes slide-fade { from { opacity: 0; } to { opacity: 1; } }
.slide { position: relative; }
.slide img { display: block; width: 100%; }
.slides-photo .slide-text { position: absolute; left: 0; right: 0; bottom: 0; padding: 6% 8%; color: #fff; text-align: center; background: linear-gradient(transparent, rgba(0,0,0,.45)); }
.slides-photo .slide-text h2 { color: #fff; }
.slides-text .slide-text { padding: 20px 8% 60px; }
.slides-text .slide-text h4 { font-size: var(--s-h3, 26px); line-height: 1.3; }
.slide-caption { position: absolute; left: 0; right: 0; bottom: 0; padding: 10px 16px; color: #fff; font-size: 13px; text-shadow: 0 1px 3px rgba(0,0,0,.3); }
.slide-arrow { position: absolute; z-index: 3; top: 50%; width: 48px; height: 48px; margin-top: -24px; padding: 0; border: 0; background: none; color: currentColor; cursor: pointer; opacity: 0; transition: all .2s ease-in-out; }
.slide-prev { left: -22px; } .slide-next { right: -22px; }
.slideshow:hover .slide-prev, .slide-prev:focus-visible { left: 0; opacity: 1; }
.slideshow:hover .slide-next, .slide-next:focus-visible { right: 0; opacity: 1; }
.slide-arrow::before { content: ""; position: absolute; top: 15px; width: 18px; height: 18px; border: solid currentColor; border-width: 0 0 2px 2px; transform: rotate(45deg); }
.slide-prev::before { left: 18px; } .slide-next::before { right: 18px; transform: rotate(-135deg); }
.slides-photo .slide-arrow { color: #fff; }
.slide-dots { position: absolute; left: 0; right: 0; bottom: 20px; display: flex; justify-content: center; gap: 10px; }
.slide-dots button { width: 7px; height: 7px; padding: 0; border: 0; border-radius: 50%; background: var(--heading); opacity: .4; cursor: pointer; }
.is-light .slide-dots button { background: #fff; }
.slide-dots button[aria-current="true"] { opacity: 1; }
.slideshow:not(.is-ready) .slide + .slide { margin-top: 20px; }
.slideshow:not(.is-ready) .slide-arrow, .slideshow:not(.is-ready) .slide-dots { display: none; }

/* Logos: a row that wraps */
.block-logos { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 24px 40px; }
.block-logos li { flex: 0 0 auto; }
.block-logos img { display: block; max-height: 70px; width: auto; max-width: 160px; }

/* Logo carousel: one row, --per-view logos at a time */
.block-logos-carousel { position: relative; padding: 0 40px; }
.block-logos.is-carousel { flex-wrap: nowrap; justify-content: flex-start; gap: 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.block-logos.is-carousel::-webkit-scrollbar { display: none; }
.block-logos.is-carousel li { flex: 0 0 calc(100% / var(--per-view, 6)); display: flex; justify-content: center; padding: 10px 15px; scroll-snap-align: start; }
.block-logos.is-carousel img { max-width: 100%; max-height: 60px; }
.logos-arrow { position: absolute; top: 50%; width: 32px; height: 32px; margin-top: -16px; padding: 0; border: 0; background: none; color: var(--c-primary, var(--link)); cursor: pointer; }
.logos-prev { left: 0; } .logos-next { right: 0; }
.block-logos.is-carousel li { min-height: var(--logo-h, 0); align-items: center; }
.block-logos.is-carousel img { width: var(--logo-w, auto); max-height: none; }
.block-logos-carousel:not([style*="--logo-w"]) .block-logos.is-carousel img { max-height: 60px; }
.logos-dots { display: flex; justify-content: center; gap: 8px; padding-top: 10px; }
.logos-dots button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%; background: var(--c-primary, var(--link)); opacity: .3; cursor: pointer; }
.logos-dots button.is-active { opacity: 1; }
.logos-arrow::before { content: ""; position: absolute; top: 9px; width: 12px; height: 12px; border: solid currentColor; border-width: 0 0 2px 2px; transform: rotate(45deg); }
.logos-prev::before { left: 12px; } .logos-next::before { right: 12px; transform: rotate(-135deg); }
@media (max-width: 767px) { .block-logos.is-carousel li { flex-basis: 50%; } }

/* Photo grid (gallery) */
.photo-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.photo-grid img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.photo-pages { display: flex; gap: 8px; justify-content: center; margin-top: 16px; }

/* Videos and embeds */
.video { position: relative; aspect-ratio: 16 / 9; background: #000; }
.video-play { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: pointer; }
.video-play img { width: 100%; height: 100%; object-fit: cover; display: block; }
.video-icon { position: absolute; left: 50%; top: 50%; width: 80px; height: 80px; margin: -40px 0 0 -40px; border-radius: 50%; background: rgba(0,0,0,.4); transition: background .2s; }
.video-icon::after { content: ""; position: absolute; left: 32px; top: 23px; border: 17px solid transparent; border-left: 26px solid #fff; border-right: 0; }
.video-play:hover .video-icon { background: rgba(0,0,0,.65); }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.block-embed iframe { display: block; }

/* Testimonial, tabs, accordion, link lists */
.block-testimonial blockquote { margin: 0 0 12px; border: 0; padding: 0; font-size: 1.15em; font-style: italic; }
.testimonial-name { display: block; }
.testimonial-role { display: block; font-size: .9em; opacity: .8; }
.accordion-item { border: 1px solid #d9d9d9; margin-bottom: 10px; }
.accordion-title { display: block; padding: 14px 20px; font-weight: 600; cursor: pointer; color: var(--heading); }
.accordion-content { padding: 0 20px 16px; }
.tab-list { display: flex; flex-wrap: wrap; border-bottom: 1px solid #d9d9d9; }
.tab-list button { border: 0; background: #f4f4f4; padding: 10px 20px; cursor: pointer; font: inherit; }
.tab-list button[aria-selected="true"] { background: #fff; color: var(--heading); }
.tab-panel { padding: 20px 0; }
.block-nav-list ul { list-style: none; margin: 0; padding: 0; }
.block-nav-list a { display: block; padding: 4px 0; }
.block-nav-list a[aria-current="page"] { font-weight: 700; color: var(--heading); }
.block-social { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.block-social a { display: inline-flex; align-items: center; gap: 6px; }
.block-social svg { width: 18px; height: 18px; fill: currentColor; }

/* ---------- Contact form ---------- */
.contact-form { display: grid; gap: 14px; }
.field label, .field-label { display: block; margin-bottom: 4px; color: var(--heading); font-weight: 500; }
.field input, .field textarea, .field select { width: 100%; padding: 12px 14px; font: inherit; color: #333; background: #fff; border: 1px solid #bbb; border-radius: 2px; }
.is-light .field input, .is-light .field textarea { border-color: transparent; }
.field input:focus, .field textarea:focus { outline: 2px solid var(--accent); outline-offset: 0; border-color: var(--accent); }
.field textarea { min-height: 140px; resize: vertical; }
.field--checkbox label { display: flex; gap: 8px; align-items: flex-start; font-weight: 400; }
.field--checkbox input { width: auto; margin-top: .35em; }
.req { color: #c00; }
.field-count { font-size: .85em; opacity: .7; }
.contact-form .button { justify-self: start; }
.form-status:empty { display: none; }
.form-status.is-success { color: #2e7d32; }
.form-status.is-error { color: #c62828; }

/* ---------- Page title, banner, hero, cards, text with a picture (kit sections) ---------- */
.page-title { padding: 40px 0 10px; }
.banner img { display: block; width: 100%; height: var(--banner-h, 400px); object-fit: cover; }
.hero { position: relative; min-height: 60vh; display: flex; align-items: flex-end; color: #fff; }
.hero-bg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-inner { position: relative; padding: 60px 0; }
.hero-quote { border: 0; padding: 0; margin: 0; font-size: 1.4em; }
.cards { display: grid; gap: 30px; }
.cards--2 { grid-template-columns: repeat(2, 1fr); } .cards--3 { grid-template-columns: repeat(3, 1fr); } .cards--4 { grid-template-columns: repeat(4, 1fr); }
.card-image { display: block; width: 100%; }
.card-body { padding-top: 14px; }
.split { display: flex; gap: var(--gap); align-items: flex-start; }
.split-main { flex: 1 1 0; }
.split-media { flex: 0 0 40%; }
.lead { font-size: 1.15em; }

/* ---------- Blog ---------- */
.blog-layout { display: block; }
.blog-layout--sidebar { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); gap: var(--gap); }
.blog-item { padding-bottom: 40px; }
.blog-item + .blog-item { border-top: 1px solid rgba(0,0,0,.08); padding-top: 30px; }
.blog-item-title { font-size: var(--s-h2, 26px); }
.blog-item-title a { color: var(--heading); }
.post-meta { font-size: .9em; opacity: .8; padding-bottom: 10px; }
.read-more { font-weight: 600; }
.blog-sidebar .widget-title { font-size: 18px; }
.recent-posts { list-style: none; margin: 0; padding: 0; }
.recent-posts li { padding: 4px 0; }
.post-title { font-size: var(--s-h1, 30px); }
.link-list { list-style: none; margin: 0; padding: 0; }
.pagenav { display: flex; gap: 20px; justify-content: space-between; padding-top: 20px; }

/* ---------- Footer ---------- */
.site-footer { background: var(--c-footer, #222); color: var(--c-footer-text, #fff); }
.site-footer a { color: var(--c-footer-text, #fff); }
.footer-nav ul { list-style: none; margin: 0; padding: 30px 0; display: flex; flex-wrap: wrap; gap: 8px 22px; }
.footer-columns { display: flex; flex-wrap: wrap; gap: 30px var(--gap); padding: 40px 0; align-items: center; }
.footer-main { flex: 1 1 400px; }
.footer-main .footer-nav ul { padding: 0 0 10px; }
.footer-aside { flex: 1 1 300px; display: flex; flex-wrap: wrap; gap: 10px 40px; justify-content: flex-end; }
.footer-aside p { padding: 0; }
.footer-copyright { margin: 0; padding: 0; font-size: .85em; opacity: .8; }
.footer-bottom { background: var(--c-footer-bottom, rgba(0,0,0,.32)); padding: 14px 0; font-size: .85em; }
.footer-bottom p { padding: 0; }
.site-footer--aside .footer-copyright { padding-top: 10px; }

/* ---------- Tablets and phones ---------- */
@media (max-width: 980px) {
  .container { width: 80%; }
  .section { padding: 50px 0; }
  .section--styled[data-pad="large"] { padding: 60px 0; }
  .columns { flex-direction: column; gap: 30px; }
  .columns > .column { flex: 1 1 auto; width: 100%; }
  .menu-toggle { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-left: auto; padding: 0; border: 0; background: none; color: var(--c-header-text, #333); cursor: pointer; }
  .menu-toggle-bars, .menu-toggle-bars::before, .menu-toggle-bars::after { display: block; width: 24px; height: 2px; background: currentColor; position: relative; }
  .menu-toggle-bars::before, .menu-toggle-bars::after { content: ""; position: absolute; left: 0; }
  .menu-toggle-bars::before { top: -7px; } .menu-toggle-bars::after { top: 7px; }
  .logo { margin-right: 0; }
  .header-inner { justify-content: space-between; }
  .site-nav { flex: 1 0 100%; display: none; }
  .site-nav.is-open { display: block; }
  .site-nav > ul { flex-direction: column; gap: 0; padding: 10px 0; border-top: 3px solid var(--accent); }
  .site-nav a { padding: 10px 0; }
  .sub-menu { position: static; width: auto; visibility: visible; opacity: 1; box-shadow: none; border: 0; padding: 0 0 0 16px; background: transparent; }
  .site-nav .has-children > a::after { display: none; }
  .blog-layout--sidebar, .split { display: block; }
  .cards--3, .cards--4 { grid-template-columns: repeat(2, 1fr); }
  .footer-aside { justify-content: flex-start; }
}
@media (max-width: 767px) {
  h1 { font-size: min(var(--s-h1, 30px), 44px); }
  h2 { font-size: min(var(--s-h2, 26px), 30px); }
  .cards--2, .cards--3, .cards--4 { grid-template-columns: 1fr; }
  .section--styled[style*="--sec-min"] { min-height: min(var(--sec-min), 70vh); }
}
