/**
 * MERINEO base styles.
 *
 * Only what theme.json cannot express: element defaults, transitions,
 * block style variations and section-specific overrides.
 * Loaded on the front end and inside the editor canvas.
 */

/* Element defaults */

html {
	scroll-behavior: smooth;
}

body {
	-webkit-font-smoothing: antialiased;
	text-wrap: pretty;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	text-wrap: balance;
}

/* Slovak text: no automatic hyphenation or mid-word breaks. */
body,
p,
li,
h1,
h2,
h3,
h4,
h5,
h6,
a,
blockquote {
	hyphens: manual;
	overflow-wrap: normal;
	word-break: normal;
}

::selection {
	background: var(--wp--preset--color--amber);
	color: var(--wp--preset--color--ink);
}

/* Prototype --focus-ring: Blue Deep keeps 3:1 against ink as well as the light sections. */
:focus-visible {
	outline: 2px solid var(--wp--preset--color--blue-deep);
	outline-offset: 2px;
}

a,
.wp-element-button {
	transition:
		color var(--wp--custom--duration--base) var(--wp--custom--easing--standard),
		background-color var(--wp--custom--duration--base) var(--wp--custom--easing--standard),
		border-color var(--wp--custom--duration--base) var(--wp--custom--easing--standard);
}

.wp-element-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	min-height: 52px;
}

/* Form fields: white input, Sky hairline, brand radius (prototype Field/Input). */
.wp-block-search__input {
	min-height: 52px;
	padding: 0 12px;
	border: 1px solid var(--wp--preset--color--sky);
	border-radius: var(--wp--custom--radius--base);
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--medium);
}

.wp-block-search__inside-wrapper {
	gap: 12px;
}

.wp-block-search__button {
	margin-left: 0;
}

/* Full-width sections sit edge to edge, without the global block gap between them. */
.wp-block-post-content > .alignfull + .alignfull {
	margin-block-start: 0;
}

/* Brand rule: the Sky line from the logo reused as a divider. */
.wp-block-separator:not(.is-style-dots) {
	height: var(--wp--custom--rule--height);
	border: 0;
	background-color: currentColor;
	opacity: 1;
}

/* Button: outline (ghost) */

.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background-color: rgba(191, 206, 255, 0.12);
	color: inherit;
}

/* Button: amber */

.wp-block-button.is-style-amber > .wp-block-button__link {
	background-color: var(--wp--preset--color--amber);
	color: var(--wp--preset--color--ink);
}

.wp-block-button.is-style-amber > .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
}

/* Paragraph: eyebrow label above section headings */

p.is-style-eyebrow {
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	letter-spacing: 0.26em;
	line-height: 1.6;
	text-transform: uppercase;
	color: var(--wp--preset--color--blue);
}

/* Paragraph: lead */

p.is-style-lead {
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.62;
	color: var(--wp--preset--color--mist);
}

/* Light sections (white / paper) */

:is(.is-style-section-light, .is-style-section-paper) .wp-block-button.is-style-outline > .wp-block-button__link {
	border-color: rgba(11, 13, 23, 0.28);
	color: var(--wp--preset--color--ink);
}

:is(.is-style-section-light, .is-style-section-paper) .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background-color: rgba(11, 13, 23, 0.06);
}

:is(.is-style-section-light, .is-style-section-paper) p.is-style-eyebrow {
	color: var(--wp--preset--color--blue-deep);
}

:is(.is-style-section-light, .is-style-section-paper) p.is-style-lead {
	color: rgba(11, 13, 23, 0.78);
}

@media (prefers-reduced-motion: reduce) {

	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}
