/* =============================================================================
   Design widgets — the static HTML build's sections, as designed.

   The "Design — …" widgets (inc/widgets/class-trp-tpl-*.php) print the HTML
   build's markup class for class, so custom.css lays them out. But widgets.css
   restyles a handful of selectors those sections share with the brand widgets
   — the section title, the page header, the process steps, the FAQ answers —
   and loaded after custom.css it wins. Everything here is scoped to .trp-tpl
   and puts the template's own values back, responsive steps included, so a
   design section looks like the HTML page and the brand widgets elsewhere are
   untouched.

   Colours still come from the brand tokens in style.css (--primary-color is
   TRP Navy, --accent-color TRP Orange): the layout is the design's, the
   palette is the brand's.
   ========================================================================== */

/* ---- Base text ----------------------------------------------------------- */

/* The template's body rhythm (1.7em) rather than the brand's fixed 26px. */
.trp-tpl {
	line-height: 1.7em;
}

/* widgets.css spaces the brand About widget's body; the design's has none. */
.trp-tpl .about-content-body {
	margin-top: 0;
}

/* widgets.css spaces the brand hero's two buttons as a flex row, and pads the
   brand blog cards; the design does neither. */
.trp-tpl .hero-btn {
	display: block;
	margin-top: 0;
}

.trp-tpl .post-item {
	height: auto;
	margin-bottom: 30px;
}

.trp-tpl .post-item-body {
	padding-top: 0;
}

/* widgets.css shrinks the brand contact widget's icon to a 48px glyph box. */
.trp-tpl .contact-info-item .icon-box {
	width: 60px;
	height: 60px;
	display: flex;
	margin-bottom: 0;
	font-size: inherit;
}

.trp-tpl .contact-info-item p {
	margin: 0;
}

.trp-tpl .contact-info-item a {
	color: inherit;
}

/* Single post. widgets.css gives page and post content a brand quote (an
   orange rule) and list spacing; the design's quote is the navy card with the
   quote icon, and its lists are spaced by custom.css's .post-entry rules.
   The template's breakpoint values are repeated at the bottom of the file. */
.trp-tpl .post-content blockquote {
	margin: 0 0 30px;
	padding: 30px 30px 30px 100px;
	border-left: 0;
	font-size: inherit;
	line-height: inherit;
	color: inherit;
}

.trp-tpl .post-content ul,
.trp-tpl .post-content ol {
	margin: 20px 0;
	padding-left: 20px;
}

.trp-tpl .post-content .post-social-sharing ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* ---- Base headings ------------------------------------------------------- */

/* style.css sets h1–h3 to the brand type scale — h2 28px on a fixed 36px line.
   The template sizes its headings per component (".about-counter h2" is
   80px) and leaves the line height at 1.2em, so the brand's fixed line
   height squeezed every large figure in the design onto overlapping lines.
   :where() keeps these at element specificity: they beat the brand's bare
   h2 rule (later in the cascade) and lose to every component rule in
   custom.css, which is the template's own order. */
:where(.trp-tpl) h1,
:where(.trp-tpl) h2,
:where(.trp-tpl) h3,
:where(.trp-tpl) h4,
:where(.trp-tpl) h5,
:where(.trp-tpl) h6 {
	font-weight: 700;
	line-height: 1.2em;
}

:where(.trp-tpl) h1 { font-size: 2em; }
:where(.trp-tpl) h2 { font-size: 1.5em; }
:where(.trp-tpl) h3 { font-size: 1.17em; }

/* ---- Section title ------------------------------------------------------- */

.trp-tpl .section-row {
	margin-bottom: 80px;
}

.trp-tpl .section-title {
	margin-bottom: 40px;
}

.trp-tpl .section-row .section-title {
	margin-bottom: 0;
}

/* The eyebrow: the design's dot icon before it, not the brand's rule after. */
.trp-tpl .section-title h3 {
	display: inline-block;
	position: relative;
	font-size: 14px;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--primary-color);
	padding-left: 26px;
	margin: 0 0 15px;
	gap: 0;
}

.trp-tpl .section-title h3::after {
	content: none;
}

/* The icon is the template's SVG drawn in the accent colour, so it follows
   the brand orange instead of the template's #FF9900. */
.trp-tpl .section-title h3::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	width: 16px;
	height: 16px;
	background: var(--accent-color);
	-webkit-mask: url("../images/icon-sub-heading.svg") no-repeat left center / contain;
	mask: url("../images/icon-sub-heading.svg") no-repeat left center / contain;
}

.trp-tpl .section-title h2 {
	font-size: 50px;
	font-weight: 300;
	line-height: 1.2em;
	letter-spacing: -0.01em;
	color: var(--primary-color);
	margin-bottom: 0;
	max-width: none;
}

.trp-tpl .section-title h2 span {
	font-weight: 700;
}

.trp-tpl .section-title p {
	margin-top: 20px;
	margin-bottom: 0;
}

.trp-tpl .section-title-content {
	margin-left: 90px;
}

.trp-tpl .section-title-content p {
	margin: 0;
	color: var(--text-color);
}

.trp-tpl .section-title.dark-section h3,
.trp-tpl .section-title.dark-section h2,
.trp-tpl .section-title.dark-section p,
.trp-tpl .section-title-content.dark-section p {
	color: var(--white-color);
}

.trp-tpl .section-title.dark-section h3::before {
	background: var(--accent-color);
}

/* ---- Page header --------------------------------------------------------- */

.page-header.trp-tpl {
	padding: 150px 0;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

.page-header.trp-tpl .page-header-box h1 {
	max-width: none;
}

/* ---- Process ------------------------------------------------------------- */

.trp-tpl .process-steps-box {
	display: block;
}

.trp-tpl .process-step-content h3 {
	font-size: 20px;
	margin: 0 0 10px;
}

.trp-tpl .process-step-content p {
	color: var(--text-color);
}

.trp-tpl .our-process-image figure {
	margin: 0;
	border-radius: 40px;
}

/* ---- FAQ answers --------------------------------------------------------- */

/* The design's open answer is white type on the accent fill. The answers here
   can hold lists and bold text as well as paragraphs, and widgets.css colours
   the body slate, so every part of it is set white. */
.trp-tpl .our-faq-section .accordion-item .accordion-body,
.trp-tpl .our-faq-section .accordion-item .accordion-body li,
.trp-tpl .our-faq-section .accordion-item .accordion-body strong {
	color: var(--white-color);
}

.trp-tpl .our-faq-section .accordion-item .accordion-body p + p,
.trp-tpl .our-faq-section .accordion-item .accordion-body p + ol,
.trp-tpl .our-faq-section .accordion-item .accordion-body p + ul {
	margin-top: 10px;
}

.trp-tpl .our-faq-section .accordion-item .accordion-body ul {
	margin: 10px 0 0;
	padding-left: 18px;
	list-style: disc;
}

/* Numbered and lettered answers ("1. … 8.", "a. … d."). */
.trp-tpl .our-faq-section .accordion-item .accordion-body ol {
	margin: 10px 0 0;
	padding-left: 22px;
	list-style: decimal;
}

.trp-tpl .our-faq-section .accordion-item .accordion-body ol[type="a"] {
	list-style: lower-alpha;
}

.trp-tpl .our-faq-section .accordion-item .accordion-body li::marker {
	font-weight: 700;
}

.trp-tpl .our-faq-section .accordion-item .accordion-body li {
	margin-bottom: 4px;
}

/* ---- Testimonials -------------------------------------------------------- */

/* widgets.css draws the brand widget's quotes as cards; the design's are not. */
.trp-tpl .testimonial-item {
	height: auto;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0;
}

/* ---- Team: initials in place of a photo ---------------------------------- */

.trp-tpl .team-image .trp-team-initials {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	aspect-ratio: 1 / 1.2;
	border-radius: 40px;
	background: linear-gradient(160deg, var(--trp-navy-light) 0%, var(--primary-color) 100%);
}

.trp-tpl .team-image .trp-team-initials span {
	font-family: var(--heading-font);
	font-size: 64px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--white-color);
}

/* ---- What we do: the badge is a link now --------------------------------- */

.trp-tpl .contact-now-circle a {
	display: block;
	line-height: 0;
}

/* ---- Responsive steps, as in custom.css ---------------------------------- */

@media only screen and (max-width: 991px) {

	.trp-tpl .section-row {
		margin-bottom: 50px;
	}

	.trp-tpl .section-title {
		margin-bottom: 30px;
	}

	.trp-tpl .section-title h2 {
		font-size: 40px;
	}

	.trp-tpl .section-title p {
		margin-top: 15px;
	}

	.trp-tpl .section-title-content {
		margin-left: 0;
		margin-top: 15px;
	}

	.page-header.trp-tpl {
		padding: 80px 0;
	}

	.trp-tpl .post-content blockquote {
		padding: 25px 25px 25px 90px;
		margin-bottom: 20px;
	}
}

