/*
 * Visual language — "Intenções Visuais" (2.ª revisão, 8/10/2026).
 *
 * Contrast (dark #071521 / white / gray #E6E6E6 alternation, SEER), rounded and
 * fluid shapes, no lines between cards, compact rhythm, clear links, button and
 * card motion (OTTO / Doosan). Loaded after Porto + content.css on the front end
 * and in the editor canvas.
 *
 * Utilities used by patterns / the site generator:
 *   .porto-section-rise   light section that "rises" with rounded top corners
 *                         over the previous dark one (Doosan).
 *   .porto-section-intro  section title group (full useful width, reveal).
 */

:root {
	--porto-ease: cubic-bezier(0.215, 0.61, 0.355, 1);
	--porto-radius-section: 36px;
}

/* -------------------------------------------------------------------------
 * Typography: titles use the useful width (fewer broken lines).
 * ---------------------------------------------------------------------- */

:where(h1, h2, h3, h4, .wp-block-heading) {
	text-wrap: balance;
}

:where(p, li) {
	text-wrap: pretty;
}

/* Card and icon-box titles follow the page outline (h2/h3, no skipped levels)
 * but keep the compact card size. Specificity (0,1,0), so the contextual
 * rules below still win. */
:where(.porto-icon-box__content, .is-style-card, .is-style-card > .wp-block-group) > .wp-block-heading:where(h2, h3, h4) {
	font-size: var(--wp--preset--font-size--large);
}

.porto-section-intro {
	max-width: none;
}

.porto-section-intro .is-style-lead {
	max-width: 70ch;
}

/* -------------------------------------------------------------------------
 * Links: always visible (never discreet gray).
 * ---------------------------------------------------------------------- */

:where(main, .entry-content) :where(p, li, td, dd, figcaption) a:where(:not(.wp-element-button, .wp-block-button__link, .porto-menu a)) {
	color: var(--wp--preset--color--secondary-dark);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-color: color-mix(in srgb, currentColor 35%, transparent);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.22em;
	transition: color 0.2s ease, text-decoration-color 0.2s ease, text-decoration-thickness 0.2s ease;
}

:where(main, .entry-content) :where(p, li, td, dd, figcaption) a:where(:not(.wp-element-button, .wp-block-button__link, .porto-menu a)):hover {
	color: var(--wp--preset--color--primary);
	text-decoration-color: var(--wp--preset--color--accent);
	text-decoration-thickness: 2px;
}

:where(main) :is(.is-style-section-dark, .is-style-section-primary, .wp-block-cover:not(.is-light)) :where(p, li) a:where(:not(.wp-element-button, .wp-block-button__link)) {
	color: var(--wp--preset--color--secondary);
}

:where(main) :is(.is-style-section-dark, .is-style-section-primary, .wp-block-cover:not(.is-light)) :where(p, li) a:where(:not(.wp-element-button, .wp-block-button__link)):hover {
	color: var(--wp--preset--color--base);
}

/* -------------------------------------------------------------------------
 * Buttons: rounded; arrow motion on hover (OTTO): the right arrow leaves,
 * the label slides and a new arrow enters from the left.
 * ---------------------------------------------------------------------- */

.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--wp--custom--radius--small);
	transition: background-color 0.25s var(--porto-ease), color 0.25s var(--porto-ease), border-color 0.25s var(--porto-ease), box-shadow 0.25s var(--porto-ease), transform 0.25s var(--porto-ease);
}

/* Conversion CTA (yellow; orange in EMR areas) — also for markup rendered outside blocks. */
.wp-block-button.is-style-cta > .wp-block-button__link {
	background-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--contrast);
	font-weight: 700;
}

.porto-brand-emr .wp-block-button.is-style-cta > .wp-block-button__link {
	color: var(--wp--preset--color--base);
}

.wp-block-button:is(.is-style-cta, .is-style-porto-arrow, .is-style-outline, .is-style-fill, :not([class*="is-style-"])) > .wp-block-button__link::before,
.wp-block-button:is(.is-style-cta, .is-style-porto-arrow, .is-style-outline, .is-style-fill, :not([class*="is-style-"])) > .wp-block-button__link::after {
	content: "\2192";
	display: inline-block;
	overflow: hidden;
	flex: 0 0 auto;
	transition: width 0.3s var(--porto-ease), margin 0.3s var(--porto-ease), opacity 0.3s var(--porto-ease), transform 0.3s var(--porto-ease);
}

.wp-block-button:is(.is-style-cta, .is-style-porto-arrow, .is-style-outline, .is-style-fill, :not([class*="is-style-"])) > .wp-block-button__link::before {
	width: 0;
	margin-inline-end: 0;
	opacity: 0;
	transform: translateX(-0.75em);
}

.wp-block-button:is(.is-style-cta, .is-style-porto-arrow, .is-style-outline, .is-style-fill, :not([class*="is-style-"])) > .wp-block-button__link::after {
	width: 1em;
	margin-inline-start: 0.6em;
	opacity: 1;
	transform: none;
}

@media (hover: hover) and (pointer: fine) {
	.wp-block-button:is(.is-style-cta, .is-style-porto-arrow, .is-style-outline, .is-style-fill, :not([class*="is-style-"])) > .wp-block-button__link:hover::before {
		width: 1em;
		margin-inline-end: 0.6em;
		opacity: 1;
		transform: none;
	}

	.wp-block-button:is(.is-style-cta, .is-style-porto-arrow, .is-style-outline, .is-style-fill, :not([class*="is-style-"])) > .wp-block-button__link:hover::after {
		width: 0;
		margin-inline-start: 0;
		opacity: 0;
		transform: translateX(0.75em);
	}

	.wp-block-button.is-style-cta > .wp-block-button__link:hover {
		box-shadow: 0 10px 24px -10px color-mix(in srgb, var(--wp--preset--color--accent) 80%, transparent);
	}
}

.wp-block-button__link:active {
	transform: translateY(1px);
}

.wp-block-button__link:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

/* No arrow in compact places (header CTA, menu drawer, icon-only). */
.porto-header .wp-block-button__link::before,
.porto-header .wp-block-button__link::after {
	content: none !important;
}

/* Compact header CTA + language switcher so the menu has room to breathe. */
.porto-header .wp-block-button.is-style-cta > .wp-block-button__link {
	font-size: 0.75rem !important;
	letter-spacing: 0.02em;
	line-height: 1.2;
}

.porto-header .porto-lang {
	font-size: 0.6875rem;
}

.porto-header .porto-lang__item {
	padding: 0.15rem 0.35rem;
}

/* -------------------------------------------------------------------------
 * Sections: alternation dark / white / gray; rounded "rise" over dark blocks.
 * ---------------------------------------------------------------------- */

.porto-section-rise {
	position: relative;
	z-index: 1;
	margin-top: calc(-1 * var(--porto-radius-section)) !important;
	border-radius: var(--porto-radius-section) var(--porto-radius-section) 0 0;
}

.porto-section-rise:not([class*="is-style-section-"]) {
	background: var(--wp--preset--color--base);
}

/* The section under a rise keeps its content clear of the overlap. */
.wp-block-group.alignfull:has(+ .porto-section-rise),
.wp-block-cover.alignfull:has(+ .porto-section-rise) {
	padding-bottom: calc(var(--wp--preset--spacing--60) + var(--porto-radius-section)) !important;
}

/* Cards on dark backgrounds: slightly lighter fill, subtle border, no shadow. */
.is-style-section-dark :is(.is-style-card, .wp-block-group.is-style-card) {
	border: 1px solid rgba(255, 255, 255, 0.08);
	background: #0c2233;
	box-shadow: none;
	color: color-mix(in srgb, var(--wp--preset--color--base) 78%, transparent);
}

.is-style-section-dark .is-style-card :is(h2, h3, h4, h5) {
	color: var(--wp--preset--color--base);
}

/* Cards on the gray section: white, no shadow (separated by background). */
.is-style-section-light .is-style-card {
	box-shadow: none;
}

/* No lines between cards / boxes. */
.is-style-card,
.porto-card,
.wp-block-porto-icon-box {
	border: 0;
}

/* -------------------------------------------------------------------------
 * Navigation cards (Produto/Serviço): whole card clickable, image inset with
 * rounded corners, title / text / button aligned, Doosan-like hover.
 * ---------------------------------------------------------------------- */

.porto-card {
	position: relative;
	box-shadow: none;
	transition: background-color 0.35s var(--porto-ease), color 0.35s var(--porto-ease), transform 0.35s var(--porto-ease), box-shadow 0.35s var(--porto-ease);
}

.is-style-section-light .porto-card,
.porto-related-section.is-style-section-light .porto-card {
	background: var(--wp--preset--color--base);
}

.porto-related:not(.is-style-section-light *) .porto-card {
	background: #f3f4f5;
}

.porto-card__media {
	margin: 0.75rem 0.75rem 0;
	border-radius: calc(var(--wp--custom--radius--medium) - 4px);
}

.porto-card__media img,
.porto-card__img {
	border-radius: inherit;
}

.porto-card__title {
	display: -webkit-box;
	overflow: hidden;
	min-height: calc(2 * 1.35em);
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.porto-card__text {
	display: -webkit-box;
	overflow: hidden;
	min-height: calc(3 * 1.6em);
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-height: 1.6;
}

/* Label (EMR) and brand logo sit over the image, so titles stay aligned. */
.porto-card:has(.porto-card__media) .porto-card__top {
	position: absolute;
	top: 1.5rem;
	right: 1.5rem;
	left: 1.5rem;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	pointer-events: none;
}

.porto-card:has(.porto-card__media) .porto-card__label {
	padding: 0.3rem 0.65rem;
	border-radius: 999px;
	background: var(--wp--preset--color--base);
	box-shadow: 0 4px 12px rgba(7, 21, 33, 0.12);
}

.porto-card:has(.porto-card__media) .porto-card__brand {
	max-height: 32px;
	width: auto;
	padding: 0.3rem 0.5rem;
	border-radius: 8px;
	background: var(--wp--preset--color--base);
}

/* Stretched link: the whole card is clickable. */
.porto-card__title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	border-radius: inherit;
}

