/* ==========================================================================
   The Corporate Edit — styles theme.json cannot express.
   Sharp editorial: hard edges, hairline rules, no shadows, no rounded corners.
   ========================================================================== */

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

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

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	background: var(--wp--preset--color--black);
}

::selection { background: var(--wp--preset--color--red); color: #fff; }
:focus-visible { outline: 2px solid var(--wp--preset--color--gold); outline-offset: 3px; }

img { max-width: 100%; height: auto; }

/* Nothing in this design is rounded. */
.wp-block-button__link,
.wp-block-image img,
input, textarea, select { border-radius: 0 !important; }

/* Italics in headings are the one flourish — set them in the display face. */
h1 em, h2 em, h3 em {
	font-style: italic;
	font-family: var(--wp--preset--font-family--display);
}

/* Light-ground sections need their heading and body colours flipped back. */
.tce-onlight h1, .tce-onlight h2, .tce-onlight h3, .tce-onlight h4 { color: var(--wp--preset--color--brown); }
.tce-onlight p { color: var(--wp--preset--color--brown); }
.tce-onlight h6 { color: var(--wp--preset--color--taupe); }
.tce-onlight a:not(.wp-block-button__link) { color: var(--wp--preset--color--red); }
.tce-onlight a:not(.wp-block-button__link):hover { color: var(--wp--preset--color--brown); }

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

.tce-header {
	position: sticky;
	top: 0;
	z-index: 90;
	border-bottom: 1px solid rgba(255, 255, 255, .12);
	background: var(--wp--preset--color--black);
}
.admin-bar .tce-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .tce-header { top: 46px; } }

.tce-header .wp-block-navigation__container { gap: clamp(1.5rem, 2.6vw, 2.75rem); }

.tce-header .wp-block-navigation-item__content { position: relative; padding-block: .4rem; }
.tce-header .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0; bottom: 0;
	width: 0; height: 1px;
	background: var(--wp--preset--color--gold);
	transition: width .3s ease;
}
.tce-header .wp-block-navigation-item__content:hover::after,
.tce-header .current-menu-item .wp-block-navigation-item__content::after { width: 100%; }
.tce-header .current-menu-item .wp-block-navigation-item__content { color: var(--wp--preset--color--gold); }

/* Nothing in the bar may wrap — it is one line at every width. */
.tce-header .wp-block-site-title,
.tce-header .wp-block-navigation-item__content,
.tce-header .wp-block-button__link { white-space: nowrap; }

/* The wordmark is long, so it shrinks before the nav does. */
.tce-header .wp-block-site-title a { font-size: clamp(0.9rem, 2.6vw, 1.625rem); }

/* Below the desktop breakpoint there is no room for title + nav + button. */
@media (max-width: 900px) { .tce-header .tce-header__cta { display: none; } }

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

.wp-element-button, .wp-block-button__link { transition: background-color .25s ease, color .25s ease, border-color .25s ease; }

/* Hairline outline that fills on hover. */
.tce-btn-ghost .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--white);
	border: 1px solid rgba(255, 255, 255, .38);
}
.tce-btn-ghost .wp-block-button__link:hover {
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--black);
	border-color: var(--wp--preset--color--white);
}
.tce-onlight .tce-btn-ghost .wp-block-button__link {
	color: var(--wp--preset--color--brown);
	border-color: rgba(74, 50, 42, .35);
}
.tce-onlight .tce-btn-ghost .wp-block-button__link:hover {
	background: var(--wp--preset--color--brown);
	color: var(--wp--preset--color--cream);
	border-color: var(--wp--preset--color--brown);
}

/* --- Block styles ------------------------------------------------------ */

.is-style-tce-short {
	width: 64px; max-width: 64px;
	height: 1px; border: 0;
	background: var(--wp--preset--color--gold);
	opacity: 1;
	margin-inline: 0;
}
.aligncenter.is-style-tce-short, .has-text-align-center > .is-style-tce-short { margin-inline: auto; }

.is-style-tce-checklist {
	list-style: none;
	padding-left: 0;
	margin-block: 0;
	columns: 2;
	column-gap: var(--wp--preset--spacing--40);
}
.is-style-tce-checklist li {
	position: relative;
	padding-left: 1.85rem;
	margin-bottom: 1.05rem;
	break-inside: avoid;
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.45;
	color: rgba(255, 255, 255, .74);
}
.tce-onlight .is-style-tce-checklist li { color: var(--wp--preset--color--brown); }
.is-style-tce-checklist li::before {
	content: "";
	position: absolute;
	left: 0; top: .68em;
	width: 14px; height: 1px;
	background: var(--wp--preset--color--gold);
}
@media (max-width: 860px) { .is-style-tce-checklist { columns: 1; } }

