/* ============================================================
   SICO Project Single — component styles only.
   Outer layout (sections, rows, column ratios, full-width)
   is handled by Divi modules in the TB body template.
   ============================================================ */

.sico-project__panel,
.sico-project__gallery {
	font-family: "Open Sans", Roboto, "Helvetica Neue", Arial, sans-serif;
	color: #1f1f1f;
}

/* ---------- Side panels (products + salesperson) ---------- */

.sico-project__panel {
	background: transparent;
	padding: 0;
}
.sico-project__panel + .sico-project__panel {
	margin-top: 32px;
	padding-top: 32px;
	border-top: 1px solid #e5e5e5;
}

/* Panel heading: refined eyebrow style — no border-bottom, smaller,
   slightly less heavy, sentence-case-friendly tracking. Replaces the
   previous "boxed h2 with underline" treatment.
   `!important` on size/family/line-height to defeat Divi's
   `.et-db #et-boc .et-l h2` typography (1,1,2 specificity). */
.sico-project__panel-title {
	font-family: "Open Sans", Roboto, "Helvetica Neue", Arial, sans-serif !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #d20f26;                /* SICO red — matches the eyebrow on archive headers */
	margin: 0 0 14px;
	padding: 0;
}

/* ---------- Products list ---------- */

.sico-project__product-list {
	/* `!important` + `padding-left: 0` to defeat Divi's `.et-db #et-boc .et-l ul`
	   default bullet markers and indent. */
	list-style: none !important;
	list-style-type: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
.sico-project__product-item {
	list-style: none !important;
	list-style-type: none !important;
	margin: 0;
}
.sico-project__product-item + .sico-project__product-item {
	border-top: 1px solid #e5e5e5;
}
.sico-project__product-link {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 0;
	color: #1f1f1f;
	text-decoration: none;
	transition: color 120ms ease;
}
.sico-project__product-link:hover {
	color: #d20f26;
}
.sico-project__product-thumb {
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	background: #fff center/contain no-repeat;
	border: 1px solid #e5e5e5;
	border-radius: 4px;
}
.sico-project__product-name {
	flex: 1 1 auto;
	font: 400 14px/1.35 inherit;
}
.sico-project__product-arrow {
	flex: 0 0 auto;
	font-size: 16px;
	color: inherit;
	transition: transform 220ms ease;
}
.sico-project__product-link:hover .sico-project__product-arrow {
	transform: translateX(4px);
}

/* ---------- Salesperson tile — wrapped card, square photo, 10px radius ---------- */

.sico-project__panel--salesperson {
	background: #fff;
	border: 1px solid #aaa;
	border-radius: 10px;
	overflow: hidden;
	padding: 0;
}
/* Override the cross-panel divider when the salesperson tile follows the
   products panel — the tile's own border + padding handle the visual break. */
.sico-project__panel + .sico-project__panel--salesperson {
	margin-top: 32px;
	padding-top: 0;
	border-top: 0;
}

.sico-project__sales-photo {
	width: 100%;
	/* Fixed pixel height (not aspect-ratio) so the panel's proportions
	   don't shift with column width. Photos are transparent cutouts: the
	   person sits at a constant 160px against a soft grey backdrop with
	   a thin SICO-red rule tying back to the brand. Same look on every
	   screen size. */
	height: 200px;
	background-color: #ebebeb;
	background-size: auto 160px;
	background-position: center bottom;
	background-repeat: no-repeat;
	border-radius: 0;
	margin: 0;
	border-bottom: 2px solid #d62445;
}

.sico-project__sales-body {
	padding: 18px 20px 20px;
}
.sico-project__panel--salesperson .sico-project__panel-title {
	margin: 0 0 10px;
}
.sico-project__sales-name {
	/* `!important` to beat Divi's h3 rule (which renders larger and in
	   Roboto). Same fight as the panel title above. */
	font-family: "Open Sans", Roboto, "Helvetica Neue", Arial, sans-serif !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	color: #1f1f1f;
	margin: 0 0 4px;
	padding: 0;
}
.sico-project__sales-position,
.sico-project__sales-region {
	/* Position + region are joined values — keep them visually adjacent.
	   Divi's stylesheet sets `p { padding-bottom: 1em }` (not margin),
	   so we zero out BOTH margin and padding to actually close the gap.
	   `!important` is needed for the padding side because Divi's rule
	   wins on specificity. */
	font-size: 13px !important;
	line-height: 1.3 !important;
	margin: 0 !important;
	padding: 0 !important;
}
.sico-project__sales-position {
	font-weight: 600;
	color: #1f1f1f;
}
.sico-project__sales-region {
	font-weight: 400;
	color: #666;
	padding-bottom: 12px !important;       /* gap before the bio block */
}
.sico-project__sales-bio {
	font: 400 12px/1.55 inherit;
	color: #444;
}
/* Divi's body-text rule (`.et-db #et-boc .et-l p`, 1,1,2) beats the class
   selector above; bump per-property with !important so the bio reads at
   the smaller size we want. */
.sico-project__sales-bio,
.sico-project__sales-bio p {
	font-size: 12px !important;
	line-height: 1.55 !important;
}
.sico-project__sales-bio p {
	margin: 0 0 0.75em;
}
.sico-project__sales-bio p:last-child { margin-bottom: 0; }

/* ---------- Projects archive hero slideshow ----------
   Mirrors the fade-cycle used by the sico_archive_hero module on
   term archives, with per-count keyframes so a small slide set
   doesn't have a dark gap mid-cycle. */
.sico-projects-hero__slideshow {
	position: relative;
	width: 100%;
	aspect-ratio: 21 / 9;      /* cinematic — matches sico_archive_hero */
	min-height: 220px;
	overflow: hidden;
	background: #0a0a0a;
	border-radius: 0;
}
/* Dual gradient overlay — strong left bleed dissolves the image into the
   dark hero column to its left, soft right edge softens the cropped
   right against any wider page background. Same pattern as the term
   archive hero. */
.sico-projects-hero__slideshow::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(
			90deg,
			rgba(10, 10, 10, 1) 0%,
			rgba(10, 10, 10, 0.85) 18%,
			rgba(10, 10, 10, 0.5) 38%,
			rgba(10, 10, 10, 0) 60%
		),
		linear-gradient(
			270deg,
			rgb(10 10 10) 0%,
			rgba(10, 10, 10, 0.15) 12%,
			rgba(10, 10, 10, 0) 28%
		);
	pointer-events: none;
	z-index: 2;
}
@media (max-width: 768px) {
	.sico-projects-hero__slideshow {
		aspect-ratio: 16 / 9;
		min-height: 200px;
	}
}
.sico-projects-hero__slides {
	list-style: none;
	margin: 0;
	padding: 0;
	position: absolute;
	inset: 0;
}
.sico-projects-hero__slide {
	position: absolute;
	inset: 0;
	margin: 0;
	padding: 0;
	opacity: 0;
	animation-duration: var(--sico-hero-total, 20s);
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	animation-fill-mode: both;
	animation-delay: calc(var(--i, 0) * var(--sico-hero-step, 4s));
	animation-name: sico-projects-hero-fade-5;
}
.sico-projects-hero__slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.sico-projects-hero__slideshow[data-count="1"] .sico-projects-hero__slide { animation-name: sico-projects-hero-fade-1; }
.sico-projects-hero__slideshow[data-count="2"] .sico-projects-hero__slide { animation-name: sico-projects-hero-fade-2; }
.sico-projects-hero__slideshow[data-count="3"] .sico-projects-hero__slide { animation-name: sico-projects-hero-fade-3; }
.sico-projects-hero__slideshow[data-count="4"] .sico-projects-hero__slide { animation-name: sico-projects-hero-fade-4; }
.sico-projects-hero__slideshow[data-count="5"] .sico-projects-hero__slide { animation-name: sico-projects-hero-fade-5; }
.sico-projects-hero__slideshow[data-count="6"] .sico-projects-hero__slide { animation-name: sico-projects-hero-fade-6; }

