/*
 * Page #12 — About Ranama
 * Visual implementation V1: The Operating Continuum / Proof Before Promise.
 * Everything in this file is scoped to the code-controlled Page #12 route.
 */

body.ranama-page-12-body {
	background: #edf1f4;
}

.ranama-p12,
.ranama-p12 * {
	box-sizing: border-box;
}

.ranama-p12 {
	--p12-blue: #223f99;
	--p12-green: #406d5a;
	--p12-amber: #d99a2b;
	--p12-navy: #2b3e5b;
	--p12-mist: #edf1f4;
	--p12-white: #fff;
	--p12-slate: #6c7f91;
	--p12-steel: #a9b2bc;
	--p12-ink: #17263b;
	--p12-line: rgba(43, 62, 91, 0.2);
	--p12-shell: min(1480px, calc(100vw - clamp(2.5rem, 7vw, 8rem)));
	background: var(--p12-mist);
	color: var(--p12-navy);
	font-family: "Noto Sans", Arial, sans-serif;
	font-size: 16px;
	line-height: 1.62;
	overflow: clip;
}

.ranama-p12 section,
.ranama-p12 article {
	position: relative;
}

.ranama-p12 [id] {
	scroll-margin-top: 6rem;
}

.ranama-p12 h1,
.ranama-p12 h2,
.ranama-p12 h3,
.ranama-p12 p,
.ranama-p12 figure,
.ranama-p12 blockquote,
.ranama-p12 ul,
.ranama-p12 ol,
.ranama-p12 dl,
.ranama-p12 dd {
	margin: 0;
}

.ranama-p12 h1,
.ranama-p12 h2,
.ranama-p12 h3 {
	font-family: "Archivo", Arial, sans-serif;
	font-weight: 600;
	letter-spacing: -0.045em;
	line-height: 0.96;
}

.ranama-p12 h1 em,
.ranama-p12 h2 em {
	font-style: normal;
	font-weight: 500;
}

.ranama-p12 img {
	display: block;
	max-width: 100%;
}

.ranama-p12 a {
	color: inherit;
	text-decoration: none;
}

.ranama-p12 a:focus-visible,
.ranama-p12 summary:focus-visible {
	outline: 2px solid var(--p12-amber);
	outline-offset: 5px;
}

.ranama-p12-shell {
	margin-inline: auto;
	width: var(--p12-shell);
}

.ranama-p12-kicker,
.ranama-p12-eyebrow,
.ranama-p12-breadcrumb {
	align-items: center;
	display: flex;
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.69rem;
	font-weight: 600;
	gap: 0.8rem;
	letter-spacing: 0.11em;
	line-height: 1.35;
	text-transform: uppercase;
}

.ranama-p12-kicker > span {
	align-items: center;
	background: var(--p12-amber);
	color: var(--p12-ink);
	display: inline-flex;
	font-size: 0.61rem;
	height: 1.55rem;
	justify-content: center;
	letter-spacing: 0;
	min-width: 1.8rem;
	padding-inline: 0.35rem;
}

.ranama-p12-kicker--light {
	color: rgba(255, 255, 255, 0.78);
}

.ranama-p12-actions {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 1.25rem 1.75rem;
}

.ranama-p12-button {
	align-items: center;
	display: inline-flex;
	font-family: "Noto Sans", Arial, sans-serif;
	font-size: 0.72rem;
	font-weight: 700;
	gap: 2.2rem;
	justify-content: space-between;
	letter-spacing: 0.075em;
	line-height: 1.25;
	min-height: 4rem;
	padding: 0.75rem 1.35rem;
	text-transform: uppercase;
	transition: background-color 220ms ease, color 220ms ease, transform 220ms ease;
}

.ranama-p12-button:hover {
	transform: translateY(-2px);
}

.ranama-p12-button--blue {
	background: var(--p12-blue);
	color: var(--p12-white) !important;
}

.ranama-p12-button--blue:hover {
	background: var(--p12-navy);
}

.ranama-p12-button--amber {
	background: var(--p12-amber);
	color: var(--p12-ink) !important;
}

.ranama-p12-button--amber:hover {
	background: var(--p12-white);
}

.ranama-p12-button--outline {
	border: 1px solid rgba(255, 255, 255, 0.55);
	color: var(--p12-white) !important;
}

.ranama-p12-button--outline:hover {
	background: var(--p12-white);
	color: var(--p12-navy) !important;
}

.ranama-p12-text-link {
	align-items: center;
	border-bottom: 1px solid currentColor;
	display: inline-flex;
	font-size: 0.75rem;
	font-weight: 700;
	gap: 2rem;
	justify-content: space-between;
	letter-spacing: 0.055em;
	line-height: 1.35;
	padding-block: 0.55rem;
	text-transform: uppercase;
	transition: color 180ms ease, gap 180ms ease;
}

.ranama-p12-text-link:hover {
	color: var(--p12-blue);
	gap: 2.5rem;
}

.ranama-p12-text-link--light {
	color: var(--p12-white) !important;
}

.ranama-p12-text-link--light:hover {
	color: var(--p12-amber) !important;
}

.ranama-p12-continuum-line {
	align-items: center;
	display: flex;
	left: 0;
	position: absolute;
	top: 3rem;
	width: calc((100vw - var(--p12-shell)) / 2 + 36%);
	z-index: 4;
}

.ranama-p12-continuum-line i {
	background: var(--p12-navy);
	height: 1px;
	width: 100%;
}

.ranama-p12-continuum-line span {
	background: var(--p12-amber);
	color: var(--p12-ink);
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.57rem;
	font-style: normal;
	font-weight: 600;
	letter-spacing: 0.1em;
	padding: 0.7rem 0.9rem;
	text-transform: uppercase;
	white-space: nowrap;
}

.ranama-p12-continuum-line--light i {
	background: rgba(255, 255, 255, 0.42);
}

/* Hero — the verified founding point opens a continuing operating field. */
.ranama-p12-hero {
	background: var(--p12-mist);
}

.ranama-p12-hero__stage {
	background: var(--p12-ink);
	color: var(--p12-white);
	min-height: min(1030px, 100svh);
	overflow: hidden;
	position: relative;
}

.ranama-p12-hero__stage::before {
	background-image: linear-gradient(rgba(255, 255, 255, 0.055) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px);
	background-size: 8rem 8rem;
	content: "";
	inset: 0;
	position: absolute;
}

.ranama-p12-hero__media {
	height: 72%;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 0;
	width: 63%;
}

.ranama-p12-hero__media::after {
	background: linear-gradient(90deg, var(--p12-ink) 0%, rgba(23, 38, 59, 0.72) 21%, rgba(23, 38, 59, 0.08) 62%), linear-gradient(0deg, var(--p12-ink) 0%, transparent 45%);
	content: "";
	inset: 0;
	position: absolute;
}

.ranama-p12-hero__media img {
	height: 100%;
	object-fit: cover;
	object-position: 52% 50%;
	width: 100%;
}

.ranama-p12-hero__wash {
	background: var(--p12-blue);
	bottom: 0;
	clip-path: polygon(0 58%, 100% 25%, 100% 100%, 0 100%);
	height: 31%;
	op: auto;
	left: 0;
	opacity: 0.32;
	position: absolute;
	width: 100%;
}

.ranama-p12-hero__top {
	display: flex;
	justify-content: flex-start;
	padding-top: clamp(8rem, 12vh, 11rem);
	position: relative;
	z-index: 4;
}

.ranama-p12-breadcrumb {
	color: rgba(255, 255, 255, 0.68);
}

.ranama-p12-breadcrumb a:hover {
	color: var(--p12-amber);
}

