/*
Theme Name: KouryLab
Theme URI: https://kourylab.com/
Author: KouryLab
Author URI: https://kourylab.com/
Description: A distinctive, accessible block theme foundation for KouryLab-managed websites.
Requires at least: 6.6
Tested up to: 7.0
Requires PHP: 7.4
Version: 0.7.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kourylab
Tags: block-patterns, block-styles, editor-style, full-site-editing, accessibility-ready, rtl-language-support, translation-ready, wide-blocks
*/

html {
	font-size: 100%;
	scroll-behavior: smooth;
}

body {
	font-size: 1rem !important;
	text-wrap: pretty;
	background:
		radial-gradient(circle at 8% 5%, color-mix(in srgb, var(--wp--preset--color--signal) 18%, transparent) 0 9rem, transparent 25rem),
		var(--wp--preset--color--paper);
}

:where(a, button, input, textarea, select, summary):focus-visible {
	outline: 3px solid var(--wp--preset--color--signal);
	outline-offset: 3px;
}

a {
	text-decoration-thickness: 0.08em;
	text-underline-offset: 0.18em;
}

.wp-site-blocks {
	overflow: clip;
}

/* A high-energy studio skin built from the theme's existing semantic colors. */
.wp-site-blocks > header {
	position: relative;
	z-index: 10;
	background: color-mix(in srgb, var(--wp--preset--color--paper) 88%, transparent);
	backdrop-filter: blur(18px);
}

.wp-site-blocks > header .wp-block-group.alignwide {
	min-height: 5rem;
}

.wp-site-blocks > header .wp-block-site-title a {
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	text-decoration: none;
	letter-spacing: -0.055em;
}

.wp-site-blocks > header .wp-block-navigation-item__content {
	position: relative;
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	padding-inline: 0.25rem;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-decoration: none;
	text-transform: uppercase;
}

.wp-site-blocks > footer .wp-block-site-title a,
.wp-site-blocks > footer .wp-block-navigation-item__content {
	display: inline-flex;
	min-height: 44px;
	align-items: center;
}

.wp-site-blocks > header .wp-block-navigation-item__content::after {
	position: absolute;
	right: 0;
	bottom: -0.35rem;
	left: 0;
	height: 3px;
	background: var(--wp--preset--color--signal);
	content: "";
	transform: scaleX(0);
	transform-origin: right;
	transition: transform 180ms ease;
}

.wp-site-blocks > header .wp-block-navigation__responsive-container-open,
.wp-site-blocks > header .wp-block-navigation__responsive-container-close {
	width: 44px;
	height: 44px;
	align-items: center;
	justify-content: center;
}

.wp-site-blocks > header .wp-block-navigation-item__content:hover::after,
.wp-site-blocks > header .wp-block-navigation-item__content:focus-visible::after {
	transform: scaleX(1);
	transform-origin: left;
}

main > .wp-block-post-title:first-child {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

.wp-block-post-content > .alignfull {
	width: 100vw;
	max-width: none;
	margin-right: calc(50% - 50vw) !important;
	margin-left: calc(50% - 50vw) !important;
}

.wp-block-post-content > .wp-block-group.alignfull:first-of-type {
	position: relative;
	isolation: isolate;
	min-height: min(76vh, 760px);
	display: grid;
	align-items: center;
	background:
		linear-gradient(125deg, transparent 0 58%, color-mix(in srgb, var(--wp--preset--color--electric) 25%, transparent) 58% 72%, transparent 72%),
		linear-gradient(160deg, var(--wp--preset--color--mint), color-mix(in srgb, var(--wp--preset--color--mint) 76%, white));
}

.wp-block-post-content > .wp-block-group.alignfull:first-of-type::before,
.wp-block-post-content > .wp-block-group.alignfull:first-of-type::after {
	position: absolute;
	z-index: -1;
	content: "";
	pointer-events: none;
}

.wp-block-post-content > .wp-block-group.alignfull:first-of-type::before {
	top: 8%;
	right: clamp(-5rem, 3vw, 3rem);
	width: clamp(14rem, 33vw, 34rem);
	aspect-ratio: 1;
	border: clamp(1.2rem, 3vw, 3.5rem) solid var(--wp--preset--color--signal);
	border-radius: 50%;
	box-shadow: 0 0 0 2px var(--wp--preset--color--ink);
	opacity: 0.9;
}

.wp-block-post-content > .wp-block-group.alignfull:first-of-type::after {
	right: 10%;
	bottom: -3rem;
	width: 10rem;
	height: 10rem;
	background: repeating-linear-gradient(135deg, var(--wp--preset--color--ink) 0 3px, transparent 3px 13px);
	transform: rotate(8deg);
}

.wp-block-post-content > .wp-block-group.alignfull:first-of-type h1 {
	max-width: 10ch;
	font-size: clamp(3.6rem, 8.4vw, 8.8rem) !important;
	letter-spacing: -0.075em;
	line-height: 0.82;
	text-wrap: balance;
}

.wp-block-post-content > .wp-block-group.alignfull:first-of-type .has-large-font-size {
	max-width: 31ch;
	font-size: clamp(1.15rem, 2vw, 1.65rem) !important;
	font-weight: 550;
	line-height: 1.35;
}

.wp-block-button__link {
	box-shadow: 6px 6px 0 var(--wp--preset--color--ink);
	letter-spacing: 0.02em;
	transition: box-shadow 160ms ease, transform 160ms ease;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus-visible {
	box-shadow: 2px 2px 0 var(--wp--preset--color--ink);
	transform: translate(4px, 4px);
}

.wp-block-post-content > .has-ink-background-color {
	position: relative;
	background-image:
		linear-gradient(color-mix(in srgb, var(--wp--preset--color--paper) 8%, transparent) 1px, transparent 1px),
		linear-gradient(90deg, color-mix(in srgb, var(--wp--preset--color--paper) 8%, transparent) 1px, transparent 1px);
	background-size: 48px 48px;
}

.wp-block-post-content > .has-ink-background-color .wp-block-columns {
	gap: 0;
	border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--paper) 24%, transparent);
	border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--paper) 24%, transparent);
}

