/**
 * setupcompany.eu — core stylesheet
 *
 * Tokens + the shared primitives every page in the DESIGN-HANDOFF is built from:
 * section shell, card, button, eyebrow/heading/lead header row, the blue CTA
 * block, the dot-grid / ring decorations, form controls, plus the global header
 * restyle and the site footer.
 *
 * Loaded site-wide. Section primitives are scoped to `.setupco-tpl` (the body
 * class on every custom page template) so they never touch wp-admin or plugin
 * markup; header/footer rules are global because the chrome is.
 *
 * Per-page stylesheets (homepage.css, pricing.css, …) load AFTER this and carry
 * only what is unique to that page.
 */

/* ====================================================================== */
/*  Tokens                                                                 */
/* ====================================================================== */
:root {
	--eu-blue: #003399;
	--eu-blue-deep: #002673;
	--eu-blue-light: #6f93e8;
	--eu-blue-tint: #e8edf9;
	--eu-blue-tint-bd: #c9d5f0;
	--yellow: #ffcc00;
	--yellow-hover: #e6b800;
	--yellow-pressed: #cca300;
	--ink: #1a1f2e;
	--text-2: #4a5068;
	--text-3: #6b7280;
	--warm: #f8f7f4;
	--white: #ffffff;
	--border: #e6e4de;
	--border-2: #e2e0db;
	--border-white: #eeedea;
	--border-input: #dcd9d2;
	--signal: #c4501a;
	--signal-tint: #fff4e6;
	--go: #2a7d4f;
	--go-tint: #e6f2ea;
	--on-blue-body: #c0cde6;
	--on-blue-cap: #8fa4cc;
	--on-ink-body: #d5d8e0;
	--on-ink-cap: #a8aebd;
	--maxw: 1240px;
	--pad-x: 24px;
	--sec-y: 96px;

	--shadow-card: 0 1px 2px rgba(26, 31, 46, 0.04), 0 12px 32px rgba(26, 31, 46, 0.07);
	--shadow-emph: 0 1px 2px rgba(26, 31, 46, 0.04), 0 14px 36px rgba(26, 31, 46, 0.08);
	--shadow-panel: 0 1px 2px rgba(26, 31, 46, 0.04), 0 16px 44px rgba(26, 31, 46, 0.07);
	--shadow-flat: 0 1px 2px rgba(26, 31, 46, 0.04);
	--shadow-hover: 0 4px 16px rgba(26, 31, 46, 0.08);
}

/* ====================================================================== */
/*  Page-template base                                                     */
/* ====================================================================== */
.setupco-tpl {
	font-family: var(--setupco-font, "Inter", system-ui, sans-serif);
	color: var(--ink);
}

.setupco-tpl,
.setupco-tpl *,
.setupco-tpl *::before,
.setupco-tpl *::after {
	box-sizing: border-box;
}

/* Release the GeneratePress content container so sections run full-bleed. */
.setupco-tpl #page,
.setupco-tpl #content,
.setupco-tpl .site-content,
.setupco-tpl #primary,
.setupco-tpl #main {
	max-width: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
}

.setupco-tpl #main {
	display: block;
}

.setupco-tpl .setupco-tpl-article,
.setupco-tpl article.setupco-page {
	margin: 0;
	padding: 0;
	border: 0;
}

.setupco-tpl h1,
.setupco-tpl h2,
.setupco-tpl h3,
.setupco-tpl h4,
.setupco-tpl p,
.setupco-tpl ul,
.setupco-tpl ol,
.setupco-tpl figure {
	margin: 0;
}

/* ====================================================================== */
/*  Global header restyle                                                  */
/* ====================================================================== */
/* Site-wide (not just .setupco-tpl pages) so every page — including the
   mobile slide-out menu, which shares this background — matches the theme's
   warm off-white, not GeneratePress's default white (header_background_color). */
