/*!
 * UNEC — Leading Industry Partners  v1.0.0
 * Figma 184:10675 "Our_partners", file Q5ckGwby9XewAE51OXln5p.
 *
 * Every selector is scoped under #top. The ONLY !important in this file is the
 * container release, marked as such below.
 *
 * Numbers that look arbitrary are derived — read README.md before editing:
 *   97   = (1408 − 923) / 5, the gap space-between yields at the design width
 *   262  = 80 + 14.14 + 48 + 40 + 80, the band height as Figma draws it
 *   14.14 = cap height of Pretendard at 20px (1448 / 2048 × 20)
 */

/* ---------------------------------------------------------------------------
 * 1. The container release
 *
 * Enfold caps page content at .responsive .container { max-width: 1310px }
 * with 50px of inset. A full-bleed band has to break out of it.
 *
 * This module ships its OWN release rather than borrowing unec-service's,
 * because that stylesheet is enqueued only on pages carrying a unec-service
 * shortcode — claude/container-release.md. Reuse is only reuse if the
 * original is guaranteed present.
 *
 * The third selector walks UP from our own section: .container is an ANCESTOR
 * of the section, so a class on the Color Section can never reach it downward.
 * width='container' opts out through :not(.unec_ptr_sec_contained).
 *
 * !important is the deliberate exception, and the only one in this file: it
 * beats Enfold's generated post-<id>.css, which the client can raise from the
 * page editor at any time (unec-service v1.0.10 hit exactly this).
 * ------------------------------------------------------------------------ */

#top .unec_svc_host .container,
#top .unec_ptr_host .container,
#top .container_wrap:has(> .container .unec_ptr_sec:not(.unec_ptr_sec_contained)) > .container {
	max-width: 100% !important;
	width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* ---------------------------------------------------------------------------
 * 2. Tokens
 * ------------------------------------------------------------------------ */

#top .unec_ptr_sec {
	/* Ink and ground */
	--unec_ptr_ink: #231F20;
	--unec_ptr_ground: #F8F8F9;
	--unec_ptr_art_ink: rgba(35, 31, 32, 0.055);

	/* Container */
	--unec_ptr_max: 1408px;
	--unec_ptr_gutter_min: 50px;

	/* Rhythm — 80 + label + 48 + row + 80 = 262 */
	--unec_ptr_pad_v: 80px;
	--unec_ptr_head_gap: 48px;
	--unec_ptr_row_h: 40px;

	/* The strip */
	--unec_ptr_gap_default: 97px;
	--unec_ptr_logo_h_default: 40px;

	/* Type — Figma "Desktop/H6": Pretendard Medium 20/30, −1% */
	--unec_ptr_font: 'Pretendard', 'Pretendard Variable', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
	--unec_ptr_label_fs: 20px;
	--unec_ptr_label_lh: 30px;
	--unec_ptr_label_ls: -0.01em;
	--unec_ptr_label_weight: 500;

	/*
	 * Pretendard typo metrics, USE_TYPO_METRICS set — verified with fontTools
	 * against the Regular, Medium and SemiBold faces on four previous modules.
	 * unitsPerEm 2048 / typoAscender 1949 / typoDescender −494 / capHeight 1448
	 */
	--unec_ptr_upm_asc: 0.9516601563;
	--unec_ptr_upm_desc: 0.2412109375;
	--unec_ptr_upm_cap: 0.7070312500;

	/* Artwork — the faint diagonals behind the band */
	--unec_ptr_art: url("../assets/diagonals.svg");
	--unec_ptr_art_pos: center top;
	--unec_ptr_art_size: auto 100%;

	/*
	 * Ladders. The responsive rules move these MULTIPLIERS and never the
	 * values themselves: --unec_ptr_pt, --unec_ptr_pb, --unec_ptr_gap,
	 * --unec_ptr_logo_h, --unec_ptr_item_h and --unec_ptr_item_ar are written
	 * INLINE by PHP, and an inline custom property beats every stylesheet
	 * rule — claude/section-padding.md trap 1. A multiplier ladder is also
	 * monotonic by construction.
	 */
	--unec_ptr_pad_scale: 1;
	--unec_ptr_gap_scale: 1;
	--unec_ptr_logo_scale: 1;
}

/* ---------------------------------------------------------------------------
 * 3. The band
 * ------------------------------------------------------------------------ */

