/*
 * The Art Concierge – design refinements (v3).
 *
 * Loaded after style.css. Keeps the existing black & white, Playfair + Montserrat
 * direction and tightens it: one font stack, one hairline, consistent buttons,
 * accessible focus states, the GSAP menu and the page transition curtain.
 */

:root {
	--tac-ink: #000;
	--tac-paper: #fff;
	--tac-mist: #f5f5f5;
	--tac-muted: #8a8a8a;
	--tac-line: rgba(0, 0, 0, .18);
	--tac-ease: cubic-bezier(.19, 1, .22, 1);
	--tac-gutter: clamp(16px, 3vw, 48px);
}

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

/* style.css set Montserrat on body, then the underscores reset overrode it with the
   system stack. Restore the intended type everywhere. */
body,
button,
input,
optgroup,
select,
textarea {
	font-family: var(--font-sans);
	color: var(--tac-ink);
}

body {
	background: var(--tac-paper);
	text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
.c-heading {
	font-family: var(--font-serif);
	font-weight: 400;
	letter-spacing: -.01em;
	text-wrap: balance;
}

p {
	text-wrap: pretty;
}

img,
video {
	max-width: 100%;
}

::selection {
	background: var(--tac-ink);
	color: var(--tac-paper);
}

:focus-visible {
	outline: 1px solid currentColor;
	outline-offset: 4px;
}

.overlay a:focus-visible,
.overlay button:focus-visible {
	outline: 1px solid #fff !important;
	outline-offset: 4px;
}

.nothing-found {
	text-align: center;
	color: var(--tac-muted);
}

/* ---------- Lenis ---------- */

html.lenis,
html.lenis body {
	height: auto;
}

.lenis:not(.lenis-autoToggle).lenis-stopped {
	overflow: clip;
}

.lenis.lenis-smooth [data-lenis-prevent] {
	overscroll-behavior: contain;
}

html.lenis.lenis-smooth {
	scroll-behavior: auto !important;
}

/* ---------- Header ---------- */

header#masthead {
	transition: background-color .5s var(--tac-ease), border-color .5s var(--tac-ease);
}

.site-branding.col-md-4 a {
	display: inline-block;
	font-size: clamp(14px, 1.15vw, 18px);
	line-height: 1.1;
	letter-spacing: .04em;
}

.site-branding.col-md-4 a span {
	display: block;
	margin-top: 2px;
	font-size: 11px;
	letter-spacing: .12em;
}

/* The menu toggle is now a real <button>. */
.openmnew,
.overlay .closebtn {
	appearance: none;
	background: none;
	border: 0;
	border-radius: 0;
	padding: 0;
	margin: 0;
	color: inherit;
	cursor: pointer;
	text-transform: none;
}

.openmnew {
	float: right;
	padding: 15px 0;
	font-size: 1.25rem;
	font-weight: 400;
	letter-spacing: -.02em;
	line-height: 1;
}

.overlay .closebtn {
	color: #fff;
	line-height: 1;
	top: 18px;
	right: var(--tac-gutter);
	transition: transform .6s var(--tac-ease);
}

.overlay .closebtn:hover {
	transform: rotate(90deg);
}

/* ---------- Overlay menu (opened by GSAP) ---------- */

.overlay {
	height: 100vh;
	height: 100dvh;
	z-index: 10000;
	visibility: hidden;
	clip-path: inset(0 0 100% 0);
	overflow-y: auto;
	transition: none;
}

.overlay.is-open {
	visibility: visible;
}

.videomenu video {
	object-fit: cover;
	border-radius: 2px;
}

/* ---------- Buttons ---------- */

a.mainbtn,
input.wpcf7-submit {
	position: relative;
	z-index: 0;
	display: inline-flex;
	align-items: center;
	gap: .5em;
	padding: 12px 26px;
	border: 1px solid var(--tac-ink);
	border-radius: 999px;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .14em;
	text-transform: uppercase;
	line-height: 1.2;
	transition: color .45s var(--tac-ease);
}

a.mainbtn:after {
	transition: border-radius .45s var(--tac-ease), transform .6s var(--tac-ease);
}

/* ---------- Hairline ---------- */

/* One line for the whole site: footer, contact form, section dividers. */
.tac-line,
.tac-animate-line-horizontal,
.line-hori {
	display: block;
	width: 100%;
	height: 1px;
	background: var(--tac-ink);
	transform-origin: left center;
	will-change: transform;
}

