:root { --lake: #73999a; --lake-dark: #10292b; }
.zen-page { background: #0a0d0c; }
.zen-hero { min-height: 920px; background-image: linear-gradient(90deg,rgba(5,8,7,.97) 0%,rgba(5,8,7,.83) 48%,rgba(5,8,7,.3) 78%),url("../../assets/zen-koggala/zen-koggala-lake-aerial.webp"); background-size: cover; background-position: center; }
.zen-hero h1 em { color: #d4b36a; }
.zen-hero aside { border-color: rgba(115,153,154,.75); }
.zen-hero aside span { color: #a9cecf; }
.zen-page .project-facts { background: #b5cdca; }
.zen-intro { grid-template-columns: .5fr 1.15fr .85fr; }
.view-diagram { min-height: 500px; display: grid; place-items: center; background: radial-gradient(circle,#294547 0 18%,transparent 19%),conic-gradient(from 40deg,#73999a 0 280deg,#151a18 280deg 360deg); border-radius: 50%; }
.view-diagram > div { width: 58%; aspect-ratio: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 50%; background: #0c0f0e; text-align: center; }
.view-diagram strong { color: #d4b36a; font-size: 84px; font-weight: 300; letter-spacing: -.08em; }
.view-diagram span { color: #aabfbd; font-family: var(--mono); font-size: 11px; line-height: 1.6; }
.zen-plan { position: relative; height: min(72vw,840px); margin: 0 5vw 9vw; overflow: hidden; background: #e5dccb; }
.zen-plan img { filter: saturate(.72) contrast(1.03); }
.zen-plan::after { content: ""; position: absolute; inset: 52% 0 0; background: linear-gradient(transparent,rgba(10,13,12,.88)); }
.zen-plan figcaption { position: absolute; z-index: 1; right: 35px; bottom: 32px; left: 35px; display: flex; align-items: end; justify-content: space-between; gap: 60px; }
.zen-plan figcaption span,.connectivity-copy>span,.owner-vision>div>span,.mission-band>span,.zen-team>div>span { color: #d4b36a; font-family: var(--mono); font-size: 11px; letter-spacing: .1em; }
.zen-plan figcaption p { max-width: 650px; margin: 0; color: #e2e5de; font-size: 17px; line-height: 1.7; }
.connectivity { padding: 11vw 8vw; display: grid; grid-template-columns: 1.1fr .9fr; gap: 8vw; align-items: center; background: var(--lake-dark); }
.connectivity h2,.owner-vision h2,.mission-band h2 { margin: 34px 0 45px; font-size: clamp(54px,6vw,96px); font-weight: 300; line-height: .95; letter-spacing: -.065em; }
.connectivity p,.owner-vision p,.mission-band p { color: #b7c2be; font-size: 17px; line-height: 1.8; }
.orbit-visual { position: relative; aspect-ratio: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 50%; background: radial-gradient(circle,rgba(212,179,106,.18),transparent 58%); }
.orbit { position: absolute; border: 1px solid rgba(169,206,207,.5); border-radius: 50%; transform: rotate(-24deg); }
.orbit-one { inset: 12%; }.orbit-two { inset: 25%; transform: rotate(33deg); }
.orbit-visual strong { color: #d4b36a; font-size: clamp(48px,6vw,88px); font-weight: 300; letter-spacing: -.06em; }
.orbit-visual span { margin-top: 18px; color: #a9cecf; font-family: var(--mono); font-size: 11px; line-height: 1.6; text-align: center; }
.experience-grid { display: grid; grid-template-columns: repeat(4,1fr); background: #eef0e9; color: #111; }
.experience-grid article { min-height: 350px; padding: 40px 32px; border-right: 1px solid rgba(17,17,17,.22); }
.experience-grid b { color: #7d6a3d; font-family: var(--mono); font-size: 11px; font-weight: 400; }
.experience-grid h3 { margin: 90px 0 24px; font-size: 36px; font-weight: 400; }
.experience-grid p { color: #626760; font-size: 16px; line-height: 1.75; }
.owner-vision { padding: 10vw 8vw; display: grid; grid-template-columns: 1.05fr .95fr; gap: 8vw; align-items: center; }
.owner-vision figure { height: 680px; margin: 0; }
.owner-vision figure img { filter: saturate(.72) brightness(.78); }
.owner-value { padding: 10vw 8vw; background: #eef0e9; color: #111; }
.owner-value header { display: grid; grid-template-columns: .5fr 1.5fr; gap: 5vw; align-items: start; }
.owner-value header span,.case-faq header span { color: #7d6a3d; font-family: var(--mono); font-size: 11px; letter-spacing: .1em; }
.owner-value h2,.case-faq h2 { max-width: 1000px; margin: 0; font-size: clamp(54px,6vw,96px); font-weight: 300; line-height: .95; letter-spacing: -.065em; }
.owner-value-grid { margin: 8vw 0 0 25%; display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid rgba(17,17,17,.7); }
.owner-value-grid article { min-height: 310px; padding: 34px 40px 40px 0; border-bottom: 1px solid rgba(17,17,17,.22); }
.owner-value-grid article:nth-child(even) { padding-left: 40px; border-left: 1px solid rgba(17,17,17,.22); }
.owner-value-grid b { color: #8b7136; font-family: var(--mono); font-size: 11px; font-weight: 400; }
.owner-value-grid h3 { margin: 72px 0 22px; font-size: 30px; font-weight: 500; letter-spacing: -.035em; }
.owner-value-grid p { max-width: 470px; margin: 0; color: #626760; font-size: 17px; line-height: 1.75; }
.mission-band { padding: 11vw 9vw; background: #b5cdca; color: #0c1716; }
.mission-band h2 { max-width: 1250px; }
.mission-band p { max-width: 800px; margin-left: 35%; color: #384d4b; }
.mission-band a { display: inline-flex; gap: 45px; margin: 45px 0 0 35%; padding-bottom: 8px; border-bottom: 1px solid; font-family: var(--mono); font-size: 12px; text-transform: uppercase; }
.mission-band a b { color: #7d5d20; }
.case-faq { padding: 10vw 8vw; display: grid; grid-template-columns: .82fr 1.18fr; gap: 8vw; background: #0e1110; }
.case-faq h2 { margin-top: 32px; color: #f1f1eb; font-size: clamp(44px,4.8vw,76px); }
.case-faq details { border-top: 1px solid rgba(255,255,255,.2); }
.case-faq details:last-child { border-bottom: 1px solid rgba(255,255,255,.2); }
.case-faq summary { position: relative; min-height: 112px; padding: 36px 60px 30px 0; color: #f1f1eb; font-size: 20px; line-height: 1.45; cursor: pointer; list-style: none; }
.case-faq summary::-webkit-details-marker { display: none; }
.case-faq summary::after { content: "+"; position: absolute; top: 34px; right: 4px; color: #d4b36a; font-family: var(--mono); font-size: 28px; font-weight: 300; }
.case-faq summary:focus-visible { outline: 2px solid #d4b36a; outline-offset: 5px; }
.case-faq details[open] summary::after { content: "−"; }
.case-faq details p { max-width: 720px; margin: 0 0 34px; color: #aab2ac; font-size: 17px; line-height: 1.75; }
.zen-team { padding: 10vw; display: grid; grid-template-columns: .9fr 1.1fr; gap: 8vw; align-items: center; background: #121513; }
.zen-team figure { height: 670px; margin: 0; }
.zen-team blockquote { margin: 48px 0 70px; font-size: clamp(46px,5vw,78px); font-weight: 300; line-height: 1.02; letter-spacing: -.055em; }
.zen-team h3 { margin: 0; font-size: 21px; font-weight: 500; }
.zen-team p { color: #929a94; font-family: var(--mono); font-size: 11px; }
.zen-team a { display: inline-flex; gap: 45px; margin-top: 45px; padding-bottom: 8px; border-bottom: 1px solid; font-family: var(--mono); font-size: 12px; text-transform: uppercase; }
.zen-team a b { color: #d4b36a; }
.status-note { max-width: 950px; margin: 0; padding: 45px 5vw; color: #858b85; font-size: 13px; line-height: 1.7; background: #0c0f0e; }
@media(max-width:900px){.zen-hero{min-height:860px}.zen-intro,.connectivity,.owner-vision,.zen-team,.case-faq{grid-template-columns:1fr}.view-diagram{width:min(100%,520px);justify-self:center}.zen-plan{height:650px;margin:0 20px 90px}.zen-plan figcaption{display:block;right:22px;bottom:22px;left:22px}.zen-plan figcaption p{margin-top:12px}.connectivity,.owner-vision,.zen-team,.owner-value,.case-faq{padding:90px 20px}.experience-grid{grid-template-columns:1fr 1fr}.experience-grid article:nth-child(2){border-right:0}.owner-vision figure,.zen-team figure{height:560px}.owner-value header{grid-template-columns:1fr}.owner-value-grid{margin-left:0}.mission-band{padding:90px 20px}.mission-band p,.mission-band a{margin-left:0}.status-note{padding:35px 20px}}
@media(max-width:700px){.zen-hero aside{display:none}}
@media(max-width:520px){.zen-hero h1{font-size:48px}.view-diagram strong{font-size:65px}.zen-plan{height:540px}.experience-grid{grid-template-columns:1fr}.experience-grid article{min-height:290px;border-right:0;border-bottom:1px solid rgba(17,17,17,.2)}.experience-grid h3{margin-top:55px}.connectivity h2,.owner-vision h2,.mission-band h2,.owner-value h2,.case-faq h2{font-size:46px}.owner-vision figure,.zen-team figure{height:460px}.owner-value-grid{grid-template-columns:1fr}.owner-value-grid article,.owner-value-grid article:nth-child(even){min-height:auto;padding:30px 0 35px;border-left:0}.owner-value-grid h3{margin-top:45px}.case-faq{gap:55px}.case-faq summary{font-size:18px}.mission-band a{font-size:11px}}

/* 29 Sep 2026 review: text colours measured with axe-core against WCAG AA (4.5:1 body, 3:1 large). Same hues, slightly deeper. */
.owner-value-grid b{color:#806832}
.mission-band>span{color:#644e1d}
.case-faq header span{color:#927b47}
/* The hero now uses the real aerial photograph (bright daylight), not the AI golden-hour image.
   Positioned on the terracotta buildings; a stronger scrim keeps the white text readable. */
.zen-hero{background-image:linear-gradient(90deg,rgba(5,8,7,.97) 0%,rgba(5,8,7,.88) 48%,rgba(5,8,7,.45) 80%),url("../../assets/zen-koggala/zen-koggala-lake-aerial.webp");background-position:72% 78%}
@media(max-width:900px){.zen-hero{background-image:linear-gradient(180deg,rgba(5,8,7,.9) 0%,rgba(5,8,7,.84) 62%,rgba(5,8,7,.62) 100%),url("../../assets/zen-koggala/zen-koggala-lake-aerial-900.webp")}}