*{
	margin:0;
	padding:0;
	box-sizing:border-box;
}

:root{

	--theme-color:#c8a97e;

	--theme-color-dark:#b49367;

	--cream:#f8f4ef;

	--cream-dark:#efe6dc;

	--soft-beige:#e8ddd1;

	--soft-rose:#c7a1a1;

	--text-dark:#4e4348;

	--text-light:#7f7176;

	--muted:#9d8f88;

	--white-glass:
		rgba(255,255,255,0.74);

	--glass-border:
		rgba(200,169,126,0.10);

	--soft-shadow:
		0 18px 44px rgba(0,0,0,0.05);

	--hover-shadow:
		0 22px 50px rgba(0,0,0,0.08);
}

*::selection{

	background:
		rgba(200,169,126,0.24);

	color:
		var(--text-dark);
}

html,
body{

	width:100%;
	min-height:100%;

	font-family:
		'Inter',
		sans-serif;

	scroll-behavior:smooth;

	overflow-x:hidden;
}

body{

	font-family:
		'Inter',
		sans-serif;

	color:
		var(--text-dark);

	background:
		linear-gradient(
			180deg,
			#f8f4ef 0%,
			#f3ebe3 42%,
			#ffffff 100%
		);

	background-attachment:fixed;

	-webkit-font-smoothing:antialiased;

	text-rendering:optimizeLegibility;
}

img{

	max-width:100%;

	display:block;
}

a{

	color:inherit;

	text-decoration:none;
}

button,
input,
textarea,
select{

	font:inherit;
}

button{

	outline:none;
}

.page-content{

	position:relative;

	min-height:100dvh;

	z-index:2;
}

/* ========================================
   TYPOGRAPHY
======================================== */

h1,
h2,
h3,
h4,
h5,
h6{

	font-family:
		'Cormorant Garamond',
		serif;

	font-weight:600;

	letter-spacing:-1px;

	line-height:0.95;

	color:
		#5e4e45;
}

p{

	line-height:1.8;

	color:
		var(--text-light);
}

/* ========================================
   BUTTONS
======================================== */

.landing-btn,
.dashboard-btn{

	position:relative;

	overflow:hidden;

	display:inline-flex;

	align-items:center;
	justify-content:center;

	gap:10px;

	padding:
		15px
		26px;

	min-height:56px;

	border:none;
	border-radius:20px;

	background:
		linear-gradient(
			135deg,
			#c8a97e,
			#d8bea0
		);

	color:white;

	font-size:15px;
	font-weight:700;

	cursor:pointer;

	box-shadow:
		0 14px 34px rgba(200,169,126,0.22);

	transition:
		transform 0.22s ease,
		box-shadow 0.22s ease,
		background 0.22s ease;
}

.landing-btn:hover,
.dashboard-btn:hover{

	transform:
		translateY(-3px);

	background:
		linear-gradient(
			135deg,
			#b49367,
			#c8a97e
		);

	box-shadow:
		0 18px 40px rgba(200,169,126,0.28);
}

.secondary-btn{

	background:
		rgba(255,255,255,0.74);

	backdrop-filter:blur(18px);

	color:
		#6f5f56;

	border:
		1px solid rgba(200,169,126,0.10);

	box-shadow:
		0 10px 28px rgba(0,0,0,0.04);
}

.secondary-btn:hover{

	background:
		rgba(255,255,255,0.92);
}

.danger-btn{

	border:none;

	display:inline-flex;

	align-items:center;
	justify-content:center;

	padding:
		14px
		22px;

	min-height:54px;

	border-radius:18px;

	background:
		linear-gradient(
			135deg,
			#d96b6b,
			#e58a8a
		);

	color:white;

	font-size:14px;
	font-weight:700;

	cursor:pointer;

	box-shadow:
		0 14px 34px rgba(217,107,107,0.18);

	transition:0.22s;
}

.danger-btn:hover{

	transform:
		translateY(-2px);

	box-shadow:
		0 18px 40px rgba(217,107,107,0.24);
}

/* ========================================
   BADGES
======================================== */

.premium-badge{

	display:inline-flex;

	align-items:center;
	justify-content:center;

	padding:
		10px
		18px;

	border-radius:999px;

	background:
		linear-gradient(
			135deg,
			rgba(200,169,126,0.16),
			rgba(216,190,160,0.18)
		);

	border:
		1px solid rgba(200,169,126,0.14);

	backdrop-filter:blur(16px);

	color:
		#9b7b52;

	font-size:13px;
	font-weight:700;

	letter-spacing:0.3px;
}

/* ========================================
   EMPTY STATES
======================================== */

.empty-state{

	padding:
		34px
		30px;

	border-radius:30px;

	background:
		rgba(255,255,255,0.72);

	backdrop-filter:blur(18px);

	border:
		1px solid rgba(200,169,126,0.10);

	box-shadow:
		var(--soft-shadow);

	text-align:center;

	color:
		#84746d;
}

/* ========================================
   ICON BUTTONS
======================================== */

.icon-btn{

	border:none;

	display:flex;

	align-items:center;
	justify-content:center;

	background:
		rgba(255,255,255,0.16);

	backdrop-filter:blur(16px);

	color:white;

	cursor:pointer;

	transition:
		transform 0.22s ease,
		background 0.22s ease;
}

.icon-btn:hover{

	transform:
		translateY(-2px);

	background:
		rgba(255,255,255,0.22);
}

/* ========================================
   GLASS CARD BASE
======================================== */

.glass-card{

	background:
		var(--white-glass);

	backdrop-filter:blur(18px);

	border:
		1px solid var(--glass-border);

	box-shadow:
		var(--soft-shadow);

	border-radius:30px;
}

/* ========================================
   SCROLLBAR
======================================== */

::-webkit-scrollbar{

	width:10px;
	height:10px;
}

::-webkit-scrollbar-track{

	background:
		rgba(255,255,255,0.4);
}

::-webkit-scrollbar-thumb{

	background:
		rgba(200,169,126,0.42);

	border-radius:999px;
}

::-webkit-scrollbar-thumb:hover{

	background:
		rgba(200,169,126,0.62);
}

/* ========================================
   MOBILE
======================================== */

@media(max-width:700px){

	.landing-btn,
	.dashboard-btn{

		width:100%;

		min-height:52px;

		padding:
			14px
			18px;

		border-radius:18px;

		font-size:14px;
	}

	.empty-state{

		padding:
			28px
			22px;

		border-radius:24px;
	}

	.premium-badge{

		font-size:12px;

		padding:
			9px
			14px;
	}
}