/* WIHM Portfolio — filterable project grid + editorial 7/5 grid.
   Every colour is a custom property so the Elementor widget's Style tab can
   override it; the defaults below are the design's tokens. */

.wihm-pf {
	--wihm-accent: #E87532;
	--wihm-title: #1C1B18;
	--wihm-meta: #787165;
	--wihm-label: #A79A87;
	--wihm-image-bg: #EDE9E1;
	--wihm-badge-bg: rgba(250, 249, 246, 0.94);
	--wihm-badge: #1C1B18;
	--wihm-pill: #57534B;
	--wihm-pill-border: rgba(28, 27, 24, 0.16);
	--wihm-pill-active-bg: #1C1B18;
	--wihm-pill-active: #FAF9F6;
	--wihm-tab: #8C8477;
	--wihm-count: #8C8477;
	--wihm-paper: #FAF9F6;
	--wihm-cols: 3;
	--wihm-gap: 44px;
	--wihm-ratio: 4 / 3;
	--wihm-ease: cubic-bezier(.16, 1, .3, 1);
	width: 100%;
	min-width: 0;
}
.wihm-pf *, .wihm-pf *::before, .wihm-pf *::after { box-sizing: border-box; }

/* ---------------------------------------------------------- filters --- */
.wihm-pf__filters {
	display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
	padding: 0 0 14px;
}
.wihm-pf__tabs {
	display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px;
	padding: 14px 0 clamp(30px, 4vw, 52px);
	border-bottom: 1px solid rgba(28, 27, 24, 0.1);
}
.wihm-pf__pill, .wihm-pf__tab {
	font-family: inherit; font-size: 10.5px; line-height: 1.2; letter-spacing: .16em;
	text-transform: uppercase; font-weight: 600; cursor: pointer; margin: 0;
	border-radius: 0; box-shadow: none; -webkit-appearance: none; appearance: none;
	transition: background 350ms ease, color 350ms ease, border-color 350ms ease;
}
.wihm-pf__pill {
	padding: 13px 20px; background: transparent; color: var(--wihm-pill);
	border: 1px solid var(--wihm-pill-border);
}
.wihm-pf__pill:hover { border-color: var(--wihm-pill-active-bg); color: var(--wihm-pill-active-bg); }
.wihm-pf__pill.is-active {
	background: var(--wihm-pill-active-bg); color: var(--wihm-pill-active);
	border-color: var(--wihm-pill-active-bg);
}
.wihm-pf__tab {
	padding: 10px 4px; background: none; border: 0; color: var(--wihm-tab);
	border-bottom: 1px solid transparent;
}
.wihm-pf__tab:hover { color: var(--wihm-accent); }
.wihm-pf__tab.is-active { color: var(--wihm-accent); border-bottom-color: var(--wihm-accent); }
.wihm-pf__pill:focus-visible, .wihm-pf__tab:focus-visible,
.wihm-pf__card:focus-visible { outline: 2px solid var(--wihm-accent); outline-offset: 3px; }

.wihm-pf__count {
	margin: clamp(26px, 3vw, 42px) 0 clamp(22px, 2.6vw, 34px);
	font-size: 11px; letter-spacing: .2em; text-transform: uppercase; font-weight: 600;
	color: var(--wihm-count); font-variant-numeric: tabular-nums;
}
.wihm-pf__filters + .wihm-pf__grid,
.wihm-pf__tabs + .wihm-pf__grid { margin-top: clamp(26px, 3vw, 42px); }