.porto-card__title a:focus-visible {
	outline: none;
}

.porto-card:has(.porto-card__title a:focus-visible) {
	outline: 3px solid var(--wp--preset--color--secondary);
	outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
	.porto-card--solucao:hover {
		background: var(--wp--preset--color--primary) !important;
		box-shadow: 0 24px 48px -24px rgba(7, 21, 33, 0.55);
		color: color-mix(in srgb, var(--wp--preset--color--base) 82%, transparent);
		transform: translateY(-4px);
	}

	.porto-card--solucao.porto-brand-emr:hover {
		background: var(--wp--preset--color--contrast) !important;
	}

	.porto-card--solucao:hover .porto-card__title a,
	.porto-card--solucao:hover .porto-card__text {
		color: var(--wp--preset--color--base);
	}

	.porto-card--solucao:hover .porto-card__label {
		color: var(--wp--preset--color--accent);
	}

	.porto-card--solucao:hover .wp-block-button__link {
		border-color: var(--wp--preset--color--accent) !important;
		background: var(--wp--preset--color--accent) !important;
		color: var(--wp--preset--color--contrast) !important;
	}

	.porto-card--solucao.porto-brand-emr:hover .wp-block-button__link {
		border-color: var(--wp--preset--color--accent-emr) !important;
		background: var(--wp--preset--color--accent-emr) !important;
		color: var(--wp--preset--color--base) !important;
	}

	/* Button arrow motion follows the card hover. */
	.porto-card:hover .wp-block-button__link::before {
		width: 1em;
		margin-inline-end: 0.6em;
		opacity: 1;
		transform: none;
	}

	.porto-card:hover .wp-block-button__link::after {
		width: 0;
		margin-inline-start: 0;
		opacity: 0;
		transform: translateX(0.75em);
	}

	.porto-card:not(.porto-card--solucao):hover {
		box-shadow: 0 24px 48px -28px rgba(7, 21, 33, 0.35);
	}
}

/* Mobile: cards as a compact vertical list (thumbnail + text, whole row clickable). */
@media (max-width: 599.98px) {
	.porto-related__items--cards {
		gap: 0.75rem;
	}

	.porto-card {
		display: grid;
		grid-template-columns: 96px 1fr;
		align-items: center;
	}

	.porto-card__media {
		width: 84px;
		height: 84px;
		margin: 0.75rem;
		aspect-ratio: 1;
	}

	.porto-card__body {
		padding: 0.85rem 1rem 0.85rem 0;
		gap: 0.25rem;
	}

	.porto-card:not(:has(.porto-card__media)) {
		grid-template-columns: 1fr;
	}

	.porto-card:not(:has(.porto-card__media)) .porto-card__body {
		padding-left: 1rem;
	}

	.porto-card__title {
		min-height: 0;
		font-size: var(--wp--preset--font-size--medium);
	}

	.porto-card__text {
		min-height: 0;
		font-size: var(--wp--preset--font-size--small);
		-webkit-line-clamp: 2;
	}

	.porto-card__actions {
		display: none;
	}
}

/* -------------------------------------------------------------------------
 * "O que oferecemos": icons on desktop, bullets on mobile.
 * ---------------------------------------------------------------------- */

@media (max-width: 781.98px) {
	.porto-offer {
		gap: 0.85rem !important;
	}

	.porto-offer .porto-icon-box__icon {
		display: none !important;
	}

	.porto-offer .wp-block-porto-icon-box {
		display: block;
		padding-left: 1.1rem;
		position: relative;
	}

	.porto-offer .wp-block-porto-icon-box::before {
		content: "";
		position: absolute;
		top: 0.55em;
		left: 0;
		width: 0.45rem;
		height: 0.45rem;
		border-radius: 50%;
		background: var(--wp--preset--color--accent);
	}

	.porto-brand-emr .porto-offer .wp-block-porto-icon-box::before,
	.porto-offer.porto-brand-emr .wp-block-porto-icon-box::before {
		background: var(--wp--preset--color--accent-emr);
	}

	.porto-offer .porto-icon-box__content > * {
		margin-block: 0 !important;
	}

	.porto-offer .porto-icon-box__content p {
		font-size: var(--wp--preset--font-size--small);
	}
}

/* -------------------------------------------------------------------------
 * Accordions (FAQ / details): full width, rounded, no outlines.
 * ---------------------------------------------------------------------- */

.wp-block-details {
	border: 0;
	border-radius: 12px;
	background: #f3f4f5;
	transition: background-color 0.25s ease;
}

.is-style-section-light .wp-block-details {
	background: var(--wp--preset--color--base);
}

.wp-block-details summary {
	padding-block: 1.1rem;
	color: var(--wp--preset--color--primary);
}

.wp-block-details:hover summary {
	color: var(--wp--preset--color--secondary-dark);
}

.wp-block-details[open] {
	background: var(--wp--preset--color--base);
	box-shadow: inset 3px 0 0 var(--wp--preset--color--accent), 0 12px 32px -20px rgba(7, 21, 33, 0.3);
}

.porto-brand-emr .wp-block-details[open] {
	box-shadow: inset 3px 0 0 var(--wp--preset--color--accent-emr), 0 12px 32px -20px rgba(7, 21, 33, 0.3);
}

.wp-block-details + .wp-block-details {
	margin-top: 0.5rem;
}

/* -------------------------------------------------------------------------
 * Images: rounded everywhere (content images, galleries, covers inside sections).
 * ---------------------------------------------------------------------- */

:where(main) :where(.wp-block-image:not(.porto-logo), .wp-block-gallery .wp-block-image) img,
:where(main) .wp-block-video video {
	border-radius: var(--wp--custom--radius--medium);
}

.wp-block-cover:not(.alignfull) {
	overflow: hidden;
	border-radius: var(--wp--custom--radius--large);
}

/* Full-width sliders sit flush against the next section: drop the
 * theme's 20px .owl-carousel margin. */
.wp-block-porto-carousel.alignfull > .owl-carousel {
	margin-bottom: 0;
}

/* Home slider titles are paragraphs (.porto-hero-title), not headings, so the
 * page keeps a single H1 and the section H2s are not duplicated; they take
 * the heading typography here. */
.porto-hero-title {
	font-family: var(--wp--preset--font-family--satoshi);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.05em;
}

/* Home slider: titles stay on one line; the size scales down with the
 * viewport so the longest one still fits. */
.owl-carousel .wp-block-cover :is(h1, h2, .porto-hero-title).has-huge-font-size {
	width: max-content;
	max-width: none;
	white-space: nowrap;
	font-size: min(var(--wp--preset--font-size--huge), 6vw) !important;
}

/* -------------------------------------------------------------------------
 * Page heroes: a different identity per navigation level.
 * ---------------------------------------------------------------------- */

/* Agregadora: dark, offer points inside the hero (no separate section). */
.porto-hero--agregadora .porto-hero-points {
	margin-top: var(--wp--preset--spacing--40) !important;
	padding-top: var(--wp--preset--spacing--30);
	border-top: 1px solid rgba(255, 255, 255, 0.14);
	gap: var(--wp--preset--spacing--30) !important;
}

.porto-hero-points :is(h2, h3, h4, .wp-block-heading) {
	margin: 0;
	color: var(--wp--preset--color--base) !important;
	font-size: var(--wp--preset--font-size--medium);
}

.porto-hero-points p {
	margin: 0.15rem 0 0;
	color: color-mix(in srgb, var(--wp--preset--color--base) 72%, transparent);
	font-size: var(--wp--preset--font-size--small);
}

.porto-hero-points .porto-icon-box__icon {
	color: var(--wp--preset--color--accent);
}

.porto-brand-emr .porto-hero-points .porto-icon-box__icon,
.porto-hero-points.porto-brand-emr .porto-icon-box__icon {
	color: var(--wp--preset--color--accent-emr);
}

/* Categoria: light gray hero; brand logos top right, small (no taller banner). */
.porto-hero--categoria .is-style-eyebrow {
	color: var(--wp--preset--color--secondary-dark);
}

.porto-hero-brands .porto-related__header {
	display: none;
}

.porto-hero-brands .porto-related__items--marca {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.75rem;
}

.porto-hero-brands .porto-brand__logo {
	border-radius: 12px;
}

/* Explicativa: institutional blue, image beside the text. */
.porto-hero--explicativa .wp-block-image img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--large);
}

@media (max-width: 781.98px) {
	.porto-hero--categoria .porto-hero-brands {
		display: none;
	}

	.porto-hero--explicativa .wp-block-image {
		display: none;
	}

	.porto-hero--agregadora .porto-hero-points .wp-block-porto-icon-box:nth-child(n + 3) {
		display: none;
	}
}

/* -------------------------------------------------------------------------
 * Intermediate CTA: compact banner (not a large section).
 * ---------------------------------------------------------------------- */

.porto-cta-banner {
	gap: var(--wp--preset--spacing--30) !important;
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	border-radius: var(--wp--custom--radius--large);
	background: var(--wp--preset--color--primary);
	color: color-mix(in srgb, var(--wp--preset--color--base) 80%, transparent);
	background-image: radial-gradient(circle at 100% 0, rgba(0, 174, 239, 0.25), transparent 45%);
}

.porto-cta-banner :is(h2, h3, h4) {
	margin: 0;
	color: var(--wp--preset--color--base);
}

.porto-cta-banner p {
	margin: 0;
}

.porto-brand-emr .porto-cta-banner {
	background-color: var(--wp--preset--color--contrast);
	background-image: radial-gradient(circle at 100% 0, rgba(233, 78, 27, 0.28), transparent 45%);
}

/* -------------------------------------------------------------------------
 * Homepage
 * ---------------------------------------------------------------------- */

/* Counters strip (Porto ".counters"): icon beside the number, label + short description below, no tiles. */
.porto-home-counters .wp-block-porto-counter .counter {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	column-gap: 1rem;
}