#top .unec_ptr_sec {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	background-color: var(--unec_ptr_bg, var(--unec_ptr_ground));
	padding-top: calc(var(--unec_ptr_pt, var(--unec_ptr_pad_v)) * var(--unec_ptr_pad_scale));
	padding-bottom: calc(var(--unec_ptr_pb, var(--unec_ptr_pad_v)) * var(--unec_ptr_pad_scale));
	padding-left: max(var(--unec_ptr_gutter_min), calc((100% - var(--unec_ptr_max)) / 2));
	padding-right: max(var(--unec_ptr_gutter_min), calc((100% - var(--unec_ptr_max)) / 2));

	/*
	 * We want ONE of overflow:hidden's three jobs — the clipping. Not the
	 * scroll container (nothing here is sticky, but an ancestor that clips
	 * becomes the scrollport for anything that ever is) and not the block
	 * formatting context (this section has no floated children).
	 * claude/overflow-and-sticky.md. `hidden` is the fallback for browsers
	 * without `clip`.
	 */
	overflow: hidden;
}

@supports (overflow: clip) {
	#top .unec_ptr_sec {
		overflow: clip;
	}
}

/*
 * Enfold's bare-element rules beat inheritance, so the family is restated on
 * descendants rather than set once on the section — claude/services-page.md
 * trap 1. Cap-height trim computed against the wrong face shifts the rhythm.
 */
#top .unec_ptr_sec,
#top .unec_ptr_sec p,
#top .unec_ptr_sec a,
#top .unec_ptr_sec li {
	font-family: var(--unec_ptr_font);
}

/* The diagonals. A mask, not an image, so the colour is a token and one asset
 * serves any ground — the same move unec-cta/ makes. */
#top .unec_ptr_sec::before {
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-color: var(--unec_ptr_art_ink);
	-webkit-mask-image: var(--unec_ptr_art);
	mask-image: var(--unec_ptr_art);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: var(--unec_ptr_art_pos);
	mask-position: var(--unec_ptr_art_pos);
	-webkit-mask-size: var(--unec_ptr_art_size);
	mask-size: var(--unec_ptr_art_size);
}

#top .unec_ptr_no_art::before {
	content: none;
}

#top .unec_ptr_inner {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	max-width: var(--unec_ptr_max);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: calc(var(--unec_ptr_head_gap) * var(--unec_ptr_pad_scale));
}

/* ---------------------------------------------------------------------------
 * 4. The label — cap-height trimmed, so 80px really is 80px to the cap top
 * ------------------------------------------------------------------------ */

#top .unec_ptr_label {
	--unec_ptr_half_lead: calc((var(--unec_ptr_label_lh) - (var(--unec_ptr_upm_asc) + var(--unec_ptr_upm_desc)) * var(--unec_ptr_label_fs)) / 2);
	--unec_ptr_trim_top: calc(var(--unec_ptr_half_lead) + (var(--unec_ptr_upm_asc) - var(--unec_ptr_upm_cap)) * var(--unec_ptr_label_fs));
	--unec_ptr_trim_bot: calc(var(--unec_ptr_half_lead) + var(--unec_ptr_upm_desc) * var(--unec_ptr_label_fs));

	margin: 0;
	padding: 0;
	max-width: 100%;
	color: var(--unec_ptr_ink);
	font-size: var(--unec_ptr_label_fs);
	line-height: var(--unec_ptr_label_lh);
	letter-spacing: var(--unec_ptr_label_ls);
	font-weight: var(--unec_ptr_label_weight);
	text-align: center;
	overflow-wrap: break-word;
}

/* Capsize fallback. `display: table` stops the negative margins collapsing
 * into the element's own, so this composes with the flex gap above instead of
 * fighting it. */
#top .unec_ptr_label::before,
#top .unec_ptr_label::after {
	content: '';
	display: table;
}

#top .unec_ptr_label::before {
	margin-bottom: calc(-1 * var(--unec_ptr_trim_top));
}

#top .unec_ptr_label::after {
	margin-top: calc(-1 * var(--unec_ptr_trim_bot));
}

@supports (text-box-trim: trim-both) and (text-box-edge: cap alphabetic) {
	#top .unec_ptr_label {
		text-box-trim: trim-both;
		text-box-edge: cap alphabetic;
	}

	#top .unec_ptr_label::before,
	#top .unec_ptr_label::after {
		content: none;
	}
}

/* ---------------------------------------------------------------------------
 * 5. The strip
 * ------------------------------------------------------------------------ */

#top .unec_ptr_strip {
	position: relative;
	width: 100%;

	/*
	 * splide-core hides .splide outright until it adds .is-initialized, so any
	 * module using Splide renders NOTHING with JavaScript off unless it puts
	 * the visibility back. Restored unconditionally rather than through
	 * :not(.is-initialized), so nothing here depends on when Splide adds its
	 * own class. claude/about-page-story-and-team.md.
	 */
	visibility: visible;
}

