Closer/docs/store/sources/feature-graphic.svg

57 lines
4.2 KiB
XML

<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="500" viewBox="0 0 1024 500" role="img" aria-label="Closer Couples feature graphic">
<defs>
<filter id="markShadow" x="-30%" y="-30%" width="160%" height="180%">
<feDropShadow dx="0" dy="14" stdDeviation="14" flood-color="#180C20" flood-opacity=".45"/>
</filter>
<filter id="cardShadow" x="-20%" y="-20%" width="140%" height="150%">
<feDropShadow dx="0" dy="10" stdDeviation="12" flood-color="#180C20" flood-opacity=".22"/>
</filter>
</defs>
<rect width="1024" height="500" fill="#24122F"/>
<path d="M0 0h1024v168C819 214 641 199 472 158 286 113 144 58 0 34Z" fill="#B98AF4" opacity=".14"/>
<path d="M0 372c144-62 292-57 449-14 142 39 259 43 358 7 70-25 142-33 217-13v148H0Z" fill="#180C20" opacity=".34"/>
<path d="M900 0h124v500H820c31-76 34-154 8-236C800 174 812 88 900 0Z" fill="#F7C8E4" opacity=".08"/>
<image x="68" y="74" width="312" height="312" href="../../brand/sources/closer-approved-icon-square-white-keyhole.png" preserveAspectRatio="xMidYMid slice" filter="url(#markShadow)"/>
<text x="408" y="142" fill="#FFF8FC" font-family="DejaVu Sans" font-size="58" font-weight="700">Closer Couples</text>
<text x="412" y="198" fill="#F7C8E4" font-family="DejaVu Sans" font-size="26" font-weight="600">A private space</text>
<text x="660" y="198" fill="#FFF8FC" font-family="DejaVu Sans" font-size="26" font-weight="700">for two.</text>
<text x="412" y="236" fill="#F3E8FF" font-family="DejaVu Sans" font-size="18" font-weight="500">Private questions. Encrypted answers. Mutual reveals.</text>
<g transform="translate(408 274)" filter="url(#cardShadow)">
<rect width="176" height="116" rx="22" fill="#FFF8FC"/>
<circle cx="88" cy="34" r="20" fill="#F0DFFF"/>
<path d="M88 20l11 6v10c0 8-5 13-11 17-6-4-11-9-11-17V26l11-6Z" fill="#56306F"/>
<text x="88" y="82" fill="#24122F" font-family="DejaVu Sans" font-size="18" font-weight="700" text-anchor="middle">Private first</text>
<text x="88" y="104" fill="#6D5A75" font-family="DejaVu Sans" font-size="14" text-anchor="middle">Reveal when ready</text>
</g>
<g transform="translate(606 274)" filter="url(#cardShadow)">
<rect width="176" height="116" rx="22" fill="#FFF8FC"/>
<circle cx="88" cy="34" r="20" fill="#FFE8F4"/>
<path fill="#9B1B5A" transform="translate(68.8 14.6) scale(1.6)" d="M12,5.95C10.12,3.96 6.6,4.95 5.54,7.18C4.25,9.9 5.72,12.96 8.18,15.16C9.19,16.06 10.36,16.95 12,18.34C13.64,16.95 14.81,16.06 15.82,15.16C18.28,12.96 19.75,9.9 18.46,7.18C17.4,4.95 13.88,3.96 12,5.95Z"/>
<path fill="#FFFFFF" transform="translate(68.8 14.6) scale(1.6)" d="M12,10.1C11.2,10.1 10.55,10.75 10.55,11.55C10.55,12.1 10.86,12.58 11.31,12.83L10.72,15.85H13.28L12.69,12.83C13.14,12.58 13.45,12.1 13.45,11.55C13.45,10.75 12.8,10.1 12,10.1Z"/>
<text x="88" y="82" fill="#24122F" font-family="DejaVu Sans" font-size="18" font-weight="700" text-anchor="middle">For two</text>
<text x="88" y="104" fill="#6D5A75" font-family="DejaVu Sans" font-size="14" text-anchor="middle">No public feed</text>
</g>
<g transform="translate(804 274)" filter="url(#cardShadow)">
<rect width="138" height="116" rx="22" fill="#FFF8FC"/>
<circle cx="69" cy="34" r="20" fill="#F4E8FF"/>
<path d="M59 33v-7c0-6 4-10 10-10s10 4 10 10v7" fill="none" stroke="#56306F" stroke-width="4" stroke-linecap="round"/>
<rect x="56" y="31" width="26" height="21" rx="6" fill="#56306F"/>
<circle cx="69" cy="39" r="3" fill="#F4E8FF"/>
<path d="M69 42v5" stroke="#F4E8FF" stroke-width="3" stroke-linecap="round"/>
<text x="69" y="82" fill="#24122F" font-family="DejaVu Sans" font-size="18" font-weight="700" text-anchor="middle">Encrypted</text>
<text x="69" y="104" fill="#6D5A75" font-family="DejaVu Sans" font-size="14" text-anchor="middle">Before sync</text>
</g>
<g transform="translate(408 410)">
<rect width="430" height="42" rx="21" fill="#6B4A7C"/>
<path d="M25 12l10 4v8c0 7-4 12-10 15-6-3-10-8-10-15v-8l10-4Zm0 6-5 2v4c0 4 2 7 5 9 3-2 5-5 5-9v-4l-5-2Z" fill="#F7C8E4"/>
<text x="50" y="28" fill="#FFF8FC" font-family="DejaVu Sans" font-size="16" font-weight="600">Private by design. Made for connection.</text>
</g>
</svg>