/**
 * CUHK AAO Frontend Styles
 *
 * Supplementary styles that extend theme.json design tokens.
 * Block-specific styles live in each block's style.css.
 * Keep minimal — prefer theme.json for all block-level styling.
 *
 * Site font rules:
 *   - Abhaya Libre for headers/sub-headers with font-size >= 20px
 *   - Open Sans for text < 20px
 *   - Text placed on images: 20px, font-weight 600 (semibold), Abhaya Libre
 */

/* Smooth scroll */
html {
	scroll-behavior: smooth;
	background: #fff;
}

/* Site font defaults (override theme.json fallbacks for non-block templates) */
body {
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Noto Sans TC', 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Abhaya Libre', Georgia, 'Noto Serif', 'Noto Serif TC', 'Noto Serif SC', 'Times New Roman', serif;
}

/* Cap site width on ultra-wide displays */
body {
	max-width: 2240px;
	margin: 0 auto;
	position: relative;
}

/* =========================================
   Transparent Header Overlay
   ========================================= */

.cuhk-site-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 100;
	background: transparent;
	transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

/* Scrolled state — white background with dark text/icons.
   Mirrors the .mega-menu-open style. JS toggles .is-scrolled on
   window.scroll when there is a dark hero behind the header. */
.cuhk-site-header.is-scrolled {
	background: #fff;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.cuhk-site-header.is-scrolled .cuhk-primary-nav ul li a {
	color: #1A1A1A;
}

.cuhk-site-header.is-scrolled .cuhk-primary-nav ul li a:hover {
	opacity: 1;
	color: var(--wp--preset--color--primary, #6B2D7B);
}

.cuhk-site-header.is-scrolled .cuhk-header-search-icon,
.cuhk-site-header.is-scrolled .cuhk-header-search-icon:hover,
.cuhk-site-header.is-scrolled .cuhk-lang-switcher__toggle {
	color: #1A1A1A;
}

.cuhk-site-header.is-scrolled .cuhk-header-logo--desktop {
	display: none !important;
}

.cuhk-site-header.is-scrolled .cuhk-header-logo--mobile {
	display: block !important;
	width: auto !important;
}

.cuhk-site-header.is-scrolled .cuhk-header-logo--mobile img {
	width: 220px !important;
}

/* No-hero detail pages use a white header from first paint so nav text is
   legible and the breadcrumb starts directly below the logo/header row. */
body.single-event .cuhk-site-header,
body.single-alumni-story .cuhk-site-header,
body.search .cuhk-site-header {
	background: #fff;
	box-shadow: none;
}

body.single-event .cuhk-site-header .cuhk-primary-nav ul li a,
body.single-alumni-story .cuhk-site-header .cuhk-primary-nav ul li a,
body.search .cuhk-site-header .cuhk-primary-nav ul li a {
	color: #1A1A1A;
}

body.single-event .cuhk-site-header .cuhk-primary-nav ul li a:hover,
body.single-alumni-story .cuhk-site-header .cuhk-primary-nav ul li a:hover,
body.search .cuhk-site-header .cuhk-primary-nav ul li a:hover {
	opacity: 1;
	color: var(--wp--preset--color--primary, #6B2D7B);
}

body.single-event .cuhk-site-header .cuhk-header-search-icon,
body.single-event .cuhk-site-header .cuhk-header-search-icon:hover,
body.single-event .cuhk-site-header .cuhk-lang-switcher__toggle,
body.single-alumni-story .cuhk-site-header .cuhk-header-search-icon,
body.single-alumni-story .cuhk-site-header .cuhk-header-search-icon:hover,
body.single-alumni-story .cuhk-site-header .cuhk-lang-switcher__toggle,
body.search .cuhk-site-header .cuhk-header-search-icon,
body.search .cuhk-site-header .cuhk-header-search-icon:hover,
body.search .cuhk-site-header .cuhk-lang-switcher__toggle {
	color: #1A1A1A;
}

body.single-event .cuhk-site-header .cuhk-header-logo--desktop,
body.single-alumni-story .cuhk-site-header .cuhk-header-logo--desktop,
body.search .cuhk-site-header .cuhk-header-logo--desktop {
	display: none !important;
}

body.single-event .cuhk-site-header .cuhk-header-logo--mobile,
body.single-alumni-story .cuhk-site-header .cuhk-header-logo--mobile,
body.search .cuhk-site-header .cuhk-header-logo--mobile {
	display: block !important;
	width: auto !important;
}

body.single-event .cuhk-site-header .cuhk-header-logo--mobile img,
body.single-alumni-story .cuhk-site-header .cuhk-header-logo--mobile img,
body.search .cuhk-site-header .cuhk-header-logo--mobile img {
	width: 220px !important;
}

/* Keep header nav above the mega menu overlay */
.cuhk-site-header__inner {
	position: relative;
	z-index: 101;
}

/* Offset header below WP admin bar when logged in */
.admin-bar .cuhk-site-header {
	top: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar .cuhk-site-header {
		top: 0;
	}

	/* WP sets #wpadminbar to position:absolute on mobile, which combined with
	   body { position: relative } anchors it to body's top — 46px below the
	   viewport because of html { margin-top: 46px }. Force it back to fixed
	   so the bar sits flush at the viewport top. */
	#wpadminbar {
		position: fixed;
	}
}

/* Logo in header */
.cuhk-header-logo {
	margin: 0;
}

.cuhk-header-logo img {
	display: block;
	height: auto;
}

/* On desktop --desktop carries the white logo (transparent header over the
   hero) and --mobile the purple one, shown once the header turns solid.
   On mobile widths --mobile (purple) is used throughout. */
.cuhk-header-logo--mobile {
	display: none !important;
}

/* Header actions (search + lang switcher) */
.cuhk-header-actions {
	gap: 8px;
	margin-left: 32px;
}

/* Search icon in header */
.cuhk-header-search-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	padding: 6px;
	text-decoration: none;
	transition: opacity 0.15s ease;
}

.cuhk-header-search-icon:hover {
	opacity: 0.8;
	color: #fff;
}

.cuhk-header-search-icon {
	background: transparent;
	border: 0;
	cursor: pointer;
	font: inherit;
}

.cuhk-header-search-form {
	display: none;
	align-items: center;
	gap: 10px;
	flex: 1;
	margin: 0 32px;
	padding: 4px 14px;
	background: #fff;
	border: 1px solid #d9d9d9;
	border-radius: 999px;
	min-width: 0;
}

.cuhk-header-search-form__icon {
	flex-shrink: 0;
	color: #999;
}

.cuhk-header-search-form__input {
	flex: 1;
	min-width: 0;
	border: 0;
	outline: 0;
	background: transparent;
	font: inherit;
	font-size: 14px;
	line-height: 1.4;
	color: #1A1A1A;
	padding: 0;
}

.cuhk-header-search-form__input::placeholder {
	color: #999;
}

/* Suppress Chrome's light-blue autofill/autocomplete background on search inputs. */
.cuhk-header-search-form__input:-webkit-autofill,
.cuhk-header-search-form__input:-webkit-autofill:hover,
.cuhk-header-search-form__input:-webkit-autofill:focus,
.cuhk-search-bar__input:-webkit-autofill,
.cuhk-search-bar__input:-webkit-autofill:hover,
.cuhk-search-bar__input:-webkit-autofill:focus {
	-webkit-box-shadow: 0 0 0 1000px #fff inset;
	box-shadow: 0 0 0 1000px #fff inset;
	-webkit-text-fill-color: var(--wp--preset--color--text-primary);
}

.cuhk-header-search-form__close {
	display: none;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: 0;
	padding: 4px;
	cursor: pointer;
	color: #1A1A1A;
	font: inherit;
}

.cuhk-header-search-backdrop {
	display: none;
}

.cuhk-site-header.is-search-open {
	background: #fff !important;
}

.cuhk-site-header.is-search-open .cuhk-site-header__nav {
	flex: 1;
	margin-left: 32px;
	min-width: 0;
}

.cuhk-site-header.is-search-open .cuhk-primary-nav,
.cuhk-site-header.is-search-open .cuhk-header-search-icon {
	display: none !important;
}

.cuhk-site-header.is-search-open .cuhk-header-search-form {
	display: flex;
}

.cuhk-site-header.is-search-open .cuhk-header-logo--desktop {
	display: none !important;
}

.cuhk-site-header.is-search-open .cuhk-header-logo--mobile {
	display: block !important;
	width: auto !important;
}

.cuhk-site-header.is-search-open .cuhk-header-logo--mobile img {
	width: 220px !important;
}

.cuhk-site-header.is-search-open .cuhk-lang-switcher__toggle {
	color: #1A1A1A;
}

/* Navigation links — white text */
.cuhk-site-header .wp-block-navigation a {
	color: #fff !important;
}

/* Classic theme primary nav (wp_nav_menu output) */
.cuhk-primary-nav {
	display: flex;
	align-items: center;
}

