/* =====================================================
   ModArt Renov Premium Theme
--------------------------------------------------------
   File        : legal.css
   Version     : 2.6.0
   Author      : Ayhan & Atlas
===================================================== */


/* =====================================================
   PAGE
===================================================== */

.legal-page{

	background:var(--color-bg);

	color:var(--color-text);

}


/* =====================================================
   HERO
===================================================== */

.page-hero{

	position:relative;

	overflow:hidden;

	padding:
		calc(var(--header-height) + 80px)
		0
		90px;

	background:
		linear-gradient(
			180deg,
			rgba(255,255,255,.02),
			transparent
		);

	border-bottom:
		1px solid
		var(--color-border);

}

.page-hero::before{

	content:"";

	position:absolute;

	inset:0;

	pointer-events:none;

	background:

	radial-gradient(

		circle at top right,

		rgba(212,175,55,.10),

		transparent 45%

	),

	radial-gradient(

		circle at bottom left,

		rgba(212,175,55,.05),

		transparent 45%

	);

}

.page-hero .container{

	position:relative;

	z-index:2;

}

.page-hero h1{

	font-size:clamp(42px,6vw,64px);

	font-weight:800;

	line-height:1.1;

	margin-bottom:24px;

}

.page-hero p{

	max-width:760px;

	color:var(--color-text-muted);

	font-size:19px;

	line-height:1.9;

}


/* =====================================================
   BREADCRUMB
===================================================== */

.breadcrumb{

	display:flex;

	align-items:center;

	gap:12px;

	flex-wrap:wrap;

	margin-bottom:35px;

	font-size:14px;

	letter-spacing:2px;

	text-transform:uppercase;

}

.breadcrumb a{

	color:var(--color-text-light);

	transition:var(--transition);

}

.breadcrumb a:hover{

	color:var(--color-primary);

}

.breadcrumb span{

	color:var(--color-primary);

}


/* =====================================================
   CONTENT
===================================================== */

.legal-section{

	padding:90px 0;

}

.legal-section .container{

	display:grid;

	gap:35px;

}


/* =====================================================
   LEGAL CARD
===================================================== */

.legal-card{

	position:relative;

	overflow:hidden;

	padding:45px;

	background:var(--color-card);

	border:1px solid var(--color-border);

	border-radius:var(--radius-md);

	backdrop-filter:blur(18px);

	box-shadow:var(--shadow);

	transition:
		transform .35s ease,
		border-color .35s ease,
		box-shadow .35s ease;

}

.legal-card::before{

	content:"";

	position:absolute;

	top:0;

	left:0;

	width:100%;

	height:1px;

	background:

	linear-gradient(

		90deg,

		transparent,

		rgba(212,175,55,.45),

		transparent

	);

}

.legal-card:hover{

	transform:translateY(-6px);

	border-color:rgba(212,175,55,.22);

	box-shadow:

		0 25px 60px rgba(0,0,0,.35);

}


/* =====================================================
   TITLES
===================================================== */

.legal-card h2{

	display:flex;

	align-items:center;

	gap:16px;

	margin-bottom:28px;

	font-size:30px;

	font-weight:700;

}

.legal-card h2::before{

	content:"";

	width:8px;

	height:32px;

	border-radius:20px;

	background:var(--color-primary);

	box-shadow:

		0 0 18px rgba(212,175,55,.35);

}
/* =====================================================
   TEXT
===================================================== */

.legal-card p{

	color:var(--color-text-light);

	line-height:2;

	margin-bottom:18px;

}

.legal-card strong{

	color:var(--color-primary);

}

.legal-card a{

	color:var(--color-primary);

	word-break:break-word;

	transition:
		color .30s ease;

}

.legal-card a:hover{

	color:var(--color-primary-hover);

}


/* =====================================================
   LIST
===================================================== */

.legal-card ul{

	margin-top:20px;

	padding-left:22px;

}

.legal-card li{

	margin-bottom:14px;

	color:var(--color-text-light);

	line-height:1.9;

}

.legal-card li::marker{

	color:var(--color-primary);

}


/* =====================================================
   TABLE
===================================================== */

.legal-table{

	display:block;

	width:100%;

	margin-top:24px;

	border:1px solid var(--color-border);

	border-radius:18px;

	border-collapse:collapse;

	overflow:hidden;

}

.legal-table tbody{

	display:table;

	width:100%;

	border-collapse:collapse;

}

.legal-table tr{

	display:table-row;

	transition:background .30s ease;

}

.legal-table tr:hover{

	background:

		rgba(212,175,55,.03);

}

.legal-table th{

	width:260px;

	padding:18px 22px;

	text-align:left;

	color:var(--color-primary);

	background:

		rgba(212,175,55,.06);

	border-bottom:

		1px solid var(--color-border);

}

.legal-table td{

	padding:18px 22px;

	color:var(--color-text-light);

	border-bottom:

		1px solid var(--color-border);

}

.legal-table tr:last-child th,
.legal-table tr:last-child td{

	border-bottom:none;

}


/* =====================================================
   CONTACT
===================================================== */

.legal-contact-list{

	margin-top:30px;

	padding:0;

	list-style:none;

}

