/*
Theme Name: Meriton Suites (Visaible demo)
Description: Demonstration theme for the Visaible availability proof-of-concept. Styled to resemble a modern apartment-hotel site. Not affiliated with Meriton.
Version: 1.0
*/

:root{
  --ink:#15151d; --ink2:#20202c; --gold:#c2a36b; --gold-d:#a9884c;
  --paper:#fff; --text:#2b2b2f; --muted:#7a7a82; --line:#e9e7e2;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--text);background:var(--paper);line-height:1.65}
a{color:var(--gold-d);text-decoration:none}
h1,h2,h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;color:var(--ink);line-height:1.15}

/* demo strip */
.demo-strip{background:var(--ink);color:#cfc7b4;font-size:12.5px;text-align:center;padding:7px 12px;letter-spacing:.02em}

/* header */
.site-header{display:flex;align-items:center;justify-content:space-between;padding:16px 32px;border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(255,255,255,.96);backdrop-filter:blur(6px);z-index:100}
.brand{display:flex;flex-direction:column;line-height:1}
.wordmark{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:22px;letter-spacing:.30em;color:var(--ink)}
.brand .sub{font-size:10.5px;letter-spacing:.32em;color:var(--gold-d);margin-top:5px}
.nav{display:flex;align-items:center;gap:26px}
.nav a{color:var(--ink);font-size:13.5px;letter-spacing:.08em;text-transform:uppercase}
.nav a:hover{color:var(--gold-d)}
.booknow-top{background:var(--gold);color:#fff;border:0;padding:11px 22px;border-radius:2px;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;cursor:pointer}
.booknow-top:hover{background:var(--gold-d)}

/* hero */
.hero{background:linear-gradient(160deg,rgba(18,18,26,.86) 0%,rgba(20,20,30,.55) 55%,rgba(30,26,34,.6) 100%),url('hero.jpg') center 35%/cover no-repeat;color:#fff;padding:120px 32px;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 18%,rgba(194,163,107,.18),transparent 55%)}
.hero-inner{max-width:760px;margin:0 auto;position:relative;z-index:1}
.hero h1{color:#fff;font-size:52px;margin:0 0 16px;font-weight:500}
.hero p{color:#d7d3ca;font-size:18px;max-width:560px;margin:0 0 28px}
.hero-cta{background:var(--gold);color:#fff;border:0;padding:15px 34px;border-radius:2px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;cursor:pointer}
.hero-cta:hover{background:var(--gold-d)}

/* content */
.content{max-width:760px;margin:0 auto;padding:56px 24px}
.content h1{font-size:38px;margin:0 0 8px}
.content h2{font-size:26px;margin:36px 0 10px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.content ul{padding-left:20px}
.content li{margin:4px 0}

/* availability table (rendered by the plugin) inherits; light polish */
.visaible-availability{box-shadow:0 1px 3px rgba(0,0,0,.05)}

/* footer */
.site-footer{background:var(--ink);color:#b9b3a6;text-align:center;padding:48px 24px 28px;margin-top:48px}
.site-footer .wordmark{color:#fff;font-size:20px;letter-spacing:.30em;display:block;margin-bottom:8px}
.site-footer p{font-size:13px;color:#8f897d;margin:4px 0}

@media(max-width:640px){
  .site-header{padding:12px 16px;flex-wrap:wrap;gap:10px}
  .nav{gap:14px}.nav a{display:none}
  .hero{padding:64px 20px}.hero h1{font-size:36px}
  .content{padding:40px 18px}
}