@keyframes sico-projects-hero-fade-1 { 0%, 100% { opacity: 1; } }
@keyframes sico-projects-hero-fade-2 {
	0%        { opacity: 0; }
	3%, 50%   { opacity: 1; }
	53%, 100% { opacity: 0; }
}
@keyframes sico-projects-hero-fade-3 {
	0%             { opacity: 0; }
	3%, 33.33%     { opacity: 1; }
	36.33%, 100%   { opacity: 0; }
}
@keyframes sico-projects-hero-fade-4 {
	0%        { opacity: 0; }
	3%, 25%   { opacity: 1; }
	28%, 100% { opacity: 0; }
}
@keyframes sico-projects-hero-fade-5 {
	0%        { opacity: 0; }
	3%, 20%   { opacity: 1; }
	23%, 100% { opacity: 0; }
}
@keyframes sico-projects-hero-fade-6 {
	0%             { opacity: 0; }
	3%, 16.67%     { opacity: 1; }
	19.67%, 100%   { opacity: 0; }
}

/* ---------- Projects archive hero (page /projects/) ---------- */

.sico-projects-hero {
	font-family: "Open Sans", Roboto, Arial, sans-serif;
	color: #fff;
}
/* Vertically center the hero copy against the slideshow column. */
.et_pb_row:has(.sico-projects-hero) {
	display: flex !important;
	align-items: center;
}
.et_pb_row:has(.sico-projects-hero) > .et_pb_column {
	float: none;
}
@media (max-width: 980px) {
	.et_pb_row:has(.sico-projects-hero) {
		flex-direction: column;
	}
}
.sico-projects-hero__eyebrow {
	display: block;
	font: 700 12px/1 "Open Sans", Roboto, Arial, sans-serif;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #d20f26;
	margin: 0 0 14px;
}
/* `:where()` keeps specificity neutral; pair with the Divi-rooted
   selector to match (1,1,2) and win on source order. The combined
   `!important` properties handle anything still climbing above. */
