/* Fixed Temple design. Repeated page classes preserve the approved cascade specificity. */
@import url("assets/fonts/fonts.css");
:root {font-family: "DM Sans", Arial, sans-serif; --page: #fff; --ink: #172c48; --muted: #62748b; --accent: #2869dc; --accent-deep: #1646a5; --accent-light: #90b5fa; --wash: #e8f0ff; --surface: #f6f9ff; --line: #dce5f1; --head: 'Marcellus',Georgia,serif; --section-space: 120px; font-synthesis: none;}
* {box-sizing: border-box;}
html {scroll-behavior: smooth; scroll-padding-top: 32px;}
body {margin: 0px; background: var(--page); color: var(--ink); overflow-x: clip;}
button {font: inherit;}
button,a {touch-action: manipulation; -webkit-tap-highlight-color: transparent;}
button {cursor: pointer; color: inherit;}
a {color: inherit; text-decoration: none;}
svg {display: block; width: 100%; height: auto;}
button:focus-visible,a:focus-visible,[tabindex]:focus-visible {outline: 3px solid var(--accent); outline-offset: 5px;}
h1,h2,h3,p {margin: 0px;}
h1,h2,h3 {font-family: var(--head); font-weight: 500; letter-spacing: -0.055em;}
h1 {font-size: clamp(58px, 6.2vw, 92px); line-height: 1.06;}
h2 {font-size: clamp(38px, 4vw, 58px); line-height: 1.13;}
h3 {font-size: 27px; line-height: 1.2; letter-spacing: -0.035em;}
p {font-size: 16px; line-height: 1.7; color: var(--muted);}
em {font-style: normal; color: var(--accent);}
.wrap {width: min(1240px, 100% - 112px); margin-inline: auto;}
.tiny-dot {width: 6px; height: 6px; display: inline-block; border-radius: 50%; background: var(--accent); flex-shrink: 0;}
.button {min-height: 48px; padding: 13px 21px; border-radius: 9px; border: 1px solid transparent; display: inline-flex; align-items: center; justify-content: center; gap: 27px; font-size: 13px; font-weight: 600; white-space: nowrap; transition: transform 0.2s, background 0.2s;}
.button:hover {transform: translateY(-2px);}
.primary {background: var(--accent); color: rgb(255, 255, 255); box-shadow: rgba(38, 71, 120, 0.063) 0px 4px 12px;}
.primary:hover {background: var(--accent-deep);}
.button span {font-size: 19px; line-height: 1;}
.text-link {font-size: 13px; font-weight: 500; display: inline-flex; align-items: center; gap: 17px;}
.text-link:hover {color: var(--accent);}
.text-button {background: none; color: var(--accent); padding: 0px; justify-content: flex-start; align-self: flex-start;}
.skip {position: fixed; left: 20px; top: -80px; padding: 14px; background: var(--ink); color: white; z-index: 110;}
.skip:focus {top: 12px;}
.site-header {display: flex; align-items: center; justify-content: space-between; padding-block: 28px; gap: 30px; position: relative; z-index: 2;}
.brand {display: inline-flex; align-items: center; gap: 9px; color: var(--accent); font-size: 29px; font-weight: 700; letter-spacing: -1.7px; line-height: 1;}
.site-header nav {display: flex; gap: 32px; font-size: 12px; font-weight: 500; margin-left: auto; margin-right: 26px;}
.site-header nav a {display: flex; align-items: center; gap: 5px;}
.site-header nav a:hover {color: var(--accent);}
.site-header .button {min-height: 41px; padding: 10px 16px; font-size: 12px; gap: 20px;}
.hero-actions {display: flex; align-items: center; gap: 25px; margin-top: 30px; flex-wrap: wrap;}
.graph-line {stroke-dasharray: 500; stroke-dashoffset: 0; animation: 1.7s ease 0s 1 normal both running draw;}
.architecture {overflow: visible;}
.orbit-lines {display: none;}
#scene {display: grid; grid-template-columns: 1fr 1.1fr; gap: 70px; padding: 55px; min-height: 400px; align-items: center;}
@media (min-width: 1600px) {.wrap {width: min(1360px, 100% - 160px);}}
@media (max-width: 1100px) {.wrap {width: calc(100% - 64px);}
.hero-actions {gap: 17px;}
.hero-actions .text-link {font-size: 11px;}
#scene {gap: 35px; padding: 35px;}}
@media (max-width: 800px) {:root {--section-space: 80px;}
.wrap {width: calc(100% - 44px);}
.site-header {padding-block: 22px; gap: 15px;}
.site-header nav {gap: 18px; margin-right: 5px; font-size: 11px;}

.brand {font-size: 26px;}
.site-header .button {font-size: 10px; min-height: 38px; padding: 9px 12px; gap: 12px;}
.hero-actions .text-link {font-size: 10px;}
.hero-actions .button {font-size: 11px; min-height: 44px; padding: 11px 16px;}
#scene {gap: 28px; padding: 28px;}}
@media (max-width: 600px) {:root {--section-space: 65px;}
.wrap {width: calc(100% - 40px);}
h1 {font-size: 53px;}
h2 {font-size: 38px;}
.site-header nav {display: none;}
.site-header {padding-block: 22px;}
.brand {font-size: 27px;}
.hero-actions {margin-top: 24px; gap: 20px;}
.hero-actions .button {font-size: 12px; min-height: 46px;}
.hero-actions .text-link {font-size: 11px;}
.architecture {margin-top: -10px; margin-bottom: -20px;}
#scene {grid-template-columns: 1fr; padding: 26px 20px 28px; gap: 28px;}}
@media (prefers-reduced-motion: reduce) {html {scroll-behavior: auto;}
* {animation: auto ease 0s 1 normal none running none !important; transition: none !important;}}
.brand {gap: 0px; letter-spacing: normal; flex-shrink: 0;}
.brand img {display: block; width: 150px; height: 44px; object-fit: contain;}
body.temple-page {--head: 'Marcellus',Georgia,serif;}
body.temple-page h1,body.temple-page h2,body.temple-page h3 {font-weight: 400; letter-spacing: -0.035em;}
body.temple-page h1 em {font-style: normal;}
@media (max-width: 800px) {.brand img {width: 135px; height: 40px;}}
@media (max-width: 600px) {.brand img {width: 128px; height: 38px;}}
body.temple-page {--page: #fffcf8; --ink: #102b50; --muted: #627080; --accent: #006ac3; --accent-deep: #004b91; --accent-light: #71caff; --wash: #e0f3ff; --surface: #f0f8fc; --line: #dae6eb; --vivid-one: #007ce8; --vivid-two: #00bdca; --vivid-three: #ff7045; --vivid-warm: #ffd059; --night: #0d2c54; --night-end: #075879; --art-ink: #fff; --field-one: #1688eb; --field-two: #ff8b48; --field-three: #087fa2;}
body:is(.temple-page, .temple-page) .primary {background: linear-gradient(115deg,var(--accent),var(--accent-deep)); box-shadow: 0 5px 18px color-mix(in srgb,var(--accent) 23%,transparent);}
body.temple-page {--section-space: 100px; --ref-paper: #fffcf8; --ref-navy: #0d2c54; background: var(--ref-paper); color: var(--ref-navy);}
body.temple-page .wrap {width: min(1240px, 100% - 112px);}
body.temple-page .site-header {padding-block: 25px;}
body.temple-page .site-header nav {font-size: 12px;}
body.temple-page .primary {background: rgb(8, 107, 192); border-radius: 6px; box-shadow: none;}
body.temple-page .primary:hover {background: rgb(7, 84, 150);}
body.temple-page :is(h1, h2, h3) {font-family: Marcellus, Georgia, serif; font-weight: 400; letter-spacing: -0.04em;}
.ref-kicker {font-family: "DM Sans", sans-serif;  letter-spacing: 0.14em; font-weight: 600; line-height: 1.5; display: flex; align-items: center; gap: 9px;}
.ref-hero {display: grid; grid-template-columns: 1fr 1.02fr; gap: 24px; align-items: center; min-height: 635px; padding-top: 24px; padding-bottom: 48px; position: relative;}
.ref-hero-copy {position: relative; z-index: 2; padding-bottom: 14px;}
.ref-hero h1 {font-size: clamp(64px, 6.3vw, 91px); line-height: 1.065; margin: 26px 0px 25px;}
.ref-hero h1 em {color: rgb(7, 115, 156);}
.ref-hero-copy > p {font-size: 15px; line-height: 1.9; color: rgb(86, 104, 121); max-width: 440px;}
.ref-hero .hero-actions {gap: 23px; margin-top: 29px;}
.ref-hero .text-link {font-size: 11px; gap: 13px;}
.ref-hero .button {font-size: 12px; gap: 28px;}

.ref-art {position: relative; isolation: isolate; aspect-ratio: 1.08 / 1; min-width: 0px; display: grid; align-items: center;}
.ref-art::before {content: ""; position: absolute; z-index: -2; inset: 7% -5% 4%; background: radial-gradient(at 73% 30%, rgba(255, 183, 103, 0.396), transparent 50%), radial-gradient(at 56% 78%, rgba(30, 197, 205, 0.27), transparent 61%); filter: blur(18px);}
.ref-sun {position: absolute; z-index: -1; top: 4%; left: 23%; width: 60%; aspect-ratio: 1 / 1; border-radius: 50%; background: linear-gradient(155deg, rgb(255, 233, 181) 6%, rgb(255, 197, 131) 48%, rgba(250, 145, 105, 0.31) 83%); opacity: 0.85;}
.art-coordinate {position: absolute; bottom: 1%; left: 13%; right: 7%; font-size: 8px; letter-spacing: 0.14em; color: rgb(105, 129, 139); text-align: center;}
.greek-motif {width: 100%; height: 100%; overflow: hidden; display: block;}
.ref-divider {display: flex; align-items: center; border-top: 1px solid rgb(204, 222, 227); padding-block: 22px; gap: 25px; font-size: 9px; letter-spacing: 0.12em; color: rgb(104, 125, 137);}
.ref-divider > span:nth-child(2) {margin-left: auto; font-size: 11px; letter-spacing: 0px;}
.ref-divider > a {width: 28px; height: 28px; border: 1px solid rgb(203, 223, 228); border-radius: 50%; display: grid; place-items: center; font-size: 16px; color: rgb(13, 44, 84);}
.ref-possibilities {padding-block: 87px 95px;}
.ref-section-heading {display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; margin-bottom: 40px;}
.ref-section-heading .ref-kicker {color: rgb(7, 127, 149); margin-bottom: 19px;}
.ref-section-heading h2 {font-size: 52px; line-height: 1.12;}
.ref-section-heading > p {font-size: 13px; line-height: 1.8; max-width: 280px; margin-bottom: 5px; color: rgb(99, 115, 131);}
.ref-card-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px;}
.ref-card {border: 1px solid rgb(215, 227, 229); background: rgb(255, 254, 250); border-radius: 11px; overflow: hidden; display: flex; flex-direction: column; transition: transform 0.25s, box-shadow 0.25s;}
.ref-card:hover {transform: translateY(-5px); box-shadow: rgba(23, 57, 87, 0.047) 0px 14px 35px;}
.ref-card-top {padding: 21px 24px 8px; display: flex; justify-content: space-between; align-items: center;  letter-spacing: 0.1em; font-weight: 500;}
.ref-card-top > span:last-child {font-size: 20px; font-weight: 400;}
.ref-card-art {position: relative; isolation: isolate; height: 202px; margin: 12px 14px 25px; overflow: hidden; border-radius: 5px; background: linear-gradient(120deg, rgb(8, 109, 205), rgb(0, 140, 173) 68%, rgb(57, 188, 197)); color: white;}
.card-hedge .ref-card-art {background: linear-gradient(125deg, rgb(251, 226, 165), rgb(253, 161, 108) 63%, rgb(245, 138, 89)); color: rgb(24, 59, 88);}
.card-strategy .ref-card-art {background: linear-gradient(130deg, rgb(13, 44, 84), rgb(5, 92, 119) 65%, rgb(11, 159, 172)); color: rgb(193, 242, 237);}
.ref-mini-graph {position: absolute; width: calc(100% - 38px); bottom: 10px; left: 19px; z-index: 2; overflow: visible;}
.ref-mini-graph .graph-grid {stroke: currentcolor; stroke-width: 1; opacity: 0.13; fill: none;}
.ref-mini-graph .graph-line {stroke: currentcolor; stroke-width: 2.7; fill: none; stroke-linecap: round; stroke-linejoin: round;}
.card-motif {position: absolute; right: 7%; top: 5%; width: 35%; height: 83%; color: currentcolor; opacity: 0.2; z-index: 1; transform: rotate(-7deg);}
.card-hedge .card-motif {width: 35%; right: 9%; top: 4%; transform: rotate(9deg); opacity: 0.14;}
.card-strategy .card-motif {width: 31%; right: 12%; transform: rotate(24deg);}
body.temple-page .card-motif {width: 54%; height: 108%; right: -4%; top: -7%; transform: rotate(0deg); opacity: 0.23;}
body.temple-page .card-motif {opacity: 0.4;}
.ref-card h3 {font-size: 34px; margin: 0px 25px 10px;}
.ref-card > p { line-height: 1.7; color: rgb(99, 113, 124); margin: 0px 25px; max-width: 260px; min-height: 45px;}
.ref-card-link {display: flex; align-items: center; justify-content: space-between; margin: 25px 25px 0px; padding: 18px 0px; border-top: 1px solid rgb(220, 231, 230); color: rgb(7, 111, 155); }
.ref-card-link > span {font-size: 19px;}
.ref-protocol {display: grid; grid-template-columns: 0.9fr 1.55fr; gap: 55px; padding: 48px 45px 47px; background: linear-gradient(110deg, rgb(13, 44, 84), rgb(7, 84, 106)); border-radius: 9px; position: relative; overflow: hidden; color: rgb(243, 248, 243);}
.ref-protocol::after {content: ""; position: absolute; right: -110px; top: -130px; width: 400px; height: 400px; border: 1px solid rgba(168, 231, 218, 0.063); border-radius: 50%; pointer-events: none; box-shadow: rgba(168, 231, 218, 0.02) 0px 0px 0px 45px, rgba(168, 231, 218, 0.01) 0px 0px 0px 95px;}
.ref-protocol .ref-kicker { color: rgb(154, 203, 210);}
.ref-protocol h2 {font-size: 38px; line-height: 1.15; margin-top: 20px;}
.ref-protocol-heading > p {font-size: 11px; color: rgb(169, 201, 209); margin-top: 15px;}
.ref-protocol-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; align-items: center;}
.protocol-motif {height: 49px; width: 42px; color: rgb(154, 228, 222); margin-bottom: 24px;}
.ref-protocol-grid article:nth-child(2) .protocol-motif {color: rgb(255, 208, 149); width: 30px;}
.ref-protocol-grid article:nth-child(3) .protocol-motif {color: rgb(156, 213, 240); width: 28px;}
.ref-protocol h3 { letter-spacing: -0.025em;}
.ref-protocol-grid p { line-height: 1.8; color: rgb(180, 205, 212); margin-top: 12px;}
.ref-explore {padding-block: 105px 65px;}
.ref-explore .ref-section-heading {margin-bottom: 34px;}
.ref-explore .ref-section-heading h2 {font-size: 50px;}
.strategy-list {display:grid;gap:36px;}
.ref-scene {border:0;border-radius:0;background:transparent;scroll-margin-top:32px;min-width:0;}
body.temple-page .strategy-list .ref-scene {display: grid; grid-template-columns: 1fr 1.04fr; align-items: center; gap: 64px; padding: 47px 47px 45px; min-height: 420px;}
.ref-scene-copy > .ref-kicker {color: rgb(90, 122, 135);  margin-bottom: 14px;}
.ref-scene-copy h3 {font-size: 39px; line-height: 1.12;}
.ref-explanation {margin: 26px 0px 23px;}
.ref-scene-copy > .button {font-size: 11px; min-height: 25px; gap: 15px;}
.ref-diagram {background: linear-gradient(145deg, rgb(244, 248, 245), rgb(234, 245, 244)); border-radius: 8px; border: 0; padding: 23px 22px 16px; min-width: 0px;}
.ref-diagram-heading {display: flex; align-items: center; justify-content: space-between; font-size: 11px; font-weight: 500; gap: 16px;}
.concept-svg {margin-top: 18px;}
.concept-svg text {font-family: "DM Sans", Arial, sans-serif; fill: rgb(66, 98, 114); font-size: 13px;}
.concept-guide {stroke: rgb(181, 213, 209); stroke-width: 1; opacity: 0.42; fill: none;}


.ref-closing {text-align: center; padding-block: 48px 74px;}
.ref-closing .ref-kicker {justify-content: center; color: rgb(109, 131, 138); }
.ref-closing h2 {font-size: 57px; line-height: 1.1; margin-top: 20px; margin-bottom: 25px;}
.ref-closing > .button {font-size: 12px;}
.ref-footer {display: flex; align-items: center; gap: 28px; border-top: 1px solid rgb(216, 229, 228); padding-block: 25px 110px; font-size: 10px; color: rgb(106, 123, 133);}
.ref-footer img {display: block;}
.ref-footer > span {margin-left: auto;}
@media (min-width: 1600px) {body.temple-page .wrap {width: min(1360px, 100% - 160px);}
.ref-hero {min-height: 690px;}
.ref-hero h1 {font-size: 102px;}
.ref-card-art {height: 225px;}}
@media (max-width: 1100px) {body.temple-page .wrap {width: calc(100% - 64px);}
.ref-hero {min-height: 560px; gap: 15px;}
.ref-hero h1 {font-size: 67px;}
.ref-hero-copy > p {font-size: 13px;}
.ref-hero-copy > p br {display: none;}
.ref-hero .hero-actions {gap: 16px;}
.ref-hero .text-link {font-size: 10px;}

.ref-section-heading h2 {font-size: 44px;}
.ref-card-grid {gap: 16px;}
.ref-card-art {height: 172px;}
.ref-protocol {padding: 36px 32px; gap: 30px;}
.ref-protocol-grid {gap: 18px;}
.ref-protocol h2 {font-size: 33px;}
.ref-protocol h3 {}
body.temple-page .strategy-list .ref-scene {padding: 35px; gap: 35px;}}
@media (max-width: 800px) {body.temple-page .wrap {width: calc(100% - 44px);}
.ref-hero {min-height: 510px;}
.ref-hero h1 {font-size: 53px;}
.ref-hero .ref-kicker {}
.ref-hero-copy > p {font-size: 12px;}

.ref-hero .hero-actions {gap: 18px;}
.ref-hero .button {padding: 12px 16px; font-size: 11px;}
.ref-art {margin-right: -12px;}
.art-coordinate {font-size: 6px;}
.ref-possibilities {padding-block: 60px;}
.ref-card-grid {gap: 12px;}
.ref-card-top {padding: 17px 17px 6px; }
.ref-card-art {margin: 10px 10px 20px; height: 145px;}
.ref-mini-graph {width: calc(100% - 22px); left: 11px;}
.ref-card h3 {font-size: 27px; margin-inline: 17px;}
.ref-card > p {margin-inline: 17px;  min-height: 56px;}
.ref-card-link {margin-inline: 17px; }
.ref-section-heading h2,.ref-explore .ref-section-heading h2 {font-size: 39px;}
.ref-section-heading > p {font-size: 11px;}
.ref-protocol {grid-template-columns: 1fr; gap: 33px; padding: 35px;}
.ref-protocol h2 br {display: none;}
.ref-protocol h2 {font-size: 35px;}
.ref-protocol-grid {gap: 30px;}
.ref-protocol-grid p {max-width: 170px;}
.protocol-motif {margin-bottom: 15px;}
.ref-explore {padding-top: 75px;}
body.temple-page .strategy-list .ref-scene {gap: 25px; padding: 28px; grid-template-columns: 1fr 1fr;}
.ref-scene-copy h3 {font-size: 32px;}
.ref-diagram {padding: 18px 12px;}
.ref-diagram-heading {font-size: 10px;}

.ref-footer {gap: 17px; font-size: 9px;}}
@media (max-width: 600px) {body.temple-page .wrap {width: calc(100% - 40px);}
body.temple-page .site-header {padding-block: 19px; gap: 12px;}
body.temple-page .site-header nav {display: none;}
body.temple-page .site-header .button {font-size: 10px; min-height: 37px; padding: 9px 12px;}
.ref-hero {display: flex; flex-direction: column; gap: 0px; padding: 33px 0px 24px; min-height: 0px;}
.ref-hero-copy {width: 100%; padding: 0px;}
.ref-hero h1 {font-size: clamp(47px, 12vw, 68px); margin-block: 20px; line-height: 1.08;}
.ref-hero-copy > p {font-size: 13px; line-height: 1.8; max-width: 340px;}
.ref-hero .hero-actions {gap: 18px; margin-top: 24px;}
.ref-hero .button {font-size: 11px; padding: 12px 15px; gap: 17px;}
.ref-hero .text-link {font-size: 10px; gap: 8px;}

.ref-art {width: 100%; max-width: 450px; aspect-ratio: 1.15 / 1; min-height: 0px; margin: 14px 0px 0px;}
.ref-art::before {inset: 6% 0px 2%;}
.ref-sun {width: 58%; top: 6%; left: 23%;}
.art-coordinate {font-size: 6px; bottom: -1%;}
.ref-divider {padding-block: 17px; font-size: 7px; gap: 14px;}
.ref-divider > span:nth-child(2) {font-size: 9px;}
.ref-divider > a {width: 24px; height: 24px; font-size: 13px;}
.ref-possibilities {padding-block: 47px 51px;}
.ref-section-heading {display: block; margin-bottom: 27px;}
.ref-section-heading .ref-kicker { margin-bottom: 16px;}
.ref-section-heading h2,.ref-explore .ref-section-heading h2 {font-size: 38px;}
.ref-section-heading > p {font-size: 12px; margin-top: 16px; max-width: none;}
.ref-section-heading > p br {display: none;}
.ref-card-grid {grid-template-columns: 1fr; gap: 19px;}
.ref-card {border-radius: 9px;}
.ref-card-top {padding: 19px 22px 8px; }
.ref-card-art {height: 180px; margin: 9px 14px 22px;}
.ref-mini-graph {width: 85%; height: 165px; left: 7.5%; bottom: 0px;}
.ref-card h3 {font-size: 32px; margin-inline: 23px;}
.ref-card > p { margin-inline: 23px; max-width: none; min-height: 0px;}
.ref-card-link {margin: 21px 23px 0px; padding: 15px 0px; }
.card-motif {height: 95%; top: 2%; right: 9%;}
.ref-protocol {padding: 31px 25px; gap: 30px; border-radius: 8px;}
.ref-protocol .ref-kicker {}
.ref-protocol h2 {font-size: 31px; max-width: 245px; margin-top: 16px;}
.ref-protocol h2 br {display: initial;}
.ref-protocol-heading > p {font-size: 11px;}
.ref-protocol-grid {display: flex; flex-direction: column; gap: 0px;}
.ref-protocol-grid article {position: relative; min-height: 78px; width: 100%; padding: 22px 0px 22px 64px; border-top: 1px solid rgba(204, 236, 226, 0.11);}
.ref-protocol-grid article:last-child {padding-bottom: 0px;}
.protocol-motif {position: absolute; left: 2px; top: 22px; height: 43px; width: 35px;}
.ref-protocol h3 {}
.ref-protocol-grid p {max-width: none;  margin-top: 7px;}
.ref-explore {padding-block: 56px 25px;}
.ref-explore .ref-section-heading {margin-bottom: 27px;}
.ref-explore .ref-section-heading > p {display: none;}
body.temple-page .strategy-list .ref-scene {grid-template-columns: 1fr; gap: 27px; padding: 28px 22px; min-height: 0px;}
.ref-scene-copy h3 {font-size: 35px;}
.ref-scene-copy > .ref-kicker {}
.ref-explanation {margin: 23px 0px 18px;}
.ref-diagram {padding: 18px 11px 14px;}
.ref-diagram-heading {font-size: 10px; padding-inline: 5px;}
.concept-svg {margin-top: 9px;}


.ref-closing {padding-block: 37px 51px;}
.ref-closing h2 {font-size: 43px;}
.ref-closing .ref-kicker {}
.ref-footer {flex-wrap: wrap; justify-content: space-between; gap: 19px 14px; padding-block: 24px 102px; font-size: 9px;}
.ref-footer > span {margin-left: auto;}
.ref-footer img {width: 115px; height: auto;}}
@media (prefers-reduced-motion: reduce) {.ref-art * {animation: auto ease 0s 1 normal none running none !important;}}
.ref-art {overflow: clip;}
.ref-art .architecture {overflow: hidden;}
.ref-hero-copy {min-width: 0px;}
body.temple-page .deity-relief {object-fit: contain; object-position: right bottom; transform: none;}
body.temple-page.temple-page .card-motif {width: 66%; height: 118%; right: -4%; top: -12%; opacity: 0.65;}
body.temple-page.temple-page.temple-page .card-motif {opacity: 0.95;}
body.temple-page .protocol-motif {width: 62px; height: 62px;}
body.temple-page .protocol-motif .greek-motif {width: 100%; height: 100%;}
body.temple-page .ref-story { line-height: 1.85; max-width: 39ch; margin: 24px 0px;}
.payoff-line {fill: none; stroke: rgb(0, 142, 171); stroke-width: 4; stroke-linejoin: round;}
.payoff-nodes {fill: rgb(255, 250, 242); stroke: rgb(0, 142, 171); stroke-width: 2;}
.payoff-axis {fill: none; stroke: rgb(130, 158, 172); stroke-width: 1;}
.payoff-strike {fill: none; stroke: rgb(155, 181, 189); stroke-width: 1; stroke-dasharray: 4, 5;}
body.temple-page .concept-svg text {font-size: 14px;}
@media (max-width: 600px) {body.temple-page .ref-story {max-width: none;}
}

body.temple-page .concept-svg text {font-size: 16px;}
body.temple-page .ref-protocol {--motif-cutout: #16485d;}

@media (max-width: 600px) {body.temple-page .protocol-motif {width: 43px; height: 47px;}
}
body.temple-page .ref-protocol-grid article .protocol-motif {width: 62px; height: 62px;}
@media (max-width: 600px) {body.temple-page .ref-protocol-grid article .protocol-motif {width: 43px; height: 47px;}}
body.temple-page :is(.art-temple, .art-statue) .architecture {width: 100%; position: relative; margin: 0px;}
body.temple-page .art-temple .temple-structure {opacity: 0.8;}
body.temple-page.temple-page .deity-relief {filter: grayscale(1) contrast(1.15); mix-blend-mode: soft-light; opacity: 0.28; mask-image: linear-gradient(to right, transparent, rgb(0, 0, 0) 26%);}
body.temple-page.temple-page.temple-page .deity-relief {opacity: 0.42;}
body.temple-page .illustrated-symbol {background: currentcolor; mask-image: var(--symbol-url); mask-size: contain; mask-repeat: no-repeat; mask-position: center center; display: block;}
body.temple-page .ref-protocol-grid article .protocol-motif {width: 82px; height: 74px; margin-bottom: 18px;}
body.temple-page .ref-diagram-heading h4 {font-family: Marcellus, Georgia, serif; font-weight: 400; font-size: 29px; line-height: 1.2; letter-spacing: -0.035em; margin: 0px; color: rgb(13, 44, 84);}
body.temple-page .concept-svg {margin-top: 0px;}
@media (max-width: 600px) {body.temple-page .ref-protocol-grid article .protocol-motif {width: 49px; height: 52px;}
body.temple-page .ref-diagram-heading h4 {font-size: 25px;}}
body.temple-page :is(.art-temple, .art-statue) .architecture > circle {opacity: 0.15;}
.payoff-unprotected {fill: none; stroke: rgb(183, 124, 103); stroke-width: 2; stroke-dasharray: 6, 5;}
.protection-cushion {fill: rgb(10, 166, 176); opacity: 0.08;}
body.temple-page .concept-svg .protected-label {fill: rgb(0, 129, 147);}
body.temple-page .concept-svg .unprotected-label {fill: rgb(155, 100, 84);}
.comparison-label-leader {fill: none; stroke: rgb(183, 124, 103); stroke-width: 1;}
/* Remove only the space reserved for the retired design controls. */
.ref-footer {padding-bottom:32px}

/* Read the three strategies in page order; alternate only the desktop layout. */
@media (min-width:601px) {
 body.temple-page .strategy-list .ref-scene:nth-child(even) {grid-template-columns:1.04fr 1fr;}
 .ref-scene:nth-child(even) .ref-scene-copy {grid-column:2;grid-row:1;}
 .ref-scene:nth-child(even) .ref-diagram {grid-column:1;grid-row:1;}
}
@media (max-width:600px) {
 .strategy-list {gap:24px;}
}

/* Shared heading hierarchy across all three numbered sections. */
:root {
 --label-size:14px;
 --section-title-size:clamp(34px,3.5vw,48px);
 --content-title-size:clamp(32px,2.7vw,38px);
 --diagram-title-size:clamp(25px,2.1vw,30px);
}
body.temple-page .ref-kicker,
body.temple-page .ref-card-top {
 font-size:var(--label-size);
 font-weight:600;
 line-height:1.5;
 letter-spacing:.08em;
}
body.temple-page .ref-section-heading h2,
body.temple-page .ref-protocol h2 {
 font-size:var(--section-title-size);
 line-height:1.15;
}
body.temple-page .ref-card h3,
body.temple-page .ref-scene-copy h3 {
 font-size:var(--content-title-size);
 line-height:1.15;
}
body.temple-page .ref-diagram-heading h4 {
 font-size:var(--diagram-title-size);
}

/* Longer approved copy keeps the hero balanced with the Temple artwork. */
body.temple-page .ref-hero h1 {font-size:clamp(46px,4.5vw,66px);line-height:1.08;}
body.temple-page .ref-closing h2 {max-width:20ch;margin-inline:auto;}


.spot-line {fill:none;stroke:#b77c67;stroke-width:2;stroke-dasharray:6 5;}
body.temple-page .leverage-comparison text {font-size:14px;}
body.temple-page .leverage-comparison .call-comparison-label {fill:#008193;font-size:16px;}
body.temple-page .leverage-comparison .spot-comparison-label {fill:#9b6454;font-size:16px;}
@media(max-width:600px) {
 body.temple-page .ref-hero h1 {font-size:clamp(36px,10.4vw,48px);}
}

/* The section heading and subtitle read as one stacked introduction. */
.stacked-heading > div {width:100%;}
.stacked-heading h2 > span {display:block;}
.stacked-heading h2 > span + span {margin-top:8px;}

.social-link {display:grid;place-items:center;flex-shrink:0;width:36px;height:40px;color:var(--navy);}
.social-link svg {width:15px;height:15px;}
.social-link:hover {color:var(--accent);}
@media(max-width:600px) {
 .site-header .social-link {width:28px;}
}

@media(max-width:380px) {
 .site-header .brand img {width:100px;height:auto;}
}

/* Balance utility links with the primary action. */
body.temple-page .site-header {gap:18px;}
body.temple-page .site-header nav {font-size:14px;margin-right:0;}
body.temple-page .site-header .button {font-size:14px;min-height:44px;padding:11px 18px;gap:16px;}
body.temple-page .ref-closing > .button {font-size:16px;min-height:56px;padding:16px 28px;gap:24px;}
@media(max-width:600px) {
 body.temple-page .site-header {gap:12px;}
 body.temple-page .site-header .button {font-size:12px;min-height:42px;padding:10px 12px;gap:12px;}
}
@media(max-width:380px) {
 body.temple-page .site-header {gap:8px;}
 .site-header .social-link {width:24px;}
}

/* One reading size for descriptions and their exploration links. */
:root {--body-copy-size:15px;--body-copy-leading:1.85;--protocol-title-size:24px;}
body.temple-page .ref-card > p,
body.temple-page .ref-card-link,
body.temple-page .ref-protocol-grid p,
body.temple-page .ref-story {
 font-size:var(--body-copy-size);
 line-height:var(--body-copy-leading);
}
body.temple-page .ref-protocol h3 {
 font-size:var(--protocol-title-size);
 line-height:1.25;
}

/* Give the three foundation values room before their titles wrap. */
@media (min-width:801px) {
 body.temple-page .ref-protocol {
  grid-template-columns:minmax(220px,260px) minmax(0,1fr);
  gap:32px;
 }
 body.temple-page .ref-protocol-grid {gap:20px;}
}
@media (min-width:801px) and (max-width:1100px) {
 body.temple-page .ref-protocol {gap:24px;}
 body.temple-page .ref-protocol-grid {gap:14px;}
}
@media (min-width:601px) and (max-width:800px) {
 body.temple-page .ref-protocol-grid {gap:18px;}
}
body.temple-page .ref-scene-copy > .button {
 font-size:var(--body-copy-size);
 line-height:var(--body-copy-leading);
}

/* Keep the foundation heading on one line at full desktop width. */
@media (min-width:1200px) {
 body.temple-page .ref-protocol {grid-template-columns:314px minmax(0,1fr);gap:12px;}
 body.temple-page .ref-protocol-grid {gap:14px;}
 body.temple-page .ref-protocol h3 {font-size:23px;}
}
body.temple-page .ref-hero .button,
body.temple-page .ref-hero .text-link {font-size:var(--body-copy-size);}

/* The hero explanation should lead into the actions. */
body.temple-page .ref-hero-copy > p {font-size:17px;line-height:1.7;}
@media(max-width:600px) {
 body.temple-page .ref-hero-copy > p {font-size:16px;line-height:1.7;}
 body.temple-page .ref-art,
 body.temple-page .ref-divider {display:none;}
}

/* Strategy links use the same typography as the explanation above them. */
body.temple-page .ref-scene-copy > .button {
 font-weight:400;
 letter-spacing:normal;
}

/* Signup stays in the closing CTA and shares the current site's FormSubmit flow. */
body.temple-page .signup-form {width:min(100%, 580px);margin-inline:auto;text-align:left;}
body.temple-page .signup-label {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;}
body.temple-page .signup-fields {display:flex;align-items:stretch;gap:10px;}
body.temple-page .signup-fields input[type="email"] {flex:1;min-width:0;min-height:56px;padding:15px 18px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);font:inherit;font-size:16px;}
body.temple-page .signup-fields input[type="email"]::placeholder {color:var(--muted);opacity:1;}
body.temple-page .signup-fields input[type="email"]:focus-visible {outline:3px solid var(--accent-light);outline-offset:2px;}
body.temple-page .signup-fields .button {min-height:56px;padding:15px 16px;font-size:16px;gap:12px;}
body.temple-page .signup-fields .button:disabled {cursor:wait;opacity:.7;transform:none;}
body.temple-page .signup-honey {position:absolute;width:1px;height:1px;padding:0;border:0;clip-path:inset(50%);overflow:hidden;white-space:nowrap;}
body.temple-page .signup-note {min-height:1.7em;margin-top:10px;font-size:14px;}
body.temple-page .signup-note.success {color:#146c60;}
body.temple-page .signup-note.error {color:#a04039;}
@media (max-width:600px) {
 body.temple-page .signup-fields {flex-direction:column;}
 body.temple-page .signup-fields .button {width:100%;}
}