:root {
  --warm-white: #f7f4ee;
  --sand: #ded0bd;
  --sand-light: #ece4d8;
  --olive: #6d7453;
  --olive-dark: #4f563d;
  --charcoal: #292b28;
  --muted: #73756e;
  --white: #ffffff;
  --radius: 24px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: "DM Sans", system-ui, sans-serif;
  color: var(--charcoal);
  background: var(--warm-white);
  line-height: 1.65;
}
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  height: 78px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 4vw;
  background: rgba(247,244,238,.94);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(41,43,40,.08);
}
.brand, .footer-brand {
  font-family: "Playfair Display", serif;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: .01em;
}
.nav { display: flex; gap: 28px; font-size: .93rem; }
.nav a { opacity: .82; }
.nav a:hover { opacity: 1; }
.header-actions { display: flex; justify-content: flex-end; align-items: center; gap: 12px; }
.lang-switch {
  border: 0;
  background: transparent;
  padding: 9px 10px;
  cursor: pointer;
  color: var(--charcoal);
  font-weight: 600;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: var(--olive-dark);
  color: white;
  padding: 14px 22px;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 600;
  transition: transform .2s ease, opacity .2s ease;
}
.button:hover { transform: translateY(-1px); opacity: .92; }
.button-small { padding: 10px 17px; font-size: .88rem; }

.hero {
  position: relative;
  min-height: 76vh;
  display: flex;
  align-items: end;
  padding: 7vw;
  background:
    linear-gradient(120deg, rgba(36,43,36,.1), rgba(27,29,26,.15)),
    url('assets/2.png') center/cover no-repeat;
}
.hero-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(25,30,25,.62), rgba(25,30,25,.04) 60%); }
.hero-content { position: relative; max-width: 820px; color: white; }
.eyebrow, .section-kicker { font-size: .74rem; letter-spacing: .18em; font-weight: 600; text-transform: uppercase; }
.hero h1, h2 {
  font-family: "Playfair Display", serif;
  font-weight: 500;
  line-height: 1.07;
}
.hero h1 { margin: 8px 0 10px; font-size: clamp(3.7rem, 8vw, 7.5rem); }
.hero-tagline { max-width: 650px; font-size: clamp(1.1rem, 2vw, 1.45rem); margin: 0 0 24px; }
.button-hero { background: rgba(255,255,255,.94); color: var(--charcoal); }

.booking-card-wrap { max-width: 1180px; margin: -38px auto 0; position: relative; z-index: 5; padding: 0 24px; }
.booking-card {
  display: grid;
  grid-template-columns: 1.2fr 1.2fr .8fr auto;
  gap: 12px;
  align-items: end;
  background: white;
  padding: 18px;
  border-radius: 22px;
  box-shadow: 0 22px 65px rgba(48,42,33,.14);
}
.booking-card label span { display:block; font-size:.74rem; text-transform:uppercase; letter-spacing:.1em; margin:0 0 6px 5px; color: var(--muted); }
.booking-card input, .booking-card select {
  width: 100%;
  border: 1px solid #ddd7cc;
  background: #fbfaf7;
  border-radius: 14px;
  padding: 13px;
  color: var(--charcoal);
}
.booking-note { text-align:center; color:var(--muted); font-size:.83rem; margin:10px 0 0; }