.sico-projects-hero__title,
.et-db #et-boc .et-l h1.sico-projects-hero__title {
	font-family: "Bayon", "Open Sans", sans-serif !important;
	font-size: 64px !important;
	line-height: 1em !important;
	font-weight: 400 !important;
	letter-spacing: 0.02em !important;
	text-transform: uppercase !important;
	color: #fff !important;
	margin: 0 0 18px !important;
	padding: 0 !important;
}
.sico-projects-hero__intro {
	font: 400 15px/1.6 "Open Sans", Roboto, Arial, sans-serif !important;
	color: #a8acb2 !important;
	max-width: 640px;
	margin: 0 !important;
	padding: 0 !important;
}
@media (max-width: 768px) {
	.sico-projects-hero__title,
	.et-db #et-boc .et-l h1.sico-projects-hero__title {
		font-size: 44px !important;
	}
}

/* ---------- Inline meta strip ([sico_project_meta]) ----------
   Used inside Postmaster card 8 (Project Row) on /projects/. Tile is
   dark — labels are red eyebrows stacked above their value text, no
   awkward column alignment. Each row reads as a label/value pair. */
.sico-project-meta {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
	margin: 0;
	padding: 0;
	font-family: "Open Sans", Roboto, "Helvetica Neue", Arial, sans-serif;
	color: #d8d8d8;
}
.sico-project-meta__row {
	display: block;
	padding: 0;
	border: 0;
	margin: 0;
}
.sico-project-meta__label {
	display: block;
	font-size: 10px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #d20f26;
	margin: 0 0 4px !important;
	padding: 0 !important;
}
.sico-project-meta__value {
	display: block;
	color: #d8d8d8;
	font-size: 14px !important;
	line-height: 1.4 !important;
	font-weight: 400 !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* ---------- Gallery (auto-scroll marquee) ----------
   Images preserve their natural aspect ratio (fixed height + auto width).
   The slide list is rendered twice in markup; the track scrolls
   `translateX(0 → -50%)` continuously, so the second copy is exactly
   where the first started — a seamless loop even with only a couple of
   images. Hover pauses so a visitor can read a label or click a slide.
   The `.sico-project__gallery` wrapper sits inside a Divi
   fullwidth-row in the TB body layout, so its background stretches
   edge-to-edge. */

.sico-project__gallery {
	background: #eeeeee;
	overflow: hidden;
}
.sico-project__gallery-grid {
	list-style: none !important;
	list-style-type: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: flex;
	gap: 16px;
	width: max-content;        /* let the track be as wide as its contents */
	animation: sico-gallery-scroll 60s linear infinite;
}
/* Pause on hover and on focus-within so users can read / click slides. */
.sico-project__gallery:hover .sico-project__gallery-grid,
.sico-project__gallery:focus-within .sico-project__gallery-grid {
	animation-play-state: paused;
}
.sico-project__gallery-item {
	list-style: none !important;
	list-style-type: none !important;
	flex: 0 0 auto;
	margin: 0;
	height: 320px;             /* fixed height — image width derives from aspect */
	background: transparent;
	overflow: hidden;
	position: relative;        /* anchor for the slide-up caption */
}
.sico-project__gallery-img {
	display: block;
	height: 100%;
	width: auto;               /* preserve image's natural aspect ratio */
}

/* Slide-up caption pulled from the attachment's media-library description.
   Sits below the image at idle (translateY 100%) and slides up to cover
   the lower portion on hover. */
.sico-project__gallery-caption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 12px 16px;
	background: rgba(15, 15, 15, 0.78);
	color: #fff;
	font: 400 13px/1.4 "Open Sans", Roboto, "Helvetica Neue", Arial, sans-serif;
	transform: translateY(100%);
	transition: transform 320ms ease;
	pointer-events: none;      /* purely informational; doesn't block image */
	max-height: 60%;
	overflow: hidden;
}
.sico-project__gallery-item:hover .sico-project__gallery-caption {
	transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
	.sico-project__gallery-caption {
		transition: none;
	}
}

