:root {
--gp-brand: var(--wp--preset--color--brand, #2944cc);
--gp-text: var(--wp--preset--color--text-primary, #1a1a1a);
--gp-muted: var(--wp--preset--color--text-muted, #4d5874);
--gp-divider: rgba(185, 203, 243, 0.6);
--gp-radius-card: 24px;
--gp-section-gap: clamp(56px, 7vw, 100px);
--gp-ico-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E");
--gp-ico-user: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='12' cy='7.5' r='4'/%3E%3Cpath d='M4.5 20.5c0-3.6 3.4-6 7.5-6s7.5 2.4 7.5 6'/%3E%3C/svg%3E");
--gp-ico-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3Crect x='3' y='4' width='18' height='18' rx='4'/%3E%3Cpath d='M8 14h.01M12 14h.01M16 14h.01M8 18h.01M12 18h.01M16 18h.01' stroke-width='2.4'/%3E%3C/svg%3E");
--gp-ico-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M8 12.5l2.5 2.5L16 9'/%3E%3C/svg%3E");
} *,
*::before,
*::after {
box-sizing: border-box;
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
}
.wp-site-blocks {
overflow-x: clip;
}
.gp-icon {
flex: none;
display: inline-block;
vertical-align: middle;
}
.screen-reader-text {
border: 0;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute !important;
width: 1px;
word-wrap: normal !important;
}
:where(.wp-site-blocks) a:focus-visible,
:where(.wp-site-blocks) button:focus-visible,
:where(.wp-site-blocks) input:focus-visible {
outline: 2px solid var(--gp-brand);
outline-offset: 2px;
} .wp-site-blocks > * {
margin-block-start: 0;
} .gp-top {
position: relative;
background-color: var(--wp--preset--color--page);
background-image: url(//blog.guardspro.com/wp-content/themes/guardspro-blog/assets/images/hero-bg.webp);
background-position: center top;
background-repeat: no-repeat;
background-size: max(1920px, 100%) auto;
padding-bottom: 40px;
}
.gp-top > * + * {
margin-block-start: 0;
} .gp-header-wrap {
position: relative;
z-index: 20;
}
.gp-header {
padding-block: 16px;
}
.gp-header__inner {
gap: 24px;
min-height: 48px;
}
.gp-header .wp-block-site-logo,
.gp-footer .wp-block-site-logo {
line-height: 0;
flex: none;
}
.gp-header .wp-block-site-logo img {
width: 216px;
height: auto;
}
.gp-nav {
flex: 1 1 auto;
color: var(--gp-text);
}
.gp-nav .wp-block-navigation-item__content {
color: var(--gp-text);
font-size: 16px;
font-weight: 600;
letter-spacing: -0.5px;
line-height: 24px;
padding-block: 8px;
}
.gp-nav .wp-block-navigation-item__content:hover {
color: var(--gp-brand);
}
.gp-nav .wp-block-navigation__submenu-icon {
width: 12px;
height: 12px;
margin-left: 8px;
}
.gp-nav .wp-block-navigation__submenu-icon svg {
stroke-width: 2px;
width: 12px;
height: 12px;
}
.gp-nav .wp-block-navigation__submenu-container {
border: 1px solid var(--wp--preset--color--border-blue) !important;
border-radius: 16px;
padding: 8px !important;
box-shadow: 0 16px 40px rgba(12, 36, 89, 0.12);
min-width: 230px !important;
background: #fff !important;
}
.gp-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
font-weight: 500;
padding: 8px 12px !important;
border-radius: 10px;
}
.gp-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
background: var(--wp--preset--color--surface-blue);
}
.gp-header__actions {
flex: none;
flex-wrap: nowrap !important;
}
.gp-header__actions .wp-block-button__link {
font-size: 16px;
letter-spacing: -0.5px;
line-height: 24px;
padding: 12px 20px;
} .wp-block-button__link {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.is-style-gp-outline .wp-block-button__link {
background: transparent;
color: #1d2939;
border: 1px solid #b4bbcc;
font-size: 16px;
line-height: 24px;
padding: 11px 23px;
}
.is-style-gp-outline .wp-block-button__link:hover {
background: #fff;
color: var(--gp-brand);
border-color: var(--gp-brand);
}
.gp-header .is-style-gp-outline .wp-block-button__link {
border-color: #e1e8fa;
background: rgba(255, 255, 255, 0.6);
}
.is-style-gp-soft .wp-block-button__link {
background: rgba(41, 68, 204, 0.05);
color: var(--gp-brand);
border: 1px solid transparent;
}
.is-style-gp-soft .wp-block-button__link:hover {
background: rgba(41, 68, 204, 0.12);
color: var(--gp-brand);
}
.is-style-gp-yellow .wp-block-button__link {
background: var(--wp--preset--color--yellow);
color: var(--gp-text);
font-size: 16px;
line-height: 24px;
padding: 12px 24px;
}
.is-style-gp-yellow .wp-block-button__link:hover {
background: #ffc95c;
color: var(--gp-text);
}
.gp-arrow .wp-block-button__link::after,
.gp-icon-user .wp-block-button__link::before,
.gp-icon-calendar .wp-block-button__link::before {
content: "";
width: 20px;
height: 20px;
flex: none;
background: currentColor;
-webkit-mask: var(--gp-ico) center / contain no-repeat;
mask: var(--gp-ico) center / contain no-repeat;
}
.gp-arrow .wp-block-button__link::after {
--gp-ico: var(--gp-ico-chevron);
width: 16px;
height: 16px;
}
.gp-icon-user .wp-block-button__link::before {
--gp-ico: var(--gp-ico-user);
color: var(--gp-brand);
}
.gp-icon-calendar .wp-block-button__link::before {
--gp-ico: var(--gp-ico-calendar);
} .gp-hero {
padding-top: clamp(32px, 4vw, 64px);
}
.gp-hero__title.gp-hero__title {
margin: 0;
font-size: var(--wp--preset--font-size--display);
line-height: 1.143;
letter-spacing: -1px;
color: var(--gp-text);
}
.gp-hero__lead {
margin: 16px 0 0;
max-width: 614px;
font-size: 16px;
line-height: 24px;
color: var(--gp-muted);
}
.gp-hero__lead p {
margin: 0;
} .gp-tabs-wrap {
margin-top: 40px;
}
.gp-tabs {
display: flex;
align-items: center;
gap: 20px;
}
.gp-tabs__nav {
flex: 1 1 auto;
min-width: 0;
background: var(--wp--preset--color--surface-blue);
border: 1px solid var(--wp--preset--color--border-blue);
border-radius: 100px;
padding: 4px;
}
.gp-tabs__list {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0;
list-style: none;
margin: 0;
padding: 0;
}
.gp-tabs__tab {
display: inline-flex;
align-items: center;
gap: 4px;
padding: 10px 14px;
border: 0;
border-radius: 100px;
background: transparent;
font: inherit;
font-size: 14px;
font-weight: 600;
line-height: 20px;
color: var(--gp-text);
white-space: nowrap;
cursor: pointer;
text-decoration: none;
transition: background-color 0.15s ease, color 0.15s ease;
}
.gp-tabs__tab:hover {
background: rgba(41, 68, 204, 0.08);
color: var(--gp-brand);
}
.gp-tabs__tab.is-active,
.gp-tabs__tab.is-active:hover {
background: var(--gp-brand);
color: #fff;
}
.gp-tabs__more {
position: relative;
}
.gp-tabs__more .gp-icon {
transition: transform 0.15s ease;
}
.gp-tabs__more.is-open .gp-icon {
transform: rotate(180deg);
}
.gp-tabs__menu {
position: absolute;
right: 0;
top: calc(100% + 8px);
z-index: 30;
min-width: 220px;
margin: 0;
padding: 8px;
list-style: none;
background: #fff;
border: 1px solid var(--wp--preset--color--border-blue);
border-radius: 16px;
box-shadow: 0 16px 40px rgba(12, 36, 89, 0.12);
}
.gp-tabs__menu[hidden] {
display: none;
}
.gp-tabs__menu a {
display: block;
padding: 8px 12px;
border-radius: 10px;
font-size: 14px;
font-weight: 500;
color: var(--gp-text);
}
.gp-tabs__menu a:hover,
.gp-tabs__menu a.is-active {
background: var(--wp--preset--color--surface-blue);
color: var(--gp-brand);
} .gp-tabs {
position: relative;
gap: 8px;
}
.gp-tabs__search-toggle {
flex: none;
display: grid;
place-items: center;
width: 48px;
height: 48px;
padding: 4px;
border: 1px solid var(--wp--preset--color--border-blue);
border-radius: 100px;
background: var(--wp--preset--color--surface-blue);
color: var(--gp-text);
cursor: pointer;
}
.gp-tabs__search-toggle > span {
display: grid;
place-items: center;
width: 40px;
height: 40px;
border-radius: 100px;
transition: background-color 0.15s ease, color 0.15s ease;
}
.gp-tabs__search-toggle:hover > span,
.gp-tabs__search-toggle:focus-visible > span {
background: rgba(41, 68, 204, 0.08);
color: var(--gp-brand);
}
.gp-search {
position: relative;
flex: 1 1 auto;
display: flex;
align-items: center;
gap: 12px;
min-width: 0;
margin: 0;
padding: 4px 4px 4px 16px;
background: var(--wp--preset--color--surface-blue);
border: 1px solid var(--wp--preset--color--border-blue);
border-radius: 100px;
}
.gp-search__icon {
display: grid;
flex: none;
color: var(--gp-text);
}
.gp-search input[type="search"] {
flex: 1;
min-width: 0;
height: 40px;
border: 0;
padding: 0;
background: transparent;
font: inherit;
font-size: 14px;
font-weight: 600;
line-height: 20px;
color: #101219;
outline: none;
-webkit-appearance: none;
appearance: none;
}
.gp-search input[type="search"]::-webkit-search-cancel-button {
display: none;
}
.gp-search input::placeholder {
color: var(--gp-muted);
opacity: 1;
}
.gp-search:focus-within {
border-color: #b9cbf3;
box-shadow: 0 0 0 3px rgba(41, 68, 204, 0.12);
}
.gp-search__close {
flex: none;
display: grid;
place-items: center;
width: 40px;
height: 40px;
padding: 0;
border: 0;
border-radius: 100px;
background: var(--gp-brand);
color: #fff;
cursor: pointer;
}
.gp-search__close:hover {
background: var(--wp--preset--color--accent);
} .gp-tabs.is-js:not(.is-searching) .gp-search,
.gp-tabs.is-searching .gp-tabs__nav,
.gp-tabs.is-searching .gp-tabs__search-toggle,
.gp-tabs:not(.is-js) .gp-tabs__search-toggle,
.gp-tabs:not(.is-js) .gp-search__close {
display: none;
}
.gp-tabs.is-searching .gp-search {
animation: gp-search-in 0.2s ease;
}
@keyframes gp-search-in {
from {
opacity: 0;
transform: scaleX(0.96);
}
} .gp-search__results {
position: absolute;
top: calc(100% + 4px);
left: -1px;
right: -1px;
z-index: 40;
display: flex;
flex-direction: column;
gap: 8px;
padding: 16px;
background: #fff;
border: 1px solid var(--wp--preset--color--border-blue);
border-radius: 20px;
box-shadow: 0 16px 40px rgba(12, 36, 89, 0.1);
}
.gp-search__results[hidden] {
display: none;
}
.gp-search__item {
display: flex;
align-items: center;
gap: 11px;
padding: 8px 12px;
border-radius: 100px;
font-size: 14px;
font-weight: 600;
line-height: 20px;
color: var(--gp-text);
text-decoration: none;
}
.gp-search__item .gp-icon {
flex: none;
color: var(--gp-text);
}
.gp-search__item span {
flex: 1;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.gp-search__item mark {
background: none;
color: #0a33ff;
}
.gp-search__item:hover,
.gp-search__item.is-active {
background: var(--wp--preset--color--surface-blue);
}
.gp-search__all {
display: flex;
align-items: center;
gap: 6px;
margin-top: 4px;
padding: 12px 12px 4px;
border-top: 1px solid var(--wp--preset--color--border-blue);
font-size: 14px;
font-weight: 600;
color: var(--gp-brand);
text-decoration: none;
}
.gp-search__all:hover,
.gp-search__all.is-active {
color: var(--wp--preset--color--accent);
text-decoration: underline;
}
.gp-search__note {
margin: 0;
padding: 8px 12px;
font-size: 14px;
line-height: 20px;
color: var(--gp-muted);
} .gp-main {
padding-top: 0;
padding-bottom: var(--gp-section-gap);
}
.gp-main > .gp-featured {
margin-block-start: 0;
}
.gp-main > * + * {
margin-block-start: var(--gp-section-gap);
}
.gp-main > .gp-featured + .gp-grid {
margin-block-start: clamp(48px, 6vw, 80px);
}
.gp-main--single {
padding-top: 0;
} .gp-query .wp-block-post-template {
margin: 0;
padding: 0;
list-style: none;
}
.gp-query .wp-block-post-template > .wp-block-post {
margin-block: 0;
}
.gp-query .wp-block-post {
display: flex;
flex-direction: column;
min-width: 0;
}
.gp-card__img {
margin: 0 !important;
overflow: hidden;
border-radius: var(--gp-radius-card);
background: var(--wp--preset--color--surface-blue);
}
.gp-card__img a {
display: block;
height: 100%;
}
.gp-card__img img {
display: block;
width: 100%;
height: 100% !important;
object-fit: cover;
border-radius: inherit;
transition: transform 0.4s ease;
}
.wp-block-post:hover .gp-card__img img {
transform: scale(1.03);
}
.gp-grid .gp-card__img {
aspect-ratio: 392 / 250;
}
.gp-card__body {
display: flex;
flex-direction: column;
flex: 1;
padding: 0 4px;
margin-top: 16px !important;
}
.gp-card__body > * {
margin: 0 !important;
}
.gp-card__title {
margin-top: 8px !important;
font-weight: 600;
letter-spacing: -0.5px;
color: var(--gp-text);
}
.gp-card__title.has-heading-s-font-size {
line-height: 28px;
}
.gp-card__title.has-heading-m-font-size {
line-height: 32px;
}
.gp-card__title a {
color: inherit;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.gp-card__title a:hover {
color: var(--gp-brand);
} .gp-post-meta {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 4px 12px;
font-size: 12px;
line-height: 16px;
}
.gp-post-meta__cat {
display: inline-flex;
align-items: center;
gap: 6px;
font-weight: 600;
color: var(--wp--preset--color--tag);
}
a.gp-post-meta__cat:hover {
color: var(--gp-brand);
}
.gp-dot {
width: 6px;
height: 6px;
border-radius: 50%;
background: var(--wp--preset--color--tag-dot);
flex: none;
}
.gp-post-meta__date {
display: inline-flex;
align-items: center;
gap: 4px;
color: var(--gp-muted);
} .gp-card-footer {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin-top: auto !important;
padding-top: 12px;
border-top: 1px solid var(--gp-divider);
font-size: 12px;
line-height: 16px;
color: var(--wp--preset--color--text-secondary);
}
.gp-card__title + .gp-card-footer {
margin-top: 16px !important;
}
.gp-card-footer.no-divider {
border-top: 0;
padding-top: 0;
}
.gp-card-footer.is-short {
font-size: 14px;
line-height: 20px;
}
.gp-card-footer__time {
display: inline-flex;
align-items: center;
gap: 4px;
}
.gp-readmore {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 14px;
font-weight: 600;
line-height: 20px;
color: var(--gp-brand);
white-space: nowrap;
}
.gp-readmore .gp-icon {
transition: transform 0.15s ease;
}
.gp-readmore:hover .gp-icon {
transform: translateX(2px);
} .is-style-gp-featured.wp-block-post-template {
display: grid;
grid-template-columns: 757fr 451fr;
gap: 32px;
}
.is-style-gp-featured .gp-card__img {
height: 400px;
}
.is-style-gp-featured .gp-card__title a {
-webkit-line-clamp: 1;
} .gp-grid .wp-block-post-template.is-layout-grid {
gap: 80px 32px;
} .is-style-gp-list.wp-block-post-template {
display: flex;
flex-direction: column;
gap: 40px;
}
.is-style-gp-list .wp-block-post {
display: grid;
grid-template-columns: 273px 1fr;
align-items: center;
gap: 20px;
}
.is-style-gp-list .gp-card__img {
aspect-ratio: 273 / 158;
border-radius: 16px;
}
.is-style-gp-list .gp-card__body {
margin-top: 0 !important;
height: 100%;
justify-content: center;
}
.is-style-gp-list .gp-card__title a {
-webkit-line-clamp: 3;
}
.gp-lead .gp-card__img {
height: 400px;
border-radius: 16px;
} .gp-section__head {
margin-bottom: 40px;
gap: 16px;
}
.gp-section__head .wp-block-button__link {
white-space: nowrap;
}
.gp-section__title {
margin: 0;
line-height: 40px;
letter-spacing: -1px;
}
.gp-section > .gp-section__head + * {
margin-top: 0;
}
.gp-section__split.wp-block-columns {
gap: 64px;
margin: 0;
}
.gp-section__split > .wp-block-column {
min-width: 0;
} .gp-pagination {
margin-top: 64px !important;
gap: 8px;
font-size: 14px;
font-weight: 600;
}
.gp-pagination .page-numbers,
.gp-pagination a {
white-space: nowrap;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 4px;
min-width: 40px;
height: 40px;
padding: 0 12px;
border-radius: 100px;
color: var(--gp-text);
background: var(--wp--preset--color--surface-blue);
border: 1px solid var(--wp--preset--color--border-blue);
}
.gp-pagination .page-numbers.current {
background: var(--gp-brand);
border-color: var(--gp-brand);
color: #fff;
}
.gp-pagination .page-numbers.dots {
background: transparent;
border-color: transparent;
}
.gp-no-results {
text-align: center;
color: var(--gp-muted);
} .gp-cta-wrap > .gp-cta {
margin: 0;
}
.gp-cta {
position: relative;
overflow: hidden;
min-height: 204px;
border-radius: var(--gp-radius-card);
padding: 28px 100px;
display: flex;
align-items: center;
isolation: isolate;
background-image: url(//blog.guardspro.com/wp-content/themes/guardspro-blog/assets/images/cta-decor-left.png);
background-repeat: no-repeat;
background-position: left bottom;
background-size: 100px auto;
}
.gp-cta__text {
position: relative;
z-index: 1;
max-width: 440px;
}
.gp-cta__text > * {
margin: 0;
}
.gp-cta__title.gp-cta__title {
font-size: 24px;
line-height: 32px;
letter-spacing: -0.5px;
font-weight: 600;
margin: 0;
}
.gp-cta__sub {
margin-top: 8px !important;
font-size: 14px;
line-height: 20px;
max-width: 360px;
opacity: 0.95;
}
.gp-cta .gp-trial-form {
margin-top: 16px !important;
}
.gp-cta__art {
position: absolute !important;
top: 0;
right: 0;
bottom: 0;
width: min(688px, 56%);
margin: 0 !important;
z-index: 0;
}
.gp-cta__art img {
width: 100%;
height: 100% !important;
object-fit: cover;
object-position: right center;
} .gp-cta-wrap.is-in-article {
margin-top: 40px;
}
.is-in-article .gp-cta {
padding: 32px 40px;
background-size: 64px auto;
}
.is-in-article .gp-cta__art {
width: 42%;
} .gp-trial-form {
display: flex;
align-items: center;
width: 305px;
max-width: 100%;
padding: 4px 4px 4px 20px;
background: var(--wp--preset--color--surface-blue);
border: 1px solid #28acf6;
border-radius: 100px;
gap: 8px;
}
.gp-trial-form input[type="email"] {
flex: 1;
min-width: 0;
border: 0;
padding: 0;
background: transparent;
font: inherit;
font-size: 14px;
line-height: 20px;
color: var(--gp-text);
outline: none;
}
.gp-trial-form input::placeholder {
color: var(--gp-muted);
}
.gp-trial-form button {
flex: none;
border: 0;
border-radius: 100px;
padding: 9px 24px;
background: var(--gp-brand);
color: #fff;
font: inherit;
font-size: 14px;
font-weight: 600;
line-height: 20px;
cursor: pointer;
}
.gp-trial-form button:hover {
background: var(--wp--preset--color--accent);
} .gp-cta-sm {
position: relative;
overflow: hidden;
border-radius: var(--gp-radius-card);
padding: 30px;
background-image: url(//blog.guardspro.com/wp-content/themes/guardspro-blog/assets/images/cta-sm-decor-left.png), url(//blog.guardspro.com/wp-content/themes/guardspro-blog/assets/images/cta-sm-decor-right.png);
background-repeat: no-repeat, no-repeat;
background-position: left bottom, right top;
background-size: 48px auto, 40px auto;
}
.gp-cta-sm > * {
position: relative;
margin: 0;
}
.gp-cta-sm__title.gp-cta-sm__title {
font-size: 24px;
line-height: 32px;
letter-spacing: -0.5px;
margin: 0;
}
.gp-cta-sm__sub {
margin-top: 8px !important;
font-size: 14px;
line-height: 20px;
}
.gp-cta-sm .wp-block-buttons {
margin-top: 20px !important;
} .gp-single-hero {
padding-top: clamp(24px, 3vw, 48px);
text-align: center;
}
.gp-single-hero > * {
margin-left: auto !important;
margin-right: auto !important;
}
.gp-single-hero__crumbs {
gap: 12px;
justify-content: center;
}
.gp-back-link {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 12px;
line-height: 16px;
font-weight: 500;
color: var(--gp-muted);
}
.gp-back-link:hover {
color: var(--gp-brand);
}
.gp-single-hero__title.gp-single-hero__title {
margin-top: 16px;
max-width: 640px;
line-height: 1.2;
letter-spacing: -1px;
color: var(--gp-text);
}
.gp-single-hero__lead {
margin-top: 16px;
max-width: 614px;
color: var(--gp-muted);
font-size: 16px;
line-height: 24px;
}
.gp-single-hero__lead p {
margin: 0;
}
.gp-single-hero__meta {
margin-top: 16px;
gap: 12px;
justify-content: center;
}
.gp-single-hero__meta .gp-post-meta__date {
color: var(--gp-text);
font-weight: 500;
}
.gp-copy-link {
display: inline-flex;
align-items: center;
gap: 4px;
padding: 5px 10px;
background: #fff;
border: 1px solid #ededed;
border-radius: 16px;
font: inherit;
font-size: 12px;
line-height: 16px;
font-weight: 500;
color: var(--gp-text);
cursor: pointer;
}
.gp-copy-link:hover,
.gp-copy-link.is-copied {
border-color: var(--wp--preset--color--border-blue);
color: var(--gp-brand);
} .gp-single.wp-block-columns {
gap: 48px;
align-items: flex-start !important;
margin: 0;
}
.gp-single__main {
min-width: 0;
flex: 1 1 862px !important;
}
.gp-single__aside {
flex: 0 0 330px !important;
align-self: stretch;
}
.gp-sticky {
position: sticky;
top: 24px;
display: flex;
flex-direction: column;
gap: 24px;
}
.admin-bar .gp-sticky {
top: 56px;
}
.gp-sticky > * {
margin: 0 !important;
} .gp-article {
background: #fff;
border-radius: var(--gp-radius-card);
padding: 24px;
}
.gp-article > * + * {
margin-block-start: 0;
}
.gp-article__img {
margin: 0 0 40px !important;
border-radius: 16px;
overflow: hidden;
}
.gp-article__img img {
display: block;
width: 100%;
height: auto;
}
.gp-article__content {
padding-inline: 0;
color: #252525;
font-size: 16px;
line-height: 24px;
}
.gp-article__content > * {
margin-block: 0;
}
.gp-article__content > * + * {
margin-block-start: 24px;
}
.gp-article__content > :is(h2, h3, h4) + * {
margin-block-start: 16px;
}
.gp-article__content > * + :is(h2, h3) {
margin-block-start: 48px;
}
.gp-article__content :is(h2, h3, h4, h5, h6) {
color: #020d20;
scroll-margin-top: 96px;
}
.gp-article__content h2 {
font-size: 24px;
line-height: 32px;
letter-spacing: -0.5px;
}
.gp-article__content h3 {
font-size: 20px;
line-height: 28px;
}
.gp-article__content a {
text-decoration: underline;
text-underline-offset: 2px;
}
.gp-article__content img {
max-width: 100%;
height: auto;
border-radius: 16px;
}
.gp-article__content :is(figure, .wp-caption) {
max-width: 100%;
margin-inline: 0;
}
.gp-article__content :is(ul, ol) {
padding-left: 1.25em;
}
.gp-article__content li + li {
margin-top: 8px;
}
.gp-article__content table {
width: 100%;
border-collapse: collapse;
font-size: 14px;
line-height: 20px;
}
.gp-article__content :is(th, td) {
border: 1px solid var(--wp--preset--color--border-blue);
padding: 8px 12px;
text-align: left;
vertical-align: top;
} .gp-article__content .wp-block-table {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.gp-article__content .wp-block-table table {
border-collapse: separate;
border-spacing: 0;
min-width: 560px;
border: 1px solid var(--gp-divider);
border-radius: 16px;
overflow: hidden;
}
.gp-article__content .wp-block-table :is(th, td) {
border: 0;
border-bottom: 1px solid var(--gp-divider);
padding: 12px 16px;
}
.gp-article__content .wp-block-table :is(th, td) + :is(th, td) {
border-left: 1px solid var(--gp-divider);
}
.gp-article__content .wp-block-table thead th {
background: #eef2fd;
color: #020d20;
font-weight: 600;
border-bottom-color: rgba(41, 68, 204, 0.2);
}
.gp-article__content .wp-block-table tbody tr:nth-child(even) td {
background: #f8faff;
}
.gp-article__content .wp-block-table tbody tr:last-child td {
border-bottom: 0;
}
.gp-article__content .wp-block-table figcaption {
margin-top: 8px;
font-size: 13px;
color: var(--gp-muted);
text-align: center;
}
.gp-article__content .wp-block-video video {
width: 100%;
height: auto;
border-radius: 16px;
display: block;
}
.gp-article__content :is(.wp-block-image, .wp-block-video) figcaption {
margin-top: 8px;
font-size: 13px;
color: var(--gp-muted);
text-align: center;
}
.gp-article__content iframe {
max-width: 100%;
border-radius: 16px;
} .is-style-gp-tip,
.is-style-gp-tip-blue,
.gp-article__content blockquote:not([class*="is-style-"]) {
position: relative;
margin-inline: 0;
padding: 12px 24px;
border-radius: 24px;
border-left: 3px solid var(--wp--preset--color--notice);
background: var(--wp--preset--color--notice-bg);
color: #994d00;
font-size: 14px;
line-height: 20px;
font-style: normal;
}
.is-style-gp-tip-blue,
.gp-article__content blockquote:not([class*="is-style-"]) {
border-left-color: #3d5dff;
background: #f3f5ff;
color: var(--wp--preset--color--accent);
}
.is-style-gp-tip > :last-child,
.is-style-gp-tip-blue > :last-child,
.gp-article__content blockquote > :last-child {
margin-bottom: 0;
}
.is-style-gp-tip > :first-child,
.is-style-gp-tip-blue > :first-child,
.gp-article__content blockquote > :first-child {
margin-top: 0;
}
.is-style-gp-tip strong,
.is-style-gp-tip-blue strong {
font-weight: inherit;
} .gp-feature-list {
display: flex;
flex-direction: column;
gap: 12px;
}
.gp-feature-list > * {
margin: 0 !important;
}
.is-style-gp-feature {
position: relative;
padding: 16px 16px 16px 60px;
background: #fafbfe;
border: 1.4px solid #eef4ff;
border-radius: 24px;
}
.is-style-gp-feature::before {
content: "";
position: absolute;
left: 20px;
top: 50%;
width: 24px;
height: 24px;
margin-top: -12px;
background: var(--gp-brand);
-webkit-mask: var(--gp-ico-check) center / contain no-repeat;
mask: var(--gp-ico-check) center / contain no-repeat;
}
.is-style-gp-feature > * {
margin: 0 !important;
}
.is-style-gp-feature :is(h3, h4, h5) {
font-size: 16px;
line-height: 24px;
font-weight: 600;
letter-spacing: 0;
color: #0f1724;
}
.is-style-gp-feature p {
margin-top: 4px !important;
font-size: 14px;
line-height: 20px;
color: var(--gp-muted);
} .is-style-gp-card {
background: #fff;
border-radius: var(--gp-radius-card);
padding: 24px;
} .gp-toc {
background: rgba(255, 255, 255, 0.35);
border: 1px solid #d8e5ff;
border-radius: var(--gp-radius-card);
padding: 21px;
max-height: calc(100vh - 48px);
overflow-y: auto;
}
.gp-toc__head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin-bottom: 16px;
}
.gp-toc__title,
.gp-eyebrow,
.is-style-gp-eyebrow.is-style-gp-eyebrow {
display: inline-flex;
align-items: center;
gap: 8px;
margin: 0;
font-size: 14px;
font-weight: 600;
line-height: 20px;
letter-spacing: 1px;
text-transform: uppercase;
color: var(--gp-brand);
}
.gp-toc__title::before,
.gp-eyebrow::before,
.is-style-gp-eyebrow::before {
content: "";
width: 2px;
height: 10px;
border-radius: 2px;
background: currentColor;
flex: none;
}
.gp-toc__progress {
font-size: 12px;
font-weight: 600;
color: var(--gp-text);
font-variant-numeric: tabular-nums;
}
.gp-toc__list {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 4px;
}
.gp-toc__item a {
position: relative;
display: block;
padding: 8px 12px 8px 24px;
border: 1px solid transparent;
border-radius: 100px;
font-size: 14px;
line-height: 20px;
color: #252525;
transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.gp-toc__item a::before {
content: "";
position: absolute;
left: 12px;
top: 16px;
width: 4px;
height: 4px;
border-radius: 50%;
background: #a3acc2;
}
.gp-toc__item.is-h3 a {
padding-left: 36px;
}
.gp-toc__item.is-h3 a::before {
left: 24px;
}
.gp-toc__item a:hover {
color: var(--gp-brand);
}
.gp-toc__item a.is-active {
background: #fff;
border-color: #bfcaff;
color: var(--gp-brand);
font-weight: 600;
}
.gp-toc__item a.is-active::before {
background: currentColor;
} .gp-share .gp-eyebrow {
margin-bottom: 16px;
}
.gp-share__list {
display: flex;
flex-wrap: wrap;
gap: 12px;
list-style: none;
margin: 0;
padding: 0;
}
.gp-share__list a {
display: grid;
place-items: center;
width: 40px;
height: 40px;
border-radius: 11.4px;
background: #fff;
border: 1px solid #e5eaf1;
color: var(--gp-text);
transition: background-color 0.15s ease, color 0.15s ease;
}
.gp-share__list a:hover {
background: var(--gp-brand);
border-color: var(--gp-brand);
color: #fff;
} .gp-footer-wrap {
margin-top: 0;
}
.gp-footer {
padding-top: 60px;
padding-bottom: 24px;
color: var(--wp--preset--color--text-secondary);
}
.gp-footer > * + * {
margin-block-start: 0;
}
.gp-footer__top.wp-block-columns {
display: grid;
grid-template-columns: 248px 1fr;
gap: 40px 102px;
margin: 0;
}
.gp-footer__brand .wp-block-site-logo img {
width: 232px;
height: auto;
}
.gp-footer__about {
margin: 24px 0 0;
font-size: 14px;
line-height: 20px;
}
.gp-footer__sep.wp-block-separator {
margin: 24px 0 !important;
border: 0;
border-top: 1px solid #d0d5dd;
opacity: 1;
width: 100%;
}
.gp-footer .is-style-gp-eyebrow {
letter-spacing: 1px;
}
.gp-footer__brand .is-style-gp-eyebrow + .gp-social {
margin-top: 20px;
}
.gp-footer__grid.wp-block-columns {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 32px;
margin: 0;
}
.gp-footer__col > * {
margin: 0;
}
.gp-footer__col .is-style-gp-dots + .is-style-gp-eyebrow {
margin-top: 40px;
}
.is-style-gp-dots {
list-style: none;
margin: 20px 0 0 !important;
padding: 0;
display: flex;
flex-direction: column;
gap: 8px;
}
.is-style-gp-dots li {
position: relative;
padding-left: 18px;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.3px;
}
.is-style-gp-dots li::before {
content: "";
position: absolute;
left: 2px;
top: 10px;
width: 5px;
height: 5px;
border-radius: 50%;
background: #d0d5dd;
}
.is-style-gp-dots li:hover::before {
background: var(--gp-brand);
}
.is-style-gp-dots a {
color: #4d5874;
}
.is-style-gp-dots a:hover {
color: var(--gp-brand);
} .gp-social.wp-block-social-links {
gap: 12px;
margin: 0;
padding: 0;
}
.gp-social .wp-block-social-link {
background: #fff !important;
color: var(--gp-text) !important;
border: 1px solid #eceff4;
border-radius: 8px !important;
margin: 0 !important;
}
.gp-social .wp-block-social-link a {
width: 40px;
height: 40px;
padding: 0 !important;
display: grid;
place-items: center;
}
.gp-social .wp-block-social-link svg {
width: 18px;
height: 18px;
}
.gp-social .wp-block-social-link:first-child,
.gp-social .wp-block-social-link:hover {
background: var(--gp-brand) !important;
border-color: var(--gp-brand);
color: #fff !important;
}
.gp-social .wp-block-social-link:hover {
transform: none;
} .gp-footer__reviews {
margin-top: 40px !important;
padding-top: 30px;
border-top: 1px solid #e4e7ec;
gap: 16px;
}
.gp-footer__badge {
margin: 0;
padding: 2px 16px;
border-radius: 100px;
background: #e6ebfb;
color: var(--gp-brand);
font-size: 14px;
font-weight: 500;
line-height: 24px;
text-align: center;
}
.gp-footer__review-img {
margin: 0 !important;
max-width: 100%;
}
.gp-footer__review-img img {
display: block;
max-width: 100%;
height: auto;
} .gp-footer__bottom {
margin-top: 24px !important;
padding-top: 24px;
border-top: 1px solid #e4e7ec;
gap: 12px 24px;
font-size: 14px;
line-height: 20px;
}
.gp-footer__bottom p {
margin: 0;
color: var(--wp--preset--color--text-secondary);
}
.gp-legal {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px 16px;
list-style: none;
margin: 0;
padding: 0;
font-weight: 500;
}
.gp-legal li + li::before {
content: "•";
margin-right: 16px;
color: var(--gp-text);
}
.gp-legal a {
color: var(--gp-text);
}
.gp-legal a:hover {
color: var(--gp-brand);
} @media (max-width: 1180px) {
.gp-header__actions .is-style-gp-outline {
display: none;
}
.gp-nav {
--wp--style--block-gap: 20px;
}
.gp-single__aside {
flex-basis: 300px !important;
}
.gp-footer__top.wp-block-columns {
gap: 40px 48px;
}
}
@media (max-width: 1024px) {
.gp-grid .wp-block-post-template.is-layout-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 56px 24px;
}
.is-style-gp-featured .gp-card__img,
.gp-lead .gp-card__img {
height: auto;
aspect-ratio: 16 / 10;
}
.gp-section__split.wp-block-columns {
flex-direction: column;
gap: 40px;
}
.gp-section__split > .wp-block-column {
flex-basis: auto !important;
width: 100%;
}
.gp-single.wp-block-columns {
flex-direction: column;
}
.gp-single__main,
.gp-single__aside {
flex-basis: auto !important;
width: 100%;
}
.gp-sticky {
position: static;
}
.gp-toc {
max-height: none;
}
.gp-footer__top.wp-block-columns {
grid-template-columns: 1fr;
}
.gp-cta {
padding: 32px 40px;
}
}
@media (max-width: 900px) {
.gp-header__actions {
display: none !important;
}
.gp-tabs {
flex-direction: column;
align-items: stretch;
gap: 12px;
}
.gp-tabs.is-js:not(.is-searching) {
flex-direction: row;
align-items: flex-start;
}
.gp-search__item span {
white-space: normal;
}
.gp-tabs__nav {
border-radius: 24px;
}
.is-style-gp-featured.wp-block-post-template {
grid-template-columns: 1fr;
gap: 48px;
}
.is-style-gp-featured .gp-card__title a {
-webkit-line-clamp: 2;
}
.gp-cta {
flex-direction: column;
align-items: stretch;
padding: 32px 24px 0;
background-size: 64px auto;
}
.gp-cta__art {
position: relative !important;
width: auto;
height: 200px;
margin: 24px -24px 0 !important;
}
.is-in-article .gp-cta__art {
width: auto;
}
.gp-footer__grid.wp-block-columns {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 40px 24px;
}
}
@media (max-width: 640px) {
:root {
--gp-radius-card: 20px;
}
.gp-header .wp-block-site-logo img {
width: 168px;
}
.gp-grid .wp-block-post-template.is-layout-grid {
grid-template-columns: 1fr;
gap: 48px;
}
.is-style-gp-list .wp-block-post {
grid-template-columns: 120px 1fr;
gap: 16px;
align-items: start;
}
.is-style-gp-list .gp-card__img {
aspect-ratio: 1;
border-radius: 12px;
}
.is-style-gp-list .gp-card__title {
font-size: 16px !important;
line-height: 22px !important;
}
.gp-section__head {
margin-bottom: 24px;
}
.gp-section__head .wp-block-button__link {
padding: 8px 16px;
font-size: 14px;
}
.gp-article {
padding: 16px;
}
.gp-article__img {
margin-bottom: 24px !important;
}
.gp-trial-form {
width: 100%;
}
.gp-footer__bottom {
flex-direction: column;
align-items: flex-start !important;
}
}
@media (prefers-reduced-motion: reduce) {
* {
transition: none !important;
}
.wp-block-post:hover .gp-card__img img {
transform: none;
}
} .gp-article__content .wp-block-button__link {
text-decoration: none;
}
.gp-article__content .wp-block-details {
border: 1px solid var(--gp-divider);
border-radius: 12px;
padding: 12px 16px;
margin-block: 16px;
}
.gp-article__content .wp-block-details summary {
font-weight: 600;
cursor: pointer;
} .gp-hp {
position: absolute !important;
left: -9999px;
width: 1px;
height: 1px;
overflow: hidden;
}
.gp-subscribe.is-busy .gp-trial-form {
opacity: 0.7;
}
.gp-subscribe.is-done .gp-trial-form {
display: none;
}
.gp-subscribe__msg {
margin: 12px 0 0;
font-size: 14px;
line-height: 20px;
font-weight: 600;
}
.gp-subscribe.is-done .gp-subscribe__msg {
display: flex;
align-items: flex-start;
gap: 8px;
max-width: 400px;
margin-top: 16px;
padding: 12px 16px;
border-radius: 16px;
background: rgba(255, 255, 255, 0.16);
color: #fff;
}
.gp-subscribe.is-done .gp-subscribe__msg::before {
content: "";
flex: none;
width: 20px;
height: 20px;
background: currentColor;
-webkit-mask: var(--gp-ico-check) center / contain no-repeat;
mask: var(--gp-ico-check) center / contain no-repeat;
}
.gp-subscribe.is-error .gp-subscribe__msg {
color: #ffd7cf;
} .gp-subscribe:not(.gp-cta *).is-done .gp-subscribe__msg {
background: var(--wp--preset--color--surface-blue);
color: var(--gp-brand);
}
.gp-subscribe:not(.gp-cta *).is-error .gp-subscribe__msg {
color: var(--wp--preset--color--orange);
} .gp-zoomable {
cursor: zoom-in;
}
.gp-zoom-open,
.gp-zoom-open body {
overflow: hidden;
}
.gp-zoom {
position: fixed;
inset: 0;
z-index: 100000;
display: flex;
align-items: center;
justify-content: center;
background: rgba(12, 36, 89, 0.92);
opacity: 0;
transition: opacity 0.2s ease;
cursor: zoom-out;
}
.gp-zoom.is-open {
opacity: 1;
}
.gp-zoom[hidden],
.gp-subscribe__msg[hidden] {
display: none !important;
}
.gp-zoom__stage {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
padding: clamp(16px, 4vw, 56px) clamp(16px, 4vw, 56px) 96px;
overflow: hidden;
}
.gp-zoom__img {
max-width: 100%;
max-height: 100%;
object-fit: contain;
border-radius: 12px;
box-shadow: 0 30px 80px rgba(0, 0, 0, 0.35);
transform-origin: center;
transition: transform 0.2s ease;
user-select: none;
touch-action: none;
}
.gp-zoom.is-zoomed .gp-zoom__img {
cursor: grab;
}
.gp-zoom.is-zoomed .gp-zoom__img:active {
cursor: grabbing;
transition: none;
}
.gp-zoom__bar {
position: absolute;
left: 50%;
bottom: 24px;
transform: translateX(-50%);
display: flex;
align-items: center;
gap: 4px;
padding: 6px;
border-radius: 100px;
background: #fff;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
cursor: default;
}
.gp-zoom__btn,
.gp-zoom__pct {
border: 0;
background: transparent;
color: var(--gp-text);
font: inherit;
font-weight: 600;
cursor: pointer;
border-radius: 100px;
}
.gp-zoom__btn {
width: 40px;
height: 40px;
font-size: 22px;
line-height: 1;
}
.gp-zoom__pct {
min-width: 64px;
height: 40px;
font-size: 14px;
}
.gp-zoom__btn:hover,
.gp-zoom__pct:hover {
background: var(--wp--preset--color--surface-blue);
color: var(--gp-brand);
}
.gp-zoom__close {
margin-left: 4px;
border-left: 1px solid var(--wp--preset--color--border-blue);
border-radius: 0 100px 100px 0;
}
@media (prefers-reduced-motion: reduce) {
.gp-zoom,
.gp-zoom__img {
transition: none;
}
} .gp-cta.gp-cta--post {
background-image: url(//blog.guardspro.com/wp-content/themes/guardspro-blog/assets/images/cta-decor-left.png);
}
.gp-cta--post .gp-cta__title.gp-cta__title {
font-size: 26px;
}
.gp-cta--post .wp-block-buttons {
margin-top: 20px !important;
gap: 12px;
}
.gp-cta--post .is-style-gp-outline-light .wp-block-button__link {
background: transparent;
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.7);
}
.gp-cta--post .is-style-gp-outline-light .wp-block-button__link:hover {
background: rgba(255, 255, 255, 0.12);
} .gp-cta.gp-cta-banner {
min-height: var(--gp-cta-h, 204px);
}
.gp-cta-banner .gp-cta__text {
max-width: var(--gp-cta-text-w, 440px);
}
.gp-cta-banner .gp-cta__text > :first-child {
margin-top: 0 !important;
}
.gp-cta-banner .gp-cta__art,
.is-in-article .gp-cta-banner .gp-cta__art {
width: var(--gp-cta-img-w, 56%);
}
.gp-cta-banner .gp-cta__art img {
display: block;
width: 100% !important;
height: 100% !important;
max-width: none;
object-fit: var(--gp-cta-fit, cover);
object-position: var(--gp-cta-pos, 100% 50%);
}
.is-in-article .gp-cta-banner {
padding: 30px 40px;
}
@media (max-width: 900px) {
.gp-cta-banner .gp-cta__art,
.is-in-article .gp-cta-banner .gp-cta__art {
width: auto;
height: var(--gp-cta-img-h-m, 200px);
}
.is-in-article .gp-cta-banner {
padding: 32px 24px 0;
}
.gp-cta-banner.no-mobile-image {
padding-bottom: 32px;
}
.gp-cta-banner.no-mobile-image .gp-cta__art {
display: none;
}
} .gp-search-count {
margin: 12px 0 0;
font-size: 16px;
line-height: 24px;
color: var(--gp-muted);
}
.gp-search-count strong {
color: var(--gp-text);
}
.gp-search-empty {
max-width: 640px;
margin: 24px auto 0;
padding: 48px 32px;
text-align: center;
background: #fff;
border: 1px solid var(--wp--preset--color--border-blue);
border-radius: var(--gp-radius-card);
}
.gp-search-empty__icon {
display: inline-grid;
place-items: center;
width: 64px;
height: 64px;
border-radius: 50%;
background: var(--wp--preset--color--surface-blue);
color: var(--gp-brand);
}
.gp-search-empty__title {
margin: 20px 0 8px;
font-size: 24px;
line-height: 32px;
letter-spacing: -0.5px;
}
.gp-search-empty__text {
margin: 0;
font-size: 15px;
line-height: 24px;
color: var(--gp-muted);
}
.gp-search-empty__chips {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 8px;
margin-top: 20px;
}
.gp-search-empty__chip {
padding: 8px 16px;
border: 1px solid var(--wp--preset--color--border-blue);
border-radius: 100px;
background: var(--wp--preset--color--surface-blue);
font-size: 14px;
font-weight: 600;
color: var(--gp-text);
text-decoration: none;
}
.gp-search-empty__chip:hover {
border-color: var(--gp-brand);
color: var(--gp-brand);
}
.gp-search-empty__btn {
display: inline-flex;
margin-top: 28px;
padding: 12px 24px;
border-radius: 100px;
background: var(--gp-brand);
color: #fff;
font-size: 14px;
font-weight: 600;
text-decoration: none;
}
.gp-search-empty__btn:hover {
background: var(--wp--preset--color--accent);
color: #fff;
}