/* --- Split-screen sections --------------------------------------------- */

/* Text column and portrait sit edge to edge, no gutter, no rounding.
   useRootPaddingAwareAlignments puts horizontal padding on full-width groups,
   which would hold the photograph off the viewport edge — the text column
   supplies its own padding instead, so drop it here. */
.tce-split { padding-left: 0 !important; padding-right: 0 !important; }
.tce-split .wp-block-columns { gap: 0 !important; margin: 0; align-items: stretch; }
.tce-split .wp-block-column { margin: 0; }

.tce-split__text {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(3rem, 7vw, 7rem) clamp(1.5rem, 5vw, 6rem);
}
/* The media column must stretch to the full height of the split, and the
   figure inside it must stretch too, or the photograph floats in a black gap. */
.tce-split__media {
	padding: 0;
	display: flex;
	align-self: stretch;
}
.tce-split__media > .tce-portrait { flex: 1 1 auto; width: 100%; display: flex; }

.tce-split--hero .tce-split__text { min-height: 84vh; }
/* The display size is set for a full-width line; inside a half-width column it
   has to come down or every headline wraps to four lines. */
.tce-split--hero h1 {
	font-size: clamp(2.6rem, 5vw, 4.75rem) !important;
	text-wrap: balance;
	margin: 1.5rem 0;
}
.tce-split--head h2.has-display-font-size { font-size: clamp(2.6rem, 5vw, 4.75rem) !important; }
.tce-split--head .tce-split__text { min-height: 46vh; }

.tce-lede { max-width: 46ch; margin-block: 1.75rem 2.25rem; }

/* The portrait fills its half completely. */
.tce-portrait { margin: 0 !important; height: 100%; }
.tce-portrait img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 380px;
	object-fit: cover;
	object-position: center;
	filter: grayscale(.12) contrast(1.06);
}

@media (max-width: 781px) {
	.tce-split .wp-block-columns { flex-direction: column; }
	.tce-split--hero .tce-split__text,
	.tce-split--head .tce-split__text { min-height: 0; }
	.tce-portrait img { min-height: 0; aspect-ratio: 4 / 5; }
	/* Photograph above the copy on small screens, whatever the desktop order. */
	.tce-split__media { order: -1; }
}

/* --- Tiles (What we do) ------------------------------------------------ */

/* A hairline grid — borders collapse into single rules between cells. */
.tce-tile {
	border: 1px solid rgba(255, 255, 255, .14);
	margin: -0.5px;
	padding: clamp(2rem, 3.4vw, 3.25rem);
	height: 100%;
	transition: background-color .3s ease;
}
.tce-tile:hover { background: rgba(201, 162, 77, .07); }
/* Stacked rows of tiles must collapse into one continuous grid, not two
   floating blocks — kill the block gap and pull the borders together. */
#practices .wp-block-columns { margin-block: 0; }
#practices .wp-block-columns + .wp-block-columns { margin-top: -1px; }
.tce-tile__num {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	letter-spacing: .3em;
	color: var(--wp--preset--color--gold);
	margin: 0 0 1.5rem;
}
.tce-tile h3 { margin: 0 0 .9rem; }

.tce-arrowlink { margin-top: 1.75rem; margin-bottom: 0; }
.tce-arrowlink a {
	font-weight: 500;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold);
}
.tce-arrowlink a:hover { color: var(--wp--preset--color--white); }
.tce-arrowlink span { display: inline-block; margin-left: .3rem; transition: margin-left .25s ease; }
.tce-arrowlink a:hover span { margin-left: .7rem; }

/* --- Reasons (Why us) --------------------------------------------------- */

.tce-reason { border-top: 1px solid rgba(74, 50, 42, .28); padding-top: 1.5rem; }
.tce-reason__num {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	letter-spacing: .3em;
	color: var(--wp--preset--color--rose);
	margin: 0 0 1rem;
}

/* --- Founders ---------------------------------------------------------- */

.tce-founders .tce-dim { opacity: .78; max-width: 62ch; margin-inline: auto; }
.tce-signature {
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--blush);
	margin-top: 2.5rem;
}
.tce-signature__role {
	font-family: var(--wp--preset--font-family--body);
	font-style: normal;
	font-size: .6875rem;
	letter-spacing: .3em;
	text-transform: uppercase;
	color: var(--wp--preset--color--taupe);
}

