:root{
  --gold:#F4C019;
  --bg:#0b0b0b;
  --card-bg: rgba(0,0,0,0.63); /* increased transparency (more see-through) */
  --pill-bg: rgba(0,0,0,0.63);
  --radius-xl: 26px;
  --radius-lg: 20px;
  --radius-md: 18px;
  --text:#f7f7f7;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Inter, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  color:var(--text);
  background: var(--bg);
  line-height:1.45;
}

/* Background logo as a fixed, faint watermark */
body::before{
  content:"";
  position:fixed;
  inset:0;
  background: center 120px / 125% no-repeat;
  background-image: url('assets/ceo-logo-big.webp');
  opacity:0.12; /* gentle watermark */
  pointer-events:none;
  z-index:0;
  filter: none;
}

.site-header, main, .site-footer{position:relative; z-index:1}

.site-header{
  padding:28px 22px 8px;
}
.brand{
  display:flex; gap:16px; align-items:center;
}
.corner-logo{width:92px; height:auto; display:block}
.brand-text h1{
  margin:0 0 8px 0;
  font-weight:800;
  letter-spacing:.2px;
  color:var(--gold);
  font-size: clamp(26px, 4.5vw, 44px);
}
.contact-row{
  display:flex; align-items:center; gap:10px;
  flex-wrap:wrap;
}
.contact-row .ig img{display:block}
.contact-row .handle,.contact-row .phone{
  color:var(--gold);
  text-decoration:none;
  font-weight:700;
}
.contact-row .dot{color:var(--gold); opacity:.9}

main{padding:10px 18px 40px;}

.card{
  background:var(--card-bg);
  border:2px solid var(--gold);
  border-radius: var(--radius-xl);
  padding:26px;
  margin:16px 0;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.15) inset, 0 10px 20px rgba(0,0,0,.25);
}

.hero h2{
  font-size: clamp(28px, 7vw, 54px);
  margin:0 0 16px 0;
  font-weight:800;
}
.hero p{margin:0 0 18px 0; font-weight:600}
.btn{
  display:inline-block;
  background:var(--gold);
  color:#111;
  font-weight:900;
  padding:14px 22px;
  border-radius:18px;
  text-decoration:none;
}

.why h3, .services h3, .booking h3, .contact h3{
  color: var(--gold);
  font-size: clamp(22px, 4.8vw, 34px);
  margin:0 0 18px 0;
  font-weight:900;
}
.why li{margin:.5rem 0; font-weight:700}

.services .service-grid{
  display:grid;
  gap:16px;
}
.pill{
  background:var(--pill-bg);
  border:2px solid var(--gold);
  border-radius: var(--radius-lg);
  padding:18px;
}
.pill h4{margin:0 0 6px 0; font-weight:800}
.pill p{margin:0; font-weight:600}
.services .footnote{opacity:.9; margin-top:14px; font-weight:600}

.booking .embed-wrap{
  background: #0a0a0a;
  border-radius: var(--radius-md);
  padding: 6px;
}

.site-footer{
  padding:30px 18px 60px;
  opacity:.95;
  font-weight:600;
}

/* Larger screens */
@media (min-width: 900px){
  main{padding:10px 40px 60px}
  .service-grid{
    grid-template-columns: repeat(3,1fr);
  }
  .corner-logo{width:110px}
  body::before{
    background-position:center 80px;
    background-size: 125%;
  }
}

/* Instagram icon sizing and spacing */
a.ig{display:inline-flex; align-items:center}
a.ig img{width:22px; height:22px; margin-right:8px}