.ranama-p12-hero__founding {
	background: var(--p12-amber);
	color: var(--p12-ink);
	padding: 1.65rem 1.5rem 1.85rem;
	position: absolute;
	right: calc((100vw - var(--p12-shell)) / 2);
	top: clamp(12rem, 24vh, 16rem);
	width: clamp(15rem, 21vw, 23rem);
	z-index: 5;
}

.ranama-p12-hero__founding p {
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.6rem;
	font-weight: 600;
	letter-spacing: 0.11em;
	text-transform: uppercase;
}

.ranama-p12-hero__founding strong {
	display: block;
	font-family: "Archivo", Arial, sans-serif;
	font-size: clamp(3.7rem, 5.6vw, 6.6rem);
	font-weight: 600;
	letter-spacing: -0.06em;
	line-height: 0.78;
	margin-top: 0;
}

.ranama-p12-hero__founding strong span {
	display: block;
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	margin-bottom: 1.3rem;
	text-transform: uppercase;
}

.ranama-p12-hero__title {
	bottom: clamp(7rem, 10vh, 9rem);
	left: calc((100vw - var(--p12-shell)) / 2);
	margin-inline: 0;
	position: absolute;
	width: var(--p12-shell);
	z-index: 4;
}

.ranama-p12-eyebrow {
	color: var(--p12-amber);
	margin-bottom: 1.4rem !important;
}

.ranama-p12-hero h1 {
	font-size: clamp(4.6rem, 8.5vw, 10rem);
	max-width: 10.7em;
}

.ranama-p12-hero h1 span,
.ranama-p12-hero h1 em {
	display: block;
}

.ranama-p12-hero h1 em {
	color: var(--p12-amber);
	margin-left: 11%;
}

.ranama-p12-hero__rail {
	align-items: center;
	bottom: 0;
	display: flex;
	flex-direction: column;
	left: calc((100vw - var(--p12-shell)) / 2 + 1.2rem);
	position: absolute;
	width: 2px;
	z-index: 5;
}

.ranama-p12-hero__rail i {
	background: var(--p12-amber);
	flex: 0 0 clamp(2.5rem, 4vh, 4rem);
	height: clamp(2.5rem, 4vh, 4rem);
	width: 2px;
}

.ranama-p12-hero__rail span {
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.58rem;
	letter-spacing: 0.1em;
	line-height: 1;
	padding-top: 0.65rem;
	writing-mode: vertical-rl;
}

.ranama-p12-hero__introduction {
	padding: clamp(6rem, 10vw, 10rem) 0 clamp(5rem, 8vw, 8rem);
	position: relative;
}

.ranama-p12-hero__introduction::before {
	background: var(--p12-amber);
	content: "";
	height: 8rem;
	left: calc((100vw - var(--p12-shell)) / 2 + 1.2rem);
	position: absolute;
	top: 0;
	width: 2px;
}

.ranama-p12-hero__intro-grid {
	display: grid;
	gap: clamp(4rem, 9vw, 10rem);
	grid-template-columns: 0.82fr 1.18fr;
}

.ranama-p12-hero__lead {
	font-family: "Archivo", Arial, sans-serif;
	font-size: clamp(2rem, 3vw, 3.6rem);
	font-weight: 500;
	letter-spacing: -0.045em;
	line-height: 1.04;
}

.ranama-p12-hero__copy {
	font-size: clamp(1rem, 1.2vw, 1.18rem);
	max-width: 45rem;
}

.ranama-p12-hero__copy > p + p {
	margin-top: 1.35rem;
}

.ranama-p12-hero__copy .ranama-p12-actions {
	margin-top: 2.5rem;
}

.ranama-p12-hero__proof {
	border-bottom: 1px solid var(--p12-line);
	border-top: 1px solid var(--p12-line);
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin-top: clamp(5rem, 8vw, 8rem);
}

.ranama-p12-hero__proof p {
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.07em;
	padding: 1.6rem 1.8rem;
	text-transform: uppercase;
}

.ranama-p12-hero__proof p + p {
	border-left: 1px solid var(--p12-line);
}

.ranama-p12-hero__proof span {
	color: var(--p12-amber);
	margin-right: 1rem;
}

/* Movement one — focus, founding and undated evolution. */
.ranama-p12-foundation {
	background: var(--p12-white);
	padding: clamp(11rem, 15vw, 16rem) 0 0;
}

.ranama-p12-foundation__focus {
	display: grid;
	gap: clamp(4rem, 9vw, 10rem);
	grid-template-columns: 1.32fr 0.68fr;
}

.ranama-p12-heading h2,
.ranama-p12-evolution__heading h2,
.ranama-p12-values__heading h2 {
	font-size: clamp(3.5rem, 6.5vw, 7.5rem);
	margin-top: 2rem;
}

.ranama-p12-heading h2 em,
.ranama-p12-evolution__heading h2 em,
.ranama-p12-values__heading h2 em {
	color: var(--p12-blue);
	display: block;
}

.ranama-p12-foundation__focus-copy {
	align-self: end;
	border-top: 1px solid var(--p12-line);
	padding-top: 1.7rem;
}

.ranama-p12-foundation__focus-copy .ranama-p12-lead {
	font-size: 1.25rem;
	font-weight: 700;
}

.ranama-p12-foundation__focus-copy p + p {
	margin-top: 1.2rem;
}

.ranama-p12-lifecycle {
	margin-top: clamp(5rem, 9vw, 9rem);
	position: relative;
}

.ranama-p12-lifecycle__line {
	background: rgba(43, 62, 91, 0.16);
	height: 1px;
	left: 0;
	position: absolute;
	top: 2.35rem;
	width: 100%;
}

.ranama-p12-lifecycle__line i {
	background: var(--p12-amber);
	display: block;
	height: 3px;
	transform-origin: left;
	width: 100%;
}

.ranama-p12-lifecycle ol {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	list-style: none;
	padding: 0;
	position: relative;
}

.ranama-p12-lifecycle li {
	border-left: 1px solid var(--p12-line);
	min-height: 11rem;
	padding: 0 1.2rem 1.5rem;
}

.ranama-p12-lifecycle li:last-child {
	border-right: 1px solid var(--p12-line);
}

.ranama-p12-lifecycle li span {
	align-items: center;
	background: var(--p12-navy);
	color: var(--p12-white);
	display: flex;
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.6rem;
	height: 1.8rem;
	justify-content: center;
	margin-bottom: 4.5rem;
	position: relative;
	width: 2.1rem;
	z-index: 2;
}

.ranama-p12-lifecycle li strong {
	font-family: "Archivo", Arial, sans-serif;
	font-size: clamp(1.1rem, 1.5vw, 1.55rem);
	letter-spacing: -0.03em;
	line-height: 1.05;
}

.ranama-p12-focus-close {
	display: grid;
	gap: clamp(4rem, 10vw, 12rem);
	grid-template-columns: 1fr 1fr;
	margin-top: clamp(4rem, 7vw, 7rem);
	padding-bottom: clamp(8rem, 12vw, 13rem);
}

.ranama-p12-focus-close > p {
	border-left: 3px solid var(--p12-amber);
	font-family: "Archivo", Arial, sans-serif;
	font-size: clamp(1.7rem, 2.6vw, 3rem);
	font-weight: 600;
	letter-spacing: -0.04em;
	line-height: 1.05;
	padding-left: 1.5rem;
}

.ranama-p12-focus-close > div > p {
	max-width: 37rem;
}

.ranama-p12-focus-close .ranama-p12-button {
	margin-top: 2.5rem;
}

.ranama-p12-heritage {
	background: var(--p12-navy);
	color: var(--p12-white);
	display: grid;
	grid-template-columns: 0.95fr 0.22fr 0.83fr;
	min-height: 58rem;
}

