/*
Theme Name: Furkan Kütük
Description: A custom block theme scaffolded by Studio Code.
Requires at least: 6.7
Tested up to: 6.9
Requires PHP: 7.2
Version: 0.1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: furkan-kutuk
Tags: full-site-editing, block-patterns, block-styles, wide-blocks, accessibility-ready, style-variations
*/

/* WordPress inserts margin-block-start: var(--wp--style--block-gap) between the
   template's top-level sections (header part, main, footer part) — a gap that
   exists even when no markup asks for it. Zero it so sections butt edge-to-edge
   and own their vertical rhythm via padding; this does not affect block gaps
   inside nested layouts. */
.wp-site-blocks > * + * {
	margin-block-start: 0;
}

:root {
	--site-ink: var( --wp--preset--color--contrast );
	--site-muted: var( --wp--preset--color--contrast-2 );
	--site-paper: var( --wp--preset--color--base );
	--site-surface: var( --wp--preset--color--base-2 );
	--site-rust: var( --wp--preset--color--accent );
	--site-gold: var( --wp--preset--color--accent-2 );
	--site-signal: var( --wp--preset--color--accent-3 );
	--bevel-light: rgba( 255, 255, 255, 0.85 );
	--bevel-dark: rgba( 0, 0, 0, 0.55 );
}

body {
	background-color: var( --site-paper );
	background-image: radial-gradient( var( --bevel-dark ) 1px, transparent 1px );
	background-size: 22px 22px;
	background-attachment: fixed;
}

/* === intro (boot screen) === */
.site-intro {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var( --site-ink );
	opacity: 1;
	transition: opacity 0.5s ease;
}
.site-intro--done {
	opacity: 0;
	pointer-events: none;
}
.site-intro--no-transition {
	transition: none;
}
.site-intro__scan {
	position: absolute;
	inset: 0;
	background: repeating-linear-gradient( 0deg, rgba( 255, 255, 255, 0.06 ) 0, rgba( 255, 255, 255, 0.06 ) 1px, transparent 1px, transparent 3px );
	pointer-events: none;
}
.site-intro__panel {
	position: relative;
	z-index: 1;
	text-align: center;
	padding: 2rem;
}
.site-intro__label {
	font-family: var( --wp--preset--font-family--body );
	font-size: var( --wp--preset--font-size--small );
	text-transform: uppercase;
	letter-spacing: 0.2em;
	color: var( --wp--preset--color--base-2 );
	margin: 0 0 1rem;
}
.site-intro__mark {
	font-family: var( --wp--preset--font-family--display );
	font-size: clamp( 3.5rem, 12vw, 6rem );
	line-height: 1;
	color: var( --wp--preset--color--base );
	text-shadow: 4px 4px 0 var( --site-rust ), -4px -4px 0 var( --site-gold );
	margin: 0 0 1.75rem;
	animation: site-intro-flicker 1.6s steps( 1 ) infinite;
}
.site-intro__bar {
	width: min( 280px, 70vw );
	height: 22px;
	margin: 0 auto;
	background: var( --wp--preset--color--contrast-2 );
	border: 3px solid var( --wp--preset--color--base-2 );
	box-shadow: 3px 3px 0 var( --bevel-dark );
	padding: 2px;
}
.site-intro__bar-fill {
	height: 100%;
	width: 0%;
	background: linear-gradient( 90deg, var( --site-rust ), var( --site-signal ) );
	transition: width 0.15s linear;
}
.site-intro__status {
	font-family: var( --wp--preset--font-family--body );
	font-size: var( --wp--preset--font-size--small );
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var( --wp--preset--color--base-2 );
	margin: 0.9rem 0 0;
}
@keyframes site-intro-flicker {
	0%, 22%, 24%, 100% { opacity: 1; }
	23% { opacity: 0.6; }
}
@media ( prefers-reduced-motion: reduce ) {
	.site-intro,
	.site-intro__mark,
	.site-intro__bar-fill {
		animation: none !important;
		transition: none !important;
	}
}

/* Chunky 90s beveled button: light edge top/left, dark edge bottom/right,
   pressed state inverts the bevel so it reads as pushed in. */
