/*
 * Adenia – site CSS that Elementor has no control for.
 * Moved here from Elementor "Custom CSS" fields (elements + Site Settings).
 * Targets section CSS IDs and Elementor's own widget classes – no extra classes needed.
 */

/* ---------------------------------------------------------------
 * Heading line, hanging left (was: Site Settings → Custom CSS)
 * Add class "adenia-line" (+ colour / size class) to a Heading widget.
 * ------------------------------------------------------------- */
.adenia-line .elementor-heading-title { position: relative; }
.adenia-line .elementor-heading-title::before { content: ""; position: absolute; right: 100%; top: 0.6em; width: 52px; height: 2px; margin-right: 12px; background: var(--e-global-color-secondary); }
/* Small title line */
.adenia-line-sm .elementor-heading-title::before { width: 46px; }
/* Large title line (Priority Areas rows: 75×3px, 24px gap) */
@media (min-width: 768px) {
	.adenia-line-lg .elementor-heading-title::before { width: 75px; height: 3px; margin-right: 24px; }
	/* Medium-gap line (Our Culture rows: 75×3px, 15px gap) */
	.adenia-line-md .elementor-heading-title::before { width: 75px; height: 3px; margin-right: 15px; }
}
/* Laptop/tablet: section titles sit on the 80/72px gutter, so their line uses the standard 52px length to stay on screen */
@media (min-width: 768px) and (max-width: 1760px) {
	.adenia-line-lg h2.elementor-heading-title::before,
	.adenia-line-md h2.elementor-heading-title::before { width: 52px; height: 2px; margin-right: 12px; }
}
/* Line colours */
.adenia-line-orange .elementor-heading-title::before { background: var(--e-global-color-secondary); }
.adenia-line-white .elementor-heading-title::before { background: var(--e-global-color-adwhite); }
.adenia-line-navy .elementor-heading-title::before { background: var(--e-global-color-primary); }
/* Mobile: section titles get a line running in from the screen edge (mobile .ai); row sub-titles keep a short inline line */
@media (max-width: 767px) {
	.adenia-line .elementor-heading-title::before { width: 100vw; height: 1.5px; top: 0.62em; margin-right: 10px; }
	.adenia-line-md h3.elementor-heading-title::before,
	.adenia-line-lg h3.elementor-heading-title::before { position: static; display: inline-block; width: 30px; height: 2px; margin-right: 10px; vertical-align: middle; }
}

/* ---------------------------------------------------------------
 * Recent News + Our Story – dot pagination styled as the .ai bar: full-width white track (22.7px, 42px below the cards), navy pill on the current slide.
 * The carousels' Elementor dot size/colour controls are not available in this version.
 * ------------------------------------------------------------- */
#recent-news .elementor-widget-loop-carousel .swiper { padding-bottom: 65px; }
#our-story .elementor-widget-n-carousel .swiper { padding-bottom: 60px; }
#recent-news .elementor-widget-loop-carousel .swiper-pagination-bullets,
#our-story .elementor-widget-n-carousel .swiper-pagination-bullets { bottom: 0; top: auto; left: 0; width: 100%; transform: none; display: flex; gap: 0; padding: 0; height: 23px; background: var(--e-global-color-adwhite); border-radius: 12px; overflow: hidden; }
#recent-news .elementor-widget-loop-carousel .swiper-pagination-bullet,
#our-story .elementor-widget-n-carousel .swiper-pagination-bullet { flex: 1 1 0; width: auto; height: 100%; margin: 0 !important; opacity: 1; border-radius: 12px; background: transparent; border: 2px solid transparent; box-sizing: border-box; transition: background .3s, border-color .3s; }
#recent-news .elementor-widget-loop-carousel .swiper-pagination-bullet-active,
#our-story .elementor-widget-n-carousel .swiper-pagination-bullet-active { background: var(--e-global-color-primary); border-color: var(--e-global-color-adwhite); }
/* .ai Our Story: track starts 43px in, ends 50px before the edge, 90px below the slides */
@media (min-width: 1201px) {
	#our-story .elementor-widget-n-carousel .swiper { padding-bottom: 113px; }
	#our-story .elementor-widget-n-carousel .swiper-pagination-bullets { left: 43px; width: calc(100% - 93px); }
}
@media (max-width: 767px) {
	#recent-news .elementor-widget-loop-carousel .swiper { padding-bottom: 40px; }
	#recent-news .elementor-widget-loop-carousel .swiper-pagination-bullets { height: 14px; }
}

