/* An open, moving conversation stage for the three homepage stories. */
.reference-layout .flower-story{--stage-accent:#65ddff}
.reference-layout .flower-story[data-network-active="personal"]{--stage-accent:#b9a0ff}
.reference-layout .flower-story[data-network-active="pricing"]{--stage-accent:#7ff5cc}
.reference-layout .flower-story[data-network-active="features"]{--stage-accent:#ffd18a}
.reference-layout .flower-panel,.reference-layout [data-step="0"] .flower-panel{position:relative;isolation:isolate;overflow:visible;width:min(660px,48%);min-height:0;padding:0;background:none;border:0;border-radius:0;box-shadow:none}
.reference-layout .flower-panel::before{content:"";position:absolute;z-index:-1;top:8%;right:-5%;width:72%;aspect-ratio:1;border:1px solid color-mix(in srgb,var(--stage-accent) 55%,transparent);border-radius:50%;background:radial-gradient(circle,transparent 40%,color-mix(in srgb,var(--stage-accent) 9%,transparent) 41%,transparent 42%,transparent 61%,color-mix(in srgb,var(--stage-accent) 8%,transparent) 62%,transparent 63%);box-shadow:0 0 90px color-mix(in srgb,var(--stage-accent) 18%,transparent),inset 0 0 50px color-mix(in srgb,var(--stage-accent) 10%,transparent);opacity:.8;animation:stage-breathe 5s ease-in-out infinite;pointer-events:none}
.reference-layout .flower-panel::after{content:"";position:absolute;z-index:-1;top:11%;right:-2%;width:10px;height:10px;border-radius:50%;background:var(--stage-accent);box-shadow:0 0 12px 4px var(--stage-accent);animation:stage-orbit 10s linear infinite;pointer-events:none}
.reference-layout .story-topline{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 0 22px;padding:0 3px;color:#def8ff;font-size:12px;font-weight:750;letter-spacing:.04em;text-shadow:0 2px 12px #001625}
.reference-layout .story-brand-label{display:inline-flex;align-items:center;gap:9px}
.reference-layout .story-brand-label i{display:block;width:8px;height:8px;border-radius:50%;background:var(--stage-accent);box-shadow:0 0 0 5px color-mix(in srgb,var(--stage-accent) 20%,transparent),0 0 14px var(--stage-accent);animation:stage-beacon 2s ease-in-out infinite}
.reference-layout .story-counter{padding:7px 12px;border:1px solid color-mix(in srgb,var(--stage-accent) 45%,transparent);border-radius:999px;background:#071c33a8;color:#e8fbff;font-size:11px;font-variant-numeric:tabular-nums}
.reference-layout .story-panels{position:relative}
.reference-layout .story-slide,.reference-layout [data-step="0"] .story-slide{display:none}
.reference-layout .story-slide.is-active,.reference-layout [data-step="0"] .story-slide.is-active{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-content:start;gap:0;animation:stage-enter .5s ease both}
.reference-layout .story-slide :is(h1,h2){position:relative;grid-column:1/12;width:fit-content;max-width:100%;margin:0;padding:20px 23px;background:linear-gradient(135deg,#082840e8,#103953d9);border:1px solid #a8dff170;border-radius:22px 22px 7px 22px;box-shadow:0 18px 36px #0013218c,inset 0 1px #c5f5ff29;color:white;text-shadow:0 2px 15px #001727}
.reference-layout .story-slide :is(h1,h2)::after{content:"";position:absolute;right:17px;bottom:-9px;width:16px;height:16px;background:#103953;border-right:1px solid #a8dff170;border-bottom:1px solid #a8dff170;transform:rotate(45deg)}
.reference-layout .story-slide :is(.price-story-statement,.story-lead){position:relative;grid-column:4/13;justify-self:end;width:fit-content;max-width:100%;margin:23px 0 0;padding:18px 22px;background:linear-gradient(125deg,#075982ec,#0a4069ec);border:1px solid #8ce9ff9c;border-radius:22px 22px 22px 7px;box-shadow:0 16px 34px #00192b8c,0 0 30px color-mix(in srgb,var(--stage-accent) 22%,transparent);color:#fff;text-shadow:0 1px 10px #002238}
.reference-layout .story-slide :is(.price-story-statement,.story-lead)::after{content:"";position:absolute;left:17px;bottom:-9px;width:16px;height:16px;background:#0a4069;border-left:1px solid #8ce9ff9c;border-bottom:1px solid #8ce9ff9c;transform:rotate(-45deg)}
.reference-layout .story-slide.is-active :is(h1,h2){animation:stage-message-in .55s cubic-bezier(.18,.8,.2,1) both}
.reference-layout .story-slide.is-active :is(.price-story-statement,.story-lead){animation:stage-message-in .55s .9s cubic-bezier(.18,.8,.2,1) both}
.reference-layout .story-slide.is-active .hero-price-visual{animation:stage-message-in .6s 1.8s cubic-bezier(.18,.8,.2,1) both}
.reference-layout .story-slide.is-active .reference-voice{animation:stage-message-in .6s 2.7s cubic-bezier(.18,.8,.2,1) both}
.reference-layout .story-slide.is-active .story-demo-pointer{animation:stage-message-in .6s 1.8s cubic-bezier(.18,.8,.2,1) both}
.reference-layout .story-slide.is-active .story-trial{animation:stage-message-in .6s 3.6s cubic-bezier(.18,.8,.2,1) both}
.reference-layout .hero-price-visual{grid-column:2/13;position:relative;min-height:158px;margin-top:28px;border:1px solid #98efffc2;border-radius:20px;background:linear-gradient(115deg,#07304de8,#061d35ed);box-shadow:0 24px 48px #00132199,0 0 36px color-mix(in srgb,var(--stage-accent) 24%,transparent),inset 0 0 35px #3fd5ff24;transform-origin:50% 20%}
.reference-layout .hero-price-visual::before,.reference-layout .hero-price-visual::after{content:"";position:absolute;width:22px;height:22px;border-color:var(--stage-accent);pointer-events:none}
.reference-layout .hero-price-visual::before{top:-3px;left:-3px;border-top:3px solid;border-left:3px solid;border-radius:20px 0 0}
.reference-layout .hero-price-visual::after{right:-3px;bottom:-3px;border-right:3px solid;border-bottom:3px solid;border-radius:0 0 20px}
.reference-layout .hero-price-signal{animation:stage-signal 3.2s ease-in-out infinite}
.reference-layout .price-story-foot{grid-column:2/12;margin:21px 0 0;padding:13px 18px;border-left:2px solid var(--stage-accent);background:linear-gradient(90deg,#0a3352b9,transparent);font-size:14px;line-height:1.5;text-shadow:0 1px 7px #001b2b}
.reference-layout .story-voice .story-eyebrow,.reference-layout .story-final .story-eyebrow{display:block;grid-column:1/13;margin:0 0 13px;color:var(--stage-accent);font-size:12px;font-weight:800;letter-spacing:.1em;text-shadow:0 0 14px #0cbfff}
.reference-layout .story-voice h2,.reference-layout .story-final h2{grid-column:1/12}
.reference-layout .story-voice .story-lead,.reference-layout .story-final .story-lead{grid-column:4/13;margin-top:19px}
.reference-layout .story-voice .story-reassure{display:block;grid-column:4/13;justify-self:end;margin:17px 0 0;color:#e4f3fa;font-size:13px;text-align:right;text-shadow:0 1px 8px #001622}
.reference-layout .story-voice .reference-voice{grid-column:1/13;width:100%;margin:18px 0 0;padding:0;border-radius:20px;background:linear-gradient(90deg,#052944bc,#0b547362,#052944bc);box-shadow:0 0 32px color-mix(in srgb,var(--stage-accent) 20%,transparent)}
.reference-layout .story-voice .reference-voice svg{animation:stage-wave 3.5s ease-in-out infinite}
.reference-layout .story-voice .reference-signature{grid-column:2/12;margin:11px 0 4px;transform:none}
.reference-layout .story-voice .story-feature-link{grid-column:2/12;justify-self:start;margin-top:7px}
.reference-layout .story-final .story-demo-pointer{grid-column:1/13;justify-self:start;margin:24px 0 0;padding:12px 17px;border:1px solid #8fe8ffb8;border-radius:13px;background:#073658df;box-shadow:0 0 24px #1ccaff38;font-size:15px}
.reference-layout .story-final .story-demo-pointer .pointer-arrow{animation:stage-point 1.8s 2.5s ease-in-out infinite}
.reference-layout .story-final .story-entry-hint{grid-column:2/13;margin:18px 0 0;color:#e4f2f9;font-size:12px;text-shadow:0 1px 8px #001724}
.reference-layout .story-final .story-trial{grid-column:2/13;display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}
.reference-layout .story-final .story-trial p{margin:0;padding:7px 11px;border:1px solid #8deaff80;border-radius:999px;background:#073d5ddb;font-size:12px;box-shadow:0 0 18px #0ac4ff2e}
.reference-layout .story-final .story-trial p::before,.reference-layout .story-final .story-trial p+p::before{font-size:17px}
.reference-layout .story-final .story-trial a{flex-basis:100%}
.reference-layout .story-final .story-privacy{grid-column:2/13;margin-top:13px;padding:10px 12px;border-radius:8px;background:#061e34bf;color:#e0edf3;font-size:10px}
.reference-layout .story-voice .story-reassure{padding:7px 11px;border-radius:9px;background:#061e34d9}
.reference-layout .story-voice .reference-signature{width:fit-content;padding:9px 13px;border-radius:9px;background:#061e34d9;text-shadow:0 1px 8px #001523}
.reference-layout .story-voice .story-feature-link{padding:5px 9px;border-radius:7px;background:#061e34d9}
.reference-layout .story-final .story-entry-hint{width:fit-content;padding:8px 11px;border-radius:8px;background:#061e34e8}
.reference-layout .story-final .story-trial a{width:fit-content;padding:4px 7px;border-radius:5px;background:#061e34e8}
@keyframes stage-enter{from{opacity:0}to{opacity:1}}
@keyframes stage-message-in{from{opacity:0;transform:translateY(25px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes stage-breathe{50%{opacity:.45;transform:scale(1.08)}}
@keyframes stage-beacon{50%{box-shadow:0 0 0 9px color-mix(in srgb,var(--stage-accent) 10%,transparent),0 0 22px var(--stage-accent)}}
@keyframes stage-orbit{50%{transform:translate(-120px,160px)}}
@keyframes stage-signal{50%{filter:drop-shadow(0 0 17px var(--stage-accent))}}
@keyframes stage-wave{50%{filter:drop-shadow(0 0 12px var(--stage-accent));transform:scale(1.015)}}
@keyframes stage-point{0%,100%{transform:translateX(5px);opacity:.72}55%{transform:translateX(-7px);opacity:1}}
@keyframes stage-point-up{0%,100%{transform:translateY(4px);opacity:.72}55%{transform:translateY(-6px);opacity:1}}
@media(min-width:1101px) and (max-height:900px){.reference-layout .flower-story{padding-top:135px}.reference-layout .story-topline{margin-bottom:15px}.reference-layout .story-voice .reference-voice{height:128px;overflow:hidden;margin-top:12px}.reference-layout .story-voice .reference-voice svg{height:128px}.reference-layout .story-voice .reference-signature{font-size:16px;line-height:1.35;margin-top:8px}.reference-layout .story-voice .story-reassure{margin-top:12px}}
@media(min-width:761px) and (max-width:1100px){.reference-layout .flower-panel,.reference-layout [data-step="0"] .flower-panel{width:56%}.reference-layout .story-slide :is(h1,h2){padding:15px 17px}.reference-layout .story-slide :is(.price-story-statement,.story-lead){padding:14px 17px}.reference-layout .story-topline{margin-bottom:15px}.reference-layout .hero-price-visual{min-height:135px;margin-top:19px}.reference-layout .price-story-foot{margin-top:13px}.reference-layout .story-voice .reference-voice{margin-top:12px}}
@media(max-width:760px){.reference-layout .flower-panel,.reference-layout [data-step="0"] .flower-panel{width:100%;margin:0;padding:0;background:none}.reference-layout .flower-panel::before{width:90%;top:14%;right:-12%}.reference-layout .story-topline{margin:0 0 15px;font-size:10px}.reference-layout .story-counter{font-size:10px;padding:5px 9px}.reference-layout .story-slide :is(h1,h2){grid-column:1/13;padding:13px 15px;border-radius:16px 16px 5px 16px}.reference-layout .story-slide :is(.price-story-statement,.story-lead){grid-column:2/13;margin-top:17px;padding:12px 14px;border-radius:16px 16px 16px 5px}.reference-layout .hero-price-visual{grid-column:1/13;min-height:105px;margin-top:23px;padding:8px 10px}.reference-layout .price-story-foot{grid-column:1/13;margin-top:16px;padding:10px 12px;font-size:11px}.reference-layout .story-voice .story-eyebrow,.reference-layout .story-final .story-eyebrow{font-size:10px}.reference-layout .story-voice .story-reassure{grid-column:2/13;font-size:11px}.reference-layout .story-voice .reference-voice{grid-column:1/13;margin-top:13px}.reference-layout .story-voice .reference-signature,.reference-layout .story-voice .story-feature-link{grid-column:1/13}.reference-layout .story-final .story-demo-pointer{font-size:12px;margin-top:19px}.reference-layout .story-final .story-entry-hint,.reference-layout .story-final .story-trial,.reference-layout .story-final .story-privacy{grid-column:1/13}.reference-layout .story-final .story-entry-hint{font-size:10px}.reference-layout .story-final .story-trial{gap:6px}.reference-layout .story-final .story-trial p{font-size:10px;padding:5px 8px}.reference-layout .story-final .story-privacy{font-size:9px}}
/* Smaller glass bubbles leave room for the image and the highlighted action. */
.reference-layout .story-slide :is(h1,h2),.reference-layout [data-step="0"] .story-slide h1,.reference-layout .story-voice h2,.reference-layout .story-final h2{max-width:81%;padding:13px 18px;border-radius:30px 30px 10px 30px;background:linear-gradient(145deg,#235d7bab,#08263ed1);border-color:#bceeffa3;box-shadow:0 16px 36px #00122086,inset 0 1px #ffffff42;backdrop-filter:blur(18px) saturate(1.25);font-size:clamp(24px,2.12vw,31px);line-height:1.34}
.reference-layout .story-slide :is(h1,h2)::after{background:#0b344ddc;border-radius:4px;right:23px}
.reference-layout .story-slide :is(.price-story-statement,.story-lead),.reference-layout .story-voice .story-lead,.reference-layout .story-final .story-lead{max-width:72%;margin-top:17px;padding:12px 17px;border-radius:28px 28px 28px 9px;background:linear-gradient(125deg,#0c6788c7,#093855d6);border-color:#a2ecffb5;box-shadow:0 15px 30px #00172587,inset 0 1px #ffffff38;backdrop-filter:blur(18px) saturate(1.25);font-size:clamp(16px,1.35vw,19px);line-height:1.42}
.reference-layout .story-slide :is(.price-story-statement,.story-lead)::after{background:#0a4964dc;border-radius:4px;left:22px}
.reference-layout .story-slide.is-active .price-story-foot{animation:stage-message-in .55s 2.7s both}
.reference-layout .story-slide.is-active .story-reassure{animation:stage-message-in .55s 1.8s both}
.reference-layout .story-slide.is-active .reference-signature{animation:stage-message-in .55s 3.6s both}
.reference-layout .story-slide.is-active .story-feature-link{animation:stage-message-in .55s 4.5s both}
.reference-layout .story-slide.is-active .story-entry-hint{animation:stage-message-in .55s 2.7s both}
.reference-layout .story-slide.is-active .story-privacy{animation:stage-message-in .55s 4.5s both}
.reference-layout .hero-price-visual{min-height:139px;margin-top:22px}
.reference-layout .hero-price-copy p{animation:stage-price-focus 3s 2.5s ease-in-out infinite;transform-origin:left center}
.reference-layout .story-voice .reference-voice svg>circle{transform-box:fill-box;transform-origin:center;animation:stage-voice-ring 2.6s 3.3s ease-in-out infinite}
.reference-layout .story-voice .reference-voice svg>g{transform-box:fill-box;transform-origin:center;animation:stage-voice-icon 2.6s 3.3s ease-in-out infinite}
.reference-layout .story-final .story-demo-pointer :is(.pointer-desktop,.pointer-mobile){animation:stage-demo-focus 2.4s 2.5s ease-in-out infinite}
@keyframes stage-price-focus{50%{transform:scale(1.055);filter:drop-shadow(0 0 10px #7deaff)}}
@keyframes stage-voice-ring{50%{opacity:1;filter:drop-shadow(0 0 12px #8defff);transform:scale(1.12)}}
@keyframes stage-voice-icon{50%{filter:drop-shadow(0 0 10px #d8fbff)}}
@keyframes stage-demo-focus{50%{color:#fff;text-shadow:0 0 14px #73e8ff}}
/* The consultation entry grows from the network's centre line. */
.reference-layout .experience-network .public-consultation,.reference-layout .experience-network .public-consultation.expanded{position:absolute;z-index:8;top:calc(100% + 3px);bottom:auto;left:50%;right:auto;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 30px);padding:0;margin:0;border:0;background:transparent;box-shadow:none;overflow:visible;color:#eafbff}
.reference-layout .experience-network .public-consultation::before{content:"";position:absolute;left:50%;bottom:calc(100% + 2px);width:2px;height:145px;transform:translateX(-50%);background:linear-gradient(180deg,#6bddff18,#6bddffb8);box-shadow:0 0 12px #44d4ff;pointer-events:none}
.reference-layout .experience-network .public-consultation::after{content:"";position:absolute;left:50%;bottom:calc(100% + 140px);width:8px;height:8px;border-radius:50%;background:#8aeaff;transform:translateX(-50%);box-shadow:0 0 14px #62e2ff;pointer-events:none}
.reference-layout .experience-network .consultation-toggle{display:block!important;width:auto;height:auto;min-height:45px;padding:10px 21px;border:1px solid #a9efffc4;border-radius:999px;background:linear-gradient(120deg,#095377e8,#082b4de8);box-shadow:0 0 20px #19c4ff60,inset 0 1px #ffffff40;color:#f4fdff;font-size:13px;font-weight:800;white-space:nowrap;cursor:pointer;backdrop-filter:blur(14px);transition:transform .2s,box-shadow .2s}
.reference-layout .experience-network .consultation-toggle::before{content:none}
.reference-layout .experience-network .consultation-toggle:hover,.reference-layout .experience-network .consultation-toggle:focus-visible{transform:translateY(-3px);box-shadow:0 0 27px #3dd9ffad,inset 0 1px #ffffff65}
.reference-layout .experience-network .public-consultation:not(.expanded)>p,.reference-layout .experience-network .public-consultation:not(.expanded)>div{display:none}
.reference-layout .experience-network .public-consultation.expanded>p{display:none}
.reference-layout .experience-network .public-consultation.expanded>div{display:grid;position:absolute;z-index:9;left:50%;right:auto;bottom:calc(100% + 11px);top:auto;transform:translateX(-50%);width:280px;max-width:calc(100vw - 30px);padding:12px;border:1px solid #b0dbee;border-radius:14px;background:#eff8fd;box-shadow:0 18px 36px #00182e7d}
.reference-layout.has-public-consultation{padding-bottom:0}
@media(min-width:761px) and (max-width:900px){.reference-layout .experience-network{margin-bottom:98px}.reference-layout .experience-network .public-consultation::before{height:125px}.reference-layout .experience-network .public-consultation::after{bottom:calc(100% + 120px)}}
@media(max-width:760px){.reference-layout .experience-network{margin-bottom:85px}.reference-layout .experience-network .public-consultation{top:calc(100% + 2px)}.reference-layout .experience-network .public-consultation::before{height:113px}.reference-layout .experience-network .public-consultation::after{bottom:calc(100% + 108px)}.reference-layout .story-slide :is(h1,h2),.reference-layout [data-step="0"] .story-slide h1,.reference-layout .story-voice h2,.reference-layout .story-final h2{max-width:88%;padding:11px 14px;border-radius:23px 23px 8px 23px;font-size:clamp(20px,5.8vw,24px)}.reference-layout .story-slide :is(.price-story-statement,.story-lead),.reference-layout .story-voice .story-lead,.reference-layout .story-final .story-lead{max-width:84%;padding:10px 13px;border-radius:23px 23px 23px 8px;font-size:14px}.reference-layout .hero-price-visual{min-height:101px;margin-top:19px}}
@media(max-width:760px){.reference-layout .story-final .story-demo-pointer .pointer-arrow{animation-name:stage-point-up}.reference-layout .story-final .story-demo-pointer .pointer-arrow::after{content:'↑'}}
@media(min-width:1101px){.reference-layout .flower-panel{top:50px}}
.reference-layout .story-slide :is(h1,h2),.reference-layout [data-step="0"] .story-slide h1,.reference-layout .story-voice h2,.reference-layout .story-final h2{max-width:74%;padding:10px 15px;font-size:clamp(22px,1.85vw,27px);line-height:1.3}
.reference-layout .story-slide :is(.price-story-statement,.story-lead),.reference-layout .story-voice .story-lead,.reference-layout .story-final .story-lead{max-width:68%;padding:9px 14px;font-size:16px;line-height:1.4}
@media(max-width:760px){.reference-layout .story-slide :is(h1,h2),.reference-layout [data-step="0"] .story-slide h1,.reference-layout .story-voice h2,.reference-layout .story-final h2{max-width:85%;padding:9px 12px;font-size:clamp(19px,5.1vw,21px)}.reference-layout .story-slide :is(.price-story-statement,.story-lead),.reference-layout .story-voice .story-lead,.reference-layout .story-final .story-lead{max-width:79%;padding:8px 11px;font-size:13px}}
@media(prefers-reduced-motion:reduce){.reference-layout .flower-panel::before,.reference-layout .flower-panel::after,.reference-layout .story-brand-label i,.reference-layout .story-slide.is-active,.reference-layout .story-slide.is-active :is(h1,h2,.price-story-statement,.story-lead,.hero-price-visual,.reference-voice,.story-demo-pointer,.story-trial),.reference-layout .hero-price-signal,.reference-layout .story-voice .reference-voice svg,.reference-layout .story-final .story-demo-pointer .pointer-arrow{animation:none}}
@media(prefers-reduced-motion:reduce){.reference-layout .story-slide.is-active *,.reference-layout .hero-price-copy p,.reference-layout .story-voice .reference-voice svg>circle,.reference-layout .story-voice .reference-voice svg>g,.reference-layout .story-final .story-demo-pointer :is(.pointer-desktop,.pointer-mobile){animation:none!important}}
@media(max-width:480px){.reference-layout .experience-network .public-consultation.expanded>div{grid-template-columns:1fr 1fr;gap:8px;width:300px}.reference-layout .experience-network .public-consultation button{grid-template-columns:auto 1fr;place-items:center start;column-gap:6px;width:auto;height:auto;min-height:56px;padding:8px 10px;border-radius:10px;box-shadow:none}.reference-layout .experience-network .public-consultation button>span{grid-row:1/3;font-size:1.15rem}.reference-layout .experience-network .public-consultation button>b,.reference-layout .experience-network .public-consultation button>small{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;white-space:nowrap}.reference-layout .experience-network .public-consultation button>b{font-size:12px}.reference-layout .experience-network .public-consultation button>small{font-size:10px}}
.reference-layout .story-slide :is(h1,h2,p,.story-lead,.price-story-statement){word-break:keep-all;overflow-wrap:break-word}
.reference-layout :is(.story-brand-label,.story-eyebrow){text-shadow:0 1px 2px #000d,0 0 12px #000b}
@media(max-width:760px){.reference-layout .story-panels{min-height:485px}}
@media(max-width:760px){.reference-layout .cn-footer nav a{display:inline-block;padding:9px 2px}.reference-layout .cn-footer .flower-operator summary{padding:8px 0}}