/*!
 * Wet & Wild Whale Swim Packages
 * Breakpoints match Elementor defaults: tablet ≤1024px, mobile ≤767px.
 */

/* ================================================================== */
/* Bundled fonts (SIL Open Font License) — the page looks the same     */
/* whether or not Elementor / Google Fonts loads them. Browsers only    */
/* download a file when text on the page uses it.                       */
/* ================================================================== */

@font-face { font-family: "Fraunces"; font-style: normal; font-display: swap; font-weight: 100 900; src: url("../fonts/fraunces-latin-opsz-normal.woff2") format("woff2-variations"), url("../fonts/fraunces-latin-opsz-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Fraunces"; font-style: normal; font-display: swap; font-weight: 100 900; src: url("../fonts/fraunces-latin-ext-opsz-normal.woff2") format("woff2-variations"), url("../fonts/fraunces-latin-ext-opsz-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Fraunces"; font-style: italic; font-display: swap; font-weight: 100 900; src: url("../fonts/fraunces-latin-opsz-italic.woff2") format("woff2-variations"), url("../fonts/fraunces-latin-opsz-italic.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Fraunces"; font-style: italic; font-display: swap; font-weight: 100 900; src: url("../fonts/fraunces-latin-ext-opsz-italic.woff2") format("woff2-variations"), url("../fonts/fraunces-latin-ext-opsz-italic.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Figtree"; font-style: normal; font-display: swap; font-weight: 300 900; src: url("../fonts/figtree-latin-wght-normal.woff2") format("woff2-variations"), url("../fonts/figtree-latin-wght-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Figtree"; font-style: normal; font-display: swap; font-weight: 300 900; src: url("../fonts/figtree-latin-ext-wght-normal.woff2") format("woff2-variations"), url("../fonts/figtree-latin-ext-wght-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Caveat"; font-style: normal; font-display: swap; font-weight: 400 700; src: url("../fonts/caveat-latin-wght-normal.woff2") format("woff2-variations"), url("../fonts/caveat-latin-wght-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Caveat"; font-style: normal; font-display: swap; font-weight: 400 700; src: url("../fonts/caveat-latin-ext-wght-normal.woff2") format("woff2-variations"), url("../fonts/caveat-latin-ext-wght-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
	--wnw-ink: #053A57;
	--wnw-ocean: #0B5378;
	--wnw-teal: #0A6E7C;
	--wnw-aqua: #14A3AE;
	--wnw-aqua-light: #7FE3E8;
	--wnw-lagoon: #E4F5F3;
	--wnw-chip: #D3F1EF;
	--wnw-sand: #F6F1E9;
	--wnw-line: #E4DCCF;
	--wnw-body: #3F4E58;
	--wnw-muted: #5A6770;
	--wnw-red: #D10000;
	--wnw-red-dark: #A80000;
	--wnw-sun: #FFD27A;
	--wnw-display: "Fraunces", Georgia, serif;
	--wnw-text: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
	--wnw-script: "Caveat", cursive;
	--wnw-radius: 14px;
}

/* ================================================================== */
/* Section motif backgrounds — add these classes to Elementor           */
/* containers (Advanced → CSS Classes). They layer on top of the        */
/* container's own background colour.                                   */
/* ================================================================== */

.wnw-sec-hero {
	background-image:
		url("../img/motifs/edge-white.png"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 220'%3E%3Cpath fill='%237FE3E8' fill-opacity='0.08' d='M20 120 C60 70 180 48 300 58 C400 66 470 88 520 108 L560 78 C572 70 590 68 598 74 C586 90 576 104 568 118 C580 128 592 142 596 158 C584 162 566 156 554 146 L515 130 C450 150 360 166 260 160 C200 157 150 150 112 142 L150 192 C156 202 140 208 126 200 L78 150 C48 144 24 134 20 120 Z'/%3E%3C/svg%3E"),
		url("../img/motifs/tangaroa-aqua.png"),
		url("../img/motifs/ngaru-aqua.png");
	background-repeat: repeat-x, no-repeat, repeat-x, repeat-x;
	background-size: auto 40px, 760px auto, auto 44px, auto 150px;
	background-position: left bottom, 3% 300px, left calc(100% - 190px), left 28px;
}

.wnw-sec-why {
	background-image: url("../img/motifs/onu-navy.png");
	background-repeat: repeat-x;
	background-size: auto 110px;
	background-position: left calc(100% - 20px);
}

.wnw-sec-beyond {
	background-image: url("../img/motifs/ngaru-teal.png");
	background-repeat: repeat-x;
	background-size: auto 120px;
	background-position: left calc(100% - 30px);
}

.wnw-sec-dates {
	background-image: url("../img/motifs/mango-teal.png");
	background-repeat: repeat-x;
	background-size: auto 18px;
	background-position: left top;
}

.wnw-sec-prices {
	background-image: url("../img/motifs/koru-teal.png");
	background-repeat: repeat-x;
	background-size: auto 96px;
	background-position: left 36px;
}

.wnw-sec-reviews {
	background-image: url("../img/motifs/koru-aqua.png"), url("../img/motifs/ngaru-aqua.png");
	background-repeat: repeat-x, repeat-x;
	background-size: auto 80px, auto 110px;
	background-position: left 26px, left calc(100% - 20px);
}

.wnw-sec-enquire {
	background-image:
		url("../img/motifs/ngaru-aqua.png"),
		url("../img/motifs/onu-aqua.png"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 220'%3E%3Cpath fill='%237FE3E8' fill-opacity='0.08' d='M20 120 C60 70 180 48 300 58 C400 66 470 88 520 108 L560 78 C572 70 590 68 598 74 C586 90 576 104 568 118 C580 128 592 142 596 158 C584 162 566 156 554 146 L515 130 C450 150 360 166 260 160 C200 157 150 150 112 142 L150 192 C156 202 140 208 126 200 L78 150 C48 144 24 134 20 120 Z'/%3E%3C/svg%3E");
	background-repeat: repeat-x, repeat-x, no-repeat;
	background-size: auto 120px, auto 90px, 560px auto;
	background-position: left 24px, left calc(100% - 24px), -60px 62%;
}

/* Wave edge helpers: paint the next section's colour as a tattoo-wave edge. */
.wnw-edge-white { background-image: url("../img/motifs/edge-white.png"); background-repeat: repeat-x; background-size: auto 40px; background-position: left bottom; }
.wnw-edge-lagoon { background-image: url("../img/motifs/edge-lagoon.png"); background-repeat: repeat-x; background-size: auto 40px; background-position: left bottom; }

@media (max-width: 767px) {
	.wnw-sec-hero {
		background-size: auto 26px, 420px auto, auto 30px, auto 90px;
		background-position: left bottom, -40px 330px, left calc(100% - 150px), left 20px;
	}
	.wnw-sec-why { background-size: auto 70px; }
	.wnw-sec-beyond { background-size: auto 60px; background-position: left calc(100% - 16px); }
	.wnw-sec-dates { background-size: auto 14px; }
	.wnw-sec-prices { background-size: auto 64px; background-position: left 24px; }
	.wnw-sec-reviews { background-size: auto 56px, auto 60px; }
	.wnw-sec-enquire { background-size: auto 70px, auto 60px, 360px auto; }
	.wnw-edge-white, .wnw-edge-lagoon { background-size: auto 26px; }
}

/* ================================================================== */
/* Text-style guard — every section in the template carries wnw-typo.  */
/* Widget typography set in Elementor always wins; this only undoes the */
/* theme's defaults (Hello Elementor reset) that would otherwise creep  */
/* in, so text matches the design.                                     */
/* ================================================================== */

.wnw-typo { font-family: var(--wnw-text); color: var(--wnw-body); }
.wnw-typo .elementor-widget-text-editor p { margin: 0 0 .9em; }
.wnw-typo .elementor-widget-text-editor p:last-child { margin-bottom: 0; }
.wnw-typo .elementor-widget-text-editor :where(strong, b) { font-weight: 700; }
.wnw-typo .elementor-widget-text-editor a:not([style*="color"]) { color: inherit; text-decoration: underline; }
.wnw-typo .elementor-heading-title :where(em) { font-style: italic; font-family: inherit; }
.wnw-typo :where(.elementor-heading-title, .elementor-icon-box-title, .elementor-image-box-title) { text-transform: none; }
.wnw-typo .elementor-testimonial-content { font-style: normal; }
.wnw-typo .elementor-accordion .elementor-tab-content p:last-child { margin-bottom: 0; }

/* ================================================================== */
/* Handy Elementor helpers                                             */
/* ================================================================== */

/* Postcards: add to an Image Box widget. */
.wnw-postcard {
	background: #FFFFFF;
	padding: 12px 12px 18px;
	border-radius: 6px;
	box-shadow: 0 10px 30px rgba(5, 58, 87, .14);
	transition: transform .25s ease;
}
.wnw-postcard .elementor-image-box-wrapper { text-align: left; }
.wnw-postcard .elementor-image-box-img { width: 100% !important; margin: 0 0 14px !important; }
.wnw-postcard .elementor-image-box-img img { width: 100%; aspect-ratio: 5 / 4; object-fit: cover; border-radius: 3px; }
.wnw-postcard .elementor-image-box-content { padding: 0 6px; }
.wnw-tilt-l { transform: rotate(-2deg); }
.wnw-tilt-r { transform: rotate(1.8deg) translateY(12px); }
.wnw-postcard:hover { transform: rotate(0deg) translateY(-4px); }
@media (max-width: 767px) {
	.wnw-tilt-r { transform: rotate(1.5deg); }
}
@media (prefers-reduced-motion: reduce) {
	.wnw-postcard, .wnw-postcard:hover { transition: none; }
}

/* Rounded media (video / image widgets). */
.wnw-rounded, .wnw-rounded iframe, .wnw-rounded img, .wnw-rounded .elementor-wrapper { border-radius: 20px; overflow: hidden; }

/* Jump-link bar: scrolls sideways on phones instead of wrapping. */
.wnw-jumpnav { scrollbar-width: none; }
.wnw-jumpnav::-webkit-scrollbar { display: none; }
@media (max-width: 1024px) {
	.wnw-jumpnav { flex-wrap: nowrap !important; overflow-x: auto; -webkit-overflow-scrolling: touch; }
	.wnw-jumpnav > .elementor-element { flex-shrink: 0; }
}

/* Anchor offset so sticky theme headers don't cover section titles. */
#dates, #included, #prices, #reviews, #booking, #faq, #bring, #enquire { scroll-margin-top: 90px; }

/* ================================================================== */
/* Booking components                                                  */
/* ================================================================== */

/* ---------- Theme / Elementor-kit shield ----------
 * Hello Elementor and Elementor Site Settings style every <button>, <a>, <label> and form
 * field site-wide (e.g. red kit buttons, pink hover). These zero-specificity :where() resets,
 * plus the body:not(#wnw) prefix on every rule below, keep the booking UI on-brand.
 */
body:not(#wnw) :where(.wnw) :where(button, [type=button], [type=submit]) {
	margin: 0; border: 0; border-radius: 0; background: none; box-shadow: none; text-shadow: none;
	color: inherit; font: inherit; line-height: 1.2; letter-spacing: normal; text-transform: none; text-decoration: none;
	white-space: normal; -webkit-user-select: auto; user-select: auto; min-height: 0; width: auto; transition: none;
}
body:not(#wnw) :where(.wnw) :where(button:hover, button:focus, [type=button]:hover, [type=button]:focus, [type=submit]:hover, [type=submit]:focus) {
	background: none; color: inherit; text-decoration: none;
}
body:not(#wnw) :where(.wnw) :where(a) { color: var(--wnw-teal); text-decoration: underline; background: none; }
body:not(#wnw) :where(.wnw) :where(a:hover, a:active) { color: var(--wnw-ink); }
body:not(#wnw) :where(.wnw) :where(label) { display: block; line-height: 1.3; vertical-align: baseline; }
body:not(#wnw) :where(.wnw) :where(h3, p, dl, dd, dt) { margin: 0; }
body:not(#wnw) :where(.wnw) :where(input, select, textarea) { margin: 0; box-shadow: none; transition: border-color .15s ease; }

body:not(#wnw) .wnw { font-family: var(--wnw-text); color: var(--wnw-ink); box-sizing: border-box; }
body:not(#wnw) .wnw *,
body:not(#wnw) .wnw *::before,
body:not(#wnw) .wnw *::after { box-sizing: border-box; }
body:not(#wnw) .wnw [hidden] { display: none !important; }

body:not(#wnw) .wnw button { font-family: inherit; }
body:not(#wnw) .wnw button:focus-visible,
body:not(#wnw) .wnw a:focus-visible,
body:not(#wnw) .wnw input:focus-visible,
body:not(#wnw) .wnw select:focus-visible,
body:not(#wnw) .wnw textarea:focus-visible { outline: 3px solid var(--wnw-aqua); outline-offset: 2px; }

body:not(#wnw) .wnw-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 52px; padding: 0 26px; border: 0; border-radius: 999px;
	background: var(--wnw-red); color: #FFFFFF !important; text-decoration: none !important;
	font: 700 16px/1 var(--wnw-text); cursor: pointer; transition: background .2s ease;
}
body:not(#wnw) .wnw-btn:hover { background: var(--wnw-red-dark); }
body:not(#wnw) .wnw-btn:disabled { opacity: .6; cursor: progress; }
body:not(#wnw) .wnw-btn--sm { min-height: 46px; padding: 0 20px; font-size: 15px; }

/* ---------- Step 1: tour weeks ---------- */

body:not(#wnw) .wnw-dates__selected { margin: 0 0 20px; font-size: 16px; color: var(--wnw-muted); }
body:not(#wnw) .wnw-dates__selected strong { color: var(--wnw-ink); }

body:not(#wnw) .wnw-dates__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
body:not(#wnw) .wnw-month__name {
	margin: 0 0 12px !important; padding: 0 0 8px; border-bottom: 2px solid var(--wnw-ink);
	font: 700 14px/1.2 var(--wnw-text) !important; letter-spacing: .06em; text-transform: uppercase; color: var(--wnw-muted) !important;
}
body:not(#wnw) .wnw-month__weeks { display: flex; flex-direction: column; gap: 12px; }

body:not(#wnw) .wnw-week {
	width: 100%; min-height: 76px; display: flex; flex-direction: column; align-items: flex-start; gap: 6px;
	padding: 14px 16px; border-radius: 12px; border: 1.5px solid var(--wnw-line);
	background: #FFFFFF; color: var(--wnw-ink); text-align: left; cursor: pointer;
	transition: border-color .15s ease, background .15s ease, color .15s ease, transform .15s ease;
}
body:not(#wnw) .wnw-week:hover:not(:disabled) { border-color: var(--wnw-teal); transform: translateY(-1px); }
body:not(#wnw) .wnw-week.is-selected { background: var(--wnw-ink); border-color: var(--wnw-ink); color: #FFFFFF; }
body:not(#wnw) .wnw-week:disabled { cursor: not-allowed; background: #F4F4F2; color: #8A949B; }
body:not(#wnw) .wnw-week__top { display: flex; justify-content: space-between; align-items: center; width: 100%; font-size: 13px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; opacity: .8; }
body:not(#wnw) .wnw-week__code { font-size: 12px; letter-spacing: 0; }
body:not(#wnw) .wnw-week__range { font-size: 18px; font-weight: 700; line-height: 1.2; }
body:not(#wnw) .wnw-week:disabled .wnw-week__range { text-decoration: line-through; text-decoration-thickness: 1px; }
body:not(#wnw) .wnw-week__tag { display: inline-block; padding: 3px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; }
body:not(#wnw) .wnw-week__tag--few { background: #FFF1D6; color: #7A4A00; }
body:not(#wnw) .wnw-week__tag--full,
body:not(#wnw) .wnw-week__tag--past { background: #E7E7E4; color: #555E63; }
body:not(#wnw) .wnw-week.is-selected .wnw-week__tag--few { background: var(--wnw-sun); color: #3D2600; }

/* ---------- Step 2: who's travelling + stays ---------- */

body:not(#wnw) .wnw-occ { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 5px; margin: 0 0 28px; background: var(--wnw-sand); border-radius: 999px; }
body:not(#wnw) .wnw-occ__btn {
	min-height: 44px; padding: 0 18px; border: 0; border-radius: 999px; background: transparent;
	color: var(--wnw-body); font-size: 15px; font-weight: 700; cursor: pointer; transition: background .15s ease, color .15s ease;
}
body:not(#wnw) .wnw-occ__btn:hover { color: var(--wnw-ink); }
body:not(#wnw) .wnw-occ__btn.is-selected { background: var(--wnw-ink); color: #FFFFFF; }

body:not(#wnw) .wnw-stays__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
body:not(#wnw) .wnw-stay { display: flex; flex-direction: column; border: 1px solid var(--wnw-line); border-radius: 20px; overflow: hidden; background: #FFFFFF; }
body:not(#wnw) .wnw-stay__media { position: relative; aspect-ratio: 16 / 10; background: #DCD3C4; display: flex; align-items: center; justify-content: center; }
body:not(#wnw) .wnw-stay__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
body:not(#wnw) .wnw-stay__placeholder { padding: 16px; font-size: 13px; color: #5A5043; text-align: center; }
body:not(#wnw) .wnw-stay__badge { position: absolute; top: 14px; left: 14px; padding: 6px 12px; border-radius: 999px; background: var(--wnw-ink); color: #FFFFFF; font-size: 13px; font-weight: 700; }
body:not(#wnw) .wnw-stay__body { padding: 24px; display: flex; flex-direction: column; gap: 14px; flex-grow: 1; }
body:not(#wnw) .wnw-stay__name { margin: 0 !important; font: 600 26px/1.15 var(--wnw-display) !important; color: var(--wnw-ink) !important; }
body:not(#wnw) .wnw-stay__rooms { display: flex; flex-direction: column; gap: 10px; }
body:not(#wnw) .wnw-stay__none { margin: 0; padding: 16px; border-radius: 12px; background: var(--wnw-sand); font-size: 15px; line-height: 1.5; color: var(--wnw-body); }
body:not(#wnw) .wnw-stay.is-empty { opacity: .85; }

body:not(#wnw) .wnw-room {
	width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 12px;
	padding: 14px 16px; border-radius: 12px; border: 2px solid var(--wnw-line); background: #FFFFFF;
	color: var(--wnw-ink); cursor: pointer; text-align: left; transition: border-color .15s ease, background .15s ease;
}
body:not(#wnw) .wnw-room:hover { border-color: var(--wnw-teal); }
body:not(#wnw) .wnw-room.is-selected { background: var(--wnw-chip); border-color: var(--wnw-teal); }
body:not(#wnw) .wnw-room__info,
body:not(#wnw) .wnw-room__price { display: flex; flex-direction: column; gap: 2px; }
body:not(#wnw) .wnw-room__price { align-items: flex-end; text-align: right; flex-shrink: 0; }
body:not(#wnw) .wnw-room__name { font-weight: 700; font-size: 16px; line-height: 1.3; }
body:not(#wnw) .wnw-room__code,
body:not(#wnw) .wnw-room__pp { font-size: 12px; color: var(--wnw-muted); }
body:not(#wnw) .wnw-room__amount { font-weight: 700; font-size: 20px; white-space: nowrap; }

body:not(#wnw) .wnw-totalbar {
	margin-top: 36px; display: flex; align-items: center; justify-content: space-between; gap: 32px;
	padding: 24px 32px; border-radius: 18px; background: var(--wnw-ink); color: #FFFFFF;
}
body:not(#wnw) .wnw-totalbar__stats { margin: 0; display: flex; flex-wrap: wrap; gap: 20px 48px; }
body:not(#wnw) .wnw-totalbar__stats div { display: flex; flex-direction: column; gap: 4px; }
body:not(#wnw) .wnw-totalbar__stats dt { font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #A8D2E0; }
body:not(#wnw) .wnw-totalbar__stats dd { margin: 0; font-size: 17px; font-weight: 700; }
body:not(#wnw) .wnw-totalbar .wnw-btn { flex-shrink: 0; }

/* ---------- Summary ---------- */

body:not(#wnw) .wnw-summary { padding: 24px; border-radius: 16px; background: var(--wnw-ocean); color: #FFFFFF; display: flex; flex-direction: column; gap: 14px; font-size: 15px; }
body:not(#wnw) .wnw-summary__row { display: flex; justify-content: space-between; gap: 16px; }
body:not(#wnw) .wnw-summary__row span { color: #A8D2E0; }
body:not(#wnw) .wnw-summary__row strong { text-align: right; }
body:not(#wnw) .wnw-summary__row--total { padding-top: 14px; border-top: 1px solid #1C6389; }
body:not(#wnw) .wnw-summary__row--total strong { font-size: 18px; }

/* ---------- Step 3: form ---------- */

body:not(#wnw) .wnw-formwrap { background: #FFFFFF; color: var(--wnw-ink); border-radius: 20px; padding: 40px; }
body:not(#wnw) .wnw-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
body:not(#wnw) .wnw-field { margin: 0; display: flex; flex-direction: column; gap: 8px; }
body:not(#wnw) .wnw-field--full { grid-column: 1 / -1; }
body:not(#wnw) .wnw-field label { font-size: 14px; font-weight: 600; color: var(--wnw-ink); }
body:not(#wnw) .wnw-field__hint { font-weight: 400; color: var(--wnw-muted); }
body:not(#wnw) .wnw-field input,
body:not(#wnw) .wnw-field select,
body:not(#wnw) .wnw-field textarea {
	width: 100%; min-height: 50px; padding: 0 14px; border: 1.5px solid #CFC5B5; border-radius: 10px;
	background: #FFFFFF; color: var(--wnw-ink); font: 400 16px/1.4 var(--wnw-text); box-shadow: none;
}
body:not(#wnw) .wnw-field textarea { padding: 12px 14px; resize: vertical; min-height: 110px; }
body:not(#wnw) .wnw-field input:focus,
body:not(#wnw) .wnw-field select:focus,
body:not(#wnw) .wnw-field textarea:focus { border-color: var(--wnw-teal); }
body:not(#wnw) .wnw-field.has-error input,
body:not(#wnw) .wnw-field.has-error select,
body:not(#wnw) .wnw-field.has-error textarea { border-color: #B42318; }
body:not(#wnw) .wnw-field__error { font-size: 13px; color: #B42318; }
body:not(#wnw) .wnw-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
body:not(#wnw) .wnw-form__footer { margin-top: 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
body:not(#wnw) .wnw-form__note { margin: 0; font-size: 14px; color: var(--wnw-muted); }
body:not(#wnw) .wnw-form__status { margin: 14px 0 0; font-size: 14px; color: #B42318; min-height: 1em; }
body:not(#wnw) .wnw-form__success { text-align: center; padding: 24px 8px; color: var(--wnw-teal); outline: none; }
body:not(#wnw) .wnw-form__success p { color: var(--wnw-body); font-size: 16px; line-height: 1.6; margin: 8px 0 0; }
body:not(#wnw) .wnw-form__success .wnw-form__success-title { font: 600 28px/1.2 var(--wnw-display); color: var(--wnw-ink); margin-top: 12px; }

/* ---------- Sticky bar (phones) ---------- */

body:not(#wnw) .wnw-bar { display: none; }
@media (max-width: 767px) {
	body:not(#wnw) .wnw-bar {
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 999;
		display: flex; align-items: center; justify-content: space-between; gap: 12px;
		padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
		background: #FFFFFF; border-top: 1px solid var(--wnw-line); box-shadow: 0 -6px 20px rgba(14, 36, 51, .12);
		transition: transform .25s ease;
	}
	body:not(#wnw) .wnw-bar.is-hidden { transform: translateY(110%); }
	body:not(#wnw) .wnw-bar__price { display: flex; flex-direction: column; }
	body:not(#wnw) .wnw-bar__price span { font-size: 12px; color: var(--wnw-muted); }
	body:not(#wnw) .wnw-bar__price strong { font-size: 17px; color: var(--wnw-ink); }
	html.wnw-has-bar body { padding-bottom: 76px; }
}

/* ---------- Tablet ---------- */

@media (max-width: 1024px) {
	body:not(#wnw) .wnw-dates__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 24px; }
	body:not(#wnw) .wnw-stays__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
	body:not(#wnw) .wnw-totalbar { flex-direction: column; align-items: stretch; }
	body:not(#wnw) .wnw-totalbar__stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; }
	body:not(#wnw) .wnw-formwrap { padding: 32px; }
}

/* ---------- Mobile ---------- */

@media (max-width: 767px) {
	body:not(#wnw) .wnw-dates__grid { grid-template-columns: 1fr; gap: 22px; }
	body:not(#wnw) .wnw-month__weeks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
	body:not(#wnw) .wnw-week { min-height: 68px; padding: 10px 12px; }
	body:not(#wnw) .wnw-week__range { font-size: 15px; }
	body:not(#wnw) .wnw-week__code { display: none; }

	body:not(#wnw) .wnw-occ { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; border-radius: 14px; }
	body:not(#wnw) .wnw-occ__btn { border-radius: 10px; padding: 0 10px; font-size: 14px; }

	body:not(#wnw) .wnw-stays__grid { grid-template-columns: 1fr; gap: 16px; }
	body:not(#wnw) .wnw-stay { border-radius: 16px; }
	body:not(#wnw) .wnw-stay__body { padding: 16px; gap: 10px; }
	body:not(#wnw) .wnw-stay__name { font-size: 22px !important; }
	body:not(#wnw) .wnw-room { padding: 12px 14px; }
	body:not(#wnw) .wnw-room__amount { font-size: 17px; }

	body:not(#wnw) .wnw-totalbar { margin-top: 24px; padding: 20px; border-radius: 14px; gap: 18px; }
	body:not(#wnw) .wnw-totalbar__stats dd { font-size: 15px; }
	body:not(#wnw) .wnw-totalbar .wnw-btn { width: 100%; }

	body:not(#wnw) .wnw-formwrap { padding: 20px; border-radius: 16px; }
	body:not(#wnw) .wnw-form__grid { grid-template-columns: 1fr; gap: 14px; }
	body:not(#wnw) .wnw-field input,
body:not(#wnw) .wnw-field select { min-height: 48px; }
	body:not(#wnw) .wnw-form__footer { flex-direction: column-reverse; align-items: stretch; }
	body:not(#wnw) .wnw-form__footer .wnw-btn { width: 100%; }
}