*, *::before, *::after {
	box-sizing: border-box;
	padding: 0;
	margin: 0;
	background: none;
	text-decoration: none;
	outline: none;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	font-weight: inherit;
	color: inherit;
	font-feature-settings: "onum", "kern", "liga", "clig", "calt"
}

:root {
	--c-bg: #fdfdfd;
	--c-cta: #ebf2f9;
	--c-text: #203650;
	--f-sans: 'DM Sans', sans-serif;
	--f-serif: 'Lora', serif;
	--f-family: var(--f-sans);
	--f-size: 18px;
	--f-height: 32px;
	--f-weight: 400;
	--f-scale-s: 0.8;
	--f-scale-m: 1.25;
	--f-scale-l: 1.563;
	--f-scale-xl: 1.953;
	--f-scale-xxl: 2.441;
	font-size: var(--f-height);
	font-family: var(--f-family);
	font-weight: var(--f-weight);
	background: var(--c-bg);
	color: var(--c-text)
}

body *, html * {
	font-size: var(--f-size);
	line-height: 1rem
}

.initials {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 5rem 0;
	padding: 0 1rem
}

.initial {
	flex: 0 1 auto;
	display: block;
	height: 5rem;
	width: auto
}

.intro {
	width: 100%;
	height: 70vh;
	display: flex;
	justify-content: center;
	align-items: center
}

.intro-letter {
	display: inline-block;
	height: 35vh;
	width: auto
}

.text {
	margin: 0 auto;
	padding: 0 20px;
	max-width: 24rem;
	text-align: center
}

p:not(:last-child) {
	margin-bottom: 1rem
}

[data-size="big"] {
	font-size: calc(var(--f-size) * var(--f-scale-l));
	line-height: 1.3rem;
	padding-top: .35rem;
	padding-bottom: .35rem
}

ul {
	margin: 1rem 0;
	list-style-type: none
}

ul::before, ul::after {
	content: "•"
}

a {
	background-image: linear-gradient(to right, var(--c-bg) 33.33333%, var(--c-text) 66.66666%);
	background-size: 300% 1px;
	background-repeat: no-repeat;
	background-position: right bottom;
	transition: background-position 400ms ease-out, opacity 400ms ease-out
}

a:hover {
	opacity: .85;
	background-position: left bottom
}

a[data-style="cta"] {
	font-size: calc(var(--f-size) * var(--f-scale-m));
	line-height: 1rem;
	position: relative;
	padding: .5rem 1rem;
	background: var(--c-cta);
	border-radius: 999999px;
	margin: 0.5rem 0;
	display: inline-block
}

em {
	font-style: italic;
	font-size: inherit
}

strong {
	font-weight: 700;
	font-size: inherit
}

[data-size="large"] {
	font-size: calc(var(--f-size) * var(--f-scale-l));
	line-height: 1.3rem;
	padding-top: .35rem;
	padding-bottom: .35rem
}

[data-font="serif"] {
	font-family: lora
}

[data-font="custom"] {
	font-family: var(--f-custom)
}

[data-size="large"][data-font="serif"] {
	font-size: calc(var(--f-size) * var(--f-scale-xl));
	line-height: 1.3rem;
	padding-bottom: .35rem;
	padding-top: .35rem;
	font-style: italic
}

.divider {
	display: block;
	margin: 3rem 0;
	padding: 1rem
}

.divider::after {
	content: "";
	display: block;
	margin: 0 auto;
	background-position: center center;
	background-size: contain;
	background-repeat: no-repeat
}

.divider[data-style*="a"]::after {
	transform: rotate(0deg) rotateY(0deg)
}

.divider[data-style*="b"]::after {
	transform: rotate(180deg) rotateY(0deg)
}

.divider[data-style*="c"]::after {
	transform: rotate(0deg) rotateY(180deg)
}

.divider[data-style*="d"]::after {
	transform: rotate(180deg) rotateY(180deg)
}

.divider[data-style*="1"]::after {
	background-image: url("../images/dividers/horizontal-1.png")
}

.divider[data-style*="2"]::after {
	background-image: url("../images/dividers/horizontal-2.png")
}

.divider[data-style*="3"]::after {
	background-image: url("../images/dividers/horizontal-3.png")
}

.divider[data-style*="4"]::after {
	background-image: url("../images/dividers/curve-1.png")
}

.divider[data-style*="5"]::after {
	background-image: url("../images/dividers/curve-2.png")
}

.divider[data-style*="6"]::after {
	background-image: url("../images/dividers/curve-3.png")
}

.divider[data-style*="7"]::after {
	background-image: url("../images/dividers/flowers-1.png")
}

.divider[data-style*="8"]::after {
	background-image: url("../images/dividers/flowers-2.png")
}

.divider[data-style*="9"]::after {
	background-image: url("../images/dividers/flowers-3.png")
}

.divider[data-style*="10"]::after {
	background-image: url("../images/dividers/flowers-4.png")
}

.divider[data-style*="11"]::after {
	background-image: url("../images/dividers/flowers-5.png")
}

.divider[data-style*="12"]::after {
	background-image: url("../images/dividers/flowers-6.png")
}

.divider[data-style*="13"]::after {
	background-image: url("../images/dividers/leaf-1.png")
}

.divider[data-style*="14"]::after {
	background-image: url("../images/dividers/leaf-2.png")
}

.divider[data-style*="15"]::after {
	background-image: url("../images/dividers/leaf-3.png")
}

.divider[data-style*="16"]::after {
	background-image: url("../images/dividers/leaf-4.png")
}

.divider[data-style*="17"]::after {
	background-image: url("../images/dividers/leaf-5.png")
}

.divider[data-style*="18"]::after {
	background-image: url("../images/dividers/leaf-6.png")
}

.divider[data-size="small"]::after {
	height: 6rem
}

.divider[data-size="medium"]::after {
	height: 10rem
}

.divider[data-size="large"]::after {
	height: 14rem
}

.album {
	max-width: 32rem;
	margin: 0 auto 2rem;
	padding: 0 1rem
}

.photo {
	display: block;
	width: 100%;
	height: auto;
	box-shadow: 0 5px 15px rgba(27, 57, 65, 0.07), 0 15px 25px rgba(158, 183, 180, 0.3)
}

.caption {
	font-size: calc(var(--f-size) * var(--f-scale-s));
	line-height: .8rem;
	padding-top: .1rem;
	padding-bottom: .1rem;
	margin-top: 1rem;
	text-align: center
}

.caption * {
	font-size: inherit
}
