/* ==========================================================================
   Easy IT — FINAL SITE V1
   --------------------------------------------------------------------------
   Global chrome (white header, dark footer) plus the section patterns from the
   approved V1 mockups.

   This file is enqueued on every page EXCEPT the Coming Soon front page, so
   the live holding page keeps its own, unchanged styling.

    1. Tokens
    2. Header
    3. Mobile navigation
    4. Footer
    5. Breadcrumb
    6. Hero
    7. Section label
    8. Services strip
    9. Feature cards
   10. Dark process timeline
   11. Why row
   12. Reference / project cards
   13. Product cards
   14. Logo strip
   15. Stat row
   16. Contact
   17. CTA band
   18. Buttons and links
   19. Responsive
   ========================================================================== */

/* 1. Tokens --------------------------------------------------------------- */

:root {
	--ei-v1-header-h: 76px;
	--ei-v1-dark: #0d0d0d;
	--ei-v1-dark-2: #151515;
	--ei-v1-body: #4a4a4a;
	--ei-v1-muted: #8a8a8a;
	--ei-v1-hairline: #e8e8e8;
	--ei-v1-wrap: 1240px;
	--ei-v1-pad: clamp(1.25rem, 4vw, 3rem);
}

/* The V1 pages use a bolder heading voice than the Coming Soon screen.
   Everything else (palette, triangle motif, red accents) is shared. */
