/* =====================================================================
   Inner pages: animated title banner, breadcrumb, content layouts,
   message pages (President, Head Teacher: floating portrait card + letter).
   ===================================================================== */

/* ---------- title banner ---------- */
.cgs-banner {
	position: relative; isolation: isolate; overflow: hidden;
	min-height: calc(clamp(220px, 26vw, 340px) + (var(--ts) - 1) * 80px);
	display: flex; align-items: center;
	background: var(--emerald-900); color: #fff;
}
.cgs-banner__scene { position: absolute; inset: 0; z-index: -2; }
.cgs-banner__svg { width: 100%; height: 100%; display: block; }
.cgs-banner::before {
	/* Contrast layer behind the stationary title. */
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: linear-gradient(90deg, rgba(7, 45, 25, .92) 0%, rgba(7, 45, 25, .78) 38%, rgba(7, 45, 25, .15) 70%, transparent 100%);
}
.cgs-banner::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px;
	background: linear-gradient(90deg, var(--gold), var(--gold-2), transparent);
}
.cgs-banner__in { padding-block: 40px; }
.cgs-banner__kicker {
	display: inline-block; margin-bottom: 10px;
	font-size: var(--fs-xs); font-weight: 700; letter-spacing: .04em; color: var(--gold-2);
}
.cgs-banner__title {
	margin: 0; padding-left: 20px; border-left: 5px solid var(--gold);
	font-family: var(--font-display); font-size: var(--fs-title); font-weight: 700; line-height: 1.3;
	color: #fff; text-shadow: 0 2px 16px rgba(0, 0, 0, .3);
	max-width: 14em;
}
.cgs-banner__ctrl {
	position: absolute; right: 16px; bottom: 16px;
	appearance: none; cursor: pointer; width: 36px; height: 36px; border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, .4); background: rgba(7, 45, 25, .45); color: #fff;
	display: grid; place-items: center;
}
.cgs-banner__ctrl .cgs-ico { width: 14px; height: 14px; }
.cgs-banner__ctrl .cgs-tbtn__play { display: none; }
.cgs-banner__ctrl[aria-pressed="true"] .cgs-tbtn__play { display: inline; }
.cgs-banner__ctrl[aria-pressed="true"] .cgs-tbtn__pause { display: none; }

/* Pause when offscreen, when the visitor pauses, or with reduced motion. */
.cgs-banner .cgs-banner__svg * { animation-duration: 12s; animation-iteration-count: infinite; animation-timing-function: ease-in-out; }
.cgs-banner.is-paused .cgs-banner__svg *,
.cgs-banner.is-offscreen .cgs-banner__svg * { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) {
	.cgs-banner .cgs-banner__svg * { animation: none !important; }
	.cgs-banner__ctrl { display: none; }
}
.bn-glow { animation-name: bn-glow; }
@keyframes bn-glow { 0%, 100% { opacity: .7; } 50% { opacity: 1; } }

/* 1. Introduction — campus reveal with community motifs */
.bn-intro .bn-reveal { animation-name: bn-reveal; transform-box: fill-box; transform-origin: right center; }
@keyframes bn-reveal { 0% { transform: scaleX(1); } 18%, 86% { transform: scaleX(0); } 100% { transform: scaleX(1); } }
.bn-intro .bn-sun { animation-name: bn-sun; }
@keyframes bn-sun { 0%, 100% { transform: translateY(40px); } 50% { transform: translateY(0); } }
.bn-intro .bn-flag { animation-name: bn-flag; transform-box: fill-box; transform-origin: left center; animation-duration: 3s !important; }
@keyframes bn-flag { 0%, 100% { transform: skewY(0); } 50% { transform: skewY(-5deg) scaleX(.96); } }
.bn-intro .bn-tree { animation-name: bn-sway; transform-box: fill-box; transform-origin: bottom center; animation-duration: 6s !important; }
.bn-intro .bn-tree--2 { animation-delay: -3s; }
@keyframes bn-sway { 0%, 100% { transform: rotate(-2deg); } 50% { transform: rotate(2deg); } }
.bn-intro .bn-walker { animation-name: bn-walk; }
.bn-intro .bn-walker--2 { animation-delay: -4s; }
.bn-intro .bn-walker--3 { animation-delay: -8s; }
@keyframes bn-walk { 0% { transform: translate(560px, 300px); opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { transform: translate(1210px, 300px); opacity: 0; } }
.bn-intro .bn-walker { animation-timing-function: linear !important; }

/* 2. Aims — open book, guiding light */
.bn-aims .bn-rays { animation-name: bn-rays; }
@keyframes bn-rays { 0%, 100% { rotate: -6deg; opacity: .7; } 50% { rotate: 6deg; opacity: 1; } }
.bn-aims .bn-openbook { animation-name: bn-float; }
@keyframes bn-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }
.bn-aims .bn-star { transform-box: fill-box; transform-origin: center; animation-name: bn-star; }
.bn-aims .bn-star--2 { animation-delay: -4s; }
.bn-aims .bn-star--3 { animation-delay: -8s; }
@keyframes bn-star { 0% { translate: 0 60px; opacity: 0; scale: .4; } 20% { opacity: 1; scale: 1; } 70% { opacity: 1; } 100% { translate: 0 -40px; opacity: 0; scale: .6; } }
.bn-aims .bn-needle { animation-name: bn-needle; }
@keyframes bn-needle { 0%, 100% { rotate: -25deg; } 30% { rotate: 18deg; } 55% { rotate: -6deg; } 75% { rotate: 4deg; } }

