/* ==========================================================================
   NuWeb Network — seasonal (Christmas) styling
   Everything here is scoped to classes that the head script adds to <html>
   only while the season is on: .nw-season, .nw-fx-snow, .nw-fx-lights,
   .nw-fx-frost. Outside the season this file changes nothing.
   ========================================================================== */

:root {
	--nw-xmas-red: #E63946;
	--nw-xmas-green: #2A9D8F;
	--nw-xmas-gold: #F4C146;
	--nw-xmas-ice: #4CC9F0;
}

/* ---------- Top bar promo swap ---------- */

.nw-season .nw-promo--normal { display: none; }
.nw-season .nw-promo--season { display: inline-flex; }
.nw-promo--season a { color: inherit; text-decoration: none; display: inline-flex; gap: 6px; }
.nw-promo--season a:hover span { text-decoration: underline; }
.nw-season .nw-promo--season strong { color: var(--nw-xmas-red); }
html[data-theme="dark"].nw-season .nw-promo--season strong { color: #FF8A93; }
.nw-promo--season .nw-topbar__promo-icon { color: var(--nw-xmas-ice); }
@media (prefers-reduced-motion: no-preference) {
	.nw-season .nw-promo--season .nw-icon { animation: nw-season-spin 12s linear infinite; }
}
@keyframes nw-season-spin { to { transform: rotate(360deg); } }

/* ---------- Frost: top bar and snowy hero edge ---------- */

.nw-fx-frost .nw-topbar {
	position: relative;
	background:
		radial-gradient(circle at 8% 120%, rgba(255, 255, 255, .9), transparent 40%),
		radial-gradient(circle at 92% -20%, rgba(255, 255, 255, .85), transparent 38%),
		linear-gradient(90deg, #EAF6FF 0%, #F6FBFF 50%, #E3F2FD 100%);
	border-bottom-color: rgba(76, 201, 240, .28);
}
html[data-theme="dark"].nw-fx-frost .nw-topbar {
	background:
		radial-gradient(circle at 8% 120%, rgba(127, 205, 230, .16), transparent 40%),
		radial-gradient(circle at 92% -20%, rgba(127, 205, 230, .14), transparent 38%),
		linear-gradient(90deg, #111A2B 0%, #16263A 50%, #122133 100%);
}

/* Snowdrift along the bottom of the hero and page headers. */
.nw-fx-frost .nw-hero::after,
.nw-fx-frost .nw-page-header::after {
	content: "";
	position: absolute; left: 0; right: 0; bottom: -1px; z-index: 0;
	height: 46px;
	pointer-events: none;
	background: var(--nw-bg);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 30c60-14 120-18 180-10s110 18 170 14 100-22 160-24 120 18 190 20 120-16 180-18 110 14 170 16 120-18 180-20 130 12 210 18v20H0z'/%3E%3C/svg%3E") bottom / 100% 100% no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 46' preserveAspectRatio='none'%3E%3Cpath d='M0 30c60-14 120-18 180-10s110 18 170 14 100-22 160-24 120 18 190 20 120-16 180-18 110 14 170 16 120-18 180-20 130 12 210 18v20H0z'/%3E%3C/svg%3E") bottom / 100% 100% no-repeat;
}
.nw-fx-frost .nw-page-header { padding-bottom: calc(clamp(48px, 6vw, 76px) + 20px); }

/* ---------- Fairy lights under the header ---------- */

.nw-lights { display: none; }
.nw-fx-lights .nw-lights {
	position: absolute; left: 0; right: 0; bottom: -13px; z-index: 5;
	display: flex; justify-content: space-around; align-items: flex-start;
	height: 20px; padding: 0 12px;
	pointer-events: none;
}
/* The wire: a gentle sag between bulbs. */
.nw-fx-lights .nw-lights::before {
	content: "";
	position: absolute; left: 0; right: 0; top: -2px; height: 10px;
	background: radial-gradient(ellipse 18px 6px at 50% 0, transparent 70%, rgba(52, 62, 86, .35) 72%, transparent 80%) 0 0 / 36px 10px repeat-x;
}
html[data-theme="dark"].nw-fx-lights .nw-lights::before {
	background-image: radial-gradient(ellipse 18px 6px at 50% 0, transparent 70%, rgba(238, 242, 248, .3) 72%, transparent 80%);
}
.nw-lights i {
	position: relative;
	width: 7px; height: 11px; margin-top: 3px;
	border-radius: 50% 50% 45% 45% / 40% 40% 60% 60%;
	background: var(--c, var(--nw-xmas-red));
	box-shadow: 0 0 6px 1px var(--c, var(--nw-xmas-red)), 0 0 14px 2px color-mix(in srgb, var(--c, var(--nw-xmas-red)) 45%, transparent);
}
.nw-lights i::before {
	content: ""; position: absolute; left: 1px; top: -3px; width: 5px; height: 4px; border-radius: 1px;
	background: #5D6678;
}
.nw-lights i:nth-child(4n+1) { --c: var(--nw-xmas-red); }
.nw-lights i:nth-child(4n+2) { --c: var(--nw-xmas-gold); }
.nw-lights i:nth-child(4n+3) { --c: var(--nw-xmas-green); }
.nw-lights i:nth-child(4n+4) { --c: var(--nw-xmas-ice); }
@media (prefers-reduced-motion: no-preference) {
	.nw-lights i { animation: nw-twinkle 2.4s ease-in-out infinite; }
	.nw-lights i:nth-child(3n+1) { animation-delay: -.8s; }
	.nw-lights i:nth-child(3n+2) { animation-delay: -1.6s; }
	.nw-lights i:nth-child(5n) { animation-duration: 3.1s; }
}
@keyframes nw-twinkle {
	0%, 100% { opacity: 1; }
	50% { opacity: .35; box-shadow: 0 0 2px 0 var(--c); }
}
@media (max-width: 760px) {
	.nw-lights i:nth-child(2n) { display: none; }
}
/* Keep the mega menu and switcher above the lights. */
.nw-fx-lights .nw-sub,
.nw-fx-lights .nw-switcher__panel { z-index: 30; }

/* ---------- Snow ---------- */

.nw-snow {
	position: absolute; inset: 0; z-index: 0;
	width: 100%; height: 100%;
	pointer-events: none;
}
/* Content sits above the snow, so flakes never cover text or buttons. */
.nw-snow-host > .nw-container { position: relative; z-index: 1; }

.nw-snow-toggle {
	display: inline-flex; align-items: center; gap: 6px;
	border: 0; background: none; padding: 0; cursor: pointer;
	font: 600 13.5px/1.3 var(--nw-font); color: var(--nw-heading);
}
.nw-snow-toggle .nw-icon { color: var(--nw-xmas-ice); }
.nw-snow-toggle[aria-pressed="false"] .nw-icon { opacity: .45; }

/* In the top bar: styled like the other quick links. */
.nw-snow-toggle--bar { opacity: .85; transition: color .2s, opacity .2s; }
.nw-snow-toggle--bar:hover { opacity: 1; color: var(--nw-accent-text); }

/* Fallback when there is no top bar: a small pill in the corner. */
.nw-snow-toggle--float {
	position: fixed; left: 16px; bottom: 16px; z-index: 90;
	height: 36px; padding: 0 13px 0 11px;
	border: 1px solid var(--nw-border-strong); border-radius: 100px;
	background: var(--nw-surface); box-shadow: var(--nw-shadow-sm);
	font-size: 12.5px; font-weight: 700;
}
@media print { .nw-snow, .nw-snow-toggle, .nw-lights { display: none !important; } }

/* ---------- Light mode: winter-sky tint ----------
   White snow can't show against white. During the season the light theme's
   page background turns a pale icy blue so snow and snow piles stand out.
   Cards stay white. */
html:not([data-theme="dark"]).nw-season {
	--nw-bg: #E9F2FB;
	--nw-surface-2: #F1F7FD;
	--nw-surface-3: #E2EDF8;
}
html:not([data-theme="dark"]).nw-season body {
	background:
		radial-gradient(circle at 15% 0%, rgba(255, 255, 255, .7), transparent 40%),
		linear-gradient(180deg, #EEF5FC 0%, #E6F0FA 100%) fixed;
}
html:not([data-theme="dark"]).nw-season .nw-section--alt { background: #F3F8FD; }
html:not([data-theme="dark"]).nw-season .nw-page-header {
	background:
		radial-gradient(circle at 80% 10%, rgba(255, 255, 255, .85), transparent 45%),
		linear-gradient(180deg, #E1EDF9 0%, #EDF5FC 100%);
}

/* ---------- Snow settled on buttons and cards ---------- */

.nw-fx-caps { --nw-snowcap: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 21' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.6' stop-color='%23fff'/%3E%3Cstop offset='1' stop-color='%23CBDDEE'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M0 14C0 10 4 8 9 8C12 4 20 3 25 6C30 2 40 1 47 5C53 2 62 3 66 7C72 4 82 3 88 6C94 2 105 2 110 6C116 3 126 3 131 7C137 4 147 4 152 7C158 3 168 4 172 8C178 5 188 6 192 9C197 9 200 11 200 14C200 16 198 17 194 17L160 17C157 17 156 20 153 20C150 20 149 17 146 17L72 17C69 17 68 19.5 65.5 19.5C63 19.5 62 17 59 17L6 17C2 17 0 16 0 14Z' fill='url%28%23g%29' stroke='%239FB6CF' stroke-opacity='.8' stroke-width='1' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E"); }
.nw-fx-caps { --nw-snowcap-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 21' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.35' stop-color='%23fff'/%3E%3Cstop offset='1' stop-color='%239FC0E2'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M0 14C0 10 4 8 9 8C12 4 20 3 25 6C30 2 40 1 47 5C53 2 62 3 66 7C72 4 82 3 88 6C94 2 105 2 110 6C116 3 126 3 131 7C137 4 147 4 152 7C158 3 168 4 172 8C178 5 188 6 192 9C197 9 200 11 200 14C200 16 198 17 194 17L160 17C157 17 156 20 153 20C150 20 149 17 146 17L72 17C69 17 68 19.5 65.5 19.5C63 19.5 62 17 59 17L6 17C2 17 0 16 0 14Z' fill='url%28%23g%29' stroke='%236F98C2' stroke-opacity='1' stroke-width='1' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E"); }

/* Give caps a positioning context (cards that are already absolutely
   positioned, like the hero's floating cards, keep their own). */
.nw-fx-caps :is(
	.nw-btn, .nw-theme-toggle, .nw-burger, .nw-card, .nw-plan, .nw-brand-card, .nw-trust__grid,
	.nw-phone, .nw-faq__item, .nw-agent, .nw-editor,
	.nw-account, .nw-rack, .nw-post-card, .nw-widget, .nw-status, .nw-rating, .nw-link-list a
) { position: relative; }

.nw-fx-caps :is(
	.nw-btn, .nw-theme-toggle, .nw-burger, .nw-card, .nw-plan, .nw-brand-card, .nw-trust__grid,
	.nw-phone, .nw-prompt-card, .nw-build-card, .nw-faq__item, .nw-agent, .nw-editor,
	.nw-account, .nw-rack, .nw-post-card, .nw-widget, .nw-status, .nw-rating, .nw-link-list a
)::after {
	content: "";
	position: absolute; z-index: 3;
	left: var(--cap-in, 8px); right: var(--cap-in, 8px);
	top: calc(var(--cap-h, 15px) * -.7);
	height: var(--cap-h, 15px);
	background: var(--nw-snowcap) 0 0 / 100% 100% no-repeat;
	pointer-events: none;
}

/* Smaller caps on buttons and small boxes. */
.nw-fx-caps :is(.nw-btn, .nw-theme-toggle, .nw-burger, .nw-status, .nw-rating, .nw-link-list a, .nw-prompt-card, .nw-build-card) { --cap-h: 10px; --cap-in: 5px; }
.nw-fx-caps .nw-btn--sm { --cap-h: 8px; }
/* Bigger drifts on wide boxes. */
.nw-fx-caps :is(.nw-trust__grid, .nw-phone, .nw-agent, .nw-editor, .nw-account, .nw-rack) { --cap-h: 18px; --cap-in: 14px; }

/* Boxes that clip their contents: let the snow sit just above the edge. */
.nw-fx-caps :is(.nw-brand-card, .nw-trust__grid, .nw-post-card, .nw-agent, .nw-editor, .nw-account) {
	overflow: clip; overflow-clip-margin: 16px;
}

/* Light mode: white snow on white cards needs depth. A blue-grey rim and a
   soft shadow beneath make it read as snow, like snow in daylight. */
html:not([data-theme="dark"]).nw-fx-caps :is(
	.nw-btn, .nw-theme-toggle, .nw-burger, .nw-card, .nw-plan, .nw-brand-card, .nw-trust__grid,
	.nw-phone, .nw-prompt-card, .nw-build-card, .nw-faq__item, .nw-agent, .nw-editor,
	.nw-account, .nw-rack, .nw-post-card, .nw-widget, .nw-status, .nw-rating, .nw-link-list a
)::after {
	background-image: var(--nw-snowcap-light);
	filter: drop-shadow(0 1px 0 rgba(96, 140, 190, .45)) drop-shadow(0 3px 5px rgba(52, 62, 86, .18));
}
/* Light mode: slightly fuller drifts so they're seen at a glance. */
html:not([data-theme="dark"]).nw-fx-caps :is(.nw-card, .nw-plan, .nw-brand-card, .nw-faq__item, .nw-post-card, .nw-widget) { --cap-h: 21px; }
html:not([data-theme="dark"]).nw-fx-caps :is(.nw-btn, .nw-theme-toggle, .nw-burger, .nw-status, .nw-rating, .nw-link-list a) { --cap-h: 13px; }
html:not([data-theme="dark"]).nw-fx-caps :is(.nw-trust__grid, .nw-phone, .nw-agent, .nw-editor, .nw-account, .nw-rack) { --cap-h: 22px; }

/* Keep "Most popular" on top of the snow. */
.nw-fx-caps .nw-plan__flag { z-index: 4; }

/* Buttons that lift on hover take their snow with them; no caps in print. */
@media print { .nw-fx-caps *::after { background: none !important; } }

/* ---------- Festive logo swap ---------- */

.nw-logo__img--season,
.nw-logo__img--season-dark { display: none; }
.nw-season .nw-logo:has(.nw-logo__img--season) > .nw-logo__img--light,
.nw-season .nw-logo:has(.nw-logo__img--season) > .nw-logo__img--dark,
.nw-season .nw-logo:has(.nw-logo__img--season) > .nw-logo__mark,
.nw-season .nw-logo:has(.nw-logo__img--season) > .nw-logo__text { display: none; }
.nw-season .nw-logo__img--season { display: block; }
html[data-theme="dark"].nw-season .nw-logo:has(.nw-logo__img--season-dark) > .nw-logo__img--season { display: none; }
html[data-theme="dark"].nw-season .nw-logo__img--season-dark { display: block; }

/* Text wordmark (no logo uploaded): a small festive touch on the mark. */
.nw-season .nw-logo__mark { position: relative; }
.nw-season .nw-logo__mark::after {
	content: ""; position: absolute; top: -7px; right: -6px;
	width: 18px; height: 14px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 14'%3E%3Cpath d='M2 11C4 5 9 1 15 3l-1 5c-3-1-6 1-8 4z' fill='%23E63946'/%3E%3Crect x='0' y='10' width='10' height='4' rx='2' fill='%23fff'/%3E%3Ccircle cx='15.5' cy='3' r='2.4' fill='%23fff'/%3E%3C/svg%3E") center / contain no-repeat;
	transform: rotate(14deg);
}

/* Phones: icon only in the top bar, like the other quick links. */
@media (max-width: 760px) {
	.nw-snow-toggle--bar span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
}

