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

html, body {
  height: 100%;
  overflow: hidden;
}

body {
  font-family: 'Segoe UI', Verdana, Geneva, sans-serif;
  background: var(--theme-color, #fdfdfd);
  color: #333;
}

/* ---------------------------------------------------------------- */
/* Sky background behind the three.js canvas                        */
/* ---------------------------------------------------------------- */
#sky {
  position: fixed;
  inset: 0;
  z-index: 0;
  background-color: var(--theme-color, #fdfdfd);
  background-repeat: repeat-x;
  background-position: top center;
}

#scene {
  position: fixed;
  inset: 0;
  z-index: 1;
  display: block;
}

/* Sayfanın altına doğru hafif bir okunabilirlik geçişi */
#overlay {
  position: fixed;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(to bottom, transparent 0%, transparent 70%, color-mix(in srgb, var(--theme-color, #fdfdfd) 60%, transparent) 100%);
}

#sun-img {
  position: fixed;
  top: clamp(60px, 12vh, 130px);
  right: clamp(40px, 12vw, 220px);
  z-index: 2;
  width: clamp(24px, 3vw, 40px);
  height: auto;
  pointer-events: none;
}

#tree-img {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 3;
  width: clamp(160px, 24vw, 340px);
  height: auto;
  pointer-events: none;
  opacity: .95;
}

/* ---------------------------------------------------------------- */
/* Foreground content                                                */
/* ---------------------------------------------------------------- */
#content {
  position: relative;
  z-index: 4;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 24px;
  pointer-events: none;
}

#content a,
#content button {
  pointer-events: auto;
}

#brand {
  margin-bottom: clamp(20px, 5vh, 48px);
}

#logo-img {
  max-width: min(260px, 60vw);
  max-height: 120px;
  filter: drop-shadow(0 4px 18px rgba(0,0,0,.45));
}

#logo-text {
  font-size: clamp(18px, 4vw, 34px);
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #2a2a2a;
  max-width: min(92vw, 720px);
  margin-left: auto;
  margin-right: auto;
  line-height: 1.4;
  overflow-wrap: break-word;
}

#brand-slogan {
  margin-top: 6px;
  margin-left: auto;
  margin-right: auto;
  font-size: clamp(12px, 1.8vw, 15px);
  letter-spacing: 1px;
  color: #777;
  max-width: min(90vw, 560px);
  line-height: 1.4;
  overflow-wrap: break-word;
}

#hero {
  max-width: 680px;
}

#hero h1 {
  font-size: clamp(24px, 5vw, 46px);
  font-weight: 700;
  line-height: 1.25;
  color: #2a2a2a;
}

#hero #message {
  margin-top: 16px;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  font-size: clamp(14px, 1.8vw, 17px);
  line-height: 1.6;
  color: #555;
}

#contact {
  margin-top: clamp(28px, 6vh, 56px);
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  max-width: 900px;
}

.contact-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(0,0,0,.1);
  color: #333;
  font-size: 13px;
  text-decoration: none;
  transition: background .2s ease, transform .2s ease, border-color .2s ease;
}

