
@font-face {
  font-family: "Cormorant Garamond";
  src: url("assets/fonts/CormorantGaramond-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Cormorant Garamond";
  src: url("assets/fonts/CormorantGaramond-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Montserrat";
  src: url("assets/fonts/Montserrat-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Montserrat";
  src: url("assets/fonts/Montserrat-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}


:root {
  color-scheme: light dark;

  --puder: #F1E4DF;
  --hellgold: #D5B16A;
  --gold: #B88632;
  --altgold: #805B27;
  --greige: #514945;
  --max: 1100px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --puder: #3A1533;      /* Hintergrund: Pflaume */
    --hellgold: #E3CC99;   /* hellstes Gold / Champagner */
    --gold: #D5B16A;       /* Hervorhebungen */
    --altgold: #B88632;    /* H1 / H2 */
    --greige: #F1E4DF;     /* Fließtext: warmes Off-White */
  }
}

*{box-sizing:border-box}

html{
  background:var(--puder);
  color:var(--greige);
  font-family:"Montserrat", Arial, sans-serif;
  font-weight:400;
}

body{
  margin:0;
  min-height:100vh;
  background:var(--puder);
  color:var(--greige);
}

a{
  color:var(--altgold);
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}

.site{
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

.hero{
  width:min(var(--max), 92vw);
  margin:0 auto;
  padding:5.5rem 0 2rem;
  text-align:center;
  flex:1;
}

.logo{
  display:block;
  width:min(760px, 82vw);
  height:auto;
  margin:0 auto 3.2rem;
}

/* Überschrift 1 */
h1{
  font-family:"Cormorant Garamond", Georgia, serif;
  font-weight:700;
  color:var(--altgold);
  margin:0 0 2.25rem;
  font-size:clamp(2rem, 4.2vw, 4rem);
  line-height:1.08;
}

/* Überschrift 2 */
h2{
  font-family:"Cormorant Garamond", Georgia, serif;
  font-weight:600;
  color:var(--altgold);
}

/* Fließtext */
p, li{
  font-family:"Montserrat", Arial, sans-serif;
  font-weight:400;
  color:var(--greige);
}

.lead{
  max-width:780px;
  margin:0 auto;
  font-family:"Montserrat", Arial, sans-serif;
  font-weight:400;
  color:var(--greige);
  font-size:clamp(1.05rem, 1.8vw, 1.35rem);
  line-height:1.7;
}

.lead p{
  margin:.1rem 0;
}

/* Hervorhebung / kleine Überschrift */
.highlight,
.small-heading,
.soon{
  font-family:"Montserrat", Arial, sans-serif;
  font-weight:600;
  color:var(--gold);
}

.soon{
  margin-top:1.9rem !important;
  font-style:italic;
}

.footer{
  text-align:center;
  padding:1rem 1.25rem 2rem;
  font-family:"Montserrat", Arial, sans-serif;
  font-size:.95rem;
  line-height:1.9;
  color:var(--greige);
}

.footer .mail{
  display:block;
  margin-bottom:1.8rem;
}

.footer nav{
  display:flex;
  justify-content:center;
  gap:.55rem;
  flex-wrap:wrap;
}

.legal{
  width:min(850px, 90vw);
  margin:0 auto;
  padding:4.5rem 0 4rem;
  flex:1;
}

.legal .brand{
  display:block;
  width:min(430px, 72vw);
  height:auto;
  margin:0 auto 4rem;
}

.legal h1{
  font-size:clamp(2.4rem, 5vw, 3.8rem);
  margin-bottom:2rem;
}

.legal h2{
  font-size:1.65rem;
  margin-top:2.1rem;
  margin-bottom:.7rem;
}

.legal p, .legal li{
  line-height:1.7;
  font-size:1rem;
}

.legal ul{
  padding-left:1.3rem;
}

.note{
  background:rgba(213,177,106,.14);
  border:1px solid var(--hellgold);
  color:var(--greige);
  padding:1rem 1.2rem;
  border-radius:10px;
  margin:1.25rem 0 2rem;
}

.note strong{
  font-family:"Montserrat", Arial, sans-serif;
  font-weight:600;
  color:var(--gold);
}

.text-link {
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  color: var(--gold);
  text-decoration: underline;
  text-decoration-color: var(--gold);
  text-underline-offset: 0.18em;
}

.text-link:visited {
  color: var(--gold);
}

.text-link:hover,
.text-link:focus {
  color: var(--altgold);
}

.brand-star {
  display: flex;
  justify-content: center;
  margin-top: 2.5rem;
  margin-bottom: 0;
}

.brand-star img {
  width: 34px;
  height: auto;
  display: block;
  opacity: 0.75;
}

@media (max-width:640px){
  .hero{
    width:92vw;
    padding-top:3.1rem;
  }

  .logo{
    width:88vw;
    margin-bottom:1.8rem;
  }

  h1{
    font-size:2rem;
    margin-bottom:1.7rem;
  }

  .lead{
    font-size:1rem;
    line-height:1.65;
  }

  .soon{
    margin-top:1.4rem !important;
  }

  .footer{
    padding-top:0.5rem;
  }

  .legal{
	padding-top:2.5rem;
  }

  .legal .brand{
    width:72vw;
	margin-bottom:2.4rem;
  }

	.legal h1{
		font-size:2rem;
		margin-bottom:1.5rem;
}
	.legal h2{
		font-size:1.55rem;
		line-height:1.2;
		margin-top:1.8rem;
		margin-bottom:.6rem;
}
	.legal p,
	.legal li{
		font-size:1rem;
		line-height:1.65;
}
.brand-star {
    margin-top: 2rem;
  }

  .brand-star img {
    width: 30px;
  }

}
