/* Reset */
* {
	box-sizing: border-box;
	margin: 0; padding: 0;
}
body {
  background-color: #d5d0c6;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.5;
  color: #5a5a5a;
}

/* HERO */
.hero {
  width: 1100px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  overflow: hidden;
}
.hero img {
  width: 100%;
  height: auto;
  display: block;
}

/* CONTENT */
.content {
  background-color: #e0e0e0;
  width: 1100px;
  margin: 0px auto;
  padding: 20px 20px;       /* inre luft */
}

/* MAIN 3 COLUMNS */
.main-columns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}

/* COLUMN */
.column {
  position: relative;
}
.column img {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 20px;
}
.column p {
  font-size: 1rem;
}

/* COLUMN DECORATIONS */
.column:not(:nth-child(3n))::after {
  content: "";
  position: absolute;
  top: 0;
  right: -20px;
  width: 0;
  height: 100%;
  border-right: 1px dashed #b8b8b8; /* vertical */
}

/* POSTCARDS SECTION */
.postcards {
  margin-top: 0px; margin-bottom: 20px;
  padding-top: 30px; padding-bottom: 0px;
  border-top: 1px solid #c8c8c8;
  text-align: center;
}
.postcards h2 {
  margin-bottom: 15px;
  font-size: 1.5rem;
  font-weight: normal;
}
.postcard-row {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
.postcard {
  flex: 1 1 180px;
  max-width: 200px;
  margin: 0 auto;
  text-decoration: none;
  color: inherit;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.postcard img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 10px;
  margin-bottom: 8px;
}
.postcard span {
  font-size: 0.95rem;
}
.postcard:hover {
  transform: translateY(-4px);
  opacity: 0.85;
}
.postcards::after {
  content: "";
  display: block;
  /*border-top: 1px dashed #b8b8b8;*/
  margin-top: 20px;
}

/* BOTTOM LINKS */
.link-columns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0px;
}
.links {
  background-color: #e0e0e0;
  margin-top: 0px;
  padding: 8px 0px 3px 0px;

  text-align: center;
}
.links a {
  display: inline-flex;
  align-items: center; margin-left: -4px;
  gap: 8px;
  color: #fff; text-decoration: none;
  font-size: clamp(1.0rem, 4vw, 1.5rem);
  transition: transform 0.2s ease, color 0.15s ease;
}
.links img {
  height: clamp(22px, 3vw, 36px);
  width: auto;
}
.links a:hover {
  transform: translateY(-2px);
  color: #e2ddd7;
}
.footer-text {
  text-align: center;
  font-size: 0.9rem;
  opacity: 0.7;
  margin: 10px 0;

  display: block;
  width: 100%;
}

/* global scaling */
@media (max-width: 1100px) {
  body {
    overflow-x: hidden;
  }
  .hero,
  .content {
    transform-origin: top center;
    transform: scale(calc(100vw / 1100));
  }
}