/* --- Quotes ------------------------------------------------------------ */

.tce-quote { border-left: 1px solid var(--wp--preset--color--gold); padding-left: 1.85rem; }
.tce-quote__text {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--large);
	font-style: italic;
	line-height: 1.45;
	color: var(--wp--preset--color--white);
	margin: 0 0 .85rem;
}
.tce-quote__text::before { content: "\201C"; }
.tce-quote__text::after  { content: "\201D"; }
.tce-quote__by {
	font-weight: 500;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--wp--preset--color--grey);
	margin: 0;
}

/* --- Client logos ------------------------------------------------------ */

.tce-logogrid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 1px;
	background: rgba(74, 50, 42, .2);
	border: 1px solid rgba(74, 50, 42, .2);
}
.tce-logogrid > * {
	background: var(--wp--preset--color--cream);
	aspect-ratio: 16 / 7;
	display: flex; align-items: center; justify-content: center;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--wp--preset--color--taupe);
}

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

.tce-pagehead { border-bottom: 1px solid rgba(255, 255, 255, .12); }

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

.tce-contactlist h6 { margin-bottom: .35rem; }
.tce-contactlist p  { margin-top: 0; margin-bottom: 1.5rem; }

/* --- Enquiry form ------------------------------------------------------- */

.tce-form {
	background: var(--wp--preset--color--ink);
	border: 1px solid rgba(255, 255, 255, .14);
	padding: clamp(1.75rem, 4vw, 3rem);
}

.tce-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
@media (max-width: 600px) { .tce-field-row { grid-template-columns: 1fr; } }

.tce-field { margin: 0 0 1.25rem; }
.tce-field label {
	display: block;
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--wp--preset--color--grey);
	margin-bottom: .6rem;
}
.tce-field label span { color: var(--wp--preset--color--gold); }

.tce-field input,
.tce-field textarea,
.tce-field select {
	width: 100%;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--white);
	background: var(--wp--preset--color--black);
	border: 1px solid rgba(255, 255, 255, .2);
	padding: .9rem 1rem;
	transition: border-color .2s ease;
}
.tce-field textarea { resize: vertical; min-height: 8rem; }
.tce-field input:focus, .tce-field textarea:focus, .tce-field select:focus {
	outline: none;
	border-color: var(--wp--preset--color--gold);
}

.tce-select { position: relative; display: block; }
.tce-select select { appearance: none; -webkit-appearance: none; padding-right: 2.5rem; cursor: pointer; }
.tce-select select option { background: var(--wp--preset--color--ink); color: var(--wp--preset--color--white); }
.tce-select::after {
	content: "";
	position: absolute;
	right: 1rem; top: 50%;
	width: .5rem; height: .5rem;
	border-right: 1px solid var(--wp--preset--color--gold);
	border-bottom: 1px solid var(--wp--preset--color--gold);
	transform: translateY(-70%) rotate(45deg);
	pointer-events: none;
}

.tce-form__actions { margin: 1.75rem 0 0; }
.tce-form__actions button { cursor: pointer; }

.tce-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

.tce-formnotice {
	padding: 1rem 1.25rem;
	margin-bottom: 1.75rem;
	font-size: var(--wp--preset--font-size--medium);
	border-left: 2px solid;
}
.tce-formnotice--success { background: rgba(120, 160, 120, .12); border-color: #7FBF8F; color: #CDEBD4; }
.tce-formnotice--error   { background: rgba(200, 30, 30, .14);  border-color: var(--wp--preset--color--red-2); color: #F2C9C9; }

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

.tce-footer a { color: var(--wp--preset--color--grey); }
.tce-footer a:hover { color: var(--wp--preset--color--gold); }
.tce-footer .wp-block-navigation { font-size: var(--wp--preset--font-size--small); text-transform: none; letter-spacing: .02em; }
.tce-footer .wp-block-navigation .wp-block-navigation-item__content { color: var(--wp--preset--color--grey); }
.tce-footer .wp-block-navigation .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--gold); }
.tce-footer__rule { background-color: rgba(255, 255, 255, .12); color: rgba(255, 255, 255, .12); }
.tce-tbc { color: var(--wp--preset--color--grey); }

/* --- Editor parity ------------------------------------------------------ */

.editor-styles-wrapper { background: var(--wp--preset--color--black); }
