/* ============================================================
   Stonehills Signature Hotel — theme layer on top of Tabler
   Palette is stone/gold, not the default Tabler dashboard look.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,300;9..144,500;9..144,600&family=Work+Sans:wght@400;500;600&display=swap');

:root{
  --sh-stone-950:#1B211D;   /* near-black, warm-green stone, for text & dark sections */
  --sh-stone-800:#2B2E29;
  --sh-stone-100:#EDEBE3;   /* light stone background */
  --sh-stone-200:#E2DFD3;
  --sh-stone-300:#D2CDBC;   /* hairlines */
  --sh-cream:#F8F6F0;       /* card surface */
  --sh-gold-600:#A5822E;    /* accent — buttons, price, links */
  --sh-gold-700:#8A6B24;
  --sh-ink:#242119;
}

body{
  font-family:'Work Sans', sans-serif;
  color:var(--sh-ink);
  background:var(--sh-stone-100);
}

h1,h2,h3,h4,.sh-display{
  font-family:'Fraunces', serif;
  font-weight:500;
  letter-spacing:-0.01em;
  color:var(--sh-stone-950);
}

a{ color:var(--sh-gold-700); }
a:hover{ color:var(--sh-gold-600); }

/* ---------- Navbar ---------- */
.sh-navbar{
  background:var(--sh-cream);
  border-bottom:1px solid var(--sh-stone-300);
}
.sh-navbar .navbar-brand{
  font-family:'Fraunces', serif;
  font-size:1.35rem;
  font-weight:600;
  color:var(--sh-stone-950);
}
.sh-navbar .nav-link{
  color:var(--sh-ink);
  font-weight:500;
}
.sh-navbar .nav-link.active,
.sh-navbar .nav-link:hover{
  color:var(--sh-gold-700);
}

/* ---------- Buttons ---------- */
.btn-sh-gold{
  background:var(--sh-gold-600);
  border-color:var(--sh-gold-600);
  color:#fff;
  font-weight:500;
}
.btn-sh-gold:hover{
  background:var(--sh-gold-700);
  border-color:var(--sh-gold-700);
  color:#fff;
}
.btn-sh-outline{
  background:transparent;
  border:1px solid var(--sh-stone-950);
  color:var(--sh-stone-950);
  font-weight:500;
}
.btn-sh-outline:hover{
  background:var(--sh-stone-950);
  color:#fff;
}

/* ---------- Hero ---------- */
.sh-hero{
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:0;
  min-height:70vh;
  background:var(--sh-stone-950);
}
.sh-hero-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:4rem 3.5rem;
  color:var(--sh-stone-100);
}
.sh-hero-copy h1{
  color:#fff;
  font-size:clamp(2.2rem, 4vw, 3.4rem);
  line-height:1.08;
  max-width:14ch;
}
.sh-hero-copy p{
  color:var(--sh-stone-300);
  max-width:42ch;
  font-size:1.05rem;
  margin-top:1rem;
}
.sh-hero-media{
  position:relative;
  min-height:320px;
  background:var(--sh-stone-800) center/cover no-repeat;
}
@media (max-width: 900px){
  .sh-hero{ grid-template-columns:1fr; }
  .sh-hero-copy{ padding:3rem 1.5rem; }
}

/* Generic image slot — swap the background-image / <img src> once real photos are ready */
.sh-image-slot{
  background:var(--sh-stone-200) center/cover no-repeat;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--sh-stone-300);
  border:1px dashed var(--sh-stone-300);
}

/* ---------- Section rhythm ---------- */
.sh-section{ padding:4.5rem 0; }
.sh-section-title{ max-width:34ch; }
.sh-eyebrow{ display:none; } /* intentionally unused — see design notes */

/* ---------- Amenity cards ---------- */
.sh-amenity-card{
  background:var(--sh-cream);
  border:1px solid var(--sh-stone-300);
  border-radius:6px;
  overflow:hidden;
  height:100%;
}
.sh-amenity-card .sh-image-slot{ height:170px; border:0; border-bottom:1px solid var(--sh-stone-300); }
.sh-amenity-card .card-body{ padding:1.25rem 1.4rem; }
.sh-amenity-card h3{ font-size:1.15rem; margin-bottom:.4rem; }
.sh-amenity-card p{ color:#4a473f; font-size:.94rem; margin:0; }

/* ---------- Room cards ---------- */
.sh-room-card{
  background:var(--sh-cream);
  border:1px solid var(--sh-stone-300);
  border-radius:6px;
  overflow:hidden;
}
.sh-room-card .carousel-item .sh-image-slot{ height:230px; border:0; }
.sh-room-price{
  font-family:'Fraunces', serif;
  color:var(--sh-gold-700);
  font-size:1.4rem;
}
.sh-room-price small{ font-family:'Work Sans', sans-serif; font-size:.8rem; color:#6b6858; }

/* ---------- Gallery ---------- */
.sh-gallery{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  grid-auto-rows:160px;
  gap:.75rem;
}
.sh-gallery .sh-image-slot{ border-radius:4px; }
.sh-gallery a{ display:block; height:100%; }
.sh-gallery .tall{ grid-row:span 2; }
.sh-gallery .wide{ grid-column:span 2; }
@media (max-width: 900px){
  .sh-gallery{ grid-template-columns:repeat(2, 1fr); }
}

/* ---------- Footer ---------- */
.sh-footer{
  background:var(--sh-stone-950);
  color:var(--sh-stone-300);
  padding:3rem 0 1.5rem;
}
.sh-footer a{ color:var(--sh-stone-100); }
.sh-footer h4{ color:#fff; font-size:1.1rem; }