/* ── /event/ PARENT HUB — page-owned CSS ───────────────────────────────────────
 * Palette follows Homepage Master 01. Page-local custom properties only:
 * tokens.css, site-shell.css and the global shell are not touched, and no
 * selector here can reach a child campaign page.
 * Mobile first. The two breakpoints match the validated viewports: 834 and 1440.
 * ───────────────────────────────────────────────────────────────────────────── */

.page-event-hub {
	--ev-green: #0b3328;
	--ev-green-deep: #07241c;
	/* #A88959 is the brand gold and stays the colour of rules and non-text
	 * accents. Gold that carries text uses the darkened step, which clears AA
	 * on cream; the lightened step is for gold text on deep green. */
	--ev-gold: #a88959;
	--ev-gold-text: #816945;
	--ev-gold-on-dark: #cbb08a;
	--ev-cream: #f5f1ea;
	--ev-paper: #fbf9f5;
	--ev-ink: #303432;
	--ev-muted: rgba(48, 52, 50, .72);
	--ev-line: rgba(48, 52, 50, .16);
	--ev-line-soft: rgba(48, 52, 50, .1);
	--ev-serif: "Noto Serif KR", var(--brb-font-display, serif);
	--ev-sans: var(--brb-font-body, "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
	--ev-gutter: 1.25rem;

	display: block;
	background: var(--ev-paper);
	color: var(--ev-ink);
	font-family: var(--ev-sans);
	font-size: 1rem;
	line-height: 1.75;
	word-break: keep-all;
	overflow-wrap: anywhere;
	-webkit-font-smoothing: antialiased;
}

.page-event-hub *,
.page-event-hub *::before,
.page-event-hub *::after { box-sizing: border-box; }

.page-event-hub a { color: inherit; text-decoration: none; }
.page-event-hub a:focus-visible { outline: 3px solid var(--ev-green); outline-offset: 3px; }
.page-event-hub :where(ul, ol) { margin: 0; padding: 0; list-style: none; }
.page-event-hub :where(h1, h2, h3, p) { margin: 0; }

/* --- frame --------------------------------------------------------------- */

.page-event-hub .ev-section { padding-block: clamp(3.25rem, 8vw, 6rem); }
.page-event-hub .ev-wrap { width: min(100% - (var(--ev-gutter) * 2), 75rem); margin-inline: auto; }
.page-event-hub .ev-band-cream { background: var(--ev-cream); }

.page-event-hub h1 {
	font-family: var(--ev-serif);
	font-size: clamp(2.125rem, 1.35rem + 3.3vw, 3.5rem);
	font-weight: 600;
	line-height: 1.24;
	letter-spacing: -.03em;
}

.page-event-hub h2 {
	font-family: var(--ev-serif);
	font-size: clamp(1.625rem, 1.2rem + 1.8vw, 2.5rem);
	font-weight: 600;
	line-height: 1.34;
	letter-spacing: -.025em;
}

/* Small label + hairline. The rule is brand gold; the word is the darkened
 * step, because #A88959 as text is only 2.9:1 on this ground. */
.page-event-hub .ev-eyebrow {
	display: flex;
	align-items: center;
	gap: .55rem;
	margin-block-end: .9rem;
	color: var(--ev-gold-text);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .18em;
	line-height: 1.4;
}
.page-event-hub .ev-eyebrow::after {
	content: "";
	flex: 0 0 1.75rem;
	height: 1px;
	background: var(--ev-gold);
}

.page-event-hub .ev-lead {
	max-width: 34em;
	margin-block-start: 1rem;
	color: var(--ev-muted);
	font-size: .9688rem;
	line-height: 1.8;
}

/* --- 01 hub hero — paper, no photograph ---------------------------------- */

.page-event-hub .ev-hero { padding-block: clamp(3.5rem, 9vw, 6.5rem) clamp(3rem, 7vw, 5rem); }
.page-event-hub .ev-hero .ev-lead { margin-block-start: 1.15rem; }

/* --- 02 active seasonal -------------------------------------------------- */

/* The current season as one photographic banner. The photograph is the
 * campaign's own published hero (WordPress Media 9889, 941x1672), reused and
 * never re-cut, and the whole panel is the single link to the campaign. Image
 * and copy never overlap: the frame is 9:16 and mostly bright sky, so the copy
 * stays on paper and needs no scrim at any width. Still no badge, no price,
 * no radius. */
.page-event-hub .ev-season {
	display: grid;
	overflow: hidden;
	border: 1px solid var(--ev-line);
	background: var(--ev-paper);
}
.page-event-hub .ev-season-media {
	aspect-ratio: 5 / 4;
	overflow: hidden;
	background: var(--ev-green);
}
/* 5:4 of a 9:16 frame shows ~45% of its height; 8% keeps the persimmon branch,
 * the full moon and the setting sun in the same view. */
.page-event-hub .ev-season-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 8%;
	transition: transform var(--brb-motion-base, 220ms) var(--brb-motion-easing, ease);
}
.page-event-hub .ev-season:hover .ev-season-media img { transform: scale(1.02); }
.page-event-hub .ev-season-body {
	display: grid;
	gap: .5rem;
	padding: 1.5rem 1.35rem;
}
.page-event-hub .ev-season-name {
	color: var(--ev-gold-text);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .14em;
}
.page-event-hub .ev-season-line {
	font-family: var(--ev-serif);
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: -.025em;
}
.page-event-hub .ev-season-scope { color: var(--ev-muted); font-size: .9063rem; line-height: 1.7; }
.page-event-hub .ev-season-more {
	display: inline-flex;
	align-items: center;
	gap: .3rem;
	justify-self: start;
	margin-block-start: .65rem;
	padding-block-end: .2rem;
	border-block-end: 1px solid var(--ev-line);
	color: var(--ev-green);
	font-size: .9375rem;
	font-weight: 600;
	white-space: nowrap;
}

