/* Professional flat mint stylesheet */
:root{
	--mint-50: #f7fffb;
	--mint-100: #eafbf4;
	--mint-300: #8fd6b8;
	--mint-500: #2ea77f;
	--mint-700: #0c6a4b;
	--bg: #fbfcfd;
	--card: #ffffff;
	--text: #0b2b24;
	--muted: #577268;
	--border: rgba(11,43,36,0.08);
}

html, body { height: 100%; }

body {
	font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
	background: var(--bg);
	color: var(--text);
	padding: 2.25rem 1rem;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.container {
	max-width: 1400px;
	width: min(98%, 1400px);
	margin: 0 auto;
	background: var(--card);
	padding: 2rem 1.75rem;
	border-radius: 12px;
	box-shadow: 0 10px 30px rgba(11,43,36,0.06);
	border: 1px solid var(--border);
}

h1 { margin-top: 0; font-size: 2rem; color: var(--text); }
p.lead { color: var(--muted); margin-top: .25rem; margin-bottom: 1rem; }

/* Enhanced page heading style */
#quarto-content h1 {
	font-size: 2.6rem;
	line-height: 1.05;
	font-weight: 500;
	color: #0c6a4b; /* dark mint */
	letter-spacing: -0.5px;
	margin-bottom: 0.3rem;
}
#quarto-content h1::after {
	content: "";
	display: block;
	width: 64px;
	height: 4px;
	background: var(--mint-500);
	border-radius: 3px;
	margin-top: 0.6rem;
}
#quarto-content h1 + p.lead {
	font-size: 1rem;
	color: var(--muted);
	margin-top: 0.5rem;
}

@media (max-width: 720px) {
	#quarto-content h1 { font-size: 1.6rem; }
	#quarto-content h1::after { width: 48px; height: 3px; }
}

/* Grid of link cards */
.links { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap: 1rem; margin-top: 1rem; }
.links a.link-btn {
	display: flex; align-items: center; gap: .75rem;
	padding: .9rem 1rem; background: var(--card);
	color: var(--text); text-decoration: none; border-radius: 10px;
	border: 1px solid rgba(11,43,36,0.04); box-shadow: 0 6px 18px rgba(11,43,36,0.04);
	transition: transform 140ms ease, box-shadow 140ms ease, border-color 140ms ease;
}
.links a.link-btn:focus, .links a.link-btn:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(11,43,36,0.06); border-color: rgba(11,43,36,0.09); outline: none; }

.link-icon { width:44px; height:44px; min-width:44px; border-radius:8px; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; background:var(--mint-500); }
.link-text { display:flex; flex-direction:column; }
.link-text .title { font-weight:600; font-size:1rem; color: var(--text); }
.link-text .subtitle { font-size:.86rem; color: var(--muted); }

/* layout helpers for emoji + label + external icon */
.links a.link-btn { justify-content: space-between; }
.links a.link-btn .label { display:flex; align-items:center; gap:.6rem; flex:1; }
.emoji { font-size:1.05rem; line-height:1; }
.external-icon { margin-left: 0.6rem; color: var(--muted); font-size:0.95rem; flex:0 0 auto; }

/* Screen-reader only text */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.links a.link-btn:focus .external-icon, .links a.link-btn:hover .external-icon { color: var(--mint-700); }

/* Remove list default */
.container ul { list-style: none; padding: 0; margin: 0; }
.container li { margin: 0; }

@media (max-width: 520px) { .container { padding: 1rem; border-radius: 10px; } h1 { font-size: 1.5rem; } }

/* Ensure the title block can span the container width and use more horizontal space */
#title-block-header { width: 100%; max-width: none; }
#title-block-header .quarto-title { width: 100%; }

/* Ensure Quarto header / navbar uses flat mint color and high contrast text */
#quarto-header, header#quarto-header, #quarto-header .navbar, .navbar, .site-header, .quarto-navbar {
	background: var(--mint-500) !important;
	color: #fff !important;
	border: none !important;
}
#quarto-header .navbar .navbar-brand .navbar-title, #quarto-header .navbar .navbar-brand { color: #fff !important; }
#quarto-header a, .navbar a, .navbar-brand, .site-banner a { color: #fff !important; }
.navbar-toggler { border-color: rgba(255,255,255,0.12) !important; }
.navbar-toggler-icon { filter: invert(1) brightness(1.2); }

/* Accessibility helpers */
a:focus { outline: 3px solid color-mix(in srgb, var(--mint-500) 30%, transparent); outline-offset: 2px; }

/* Make sure headings and metadata are readable */
.quarto-title .title, .title { color: var(--text) !important; }

/* Keep overrides minimal but specific to ensure theme doesn't re-color text */
#quarto-content { color: var(--text); }

/* Ensure page title color wins over general .title rule */
#title-block-header .title { color: #0c6a4b !important; }

/* Level 2 section headings: dark mint color for emphasis */
#quarto-content h2,
.quarto-container h2,
h2.anchored {
	color: var(--mint-700);
	font-weight: 600;
}

/* Keep the navbar/header fixed and always visible when scrolling */
#quarto-header, .headroom.fixed-top {
	position: fixed !important;
	top: 0 !important;
	left: 0;
	right: 0;
	width: 100%;
	z-index: 9999;
	transform: none !important;
	transition: none !important;
	box-shadow: 0 2px 10px rgba(11,43,36,0.08);
}

/* Prevent headroom JS from hiding the header */
.headroom--unpinned, .headroom--pinned, .headroom--top, .headroom--not-top {
	transform: none !important;
}

/* Add top padding to body so content isn't hidden under the fixed header */
body.nav-fixed {
	padding-top: 72px; /* adjust if header height changes */
}

@media (max-width: 520px) {
	body.nav-fixed { padding-top: 88px; }
}