css

src/css/common.css

@@ -714,7 +714,6 @@ body{overflow-x:hidden;}
 .fc-stat-item__value {font-size:2.25rem;font-weight:800;color:var(--color-primary);letter-spacing:-.03em;line-height:1;}
 .fc-stat-item__label {font-size:.8rem;font-weight:500;color:#888;line-height:1.4;}
 
-
 .fc-domains { margin-bottom: 8rem; }
 .fc-domains__grid { display: flex; gap: 1.25rem; height: 420px; }
 
@@ -727,8 +726,14 @@ body{overflow-x:hidden;}
 .fc-domain-card__overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 1.25rem; background: linear-gradient(to top, rgba(0,0,0,.72) 0%, rgba(0,0,0,.18) 45%, transparent 100%); transition: background 0.4s ease; }
 .fc-domain-card:hover .fc-domain-card__overlay { background: linear-gradient(to top, rgba(0,0,0,.88) 0%, rgba(0,0,0,.5) 50%, rgba(0,0,0,.15) 100%); }
 
-@media (max-width: 1024px) { .fc-domains__grid { grid-template-columns: repeat(3, 1fr); } }
+.fc-domain-card__label { font-size: 1.125rem; font-weight: 700; color: #fff; line-height: 1.3; }
-@media (max-width: 640px) { .fc-domains__grid { grid-template-columns: repeat(2, 1fr); } }
+
+.fc-domain-card__desc { font-size: .8rem; line-height: 1.65; color: rgba(255,255,255,.85); margin: .5rem 0 0; max-height: 0; opacity: 0; overflow: hidden; transform: translateY(8px); transition: max-height 0.4s ease, opacity 0.35s ease, transform 0.35s ease; }
+.fc-domain-card:hover .fc-domain-card__desc { max-height: 6rem; opacity: 1; transform: translateY(0); }
+
+@media (max-width: 1024px) { .fc-domains__grid { flex-wrap: wrap; height: auto; } .fc-domain-card { flex: 0 0 calc(33.33% - 1rem); aspect-ratio: 3/4; } }
+@media (max-width: 640px) { .fc-domain-card { flex: 0 0 calc(50% - 0.625rem); } }
+
 
 .fc-functions { margin-bottom: 8rem; }
 .fc-functions__body {display:flex;gap:5rem;align-items:flex-start;}