@charset "utf-8";

/*
Theme Name:		corinna-breier-coaching.de
Theme URI:
Version:		0.9
Author:			Rico Floß, floss@51nullacht.de
Author URI: 	https://www.51nullacht.de/
Description:
Date:			2025-01
Client:			Rotsporn
*/

/* Reset */
* { margin: 0; padding: 0; box-sizing: border-box; }

/* General */
body { font-family: 'Molengo', Arial, sans-serif; line-height: 1.6; color: var(--primary); background-color: var(--light); }

.wrapper { max-width: 1800px; margin: auto; }

h1, h2, h3 { margin-bottom: 1rem; font-weight: 600; }
h1 { color: var(--light); font-size: 1.5rem; }

p { margin-bottom: 1rem; }

a { color: var(--primary); text-decoration: none; font-weight: 600; }
a:hover { text-decoration: underline; }

/* header */
.header-content { background-color: var(--light-primary); display: flex; flex-wrap: wrap; padding: 8vh 2vw 16vh 2vw; }
.header-content .intro { font-size: 2rem; color: var(--primary); width: 100%; text-align: center; }
.header-content .logo { text-align: center; width: 100%; }
.header-content .logo img { margin: 2rem 0; width: 100%; }

/* main */
.main-content { display: flex; flex-wrap: wrap; padding: 2vh 2vw; }
.main-content .portrait { margin-top: calc(-1 * (95px + 2vh)); width: 100%; text-align: center; }
.main-content .contact-container { width: 100%; display: flex; flex-wrap: wrap; }
.main-content .contact img { vertical-align: middle; width: 20px; }
.main-content .contact,
.main-content .claim { font-size: 1rem; width: 100%; text-align: center; }

@media (min-width: 768px) {
	.header-content .intro { width: 33.33%; font-size: 1.5rem; text-align: left; }
	.header-content .logo { margin-top: 13vh; width: 33.33%; }

	.main-content .contact-container { width: 70%; margin-top: 0; }
	.main-content .portrait { width: 30%; }
	.main-content .contact img { width: auto; }
	.main-content .contact,
	.main-content .claim { font-size: 2rem; text-align: left; }
	.main-content .claim { padding-left: 3.888rem; }
}

@media (min-width: 1800px) {
	h1 { font-size: 3rem; }
	.header-content .intro { font-size: 3rem; }

	.header-content .intro { width: 25%; font-size: 2rem; }
	.header-content .logo { width: 50%; }

	.main-content .contact,
	.main-content .claim { width: 50%; }
	.main-content .claim { padding-left: 0; }
}

:root {
	--light: #fff;
	--primary: #728f70;
	--light-primary: #aabb95;
}