/* =========================================================
 * PRESS 365 — About Page
 * Version: 1.2.0
 * =========================================================
 *
 * Typography aligned with PRESS 365 Core Design System.
 * Existing layout and visual composition preserved.
 * ======================================================= */


/* =========================================================
 * 1. Astra Reset
 * ======================================================= */

body.p365-about-body
#content.site-content {
	width: 100%;
	margin: 0;
	padding: 0;
}


body.p365-about-body
#content.site-content > .ast-container {
	display: block !important;

	width: 100% !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;
}


body.p365-about-body
#primary,
body.p365-about-body
#primary.p365-about-page {
	float: none !important;

	width: 100% !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;
}


body.p365-about-body
.site-main {
	width: 100%;
	max-width: none;

	margin: 0;
	padding: 0;
}


/* =========================================================
 * 2. Page
 * ======================================================= */

.p365-about-page {
	width: 100%;

	margin: 0;
	padding: 0;
}


.p365-about {
	width: 100%;

	padding-top:
		24px;
}


/* =========================================================
 * 3. Hero
 * ======================================================= */

.p365-about-hero__shell {
	position: relative;

	display: grid;

	grid-template-columns:
		minmax(0, 1.45fr)
		minmax(300px, .55fr);

	align-items: stretch;

	min-height:
		480px;

	overflow:
		hidden;

	border-radius:
		var(--p365-radius-lg);

	background:
		linear-gradient(
			125deg,
			#032f33 0%,
			#043b40 58%,
			#075258 100%
		);

	color:
		var(--p365-white);

	box-shadow:
		var(--p365-shadow-sm);
}


/* =========================================================
 * 4. Hero Content
 * ======================================================= */

.p365-about-hero__content {
	position: relative;

	z-index:
		2;

	display: flex;

	flex-direction:
		column;

	justify-content:
		center;

	max-width:
		900px;

	padding:
		64px;
}


.p365-about-hero__label {
	display: inline-flex;

	align-self:
		flex-start;

	margin-bottom:
		18px;

	padding:
		6px 12px;

	border-radius:
		5px;

	background:
		var(--p365-orange);

	color:
		var(--p365-white);

	font-size:
		12px;

	font-weight:
		var(--p365-weight-extrabold);

	line-height:
		1;
}


.p365-about-hero__title {
	margin:
		0 0 20px;

	color:
		var(--p365-white);

	font-size:
		44px;

	font-weight:
		var(--p365-weight-black);

	line-height:
		1.32;

	letter-spacing:
		-.015em;
}


.p365-about-hero__text {
	max-width:
		720px;

	margin:
		0;

	color:
		rgba(255,255,255,.70);

	font-size:
		17px;

	font-weight:
		var(--p365-weight-medium);

	line-height:
		1.9;
}


/* =========================================================
 * 5. Hero Brand
 * ======================================================= */

.p365-about-hero__brand {
	direction:
		ltr;

	position:
		relative;

	z-index:
		2;

	display:
		flex;

	flex-direction:
		column;

	align-items:
		center;

	justify-content:
		center;

	min-width:
		0;

	overflow:
		hidden;

	border-right:
		1px solid rgba(255,255,255,.10);
}


.p365-about-hero__brand::before {
	content:
		"365";

	position:
		absolute;

	right:
		-50px;

	bottom:
		-85px;

	color:
		rgba(255,255,255,.035);

	font-size:
		300px;

	font-weight:
		var(--p365-weight-bold);

	line-height:
		1;
}


.p365-about-hero__brand span {
	position: relative;

	z-index:
		2;

	color:
		var(--p365-white);

	font-size:
		37px;

	font-weight:
		var(--p365-weight-extrabold);

	font-style:
		italic;

	line-height:
		1;
}


.p365-about-hero__brand strong {
	position: relative;

	z-index:
		2;

	margin-top:
		7px;

	padding:
		5px 13px;

	border-radius:
		4px;

	background:
		var(--p365-orange);

	color:
		var(--p365-white);

	font-size:
		43px;

	font-weight:
		var(--p365-weight-black);

	line-height:
		1;
}


