/**, *::before, *::after {transition-duration: 300ms;}*/

[data-loading="1"] {position: relative; pointer-events: none;}
[data-loading="1"]::before {content: ''; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-color: rgba(255,255,255,0.75);}
[data-loading="1"]::after {content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); border: 5px solid #f3f3f3; border-top: 5px solid var(--brown); border-radius: 50%; width: 20px; height: 20px; animation: ButtonLoading 2s linear infinite;}

@keyframes ButtonLoading {
	0% { transform: translate(-50%, -50%) rotate(0deg); }
	100% { transform: translate(-50%, -50%) rotate(360deg); }
}

/* AI created, model - claude-4.6-opus */
.Button { transition: opacity 200ms, transform 100ms; }
.Button:hover { opacity: 0.85; }
.Button:active { transform: scale(0.97); }
input:not([type="checkbox"]):not([type="radio"]):focus, select:focus, textarea:focus { outline: 2px solid var(--brown); outline-offset: 2px; }
[data-click-link] { transition: background-color 200ms; }
[data-click-link]:hover { background-color: rgba(136, 92, 69, 0.06); }
.Minibutton:hover, .CancelSubscriptionButton:hover, .SmallButton:hover, .SmallestButton:hover { opacity: 0.7; }
.Delete:hover { opacity: 0.6; }
.Head nav a { transition: opacity 200ms; }
.Head nav a:hover { opacity: 0.7; }
.Socials a { transition: opacity 200ms; }
.Socials a:hover { opacity: 0.7; }
a.ProductsItem, a.ContentItem { transition: box-shadow 200ms, transform 200ms; }
a.ProductsItem:hover, a.ContentItem:hover { box-shadow: 0 4px 12px rgba(136, 92, 69, 0.15); transform: translateY(-2px); }
.Dialog {position: fixed; left: 0; top: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.3); display: flex; justify-content: center; align-items: center; padding: 20px 10px; backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); z-index: 3;}
.DialogContent {position: fixed; top: 50%; left: 50%; max-width: min(95%, 800px); transform: translateX(-50%) translateY(-50%); background-color: var(--bg-color); border-radius: 20px; padding: 20px; text-align: center;}

.DialogContent h2 {margin-bottom: 25px;}
.DialogContent p {margin-bottom: 15px;}

.Dialog .ButtonsBox {display: flex; gap: 10px; flex-wrap: wrap; justify-content: center;}#Foot {
	& {position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; background-image: linear-gradient(to bottom, var(--bg-color), var(--bg-color) 100px, transparent 150px);}
	.Bg {position: absolute; right: 0; bottom: 0; width: 100%; height: auto; z-index: -1; object-fit: cover; object-position: bottom right;}
	.LINK-V {max-width: max-content; margin-left: auto; margin-right: auto; margin-bottom: 15px;}
	.LINK-V a {color: white; font-weight: normal; text-shadow: 1px 1px 4px black;}
	.Container {padding-top: 185px; margin-bottom: 145px;}

	.Contacts a {margin-bottom: 8px; font-size: 16px; display: inline-block;}
	.Socials {display: flex; gap: 5px; margin-top: 16px;}
	.Socials a {flex: 0 0 28px; height: 28px; display: flex; align-items: center; justify-content: center;}
	.Socials img {max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain;}

	.NewsletterSignup {
		--input-border: var(--brown);
		--font-color: var(--brown);
		--submit-color: var(--brown);
		max-width: 281px;
	}
	.NewsletterSignup .ButtonBox {text-align: right;}

	@media (min-width: 800px) {
		.Container {display: flex; width: 100%; justify-content: space-between;}
	}
	@media (max-width: 800px) {
		.Container {margin-bottom: 70px; padding-top: 70px; text-align: center;}
		.NewsletterSignup .Button {width: 100%;}
		.Socials {justify-content: center;}
		.Container > * + * {margin-top: 40px;}
	}

	/* AI created, model - claude-4.6-opus */
	.LINK-V a:hover, .Contacts a:hover { text-decoration: underline; }
}/**, *::before, *::after {transition-duration: 300ms;}*/

[data-loading="1"] {position: relative; pointer-events: none;}
[data-loading="1"]::before {content: ''; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-color: rgba(255,255,255,0.75);}
[data-loading="1"]::after {content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); border: 5px solid #f3f3f3; border-top: 5px solid var(--brown); border-radius: 50%; width: 20px; height: 20px; animation: ButtonLoading 2s linear infinite;}

@keyframes ButtonLoading {
	0% { transform: translate(-50%, -50%) rotate(0deg); }
	100% { transform: translate(-50%, -50%) rotate(360deg); }
}

/* AI created, model - claude-4.6-opus */
.Button { transition: opacity 200ms, transform 100ms; }
.Button:hover { opacity: 0.85; }
.Button:active { transform: scale(0.97); }
input:not([type="checkbox"]):not([type="radio"]):focus, select:focus, textarea:focus { outline: 2px solid var(--brown); outline-offset: 2px; }
[data-click-link] { transition: background-color 200ms; }
[data-click-link]:hover { background-color: rgba(136, 92, 69, 0.06); }
.Minibutton:hover, .CancelSubscriptionButton:hover, .SmallButton:hover, .SmallestButton:hover { opacity: 0.7; }
.Delete:hover { opacity: 0.6; }
.Head nav a { transition: opacity 200ms; }
.Head nav a:hover { opacity: 0.7; }
.Socials a { transition: opacity 200ms; }
.Socials a:hover { opacity: 0.7; }
a.ProductsItem, a.ContentItem { transition: box-shadow 200ms, transform 200ms; }
a.ProductsItem:hover, a.ContentItem:hover { box-shadow: 0 4px 12px rgba(136, 92, 69, 0.15); transform: translateY(-2px); }#Foot {
	& {position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; background-image: linear-gradient(to bottom, var(--bg-color), var(--bg-color) 100px, transparent 150px);}
	.Bg {position: absolute; right: 0; bottom: 0; width: 100%; height: auto; z-index: -1; object-fit: cover; object-position: bottom right;}
	.LINK-V {max-width: max-content; margin-left: auto; margin-right: auto; margin-bottom: 15px;}
	.LINK-V a {color: white; font-weight: normal; text-shadow: 1px 1px 4px black;}
	.Container {padding-top: 185px; margin-bottom: 145px;}

	.Contacts a {margin-bottom: 8px; font-size: 16px; display: inline-block;}
	.Socials {display: flex; gap: 5px; margin-top: 16px;}
	.Socials a {flex: 0 0 28px; height: 28px; display: flex; align-items: center; justify-content: center;}
	.Socials img {max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain;}

	.NewsletterSignup {
		--input-border: var(--brown);
		--font-color: var(--brown);
		--submit-color: var(--brown);
		max-width: 281px;
	}
	.NewsletterSignup .ButtonBox {text-align: right;}

	@media (min-width: 800px) {
		.Container {display: flex; width: 100%; justify-content: space-between;}
	}
	@media (max-width: 800px) {
		.Container {margin-bottom: 70px; padding-top: 70px; text-align: center;}
		.NewsletterSignup .Button {width: 100%;}
		.Socials {justify-content: center;}
		.Container > * + * {margin-top: 40px;}
	}

	/* AI created, model - claude-4.6-opus */
	.LINK-V a:hover, .Contacts a:hover { text-decoration: underline; }
}/* AI created, model - claude-4.6-opus */
#Intro .Trio a img { transition: transform 400ms; }
#Intro .Trio a:hover img { transform: scale(1.05); }
