:root{
  --bg1:#232526;
  --bg2:#20232a;
  --ink:#eef2f7;
  --silver:#cfd8dc;
  --gold:#B8860B;
  --gold-dark:#8a6514;
  --gold-grad: linear-gradient(90deg, #B8860B 17%, #FFD700 50%, #CBA135 93%);
  --stroke:rgba(255,255,255,.12);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--silver);
  background:linear-gradient(135deg,var(--bg1) 0%,var(--bg2) 100%);
  min-height:100vh;
}
.wrap{max-width:1240px;margin:0 auto;padding:0 18px}

.nav-spaced {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.brand {
  display: flex;
  align-items: center;
  gap: 14px;
}
.brand img{ height:112px; width:auto; object-fit:contain;}
.brand-gold{
  font-family:"Playfair Display",serif;
  background:var(--gold-grad);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  text-fill-color:transparent;
  font-weight:700;
  font-size:32px;
  letter-spacing:.3px;
  text-shadow:
    0 2px 12px #8a651150,
    0 4px 12px #FFD70033;
}

.nav-bar {
  display: flex;
  gap: 14px;
  align-items: center;
}
.nav{
  position:sticky;top:0;z-index:10;
  backdrop-filter:blur(6px);
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));
  border-bottom:1px solid var(--stroke);
  box-shadow:0 2px 12px #0d3b6611;
}
.nav__row{height:20vh;}

/* Navigation Button Styling */
.menu__link{
  color:var(--silver);
  text-decoration:none;
  font-weight:700;
  padding:7px 13px;
  border-radius:10px;
  transition:background .15s,color .15s;
  font-size:1rem;
}
.menu__link.home-link{
  background:rgba(255,255,255,.06);
  color:var(--silver);
  border:2px solid var(--silver);
}
.menu__link.home-link.is-active{
  color:var(--silver); background:rgba(202,202,202,.15);
}
.menu__link:hover{background:rgba(255,255,255,.09);}
.menu__link.is-active{ background:rgba(202,202,202,.15); color:var(--gold);}
.menu__link.contact-link {}

.hero-img {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 220px;
  margin-bottom: 20px;
  background: transparent;
}
.hero-img .wrap {
  width: 100%;
}
.hero-img-el {
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: 18px;
  box-shadow: 0 12px 40px #0002;
  display: block;
}
@media (max-width: 820px) {
  .hero-img-el { height: 140px; }
  .hero-img { min-height: 140px; }
}
@media (max-width: 500px) {
  .hero-img-el { height: 80px; }
  .hero-img { min-height: 80px;}
}

.about-note {
  background:transparent;
  color:var(--silver);
  font-size:1.13rem;
  font-family:'Inter',sans-serif;
  margin:28px auto 8px auto;
  padding:0 9px 0 6px;
  text-align:left;
  max-width:980px;
}
.about-note h2 {
  font-family:'Playfair Display',serif;
  color:var(--silver);
  font-size:1.36rem;
  margin-bottom:10px;
}
.about-note p {
  margin-bottom:13px;
  line-height:1.46;
}

