diff --git a/common.css b/common.css index d9bef26..2b00cf6 100644 --- a/common.css +++ b/common.css @@ -785,6 +785,105 @@ textarea.markup-editor-textarea { } +/* ============================================ + FEATURE CARDS + ============================================ */ + +.mps-card-grid { + display: grid; + grid-template-columns: 1fr; + gap: 16px; + margin-top: 20px; + margin-bottom: 20px; +} + +.mps-card { + background-color: #FFFFFF; + border: 1px solid #e0e0e0; + border-radius: 10px; + padding: 20px; + transition: box-shadow 300ms ease, transform 200ms ease; +} + +.mps-card:hover { + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); + transform: translateY(-2px); +} + +.mps-card-icon { + font-size: 28px; + margin-bottom: 8px; + display: block; +} + +.mps-card-title { + color: #0b0b0b; + font-size: 1.1em; + font-weight: 600; + display: block; + margin-bottom: 6px; +} + +.mps-card-desc { + color: #515151; + font-size: 14px; + line-height: 1.5; +} + +.mps-comparison { + display: grid; + grid-template-columns: 1fr; + gap: 16px; + margin: 20px 0; +} + +.mps-comparison-card { + border-radius: 10px; + padding: 24px; + text-align: center; +} + +.mps-comparison-card.marketplace { + background-color: #f8d7da; + border: 2px solid #c77765; +} + +.mps-comparison-card.mps { + background-color: #e8f5d4; + border: 2px solid #678731; +} + +.mps-comparison-amount { + font-size: 2.4em; + font-weight: 600; + display: block; +} + +.mps-comparison-label { + font-size: 14px; + color: #515151; + margin-top: 4px; +} + +.mps-section-divider { + border: none; + border-top: 2px solid #e0e0e0; + margin: 40px auto; + max-width: 800px; +} + +@media (min-width: 800px) { + .mps-card-grid { + grid-template-columns: repeat(2, 1fr); + } + .mps-card-grid.three-col { + grid-template-columns: repeat(3, 1fr); + } + .mps-comparison { + grid-template-columns: 1fr 1fr; + } +} + @media (min-width: 800px) { .mps-footer-grid { grid-template-columns: 2fr 1fr 1fr 1fr; diff --git a/index.html b/index.html index 5052be1..a20aa4f 100644 --- a/index.html +++ b/index.html @@ -3,11 +3,11 @@ -Sell digital downloads or physical products — commission free with Make Post Sell +Make Post Sell — Commission-free shops for creators, makers, and media - + @@ -18,9 +18,8 @@ -
-Sell digital downloads or physical products — commission free! +Open source & public domain — no moat, no castle, just infrastructure that outlasts its builders