/*!
Theme Name: CitySecurity
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: citysecurity
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

CitySecurity is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
	font-size: 3.7em;
	margin: 0.67em 0;
	font-weight: 500;
}

/* Grouping content
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
	font-family: 'Clash Display';
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
	border-style: none;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
	display: list-item;
}

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
	display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	color: #404040;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 1rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
	font-family: 'Clash Display';
}
h4 {
	font-size: 28px;
	font-weight: 400;
}

h2 {
	font-size: 45px;
	font-weight: 500;
}
p {
	margin-bottom: 1.5em;
	font-family: 'Montserrat';
	font-size: 17px;
}
span {
		font-family: 'Clash Display';
		font-weight: 400;

}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", courier, monospace;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
background-color: #F2F2F2;
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

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

figure {
	margin: 1em 0;
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/* Links
--------------------------------------------- */
a {
	color: #4169e1;
}
a:hover,
a:focus,
a:active {
	color: #191970;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

/* Override: keep visited links same color as default link color */
a:visited { color: inherit; }


/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	line-height: 1;
	padding: 0.6em 1em 0.4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* ────────────────────────────────────────────────────────────────────────
  GDPR popup
───────────────────────────────────────────────────────────────────────── */


#moove_gdpr_cookie_info_bar.gdpr_infobar_postion_bottom_left:not(.gdpr-full-screen-infobar) {
  border-radius: 0px!important;
  border: 0px #fff!important;
}


#moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content button.mgbutton:first-child  {
      background: linear-gradient(90deg, #F7A600 0%, #CC0D14 100%)!important;
      color: #fff!important;
}


#moove_gdpr_cookie_modal .moove-gdpr-modal-content.moove_gdpr_modal_theme_v1 .moove-gdpr-modal-footer-content .moove-gdpr-button-holder button.mgbutton:first-child {
    background: linear-gradient(90deg, #F7A600 0%, #CC0D14 100%)!important;
      color: #fff!important;
}



/* Navigation
--------------------------------------------- */

  .header-login {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
  }
  .login-mini {
    font-size: 12px;
    line-height: 1;
    color: #0B2540;
    opacity: .8;
    text-transform: lowercase;
    letter-spacing: .02em;
  }
	:root { 
  --container-max: 1400px; 
  --container-pad: 20px;          /* matches .header-inner left/right padding */
  --brand-block: 240px;           /* approximate width of logo area (adjust as needed) */
}

:root { --header-h: 80px; }
:root { --wedge-h: 45px; }             /* default wedge height (desktop) */
@media (max-width: 1024px) { :root { --header-h: 72px; } }
@media (max-width: 600px)  { :root {
  --header-h: 68px; 
    --container-pad: 19px;
    --brand-block: 205px;
    --wedge-h: 31px;                    /* small phones */
} }
@media (max-width: 390px)  { :root {
        --header-h: 60px;
        --container-pad: 23px;
        --brand-block: 188px;
        --wedge-h: 14px;                /* very small phones */
}
}


/* ───────────────────────────────────────────────────────────────────
   1) Base header: solid white with no clipping
   ─────────────────────────────────────────────────────────────────── */
.site-header {
      top: 0px;
      position: sticky;
  width: 100%;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
  background-color: #ffffff;  /* pure white */
  /* We will draw the black border via ::after, so do NOT use border-bottom here */
  z-index: 2001;
  overflow: visible;          /* allow pseudo-elements to show outside */
}

/* Container for your logo + menu + icons */
.header-inner {
  max-width: 1400px;           /* same max‐width as your design */
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 80px;                /* adjust to match your header height */
  padding: 0 20px;             /* left/right spacing */
  box-sizing: border-box;
  position: relative;
  z-index: 1;
  gap: 12px;
}
/* keep logo left and icons right on all breakpoints */
.site-branding { flex: 0 0 auto; }
.header-controls { flex: 1 1 auto; justify-content: flex-end; }


/* Logo styling */
.site-branding .site-logo img {
  display: block;
  width: auto;
      max-height: 65px;
    margin-top: 25px;
}


.site-branding {
  display: block;
}

/* Nav + search + login container */
.header-controls {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}


/* ───────────────────────────────────────────────────────────────────
   2) Primary menu styling (inside the white bar)
   ─────────────────────────────────────────────────────────────────── */
.primary-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 2rem;
}

.primary-menu li a {
  color: #0B2540;              /* navy text */
  text-decoration: none;
  font-weight: 500;
  font-size: 1rem;
  transition: color 0.15s ease;
}
.primary-menu li a:hover {
  color: #A81815;              /* brand‐red on hover */
}

/* ───────────────────────────────────────────────────────────────────
   Dropdown menu styling
   ─────────────────────────────────────────────────────────────────── */
.primary-menu li {
  position: relative;
}

.primary-menu li.menu-item-has-children > a::after {
  content: "";
  display: inline-block;
  margin-left: 6px;
  width: 19px;
  height: 12px;
  background-size: 12px 12px;
  vertical-align: middle;
}

.primary-menu li ul {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: #ffffff;
  list-style: none;
  margin: 0;
  padding: 0.5rem 0;
  min-width: 180px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  z-index: 1000;

}

.primary-menu li ul li {
  width: 100%;
}

.primary-menu li ul li a {
    display: block;
    padding: 0.5rem 1rem;
    color: #0B2540;
    text-decoration: none;
    font-size: 16px;
    border-bottom: 1px solid #adadadff;
}

.primary-menu li ul li a:hover {
  background-color: #F2F4F7;
  color: #A81815;
}

.primary-menu li:hover > ul {
  display: block;
}
.main-navigation ul ul a {
    width: 282px;
}

/* Search dropdown styling */
.header-search {
  position: relative;
}

.header-search .search-dropdown {
  display: none;
  position: absolute;
  top: 120%;
  right: 0;
  background-color: #ffffff;
  padding: 0.75rem 1rem;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  border-radius: 4px;
  min-width: 240px;
  z-index: 1000;
}

/* Ajax Search Lite tweaks inside dropdown */
.header-search .search-dropdown .asl_w { min-width: 320px; }

/* Remove magnifier & extra settings button inside dropdown */
.header-search .search-dropdown .promagnifier,
.header-search .search-dropdown .prosettings { display: none !important; }

/* Wrap */
.header-search .search-dropdown .asl_w,
.header-search .search-dropdown .asl_w_container { background: transparent !important; }

/* Input box container (match header dropdown feel) */
.header-search .search-dropdown .probox {
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(2,20,44,0.10) !important;
  border-radius: 6px !important;
  background: #fff !important;
  box-shadow: none !important;
}

/* Input */
.header-search .search-dropdown .proinput { flex: 1 1 auto !important; }
.header-search .search-dropdown .proinput input {
  width: 100% !important;
  height: 40px !important;
  line-height: 40px !important;
  padding: 0 12px !important;
  border: 0 !important;
  outline: none !important;
  border-radius: 6px !important;
  color: #02142C !important;
  background: #fff !important;
}
/* Force input text color for Ajax Search Lite */
.header-search .search-dropdown input.orig,
.header-search .search-dropdown .proinput input.orig {
  color: #02142C !important;
  background: #fff !important;
}
.header-search .search-dropdown .proinput input::placeholder { color: rgba(2,20,44,0.55) !important; }

