/**
 * timexsinclair theme — the shell, typography and colours that Astra used to
 * generate from Customizer settings (values taken from the live site on
 * 2026-09-06, see backups/astra-rebuild/ in the migration repo).
 *
 * Order: tokens → base → layout → header → navigation → entry → blog → footer
 *        → buttons/forms → blocks & content styles → responsive.
 */

/* ------------------------------------------------------------------------ */
/* Tokens (the --ast-global-color-N names are kept: post content uses them)  */
/* ------------------------------------------------------------------------ */
:root {
	--ast-global-color-0: #DD183B;
	--ast-global-color-1: #CC1939;
	--ast-global-color-2: #272727;
	--ast-global-color-3: #3A3A3A;
	--ast-global-color-4: #ffffff;
	--ast-global-color-5: #056ad2;
	--ast-global-color-6: #045cb4;
	--ast-global-color-7: #ff9a00;
	--ast-global-color-8: #545454;

	--ts-accent: var(--ast-global-color-1);
	--ts-page-bg: var(--ast-global-color-2);
	--ts-content-bg: var(--ast-global-color-3);
	--ts-text: var(--ast-global-color-4);
	--ts-link: var(--ast-global-color-7);
	--ts-link-hover: var(--ast-global-color-5);
	--ts-grey: var(--ast-global-color-8);

	--ts-font-body: 'Karla', sans-serif;
	--ts-font-heading: 'Karla', sans-serif;
	--ts-font-mono: 'VT323', monospace;
	--ts-font-button: 'Oswald', sans-serif;

	--ts-container: 1200px;
	--ts-sidebar-width: 25%;
	--ts-body-line-height: 1.15em;

	--ts-nav-bg: #414956;
	--ts-nav-bg-open: #3b424d;
	--ts-nav-sub-bg: #383838;
	--ts-nav-text: #f5f5f5;
	--ts-nav-border: #2f353f;
}

/* ------------------------------------------------------------------------ */
/* Base                                                                      */
/* ------------------------------------------------------------------------ */
html {
	font-size: 106.25%; /* 17px */
	-webkit-text-size-adjust: 100%;
	box-sizing: border-box;
}
*, *::before, *::after { box-sizing: inherit; }
body {
	margin: 0;
	background-color: var(--ts-page-bg);
	color: var(--ts-text);
	font-family: var(--ts-font-body);
	font-weight: 400;
	font-size: 1rem;
	line-height: var(--ts-body-line-height);
	-webkit-font-smoothing: antialiased;
	word-wrap: break-word;
}
img { max-width: 100%; height: auto; vertical-align: middle; }
figure { margin: 0 0 1.5em; }
figcaption { font-style: italic; }
a { color: var(--ts-link); text-decoration: none; }
a:hover, a:focus { color: var(--ts-link-hover); }
p { margin: 0 0 1.1em; }
ul, ol { margin: 0 0 1.5em 3em; padding: 0; }
li > ul, li > ol { margin-bottom: 0; }
blockquote { margin: 1.5em; padding-left: 1em; border-left: 5px solid rgba(255,255,255,0.15); color: var(--ts-text); }
hr { border: 0; border-top: 1px solid var(--ts-grey); margin: 1.5em 0; }
table { border-collapse: collapse; width: 100%; margin: 0 0 1.5em; }
th, td { padding: .5em; border-bottom: 1px solid rgba(255,255,255,0.12); text-align: left; vertical-align: top; }
th { font-weight: 700; }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--ts-font-heading);
	font-weight: 600;
	color: var(--ts-text);
	margin: 0 0 .5em;
	clear: left !important;
}
/* One scale for titles and content, H1 largest → H6 smallest (style-guide.md) */
h1 { font-size: 44px; font-weight: 700; line-height: 1.15; }
h2 { font-size: 34px; line-height: 1.2; }
h3 { font-size: 27px; line-height: 1.25; }
h4 { font-size: 22px; line-height: 1.3; }
h5 { font-size: 19px; font-weight: 700; line-height: 1.3; }
h6 { font-size: 17px; font-weight: 700; line-height: 1.3; text-transform: uppercase; letter-spacing: .04em; }
.entry-content > h2, .entry-content > h3, .entry-content > h4 { margin-top: 1.2em; }
.entry-content > h2:first-child, .entry-content > h3:first-child { margin-top: 0; }

