/* HÖME Anguilla / coming soon */

:root{
  --text:#f7f2eb;
  --soft:rgba(247,242,235,.78);
}

*{box-sizing:border-box}

html,body{
  margin:0;
  min-height:100%;
}

body{
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:#e8e4de;
  color:var(--text);
}

.landing{
  position:relative;
  min-height:100vh;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:40px 24px 72px;
}

.landing__image{
  position:absolute;
  inset:0;
  background-image:url("hero-beach.png");
  background-size:cover;
  background-position:center center;
  transform:scale(1.02);
}

.landing__veil{
  position:absolute;
  inset:0;
  background:
    linear-gradient(to bottom,rgba(16,15,14,.18),rgba(16,15,14,.26)),
    radial-gradient(circle at center,rgba(255,255,255,.04),transparent 48%),
    linear-gradient(to top,rgba(16,15,14,.22),rgba(16,15,14,.05) 35%,rgba(16,15,14,.1));
}

.landing__center{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
}

.landing__logo{
  width:min(78vw,980px);
  max-width:980px;
  height:auto;
  filter:drop-shadow(0 10px 28px rgba(0,0,0,.18));
}

.landing__footer{
  position:absolute;
  left:50%;
  bottom:26px;
  transform:translateX(-50%);
  z-index:1;
  margin:0;
  color:var(--soft);
  font-size:.95rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}

@media (max-width:900px){
  .landing__logo{
    width:min(82vw,620px);
  }
}

/* Mobile: swap to a dedicated portrait crop so the woman remains visible */
@media (max-width:600px){
  .landing{
    padding:24px 16px 60px;
  }

  .landing__logo{
    width:88vw;
  }

  .landing__image{
    background-image:url("hero-mobile.png");
    background-position:center center;
    background-size:cover;
    transform:none;
  }
}

@media (max-width:420px){
  .landing__logo{
    width:92vw;
  }

  .landing__footer{
    font-size:.85rem;
  }
}