:root {
	/* Color Palette - Old Money Aesthetic */
	--navy-primary: #143258;
	--navy-dark: #143258; /* Adjusted to be darker version of #143258 */
	--gold-accent: #c5a059;
	--cream-bg: #fdfbf7;
	--white: #ffffff;
	--text-dark: #2c3e50;
	--text-light: #5a6b7c;
	--text-silver: #a0aec0; /* Added missing variable */
	--border-color: #e0e0e0;

	/* Typography */
	--font-heading: 'Cormorant Garamond', serif;
	--font-body: 'Montserrat', sans-serif;

	/* Spacing */
	--spacing-sm: 1rem;
	--spacing-md: 2rem;
	--spacing-lg: 4rem;
	--spacing-xl: 6rem;
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body {
	font-family: var(--font-body);
	background-color: var(--cream-bg);
	color: var(--text-dark);
	line-height: 1.6;
	font-size: 16px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--font-heading);
	color: var(--navy-primary);
	font-weight: 600;
}

a {
	text-decoration: none;
	color: inherit;
	transition: all 0.3s ease;
}

ul {
	list-style: none;
}

.container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
}

.section {
	padding: var(--spacing-xl) 0;
}

/* --- Header & Nav --- */
.main-header {
	background-color: transparent;
	padding: 1.5rem 0;
	position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    transition: all 0.4s ease;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

@media (max-width: 768px) {
	.main-header {
		border-bottom: none;
	}
}

.main-header.scrolled {
    background-color: #ffffff;
    padding: 0.8rem 0;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.1);
    border-bottom: none;
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo {
    position: relative;
    height: 80px;
    width: auto;
    min-width: 180px;
    display: flex;
    align-items: center;
}

.logo img {
    height: 100%;
    width: auto;
    max-height: 70px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    transition: opacity 0.3s ease;
}

.logo .logo-dark {
    opacity: 0;
}

.logo .logo-white {
    opacity: 1;
    filter: brightness(0) invert(1);
}

.main-header.scrolled .logo .logo-dark {
    opacity: 1;
}

.main-header.scrolled .logo .logo-white {
    opacity: 0;
}

.main-nav .menu-list {
    display: flex;
    gap: 30px;
}


.main-nav a {
    font-family: var(--font-body);
    font-size: 0.8rem;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 1.5px;
    color: var(--white);
    position: relative;
    padding-bottom: 5px;
}

.main-header.scrolled .main-nav a {
    color: var(--navy-primary);
}


.main-nav a::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background-color: var(--gold-accent);
    transition: width 0.3s ease;
}

.main-nav a:hover::after,
.main-nav a.active::after {
    width: 100%;
}

.menu-list li {
    position: relative;
    padding-bottom: 20px;
    margin-bottom: -20px;
}

.dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    background-color: var(--white);
    min-width: 240px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    display: flex;
    flex-direction: column;
    padding: 15px 0;
    border-top: 3px solid var(--gold-accent);
}


.main-nav .menu-list li:hover .dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.mobile-submenu-toggle {
    display: none;
}

.mobile-menu-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    flex-direction: column;
    gap: 6px;
    z-index: 1001;
}


.mobile-menu-toggle span {
    width: 30px;
    height: 2px;
    background-color: var(--white);
    transition: all 0.3s ease;
}


.main-header.scrolled .mobile-menu-toggle span {
    background-color: var(--navy-primary);
}

/* --- Genesis Section (Storytelling) --- */
.history-genesis {
	background-color: var(--white);
	overflow: hidden;
	padding: var(--spacing-xl) 0;
}

.genesis-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 60px;
	align-items: center;
}

.genesis-content {
    /* Align with main site typography styles */
}

/* Add Gold Line under Genesis H2 */
.genesis-content .section-title {
	position: relative;
	padding-bottom: 1.5rem;
	margin-bottom: 2rem;
}

.genesis-content .section-title::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 60px;
	height: 3px;
	background-color: var(--gold-accent);
}

.genesis-text {
	position: relative;
	z-index: 2;
}

.genesis-text p {
	font-family: var(--font-body); /* Ensure correct font */
	font-size: 1rem; /* Standard body size */
	color: var(--text-dark); /* Darker text for readability */
	margin-bottom: 1.5rem;
	line-height: 1.8;
}

.genesis-text p:last-child {
	margin-bottom: 0;
}

/* Polaroid Stack Effect */
.polaroid-stack {
	position: relative;
	width: 100%;
	height: 450px; /* Space for cards */
	display: flex;
	justify-content: center;
	align-items: center;
	perspective: 1000px;
}

.polaroid-card {
	background: #fff;
	padding: 12px 12px 45px 12px;
	box-shadow: 0 15px 35px rgba(0,0,0,0.1);
	position: absolute;
	width: 280px;
	transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); /* Faster, smoother transition */
	border: 1px solid #f0f0f0;
	transform-origin: center;
	will-change: transform, z-index;
	cursor: pointer;
}

.polaroid-card img {
	width: 100%;
	height: 240px;
	object-fit: cover;
	filter: sepia(15%) contrast(1.05); /* Subtle vintage look */
	background-color: #eee;
	display: block;
}

.polaroid-card .caption {
	font-family: var(--font-heading);
	font-style: italic;
	font-size: 1.3rem;
	color: var(--navy-primary);
	position: absolute;
	bottom: 10px;
	left: 0;
	width: 100%;
	text-align: center;
}

/* Stacking Order & Random Rotation - Reset to simple 2D */
.polaroid-card.p-1 {
	z-index: 1;
	transform: rotate(-10deg) translate(-60px, 15px); /* Increased initial spread */
}

.polaroid-card.p-2 {
	z-index: 2;
	transform: rotate(8deg) translate(60px, -15px); /* Increased initial spread */
}

.polaroid-card.p-3 {
	z-index: 3;
	transform: rotate(-3deg) scale(1.05);
	box-shadow: 0 15px 35px rgba(0,0,0,0.15);
}

/* Hover Interaction: Fan Out / Rotation Spread */
/* Wide spread so all content is visible */
.polaroid-stack:hover .polaroid-card.p-1 {
    transform: translate(-160px, 10px) rotate(-12deg) scale(1);
    z-index: 5;
	box-shadow: 0 20px 40px rgba(0,0,0,0.2);
}
.polaroid-stack:hover .polaroid-card.p-2 {
    transform: translate(160px, 10px) rotate(12deg) scale(1);
    z-index: 5;
	box-shadow: 0 20px 40px rgba(0,0,0,0.2);
}
.polaroid-stack:hover .polaroid-card.p-3 {
	transform: translate(0, -10px) rotate(0) scale(1);
    z-index: 6;
	box-shadow: 0 25px 50px rgba(0,0,0,0.25);
}

/* Specific Card Attention (When hovering specific card in stack) */
.polaroid-stack:hover .polaroid-card:hover {
	z-index: 100 !important;
	transition: transform 0.2s ease-out; /* Smooth and fast */
	box-shadow: 0 30px 60px rgba(0,0,0,0.3);
}

/* Just bring to front and scale slightly - keep position */
.polaroid-stack:hover .polaroid-card.p-1:hover {
	transform: translate(-160px, 10px) rotate(-12deg) scale(1.1);
}

.polaroid-stack:hover .polaroid-card.p-2:hover {
	transform: translate(160px, 10px) rotate(12deg) scale(1.1);
}

.polaroid-stack:hover .polaroid-card.p-3:hover {
	transform: translate(0, -10px) rotate(0) scale(1.1);
}


@media (max-width: 900px) {
	.genesis-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	.polaroid-stack {
		height: 400px;
		margin-top: 2rem;
	}
	/* Reduced spread on mobile */
	.polaroid-stack:hover .polaroid-card.p-1 { transform: translate(-70px, 10px) rotate(-10deg); }
	.polaroid-stack:hover .polaroid-card.p-2 { transform: translate(70px, 10px) rotate(10deg); }
	.polaroid-stack:hover .polaroid-card.p-3 { transform: translate(0, -10px) scale(1.05); }
}

/* --- New Hero Page Styles (About Us etc) --- */
.hero-page {
	position: relative;
	min-height: 60vh; /* Reduced height to reduce bottom space */
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--navy-dark);
	overflow: hidden;
	padding-top: 100px; /* Increased to push content down visually */
	padding-bottom: 0; /* Fully removed bottom spacing */
}

/* Base for the parallax background */
.hero-page-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	background-image: url('images/downloaded/tungart7-business-8598076_1920.jpg');
	background-size: cover;
	background-position: center;
	/* Removed fixed attachment to allow smooth transform animation */
	transform-origin: center center;
	animation: heroZoom 20s ease-in-out infinite alternate;
}

@keyframes heroZoom {
	0% { transform: scale(1); }
	100% { transform: scale(1.15); }
}

.hero-page-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, rgba(20, 50, 88, 0.75) 0%, rgba(20, 30, 40, 0.6) 100%);
	z-index: 1;
}

.hero-page-content {
	position: relative;
	z-index: 2;
	text-align: center;
	max-width: 1100px; /* Increased to fit single line text */
	padding: 0 20px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

/* Glassmorphism Breadcrumbs */
.glass-breadcrumbs {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 10px 24px;
	background: rgba(255, 255, 255, 0.15); /* More visible light glass */
	backdrop-filter: blur(16px) saturate(180%);
	-webkit-backdrop-filter: blur(16px) saturate(180%);
	border-radius: 4px; /* Rectangle */
	margin-bottom: 40px; /* Space above header */
	box-shadow: none;
	transition: all 0.3s ease;
}

/* Hover removed */

.glass-breadcrumbs a {
	color: rgba(255, 255, 255, 0.9); /* More contrast */
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 600;
	text-decoration: none;
	transition: color 0.3s ease;
}

.glass-breadcrumbs a:hover {
	color: var(--gold-accent);
}

.glass-breadcrumbs .separator {
	color: rgba(255, 255, 255, 0.6);
	font-size: 0.7rem;
}

.glass-breadcrumbs .current {
	color: var(--gold-accent); /* Highlight current page */
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
}

/* Typography Enhancements */
.hero-page-title {
	font-size: 4.5rem;
	font-family: var(--font-heading);
	color: var(--white);
	line-height: 1.1;
	margin-bottom: 1.5rem;
	text-shadow: 0 4px 10px rgba(0,0,0,0.3);
}

.hero-page-title .highlight {
	color: var(--gold-accent);
	font-style: italic;
}

.hero-page-subtitle {
	font-family: var(--font-heading);
	font-size: 1.8rem;
	font-weight: 300;
	font-style: italic;
	color: rgba(255, 255, 255, 0.9);
	max-width: 100%;
	margin: 0 auto;
	line-height: 1.4;
	text-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

@media (max-width: 768px) {
	.hero-page {
		min-height: 50vh;
		padding-top: 90px;
		padding-bottom: 40px;
	}
	.glass-breadcrumbs {
		margin-top: 15px;
		margin-bottom: 25px;
		padding: 8px 16px;
		gap: 8px;
	}
	.glass-breadcrumbs a,
	.glass-breadcrumbs .current {
		font-size: 0.7rem;
	}
	.glass-breadcrumbs .separator {
		font-size: 0.6rem;
	}
	.hero-page-title {
		font-size: 2.2rem;
		line-height: 1.15;
		margin-bottom: 1rem;
	}
	.hero-page-subtitle {
		font-size: 1.15rem;
		line-height: 1.4;
	}
}

.main-nav .menu-list li:hover .dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* Dropdown Indicator (Dzyndzel) */
.has-dropdown > a {
	padding-right: 18px;
}

.has-dropdown > a::before {
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	margin-top: -5px; /* Visual centering adjustment for all-caps + padding */
	width: 6px;
	height: 6px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: translateY(-50%) rotate(45deg);
	transition: transform 0.3s ease;
	pointer-events: none;
}

.has-dropdown:hover > a::before {
	transform: translateY(-20%) rotate(225deg);
}

.dropdown li {
	width: 100%;
	padding: 0;
	margin: 0;
	display: block;
}

.dropdown li a {
	display: block;
	padding: 12px 25px;
	color: var(--navy-primary) !important;
	/* Force dark text */
	font-size: 0.85rem;
	text-align: left;
	text-transform: none;
	/* Sentence case for sub-items */
	letter-spacing: 0.5px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.03);
	padding-bottom: 12px;
}

.dropdown li:last-child a {
	border-bottom: none;
}

.dropdown li a::after {
	display: none;
	/* No underline anim */
}

.dropdown li a:hover {
	background-color: #f8f9fa;
	color: var(--gold-accent) !important;
	padding-left: 30px;
	/* Slide effect */
}

.mobile-menu-toggle {
	display: none;
	background: none;
	border: none;
	cursor: pointer;
	flex-direction: column;
	gap: 6px;
	z-index: 1001;
}

.mobile-menu-toggle span {
	width: 30px;
	height: 2px;
	background-color: var(--white);
	transition: all 0.3s ease;
}

.main-header.scrolled .mobile-menu-toggle span {
	background-color: var(--navy-primary);
}

/* --- Hero Section (New) --- */
.hero-fullscreen {
	position: relative;
	/* Use min-height to allow content to push it larger, 
       but aim for full viewport height */
	min-height: 100svh;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--white);
	background-color: var(--navy-primary); /* Fallback bg color */
	overflow: hidden;
	/* Remove negative margin since header is fixed */
	margin-top: 0;
	/* Increase padding to push content down below header + extra space */
	padding-top: 160px;
	padding-bottom: 60px;
	/* Space for scroll indicator */
}

/* Static background image */
.hero-bg-image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}

.hero-bg-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	/* Subtle zoom effect */
	animation: subtleZoom 20s infinite alternate;
}

@keyframes subtleZoom {
	from {
		transform: scale(1);
	}

	to {
		transform: scale(1.1);
	}
}

.hero-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to bottom,
			rgba(20, 50, 88, 0.7) 0%,
			/* Darker at top for header readability */
			rgba(20, 50, 88, 0.5) 50%,
			rgba(20, 50, 88, 0.8) 100%);
	z-index: 2;
}

.hero-content {
	position: relative;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-bottom: 5vh;
}

.hero-suptitle {
	display: block;
	font-family: var(--font-body);
	font-size: 0.9rem;
	letter-spacing: 4px;
	text-transform: uppercase;
	color: var(--gold-accent);
	margin-bottom: 1.5rem;
}

.hero-title {
	font-size: 5rem;
	line-height: 1.1;
	margin-bottom: 2rem;
	color: var(--white);
	text-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.hero-lead {
	font-family: var(--font-heading);
	font-size: 1.5rem;
	font-style: italic;
	opacity: 0.9;
	margin-bottom: 3rem;
	font-weight: 400;
}

/* Hero Buttons */
.hero-buttons {
	display: flex;
	gap: 20px;
}

/* Additional Button Styles */
.btn-gold {
	background-color: var(--gold-accent);
	color: var(--navy-dark);
	border: 1px solid var(--gold-accent);
}

.btn-gold:hover {
	background-color: #b08d4b;
	color: var(--white);
}

.btn-outline-light {
	background-color: transparent;
	border: 1px solid var(--white);
	color: var(--white);
}

.btn-outline-light:hover {
	background-color: var(--white);
	color: var(--navy-primary);
}


/* Scroll Indicator */
.scroll-indicator {
	position: absolute;
	bottom: 30px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 2;
	animation: bounce 2s infinite;
}

.mouse-icon {
	width: 30px;
	height: 50px;
	border: 2px solid rgba(255, 255, 255, 0.7);
	border-radius: 20px;
	display: block;
	position: relative;
}

.wheel {
	position: absolute;
	top: 10px;
	left: 50%;
	width: 4px;
	height: 8px;
	background-color: var(--gold-accent);
	border-radius: 2px;
	transform: translateX(-50%);
	animation: scrollWheel 1.5s infinite;
}

@keyframes scrollWheel {
	0% {
		top: 10px;
		opacity: 1;
	}

	100% {
		top: 30px;
		opacity: 0;
	}
}

@keyframes bounce {

	0%,
	20%,
	50%,
	80%,
	100% {
		transform: translateX(-50%) translateY(0);
	}

	40% {
		transform: translateX(-50%) translateY(-10px);
	}

	60% {
		transform: translateX(-50%) translateY(-5px);
	}
}

/* Animations */
.fade-in-up {
	opacity: 0;
	transform: translateY(20px);
	animation: fadeInUp 0.8s forwards ease-out;
}

.delay-1 {
	animation-delay: 0.2s;
}

.delay-2 {
	animation-delay: 0.4s;
}

.delay-3 {
	animation-delay: 0.6s;
}

@keyframes fadeInUp {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* --- Typography Helpers --- */
.section-header {
	margin-bottom: var(--spacing-lg);
	display: flex;
	flex-direction: column;
	align-items: center;
}

.suptitle {
	font-family: var(--font-body);
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 3px;
	color: var(--gold-accent);
	margin-bottom: 1rem;
	display: block;
}

.section-title {
	font-size: 3rem;
	margin-bottom: 1.5rem;
	font-style: italic;
}

.divider {
	width: 60px;
	height: 3px;
	background-color: var(--gold-accent);
	margin: 0 auto;
}

.text-center {
	text-align: center;
}

.mt-large {
	margin-top: var(--spacing-lg);
}

.max-800 {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}

/* --- Buttons --- */
.btn {
	display: inline-block;
	padding: 12px 30px;
	font-family: var(--font-body);
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	font-weight: 500;
	border: 1px solid transparent;
	margin-top: 2rem;
	cursor: pointer;
}

.btn-primary {
	background-color: var(--navy-primary);
	color: var(--white);
}

.btn-primary:hover {
	background-color: var(--navy-dark);
}

.btn-outline {
	background-color: transparent;
	border-color: var(--navy-primary);
	color: var(--navy-primary);
}

.btn-outline:hover {
	background-color: var(--navy-primary);
	color: var(--white);
}

/* --- Content Layouts --- */
.content-wrapper {
	display: grid;
	gap: var(--spacing-lg);
	align-items: center;
}

.two-column {
	grid-template-columns: 1fr 1fr;
}

.two-column.reverse .text-column {
	order: 2;
	/* Default order handled by grid usually, but explicit for clarity */
}

.text-column {
	padding: 0 var(--spacing-sm);
}

.text-column p {
	margin-bottom: 1.5rem;
	color: var(--text-light);
	font-family: 'Cormorant Garamond', serif;
	font-size: 1.2rem;
}

.text-column .lead-text {
	font-size: 1.4rem;
	color: var(--navy-primary);
	font-weight: 500;
}

/* --- Images --- */
.image-column {
	display: flex;
	justify-content: center;
}

.image-frame {
	position: relative;
	padding: 10px;
	border: 1px solid rgba(20, 50, 88, 0.1);
	background-color: var(--white);
}

.image-frame img {
	display: block;
	width: 100%;
	height: auto;
	filter: sepia(10%) contrast(90%);
	/* Vintage feel */
}

/* --- Prestige / About Section Custom --- */
.prestige-section {
	position: relative;
	padding: 100px 0;
	overflow: hidden;
	background: linear-gradient(135deg, var(--cream-bg) 0%, #ffffff 100%);
}

.prestige-grid {
	display: grid;
	grid-template-columns: 0.9fr 1.1fr;
	gap: 80px;
	align-items: center;
}

/* Visual Stack Left */
.visual-stack {
	position: relative;
	width: 100%;
	min-height: 500px;
	/* Ensure space for absolute positioning */
}

.gold-frame-bg {
	position: absolute;
	top: -30px;
	left: -30px;
	width: 70%;
	height: 80%;
	border: 2px solid var(--gold-accent);
	z-index: 1;
	opacity: 0.4;
	transition: transform 0.6s ease;
}

.visual-stack:hover .gold-frame-bg {
	transform: translate(10px, 10px);
}

.visual-stack .main-img {
	width: 85%;
	position: relative;
	z-index: 2;
	box-shadow: 0 20px 50px rgba(20, 50, 88, 0.15);
	display: block;
	border-radius: 2px;
	transition: transform 0.6s cubic-bezier(0.2, 1, 0.3, 1);
}

.visual-stack:hover .main-img {
	transform: scale(1.02);
}

.visual-stack .accent-img {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 55%;
	z-index: 3;
	border: 12px solid #ffffff;
	/* White border to separate */
	box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
	border-radius: 2px;
	transition: transform 0.6s cubic-bezier(0.2, 1, 0.3, 1) 0.1s;
}

.visual-stack:hover .accent-img {
	transform: translate(-10px, -10px);
}

/* Content Right */
.prestige-content {
	padding-left: 20px;
}

/* Replaced .section-label with global .suptitle in HTML, removing legacy styles */

.prestige-title {
	font-family: var(--font-heading);
	font-size: 3.5rem;
	line-height: 1.1;
	color: var(--navy-primary);
	margin-bottom: 2.5rem;
}

.text-gold {
	color: var(--gold-accent);
	font-style: italic;
}

.text-navy {
	color: var(--navy-primary);
}

.prestige-lead {
	font-family: var(--font-heading);
	font-size: 1.35rem;
	line-height: 1.6;
	color: var(--navy-dark);
	margin-bottom: 2rem;
}

.text-block p {
	font-size: 1.05rem;
	color: rgba(20, 50, 88, 0.75);
	margin-bottom: 1.5rem;
	line-height: 1.8;
}

.text-block strong {
	font-weight: 600;
}

/* Signature / Stats */
.signature-block {
	margin-top: 3rem;
	padding-top: 2rem;
	border-top: 1px solid rgba(20, 50, 88, 0.08);
}

.stats-row {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.stat-item {
	display: flex;
	flex-direction: column;
	align-items: center; /* Center number and text */
}

.stat-number {
	font-size: 3.5rem;
	font-family: var(--font-heading);
	font-weight: 700;
	color: var(--navy-primary);
	line-height: 1;
}

.stat-desc {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	color: var(--gold-accent);
	margin-top: 0.8rem;
	font-weight: 600;
}

/* Responsive */
@media (max-width: 900px) {
	.prestige-grid {
		grid-template-columns: 1fr;
		gap: 60px;
	}

	/* Move Visuals to Bottom on Mobile */
	.visual-stack {
		order: 2;
		min-height: 400px; /* Ensure height for images */
		width: 90%;
		margin: 30px auto 0; /* Margin top instead of bottom */
	}

	.prestige-content {
		order: 1; /* Content first */
		padding-left: 0;
		text-align: left;
	}

	.gold-frame-bg {
		width: 100%;
		left: 15px;
		top: -15px;
	}


	.prestige-title {
		font-size: 2.5rem;
	}

	.stat-number {
		font-size: 2.5rem;
	}

	.section-label {
		padding-left: 0;
	}

	.section-label::before {
		display: none;
	}

	.prestige-content {
		padding-left: 0;
		text-align: left;
	}
}

/* --- Specific Sections --- */

/* Hero / O Klubie */
.hero-section {
	background-color: var(--white);
}

/* Misja - New Grid Layout */
.mission-visuals-grid {
	position: relative;
	width: 100%;
	height: 600px; /* Adjust based on needs */
	margin-top: 2rem;
}

.mission-img-main {
	position: absolute;
	width: 75%;
	height: 80%;
	top: 0;
	left: 0;
	z-index: 1;
	box-shadow: 0 20px 50px rgba(0,0,0,0.15);
	overflow: hidden;
}

.mission-img-main img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 1s ease;
}

.mission-img-main:hover img {
	transform: scale(1.05);
}

.mission-img-accent {
	position: absolute;
	width: 45%;
	height: 50%;
	bottom: 0;
	right: 0;
	z-index: 2;
	box-shadow: -10px -10px 40px rgba(0,0,0,0.1);
	border: 8px solid var(--white);
	overflow: hidden;
}

.mission-img-accent img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.gold-frame-decoration {
	position: absolute;
	top: -30px;
	left: -30px;
	width: 40%;
	height: 40%;
	border: 2px solid var(--gold-accent);
	z-index: 0;
	opacity: 0.6;
}

.stat-card {
	position: absolute;
	background: var(--white);
	padding: 20px 30px;
	z-index: 3;
	box-shadow: 0 10px 30px rgba(0,0,0,0.08);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: 140px;
}

.stat-card .num {
	font-family: var(--font-heading);
	font-size: 2.2rem;
	color: var(--navy-primary);
	font-weight: 700;
	line-height: 1;
}

.stat-card .lbl {
	font-size: 0.7rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--gold-accent);
	margin-top: 5px;
	font-weight: 600;
}

.stat-card.card-1 {
	top: 10%;
	right: 15%;
	animation: floatAnim 6s ease-in-out infinite;
}

.stat-card.card-2 {
	bottom: 15%;
	left: 10%;
	animation: floatAnim 7s ease-in-out infinite reverse;
}

@keyframes floatAnim {
	0% { transform: translateY(0); }
	50% { transform: translateY(-15px); }
	100% { transform: translateY(0); }
}

@media (max-width: 900px) {
	.mission-visuals-grid {
		height: 450px;
		margin-bottom: 40px;
	}
	
	.stat-card {
		padding: 15px 20px;
		min-width: 110px;
	}
	
	.stat-card .num {
		font-size: 1.8rem;
	}
}

.mission-section {
	background-color: #f4f1ea;
	/* Slightly darker cream */
}

.features-list li {
	font-family: var(--font-heading);
	font-size: 1.25rem;
	color: var(--navy-primary);
	margin-bottom: 0.5rem;
	display: flex;
	align-items: center;
	gap: 10px;
}

.features-list li::before {
	content: '\2022';
	/* Simple bullet to fit style */
	color: var(--gold-accent);
	font-size: 2rem;
	line-height: 0;
}

/* Members Section Description */
.members-section {
	background-color: var(--cream-bg);
}

.section.members-section .text-center p {
	font-family: var(--font-heading);
	font-size: 1.25rem;
	color: var(--text-light);
	line-height: 1.6;
}

/* Members Gallery Grid (New Style) */
.members-gallery-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 30px;
	margin-top: 4rem;
	padding: 0;
	width: 100%;
}

.member-gallery-card {
    flex: 0 0 calc(25% - 23px);
    max-width: 300px;
    min-width: 250px;
    
    /* Restored properties */
    position: relative;
    padding: 0;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s ease;
    height: auto;
    background: #fff;
}

@media (max-width: 1200px) {
	.member-gallery-card {
		flex: 0 0 calc(33.333% - 20px); /* 3 items */
	}
}

@media (max-width: 992px) {
    /* Reset Flex for Slider -> Use Grid as before */
	.members-gallery-grid {
		display: grid;
		/* Force implicit columns only */
		grid-template-columns: none !important; 
		grid-auto-flow: column;
		grid-auto-columns: 40vw; /* Tablet: 2 visible + part of 3rd */
		
		gap: 20px;
		
		/* Slider mechanics */
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		overscroll-behavior-x: contain;
		scroll-padding-left: 20px;
		
		/* Edge-to-Edge Layout */
		margin: 0 -20px; 
		padding: 30px 20px 50px 20px;
		
		/* Hide Scrollbar */
		scrollbar-width: none;
		-ms-overflow-style: none;
	}
	
	.members-gallery-grid::-webkit-scrollbar {
		display: none;
	}

	/* Card Styling */
	.member-gallery-card {
		scroll-snap-align: start;
		width: 100%; 
		height: 100%; /* Fill grid track height */
		
		/* Visuals: Clean Deskto-like style with Lift effect */
		background: #fff;
		border: none;
		border-radius: 0;
		transform: none !important;
		
		/* Shadow for slider affordance */
		box-shadow: 0 8px 20px rgba(0,0,0,0.08); 
	}
	
	/* Adjust Info Section */
	.gallery-info {
		padding: 20px 15px;
		justify-content: flex-start;
		border-bottom: 3px solid var(--gold-accent);
	}
	
	.gallery-info h3 {
		font-size: inherit;
		margin-bottom: 0.5rem;
	}
}

@media (max-width: 768px) {
	.members-gallery-grid {
		grid-auto-columns: 75vw; /* Mobile: 1 visible + part of 2nd */
	}
}

/* Ensure flex-grow on info for ALL screens to fix height consistency */
.gallery-info {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}

/* Image Wrapper */
.gallery-image-wrapper {
	position: relative;
	width: 100%;
	aspect-ratio: 4/5;
	height: auto;
	margin-bottom: 0;
	z-index: 1;
	overflow: hidden;
	flex-shrink: 0; /* Keep image aspect ratio intact */
}

.gallery-image-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	position: relative;
	z-index: 2;
	transition: transform 0.5s ease;
}