.contact-item:not(.no-link):hover {
  background: #fff;
  border-color: var(--accent-color, #f2c14e);
  transform: translateY(-2px);
}

.contact-item.no-link {
  cursor: default;
}

.icon {
  width: 16px;
  height: 16px;
  flex: none;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  opacity: .85;
}

.icon-pin { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23333' d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E"); }
.icon-phone { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23333' d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1-9.4 0-17-7.6-17-17 0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.4 0 .8-.3 1L6.6 10.8z'/%3E%3C/svg%3E"); }
.icon-mail { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23333' d='M2 4h20v16H2V4zm2 2v.4l8 5.6 8-5.6V6H4zm16 3.1-7.4 5.2a1 1 0 0 1-1.2 0L4 9.1V18h16V9.1z'/%3E%3C/svg%3E"); }
.icon-whatsapp { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23333' d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5.1-1.3A10 10 0 1 0 12 2zm5.6 14.2c-.2.7-1.4 1.3-2 1.4-.5.1-1.1.1-1.8-.1-.4-.1-1-.3-1.7-.6-3-1.3-5-4.3-5.1-4.5-.2-.2-1.2-1.6-1.2-3.1 0-1.4.8-2.1 1-2.4.2-.2.5-.3.8-.3h.5c.2 0 .4 0 .6.4.2.5.7 1.8.8 1.9.1.2.1.3 0 .5-.1.2-.1.3-.3.5-.1.2-.3.4-.4.5-.1.1-.3.3-.1.6.2.3.8 1.3 1.7 2.1 1.2 1 2.1 1.4 2.5 1.6.3.1.5.1.6-.1.2-.2.7-.8.9-1.1.2-.3.4-.2.6-.1.2.1 1.5.7 1.8.9.3.1.5.2.5.3.1.2.1.6-.1 1.1z'/%3E%3C/svg%3E"); }

#social {
  margin-top: clamp(20px, 4vh, 36px);
  display: flex;
  gap: 14px;
}

.social-icon {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background-color: rgba(255,255,255,.55);
  border: 1px solid rgba(0,0,0,.1);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 17px 17px;
  transition: background-color .2s ease, transform .2s ease, border-color .2s ease;
}

.social-icon:hover {
  background-color: var(--accent-color, #f2c14e);
  border-color: var(--accent-color, #f2c14e);
  transform: translateY(-3px);
}

.social-instagram { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23333' d='M12 2.2c3.2 0 3.6 0 4.9.1 1.2.1 2 .3 2.4.5.6.2 1 .6 1.5 1 .4.4.7.9 1 1.5.2.5.4 1.2.5 2.4.1 1.3.1 1.7.1 4.9s0 3.6-.1 4.9c-.1 1.2-.3 2-.5 2.4-.2.6-.6 1-1 1.5-.4.4-.9.7-1.5 1-.5.2-1.2.4-2.4.5-1.3.1-1.7.1-4.9.1s-3.6 0-4.9-.1c-1.2-.1-2-.3-2.4-.5-.6-.2-1-.6-1.5-1-.4-.4-.7-.9-1-1.5-.2-.5-.4-1.2-.5-2.4-.1-1.3-.1-1.7-.1-4.9s0-3.6.1-4.9c.1-1.2.3-2 .5-2.4.2-.6.6-1 1-1.5.4-.4.9-.7 1.5-1 .5-.2 1.2-.4 2.4-.5 1.3-.1 1.7-.1 4.9-.1zM12 0C8.7 0 8.3 0 7 .1c-1.3.1-2.2.3-3 .6-.8.3-1.5.7-2.2 1.4C1.1 2.8.7 3.5.4 4.3c-.3.8-.5 1.7-.6 3C-.3 8.7-.3 9.1-.3 12s0 3.3.1 4.7c.1 1.3.3 2.2.6 3 .3.8.7 1.5 1.4 2.2.7.7 1.4 1.1 2.2 1.4.8.3 1.7.5 3 .6C8.3 24 8.7 24 12 24s3.3 0 4.7-.1c1.3-.1 2.2-.3 3-.6.8-.3 1.5-.7 2.2-1.4.7-.7 1.1-1.4 1.4-2.2.3-.8.5-1.7.6-3 .1-1.4.1-1.8.1-4.7s0-3.3-.1-4.7c-.1-1.3-.3-2.2-.6-3-.3-.8-.7-1.5-1.4-2.2C21.2 1.1 20.5.7 19.7.4c-.8-.3-1.7-.5-3-.6C15.3 0 14.9 0 12 0zm0 5.8A6.2 6.2 0 1 0 12 18.2 6.2 6.2 0 0 0 12 5.8zm0 10.2A4 4 0 1 1 12 8a4 4 0 0 1 0 8zm6.4-10.4a1.4 1.4 0 1 1 0-2.9 1.4 1.4 0 0 1 0 2.9z'/%3E%3C/svg%3E"); }
.social-facebook { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23333' d='M22 12a10 10 0 1 0-11.6 9.9v-7H7.9V12h2.5V9.8c0-2.5 1.5-3.9 3.8-3.9 1.1 0 2.2.2 2.2.2v2.4h-1.3c-1.2 0-1.6.8-1.6 1.6V12h2.8l-.4 2.9h-2.4v7A10 10 0 0 0 22 12z'/%3E%3C/svg%3E"); }
.social-x { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23333' d='M18.9 2H22l-7.4 8.5L23.3 22h-6.8l-5.3-6.9L5 22H1.9l7.9-9L1 2h6.9l4.8 6.3L18.9 2zm-1.2 18h1.9L7.4 4H5.3l12.4 16z'/%3E%3C/svg%3E"); }
.social-linkedin { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23333' d='M20.5 2h-17A1.5 1.5 0 0 0 2 3.5v17A1.5 1.5 0 0 0 3.5 22h17a1.5 1.5 0 0 0 1.5-1.5v-17A1.5 1.5 0 0 0 20.5 2zM8.3 18.5H5.7V9.8h2.6v8.7zM7 8.6a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm11.5 9.9H15.9v-4.6c0-1.1 0-2.5-1.5-2.5s-1.8 1.2-1.8 2.4v4.7H10V9.8h2.5v1.2h.1c.3-.6 1.2-1.4 2.6-1.4 2.8 0 3.3 1.8 3.3 4.2v4.7z'/%3E%3C/svg%3E"); }
.social-youtube { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23333' d='M23.5 6.5s-.2-1.6-.9-2.4c-.9-1-1.9-1-2.3-1.1C17.3 2.8 12 2.8 12 2.8h0s-5.3 0-8.3.2c-.4 0-1.4.1-2.3 1.1-.7.8-.9 2.4-.9 2.4S.3 8.4.3 10.3v1.4c0 1.9.2 3.8.2 3.8s.2 1.6.9 2.4c.9 1 2.1.9 2.6 1 1.9.2 8 .2 8 .2s5.3 0 8.3-.2c.4 0 1.4-.1 2.3-1.1.7-.8.9-2.4.9-2.4s.2-1.9.2-3.8v-1.4c0-1.9-.2-3.8-.2-3.8zM9.7 14.6V7.9l6.4 3.4-6.4 3.3z'/%3E%3C/svg%3E"); }

footer#credit {
  position: fixed;
  bottom: 10px;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 11px;
  color: rgba(0,0,0,.35);
  z-index: 2;
  pointer-events: none;
}

@media (max-width: 640px) {
  #contact { max-width: 320px; }
  .contact-item { font-size: 12px; padding: 8px 12px; }
}