.cuhk-primary-nav ul {
	display: flex;
	align-items: center;
	gap: 32px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.cuhk-primary-nav ul li {
	margin: 0;
	padding: 0;
}

.cuhk-primary-nav ul li a {
	color: #fff;
	text-decoration: none;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	white-space: nowrap;
	transition: opacity 0.15s ease;
}

.cuhk-primary-nav ul li a:hover {
	opacity: 0.8;
}

/* Chinese nav labels read slightly larger than the English 13px for legibility. */
.cuhkml-lang-zh-hk .cuhk-primary-nav ul li a,
.cuhkml-lang-zh-cn .cuhk-primary-nav ul li a {
	font-size: 15px;
}

/* Header state when mega menu is open */
.cuhk-site-header.mega-menu-open {
	background: #fff !important;
}

.cuhk-site-header.mega-menu-open .cuhk-primary-nav ul li a {
	color: #1A1A1A;
}

.cuhk-site-header.mega-menu-open .cuhk-primary-nav ul li a:hover {
	opacity: 1;
	color: var(--wp--preset--color--primary, #6B2D7B);
}

.cuhk-site-header.mega-menu-open .mega-menu-trigger--active > a {
	color: var(--wp--preset--color--primary, #6B2D7B) !important;
}

.cuhk-site-header.mega-menu-open .cuhk-header-logo--desktop {
	display: none !important;
}

.cuhk-site-header.mega-menu-open .cuhk-header-logo--mobile {
	display: block !important;
	width: auto !important;
}

.cuhk-site-header.mega-menu-open .cuhk-header-logo--mobile img {
	width: 220px !important;
}

/* Desktop logo scale — 30% up from the 220px base. Scoped to desktop widths and
   placed after the state rules above (is-scrolled / no-hero / search / mega
   menu) so it wins on source order; mobile keeps its own 240px sizing. */
@media (min-width: 782px) {
	.cuhk-site-header.is-scrolled .cuhk-header-logo--mobile img,
	.cuhk-site-header.is-search-open .cuhk-header-logo--mobile img,
	.cuhk-site-header.mega-menu-open .cuhk-header-logo--mobile img,
	body.single-event .cuhk-site-header .cuhk-header-logo--mobile img,
	body.single-alumni-story .cuhk-site-header .cuhk-header-logo--mobile img,
	body.search .cuhk-site-header .cuhk-header-logo--mobile img {
		width: 286px !important;
	}
}

.cuhk-site-header.mega-menu-open .cuhk-header-search-icon {
	color: #1A1A1A;
}

.cuhk-site-header.mega-menu-open .cuhk-header-search-icon:hover {
	color: #1A1A1A;
}

.cuhk-site-header.mega-menu-open .cuhk-lang-switcher__toggle {
	color: #1A1A1A;
}

/* =========================================
   Mega Menu
   ========================================= */

/* Mega menu containers — hidden by default */
.cuhk-mega-menu {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 99;
	pointer-events: none;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.25s ease, visibility 0.25s ease;
}

.cuhk-mega-menu.is-open {
	pointer-events: auto;
	opacity: 1;
	visibility: visible;
}

/* Backdrop overlay */
.cuhk-mega-menu__backdrop {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.3);
}

/* The dropdown panel — full white background from top of viewport,
   with padding-top to push content below the header bar. The white
   background covers the header area so they appear as one surface. */
.cuhk-mega-menu__panel {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	padding-top: 53px;
	background: #fff;
	z-index: 1;
}

.admin-bar .cuhk-mega-menu__panel {
	padding-top: 85px;
}

.cuhk-mega-menu__inner {
	max-width: 1400px;
	margin: 0 auto;
	padding: 40px;
	display: flex;
	gap: 48px;
	border-bottom: 1px solid #e0e0e0;
}

/* Sidebar navigation */
.cuhk-mega-menu__sidebar {
	flex-shrink: 0;
	width: 180px;
}

.cuhk-mega-menu__sidebar ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cuhk-mega-menu__sidebar li {
	margin: 0;
	padding: 0;
}

.cuhk-mega-menu__sidebar a {
	display: block;
	padding: 12px 16px;
	color: #1A1A1A;
	text-decoration: none;
	font-size: 14px;
	font-weight: 500;
	border-left: 3px solid transparent;
	transition: border-color 0.15s ease, color 0.15s ease;
}

.cuhk-mega-menu__sidebar a:hover,
.cuhk-mega-menu__sidebar a:focus {
	border-left-color: var(--wp--preset--color--primary, #6B2D7B);
	color: var(--wp--preset--color--primary, #6B2D7B);
}

/* Content area */
.cuhk-mega-menu__content {
	flex: 1;
	min-width: 0;
}

/* Section heading */
.cuhk-mega-menu__heading {
	font-family: 'Abhaya Libre', Georgia, serif;
	font-size: 22px;
	font-weight: 400;
	color: #1A1A1A;
	margin: 0 0 24px 0;
}

/* 2x2 card grid */
.cuhk-mega-menu__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

.cuhk-mega-menu__card {
	display: flex;
	gap: 16px;
	text-decoration: none;
	color: inherit;
	transition: opacity 0.15s ease;
}

.cuhk-mega-menu__card:hover {
	opacity: 0.8;
}

.cuhk-mega-menu__card-image {
	flex-shrink: 0;
	width: 80px;
	height: 80px;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: 4px;
}

.cuhk-mega-menu__card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.cuhk-mega-menu__card-body {
	flex: 1;
	min-width: 0;
}

.cuhk-mega-menu__card-title {
	font-size: 14px;
	font-weight: 600;
	color: #1A1A1A;
	margin: 0 0 4px 0;
	line-height: 1.3;
}

.cuhk-mega-menu__card-excerpt {
	font-size: 12px;
	color: #666;
	margin: 0;
	line-height: 1.5;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* View All button */
.cuhk-mega-menu__view-all {
	margin-top: 24px;
	text-align: right;
}

.cuhk-mega-menu__view-all-btn {
	display: inline-block;
	padding: 8px 24px;
	border: 1px solid #1A1A1A;
	color: #1A1A1A;
	text-decoration: none;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.02em;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.cuhk-mega-menu__view-all-btn:hover {
	background: #1A1A1A;
	color: #fff;
}

/* Hide mega menus on mobile */
@media screen and (max-width: 781px) {
	.cuhk-mega-menu {
		display: none !important;
	}
}

/* Navigation hover effects */
.wp-block-navigation a:hover {
	opacity: 0.85;
}

/* Card hover lift effect for query loop cards (not inspire cards) */
.wp-block-query .wp-block-group:has(.wp-block-post-featured-image):not(.cuhk-inspire-card) {
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.wp-block-query .wp-block-group:has(.wp-block-post-featured-image):not(.cuhk-inspire-card):hover {
	transform: translateY(-2px);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

/* Post title link styles in cards */
.wp-block-post-title a {
	text-decoration: none;
}

.wp-block-post-title a:hover {
	color: var(--wp--preset--color--primary);
}

/* Language switcher — styles now in blocks/language-switcher/style.css */

/* =========================================
   Homepage: Stay Connected
   ========================================= */

.cuhk-stay-connected {
	position: relative;
	overflow: hidden;
	min-height: 500px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
}

.cuhk-stay-connected__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}

.cuhk-stay-connected__overlay {
	position: absolute;
	inset: 0;
	background: rgba(255, 255, 255, 0.6);
	z-index: 1;
}

.cuhk-stay-connected__content {
	position: relative;
	z-index: 2;
	max-width: 800px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 64px;
	gap: 24px;
	text-align: center;
}

.cuhk-stay-connected__heading {
	font-family: 'Abhaya Libre', serif;
	font-size: 52px;
	color: #58387A;
	line-height: 1.16;
	margin: 0;
}

.cuhk-stay-connected__desc {
	color: #291c2f;
	font-size: 18px;
	letter-spacing: 0.28px;
	line-height: 1.75;
	margin: 0;
	max-width: 640px;
}

.cuhk-stay-connected__link {
	display: inline-block;
	border: 1px solid #291c2f;
	color: #291c2f;
	background: transparent;
	padding: 16px 48px;
	font-size: 20px;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 400;
	text-decoration: none;
	transition: background 0.2s ease, color 0.2s ease;
}

.cuhk-stay-connected__link:hover {
	background: #291c2f;
	color: #fff;
}

/* =========================================
   Homepage: Inspire Cards (More From CUHK)
   ========================================= */

.cuhk-inspire-heading {
	font-family: 'Abhaya Libre', serif;
	color: #291c2f;
	line-height: 1.16;
}

.cuhk-inspire-carousel {
	position: relative;
}

.cuhk-inspire-card {
	overflow: hidden;
	background: transparent !important;
	gap: 0 !important;
}

.cuhk-inspire-card.is-layout-flow > * + * {
	margin-block-start: 0 !important;
}

.cuhk-inspire-card__image,
.cuhk-inspire-card .wp-block-post-featured-image {
	margin: 0 0 20px;
}

.cuhk-inspire-card__image img,
.cuhk-inspire-card .wp-block-post-featured-image img {
	width: 100%;
	aspect-ratio: 684 / 385;
	object-fit: cover;
	display: block;
}

.cuhk-inspire-card .wp-block-post-title {
	font-family: 'Abhaya Libre', Georgia, serif;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.4px;
	color: #291c2f;
	margin: 20px 0 0 !important;
}

.cuhk-inspire-card .wp-block-post-title a {
	color: #291c2f;
	text-decoration: none;
}

.cuhk-inspire-card .wp-block-post-title a:hover {
	color: var(--wp--preset--color--primary, #4B2E83);
}

/* Inspire carousel dots */
.cuhk-inspire-dots {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin-top: 40px;
}

.cuhk-inspire-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #c4c4c4;
	cursor: pointer;
	transition: background 0.2s ease;
}

.cuhk-inspire-dot.is-active {
	background: #291c2f;
}

/* =========================================
   Outline button style
   ========================================= */

.wp-block-button.is-style-outline .wp-block-button__link {
	border: 1px solid var(--wp--preset--color--text-primary, #1A1A1A);
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	background: transparent;
	padding: 0.75rem 3rem;
	font-weight: 500;
	transition: background 0.2s ease, color 0.2s ease;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: var(--wp--preset--color--text-primary, #1A1A1A);
	color: #fff;
}

/* =========================================
   Gallery lightbox overlay
   ========================================= */

.cuhk-lightbox {
	position: fixed;
	inset: 0;
	z-index: 10000;
	background: rgba(0, 0, 0, 0.9);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

.cuhk-lightbox.is-open {
	opacity: 1;
	visibility: visible;
}

.cuhk-lightbox__close {
	position: absolute;
	top: 1rem;
	right: 1rem;
	background: none;
	border: none;
	color: #fff;
	font-size: 2rem;
	cursor: pointer;
	z-index: 10001;
}

.cuhk-lightbox img {
	max-width: 90vw;
	max-height: 90vh;
	object-fit: contain;
}

/* =========================================
   Submission form styles
   ========================================= */

.cuhk-submit-form {
	max-width: 700px;
	margin: 0 auto;
}

.cuhk-submit-form .form-group {
	margin-bottom: 1.5rem;
}

.cuhk-submit-form label {
	display: block;
	font-weight: 600;
	margin-bottom: 0.5rem;
}

.cuhk-submit-form input[type="text"],
.cuhk-submit-form input[type="email"],
.cuhk-submit-form input[type="url"],
.cuhk-submit-form input[type="date"],
.cuhk-submit-form textarea,
.cuhk-submit-form select {
	width: 100%;
	box-sizing: border-box;
	padding: 0.75rem 1rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 4px;
	font-size: 1rem;
	font-family: inherit;
	transition: border-color 0.15s ease;
}

.cuhk-submit-form input:focus,
.cuhk-submit-form textarea:focus,
.cuhk-submit-form select:focus {
	outline: none;
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 0 0 2px rgba(75, 46, 131, 0.1);
}

.cuhk-submit-form .form-required {
	color: #cc0000;
}

.cuhk-submit-form .form-help {
	font-size: 0.875rem;
	color: var(--wp--preset--color--text-secondary);
	margin-top: 0.25rem;
}

.cuhk-submit-form .form-message {
	padding: 1rem;
	border-radius: 4px;
	margin-bottom: 1.5rem;
}

.cuhk-submit-form .form-message--success {
	background: #e8f5e9;
	color: #2e7d32;
	border: 1px solid #a5d6a7;
}

.cuhk-submit-form .form-message--error {
	background: #fbe9e7;
	color: #c62828;
	border: 1px solid #ef9a9a;
}

/* Submit button — matches the outline action button used elsewhere
   (e.g. .cuhk-contact-update__btn "Log in to MyCUHK"). */
.cuhk-submit-form__submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 26px;
	border: 1px solid var(--wp--preset--color--text-primary, #1a1a1a);
	background: transparent;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	font-family: inherit;
	font-size: 15px;
	line-height: 1.2;
	font-weight: 600;
	border-radius: 2px;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.cuhk-submit-form__submit:hover,
.cuhk-submit-form__submit:focus-visible {
	background: var(--wp--preset--color--primary, #4b2e83);
	border-color: var(--wp--preset--color--primary, #4b2e83);
	color: #ffffff;
}

.cuhk-submit-form__submit:disabled {
	opacity: 0.6;
	cursor: default;
}

/* =========================================
   News Submission — 5-step wizard
   ========================================= */

/* Step indicator */
.cuhk-ns-steps {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1rem;
	list-style: none;
	margin: 0 0 2rem;
	padding: 0 0 1.5rem;
	border-bottom: 1px solid var(--wp--preset--color--border, #e0e0e0);
	counter-reset: none;
}

.cuhk-ns-steps__item {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex: 1 1 auto;
	min-width: 0;
	color: var(--wp--preset--color--text-secondary, #666);
	font-size: 0.875rem;
}

.cuhk-ns-steps__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	flex: 0 0 28px;
	border-radius: 50%;
	background: #d7d2e3;
	color: #fff;
	font-weight: 700;
	font-size: 0.875rem;
}

.cuhk-ns-steps__item.is-active {
	color: var(--wp--preset--color--primary, #4b2e83);
	font-weight: 600;
}

.cuhk-ns-steps__item.is-active .cuhk-ns-steps__num {
	background: var(--wp--preset--color--primary, #4b2e83);
}

/* Step sections */
.cuhk-ns-step__heading {
	font-weight: 600;
	margin: 0 0 1.25rem;
}

.cuhk-ns-step__heading--review {
	color: var(--wp--preset--color--primary, #4b2e83);
	font-size: 1.25rem;
}

.cuhk-ns-grouplabel {
	display: block;
	font-weight: 600;
	margin-bottom: 0.5rem;
}

/* Radio / checkbox groups */
.cuhk-ns-radios {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem 1.5rem;
}

.cuhk-ns-radio,
.cuhk-ns-check {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-weight: 400;
	cursor: pointer;
}

.cuhk-ns-radio input,
.cuhk-ns-check input {
	width: auto;
	margin-top: 0.2rem;
	flex: 0 0 auto;
}

.cuhk-ns-checks {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

/* Activity blocks */
.cuhk-ns-activity {
	border: 1px solid var(--wp--preset--color--border, #e0e0e0);
	border-radius: 8px;
	padding: 1.25rem 1.5rem 0.25rem;
	margin: 0 0 1.5rem;
	background: #fff;
}

.cuhk-ns-activity__title {
	font-weight: 700;
	color: var(--wp--preset--color--primary, #4b2e83);
	padding: 0 0.5rem;
}

/* Magazine + confirmation */
.cuhk-ns-magazine {
	margin: 0 0 1.5rem;
}

.cuhk-ns-magazine__q {
	font-weight: 600;
	margin: 0 0 0.75rem;
}

.cuhk-ns-confirm {
	background: var(--wp--preset--color--accent-light, #f6f4fb);
	border-radius: 8px;
	padding: 1rem 1.25rem;
}

.cuhk-ns-confirm .cuhk-ns-check {
	font-size: 0.9375rem;
	line-height: 1.5;
}

/* Navigation row */
.cuhk-ns-nav {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	margin-top: 1.5rem;
}

.cuhk-ns-link {
	background: none;
	border: none;
	padding: 0;
	color: var(--wp--preset--color--primary, #4b2e83);
	font-family: inherit;
	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: underline;
	cursor: pointer;
}

/* Facebook-only confirmation list */
.cuhk-ns-fb-list {
	margin: 0 0 0.5rem;
	padding-left: 1.25rem;
}

.cuhk-ns-fb-list li {
	margin-bottom: 0.5rem;
}

/* Preview */
.cuhk-ns-preview__list {
	margin: 0;
}

.cuhk-ns-preview__activity {
	margin-top: 1.25rem;
	padding-top: 1rem;
	border-top: 1px solid var(--wp--preset--color--border, #e0e0e0);
}

.cuhk-ns-preview__activity h4 {
	margin: 0 0 0.75rem;
	color: var(--wp--preset--color--primary, #4b2e83);
}

.cuhk-ns-preview__row {
	display: grid;
	grid-template-columns: minmax(140px, 30%) 1fr;
	gap: 0.5rem 1rem;
	padding: 0.4rem 0;
}

.cuhk-ns-preview__row dt {
	font-weight: 600;
	margin: 0;
}

.cuhk-ns-preview__row dd {
	margin: 0;
	word-break: break-word;
}

/* Disclaimer */
.cuhk-ns-disclaimer {
	margin-top: 2rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--wp--preset--color--border, #e0e0e0);
	font-size: 0.8125rem;
	color: var(--wp--preset--color--text-secondary, #666);
}

.cuhk-ns-disclaimer p {
	margin: 0.5rem 0 0;
}

@media (max-width: 600px) {
	.cuhk-ns-steps__item {
		flex: 1 1 100%;
	}

	.cuhk-ns-preview__row {
		grid-template-columns: 1fr;
		gap: 0.1rem;
	}
}

/* =========================================
   News Submission page
   ========================================= */

.cuhk-news-submit {
	max-width: 820px;
	margin: 0 auto;
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40) var(--wp--preset--spacing--70);
}

.cuhk-news-submit__body {
	margin-top: var(--wp--preset--spacing--40);
}

.cuhk-news-submit__content {
	margin-bottom: var(--wp--preset--spacing--60);
}

.cuhk-news-submit__content h2 {
	margin-top: var(--wp--preset--spacing--50);
}

.cuhk-news-submit__form {
	background: var(--wp--preset--color--accent-light, #f6f4fb);
	border: 1px solid var(--wp--preset--color--border, #e0e0e0);
	border-radius: 12px;
	padding: var(--wp--preset--spacing--50);
}

.cuhk-news-submit__form .cuhk-submit-form {
	max-width: none;
}

/* =========================================
   Footer
   ========================================= */

.wp-block-template-part:has(.cuhk-footer) {
	margin-top: 0 !important;
}

/* Remove top margin on full-width sections */
.wp-block-group.alignfull.has-background,
.wp-block-group.alignfull.has-background.is-layout-constrained {
	margin-top: 0 !important;
	margin-block-start: 0 !important;
}

.cuhk-footer {
	background-color: var(--wp--preset--color--footer-bg) !important;
	color: #1A1A1A;
	padding: 0 !important;
	margin-top: 0 !important;
}

.cuhk-footer__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 64px 80px 0;
}

.cuhk-footer__social-row {
	display: flex;
	align-items: center;
	gap: 16px;
	padding-bottom: 32px;
}

.cuhk-footer__follow-label {
	color: #1A1A1A;
	font-size: 14px;
	font-weight: 400;
	margin: 0;
	white-space: nowrap;
}

.cuhk-footer__social-icons {
	display: flex;
	align-items: center;
	gap: 12px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.cuhk-footer__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background-color: rgba(252, 251, 249, 0.2);
	color: #1A1A1A;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.cuhk-footer__icon svg {
	width: 16px;
	height: 16px;
}

.cuhk-footer__icon[aria-label="WeChat"] svg {
	width: 20px;
	height: 20px;
}

.cuhk-footer__icon:hover {
	background-color: rgba(252, 251, 249, 0.4);
}

.cuhk-footer__separator {
	border: none;
	border-top: 1px solid rgba(26, 26, 26, 0.3);
	width: 100%;
	max-width: 100%;
	margin: 0;
	opacity: 1;
}

.cuhk-footer__columns {
	display: flex;
	gap: 48px;
	padding: 40px 0;
}

.cuhk-footer__col {
	flex: 1;
}

.cuhk-footer__heading {
	color: #1A1A1A;
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 12px;
}

.cuhk-footer__links {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.cuhk-footer__links a,
.cuhk-footer__contact a {
	color: #1A1A1A;
	text-decoration: none;
}

.cuhk-footer__links a:hover,
.cuhk-footer__contact a:hover {
	text-decoration: underline;
}

.cuhk-footer__links p,
.cuhk-footer__contact p {
	margin: 0;
	color: #1A1A1A;
	font-size: 14px;
}

.cuhk-footer__contact {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.cuhk-footer__contact-item {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.cuhk-footer__contact-item::before {
	content: "";
	flex-shrink: 0;
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-top: 2px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.cuhk-footer__contact-item--location::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M8 1C5.2 1 3 3.1 3 5.7 3 9.5 8 15 8 15s5-5.5 5-9.3C13 3.1 10.8 1 8 1zm0 6.4c-1 0-1.8-.8-1.8-1.7S7 4 8 4s1.8.8 1.8 1.7S9 7.4 8 7.4z' fill='%231A1A1A'/%3E%3C/svg%3E");
}

.cuhk-footer__contact-item--email::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M2 4l6 4 6-4H2zm0 1v7h12V5L8 9 2 5z' fill='%231A1A1A'/%3E%3C/svg%3E");
}

.cuhk-footer__contact-item--phone::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M4.2 2C3 2 2 3 2 4.2 2 9.8 6.2 14 11.8 14c1.2 0 2.2-1 2.2-2.2 0-.3-.1-.5-.2-.7l-2.2-2.2c-.3-.3-.8-.4-1.2-.2l-1.2.8c-.2.1-.4.1-.6 0L6.5 7.8c-.2-.2-.2-.4 0-.6l.8-1.2c.2-.4.1-.9-.2-1.2L4.9 2.6c-.2-.3-.4-.4-.7-.6z' fill='%231A1A1A'/%3E%3C/svg%3E");
}

.cuhk-footer__copyright {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 32px 0 40px;
}

.cuhk-footer__copyright p {
	margin: 0;
	color: #1A1A1A;
	font-size: 13px;
}

.cuhk-footer__copyright a {
	color: #1A1A1A;
	text-decoration: none;
}

.cuhk-footer__copyright a:hover {
	text-decoration: underline;
}

.cuhk-footer__legal-sep {
	margin: 0 16px;
	color: #1A1A1A;
}

/* =========================================
   Mobile Menu
   ========================================= */

/* Hamburger toggle — hidden on desktop */
.cuhk-mobile-menu-toggle {
	display: none;
}

/* Mobile menu overlay */
.cuhk-mobile-menu {
	position: fixed;
	inset: 0;
	z-index: 10000;
	background: #fff;
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	transition: transform 0.3s ease;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

.cuhk-mobile-menu.is-open {
	transform: translateX(0);
}

.admin-bar .cuhk-mobile-menu {
	top: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar .cuhk-mobile-menu {
		top: 46px;
	}
}

/* Header row inside mobile menu */
/* Padding mirrors .cuhk-site-header__inner at mobile widths so the logo lands
   in exactly the same spot whether the menu is open or closed. */
.cuhk-mobile-menu__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 22px 16px;
	flex-shrink: 0;
}

.cuhk-mobile-menu__logo {
	display: inline-flex;
}

/* Match the mobile header logo exactly (240px wide, height auto). */
.cuhk-mobile-menu__logo img {
	width: 240px;
	height: auto;
}

.cuhk-mobile-menu__header-actions {
	display: flex;
	align-items: center;
	gap: 16px;
}

.cuhk-mobile-menu__search,
.cuhk-mobile-menu__close {
	background: none;
	border: none;
	padding: 4px;
	cursor: pointer;
	color: #1A1A1A;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Navigation list */
.cuhk-mobile-menu__nav {
	flex: 1;
	padding: 24px 0;
}

.cuhk-mobile-menu__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cuhk-mobile-menu__item {
	border-bottom: none;
}

.cuhk-mobile-menu__link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 20px 24px;
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #1A1A1A;
	text-decoration: none;
	background: none;
	border: none;
	cursor: pointer;
	text-align: left;
}

.cuhk-mobile-menu__link:hover {
	color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-mobile-menu__chevron {
	transition: transform 0.2s ease;
	flex-shrink: 0;
}

.cuhk-mobile-menu__submenu-toggle[aria-expanded="true"] .cuhk-mobile-menu__chevron {
	transform: rotate(180deg);
}

/* Submenu */
.cuhk-mobile-menu__submenu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: none;
	background: #f9f9f9;
}

.cuhk-mobile-menu__submenu.is-open {
	display: block;
}

.cuhk-mobile-menu__sublink {
	display: block;
	padding: 14px 24px 14px 40px;
	font-family: 'Open Sans', sans-serif;
	font-size: 15px;
	font-weight: 400;
	color: #333;
	text-decoration: none;
}

.cuhk-mobile-menu__sublink:hover {
	color: var(--wp--preset--color--primary, #4B2E83);
}

/* Footer language toggle */
.cuhk-mobile-menu__footer {
	padding: 24px;
	margin-top: auto;
	flex-shrink: 0;
}

.cuhk-mobile-menu__lang-toggle {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: none;
	border: none;
	cursor: pointer;
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	font-weight: 500;
	color: #1A1A1A;
	padding: 8px 0;
}

.cuhk-mobile-menu__lang-toggle svg {
	flex-shrink: 0;
}

/* Language sub-panel — overlays the menu */
.cuhk-mobile-menu__lang-panel {
	position: absolute;
	inset: 0;
	background: #fff;
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	transition: transform 0.3s ease;
	z-index: 1;
}

.cuhk-mobile-menu__lang-panel.is-open {
	transform: translateX(0);
}

.cuhk-mobile-menu__lang-list {
	list-style: none;
	margin: 0;
	padding: 24px 0;
}

.cuhk-mobile-menu__lang-option {
	display: block;
	padding: 14px 24px;
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	font-weight: 400;
	color: #1A1A1A;
	text-decoration: none;
}

.cuhk-mobile-menu__lang-option:hover {
	color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-mobile-menu__lang-option.is-active {
	font-weight: 700;
	text-decoration: underline;
}

/* =========================================
   Responsive adjustments
   ========================================= */

/* =========================================
   Decorative section heading (lamp icons + lines)
   ========================================= */

.cuhk-section-heading {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	margin: 0 auto var(--wp--preset--spacing--60);
	width: 70%;
	color: #58387A;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 400;
	font-size: clamp(1.25rem, 1.8vw, 1.75rem);
	line-height: 1.2;
}

.cuhk-section-heading__line {
	flex: 1 1 0;
	height: 1px;
	background: #58387A;
	opacity: 0.55;
}

.cuhk-section-heading__icon {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
}

.cuhk-section-heading__icon img {
	width: auto;
	height: 18px;
	display: block;
}

.cuhk-section-heading--video .cuhk-section-heading__icon img {
	height: 14px;
}

.cuhk-section-heading--magnifier .cuhk-section-heading__icon img {
	height: 14px;
}

.cuhk-section-heading--sparkles .cuhk-section-heading__icon img {
	height: 22px;
}

.cuhk-section-heading--image-up .cuhk-section-heading__icon img {
	height: 22px;
}

.cuhk-section-heading__text {
	white-space: nowrap;
	padding: 0 0.25rem;
}

@media (max-width: 781px) {
	.cuhk-section-heading {
		gap: 0;
		font-size: 1.75rem;
		width: 100%;
		justify-content: center;
	}
	/* Mobile design omits the decorative lines and icons — just the title text */
	.cuhk-section-heading__line,
	.cuhk-section-heading__icon {
		display: none;
	}
	.cuhk-section-heading__text {
		white-space: normal;
		text-align: center;
		padding: 0;
	}
}

/* =========================================
   Carousel dots (shown on all viewports)
   ========================================= */

.cuhk-carousel__dots {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	padding: 24px 0 0;
	width: 100%;
}

.cuhk-event-highlights .cuhk-carousel__dots,
.cuhk-story-cards .cuhk-carousel__dots,
.cuhk-inspire-stories .cuhk-carousel__dots {
	flex-basis: 100%;
	order: 99;
}

/* Only one page — nothing to paginate. The `hidden` attr (set in JS) needs a
   rule that outranks the display:flex above to actually hide the dots. */
.cuhk-carousel__dots[hidden] {
	display: none;
}

.cuhk-carousel__dot {
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #33233B;
	opacity: 0.10;
	transition: width 0.3s ease, height 0.3s ease, opacity 0.3s ease;
	border: none;
	padding: 0;
	cursor: pointer;
	flex-shrink: 0;
}

/* 2 levels away from active */
.cuhk-carousel__dot.is-active + .cuhk-carousel__dot + .cuhk-carousel__dot,
.cuhk-carousel__dot:has(+ .cuhk-carousel__dot + .cuhk-carousel__dot.is-active) {
	width: 6px;
	height: 6px;
	opacity: 0.20;
}

/* 1 level away from active */
.cuhk-carousel__dot.is-active + .cuhk-carousel__dot,
.cuhk-carousel__dot:has(+ .cuhk-carousel__dot.is-active) {
	width: 8px;
	height: 8px;
	opacity: 0.60;
}

.cuhk-carousel__dot.is-active {
	width: 11px;
	height: 11px;
	opacity: 1;
	background: #58387A;
}

/* =========================================
   Mobile dividers (hidden on desktop)
   ========================================= */

.cuhk-mobile-divider {
	display: none;
}

@media (max-width: 781px) {
	/* ---- Layout ---- */
	.wp-block-columns {
		flex-wrap: wrap;
	}

	.wp-block-query .wp-block-post-template.is-layout-grid {
		grid-template-columns: 1fr !important;
	}

	/* ---- Header: solid white bar on mobile ---- */
	.cuhk-site-header {
		position: relative !important;
		background: #fff !important;
	}

	.cuhk-site-header,
	.cuhk-site-header *:not(img):not(svg):not(line):not(button):not(a) {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		margin-top: 0 !important;
		margin-bottom: 0 !important;
		margin-block-start: 0 !important;
		margin-block-end: 0 !important;
	}

	.cuhk-site-header > .wp-block-group > .wp-block-group {
		padding: 10px 16px !important;
	}

	/* Restore vertical breathing room on mobile — the blanket zero-padding
	   reset above strips it from the header inner. Two classes + !important
	   outrank that reset. */
	.cuhk-site-header .cuhk-site-header__inner {
		padding-top: 22px !important;
		padding-bottom: 22px !important;
	}

	.wp-block-template-part:has(.cuhk-site-header) {
		margin: 0 !important;
		padding: 0 !important;
		margin-block-start: 0 !important;
	}

	.cuhk-site-header .wp-block-navigation,
	.cuhk-site-header .cuhk-primary-nav {
		display: none !important;
	}

	.cuhk-site-header .cuhk-lang-switcher {
		display: none !important;
	}

	.cuhk-mobile-menu-toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		background: transparent;
		border: none;
		padding: 6px;
		cursor: pointer;
		color: #1A1A1A;
	}

	.cuhk-mobile-menu-toggle svg {
		stroke: #1A1A1A;
	}

	.cuhk-header-search-icon {
		color: #1A1A1A !important;
	}

	/* Mobile search overlay — full-width bar + dark backdrop */
	.cuhk-site-header.is-search-open {
		position: fixed !important;
		top: 0;
		left: 0;
		right: 0;
		z-index: 200;
		background: #fff !important;
		box-shadow: none;
	}

	.cuhk-site-header.is-search-open .cuhk-site-header__inner {
		padding: 0 !important;
		max-width: none !important;
	}

	.cuhk-site-header.is-search-open .cuhk-site-header__row {
		flex-wrap: nowrap !important;
	}

	.cuhk-site-header.is-search-open .cuhk-site-header__logo,
	.cuhk-site-header.is-search-open .cuhk-header-actions {
		display: none !important;
	}

	.cuhk-site-header.is-search-open .cuhk-site-header__nav {
		flex: 1;
		margin: 0 !important;
		width: 100%;
	}

	.cuhk-site-header.is-search-open .cuhk-header-search-form {
		display: flex;
		width: 100%;
		margin: 0;
		padding: 14px 16px;
		border: 0;
		border-radius: 0;
		border-bottom: 1px solid #d9d9d9;
		background: #fff;
		gap: 12px;
	}

	.cuhk-site-header.is-search-open .cuhk-header-search-form__icon {
		color: #1A1A1A;
	}

	/* 16px prevents iOS Safari from auto-zooming the page on input focus */
	.cuhk-header-search-form__input {
		font-size: 16px;
	}

	.cuhk-site-header.is-search-open .cuhk-header-search-form__close {
		display: flex;
	}

	.cuhk-site-header.is-search-open .cuhk-header-search-backdrop {
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0, 0, 0, 0.85);
		z-index: -1;
	}

	.admin-bar .cuhk-site-header.is-search-open {
		top: 46px;
	}

	/* Mobile uses the purple logo throughout — no white/scroll swap here. */
	.cuhk-header-logo--desktop {
		display: none !important;
	}

	.cuhk-header-logo--mobile {
		display: block !important;
		width: 240px !important;
	}

	/* Override the inline width:200px on the <img> so the mobile logo scales up. */
	.cuhk-header-logo--mobile img {
		width: 240px !important;
	}

	/* ---- Mobile dividers ---- */
	.cuhk-mobile-divider {
		display: block;
		height: 4px;
		background: #D9D9D9;
		padding: 0 !important;
		margin: 0 !important;
	}

	/* ---- Section padding on mobile ---- */
	.home .wp-block-group.alignfull.has-background,
	.home .wp-block-group.alignfull:not(.cuhk-site-header):not(.cuhk-footer) {
		padding-top: 56px !important;
		padding-bottom: 56px !important;
		padding-left: 24px !important;
		padding-right: 24px !important;
	}

	/* ---- Section headings 28px on mobile ---- */
	.home .wp-block-heading.has-xx-large-font-size {
		font-size: 28px !important;
		margin-bottom: 32px !important;
	}

	/* ---- Stay Connected ---- */
	.cuhk-stay-connected {
		min-height: auto;
	}

	.cuhk-stay-connected__content {
		padding: 72px 24px 88px;
	}

	.cuhk-stay-connected__heading {
		font-size: 28px;
	}

	.cuhk-stay-connected__desc {
		font-size: 16px;
		line-height: 1.6;
	}

	.cuhk-stay-connected__link {
		font-family: 'Open Sans', sans-serif;
		font-size: 16px;
		padding: 16px 48px;
	}

	/* ---- Inspire section (More From CUHK) ---- */
	.cuhk-inspire-heading {
		font-size: 28px !important;
	}

	.cuhk-inspire-carousel .wp-block-post-template.is-layout-grid {
		display: flex !important;
		gap: 0;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		padding-left: 0;
		padding-right: 0;
	}

	.cuhk-inspire-carousel .wp-block-post-template.is-layout-grid::-webkit-scrollbar {
		display: none;
	}

	.cuhk-inspire-carousel .wp-block-post-template.is-layout-grid > li {
		flex: 0 0 100%;
		scroll-snap-align: start;
	}

	.cuhk-inspire-card__image img,
	.cuhk-inspire-card .wp-block-post-featured-image img {
		height: 177px;
		aspect-ratio: auto;
	}

	.cuhk-inspire-card .wp-block-post-title {
		font-family: 'Open Sans', sans-serif;
		font-size: 16px;
		margin: 8px 8px 0 !important;
	}

	/* ---- Alumni Stories section lighter bg on mobile ---- */
	.home .wp-block-group.alignfull[style*="background-color:#B1D3E6"] {
		background-color: rgba(177, 211, 230, 0.25) !important;
	}

	/* ---- Key Figures section description ---- */
	.home .cuhk-key-figures {
		padding: 0;
	}

	/* ---- Remove desktop border-top on upcoming events (dividers replace it) ---- */
	.home .wp-block-group.alignfull[style*="border-top"] {
		border-top: none !important;
	}

	/* ---- Footer ---- */
	.cuhk-footer__inner {
		padding-left: 24px !important;
		padding-right: 24px !important;
	}

	.cuhk-footer__columns {
		flex-direction: column;
		gap: 32px;
	}

	.cuhk-footer__copyright {
		flex-direction: column;
		gap: 12px;
		text-align: center;
	}

	/* ---- Footer social icons larger on mobile ---- */
	.cuhk-footer__social-row {
		flex-direction: column;
		align-items: flex-start !important;
	}

	.cuhk-footer__icon {
		width: 56px;
		height: 56px;
	}

	.cuhk-footer__icon svg {
		width: 28px;
		height: 28px;
	}

	.cuhk-footer__icon[aria-label="WeChat"] svg {
		width: 34px;
		height: 34px;
	}

	.cuhk-footer__social-icons {
		gap: 8px;
	}
}

/* =========================================
   Hero Banner (shared across event pages)
   ========================================= */

/*
 * Global layout adds margin-block-start: 24px to every .wp-site-blocks direct child
 * after the first. The header is position:absolute (out of flow), so that margin sits
 * above the hero cover as visible white body background. Flush the hero to the top.
 */
.wp-block-template-part:has(.cuhk-site-header) + .wp-block-cover.alignfull,
.wp-block-template-part:has(.cuhk-site-header) + .wp-block-cuhk-aao-hero-slider.alignfull {
	margin-block-start: 0 !important;
	margin-top: 0 !important;
}

/* =========================================
   Page Hero Banner (reusable)
   ========================================= */

.cuhk-page-hero {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 5;
	min-height: 320px;
	max-height: 480px;
	background-color: #1a1028;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	display: flex;
	align-items: flex-end;
	overflow: hidden;
	margin: 0;
}

.cuhk-page-hero__overlay {
	position: absolute;
	inset: 0;
	pointer-events: none;
	clip-path: polygon(0 0, 40% 0, 33% 100%, 0 100%);
	background: var(--page-hero-overlay-color, rgba(20, 10, 30, 0.65));
}

.cuhk-page-hero__inner {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
	padding: 120px 48px 56px;
}

.cuhk-page-hero--center .cuhk-page-hero__inner {
	text-align: center;
}

.cuhk-page-hero__title {
	margin: 0;
	color: #ffffff;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: clamp(36px, 5vw, 64px);
	line-height: 1.15;
	letter-spacing: 0.01em;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}

.admin-bar .cuhk-page-hero__inner {
	padding-top: 152px;
}

@media (max-width: 782px) {
	.cuhk-page-hero {
		min-height: 220px;
	}
	/* Trapezium is too narrow on phones — switch to a bottom-up scrim so the
	   title (always present, unlike the slider's hidden tagline) stays legible. */
	.cuhk-page-hero__overlay {
		clip-path: none;
		background: linear-gradient(0deg, var(--page-hero-overlay-color, rgba(20, 10, 30, 0.65)) 0%, transparent 75%);
	}
	.cuhk-page-hero__inner {
		padding: 96px 24px 40px;
	}
	.admin-bar .cuhk-page-hero__inner {
		padding-top: 96px;
	}
}

/* =========================================
   Breadcrumb (shared)
   ========================================= */

.cuhk-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: var(--wp--preset--color--text-secondary, #666);
	margin-bottom: 32px;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

.cuhk-breadcrumb a {
	color: var(--wp--preset--color--text-secondary, #666);
	text-decoration: none;
}

.cuhk-breadcrumb a:hover {
	text-decoration: underline;
	color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-breadcrumb__separator {
	color: #999;
}

.cuhk-breadcrumb__current {
	color: var(--wp--preset--color--text-primary, #1A1A1A);
}

/* =========================================
   Pagination (shared: squared active chip, plain inactive)
   ========================================= */

.cuhk-pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 40px;
}

.cuhk-pagination__link {
	width: auto;
	min-width: 36px;
	height: 36px;
	padding: 0 4px;
	border-radius: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
	color: var(--wp--preset--color--primary, #4b2e83);
	text-decoration: none;
	background: transparent;
	box-sizing: border-box;
	transition: background 0.2s, color 0.2s;
}

.cuhk-pagination__link:hover:not(.is-active) {
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-pagination__link.is-active {
	min-width: 36px;
	height: 36px;
	padding: 0 8px;
	background: var(--wp--preset--color--primary, #4b2e83);
	color: #fff;
	font-weight: 600;
}

/* =========================================
   Single post / news detail
   ========================================= */

.single-post .wp-block-post-content {
	font-size: 16px;
	line-height: 1.7;
}

.single-post .wp-block-post-content h2,
.single-post .wp-block-post-content h3 {
	margin-top: 2rem;
	margin-bottom: 1rem;
}

/* ============================================
 * Block styles consolidated from blocks/
 * ============================================ */

/* --- event-cards --- */

.cuhk-event-cards__filters {
	margin-bottom: 2rem;
}

.cuhk-event-cards__filters form {
	display: flex;
	gap: 0.75rem;
	flex-wrap: wrap;
	align-items: center;
}

.cuhk-event-cards__filters input[type="text"] {
	padding: 0.5rem 1rem;
	border: 1px solid var(--wp--preset--color--border, #E0E0E0);
	border-radius: 4px;
	font-size: 0.875rem;
}

.cuhk-event-cards__grid {
	display: grid;
	gap: 1.5rem;
}

.cuhk-event-card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border, #E0E0E0);
	border-radius: 8px;
	overflow: hidden;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.cuhk-event-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.cuhk-event-card__image {
	display: block;
	overflow: hidden;
}

.cuhk-event-card__image img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	display: block;
	transition: transform 0.3s ease;
}

.cuhk-event-card:hover .cuhk-event-card__image img {
	transform: scale(1.05);
}

.cuhk-event-card__body {
	padding: 1.25rem;
}

.cuhk-event-card__title {
	font-size: 1.125rem;
	font-weight: 600;
	margin: 0.75rem 0 0.5rem;
	line-height: 1.3;
}

.cuhk-event-card__title a {
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	text-decoration: none;
}

.cuhk-event-card__title a:hover {
	color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-event-card__location {
	font-size: 0.875rem;
	color: var(--wp--preset--color--text-secondary, #666);
	margin: 0 0 0.5rem;
}

.cuhk-event-card__excerpt {
	font-size: 0.875rem;
	color: var(--wp--preset--color--text-secondary, #666);
	margin: 0;
}

.cuhk-event-cards__empty {
	text-align: center;
	color: var(--wp--preset--color--text-secondary, #666);
	padding: 2rem;
}

@media (max-width: 781px) {
	.cuhk-event-cards__grid {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}

@media (max-width: 480px) {
	.cuhk-event-cards__grid {
		grid-template-columns: 1fr !important;
	}
}

/* --- event-gallery-photos --- */

.cuhk-event-gallery-photos__grid {
	display: grid;
	gap: 12px;
}

.cuhk-event-gallery-photos__item {
	display: block;
	overflow: hidden;
	cursor: pointer;
}

.cuhk-event-gallery-photos__img {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	display: block;
	transition: opacity 0.2s ease, transform 0.3s ease;
}

.cuhk-event-gallery-photos__item:hover .cuhk-event-gallery-photos__img {
	opacity: 0.85;
	transform: scale(1.02);
}

/* Lightbox nav buttons */
.cuhk-lightbox__prev,
.cuhk-lightbox__next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: rgba(255, 255, 255, 0.15);
	border: none;
	border-radius: 50%;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 10002;
	transition: background 0.2s;
}

.cuhk-lightbox__prev:hover,
.cuhk-lightbox__next:hover {
	background: rgba(255, 255, 255, 0.3);
}

.cuhk-lightbox__prev {
	left: 1.5rem;
}

.cuhk-lightbox__next {
	right: 1.5rem;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
	.cuhk-event-gallery-photos__grid {
		grid-template-columns: repeat(3, 1fr) !important;
	}
}

@media (max-width: 781px) {
	.cuhk-event-gallery-photos__grid {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 8px;
	}
}

/* --- upcoming-events section: silky wave decorations (desktop only) --- */

.cuhk-upcoming-events-section {
	position: relative;
	overflow: hidden;
}

.cuhk-upcoming-events-section__wave {
	position: absolute;
	pointer-events: none;
	user-select: none;
	z-index: 0;
	width: auto;
	height: auto;
	max-width: none;
}

.cuhk-upcoming-events-section__wave--right {
	top: 0;
	right: 0;
	width: 38%;
	max-width: 720px;
	height: auto;
}

.cuhk-upcoming-events-section__wave--left {
	bottom: 0;
	left: 0;
	width: 32%;
	max-width: 600px;
	height: auto;
}

@media (max-width: 1024px) {
	.cuhk-upcoming-events-section__wave--right {
		width: 44%;
	}
	.cuhk-upcoming-events-section__wave--left {
		width: 38%;
	}
}

@media (max-width: 781px) {
	.cuhk-upcoming-events-section__wave {
		display: none;
	}
}

/* --- event-highlights --- */

.cuhk-event-highlights {
	position: relative;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0;
}

.cuhk-event-highlights__track {
	display: flex;
	gap: 1.5rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding-bottom: 0.5rem;
	flex: 1;
}

.cuhk-event-highlights__track::-webkit-scrollbar {
	display: none;
}

.cuhk-event-highlights .cuhk-highlight-card {
	flex: 0 0 calc(33.333% - 1rem);
	scroll-snap-align: start;
	border-radius: 8px;
	overflow: hidden;
	background: #fff;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.cuhk-event-highlights .cuhk-highlight-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.cuhk-highlight-card__image-link {
	display: block;
	overflow: hidden;
}

.cuhk-highlight-card__image-link img {
	width: 100%;
	/* Fixed ratio (the 400x280 desktop thumbnail) so the crop stays identical
	   at every viewport width instead of turning portrait as the card narrows.
	   height:auto is required — the img height attribute would otherwise win. */
	height: auto;
	aspect-ratio: 10 / 7;
	object-fit: cover;
	display: block;
	transition: transform 0.3s ease;
}

.cuhk-highlight-card:hover .cuhk-highlight-card__image-link img {
	transform: scale(1.05);
}

.cuhk-highlight-card__caption {
	padding: 1rem;
}

.cuhk-highlight-card__title {
	display: block;
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	text-decoration: none;
	margin-bottom: 0.25rem;
	line-height: 1.4;
}

.cuhk-highlight-card__title:hover {
	color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-highlight-card__meta {
	display: block;
	font-size: 0.8125rem;
	color: var(--wp--preset--color--text-secondary, #666);
	font-style: italic;
}

.cuhk-event-highlights__empty {
	text-align: center;
	color: var(--wp--preset--color--text-secondary, #666);
	padding: 2rem;
}

/* Carousel navigation arrows */
.cuhk-event-highlights .cuhk-carousel__prev,
.cuhk-event-highlights .cuhk-carousel__next {
	flex-shrink: 0;
	border: none;
	background: transparent;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
	padding: 0;
	/* Align arrow to vertical middle of the thumbnail, not the full card.
	   Card width = (row - 2 x (23px arrow + 60px margin)) / 3 - 1rem; the
	   thumbnail is 10:7, so its middle is 0.35 x that, less half the 42px arrow. */
	align-self: flex-start;
	margin-top: calc(((100% - 166px) / 3 - 1rem) * 0.35 - 21px);
}

.cuhk-event-highlights .cuhk-carousel__prev img,
.cuhk-event-highlights .cuhk-carousel__next img {
	width: 23px;
	height: 42px;
	filter: brightness(0);
}

.cuhk-event-highlights .cuhk-carousel__prev:hover img,
.cuhk-event-highlights .cuhk-carousel__next:hover img {
	filter: brightness(0) opacity(0.6);
}

.cuhk-event-highlights .cuhk-carousel__prev {
	margin-right: 60px;
}

.cuhk-event-highlights .cuhk-carousel__next {
	margin-left: 60px;
}

@media (max-width: 781px) {
	/* Switch to vertical layout so dots go below the track */
	.cuhk-event-highlights {
		flex-direction: column;
	}

	.cuhk-event-highlights .cuhk-highlight-card {
		flex: 0 0 100%;
		border-radius: 0;
		scroll-snap-align: start;
	}

	.cuhk-event-highlights .cuhk-highlight-card:hover {
		transform: none;
		box-shadow: none;
	}

	/* Track is 80% of viewport, centered; each card fills the track so
	   exactly one event is visible. Arrows sit in the 10% gutters on
	   each side, and the gap shows between cards while scrolling. */
	.cuhk-event-highlights {
		overflow: hidden;
	}
	.cuhk-event-highlights__track {
		width: 80%;
		max-width: 80%;
		align-self: center;
		gap: 1rem;
		padding-left: 0;
		padding-right: 0;
		box-sizing: border-box;
		scroll-snap-type: x mandatory;
	}
	.cuhk-event-highlights .cuhk-carousel__prev,
	.cuhk-event-highlights .cuhk-carousel__next {
		position: absolute;
		/* Vertical middle of the card image: the card fills the 80%-wide
		   track and the thumbnail is 10:7, so 80% x 0.35 = 28% of the row. */
		top: 0;
		margin: 28% 0 0;
		transform: translateY(-50%);
		align-self: auto;
		padding: 8px;
	}
	.cuhk-event-highlights .cuhk-carousel__prev {
		left: 0;
	}
	.cuhk-event-highlights .cuhk-carousel__next {
		right: 0;
	}
	.cuhk-event-highlights .cuhk-carousel__prev img,
	.cuhk-event-highlights .cuhk-carousel__next img {
		width: 14px;
		height: 26px;
		filter: brightness(0);
	}

	.cuhk-highlight-card__caption {
		padding: 8px;
	}

	.cuhk-highlight-card__title {
		font-size: 1rem;
		font-weight: 600;
	}
}

/* --- events-calendar --- */

body.page-template-page-events-news {
	background: #FCFBF9;
}

.cuhk-events-calendar__columns {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	gap: 48px;
	align-items: stretch;
}

.cuhk-events-calendar__left {
	background: #FFFFFF;
	border-radius: 4px;
	padding: 24px 32px 32px;
	box-shadow: 0 1px 2px rgba(20, 20, 30, 0.06), 0 8px 20px rgba(20, 20, 30, 0.10);
}

/* ── Month Tabs ── */
.cuhk-month-tabs {
	display: flex;
	align-items: center;
	gap: 4px;
	margin-bottom: 24px;
	border-bottom: 1px solid var(--wp--preset--color--border, #E0E0E0);
}

.cuhk-month-tabs__strip {
	display: flex;
	overflow-x: auto;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	flex: 1 1 0;
	min-width: 0;
}

.cuhk-month-tabs__strip::-webkit-scrollbar {
	display: none;
}

.cuhk-month-tabs__tab {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 12px 18px;
	text-decoration: none;
	white-space: nowrap;
	border-bottom: 3px solid transparent;
	color: var(--wp--preset--color--text-secondary, #666);
	transition: color 0.2s, border-color 0.2s;
	flex-shrink: 0;
}

.cuhk-month-tabs__tab:hover {
	color: var(--wp--preset--color--text-primary, #1A1A1A);
}

.cuhk-month-tabs__tab.is-active {
	font-weight: 700;
	color: var(--wp--preset--color--primary, #4B2E83);
	border-bottom-color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-month-tabs__month {
	font-size: 15px;
	font-weight: inherit;
	line-height: 1.3;
}

.cuhk-month-tabs__year {
	font-size: 12px;
	opacity: 0.7;
}

.cuhk-month-tabs__arrow {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: none;
	color: var(--wp--preset--color--text-secondary, #666);
	cursor: pointer;
	padding: 0;
	transition: color 0.2s;
}

.cuhk-month-tabs__arrow:hover {
	color: var(--wp--preset--color--text-primary, #1A1A1A);
}

/* ── Heading ── */
.cuhk-events-calendar__heading {
	font-size: 16px;
	font-weight: 600;
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	margin: 0 0 20px;
}

/* ── Event Grid ── */
.cuhk-events-calendar__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
}

/* ── Calendar Card ── */
.cuhk-cal-card {
	position: relative;
}

.cuhk-cal-card__image-link {
	display: block;
	position: relative;
	overflow: hidden;
}

.cuhk-cal-card__img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	display: block;
	height: auto;
	transition: transform 0.3s ease;
}

.cuhk-cal-card:hover .cuhk-cal-card__img {
	transform: scale(1.03);
}

.cuhk-cal-card__placeholder {
	width: 100%;
	aspect-ratio: 16 / 9;
	background: var(--wp--preset--color--background-light, #F7F7F7);
}

.cuhk-cal-card__badge {
	position: absolute;
	top: 0;
	left: 0;
	background: rgba(75, 46, 131, 0.85);
	color: #fff;
	font-size: 11px;
	font-weight: 600;
	padding: 4px 10px;
	z-index: 1;
}

.cuhk-cal-card__body {
	padding: 8px 0 0;
}

.cuhk-cal-card__title {
	font-size: 14px;
	font-weight: 600;
	line-height: 1.35;
	margin: 0 0 2px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.cuhk-cal-card__title a {
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	text-decoration: none;
}

.cuhk-cal-card__title a:hover {
	color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-cal-card__organizer {
	font-size: 13px;
	color: var(--wp--preset--color--text-secondary, #666);
	margin: 0 0 4px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.cuhk-cal-card__date {
	font-size: 13px;
	color: var(--wp--preset--color--text-secondary, #666);
	margin: 0;
	display: flex;
	align-items: center;
	gap: 5px;
}

.cuhk-cal-card__date svg {
	flex-shrink: 0;
}

/* ── Featured News Sidebar ── */
.cuhk-events-calendar__right {
	display: flex;
	flex-direction: column;
	gap: 32px;
	min-height: 0;
}

.cuhk-featured-news-card__image-link {
	display: block;
	overflow: hidden;
}

.cuhk-featured-news-card__img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	display: block;
	height: auto;
	transition: transform 0.3s ease;
}

.cuhk-featured-news-card:hover .cuhk-featured-news-card__img {
	transform: scale(1.03);
}

.cuhk-featured-news-card__title {
	font-size: 18px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin: 8px 0 0;
	line-height: 1.3;
}

.cuhk-featured-news-card__title a {
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	text-decoration: none;
}

.cuhk-featured-news-card__title a:hover {
	color: var(--wp--preset--color--primary, #4B2E83);
}

@media (min-width: 782px) {
	.cuhk-events-calendar__left {
		min-height: 760px;
	}

}

/* ── Empty state ── */
.cuhk-events-calendar__empty {
	text-align: center;
	color: var(--wp--preset--color--text-secondary, #666);
	padding: 48px 16px;
	font-size: 15px;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
	.cuhk-events-calendar__columns {
		grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
		gap: 32px;
	}
}

@media (max-width: 781px) {
	.cuhk-events-calendar__columns {
		grid-template-columns: minmax(0, 1fr);
		gap: 40px;
	}

	.cuhk-events-calendar__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
	}

	.cuhk-cal-card__title {
		font-size: 13px;
	}

	.cuhk-cal-card__organizer,
	.cuhk-cal-card__date {
		font-size: 12px;
	}

	.cuhk-cal-card__badge {
		font-size: 10px;
		padding: 3px 8px;
	}
}

@media (max-width: 600px) {
	/* Full-width event cards on phones instead of a cramped 2-up grid. */
	.cuhk-events-calendar__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	/* Cards are full width now, so restore readable text sizes (the 781px
	   rules above shrank them for the cramped 2-up layout). */
	.cuhk-cal-card__title {
		font-size: 16px;
	}

	.cuhk-cal-card__organizer,
	.cuhk-cal-card__date {
		font-size: 14px;
	}
}

/* --- gallery-grid --- */

.cuhk-gallery-grid__items {
	display: grid;
	gap: 20px;
}

.cuhk-gallery-album-card__image {
	display: block;
	overflow: hidden;
}

.cuhk-gallery-album-card__image img {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	display: block;
	transition: opacity 0.2s ease;
}

.cuhk-gallery-album-card:hover .cuhk-gallery-album-card__image img {
	opacity: 0.85;
}

.cuhk-gallery-album-card__placeholder {
	width: 100%;
	aspect-ratio: 16 / 9;
	background: var(--wp--preset--color--background-light, #F7F7F7);
}

.cuhk-gallery-album-card__title {
	font-size: 15px;
	font-weight: 500;
	margin: 10px 0 4px;
	line-height: 1.4;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.cuhk-gallery-album-card__title a {
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	text-decoration: none;
}

.cuhk-gallery-album-card__title a:hover {
	color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-gallery-album-card__date {
	font-size: 13px;
	color: var(--wp--preset--color--text-secondary, #666);
	margin: 0;
	display: flex;
	align-items: center;
	gap: 6px;
}

.cuhk-gallery-album-card__date svg {
	flex-shrink: 0;
}

.cuhk-gallery-grid__empty {
	text-align: center;
	color: var(--wp--preset--color--text-secondary, #666);
	padding: 48px 16px;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
	.cuhk-gallery-grid__items {
		grid-template-columns: repeat(3, 1fr) !important;
	}
}

@media (max-width: 781px) {
	.cuhk-gallery-grid__items {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}

@media (max-width: 480px) {
	.cuhk-gallery-grid__items {
		grid-template-columns: 1fr !important;
	}
}

/* --- hero-slider --- */

.cuhk-hero-slider {
	position: relative;
	overflow: hidden;
	width: 100%;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

.cuhk-hero-slider__track {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 5;
	min-height: 360px;
	max-height: 480px;
}

.cuhk-hero-slider__slide {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
	background-color: var(--wp--preset--color--primary, #4B2E83);
	opacity: 0;
	transition: opacity 0.8s ease;
	z-index: 0;
	overflow: hidden;
}

.cuhk-hero-slider__slide.is-active {
	opacity: 1;
	z-index: 1;
	position: relative;
	height: 100%;
}

/* Background image layer — separated from the slide so it can zoom
   independently of the overlay/content. Ken Burns slow zoom-in plays
   each time the slide becomes active. */
.cuhk-hero-slider__image {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transform: scale(1);
	transform-origin: center;
	z-index: 0;
}

.cuhk-hero-slider__slide.is-active .cuhk-hero-slider__image {
	animation: cuhk-hero-zoom 10s ease-out forwards;
}

@keyframes cuhk-hero-zoom {
	from { transform: scale(1); }
	to   { transform: scale(1.1); }
}

@media (prefers-reduced-motion: reduce) {
	.cuhk-hero-slider__slide.is-active .cuhk-hero-slider__image {
		animation: none;
	}
}

/* Trapezoid overlay -- angled shape covering the left side */
.cuhk-hero-slider__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
}

.cuhk-hero-slider__overlay--trapezoid {
	clip-path: polygon(0 0, 33.3333% 0, 28% 100%, 0 100%);
	background: var(--hero-overlay-color, rgba(4, 57, 93, 0.8));
}

.cuhk-hero-slider__overlay--gradient {
	background: linear-gradient(to right, rgba(var(--hero-overlay-rgb, 4, 57, 93), 0.85) 0%, rgba(var(--hero-overlay-rgb, 4, 57, 93), 0.5) 22%, transparent 33.3333%);
}

.cuhk-hero-slider__content {
	position: relative;
	z-index: 2;
	text-align: left;
	color: #fff;
	max-width: min(24vw, 340px);
	padding: 3rem 1.5rem 3.5rem 3rem;
}

.cuhk-hero-slider__heading {
	font-family: 'Abhaya Libre', Georgia, serif;
	font-size: clamp(1.5rem, 2.4vw, 2.25rem);
	font-weight: 700;
	margin: 0 0 1rem;
	color: #fff;
	line-height: 1.2;
}

.cuhk-hero-slider__subheading {
	font-family: 'Abhaya Libre', Georgia, serif;
	font-size: 20px;
	font-weight: 600;
	margin: 0 0 1.5rem;
	opacity: 0.9;
	line-height: 1.5;
}

.cuhk-hero-slider__button {
	display: inline-block;
	background: var(--wp--preset--color--secondary, #D4A843);
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	padding: 0.75rem 2rem;
	border-radius: 4px;
	text-decoration: none;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-size: 20px;
	font-weight: 600;
	transition: background 0.2s ease;
}

.cuhk-hero-slider__button:hover {
	background: #c49a3a;
	color: var(--wp--preset--color--text-primary, #1A1A1A);
}

/* Navigation - circle arrows on edges */
.cuhk-hero-slider__prev,
.cuhk-hero-slider__next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	background: #33233B;
	border: none;
	color: #fff;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.2s ease, border-color 0.2s ease;
}

.cuhk-hero-slider__prev {
	left: 1.5rem;
}

.cuhk-hero-slider__next {
	right: 1.5rem;
}

.cuhk-hero-slider__prev:hover,
.cuhk-hero-slider__next:hover {
	background: #4a3355;
	border: none;
}

.cuhk-hero-slider__prev img,
.cuhk-hero-slider__next img {
	width: 24px;
	height: 24px;
}

/* Dots at bottom center */
.cuhk-hero-slider__dots {
	position: absolute;
	bottom: 1.5rem;
	left: 50%;
	transform: translateX(-50%);
	z-index: 10;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.cuhk-hero-slider__dot {
	border-radius: 50%;
	border: none;
	background: rgba(255, 255, 255, 0.10);
	cursor: pointer;
	transition: width 0.3s ease, height 0.3s ease, background 0.3s ease;
	padding: 0;
	width: 4px;
	height: 4px;
	flex-shrink: 0;
}

/* 2 levels away from active */
.cuhk-hero-slider__dot.is-active + .cuhk-hero-slider__dot + .cuhk-hero-slider__dot,
.cuhk-hero-slider__dot:has(+ .cuhk-hero-slider__dot + .cuhk-hero-slider__dot.is-active) {
	width: 6px;
	height: 6px;
	background: rgba(255, 255, 255, 0.20);
}

/* 1 level away from active (immediately adjacent) */
.cuhk-hero-slider__dot.is-active + .cuhk-hero-slider__dot,
.cuhk-hero-slider__dot:has(+ .cuhk-hero-slider__dot.is-active) {
	width: 8px;
	height: 8px;
	background: rgba(255, 255, 255, 0.60);
}

.cuhk-hero-slider__dot.is-active {
	background: #ffffff;
	width: 11px;
	height: 11px;
}

@media (max-width: 781px) {
	.cuhk-hero-slider__track {
		aspect-ratio: auto;
		height: 500px;
		min-height: 0;
		max-height: none;
	}

	.cuhk-hero-slider__slide.is-active {
		height: 500px;
	}

	/* Hide text overlay on mobile -- tagline shown in separate section below */
	.cuhk-hero-slider__overlay {
		display: none;
	}

	.cuhk-hero-slider__content {
		display: none;
	}

	/* Hide arrow nav on mobile -- use swipe + dots */
	.cuhk-hero-slider__prev,
	.cuhk-hero-slider__next {
		display: none;
	}

	/* Dots styling for mobile */
	.cuhk-hero-slider__dots {
		bottom: 2rem;
	}
}

/* --- inspire-stories carousel --- */

.cuhk-inspire-stories {
	position: relative;
	overflow: hidden;
}

.cuhk-inspire-stories__track {
	display: flex;
	gap: 32px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	flex: 1;
	max-width: 92%;
	margin: 0 auto;
	padding-bottom: 0.5rem;
}

.cuhk-inspire-stories__track::-webkit-scrollbar {
	display: none;
}

.cuhk-inspire-card {
	flex: 0 0 calc((100% - 64px) / 3);
	scroll-snap-align: start;
	background: transparent;
}

/* Scoped under .cuhk-inspire-card so the gap survives the global
   button.cuhk-video-trigger reset (margin:0), which otherwise wins on the
   video-trigger button variant of the card image. */
.cuhk-inspire-card .cuhk-inspire-card__image {
	display: block;
	overflow: hidden;
	margin-bottom: 16px;
	position: relative;
}

.cuhk-inspire-card__image img {
	display: block;
	width: 100%;
	height: auto;
	/* 16:9 so object-fit:cover trims the black letterbox bars baked into
	   YouTube's 4:3 hqdefault poster frame (feedback). */
	aspect-ratio: 16 / 9;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.cuhk-inspire-card:hover .cuhk-inspire-card__image img {
	transform: scale(1.03);
}

.cuhk-inspire-card__play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
	transition: transform 0.2s ease;
}

.cuhk-inspire-card:hover .cuhk-inspire-card__play {
	transform: translate(-50%, -50%) scale(1.05);
}

.cuhk-inspire-card__title {
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 0.3px;
	line-height: 1.4;
	margin: 0;
	color: #291c2f;
}

.cuhk-inspire-card__title a {
	text-decoration: none;
	color: inherit;
}

.cuhk-inspire-card__title a:hover {
	text-decoration: underline;
}

.cuhk-inspire-stories__empty {
	text-align: center;
	color: var(--wp--preset--color--text-secondary, #666);
	padding: 2rem;
}

/* Carousel arrows -- positioned at far edges */
.cuhk-inspire-stories .cuhk-carousel__prev,
.cuhk-inspire-stories .cuhk-carousel__next {
	position: absolute;
	top: 38%;
	transform: translateY(-50%);
	border: none;
	background: transparent;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
	padding: 0;
}

.cuhk-inspire-stories .cuhk-carousel__prev img,
.cuhk-inspire-stories .cuhk-carousel__next img {
	width: 23px;
	height: 42px;
	filter: brightness(0);
}

.cuhk-inspire-stories .cuhk-carousel__prev:hover img,
.cuhk-inspire-stories .cuhk-carousel__next:hover img {
	filter: brightness(0) opacity(0.6);
}

.cuhk-inspire-stories .cuhk-carousel__prev {
	left: 0;
}

.cuhk-inspire-stories .cuhk-carousel__next {
	right: 0;
}

@media (max-width: 1024px) {
	.cuhk-inspire-card {
		flex: 0 0 calc((100% - 32px) / 2);
	}
	.cuhk-inspire-stories__track {
		gap: 32px;
	}
}

@media (max-width: 781px) {
	.cuhk-inspire-stories {
		overflow: visible;
	}
	.cuhk-inspire-stories__track {
		max-width: calc(100% - 80px);
		gap: 24px;
	}
	.cuhk-inspire-card {
		flex: 0 0 100%;
	}
	.cuhk-inspire-stories .cuhk-carousel__prev,
	.cuhk-inspire-stories .cuhk-carousel__next {
		top: 35%;
	}
	.cuhk-inspire-stories .cuhk-carousel__prev {
		left: 4px;
	}
	.cuhk-inspire-stories .cuhk-carousel__next {
		right: 4px;
	}
	.cuhk-inspire-stories .cuhk-carousel__prev img,
	.cuhk-inspire-stories .cuhk-carousel__next img {
		width: 16px;
		height: 28px;
	}
}

/* --- key-figures --- */

.cuhk-key-figures {
	/* No bottom padding: the section wrapper already pads the bottom, and the
	   "As of" disclaimer's own margin sets the gap. Dropping it pulls the date
	   up close to the cards — feedback deck slide 4. */
	padding: 2rem 0 0;
}

.cuhk-key-figures__description {
	max-width: 900px;
	margin: 0 auto var(--wp--preset--spacing--50, 1.75rem);
	text-align: center;
	color: var(--wp--preset--color--text-secondary, #666);
	font-size: 1rem;
	line-height: 1.6;
}

.cuhk-key-figures__grid {
	display: grid;
	gap: 1.5rem;
	max-width: 960px;
	margin: 0 auto;
}

.cuhk-key-figure {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 2.5rem 1.5rem;
	background: #EDF2F5;
	border-radius: 4px;
	border: none;
}

.cuhk-key-figure__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1rem;
	width: 88px;
	height: 88px;
}

.cuhk-key-figure__icon img {
	/* Size every icon to the same square bounding box so glyphs with different
	   aspect ratios (graduates 48x56, alumni-groups 83x85, globe 76x52) read as
	   the same visual size. Constraining by height alone shrank the near-square
	   middle icon while enlarging the others — feedback deck slide 4. */
	width: 72px;
	height: 72px;
	object-fit: contain;
	display: block;
}

/* The globe figure icon is landscape (76x52); contained in the square icon
   slot it letterboxed with ~11px gaps above and below. Size it by height so it
   fills the slot vertically and reads at the same height as the other figure
   icons. Its glyph already fills its own viewBox edge to edge, so there is no
   SVG padding to trim — this is purely a fit adjustment. Matched by filename
   because the icon is set via the media library; local and prod uploads use
   different names for the same artwork (icon-figure-cuam.svg / icon-circulation.svg). */
.cuhk-key-figure__icon img[src*="icon-figure-cuam"],
.cuhk-key-figure__icon img[src*="icon-circulation"] {
	width: auto;
	height: 72px;
	max-width: none;
}

.cuhk-key-figure__number {
	font-family: 'Abhaya Libre', Georgia, serif;
	font-size: clamp(2rem, 5vw, 3rem);
	font-weight: 600;
	color: var(--wp--preset--color--primary, #58387A);
	line-height: 1.1;
	margin-bottom: 0.75rem;
}

.cuhk-key-figure__label {
	font-size: 0.875rem;
	color: var(--wp--preset--color--text-secondary, #666);
	font-weight: 400;
	line-height: 1.4;
}

.cuhk-key-figures-disclaimer {
	max-width: 960px;
	margin: 1rem auto 0;
	text-align: right;
	font-size: 0.8125rem;
	color: #9a9a9a;
}

@media (max-width: 781px) {
	.cuhk-key-figures {
		padding: 0;
		margin-left: calc(-1 * var(--wp--preset--spacing--40, 1rem));
		margin-right: calc(-1 * var(--wp--preset--spacing--40, 1rem));
	}

	.cuhk-key-figures__grid {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 0;
		max-width: none;
	}

	.cuhk-key-figure {
		box-sizing: border-box;
		min-width: 0;
		width: 100%;
		min-height: calc(100vw * 307 / 375);
		padding: 24px 16px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 16px;
		border-radius: 0;
	}

	.cuhk-key-figure:nth-child(1) {
		background: rgba(177, 211, 230, 0.25);
	}
	.cuhk-key-figure:nth-child(1) .cuhk-key-figure__number {
		color: #58387A;
	}
	.cuhk-key-figure:nth-child(1) .cuhk-key-figure__label {
		color: #58387A;
	}
	.cuhk-key-figure:nth-child(1) .cuhk-key-figure__icon img {
		filter: brightness(0);
	}

	.cuhk-key-figure:nth-child(2) {
		background: #7493A3;
	}
	.cuhk-key-figure:nth-child(2) .cuhk-key-figure__number,
	.cuhk-key-figure:nth-child(2) .cuhk-key-figure__label {
		color: #FFFFFF;
	}
	.cuhk-key-figure:nth-child(2) .cuhk-key-figure__icon img {
		filter: brightness(0) invert(1);
	}

	.cuhk-key-figure:nth-child(3) {
		background: #163E6C;
	}
	.cuhk-key-figure:nth-child(3) .cuhk-key-figure__number,
	.cuhk-key-figure:nth-child(3) .cuhk-key-figure__label {
		color: #FFFFFF;
	}
	.cuhk-key-figure:nth-child(3) .cuhk-key-figure__icon img {
		filter: brightness(0) invert(1);
	}

	.cuhk-key-figure__icon {
		width: 72px;
		height: 72px;
		margin-bottom: 0;
	}

	.cuhk-key-figure__number {
		font-size: 48px;
		margin-bottom: 0;
	}

	.cuhk-key-figure__label {
		font-size: 16px;
		line-height: 1.4;
	}
}

/* --- language-switcher --- */

.cuhk-lang-switcher {
	position: relative;
	display: inline-flex;
	align-items: center;
}

.cuhk-lang-switcher__toggle {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	background: transparent;
	border: none;
	padding: 6px 4px;
	color: #fff;
	font-size: 0.8125rem;
	font-family: inherit;
	cursor: pointer;
	transition: opacity 0.15s ease;
	line-height: 1;
}

.cuhk-lang-switcher__toggle:hover {
	opacity: 0.8;
}

.cuhk-lang-switcher__toggle svg {
	flex-shrink: 0;
}

.cuhk-lang-switcher__chevron {
	transition: transform 0.2s ease;
}

.cuhk-lang-switcher.is-open .cuhk-lang-switcher__chevron {
	transform: rotate(180deg);
}

.cuhk-lang-switcher__dropdown {
	display: none;
	position: absolute;
	top: calc(100% + 6px);
	right: 0;
	min-width: 120px;
	background: #fff;
	border-radius: 6px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
	list-style: none;
	margin: 0;
	padding: 4px 0;
	z-index: 200;
	overflow: hidden;
}

.cuhk-lang-switcher.is-open .cuhk-lang-switcher__dropdown {
	display: block;
}

.cuhk-lang-switcher__dropdown li {
	margin: 0;
	padding: 0;
}

.cuhk-lang-switcher__option {
	display: block;
	padding: 8px 16px;
	color: #333;
	text-decoration: none;
	font-size: 0.8125rem;
	transition: background 0.1s ease;
	white-space: nowrap;
}

.cuhk-lang-switcher__option:hover {
	background: #f0f0f0;
	color: #333;
}

.cuhk-lang-switcher__option.is-active {
	font-weight: 700;
	color: #04395D;
}

/* --- mobile-menu-toggle --- */

.cuhk-mobile-menu-toggle-block {
	display: none;
}

@media screen and (max-width: 781px) {
	.cuhk-mobile-menu-toggle-block {
		display: flex;
		align-items: center;
	}
}

/* --- news-breadcrumb --- */
/* (Breadcrumb styles already present in shared section above -- skipped to avoid duplicates) */

/* --- news-list --- */

.cuhk-news-tabs {
	display: flex;
	gap: 0;
	border-bottom: 1px solid var(--wp--preset--color--border, #E0E0E0);
	margin-bottom: 40px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.cuhk-news-tabs::-webkit-scrollbar {
	display: none;
}

.cuhk-news-tabs__tab {
	padding: 12px 24px;
	font-size: 14px;
	color: var(--wp--preset--color--text-secondary, #666);
	text-decoration: none;
	white-space: nowrap;
	border-bottom: 3px solid transparent;
	transition: color 0.2s, border-color 0.2s;
	font-family: var(--wp--preset--font-family--open-sans, -apple-system, BlinkMacSystemFont, sans-serif);
}

.cuhk-news-tabs__tab:hover {
	color: var(--wp--preset--color--text-primary, #1A1A1A);
}

.cuhk-news-tabs__tab.is-active {
	font-weight: 700;
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	border-bottom-color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-news-list__items {
	display: flex;
	flex-direction: column;
}

.cuhk-news-item {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	gap: 32px;
	align-items: flex-start;
	padding: 24px 0;
}

.cuhk-news-item + .cuhk-news-item {
	border-top: 1px solid var(--wp--preset--color--border, #E0E0E0);
}

.cuhk-news-item__content {
	min-width: 0;
}

.cuhk-news-item__content:only-child {
	grid-column: 1 / -1;
}

.cuhk-news-item__title {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 8px;
	line-height: 1.4;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	font-family: var(--wp--preset--font-family--open-sans, -apple-system, BlinkMacSystemFont, sans-serif);
}

.cuhk-news-item__title a {
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	text-decoration: none;
}

.cuhk-news-item__title a:hover {
	color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-news-item__excerpt {
	font-size: 14px;
	color: var(--wp--preset--color--text-secondary, #666);
	line-height: 1.6;
	margin: 0 0 8px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	font-family: var(--wp--preset--font-family--open-sans, -apple-system, BlinkMacSystemFont, sans-serif);
}

.cuhk-news-item__date {
	display: block;
	font-size: 13px;
	color: var(--wp--preset--color--primary, #4B2E83);
	font-family: var(--wp--preset--font-family--open-sans, -apple-system, BlinkMacSystemFont, sans-serif);
}

.cuhk-news-item__image {
	min-width: 0;
	width: 100%;
}

.cuhk-news-item__image a {
	display: block;
}

.cuhk-news-item__image img {
	width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
	object-fit: cover;
	display: block;
	border-radius: var(--wp--custom--border-radius--medium, 8px);
}

.cuhk-news-pagination {
	margin-top: 48px;
	text-align: center;
}

.cuhk-news-pagination ul {
	display: flex;
	justify-content: center;
	gap: 4px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.cuhk-news-pagination li {
	margin: 0;
}

.cuhk-news-pagination a,
.cuhk-news-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	font-size: 14px;
	text-decoration: none;
	border: 1px solid var(--wp--preset--color--border, #E0E0E0);
	border-radius: 4px;
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	transition: background-color 0.2s, border-color 0.2s, color 0.2s;
	font-family: var(--wp--preset--font-family--open-sans, -apple-system, BlinkMacSystemFont, sans-serif);
}

.cuhk-news-pagination a:hover {
	background-color: var(--wp--preset--color--background-light, #F7F7F7);
	border-color: var(--wp--preset--color--primary, #4B2E83);
	color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-news-pagination .current {
	background-color: var(--wp--preset--color--primary, #4B2E83);
	border-color: var(--wp--preset--color--primary, #4B2E83);
	color: #fff;
}

.cuhk-news-list__empty {
	text-align: center;
	color: var(--wp--preset--color--text-secondary, #666);
	padding: 3rem 1rem;
	font-size: 16px;
}

@media (max-width: 768px) {
	.cuhk-news-item {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.cuhk-news-item__image {
		order: -1;
		width: 100%;
	}

	.cuhk-news-item__image img {
		aspect-ratio: 16 / 9;
		height: auto;
	}

	.cuhk-news-tabs__tab {
		padding: 10px 16px;
		font-size: 13px;
	}
}

/* --- Latest Discounts: card grid --- */

.cuhk-discount-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
	margin-top: 8px;
}

.cuhk-discount-card {
	display: grid;
	grid-template-columns: minmax(120px, 40%) 1fr;
	align-items: stretch;
	min-height: 150px;
	background: #fff;
	border: 1px solid var(--wp--preset--color--border, #E0E0E0);
	border-radius: var(--wp--custom--border-radius--medium, 8px);
	overflow: hidden;
	transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.cuhk-discount-card:hover {
	border-color: var(--wp--preset--color--primary, #4B2E83);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}

.cuhk-discount-card__media {
	display: block;
	overflow: hidden;
	background: var(--wp--preset--color--background-light, #F2F2F2);
}

.cuhk-discount-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.cuhk-discount-card__placeholder {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 150px;
	background: linear-gradient(135deg, var(--wp--preset--color--primary, #4B2E83) 0%, #7a5aa6 100%);
	opacity: 0.85;
}

.cuhk-discount-card__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 16px;
	padding: 24px;
	min-width: 0;
}

.cuhk-discount-card__title {
	margin: 0;
	font-family: 'Abhaya Libre', Georgia, 'Noto Serif TC', 'Noto Serif SC', serif;
	font-size: 22px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--wp--preset--color--text-primary, #1A1A1A);
}

.cuhk-discount-card__title a {
	color: inherit;
	text-decoration: none;
}

.cuhk-discount-card__title a:hover {
	color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-discount-card__btn {
	display: inline-block;
	padding: 8px 22px;
	border: 1px solid var(--wp--preset--color--text-primary, #1A1A1A);
	background: transparent;
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	font-family: var(--wp--preset--font-family--open-sans, 'Open Sans', sans-serif);
	font-size: 13px;
	letter-spacing: 0.02em;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}

.cuhk-discount-card__btn:hover {
	background: var(--wp--preset--color--text-primary, #1A1A1A);
	color: #fff;
}

/* --- Latest Discounts: disclaimer --- */

.cuhk-discount-disclaimer {
	margin-top: 48px;
	padding-top: 24px;
	border-top: 1px solid var(--wp--preset--color--border, #E0E0E0);
	color: var(--wp--preset--color--text-secondary, #666);
	font-family: var(--wp--preset--font-family--open-sans, 'Open Sans', sans-serif);
	font-size: 13px;
	line-height: 1.7;
}

.cuhk-discount-disclaimer p {
	margin: 0 0 8px;
}

.cuhk-discount-disclaimer p:last-child {
	margin-bottom: 0;
}

@media (max-width: 768px) {
	.cuhk-discount-grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.cuhk-discount-card {
		grid-template-columns: minmax(96px, 38%) 1fr;
	}

	.cuhk-discount-card__body {
		padding: 16px;
		gap: 12px;
	}

	.cuhk-discount-card__title {
		font-size: 18px;
	}
}

/* --- alumni-stories section background --- */

.cuhk-alumni-stories-section {
	background-color: #B1D3E6;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* --- story-cards --- */

.cuhk-story-cards {
	position: relative;
	overflow: hidden;
}

.cuhk-story-cards__track {
	display: flex;
	gap: 1.25rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding-bottom: 0.5rem;
	flex: 1;
	max-width: 70%;
	margin: 0 auto;
}

.cuhk-story-cards__track::-webkit-scrollbar {
	display: none;
}

.cuhk-story-card {
	display: flex;
	flex-direction: column;
	flex: 0 0 calc(25% - 1rem);
	scroll-snap-align: start;
	background: #fff;
	border-radius: 0;
	overflow: hidden;
	transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.cuhk-story-card:hover {
	background: #B1D3E6;
	transform: translateY(-2px);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.cuhk-story-card__image {
	display: block;
	overflow: hidden;
}

.cuhk-story-card__image img {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	display: block;
	transition: transform 0.3s ease;
}

.cuhk-story-card:hover .cuhk-story-card__image img {
	transform: scale(1.05);
}

.cuhk-story-card__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 24px;
	transition: background 0.2s ease;
}

.cuhk-story-card__arrow {
	display: inline-flex;
	align-self: flex-end;
	align-items: center;
	justify-content: center;
	margin-top: auto;
	padding-top: 1rem;
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	transition: transform 0.2s ease, color 0.2s ease;
}

.cuhk-story-card__arrow:hover,
.cuhk-story-card__arrow:focus-visible {
	color: var(--wp--preset--color--primary, #58387A);
	transform: translateX(4px);
}

.cuhk-story-card__arrow svg {
	display: block;
	width: 32px;
	height: 32px;
}

.cuhk-story-card__name {
	font-family: 'Abhaya Libre', Georgia, serif;
	font-size: 1.25rem;
	font-weight: 600;
	letter-spacing: 0.4px;
	margin: 0 0 0.5rem;
}

.cuhk-story-card__name a {
	color: var(--wp--preset--color--primary, #4B2E83);
	text-decoration: none;
}

.cuhk-story-card__name a:hover {
	color: var(--wp--preset--color--primary-dark, #3A2368);
}

.cuhk-story-card__meta {
	font-size: 0.8125rem;
	color: var(--wp--preset--color--text-secondary, #666);
	margin: 0 0 0.5rem;
	line-height: 1.4;
}

.cuhk-story-card__quote {
	font-size: 0.8125rem;
	color: var(--wp--preset--color--text-secondary, #666);
	font-style: italic;
	margin: 0;
	line-height: 1.5;
}

.cuhk-story-card__excerpt {
	font-size: 0.8125rem;
	color: var(--wp--preset--color--text-secondary, #666);
	margin: 0;
	line-height: 1.5;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.cuhk-story-cards__empty {
	text-align: center;
	color: var(--wp--preset--color--text-secondary, #666);
	padding: 2rem;
}

/* Carousel navigation arrows -- mobile only (shown in <=781px breakpoint) */
.cuhk-story-cards .cuhk-carousel__prev,
.cuhk-story-cards .cuhk-carousel__next {
	display: none;
}

@media (max-width: 1024px) {
	.cuhk-story-card {
		flex: 0 0 calc(33.333% - 1rem);
	}
}

@media (max-width: 781px) {
	.cuhk-story-cards {
		overflow: visible;
		position: relative;
	}

	.cuhk-story-cards__track {
		max-width: 100%;
		width: 100%;
		gap: 0;
		padding: 0;
		margin: 0 auto;
		flex: none;
		scroll-snap-type: x mandatory;
		box-sizing: border-box;
		width: calc(100% - 80px);
	}

	.cuhk-story-card {
		flex: 0 0 100%;
		min-width: 0;
		background: #B1D3E6;
		border-radius: 0;
		scroll-snap-align: start;
	}

	.cuhk-story-card:hover {
		transform: none;
		box-shadow: none;
	}

	.cuhk-story-card__image img {
		height: auto;
		aspect-ratio: 1 / 1;
	}

	.cuhk-story-card__body {
		display: grid;
		grid-template-columns: 1fr auto;
		grid-template-areas:
			"name arrow"
			"meta meta"
			"excerpt excerpt";
		column-gap: 16px;
		row-gap: 8px;
		align-items: center;
		padding: 24px;
	}

	.cuhk-story-card__name {
		grid-area: name;
		font-size: 1.25rem;
		font-weight: 600;
		letter-spacing: 0.4px;
		margin: 0;
	}

	.cuhk-story-card__meta {
		grid-area: meta;
		font-size: 1rem;
		line-height: 1.8;
	}

	.cuhk-story-card__excerpt,
	.cuhk-story-card__quote {
		grid-area: excerpt;
		font-size: 0.875rem;
		line-height: 1.5;
		max-height: 72px;
		overflow: hidden;
	}

	.cuhk-story-card__arrow {
		grid-area: arrow;
		align-self: center;
		justify-self: end;
		width: 44px;
		height: 44px;
		padding: 0;
		margin: 0;
		border: 1px solid #FFFFFF;
		color: var(--wp--preset--color--text-primary, #1A1A1A);
	}

	.cuhk-story-card__arrow:hover,
	.cuhk-story-card__arrow:focus-visible {
		transform: none;
	}

	.cuhk-story-card__arrow svg {
		width: 18px;
		height: 18px;
	}

	/* Arrows on left/right edges of the card area (mobile only) */
	.cuhk-story-cards .cuhk-carousel__prev,
	.cuhk-story-cards .cuhk-carousel__next {
		display: flex;
		position: absolute;
		top: 40%;
		transform: translateY(-50%);
		border: none;
		background: transparent;
		cursor: pointer;
		align-items: center;
		justify-content: center;
		z-index: 2;
		padding: 0;
	}

	.cuhk-story-cards .cuhk-carousel__prev {
		left: 4px;
	}

	.cuhk-story-cards .cuhk-carousel__next {
		right: 4px;
	}

	.cuhk-story-cards .cuhk-carousel__prev img,
	.cuhk-story-cards .cuhk-carousel__next img {
		width: 16px;
		height: 28px;
		filter: brightness(0);
	}

	.cuhk-story-cards .cuhk-carousel__prev:hover img,
	.cuhk-story-cards .cuhk-carousel__next:hover img {
		filter: brightness(0) opacity(0.6);
	}
}

/* --- upcoming-events --- */

.cuhk-upcoming-events__grid {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	gap: 3rem;
}

.cuhk-upcoming-event {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	max-width: 480px;
	width: 100%;
	justify-self: center;
	box-sizing: border-box;
}

/* Vertical / horizontal divider between events */
.cuhk-upcoming-events__divider {
	width: 1px;
	background-color: var(--wp--preset--color--border, #E0E0E0);
}

.cuhk-upcoming-event__title {
	font-size: 1.25rem;
	font-weight: 600;
	margin: 0 0 0.5rem;
	line-height: 1.3;
}

.cuhk-upcoming-event__title a {
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	text-decoration: none;
}

.cuhk-upcoming-event__title a:hover {
	color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-upcoming-event__date {
	font-size: 0.875rem;
	color: var(--wp--preset--color--text-secondary, #666);
	margin: 0 0 1.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
}

.cuhk-upcoming-event__date-icon {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
}

.cuhk-upcoming-event__excerpt {
	font-size: 0.875rem;
	color: var(--wp--preset--color--text-secondary, #666);
	line-height: 1.6;
	border-top: 1px solid var(--wp--preset--color--border, #E0E0E0);
	padding-top: 1.5rem;
	margin-bottom: 1.5rem;
}

.cuhk-upcoming-event__excerpt p {
	margin: 0;
}

.cuhk-upcoming-event__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: auto;
	padding: 0.5rem 0.75rem;
	color: var(--wp--preset--color--text-primary, #1A1A1A);
	transition: transform 0.2s ease, color 0.2s ease;
}

.cuhk-upcoming-event__arrow:hover,
.cuhk-upcoming-event__arrow:focus-visible {
	color: var(--wp--preset--color--primary, #58387A);
	transform: translateX(4px);
}

.cuhk-upcoming-event__arrow svg {
	display: block;
	width: 24px;
	height: 24px;
}

.cuhk-upcoming-events__empty {
	text-align: center;
	color: var(--wp--preset--color--text-secondary, #666);
	padding: 2rem;
}

/* Mobile-only "View All" CTA below the upcoming events grid. */
.cuhk-upcoming-events-cta {
	display: flex !important;
	justify-content: center;
	margin-top: var(--wp--preset--spacing--60);
}

@media (max-width: 781px) {
	/* Slightly wider side padding so the bordered cards breathe. */
	.cuhk-upcoming-events-section {
		padding-left: var(--wp--preset--spacing--50) !important;
		padding-right: var(--wp--preset--spacing--50) !important;
	}

	.cuhk-upcoming-events__grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	/* Hide vertical divider on mobile */
	.cuhk-upcoming-events__divider {
		display: none;
	}

	/* Bordered cards on mobile */
	.cuhk-upcoming-event {
		border: 1px solid #ddd;
		padding: 24px;
	}

	.cuhk-upcoming-event__title {
		font-size: 1.25rem;
		color: #251E4E;
	}

	.cuhk-upcoming-event__date {
		font-size: 0.875rem;
		color: #696984;
	}

	.cuhk-upcoming-event__excerpt {
		font-size: 0.75rem;
		color: #696984;
		border-top: none;
		padding-top: 0;
	}

	.cuhk-upcoming-events-cta {
		display: flex !important;
	}
}

/* =========================================
   Search Page
   ========================================= */

/* Solid header on search page (not transparent) */
.search .cuhk-site-header {
	position: relative;
	top: auto;
	background: #fff !important;
	border-bottom: 1px solid var(--wp--preset--color--border);
}

.search.admin-bar .cuhk-site-header {
	top: auto;
}

/* White text links become dark on solid header */
.search .cuhk-site-header a,
.search .cuhk-site-header .cuhk-primary-nav a {
	color: var(--wp--preset--color--text-primary);
}

.cuhk-search-page {
	max-width: 1000px;
	margin: 0 auto;
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40) var(--wp--preset--spacing--70);
}

/* Search bar */
.cuhk-search-bar {
	margin-bottom: var(--wp--preset--spacing--50);
}

.cuhk-search-bar form {
	position: relative;
	display: flex;
	align-items: center;
}

.cuhk-search-bar__icon {
	position: absolute;
	left: 16px;
	pointer-events: none;
}

.cuhk-search-bar__input {
	width: 100%;
	padding: 14px 16px 14px 48px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 0;
	font-family: var(--wp--preset--font-family--abhaya-libre);
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--text-primary);
	background: #fff;
	outline: none;
}

.cuhk-search-bar__input:focus {
	border-color: var(--wp--preset--color--primary);
}

.cuhk-search-bar__input::placeholder {
	color: #999;
}

/* Results count */
.cuhk-search-results-count {
	display: flex;
	align-items: center;
	gap: 16px;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--text-secondary);
	margin-bottom: var(--wp--preset--spacing--40);
	white-space: nowrap;
}

.cuhk-search-results-count::after {
	content: '';
	flex: 1;
	height: 1px;
	background: var(--wp--preset--color--border);
}

/* Search result cards */
.cuhk-search-card {
	display: flex;
	gap: var(--wp--preset--spacing--40);
	padding: var(--wp--preset--spacing--40) 0;
	border-bottom: 1px solid var(--wp--preset--color--border);
	align-items: flex-start;
}

.cuhk-search-card__content {
	flex: 1;
	min-width: 0;
}

.cuhk-search-card__title {
	font-family: var(--wp--preset--font-family--abhaya-libre);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	line-height: 1.4;
	margin: 0 0 8px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.cuhk-search-card__title a {
	color: var(--wp--preset--color--text-primary);
	text-decoration: none;
}

.cuhk-search-card__title a:hover {
	color: var(--wp--preset--color--primary);
}

.cuhk-search-card__excerpt {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--text-secondary);
	line-height: 1.6;
	margin: 0 0 8px;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.cuhk-search-card__excerpt a {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
}

.cuhk-search-highlight {
	background: transparent;
	color: #0F62FE;
	font-weight: inherit;
	padding: 0;
}

.cuhk-search-card__date {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--text-secondary);
}

.cuhk-search-card__thumb {
	flex-shrink: 0;
	width: 120px;
	height: 90px;
	overflow: hidden;
}

.cuhk-search-card__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Pagination */
.cuhk-search-pagination {
	margin-top: var(--wp--preset--spacing--60);
	display: flex;
	justify-content: center;
}

/* No results */
.cuhk-search-no-results {
	text-align: center;
	padding: var(--wp--preset--spacing--80) 0;
}

.cuhk-search-no-results__text {
	font-family: var(--wp--preset--font-family--abhaya-libre);
	font-size: var(--wp--preset--font-size--x-large);
	color: var(--wp--preset--color--text-primary);
	margin: 0 0 var(--wp--preset--spacing--40);
}

.cuhk-search-no-results__btn {
	display: inline-block;
	padding: 10px 28px;
	border: 1px solid var(--wp--preset--color--text-primary);
	color: var(--wp--preset--color--text-primary);
	text-decoration: none;
	font-size: var(--wp--preset--font-size--small);
	font-family: var(--wp--preset--font-family--abhaya-libre);
	transition: background 0.2s, color 0.2s;
}

.cuhk-search-no-results__btn:hover {
	background: var(--wp--preset--color--text-primary);
	color: #fff;
}

/* Mobile */
@media (max-width: 600px) {
	.cuhk-search-card {
		flex-direction: column-reverse;
	}

	.cuhk-search-card__thumb {
		width: 100%;
		height: 180px;
	}
}

/* =========================================
   Single Event
   ========================================= */

.cuhk-single-event {
	max-width: 720px;
	margin: 0 auto;
	padding: 0 24px 80px;
}

.cuhk-single-event__breadcrumb-wrap {
	max-width: 1400px;
	margin: 0 auto;
	padding: 48px var(--wp--preset--spacing--40) 0;
}

.admin-bar.single-event .cuhk-single-event__breadcrumb-wrap {
	padding-top: 80px;
}

.cuhk-single-event__breadcrumb {
	margin-bottom: 28px;
}

.cuhk-single-event__article {
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-single-event__eyebrow {
	font-size: 14px;
	color: var(--wp--preset--color--text-secondary, #666);
	margin: 0 0 12px;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

.cuhk-single-event__title {
	font-family: 'Abhaya Libre', Georgia, 'Times New Roman', serif;
	font-size: 32px;
	line-height: 1.25;
	font-weight: 600;
	margin: 0 0 20px;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-single-event__lead {
	font-size: 16px;
	line-height: 1.6;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	margin-bottom: 28px;
	font-weight: 500;
}

.cuhk-single-event__lead p {
	margin: 0 0 12px;
}

.cuhk-single-event__lead a {
	color: var(--wp--preset--color--accent, #1e6fbf);
	text-decoration: none;
}

.cuhk-single-event__lead a:hover {
	text-decoration: underline;
}

.cuhk-single-event__image {
	margin: 0 0 32px;
}

.cuhk-single-event__image img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 2px;
}

.cuhk-single-event__content {
	font-size: 16px;
	line-height: 1.7;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	margin-bottom: 40px;
}

.cuhk-single-event__content p {
	margin: 0 0 16px;
}

.cuhk-single-event__content a {
	color: var(--wp--preset--color--accent, #1e6fbf);
}

/* Imported event content uses Bootstrap-style <table class="table table-bordered">.
   With no table CSS the browser squeezed the 2-4 char CJK label column until it
   wrapped one character per line (日/期, 講/座/內/容). Keep the label column on a
   single line and give the value column the rest of the width. */
.cuhk-single-event__content table {
	border-collapse: collapse;
	margin: 0 0 16px;
}

.cuhk-single-event__content table td {
	padding: 6px 16px 6px 0;
	vertical-align: top;
}

.cuhk-single-event__content table td:first-child {
	white-space: nowrap;
	width: 1%;
	font-weight: 600;
}

.cuhk-single-event__details {
	margin-top: 16px;
}

.cuhk-single-event__details-heading {
	font-family: 'Abhaya Libre', Georgia, 'Times New Roman', serif;
	font-size: 22px;
	font-weight: 600;
	margin: 0 0 20px;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-single-event__details-list {
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.cuhk-single-event__detail {
	display: block;
}

.cuhk-single-event__detail dt {
	font-size: 14px;
	font-weight: 700;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	margin: 0 0 4px;
}

.cuhk-single-event__detail dd {
	font-size: 14px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-secondary, #555);
	margin: 0;
}

.cuhk-single-event__detail dd a {
	color: var(--wp--preset--color--accent, #1e6fbf);
	text-decoration: none;
}

.cuhk-single-event__cta-wrap {
	margin: 28px 0 8px;
}

.cuhk-single-event__divider {
	border: 0;
	border-top: 1px solid #e5e5e5;
	margin: 40px 0 32px;
}

.cuhk-single-event__disclaimer-heading {
	font-size: 14px;
	font-weight: 700;
	margin: 0 0 8px;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

.cuhk-single-event__disclaimer p {
	font-size: 13px;
	line-height: 1.6;
	color: var(--wp--preset--color--text-secondary, #666);
	margin: 0;
}

@media (max-width: 600px) {
	.cuhk-single-event {
		padding: 20px 16px 60px;
	}

	.cuhk-single-event__title {
		font-size: 26px;
	}
}

/* =========================================
   Single Album (Gallery CPT)
   ========================================= */

.cuhk-single-album {
	max-width: 1200px;
	margin: 0 auto;
	padding: 32px var(--wp--preset--spacing--40, 24px) 80px;
}

.cuhk-single-album__breadcrumb {
	margin-bottom: 24px;
}

.cuhk-single-album__title {
	font-family: 'Abhaya Libre', Georgia, 'Times New Roman', serif;
	font-size: clamp(28px, 3.2vw, 40px);
	line-height: 1.25;
	font-weight: 600;
	margin: 0 0 8px;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-single-album__date {
	font-size: 14px;
	color: var(--wp--preset--color--text-secondary, #666);
	margin: 0 0 24px;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

.cuhk-single-album__description {
	font-size: 16px;
	line-height: 1.6;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	margin-bottom: 28px;
}

.cuhk-single-album__description p {
	margin: 0 0 12px;
}

@media (max-width: 600px) {
	.cuhk-single-album {
		padding: 20px 16px 60px;
	}
}

/* =========================================
   Global Network page
   ========================================= */

/* Hero — green nature placeholder, supports 2-line title */
.cuhk-page-hero--gn {
	min-height: 360px;
	background-color: #2f5a38;
	background-image:
		radial-gradient(ellipse 60% 55% at 50% 55%, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0) 60%),
		linear-gradient(140deg, #3a6f44 0%, #2f5a38 45%, #244a2d 100%);
}

.cuhk-page-hero--gn .cuhk-page-hero__title {
	line-height: 1.05;
}

/* Entry cards row */
.cuhk-gn-entries {
	background: #fff;
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40);
}

.cuhk-gn-entries__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--wp--preset--spacing--40);
}

.cuhk-gn-entry {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--wp--preset--color--border, #e0e0e0);
	border-radius: 4px;
	background: #fff;
	text-decoration: none;
	color: inherit;
	overflow: hidden;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.cuhk-gn-entry:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	transform: translateY(-2px);
}

.cuhk-gn-entry__image {
	aspect-ratio: 16 / 9;
	background-color: #7a3b2e;
	background-image:
		radial-gradient(ellipse 45% 55% at 30% 55%, rgba(255, 210, 150, 0.45) 0%, rgba(255, 210, 150, 0) 60%),
		radial-gradient(ellipse 35% 50% at 75% 45%, rgba(180, 40, 40, 0.55) 0%, rgba(180, 40, 40, 0) 65%),
		linear-gradient(135deg, #8a4638 0%, #5c2a24 100%);
	background-size: cover;
	background-position: center;
}

.cuhk-gn-entry__image--alt {
	background-color: #7a5fa3;
	background-image:
		radial-gradient(ellipse 28% 45% at 25% 55%, rgba(210, 150, 200, 0.55) 0%, rgba(210, 150, 200, 0) 65%),
		radial-gradient(ellipse 25% 40% at 55% 50%, rgba(255, 215, 140, 0.45) 0%, rgba(255, 215, 140, 0) 65%),
		radial-gradient(ellipse 28% 45% at 80% 55%, rgba(130, 90, 170, 0.6) 0%, rgba(130, 90, 170, 0) 65%),
		linear-gradient(135deg, #8a6db0 0%, #5a3d85 100%);
	background-size: cover;
	background-position: center;
}

.cuhk-gn-entry__body {
	padding: var(--wp--preset--spacing--40);
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--20);
}

.cuhk-gn-entry__title {
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	line-height: 1.3;
}

/* Shared small arrow button */
.cuhk-arrow-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: 1px solid var(--wp--preset--color--border, #e0e0e0);
	border-radius: 0;
	background: #fff;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	line-height: 1;
	transition: background 0.15s ease, color 0.15s ease;
}

.cuhk-gn-entry:hover .cuhk-arrow-btn,
.cuhk-gn-cta__card:hover .cuhk-arrow-btn {
	background: var(--wp--preset--color--text-primary, #1a1a1a);
	color: #fff;
}

.cuhk-arrow-btn--on-lavender {
	background: transparent;
	border-color: rgba(26, 26, 26, 0.35);
}

/* How to form section */
.cuhk-gn-howto {
	background: #ADCECE;
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40);
}

.cuhk-gn-howto__inner {
	max-width: 1200px;
	margin: 0 auto;
}

.cuhk-gn-howto__title {
	margin: 0 0 var(--wp--preset--spacing--50);
	text-align: center;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: clamp(1.5rem, 1.3rem + 0.8vw, 1.875rem);
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-gn-steps {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--wp--preset--spacing--40);
}

.cuhk-gn-step {
	background: #fff;
	border-radius: 4px;
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
	display: flex;
	flex-direction: column;
}

.cuhk-gn-step__header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--30);
	margin-bottom: var(--wp--preset--spacing--10);
}

.cuhk-gn-step__number {
	font-family: 'Abhaya Libre', Georgia, serif;
	font-size: 2rem;
	font-weight: 600;
	line-height: 1;
	color: var(--wp--preset--color--primary, #4b2e83);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #B1D3E640;
	flex-shrink: 0;
}

.cuhk-gn-step:nth-of-type(2) .cuhk-gn-step__number {
	background: #F6DF7A26;
}

.cuhk-gn-step:nth-of-type(3) .cuhk-gn-step__number {
	background: #6729A926;
}

.cuhk-gn-step__title {
	margin: 0 0 var(--wp--preset--spacing--30);
	font-family: 'Open Sans', sans-serif;
	font-size: 1.0625rem;
	font-weight: 600;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	line-height: 1.3;
}

.cuhk-gn-step__body {
	color: var(--wp--preset--color--text-secondary, #555);
	font-size: 0.8125rem;
	line-height: 1.55;
}

.cuhk-gn-step__body p {
	margin: 0.35em 0 0;
}

.cuhk-gn-step__body p:first-child {
	margin-top: 0;
}

.cuhk-gn-step__body ul,
.cuhk-gn-step__body ol {
	margin: 0.35em 0 0;
	padding-left: 1.1em;
}

.cuhk-gn-step__body ul:first-child,
.cuhk-gn-step__body ol:first-child {
	margin-top: 0;
}

.cuhk-gn-step__body ul {
	list-style: disc;
}

.cuhk-gn-step__body li + li {
	margin-top: 0.35em;
}

/* Alumni Associations Centre CTA */
.cuhk-gn-cta {
	background: #fff;
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40) var(--wp--preset--spacing--70);
}

.cuhk-gn-cta__inner {
	max-width: 1200px;
	margin: 0 auto;
}

.cuhk-gn-cta__card {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: stretch;
	border-radius: 4px;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: box-shadow 0.2s ease;
}

.cuhk-gn-cta__card:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.cuhk-gn-cta__image {
	min-height: 200px;
	background: #d8c6b4
		linear-gradient(135deg, rgba(180, 150, 110, 0.35) 0%, rgba(90, 70, 50, 0.25) 100%);
	background-size: cover;
	background-position: center;
}

.cuhk-gn-cta__body {
	background: #FCFBF9;
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--50);
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: var(--wp--preset--spacing--30);
}

.cuhk-gn-cta__title {
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

/* Tablet */
@media (max-width: 960px) {
	.cuhk-gn-steps {
		grid-template-columns: 1fr;
	}
}

/* Mobile */
@media (max-width: 720px) {
	.cuhk-gn-entries__inner {
		grid-template-columns: 1fr;
	}
	.cuhk-gn-cta__card {
		grid-template-columns: 1fr;
	}
	.cuhk-gn-cta__image {
		min-height: 180px;
	}
	.cuhk-page-hero--gn {
		min-height: 280px;
	}
}

/* ============================================================
   Video Lightbox (CUHK Stories YouTube player)
   ============================================================ */

.cuhk-video-lightbox {
	position: fixed;
	inset: 0;
	z-index: 10003;
	background: rgba(0, 0, 0, 0.85);
	display: none;
	align-items: center;
	justify-content: center;
	padding: 24px;
}

.cuhk-video-lightbox:not([hidden]).is-open {
	display: flex;
}

.cuhk-video-lightbox__frame-wrap {
	position: relative;
	width: min(1100px, 92vw);
	aspect-ratio: 16 / 9;
	max-height: 86vh;
	background: #000;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}

.cuhk-video-lightbox__iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.cuhk-video-lightbox__close {
	position: absolute;
	top: 16px;
	right: 16px;
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	color: #1a1a1a;
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cuhk-video-lightbox__close:hover,
.cuhk-video-lightbox__close:focus-visible {
	background: #fff;
	outline: 2px solid #58387a;
	outline-offset: 2px;
}

body.cuhk-video-lightbox-open {
	overflow: hidden;
}

/* Reset button styling when used as a video trigger so existing card/figure
   layouts are preserved. */
button.cuhk-video-trigger {
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
	cursor: pointer;
	font: inherit;
	color: inherit;
	text-align: inherit;
	display: block;
	width: 100%;
}

button.cuhk-video-trigger:focus-visible {
	outline: 2px solid #58387a;
	outline-offset: 2px;
}

/* Inspire-card title rendered as a button should look like the original link
   (inline, not the full-width block from the generic .cuhk-video-trigger reset). */
.cuhk-inspire-card__title-btn {
	display: inline;
	width: auto;
	color: inherit;
	font: inherit;
	text-decoration: none;
	cursor: pointer;
}

.cuhk-inspire-card__title-btn:hover,
.cuhk-inspire-card__title-btn:focus-visible {
	text-decoration: underline;
}

/* ============================================================
   Alumni Associations Archive
   ============================================================ */
.cuhk-aa-archive {
	background: #fbf8f4;
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40) var(--wp--preset--spacing--70);
}

.cuhk-aa-archive__inner {
	max-width: 1200px;
	margin: 0 auto;
}

.cuhk-aa-breadcrumb {
	font-size: 0.875rem;
	color: #555;
	margin-bottom: var(--wp--preset--spacing--50);
}

.cuhk-aa-breadcrumb a {
	color: #555;
	text-decoration: none;
}

.cuhk-aa-breadcrumb a:hover {
	color: var(--wp--preset--color--primary, #4b2e83);
}

.cuhk-aa-breadcrumb__sep {
	margin: 0 8px;
	color: #999;
}

.cuhk-aa-breadcrumb__current {
	color: #1a1a1a;
}

/* Tabs */
.cuhk-aa-tabs {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 auto var(--wp--preset--spacing--50);
	max-width: 900px;
	border-bottom: 1px solid #e5e0d8;
}

.cuhk-aa-tabs__nav {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: none;
	color: #555;
	cursor: pointer;
	border-radius: 50%;
	transition: background 0.2s ease, color 0.2s ease;
}

.cuhk-aa-tabs__nav:hover {
	background: rgba(0, 0, 0, 0.04);
	color: var(--wp--preset--color--primary, #4b2e83);
}

.cuhk-aa-tabs__nav[disabled] {
	opacity: 0.3;
	cursor: default;
}

.cuhk-aa-tabs__track {
	flex: 1;
	display: flex;
	gap: 0;
	overflow-x: auto;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.cuhk-aa-tabs__track::-webkit-scrollbar {
	display: none;
}

.cuhk-aa-tab {
	flex-shrink: 0;
	background: transparent;
	border: none;
	border-bottom: 2px solid transparent;
	padding: 12px 18px;
	font-size: 0.9375rem;
	color: #555;
	cursor: pointer;
	white-space: nowrap;
	transition: color 0.2s ease, border-color 0.2s ease;
	margin-bottom: -1px;
}

.cuhk-aa-tab:hover {
	color: var(--wp--preset--color--primary, #4b2e83);
}

.cuhk-aa-tab.is-active {
	color: var(--wp--preset--color--primary, #4b2e83);
	border-bottom-color: var(--wp--preset--color--primary, #4b2e83);
	font-weight: 500;
}

/* Card grid */
.cuhk-aa-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin: 0 auto;
	max-width: 900px;
}

.cuhk-aa-card {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 110px;
	padding: 24px 20px;
	background: #ededed;
	border: none;
	border-radius: 2px;
	text-decoration: none;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	font-family: 'Abhaya Libre', Georgia, serif;
	font-size: 1.125rem;
	line-height: 1.35;
	text-align: center;
	cursor: pointer;
	transition: background 0.2s ease, transform 0.2s ease;
}

.cuhk-aa-card:hover {
	background: #e3e3e3;
	transform: translateY(-2px);
}

.cuhk-aa-card__title {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	word-break: break-word;
}

.cuhk-aa-card[hidden] {
	display: none;
}

.cuhk-aa-empty {
	text-align: center;
	color: #777;
	padding: 48px 0;
	max-width: 900px;
	margin: 0 auto;
}

/* Show more */
.cuhk-aa-more {
	display: flex;
	justify-content: center;
	margin-top: var(--wp--preset--spacing--50);
}

.cuhk-aa-more[hidden] {
	display: none;
}

.cuhk-aa-more__btn {
	background: #fff;
	border: 1px solid #cfcfcf;
	border-radius: 2px;
	padding: 10px 32px;
	font-size: 0.9375rem;
	color: #333;
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease;
}

.cuhk-aa-more__btn:hover {
	background: #f5f5f5;
	border-color: var(--wp--preset--color--primary, #4b2e83);
	color: var(--wp--preset--color--primary, #4b2e83);
}

@media (max-width: 768px) {
	.cuhk-aa-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px;
	}
}

@media (max-width: 480px) {
	.cuhk-aa-grid {
		grid-template-columns: 1fr;
	}
	.cuhk-aa-tab {
		padding: 10px 14px;
		font-size: 0.875rem;
	}
}

/* Alumni Association detail modal */
.cuhk-aa-modal[hidden] {
	display: none;
}

.cuhk-aa-modal {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
}

.cuhk-aa-modal__overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.4);
}

.cuhk-aa-modal__dialog {
	position: relative;
	background: #fff;
	border-radius: 4px;
	width: 100%;
	max-width: 900px;
	max-height: calc(100vh - 48px);
	display: flex;
	flex-direction: column;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.18);
}

.cuhk-aa-modal__header {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px 56px;
	border-bottom: 1px solid #e5e0d8;
	flex-shrink: 0;
}

.cuhk-aa-modal__title {
	margin: 0;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-size: 1.375rem;
	font-weight: 500;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	text-align: center;
	line-height: 1.3;
}

.cuhk-aa-modal__close {
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
	width: 36px;
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: none;
	color: #333;
	cursor: pointer;
	border-radius: 50%;
	transition: background 0.2s ease;
}

.cuhk-aa-modal__close:hover {
	background: rgba(0, 0, 0, 0.06);
}

.cuhk-aa-modal__body {
	padding: 24px 40px 32px;
	overflow-y: auto;
	flex: 1 1 auto;
}

.cuhk-aa-modal__list {
	margin: 0;
	display: grid;
	grid-template-columns: minmax(140px, 200px) 1fr;
	column-gap: 32px;
	row-gap: 18px;
	font-size: 0.9375rem;
	line-height: 1.5;
}

.cuhk-aa-modal__row {
	display: contents;
}

.cuhk-aa-modal__row[hidden] {
	display: none;
}

.cuhk-aa-modal__row dt {
	font-weight: 600;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-aa-modal__row dd {
	margin: 0;
	color: #333;
	word-break: break-word;
}

.cuhk-aa-modal__row dd a {
	color: var(--wp--preset--color--primary, #4b2e83);
	text-decoration: none;
}

.cuhk-aa-modal__row dd a:hover {
	text-decoration: underline;
}

.cuhk-aa-modal__members {
	margin-top: 28px;
	padding-top: 24px;
	border-top: 1px solid var(--wp--preset--color--border, #e5e5e5);
}

.cuhk-aa-modal__members[hidden] {
	display: none;
}

.cuhk-aa-modal__members-title {
	margin: 0 0 18px;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.5;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-aa-modal__members-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 20px;
}

.cuhk-aa-member {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	font-size: 0.9375rem;
	line-height: 1.5;
}

.cuhk-aa-member__avatar {
	flex: 0 0 auto;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	overflow: hidden;
	background: #f1eef6;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cuhk-aa-member__photo {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.cuhk-aa-member__initial {
	font-weight: 600;
	font-size: 1.125rem;
	color: var(--wp--preset--color--primary, #4b2e83);
}

.cuhk-aa-member__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.cuhk-aa-member__name {
	font-weight: 600;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-aa-member__role {
	color: #555;
}

.cuhk-aa-member__contact {
	display: flex;
	flex-wrap: wrap;
	column-gap: 16px;
	row-gap: 2px;
	word-break: break-word;
}

.cuhk-aa-member__link {
	position: relative;
	color: var(--wp--preset--color--primary, #4b2e83);
	text-decoration: none;
}

.cuhk-aa-member__link:hover {
	text-decoration: underline;
}

/* Middot sits in the flex gap, outside the link box, so hovering the link
   doesn't underline the separator. */
.cuhk-aa-member__link + .cuhk-aa-member__link::before {
	content: "·";
	position: absolute;
	left: -9px;
	color: #999;
}

body.cuhk-aa-modal-open {
	overflow: hidden;
}

@media (max-width: 640px) {
	.cuhk-aa-modal {
		padding: 12px;
	}
	.cuhk-aa-modal__header {
		padding: 18px 44px;
	}
	.cuhk-aa-modal__title {
		font-size: 1.125rem;
	}
	.cuhk-aa-modal__body {
		padding: 18px 20px 24px;
	}
	.cuhk-aa-modal__list {
		grid-template-columns: 1fr;
		row-gap: 4px;
		column-gap: 0;
	}
	.cuhk-aa-modal__row dt {
		margin-top: 12px;
	}
	.cuhk-aa-modal__row:first-child dt {
		margin-top: 0;
	}
	.cuhk-aa-modal__members {
		margin-top: 20px;
		padding-top: 18px;
	}
	/* Stack the contact links so the middot never wraps to a line start. */
	.cuhk-aa-member__contact {
		flex-direction: column;
		column-gap: 0;
	}
	.cuhk-aa-member__link + .cuhk-aa-member__link::before {
		content: none;
	}
}

/* =========================================
   Communication landing page
   ========================================= */

.cuhk-page-hero--comm {
	background-color: #7a5546;
	background-image:
		radial-gradient(ellipse 55% 70% at 60% 50%, rgba(255, 200, 130, 0.55) 0%, rgba(255, 200, 130, 0) 60%),
		radial-gradient(ellipse 40% 60% at 85% 60%, rgba(60, 100, 130, 0.55) 0%, rgba(60, 100, 130, 0) 65%),
		linear-gradient(110deg, #6f4438 0%, #8a6552 45%, #4f5a6a 100%);
}

/* Primary 2-up cards */
.cuhk-comm-primary {
	background: #fff;
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40) var(--wp--preset--spacing--40);
}

.cuhk-comm-primary__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--wp--preset--spacing--40);
}

.cuhk-comm-card {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--wp--preset--color--border, #e0e0e0);
	border-radius: 4px;
	background: #fff;
	text-decoration: none;
	color: inherit;
	overflow: hidden;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.cuhk-comm-card:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	transform: translateY(-2px);
}

.cuhk-comm-card__image {
	aspect-ratio: 16 / 9;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.cuhk-comm-card__image--cuam {
	background-color: #8a7a5b;
	background-image:
		radial-gradient(ellipse 45% 55% at 35% 50%, rgba(255, 235, 180, 0.55) 0%, rgba(255, 235, 180, 0) 60%),
		radial-gradient(ellipse 35% 50% at 70% 55%, rgba(120, 95, 55, 0.45) 0%, rgba(120, 95, 55, 0) 60%),
		linear-gradient(135deg, #b8a784 0%, #6f5a3d 100%);
}

.cuhk-comm-card__image--stories {
	background-color: #8a3025;
	background-image:
		radial-gradient(ellipse 50% 50% at 45% 50%, rgba(255, 220, 200, 0.45) 0%, rgba(255, 220, 200, 0) 60%),
		radial-gradient(ellipse 35% 45% at 75% 55%, rgba(200, 60, 50, 0.55) 0%, rgba(200, 60, 50, 0) 60%),
		linear-gradient(135deg, #a23a2c 0%, #5e1f17 100%);
}

.cuhk-comm-card__body {
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
}

.cuhk-comm-card__title {
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 1rem;
	font-weight: 500;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	line-height: 1.3;
}

/* Secondary 3-up mini cards */
.cuhk-comm-secondary {
	background: #fff;
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40) var(--wp--preset--spacing--70);
}

.cuhk-comm-secondary__inner {
	max-width: 1200px;
	margin: 0 auto;
}

.cuhk-comm-secondary__intro {
	margin: 0 0 var(--wp--preset--spacing--40);
	text-align: center;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 500;
	font-size: clamp(1.25rem, 1.05rem + 0.6vw, 1.5rem);
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	line-height: 1.4;
}

.cuhk-comm-secondary__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--wp--preset--spacing--40);
}

.cuhk-comm-mini {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	color: inherit;
	transition: transform 0.2s ease;
}

.cuhk-comm-mini:hover {
	transform: translateY(-2px);
}

.cuhk-comm-mini__image {
	aspect-ratio: 4 / 3;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #d0d0d0;
}

.cuhk-comm-mini__image--matters {
	background-color: #7a8aa3;
	background-image:
		radial-gradient(ellipse 40% 60% at 40% 55%, rgba(255, 220, 190, 0.55) 0%, rgba(255, 220, 190, 0) 60%),
		radial-gradient(ellipse 50% 50% at 75% 50%, rgba(180, 200, 220, 0.45) 0%, rgba(180, 200, 220, 0) 60%),
		linear-gradient(135deg, #98a8c1 0%, #5e6f8a 100%);
}

.cuhk-comm-mini__image--publications {
	background-color: #cccccc;
	background-image: linear-gradient(135deg, #d8d8d8 0%, #b8b8b8 100%);
}

.cuhk-comm-mini__image--submit {
	background-color: #c9b88a;
	background-image:
		radial-gradient(ellipse 60% 50% at 50% 60%, rgba(255, 240, 200, 0.7) 0%, rgba(255, 240, 200, 0) 65%),
		linear-gradient(135deg, #e3d3a8 0%, #b8a574 100%);
}

.cuhk-comm-mini__body {
	padding: var(--wp--preset--spacing--20) 0 0;
}

.cuhk-comm-mini__title {
	display: inline;
	font-family: 'Open Sans', sans-serif;
	font-size: 0.9375rem;
	font-weight: 400;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	line-height: 1.4;
}

.cuhk-comm-mini__external {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-left: 4px;
	vertical-align: -2px;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-comm-mini__external svg {
	width: 14px;
	height: 14px;
}

/* Tablet */
@media (max-width: 960px) {
	.cuhk-comm-secondary__grid {
		grid-template-columns: 1fr 1fr;
	}
}

/* Mobile */
@media (max-width: 720px) {
	.cuhk-comm-primary__inner {
		grid-template-columns: 1fr;
	}
	.cuhk-comm-secondary__grid {
		grid-template-columns: 1fr;
	}
}

/* =========================================
   About Page
   ========================================= */


.cuhk-about-page {
	max-width: 1200px;
	margin: 0 auto;
	padding: 32px 48px 80px;
}

.cuhk-about-page__breadcrumb {
	margin-bottom: 40px;
}

/* Single benefit — page-hero banner + body, mirrors the page templates */
.cuhk-single-benefit {
	max-width: 860px;
	margin: 0 auto;
	padding: 32px 48px 80px;
}

.cuhk-single-benefit__content {
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 15px;
	line-height: 1.7;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-single-benefit__content p {
	margin: 0 0 18px;
}

.cuhk-single-benefit__content a {
	color: #2a73d4;
	text-decoration: none;
	word-break: break-word;
}

.cuhk-single-benefit__content a:hover {
	text-decoration: underline;
}

/* Accordion text matches the post body <p> font size (15px), not the
   smaller shared FAQ size — scoped so /faqs/ keeps its own scale. */
.cuhk-single-benefit__accordion .cuhk-faq-item__question,
.cuhk-single-benefit__accordion .cuhk-faq-item__answer {
	font-size: 15px;
}

@media (max-width: 960px) {
	.cuhk-single-benefit {
		padding: 24px 32px 64px;
	}
}

.cuhk-about-intro {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 56px;
	align-items: start;
}

.cuhk-about-intro__content {
	min-width: 0;
}

/* Native content (the_content) rendered inside the intro column. */
.cuhk-about-intro__content > :first-child {
	margin-top: 0;
}

.cuhk-about-intro__content > :last-child {
	margin-bottom: 0;
}

.cuhk-about-intro__content h2,
.cuhk-about-intro__content h3 {
	margin: 0 0 28px;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: clamp(22px, 2vw, 28px);
	line-height: 1.35;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-about-intro__content h3 {
	font-size: clamp(18px, 1.6vw, 22px);
	margin: 32px 0 16px;
}

.cuhk-about-intro__content p {
	margin: 0 0 20px;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 15px;
	line-height: 1.65;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-about-intro__content strong {
	font-weight: 700;
}

.cuhk-about-intro__content ul,
.cuhk-about-intro__content ol {
	margin: 0 0 20px;
	padding-left: 22px;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 15px;
	line-height: 1.65;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-about-intro__content ul {
	list-style: disc;
}

.cuhk-about-intro__content li {
	margin: 0 0 8px;
}

.cuhk-about-intro__content a {
	color: #2a73d4;
	text-decoration: none;
}

.cuhk-about-intro__content a:hover {
	text-decoration: underline;
}

.cuhk-about-intro__image {
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 3;
	background-color: #d6b89a;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 4px;
	overflow: hidden;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
}

.cuhk-about-intro__image-caption {
	display: inline-block;
	margin: 24px;
	padding: 6px 12px;
	background: rgba(255, 255, 255, 0.85);
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	border-radius: 2px;
}

.cuhk-about-divider {
	margin: 56px 0;
	border: 0;
	border-top: 1px solid var(--wp--preset--color--border, #e0e0e0);
}

.cuhk-about-contact {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 56px;
	align-items: start;
}

.cuhk-about-contact__map {
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 3;
	background: #f0f0f0;
	border-radius: 4px;
	overflow: hidden;
}

.cuhk-about-contact__map iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.cuhk-about-contact__info {
	min-width: 0;
}

.cuhk-about-contact__title {
	margin: 0 0 24px;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: clamp(22px, 2vw, 28px);
	line-height: 1.3;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-about-contact__list {
	margin: 0 0 32px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 15px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-about-contact__row {
	display: flex;
	gap: 12px;
	align-items: baseline;
	flex-wrap: wrap;
}

.cuhk-about-contact__row dt {
	margin: 0;
	font-weight: 700;
	/* wide enough to fit the longest label ("Address") so every value column
	   aligns — Address now shares this dt/dd row layout with Phone/Fax/Email. */
	min-width: 72px;
}

.cuhk-about-contact__row dd {
	margin: 0;
}

.cuhk-about-contact__row a {
	color: #2a73d4;
	text-decoration: none;
}

.cuhk-about-contact__row a:hover {
	text-decoration: underline;
}

.cuhk-about-contact__note {
	color: var(--wp--preset--color--text-secondary, #666);
	font-weight: 400;
}

.cuhk-about-contact__office-title {
	margin: 0 0 12px;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 16px;
	font-weight: 700;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-about-contact__address-title {
	margin: 0 0 4px;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 16px;
	font-weight: 700;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-about-contact__address {
	margin: 0;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif;
	font-style: normal;
	font-size: 15px;
	line-height: 1.65;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-about-contact__hours {
	margin: 24px 0 0;
}

.cuhk-about-contact__hours-title {
	margin: 0 0 12px;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 16px;
	font-weight: 700;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-about-contact__hours-text {
	margin: 0;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 15px;
	line-height: 1.65;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-about-contact__enquiry-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 28px;
	padding: 14px 26px;
	border: 1px solid var(--wp--preset--color--text-primary, #1a1a1a);
	background: transparent;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 15px;
	line-height: 1.2;
	text-decoration: none;
	border-radius: 2px;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.cuhk-about-contact__enquiry-btn:hover,
.cuhk-about-contact__enquiry-btn:focus-visible {
	background: var(--wp--preset--color--primary, #4b2e83);
	border-color: var(--wp--preset--color--primary, #4b2e83);
	color: #ffffff;
}

/* Tablet */
@media (max-width: 960px) {
	.cuhk-about-page {
		padding: 24px 32px 64px;
	}
	.cuhk-about-intro,
	.cuhk-about-contact {
		gap: 40px;
	}
}

/* Mobile */
@media (max-width: 720px) {
	.cuhk-about-page {
		padding: 20px 20px 56px;
	}
	.cuhk-about-page__breadcrumb {
		margin-bottom: 28px;
	}
	.cuhk-about-intro,
	.cuhk-about-contact {
		grid-template-columns: 1fr;
		gap: 32px;
	}
	.cuhk-about-divider {
		margin: 40px 0;
	}
	.cuhk-about-intro__image,
	.cuhk-about-contact__map {
		aspect-ratio: 16 / 10;
	}
}

/* =========================================
   Alumni Stories Landing
   ========================================= */

.cuhk-page-hero--stories {
	background-color: #7a5546;
	background-image:
		radial-gradient(ellipse 55% 70% at 60% 50%, rgba(255, 200, 130, 0.55) 0%, rgba(255, 200, 130, 0) 60%),
		radial-gradient(ellipse 40% 60% at 85% 60%, rgba(60, 100, 130, 0.55) 0%, rgba(60, 100, 130, 0) 65%),
		linear-gradient(110deg, #6f4438 0%, #8a6552 45%, #4f5a6a 100%);
}

.cuhk-stories-landing {
	background: #fff;
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--40) var(--wp--preset--spacing--70);
}

.cuhk-stories-landing__inner {
	max-width: 1200px;
	margin: 0 auto;
}

.cuhk-stories-landing__intro {
	margin: 0 0 var(--wp--preset--spacing--40);
	font-family: 'Open Sans', sans-serif;
	font-size: 1rem;
	color: var(--wp--preset--color--text-secondary, #666);
	line-height: 1.5;
}

.cuhk-stories-landing__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--wp--preset--spacing--40);
}

.cuhk-stories-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: 4px;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.cuhk-stories-card:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	transform: translateY(-2px);
}

.cuhk-stories-card__image {
	aspect-ratio: 16 / 9;
	background-color: #d6c6a8;
	background-image: linear-gradient(135deg, #d6c6a8 0%, #a89070 100%);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.cuhk-stories-card__body {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	border: 1px solid var(--wp--preset--color--border, #e0e0e0);
	border-radius: 0 0 4px 4px;
}

.cuhk-stories-card__title {
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 1rem;
	font-weight: 500;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	line-height: 1.3;
}

.cuhk-stories-card__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	transition: transform 0.2s ease;
}

.cuhk-stories-card:hover .cuhk-stories-card__arrow {
	transform: translateX(2px);
}

@media (max-width: 720px) {
	.cuhk-stories-landing__grid {
		grid-template-columns: 1fr;
	}
}

/* =========================================
   Single Alumni Profile
   ========================================= */

.cuhk-profile-single {
	background: #fff;
	padding: 0 var(--wp--preset--spacing--40) 80px;
}

.admin-bar .cuhk-profile-single {
	padding-top: 0;
}

.cuhk-profile-single__breadcrumb-wrap {
	max-width: 1400px;
	margin: 0 auto;
	padding: 48px var(--wp--preset--spacing--40) 0;
}

.admin-bar.single-alumni-story .cuhk-profile-single__breadcrumb-wrap {
	padding-top: 80px;
}

.cuhk-profile-single__inner {
	max-width: 1080px;
	margin: 0 auto;
}

.cuhk-profile-single__layout {
	display: grid;
	grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
	gap: 48px;
	align-items: start;
}

.cuhk-profile-single__aside {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.cuhk-profile-single__main {
	min-width: 0;
}

.cuhk-profile-single__portrait {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.cuhk-profile-single__portrait img {
	display: block;
	width: 100%;
	height: auto;
}

.cuhk-profile-single__portrait-placeholder {
	width: 100%;
	aspect-ratio: 3 / 4;
	background: #ececec;
}

.cuhk-profile-single__socials {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 14px;
}

.cuhk-profile-single__socials a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	text-decoration: none;
	transition: color 0.15s ease;
}

.cuhk-profile-single__socials a:hover {
	color: var(--wp--preset--color--primary, #4B2E83);
}

.cuhk-profile-single__intro {
	min-width: 0;
}

.cuhk-profile-single__name {
	margin: 0 0 4px;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: clamp(28px, 3vw, 36px);
	line-height: 1.2;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-profile-single__role {
	margin: 0 0 16px;
	font-family: 'Open Sans', sans-serif;
	font-size: 1rem;
	font-weight: 400;
	color: var(--wp--preset--color--text-secondary, #666);
}

.cuhk-profile-single__meta {
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	color: var(--wp--preset--color--text-secondary, #666);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.cuhk-profile-single__meta-sep {
	color: #ccc;
}

.cuhk-profile-single__divider {
	border: 0;
	border-top: 1px solid var(--wp--preset--color--border, #e0e0e0);
	margin: 20px 0 24px;
}

.cuhk-profile-single__body {
	font-family: 'Open Sans', sans-serif;
	font-size: 15px;
	line-height: 1.7;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	overflow-wrap: break-word;
	word-break: break-word;
}

.cuhk-profile-single__body p {
	margin: 0 0 18px;
}

.cuhk-profile-single__video {
	margin: 2rem 0;
	aspect-ratio: 16 / 9;
}

.cuhk-profile-single__video iframe {
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

.cuhk-profile-single__related {
	margin-top: 8px;
}

.cuhk-profile-single__related-title {
	margin: 0 0 16px;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: 18px;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-profile-single__related-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.cuhk-profile-single__related-link {
	display: flex;
	gap: 16px;
	align-items: center;
	padding: 12px;
	border: 1px solid var(--wp--preset--color--border, #e0e0e0);
	border-radius: 4px;
	text-decoration: none;
	color: inherit;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.cuhk-profile-single__related-link:hover {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	transform: translateY(-1px);
}

.cuhk-profile-single__related-thumb {
	flex: 0 0 64px;
	width: 64px;
	height: 64px;
	background-color: #d6c6a8;
	background-image: linear-gradient(135deg, #d6c6a8 0%, #a89070 100%);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 3px;
}

.cuhk-profile-single__related-text {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.cuhk-profile-single__related-name {
	font-family: 'Open Sans', sans-serif;
	font-size: 15px;
	font-weight: 500;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-profile-single__related-badge {
	align-self: flex-start;
	font-family: 'Open Sans', sans-serif;
	font-size: 11px;
	font-weight: 600;
	color: #8a4b14;
	background: rgba(138, 75, 20, 0.10);
	padding: 2px 8px;
	border-radius: 2px;
}

@media (max-width: 860px) {
	/* Tuck the breadcrumb up under the header instead of a large gap. */
	.cuhk-profile-single__breadcrumb-wrap {
		padding-top: 16px;
	}
	.cuhk-profile-single__layout {
		grid-template-columns: 1fr;
		gap: 28px;
	}
	/* Promote the aside's children into the grid so "Other Contents" can be
	   ordered after the body instead of stacking above it. */
	.cuhk-profile-single__aside {
		display: contents;
	}
	/* Hide the feature portrait on mobile — the body carries the imagery. */
	.cuhk-profile-single__portrait {
		display: none;
	}
	.cuhk-profile-single__main {
		order: 3;
	}
	.cuhk-profile-single__related {
		order: 4;
	}
}

/* =========================================
   CUAM Archive
   ========================================= */

.cuhk-page-hero--cuam {
	background-color: #7a5546;
	background-image:
		radial-gradient(ellipse 55% 70% at 60% 50%, rgba(255, 200, 130, 0.55) 0%, rgba(255, 200, 130, 0) 60%),
		radial-gradient(ellipse 40% 60% at 85% 60%, rgba(60, 100, 130, 0.55) 0%, rgba(60, 100, 130, 0) 65%),
		linear-gradient(110deg, #6f4438 0%, #8a6552 45%, #4f5a6a 100%);
}

.cuhk-cuam-archive {
	background: #fff;
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--40) var(--wp--preset--spacing--70);
}

.cuhk-cuam-archive__inner {
	max-width: 1200px;
	margin: 0 auto;
}

.cuhk-cuam-archive__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--wp--preset--spacing--40);
}

.cuhk-cuam-archive__empty {
	margin: 32px 0;
	color: var(--wp--preset--color--text-secondary, #666);
	text-align: center;
	font-family: 'Open Sans', sans-serif;
}

.cuhk-cuam-card {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	color: inherit;
	transition: transform 0.2s ease;
}

.cuhk-cuam-card:hover {
	transform: translateY(-2px);
}

.cuhk-cuam-card__cover {
	position: relative;
	aspect-ratio: 3 / 4;
	background-color: #e0e0e0;
	background-image: linear-gradient(135deg, #ececec 0%, #cccccc 100%);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 2px;
	overflow: hidden;
}

.cuhk-cuam-card__pill {
	position: absolute;
	top: 0;
	left: 0;
	padding: 4px 10px;
	background: #8a4b14;
	color: #fff;
	font-family: 'Open Sans', sans-serif;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.cuhk-cuam-card__body {
	padding: 12px 0 0;
}

.cuhk-cuam-card__title {
	margin: 0 0 4px;
	font-family: 'Open Sans', sans-serif;
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	line-height: 1.3;
}

.cuhk-cuam-card__date {
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 12px;
	color: var(--wp--preset--color--text-secondary, #666);
}

@media (max-width: 960px) {
	.cuhk-cuam-archive__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 540px) {
	.cuhk-cuam-archive__grid {
		grid-template-columns: 1fr;
	}
}

/* Story Category type archive — thumbnail grid (mirrors the CUAM grid). */
.cuhk-story-archive {
	background: #fff;
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--40) var(--wp--preset--spacing--70);
}

.cuhk-story-archive__inner {
	max-width: 1200px;
	margin: 0 auto;
}

.cuhk-story-archive__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--wp--preset--spacing--40);
}

.cuhk-story-archive__empty {
	margin: 32px 0;
	color: var(--wp--preset--color--text-secondary, #666);
	text-align: center;
	font-family: 'Open Sans', sans-serif;
}

.cuhk-story-tile {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	color: inherit;
	transition: transform 0.2s ease;
}

.cuhk-story-tile:hover {
	transform: translateY(-2px);
}

.cuhk-story-tile__cover {
	aspect-ratio: 3 / 4;
	background-color: #e0e0e0;
	background-image: linear-gradient(135deg, #ececec 0%, #cccccc 100%);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 2px;
	overflow: hidden;
}

.cuhk-story-tile__body {
	padding: 12px 0 0;
}

.cuhk-story-tile__title {
	margin: 0 0 4px;
	font-family: 'Open Sans', sans-serif;
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	line-height: 1.3;
}

.cuhk-story-tile__meta {
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 12px;
	color: var(--wp--preset--color--text-secondary, #666);
}

@media (max-width: 960px) {
	.cuhk-story-archive__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 540px) {
	.cuhk-story-archive__grid {
		grid-template-columns: 1fr;
	}
}

/* Alumni Videos archive — CUAM-style grid of YouTube videos */
.cuhk-video-archive__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--wp--preset--spacing--40);
}

.cuhk-video-tile {
	display: flex;
	flex-direction: column;
}

.cuhk-video-tile__media {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	background-color: #cccccc;
	background-image: linear-gradient(135deg, #d8d8d8 0%, #b8b8b8 100%);
	border: 0;
	padding: 0;
	cursor: pointer;
	border-radius: 2px;
	overflow: hidden;
}

.cuhk-video-tile__thumb {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.cuhk-video-tile__play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
}

.cuhk-video-tile__body {
	padding: 12px 0 0;
}

.cuhk-video-tile__title {
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1.3;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-video-tile__title-btn {
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
	font: inherit;
	color: inherit;
	text-align: left;
	cursor: pointer;
}

.cuhk-video-tile__title-btn:hover {
	text-decoration: underline;
}

@media (max-width: 960px) {
	.cuhk-video-archive__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 540px) {
	.cuhk-video-archive__grid {
		grid-template-columns: 1fr;
	}
}

/* =========================================
   Story Category page (Profiles + Videos)
   ========================================= */

.cuhk-category {
	background: #fff;
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--40) var(--wp--preset--spacing--70);
}

.cuhk-category__inner {
	max-width: 1200px;
	margin: 0 auto;
}

.cuhk-category__section {
	margin-top: 56px;
}

.cuhk-category__section:first-of-type {
	margin-top: 24px;
}

.cuhk-category__section-head {
	margin-bottom: 24px;
}

.cuhk-category__section-head--center {
	text-align: center;
}

.cuhk-category__section-title {
	margin: 0 0 12px;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: clamp(24px, 2.4vw, 30px);
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-category__section-intro {
	margin: 0 0 16px;
	max-width: 720px;
	font-family: 'Open Sans', sans-serif;
	font-size: 15px;
	line-height: 1.6;
	color: var(--wp--preset--color--text-secondary, #666);
}

.cuhk-category__section-head--center .cuhk-category__section-intro {
	margin-left: auto;
	margin-right: auto;
}

.cuhk-category__section-cta {
	display: inline-block;
	padding: 8px 18px;
	border: 1px solid var(--wp--preset--color--text-primary, #1a1a1a);
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}

.cuhk-category__section-cta:hover {
	background: var(--wp--preset--color--text-primary, #1a1a1a);
	color: #fff;
}

.cuhk-category__videos-footer {
	margin-top: 24px;
	text-align: center;
}

.cuhk-category__videos-link {
	display: inline-block;
	padding: 8px 18px;
	border: 1px solid var(--wp--preset--color--text-primary, #1a1a1a);
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	text-decoration: none;
}

.cuhk-category__videos-link:hover {
	background: var(--wp--preset--color--text-primary, #1a1a1a);
	color: #fff;
}

.cuhk-category__empty {
	margin: 32px 0;
	color: var(--wp--preset--color--text-secondary, #666);
	text-align: center;
	font-family: 'Open Sans', sans-serif;
}

/* Profile carousel */

.cuhk-profile-carousel,
.cuhk-video-carousel {
	position: relative;
	display: grid;
	grid-template-columns: 40px minmax(0, 1fr) 40px;
	align-items: center;
	gap: 12px;
}

/* Alumni Profiles overview — section 1 is text (left) + carousel (right). */
.cuhk-category__profiles {
	display: grid;
	grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
	gap: 48px;
	align-items: center;
}

.cuhk-category__profiles .cuhk-category__section-head {
	margin-bottom: 0;
}

@media (max-width: 860px) {
	.cuhk-category__profiles {
		grid-template-columns: 1fr;
		gap: 24px;
	}
}

/* Carousel dots span the full grid width, below the track + arrows. */
.cuhk-profile-carousel__dots,
.cuhk-video-carousel__dots {
	grid-column: 1 / -1;
	margin-top: 16px;
}

.cuhk-video-carousel__title-btn {
	border: 0;
	background: none;
	margin: 0;
	padding: 0;
	font: inherit;
	color: inherit;
	text-align: left;
	cursor: pointer;
}

.cuhk-video-carousel__title a,
.cuhk-video-carousel__title-btn {
	color: inherit;
	text-decoration: none;
}

.cuhk-video-carousel__title a:hover,
.cuhk-video-carousel__title-btn:hover {
	text-decoration: underline;
}

.cuhk-profile-carousel__track,
.cuhk-video-carousel__track {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - 32px) / 3);
	gap: 16px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.cuhk-profile-carousel__track::-webkit-scrollbar,
.cuhk-video-carousel__track::-webkit-scrollbar {
	display: none;
}

.cuhk-profile-carousel__track > *,
.cuhk-video-carousel__track > * {
	scroll-snap-align: start;
}

.cuhk-profile-carousel__nav,
.cuhk-video-carousel__nav {
	width: 40px;
	height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border: 1px solid var(--wp--preset--color--border, #e0e0e0);
	border-radius: 50%;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}

.cuhk-profile-carousel__nav:hover,
.cuhk-video-carousel__nav:hover {
	background: var(--wp--preset--color--text-primary, #1a1a1a);
	color: #fff;
}

.cuhk-profile-carousel__card {
	display: flex;
	flex-direction: column;
}

.cuhk-profile-carousel__media {
	display: block;
	aspect-ratio: 3 / 4;
	background-color: #d0d0d0;
	background-image: linear-gradient(135deg, #ececec 0%, #c0c0c0 100%);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.cuhk-profile-carousel__body {
	padding: 12px 0 0;
}

.cuhk-profile-carousel__name {
	margin: 0 0 4px;
	font-family: 'Open Sans', sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-profile-carousel__name a {
	color: inherit;
	text-decoration: none;
}

.cuhk-profile-carousel__name a:hover {
	text-decoration: underline;
}

.cuhk-profile-carousel__role {
	margin: 0 0 8px;
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	color: var(--wp--preset--color--text-secondary, #666);
}

.cuhk-profile-carousel__socials {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 10px;
}

.cuhk-profile-carousel__socials a {
	color: var(--wp--preset--color--text-secondary, #666);
	transition: color 0.15s ease;
}

.cuhk-profile-carousel__socials a:hover {
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

/* Video carousel */

.cuhk-video-carousel__card {
	display: flex;
	flex-direction: column;
}

.cuhk-video-carousel__media {
	position: relative;
	aspect-ratio: 16 / 9;
	background-color: #cccccc;
	background-image: linear-gradient(135deg, #d8d8d8 0%, #b8b8b8 100%);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border: 0;
	padding: 0;
	cursor: pointer;
}

.cuhk-video-carousel__thumb {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.cuhk-video-carousel__play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	pointer-events: none;
}

.cuhk-video-carousel__body {
	padding: 10px 4px 0;
}

.cuhk-video-carousel__title {
	margin: 0 0 4px;
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	font-weight: 500;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-video-carousel__desc {
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 12px;
	color: var(--wp--preset--color--text-secondary, #666);
}

@media (max-width: 960px) {
	.cuhk-profile-carousel__track,
	.cuhk-video-carousel__track {
		grid-auto-columns: calc((100% - 16px) / 2);
	}
}

@media (max-width: 540px) {
	.cuhk-profile-carousel__track,
	.cuhk-video-carousel__track {
		grid-auto-columns: 100%;
	}
}

/* =========================================
   Video Lightbox
   ========================================= */

.cuhk-video-lightbox[hidden] {
	display: none;
}

.cuhk-video-lightbox {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cuhk-video-lightbox__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.85);
	cursor: pointer;
}

.cuhk-video-lightbox__dialog {
	position: relative;
	width: min(960px, 92vw);
	max-height: 90vh;
	background: #000;
	box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5);
}

.cuhk-video-lightbox__close {
	position: absolute;
	top: -40px;
	right: 0;
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	color: #fff;
	border: 0;
	cursor: pointer;
}

.cuhk-video-lightbox__close:hover {
	color: #ddd;
}

.cuhk-video-lightbox__frame {
	position: relative;
	aspect-ratio: 16 / 9;
	width: 100%;
	overflow: hidden;
}

.cuhk-video-lightbox__frame iframe,
.cuhk-video-lightbox__frame video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	background: #000;
}

/* =========================================
   Services & Benefits page
   ========================================= */

.cuhk-page-hero--benefits {
	background-color: #4a4038;
	background-image:
		radial-gradient(ellipse 45% 65% at 70% 50%, rgba(210, 170, 125, 0.5) 0%, rgba(210, 170, 125, 0) 65%),
		linear-gradient(110deg, #443b33 0%, #6b5a48 55%, #7c6248 100%);
}

.cuhk-sb-cards {
	background: #FCFBF9;
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40) var(--wp--preset--spacing--70);
}

.cuhk-sb-cards__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
	gap: var(--wp--preset--spacing--40);
	align-items: stretch;
	transition: grid-template-columns 0.35s ease;
}

.cuhk-sb-card {
	display: grid;
	grid-template-rows: auto 1fr auto auto;
	gap: var(--wp--preset--spacing--30);
	padding: var(--wp--preset--spacing--40);
	min-height: 240px;
	background: #fff;
	border: 1px solid var(--wp--preset--color--border, #e5e5e5);
	border-radius: 4px;
	text-decoration: none;
	color: inherit;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.cuhk-sb-card:hover {
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
}

.cuhk-sb-card__title {
	margin: 0;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: 1.25rem;
	line-height: 1.3;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-sb-card__image {
	display: none;
	aspect-ratio: 16 / 9;
	min-height: 160px;
	background-color: #c8d7e0;
	background-image:
		radial-gradient(ellipse 50% 70% at 30% 50%, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 65%),
		linear-gradient(135deg, #b6cad5 0%, #7a98a8 100%);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 2px;
}

.cuhk-sb-card.is-active .cuhk-sb-card__image {
	display: block;
}

.cuhk-sb-card__description {
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 0.875rem;
	line-height: 1.5;
	color: var(--wp--preset--color--text-secondary, #555);
}

.cuhk-sb-card__arrow {
	justify-self: start;
}

/* Desktop: the wide (2fr) column follows the active card so every inactive
   card — including the first — collapses to the same narrow width. The base
   rule above already covers card 1 (the default active card); these handle
   cards 2–5. Scoped to >=961px so the tablet/mobile stacks below still win. */
@media (min-width: 961px) {
	.cuhk-sb-cards__inner:has(.cuhk-sb-card:nth-child(2).is-active) {
		grid-template-columns: 1fr 2fr 1fr 1fr 1fr;
	}
	.cuhk-sb-cards__inner:has(.cuhk-sb-card:nth-child(3).is-active) {
		grid-template-columns: 1fr 1fr 2fr 1fr 1fr;
	}
	.cuhk-sb-cards__inner:has(.cuhk-sb-card:nth-child(4).is-active) {
		grid-template-columns: 1fr 1fr 1fr 2fr 1fr;
	}
	.cuhk-sb-cards__inner:has(.cuhk-sb-card:nth-child(5).is-active) {
		grid-template-columns: 1fr 1fr 1fr 1fr 2fr;
	}
}

/* Tablet */
@media (max-width: 960px) {
	.cuhk-sb-cards__inner {
		grid-template-columns: 1fr 1fr;
	}
	.cuhk-sb-card__image {
		display: block;
	}
}

/* Mobile */
@media (max-width: 600px) {
	.cuhk-sb-cards__inner {
		grid-template-columns: 1fr;
	}
}

/* =========================================
   Update Your Contact (Services & Benefits sub-page)
   ========================================= */

.cuhk-contact-update {
	max-width: 1200px;
	margin: 0 auto;
	padding: 32px 48px 80px;
}

.cuhk-contact-update__breadcrumb {
	margin-bottom: 40px;
}

/* Left-aligned reading column, indented from the breadcrumb to match the mockup. */
.cuhk-contact-update__body {
	max-width: 760px;
	margin-left: clamp(0px, 9vw, 140px);
	text-align: left;
}

/* Native post content: subheading (h2) + intro paragraphs. */
.cuhk-contact-update__content {
	margin-bottom: 40px;
}

.cuhk-contact-update__content h2 {
	margin: 0 0 28px;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: clamp(32px, 4.5vw, 48px);
	line-height: 1.15;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-contact-update__content p {
	margin: 0 0 18px;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 15px;
	line-height: 1.7;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

/* Outlined rectangular buttons (login + quick guides). */
.cuhk-contact-update__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 14px 26px;
	border: 1px solid var(--wp--preset--color--text-primary, #1a1a1a);
	background: transparent;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 15px;
	line-height: 1.2;
	text-decoration: none;
	border-radius: 2px;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.cuhk-contact-update__btn:hover,
.cuhk-contact-update__btn:focus-visible {
	background: var(--wp--preset--color--primary, #4b2e83);
	border-color: var(--wp--preset--color--primary, #4b2e83);
	color: #ffffff;
}

.cuhk-contact-update__btn-icon {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
}

/* Login button sits on its own line, left-aligned and sized to its content. */
.cuhk-contact-update__login {
	margin: 0 0 52px;
}

.cuhk-contact-update__guides-heading {
	margin: 0 0 16px;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 15px;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-contact-update__guides {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 16px;
	margin-bottom: 44px;
}

.cuhk-contact-update__enquiry {
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 15px;
	line-height: 1.7;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-contact-update__enquiry p {
	margin: 0;
}

.cuhk-contact-update__enquiry a {
	color: inherit;
	text-decoration: underline;
}

.cuhk-contact-update__enquiry a:hover {
	color: var(--wp--preset--color--primary, #4b2e83);
}

@media (max-width: 782px) {
	.cuhk-contact-update {
		padding: 24px 24px 56px;
	}
	.cuhk-contact-update__breadcrumb {
		margin-bottom: 28px;
	}
	.cuhk-contact-update__body {
		margin-left: 0;
	}
}

/* ─── FAQ list (CPT archive + FAQ page template) ─────────────────────────── */
.cuhk-faq-page {
	max-width: 1000px;
	margin: 0 auto;
	padding: 32px 24px 80px;
}

.cuhk-faq-breadcrumb {
	font-size: 14px;
	color: #555;
	margin-bottom: 32px;
}
.cuhk-faq-breadcrumb a {
	color: #555;
	text-decoration: none;
}
.cuhk-faq-breadcrumb a:hover { color: #3d1b3d; }
.cuhk-faq-breadcrumb__sep {
	margin: 0 8px;
	color: #999;
}

.cuhk-faq-intro {
	margin-bottom: 32px;
}

.cuhk-faq-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.cuhk-faq-group + .cuhk-faq-group {
	margin-top: 32px;
}
.cuhk-faq-group__heading {
	display: flex;
	align-items: baseline;
	gap: 10px;
	margin: 0 0 12px;
	padding: 13px 24px;
	background: #ADCECE33;
	color: #3d1b3d;
	border-radius: 2px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
}
.cuhk-faq-group__letter {
	flex-shrink: 0;
}

.cuhk-faq-item {
	background: #ffffff;
	border-radius: 2px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
	overflow: hidden;
}
.cuhk-faq-item__summary {
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
	padding: 14px 16px 14px 24px;
	gap: 16px;
}
.cuhk-faq-item__summary::-webkit-details-marker { display: none; }
.cuhk-faq-item__summary::marker { display: none; content: ''; }
.cuhk-faq-item__question {
	display: flex;
	align-items: flex-start;
	gap: 6px;
	flex: 1;
	font-size: 14px;
	line-height: 1.5;
	color: #1a1a1a;
	font-weight: 600;
}
.cuhk-faq-item__num {
	flex-shrink: 0;
}
.cuhk-faq-item__title { flex: 1; }
.cuhk-faq-item__toggle {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #3d1b3d;
	border-radius: 2px;
	transition: background 0.2s ease;
}
.cuhk-faq-item__toggle svg {
	transition: transform 0.25s ease;
}
.cuhk-faq-item[open] .cuhk-faq-item__toggle svg {
	transform: rotate(180deg);
}
.cuhk-faq-item:hover .cuhk-faq-item__toggle { background: #52245c; }

/* Answerless FAQ: no toggle, not expandable — renders as a plain step/label. */
.cuhk-faq-item--static .cuhk-faq-item__summary { cursor: default; }

.cuhk-faq-item__answer {
	/* right padding clears the toggle column (16px summary pr + 32px toggle +
	   16px gap) so answer text aligns with the question and never runs under
	   the toggle — feedback. */
	padding: 0 64px 20px 24px;
	color: #444;
	font-size: 14px;
	line-height: 1.65;
}
.cuhk-faq-item__answer p:first-child { margin-top: 0; }
.cuhk-faq-item__answer p:last-child { margin-bottom: 0; }

.cuhk-faq-empty {
	text-align: center;
	color: #777;
	padding: 48px 0;
}

.cuhk-faq-pagination {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin-top: 48px;
}
.cuhk-faq-pagination__item a,
.cuhk-faq-pagination__item span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 32px;
	height: 32px;
	padding: 0 8px;
	font-size: 14px;
	color: #333;
	text-decoration: none;
	border-radius: 2px;
}
.cuhk-faq-pagination__item .current {
	background: #3d1b3d;
	color: #fff;
}
.cuhk-faq-pagination__item a:hover {
	background: #f0e6f0;
}

@media (max-width: 640px) {
	.cuhk-faq-item__summary { padding: 12px 12px 12px 16px; gap: 12px; }
	.cuhk-faq-item__question { font-size: 13px; }
	.cuhk-faq-item__answer { padding: 0 56px 16px 16px; }
	.cuhk-faq-group + .cuhk-faq-group { margin-top: 24px; }
	.cuhk-faq-group__heading { padding: 11px 16px; font-size: 14px; }
}

/* ============================================================
   Giving Back page + Campaigns (Services & Benefits)
   ============================================================ */
.cuhk-giving {
	max-width: 1200px;
	margin: 0 auto;
	padding: var(--wp--preset--spacing--50, 32px) var(--wp--preset--spacing--40, 24px) var(--wp--preset--spacing--70, 80px);
}

.cuhk-giving__breadcrumb {
	margin-bottom: var(--wp--preset--spacing--50, 32px);
}

/* Intro feature: page content beside an image */
.cuhk-giving-intro {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 56px;
	align-items: center;
	margin-bottom: var(--wp--preset--spacing--70, 72px);
}

.cuhk-giving-intro__body {
	min-width: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 15px;
	line-height: 1.7;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-giving-intro__body h1,
.cuhk-giving-intro__body h2 {
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: clamp(26px, 3vw, 34px);
	line-height: 1.2;
	margin: 0 0 16px;
}

.cuhk-giving-intro__body h3 {
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	font-size: 14px;
	margin: 0 0 10px;
}

.cuhk-giving-intro__body p { margin: 0 0 16px; }
.cuhk-giving-intro__body a:not(.cuhk-explore-btn) { color: #2a73d4; text-decoration: none; }
.cuhk-giving-intro__body a:not(.cuhk-explore-btn):hover { text-decoration: underline; }
.cuhk-giving-intro__body .cuhk-explore-btn { margin-top: 8px; }

.cuhk-giving-intro__media {
	min-height: 280px;
	background-color: #e8e8e8;
	background-size: cover;
	background-position: center;
	border-radius: 2px;
}

/* Campaigns section heading */
.cuhk-giving__heading {
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: clamp(24px, 3vw, 30px);
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	margin: 0 0 var(--wp--preset--spacing--50, 32px);
	padding-bottom: 16px;
	border-bottom: 1px solid var(--wp--preset--color--border, #e0e0e0);
}

.cuhk-giving__empty {
	font-family: 'Open Sans', sans-serif;
	color: var(--wp--preset--color--text-secondary, #666);
}

/* Campaign card */
.cuhk-campaign-card {
	margin-bottom: var(--wp--preset--spacing--70, 72px);
}

.cuhk-campaign-card__banner {
	width: 100%;
	aspect-ratio: 16 / 5;
	min-height: 150px;
	background-color: #e8e8e8;
	background-size: cover;
	background-position: center;
	margin-bottom: var(--wp--preset--spacing--40, 24px);
}

.cuhk-campaign-card__info {
	max-width: 100%;
}

.cuhk-campaign-card__title {
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: 22px;
	margin: 0 0 14px;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-campaign-card__desc {
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	line-height: 1.7;
	color: var(--wp--preset--color--text-secondary, #666);
	margin-bottom: 20px;
}

.cuhk-campaign-card__desc p { margin: 0; }

/* Explore More (outline button) */
.cuhk-explore-btn {
	display: inline-block;
	padding: 9px 22px;
	border: 1px solid var(--wp--preset--color--text-primary, #1a1a1a);
	background: transparent;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	font-family: 'Open Sans', sans-serif;
	font-size: 12px;
	letter-spacing: 0.02em;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}

.cuhk-explore-btn:hover {
	background: var(--wp--preset--color--text-primary, #1a1a1a);
	color: #fff;
}

/* Goal panel */
.cuhk-campaign-card__goal {
	padding: 24px;
	border: 1px solid var(--wp--preset--color--border, #e0e0e0);
	background: #fff;
}

.cuhk-campaign-card__goal-title {
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: 18px;
	margin: 0 0 14px;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-progress { margin-bottom: 18px; }

.cuhk-progress__pct {
	display: block;
	text-align: right;
	font-family: 'Open Sans', sans-serif;
	font-size: 11px;
	color: var(--wp--preset--color--text-secondary, #666);
	margin-bottom: 6px;
}

.cuhk-progress__track {
	display: block;
	height: 6px;
	background: #e6e6e6;
	border-radius: 3px;
	overflow: hidden;
}

.cuhk-progress__fill {
	display: block;
	height: 100%;
	background: #3f6fb5;
	border-radius: 3px;
}

.cuhk-campaign-card__figures { margin: 0 0 18px; }

.cuhk-campaign-card__figure {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding: 8px 0;
	border-bottom: 1px solid var(--wp--preset--color--border, #e0e0e0);
}

.cuhk-campaign-card__figure dt {
	font-family: 'Open Sans', sans-serif;
	font-size: 11px;
	color: var(--wp--preset--color--text-secondary, #666);
}

.cuhk-campaign-card__figure dd {
	margin: 0;
	font-family: 'Abhaya Libre', Georgia, serif;
	font-size: 22px;
	font-weight: 600;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

/* Donate (filled navy button) */
.cuhk-donate-btn {
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 12px 16px;
	text-align: center;
	background: #22335c;
	color: #fff;
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	text-decoration: none;
	transition: background 0.15s ease;
}

.cuhk-donate-btn:hover { background: #1a2748; }

.cuhk-donate-btn.is-disabled {
	pointer-events: none;
	opacity: 0.55;
}

@media (max-width: 900px) {
	.cuhk-giving-intro {
		grid-template-columns: 1fr;
		gap: 28px;
	}
}

/* Single campaign view */
.cuhk-single-campaign {
	max-width: 1200px;
	margin: 0 auto;
	padding: var(--wp--preset--spacing--50, 32px) var(--wp--preset--spacing--40, 24px) var(--wp--preset--spacing--70, 80px);
}

.cuhk-single-campaign__breadcrumb {
	margin-bottom: var(--wp--preset--spacing--50, 32px);
}

.cuhk-single-campaign__lead {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
	gap: 56px;
	align-items: start;
}

.cuhk-single-campaign__media {
	min-height: 320px;
	background-color: #e8e8e8;
	background-size: cover;
	background-position: center;
}

.cuhk-single-campaign__title {
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: clamp(26px, 3vw, 34px);
	line-height: 1.2;
	margin: 0 0 14px;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-single-campaign__subtitle {
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	font-size: 14px;
	margin: 0 0 16px;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-single-campaign__content {
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	line-height: 1.8;
	color: var(--wp--preset--color--text-secondary, #555);
}

.cuhk-single-campaign__content p { margin: 0 0 18px; }
.cuhk-single-campaign__content a { color: #2a73d4; text-decoration: none; }
.cuhk-single-campaign__content a:hover { text-decoration: underline; }

/* Donate band */
.cuhk-donate-band {
	background: var(--wp--preset--color--background-warm, #f5f0eb);
	padding: var(--wp--preset--spacing--60, 48px) var(--wp--preset--spacing--40, 24px);
}

.cuhk-donate-band__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	gap: 32px;
	align-items: stretch;
}

/* Donate card: full-bleed image + CTA, no padding so the image bleeds to the edges */
.cuhk-donate-band__card {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.05);
	overflow: hidden;
}

/* Goal Achieved panel as a separate card, set apart by the grid gap */
.cuhk-donate-band__goal .cuhk-campaign-card__figures {
	margin-bottom: 0;
}

.cuhk-donate-band__media {
	align-self: stretch;
	min-height: 200px;
	background-image: linear-gradient(120deg, #cfe0c3 0%, #e7d9b8 60%, #f0e6d2 100%);
	background-size: cover;
	background-position: center;
}

.cuhk-donate-band__cta {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 24px 40px;
}

.cuhk-donate-band__title {
	font-family: 'Abhaya Libre', Georgia, serif;
	font-weight: 600;
	font-size: clamp(22px, 2.6vw, 28px);
	margin: 0;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-donate-band__arrow.is-disabled {
	pointer-events: none;
	opacity: 0.55;
}

@media (max-width: 900px) {
	.cuhk-single-campaign__lead,
	.cuhk-donate-band__inner,
	.cuhk-donate-band__card {
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.cuhk-donate-band__card { gap: 0; }
	.cuhk-donate-band__cta { padding: 20px 24px; }
}

/* =========================================
   Donors List (page-donors.php)
   ========================================= */
.cuhk-donors__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: var(--wp--preset--spacing--50, 32px) var(--wp--preset--spacing--40, 24px) var(--wp--preset--spacing--70, 80px);
}

.cuhk-donors__breadcrumb {
	margin-bottom: var(--wp--preset--spacing--50, 32px);
}

/* Year tabs */
.cuhk-donors__tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 28px;
	border-bottom: 1px solid #d8d8d2;
	padding-bottom: 12px;
	margin-bottom: 40px;
}

.cuhk-donors__tab {
	appearance: none;
	background: none;
	border: 0;
	border-top: 2px solid transparent;
	padding: 6px 2px 0;
	cursor: pointer;
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--text-secondary, #8a8a85);
	transition: color 0.2s ease, border-color 0.2s ease;
}

.cuhk-donors__tab:hover {
	color: var(--wp--preset--color--text-primary, #1a1a1a);
}

.cuhk-donors__tab.is-active {
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	border-top-color: var(--wp--preset--color--primary, #4B2E83);
	font-weight: 600;
}

/* Year panel */
.cuhk-donors__year {
	font-family: 'Abhaya Libre', Georgia, 'Noto Serif', 'Noto Serif TC', 'Noto Serif SC', 'Times New Roman', serif;
	font-weight: 600;
	font-size: clamp(28px, 4vw, 40px);
	line-height: 1.15;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	margin: 0 0 32px;
}

.cuhk-donors__tier {
	margin-bottom: 36px;
}

.cuhk-donors__tier-label {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 18px;
	color: var(--wp--preset--color--text-primary, #1a1a1a);
	margin: 0 0 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid #e2e2dc;
}

.cuhk-donors__grid {
	display: grid;
	gap: 16px;
}

.cuhk-donors__card {
	background: #ADCECE33; /* #ADCECE at 20% opacity */
	color: #333;
	text-align: center;
	font-size: 14px;
	line-height: 1.5;
	padding: 22px 16px;
	border-radius: 2px;
}

.cuhk-donors__empty {
	color: var(--wp--preset--color--text-secondary, #666);
	font-size: 16px;
}

@media (max-width: 700px) {
	.cuhk-donors__grid {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	.cuhk-donors__tabs {
		gap: 18px;
	}
}

/* =========================================
   Homepage Instagram feed
   ========================================= */

/* Constrain the feed to 70% and center it on desktop; full width once the
   carousel drops to its tablet layout (matches the plugin's 1024px breakpoint). */
.cuhk-home-instagram {
	width: 70%;
	margin: 0 auto;
}

@media (max-width: 1024px) {
	.cuhk-home-instagram {
		width: 100%;
	}
}

/* =========================================
   Back to Top button
   ========================================= */

.cuhk-back-to-top {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border: none;
	background: #33233B;
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease, background-color 0.2s ease;
}

.cuhk-back-to-top.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.cuhk-back-to-top:hover,
.cuhk-back-to-top:focus-visible {
	background: #4a3459;
}

@media (max-width: 781px) {
	.cuhk-back-to-top {
		right: 16px;
		bottom: 16px;
		width: 40px;
		height: 40px;
	}

	.cuhk-back-to-top svg {
		width: 16px;
		height: 16px;
	}
}

/* --------------------------------------------------------------------------
   Post-body image display options
   Editors pick a style via the "Image style" (Formats) dropdown in the classic
   editor — see cuhk_aao_editor_image_styles() in functions.php. Each choice
   toggles one class below. Article bodies (.cuhk-article-body) default to full
   width when no explicit choice is made.
   -------------------------------------------------------------------------- */
.cuhk-img-full {
	width: 100%;
	height: auto;
}

.cuhk-img-original {
	width: auto;
	max-width: 100%;
	height: auto;
}

.cuhk-img-left {
	float: left;
	width: 50%;
	max-width: 50%;
	height: auto;
	margin: 0 24px 16px 0;
}

.cuhk-img-right {
	float: right;
	width: 50%;
	max-width: 50%;
	height: auto;
	margin: 0 0 16px 24px;
}

/* Default: article-body images with no explicit style fill the text column. */
.cuhk-article-body img:not(.cuhk-img-original):not(.cuhk-img-left):not(.cuhk-img-right) {
	width: 100%;
	height: auto;
}

/* Captions ride along with inserted images. WordPress prints an inline fixed
   pixel width on .wp-caption; override it so a full-width captioned image can
   fill the column instead of being capped at its insert-time size. */
.wp-caption {
	width: auto !important;
	max-width: 100%;
	margin: 0 0 16px;
}

.wp-caption img {
	max-width: 100%;
	height: auto;
}

.wp-caption .wp-caption-text {
	margin: 8px 0 0;
	font-size: 13px;
	color: var(--wp--preset--color--text-secondary, #555);
	text-align: center;
}

/* Floats collapse to full width on narrow screens so text is not crushed. */
@media (max-width: 600px) {
	.cuhk-img-left,
	.cuhk-img-right {
		float: none;
		width: 100%;
		max-width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
}