/*
Theme Name: Twenty Twenty-Five
Theme URI: https://wordpress.org/themes/twentytwentyfive/
Author: the WordPress team
Author URI: https://wordpress.org
Description: Twenty Twenty-Five emphasizes simplicity and adaptability. It offers flexible design options, supported by a variety of patterns for different page types, such as services and landing pages, making it ideal for building personal blogs, professional portfolios, online magazines, or business websites. Its templates cater to various blog styles, from text-focused to image-heavy layouts. Additionally, it supports international typography and diverse color palettes, ensuring accessibility and customization for users worldwide.
Requires at least: 6.7
Tested up to: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
a {
	text-decoration-thickness: 1px !important;
	text-underline-offset: .1em;
}

/* Focus styles */
:where(.wp-site-blocks *:focus) {
	outline-width: 2px;
	outline-style: solid;
}

/* Increase the bottom margin on submenus, so that the outline is visible. */
.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {
	margin-bottom: 3px;
}

/* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {
	outline-offset: 4px;
}

/* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */
.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	outline-offset: 0;
}

/*
 * Progressive enhancement to reduce widows and orphans
 * https://github.com/WordPress/gutenberg/issues/55190
 */
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {
	text-wrap: pretty;
}

/*
 * Change the position of the more block on the front, by making it a block level element.
 * https://github.com/WordPress/gutenberg/issues/65934
*/
.more-link {
	display: block;
}

/*
 * Futuristic footer (custom)
 */
.tt5-futuristic-footer {
	position: relative;
	overflow: hidden;
	color: var(--wp--preset--color--base);
}

.tt5-futuristic-footer::before {
	content: "";
	position: absolute;
	inset: -2px;
	pointer-events: none;
	background:
		radial-gradient(1200px 600px at 15% 0%, color-mix(in srgb, var(--wp--preset--color--accent-2) 22%, transparent), transparent 60%),
		radial-gradient(900px 500px at 85% 15%, color-mix(in srgb, var(--wp--preset--color--accent-1) 18%, transparent), transparent 65%),
		linear-gradient(135deg, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.2));
	opacity: 0.9;
}

.tt5-futuristic-footer .tt5-footer-surface {
	position: relative;
	border-radius: 28px;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--base) 12%, transparent);
	background:
		linear-gradient(180deg, color-mix(in srgb, var(--wp--preset--color--contrast) 94%, transparent), color-mix(in srgb, var(--wp--preset--color--contrast) 82%, transparent)),
		repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.04) 1px, transparent 1px, transparent 22px);
	box-shadow:
		0 24px 70px rgba(0, 0, 0, 0.55),
		0 0 0 1px rgba(255, 255, 255, 0.04) inset;
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
}

.tt5-futuristic-footer .tt5-footer-surface::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	border-radius: inherit;
	background: radial-gradient(600px 140px at 10% 0%, rgba(255, 255, 255, 0.10), transparent 65%);
}

.tt5-futuristic-footer .tt5-footer-brand p {
	max-width: 36ch;
	opacity: 0.9;
}

.tt5-futuristic-footer h2,
.tt5-futuristic-footer h3 {
	letter-spacing: 0.2px;
	text-shadow: 0 0 18px rgba(115, 230, 255, 0.22);
}

.tt5-futuristic-footer a {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}

.tt5-futuristic-footer a:hover {
	text-decoration-thickness: 2px;
}

.tt5-futuristic-footer :where(a, button, .wp-block-button__link):focus-visible {
	outline: 2px solid color-mix(in srgb, var(--wp--preset--color--accent-1) 70%, white);
	outline-offset: 3px;
}

.tt5-futuristic-footer .tt5-footer-cols {
	gap: clamp(18px, 3vw, 42px);
}

.tt5-futuristic-footer .wp-block-navigation a {
	opacity: 0.92;
}

.tt5-futuristic-footer .wp-block-navigation a:hover {
	opacity: 1;
}

.tt5-futuristic-footer .tt5-footer-sep {
	margin-top: clamp(24px, 4vw, 44px);
	margin-bottom: clamp(18px, 3vw, 28px);
	height: 1px;
	border: 0;
	background: linear-gradient(
		90deg,
		transparent,
		color-mix(in srgb, var(--wp--preset--color--accent-1) 45%, transparent),
		color-mix(in srgb, var(--wp--preset--color--accent-2) 40%, transparent),
		transparent
	);
}

.tt5-futuristic-footer .wp-block-social-links {
	margin-top: 0.35rem;
}

.tt5-futuristic-footer .wp-block-social-link a {
	border-radius: 999px;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--base) 14%, transparent);
	background: rgba(255, 255, 255, 0.04);
	transition: transform 140ms ease, background-color 140ms ease;
}

.tt5-futuristic-footer .wp-block-social-link a:hover {
	transform: translateY(-1px);
	background: rgba(255, 255, 255, 0.07);
}

.tt5-futuristic-footer .tt5-neon-button .wp-block-button__link {
	border-radius: 999px;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--accent-1) 45%, transparent);
	background: linear-gradient(
		135deg,
		rgba(255, 238, 88, 0.16),
		rgba(246, 207, 244, 0.10)
	);
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.05) inset, 0 10px 28px rgba(0, 0, 0, 0.35);
}

.tt5-futuristic-footer .tt5-neon-button .wp-block-button__link:hover {
	border-color: color-mix(in srgb, var(--wp--preset--color--accent-2) 55%, transparent);
	background: linear-gradient(
		135deg,
		rgba(255, 238, 88, 0.22),
		rgba(246, 207, 244, 0.16)
	);
}

.tt5-futuristic-footer .tt5-footer-bottom {
	opacity: 0.85;
}

@media (max-width: 600px) {
	.tt5-futuristic-footer .tt5-footer-surface {
		border-radius: 22px;
	}
}