.site-header {
	position: sticky;
	top: 0;
	z-index: 40;
	background: var(--warm, #f8f7f4);
	border-bottom: 1px solid var(--border, #e6e4de);
}

.site-header .inside-header,
.site-header .inside-navigation,
.main-navigation {
	background: transparent;
}

/* Header row: fixed 68px, content vertically centered, 24px gutters, 1240px
   centred — matches the row every other section is built to. `.site-header
   .inside-header` (two classes) is used, not the bare `.inside-header`, so
   this reliably outranks GeneratePress's own single-class `.inside-header`
   and `.grid-container` rules regardless of stylesheet load order. */
.site-header .inside-header {
	height: 68px;
	padding: 0 24px;
	max-width: 1240px;
	margin-left: auto;
	margin-right: auto;
}

/* Desktop nav layout: real gap-based spacing instead of GeneratePress's
   padding-driven menu-item spacing. GP's default `.main-navigation .main-nav
   ul li a { padding: 0 20px; line-height: 60px }` is what was inflating the
   CTA button to ~80px tall — that rule's selector (2 classes + 3 elements) is
   MORE specific than a same-load-order override with fewer element selectors,
   so it was winning regardless of source order. `#site-navigation` (an ID)
   is used here specifically to out-rank it. Confined to desktop so it never
   fights GeneratePress's mobile slide-down toggle, which functions.php moves
   up to <1100px (the full menu plus language switcher needs ~910px). */
@media (min-width: 1100px) {
	#site-navigation .main-nav > ul {
		display: flex;
		align-items: center;
		gap: 22px;
	}

	#site-navigation .main-nav > ul > li > a {
		padding: 0;
		line-height: 1;
		font-size: 14.5px;
		font-weight: 500;
	}

	/* 22px shared gap + 2px here = the 24px cluster gap before the CTA. */
	#site-navigation .main-nav > ul > li.sc-nav-cta {
		margin-left: 2px;
	}
}

/* 1100–1279px: tighter gaps so the English menu still fits on one row. */
@media (min-width: 1100px) and (max-width: 1279px) {
	#site-navigation .main-nav > ul {
		gap: 16px;
	}

	/* Turkish labels run longer even after shortening the menu titles
	   (menu "Primary (Türkçe)"), so tighten them a step further here. */
	:lang(tr) #site-navigation .main-nav > ul {
		gap: 10px;
	}

	:lang(tr) #site-navigation .main-nav > ul > li:not(.sc-nav-cta) > a {
		font-size: 14px;
	}
}

/* Header nav CTA — "Book a consultation" rendered as the yellow CTA button
   rather than a plain link. Height is fixed, not padding-driven, so GP's
   60px line-height can never re-inflate it; applies at every width, since
   the same GP rule reaches the mobile menu too. */
#site-navigation .main-nav > ul > li.sc-nav-cta > a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 40px;
	padding: 0 18px;
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
	border-radius: 999px;
	background: var(--yellow, #ffcc00);
	color: var(--ink, #1a1f2e) !important;
	transition: background-color 150ms ease-out;
}

#site-navigation .main-nav > ul > li.sc-nav-cta > a:hover {
	background: #f5c400;
	color: var(--ink, #1a1f2e) !important;
}

#site-navigation .main-nav > ul > li.sc-nav-cta > a:focus-visible {
	outline: 2px solid var(--eu-blue, #003399);
	outline-offset: 2px;
}

/* Hamburger range (<1100px, see functions.php): the header row is a fixed
   68px, so let it grow when the menu opens — otherwise the toggled nav hangs
   below the header with no background, over the page content. */
@media (max-width: 1099px) {
	.site-header .inside-header {
		height: auto;
		min-height: 68px;
	}

	#site-navigation.toggled {
		background: var(--warm, #f8f7f4);
		padding-bottom: 16px;
	}

	#site-navigation.toggled .main-nav > ul > li.sc-nav-cta {
		margin-top: 8px;
	}

	/* Keep the switcher's arrow at the right edge like the other items. */
	#site-navigation.main-navigation .main-nav > ul > li.sc-lang > a {
		display: flex;
	}

	#site-navigation.main-navigation li.sc-lang > a .dropdown-menu-toggle {
		margin-left: auto;
	}
}

/* Header language switcher (inc/i18n.php) — globe + current language code,
   GeneratePress dropdown listing every language with a translated homepage. */
#site-navigation .main-nav > ul > li.sc-lang > a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
}

#site-navigation li.sc-lang > a svg {
	flex: none;
}

#site-navigation li.sc-lang .sub-menu {
	min-width: 160px;
}

#site-navigation li.sc-lang__item.is-current > a {
	font-weight: 600;
	color: var(--eu-blue, #003399);
}

@media (min-width: 1100px) {
	/* Right-align the panel so it never runs off the header edge. */
	#site-navigation .main-nav > ul > li.sc-lang .sub-menu {
		left: auto;
		right: 0;
	}
}

/* ====================================================================== */
/*  Section shell                                                          */
/* ====================================================================== */
.sc-section {
	position: relative;
	overflow: hidden;
	padding: var(--sec-y) var(--pad-x);
}

.sc-section--warm {
	background: var(--warm);
}

.sc-section--white {
	background: var(--white);
}

.sc-section--ink {
	background: var(--ink);
	color: var(--white);
}

.sc-inner {
	position: relative;
	max-width: var(--maxw);
	margin: 0 auto;
}

/* ---- decorative layers ---------------------------------------------- */
.sc-dots {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.sc-dots--blue {
	background-image: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, 0.15) 1px, transparent 0);
	background-size: 26px 26px;
}