.section { padding: 110px max(5vw, 30px); max-width: 1360px; margin: 0 auto; }
.section-kicker { color: var(--olive-dark); margin-bottom: 18px; }
h2 { font-size: clamp(2.5rem, 5vw, 4.8rem); margin: 0 0 25px; }
.intro-grid { display:grid; grid-template-columns: .82fr 1.18fr; gap: 80px; align-items:start; }
.intro-copy { max-width: 760px; font-size: 1.05rem; color:#4a4d48; }
.intro-copy p { margin-top: 0; margin-bottom: 20px; }
.accent-line { color: var(--olive-dark); font-weight: 600; }

.facts-strip {
  max-width: 1280px;
  margin: 0 auto 30px;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1px;
  background: rgba(79,86,61,.12);
  border: 1px solid rgba(79,86,61,.12);
}
.fact { min-height: 138px; background: #f1ede5; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:15px; }
.fact strong { font-family:"Playfair Display",serif; font-size:2rem; color:var(--olive-dark); }
.fact span { color:#65675f; font-size:.88rem; }

.two-col { display:grid; grid-template-columns: 1.05fr .95fr; gap:70px; align-items:center; }
.photo-card { min-height:620px; border-radius: var(--radius); background-size:cover; background-position:center; box-shadow:0 20px 60px rgba(31,34,31,.09); }
.photo-living { background-image:url('assets/12.png'); background-position:center; }
.content-card p { color:#555851; font-size:1.02rem; }

.amenities-section { padding-top: 40px; }
.amenities-grid { display:grid; grid-template-columns: repeat(4,1fr); gap:18px; margin-top:50px; }
.amenities-grid article { padding:28px; border:1px solid rgba(79,86,61,.16); border-radius:20px; background:rgba(255,255,255,.4); }
.amenities-grid article span { color:var(--olive); font-size:.8rem; letter-spacing:.12em; }
.amenities-grid h3 { font-family:"Playfair Display",serif; font-size:1.45rem; margin:24px 0 8px; }
.amenities-grid p { color:var(--muted); margin:0; font-size:.92rem; }

.gallery-section { padding: 110px max(4vw, 24px); background:#eae2d6; }
.gallery-head { max-width:1280px; margin:0 auto 42px; display:flex; align-items:end; justify-content:space-between; gap:40px; }
.gallery-head h2 { margin-bottom:0; }
.gallery-note { max-width:350px; color:var(--muted); }
.gallery-grid { max-width:1280px; margin:auto; display:grid; grid-template-columns:repeat(12,1fr); grid-auto-rows:210px; gap:14px; }
.gallery-item { border:0; padding:0; width:100%; border-radius:18px; background-size:cover; background-position:center; position:relative; z-index:1; transition:transform .35s ease, box-shadow .35s ease, filter .35s ease; transform-origin:center; will-change:transform; cursor:zoom-in; appearance:none; }
@media (hover:hover) and (pointer:fine) {
  .gallery-item:hover { transform:scale(1.075); z-index:10; box-shadow:0 24px 55px rgba(34,38,29,.28); filter:saturate(1.04) contrast(1.02); }
}
.gallery-1 { grid-column:span 7; grid-row:span 2; background-image:url('assets/1.png'); }
.gallery-2 { grid-column:span 5; background-image:url('assets/2.png'); }
.gallery-3 { grid-column:span 5; background-image:url('assets/3.png'); }
.gallery-4 { grid-column:span 5; background-image:url('assets/4.png'); }
.gallery-5 { grid-column:span 7; background-image:url('assets/12.png'); }
.gallery-6 { grid-column:span 4; background-image:url('assets/13.png'); }
.gallery-7 { grid-column:span 4; background-image:url('assets/16.png'); }
.gallery-8 { grid-column:span 4; background-image:url('assets/21.png'); }
.gallery-9 { grid-column:span 12; background-image:url('assets/26.png'); background-position:center 55%; }

.location-card { display:grid; grid-template-columns: 1fr 1fr; gap:70px; align-items:stretch; }
.location-card > div:first-child { padding:35px 0; }
.text-link { color:var(--olive-dark); font-weight:600; }
.map-frame { min-height:440px; border-radius:var(--radius); overflow:hidden; background:#e7dfd2; box-shadow:0 16px 44px rgba(48,42,33,.10); }
.map-frame iframe { display:block; width:100%; height:100%; min-height:440px; border:0; }

/* Flatpickr calendar: deliberately English/Latin even when the site is in Greek. */
.flatpickr-calendar { font-family:"DM Sans",sans-serif; border:none; border-radius:18px; box-shadow:0 18px 55px rgba(48,42,33,.18); overflow:hidden; }
.flatpickr-months .flatpickr-month, .flatpickr-weekdays { background:#f7f3eb; }
.flatpickr-current-month, .flatpickr-weekday { color:var(--charcoal); }
.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange { background:var(--olive-dark); border-color:var(--olive-dark); }
.flatpickr-day:hover { background:#ebe4d7; border-color:#ebe4d7; }
.date-input { cursor:pointer; }

.cta-section { background:var(--olive-dark); color:white; text-align:center; padding:100px 24px; }
.cta-section h2 { max-width:900px; margin:16px auto 35px; }
.button-light { background:white; color:var(--olive-dark); }

.contact-section { display:grid; grid-template-columns:.9fr 1.1fr; gap:80px; }
.contact-form { display:grid; gap:12px; }
.contact-form input, .contact-form textarea { width:100%; border:1px solid #d8d2c8; background:#fffefa; padding:15px 17px; border-radius:14px; color:var(--charcoal); }
.contact-form textarea { resize:vertical; }

.site-footer { display:flex; justify-content:space-between; gap:30px; padding:50px 5vw; border-top:1px solid rgba(41,43,40,.12); background:#f0ebe2; }
.site-footer p { color:var(--muted); margin-bottom:0; }
.footer-links { display:flex; flex-wrap:wrap; gap:18px 24px; justify-content:flex-end; align-content:flex-start; font-size:.9rem; }

@media (max-width: 980px) {
  .site-header { grid-template-columns:1fr auto; }
  .nav { display:none; }
  .booking-card { grid-template-columns:1fr 1fr; }
  .booking-card .button { min-height:50px; }
  .intro-grid, .two-col, .location-card, .contact-section { grid-template-columns:1fr; gap:40px; }
  .facts-strip { grid-template-columns: repeat(3,1fr); margin-left:24px; margin-right:24px; }
  .amenities-grid { grid-template-columns:repeat(2,1fr); }
  .photo-card { min-height:500px; }
  .gallery-head { align-items:start; flex-direction:column; }
}

@media (max-width: 640px) {
  .site-header { height:70px; padding:0 18px; }
  .brand { font-size:1.25rem; }
  .header-actions .button-small { display:none; }
  .hero { min-height:72vh; padding:34px 22px 58px; }
  .hero h1 { font-size:3.5rem; }
  .booking-card-wrap { margin-top:-28px; padding:0 14px; }
  .booking-card { grid-template-columns:1fr; }
  .section { padding:80px 22px; }
  .intro-grid { gap:25px; }
  .facts-strip { grid-template-columns:repeat(2,1fr); margin:0 14px 20px; }
  .amenities-grid { grid-template-columns:1fr; }
  .photo-card { min-height:380px; border-radius:18px; }
  .gallery-section { padding:80px 14px; }
  .gallery-grid { grid-template-columns:1fr; grid-auto-rows:260px; }
  .gallery-item { grid-column:span 1 !important; grid-row:span 1 !important; }
  .map-frame, .map-frame iframe { min-height:320px; }
  .site-footer { flex-direction:column; }
  .footer-links { justify-content:flex-start; }
}

.rate-note{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 22px;margin:14px 0 0;color:var(--muted);font-size:.82rem}.rate-note strong{color:var(--olive-dark)}
.booking-message{min-height:22px;text-align:center;margin-top:8px;color:#9b4b3f;font-size:.9rem}
.modal-backdrop{position:fixed;inset:0;z-index:100;background:rgba(24,27,23,.58);display:flex;align-items:center;justify-content:center;padding:22px;backdrop-filter:blur(8px)}.modal-backdrop[hidden]{display:none}.modal-open{overflow:hidden}
.booking-modal{position:relative;width:min(680px,100%);max-height:92vh;overflow:auto;background:var(--warm-white);border-radius:26px;padding:38px;box-shadow:0 28px 100px rgba(0,0,0,.3)}.booking-modal h2{font-size:clamp(2rem,5vw,3.3rem);margin-bottom:24px}.modal-close{position:absolute;right:18px;top:14px;border:0;background:transparent;font-size:2rem;color:var(--muted);cursor:pointer}
.quote-summary{display:grid;gap:1px;background:rgba(79,86,61,.13);border:1px solid rgba(79,86,61,.12);margin-bottom:22px}.quote-summary>div{display:flex;justify-content:space-between;gap:25px;background:#fff;padding:14px 16px}.quote-summary span{color:var(--muted)}.quote-total strong{font-size:1.35rem;color:var(--olive-dark)}
.reservation-form{display:grid;gap:11px}.reservation-form input,.reservation-form textarea{width:100%;border:1px solid #d8d2c8;background:#fffefa;padding:14px 16px;border-radius:13px}.terms-check{display:flex;align-items:flex-start;gap:9px;font-size:.88rem;color:var(--muted);margin:3px 0}.terms-check input{width:auto;margin-top:5px}.payment-pending{font-size:.8rem;color:var(--muted);text-align:center;margin:0}.reservation-result{margin-top:14px;padding:0 4px;color:var(--olive-dark)}
@media(max-width:640px){.rate-note{justify-content:flex-start;padding:0 4px}.booking-modal{padding:30px 20px 24px}.quote-summary>div{flex-direction:column;gap:3px}}

.pricing-wrap{display:block;width:100%;max-width:760px;margin:16px auto 0}
.pricing-table{width:100%;border-collapse:collapse;background:rgba(255,255,255,.46);border:1px solid var(--line);border-radius:14px;overflow:hidden;font-size:.82rem}
.pricing-table th,.pricing-table td{padding:10px 12px;text-align:center;border-bottom:1px solid var(--line)}
.pricing-table th:first-child,.pricing-table td:first-child{text-align:left}
.pricing-table thead th{color:var(--olive-dark);font-weight:700;background:rgba(83,94,62,.06)}
.pricing-table tbody tr:last-child td{border-bottom:0}
.minimum-note{display:block;margin-top:10px;text-align:center}
@media(max-width:640px){.pricing-table{font-size:.74rem}.pricing-table th,.pricing-table td{padding:9px 7px}.minimum-note{text-align:left}}


/* Gallery lightbox */
.lightbox[hidden] { display:none; }
.lightbox { position:fixed; inset:0; z-index:2000; background:rgba(18,20,16,.92); display:grid; grid-template-columns:minmax(56px,90px) minmax(0,1fr) minmax(56px,90px); align-items:center; justify-items:center; padding:34px 22px; backdrop-filter:blur(7px); }
.lightbox-figure { margin:0; max-width:min(94vw,1500px); max-height:92vh; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; }
.lightbox-figure img { display:block; max-width:100%; max-height:84vh; width:auto; height:auto; object-fit:contain; border-radius:12px; box-shadow:0 30px 80px rgba(0,0,0,.45); }
.lightbox-figure figcaption { color:rgba(255,255,255,.82); font-size:14px; letter-spacing:.02em; text-align:center; }
.lightbox-close, .lightbox-nav { border:0; background:rgba(255,255,255,.12); color:#fff; cursor:pointer; display:grid; place-items:center; transition:background .2s ease, transform .2s ease; }
.lightbox-close:hover, .lightbox-nav:hover { background:rgba(255,255,255,.22); transform:scale(1.05); }
.lightbox-close { position:absolute; top:22px; right:24px; width:48px; height:48px; border-radius:50%; font-size:34px; line-height:1; }
.lightbox-nav { width:54px; height:70px; border-radius:16px; font-size:46px; line-height:1; }
.lightbox-prev { grid-column:1; }
.lightbox-figure { grid-column:2; }
.lightbox-next { grid-column:3; }
body.lightbox-open { overflow:hidden; }
@media (max-width:700px) {
  .lightbox { grid-template-columns:46px minmax(0,1fr) 46px; padding:28px 8px 20px; }
  .lightbox-nav { width:40px; height:56px; border-radius:12px; font-size:36px; }
  .lightbox-close { width:42px; height:42px; top:12px; right:12px; font-size:30px; }
  .lightbox-figure img { max-height:78vh; border-radius:10px; }
}


/* Required-field feedback */
.is-invalid { border-color:#b63f36 !important; box-shadow:0 0 0 3px rgba(182,63,54,.10) !important; }
.inline-required::placeholder { color:#a7352f !important; opacity:1; font-weight:600; }
.inline-required::-webkit-input-placeholder { color:#a7352f !important; opacity:1; font-weight:600; }
.field-error { display:block; margin-top:6px; color:#a7352f; font-size:.78rem; font-weight:600; }
.terms-check.is-invalid { outline:1px solid #b63f36; outline-offset:6px; border-radius:8px; }
.booking-card label { position:relative; }
.booking-card .field-error { position:absolute; left:0; top:calc(100% + 4px); white-space:nowrap; }
.flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover { opacity:.28; color:#8e8d88; background:transparent; cursor:not-allowed; }

/* Explore Sithonia */
.explore-section { background:#f6f1e8; }
.explore-head { display:grid; grid-template-columns:1.15fr .85fr; gap:60px; align-items:end; margin-bottom:46px; }
.explore-head h2 { margin-bottom:0; }
.explore-head p { color:var(--muted); margin:0 0 8px; }
.explore-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.explore-card { background:#fffefa; border:1px solid rgba(79,86,61,.15); border-radius:22px; padding:28px; min-height:300px; }
.explore-icon { color:var(--olive); font-size:.78rem; letter-spacing:.14em; margin-bottom:48px; }
.explore-card h3 { font-family:"Playfair Display",serif; font-size:1.5rem; margin:0 0 14px; }
.explore-card p { color:var(--muted); margin:0; }
@media(max-width:980px){.explore-head{grid-template-columns:1fr;gap:18px}.explore-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.explore-grid{grid-template-columns:1fr}.explore-card{min-height:auto}.explore-icon{margin-bottom:28px}.booking-card .field-error{position:static}}

/* Arrival/departure and post-booking confirmation */
.arrival-times{display:flex;gap:.7rem;align-items:center;justify-content:center;flex-wrap:wrap;margin-top:.7rem;font-size:.98rem;color:#40443a}
.arrival-times strong{font-weight:700}
.booking-success-backdrop{z-index:1200}
.booking-success-modal{max-width:560px;text-align:center}
.success-content{margin:1rem 0 1.25rem;line-height:1.65}
.success-content .success-ref{display:block;font-size:1.05rem;margin:.75rem 0}
.success-actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap}
.button-secondary{background:transparent!important;color:#4f563d!important;border:1px solid #9da38d!important}
.pricing-admin-grid{display:grid;grid-template-columns:1.2fr repeat(3,minmax(100px,1fr));gap:8px;align-items:center;margin:14px 0}
.pricing-admin-grid .head{font-weight:600;color:#555b4a}
.pricing-admin-grid input{width:100%;padding:10px;border:1px solid #d8d2c8;border-radius:10px}
.pricing-admin-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:12px}
.pricing-admin-actions input{width:95px;padding:10px;border:1px solid #d8d2c8;border-radius:10px}
@media(max-width:700px){.pricing-admin-grid{grid-template-columns:1fr repeat(3,72px);font-size:.88rem}.pricing-admin-grid input{padding:8px}}