.wp-element-button {
	border-radius: 0 !important;
	box-shadow: inset 2px 2px 0 var( --bevel-light ), inset -2px -2px 0 var( --bevel-dark ), 4px 4px 0 var( --site-ink ) !important;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	transition: transform 0.1s ease, box-shadow 0.1s ease;
}
.wp-element-button:active {
	transform: translate( 3px, 3px );
	box-shadow: inset -2px -2px 0 var( --bevel-light ), inset 2px 2px 0 var( --bevel-dark ), 1px 1px 0 var( --site-ink ) !important;
}
@media ( prefers-reduced-motion: reduce ) {
	.wp-element-button {
		transition: none;
	}
}

/* === header === */
.site-header {
	background: var( --site-surface );
	border-bottom: 3px solid var( --site-ink );
	box-shadow: inset 0 -2px 0 var( --bevel-dark );
}
.site-header__title a,
.site-header__title {
	font-family: var( --wp--preset--font-family--display );
	font-size: var( --wp--preset--font-size--medium );
	color: var( --site-ink );
	text-decoration: none;
	letter-spacing: 0.02em;
	text-shadow: 2px 2px 0 var( --site-gold );
}
.site-header__nav {
	font-family: var( --wp--preset--font-family--body );
	font-size: var( --wp--preset--font-size--small );
	text-transform: uppercase;
	letter-spacing: 0.06em;
	gap: 0.5rem !important;
}
.site-header__nav a {
	color: var( --site-ink );
	text-decoration: none;
	background: var( --site-paper );
	padding: 0.4rem 0.75rem;
	border: 2px solid var( --site-ink );
	box-shadow: inset 1px 1px 0 var( --bevel-light ), inset -1px -1px 0 var( --bevel-dark );
	display: inline-block;
}
.site-header__nav a:hover {
	color: var( --site-ink );
	background: var( --site-signal );
}
/* === hero === */
.hero-cover::after {
	content: "";
	position: absolute;
	inset: 0;
	background: repeating-linear-gradient( 0deg, rgba( 0, 0, 0, 0.15 ) 0, rgba( 0, 0, 0, 0.15 ) 1px, transparent 1px, transparent 3px );
	pointer-events: none;
}
.hero-cover .wp-block-cover__inner-container {
	width: 100%;
	max-width: var( --wp--style--global--content-size, 760px );
	margin-inline: auto;
	padding-inline: clamp( 1.25rem, 5vw, 3rem );
	position: relative;
	z-index: 2;
}
.hero-cover .wp-block-cover__background,
.hero-cover > img {
	z-index: 0;
}
.hero-cover::after {
	z-index: 1;
}
.hero-eyebrow {
	font-family: var( --wp--preset--font-family--body );
	font-size: var( --wp--preset--font-size--small );
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var( --site-ink );
	background: var( --site-signal );
	display: inline;
	padding: 0.25rem 0.6rem;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
	margin: 0;
}
.hero-title {
	color: var( --wp--preset--color--base );
	text-shadow: 3px 3px 0 var( --site-rust ), 6px 6px 0 var( --site-gold );
	margin: 1.25rem 0 1.5rem;
}
.wp-block-button.is-style-outline .wp-block-button__link {
	border-width: 3px;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background-color: var( --wp--preset--color--base );
	color: var( --wp--preset--color--contrast );
	border-color: var( --wp--preset--color--base );
}
.hero-tagline {
	color: var( --wp--preset--color--base );
	max-width: 34ch;
	margin: 0 0 2rem;
	background: var( --site-ink );
	display: inline;
	padding: 0.2rem 0.5rem;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
	line-height: 1.8;
}
/* === about === */
.about-section {
	background-image: linear-gradient( 135deg, var( --site-surface ) 25%, transparent 25% ), linear-gradient( 225deg, var( --site-surface ) 25%, transparent 25% );
	background-size: 40px 40px;
	background-color: var( --site-paper );
}
.about-media-text {
	max-width: var( --wp--style--global--wide-size, 1240px );
	margin-inline: auto;
	align-items: center;
}
.about-media-text .wp-block-media-text__content {
	background: var( --site-paper );
	border: 3px solid var( --site-ink );
	box-shadow: 6px 6px 0 var( --site-ink );
	padding: clamp( 1.5rem, 3vw, 2.5rem ) !important;
}
.about-media-text .wp-block-media-text__media img {
	border: 3px solid var( --site-ink );
	box-shadow: 8px 8px 0 var( --site-rust );
}
.section-eyebrow {
	font-family: var( --wp--preset--font-family--body );
	font-size: var( --wp--preset--font-size--small );
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var( --wp--preset--color--base-2 );
	background: var( --site-rust );
	display: inline-block;
	padding: 0.25rem 0.6rem;
	margin: 0 0 1rem;
}
/* === featured === */
.featured-section {
	background: var( --site-surface );
}
.featured-section .work-grid {
	gap: clamp( 2rem, 3vw, 2.75rem );
}
.work-card__category {
	font-size: var( --wp--preset--font-size--small );
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var( --wp--preset--color--base-2 );
	background: var( --site-ink );
	margin: 0 -1.25rem 1rem;
	padding: 0.6rem 1.25rem;
}
.work-card .wp-block-heading {
	margin: 0 0 0.5rem;
	font-size: var( --wp--preset--font-size--medium );
}
.work-card p:not( .work-card__category ) {
	color: var( --site-muted );
	margin: 0;
}
/* === cta === */
.cta-section {
	background: linear-gradient( 120deg, var( --site-rust ), var( --site-gold ) ) !important;
	border-top: 3px solid var( --site-ink );
	border-bottom: 3px solid var( --site-ink );
}
.cta-section .wp-block-heading {
	max-width: 20ch;
	margin-inline: auto;
	text-shadow: 3px 3px 0 var( --site-ink );
}
.cta-section p {
	max-width: 40ch;
	margin-inline: auto;
	color: var( --wp--preset--color--contrast );
	font-weight: 700;
}
/* === footer === */
.site-footer {
	border-top: 3px solid var( --site-signal );
}
.site-footer__title {
	font-family: var( --wp--preset--font-family--display );
	font-size: var( --wp--preset--font-size--medium );
}
.site-footer__meta {
	font-size: var( --wp--preset--font-size--small );
	color: var( --wp--preset--color--base-2 );
	margin: 0;
}
/* === blog === */
.blog-hero {
	background-image: radial-gradient( rgba( 255, 255, 255, 0.12 ) 1.5px, transparent 1.5px );
	background-size: 22px 22px;
}
.wp-block-post-template.blog-grid {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 260px, 1fr ) );
	gap: clamp( 2rem, 3vw, 2.75rem );
	list-style: none;
	margin: 0;
	padding: 0;
}
.blog-card__date {
	display: block;
	font-size: var( --wp--preset--font-size--small );
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var( --wp--preset--color--base-2 );
	background: var( --site-ink );
	margin: 0 -1.25rem 1rem;
	padding: 0.6rem 1.25rem;
}
.blog-card h3.wp-block-post-title {
	margin: 0 0 0.5rem;
}
.blog-card h3.wp-block-post-title a {
	color: var( --site-ink );
	text-decoration: none;
}
.blog-card .wp-block-post-excerpt {
	color: var( --site-muted );
}
.blog-card .wp-block-post-excerpt__excerpt {
	margin: 0;
}
.blog-card .wp-block-post-excerpt__more-link {
	display: inline-block;
	margin-top: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var( --site-rust );
}

