/* =========================================================
 * PRESS 365 — Footer
 * Version: 1.4.0
 * =========================================================
 *
 * Improved typography, tighter navigation,
 * arrow indicators and stronger mobile readability.
 * ======================================================= */


/* =========================================================
 * 1. Footer
 * ======================================================= */

.p365-footer {
	position: relative;

	margin-top:
		22px;

	padding:
		clamp(46px, 5vw, 68px) 0 0;

	overflow:
		hidden;

	background:
		var(--p365-dark);

	color:
		var(--p365-white);
}


/* =========================================================
 * 2. Decorative Background
 * ======================================================= */

.p365-footer::before {
	content:
		"";

	position:
		absolute;

	top:
		-220px;

	left:
		-180px;

	width:
		520px;

	height:
		520px;

	border-radius:
		50%;

	background:
		radial-gradient(
			circle,
			rgba(20,114,122,.20) 0%,
			rgba(20,114,122,0) 70%
		);

	pointer-events:
		none;
}


.p365-footer::after {
	content:
		"365";

	position:
		absolute;

	right:
		-35px;

	bottom:
		-85px;

	color:
		rgba(255,255,255,.018);

	font-size:
		420px;

	font-weight:
		var(--p365-weight-bold);

	line-height:
		1;

	pointer-events:
		none;

	user-select:
		none;
}


/* =========================================================
 * 3. Main Grid
 * ======================================================= */

.p365-footer__main {
	position:
		relative;

	z-index:
		2;

	display:
		grid;

	grid-template-columns:
		minmax(260px, 1.45fr)
		repeat(3, minmax(150px, .72fr));

	gap:
		clamp(28px, 4vw, 60px);

	padding-bottom:
		clamp(36px, 4vw, 54px);
}


/* =========================================================
 * 4. Brand
 * ======================================================= */

.p365-footer__brand {
	max-width:
		360px;
}


.p365-footer__logo {
	display:
		flex;

	align-items:
		center;

	margin-bottom:
		18px;
}


.p365-footer__logo
.custom-logo-link {
	display:
		flex;

	align-items:
		center;
}


.p365-footer__logo
.custom-logo {
	width:
		auto;

	height:
		64px;

	max-width:
		250px;

	object-fit:
		contain;
}


/* =========================================================
 * 5. Fallback Logo
 * ======================================================= */

.p365-footer-logo__fallback {
	direction:
		ltr;

	display:
		inline-flex;

	align-items:
		center;

	gap:
		7px;

	color:
		var(--p365-white);

	font-size:
		32px;

	font-weight:
		var(--p365-weight-extrabold);

	line-height:
		1;
}


.p365-footer-logo__fallback strong {
	padding:
		4px 8px;

	border-radius:
		4px;

	background:
		var(--p365-orange);

	color:
		var(--p365-white);

	font-weight:
		var(--p365-weight-black);
}


/* =========================================================
 * 6. Brand Description
 * ======================================================= */

.p365-footer__description {
	max-width:
		340px;

	margin:
		0 0 21px;

	color:
		rgba(255,255,255,.66);

	font-size:
		15px;

	font-weight:
		var(--p365-weight-medium);

	line-height:
		1.85;
}


/* =========================================================
 * 7. Social
 * ======================================================= */

.p365-footer-social {
	display:
		flex;

	align-items:
		center;

	flex-wrap:
		wrap;

	gap:
		8px;
}


.p365-footer-social__link {
	display:
		flex;

	align-items:
		center;

	justify-content:
		center;

	width:
		38px;

	height:
		38px;

	border:
		1px solid rgba(255,255,255,.17);

	border-radius:
		50%;

	color:
		rgba(255,255,255,.76);

	transition:
		background-color var(--p365-transition-fast),
		border-color var(--p365-transition-fast),
		color var(--p365-transition-fast),
		transform var(--p365-transition-fast);
}


.p365-footer-social__link svg {
	width:
		17px;

	height:
		17px;
}