.p365-about-hero__brand small {
	position: relative;

	z-index:
		2;

	margin-top:
		13px;

	color:
		rgba(255,255,255,.48);

	font-size:
		9px;

	font-weight:
		var(--p365-weight-bold);

	line-height:
		1.4;

	letter-spacing:
		.18em;
}


/* =========================================================
 * 6. Intro
 * ======================================================= */

.p365-about-intro {
	padding-top:
		24px;
}


.p365-about-intro__grid {
	position: relative;

	display: grid;

	grid-template-columns:
		.7fr 1.3fr;

	align-items:
		center;

	gap:
		60px;

	min-height:
		310px;

	overflow:
		hidden;

	padding:
		48px 54px;

	border:
		1px solid var(--p365-border);

	border-radius:
		var(--p365-radius-lg);

	background:
		var(--p365-white);

	box-shadow:
		var(--p365-shadow-sm);
}


/* =========================================================
 * 7. Intro Heading
 * ======================================================= */

.p365-about-intro__heading {
	position: relative;

	z-index:
		2;
}


.p365-about-intro__heading span,
.p365-about-section-heading > span {
	display: block;

	margin-bottom:
		6px;

	color:
		var(--p365-orange);

	font-size:
		12px;

	font-weight:
		var(--p365-weight-extrabold);

	line-height:
		1.4;
}


.p365-about-intro__heading h2 {
	max-width:
		420px;

	margin:
		0;

	color:
		var(--p365-dark);

	font-size:
		34px;

	font-weight:
		var(--p365-weight-black);

	line-height:
		1.4;
}


/* =========================================================
 * 8. Intro Text
 * ======================================================= */

.p365-about-intro__text {
	position: relative;

	z-index:
		2;
}


.p365-about-intro__text p {
	margin:
		0;

	color:
		var(--p365-text);

	font-size:
		17px;

	font-weight:
		var(--p365-weight-medium);

	line-height:
		2;
}


.p365-about-intro__365 {
	position: absolute;

	left:
		-35px;

	bottom:
		-105px;

	color:
		rgba(3,47,51,.035);

	font-size:
		280px;

	font-weight:
		var(--p365-weight-bold);

	line-height:
		1;

	pointer-events:
		none;
}


/* =========================================================
 * 9. Shared Section Heading
 * ======================================================= */

.p365-about-section-heading {
	position: relative;

	margin-bottom:
		22px;

	padding-right:
		15px;
}


.p365-about-section-heading::before {
	content:
		"";

	position:
		absolute;

	top:
		0;

	right:
		0;

	width:
		4px;

	height:
		48px;

	border-radius:
		4px 0 0 4px;

	background:
		var(--p365-orange);
}


.p365-about-section-heading h2 {
	margin:
		0;

	color:
		var(--p365-dark);

	font-size:
		30px;

	font-weight:
		var(--p365-weight-black);

	line-height:
		1.35;
}


/* =========================================================
 * 10. Coverage
 * ======================================================= */

.p365-about-cover {
	padding-top:
		38px;
}


.p365-about-cover__grid {
	display: grid;

	grid-template-columns:
		repeat(4, minmax(0,1fr));

	overflow:
		hidden;

	border:
		1px solid var(--p365-border);

	border-radius:
		var(--p365-radius-lg);

	background:
		var(--p365-white);

	box-shadow:
		var(--p365-shadow-sm);
}


.p365-about-cover__item {
	position: relative;

	min-width:
		0;

	min-height:
		250px;

	padding:
		30px;

	border-left:
		1px solid var(--p365-border);

	transition:
		background-color var(--p365-transition);
}


.p365-about-cover__item:last-child {
	border-left:
		0;
}


.p365-about-cover__item:hover {
	background:
		#fffaf3;
}


.p365-about-cover__number {
	display: block;

	margin-bottom:
		35px;

	color:
		rgba(3,47,51,.10);

	font-size:
		48px;

	font-weight:
		var(--p365-weight-extrabold);

	line-height:
		1;
}