@media only screen and (max-width: 767px) {

	.trp-tpl .section-row {
		margin-bottom: 30px;
	}

	.trp-tpl .section-title h2 {
		font-size: 28px;
	}

	.trp-tpl .process-step-content h3 {
		font-size: 18px;
	}

	.trp-tpl .team-image .trp-team-initials span {
		font-size: 48px;
	}

	.trp-tpl .post-content blockquote {
		padding: 65px 15px 15px 15px;
	}
}

/* ---- Capability rows (Core Capabilities page) ---------------------------

   No HTML page exists for this section, so it is arranged from the design's
   own parts — section title, rounded reveal image, ticked list, button —
   with only the layout below added. Values follow the template: 40px image
   radius, 100px section padding, accent-coloured figures. */

.trp-cap-rows {
	padding: 100px 0 40px;
}

.trp-cap-row {
	margin-bottom: 100px;
}

.trp-cap-row:last-child {
	margin-bottom: 60px;
}

.trp-cap-media {
	position: relative;
	margin-right: 30px;
}

.trp-cap-row--flip .trp-cap-media {
	margin-right: 0;
	margin-left: 30px;
}

.trp-cap-media figure {
	display: block;
	margin: 0;
	border-radius: 40px;
	overflow: hidden;
}

.trp-cap-media img:is(.trp-tpl *) {
	width: 100%;
	aspect-ratio: 1 / 0.82;
	object-fit: cover;
	border-radius: 40px;
}

/* The step number: a white tab cut into the image's lower corner, the
   figure in the accent colour — the same device as the design's
   "25+ years of experience" badge. */
.trp-cap-no {
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 2;
	padding: 18px 30px 0 0;
	background: var(--white-color);
	border-top-right-radius: 40px;
	font-family: var(--heading-font);
	font-size: 70px;
	font-weight: 700;
	line-height: 1;
	color: var(--accent-color);
}

.trp-cap-row--flip .trp-cap-no {
	left: auto;
	right: 0;
	padding: 18px 0 0 30px;
	border-top-right-radius: 0;
	border-top-left-radius: 40px;
}

.trp-cap-body .section-title {
	margin-bottom: 30px;
}

.trp-cap-body .section-title h2 {
	font-size: 42px;
}

/* Highlights: one column of full sentences by default, two for short
   phrases. The tick sits on the first line rather than the middle, so it
   lines up with sentences that wrap. */
.trp-cap-list ul {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 16px;
}

.trp-cap-list.trp-cap-list--2 ul {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px 24px;
}

.trp-cap-list ul li,
.trp-cap-list ul li:last-child {
	margin-bottom: 0;
	line-height: 1.6em;
}

/* custom.css capitalises every word of a list item, which suits short
   labels and mangles sentences ("Detailed E&I Engineering For Gas…"). */
.trp-cap-list:not(.trp-cap-list--2) ul li {
	text-transform: none;
}

.trp-cap-list ul li::before {
	top: 2px;
	transform: none;
}

@media only screen and (min-width: 992px) {
	.trp-cap-row--flip > .col-lg-6:first-child {
		order: 2;
	}
}

@media only screen and (max-width: 991px) {
	.trp-cap-rows {
		padding: 50px 0 10px;
	}

	.trp-cap-row {
		margin-bottom: 60px;
	}

	.trp-cap-media,
	.trp-cap-row--flip .trp-cap-media {
		margin: 0 0 30px;
	}

	.trp-cap-no {
		font-size: 50px;
	}

	.trp-cap-body .section-title h2 {
		font-size: 34px;
	}
}

@media only screen and (max-width: 767px) {
	.trp-cap-list.trp-cap-list--2 ul {
		grid-template-columns: 1fr;
	}

	.trp-cap-body .section-title h2 {
		font-size: 28px;
	}
}

/* ---- Contact page additions ------------------------------------------------

   Content the design has no slot for: a contact person with a Font Awesome
   glyph in the icon tile (the design's tiles hold SVGs), the GST number under
   the address, and the "Services required" dropdown, given the design's
   input style with room for Bootstrap's chevron. */

.trp-tpl .contact-info-item .icon-box .trp-contact-glyph {
	position: relative;
	z-index: 1;
	font-size: 26px;
	color: var(--white-color);
}

.trp-tpl .trp-contact-gst {
	display: inline-block;
	margin-top: 4px;
	font-size: 14px;
	font-weight: 600;
	color: var(--primary-color);
}

.trp-tpl .contact-form .trp-select {
	padding-right: 44px;
	background-position: right 16px center;
	background-size: 14px 10px;
	cursor: pointer;
}

.trp-tpl .contact-form .trp-select:invalid {
	color: var(--text-color);
}

/* ---- What we do: real titles ---------------------------------------------

   custom.css capitalises every word of these titles, which turns "132 kV"
   into "132 KV". The titles are written in title case already. */

.trp-tpl .what-we-item-content h3 {
	text-transform: none;
}

/* ---- Service details: the headline as a lead line ------------------------ */

.trp-tpl .service-entry .trp-service-lead {
	font-family: var(--heading-font);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.45em;
	color: var(--primary-color);
}

@media only screen and (max-width: 767px) {
	.trp-tpl .service-entry .trp-service-lead {
		font-size: 19px;
	}
}

/* ---- Page header subtitle --------------------------------------------------- */

.page-header.trp-tpl .page-header-subtitle {
	max-width: 760px;
	margin: 10px 0 18px;
	font-size: 18px;
	line-height: 1.6em;
	color: rgba(255, 255, 255, 0.85);
}

/* ---- Home page additions ---------------------------------------------------

   Parts the home page content needs that index.html has no slot for, styled
   from the design's own values. */

/* Hero: the subtitle line between the H1 and the intro, and the intro block
   that follows it. The H1's section-title keeps its 40px margin; these sit
   tighter so the three read as one group. */
.hero.trp-tpl .hero-content > .section-title {
	margin-bottom: 20px;
}

.hero.trp-tpl .trp-hero-lead {
	max-width: 640px;
	margin: 0 0 16px;
	font-family: var(--heading-font);
	font-size: 20px;
	font-weight: 600;
	line-height: 1.45em;
	color: var(--white-color);
}

.hero.trp-tpl .trp-hero-intro {
	margin-bottom: 40px;
}

.hero.trp-tpl .trp-hero-intro p {
	margin-top: 0;
}

/* Two buttons side by side. */
.hero.trp-tpl .trp-hero-btns {
	display: flex;
	flex-wrap: wrap;
	gap: 15px 20px;
}

/* A seven-item strip wraps; a tighter gap keeps it to two rows. */
.hero.trp-tpl .excellence-innovating-list {
	margin-top: 100px;
}

.hero.trp-tpl .excellence-innovating-list ul {
	gap: 18px 50px;
}

/* About: the long list full width, in two columns. */
.trp-tpl .trp-about-list-wide {
	margin-bottom: 30px;
}

.trp-tpl .trp-about-list-wide ul {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px 24px;
}

.trp-tpl .trp-about-list-wide ul li,
.trp-tpl .trp-about-list-wide ul li:last-child {
	margin-bottom: 0;
	line-height: 1.5em;
	text-transform: none;
}

.trp-tpl .trp-about-list-wide ul li::before {
	top: 0;
	transform: none;
}

/* Our Work cards with a description under the title. */
.trp-tpl .project-content .trp-project-text {
	max-width: 520px;
	margin: 12px auto 0;
}

/* Service cards with a line of text (Software & Standards). */
.trp-tpl .service-body .trp-service-text {
	margin: 10px 0 0;
}

@media only screen and (max-width: 991px) {
	.hero.trp-tpl .excellence-innovating-list {
		margin-top: 60px;
	}

	.hero.trp-tpl .excellence-innovating-list ul {
		gap: 14px 30px;
	}
}

@media only screen and (max-width: 767px) {
	.hero.trp-tpl .trp-hero-lead {
		font-size: 17px;
	}

	.trp-tpl .trp-about-list-wide ul {
		grid-template-columns: 1fr;
	}
}

/* ---- Footer ---------------------------------------------------------------

   The footer carries .trp-tpl for its section title; the title sits in the
   footer header with no margin under it, as custom.css has it. */

.trp-tpl .footer-header .section-title {
	margin-bottom: 0;
}