/* Hide the old frame */
.gallery-frame {
	display: none;
}

/* Hover Effects on Image */
.member-gallery-card:hover .gallery-image-wrapper img {
	transform: scale(1.05);
}

.member-gallery-card:hover {
	transform: translateY(-5px);
}


/* Info Section - Navy Gradient Strip */
.gallery-info {
	position: relative;
	background: linear-gradient(135deg, var(--navy-dark) 0%, var(--navy-primary) 100%);
	padding: 20px 15px;
	text-align: center;
	border-bottom: 3px solid var(--gold-accent);
	width: 100%;
	z-index: 5;
	flex-grow: 1; /* Fill remaining space */
	display: flex;
	flex-direction: column;
	justify-content: flex-start; /* Align text to top */
}

/* Accent Line Animation */
.gallery-info::before {
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 3px;
	background-color: var(--gold-accent);
	transition: width 0.3s ease;
	z-index: 10;
}

.member-gallery-card:hover .gallery-info::before {
	width: 100%;
}

.gallery-info h3 {
	font-family: var(--font-heading);
	font-size: 1.4rem;
	color: var(--white);
	margin-bottom: 5px;
	transition: color 0.3s ease;
	font-weight: 700;
	line-height: 1.2;
	text-transform: none;
}

.gallery-info .role {
	font-family: var(--font-body);
	font-size: 0.8rem;
	color: var(--gold-accent);
	text-transform: none;
	letter-spacing: 1px;
	margin-bottom: 5px;
	font-weight: 600;
}

/* Link reveal on hover */
.profile-link {
	opacity: 0;
	transform: translateY(10px);
	display: inline-block;
	margin-top: 15px;
	padding: 0;
	/* Removed padding as it's text link now */
	font-size: 1rem;
	font-weight: 600;
	text-transform: uppercase;
	color: var(--gold-accent);
	/* Gold color like the reference */
	font-family: var(--font-heading);
	/* Cormorant Garamond */
	letter-spacing: 2px;
	border: none;
	background: none;
	position: relative;
	transition: all 0.3s ease;
}

.profile-link:hover {
	color: var(--navy-primary);
	background: none;
}

/* Underline animation */
.profile-link::after {
	content: '';
	position: absolute;
	width: 0;
	height: 1px;
	bottom: -4px;
	left: 50%;
	transform: translateX(-50%);
	background-color: var(--navy-primary);
	transition: width 0.3s ease;
}

.profile-link:hover::after {
	width: 100%;
}

.member-gallery-card:hover .profile-link {
	opacity: 1;
	transform: translateY(0);
}

.member-gallery-card:hover h3 {
	color: var(--gold-accent);
}

/* See All Button */
.btn-text-gold-large {
	display: inline-block;
	margin-top: 30px;
	padding: 10px 20px;
	font-family: var(--font-heading);
	font-size: 1.1rem;
	font-weight: 600;
	text-transform: uppercase;
	color: var(--navy-primary);
	border: 1px solid var(--navy-primary);
	letter-spacing: 2px;
	transition: all 0.3s ease;
}

.btn-text-gold-large:hover {
	color: var(--gold-accent);
	border-color: var(--gold-accent);
	transform: translateY(-3px);
}

.mb-large {
	margin-bottom: var(--spacing-lg);
}

.mt-large {
	margin-top: var(--spacing-lg);
}


/* Board Section */
.board-group-wrapper {
	margin-bottom: 60px;
}

.board-group-title {
	font-size: 2rem;
	margin-bottom: 3rem;
	padding-bottom: 1rem;
	border-bottom: 2px solid var(--gold-accent);
	text-align: center;
	display: block;
	max-width: 400px;
	margin-left: auto;
	margin-right: auto;
}

/* --- Board Split Layout (The "Good" Layout) --- */
.board-split-layout {
	display: flex;
	gap: 30px;
	margin-bottom: 4rem;
	align-items: stretch; /* Stretch to same height */
}

/* Left: President Column */
.president-column {
	width: 33.33%;
}

/* High Specificity to override .board-card */
.board-split-layout .president-card-vertical {
	display: flex;
	flex-direction: column; /* Ensure vertical stack */
	height: 100%; 
	border-top: 5px solid var(--gold-accent);
	padding: 0;
	background: #ffffff;
	align-items: stretch;
}

.president-card-vertical .president-photo {
	width: 100%;
	height: auto;
	aspect-ratio: 4/5;
	overflow: hidden;
}

.president-card-vertical .president-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.president-card-vertical .board-info {
	padding: 2.5rem 2rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	width: 100%;
}

.president-card-vertical .board-info {
	padding: 2.5rem 2rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	background: white; /* Ensure white bg */
}

/* Updated Role and Name ordering styles */
.president-card-vertical .role-highlight {
	font-family: var(--font-body);
	text-transform: uppercase;
	color: var(--gold-accent);
	font-weight: 700;
	letter-spacing: 2px;
	font-size: 0.9rem;
	margin-top: 0.5rem;
	margin-bottom: 0;
	display: block;
}

.president-card-vertical .member-name {
	font-size: 2rem !important;
	color: var(--navy-primary);
	font-weight: 600;
	margin-bottom: 0.5rem;
}

.role-highlight {
	font-family: var(--font-body);
	text-transform: uppercase;
	color: var(--gold-accent);
	font-weight: 700;
	letter-spacing: 2px;
	font-size: 0.9rem;
	margin-bottom: 0.5rem;
	display: block;
}

.large-name {
	font-size: 2rem !important; /* Force larger size */
	margin-bottom: 0.5rem !important;
}

/* Right: Members Grid */
.members-column {
	width: 66.66%;
}

/* Ensure grid doesn't overlap/overflow */
.board-grid-compact {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	height: 100%;
}

/* --- Compact Grid Member Cards (Overlay Style) --- */
.board-grid-compact .board-card {
    display: block !important; /* Force block to override flex */
    position: relative;
    height: 100%;
    min-height: 320px; /* Ensure tall enough for vertical image */
    padding: 0;
    overflow: hidden;
    border-radius: 2px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    background: #000; /* Dark background behind image */
}

/* Photo fills the card */
.board-grid-compact .board-photo-frame {
    width: 100% !important;
    height: 100% !important;
    position: absolute !important;
    top: 0;
    left: 0;
    margin: 0 !important;
    z-index: 1;
}

.board-grid-compact .board-photo-frame img {
    height: 100%;
    width: 100%; 
    object-position: top center;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.board-grid-compact .board-card:hover .board-photo-frame img {
    transform: scale(1.05);
}

/* Info overlay at bottom */
.board-grid-compact .board-info {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 2;
    background: linear-gradient(to top, rgba(20, 50, 88, 0.95) 0%, rgba(20, 50, 88, 0.6) 40%, rgba(20, 50, 88, 0) 100%);
    padding: 50px 20px 20px; /* Reduced top padding to lower shadow */
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

/* Override text colors for dark overlay */
.board-grid-compact .board-name {
    color: #ffffff;
    font-size: 1.3rem;
    margin-bottom: 2px;
    font-weight: 600;
}

.board-grid-compact .board-role {
    color: var(--gold-accent);
    font-size: 0.75rem;
    opacity: 1;
}

/* --- Council Card Horizontal Stack (Dark Luxury) --- */
.council-stack {
	display: flex;
	flex-direction: column;
	gap: 20px;
	height: 100%;
}

.council-card-horizontal {
	display: flex;
	flex-direction: row;
	/* Dark gradient background to match Board Grid style */
	background: linear-gradient(135deg, var(--navy-dark) 0%, #152336 100%);
	box-shadow: 0 10px 30px rgba(0,0,0,0.15);
	height: 50%; 
	min-height: 180px;
	align-items: stretch;
	padding: 0;
	position: relative;
    border-left: none; /* Replaced by pseudo-element */
    overflow: hidden; /* For zoom effect */
    transition: transform 0.3s ease;
}

.council-card-horizontal:hover {
    transform: translateY(-5px);
}

/* Gold Accent Line */
.council-card-horizontal::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--gold-accent);
    z-index: 10;
}

.council-photo-wrapper {
	width: 40%; /* Wider proportional photo */
    max-width: 200px;
	height: 100%;
	flex-shrink: 0;
	position: relative;
    overflow: hidden;
}

.council-photo-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
    transition: transform 0.6s ease;
}

.council-card-horizontal:hover .council-photo-wrapper img {
    transform: scale(1.05);
}

.council-info {
	padding: 2rem;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
    position: relative;
    z-index: 2;
}

/* White Text for Dark Background */
.council-info .board-name {
	font-family: var(--font-heading);
	font-size: 1.5rem;
	color: #ffffff; /* White text */
	margin-bottom: 0.5rem;
}

.council-info .board-role {
	font-family: var(--font-body);
	font-size: 0.85rem;
	color: var(--gold-accent);
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 600;
}

/* Responsive adjustments for stack */
@media (max-width: 768px) {
	/* Mobile: Horizontal Card Look (Like Desktop Picture) */
	.council-card-horizontal {
		display: flex;
		flex-direction: row; /* Force Row */
		height: auto;
		min-height: 180px; /* INCREASED HEIGHT to match Board 1:1 */
		width: 100%;
		border: none;
		border-radius: 4px;
		overflow: hidden;
		box-shadow: 0 5px 15px rgba(0,0,0,0.1);
		margin-bottom: 20px;
		background: linear-gradient(135deg, var(--navy-dark) 0%, #152336 100%);
	}

	/* Reset Photo */
	.council-photo-wrapper {
		position: relative;
		width: 180px; /* Fixed width 1:1 */
		min-width: 180px; 
		height: auto;
		min-height: 180px; /* Force minimum height match */
		top: auto; left: auto;
		max-width: none;
		flex-shrink: 0;
	}
	
	.council-photo-wrapper img {
		position: absolute;
		top: 0; left: 0;
		height: 100%; width: 100%;
		object-fit: cover;
	}

	/* Info Side */
	.council-info {
		position: relative;
		width: auto; 
		padding: 20px; /* MATCH 20px */
		justify-content: center;
		flex-grow: 1;
		
		/* Align text */
		align-items: flex-start;
		text-align: left;
	}

	.board-grid-compact .board-name {
		font-family: var(--font-heading); 
		color: #fff;
		font-size: 1.25rem !important; /* FIXED SIZE MATCH: 1.25rem */
		font-weight: 600 !important;
		margin-bottom: 5px;
		line-height: 1.2;
	}
	
	.board-grid-compact .board-role {
		font-family: var(--font-body);
		color: var(--gold-accent);
		font-size: 0.75rem; 
		text-transform: uppercase;
		letter-spacing: 0.5px;
	}
}

/* Responsive for President Layout */
@media (max-width: 992px) {
	.board-split-layout {
		flex-direction: column;
	}
	
	.president-column, 
	.members-column {
		width: 100%;
	}

	/* Ensure President/Chairman Card stays Vertical and on Top */
	.president-card-vertical {
		max-width: 500px;
		margin: 0 auto 30px auto; /* Add bottom margin */
		display: flex !important;
		flex-direction: column !important;
		height: auto !important;
	}
	
	/* Reset internal elements for vertical layout explicitly */
	.president-card-vertical .president-photo {
		width: 100% !important;
		height: auto !important;
		aspect-ratio: 4/5;
		position: relative !important;
	}
	
	.president-card-vertical .board-info {
		position: relative !important;
		width: 100% !important;
		background: #ffffff !important;
		padding: 30px 20px !important;
		display: flex !important;
		flex-direction: column !important;
		align-items: center !important;
		text-align: center !important;
	}
}



.board-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px;
	justify-content: center;
}

@media (max-width: 768px) {
	.board-grid {
		grid-template-columns: 1fr;
	}
}

.board-card {
	display: flex;
	flex-direction: row;
	align-items: center;
	background-color: var(--white);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	height: 100%;
}

.board-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
}

.board-photo-frame {
	position: relative;
	width: 150px;
	height: 150px;
	aspect-ratio: 1/1;
	flex-shrink: 0;
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
}

.board-photo-frame img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: none;
	display: block;
}

.board-info {
	width: auto;
	flex-grow: 1;
	background: var(--white);
	padding: 20px 25px;
	text-align: left;
	border-bottom: none;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.board-name {
	font-family: var(--font-heading);
	font-size: 1.3rem;
	color: var(--navy-primary);
	margin-bottom: 5px;
	font-weight: 700;
	line-height: 1.2;
	text-transform: none;
}

.board-role {
	font-family: var(--font-body);
	font-size: 0.8rem;
	color: var(--gold-accent);
	text-transform: none;
	letter-spacing: 1px;
	font-weight: 600;
	margin-top: 5px;
}

/* News Section */
.news-section {
	background-color: var(--white);
}

.news-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
	gap: 40px;
}

.news-card {
	display: flex;
	gap: 20px;
	padding: 20px;
	border: 1px solid transparent;
	transition: all 0.3s ease;
}

.news-card:hover {
	border-color: rgba(197, 160, 89, 0.3);
	background-color: #fafafa;
}

.news-date {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: 80px;
	height: 100px;
	border: 1px solid var(--gold-accent);
	color: var(--navy-primary);
	padding: 10px;
}

.news-date .day {
	font-size: 2rem;
	font-weight: 700;
	font-family: var(--font-heading);
	line-height: 1;
}

.news-date .month {
	font-size: 0.8rem;
	text-transform: uppercase;
	font-weight: 600;
	margin: 5px 0;
}

.news-date .year {
	font-size: 0.8rem;
	color: var(--text-light);
}

.news-content h3 {
	font-size: 1.5rem;
	margin-bottom: 0.8rem;
}

.news-content p {
	color: var(--text-light);
	margin-bottom: 1rem;
	font-size: 0.95rem;
}

.read-more {
	font-size: 0.85rem;
	text-transform: uppercase;
	color: var(--gold-accent);
	font-weight: 600;
	letter-spacing: 1px;
}

/* --- Cinematic Quote Section --- */
.cinematic-quote-section {
	position: relative;
	padding: 180px 0 100px 0;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--navy-dark);
}

.cinematic-quote-section .parallax-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	/* Simple parallax */
	opacity: 0.2;
	z-index: 1;
	filter: grayscale(100%) contrast(120%);
	/* Artistic touch */
}

/* Fallback for mobile where fixed bg might be janky */
@media (hover: none) {
	.cinematic-quote-section .parallax-bg {
		background-attachment: scroll;
	}
}

.cinematic-quote-section .overlay-gradient {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #143258; /* Changed from gradient per user request */
	opacity: 0.9; /* Added opacity to ensure image is visible */
	z-index: 2;
}

.quote-container {
	position: relative;
	z-index: 3;
	text-align: center;
	max-width: 900px;
}

.quote-decoration {
	font-family: 'Times New Roman', serif;
	font-size: 12rem;
	line-height: 0;
	color: var(--gold-accent);
	opacity: 0.15;
	position: absolute;
	top: -40px;
	left: 50%;
	transform: translateX(-50%);
	z-index: -1;
}

.cinematic-text {
	font-family: var(--font-heading);
	font-size: 3rem;
	line-height: 1.3;
	color: rgba(255, 255, 255, 0.9);
	font-style: italic;
	margin: 0;
	padding: 0 20px;
	text-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
}

.cinematic-text .text-gold {
	color: var(--gold-accent);
	font-weight: 400;
	/* Let the sparkle do the work */
}

.cinematic-text .text-white {
	color: #fff;
	font-weight: 600;
}

.quote-line-anim {
	width: 0;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--gold-accent), transparent);
	margin: 40px auto 0;
	animation: expandLine 1.5s ease-out forwards;
	animation-delay: 0.5s;
	/* Wait for scroll reveal if implemented, currently hardcoded delay */
}

@keyframes expandLine {
	to {
		width: 150px;
	}
}

@media (max-width: 768px) {
	.cinematic-text {
		font-size: 1.8rem;
	}

	.quote-decoration {
		font-size: 8rem;
		top: -20px;
	}
}

/* Footer Details */
.main-footer {
	padding: 5rem 0 2rem;
	background-color: var(--navy-dark);
	color: rgba(255, 255, 255, 0.7);
	font-size: 0.9rem;
	margin-top: auto;
	font-family: var(--font-body);
	/* Force sans-serif */
}

.footer-logo {
	height: 60px;
	width: auto;
	margin-bottom: 1.5rem;
	filter: brightness(0) invert(1);
	/* Ensure logo is white */
	opacity: 0.9;
}

.footer-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 40px;
	margin-bottom: 4rem;
}

.footer-col h4 {
	color: var(--white);
	margin-bottom: 1.5rem;
	font-size: 1.2rem;
	letter-spacing: 1px;
	text-transform: uppercase;
	font-family: var(--font-body);
	/* Force sans-serif headings */
	font-weight: 600;
}

.footer-col p {
	margin-bottom: 0.8rem;
}

.footer-col a {
	color: var(--gold-accent);
}

.footer-links li {
	margin-bottom: 0.8rem;
}

.footer-links a {
	color: rgba(255, 255, 255, 0.7);
	transition: color 0.3s;
}

.footer-links a:hover {
	color: var(--gold-accent);
	padding-left: 5px;
}

.footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	padding-top: 2rem;
	font-size: 0.8rem;
}

/* --- Responsive Updates --- */
@media (max-width: 1024px) {
	.board-layout {
		gap: 2rem;
	}
}

@media (max-width: 900px) {
	.hero-title {
		font-size: 3.5rem;
	}

	.board-layout {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 768px) {
	.news-grid {
		grid-template-columns: 1fr;
	}

	.news-card {
		flex-direction: column;
	}

	.news-date {
		flex-direction: row;
		width: 100%;
		height: auto;
		justify-content: flex-start;
		gap: 10px;
		padding: 5px 10px;
		background-color: rgba(197, 160, 89, 0.1);
		border: none;
	}

	.news-date .day,
	.news-date .month,
	.news-date .year {
		margin: 0;
		font-size: 1rem;
	}
	
	/* --- Mobile Dropdown Styles --- */
	.main-nav .menu-list li {
		width: 100%;
		text-align: center;
		padding-bottom: 0;
		margin-bottom: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		position: relative;
	}

	.main-nav .has-dropdown > a {
		padding-right: 0;
		margin-bottom: 5px;
		display: inline-flex;
		align-items: center;
		gap: 5px;
		width: auto;
		position: relative;
	}
	
	/* Mobile Submenu Toggle Button */
	.mobile-submenu-toggle {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		width: auto;
		height: auto;
		background: none;
		border: none;
		cursor: pointer;
		color: var(--gold-accent);
		transition: all 0.3s ease;
		padding: 0;
		margin-left: 3px;
	}
	
	.mobile-submenu-toggle:hover {
		color: var(--navy-primary);
		background: none;
	}

	.mobile-submenu-toggle i {
		font-size: 0.65rem;
		transition: transform 0.3s ease;
	}

/* --- MERGED FROM new_authority_styles.css --- */

/* --- NEW AUTHORITY SECTION (Elegant Portraits) --- */
.authority-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 40px;
    margin-top: 3rem;
}

.authority-card {
    width: 320px;
    background: #fff;
    box-shadow: 0 5px 20px rgba(0,0,0,0.03);
    border-bottom: 3px solid transparent;
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden; /* Ensure overlay stays inside */
}

.authority-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 50px rgba(0,0,0,0.1);
    border-bottom-color: var(--gold-accent);
}

.authority-img-wrapper {
    height: 360px;
    width: 100%;
    position: relative;
    overflow: hidden;
    background-color: #e0e0e0;
}

.authority-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease, filter 0.4s ease;
    filter: saturate(0.8) contrast(1.1); /* Slightly editorial look */
}

.authority-card:hover .authority-img-wrapper img {
    transform: scale(1.05);
    filter: saturate(1) contrast(1);
}

/* Bio Overlay - Slides up over image */
.authority-bio-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(20, 50, 88, 0.96); /* New Deep Navy #143258 */
    color: #fff;
    padding: 2.5rem 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s ease;
    transform: translateY(10px);
}

.authority-card:hover .authority-bio-overlay {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.authority-bio-text {
    font-size: 0.95rem;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.9);
    font-style: italic;
    font-family: var(--font-heading); /* Serif font for bio */
}

/* Info Box */
.authority-info {
    padding: 1.5rem;
    text-align: center;
    background: var(--white);
    position: relative;
    z-index: 5;
}

.authority-role {
    display: block;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--gold-accent);
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.authority-name {
    font-family: var(--font-heading);
    font-size: 1.6rem;
    color: var(--navy-primary);
    margin: 0;
}

/* --- Council List (Clean Ledger Style) --- */
.council-ledger {
    max-width: 900px;
    margin: 4rem auto 0;
    border-top: 1px solid #eaeaea;
}

.council-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 2rem;
    border-bottom: 1px solid #eaeaea;
    transition: background 0.3s ease;
}

.council-row:hover {
    background-color: var(--white);
    box-shadow: 0 5px 15px rgba(0,0,0,0.03);
    border-color: transparent;
    transform: scale(1.01);
}

.council-row-name {
    font-family: var(--font-heading);
    font-size: 1.3rem;
    color: var(--navy-dark);
    font-weight: 600;
}

.council-row-role {
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.council-row-role::before {
    content: '';
    display: block;
    width: 20px;
    height: 1px;
    background-color: var(--gold-accent);
}

@media (max-width: 768px) {
    .council-row {
        flex-direction: column;
        gap: 10px;
        text-align: center;
    }
    .council-row-role::before {
        display: none;
    }
}


/* --- MERGED FROM new_science_style.css --- */
/* --- Modern Clean Science Section 2026 --- */
.science-business-luxury {
    background-color: #fff;
    color: var(--text-dark);
    padding: 100px 0;
    position: relative;
    overflow: hidden;
}

/* Container */
.science-business-luxury .container {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Grid Layout */
.science-luxury-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 60px;
    align-items: center;
    width: 100%;
}

/* --- Visual Side (Left) --- */
.science-visual-wrapper {
    position: relative;
    width: 100%;
}

.science-visual-frame {
    position: relative;
    width: 100%;
    /* Aspect ratio 4:5 is very modern portrait, 4:3 is standard. Let's go 4:3 */
    aspect-ratio: 4/3; 
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0,0,0,0.12);
    /* No border, just clean shadow */
}

.science-hero-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.science-visual-wrapper:hover .science-hero-img {
    transform: scale(1.03);
}

/* Floating Sticker Badge */
.science-sticker {
    position: absolute;
    bottom: 40px;
    left: -40px;
    background-color: var(--white);
    padding: 20px 30px;
    border-radius: 16px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.15);
    display: flex;
    align-items: center;
    gap: 20px;
    z-index: 3;
    animation: float-badge 6s ease-in-out infinite;
}

.sticker-icon {
    width: 50px;
    height: 50px;
    background-color: var(--gold-accent);
    color: var(--white);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.2rem;
}

.sticker-content {
    display: flex;
    flex-direction: column;
}

.sticker-number {
    font-family: var(--font-heading);
    font-size: 2rem;
    line-height: 1;
    font-weight: 700;
    color: var(--navy-primary);
}

.sticker-label {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--text-light);
    font-weight: 600;
    margin-top: 5px;
}

@keyframes float-badge {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

/* --- Content Side (Right) --- */
.science-content-luxury {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.science-label {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: var(--gold-accent);
    font-weight: 600;
    margin-bottom: 25px;
}

.science-label::before {
    content: "";
    display: block;
    width: 40px;
    height: 2px;
    background-color: var(--gold-accent);
}

.science-section-title {
    font-family: var(--font-heading);
    font-size: 3.5rem;
    line-height: 1.1;
    color: var(--navy-primary);
    margin-bottom: 30px;
}

.science-section-title span {
    color: var(--gold-accent); /* Optional: use if highlighting words */
}

.science-lead-text {
    font-size: 1.2rem;
    line-height: 1.6;
    color: var(--text-dark);
    margin-bottom: 30px;
    font-weight: 500;
}

.science-description {
    font-size: 1rem;
    line-height: 1.8;
    color: var(--text-light);
    margin-bottom: 50px;
}

/* --- Logos Marquee (Clean) --- */
.universities-marquee {
    margin-top: 20px;
    padding-top: 10px;
    border-top: 1px solid rgba(0,0,0,0.08);
}

.marquee-title {
    display: block;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--navy-primary);
    margin-bottom: 25px;
    font-weight: 700;
}

.marquee-viewport {
    width: 100%;
    overflow: hidden;
    position: relative;
    /* Soft fade masks on edges */
    mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
}

.marquee-track {
    display: flex;
    gap: 60px; /* Reduced gap */
    width: max-content;
    /* Speed calculation: width / speed. Adjust if needed. */
    animation: marquee-scroll 50s linear infinite;
    align-items: center;
}

.marquee-track:hover {
    animation-play-state: paused;
}

@keyframes marquee-scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); } /* Assumes duplicated content */
}

.partner-logo {
    height: 60px; /* Balanced size */
    width: auto;
    object-fit: contain;
    /* Full Color & Blend with BG */
    filter: none;
    mix-blend-mode: multiply; /* Removes white background */
    transition: all 0.4s ease;
}

.partner-logo:hover {
    transform: scale(1.1);
    cursor: pointer;
}

/* Button */
.btn-science-primary {
    align-self: flex-start;
    margin-top: 40px;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 16px 40px;
    background-color: var(--navy-primary);
    color: var(--white);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 0.85rem;
    border-radius: 4px;
    transition: all 0.3s ease;
    text-decoration: none;
}

.btn-science-primary:hover {
    background-color: var(--gold-accent);
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(197, 160, 89, 0.3);
}

/* --- Responsive Adjustments --- */
@media (max-width: 900px) {
    .science-business-luxury {
        padding: 60px 0;
    }
    .science-luxury-grid {
        grid-template-columns: 1fr; /* Stack */
        gap: 50px;
    }
    .science-visual-wrapper {
        aspect-ratio: 16/9; /* Wider on mobile */
    }
    .science-sticker {
        left: 20px;
        bottom: -30px;
    }
}

@media (max-width: 768px) {
    .science-section-title {
        font-size: 2.5rem;
    }
    .science-sticker {
        padding: 15px 20px;
        bottom: -25px;
    }
    .sticker-number { font-size: 1.5rem; }
    .sticker-icon { width: 40px; height: 40px; font-size: 1rem; }
    
    .marquee-track {
        gap: 40px;
    }
    .partner-logo {
        height: 40px;
    }
}



/* --- Keyframes --- */
@keyframes marquee-scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}


