@import url("https://fonts.googleapis.com/css2?family=Google+Sans:ital,opsz,wght@0,17..18,400..700;1,17..18,400..700&display=swap");
:root {
--light-blue: #80e3ff; --dark-blue: #00b4e6; }
::selection {
background-color: #fce4ec;
}
html {
scroll-behavior: smooth;
}
body {
font-family: "Google Sans", sans-serif;
}
.container-fluid {
max-width: 1890px;
}
a {
color: #008cb3; }
a {
text-underline-offset: 0.25em;
}
a.dark-link,
.dark-links a {
color: rgba(0, 0, 0, 1);
}
a.dark-link:hover,
.dark-links a:hover {
color: rgba(0, 0, 0, .65);
}
h1,
h2,
h3,
h4,
h5,
h6 {
line-height: 1.15;
}
.fw-200 {
font-weight: 200;
}
.fw-300 {
font-weight: 300;
}
.fw-400 {
font-weight: 400;
}
.fw-500 {
font-weight: 500;
}
.fw-600 {
font-weight: 600;
}
.fw-700 {
font-weight: 700;
}
.fw-800 {
font-weight: 800;
}
.fw-900 {
font-weight: 900;
}
.navbar {
font-weight: 500;
}
.navbar-brand img {
margin-top: -5px;
}
.navbar-toggler {
border: none
}
.navbar-toggler-icon {
font-size: .75em;
font-weight: bold;
}
.navbar-toggler-icon {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.85%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='3' d='M4 7h22M4 15h12M4 23h22'/%3e%3c/svg%3e") !important;
}
.nav-link {
color: rgba(0, 0, 0, 1);
}
.nav-link:hover {
color: rgba(0, 180, 230, 1);
}
.wp-block-image.alignfull {
margin-left: 50%;
margin-right: 50%;
transform: translateX(-50%);
width: 100vw;    
max-width: 98vw;
padding: 0;
}
.wp-block-image.alignfull img {
width: 100%;
height: auto;
display: block;
}
.entry-content p {
margin-bottom: 1.5rem;
line-height: 1.7;
}
.entry-content img {
max-width: 100%;
height: auto;
border-radius: 1rem;
margin: 1.5rem 0;
}
.btn-primary.rounded-pill {
background-color: var(--dark-blue);
border: none;
transition: all 0.3s ease;
}
.transition-hover:hover {
transform: translateY(-2px);
box-shadow: 0 10px 20px rgba(0, 123, 255, 0.2) !important;
background-color: #008cb3;
}
.home-button {
font-size: 1em;
font-weight: 600;
padding: .7em 1.5em .8em;
}
.service-button {
font-size: 1em;
font-weight: 600;
padding: .7em 1.5em .8em;
background-color: #f5f5f5;
border: none;
transition: background-color 0.3s ease;
animation: light-up 12s infinite;
}
.service-types {
font-size: 1em;
font-weight: 600;
padding: .7em 1.5em .8em;
background-color: #f5f5f5;
border: none;    
}
@keyframes light-up {
0%,
25% {
background-color: var(--light-blue)
}
26%,
100% {
background-color: #f5f5f5;
}
}
.service-button:nth-child(1) {
animation-delay: 0s;
}
.service-button:nth-child(2) {
animation-delay: 3s;
}
.service-button:nth-child(3) {
animation-delay: 6s;
}
.service-button:nth-child(4) {
animation-delay: 9s;
}
.btn:disabled {
background-color: #f5f5f5;
border: none;
color: #000000 !important;
}
.gradient-title {
color: #b86bff;
background-image: linear-gradient(240deg, #fbb8d8 0%, #d349f4 22.02%, #7983f3 51.32%, #2a9dd2 81.46%, #00b4e6 99.8%);
background-size: 100%;
background-clip: text;
-webkit-background-clip: text;
-moz-background-clip: text;
-webkit-text-fill-color: transparent;
-moz-text-fill-color: transparent;
}
.about-numbers {
line-height: 1.15;
}
a.link-to-blog {
border: 2px solid black;
padding: .5rem 1rem;
text-decoration: none;
border-radius: 99px;
color: black;
}
a.link-to-blog:hover {
border: 2px solid #1677FF;
text-decoration: none;
}
.br-25 {
border-radius: 25px;
}
.br-50 {
border-radius: 99%;
}
.entry-content h2 {
font-weight: 700;
margin-top: 3rem;
margin-bottom: 1.5rem;
}
.entry-content p {
margin-bottom: 1.5rem;
color: #333;
}
.entry-content img {
border-radius: 1rem;
margin: 2rem 0; }
.shadow-hover {
transition: all 0.3s ease;
}
.shadow-hover:hover {
transform: translateY(-5px);
box-shadow: 0 1rem 3rem rgba(0, 0, 0, .1) !important;
}
.entry-tags a {
display: inline-block;
padding: 0.25rem 0.75rem;
background: #f8f9fa;
color: #6c757d;
text-decoration: none;
border-radius: 50px;
font-size: 0.875rem;
margin-bottom: 0.5rem;
}
.entry-tags a:hover {
background: #e9ecef;
color: #000;
}
.shadow-hover:hover {
transform: translateY(-5px);
box-shadow: 0 1rem 3rem rgba(0, 0, 0, .08) !important;
}
.pagination .nav-links {
display: flex;
gap: 10px;
justify-content: center;
}
.pagination .page-numbers {
padding: 8px 16px;
background: #fff;
border-radius: 50px;
text-decoration: none;
color: #333;
font-weight: 500;
border: 1px solid #eee;
}
.pagination .page-numbers.current {
background: #007bff;
color: #fff;
border-color: #007bff;
} pre {
padding: 1.3em;
margin: 1em 0 2em;
word-break: break-all;
overflow: auto;
background-color: #f7f7f7;
border-radius: 5px;
color: #333;
white-space: pre;
font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
line-height: 1.35;
}
.wp-block-code code {
white-space: pre;
overflow-wrap: break-word;
font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
}
p code {
padding: 2px 4px;
color: #c7254e;
background-color: #f9f2f4;
border-radius: 4px;
font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
}
.entry-meta a {
color: #000000;
text-decoration: none;
}
.entry-meta a:hover {
color: rgba(0, 0, 0, 0.65);
text-decoration: none;
}
.btn-order { background: linear-gradient(135deg, var(--dark-blue) 0%, #0056b3 100%);
color: #ffffff !important;
border: none;    
font-size: 1em;    
box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3) !important;
}
.btn-order.transition-all:hover {
transform: translateY(-3px);
box-shadow: 0 8px 25px rgba(0, 123, 255, 0.4) !important;
filter: brightness(1.1); }
.btn-order:active {
transform: translateY(-1px);
}
.fade-in {
opacity: 0;
transform: translateY(20px);
animation: css-animation-fadeInUp 0.6s ease-out forwards;
}
@keyframes css-animation-fadeInUp {
to {
opacity: 1;
transform: translateY(0);
}
} .articles-grid {
display: flex;
flex-direction: column;
gap: 10px; } @media (min-width: 992px) { .text-xxl {
font-size: 4.5em;
}
.text-xl {
font-size: 3em;
}
.description {
font-size: 1.5em;
}
.front-description {
font-size: 1.5em;
}
.home-button {
font-size: 1.5em;
}
.service-button {
font-size: 1.5em;
}
.service-types {
font-size: 1.5em;
}
pre {
font-size: .85em;
}
}
@media (min-width: 768px) {
.articles-grid {
display: grid;
grid-template-columns: repeat(2, 1fr); }
}