.ranama-p12-heritage__media {
	min-height: 42rem;
	overflow: hidden;
	position: relative;
}

.ranama-p12-heritage__media::after {
	background: linear-gradient(0deg, rgba(23, 38, 59, 0.75), transparent 50%);
	content: "";
	inset: 0;
	position: absolute;
}

.ranama-p12-heritage__media img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.ranama-p12-heritage__media > p {
	bottom: 2rem;
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.58rem;
	left: 2rem;
	letter-spacing: 0.1em;
	position: absolute;
	text-transform: uppercase;
	z-index: 2;
}

.ranama-p12-heritage__media > p span {
	color: var(--p12-amber);
	display: block;
	margin-bottom: 0.35rem;
}

.ranama-p12-heritage__date {
	align-items: center;
	background: var(--p12-amber);
	color: var(--p12-ink);
	display: flex;
	flex-direction: column;
	gap: clamp(2rem, 3.5vw, 4rem);
	justify-content: center;
	overflow: hidden;
	padding: 3rem 0;
}

.ranama-p12-heritage__date span {
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.62rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.ranama-p12-heritage__date strong {
	font-family: "Archivo", Arial, sans-serif;
	font-size: clamp(5.5rem, 8.5vw, 10rem);
	letter-spacing: -0.08em;
	line-height: 0.75;
	text-orientation: mixed;
	writing-mode: vertical-rl;
}

.ranama-p12-heritage__content {
	align-self: center;
	padding: clamp(4rem, 7vw, 8rem);
}

.ranama-p12-heritage__content h2 {
	font-size: clamp(3rem, 4.5vw, 5.6rem);
	margin: 2rem 0 3rem;
}

.ranama-p12-heritage__content h2 em {
	color: var(--p12-amber);
	display: block;
}

.ranama-p12-heritage__content > p:not(.ranama-p12-kicker) {
	color: rgba(255, 255, 255, 0.78);
	max-width: 39rem;
}

.ranama-p12-heritage__content > p + p {
	margin-top: 1.1rem;
}

.ranama-p12-heritage__content blockquote {
	border-top: 1px solid rgba(255, 255, 255, 0.34);
	color: var(--p12-amber);
	font-family: "Archivo", Arial, sans-serif;
	font-size: clamp(1.7rem, 2.7vw, 3rem);
	font-weight: 600;
	letter-spacing: -0.04em;
	line-height: 1.02;
	margin-top: 3rem;
	padding-top: 1.5rem;
}

.ranama-p12-evolution {
	background: var(--p12-mist);
	padding: clamp(10rem, 15vw, 16rem) 0 clamp(9rem, 14vw, 15rem);
}

.ranama-p12-evolution__heading {
	display: grid;
	gap: 2rem clamp(4rem, 10vw, 12rem);
	grid-template-columns: 1.15fr 0.85fr;
}

.ranama-p12-evolution__heading .ranama-p12-kicker,
.ranama-p12-evolution__heading h2 {
	grid-column: 1;
}

.ranama-p12-evolution__intro {
	align-self: end;
	border-top: 1px solid var(--p12-line);
	grid-column: 2;
	grid-row: 1 / span 2;
	padding-top: 1.6rem;
}

.ranama-p12-evolution__intro p + p {
	margin-top: 1rem;
}

.ranama-p12-evolution__path {
	margin-top: clamp(7rem, 11vw, 12rem);
	position: relative;
}

.ranama-p12-evolution__spine {
	bottom: 0;
	left: 50%;
	position: absolute;
	top: 0;
	width: 1px;
}

.ranama-p12-evolution__spine i {
	background: var(--p12-amber);
	display: block;
	height: 100%;
	transform-origin: top;
	width: 2px;
}

.ranama-p12-evolution__spine span {
	background: var(--p12-mist);
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.56rem;
	left: 0;
	letter-spacing: 0.1em;
	padding: 0.8rem 0.45rem;
	position: absolute;
	top: 50%;
	transform: rotate(90deg) translate(-50%, -50%);
	transform-origin: left top;
	text-transform: uppercase;
	white-space: nowrap;
}

.ranama-p12-evolution__path ol {
	list-style: none;
	padding: 0;
}

.ranama-p12-evolution__path li {
	align-items: start;
	border-top: 1px solid var(--p12-line);
	display: grid;
	gap: 2rem;
	grid-template-columns: auto 1fr;
	min-height: 14rem;
	padding: 2rem 2rem 3rem 0;
	position: relative;
	width: 43%;
}

.ranama-p12-evolution__path li:nth-child(even) {
	margin-left: 57%;
	padding-left: 2rem;
	padding-right: 0;
}

.ranama-p12-evolution__path li::after {
	background: var(--p12-navy);
	border: 5px solid var(--p12-mist);
	border-radius: 50%;
	content: "";
	height: 0.95rem;
	position: absolute;
	right: calc(-16.28% - 0.54rem);
	top: -0.5rem;
	width: 0.95rem;
}

.ranama-p12-evolution__path li:nth-child(even)::after {
	left: calc(-16.28% - 0.48rem);
	right: auto;
}

.ranama-p12-evolution__path li > span {
	color: var(--p12-amber);
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.68rem;
	font-weight: 600;
}

.ranama-p12-evolution__path h3 {
	font-size: clamp(1.9rem, 3vw, 3.4rem);
}

.ranama-p12-evolution__path p {
	margin-top: 1.1rem;
	max-width: 33rem;
}

.ranama-p12-evolution__path li:last-child h3 {
	color: var(--p12-blue);
}

/* Movement two — current capability, physical operation and qualified reach. */
.ranama-p12-present {
	background: var(--p12-ink);
	color: var(--p12-white);
	padding: clamp(11rem, 15vw, 16rem) 0 0;
}

.ranama-p12-present__heading {
	display: grid;
	gap: clamp(4rem, 9vw, 10rem);
	grid-template-columns: 1.3fr 0.7fr;
}

.ranama-p12-present .ranama-p12-heading h2 {
	font-size: clamp(4rem, 7.3vw, 8.5rem);
}

.ranama-p12-present .ranama-p12-heading h2 em {
	color: var(--p12-amber);
}

.ranama-p12-present__copy {
	align-self: end;
	border-top: 1px solid rgba(255, 255, 255, 0.32);
	color: rgba(255, 255, 255, 0.76);
	padding-top: 1.6rem;
}

.ranama-p12-present__copy p + p {
	margin-top: 1.2rem;
}

.ranama-p12-format-field {
	display: block;
	margin-top: clamp(6rem, 10vw, 10rem);
}

.ranama-p12-format-field__images {
	background: var(--p12-white);
	isolation: isolate;
	min-height: clamp(40rem, 52vw, 58rem);
	overflow: hidden;
	position: relative;
}

.ranama-p12-format-field__images figure {
	bottom: 2%;
	height: 66%;
	left: 1%;
	position: absolute;
	width: 19%;
	z-index: 1;
}

.ranama-p12-format-field__images img {
	height: 100%;
	max-width: 100%;
	object-fit: contain;
	object-position: center bottom;
	width: 100%;
}

.ranama-p12-format-field__images figure:nth-child(2) {
	bottom: auto;
	height: 70%;
	left: 20%;
	top: 5%;
}

.ranama-p12-format-field__images figure:nth-child(3) {
	bottom: auto;
	height: 92%;
	left: 39%;
	top: 2%;
	width: 24%;
	z-index: 2;
}

.ranama-p12-format-field__images figure:nth-child(4) {
	bottom: auto;
	height: 63%;
	left: 63%;
	top: 7%;
	width: 17%;
}

.ranama-p12-format-field__images figure:nth-child(5) {
	height: 68%;
	left: 80%;
	right: auto;
	width: 19%;
}

.ranama-p12-format-field__register {
	background: var(--p12-blue);
	display: grid;
	gap: 0 clamp(3rem, 7vw, 8rem);
	grid-template-columns: 0.5fr 1.5fr;
	padding: clamp(3rem, 5vw, 6rem);
}

.ranama-p12-format-field__register > p {
	color: var(--p12-amber);
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.65rem;
	font-weight: 600;
	letter-spacing: 0.11em;
	text-transform: uppercase;
}

.ranama-p12-format-field__register ul {
	display: grid;
	gap: 0 2rem;
	grid-template-columns: repeat(3, 1fr);
	list-style: none;
	margin-top: 0;
	padding: 0;
}

.ranama-p12-format-field__register li {
	border-top: 1px solid rgba(255, 255, 255, 0.27);
	font-family: "Archivo", Arial, sans-serif;
	font-size: clamp(1.1rem, 1.45vw, 1.65rem);
	font-weight: 600;
	letter-spacing: -0.025em;
	line-height: 1.1;
	padding: 1.2rem 0;
	white-space: nowrap;
}

.ranama-p12-format-field__register li span {
	color: var(--p12-amber);
	display: inline-block;
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.6rem;
	letter-spacing: 0;
	margin-right: 1rem;
	width: 1.6rem;
}

.ranama-p12-format-field__register .ranama-p12-actions {
	grid-column: 2;
	margin-top: 3rem;
}

.ranama-p12-plants {
	display: grid;
	grid-template-columns: 0.86fr 1fr 0.86fr;
	min-height: 52rem;
}

.ranama-p12-plants__media {
	min-height: 44rem;
	overflow: hidden;
}

.ranama-p12-plants__media img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.ranama-p12-plants__media--one img {
	object-position: 48% center;
}

.ranama-p12-plants__media--two img {
	object-position: 58% center;
}

.ranama-p12-plants__core {
	align-items: start;
	background: var(--p12-green);
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(3rem, 5vw, 6rem);
}

.ranama-p12-plants__core h2 {
	font-size: clamp(3.2rem, 5vw, 6rem);
	margin: 2rem 0 2.5rem;
}

.ranama-p12-plants__core h2 em {
	color: var(--p12-amber);
	display: block;
}

.ranama-p12-plants__core > p {
	color: rgba(255, 255, 255, 0.78);
}

.ranama-p12-plants__core ol {
	list-style: none;
	margin: 2.5rem 0;
	padding: 0;
	width: 100%;
}

.ranama-p12-plants__core li {
	border-bottom: 1px solid rgba(255, 255, 255, 0.34);
	border-top: 1px solid rgba(255, 255, 255, 0.34);
	padding: 1.5rem 0;
}

.ranama-p12-plants__core li + li {
	border-top: 0;
}

.ranama-p12-plants__core li span {
	color: var(--p12-amber);
	display: block;
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.58rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.ranama-p12-plants__core li strong {
	display: block;
	font-family: "Archivo", Arial, sans-serif;
	font-size: clamp(1.8rem, 2.6vw, 3rem);
	letter-spacing: -0.04em;
	line-height: 1;
	margin-top: 0.5rem;
}

.ranama-p12-plants__caption {
	background: var(--p12-amber);
	color: var(--p12-ink);
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.62rem;
	font-weight: 600;
	grid-column: 1 / -1;
	letter-spacing: 0.075em;
	padding: 1rem calc((100vw - var(--p12-shell)) / 2);
	text-transform: uppercase;
}

.ranama-p12-reach {
	background: var(--p12-navy);
	padding: clamp(9rem, 14vw, 15rem) 0;
}

.ranama-p12-reach__inner {
	display: grid;
	gap: clamp(5rem, 12vw, 14rem);
	grid-template-columns: 0.82fr 1.18fr;
}

.ranama-p12-reach__origin {
	align-items: flex-start;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 34rem;
	position: relative;
}

.ranama-p12-reach__origin::before {
	background: url("/wp-content/uploads/2026/09/Malaysia-Map-Outline.png") center / contain no-repeat;
	content: "";
	inset: -3rem -6rem;
	opacity: 0.24;
	pointer-events: none;
	position: absolute;
}

.ranama-p12-reach__origin span {
	color: var(--p12-amber);
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.64rem;
	letter-spacing: 0.11em;
	position: relative;
	text-transform: uppercase;
	z-index: 1;
}

.ranama-p12-reach__origin strong {
	font-family: "Archivo", Arial, sans-serif;
	font-size: clamp(4rem, 8vw, 9rem);
	letter-spacing: -0.07em;
	line-height: 0.8;
	margin-top: 2rem;
	position: relative;
	z-index: 1;
}

.ranama-p12-reach__origin i {
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 50%;
	height: 31rem;
	left: -7rem;
	position: absolute;
	top: 0;
	width: 31rem;
}

.ranama-p12-reach__origin i::before,
.ranama-p12-reach__origin i::after {
	background: var(--p12-amber);
	content: "";
	left: 50%;
	position: absolute;
	top: 50%;
	transform-origin: left;
}

.ranama-p12-reach__origin i::before {
	height: 2px;
	transform: rotate(-24deg);
	width: 18rem;
}

.ranama-p12-reach__origin i::after {
	border-radius: 50%;
	height: 0.75rem;
	width: 0.75rem;
}

.ranama-p12-reach__copy h2 {
	font-size: clamp(3.4rem, 5.8vw, 6.8rem);
	margin: 2rem 0 3rem;
}

.ranama-p12-reach__copy h2 em {
	color: var(--p12-amber);
	display: block;
}

.ranama-p12-reach__copy > p:not(.ranama-p12-kicker, .ranama-p12-qualifier) {
	color: rgba(255, 255, 255, 0.78);
	max-width: 43rem;
}

.ranama-p12-reach__copy > p + p {
	margin-top: 1.1rem;
}

.ranama-p12-qualifier {
	border-left: 3px solid var(--p12-amber);
	font-size: 0.9rem;
	margin-top: 2.5rem !important;
	max-width: 43rem;
	padding: 0.45rem 0 0.45rem 1.4rem;
}

.ranama-p12-qualifier > span {
	color: var(--p12-amber);
	display: block;
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.57rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	margin-bottom: 0.6rem;
	text-transform: uppercase;
}

/* Movement three — purpose becomes direction, then future ambition and proof. */
.ranama-p12-principles {
	background: var(--p12-mist);
	padding: clamp(11rem, 15vw, 16rem) 0 0;
}

.ranama-p12-triad {
	align-items: stretch;
	display: grid;
	grid-template-columns: 1.05fr 0.95fr;
}

.ranama-p12-triad > article {
	height: 100%;
	padding: clamp(3rem, 6vw, 7rem);
}

.ranama-p12-triad__purpose {
	background: var(--p12-white);
	grid-column: 1;
	grid-row: 1;
	min-height: 54rem;
}

.ranama-p12-triad__direction {
	background: var(--p12-navy);
	color: var(--p12-white);
	grid-column: 2;
	grid-row: 1;
	margin-top: 0;
	min-height: 54rem;
}

.ranama-p12-triad__vision {
	background: var(--p12-blue);
	color: var(--p12-white);
	grid-column: 1 / -1;
	margin-left: 0;
	min-height: 48rem;
}

.ranama-p12-triad__code {
	color: var(--p12-amber);
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	margin-top: 3rem !important;
	text-transform: uppercase;
}

.ranama-p12-triad h2 {
	font-size: clamp(3.2rem, 5vw, 6rem);
	margin: 1.4rem 0 3rem;
}

.ranama-p12-triad h2 em {
	color: var(--p12-blue);
	display: block;
}

.ranama-p12-triad__direction h2 em,
.ranama-p12-triad__vision h2 em {
	color: var(--p12-amber);
}

.ranama-p12-triad article > p:not(.ranama-p12-kicker, .ranama-p12-triad__code) {
	max-width: 41rem;
}

.ranama-p12-triad article > p + p {
	margin-top: 1rem;
}

.ranama-p12-triad__direction > p:not(.ranama-p12-kicker, .ranama-p12-triad__code),
.ranama-p12-triad__vision > p:not(.ranama-p12-kicker, .ranama-p12-triad__code) {
	color: rgba(255, 255, 255, 0.78);
}

.ranama-p12-triad blockquote {
	border-top: 1px solid currentColor;
	font-family: "Archivo", Arial, sans-serif;
	font-size: clamp(1.8rem, 3vw, 3.6rem);
	font-weight: 600;
	letter-spacing: -0.045em;
	line-height: 1.02;
	margin-top: 3rem;
	padding-top: 1.5rem;
}

.ranama-p12-triad__purpose blockquote,
.ranama-p12-triad__direction blockquote {
	color: var(--p12-amber);
}

.ranama-p12-triad__vision blockquote {
	max-width: 20em;
}

.ranama-p12-triad__vision h2 {
	font-size: clamp(3.1rem, 4.4vw, 5.5rem);
	max-width: 14em;
}

.ranama-p12-qualifier--light {
	color: rgba(255, 255, 255, 0.78);
	margin: 3rem 0 !important;
}

.ranama-p12-qualifier--light p + p {
	margin-top: 0.5rem;
}

.ranama-p12-values {
	padding: clamp(10rem, 15vw, 16rem) 0;
}

.ranama-p12-values__heading {
	display: block;
}

.ranama-p12-values__heading h2 {
	margin-top: 2rem;
	max-width: 12em;
	text-align: left;
}

.ranama-p12-values__register {
	border-top: 1px solid var(--p12-line);
	margin-top: clamp(5rem, 8vw, 8rem);
}

.ranama-p12-values__register article {
	align-items: start;
	border-bottom: 1px solid var(--p12-line);
	display: grid;
	gap: 2rem;
	grid-template-columns: 3.5rem 0.85fr 1.15fr;
	padding: 2.4rem 0;
}

.ranama-p12-values__register article > span {
	color: var(--p12-amber);
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.68rem;
	font-weight: 600;
}

.ranama-p12-values__register h3 {
	font-size: clamp(2rem, 3.4vw, 4rem);
}

.ranama-p12-values__register article > div {
	max-width: 39rem;
}

.ranama-p12-values__register article > div p:first-child {
	font-size: 1.08rem;
	font-weight: 700;
}

.ranama-p12-values__register article > div p + p {
	margin-top: 0.8rem;
}

.ranama-p12-operating-promise {
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.ranama-p12-operating-promise > article {
	min-height: 54rem;
	padding: clamp(4rem, 8vw, 9rem);
}

.ranama-p12-circularity {
	background: var(--p12-green);
	color: var(--p12-white);
}

.ranama-p12-reliability {
	background: var(--p12-ink);
	color: var(--p12-white);
}

.ranama-p12-operating-promise h2 {
	font-size: clamp(3.4rem, 5.5vw, 6.5rem);
	margin: 3rem 0;
}

.ranama-p12-operating-promise h2 em {
	color: var(--p12-amber);
	display: block;
}

.ranama-p12-operating-promise article > p:not(.ranama-p12-kicker) {
	color: rgba(255, 255, 255, 0.78);
	max-width: 42rem;
}

.ranama-p12-operating-promise article > p + p {
	margin-top: 1rem;
}

.ranama-p12-reliability blockquote {
	border-bottom: 1px solid rgba(255, 255, 255, 0.35);
	border-top: 1px solid rgba(255, 255, 255, 0.35);
	color: var(--p12-amber);
	font-family: "Archivo", Arial, sans-serif;
	font-size: clamp(2.2rem, 4vw, 5rem);
	font-weight: 600;
	letter-spacing: -0.05em;
	line-height: 0.98;
	margin: 3rem 0;
	padding: 2rem 0;
}

.ranama-p12-proof {
	background: var(--p12-navy);
	color: var(--p12-white);
	display: grid;
	grid-template-columns: 1.05fr 0.95fr;
}

.ranama-p12-proof__media {
	min-height: 66rem;
	position: relative;
}

.ranama-p12-proof__media-main {
	height: 73%;
	overflow: hidden;
	width: 82%;
}

.ranama-p12-proof__media-main img,
.ranama-p12-proof__media-secondary img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.ranama-p12-proof__media-secondary {
	border: 0.9rem solid var(--p12-navy);
	height: 38%;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 54%;
	width: 52%;
}

.ranama-p12-proof__media > p {
	bottom: 3rem;
	color: var(--p12-amber);
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.6rem;
	left: 3rem;
	letter-spacing: 0.1em;
	position: absolute;
	text-transform: uppercase;
}

.ranama-p12-proof__content {
	padding: clamp(5rem, 8vw, 9rem);
}

.ranama-p12-proof__content h2 {
	font-size: clamp(3.5rem, 5.5vw, 6.7rem);
	margin: 2.5rem 0 3rem;
}

.ranama-p12-proof__content h2 em {
	color: var(--p12-amber);
	display: block;
}

.ranama-p12-proof__content > p:not(.ranama-p12-kicker) {
	color: rgba(255, 255, 255, 0.78);
	max-width: 40rem;
}

.ranama-p12-proof__content ul {
	list-style: none;
	margin: 3rem 0;
	padding: 0;
}

.ranama-p12-proof__content li {
	border-top: 1px solid rgba(255, 255, 255, 0.28);
	font-size: 0.9rem;
	font-weight: 700;
	padding: 1rem 0;
}

.ranama-p12-proof__content li:last-child {
	border-bottom: 1px solid rgba(255, 255, 255, 0.28);
}

.ranama-p12-proof__content li span {
	color: var(--p12-amber);
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.6rem;
	margin-right: 1rem;
}

/* Movement four — secondary operation, precise company register and FAQ. */
.ranama-p12-corporate {
	background: var(--p12-white);
	padding: clamp(11rem, 15vw, 16rem) 0 clamp(10rem, 14vw, 15rem);
}

.ranama-p12-secondary {
	display: grid;
	grid-template-columns: 0.72fr 1.28fr;
	margin-left: auto;
	min-height: 40rem;
	width: min(86vw, 1540px);
}

.ranama-p12-secondary__media {
	overflow: hidden;
}

.ranama-p12-secondary__media img {
	height: 100%;
	object-fit: cover;
	object-position: 44% center;
	width: 100%;
}

.ranama-p12-secondary__content {
	background: var(--p12-mist);
	padding: clamp(4rem, 7vw, 8rem);
}

.ranama-p12-secondary__content h2 {
	font-size: clamp(3.2rem, 5.2vw, 6.2rem);
	margin: 2.5rem 0 3rem;
	max-width: 11em;
}

.ranama-p12-secondary__content h2 em {
	color: var(--p12-blue);
	display: block;
}

.ranama-p12-secondary__content > p:not(.ranama-p12-kicker) {
	max-width: 42rem;
}

.ranama-p12-secondary__content > p + p {
	margin-top: 1rem;
}

.ranama-p12-secondary__content .ranama-p12-text-link {
	margin-top: 2.5rem;
}

.ranama-p12-corporate__grid {
	align-items: start;
	display: grid;
	gap: clamp(5rem, 10vw, 12rem);
	grid-template-columns: 0.9fr 1.1fr;
	margin-top: clamp(9rem, 14vw, 15rem);
}

.ranama-p12-company {
	align-self: start;
	background: var(--p12-ink);
	color: var(--p12-white);
	position: relative;
	top: auto;
}

.ranama-p12-company__heading {
	background: var(--p12-blue);
	padding: clamp(2.5rem, 4vw, 4.5rem);
}

.ranama-p12-company__heading h2 {
	font-size: clamp(3rem, 4.5vw, 5.2rem);
	margin-top: 2rem;
}

.ranama-p12-company__heading h2 em {
	color: var(--p12-amber);
	display: block;
}

.ranama-p12-company dl {
	padding: 0 clamp(2.5rem, 4vw, 4.5rem);
}

.ranama-p12-company dl > div {
	border-bottom: 1px solid rgba(255, 255, 255, 0.24);
	display: grid;
	gap: 1rem;
	grid-template-columns: 0.42fr 0.58fr;
	padding: 1.4rem 0;
}

.ranama-p12-company dt {
	color: var(--p12-amber);
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.58rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.ranama-p12-company dd {
	font-size: 0.9rem;
	line-height: 1.55;
}

.ranama-p12-company dd a:hover {
	color: var(--p12-amber);
}

.ranama-p12-company > .ranama-p12-button {
	margin: 2.5rem clamp(2.5rem, 4vw, 4.5rem) clamp(2.5rem, 4vw, 4.5rem);
}

.ranama-p12-faq__heading h2 {
	font-size: clamp(3.7rem, 6vw, 7rem);
	margin: 2rem 0 clamp(4rem, 7vw, 7rem);
}

.ranama-p12-faq__heading h2 em {
	color: var(--p12-blue);
	display: block;
}

.ranama-p12-faq__list {
	border-top: 1px solid var(--p12-line);
}

.ranama-p12-faq details {
	border-bottom: 1px solid var(--p12-line);
}

.ranama-p12-faq summary {
	align-items: center;
	cursor: pointer;
	display: grid;
	font-family: "Archivo", Arial, sans-serif;
	font-size: clamp(1.35rem, 2.1vw, 2.3rem);
	font-weight: 600;
	gap: 1rem;
	grid-template-columns: 2.4rem 1fr 1.5rem;
	letter-spacing: -0.035em;
	line-height: 1.08;
	list-style: none;
	padding: 1.8rem 0;
}

.ranama-p12-faq summary::-webkit-details-marker {
	display: none;
}

.ranama-p12-faq summary > span {
	color: var(--p12-amber);
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.62rem;
	letter-spacing: 0;
}

.ranama-p12-faq summary i {
	height: 1rem;
	position: relative;
	width: 1rem;
}

.ranama-p12-faq summary i::before,
.ranama-p12-faq summary i::after {
	background: var(--p12-navy);
	content: "";
	height: 1px;
	left: 0;
	position: absolute;
	top: 50%;
	transition: transform 180ms ease;
	width: 100%;
}

.ranama-p12-faq summary i::after {
	transform: rotate(90deg);
}

.ranama-p12-faq details[open] summary i::after {
	transform: rotate(0);
}

.ranama-p12-faq details > div {
	max-width: 43rem;
	padding: 0 2rem 2.2rem 3.4rem;
}

.ranama-p12-faq details > div p + p {
	margin-top: 0.85rem;
}

/* Final movement — the continuum resolves into the approved shared signature rule. */
.ranama-p12-conversion {
	background: var(--p12-ink);
	color: var(--p12-white);
	min-height: 62rem;
	overflow: hidden;
	padding: clamp(11rem, 16vw, 17rem) 0 clamp(6rem, 9vw, 9rem);
}

.ranama-p12-conversion__media {
	height: 100%;
	op: 0;
	position: absolute;
	right: 0;
	width: 42%;
}

.ranama-p12-conversion__media::after {
	background: linear-gradient(90deg, var(--p12-ink), rgba(23, 38, 59, 0.12) 60%), linear-gradient(0deg, var(--p12-ink), transparent 50%);
	content: "";
	inset: 0;
	position: absolute;
}

.ranama-p12-conversion__media img {
	height: 100%;
	object-fit: cover;
	object-position: center;
	width: 100%;
}

.ranama-p12-conversion__continuum {
	align-items: center;
	display: grid;
	grid-template-columns: 1fr 1fr;
	left: 0;
	position: absolute;
	top: 4rem;
	width: 68%;
}

.ranama-p12-conversion__continuum i,
.ranama-p12-conversion__continuum b {
	background: var(--p12-amber);
	display: block;
	height: 2px;
}

.ranama-p12-conversion__continuum span {
	background: var(--p12-amber);
	color: var(--p12-ink);
	font-family: "Noto Sans Mono", monospace;
	font-size: 0.58rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	padding: 0.7rem 0.9rem;
	text-transform: uppercase;
}

.ranama-p12-conversion__inner {
	position: relative;
	z-index: 2;
}

.ranama-p12-conversion__heading {
	max-width: 72%;
}

.ranama-p12-conversion__heading h2 {
	font-size: clamp(4rem, 8vw, 9rem);
	margin-top: 2.5rem;
}

.ranama-p12-conversion__heading h2 em {
	color: var(--p12-amber);
	display: block;
}

.ranama-p12-conversion__copy {
	margin-left: 0;
	margin-top: clamp(3rem, 5vw, 5rem);
	max-width: 49rem;
}

.ranama-p12-conversion__copy > p {
	color: rgba(255, 255, 255, 0.78);
}

.ranama-p12-conversion__copy .ranama-p12-actions {
	margin: 2.5rem 0 1.5rem;
}

/* Exact Home-authority signature scale and white-rule-to-text spacing. */
.ranama-p12-conversion__signature {
	border-top: 1px solid rgba(255, 255, 255, 0.28);
	font-family: "Archivo", Arial, sans-serif;
	font-size: clamp(1.3rem, 2.5vw, 2.5rem);
	font-weight: 600;
	letter-spacing: -0.03em;
	margin-top: clamp(6rem, 10vw, 10rem) !important;
	padding-top: 1.8rem;
	text-align: right;
}

/* Restrained progression and proof reveals. */
html.ranama-p12-motion .ranama-p12 [data-p12-reveal] {
	opacity: 0;
	transform: translateY(2rem);
	transition: opacity 700ms ease, transform 850ms cubic-bezier(0.2, 0.72, 0.2, 1);
}

html.ranama-p12-motion .ranama-p12 [data-p12-reveal].is-in-view {
	opacity: 1;
	transform: none;
}

html.ranama-p12-motion .ranama-p12 [data-p12-sequence] .ranama-p12-lifecycle__line i,
html.ranama-p12-motion .ranama-p12 [data-p12-sequence] .ranama-p12-evolution__spine i {
	transform: scaleX(0);
	transition: transform 1.4s cubic-bezier(0.2, 0.72, 0.2, 1);
}

html.ranama-p12-motion .ranama-p12 [data-p12-sequence] .ranama-p12-evolution__spine i {
	transform: scaleY(0);
}

html.ranama-p12-motion .ranama-p12 [data-p12-sequence].is-sequence-active .ranama-p12-lifecycle__line i {
	transform: scaleX(1);
}

html.ranama-p12-motion .ranama-p12 [data-p12-sequence].is-sequence-active .ranama-p12-evolution__spine i {
	transform: scaleY(1);
}

html.ranama-p12-motion .ranama-p12 [data-p12-proof] li,
html.ranama-p12-motion .ranama-p12 [data-p12-proof] > p {
	opacity: 0;
	transform: translateY(0.75rem);
	transition: opacity 500ms ease, transform 600ms ease;
}

html.ranama-p12-motion .ranama-p12 [data-p12-proof].is-proof-active li,
html.ranama-p12-motion .ranama-p12 [data-p12-proof].is-proof-active > p {
	opacity: 1;
	transform: none;
}

html.ranama-p12-motion .ranama-p12 [data-p12-proof] li:nth-child(2),
html.ranama-p12-motion .ranama-p12 [data-p12-proof] > p:nth-child(2) {
	transition-delay: 80ms;
}

html.ranama-p12-motion .ranama-p12 [data-p12-proof] li:nth-child(3),
html.ranama-p12-motion .ranama-p12 [data-p12-proof] > p:nth-child(3) {
	transition-delay: 160ms;
}

html.ranama-p12-motion .ranama-p12 [data-p12-proof] li:nth-child(4) {
	transition-delay: 240ms;
}

html.ranama-p12-motion .ranama-p12 [data-p12-proof] li:nth-child(5) {
	transition-delay: 320ms;
}

html.ranama-p12-motion .ranama-p12 [data-p12-proof] li:nth-child(6) {
	transition-delay: 400ms;
}

@media (max-width: 1280px) {
	.ranama-p12 {
		--p12-shell: min(1480px, calc(100vw - 3rem));
	}

	.ranama-p12-hero h1 {
		font-size: clamp(4.5rem, 8.5vw, 7rem);
	}

	.ranama-p12-heritage {
		grid-template-columns: 0.9fr 0.18fr 0.92fr;
	}

	.ranama-p12-heritage__content,
	.ranama-p12-proof__content {
		padding: 4rem;
	}

	.ranama-p12-format-field__images {
		min-height: 40rem;
	}

	.ranama-p12-format-field__register ul {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ranama-p12-plants {
		grid-template-columns: 0.78fr 1.1fr 0.78fr;
	}

	.ranama-p12-operating-promise > article {
		padding: 5rem 4rem;
	}

	.ranama-p12-secondary {
		width: calc(100vw - 1.5rem);
	}
}

@media (max-width: 1080px) {
	.ranama-p12-hero__stage {
		min-height: 58rem;
	}

	.ranama-p12-hero__media {
		height: 66%;
		width: 70%;
	}

	.ranama-p12-hero__founding {
		right: 1.5rem;
	}

	.ranama-p12-foundation__focus,
	.ranama-p12-present__heading,
	.ranama-p12-corporate__grid {
		gap: 4rem;
	}

	.ranama-p12-format-field {
		grid-template-columns: 1fr;
	}

	.ranama-p12-format-field__images {
		min-height: 34rem;
	}

	.ranama-p12-format-field__register {
		display: grid;
		gap: 0 4rem;
		grid-template-columns: 0.7fr 1.3fr;
	}

	.ranama-p12-format-field__register ul,
	.ranama-p12-format-field__register .ranama-p12-actions {
		grid-column: 2;
	}

	.ranama-p12-format-field__register > p {
		grid-column: 1;
		grid-row: 1 / span 2;
	}

	.ranama-p12-plants {
		grid-template-columns: 1fr 1.25fr;
	}

	.ranama-p12-plants__media--two {
		display: none;
	}

	.ranama-p12-reach__inner {
		gap: 5rem;
	}

	.ranama-p12-triad > article {
		padding: 4rem;
	}

	.ranama-p12-proof {
		grid-template-columns: 0.82fr 1.18fr;
	}

	.ranama-p12-proof__media {
		min-height: 58rem;
	}

	.ranama-p12-corporate__grid {
		grid-template-columns: 0.86fr 1.14fr;
	}

	.ranama-p12-company dl > div {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 820px) {
	.ranama-p12 {
		--p12-shell: calc(100vw - 2rem);
	}

	.ranama-p12-continuum-line {
		top: 2rem;
		width: 76%;
	}

	.ranama-p12-hero__stage {
		min-height: 51rem;
	}

	.ranama-p12-hero__stage::before {
		background-size: 4.5rem 4.5rem;
	}

	.ranama-p12-hero__media {
		height: 49%;
		top: 7rem;
		width: 100%;
	}

	.ranama-p12-hero__media::after {
		background: linear-gradient(0deg, var(--p12-ink), rgba(23, 38, 59, 0.1) 58%, rgba(23, 38, 59, 0.45));
	}

	.ranama-p12-hero__top {
		display: block;
		padding-top: 7rem;
	}

	.ranama-p12-hero__top .ranama-p12-kicker {
		margin-top: 1rem;
	}

	.ranama-p12-hero__founding {
		right: 1rem;
		top: 14rem;
		width: 11.5rem;
	}

	.ranama-p12-hero__founding strong {
		font-size: 3.7rem;
	}

	.ranama-p12-hero__title {
		bottom: 7.5rem;
		left: 2rem;
		width: calc(100vw - 4rem);
	}

	.ranama-p12-hero h1 {
		font-size: clamp(3.4rem, 13.5vw, 6.2rem);
		max-width: 9em;
	}

	.ranama-p12-hero h1 em {
		margin-left: 0;
	}

	.ranama-p12-hero__intro-grid,
	.ranama-p12-foundation__focus,
	.ranama-p12-focus-close,
	.ranama-p12-evolution__heading,
	.ranama-p12-present__heading,
	.ranama-p12-reach__inner,
	.ranama-p12-operating-promise,
	.ranama-p12-proof,
	.ranama-p12-secondary,
	.ranama-p12-corporate__grid {
		grid-template-columns: 1fr;
	}

	.ranama-p12-hero__proof {
		grid-template-columns: 1fr;
	}

	.ranama-p12-hero__proof p + p {
		border-left: 0;
		border-top: 1px solid var(--p12-line);
	}

	.ranama-p12-heading h2,
	.ranama-p12-evolution__heading h2,
	.ranama-p12-values__heading h2 {
		font-size: clamp(3.2rem, 11.5vw, 5.7rem);
	}

	.ranama-p12-lifecycle__line {
		bottom: 0;
		height: auto;
		left: 0.9rem;
		top: 0;
		width: 1px;
	}

	.ranama-p12-lifecycle__line i {
		height: 100%;
		transform-origin: top;
		width: 2px;
	}

	html.ranama-p12-motion .ranama-p12 [data-p12-sequence] .ranama-p12-lifecycle__line i {
		transform: scaleY(0);
	}

	html.ranama-p12-motion .ranama-p12 [data-p12-sequence].is-sequence-active .ranama-p12-lifecycle__line i {
		transform: scaleY(1);
	}

	.ranama-p12-lifecycle ol {
		grid-template-columns: 1fr;
	}

	.ranama-p12-lifecycle li {
		align-items: center;
		border-bottom: 1px solid var(--p12-line);
		border-left: 0;
		display: grid;
		gap: 1rem;
		grid-template-columns: 2rem 1fr;
		min-height: auto;
		padding: 1.15rem 0;
	}

	.ranama-p12-lifecycle li:last-child {
		border-right: 0;
	}

	.ranama-p12-lifecycle li span {
		margin: 0;
	}

	.ranama-p12-heritage {
		grid-template-columns: 1fr;
	}

	.ranama-p12-heritage__media {
		min-height: 28rem;
	}

	.ranama-p12-heritage__date {
		align-items: center;
		flex-direction: row;
		gap: 1.75rem;
		justify-content: space-between;
		padding: 1.5rem;
	}

	.ranama-p12-heritage__date strong {
		font-size: 5rem;
		transform: none;
		writing-mode: horizontal-tb;
	}

	.ranama-p12-heritage__content {
		padding: 4rem 1rem 5rem;
	}

	.ranama-p12-evolution__heading .ranama-p12-kicker,
	.ranama-p12-evolution__heading h2,
	.ranama-p12-evolution__intro {
		grid-column: 1;
		grid-row: auto;
	}

	.ranama-p12-evolution__path {
		padding-left: 2rem;
	}

	.ranama-p12-evolution__spine {
		left: 0;
	}

	.ranama-p12-evolution__path li,
	.ranama-p12-evolution__path li:nth-child(even) {
		margin-left: 0;
		min-height: auto;
		padding: 2rem 0 3.5rem;
		width: 100%;
	}

	.ranama-p12-evolution__path li::after,
	.ranama-p12-evolution__path li:nth-child(even)::after {
		left: -2.55rem;
		right: auto;
	}

	.ranama-p12-evolution__spine span {
		display: none;
	}

	.ranama-p12-format-field__images {
		display: grid;
		gap: 1rem;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		min-height: auto;
		overflow: hidden;
		padding: 1rem;
	}

	.ranama-p12-format-field__images figure,
	.ranama-p12-format-field__images figure:nth-child(2),
	.ranama-p12-format-field__images figure:nth-child(3),
	.ranama-p12-format-field__images figure:nth-child(4),
	.ranama-p12-format-field__images figure:nth-child(5) {
		bottom: auto;
		height: 19rem;
		left: auto;
		position: relative;
		right: auto;
		top: auto;
		width: auto;
	}

	.ranama-p12-format-field__images figure:nth-child(1) {
		grid-column: 1;
		grid-row: 2;
	}

	.ranama-p12-format-field__images figure:nth-child(2) {
		grid-column: 2;
		grid-row: 2;
	}

	.ranama-p12-format-field__images figure:nth-child(3) {
		grid-column: 1 / -1;
		grid-row: 1;
		height: 27rem;
	}

	.ranama-p12-format-field__images figure:nth-child(4) {
		grid-column: 1;
		grid-row: 3;
	}

	.ranama-p12-format-field__images figure:nth-child(5) {
		grid-column: 2;
		grid-row: 3;
	}

	.ranama-p12-format-field__register {
		display: block;
	}

	.ranama-p12-format-field__register ul {
		display: block;
		margin-top: 3rem;
	}

	.ranama-p12-format-field__register li {
		white-space: normal;
	}

	.ranama-p12-plants {
		grid-template-columns: 1fr;
	}

	.ranama-p12-plants__media {
		min-height: 28rem;
	}

	.ranama-p12-plants__media--two {
		display: block;
	}

	.ranama-p12-plants__caption {
		padding-inline: 1rem;
	}

	.ranama-p12-reach__origin {
		min-height: 25rem;
	}

	.ranama-p12-reach__origin::before {
		inset: 1rem -2rem;
		opacity: 0.2;
	}

	.ranama-p12-reach__origin i {
		height: 24rem;
		left: -8rem;
		width: 24rem;
	}

	.ranama-p12-triad {
		display: block;
		width: 100%;
	}

	.ranama-p12-triad > article {
		height: auto;
		margin: 0;
		min-height: auto;
		padding: 5rem 1rem;
	}

	.ranama-p12-values__heading {
		display: block;
	}

	.ranama-p12-values__heading h2 {
		margin-top: 2rem;
	}

	.ranama-p12-values__register article {
		grid-template-columns: 2rem 1fr;
	}

	.ranama-p12-values__register article > div {
		grid-column: 2;
	}

	.ranama-p12-operating-promise > article {
		min-height: auto;
		padding: 5rem 1rem;
	}

	.ranama-p12-proof__media {
		min-height: 40rem;
	}

	.ranama-p12-proof__content {
		padding: 5rem 1rem;
	}

	.ranama-p12-secondary {
		margin: 0;
		width: 100%;
	}

	.ranama-p12-secondary__media {
		min-height: 28rem;
	}

	.ranama-p12-secondary__content {
		padding: 5rem 1rem;
	}

	.ranama-p12-company {
		position: relative;
		top: auto;
	}

	.ranama-p12-conversion__media {
		height: 44%;
		top: 0;
		width: 100%;
	}

	.ranama-p12-conversion__media::after {
		background: linear-gradient(0deg, var(--p12-ink), rgba(23, 38, 59, 0.2));
	}

	.ranama-p12-conversion__continuum {
		grid-template-columns: 1fr;
		width: 92%;
	}

	.ranama-p12-conversion__continuum b {
		display: none;
	}

	.ranama-p12-conversion__heading {
		max-width: 100%;
	}

	.ranama-p12-conversion__heading h2 {
		font-size: clamp(3.8rem, 15vw, 6.5rem);
	}

	.ranama-p12-conversion__copy {
		margin-left: 0;
		margin-top: 3.5rem;
	}

	.ranama-p12-conversion__signature {
		font-size: 1.45rem;
		text-align: left;
	}
}

@media (max-width: 540px) {
	.ranama-p12-button {
		width: 100%;
	}

	.ranama-p12-hero__stage {
		min-height: 47rem;
	}

	.ranama-p12-hero__founding {
		padding: 1rem;
		top: 13rem;
		width: 9.5rem;
	}

	.ranama-p12-hero__founding strong {
		font-size: 3rem;
	}

	.ranama-p12-hero__title {
		bottom: 2rem;
		left: 1.5rem;
		width: calc(100vw - 3rem);
	}

	.ranama-p12-hero h1 {
		font-size: clamp(3.15rem, 15vw, 4.7rem);
	}

	.ranama-p12-hero__rail {
		display: none;
	}

	.ranama-p12-hero__introduction::before {
		left: 1rem;
	}

	.ranama-p12-hero__lead {
		font-size: 2rem;
	}

	.ranama-p12-heading h2,
	.ranama-p12-evolution__heading h2,
	.ranama-p12-values__heading h2,
	.ranama-p12-present .ranama-p12-heading h2,
	.ranama-p12-reach__copy h2,
	.ranama-p12-triad h2,
	.ranama-p12-operating-promise h2,
	.ranama-p12-proof__content h2,
	.ranama-p12-secondary__content h2,
	.ranama-p12-faq__heading h2 {
		font-size: clamp(3rem, 13.5vw, 4.4rem);
	}

	.ranama-p12-heritage__content h2 {
		font-size: 3rem;
	}

	.ranama-p12-evolution__path li {
		grid-template-columns: 1.8rem 1fr;
	}

	.ranama-p12-evolution__path h3 {
		font-size: 2rem;
	}

	.ranama-p12-format-field__register {
		padding: 3rem 1rem;
	}

	.ranama-p12-format-field__images figure,
	.ranama-p12-format-field__images figure:nth-child(2),
	.ranama-p12-format-field__images figure:nth-child(4),
	.ranama-p12-format-field__images figure:nth-child(5) {
		height: 14rem;
	}

	.ranama-p12-format-field__images figure:nth-child(3) {
		height: 21rem;
	}

	.ranama-p12-plants__core {
		padding: 4rem 1rem;
	}

	.ranama-p12-reach__origin strong {
		font-size: 4.5rem;
	}

	.ranama-p12-triad > article {
		padding-block: 4.5rem;
	}

	.ranama-p12-values__register h3 {
		font-size: 2.2rem;
	}

	.ranama-p12-proof__media {
		min-height: 32rem;
	}

	.ranama-p12-proof__media > p {
		bottom: 1rem;
		left: 1rem;
	}

	.ranama-p12-company__heading,
	.ranama-p12-company dl {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
	}

	.ranama-p12-company > .ranama-p12-button {
		margin-left: 1.5rem;
		margin-right: 1.5rem;
		width: calc(100% - 3rem);
	}

	.ranama-p12-faq summary {
		font-size: 1.35rem;
		grid-template-columns: 1.7rem 1fr 1rem;
	}

	.ranama-p12-faq details > div {
		padding-left: 2.7rem;
		padding-right: 0;
	}

	.ranama-p12-conversion {
		min-height: auto;
		padding-top: 13rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ranama-p12 *,
	.ranama-p12 *::before,
	.ranama-p12 *::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}