/* --- Custom Science Divider --- */
.science-divider {
    width: 80px;
    height: 3px;
    background-color: var(--gold-accent);
    margin: 1.5rem 0 2rem 0;
    border-radius: 2px;
}


/* --- Complex Visual Composition (Science) --- */
.science-visual-complex {
    position: relative;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    padding: 30px;
    /* Ensure container has height */
    min-height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.deco-frame {
    position: absolute;
    top: 0;
    left: 0;
    width: 70%;
    height: 70%;
    border: 2px solid var(--gold-accent);
    z-index: 1;
    opacity: 0.6;
}

.main-image-frame {
    position: relative;
    z-index: 2;
    width: 85%;
    aspect-ratio: 4/5;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0,0,0,0.15);
}

.complex-main-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.sticker-box {
    position: absolute;
    background: white;
    padding: 20px 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 4;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    min-width: 140px;
    text-align: center;
}

.sticker-box.top-right {
    top: 60px;
    right: 0;
}

.sticker-box.bottom-left {
    bottom: 40px;
    left: 10px;
}

.sticker-val {
    display: block;
    font-family: var(--font-heading);
    font-size: 2rem;
    color: var(--navy-primary);
    font-weight: 700;
    line-height: 1;
}

.sticker-sub {
    display: block;
    font-size: 0.75rem;
    text-transform: uppercase;
    color: var(--gold-accent);
    letter-spacing: 1px;
    font-weight: 600;
    margin-top: 5px;
}

/* Inset Person Image */
.inset-person-frame {
    position: absolute;
    bottom: -20px;
    right: -20px;
    width: 180px;
    height: 220px;
    z-index: 5;
    border: 8px solid white;
    box-shadow: 0 15px 40px rgba(0,0,0,0.2);
    overflow: hidden;
}

.inset-person-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
}

@media (max-width: 768px) {
    .inset-person-frame {
        width: 120px;
        height: 150px;
        right: 0;
        bottom: -30px;
    }
    .sticker-box {
        padding: 15px;
        min-width: 100px;
    }
    .sticker-val { font-size: 1.5rem; }
    .science-visual-complex {
        padding: 10px;
        max-width: 100%;
    }
}


/* Fix for the complex visual container */
.science-visual-complex {
    width: 100%;
    max-width: 500px;
    position: relative;
    /* Aspect ratio for the overall composition */
    aspect-ratio: 4/5;
    margin: 30px auto;
}

.deco-frame {
    position: absolute;
    top: 50px;
    left: 20px;
    width: 60%;
    height: 60%;
    border: 2px solid var(--gold-accent);
    z-index: 1;
    opacity: 0.8;
}

.main-image-frame {
    position: absolute;
    top: 0;
    left: 40px;
    right: 40px;
    bottom: 40px;
    z-index: 2;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0,0,0,0.15);
}

.complex-main-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Stickers */
.sticker-box {
    background: var(--white);
    padding: 25px;
    position: absolute;
    box-shadow: 0 15px 40px rgba(0,0,0,0.1);
    z-index: 5;
    text-align: center;
}

.sticker-box.top-right {
    top: 60px;
    right: 0;
}

.sticker-box.bottom-left {
    bottom: 0;
    left: 20px;
    padding: 30px 40px;
}

.sticker-val {
    display: block;
    font-family: var(--font-heading);
    font-size: 2.5rem; /* Larger number */
    font-weight: 700;
    color: var(--navy-primary);
    line-height: 1;
    margin-bottom: 5px;
}

.sticker-sub {
    display: block;
    font-family: var(--font-body);
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--gold-accent);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    line-height: 1.4;
}

/* Inset Person */
.inset-person-frame {
    position: absolute;
    bottom: 20px;
    right: -20px;
    width: 140px;
    height: 160px;
    background: var(--white);
    padding: 6px;
    z-index: 10;
    box-shadow: 0 20px 50px rgba(0,0,0,0.2);
}

.inset-person-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* Align to top for portraits */
    object-position: top center;
}



.sticker-box.single-main {
    background: white;
    padding: 20px 30px;
    position: absolute;
    top: 50px;
    left: -25px; /* Moved to Left */
    right: auto;
    box-shadow: 0 15px 40px rgba(0,0,0,0.12);
    z-index: 8;
    text-align: center;
    transition: tran

/* --- APPENDED new_science_style.css --- */
/* --- Modern Clean Science Section 2026 --- */
.science-business-luxury {
    background-color: #fff;
    color: var(--text-dark);
    padding: 100px 0;
    position: relative;
    overflow: hidden;
}

/* Container */
.science-business-luxury .container {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Grid Layout */
.science-luxury-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 60px;
    align-items: center;
    width: 100%;
}

/* --- Visual Side (Left) --- */
.science-visual-wrapper {
    position: relative;
    width: 100%;
}

.science-visual-frame {
    position: relative;
    width: 100%;
    /* Aspect ratio 4:5 is very modern portrait, 4:3 is standard. Let's go 4:3 */
    aspect-ratio: 4/3; 
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0,0,0,0.12);
    /* No border, just clean shadow */
}

.science-hero-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.science-visual-wrapper:hover .science-hero-img {
    transform: scale(1.03);
}

/* Floating Sticker Badge */
.science-sticker {
    position: absolute;
    bottom: 40px;
    left: -40px;
    background-color: var(--white);
    padding: 20px 30px;
    border-radius: 16px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.15);
    display: flex;
    align-items: center;
    gap: 20px;
    z-index: 3;
    animation: float-badge 6s ease-in-out infinite;
}

.sticker-icon {
    width: 50px;
    height: 50px;
    background-color: var(--gold-accent);
    color: var(--white);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.2rem;
}

.sticker-content {
    display: flex;
    flex-direction: column;
}

.sticker-number {
    font-family: var(--font-heading);
    font-size: 2rem;
    line-height: 1;
    font-weight: 700;
    color: var(--navy-primary);
}

.sticker-label {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--text-light);
    font-weight: 600;
    margin-top: 5px;
}

@keyframes float-badge {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

/* --- Content Side (Right) --- */
.science-content-luxury {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.science-label {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: var(--gold-accent);
    font-weight: 600;
    margin-bottom: 25px;
}

.science-label::before {
    content: "";
    display: block;
    width: 40px;
    height: 2px;
    background-color: var(--gold-accent);
}

.science-section-title {
    font-family: var(--font-heading);
    font-size: 3.5rem;
    line-height: 1.1;
    color: var(--navy-primary);
    margin-bottom: 30px;
}

.science-section-title span {
    color: var(--gold-accent); /* Optional: use if highlighting words */
}

.science-lead-text {
    font-size: 1.2rem;
    line-height: 1.6;
    color: var(--text-dark);
    margin-bottom: 30px;
    font-weight: 500;
}

.science-description {
    font-size: 1rem;
    line-height: 1.8;
    color: var(--text-light);
    margin-bottom: 50px;
}

/* --- Logos Marquee (Clean) --- */
.universities-marquee {
    margin-top: 20px;
    padding-top: 10px;
    border-top: 1px solid rgba(0,0,0,0.08);
}

.marquee-title {
    display: block;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--navy-primary);
    margin-bottom: 25px;
    font-weight: 700;
}

.marquee-viewport {
    width: 100%;
    overflow: hidden;
    position: relative;
    /* Soft fade masks on edges */
    mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
}

.marquee-track {
    display: flex;
    gap: 60px; /* Reduced gap */
    width: max-content;
    /* Speed calculation: width / speed. Adjust if needed. */
    animation: marquee-scroll 50s linear infinite;
    align-items: center;
}

.marquee-track:hover {
    animation-play-state: paused;
}

@keyframes marquee-scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); } /* Assumes duplicated content */
}

.partner-logo {
    height: 60px; /* Balanced size */
    width: auto;
    object-fit: contain;
    /* Full Color & Blend with BG */
    filter: none;
    mix-blend-mode: multiply; /* Removes white background */
    transition: all 0.4s ease;
}

.partner-logo:hover {
    transform: scale(1.1);
    cursor: pointer;
}

/* Button */
.btn-science-primary {
    align-self: flex-start;
    margin-top: 40px;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 16px 40px;
    background-color: var(--navy-primary);
    color: var(--white);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 0.85rem;
    border-radius: 4px;
    transition: all 0.3s ease;
    text-decoration: none;
}

.btn-science-primary:hover {
    background-color: var(--gold-accent);
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(197, 160, 89, 0.3);
}

/* --- Responsive Adjustments --- */
@media (max-width: 900px) {
    .science-business-luxury {
        padding: 60px 0;
    }
    .science-luxury-grid {
        grid-template-columns: 1fr; /* Stack */
        gap: 50px;
    }
    .science-visual-wrapper {
        aspect-ratio: 16/9; /* Wider on mobile */
    }
    .science-sticker {
        left: 20px;
        bottom: -30px;
    }
}

@media (max-width: 768px) {
    .science-section-title {
        font-size: 2.5rem;
    }
    .science-sticker {
        padding: 15px 20px;
        bottom: -25px;
    }
    .sticker-number { font-size: 1.5rem; }
    .sticker-icon { width: 40px; height: 40px; font-size: 1rem; }
    
    .marquee-track {
        gap: 40px;
    }
    .partner-logo {
        height: 40px;
    }
}



/* --- Keyframes --- */
@keyframes marquee-scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}


/* --- Custom Science Divider --- */
.science-divider {
    width: 80px;
    height: 3px;
    background-color: var(--gold-accent);
    margin: 1.5rem 0 2rem 0;
    border-radius: 2px;
}


/* --- Complex Visual Composition (Science) --- */
.science-visual-complex {
    position: relative;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    padding: 30px;
    /* Ensure container has height */
    min-height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.deco-frame {
    position: absolute;
    top: 0;
    left: 0;
    width: 70%;
    height: 70%;
    border: 2px solid var(--gold-accent);
    z-index: 1;
    opacity: 0.6;
}

.main-image-frame {
    position: relative;
    z-index: 2;
    width: 85%;
    aspect-ratio: 4/5;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0,0,0,0.15);
}

.complex-main-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.sticker-box {
    position: absolute;
    background: white;
    padding: 20px 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 4;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    min-width: 140px;
    text-align: center;
}

.sticker-box.top-right {
    top: 60px;
    right: 0;
}

.sticker-box.bottom-left {
    bottom: 40px;
    left: 10px;
}

.sticker-val {
    display: block;
    font-family: var(--font-heading);
    font-size: 2rem;
    color: var(--navy-primary);
    font-weight: 700;
    line-height: 1;
}

.sticker-sub {
    display: block;
    font-size: 0.75rem;
    text-transform: uppercase;
    color: var(--gold-accent);
    letter-spacing: 1px;
    font-weight: 600;
    margin-top: 5px;
}

/* Inset Person Image */
.inset-person-frame {
    position: absolute;
    bottom: -20px;
    right: -20px;
    width: 180px;
    height: 220px;
    z-index: 5;
    border: 8px solid white;
    box-shadow: 0 15px 40px rgba(0,0,0,0.2);
    overflow: hidden;
}

.inset-person-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
}

@media (max-width: 768px) {
    .inset-person-frame {
        width: 120px;
        height: 150px;
        right: 0;
        bottom: -30px;
    }
    .sticker-box {
        padding: 15px;
        min-width: 100px;
    }
    .sticker-val { font-size: 1.5rem; }
    .science-visual-complex {
        padding: 10px;
        max-width: 100%;
    }
}


/* Fix for the complex visual container */
.science-visual-complex {
    width: 100%;
    max-width: 500px;
    position: relative;
    /* Aspect ratio for the overall composition */
    aspect-ratio: 4/5;
    margin: 30px auto;
}

.deco-frame {
    position: absolute;
    top: 50px;
    left: 20px;
    width: 60%;
    height: 60%;
    border: 2px solid var(--gold-accent);
    z-index: 1;
    opacity: 0.8;
}

.main-image-frame {
    position: absolute;
    top: 0;
    left: 40px;
    right: 40px;
    bottom: 40px;
    z-index: 2;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0,0,0,0.15);
}

.complex-main-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Stickers */
.sticker-box {
    background: var(--white);
    padding: 25px;
    position: absolute;
    box-shadow: 0 15px 40px rgba(0,0,0,0.1);
    z-index: 5;
    text-align: center;
}

.sticker-box.top-right {
    top: 60px;
    right: 0;
}

.sticker-box.bottom-left {
    bottom: 0;
    left: 20px;
    padding: 30px 40px;
}

.sticker-val {
    display: block;
    font-family: var(--font-heading);
    font-size: 2.5rem; /* Larger number */
    font-weight: 700;
    color: var(--navy-primary);
    line-height: 1;
    margin-bottom: 5px;
}

.sticker-sub {
    display: block;
    font-family: var(--font-body);
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--gold-accent);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    line-height: 1.4;
}

/* Inset Person */
.inset-person-frame {
    position: absolute;
    bottom: 20px;
    right: -20px;
    width: 140px;
    height: 160px;
    background: var(--white);
    padding: 6px;
    z-index: 10;
    box-shadow: 0 20px 50px rgba(0,0,0,0.2);
}

.inset-person-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* Align to top for portraits */
    object-position: top center;
}



.sticker-box.single-main {
    background: white;
    padding: 20px 30px;
    position: absolute;
    top: 50px;
    left: -25px; /* Moved to Left */
    right: auto;
    box-shadow: 0 15px 40px rgba(0,0,0,0.12);
    z-index: 8;
    text-align: center;
    transition: transform 0.3s ease;
}

.sticker-box.single-main:hover {
    transform: translateY(-5px);
}
 


/* --- APPENDED temp_registry_light.css --- */

/* --- Registry Light Theme (for O-Klubie) --- */
.downloads-registry.light-theme {
    background-color: var(--white);
    padding: var(--spacing-xl) 0;
}

.downloads-registry.light-theme .registry-list-container {
    background: transparent;
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
}

.downloads-registry.light-theme .registry-item {
    border-bottom: 1px solid var(--border-color); /* Light border */
    background: transparent;
    transition: all 0.3s ease;
}

.downloads-registry.light-theme .registry-item:last-child {
    border-bottom: none;
}

.downloads-registry.light-theme .registry-item:hover {
    background-color: var(--cream-bg); /* Light cream hover */
    box-shadow: 0 5px 15px rgba(0,0,0,0.03);
}

.downloads-registry.light-theme .registry-title {
    color: var(--navy-primary);
    font-family: var(--font-heading);
    font-size: 1.4rem;
    font-weight: 500;
}

.downloads-registry.light-theme .registry-meta {
    color: var(--text-light);
}

/* Icon Box Light Version */
.downloads-registry.light-theme .registry-icon-box {
    background-color: transparent;
    border: 1px solid var(--border-color);
    color: var(--text-silver);
}

.downloads-registry.light-theme .registry-item:hover .registry-icon-box {
    background-color: var(--navy-primary);
    color: var(--gold-accent);
    border-color: var(--navy-primary);
}

/* Download Button Light Version */
.downloads-registry.light-theme .registry-download-btn {
    border: 1px solid var(--border-color);
    color: var(--navy-primary);
}

.downloads-registry.light-theme .registry-item:hover .registry-download-btn {
    background-color: var(--navy-primary);
    color: var(--white);
    border-color: var(--navy-primary);
}
sform 0.3s ease;
}

.sticker-box.single-main:hover {
    transform: translateY(-5px);
}
 


/* --- MERGED FROM temp_css_append.css --- */
/* --- Enhanced Board Deck with Bios --- */
.deck-card {
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.deck-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.2);
}

.deck-bio {
    opacity: 0;
    max-height: 0;
    margin-top: 0;
    font-size: 0.9rem;
    line-height: 1.4;
    color: rgba(255,255,255,0.9);
    transition: all 0.5s ease;
    overflow: hidden;
}

.deck-card:hover .deck-bio {
    opacity: 1;
    max-height: 150px;
    margin-top: 1rem;
    color: var(--navy-dark);
}

.deck-card:hover .deck-info h2,
.deck-card:hover .deck-info h3 {
    color: var(--navy-dark);
}

/* --- Council & Audit Section --- */
.council-section {
    margin-top: 5rem;
    padding-top: 3rem;
    border-top: 1px solid rgba(0,0,0,0.08);
}

.council-title-small {
    text-align: center;
    font-family: var(--font-heading);
    color: var(--text-light); /* Or Gold? */
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 0.9rem;
    margin-bottom: 2rem;
    display: block;
}

.council-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    text-align: center;
}

.council-item {
    padding: 1.5rem;
    background: var(--white);
    border: 1px solid rgba(0,0,0,0.03);
    transition: 0.3s;
}

.council-item:hover {
    background: #fffcf5; /* faint gold tint */
    border-color: rgba(197, 160, 89, 0.2);
}

.council-name {
    font-size: 1.25rem;
    color: var(--navy-primary);
    margin-bottom: 0.5rem;
}

.council-role {
    font-size: 0.85rem;
    color: var(--text-light);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
}

@media (max-width: 768px) {
    .council-grid {
        grid-template-columns: 1fr;
    }
}

/* --- Member Profile Section --- */
.member-profile-section {
    background-color: var(--white);
    position: relative;
    padding: var(--spacing-xl) 0;
}

.member-profile-content {
    position: relative;
    display: flow-root; 
}

.member-profile-img {
    float: left;
    width: 45%;
    max-width: 550px;
    height: auto;
    margin-right: 4rem;
    margin-bottom: 2rem;
    border-radius: 4px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
    object-fit: cover;
}

.member-profile-text {
    color: var(--text-dark);
}

.member-profile-text h2.section-title {
    color: var(--navy-primary);
    font-size: 3rem; 
    line-height: 1.1;
    margin-top: 0;
    margin-bottom: 2rem;
    text-align: left;
}

.member-profile-text p.section-desc {
    font-size: 1.15rem;
    line-height: 1.8;
    margin-bottom: 2rem;
    color: var(--text-dark);
}

.profile-highlight-box {
    margin-top: 3rem;
    padding: 1rem 0 1rem 2rem;
    border-left: 3px solid var(--gold-accent);
}

.profile-highlight-box h3 {
    font-family: var(--font-heading);
    color: var(--navy-primary);
    font-size: 1.8rem;
    margin-bottom: 1rem;
}

.profile-highlight-box p {
    font-size: 1.1rem;
    margin-bottom: 0;
    color: var(--text-light);
    font-weight: 500;
    line-height: 1.6;
}

@media (max-width: 900px) {
    .member-profile-img {
        float: none;
        width: 100%;
        max-width: 100%;
        margin-right: 0;
        margin-bottom: 3rem;
    }
    
    .profile-highlight-box {
        padding-left: 1.5rem;
        margin-top: 2rem;
    }
    
    .member-profile-text h2.section-title {
        font-size: 2.5rem;
    }
}


/* --- MERGED FROM temp_documents_style.css --- */
.documents-section {
    background-color: #f9f9f9; /* Very light gray */
    padding: 5rem 0;
}

.documents-list-container {
    max-width: 800px;
    margin: 3rem auto 0;
}

.document-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.document-item {
    display: flex;
    align-items: center;
    background-color: #ffffff;
    padding: 1.5rem 2rem;
    border: 1px solid rgba(0,0,0,0.05); /* Very subtle border */
    border-radius: 4px; /* Slight rounding, keeping it mostly sharp/minimalist */
    transition: all 0.3s ease;
    text-decoration: none;
    color: var(--text-dark);
}

.document-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    border-color: var(--gold-accent); /* Gold border on hover */
}

.doc-icon-wrapper {
    font-size: 2rem;
    color: var(--navy-primary); /* Navy icon color */
    margin-right: 1.5rem;
    width: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0.8;
}

.document-item:hover .doc-icon-wrapper {
    color: var(--gold-accent); /* Icon turns gold on hover */
    opacity: 1;
}

.doc-name {
    font-family: var(--font-body);
    font-weight: 500;
    font-size: 1.1rem;
    flex-grow: 1; /* Pushes download icon to the right */
}

.doc-download-icon {
    font-size: 1.2rem;
    color: #ccc;
    transition: color 0.3s ease;
}

.document-item:hover .doc-download-icon {
    color: var(--navy-primary);
}


/* --- MERGED FROM temp_new_docs.css --- */

/* --- Documents Section (Refined) --- */
.documents-section {
    background-color: var(--white);
    padding: var(--spacing-xl) 0;
}

.section-subtitle-wrapper {
    margin-bottom: 4rem;
}

.documents-list-container {
    max-width: 900px;
    margin: 0 auto;
    border-top: 1px solid var(--border-color); /* Top line */
}

.document-item {
    display: flex;
    align-items: center;
    padding: 2rem 1.5rem; /* Spacious padding */
    border-bottom: 1px solid var(--border-color); /* Bottom line separator */
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    position: relative;
    overflow: hidden; /* For pseudo-element effects */
    text-decoration: none; /* No underline */
    background-color: transparent;
}

.document-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background-color: var(--gold-accent);
    transform: scaleY(0);
    transition: transform 0.3s ease;
    transform-origin: bottom;
}

.document-item:hover {
    background-color: var(--cream-bg); /* Very light background on hover */
    padding-left: 2.5rem; /* Slide effect */
}

.document-item:hover::before {
    transform: scaleY(1);
    transform-origin: top;
}

.doc-icon-wrapper {
    font-size: 1.8rem;
    color: var(--text-silver); /* Subtle icon color */
    margin-right: 2rem;
    min-width: 40px;
    text-align: center;
    transition: color 0.3s ease;
}

.document-item:hover .doc-icon-wrapper {
    color: var(--navy-primary); /* Darker icon on hover */
}

.doc-name {
    font-family: var(--font-heading); /* Elegant serif font */
    font-weight: 500;
    font-size: 1.4rem; /* Larger text */
    color: var(--text-dark);
    flex-grow: 1;
    letter-spacing: 0.5px;
    transition: color 0.3s ease;
}

.document-item:hover .doc-name {
    color: var(--navy-primary);
}

.doc-download-icon {
    font-size: 1.2rem;
    color: var(--gold-accent);
    opacity: 0; /* Hidden initially */
    transform: translateX(-10px);
    transition: all 0.3s ease;
}

.document-item:hover .doc-download-icon {
    opacity: 1;
    transform: translateX(0); /* Slide in */
}

/* Specific styling for the PDF/file format pill */
.doc-meta {
    font-family: var(--font-body);
    font-size: 0.75rem;
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 1px;
    border: 1px solid var(--border-color);
    padding: 0.3rem 0.8rem;
    border-radius: 20px;
    margin-left: 1rem;
    margin-right: 2rem; /* Space before download icon */
    transition: all 0.3s ease;
}

.document-item:hover .doc-meta {
    border-color: var(--gold-accent);
    color: var(--gold-accent);
}

@media (max-width: 768px) {
    .document-item {
        padding: 1.5rem 1rem;
        flex-wrap: wrap;
    }
    
    .doc-name {
        font-size: 1.2rem;
        width: 100%; /* Break to new line on very small screens */
        margin-bottom: 0.5rem;
    }
    
    .doc-meta {
        margin-left: 0;
        margin-top: 0.5rem;
    }
}


/* --- MERGED FROM temp_registry_light.css --- */

/* --- Registry Light Theme (for O-Klubie) --- */
.downloads-registry.light-theme {
    background-color: var(--white);
    padding: var(--spacing-xl) 0;
}

.downloads-registry.light-theme .registry-list-container {
    background: transparent;
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
}

.downloads-registry.light-theme .registry-item {
    border-bottom: 1px solid var(--border-color); /* Light border */
    background: transparent;
    transition: all 0.3s ease;
}

.downloads-registry.light-theme .registry-item:last-child {
    border-bottom: none;
}

.downloads-registry.light-theme .registry-item:hover {
    background-color: var(--cream-bg); /* Light cream hover */
    box-shadow: 0 5px 15px rgba(0,0,0,0.03);
}

.downloads-registry.light-theme .registry-title {
    color: var(--navy-primary);
    font-family: var(--font-heading);
    font-size: 1.4rem;
    font-weight: 500;
}

.downloads-registry.light-theme .registry-meta {
    color: var(--text-light);
}

/* Icon Box Light Version */
.downloads-registry.light-theme .registry-icon-box {
    background-color: transparent;
    border: 1px solid var(--border-color);
    color: var(--text-silver);
}

.downloads-registry.light-theme .registry-item:hover .registry-icon-box {
    background-color: var(--navy-primary);
    color: var(--gold-accent);
    border-color: var(--navy-primary);
}

/* Download Button Light Version */
.downloads-registry.light-theme .registry-download-btn {
    border: 1px solid var(--border-color);
    color: var(--navy-primary);
}

.downloads-registry.light-theme .registry-item:hover .registry-download-btn {
    background-color: var(--navy-primary);
    color: var(--white);
    border-color: var(--navy-primary);
}

@media (max-width: 768px) {
	.main-nav .has-dropdown.active .mobile-submenu-toggle {
		background: none;
		color: var(--gold-accent);
	}
	
	.main-nav .has-dropdown.active .mobile-submenu-toggle i {
		transform: rotate(180deg);
	}

	/* Submenu initial state hidden */
	.main-nav .dropdown {
		position: static;
		opacity: 0;
		visibility: hidden;
		height: 0;
		overflow: hidden;
		transform: none;
		box-shadow: none;
		border-top: none;
		background-color: rgba(0, 0, 0, 0.02);
		width: 100%;
		padding: 0;
		display: block;
		margin-top: 0;
		transition: all 0.3s ease;
	}

	/* Submenu active state visible */
	.main-nav .has-dropdown.active .dropdown {
		opacity: 1;
		visibility: visible;
		height: auto;
		padding: 10px 0 20px 0;
		margin-top: 10px;
		margin-bottom: 15px;
	}

	.main-nav .has-dropdown > a::after {
		display: none;
	}

	.main-nav .has-dropdown > a::before {
		display: none; /* Hide the arrow */
	}

	.main-nav .dropdown li {
		width: 100%;
		padding: 0;
		margin: 0;
		border-bottom: 1px solid rgba(0,0,0,0.05);
	}

	.main-nav .dropdown li:last-child {
		border-bottom: none;
	}

	.main-nav .dropdown li a {
		padding: 12px 0;
		font-size: 0.9rem; 
		color: var(--text-light);
		background-color: transparent;
		font-weight: 500;
		display: block;
		text-transform: none;
	}

	.main-nav .dropdown li a:hover {
		color: var(--gold-accent);
		background-color: transparent;
		padding-left: 0;
	}


	.mobile-menu-toggle {
		display: flex;
	}

	.main-nav {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		width: 100%;
		background-color: var(--white);
		/* Always white background for dropdown */
		padding: 20px;
		box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
		border-top: 1px solid var(--border-color);
	}

	.main-nav.open {
		display: block;
		animation: slideDown 0.3s ease-out;
	}

	@keyframes slideDown {
		from {
			opacity: 0;
			transform: translateY(-10px);
		}

		to {
			opacity: 1;
			transform: translateY(0);
		}
	}

	.main-nav .menu-list {
		flex-direction: column;
		align-items: center;
		gap: 20px;
	}

	/* Force dark links in mobile menu */
	.main-nav a {
		color: var(--navy-primary);
		font-size: 1rem;
	}

	.two-column {
		grid-template-columns: 1fr;
	}

	.section-title {
		font-size: 2.2rem;
	}

	/* Hero Adjustments */
	.hero-title {
		font-size: 2.8rem;
	}

	.hero-lead {
		font-size: 1.1rem;
		padding: 0 10px;
	}

	.logo img {
		height: 40px;
	}
}
		height: auto;
		background: none; 
		padding: 20px; /* More padding for bigger look */
		justify-content: center;
		flex-grow: 1;
		align-items: flex-start;
		text-align: left;
	}
	
	/* ... Keep font sizes ... */


	.council-info .board-name {
		font-family: var(--font-heading);
		font-size: 1.25rem !important; /* FIXED SIZE: 1.25rem */
		font-weight: 600 !important;
		margin-bottom: 5px;
		color: #ffffff;
		line-height: 1.2;
	}

	.council-info .board-role {
		font-family: var(--font-body);
		font-size: 0.75rem; /* FIXED SIZE */
		color: var(--gold-accent);
		opacity: 0.9;
		letter-spacing: 0.5px;
		text-transform: uppercase;
	}
	
	/* Gold Line - Hide to match Zarzďż˝d style */
	.council-card-horizontal::before {
		display: none; 
	}
}

