:root{
  --primary:#6a8498;
  --primary-light:#dbe4ea;
  --primary-dark:#4c5c66;
  --accent:#768c82;
  --bg:#f5f7f8;
  --text:#222;

  --slider-bg: var(--primary-light);
  --card-radius: 1rem;
  --shadow-soft: 0 10px 25px rgba(15, 23, 42, 0.08);

  --slider-height: 480px;
  --gap: 14px;
  --slideW: 100%;
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
}

*{ box-sizing:border-box; }
body{ margin:0; background:var(--bg); color:var(--text); }
a{ color:inherit; text-decoration:none; }
a:hover{ text-decoration:underline; }

.container{ max-width:1000px; margin:0 auto; padding:1.25rem 1.5rem; }

.topbar{ background:#ffffffcc; border-bottom:1px solid #dde2e6; backdrop-filter: blur(10px); }
.topbar-inner{ display:flex; align-items:center; justify-content:center; flex-direction:column; text-align:center; padding:1.5rem 0 2rem; }
.topbar-logo img{ width:420px; max-width:90vw; height:auto; }
.topbar-title{ margin-top:1rem; font-size:1.4rem; font-weight:600; color:var(--primary-dark); }

.hero{ background: radial-gradient(circle at top left, #e7edf2, #ffffff); border-bottom:1px solid #dde2e6; padding-block:2rem 1.5rem; text-align:center; }
.hero-title{ font-size: clamp(2.1rem, 3.8vw, 2.8rem); margin:0 0 1rem; color:var(--primary-dark); }

.hero-contact{ margin:0 auto; max-width:520px; text-align:left; background:#fff; border-radius: var(--card-radius); padding: 1.4rem 1.6rem; box-shadow: var(--shadow-soft); border: 1px solid #e5e7eb; font-size:0.98rem; }
.hero-contact h2{ margin:0 0 0.75rem; font-size:1.2rem; color:var(--primary-dark); }
.hero-contact p{ margin:0.25rem 0; color:#374151; }

/* Slider */
.slider-section{ width:100%; background: var(--slider-bg); padding: 1rem 0; }
.slider-shell{ max-width:1000px; margin:0 auto; padding: 0 1.5rem; }

.slider{ position:relative; height: var(--slider-height); border-radius: 12px; background: var(--slider-bg); border: 1px solid rgba(0,0,0,0.06); box-shadow: var(--shadow-soft); overflow:hidden; }

.slides{
  height:100%;
  display:flex;
  gap: var(--gap);
  padding: 12px;
  overflow-x:auto;
  scroll-snap-type: x mandatory;
  scroll-behavior:smooth;
  scrollbar-width:none;
}
.slides::-webkit-scrollbar{ display:none; }

.slide{
  margin: 0;
  flex: 0 0 var(--slideW);
  height: calc(var(--slider-height) - 24px);
  display:flex;
  align-items:center;
  justify-content:center;
  scroll-snap-align: start;
  cursor: zoom-in;
}

.slide img{
  width:100%;
  height:100%;
  object-fit: contain;
  display:block;
}

.slider-btn{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  border:none;
  background: rgba(87, 103, 112, 0.35);
  color:#fff;
  width:42px;
  height:42px;
  border-radius:999px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.6rem;
  z-index:5;
}
.slider-btn.prev{ left:10px; }
.slider-btn.next{ right:10px; }

.dots{
  position:absolute;
  left:50%;
  bottom:10px;
  transform: translateX(-50%);
  display:flex;
  gap:8px;
  z-index:6;
}
.dot{
  width:10px;
  height:10px;
  border-radius:50%;
  border:none;
  background:#ccc;
}
.dot.is-active{ background:#666; }

.section{ padding-block: 2rem; }
.card{ background:#fff; border-radius: var(--card-radius); padding: 1.6rem; box-shadow: var(--shadow-soft); border: 1px solid #e5e7eb; font-size:0.95rem; color:#374151; }

.privacy-hint{ margin-top:1.2rem; padding:0.9rem 1.1rem; border-radius:0.9rem; background:#f1f5f9; border-left: 4px solid var(--accent); font-size:0.9rem; }

.thanks{ text-align:center; font-size:0.85rem; color:#666; margin-bottom:2rem; }

.footer{ border-top:1px solid #e2e8f0; background:#fff; font-size:0.8rem; color:#6b7280; text-align:center; padding:1rem; }

/* Lightbox */
.lightbox{ position: fixed; inset: 0; display:none; align-items:center; justify-content:center; background: rgba(0,0,0,0.86); z-index:9999; }
.lightbox.open{ display:flex; }
.lightbox-img{ max-width:92vw; max-height:80vh; object-fit:contain; }
.lightbox-close, .lightbox-nav{ position:absolute; background:rgba(255,255,255,0.2); border:none; color:#fff; font-size:2rem; cursor:pointer; }
.lightbox-close{ top:20px; right:30px; }
.lightbox-prev{ left:20px; top:50%; transform:translateY(-50%); }
.lightbox-next{ right:20px; top:50%; transform:translateY(-50%); }

figure{ margin:0; }