.trp-tpl .footer-contact-circle a {
	display: block;
	line-height: 0;
}

/* The text logo, when no logo image is uploaded. */
.main-footer .footer-logo .trp-logo {
	font-family: var(--heading-font);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--white-color);
	text-decoration: none;
}

/* ---- Images: the template's, over Elementor's reset ------------------------

   Elementor's frontend.css loads after the theme and carries
   ".elementor img { border:none; border-radius:0; height:auto; ... }". At the
   same specificity as the template's ".about-img-2 img" rules and later in
   the cascade, it flattened every rounded, framed or fixed-ratio image in the
   design. These are the template's own image rules (generated from custom.css,
   media queries included), each made one class stronger by :is(.trp-tpl *) on
   the image itself. Scoping the image rather than prefixing the selector keeps
   rules that start at the section (".page-blog .post-featured-image img")
   matching, and keeps the template's own order between them. */

img:is(.trp-tpl *) {
	max-width: 100%;
}

.reveal img:is(.trp-tpl *) {
	height: 100%;
}

.topbar-contact-info li .icon-box img:is(.trp-tpl *) {
	max-width: 24px;
}

.hero.hero-slider-layout .hero-slide .hero-slider-image img:is(.trp-tpl *) {
	height: 100%;
}

.about-img-1 figure img:is(.trp-tpl *) {
	border-radius: 40px;
}

.about-img-2 img:is(.trp-tpl *) {
	border: 10px solid var(--white-color);
	aspect-ratio: 1 / 1.22;
	border-radius: 40px;
}

.service-item .icon-box img:is(.trp-tpl *) {
	max-width: 60px;
}

.service-item .service-footer a img:is(.trp-tpl *) {
	max-width: 18px;
}

.our-story-header-img figure img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.71;
	border-radius: 40px;
}

.our-story-img img:is(.trp-tpl *) {
	border-radius: 40px;
}

.our-story-img img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.85;
}

.our-story-client-img .client-image img:is(.trp-tpl *) {
	max-width: 60px;
}

.what-we-do-item .icon-box img:is(.trp-tpl *) {
	max-width: 50px;
}

.contact-now-circle img:is(.trp-tpl *) {
	height: 130px;
}

.what-we-do-image figure img:is(.trp-tpl *) {
	height: 100%;
}

.what-we-do-image figure img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.97;
}

.project-image img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.7;
	border-radius: 40px;
}

.our-process-image img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.93;
	border-radius: 40px;
}

.pricing-benefit-list ul li img:is(.trp-tpl *) {
	max-width: 20px;
}

.our-testimonial-image img:is(.trp-tpl *) {
	aspect-ratio:  1 / 1.05;
	border-radius: 40px;
}

.testimonial-body .author-image img:is(.trp-tpl *) {
	height: 60px;
	border-radius: 10px;
}

.post-featured-image img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.63;
	border-radius: 40px;
}

.post-item-btn a img:is(.trp-tpl *) {
	max-width: 24px;
}

.footer-contact-circle img:is(.trp-tpl *) {
	max-width: 130px;
}

.footer-logo img:is(.trp-tpl *) {
	max-width: 180px;
}

.mission-vision-nav ul li .nav-link img:is(.trp-tpl *) {
	max-width: 40px;
}

.mission-vision-image img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.63;
	border-radius: 40px;
}

.our-history-image img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.96;
	border-radius: 40px;
}

.our-features-item .icon-box img:is(.trp-tpl *) {
	max-width: 50px;
}

.our-features-item.features-image-box img:is(.trp-tpl *) {
	height: 100%;
	aspect-ratio: 1 / 0.485;
}

.team-image img:is(.trp-tpl *) {
	aspect-ratio: 1 / 1.15;
	border-radius: 20px;
}

.our-faqs-img figure img:is(.trp-tpl *) {
	aspect-ratio:  1 / 0.99;
}

.faqs-img-cta-box ul li a img:is(.trp-tpl *) {
	max-width: 30px;
}

.sidebar-cta-logo img:is(.trp-tpl *) {
	max-width: 160px;
}

.sidebar-cta-contact-item img:is(.trp-tpl *) {
	max-width: 24px;
}

.service-featured-image img:is(.trp-tpl *) {
	border-radius: 40px;
	aspect-ratio: 1 / 0.67;
}

.service-entry-item .icon-box img:is(.trp-tpl *) {
	max-width: 50px;
}

.service-entry-img img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.96;
	border-radius: 40px;
}

.page-blog .post-featured-image img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.91;
}

.post-image img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.50;
	border-radius: 40px;
}

.project-detail-item .icon-box img:is(.trp-tpl *) {
	max-width: 20px;
}

.project-single-image img:is(.trp-tpl *) {
	border-radius: 40px;
	aspect-ratio: 1 / 0.67;
}

.project-query-img img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.73;
	border-radius: 40px;
}

.team-member-image img:is(.trp-tpl *) {
	aspect-ratio: 1 / 1.15;
	border-radius: 30px;
}

.team-detail-item .icon-box img:is(.trp-tpl *) {
	max-width: 20px;
}

.client-author-image img:is(.trp-tpl *) {
	height: 60px;
	border-radius: 10px;
}

.client-testimonial-quote img:is(.trp-tpl *) {
	max-width: 40px;
}

.page-gallery-box .photo-gallery img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.7;
	border-radius: 20px;
}

.video-gallery-image img:is(.trp-tpl *) {
	aspect-ratio: 1 / 0.7;
	border-radius: 20px;
}

.contact-info-item .icon-box img:is(.trp-tpl *) {
	max-width: 30px;
}

.error-page-image img:is(.trp-tpl *) {
	max-width: 50%;
}

@media only screen and (max-width: 1366px) {
	.contact-now-circle img:is(.trp-tpl *) {
		height: 100px;
	}
}

@media only screen and (max-width: 1024px) {
	.contact-now-circle img:is(.trp-tpl *) {
		height: 80px;
	}
}

@media only screen and (max-width: 991px) {
	.topbar-contact-info li .icon-box img:is(.trp-tpl *) {
		max-width: 20px;
	}

	.main-header .navbar-brand img:is(.trp-tpl *) {
		max-width: 130px;
	}

	.about-img-2 img:is(.trp-tpl *) {
		aspect-ratio: 1 / 1.1;
	}

	.service-item .icon-box img:is(.trp-tpl *) {
		max-width: 50px;
	}

	.our-story-img img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.55;
	}

	.our-story-client-img .client-image img:is(.trp-tpl *) {
		max-width: 50px;
	}

	.what-we-do-image figure img:is(.trp-tpl *) {
		height: auto;
	}

	.what-we-do-image figure img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.77;
	}

	.contact-now-circle img:is(.trp-tpl *) {
		height: 100px;
	}

	.project-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.7;
		border-radius: 30px;
	}

	.our-process-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.73;
		border-radius: 30px;
	}

	.our-testimonial-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.8;
		border-radius: 30px;
	}

	.post-featured-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.73;
		border-radius: 30px;
	}

	.mission-vision-nav ul li .nav-link img:is(.trp-tpl *) {
		max-width: 30px;
	}

	.mission-vision-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.53;
		border-radius: 30px;
	}

	.our-history-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.56;
		border-radius: 30px;
	}

	.team-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 1.1;
	}

	.our-faqs-img figure img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.69;
		border-radius: 30px;
	}

	.service-featured-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.6;
		border-radius: 30px;
	}

	.service-entry-item .icon-box img:is(.trp-tpl *) {
		max-width: 40px;
	}

	.service-entry-img img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.89;
		border-radius: 30px;
	}

	.page-blog .post-featured-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.81;
	}

	.project-single-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.6;
		border-radius: 30px;
	}

	.project-query-img img:is(.trp-tpl *) {
		border-radius: 30px;
	}

	.team-member-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.85;
	}

	.client-author-image img:is(.trp-tpl *) {
		height: 50px;
		border-radius: 10px;
	}

	.contact-info-item .icon-box img:is(.trp-tpl *) {
		max-width: 24px;
	}

	.error-page-image img:is(.trp-tpl *) {
		max-width: 80%;
	}
}