.sc-dots--ink {
	background-image: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, 0.08) 1px, transparent 0);
	background-size: 30px 30px;
	-webkit-mask-image: radial-gradient(ellipse 85% 55% at 50% 0%, #000, transparent);
	mask-image: radial-gradient(ellipse 85% 55% at 50% 0%, #000, transparent);
}

.sc-dots--right {
	inset: 0 0 0 auto;
	width: 44%;
	background-image: radial-gradient(circle at 1px 1px, rgba(0, 51, 153, 0.09) 1px, transparent 0);
	background-size: 24px 24px;
	-webkit-mask-image: linear-gradient(to left, #000, transparent);
	mask-image: linear-gradient(to left, #000, transparent);
}

.sc-hatch {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image: repeating-linear-gradient(115deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 14px);
}

.sc-ring {
	position: absolute;
	border-radius: 999px;
	pointer-events: none;
}

.sc-ring--hero {
	top: -220px;
	right: -140px;
	width: 580px;
	height: 580px;
	border: 84px solid rgba(255, 255, 255, 0.05);
}

.sc-ring--cta {
	bottom: -220px;
	right: -140px;
	width: 520px;
	height: 520px;
	border: 80px solid rgba(255, 204, 0, 0.09);
}

/* ====================================================================== */
/*  Eyebrow / heading / lead                                               */
/* ====================================================================== */
.sc-eyebrow {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--eu-blue);
}

.sc-eyebrow--yellow {
	color: var(--yellow);
}

.sc-eyebrow--on-blue {
	color: var(--on-blue-body);
}

.sc-eyebrow--signal {
	color: var(--signal);
}

.sc-eyebrow--go {
	color: var(--go);
}

.sc-h1 {
	font-size: clamp(36px, 5.6vw, 68px);
	font-weight: 700;
	letter-spacing: -0.045em;
	line-height: 1.02;
	text-wrap: balance;
}

.sc-h2 {
	font-size: clamp(28px, 3.8vw, 46px);
	font-weight: 700;
	letter-spacing: -0.038em;
	line-height: 1.07;
	text-wrap: balance;
	max-width: 20ch;
}

.sc-h3 {
	font-size: 20px;
	font-weight: 600;
	letter-spacing: -0.025em;
	line-height: 1.28;
}

.sc-hl {
	color: var(--yellow);
}

.sc-lead {
	font-size: 19px;
	line-height: 1.65;
	color: var(--text-2);
}

.sc-section--ink .sc-lead,
.sc-hero .sc-lead {
	color: var(--on-blue-body);
}

/* yellow-rule + lead paragraph (hero pattern) */
.sc-railed {
	display: flex;
	align-items: stretch;
	gap: 20px;
	max-width: 62ch;
}

.sc-railed__rule {
	width: 3px;
	flex: none;
	border-radius: 2px;
	background: var(--yellow);
}

/* header row: eyebrow + h2 + optional aside paragraph */
.sc-head {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-bottom: 48px;
}

.sc-head__main {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.sc-head--split {
	display: grid;
	grid-template-columns: minmax(280px, 1.15fr) minmax(240px, 0.85fr);
	gap: 48px;
	align-items: end;
}

.sc-head__aside {
	font-size: 17px;
	line-height: 1.7;
	color: var(--text-2);
	margin-bottom: 4px;
}

.sc-section--ink .sc-head__aside {
	color: var(--on-ink-cap);
}

.sc-section--ink .sc-h2 {
	color: var(--white);
}

.sc-head__link {
	font-size: 15px;
	font-weight: 600;
	color: var(--eu-blue);
	text-decoration: none;
	white-space: nowrap;
	padding-bottom: 6px;
}

.sc-head__link:hover {
	text-decoration: underline;
}

/* ====================================================================== */
/*  Breadcrumbs (on blue hero)                                             */
/* ====================================================================== */
.sc-crumbs {
	position: relative;
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 32px var(--pad-x) 0;
	display: flex;
	align-items: center;
	gap: 9px;
	flex-wrap: wrap;
	font-size: 13px;
	color: var(--on-blue-cap);
}

.sc-crumbs a {
	color: var(--on-blue-cap);
	text-decoration: none;
}

.sc-crumbs a:hover {
	color: var(--white);
	text-decoration: underline;
}

.sc-crumbs span[aria-hidden] {
	opacity: 0.6;
}

.sc-crumbs [aria-current] {
	color: var(--white);
	font-weight: 500;
}

/* ====================================================================== */
/*  Buttons                                                                */
/* ====================================================================== */
.sc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border-radius: 999px;
	border: 1.5px solid transparent;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: -0.01em;
	line-height: 1;
	min-height: 44px;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 150ms ease-out, transform 150ms ease-out,
		border-color 150ms ease-out, color 150ms ease-out;
}

.sc-btn:hover {
	text-decoration: none;
}

.sc-btn--primary {
	background: var(--yellow);
	color: var(--ink);
	padding: 17px 30px;
}

.sc-btn--primary:hover {
	background: var(--yellow-hover);
	color: var(--ink);
}

.sc-btn--primary:active {
	background: var(--yellow-pressed);
	transform: translateY(1px);
}

.sc-btn--outline {
	background: transparent;
	color: var(--eu-blue);
	border-color: var(--eu-blue);
	padding: 13px 22px;
}

.sc-btn--outline:hover {
	background: var(--eu-blue-tint);
	color: var(--eu-blue);
}

.sc-btn--outline:active {
	background: var(--eu-blue-tint-bd);
	color: var(--eu-blue-deep);
	border-color: var(--eu-blue-deep);
}

.sc-btn--ghost {
	background: transparent;
	color: var(--white);
	border-color: rgba(255, 255, 255, 0.45);
	padding: 15.5px 30px;
}

.sc-btn--ghost:hover {
	background: rgba(255, 255, 255, 0.14);
	color: var(--white);
}

.sc-btn--ghost:active {
	background: rgba(255, 255, 255, 0.24);
}

.sc-btn--block {
	width: 100%;
}

.sc-btn--sm {
	min-height: 0;
	font-size: 14.5px;
	padding: 12px 22px;
}

.sc-btn-row {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
}

/* download-icon text link, on blue */
.sc-textlink {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	color: var(--white);
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1.5px solid rgba(255, 255, 255, 0.4);
	padding-bottom: 3px;
	min-height: 44px;
}

.sc-textlink:hover {
	color: var(--white);
	border-bottom-color: var(--white);
	text-decoration: none;
}

.sc-textlink .sc-ico {
	flex: none;
}

/* ====================================================================== */
/*  Cards                                                                  */
/* ====================================================================== */
.sc-card {
	display: flex;
	flex-direction: column;
	gap: 14px;
	background: var(--white);
	border-radius: 18px;
	padding: 30px 28px;
	box-shadow: var(--shadow-card);
}

.sc-card--flat {
	box-shadow: var(--shadow-flat);
}

.sc-card--plain {
	background: var(--warm);
	box-shadow: none;
}

.sc-card__title {
	font-size: 20px;
	font-weight: 600;
	letter-spacing: -0.025em;
	line-height: 1.28;
}

.sc-card__body {
	font-size: 15px;
	line-height: 1.6;
	color: var(--text-2);
	flex: 1;
}

.sc-card__link {
	font-size: 14.5px;
	font-weight: 600;
	color: var(--eu-blue);
	padding-top: 8px;
	border-top: 1px solid var(--border-white);
}

a.sc-card {
	color: var(--ink);
	text-decoration: none;
	transition: transform 150ms ease-out, box-shadow 150ms ease-out;
}

a.sc-card:hover {
	color: var(--ink);
	text-decoration: none;
	transform: translateY(-2px);
	box-shadow: var(--shadow-hover);
}

a.sc-card:hover .sc-card__link {
	text-decoration: underline;
}

/* icon tile */
.sc-tile {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	flex: none;
	border-radius: 12px;
	background: var(--eu-blue-tint);
	color: var(--eu-blue);
}

.sc-ico {
	display: block;
	flex: none;
}

/* ISO country tile — placeholder treatment per handoff */
.sc-iso {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 27px;
	border-radius: 3px;
	background: var(--eu-blue-tint);
	border: 1px solid var(--eu-blue-tint-bd);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--eu-blue);
}

/* language / topic chips */
.sc-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	padding: 0;
}