/* Force Board Grid Items (Zarzďż˝d) to also look like Horizontal Cards on Mobile */
/* Align breakpoint to 768px for consistency */
@media (max-width: 768px) {
	.board-grid-compact {
		display: flex; /* Flex column instead of grid for exact margin control */
		flex-direction: column;
		gap: 15px;
	}

	.board-grid-compact .board-card {
		display: flex !important;
		flex-direction: row;
		height: auto;
		min-height: 180px; /* SAME 180px as Council */
		background: var(--navy-primary); /* Fixed navy shade */
		border-radius: 4px; /* Same radius */
		box-shadow: 0 5px 15px rgba(0,0,0,0.1); /* Match shadow */
	}

	/* Transform Photo Frame to Left Column */
	.board-grid-compact .board-photo-frame {
		position: relative !important;
		width: 180px !important; /* MATCH Fixed 1:1 */
		height: auto !important;
		min-height: 180px; /* MATCH 180px */
		flex-shrink: 0;
	}

	.board-grid-compact .board-photo-frame img {
		position: absolute;
		height: 100%;
		width: 100%;
		object-fit: cover;
	}

	/* Transform Info to Right Column */
	.board-grid-compact .board-info {
		position: relative;
		width: auto;
		height: auto;
		background: none; /* Remove Gradient Overlay */
		padding: 20px; /* MATCH 20px */
		justify-content: center;
		flex-grow: 1;
		
		/* Align text */
		align-items: flex-start;
		text-align: left;
	}

	.board-grid-compact .board-name {
		font-family: var(--font-heading); 
		color: #fff;
		font-size: 1.25rem !important; /* FIXED SIZE MATCH: 1.25rem */
		font-weight: 600 !important;
		margin-bottom: 5px;
		line-height: 1.2;
	}
	
	.board-grid-compact .board-role {
		font-family: var(--font-body);
		color: var(--gold-accent);
		font-size: 0.75rem; 
		text-transform: uppercase;
		letter-spacing: 0.5px;
	}
}

/* Responsive for President Layout */
@media (max-width: 992px) {
	.board-split-layout {
		flex-direction: column;
	}
	
	.president-column, 
	.members-column {
		width: 100%;
	}

	/* Ensure President/Chairman Card stays Vertical and on Top */
	.president-card-vertical {
		max-width: 500px;
		margin: 0 auto 30px auto; /* Add bottom margin */
		display: flex !important;
		flex-direction: column !important;
		height: auto !important;
	}
	
	/* Reset internal elements for vertical layout explicitly */
	.president-card-vertical .president-photo {
		width: 100% !important;
		height: auto !important;
		aspect-ratio: 4/5;
		position: relative !important;
	}
	
	.president-card-vertical .board-info {
		position: relative !important;
		width: 100% !important;
		background: #ffffff !important;
		padding: 30px 20px !important;
		display: flex !important;
		flex-direction: column !important;
		align-items: center !important;
		text-align: center !important;
	}
}



.board-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px;
	justify-content: center;
}

@media (max-width: 768px) {
	.board-grid {
		grid-template-columns: 1fr;
	}
}

.board-card {
	display: flex;
	flex-direction: row;
	align-items: center;
	background-color: var(--white);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	height: 100%;
}

.board-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
}

.board-photo-frame {
	position: relative;
	width: 150px;
	height: 150px;
	aspect-ratio: 1/1;
	flex-shrink: 0;
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
}

.board-photo-frame img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: none;
	display: block;
}

.board-info {
	width: auto;
	flex-grow: 1;
	background: var(--white);
	padding: 20px 25px;
	text-align: left;
	border-bottom: none;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.board-name {
	font-family: var(--font-heading);
	font-size: 1.3rem;
	color: var(--navy-primary);
	margin-bottom: 5px;
	font-weight: 700;
	line-height: 1.2;
	text-transform: none;
}

.board-role {
	font-family: var(--font-body);
	font-size: 0.8rem;
	color: var(--gold-accent);
	text-transform: none;
	letter-spacing: 1px;
	font-weight: 600;
	margin-top: 5px;
}

/* News Section */
.news-section {
	background-color: var(--white);
}

.news-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
	gap: 40px;
}

.news-card {
	display: flex;
	gap: 20px;
	padding: 20px;
	border: 1px solid transparent;
	transition: all 0.3s ease;
}

.news-card:hover {
	border-color: rgba(197, 160, 89, 0.3);
	background-color: #fafafa;
}

.news-date {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: 80px;
	height: 100px;
	border: 1px solid var(--gold-accent);
	color: var(--navy-primary);
	padding: 10px;
}

.news-date .day {
	font-size: 2rem;
	font-weight: 700;
	font-family: var(--font-heading);
	line-height: 1;
}

.news-date .month {
	font-size: 0.8rem;
	text-transform: uppercase;
	font-weight: 600;
	margin: 5px 0;
}

.news-date .year {
	font-size: 0.8rem;
	color: var(--text-light);
}

.news-content h3 {
	font-size: 1.5rem;
	margin-bottom: 0.8rem;
}

.news-content p {
	color: var(--text-light);
	margin-bottom: 1rem;
	font-size: 0.95rem;
}

.read-more {
	font-size: 0.85rem;
	text-transform: uppercase;
	color: var(--gold-accent);
	font-weight: 600;
	letter-spacing: 1px;
}

/* --- Cinematic Quote Section --- */
.cinematic-quote-section {
	position: relative;
	padding: 180px 0 100px 0;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--navy-dark);
}

.cinematic-quote-section .parallax-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	/* Simple parallax */
	opacity: 0.2;
	z-index: 1;
	filter: grayscale(100%) contrast(120%);
	/* Artistic touch */
}

/* Fallback for mobile where fixed bg might be janky */
@media (hover: none) {
	.cinematic-quote-section .parallax-bg {
		background-attachment: scroll;
	}
}

.cinematic-quote-section .overlay-gradient {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #143258; /* Changed from gradient per user request */
	opacity: 0.9; /* Added opacity to ensure image is visible */
	z-index: 2;
}

.quote-container {
	position: relative;
	z-index: 3;
	text-align: center;
	max-width: 900px;
}

.quote-decoration {
	font-family: 'Times New Roman', serif;
	font-size: 12rem;
	line-height: 0;
	color: var(--gold-accent);
	opacity: 0.15;
	position: absolute;
	top: -40px;
	left: 50%;
	transform: translateX(-50%);
	z-index: -1;
}

.cinematic-text {
	font-family: var(--font-heading);
	font-size: 3rem;
	line-height: 1.3;
	color: rgba(255, 255, 255, 0.9);
	font-style: italic;
	margin: 0;
	padding: 0 20px;
	text-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
}

.cinematic-text .text-gold {
	color: var(--gold-accent);
	font-weight: 400;
	/* Let the sparkle do the work */
}

.cinematic-text .text-white {
	color: #fff;
	font-weight: 600;
}

.quote-line-anim {
	width: 0;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--gold-accent), transparent);
	margin: 40px auto 0;
	animation: expandLine 1.5s ease-out forwards;
	animation-delay: 0.5s;
	/* Wait for scroll reveal if implemented, currently hardcoded delay */
}

@keyframes expandLine {
	to {
		width: 150px;
	}
}

@media (max-width: 768px) {
	.cinematic-text {
		font-size: 1.8rem;
	}

	.quote-decoration {
		font-size: 8rem;
		top: -20px;
	}
}

/* Footer Details */
.main-footer {
	padding: 5rem 0 2rem;
	background-color: var(--navy-dark);
	color: rgba(255, 255, 255, 0.7);
	font-size: 0.9rem;
	margin-top: auto;
	font-family: var(--font-body);
	/* Force sans-serif */
}

.footer-logo {
	height: 60px;
	width: auto;
	margin-bottom: 1.5rem;
	filter: brightness(0) invert(1);
	/* Ensure logo is white */
	opacity: 0.9;
}

.footer-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 40px;
	margin-bottom: 4rem;
}

.footer-col h4 {
	color: var(--white);
	margin-bottom: 1.5rem;
	font-size: 1.2rem;
	letter-spacing: 1px;
	text-transform: uppercase;
	font-family: var(--font-body);
	/* Force sans-serif headings */
	font-weight: 600;
}

.footer-col p {
	margin-bottom: 0.8rem;
}

.footer-col a {
	color: var(--gold-accent);
}

.footer-links li {
	margin-bottom: 0.8rem;
}

.footer-links a {
	color: rgba(255, 255, 255, 0.7);
	transition: color 0.3s;
}

.footer-links a:hover {
	color: var(--gold-accent);
	padding-left: 5px;
}

.footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	padding-top: 2rem;
	font-size: 0.8rem;
}

/* --- Responsive Updates --- */
@media (max-width: 1024px) {
	.board-layout {
		gap: 2rem;
	}
}

@media (max-width: 900px) {
	.hero-title {
		font-size: 3.5rem;
	}

	.board-layout {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 768px) {
	.news-grid {
		grid-template-columns: 1fr;
	}

	.news-card {
		flex-direction: column;
	}

	.news-date {
		flex-direction: row;
		width: 100%;
		height: auto;
		justify-content: flex-start;
		gap: 10px;
		padding: 5px 10px;
		background-color: rgba(197, 160, 89, 0.1);
		border: none;
	}

	.news-date .day,
	.news-date .month,
	.news-date .year {
		margin: 0;
		font-size: 1rem;
	}

	.mobile-menu-toggle {
		display: flex;
	}

	.main-nav {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		width: 100%;
		background-color: var(--white);
		/* Always white background for dropdown */
		padding: 20px;
		box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
		border-top: 1px solid var(--border-color);
	}

	.main-nav.open {
		display: block;
		animation: slideDown 0.3s ease-out;
	}

	@keyframes slideDown {
		from {
			opacity: 0;
			transform: translateY(-10px);
		}

		to {
			opacity: 1;
			transform: translateY(0);
		}
	}

	.main-nav .menu-list {
		flex-direction: column;
		align-items: center;
		gap: 20px;
	}

	/* Force dark links in mobile menu */
	.main-nav a {
		color: var(--navy-primary);
		font-size: 1rem;
	}

	.two-column {
		grid-template-columns: 1fr;
	}

	.section-title {
		font-size: 2.2rem;
	}

	/* Hero Adjustments */
	.hero-title {
		font-size: 2.8rem;
	}

	.hero-lead {
		font-size: 1.1rem;
		padding: 0 10px;
	}

	.logo img {
		height: 40px;
	}
}
/* --- Activities Section --- */
.activities-section {
    background-color: var(--white);
    position: relative;
}

.section-lead {
    margin-bottom: 0; /* Removed double margin, letting section-header handle spacing */
    font-size: 1.1rem;
    color: var(--text-light);
    margin-left: auto;
    margin-right: auto;
    line-height: 1.8;
}

.activities-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    max-width: 1000px;
    margin: 0 auto;
}

.activity-item {
    display: flex;
    align-items: flex-start;
    gap: 1.2rem;
    padding: 1.8rem;
    border: 1px solid rgba(197, 160, 89, 0.2); /* gold with opacity */
    background-color: var(--cream-bg);
    transition: all 0.4s ease;
    border-radius: 2px;
}

.activity-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.06);
    border-color: var(--gold-accent);
    background-color: #fff;
}

.activity-icon {
    color: var(--gold-accent);
    font-size: 1.4rem;
    line-height: 1.2;
    flex-shrink: 0;
    margin-top: -2px; 
}

.activity-text {
    font-family: var(--font-body);
    font-size: 0.95rem;
    color: var(--text-dark);
    line-height: 1.6;
    font-weight: 400;
}

@media (max-width: 768px) {
    .activities-grid {
        grid-template-columns: 1fr;
        gap: 1.2rem;
    }
    
    .activity-item {
        padding: 1.2rem;
    }
}


/* --- Luxury Activities Section Redesign --- */
.activities-luxury-section {
    background-color: #fffefd;
    position: relative;
    overflow: hidden;
    padding: 6rem 0 8rem 0;
}

.luxury-bg-gradient {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Removed gradient to match flat background of other sections */
    background: transparent; 
    z-index: 0;
}

/* Subtle animated dust/grain pattern */
.luxury-bg-gradient::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Keep grain but maybe adjust opacity if needed */
    background-image: url('data:image/svg+xml,%3Csvg width=\'60\' height=\'60\' viewBox=\'0 0 60 60\' xmlns=\'http://www.w3.org/2000/svg\'%3E%3Cg fill=\'none\' fill-rule=\'evenodd\'%3E%3Cg fill=\'%23c5a059\' fill-opacity=\'0.05\'%3E%3Cpath d=\'M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z\'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E');
    opacity: 0.5;
}

.relative-z {
    position: relative;
    z-index: 1;
}

/* Revert text colors for light background section */
.activities-luxury-section .section-header .suptitle { color: var(--gold-accent); }
.activities-luxury-section .section-header .section-title { color: var(--navy-primary) !important; }
.activities-luxury-section .section-header .section-lead { color: var(--text-light) !important; }

.divider-gold {
    width: 80px;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--gold-accent), transparent);
    margin: 1.5rem auto;
}

/* Grid Layout */
.luxury-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 2rem; /* Reduced back from 3rem */
    padding-top: 0; 
    align-items: stretch; 
}

/* 3D Card Styles */
.luxury-card {
    position: relative;
    min-height: 320px; /* Changed from fixed height to min-height for better text fitting */
    height: 100%;
    perspective: 1000px;
    cursor: default;
}

.luxury-card .card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    background: var(--navy-primary); /* Dark card background */
    border: 1px solid rgba(197, 160, 89, 0.2);
    border-radius: 4px;
    padding: 2rem; /* Adjusted back to standard 2rem */
    padding-bottom: 2.5rem; /* Keep extra bottom padding for text safety */
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    display: flex; /* Changed to flex to push content up and handle long text */
    flex-direction: column;
    justify-content: flex-start;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}

.luxury-card:hover .card-inner {
    transform: translateY(-10px);
    border-color: var(--gold-accent);
    background: var(--navy-dark); /* Slightly darker on hover */
    box-shadow: 0 20px 50px rgba(197, 160, 89, 0.15);
}

/* Background Giant Icon */
.bg-icon {
    position: absolute;
    bottom: -20px;
    right: -20px;
    font-size: 8rem;
    color: var(--gold-accent);
    opacity: 0.05; /* Faint gold on dark bg */
    transition: all 0.5s ease;
    transform: rotate(-15deg);
    pointer-events: none;
}

.luxury-card:hover .bg-icon {
    opacity: 0.1;
    transform: rotate(0deg) scale(1.1);
    color: var(--gold-accent);
}

/* Floating Icon Box */
.card-icon-box {
    width: 50px;
    height: 50px;
    background: rgba(197, 160, 89, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
    border: 1px solid rgba(197, 160, 89, 0.3);
    color: var(--gold-accent);
    font-size: 1.2rem;
    transition: all 0.4s ease;
    position: relative;
}

.luxury-card:hover .card-icon-box {
    background: var(--gold-accent);
    color: var(--navy-primary);
    transform: scale(1.1);
    box-shadow: 0 0 20px rgba(197, 160, 89, 0.6);
}

.luxury-card .card-title {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    color: var(--gold-accent); /* Always gold, with higher specificity */
    margin-bottom: 0.8rem;
    transition: color 0.3s ease;
}

.luxury-card:hover .card-title {
    color: var(--white); /* White on hover for effect */
}

.card-desc {
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: #a0aab5; /* Silver/Light gray text on dark card */
    line-height: 1.6;
    transition: color 0.3s ease;
}

.luxury-card:hover .card-desc {
    color: #fff;
}

/* Mouse lighting effect overlay */
.luxury-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 4px;
    background: radial-gradient(
        800px circle at var(--mouse-x, 50%) var(--mouse-y, 50%), 
        rgba(255,255,255,0.06), 
        transparent 40%
    );
    opacity: 0;
    transition: opacity 0.3s;
    pointer-events: none;
    z-index: 2;
}

.luxury-card:hover::before {
    opacity: 1;
}

@media (max-width: 768px) {
    /* Transform Grid to Slider on Mobile */
    .luxury-grid {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: 75vw; /* Narrower to show next card peek */
        grid-template-columns: unset; /* Remove 1fr stack */
        gap: 20px; /* Increased gap for better separation */
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding-bottom: 30px; /* More room for shadow */
        padding-left: 5vw; /* Start with some padding */
        padding-right: 5vw; /* End with padding */
        
        /* Hide Scrollbar */
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .luxury-grid::-webkit-scrollbar {
        display: none;
    }
    
    .luxury-card {
        height: 100%; /* Convert to full height of track */
        min-height: 240px; /* Slightly taller for mobile content */
        scroll-snap-align: center;
        width: 100%;
        margin-bottom: 0;
    }

    /* Disable hover lift on mobile to prevent cutoff */
    .luxury-card:hover .card-inner,
    .luxury-card:active .card-inner {
        transform: none !important;
        box-shadow: 0 10px 30px rgba(0,0,0,0.15) !important;
        border-color: rgba(197, 160, 89, 0.2);
    }

    /* DISABLE SCROLL ANIMATIONS for slider cards on mobile */
    /* This fixes the "delay" and "invisible side cards" issue */
    .luxury-card.reveal-up {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        animation: none !important;
    }
}


/* --- Ethos Interlude Section --- */
.ethos-section {
    background-color: var(--navy-dark);
    padding: 5rem 0;
    position: relative;
    overflow: hidden;
    color: var(--white);
    border-top: 1px solid rgba(197, 160, 89, 0.1);
    border-bottom: 1px solid rgba(197, 160, 89, 0.1);
}

.ethos-bg-pattern {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.05;
    background-image: linear-gradient(30deg, var(--navy-primary) 12%, transparent 12.5%, transparent 87%, var(--navy-primary) 87.5%, var(--navy-primary)),
    linear-gradient(150deg, var(--navy-primary) 12%, transparent 12.5%, transparent 87%, var(--navy-primary) 87.5%, var(--navy-primary)),
    linear-gradient(30deg, var(--navy-primary) 12%, transparent 12.5%, transparent 87%, var(--navy-primary) 87.5%, var(--navy-primary)),
    linear-gradient(150deg, var(--navy-primary) 12%, transparent 12.5%, transparent 87%, var(--navy-primary) 87.5%, var(--navy-primary)),
    linear-gradient(60deg, var(--gold-accent) 25%, transparent 25.5%, transparent 75%, var(--gold-accent) 75%, var(--gold-accent)),
    linear-gradient(60deg, var(--gold-accent) 25%, transparent 25.5%, transparent 75%, var(--gold-accent) 75%, var(--gold-accent));
    background-size: 80px 140px;
    background-position: 0 0, 0 0, 40px 70px, 40px 70px, 0 0, 40px 70px;
}

.ethos-content {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 1000px;
    margin: 0 auto;
}

.ethos-item {
    flex: 1;
    text-align: center;
    padding: 2rem;
    transition: all 0.5s ease;
    position: relative;
}

.ethos-item:hover {
    transform: translateY(-5px);
}

.ethos-item:hover .ethos-title {
    color: var(--gold-accent);
    text-shadow: 0 0 20px rgba(197, 160, 89, 0.4);
}

.ethos-item:hover .ethos-line {
    width: 60px;
    background-color: var(--white);
    box-shadow: 0 0 10px rgba(255,255,255,0.5);
}

.ethos-number {
    font-family: var(--font-heading);
    font-size: 4rem;
    font-weight: 700;
    color: transparent;
    -webkit-text-stroke: 1px rgba(197, 160, 89, 0.3);
    margin-bottom: -1.5rem;
    position: relative;
    z-index: 0;
    opacity: 0.5;
    transition: all 0.5s ease;
}

.ethos-item:hover .ethos-number {
    opacity: 1;
    -webkit-text-stroke: 1px var(--gold-accent);
}

.ethos-title {
    font-size: 1.8rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 1.5rem;
    position: relative;
    z-index: 1;
    transition: all 0.3s ease;
}

.ethos-line {
    width: 40px;
    height: 2px;
    background-color: var(--gold-accent);
    margin: 0 auto 1.5rem auto;
    transition: all 0.5s ease;
}

.ethos-desc {
    font-size: 0.95rem;
    color: var(--text-silver);
    line-height: 1.6;
    max-width: 240px;
    margin: 0 auto;
}

.ethos-separator {
    width: 1px;
    background: linear-gradient(to bottom, transparent, rgba(197, 160, 89, 0.3), transparent);
    align-self: stretch;
    margin: 1rem 0;
}

@media (max-width: 768px) {
    .ethos-content {
        flex-direction: column;
        align-items: center;
        gap: 2rem;
    }
    
    .ethos-separator {
        width: 80%;
        height: 1px;
        background: linear-gradient(to right, transparent, rgba(197, 160, 89, 0.3), transparent);
        margin: 0;
    }
    
    .ethos-item {
        width: 100%;
        padding: 1rem;
    }
}


/* --- Visionary Strip Section --- */
.visionary-strip {
    position: relative;
    padding: 8rem 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.visionary-strip .parallax-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-attachment: fixed; /* Parallax effect */
    z-index: 0;
}

/* Specific overlay for this strip */
.overlay-dark {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(20, 50, 88, 0.85); /* Deep Navy Overlay */
    z-index: 1;
}

/* Mobile fallback for fixed bg */
@media (hover: none) {
    .visionary-strip .parallax-bg {
        background-attachment: scroll;
    }
}

.visionary-content {
    position: relative;
    z-index: 2;
    padding: 3rem 2rem; /* Reduced side padding to maximize text space */
    border: 1px solid rgba(197, 160, 89, 0.3); /* Gold border */
    background: rgba(20, 50, 88, 0.4); /* Glassy background */
    backdrop-filter: blur(5px);
    max-width: 1400px; /* Maximize width */
    width: fit-content;
    min-width: min(95%, 400px);
    margin: 0 auto;
}

.visionary-title {
    font-family: var(--font-heading);
    /* Highly responsive font size to guarantee single lines fit without wrapping */
    font-size: clamp(0.7rem, 2.4vw, 2.5rem); 
    color: var(--white);
    margin-top: 0;
    margin-bottom: 0.5rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    line-height: 1.4;
    white-space: nowrap; /* Force logical lines from HTML <br> */
}

.gold-dot {
    color: var(--gold-accent);
    margin: 0 0.5rem;
    vertical-align: middle;
    font-size: 2rem;
}

.visionary-lead {
    font-family: var(--font-body);
    font-size: 1.2rem;
    color: var(--white); 
    margin-bottom: 1rem; /* Reduced to bring button closer */
    font-weight: 300;
}

.btn-visionary {
    padding: 1rem 3rem;
    font-size: 0.9rem;
    letter-spacing: 2px;
}

@media (max-width: 768px) {
    .visionary-content {
        padding: 2rem 1rem; /* Minimal padding */
        width: 95%; /* Use almost full width */
    }
    
    .visionary-title {
        font-size: clamp(0.6rem, 2.5vw, 1.2rem); /* Even smaller if needed */
        letter-spacing: 1px;
    }
    
    .gold-dot {
        font-size: 1.5rem;
    }

    .visionary-strip {
        padding: 4rem 0; /* Less vertical on mobile */
    }
}


/* --- Meetings Journal Section --- */
.meetings-journal-section {
    background-color: var(--cream-bg);
    padding-bottom: 8rem;
}

.journal-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 3rem;
    margin: 4rem 0 2rem 0;
}

.journal-card {
    background: #fff;
    border-top: 3px solid var(--navy-primary);
    padding: 2.5rem 2rem;
    box-shadow: 0 10px 40px rgba(0,0,0,0.04);
    transition: all 0.4s ease;
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.journal-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 60px rgba(0,0,0,0.08);
    border-top-color: var(--gold-accent);
}

.journal-date-badge {
    position: absolute;
    top: -20px;
    right: 20px;
    background: var(--navy-primary);
    color: var(--white);
    padding: 8px 12px;
    text-align: center;
    min-width: 90px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    transition: background 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.journal-card:hover .journal-date-badge {
    background: var(--gold-accent);
}

.j-row {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 6px;
    line-height: 1;
    margin-bottom: 4px;
}

.j-day {
    display: block;
    font-size: 1.6rem;
    font-weight: 700;
    font-family: var(--font-heading);
}

.j-month {
    display: block;
    font-size: 1.2rem;
    font-weight: 600;
    text-transform: uppercase;
    font-family: var(--font-heading);
}

.j-year {
    display: block;
    font-size: 0.75rem;
    opacity: 0.9;
    font-family: var(--font-body);
    letter-spacing: 1px;
}

.journal-content-wrapper {
    margin-top: 1rem;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.journal-category {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--gold-accent);
    font-weight: 600;
    margin-bottom: 0.8rem;
}

.journal-title {
    font-size: 1.6rem;
    font-family: var(--font-heading);
    font-weight: 700;
    color: var(--navy-primary);
    margin-bottom: 0.8rem;
    line-height: 1.3;
    transition: color 0.3s ease;
}

.journal-card:hover .journal-title {
    color: var(--gold-accent);
}

.journal-guest {
    font-family: var(--font-body);
    font-size: 1rem;
    color: var(--navy-primary);
    margin-bottom: 1rem;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    padding-bottom: 1rem;
}

.journal-excerpt {
    font-size: 0.95rem;
    color: var(--text-light);
    line-height: 1.7;
    margin-bottom: 2rem;
    flex-grow: 1;
}

.journal-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--gold-accent);
    transition: all 0.3s ease;
    margin-top: auto;
    letter-spacing: 1px;
}

.journal-link i {
    transition: transform 0.3s ease;
}

.journal-link:hover {
    color: var(--navy-primary);
}

.journal-link:hover i {
    transform: translateX(5px);
}

@media (max-width: 768px) {
    .journal-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    .journal-card {
        padding: 2rem 1.5rem;
    }
}


/* --- Downloads Section (Luxury) --- */
.downloads-section {
    background-color: var(--navy-dark);
    padding: 6rem 0;
    position: relative;
    overflow: hidden;
}

/* Subtle background pattern */
.downloads-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        linear-gradient(rgba(20, 50, 88, 0.95), rgba(20, 50, 88, 0.95)),
        url('images/hero-image.jpg'); /* Reuse hero for texture */
    background-size: cover;
    background-attachment: fixed;
    opacity: 0.4;
    z-index: 0;
}

.downloads-section .container {
    position: relative;
    z-index: 1;
}

.downloads-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 3rem;
    margin-top: 4rem;
}

.download-card {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border-radius: 4px; /* Sharp corners for old money feel */
    height: 100%;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.download-card .card-inner {
    padding: 3rem 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    height: 100%;
}

.download-card:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: var(--gold-accent);
    transform: translateY(-10px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.3);
}