#top .unec_ptr_list {
	align-items: center;
	min-height: calc(var(--unec_ptr_row_h) * var(--unec_ptr_logo_scale));
	list-style: none;
}

/*
 * The un-mounted state IS the design: six logos at space-between across 1408,
 * which at the drawn width is identical to a flat 97px gap because
 * 923 + 5 × 97 = 1408 exactly. It is also what no-JS and prefers-reduced-motion
 * get, and what motion='static' keeps for good.
 *
 * Gated on OUR OWN class, never on Splide's .is-initialized — Splide adds that
 * in the LAST statement of mount(), long after Layout has measured the slides,
 * so a pre-mount rule keyed on it is still in force while it measures and
 * poisons the opening offset. claude/services-page.md trap 6.
 *
 * Once .unec_ptr_ready is on (added synchronously before the constructor)
 * Splide owns the spacing through its own `gap` option, so the two can never
 * both apply and double the gap.
 */
#top .unec_ptr_strip:not(.unec_ptr_ready) .unec_ptr_list {
	justify-content: space-between;
	gap: calc(var(--unec_ptr_gap, var(--unec_ptr_gap_default)) * var(--unec_ptr_gap_scale));
}

/*
 * The gap probe. It carries the same calc() the un-mounted list uses, so the
 * script can read the current gap at any breakpoint — including after Splide
 * has taken the spacing over and the list's own gap is gone. Zero height, so
 * it costs no layout.
 */
#top .unec_ptr_gap_probe {
	position: absolute;
	top: 0;
	left: 0;
	height: 0;
	visibility: hidden;
	pointer-events: none;
	width: calc(var(--unec_ptr_gap, var(--unec_ptr_gap_default)) * var(--unec_ptr_gap_scale));
}

#top .unec_ptr_item {
	display: flex;
	align-items: center;
	flex: 0 0 auto;
	margin: 0;
	padding: 0;
	list-style: none;
}

#top .unec_ptr_logo {
	display: block;
	height: calc(var(--unec_ptr_item_h, var(--unec_ptr_logo_h, var(--unec_ptr_logo_h_default))) * var(--unec_ptr_logo_scale));
	width: auto;
	aspect-ratio: var(--unec_ptr_item_ar, auto);

	/*
	 * Enfold ships `#top img { max-width: 100%; height: auto }`. Both have to
	 * be undone or an SVG — which reports no intrinsic size to WordPress —
	 * collapses. claude/about-page.md.
	 */
	max-width: none;
	max-height: none;
	object-fit: contain;
}

#top .unec_ptr_link {
	display: block;
	line-height: 0;
	border: 0;
	text-decoration: none;
}

#top .unec_ptr_link:focus-visible {
	outline: 2px solid var(--unec_ptr_ink);
	outline-offset: 8px;
}

/* Splide draws no controls on this band — Figma draws none either. */
#top .unec_ptr_strip .splide__arrows,
#top .unec_ptr_strip .splide__pagination {
	display: none;
}

/* ---------------------------------------------------------------------------
 * 6. Responsive — multipliers only, never the values
 * ------------------------------------------------------------------------ */

@media only screen and (max-width: 1400px) {
	#top .unec_ptr_sec {
		--unec_ptr_pad_scale: 0.85;
		--unec_ptr_gap_scale: 0.85;
	}
}

@media only screen and (max-width: 1180px) {
	#top .unec_ptr_sec {
		--unec_ptr_pad_scale: 0.75;
		--unec_ptr_gap_scale: 0.75;
		--unec_ptr_logo_scale: 0.95;
	}
}

@media only screen and (max-width: 1024px) {
	#top .unec_ptr_sec {
		--unec_ptr_pad_scale: 0.65;
		--unec_ptr_gap_scale: 0.65;
		--unec_ptr_logo_scale: 0.9;
		--unec_ptr_head_gap: 40px;
	}
}

@media only screen and (max-width: 768px) {
	#top .unec_ptr_sec {
		--unec_ptr_pad_scale: 0.55;
		--unec_ptr_gap_scale: 0.5;
		--unec_ptr_logo_scale: 0.85;
		--unec_ptr_gutter_min: 40px;
		--unec_ptr_head_gap: 32px;
		--unec_ptr_label_fs: 18px;
		--unec_ptr_label_lh: 28px;
	}
}

@media only screen and (max-width: 480px) {
	#top .unec_ptr_sec {
		--unec_ptr_pad_scale: 0.45;
		--unec_ptr_gap_scale: 0.4;
		--unec_ptr_logo_scale: 0.75;
		--unec_ptr_gutter_min: 24px;
		--unec_ptr_head_gap: 28px;
		--unec_ptr_label_fs: 17px;
		--unec_ptr_label_lh: 26px;
	}
}
