/* =====================================================================
   Putyak's — component variants (block style variations)
   Loaded on the front end (enqueued) and in the editor (add_editor_style),
   so what you pick in the sidebar looks identical everywhere.
   ===================================================================== */

/* Group: "Card" */
.wp-block-group.is-style-putyaks-card {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	padding: var(--wp--preset--spacing--40);
	box-shadow: var(--wp--preset--shadow--natural);
}

/* Group: "Card Outline" */
.wp-block-group.is-style-putyaks-card-outline {
	background: transparent;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	padding: var(--wp--preset--spacing--40);
}

/* Group: "Glass" */
.wp-block-group.is-style-putyaks-glass {
	background: color-mix(in srgb, var(--wp--preset--color--base) 65%, transparent);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 12%, transparent);
	border-radius: 16px;
	padding: var(--wp--preset--spacing--40);
}

/* Group: "Gradient" */
.wp-block-group.is-style-putyaks-gradient {
	background: var(--wp--preset--gradient--accent-soft);
	color: var(--wp--preset--color--base);
	border-radius: 16px;
	padding: var(--wp--preset--spacing--50);
}

/* Image: "Rounded" */
.wp-block-image.is-style-putyaks-rounded img {
	border-radius: 16px;
}

/* Image: "Circle" */
.wp-block-image.is-style-putyaks-circle img {
	border-radius: 999px;
	aspect-ratio: 1;
	object-fit: cover;
}

/* Button: "Ghost" */
.wp-block-button.is-style-putyaks-ghost .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--accent);
	border: 1px solid var(--wp--preset--color--accent);
}
.wp-block-button.is-style-putyaks-ghost .wp-block-button__link:hover {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
}

/* Button: "Pill" */
.wp-block-button.is-style-putyaks-pill .wp-block-button__link {
	border-radius: 999px;
}

/* Button: "Soft" */
.wp-block-button.is-style-putyaks-soft .wp-block-button__link {
	background: var(--wp--preset--color--accent-3);
	color: var(--wp--preset--color--accent-2);
}
.wp-block-button.is-style-putyaks-soft .wp-block-button__link:hover {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
}

/* Heading: "Underline Accent" */
.is-style-putyaks-underline {
	display: inline-block;
	padding-bottom: 0.25em;
	background-image: linear-gradient(var(--wp--preset--color--accent), var(--wp--preset--color--accent));
	background-position: 0 100%;
	background-size: 2.5rem 3px;
	background-repeat: no-repeat;
}

/* Separator: "Dots" */
.wp-block-separator.is-style-putyaks-dots {
	border: none;
	height: auto;
	text-align: center;
	max-width: none;
}
.wp-block-separator.is-style-putyaks-dots::before {
	content: "• • •";
	letter-spacing: 0.5em;
	color: var(--wp--preset--color--contrast-3);
}

/* Navigation: "Pill Links" */
.wp-block-navigation.is-style-putyaks-pill-links .wp-block-navigation-item__content {
	padding: 0.4rem 0.9rem;
	border-radius: 999px;
}
.wp-block-navigation.is-style-putyaks-pill-links .wp-block-navigation-item__content:hover {
	background: var(--wp--preset--color--surface);
}