/* 3. History — archival pages and a timeline (founding year only) */
.bn-history .bn-timeline { stroke-dasharray: 640; animation-name: bn-line; }
@keyframes bn-line { 0% { stroke-dashoffset: 640; } 40%, 85% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 640; } }
.bn-history .bn-node { transform-box: fill-box; transform-origin: center; animation-name: bn-node; }
.bn-history .bn-node--2 { animation-name: bn-node2; }
.bn-history .bn-node--3 { animation-name: bn-node3; }
@keyframes bn-node { 0% { scale: 0; } 8%, 88% { scale: 1; } 100% { scale: 0; } }
@keyframes bn-node2 { 0%, 20% { scale: 0; } 26%, 88% { scale: 1; } 100% { scale: 0; } }
@keyframes bn-node3 { 0%, 36% { scale: 0; } 42%, 88% { scale: 1; } 100% { scale: 0; } }
.bn-history .bn-years { animation-name: bn-years; }
@keyframes bn-years { 0%, 6% { opacity: 0; } 14%, 86% { opacity: 1; } 96%, 100% { opacity: 0; } }
.bn-history .bn-page-flip { transform-box: fill-box; transform-origin: left center; animation-name: bn-flip; }
@keyframes bn-flip { 0%, 20% { scale: 1 1; } 40% { scale: -1 1; } 60%, 80% { scale: -1 1; } 100% { scale: 1 1; } }

/* 4. Achievements — illustrative trophy, certificate, medal */
.bn-achievements .bn-trophy { animation-name: bn-float; }
.bn-achievements .bn-shine { animation-name: bn-shine; }
@keyframes bn-shine { 0%, 30% { translate: -60px 0; opacity: 0; } 40% { opacity: .5; } 55%, 100% { translate: 140px 0; opacity: 0; } }
.bn-achievements .bn-cert { animation-name: bn-cert; }
@keyframes bn-cert { 0%, 100% { rotate: -4deg; } 50% { rotate: 2deg; } }
.bn-achievements .bn-medal { animation-name: bn-swing; transform-box: fill-box; transform-origin: top center; }
@keyframes bn-swing { 0%, 100% { rotate: 8deg; } 50% { rotate: -8deg; } }
.bn-achievements .bn-bit { animation-name: bn-bit; animation-delay: calc(var(--k) * -0.66s); }
@keyframes bn-bit { 0% { translate: 0 -30px; opacity: 0; } 15% { opacity: .9; } 85% { opacity: .9; } 100% { translate: 0 160px; opacity: 0; } }

/* 5. Future plans — dashed "blueprint" motifs, one highlighted at a time */
.bn-future .bn-plan { transform-box: fill-box; transform-origin: center; animation-name: bn-plan; opacity: .45; }
.bn-future .bn-plan--2 { animation-delay: -9.6s; }
.bn-future .bn-plan--3 { animation-delay: -7.2s; }
.bn-future .bn-plan--4 { animation-delay: -4.8s; }
.bn-future .bn-plan--5 { animation-delay: -2.4s; }
@keyframes bn-plan { 0%, 22%, 100% { opacity: .45; scale: 1; } 6%, 16% { opacity: 1; scale: 1.08; } }
.bn-future .bn-blueprint { animation-name: bn-blue; }
@keyframes bn-blue { 0%, 100% { translate: 0 0; } 50% { translate: -15px 0; } }

