/* ============================================================
   Grup GCB — Landing Concept
   Editorial & elegant · warm Mediterranean · heritage burgundy
   ============================================================ */

:root {
  --burgundy: #7A2424;
  --burgundy-dark: #5C1A1A;
  --burgundy-light: #A04848;
  --cream: #F8F4ED;
  --charcoal: #2A2A2A;
  --gold: #C9A961;
  --terracotta: #C97B5C;
  --line: rgba(42, 42, 42, 0.12);
}

* { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--cream);
  color: var(--charcoal);
  font-family: "DM Sans", system-ui, sans-serif;
  overflow-x: hidden;
}

.font-serif { font-family: "Playfair Display", Georgia, serif; }
.font-sans  { font-family: "DM Sans", system-ui, sans-serif; }

/* letter-spaced label / eyebrow */
.eyebrow {
  font-family: "DM Sans", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  font-weight: 600;
  font-size: 0.72rem;
}

/* Thin gold rule used as editorial divider */
.rule-gold {
  width: 56px; height: 1px;
  background: var(--gold);
  display: inline-block;
}

/* ---- nav underline animation ---- */
.nav-link {
  position: relative;
  padding-bottom: 4px;
}
.nav-link::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 100%; height: 1.5px;
  background: var(--burgundy);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.nav-link:hover::after,
.nav-link.is-active::after { transform: scaleX(1); }

/* ---- scroll reveal ---- */
.reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 1s cubic-bezier(0.22,1,0.36,1), transform 1s cubic-bezier(0.22,1,0.36,1);
  will-change: opacity, transform;
}
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1 !important; transform: none !important; }
}
/* stagger helper */
.reveal[data-delay="1"] { transition-delay: 0.08s; }
.reveal[data-delay="2"] { transition-delay: 0.16s; }
.reveal[data-delay="3"] { transition-delay: 0.24s; }
.reveal[data-delay="4"] { transition-delay: 0.32s; }
.reveal[data-delay="5"] { transition-delay: 0.40s; }

/* ---- hero slow zoom ---- */
@keyframes heroZoom {
  from { transform: scale(1.08); }
  to   { transform: scale(1); }
}
.hero-img { animation: heroZoom 14s ease-out forwards; }

/* ---- image-slot styling overrides for property cards ---- */
image-slot {
  --slot-bg: #efe7da;
  display: block;
  background: linear-gradient(135deg, #efe7da, #e4d9c6);
}

/* refined select / input reset for search bar */
.gcb-field {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: none;
  outline: none;
  font-family: "DM Sans", sans-serif;
  font-size: 0.95rem;
  color: var(--charcoal);
  width: 100%;
  cursor: pointer;
}
.gcb-field::placeholder { color: #8a8378; }

/* custom select caret */
.select-wrap { position: relative; }
.select-wrap::after {
  content: "";
  position: absolute;
  right: 4px; top: 50%;
  width: 7px; height: 7px;
  border-right: 1.5px solid var(--burgundy);
  border-bottom: 1.5px solid var(--burgundy);
  transform: translateY(-65%) rotate(45deg);
  pointer-events: none;
}

/* heart pop */
@keyframes heartPop {
  0% { transform: scale(1); }
  40% { transform: scale(1.35); }
  100% { transform: scale(1); }
}
.heart-pop { animation: heartPop 0.4s ease; }

/* chatbot panel slide */
@keyframes panelIn {
  from { opacity: 0; transform: translateY(16px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.panel-in { animation: panelIn 0.32s cubic-bezier(0.22,1,0.36,1); }

@keyframes bubbleIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.bubble-in { animation: bubbleIn 0.35s ease both; }

/* typing dots */
@keyframes blink { 0%,80%,100% { opacity: 0.25; } 40% { opacity: 1; } }
.dot { animation: blink 1.2s infinite both; }
.dot:nth-child(2) { animation-delay: 0.2s; }
.dot:nth-child(3) { animation-delay: 0.4s; }

/* subtle floating for chat launcher */
@keyframes floaty { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
.floaty { animation: floaty 4s ease-in-out infinite; }

/* selection */
::selection { background: var(--burgundy); color: #fff; }

/* thin scrollbar in chat */
.thin-scroll::-webkit-scrollbar { width: 6px; }
.thin-scroll::-webkit-scrollbar-thumb { background: rgba(122,36,36,0.25); border-radius: 3px; }

/* link hover for footer */
.foot-link { transition: color 0.25s ease, opacity 0.25s ease; }
.foot-link:hover { color: var(--gold); }

/* flag button */
.flag-btn {
  font-size: 0.95rem;
  line-height: 1;
  opacity: 0.55;
  transition: opacity 0.2s ease, transform 0.2s ease;
  position: relative;
  padding-bottom: 3px;
}
.flag-btn:hover { opacity: 1; transform: translateY(-1px); }
.flag-btn.active { opacity: 1; }
.flag-btn.active::after {
  content: "";
  position: absolute;
  left: 50%; bottom: -2px;
  transform: translateX(-50%);
  width: 14px; height: 1.5px;
  background: var(--burgundy);
}

/* CTA buttons */
.btn-primary {
  background: var(--burgundy);
  color: #fff;
  transition: background 0.3s ease, transform 0.25s ease, box-shadow 0.3s ease;
  box-shadow: 0 10px 30px -12px rgba(122,36,36,0.55);
}
.btn-primary:hover { background: var(--burgundy-light); transform: translateY(-2px); box-shadow: 0 16px 36px -12px rgba(122,36,36,0.6); }

.btn-ghost {
  border: 1px solid currentColor;
  transition: background 0.3s ease, color 0.3s ease, transform 0.25s ease;
}

/* property card hover */
.prop-card { transition: transform 0.5s cubic-bezier(0.22,1,0.36,1), box-shadow 0.5s ease; }
.prop-card:hover { transform: translateY(-6px); box-shadow: 0 30px 60px -30px rgba(42,42,42,0.35); }
.prop-card .slot-zoom { transition: transform 0.8s cubic-bezier(0.22,1,0.36,1); }
.prop-card:hover .slot-zoom { transform: scale(1.04); }

/* step number */
.step-num {
  font-family: "Playfair Display", serif;
  font-size: 3.4rem;
  line-height: 1;
  color: var(--burgundy);
  opacity: 0.18;
}
