:root{
  --purple-900:#5E4A8B;
  --purple-700:#6E59A1;
  --purple-500:#8972BF;
  --purple-300:#B9A8E6;
  --lavender:#EFE4F8;
  --ink:#2a223d;
  --white:#ffffff;
  --radius:16px;
  --shadow:0 10px 30px rgba(46,24,73,.15);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;
  color:var(--ink);
  background:var(--lavender);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img{max-width:100%; height:auto; display:block}
a{color:var(--purple-900); text-decoration:underline; text-underline-offset:2px}
a.btn{text-decoration:none}

.container{width:min(1100px, 92vw); margin-inline:auto}
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{left:1rem;top:1rem;width:auto;height:auto;background:var(--white);padding:.5rem 1rem;border-radius:8px;box-shadow:var(--shadow)}

.site-header{
  position:sticky; top:0; z-index:10;
  background:rgba(239,228,248,.75);
  backdrop-filter:saturate(120%) blur(8px);
  border-bottom:1px solid rgba(94,74,139,.15);
}

.nav{display:flex; align-items:center; justify-content:space-between; padding:.7rem 0}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:800;font-size:1.125rem}
.brand img{width:36px;height:36px; filter:drop-shadow(0 2px 6px rgba(94,74,139,.25))}
.brand.small img{width:28px;height:28px}

.menu{display:flex;gap:1rem;list-style:none;margin:0;padding:0}
.menu a{display:inline-block;padding:.5rem .7rem;border-radius:10px}
.menu .btn{padding:.55rem .9rem}

.nav-toggle{display:none}