.p365-about-cover__item h3 {
	margin:
		0 0 9px;

	color:
		var(--p365-dark);

	font-size:
		21px;

	font-weight:
		var(--p365-weight-extrabold);

	line-height:
		1.45;
}


.p365-about-cover__item p {
	margin:
		0;

	color:
		var(--p365-muted);

	font-size:
		13px;

	font-weight:
		var(--p365-weight-medium);

	line-height:
		1.85;
}


/* =========================================================
 * 11. Principles
 * ======================================================= */

.p365-about-principles {
	padding-top:
		24px;
}


.p365-about-principles__shell {
	display: grid;

	grid-template-columns:
		.55fr 1.45fr;

	overflow:
		hidden;

	border-radius:
		var(--p365-radius-lg);

	background:
		var(--p365-dark);

	color:
		var(--p365-white);

	box-shadow:
		var(--p365-shadow-sm);
}


/* =========================================================
 * 12. Principles Header
 * ======================================================= */

.p365-about-principles__header {
	display: flex;

	flex-direction:
		column;

	justify-content:
		center;

	padding:
		45px;
}


.p365-about-principles__header span {
	color:
		var(--p365-orange);

	font-size:
		12px;

	font-weight:
		var(--p365-weight-extrabold);

	line-height:
		1.4;
}


.p365-about-principles__header h2 {
	margin:
		8px 0 0;

	color:
		var(--p365-white);

	font-size:
		32px;

	font-weight:
		var(--p365-weight-black);

	line-height:
		1.4;
}


/* =========================================================
 * 13. Principles Grid
 * ======================================================= */

.p365-about-principles__grid {
	display: grid;

	grid-template-columns:
		repeat(2,minmax(0,1fr));

	border-right:
		1px solid rgba(255,255,255,.10);
}


.p365-about-principles__item {
	display: grid;

	grid-template-columns:
		8px minmax(0, 1fr);

	grid-template-rows:
		auto auto;

	column-gap:
		11px;

	align-content:
		center;

	min-width:
		0;

	min-height:
		190px;

	padding:
		30px;

	border-left:
		1px solid rgba(255,255,255,.09);

	border-bottom:
		1px solid rgba(255,255,255,.09);
}


.p365-about-principles__item > span {
	grid-column:
		1;

	grid-row:
		1;

	display: block;

	width:
		8px;

	height:
		8px;

	margin-top:
		9px;

	border-radius:
		50%;

	background:
		var(--p365-orange);
}


.p365-about-principles__item h3 {
	grid-column:
		2;

	grid-row:
		1;

	margin:
		0 0 7px;

	color:
		var(--p365-white);

	font-size:
		19px;

	font-weight:
		var(--p365-weight-extrabold);

	line-height:
		1.45;
}


.p365-about-principles__item p {
	grid-column:
		2;

	grid-row:
		2;

	margin:
		0;

	color:
		rgba(255,255,255,.57);

	font-size:
		13px;

	font-weight:
		var(--p365-weight-regular);

	line-height:
		1.8;
}


/* =========================================================
 * 14. Mission
 * ======================================================= */

.p365-about-mission {
	padding-top:
		24px;
}


.p365-about-mission__shell {
	position: relative;

	display: flex;

	align-items:
		center;

	min-height:
		320px;

	overflow:
		hidden;

	padding:
		50px 60px;

	border-radius:
		var(--p365-radius-lg);

	background:
		linear-gradient(
			120deg,
			#075258,
			#043a3e
		);

	color:
		var(--p365-white);

	box-shadow:
		var(--p365-shadow-sm);
}


.p365-about-mission__mark {
	position: absolute;

	left:
		-20px;

	bottom:
		-95px;

	color:
		rgba(255,255,255,.045);

	font-size:
		300px;

	font-weight:
		var(--p365-weight-bold);

	line-height:
		1;

	pointer-events:
		none;
}


.p365-about-mission__content {
	position: relative;

	z-index:
		2;

	max-width:
		900px;
}


.p365-about-mission__content > span {
	color:
		var(--p365-orange);

	font-size:
		12px;

	font-weight:
		var(--p365-weight-extrabold);

	line-height:
		1.4;
}