@media only screen and (max-width: 767px) {
	.topbar-contact-info li .icon-box img:is(.trp-tpl *) {
		max-width: 16px;
	}

	.about-img-2 img:is(.trp-tpl *),
	.about-img-1 figure img:is(.trp-tpl *) {
		border-radius: 30px;
	}

	.our-story-img img:is(.trp-tpl *),
	.our-story-header-img figure img:is(.trp-tpl *) {
		border-radius: 20px;
	}

	.pricing-benefit-list ul li img:is(.trp-tpl *) {
		max-width: 18px;
	}

	.footer-contact-circle img:is(.trp-tpl *) {
		max-width: 100px;
	}

	.mission-vision-nav ul li .nav-link img:is(.trp-tpl *) {
		max-width: 25px;
	}

	.mission-vision-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.73;
	}

	.our-history-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.76;
	}

	.our-features-item.features-image-box img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.81;
	}

	.our-faqs-img figure img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.89;
	}

	.faqs-img-cta-box ul li a img:is(.trp-tpl *) {
		max-width: 24px;
	}

	.service-featured-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.85;
	}

	.post-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.70;
		border-radius: 30px;
	}

	.project-single-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.85;
	}

	.team-member-image img:is(.trp-tpl *) {
		aspect-ratio: 1 / 0.99;
	}
}

/* -----------------------------------------------------------------------------
   Scope of Services: zigzag layout. With 7 services the second row holds 3;
   centring that row puts each card under the gap between two cards above, so
   the rows interlock. Applies to any count - a short last row always centres.
   ----------------------------------------------------------------------------- */
.our-services-list.trp-tpl .services-list-box {
	justify-content: center;
}
/* The divider line belongs between cards, never after the final one. */
.our-services-list.trp-tpl .services-list-box .service-item:last-child:after {
	display: none;
}
/* Arrow buttons line up across a row whatever the title length. */
.our-services-list.trp-tpl .services-list-box .service-item {
	display: flex;
	flex-direction: column;
}
.our-services-list.trp-tpl .services-list-box .service-item .service-footer {
	margin-top: auto;
}

/* =============================================================================
   COMPACT SPACING - tighter header and section rhythm on every page.
   -----------------------------------------------------------------------------
   The template spaces sections 100-150px apart and stacks a 20px-padded topbar
   with a large logo over a padded navbar. These rules tighten both. Desktop
   only (>= 992px) for the sections: the template's own tablet/phone rules are
   already compact and are left alone. Coupled values (a section's bottom
   padding and the negative margin of the block that overlaps it) are reduced
   together so overlaps keep their shape.
   ============================================================================= */

/* ---- Header: topbar + navbar (all widths) --------------------------------- */
.topbar { padding: 8px 0; }
.topbar .site-logo img,
.topbar .custom-logo { max-height: 74px; width: auto; height: auto; }
.topbar-contact-info ul { margin-right: 28px; padding-right: 28px; }
.topbar-contact-info ul li .icon-box { width: 34px; height: 34px; margin-right: 12px; border-radius: 8px; }
.topbar-contact-info ul li p { font-size: 17px; width: auto; white-space: nowrap; }
.topbar-qoute-btn .btn-default span { padding-top: 13px; padding-bottom: 13px; }
.navbar { padding: 0; }
.main-menu ul li.nav-item .nav-link { padding: 15px 18px; }
@media (max-width: 991.98px) {
	.topbar .site-logo img,
	.topbar .custom-logo { max-height: 48px; }
}

/* ---- Sections (desktop) ---------------------------------------------------- */
@media (min-width: 992px) {
	.section-row,
	.row.section-row { margin-bottom: 48px; }

	.hero { padding: 100px 0 30px; }
	.hero.hero-slider-layout .hero-slide { padding: 140px 0; }

	.about-us, .our-story, .our-process, .our-pricing, .our-testimonial,
	.our-history, .our-features, .our-faqs, .page-service-single, .page-blog,
	.page-single-post, .page-project-single, .page-team-single, .page-pricing,
	.page-faqs, .page-contact-us, .error-page { padding: 70px 0; }

	.our-blog, .our-team, .page-services, .page-team, .page-testimonial,
	.page-gallery, .page-video-gallery { padding: 70px 0 45px; }
	.our-work, .page-projects { padding: 70px 0 40px; }

	/* Navy services band and the white list card that overlaps it. */
	.our-services { padding: 70px 0 200px; }
	.our-services-list { margin-top: -130px; }
	.services-list-box { padding: 45px; }
	.service-body { margin-bottom: 36px; }

	.our-story-content-body, .our-story-counters, .testimonial-content,
	.service-catagery-list, .faq-catagery-list,
	.our-faq-section.page-faq-accordion { margin-bottom: 40px; }

	.what-we-do-content { padding: 70px 90px; }

	.page-header,
	.page-header.trp-tpl { padding: 95px 0; }

	/* Mission/vision band and the card that overlaps it. */
	.mission-vision-bg { padding: 70px 0 160px; }
	.mission-vision-box { margin-top: -160px; }
	.mission-vision-item { padding: 60px; }

	.trp-cap-rows { padding: 70px 0 20px; }
	.trp-cap-row { margin-bottom: 70px; }

	.main-footer { padding: 70px 0 0; }
	.footer-header { margin-bottom: 40px; }
	.footer-copyright { padding: 36px 0; margin-top: 40px; }

	.google-map-iframe, .google-map-iframe iframe { height: 450px; }
}

/* Brand widgets (widgets.css) use one shared rhythm - tighten it too. */
.trp-widget { padding-top: clamp(44px, 5vw, 72px); padding-bottom: clamp(44px, 5vw, 72px); }
.trp-page-content { padding: clamp(40px, 5vw, 64px) 0; }

/* =============================================================================
   HOME HERO HEADING - three lines instead of five.
   -----------------------------------------------------------------------------
   The template's 70px / weight-300 H1 ran to five lines in the hero column.
   A responsive size keeps it to about three lines on desktop, the bold ending
   picks up the brand accent with a thin underline, and a slightly stronger
   left-side shade keeps the white text crisp over the photo.
   ============================================================================= */
.hero.trp-tpl::before {
	background: linear-gradient(270deg, transparent 35%, rgba(10, 18, 48, .55) 70%, rgba(10, 18, 48, .78) 100%);
}
.hero.trp-tpl .hero-content .section-title h1 {
	font-size: clamp(32px, 3.4vw, 52px);
	font-weight: 400;
	line-height: 1.16em;
	letter-spacing: -0.02em;
	max-width: 760px;
	text-shadow: 0 2px 24px rgba(0, 0, 0, .25);
}
.hero.trp-tpl .hero-content .section-title h1 span {
	font-weight: 700;
	color: var(--accent-color);
	background: none;
	padding-bottom: 0;
}
.hero.trp-tpl .trp-hero-lead {
	font-size: clamp(16px, 1.3vw, 19px);
	max-width: 620px;
	padding-left: 16px;
	border-left: 3px solid var(--accent-color);
}
@media (max-width: 767.98px) {
	.hero.trp-tpl .hero-content .section-title h1 { line-height: 1.2em; }
}

/* =====================================================================
   HOME POLISH (1.8.6)
   ===================================================================== */

/* Section titles: two lines at most on desktop. */
@media (min-width: 992px) {
	.trp-tpl .section-title h2,
	.section-title h2 {
		font-size: clamp(30px, 2.65vw, 38px);
		line-height: 1.22em;
	}
	/* The bold half of a heading starts its own line: every title reads as two. */
	.trp-tpl .section-title h2 span { display: block; }
	/* A heading paired with a button or intro gets the wider share of the row. */
	.trp-tpl .row > .col-lg-6:has(> .section-title) {
		flex: 0 0 58%;
		max-width: 58%;
	}
	.trp-tpl .row > .col-lg-6:has(> .section-title) + .col-lg-6 {
		flex: 0 0 42%;
		max-width: 42%;
	}
}

/* FAQs: the opened question reads white on the accent bar. */
.our-faqs.trp-tpl .accordion-button:not(.collapsed),
.our-faq-section .accordion-button:not(.collapsed) {
	color: #fff;
}
.our-faqs.trp-tpl .accordion-button:not(.collapsed)::after {
	color: #fff;
	filter: brightness(0) invert(1);
}

/* Blog: no latest-posts block on the home page. */
.home .our-blog.trp-tpl { display: none; }

/* About: no counter box; less space under the section. */
.about-us.trp-tpl .genuine-rating-counter { display: none; }
@media (min-width: 992px) {
	.about-us.trp-tpl { padding-bottom: 40px; }
}

/* Core capabilities: a plain two-column grid, every card top-aligned in
   source order (Isotope's absolute positioning is switched off). */
.our-work.trp-tpl .project-item-boxes {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 40px 30px;
	height: auto !important;
	margin: 0;
	align-items: start !important;
}
.our-work.trp-tpl .project-item-box {
	position: static !important;
	transform: none !important;
	left: auto !important;
	top: auto !important;
	width: auto;
	max-width: none;
	padding: 0;
	margin: 0;
}
.our-work.trp-tpl .project-image img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}
@media (max-width: 767px) {
	.our-work.trp-tpl .project-item-boxes { grid-template-columns: 1fr; gap: 30px; }
}

