/* Energy independence: a calm, animated explanation in EVO colours. */
.meaning{position:relative;isolation:isolate;overflow:hidden;padding:clamp(24px,4vw,48px);border:1px solid #6bbcbc26;background:radial-gradient(ellipse at 95% 0%,#69babb25,transparent 48%),radial-gradient(ellipse at 0% 95%,#69babb16,transparent 45%),#000e29}
.meaning:before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background-image:radial-gradient(#91d6d626 .8px,transparent .8px);background-size:24px 24px;mask-image:linear-gradient(125deg,transparent 20%,#000);opacity:.42}
.meaning .meaningTop{align-items:center;gap:clamp(24px,4vw,56px);margin-bottom:30px}
.meaning .meaningHeading{flex:1.05;min-width:0}
.meaning .meaningEyebrow{display:flex;align-items:center;gap:9px;margin:0 0 13px;color:#9adbd5;font-size:11px;font-weight:800;letter-spacing:.14em;line-height:1.5;text-transform:uppercase}
.meaning .meaningEyebrow:before{content:"";width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:#87d6ca;box-shadow:0 0 0 5px #69babb13,0 0 16px #69babb60}
.meaning h2{max-width:620px;font-size:clamp(27px,3.3vw,46px);line-height:1.13;letter-spacing:-.045em}
.meaning h2>span{color:#80cecb}
.meaning .meaningTop>p{flex:1;max-width:490px;margin:0;color:#bdcbdc;font-size:16px;line-height:1.8}
.meaning .benefits{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.meaning .benefit{position:relative;overflow:hidden;min-width:0;padding:26px;border:1px solid #8dcecd30;border-radius:22px;background:linear-gradient(125deg,#ffffff0c,#6bbcbc05);box-shadow:inset 0 1px 0 #ffffff07;transition:transform .35s,border-color .35s,background-color .35s,box-shadow .35s}
.meaning .benefit:after{content:"";position:absolute;left:26px;right:26px;bottom:0;height:2px;transform:scaleX(.16);transform-origin:left;background:linear-gradient(90deg,#80cecb,transparent);opacity:.35;transition:transform .5s,opacity .5s}
.meaning .benefit:hover{transform:translateY(-5px);border-color:#80cecb85;background-color:#69babb0a;box-shadow:0 16px 30px #00081438,inset 0 1px 0 #ffffff0a}
.meaning .benefit:hover:after{transform:scaleX(1);opacity:1}
.meaning .meaningCardHead{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:22px}
.meaning .meaningTag{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border:1px solid #80cecb2e;border-radius:999px;background:#69babb09;color:#9fd9d4;font-size:10px;line-height:1.25;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.meaning .meaningTag:before{content:"";width:4px;height:4px;border-radius:50%;background:#80cecb}
.meaning .benefitIcon{position:relative;flex:0 0 76px;width:76px;height:76px;margin:0;border:1px solid #8bd4d349;border-radius:21px;background:radial-gradient(circle at 30% 20%,#8bd4d326,transparent 80%),#0a2038;color:#8cd9d0;box-shadow:0 0 28px #69babb09}
.meaning .benefitIcon:before{content:"";position:absolute;inset:7px;border:1px solid #8cd9d035;border-radius:17px;opacity:0;animation:evo-icon-ripple 4.8s ease-out infinite;animation-play-state:paused;pointer-events:none}
.meaning .benefitIcon svg{width:46px;height:46px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.meaning .benefit h3{margin:0 0 10px;color:#f5f9ff;font-size:20px;line-height:1.35;letter-spacing:-.025em}
.meaning .benefit>p{margin:0;max-width:580px;color:#b8c8db;font-size:14px;line-height:1.75}
.meaning .meaningBars{transform-box:fill-box;transform-origin:center bottom}
.meaning .meaningCharge{stroke-dasharray:2 5;animation:evo-charge-flow 2.8s linear infinite;animation-play-state:paused}
.meaning .meaningSummary{display:flex;align-items:center;gap:22px;margin-top:24px;padding:25px 28px;border:1px solid #a1e0d873;border-radius:20px;background:linear-gradient(115deg,#90d8cf,#6ababa);box-shadow:0 8px 28px #00081420;color:#000e29;text-align:left}
.meaning .meaningSummaryIcon{display:grid;place-items:center;flex:0 0 54px;width:54px;height:54px;border:1px solid #000e291a;border-radius:16px;background:#ffffff20}
.meaning .meaningSummaryIcon svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.meaning .meaningSummary p{flex:1;margin:0;font-size:clamp(21px,2.1vw,29px);font-weight:800;letter-spacing:-.035em;line-height:1.25}
.meaning .meaningSummary p span{display:block}
.meaning .meaningCta{display:inline-flex;align-items:center;justify-content:center;gap:15px;flex-shrink:0;padding:14px 18px;border:1px solid #000e2924;border-radius:999px;background:#000e29;color:#fff;text-decoration:none;font-size:13px;line-height:1.4;font-weight:750;letter-spacing:0;transition:transform .2s,box-shadow .2s}
.meaning .meaningCta:hover{transform:translateY(-2px);box-shadow:0 6px 20px #000e2929}
.meaning .meaningCta:focus-visible{outline:3px solid #000e29;outline-offset:4px}
.meaning .meaningCta>span{font-size:19px;color:#9bddda}
.meaning.meaning-motion-ready .benefit{opacity:0;transform:translateY(20px)}
.meaning.meaning-motion-ready.is-visible .benefit{opacity:1;transform:translateY(0);animation:evo-card-reveal .65s backwards;animation-delay:calc(var(--meaning-order,0)*110ms)}
.meaning.meaning-motion-ready.is-visible .benefit:hover{transform:translateY(-5px)}
.meaning.is-visible .meaningBars{animation:evo-bars-rise 1s cubic-bezier(.2,.7,.2,1) both;animation-delay:.25s}
.meaning.is-visible .meaningDraw{stroke-dasharray:70;stroke-dashoffset:0;animation:evo-icon-draw 1.4s ease-out both;animation-delay:calc(var(--meaning-order,0)*110ms + .2s)}
.meaning.is-in-view .benefitIcon:before,.meaning.is-in-view .meaningCharge{animation-play-state:running}
.meaning .benefit:nth-child(2) .benefitIcon:before{animation-delay:1.2s}
.meaning .benefit:nth-child(3) .benefitIcon:before{animation-delay:2.4s}
.meaning .benefit:nth-child(4) .benefitIcon:before{animation-delay:3.6s}
@keyframes evo-card-reveal{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes evo-icon-ripple{0%,20%{opacity:0;transform:scale(.9)}35%{opacity:.6}75%,100%{opacity:0;transform:scale(1.5)}}
@keyframes evo-charge-flow{to{stroke-dashoffset:-28}}
@keyframes evo-bars-rise{from{transform:scaleY(.15)}to{transform:scaleY(1)}}
@keyframes evo-icon-draw{from{stroke-dashoffset:70}to{stroke-dashoffset:0}}
@media(max-width:900px){.meaning .meaningTop{display:block}.meaning .meaningTop>p{max-width:650px;margin-top:18px}.meaning .meaningSummary{flex-wrap:wrap;gap:16px}.meaning .meaningCta{margin-left:70px}.meaning .benefit{padding:22px}.meaning .benefit h3{font-size:18px}.meaning .meaningTag{font-size:9px;padding:6px 8px;letter-spacing:.04em}}
@media(max-width:600px){.meaning{padding:24px 18px;border-radius:24px}.meaning .meaningTop{margin-bottom:24px}.meaning .meaningEyebrow{font-size:9px;letter-spacing:.1em}.meaning .meaningTop>p{font-size:14px;line-height:1.7}.meaning .benefits{grid-template-columns:minmax(0,1fr);gap:13px}.meaning .benefit{padding:22px}.meaning .meaningCardHead{margin-bottom:18px}.meaning .benefitIcon{flex-basis:64px;width:64px;height:64px;border-radius:18px}.meaning .benefitIcon svg{width:39px;height:39px}.meaning .meaningTag{font-size:9px;padding:7px 10px}.meaning .benefit h3{font-size:19px}.meaning .benefit>p{font-size:13px}.meaning .meaningSummary{padding:22px;gap:15px}.meaning .meaningSummaryIcon{flex-basis:44px;width:44px;height:44px;border-radius:13px}.meaning .meaningSummary p{font-size:21px;flex-basis:calc(100% - 59px)}.meaning .meaningCta{margin:2px 0 0;width:100%;padding:13px 15px}}
@media(prefers-reduced-motion:reduce){.meaning *,.meaning *:before,.meaning *:after{animation:none!important;transition:none!important}.meaning.meaning-motion-ready .benefit{opacity:1;transform:none}.meaning.meaning-motion-ready.is-visible .benefit:hover,.meaning .benefit:hover,.meaning .meaningCta:hover{transform:none}.meaning .meaningDraw{stroke-dashoffset:0}}