.servicedescriptions .tac-animate-line-horizontal {
	height: 1px;
}

/* Hide lines until GSAP takes over, with a CSS fallback if it never does. */
.js .tac-line:not(.is-ready),
.js .tac-animate-line-horizontal:not(.is-ready),
.js .line-hori:not(.is-ready) {
	transform: scaleX(0);
	animation: tac-show-line 0s 2.5s forwards;
}

@keyframes tac-show-line {
	to {
		transform: none;
	}
}

/* ---------- Section headings (GSAP SplitText) ---------- */

.js .section-heading:not(.is-split) {
	opacity: 0;
	animation: tac-show 0s 2.5s forwards;
}

@keyframes tac-show {
	to {
		opacity: 1;
	}
}

.eyebrow-heading-line-mask,
.eyebrow-heading-line {
	overflow: hidden;
}

.eyebrow-heading-line {
	padding-bottom: .06em;
	margin-bottom: -.06em;
}

/* ---------- Parallax frames ---------- */

.videoarthomess,
.extragallgts {
	position: relative;
	overflow: hidden;
}

[data-parallax] {
	will-change: transform;
}

/* ---------- Hover image reveal ---------- */

.hover-reveal {
	top: 0;
	left: 0;
	z-index: 50;
	pointer-events: none;
}

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

/* Four columns that share the artist grid; every row sits on a hairline. */
footer#colophon {
	overflow: hidden;
}

footer#colophon .footer-intro {
	max-width: 22em;
	margin: 0 0 clamp(2.5rem, 5vw, 4.5rem);
	font-family: var(--font-serif) !important;
	font-size: clamp(1.5rem, 2.4vw, 2.5rem);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: -.01em;
}

footer#colophon .tac-line {
	background: var(--tac-line);
}

.footer-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: var(--tac-gap);
	row-gap: 2rem;
	padding: 1.1rem 0;
}

@media (min-width: 768px) {
	.footer-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

.footer-col {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: .35rem;
	font-size: 14px;
	line-height: 1.5;
}

.footer-label {
	display: block;
	margin-bottom: .6rem;
	color: var(--tac-muted);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: .2em;
	text-transform: uppercase;
}

footer#colophon .footer-grid a {
	max-width: 100%;
	margin: 0;
	color: var(--tac-ink);
	overflow-wrap: anywhere;
}

@media (max-width: 767px) {
	.footer-col {
		font-size: 13px;
	}
}

footer#colophon address {
	margin: 0;
	font-style: normal;
	text-transform: uppercase;
}

.footer-clocks {
	align-items: baseline;
	padding: 1.25rem 0;
	font-size: 14px;
	font-variant-numeric: tabular-nums;
	letter-spacing: .06em;
}

.footer-clocks .footer-label {
	margin: 0;
}

.footer-bottom {
	align-items: baseline;
	font-size: 11px;
	letter-spacing: .1em;
	text-transform: uppercase;
}

@media (min-width: 768px) {
	.footer-bottom__copy {
		grid-column: span 2;
	}
}

@media (max-width: 767px) {
	.footer-bottom__copy {
		grid-column: 1 / -1;
	}
}

footer#colophon small {
	display: none;
	padding-bottom: 1rem;
	font-size: 11px;
}

.page-template-contactpage footer#colophon small {
	display: block;
}

/* Full-width signature; the SVG stretches the letter spacing to the grid edges. */
.footer-wordmark {
	margin-top: clamp(2rem, 5vw, 4rem);
	line-height: 0;
	overflow: hidden;
}

.footer-wordmark svg {
	display: block;
	width: 100%;
	height: auto;
	overflow: visible;
}

.footer-wordmark text {
	fill: var(--tac-ink);
	font-family: var(--font-serif);
	font-size: 96px;
	font-weight: 400;
}

/* ---------- Page transition curtain ---------- */

.page-transition {
	position: fixed;
	inset: 0;
	z-index: 100000;
	pointer-events: none;
	visibility: hidden;
}

.page-transition__panel {
	position: absolute;
	inset: 0;
	background: var(--tac-ink);
	transform: scaleY(0);
	transform-origin: 50% 100%;
}

.page-transition__brand {
	position: absolute;
	top: 50%;
	left: 50%;
	translate: -50% -50%;
	color: #fff;
	font-family: var(--font-sans);
	font-size: clamp(14px, 1.4vw, 20px);
	font-weight: 600;
	letter-spacing: .08em;
	line-height: 1.2;
	text-align: center;
	white-space: nowrap;
	opacity: 0;
	visibility: hidden;
}