.sc-chips li,
.sc-chip {
	border: 1px solid var(--border-input);
	border-radius: 999px;
	padding: 8px 15px;
	font-size: 14px;
	font-weight: 500;
	color: var(--ink);
}

.sc-section--ink .sc-chips li,
.sc-hero .sc-chips li {
	border-color: rgba(255, 255, 255, 0.32);
	color: var(--white);
}

/* generic responsive card grid */
.sc-grid {
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
}

/* ====================================================================== */
/*  Hero (blue)                                                            */
/* ====================================================================== */
.sc-hero {
	position: relative;
	overflow: clip;
	background: var(--eu-blue);
	color: var(--white);
}

.sc-hero__wrap {
	position: relative;
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 44px var(--pad-x) 64px;
}

.sc-hero .sc-h1 {
	color: var(--white);
	max-width: 20ch;
}

/* ====================================================================== */
/*  CTA block (blue rounded panel on warm ground)                          */
/* ====================================================================== */
.sc-ctablock {
	background: var(--warm);
	padding: 0 var(--pad-x) var(--sec-y);
}

.sc-ctablock__inner {
	position: relative;
	overflow: hidden;
	max-width: var(--maxw);
	margin: 0 auto;
	background: var(--eu-blue);
	border-radius: 28px;
	padding: clamp(44px, 6vw, 80px) clamp(32px, 6vw, 72px);
	color: var(--white);
}