/* 6. President — leadership, cooperation, community network */
.bn-president .bn-link { stroke-dasharray: 360; animation-name: bn-link; }
.bn-president .bn-link--2 { animation-delay: -.6s; } .bn-president .bn-link--3 { animation-delay: -1.2s; }
.bn-president .bn-link--4 { animation-delay: -1.8s; } .bn-president .bn-link--5 { animation-delay: -2.4s; } .bn-president .bn-link--6 { animation-delay: -3s; }
@keyframes bn-link { 0% { stroke-dashoffset: 360; } 30%, 80% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -360; } }
.bn-president .bn-person { transform-box: fill-box; transform-origin: center; animation-name: bn-person; }
.bn-president .bn-person--2 { animation-delay: -3s; } .bn-president .bn-person--3 { animation-delay: -6s; } .bn-president .bn-person--4 { animation-delay: -9s; }
@keyframes bn-person { 0%, 100% { scale: 1; } 10% { scale: 1.1; } 20% { scale: 1; } }
.bn-president .bn-pulse { transform-box: fill-box; transform-origin: center; animation-name: bn-pulse; }
@keyframes bn-pulse { 0% { scale: 1; opacity: .8; } 50% { scale: 2.4; opacity: 0; } 100% { scale: 1; opacity: 0; } }

/* 7. Head Teacher — teaching, chalkboard, attentive students */
.bn-headteacher .bn-chalk path { stroke-dasharray: 240; animation-name: bn-chalk; }
.bn-headteacher .bn-chalk-2 { animation-delay: .5s; } .bn-headteacher .bn-chalk-3 { animation-delay: 1s; }
.bn-headteacher .bn-chalk-4 { animation-delay: 1.5s; } .bn-headteacher .bn-chalk-5 { animation-delay: 2s; }
@keyframes bn-chalk { 0% { stroke-dashoffset: 240; } 25%, 80% { stroke-dashoffset: 0; } 92%, 100% { stroke-dashoffset: 240; } }
.bn-headteacher .bn-pointer { transform-box: view-box; transform-origin: 700px 300px; animation-name: bn-point; }
@keyframes bn-point { 0%, 100% { rotate: 0deg; } 20% { rotate: -6deg; } 40% { rotate: 3deg; } 60% { rotate: -9deg; } 80% { rotate: 2deg; } }
.bn-headteacher .bn-student { animation-name: bn-nod; }
.bn-headteacher .bn-student--2 { animation-delay: -1.5s; } .bn-headteacher .bn-student--3 { animation-delay: -3s; } .bn-headteacher .bn-student--4 { animation-delay: -4.5s; }
@keyframes bn-nod { 0%, 100% { translate: 0 0; } 8% { translate: 0 -6px; } 16% { translate: 0 0; } }

/* ---------- breadcrumb ---------- */
.cgs-crumbs { border-bottom: 1px solid var(--line); background: #fff; }
.cgs-crumbs ol {
	list-style: none; margin: 0; padding: 14px 0;
	display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px;
	font-size: var(--fs-sm); color: var(--ink-3);
}
.cgs-crumbs li { display: inline-flex; align-items: center; gap: 8px; }
.cgs-crumbs li + li::before { content: ""; width: 7px; height: 7px; border-right: 1.6px solid var(--gold); border-top: 1.6px solid var(--gold); transform: rotate(45deg); margin-right: 2px; }
.cgs-crumbs a { color: var(--emerald-700); text-decoration: none; font-weight: 600; }
.cgs-crumbs a:hover { text-decoration: underline; }
.cgs-crumbs [aria-current] { color: var(--ink-2); }

/* ---------- page body ---------- */
.cgs-page {
	position: relative;
	background:
		radial-gradient(ellipse at 100% 0, rgba(201, 162, 74, .08), transparent 40%),
		radial-gradient(ellipse at 0 100%, rgba(35, 154, 92, .07), transparent 45%),
		var(--paper);
	padding-block: clamp(28px, 5vw, 64px);
}
.cgs-page__grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 40px; align-items: start; }
.cgs-page__main { min-width: 0; }
.cgs-prose { font-size: var(--fs-base); line-height: 1.95; color: var(--ink); max-width: 46em; }
.cgs-prose p { margin: 0 0 1.1em; }
.cgs-prose strong { color: var(--emerald-800); }
.cgs-prose h2 {
	position: relative; margin: 1.6em 0 .7em; padding-bottom: 10px;
	font-family: var(--font-display); font-size: var(--fs-xl); line-height: 1.35; color: var(--emerald-900);
}
.cgs-prose h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: 56px; height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--gold), var(--gold-2)); }
.cgs-prose > :first-child { margin-top: 0; }
.cgs-lead {
	font-size: var(--fs-md); line-height: 1.9;
	padding: 24px 28px; border-radius: var(--radius-lg);
	background: #fff; border: 1px solid var(--line-gold); box-shadow: var(--shadow);
	position: relative;
}
.cgs-lead::before { content: ""; position: absolute; left: 0; top: 22px; bottom: 22px; width: 4px; border-radius: 4px; background: var(--emerald-600); }