.p365-footer-social__link:hover {
	border-color:
		var(--p365-orange);

	background:
		var(--p365-orange);

	color:
		var(--p365-white);

	transform:
		translateY(-2px);
}


/* =========================================================
 * 8. Columns
 * ======================================================= */

.p365-footer__column {
	position:
		relative;
}


.p365-footer__heading {
	position:
		relative;

	margin:
		0 0 16px;

	padding-bottom:
		11px;

	color:
		var(--p365-white);

	font-size:
		20px;

	font-weight:
		var(--p365-weight-extrabold);

	line-height:
		1.35;
}


.p365-footer__heading::after {
	content:
		"";

	position:
		absolute;

	right:
		0;

	bottom:
		0;

	width:
		29px;

	height:
		2px;

	border-radius:
		20px;

	background:
		var(--p365-orange);
}


/* =========================================================
 * 9. Links
 * ======================================================= */

.p365-footer__links {
	display:
		flex;

	flex-direction:
		column;

	gap:
		0;

	margin:
		0;

	padding:
		0;

	list-style:
		none;
}


.p365-footer__links li {
	margin:
		0;

	padding:
		0;
}


.p365-footer__links a {
	position:
		relative;

	display:
		inline-flex;

	align-items:
		center;

	gap:
		8px;

	min-height:
		29px;

	color:
		rgba(255,255,255,.68);

	font-size:
		15px;

	font-weight:
		var(--p365-weight-semibold);

	line-height:
		1.45;

	transition:
		color var(--p365-transition-fast),
		transform var(--p365-transition-fast);
}


/* =========================================================
 * 10. Link Arrow
 * ======================================================= */

.p365-footer__links a::before {
	content:
		"←";

	display:
		inline-flex;

	align-items:
		center;

	justify-content:
		center;

	width:
		15px;

	flex:
		0 0 15px;

	color:
		var(--p365-orange);

	font-size:
		13px;

	font-weight:
		var(--p365-weight-bold);

	line-height:
		1;

	opacity:
		.85;

	transition:
		transform var(--p365-transition-fast),
		opacity var(--p365-transition-fast),
		color var(--p365-transition-fast);
}


.p365-footer__links a:hover {
	color:
		var(--p365-white);

	transform:
		translateX(-2px);
}


.p365-footer__links a:hover::before {
	color:
		var(--p365-orange);

	opacity:
		1;

	transform:
		translateX(-3px);
}


/* =========================================================
 * 11. Contact
 * ======================================================= */

.p365-footer__contact-text {
	max-width:
		240px;

	margin:
		0 0 15px;

	color:
		rgba(255,255,255,.62);

	font-size:
		13px;

	font-weight:
		var(--p365-weight-medium);

	line-height:
		1.8;
}


.p365-footer__email {
	direction:
		ltr;

	display:
		inline-flex;

	align-items:
		center;

	gap:
		9px;

	color:
		rgba(255,255,255,.86);

	font-size:
		13px;

	font-weight:
		var(--p365-weight-semibold);

	line-height:
		1.4;
}


.p365-footer__email:hover {
	color:
		var(--p365-orange);
}


.p365-footer__email-icon {
	display:
		flex;

	align-items:
		center;

	justify-content:
		center;

	width:
		34px;

	height:
		34px;

	flex:
		0 0 34px;

	border:
		1px solid rgba(255,255,255,.16);

	border-radius:
		50%;
}


.p365-footer__email-icon svg {
	width:
		15px;

	height:
		15px;
}


/* =========================================================
 * 12. Bottom Footer
 * ======================================================= */

.p365-footer__bottom {
	position:
		relative;

	z-index:
		2;

	display:
		flex;

	align-items:
		center;

	justify-content:
		space-between;

	gap:
		24px;

	min-height:
		68px;

	border-top:
		1px solid rgba(255,255,255,.09);

	color:
		rgba(255,255,255,.52);

	font-size:
		13px;

	font-weight:
		var(--p365-weight-medium);

	line-height:
		1.5;
}


