@import url('../js/fancybox/jquery.fancybox.css');
@import url('https://fonts.googleapis.com/css2?family=Tenor+Sans&display=swap');

html, body { margin:0px; padding:0px; font-size:1em; font-family:_;font-weight:400; color:#ccc; background-color:#fff;}
/* Base layout */
*,
*::before,
*::after { box-sizing: border-box; }

html,
body { height: 100%; margin: 0; padding: 0; }
body { font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: linear-gradient(135deg, #f5f2ed 0%, #ffffff 40%, #e6edf5 100%); color: #333333; }
a{pointer-events: all; cursor: pointer;color: unset;text-decoration: none;}
.page { min-height: 100vh; display: flex; flex-direction: column; padding: 32px 40px 24px; z-index: 1;position: relative;}
.header { display: flex; justify-content: center; margin-top: 32px; }
.bg{   position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-position: center;background-size: cover;opacity: 0.2;}
.logo { text-align: center; }
.logo img {width: 350px;}
.hero { flex: 1; display: grid; grid-template-columns: minmax(260px, 340px) minmax(0, 1.3fr); gap: 48px; align-items: center; max-width: 1200px; margin: 0 auto 40px; }
.hero-left { display: flex; justify-content: center; }
.photo-gradient { width: 100%; aspect-ratio: 4 / 5;  object-fit:cover; object-position: top;}
.hero-right { max-width: 560px; }
.coming-soon {  margin: 0 0 12px; font-size: 27px;font-family: "Tenor Sans",sans-serif;}
.divider { display: block; width: 80px; height: 1.1px; background: linear-gradient(135deg, #c59a3b 0%, #e3b54e 50%, #c58f2d 100%); margin-bottom: 24px; }
.headline { font-size: 55px; line-height: 1.4; font-weight: 500; margin: 0 0 24px; font-family: "Tenor Sans",sans-serif;}
.subheadline {  margin: 0; font-size: 27px;font-family: "Tenor Sans",sans-serif;}
.cta-row { min-width: 945px; margin: 0 auto 24px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.cta-button { display: flex; align-items: center; justify-content: center; padding: 14px 18px; text-decoration: none; background: linear-gradient(135deg, #c59a3b 0%, #e3b54e 50%, #c58f2d 100%); color: #ffffff; font-size: 15px; border-radius: 2px; box-shadow: 0 6px 18px rgba(181, 135, 36, 0.4); transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease; font-size: 17px;font-family: "Tenor Sans",sans-serif;}
.cta-button:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(181, 135, 36, 0.45); filter: brightness(1.05); }
.cta-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.footer { display: flex; justify-content: center; align-items: center; gap: 8px; font-size: 13px; color: #666666; text-align: center; flex-wrap: wrap; line-height: 1.8;}
.footer .dot { font-size: 12px; }
.language-aktiv{display: none;}

@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; text-align: left; }
  .hero-left { justify-content: flex-start; max-width: 320px; }
  .hero-right { max-width: none; }
  .cta-row { grid-template-columns: 1fr; min-width: 90%;}
  .logo img{}
}

@media (max-width: 640px) {
  body { height: auto; margin: 0; padding: 0; }
  .page { padding: 24px 16px 16px; }
  .logo-main { font-size: 26px; letter-spacing: 0.18em; }
  .headline { font-size: 22px; }
  .subheadline { font-size: 18px; }
  .logo img{width: 250px;margin-bottom: 30px;}
  .hero-left{width: 100%; max-width: none;}
  .photo-gradient{aspect-ratio: 6 / 5;}
  .bg{position: fixed;    height: 100vh; min-height: 100%;} 
  .hero-right{text-align: center;}
  .divider{margin: 0 auto 24px auto;}
}