.porto-home-counters .counter .porto-font-icon {
	display: inline-block;
	margin: 0;
	font-size: clamp(2rem, 3.5vw, 2.75rem) !important;
	line-height: 1;
	color: var(--wp--preset--color--secondary);
}

.porto-home-counters .counter strong {
	font-family: var(--wp--preset--font-family--satoshi);
	font-size: clamp(3rem, 6vw, 4.5rem);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.04em;
	color: var(--wp--preset--color--primary);
}

.porto-home-counters .counter label {
	flex-basis: 100%;
	margin-top: 0.75rem;
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 700;
	line-height: 1.3;
	color: var(--wp--preset--color--primary);
}

.porto-home-counters .porto-counter__description {
	flex-basis: 100%;
	max-width: 22rem;
	margin: 0.35rem auto 0;
	opacity: 1;
	color: color-mix(in srgb, var(--wp--preset--color--contrast) 70%, transparent);
}

/* Phones: smaller number and icon, tighter spacing. */
@media (max-width: 599.98px) {
	.porto-home-counters .wp-block-porto-counter .counter {
		column-gap: 0.75rem;
	}

	.porto-home-counters .counter .porto-font-icon {
		font-size: 1.75rem !important;
	}

	.porto-home-counters .counter strong {
		font-size: 2.75rem;
	}

	.porto-home-counters .counter label {
		margin-top: 0.5rem;
	}

	.porto-home-counters .porto-counter__description {
		margin-top: 0.15rem;
		font-size: 0.875rem;
		line-height: 1.4;
	}
}

/* About (white section): cards on a subtle fill, no shadow; soft icon tint instead of a solid circle. */
.porto-home-about__cards .is-style-card {
	height: 100%;
	background: #f5f6f7;
	box-shadow: none;
}

.porto-home-about__cards .wp-block-porto-icon-box.is-icon-circle .porto-icon-box__icon {
	background: color-mix(in srgb, var(--wp--preset--color--secondary) 12%, transparent);
	color: var(--wp--preset--color--secondary);
}

.porto-home-about__cards .porto-icon-box__content p {
	margin-top: 0.35rem;
	font-size: var(--wp--preset--font-size--small);
}

/* About "Distribuidor…": title + lead across the top, then the photo fills the column height next to the body text; facts in two columns to shorten it. */
.porto-home-about__head > * {
	max-width: 46rem;
}

.porto-home-about > .wp-block-columns > .wp-block-column:has(> .wp-block-image) {
	display: flex;
	align-self: stretch;
}

.porto-home-about > .wp-block-columns > .wp-block-column > .wp-block-image {
	position: relative;
	flex: 1;
	min-height: 24rem;
	margin: 0;
}

.porto-home-about > .wp-block-columns > .wp-block-column > .wp-block-image img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 80% center;
}

.porto-home-about .is-style-porto-check {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: var(--wp--preset--spacing--40);
}

.porto-home-about .is-style-porto-check li:last-child:nth-child(odd) {
	grid-column: 1 / -1;
}

@media (max-width: 781px) {
	.porto-home-about > .wp-block-columns > .wp-block-column > .wp-block-image {
		min-height: 0;
		aspect-ratio: 16 / 10;
	}
}

@media (max-width: 480px) {
	.porto-home-about .is-style-porto-check {
		grid-template-columns: 1fr;
	}
}

.porto-highlights :is(h2, h3, h4) {
	margin: 0;
	font-size: var(--wp--preset--font-size--medium);
}

.porto-highlights p {
	margin: 0.15rem 0 0;
	font-size: var(--wp--preset--font-size--small);
}

/* Stat callouts: the title is a paragraph (not a section heading) styled as one. */
.porto-icon-box__title,
.porto-highlights p.porto-icon-box__title {
	margin: 0;
	font-family: var(--wp--preset--font-family--satoshi);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.05em;
	color: var(--wp--preset--color--primary);
}

/* "Mais de 20 marcas": big number + title. */
.porto-brands-intro {
	gap: var(--wp--preset--spacing--40) !important;
}

.porto-brands-count {
	flex: none;
	margin: 0;
}

.porto-big-number {
	display: block;
	color: var(--wp--preset--color--accent);
	font-size: clamp(3.5rem, 9vw, 6.5rem);
	font-weight: 800;
	letter-spacing: -0.04em;
	line-height: 0.9;
}

@media (max-width: 599.98px) {
	.porto-brands-intro {
		flex-wrap: wrap !important;
		gap: 0.5rem !important;
	}
}

/* -------------------------------------------------------------------------
 * Conversion band (Fortest): dark section, form always present.
 * ---------------------------------------------------------------------- */

.porto-form-band.is-style-section-dark .wp-block-group.is-style-card {
	border: 0;
	background: var(--wp--preset--color--base);
	box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.6);
	color: var(--wp--preset--color--body);
}

.porto-form-band .is-style-porto-check li::before {
	color: var(--wp--preset--color--accent);
}

.porto-brand-emr .porto-form-band .is-style-porto-check li::before {
	color: var(--wp--preset--color--accent-emr);
}

/* -------------------------------------------------------------------------
 * Mobile: shorter pages (tighter rhythm, compact boxes).
 * ---------------------------------------------------------------------- */

@media (max-width: 599.98px) {
	:root {
		--wp--preset--spacing--40: 1.25rem;
		--wp--preset--spacing--50: 1.75rem;
		--wp--preset--spacing--60: 2.25rem;
		--porto-radius-section: 24px;
	}

	.is-style-card {
		padding: 1.1rem 1.25rem !important;
	}

	.is-style-card :is(h3, h4) {
		font-size: var(--wp--preset--font-size--medium);
	}

	.porto-cta-banner {
		padding: 1.25rem;
	}

	/* Label back in the flow next to the small thumbnail. */
	.porto-card:has(.porto-card__media) .porto-card__top {
		position: static;
		padding: 0;
	}

	.porto-card:has(.porto-card__media) .porto-card__label {
		padding: 0;
		background: none;
		box-shadow: none;
	}

	.porto-card__brand {
		display: none;
	}
}

@media (max-width: 599.98px) {
	/* Footer: two columns, brand and certifications full width. */
	:is(.porto-footer-grid, footer.is-style-section-dark > .wp-block-group.is-layout-grid:first-child) {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 1.75rem 1.25rem !important;
	}

	:is(.porto-footer-grid, footer.is-style-section-dark > .wp-block-group.is-layout-grid:first-child) > :is(:first-child, :last-child) {
		grid-column: 1 / -1;
	}

	footer.is-style-section-dark {
		padding-top: 2.5rem !important;
	}

	footer .porto-footer-support {
		padding-block: 1.25rem !important;
	}

	/* "Em que consiste": text only on small screens. */
	.porto-about .wp-block-image {
		display: none;
	}
}

.porto-card__title a,
.porto-card__title a:hover {
	text-decoration: none !important;
}

/* Titles that are not headings follow the heading style (Satoshi Bold, tight tracking). */
.porto-option__title,
.porto-media-tabs__title,
.porto-menu__heading,
.porto-big-number {
	font-weight: 700;
	letter-spacing: -0.05em;
}

/* Footer newsletter banner: a tinted band between the columns and the funding logos. */
footer .porto-footer-newsletter {
	padding: var(--wp--preset--spacing--50);
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--base) 12%, transparent);
	border-radius: 1rem;
	background:
		radial-gradient(80% 140% at 0% 0%, color-mix(in srgb, var(--wp--preset--color--primary) 55%, transparent), transparent 70%),
		color-mix(in srgb, var(--wp--preset--color--base) 4%, transparent);
}

footer .porto-footer-newsletter h2 {
	margin: 0;
	font-weight: 300;
	letter-spacing: -0.03em;
}

footer .porto-footer-newsletter .is-style-eyebrow {
	letter-spacing: 0.32em;
	color: var(--wp--preset--color--secondary);
}

footer .porto-footer-newsletter .porto-newsletter {
	width: min(100%, 26rem);
}

@media (max-width: 599.98px) {
	footer .porto-footer-newsletter {
		padding: 1.5rem 1.25rem;
	}
}

/* -------------------------------------------------------------------------
 * Newsletter (native form while Zoho is not configured): email + button on
 * one line, consent below. Works on dark (footer) and light backgrounds.
 * ---------------------------------------------------------------------- */

.porto-newsletter {
	display: grid;
	gap: 0.6rem;
	max-width: 26rem;
}

.porto-newsletter__row {
	display: flex;
	overflow: hidden;
	border-radius: 999px;
	background: var(--wp--preset--color--base);
}

.porto-newsletter__row input[type="email"] {
	flex: 1;
	min-width: 0;
	padding: 0.7rem 1rem;
	border: 0;
	background: transparent;
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--small);
}

.porto-newsletter__row input[type="email"]:focus-visible {
	outline: 2px solid var(--wp--preset--color--secondary);
	outline-offset: -2px;
}

.porto-newsletter__row button {
	padding: 0.7rem 1.1rem;
	border: 0;
	border-radius: 999px;
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	text-transform: uppercase;
	cursor: pointer;
}

.porto-newsletter__consent,
.porto-newsletter__message {
	margin: 0;
	font-size: var(--wp--preset--font-size--x-small);
	line-height: 1.5;
}

.porto-newsletter__consent a {
	color: inherit;
	text-decoration: underline;
}

.porto-newsletter__message.is-success {
	color: var(--wp--preset--color--secondary);
}

.porto-newsletter__message.is-error {
	color: var(--wp--preset--color--accent-emr);
}

.porto-newsletter__hp {
	position: absolute;
	left: -9999px;
}

/* -------------------------------------------------------------------------
 * Home (2026-10-29): Porquê a Europneumaq, Destaque EMR, Áreas de atuação
 * (one section per area, sub-areas stacked as rows), Marcas, Clientes and
 * the CTA banner. Scroll motion: assets/js/home-motion.js (GSAP).
 * ---------------------------------------------------------------------- */

/* Word mask for the rising titles. */
.porto-motion-word {
	display: inline-block;
	overflow: hidden;
	padding-bottom: 0.1em;
	margin-bottom: -0.1em;
	vertical-align: top;
}