/* Why TRP: an even two-column grid of equal cards. */
.what-we-do.trp-tpl .what-we-do-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	align-items: stretch;
}
.what-we-do.trp-tpl .what-we-do-list > [class^="what-we-do-list-box"] { display: contents; }
.what-we-do.trp-tpl .what-we-do-item {
	width: auto;
	height: 100%;
	margin: 0;
}
@media (max-width: 575px) {
	.what-we-do.trp-tpl .what-we-do-list { grid-template-columns: 1fr; }
}

/* How we work: the image runs the full height of the steps beside it. */
@media (min-width: 992px) {
	.our-process.trp-tpl .row.align-items-center { align-items: stretch !important; }
	.our-process.trp-tpl .our-process-image,
	.our-process.trp-tpl .our-process-image figure { height: 100%; }
	.our-process.trp-tpl .our-process-image img {
		height: 100%;
		aspect-ratio: auto;
		min-height: 420px;
	}
	.our-process.trp-tpl .process-steps-box { display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
	.our-process.trp-tpl .process-step-item { padding: 22px 30px; margin-bottom: 14px; }
	.our-process.trp-tpl .process-step-item:last-child { margin-bottom: 0; }
}

/* =====================================================================
   ABOUT US - only the sections in the About Us document (1.8.7)
   ===================================================================== */
.trp-page-about .elementor-widget-trp-tpl-history,
.trp-page-about .elementor-widget-trp-tpl-process,
.trp-page-about .elementor-widget-trp-tpl-testimonials,
.trp-page-about .elementor-widget-trp-tpl-faqs,
.trp-page-about .about-us.trp-tpl .company-experience,
.trp-page-about .about-us.trp-tpl .about-content-btn,
.trp-page-about .about-us.trp-tpl .genuine-rating-counter,
.trp-page-about .our-team.trp-tpl .section-btn,
.trp-page-about .our-mission-vision.trp-tpl .section-title-content,
.trp-page-about .what-we-do.trp-tpl .what-we-do-footer {
	display: none !important;
}

/* =====================================================================
   SERVICES DROPDOWN (1.8.8)
   ===================================================================== */
@media (min-width: 992px) {
	.main-menu ul li.submenu > ul,
	.main-menu ul li.submenu:first-child ul {
		width: 360px;
		padding: 0;
		border-radius: 16px;
		background: #fff;
		box-shadow: 0 18px 40px rgba(23, 33, 79, 0.18);
		border-top: 3px solid var(--accent-color);
		overflow: hidden;
		z-index: 100;
	}
	.main-menu ul li.submenu:hover > ul { padding: 8px 0; }
	.main-menu ul ul li.nav-item .nav-link {
		color: var(--primary-color);
		font-size: 15px;
		line-height: 1.4;
		white-space: normal;
		text-transform: none;
		padding: 10px 22px !important;
		border-bottom: 1px solid rgba(23, 33, 79, 0.07);
	}
	.main-menu ul ul li.nav-item:last-child .nav-link { border-bottom: 0; }
	.main-menu ul ul li .nav-link:hover,
	.main-menu ul ul li .nav-link:focus,
	.main-menu ul ul li.active > .nav-link {
		color: var(--accent-color);
		background: rgba(255, 102, 0, 0.06);
		padding: 10px 22px 10px 26px !important;
	}
}

/* Core Capabilities - only the page header and the four capabilities (1.9.0):
   no industries, tools & standards or how-we-work sections. */
.trp-page-core-capabilities .elementor-widget-trp-tpl-services,
.trp-page-core-capabilities .elementor-widget-trp-tpl-key-features,
.trp-page-core-capabilities .elementor-widget-trp-tpl-process,
.trp-page-core-capabilities .elementor-widget-trp-tpl-faqs,
.trp-page-core-capabilities .elementor-widget-trp-tpl-testimonials {
	display: none !important;
}

/* Contact page: "Get in touch with us" and "Send us a message" on one line (1.9.1). */
.trp-page-contact .trp-tpl .section-title h2 span { display: inline !important; }
.trp-page-contact .trp-tpl .section-title h2 { white-space: nowrap; }
@media (max-width: 575px) {
	.trp-page-contact .trp-tpl .section-title h2 { white-space: normal; }
}

/* =====================================================================
   ABOUT - single framed image (1.9.2)
   Applies to any About widget with one image, and on the About page even
   before it is rebuilt (the second, smaller image is dropped there).
   ===================================================================== */
.trp-page-about .about-us.trp-tpl .about-img-1 { display: none; }

.about-us.trp-tpl .about-image.trp-about-single,
.trp-page-about .about-us.trp-tpl .about-image {
	display: block;
	padding: 0 0 28px 28px;
	margin-right: 30px;
}
.about-us.trp-tpl .about-image.trp-about-single::before,
.trp-page-about .about-us.trp-tpl .about-image::before {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 62%;
	height: 70%;
	border-radius: 36px;
	background: var(--accent-color);
	z-index: 0;
}
.about-us.trp-tpl .about-image.trp-about-single::after,
.trp-page-about .about-us.trp-tpl .about-image::after {
	content: "";
	position: absolute;
	right: -18px;
	top: -18px;
	width: 120px;
	height: 120px;
	background-image: radial-gradient(var(--primary-color) 2px, transparent 2.5px);
	background-size: 16px 16px;
	opacity: 0.25;
	z-index: 0;
}
.about-us.trp-tpl .about-image.trp-about-single .about-img-1,
.about-us.trp-tpl .about-image.trp-about-single .about-img-2,
.trp-page-about .about-us.trp-tpl .about-img-2 {
	position: relative;
	z-index: 1;
	max-width: none;
	width: 100%;
}
.about-us.trp-tpl .about-image.trp-about-single img,
.trp-page-about .about-us.trp-tpl .about-img-2 img {
	width: 100%;
	aspect-ratio: 4 / 3.4;
	object-fit: cover;
	border: 0;
	border-radius: 32px;
	box-shadow: 0 24px 50px rgba(23, 33, 79, 0.18);
}
@media (max-width: 991px) {
	.about-us.trp-tpl .about-image.trp-about-single,
	.trp-page-about .about-us.trp-tpl .about-image {
		max-width: 100%;
		margin: 0 0 40px;
		padding: 0 0 18px 18px;
	}
	.about-us.trp-tpl .about-image.trp-about-single::after,
	.trp-page-about .about-us.trp-tpl .about-image::after { display: none; }
}

/* =====================================================================
   LEADERSHIP - founder profile card (1.9.2)
   ===================================================================== */
.our-team.trp-tpl .trp-leader {
	display: grid;
	grid-template-columns: minmax(260px, 380px) 1fr;
	border-radius: 36px;
	overflow: hidden;
	background: #fff;
	border: 1px solid rgba(23, 33, 79, 0.08);
	box-shadow: 0 24px 60px rgba(23, 33, 79, 0.10);
}
.our-team.trp-tpl .trp-leader-visual {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 360px;
	padding: 40px;
	background:
		radial-gradient(circle at 20% 15%, rgba(255, 255, 255, 0.12) 0, transparent 45%),
		linear-gradient(160deg, var(--trp-navy-light, #33479a) 0%, var(--primary-color) 100%);
}
.our-team.trp-tpl .trp-leader-visual::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255, 255, 255, 0.14) 1.5px, transparent 2px);
	background-size: 18px 18px;
	mask-image: linear-gradient(to bottom, #000, transparent 75%);
	-webkit-mask-image: linear-gradient(to bottom, #000, transparent 75%);
}
.our-team.trp-tpl .trp-leader-monogram {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 190px;
	height: 190px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.08);
	border: 2px solid rgba(255, 255, 255, 0.35);
	box-shadow: 0 0 0 14px rgba(255, 255, 255, 0.05), 0 0 0 28px rgba(255, 255, 255, 0.03);
}
.our-team.trp-tpl .trp-leader-monogram span {
	font-family: var(--heading-font);
	font-size: 68px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: #fff;
}
.our-team.trp-tpl .trp-leader-photo {
	position: relative;
	margin: 0;
	width: 100%;
	height: 100%;
}
.our-team.trp-tpl .trp-leader-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 24px;
}
.our-team.trp-tpl .trp-leader-chip {
	position: absolute;
	left: 50%;
	bottom: 28px;
	transform: translateX(-50%);
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 18px;
	border-radius: 100px;
	background: var(--accent-color);
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	white-space: nowrap;
}
.our-team.trp-tpl .trp-leader-body {
	padding: 48px 56px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.our-team.trp-tpl .trp-leader-name {
	font-size: 32px;
	font-weight: 700;
	color: var(--primary-color);
	margin: 0 0 8px;
}
.our-team.trp-tpl .trp-leader-role {
	font-size: 17px;
	font-weight: 500;
	color: var(--accent-color);
	margin: 0;
	padding-bottom: 22px;
	border-bottom: 1px solid rgba(23, 33, 79, 0.1);
}
.our-team.trp-tpl .trp-leader-bio {
	margin: 22px 0 0;
	line-height: 1.7;
}
.our-team.trp-tpl .trp-leader-points {
	list-style: none;
	margin: 24px 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px 16px;
}
.our-team.trp-tpl .trp-leader-points li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 14px 16px;
	border-radius: 16px;
	background: var(--secondary-color, #f3f5fb);
	color: var(--primary-color);
	font-weight: 500;
	line-height: 1.45;
}
.our-team.trp-tpl .trp-leader-points i {
	flex: 0 0 24px;
	height: 24px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	color: #fff;
	background: var(--accent-color);
	margin-top: 1px;
}
.our-team.trp-tpl .trp-leader-link {
	margin-top: 24px;
	font-weight: 600;
	color: var(--accent-color);
}
@media (max-width: 991px) {
	.our-team.trp-tpl .trp-leader { grid-template-columns: 1fr; }
	.our-team.trp-tpl .trp-leader-visual { min-height: 300px; }
	.our-team.trp-tpl .trp-leader-body { padding: 36px 28px; }
}
@media (max-width: 575px) {
	.our-team.trp-tpl .trp-leader-points { grid-template-columns: 1fr; }
	.our-team.trp-tpl .trp-leader-name { font-size: 26px; }
}

/* =====================================================================
   HOME SPACING + WHY TRP LAST CARD (1.9.3)
   ===================================================================== */

/* Why TRP: an odd last card spans both columns. */
.what-we-do.trp-tpl .what-we-do-list .what-we-do-item.trp-wide { grid-column: 1 / -1; }
@media (min-width: 992px) {
	.what-we-do.trp-tpl .what-we-do-content { padding: 60px 70px; }
	.what-we-do.trp-tpl .what-we-do-item { padding: 26px; }
	.what-we-do.trp-tpl .what-we-do-item .icon-box { margin-bottom: 18px; }
}
/* The tagline under the cards is no longer part of the content. */
.what-we-do.trp-tpl .what-we-do-footer { display: none; }

/* Tighter vertical rhythm on every section. */
@media (min-width: 992px) {
	.trp-tpl .section-row { margin-bottom: 44px; }

	.our-story.trp-tpl { padding: 60px 0; }
	.our-story.trp-tpl .section-row { margin-bottom: 36px; }
	.our-story.trp-tpl .our-story-header-img figure img { aspect-ratio: 1 / 0.62; }
	.our-story.trp-tpl .our-story-img img { aspect-ratio: 1 / 0.72; }
	.our-story.trp-tpl .row { align-items: center; }
	.our-story.trp-tpl .our-story-content-body { margin-bottom: 32px; padding-bottom: 32px; }
	.our-story.trp-tpl .our-story-counters { margin-bottom: 0; }
	.our-story.trp-tpl .our-story-counter h3 { font-size: 44px; }
	.our-story.trp-tpl .our-story-counter p { font-size: 18px; }

	.our-services.trp-tpl { padding-top: 60px; }

	.our-faqs.trp-tpl { padding: 60px 0; }
	.our-faqs.trp-tpl .row { align-items: flex-start !important; }
	.our-faqs.trp-tpl .our-faqs-img figure img { aspect-ratio: 1 / 1.05; }

	.our-process.trp-tpl,
	.our-features.trp-tpl,
	.our-work.trp-tpl,
	.page-services.trp-tpl { padding-top: 60px; padding-bottom: 60px; }
}

/* =====================================================================
   SERVICE DETAIL - modern layout (1.9.4)
   ===================================================================== */
.trp-svc.trp-tpl section { position: relative; }

/* Introduction */
.trp-svc .trp-svc-intro { padding: 70px 0 60px; }
.trp-svc .trp-svc-kicker {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 16px;
	border-radius: 100px;
	background: rgba(255, 102, 0, 0.08);
	color: var(--accent-color);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin-bottom: 22px;
}
.trp-svc .trp-svc-kicker b { font-weight: 800; }
.trp-svc .trp-svc-lead p { font-size: 17px; line-height: 1.75; margin-bottom: 16px; }
.trp-svc .trp-svc-lead .trp-service-lead,
.trp-svc .trp-svc-lead p:first-child {
	font-family: var(--heading-font);
	font-size: clamp(26px, 2.4vw, 36px);
	font-weight: 600;
	line-height: 1.25;
	color: var(--primary-color);
	margin-bottom: 20px;
}
.trp-svc .trp-svc-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 18px 28px;
	margin-top: 30px;
}
.trp-svc .trp-svc-phone {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-weight: 600;
	font-size: 18px;
	color: var(--primary-color);
}
.trp-svc .trp-svc-phone i {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--primary-color);
	color: #fff;
	font-size: 16px;
}
.trp-svc .trp-svc-image {
	position: relative;
	padding: 0 0 22px 22px;
}
.trp-svc .trp-svc-image::before {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 60%;
	height: 70%;
	border-radius: 32px;
	background: var(--accent-color);
}
.trp-svc .trp-svc-image figure { position: relative; margin: 0; border-radius: 28px; overflow: hidden; display: block; }
.trp-svc .trp-svc-image img {
	width: 100%;
	aspect-ratio: 4 / 3.3;
	object-fit: cover;
	border-radius: 28px;
	box-shadow: 0 24px 50px rgba(23, 33, 79, 0.18);
}

