/* ------------------------------------------------------------------
   Wave Passage — everything the donor's stylesheet does not already do.
   All of it namespaced under .wv- so nothing here can reach donor markup,
   and all of it written in the donor's own two typefaces and three colours:
   EB Garamond, Lato, #a92125, #656565, #faf9f7.
   ------------------------------------------------------------------ */

/* ------------------------------------------------------------- wordmark */

.wv-logo { display: block; text-decoration: none; text-align: center; }
.wv-logo .wv-logo__mark { display: block; margin: 0px auto 16px; line-height: 0; }
.wv-logo .wv-logo__name {
	display: block;
	font-family: "EB Garamond", serif;
	font-size: 34px;
	line-height: 38px;
	letter-spacing: 3px;
	text-transform: uppercase;
	white-space: nowrap;
}
.wv-logo .wv-logo__sub {
	display: block;
	font-family: "Lato", sans-serif;
	font-size: 11px;
	letter-spacing: 4px;
	text-transform: uppercase;
	margin-top: 6px;
	opacity: 0.85;
	white-space: nowrap;
}
/* The donor's crest hangs from top:-135px and is 190px tall, filling the band
   between the contact rail and the menu circle. Ours is the same shape of
   object and sits in the same band. */
@media only screen and (min-width: 767px) {
	header .logo .wv-logo {
		position: absolute;
		display: block;
		top: -142px;
		width: 270px;
	}
}
/* On a phone the donor drops the background image off #teaser and swaps its
   white logo for a black one. We have no second file to swap to, so the colours
   move instead — otherwise the wordmark is white type on a white header. */
