.cafm-stage-page { --cafm-green:#007b67; --cafm-green-dark:#00584e; --cafm-navy:#08234d; --cafm-text:#314663; --cafm-muted:#67768a; --cafm-line:#dce7e5; overflow:hidden; background:#fff; color:var(--cafm-text); font-family:Poppins,sans-serif; }
.cafm-stage-page *, .cafm-stage-page *::before, .cafm-stage-page *::after { box-sizing:border-box; }
.cafm-stage-container { width:min(1380px,calc(100% - 64px)); margin:0 auto; }
.cafm-stage-page svg { width:100%; height:100%; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.7; }
.cafm-stage-page h1, .cafm-stage-page h2, .cafm-stage-page h3 { color:var(--cafm-navy); font-family:'Work Sans',Poppins,sans-serif; }
.cafm-stage-eyebrow { margin:0 0 .85rem; color:var(--cafm-green); font-size:.7rem; font-weight:800; letter-spacing:.11em; line-height:1.3; text-transform:uppercase; }
.cafm-stage-hero { padding:8rem 0 2.5rem; background:linear-gradient(135deg,#fff 0%,#fff 68%,#f3faf8 100%); }
.cafm-stage-hero-grid { display:grid; grid-template-columns:minmax(23rem,.68fr) minmax(0,1.32fr); gap:clamp(1.5rem,2.4vw,2.5rem); align-items:start; }
.cafm-stage-hero h1 { max-width:44rem; margin:0; font-size:clamp(3rem,4.5vw,5rem); font-weight:700; letter-spacing:-.064em; line-height:1.02; }
.cafm-stage-hero h1 span, .cafm-stage-heading h2 span { color:var(--cafm-green); }
.cafm-stage-lead { max-width:43rem; margin:1.3rem 0 0; font-size:clamp(.94rem,1.05vw,1.06rem); line-height:1.72; }
.cafm-stage-actions, .cafm-stage-final-actions { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.7rem; }
.cafm-stage-button, .cafm-stage-button:visited { display:inline-flex; min-height:3rem; gap:.6rem; align-items:center; justify-content:center; padding:.68rem 1.05rem; border:1px solid var(--cafm-green); border-radius:.48rem; background:var(--cafm-green); color:#fff; font-size:.76rem; font-weight:700; line-height:1.2; text-decoration:none; transition:box-shadow 180ms ease,transform 180ms ease; }
.cafm-stage-button:hover, .cafm-stage-button:focus { box-shadow:0 .9rem 1.8rem rgba(0,80,72,.18); color:#fff; transform:translateY(-2px); }
.cafm-stage-button svg { width:1rem; height:1rem; }
.cafm-stage-hero-visual { min-width:0; margin:calc(1.76rem + clamp(1.53rem,2.295vw,2.55rem)) 0 0; overflow:hidden; padding:.35rem; border:1px solid var(--cafm-line); border-radius:1rem; background:#fff; box-shadow:0 1.1rem 2.7rem rgba(8,35,77,.08); }
.cafm-stage-hero-visual img { display:block; width:100%; height:auto; border-radius:.72rem; object-fit:contain; }
.cafm-stage-signal-section { padding:1rem 0 2rem; }
.cafm-stage-signals { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); overflow:hidden; border:1px solid var(--cafm-line); border-radius:.85rem; background:#fff; box-shadow:0 .8rem 2rem rgba(8,35,77,.05); }
.cafm-stage-signals>div { display:flex; gap:.75rem; align-items:center; min-width:0; min-height:5.5rem; padding:.8rem clamp(.8rem,1.6vw,1.45rem); border-right:1px solid var(--cafm-line); }
.cafm-stage-signals>div:last-child { border-right:0; }
.cafm-stage-signals span, .cafm-stage-icon { display:grid; flex:0 0 auto; width:3.1rem; height:3.1rem; padding:.72rem; border:1px solid var(--cafm-line); border-radius:.65rem; background:#eff9f6; color:var(--cafm-green-dark); place-items:center; }
.cafm-stage-signals strong { color:var(--cafm-navy); font-size:.72rem; line-height:1.4; }
.cafm-stage-features, .cafm-stage-workflow, .cafm-stage-outcomes, .cafm-stage-details { padding:2.5rem 0; border-top:1px solid #edf1f2; }
/* Keep heading space inside the divider, separate from the shared section gap. */
.cafm-stage-page > :is(.cafm-stage-features, .cafm-stage-workflow, .cafm-stage-details) > .cafm-stage-container { padding-top:2rem; }
.cafm-stage-heading.is-centred { max-width:69rem; margin:0 auto 2rem; text-align:center; }
.cafm-stage-heading h2 { margin:0; font-size:clamp(2.15rem,3.3vw,3.55rem); font-weight:700; letter-spacing:-.055em; line-height:1.04; }
.cafm-stage-heading p { margin:.75rem auto 0; color:var(--cafm-muted); font-size:.86rem; line-height:1.65; }
.cafm-stage-feature-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1rem; }
.cafm-stage-feature-grid article { min-width:0; min-height:17rem; padding:1.35rem; border:1px solid var(--cafm-line); border-radius:.8rem; background:#fff; box-shadow:0 .8rem 2rem rgba(8,35,77,.04); transition:box-shadow 180ms ease,transform 180ms ease; }
.cafm-stage-feature-grid article:hover, .cafm-stage-outcome-grid article:hover, .cafm-stage-detail-grid article:hover { box-shadow:0 1rem 2.2rem rgba(8,35,77,.09); transform:translateY(-4px); }
.cafm-stage-feature-grid h3 { margin:1rem 0 0; font-size:.92rem; line-height:1.4; }
.cafm-stage-feature-grid p { margin:.7rem 0 0; color:var(--cafm-muted); font-size:.7rem; line-height:1.62; }
.cafm-stage-workflow { background:radial-gradient(circle at 50% 42%,rgba(0,123,103,.07),transparent 28rem),#f8fbfa; }
.cafm-stage-workflow-grid { position:relative; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1.5rem; margin:2.8rem 0 0; padding:0; list-style:none; }
.cafm-stage-workflow-grid::before { position:absolute; z-index:0; top:2.1rem; right:10%; left:10%; border-top:1px solid #84bdb3; content:''; }
.cafm-stage-workflow-grid li { position:relative; z-index:1; display:grid; grid-template-rows:4.2rem minmax(2.6rem,auto) minmax(4.4rem,1fr); row-gap:1rem; min-width:0; height:100%; text-align:center; }
.cafm-stage-step-icon { display:grid; width:4.2rem; height:4.2rem; margin:0 auto; padding:1rem; border:1px solid rgba(0,123,103,.18); border-radius:50%; background:#fff; color:var(--cafm-green-dark); box-shadow:0 .8rem 2rem rgba(8,35,77,.08); place-items:center; }
.cafm-stage-workflow-grid strong { display:flex; align-items:flex-start; justify-content:center; color:var(--cafm-navy); font-size:.82rem; line-height:1.45; }
.cafm-stage-workflow-grid p { max-width:15rem; min-height:4.4rem; margin:0 auto; color:var(--cafm-muted); font-size:.68rem; line-height:1.62; }
.cafm-stage-outcome-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; }
.cafm-stage-outcome-grid article { display:grid; grid-template-columns:4rem minmax(0,1fr); gap:1rem; min-height:13rem; padding:1.3rem; border:1px solid var(--cafm-line); border-radius:.8rem; background:#fff; box-shadow:0 .8rem 2rem rgba(8,35,77,.04); transition:box-shadow 180ms ease,transform 180ms ease; }
.cafm-stage-outcome-grid .cafm-stage-icon { width:4rem; height:4rem; padding:.85rem; border-radius:1rem; }
.cafm-stage-outcome-grid h3 { margin:0; font-size:.88rem; line-height:1.4; }
.cafm-stage-outcome-grid p { margin:.55rem 0 0; color:var(--cafm-muted); font-size:.69rem; line-height:1.62; }
.cafm-stage-detail-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.cafm-stage-detail-grid article { min-width:0; padding:1rem; border:1px solid var(--cafm-line); border-radius:.8rem; background:#fff; box-shadow:0 .8rem 2rem rgba(8,35,77,.04); transition:box-shadow 180ms ease,transform 180ms ease; }
.cafm-stage-detail-visual { display:flex; align-items:center; justify-content:center; aspect-ratio:4/3; padding:.45rem; border:1px solid var(--cafm-line); border-radius:.55rem; background:#fff; }
.cafm-stage-detail-grid img { display:block; width:100%; height:auto; }
/* Mask only decorative areas of the original live-page screenshots. */
.cafm-stage-detail-grid img[src$="cafm-live-asset-location.png"] { clip-path: polygon(10.3125% 12.0727%, 82.6563% 12.0727%, 82.6563% 41.7455%, 99.1667% 41.7455%, 99.1667% 71.2727%, 88.5417% 71.2727%, 88.5417% 89.7455%, 4.5313% 89.7455%, 4.5313% 66.6909%, 23.5938% 66.6909%, 23.5938% 52.8727%, 10.3125% 52.8727%); }
.cafm-stage-detail-grid img[src$="cafm-live-resource-planning.png"] { clip-path: polygon(34.7917% 8.7561%, 92.3958% 8.7561%, 92.3958% 51.4941%, 61.7188% 51.4941%, 61.7188% 54.4128%, 92.1354% 54.4128%, 92.1354% 80.8895%, 61.7188% 80.8895%, 61.7188% 87.8388%, 7.5000% 87.8388%, 7.5000% 30.2988%, 34.7917% 30.2988%); }
.cafm-stage-detail-grid img[src$="cafm-live-field-reporting.png"] { clip-path: polygon(53.3333% 6.0942%, 92.2917% 6.0942%, 92.2917% 67.8670%, 78.8021% 67.8670%, 78.8021% 87.6039%, 14.0104% 87.6039%, 14.0104% 13.8504%, 53.3333% 13.8504%); }
.cafm-stage-detail-grid h3 { margin:1rem 0 0; font-size:.94rem; line-height:1.4; }
.cafm-stage-detail-grid p { margin:.5rem 0 0; color:var(--cafm-muted); font-size:.72rem; line-height:1.55; }
.cafm-stage-final-cta.reference-closing { padding:3.4rem 0 3rem; background:linear-gradient(115deg,#007b67,#00584e); }
.cafm-stage-final-grid.staging-closing-panel { grid-template-columns:minmax(0,1fr) auto; max-width:none; border:0; background:transparent; box-shadow:none; }
.cafm-stage-final-grid .staging-closing-title, .cafm-stage-final-grid .staging-closing-copy, .cafm-stage-final-grid .staging-closing-signals { color:#fff; }
.cafm-stage-final-grid .staging-closing-signals { border-top-color:rgba(255,255,255,.2); }
@media (max-width:1180px) { .cafm-stage-hero-grid{grid-template-columns:minmax(22rem,.72fr) minmax(0,1.28fr);gap:2rem}.cafm-stage-feature-grid,.cafm-stage-workflow-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.cafm-stage-feature-grid article{min-height:14rem}.cafm-stage-workflow-grid{gap:2.25rem 1rem}.cafm-stage-workflow-grid::before{display:none} }
@media (max-width:960px) { .cafm-stage-hero-grid,.cafm-stage-final-grid.staging-closing-panel{grid-template-columns:1fr}.cafm-stage-hero-copy{max-width:54rem}.cafm-stage-hero-visual{width:min(100%,54rem);margin:2rem auto 0}.cafm-stage-signals{grid-template-columns:repeat(3,minmax(0,1fr))}.cafm-stage-outcome-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cafm-stage-final-actions{justify-content:flex-start} }
@media (max-width:720px) { .cafm-stage-container{width:calc(100% - 32px)}.cafm-stage-hero{padding:7rem 0 2rem}.cafm-stage-hero h1{font-size:clamp(2.55rem,11vw,3.4rem)}.cafm-stage-actions,.cafm-stage-final-actions{display:grid;grid-template-columns:1fr}.cafm-stage-button{width:100%}.cafm-stage-signals,.cafm-stage-feature-grid,.cafm-stage-workflow-grid,.cafm-stage-outcome-grid,.cafm-stage-detail-grid{grid-template-columns:1fr}.cafm-stage-signals>div{border-right:0;border-bottom:1px solid var(--cafm-line)}.cafm-stage-signals>div:last-child{border-bottom:0}.cafm-stage-feature-grid article,.cafm-stage-outcome-grid article{min-height:0}.cafm-stage-workflow-grid{gap:2rem}.cafm-stage-workflow-grid::before{display:block;top:2.1rem;bottom:2.1rem;left:2.1rem;width:0;border-top:0;border-left:1px solid #84bdb3}.cafm-stage-workflow-grid li{grid-template-columns:4.2rem minmax(0,1fr);grid-template-rows:auto auto;column-gap:1rem;row-gap:0;align-items:start;height:auto;text-align:left}.cafm-stage-step-icon{grid-row:1/3;margin:0}.cafm-stage-workflow-grid strong,.cafm-stage-workflow-grid p{grid-column:2;max-width:none;min-height:0;margin-left:0;justify-content:flex-start}.cafm-stage-workflow-grid p{margin-top:.45rem} }
@media (prefers-reduced-motion:reduce) { .cafm-stage-button,.cafm-stage-feature-grid article,.cafm-stage-outcome-grid article,.cafm-stage-detail-grid article{transition:none} }