.icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.button-icon { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.mail-icon { border: 0; border-radius: 0; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.trust-row b svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.category-strip i { display: grid; place-items: center; }
.category-strip i svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.benefit-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.principle-card { position: absolute; z-index: 2; right: 7%; bottom: 9%; display: flex; align-items: center; gap: 14px; padding: 17px 20px; background: rgba(255,255,255,.94); border-radius: 17px; box-shadow: 0 20px 50px rgba(12,36,52,.16); backdrop-filter: blur(10px); }
.principle-card > svg { width: 31px; height: 31px; fill: none; stroke: var(--green); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.principle-card div, .launch-card { display: grid; }
.principle-card strong { font: 700 13px "Manrope"; }
.principle-card span, .launch-card span { margin-top: 3px; color: #687981; font-size: 11px; }
.launch-card { position: absolute; z-index: 2; left: 7%; top: 8%; padding: 15px 20px; background: rgba(12,36,52,.88); color: white; border-radius: 14px; backdrop-filter: blur(8px); }
.launch-card span { margin: 0 0 3px; color: #b9cbc9; }
.launch-card strong { font: 700 18px "Manrope"; }
@media (max-width: 600px) { .principle-card { right: 14px; bottom: 14px; } .launch-card { left: 22px; top: 22px; } }