/* ------------------------------------------------------------- grid --- */
.wihm-pf__grid {
	display: grid; align-items: start; gap: var(--wihm-gap);
	grid-template-columns: repeat(var(--wihm-cols), minmax(0, 1fr));
}
.wihm-pf__card {
	display: block; min-width: 0; text-decoration: none; color: inherit;
}
.wihm-pf__card.is-hidden, .wihm-pf__card[hidden] { display: none; }
.wihm-pf__frame {
	position: relative; display: block; overflow: hidden;
	aspect-ratio: var(--wihm-ratio); background: var(--wihm-image-bg);
}
.wihm-pf__frame img {
	position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
	display: block; margin: 0; max-width: none; border-radius: 0;
	transform: scale(1); transition: transform 1200ms var(--wihm-ease);
}
.wihm-pf__card:hover .wihm-pf__frame img,
.wihm-pf__card:focus-visible .wihm-pf__frame img { transform: scale(1.05); }
.wihm-pf__scrim {
	position: absolute; inset: 0; pointer-events: none;
	background: linear-gradient(180deg, rgba(28, 27, 24, 0) 45%, rgba(28, 27, 24, 0.42) 100%);
	opacity: .55; transition: opacity 600ms ease;
}
.wihm-pf__card:hover .wihm-pf__scrim { opacity: 1; }
.wihm-pf__badge {
	position: absolute; left: 14px; bottom: 14px;
	background: var(--wihm-badge-bg); color: var(--wihm-badge);
	font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase; font-weight: 700;
	line-height: 1.2; padding: 8px 12px;
	transition: background 400ms ease, color 400ms ease;
}
.wihm-pf__card:hover .wihm-pf__badge { background: var(--wihm-accent); color: var(--wihm-paper); }
.wihm-pf__arrow {
	position: absolute; right: 16px; bottom: 16px; font-size: 16px; line-height: 1;
	color: var(--wihm-paper); opacity: 0; transform: translateY(8px);
	transition: opacity 500ms ease, transform 600ms var(--wihm-ease);
}
.wihm-pf__card:hover .wihm-pf__arrow { opacity: 1; transform: translateY(0); }

.wihm-pf__body { display: block; padding: clamp(16px, 1.8vw, 24px) 0 0; }
.wihm-pf__title {
	margin: 0; padding: 0;
	font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 400;
	font-size: clamp(20px, 1.75vw, 27px); line-height: 1.15; letter-spacing: -.01em;
	color: var(--wihm-title); transition: color 400ms ease;
}
.wihm-pf__card:hover .wihm-pf__title { color: var(--wihm-accent); }
.wihm-pf__location {
	display: block; margin: 8px 0 0; font-size: 12.5px; font-weight: 300; line-height: 1.5;
	color: var(--wihm-meta);
}
.wihm-pf__service {
	display: block; margin: 6px 0 0; font-size: 10.5px; letter-spacing: .18em;
	text-transform: uppercase; font-weight: 600; line-height: 1.4; color: var(--wihm-label);
}

.wihm-pf__empty {
	margin: clamp(40px, 6vw, 90px) auto; text-align: center;
	font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 300;
	font-size: clamp(20px, 2.2vw, 30px); line-height: 1.3; color: #57534B;
}
.wihm-pf__empty[hidden] { display: none; }
.wihm-pf__empty a { color: var(--wihm-accent); text-decoration: none; border-bottom: 1px solid rgba(232, 117, 50, 0.4); }

/* ---------------------------------------------- featured (homepage) --- */
.wihm-pf--featured .wihm-pf__grid {
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: var(--wihm-gap);
}
.wihm-pf--featured .wihm-pf__card { grid-column: span var(--wihm-span, 6); }
.wihm-pf--featured .wihm-pf__frame { aspect-ratio: auto; height: clamp(280px, 32vw, 540px); }
.wihm-pf--featured .wihm-pf__scrim { background: rgba(28, 27, 24, 0.22); opacity: 0; }
.wihm-pf--featured .wihm-pf__card:hover .wihm-pf__scrim { opacity: 1; }
.wihm-pf--featured .wihm-pf__arrow { right: 22px; bottom: 22px; font-size: 17px; transform: translateY(10px); }
.wihm-pf--featured .wihm-pf__body {
	display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
	gap: 12px; padding-top: 20px;
}
.wihm-pf--featured .wihm-pf__title { font-size: clamp(20px, 1.8vw, 28px); line-height: 1.2; }
.wihm-pf__category {
	font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; font-weight: 600;
	color: #8C8477; line-height: 1.4;
}

@media (max-width: 899px) {
	.wihm-pf--featured .wihm-pf__grid { grid-template-columns: minmax(0, 1fr); }
	.wihm-pf--featured .wihm-pf__card { grid-column: auto; }
	.wihm-pf--featured .wihm-pf__frame { height: clamp(230px, 62vw, 430px); }
}

@media (prefers-reduced-motion: reduce) {
	.wihm-pf *, .wihm-pf *::before, .wihm-pf *::after { transition: none !important; }
}