.porto-motion-char {
	display: inline-block;
}

/* Reading progress bar (created by home-motion.js). */
.porto-motion-progress {
	position: fixed;
	inset: 0 0 auto;
	z-index: 10000;
	height: 3px;
	background: var(--wp--preset--color--secondary);
	transform-origin: 0 50%;
	pointer-events: none;
}

/* GSAP pins wrap the section in .pin-spacer; keep a full-width section full width
 * (the constrained layout would cap the wrapper at the content width). */
.is-layout-constrained > .pin-spacer:has(> .alignfull) {
	max-width: none !important;
	margin-right: calc(var(--wp--style--root--padding-right) * -1) !important;
	margin-left: calc(var(--wp--style--root--padding-left) * -1) !important;
}

.is-layout-constrained > .pin-spacer:has(> .alignfull) + .alignfull {
	margin-block-start: 0 !important;
}

.is-layout-constrained > .pin-spacer > .alignfull {
	width: 100% !important;
	max-width: none !important;
	margin-inline: 0 !important;
}

/* Áreas de atuação: giant outlined area name sliding behind the media band (home-motion.js). */
.porto-home-area {
	overflow-x: clip;
}

.porto-home-area__marquee {
	max-width: none !important;
	margin-inline: calc(50% - 50vw) !important;
	margin-bottom: calc(-1 * clamp(2.5rem, 6vw, 6rem)) !important;
	overflow: hidden;
	font-family: var(--wp--preset--font-family--satoshi);
	font-size: clamp(5rem, 13vw, 13rem);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.04em;
	white-space: nowrap;
	color: transparent;
	-webkit-text-stroke: 1.5px color-mix(in srgb, var(--wp--preset--color--primary) 22%, transparent);
	pointer-events: none;
	user-select: none;
}

.porto-home-area__marquee > span {
	display: inline-block;
	padding-inline-start: 4vw;
}

.porto-home-area__marquee + .porto-home-area__media {
	position: relative;
	z-index: 1;
}

/* Porquê a Europneumaq: large left-aligned numbers in a 2×2 grid, no tiles or icons;
 * each number rises in (home-motion.js) and counts up (Porto counter). */
.porto-home-usp__items {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: var(--wp--preset--spacing--60) var(--wp--preset--spacing--50) !important;
}

.porto-home-usp .wp-block-columns {
	row-gap: var(--wp--preset--spacing--60) !important;
}

.porto-home-usp .wp-block-porto-counter .counter {
	display: block;
	text-align: left;
}

.porto-home-usp .counter strong {
	display: block;
	font-family: var(--wp--preset--font-family--satoshi);
	font-size: clamp(3.5rem, 7vw, 6.5rem);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.05em;
	color: var(--wp--preset--color--primary);
}

.porto-home-usp .counter label {
	display: block;
	margin: var(--wp--preset--spacing--20) 0 0;
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 700;
	line-height: 1.3;
	text-transform: none;
	color: var(--wp--preset--color--primary);
}

.porto-home-usp .porto-counter__description {
	max-width: 20rem;
	margin: 0.35rem 0 0;
	text-align: left;
	color: color-mix(in srgb, var(--wp--preset--color--contrast) 65%, transparent);
}

@media (max-width: 599.98px) {
	.porto-home-usp__items {
		gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30) !important;
	}

	.porto-home-usp .counter strong {
		font-size: 3rem;
	}

	.porto-home-usp .counter label {
		font-size: var(--wp--preset--font-size--small);
	}

	.porto-home-usp .porto-counter__description {
		font-size: 0.875rem;
	}
}

/* Destaque EMR: tall rounded photo (clip-path wipe in JS), points in two columns. */
.porto-home-emr__media {
	overflow: hidden;
	border-radius: var(--wp--custom--radius--large);
}

.porto-home-emr__media .wp-block-image {
	margin: 0;
}

.porto-home-emr__media img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
}

.porto-home-emr__points {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.65rem var(--wp--preset--spacing--40);
}

.porto-home-emr__points li {
	margin: 0;
}

@media (max-width: 599.98px) {
	.porto-home-emr__points {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 781.98px) {
	.porto-home-emr__media img {
		aspect-ratio: 16 / 10;
	}
}

/* Áreas de atuação: title left, lead + link right; wide media band; rows stacked. */
.porto-home-area__head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--60);
}

.porto-home-area__head > * {
	margin: 0 !important;
}

.porto-home-area__head > .porto-motion-title {
	flex: 1 1 22rem;
}

.porto-home-area__intro {
	flex: 0 1 30rem;
}

.porto-home-area__media {
	overflow: hidden;
	aspect-ratio: 21 / 9;
	margin-block: 0;
	border-radius: var(--wp--custom--radius--large);
}

.porto-home-area__media :is(img, video) {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (max-width: 781.98px) {
	.porto-home-area__media {
		aspect-ratio: 16 / 10;
	}
}

.porto-home-area__list {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--20);
}

.porto-home-area__list > * {
	margin: 0 !important;
}

/* Row: number · title + text · sub-area links · arrow. The whole row is the link
 * (stretched title link); the sub-area links sit above it. */
.porto-home-area__row {
	position: relative;
	display: grid;
	grid-template-columns: 4.5rem minmax(0, 1.1fr) minmax(0, 1fr) 3.25rem;
	align-items: center;
	gap: var(--wp--preset--spacing--40);
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
	border-radius: var(--wp--custom--radius--medium);
	background: var(--wp--preset--color--base);
	transition: background-color 0.4s, color 0.4s;
}

.porto-home-area:not(.is-style-section-light) .porto-home-area__row {
	background: color-mix(in srgb, var(--wp--preset--color--light) 45%, var(--wp--preset--color--base));
}

.porto-home-area__row > * {
	margin: 0 !important;
}

.porto-home-area__num {
	font-family: var(--wp--preset--font-family--satoshi);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--secondary);
}

.porto-home-area__body h3 {
	margin: 0;
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--primary);
	transition: color 0.4s;
}

.porto-home-area__row:is(:hover, :focus-within) h3 {
	color: var(--wp--preset--color--base);
}

.porto-home-area__row:is(:hover, :focus-within) .porto-home-area__num {
	color: var(--wp--preset--color--base);
}

.porto-home-area__body h3 a,
.porto-home-area__body h3 a:hover {
	color: inherit;
	text-decoration: none;
}

.porto-home-area__body h3 a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	border-radius: inherit;
}

/* Explicit colours per state (a currentColor mix doesn't follow the hover and
 * resolves differently across browsers). */
.porto-home-area__body p {
	margin: 0.35rem 0 0;
	color: #4a5a68;
	transition: color 0.4s;
}

.porto-home-area__row:is(:hover, :focus-within) .porto-home-area__body p {
	color: rgba(255, 255, 255, 0.88);
}

.porto-home-area__links {
	position: relative;
	z-index: 2;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	padding: 0;
	list-style: none;
}

.porto-home-area__links li {
	margin: 0;
}

.porto-home-area__links a {
	display: inline-flex;
	padding: 0.4rem 0.95rem;
	border-radius: 999px;
	background: color-mix(in srgb, var(--wp--preset--color--primary) 8%, transparent);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--primary);
	text-decoration: none;
	transition: background-color 0.3s, color 0.3s;
}

.porto-home-area__links a:hover,
.porto-home-area__links a:focus-visible {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	text-decoration: none;
}

.porto-home-area__row::after {
	content: "\f061";
	display: grid;
	place-items: center;
	grid-column: 4;
	grid-row: 1;
	justify-self: end;
	width: 3.25rem;
	height: 3.25rem;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	color: var(--wp--preset--color--base);
	transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), background-color 0.4s;
}

.porto-home-area__row:is(:hover, :focus-within) {
	background: var(--wp--preset--color--primary) !important;
	color: var(--wp--preset--color--base);
}

.porto-home-area__row:is(:hover, :focus-within)::after {
	background: var(--wp--preset--color--secondary);
	transform: translateX(4px) rotate(-45deg);
}

.porto-home-area__row:is(:hover, :focus-within) .porto-home-area__links a {
	background: rgba(255, 255, 255, 0.14);
	color: var(--wp--preset--color--base);
}

.porto-home-area__row:is(:hover, :focus-within) .porto-home-area__links a:is(:hover, :focus-visible) {
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--primary);
}

@media (max-width: 991.98px) {
	.porto-home-area__row {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: var(--wp--preset--spacing--30);
		padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
	}

	.porto-home-area__num {
		grid-column: 1;
		grid-row: 1;
		font-size: var(--wp--preset--font-size--large);
	}

	.porto-home-area__body,
	.porto-home-area__links {
		grid-column: 1 / -1;
	}

	.porto-home-area__row::after {
		grid-column: 2;
		width: 2.5rem;
		height: 2.5rem;
	}
}

/* Dark closing run — Clientes, Marcas, CTA and the footer share one background (contrast, as the
 * footer), one type treatment (spaced light-blue eyebrow, light headline) and one white outline
 * button. A single soft blue glow opens the run at the top of Clientes, so no seams show. */
:is(.porto-home-clients, .porto-home-brands) {
	position: relative;
	overflow: hidden;
	background: var(--wp--preset--color--contrast) !important;
}

.porto-home-clients {
	background:
		radial-gradient(70% 60% at 50% 0%, color-mix(in srgb, var(--wp--preset--color--primary) 50%, transparent), transparent 70%),
		var(--wp--preset--color--contrast) !important;
}

:is(.porto-home-clients, .porto-home-brands, .porto-home-cta) .is-style-eyebrow {
	letter-spacing: 0.32em;
	color: var(--wp--preset--color--secondary);
}

:is(.porto-home-clients, .porto-home-brands, .porto-home-cta) h2 {
	font-weight: 300;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--base);
}

:is(.porto-home-clients, .porto-home-brands) p:not(.is-style-eyebrow) {
	color: color-mix(in srgb, var(--wp--preset--color--base) 72%, transparent);
}

/* Marcas: logos turned into white marks on transparent by the SVG filter #porto-brands-mono
 * (printed by porto/brands), brighter on hover. */