@keyframes sico-gallery-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }   /* second copy slots in seamlessly */
}

/* ---------- Responsive ---------- */

@media (max-width: 768px) {
	.sico-project__gallery-grid { gap: 12px; }
	.sico-project__gallery-item { height: 220px; }
}
@media (max-width: 480px) {
	.sico-project__gallery-item { height: 180px; }
}

/* Respect users who've asked the system not to animate. */
@media (prefers-reduced-motion: reduce) {
	.sico-project__gallery-grid {
		animation: none;
	}
	.sico-project__gallery {
		overflow-x: auto;       /* fallback to manual horizontal scroll */
	}
}

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

/* Reuse the .sico-projects-hero layout/centering for the contact hero —
   same dark cinematic block, just without the slideshow column. The
   row-flex centering rule below covers both heroes. */
.et_pb_row:has(.sico-contact-hero) {
	display: flex !important;
	align-items: center;
	min-height: 320px;
}
.et_pb_row:has(.sico-contact-hero) > .et_pb_column {
	float: none;
}
@media (max-width: 980px) {
	.et_pb_row:has(.sico-contact-hero) {
		flex-direction: column;
		min-height: auto;
	}
}

/* Hero section — full-bleed background image with a strong left-to-right
   gradient bleed so the copy stays readable, and a 2px red rule at the
   very top to anchor it to the brand palette. */
.et_pb_section:has(.sico-contact-hero) {
	position: relative;
	background-color: #0a0a0a;
	background-image:
		linear-gradient(90deg, rgba(10,10,10,1) 0%, rgba(10,10,10,0.92) 28%, rgba(10,10,10,0.55) 55%, rgba(10,10,10,0.15) 85%, rgba(10,10,10,0) 100%),
		url("https://sicosp.com.au/wp-content/uploads/2021/05/sico-australia.jpg");
	background-size: cover;
	background-position: center right;
	background-repeat: no-repeat;
	border-top: 2px solid #d20f26 !important;
}
@media (max-width: 980px) {
	.et_pb_section:has(.sico-contact-hero) {
		background-image:
			linear-gradient(180deg, rgba(10,10,10,0.85) 0%, rgba(10,10,10,0.92) 100%),
			url("https://sicosp.com.au/wp-content/uploads/2021/05/sico-australia.jpg");
		background-position: center;
	}
}