.page-transition__brand span {
	display: block;
	margin-top: 4px;
	font-size: 11px;
	font-weight: 400;
	letter-spacing: .3em;
	opacity: .7;
}

/* Covered on arrival; JS lifts the curtain. Safety net if JS never runs. */
html.is-entering .page-transition {
	visibility: visible;
	animation: tac-uncover 0s 3s forwards;
}

html.is-entering .page-transition__panel {
	transform: scaleY(1);
}

html.is-entering .page-transition__brand {
	opacity: 1;
	visibility: visible;
}

@keyframes tac-uncover {
	to {
		visibility: hidden;
	}
}

/* ---------- Page specific ---------- */

@media (max-width: 800px) {
	.aboutuspagehoer {
		padding-top: 80px;
	}
}

.aboutuspagehoer img {
	display: block;
	max-width: 100%;
	border-radius: 0;
}

.single-artist .entry-gallery {
	margin-top: clamp(3rem, 8vw, 7rem);
}

@media (max-width: 744px) {
	.page-template-galleri .allagi {
		background-color: #fff !important;
	}
}

.artist__img {
	width: 100%;
	height: auto;
	display: block;
}

.serviceitemrower img {
	width: 100%;
	height: auto;
	display: block;
}

/* ---------- Architectural grid ----------
 * One side margin for header, content and footer, square corners,
 * fixed image proportions and numbered section rules.
 */

:root {
	--tac-section: clamp(4.5rem, 9vw, 9rem);
	--tac-gap: clamp(16px, 2vw, 32px);
	--tac-header: 96px;
}

header#masthead > .container-fluid,
footer#colophon > .container-fluid,
.home .general-page .container-fluid,
.home .container.desktophomeservices {
	max-width: none;
	padding-left: var(--tac-gutter);
	padding-right: var(--tac-gutter);
}

body footer#colophon.site-footer {
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
}

/* Small screens: the logo column lost its gutter, pulling it off the grid line. */
@media (max-width: 767px) {
	header#masthead .row > .site-branding.col-md-4 {
		padding-left: calc(var(--bs-gutter-x, 1.5rem) * .5);
	}

	.home .abtacbt {
		padding-left: calc(var(--bs-gutter-x, 1.5rem) * .5);
		padding-right: calc(var(--bs-gutter-x, 1.5rem) * .5);
	}
}

.home .c-header-home_imger .swiper-slide,
.home figure.c-figure.-parallax video,
.home .projectimage,
.home .projectimage img,
.allartistspage .projectimage,
.videomenu video {
	border-radius: 0 !important;
}

/* Section rule: hairline, index number, label. */
.tac-section-head {
	position: relative;
	display: flex;
	align-items: baseline;
	gap: 1.25rem;
	padding-top: .9rem;
	margin-bottom: clamp(2rem, 4vw, 3.5rem);
	font-family: var(--font-sans);
	font-size: 11px;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: .2em;
	text-transform: uppercase;
	text-align: left;
}

.tac-section-head .tac-line {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
}

.tac-section-head__index {
	color: var(--tac-muted);
	font-variant-numeric: tabular-nums;
}

/* Hero: full viewport height, text sits on the slider's bottom edge. */
.tac-hero-meta {
	display: flex;
	justify-content: space-between;
	gap: 2rem;
	padding-top: .9rem;
	border-top: 1px solid var(--tac-ink);
	font-size: 11px;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: .2em;
	text-transform: uppercase;
}

@media (min-width: 770px) {
	.home .container-fluid.homeonerdesk {
		margin-bottom: 0;
	}

	.home .homeenanew {
		min-height: calc(100vh - var(--tac-header));
		min-height: calc(100svh - var(--tac-header));
		align-items: stretch;
		padding-bottom: var(--tac-gutter);
	}

	.home .hero-text {
		display: flex;
		flex-direction: column;
		padding-right: clamp(16px, 4vw, 72px);
	}

	.home .hero-text .c-heading.-h1 {
		margin: auto 0 1.5rem;
		padding: 0;
		font-size: clamp(2.4rem, 4.2vw, 5rem);
		line-height: .92;
		letter-spacing: -.01em;
	}

	.home .hero-text p {
		margin: 0;
		max-width: 30em;
	}

	.home .c-header-home_imger,
	.home .c-header-home_imger .mySwiper,
	.home .c-header-home_imger .swiper-wrapper {
		height: 100%;
	}

	.home .c-header-home_imger {
		min-height: 420px;
	}

	.home .c-header-home_imger .swiper-slide {
		height: 100%;
		padding-bottom: 0 !important;
	}
}

