@charset "UTF-8";
/* Różana 16 - Dedicated Mobile Stylesheet
   Applied exclusively on viewports <= 991px
   Strictly sharp corners (border-radius: 0) matching original brand identity */

@media screen and (max-width: 991px) {

	*,
	*:before,
	*:after {
		box-sizing: border-box;
	}

	html,
	body {
		margin: 0;
		padding: 0;
		width: 100%;
		max-width: 100%;
		overflow-x: hidden;
		overflow-anchor: none;
	}

	html {
		background-attachment: scroll !important;
		-webkit-background-size: cover !important;
		-moz-background-size: cover !important;
		-o-background-size: cover !important;
		background-size: cover !important;
	}

	.main {
		text-align: center;
		width: 100%;
		max-width: 100%;
		margin: 0 auto;
		padding: 0 8px;
		box-sizing: border-box;
	}

	/* Top Header on Mobile */
	.top {
		min-width: 0 !important;
		width: 100% !important;
		height: auto !important;
		background-color: transparent !important;
		display: flex !important;
		flex-direction: column !important;
		align-items: center !important;
		padding: 0 !important;
		margin: 0 0 10px 0 !important;
	}

	/* Desktop Menu is hidden on mobile */
	.desktop-menu-wrapper,
	.menu {
		display: none !important;
	}

	/* Mobile Header Bar */
	.mobile-header-bar {
		display: flex !important;
		width: 100%;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		background-color: #330000;
		border-bottom: 2px solid #66cc00;
		padding: 8px 12px;
		box-sizing: border-box;
	}

	/* Mobile Header Buttons - Unified base styles */
	.mobile-call-btn,
	.mobile-call-btn:link,
	.mobile-call-btn:visited,
	.mobile-menu-btn,
	.mobile-menu-btn:link,
	.mobile-menu-btn:visited {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		gap: 8px;
		height: 42px !important;
		flex: 1 1 0 !important;
		max-width: 220px !important;
		padding: 0 10px !important;
		background-color: #66cc00 !important;
		background-image: none !important;
		color: #ffffff !important;
		font-family: Arial, Helvetica, sans-serif !important;
		font-size: 14px !important;
		font-weight: bold !important;
		font-variant: normal !important;
		letter-spacing: 0.5px;
		text-transform: uppercase !important;
		text-decoration: none !important;
		line-height: 1 !important;
		white-space: nowrap !important;
		border: 1px solid #70ad2e !important;
		border-radius: 0 !important;
		box-sizing: border-box !important;
		cursor: pointer;
		outline: none !important;
		box-shadow: none !important;
		-webkit-tap-highlight-color: transparent;
		transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
	}

	.mobile-call-btn span,
	.mobile-menu-btn span {
		font-family: Arial, Helvetica, sans-serif !important;
		font-size: 14px !important;
		font-weight: bold !important;
		font-variant: normal !important;
		line-height: 1 !important;
		white-space: nowrap !important;
	}

	.mobile-call-btn .call-icon {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		font-size: 15px !important;
		line-height: 1 !important;
	}

	.mobile-call-btn:focus,
	.mobile-menu-btn:focus {
		outline: none !important;
	}

	/* Force return to normal green style when not actively pressed and menu is closed (even if focused) */
	.mobile-call-btn:focus:not(:active):not(.is-calling),
	.mobile-menu-btn:focus:not(:active):not(.is-active) {
		background-color: #66cc00 !important;
		background-image: none !important;
		color: #ffffff !important;
		border: 1px solid #70ad2e !important;
		box-shadow: none !important;
	}

	.mobile-call-btn:focus:not(:active):not(.is-calling) span {
		color: #ffffff !important;
	}

	.mobile-menu-btn:focus:not(:active):not(.is-active) .hamburger-icon span {
		background: #ffffff !important;
	}

	.mobile-menu-btn .hamburger-icon {
		display: inline-block;
		width: 18px;
		height: 13px;
		position: relative;
		vertical-align: middle;
		flex-shrink: 0;
	}

	.mobile-menu-btn .hamburger-icon span {
		display: block;
		position: absolute;
		height: 2px;
		width: 100%;
		background: #ffffff !important;
		left: 0;
		transition: all 0.25s ease-in-out;
	}

	.mobile-menu-btn .hamburger-icon span:nth-child(1) {
		top: 0px;
	}

	.mobile-menu-btn .hamburger-icon span:nth-child(2) {
		top: 5px;
	}

	.mobile-menu-btn .hamburger-icon span:nth-child(3) {
		top: 10px;
	}

	/* Active / Touched / Clicked / Menu Open State - Brown Gradient */
	.mobile-call-btn:active,
	.mobile-call-btn.is-calling,
	.mobile-menu-btn:active,
	.mobile-menu-btn.is-active {
		background-color: #330000 !important;
		background-image: -webkit-linear-gradient(top right, #660000 0%, #330000 100%) !important;
		background-image: linear-gradient(to bottom left, #660000 0%, #330000 100%) !important;
		color: #66cc00 !important;
		border: 1px solid #66cc00 !important;
		box-shadow: 0px 0px 10px rgba(30, 0, 0, 1) !important;
	}

	.mobile-call-btn:active span,
	.mobile-call-btn.is-calling span {
		color: #66cc00 !important;
	}

	.mobile-menu-btn:active .hamburger-icon span,
	.mobile-menu-btn.is-active .hamburger-icon span {
		background: #66cc00 !important;
	}

	.mobile-menu-btn.is-active .hamburger-icon span:nth-child(1) {
		top: 5px;
		transform: rotate(135deg);
	}

	.mobile-menu-btn.is-active .hamburger-icon span:nth-child(2) {
		opacity: 0;
		left: -20px;
	}

	.mobile-menu-btn.is-active .hamburger-icon span:nth-child(3) {
		top: 5px;
		transform: rotate(-135deg);
	}

	/* Mouse hover only on devices with pointer/hover support (prevents sticky hover on mobile touchscreens) */
	@media (hover: hover) and (pointer: fine) {

		.mobile-call-btn:hover,
		.mobile-menu-btn:hover {
			background-color: #330000 !important;
			background-image: -webkit-linear-gradient(top right, #660000 0%, #330000 100%) !important;
			background-image: linear-gradient(to bottom left, #660000 0%, #330000 100%) !important;
			color: #66cc00 !important;
			border: 1px solid #66cc00 !important;
			box-shadow: 0px 0px 10px rgba(30, 0, 0, 1) !important;
		}

		.mobile-call-btn:hover span {
			color: #66cc00 !important;
		}

		.mobile-menu-btn:hover .hamburger-icon span {
			background: #66cc00 !important;
		}
	}

	/* Logo Block on Mobile */
	.logo {
		float: none !important;
		width: 100% !important;
		min-width: 0 !important;
		height: auto !important;
		background-color: #ffffff !important;
		text-align: center !important;
		padding: 10px 8px !important;
		border-radius: 0 !important;
		box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
	}

	.logo-link {
		display: inline-block !important;
		max-width: 100% !important;
		text-decoration: none !important;
		cursor: pointer !important;
	}

	.logo img {
		max-width: 90%;
		height: auto;
	}

	.logo .title {
		display: block;
		font-size: 13px !important;
		line-height: 1.35;
		margin-top: 4px;
		color: #66cc00 !important;
	}

	/* Mobile Expandable Navigation Grid - Smooth Roll/Slide Animation */
	.mobile-nav-panel {
		display: grid !important;
		grid-template-rows: 0fr;
		max-height: 0;
		width: 100%;
		background: #250000;
		border: 0px solid #66cc00;
		border-radius: 0 !important;
		box-sizing: border-box;
		padding: 0 8px;
		margin-top: 0;
		margin-bottom: 0;
		opacity: 0;
		visibility: hidden;
		transform: translateY(-16px);
		box-shadow: none;
		overflow: hidden;
		transition: grid-template-rows 0.35s cubic-bezier(0.25, 1, 0.5, 1),
			max-height 0.35s cubic-bezier(0.25, 1, 0.5, 1),
			opacity 0.28s ease,
			transform 0.35s cubic-bezier(0.25, 1, 0.5, 1),
			padding 0.35s ease,
			margin 0.35s ease,
			border-width 0.25s ease,
			box-shadow 0.3s ease,
			visibility 0.35s ease;
	}

	.mobile-nav-panel.is-open {
		grid-template-rows: 1fr;
		max-height: 600px;
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		border: 2px solid #66cc00 !important;
		border-top: 2px solid #66cc00 !important;
		padding: 8px;
		margin-top: 4px;
		margin-bottom: 10px;
		box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
	}

	.mobile-nav-grid {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 8px;
		width: 100%;
		min-height: 0;
		overflow: hidden;
		box-sizing: border-box;
	}

	@media screen and (min-width: 560px) and (max-width: 991px) {
		.mobile-nav-grid {
			grid-template-columns: repeat(3, 1fr);
		}
	}

	.mobile-nav-item {
		display: flex !important;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		background-color: #330000;
		border: 1px solid #4d0000;
		border-radius: 0 !important;
		padding: 10px 6px;
		text-decoration: none !important;
		color: #ffffff !important;
		font-size: 15px !important;
		font-weight: bold;
		font-variant: small-caps;
		transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, transform 0.35s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.3s ease;
		min-height: 75px;
		transform: translateY(-8px);
		opacity: 0.7;
	}

	.mobile-nav-panel.is-open .mobile-nav-item {
		transform: translateY(0);
		opacity: 1;
	}

	.mobile-nav-item img {
		height: 32px;
		width: auto;
		margin-bottom: 5px;
	}

	.mobile-nav-item:hover,
	.mobile-nav-item:active {
		background-color: #330000 !important;
		background-image: -webkit-linear-gradient(top right, #660000 0%, #330000 100%) !important;
		background-image: linear-gradient(to bottom left, #660000 0%, #330000 100%) !important;
		color: #66cc00 !important;
		border-color: #66cc00 !important;
		box-shadow: 0px 0px 10px rgba(30, 0, 0, 1) !important;
		text-decoration: none !important;
	}

	.mobile-nav-item.active-tab {
		background-color: #330000 !important;
		background-image: -webkit-linear-gradient(top right, #660000 0%, #330000 100%) !important;
		background-image: linear-gradient(to bottom left, #660000 0%, #330000 100%) !important;
		border-color: #66cc00 !important;
		color: #66cc00 !important;
		box-shadow: 0px 0px 10px rgba(30, 0, 0, 1) !important;
	}

	/* Middle Section Layout on Mobile */
	.middle {
		min-width: 0 !important;
		width: 100% !important;
		height: auto !important;
		display: flex;
		flex-direction: column !important;
		align-items: center !important;
	}

	.middle[style*="display: none"],
	.middle[style*="display:none"] {
		display: none !important;
	}

	.left,
	.right {
		float: none !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: 100% !important;
		text-align: center !important;
	}

	.left {
		order: 1;
	}

	.right {
		order: 2;
	}

	/* Slideshow Banner on Mobile */
	.flower {
		float: none !important;
		width: 100% !important;
		max-width: 540px !important;
		height: 150px !important;
		margin: 8px auto !important;
		padding: 0 !important;
		background-color: #ffffff !important;
		border-radius: 0 !important;
		box-shadow: 0 3px 12px rgba(0, 0, 0, 0.35);
		overflow: hidden;
	}

	.flower img {
		border-radius: 0 !important;
	}

	/* Content Container & Iframe on Mobile */
	.content {
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		min-height: 480px !important;
		margin: 10px auto 0 auto !important;
		background-color: #ffffff !important;
		border-radius: 0 !important;
		box-shadow: 0 3px 12px rgba(0, 0, 0, 0.35);
		box-sizing: border-box;
		overflow: visible !important;
	}

	#contentframe {
		width: 100% !important;
		min-height: 480px;
		height: 480px;
		border: 0 !important;
		display: block;
		-webkit-overflow-scrolling: touch;
	}

	/* Gallery Container on Mobile */
	.gallery {
		min-width: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 10px auto !important;
		padding: 10px !important;
		box-sizing: border-box;
		border-radius: 0 !important;
		box-shadow: 0 3px 12px rgba(0, 0, 0, 0.35);
	}

	/* Footer on Mobile */
	.bottom {
		min-width: 0 !important;
		width: 100% !important;
		height: auto !important;
		min-height: 0 !important;
		max-height: none !important;
		display: flex;
		flex-direction: column !important;
		align-items: center !important;
		padding: 10px 0 25px 0 !important;
	}

	.bottom[style*="display: none"],
	.bottom[style*="display:none"] {
		display: none !important;
	}

	.bottom .left,
	.bottom .right {
		float: none !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: 100% !important;
		text-align: center !important;
		order: unset !important;
	}

	.copyright {
		float: none !important;
		width: 100% !important;
		max-width: 540px !important;
		height: auto !important;
		min-height: 0 !important;
		max-height: none !important;
		margin: 8px auto !important;
		padding: 12px 10px !important;
		border-radius: 0 !important;
		box-sizing: border-box;
	}

	.info {
		float: none !important;
		width: 100% !important;
		max-width: 540px !important;
		height: auto !important;
		min-height: 0 !important;
		max-height: none !important;
		margin: 6px auto !important;
		padding: 12px 10px !important;
		border-radius: 0 !important;
		box-sizing: border-box;
	}

	.tekstcopy,
	.tekstinfo {
		line-height: 1.45;
	}

	.contactLink {
		display: inline-block;
		padding: 4px 6px;
	}

	/* Gallery Loading Spinner on Mobile */
	#lg {
		position: relative !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		width: 100% !important;
		text-align: center !important;
		margin: 40px auto !important;
		z-index: 1000;
	}

	#lgin {
		margin: 0 auto !important;
		text-align: center !important;
		width: 150px !important;
		height: auto !important;
		min-height: 120px !important;
		padding: 16px 12px !important;
		background-color: #ffffff !important;
		border-radius: 0 !important;
		box-shadow: 0 3px 12px rgba(0, 0, 0, 0.35);
	}

}