:root{
	--ocera-bg: rgb(8,15,32);
	--ocera-gold: rgb(168,131,66);
	--ocera-white: #ffffff;
}

*{box-sizing:border-box;}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ocera-white);background:#fff;}
img{max-width:100%;display:block;}
a{text-decoration:none;color:inherit;}
ul{list-style:none;margin:0;padding:0;}

.hidden{display:none !important;}

.btn{
	font:inherit;
	font-weight:600;
	padding:12px 22px;
	border-radius:6px;
	cursor:pointer;
	border:1px solid var(--ocera-gold);
	background:transparent;
	color:var(--ocera-gold);
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:8px;
}
.btn-icon{width:16px;height:16px;}
.btn--outline{background:transparent;color:var(--ocera-gold);}
.btn--solid{background:var(--ocera-gold);color:var(--ocera-bg);border-color:var(--ocera-gold);}

/* Coming Soon popup */
.ocera-popup{
	position:fixed;inset:0;z-index:9999;
	display:none;
	align-items:center;justify-content:center;
}
.ocera-popup.is-open{display:flex;}
.ocera-popup__overlay{
	position:absolute;inset:0;
	background:rgba(0,0,0,.6);
}
.ocera-popup__box{
	position:relative;
	background:var(--ocera-bg);
	color:var(--ocera-white);
	padding:40px;
	border-radius:10px;
	max-width:360px;
	width:90%;
	text-align:center;
	border:1px solid var(--ocera-gold);
}
.ocera-popup__box h3{color:var(--ocera-gold);margin:0 0 10px;}
.ocera-popup__close{
	position:absolute;top:10px;right:14px;
	background:none;border:none;color:var(--ocera-white);
	font-size:24px;cursor:pointer;
}