/* =========================================================
 * 13. Copyright + Credit
 * ======================================================= */

.p365-footer__copyright {
	display:
		flex;

	align-items:
		center;

	flex-wrap:
		wrap;

	gap:
		6px;
}


.p365-footer__copyright-main {
	display:
		inline-block;
}


.p365-footer__copyright strong {
	color:
		rgba(255,255,255,.74);

	font-weight:
		var(--p365-weight-bold);
}


.p365-footer__credit {
	display:
		inline-flex;

	align-items:
		center;

	gap:
		5px;

	white-space:
		nowrap;
}


/* Desktop separator */

.p365-footer__credit::before {
	content:
		"|";

	display:
		inline-block;

	margin:
		0 2px;

	color:
		rgba(255,255,255,.35);
}


.p365-footer__credit-label {
	display:
		inline-block;

	font-weight:
		var(--p365-weight-medium);
}


.p365-footer__credit-name,
.p365-footer__credit-name:link,
.p365-footer__credit-name:visited {
	display:
		inline-block;

	color:
		var(--p365-orange, #f39a22) !important;

	font-weight:
		var(--p365-weight-bold);

	text-decoration:
		none;
}


.p365-footer__credit-name:hover,
.p365-footer__credit-name:focus {
	color:
		var(--p365-white, #ffffff) !important;
}


/* =========================================================
 * 14. Slogan
 * ======================================================= */

.p365-footer__slogan {
	display:
		flex;

	align-items:
		center;

	gap:
		8px;

	color:
		rgba(255,255,255,.68);

	font-size:
		12px;

	font-weight:
		var(--p365-weight-bold);

	line-height:
		1.4;
}


.p365-footer__slogan-dot {
	display:
		block;

	width:
		6px;

	height:
		6px;

	flex:
		0 0 6px;

	border-radius:
		50%;

	background:
		var(--p365-orange);
}


/* =========================================================
 * 15. Tablet
 * ======================================================= */

@media (max-width: 1050px) {

	.p365-footer::after {
		font-size:
			300px;
	}


	.p365-footer__main {
		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			);

		gap:
			34px 42px;
	}


	.p365-footer__brand {
		max-width:
			none;
	}


	.p365-footer__heading {
		font-size:
			19px;
	}


	.p365-footer__links a {
		font-size:
			15px;
	}
}


/* =========================================================
 * 16. Mobile
 * ======================================================= */

@media (max-width: 767px) {

	.p365-footer {
		padding-top:
			36px;
	}


	.p365-footer::after {
		right:
			-20px;

		bottom:
			-35px;

		font-size:
			220px;
	}


	.p365-footer__main {
		grid-template-columns:
			1fr;

		gap:
			27px;

		padding-bottom:
			32px;
	}


	.p365-footer__brand {
		max-width:
			100%;
	}


	.p365-footer__logo {
		margin-bottom:
			15px;
	}


	.p365-footer__logo
	.custom-logo {
		height:
			52px;

		max-width:
			210px;
	}


	.p365-footer-logo__fallback {
		font-size:
			28px;
	}


	.p365-footer__description {
		max-width:
			100%;

		margin-bottom:
			18px;

		font-size:
			15px;

		line-height:
			1.8;
	}


	/* =====================================================
	 * Column Heading
	 * =================================================== */

	.p365-footer__heading {
		margin-bottom:
			11px;

		padding-bottom:
			9px;

		font-size:
			20px;

		font-weight:
			var(--p365-weight-extrabold);
	}


	.p365-footer__heading::after {
		width:
			28px;
	}


	/* =====================================================
	 * Navigation Links
	 * =================================================== */

	.p365-footer__links {
		gap:
			0;
	}


	.p365-footer__links a {
		gap:
			8px;

		min-height:
			28px;

		font-size:
			15px;

		font-weight:
			var(--p365-weight-semibold);

		line-height:
			1.4;
	}


	.p365-footer__links a::before {
		width:
			14px;

		flex-basis:
			14px;

		font-size:
			13px;
	}


	/* =====================================================
	 * Contact
	 * =================================================== */

	.p365-footer__contact-text {
		max-width:
			280px;

		margin-bottom:
			13px;

		font-size:
			13px;

		font-weight:
			var(--p365-weight-medium);

		line-height:
			1.75;
	}


	.p365-footer__email {
		font-size:
			13px;

		font-weight:
			var(--p365-weight-semibold);
	}


	/* =====================================================
	 * Bottom mobile order
	 *
	 * 1. الخبر لا يتوقف
	 * 2. برمجة وتصميم Tech Resolve
	 * 3. Copyright
	 * =================================================== */

	.p365-footer__bottom {
		display:
			flex;

		flex-direction:
			column;

		align-items:
			flex-start;

		justify-content:
			center;

		gap:
			7px;

		min-height:
			0;

		padding-block:
			18px;

		font-size:
			12px;
	}


	/* Slogan first */

	.p365-footer__slogan {
		order:
			1;

		width:
			100%;

		font-size:
			12px;

		font-weight:
			var(--p365-weight-bold);
	}


	/*
	 * Copyright wrapper second.
	 * Credit first, copyright second.
	 */

	.p365-footer__copyright {
		order:
			2;

		display:
			flex;

		flex-direction:
			column;

		align-items:
			flex-start;

		justify-content:
			flex-start;

		flex-wrap:
			nowrap;

		gap:
			5px;

		width:
			100%;
	}


	/* Credit above copyright */

	.p365-footer__credit {
		order:
			1;

		display:
			inline-flex;

		align-items:
			center;

		justify-content:
			flex-start;

		flex-wrap:
			nowrap;

		gap:
			5px;

		width:
			auto;

		margin:
			0;

		font-size:
			12px;

		white-space:
			nowrap;
	}


	/* No separator on mobile */

	.p365-footer__credit::before {
		content:
			none;

		display:
			none;
	}


	.p365-footer__credit-label {
		display:
			inline-block;

		width:
			auto;

		margin:
			0;
	}


	.p365-footer__credit-name,
	.p365-footer__credit-name:link,
	.p365-footer__credit-name:visited {
		display:
			inline-block;

		width:
			auto;

		margin:
			0;

		color:
			var(--p365-orange, #f39a22) !important;

		font-weight:
			var(--p365-weight-bold);
	}


	/* Copyright last */

	.p365-footer__copyright-main {
		order:
			2;

		display:
			block;

		width:
			100%;

		font-size:
			12px;
	}
}


/* =========================================================
 * 17. Small Mobile
 * ======================================================= */

@media (max-width: 480px) {

	.p365-footer {
		margin-top:
			18px;

		padding-top:
			34px;
	}


	.p365-footer::after {
		font-size:
			180px;
	}


	.p365-footer__main {
		gap:
			24px;

		padding-bottom:
			28px;
	}


	.p365-footer__logo
	.custom-logo {
		height:
			48px;

		max-width:
			190px;
	}


	.p365-footer-logo__fallback {
		font-size:
			26px;
	}


	.p365-footer__description {
		font-size:
			14px;

		line-height:
			1.8;
	}


	.p365-footer__heading {
		margin-bottom:
			10px;

		font-size:
			19px;
	}


	.p365-footer__links a {
		min-height:
			27px;

		font-size:
			15px;

		font-weight:
			var(--p365-weight-semibold);
	}


	.p365-footer__contact-text {
		font-size:
			13px;
	}


	.p365-footer__email {
		font-size:
			13px;
	}


	.p365-footer__bottom {
		padding-block:
			17px;

		font-size:
			12px;
	}


	.p365-footer__slogan {
		font-size:
			12px;
	}


	.p365-footer__credit,
	.p365-footer__copyright-main {
		font-size:
			12px;
	}
}