/* === single post === */
.single-header {
	border-bottom: 3px solid var( --site-ink );
}
.single-date {
	display: block;
	font-size: var( --wp--preset--font-size--small );
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var( --site-rust );
	margin-top: 0.75rem;
}
.single .entry-header,
.single .entry-content {
	max-width: var( --wp--style--global--content-size, 760px );
	margin-inline: auto;
}
.wp-block-post-featured-image img {
	border: 3px solid var( --site-ink );
	box-shadow: 8px 8px 0 var( --site-rust );
}
.wp-block-post-content blockquote {
	border: 3px solid var( --site-ink );
	border-left: 8px solid var( --site-rust );
	background: var( --site-surface );
	padding: 1.5rem;
	font-family: var( --wp--preset--font-family--display );
}

/* === card style variation === */
.is-style-card {
	background: var( --site-paper );
	border: 3px solid var( --site-ink );
	box-shadow: 7px 7px 0 var( --site-ink );
	padding: 1.25rem;
	height: 100%;
}
.is-style-card .wp-block-image,
.is-style-card .wp-block-post-featured-image {
	margin: -1.25rem -1.25rem 0;
}
.is-style-card .wp-block-image img,
.is-style-card .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	border-radius: 0;
	border-bottom: 3px solid var( --site-ink );
	box-shadow: none;
}
/* === responsive === */
@media ( max-width: 782px ) {
	.hero-cover {
		min-height: 560px !important;
	}
	.site-header__nav {
		font-size: var( --wp--preset--font-size--small );
	}
	.is-style-card.work-card,
	.about-media-text .wp-block-media-text__content {
		box-shadow: 4px 4px 0 var( --site-ink );
	}
}