/* side panel */
.cgs-aside { position: sticky; top: 90px; display: grid; gap: 16px; }
.cgs-aside__card {
	background: #fff; border-radius: var(--radius-lg); border: 1px solid var(--line);
	box-shadow: var(--shadow-sm); padding: 18px;
}
.cgs-aside__title { margin: 0 0 10px; font-family: var(--font-display); font-size: var(--fs-md); color: var(--emerald-900); }
.cgs-aside__nav { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.cgs-aside__nav a {
	display: flex; align-items: center; justify-content: space-between; gap: 8px;
	padding: 10px 12px; border-radius: var(--radius-sm);
	color: var(--ink); text-decoration: none; font-size: var(--fs-sm); font-weight: 600;
}
.cgs-aside__nav a:hover { background: var(--emerald-100); color: var(--emerald-800); }
.cgs-aside__nav a[aria-current] { background: var(--emerald-800); color: #fff; }
.cgs-aside__nav .cgs-ico { width: 14px; height: 14px; opacity: .7; }

/* stats (owner-supplied figures) */
.cgs-stats { margin: 8px 0 28px; }
.cgs-stats__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.cgs-stat {
	background: #fff; border-radius: var(--radius); border: 1px solid var(--line);
	padding: 16px 10px; text-align: center; box-shadow: var(--shadow-sm);
}
.cgs-stat b { display: block; font-family: var(--font-display); font-size: var(--fs-xl); line-height: 1.2; color: var(--emerald-800); }
.cgs-stat span { display: block; margin-top: 4px; font-size: var(--fs-xs); color: var(--ink-2); line-height: 1.4; }
.cgs-stat--gold b { color: var(--gold-dark); }
.cgs-stats__src { margin: 8px 0 0; font-size: var(--fs-2xs); color: var(--ink-3); }

/* lists */
.cgs-list { list-style: none; margin: 0 0 1.4em; padding: 0; display: grid; gap: 12px; }
.cgs-list li {
	position: relative; display: flex; gap: 14px; align-items: flex-start;
	background: #fff; border-radius: var(--radius); border: 1px solid var(--line);
	padding: 14px 18px; box-shadow: var(--shadow-sm); line-height: 1.7;
}
.cgs-list__ico {
	flex: none; width: 36px; height: 36px; border-radius: 12px;
	display: grid; place-items: center; background: var(--emerald-100); color: var(--emerald-700);
}
.cgs-list__ico .cgs-ico { width: 18px; height: 18px; }
.cgs-list--staff { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cgs-list--staff li { align-items: center; }
.cgs-list--achievements li { padding: 20px 22px; font-size: var(--fs-md); }
.cgs-list--achievements .cgs-list__ico { background: #fbf1d8; color: var(--gold-dark); width: 44px; height: 44px; }
.cgs-list--future { counter-reset: plan; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cgs-list--future li { flex-direction: column; gap: 10px; padding: 20px; border-style: dashed; border-color: rgba(31, 86, 196, .35); background: linear-gradient(180deg, #fff, #f6f9ff); }
.cgs-list--future li::before {
	counter-increment: plan; content: counter(plan, bengali);
	position: absolute; right: 16px; top: 12px;
	font-family: var(--font-display); font-size: var(--fs-xl); color: rgba(31, 86, 196, .18); font-weight: 700;
}
html[data-lang="en"] .cgs-list--future li::before { content: counter(plan); }
.cgs-list--future .cgs-list__ico { background: #e7eefc; color: var(--blue); }
.cgs-badge--plan { align-self: flex-start; background: #e7eefc; color: var(--blue-dark); }

/* sections (aims, history) */
.cgs-secs--aims { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.cgs-sec {
	position: relative; background: #fff; border-radius: var(--radius-lg);
	border: 1px solid var(--line-gold); box-shadow: var(--shadow); padding: 26px 26px 18px;
}
.cgs-sec h2 { margin-top: 0; }
.cgs-sec__ico {
	width: 52px; height: 52px; border-radius: 16px; margin-bottom: 12px;
	display: grid; place-items: center; color: #fff;
	background: linear-gradient(135deg, var(--emerald-500), var(--emerald-800));
	box-shadow: 0 10px 18px -10px var(--emerald-800);
}
.cgs-secs--aims .cgs-sec:nth-child(2) .cgs-sec__ico { background: linear-gradient(135deg, var(--gold-2), var(--gold-dark)); }
.cgs-secs--history { position: relative; padding-left: 34px; display: grid; gap: 22px; }
.cgs-secs--history::before { content: ""; position: absolute; left: 10px; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(var(--gold), var(--emerald-600)); }
.cgs-secs--history .cgs-sec::before {
	content: ""; position: absolute; left: -32px; top: 30px; width: 16px; height: 16px; border-radius: 50%;
	background: var(--gold); box-shadow: 0 0 0 5px var(--paper), 0 0 0 7px var(--line-gold);
}
.cgs-secs--history .cgs-sec:last-child::before { background: var(--emerald-600); }

/* ---------- leadership messages (President, Head Teacher): title, portrait card, letter ---------- */
.cgs-letter-page {
	background: linear-gradient(180deg, #f4f8f4 0%, #f8f6ef 100%);
	padding-block: clamp(18px, 2.6vw, 34px) clamp(40px, 6vw, 80px);
}
.cgs-letter-page__wrap {
	width: 100%; max-width: 1240px; margin-inline: auto;
	padding-inline: clamp(16px, 4vw, 40px);
}
.cgs-letter-crumbs ol {
	list-style: none; margin: 0; padding: 0;
	display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px;
	font-size: calc(.875rem * var(--ts)); line-height: 1.6; color: var(--ink-3);
}
.cgs-letter-crumbs li { display: inline-flex; align-items: center; gap: 8px; }
.cgs-letter-crumbs li + li::before {
	content: ""; width: 6px; height: 6px; margin-right: 2px;
	border-right: 1.5px solid var(--gold); border-top: 1.5px solid var(--gold); transform: rotate(45deg);
}
.cgs-letter-crumbs a { color: var(--emerald-700); font-weight: 600; text-decoration: none; }
.cgs-letter-crumbs a:hover { text-decoration: underline; }
.cgs-letter-crumbs a[aria-current] { color: var(--ink-2); font-weight: 500; }
.cgs-letter-page__title {
	margin: 10px 0 0;
	font-family: var(--font-display); font-weight: 700;
	font-size: calc(clamp(1.625rem, 1.2rem + 1.4vw, 2.375rem) * var(--ts));
	line-height: 1.4; color: var(--emerald-900);
}
.cgs-letter-page__rule {
	display: block; width: 72px; height: 3px; margin: 10px 0 clamp(20px, 2.6vw, 32px); border-radius: 3px;
	background: linear-gradient(90deg, var(--gold), var(--gold-2));
}
.cgs-letter-page__grid {
	display: grid; grid-template-columns: clamp(268px, 23vw, 334px) minmax(0, 1fr);
	gap: clamp(28px, 3vw, 40px); align-items: start;
}

/* portrait / profile card — static, no animation */
.cgs-profile {
	margin: 0; padding: 6px 8px 22px; text-align: center;
	background: #fff; border: 1px solid rgba(13, 86, 49, .12); border-radius: 14px;
	box-shadow: 0 18px 36px -28px rgba(10, 63, 36, .45);
}
/* Portrait motion, three separate transforms so they never overwrite each other:
   __hover  stable (never moves) hover area; its padding reserves room for both
            the float travel and the 1.06 enlargement, so nothing clips or jitters;
   __float  continuous gentle rise and fall (starts on load);
   __zoom   hover enlargement of the photo and its frame as one unit. */
.cgs-profile__hover { padding: 22px 14px 14px; }
.cgs-profile__float {
	--float: -8px;
	animation: cgs-portrait-float 6s ease-in-out infinite;
	will-change: transform;
}
@keyframes cgs-portrait-float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(var(--float)); }
}
.cgs-profile__zoom {
	border-radius: 10px; transform-origin: 50% 50%;
	box-shadow: 0 10px 24px -18px rgba(10, 63, 36, .45);
	transition: transform .35s ease, box-shadow .35s ease;
}
@media (hover: hover) and (pointer: fine) {
	.cgs-profile__hover:hover .cgs-profile__zoom {
		transform: scale(1.06);
		box-shadow: 0 22px 38px -20px rgba(10, 63, 36, .55);
	}
}
.cgs-profile__frame { display: block; }
.cgs-profile__photo {
	display: block; width: 100%; height: auto; /* ratio from the width/height attributes */
	border-radius: 10px; border: 1px solid rgba(13, 86, 49, .1); background: #fff;
}
.cgs-profile__name {
	margin: 8px 0 2px;
	font-family: var(--font-display); font-weight: 700;
	font-size: calc(1.375rem * var(--ts)); line-height: 1.45; color: var(--emerald-900);
}
.cgs-profile__role {
	margin: 0 0 8px; font-size: calc(1rem * var(--ts)); font-weight: 700; line-height: 1.5; color: var(--gold-dark);
}
.cgs-profile__school,
.cgs-profile__place { margin: 0; font-size: calc(.9375rem * var(--ts)); line-height: 1.6; color: var(--ink-2); }
.cgs-profile__place { color: var(--ink-3); }

/* letter */
.cgs-letter {
	min-width: 0; max-width: 52rem;
	padding: clamp(22px, 3.2vw, 44px);
	background: #fff; border: 1px solid rgba(13, 86, 49, .12); border-radius: 14px;
	box-shadow: 0 18px 36px -28px rgba(10, 63, 36, .45);
}
.cgs-letter__body {
	font-size: calc(1.125rem * var(--ts)); line-height: 1.85; color: #1f2d25; text-align: left;
	overflow-wrap: break-word;
}
.cgs-letter__body:lang(en) { line-height: 1.75; }
.cgs-letter__body p { margin: 0 0 1em; }
.cgs-letter__greeting { color: var(--emerald-900); font-weight: 600; }
.cgs-letter__motto {
	margin: 1.4em 0 0; padding: .7em 1em;
	border-left: 3px solid var(--gold); border-radius: 0 8px 8px 0;
	background: #f4f8f3; color: var(--emerald-900); font-weight: 600;
}
.cgs-letter__motto p { margin: 0; }
.cgs-letter__sign {
	display: flex; flex-direction: column; margin-top: 1.6em; padding-top: 1em;
	border-top: 1px solid var(--line-gold);
	font-size: calc(1rem * var(--ts)); line-height: 1.6; color: var(--ink-2);
}
.cgs-letter__sign b,
.cgs-letter__sign .cgs-letter__sign-role { font-size: calc(1.125rem * var(--ts)); font-weight: 700; color: var(--emerald-900); }
@media (prefers-reduced-motion: reduce) {
	.cgs-profile__float { animation: none; }
	.cgs-profile__zoom, .cgs-profile__hover:hover .cgs-profile__zoom { transition: none; transform: none; }
}

@media (max-width: 959.98px) {
	.cgs-letter-page__grid { grid-template-columns: minmax(0, 1fr); }
	.cgs-profile { width: 100%; max-width: 340px; margin-inline: auto; }
	.cgs-profile__zoom { max-width: 280px; margin-inline: auto; }
	.cgs-letter { max-width: none; }
}
@media (max-width: 599.98px) {
	.cgs-letter-page__wrap { padding-inline: 16px; }
	.cgs-letter__body { font-size: calc(1.0625rem * var(--ts)); }
	.cgs-letter { padding: 20px 18px; }
	.cgs-profile__zoom { max-width: 240px; }
	.cgs-profile__float { --float: -5px; }
}

/* ---------- responsive ---------- */
@media (max-width: 1099.98px) {
	.cgs-page__grid { grid-template-columns: 1fr; }
	.cgs-aside { position: static; }
	.cgs-stats__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
	.cgs-banner { margin: 0 var(--gutter); border-radius: 22px; min-height: calc(200px + (var(--ts) - 1) * 60px); box-shadow: var(--shadow); }
	.cgs-banner__in { padding: 28px 22px; }
	.cgs-banner__title { padding-left: 14px; border-left-width: 4px; }
	.cgs-crumbs { background: transparent; border: 0; }
}
@media (max-width: 679.98px) {
	.cgs-secs--aims, .cgs-list--staff, .cgs-list--future { grid-template-columns: 1fr; }
	.cgs-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cgs-stat:first-child { grid-column: 1 / -1; }
	.cgs-lead { padding: 18px 18px 18px 22px; }
	.cgs-sec { padding: 20px 18px 12px; }
	.cgs-prose { line-height: 1.9; }
}