.sc-ctablock__grid {
	position: relative;
	display: grid;
	grid-template-columns: minmax(300px, 1.35fr) minmax(230px, 0.65fr);
	gap: 48px;
	align-items: end;
}

.sc-ctablock__main {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.sc-ctablock__title {
	font-size: clamp(32px, 4.6vw, 54px);
	font-weight: 700;
	letter-spacing: -0.04em;
	line-height: 1.03;
	color: var(--white);
	max-width: 16ch;
	text-wrap: balance;
}

.sc-ctablock__text {
	font-size: 18px;
	line-height: 1.65;
	color: var(--on-blue-body);
	max-width: 52ch;
}

.sc-ctablock__aside {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.sc-channels {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	padding: 0;
}

.sc-channels .sc-channel {
	display: inline-block;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 999px;
	padding: 9px 16px;
	font-size: 14px;
	font-weight: 500;
	color: var(--white);
	text-decoration: none;
	transition: background-color 0.15s, border-color 0.15s;
}

.sc-channels .sc-channel:hover,
.sc-channels .sc-channel:focus-visible {
	background: rgba(255, 255, 255, 0.12);
	border-color: var(--yellow);
	color: var(--white);
}

.sc-ctablock__contact {
	font-size: 15px;
	line-height: 1.6;
	color: var(--on-blue-body);
	padding-top: 6px;
}

.sc-ctablock__contact a {
	color: var(--on-blue-body);
}

.sc-ctablock__contact a:hover {
	color: var(--white);
}

/* ====================================================================== */
/*  Stat rail (on a hero's bottom edge)                                    */
/* ====================================================================== */
.sc-rail {
	position: relative;
	border-top: 1px solid rgba(255, 255, 255, 0.16);
}

/* Two classes so this outranks the `.setupco-tpl ul { margin: 0 }` reset,
   which otherwise strips the auto margins and pins the rail to the left. */
.sc-rail .sc-rail__inner {
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 0 var(--pad-x);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	list-style: none;
}

.sc-rail__cell {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 28px;
	border-right: 1px solid rgba(255, 255, 255, 0.16);
}

.sc-rail__cell:first-child {
	padding-left: 0;
}

.sc-rail__cell:last-child {
	border-right: 0;
}

.sc-rail__num {
	font-size: 30px;
	font-weight: 700;
	letter-spacing: -0.035em;
	color: var(--white);
	font-variant-numeric: tabular-nums;
}

.sc-rail__num--yellow {
	color: var(--yellow);
}

.sc-rail__label {
	font-size: 13px;
	color: var(--on-blue-cap);
}

/* ====================================================================== */
/*  Glass card (on dark)                                                   */
/* ====================================================================== */
.sc-glass {
	background: rgba(255, 255, 255, 0.07);
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: 20px;
	padding: 28px;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

/* ====================================================================== */
/*  FAQ accordion (native details)                                         */
/* ====================================================================== */
.sc-faq {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.sc-faq__item {
	background: var(--white);
	border-radius: 16px;
	padding: 22px 26px;
	box-shadow: var(--shadow-flat);
}

.sc-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	list-style: none;
	cursor: pointer;
	font-size: 17.5px;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--ink);
}

.sc-faq__q::-webkit-details-marker {
	display: none;
}

.sc-faq__plus {
	flex: none;
	color: var(--eu-blue);
	font-size: 24px;
	font-weight: 400;
	line-height: 1;
	transition: transform 180ms ease-out;
}

.sc-faq__item[open] .sc-faq__plus {
	transform: rotate(45deg);
}

.sc-faq__a {
	font-size: 16px;
	line-height: 1.65;
	color: var(--text-2);
	margin-top: 14px;
	max-width: 72ch;
}

/* static FAQ card variant (service / persona pages) */
.sc-faq--static .sc-faq__item {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 26px 28px;
}

.sc-faq--static .sc-faq__q {
	cursor: auto;
	font-size: 18px;
}

.sc-faq--static .sc-faq__a {
	margin-top: 0;
}

/* ====================================================================== */
/*  Form controls                                                          */
/* ====================================================================== */
.sc-field {
	display: flex;
	flex-direction: column;
	gap: 7px;
}

.sc-field__label {
	font-size: 14px;
	font-weight: 600;
}

.sc-field__label .opt {
	color: var(--text-3);
	font-weight: 400;
}

.sc-field__hint {
	font-size: 13px;
	line-height: 1.55;
	color: var(--text-3);
}

.sc-input,
.sc-select,
.sc-textarea {
	width: 100%;
	border: 1px solid var(--border-2);
	border-radius: 8px;
	padding: 14px 16px;
	font: inherit;
	font-size: 16px;
	color: var(--ink);
	background: var(--warm);
	min-height: 48px;
}

.sc-input::placeholder,
.sc-textarea::placeholder {
	color: var(--text-3);
}

.sc-textarea {
	min-height: 132px;
	line-height: 1.6;
	resize: vertical;
}

.sc-input:focus,
.sc-select:focus,
.sc-textarea:focus {
	outline: none;
	border-color: var(--eu-blue);
	box-shadow: 0 0 0 3px rgba(0, 51, 153, 0.12);
}

.sc-checkline {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	font-size: 14px;
	line-height: 1.55;
	color: var(--text-2);
}

.sc-checkline input {
	width: 20px;
	height: 20px;
	flex: none;
	margin-top: 2px;
	accent-color: var(--eu-blue);
}

.sc-formnote {
	font-size: 14px;
	line-height: 1.55;
	color: var(--text-3);
}

/* ====================================================================== */
/*  Focus                                                                  */
/* ====================================================================== */
.setupco-tpl a:focus-visible,
.setupco-tpl button:focus-visible,
.setupco-tpl summary:focus-visible,
.setupco-tpl input:focus-visible,
.setupco-tpl select:focus-visible,
.setupco-tpl textarea:focus-visible {
	outline: 2px solid var(--eu-blue);
	outline-offset: 2px;
	border-radius: 4px;
}

.sc-hero a:focus-visible,
.sc-section--ink a:focus-visible,
.sc-ctablock a:focus-visible {
	outline-color: var(--yellow);
}

/* ====================================================================== */
/*  Site footer (global — replaces the GeneratePress footer)               */
/* ====================================================================== */
.setupco-footer {
	background: var(--eu-blue-deep);
	padding: 88px 24px 40px;
	color: var(--white);
}

.setupco-footer__inner {
	max-width: 1240px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 40px;
}

.setupco-footer__cols {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 36px;
}

.setupco-footer__col {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.setupco-footer__col--brand {
	grid-column: span 2;
	min-width: 0;
	gap: 14px;
}

.setupco-footer__wordmark {
	font-size: 20px;
	letter-spacing: -0.03em;
	color: var(--white);
}

.setupco-footer__wordmark b {
	font-weight: 700;
}

.setupco-footer__wordmark i {
	font-weight: 300;
	font-style: normal;
}

.setupco-footer__blurb {
	font-size: 15px;
	line-height: 1.6;
	color: var(--on-blue-body);
	max-width: 36ch;
}

.setupco-footer__meta {
	font-size: 14px;
	line-height: 1.6;
	color: var(--on-blue-body);
}

.setupco-footer__heading {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--eu-blue-light);
}

.setupco-footer__col a {
	font-size: 15px;
	color: var(--white);
	text-decoration: none;
}

.setupco-footer__col a:hover {
	color: var(--yellow);
	text-decoration: none;
}

.setupco-footer__bar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
	border-top: 1px solid rgba(255, 255, 255, 0.18);
	padding-top: 24px;
}

.setupco-footer__copy,
.setupco-footer__legal {
	font-size: 13px;
	color: var(--on-blue-body);
}

.setupco-footer__legal {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
}

.setupco-footer__legal a {
	color: var(--on-blue-body);
	text-decoration: none;
}

.setupco-footer__legal a:hover {
	color: var(--yellow);
}

/* ====================================================================== */
/*  Prose (blog / regulatory / case-study body copy)                       */
/* ====================================================================== */
.sc-prose {
	font-size: 17px;
	line-height: 1.75;
	color: var(--text-2);
	max-width: 68ch;
}

.sc-prose > * + * {
	margin-top: 1.1em;
}

.sc-prose h2 {
	font-size: clamp(24px, 2.6vw, 32px);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.2;
	color: var(--ink);
	margin-top: 1.8em;
}

.sc-prose h3 {
	font-size: 21px;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--ink);
	margin-top: 1.5em;
}