.porto-home-brands .porto-brand__logo {
	aspect-ratio: 390 / 222;
	background: transparent !important;
	box-shadow: none !important;
	transform: none !important;
}

.porto-home-brands .porto-brand__logo img {
	object-fit: contain;
	/* Some uploads carry a 1px grey edge, which the filter would turn into a white line. */
	clip-path: inset(3px);
	filter: url(#porto-brands-mono);
	opacity: 0.6;
	transition: opacity 0.5s ease, transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.porto-home-brands .porto-brand__logo:hover img {
	filter: url(#porto-brands-mono);
	opacity: 1;
	transform: scale(1.06);
}

.porto-home-brands .porto-brand__name {
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--base);
	opacity: 0.6;
	transition: opacity 0.5s ease;
}

.porto-home-brands .porto-brand__logo:hover .porto-brand__name {
	opacity: 1;
}

:is(.porto-home-clients, .porto-home-brands) .wp-block-button.is-style-outline > .wp-block-button__link {
	border-color: color-mix(in srgb, var(--wp--preset--color--base) 40%, transparent);
	color: var(--wp--preset--color--base);
}

:is(.porto-home-clients, .porto-home-brands) .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--base);
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--primary);
}

/* Clientes: logo grid on the primary band — any logo is shown in white. */
.porto-home-clients__logos {
	row-gap: var(--wp--preset--spacing--60) !important;
	column-gap: var(--wp--preset--spacing--50) !important;
	align-items: center;
}

.porto-home-clients__logos .wp-block-image {
	display: flex;
	justify-content: center;
	margin: 0;
}

.porto-home-clients__logos img {
	width: auto;
	max-width: 100%;
	max-height: 3.5rem;
	object-fit: contain;
	filter: brightness(0) invert(1);
	opacity: 0.6;
	transition: opacity 0.5s ease, transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.porto-home-clients__logos img:hover {
	opacity: 1;
	transform: scale(1.06);
}

@media (max-width: 781px) {
	.porto-home-clients__logos {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
		row-gap: var(--wp--preset--spacing--40) !important;
		column-gap: var(--wp--preset--spacing--30) !important;
	}
}

/* CTA: full-width banner; the photo drifts behind the text (home-motion.js). */
.porto-home-cta {
	overflow: hidden;
}

/* -------------------------------------------------------------------------
 * Produtos industriais and its families (2026-10-29): Hero · Oferta · Opções ·
 * Descrição · USPs · CTA in the homepage language. They reuse the home pieces
 * (.porto-home-usp, .porto-home-cta, .porto-home-area__media / __links /
 * __marquee); motion: assets/js/home-motion.js. Cards animated by GSAP keep
 * their transform free (no hover lift), as the home rows.
 * ---------------------------------------------------------------------- */

/* Category hero: logos of the represented brands in the banner (caderno 3.3, 2026-11-08), on small white plates. */
.porto-page-hero__brands {
	gap: 0.5rem !important;
	margin-top: var(--wp--preset--spacing--20) !important;
}

.porto-page-hero__brands .porto-page-option__logo {
	margin: 0 !important;
	padding: 0.4rem 0.75rem;
	border-radius: var(--wp--custom--radius--small, 0.5rem);
	background: var(--wp--preset--color--base);
}

.porto-page-hero__brands .porto-page-option__logo img {
	display: block;
	width: auto;
	height: 2.25rem;
	object-fit: contain;
}

/* Hero: the video zooms behind the text on scroll. */
.porto-page-hero {
	overflow: hidden;
}

/* Short hero (caderno: compact, no CTA, no dead space) — Segurança industrial, 2026-11-08: content height
 * only; the smaller title is the heading's own font size (xxx-large), editable in the block. */

/* Oferta: the numbered points in one compact row under the title (two per row on tablets),
 * so the options follow right after. */
.porto-page-offer__items {
	grid-template-columns: repeat(var(--porto-offer-cols, 4), minmax(0, 1fr)) !important;
	gap: var(--wp--preset--spacing--20) !important;
}

.porto-page-offer__items--3 {
	--porto-offer-cols: 3;
}

.porto-page-offer__items--2 {
	--porto-offer-cols: 2;
}

.porto-page-offer__items--1 {
	--porto-offer-cols: 1;
}

.porto-page-offer__item {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--30);
	padding: var(--wp--preset--spacing--40);
	border-radius: var(--wp--custom--radius--medium);
	background: var(--wp--preset--color--light);
}

.porto-page-offer__items .porto-page-offer__item {
	gap: var(--wp--preset--spacing--20);
	padding: var(--wp--preset--spacing--30);
}

.porto-page-offer__item > * {
	margin: 0 !important;
}

@media (max-width: 1099.98px) {
	.porto-page-offer__items:not(.porto-page-offer__items--1) {
		--porto-offer-cols: 2;
	}
}

.porto-page-offer__num,
.porto-page-option__num {
	font-family: var(--wp--preset--font-family--satoshi);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--secondary);
	transition: color 0.4s;
}

.porto-page-offer__text {
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	line-height: 1.4;
	color: var(--wp--preset--color--primary);
}

/* Opções: one card per sub-page, the whole card is the link (stretched descriptive
 * link); the sub-page chips sit above it. Fills with the primary blue on hover. */
.porto-page-option {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--30);
	height: 100%;
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40) var(--wp--preset--spacing--40);
	border-radius: var(--wp--custom--radius--medium);
	background: var(--wp--preset--color--base);
	transition: background-color 0.4s, color 0.4s;
}

.porto-page-option > * {
	margin: 0 !important;
}

.porto-page-option::after {
	content: "\f061";
	position: absolute;
	top: var(--wp--preset--spacing--40);
	right: var(--wp--preset--spacing--40);
	display: grid;
	place-items: center;
	width: 3.25rem;
	height: 3.25rem;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	color: var(--wp--preset--color--base);
	transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), background-color 0.4s;
}

.porto-page-option__body h3 {
	margin: 0;
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--primary);
	transition: color 0.4s;
}

.porto-page-option__body p {
	margin: 0.35rem 0 0;
	color: #4a5a68;
	transition: color 0.4s;
}

.porto-page-option__brand {
	align-self: flex-start;
	justify-self: start;
	padding: 0.4rem 0.95rem;
	border-radius: 999px;
	background: color-mix(in srgb, var(--wp--preset--color--primary) 8%, transparent);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--primary);
	transition: background-color 0.4s, color 0.4s;
}

.porto-page-option__more {
	margin-top: auto !important;
	font-weight: 700;
}

.porto-page-option__more a,
.porto-page-option__more a:hover {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
	transition: color 0.4s;
}

.porto-page-option__more a::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	border-radius: inherit;
}

.porto-page-option__more a::after {
	content: " →";
}

.porto-page-option:is(:hover, :focus-within) {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
}

.porto-page-option:is(:hover, :focus-within)::after {
	background: var(--wp--preset--color--secondary);
	transform: translateX(4px) rotate(-45deg);
}

.porto-page-option:is(:hover, :focus-within) :is(h3, .porto-page-option__num, .porto-page-option__more a) {
	color: var(--wp--preset--color--base);
}

.porto-page-option:is(:hover, :focus-within) .porto-page-option__body p {
	color: rgba(255, 255, 255, 0.88);
}

.porto-page-option:is(:hover, :focus-within) :is(.porto-page-option__brand, .porto-home-area__links a) {
	background: rgba(255, 255, 255, 0.14);
	color: var(--wp--preset--color--base);
}

.porto-page-option:is(:hover, :focus-within) .porto-home-area__links a:is(:hover, :focus-visible) {
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--primary);
}

/* Option card with a photo (Produtos industriais, Robótica): the photo fills the top of the
 * card edge to edge; the arrow sits over it. Zooms a little on hover. */
.porto-page-option--photo {
	overflow: hidden;
	padding-top: 0;
}

.porto-page-option--photo > .porto-page-option__photo {
	margin: 0 calc(-1 * var(--wp--preset--spacing--40)) var(--wp--preset--spacing--10) !important;
	overflow: hidden;
	aspect-ratio: 16 / 10;
}

.porto-page-option__photo img {
	width: 100%;
	height: 100%;
	border-radius: 0 !important;
	object-fit: cover;
	transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.porto-page-option--photo:is(:hover, :focus-within) .porto-page-option__photo img {
	transform: scale(1.05);
}

/* Agregadoras on phones (decision 2026-11-08): compact list instead of tall photo cards.
 * Square thumbnail + title on the first row; description, logos and sub-page chips full width
 * below; no number; small arrow top right. The "Ver…" link keeps stretching over the whole
 * card (::before) but its text is hidden. */
@media (max-width: 599.98px) {
	.porto-solucao--agregadora .porto-page-option--photo {
		display: grid;
		grid-template-columns: 4.5rem minmax(0, 1fr);
		align-items: center;
		gap: 0.75rem var(--wp--preset--spacing--30);
		padding: var(--wp--preset--spacing--30);
	}

	.porto-solucao--agregadora .porto-page-option--photo > .porto-page-option__photo {
		grid-area: 1 / 1;
		margin: 0 !important;
		aspect-ratio: 1;
		border-radius: var(--wp--custom--radius--small, 0.75rem);
	}

	.porto-solucao--agregadora .porto-page-option--photo > .porto-page-option__body {
		display: contents;
	}

	.porto-solucao--agregadora .porto-page-option--photo .porto-page-option__body h3 {
		grid-area: 1 / 2;
		padding-right: 2.5rem;
		font-size: var(--wp--preset--font-size--medium);
	}

	.porto-solucao--agregadora .porto-page-option--photo .porto-page-option__body p,
	.porto-solucao--agregadora .porto-page-option--photo > :is(.porto-page-option__logos, .porto-home-area__links) {
		grid-column: 1 / -1;
		margin: 0;
	}

	.porto-solucao--agregadora .porto-page-option--photo > .porto-page-option__num {
		display: none;
	}

	.porto-solucao--agregadora .porto-page-option--photo > .porto-page-option__more {
		grid-area: 1 / 1;
		height: 0;
		overflow: hidden;
	}

	.porto-solucao--agregadora .porto-page-option--photo::after {
		top: var(--wp--preset--spacing--30);
		right: var(--wp--preset--spacing--30);
		width: 2rem;
		height: 2rem;
		font-size: 0.8rem;
	}
}

/* Three per row with one left over (7 options): the last card becomes a wide row, as on the home. */
@media (min-width: 1100px) {
	.porto-page-options__grid--3 > .porto-page-option:not(.porto-page-option--photo):last-child:nth-child(3n + 1) {
		grid-column: 1 / -1;
		display: grid;
		grid-template-columns: 4.5rem minmax(0, 1.3fr) minmax(0, 1fr);
		align-items: center;
		gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--50);
		padding: var(--wp--preset--spacing--40) calc(var(--wp--preset--spacing--40) * 2 + 3.25rem) var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
	}

	.porto-page-options__grid--3 > .porto-page-option:not(.porto-page-option--photo):last-child:nth-child(3n + 1) > :is(.porto-page-option__num, .porto-page-option__body) {
		grid-row: span 2;
	}

	.porto-page-options__grid--3 > .porto-page-option:not(.porto-page-option--photo):last-child:nth-child(3n + 1)::after {
		top: calc(50% - 1.625rem);
	}
}

