:root {
  --bg: #eee;
  --bg-muted: #f6f7f9;
  --text: #111827;
  --text-muted: #6b7280;
  --primary: #4f46e5;
  --border: #e5e7eb;
  --radius: 12px;
  --shadow: 0 10px 30px rgba(0,0,0,.06);
  --dark-v: #0c02b5
}


/* Main styles */

* {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        }
        
html, body {
	height:100%;
	width:100%;
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	margin: 0; 
	padding: 0; 
	color: var(--text);
	}

/* Content styles */

#wrap {
	min-height: 100%;
	max-width: 85rem;
	margin-inline: auto;
	flex-wrap: wrap;    
	}

main {
	padding-bottom: 40px;	/* Высота футера */
	}

h1 {
	font-size: 3rem;
	font-weight: 700;
	-webkit-text-fill-color: transparent;
	-webkit-text-stroke: 1.5px var(--primary);	/* Толщина и цвет обводки */
	text-stroke: 1.5px var(--primary);		/* Толщина и цвет обводки (стандартное свойство) */
	margin: 20px 40px;
	}



/* Main Menu styles */




#main-menu {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 50px;
	margin-top: 10px;
        }

#main-menu a {
	font-size: 18px;
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none;
	color: : var(--primary);
	padding: 0.4rem 0;
	transition: color 0.3s ease-in-out, opacity 0.3s ease-in-out;
	}

#main-menu a:hover {
	color: #ff7a18;
	}

#main-menu:has(a:hover) a:not(:hover) {
	opacity: 0.3;
	}

#main-menu a.active {
        color: var(--primary);
	}


/* Footr styles */

footer {
	margin-top: -40px;	/* Минус Высота футера */
	height: 40px;		/* Высота футера */
	text-align: center;
	font-size: 1em;
	}