@media only screen and (max-width: 767px) {
	header .logo .wv-logo { margin-top: 26px; }
	.wv-logo .wv-logo__mark { margin-bottom: 12px; }
	.wv-logo .wv-logo__mark svg { width: 64px; height: 64px; }
	.wv-logo .wv-logo__name { font-size: 27px; letter-spacing: 2px; }
	.wv-logo .wv-logo__sub { font-size: 10px; letter-spacing: 3px; }
	/* The donor's `header *` rule paints every node inside the header white,
	   including each <path> of the crest — and stroke="currentColor" resolves
	   against the element's own colour, not the parent's. So the shapes have to
	   be named, not just the svg. */
	header .logo .wv-logo .wv-logo__mark,
	header .logo .wv-logo .wv-logo__mark svg,
	header .logo .wv-logo .wv-logo__mark svg * { color: #a92125; }
	header .logo .wv-logo .wv-logo__name { color: #691517; }
	header .logo .wv-logo .wv-logo__sub { color: #9a9a9a; }
}

.wv-r20-mobile { text-align: center; margin-top: 18px; }
.wv-r20-mobile .wv-r20 { color: #656565; border-color: #ddd8d2; }
#teaser.open header .wv-logo * { color: #656565; }

.wv-logo--foot { margin-bottom: 10px; text-align: left; }
.wv-logo--foot .wv-logo__mark { margin: 0px 0px 12px; color: #a92125; }
.wv-logo--foot .wv-logo__mark svg { width: 62px; height: 62px; }
.wv-logo--foot .wv-logo__name { color: #691517; font-size: 30px; }
.wv-logo--foot .wv-logo__sub { color: #9a9a9a; }
@media only screen and (max-width: 767px) {
	.wv-logo--foot { text-align: center; }
	.wv-logo--foot .wv-logo__mark { margin: 0px auto 12px; }
}

/* ---------------------------------------------------------- header rail */

header .top .wv-top-left { float: left; }
header .top .wv-top-left a {
	margin-right: 26px;
	font-size: 13px;
	letter-spacing: 0.5px;
	padding-left: 22px;
}
header .top .wv-top-left a:before {
	position: absolute;
	left: 0px;
	top: 1px;
	font-size: 14px;
}
header .top .wv-top-right { float: right; }
.wv-r20 {
	display: inline-block;
	font-size: 11px;
	letter-spacing: 2px;
	text-transform: uppercase;
	border: 1px solid rgba(255, 255, 255, 0.5);
	padding: 4px 14px;
	white-space: nowrap;
}
#teaser.open .wv-r20 { border-color: rgba(101, 101, 101, 0.4); }
nav .secondary .wv-top-left { float: none; }
nav .secondary .wv-top-left a {
	display: block;
	padding-left: 22px;
	margin: 0 0 8px 0;
	font-size: 14px;
	position: relative;
	color: #656565;
	text-decoration: none;
}
nav .secondary .wv-top-left a:before { position: absolute; left: 0px; top: 2px; }

/* Sub-page teaser: the home hero fills the screen, which is right for a home
   page and much too much for a legal page. */
#teaser.wv-sub { height: auto; min-height: 0; max-height: none; }
@media only screen and (min-width: 767px) {
	#teaser.wv-sub { height: 620px; min-height: 620px; }
	#teaser.wv-sub .txt-wrap h1 { font-size: 44px; line-height: 52px; }
}

/* The donor's hero is a dim photograph of a wall in shade and its 20% scrim is
   enough. Ours is open water at midday, and white type needs more behind it. */
@media only screen and (min-width: 767px) {
	#teaser:after { background: rgba(0, 0, 0, 0.32); }
}

.wv-hero-meta {
	margin-top: 26px;
	font-size: 12px;
	letter-spacing: 3px;
	text-transform: uppercase;
}
.wv-hero-meta span { padding-right: 18px; display: inline-block; }
/* An NZBN and a domain name have nowhere to break; on a phone they get a line
   each rather than a line and a half. */
@media only screen and (max-width: 767px) {
	.wv-hero-meta { letter-spacing: 1px; }
	.wv-hero-meta span { display: block; padding-right: 0px; overflow-wrap: anywhere; }
}

/* -------------------------------------------------------------- buttons */

.wv-btn {
	display: inline-block;
	border: 0;
	background: #a92125;
	color: #fff;
	font-family: "Lato", sans-serif;
	font-size: 14px;
	letter-spacing: 2px;
	line-height: 15px;
	text-transform: uppercase;
	text-decoration: none;
	padding: 18px 30px;
	cursor: pointer;
	transition: 0.4s;
}
.wv-btn:hover { background: #656565; color: #fff; }
.wv-btn--large { padding: 24px 44px; font-size: 15px; }
.wv-btn--ghost { background: #9a9a9a; }
.wv-btn--ghost:hover { background: #656565; }
.wv-btn--plain {
	background: transparent;
	color: #656565;
	border: 1px solid #d8d8d8;
}
.wv-btn--plain:hover { background: #656565; color: #fff; }
.editorTxt a.wv-btn { color: #fff; text-decoration: none; }
.editorTxt a.wv-btn--plain { color: #656565; }
.editorTxt a.wv-btn--plain:hover { color: #fff; }

/* The donor flattens the top of whatever comes first inside .editorTxt
   (`.editorTxt :first-child { margin-top:0; padding-top:0 }`) so a leading
   heading sits flush. That rule also catches the first button in a group and
   the first helpline box, which then lose their top padding and stand 20px
   shorter than the thing beside them. Given back, at higher specificity. */
.editorTxt .wv-btn:first-child { padding-top: 18px; }
.editorTxt .wv-btn--large:first-child { padding-top: 24px; }
.editorTxt .wv-help:first-child { padding-top: 26px; }

.wv-btns { margin-top: 26px; }
/* In a half-width column two buttons do not fit side by side, so they stack —
   and stacked buttons of different widths look like an accident. */
.wv-btns .wv-btn { margin: 0 12px 12px 0; min-width: 250px; text-align: center; }

/* The donor's slideshows are filled by a CMS that crops every image to 475px
   tall against a 540px column — which is why its text and its pictures end at
   the same place. Ours arrive from stock at 16:9 and finish 170px early,
   leaving the other half of the block empty. Same crop, same balance. */
.cycle img { height: 475px; object-fit: cover; }
@media only screen and (max-width: 767px) { .cycle img { height: 300px; } }

/* ------------------------------------------------------------- age gate */

body.wv-locked { overflow: hidden; }

.wv-gate {
	position: fixed;
	top: 0; left: 0; right: 0; bottom: 0;
	z-index: 1000;
	background: rgba(35, 33, 33, 0.93);
	padding: 24px;
	overflow-y: auto;
}
.wv-gate[hidden] { display: none; }
.wv-gate__box {
	background: #fff;
	max-width: 660px;
	margin: 6vh auto 0;
	padding: 50px 44px;
	text-align: center;
	border-top: 4px solid #a92125;
}
@media only screen and (max-width: 767px) {
	.wv-gate__box { padding: 34px 22px; margin-top: 3vh; }
}
.wv-gate__mark {
	display: block;
	font-family: "EB Garamond", serif;
	font-size: 26px;
	letter-spacing: 4px;
	text-transform: uppercase;
	color: #a92125;
	margin-bottom: 26px;
}
.wv-gate__box h2 {
	font-family: "EB Garamond", serif;
	font-size: 34px;
	line-height: 42px;
	color: #656565;
	margin-bottom: 18px;
}
.wv-gate__box p { font-size: 16px; line-height: 26px; margin-bottom: 30px; }
.wv-gate__buttons .wv-btn { margin: 0 6px 10px; }

/* --------------------------------------------------------- cookie notice */

.wv-cookie {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: 900;
	background: #fff;
	box-shadow: 0px -6px 40px rgba(0, 0, 0, 0.18);
	max-height: 85vh;
	overflow-y: auto;
}
.wv-cookie[hidden] { display: none; }
.wv-cookie__bar {
	max-width: 1300px;
	margin: 0px auto;
	padding: 22px 26px;
	display: flex;
	gap: 26px;
	align-items: center;
	flex-wrap: wrap;
}
.wv-cookie__text { flex: 1 1 420px; }
.wv-cookie__text p { font-size: 14px; line-height: 22px; margin: 0px; }
.wv-cookie__text a { color: #a92125; }
.wv-cookie__buttons { display: flex; gap: 10px; flex-wrap: wrap; }
.wv-cookie__buttons .wv-btn { padding: 14px 22px; font-size: 12px; }
.wv-cookie__panel {
	max-width: 1300px;
	margin: 0px auto;
	padding: 0px 26px 26px;
	border-top: 1px solid #eee;
}
.wv-cookie__panel[hidden] { display: none; }
.wv-cookie__panel h3 {
	font-family: "EB Garamond", serif;
	font-size: 24px;
	color: #9a9a9a;
	margin: 22px 0px 14px;
}
.wv-cookie__panel .wv-btn { margin-top: 14px; }

.wv-cookie-btn {
	position: fixed;
	right: 30px;
	bottom: 92px;
	z-index: 80;
	background: #fff;
	color: #656565;
	border: 1px solid #e2e2e2;
	box-shadow: 10px -10px 60px rgba(0, 0, 0, 0.1);
	font-family: "Lato", sans-serif;
	font-size: 11px;
	letter-spacing: 1px;
	text-transform: uppercase;
	padding: 12px 14px;
	cursor: pointer;
	transition: 0.4s;
}
.wv-cookie-btn:hover { background: #a92125; color: #fff; border-color: #a92125; }

/* ------------------------------------------------------------------ forms */

/* Hidden from people, visible to the bots that fill in every field they find.
   Clipped rather than pushed off-canvas, so it cannot widen the page. */
.wv-hp {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

.wv-form { max-width: 900px; }
.wv-form__grid {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -12px;
	padding-left: 0px;
}
.wv-form .wv-field {
	width: 50%;
	padding: 0px 12px 16px;
	list-style: none;
}
.wv-form .wv-field--wide { width: 100%; }
@media only screen and (max-width: 767px) {
	.wv-form .wv-field { width: 100%; }
}
.wv-form .wv-field label {
	display: block;
	width: 100%;
	float: none;
	top: 0px;
	font-size: 15px;
	line-height: 26px;
	letter-spacing: 0.5px;
}
.wv-form .wv-field label i {
	font-size: 12px;
	font-style: italic;
	padding-left: 10px;
	color: #a92125;
}
.wv-form .wv-field input,
.wv-form .wv-field select,
.wv-form .wv-field textarea {
	width: 100%;
	float: none;
	background: #faf9f7 !important;
	border: 0px;
	border-left: 2px solid #9a9a9a !important;
	padding: 0px 15px;
	height: 48px;
	line-height: 48px !important;
	font-size: 17px;
	font-family: "Lato", sans-serif;
	color: #656565;
}
.wv-form .wv-field textarea {
	height: 150px;
	line-height: 24px !important;
	padding: 12px 15px;
	resize: vertical;
}
.wv-form .wv-field input:focus,
.wv-form .wv-field select:focus,
.wv-form .wv-field textarea:focus { border-left-color: #a92125 !important; }
.wv-invalid input,
.wv-invalid select,
.wv-invalid textarea { border-left-color: #d0021b !important; }
.wv-invalid > span { color: #d0021b; }

.wv-checks { margin: 14px 0px 30px; }
.wv-check {
	display: block;
	position: relative;
	padding-left: 30px;
	margin-bottom: 14px;
	font-size: 15px;
	line-height: 24px;
	cursor: pointer;
}
.wv-check input { position: absolute; left: 0px; top: 5px; width: 15px; height: 15px; }
.wv-check span { display: block; }
.wv-check span i { font-style: italic; color: #a92125; font-size: 12px; padding-left: 6px; }
.wv-check a { color: #a92125; }
.wv-form__note { font-size: 14px; line-height: 22px; margin-top: 20px; color: #9a9a9a; }
.wv-form__note a { color: #a92125; }

/* The short availability strip */
.wv-quick {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 16px;
	background: #fff;
	padding: 26px 28px;
}
.wv-quick__field { flex: 1 1 170px; }
.wv-quick__field--narrow { flex: 0 1 110px; }
.wv-quick label {
	display: block;
	width: 100%;
	float: none;
	top: 0px;
	font-size: 12px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #9a9a9a;
	margin-bottom: 6px;
}
.wv-quick input,
.wv-quick select {
	width: 100%;
	float: none;
	height: 46px;
	line-height: 46px !important;
	padding: 0px 12px;
	border: 0px;
	border-left: 2px solid #a92125 !important;
	background: #faf9f7 !important;
	font-size: 16px;
	font-family: "Lato", sans-serif;
	color: #656565;
}
@media only screen and (max-width: 767px) {
	.wv-quick { padding: 20px; }
	.wv-quick__field, .wv-quick__field--narrow { flex: 1 1 100%; }
	.wv-quick .wv-btn { width: 100%; text-align: center; }
}

/* --------------------------------------------------------------- content */

/* The donor's ghost section number sits behind a three-word title. Ours run to
   two lines, so the number moves left and pales off rather than colliding. */
.row-title.home-title { padding-left: 170px; }
.row-title.home-title div {
	font-size: 128px;
	color: #f0dcdc;
	top: 44px;
	left: 12px;
}
@media only screen and (max-width: 767px) {
	.row-title.home-title { padding-left: 20px; padding-top: 70px; }
	.row-title.home-title div { font-size: 92px; top: 0px; left: 14px; }
}

.wv-num {
	display: block;
	font-family: "Lato", sans-serif;
	font-size: 12px;
	letter-spacing: 5px;
	text-transform: uppercase;
	color: #a92125;
	margin-bottom: 14px;
	font-weight: 700;
}
.wv-lead { font-size: 21px !important; line-height: 33px !important; }
@media only screen and (max-width: 767px) {
	.wv-lead { font-size: 18px !important; line-height: 29px !important; }
}
.wv-kicker {
	font-family: "EB Garamond", serif;
	font-size: 19px;
	font-style: italic;
	letter-spacing: 2px;
	color: #a92125;
	display: block;
	margin-bottom: 10px;
}

/* Feature cards — six of them on the home page, packages on promotions */
.wv-cards { display: flex; flex-wrap: wrap; margin: 0px -15px; }
.wv-card { width: 33.333%; padding: 0px 15px 30px; }
@media only screen and (max-width: 1000px) { .wv-card { width: 50%; } }
@media only screen and (max-width: 767px)  { .wv-card { width: 100%; } }
.wv-card__inner { background: #fff; height: 100%; display: flex; flex-direction: column; }
/* Stock photography arrives in three different shapes; the cards have to line
   their headings up regardless. */
.wv-card img { display: block; width: 100%; height: 230px; object-fit: cover; }
@media only screen and (max-width: 767px) { .wv-card img { height: 200px; } }
.wv-card__body { padding: 28px 30px 30px; flex: 1; display: flex; flex-direction: column; }
.wv-card__body h3 {
	font-family: "EB Garamond", serif;
	font-size: 28px;
	line-height: 34px;
	color: #9a9a9a;
	margin-bottom: 8px;
}
.wv-card__meta {
	font-size: 12px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: #a92125;
	margin-bottom: 14px;
	display: block;
}
.wv-card__body p { font-size: 16px; line-height: 25px; margin-bottom: 16px; }
.wv-card__price {
	font-family: "EB Garamond", serif;
	font-size: 24px;
	color: #a92125;
	margin-bottom: 14px;
}
.wv-card ul { padding-left: 22px !important; margin-bottom: 20px !important; }
.wv-card ul li { font-size: 15px !important; line-height: 23px !important; padding-bottom: 8px !important; }
.wv-card__foot { margin-top: auto; }

/* Statistics band */
.wv-stats { display: flex; flex-wrap: wrap; text-align: center; }
.wv-stat { width: 20%; padding: 10px 12px; }
@media only screen and (max-width: 767px) { .wv-stat { width: 50%; } }
.wv-stat strong {
	display: block;
	font-family: "EB Garamond", serif;
	font-size: 52px;
	line-height: 58px;
	color: #a92125;
}
.wv-stat strong.wv-stars { font-size: 26px; letter-spacing: 3px; line-height: 58px; }
@media only screen and (max-width: 767px) {
	.wv-stat strong { font-size: 40px; line-height: 48px; }
	.wv-stat strong.wv-stars { font-size: 20px; line-height: 48px; }
}
.wv-stat span {
	display: block;
	font-size: 13px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #9a9a9a;
	margin-top: 8px;
}

/* Plain tables — distances, the gaming floor, opening hours */
.wv-table { width: 100%; border-collapse: collapse; }
.wv-table th,
.wv-table td {
	text-align: left;
	padding: 14px 20px 14px 0px;
	border-bottom: 1px solid #eee;
	vertical-align: top;
	font-size: 16px;
	line-height: 25px;
}
.wv-table th {
	font-family: "EB Garamond", serif;
	font-size: 21px;
	color: #656565;
	white-space: nowrap;
	width: 26%;
}
.wv-table td.wv-num-col {
	color: #a92125;
	font-weight: 700;
	white-space: nowrap;
	width: 16%;
}
@media only screen and (max-width: 767px) {
	.wv-table, .wv-table tbody, .wv-table tr, .wv-table th, .wv-table td { display: block; width: 100%; }
	.wv-table tr { padding: 12px 0px; border-bottom: 1px solid #eee; }
	.wv-table th, .wv-table td { border: 0px; padding: 2px 0px; }
}

/* Fact strip under a heading */
.wv-facts { display: flex; flex-wrap: wrap; border-top: 1px solid #eee; margin: 24px 0px; }
.wv-facts div { width: 25%; padding: 14px 20px 14px 0px; border-bottom: 1px solid #eee; }
@media only screen and (max-width: 767px) { .wv-facts div { width: 50%; } }
.wv-facts dt {
	font-size: 11px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: #a92125;
	margin-bottom: 4px;
}
.wv-facts dd { margin: 0px; font-size: 16px; line-height: 24px; }

/* The helpline block, repeated wherever gaming is discussed */
.wv-help {
	background: #faf9f7;
	border-left: 4px solid #a92125;
	padding: 26px 30px;
	margin: 30px 0px;
}
.wv-help h3 {
	font-family: "EB Garamond", serif;
	font-size: 26px;
	color: #a92125;
	margin-bottom: 12px;
}
.wv-help p, .wv-help li { font-size: 16px; line-height: 26px; }
.wv-help ul { padding-left: 0px !important; margin-bottom: 0px !important; }
.wv-help ul li { list-style: none; padding: 4px 0px !important; }
.wv-help ul li:before { display: none; }
.wv-help a { color: #a92125; }

/* Rooms and long entries reuse the donor's .room block; these are the parts
   the donor never had a rate line for. */
/* The donor's .row-btn lives inside .editorTxt, which colours every link
   #a92125 — the same red the button is filled with. */
.editorTxt a.row-btn.color-white { color: #fff; }

.wv-rooms .room { margin-bottom: 70px; }
.wv-rooms .room:last-child { margin-bottom: 0px; }
.room .txt .wv-room-lead { font-size: 17px; line-height: 27px; margin-bottom: 18px; }
.room .price .title { font-style: normal !important; }

/* Legal and long-form pages */
.wv-prose { max-width: 860px; }
.wv-prose h2 {
	font-family: "EB Garamond", serif;
	font-size: 30px;
	color: #9a9a9a;
	margin: 40px 0px 14px;
}
.wv-prose h3 {
	font-family: "EB Garamond", serif;
	font-size: 23px;
	color: #656565;
	margin: 26px 0px 8px;
}
.wv-prose > *:first-child { margin-top: 0px; }

/* ---------------------------------------------------------------- footer */

.wv-foot-note { margin-top: 26px !important; }
.wv-foot-small {
	font-size: 12px;
	letter-spacing: 0px;
	text-transform: none;
	color: #9a9a9a;
	line-height: 20px;
	padding-bottom: 8px;
}
.wv-disclaimer { border-top: 1px solid #e6e4e0; padding-top: 26px; }
.wv-disclaimer p {
	font-size: 13px !important;
	line-height: 21px !important;
	color: #9a9a9a;
	margin-bottom: 10px !important;
}
.wv-disclaimer a { color: #a92125; }
.wv-legal-bar {
	border-top: 1px solid #e6e4e0;
	padding-top: 20px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 12px;
	font-size: 12px;
	letter-spacing: 0.5px;
	color: #9a9a9a;
}
.wv-legal-bar a { color: #9a9a9a; text-decoration: none; }
.wv-legal-bar a:hover { color: #a92125; }
.wv-legal-bar__right { text-transform: uppercase; letter-spacing: 1px; }
@media only screen and (max-width: 767px) {
	.wv-legal-bar { flex-direction: column; text-align: center; }
}

/* The donor never has two text columns side by side; dining and casino do. */
.wv-split { display: flex; flex-wrap: wrap; margin: 0px -24px; }
.wv-split > div { width: 50%; padding: 0px 24px; }
@media only screen and (max-width: 767px) { .wv-split > div { width: 100%; padding-bottom: 24px; } }

/* The donor only ever stacks .neg-top blocks, and separates them with
   .neg-top + .neg-top { margin-top: 80px }. Ours run on past the second block,
   where that rule stops applying and two grey panels end up touching. Same
   80px, stated for the blocks the donor never had. */
main > .block-row ~ .block-row:not(.neg-top) { margin-top: 80px; }
@media only screen and (max-width: 767px) {
	main > .block-row ~ .block-row:not(.neg-top) { margin-top: 40px; }
}

/* Jump links land under the fixed nothing — but the heading still wants air. */
.row[id], .block-row[id] { scroll-margin-top: 40px; }

/* A plain white panel for sections that sit on the grey background */
.wv-panel { background: #fff; padding: 50px 55px; }
@media only screen and (max-width: 767px) { .wv-panel { padding: 30px 22px; } }

/* The donor's .row is 94% of a phone with 3% either side. Our gutters are
   negative margins inside it, which on a phone push past that 3% and widen the
   page. On one column there are no gutters to negate. */
@media only screen and (max-width: 767px) {
	.wv-cards { margin-left: 0px; margin-right: 0px; }
	.wv-card { padding-left: 0px; padding-right: 0px; }
	.wv-split { margin-left: 0px; margin-right: 0px; }
	.wv-split > div { padding-left: 0px; padding-right: 0px; }
	/* Row headings stop being a column of their own once the table stacks, so
	   they no longer need to stay on one line — and some of them are long. */
	.wv-table th { white-space: normal; }
}