.sico-contact-hero {
	font-family: "Open Sans", Roboto, Arial, sans-serif;
	color: #fff;
	position: relative;
	z-index: 1;
}
.sico-contact-hero__eyebrow {
	display: block;
	font: 700 12px/1 "Open Sans", Roboto, Arial, sans-serif;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #d20f26;
	margin: 0 0 14px;
}
.sico-contact-hero__title,
.et-db #et-boc .et-l h1.sico-contact-hero__title {
	font-family: "Bayon", "Open Sans", sans-serif !important;
	font-size: 64px !important;
	line-height: 1em !important;
	font-weight: 400 !important;
	letter-spacing: 0.02em !important;
	text-transform: uppercase !important;
	color: #fff !important;
	margin: 0 0 18px !important;
	padding: 0 !important;
}
.sico-contact-hero__intro {
	font: 400 15px/1.6 "Open Sans", Roboto, Arial, sans-serif !important;
	color: #a8acb2 !important;
	max-width: 640px;
	margin: 0 !important;
	padding: 0 !important;
}
@media (max-width: 768px) {
	.sico-contact-hero__title,
	.et-db #et-boc .et-l h1.sico-contact-hero__title {
		font-size: 44px !important;
	}
}

/* Details list — matches .sico-project-meta visual rhythm so the
   contact page reads as part of the same family. */
.sico-contact-details {
	display: grid;
	gap: 22px;
	margin: 0;
}
.sico-contact-details__row {
	display: grid;
	gap: 4px;
}
.sico-contact-details__label {
	display: block;
	font: 700 11px/1 "Open Sans", Roboto, Arial, sans-serif;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #d20f26;
}
.sico-contact-details__value {
	font: 400 16px/1.55 "Open Sans", Roboto, Arial, sans-serif;
	color: #1f1f1f;
}
.sico-contact-details__value a {
	color: #1f1f1f;
	text-decoration: none;
	border-bottom: 1px solid rgba(31, 31, 31, 0.2);
	transition: color 150ms ease, border-color 150ms ease;
}
.sico-contact-details__value a:hover,
.sico-contact-details__value a:focus {
	color: #d20f26;
	border-bottom-color: #d20f26;
}
.sico-contact-details__sub {
	display: block;
	margin-top: 4px;
	font-size: 13px;
	color: #6a6f77;
}
.sico-contact-details__sub a {
	color: inherit;
	border-bottom-color: rgba(106, 111, 119, 0.3);
}

/* Form panel — wraps the [gravityform ...] embed so we can theme GF
   fields without bleeding into other forms on the site. */