.tiles{
  min-height:44vh;
  display:flex;align-items:center;
}
.tiles__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;width:100%;}
.card{
  background:linear-gradient(180deg,rgba(255,255,255,.11),rgba(255,255,255,.04));
  border:1px solid var(--stroke);
  border-radius:18px;
  padding:22px 14px;
  box-shadow:0 14px 36px rgba(0,0,0,.45);
  height:37vh;
  display:flex;
  flex-direction:column;
  cursor:pointer;
  transition:transform 0.2s, box-shadow 0.2s, background 0.2s;
  overflow: hidden;
  position: relative;
}
.card:hover{
  transform:scale(1.04);
  background: linear-gradient(120deg, #222 20%, #FFD70011 40%, #CBA13522 100%);
  box-shadow: 0 20px 48px #CBA13533, 0 0 18px #FFD70022;
}
.card:hover h3 {
  color:var(--gold);
  filter:drop-shadow(0 2px 8px #FFD70099);
}
.card h3{
  font-family:"Playfair Display",serif;
  color:var(--ink);
  margin:0 0 8px;
  text-align:center;
  font-size:1.25rem;
  transition:color 0.2s;
}
.tile-media{
  flex:1;
  width:100%;
  height:100%;
  border-radius:14px;
  border:1px solid var(--stroke);
  background:#212A34;
  object-fit:cover;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:0;
}
.tile-media img,
.tile-media video {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  border-radius: 10px;
  object-fit: cover;
  display: block;
}

/* Modal Gallery */
.gallery-modal {
  position: fixed; top:0; left:0; width:100vw; height:100vh; background:rgba(0,0,0,.85);
  display:flex; align-items:center; justify-content:center; z-index:10000;
}
.gallery-content {
  position: relative; max-width:96vw; max-height:84vh; background: #181A1F; border-radius:20px; padding:38px;
  box-shadow:0 0 56px #FFD70044;
  display:flex;flex-direction:column;align-items:center;
}
.gallery-media {
  max-width:92vw; max-height:68vh; border-radius:16px; box-shadow:0 8px 42px #FFD70044;
}
.gallery-prev,.gallery-next,.gallery-close {
  position:absolute;background:var(--gold);color:#181A1F;border:none;font-size:2.5rem;border-radius:60%;width:54px;height:54px;box-shadow:0 6px 25px #FFD70099;cursor:pointer;
}
.gallery-prev { left:-70px;top:50%;transform:translateY(-50%);}
.gallery-next { right:-70px;top:50%;transform:translateY(-50%);}
.gallery-close { right:24px;top:18px;}
.gallery-caption {
  margin-top:12px;color:var(--ink);font-family:"Playfair Display",serif;font-size:1.25rem;
}
@media (max-width: 860px) {
  .gallery-content { padding:10px; }
  .gallery-prev,.gallery-next,.gallery-close { width:36px;height:36px;font-size:1.4rem;}
}

/* Footer Contact strip and icons */
.strip{
  border-top:1px solid var(--stroke);
  background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.02));
  padding:10px 0;
}
.strip__grid{display:grid;grid-template-columns:1.4fr .8fr;gap:18px;align-items:center;}
.strip__links{display:flex;gap:22px;flex-wrap:wrap;align-items:center;}
.strip__item{
  display:flex;align-items:center;gap:8px;
  text-decoration:none;color:var(--silver);
  padding:8px 12px;border-radius:10px;border:1px solid transparent;
  font-size:1.14rem;
}
.strip__item:hover{border-color:var(--stroke);background:rgba(255,255,255,.07);}
.footer-icon{
  width:28px;height:28px;border-radius:7px;background:#fffaf3;margin-right:4px;vertical-align:middle;
  border:1.5px solid var(--gold);
  box-shadow:0 2px 8px #FFD70055;
}
.strip__form{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.strip__form input,.strip__form textarea{
  height:38px;padding:0 12px;border-radius:10px;border:1.5px solid var(--silver);
  background:#0f1116;color:var(--ink)
}
.strip__form textarea{height:38px;resize:vertical;min-height:38px;max-height:120px;padding-top:8px}
.strip__form button{
  height:38px;padding:0 16px;border-radius:10px;border:1.5px solid var(--gold);background:var(--gold-grad);
  color:#232526;font-weight:800;
  box-shadow:0 8px 22px rgba(0,0,0,.4);cursor:pointer;
  font-size:1.07rem;
}
.strip__form button:hover{filter:brightness(1.09)}

.fab{
  position:fixed;right:18px;bottom:18px;z-index:60;
  width:54px;height:54px;border-radius:50%;
  background:#25D366;display:grid;place-items:center;
  box-shadow:0 10px 24px rgba(0,0,0,.6);
}

/* Responsive */
@media(max-width:1024px){
  .brand-gold{font-size:28px;}
  .nav-spaced { flex-direction: column; gap: 10px; align-items: flex-start; }
  .nav-bar { gap: 8px; margin-top: 10px;}
  .strip__grid{grid-template-columns:1fr;}
  .strip__form{justify-content:flex-start;}
}
@media(max-width:820px){
  .tiles__grid{grid-template-columns:1fr 1fr;}
  .card:hover{transform:scale(1.03);}
}
@media(max-width:560px){
  .tiles__grid{grid-template-columns:1fr;}
  .brand-gold{font-size:21px;}
}