/* ---------------------------------------------------------------
 * Our Team – show "View All" after the departments (was: Taxonomy Filter → Custom CSS)
 * ------------------------------------------------------------- */
#our-team .elementor-widget-taxonomy-filter .e-filter-item[data-filter="__all"] { order: 99; }

/* Media page (1599): design order is Press Releases, Insights, Coverage, then All Media. */
#media-center .elementor-widget-taxonomy-filter .e-filter-item[data-filter="press-release"] { order: 1; }
#media-center .elementor-widget-taxonomy-filter .e-filter-item[data-filter="insights"] { order: 2; }
#media-center .elementor-widget-taxonomy-filter .e-filter-item[data-filter="coverage"] { order: 3; }
#media-center .elementor-widget-taxonomy-filter .e-filter-item[data-filter="__all"] { order: 99; }

/* ---------------------------------------------------------------
 * Testimonials – design shows only the "NEXT" arrow (Elementor has no "hide previous arrow" setting)
 * ------------------------------------------------------------- */
#testimonials .elementor-widget-loop-carousel .elementor-swiper-button-prev { display: none; }

/* Testimonials (phones): NEXT chevron centred on the photo's right side (Elementor has no arrow position control). */
@media (max-width: 767px) {
	#testimonials .elementor-widget-loop-carousel .elementor-swiper-button-next { top: 117px; right: -42px; }
}

/* ---------------------------------------------------------------
 * Case study detail page (template 1455) – sub-headings and bullets inside the post content.
 * Elementor's Post Content widget only styles body text, not the headings/lists inside it.
 * Sub-headings follow the homepage caps sub-titles (orange caps, e.g. "DEEP, STABLE TEAM.").
 * ------------------------------------------------------------- */
.adenia-cs-content p { margin: 0 0 1.1em; }
.adenia-cs-content h2,
.adenia-cs-content h3 { font-size: 22px; font-weight: 800; line-height: 1.25; text-transform: uppercase; color: var(--e-global-color-adorangecaps); margin: 40px 0 12px; }
.adenia-cs-content ul { list-style: none; margin: 0 0 8px; padding-left: 0; }
.adenia-cs-content li { position: relative; padding-left: 26px; margin-bottom: 8px; }
.adenia-cs-content li::before { content: ""; position: absolute; left: 2px; top: 0.72em; width: 10px; height: 2px; background: var(--e-global-color-secondary); }
.adenia-cs-content > *:first-child,
.adenia-cs-content .elementor-widget-container > *:first-child { margin-top: 0; }
@media (max-width: 1760px) {
	.adenia-cs-content h2,
	.adenia-cs-content h3 { font-size: 20px; }
}
@media (max-width: 767px) {
	.adenia-cs-content h2,
	.adenia-cs-content h3 { font-size: 17px; margin-top: 28px; }
	.adenia-cs-content li { padding-left: 20px; }
}
/* Hide the "About the company" panel and the hero tags when the case study has no value for them. */
.adenia-cs-about:not(:has(.adenia-cs-about-text)) { display: none; }
.adenia-cs-tag:has(.elementor-heading-title:empty) { display: none; }

/* ---------------------------------------------------------------
 * Footer link lists – only the text is clickable/hoverable, not the blank space beside it.
 * Elementor's Icon List stretches each link to the full column width and has no control for this.
 * Add class "adenia-link-list" to the Icon List widget.
 * ------------------------------------------------------------- */
.adenia-link-list .elementor-icon-list-item,
.adenia-link-list .elementor-icon-list-item > a { width: fit-content; max-width: 100%; }