/* Scope */
.trp-svc .trp-svc-scope {
	padding: 70px 0;
	background: var(--secondary-color, #f3f5fb);
}
.trp-svc .trp-svc-scope-head { max-width: 760px; margin-bottom: 40px; }
.trp-svc .trp-svc-scope-head h2 {
	font-size: clamp(30px, 2.65vw, 38px);
	font-weight: 300;
	line-height: 1.22em;
	color: var(--primary-color);
	margin: 0;
}
.trp-svc .trp-svc-scope-head h2 span { font-weight: 700; }
.trp-svc .trp-svc-scope-head p { margin-top: 16px; margin-bottom: 0; }
.trp-svc .trp-svc-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}
.trp-svc .trp-svc-grid-2,
.trp-svc .trp-svc-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.trp-svc .trp-svc-card {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 30px;
	border-radius: 28px;
	background: #fff;
	border: 1px solid rgba(23, 33, 79, 0.06);
	box-shadow: 0 10px 30px rgba(23, 33, 79, 0.05);
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.trp-svc .trp-svc-card::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 4px;
	background: var(--accent-color);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.35s ease;
}
.trp-svc .trp-svc-card:hover { transform: translateY(-4px); box-shadow: 0 22px 44px rgba(23, 33, 79, 0.12); }
.trp-svc .trp-svc-card:hover::before { transform: scaleX(1); }
.trp-svc .trp-svc-card-top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	margin-bottom: 22px;
}
.trp-svc .trp-svc-card-icon {
	width: 64px;
	height: 64px;
	border-radius: 18px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 102, 0, 0.08);
}
.trp-svc .trp-svc-card-icon img { width: 38px; height: 38px; object-fit: contain; }
.trp-svc .trp-svc-card-no {
	font-family: var(--heading-font);
	font-size: 40px;
	font-weight: 700;
	line-height: 1;
	color: transparent;
	-webkit-text-stroke: 1px rgba(23, 33, 79, 0.25);
}
.trp-svc .trp-svc-card h3 {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--primary-color);
	margin-bottom: 10px;
}
.trp-svc .trp-svc-card p { margin: 0; line-height: 1.7; }