/* Opções of a category page: product cards (ForTest style, the client's reference) — the product
 * photo on a light stage with a wide arc, the number as a tag over it, then title, description,
 * bullets. Not a link: no arrow, no blue fill on hover. The highlighted option gets a blue edge. */
.porto-page-option--detail {
	gap: 0;
	overflow: hidden;
	padding: 0;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--primary) 8%, transparent);
}

.porto-page-option--detail::after {
	content: none;
}

.porto-page-option--detail:is(:hover, :focus-within) {
	background: var(--wp--preset--color--base);
	color: inherit;
}

.porto-page-option--detail:is(:hover, :focus-within) h3 {
	color: var(--wp--preset--color--primary);
}

.porto-page-option--detail:is(:hover, :focus-within) .porto-page-option__body p {
	color: #4a5a68;
}

.porto-page-option--highlight {
	outline: 2px solid var(--wp--preset--color--secondary);
	outline-offset: -2px;
}

.porto-page-option--detail .porto-page-option__num {
	position: absolute;
	top: var(--wp--preset--spacing--30);
	left: var(--wp--preset--spacing--30);
	z-index: 2;
	padding: 0.45rem 0.8rem;
	border-radius: var(--wp--custom--radius--small);
	background: var(--wp--preset--color--secondary);
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--base);
}

.porto-page-option__img {
	position: relative;
	display: grid;
	place-items: center;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: linear-gradient(160deg, var(--wp--preset--color--base) 30%, color-mix(in srgb, var(--wp--preset--color--primary) 5%, var(--wp--preset--color--base)));
}

/* The arc: a thick ring whose lower-left quarter crosses the stage behind the product. */
.porto-page-option__img::before {
	content: "";
	position: absolute;
	top: -70%;
	right: -45%;
	width: 120%;
	aspect-ratio: 1;
	border: clamp(3rem, 7vw, 5.5rem) solid color-mix(in srgb, var(--wp--preset--color--primary) 8%, transparent);
	border-radius: 50%;
}

.porto-page-option__img img {
	position: relative;
	z-index: 1;
	width: 72%;
	height: 72%;
	object-fit: contain;
}

.porto-page-option__content {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--30);
	padding: var(--wp--preset--spacing--40);
}

.porto-page-option__content > * {
	margin: 0 !important;
}

.porto-page-option--detail .porto-page-option__body h3 {
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.02em;
}

.porto-page-option__list > * {
	margin: 0 !important;
}

.porto-page-option__list .porto-list-label {
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--primary);
}

.porto-page-option__list .is-style-porto-check li {
	font-size: var(--wp--preset--font-size--small);
}

.porto-page-option__note {
	font-size: var(--wp--preset--font-size--small);
	color: #4a5a68;
}

/* Seven options (three per row, one left over): the last card lies down — photo left, text right. */
@media (min-width: 1100px) {
	.porto-page-options__grid--3 > .porto-page-option--detail:last-child:nth-child(3n + 1) {
		grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
		align-items: center;
		gap: 0;
		padding: 0;
	}

	.porto-page-options__grid--3 > .porto-page-option--detail:last-child:nth-child(3n + 1) > .porto-page-option__num {
		grid-row: auto;
	}

	.porto-page-options__grid--3 > .porto-page-option--detail:last-child:nth-child(3n + 1) > .porto-page-option__img {
		align-self: stretch;
		aspect-ratio: auto;
		min-height: 20rem;
	}
}

/* Como funciona: the steps as tiles, white on the light section. */
.porto-page-process .porto-page-step {
	background: var(--wp--preset--color--base);
}

/* Descrição: text under the photo band, top-aligned columns. */
.porto-page-about {
	overflow-x: clip;
}

/* Agregadoras: a slightly lower photo band in the description (decision 2026-11-08). */
@media (min-width: 782px) {
	.porto-solucao--agregadora .porto-page-about .porto-home-area__media {
		aspect-ratio: 8 / 3;
	}
}

.porto-page-about__text .wp-block-column {
	align-self: flex-start;
}

.porto-page-about__text p:not(.is-style-lead) {
	color: #4a5a68;
}

/* Subsection tiles (same look as the offer points). */
.porto-page-offer__item h3 {
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--primary);
}

.porto-page-offer__item p:not(.porto-page-offer__num, .porto-page-offer__text) {
	color: #4a5a68;
}

/* -------------------------------------------------------------------------
 * Automação category pages (Pneumática, Prensas…): Opções e marcas,
 * CTA intermédio, Que problemas resolve, Aplicações, FAQ, Relacionados and
 * the form CTA. Same language as above.
 * ---------------------------------------------------------------------- */

/* Marcas representadas, beside the options title: white logo tiles, a few columns at most. */
.porto-page-options .porto-home-area__head:has(.porto-page-brands) {
	align-items: flex-start;
}

.porto-page-brands__label {
	margin: 0;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wp--preset--color--secondary-dark);
}

.porto-page-brands .porto-related__items--marca {
	grid-template-columns: repeat(var(--porto-related-columns, 3), minmax(0, 1fr));
	max-width: calc(var(--porto-related-columns, 3) * 11rem);
	gap: var(--wp--preset--spacing--20);
}

.porto-page-brands .porto-brand__logo {
	background: var(--wp--preset--color--base);
}

/* Opções: the accordion as numbered rows, round "+" turning into "×" when open. */
.porto-page-optlist {
	counter-reset: porto-option;
}

.porto-page-optlist .porto-option {
	counter-increment: porto-option;
}

.porto-page-optlist .porto-option__summary {
	position: relative;
	gap: var(--wp--preset--spacing--40);
	padding: var(--wp--preset--spacing--40) calc(var(--wp--preset--spacing--40) * 2 + 3.25rem) var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
}

.porto-page-optlist .porto-option__summary::before {
	content: counter(porto-option, decimal-leading-zero);
	flex: none;
	width: 3.5rem;
	font-family: var(--wp--preset--font-family--satoshi);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--secondary);
}

.porto-page-optlist .porto-option__summary::after,
.porto-page-optlist details.porto-option[open] > .porto-option__summary::after {
	content: "+";
	top: 50%;
	right: var(--wp--preset--spacing--40);
	width: 3.25rem;
	height: 3.25rem;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	font-size: 1.6rem;
	font-weight: 300;
	transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), background-color 0.4s;
}

.porto-page-optlist .porto-option__summary:hover::after {
	background: var(--wp--preset--color--secondary);
	color: var(--wp--preset--color--base);
}

.porto-page-optlist details.porto-option[open] > .porto-option__summary::after {
	background: var(--wp--preset--color--secondary);
	transform: translateY(-50%) rotate(45deg);
}

.porto-page-optlist .porto-option__description {
	color: #4a5a68;
}

.porto-page-optlist .porto-option__content {
	padding: 0 var(--wp--preset--spacing--50) var(--wp--preset--spacing--50) calc(var(--wp--preset--spacing--50) + 3.5rem + var(--wp--preset--spacing--40));
}

.porto-page-optlist .porto-option__content .is-style-porto-check {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
	gap: 0.5rem var(--wp--preset--spacing--40);
}

.porto-page-optlist .porto-option__content .is-style-porto-check li {
	margin: 0;
}

/* Narrow screens: number above the title, the round button in the top corner. */
@media (max-width: 781.98px) {
	.porto-page-optlist .porto-option__summary {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--wp--preset--spacing--20);
		padding: var(--wp--preset--spacing--30);
	}

	.porto-page-optlist .porto-option__summary::before {
		display: flex;
		align-items: center;
		width: auto;
		min-height: 2.5rem;
		font-size: var(--wp--preset--font-size--large);
	}

	.porto-page-optlist .porto-option__summary::after,
	.porto-page-optlist details.porto-option[open] > .porto-option__summary::after {
		top: var(--wp--preset--spacing--30);
		right: var(--wp--preset--spacing--30);
		width: 2.5rem;
		height: 2.5rem;
		transform: none;
	}

	.porto-page-optlist details.porto-option[open] > .porto-option__summary::after {
		transform: rotate(45deg);
	}

	.porto-page-optlist .porto-option__content {
		padding: 0 var(--wp--preset--spacing--30) var(--wp--preset--spacing--30);
	}
}

/* Extra text closing the options (e.g. Vedações: portas e painéis). */
.porto-page-options__extra {
	margin-top: var(--wp--preset--spacing--40) !important;
	padding-top: var(--wp--preset--spacing--40);
	border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--primary) 15%, transparent);
}

.porto-page-options__extra h3 {
	color: var(--wp--preset--color--primary);
}

.porto-page-options__extra-text p {
	margin: 0;
	color: #4a5a68;
}