.easyit-v1 h1,
.easyit-v1 h2,
.easyit-v1 h3,
.easyit-v1 h4 {
	font-weight: 700;
	letter-spacing: -.02em;
	color: var(--ei-black, #050505);
}

.easyit-v1 {
	color: var(--ei-v1-body);
}

.easyit-wrap {
	width: min(100% - (var(--ei-v1-pad) * 2), var(--ei-v1-wrap));
	margin-inline: auto;
}

/* 2. Header --------------------------------------------------------------- */

.ei-header {
	position: sticky;
	top: 0;
	z-index: 90;
	background: #fff;
	border-bottom: 1px solid var(--ei-v1-hairline);
}

.ei-header__inner {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	min-height: var(--ei-v1-header-h);
}

.ei-header__brand {
	display: inline-flex;
	align-items: center;
	margin-right: auto;
	line-height: 0;
}

.ei-header__brand img {
	display: block;
	width: auto;
	height: 52px;
}

.ei-nav {
	display: flex;
	align-items: center;
}

.ei-nav__list {
	display: flex;
	align-items: center;
	gap: clamp(1.1rem, 2.4vw, 2.4rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

.ei-nav__list a {
	position: relative;
	display: block;
	padding: .4rem 0;
	color: var(--ei-black, #050505);
	font-size: .8125rem;
	font-weight: 600;
	letter-spacing: .09em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	transition: color .18s ease;
}

.ei-nav__list a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -2px;
	height: 2px;
	background: var(--ei-red, #f20d0d);
	transform: scaleX(0);
	transition: transform .18s ease;
}

.ei-nav__list a:hover,
.ei-nav__list a:focus-visible {
	color: var(--ei-red, #f20d0d);
}

/* Red active accent — the locked V1 rule. */
.ei-nav__list .current-menu-item > a,
.ei-nav__list .current_page_item > a,
.ei-nav__list .current-menu-ancestor > a,
.ei-nav__list .current_page_ancestor > a,
.ei-nav__list a[aria-current="page"] {
	color: var(--ei-red, #f20d0d);
}

.ei-nav__list .current-menu-item > a::after,
.ei-nav__list .current_page_item > a::after,
.ei-nav__list .current-menu-ancestor > a::after,
.ei-nav__list .current_page_ancestor > a::after,
.ei-nav__list a[aria-current="page"]::after,
.ei-nav__list a:hover::after {
	transform: scaleX(1);
}

.ei-nav__list li {
	position: relative;
}

.ei-nav__list .sub-menu {
	position: absolute;
	top: calc(100% + .65rem);
	left: 50%;
	z-index: 40;
	display: grid;
	min-width: 18rem;
	margin: 0;
	padding: .65rem;
	list-style: none;
	background: #fff;
	border: 1px solid var(--ei-v1-hairline);
	border-radius: 2px;
	box-shadow: 0 20px 45px rgba(0, 0, 0, .1);
	opacity: 0;
	pointer-events: none;
	transform: translateX(-50%) translateY(.35rem);
	transition: opacity .16s ease, transform .16s ease;
}

.ei-nav__list .sub-menu::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100%;
	height: .75rem;
}

.ei-nav__list li:hover > .sub-menu,
.ei-nav__list li:focus-within > .sub-menu {
	opacity: 1;
	pointer-events: auto;
	transform: translateX(-50%) translateY(0);
}

.ei-nav__list .sub-menu li {
	border: 0;
}

.ei-nav__list .sub-menu a {
	padding: .78rem .85rem;
	color: var(--ei-black, #050505);
	font-size: .76rem;
	letter-spacing: .045em;
	line-height: 1.2;
	text-transform: none;
	white-space: normal;
}

.ei-nav__list .sub-menu a::after {
	left: .85rem;
	right: auto;
	bottom: .48rem;
	width: 1.25rem;
	transform-origin: left center;
}

.ei-nav__list .sub-menu a:hover,
.ei-nav__list .sub-menu a:focus-visible,
.ei-nav__list .sub-menu .current-menu-item > a,
.ei-nav__list .sub-menu .current_page_item > a {
	color: var(--ei-red, #f20d0d);
}

.ei-header__cta {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	padding: .95rem 1.6rem;
	background: var(--ei-red, #f20d0d);
	border: 1px solid var(--ei-red, #f20d0d);
	border-radius: 2px;
	color: #fff;
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .1em;
	line-height: 1;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color .18s ease, border-color .18s ease;
}

.ei-header__cta:hover,
.ei-header__cta:focus-visible {
	background: var(--ei-black, #050505);
	border-color: var(--ei-black, #050505);
	color: #fff;
}

.ei-header__cta svg {
	flex: none;
}

/* 3. Mobile navigation ----------------------------------------------------- */

.ei-burger {
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	background: none;
	border: 1px solid var(--ei-v1-hairline);
	border-radius: 2px;
	cursor: pointer;
}

.ei-burger__bars,
.ei-burger__bars::before,
.ei-burger__bars::after {
	display: block;
	width: 20px;
	height: 2px;
	background: var(--ei-black, #050505);
	transition: transform .2s ease, opacity .2s ease;
}

.ei-burger__bars::before,
.ei-burger__bars::after {
	content: "";
	position: relative;
}

.ei-burger__bars::before { top: -6px; }
.ei-burger__bars::after { top: 4px; }

.ei-burger[aria-expanded="true"] .ei-burger__bars { background: transparent; }
.ei-burger[aria-expanded="true"] .ei-burger__bars::before { transform: translateY(6px) rotate(45deg); }
.ei-burger[aria-expanded="true"] .ei-burger__bars::after { transform: translateY(-4px) rotate(-45deg); }

/* 4. Footer ---------------------------------------------------------------- */

.ei-footer {
	position: relative;
	background: var(--ei-v1-dark);
	color: #b9b9b9;
	font-size: .875rem;
}

.ei-footer::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 2px;
	background: var(--ei-red, #f20d0d);
}

.ei-footer__inner {
	display: grid;
	/* Brand column only slightly wider than the two link columns: a 1.5fr
	   track left a visible void between the slogan and the navigation. */
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(1.5rem, 4vw, 3rem);
	align-items: start;
	padding-block: clamp(2.75rem, 5vw, 4rem);
}

.ei-footer__brand img {
	display: block;
	width: auto;
	height: 62px;
	margin-bottom: 1.15rem;
}

.ei-footer__slogan {
	margin: 0;
	max-width: 32ch;
	color: #a5a5a5;
	font-size: .9375rem;
	line-height: 1.7;
}

.ei-footer__title {
	margin: 0 0 1rem;
	color: #fff;
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
}

.ei-footer__list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: .6rem;
	font-size: .9375rem;
}

.ei-footer__list a,
.ei-footer a {
	color: #b9b9b9;
	text-decoration: none;
	transition: color .18s ease;
}

.ei-footer__list a:hover,
.ei-footer a:hover,
.ei-footer a:focus-visible {
	color: var(--ei-red, #f20d0d);
}

.ei-footer__contact {
	display: grid;
	gap: .6rem;
	font-size: .9375rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ei-footer__social {
	display: flex;
	gap: .5rem;
	margin-top: 1.75rem;
	padding: 0;
	list-style: none;
}

.ei-footer__social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border: 1px solid #2c2c2c;
	border-radius: 50%;
	color: #cfcfcf;
	transition: border-color .18s ease, color .18s ease;
}

.ei-footer__social a:hover {
	border-color: var(--ei-red, #f20d0d);
	color: var(--ei-red, #f20d0d);
}

.ei-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	padding-block: 1.25rem;
	border-top: 1px solid #232323;
	color: #7d7d7d;
	font-size: .8125rem;
}

.ei-footer__legal {
	display: flex;
	gap: 1.25rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* 5. Breadcrumb ------------------------------------------------------------ */

.easyit-breadcrumb {
	padding-block: 1.25rem .25rem;
	color: var(--ei-v1-muted);
	font-size: .75rem;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.easyit-breadcrumb a {
	color: var(--ei-v1-muted);
	text-decoration: none;
}

.easyit-breadcrumb a:hover { color: var(--ei-red, #f20d0d); }

.easyit-breadcrumb span[aria-current] { color: var(--ei-black, #050505); }

/* 6. Hero ------------------------------------------------------------------ */

.easyit-v1-hero {
	position: relative;
	overflow: hidden;
	background: #fff;
}

.easyit-v1-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
	align-items: center;
	gap: clamp(1.5rem, 3.5vw, 3rem);
	padding-block: clamp(2.25rem, 5vw, 3.75rem) clamp(1.75rem, 3.5vw, 2.75rem);
}

.easyit-v1-eyebrow {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin: 0 0 1.25rem;
	color: var(--ei-v1-muted);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .22em;
	text-transform: uppercase;
}

.easyit-v1-eyebrow::before {
	content: "";
	width: 28px;
	height: 2px;
	background: var(--ei-red, #f20d0d);
}

/* The colour has to sit on this class, not on the `h1` element rule below it:
   inside Elementor the class lands on the widget wrapper and the bridge makes
   the inner <h1> inherit, so a rule written for the element never applies and
   the heading picks up whatever colour Elementor's own chain happens to carry. */
.easyit-v1-h1 {
	margin: 0 0 1.5rem;
	color: var(--ei-black, #050505);
	font-size: clamp(2rem, 3.6vw, 3.1rem);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -.025em;
	text-wrap: balance;
}

/* Last line of the H1 is red — locked across every V1 page. */
.easyit-v1-h1 .ei-red { color: var(--ei-red, #f20d0d); }

.easyit-v1-lead {
	margin: 0 0 2rem;
	max-width: 46ch;
	color: var(--ei-v1-body);
	font-size: 1rem;
	line-height: 1.75;
}

.easyit-v1-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;
}

/* Photo with the approved diagonal cut. The clip is applied to a wrapper so
   the <img> itself stays a normal, lazy-loadable, responsive image. */
.easyit-v1-hero__media {
	position: relative;
}

.easyit-v1-hero__media img {
	display: block;
	width: 100%;
	height: 100%;
	max-height: 31rem;
	object-fit: cover;
	clip-path: polygon(12% 0, 100% 0, 100% 100%, 0 100%);
}

.easyit-v1-hero__media::after {
	content: "";
	position: absolute;
	left: 6%;
	top: 8%;
	width: 0;
	height: 0;
	border-left: 34px solid var(--ei-red, #f20d0d);
	border-top: 22px solid transparent;
	border-bottom: 22px solid transparent;
	pointer-events: none;
}

/* 7. Section label --------------------------------------------------------- */

.easyit-v1-section {
	padding-block: clamp(2.75rem, 6vw, 4.5rem);
}

.easyit-v1-label {
	margin: 0 auto clamp(1.75rem, 3vw, 2.75rem);
	text-align: center;
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--ei-black, #050505);
}

.easyit-v1-label::after {
	content: "";
	display: block;
	width: 46px;
	height: 2px;
	margin: .7rem auto 0;
	background: var(--ei-red, #f20d0d);
}

.easyit-v1-label--sub {
	display: block;
	margin-top: .6rem;
	color: var(--ei-v1-muted);
	font-size: .875rem;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
}

/* 8. Services strip (8 across, divided) ------------------------------------ */

.easyit-v1-strip {
	display: grid;
	grid-template-columns: repeat(8, minmax(0, 1fr));
}

.easyit-v1-strip__item {
	position: relative;
	padding: .5rem clamp(.5rem, 1.2vw, 1rem);
	text-align: center;
	text-decoration: none;
	color: inherit;
	display: block;
	transition: background-color .18s ease;
}

.easyit-v1-strip__item + .easyit-v1-strip__item::before {
	content: "";
	position: absolute;
	left: 0;
	top: 10%;
	bottom: 10%;
	width: 1px;
	background: var(--ei-v1-hairline);
}

.easyit-v1-strip__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 40px;
	margin-bottom: .9rem;
	color: var(--ei-black, #050505);
}

.easyit-v1-strip__item:hover,
.easyit-v1-strip__item:focus-within {
	background: #fffafa;
}

.easyit-v1-strip__item:hover .easyit-v1-strip__icon,
.easyit-v1-strip__item:focus-within .easyit-v1-strip__icon {
	color: var(--ei-red, #f20d0d);
}

.easyit-v1-strip__title {
	margin: 0 0 .5rem;
	font-size: .8125rem;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ei-black, #050505);
}

.easyit-v1-strip__title .elementor-heading-title {
	color: inherit;
	font-weight: inherit;
}

.easyit-v1-strip__item:hover .easyit-v1-strip__title,
.easyit-v1-strip__item:hover .easyit-v1-strip__title .elementor-heading-title,
.easyit-v1-strip__item:focus-within .easyit-v1-strip__title,
.easyit-v1-strip__item:focus-within .easyit-v1-strip__title .elementor-heading-title {
	color: var(--ei-red, #f20d0d);
}

.easyit-v1-strip__text {
	margin: 0;
	color: #5f5f5f;
	font-size: .9375rem;
	line-height: 1.6;
}

.easyit-v1-strip__text p {
	color: inherit;
	font-size: inherit !important;
	line-height: inherit;
}

.easyit-v1-strip__item:hover .easyit-v1-strip__text,
.easyit-v1-strip__item:focus-within .easyit-v1-strip__text {
	color: #5f5f5f;
}

/* 9. Feature cards (4 x 2 outlined) ---------------------------------------- */

.easyit-v1-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr));
	gap: 1.25rem;
}

/* Icon left, copy right. Declared as a grid rather than flex so it survives
   Elementor wrapping each part in its own widget div. */
.easyit-v1-card,
.easyit-v1-card > .elementor-widget-wrap {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	column-gap: 1rem;
	row-gap: .35rem;
	align-content: start;
}

.easyit-v1-card {
	padding: 1.5rem;
	background: #fff;
	border: 1px solid var(--ei-v1-hairline);
	border-radius: 2px;
	transition: border-color .18s ease, transform .18s ease;
}

.easyit-v1-card > .elementor-widget-wrap { padding: 0; }

.easyit-v1-card__icon { grid-row: 1 / span 2; grid-column: 1; }
.easyit-v1-card__title,
.easyit-v1-card__text { grid-column: 2; }

.easyit-v1-card .elementor-widget:not(:last-child) { margin-bottom: 0; }

.easyit-v1-card:hover {
	border-color: var(--ei-red, #f20d0d);
	transform: translateY(-2px);
}

.easyit-v1-card__icon {
	flex: none;
	color: var(--ei-red, #f20d0d);
}

.easyit-v1-card__title {
	margin: 0 0 .45rem;
	font-size: .9375rem;
	font-weight: 700;
	color: var(--ei-black, #050505);
}

.easyit-v1-card__text {
	margin: 0;
	color: var(--ei-v1-muted);
	font-size: .8125rem;
	line-height: 1.65;
}

/* 10. Dark process timeline ------------------------------------------------ */

.easyit-v1-process {
	position: relative;
	overflow: hidden;
	background: var(--ei-v1-dark);
	color: #cfcfcf;
	padding-block: clamp(2.75rem, 6vw, 4.25rem);
}

.easyit-v1-process .easyit-v1-label { color: #fff; }

/* Faint geometric line art, drawn in CSS so it costs no request. */
.easyit-v1-process::before,
.easyit-v1-process::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 260px;
	height: 260px;
	transform: translateY(-50%) rotate(45deg);
	border: 1px solid rgba(242, 13, 13, .18);
	pointer-events: none;
}

.easyit-v1-process::before { left: -130px; }
.easyit-v1-process::after { right: -130px; }

.easyit-v1-steps {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 1rem;
	position: relative;
}

.easyit-v1-step {
	text-align: center;
	position: relative;
}

.easyit-v1-step + .easyit-v1-step::before {
	content: "";
	position: absolute;
	left: -50%;
	top: 18px;
	width: 100%;
	border-top: 1px dashed #4a4a4a;
}

.easyit-v1-step__num {
	display: block;
	color: var(--ei-red, #f20d0d);
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -.02em;
}

.easyit-v1-step__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 38px;
	margin: .75rem 0 .6rem;
	color: #fff;
}

.easyit-v1-step__title {
	margin: 0 0 .4rem;
	color: #fff;
	font-size: .9375rem;
	font-weight: 700;
}

.easyit-v1-step__text {
	margin: 0;
	color: #9a9a9a;
	font-size: .8125rem;
	line-height: 1.65;
}

/* 11. Why row -------------------------------------------------------------- */

.easyit-v1-why {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(11rem, 100%), 1fr));
	gap: 1.5rem;
}

.easyit-v1-why__item {
	position: relative;
	padding-inline: 1.25rem;
}

.easyit-v1-why__item + .easyit-v1-why__item::before {
	content: "";
	position: absolute;
	left: 0;
	top: 6%;
	bottom: 6%;
	width: 1px;
	background: var(--ei-v1-hairline);
}

.easyit-v1-why__icon {
	margin-bottom: .85rem;
	color: var(--ei-red, #f20d0d);
}

.easyit-v1-why__title {
	margin: 0 0 .4rem;
	font-size: .9375rem;
	font-weight: 700;
	color: var(--ei-black, #050505);
}

.easyit-v1-why__text {
	margin: 0;
	color: var(--ei-v1-muted);
	font-size: .8125rem;
	line-height: 1.65;
}

/* 12. Reference / project cards -------------------------------------------- */

.easyit-v1-refs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr));
	gap: 1.25rem;
}

.easyit-v1-ref {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 2px;
	background: var(--ei-v1-dark);
	text-decoration: none;
	aspect-ratio: 4 / 3;
}

.easyit-v1-ref img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: .55;
	transition: transform .35s ease, opacity .35s ease;
}

.easyit-v1-ref:hover img {
	transform: scale(1.04);
	opacity: .42;
}

.easyit-v1-ref__body {
	position: absolute;
	inset: auto 0 0;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: .75rem;
	padding: 1.25rem;
	background: linear-gradient(to top, rgba(0, 0, 0, .82), rgba(0, 0, 0, 0));
}

.easyit-v1-ref__title {
	margin: 0 0 .25rem;
	color: #fff;
	font-size: .9375rem;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.easyit-v1-ref__meta {
	margin: 0;
	color: #cfcfcf;
	font-size: .8125rem;
}

.easyit-v1-ref__arrow {
	flex: none;
	color: #fff;
}

.easyit-v1-ref--logo {
	background: #fff;
	border: 1px solid var(--ei-v1-hairline);
}

.easyit-v1-ref--logo img {
	position: absolute;
	inset: 1.25rem 1.25rem 4.6rem;
	width: calc(100% - 2.5rem);
	height: calc(100% - 5.85rem);
	object-fit: contain;
	opacity: 1;
	background: #fff;
}

.easyit-v1-ref--logo:hover img {
	transform: scale(1.02);
	opacity: 1;
}

.easyit-v1-ref--logo .easyit-v1-ref__body {
	background: linear-gradient(to top, rgba(0, 0, 0, .9), rgba(0, 0, 0, .34));
}

/* Until real project photography is supplied the tile carries the brand
   triangle instead of a stand-in photo. */
.easyit-v1-ref:not(:has(img))::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 38%;
	width: 0;
	height: 0;
	transform: translate(-50%, -50%);
	border-bottom: 54px solid rgba(242, 13, 13, .85);
	border-left: 32px solid transparent;
	border-right: 32px solid transparent;
}

.easyit-v1-ref:not(:has(img))::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(135deg, rgba(255, 255, 255, .05) 0 40%, transparent 40%),
		var(--ei-v1-dark-2);
	z-index: -1;
}

/* Case card (Reference page) */
.easyit-v1-case {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--ei-v1-hairline);
	border-radius: 2px;
	overflow: hidden;
}

.easyit-v1-case img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

.easyit-v1-case__body { padding: 1.25rem 1.35rem 1.5rem; }

.easyit-v1-case__tag {
	display: block;
	margin-bottom: .5rem;
	color: var(--ei-red, #f20d0d);
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
}

.easyit-v1-case__title {
	margin: 0 0 .5rem;
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--ei-black, #050505);
}

.easyit-v1-case__text {
	margin: 0;
	color: var(--ei-v1-muted);
	font-size: .8125rem;
	line-height: 1.65;
}

/* 13. Product cards (TenderPro / AssetPro / ClubPro) ------------------------ */

.easyit-v1-products {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr));
	gap: 1.25rem;
}

.easyit-v1-product {
	display: flex;
	flex-direction: column;
	gap: .9rem;
	padding: 1.75rem;
	background: #fff;
	border: 1px solid var(--ei-v1-hairline);
	border-radius: 2px;
	transition: border-color .18s ease;
}

.easyit-v1-product:hover { border-color: var(--ei-red, #f20d0d); }

.easyit-v1-product__logo {
	display: flex;
	align-items: center;
	height: 46px;
}

.easyit-v1-product__logo img {
	max-height: 42px;
	width: auto;
	object-fit: contain;
}

/* AssetPro has no supplied logo yet: a clearly replaceable text lockup, never
   an invented mark. Swap the <span> for an <img> when the original arrives. */
.easyit-v1-product__wordmark {
	font-size: 1.5rem;
	font-weight: 700;
	letter-spacing: -.02em;
	color: var(--ei-black, #050505);
}

.easyit-v1-product__wordmark .ei-red { color: var(--ei-red, #f20d0d); }

.easyit-v1-product__text {
	margin: 0;
	color: var(--ei-v1-muted);
	font-size: .875rem;
	line-height: 1.7;
}

/* 14. Logo strip ----------------------------------------------------------- */

.easyit-v1-logos {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: clamp(1.25rem, 4vw, 3rem);
	padding: 1.75rem clamp(1rem, 3vw, 2rem);
	background: #fff;
	border: 1px solid var(--ei-v1-hairline);
	border-radius: 2px;
}

.easyit-v1-logos__item {
	color: #6b6b6b;
	font-size: .9375rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	white-space: nowrap;
}

/* 15. Stat row ------------------------------------------------------------- */

.easyit-v1-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(12rem, 100%), 1fr));
	gap: 1.5rem;
}

.easyit-v1-stat {
	position: relative;
	padding-inline: 1.25rem;
}

.easyit-v1-stat + .easyit-v1-stat::before {
	content: "";
	position: absolute;
	left: 0;
	top: 8%;
	bottom: 8%;
	width: 1px;
	background: var(--ei-v1-hairline);
}

.easyit-v1-stat__title {
	margin: 0 0 .35rem;
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--ei-black, #050505);
}

.easyit-v1-stat__text {
	margin: 0;
	color: var(--ei-v1-muted);
	font-size: .8125rem;
	line-height: 1.65;
}

/* 16. Contact -------------------------------------------------------------- */

.easyit-v1-contact {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
	gap: clamp(1.5rem, 4vw, 2.5rem);
	align-items: start;
}

.easyit-v1-panel {
	padding: clamp(1.5rem, 3vw, 2.25rem);
	background: #fff;
	border: 1px solid var(--ei-v1-hairline);
	border-radius: 2px;
}

.easyit-v1-panel__title {
	margin: 0 0 1.5rem;
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--ei-red, #f20d0d);
}

.easyit-form {
	display: grid;
	gap: 1rem;
}

.easyit-form__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}

.easyit-form label {
	display: block;
	margin-bottom: .35rem;
	color: var(--ei-black, #050505);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .06em;
}

.easyit-form input[type="text"],
.easyit-form input[type="email"],
.easyit-form input[type="tel"],
.easyit-form select,
.easyit-form textarea {
	width: 100%;
	padding: .85rem .9rem;
	background: #fff;
	border: 1px solid #dcdcdc;
	border-radius: 2px;
	color: var(--ei-black, #050505);
	font: inherit;
	font-size: .9375rem;
}

.easyit-form textarea { min-height: 9rem; resize: vertical; }

.easyit-form input:focus-visible,
.easyit-form select:focus-visible,
.easyit-form textarea:focus-visible {
	outline: 2px solid var(--ei-red, #f20d0d);
	outline-offset: 1px;
	border-color: var(--ei-red, #f20d0d);
}

.easyit-form__consent {
	display: flex;
	align-items: flex-start;
	gap: .65rem;
	color: var(--ei-v1-body);
	font-size: .8125rem;
	line-height: 1.6;
}

.easyit-form__consent input { margin-top: .2rem; flex: none; }

.easyit-form__note {
	margin: 0;
	color: var(--ei-v1-muted);
	font-size: .75rem;
}

.easyit-contact-list {
	display: grid;
	gap: 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.easyit-contact-list li {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
}

.easyit-contact-list__icon {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: #fdecec;
	border-radius: 50%;
	color: var(--ei-red, #f20d0d);
}

.easyit-contact-list__label {
	display: block;
	margin-bottom: .2rem;
	color: var(--ei-v1-muted);
	font-size: .75rem;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.easyit-contact-list__value {
	color: var(--ei-black, #050505);
	font-size: 1.0625rem;
	font-weight: 700;
	text-decoration: none;
	overflow-wrap: anywhere;
}

.easyit-contact-list__value:hover { color: var(--ei-red, #f20d0d); }

/* 17. CTA band ------------------------------------------------------------- */

.easyit-v1-cta {
	background: #f5f5f5;
	padding-block: clamp(2rem, 4vw, 3rem);
}

.easyit-v1-cta__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.3fr) auto minmax(0, 1fr) auto;
	align-items: center;
	gap: clamp(1.25rem, 3vw, 2.5rem);
}

.easyit-v1-cta__title {
	margin: 0 0 .6rem;
	color: var(--ei-black, #050505);
	font-size: clamp(1.25rem, 2.2vw, 1.75rem);
	font-weight: 700;
	line-height: 1.2;
}

.easyit-v1-cta__text {
	margin: 0;
	color: var(--ei-v1-muted);
	font-size: .875rem;
	line-height: 1.7;
}

.easyit-v1-cta__mark {
	color: var(--ei-red, #f20d0d);
}

.easyit-v1-cta__contact {
	display: grid;
	gap: .75rem;
	padding-left: clamp(1rem, 3vw, 2rem);
	border-left: 1px solid #dcdcdc;
}

.easyit-v1-cta__contact a {
	display: inline-flex;
	align-items: center;
	gap: .7rem;
	color: var(--ei-black, #050505);
	font-size: .9375rem;
	font-weight: 600;
	text-decoration: none;
}

.easyit-v1-cta__contact a:hover { color: var(--ei-red, #f20d0d); }

.easyit-v1-cta__contact svg { color: var(--ei-red, #f20d0d); flex: none; }

/* Red full-width CTA band (About page variant) */
.easyit-v1-cta--red {
	background: var(--ei-red, #f20d0d);
	color: #fff;
}

.easyit-v1-cta--red .easyit-v1-cta__inner {
	grid-template-columns: minmax(0, 1fr) auto;
}

.easyit-v1-cta--red .easyit-v1-cta__title,
.easyit-v1-cta--red .easyit-v1-cta__text { color: #fff; }

.easyit-v1-cta--red .ei-btn {
	background: #fff;
	border-color: #fff;
	color: var(--ei-red, #f20d0d);
}

.easyit-v1-cta--red .ei-btn:hover {
	background: var(--ei-v1-dark);
	border-color: var(--ei-v1-dark);
	color: #fff;
}

/* 18. Buttons and links ---------------------------------------------------- */

.ei-btn {
	display: inline-flex;
	align-items: center;
	gap: .7rem;
	padding: 1rem 1.75rem;
	background: var(--ei-red, #f20d0d);
	border: 1px solid var(--ei-red, #f20d0d);
	border-radius: 2px;
	color: #fff;
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .1em;
	line-height: 1;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

.ei-btn:hover,
.ei-btn:focus-visible {
	background: var(--ei-black, #050505);
	border-color: var(--ei-black, #050505);
	color: #fff;
}

.ei-btn--ghost {
	background: #fff;
	color: var(--ei-red, #f20d0d);
}

.ei-btn--ghost:hover,
.ei-btn--ghost:focus-visible {
	background: var(--ei-red, #f20d0d);
	border-color: var(--ei-red, #f20d0d);
	color: #fff;
}

.ei-link {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	color: var(--ei-red, #f20d0d);
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	text-decoration: none;
}

.ei-link:hover { color: var(--ei-black, #050505); }

.easyit-v1-center { text-align: center; }
.easyit-v1-center .easyit-v1-lead { margin-inline: auto; }

.easyit-v1-prose {
	max-width: 68ch;
	color: var(--ei-v1-body);
	font-size: 1rem;
	line-height: 1.8;
}

.easyit-v1-prose h2 {
	margin: 2rem 0 .85rem;
	font-size: clamp(1.35rem, 2.4vw, 1.85rem);
}

.easyit-v1-prose h3 {
	margin: 1.5rem 0 .6rem;
	font-size: 1.0625rem;
}

.easyit-v1-prose > *:first-child { margin-top: 0; }

.easyit-v1-bullets {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: .6rem;
}

.easyit-v1-bullets li {
	position: relative;
	padding-left: 1.5rem;
	color: var(--ei-v1-body);
	font-size: .9375rem;
	line-height: 1.7;
}

.easyit-v1-bullets li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .6em;
	width: 0;
	height: 0;
	border-left: 8px solid var(--ei-red, #f20d0d);
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
}

.easyit-v1-light { background: #f7f7f7; }

/* 19. Responsive ----------------------------------------------------------- */

@media (max-width: 74rem) {
	.easyit-v1-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.easyit-v1-strip__item:nth-child(4n + 1)::before { display: none; }
	.easyit-v1-strip__item:nth-child(n + 5) { margin-top: 1.75rem; }
}

@media (max-width: 64rem) {
	.easyit-v1-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 2rem; }
	.easyit-v1-step::before { display: none; }
	.easyit-v1-cta__inner { grid-template-columns: 1fr 1fr; }
	.easyit-v1-cta__mark { display: none; }
	.ei-footer__inner { grid-template-columns: 1fr 1fr; }
}

/* Tablet / mobile navigation switch */
@media (max-width: 60rem) {
	.ei-burger { display: inline-flex; }

	.ei-header__cta { display: none; }

	.ei-nav {
		position: absolute;
		left: 0;
		right: 0;
		top: 100%;
		display: none;
		padding: 1rem var(--ei-v1-pad) 1.75rem;
		background: #fff;
		border-bottom: 1px solid var(--ei-v1-hairline);
		box-shadow: 0 18px 40px rgba(0, 0, 0, .08);
	}

	.ei-header { position: sticky; }
	.ei-header__inner { position: relative; }
	.ei-nav.is-open { display: block; }

	.ei-nav__list {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.ei-nav__list li { border-bottom: 1px solid var(--ei-v1-hairline); }

	.ei-nav__list a { padding: .95rem 0; font-size: .875rem; }

	.ei-nav__list a::after { display: none; }

	.ei-nav__list .sub-menu {
		position: static;
		display: none;
		min-width: 0;
		margin: -.2rem 0 .65rem;
		padding: 0 0 .45rem 1rem;
		background: transparent;
		border: 0;
		box-shadow: none;
		opacity: 1;
		pointer-events: auto;
		transform: none;
		transition: none;
	}

	.ei-nav__list li:hover > .sub-menu,
	.ei-nav__list li:focus-within > .sub-menu {
		transform: none;
	}

	.ei-nav__list .sub-menu::before { display: none; }

	.ei-nav__list .menu-item-has-children.is-submenu-open > .sub-menu {
		display: grid;
	}

	.ei-nav__list .menu-item-has-children > a {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 1rem;
	}

	.ei-nav__list .menu-item-has-children > a::before {
		content: "+";
		order: 2;
		color: var(--ei-red, #f20d0d);
		font-size: 1rem;
		line-height: 1;
	}

	.ei-nav__list .menu-item-has-children.is-submenu-open > a::before {
		content: "-";
	}

	.ei-nav__list .sub-menu a {
		padding: .72rem 0;
		font-size: .82rem;
	}

	.ei-nav__list .sub-menu a::after {
		display: none;
	}

	.ei-nav__cta {
		display: inline-flex;
		justify-content: center;
		width: 100%;
		margin-top: 1.25rem;
	}
}

@media (min-width: 60.0625rem) {
	.ei-nav__cta { display: none; }
}

@media (max-width: 48rem) {
	.easyit-v1-hero__grid {
		grid-template-columns: 1fr;
		gap: 1.75rem;
		padding-block: 1.75rem 2.5rem;
	}

	.easyit-v1-hero__media img {
		max-height: 15rem;
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	}

	.easyit-v1-hero__media::after { left: 4%; top: -14px; }

	.easyit-v1-hero__actions .ei-btn { flex: 1 1 100%; justify-content: center; }

	/* Approved mobile rule: services stay 2 across, 4 rows (4+4). */
	.easyit-v1-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1.75rem; }
	.easyit-v1-strip__item::before { display: none !important; }
	.easyit-v1-strip__item:nth-child(n + 5) { margin-top: 0; }
	.easyit-v1-strip__item:nth-child(odd) { border-right: 1px solid var(--ei-v1-hairline); }

	.easyit-v1-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }

	.easyit-v1-why__item::before,
	.easyit-v1-stat::before { display: none; }

	.easyit-v1-contact { grid-template-columns: 1fr; }

	.easyit-form__row { grid-template-columns: 1fr; }

	.easyit-v1-cta__inner { grid-template-columns: 1fr; text-align: left; }

	.easyit-v1-cta__contact {
		padding-left: 0;
		border-left: 0;
		border-top: 1px solid #dcdcdc;
		padding-top: 1.25rem;
	}

	.easyit-v1-cta .ei-btn { width: 100%; justify-content: center; }

	.ei-footer__inner { grid-template-columns: 1fr; gap: 2rem; }
	.ei-footer__bottom { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 30rem) {
	.easyit-v1-steps { grid-template-columns: 1fr; }
	.easyit-v1-strip__title { font-size: .875rem; }
}

@media (prefers-reduced-motion: reduce) {
	.easyit-v1-ref img,
	.easyit-v1-card,
	.ei-nav__list a::after {
		transition: none;
	}
}

/* ==========================================================================
   20. Elementor bridge
   --------------------------------------------------------------------------
   The V1 grid classes assume the class sits on the element that becomes the
   grid. On an Elementor *section* that element is one level down
   (.elementor-container) and Elementor sizes columns by percentage. These
   rules move the grid onto the inner container and hand sizing to the grid, so
   columns can be added or removed in the editor without touching widths.
   ========================================================================== */

.elementor-section.easyit-v1-strip,
.elementor-section.easyit-v1-cards,
.elementor-section.easyit-v1-steps,
.elementor-section.easyit-v1-why,
.elementor-section.easyit-v1-refs,
.elementor-section.easyit-v1-products,
.elementor-section.easyit-v1-stats,
.elementor-section.easyit-v1-contact,
.elementor-section.easyit-v1-hero__grid,
.elementor-section.easyit-v1-cta__inner {
	display: block;
}

.elementor-section.easyit-v1-strip > .elementor-container,
.elementor-section.easyit-v1-cards > .elementor-container,
.elementor-section.easyit-v1-steps > .elementor-container,
.elementor-section.easyit-v1-why > .elementor-container,
.elementor-section.easyit-v1-refs > .elementor-container,
.elementor-section.easyit-v1-products > .elementor-container,
.elementor-section.easyit-v1-stats > .elementor-container,
.elementor-section.easyit-v1-contact > .elementor-container,
.elementor-section.easyit-v1-hero__grid > .elementor-container,
.elementor-section.easyit-v1-cta__inner > .elementor-container {
	display: grid;
}

.elementor-section.easyit-v1-strip > .elementor-container { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.elementor-section.easyit-v1-cards > .elementor-container { grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); gap: 1.25rem; }
.elementor-section.easyit-v1-steps > .elementor-container { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem; }
.elementor-section.easyit-v1-why > .elementor-container { grid-template-columns: repeat(auto-fit, minmax(min(11rem, 100%), 1fr)); gap: 1.5rem; }
.elementor-section.easyit-v1-refs > .elementor-container { grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); gap: 1.25rem; }
.elementor-section.easyit-v1-products > .elementor-container { grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr)); gap: 1.25rem; }
.elementor-section.easyit-v1-stats > .elementor-container { grid-template-columns: repeat(auto-fit, minmax(min(12rem, 100%), 1fr)); gap: 1.5rem; }
.elementor-section.easyit-v1-contact > .elementor-container { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 2.5rem); align-items: start; }
.elementor-section.easyit-v1-hero__grid > .elementor-container { grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; }
.elementor-section.easyit-v1-cta__inner > .elementor-container { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto; gap: clamp(1.25rem, 3vw, 2.5rem); align-items: center; }

.elementor-section.easyit-v1-strip > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-cards > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-steps > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-why > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-refs > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-products > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-stats > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-contact > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-hero__grid > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-cta__inner > .elementor-container > .elementor-column {
	width: auto;
	max-width: none;
	min-width: 0;
}

/* Elementor wraps each widget; strip the default spacing inside dense cards so
   the V1 rhythm survives. */
.easyit-v1-strip__item .elementor-widget:not(:last-child),
.easyit-v1-step .elementor-widget:not(:last-child),
.easyit-v1-card .elementor-widget:not(:last-child) {
	margin-bottom: .5rem;
}

@media (max-width: 74rem) {
	.elementor-section.easyit-v1-strip > .elementor-container { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 1.75rem; }
}

@media (max-width: 64rem) {
	.elementor-section.easyit-v1-steps > .elementor-container { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 2rem; }
	.elementor-section.easyit-v1-cta__inner > .elementor-container { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 48rem) {
	.elementor-section.easyit-v1-strip > .elementor-container { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1.75rem; }
	.elementor-section.easyit-v1-steps > .elementor-container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.elementor-section.easyit-v1-contact > .elementor-container,
	.elementor-section.easyit-v1-hero__grid > .elementor-container,
	.elementor-section.easyit-v1-cta__inner > .elementor-container { grid-template-columns: 1fr; }
}

@media (max-width: 30rem) {
	.elementor-section.easyit-v1-steps > .elementor-container { grid-template-columns: 1fr; }
}

/* Contact form states -------------------------------------------------------*/

.easyit-form__hp {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

.easyit-form__alert {
	margin: 0 0 1.25rem;
	padding: .9rem 1.1rem;
	border-left: 3px solid;
	border-radius: 2px;
	font-size: .875rem;
	line-height: 1.6;
}

.easyit-form__alert--ok {
	background: #f1f8f2;
	border-color: #2e7d32;
	color: #23602a;
}

.easyit-form__alert--error {
	background: #fdecec;
	border-color: var(--ei-red, #f20d0d);
	color: #a30d0d;
}

.easyit-form button.ei-btn { border: 1px solid var(--ei-red, #f20d0d); cursor: pointer; }

/* Template-introduced helpers ---------------------------------------------- */

/* Hero without an approved photograph yet (AI, Kontakt): brand geometry
   stands in, and the slot is a plain swap for an image when it arrives. */
.easyit-v1-hero__media--pending {
	aspect-ratio: 16 / 10;
	background-image: url("../img/easyit-geometry.svg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

/* Whole service tile is clickable without nesting a link inside a heading. */
.easyit-v1-strip__item { position: relative; }

.easyit-v1-strip__item .elementor-widget-html:has(.easyit-v1-strip__more) {
	position: absolute;
	inset: 0;
	z-index: 5;
	margin: 0;
}

.easyit-v1-strip__item .elementor-widget-html:has(.easyit-v1-strip__more) .elementor-widget-container {
	width: 100%;
	height: 100%;
}

.easyit-v1-strip__more {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 2px;
	z-index: 5;
}

.easyit-v1-strip__more:focus-visible {
	outline: 2px solid var(--ei-red, #f20d0d);
	outline-offset: 2px;
}

.easyit-v1-logos__lead {
	color: var(--ei-black, #050505);
	font-size: .75rem;
	letter-spacing: .16em;
}

/* About page: the six disciplines sit inside one column, so they need their
   own grid rather than the Elementor section bridge. */
.easyit-v1-cards--inline {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(14rem, 100%), 1fr));
	gap: 1rem;
}

.easyit-v1-cards--inline .easyit-v1-card { padding: 1.15rem; }

.easyit-v1-cards--inline .easyit-v1-card__icon {
	width: 26px;
	height: 26px;
	border-left: 12px solid var(--ei-red, #f20d0d);
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
	align-self: start;
}

.ei-product-logo { max-height: 42px; width: auto; }

.easyit-v1-section--tight { padding-block: clamp(1rem, 2vw, 1.75rem); }

/* Elementor wraps the hero photo shortcode in a widget div; the clip and the
   red triangle must apply to that wrapper. */
.easyit-v1-hero__media .elementor-widget-container { position: relative; display: block; }
.easyit-v1-hero__media img { border-radius: 2px; }

/* ==========================================================================
   21. Widget-wrapper bridge
   --------------------------------------------------------------------------
   Elementor puts a CSS class on the *widget wrapper*, not on the <h3> or <a>
   inside it. Without this, a wrapper that says "white text, 13px" is ignored
   by the element that actually renders the text. Making the inner element
   inherit keeps one declaration authoritative instead of duplicating every
   rule for two selectors.
   ========================================================================== */

.elementor-widget[class*="easyit-v1-"] .elementor-heading-title,
.elementor-widget[class*="easyit-v1-"] > .elementor-widget-container > p,
.elementor-widget[class*="easyit-v1-"] > .elementor-widget-container > ul,
.elementor-widget[class*="ei-"] .elementor-heading-title {
	font: inherit;
	color: inherit;
	letter-spacing: inherit;
	line-height: inherit;
	text-transform: inherit;
	margin: 0;
}

/* The button is the inner <a>; the wrapper only positions it. */
.elementor-widget.ei-btn,
.elementor-widget.ei-btn--ghost {
	display: inline-block;
	width: auto;
	padding: 0;
	background: none;
	border: 0;
	margin-right: .75rem;
}

.ei-btn .elementor-button {
	display: inline-flex;
	align-items: center;
	gap: .7rem;
	padding: 1rem 1.75rem;
	background: var(--ei-red, #f20d0d);
	border: 1px solid var(--ei-red, #f20d0d);
	border-radius: 2px;
	color: #fff;
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .1em;
	line-height: 1;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

.ei-btn .elementor-button:hover,
.ei-btn .elementor-button:focus-visible {
	background: var(--ei-black, #050505);
	border-color: var(--ei-black, #050505);
	color: #fff;
}

.ei-btn--ghost .elementor-button {
	background: #fff;
	color: var(--ei-red, #f20d0d);
}

.ei-btn--ghost .elementor-button:hover,
.ei-btn--ghost .elementor-button:focus-visible {
	background: var(--ei-red, #f20d0d);
	color: #fff;
}

/* Components that sit on a dark ground must win over the global heading
   colour, which is set on the body class. */
.ei-footer .ei-footer__title,
.easyit-v1-process .easyit-v1-step__title,
.easyit-v1-process .easyit-v1-label,
.easyit-v1-cta--red .easyit-v1-cta__title,
.easyit-v1-ref .easyit-v1-ref__title {
	color: #fff;
}

.easyit-v1-ref__title,
.easyit-v1-ref__meta,
.easyit-contact-list__label,
.easyit-contact-list__value {
	display: block;
}

/* Section label sits inside a full-width widget; keep it centred. */
.elementor-widget.easyit-v1-label,
.easyit-v1-label {
	width: 100%;
}

/* Section rhythm --------------------------------------------------------- */

/* A label section sits directly above the content it introduces; collapse the
   seam so they read as one block instead of two. */
.easyit-v1-section + .easyit-v1-section,
.easyit-v1-section + .easyit-v1-strip,
.easyit-v1-section + .easyit-v1-cards,
.easyit-v1-section + .easyit-v1-why,
.easyit-v1-section + .easyit-v1-refs,
.easyit-v1-section + .easyit-v1-products {
	padding-top: 0;
}

.easyit-v1-process + .easyit-v1-process { padding-top: 0; }

.easyit-v1-label { margin-bottom: clamp(1.5rem, 2.5vw, 2.25rem); }


/* Inside a bridged grid, Elementor's percentage column width would resolve
   against the grid track rather than the row, squeezing every card. Hand the
   sizing back to the grid — scoped to the bridged sections only, so ordinary
   flex sections keep their column widths. */
.elementor-section.easyit-v1-strip > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-cards > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-steps > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-why > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-refs > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-products > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-stats > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-contact > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-hero__grid > .elementor-container > .elementor-column,
.elementor-section.easyit-v1-cta__inner > .elementor-container > .elementor-column {
	width: auto !important;
}

/* Placeholder notice — used where a section is waiting on real assets. */
.easyit-v1-pending {
	max-width: 62ch;
	margin: 0 auto 1.25rem;
	padding-left: .9rem;
	border-left: 2px solid var(--ei-red, #f20d0d);
	color: var(--ei-v1-muted);
	font-size: .8125rem;
	line-height: 1.65;
	text-align: left;
}

/* A label section introduces the block right below it; the label's own margin
   is the whole gap, so the section adds none of its own underneath. */
.easyit-v1-section--label { padding-bottom: 0; }

.easyit-v1-process.easyit-v1-section--label,
.easyit-v1-process:has(.easyit-v1-label) { padding-bottom: 0; }

/* -------------------------------------------------------------------------
   21. Elementor Kit defaults
   ----------------------------------------------------------------------

   Elementor's Kit stylesheet is enqueued after the theme's, and its widget
   defaults carry the same specificity as the bridge above:

     .elementor-widget-button .elementor-button { background-color: var(--e-global-color-accent); font-family: ... }
     .elementor-widget-wrap > .elementor-element { width: 100% }
     .elementor-widget-text-editor { font-family: ... }

   On equal specificity the later sheet wins, so on a real Elementor install
   the buttons came out green, full width and set in Roboto. These rules add
   one class of specificity so the design system wins on its own, without
   depending on Elementor's "disable default colours / fonts" settings.
   -------------------------------------------------------------------- */

.elementor-widget[class*="easyit-v1-"],
.elementor-widget[class*="ei-"] {
	font-family: inherit;
}

.elementor-widget-wrap > .elementor-widget.ei-btn,
.elementor-widget-wrap > .elementor-widget.ei-btn--ghost {
	width: auto;
}

.elementor-widget.ei-btn .elementor-button {
	background-color: var(--ei-red, #f20d0d);
	font-family: inherit;
	font-weight: 700;
}

.elementor-widget.ei-btn .elementor-button:hover,
.elementor-widget.ei-btn .elementor-button:focus-visible {
	background-color: var(--ei-black, #050505);
}

.elementor-widget.ei-btn--ghost .elementor-button {
	background-color: #fff;
}

.elementor-widget.ei-btn--ghost .elementor-button:hover,
.elementor-widget.ei-btn--ghost .elementor-button:focus-visible {
	background-color: var(--ei-red, #f20d0d);
}

/* The red CTA band inverts the button. The existing rule targets .ei-btn,
   which under Elementor is the widget wrapper rather than the visible <a>. */
.easyit-v1-cta--red .elementor-widget.ei-btn .elementor-button {
	background-color: #fff;
	border-color: #fff;
	color: var(--ei-red, #f20d0d);
}

.easyit-v1-cta--red .elementor-widget.ei-btn .elementor-button:hover,
.easyit-v1-cta--red .elementor-widget.ei-btn .elementor-button:focus-visible {
	background-color: var(--ei-v1-dark);
	border-color: var(--ei-v1-dark);
	color: #fff;
}

/* The global header and footer are 1240px wide. Elementor's boxed container
   defaults to its Kit width (1140px), which left every page section indented
   50px against the chrome above it. Match the two for V1 sections only, so a
   content width chosen later in Site Settings still governs anything else. */
.elementor-section[class*="easyit-v1-"].elementor-section-boxed > .elementor-container {
	max-width: var(--ei-v1-wrap, 1240px);
}

/* Elementor resets flex alignment on every widget with
   `.elementor-element:where(.e-con-full,.elementor-widget){align-items:var(--align-items);
   justify-content:var(--justify-content)}`. `:where()` contributes nothing to
   specificity, so that rule ties with a single design-system class and wins on
   load order — icons ended up flush left instead of centred. Re-assert the
   alignment for the classes that live on a widget wrapper. */
.elementor-widget.easyit-v1-step__icon,
.elementor-widget.easyit-v1-strip__icon {
	align-items: center;
	justify-content: center;
}

.elementor-widget.easyit-v1-product__logo {
	align-items: center;
}

/* Final Easy IT corrections: submenu, ghost buttons, About layout. */
.easyit-v1 .elementor-widget.ei-btn--ghost .elementor-button,
.easyit-v1 .elementor-widget-button.ei-btn--ghost .elementor-button,
.easyit-v1 .ei-btn--ghost.elementor-widget-button .elementor-button {
	background-color: #fff !important;
	border-color: var(--ei-red, #f20d0d) !important;
	color: var(--ei-red, #f20d0d) !important;
}

.easyit-v1 .elementor-widget.ei-btn--ghost .elementor-button:hover,
.easyit-v1 .elementor-widget.ei-btn--ghost .elementor-button:focus-visible,
.easyit-v1 .elementor-widget-button.ei-btn--ghost .elementor-button:hover,
.easyit-v1 .elementor-widget-button.ei-btn--ghost .elementor-button:focus-visible,
.easyit-v1 .ei-btn--ghost.elementor-widget-button .elementor-button:hover,
.easyit-v1 .ei-btn--ghost.elementor-widget-button .elementor-button:focus-visible {
	background-color: var(--ei-red, #f20d0d) !important;
	border-color: var(--ei-red, #f20d0d) !important;
	color: #fff !important;
}

body.page-id-28 .elementor-element-8c90c7b {
	padding-top: clamp(2.2rem, 5vw, 4.5rem);
	padding-bottom: clamp(2.5rem, 5vw, 4.75rem);
}

body.page-id-28 .elementor-element-8c90c7b > .elementor-container {
	display: grid;
	grid-template-columns: minmax(0, 1.45fr) minmax(20rem, .95fr);
	gap: clamp(2rem, 5vw, 4rem);
	align-items: start;
}

body.page-id-28 .elementor-element-8c90c7b > .elementor-container > .elementor-column {
	width: auto !important;
}

body.page-id-28 .elementor-element-8c90c7b .elementor-element-777a87b > .elementor-widget-wrap {
	align-content: start;
	padding-right: clamp(1rem, 3vw, 2.5rem);
}

body.page-id-28 .elementor-element-8c90c7b .easyit-v1-cards--inline {
	display: grid;
	grid-template-columns: 1fr;
	gap: .75rem;
}

body.page-id-28 .elementor-element-8c90c7b .easyit-v1-cards--inline .easyit-v1-card {
	min-height: 0;
	padding: .95rem 1.05rem;
	gap: .3rem .8rem;
	align-items: center;
}

body.page-id-28 .elementor-element-8c90c7b .easyit-v1-card__title {
	font-size: .98rem;
	line-height: 1.25;
}

body.page-id-28 .elementor-element-8c90c7b .easyit-v1-card__text {
	font-size: .85rem;
	line-height: 1.55;
}

@media (max-width: 60rem) {
	body.page-id-28 .elementor-element-8c90c7b > .elementor-container {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	body.page-id-28 .elementor-element-8c90c7b .elementor-element-777a87b > .elementor-widget-wrap {
		padding-right: 0;
	}
}

/* Service card system refinement ------------------------------------------------
   Shared card treatment plus controlled service-page grids. */
.easyit-v1 .easyit-v1-card {
	min-height: 0;
	padding: clamp(1.45rem, 2.2vw, 2rem);
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 2px;
	box-shadow: 0 8px 22px rgba(0, 0, 0, .035);
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.easyit-v1 .easyit-v1-card:hover,
.easyit-v1 .easyit-v1-card:focus-within {
	border-color: var(--ei-red, #f20d0d);
	background: #fffafa;
	box-shadow: 0 12px 28px rgba(0, 0, 0, .06);
	transform: translateY(-2px);
}

.easyit-v1 .easyit-v1-card,
.easyit-v1 .easyit-v1-card > .elementor-widget-wrap {
	column-gap: 1.05rem;
	row-gap: .45rem;
	align-items: start;
}

.easyit-v1 .easyit-v1-card > .elementor-widget-wrap {
	padding: 0;
}

.easyit-v1 .easyit-v1-card__icon {
	width: 2.85rem;
	height: 2.85rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(242, 13, 13, .08);
	border: 1px solid rgba(242, 13, 13, .14);
	border-radius: 999px;
	color: var(--ei-red, #f20d0d);
}

.easyit-v1 .easyit-v1-card__icon .elementor-widget-container,
.easyit-v1 .easyit-v1-card__icon .elementor-shortcode {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
}

.easyit-v1 .easyit-v1-card__icon svg {
	width: 1.85rem;
	height: 1.85rem;
	stroke-width: 1.8;
}

.easyit-v1 .easyit-v1-card__title {
	margin: 0 0 .35rem;
	color: var(--ei-black, #050505);
	font-size: clamp(1.0625rem, 1.1vw, 1.2rem);
	font-weight: 700;
	line-height: 1.25;
}

.easyit-v1 .easyit-v1-card__title .elementor-heading-title {
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}

.easyit-v1 .easyit-v1-card:hover .easyit-v1-card__title,
.easyit-v1 .easyit-v1-card:hover .easyit-v1-card__title .elementor-heading-title,
.easyit-v1 .easyit-v1-card:focus-within .easyit-v1-card__title,
.easyit-v1 .easyit-v1-card:focus-within .easyit-v1-card__title .elementor-heading-title {
	color: var(--ei-red, #f20d0d);
}

.easyit-v1 .easyit-v1-card__text {
	margin: 0;
	color: #5f5f5f;
	font-size: clamp(.9375rem, .98vw, 1rem);
	line-height: 1.6;
}

.easyit-v1 .easyit-v1-card__text p {
	margin: 0;
	color: inherit;
	font-size: inherit;
	line-height: inherit;
}

.easyit-v1 .easyit-v1-card:hover .easyit-v1-card__text,
.easyit-v1 .easyit-v1-card:focus-within .easyit-v1-card__text {
	color: #5f5f5f;
}

.easyit-v1 .easyit-v1-section--label .easyit-v1-lead,
.easyit-v1 .easyit-v1-cards + .easyit-v1-section .easyit-v1-lead {
	color: #666;
}

.easyit-v1 .easyit-v1-cards,
.easyit-v1 .elementor-section.easyit-v1-cards > .elementor-container {
	gap: clamp(1rem, 2vw, 1.35rem);
}

body.page-id-20 .elementor-section.easyit-v1-cards > .elementor-container,
body.page-id-21 .elementor-section.easyit-v1-cards > .elementor-container,
body.page-id-22 .elementor-section.easyit-v1-cards > .elementor-container,
body.page-id-25 .elementor-section.easyit-v1-cards > .elementor-container {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	max-width: min(100%, 66rem);
	margin-left: auto;
	margin-right: auto;
}

body.page-id-20 .elementor-section.easyit-v1-cards + .easyit-v1-section > .elementor-container,
body.page-id-21 .elementor-section.easyit-v1-cards + .easyit-v1-section > .elementor-container,
body.page-id-22 .elementor-section.easyit-v1-cards + .easyit-v1-section > .elementor-container,
body.page-id-25 .elementor-section.easyit-v1-cards + .easyit-v1-section > .elementor-container {
	max-width: min(100%, 66rem);
	margin-left: auto;
	margin-right: auto;
}

body.page-id-20 .elementor-section.easyit-v1-cards + .easyit-v1-section,
body.page-id-21 .elementor-section.easyit-v1-cards + .easyit-v1-section,
body.page-id-22 .elementor-section.easyit-v1-cards + .easyit-v1-section,
body.page-id-25 .elementor-section.easyit-v1-cards + .easyit-v1-section,
body.page-id-23 .elementor-section.easyit-v1-cards + .easyit-v1-section {
	padding-top: clamp(1.65rem, 3vw, 2.5rem);
}

body.page-id-23 .elementor-section.easyit-v1-cards > .elementor-container {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	max-width: min(100%, 72rem);
	margin-left: auto;
	margin-right: auto;
}

body.page-id-23 .elementor-section.easyit-v1-cards + .easyit-v1-section > .elementor-container {
	max-width: min(100%, 72rem);
	margin-left: auto;
	margin-right: auto;
}

@media (max-width: 68.75rem) {
	body.page-id-20 .elementor-section.easyit-v1-cards > .elementor-container,
	body.page-id-21 .elementor-section.easyit-v1-cards > .elementor-container,
	body.page-id-22 .elementor-section.easyit-v1-cards > .elementor-container,
	body.page-id-25 .elementor-section.easyit-v1-cards > .elementor-container,
	body.page-id-23 .elementor-section.easyit-v1-cards > .elementor-container {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 48rem) {
	body.page-id-20 .elementor-section.easyit-v1-cards > .elementor-container,
	body.page-id-21 .elementor-section.easyit-v1-cards > .elementor-container,
	body.page-id-22 .elementor-section.easyit-v1-cards > .elementor-container,
	body.page-id-25 .elementor-section.easyit-v1-cards > .elementor-container,
	body.page-id-23 .elementor-section.easyit-v1-cards > .elementor-container {
		grid-template-columns: 1fr;
	}

	.easyit-v1 .easyit-v1-card {
		padding: 1.25rem;
	}
}

/* Tighten icon box sizing after Elementor/grid alignment. */
.easyit-v1 .easyit-v1-card__icon {
	box-sizing: border-box;
	justify-self: start;
	align-self: start;
	width: 2.9rem !important;
	min-width: 2.9rem;
	max-width: 2.9rem;
	height: 2.9rem !important;
	min-height: 2.9rem;
	max-height: 2.9rem;
}

.easyit-v1 .easyit-v1-card__title {
	font-size: clamp(1.125rem, 1.15vw, 1.22rem);
	font-weight: 700;
}