.p365-about-mission__content h2 {
	margin:
		8px 0 15px;

	color:
		var(--p365-white);

	font-size:
		34px;

	font-weight:
		var(--p365-weight-black);

	line-height:
		1.45;
}


.p365-about-mission__content p {
	max-width:
		760px;

	margin:
		0;

	color:
		rgba(255,255,255,.67);

	font-size:
		15px;

	font-weight:
		var(--p365-weight-medium);

	line-height:
		1.9;
}


/* =========================================================
 * 15. CTA
 * ======================================================= */

.p365-about-cta {
	padding:
		24px 0 32px;
}


.p365-about-cta__shell {
	display: flex;

	align-items:
		center;

	justify-content:
		space-between;

	gap:
		30px;

	padding:
		30px 34px;

	border:
		1px solid var(--p365-border);

	border-radius:
		var(--p365-radius-lg);

	background:
		var(--p365-white);

	box-shadow:
		var(--p365-shadow-sm);
}


.p365-about-cta__shell > div > span {
	color:
		var(--p365-orange);

	font-size:
		11px;

	font-weight:
		var(--p365-weight-extrabold);

	line-height:
		1.4;
}


.p365-about-cta__shell h2 {
	margin:
		4px 0 0;

	color:
		var(--p365-dark);

	font-size:
		26px;

	font-weight:
		var(--p365-weight-black);

	line-height:
		1.4;
}


.p365-about-cta__button {
	display: inline-flex;

	align-items:
		center;

	gap:
		10px;

	min-height:
		46px;

	padding:
		10px 20px;

	border-radius:
		7px;

	background:
		var(--p365-orange);

	color:
		var(--p365-white);

	font-size:
		13px;

	font-weight:
		var(--p365-weight-extrabold);

	line-height:
		1.4;

	white-space:
		nowrap;

	transition:
		background-color var(--p365-transition),
		transform var(--p365-transition);
}


.p365-about-cta__button:hover {
	background:
		var(--p365-orange-dark);

	color:
		var(--p365-white);

	transform:
		translateX(-3px);
}


/* =========================================================
 * 16. Tablet
 * ======================================================= */

@media (max-width: 1000px) {

	.p365-about-hero__shell {
		grid-template-columns:
			minmax(0,1fr)
			280px;
	}


	.p365-about-hero__content {
		padding:
			45px;
	}


	.p365-about-hero__title {
		font-size:
			38px;
	}


	.p365-about-intro__grid {
		gap:
			35px;

		padding:
			40px;
	}


	.p365-about-intro__heading h2 {
		font-size:
			30px;
	}


	.p365-about-cover__grid {
		grid-template-columns:
			repeat(2,1fr);
	}


	.p365-about-cover__item:nth-child(2) {
		border-left:
			0;
	}


	.p365-about-cover__item:nth-child(-n + 2) {
		border-bottom:
			1px solid var(--p365-border);
	}


	.p365-about-principles__shell {
		grid-template-columns:
			1fr;
	}


	.p365-about-principles__grid {
		border-top:
			1px solid rgba(255,255,255,.10);

		border-right:
			0;
	}


	.p365-about-mission__content h2 {
		font-size:
			32px;
	}
}


/* =========================================================
 * 17. Mobile
 * ======================================================= */