pre, code, kbd, samp { font-family: 'TS2068', Courier, monospace; }
pre.wp-block-code, pre.wp-block-preformatted { background-color: var(--ts-grey); padding: 10px; white-space: pre-wrap; margin: 0 0 1.5em; }
pre.wp-block-code code, pre.code, samp pre { font-family: 'TS2068', Courier, monospace; font-weight: normal; font-style: normal; font-size: 14px; background-color: var(--ts-grey); line-height: 1.8em; }
p code, li code { font-family: 'TS2068', Courier, monospace; font-weight: normal; font-style: normal; font-size: 13px; }

.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px;
	overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important;
}
.screen-reader-text:focus {
	background: var(--ts-content-bg); clip: auto !important; clip-path: none; color: var(--ts-text);
	display: block; font-size: 1em; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px;
	text-decoration: none; top: 5px; width: auto; z-index: 100000;
}
.clear::after { content: ""; display: table; clear: both; }

/* ------------------------------------------------------------------------ */
/* Layout: boxed 1200px page, sidebar 25% + content 75%                      */
/* ------------------------------------------------------------------------ */
#page {
	max-width: var(--ts-container);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}
.site-content { flex: 1 0 auto; }
.site-content .ts-container {
	display: flex;
	flex-wrap: wrap;   /* the breadcrumb row (.ts-hook-59577) spans the top */
	align-items: flex-start;
	max-width: var(--ts-container);
}
[class^="ts-hook-"], [class*=" ts-hook-"] { width: 100%; }
[class^="ts-hook-"] .wp-block-query .wp-block-post-template .wp-block-post { width: 100%; }

#secondary {
	width: var(--ts-sidebar-width);
	padding: 0 10px 0 0;
	margin: 0;
	line-height: 2;
	word-break: break-word;
	font-size: 1rem;
}
#primary {
	width: 100%;
	margin: 0 0 10px;
	padding: 0;
	min-width: 0;
}
.ts-left-sidebar #primary { width: calc(100% - var(--ts-sidebar-width)); }
.ts-no-sidebar #primary { width: 100%; }