.wp-block-post-content > .has-ink-background-color .wp-block-column {
	padding: clamp(1.5rem, 4vw, 3.5rem);
	border-right: 1px solid color-mix(in srgb, var(--wp--preset--color--paper) 24%, transparent);
}

.wp-block-post-content > .has-ink-background-color .wp-block-column:last-child {
	border-right: 0;
}

.wp-block-post-content > .has-ink-background-color .kourylab-eyebrow {
	font-size: clamp(2rem, 4vw, 4.5rem);
	color: var(--wp--preset--color--signal);
	line-height: 1;
}

.wp-block-post-content > .wp-block-group.alignwide:has(.kourylab-card) {
	padding-top: clamp(5rem, 10vw, 9rem) !important;
	padding-bottom: clamp(5rem, 10vw, 9rem) !important;
}

.wp-block-post-content > .wp-block-group.alignwide:has(.kourylab-card) > h2 {
	max-width: 9ch;
	font-size: clamp(3rem, 7vw, 7rem);
	letter-spacing: -0.065em;
}

.kourylab-eyebrow {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.kourylab-card {
	position: relative;
	min-height: 22rem;
	overflow: hidden;
	background: var(--wp--preset--color--white);
	box-shadow: 10px 10px 0 color-mix(in srgb, var(--wp--preset--color--ink) 14%, transparent);
	transition: transform 180ms ease, box-shadow 180ms ease;
}

.kourylab-card::before {
	display: block;
	height: 8rem;
	margin: calc(-1 * var(--wp--preset--spacing--30)) calc(-1 * var(--wp--preset--spacing--30)) var(--wp--preset--spacing--30);
	background:
		radial-gradient(circle at 75% 40%, var(--wp--preset--color--signal) 0 18%, transparent 18.5%),
		linear-gradient(135deg, var(--wp--preset--color--electric), var(--wp--preset--color--mint));
	content: "";
}

.wp-block-column:nth-child(2) .kourylab-card::before {
	background:
		repeating-linear-gradient(135deg, transparent 0 14px, color-mix(in srgb, var(--wp--preset--color--ink) 20%, transparent) 14px 17px),
		var(--wp--preset--color--signal);
}

.wp-block-column:nth-child(3) .kourylab-card::before {
	background:
		linear-gradient(45deg, var(--wp--preset--color--ink) 25%, transparent 25% 75%, var(--wp--preset--color--ink) 75%),
		linear-gradient(45deg, var(--wp--preset--color--ink) 25%, var(--wp--preset--color--mint) 25% 75%, var(--wp--preset--color--ink) 75%);
	background-position: 0 0, 20px 20px;
	background-size: 40px 40px;
}

.kourylab-card h3 {
	font-size: clamp(1.65rem, 2.5vw, 2.5rem);
	letter-spacing: -0.04em;
}

.kourylab-card:hover {
	box-shadow: 8px 8px 0 var(--wp--preset--color--ink);
	transform: translate(-4px, -4px);
}

.wp-block-group.is-style-kourylab-frame {
	border: 2px solid var(--wp--preset--color--ink);
	box-shadow: var(--wp--preset--shadow--offset-small);
}

.wp-block-image.is-style-kourylab-offset-shadow img {
	box-shadow: var(--wp--preset--shadow--offset-large);
}

.wp-site-blocks > footer > .wp-block-group {
	position: relative;
	overflow: hidden;
}

.wp-site-blocks > footer > .wp-block-group::after {
	position: absolute;
	right: -3rem;
	bottom: -7rem;
	width: 18rem;
	height: 18rem;
	border: 2.5rem solid var(--wp--preset--color--signal);
	border-radius: 50%;
	content: "";
	opacity: 0.85;
}

@media (max-width: 781px) {
	.wp-block-post-content > .wp-block-group.alignfull:first-of-type {
		min-height: 68vh;
	}

	.wp-block-post-content > .wp-block-group.alignfull:first-of-type::before {
		top: auto;
		right: -8rem;
		bottom: 2rem;
		opacity: 0.42;
	}

	.wp-block-post-content > .has-ink-background-color .wp-block-column {
		border-right: 0;
		border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--paper) 24%, transparent);
	}

	.kourylab-card {
		min-height: auto;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}