@media (max-width: 700px) {

	.p365-about {
		padding-top:
			18px;
	}


	/* Hero */

	.p365-about-hero__shell {
		display:
			block;

		min-height:
			0;
	}


	.p365-about-hero__content {
		padding:
			38px 24px;
	}


	.p365-about-hero__label {
		font-size:
			11px;
	}


	.p365-about-hero__title {
		font-size:
			32px;

		font-weight:
			var(--p365-weight-black);

		line-height:
			1.4;
	}


	.p365-about-hero__text {
		font-size:
			15px;

		font-weight:
			var(--p365-weight-medium);

		line-height:
			1.85;
	}


	.p365-about-hero__brand {
		min-height:
			210px;

		border-top:
			1px solid rgba(255,255,255,.10);

		border-right:
			0;
	}


	/* Intro */

	.p365-about-intro__grid {
		display:
			block;

		min-height:
			0;

		padding:
			30px 24px;
	}


	.p365-about-intro__heading {
		margin-bottom:
			20px;
	}


	.p365-about-intro__heading h2 {
		font-size:
			28px;

		font-weight:
			var(--p365-weight-black);
	}


	.p365-about-intro__text p {
		font-size:
			16px;

		font-weight:
			var(--p365-weight-medium);

		line-height:
			1.95;
	}


	/* Shared Heading */

	.p365-about-section-heading h2 {
		font-size:
			28px;
	}


	/* Coverage */

	.p365-about-cover {
		padding-top:
			30px;
	}


	.p365-about-cover__grid {
		grid-template-columns:
			1fr;
	}


	.p365-about-cover__item,
	.p365-about-cover__item:nth-child(2) {
		min-height:
			190px;

		border-left:
			0;

		border-bottom:
			1px solid var(--p365-border);
	}


	.p365-about-cover__item:last-child {
		border-bottom:
			0;
	}


	.p365-about-cover__number {
		margin-bottom:
			25px;
	}


	.p365-about-cover__item h3 {
		font-size:
			19px;
	}


	/* Principles */

	.p365-about-principles__header {
		padding:
			32px 24px;
	}


	.p365-about-principles__header h2 {
		font-size:
			28px;

		font-weight:
			var(--p365-weight-black);
	}


	.p365-about-principles__grid {
		grid-template-columns:
			1fr;
	}


	.p365-about-principles__item {
		min-height:
			155px;

		border-left:
			0;
	}


	.p365-about-principles__item h3 {
		font-size:
			18px;
	}


	/* Mission */

	.p365-about-mission__shell {
		min-height:
			280px;

		padding:
			35px 24px;
	}


	.p365-about-mission__content h2 {
		font-size:
			28px;

		font-weight:
			var(--p365-weight-black);

		line-height:
			1.45;
	}


	.p365-about-mission__content p {
		font-size:
			14px;
	}


	/* CTA */

	.p365-about-cta__shell {
		align-items:
			flex-start;

		flex-direction:
			column;

		padding:
			24px;
	}


	.p365-about-cta__shell h2 {
		font-size:
			23px;

		font-weight:
			var(--p365-weight-black);
	}
}


/* =========================================================
 * 18. Small Mobile
 * ======================================================= */

@media (max-width: 480px) {

	.p365-about-hero__content {
		padding:
			32px 20px;
	}


	.p365-about-hero__title {
		font-size:
			30px;
	}


	.p365-about-hero__brand {
		min-height:
			180px;
	}


	.p365-about-hero__brand span {
		font-size:
			31px;
	}


	.p365-about-hero__brand strong {
		font-size:
			36px;
	}


	.p365-about-hero__brand small {
		font-size:
			8px;
	}


	.p365-about-intro__grid {
		padding:
			26px 20px;
	}


	.p365-about-intro__heading h2 {
		font-size:
			26px;
	}


	.p365-about-intro__text p {
		font-size:
			15px;
	}


	.p365-about-section-heading h2 {
		font-size:
			26px;
	}


	.p365-about-cover__item {
		padding:
			25px 22px;
	}


	.p365-about-cover__number {
		font-size:
			42px;
	}


	.p365-about-cover__item h3 {
		font-size:
			18px;
	}


	.p365-about-cover__item p {
		font-size:
			12px;
	}


	.p365-about-principles__header h2 {
		font-size:
			26px;
	}


	.p365-about-principles__item h3 {
		font-size:
			17px;
	}


	.p365-about-principles__item p {
		font-size:
			12px;
	}


	.p365-about-mission__shell {
		padding:
			30px 20px;
	}


	.p365-about-mission__content h2 {
		font-size:
			26px;
	}


	.p365-about-mission__content p {
		font-size:
			14px;
	}


	.p365-about-cta__shell {
		padding:
			22px 20px;
	}


	.p365-about-cta__shell h2 {
		font-size:
			21px;
	}


	.p365-about-cta__button {
		font-size:
			12px;
	}
}