/* ==========================================================
   base.css
   Shared tokens, reset, and utility classes.
   Loaded first — header.css, middle.css, and footer.css
   all depend on the custom properties and .wrap/.logo-box
   rules defined here.
========================================================== */

:root {
  --navy-dark: #121a24;
  --navy-darker: #0a0f15;
  --border-subtle: rgba(255, 255, 255, 0.12);
  --text-white: #ffffff;
  --text-muted: #94a3b8;
  --text-body: #334155;
  --accent-cyan: #38bdf8;
  --accent-blue: #0284c7;
  --bg-page: #f7f8fa;
  --bg-card: #ffffff;
  --border-light: rgba(0, 0, 0, 0.08);
  --font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: "Space Grotesk", system-ui, -apple-system, sans-serif;
}

* { box-sizing: border-box; }

/*
html, body {
	width: 100%;
	max-width: 100%;
	overflow-x: hidden;*/ /* Stops horizontal scrolling dead in its tracks */
/*	position: relative;

	height: 100%;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;  
  
}*/


/* 1. Force full viewport height on root elements */
html {
  height: 100%;
}

body {
  min-height: 100vh;           /* Forces body to take full height of browser screen */
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
}






html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font-family);
  color: var(--text-body);
  background: var(--bg-page);
  line-height: 1.55;
}

a { color: inherit; }

.wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

.eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent-blue);
}

/* Logo mark — shared, unchanged, between header and footer */
.logo-box {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  border: 1.5px solid rgba(255, 255, 255, 0.85);
  padding: 0.4rem 0.8rem;
  background-color: rgba(255, 255, 255, 0.02);
}
.ts-icon { width: 26px; height: 20px; color: var(--text-white); }
.logo-text {
  font-family: var(--font-display);
  color: var(--text-white);
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: 0.08em;
}






/* 2. Target whatever element holds your page content */
main,
.main-content,
#content,
.site-content {
  flex: 1 0 auto;             /* Tells content to expand and fill remaining space */
}