/* Close (X) button – subtle */
.header-search .search-dropdown .proclose {
  position: absolute !important;
  top: -8px; right: -8px;
  width: 24px; height: 24px;
  display: grid; place-items: center;
  background: linear-gradient(135deg, #A81815, #F7A600);
  border-radius: 999px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  cursor: pointer;
}
.header-search .search-dropdown .proclose svg polygon { fill: #fff !important; }

/* Results container – same vibe as menu dropdowns */
.wpdreams_asl_results.asl_r {
  background: #fff !important;
  border-radius: 6px !important;
  border: 1px solid rgba(2,20,44,0.10) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.10) !important;
  width: auto !important;
  min-width: 320px !important;
  max-width: 420px !important;
  overflow: hidden !important;
}

/* Results list */
.wpdreams_asl_results.asl_r .results { max-height: 60vh !important; overflow-y: auto !important; }

/* Result items */
.wpdreams_asl_results.asl_r .item { position: relative; padding: 10px 14px !important; }
.wpdreams_asl_results.asl_r .item + .item { border-top: 1px solid rgba(2,20,44,0.06) !important; }

/* Title/link */
.wpdreams_asl_results.asl_r .asl_content h3 { margin: 0 !important; font-size: 0.98rem !important; line-height: 1.35 !important; }
.wpdreams_asl_results.asl_r .asl_content a.asl_res_url { color: #02142C !important; text-decoration: none !important; }
.wpdreams_asl_results.asl_r .asl_content a.asl_res_url:hover { color: #000 !important; }

/* Hover state: soft bg + left gradient accent */
.wpdreams_asl_results.asl_r .item:hover { background: #F2F4F7 !important; }
.wpdreams_asl_results.asl_r .item:hover::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(90deg, #A81815 0%, #F7A600 100%);
}

#ajaxsearchlite1 .probox, div.asl_w .probox {
    height: 39px;
}
div.asl_m .probox .proclose svg {
  margin-top: 17px;
    margin-left: -26px;
    position: unset;
}
div.asl_w {
  box-shadow: none;
}

/* No results */
.wpdreams_asl_results.asl_r .asl_nores_header { color: #02142C !important; font-weight: 600 !important; }


.header-search .search-dropdown form {
  display: flex;
}

.header-search .search-dropdown input[type="search"] {
  flex: 1;
  padding: 0.5rem 0.75rem;
  border: 1px solid #ddd;
  border-radius: 4px 0 0 4px;
  font-size: 0.95rem;
}

.header-search .search-dropdown input[type="submit"] {
  padding: 0.5rem 0.75rem;
  border: 1px solid #ddd;
  border-left: none;
  border-radius: 0 4px 4px 0;
  background-color: #0B2540;
  color: #fff;
  cursor: pointer;
}

.header-search.open .search-dropdown {
  display: block;
}

/* ───────────────────────────────────────────────────────────────────
   3) Search icon (inside white bar)
   ─────────────────────────────────────────────────────────────────── */
.header-search .search-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  transition: opacity 0.15s ease;
}

.header-search .search-link img {
  display: block;
  width: 24px;
  height: 24px;
}

.header-search .search-link:hover {
  opacity: 0.75;
}

/* ───────────────────────────────────────────────────────────────────
   4) “Kliendiportaal” login (inside white bar)
   ─────────────────────────────────────────────────────────────────── */
.header-login .login-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: #0B2540;              /* navy text */
  text-decoration: none;
  font-size: 1rem;
  font-weight: 500;
  transition: color 0.15s ease;
}

.header-login .login-link img {
  display: block;
  width: 24px;
  height: 24px;
}

.header-login .login-link:hover {
  color: #A81815;              /* brand‐red on hover */
}


/* ───────────────────────────────────────────────────────────────────
   5) White slanted “underlay” behind the logo (via ::before)
   This extends the white background down under the logo area.
   ─────────────────────────────────────────────────────────────────── */
.site-header::before {
    content: "";
    position: absolute;
    top: var(--header-h);
    left: 0;

    /* Fixed size for a constant angle */
    height: var(--wedge-h);                 /* depth of the wedge */
    width: 100%;                  /* span the full container */
    background-color: #ffffff;    /* match header color */

    /* Calculate where the logo block ends, so the diagonal starts there */
    --gutter: clamp(0px, (100vw - var(--container-max)) / 2, 100vw);
    --brand-end: calc(var(--gutter) + var(--container-pad) + var(--brand-block));
    --run: 100px;                 /* horizontal run for the diagonal = constant angle */

    /* Shape: left rectangle + diagonal starting at the end of branding */
    clip-path: polygon(0 0, var(--brand-end) 0, max(0px, calc(var(--brand-end) - var(--run))) 100%, 0 100%);
    margin-top: -1px;             /* avoid hairline gap with the navy bar */
    z-index: 0;
}

.site-header::before { will-change: transform; }

  /* Separate underlay used when drawer is open, so the wedge sits below the drawer */
  .header-underlay {
    display: none;
    position: fixed;
    top: var(--header-h);
    left: 0;
    height: var(--wedge-h);
    width: 100%;
    background-color: #ffffff;
    /* Same geometry as header ::before */
    --gutter: clamp(0px, (100vw - var(--container-max)) / 2, 100vw);
    --brand-end: calc(var(--gutter) + var(--container-pad) + var(--brand-block));
    --run: 100px;
    clip-path: polygon(0 0, var(--brand-end) 0, max(0px, calc(var(--brand-end) - var(--run))) 100%, 0 100%);
    z-index: 1000; /* below drawer (1100), above page */
    pointer-events: none;
  }
  .header-underlay { will-change: transform; }
  /* When drawer is open, hide header ::before and use the fixed underlay instead */
  body.drawer-open .site-header::before { display: none; }
  body.drawer-open .header-underlay { display: block; }
/* ───────────────────────────────────────────────────────────────────
   6) Black bottom border “cut” along that same slanted edge (via ::after)
   ─────────────────────────────────────────────────────────────────── */
/* .site-header::after {
    content: "";
    position: absolute;
    top: 80px;
    left: 0;
    width: 350px;
    height: 100%;
    background-color: #000;

    clip-path: polygon(0 0, 100% 0, 100% 100%, 350px 100%, 350px calc(100% - 50px), 0 calc(100% - 20px));

  z-index: -1; 
} */



/* ───────────────────────────────────────────────────────────────────
   Mobile burger + off‑canvas drawer
   ─────────────────────────────────────────────────────────────────── */
.burger-toggle {
  display: none; /* shown via media query */
  width: 44px;
  height: 44px;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0 0 0 4px;
  cursor: pointer;
  position: relative;
}
.burger-toggle span {
  display: block;
  height: 2px;
  margin: 6px 8px;
  background: #02142C;
  transition: transform .2s ease, opacity .2s ease;
}
.burger-toggle.is-open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.burger-toggle.is-open span:nth-child(2) { opacity: 0; }
.burger-toggle.is-open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* Off-canvas drawer: right panel under header */
.mobile-drawer {
  position: fixed;
  top: var(--header-h);
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  background: #ffffff;
  transform: translateX(100%);
  transition: transform .25s ease;
  z-index: 1100;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.mobile-drawer.is-open { transform: translateX(0); }

/* Mobile navigation menu styles */
.mobile-navigation .mobile-menu,
.mobile-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mobile-navigation { padding: 28px 20px 10px; }
.mobile-navigation .mobile-menu > li > a {
  display: block;
  padding: 11px 12px;
  text-decoration: none;
  color: #0B2540;
  font-weight: 600;
  font-size: 22px;
  line-height: 1.2;
  text-align: center;
  border: 0;
}

.menu-item a:visited {
    color: #404040!important;
}
.menu-item a {
    color: #404040!important;
}
#ajaxsearchlite1 .probox, div.asl_w .probox {
    margin: 0;
    height: 40px!important;}
.mobile-navigation ul {

    text-align: center;
}
.mobile-navigation .mobile-menu > li + li > a { margin-top: 6px; }
.mobile-navigation .mobile-menu > li.current-menu-item > a,
.mobile-navigation .mobile-menu > li.current-menu-ancestor > a { color: #A81815; }
/* Drawer extras: language, social, bottommark */
.drawer-extras {
  margin-top: 14px;
  padding: 0 20px 28px;
  display: grid;
  place-items: center;
  gap: 22px;
}
.drawer-lang,
.drawer-social {
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}
.drawer-lang a {
  color: #A81815;
  text-decoration: none;
  font-weight: 600;
  letter-spacing: .02em;
}
.drawer-social a {
  color: #A81815;
  text-decoration: underline;
  font-weight: 500;
}
.drawer-bottommark {
  padding: 10px 0 24px;
  display: grid;
  place-items: center;
}
.drawer-bottommark img {
  width: 160px;
  height: auto;
  display: block;
}
/* dropdowns inside the drawer */


.drawer-backdrop {
  position: fixed;
  left: 0;
  right: 0;
  top: var(--header-h);
  bottom: 0;
  background: rgba(2,20,44,.35);
  z-index: 1090;
  opacity: 0;
  transition: opacity .2s ease;
}
.drawer-backdrop.is-visible {
  opacity: 1;
}
body.drawer-open {
  overflow: hidden;
  touch-action: none;
}


  .login-mini { display: none; }
  .header-login .login-link .label-mobile { display: none; }
  .header-login .login-link .label-desktop { display: inline; }
  @media (max-width: 1024px) {
    .header-login .login-link .label-desktop { display: none; }
    .header-login .login-link .label-mobile { display: inline; }
  }
/* ───────────────────────────────────────────────────────────────────
   7) Responsive tweaks (if you need them)
   ─────────────────────────────────────────────────────────────────── */
@media (max-width: 1024px) {



.mobile-navigation .mobile-menu > li > a {
  padding: 3px 12px;

}

#mobile-menu li.menu-item.menu-item-type-post_type.menu-item-object-teenus {
margin-top: 5px;
    margin-bottom: 5px;
}

  /* .site-header::before {
        top: 69px;
  }  -- REMOVED, now uses variable */
  .header-inner {
    padding: 0 10px;
    flex-direction: row;
    align-items: center;
    height: 72px;
  }
  .primary-menu {
    display: none;   /* hide horizontal menu on tablets */
  }

  .burger-toggle { display: inline-block; }
  .header-controls { gap: 0.75rem; }

  /* Mobile: full-width search dropdown under header */
  .header-search { position: static; }
  .header-search .search-dropdown {
    position: fixed;
    top: var(--header-h);
    left: 0;
    right: 0;
    width: 100%;
    min-width: 0;
    border-radius: 0;
    box-shadow: none;
    border-top: 1px solid rgba(2,20,44,0.10);
    z-index: 1500; /* below header (2001), above drawer (1100) */
  }
  .header-search .search-dropdown .asl_w,
  .header-search .search-dropdown .asl_w_container {
    min-width: 0 !important;
    width: 100% !important;
  }
  .wpdreams_asl_results.asl_r {
    width: 100% !important;
    max-width: none !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-radius: 0 !important;
  }
}

@media (max-width: 600px) {
  .header-inner { height: 68px; padding: 0 12px; }
  .header-controls { gap: 10px; }
  .header-login .login-link img,
  .header-search .search-link img { width: 22px; height: 22px; }

  .site-branding .site-logo img {
    max-height: 54px;
    margin-top: 7px;
  }
  /* .site-header::before {
    height: 31px;
}  -- REMOVED, now uses variable */
  .header-login .login-link {
    font-size: 13px;
  }
}

@media (max-width: 390px) {
    .site-branding .site-logo img {
        max-height: 40px;
        margin-top: 0px;
    }
    /* Remove height override, keep margin tweak only */
    .site-header::before { margin-top: -2px; }
}




        /* ─────────────────────────────────────────────────────────────
           Landingpage Banner Styles (Shortcode)
           ───────────────────────────────────────────────────────────── */
        .landingpage-banner {
            padding: 4rem 2rem;
            box-sizing: border-box;
        }
        .landingpage-banner .container {
            max-width: 1400px;
            width: 100%;
            margin: 0 auto;
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            box-sizing: border-box;
        }
        .landingpage-banner .banner-left,
        .landingpage-banner .banner-right {
            box-sizing: border-box;
        }
        .landingpage-banner .banner-left {
            flex: 1 1 45%;
            color: #FFFFFF;
        }
        .landingpage-banner .banner-left h1 {   
            margin-bottom: 1rem;
            line-height: 1.2;
        }
        .landingpage-banner .banner-left p {
            font-size: 1.125rem;
            margin-bottom: 2rem;
            max-width: 90%;
        }
        .landingpage-banner .banner-buttons {
            display: flex;
            gap: 1rem;
            flex-wrap: wrap;
        }
        .landingpage-banner .banner-buttons a {
            display: inline-block;
            text-decoration: none;
    font-size: 1.2rem;
            line-height: 1;
    padding: 1rem 1.7rem;
            font-weight: 400;
            font-family: 'Clash Display';
            transition: opacity 0.2s ease;
        }
        .landingpage-banner .banner-buttons a.gradient-background {
            color: #FFFFFF;
        }
        .landingpage-banner .banner-buttons a.bordered {
            position: relative;
            color: #FFFFFF;
            background: #02142C;
            border: none;
            z-index: 1;
        }
        .landingpage-banner .banner-buttons a.bordered::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            padding: 2px;
            border-radius: inherit;
            -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
            -webkit-mask-composite: xor;
            mask-composite: exclude;
            z-index: -1;
        }
        .landingpage-banner .banner-buttons a:hover {
            opacity: 0.85;
        }

        .landingpage-banner .banner-right {
            flex: 1 1 50%;
            position: relative;
            min-height: 300px;
            margin-top: 2rem;
        }
        .landingpage-banner .banner-right img {
            width: 100%;
            height: auto;
            display: block;
            border-radius: 8px;
        }

        /* Overlay spots */
        .landingpage-banner .banner-spot {
            position: absolute;
            background-color: #FFFFFF;
            color: #02142C;
            padding: 0.5rem 1rem;
            border-radius: 9999px;
            font-size: 0.95rem;
            font-weight: 700;
            display: flex;
            align-items: center;
            gap: 0.6rem;
            white-space: nowrap;
            box-shadow: 0 6px 18px rgba(0,0,0,0.18);
        }
        .landingpage-banner .banner-spot a { color: #02142C; text-decoration: none; }
        .landingpage-banner .banner-spot a:hover { text-decoration: underline; }

        /* Dot for Satisfaction (left of text) */
        .landingpage-banner .spot-satisfaction::before {
            content: "";
            display: inline-block;
            width: 36px;
            height: 36px;
            border-radius: 50%;        }

        /* Red dot for Year (at the right end) */
        .landingpage-banner .spot-year {
            padding:0.8rem 3.5rem 0.8rem 1rem;
            position: absolute;
        }
        .landingpage-banner .spot-year::after {
            content: "";
            position: absolute;
            right: 0.75rem;
            top: 50%;
            transform: translateY(-50%);
            width: 36px;
            height: 36px;
            border-radius: 50%;
        }

        /* Positioning for year (top right) */
        .landingpage-banner .spot-year {
            top: 1rem;
            right: 1rem;
        }

        /* Positioning for satisfaction (middle left) */
        .landingpage-banner .spot-satisfaction {
            top: 50%;
            left: 1rem;
            transform: translateY(-50%);
        }

        /* Positioning for clients (bottom right) */
        .landingpage-banner .spot-clients {
            bottom: 1rem;
            right: 1rem;
        }

        /* Responsive adjustments */
        @media (max-width: 1024px) {
            .landingpage-banner .banner-left,
            .landingpage-banner .banner-right {
                flex: 1 1 100%;
            }
            .landingpage-banner .banner-right {
                margin-top: 2rem;
            }
            /* Stack and reorder for mobile/tablet: image on top, text below */
            .landingpage-banner .container { 
                flex-direction: column; 
            }
            .landingpage-banner .banner-right { 
                order: 1; 
                margin-top: 0;            /* override previous margin */
                margin-bottom: 2rem;      /* spacing below image */
            }
            .landingpage-banner .banner-left { 
                order: 2; 
            }
            .landingpage-banner .banner-left h1 {
                font-size: 2rem;
            }
        }
        @media (max-width: 600px) {
            .landingpage-banner {
                padding: 2rem 1rem;
            }
            .landingpage-banner .banner-left h1 {
                font-size: 1.75rem;
            }
        }
        @media (max-width: 500px) {
            .landingpage-banner .banner-spot {
                padding: 0.5rem 0.7rem;
                        font-size: 12px;
                gap: 0.4rem;
            }
            .landingpage-banner .banner-spot::before,
            .landingpage-banner .spot-year::after {
                width: 24px;
                height: 24px;
            }
            .landingpage-banner .spot-year {
    padding-right: 2.5rem !important;
}
.landingpage-banner .banner-buttons a {
        padding: 0.8rem 1.5rem;
font-size: 15px;
            
        }    }

/* Posts and pages
--------------------------------------------- */
.sticky {
	display: block;
}

.post,
.page {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/* Comments
--------------------------------------------- */
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

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

.gallery-columns-3 {
	grid-template-columns: repeat(3, 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-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}


@font-face {
    font-family: 'Clash Display';
    src: url('./assets/fonts/ClashDisplay-Bold.woff2') format('woff2'),
        url('./assets/fonts/ClashDisplay-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Clash Display';
    src: url('./assets/fonts/ClashDisplay-Semibold.woff2') format('woff2'),
        url('./assets/fonts/ClashDisplay-Semibold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Clash Display';
    src: url('./assets/fonts/ClashDisplay-Extralight.woff2') format('woff2'),
        url('./assets/fonts/ClashDisplay-Extralight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Clash Display';
    src: url('./assets/fonts/ClashDisplay-Light.woff2') format('woff2'),
        url('./assets/fonts/ClashDisplay-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Clash Display';
    src: url('./assets/fonts/ClashDisplay-Regular.woff2') format('woff2'),
        url('./assets/fonts/ClashDisplay-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Clash Display';
    src: url('./assets/fonts/ClashDisplay-Medium.woff2') format('woff2'),
        url('./assets/fonts/ClashDisplay-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Montserrat';
    src: url('./assets/fonts/Montserrat-Regular.woff2') format('woff2'),
        url('./assets/fonts/Montserrat-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('./assets/fonts/Montserrat-SemiBoldItalic.woff2') format('woff2'),
        url('./assets/fonts/Montserrat-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('./assets/fonts/Montserrat-SemiBold.woff2') format('woff2'),
        url('./assets/fonts/Montserrat-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}




/* BASIC CONTAINERS */


/* ─────────────────────────────────────────────────────────────
   Global Container Styles
   ───────────────────────────────────────────────────────────── */
.container {
    max-width: 1400px;
    width: 100%;
    margin: 0 auto;
    padding: 0 2rem; /* Default horizontal padding */
    box-sizing: border-box;
}

@media (max-width: 1024px) {
    .container {
        padding: 0 5vw;
        width: 95vw; /* On tablets and below, use 95% of viewport width */
    }
}

@media (max-width: 600px) {
    .container {
        padding: 0 5vw;
        width: 95vw; /* On mobiles, also 95% of viewport width */
    }
}




.page-id-247 .entry-title {
	display: none;
	visibility: hidden;
}











/* about us */

/* =====================
   About hero (cloned from teenus-hero)
   ===================== */
.about-title {
  color: #02142C;
  line-height: 1.15;
  word-break: normal;
  overflow-wrap: break-word;
  white-space: normal;
  margin: 0;
}
.about-hero {
  --container-max: 1400px;
  --container-pad: 20px;
  --container-w: min(100vw, var(--container-max));
  --wedge: 64px;
  --notchY: 45%;
  height: clamp(260px, 32vw, 396px);
  position: relative;
  padding-top: 24px;
  overflow: hidden;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  isolation: isolate;
  pointer-events: none;
}
.about-hero__inner { display: block; margin-top: 50px; }
.about-hero__title {
  display: flex; align-items: center; padding: 36px 32px;
  width: calc(0.3 * var(--container-w));
  position: absolute; top: 50%; transform: translateY(-50%);
  left: calc((100vw - var(--container-w)) / 2 + var(--container-pad));
  z-index: 2; pointer-events: auto;
}
.about-hero__image {
  position: absolute; top: 0; bottom: 0; right: 0 !important;
  left: calc((100vw - var(--container-w)) / 2 + var(--container-pad) + 0.4 * var(--container-w) - var(--wedge)) !important;
  margin: 0; max-height: 396px; z-index: 0; pointer-events: none;
}
.about-hero__image img {
  width: 100% !important; height: 100% !important; object-fit: cover !important;
  max-width: none; border-radius: 0; display: block;
  clip-path: polygon(0 0, 100% 0, 100% 100%, var(--wedge) 100%, var(--wedge) calc(var(--notchY) + var(--wedge)), 0 var(--notchY), 0 0) !important;
}

/* =====================
   Under-hero gradient bar (same as teenus-category-menu)
   ===================== */
.about-strap { 
  background: linear-gradient(90deg, #F7A600 0%, #CC0D14 100%);
  width: 100%;
  position: relative;
  z-index: 10;
}
.about-strap ul.container { 
  max-width: 1440px; 
  margin: 0 auto; 
  padding: 0 20px; 
}
.about-strap ul { 
  list-style: none; 
  margin: 0; 
  padding: 0; 
  display: flex; 
  flex-wrap: wrap; 
  gap: 18px; 
  align-items: center; 
  min-height: 44px; 
}
.about-strap li { 
  display: inline-flex; 
  align-items: center; 
}
.about-strap a, .about-strap li.is-current span { 
  color: #fff; 
  text-decoration: none; 
  padding: 10px 14px; 
  display: inline-block; 
  font-weight: 400; 
}
.about-strap li.is-current span { 
  opacity: .9; 
  border-bottom: 2px solid rgba(255,255,255,.9); 
}
.about-strap a:hover { }

/* Responsive tweaks to match teenus-hero */
@media (max-width: 992px) {
  /* Mobile-only header logic (mirror single-teenus) */
  .split-br { display: none; }
  .split-hy { display: none; }

  .about-hero {
    height: auto;
    padding-top: 0; /* remove extra offset on mobile */
  }
  .about-hero__inner {
    display: block;
    position: relative; /* allow absolute-positioned title overlay */
    padding: 0;
    margin: 0;
    min-height: 500px;
  }
  .about-hero__title {
    clip-path: none;
    border-radius: 0;
    max-width: none;
    width: auto;
    position: absolute;   /* overlay on top of the image */
    bottom: 0;
    top: auto;
    left: 12px;
    transform: none;
    padding: 0;           /* padding handled by ::before on heading */
    z-index: 3;
    pointer-events: auto;
  }
  /* move the white slab with notch to the inline heading */
  .about-title {
    position: relative;
    display: inline-block;
    z-index: 1;
    font-size: 30px !important;
    margin-bottom: 15px;
  }
  .about-title::before {
    content: "";
    position: absolute;
    /* full viewport-width slab starting slightly left */
    left: -12px;
    top: auto;
    margin-top: -20px;
    width: 100vw;
    height: calc(100% + 36px);
    background: #fff;
    box-shadow: 0 4px 14px rgba(2,20,44,0.08);
    z-index: -1;
    pointer-events: none;

    /* same notch math as teenus */
    --pad-x: 25px;
    --notch: 47px;
    --title-ch: calc(var(--title-length, 16) * 0.62ch);
    --break: calc(var(--title-ch) + var(--pad-x) * 2 + 12px);

    clip-path: polygon(
      0 0,
      var(--break) 0,
      calc(var(--break) + var(--notch)) 50%,
      100% 50%,
      100% 100%,
      0 100%
    );
  }
  /* hide any desktop slab variant on mobile if present */
  .about-hero__title::before { display: none !important; }

  .about-hero__image {
    position: relative;   /* keep flow height; image remains below overlay */
    width: 100%;
    height: auto;
    left: auto !important;
    right: auto !important;
    margin: 0;
  }
  .about-hero__image img {
    width: 100vw !important;   /* full bleed */
    height: auto !important;
    min-height: 500px;
    object-fit: cover;          /* crop instead of stretch */
    clip-path: none !important;
    display: block;
  }

  /* Under-hero strap spacing */
  .about-strap ul.container { 
    padding-left: 16px; 
    padding-right: 16px; 
    min-height: 40px;
  }
}

@media (max-width: 550px) {
  .about-hero__inner { min-height: 400px; }
  .about-hero__image img { min-height: 400px; }
  .about-title { font-size: 24px !important; }
}

/* =====================
   About alternating content rows
   ===================== */
.about-alt { 
  padding: clamp(40px, 6vw, 80px) 0; 
}
.about-alt__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
  align-items: center;
  margin-bottom: clamp(36px, 6vw, 72px);
}
.about-alt__col--text { order: 2; }
.about-alt__col--media { order: 1; }
.about-alt__row--reverse .about-alt__col--text { order: 1; }
.about-alt__row--reverse .about-alt__col--media { order: 2; }

@media (min-width: 900px) {
  .about-alt__row { grid-template-columns: 1.05fr 1fr; gap: 48px; }
  .about-alt__col--text { order: 1; }
  .about-alt__col--media { order: 2; }
  .about-alt__row--reverse { grid-template-columns: 1fr 1.05fr; }
  .about-alt__row--reverse .about-alt__col--text { order: 2; }
  .about-alt__row--reverse .about-alt__col--media { order: 1; }
}

.about-alt__title {
  font-size: clamp(22px, 2.2vw, 28px);
  line-height: 1.2;
  margin: 0 0 12px;
}
.about-alt__text p { margin: 0 0 12px; }
.about-alt__img { width: 100%; height: auto; display: block; border-radius: 10px; }

/* =====================
   About team slider
   ===================== */
.about-team { padding: clamp(20px, 6vw, 64px) 0 80px; }
.about-team__title { margin: 0 0 18px; font-size: clamp(22px, 2.2vw, 28px); }

/* =====================
   About team slider – GSAP (About/Our-team classes)
   ===================== */
.about-team-slider { width:100%; padding:0; background:#f8f9fc; margin-right: calc((100vw - 1400px) / -2); }
.about-team-slider.about-team--dark { background: transparent; padding: 0; position:relative; overflow:hidden; }
.about-team-slider .our-team__viewport { overflow:visible; padding:0 0 56px 0; margin:0 auto; max-width:1400px; padding-right: calc((100vw - 1400px)/2); touch-action: pan-y; padding-top: 8px; }
.about-team-slider .our-team__track { display:flex; flex-direction:row; gap:48px; will-change:transform; transition: box-shadow .3s; cursor: grab; user-select:none; }
.about-team-slider.is-dragging .our-team__track { cursor: grabbing; }
.about-team-slider .our-team__item { flex:0 0 420px; max-width:420px; min-height:420px; display:flex; align-items:stretch; }
.about-team-slider .our-team-card { background: transparent; border-radius: 14px; box-shadow: none; border: none; padding: 32px 16px 20px 16px; display:flex; flex-direction:column; align-items:flex-start; width:100%; height:100%; }
.about-team-slider .our-team__item.is-active .our-team-card { z-index: 1; }
.about-team-slider .our-team__bottom{ display:flex; align-items:center; gap:16px; max-width:1400px; margin:0 auto; padding:0 0 16px 0; }
.about-team-slider .our-team__nav{ display:flex; gap:16px; }
.about-team-slider .our-team__arrow{ width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center; background:transparent; border:none; border-radius:50%; cursor:pointer; opacity:1; transition: transform .18s; background-repeat:no-repeat; background-position:center; background-size:24px 24px; }

.about-team-slider .our-team__arrow[disabled]{ cursor:not-allowed; opacity:1; }

.about-team-slider .our-team__arrow:hover:not([disabled]){ transform: translateY(-1px); }
.about-team-slider .our-team__progress{ flex:1 1 auto; height:2px; background:#fff; border-radius:1px; position:relative; overflow:hidden; }
.about-team-slider .our-team__progress span{ display:block; height:100%; width:0; background:linear-gradient(90deg,#F7A600 0%, #E30613 100%); border-radius:3px; position:absolute; left:0; top:0; will-change:transform; }
.about-team-slider.about-team--dark::after{ content:none; }

/* Standardize image area to a square */
.about-team__media { display:block; width:100%; aspect-ratio: 1 / 1; border-radius: 18px; overflow: hidden; background: #F4F6F9; }
.about-team__img { width:100%; height:100%; object-fit: cover; display:block; }

/* Card typography to match screenshot */
.about-team__name {     font-size: 32px;
    line-height: 1.1;
    font-weight: 300;
    color: #0E1B2C;
    margin: 18px 0 6px;
    font-family: 'Clash Display';}
.about-team__role {     font-size: 16px;
    line-height: 1.4;
    color: #4A5568;
    margin: 0 0 10px;
    opacity: 1;
    font-family: 'Montserrat';}
.about-team__email, .about-team__phone {     border: none;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    color: #0E1B2C;
    font-family: 'Montserrat'; }
.about-team__email { display:block;  margin-top: 8px; }
.about-team__phone { display:block;  margin-top: 4px; }

@media (max-width: 992px){
  .about-team-slider.about-team--dark{ padding:36px 0 0 0; }
  .about-team-slider .our-team__viewport{ padding:0 0 36px 0; padding-right:0; margin-right:0; }
  .about-team-slider .our-team__item{ flex:0 0 86vw; max-width:86vw; min-height:350px; }
  .about-team-slider .our-team-card{ padding:0px; margin-left: 15px;}
  .about-team__name { font-size: 24px; }
  .about-team__role { font-size: 16px; }
  .about-team__email { font-size: 18px; }
  .about-team__phone { font-size: 16px; }
  .about-team-slider .our-team__track {gap: 0px;}
}

/* =====================
   About team intro paragraph
   ===================== */
.about-team__intro{ max-width: 1180px; margin: 6px 0 18px; color:#223; line-height:1.7; }




/* contact page */



   .page-template-template-contact .footer__bg::before {

    margin-top: -73px; }
.contact-page .contact-container { max-width: 1400px; margin: 0 auto; padding: 48px 20px; position: relative; }
.contact-page .contact-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 40px; align-items: start;     margin-top: 80px;}

/* —— Colors / Background —— */
.contact-page .contact-hero { background: #0c1c2a; color: #fff; position: relative; }

/* —— Left column —— */
.contact-page .contact-title { margin: 0 0 18px; font-weight: 800; letter-spacing: .2px;
display:none;}
.contact-page .contact-content { font-size: 15px; line-height: 1.7; }
.contact-page .contact-content h2, 
.contact-page .contact-content h3 { color: #fff; }
.contact-page .contact-content a { color: #fff; text-decoration: underline; }
.contact-page .contact-content h2 {
        margin-bottom: -25px;

}

.contact-page h3 {
    font-size: 30px;
    margin-bottom: -20px;
}

/* —— Right column / CF7 —— */
.contact-page .wpcf7 { width: 100%; }
.contact-page .wpcf7-form p { margin: 0 0 14px; }
.contact-page .wpcf7 input[type="text"],
.contact-page .wpcf7 input[type="email"],
.contact-page .wpcf7 textarea,
.contact-page .wpcf7 select { width: 100%; background: #fff; color: #111; border: 0; padding: 12px 14px; font-size: 15px; line-height: 1.4; border-radius: 2px; }
.contact-page .wpcf7 textarea { min-height: 160px; }
.contact-page .contact-right {
    margin-top: 100px;
    display: flex;
    justify-content: flex-end;
}
.contact-page .contact-right .wpcf7 {
    width: 85%;
}
/* Submit button – gradient like the design */
.contact-page .wpcf7 input[type="submit"],
.contact-page .wpcf7 .wpcf7-submit { display: inline-block; width: 100%; border: 0; cursor: pointer; font-weight: 600; text-transform: none; padding: 12px 18px; border-radius: 2px; background: linear-gradient(90deg,#F7A600 0%, #E30613 100%); color: #fff; box-shadow: 0 6px 14px rgba(0,0,0,.18); }
.contact-page .wpcf7 input[type="submit"]:hover { filter: brightness(1.02); }

/* Make CF7 dropdown caret invisible so custom appearance matches screenshot */
.contact-page .wpcf7 select { appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: none; }

/* —— Map section —— */
.contact-page .contact-map-wrap { position: relative; background: #eceff1; }
.contact-page .map-inner { position: relative; width: 100%; height: clamp(560px, 75vh, 720px); overflow: hidden; }

/* Leaflet container */
.contact-page .contact-leaflet { width: 100%; height: clamp(560px, 75vh, 720px); }

/* Overlay panel */
.contact-page .map-overlay { position: absolute; left: 6%; top: 14%; z-index: 500; }
.contact-page .map-overlay .overlay-inner { background: rgba(255,255,255,.92); color: #0c1c2a; padding: 20px 24px; border-radius: 6px; box-shadow: 0 10px 30px rgba(0,0,0,.18); backdrop-filter: blur(2px);    margin-top: 100px; }
.contact-page .map-overlay .overlay-title { margin: 0 0 6px; font-size: 36px; line-height: 1.1; font-weight: 800; color: #0c1c2a; }
.contact-page .map-overlay .overlay-address { margin: 0 0 14px; font-size: 22px; line-height: 1.4; }
.contact-page .overlay-links { display: flex; gap: 12px; align-items: center; }
 .contact-page .overlay-link { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 6px; background: #fff; border: 1px solid #e2e8f0; transition: filter .2s ease; }
 .contact-page .overlay-link:hover { filter: brightness(0.9); }
 .contact-page .overlay-link img { width: 24px; height: auto; display: block; }

/* Pin size tweaks for retina */
.leaflet-marker-icon.custom-pin { width: 36px !important; height: 36px !important; }

/* —— Dark notch overlay drawn on top of map (map shows through the cut) —— */
.contact-page .contact-map-wrap::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -1px; /* overlap 1px to avoid seam */
  height: 120px; /* deeper notch */
  background: #0c1c2a; /* same as hero */
  z-index: 600; /* above tiles/labels */
  /* new notch shape */
  clip-path: polygon(0 0, 100% 0, 100% 66px, 89% 66px, 77% 177px, 0 124px, 0 0);
  pointer-events: none;
}
.leaflet-left {
    left: 0;
    margin-top: 135px; }

/* —— Responsive —— */
@media (max-width: 992px) {
  /* Layout: stack columns */
  .contact-page .contact-grid { grid-template-columns: 1fr; gap: 24px; }
  .contact-page .contact-container { padding: 28px 16px; }

  /* Show page title on mobile (hidden on desktop) */
  .contact-page .contact-title { display: block; font-size: 28px; }

  /* Form: full width */
  .contact-page .contact-right { margin-top: 0; display: block; justify-content: initial; }
  .contact-page .contact-right .wpcf7 { width: 100%; }
  .contact-page .wpcf7 input[type="text"],
  .contact-page .wpcf7 input[type="email"],
  .contact-page .wpcf7 textarea,
  .contact-page .wpcf7 select { font-size: 16px; }

  /* Map: reduce height a bit on mobile and integrate overlay above map */
  .contact-page .map-inner { height: clamp(420px, 60vh, 560px); }
  .contact-page .contact-leaflet { height: clamp(420px, 60vh, 560px); }
  .contact-page .map-overlay { position: static; left: auto; top: auto; z-index: auto; padding: 14px 16px; }
  .contact-page .map-overlay .overlay-inner { border-radius: 0; box-shadow: none; margin-top: 0; }
  .contact-page .map-overlay .overlay-title { font-size: 28px; }
  .contact-page .map-overlay .overlay-address { font-size: 18px; }

  /* Leaflet UI controls: move off the notch area */
  .leaflet-left { left: 0; margin-top: 12px; }
.contact-page .contact-map-wrap::before {
    height: 93px;
    background: #0c1c2a;
    z-index: 600;
    clip-path: polygon(0 0, 100% 0, 100% 66px, 73% 66px, 32% 177px, 0 124px, 0 0);
    pointer-events: none;

  }
  .contact-page .contact-content h2 {
    line-height: normal;
}
}

@media (max-width: 550px) {

  .contact-page .map-overlay .overlay-title { font-size: 24px; }
  .contact-page .map-overlay .overlay-address { font-size: 16px; }
}




/* archive teenused */


.archive-teenused .archive-header{padding:32px 0 8px;min-height:clamp(260px,32vw,396px);display:flex;align-items:flex-end}
.archive-teenused .archive-header .container{max-width:1400px;margin:0 auto;padding:0 20px}
.archive-teenused .archive-list{padding:12px 0 40px}

.teenus-row{display:grid;grid-template-columns:1.1fr 0.9fr;gap:36px;align-items:flex-start;padding:26px 0}
.teenus-row__col--content { display:flex; flex-direction:column; justify-content:space-between; height:100%; }
.teenus-row__buttons { margin-top:auto; }
.teenus-row__divider{height:2px;border:0;background:linear-gradient(90deg,#F7A600 0%, #CC0D14 100%);margin:28px 0 12px}
.teenus-row__title{font-size:40px;line-height:1.2;margin:0 0 10px}
.teenus-row__desc{color:#333;margin:0 0 16px}

.teenus-row__list{list-style:none;margin:0 0 18px;padding:0}
.teenus-row__list li{display:flex;align-items:center;gap:10px;margin:8px 0}
.teenus-row__icon{width:16px;height:16px;flex:0 0 16px}
.teenus-row__list a{text-decoration:none;color:#111;    font-weight: 500;}
.teenus-row__list a:hover{text-decoration:underline}

.teenus-row__buttons{display:flex;gap:16px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:0;font-size:1.2rem;line-height:1;padding:1rem 1.7rem;font-weight:400;font-family:'Clash Display',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;transition:opacity .2s ease;text-decoration:none}
.archive-teenused .btn--primary{background:linear-gradient(90deg,#F7A600 0%, #CC0D14 100%);color:#fff}
.archive-teenused .btn--primary:hover{opacity:.92}
.archive-teenused .btn--ghost{background:#02142C;color:#fff}
.archive-teenused .btn--ghost:hover{opacity:.92}
.archive-teenused .btn--primary:visited {
color: #fff;
}
.archive-teenused .btn--ghost:visited {
  color: #fff;
}
.teenus-row__col--image img{width:100%;aspect-ratio:1/1;height:auto;object-fit:cover;border-radius:12px;display:block}



/* Visually hide but keep for SEO */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Hero */
.hero-title{color:#02142C;line-height:1.15;word-break:normal;overflow-wrap:break-word;white-space:normal;margin:0;font-size:65px;font-weight:500}
.hero-text{max-width:760px;color:#0b1a2a;opacity:.95;font-size:18px;line-height:1.7;margin:0}
.hero-copy{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;column-gap:32px;row-gap:12px;width:100%; margin-top: 65px; margin-bottom: 50px;}
@media(max-width:992px){.hero-copy{grid-template-columns:1fr;grid-template-rows:auto auto;column-gap:0;row-gap:12px}}
.hero-title{grid-column:1/3;grid-row:1/2;max-width:min(80%,1120px)}
.hero-text{grid-column:2/3;grid-row:2/3;max-width:820px;justify-self:start}
@media(max-width:992px){
  .hero-title{grid-column:1/2;grid-row:1/2;max-width:100%}
  .hero-text{grid-column:1/2;grid-row:2/3;max-width:100%}
}

/* Quick nav */
.quick-nav{margin-top:18px}
.quick-nav__inner{width:100vw;margin-left:calc(50% - 50vw);background:linear-gradient(90deg,#F7A600 0%, #CC0D14 100%)}
.quick-nav__container{max-width:1400px;margin:0 auto;padding:0 20px}
.quick-nav__inner .quick-nav__container{display:flex;align-items:center;gap:28px;min-height:44px}
.quick-nav__label{font-weight:400;letter-spacing:.01em;color:#fff}
.quick-nav__list{display:flex;gap:34px;list-style:none;margin:0;padding:0;flex-wrap:wrap;    margin-left: auto;
    margin-right: auto;}
.quick-nav__list a{color:#fff;text-decoration:none;font-weight:400;padding:10px 14px;display:inline-block}
.quick-nav__list a:hover{opacity:.9}
.quick-nav__list a:visited {
    color: #fff;
}
@media(max-width:992px){
  .teenus-row{grid-template-columns:1fr;gap:18px}
  .teenus-row__col--image{order:2}

.quick-nav__list {
      gap: 1px;
}
.hero-title {
    font-size: 35px;
    margin-top: 25px;

}
@media (max-width: 992px) {
  /* Make inner container scrollable */
  .quick-nav__inner {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }

  /* Prevent the inner flex from wrapping and keep items in one line */
  .quick-nav__container {
    flex-wrap: nowrap;
    min-width: max-content;
  }

  .quick-nav__inner .quick-nav__container {
    display: inline-flex;
    align-items: center;
    gap: 20px;
    padding: 10px 20px;
  }

  /* Adjust list layout */
  .quick-nav__list {
    flex-wrap: nowrap;
    gap: 20px;
  }

  .quick-nav__list li {
    white-space: nowrap;
  }

  /* Optional: hide scrollbar on WebKit browsers */
  .quick-nav__inner::-webkit-scrollbar {
    display: none;
  }

  /* Slightly smaller padding for links on mobile */
  .quick-nav__list a {
    padding: 8px 10px;
  }
}

}
html{scroll-behavior:smooth}


/* Mobile horizontal scroll + fixed right-edge arrow (only under 600px) */
@media (max-width:600px){

  /* make the whole quick-nav full-bleed and anchor for the fixed arrow */
  .quick-nav{
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
  }

  /* make the bar the scroll container */
  .quick-nav__inner{
    position: relative;               /* anchor for ::after */
    overflow-x: auto;                 /* horizontal scroll */
    -webkit-overflow-scrolling: touch;
  }

  /* make inner content wider than viewport so it can scroll */
  .quick-nav__container{
    display: inline-flex;
    align-items: center;
    gap: 16px;
    min-width: max-content;
    padding: 8px 36px 8px 20px;       /* right padding so arrow doesn't overlap items */
  }

  .quick-nav__label{ white-space: nowrap; color:#fff; }
  .quick-nav__list{
    display: flex;
    flex-wrap: nowrap;                /* no wrap on mobile */
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .quick-nav__list a{
    color:#fff; text-decoration:none; padding:10px 14px; display:inline-block;
  }

  /* the non-scrollable arrow pinned to the RIGHT EDGE of the screen */
  .quick-nav::after{
    content: "›";
    position: absolute;
    top: 50%;
    right: 0;                         /* sticks to the visible right edge of viewport */
    transform: translateY(-50%);
    display: flex; align-items: center; justify-content: center;
    width: 22px; height: 100%;
    background: #A81815;              /* red background */
    color: #fff;
    font-size: 18px;
    pointer-events: none;             /* don’t block swipes */
  }
  .quick-nav__inner::after{ display:none !important; }
}

/* uudised archive */


/* =====================
   About hero (cloned from teenus-hero)
   ===================== */
.about-title { color:#02142C; line-height:1.15; margin:0; }
.about-hero { --container-max:1400px; --container-pad:20px; --container-w:min(100vw,var(--container-max)); --wedge:64px; --notchY:45%; height:clamp(260px,32vw,396px); position:relative; padding-top:24px; overflow:hidden; width:100vw; margin-left:calc(50% - 50vw); isolation:isolate; pointer-events:none; }
.about-hero__inner{ display:block; margin-top:50px; }
.about-hero__title{ display:flex; align-items:center; padding:36px 32px; width:calc(0.3 * var(--container-w)); position:absolute; top:50%; transform:translateY(-50%); left:calc((100vw - var(--container-w)) / 2 + var(--container-pad)); z-index:2; pointer-events:auto; }
.about-hero__image{ position:absolute; top:0; bottom:0; right:0 !important; left:calc((100vw - var(--container-w)) / 2 + var(--container-pad) + 0.4 * var(--container-w) - var(--wedge)) !important; margin:0; max-height:396px; z-index:0; pointer-events:none; }
.about-hero__image img{ width:100% !important; height:100% !important; object-fit:cover !important; max-width:none; display:block; clip-path:polygon(0 0, 100% 0, 100% 100%, var(--wedge) 100%, var(--wedge) calc(var(--notchY) + var(--wedge)), 0 var(--notchY), 0 0) !important; }

/* =====================
   Under-hero gradient bar (same as single)
   ===================== */
.news-title-bar{ background:linear-gradient(90deg,#F7A600 0%, #CC0D14 100%); width:100%; position:relative; z-index:10; }
.news-title-bar .container{ max-width:1440px; margin:0 auto; padding:0 20px; min-height:44px; display:flex; align-items:center; }
.news-title-bar__link{ color:#fff; text-decoration:none; padding:10px 14px; display:inline-block; font-weight:400; border-bottom:2px solid transparent; }
.news-title-bar__link:hover{ opacity:.9; border-bottom-color:rgba(255,255,255,.9); }

/* =====================
   Archive grid
   ===================== */
.uudis-archive-list{ max-width:1440px; margin:40px auto; padding:0 20px; display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
@media (max-width:1024px){ .uudis-archive-list{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .uudis-archive-list{ grid-template-columns:1fr; } }

.uudis-archive-item{ background:#fff; border-radius:8px; overflow:hidden; box-shadow:0 8px 24px rgba(0,0,0,.06); display:flex; flex-direction:column; }
.uudis-archive-thumb{ position:relative; display:block; aspect-ratio: 4 / 3; overflow:hidden; }
.uudis-archive-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.uudis-badge{ position:absolute; left:12px; top:12px; background:#E30613; color:#fff; font-size:.8rem; line-height:1; padding:6px 8px; border-radius:4px; }

.uudis-archive-content{ padding:18px 18px 22px; display:flex; flex-direction:column; gap:10px; }
.uudis-archive-title{ font-size:1.35rem; line-height:1.25; margin:0; }
.uudis-archive-title a{ text-decoration:none; color:#02142C; }
.uudis-archive-title a:hover{ opacity:.85; }
.uudis-archive-meta{ color:#6A6F77; font-size:.95rem; }
.uudis-archive-excerpt{ color:#2A2F36; font-size:1rem; line-height:1.6; }
.uudis-read-more{ margin-top:auto; display:inline-block; text-decoration:none; font-weight:500; color:#CC0D14; }
.uudis-read-more span{ position:relative; left:3px; }

/* Pagination */
.uudis-archive-pagination{ display:flex; justify-content:center; margin:24px 0 60px; }
.uudis-archive-pagination .pagination .page-numbers, .navigation.pagination .page-numbers{ margin:0 6px; display:inline-flex; justify-content:center; align-items:center; width:40px; height:40px; border-radius:50%; background:#EEF0F3; color:#02142C; text-decoration:none; }
.navigation.pagination .page-numbers.current{ background:#02142C; color:#fff; }
/* =====================
   Mobile-only banner + title slab (≤ 992px)
   ===================== */
@media (max-width: 992px) {
  .single-uudis .container.about-hero__inner {
padding: 0px!important;
margin: 0px!important;
  }
  .split-br { display: none; }
  .split-hy { display: none; }

  /* Banner layout mirrors single-teenus on mobile */
  .about-hero {
    height: auto;
    padding-top: 0;
  }
  .about-hero__inner {
    display: block;
    position: relative; /* allow absolute title overlay */
    padding: 0;
    margin: 0;
    min-height: 500px;
  }
  .about-hero__title {
    clip-path: none;
    border-radius: 0;
    max-width: none;
    width: auto;
    position: absolute;   /* overlay title on image */
    bottom: 0;
    top: auto;
    left: 12px;
    transform: none;
    padding: 0;            /* padding handled by ::before on heading */
    z-index: 3;
    pointer-events: auto;
  }

  /* Move the white slab with notch to the inline heading */
  .about-hero__title::before { display: none; }
  .about-title {
    position: relative;
    display: inline-block;
    z-index: 1;
    font-size: 30px !important;
    margin-bottom: 15px;
  }
  .about-title::before {
    content: "";
    position: absolute;
    left: -12px;
    top: auto;
    margin-top: -20px;
    width: 100vw;
    height: calc(100% + 36px);
    background: #fff;
    box-shadow: 0 4px 14px rgba(2,20,44,0.08);
    z-index: -1;
    pointer-events: none;

    /* same notch math as teenus */
    --pad-x: 25px;
    --notch: 47px;
    --title-ch: calc(var(--title-length, 16) * 0.62ch);
    --break: calc(var(--title-ch) + var(--pad-x) * 2 + 12px);

    clip-path: polygon(
      0 0,
      var(--break) 0,
      calc(var(--break) + var(--notch)) 50%,
      100% 50%,
      100% 100%,
      0 100%
    );
  }

  /* Image becomes flow content under overlay; avoid stretching */
  .about-hero__image {
    position: relative;
    width: 100%;
    height: auto;
    left: auto !important;
    right: auto !important;
    margin: 0;
  }
  .about-hero__image img {
    width: 100vw !important;   /* full bleed */
    height: auto !important;
    min-height: 500px;
    object-fit: cover;          /* crop instead of stretch */
    clip-path: none !important;
    display: block;
  }

  /* Under-hero bar spacing + link fit */
  .news-title-bar .container { 
    min-height: 40px; 
        padding-left: 0px;
    padding-right: 16px; 
  }
  .news-title-bar__link {
    display: block;
    width: 100%;
    padding: 10px 16px;
    font-weight:400;
        font-size: 14px;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border-bottom: 2px solid transparent;
  }
}

@media (max-width: 550px) {
  .about-hero__inner { min-height: 400px; }
  .about-hero__image img { min-height: 400px; }
  .about-title { font-size: 24px !important; }
}




/* single uudis */

/* =====================
   About hero (cloned from teenus-hero)
   ===================== */
.about-title {
  color: #02142C;
  line-height: 1.15;
  word-break: normal;
  overflow-wrap: break-word;
  white-space: normal;
  margin: 0;
}
.about-hero {
  --container-max: 1400px;
  --container-pad: 20px;
  --container-w: min(100vw, var(--container-max));
  --wedge: 64px;
  --notchY: 45%;
  height: clamp(260px, 32vw, 396px);
  position: relative;
  padding-top: 24px;
  overflow: hidden;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  isolation: isolate;
  pointer-events: none;
}
.about-hero__inner { display: block; margin-top: 50px; }
.about-hero__title {
  display: flex; align-items: center; padding: 36px 32px;
  width: calc(0.3 * var(--container-w));
  position: absolute; top: 50%; transform: translateY(-50%);
  left: calc((100vw - var(--container-w)) / 2 + var(--container-pad));
  z-index: 2; pointer-events: auto;
}
.about-hero__image {
  position: absolute; top: 0; bottom: 0; right: 0 !important;
  left: calc((100vw - var(--container-w)) / 2 + var(--container-pad) + 0.4 * var(--container-w) - var(--wedge)) !important;
  margin: 0; max-height: 396px; z-index: 0; pointer-events: none;
}
.about-hero__image img {
  width: 100% !important; height: 100% !important; object-fit: cover !important;
  max-width: none; border-radius: 0; display: block;
  clip-path: polygon(0 0, 100% 0, 100% 100%, var(--wedge) 100%, var(--wedge) calc(var(--notchY) + var(--wedge)), 0 var(--notchY), 0 0) !important;
}


/* =====================
   Under-hero gradient bar (same as teenus-category-menu)
   ===================== */
.news-title-bar { 
  background: linear-gradient(90deg, #F7A600 0%, #CC0D14 100%);
  width: 100%;
  position: relative;
  z-index: 10;
}
.news-title-bar .container { 
  max-width: 1440px; 
  margin: 0 auto; 
  padding: 0 20px; 
  min-height: 44px; 
  display: flex; 
  align-items: center; 
}
.news-title-bar__link:visited {
  color: #fff; 
}
.news-title-bar__link { 
  color: #fff; 
  text-decoration: none; 
  padding: 10px 14px; 
  display: inline-block; 
  font-weight: 400; 
  border-bottom: 2px solid transparent; 
  transition: opacity .2s ease, border-color .2s ease;
}
.news-title-bar__link:hover { 
  opacity: .9; 
  border-bottom: 2px solid rgba(255,255,255,.9); 
}

 .uudis-single {
   margin-top: 60px;
 }
 .uudis-entry-header {
   margin-bottom: 20px;
 }
 .uudis-entry-meta {
   font-size: 0.95rem;
   color: #555;
 }
.uudis-single-title {
  font-size: 2.2rem;

  color: #02142C;
  max-width: 1400px;
}
.uudis-entry-content {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #222;
 }
.container--narrow {
  max-width: 1400px;
  margin-bottom: 250px;
}
.single-uudist ul, ol {
    margin: 0 0 1.5em -1em;
    font-family: 'Montserrat';
    font-size: 17px;
    color: #223;
    line-height: 1.7;
}
.uudis-single-title {
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: manual;
}

@media (max-width: 768px) {
  .hero__title { font-size: 2.2rem; }
  .hero__angle { width: 200px; height: 50px; }
}

@media (max-width: 992px) {
  .uudis-single-title {
        margin: 0 0 12px;
    font-size: clamp(22px, 2.6vw, 34px);
    color: #02142C;
  }

  /* Reference: single-teenus mobile hero layout */
  .split-br { display: none; }
  .split-hy { display: none; }

  .about-hero {
    height: auto;
    padding-top: 0px;
  }
  .about-hero__inner { 
    display: block; 
    position: relative; /* allow absolute-positioned title overlay */
    padding: 0px;
    margin: 0px;
    min-height: 500px;
  }
  .about-hero__title {
    clip-path: none;
    border-radius: 0;
    max-width: none;
    width: auto;
    position: absolute;   /* overlay on top of the image */
    bottom: 0px;
    top: auto;
    left: 12px;
    transform: none;
    padding: 0;           /* padding handled by ::before */
    z-index: 3;
    pointer-events: auto;
  }
  /* Create a white card behind the text using ::before on the TITLE element */
  .about-title {
    position: relative;
    display: inline-block;
    z-index: 1;
    font-size: 30px!important;
    margin-bottom: 15px;
  }
  .about-hero__title::before { display: none; }
  .about-title::before {
    content: "";
    position: absolute;
    /* make the background span full viewport width from the left edge */
    left: -12px;
    top: auto;
    margin-top: -20px;
    width: 100vw;
    height: calc(100% + 36px);
    background: #fff;
    box-shadow: 0 4px 14px rgba(2,20,44,0.08);
    z-index: -1;
    pointer-events: none;

    /* compute where the title ends (approximate, using ch width) */
    --pad-x: 25px;
    --notch: 47px;
    --title-ch: calc(var(--title-length, 16) * 0.62ch);  /* approx width of characters */
    --break: calc(var(--title-ch) + var(--pad-x) * 2 + 12px); /* title width + padding + initial left gap */

    /* mirrored shape: after the title, keep the BOTTOM half (50%) */
    clip-path: polygon(
      0 0,
      var(--break) 0,
      calc(var(--break) + var(--notch)) 50%,
      100% 50%,
      100% 100%,
      0 100%
    );
  }
  .about-hero__image {
    position: relative;   /* keep flow height; image remains below overlay */
    width: 100%;
    height: auto;
    left: auto !important;
    right: auto !important;
    margin: 0; 
  }
  .about-hero__image img {
    width: 100vw !important;
    height: auto !important;
    min-height: 500px;
    clip-path: none !important;
    display: block;
  }

  /* Under-hero bar paddings */
  .news-title-bar .container { 
    min-height: 40px; 
    padding-left: 16px; 
    padding-right: 16px; 
  }
}

@media (max-width: 550px) {
  .about-hero__inner { 
    min-height: 400px;
  }
  .about-hero__image img {
    min-height: 400px;
  }
  .about-title {
    font-size: 24px!important;
  }
}




/* single teenus */


/* Container utility if your theme already has one, this will just cap width */
.container { max-width: 1400px; margin: 0 auto; padding: 0 20px; }
.teenus-title {
    color: #02142C;
    line-height: 1.15;
    word-break: normal;         /* do not break inside words */
    overflow-wrap: break-word;  /* wrap at word boundaries; break long words only if needed */
    white-space: normal;
    margin: 0;
}
/* ───────────────── Hero ───────────────── */
.teenus-hero {
  --container-max: 1400px;
  --container-pad: 20px;
  --container-w: min(100vw, var(--container-max));
  --wedge: 64px;
  --notchY: 45%;
  height: clamp(260px, 32vw, 396px);
  position: relative;
  padding-top: 24px;
  overflow: hidden;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  isolation: isolate;
  pointer-events: none;
}
.teenus-hero__inner {
  display: block;
      margin-top: 50px;

}
.teenus-hero__title {
  display: flex;
  align-items: center;
  padding: 36px 32px;
  width: calc(0.3 * var(--container-w));
  position: absolute;      /* center only the title vertically */
  top: 50%;
  transform: translateY(-50%);
  left: calc((100vw - var(--container-w)) / 2 + var(--container-pad));
  z-index: 2;
  pointer-events: auto;
}
.teenus-hero__image {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0 !important;
  left: calc((100vw - var(--container-w)) / 2 + var(--container-pad) + 0.4 * var(--container-w) - var(--wedge)) !important;
  margin: 0;
  max-height: 396px;
  z-index: 0;
  pointer-events: none;
  /* outline: 1px solid red; */ /* developer aide - remove when done */
}

.teenus-block__content ul, ol {
    margin: 0 0 1.5em -1em;
        font-family: 'Montserrat';
    font-size: 17px;
        color: #223;
    line-height: 1.7;
}
.teenus-hero__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  max-width: none;
  border-radius: 0;
  display: block;
  clip-path: polygon(0 0, 100% 0, 100% 100%, var(--wedge) 100%, var(--wedge) calc(var(--notchY) + var(--wedge)), 0 var(--notchY), 0 0) !important;
}

/* Gradient menu bar under hero */
.teenus-category-menu { background: linear-gradient(90deg, #F7A600 0%, #CC0D14 100%);width: 100%; position: relative; z-index: 10; }
.teenus-category-menu ul.container { max-width: 1440px; margin: 0 auto; padding: 0; }
.teenus-category-menu ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 18px; align-items: center; min-height: 44px; }
.teenus-category-menu li { display: inline-flex; align-items: center; flex: 0 0 auto; }
.teenus-category-menu a, .teenus-category-menu li.is-current span {
  color: #fff;
  text-decoration: none;
  padding: 10px 14px;
  display: inline-block;
  font-weight: 400;
  white-space: nowrap;        /* keep each item on a single line */
}
.teenus-category-menu li.is-current span { opacity: .9; border-bottom: 2px solid rgba(255,255,255,.9); }
.teenus-category-menu a:hover {}

/* hide chevron by default on large screens */
.teenus-category-menu::after { display: none; }

@supports (selector(:has(*))) {
  /* show chevron only when list is actually scrollable (mobile will override display) */
  .teenus-category-menu:has(ul) .overflow-indicator { display: none; }
}

/* Meta under hero */
.teenus-entry-meta { color: #415068; font-size: 14px; margin: 18px auto 32px; display:none;}
.teenus-entry-meta a { color: inherit; }

/* ───────────── Alternating Blocks ───────────── */
.teenus-block { padding: 56px 0; }
.teenus-block__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.teenus-block__text h2 { margin: 0 0 12px; font-size: clamp(22px, 2.6vw, 34px); color: #02142C; }
.teenus-block__content { color: #223;  line-height: 1.7; }
.teenus-block__list { margin: 12px 0 0 0; padding-left: 18px; }
.teenus-block__image img { width: 100%; height: auto;display: block; }

/* Image position variations */
.teenus-block--img-left .teenus-block__inner { grid-template-columns: 1fr 1fr; }
.teenus-block--img-left .teenus-block__image { order: 1; }
.teenus-block--img-left .teenus-block__text  { order: 2; }
.teenus-block--img-right .teenus-block__image { order: 2; }
.teenus-block--img-right .teenus-block__text  { order: 1; }

@media (min-width: 992px) {
.teenus-category-menu ul.container { padding-left: 25px;}


}
/* Responsive */
@media (max-width: 992px) {

  .split-br {
    display: none;
  }
.split-hy {
  display: none;
}
  
  .single-teenus .site-header::before {

  }
  .teenus-hero {
    height: auto;
    padding-top: 0px;

  }
  .teenus-hero__inner { 
    display: block; 
    position: relative; /* allow absolute-positioned title overlay */
            padding: 0px;
        margin: 0px;
                min-height: 500px;

  }
  .teenus-hero__title {
    clip-path: none;
    border-radius: 0;
    max-width: none;
    width: auto;
    position: absolute;   /* overlay on top of the image */
    bottom: 0px;
    top: auto;
    left: 12px;
    transform: none;
    padding: 0;           /* padding handled by ::before */
    z-index: 3;
    pointer-events: auto;
  }
  /* create a white card behind the text using ::before */
  .teenus-title {
    position: relative;
    display: inline-block;
    z-index: 1;
    font-size: 30px!important;
        margin-bottom: 15px;
  }
  .teenus-title::before {
    content: "";
    position: absolute;
    /* make the background span full viewport width from the left edge */
        left: -12px;
        top: auto;
        margin-top: -20px;
        width: 100vw;
        height: calc(100% + 36px);
    background: #fff;
    box-shadow: 0 4px 14px rgba(2,20,44,0.08);
    z-index: -1;
    pointer-events: none;

    /* compute where the title ends (approximate, using ch width) */
        --pad-x: 25px;
        --notch: 47px;
    --title-ch: calc(var(--title-length, 16) * 0.62ch);  /* approx width of characters */
    --break: calc(var(--title-ch) + var(--pad-x) * 2 + 12px); /* title width + padding + initial left gap */

    /* mirrored shape: after the title, keep the BOTTOM half (50%) */
    clip-path: polygon(
      0 0,
      var(--break) 0,
      calc(var(--break) + var(--notch)) 50%,
      100% 50%,
      100% 100%,
      0 100%
    );
  }
  .teenus-hero__image {
    position: relative;   /* keep flow height; image remains below overlay */
    width: 100%;
    height: auto;
    left: auto !important;
    right: auto !important;
    margin: 0; 
 

  }
  .teenus-hero__image img {
    width: 100vw !important;
    height: auto !important;
            min-height: 500px;
    clip-path: none !important;
    display: block;
  }
  /* horizontally scrollable related menu on mobile */
  .teenus-category-menu { position: relative; }
  .teenus-category-menu ul.container { padding-right: 40px; }
  .teenus-category-menu ul {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    gap: 10px;
    scrollbar-width: none;
    align-items: stretch;
  }
  .teenus-category-menu li { flex: 0 0 auto; }
  .teenus-category-menu ul::-webkit-scrollbar { display: none; } /* WebKit hide */
  /* subtle chevron prompting horizontal scroll */
  .teenus-category-menu::after {
        content: "›";
        position: absolute;
        right: 1px;
        top: 50%;
        transform: translateY(-50%);
        color: #fff;
        background: #A81815;
        width: 17px;
        font-size: 18px;
        padding-left: 4px;
        line-height: 2.5;
        margin-top: -0.4px;
        opacity: 1;
        pointer-events: none;
        display: block;
  }
  .teenus-block { padding: 36px 0; }
  .teenus-block__inner { grid-template-columns: 1fr; gap: 24px; }
  .teenus-block__text { order: 1 !important; }
  .teenus-block__image { order: 2 !important; }
    .teenus-block--img-left .teenus-block__inner { grid-template-columns: 1fr; gap: 24px; }

}


@media (max-width: 550px) {
  .teenus-hero__inner { 
                min-height: 400px;

  }
    .teenus-hero__image img {

            min-height: 400px;

  }
  .teenus-title{
    font-size: 24px!important;
  }
  .teenus-category-menu a, .teenus-category-menu li.is-current span {
    font-size: 14px;
  }

    .teenus-category-menu::after {
        line-height: 2.4;
        margin-top: 0px;
  }
}



/* services slider */

  .services-slider {
          width: 100%;
          padding: 0;
          background: #f8f9fc;
          margin-right: 0; /* default: no negative overflow on small screens */
        }
        @media (min-width: 1400px) {
          .services-slider {
            margin-right: calc((100vw - 1400px) / -2);
          }
        }
        .services-slider--dark {
          background: #02142C;
          padding: 64px 0 0 0;
          position: relative;
             overflow: hidden;
        }
        .services-slider__viewport {
          overflow: visible;
          padding: 0 16px 56px 16px; /* gutter on small screens */
          margin: 0 auto;
          max-width: 1400px;
          touch-action: pan-y;
        }
        @media (min-width: 1400px) {
          .services-slider__viewport {
            padding: 0 0 56px 0; /* remove side gutters at max width */
          }
        }
.services-slider.is-dragging .services-slider__track {  /* ADD */
  cursor: grabbing;
}
        .services-slider__viewport h2 {
          margin: 0 0 75px 0;
          font-size: clamp(37px, 3.2vw, 60px);
          line-height: 1.1;
          text-align: center;
          color: #fff;
          font-weight: 400;
        }
        .services-slider__track {
          display: flex;
          flex-direction: row;
          gap: clamp(16px, 3vw, 48px);
          will-change: transform;
          transition: box-shadow 0.3s;
          cursor: grab; user-select: none;
        }
        .services-slider__item {
          flex: 0 0 clamp(280px, 30vw, 420px);
          max-width: clamp(280px, 30vw, 420px);
          min-height: clamp(320px, 32vw, 420px);
          display: flex;
          align-items: stretch;
        }
        .services-slider__item .service-card {
          background: #fff;
          border-radius: 14px;
          box-shadow: 0 8px 24px rgba(2,20,44,0.12);
          border: 1px solid rgba(2,20,44,.08);
          padding: clamp(24px, 3vw, 48px) clamp(18px, 2.8vw, 40px) clamp(20px, 2.6vw, 40px) clamp(18px, 2.8vw, 40px);
          display: flex;
          flex-direction: column;
          align-items: flex-start;
          width: 100%;
          height: 100%;
          transition: box-shadow 0.2s, border 0.2s;
        }
        .services-slider__item.is-active .service-card {
          box-shadow: 0 16px 32px rgba(31,122,255,0.12);
          z-index: 1;
        }
        .service-card__icon {
          width: clamp(56px, 6vw, 84px);
          height: clamp(56px, 6vw, 84px);
          margin-bottom: clamp(12px, 1.6vw, 24px);
          display: flex;
          align-items: center;
          justify-content: center;
        }
        .service-card__icon img {
          max-width: 100%;
          max-height: 100%;
          display: block;
        }
        .service-card__title {
          font-size: clamp(22px, 2.2vw, 36px);
          font-weight: 500;
          margin-bottom: clamp(4px, 0.8vw, 12px);
          color: #0E1B2C;
          line-height: 1.15;
        }
        .service-card__excerpt {
          font-size: clamp(15px, 1.2vw, 18px);
          color: #2d3c50;
          margin-bottom: clamp(12px, 1.4vw, 24px);
          line-height: 1.6;
        }
        .service-card__link {
          margin-top: auto;
          color: #CC0D14;
          font-weight: 500;
          text-decoration: none;
          display: inline-flex;
          align-items: center;
          gap: 6px;
          letter-spacing: 0.01em;
          transition: transform 0.15s cubic-bezier(.4,0,.2,1);
          position: relative;
        }
        .service-card__link:visited {
          color: #CC0D14;

        }

        .service-card__link:hover {
          transform: translateX(2px);
        }
        .services-slider__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 0 24px 0;
  margin-top: 55px;
  gap: 24px;
}
        .services-slider__nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
  flex: 0 0 auto;
}
        .services-slider__arrow {
          width: clamp(36px, 4.2vw, 44px);
          height: clamp(36px, 4.2vw, 44px);
          display: inline-flex;
          align-items: center;
          justify-content: center;
          background: transparent;
          border: none;
          border-radius: 50%;
          cursor: pointer;
          opacity: 1;
          transition: transform 0.18s;
          background-repeat: no-repeat;
          background-position: center;
          background-size: 20px 20px;
        }

        .services-slider__arrow[disabled] {
          cursor: not-allowed;
          opacity: 1;
        }

        .services-slider__arrow:hover:not([disabled]) {
          transform: translateY(-1px);
        }
        .services-slider__progress {
  flex: 1 1 auto;
  height: 2px;
  background: #fff;
  border-radius: 1px;
  position: relative;
  overflow: hidden;
  min-width: 0;
}
        .services-slider__progress span {
          display: block;
          height: 100%;
          width: 0;
          background: linear-gradient(90deg,#F7A600 0%, #E30613 100%);
          border-radius: 3px;
          position: absolute;
          left: 0;
          top: 0;
          will-change: transform;
        }
        .services-slider--dark::after{
 content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 275px;
    height: 66px;
    background: #F2F2F2;
    clip-path: polygon(100% 0, /* top-right */ 37% 0, /* top-left (controls horizontal length) */ 0 100%, /* bottom-left point */ 100% 100% /* bottom-right */);
    pointer-events: none;
    margin-bottom: -1.5px;
        }
        @media (max-width: 992px) {
          .services-slider--dark { padding: 28px 0 0 0; }
          .services-slider__viewport { padding: 0 16px 36px 16px; }
          .services-slider__item { flex: 0 0 86vw; max-width: 86vw; min-height: 340px; }
          .services-slider__item .service-card { padding: 24px 16px 20px 16px; }
          .service-card__icon { margin-bottom: 12px; }
          .service-card__title { margin-bottom: 10px; }
          .service-card__excerpt { margin-bottom: 14px; }
          .services-slider__bottom{ padding:0 16px 16px 16px; gap:12px; }
          .services-slider__progress { display: block; }
          .services-slider__bottom {    margin-top: 26px;
    margin-bottom: 32px; }
    .service-card__icon {     width: clamp(72px, 6vw, 84px);
    height: clamp(72px, 6vw, 84px);}
        }
        @media (max-width: 768px) {
          .services-slider__item { flex-basis: 88vw; max-width: 88vw; min-height: 320px; }
        }

        @media (max-width: 500px) {
          .services-slider__item { flex-basis: 300px;
        max-width: 300px;
        min-height: 350px;
        
       }
          .services-slider__item .service-card { max-width: 300px; margin: 0 auto; }
          .services-slider__track { gap: 12px; }
          .services-slider__progress { display: block; }

              .services-slider__viewport h2 {
          margin-top: 45px;
        margin-bottom: 45px;
          font-size: 35px;
          font-weight: 500;
        }

        }

        @media (max-width: 380px) {
          .services-slider__item { flex-basis: 340px; max-width: 340px; min-height: 280px; }
        }


/* landingpage news slider */


 .landingpage-news-slider {
      margin: 80px 0;
    }
    .news-slider-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 40px;
    }
    .news-slider-header h2 {
	font-size: 3.7em;
        font-weight: 300;
        color: #02142C;
      margin: 0;
    }
    .news-slider-header .btn-all-news {
      background: #02142C;
      color: #fff;
      padding: 10px 20px;
      text-decoration: none;
    }
    .news-slider__wrapper {
      overflow: hidden;
      position: relative;
      touch-action: pan-y;
    }
    .news-slider__track {
      display: flex;
      margin-bottom: 20px;
      gap: 18px;
      cursor: grab;
      user-select: none;
      -ms-touch-action: pan-y;
      will-change: transform;
    }
    .is-dragging .news-slider__track {
      cursor: grabbing;
    }
    .news-card * {
      -webkit-user-drag: none;
    }
    .news-card {
      flex: 0 0 360px;
      background: #fff;
      box-shadow: 0 4px 10px rgba(0,0,0,0.08);
      min-height: unset;
      position: relative;
      display: flex;
      flex-direction: column;
      min-width: 0;
      overflow: hidden;
    }
    .news-card__link {
      display: block;
      color: inherit;
      text-decoration: none;
      height: 100%;
    }
    .news-card__image {
      position: relative;
      overflow: hidden;
      height: 240px;
    }
    .news-card__image img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .news-card__badge {
      position: absolute;
      top: 10px;
      left: 10px;
      background: #E30613;
      color: #fff;
      padding: 4px 10px;
      font-size: 14px;
    }
    .news-card__content {
      padding: 21px;
      position: relative;
      flex: 1 1 auto;
      overflow: hidden;
    }
    .news-card__title {
    font-size: 24px;
    margin: 0 0 10px;
    font-weight: 400;
    }
    .news-card__excerpt {
      color: #555;
      margin: 0 0 15px;
    }
    .news-card__title, .news-card__excerpt {
      word-break: break-word;
      overflow-wrap: anywhere;
      hyphens: auto;
    }
    .news-card__read {
      display: flex;
      align-items: center;
      gap: 6px;
      color: #E30613;
      font-weight: 400;
      z-index: 1;
      margin: 10px 20px 20px;
    }
    @media (max-width: 1280px) {
      .news-card { flex-basis: 320px; }
      .news-card__image { height: 220px; }
    }
    @media (max-width: 992px) {
      .news-slider-header h2 { font-size: 2.6em; }
      .news-slider__track { gap: 16px; }
      .news-card { flex-basis: 75vw; }
    }
    @media (max-width: 600px) {
      .news-slider-header { margin-bottom: 24px; }
      .news-slider-header h2 { font-size: 2.1em; }
      .news-card { flex-basis: 86vw; }
      .news-card__image { height: 200px; }
      .landingpage-news-slider .container {overflow-y: hidden; width: 100%;}        
    }

    @media (max-width: 500px) {
      /* allow next card to peek in on small phones */
      .news-slider__wrapper { overflow: visible; }
      .news-slider__track { padding-left: 16px; padding-right: 48px; }
      .news-card { flex-basis: 82vw; max-width: 350px; }
    }