.sc-prose a {
	color: var(--eu-blue);
	text-decoration: underline;
}

.sc-prose ul,
.sc-prose ol {
	padding-left: 1.3em;
}

.sc-prose li + li {
	margin-top: 0.4em;
}

.sc-prose blockquote {
	border-left: 3px solid var(--yellow);
	padding-left: 20px;
	font-size: 19px;
	line-height: 1.6;
	color: var(--ink);
}

.sc-prose img {
	border-radius: 12px;
	height: auto;
}

/* ====================================================================== */
/*  Responsive                                                             */
/* ====================================================================== */
@media (max-width: 1024px) {
	.setupco-tpl {
		--sec-y: 64px;
	}

	.sc-head {
		margin-bottom: 40px;
	}
}

@media (max-width: 768px) {
	.setupco-tpl {
		--sec-y: 48px;
	}

	.sc-head--split,
	.sc-ctablock__grid {
		grid-template-columns: 1fr;
		gap: 32px;
		align-items: start;
	}

	.sc-head__aside {
		margin-bottom: 0;
	}

	.sc-rail__inner {
		grid-template-columns: 1fr 1fr;
	}

	.sc-rail__cell {
		padding: 20px;
	}

	.sc-rail__cell:nth-child(odd) {
		padding-left: 0;
	}

	.sc-rail__cell:nth-child(even) {
		border-right: 0;
	}

	.setupco-footer__cols {
		grid-template-columns: 1fr 1fr;
	}

	.setupco-footer__col--brand {
		grid-column: span 2;
	}
}