/* Contact band */
.trp-svc .trp-svc-cta { padding: 70px 0 0; }
.trp-svc .trp-svc-cta-box {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 26px 40px;
	padding: 46px 54px;
	border-radius: 32px;
	overflow: hidden;
	background:
		radial-gradient(circle at 90% 10%, rgba(255, 102, 0, 0.28) 0, transparent 40%),
		linear-gradient(135deg, var(--trp-navy-light, #33479a) 0%, var(--primary-color) 100%);
}
.trp-svc .trp-svc-cta-box::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255, 255, 255, 0.12) 1.5px, transparent 2px);
	background-size: 18px 18px;
	mask-image: linear-gradient(to left, #000, transparent 60%);
	-webkit-mask-image: linear-gradient(to left, #000, transparent 60%);
	pointer-events: none;
}
.trp-svc .trp-svc-cta-text { position: relative; z-index: 1; max-width: 640px; }
.trp-svc .trp-svc-cta-text h2 {
	font-size: clamp(26px, 2.4vw, 36px);
	font-weight: 300;
	color: #fff;
	margin-bottom: 10px;
}
.trp-svc .trp-svc-cta-text h2 span { font-weight: 700; }
.trp-svc .trp-svc-cta-text p { color: rgba(255, 255, 255, 0.8); margin: 0; }
.trp-svc .trp-svc-cta-actions {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
}
.trp-svc .trp-svc-cta-mail { color: #fff; font-weight: 500; display: inline-flex; gap: 10px; align-items: center; }
.trp-svc .trp-svc-cta-mail i { color: var(--accent-color); }

/* Other services */
.trp-svc .trp-svc-more { padding: 70px 0; }
.trp-svc .trp-svc-more-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 34px;
}
.trp-svc .trp-svc-more-head .section-title { margin: 0; }
.trp-svc .trp-svc-more-head h2 {
	font-size: clamp(28px, 2.4vw, 36px);
	font-weight: 300;
	color: var(--primary-color);
	margin: 0;
}
.trp-svc .trp-svc-more-head h2 span { font-weight: 700; display: inline !important; }
.trp-svc .trp-svc-more-all { font-weight: 600; color: var(--accent-color); display: inline-flex; gap: 10px; align-items: center; }
.trp-svc .trp-svc-more-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
}
.trp-svc .trp-svc-more-item {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 22px 24px;
	border-radius: 22px;
	border: 1px solid rgba(23, 33, 79, 0.1);
	background: #fff;
	color: var(--primary-color);
	transition: all 0.3s ease;
}
.trp-svc .trp-svc-more-no {
	flex: 0 0 46px;
	height: 46px;
	border-radius: 14px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--secondary-color, #f3f5fb);
	font-weight: 700;
	color: var(--accent-color);
	transition: all 0.3s ease;
}
.trp-svc .trp-svc-more-title { flex: 1; font-weight: 600; line-height: 1.4; }
.trp-svc .trp-svc-more-item > i { color: var(--accent-color); transition: transform 0.3s ease; }
.trp-svc .trp-svc-more-item:hover {
	border-color: var(--accent-color);
	box-shadow: 0 16px 34px rgba(23, 33, 79, 0.1);
	transform: translateY(-3px);
}
.trp-svc .trp-svc-more-item:hover .trp-svc-more-no { background: var(--accent-color); color: #fff; }
.trp-svc .trp-svc-more-item:hover > i { transform: translateX(4px); }

@media (max-width: 991px) {
	.trp-svc .trp-svc-intro { padding: 50px 0 40px; }
	.trp-svc .trp-svc-image { margin-top: 40px; }
	.trp-svc .trp-svc-grid,
	.trp-svc .trp-svc-more-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.trp-svc .trp-svc-cta-box { padding: 36px 30px; }
	.trp-svc .trp-svc-scope,
	.trp-svc .trp-svc-more { padding: 50px 0; }
	.trp-svc .trp-svc-cta { padding-top: 50px; }
}
@media (max-width: 575px) {
	.trp-svc .trp-svc-grid,
	.trp-svc .trp-svc-grid-2,
	.trp-svc .trp-svc-grid-4,
	.trp-svc .trp-svc-more-grid { grid-template-columns: 1fr; }
	.trp-svc .trp-svc-card { padding: 24px; }
}

/* =====================================================================
   SINGLE-LINE TITLES + TIGHTER SECTIONS (1.9.5)
   Replaces the two-line title rule: the bold half stays on the same line,
   and the title takes the free width of its row. A button sits beside it;
   an intro paragraph moves underneath it.
   ===================================================================== */
@media (min-width: 992px) {
	.trp-tpl .section-title h2 span { display: inline; }

	.trp-tpl .section-row > [class*="col-lg-"]:has(> .section-title) {
		flex: 1 1 0;
		max-width: none;
		width: auto;
	}
	/* An empty right-hand column takes no room. */
	.trp-tpl .section-row > [class*="col-lg-"]:empty { display: none; }
	/* A button beside the title takes only its own width. */
	.trp-tpl .section-row > [class*="col-lg-"]:has(> .section-title) + [class*="col-lg-"]:has(.section-btn) {
		flex: 0 0 auto;
		max-width: none;
		width: auto;
	}
	/* An intro paragraph goes on its own line under the title. */
	.trp-tpl .section-row > [class*="col-lg-"]:has(> .section-title) + [class*="col-lg-"]:has(.section-title-content) {
		flex: 0 0 100%;
		max-width: 100%;
		width: 100%;
	}
	.trp-tpl .section-row .section-title-content { max-width: 760px; }
	.trp-tpl .section-row .section-title-content { margin-top: 14px; margin-left: 0; }
	.trp-tpl .section-row .section-title-content p { margin: 0; }

	/* Sections: less padding, and the row under the title sits closer. */
	.trp-tpl .section-row { margin-bottom: 36px; }
	.our-work.trp-tpl,
	.our-story.trp-tpl,
	.our-features.trp-tpl,
	.our-process.trp-tpl,
	.page-services.trp-tpl,
	.our-faqs.trp-tpl { padding-top: 50px; padding-bottom: 50px; }
	.about-us.trp-tpl { padding-top: 60px; padding-bottom: 30px; }
	.our-services.trp-tpl { padding-top: 50px; }

	/* Core capabilities cards: one gap between rows, no extra margins. */
	.our-work.trp-tpl .project-item-boxes { gap: 32px 30px; }
	.our-work.trp-tpl .project-item { margin-bottom: 0; }

	/* Tools & standards cards: no trailing margin under the last row. */
	.page-services.trp-tpl .service-item { margin-bottom: 24px; }
	.page-services.trp-tpl { padding-bottom: 26px; }
}

/* =====================================================================
   PHONES & TABLETS (1.9.8)
   Header: a slim navy contact strip, then a white bar with the logo on
   the left and the menu button on the right.
   ===================================================================== */
@media (max-width: 991px) {

	/* Contact strip */
	.topbar {
		background: var(--primary-color);
		padding: 7px 0 !important;
		border: 0;
	}
	.topbar .site-logo,
	.topbar .topbar-qoute-btn { display: none !important; }
	.topbar .topbar-contact-info { display: block; }
	.topbar .topbar-contact-info ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 4px 18px;
		margin: 0;
		padding: 0;
	}
	.topbar .topbar-contact-info ul li { margin: 0 !important; padding: 0 !important; border: 0 !important; }
	.topbar .topbar-contact-info ul li::before,
	.topbar .topbar-contact-info ul li::after { display: none !important; }
	.topbar .topbar-contact-info ul li a {
		display: inline-flex;
		align-items: center;
		gap: 7px;
	}
	.topbar .topbar-contact-info .icon-box {
		width: auto !important;
		height: auto !important;
		background: none !important;
		margin: 0 !important;
		border-radius: 0;
	}
	.topbar .topbar-contact-info .icon-box i {
		font-size: 12px;
		color: var(--accent-color);
	}
	.topbar .topbar-contact-info p {
		margin: 0;
		font-size: 13px;
		line-height: 1.4;
		font-weight: 500;
		color: #fff !important;
		white-space: nowrap;
	}

	/* Menu bar */
	.main-header,
	.main-header .header-sticky,
	.main-header .navbar {
		background: #fff !important;
	}
	.main-header { border-bottom: 1px solid rgba(23, 33, 79, 0.08); }
	.main-header .header-sticky.active { box-shadow: 0 6px 20px rgba(23, 33, 79, 0.12); }
	.main-header .navbar { padding: 8px 0 !important; }
	.main-header .navbar > .container {
		display: flex;
		align-items: center;
		justify-content: space-between;
		flex-wrap: nowrap;
	}
	.main-header .navbar-brand {
		display: inline-flex !important;
		align-items: center;
		padding: 0;
		margin: 0;
	}
	.main-header .navbar-brand img {
		display: block;
		width: auto;
		height: auto;
		max-height: 68px;
		max-width: 170px;
	}
	.main-header .navbar-toggle {
		position: static !important;
		margin: 0 0 0 auto;
	}
	.main-header .navbar-toggle a.slicknav_btn {
		background: var(--accent-color) !important;
		border-radius: 10px;
	}
	.main-header .navbar-toggle a.slicknav_btn .slicknav_icon-bar { background-color: #fff !important; }
}

/* Phones: section alignment (1.9.8) */

/* The small label's icon sits on its first line, not mid-way down a
   wrapped label. */
.trp-tpl .section-title h3::before {
	top: 0.5em;
	transform: translateY(-50%);
}

@media (max-width: 767px) {

	/* Labels and headings */
	.trp-tpl .section-title h3 {
		font-size: 12px;
		letter-spacing: 0.12em;
		line-height: 1.5;
	}
	.trp-tpl .section-row { margin-bottom: 26px; }
	.trp-tpl .section-title { margin-bottom: 0; }

	/* Hero */
	.hero.trp-tpl { padding-top: 50px; }
	.hero.trp-tpl .hero-content .section-title h1 { font-size: 30px; }
	.hero.trp-tpl .trp-hero-lead { font-size: 16px; }
	.hero.trp-tpl .hero-content-body,
	.hero.trp-tpl .hero-btn { display: flex; flex-wrap: wrap; gap: 12px; }

	/* Who we are: one photo, the experience badge as a strip under it */
	.about-us.trp-tpl .about-image {
		display: flex;
		flex-direction: column;
		gap: 16px;
		padding: 0;
		margin: 0 0 34px;
		max-width: none;
	}
	.about-us.trp-tpl .about-img-1 { display: none; }
	.about-us.trp-tpl .about-img-2 { width: 100%; }
	.about-us.trp-tpl .about-img-2 img {
		width: 100%;
		aspect-ratio: 4 / 3;
		border: 0;
		border-radius: 24px;
	}
	.about-us.trp-tpl .company-experience {
		position: static;
		max-width: none;
		gap: 14px;
		padding: 14px 18px;
		border-radius: 18px;
		background: var(--secondary-color, #f3f5fb);
	}
	.about-us.trp-tpl .company-experience-counter { width: auto; }
	.about-us.trp-tpl .company-experience-counter h2 { font-size: 38px; margin: 0; }
	.about-us.trp-tpl .company-experience-content p { font-size: 15px; }

	/* Core capabilities: one gap between cards */
	.our-work.trp-tpl .project-item-boxes { gap: 34px !important; }
	.our-work.trp-tpl .project-item { margin-bottom: 0 !important; }
	.our-work.trp-tpl .project-content { margin-top: 16px; }

	/* System failure prevention: tidy stats */
	.our-story.trp-tpl .our-story-counters { gap: 12px; }
	.our-story.trp-tpl .our-story-counter { width: calc(33.33% - 8px); }
	.our-story.trp-tpl .our-story-counter h3 { font-size: 30px; }
	.our-story.trp-tpl .our-story-counter p { font-size: 14px; }

	/* How we work: number beside the title, text under both */
	.our-process.trp-tpl .process-step-item {
		align-items: flex-start;
		padding: 20px;
		margin-bottom: 14px;
	}
	.our-process.trp-tpl .process-step-no { margin-right: 14px; }
	.our-process.trp-tpl .process-step-no h2 { font-size: 30px; line-height: 1; }
	.our-process.trp-tpl .process-step-content h3 { margin-bottom: 6px; }
	.our-process.trp-tpl .our-process-image { margin: 0 0 24px; }

	/* Tools & standards: cards only as tall as their text */
	.page-services.trp-tpl .service-item {
		height: auto;
		margin-bottom: 16px;
		padding: 24px;
	}

	/* Why TRP: badge sits on the image edge, clear of the cards */
	.what-we-do.trp-tpl .what-we-do-content { padding: 50px 20px; }
	.what-we-do.trp-tpl .what-we-do-list { gap: 14px; }

	/* FAQs */
	.our-faqs.trp-tpl .our-faqs-img { margin-bottom: 24px; }
	.our-faqs.trp-tpl .accordion-item { margin-bottom: 12px; }
}

@media (max-width: 767px) {
	.about-us.trp-tpl .about-img-2,
	.about-us.trp-tpl .about-img-2 figure {
		width: 100%;
		max-width: none;
		margin: 0;
		display: block;
	}
	.about-us.trp-tpl .about-content-body { margin-top: 22px; }

	/* Text runs the full width over the photo: an even shade keeps it legible. */
	.hero.trp-tpl::before {
		background: linear-gradient(180deg, rgba(10, 18, 48, .82) 0%, rgba(10, 18, 48, .72) 100%) !important;
	}
}

/* About page / single framed image on phones: keep the frame inside the column. */
@media (max-width: 767px) {
	.trp-page-about .about-us.trp-tpl .about-image,
	.about-us.trp-tpl .about-image.trp-about-single {
		display: block;
		position: relative;
		padding: 0 0 16px 16px;
		margin: 0 0 34px;
		left: auto;
		transform: none;
	}
	.trp-page-about .about-us.trp-tpl .about-image::before,
	.about-us.trp-tpl .about-image.trp-about-single::before {
		width: 55%;
		height: 60%;
		border-radius: 24px;
	}
	.trp-page-about .about-us.trp-tpl .about-img-2 img,
	.about-us.trp-tpl .about-image.trp-about-single img {
		aspect-ratio: 4 / 3.2;
		border-radius: 22px;
	}
}

/* =====================================================================
   HOME - INDUSTRIES as small cards, three above two (1.9.9)
   ===================================================================== */
.home .our-features.trp-tpl .our-features-boxes {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 20px;
	width: 100%;
	border: 0;
	border-radius: 0;
	overflow: visible;
}
.home .our-features.trp-tpl .our-features-item {
	grid-column: span 2;
	width: auto;
	padding: 28px 26px;
	border: 1px solid rgba(23, 33, 79, 0.1) !important;
	border-radius: 24px;
	background: #fff;
	box-shadow: 0 10px 26px rgba(23, 33, 79, 0.05);
}
/* The fourth and fifth cards sit centred under the first three. */
.home .our-features.trp-tpl .our-features-item:nth-child(4) { grid-column: 2 / span 2; }
.home .our-features.trp-tpl .our-features-item:nth-child(5) { grid-column: 4 / span 2; }
.home .our-features.trp-tpl .our-features-item.features-image-box { display: none; }
.home .our-features.trp-tpl .our-features-item .icon-box { margin-bottom: 18px; }
.home .our-features.trp-tpl .our-features-item .icon-box img { max-width: 42px; }
.home .our-features.trp-tpl .features-item-content h3 { font-size: 19px; margin-bottom: 10px; }
.home .our-features.trp-tpl .features-item-content p { font-size: 15px; line-height: 1.6; margin: 0; }

@media (max-width: 991px) {
	.home .our-features.trp-tpl .our-features-boxes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
	.home .our-features.trp-tpl .our-features-item,
	.home .our-features.trp-tpl .our-features-item:nth-child(4),
	.home .our-features.trp-tpl .our-features-item:nth-child(5) { grid-column: auto; }
	.home .our-features.trp-tpl .our-features-item:nth-child(5) { grid-column: 1 / -1; }
}
@media (max-width: 575px) {
	.home .our-features.trp-tpl .our-features-boxes { grid-template-columns: 1fr; }
	.home .our-features.trp-tpl .our-features-item { padding: 24px 22px; }
}

/* =====================================================================
   HOME - OUR CLIENTELE (2.0.3)
   ===================================================================== */
.trp-clientele.trp-tpl { padding: 60px 0 50px; background: var(--secondary-color, #f3f5fb); overflow: hidden; }
.trp-clientele__head { text-align: center; margin-bottom: 34px; }
.trp-clientele__head h2 span { display: inline !important; }
.trp-clientele__band {
	position: relative;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}
.trp-clientele__track {
	display: flex;
	align-items: center;
	gap: 26px;
	width: max-content;
	padding: 6px 0 10px;
	animation: trp-clients 36s linear infinite;
}
.trp-clientele__band:hover .trp-clientele__track { animation-play-state: paused; }
.trp-client {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 210px;
	height: 110px;
	padding: 18px 24px;
	background: #fff;
	border: 1px solid rgba(23, 33, 79, 0.08);
	border-radius: 18px;
	box-shadow: 0 8px 22px rgba(23, 33, 79, 0.05);
	transition: transform .25s ease, box-shadow .25s ease;
}
.trp-client:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(23, 33, 79, 0.12); }
.trp-client img { max-width: 100%; max-height: 70px; width: auto; height: auto; object-fit: contain; }
@keyframes trp-clients { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (max-width: 767px) {
	.trp-clientele.trp-tpl { padding: 44px 0 36px; }
	.trp-clientele__track { gap: 16px; }
	.trp-client { width: 160px; height: 88px; padding: 14px 18px; border-radius: 14px; }
	.trp-client img { max-height: 54px; }
}