/*
 * Site layer on top of the original Honda theme (bootstrap + style.css + main.css + custom.css).
 * The theme styled WordPress plugins (Max Mega Menu, Flickity, WPForms); this file styles our own
 * markup for the same components with the values measured on the old site (1400 px and 375 px).
 * Colours: red #c90000, dark red #a01221, text #333 / #1a1a1a, fields #e0e0e0, labels #969696.
 */

/* ---------- Fonts (self-hosted; the old site loaded Poppins 300/400/600/700 from Google Fonts:
   500 renders as regular, 600 as semibold, 800/900 as bold — keep the same mapping) ---------- */
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 100 500; font-display: swap;
  src: url(/static/honda/fonts/Poppins/PoppinsRegular.woff2) format("woff2"), url(/static/honda/fonts/Poppins/PoppinsRegular.woff) format("woff"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 600; font-display: swap;
  src: url(/static/honda/fonts/Poppins/PoppinsSemiBold.woff2) format("woff2"), url(/static/honda/fonts/Poppins/PoppinsSemiBold.woff) format("woff"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 700 900; font-display: swap;
  src: url(/static/honda/fonts/Poppins/PoppinsBold.woff2) format("woff2"), url(/static/honda/fonts/Poppins/PoppinsBold.woff) format("woff"); }

html { scroll-padding-top: 110px; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

.skip-link.sr-only-focusable:focus { position: fixed; top: 8px; left: 8px; z-index: 2147483647; padding: .5rem 1rem; background: #fff; color: #1a1a1a; box-shadow: 0 2px 12px rgba(0, 0, 0, .3); }

:focus-visible { outline: 2px solid #c90000; outline-offset: 2px; }

/* ---------- Header ---------- */
#honda-wrapper section#header-top-menu { background: #ddd !important; }
header#header.fixed-header { left: 0; right: 0; box-shadow: rgba(0, 0, 0, .25) 0 5px 35px -10px; }
#header-menu { min-height: 60px; }

.site-menu-toggle { display: none; }
.site-menu { list-style: none; margin: 0; padding: 0; }
.site-menu a { color: #333; text-decoration: none; }
.site-submenu { list-style: none; margin: 0; padding: 0; background: #fff; box-shadow: #000 0 5px 30px -15px; }
.site-submenu a { display: block; font-size: 14px; line-height: 35px; padding: 0 10px; white-space: nowrap; }
.site-submenu a:hover, .site-submenu a:focus, .site-submenu .current > a { color: #c90000; }
.submenu-toggle { border: 0; background: none; padding: 0; color: #333; cursor: pointer; }
.submenu-toggle::before { content: "\f078"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 9px; display: inline-block; transition: transform .2s; }
.site-menu-item.open > .submenu-toggle::before { transform: rotate(180deg); }

#main_menu_wrapper .navbar { display: block; }

@media (min-width: 1200px) {
  .site-menu { text-align: right; }
  .site-menu-item { display: inline-block; position: relative; text-align: left; }
  .site-menu-item.mobile-only { display: none; }
  .site-menu-link { display: block; position: relative; font-size: 13px; line-height: 60px; height: 60px; padding: 0 8px; text-transform: uppercase; }
  .site-menu-item.has-children > .site-menu-link { padding-right: 22px; }
  .site-menu-link::before { content: ""; position: absolute; left: 50%; bottom: 0; width: 0; height: 3px; transform: translateX(-50%);
    background: linear-gradient(45deg, #c90000 0%, #74121d 100%); transition: width .2s; }
  .site-menu-item:hover > .site-menu-link::before, .site-menu-link:focus-visible::before, .site-menu-item.current > .site-menu-link::before { width: 100%; }
  .submenu-toggle { position: absolute; top: 0; right: 4px; width: 16px; height: 60px; line-height: 60px; text-align: center; }
  .site-submenu { position: absolute; top: 60px; left: 0; width: 200px; z-index: 999; visibility: hidden; opacity: 0; transform: translateY(10px);
    transition: opacity .2s, transform .2s, visibility 0s .2s; }
  .site-menu-item:hover > .site-submenu, .site-menu-item:focus-within > .site-submenu, .site-menu-item.open > .site-submenu {
    visibility: visible; opacity: 1; transform: none; transition: opacity .2s, transform .2s; }
}

@media (max-width: 1199.98px) {
  #header-menu .row { min-height: 58px; }
  #main_menu_wrapper { position: static; }
  .wess-logo img { max-width: 152px; height: auto; }
  .site-menu-toggle { display: block; position: absolute; top: 0; right: 15px; width: 44px; height: 58px; border: 0; background: none; padding: 0; z-index: 2; cursor: pointer; }
  .site-menu-toggle-bars, .site-menu-toggle-bars::before, .site-menu-toggle-bars::after { position: absolute; right: 10px; width: 18px; height: 2px; background: #333; border-radius: 1px; content: ""; }
  .site-menu-toggle-bars { top: 28px; }
  .site-menu-toggle-bars::before { top: -6px; right: 0; }
  .site-menu-toggle-bars::after { top: 6px; right: 0; }
  .site-menu-toggle[aria-expanded="true"] .site-menu-toggle-bars { width: 22px; height: 22px; top: 18px; background: #555; border-radius: 50%; }
  .site-menu-toggle[aria-expanded="true"] .site-menu-toggle-bars::before,
  .site-menu-toggle[aria-expanded="true"] .site-menu-toggle-bars::after { top: 10px; right: 5px; width: 12px; background: #fff; transform: rotate(45deg); }
  .site-menu-toggle[aria-expanded="true"] .site-menu-toggle-bars::after { transform: rotate(-45deg); }
  .site-menu { display: none; padding-bottom: .5rem; }
  .site-menu.open { display: block; }
  .fixed-header .site-menu.open { max-height: calc(100vh - 120px); overflow-y: auto; }
  .site-menu-item { position: relative; }
  .site-menu-link { display: block; font-size: 13px; line-height: 40px; text-transform: uppercase; padding-right: 48px; }
  .site-menu-item.current > .site-menu-link { color: #c90000; }
  .submenu-toggle { position: absolute; top: 0; right: 0; width: 44px; height: 40px; }
  .submenu-toggle::before { font-size: 11px; }
  .site-submenu { display: none; margin-bottom: .5rem; }
  .site-menu-item.open > .site-submenu { display: block; }
}

/* ---------- Banner slider ---------- */
.wess-banner { position: relative; overflow: hidden; }
.wess-banner-track { display: flex; }
.wess-banner-track > .carousel-cell { flex: 0 0 100%; max-width: 100%; }
.wess-banner.is-ready .wess-banner-track { transition: transform .6s ease; }
@media (prefers-reduced-motion: reduce) { .wess-banner.is-ready .wess-banner-track { transition: none; } }
.wess-banner-dots { position: absolute; left: 0; right: 0; bottom: 40px; text-align: center; line-height: 1; z-index: 2; }
.wess-banner-dots button { width: 10px; height: 10px; margin: 0 8px; padding: 0; border: 0; border-radius: 50%; background: #fff; opacity: .25; cursor: pointer; }
.wess-banner-dots button[aria-current="true"] { background: #a01221; opacity: 1; }
.wess-banner-nav { position: absolute; top: 50%; z-index: 2; width: 44px; height: 44px; margin-top: -22px; border: 0; border-radius: 50%;
  background: rgba(255, 255, 255, .85); color: #333; opacity: 0; transition: opacity .2s; cursor: pointer; }
.wess-banner-nav.prev { left: 16px; }
.wess-banner-nav.next { right: 16px; }
.wess-banner:hover .wess-banner-nav, .wess-banner-nav:focus-visible { opacity: 1; }
@media (max-width: 991.98px) {
  .wess-banner-dots { bottom: 10px; }
  .wess-banner-nav { display: none; }
}

/* ---------- Horizontal scrollers (promotion carousels) ---------- */
.wess-scroller { position: relative; flex: 0 0 100%; max-width: 100%; }
.wess-scroller [data-scroller] { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; flex-wrap: nowrap; }
.wess-scroller [data-scroller]::-webkit-scrollbar { display: none; }
.wess-scroller [data-scroller] > * { scroll-snap-align: start; }
/* The theme draws edge shades on the carousel itself; inside a scroll container they would scroll away. */
.wess-scroller > .wess-normal-carousel::before, .wess-scroller > .wess-normal-carousel::after { content: none; }
.wess-scroller:has(> .wess-normal-carousel)::before, .wess-scroller:has(> .wess-normal-carousel)::after {
  content: ""; position: absolute; top: 0; bottom: 0; z-index: 1; pointer-events: none; }
.wess-scroller:has(> .wess-normal-carousel)::before { left: 0; width: 8%; background: linear-gradient(to right, rgba(0, 0, 0, .8), rgba(0, 0, 0, 0)); }
.wess-scroller:has(> .wess-normal-carousel)::after { right: 0; width: 10%; background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, .8)); }
.wess-scroller-nav { display: none; position: absolute; top: 50%; z-index: 2; width: 40px; height: 40px; margin-top: -20px; border: 0; border-radius: 50%;
  background: #fff; color: #333; box-shadow: 0 2px 10px rgba(0, 0, 0, .2); cursor: pointer; }
.wess-scroller.is-scrollable .wess-scroller-nav { display: block; }
.wess-scroller-nav.prev { left: 10px; }
.wess-scroller-nav.next { right: 10px; }
.wess-scroller-nav:disabled { opacity: .3; cursor: default; }
/* "Citas akcijas": the old site showed 780x480 thumbnails with narrow gutters; the imported images are 1000x500. */
#deals_carousel > .carousel-cell { padding-left: 7.5px; padding-right: 7.5px; }
#deals_carousel .deal-container img { aspect-ratio: 780 / 480; height: auto; object-fit: cover; }

/* ---------- Service tabs (#honda-serviss). The theme's .carousel-small forces every pane visible and
   relied on the old flickity script: tabs from 992 px, a swipe carousel below (the theme hides the tab nav there). ---------- */
@media (min-width: 992px) {
  .tab-content > .carousel-small { width: auto; margin: 0; border: 0; }
  .tab-content > .carousel-small:not(.active) { display: none !important; }
}
@media (max-width: 991.98px) {
  /* Cards keep their own height; site.js sizes the track to the centred card. */
  .tab-content:has(> .carousel-small) { display: flex; align-items: flex-start; gap: 15px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: thin; padding-bottom: .5rem; }
  .tab-content > .carousel-small { flex: 0 0 75%; margin: 0; opacity: 1; scroll-snap-align: center; }
}
@media (max-width: 767.98px) {
  .tab-content > .carousel-small { flex-basis: 85%; }
}

/* ---------- Detailing categories (.services-category-section). The theme hides .display-cards below
   1200 px in favour of a swiper slider that no longer exists, and an old configurator rule gives
   #interior/#exterior a viewport height (fixed overlay on phones) that clipped the service cards. ---------- */
:is(#interior, #exterior).services-cards { position: static; inset: auto; height: auto; }
/* The cards are tab panes here; the theme's ".tab-pane ul li" line height did not apply on the old site. */
.services-category-section .services-cards.tab-pane .services-item li { line-height: inherit; }
/* The theme styles the category buttons as <button>; here they are tab links. */
.services-category-section .category-item .item-content .more-button {
  display: inline-flex; align-items: center; justify-content: center; align-self: center; height: 50px; min-width: 300px; padding: 0 2rem;
  border: 2px solid #fff; background-color: transparent; color: #fff; font-family: "PoppinsBold", "Roboto"; font-size: 16px; line-height: 1.21;
  text-decoration: none; transition: color .15s ease-in-out, background-color .15s ease-in-out; }
.services-category-section .category-item.active-card .more-button, .services-category-section .category-item:hover .more-button,
.services-category-section .category-item .item-content .more-button:focus { background-color: #fff; color: #000; }
@media (max-width: 1199.98px) {
  .services-category-section .display-cards { display: block; }
  .display-cards > .row:first-child { flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; padding-bottom: .5rem; }
  .display-cards > .row:first-child > [class*="col-"] { flex: 0 0 50%; max-width: 50%; scroll-snap-align: start; }
}
@media (max-width: 767.98px) {
  .display-cards > .row:first-child > [class*="col-"] { flex-basis: 85%; max-width: 85%; }
  .services-category-section .category-item .item-content .more-button { min-width: 0; width: 100%; }
}

/* ---------- Lead forms (replace WPForms; same look) ---------- */
.lead-form { position: relative; }
.lead-form fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.lf-hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.lf-title { font-size: 1.5rem; font-weight: 700; margin-bottom: 1rem; }
.lf-description { margin-bottom: 1rem; }
.lf-heading { margin-bottom: 1.5rem; font-size: 1.25rem; font-weight: 700; }
.lf-progress { display: flex; gap: .5rem; margin: 0 0 1.5rem; padding: 0; list-style: none; counter-reset: lf; font-size: .75rem; color: #969696; }
.lf-progress li { flex: 1; padding-top: .5rem; border-top: 3px solid #e0e0e0; counter-increment: lf; }
.lf-progress li::before { content: counter(lf) ". "; }
.lf-progress li.active { color: #1a1a1a; border-color: #c90000; font-weight: 600; }
.lf-progress li.done { border-color: #74121d; }
.lead-form.has-heading .lf-progress { display: none; }
.lf-step-title { font-size: 1rem; font-weight: 700; margin-bottom: 1rem; }
.js .lf-step:not(.active) { display: none; }

.lf-field { margin-bottom: 1.5rem; }
.lf-field[hidden] { display: none; }
/* Old WPForms "one-half" layout: paired fields share a row above 600 px. */
.lf-fields { display: flex; flex-wrap: wrap; justify-content: space-between; }
.lf-fields > .lf-field { flex: 0 0 100%; max-width: 100%; }
@media (min-width: 601px) { .lf-fields > .lf-half { flex-basis: 48.5%; max-width: 48.5%; } }
.lf-label, .lf-field legend.lf-label { display: block; width: auto; margin-bottom: .5rem; padding: 0; color: #969696; font-size: .8rem; line-height: 1.5; }
.lf-req { color: #c90000; }
.lead-form .form-control { height: auto; padding: .375rem .75rem; font-size: 1rem; line-height: 1.5; color: #495057; background-color: #e0e0e0; border: 0 !important; border-radius: 4px !important; box-shadow: none; }
.lead-form input.form-control, .lead-form select.form-control:not([size]):not([multiple]) { height: 40px; }
.lead-form select.form-control { font-size: 1.05rem; }
.lead-form .form-control:focus { color: #1a1a1a; background-color: #e0e0e0; box-shadow: 0 0 0 2px rgba(201, 0, 0, .35); }
.lead-form textarea.form-control { min-height: 100px; }
.lead-form .form-control-file { font-size: .875rem; }

/* Floating labels (old WPForms "label_animation"): the label sits inside an empty field and moves
   onto its top edge on focus or once filled; select labels stay on the edge, as a select is never blank. */
.lf-float :is(.lf-text, .lf-email, .lf-tel, .lf-textarea, .lf-select) { position: relative; }
.lf-float :is(.lf-text, .lf-email, .lf-tel, .lf-textarea, .lf-select) > .lf-label { position: absolute; top: 10px; left: 12px; z-index: 2; margin: 0; pointer-events: none; transition: top .2s, left .2s, font-size .2s; }
.lf-float .lf-select > .lf-label,
.lf-float :is(.lf-text, .lf-email, .lf-tel, .lf-textarea):focus-within > .lf-label,
.lf-float :is(.lf-text, .lf-email, .lf-tel, .lf-textarea):has(> .form-control:not(:placeholder-shown)) > .lf-label { top: -8px; left: 8px; font-size: 10px; line-height: 15px; color: #333; }
.lead-form .lf-float textarea.form-control { min-height: 60px; height: 60px; }
@media (prefers-reduced-motion: reduce) { .lf-float .lf-label { transition: none; } }

/* "We will call you" box above the consent checkbox (marker data-note). */
.lf-fields > .lf-callout { flex: 0 0 100%; margin-bottom: 1.5rem; }
.lf-callout .cta-icon { margin: 0; font-weight: 700; background-image: url(/static/honda/images/phone-black.png); }

/* radios and checkboxes: theme circles with a red dot */
.lead-form .custom-control { display: inline-block; position: relative; min-height: 1rem; margin: 0 1.5rem .5rem 0; padding-left: 1.5rem; }
.lead-form .lf-consent .custom-control { display: block; margin-right: 0; }
.lead-form .custom-control-input { position: absolute; left: 0; top: 0; width: 1rem; height: 1rem; opacity: 0; z-index: -1; }
.lead-form .custom-control-label { position: relative; margin: 0; font-size: .9rem; line-height: 1.25rem; cursor: pointer; color: #1a1a1a; }
.lead-form .custom-control-label::before { content: ""; position: absolute; top: .125rem; left: -1.5rem; width: 1rem; height: 1rem; border: 1px solid #333; border-radius: 100%; background: #fff; box-shadow: none; }
.lead-form .custom-checkbox .custom-control-label::before { border-radius: 2px; }
.lead-form .custom-control-label::after { content: ""; position: absolute; top: .375rem; left: -1.25rem; width: .5rem; height: .5rem; border-radius: 100%; background: none; }
.lead-form .custom-checkbox .custom-control-label::after { border-radius: 1px; }
.lead-form .custom-control-input:checked ~ .custom-control-label::before { border-color: #333; background: #fff; }
.lead-form .custom-control-input:checked ~ .custom-control-label::after { background: #c90000; }
.lead-form .custom-control-input:focus-visible ~ .custom-control-label::before { box-shadow: 0 0 0 2px rgba(201, 0, 0, .35); }
.lead-form .lf-consent .custom-control-label { font-size: .75rem; color: #969696; }
.lead-form .lf-consent a { color: inherit; text-decoration: underline; }

/* service type chooser rendered as tabs (old "service-type-form": li 25 %, text indented 3rem) */
.lf-tabs fieldset { display: flex; flex-wrap: wrap; }
.lf-tabs .custom-control { width: 25%; margin: 0 0 -1px; padding: 0; border-bottom: 1px solid #333; text-align: left; }
.lf-tabs .custom-control-label { display: block; padding: 1rem 0 1rem 3rem; font-size: 14px; }
.lf-tabs .custom-control-label::before, .lf-tabs .custom-control-label::after { display: none; }
.lf-tabs .custom-control-input:checked ~ .custom-control-label { box-shadow: inset 0 -4px 0 #c90000; }
.lf-tabs .custom-control-input:focus-visible ~ .custom-control-label { outline: 2px solid #c90000; outline-offset: -2px; }
.lf-tabs legend.lf-label { margin-bottom: 1rem; }

.lf-note { margin: -.5rem 0 1.5rem; }
.lf-note-title { margin: 0; font-weight: 700; }
.popup .lead-form p.lf-note-title { font-size: 80%; }
/* custom.css paints list markers white for the red contacts block; keep them red on the white form card. */
#cta_form .tab-pane .lead-form .lf-note ul.styled-list li::before { background: #c90000; left: 0; }
.lf-note ul { margin: 0; }

.lf-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: .5rem; }
.lead-form .lf-actions .btn-primary { display: inline-flex; justify-content: center; width: 250px !important; max-width: 100%; min-width: 0; padding: .75rem; font-size: 14px; font-weight: 700; line-height: 1rem;
  color: #fff; background: #000; border: 2px solid #000; border-radius: 4px; text-transform: none; }
.lead-form .lf-actions .btn-primary:hover, .lead-form .lf-actions .btn-primary:focus { background: #c90000; border-color: #c90000; }
.lead-form .lf-actions .btn-outline-secondary { width: auto !important; min-width: 0; padding: .75rem 0; font-weight: 700; color: #000; background: none; border: 0; }
.lead-form .lf-actions .btn-outline-secondary:hover { color: #c90000; }
.lead-form.is-sending .lf-actions button[type="submit"] { opacity: .6; cursor: progress; }

.lf-invalid .form-control, .lf-invalid .custom-control-label::before { box-shadow: 0 0 0 1px red; }
.lf-error { display: block; margin-top: .25rem; color: red; font-size: .75rem; }
.lf-status:empty { display: none; }
.lf-status { margin-top: 1rem; padding: .75rem 1rem; border-radius: 4px; font-size: .9rem; }
.lf-status.is-error { background: #fdecea; color: #a01221; }
.lf-status.is-pending { background: #f1f1f1; color: #333; }
.lf-status.is-success { background: #e6f4ec; color: #0b5d34; font-size: 1rem; }
.lead-form.is-done .lf-progress, .lead-form.is-done .lf-step { display: none; }

@media (max-width: 575.98px) {
  .lf-tabs .custom-control { width: 33.33%; text-align: center; }
  .lf-tabs .custom-control-label { padding: .75rem .25rem; font-size: .85rem; }
  .lead-form .lf-actions .btn-primary { width: 100% !important; }
}

/* form cards: red "SERVISS" tab with an arrow (old .cta-form-wrapper a.active) */
.cta-form-wrapper .nav-link.active, #contact-us #ctaform .nav-link.active { position: relative; color: #fff; background-color: #c90000; font-weight: 700; border: 0; border-radius: 0; }
.cta-form-wrapper .nav-link.active::before { content: ""; position: absolute; left: 50%; bottom: -12px; transform: translateX(-50%); width: 0; height: 0;
  border-left: 12px solid transparent; border-right: 12px solid transparent; border-top: 12px solid #c90000; }
.cta-form-wrapper .nav-tabs { border-bottom: 0; }
.cta-form-wrapper .nav-tabs .nav-item { flex: 1; }

/* ---------- Floating widget + service popup ---------- */
#wess_widgets .wess-widget { padding: 0; border: 0; background-color: transparent; color: inherit; font: inherit; text-align: left; }
#wess_widgets .wess-widget.widget-1, #wess_widgets .wess-widget.widget-1.mobile-active { bottom: 0; z-index: auto; }
#wess_widgets .wess-widget:focus-visible > span { opacity: 1; visibility: visible; width: 200px; }

#wess_widgets_popup[hidden] { display: none; }
#wess_widgets_popup.is-open { display: block; z-index: 2147483647; }
#wess_widgets_popup.is-open .popup { opacity: 1; transform: translate(-50%, -50%); overflow-y: auto; overscroll-behavior: contain; }
#wess_widgets_popup .closePopup { display: block; width: 100%; padding: 0 .25rem; border: 0; background: none; line-height: 1.5; }
body.popup-open { overflow: hidden; }
@media (max-width: 767.98px) {
  #wess_widgets_popup .popup { width: 94%; max-height: 92%; }
}

/* ---------- Footer accordion (mobile) ---------- */
#footer-menu .widget-title { position: relative; }
.toggle-footer-menu { cursor: pointer; }
@media (max-width: 767.98px) {
  #footer-menu .widget.open > div { display: block; }
}

/* ---------- Cookie consent (layout of the old CookieYes banner) and embeds waiting for it ---------- */
.cookie-consent { position: fixed; left: 40px; bottom: 40px; z-index: 2147483646; width: 440px; max-height: calc(100vh - 80px); overflow-y: auto;
  padding: 24px 26px; border-radius: 6px; background: #fff; color: #212121; box-shadow: 0 0 18px rgba(0, 0, 0, .2); font-size: 14px; line-height: 1.7; }
.cookie-consent[hidden] { display: none; }
.cookie-consent .cookie-consent-title { margin: 0 0 12px; font-size: 18px; line-height: 1.4; text-transform: none; }
.cookie-consent p { margin: 0 0 12px; }
.cookie-consent a, .cookie-modal a { color: inherit; text-decoration: underline; }
.cookie-consent-actions { display: flex; flex-wrap: wrap; gap: 8px; }
/* The theme gives every .btn min-width: 200px and white text. */
.cookie-consent-actions .btn, .cookie-modal-actions .btn { flex: 1 1 auto; min-width: 0; padding: 8px 12px; font-size: 14px; font-weight: 600; }
.cookie-modal { width: 845px; max-width: calc(100% - 40px); max-height: calc(100% - 80px); padding: 0; border: 0; border-radius: 6px; background: #fff; color: #212121;
  font-size: 14px; line-height: 1.7; box-shadow: 0 0 18px rgba(0, 0, 0, .2); }
.cookie-modal[open] { display: flex; flex-direction: column; }
/* Bootstrap 4.0 reboot sets dialog { display: block }, which would show the closed dialog. */
.cookie-modal:not([open]) { display: none; }
.cookie-modal::backdrop { background: rgba(0, 0, 0, .4); }
.cookie-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 24px; border-bottom: 1px solid #f4f4f4; }
.cookie-modal .cookie-modal-title { margin: 0; font-size: 18px; line-height: 1.4; text-transform: none; }
.cookie-modal-close { flex: none; width: 32px; height: 32px; padding: 0; border: 0; background: none; color: #757575; font-size: 16px; cursor: pointer; }
.cookie-modal-body { flex: 1 1 auto; min-height: 0; padding: 12px 24px; overflow-y: auto; overscroll-behavior: contain; }
.cookie-modal-body p { margin: 0 0 8px; }
.cookie-modal-more { margin-bottom: 12px; padding: 0; border: 0; background: none; color: #005baa; text-decoration: underline; cursor: pointer; }
.cookie-pref { padding-top: 12px; border-top: 1px solid #f4f4f4; }
.cookie-pref-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
/* The theme sets h3 { font-size: 1.5rem !important }. */
.cookie-modal .cookie-pref-head h3 { margin: 0; font-size: 16px !important; line-height: 1.5; text-transform: none; }
.cookie-pref-toggle { display: flex; align-items: center; gap: 14px; padding: 0; border: 0; background: none; color: inherit; font-weight: 700; text-align: left; cursor: pointer; }
.cookie-pref-toggle .fas { width: 8px; font-size: 10px; transition: transform .2s; }
.cookie-pref-toggle[aria-expanded="true"] .fas { transform: rotate(90deg); }
.cookie-pref-always { color: #008000; font-weight: 600; white-space: nowrap; }
.cookie-modal .cookie-pref-text { margin: 8px 0 12px 22px; }
.cookie-pref-list { margin: 0 0 16px 22px; padding: 12px 10px; border-radius: 6px; background: #f4f4f4; font-size: 12px; }
.cookie-modal .cookie-pref-list p { margin: 0; }
.cookie-pref-list dl { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 4px 8px; margin: 0; }
.cookie-pref-list dl + dl { margin-top: 10px; padding-top: 10px; border-top: 1px solid #e0e0e0; }
.cookie-pref-list dt { font-weight: 600; }
.cookie-pref-list dd { margin: 0; overflow-wrap: anywhere; }
.cookie-switch { position: relative; flex: none; width: 44px; height: 24px; margin: 0; border-radius: 12px; background: #d0d5d2; cursor: pointer;
  -webkit-appearance: none; appearance: none; transition: background-color .2s; }
.cookie-switch::before { content: ''; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; border-radius: 50%; background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .2); transition: transform .2s; }
.cookie-switch:checked { background: #c90000; }
.cookie-switch:checked::before { transform: translateX(20px); }
.cookie-modal-actions { display: flex; gap: 12px; padding: 18px 24px; border-top: 1px solid #f4f4f4; }
.cookie-modal-actions .btn { flex: 1 1 0; padding: 10px 12px; }
.cookie-settings-link { margin-left: .75rem; padding: 0; border: 0; background: none; color: #969696; text-decoration: underline; cursor: pointer; }
html:not(.js) .cookie-settings-link { display: none; }
.cookie-consent-revisit { position: fixed; left: 20px; bottom: 20px; z-index: 9999999; display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: #005baa; color: #fff; font-size: 24px; cursor: pointer; box-shadow: 0 1px 5px rgba(0, 0, 0, .2); }
.cookie-consent-revisit[hidden], body.popup-open .cookie-consent-revisit { display: none; }
.cookie-consent-revisit-label { position: absolute; left: calc(100% + 8px); padding: 4px 8px; border-radius: 3px; background: #46435f; color: #fff;
  font-size: 12px; line-height: 1.5; white-space: nowrap; visibility: hidden; pointer-events: none; }
.cookie-consent-revisit:hover .cookie-consent-revisit-label, .cookie-consent-revisit:focus-visible .cookie-consent-revisit-label { visibility: visible; }
.cookie-consent-revisit:focus-visible, .cookie-modal-close:focus-visible, .cookie-modal-more:focus-visible, .cookie-pref-toggle:focus-visible,
.cookie-switch:focus-visible { outline: 2px solid #005baa; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  .cookie-pref-toggle .fas, .cookie-switch, .cookie-switch::before { transition: none; }
}
@media (max-width: 575.98px) {
  .cookie-consent { left: 10px; right: 10px; bottom: 10px; width: auto; max-height: calc(100vh - 20px); padding: 18px; }
  /* The floating service button would cover the banner's buttons. */
  body.cookie-consent-open #wess_widgets { display: none; }
  .cookie-modal { max-width: calc(100% - 20px); max-height: calc(100% - 20px); }
  .cookie-modal-head, .cookie-modal-body { padding-left: 16px; padding-right: 16px; }
  .cookie-modal-actions { flex-direction: column; gap: 8px; padding: 12px 16px; }
  .cookie-modal-actions .btn { flex: none; }
  .cookie-modal .cookie-pref-text, .cookie-pref-list { margin-left: 0; }
}

.consent-embed { position: relative; }
.consent-embed-note { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1.5rem;
  background: #ececec; text-align: center; }
.consent-embed-note p { max-width: 420px; }
.consent-embed.is-loaded .consent-embed-note { display: none; }
html:not(.js) .consent-embed-note .btn { display: none; }

/* ---------- Images, galleries and videos inserted by the page editor ---------- */
.wess-img { max-width: 100%; height: auto; }
.wess-img-left { float: left; margin: .25rem 1.5rem 1rem 0; }
.wess-img-right { float: right; margin: .25rem 0 1rem 1.5rem; }
.wess-img-center { display: block; margin: 0 auto 1rem; }
.wess-img-s { width: 25%; }
.wess-img-m { width: 50%; }
.wess-img-l { width: 75%; }
.wess-img-full { width: 100%; }
/* A floated image must not hang into the next section. */
.container:has(.wess-img-left, .wess-img-right)::after { content: ""; display: table; clear: both; }
.wess-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; margin: 0 0 1.5rem; clear: both; }
.wess-gallery .wess-img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.wess-video { max-width: 860px; margin: 0 auto 1.5rem; clear: both; }
.wess-video iframe { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; }
@media (max-width: 575.98px) {
  .wess-img-left, .wess-img-right { float: none; display: block; margin: 0 auto 1rem; }
  .wess-img-s, .wess-img-m, .wess-img-l { width: 100%; }
}

/* ---------- Misc ---------- */
.message-page { padding: 4rem 0; }