/* ==========================================================================
   ABrandão 27a — base.css
   Design tokens (fallbacks; real values are generated by the style engine,
   inc/style.php, from the active preset / scheme / type pairing),
   reset, typography, links, forms, buttons, utilities.
   ========================================================================== */

:root {
	/* Colors */
	--a27-primary: #0090d3;
	--a27-secondary: #111;
	--a27-accent: #e8833a;
	--a27-bg: #fff;
	--a27-surface: #fff;
	--a27-surface-alt: #f5f7f9;
	--a27-text: #1f2328;
	--a27-text-2: #4f4f4f;
	--a27-muted: #6b7079;
	--a27-link: #0079b3;
	--a27-link-hover: #005a87;
	--a27-border: #e3e6ea;
	--a27-btn-bg: #0079b3;
	--a27-btn-text: #fff;
	--a27-footer-bg: #fafafa;
	--a27-footer-text: #5c6168;

	/* Header surface (foregrounds are contrast-checked by the engine) */
	--a27-hdr-bg: #fff;
	--a27-hdr-stuck: color-mix(in srgb, #fff 92%, transparent);
	--a27-hdr-fg: #111;
	--a27-hdr-title: #111;
	--a27-hdr-accent: #0090d3;
	--a27-hdr-muted: #4f4f4f;
	--a27-hdr-line: color-mix(in srgb, #111 16%, transparent);
	--a27-hdr-soft: color-mix(in srgb, #0090d3 16%, transparent);
	--a27-hdr-border: var(--a27-border);

	/* Type */
	--a27-font-heading: 'Yanone Kaffeesatz', 'Arial Narrow', sans-serif;
	--a27-font-body: 'Segoe UI', 'Helvetica Neue', system-ui, Arial, sans-serif;
	--a27-font-nav: var(--a27-font-heading);
	--a27-font-meta: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	--a27-font-mono: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace;
	--a27-base: 17px;
	--a27-lh: 1.7;
	--a27-heading-weight: 400;
	--a27-body-weight: 400;
	--a27-heading-tracking: .005em;
	--a27-heading-case: none;
	--a27-nav-weight: 400;
	--a27-nav-case: none;
	--a27-nav-tracking: 0em;
	--a27-h1: 41.5px; --a27-h2: 33.2px; --a27-h3: 26.6px; --a27-h4: 21.3px; --a27-h5: 19px; --a27-h6: 17px;

	/* Layout */
	--a27-site-w: 1240px;
	--a27-list-w: 1400px;
	--a27-article-w: 740px;
	--a27-side-ratio: 25;
	--a27-gap: 56px;
	--a27-pad: 24px;
	--a27-post-gap: 44px;
	--a27-widget-gap: 36px;
	--a27-footer-pad: 40px;
	--a27-radius: 6px;
	--a27-header-h: 104px;
	--a27-title-size: 58px;
	--a27-nav-size: 21px;
	--a27-nav-space: 14px;
	--a27-icon-size: 22px;
	--a27-icon-stroke: 1.75;
	--a27-thumb-ratio: 31/9;

	/* Derived */
	--a27-border-w: 1px;
	--a27-primary-soft: color-mix(in srgb, var(--a27-primary) 10%, var(--a27-surface));
	--a27-primary-tint: color-mix(in srgb, var(--a27-primary) 6%, var(--a27-bg));
	--a27-focus: 0 0 0 3px color-mix(in srgb, var(--a27-primary) 45%, transparent);
	--a27-ease: cubic-bezier(.2, .7, .2, 1);
	--a27-meta-size: max(13px, calc(var(--a27-base) * .8));
	color-scheme: light;
}

.no-borders { --a27-border-w: 0px; }
.scheme-dark { color-scheme: dark; }

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: 90px; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
	margin: 0;
	background: var(--a27-bg);
	color: var(--a27-text);
	font-family: var(--a27-font-body);
	font-size: var(--a27-base);
	font-weight: var(--a27-body-weight);
	line-height: var(--a27-lh);
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-wrap: break-word;
}
img, svg, video, canvas, iframe, embed, object { max-width: 100%; }
img, video { height: auto; }
img { vertical-align: middle; border-style: none; }
figure { margin: 0; }
hr { border: 0; border-top: 1px solid var(--a27-border); margin: 2.5em 0; }
::selection { background: color-mix(in srgb, var(--a27-accent) 30%, transparent); color: inherit; }
mark { background: color-mix(in srgb, var(--a27-accent) 25%, transparent); color: inherit; padding: 0 .15em; border-radius: 2px; }

/* ---------- Icons ---------- */
.a27-icon {
	width: 1em; height: 1em;
	flex: none;
	stroke-width: var(--a27-icon-stroke);
	vertical-align: -.125em;
}
.a27-icon--solid { stroke: none; }

/* ---------- Headings ---------- */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--a27-font-heading);
	font-weight: var(--a27-heading-weight);
	letter-spacing: var(--a27-heading-tracking);
	line-height: 1.12;
	color: var(--a27-secondary);
	margin: 1.6em 0 .5em;
	text-wrap: balance;
	text-transform: var(--a27-heading-case);
}
h1 { font-size: var(--a27-h1); }
h2 { font-size: var(--a27-h2); }
h3 { font-size: var(--a27-h3); }
h4 { font-size: var(--a27-h4); }
h5 { font-size: var(--a27-h5); }
h6 { font-size: var(--a27-h6); text-transform: uppercase; letter-spacing: .06em; }