.legal-contact-list li{

	display:flex;

	align-items:center;

	gap:18px;

	padding:18px 0;

	border-bottom:

		1px solid var(--color-border);

}

.legal-contact-list li:last-child{

	border-bottom:none;

}

.legal-contact-list strong{

	min-width:130px;

	color:var(--color-primary);

	font-weight:700;

	letter-spacing:1px;

}

.legal-contact-list a{

	color:var(--color-text);

}

.legal-contact-list a:hover{

	color:var(--color-primary);

}


/* =====================================================
   CTA
===================================================== */

.legal-cta{

	position:relative;

	overflow:hidden;

	margin-top:25px;

	border:1px solid var(--color-border);

	border-radius:var(--radius-md);

	background:

		linear-gradient(

			180deg,

			rgba(255,255,255,.03),

			rgba(255,255,255,.01)

		);

	box-shadow:var(--shadow);

}

.legal-cta::before{

	content:"";

	position:absolute;

	inset:0;

	pointer-events:none;

	background:

	radial-gradient(

		circle at top right,

		rgba(212,175,55,.10),

		transparent 40%

	);

}

.legal-cta-content{

	position:relative;

	z-index:2;

	max-width:760px;

	margin:auto;

	padding:70px 45px;

	text-align:center;

}

.legal-cta h2{

	margin-bottom:22px;

	font-size:42px;

}

.legal-cta p{

	margin-bottom:40px;

	color:var(--color-text-muted);

	line-height:2;

}


/* =====================================================
   BUTTONS
===================================================== */

.legal-buttons{

	display:flex;

	align-items:center;

	justify-content:center;

	flex-wrap:wrap;

	gap:20px;

}

.legal-buttons .btn-primary,
.legal-buttons .btn-secondary{

	min-width:230px;

}
/* =====================================================
   UPDATE
===================================================== */

.legal-update{

	margin-top:30px;

	text-align:center;

}

.legal-small{

	color:var(--color-text-muted);

	font-size:14px;

	letter-spacing:1px;

}

.legal-small strong{

	color:var(--color-primary);

}


/* =====================================================
   RESPONSIVE
===================================================== */

@media (max-width:1200px){

	.legal-card{

		padding:38px;

	}

	.legal-table th{

		width:220px;

	}

}


@media (max-width:992px){

	.page-hero{

		padding:
			calc(var(--header-height) + 60px)
			0
			70px;

	}

	.page-hero h1{

		font-size:48px;

	}

	.legal-card{

		padding:34px;

	}

	.legal-cta-content{

		padding:60px 35px;

	}

	.legal-cta h2{

		font-size:36px;

	}

}


@media (max-width:768px){

	.page-hero{

		text-align:center;

	}

	.breadcrumb{

		justify-content:center;

	}

	.legal-card{

		padding:28px;

	}

	.legal-card h2{

		font-size:26px;

	}

	.legal-contact-list li{

		flex-direction:column;

		align-items:flex-start;

		gap:8px;

	}

	.legal-buttons{

		flex-direction:column;

	}

	.legal-buttons .btn-primary,
	.legal-buttons .btn-secondary{

		width:100%;

		min-width:100%;

	}

	.legal-table,
	.legal-table tbody,
	.legal-table tr,
	.legal-table th,
	.legal-table td{

		display:block;

		width:100%;

	}

	.legal-table{

		border:none;

	}

	.legal-table tr{

		margin-bottom:18px;

		border:1px solid var(--color-border);

		border-radius:16px;

		overflow:hidden;

	}

	.legal-table th{

		width:100%;

		border-bottom:none;

		background:rgba(212,175,55,.08);

	}

	.legal-table td{

		padding-top:10px;

		padding-bottom:22px;

		border-bottom:none;

	}

}


@media (max-width:576px){

	.page-hero h1{

		font-size:38px;

	}

	.page-hero p{

		font-size:17px;

	}

	.legal-card{

		padding:22px;

		border-radius:20px;

	}

	.legal-cta-content{

		padding:45px 22px;

	}

	.legal-cta h2{

		font-size:30px;

	}

}


/* =====================================================
   PRINT
===================================================== */

@media print{

	.site-header,
	.site-footer,
	.legal-cta{

		display:none !important;

	}

	body,
	.legal-page{

		background:#ffffff !important;

		color:#000000 !important;

	}

	.page-hero{

		padding:0 0 25px;

		border:none;

	}

	.legal-card{

		background:#ffffff;

		border:1px solid #cccccc;

		box-shadow:none;

		break-inside:avoid;

		page-break-inside:avoid;

	}

}


/* =====================================================
   ACCESSIBILITY
===================================================== */

.legal-card a:focus-visible,
.legal-buttons a:focus-visible{

	outline:3px solid var(--color-primary);

	outline-offset:4px;

	border-radius:8px;

}


/* =====================================================
   ANIMATION
===================================================== */

@media (prefers-reduced-motion:no-preference){

	.legal-card{

		animation:legalFade .45s ease both;

	}

	@keyframes legalFade{

		from{

			opacity:0;

			transform:translateY(18px);

		}

		to{

			opacity:1;

			transform:translateY(0);

		}

	}

}


/* =====================================================
   END
===================================================== */
