/* A lightweight, CSS-only relief diagram; readable without JavaScript. */
.customer-journey{margin-top:48px;border:1px solid #d9e0e3;border-radius:18px;background:#eef1f2;overflow:hidden}
.journey-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:25px 32px;border-bottom:1px solid #dce3e6;background:#f9faf8}
.journey-heading p{font-size:9px;line-height:1.7;font-weight:800;letter-spacing:1.7px;margin:0;color:#465c6b}
.journey-hint{font-size:10px;color:#536a7b;white-space:nowrap}.journey-hint>span{margin-left:10px;color:#1562d4}
.journey-stages{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;padding:30px 58px 34px;background:radial-gradient(ellipse at 50% 50%,#fff9,transparent 70%)}
.journey-stage{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;text-align:center;border:0;border-radius:12px;color:#142431;cursor:pointer;padding:0 0 10px;-webkit-tap-highlight-color:transparent}
.stage-phase{font-size:8px;font-weight:800;letter-spacing:1.8px;line-height:1.8;color:#617685;margin:5px 0 0}
.stage-object{position:relative;display:block;width:180px;height:145px;perspective:650px;margin:6px 0 3px;pointer-events:none}
.stage-base,.stage-top{position:absolute;display:grid;place-items:center;left:36px;top:14px;width:108px;height:108px;border-radius:18px;transform:rotateX(52deg) rotateZ(-38deg);transform-style:preserve-3d;transition:transform .35s cubic-bezier(.2,.8,.2,1),background .3s,border-color .3s,box-shadow .3s}
.stage-base{top:30px;background:#c7d4df;border:1px solid #b5c7d6;box-shadow:-4px 5px 0 #a4b8c8,-8px 10px 0 #d7e0e7}
.stage-top{background:linear-gradient(135deg,#fff,#e6edf3);border:1px solid #fff;box-shadow:-2px 3px 0 #c7d4df,0 0 0 1px #c8d5e0}
.stage-shadow{position:absolute;left:27px;right:27px;bottom:8px;height:34px;border-radius:50%;background:#13314f20;filter:blur(12px);transform:rotate(-5deg)}
.stage-top svg{width:48px;height:48px;fill:none;stroke:#537c9f;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transform:rotateZ(38deg)}
.stage-name{font-size:19px;font-weight:700;letter-spacing:-.6px;line-height:1.4}
.stage-purpose{margin-top:7px;font-size:11px;line-height:1.6;color:#60727f}
.journey-stage:hover .stage-top,.journey-stage:focus-visible .stage-top{transform:translateY(-7px) rotateX(52deg) rotateZ(-38deg);border-color:#93b9db}
.journey-stage[aria-selected="true"] .stage-top{transform:translateY(-12px) rotateX(52deg) rotateZ(-38deg);background:linear-gradient(135deg,#254c6e,#0b2135);border-color:#5586af;box-shadow:-3px 4px 0 #061829,0 0 0 1px #8fafca,0 12px 22px #2a5f8d24}
.journey-stage[aria-selected="true"] .stage-top svg{stroke:#d2e9ff}
.journey-stage[aria-selected="true"] .stage-phase,.journey-stage[aria-selected="true"] .stage-name{color:#185d96}
.journey-connector{position:absolute;pointer-events:none;left:calc(58px + (100% - 188px)/6);right:calc(58px + (100% - 188px)/6);top:124px;height:1px;background:linear-gradient(90deg,#afc6d7,#7297b6,#afc6d7)}
.journey-connector i{position:absolute;top:-3px;width:7px;height:7px;border-top:1px solid #799cb8;border-right:1px solid #799cb8;transform:rotate(45deg);left:25%}
.journey-connector i:last-child{left:75%}
.journey-details{margin:0 32px 30px;border:1px solid #dbe3e9;border-radius:11px;background:#fff;box-shadow:0 8px 20px #142f4905}
.journey-detail{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:28px;padding:25px 28px;min-height:126px;scroll-margin-top:30px}
.journey-detail+.journey-detail{border-top:1px solid #dbe3e9}
.journey-detail[hidden]{display:none}
.customer-journey.is-interactive .journey-detail{border-top:0}
.detail-title>span{font-size:8px;letter-spacing:1.3px;font-weight:800;color:#59778e;line-height:1.7}
.detail-title h3{font-size:21px;letter-spacing:-.7px;font-weight:600;margin:8px 0 0;line-height:1.3}
.journey-detail ul{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:9px}
.journey-detail li{font-size:11px;line-height:1.5;border:1px solid #dce5ec;border-radius:5px;background:#f5f8fa;padding:8px 12px;color:#39556c}
.journey-foundation{padding:0 32px 30px}
.foundation-heading{display:flex;align-items:center;justify-content:center;gap:18px;margin:0 0 19px}
.foundation-heading p{font-size:8px;font-weight:800;letter-spacing:1.7px;color:#567082;white-space:nowrap;margin:0;line-height:1.7}
.foundation-heading>span{height:1px;flex:1;background:#cdd9e1;position:relative}
.foundation-heading>span:first-child:before,.foundation-heading>span:last-child:after{content:'';position:absolute;top:-7px;width:1px;height:8px;background:#cdd9e1}
.foundation-heading>span:last-child:after{right:0}
.foundation-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:start}
.foundation-grid details{min-width:0;background:#11283a;border:1px solid #253f52;border-radius:9px;color:#eaf0f5;overflow:hidden}
.foundation-grid summary{display:flex;align-items:center;gap:12px;list-style:none;cursor:pointer;padding:20px 17px;font-size:12px;font-weight:600;line-height:1.5;min-height:91px}
.foundation-grid summary::-webkit-details-marker{display:none}
.foundation-grid summary:focus-visible{outline:2px solid #a9cced;outline-offset:-5px;border-radius:8px}
.foundation-grid summary small{display:block;font-size:9px;color:#a5bdcf;font-weight:400;margin-top:5px;line-height:1.6}
.foundation-icon{flex:0 0 28px;font-size:18px;letter-spacing:-1px;color:#a5cdef;text-align:center;font-weight:400}
.foundation-toggle{margin-left:auto;color:#acc8df;font-size:20px;font-weight:400;transition:transform .2s;flex-shrink:0}
.foundation-grid details[open] .foundation-toggle{transform:rotate(45deg)}
.foundation-grid ul{padding:0 20px 20px 57px;margin:0;list-style:none;display:grid;gap:7px;font-size:11px;color:#c5d7e4;line-height:1.6}
.foundation-grid summary:hover{background:#1a344a}
@media(max-width:1100px){.journey-stages{padding-inline:24px;gap:20px}.journey-connector{left:18%;right:18%}.foundation-grid summary{padding:18px 13px;gap:9px;font-size:11px}.foundation-icon{flex-basis:22px;font-size:16px}.foundation-grid ul{padding-left:44px}.stage-name{font-size:17px}}
@media(max-width:800px){.journey-heading{padding:22px 24px;display:block}.journey-hint{display:block;margin-top:8px;font-size:10px}.journey-details{margin-inline:24px}.journey-foundation{padding-inline:24px}.foundation-grid{grid-template-columns:1fr}.foundation-grid summary{min-height:78px;padding:17px 22px;font-size:13px;gap:15px}.foundation-icon{flex-basis:28px;font-size:19px}.foundation-grid ul{padding-left:65px}.stage-object{transform:scale(.88);margin:-3px -8px -8px}.stage-purpose{font-size:10px}.journey-detail{grid-template-columns:1fr;gap:17px;padding:23px;min-height:175px}}
@media(max-width:600px){
 .customer-journey{margin-top:32px;border-radius:13px}.journey-heading{padding:20px 18px}.journey-heading p{font-size:8px;letter-spacing:1.3px}.journey-hint{font-size:9px}
 .journey-stages{gap:8px;padding:24px 12px 27px;align-items:start}.stage-phase{font-size:6px;letter-spacing:.6px}.stage-object{width:85px;height:92px;transform:none;margin:6px 0 6px;perspective:400px}.stage-base,.stage-top{width:57px;height:57px;left:14px;top:11px;border-radius:10px}.stage-base{top:22px;box-shadow:-2px 3px 0 #a4b8c8,-4px 5px 0 #d7e0e7}.stage-top svg{width:30px;height:30px}.stage-shadow{left:8px;right:8px;bottom:10px;height:15px;filter:blur(8px)}
 .journey-stage[aria-selected="true"] .stage-top{transform:translateY(-6px) rotateX(52deg) rotateZ(-38deg)}.journey-connector{top:89px;left:18%;right:18%}.journey-connector i{height:5px;width:5px;top:-2px}.stage-name{font-size:11px;letter-spacing:-.2px;line-height:1.5}.stage-purpose{font-size:8px;line-height:1.6;margin-top:5px;max-width:95px}.journey-stage{padding-bottom:4px}
 .journey-details{margin:0 14px 24px}.journey-detail{padding:19px 17px;min-height:190px;gap:16px}.detail-title>span{font-size:7px;letter-spacing:1px}.detail-title h3{font-size:20px}.journey-detail ul{gap:7px}.journey-detail li{font-size:10px;padding:7px 9px}
 .journey-foundation{padding:0 14px 18px}.foundation-heading{gap:10px;margin-bottom:16px}.foundation-heading p{font-size:7px;letter-spacing:1px}.foundation-grid{gap:9px}.foundation-grid summary{padding:17px 14px;font-size:12px;gap:10px;min-height:75px}.foundation-grid summary small{font-size:9px}.foundation-grid ul{padding-left:52px;font-size:11px}
}
@media(prefers-reduced-motion:reduce){.customer-journey *{transition:none!important}}