.d-icon-wrapper {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    border: 1px solid var(--gold-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
    color: var(--gold-accent);
    font-size: 1.8rem;
    transition: all 0.3s ease;
}

.download-card:hover .d-icon-wrapper {
    background-color: var(--gold-accent);
    color: var(--navy-dark);
    box-shadow: 0 0 20px rgba(197, 160, 89, 0.4);
}

.d-title {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    color: var(--white);
    margin-bottom: 1rem;
    letter-spacing: 1px;
}

.d-desc {
    font-size: 0.9rem;
    color: #a0aab5; /* Muted tech blue-grey */
    line-height: 1.6;
    margin-bottom: 2rem;
    flex-grow: 1; /* Push button down */
}

.btn-download {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 25px;
    border: 1px solid rgba(197, 160, 89, 0.5);
    color: var(--gold-accent);
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 2px;
    font-weight: 600;
    transition: all 0.3s ease;
    text-decoration: none;
}

.btn-download:hover {
    background-color: var(--gold-accent);
    color: var(--navy-dark);
    border-color: var(--gold-accent);
}

/* Opera Link Style */
.opera-link {
    display: inline-flex;
    align-items: center;
    gap: 20px;
    font-family: var(--font-heading);
    font-size: 1.5rem;
    color: var(--white);
    text-transform: uppercase;
    letter-spacing: 3px;
    opacity: 0.7;
    transition: all 0.3s ease;
    margin-top: 3rem;
}

.opera-link:hover {
    opacity: 1;
    color: var(--gold-accent);
}

.gold-line {
    width: 60px;
    height: 1px;
    background-color: var(--gold-accent);
    display: inline-block;
    transition: width 0.3s ease;
}

.opera-link:hover .gold-line {
    width: 100px;
}

@media (max-width: 768px) {
    .opera-link {
        font-size: 1.1rem;
        flex-direction: column;
        gap: 10px;
    }
    .gold-line {
        width: 40px;
    }
}


/* --- Downloads Section (Minimal List) --- */
.downloads-minimal {
    background-color: var(--cream-bg);
    padding: 6rem 0;
    border-top: 1px solid rgba(0,0,0,0.05);
}

.download-list-wrapper {
    max-width: 900px;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 10px 40px rgba(0,0,0,0.03);
    border-radius: 4px;
    overflow: hidden;
}

.download-row {
    display: flex;
    align-items: center;
    padding: 2rem;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    transition: background-color 0.3s ease;
}

.download-row:last-child {
    border-bottom: none;
}

.download-row:hover {
    background-color: #fafafa;
}

.d-row-icon {
    font-size: 1.8rem;
    color: var(--gold-accent);
    margin-right: 2rem;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--cream-bg);
    border-radius: 50%;
    flex-shrink: 0;
    transition: all 0.3s ease;
}

.download-row:hover .d-row-icon {
    background: var(--navy-primary);
    color: var(--white);
    transform: scale(1.1);
}

.d-row-content {
    flex-grow: 1;
}

.d-row-title {
    font-family: var(--font-heading);
    font-size: 1.4rem;
    color: var(--navy-primary);
    margin-bottom: 0.3rem;
    font-weight: 600;
}

.d-row-desc {
    font-size: 0.9rem;
    color: var(--text-light);
    margin: 0;
}

.d-row-action {
    margin-left: 2rem;
    flex-shrink: 0;
}

.btn-text-gold {
    font-family: var(--font-body);
    font-weight: 600;
    color: var(--navy-primary);
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: color 0.3s ease;
}

.btn-text-gold i {
    color: var(--gold-accent);
    transition: transform 0.3s ease;
}

.btn-text-gold:hover {
    color: var(--gold-accent);
}

.btn-text-gold:hover i {
    transform: translateY(-2px);
}

/* Opera Banner */
.opera-banner {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1.5rem 3rem;
    border: 1px solid var(--gold-accent);
    background-color: transparent;
    transition: all 0.3s ease;
}

.opera-banner:hover {
    background-color: var(--white);
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

.opera-label {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--text-light);
}

.opera-text-link {
    font-family: var(--font-heading);
    font-size: 1.4rem;
    color: var(--navy-primary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: color 0.3s ease;
}

.opera-banner:hover .opera-text-link {
    color: var(--gold-accent);
}

@media (max-width: 768px) {
    .download-row {
        flex-direction: column;
        text-align: center;
        gap: 1.5rem;
    }
    
    .d-row-icon {
        margin-right: 0;
    }
    
    .d-row-action {
        margin-left: 0;
    }
}


/* --- Downloads Section (Editorial Columns) --- */
.downloads-editorial {
    background-color: var(--white);
    padding: 6rem 0;
    border-top: 1px solid rgba(0,0,0,0.05);
}

.editorial-grid {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 4rem;
    position: relative;
}

.editorial-col {
    flex: 1;
    padding: 0 2rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}

.editorial-divider {
    width: 1px;
    background: linear-gradient(to bottom, transparent, rgba(197, 160, 89, 0.4), transparent);
    align-self: stretch;
    min-height: 250px;
}

.col-number {
    font-family: var(--font-heading);
    font-size: 3rem;
    color: rgba(20, 50, 88, 0.05); /* Very subtle watermark number */
    font-weight: 700;
    margin-bottom: 1rem;
    line-height: 1;
}

.col-icon {
    color: var(--gold-accent);
    font-size: 2rem;
    margin-bottom: 1.5rem;
    transition: transform 0.3s ease;
}

.editorial-col:hover .col-icon {
    transform: translateY(-5px);
}

.col-title {
    font-family: var(--font-heading);
    font-size: 1.6rem;
    color: var(--navy-primary);
    margin-bottom: 1rem;
    font-weight: 600;
}

.col-desc {
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: var(--text-light);
    line-height: 1.7;
    margin-bottom: 2rem;
    max-width: 300px;
}

.btn-editorial {
    font-family: var(--font-body);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--navy-primary);
    border: 1px solid rgba(20, 50, 88, 0.2);
    padding: 12px 30px;
    transition: all 0.3s ease;
    margin-top: auto;
}

.btn-editorial:hover {
    background-color: var(--navy-primary);
    color: var(--white);
    border-color: var(--navy-primary);
}

/* Opera Link - Classic */
.opera-classic-link {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    color: var(--navy-primary);
    text-transform: uppercase;
    letter-spacing: 2px;
    border-bottom: 2px solid var(--gold-accent);
    padding-bottom: 5px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 15px;
}

.opera-classic-link i {
    font-size: 1rem;
    transition: transform 0.3s ease;
}

.opera-classic-link:hover {
    color: var(--gold-accent);
    letter-spacing: 4px; /* Expanding effect */
}

.opera-classic-link:hover i {
    transform: translateX(10px);
}

@media (max-width: 768px) {
    .editorial-grid {
        flex-direction: column;
        gap: 3rem;
    }
    
    .editorial-divider {
        width: 100%;
        height: 1px;
        background: linear-gradient(to right, transparent, rgba(197, 160, 89, 0.4), transparent);
        min-height: 1px;
    }
    
    .editorial-col {
        padding: 1rem;
    }
}


/* --- Downloads Section (Brass Plaques) --- */
/* --- Registry Downloads Style (Concierge List) --- */
.downloads-registry {
    background-color: var(--navy-dark);
    padding: 6rem 0;
    position: relative;
    border-top: 5px solid var(--gold-accent);
}

.downloads-registry .section-title {
    color: var(--white) !important;
}

.registry-list-container {
    max-width: 900px;
    margin: 3rem auto 0;
    border-top: 1px solid rgba(197, 160, 89, 0.2);
}

.registry-item {
    display: flex;
    align-items: center;
    padding: 2.5rem 2rem;
    border-bottom: 1px solid rgba(197, 160, 89, 0.2);
    background: transparent;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: relative;
}

.registry-item:hover {
    background: rgba(197, 160, 89, 0.05);
}

/* Side accent line on hover */
.registry-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 0;
    background: var(--gold-accent);
    transition: width 0.3s ease;
}

.registry-item:hover::before {
    width: 4px;
}

/* Updated Icon Styling using existing layout structure */
.registry-icon-box {
    margin-right: 2.5rem;
    flex-shrink: 0;
    transition: all 0.4s ease;
}

.registry-item:hover .registry-icon-box {
    background: var(--gold-accent);
    color: var(--navy-primary);
    transform: scale(1.1);
    box-shadow: 0 0 20px rgba(197, 160, 89, 0.6);
}

.registry-details {
    flex-grow: 1;
}

.registry-title {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    color: var(--white);
    margin-bottom: 0.3rem;
    letter-spacing: 1px;
    transition: color 0.3s ease;
}

.registry-item:hover .registry-title {
    color: var(--gold-accent);
}

.registry-meta {
    font-family: var(--font-body);
    font-size: 0.95rem;
    color: var(--white); /* White description as requested */
    font-weight: 300;
    opacity: 0.8;
}

.registry-download-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 0.8rem 1.8rem;
    border: 1px solid rgba(197, 160, 89, 0.3);
    color: var(--white);
    text-transform: uppercase;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 1px;
    text-decoration: none;
    transition: all 0.3s ease;
    width: 200px; /* Fixed width for equal buttons */
}

.registry-download-btn i {
    color: var(--gold-accent);
    transition: transform 0.3s ease;
}

.registry-item:hover .registry-download-btn {
    border-color: var(--gold-accent);
    background: rgba(197, 160, 89, 0.1);
}

.registry-download-btn:hover {
    background: var(--gold-accent) !important;
    color: var(--navy-dark) !important;
}

.registry-download-btn:hover i {
    color: var(--navy-dark);
    transform: translateY(3px);
}

/* Opera Link - White as requested */
.opera-gold-link {
    font-family: var(--font-heading);
    font-size: 1.3rem;
    color: var(--white); /* Changed to white */
    text-transform: uppercase;
    letter-spacing: 2px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 15px;
    opacity: 0.9;
    margin-top: 2rem;
    text-decoration: none;
    border-bottom: 1px solid transparent;
}

.opera-gold-link i {
    color: var(--gold-accent); /* Icon gold */
}

.opera-gold-link:hover {
    color: var(--gold-accent);
    opacity: 1;
    letter-spacing: 3px;
    border-bottom-color: var(--gold-accent);
}

.opera-gold-link:hover i {
    color: var(--gold-accent);
}

@media (max-width: 768px) {
    .opera-gold-link {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        font-size: 1rem;
        gap: 10px;
        margin-top: 1.5rem;
        padding: 5px;
        border: none;
        background: transparent; 
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    .opera-gold-link i {
        font-size: 1.5rem;
        margin-bottom: 5px;
    }
}

@media (max-width: 768px) {
    .registry-item {
        flex-direction: column;
        text-align: center;
        padding: 3rem 1.5rem;
        gap: 1.5rem;
        align-items: center; /* Ensure flex items are centered cross-axis */
    }
    
    /* Fix for crooked icons on mobile: center the box and remove right margin */
    .registry-icon-box {
        margin-right: 0;
        margin-bottom: 0.5rem;
        margin-left: auto;
        margin-right: auto;
    }
    
    .registry-item::before {
        display: none; /* No side bar on mobile */
    }
    
    .registry-download-btn {
        width: 100%;
        justify-content: center;
    }
}

/* --- Contact Luxury Section (Light Theme) --- */

.contact-luxury-section {
    background-color: var(--cream-bg);
    position: relative;
    padding-bottom: 8rem;
    overflow: hidden;
}

/* Background Texture Effect */
.contact-luxury-section::before {
    display: none;
}

.contact-luxury-grid {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 4rem;
    margin-top: 3rem;
}

/* --- Left: Contact Card --- */
.contact-info-wrapper {
    position: relative;
}

.contact-card-glass {
    background: #ffffff;
    border: 1px solid rgba(197, 160, 89, 0.4);
    padding: 3rem;
    position: relative;
    box-shadow: 0 10px 40px rgba(20, 50, 88, 0.05); /* Light shadow */
    transition: transform 0.3s ease;
}

.contact-card-glass::after {
    content: '';
    position: absolute;
    top: -10px;
    left: -10px;
    width: 60px;
    height: 60px;
    border-top: 2px solid var(--gold-accent);
    border-left: 2px solid var(--gold-accent);
    transition: all 0.4s ease;
    pointer-events: none; /* Allow clicks to pass through */
}

.contact-card-glass:hover::after {
    width: 100%;
    height: 100%;
}

.contact-card-title {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    color: var(--navy-primary); /* Dark title */
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(20, 50, 88, 0.1);
}

.marketing-address {
    font-style: normal;
    margin-bottom: 2rem;
}

.company-name {
    font-family: var(--font-heading);
    font-size: 1.2rem;
    color: var(--gold-accent);
    margin-bottom: 0.5rem;
    font-weight: 700; /* Bold */
}

.marketing-address p {
    color: var(--text-light); /* Darker text */
    margin-bottom: 0.3rem;
    font-size: 1.05rem;
}

.contact-detail-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    color: var(--navy-primary); /* Dark text */
    text-decoration: none;
    margin-bottom: 1rem;
    padding: 0.8rem;
    background: rgba(20, 50, 88, 0.02);
    border: 1px solid transparent;
    transition: all 0.3s ease;
    font-weight: 700; /* Bold phone & email */
}

.contact-detail-row:hover {
    border-color: var(--gold-accent);
    background: rgba(197, 160, 89, 0.1);
    transform: translateX(5px);
}

.separator-line {
    height: 1px;
    background: linear-gradient(to right, rgba(197, 160, 89, 0.1), rgba(197, 160, 89, 0.5), rgba(197, 160, 89, 0.1));
    margin: 2rem 0;
}

/* Legal Grid */
.legal-data-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-bottom: 2rem;
}

.legal-item {
    display: flex;
    flex-direction: column;
}

.legal-label {
    font-size: 0.7rem;
    text-transform: uppercase;
    color: var(--gold-accent);
    margin-bottom: 0.2rem;
    letter-spacing: 1px;
    font-weight: 700; /* Bold */
}

.legal-val {
    font-family: monospace;
    color: var(--text-light); /* Darker text */
    font-size: 0.9rem;
}

/* Bank Account */
.bank-account-box {
    background: rgba(20, 50, 88, 0.03); /* Light bg */
    border: 1px dashed rgba(197, 160, 89, 0.4);
    padding: 1.5rem;
    position: relative;
    text-align: center;
}

.bank-label {
    display: block;
    font-size: 0.8rem;
    color: var(--gold-accent);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 0.5rem;
    font-weight: 700; /* Bold */
}

.bank-number {
    font-family: monospace;
    font-size: 1rem;
    color: var(--navy-primary); /* Dark number */
    letter-spacing: 1px;
    word-break: break-all;
    font-weight: 600;
}

.bank-icon {
    position: absolute;
    top: 50%;
    right: 1.5rem;
    transform: translateY(-50%);
    font-size: 2rem;
    color: rgba(20, 50, 88, 0.05); /* Subtle dark icon */
}

/* --- Right: Form (Minimalist Editorial Style) --- */
.contact-form-card {
    /* Removed card styling to let the form breathe */
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 1rem;
}

.contact-form-card::after {
    display: none; /* Remove the gold corner */
}

.form-header {
    text-align: left;
    margin-bottom: 2.5rem;
    padding-left: 0.5rem;
    border-left: 4px solid var(--gold-accent); /* Gold line marker instead of underline */
    border-bottom: none;
    padding-bottom: 0;
}

.form-title {
    font-family: var(--font-heading);
    color: var(--navy-primary);
    font-size: 2rem;
    margin-bottom: 0.2rem;
    line-height: 1.1;
}

.form-subtitle {
    font-family: var(--font-body);
    color: var(--text-light);
    font-size: 1rem;
    margin-left: 0.2rem;
}

.classic-form {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.form-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.form-group-classic {
    position: relative;
    padding-top: 1.2rem; /* Space for label */
}

.form-label {
    position: absolute;
    top: 0;
    left: 0;
    font-family: var(--font-heading);
    color: var(--navy-primary);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 0;
}

.form-input {
    width: 100%;
    padding: 1rem 0; /* Text sits on the line */
    background-color: transparent;
    border: none;
    border-bottom: 2px solid rgba(20, 50, 88, 0.2); /* Thick readable line */
    border-radius: 0;
    color: var(--navy-primary);
    font-family: var(--font-body);
    font-size: 1.1rem; /* Larger text */
    transition: all 0.3s ease;
}

.form-input:focus {
    outline: none;
    background-color: transparent;
    border-bottom-color: var(--gold-accent); /* Gold active line */
}

/* Hover effect on group to highlight line */
.form-group-classic:hover .form-input {
    border-bottom-color: rgba(20, 50, 88, 0.5);
}

.form-group-classic:hover .form-input:focus {
    border-bottom-color: var(--gold-accent); /* Gold takes precedence on hover */
}

.form-input::placeholder {
    color: rgba(20, 50, 88, 0.3);
    font-size: 1rem;
    font-style: italic;
}

textarea.form-input {
    resize: vertical;
    min-height: 100px;
    background: rgba(255, 255, 255, 0.5); /* Slight tint for textarea area */
    padding: 1rem; /* Padding for textarea unlike inputs */
    border: 1px solid rgba(20, 50, 88, 0.1);
    border-bottom: 2px solid rgba(20, 50, 88, 0.2); 
    margin-top: 0.5rem;
}

textarea.form-input:focus {
    background: #ffffff;
    border-bottom-color: var(--gold-accent); /* Gold active for textarea */
    border-left-color: var(--gold-accent);
    border-right-color: var(--gold-accent);
    border-top-color: var(--gold-accent);
}

/* Specific button styling for this look */
.btn-submit-classic {
    margin-top: 2rem;
    width: auto;
    align-self: flex-start;
    padding: 1rem 3rem;
    background-color: var(--navy-primary);
    color: #ffffff;
    border: none;
    font-family: var(--font-heading);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.btn-submit-classic:hover {
    background-color: var(--gold-accent);
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

/* Custom Select Wrapper */
.select-wrapper {
    position: relative;
    width: 100%;
}

/* Kill default browser arrow */
select.form-input {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    background-image: none !important; /* Force remove any background arrow */
}

/* Positioning for the custom FA arrow */
.select-arrow {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: var(--gold-accent);
    font-size: 0.9rem;
    transition: transform 0.3s ease;
}

/* Rotate arrow when select is focused */
.select-wrapper:focus-within .select-arrow {
    transform: translateY(-50%) rotate(180deg);
}

/* Remove the old CSS pseudo-element arrow */
.select-wrapper::after {
    display: none;
}

.form-input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(0.2) sepia(0.2) saturate(0) hue-rotate(180deg) brightness(0.2) contrast(1); /* Hack to make calendar icon dark */
    cursor: pointer;
}

.btn-submit-classic {
    margin-top: 1rem;
    width: 100%;
    justify-content: center;
    background-color: var(--navy-primary);
    color: #ffffff;
    border: 1px solid var(--navy-primary);
    padding: 1.25rem;
    font-family: var(--font-heading);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 1rem;
}

.btn-submit-classic:hover {
    background-color: var(--gold-accent);
    border-color: var(--gold-accent);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 10px 20px -5px rgba(197, 160, 89, 0.3);
}

@media (max-width: 600px) {
    .contact-form-card {
        padding: 1.5rem;
    }
}

@media (max-width: 900px) {
    .contact-luxury-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .form-grid-2 {
        grid-template-columns: 1fr;
    }
    
    .legal-data-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .bank-account-box {
        text-align: left;
    }
}


/* --- Global Animations (Added via Script) --- */
.reveal-up {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 1s cubic-bezier(0.165, 0.84, 0.44, 1), transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    will-change: opacity, transform;
}

.reveal-up.in-view {
    opacity: 1;
    transform: translateY(0);
}

.reveal-left {
    opacity: 0;
    transform: translateX(-30px);
    transition: opacity 1s cubic-bezier(0.165, 0.84, 0.44, 1), transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.reveal-left.in-view {
    opacity: 1;
    transform: translateX(0);
}

.reveal-right {
    opacity: 0;
    transform: translateX(30px);
    transition: opacity 1s cubic-bezier(0.165, 0.84, 0.44, 1), transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.reveal-right.in-view {
    opacity: 1;
    transform: translateX(0);
}

.reveal-scale {
    opacity: 0;
    transform: scale(0.95);
    transition: opacity 1.2s ease, transform 1.2s ease;
}

.reveal-scale.in-view {
    opacity: 1;
    transform: scale(1);
}

/* Stagger Delays */
.delay-100 { transition-delay: 0.1s; }
.delay-200 { transition-delay: 0.2s; }
.delay-300 { transition-delay: 0.3s; }
.delay-400 { transition-delay: 0.4s; }
.delay-500 { transition-delay: 0.5s; }

/* Text Split Animation (for main titles if we want) */
.word-reveal {
    display: inline-block;
    opacity: 0;
    transform: translateY(100%);
}

/* Smooth Image Hover Zoom Global */
.img-zoom-container {
    overflow: hidden;
}

.img-zoom-container img {
    transition: transform 1.5s cubic-bezier(0.2, 1, 0.3, 1);
}

.img-zoom-container:hover img {
    transform: scale(1.05);
}


/* --- Subpage Hero Section --- */
.subpage-hero {
	position: relative;
	height: 60vh; /* Taller for more impact */
	min-height: 500px;
	width: 100%;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
    margin-top: 0;
	perspective: 1px; /* Enable CSS parallax if needed later */
}

/* Dynamic Gradient Overlay - Animated */
.subpage-hero-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #143258; /* Changed from radial gradient */
	opacity: 0.9;
	z-index: 2;
	/* Add a subtle grain texture if possible, but gradient is safer */
}

/* Background Image with Ken Burns Effect */
.subpage-hero-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}

@keyframes kenBurns {
	0% { transform: scale(1); }
	100% { transform: scale(1.15); }
}

.subpage-hero-bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	/* Continuous slow zoom */
	animation: kenBurns 20s infinite alternate cubic-bezier(0.4, 0, 0.2, 1);
}

.subpage-hero-content {
	position: relative;
	z-index: 3;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	color: var(--white);
	margin-top: 60px;
	width: 100%;
	max-width: 1000px;
	padding: 0 20px;
}


/* Glassmorphism Breadcrumbs */
.subpage-hero-content .breadcrumbs {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	gap: 15px;
	font-family: var(--font-body);
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 2px;
	margin-bottom: 2rem;
	
	/* Refined Glass Effect */
	background: rgba(255, 255, 255, 0.08); /* Lighter glass */
	backdrop-filter: blur(12px);
	padding: 12px 35px;
	border-radius: 2px; /* Sharper corners for elegance */
	box-shadow: 0 10px 40px rgba(0,0,0,0.25);
	
	/* Animation */
	opacity: 0;
	transform: translateY(-20px);
	animation: fadeInUp 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) 0.2s forwards;
	transition: background 0.3s ease;
}

.subpage-hero-content .breadcrumbs:hover {
	background: rgba(255, 255, 255, 0.12);
}

.subpage-hero-content .breadcrumbs a {
	color: rgba(255, 255, 255, 0.8);
	font-weight: 500;
	position: relative;
}

.subpage-hero-content .breadcrumbs a::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 0;
	height: 1px;
	background: var(--gold-accent);
	transition: width 0.3s ease;
}

.subpage-hero-content .breadcrumbs a:hover {
	color: var(--white);
}

.subpage-hero-content .breadcrumbs a:hover::after {
	width: 100%;
}

.subpage-hero-content .breadcrumbs .separator {
	color: var(--gold-accent); /* Gold separator */
	font-size: 0.9rem;
	opacity: 0.7;
}

.subpage-hero-content .breadcrumbs .current {
	color: var(--white);
	font-weight: 700;
	text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}

/* New Split Title Design */
.subpage-title {
	font-family: var(--font-heading);
	font-size: 5.5rem; /* Massive */
	color: var(--white);
	line-height: 1;
	margin-bottom: 0;
	text-shadow: 0 20px 50px rgba(0,0,0,0.5);
	position: relative;
	display: inline-block;
	
	/* Animation */
	opacity: 0;
	transform: scale(0.95) translateY(30px);
	animation: heroTitleReveal 1.2s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.4s forwards;
}

@keyframes heroTitleReveal {
	to {
		opacity: 1;
		transform: scale(1) translateY(0);
	}
}

/* Ornamental line under title */
.subpage-title::after {
	content: '';
	display: block;
	width: 80px;
	height: 4px;
	background-color: var(--gold-accent);
	margin: 25px auto 0;
	transform: scaleX(0);
	animation: expandLine 0.8s ease 1s forwards;
}

@keyframes expandLine {
	to { transform: scaleX(1); }
}

@media (max-width: 768px) {
    .subpage-hero {
        height: 50vh; /* Keep it tall on mobile too */
        min-height: 400px;
    }
    
    .subpage-title {
        font-size: 3rem; /* Still big, but fits */
    }
    
    .subpage-hero-content .breadcrumbs {
        font-size: 0.7rem;
        padding: 8px 15px;
		width: 90%; /* prevent overflow */
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
    }
}

/* --- O Klubie Subpage Sections --- */

/* Vision & History */
.about-history-section {
	background-color: var(--white);
	padding: var(--spacing-xl) 0;
	overflow: hidden;
}

.about-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4rem;
	align-items: center;
}

.about-content .lead-text {
	font-size: 1.25rem;
	color: var(--navy-primary); /* Darker than normal text */
	font-weight: 500;
	margin-bottom: 1.5rem;
	line-height: 1.8;
}

.about-content .text-block p {
	color: var(--text-light);
	margin-bottom: 1rem;
	font-size: 1rem;
}

.values-list-icons {
	display: flex;
	gap: 20px;
	margin-top: 3rem;
	flex-wrap: wrap;
}

.value-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 10px;
	flex: 1;
	min-width: 120px;
	padding: 15px;
	border: 1px solid var(--border-color);
	transition: all 0.3s ease;
}

.value-item:hover {
	border-color: var(--gold-accent);
	transform: translateY(-5px);
	box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

.value-item i {
	font-size: 1.8rem;
	color: var(--gold-accent);
	margin-bottom: 5px;
}

.value-item span {
	font-family: var(--font-heading);
	color: var(--navy-primary);
	font-weight: 600;
	font-size: 1.1rem;
}

/* About Visual */
.about-visual {
	position: relative;
}

.about-visual .img-wrapper {
	position: relative;
	overflow: hidden;
	border-radius: 4px; /* Slight rounding but mostly sharp */
}

.about-visual img {
	width: 100%;
	height: auto;
	display: block;
	transition: transform 0.5s ease;
}

.about-visual:hover img {
	transform: scale(1.03);
}

.experience-badge {
	position: absolute;
	bottom: -30px;
	left: -30px;
	background-color: var(--navy-primary);
	color: var(--gold-accent); /* Gold text */
	padding: 25px 35px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	box-shadow: 10px 10px 40px rgba(0,0,0,0.2);
	z-index: 2;
}

.experience-badge .year {
	font-family: var(--font-heading);
	font-size: 3.5rem;
	line-height: 1;
	font-weight: 700;
}

.experience-badge .label {
	font-family: var(--font-body);
	font-size: 0.75rem;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--white);
	margin-top: 5px;
}

/* Governance Section */
.governance-section {
	background-color: var(--cream-bg);
}

.governance-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
	gap: 3rem;
	margin-top: 3rem;
}

.governance-card {
	background: var(--white);
	padding: 3rem;
	box-shadow: 0 10px 30px rgba(0,0,0,0.03);
	border-top: 4px solid var(--navy-primary);
	transition: transform 0.3s ease;
}