/* --- 03 current events --------------------------------------------------- */

.page-event-hub .ev-list-head { display: flex; align-items: baseline; gap: .6rem; }
.page-event-hub .ev-list-count { color: var(--ev-gold-text); font-size: .75rem; font-weight: 600; letter-spacing: .1em; }

/* Script-free filtering. Each tab targets an empty anchor placed before the
 * rail; `:target` sibling rules then set the active tab and hide the rows that
 * do not carry the category class. Pattern taken from the approved
 * /brb/lasers/ hub. */
.page-event-hub .ev-anchor { display: block; height: 0; visibility: hidden; scroll-margin-block-start: 6rem; }

/* One horizontal row at 390. The rail bleeds to both viewport edges but its
 * first chip starts on the wrap line, so the inline padding tracks the wrap
 * rather than the viewport — and scroll padding has to match it or the first
 * chip snaps flush to the edge. From 834 there is room for every chip, so the
 * rail stops scrolling and wraps instead; nothing is ever clipped. */
.page-event-hub .ev-tabs {
	display: flex;
	gap: .375rem;
	margin-block-start: 1.75rem;
	margin-inline: calc(var(--ev-gutter) * -1);
	padding-inline: var(--ev-gutter);
	scroll-padding-inline: var(--ev-gutter);
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.page-event-hub .ev-tabs::-webkit-scrollbar { display: none; }

.page-event-hub .ev-tab {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: baseline;
	gap: .35rem;
	min-height: 44px;
	padding: .6rem .85rem;
	border: 1px solid var(--ev-line);
	background: var(--ev-paper);
	color: var(--ev-ink);
	font-size: .8125rem;
	font-weight: 500;
	white-space: nowrap;
	scroll-snap-align: start;
}
.page-event-hub .ev-tab > span { color: var(--ev-gold-text); font-size: .6875rem; font-weight: 600; }

/* default state: 전체 */
.page-event-hub .ev-t-all { border-color: var(--ev-green); background: var(--ev-green); color: var(--ev-cream); }
.page-event-hub .ev-t-all > span { color: var(--ev-gold-on-dark); }
/* any category targeted releases 전체 … */
.page-event-hub .ev-anchor:target ~ .ev-tabs .ev-t-all { border-color: var(--ev-line); background: var(--ev-paper); color: var(--ev-ink); }
.page-event-hub .ev-anchor:target ~ .ev-tabs .ev-t-all > span { color: var(--ev-gold-text); }
/* … and the id rules outrank that, so the targeted chip turns on */
.page-event-hub #ev-all:target ~ .ev-tabs .ev-t-all,
.page-event-hub #ev-lifting:target ~ .ev-tabs .ev-t-lifting,
.page-event-hub #ev-booster:target ~ .ev-tabs .ev-t-booster,
.page-event-hub #ev-botox:target ~ .ev-tabs .ev-t-botox,
.page-event-hub #ev-pigment:target ~ .ev-tabs .ev-t-pigment,
.page-event-hub #ev-acne:target ~ .ev-tabs .ev-t-acne,
.page-event-hub #ev-scarpore:target ~ .ev-tabs .ev-t-scarpore { border-color: var(--ev-green); background: var(--ev-green); color: var(--ev-cream); }
.page-event-hub #ev-all:target ~ .ev-tabs .ev-t-all > span,
.page-event-hub #ev-lifting:target ~ .ev-tabs .ev-t-lifting > span,
.page-event-hub #ev-booster:target ~ .ev-tabs .ev-t-booster > span,
.page-event-hub #ev-botox:target ~ .ev-tabs .ev-t-botox > span,
.page-event-hub #ev-pigment:target ~ .ev-tabs .ev-t-pigment > span,
.page-event-hub #ev-acne:target ~ .ev-tabs .ev-t-acne > span,
.page-event-hub #ev-scarpore:target ~ .ev-tabs .ev-t-scarpore > span { color: var(--ev-gold-on-dark); }

/* filtering */
.page-event-hub #ev-lifting:target ~ .ev-list > li:not(.ev-c-lifting),
.page-event-hub #ev-booster:target ~ .ev-list > li:not(.ev-c-booster),
.page-event-hub #ev-botox:target ~ .ev-list > li:not(.ev-c-botox),
.page-event-hub #ev-pigment:target ~ .ev-list > li:not(.ev-c-pigment),
.page-event-hub #ev-acne:target ~ .ev-list > li:not(.ev-c-acne),
.page-event-hub #ev-scarpore:target ~ .ev-list > li:not(.ev-c-scarpore) { display: none; }

/* Editorial index, the Homepage Master list rhythm: a rule above the set, a
 * rule under every row, the ordinal in gold, the arrow at the end. Rows hidden
 * by the filter generate no box, so the counter renumbers 01…n by itself. */
.page-event-hub .ev-list {
	margin-block-start: 1.75rem;
	border-block-start: 1px solid var(--ev-ink);
	counter-reset: ev-row;
}
.page-event-hub .ev-list > li { counter-increment: ev-row; border-block-end: 1px solid var(--ev-line); }

/* 390: ordinal and arrow flank a two-row stack — 제목 위, 고민 아래. */
.page-event-hub .ev-card {
	display: grid;
	grid-template-columns: 2.75rem minmax(0, 1fr) 1.25rem;
	column-gap: .75rem;
	row-gap: .22rem;
	align-items: start;
	min-height: 5.25rem;
	padding-block: 1.15rem;
}
.page-event-hub .ev-card::before {
	content: counter(ev-row, decimal-leading-zero);
	grid-column: 1;
	grid-row: 1 / span 2;
	padding-block-start: .3rem;
	color: var(--ev-gold-text);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .1em;
}
.page-event-hub .ev-card-title { grid-column: 2; grid-row: 1; display: grid; gap: .22rem; }
.page-event-hub .ev-card-cat { color: var(--ev-muted); font-size: .75rem; letter-spacing: .04em; }
.page-event-hub .ev-card-title strong { font-family: var(--ev-serif); font-size: 1.0938rem; font-weight: 600; line-height: 1.45; }
.page-event-hub .ev-card-concern { grid-column: 2; grid-row: 2; color: var(--ev-muted); font-size: .8438rem; line-height: 1.65; }
.page-event-hub .ev-card-arrow { grid-column: 3; grid-row: 1 / span 2; align-self: center; color: var(--ev-green); font-size: 1rem; text-align: end; }

/* --- 05 event guide ------------------------------------------------------ */

.page-event-hub .ev-guide-list { margin-block-start: 1.75rem; border-block-start: 1px solid var(--ev-ink); }
.page-event-hub .ev-guide-list > li {
	display: grid;
	gap: .3rem;
	padding-block: 1.35rem;
	border-block-end: 1px solid var(--ev-line);
}
.page-event-hub .ev-guide-list strong { font-family: var(--ev-serif); font-size: 1.0625rem; font-weight: 600; line-height: 1.5; }
.page-event-hub .ev-guide-list span { color: var(--ev-muted); font-size: .9063rem; line-height: 1.75; }

/* --- 06 general CTA ------------------------------------------------------ */

.page-event-hub .ev-finale { background: var(--ev-green); color: var(--ev-cream); text-align: center; }
.page-event-hub .ev-finale h2 { color: #fff; }
.page-event-hub .ev-finale .ev-eyebrow { justify-content: center; color: var(--ev-gold-on-dark); }
.page-event-hub .ev-finale .ev-eyebrow::after { background: var(--ev-gold-on-dark); }
.page-event-hub .ev-finale .ev-lead { margin-inline: auto; color: rgba(245, 241, 234, .78); }
.page-event-hub .ev-finale-note { margin-block-start: 1.5rem; color: rgba(245, 241, 234, .7); font-size: .875rem; }
.page-event-hub .ev-finale-note a { color: var(--ev-cream); font-weight: 600; border-block-end: 1px solid rgba(245, 241, 234, .4); }
.page-event-hub .ev-finale a:focus-visible { outline-color: var(--ev-cream); }

/* --- 834 ----------------------------------------------------------------- */

@media (min-width: 52.125rem) {
	.page-event-hub { --ev-gutter: 2rem; }

	/* Hero: the same four elements. Only the measure is held, so the display
	 * line does not run the full tablet width. */
	.page-event-hub .ev-hero h1 { max-width: 12em; }

	/* Seasonal: the photograph beside the entry, still one panel and one link.
	 * A square frame keeps the moon, the branch and the sunset in view without
	 * enlarging the 941 px source. */
	.page-event-hub .ev-season { grid-template-columns: minmax(0, 20rem) minmax(0, 1fr); }
	.page-event-hub .ev-season-media { aspect-ratio: 1 / 1; }
	.page-event-hub .ev-season-media img { object-position: 50% 10%; }
	.page-event-hub .ev-season-body { align-content: center; padding: 2.25rem 2.5rem; }
	.page-event-hub .ev-season-line { max-width: 16em; font-size: 1.875rem; }
	.page-event-hub .ev-season-scope { max-width: 34em; }

	/* Filter: every chip fits, so the rail stops being a scrollport. */
	.page-event-hub .ev-tabs {
		flex-wrap: wrap;
		gap: .5rem;
		margin-inline: 0;
		padding-inline: 0;
		overflow-x: visible;
		scroll-snap-type: none;
	}
	.page-event-hub .ev-tab { padding: .6rem .95rem; font-size: .8438rem; }

	/* The ROW becomes columnar — 번호 | 제목 | 고민 | 화살표. This is the
	 * Homepage Master signature-list move at the same breakpoint. It stays one
	 * editorial row per event; it never becomes a wall of boxes. */
	.page-event-hub .ev-card {
		grid-template-columns: 4rem 17rem minmax(0, 1fr) 2rem;
		column-gap: 1.75rem;
		align-items: center;
		min-height: 5rem;
		padding-block: 1.3rem;
	}
	.page-event-hub .ev-card::before { grid-row: 1; padding-block-start: 0; }
	.page-event-hub .ev-card-title { grid-column: 2; grid-row: 1; }
	.page-event-hub .ev-card-concern { grid-column: 3; grid-row: 1; }
	.page-event-hub .ev-card-arrow { grid-column: 4; grid-row: 1; }

	/* Guide: term column, description column. */
	.page-event-hub .ev-guide-list > li {
		grid-template-columns: 20rem minmax(0, 1fr);
		column-gap: 2.5rem;
		align-items: baseline;
	}

}

/* --- 1440 ---------------------------------------------------------------- */

@media (min-width: 90rem) {
	/* Hero: the same four elements in two columns rather than one tall stack
	 * against 1200px of empty paper. Nothing is added. */
	.page-event-hub .ev-hero .ev-wrap {
		display: grid;
		grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
		column-gap: 4.5rem;
		align-items: end;
	}
	.page-event-hub .ev-hero .ev-eyebrow { grid-column: 1; grid-row: 1; }
	.page-event-hub .ev-hero h1 { grid-column: 1; grid-row: 2; max-width: 9em; }
	.page-event-hub .ev-hero .ev-lead { grid-column: 2; grid-row: 2; margin-block-start: 0; }

	.page-event-hub .ev-season { grid-template-columns: minmax(0, 28rem) minmax(0, 1fr); }
	.page-event-hub .ev-season-body { padding: 3rem 4rem; }
	.page-event-hub .ev-season-line { font-size: 2.25rem; }

	.page-event-hub .ev-card { grid-template-columns: 4.5rem 22rem minmax(0, 1fr) 2rem; column-gap: 2.5rem; }

	.page-event-hub .ev-guide-list > li { grid-template-columns: 24rem minmax(0, 1fr); column-gap: 3rem; }

	.page-event-hub .ev-finale h2 { max-width: 16em; margin-inline: auto; }
}

@media (prefers-reduced-motion: reduce) {
	.page-event-hub .ev-tabs { scroll-snap-type: none; }
	.page-event-hub * { transition: none !important; }
	.page-event-hub .ev-season:hover .ev-season-media img { transform: none; }
}

/* Event hero only. Existing page styles and real device photograph preserved. */
.page-event-hub .ev-noir {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  color: #f5f1ea;
  background: #141715;
  border: 1px solid #5d594b;
  text-decoration: none;
  overflow: hidden;
}
.page-event-hub .ev-noir-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-width: 0;
  padding: 2.1rem 1.5rem 2rem;
  background: radial-gradient(ellipse at 0 0, #30352e 0, #141715 75%);
}
.page-event-hub .ev-noir-label {
  margin: 0 0 1.5rem;
  color: #d7c49e;
  font-size: .625rem;
  font-weight: 600;
  line-height: 1.7;
  letter-spacing: .12em;
}
.page-event-hub .ev-noir h2 {
  margin: 0;
  color: #f5f1ea;
  font-family: var(--ev-serif);
  font-size: clamp(1.5rem, 6.4vw, 2rem);
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: -.045em;
  word-break: keep-all;
  overflow-wrap: break-word;
}
.page-event-hub .ev-noir h2 span { display: block; }
.page-event-hub .ev-noir-description {
  margin: 1.1rem 0 0;
  color: #e1dbd0;
  font-size: .8125rem;
  line-height: 1.8;
  word-break: keep-all;
}
.page-event-hub .ev-noir-secondary {
  margin: 1rem 0 0;
  padding-left: .8rem;
  border-left: 1px solid #d7c49e;
  color: #d7c49e;
  font-size: .8125rem;
  line-height: 1.5;
  letter-spacing: .035em;
}
.page-event-hub .ev-noir-cta {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 2.2rem;
  min-height: 44px;
  margin-top: 1.6rem;
  border-bottom: 1px solid #9e947e;
  color: #f5f1ea;
  font-size: .875rem;
  font-weight: 600;
}
.page-event-hub .ev-noir-cta span { color: #d7c49e; font-size: 1.25rem; }
.page-event-hub .ev-noir-media { min-width: 0; background: #a09186; aspect-ratio: 1 / 1; }
.page-event-hub .ev-noir-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.page-event-hub .ev-noir:hover .ev-noir-cta { border-color: #d7c49e; }
.page-event-hub .ev-noir:focus-visible { outline: 3px solid #866633; outline-offset: 5px; }
@media (min-width: 52.125rem) {
  .page-event-hub .ev-noir { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .page-event-hub .ev-noir-copy { padding: 2.5rem; }
  .page-event-hub .ev-noir-label { font-size: .6875rem; }
  .page-event-hub .ev-noir h2 { font-size: clamp(1.75rem, 3vw, 2.75rem); }
  .page-event-hub .ev-noir-description { font-size: .90625rem; }
  .page-event-hub .ev-noir-secondary { font-size: .875rem; }
  .page-event-hub .ev-noir-media { aspect-ratio: auto; }
}
@media (min-width: 75rem) {
  .page-event-hub .ev-noir { min-height: 35rem; }
  .page-event-hub .ev-noir-copy { padding: 3rem 3.5rem; }
  .page-event-hub .ev-noir-label { margin-bottom: 2.2rem; }
  .page-event-hub .ev-noir-cta { margin-top: 2.2rem; }
}

/* DENSITY NOIR CAMPAIGN R7 */
/* Only the existing Density Noir campaign banner is replaced. */
.page-event-hub .nb-card{position:relative;isolation:isolate;display:flex;align-items:center;min-height:500px;overflow:hidden;background:#0b0a09;color:#efe7da;text-decoration:none;border:1px solid #2a2520}
.page-event-hub .nb-stage{position:absolute;inset:0;z-index:-1;background:#0b0a09;overflow:hidden}
.page-event-hub .nb-scene{position:absolute;top:-118px;right:-24px;display:block;width:auto;max-width:none;height:625px;aspect-ratio:1/1;object-fit:cover;-webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,#000 30%);mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,#000 30%)}
.page-event-hub .nb-stage::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,9,8,.92) 0%,rgba(10,9,8,.62) 36%,rgba(10,9,8,0) 60%),linear-gradient(0deg,rgba(11,10,9,.9) 0%,rgba(11,10,9,0) 30%)}
.page-event-hub .nb-copy{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;min-width:0;max-width:600px;padding:64px 56px}
.page-event-hub .nb-eyebrow,.page-event-hub .nb-lead,.page-event-hub .nb-tips{margin:0}
.page-event-hub .nb-eyebrow{font-size:11px;line-height:1.8;letter-spacing:.24em;font-weight:600;color:#d3b88b}
.page-event-hub .nb-card h2{font-family:var(--ev-serif);font-size:clamp(34px,3.6vw,52px);font-weight:500;line-height:1.36;letter-spacing:-.055em;color:#f5eee2;margin:26px 0 0;word-break:keep-all;overflow-wrap:break-word}
.page-event-hub .nb-lead{font-size:17px;line-height:1.8;color:#dcc9a8;margin-top:22px}
.page-event-hub .nb-tips{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:20px}
.page-event-hub .nb-tips span{font-size:11px;line-height:1.6;letter-spacing:.16em;font-weight:600;color:#cdb991}
.page-event-hub .nb-tips span+span{padding-left:14px;border-left:1px solid rgba(214,186,140,.4)}
.page-event-hub .nb-cta{display:inline-flex;align-items:center;gap:28px;min-height:48px;margin-top:30px;padding:0 24px;background:#e4d0ad;color:#15130f;font-size:14px;font-weight:600}
.page-event-hub .nb-cta span{font-size:18px}
.page-event-hub .nb-card:hover .nb-cta{background:#f1e2c6}
.page-event-hub .nb-card:focus-visible{outline:3px solid #9e783f;outline-offset:5px}
@media(prefers-reduced-motion:reduce){.page-event-hub .nb-mood{display:none}}
@media(max-width:900px){.page-event-hub .nb-copy{padding:48px 32px;max-width:420px}.page-event-hub .nb-scene{right:-60px;height:575px;top:-108px}.page-event-hub .nb-card{min-height:460px}}
@media(max-width:640px){.page-event-hub .nb-card{flex-direction:column;align-items:stretch;min-height:0}.page-event-hub .nb-stage{position:relative;inset:auto;z-index:0;height:400px}.page-event-hub .nb-scene{top:-132px;right:auto;left:calc(50% - 494px);width:670px;height:670px;-webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,#000 12%,#000 88%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,#000 12%,#000 88%,rgba(0,0,0,0) 100%)}.page-event-hub .nb-stage::after{background:linear-gradient(180deg,rgba(11,10,9,0) 56%,#0b0a09 96%)}.page-event-hub .nb-copy{max-width:none;margin-top:-20px;padding:0 24px 30px}.page-event-hub .nb-eyebrow{font-size:9px;letter-spacing:.2em}.page-event-hub .nb-card h2{font-size:30px;line-height:1.42;margin-top:16px}.page-event-hub .nb-lead{font-size:15px;margin-top:14px}.page-event-hub .nb-tips{margin-top:14px}.page-event-hub .nb-tips span{font-size:10px}.page-event-hub .nb-cta{margin-top:22px;width:100%;justify-content:space-between}}
@media(max-width:359px){.page-event-hub .nb-stage{height:350px}.page-event-hub .nb-scene{top:-112px;left:calc(50% - 428px);width:580px;height:580px}.page-event-hub .nb-copy{padding:0 20px 26px}.page-event-hub .nb-card h2{font-size:27px}}