.the_ark > * {
	all: unset; display: revert;
}

.the_ark img{
	height: 100%;
}

:root {
	/* Text size */
	--text-xs: 0.75rem;
	--text-s: 0.875rem;
	--text-base: 1rem;
	--text-l: 1.125rem;
	--text-xl: 1.25rem;
	--text-2xl: 1.5rem;
	--text-3xl: 1.875rem;
	--text-4xl: 2.25rem;
	--text-5xl: 3rem;
	--text-6xl: 3.75rem;
	--text-7xl: 4.5rem;
	--text-8xl: 6rem;

	/* Spacing */
	--boxed: 80rem;
	--frame-w: 5.675rem;
	--space-1: 1px;
	--space-xs: 0.25rem;
	--space-s: 0.5rem;
	--space-m: 0.75rem;
	--space-l: 1rem;
	--space-xl: 1.5rem;
	--space-2xl: 2rem;
	--space-3xl: 2.5rem;

	/*border-radius */
	--border-radius: 1rem;
	
}
	

/* Color */
@property --bg-color {
	syntax: "<color>";
	inherits: false;
	initial-value: #120925;
}
@property --fg-color {
	syntax: "<color>";
	inherits: false;
	initial-value: white;
}

@property --primary-color {
	syntax: "<color>";
	inherits: false;
	initial-value: #8a26ff;
}

@property --primary-light-color {
	syntax: "<color>";
	inherits: false;
	initial-value: #ac7fff;
}

@property --primary-30 {
	syntax: "<color>";
	inherits: false;
	initial-value: rgba(172, 127, 255, 0.3);
}

@property --secondary-color {
	syntax: "<color>";
	inherits: false;
	initial-value: #1749de;
}

@property --black-6 {
	syntax: "<color>";
	inherits: false;
	initial-value: rgba(0, 0, 0, 0.06);
}
@property --bg-80 {
	syntax: "<color>";
	inherits: false;
	initial-value: #120925d2;
}

@property --black-33 {
	syntax: "<color>";
	inherits: false;
	initial-value: rgba(0, 0, 0, 0.33);
}

@property --fg-6 {
	syntax: "<color>";
	inherits: false;
	initial-value: rgba(255, 255, 255, 0.06);
}

@property --fg-10 {
	syntax: "<color>";
	inherits: false;
	initial-value: rgba(255, 255, 255, 0.1);
}

@property --fg-20 {
	syntax: "<color>";
	inherits: false;
	initial-value: rgba(255, 255, 255, 0.2);
}

html,
body {
	font-family: "sculpin", sans-serif;
	font-style: normal;
	text-transform: lowercase;
}

main {
	display: flex;
	flex-direction: column;
	gap: 10rem;
	color: var(--fg-color);
}

h1,
h2,
h3,
h4,
h5,
b,
strong,
bold {
	font-weight: 700;
}

h1 {
	font-size: var(--text-6xl);
	line-height: 1;
}

h2 {
	font-size: var(--text-5xl);
	line-height: 1;
}

h3 {
	font-size: var(--text-4xl);
	line-height: 2.5rem;
}

h4 {
	font-size: var(--text-3xl);
}

h5 {
	font-size: var(--text-xl);
	line-height: 1.5rem;
}

.txt-l,
.txt-l p {
	font-size: var(--text-l);
	line-height: 1.75rem;
}

.txt-xl {
	font-size: var(--text-xl);
	line-height: 1.75rem;
}

p,
.txt-m {
	font-size: var(--text-base);
	line-height: 1.5rem;
}

.txt-s,
.txt-s p {
	font-size: var(--text-s);
	line-height: 1.35rem;
}