/* Explicação com conteúdo visual (porto/media-tabs): home numbers, large rounded media. */
.porto-page-process .porto-media-tabs__num {
	font-family: var(--wp--preset--font-family--satoshi);
	font-weight: 700;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--secondary);
}

.porto-page-process .porto-media-tabs__stage {
	border-radius: var(--wp--custom--radius--large);
}

/* CTA intermédio: dark rounded band with a blue glow (clip-path wipe in JS). */
.porto-page-midcta__band {
	align-items: center;
	gap: var(--wp--preset--spacing--40) !important;
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--60);
	border-radius: var(--wp--custom--radius--large);
	background:
		radial-gradient(70% 140% at 100% 0%, color-mix(in srgb, var(--wp--preset--color--primary) 70%, transparent), transparent 70%),
		var(--wp--preset--color--contrast);
}

.porto-page-midcta__band > * {
	margin: 0 !important;
}

.porto-page-midcta__band > .wp-block-group {
	flex: 1 1 28rem;
	max-width: 46rem;
}

.porto-page-midcta__band h2 {
	font-weight: 300;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--base);
}

.porto-page-midcta__band p {
	margin: 0;
	color: color-mix(in srgb, var(--wp--preset--color--base) 72%, transparent);
}

@media (max-width: 599.98px) {
	.porto-page-midcta__band {
		padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
	}
}

/* Que problemas resolve: dark section, translucent cards with an outlined number. */
.porto-page-problem {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--20);
	padding: var(--wp--preset--spacing--40);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: var(--wp--custom--radius--medium);
	background: rgba(255, 255, 255, 0.04);
	transition: background-color 0.4s, border-color 0.4s;
}

.porto-page-problem:hover {
	border-color: color-mix(in srgb, var(--wp--preset--color--secondary) 45%, transparent);
	background: rgba(255, 255, 255, 0.07);
}

.porto-page-problem > * {
	margin: 0 !important;
}

.porto-page-problem__num {
	margin-bottom: var(--wp--preset--spacing--20) !important;
	font-family: var(--wp--preset--font-family--satoshi);
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 700;
	line-height: 1;
	color: transparent;
	-webkit-text-stroke: 1px var(--wp--preset--color--secondary);
}

.porto-page-problem h3 {
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--base);
}

.porto-page-problem p:not(.porto-page-problem__num) {
	color: color-mix(in srgb, var(--wp--preset--color--base) 72%, transparent);
}

/* Aplicações: editorial rows — number · sector · text — between hairlines. */
.porto-page-apps__list > * {
	margin: 0 !important;
}

.porto-page-app {
	display: grid;
	grid-template-columns: 5rem minmax(0, 1fr) minmax(0, 1.2fr);
	align-items: baseline;
	gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--50);
	padding-block: var(--wp--preset--spacing--40);
	border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--primary) 15%, transparent);
}

.porto-page-app:last-child {
	border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--primary) 15%, transparent);
}

.porto-page-app > * {
	margin: 0 !important;
}

.porto-page-app__num {
	font-family: var(--wp--preset--font-family--satoshi);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 700;
	line-height: 1;
	color: var(--wp--preset--color--secondary);
}

.porto-page-app h3 {
	font-size: var(--wp--preset--font-size--x-large);
	color: var(--wp--preset--color--primary);
	transition: transform 0.5s var(--porto-ease);
}

.porto-page-app:hover h3 {
	transform: translateX(8px);
}

.porto-page-app p:not(.porto-page-app__num) {
	color: #4a5a68;
}

@media (max-width: 781.98px) {
	.porto-page-app {
		grid-template-columns: 3rem minmax(0, 1fr);
	}

	.porto-page-app p:not(.porto-page-app__num) {
		grid-column: 2;
	}
}

/* Perguntas frequentes: title held on the left, questions on the right. */
.porto-page-faq .wp-block-columns {
	align-items: flex-start !important;
}

@media (min-width: 782px) {
	.porto-page-faq .wp-block-column:first-child {
		position: sticky;
		top: 8rem;
		align-self: flex-start !important;
	}
}

.porto-page-faq__list > * {
	margin-block: 0 !important;
}

.porto-page-faq .wp-block-details summary {
	position: relative;
	padding: var(--wp--preset--spacing--30) calc(var(--wp--preset--spacing--30) * 2 + 2.5rem) var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	list-style: none;
}

.porto-page-faq .wp-block-details summary::-webkit-details-marker {
	display: none;
}

.porto-page-faq .wp-block-details summary::after {
	content: "+";
	position: absolute;
	top: 50%;
	right: var(--wp--preset--spacing--30);
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
	font-size: 1.4rem;
	font-weight: 300;
	color: var(--wp--preset--color--base);
	transform: translateY(-50%);
	transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), background-color 0.4s;
}

.porto-page-faq .wp-block-details[open] summary::after {
	background: var(--wp--preset--color--secondary);
	transform: translateY(-50%) rotate(45deg);
}

.porto-page-faq .wp-block-details > :not(summary) {
	margin: 0 var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
	color: #4a5a68;
}

/* Também pode ser relevante: option cards without number, the arrow at the bottom. */
.porto-page-option--related {
	padding-top: var(--wp--preset--spacing--40);
}

.porto-page-option--related::after {
	top: auto;
	bottom: var(--wp--preset--spacing--40);
}

/* Related card with a photo (caderno: imagem, nome, descrição e botão — 2026-11-08): photo flush on top. */
.porto-page-option--related.porto-page-option--photo {
	padding-top: 0;
}

.porto-page-option--related .porto-page-option__more {
	padding-right: 4rem;
}

.porto-page-related .porto-page-option {
	background: var(--wp--preset--color--light);
}

.porto-page-related .porto-page-option:is(:hover, :focus-within) {
	background: var(--wp--preset--color--primary);
}

/* Phones: shorter pages (client notes 2026-10-30) — the offer, problems, applications and
 * related pages fold into bullet lists (titles only), option descriptions are clamped and the
 * description's photo band is left out. */
@media (max-width: 599.98px) {
	.porto-page-offer__items {
		--porto-offer-cols: 1 !important;
		gap: var(--wp--preset--spacing--10) !important;
	}

	.porto-page-offer__items .porto-page-offer__item,
	.porto-page-problem {
		display: grid;
		grid-template-columns: 1.25rem minmax(0, 1fr);
		align-items: baseline;
		gap: 0 var(--wp--preset--spacing--20);
		padding: 0;
		border: 0;
		background: none;
	}

	.porto-page-offer__items .porto-page-offer__item::before,
	.porto-page-problem::before {
		content: "\f00c";
		font-family: "Font Awesome 7 Free";
		font-weight: 900;
		font-size: 0.85em;
		color: var(--wp--preset--color--secondary);
	}

	.porto-page-offer__items .porto-page-offer__item > *,
	.porto-page-problem > * {
		grid-column: 2;
	}

	.porto-page-offer__items :is(.porto-page-offer__num, p:not(.porto-page-offer__text)),
	.porto-page-problem :is(.porto-page-problem__num, p),
	.porto-page-app p:not(.porto-page-app__num),
	.porto-page-related .porto-page-option__body p,
	.porto-page-about .porto-home-area__media {
		display: none !important;
	}

	.porto-page-offer__items .porto-page-offer__text,
	.porto-page-problem h3 {
		font-size: var(--wp--preset--font-size--medium);
	}

	.porto-page-problems__grid {
		gap: var(--wp--preset--spacing--20) !important;
	}

	.porto-page-app {
		padding-block: var(--wp--preset--spacing--20);
	}

	.porto-page-app h3 {
		font-size: var(--wp--preset--font-size--large);
	}

	.porto-page-option__img {
		aspect-ratio: 16 / 9;
	}

	.porto-page-option--detail .porto-page-option__body p {
		display: -webkit-box;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
	}

	.porto-page-related .porto-page-option {
		padding-block: var(--wp--preset--spacing--30);
	}
}

/* CTA com formulário: the home CTA banner, text left and the form card right. */
.porto-page-form .is-style-card {
	color: var(--wp--preset--color--contrast);
}

/* Extra section under the description (e.g. Sistemas de localização: UWB / BLE). */
.porto-page-about__extra h3 {
	color: var(--wp--preset--color--primary);
}

/* Vídeo (MOBOT): text beside the video, the frame keeps its placeholder until a file is set. */
.porto-page-video .wp-block-video {
	overflow: hidden;
	margin: 0;
	border-radius: var(--wp--custom--radius--large);
}

.porto-page-video p:not(.is-style-eyebrow) {
	color: #4a5a68;
}

/* EMR pages: the numbers and round buttons take the EMR orange instead of the Europneumaq blue. */
.porto-brand-emr :is(.porto-page-offer__num, .porto-page-option__num, .porto-page-app__num, .porto-home-usp .counter strong, .porto-media-tabs__num),
.porto-brand-emr .porto-page-optlist .porto-option__summary::before {
	color: var(--wp--preset--color--accent-emr);
}

.porto-brand-emr .porto-page-option--detail .porto-page-option__num {
	background: var(--wp--preset--color--accent-emr);
	color: var(--wp--preset--color--base);
}

.porto-brand-emr .porto-page-problem__num {
	-webkit-text-stroke-color: var(--wp--preset--color--accent-emr);
}

/* (Pseudo-elements are not allowed inside :is(), hence one selector each.) */
.porto-brand-emr .porto-page-option:is(:hover, :focus-within)::after,
.porto-brand-emr .porto-page-faq .wp-block-details[open] summary::after,
.porto-brand-emr .porto-page-optlist details.porto-option[open] > .porto-option__summary::after,
.porto-brand-emr .porto-motion-progress {
	background: var(--wp--preset--color--accent-emr);
}

.porto-brand-emr .porto-page-midcta__band {
	background:
		radial-gradient(70% 140% at 100% 0%, color-mix(in srgb, var(--wp--preset--color--accent-emr) 35%, transparent), transparent 70%),
		var(--wp--preset--color--contrast);
}

/* Brand carousel before Owl starts (Porto starts it when it scrolls into
 * view): one row of logos instead of a vertical stack — no layout shift. */