/* ------------------------------------------------------------------------ */
/* Header                                                                    */
/* ------------------------------------------------------------------------ */
.site-header {
	background-color: var(--ts-content-bg);
	margin: 0 0 5px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1em;
	min-height: 152px;
	padding: 0 20px;
}
.site-branding { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.site-description { margin: 0; font-family: var(--ts-font-button); font-size: 26px; line-height: 1.2; color: var(--ts-text); }
.custom-logo-link { display: inline-block; line-height: 0; }
.custom-logo { width: 550px; max-width: 100%; height: auto; }
.site-title { font-family: var(--ts-font-mono); font-size: 40px; color: var(--ts-text); }
.ts-menu-toggle {
	display: none;
	align-items: center;
	gap: .5em;
	background: var(--ts-accent);
	color: var(--ts-text);
	border: 0;
	border-radius: 3px;
	padding: 10px 16px;
	font-family: var(--ts-font-button);
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: .2px;
	cursor: pointer;
}
.ts-menu-toggle__icon, .ts-menu-toggle__icon::before, .ts-menu-toggle__icon::after {
	display: block; width: 18px; height: 2px; background: currentColor; position: relative;
}
.ts-menu-toggle__icon::before, .ts-menu-toggle__icon::after { content: ""; position: absolute; left: 0; }
.ts-menu-toggle__icon::before { top: -6px; }
.ts-menu-toggle__icon::after { top: 6px; }

/* ------------------------------------------------------------------------ */
/* Breadcrumbs row (Smart Post Type Hierarchy output inside .ts-hook-59577)  */
/* ------------------------------------------------------------------------ */
nav.breadcrumbs, div.breadcrumbs { padding-bottom: 3px; line-height: 1.15; }
.breadcrumbs .breadcrumb-separator { color: var(--ts-text); }
.breadcrumb { font-size: 16px; font-weight: bold; margin-bottom: 10px; }

/* ------------------------------------------------------------------------ */
/* Navigation accordion (replaces the WPB accordion widget, dark skin)       */
/* ------------------------------------------------------------------------ */
.ts-nav { line-height: 18px; }
.ts-nav ul { list-style: none; margin: 0; padding: 0; }
.ts-nav li { margin: 0; display: block; }
.ts-nav__row { display: flex; align-items: stretch; }
.ts-nav a {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	color: var(--ts-nav-text);
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	padding: 14px 20px;
}
.ts-nav a:hover, .ts-nav a:focus { color: #fff; text-decoration: none; }
.ts-nav__list > li { border-bottom: 1px solid var(--ts-nav-border); }
.ts-nav__list > li > .ts-nav__row { background: var(--ts-nav-bg); }
.ts-nav__list > li.is-open > .ts-nav__row { background: var(--ts-nav-bg-open); }
.ts-nav__list > li > .ts-nav__row > a { color: var(--ts-nav-text); }
.ts-nav .sub-menu { display: none; background: var(--ts-nav-sub-bg); padding-left: 20px; }
.ts-nav li.is-open > .sub-menu { display: block; }
.ts-nav .sub-menu a { padding: 10px 15px; }
.ts-nav .sub-menu .sub-menu { padding-left: 15px; background: transparent; }
.ts-nav__toggle {
	flex: 0 0 47px;
	background: transparent;
	border: 0;
	border-left: 1px solid rgba(255,255,255,0.06);
	color: #fff;
	font: 600 20px/1 var(--ts-font-body);
	cursor: pointer;
	padding: 0;
	border-radius: 0;
	text-transform: none;
	letter-spacing: 0;
}
.ts-nav__toggle::before { content: "+"; }
.ts-nav li.is-open > .ts-nav__row > .ts-nav__toggle::before { content: "\00d7"; }
.ts-nav__toggle:hover, .ts-nav__toggle:focus { background: rgba(255,255,255,0.08); color: #fff; }

/* ------------------------------------------------------------------------ */
/* Entries                                                                   */
/* ------------------------------------------------------------------------ */
.ts-article-single, .error-404 {
	background-color: var(--ts-content-bg);
	padding: 1em 10px;
	margin: 0;
}
.entry-header { margin: 0 0 2em; }
.entry-title { margin-bottom: .5em; }
.entry-header .post-thumb { margin-top: 1em; }
.entry-content > :last-child { margin-bottom: 0; }
.entry-content a { text-decoration: underline; }
.entry-content .wp-block-button__link, .entry-content .ts-button, .entry-content .ast-button, .entry-content button a { text-decoration: none; }
.entry-content[data-ts-blocks-layout] > ul, .entry-content[data-ts-blocks-layout] > ol { margin-left: 3em; }
.entry-meta { color: var(--ts-text); font-size: .9em; margin: .5em 0 0; }
.entry-meta a { color: var(--ts-link); }
.page-links { clear: both; margin: 1em 0; }
.ts-archive-header { padding: 0 10px; }

/* Taxonomy listing tables (inc/ts-taxonomy-helpers.php); on person pages ~90% of the column. */
.ts-tag-table { width: 100%; margin: 0 0 1.5em; }
.tax-indiv .ts-tag-table { width: 90%; }
.ts-tag-table th { border-bottom: 1px solid rgba(255,255,255,0.25); }

/* Company sub-pages: the H1 is the company name linking back to the hub. */
.single-company .entry-title a { font-size: inherit; line-height: inherit; color: inherit; text-decoration: none; background: none; box-shadow: none; border: 0; }
.single-company .entry-title a:hover { text-decoration: underline; }

/* Author box under blog posts */
.ts-author-box {
	display: flex; gap: 1.5em; align-items: flex-start;
	background: var(--ts-content-bg); padding: 1.5em; margin: 1.5em 0 0;
}
.ts-author-box__avatar img { border-radius: 50%; width: 100px; height: 100px; }
.ts-author-box__title { margin: 0 0 .3em; font-size: 14px; text-transform: uppercase; letter-spacing: .05em; opacity: .8; }
.ts-author-box__name { font-size: 1.2em; font-weight: 700; margin: 0 0 .5em; }
.ts-author-box__bio { margin: 0; }

/* ------------------------------------------------------------------------ */
/* Blog list                                                                 */
/* ------------------------------------------------------------------------ */
.ts-blog-list { display: flex; flex-direction: column; gap: 2em; }
.ts-blog-card {
	display: flex; gap: 0; align-items: flex-start;
	background: var(--ts-content-bg);
	padding: 1.5em 1em;
}
.ts-blog-card__media { flex: 0 0 50%; position: relative; padding-right: 1.5em; }
.ts-blog-card__media img { display: block; width: 100%; height: auto; }
.ts-blog-card__body { flex: 1 1 50%; min-width: 0; }
.ts-blog-card .entry-title { font-size: 27px; line-height: 1.25; margin: 0 0 .4em; } /* card titles at the H3 step */
.ts-blog-card .entry-title a { color: var(--ts-text); }
.ts-blog-card .entry-title a:hover { color: var(--ts-link); }
.ts-blog-card__excerpt { margin: 1em 0; }
.ts-blog-card__more { margin: 0; }
.ts-date-badge {
	position: absolute; top: 12px; left: 12px;
	width: 70px; height: 70px; border-radius: 50%;
	background: var(--ts-accent); color: #fff;
	display: flex; align-items: center; justify-content: center; text-align: center;
	font-size: 12px; line-height: 1.2; font-weight: 700; text-transform: uppercase;
}
.ts-date-badge time { display: flex; flex-direction: column; }
.ts-date-badge .date-day { font-size: 20px; }
.navigation.pagination { margin: 2em 0; text-align: center; }
.navigation.pagination .nav-links { display: inline-flex; gap: .5em; flex-wrap: wrap; justify-content: center; }
.navigation.pagination .page-numbers { padding: .4em .8em; background: var(--ts-content-bg); color: var(--ts-text); border-radius: 3px; }
.navigation.pagination .page-numbers.current { background: var(--ts-accent); }

/* ------------------------------------------------------------------------ */
/* Footer                                                                    */
/* ------------------------------------------------------------------------ */
.site-footer { background-color: var(--ts-page-bg); margin-top: 20px; }
.ts-footer-widgets {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
	padding: 20px 25px;
}
.ts-footer-col .widget { margin: 0 0 1em; }
.ts-footer-col h4, .ts-footer-col .widget-title { margin: 0 0 .5em; }
.ts-footer-col ul { margin-left: 0; list-style: none; }
.ts-footer-col li { margin: 0 0 .6em; }
.ts-footer-copyright { text-align: center; padding: 20px; }
.ts-footer-copyright img { display: inline-block; margin-bottom: .4em; }

/* Mailchimp form inside the footer (the embed brings its own light styles) */
#mc_embed_signup { background: #fff; color: #222; padding: 1em; border-radius: 3px; font: 14px Helvetica, Arial, sans-serif; }
#mc_embed_signup h2.widget-title { font-size: 1.7em; color: #222; }
#mc_embed_signup .button, #mc_embed_signup input[type="submit"] { background: var(--ts-accent); color: #fff; }

/* Scroll to top */
#ts-scroll-top {
	position: fixed; right: 30px; bottom: 30px; z-index: 99;
	width: 2.1em; height: 2.1em; line-height: 2.1; text-align: center;
	background: var(--ts-link); color: #fff; border-radius: 2px; font-size: 15px;
	opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s;
}
#ts-scroll-top.is-visible { opacity: 1; visibility: visible; }
#ts-scroll-top:hover { color: #fff; background: var(--ts-link-hover); }

/* ------------------------------------------------------------------------ */
/* Buttons and forms                                                         */
/* ------------------------------------------------------------------------ */
button, .ts-button, .ast-button, .button, input[type="submit"], input[type="button"], .wp-block-button__link, .wp-block-search__button {
	display: inline-block;
	border: 0;
	border-radius: 3px;
	background-color: var(--ts-accent);
	color: var(--ts-text);
	padding: 10px 20px;
	font-family: var(--ts-font-button);
	font-weight: 400;
	font-size: 14px;
	line-height: 1.1em;
	text-transform: uppercase;
	letter-spacing: .2px;
	text-decoration: none;
	cursor: pointer;
}
button:hover, .ts-button:hover, .ast-button:hover, .button:hover, input[type="submit"]:hover, .wp-block-button__link:hover,
button:focus, .ts-button:focus, .ast-button:focus, .button:focus, input[type="submit"]:focus, .wp-block-button__link:focus {
	background-color: var(--ast-global-color-6);
	color: var(--ts-link);
}
/* --- The three button styles (editor: Styles panel of the Button block) ----
   primary   = the rule above (filled accent), also .is-style-primary
   secondary = outline; the old core "outline" class keeps rendering as this
   subtle    = quiet grey pill for minor actions                             */
.wp-block-button.is-style-secondary .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link,
.ts-button--secondary, button.ts-button--secondary {
	background: transparent;
	color: var(--ts-text);
	border: 2px solid var(--ts-text);
	padding: 8px 18px;
	border-radius: 3px;
}
.wp-block-button.is-style-secondary .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.ts-button--secondary:hover, button.ts-button--secondary:hover {
	color: var(--ts-link);
	border-color: var(--ts-link);
	background: transparent;
}
.wp-block-button.is-style-subtle .wp-block-button__link,
.ts-button--subtle, button.ts-button--subtle {
	background: var(--ts-grey);
	color: var(--ts-text);
	border: 0;
	border-radius: 999px;
	padding: 6px 16px;
	font-size: 13px;
	letter-spacing: .3px;
}
.wp-block-button.is-style-subtle .wp-block-button__link:hover,
.ts-button--subtle:hover, button.ts-button--subtle:hover {
	background: var(--ts-link);
	color: var(--ts-page-bg);
}
input[type="text"], input[type="email"], input[type="search"], input[type="url"], input[type="number"], textarea, select {
	font: inherit; color: #222; background: #fff; border: 1px solid #ccc; border-radius: 2px; padding: .5em .7em; max-width: 100%;
}

/* ------------------------------------------------------------------------ */
/* Block & content styles previously in Customizer "Additional CSS"         */
/* ------------------------------------------------------------------------ */
.wp-block-tag-cloud, #taxPeople > div { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.wp-block-tag-cloud a.tag-cloud-link, #taxPeople > div > a {
	display: inline-block; padding: 0.3em 0.75em;
	border: 1px solid rgba(255, 154, 0, 0.4); border-radius: 999px; background: rgba(255, 154, 0, 0.1);
	font-size: 0.85rem !important; line-height: 1.4; white-space: nowrap;
	transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.wp-block-tag-cloud a.tag-cloud-link:hover, #taxPeople > div > a:hover {
	color: #ffbf40; background: rgba(255, 154, 0, 0.25); border-color: rgba(255, 154, 0, 0.7);
}
.wp-block-image figcaption, .wp-caption-text { font-size: .9em; text-align: center; }
.alignleft { float: left; margin: 0 1.5em 1em 0; }
.alignright { float: right; margin: 0 0 1em 1.5em; }
.aligncenter { display: block; margin: 0 auto 1em; clear: both; }
.wp-block-columns { margin-bottom: 1.5em; }
.wp-block-latest-posts__list { margin-left: 0; list-style: none; }
.wp-block-latest-posts__post-date { display: block; font-size: .85em; opacity: .8; }
.wp-block-separator { border-color: var(--ts-grey); }

/* ------------------------------------------------------------------------ */
/* Responsive                                                                */
/* ------------------------------------------------------------------------ */
@media (max-width: 921px) {
	h1 { font-size: 36px; }
	h2 { font-size: 29px; }
	h3 { font-size: 24px; }
	h4 { font-size: 20px; }
	.site-header { min-height: 0; padding: 12px 15px; }
	.custom-logo { width: 280px; }
	.site-description { font-size: 16px; }
	.ts-menu-toggle { display: inline-flex; }
	.site-content .ts-container { flex-direction: column; }
	#secondary { display: none; width: 100%; padding: 0; margin: 0 0 1em; }
	body.ts-nav-open #secondary { display: block; }
	.ts-left-sidebar #primary, .ts-no-sidebar #primary { width: 100%; }
	.ts-blog-card { flex-direction: column; }
	.ts-blog-card__media { flex-basis: auto; padding: 0 0 1em; width: 100%; }
	.ts-footer-widgets { grid-template-columns: 1fr; gap: 20px; }
	.ts-author-box { flex-direction: column; }
}
@media (max-width: 544px) {
	h1 { font-size: 31px; }
	h2 { font-size: 25px; }
	h3 { font-size: 21px; }
	.ts-article-single { padding: 1em 10px; }
	#ts-scroll-top { right: 15px; bottom: 15px; }
}
@media print {
	#secondary, .site-header, .site-footer, #ts-scroll-top, .ts-menu-toggle { display: none !important; }
	#primary { width: 100% !important; }
}

/* Style-guide swatches */
.ts-swatches { display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 1.5em; }
.ts-swatch { width: 120px; font-size: 12px; line-height: 1.3; }
.ts-swatch span { display: block; height: 56px; border-radius: 4px; border: 1px solid rgba(255,255,255,.15); margin-bottom: 4px; }