/* Signature two-tone titles: first half dark, second half brand blue. */
.tt-first { color: var(--a27-secondary); transition: color .25s var(--a27-ease); }
.tt-rest  { color: var(--a27-primary); }
.no-title-split .tt-first, .no-title-split .tt-rest { color: inherit; }

p { margin: 0 0 1.15em; }

/* ---------- Links ---------- */
a { color: var(--a27-link); text-decoration: none; transition: color .2s var(--a27-ease), background-color .2s var(--a27-ease), border-color .2s var(--a27-ease); }
a:hover { color: var(--a27-link-hover); }
:focus-visible { outline: 2px solid var(--a27-primary); outline-offset: 2px; border-radius: 2px; }

/* ---------- Forms & buttons ---------- */
input, button, select, textarea { font: inherit; color: inherit; }
input[type=text], input[type=search], input[type=email], input[type=url], input[type=password], input[type=number], input[type=tel], select, textarea {
	width: 100%;
	padding: .6em .8em;
	background: var(--a27-surface);
	border: 1px solid color-mix(in srgb, var(--a27-border) 60%, var(--a27-muted));
	border-radius: var(--a27-radius);
	line-height: 1.4;
	font-size: max(16px, .95em); /* avoid iOS zoom */
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--a27-primary); box-shadow: var(--a27-focus); }
label { font-family: var(--a27-font-meta); font-size: .9em; }

.button, button[type=submit], input[type=submit], .wp-block-button__link, .wp-element-button {
	display: inline-flex; align-items: center; gap: .5em;
	padding: .65em 1.2em;
	background: var(--a27-btn-bg);
	color: var(--a27-btn-text);
	border: 0;
	border-radius: var(--a27-radius);
	font-family: var(--a27-font-meta);
	font-size: .9em;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	text-decoration: none;
	transition: filter .2s var(--a27-ease), transform .2s var(--a27-ease);
}
.button:hover, button[type=submit]:hover, input[type=submit]:hover, .wp-block-button__link:hover { color: var(--a27-btn-text); filter: brightness(1.1); }
.button:active, button[type=submit]:active { transform: translateY(1px); }

/* Search form */
.search-form { display: flex; position: relative; max-width: 100%; }
.search-form .search-field { padding-right: 2.8em; background: var(--a27-surface-alt); }
.search-form .search-field:focus { background: var(--a27-surface); }
.search-form .search-submit {
	position: absolute; right: 3px; top: 3px; bottom: 3px;
	width: 2.4em; padding: 0; justify-content: center;
	background: transparent; color: var(--a27-muted); border-radius: var(--a27-radius);
}
.search-form .search-submit:hover { color: var(--a27-primary); filter: none; background: var(--a27-primary-soft); }
.search-form .search-submit .a27-icon { width: 1.15em; height: 1.15em; }

/* Pills (categories / tags) — modern take on the old hover-highlight links */
.term-list { display: flex; flex-wrap: wrap; align-items: center; gap: .35em .4em; }
.term-list > .a27-icon { color: var(--a27-muted); margin-right: .1em; }
.pill {
	display: inline-block;
	padding: .18em .65em;
	border: 1px solid var(--a27-border);
	border-radius: 999px;
	font-family: var(--a27-font-meta);
	font-size: var(--a27-meta-size);
	line-height: 1.5;
	color: var(--a27-text-2);
	background: var(--a27-surface);
}
.pill:hover { color: var(--a27-btn-text); background: var(--a27-btn-bg); border-color: var(--a27-btn-bg); }
.pill--tag { border-color: transparent; background: transparent; color: var(--a27-muted); padding-inline: .4em; }
.pill--tag:hover { background: var(--a27-primary-soft); color: var(--a27-link-hover); border-color: transparent; }

/* ---------- Utilities / accessibility ---------- */
.screen-reader-text {
	border: 0; clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden;
	padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important;
}
.skip-link:focus {
	clip-path: none; height: auto; width: auto; margin: 0; z-index: 100000;
	top: 8px; left: 8px; padding: .8em 1.2em;
	background: var(--a27-surface); color: var(--a27-link);
	box-shadow: 0 2px 12px rgba(0,0,0,.2); border-radius: var(--a27-radius);
}
#content:focus { outline: 0; }

/* WordPress core alignment classes (also used by legacy content) */
.alignleft { float: left; margin: .35em 1.5em 1em 0; }
.alignright { float: right; margin: .35em 0 1em 1.5em; }
.aligncenter { display: block; margin-inline: auto; }
.wp-caption { max-width: 100%; }
.wp-caption-text, figcaption, .gallery-caption {
	font-family: var(--a27-font-meta);
	font-size: var(--a27-meta-size);
	color: var(--a27-muted);
	line-height: 1.5;
	margin-top: .6em;
	text-align: center;
}
.sticky, .bypostauthor { }

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