/* Slider pagination as thin rules instead of dots. */
.home .mySwiper .swiper-pagination {
	left: auto;
	right: 0;
	bottom: 0 !important;
	width: auto;
	display: flex;
	gap: 8px;
	padding: 0 20px 14px;
}

.home .mySwiper .swiper-pagination-bullet {
	width: 28px;
	height: 13px;
	margin: 0 !important;
	border-radius: 0;
	background: linear-gradient(#fff, #fff) center / 100% 1px no-repeat;
	opacity: .45;
	transition: opacity .4s var(--tac-ease), width .6s var(--tac-ease);
}

.home .mySwiper .swiper-pagination-bullet-active {
	width: 48px;
	opacity: 1;
}

/* Sections share one vertical rhythm. */
.home section#hometwo,
.home section.homethree,
.home section#mensecgal {
	margin-top: 0;
	margin-bottom: 0;
	padding-top: var(--tac-section);
	padding-bottom: 0;
}

.home section#mensecgal {
	padding-bottom: var(--tac-section);
	text-align: left;
}

/* 01 – About: 4:5 frame, text aligned to the image's bottom edge. */
.home .videoarthomess {
	aspect-ratio: 4 / 5;
	max-height: 85vh;
}

.home .videoarthomess img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (min-width: 768px) {
	.home .abtacbt {
		align-items: flex-end;
		padding: 0 calc(var(--tac-gap) / 2) 0 clamp(16px, 4vw, 72px);
	}
}

.home .abtacbt > div {
	max-width: 34em;
}

.home h2.maesc {
	margin-bottom: 1.5rem;
	font-size: clamp(1.75rem, 2.6vw, 2.75rem);
}

.home p.welcmtxmed {
	line-height: 1.3 !important;
}

/* 02 – Collection: equal 4:5 cards, caption on a hairline. */
.home .container-fluid.servicedescriptions {
	display: block;
	padding-bottom: 0;
}

.home .servicedescriptions h2 {
	margin: 0 0 clamp(2rem, 4vw, 3.5rem);
	padding: 0;
	text-align: left !important;
}

.home .desktophomeservices > .row {
	--bs-gutter-x: var(--tac-gap);
	row-gap: clamp(28px, 3.5vw, 56px);
}

.home .projectimage,
.allartistspage .projectimage {
	height: auto;
	padding-bottom: 0 !important;
	aspect-ratio: 4 / 5;
}

.home .serviceitemrow .col-xs-12,
.allartistspage .serviceitemrow .col-xs-12 {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .25rem 1rem;
	margin-top: .75rem;
	padding-top: .75rem;
	border-top: 1px solid var(--tac-line);
}

.home p.jobopen,
.home p.artistspec,
.allartistspage p.jobopen,
.allartistspage p.artistspec {
	margin: 0;
	line-height: 1.35;
}

.home p.jobopen a,
.allartistspage p.jobopen a {
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.home p.artistspec,
.allartistspage p.artistspec {
	color: var(--tac-muted);
	font-size: 11px;
	letter-spacing: .14em;
}

.home .text-center.viewallarts {
	margin-top: clamp(2.5rem, 5vw, 4rem);
	text-align: left !important;
}

/* 03 – Gallery: 16:10 frame beside a text column that sits on its baseline. */
.home section#mensecgal h3.top-child.section-heading {
	padding: 0 0 clamp(2rem, 4vw, 3.5rem);
	text-align: left;
}

@media (min-width: 768px) {
	.home section#mensecgal .row {
		flex-direction: row;
		align-items: flex-end;
	}
}

.home .extragallgts {
	height: auto;
	padding-bottom: 0 !important;
	margin-bottom: 0;
	aspect-ratio: 16 / 10;
}

.home .mensecgal-text {
	text-align: left;
}

@media (min-width: 768px) {
	.home .mensecgal-text {
		padding-left: clamp(16px, 3vw, 48px);
	}
}

.home .mensecgal-text p {
	max-width: 30em;
	text-align: left;
}

.home .mensecgal-text .col-md-12 {
	padding: 0;
	text-align: left;
}

/* ---------- Reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}

	.js .section-heading:not(.is-split) {
		opacity: 1;
	}
}