.btn{display:inline-block; border:2px solid var(--purple-900); background:var(--purple-900); color:#fff; padding:.8rem 1.1rem; border-radius:999px; font-weight:700; box-shadow:var(--shadow)}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn--ghost{background:transparent;color:var(--purple-900)}

.hero{
  padding: clamp(2rem, 3vw, 3rem) 0 3rem;
  position:relative;
}
.hero__inner{display:grid; grid-template-columns:1.2fr .8fr; gap:2rem; align-items:center}
.hero__copy h1{font-size:clamp(2rem, 4vw, 3rem); line-height:1.15; margin:0 0 .6rem}
.underline{background:linear-gradient(transparent 60%, var(--purple-300) 0)}
.badges{display:flex; flex-wrap:wrap; gap:.6rem 1rem; padding:0; margin:1rem 0 0; list-style:none}
.badges li{padding:.3rem .6rem; border:1px dashed var(--purple-500); border-radius:999px; font-size:.9rem; color:var(--purple-900)}
.hero__art{justify-self:end; background:radial-gradient(120% 120% at 70% 20%, #fff, rgba(255,255,255,0) 70%); padding:1rem; border-radius:20px}
.hero__art img{width:min(360px, 65vw)}

.sparkles{position:absolute; inset:auto 0 0 0; height:40px; background:linear-gradient(to bottom, rgba(137,114,191,0), rgba(137,114,191,.15));}

.strip{padding:3rem 0}
.cards{display:grid; grid-template-columns:repeat(4, 1fr); gap:1rem}
.card{background:#fff; border:1px solid rgba(94,74,139,.12); border-radius:var(--radius); padding:1.1rem; box-shadow:var(--shadow)}
.card h3{margin-top:0}

.price-grid{display:grid;grid-template-columns:repeat(4,1fr); gap:1rem; margin:1rem 0 0}
.price{background:#fff;border:1px solid rgba(94,74,139,.12); border-radius:var(--radius); padding:1.2rem; text-align:center; box-shadow:var(--shadow)}
.price .from{font-size:1.6rem; font-weight:800; color:var(--purple-900); margin:.2rem 0 0}

/* Gallery: horizontal row, swipeable on mobile */
.gallery{padding:3rem 0}
.gallery-row{display:flex; flex-direction:row; gap:1rem; overflow-x:auto; padding-bottom:1rem; scroll-snap-type:x mandatory; -webkit-overflow-scrolling: touch}
.gallery-row figure{flex:0 0 auto; width:clamp(220px, 22vw, 320px); margin:0; background:#fff; border-radius:var(--radius); overflow:hidden; border:1px solid rgba(94,74,139,.12); box-shadow:var(--shadow); scroll-snap-align:start}
.gallery-row img{display:block; width:100%; height:auto}
.gallery-row figcaption{padding:.6rem .8rem; font-weight:600; background:#fff; text-align:center}

.about{padding:3rem 0}
.about__inner{display:grid; grid-template-columns:1.1fr .9fr; gap:2rem; align-items:center}
.about__card{background:transparent}
.about__card img{width:240px; margin-inline:auto}

.faq details{background:#fff; border:1px solid rgba(94,74,139,.12); border-radius:var(--radius); padding:1rem 1.1rem; box-shadow:var(--shadow); margin:.7rem 0}
.faq summary{font-weight:700; cursor:pointer}

/* Contact: two columns with equal heights; map fills the card */
.contact{padding:3rem 0}
.contact__inner{display:grid; grid-template-columns:1.1fr .9fr; gap:1.5rem; align-items:stretch}
.contact__card{background:#fff;border:1px solid rgba(94,74,139,.12);border-radius:var(--radius);padding:1.2rem;box-shadow:var(--shadow); display:flex; flex-direction:column}
.map{width:100%; height:180px; background:linear-gradient(135deg, var(--purple-300), var(--lavender)); border-radius:12px; margin-top:.6rem}
.contact__card .map{height:100%; min-height:100%; width:100%; border-radius:12px}

/* Footer etc */
.site-footer{border-top:1px solid rgba(94,74,139,.15); padding:1.6rem 0; background:rgba(239,228,248,.6)}
.footer__inner{display:flex; gap:1rem; align-items:center; justify-content:space-between; flex-wrap:wrap}
.site-footer nav a{margin-right:.8rem}
.to-top{
  position:fixed;
  right:1rem;
  bottom:1rem;
  background:var(--purple-900);
  color:#fff;
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  padding:.8rem 1.2rem;
  border-radius:999px;
  text-decoration:none;
  box-shadow:var(--shadow);
  font-weight:700;
  font-size:1rem;
  line-height:1;
  white-space:nowrap;      /* prevents text wrapping */
  width:auto;              /* allow natural width */
  max-width:90vw;          /* avoid overflow on small screens */
  overflow:visible;        /* ensure no clipping */
  background-image: none !important;
  text-indent: 0;
}
.to-top::before,
.to-top::after{
  content: none !important;
  display: none !important;
  background: none !important;
}
.to-top:hover{
  transform:translateY(-2px);
}

/* Responsive */
@media (max-width: 900px){
  .hero__inner, .cards, .price-grid, .about__inner, .contact__inner{grid-template-columns:1fr}
  .menu{display:none; position:absolute; right:1rem; top:64px; background:#fff; padding:.5rem; border-radius:12px; box-shadow:var(--shadow)}
  .nav-toggle{display:inline-block; border:1px solid rgba(94,74,139,.25); background:#fff; padding:.5rem .7rem; border-radius:10px}
  .brand{font-size:1rem}
}

/* Booking section polish */
.booking iframe{
  width:100%;
  max-width:100%;
  height:clamp(700px, 80vh, 1000px);
  display:block;
  margin:0;
  border:none;
  border-radius:16px;
  box-shadow:0 10px 30px rgba(46,24,73,.1);
  overflow:auto;
  overscroll-behavior: contain;
}
.booking iframe::-webkit-scrollbar {
  display: none;
}
.booking iframe {
  scrollbar-width: none; /* for Firefox */
}
.booking{ padding-bottom: 2rem; overscroll-behavior: contain; }
.booking p{ text-align:center; margin-top:.5rem; }
