:root{
	--bg:#f6f1eb;
	--surface:#fffdf8;
	--surface-strong:#f2e8de;
	--border:#d8c6b5;
	--text:#2c2a27;
	--muted:#7c7368;
	--accent:#af8c54;
	--accent-soft:rgba(175,140,84,0.18);
	--shadow:0 18px 40px rgba(43,35,25,0.12);
}

*{box-sizing:border-box}

body{
	font-family:ui-serif,Georgia,'Times New Roman',serif;
	margin:0;color:var(--text);
	background:linear-gradient(180deg,#f7f2eb 0%,#f0e8dd 100%);
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}

body::before{
	content:"";
	position:fixed;
	left:50%;
	top:-10%;
	width:140%;
	height:140%;
	transform:translateX(-50%);
	background:radial-gradient(circle at top,#f9f5ef 0%,transparent 60%);
	pointer-events:none;
	z-index:-2;
}

body::after{
	content:"";
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-image:linear-gradient(135deg,rgba(255,255,255,0.18) 0%,transparent 40%), radial-gradient(circle at top left,rgba(175,140,84,0.08) 0%,transparent 20%);
	pointer-events:none;
	z-index:-1;
}

.site-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:20px 24px;
	background:rgba(255,255,255,0.72);
	backdrop-filter:blur(14px);
	border-bottom:1px solid rgba(168,141,108,0.18);
}

.site-title{
	margin:0;
	font-size:1.25rem;
	letter-spacing:0.2em;
	text-transform:uppercase;
	font-weight:700;
	color:#3c2f22;
}

.top-buttons{
	display:flex;
	gap:12px;
}

.top-buttons .btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:12px 18px;
	border-radius:999px;
	border:1px solid rgba(175,140,84,0.24);
	background:rgba(255,255,255,0.92);
	color:var(--text);
	text-decoration:none;
	font-size:0.95rem;
	font-weight:600;
	box-shadow:var(--shadow);
	transition:transform .24s ease,box-shadow .24s ease,background .24s ease,color .24s ease;
}

.top-buttons .btn:hover{
	transform:translateY(-2px);
	box-shadow:0 20px 40px rgba(43,35,25,0.18);
	background:linear-gradient(135deg,rgba(175,140,84,0.14),rgba(255,255,255,0.95));
}

.top-buttons .btn:last-child{
	color:var(--muted);
	background:transparent;
}

.container{
	padding:28px 24px;
	max-width:980px;
	margin:0 auto;
}

.hero{
	padding:32px 0;
}

.hero h2{
	margin:0 0 14px;
	font-size:2.1rem;
	line-height:1.1;
	color:#3c2f22;
}

.hero p{
	margin:0;
	color:var(--muted);
	font-size:1rem;
	line-height:1.8;
}

.latest{
	margin-top:24px;
}

.latest ul{
	padding-left:0;
	margin:0;
}

.latest li{
	list-style:none;
	margin-bottom:14px;
	padding:16px 18px;
	border-radius:16px;
	background:rgba(255,255,255,0.76);
	border:1px solid rgba(175,140,84,0.14);
	box-shadow:inset 0 0 0 1px rgba(255,255,255,0.35);
}

.latest a{
	color:#3c2f22;
	text-decoration:none;
	font-weight:600;
}

.latest a:hover{
	text-decoration:underline;
}

.card{
	background:rgba(255,255,255,0.86);
	padding:24px;
	border-radius:20px;
	margin-bottom:20px;
	box-shadow:var(--shadow);
	border:1px solid rgba(175,140,84,0.12);
}

.card:hover{
	transform:translateY(-3px);
}

.card h3{
	margin-top:0;
	color:#3c2f22;
}

.site-footer{
	padding:18px 24px;
	border-top:1px solid rgba(168,141,108,0.14);
	color:var(--muted);
	font-size:0.92rem;
	text-align:center;
}

@media (max-width:900px){
	.container{padding:20px 18px;}
	.hero h2{font-size:1.8rem;}
	.top-buttons{gap:10px;}
	.top-buttons .btn{padding:10px 14px;font-size:0.92rem;}
}

@media (max-width:640px){
	.site-header{flex-direction:column;align-items:flex-start;gap:14px;}
	.top-buttons{width:100%;flex-wrap:wrap;}
	.top-buttons .btn{width:100%;justify-content:center;}
}

@media (max-width:480px){
	.container{padding:16px;}
	.card{padding:18px;}
}

