.afac-wrap {
--afac-panel: #111e30;
--afac-line: rgba(103, 232, 249, 0.52);
--afac-card-line: rgba(103, 232, 249, 0.24);
--afac-text: #f4f7fb;
--afac-muted: #a8b5c8;
--afac-accent: #67e8f9;
--afac-green: #6ee7b7;
--afac-dark: #06111d;
position: relative;
display: block;
box-sizing: border-box;
width: 100%;
margin: 0.75rem 0 0;
padding: 0;
border: 0;
color: var(--afac-text);
font: inherit;
}
.afac-wrap *,
.afac-wrap *::before,
.afac-wrap *::after {
box-sizing: border-box;
} .afac-wrap .afac-cards {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
align-items: stretch;
gap: 1rem;
width: 100%;
margin: 0 0 1rem;
padding: 0;
} .afac-wrap .afac-card {
--afac-cta-color: var(--afac-accent);
--afac-cta-rgb: 103, 232, 249;
position: relative;
isolation: isolate;
display: flex;
flex-direction: column;
min-width: 0;
min-height: 210px;
overflow: hidden;
margin: 0;
padding: 1.15rem;
border: 1px solid var(--afac-card-line);
border-radius: 18px;
background: linear-gradient(
145deg,
rgba(25, 38, 55, 0.98),
rgba(13, 26, 43, 0.98)
);
box-shadow:
inset 0 1px rgba(255, 255, 255, 0.04),
0 10px 24px rgba(0, 0, 0, 0.16);
transition:
transform 160ms ease,
border-color 160ms ease,
box-shadow 160ms ease;
} .afac-wrap .afac-card::before {
position: absolute;
z-index: -1;
top: -4rem;
right: -4rem;
width: 10rem;
height: 10rem;
border-radius: 50%;
background: radial-gradient(
circle,
rgba(var(--afac-cta-rgb), 0.16),
transparent 70%
);
content: "";
pointer-events: none;
}
.afac-wrap .afac-card:hover,
.afac-wrap .afac-card:focus-within {
border-color: rgba(var(--afac-cta-rgb), 0.56);
box-shadow:
0 0 20px rgba(var(--afac-cta-rgb), 0.14),
0 14px 30px rgba(0, 0, 0, 0.2);
transform: translateY(-2px);
}
.afac-wrap .afac-card h2 {
margin: 0 0 0.55rem;
padding: 0;
color: var(--afac-text);
font-family: inherit;
font-size: 1.05rem;
font-style: normal;
font-weight: 800;
line-height: 1.35;
overflow-wrap: anywhere;
}
.afac-wrap .afac-card p {
margin: 0 0 1rem;
padding: 0;
color: var(--afac-muted);
font-family: inherit;
font-size: 0.94rem;
line-height: 1.6;
overflow-wrap: anywhere;
} .afac-wrap .afac-platform-telegram {
--afac-cta-color: #74dcff;
--afac-cta-rgb: 116, 220, 255;
}
.afac-wrap .afac-platform-whatsapp {
--afac-cta-color: #6ee7ae;
--afac-cta-rgb: 110, 231, 174;
}
.afac-wrap .afac-platform-facebook {
--afac-cta-color: #78b4ff;
--afac-cta-rgb: 120, 180, 255;
}
.afac-wrap .afac-platform-instagram {
--afac-cta-color: #ff8dcc;
--afac-cta-rgb: 255, 141, 204;
}
.afac-wrap .afac-platform-linkedin {
--afac-cta-color: #67c3ff;
--afac-cta-rgb: 103, 195, 255;
}
.afac-wrap .afac-platform-youtube {
--afac-cta-color: #ff777d;
--afac-cta-rgb: 255, 119, 125;
}
.afac-wrap .afac-platform-tiktok {
--afac-cta-color: #70eff1;
--afac-cta-rgb: 112, 239, 241;
}
.afac-wrap .afac-platform-x {
--afac-cta-color: #f4f7fb;
--afac-cta-rgb: 244, 247, 251;
}
.afac-wrap .afac-platform-reddit {
--afac-cta-color: #ff936f;
--afac-cta-rgb: 255, 147, 111;
}
.afac-wrap .afac-platform-github {
--afac-cta-color: #d8e0ec;
--afac-cta-rgb: 216, 224, 236;
}
.afac-wrap .afac-platform-discord {
--afac-cta-color: #a5b4fc;
--afac-cta-rgb: 165, 180, 252;
}
.afac-wrap .afac-platform-email {
--afac-cta-color: #ccb1ff;
--afac-cta-rgb: 204, 177, 255;
}
.afac-wrap .afac-platform-rss {
--afac-cta-color: #ffba67;
--afac-cta-rgb: 255, 186, 103;
}
.afac-wrap .afac-platform-link {
--afac-cta-color: #67e8f9;
--afac-cta-rgb: 103, 232, 249;
} .afac-wrap .afac-card .afac-button {
position: relative;
isolation: isolate;
display: inline-flex;
align-items: center;
justify-content: center;
align-self: stretch;
min-width: 0;
min-height: 44px;
gap: 0.52rem;
overflow: hidden;
margin: auto 0 0;
padding: 0.7rem 1rem;
border: 0;
border-radius: 999px;
color: #04121d;
background: linear-gradient(
135deg,
var(--afac-cta-color),
var(--afac-green)
);
box-shadow:
0 7px 18px rgba(0, 0, 0, 0.14),
0 0 0 rgba(var(--afac-cta-rgb), 0);
font-family: inherit;
font-size: 0.94rem;
font-weight: 800;
line-height: 1.2;
text-align: center;
text-decoration: none;
transform: translateZ(0);
transition:
transform 150ms ease,
box-shadow 150ms ease,
filter 150ms ease;
} .afac-wrap .afac-button .afac-button-label {
position: relative;
z-index: 3;
display: inline-block;
min-width: 0;
color: inherit;
line-height: inherit;
overflow-wrap: anywhere;
} .afac-wrap .afac-button .afac-button-icon {
position: relative;
z-index: 3;
display: inline-grid;
width: 20px;
height: 20px;
flex: 0 0 20px;
place-items: center;
color: #04121d;
line-height: 1;
pointer-events: none;
transform-origin: 52% 52%;
animation:
afac-cta-icon-flight
5.6s
cubic-bezier(0.22, 0.75, 0.24, 1)
infinite;
will-change: transform;
}
.afac-wrap .afac-button .afac-button-icon svg {
display: block;
width: 100%;
height: 100%;
overflow: visible;
color: inherit;
fill: currentColor;
pointer-events: none;
} .afac-wrap .afac-button::before {
position: absolute;
z-index: 2;
top: 50%;
left: calc(50% - 54px);
width: 28px;
height: 2px;
border-radius: 999px;
background: linear-gradient(
90deg,
transparent,
rgba(4, 18, 29, 0.18),
rgba(4, 18, 29, 0.72)
);
content: "";
opacity: 0;
pointer-events: none;
transform:
translate3d(-20px, 7px, 0)
rotate(-12deg)
scaleX(0);
transform-origin: right center;
animation: afac-cta-icon-trail 5.6s ease-out infinite;
will-change: transform, opacity;
} .afac-wrap .afac-button::after {
position: absolute;
z-index: 1;
top: 50%;
left: calc(50% - 46px);
width: 31px;
height: 31px;
border: 1px solid rgba(4, 18, 29, 0.34);
border-radius: 50%;
content: "";
opacity: 0;
pointer-events: none;
transform:
translate(-50%, -50%)
scale(0.55);
animation: afac-cta-icon-ring 5.6s ease-out infinite;
will-change: transform, opacity;
} @keyframes afac-cta-icon-flight {
0%,
5%,
24%,
100% {
transform:
translate3d(0, 0, 0)
rotate(0deg)
scale(1);
}
7% {
transform:
translate3d(-2px, 2px, 0)
rotate(-8deg)
scale(0.94);
}
12% {
transform:
translate3d(5px, -4px, 0)
rotate(9deg)
scale(1.16);
}
15% {
transform:
translate3d(8px, -7px, 0)
rotate(13deg)
scale(1.08);
}
19% {
transform:
translate3d(-1px, 1px, 0)
rotate(-4deg)
scale(0.98);
}
22% {
transform:
translate3d(0, 0, 0)
rotate(0deg)
scale(1.02);
}
}
@keyframes afac-cta-icon-trail {
0%,
6%,
21%,
100% {
opacity: 0;
transform:
translate3d(-20px, 7px, 0)
rotate(-12deg)
scaleX(0);
}
11% {
opacity: 0.62;
transform:
translate3d(-7px, 2px, 0)
rotate(-12deg)
scaleX(0.72);
}
15% {
opacity: 0.84;
transform:
translate3d(1px, -2px, 0)
rotate(-12deg)
scaleX(1);
}
20% {
opacity: 0;
transform:
translate3d(13px, -7px, 0)
rotate(-12deg)
scaleX(0.25);
}
}
@keyframes afac-cta-icon-ring {
0%,
6%,
22%,
100% {
opacity: 0;
transform:
translate(-50%, -50%)
scale(0.55);
}
13% {
opacity: 0.42;
}
20% {
opacity: 0;
transform:
translate(-50%, -50%)
scale(1.35);
}
} .afac-wrap .afac-card .afac-button:hover,
.afac-wrap .afac-card .afac-button:focus-visible {
color: #04121d;
box-shadow:
0 0 18px rgba(var(--afac-cta-rgb), 0.48),
0 9px 20px rgba(0, 0, 0, 0.18);
filter: brightness(1.05);
transform: translateY(-2px) scale(1.01);
}
.afac-wrap .afac-card .afac-button:hover
.afac-button-icon,
.afac-wrap .afac-card .afac-button:focus-visible
.afac-button-icon {
animation:
afac-cta-icon-hover
520ms
cubic-bezier(0.2, 0.8, 0.25, 1)
both;
}
.afac-wrap .afac-card .afac-button:hover::before,
.afac-wrap .afac-card .afac-button:focus-visible::before {
animation:
afac-cta-trail-hover
520ms
ease-out
both;
}
.afac-wrap .afac-card .afac-button:hover::after,
.afac-wrap .afac-card .afac-button:focus-visible::after {
animation:
afac-cta-ring-hover
520ms
ease-out
both;
}
.afac-wrap .afac-card .afac-button:focus-visible {
outline: 3px solid rgba(var(--afac-cta-rgb), 0.82);
outline-offset: 3px;
}
@keyframes afac-cta-icon-hover {
0% {
transform:
translate3d(0, 0, 0)
rotate(0deg)
scale(1);
}
35% {
transform:
translate3d(-2px, 2px, 0)
rotate(-8deg)
scale(0.94);
}
72% {
transform:
translate3d(7px, -6px, 0)
rotate(12deg)
scale(1.2);
}
100% {
transform:
translate3d(2px, -2px, 0)
rotate(4deg)
scale(1.1);
}
}
@keyframes afac-cta-trail-hover {
0% {
opacity: 0;
transform:
translate3d(-20px, 7px, 0)
rotate(-12deg)
scaleX(0);
}
48% {
opacity: 0.7;
transform:
translate3d(-5px, 1px, 0)
rotate(-12deg)
scaleX(0.9);
}
100% {
opacity: 0;
transform:
translate3d(12px, -6px, 0)
rotate(-12deg)
scaleX(0.25);
}
}
@keyframes afac-cta-ring-hover {
0% {
opacity: 0;
transform:
translate(-50%, -50%)
scale(0.55);
}
45% {
opacity: 0.42;
}
100% {
opacity: 0;
transform:
translate(-50%, -50%)
scale(1.35);
}
} .afac-wrap .afac-share {
position: relative;
z-index: 1;
isolation: isolate;
display: flex;
align-items: center;
justify-content: space-between;
flex-flow: row nowrap;
gap: 0.75rem;
width: 100%;
min-height: 0;
margin: 0;
padding: 0.65rem 0.8rem;
overflow: visible;
border: 1px solid var(--afac-line);
border-radius: 14px;
background: linear-gradient(
135deg,
#111f32,
#081424
);
box-shadow:
0 0 10px rgba(103, 232, 249, 0.16),
inset 0 1px rgba(255, 255, 255, 0.05);
} .afac-wrap .afac-share::before {
position: absolute;
z-index: -1;
inset: -5px;
border-radius: 18px;
background: transparent;
box-shadow:
0 0 10px rgba(103, 232, 249, 0.7),
0 0 24px rgba(103, 232, 249, 0.48),
0 0 42px rgba(110, 231, 183, 0.22);
content: "";
opacity: 0.3;
pointer-events: none;
animation:
afac-panel-glow
2.8s
ease-in-out
infinite
alternate;
}
@keyframes afac-panel-glow {
from {
opacity: 0.28;
}
to {
opacity: 0.95;
}
} .afac-wrap .afac-share > .afac-title {
position: relative;
z-index: 2;
display: block;
flex: 0 0 auto;
align-self: center;
width: auto;
min-width: 0;
margin: 0;
padding: 0;
color: #fff;
font-family:
system-ui,
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
Arial,
sans-serif;
font-size: 1.3rem;
font-style: normal;
font-weight: 900;
line-height: 1.2;
letter-spacing: 0.01em;
text-align: left;
text-transform: none;
text-shadow:
0 0 6px rgba(103, 232, 249, 0.7),
0 0 14px rgba(103, 232, 249, 0.35);
} .afac-wrap .afac-share > .afac-links {
position: relative;
z-index: 2;
display: flex;
flex: 0 1 auto;
flex-wrap: wrap;
align-items: center;
justify-content: flex-end;
gap: 0.4rem;
width: auto;
margin: 0;
padding: 0;
} .afac-wrap .afac-link {
--afac-icon-color: var(--afac-accent);
--afac-icon-rgb: 103, 232, 249;
--afac-delay: 0s;
position: relative;
isolation: isolate;
display: inline-grid;
width: 38px;
height: 38px;
flex: 0 0 38px;
place-items: center;
margin: 0;
padding: 0;
overflow: hidden;
border: 1px solid rgba(var(--afac-icon-rgb), 0.48);
border-radius: 10px;
color: var(--afac-icon-color);
background: rgba(7, 20, 35, 0.96);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.05);
cursor: pointer;
font: inherit;
line-height: 1;
text-decoration: none;
appearance: none;
-webkit-appearance: none;
transform: translateZ(0);
animation:
afac-icon-button-pulse
6s
ease-out
infinite;
animation-delay: var(--afac-delay);
transition:
transform 150ms ease,
border-color 150ms ease,
background-color 150ms ease,
box-shadow 150ms ease,
color 150ms ease;
} .afac-wrap .afac-link::before {
position: absolute;
z-index: 1;
top: 50%;
left: 8px;
width: 19px;
height: 2px;
border-radius: 999px;
background: linear-gradient(
90deg,
transparent,
rgba(var(--afac-icon-rgb), 0.22),
rgba(var(--afac-icon-rgb), 0.96)
);
content: "";
opacity: 0;
pointer-events: none;
transform:
translate3d(-12px, 6px, 0)
rotate(-12deg)
scaleX(0);
transform-origin: right center;
animation:
afac-icon-trail
6s
ease-out
infinite;
animation-delay: var(--afac-delay);
will-change: transform, opacity;
} .afac-wrap .afac-link::after {
position: absolute;
z-index: 0;
inset: 2px;
border: 1px solid currentColor;
border-radius: 7px;
content: "";
opacity: 0.18;
pointer-events: none;
transform: scale(0.92);
animation:
afac-icon-ring
6s
ease-out
infinite;
animation-delay: var(--afac-delay);
will-change: transform, opacity;
}
.afac-wrap .afac-link svg {
position: relative;
z-index: 2;
display: block;
width: 18px;
height: 18px;
color: inherit;
fill: currentColor;
pointer-events: none;
transform-origin: 52% 52%;
animation:
afac-icon-takeoff
6s
cubic-bezier(0.22, 0.75, 0.24, 1)
infinite;
animation-delay: var(--afac-delay);
will-change: transform;
} @keyframes afac-icon-takeoff {
0%,
5%,
23%,
100% {
transform:
translate3d(0, 0, 0)
rotate(0deg)
scale(1);
}
7% {
transform:
translate3d(-1px, 1px, 0)
rotate(-7deg)
scale(0.94);
}
11% {
transform:
translate3d(4px, -4px, 0)
rotate(9deg)
scale(1.16);
}
14% {
transform:
translate3d(6px, -6px, 0)
rotate(12deg)
scale(1.08);
}
18% {
transform:
translate3d(-1px, 1px, 0)
rotate(-4deg)
scale(0.97);
}
21% {
transform:
translate3d(0, 0, 0)
rotate(0deg)
scale(1.02);
}
}
@keyframes afac-icon-trail {
0%,
6%,
20%,
100% {
opacity: 0;
transform:
translate3d(-12px, 6px, 0)
rotate(-12deg)
scaleX(0);
}
10% {
opacity: 0.75;
transform:
translate3d(-4px, 1px, 0)
rotate(-12deg)
scaleX(0.7);
}
14% {
opacity: 0.9;
transform:
translate3d(1px, -2px, 0)
rotate(-12deg)
scaleX(1);
}
19% {
opacity: 0;
transform:
translate3d(8px, -6px, 0)
rotate(-12deg)
scaleX(0.25);
}
}
@keyframes afac-icon-ring {
0%,
5%,
22%,
100% {
opacity: 0.16;
transform: scale(0.92);
}
12% {
opacity: 0.68;
transform: scale(1);
}
}
@keyframes afac-icon-button-pulse {
0%,
5%,
22%,
100% {
border-color: rgba(var(--afac-icon-rgb), 0.46);
box-shadow:
inset 0 1px rgba(255, 255, 255, 0.05),
0 0 0 rgba(var(--afac-icon-rgb), 0);
}
12% {
border-color: var(--afac-icon-color);
box-shadow:
inset 0 1px rgba(255, 255, 255, 0.08),
0 0 11px rgba(var(--afac-icon-rgb), 0.42);
}
} .afac-wrap .afac-link:nth-child(1) {
--afac-delay: 0s;
}
.afac-wrap .afac-link:nth-child(2) {
--afac-delay: 0.18s;
}
.afac-wrap .afac-link:nth-child(3) {
--afac-delay: 0.36s;
}
.afac-wrap .afac-link:nth-child(4) {
--afac-delay: 0.54s;
}
.afac-wrap .afac-link:nth-child(5) {
--afac-delay: 0.72s;
}
.afac-wrap .afac-link:nth-child(6) {
--afac-delay: 0.9s;
}
.afac-wrap .afac-link:nth-child(7) {
--afac-delay: 1.08s;
}
.afac-wrap .afac-link:nth-child(8) {
--afac-delay: 1.26s;
}
.afac-wrap .afac-link:nth-child(9) {
--afac-delay: 1.44s;
}
.afac-wrap .afac-link:nth-child(10) {
--afac-delay: 1.62s;
} .afac-wrap .afac-facebook,
.afac-wrap .afac-link-facebook {
--afac-icon-color: #78b4ff;
--afac-icon-rgb: 120, 180, 255;
}
.afac-wrap .afac-x,
.afac-wrap .afac-link-x {
--afac-icon-color: #f4f7fb;
--afac-icon-rgb: 244, 247, 251;
}
.afac-wrap .afac-linkedin,
.afac-wrap .afac-link-linkedin {
--afac-icon-color: #67c3ff;
--afac-icon-rgb: 103, 195, 255;
}
.afac-wrap .afac-whatsapp,
.afac-wrap .afac-link-whatsapp {
--afac-icon-color: #6ee7ae;
--afac-icon-rgb: 110, 231, 174;
}
.afac-wrap .afac-telegram,
.afac-wrap .afac-link-telegram {
--afac-icon-color: #74dcff;
--afac-icon-rgb: 116, 220, 255;
}
.afac-wrap .afac-reddit,
.afac-wrap .afac-link-reddit {
--afac-icon-color: #ff936f;
--afac-icon-rgb: 255, 147, 111;
}
.afac-wrap .afac-email,
.afac-wrap .afac-link-email {
--afac-icon-color: #ccb1ff;
--afac-icon-rgb: 204, 177, 255;
}
.afac-wrap .afac-copy,
.afac-wrap .afac-link-copy {
--afac-icon-color: #ffd27a;
--afac-icon-rgb: 255, 210, 122;
} .afac-wrap .afac-link:hover,
.afac-wrap .afac-link:focus-visible {
z-index: 3;
color: var(--afac-dark);
border-color: var(--afac-icon-color);
background: var(--afac-icon-color);
box-shadow:
0 0 18px rgba(var(--afac-icon-rgb), 0.62),
0 6px 16px rgba(0, 0, 0, 0.22);
animation: none;
transform: translateY(-2px) scale(1.04);
}
.afac-wrap .afac-link:hover::before,
.afac-wrap .afac-link:focus-visible::before {
animation:
afac-icon-hover-trail
520ms
ease-out
both;
}
.afac-wrap .afac-link:hover::after,
.afac-wrap .afac-link:focus-visible::after {
color: var(--afac-dark);
opacity: 0.34;
animation: none;
transform: scale(1);
}
.afac-wrap .afac-link:hover svg,
.afac-wrap .afac-link:focus-visible svg {
color: var(--afac-dark);
fill: currentColor;
animation:
afac-icon-hover-takeoff
520ms
cubic-bezier(0.2, 0.8, 0.25, 1)
both;
}
.afac-wrap .afac-link:focus-visible {
outline: 3px solid rgba(var(--afac-icon-rgb), 0.78);
outline-offset: 2px;
}
@keyframes afac-icon-hover-takeoff {
0% {
transform:
translate3d(0, 0, 0)
rotate(0deg)
scale(1);
}
35% {
transform:
translate3d(-1px, 1px, 0)
rotate(-7deg)
scale(0.94);
}
72% {
transform:
translate3d(5px, -5px, 0)
rotate(11deg)
scale(1.18);
}
100% {
transform:
translate3d(1px, -1px, 0)
rotate(3deg)
scale(1.1);
}
}
@keyframes afac-icon-hover-trail {
0% {
opacity: 0;
transform:
translate3d(-12px, 6px, 0)
rotate(-12deg)
scaleX(0);
}
48% {
opacity: 0.72;
transform:
translate3d(-3px, 1px, 0)
rotate(-12deg)
scaleX(0.9);
}
100% {
opacity: 0;
transform:
translate3d(8px, -5px, 0)
rotate(-12deg)
scaleX(0.25);
}
} .afac-wrap .afac-links:hover .afac-link:not(:hover),
.afac-wrap .afac-links:focus-within
.afac-link:not(:focus-visible),
.afac-wrap .afac-links:hover
.afac-link:not(:hover)::before,
.afac-wrap .afac-links:hover
.afac-link:not(:hover)::after,
.afac-wrap .afac-links:hover
.afac-link:not(:hover) svg,
.afac-wrap .afac-links:focus-within
.afac-link:not(:focus-visible)::before,
.afac-wrap .afac-links:focus-within
.afac-link:not(:focus-visible)::after,
.afac-wrap .afac-links:focus-within
.afac-link:not(:focus-visible) svg {
animation-play-state: paused;
} .afac-wrap > .afac-status {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
border: 0;
clip: rect(0 0 0 0);
clip-path: inset(50%);
white-space: nowrap;
} .af-single-content .afac-wrap {
position: relative !important;
display: block !important;
width: 100% !important;
margin: 0.75rem 0 0 !important;
padding: 0 !important;
border: 0 !important;
}
.af-single-content .afac-wrap .afac-share {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
flex-flow: row nowrap !important;
gap: 0.75rem !important;
min-height: 0 !important;
height: auto !important;
margin: 0 !important;
padding: 0.65rem 0.8rem !important;
overflow: visible !important;
}
.af-single-content
.afac-wrap
.afac-share > .afac-title {
display: block !important;
flex: 0 0 auto !important;
align-self: center !important;
width: auto !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
color: #fff !important;
font-family:
system-ui,
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
Arial,
sans-serif !important;
font-size: 1.3rem !important;
font-style: normal !important;
font-weight: 900 !important;
line-height: 1.2 !important;
letter-spacing: 0.01em !important;
text-align: left !important;
text-transform: none !important;
text-shadow:
0 0 6px rgba(103, 232, 249, 0.7),
0 0 14px rgba(103, 232, 249, 0.35) !important;
}
.af-single-content
.afac-wrap
.afac-share > .afac-links {
display: flex !important;
flex: 0 1 auto !important;
flex-wrap: wrap !important;
align-items: center !important;
justify-content: flex-end !important;
gap: 0.4rem !important;
width: auto !important;
margin: 0 !important;
padding: 0 !important;
}  @media (max-width: 900px) {
.afac-wrap .afac-cards {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
} @media (max-width: 620px) {
.afac-wrap,
.af-single-content .afac-wrap {
margin-top: 0.65rem !important;
}
.afac-wrap .afac-cards {
grid-template-columns: minmax(0, 1fr);
gap: 0.75rem;
margin-bottom: 0.85rem;
}
.afac-wrap .afac-card {
min-height: 0;
padding: 1rem;
border-radius: 15px;
}
.afac-wrap .afac-card .afac-button {
min-height: 44px;
padding: 0.68rem 0.9rem;
}
.afac-wrap .afac-button .afac-button-icon {
width: 19px;
height: 19px;
flex-basis: 19px;
}
.afac-wrap .afac-share,
.af-single-content .afac-wrap .afac-share {
flex-wrap: wrap !important;
gap: 0.55rem !important;
padding: 0.6rem !important;
border-radius: 12px;
}
.afac-wrap .afac-share::before {
inset: -4px;
border-radius: 16px;
}
.afac-wrap .afac-share > .afac-title,
.af-single-content
.afac-wrap
.afac-share > .afac-title {
font-size: 1rem !important;
}
.afac-wrap .afac-share > .afac-links,
.af-single-content
.afac-wrap
.afac-share > .afac-links {
justify-content: flex-start !important;
}
.afac-wrap .afac-link {
width: 36px;
height: 36px;
flex-basis: 36px;
border-radius: 9px;
}
.afac-wrap .afac-link svg {
width: 17px;
height: 17px;
}
}
@media (max-width: 420px) {
.afac-wrap .afac-share,
.af-single-content .afac-wrap .afac-share {
display: grid !important;
grid-template-columns: minmax(0, 1fr) !important;
}
.afac-wrap .afac-share > .afac-links,
.af-single-content
.afac-wrap
.afac-share > .afac-links {
width: 100% !important;
}
} @media (prefers-reduced-motion: reduce) {
.afac-wrap .afac-share::before,
.afac-wrap .afac-link,
.afac-wrap .afac-link::before,
.afac-wrap .afac-link::after,
.afac-wrap .afac-link svg,
.afac-wrap .afac-button .afac-button-icon,
.afac-wrap .afac-button::before,
.afac-wrap .afac-button::after {
animation: none;
}
.afac-wrap .afac-share::before {
opacity: 0.62;
}
.afac-wrap .afac-link::before,
.afac-wrap .afac-button::before,
.afac-wrap .afac-button::after {
opacity: 0;
transform: none;
}
.afac-wrap .afac-link::after {
opacity: 0.24;
transform: none;
}
.afac-wrap .afac-button .afac-button-icon {
transform: none;
}
.afac-wrap .afac-card,
.afac-wrap .afac-card .afac-button,
.afac-wrap .afac-link {
transition: none;
}
.afac-wrap .afac-card:hover,
.afac-wrap .afac-card:focus-within,
.afac-wrap .afac-card .afac-button:hover,
.afac-wrap .afac-card .afac-button:focus-visible,
.afac-wrap .afac-card .afac-button:hover
.afac-button-icon,
.afac-wrap .afac-card .afac-button:focus-visible
.afac-button-icon,
.afac-wrap .afac-link:hover,
.afac-wrap .afac-link:focus-visible,
.afac-wrap .afac-link:hover svg,
.afac-wrap .afac-link:focus-visible svg {
animation: none;
transform: none;
}
}