.governance-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 20px 40px rgba(0,0,0,0.06);
}

.card-council {
	border-top-color: var(--gold-accent);
}

.card-header {
	margin-bottom: 2rem;
	position: relative;
}

.card-title {
	font-size: 2rem;
	color: var(--navy-primary);
	margin-bottom: 0.5rem;
}

.card-line {
	width: 50px;
	height: 2px;
	background-color: var(--border-color);
}

.person-list {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.person-item {
	display: flex;
	flex-direction: column;
	border-bottom: 1px solid rgba(0,0,0,0.05);
	padding-bottom: 1rem;
}

.person-item:last-child {
	border-bottom: none;
}

.person-role {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--gold-accent);
	font-weight: 600;
	margin-bottom: 2px;
}

.person-name {
	font-family: var(--font-heading);
	font-size: 1.3rem;
	color: var(--text-dark);
	font-weight: 600;
}

.person-desc {
	font-size: 0.85rem;
	color: var(--text-light);
	margin-top: 2px;
	font-style: italic;
}

/* Goals Section (Dark) */
.goals-section.dark-mode {
	background-color: var(--navy-dark);
	color: var(--white);
	position: relative;
}

.goals-content {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4rem;
	align-items: center;
}

.goals-section .section-title {
	color: var(--white);
}

.goals-section .text-light {
	color: #a0aec0; /* Lighter text for dark bg */
	margin-bottom: 2rem;
}

.feature-checklist {
	display: flex;
	flex-direction: column;
	gap: 1.2rem;
}

.feature-checklist li {
	display: flex;
	align-items: flex-start;
	gap: 15px;
}

.check-icon {
	color: var(--gold-accent);
	font-size: 1.1rem;
	margin-top: 3px;
	flex-shrink: 0;
}

.feature-checklist span:last-child {
	color: rgba(255,255,255,0.9);
	font-size: 1.05rem;
}

.visual-side {
	position: relative;
	height: 400px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.abstract-shape {
	position: absolute;
	border: 1px solid rgba(255,255,255,0.1);
}

.shape-1 {
	width: 300px;
	height: 300px;
	border-radius: 50%;
	border-color: var(--gold-accent);
	opacity: 0.2;
}

.shape-2 {
	width: 250px;
	height: 250px;
	transform: rotate(45deg);
	border: 1px solid rgba(255,255,255,0.05);
}

.stat-big {
	text-align: center;
	z-index: 2;
}

.stat-big .number {
	display: block;
	font-family: var(--font-heading);
	font-size: 5rem;
	color: var(--gold-accent);
	line-height: 1;
}

.stat-big .label {
	font-size: 1rem;
	letter-spacing: 3px;
	text-transform: uppercase;
	color: var(--white);
}

/* Luxury CTA */
.cta-section-luxury {
	background-image: url('images/hero-image.jpg'); /* Reuse existing image or placeholder */
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	position: relative;
	padding: 8rem 0;
}

.cta-section-luxury::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(20, 50, 88, 0.85); /* Heavy overlay */
	z-index: 1;
}

.cta-section-luxury .container {
	position: relative;
	z-index: 2;
}

.cta-title {
	font-family: var(--font-heading);
	font-size: 3.5rem;
	color: var(--white);
	margin-bottom: 1rem;
}

.cta-subtitle {
	color: rgba(255,255,255,0.8);
	font-size: 1.2rem;
	margin-bottom: 3rem;
}

.cta-buttons {
	display: flex;
	justify-content: center;
	gap: 20px;
	flex-wrap: wrap;
}

/* Responsive Adjustments */
@media (max-width: 992px) {
	.about-grid, .goals-content {
		grid-template-columns: 1fr;
		gap: 3rem;
	}
	
	.experience-badge {
		position: static;
		width: 100%;
		flex-direction: row;
		gap: 20px;
		margin-top: -20px;
		max-width: 300px;
		margin-left: auto;
		margin-right: auto;
	}
	
	.shape-1, .shape-2 {
		width: 200px;
		height: 200px;
	}
}

@media (max-width: 768px) {
	.cta-title {
		font-size: 2.5rem;
	}
	
	.value-item {
		width: 100%;
	}
}


/* --- O Klubie / Governance Re-Design --- */
.governance-wrapper {
    margin-top: 3rem;
}
.board-group, .council-group {
    background: #fff;
    padding: 3rem;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    border: 1px solid rgba(197, 160, 89, 0.2);
}
.group-title {
    font-size: 2rem;
    margin-bottom: 2rem;
    color: var(--navy-primary);
    position: relative;
    display: inline-block;
    width: 100%;
}
.group-title::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: var(--gold-accent);
    margin: 10px auto 0;
}
.members-grid-elegant {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 2rem;
}
.member-card {
    text-align: center;
    padding: 2rem;
    background: var(--cream-bg);
    transition: transform 0.3s ease;
    border: 1px solid transparent;
}
.member-card:hover {
    transform: translateY(-5px);
    border-color: var(--gold-accent);
    background: #fff;
    box-shadow: 0 10px 20px rgba(0,0,0,0.08);
}
.member-card.highlight {
    grid-column: 1 / -1;
    background: #fff;
    border: 1px solid var(--gold-accent);
}
.member-card .name {
    font-size: 1.4rem;
    margin-bottom: 0.5rem;
    color: var(--navy-dark);
}
.member-card .role {
    font-family: var(--font-heading);
    color: var(--gold-accent);
    font-weight: 600;
    display: block;
    margin-bottom: 0.5rem;
}
.member-card .desc {
    font-size: 0.9rem;
    color: var(--text-light);
}

.council-list-centered {
    max-width: 800px;
    margin: 0 auto;
    text-align: left;
}
.council-item {
    display: flex;
    justify-content: space-between;
    padding: 1rem 0;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
.council-item:last-child { border-bottom: none; }
.council-item strong { margin-left: 10px; margin-right: 10px; color: var(--navy-primary); }

/* Mission Values Grid */
.values-grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    margin-top: 3rem;
}
.value-card-large {
    text-align: center;
    padding: 3rem 2rem;
    background: #fff;
    border: 1px solid var(--border-color);
    transition: all 0.3s ease;
}
.value-card-large:hover {
    border-color: var(--gold-accent);
    box-shadow: 0 15px 40px rgba(197, 160, 89, 0.15);
}
.value-card-large .icon-circle {
    width: 80px;
    height: 80px;
    background: var(--cream-bg);
    border-radius: 50%;
    margin: 0 auto 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: var(--gold-accent);
}
.value-card-large h3 {
    margin-bottom: 1rem;
    font-size: 1.5rem;
}

@media (max-width: 768px) {
    .values-grid-3 { grid-template-columns: 1fr; }
    .council-item { flex-direction: column; text-align: center; }
}

/* --- New Advanced Components (For O Klubie v2) --- */

/* Intro Manifesto */
.manifesto-section {
    text-align: center;
    padding: 6rem 0;
    background: #fff;
    position: relative;
    overflow: hidden;
}
.manifesto-text {
    font-family: var(--font-heading);
    font-size: 2.5rem;
    line-height: 1.4;
    max-width: 900px;
    margin: 0 auto;
    color: var(--navy-primary);
}
.manifesto-text .highlight {
    color: var(--gold-accent);
    font-style: italic;
    position: relative;
    display: inline-block;
}
.manifesto-text .highlight::after {
    content: '';
    position: absolute;
    bottom: 5px;
    left: 0;
    width: 100%;
    height: 10px;
    background: rgba(197, 160, 89, 0.2);
    z-index: -1;
}

/* Timeline Components */
.timeline-section {
    background-color: var(--cream-bg);
    padding: 6rem 0;
    position: relative;
}
.timeline-stem {
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 1px;
    background: var(--gold-accent);
    opacity: 0.3;
    transform: translateX(-50%);
}
.timeline-item {
    display: flex;
    justify-content: center;
    position: relative;
    margin-bottom: 6rem;
    width: 100%;
}
.timeline-content {
    background: #fff;
    padding: 2.5rem;
    width: 45%;
    border-top: 3px solid var(--gold-accent);
    box-shadow: 0 15px 40px rgba(0,0,0,0.05);
    position: relative;
    transition: transform 0.4s ease;
}
.timeline-content:hover {
    transform: translateY(-5px);
}
.timeline-content::before {
    /* Dot on the line */
    content: '';
    position: absolute;
    top: -3px; 
    width: 15px;
    height: 15px;
    background: var(--navy-primary);
    border: 3px solid #fff;
    border-radius: 50%;
    z-index: 2;
}
.timeline-year {
    display: block;
    font-size: 3rem;
    font-family: var(--font-heading);
    color: rgba(197, 160, 89, 0.3);
    position: absolute;
    top: 1rem;
    right: 2rem;
    font-weight: 700;
}
/* Alternating layout layout */
.timeline-item:nth-child(odd) {
    justify-content: flex-start;
    padding-right: 50%;
}
.timeline-item:nth-child(odd) .timeline-content {
    margin-left: auto;
    margin-right: 3rem; /* distance from center line */
}
.timeline-item:nth-child(odd) .timeline-content::before {
    right: -3rem; /* Position dot on center line */
    transform: translateX(50%);
}

.timeline-item:nth-child(even) {
    justify-content: flex-end;
    padding-left: 50%;
}
.timeline-item:nth-child(even) .timeline-content {
    margin-left: 3rem;
    margin-right: auto;
}
.timeline-item:nth-child(even) .timeline-content::before {
    left: -3rem;
    transform: translateX(-50%);
}

/* Logos Grid */
.logos-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 3rem;
    align-items: center;
    opacity: 0.6;
    margin: 3rem 0;
}
.logos-grid img {
    max-height: 60px;
    filter: grayscale(100%);
    transition: all 0.3s;
}
.logos-grid img:hover {
    filter: grayscale(0);
    opacity: 1;
}

/* Quote Section */
.quote-section {
    background: var(--navy-dark);
    padding: 8rem 0;
    color: #fff;
    text-align: center;
    background-image: linear-gradient(rgba(20, 50, 88, 0.95), rgba(20, 50, 88, 0.95)), url('images/hero-image.jpg');
    background-size: cover;
    background-attachment: fixed;
}
.big-quote {
    font-family: var(--font-heading);
    font-size: 2.2rem;
    font-style: italic;
    margin-bottom: 2rem;
    line-height: 1.5;
}
.quote-author {
    color: var(--gold-accent);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 0.9rem;
}

/* Responsive for timeline */
@media (max-width: 768px) {
    .manifesto-text { font-size: 1.8rem; }
    
    .timeline-stem { left: 20px; }
    .timeline-item {
        justify-content: flex-start !important;
        padding-left: 50px !important;
        padding-right: 0 !important;
    }
    .timeline-content {
        width: 100% !important;
        margin: 0 !important;
    }
    .timeline-item:nth-child(odd) .timeline-content::before,
    .timeline-item:nth-child(even) .timeline-content::before {
        left: -30px; /* Adjust based on padding above */
        right: auto;
        transform: none;
    }
}


/* --- About Page V3 Refinements --- */

/* Timeline ZigZag based on Prestige Grid */
.timeline-milestone {
    padding: 4rem 0;
    position: relative;
}
.timeline-milestone .year-label {
    font-size: 5rem;
    font-family: var(--font-heading);
    color: rgba(197, 160, 89, 0.15);
    line-height: 1;
    position: absolute;
    top: 0;
    left: 20px;
    z-index: -1;
}
/* Alternate positioning for variety */
.timeline-milestone:nth-child(even) .year-label {
    left: auto;
    right: 20px;
}

/* Card fallback for missing images */
.member-card-placeholder {
    width: 100%;
    aspect-ratio: 4/5;
    background-color: var(--navy-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: var(--gold-accent);
    padding: 2rem;
    text-align: center;
}
.member-card-placeholder i {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

/* Quote Section Enhancement */
.quote-overlay-dark {
    position: absolute; 
    top:0; left:0; width:100%; height:100%;
    background: linear-gradient(to right, #143258 0%, rgba(20,50,88,0.8) 100%);
    z-index: 1;
}


/* --- Utilities & New Page Styles --- */
.text-white { color: var(--white) !important; }
.text-gold { color: var(--gold-accent) !important; }
.text-navy { color: var(--navy-primary) !important; }
.bg-navy { background-color: var(--navy-primary) !important; }
.bg-dark { background-color: var(--navy-dark) !important; }
.bg-light { background-color: var(--cream-bg); }

/* Page Hero Override */
.page-hero {
	height: 60vh !important;
	min-height: 400px;
}
.page-hero .hero-title {
	font-size: 3.5rem;
}

/* Values Grid */
.values-grid {
	margin-top: 3rem;
}
.value-card {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.value-card:hover {
	transform: translateY(-10px);
	box-shadow: 0 20px 40px rgba(0,0,0,0.1) !important;
}

/* Board Members Styling overrides if needed */
.board-group {
	position: relative;
}
.board-group h3 {
	font-family: var(--font-heading);
	font-size: 2rem;
	position: relative;
	display: inline-block;
	padding-bottom: 15px;
}
.board-group h3::after {
	content: '';
	position: absolute;
	bottom: 0px;
	left: 50%;
	transform: translateX(-50%);
	width: 60px;
	height: 2px;
	background-color: var(--gold-accent);
}

/* =========================================
   O KLUBIE - NEW PAGE STYLES (V4)
   ========================================= */

/* --- Manifesto Section --- */
.manifesto-box {
    padding: 3rem 1.5rem;
    position: relative;
}
.manifesto-box .prestige-title {
    font-size: 2.8rem;
    line-height: 1.25;
}
.divider-gold {
    height: 3px;
    width: 80px;
    background-color: var(--gold-accent);
    margin: 2rem auto;
}

/* --- Timeline / ZigZag Layout --- */
.timeline-milestone {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
    position: relative;
    padding: 4rem 0;
}
@media (max-width: 900px) {
    .timeline-milestone {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    /* Mobile reordering helper */
    .order-2-mobile {
        order: 2;
    }
}

.year-label {
    font-family: var(--font-heading);
    font-weight: 700;
    opacity: 0.1;
    position: absolute;
    /* positioned by inline styles or specific modifiers */
    z-index: 0;
    pointer-events: none;
}

/* --- Modern Values (Dark) --- */
.values-grid-modern {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1px; /* Creates line effect */
    background-color: var(--gold-accent); /* Border color */
    border: 1px solid var(--gold-accent);
    margin-top: 4rem;
}

.modern-value-card {
    background-color: var(--navy-dark);
    padding: 4rem 2rem;
    text-align: center;
    transition: background-color 0.3s ease;
}

.modern-value-card:hover {
    background-color: #15202b; /* Slightly lighter navy */
}

.modern-value-card h3 {
    color: var(--white);
    margin-bottom: 1rem;
}

/* --- President Spotlight --- */
.president-spotlight {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    background: var(--white);
    box-shadow: 0 15px 40px rgba(0,0,0,0.08); /* Soft luxury shadow */
    margin-bottom: 5rem;
    overflow: hidden; /* For corner rounding if needed */
}

.president-visual {
    position: relative;
    min-height: 400px;
    background-color: #f0f0f0;
}
.president-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.president-content {
    padding: 4rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

@media (max-width: 768px) {
    .president-spotlight {
        grid-template-columns: 1fr;
    }
    .president-visual {
        min-height: 300px;
    }
    .president-content {
        padding: 2rem;
    }
}

/* --- Board Grid (ZarzÄ…d) --- */
.board-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 2rem;
    margin-bottom: 5rem;
}

.board-card {
    background: var(--white);
    border: 1px solid #eee;
    padding: 2rem;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.board-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    border-color: var(--gold-accent);
}

.board-card-top {
    border-bottom: 1px solid rgba(197, 160, 89, 0.3);
    padding-bottom: 1rem;
    margin-bottom: 1rem;
}

/* --- Council List (Rada) --- */
.council-section {
    padding: 4rem 2rem;
}

.council-list {
    display: flex;
    flex-direction: column;
    gap: 0; /* controlling via borders */
}

.council-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 0;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    transition: padding-left 0.3s ease;
}
.council-item:hover {
    padding-left: 1rem;
    background-color: rgba(255,255,255,0.5);
}
.council-item:last-child {
    border-bottom: none;
}

@media (max-width: 600px) {
    .council-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
}

/* --- Quote Section --- */
.quote-section {
    position: relative;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}
.quote-section blockquote {
    position: relative;
    z-index: 2;
}

/* =========================================
   O KLUBIE - AVANT-GARDE V5
   ========================================= */

/* --- Typography Scaling --- */
.hero-huge {
    font-size: 5rem;
    line-height: 0.9;
    font-weight: 700;
    letter-spacing: -2px;
}
@media (max-width: 768px) {
    .hero-huge { font-size: 3rem; }
}

/* --- Split Hero --- */
.hero-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 100vh; /* Full viewport */
    position: relative;
    overflow: hidden;
}

.hero-split-left {
    background-color: var(--navy-dark);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 10% 5%;
    color: var(--white);
    position: relative;
    z-index: 2;
}

.hero-split-right {
    position: relative;
    background-color: #000;
}
.hero-split-right img {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    opacity: 0.8;
}
.hero-split-right::after {
    content: '';
    position: absolute;
    top: 0; left: 0; bottom: 0; right: 0;
    background: linear-gradient(to right, var(--navy-dark) 0%, transparent 20%);
}

@media (max-width: 900px) {
    .hero-split { grid-template-columns: 1fr; grid-template-rows: 1fr 400px; }
    .hero-split-right::after { background: linear-gradient(to bottom, var(--navy-dark) 0%, transparent 20%); }
}

/* --- Golden Line Decoration --- */
.decor-line-vertical {
    width: 1px;
    height: 150px;
    background-color: var(--gold-accent);
    margin: 2rem 0;
    display: block;
}

/* --- Horizontal Values Scroll (Luxury Strip) --- */
.values-strip-section {
    padding: 6rem 0;
    background: var(--cream-bg);
    overflow: hidden;
}

.values-ticker-container {
    display: flex;
    gap: 4rem;
    padding-left: max(20px, calc((100% - 1200px) / 2 + 20px));
    padding-right: 5%;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 2rem;
    /* Hide scrollbar */
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.values-ticker-container::-webkit-scrollbar { display: none; }

.value-card-large {
    flex: 0 0 350px;
    scroll-snap-align: center;
    background: var(--white);
    border: 1px solid rgba(0,0,0,0.05);
    padding: 3rem;
    position: relative;
    transition: transform 0.4s ease;
}
.value-card-large:hover {
    transform: translateY(-10px);
}
.value-big-number {
    font-size: 6rem;
    font-family: var(--font-heading);
    color: rgba(197, 160, 89, 0.2);
    position: absolute;
    top: 10px; right: 20px;
}


/* --- Timeline Flow (Central Split) --- */
.flow-timeline-section {
    position: relative;
    background-color: var(--navy-dark);
    padding: 6rem 0;
    overflow: hidden;
}

.timeline-flow-container {
    position: relative;
    max-width: 1100px;
    margin: 0 auto;
}

/* Central Line Container & Animation */
.flow-line-container {
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 2px;
    transform: translateX(-50%);
    z-index: 1;
}

.flow-line-static {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.05); /* Faint track */
}

.flow-line-progress {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 0%; /* JS grows this */
    background: linear-gradient(to bottom, var(--gold-accent), #fbf5e6);
    box-shadow: 0 0 10px rgba(197, 160, 89, 0.5);
    transition: height 0.1s linear; /* Smooth frame update */
}

/* Row Layout */
.flow-row {
    display: flex;
    align-items: center; /* Center vertically relative to marker */
    margin-bottom: 4rem;
    position: relative;
    z-index: 2;
}

.flow-content, .flow-space {
    width: 50%;
    padding: 0 40px; /* Gap from line */
}

/* Marker Dot */
.flow-marker {
    position: absolute;
    left: 50%;
    top: 30px; /* Align with top part of card approx */
    transform: translateX(-50%) scale(0.8);
    width: 14px;
    height: 14px;
    background: var(--navy-dark);
    border: 3px solid rgba(255,255,255,0.2);
    border-radius: 50%;
    z-index: 5;
    transition: all 0.4s ease;
}

/* Active State for Marker (when line passes) */
.flow-row.active .flow-marker {
    border-color: var(--gold-accent);
    background: var(--gold-accent);
    box-shadow: 0 0 20px rgba(197, 160, 89, 0.8);
    transform: translateX(-50%) scale(1.2);
}

/* Card Styling */
.flow-card {
    background: rgba(20, 50, 88, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.08);
    padding: 2.5rem;
    position: relative;
    border-radius: 2px;
    backdrop-filter: blur(10px);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.flow-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    border-color: rgba(197, 160, 89, 0.3);
}

/* The Pill (Date Badge) */
.flow-pill {
    display: inline-block;
    background: linear-gradient(135deg, var(--gold-accent), #a37f37);
    color: var(--navy-dark);
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 0.85rem;
    padding: 6px 16px;
    border-radius: 50px; /* Soft Pill Shape */
    margin-bottom: 1rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

.flow-title {
    font-family: var(--font-heading);
    color: var(--white);
    font-size: 1.8rem;
    margin-bottom: 1rem;
}

.flow-desc {
    font-family: var(--font-body);
    color: var(--text-silver);
    font-size: 0.95rem;
    line-height: 1.7;
}

/* Alignments */
.flow-content.left {
    text-align: right;
    padding-right: 60px; /* Extra distance for connecting line visual if we added one */
}
.flow-content.right {
    text-align: left;
    padding-left: 60px;
}

/* Connector Lines (Horizontal) */
.flow-content.left::after {
    content: '';
    position: absolute;
    right: 50%;
    top: 36px;
    width: 40px; /* Connects card to center line */
    height: 1px;
    background: rgba(197, 160, 89, 0.3);
    opacity: 0.3;
}
.flow-content.right::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 36px;
    width: 40px;
    height: 1px;
    background: rgba(197, 160, 89, 0.3);
    opacity: 0.3;
}

/* Header Override */
.contrast-header .section-title {
    color: var(--white) !important;
}

/* Responsive */
@media (max-width: 900px) {
    .flow-line-container {
        left: 20px;
        transform: none;
    }
    .flow-row {
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 3rem;
    }
    .flow-space { display: none; }
    
    .flow-content {
        width: 100%;
        padding-left: 50px;
        padding-right: 0;
    }
    .flow-content.left, .flow-content.right {
        text-align: left;
        padding-left: 50px;
        padding-right: 0;
    }
    
    .flow-marker {
        left: 14px; 
        transform: none;
        top: 30px;
    }

    .flow-content.left::after, .flow-content.right::before {
        display: none; /* Hide horizontal connectors on mobile */
    }
    
    .flow-card {
        padding: 2rem;
    }
    
    .flow-year {
        font-size: 2.5rem;
    }
}


/* --- Board Deck (Carosuel-like visual) --- */
.board-deck-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.deck-card {
    position: relative;
    height: 400px;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    cursor: pointer;
}
.deck-card::after {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(20,50,88,0.95), transparent);
    transition: background 0.4s ease;
}
.deck-card:hover::after {
    background: linear-gradient(to top, rgba(197, 160, 89, 0.9), rgba(20,50,88,0.2) );
}

.deck-info {
    position: relative;
    z-index: 2;
    padding: 2rem;
    color: var(--white);
    transform: translateY(20px);
    transition: transform 0.4s ease;
}
.deck-card:hover .deck-info {
    transform: translateY(0);
}
.deck-role {
    display: block;
    font-size: 0.75rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--gold-accent);
    margin-bottom: 0.5rem;
}
.deck-card:hover .deck-role { color: var(--navy-dark); font-weight: 700; }

/* --- Enhanced Board Deck with Bios --- */
.deck-card {
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.deck-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.2);
}

.deck-bio {
    opacity: 0;
    max-height: 0;
    margin-top: 0;
    font-size: 0.9rem;
    line-height: 1.4;
    color: rgba(255,255,255,0.9);
    transition: all 0.5s ease;
    overflow: hidden;
}

.deck-card:hover .deck-bio {
    opacity: 1;
    max-height: 150px;
    margin-top: 1rem;
    color: var(--navy-dark);
}

.deck-card:hover .deck-info h2,
.deck-card:hover .deck-info h3 {
    color: var(--navy-dark);
}

/* --- Council & Audit Section --- */
.council-section {
    margin-top: 5rem;
    padding-top: 3rem;
    border-top: 1px solid rgba(0,0,0,0.08);
}

.council-title-small {
    text-align: center;
    font-family: var(--font-heading);
    color: var(--text-light); /* Or Gold? */
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 0.9rem;
    margin-bottom: 2rem;
    display: block;
}

.council-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    text-align: center;
}

.council-item {
    padding: 1.5rem;
    background: var(--white);
    border: 1px solid rgba(0,0,0,0.03);
    transition: 0.3s;
}

.council-item:hover {
    background: #fffcf5; /* faint gold tint */
    border-color: rgba(197, 160, 89, 0.2);
}

.council-name {
    font-size: 1.25rem;
    color: var(--navy-primary);
    margin-bottom: 0.5rem;
}

.council-role {
    font-size: 0.85rem;
    color: var(--text-light);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
}

@media (max-width: 768px) {
    .council-grid {
        grid-template-columns: 1fr;
    }
}

/* --- NEW AUTHORITY SECTION (Elegant Portraits) --- */
.authority-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 40px;
    margin-top: 3rem;
}

.authority-card {
    width: 320px;
    background: #fff;
    box-shadow: 0 5px 20px rgba(0,0,0,0.03);
    border-bottom: 3px solid transparent;
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden; /* Ensure overlay stays inside */
}

.authority-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 50px rgba(0,0,0,0.1);
    border-bottom-color: var(--gold-accent);
}

.authority-img-wrapper {
    height: 360px;
    width: 100%;
    position: relative;
    overflow: hidden;
    background-color: #e0e0e0;
}

.authority-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease, filter 0.4s ease;
    filter: saturate(0.8) contrast(1.1); /* Slightly editorial look */
}

.authority-card:hover .authority-img-wrapper img {
    transform: scale(1.05);
    filter: saturate(1) contrast(1);
}

/* Bio Overlay - Slides up over image */
.authority-bio-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(20, 50, 88, 0.96); /* Deep Navy */
    color: #fff;
    padding: 2.5rem 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s ease;
    transform: translateY(10px);
}

.authority-card:hover .authority-bio-overlay {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.authority-bio-text {
    font-size: 0.95rem;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.9);
    font-style: italic;
    font-family: var(--font-heading); /* Serif font for bio */
}

/* Info Box */
.authority-info {
    padding: 1.5rem;
    text-align: center;
    background: var(--white);
    position: relative;
    z-index: 5;
}

.authority-role {
    display: block;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--gold-accent);
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.authority-name {
    font-family: var(--font-heading);
    font-size: 1.6rem;
    color: var(--navy-primary);
    margin: 0;
}

/* --- Council List (Clean Ledger Style) --- */
.council-ledger {
    max-width: 900px;
    margin: 4rem auto 0;
    border-top: 1px solid #eaeaea;
}

.council-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 2rem;
    border-bottom: 1px solid #eaeaea;
    transition: background 0.3s ease;
}

.council-row:hover {
    background-color: var(--white);
    box-shadow: 0 5px 15px rgba(0,0,0,0.03);
    border-color: transparent;
    transform: scale(1.01);
}

.council-row-name {
    font-family: var(--font-heading);
    font-size: 1.3rem;
    color: var(--navy-dark);
    font-weight: 600;
}