@media (max-width: 480px) {
	.sc-rail__inner {
		grid-template-columns: 1fr;
	}

	.sc-rail__cell {
		padding: 16px 0;
		border-right: 0;
		border-bottom: 1px solid rgba(255, 255, 255, 0.16);
	}

	.sc-rail__cell:last-child {
		border-bottom: 0;
	}

	.sc-btn,
	.sc-btn-row {
		width: 100%;
	}

	.setupco-footer__cols {
		grid-template-columns: 1fr;
	}

	.setupco-footer__col--brand {
		grid-column: auto;
	}

	.setupco-footer__bar {
		flex-direction: column;
		align-items: flex-start;
	}
}

@media (prefers-reduced-motion: reduce) {
	.setupco-tpl * {
		transition-duration: 0.01ms !important;
	}

	a.sc-card:hover {
		transform: none;
	}
}

/* ====================================================================== */
/*  Chinese pages                                                          */
/* ====================================================================== */
/* Inter has no CJK glyphs: Latin still renders in Inter, Chinese uses the
   device's own Simplified Chinese face. The self-hosted "Noto Sans SC" (17 MB)
   comes last so it is only downloaded on devices with none of those. The
   negative tracking tuned for Latin headings crowds CJK, so it is reset. */
:lang(zh) {
	--setupco-font: "Inter", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans SC", "Noto Sans SC", "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", system-ui, sans-serif;
}

:lang(zh) .setupco-tpl,
:lang(zh) .setupco-tpl * {
	letter-spacing: normal !important;
}

/* ====================================================================== */
/*  Korean pages                                                           */
/* ====================================================================== */
/* Same approach as Chinese: device Korean faces first, the self-hosted
   "Noto Sans KR" (10 MB) last — and ahead of the SC face, which the base
   stack lists first. Korean wraps at spaces, not mid-word (keep-all). */
:lang(ko) {
	--setupco-font: "Inter", "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans CJK KR", "Source Han Sans KR", "Noto Sans KR", system-ui, sans-serif;
	word-break: keep-all;
}

:lang(ko) .setupco-tpl,
:lang(ko) .setupco-tpl * {
	letter-spacing: normal !important;
}

/* ====================================================================== */
/*  Cookie banner (Complianz free) — site tokens over its :root defaults   */
/* ====================================================================== */
.cmplz-cookiebanner {
	--cmplz_banner_background_color: var(--white);
	--cmplz_banner_border_color: var(--border);
	--cmplz_banner_border_width: 1px;
	--cmplz_banner_border_radius: 18px;
	--cmplz_banner_width: 540px;
	--cmplz_text_color: var(--text-2);
	--cmplz_hyperlink_color: var(--eu-blue);
	--cmplz_title_font_size: 16px;
	--cmplz_text_font_size: 14px;
	--cmplz_link_font_size: 13px;
	--cmplz_category_body_font_size: 13px;
	--cmplz_category_header_title_font_size: 14px;
	--cmplz_category_header_always_active_color: var(--go);
	--cmplz_button_font_size: 15px;
	--cmplz_button_border_radius: 999px;
	/* Accept and Deny equally prominent (EDPB guidance). */
	--cmplz_button_accept_background_color: var(--yellow);
	--cmplz_button_accept_border_color: var(--yellow);
	--cmplz_button_accept_text_color: var(--ink);
	--cmplz_button_deny_background_color: var(--eu-blue);
	--cmplz_button_deny_border_color: var(--eu-blue);
	--cmplz_button_deny_text_color: var(--white);
	--cmplz_button_settings_background_color: transparent;
	--cmplz_button_settings_border_color: var(--eu-blue);
	--cmplz_button_settings_text_color: var(--eu-blue);
	--cmplz_slider_active_color: var(--eu-blue);
	--cmplz_slider_inactive_color: var(--text-3);
	font-family: var(--setupco-font);
	box-shadow: var(--shadow-panel) !important;
	padding: 20px 24px;
}