/* ---------------------------------------------------------------
 * Footer legal links (Privacy Policy | Terms of Use | Cookie Policy) inside the orange copyright bar.
 * The Text Editor widget has no link/hover colour controls. Navy hover = global "Button Hover - Text Link".
 * Add class "adenia-legal-links" to the Text Editor widget.
 * ------------------------------------------------------------- */
.adenia-legal-links a { color: inherit; transition: color .3s; }
.adenia-legal-links a:hover,
.adenia-legal-links a:focus-visible { color: var(--e-global-color-adhovlink); }

/* ---------------------------------------------------------------
 * Inline text links on light backgrounds (e.g. Priority Areas "See full case studies: …").
 * Links keep the surrounding text colour and turn orange on hover.
 * The Text Editor widget has no link/hover colour controls. Add class "adenia-text-links" to the widget.
 * ------------------------------------------------------------- */
.adenia-text-links a { color: inherit; transition: color .3s; }
.adenia-text-links a:hover,
.adenia-text-links a:focus-visible { color: var(--e-global-color-secondary); }

/* ---------------------------------------------------------------
 * Section titles/subtitles with design line breaks (<br>) that only suit desktop.
 * On tablet and phones (≤1200px) the breaks are ignored so the text runs full width and wraps naturally.
 * Keep a space before each <br> in the text so words don't join when the break is hidden.
 * Add class "adenia-br-desktop" to the Heading / Text Editor widget.
 * ------------------------------------------------------------- */
@media (max-width: 1200px) {
	.adenia-br-desktop br { display: none; }
}

/* ---------------------------------------------------------------
 * News card "READ MORE" – Elementor's Button widget is an inline-block inside a box that inherits the body
 * line-height (35px), so the text sits ~4px lower than the date/category beside it. Collapse the box to the
 * text so both share one centre line (mobile .ai). No Elementor control for the widget wrapper's line-height.
 * ------------------------------------------------------------- */
.elementor-1024 .elementor-element-c000008 { line-height: 0; }
.elementor-1024 .elementor-element-c000008 .elementor-button { vertical-align: middle; }
/* Exception: keep the design's breaks on phones where the text sits in a deliberately narrow column
 * (e.g. Recent News subtitle beside its button). Add class "adenia-br-keep-mobile" alongside "adenia-br-desktop". */
@media (max-width: 767px) {
	.adenia-br-keep-mobile br { display: inline; }
}


/* Our Culture (phones) – the orange line starts at the photo's left edge and the title/text start just after it (mobile .ai). */
@media (max-width: 767px) {
	#our-culture .adenia-line-md h3.elementor-heading-title::before { position: absolute; display: block; right: 100%; top: 0.62em; width: 37px; height: 2px; margin-right: 8px; }
}
/* Case study previous/next links stack on phones so the labels aren't cut off (no Elementor control for this layout). */
@media (max-width: 767px) {
	.elementor-1455 .elementor-post-navigation { flex-direction: column; gap: 18px; }
	.elementor-1455 .elementor-post-navigation .elementor-post-navigation__separator-wrapper { display: none; }
	.elementor-1455 .elementor-post-navigation .elementor-post-navigation__link { width: 100%; }
}

/* Header menu (h000001, template 1022): "»" separator sits between items, outside the links.
   Font size mirrors the widget's menu typography: 20.72px desktop, 14px laptop. */
.elementor-element-h000001 .elementor-nav-menu--main > ul > li:not(:last-child) {
	display: flex;
	align-items: center;
}
.elementor-element-h000001 .elementor-nav-menu--main > ul > li:not(:last-child)::after {
	content: "»";
	font-family: "Sztos", sans-serif;
	font-size: 20.72px;
	font-weight: 400;
	line-height: 1;
	color: #FFFFFF;
	margin-right: 0.25em;
	pointer-events: none;
	/* Elementor's divider rule also targets li::after; drop its border and box. */
	border: 0;
	width: auto;
	height: auto;
}
@media (max-width: 1760px) {
	.elementor-element-h000001 .elementor-nav-menu--main > ul > li:not(:last-child)::after { font-size: 14px; }
}