.council-row-role {
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.council-row-role::before {
    content: '';
    display: block;
    width: 20px;
    height: 1px;
    background-color: var(--gold-accent);
}

@media (max-width: 768px) {
    .council-row {
        flex-direction: column;
        gap: 10px;
        text-align: center;
    }
    .council-row-role::before {
        display: none;
    }
}

/* --- Member Profile Section (Redesigned) --- */
.member-profile-section {
    background-color: var(--white);
    padding: var(--spacing-xl) 0;
    position: relative;
    overflow: hidden;
}

.member-profile-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
    align-items: center;
}

.member-profile-visual {
    position: relative;
    padding-left: 20px; /* Space for offset border */
    padding-bottom: 20px;
}

.image-frame-gold {
    position: relative;
    z-index: 2;
}

.image-frame-gold img {
    width: 100%;
    height: auto;
    display: block;
    box-shadow: 0 20px 50px rgba(0,0,0,0.15);
    border-radius: 2px;
}

.image-frame-gold::before {
    content: '';
    position: absolute;
    top: -20px;
    left: -20px;
    width: 100%;
    height: 100%;
    border: 3px solid var(--gold-accent); /* Gold Outline */
    z-index: -1;
    opacity: 0.6;
    transition: transform 0.5s ease;
}

.member-profile-visual:hover .image-frame-gold::before {
    transform: translate(10px, 10px);
}

.member-profile-text {
    padding-right: 2rem;
}

.member-profile-text .lead-text {
    font-size: 1.15rem;
    line-height: 1.8;
    color: var(--text-dark);
    margin-bottom: 2.5rem;
    font-weight: 400;
}

.target-audience-box {
    background-color: #fdfbf7; /* Cream/Light bg like body */
    padding: 2.5rem;
    border-left: 4px solid var(--gold-accent);
    position: relative;
}

.target-audience-box::after {
    content: '"';
    position: absolute;
    top: 10px;
    right: 20px;
    font-family: var(--font-heading);
    font-size: 5rem;
    color: rgba(197, 160, 89, 0.15); /* Gold very faint */
    line-height: 1;
}

.audience-title {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    color: var(--navy-primary);
    margin-bottom: 1rem;
    font-weight: 600;
}

.audience-desc {
    font-size: 1.05rem;
    line-height: 1.7;
    color: var(--text-light);
    margin: 0;
    font-style: italic;
}

@media (max-width: 992px) {
    .member-profile-grid {
        grid-template-columns: 1fr;
        gap: 3rem;
    }
    
    .member-profile-text {
        padding-right: 0;
        text-align: left;
    }
    
    .member-profile-visual {
        max-width: 500px;
        margin: 0 auto;
    }
}

/* --- Documents Section (Refined) --- */
.documents-section {
    background-color: var(--white);
    padding: var(--spacing-xl) 0;
}

.section-subtitle-wrapper {
    margin-bottom: 4rem;
}

.documents-list-container {
    max-width: 900px;
    margin: 0 auto;
    border-top: 1px solid var(--border-color); /* Top line */
}

.document-item {
    display: flex;
    align-items: center;
    padding: 2rem 1.5rem; /* Spacious padding */
    border-bottom: 1px solid var(--border-color); /* Bottom line separator */
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    position: relative;
    overflow: hidden; /* For pseudo-element effects */
    text-decoration: none; /* No underline */
    background-color: transparent;
}

.document-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background-color: var(--gold-accent);
    transform: scaleY(0);
    transition: transform 0.3s ease;
    transform-origin: bottom;
}

.document-item:hover {
    background-color: var(--cream-bg); /* Very light background on hover */
    padding-left: 2.5rem; /* Slide effect */
}

.document-item:hover::before {
    transform: scaleY(1);
    transform-origin: top;
}

.doc-icon-wrapper {
    font-size: 1.8rem;
    color: var(--text-silver); /* Subtle icon color */
    margin-right: 2rem;
    min-width: 40px;
    text-align: center;
    transition: color 0.3s ease;
}

.document-item:hover .doc-icon-wrapper {
    color: var(--navy-primary); /* Darker icon on hover */
}

.doc-name {
    font-family: var(--font-heading); /* Elegant serif font */
    font-weight: 500;
    font-size: 1.4rem; /* Larger text */
    color: var(--text-dark);
    flex-grow: 1;
    letter-spacing: 0.5px;
    transition: color 0.3s ease;
}

.document-item:hover .doc-name {
    color: var(--navy-primary);
}

.doc-download-icon {
    font-size: 1.2rem;
    color: var(--gold-accent);
    opacity: 0; /* Hidden initially */
    transform: translateX(-10px);
    transition: all 0.3s ease;
}

.document-item:hover .doc-download-icon {
    opacity: 1;
    transform: translateX(0); /* Slide in */
}

/* Specific styling for the PDF/file format pill */
.doc-meta {
    font-family: var(--font-body);
    font-size: 0.75rem;
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 1px;
    border: 1px solid var(--border-color);
    padding: 0.3rem 0.8rem;
    border-radius: 20px;
    margin-left: 1rem;
    margin-right: 2rem; /* Space before download icon */
    transition: all 0.3s ease;
}

.document-item:hover .doc-meta {
    border-color: var(--gold-accent);
    color: var(--gold-accent);
}

@media (max-width: 768px) {
    .document-item {
        padding: 1.5rem 1rem;
        flex-wrap: wrap;
    }
    
    .doc-name {
        font-size: 1.2rem;
        width: 100%; /* Break to new line on very small screens */
        margin-bottom: 0.5rem;
    }
    
    .doc-meta {
        margin-left: 0;
        margin-top: 0.5rem;
    }
}

/* --- Registry Light Theme (for O-Klubie) --- */
.downloads-registry.light-theme {
    background-color: var(--cream-bg); /* Warm Cream Background */
    padding: var(--spacing-xl) 0;
    border-top: none; /* remove default gold border */
}

/* Force Navy Header on Light Background */
.downloads-registry.light-theme .section-title {
    color: var(--navy-primary) !important;
}

.downloads-registry.light-theme .registry-list-container {
    background: transparent;
    border-top: none;
    border-bottom: 1px solid var(--border-color);
}

.downloads-registry.light-theme .registry-item {
    border-bottom: 1px solid var(--border-color);
    background: transparent;
    transition: all 0.3s ease;
}

.downloads-registry.light-theme .registry-item:last-child {
    border-bottom: none;
}

.downloads-registry.light-theme .registry-item:hover {
    background-color: rgba(255, 255, 255, 0.5); /* Subtle lightening on hover */
    box-shadow: 0 5px 15px rgba(0,0,0,0.03);
}

.downloads-registry.light-theme .registry-title {
    color: var(--navy-primary);
    font-family: var(--font-heading);
    font-size: 1.4rem;
    font-weight: 500;
}

.downloads-registry.light-theme .registry-meta {
    color: var(--text-light);
}

/* Icon Box Light Version - Gold Outline */
.downloads-registry.light-theme .registry-icon-box {
    background-color: transparent;
    border: 1px solid rgba(197, 160, 89, 0.3); /* Match default */
    color: var(--gold-accent);
    transition: all 0.3s ease;
}

/* Icon Box Hover - Fill Gold */
.downloads-registry.light-theme .registry-item:hover .registry-icon-box {
    background-color: var(--gold-accent);
    color: var(--white);
    border-color: var(--gold-accent);
    transform: scale(1.05);
}

/* Download Button Light Version - Gold Outline, Same as main but dark text */
.downloads-registry.light-theme .registry-download-btn {
    border: 1px solid var(--gold-accent);
    color: var(--navy-primary); /* Dark text as requested, Gold border */
    background-color: transparent;
    transition: all 0.3s ease;
}

.downloads-registry.light-theme .registry-download-btn i {
    color: var(--gold-accent);
}

.downloads-registry.light-theme .registry-item:hover .registry-download-btn {
    background-color: rgba(197, 160, 89, 0.1); /* Match main page hover effect */
    color: var(--navy-primary); /* Keep dark text on light gold bg */
    border-color: var(--gold-accent);
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(197, 160, 89, 0.3);
}

.downloads-registry.light-theme .registry-item:hover .registry-download-btn i {
    color: var(--gold-accent); /* Keep icon gold */
}

/* Ensure button hover state also maintains white color */
.downloads-registry.light-theme .registry-download-btn:hover {
    background-color: var(--gold-accent) !important;
    color: var(--navy-primary) !important; /* Main page uses navy on gold hover */
    border-color: var(--gold-accent) !important;
}

.downloads-registry.light-theme .registry-download-btn:hover i {
    color: var(--navy-primary) !important; /* Main page uses navy on gold hover */
}

/* --- Science & Business Section (Asymmetric Modern/Classic) --- */
.science-business-section {
	background-color: var(--white);
	/* Clean white background to contrast with cream sections */
	padding: var(--spacing-xl) 0;
	position: relative;
	overflow: hidden;
}

.science-business-layout {
	display: flex;
	flex-direction: column;
	gap: 4rem;
	align-items: center;
}

@media (min-width: 992px) {
	.science-business-layout {
		flex-direction: row;
		align-items: center;
		/* Center vertically */
		justify-content: space-between;
		gap: 6rem;
		/* Large elegant gap */
	}
}

/* Left Column: Image */
.science-image-wrapper {
	width: 100%;
	position: relative;
    opacity: 0; 
    transform: translateX(-50px);
    transition: all 1s ease-out;
}

.science-image-wrapper.in-view {
    opacity: 1;
    transform: translateX(0);
}

@media (min-width: 992px) {
	.science-image-wrapper {
		width: 45%;
		/* Slightly less than half */
	}
}

.science-image-frame {
	position: relative;
	z-index: 2;
	/* Above decoration */
}

.science-main-img {
	width: 100%;
	height: auto;
	display: block;
	/* Remove inline gap */
	filter: contrast(1.05) saturate(0.9);
	/* Subtle old money filter */
}

/* Gold Frame Decoration - Asymmetric */
.science-gold-frame {
	position: absolute;
	top: -20px;
	left: -20px;
	width: 60%;
	height: 60%;
	border-top: 5px solid var(--gold-accent);
	border-left: 5px solid var(--gold-accent);
	z-index: 3;
	/* On top of image corner */
	pointer-events: none;
}

/* Decorative Box behind */
.science-decoration-box {
	position: absolute;
	bottom: -40px;
	right: -40px;
	width: 80%;
	height: 80%;
	background-color: var(--cream-bg);
	z-index: 1;
	/* Behind image */
}

/* Right Column: Content */
.science-content {
	width: 100%;
	text-align: left;
    opacity: 0; 
    transform: translateX(50px);
    transition: all 1s ease-out;
}

.science-content.in-view {
    opacity: 1;
    transform: translateX(0);
}

@media (min-width: 992px) {
	.science-content {
		width: 50%;
		/* Remaining space minus gap */
	}
}

.science-content .suptitle {
	display: block;
	font-family: var(--font-body);
	font-size: 0.9rem;
	text-transform: uppercase;
	letter-spacing: 3px;
	color: var(--text-silver);
	margin-bottom: 1rem;
	font-weight: 600;
}

.science-content .section-title {
	font-size: 2.5rem;
	color: var(--navy-primary);
	margin-bottom: 1.5rem;
	line-height: 1.2;
}

.science-content .divider {
	width: 80px;
	height: 3px;
	background-color: var(--gold-accent);
	margin-bottom: 2rem;
}

.science-description {
	font-family: var(--font-body);
	font-size: 1.1rem;
	line-height: 1.8;
	color: var(--text-light);
	margin-bottom: 3rem;
	max-width: 600px;
}

/* Universities List */
.universities-list {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.uni-item {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 15px 20px;
	background-color: var(--cream-bg);
	border-left: 3px solid transparent;
	transition: all 0.3s ease;
}

.uni-item:hover {
	border-left-color: var(--gold-accent);
	background-color: #f8f5f0;
	/* Slightly darker cream */
	transform: translateX(10px);
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}

.uni-logo-box {
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	border-radius: 50%;
	padding: 5px;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	flex-shrink: 0;
}

.uni-logo-box img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.uni-name {
	font-family: var(--font-heading);
	font-size: 1.3rem;
	font-weight: 600;
	color: var(--navy-primary);
	letter-spacing: 0.5px;
}

/* --- New Declaration Section (Watermarked) --- */
.declaration-watermark-section {
    position: relative;
    padding: 6rem 0;
    overflow: hidden;
    background-color: var(--white);
    border-top: 1px solid rgba(197, 160, 89, 0.2);
}

.watermark-bg {
    position: absolute;
    top: 35%; /* Moved up even more */
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60%; /* Use percentage for responsiveness */
    max-width: 600px;
    height: auto;
    aspect-ratio: 1/1; /* Ensure square aspect ratio */
    background-image: url('images/downloaded/misja-i-cele-background (1).png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0.35; /* Increased opacity for better visibility */
    pointer-events: none;
    z-index: 0;
}

.watermark-year-bg {
    position: absolute;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    font-family: var(--font-heading);
    font-size: 6rem;
    color: var(--gold-accent);
    opacity: 0.15;
    z-index: 0;
    pointer-events: none;
    white-space: nowrap;
    letter-spacing: 0.5rem;
    display: none; /* Hiding year as it might be part of the background image now */
}

.declaration-content {
    position: relative;
    z-index: 1;
    max-width: 900px;
    margin: 0 auto 4rem auto;
}

.declaration-content p {
    /* Using serif font to match the formal document style better */
    font-family: var(--font-heading); 
    font-size: 1.2rem;
    line-height: 1.8;
    color: var(--text-dark);
    margin-bottom: 2rem;
    text-align: center; /* Changed from justify to center for better symmetry */
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 2;
}

/* Fallback for text-align-last on older browsers */
@supports not (text-align-last: center) {
    .declaration-content p {
        text-align: center;
    }
}

.declaration-signature-block {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    max-width: 900px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    padding-right: 2rem;
}

.sig-col {
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* Align to right */
}

.signature-details {
    text-align: right;
    margin-bottom: 1rem;
}

.sign-name {
    display: block;
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--navy-primary); /* Navy color for name */
    margin-bottom: 0.3rem;
}

.sign-role {
    display: block;
    font-size: 0.85rem;
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.signature-img {
    height: auto;
    width: 200px; /* Adjust size */
    opacity: 0.9;
    transform: rotate(-2deg); /* Organic tilt */
    margin-right: -10px; /* Slight offset */
}

@media (max-width: 768px) {
    .watermark-bg {
        width: 80vw;
        height: 80vw;
        opacity: 0.1;
    }
    
    .watermark-year-bg {
        font-size: 3rem;
        bottom: 1rem;
    }
    
    .declaration-content p {
        font-size: 1rem;
        text-align: center; /* Center on mobile */
        text-align-last: center;
    }

    .declaration-signature-block {
        justify-content: center;
        padding-right: 0;
        margin-top: 2rem;
    }
    
    .sig-col {
        align-items: center;
    }
    
    .signature-details {
        text-align: center;
    }
}
/* Removed grayscale filter for watermark */

/* --- New Council Grid System (3 Columns, Vertical Cards) --- */
.council-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-bottom: 4rem;
}

.council-vertical-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    border-top: 5px solid var(--gold-accent);
    background: #ffffff;
    padding: 0;
    transition: transform 0.3s ease;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.council-vertical-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.1);
}

.council-vertical-card .photo-frame {
    width: 100%;
    aspect-ratio: 4/5;
    overflow: hidden;
    position: relative;
}

.council-vertical-card .photo-frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    transition: transform 0.6s ease;
}

.council-vertical-card:hover .photo-frame img {
    transform: scale(1.05);
}

.council-vertical-card .info-box {
    padding: 2rem 1.5rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-grow: 1;
    background: #ffffff;
}

.council-vertical-card .role-highlight {
    font-family: var(--font-body);
    font-size: 0.75rem;
    text-transform: uppercase;
    color: var(--gold-accent);
    font-weight: 700;
    letter-spacing: 2px;
    margin-top: 0.5rem; /* Switched margins */
    margin-bottom: 0;
    display: block;
    line-height: 1.4;
}

.council-vertical-card .member-name {
    font-family: var(--font-heading);
    font-size: 1.6rem;
    color: var(--navy-primary);
    font-weight: 600;
    line-height: 1.1;
    text-transform: none;
    margin-bottom: 0.5rem; /* Added margin bottom to push role */
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    /* Council Grid matching Board Members style on Mobile */
    .council-grid {
        display: flex;
        flex-direction: column;
        gap: 15px;
        max-width: none;
        margin: 0;
    }
    
    .council-vertical-card {
        display: flex;
        flex-direction: row;
        height: auto;
        min-height: 180px;
        width: 100%;
        background: var(--navy-primary);
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
        border: none;
        border-top: none;
        border-radius: 4px;
        overflow: hidden;
        margin-bottom: 0;
        padding: 0;
    }

    .council-vertical-card:hover {
        transform: none;
    }

    .council-vertical-card .photo-frame {
        position: relative !important;
        width: 180px !important;
        min-width: 180px !important;
        height: auto !important;
        min-height: 180px;
        aspect-ratio: auto;
        flex-shrink: 0;
    }

    .council-vertical-card .photo-frame img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        object-fit: cover;
    }
    
    .council-vertical-card .info-box {
        padding: 20px;
        text-align: left;
        align-items: flex-start;
        background: transparent;
        width: auto;
        flex-grow: 1;
        justify-content: center;
    }

    .council-vertical-card .member-name {
        font-family: var(--font-heading);
        color: #ffffff;
        font-size: 1.25rem !important;
        font-weight: 600 !important;
        margin-bottom: 5px;
        line-height: 1.2;
    }

    .council-vertical-card .role-highlight {
        font-family: var(--font-body);
        color: var(--gold-accent);
        font-size: 0.75rem;
        margin-bottom: 0;
        text-align: left;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    /* EXCEPTION: Chairman looks like President (Vertical, White) */
    .council-vertical-card:first-child {
        flex-direction: column;
        background: #ffffff;
        min-height: auto;
        height: auto;
        border-top: 5px solid var(--gold-accent);
        margin-bottom: 30px;
    }

    .council-vertical-card:first-child .photo-frame {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        aspect-ratio: 4/5;
    }

    .council-vertical-card:first-child .photo-frame img {
        position: relative;
    }

    .council-vertical-card:first-child .info-box {
        width: 100%;
        text-align: center;
        align-items: center;
        padding: 2.5rem 2rem;
        background: #ffffff;
        justify-content: center;
    }

    .council-vertical-card:first-child .member-name {
        color: var(--navy-primary) !important;
        font-size: 1.6rem !important;
        margin-bottom: 0.8rem;
    }

    .council-vertical-card:first-child .role-highlight {
        text-align: center;
        margin-top: 0;
        margin-bottom: 0;
    }
}

/* President Title Fix (Match Council Style) */
.president-card-vertical .member-name {
    font-family: var(--font-heading);
    font-size: 1.6rem;
    color: var(--navy-primary);
    font-weight: 600;
    line-height: 1.1;
    text-transform: none;
}

.president-card-vertical .role-highlight {
    font-size: 0.75rem; 
    margin-bottom: 0.8rem;
    line-height: 1.4;
}

/* --- FLIP CARD STYLES (NEW) --- */

/* Reset/Override existing card styles for the flip container */
.member-gallery-card.flip-container {
    background-color: transparent;
    perspective: 1000px;
    /* Determine height via aspect ratio to prevent collapse with absolute children */
    aspect-ratio: 3/4;
    min-height: 400px; 
    cursor: pointer;
    border: none; /* remove any default borders */
    display: block; /* was flex */
    width: 100%;
    margin: 0;
}

/* The Flipper Container */
.flip-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.8s;
    transform-style: preserve-3d;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* Flip Trigger (Hover or Class for Mobile) */
.member-gallery-card.flip-container:hover .flip-inner,
.member-gallery-card.flip-container.flipped .flip-inner {
    transform: rotateY(180deg);
}

/* Common Face Styles */
.flip-front, .flip-back {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border-radius: 4px;
    overflow: hidden;
    top: 0;
    left: 0;
}

/* --- FRONT FACE --- */
.flip-front {
    background-color: #fff;
    color: black;
    z-index: 2;
    display: flex;
    flex-direction: column;
}

/* Adjust Image Wrapper to fill most space */
.flip-front .gallery-image-wrapper {
    flex-grow: 1;
    position: relative;
    overflow: hidden;
    height: 85%; /* Reserve space for name bar */
}

.flip-front .gallery-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s ease;
}

/* Name Panel on Front (Navy Strip) */
.gallery-info-front {
    height: 15%;
    min-height: 60px;
    background: var(--navy-primary);
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    border-top: 3px solid var(--gold-accent);
    position: relative;
    z-index: 5;
}

.gallery-info-front h3 {
    margin: 0;
    font-family: var(--font-heading);
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--white);
    line-height: 1.2;
}

/* --- BACK FACE --- */
.flip-back {
    background-color: var(--navy-dark); /* Slightly darker navy for contrast */
    color: white;
    transform: rotateY(180deg);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 30px;
    /* Optional: Add a decorative border inside */
    box-shadow: inset 0 0 0 5px var(--gold-accent); 
}

.gallery-info-back {
    text-align: center;
}

.gallery-info-back .back-name {
    font-family: var(--font-heading);
    font-size: 1.6rem;
    color: var(--gold-accent);
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(255,255,255,0.2);
    display: block;
}

.gallery-info-back .role {
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: #e0e0e0;
    line-height: 1.5;
    font-style: normal;
}

/* Decoration */
.separator-gold {
    width: 40px;
    height: 2px;
    background: var(--gold-accent);
    margin: 0 auto 15px auto;
}

/* Mobile Adjustments */
@media (max-width: 992px) {
    .member-gallery-card.flip-container {
        aspect-ratio: 3/4; /* Ensure aspect ratio on mobile slider */
        min-height: 350px;
        scroll-snap-align: center; /* Better alignment */
    }
}




/* --- PREMIUM EDITORIAL FLOW (Działalność) --- */
.editorial-section {
padding: 120px 0;
background-color: var(--light-bg);
position: relative;
overflow: hidden;
}

.editorial-section .section-header .suptitle {
    color: var(--gold-accent);
}

.editorial-flow {
display: flex;
flex-direction: column;
gap: 150px;
margin-top: 60px;
max-width: 1200px;
margin-left: auto;
margin-right: auto;
}

.editorial-row {
display: flex;
align-items: center;
gap: 80px;
position: relative;
}

.editorial-row.reverse {
flex-direction: row-reverse;
}

.editorial-img-wrapper {
position: relative;
flex: 1;
z-index: 1;
width: 100%;
}

/* Złota ramka / offset w tle zdjęcia */
.editorial-img-wrapper::before {
content: '';
position: absolute;
top: 30px;
left: 30px;
right: -30px;
bottom: -30px;
border: 1px solid var(--gold-color);
z-index: -1;
transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.editorial-row.reverse .editorial-img-wrapper::before {
left: -30px;
right: 30px;
}

.editorial-row:hover .editorial-img-wrapper::before {
top: 15px;
left: 15px;
right: -15px;
bottom: -15px;
background: rgba(212, 175, 55, 0.05); /* lekka poświata */
}

/* Obrazek w masce */
.editorial-img {
position: relative;
width: 100%;
height: 450px;
box-shadow: 0 15px 35px rgba(0,0,0,0.1);
overflow: hidden;
}

.editorial-img img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;

transition: filter 1s ease, transform 1.5s ease;
}

.editorial-row:hover .editorial-img img {

transform: scale(1.05);
}

/* Duże cyfry wychodzące poza zdjęcie */
.editorial-number {
    position: absolute;
    left: -22px;
    bottom: -48px;
    display: block;
    font-family: var(--font-heading);
    font-size: 8.5rem;
    font-style: italic;
    font-weight: 700;
    line-height: 0.9;
    letter-spacing: -0.03em;
    color: rgba(197, 160, 89, 0.82);
    text-shadow: 0 10px 24px rgba(12, 35, 64, 0.10);
    z-index: 6;
    pointer-events: none;
}

.editorial-number::before,
.editorial-number::after {
    content: none;
}

.editorial-row.reverse .editorial-number {
    left: auto;
    right: -22px;
}

/* Treść obok zdjęcia */
.editorial-content {
flex: 1;
position: relative;
z-index: 3;
padding-left: 30px;
}

.editorial-row.reverse .editorial-content {
padding-left: 0;
padding-right: 30px;
text-align: left;
}

/* Kreska akcentująca przy tekście */
.editorial-content::before {
content: '';
position: absolute;
left: 0;
top: 10px;
width: 2px;
height: 80px;
background: var(--gold-color);
}

.editorial-row.reverse .editorial-content::before {
left: auto;
right: -20px; /* Zmiana na prawe wyrównanie odwraca też kreskę na prawo (jeśli zechcesz) - obecnie wyrównanie jest always-left bo lepiej sie czyta, więc kreska z lewej zostaje */
display: none; /* Czystiej z ukrytą w reverese */
}
.editorial-row.reverse .editorial-content {
padding-left: 30px; 
}
.editorial-row.reverse .editorial-content::after {
content: '';
position: absolute;
left: 0;
top: 10px;
width: 2px;
height: 80px;
background: var(--gold-color);
}


.editorial-icon {
font-size: 2.5rem;
color: var(--gold-accent);
margin-bottom: 25px;
opacity: 1;
}

.editorial-content h3 {
font-size: 2.4rem;
font-family: var(--font-heading);
font-weight: 600;
font-style: italic;
color: var(--navy-primary);
margin-bottom: 1.5rem;
line-height: 1.2;
}

.editorial-content p {
font-size: 1rem;
color: var(--text-dark);
font-family: var(--font-body);
line-height: 1.8;
margin-bottom: 35px;
}

/* RWD */
@media (max-width: 992px) {
.editorial-row, .editorial-row.reverse {
flex-direction: column;
gap: 60px;
}
.editorial-flow { gap: 100px; padding: 0 15px; }
.editorial-img { height: 350px; }

.editorial-img-wrapper::before {
top: 15px; left: 15px; right: -15px; bottom: -15px;
}
.editorial-row.reverse .editorial-img-wrapper::before {
top: 15px; right: 15px; left: -15px; bottom: -15px;
}

.editorial-content, .editorial-row.reverse .editorial-content {
padding-left: 20px;
padding-right: 0;
}
    .editorial-number {
        left: -12px;
        bottom: -34px;
        font-size: 6.5rem;
    }
    .editorial-row.reverse .editorial-number {
        right: -12px;
    }
}

@media (max-width: 576px) {
.editorial-img { height: 260px; }
    .editorial-number {
        left: -8px;
        bottom: -24px;
        font-size: 4.8rem;
    }
    .editorial-row.reverse .editorial-number { right: -8px; }
.editorial-content h3 { font-size: 1.9rem; }
}

/* --- Flagship Section: Młode Talenty --- */
.flagship-section {
    background-color: var(--navy-dark);
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(197, 160, 89, 0.12);
    border-bottom: 1px solid rgba(197, 160, 89, 0.12);
}

.flagship-section::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: url('data:image/svg+xml,%3Csvg width=\'60\' height=\'60\' viewBox=\'0 0 60 60\' xmlns=\'http://www.w3.org/2000/svg\'%3E%3Cg fill=\'none\' fill-rule=\'evenodd\'%3E%3Cg fill=\'%23c5a059\' fill-opacity=\'0.05\'%3E%3Cpath d=\'M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z\'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E');
	opacity: 0.45;
	pointer-events: none;
}

.flagship-layout {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 6rem;
}

