/*
Theme Name:  Praxis Theme
Theme URI:   
Author:      Your Agency
Author URI:  
Description: Custom theme for Praxis website - bilingual DE/EN
Version:     1.0.0
Text Domain: praxis-theme
*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
/* -------------------------
   CSS VARIABLES
-------------------------- */
:root {
  --color-primary:   #2c2c2c;
  --color-accent:    #C9AA9E;
  --color-light:     #f5f5f5;
  --color-white:     #ffffff;
  --color-text:      #3a3a3a;
  --color-blue:      #F7FBFF;	

  --font-main:       "Montserrat", sans-serif;

  --spacing-sm:      1rem;
  --spacing-md:      2rem;
  --spacing-lg:      4rem;
  --spacing-xl:      6.5rem;
	

  --max-width:       2200px;
}

/* -------------------------
   RESET & BASE
-------------------------- */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-main);
  color: var(--color-text);
  background-color: var(--color-blue);
  line-height: 1.6;
}

img {
  max-width: 100%;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
  font-family: inherit;
  font-size: inherit;
}

/* -------------------------
   STICKY FOOTER
-------------------------- */
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main {
    flex: 1;
}

/* -------------------------
   TYPOGRAPHY
-------------------------- */
h1 { font-size: clamp(2rem, 4vw, 3.5rem); font-weight: 700; line-height: 1.2; }
h2 { font-size: clamp(1.5rem, 3vw, 2.5rem); font-weight: 600; line-height: 1.3; }
h3 { font-size: clamp(1.2rem, 2vw, 1.8rem); font-weight: 600; }
h4 { font-size: 1rem; font-weight: 500; letter-spacing: 0.1em; color: var(--color-accent); }

p { font-size: 1.2rem; margin-bottom: 1rem; }

/* -------------------------
   UTILITIES
-------------------------- */
.container {
  width: 100%;
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--spacing-xl);
}

.section {
  padding: var(--spacing-lg) 0;
}

.home-hero{
padding: 0 0 var(--spacing-lg) 0;
}

	@media (max-width: 768px){
		.section {
           padding: var(--spacing-sm) 0;
        }
		.container {
			padding: 0 var(--spacing-md);
		}
        p { font-size: 1rem; margin-bottom: 1rem; }
		

		
}