.cmplz-cookiebanner .cmplz-title {
	color: var(--ink);
	font-weight: 600;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-btn {
	font-weight: 600;
	transition: background-color 150ms ease-out, border-color 150ms ease-out;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-accept:hover {
	background-color: var(--yellow-hover);
	border-color: var(--yellow-hover);
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-deny:hover {
	background-color: var(--eu-blue-deep);
	border-color: var(--eu-blue-deep);
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-view-preferences:hover,
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-save-preferences:hover {
	background-color: var(--eu-blue-tint);
}

.cmplz-cookiebanner .cmplz-categories .cmplz-category {
	background-color: var(--warm);
	border-radius: 12px;
}

.cmplz-cookiebanner .cmplz-btn:focus-visible,
.cmplz-cookiebanner .cmplz-link:focus-visible {
	outline: 2px solid var(--eu-blue);
	outline-offset: 2px;
}

/* Complianz focuses the close control when the banner opens — keep the ring
   (keyboard users need it) but as a soft circle, not a hard square. */
.cmplz-cookiebanner .cmplz-close {
	border-radius: 999px;
	color: var(--text-3);
}

.cmplz-cookiebanner .cmplz-close:focus,
.cmplz-cookiebanner .cmplz-close:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px var(--white), 0 0 0 4px var(--eu-blue-light);
}

/* The footer "Cookie settings" link replaces Complianz's floating tab. */
#cmplz-manage-consent {
	display: none;
}

/* footer-scoped + explicit values: GP's button rules otherwise win on size/weight */
.setupco-footer .setupco-footer__legal .setupco-footer__cookies {
	background: none;
	border: 0;
	padding: 0;
	font-family: inherit;
	font-size: 13px;
	font-weight: 400;
	line-height: inherit;
	color: var(--on-blue-body);
	cursor: pointer;
}

.setupco-footer .setupco-footer__legal .setupco-footer__cookies:hover,
.setupco-footer .setupco-footer__legal .setupco-footer__cookies:focus-visible {
	color: var(--yellow);
	background: none;
}

/* Messenger chips on light backgrounds (Book a consultation) */
.sc-chips li:has(.sc-channel) {
	padding: 0;
}

.sc-chips .sc-channel {
	display: inline-block;
	padding: 8px 15px;
	border-radius: 999px;
	color: inherit;
	text-decoration: none;
}

.sc-chips li:has(.sc-channel):hover {
	border-color: var(--eu-blue);
	color: var(--eu-blue);
}

/* QR-code dialog opened by the messenger pills (setupco_channels_dialog) */
.sc-qr-dialog {
	width: min(360px, calc(100vw - 32px));
	padding: 32px 28px 28px;
	border: 0;
	border-radius: 16px;
	background: var(--white);
	color: var(--ink);
	text-align: center;
	box-shadow: 0 24px 60px rgba(0, 20, 60, 0.35);
}

.sc-qr-dialog::backdrop {
	background: rgba(0, 20, 60, 0.6);
}

.sc-qr-dialog .sc-qr-dialog__close {
	position: absolute;
	top: 10px;
	right: 12px;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--text-3);
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
}

.sc-qr-dialog .sc-qr-dialog__close:hover,
.sc-qr-dialog .sc-qr-dialog__close:focus-visible {
	background: var(--warm);
	color: var(--ink);
}

.sc-qr-dialog .sc-qr-dialog__title {
	margin: 0 0 18px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--text-3);
}

.sc-qr-dialog .sc-qr-dialog__code {
	display: block;
	width: 220px;
	height: 220px;
	margin: 0 auto 18px;
}

.sc-qr-dialog .sc-qr-dialog__num {
	margin: 0 0 6px;
	font-size: 19px;
	font-weight: 700;
	color: var(--eu-blue);
}

.sc-qr-dialog .sc-qr-dialog__note {
	margin: 0 0 22px;
	font-size: 14px;
	line-height: 1.55;
	color: var(--text-2);
}

.sc-qr-dialog .sc-qr-dialog__open {
	width: 100%;
	margin-top: 4px;
	justify-content: center;
}

/* Independence notice under the footer bar (site is not an official EU site). */
.setupco-footer__notice {
	margin: 20px 0 0;
	font-size: 12.5px;
	line-height: 1.6;
	color: var(--on-blue-cap);
}

.setupco-footer__notice a {
	color: var(--on-blue-body);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.setupco-footer__notice a:hover {
	color: var(--yellow);
}