@media (min-width: 992px) {
    .flagship-visual {
        width: 44%;
		display: flex;
    }

    .flagship-content {
        width: 50%;
		display: flex;
		flex-direction: column;
		justify-content: center;
    }

	.flagship-image-frame {
		aspect-ratio: auto;
		height: 100%;
		min-height: 100%;
	}
}

.flagship-visual {
    position: relative;
    width: 100%;
    opacity: 0;
    transform: translateX(-50px);
    transition: all 1s ease-out;
}

.flagship-visual.in-view {
    opacity: 1;
    transform: translateX(0);
}

.flagship-image-frame {
    position: relative;
    z-index: 2;
	aspect-ratio: 4 / 3;
	overflow: hidden;
}

.flagship-main-img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center center;
    filter: contrast(1.03) saturate(0.94);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3);
}

.flagship-gold-frame {
    position: absolute;
    top: -20px;
    left: -20px;
    width: 62%;
    height: 62%;
    border-top: 5px solid var(--gold-accent);
    border-left: 5px solid var(--gold-accent);
    z-index: 3;
    pointer-events: none;
}

.flagship-decoration-box {
    position: absolute;
    bottom: -40px;
    right: -40px;
    width: 78%;
    height: 78%;
    background-color: rgba(255, 255, 255, 0.05);
    z-index: 1;
}

.flagship-logo-badge {
    position: absolute;
    left: 28px;
    bottom: 28px;
    z-index: 4;
    padding: 18px 22px;
    background: rgba(253, 251, 247, 0.96);
    border: 1px solid rgba(197, 160, 89, 0.32);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.24);
}

.flagship-logo {
    display: block;
    width: 160px;
    height: auto;
}

.flagship-content {
    width: 100%;
    text-align: left;
    opacity: 0;
    transform: translateX(50px);
    transition: all 1s ease-out;
}

.flagship-content.in-view {
    opacity: 1;
    transform: translateX(0);
}

.flagship-content .section-title {
    font-size: 3rem;
    color: var(--white);
    margin-bottom: 1.5rem;
    line-height: 1.1;
}

.flagship-content .suptitle {
	color: var(--gold-accent);
}

.flagship-content .divider-gold {
	margin: 0 0 2rem 0;
}

.flagship-content .btn {
    align-self: flex-start;
    width: auto;
    max-width: max-content;
    flex: 0 0 auto;
    margin-top: 0.5rem;
}

.flagship-text {
    font-family: var(--font-body);
    font-size: 1.08rem;
    line-height: 1.9;
    color: rgba(255, 255, 255, 0.72);
    margin-bottom: 2rem;
}

.flagship-points {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 2.2rem;
}


.flagship-point {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    font-family: var(--font-body);
    font-size: 1rem;
    font-weight: 600;
    color: var(--white);
}

.flagship-point span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--gold-accent);
    flex-shrink: 0;
}

@media (max-width: 992px) {
    .flagship-layout {
        flex-direction: column;
        gap: 4rem;
    }

    .flagship-visual,
    .flagship-content {
        width: 100%;
    }

    .flagship-decoration-box {
        right: -20px;
        bottom: -20px;
    }
}

@media (max-width: 576px) {
    .flagship-layout {
        gap: 3rem;
    }

	.flagship-image-frame {
		aspect-ratio: 5 / 4;
	}

    .flagship-gold-frame {
        top: -14px;
        left: -14px;
        border-top-width: 4px;
        border-left-width: 4px;
    }

    .flagship-logo-badge {
        left: 16px;
        bottom: 16px;
        padding: 12px 14px;
    }

    .flagship-logo {
        width: 120px;
    }

    .flagship-content .section-title {
        font-size: 2.35rem;
    }

    .flagship-text {
        font-size: 1rem;
        line-height: 1.8;
    }

    .flagship-point {
        font-size: 0.95rem;
    }
}

/* --- Premium Activity Gallery --- */
.activity-gallery-section {
    position: relative;
    overflow: hidden;
    background-color: var(--cream-bg);
    color: var(--text-dark);
    padding: 7rem 0;
    border-top: 1px solid rgba(197, 160, 89, 0.12);
    border-bottom: 1px solid rgba(197, 160, 89, 0.12);
}

.activity-gallery-section::before,
.activity-gallery-section::after {
    content: '';
    position: absolute;
    pointer-events: none;
}

.activity-gallery-section::before {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('data:image/svg+xml,%3Csvg width=\'60\' height=\'60\' viewBox=\'0 0 60 60\' xmlns=\'http://www.w3.org/2000/svg\'%3E%3Cg fill=\'none\' fill-rule=\'evenodd\'%3E%3Cg fill=\'%23c5a059\' fill-opacity=\'0.05\'%3E%3Cpath d=\'M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z\'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E');
    opacity: 0.28;
}

.activity-gallery-section::after {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.16) 0%, rgba(197, 160, 89, 0.03) 100%);
    opacity: 1;
}

.activity-gallery-section .container {
    position: relative;
    z-index: 1;
}

.activity-gallery-section .section-title {
    color: var(--navy-primary);
}

.activity-gallery-section .suptitle {
    color: var(--gold-accent);
}

.activity-gallery-section .divider-gold {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0.9rem;
}

.activity-gallery-head {
    max-width: 980px;
    margin: 0 auto 3rem;
    text-align: center;
}

.activity-gallery-head .section-header {
	margin-bottom: 1.1rem;
}

.activity-gallery-lead {
    max-width: 820px;
    margin: 0 auto;
    font-size: 1.08rem;
    line-height: 1.9;
    color: var(--text-light);
}


.activity-gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    margin-top: 3.5rem;
}

.activity-gallery-card {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    padding: 0;
    background: var(--white);
    border: 1px solid rgba(20, 50, 88, 0.08);
    border-radius: 8px;
    box-shadow: 0 12px 26px rgba(12, 35, 64, 0.08);
    cursor: pointer;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

.activity-gallery-card.is-hidden {
    display: none;
}

.activity-gallery-grid.is-expanded .activity-gallery-card.is-hidden {
    display: block;
}

.activity-gallery-card img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transform: scale(1.001);
    transition: transform 0.7s ease, filter 0.7s ease;
    filter: saturate(0.96) contrast(1.02) brightness(0.96);
    user-select: none;
    -webkit-user-drag: none;
}

.activity-gallery-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(20, 50, 88, 0.02) 0%, rgba(20, 50, 88, 0.08) 100%);
    z-index: 1;
    transition: opacity 0.35s ease;
    opacity: 0.08;
}

.activity-gallery-card::after {
    content: '';
    position: absolute;
    inset: 0.7rem;
    border: 1px solid rgba(20, 50, 88, 0.18);
    border-radius: 4px;
    opacity: 0;
    transform: scale(0.985);
    transition: opacity 0.35s ease, transform 0.35s ease;
    z-index: 2;
    pointer-events: none;
}

.activity-gallery-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 38px rgba(12, 35, 64, 0.12);
    border-color: rgba(197, 160, 89, 0.26);
}

.activity-gallery-card:focus-visible {
    outline: 2px solid var(--gold-accent);
    outline-offset: 4px;
}

.activity-gallery-card:hover img {
    transform: scale(1.045);
    filter: saturate(1) contrast(1.04) brightness(1);
}

.activity-gallery-card:hover .activity-gallery-overlay {
    opacity: 0;
}

.activity-gallery-card:hover::after {
    opacity: 1;
    transform: scale(1);
}

.activity-gallery-actions {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
}

.activity-gallery-load-more {
    min-width: 240px;
    margin-top: 0;
    background: transparent;
    box-shadow: none;
}

.activity-gallery-load-more:focus-visible {
    outline: 2px solid var(--gold-accent);
    outline-offset: 4px;
}

.gallery-lightbox {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: rgba(5, 10, 18, 0.92);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    z-index: 3000;
}

.gallery-lightbox.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.gallery-lightbox-image {
    max-width: min(1200px, 92vw);
    max-height: 88vh;
    width: auto;
    height: auto;
    object-fit: contain;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
    position: relative;
    z-index: 1;
}

.gallery-lightbox-close {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.08);
    color: var(--white);
    font-size: 1.1rem;
    cursor: pointer;
    z-index: 2;
}

.gallery-lightbox-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 56px;
    height: 56px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.08);
    color: var(--white);
    font-size: 1rem;
    cursor: pointer;
    z-index: 2;
}

.gallery-lightbox-nav.prev {
    left: 24px;
}

.gallery-lightbox-nav.next {
    right: 24px;
}

.news-spotlight-section {
    position: relative;
    background: linear-gradient(180deg, rgba(252, 248, 240, 0.96) 0%, rgba(244, 238, 227, 0.92) 100%);
    overflow: hidden;
}

.news-spotlight-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg width='220' height='220' viewBox='0 0 220 220' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='rgba(212,175,55,0.08)' stroke-width='1'%3E%3Cpath d='M0 110h220M110 0v220'/%3E%3Ccircle cx='110' cy='110' r='74'/%3E%3Ccircle cx='110' cy='110' r='104'/%3E%3C/g%3E%3C/svg%3E");
    opacity: 0.55;
    pointer-events: none;
}

.news-spotlight-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: 4rem;
    align-items: center;
}

.news-spotlight-image-frame {
    position: relative;
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 28px 60px rgba(10, 26, 47, 0.18);
}

.news-spotlight-image-frame::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(10, 26, 47, 0.04) 0%, rgba(10, 26, 47, 0.28) 100%);
}

.news-spotlight-image-frame img {
    width: 100%;
    height: 100%;
    min-height: 460px;
    object-fit: cover;
    display: block;
}

.news-spotlight-content .divider-gold {
    margin: 1.35rem 0 1.65rem;
}

.news-spotlight-text {
    font-size: 1rem;
    line-height: 1.9;
    color: rgba(44, 62, 80, 0.88);
    max-width: 640px;
}

.news-spotlight-meta {
    display: grid;
    gap: 1rem;
    margin-top: 2rem;
}

.news-meta-item {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    font-size: 0.9rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--navy-primary);
}

.news-meta-item span {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--gold-accent) 0%, #f1d67a 100%);
    box-shadow: 0 0 0 5px rgba(212, 175, 55, 0.12);
    flex: 0 0 12px;
}

.news-archive-section {
    position: relative;
    background: linear-gradient(135deg, var(--navy-dark) 0%, var(--navy-primary) 100%);
    color: var(--white);
    overflow: hidden;
}

.news-archive-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 20% 25%, rgba(212, 175, 55, 0.12), transparent 34%),
        radial-gradient(circle at 80% 75%, rgba(212, 175, 55, 0.08), transparent 28%);
    pointer-events: none;
}

.news-archive-section .section-title,
.news-archive-section .section-subtitle {
    color: var(--white);
}

.news-archive-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

.news-archive-card {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(212, 175, 55, 0.22);
    border-radius: 24px;
    padding: 2rem;
    backdrop-filter: blur(14px);
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.16);
}

.archive-year {
    display: inline-flex;
    margin-bottom: 1rem;
    padding: 0.45rem 0.9rem;
    border-radius: 999px;
    background: rgba(212, 175, 55, 0.14);
    color: var(--gold-accent);
    font-size: 0.78rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.news-archive-card h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.9rem;
    font-weight: 600;
    color: var(--white);
    margin-bottom: 0.9rem;
}

.news-archive-card p {
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.8;
}

.news-page .journal-card {
    padding-top: 2.5rem;
}

.news-page .journal-content-wrapper {
    margin-top: 2.2rem;
}

.event-hero-kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.7rem 1.35rem;
    margin-bottom: 1.4rem;
    border-radius: 999px;
    background: rgba(212, 175, 55, 0.16);
    border: 1px solid rgba(212, 175, 55, 0.28);
    color: var(--gold-accent);
    font-size: 0.8rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.event-detail-section {
    background: linear-gradient(180deg, rgba(252, 248, 240, 0.96) 0%, rgba(246, 240, 228, 0.92) 100%);
}

.event-detail-grid {
    display: grid;
    grid-template-columns: minmax(280px, 320px) minmax(0, 1fr);
    gap: 5rem;
    align-items: start;
}

.event-detail-grid > * {
    min-width: 0;
}

.event-meta-panel {
    position: sticky;
    top: 120px;
}

.event-meta-card {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(17, 41, 71, 0.08);
    box-shadow: 0 22px 50px rgba(10, 26, 47, 0.08);
    overflow: hidden;
}

.event-meta-card {
    border-radius: 28px;
    padding: 2rem;
}

.event-meta-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    min-height: 180px;
    border-radius: 24px;
    background: linear-gradient(135deg, var(--navy-dark) 0%, var(--navy-primary) 100%);
    color: var(--white);
    text-align: center;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
}

.event-meta-date.is-empty {
    opacity: 0.9;
}

.event-meta-day {
    font-family: var(--font-heading);
    font-size: 3rem;
    font-weight: 700;
    line-height: 1;
}

.event-meta-month {
    font-family: var(--font-heading);
    font-size: 1.35rem;
    font-weight: 600;
    letter-spacing: 0.08em;
}

.event-meta-year {
    font-size: 0.88rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    opacity: 0.86;
}

.event-meta-copy {
    margin: 1.4rem 0 1.8rem;
    color: rgba(44, 62, 80, 0.78);
    line-height: 1.8;
}

.event-meta-button {
    width: 100%;
    justify-content: center;
}

.event-story-card {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
}

.event-story-top {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.event-story-top .divider-gold {
    width: 60px;
    height: 3px;
    background: var(--gold-accent);
    margin: 1.5rem 0 2rem 0;
}

.event-story-label {
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--gold-accent);
}

.event-story-title {
    margin-top: 0.75rem;
    font-family: var(--font-heading);
    font-size: clamp(2.1rem, 4vw, 3rem);
    color: var(--navy-primary);
    overflow-wrap: anywhere;
}

.event-story-body {
    margin-top: 2rem;
}

.event-story-body p {
    margin: 0 0 1.35rem;
    color: rgba(44, 62, 80, 0.88);
    line-height: 1.95;
    font-size: 1rem;
    overflow-wrap: anywhere;
}

.event-story-body p:last-child {
    margin-bottom: 0;
}

.event-gallery-block {
    margin-top: 3rem;
    padding: 0;
}

.event-gallery-head {
    margin-bottom: 2rem;
}

.event-gallery-head .divider-gold {
    margin-top: 1rem;
}

.event-gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.event-gallery-item {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    border-radius: 0;
    overflow: hidden;
    background: rgba(10, 26, 47, 0.08);
    box-shadow: 0 16px 34px rgba(10, 26, 47, 0.12);
    cursor: pointer;
}

.event-gallery-item::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(10, 26, 47, 0.02) 0%, rgba(10, 26, 47, 0.24) 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.event-gallery-item img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.event-gallery-item:hover img {
    transform: scale(1.05);
}

.event-gallery-item:hover::after {
    opacity: 1;
}

@media (max-width: 1100px) {
    .activity-gallery-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .news-spotlight-grid {
        grid-template-columns: 1fr;
        gap: 2.75rem;
    }

    .news-archive-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .event-detail-grid {
        grid-template-columns: 1fr;
    }

    .event-meta-panel {
        position: static;
        order: 2;
    }

    .event-article {
        order: 1;
    }

    .event-gallery-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 640px) {
    .activity-gallery-head {
        margin-bottom: 2.5rem;
    }

    .activity-gallery-grid {
        display: grid;
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: 78vw;
        gap: 0.7rem;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding-bottom: 0.35rem;
        scrollbar-width: none;
    }

    .activity-gallery-grid::-webkit-scrollbar {
        display: none;
    }

    .activity-gallery-card {
        scroll-snap-align: start;
    }

    .activity-gallery-card.is-hidden {
        display: block;
    }

    .activity-gallery-lead {
        font-size: 1rem;
    }

    .activity-gallery-actions {
        display: none;
    }

    .news-spotlight-image-frame img {
        min-height: 320px;
    }

    .news-archive-grid {
        grid-template-columns: 1fr;
    }

    .event-story-card,
    .event-meta-card {
        padding: 1.6rem;
        border-radius: 24px;
    }

    .event-gallery-block {
        padding: 0;
        margin-right: calc(-1.6rem - 20px);
        overflow: visible;
    }

    .event-gallery-grid {
        display: grid;
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: 78%;
        gap: 0.7rem;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding-bottom: 0.35rem;
        scrollbar-width: none;
    }

    .event-gallery-grid::-webkit-scrollbar {
        display: none;
    }

    .event-gallery-item {
        scroll-snap-align: start;
    }

    .event-meta-date {
        min-height: 150px;
    }

    .activity-gallery-card::after {
        inset: 0.5rem;
    }

    .gallery-lightbox {
        padding: 1rem;
    }

    .gallery-lightbox-nav {
        width: 48px;
        height: 48px;
    }

    .gallery-lightbox-nav.prev {
        left: 12px;
    }

    .gallery-lightbox-nav.next {
        right: 12px;
    }
}

@media (max-width: 480px) {
    .activity-gallery-grid {
        grid-template-columns: 1fr;
    }
}





/* --- COPILOT FIXES (MOBILE) --- */
@media (max-width: 768px) {
    /* 1. Reduce Section Padding */
    .section {
        padding: 3rem 0 !important;
    }
    
    /* 2. Watermark Logo Visibility (Declaration Section) */
    .watermark-bg {
        opacity: 0.4 !important;
        width: 80% !important;
        height: auto !important;
        aspect-ratio: 1/1;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        display: block !important; /* Ensure visibility */
    }

    /* 3. Slider Fixes (Members) */
    .members-gallery-grid {
        margin: 0 !important;
        padding: 0 20px 20px 20px !important; /* Padding for scroll spacing */
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        justify-content: flex-start !important;
        gap: 15px !important;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
    }
    
    .member-gallery-card {
        flex: 0 0 85% !important;
        max-width: 85% !important;
        width: 85% !important;
        scroll-snap-align: center;
        margin-right: 0 !important; /* Remove margin right if gap takes care of it, or keep small gap? gap is 15px */
    }
    
    /* 4. Council Members Size Fix */
    /* Reduce size of images in Council cards to be smaller (like Stanisław Han) */
    .council-vertical-card .photo-frame, 
    .council-vertical-card:first-child .photo-frame {
        width: 130px !important;
        min-width: 130px !important;
        height: auto !important;
        min-height: 130px !important;
        aspect-ratio: 4/5; 
        flex-shrink: 0;
    }
    
    .council-vertical-card {
        min-height: 130px !important;
        align-items: center;
        padding: 0 !important;
        background: var(--navy-primary) !important; 
        flex-direction: row !important; /* Force row on ALL cards */
    }
    
    .council-vertical-card .info-box {
        padding: 10px 15px !important;
        width: auto !important;
        flex-grow: 1;
        justify-content: center;
        align-items: flex-start !important; /* Left align text */
        text-align: left !important;
    }
    
    .council-vertical-card .member-name {
        font-size: 1.1rem !important;
        line-height: 1.2 !important;
        margin-bottom: 5px !important;
        color: #ffffff !important; /* Ensure white text on dark bg */
        white-space: normal !important; /* Allow wrapping */
    }
    
    .council-vertical-card .role-highlight {
        font-size: 0.7rem !important;
        margin-top: 0 !important;
        color: var(--gold-accent) !important;
        text-align: left !important;
    }

    /* 5. Quote Size Fix */
    .visionary-title {
        font-size: 1.6rem !important; /* Larger text */
        white-space: normal !important; /* Allow wrapping */
        line-height: 1.3 !important;
        text-align: center;
        padding: 0 10px;
        /* override clamp if needed */
        width: 100%;
    }
    
    .visionary-content {
        padding: 2rem 1rem !important;
        width: 95% !important;
    }
}



/* --- COPILOT FIXES PART 2 --- */

/* 1. Equal Height for Mobile Member Slider */
@media (max-width: 992px) {
    .members-gallery-grid {
        align-items: stretch !important; /* Force items to stretch to container height */
    }
    
    .member-gallery-card {
        height: auto !important; /* Allow flex stretch to control height */
        display: flex !important;
        flex-direction: column !important;
    }

    .member-gallery-card .card-inner,
    .member-gallery-card .flip-inner, 
    .member-gallery-card .flip-front {
        height: 100% !important; /* Ensure internal containers fill the height */
        display: flex !important;
        flex-direction: column !important;
    }

    /* Ensure image fills available space but text stays at bottom */
    .member-gallery-card .gallery-image-wrapper {
        flex-grow: 1 !important;
        height: auto !important; 
    }
}

/* 2. Council Chairman like President (Mobile) */
@media (max-width: 768px) {
    /* Exclude the first card (Chairman) from the horizontal row style */
    .council-vertical-card:first-child {
        flex-direction: column !important; /* Stack vertically like President */
        background: #ffffff !important; /* White background */
        border-top: 5px solid var(--gold-accent) !important;
        margin-bottom: 30px !important;
        max-width: 500px;
        margin-left: auto;
        margin-right: auto;
        width: 100% !important;
        height: auto !important;
    }

    /* Reset Photo for Chairman */
    .council-vertical-card:first-child .photo-frame {
        width: 100% !important; /* Full width */
        min-width: 100% !important;
        height: auto !important;
        aspect-ratio: 4/5 !important;
    }

    /* Reset Info Box for Chairman */
    .council-vertical-card:first-child .info-box {
        width: 100% !important;
        padding: 2.5rem 2rem !important; /* Larger padding */
        text-align: center !important;
        align-items: center !important; /* Center content */
        justify-content: center !important;
        background: #ffffff !important;
    }

    /* Reset Text for Chairman */
    .council-vertical-card:first-child .member-name {
        color: var(--navy-primary) !important; /* Dark text */
        font-size: 2rem !important; /* Large text */
        margin-bottom: 0.5rem !important;
        text-align: center !important;
    }

    .council-vertical-card:first-child .role-highlight {
        text-align: center !important;
        margin-top: 0.5rem !important;
        font-size: 0.9rem !important;
    }
}



/* --- COPILOT FIXES PART 3 --- */
/* 6. Mission & Goals Mobile Layout (Text Top, Image Bottom) */
@media (max-width: 768px) {
    .two-column.reverse .text-column {
        order: unset !important;
    }
}



/* --- COPILOT FIXES PART 4 --- */
/* 7. Center 'Synergia Biznesu' Heading on Mobile */
@media (max-width: 768px) {
    .prestige-content {
        text-align: center !important;
    }
    
    .prestige-content .suptitle,
    .prestige-content .prestige-title {
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}



/* --- COPILOT FIXES PART 5 --- */
/* 8. Move 'i Nauki' to new line on Mobile */
@media (max-width: 768px) {
    .prestige-title .text-gold {
        display: block;
        margin-top: 5px; /* Optional spacing */
    }
}

/* --- O KLUBIE PAGE MOBILE FIXES --- */
@media (max-width: 768px) {
    /* 1. Center Section Headers, Suptitles & Gold Lines */
    .about-page-v5 .section-title,
    .about-page-v5 .suptitle,
    .about-page-v5 h2 {
        text-align: center !important;
    }

    /* Center the standard divider */
    .about-page-v5 .divider {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* Center the custom gold line in Genesis section */
    .about-page-v5 .genesis-content .section-title::after {
        left: 50% !important;
        transform: translateX(-50%) !important;
    }

    /* 2. Normalize Section Paddings (Match Main Page) */
    .about-page-v5 .history-genesis,
    .about-page-v5 .values-strip-section,
    .about-page-v5 .flow-timeline-section,
    .about-page-v5 section:not(.hero-page) {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important;
    }

    /* 3. Values Horizontal Scroll Fixes (Slider Peek) */
    .about-page-v5 .values-ticker-container {
        padding-left: 20px !important;
        padding-right: 20px !important;
        gap: 15px !important;
        overflow-x: auto !important;
        justify-content: flex-start !important;
        scroll-snap-type: x mandatory;
        padding-bottom: 2rem !important;
    }

    .about-page-v5 .value-card-large {
        flex: 0 0 85% !important; /* Show 85% width to reveal next card */
        width: 85% !important;
        max-width: 85% !important;
        margin: 0 !important;
        scroll-snap-align: center;
        padding: 2rem 1.5rem !important; /* Slightly smaller padding */
    }
    
    .about-page-v5 .value-big-number {
        font-size: 4rem !important;
        right: 15px !important;
        top: 5px !important;
    }

    /* 4. Elite Circle Section: Image below text on mobile */
    .about-page-v5 .member-profile-grid {
        display: flex !important;
        flex-direction: column !important;
    }
    
    .about-page-v5 .member-profile-text {
        order: 1 !important;
    }
    
    .about-page-v5 .member-profile-visual {
        order: 2 !important;
        margin-top: 2rem !important;
    }
}

/* --- COMMUNITY PAGE MOBILE FIXES --- */
@media (max-width: 768px) {
    /* 1. Ensure Member Names are Visible (Fix truncation) */
    .community-page .gallery-info-front {
        height: auto !important; /* Allow height to adapt to content */
        min-height: 80px !important; /* Minimum height to fit longer names */
        padding: 15px 10px !important;
        flex-shrink: 0 !important; /* Prevent shrinking */
    }

    .community-page .gallery-info-front h3 {
        white-space: normal !important; /* Allow text wrapping */
        font-size: 1rem !important; /* Adjust font size for better fit */
        line-height: 1.3 !important;
        display: -webkit-box;
        -webkit-line-clamp: 3; /* Limit to 3 lines just in case */
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    /* Adjust image wrapper to fill remaining space */
    .community-page .flip-front .gallery-image-wrapper {
        height: auto !important;
        flex-grow: 1 !important;
        flex-shrink: 1 !important; /* Allow shrinking if text needs more space */
    }
    
    /* Ensure card has enough height to display content */
    .community-page .member-gallery-card {
        min-height: 400px !important;
    }
}


/* --- MOBILE & SYNERGIA FIXES (2026) --- */

/* 1. Działalność Page Mobile Fixes */
@media (max-width: 900px) {
    /* Center Headers & Titles */
    .activities-page .section-header {
        display: flex;
        flex-direction: column;
        align-items: center !important;
        text-align: center !important;
    }

    .activities-page .section-header .suptitle,
    .activities-page .section-header .section-title,
    .activities-page .section-header .section-lead {
        text-align: center;
        width: 100%;
    }

    /* Center Golden Divider */
    .activities-page .section-header .divider,
    .activities-page .divider {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* Standardize Padding (Equal to Main Page Mobile Standards) */
    .activities-page .section {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }
}

/* 2. Main Page Synergia Section Fix (Image under Logos/Content) */
@media (max-width: 900px) {
    /* Ensure flexbox handles order */
    .prestige-section .prestige-grid {
        display: flex !important;
        flex-direction: column !important;
    }

    /* Content (Text/Logos) First */
    .prestige-section .prestige-content {
        order: 1 !important;
    }

    /* Visuals (Images) Second */
    .prestige-section .visual-stack {
        order: 2 !important;
        margin-top: 2rem !important;
        /* Ensure normal flow, no absolute overlay, full visibility */
        position: relative !important;
        width: 100% !important;
        min-height: auto !important;
        overflow: visible !important;
    }
    
    /* Reset absolute positioning inside visual stack for cleaner mobile flow */
    .prestige-section .visual-stack .main-img {
        position: relative !important;
        width: 100% !important;
        max-width: 100% !important;
        display: block;
        margin: 0 auto 1.5rem;
    }
    
    .prestige-section .visual-stack .accent-img {
         display: none !important; /* Hide accent image on mobile to simplify if broken, or stack it */
    }
}