.sico-contact-form {
	background: #fff;
	border: 1px solid #e5e5e5;
	border-radius: 10px;
	padding: 32px;
}
.sico-contact-form__heading {
	font-family: "Bayon", "Open Sans", sans-serif;
	font-size: 28px;
	line-height: 1;
	font-weight: 400;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: #1f1f1f;
	margin: 0 0 20px;
}
.sico-contact-form .gform_wrapper {
	margin: 0;
}
.sico-contact-form .gform_wrapper form,
.sico-contact-form .gform_wrapper .gform_fields {
	margin: 0;
}
.sico-contact-form .gform_wrapper .gfield_label {
	font: 700 11px/1 "Open Sans", Roboto, Arial, sans-serif !important;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #6a6f77;
	margin: 0 0 8px;
}
.sico-contact-form .gform_wrapper input[type="text"],
.sico-contact-form .gform_wrapper input[type="email"],
.sico-contact-form .gform_wrapper input[type="tel"],
.sico-contact-form .gform_wrapper input[type="url"],
.sico-contact-form .gform_wrapper input[type="number"],
.sico-contact-form .gform_wrapper select,
.sico-contact-form .gform_wrapper textarea {
	width: 100%;
	background: #fafafa;
	border: 1px solid #e2e2e2;
	border-radius: 6px;
	padding: 12px 14px;
	font: 400 15px/1.4 "Open Sans", Roboto, Arial, sans-serif;
	color: #1f1f1f;
	transition: border-color 150ms ease, background 150ms ease, box-shadow 150ms ease;
}
.sico-contact-form .gform_wrapper input:focus,
.sico-contact-form .gform_wrapper select:focus,
.sico-contact-form .gform_wrapper textarea:focus {
	outline: none;
	background: #fff;
	border-color: #d20f26;
	box-shadow: 0 0 0 3px rgba(210, 15, 38, 0.12);
}
.sico-contact-form .gform_wrapper textarea {
	min-height: 130px;
	resize: vertical;
}
.sico-contact-form .gform_footer,
.sico-contact-form .gform_wrapper .gform_footer {
	margin: 22px 0 0 !important;
	padding: 0 !important;
}
.sico-contact-form .gform_button,
.sico-contact-form input[type="submit"].gform_button,
.sico-contact-form .gform_wrapper .gform_footer input[type="submit"] {
	background: #d20f26;
	color: #fff;
	border: 0;
	border-radius: 999px;
	padding: 14px 30px !important;
	font-family: "Bayon", "Open Sans", sans-serif !important;
	font-size: 18px !important;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background 150ms ease, transform 150ms ease;
}
.sico-contact-form .gform_button:hover,
.sico-contact-form input[type="submit"].gform_button:hover,
.sico-contact-form .gform_wrapper .gform_footer input[type="submit"]:hover {
	background: #b30c20;
}
.sico-contact-form .gform_wrapper .gform_required_legend,
.sico-contact-form .gfield_required {
	color: #d20f26;
}
.sico-contact-form .gform_confirmation_message {
	font: 400 15px/1.6 "Open Sans", Roboto, Arial, sans-serif;
	color: #1f1f1f;
}
.sico-contact-form .validation_error,
.sico-contact-form .gform_wrapper .validation_message {
	color: #d20f26;
	font-size: 13px;
}

@media (max-width: 768px) {
	.sico-contact-form { padding: 22px; }
}

/* ---------- SICO Global (offices grid) ---------- */

.sico-contact-global {
	margin: 0;
}
.sico-contact-global__header {
	max-width: 720px;
	margin: 0 0 36px;
}
.sico-contact-global__eyebrow {
	display: block;
	font: 700 12px/1 "Open Sans", Roboto, Arial, sans-serif;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #d20f26;
	margin: 0 0 12px;
}
.sico-contact-global__title,
.et-db #et-boc .et-l h2.sico-contact-global__title {
	font-family: "Bayon", "Open Sans", sans-serif !important;
	font-size: 44px !important;
	line-height: 1.05 !important;
	font-weight: 400 !important;
	letter-spacing: 0.02em !important;
	text-transform: uppercase !important;
	color: #1f1f1f !important;
	margin: 0 0 12px !important;
	padding: 0 !important;
}
.sico-contact-global__title sup {
	font-size: 0.45em;
	top: -0.7em;
	margin-left: 0.05em;
	font-weight: 400;
}
.sico-contact-global__intro {
	font: 400 15px/1.6 "Open Sans", Roboto, Arial, sans-serif !important;
	color: #6a6f77 !important;
	margin: 0 !important;
	padding: 0 !important;
}
.sico-contact-global__grid {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 18px;
}
.sico-contact-global__office {
	list-style: none !important;
	margin: 0;
	padding: 22px 22px 24px;
	background: #fff;
	border: 1px solid #e5e5e5;
	border-radius: 8px;
	transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}
.sico-contact-global__office:hover {
	border-color: #d8d8d8;
	box-shadow: 0 6px 18px rgba(15, 15, 15, 0.06);
	transform: translateY(-1px);
}
.sico-contact-global__region {
	display: block;
	font: 700 11px/1 "Open Sans", Roboto, Arial, sans-serif;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #d20f26;
	margin: 0 0 10px;
}
.sico-contact-global__name,
.et-db #et-boc .et-l h3.sico-contact-global__name {
	font-family: "Open Sans", Roboto, Arial, sans-serif !important;
	font-size: 15px !important;
	line-height: 1.35 !important;
	font-weight: 700 !important;
	color: #1f1f1f !important;
	margin: 0 0 12px !important;
	padding: 0 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}
