.campaign-pill {
    width: fit-content !important;
    margin-bottom: 24px;
    padding: 9px 17px;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #fff;
    background: linear-gradient(90deg, #1d3ede, #06c6f9);
    border-radius: 50px;
    font-size: 13px;
    line-height: 1.3;
}

.campaign-pill:hover { color: #fff; background: linear-gradient(-220deg, #1d3ede, #01e6f8); }
.campaign-pill:focus-visible,
.hero_buttons .button:focus-visible { outline: 3px solid rgba(29, 62, 222, .3); outline-offset: 3px; }
.campaign-pill strong { font-size: 11px; letter-spacing: .08em; }
.campaign-pill small { padding-left: 12px; border-left: 1px solid rgba(255,255,255,.45); font-size: 11px; }

.site-status {
    margin-top: 18px;
    margin-bottom: 22px;
    width: fit-content;
    padding: 6px 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #547080;
    background: #f1fbf8;
    border: 1px solid #d7f2e8;
    border-radius: 20px;
    font-size: 11px;
}

.site-status i {
    position: relative;
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    border-radius: 50%;
    background: #19c794;
}

.site-status i::after {
    content: "";
    position: absolute;
    inset: -4px;
    border: 1px solid #19c794;
    border-radius: 50%;
    animation: status-pulse 2.4s ease-out infinite;
    will-change: opacity, transform;
}

.site-status strong { color: #244f66; font-weight: 600; }

.hero_buttons {
    margin-top: 0 !important;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.hero_buttons .button {
    min-height: 46px;
    padding: 11px 20px;
    font-size: 16px;
    line-height: 1.35;
}

.hero_buttons .button_secondary {
    color: #1683a2;
    background: #fff;
    border: 1px solid #91dce9;
}

.hero_buttons .button_secondary:hover { color: #0b6c88; background: #ecfbfe; border-color: #37cfe9; }

.tech_logos {
    width: 122px;
    height: 92px;
    margin-right: 28px;
    padding: 10px;
    flex: 0 0 122px;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    gap: 7px;
    background: #fff;
    border: 1px solid #e3edf2;
    border-radius: 22px;
    box-shadow: 0 12px 32px rgba(27, 89, 117, .11);
    transition: transform .2s ease, box-shadow .2s ease;
}

.tech_logos img {
    width: 27px;
    height: 27px;
    padding: 5px;
    display: block;
    object-fit: contain;
    background: #f5f9fb;
    border: 1px solid #e8eff3;
    border-radius: 8px;
}

.tech_logos--four { padding-inline: 24px; }
.tech_logos--two { flex-wrap: nowrap; align-items: center; }
.tech_elem:hover .tech_logos { transform: translateY(-2px); box-shadow: 0 16px 38px rgba(27, 89, 117, .16); }
.tech_logos--more { flex-direction: column; gap: 0; color: #168fb5; background: linear-gradient(145deg, #f8fdff, #e8faff); }
.tech_logos--more span { font-size: 34px; font-weight: 300; line-height: .9; }
.tech_logos--more small { margin-top: 5px; font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }

.campaign-note {
    max-width: 360px;
    margin: 28px 0;
    padding: 17px 20px;
    color: #15516f;
    background: #eafaff;
    border-left: 4px solid #06c6f9;
    line-height: 1.45;
}

.campaign-note span { display: block; margin-bottom: 3px; color: #37809f; font-size: 12px; text-transform: uppercase; }
.campaign-note strong { font-size: 15px; }

.hosting_elem-price.campaign-price {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 7px;
}

.campaign-price strong { color: #0abde9; font-size: 20px; font-weight: 600; }
.campaign-price del { color: #999; font-size: 13px; }
.campaign-price span,
.campaign-credit {
    padding: 3px 7px;
    color: #fff;
    background: #1d3ede;
    border-radius: 20px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
}

.campaign-credit { width: fit-content; margin: 7px 0 3px; background: #06c6f9; }
.location-new .card { position: relative; }
.location-new .card::after {
    content: "NEW · #34";
    position: absolute;
    top: 15px;
    right: 15px;
    padding: 5px 9px;
    color: #fff;
    background: #1d3ede;
    border-radius: 20px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
}

@keyframes status-pulse {
    0%, 35% { opacity: .75; transform: scale(.65); }
    75%, 100% { opacity: 0; transform: scale(1.35); }
}

@media screen and (max-width: 670px) {
    .tech_logos { margin-right: 0; margin-bottom: 16px; }
}

@media screen and (max-width: 576px) {
    .hero_content-left h1 { font-size: clamp(42px, 11vw, 56px); }
    .campaign-pill { margin-bottom: 18px; flex-wrap: wrap; gap: 6px 10px; font-size: 12px; }
    .campaign-pill small { padding-left: 10px; }
    .campaign-note { margin: 22px 0; }
    .campaign-price strong { font-size: 18px; }
    .site-status { align-items: flex-start; line-height: 1.45; }
    .hero_buttons { flex-direction: column; align-items: stretch; }
    .hero_buttons .button { width: 100%; }
    .tech_logos { width: 96px; height: 82px; padding: 7px; flex-basis: 96px; gap: 5px; border-radius: 18px; }
    .tech_logos img { width: 24px; height: 24px; padding: 4px; }
    .tech_logos--four { padding-inline: 14px; }
}

@media (prefers-reduced-motion: reduce) {
    .site-status i::after { animation: none; }
    .tech_logos { transition: none; }
}