.porto-brands__carousel:not(.owl-loaded) {
	--porto-brands-visible: 2;
	display: flex;
	gap: 40px;
	overflow: hidden;
}

.porto-brands__carousel:not(.owl-loaded) > * {
	flex: 0 0 calc((100% - (var(--porto-brands-visible) - 1) * 40px) / var(--porto-brands-visible));
}

@media (min-width: 479px) {
	.porto-brands__carousel:not(.owl-loaded) {
		--porto-brands-visible: 3;
	}
}

@media (min-width: 768px) {
	.porto-brands__carousel:not(.owl-loaded) {
		--porto-brands-visible: 4;
	}
}

@media (min-width: 979px) {
	.porto-brands__carousel:not(.owl-loaded) {
		--porto-brands-visible: 6;
	}
}

/* -------------------------------------------------------------------------
 * Client copy (2026-10-27): pieces added for the closed page texts.
 * ---------------------------------------------------------------------- */

/* Agregadora hero: "O que … oferece" as a short checked list. */
.porto-hero-points ul {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
	gap: 0.5rem var(--wp--preset--spacing--30);
	margin: 0;
	color: color-mix(in srgb, var(--wp--preset--color--base) 85%, transparent);
}

/* "Faz sentido quando:" / "Principais tipos e aplicações:" above a list. */
.porto-list-label {
	margin-bottom: 0.25rem !important;
	font-size: var(--wp--preset--font-size--small);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--secondary-dark);
}

.is-style-section-dark .porto-list-label {
	color: var(--wp--preset--color--secondary);
}

/* Featured option (e.g. AdaptaGuard): open by default, accent frame and badge. */
.porto-option--highlight {
	border: 2px solid var(--wp--preset--color--accent) !important;
	box-shadow: 0 16px 40px -24px color-mix(in srgb, var(--wp--preset--color--accent) 70%, transparent);
}

.porto-option--highlight .porto-option__title::after {
	content: "Destaque";
	margin-left: 0.6rem;
	padding: 0.15rem 0.55rem;
	border-radius: 999px;
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--contrast);
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	vertical-align: middle;
}

/* Option cards (agregadoras) and "Também pode ser relevante": brand line + descriptive link. */
.porto-card-meta {
	margin: 0 !important;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--secondary-dark);
}

.porto-card-link {
	margin-top: auto !important;
	font-weight: 700;
}

.porto-card-link a {
	text-decoration: none;
}

.porto-card-link a::after {
	content: " →";
	transition: margin-left 0.25s var(--porto-ease);
}

.porto-card-link a:hover::after {
	margin-left: 0.25rem;
}

.porto-options-section .is-style-card,
.porto-related-section .is-style-card,
.porto-home-areas .is-style-card {
	display: flex;
	flex-direction: column;
}

.porto-options-section .is-style-card .wp-block-buttons {
	margin-top: auto;
}

.porto-options-section .is-style-card .wp-block-image img {
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--medium, 12px);
}

/* Direct links under a family card (Produtos industriais, home areas): navigation rows with a discreet arrow. */
.is-style-porto-links {
	margin: 0;
	padding: 0;
	list-style: none;
}

.is-style-porto-links li {
	border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 10%, transparent);
}

.is-style-porto-links li:first-child {
	border-top: 0;
}

.is-style-porto-links a {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.6rem 0.25rem;
	color: inherit;
	text-decoration: none;
	font-weight: 500;
}

.is-style-porto-links a::after {
	content: "→";
	color: var(--wp--preset--color--secondary);
	transition: transform 0.25s var(--porto-ease);
}

.is-style-porto-links a:hover {
	color: var(--wp--preset--color--secondary-dark);
}

.is-style-porto-links a:hover::after {
	transform: translateX(4px);
}

.porto-option-group > .is-style-card {
	height: auto;
}

/* Sector cards ("Onde podem ser aplicados"). */
.porto-applications .is-style-card h3 {
	font-size: var(--wp--preset--font-size--medium);
}

/* MOBOT video: placeholder frame until the client sends the video. */
.porto-video-placeholder {
	min-height: 18rem;
	margin: 0;
	border-radius: var(--wp--custom--radius--large, 24px);
	background: color-mix(in srgb, var(--wp--preset--color--base) 8%, transparent);
	overflow: hidden;
}

.porto-video-placeholder video {
	display: block;
	width: 100%;
}

/* -------------------------------------------------------------------------
 * Home: value proposition (2026-11-04) — H1 + Empresa copy on the left, the
 * four "Porque trabalhar" points as numbered tiles on the right, and the role
 * in each area (distributor / integrator) in a row of three underneath.
 * ---------------------------------------------------------------------- */
.porto-home-value h1 {
	margin: 0;
	line-height: 1.1;
}

.porto-home-value__items {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.porto-home-value__item h3 {
	margin: 0;
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.3;
	color: var(--wp--preset--color--primary);
}

.porto-home-value__item p:not(.porto-page-offer__num) {
	color: #4a5a68;
}

.porto-home-value__roles {
	padding-top: var(--wp--preset--spacing--40);
	border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--primary) 12%, transparent);
}

.porto-home-value__role > * {
	margin: 0 !important;
}

.porto-home-value__role-name {
	margin-bottom: var(--wp--preset--spacing--10) !important;
	font-family: var(--wp--preset--font-family--satoshi);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--medium);
}

.porto-home-value__role-name a {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
}

.porto-home-value__role-name a::after {
	content: " →";
	color: var(--wp--preset--color--secondary);
}

.porto-home-value__role-name a:is(:hover, :focus-visible) {
	color: var(--wp--preset--color--secondary);
}

.porto-home-value__role p:not(.porto-home-value__role-name) {
	color: #4a5a68;
}

@media (max-width: 781.98px) {
	.porto-home-value__items {
		grid-template-columns: minmax(0, 1fr) !important;
	}
}

/* Home Áreas de atuação: the copy's "Explorar …" link under each family (same target as the title). */
.porto-home-area__body .porto-home-area__more {
	margin-top: var(--wp--preset--spacing--10);
	font-weight: 700;
}

.porto-home-area__more a,
.porto-home-area__more a:hover {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
	transition: color 0.4s;
}

.porto-home-area__more a::after {
	content: " →";
}

.porto-home-area__row:is(:hover, :focus-within) .porto-home-area__more a {
	color: var(--wp--preset--color--base);
}

/* Porque trabalhar (synced, Produtos industriais and its families): the copy's 4 points as white
 * numbered tiles on the light band. */
.porto-page-why .porto-page-offer__item {
	background: var(--wp--preset--color--base);
}

/* Phones (fix 2026-11-08): a clean check list, no white tiles — the white background above was
 * overriding the bullet layout and left the check outside the pill. Unlike the offer bullets,
 * each point keeps the copy's short description under the title. */
@media (max-width: 599.98px) {
	.porto-page-why .porto-page-offer__items {
		gap: var(--wp--preset--spacing--30) !important;
	}

	.porto-page-why .porto-page-offer__items .porto-page-offer__item {
		background: none;
	}

	.porto-page-why .porto-page-offer__item h3 {
		font-size: var(--wp--preset--font-size--medium);
	}

	.porto-page-why .porto-page-offer__items .porto-page-offer__item p:not(.porto-page-offer__num) {
		display: block !important;
		margin-top: 0.25rem !important;
		font-size: var(--wp--preset--font-size--small);
		line-height: 1.5;
		color: #4a5a68;
	}
}

/* Option cards: logos of the represented brands (caderno 01/10) on small white plates, so they
 * stay readable when the card fills blue on hover. */
.porto-page-option__logos {
	position: relative;
	z-index: 2;
	gap: 0.5rem !important;
}

.porto-page-option__logos .porto-page-option__logo {
	margin: 0;
	padding: 0.3rem 0.6rem;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--primary) 10%, transparent);
	border-radius: var(--wp--custom--radius--small);
	background: #fff;
}

.porto-page-option__logos .porto-page-option__logo img {
	display: block;
	width: auto;
	max-width: 8rem;
	height: 2.25rem;
	border-radius: 0 !important;
	object-fit: contain;
}

/* Case study card (2026-11-09): only "Case Study" in the pill; the sector as a line of text underneath. */
.porto-card__sector {
	margin: 0;
	color: #4a5a68;
	font-size: var(--wp--preset--font-size--small);
}

.porto-card--case-study {
	height: 100%;
}

/* Empresa (2026-11-09): presentation video, photos of the spaces, certification logos. */
.porto-company-video video {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	border-radius: var(--wp--custom--radius--large);
	background: var(--wp--preset--color--contrast);
	object-fit: cover;
}

.porto-company-photo img,
.porto-space-photo img {
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: var(--wp--custom--radius--medium);
	object-fit: cover;
}

.porto-space-photo img {
	aspect-ratio: 3 / 2;
}

.porto-cert-logo img {
	width: auto;
	height: 72px;
	object-fit: contain;
}

.porto-card--case-study .porto-card__label {
	align-self: flex-start;
	width: fit-content;
}

/* Brand tiles (white logo plates since 2026-11-09): a light outline so they read on white sections. */
.porto-brand__logo {
	box-shadow: inset 0 0 0 1px rgba(7, 21, 33, 0.08);
}

/* Explicativas (2026-11-09): placeholders kept visible on purpose (user decision) until the client sends photos/videos. */
.porto-video-placeholder:not(:has(video)) {
	position: relative;
	aspect-ratio: 16 / 9;
	min-height: 0;
	background: var(--wp--preset--color--contrast);
}

.porto-video-placeholder:not(:has(video))::after {
	content: "\f04b";
	position: absolute;
	inset: 50% auto auto 50%;
	display: grid;
	place-items: center;
	width: 4.5rem;
	height: 4.5rem;
	border-radius: 50%;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-size: 1.4rem;
	transform: translate(-50%, -50%);
}

.porto-page-gallery {
	gap: var(--wp--preset--spacing--20) !important;
}

.porto-page-gallery .wp-block-image img {
	aspect-ratio: 4 / 3;
	border-radius: var(--wp--custom--radius--medium);
	object-fit: cover;
}