.sico-contact-global__lines {
	font: 400 13px/1.55 "Open Sans", Roboto, Arial, sans-serif;
	font-style: normal;
	color: #4a4f57;
	display: grid;
	gap: 2px;
}
.sico-contact-global__lines span {
	display: block;
}

@media (max-width: 768px) {
	.sico-contact-global__title,
	.et-db #et-boc .et-l h2.sico-contact-global__title {
		font-size: 34px !important;
	}
	.sico-contact-global__grid {
		grid-template-columns: 1fr;
	}
}

/* ---------- Team grid (/about/ — Postmaster grid 3) ----------
   Restyle the team cards to match the project / contact visual
   language without modifying the underlying card config. Scoped to
   .wpgb-grid-3 so it doesn't affect other Postmaster grids. */

.wpgb-grid-3 .wpgb-card {
	background: transparent;
}
.wpgb-grid-3 .wpgb-card .wpgb-card-inner {
	background: #ffffff !important;
	border: 1px solid #e5e5e5 !important;
	border-radius: 10px !important;
	overflow: hidden !important;
	transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}
.wpgb-grid-3 .wpgb-card:hover .wpgb-card-inner {
	border-color: #d8d8d8 !important;
	box-shadow: 0 6px 18px rgba(15, 15, 15, 0.06);
	transform: translateY(-1px);
}
.wpgb-grid-3 .wpgb-card .wpgb-card-media,
.wpgb-grid-3 .wpgb-card .wpgb-card-media-thumbnail {
	background: #f4f4f4 !important;
}
.wpgb-grid-3 .wpgb-card .wpgb-card-content {
	padding: 24px 26px 28px !important;
	background: #ffffff !important;
}
.wpgb-grid-3 .wpgb-card .wpgb-card-body {
	padding: 0 !important;
	background: #ffffff !important;
}
/* Name — Bayon uppercase, dark, sized like project card titles. */
.wpgb-grid-3 .wpgb-card .wpgb-block-1,
.et-db #et-boc .et-l .wpgb-grid-3 .wpgb-card h3.wpgb-block-1 {
	font-family: "Bayon", "Open Sans", sans-serif !important;
	font-size: 26px !important;
	line-height: 1.05 !important;
	font-weight: 400 !important;
	letter-spacing: 0.02em !important;
	text-transform: uppercase !important;
	color: #1f1f1f !important;
	margin: 0 0 10px !important;
	padding: 0 !important;
}
/* Position — red eyebrow tracked uppercase, mirrors project meta labels. */
.wpgb-grid-3 .wpgb-card .wpgb-block-4 {
	font: 700 11px/1.2 "Open Sans", Roboto, Arial, sans-serif !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	color: #d20f26 !important;
	margin: 0 0 6px !important;
	padding: 0 !important;
}
/* Region — quiet sub-line under the eyebrow. */
.wpgb-grid-3 .wpgb-card .wpgb-block-3 {
	font: 400 13px/1.5 "Open Sans", Roboto, Arial, sans-serif !important;
	color: #6a6f77 !important;
	margin: 0 0 16px !important;
	padding: 0 !important;
}
/* Bio — body copy. */
.wpgb-grid-3 .wpgb-card .wpgb-block-2,
.wpgb-grid-3 .wpgb-card .wpgb-block-2 p {
	font: 400 14px/1.6 "Open Sans", Roboto, Arial, sans-serif !important;
	color: #4a4f57 !important;
	margin: 0 !important;
	padding: 0 !important;
}
.wpgb-grid-3 .wpgb-card .wpgb-block-2 p + p {
	margin-top: 12px !important;
}
/* Block order — keep the position eyebrow ABOVE the name for the
   project-meta rhythm, with name as the dominant element. */
.wpgb-grid-3 .wpgb-card .wpgb-card-body {
	display: flex !important;
	flex-direction: column !important;
}
.wpgb-grid-3 .wpgb-card .wpgb-block-1 { order: 2; }
.wpgb-grid-3 .wpgb-card .wpgb-block-4 { order: 1; }
.wpgb-grid-3 .wpgb-card .wpgb-block-3 { order: 3; }
.wpgb-grid-3 .wpgb-card .wpgb-block-2 { order: 4; }