Solution: 3-column grid, 80px icons with 32px SVG
This commit is contained in:
1 parent
fd0d49a79e
commit
45f20c192f
1 file changed
+8
-6
+8
-6
@@ -496,6 +496,7 @@ h1 .accent { color: var(--accent); }
|
||||
|
||||
/* ── SOLUTION ── */
|
||||
.solution-section { border-bottom: 1px solid var(--border); }
|
||||
.solution-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
|
||||
.sol-card {
|
||||
padding: 48px 32px; border-right: 1px solid var(--border);
|
||||
border-bottom: 1px solid var(--border);
|
||||
@@ -511,10 +512,11 @@ h1 .accent { color: var(--accent); }
|
||||
box-shadow: var(--shadow-card-hover);
|
||||
}
|
||||
.sol-icon {
|
||||
width: 72px; height: 72px; border: 1px solid var(--accent);
|
||||
border-radius: 14px; display: flex; align-items: center;
|
||||
justify-content: center; margin-bottom: 24px;
|
||||
width: 80px; height: 80px; border: 2px solid var(--accent);
|
||||
border-radius: 16px; display: flex; align-items: center;
|
||||
justify-content: center; margin-bottom: 28px;
|
||||
transition: all 0.3s var(--ease-out);
|
||||
background: var(--accent-dim);
|
||||
}
|
||||
.sol-card:hover .sol-icon {
|
||||
transform: scale(1.05);
|
||||
@@ -930,7 +932,7 @@ h1 .accent { color: var(--accent); }
|
||||
<div class="solution-grid">
|
||||
<div class="sol-card reveal reveal-delay-1">
|
||||
<div class="sol-icon">
|
||||
<svg width="28" height="28" viewBox="0 0 16 16" fill="none" stroke="var(--accent)" stroke-width="1.5">
|
||||
<svg width="32" height="32" viewBox="0 0 16 16" fill="none" stroke="var(--accent)" stroke-width="1.5">
|
||||
<path d="M9 2L4 8.5h4l-1 5.5L12 7.5H8L9 2z"/>
|
||||
</svg>
|
||||
</div>
|
||||
@@ -939,7 +941,7 @@ h1 .accent { color: var(--accent); }
|
||||
</div>
|
||||
<div class="sol-card reveal reveal-delay-2">
|
||||
<div class="sol-icon">
|
||||
<svg width="28" height="28" viewBox="0 0 16 16" fill="none" stroke="var(--accent)" stroke-width="1.5">
|
||||
<svg width="32" height="32" viewBox="0 0 16 16" fill="none" stroke="var(--accent)" stroke-width="1.5">
|
||||
<path d="M1 8s2.5-4 7-4 7 4 7 4-2.5 4-7 4-7-4-7-4z"/>
|
||||
<circle cx="8" cy="8" r="2"/>
|
||||
</svg>
|
||||
@@ -949,7 +951,7 @@ h1 .accent { color: var(--accent); }
|
||||
</div>
|
||||
<div class="sol-card reveal reveal-delay-3">
|
||||
<div class="sol-icon">
|
||||
<svg width="28" height="28" viewBox="0 0 16 16" fill="none" stroke="var(--accent)" stroke-width="1.5">
|
||||
<svg width="32" height="32" viewBox="0 0 16 16" fill="none" stroke="var(--accent)" stroke-width="1.5">
|
||||
<rect x="4" y="2" width="8" height="12" rx="1.5"/>
|
||||
<line x1="7" y1="11.5" x2="9" y2="11.5"/>
|
||||
</svg>
|
||||
|
||||
Reference in new issue
Block a user