@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/plus-jakarta-sans/pjs-latin-ext-400.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/plus-jakarta-sans/pjs-latin-400.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/plus-jakarta-sans/pjs-latin-ext-500.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/plus-jakarta-sans/pjs-latin-500.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/plus-jakarta-sans/pjs-latin-ext-600.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/plus-jakarta-sans/pjs-latin-600.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/plus-jakarta-sans/pjs-latin-ext-700.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/plus-jakarta-sans/pjs-latin-700.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 800;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/plus-jakarta-sans/pjs-latin-ext-800.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 800;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/plus-jakarta-sans/pjs-latin-800.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/inter/inter-latin-ext-400.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/inter/inter-latin-400.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/inter/inter-latin-ext-500.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/inter/inter-latin-500.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/inter/inter-latin-ext-600.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/inter/inter-latin-600.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/inter/inter-latin-ext-700.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(//svgegitim.com/wp-content/themes/svgegitim/assets/fonts/inter/inter-latin-700.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
} :root {
--navy: #0a2a4e;
--navy-deep: #061c36;
--navy-mid: #123a66;
--accent: #ff6b2c;
--accent-dark: #e85618;
--accent-soft: rgba(255, 107, 44, .1);
--cyan: #00a8c8;
--cyan-soft: rgba(0, 168, 200, .1);
--gold: #ffb020;
--gold-soft: rgba(255, 176, 32, .13);
--ink: #12233a;
--body: #5d6b7d;
--bg-soft: #f5f8fb;
--line: #e3e9f0;
--navy-a94: rgba(6, 28, 54, .94);
--navy-a80: rgba(6, 28, 54, .8);
--navy-a45: rgba(6, 28, 54, .45);
--navy-a00: rgba(6, 28, 54, 0);
--shadow-sm: 0 2px 8px rgba(10, 42, 78, .06);
--shadow-md: 0 12px 32px -12px rgba(10, 42, 78, .18);
--shadow-lg: 0 28px 60px -24px rgba(10, 42, 78, .28);
--shadow-accent: 0 16px 34px -14px rgba(255, 107, 44, .55);
--r-sm: 8px;
--r-md: 14px;
--r-lg: 20px;
--r-xl: 28px;
--head: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
--text: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
--fs-base: 16px;
--fs-h1: 58px;
--fs-h2: 44px;
} *,
*::before,
*::after {
box-sizing: border-box;
}
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote,
dl,
dd,
ul,
ol {
margin: 0;
padding: 0;
}
html {
scroll-behavior: smooth;
-webkit-text-size-adjust: 100%;
}
body {
font-family: var(--text);
font-size: var(--fs-base);
line-height: 1.7;
color: var(--body);
background: #fff;
-webkit-font-smoothing: antialiased;
overflow-x: hidden;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: var(--head);
color: var(--ink);
line-height: 1.2;
font-weight: 800;
letter-spacing: -.02em;
}
a {
color: var(--accent);
text-decoration: none;
transition: color .2s;
}
a:hover {
color: var(--accent-dark);
}
img,
svg,
video {
max-width: 100%;
height: auto;
display: block;
}
ul,
ol {
list-style: none;
}
button {
font-family: inherit;
cursor: pointer;
border: none;
background: none;
color: inherit;
}
input,
select,
textarea {
font-family: inherit;
font-size: inherit;
}
:focus-visible {
outline: 3px solid var(--accent);
outline-offset: 2px;
border-radius: 4px;
}
.screen-reader-text {
position: absolute !important;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
white-space: nowrap;
}
.skip-link {
position: absolute;
left: -9999px;
z-index: 9999;
}
.skip-link:focus {
left: 16px;
top: 16px;
background: #fff;
padding: 12px 20px;
border-radius: var(--r-sm);
box-shadow: var(--shadow-lg);
} .wrap {
max-width: 1240px;
margin: 0 auto;
padding: 0 24px;
}
.section {
padding: 104px 0;
}
.section.tight {
padding: 76px 0;
}
.section.soft {
background: var(--bg-soft);
}
.sec-foot {
text-align: center;
margin-top: 48px;
}
.narrow {
max-width: 820px;
margin-left: auto;
margin-right: auto;
}
.svgi {
width: 1em;
height: 1em;
stroke: currentColor;
fill: none;
stroke-width: 1.8;
stroke-linecap: round;
stroke-linejoin: round;
flex: none;
}
.svge-noimg {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
background: linear-gradient(135deg, var(--bg-soft), var(--line));
color: var(--navy);
font-size: 38px;
opacity: .5;
min-height: 120px;
} .eyebrow {
display: inline-flex;
align-items: center;
gap: 10px;
font-family: var(--head);
font-weight: 700;
font-size: 13px;
letter-spacing: .14em;
text-transform: uppercase;
color: var(--accent);
margin-bottom: 16px;
}
.eyebrow::before {
content: "";
width: 28px;
height: 2px;
background: currentColor;
border-radius: 2px;
}
.eyebrow.center {
justify-content: center;
}
.eyebrow.center::after {
content: "";
width: 28px;
height: 2px;
background: currentColor;
border-radius: 2px;
}
.eyebrow.on-dark {
color: var(--gold);
}
.sec-title {
font-size: clamp(28px, 3.4vw, var(--fs-h2));
margin-bottom: 16px;
}
.sec-title-sm {
font-size: clamp(23px, 2.4vw, 32px);
}
.sec-title.on-dark {
color: #fff;
}
.sec-lead {
font-size: 16.5px;
max-width: 640px;
}
.sec-lead.on-dark {
color: #a9bdd4;
}
.head-center {
text-align: center;
margin: 0 auto 56px;
max-width: 720px;
}
.head-center .sec-lead {
margin: 0 auto;
}
.head-center.head-tight {
margin-bottom: 40px;
}
.btn {
display: inline-flex;
align-items: center;
gap: 10px;
font-family: var(--head);
font-weight: 700;
font-size: 15px;
padding: 16px 30px;
border-radius: var(--r-sm);
transition: .25s cubic-bezier(.4, 0, .2, 1);
border: 2px solid transparent;
text-align: center;
}
.btn .svgi {
font-size: 17px;
}
.btn-accent {
background: var(--accent);
color: #fff;
box-shadow: var(--shadow-accent);
}
.btn-accent:hover {
background: var(--accent-dark);
color: #fff;
transform: translateY(-3px);
}
.btn-navy {
background: var(--navy);
color: #fff;
}
.btn-navy:hover {
background: var(--navy-deep);
color: #fff;
transform: translateY(-3px);
}
.btn-outline {
border-color: rgba(255, 255, 255, .7);
color: #fff;
}
.btn-outline:hover {
background: rgba(255, 255, 255, 0.18);
color: #fff;
border-color: #fff;
transform: translateY(-3px);
}
.btn-line {
border-color: var(--line);
color: var(--ink);
background: #fff;
}
.btn-line:hover {
border-color: var(--accent);
color: var(--accent);
}
.dots {
position: absolute;
width: 120px;
height: 120px;
opacity: .5;
pointer-events: none;
z-index: 0;
background-image: radial-gradient(var(--accent) 1.6px, transparent 1.6px);
background-size: 14px 14px;
}
.blob {
position: absolute;
border-radius: 50%;
pointer-events: none;
} .topbar {
background: var(--navy-deep);
color: #a9bdd4;
font-size: 13.5px;
}
.topbar .wrap {
display: flex;
justify-content: space-between;
align-items: center;
min-height: 46px;
gap: 24px;
flex-wrap: wrap;
}
.topbar a {
color: inherit;
}
.topbar a:hover {
color: var(--gold);
}
.tb-left {
display: flex;
gap: 28px;
align-items: center;
flex-wrap: wrap;
}
.tb-left span {
display: inline-flex;
align-items: center;
gap: 8px;
}
.tb-left .svgi {
font-size: 15px;
color: var(--gold);
}
.tb-right {
display: flex;
align-items: center;
gap: 18px;
}
.tb-social {
display: flex;
gap: 14px;
}
.tb-social a {
font-size: 15px;
display: inline-flex;
}
.tb-divider {
width: 1px;
height: 18px;
background: rgba(255, 255, 255, .16);
}
.tb-lang {
display: inline-flex;
align-items: center;
gap: 6px;
font-weight: 600;
color: #fff;
}
.tb-menu {
display: flex;
gap: 18px;
} .site-header {
position: fixed;
top: 0;
left: 0;
right: 0;
width: 100%;
background: transparent;
padding: 16px 20px;
transition: padding .3s ease;
z-index: 1000;
pointer-events: none;
}
.svge-sticky .site-header {
position: fixed;
top: 0;
}
.site-header.stuck {
padding: 16px 20px;
}
.hd {
max-width: 1240px;
margin: 0 auto;
background: rgba(255, 255, 255, 0.82);
backdrop-filter: blur(18px);
-webkit-backdrop-filter: blur(18px);
border-radius: 999px;
min-height: 74px;
padding: 0 28px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
box-shadow: 0 14px 38px -10px rgba(10, 42, 78, 0.16);
border: 1px solid rgba(255, 255, 255, 0.55);
transition: box-shadow .3s ease, background .3s ease, border-color .3s ease;
pointer-events: auto;
}
.site-header.stuck .hd {
min-height: 74px;
background: rgba(255, 255, 255, 0.94);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
box-shadow: 0 18px 45px -10px rgba(10, 42, 78, 0.22);
border-color: rgba(10, 42, 78, 0.08);
}
.brand {
display: flex;
align-items: center;
gap: 12px;
flex: none;
color: inherit;
}
.brand-logo img {
max-height: 50px;
width: auto;
}
.brand-mark {
width: 42px;
height: 42px;
border-radius: 12px;
flex: none;
background: linear-gradient(135deg, var(--navy), var(--navy-mid));
display: grid;
place-items: center;
color: #fff;
box-shadow: 0 8px 18px -8px rgba(10, 42, 78, .6);
}
.brand-mark .svgi {
font-size: 22px;
}
.brand-txt b {
display: block;
font-family: var(--head);
font-weight: 800;
font-size: 20px;
color: var(--navy);
letter-spacing: -.03em;
line-height: 1.1;
}
.brand-txt b i {
font-style: normal;
color: var(--accent);
}
.brand-txt small {
font-size: 10px;
letter-spacing: .16em;
text-transform: uppercase;
color: var(--body);
font-weight: 600;
}
.mainnav>ul {
display: flex;
align-items: center;
gap: 2px;
}
.mainnav>ul>li {
position: relative;
}
.mainnav a {
display: inline-flex;
align-items: center;
gap: 5px;
font-family: var(--head);
font-weight: 600;
font-size: 14.5px;
color: var(--ink);
padding: 8px 14px;
border-radius: 999px;
transition: all .2s ease;
}
.mainnav a .svgi {
font-size: 13px;
opacity: .55;
transition: transform .25s;
}
.mainnav>ul>li:hover>a,
.mainnav .current-menu-item>a {
color: var(--accent);
}
body.home .mainnav .current-menu-item>a,
body.front-page .mainnav .current-menu-item>a {
color: var(--ink);
}
body.home .mainnav .current-menu-item:hover>a,
body.front-page .mainnav .current-menu-item:hover>a {
color: var(--accent);
}
.mainnav>ul>li:hover>a .svgi {
transform: rotate(180deg);
}
.submenu {
position: absolute;
top: calc(100% + 14px);
left: 0;
min-width: 250px;
background: #fff;
border-radius: var(--r-md);
box-shadow: var(--shadow-lg);
padding: 10px;
opacity: 0;
visibility: hidden;
transform: translateY(10px);
transition: .25s;
border-top: 3px solid var(--accent);
z-index: 20;
}
.mainnav li:hover>.submenu {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
.submenu li {
position: relative;
}
.submenu a {
display: flex;
align-items: center;
width: 100%;
padding: 10px 14px;
border-radius: var(--r-sm);
font-size: 14px;
font-weight: 500;
color: var(--body);
font-family: var(--text);
}
.submenu a:hover {
background: var(--accent-soft);
color: var(--accent);
}
.submenu .submenu {
top: -10px;
left: 100%;
}
.nav-flag {
margin-right: 10px;
font-size: 1.2em;
line-height: 1;
flex: none;
}
.hd-right {
display: flex;
align-items: center;
gap: 12px;
flex: none;
}
.icon-btn {
width: 40px;
height: 40px;
border-radius: 50%;
border: 1px solid var(--line);
background: var(--bg-soft);
display: grid;
place-items: center;
color: var(--ink);
font-size: 17px;
transition: all .2s ease;
flex: none;
}
.icon-btn:hover {
border-color: var(--accent);
color: var(--accent);
background: #fff;
}
.hd-cta {
border-radius: 999px;
padding: 11px 24px;
font-size: 14px;
font-weight: 700;
box-shadow: 0 4px 14px rgba(255, 107, 44, 0.3);
transition: all .2s ease;
}
.hd-cta:hover {
transform: translateY(-2px);
box-shadow: 0 6px 18px rgba(255, 107, 44, 0.45);
}
.burger {
display: none;
}
.hd-search {
background: transparent;
border: none;
box-shadow: none;
margin-top: 12px;
padding: 0;
pointer-events: auto;
}
.hd-search .wrap {
max-width: 680px;
margin: 0 auto;
padding: 0 16px;
}
.hd-search .svge-searchform {
background: #fff;
border-radius: 50px;
border: 1px solid rgba(11, 26, 45, 0.12);
box-shadow: 0 14px 36px rgba(11, 26, 45, 0.18);
padding: 5px 6px 5px 22px;
display: flex;
align-items: center;
gap: 8px;
}
.hd-search .svge-searchform input {
border: none;
background: transparent;
padding: 10px 0;
font-size: 15px;
box-shadow: none;
}
.hd-search .svge-searchform input:focus {
border: none;
outline: none;
}
.hd-search .svge-searchform button {
border-radius: 50px;
height: 42px;
width: 44px;
min-width: 44px;
padding: 0;
display: grid;
place-items: center;
} .mobile-nav {
position: fixed;
inset: 0 0 0 auto;
width: min(360px, 88vw);
background: #fff;
z-index: 200;
display: flex;
flex-direction: column;
box-shadow: -20px 0 60px -20px rgba(0, 0, 0, .35);
transform: translateX(100%);
transition: transform .3s;
}
.mobile-nav.open {
transform: translateX(0);
}
.mobile-nav[hidden] {
display: flex;
}
.mobile-nav-head {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20px;
border-bottom: 1px solid var(--line);
}
.mobile-nav-body {
flex: 1;
overflow-y: auto;
padding: 12px 20px;
}
.mobile-nav-body ul {
display: block;
}
.mobile-nav-body a {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
padding: 14px 4px;
font-family: var(--head);
font-weight: 600;
font-size: 16px;
color: var(--ink);
border-bottom: 1px solid var(--line);
}
.mobile-nav-body .submenu {
position: static;
opacity: 1;
visibility: visible;
transform: none;
box-shadow: none;
border: none;
border-left: 2px solid var(--line);
border-radius: 0;
margin: 0 0 8px 10px;
padding: 0 0 0 10px;
display: none;
}
.mobile-nav-body li.open>.submenu {
display: block;
}
.mobile-nav-body .submenu a {
font-size: 14.5px;
font-weight: 500;
padding: 10px 4px;
justify-content: flex-start !important;
gap: 10px !important;
text-align: left;
}
.mobile-nav-body .nav-flag {
font-size: 20px;
line-height: 1;
display: inline-flex;
align-items: center;
flex: none;
margin-right: 2px;
}
.mobile-nav-foot {
padding: 20px;
border-top: 1px solid var(--line);
display: grid;
gap: 16px;
}
.mobile-nav-foot .btn {
justify-content: center;
}
.mobile-nav-foot .ft-social a {
background: var(--bg-soft);
border-color: var(--line);
color: var(--navy);
}
.svge-overlay {
position: fixed;
inset: 0;
background: rgba(6, 28, 54, .55);
z-index: 150;
opacity: 0;
transition: opacity .3s;
}
.svge-overlay.show {
opacity: 1;
}
body.nav-open {
overflow: hidden;
} .hero {
position: relative;
background: var(--navy-deep);
overflow: hidden;
}
.hero-bg {
position: absolute;
inset: 0;
}
.hero-bg img {
width: 100%;
height: 100%;
object-fit: cover;
}
.hero-bg-plain {
background: linear-gradient(140deg, var(--navy), var(--navy-deep));
}
.hero-bg::after {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(100deg, var(--navy-a94) 0%, var(--navy-a80) 42%, var(--navy-a45) 100%);
}
.hero-inner {
position: relative;
z-index: 2;
padding: 160px 0 180px;
}
.hero-grid {
display: grid;
grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
gap: 56px;
align-items: center;
}
.hero.no-form .hero-grid {
grid-template-columns: 1fr;
max-width: 820px;
text-align: center;
}
.hero.no-form .hero-actions,
.hero.no-form .hero-trust {
justify-content: center;
}
.hero.no-form p {
margin-left: auto;
margin-right: auto;
}
.hero-badge {
display: inline-flex;
align-items: center;
gap: 10px;
background: rgba(255, 255, 255, .1);
border: 1px solid rgba(255, 255, 255, .2);
padding: 9px 18px 9px 10px;
border-radius: 999px;
color: #fff;
font-size: 13.5px;
font-weight: 600;
font-family: var(--head);
margin-bottom: 26px;
backdrop-filter: blur(6px);
}
.hero-badge em {
font-style: normal;
background: var(--accent);
padding: 4px 11px;
border-radius: 999px;
font-size: 11.5px;
letter-spacing: .06em;
text-transform: uppercase;
font-weight: 800;
}
.hero h1 {
font-size: clamp(32px, 4.6vw, var(--fs-h1));
color: #fff;
line-height: 1.1;
letter-spacing: -.03em;
}
.hero h1 mark {
background: none;
color: var(--gold);
position: relative;
}
.hero p {
margin-top: 24px;
color: #bcd0e6;
font-size: 18px;
max-width: 520px;
}
.hero-actions {
margin-top: 38px;
display: flex;
gap: 16px;
flex-wrap: wrap;
align-items: center;
}
.play-link {
display: inline-flex;
align-items: center;
gap: 14px;
color: #fff;
font-family: var(--head);
font-weight: 700;
font-size: 15px;
}
.play-link:hover {
color: #fff;
}
.play-btn {
width: 56px;
height: 56px;
border-radius: 50%;
background: rgba(255, 255, 255, .14);
border: 1px solid rgba(255, 255, 255, .3);
display: grid;
place-items: center;
font-size: 17px;
transition: .25s;
position: relative;
color: #fff;
}
.play-link:hover .play-btn {
background: #fff;
color: var(--navy);
}
.play-btn::before {
content: "";
position: absolute;
inset: -8px;
border-radius: 50%;
border: 1px solid rgba(255, 255, 255, .25);
animation: svge-pulse 2.4s ease-out infinite;
}
@keyframes svge-pulse {
0% {
transform: scale(.9);
opacity: .9;
}
100% {
transform: scale(1.3);
opacity: 0;
}
}
.hero-trust {
margin-top: 46px;
padding-top: 30px;
border-top: 1px solid rgba(255, 255, 255, .14);
display: flex;
align-items: center;
gap: 22px;
flex-wrap: wrap;
}
.faces {
display: flex;
}
.faces img {
width: 48px;
height: 48px;
border-radius: 50%;
object-fit: cover;
border: 3px solid var(--navy-deep);
margin-left: -14px;
}
.faces img:first-child {
margin-left: 0;
}
.t-txt b {
color: #fff;
font-family: var(--head);
font-size: 15px;
display: block;
}
.t-txt span {
color: #9fb6d0;
font-size: 13.5px;
}
.stars {
color: var(--gold);
font-size: 14px;
display: flex;
gap: 2px;
} .hero-banner {
--hero-h: 100vh;
min-height: 100vh;
min-height: 100dvh;
height: 100vh;
height: 100dvh;
position: relative;
}
.hero-banner.h-small {
--hero-h: 560px;
min-height: 560px;
height: auto;
}
.hero-banner.h-medium {
--hero-h: 700px;
min-height: 700px;
height: auto;
}
.hero-banner.h-large {
--hero-h: 100vh;
min-height: 100vh;
min-height: 100dvh;
height: 100vh;
height: 100dvh;
}
.hero-banner.h-full {
--hero-h: 100vh;
min-height: 100vh;
min-height: 100dvh;
height: 100vh;
height: 100dvh;
}
.hero-slides {
display: grid;
height: 100%;
}
.hero-slide {
grid-area: 1/1;
position: relative;
opacity: 0;
visibility: hidden;
transition: opacity .9s ease;
height: 100%;
}
.hero-slide.is-active {
opacity: 1;
visibility: visible;
z-index: 2;
}
.hero-banner .hero-inner {
position: relative;
z-index: 2;
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
min-height: 100dvh;
padding: 120px 0 80px;
width: 100%;
}
.hero-banner .hero-bg img {
transition: transform 9s linear;
}
.hero-slide.is-active .hero-bg img {
transform: scale(1.09);
} .hero-video,
.hero-embed {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
border: 0;
}
.hero-video {
object-fit: cover;
}
.hero-embed iframe {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100vw;
height: 56.25vw;
min-height: 100%;
min-width: 177.77vh;
border: 0;
pointer-events: none;
} .hero-bg.has-video img {
transform: none !important;
transition: none;
}
.hero-bg.has-video .hero-video,
.hero-bg.has-video .hero-embed {
z-index: 1;
}
.hero-bg.has-video::after {
z-index: 2;
} .svge-lightbox {
position: fixed;
inset: 0;
z-index: 9999;
background: rgba(6, 28, 54, .92);
display: grid;
place-items: center;
padding: 24px;
opacity: 0;
transition: opacity .28s;
}
.svge-lightbox.show {
opacity: 1;
}
.svge-lightbox-inner {
width: min(1040px, 100%);
aspect-ratio: 16/9;
position: relative;
}
.svge-lightbox iframe,
.svge-lightbox video {
width: 100%;
height: 100%;
border: 0;
border-radius: var(--r-md);
background: #000;
box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .8);
}
.svge-lightbox-close {
position: absolute;
top: -52px;
right: 0;
width: 44px;
height: 44px;
border-radius: 50%;
background: rgba(255, 255, 255, .14);
border: 1px solid rgba(255, 255, 255, .3);
color: #fff;
display: grid;
place-items: center;
font-size: 20px;
transition: .2s;
}
.svge-lightbox-close:hover {
background: #fff;
color: var(--navy);
}
@media(max-width:700px) {
.svge-lightbox-close {
top: -48px;
}
}
.hero-banner .hero-copy {
max-width: 880px;
}
.hero-banner.align-center .hero-copy {
margin: 0 auto;
text-align: center;
}
.hero-banner.align-center .hero-actions {
justify-content: center;
}
.hero-banner.align-center .hero-copy p {
margin-left: auto;
margin-right: auto;
}
.hero-kicker {
display: inline-flex;
align-items: center;
gap: 14px;
color: var(--gold);
font-family: var(--head);
font-weight: 700;
font-size: 13.5px;
letter-spacing: .18em;
text-transform: uppercase;
margin-bottom: 20px;
backface-visibility: hidden;
-webkit-font-smoothing: antialiased;
transform: translateZ(0);
}
.hero-kicker::before,
.align-center .hero-kicker::after {
content: "";
width: 34px;
height: 2px;
background: var(--accent);
border-radius: 2px;
transform: scaleX(0);
transition: transform .6s cubic-bezier(.22, 1, .36, 1) .2s;
flex: none;
}
.hero-kicker::before {
transform-origin: right center;
}
.align-center .hero-kicker::after {
transform-origin: left center;
}
.hero-slide.is-active .hero-kicker::before,
.hero-slide.is-active .hero-kicker::after {
transform: scaleX(1);
}
.hero-banner h1,
.hero-banner .hero-h {
font-size: clamp(32px, 4.8vw, var(--fs-h1));
color: #fff;
line-height: 1.18;
letter-spacing: -.03em;
font-family: var(--head);
font-weight: 800;
backface-visibility: hidden;
-webkit-font-smoothing: antialiased;
transform: translateZ(0);
}
.hero-banner .hero-h mark,
.hero-banner h1 mark,
.hero-split .hero-copy h1 mark {
background: linear-gradient(
90deg,
#e85d04 0%,
#f48c06 20%,
#ffc300 42%,
#fff275 58%,
#e85d04 78%,
#fca311 100%
);
background-size: 300% 100%;
background-position: 100% 0;
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
color: #f48c06;
position: relative;
display: inline-block;
padding: 0.05em 4px 0.22em 4px;
margin-bottom: -0.22em;
vertical-align: baseline;
transform: translateZ(0);
}
.hero-slide.is-active mark,
.hero-split.is-in mark {
animation: svge-mark-color-sweep 2.2s cubic-bezier(.25, 1, .35, 1) .85s 1 forwards;
}
@keyframes svge-mark-color-sweep {
0% {
background-position: 100% 0;
}
100% {
background-position: 0% 0;
}
}
.hero-banner .hero-copy p {
margin-top: 24px;
color: #c3d5e8;
font-size: 18px;
max-width: 620px;
backface-visibility: hidden;
-webkit-font-smoothing: antialiased;
} .hero-slide .hero-copy > * {
opacity: 0;
transform: translateY(28px) translateZ(0);
backface-visibility: hidden;
}
.hero-slide.is-active .hero-copy > * {
opacity: 1;
transform: translateY(0) translateZ(0);
transition: opacity .8s cubic-bezier(.22, 1, .36, 1), transform .8s cubic-bezier(.22, 1, .36, 1);
}
.hero-slide.is-active .hero-copy > *:nth-child(1) {
transition-delay: .15s;
}
.hero-slide.is-active .hero-copy > *:nth-child(2) {
transition-delay: .30s;
}
.hero-slide.is-active .hero-copy > *:nth-child(3) {
transition-delay: .48s;
}
.hero-slide.is-active .hero-copy > *:nth-child(4) {
transition-delay: .65s;
} .hero-arrow {
position: absolute;
top: calc(50% - 40px);
z-index: 6;
width: 54px;
height: 54px;
border-radius: 50%;
background: rgba(255, 255, 255, .12);
border: 1px solid rgba(255, 255, 255, .28);
color: #fff;
display: grid;
place-items: center;
font-size: 20px;
backdrop-filter: blur(6px);
transition: .25s;
}
.hero-prev {
left: 26px;
}
.hero-next {
right: 26px;
}
.hero-prev .svgi {
transform: rotate(90deg);
}
.hero-next .svgi {
transform: rotate(-90deg);
}
.hero-arrow:hover {
background: #fff;
color: var(--navy);
border-color: #fff;
} .hero-foot {
position: absolute;
left: 0;
right: 0;
bottom: 78px;
z-index: 5;
padding-bottom: 0;
pointer-events: none;
} .hero-scroll-down {
position: absolute;
bottom: 22px;
left: 50%;
transform: translateX(-50%);
z-index: 10;
display: flex;
align-items: center;
justify-content: center;
color: rgba(255, 255, 255, 0.75);
text-decoration: none;
cursor: pointer;
padding: 6px;
transition: color .25s ease, opacity .25s ease;
animation: heroChevBounce 2.2s infinite ease-in-out;
}
.hero-scroll-down:hover {
color: #ffffff;
}
.hero-scroll-down svg,
.hero-scroll-down .svgi {
width: 32px;
height: 32px;
stroke: currentColor;
fill: none;
stroke-width: 2.2;
display: block;
}
@keyframes heroChevBounce {
0%, 20%, 50%, 80%, 100% {
transform: translate(-50%, 0);
}
40% {
transform: translate(-50%, 8px);
}
60% {
transform: translate(-50%, 4px);
}
}
.hero-foot-inner {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
flex-wrap: wrap;
} .hero-banner.align-center .hero-foot-inner {
justify-content: center;
flex-direction: column-reverse;
gap: 18px;
}
.hero-dots {
display: flex;
gap: 10px;
pointer-events: auto;
}
.hero-dot {
width: 10px;
height: 10px;
border-radius: 50%;
background: rgba(255, 255, 255, .35);
transition: .25s;
padding: 0;
}
.hero-dot:hover {
background: rgba(255, 255, 255, .6);
}
.hero-dot.on {
background: var(--accent);
width: 32px;
border-radius: 6px;
}
.hero-trustbar {
display: flex;
align-items: center;
gap: 18px;
pointer-events: auto;
}
.hero-trustbar .faces img {
width: 42px;
height: 42px;
margin-left: -12px;
}
.hero-trustbar .t-txt b {
font-size: 14px;
}
.hero-trustbar .t-txt span {
font-size: 12.5px;
}
.hero-card {
background: rgba(255, 255, 255, .07);
border: 1px solid rgba(255, 255, 255, .16);
border-radius: var(--r-xl);
padding: 34px;
backdrop-filter: blur(14px);
box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .6);
}
.hero-card-title {
color: #fff;
font-size: 19px;
margin-bottom: 6px;
}
.hero-card-sub {
color: #9fb6d0;
font-size: 14px;
margin-bottom: 24px;
}
.hc-field {
margin-bottom: 14px;
}
.hc-field label {
display: block;
font-size: 12.5px;
font-weight: 700;
color: #9fb6d0;
margin-bottom: 7px;
font-family: var(--head);
letter-spacing: .04em;
text-transform: uppercase;
}
.hc-input {
width: 100%;
background: rgba(255, 255, 255, .09);
border: 1px solid rgba(255, 255, 255, .18);
border-radius: var(--r-sm);
padding: 14px 16px;
color: #fff;
font-size: 14.5px;
appearance: none;
}
.hc-input::placeholder {
color: #7f95ae;
}
.hc-input:focus {
outline: none;
border-color: var(--accent);
background: rgba(255, 255, 255, .13);
}
select.hc-input option {
background: var(--navy-deep);
color: #fff;
}
.hero-card .btn {
width: 100%;
justify-content: center;
margin-top: 8px;
}
.hc-note {
margin-top: 14px;
font-size: 12.5px;
color: #7f95ae;
display: flex;
align-items: center;
gap: 7px;
justify-content: center;
}
.hero-form-plugin input:not([type=submit]),
.hero-form-plugin select,
.hero-form-plugin textarea {
width: 100%;
background: rgba(255, 255, 255, .09);
border: 1px solid rgba(255, 255, 255, .18);
border-radius: var(--r-sm);
padding: 14px 16px;
color: #fff;
}
.hero-form-plugin label {
color: #9fb6d0;
font-size: 13px;
}
.hero-form-plugin input[type=submit] {
background: var(--accent);
color: #fff;
border: none;
padding: 15px 28px;
border-radius: var(--r-sm);
font-weight: 700;
width: 100%;
}
.hero-wave {
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
z-index: 1;
display: block;
height: auto;
} .quick {
margin-top: 0 !important;
padding: 80px 0 40px !important;
position: relative;
z-index: 5;
background: var(--bg, #f8fafc);
}
.quick-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
}
.q-card {
background: #fff;
border-radius: var(--r-lg);
padding: 34px 30px;
box-shadow: var(--shadow-md);
border-bottom: 4px solid transparent;
transition: .3s;
position: relative;
overflow: hidden;
}
.q-card:hover {
transform: translateY(-8px);
box-shadow: var(--shadow-lg);
border-bottom-color: var(--accent);
}
.q-ic {
width: 60px;
height: 60px;
border-radius: 16px;
display: grid;
place-items: center;
font-size: 27px;
margin-bottom: 20px;
}
.q-card:nth-child(3n+1) .q-ic {
background: var(--accent-soft);
color: var(--accent);
}
.q-card:nth-child(3n+2) .q-ic {
background: var(--cyan-soft);
color: var(--cyan);
}
.q-card:nth-child(3n+3) .q-ic {
background: var(--gold-soft);
color: #d99000;
}
.q-card h3 {
font-size: 20px;
margin-bottom: 9px;
}
.q-card p {
font-size: 14.5px;
margin-bottom: 18px;
}
.q-more {
display: inline-flex;
align-items: center;
gap: 8px;
font-family: var(--head);
font-weight: 700;
font-size: 14px;
color: var(--navy);
transition: .25s;
}
.q-card:hover .q-more {
color: var(--accent);
gap: 12px;
}
.q-num {
position: absolute;
right: 22px;
top: 14px;
font-family: var(--head);
font-weight: 800;
font-size: 64px;
color: var(--bg-soft);
line-height: 1;
}
.counters {
padding: 84px 0;
}
.counter-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
}
.cnt {
text-align: center;
padding: 34px 20px;
border-radius: var(--r-lg);
border: 1px solid var(--line);
background: #fff;
transition: .3s;
}
.cnt:hover {
border-color: transparent;
box-shadow: var(--shadow-md);
transform: translateY(-5px);
}
.cnt .ci {
width: 56px;
height: 56px;
margin: 0 auto 16px;
border-radius: 16px;
display: grid;
place-items: center;
background: var(--navy);
color: var(--gold);
font-size: 25px;
}
.cnt b {
display: block;
font-family: var(--head);
font-weight: 800;
font-size: 42px;
color: var(--navy);
line-height: 1;
letter-spacing: -.03em;
}
.cnt span {
font-size: 14px;
font-weight: 600;
color: var(--body);
margin-top: 8px;
display: block;
} .about-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 70px;
align-items: center;
}
.about-media {
position: relative;
padding-bottom: 60px;
padding-right: 50px;
}
.am-main {
border-radius: var(--r-xl);
overflow: hidden;
box-shadow: var(--shadow-lg);
}
.am-main img,
.am-main .svge-noimg {
width: 100%;
height: 470px;
object-fit: cover;
}
.am-sub {
position: absolute;
right: 0;
bottom: 0;
width: 56%;
border-radius: var(--r-lg);
overflow: hidden;
border: 8px solid #fff;
box-shadow: var(--shadow-lg);
}
.am-sub img {
width: 100%;
height: 210px;
object-fit: cover;
}
.am-badge {
position: absolute;
left: -24px;
top: 44px;
background: var(--accent);
color: #fff;
border-radius: var(--r-lg);
padding: 22px 26px;
box-shadow: var(--shadow-accent);
text-align: center;
z-index: 3;
}
.am-badge b {
display: block;
font-family: var(--head);
font-weight: 800;
font-size: 38px;
line-height: 1;
}
.am-badge span {
font-size: 12.5px;
font-weight: 600;
letter-spacing: .05em;
}
.about-media .dots {
left: -30px;
bottom: 36px;
}
.check-list {
margin: 26px 0 32px;
display: grid;
gap: 14px;
}
.check-list li {
display: flex;
align-items: flex-start;
gap: 13px;
font-size: 15.5px;
color: var(--ink);
font-weight: 500;
}
.check-list .ck {
width: 24px;
height: 24px;
border-radius: 50%;
background: var(--accent-soft);
color: var(--accent);
display: grid;
place-items: center;
font-size: 13px;
flex: none;
margin-top: 3px;
}
.about-foot {
display: flex;
align-items: center;
gap: 28px;
flex-wrap: wrap;
padding-top: 28px;
border-top: 1px solid var(--line);
margin-top: 32px;
}
.signer {
display: flex;
align-items: center;
gap: 14px;
}
.signer img {
width: 56px;
height: 56px;
border-radius: 50%;
object-fit: cover;
}
.signer b {
display: block;
font-family: var(--head);
color: var(--ink);
font-size: 15.5px;
}
.signer span {
font-size: 13.5px;
}
.about-phone {
display: flex;
align-items: center;
gap: 13px;
}
.about-phone .ap-ic {
width: 50px;
height: 50px;
border-radius: 50%;
background: var(--navy);
color: #fff;
display: grid;
place-items: center;
font-size: 20px;
flex: none;
}
.about-phone small {
display: block;
font-size: 12.5px;
text-transform: uppercase;
letter-spacing: .08em;
font-weight: 600;
}
.about-phone b {
font-family: var(--head);
font-size: 17px;
}
.about-phone b a {
color: var(--ink);
} .ctry-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 26px;
}
.ctry {
position: relative;
border-radius: var(--r-lg);
overflow: hidden;
box-shadow: var(--shadow-sm);
transition: .35s;
background: var(--navy);
display: block;
}
.ctry:hover {
transform: translateY(-8px);
box-shadow: var(--shadow-lg);
}
.ctry-img {
height: 280px;
overflow: hidden;
}
.ctry-img img,
.ctry-img .svge-noimg {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform .6s;
}
.ctry:hover .ctry-img img {
transform: scale(1.09);
}
.ctry-ov {
position: absolute;
inset: 0;
background: linear-gradient(to top, var(--navy-a94) 8%, var(--navy-a45) 45%, var(--navy-a00) 75%);
}
.ctry-body {
position: absolute;
left: 0;
right: 0;
bottom: 0;
padding: 26px;
color: #fff;
}
.ctry-flag {
width: 44px;
height: 44px;
border-radius: 12px;
background: rgba(255, 255, 255, .16);
border: 1px solid rgba(255, 255, 255, .28);
display: grid;
place-items: center;
font-size: 22px;
margin-bottom: 14px;
backdrop-filter: blur(6px);
}
.ctry-body h3 {
color: #fff;
font-size: 21px;
margin-bottom: 5px;
}
.ctry-meta {
display: flex;
gap: 18px;
font-size: 13px;
color: #b8cbe0;
font-weight: 500;
flex-wrap: wrap;
}
.ctry-meta span {
display: inline-flex;
align-items: center;
gap: 6px;
}
.ctry-go {
position: absolute;
right: 22px;
top: 22px;
width: 44px;
height: 44px;
border-radius: 50%;
background: #fff;
color: var(--navy);
display: grid;
place-items: center;
font-size: 17px;
opacity: 0;
transform: translateY(-10px) rotate(-30deg);
transition: .35s;
}
.ctry:hover .ctry-go {
opacity: 1;
transform: none;
} .srv-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 26px;
}
.srv {
background: #fff;
border: 1px solid var(--line);
border-radius: var(--r-lg);
padding: 38px 32px;
transition: .35s;
position: relative;
overflow: hidden;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}
.srv::after {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 4px;
background: var(--accent);
transform: scaleX(0);
transform-origin: center;
transition: transform .35s;
}
.srv:hover {
box-shadow: var(--shadow-lg);
border-color: transparent;
transform: translateY(-6px);
}
.srv:hover::after {
transform: scaleX(1);
}
.srv-ic {
width: 66px;
height: 66px;
border-radius: 18px;
display: grid;
place-items: center;
font-size: 29px;
background: var(--navy);
color: #fff;
margin: 0 auto 24px;
transition: .35s;
}
.srv:hover .srv-ic {
background: var(--accent);
transform: rotate(-8deg) scale(1.06);
}
.srv h3 {
font-size: 20px;
margin-bottom: 11px;
text-align: center;
}
.srv h3 a {
color: inherit;
}
.srv:hover h3 a {
color: var(--accent);
}
.srv p {
font-size: 14.5px;
margin-bottom: 18px;
text-align: center;
}
.srv-more {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
font-family: var(--head);
font-weight: 700;
font-size: 14px;
color: var(--navy);
transition: .25s;
margin-top: auto;
margin-left: auto;
margin-right: auto;
}
.srv:hover .srv-more {
color: var(--accent);
gap: 12px;
} .why {
background: var(--navy);
position: relative;
overflow: hidden;
color: #a9bdd4;
}
.why .blob {
width: 520px;
height: 520px;
background: radial-gradient(circle, var(--accent-soft), transparent 66%);
right: -140px;
top: -160px;
}
.why .dots {
left: 44%;
bottom: 44px;
opacity: .22;
background-image: radial-gradient(#fff 1.6px, transparent 1.6px);
}
.why-grid {
display: grid;
grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
gap: 64px;
align-items: center;
position: relative;
z-index: 2;
}
.why-media {
position: relative;
border-radius: var(--r-xl);
overflow: hidden;
box-shadow: var(--shadow-lg);
}
.why-media img,
.why-media .svge-noimg {
width: 100%;
height: 500px;
object-fit: cover;
}
.vplay {
position: absolute;
inset: 0;
display: grid;
place-items: center;
background: linear-gradient(to top, var(--navy-a45), rgba(6, 28, 54, .12));
}
.vplay .play-btn {
width: 84px;
height: 84px;
background: #fff;
color: var(--accent);
font-size: 26px;
border: none;
}
.why-list {
display: grid;
gap: 24px;
margin-top: 34px;
}
.why-item {
display: flex;
gap: 20px;
align-items: flex-start;
}
.why-item .wi {
width: 60px;
height: 60px;
border-radius: 18px;
flex: none;
display: grid;
place-items: center;
font-size: 26px;
background: rgba(255, 255, 255, .08);
border: 1px solid rgba(255, 255, 255, .15);
color: var(--gold);
}
.why-item h4 {
color: #fff;
font-size: 18.5px;
margin-bottom: 6px;
}
.why-item p {
font-size: 14.5px;
color: #a9bdd4;
} .proc-grid {
display: grid;
grid-template-columns: repeat(var(--proc-cols, 4), 1fr);
gap: 22px;
position: relative;
}
.proc-grid::before {
content: "";
position: absolute;
top: 44px;
left: 10%;
right: 10%;
height: 2px;
background: repeating-linear-gradient(90deg, var(--line) 0 10px, transparent 10px 20px);
}
.proc {
text-align: center;
position: relative;
z-index: 2;
padding-top: 8px;
}
.proc-ic {
width: 88px;
height: 88px;
margin: 0 auto 22px;
border-radius: 26px;
background: #fff;
border: 2px solid var(--line);
display: grid;
place-items: center;
font-size: 34px;
color: var(--navy);
position: relative;
transition: .35s;
}
.proc:hover .proc-ic {
background: var(--navy);
color: #fff;
border-color: var(--navy);
transform: translateY(-6px);
}
.proc-ic i {
position: absolute;
right: -8px;
top: -8px;
width: 32px;
height: 32px;
border-radius: 50%;
background: var(--accent);
color: #fff;
font-style: normal;
font-family: var(--head);
font-weight: 800;
font-size: 14px;
display: flex;
align-items: center;
justify-content: center;
line-height: 1;
box-shadow: var(--shadow-accent);
z-index: 3;
}
.proc h4 {
font-size: 19px;
margin-bottom: 9px;
}
.proc p {
font-size: 14.5px;
} .team-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 26px;
}
.tm {
background: #fff;
border-radius: var(--r-lg);
overflow: hidden;
box-shadow: var(--shadow-sm);
transition: .35s;
border: 1px solid var(--line);
display: flex;
flex-direction: column;
}
.tm:hover {
box-shadow: var(--shadow-lg);
transform: translateY(-8px);
border-color: transparent;
}
.tm-photo {
position: relative;
height: 290px;
overflow: hidden;
background: var(--bg-soft);
}
.tm-photo img,
.tm-photo .svge-noimg {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform .5s;
}
.tm:hover .tm-photo img {
transform: scale(1.06);
}
.tm-social {
position: absolute;
left: 0;
right: 0;
bottom: 14px;
display: flex;
justify-content: center;
gap: 9px;
opacity: 0;
transform: translateY(14px);
transition: .35s;
}
.tm:hover .tm-social {
opacity: 1;
transform: none;
}
.tm-social a {
width: 38px;
height: 38px;
border-radius: 50%;
background: #fff;
color: var(--navy);
display: grid;
place-items: center;
font-size: 15px;
box-shadow: var(--shadow-md);
transition: .2s;
}
.tm-social a:hover {
background: var(--accent);
color: #fff;
}
.tm-body {
padding: 22px;
text-align: center;
flex: 1;
display: flex;
flex-direction: column;
}
.tm-body h4 {
font-size: 18px;
margin-bottom: 4px;
}
.tm-body>span {
font-size: 13.5px;
color: var(--accent);
font-weight: 600;
}
.tm-body p {
font-size: 13px;
margin-top: auto;
padding-top: 12px;
border-top: 1px solid var(--line);
} .tst-viewport {
overflow: hidden;
}
.tst-track {
display: flex;
gap: 26px;
transition: transform .45s cubic-bezier(.4, 0, .2, 1);
}
.tst {
background: #fff;
border-radius: var(--r-lg);
padding: 32px 30px;
border: 1px solid var(--line);
position: relative;
transition: box-shadow .3s, transform .3s;
display: flex;
flex-direction: column;
flex: 0 0 calc((100% - 52px)/3);
}
.tst:hover {
box-shadow: var(--shadow-lg);
border-color: transparent;
}
.tst-quote {
position: absolute;
right: 28px;
top: 24px;
font-size: 56px;
color: var(--bg-soft);
font-family: Georgia, serif;
line-height: 1;
}
.tst .stars {
margin-bottom: 16px;
font-size: 15px;
}
.tst-text {
font-size: 15px;
color: var(--ink);
margin-bottom: 20px;
line-height: 1.65;
min-height: 120px;
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.tst-text p {
margin-bottom: 0;
}
.tst-user {
display: flex;
align-items: center;
gap: 14px;
padding-top: 18px;
border-top: 1px solid var(--line);
margin-top: auto;
min-height: 64px;
}
.tst-user img {
width: 46px;
height: 46px;
border-radius: 50%;
object-fit: cover;
flex: none;
}
.tst-initial {
width: 46px;
height: 46px;
border-radius: 50%;
background: var(--navy);
color: #fff;
display: grid;
place-items: center;
font-family: var(--head);
font-weight: 800;
font-size: 18px;
flex: none;
}
.tst-user div {
display: flex;
flex-direction: column;
justify-content: center;
min-width: 0;
}
.tst-user b {
display: block;
font-family: var(--head);
font-size: 15.5px;
font-weight: 700;
color: var(--navy);
line-height: 1.25;
margin-bottom: 2px;
}
.tst-user span {
font-size: 13px;
color: var(--accent);
font-weight: 600;
line-height: 1.25;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.tst-nav {
display: flex;
justify-content: center;
gap: 10px;
margin-top: 40px;
}
.tst-dot {
width: 9px;
height: 9px;
border-radius: 50%;
background: var(--line);
transition: .25s;
padding: 0;
}
.tst-dot.on {
background: var(--accent);
width: 30px;
border-radius: 6px;
} .evt-list {
display: grid;
gap: 18px;
}
.evt {
display: grid;
grid-template-columns: 104px minmax(0, 1fr) auto;
gap: 26px;
align-items: center;
background: #fff;
border: 1px solid var(--line);
border-radius: var(--r-lg);
padding: 22px 26px;
transition: .3s;
}
.evt:hover {
box-shadow: var(--shadow-md);
border-color: transparent;
transform: translateX(6px);
}
.evt-date {
background: var(--navy);
color: #fff;
border-radius: var(--r-md);
text-align: center;
padding: 16px 8px;
transition: background .3s;
}
.evt:hover .evt-date {
background: var(--accent);
}
.evt-date b {
display: block;
font-family: var(--head);
font-weight: 800;
font-size: 30px;
line-height: 1;
}
.evt-date span {
font-size: 12.5px;
text-transform: uppercase;
letter-spacing: .09em;
font-weight: 600;
}
.evt-date-empty {
display: grid;
place-items: center;
font-size: 26px;
}
.evt-body h4 {
font-size: 19px;
margin-bottom: 9px;
}
.evt-meta {
display: flex;
gap: 22px;
flex-wrap: wrap;
font-size: 13.5px;
font-weight: 500;
}
.evt-meta span {
display: inline-flex;
align-items: center;
gap: 7px;
}
.evt-meta .svgi {
color: var(--accent);
font-size: 15px;
}
.evt .btn {
white-space: nowrap;
padding: 13px 24px;
font-size: 14px;
} .partners-sec {
scroll-margin-top: 100px;
}
.logos {
display: grid;
grid-template-columns: repeat(6, 1fr);
gap: 18px;
}
.lg {
height: 96px;
border: 1px solid var(--line);
border-radius: var(--r-md);
display: grid;
place-items: center;
background: #fff;
font-family: var(--head);
font-weight: 800;
font-size: 14px;
color: #9aa8b8;
text-align: center;
padding: 14px;
transition: .3s;
line-height: 1.3;
}
.lg img {
max-height: 56px;
width: auto;
object-fit: contain;
filter: grayscale(1);
opacity: .7;
transition: .3s;
}
.lg:hover {
color: var(--navy);
border-color: var(--navy);
transform: translateY(-4px);
box-shadow: var(--shadow-sm);
}
.lg:hover img {
filter: none;
opacity: 1;
} .blog-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 26px;
}
.pst {
background: #fff;
border-radius: var(--r-lg);
overflow: hidden;
border: 1px solid var(--line);
transition: .35s;
display: flex;
flex-direction: column;
}
.pst:hover {
box-shadow: var(--shadow-lg);
transform: translateY(-8px);
border-color: transparent;
}
.pst-img {
height: 224px;
overflow: hidden;
position: relative;
}
.pst-img img,
.pst-img .svge-noimg {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform .6s;
}
.pst:hover .pst-img img {
transform: scale(1.08);
}
.pst-cat {
position: absolute;
left: 18px;
top: 18px;
background: var(--accent);
color: #fff;
font-family: var(--head);
font-weight: 700;
font-size: 12px;
padding: 7px 14px;
border-radius: 6px;
letter-spacing: .04em;
text-transform: uppercase;
}
.pst-cat:hover {
color: #fff;
background: var(--accent-dark);
}
.pst-body {
padding: 26px;
flex: 1;
display: flex;
flex-direction: column;
}
.pst-meta {
display: flex;
gap: 18px;
font-size: 13px;
margin-bottom: 13px;
font-weight: 500;
flex-wrap: wrap;
}
.pst-meta span {
display: inline-flex;
align-items: center;
gap: 7px;
}
.pst-meta .svgi {
color: var(--accent);
font-size: 14px;
}
.pst h4,
.pst-title {
font-size: 19px;
line-height: 1.35;
margin-bottom: 12px;
}
.pst h4 a,
.pst-title a {
color: var(--ink);
}
.pst:hover h4 a,
.pst:hover .pst-title a {
color: var(--accent);
}
.pst p {
font-size: 14.5px;
margin-bottom: 18px;
}
.pst-more {
display: inline-flex;
align-items: center;
gap: 8px;
font-family: var(--head);
font-weight: 700;
font-size: 14px;
color: var(--navy);
transition: .25s;
margin-top: auto;
}
.pst:hover .pst-more {
color: var(--accent);
gap: 12px;
}
.blog-list {
display: grid;
gap: 26px;
}
.pst-row {
display: grid;
grid-template-columns: 340px minmax(0, 1fr);
gap: 30px;
background: #fff;
border: 1px solid var(--line);
border-radius: var(--r-lg);
overflow: hidden;
transition: .3s;
}
.pst-row:hover {
box-shadow: var(--shadow-lg);
border-color: transparent;
}
.pst-row-img {
position: relative;
min-height: 230px;
}
.pst-row-img img,
.pst-row-img .svge-noimg {
width: 100%;
height: 100%;
object-fit: cover;
}
.pst-row-body {
padding: 30px 30px 30px 0;
display: flex;
flex-direction: column;
justify-content: center;
} .page-hero {
background: linear-gradient(140deg, var(--navy), var(--navy-deep));
color: #bcd0e6;
padding: 160px 0 80px;
position: relative;
overflow: hidden;
min-height: 280px;
display: flex;
align-items: center;
}
.page-hero.has-bg {
padding: 165px 0 85px;
min-height: 300px;
}
.page-hero-bg {
position: absolute;
inset: 0;
z-index: 1;
pointer-events: none;
}
.page-hero-bg img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center 30%;
}
.page-hero-bg::after {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(90deg, rgba(6, 28, 54, 0.94) 0%, rgba(6, 28, 54, 0.80) 50%, rgba(6, 28, 54, 0.94) 100%);
}
.page-hero .wrap {
position: relative;
z-index: 2;
width: 100%;
}
.page-hero h1 {
color: #fff;
font-size: clamp(28px, 3.6vw, 44px);
margin-bottom: 12px;
}
.page-hero p {
max-width: 680px;
font-size: 16.5px;
}
.hero-title-with-ic {
display: inline-flex;
align-items: center;
gap: 16px;
flex-wrap: wrap;
}
.hero-title-ic {
display: inline-flex;
align-items: center;
justify-content: center;
width: 52px;
height: 52px;
border-radius: 16px;
background: rgba(255, 255, 255, 0.12);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.22);
color: var(--accent);
flex-shrink: 0;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
vertical-align: middle;
}
.hero-title-ic .svgi {
width: 28px;
height: 28px;
}
.crumbs {
display: flex;
align-items: center;
gap: 10px;
font-size: 13.5px;
margin-bottom: 18px;
color: #8fa8c4;
flex-wrap: wrap;
}
.crumbs a {
color: #bcd0e6;
}
.crumbs a:hover {
color: var(--gold);
}
.crumbs .svgi {
font-size: 13px;
opacity: .6;
}
.single-hero {
background: linear-gradient(140deg, var(--navy), var(--navy-deep));
color: #bcd0e6;
padding: 150px 0 65px;
}
.single-hero h1 {
color: #fff;
font-size: clamp(28px, 3.8vw, 46px);
max-width: 900px;
}
.single-meta {
display: flex;
gap: 26px;
margin-top: 22px;
font-size: 14px;
flex-wrap: wrap;
}
.single-meta span {
display: inline-flex;
align-items: center;
gap: 8px;
}
.single-meta .svgi {
color: var(--gold);
font-size: 15px;
}
.single-thumb {
margin-top: 40px;
position: relative;
z-index: 1;
}
.single-thumb img {
border-radius: var(--r-lg);
box-shadow: 0 16px 40px rgba(11, 26, 45, 0.08);
width: 100%;
max-height: 520px;
object-fit: cover;
display: block;
}
.single-body {
padding-top: 40px;
}
.country-hero {
position: relative;
overflow: hidden;
}
.title-flag {
display: inline-block;
margin-right: 12px;
vertical-align: middle;
font-size: 0.92em;
filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.3));
}
.inline-flag {
display: inline-block;
margin-right: 8px;
vertical-align: middle;
font-size: 1.15em;
}
.country-facts {
background: var(--bg-soft);
padding: 34px 0;
border-bottom: 1px solid var(--line);
}
.facts-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 22px;
}
.fact {
display: flex;
align-items: center;
gap: 14px;
}
.fact-ic {
width: 48px;
height: 48px;
border-radius: 14px;
background: #fff;
border: 1px solid var(--line);
display: grid;
place-items: center;
color: var(--accent);
font-size: 21px;
flex: none;
}
.fact small {
display: block;
font-size: 12.5px;
text-transform: uppercase;
letter-spacing: .06em;
font-weight: 600;
}
.fact b {
font-family: var(--head);
color: var(--ink);
font-size: 16px;
} .content-grid {
display: grid;
gap: 44px;
}
.content-grid.has-sidebar {
grid-template-columns: minmax(0, 1fr) 330px;
}
.content-grid.sidebar-left {
grid-template-columns: 330px minmax(0, 1fr);
}
.content-grid.sidebar-left .content-main {
order: 2;
}
.content-grid.sidebar-left .content-side {
order: 1;
}
.content-grid.no-sidebar {
grid-template-columns: 1fr;
}
.widget {
background: #fff;
border: 1px solid var(--line);
border-radius: var(--r-lg);
padding: 26px;
margin-bottom: 24px;
}
.widget-title {
font-size: 17px;
margin-bottom: 18px;
padding-bottom: 14px;
border-bottom: 2px solid var(--line);
position: relative;
}
.widget-title::after {
content: "";
position: absolute;
left: 0;
bottom: -2px;
width: 44px;
height: 2px;
background: var(--accent);
}
.widget ul li {
padding: 9px 0;
border-bottom: 1px solid var(--line);
font-size: 14.5px;
}
.widget ul li:last-child {
border-bottom: none;
}
.widget ul li a {
color: var(--body);
}
.widget ul li a:hover {
color: var(--accent);
} .entry-content {
font-size: 16.5px;
line-height: 1.85;
color: var(--body);
}
.entry-content>*+* {
margin-top: 22px;
}
.entry-content h2 {
font-size: 29px;
margin-top: 44px;
}
.entry-content h3 {
font-size: 23px;
margin-top: 36px;
}
.entry-content h4 {
font-size: 19px;
margin-top: 30px;
}
.entry-content p {
margin-bottom: 0;
}
.entry-content ul,
.entry-content ol {
padding-left: 24px;
}
.entry-content ul li {
list-style: disc;
margin-bottom: 10px;
}
.entry-content ol li {
list-style: decimal;
margin-bottom: 10px;
}
.entry-content img {
border-radius: var(--r-md);
}
.entry-content blockquote {
border-left: 4px solid var(--accent);
background: var(--bg-soft);
padding: 24px 28px;
border-radius: 0 var(--r-md) var(--r-md) 0;
font-size: 18px;
color: var(--ink);
font-style: italic;
}
.entry-content code {
background: var(--bg-soft);
padding: 3px 7px;
border-radius: 5px;
font-size: 14px;
}
.entry-content pre {
background: var(--navy-deep);
color: #e6edf5;
padding: 22px;
border-radius: var(--r-md);
overflow-x: auto;
}
.entry-content pre code {
background: none;
color: inherit;
}
.entry-content table {
width: 100%;
border-collapse: collapse;
}
.entry-content th,
.entry-content td {
border: 1px solid var(--line);
padding: 12px 14px;
text-align: left;
}
.entry-content th {
background: var(--bg-soft);
font-family: var(--head);
color: var(--ink);
}
.entry-content a {
text-decoration: underline;
text-underline-offset: 3px;
}
.page-thumb {
margin-bottom: 34px;
}
.page-thumb img {
border-radius: var(--r-lg);
width: 100%;
}
.entry-tags {
margin-top: 40px;
padding-top: 24px;
border-top: 1px solid var(--line);
display: flex;
gap: 10px;
align-items: center;
flex-wrap: wrap;
}
.entry-tags span {
font-family: var(--head);
font-weight: 700;
color: var(--ink);
}
.entry-tags a {
background: var(--bg-soft);
padding: 7px 14px;
border-radius: 999px;
font-size: 13.5px;
color: var(--body);
}
.entry-tags a:hover {
background: var(--accent);
color: #fff;
}
.post-nav {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
margin-top: 44px;
}
.post-nav a {
background: #fff;
border: 1px solid var(--line);
border-radius: var(--r-lg);
padding: 22px;
transition: .25s;
}
.post-nav a:hover {
border-color: var(--accent);
box-shadow: var(--shadow-md);
}
.post-nav small {
display: block;
font-size: 12.5px;
text-transform: uppercase;
letter-spacing: .07em;
color: var(--accent);
font-weight: 700;
margin-bottom: 6px;
}
.post-nav b {
font-family: var(--head);
color: var(--ink);
font-size: 16px;
line-height: 1.4;
}
.post-nav-next {
text-align: right;
} .comments-area {
margin-top: 56px;
padding-top: 44px;
border-top: 1px solid var(--line);
}
.comments-title {
font-family: var(--head);
font-size: 24px;
font-weight: 800;
color: var(--navy);
margin-bottom: 28px;
}
.comment-list {
list-style: none;
padding: 0;
margin: 0 0 48px;
}
.comment-list li {
margin-bottom: 24px;
}
.comment-body {
background: #fff;
border: 1px solid var(--line);
border-radius: var(--r-md);
padding: 24px 28px;
box-shadow: var(--shadow-sm);
transition: .25s;
}
.comment-body:hover {
border-color: var(--navy);
box-shadow: var(--shadow-md);
}
.comment-author {
display: flex;
align-items: center;
gap: 14px;
font-family: var(--head);
font-weight: 700;
color: var(--navy);
font-size: 16px;
}
.comment-author img {
border-radius: 50%;
border: 2px solid var(--line);
}
.comment-metadata {
font-size: 12.5px;
color: var(--body);
margin: 6px 0 14px;
}
.comment-metadata a {
color: inherit;
}
.comment-content {
color: var(--ink);
font-size: 15px;
line-height: 1.6;
}
.comment-body .reply {
margin-top: 14px;
}
.comment-body .reply a {
display: inline-flex;
align-items: center;
gap: 6px;
font-family: var(--head);
font-size: 13px;
font-weight: 700;
color: var(--accent);
transition: .2s;
}
.comment-body .reply a:hover {
color: var(--accent-dark);
}
.comment-list .children {
padding-left: 32px;
margin-top: 20px;
list-style: none;
} .comment-respond {
background: #fff;
border: 1px solid var(--line);
border-radius: var(--r-lg);
padding: 36px 32px;
box-shadow: var(--shadow-sm);
position: relative;
}
.comment-reply-header {
margin-bottom: 12px;
}
.comment-reply-header .eyebrow {
margin-bottom: 6px;
}
.comment-reply-title {
font-family: var(--head);
font-size: 24px;
font-weight: 800;
color: var(--navy);
margin: 0;
}
.comment-reply-title small a {
font-size: 13px;
font-weight: 600;
color: var(--accent);
margin-left: 12px;
}
.comment-notes {
color: var(--body);
font-size: 14px;
margin-bottom: 22px;
}
.comment-form {
display: flex;
flex-direction: column;
gap: 18px;
}
.comment-form-fields-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 18px;
}
.comment-form label {
display: block;
font-family: var(--head);
font-weight: 700;
font-size: 13.5px;
color: var(--navy);
margin-bottom: 8px;
}
.comment-form label .required {
color: var(--accent);
}
.comment-form input[type=text],
.comment-form input[type=email],
.comment-form input[type=url],
.comment-form textarea {
width: 100%;
border: 1.5px solid var(--line);
border-radius: var(--r-sm);
padding: 14px 16px;
background: #fff;
font-family: var(--text);
font-size: 14.5px;
color: var(--ink);
transition: all .2s ease;
}
.comment-form input:focus,
.comment-form textarea:focus {
outline: none;
border-color: var(--accent);
box-shadow: 0 0 0 3px var(--accent-soft);
background: #fff;
}
.comment-form textarea {
resize: vertical;
min-height: 120px;
}
.comment-form-cookies-consent {
display: flex;
align-items: flex-start;
gap: 10px;
margin: 2px 0 6px;
}
.comment-form-cookies-consent label {
display: flex;
align-items: flex-start;
gap: 10px;
font-family: var(--text);
font-weight: 400;
font-size: 13.5px;
color: var(--body);
line-height: 1.45;
cursor: pointer;
}
.comment-form-cookies-consent input[type=checkbox] {
margin-top: 3px;
cursor: pointer;
accent-color: var(--accent);
width: 16px;
height: 16px;
}
.form-submit {
margin-top: 6px;
}
.btn-comment-submit {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 14px 28px;
border-radius: var(--r-sm);
cursor: pointer;
font-family: var(--head);
font-weight: 700;
font-size: 15px;
transition: all .2s;
}
.btn-comment-submit:hover {
box-shadow: var(--shadow-accent);
transform: translateY(-2px);
}
.btn-comment-submit .svgi {
width: 16px;
height: 16px;
transition: transform .2s;
}
.btn-comment-submit:hover .svgi {
transform: translateX(3px);
}
@media(max-width:640px) {
.comment-respond {
padding: 24px 20px;
}
.comment-form-fields-grid {
grid-template-columns: 1fr;
}
} .svge-pagination {
margin-top: 48px;
}
.svge-pagination ul {
display: flex;
gap: 8px;
justify-content: center;
flex-wrap: wrap;
}
.svge-pagination a,
.svge-pagination span {
display: inline-flex;
align-items: center;
gap: 6px;
min-width: 46px;
height: 46px;
padding: 0 16px;
justify-content: center;
border-radius: var(--r-sm);
border: 1px solid var(--line);
background: #fff;
font-family: var(--head);
font-weight: 700;
font-size: 14.5px;
color: var(--ink);
}
.svge-pagination a:hover {
border-color: var(--accent);
color: var(--accent);
}
.svge-pagination .current {
background: var(--navy);
border-color: var(--navy);
color: #fff;
} .svge-searchform {
display: flex;
gap: 10px;
}
.svge-searchform input {
flex: 1;
min-width: 0;
border: 1px solid var(--line);
border-radius: var(--r-sm);
padding: 15px 18px;
background: #fff;
}
.svge-searchform input:focus {
outline: none;
border-color: var(--accent);
}
.svge-searchform button {
background: var(--accent);
color: #fff;
border-radius: var(--r-sm);
padding: 0 22px;
font-size: 19px;
display: grid;
place-items: center;
transition: .2s;
}
.svge-searchform button:hover {
background: var(--accent-dark);
}
.svge-empty {
text-align: center;
max-width: 560px;
margin: 0 auto;
padding: 60px 0;
}
.svge-empty-ic {
width: 76px;
height: 76px;
border-radius: 24px;
background: var(--bg-soft);
color: var(--accent);
display: grid;
place-items: center;
font-size: 32px;
margin: 0 auto 24px;
}
.svge-empty h2 {
font-size: 26px;
margin-bottom: 12px;
}
.svge-empty p {
margin-bottom: 26px;
}
.e404 {
text-align: center;
max-width: 620px;
margin: 0 auto;
}
.e404 b {
display: block;
font-family: var(--head);
font-weight: 800;
font-size: clamp(90px, 16vw, 180px);
line-height: 1;
color: var(--bg-soft);
letter-spacing: -.05em;
}
.e404 h1 {
font-size: clamp(26px, 3.4vw, 38px);
margin: -20px 0 14px;
}
.e404 p {
margin-bottom: 30px;
}
.e404-actions {
display: flex;
gap: 14px;
justify-content: center;
margin-top: 26px;
flex-wrap: wrap;
} .cta-section {
position: relative;
padding: 80px 0;
margin-bottom: 0;
}
.cta-card {
position: relative;
overflow: hidden;
background: var(--navy-deep);
border-radius: 24px;
box-shadow: 0 20px 50px -15px rgba(11, 26, 45, .25);
border: 1px solid var(--line);
}
.cta-bg {
position: absolute;
inset: 0;
}
.cta-bg img {
width: 100%;
height: 100%;
object-fit: cover;
}
.cta-bg::after {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(90deg, rgba(11, 26, 45, .95) 0%, rgba(11, 26, 45, .82) 100%);
}
.cta-inner {
position: relative;
z-index: 2;
padding: 60px 52px;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 44px;
align-items: center;
}
.cta-copy h2 {
font-size: clamp(24px, 3vw, 38px);
color: #fff;
margin-bottom: 12px;
line-height: 1.25;
}
.cta-copy p {
color: #bcd0e6;
font-size: 16px;
max-width: 580px;
line-height: 1.6;
}
.cta-actions {
display: flex;
gap: 16px;
flex-wrap: wrap;
}
.cta-actions .btn-wa,
.cta-actions .btn-outline {
background: #25d366;
border: 1px solid #25d366;
color: #fff;
transition: all .25s ease;
}
.cta-actions .btn-wa:hover,
.cta-actions .btn-outline:hover,
.cta-actions .btn-cta-wa:hover,
.cta-actions a[href*="wa.me"]:hover,
.cta-actions a[href*="whatsapp"]:hover {
background: #20ba5a !important;
border-color: #20ba5a !important;
color: #fff !important;
box-shadow: 0 10px 30px -6px rgba(37, 211, 102, 0.6) !important;
transform: translateY(-3px);
}
.site-footer {
background: var(--navy-deep);
color: #9fb6d0;
padding: 80px 0 0;
position: relative;
overflow: hidden;
}
.site-footer .blob {
width: 480px;
height: 480px;
background: radial-gradient(circle, var(--accent-soft), transparent 66%);
left: -160px;
bottom: -180px;
}
.site-footer a {
color: inherit;
}
.site-footer a:hover {
color: #fff;
}
.ft-grid {
display: grid;
grid-template-columns: 1.5fr 1fr 1fr 1.35fr;
gap: 46px;
position: relative;
z-index: 2;
}
.ft-brand .brand-txt b {
color: #fff;
}
.ft-brand .brand-txt small {
color: #7f95ae;
}
.ft-about {
margin: 22px 0 24px;
font-size: 14.5px;
line-height: 1.8;
}
.ft-social {
display: flex;
gap: 11px;
flex-wrap: wrap;
}
.ft-social a {
width: 42px;
height: 42px;
border-radius: 12px;
background: rgba(255, 255, 255, .08);
border: 1px solid rgba(255, 255, 255, .13);
display: grid;
place-items: center;
font-size: 17px;
color: #fff;
transition: all .25s ease;
}
.ft-social a:hover {
transform: translateY(-4px);
color: #fff;
} .ft-social a.social-ig:hover,
.ft-social a[aria-label="ig"]:hover,
.ft-social a[aria-label="instagram"]:hover {
background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%) !important;
border-color: #dc2743 !important;
box-shadow: 0 8px 20px rgba(220, 39, 67, 0.4);
} .ft-social a.social-in:hover,
.ft-social a[aria-label="in"]:hover,
.ft-social a[aria-label="linkedin"]:hover {
background: #0077b5 !important;
border-color: #0077b5 !important;
box-shadow: 0 8px 20px rgba(0, 119, 181, 0.4);
} .ft-social a.social-wa:hover,
.ft-social a[aria-label="wa"]:hover,
.ft-social a[aria-label="whatsapp"]:hover {
background: #25d366 !important;
border-color: #25d366 !important;
box-shadow: 0 8px 20px rgba(37, 211, 102, 0.4);
} .ft-social a.social-fb:hover,
.ft-social a[aria-label="fb"]:hover,
.ft-social a[aria-label="facebook"]:hover {
background: #1877f2 !important;
border-color: #1877f2 !important;
box-shadow: 0 8px 20px rgba(24, 119, 242, 0.4);
} .ft-social a.social-yt:hover,
.ft-social a[aria-label="yt"]:hover,
.ft-social a[aria-label="youtube"]:hover {
background: #ff0000 !important;
border-color: #ff0000 !important;
box-shadow: 0 8px 20px rgba(255, 0, 0, 0.4);
} .ft-social a.social-tw:hover,
.ft-social a.social-x:hover,
.ft-social a[aria-label="tw"]:hover,
.ft-social a[aria-label="x"]:hover {
background: #000000 !important;
border-color: #444444 !important;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
}
.ft-col h5 {
color: #fff;
font-size: 17px;
margin-bottom: 24px;
position: relative;
padding-bottom: 14px;
}
.ft-col h5::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 34px;
height: 3px;
background: var(--accent);
border-radius: 3px;
}
.ft-col li {
margin-bottom: 13px;
}
.ft-col a {
font-size: 14.5px;
transition: .25s;
display: inline-flex;
align-items: center;
gap: 9px;
}
.ft-col a .svgi {
font-size: 12px;
color: var(--accent);
}
.ft-col a:hover {
transform: translateX(4px);
}
.ft-contact li {
display: flex;
gap: 14px;
margin-bottom: 18px;
align-items: flex-start;
font-size: 14.5px;
}
.ft-contact .fi {
width: 40px;
height: 40px;
border-radius: 12px;
flex: none;
background: rgba(255, 255, 255, .08);
border: 1px solid rgba(255, 255, 255, .13);
display: grid;
place-items: center;
color: var(--gold);
font-size: 16px;
}
.ft-contact b {
display: block;
color: #fff;
font-family: var(--head);
font-size: 14.5px;
}
.newsletter {
margin-top: 22px;
display: flex;
gap: 9px;
}
.newsletter input {
flex: 1;
min-width: 0;
background: rgba(255, 255, 255, .08);
border: 1px solid rgba(255, 255, 255, .15);
border-radius: var(--r-sm);
padding: 13px 15px;
color: #fff;
font-size: 14px;
}
.newsletter input::placeholder {
color: #7f95ae;
}
.newsletter input:focus {
outline: none;
border-color: var(--accent);
}
.newsletter button {
background: var(--accent);
color: #fff;
border-radius: var(--r-sm);
padding: 0 18px;
font-size: 18px;
display: grid;
place-items: center;
transition: .2s;
}
.newsletter button:hover {
background: var(--accent-dark);
}
.ft-badges {
display: flex;
align-items: center;
justify-content: center;
gap: 24px;
margin-top: 40px;
padding-top: 28px;
border-top: 1px solid rgba(255, 255, 255, .08);
flex-wrap: wrap;
position: relative;
z-index: 2;
}
.ft-badges-container {
display: flex;
align-items: center;
justify-content: center;
gap: 24px;
flex-wrap: wrap;
}
.ft-badge-item {
display: inline-flex;
align-items: center;
justify-content: center;
transition: transform .25s ease, filter .25s ease;
}
.ft-badge-item:hover {
transform: translateY(-4px);
}
.ft-badges img,
.ft-badges svg {
max-height: 80px;
width: auto;
object-fit: contain;
filter: drop-shadow(0 4px 12px rgba(0,0,0,0.25));
}
.ft-bottom {
margin-top: 32px;
border-top: 1px solid rgba(255, 255, 255, .11);
padding: 26px 0;
display: flex;
justify-content: space-between;
align-items: center;
gap: 20px;
flex-wrap: wrap;
font-size: 13.5px;
position: relative;
z-index: 2;
}
.ft-bottom.align-center {
justify-content: center;
text-align: center;
flex-direction: column;
gap: 12px;
}
.ft-bottom.align-left {
justify-content: flex-start;
text-align: left;
}
.ft-bottom.align-right {
justify-content: flex-end;
text-align: right;
}
.ft-bottom.align-space-between {
justify-content: space-between;
}
.fb-links {
display: flex;
gap: 26px;
flex-wrap: wrap;
} .svge-totop,
.svge-wa-float {
position: fixed;
right: 24px;
width: 52px;
height: 52px;
border-radius: 50%;
display: grid;
place-items: center;
z-index: 90;
transition: .3s;
box-shadow: var(--shadow-lg);
}
.svge-totop {
bottom: 24px;
background: var(--navy);
color: #fff;
font-size: 20px;
transform: rotate(180deg) translateY(20px);
opacity: 0;
pointer-events: none;
}
.svge-totop.show {
opacity: 1;
pointer-events: auto;
transform: rotate(180deg) translateY(0);
}
.svge-totop:hover {
background: var(--accent);
}
.svge-wa-float {
bottom: 88px;
background: #25d366;
color: #fff;
font-size: 24px;
overflow: hidden;
isolation: isolate;
}
.svge-wa-float::before {
content: "";
position: absolute;
inset: 0 auto 0 -160%;
width: 160%;
left: -160%;
transform: skewX(-20deg);
z-index: 0;
pointer-events: none;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .45), transparent);
transition: left .55s cubic-bezier(.4, 0, .2, 1);
}
.svge-wa-float:hover::before {
left: 160%;
}
.svge-wa-float:hover {
transform: none;
background: #20ba5a;
color: #fff;
}
.svge-wa-float .svgi {
position: relative;
z-index: 1;
}
.svge-toast {
position: fixed;
left: 50%;
bottom: 28px;
transform: translateX(-50%);
z-index: 300;
padding: 16px 24px;
border-radius: var(--r-md);
font-family: var(--head);
font-weight: 600;
font-size: 14.5px;
color: #fff;
box-shadow: var(--shadow-lg);
max-width: 90vw;
animation: svge-toast-in .4s ease both;
}
.svge-toast-ok {
background: #12805c;
}
.svge-toast-err {
background: #c0392b;
}
@keyframes svge-toast-in {
from {
opacity: 0;
transform: translate(-50%, 20px);
}
to {
opacity: 1;
transform: translate(-50%, 0);
}
}
.svge-preloader {
position: fixed;
inset: 0;
background: #fff;
z-index: 9999;
display: grid;
place-items: center;
transition: opacity .4s;
}
.svge-preloader.done {
opacity: 0;
pointer-events: none;
}
.svge-spinner {
width: 44px;
height: 44px;
border: 3px solid var(--line);
border-top-color: var(--accent);
border-radius: 50%;
animation: svge-spin .8s linear infinite;
}
@keyframes svge-spin {
to {
transform: rotate(360deg);
}
} .alignleft {
float: left;
margin: 6px 26px 20px 0;
}
.alignright {
float: right;
margin: 6px 0 20px 26px;
}
.aligncenter {
margin: 0 auto;
display: block;
}
.content-main .alignwide,
.content-main .alignfull,
.has-sidebar .alignwide,
.has-sidebar .alignfull,
.entry-content .svge-costs.alignwide {
width: 100% !important;
max-width: 100% !important;
margin-left: 0 !important;
margin-right: 0 !important;
transform: none !important;
}
.alignwide {
width: min(1100px, 92vw);
margin-left: 50%;
transform: translateX(-50%);
max-width: none;
}
.alignfull {
width: 100vw;
margin-left: 50%;
transform: translateX(-50%);
max-width: none;
}
.wp-caption {
max-width: 100%;
}
.wp-caption-text,
.wp-block-image figcaption {
font-size: 13.5px;
text-align: center;
margin-top: 10px;
color: var(--body);
}
.sticky {
position: relative;
}
.gallery {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 14px;
}
.gallery-item img {
border-radius: var(--r-sm);
}
.page-links {
margin-top: 26px;
display: flex;
gap: 8px;
align-items: center;
} .visa-stats-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
}
.v-stat-card {
background: #fff;
border: 1px solid var(--line);
border-radius: var(--r-lg);
padding: 24px 20px;
display: flex;
align-items: center;
gap: 16px;
box-shadow: var(--shadow-sm);
transition: all .25s ease;
}
.v-stat-card:hover {
transform: translateY(-4px);
box-shadow: var(--shadow-md);
border-color: var(--accent);
}
.v-stat-ic {
width: 52px;
height: 52px;
border-radius: 14px;
background: var(--accent-soft);
color: var(--accent);
display: grid;
place-items: center;
font-size: 24px;
flex: none;
}
.v-stat-info b {
display: block;
font-family: var(--head);
font-weight: 800;
font-size: 24px;
color: var(--navy);
line-height: 1.1;
}
.v-stat-info span {
font-size: 13.5px;
color: var(--body);
font-weight: 500;
}
.visa-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
}
.v-card {
background: #fff;
border-radius: var(--r-lg);
padding: 32px 28px;
box-shadow: var(--shadow-sm);
border: 1px solid var(--line);
display: flex;
flex-direction: column;
justify-content: space-between;
transition: all .3s ease;
}
.v-card:hover {
transform: translateY(-6px);
box-shadow: var(--shadow-md);
border-color: var(--accent);
}
.v-card-top {
display: flex;
align-items: center;
gap: 16px;
margin-bottom: 20px;
padding-bottom: 16px;
border-bottom: 1px solid var(--line);
}
.v-flag {
font-size: 36px;
line-height: 1;
}
.v-card-top h3 {
font-size: 18px;
color: var(--navy);
margin-bottom: 4px;
}
.v-badge {
display: inline-block;
font-size: 12px;
font-weight: 700;
color: var(--accent);
background: var(--accent-soft);
padding: 3px 10px;
border-radius: 999px;
}
.v-list {
display: grid;
gap: 12px;
margin-bottom: 24px;
font-size: 14px;
color: var(--body);
}
.v-list li strong {
color: var(--navy);
}
.v-card-foot .btn {
width: 100%;
justify-content: center;
}
.v-steps-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 24px;
}
.v-step {
background: #fff;
border: 1px solid var(--line);
border-radius: var(--r-lg);
padding: 34px 26px;
position: relative;
transition: all .3s ease;
}
.v-step:hover {
transform: translateY(-5px);
box-shadow: var(--shadow-md);
border-color: var(--accent);
}
.v-step-num {
font-family: var(--head);
font-weight: 900;
font-size: 42px;
color: var(--accent-soft);
line-height: 1;
margin-bottom: 14px;
letter-spacing: -0.04em;
}
.v-step:hover .v-step-num {
color: var(--accent);
}
.v-step h3 {
font-size: 18px;
color: var(--navy);
margin-bottom: 10px;
}
.v-step p {
font-size: 14px;
color: var(--body);
line-height: 1.6;
}
.v-docs-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
}
.v-doc-item {
background: #fff;
border-radius: var(--r-md);
border: 1px solid var(--line);
padding: 24px;
display: flex;
gap: 18px;
align-items: flex-start;
box-shadow: var(--shadow-sm);
transition: all .25s ease;
}
.v-doc-item:hover {
border-color: var(--navy);
box-shadow: var(--shadow-md);
}
.v-doc-ic {
width: 38px;
height: 38px;
border-radius: 50%;
background: rgba(0, 168, 200, 0.12);
color: var(--cyan);
display: grid;
place-items: center;
font-size: 18px;
flex: none;
}
.v-doc-item h4 {
font-size: 16px;
color: var(--navy);
margin-bottom: 6px;
}
.v-doc-item p {
font-size: 14px;
color: var(--body);
line-height: 1.55;
}
.v-cta-box {
background: linear-gradient(135deg, var(--navy-deep), var(--navy));
border-radius: var(--r-xl);
padding: 54px 48px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 36px;
color: #fff;
box-shadow: var(--shadow-lg);
}
.v-cta-copy h2 {
color: #fff;
font-size: clamp(24px, 2.8vw, 36px);
margin-bottom: 10px;
}
.v-cta-copy p {
color: #bcd0e6;
font-size: 16px;
max-width: 600px;
} .srv-detail-section .wrap {
max-width: 1280px;
}
.srv-detail-grid {
display: grid;
grid-template-columns: 1fr 380px;
gap: 40px;
align-items: start;
}
.srv-main-card {
background: #ffffff;
border-radius: var(--r-xl);
border: 1px solid var(--line);
padding: 44px 48px;
box-shadow: var(--shadow-sm);
}
.srv-content h2 {
font-size: clamp(22px, 2.2vw, 30px);
color: var(--navy);
margin-top: 0;
margin-bottom: 16px;
font-weight: 700;
line-height: 1.3;
}
.srv-content .lead-txt {
font-size: 17px;
color: var(--navy);
font-weight: 600;
line-height: 1.7;
margin-bottom: 20px;
}
.srv-content p {
color: var(--body);
line-height: 1.75;
margin-bottom: 18px;
font-size: 15.5px;
}
.srv-content h3 {
font-size: 20px;
color: var(--navy);
margin-top: 32px;
margin-bottom: 14px;
font-weight: 700;
}
.srv-content ul {
margin: 18px 0 24px;
padding-left: 0;
list-style: none;
display: flex;
flex-direction: column;
gap: 12px;
}
.srv-content li {
position: relative;
padding-left: 28px;
line-height: 1.65;
color: var(--body);
font-size: 15px;
}
.srv-content li::before {
content: "✓";
position: absolute;
left: 0;
top: 0;
color: var(--accent);
font-weight: 800;
font-size: 16px;
}
.srv-sidebar {
display: flex;
flex-direction: column;
gap: 24px;
position: sticky;
top: 100px;
}
.srv-side-card {
background: #ffffff;
border-radius: var(--r-lg);
border: 1px solid var(--line);
padding: 28px;
box-shadow: var(--shadow-sm);
}
.srv-cta-side {
position: relative;
overflow: hidden;
background: var(--navy-deep);
border-radius: var(--r-xl);
border: 1px solid rgba(255, 255, 255, 0.12);
padding: 32px 26px;
box-shadow: 0 20px 50px -15px rgba(11, 26, 45, .35);
color: #fff;
}
.srv-cta-bg {
position: absolute;
inset: 0;
z-index: 1;
}
.srv-cta-bg img {
width: 100%;
height: 100%;
object-fit: cover;
}
.srv-cta-bg::after {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(135deg, rgba(6, 28, 54, 0.96) 0%, rgba(11, 26, 45, 0.88) 100%);
}
.srv-cta-inner {
position: relative;
z-index: 2;
}
.srv-cta-inner .eyebrow {
margin-bottom: 8px;
display: inline-flex;
}
.srv-cta-inner h3 {
font-size: 21px;
color: #ffffff;
margin-bottom: 10px;
font-weight: 700;
line-height: 1.35;
}
.srv-cta-inner p {
font-size: 13.5px;
color: #bcd0e6;
margin-bottom: 22px;
line-height: 1.55;
}
.srv-cta-inner .srv-side-btns {
display: flex;
flex-direction: column;
gap: 10px;
}
.srv-cta-inner .srv-side-btns .btn {
width: 100%;
justify-content: center;
text-align: center;
}
.srv-cta-inner .srv-side-btns .btn-outline {
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.25);
background: rgba(255, 255, 255, 0.08);
transition: all .25s ease;
}
.srv-cta-inner .srv-side-btns .btn-outline:hover,
.srv-cta-inner .srv-side-btns .btn-side-wa:hover,
.srv-cta-inner .srv-side-btns a[href*="wa.me"]:hover,
.srv-cta-inner .srv-side-btns a[href*="whatsapp"]:hover {
background: #25d366 !important;
border-color: #25d366 !important;
color: #ffffff !important;
box-shadow: 0 10px 25px -6px rgba(37, 211, 102, 0.6) !important;
transform: translateY(-2px);
}
.srv-nav-side h4 {
font-size: 17px;
color: var(--navy);
margin-bottom: 16px;
font-weight: 700;
border-bottom: 1.5px solid var(--line);
padding-bottom: 10px;
}
.srv-side-nav {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 6px;
}
.srv-side-nav li a {
display: flex;
align-items: center;
gap: 12px;
padding: 10px 14px;
border-radius: var(--r-md);
color: var(--navy);
font-weight: 600;
font-size: 14px;
text-decoration: none;
transition: all .2s;
}
.srv-side-nav li a:hover {
background: var(--accent-soft);
color: var(--accent);
transform: translateX(4px);
}
.srv-side-nav li.is-current a {
background: var(--navy);
color: #ffffff !important;
}
.srv-side-nav li.is-current a .svgi {
color: #ffffff;
}
.s-nav-ic {
width: 22px;
height: 22px;
display: grid;
place-items: center;
flex: none;
}
.s-nav-ic .svgi {
width: 16px;
height: 16px;
}
.s-nav-title {
flex: 1;
}
.srv-side-nav li a .svgi:last-child {
width: 13px;
height: 13px;
opacity: 0.5;
transition: transform .2s;
}
.srv-side-nav li a:hover .svgi:last-child {
opacity: 1;
transform: translateX(3px);
}
.srv-badges-side {
display: grid;
grid-template-columns: 1fr;
gap: 10px;
padding: 18px;
background: var(--bg-soft);
}
.srv-mini-badge {
display: flex;
align-items: center;
gap: 14px;
padding: 12px 14px;
background: #ffffff;
border-radius: var(--r-md);
border: 1px solid var(--line);
}
.srv-mini-badge b {
font-size: 20px;
color: var(--accent);
font-family: var(--head);
font-weight: 800;
min-width: 65px;
}
.srv-mini-badge span {
font-size: 12.5px;
color: var(--navy);
font-weight: 600;
line-height: 1.35;
}
.srv-others-sec {
margin-top: 20px;
} .about-lead-card {
background: #fff;
border-radius: var(--r-xl);
border: 1px solid var(--line);
padding: 48px;
display: grid;
grid-template-columns: 1.6fr 1fr;
gap: 48px;
box-shadow: var(--shadow-sm);
}
.alc-content h2 {
font-size: clamp(24px, 2.5vw, 34px);
color: var(--navy);
margin-bottom: 18px;
line-height: 1.3;
}
.alc-content .lead-txt {
font-size: 17px;
color: var(--navy);
font-weight: 600;
line-height: 1.65;
margin-bottom: 16px;
}
.alc-content p {
color: var(--body);
line-height: 1.7;
margin-bottom: 14px;
}
.about-desc-box {
margin-top: 20px;
padding: 22px;
background: var(--soft);
border-radius: var(--r-md);
border-left: 4px solid var(--accent);
}
.about-desc-box p:last-child {
margin-bottom: 0;
}
.alc-badges-side {
display: flex;
flex-direction: column;
gap: 18px;
justify-content: center;
}
.alc-badge-card {
background: var(--soft);
border: 1px solid var(--line);
border-radius: var(--r-lg);
padding: 24px;
display: flex;
align-items: center;
gap: 20px;
transition: all .25s ease;
}
.alc-badge-card:hover {
background: #fff;
border-color: var(--accent);
box-shadow: var(--shadow-md);
transform: translateY(-3px);
}
.abc-num {
font-family: var(--head);
font-size: 32px;
font-weight: 900;
color: var(--accent);
line-height: 1;
flex: none;
}
.abc-txt b {
display: block;
font-size: 16px;
color: var(--navy);
margin-bottom: 4px;
}
.abc-txt span {
font-size: 13px;
color: var(--body);
line-height: 1.4;
display: block;
}
.about-diff-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 24px;
}
.diff-card {
background: #fff;
border-radius: var(--r-lg);
border: 1px solid var(--line);
padding: 34px 28px;
box-shadow: var(--shadow-sm);
transition: all .3s ease;
}
.diff-card:hover {
transform: translateY(-5px);
box-shadow: var(--shadow-md);
border-color: var(--accent);
}
.diff-card-wide {
grid-column: 1 / -1;
width: 100%;
max-width: calc(50% - 12px);
justify-self: center;
display: block;
}
.diff-ic {
width: 52px;
height: 52px;
border-radius: 14px;
background: var(--accent-soft);
color: var(--accent);
display: grid;
place-items: center;
font-size: 24px;
margin-bottom: 18px;
flex: none;
}
.diff-card h3 {
font-size: 18px;
color: var(--navy);
margin-bottom: 10px;
}
.diff-card p {
font-size: 14.5px;
color: var(--body);
line-height: 1.65;
}
.about-steps-grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 18px;
}
.ab-step {
background: #fff;
border: 1px solid var(--line);
border-radius: var(--r-lg);
padding: 26px 20px;
transition: all .3s ease;
}
.ab-step:hover {
transform: translateY(-4px);
border-color: var(--accent);
box-shadow: var(--shadow-md);
}
.ab-step-head {
margin-bottom: 12px;
}
.ab-num {
font-family: var(--head);
font-size: 32px;
font-weight: 900;
color: var(--accent-soft);
display: block;
line-height: 1;
margin-bottom: 8px;
}
.ab-step:hover .ab-num {
color: var(--accent);
}
.ab-step h4 {
font-size: 15px;
color: var(--navy);
line-height: 1.35;
}
.ab-step p {
font-size: 13px;
color: var(--body);
line-height: 1.55;
}
.ab-services-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 16px;
}
.ab-srv-item {
background: #fff;
border: 1px solid var(--line);
border-radius: var(--r-md);
padding: 18px 22px;
display: flex;
align-items: center;
gap: 14px;
box-shadow: var(--shadow-sm);
transition: all .25s ease;
}
.ab-srv-item:hover {
border-color: var(--cyan);
transform: translateX(4px);
}
.ab-srv-ic {
width: 32px;
height: 32px;
border-radius: 50%;
background: rgba(0, 168, 200, 0.12);
color: var(--cyan);
display: grid;
place-items: center;
font-size: 16px;
flex: none;
}
.ab-srv-item span {
font-size: 15px;
font-weight: 600;
color: var(--navy);
}
.about-mv-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 28px;
}
.mv-card {
border-radius: var(--r-xl);
padding: 44px 38px;
box-shadow: var(--shadow-md);
position: relative;
overflow: hidden;
}
.mv-mission {
background: linear-gradient(135deg, var(--navy), var(--navy-deep));
color: #bcd0e6;
}
.mv-mission h3 {
color: #fff;
}
.mv-vision {
background: #fff;
border: 2px solid var(--accent);
color: var(--body);
}
.mv-vision h3 {
color: var(--navy);
}
.mv-ic {
width: 56px;
height: 56px;
border-radius: 16px;
background: var(--accent-soft);
color: var(--accent);
display: grid;
place-items: center;
font-size: 26px;
margin-bottom: 20px;
}
.mv-card h3 {
font-size: 22px;
margin-bottom: 12px;
}
.mv-card p {
font-size: 16px;
line-height: 1.7;
}
.founder-card {
background: #fff;
border-radius: var(--r-xl);
border: 1px solid var(--line);
padding: 48px;
display: grid;
grid-template-columns: 240px 1fr;
gap: 48px;
align-items: center;
box-shadow: var(--shadow-sm);
}
.founder-photo-col {
text-align: center;
}
.founder-photo {
width: 170px;
height: 170px;
border-radius: 50%;
overflow: hidden;
margin: 0 auto 16px;
border: 4px solid var(--accent-soft);
box-shadow: var(--shadow-md);
}
.founder-photo img {
width: 100%;
height: 100%;
object-fit: cover;
}
.founder-meta h4 {
font-size: 18px;
color: var(--navy);
margin-bottom: 4px;
}
.founder-meta span {
font-size: 13.5px;
color: var(--accent);
font-weight: 600;
}
.founder-quote {
border-left: 4px solid var(--accent);
padding-left: 24px;
margin-top: 14px;
}
.founder-quote p {
font-size: 16px;
line-height: 1.7;
color: var(--body);
margin-bottom: 14px;
}
.about-cta-card {
background: linear-gradient(135deg, var(--navy-deep), var(--navy));
border-radius: var(--r-xl);
padding: 54px 48px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 40px;
color: #fff;
box-shadow: var(--shadow-lg);
}
.acc-copy h2 {
color: #fff;
font-size: clamp(24px, 2.8vw, 36px);
margin-bottom: 10px;
}
.acc-copy p {
color: #bcd0e6;
font-size: 16px;
max-width: 620px;
margin-bottom: 18px;
}
.acc-contact-info {
display: flex;
gap: 20px;
flex-wrap: wrap;
font-size: 14px;
color: #bcd0e6;
}
.acc-contact-info a {
color: #fff;
font-weight: 600;
} @media(max-width:1200px) {
.proc-grid {
grid-template-columns: repeat(3, 1fr);
gap: 36px 22px;
}
.proc-grid::before {
display: none;
}
}
@media(max-width:1100px) {
.hero-grid {
grid-template-columns: 1fr;
gap: 44px;
}
.hero-card {
max-width: 520px;
}
.about-grid,
.why-grid {
grid-template-columns: 1fr;
gap: 48px;
}
.team-grid,
.ctry-grid,
.srv-grid,
.blog-grid,
.counter-grid {
grid-template-columns: repeat(2, 1fr);
}
.tst {
flex: 0 0 calc((100% - 26px)/2);
}
.logos {
grid-template-columns: repeat(3, 1fr);
}
.ft-grid {
grid-template-columns: repeat(2, 1fr);
gap: 40px;
}
.content-grid.has-sidebar,
.content-grid.sidebar-left {
grid-template-columns: 1fr;
}
.content-grid.sidebar-left .content-main {
order: 1;
}
.content-grid.sidebar-left .content-side {
order: 2;
}
.pst-row {
grid-template-columns: 260px minmax(0, 1fr);
}
} .cmp-page-body .wrap {
max-width: 1280px;
}
.svge-cmp {
background: #ffffff;
border-radius: var(--r-xl);
border: 1px solid var(--line);
padding: 44px 48px;
box-shadow: var(--shadow-sm);
margin: 0 0 40px;
width: 100%;
}
.svge-cmp-pick {
margin-bottom: 28px;
}
.svge-cmp-pick-head .eyebrow {
margin-bottom: 8px;
display: block;
}
.svge-cmp-title {
font-size: clamp(24px, 2.5vw, 34px);
color: var(--navy);
margin-bottom: 12px;
font-weight: 700;
line-height: 1.25;
}
.svge-cmp-hint {
font-size: 16px;
color: var(--body);
margin-bottom: 24px;
line-height: 1.6;
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.svge-cmp-badge {
display: inline-flex;
align-items: center;
background: var(--accent-soft);
color: var(--accent);
font-weight: 700;
font-size: 13px;
padding: 4px 14px;
border-radius: 999px;
}
.svge-cmp-chips-wrapper {
display: flex;
flex-direction: column;
gap: 12px;
}
.svge-cmp-chips {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.svge-chip {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 11px 20px;
background: #ffffff;
border: 1.5px solid var(--line);
border-radius: 999px;
cursor: pointer;
user-select: none;
transition: all .25s ease;
font-family: var(--head);
font-size: 15px;
font-weight: 600;
color: var(--navy);
}
.svge-chip input[type="checkbox"] {
position: absolute;
opacity: 0;
pointer-events: none;
width: 0;
height: 0;
}
.svge-chip:hover:not(.is-disabled) {
border-color: var(--accent);
color: var(--accent);
transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(255, 107, 43, 0.12);
}
.svge-chip.is-selected {
background: var(--accent);
border-color: var(--accent);
color: #ffffff !important;
box-shadow: 0 6px 20px rgba(255, 107, 43, 0.28);
transform: translateY(-2px);
}
.svge-chip.is-disabled {
opacity: 0.38;
cursor: not-allowed;
background: var(--bg-soft);
border-color: var(--line);
box-shadow: none;
transform: none;
}
.svge-chip-flag {
font-size: 20px;
line-height: 1;
}
.svge-cmp-actions {
display: flex;
justify-content: flex-end;
margin-top: 4px;
}
.svge-cmp-clear {
background: transparent;
border: 0;
color: var(--body);
font-size: 13.5px;
font-weight: 600;
text-decoration: underline;
cursor: pointer;
padding: 4px 8px;
transition: color .2s;
}
.svge-cmp-clear:hover {
color: var(--accent);
} .svge-cmp-empty {
padding: 48px 24px;
text-align: center;
background: var(--bg-soft);
border-radius: var(--r-lg);
border: 2px dashed var(--line);
margin-top: 10px;
}
.svge-cmp-empty-ic {
width: 58px;
height: 58px;
border-radius: 50%;
background: #ffffff;
color: var(--navy);
display: inline-flex;
align-items: center;
justify-content: center;
margin-bottom: 14px;
box-shadow: var(--shadow-sm);
}
.svge-cmp-empty-ic .svgi {
width: 28px;
height: 28px;
}
.svge-cmp-empty h4 {
font-size: 19px;
margin-bottom: 6px;
color: var(--navy);
font-weight: 700;
}
.svge-cmp-empty p {
font-size: 15px;
color: var(--body);
max-width: 560px;
margin: 0 auto;
line-height: 1.6;
} .svge-cmp-table-wrap {
border-radius: var(--r-lg);
border: 1px solid var(--line);
overflow-x: auto;
-webkit-overflow-scrolling: touch;
margin-top: 24px;
margin-bottom: 18px;
box-shadow: 0 4px 20px rgba(11, 26, 45, 0.04);
background: #ffffff;
position: relative;
}
.svge-cmp-table {
width: 100%;
border-collapse: collapse;
text-align: left;
margin: 0;
font-size: 14.5px;
table-layout: fixed;
}
@media(max-width: 900px) {
.svge-cmp-table {
table-layout: auto !important;
min-width: 660px;
width: max-content;
}
.svge-cmp-th-label,
.svge-cmp-td-label {
width: 160px !important;
min-width: 160px !important;
position: static !important;
box-shadow: none !important;
}
.svge-cmp-th-country,
.svge-cmp-td-val {
width: 210px !important;
min-width: 210px !important;
}
}
.svge-cmp-table th,
.svge-cmp-table td {
padding: 16px 20px;
border: 1px solid var(--line);
vertical-align: middle;
} .svge-cmp-thead-row th {
background: var(--navy);
color: #ffffff;
font-weight: 700;
border-color: rgba(255, 255, 255, 0.12);
}
.svge-cmp-th-label {
background: var(--navy-deep) !important;
color: #ffffff;
width: 24%;
font-family: var(--head);
font-size: 15px;
font-weight: 700;
padding: 22px 20px;
}
.svge-cmp-th-country {
text-align: center;
position: relative;
padding: 20px 16px;
}
.svge-cmp-country-head {
display: flex;
flex-direction: column;
align-items: center;
position: relative;
}
.svge-cmp-remove {
position: absolute;
top: -8px;
right: -6px;
width: 24px;
height: 24px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.18);
border: 0;
color: #ffffff;
display: grid;
place-items: center;
font-size: 16px;
cursor: pointer;
transition: all .2s;
}
.svge-cmp-remove:hover {
background: #ff4757;
color: #ffffff;
transform: scale(1.1);
}
.svge-cmp-country-thumb {
width: 64px;
height: 44px;
border-radius: var(--r-sm);
overflow: hidden;
margin-bottom: 8px;
box-shadow: 0 4px 10px rgba(0,0,0,0.25);
}
.svge-cmp-country-thumb img {
width: 100%;
height: 100%;
object-fit: cover;
}
.svge-cmp-country-flag {
font-size: 28px;
display: block;
margin-bottom: 4px;
line-height: 1;
}
.svge-cmp-country-name {
font-size: 18px;
color: #ffffff;
margin: 0 0 4px;
font-weight: 700;
}
.svge-cmp-country-link {
display: inline-block;
font-size: 12.5px;
color: var(--accent);
text-decoration: none;
font-weight: 700;
transition: opacity .2s;
}
.svge-cmp-country-link:hover {
text-decoration: underline;
} .svge-cmp-row:nth-child(even) td {
background: var(--bg-soft);
}
.svge-cmp-row:nth-child(odd) td {
background: #ffffff;
}
.svge-cmp-td-label {
font-family: var(--head);
font-size: 14.5px;
color: var(--navy);
font-weight: 700;
border-right: 1px solid var(--line);
}
.svge-cmp-label-inner {
display: flex;
align-items: center;
gap: 12px;
}
.svge-cmp-label-ic {
width: 34px;
height: 34px;
border-radius: 8px;
background: var(--accent-soft);
color: var(--accent);
display: grid;
place-items: center;
flex: none;
}
.svge-cmp-label-ic .svgi {
width: 17px;
height: 17px;
}
.svge-cmp-td-val {
color: var(--navy-deep);
line-height: 1.6;
font-size: 14.5px;
}
.svge-cmp-val-inner {
word-break: break-word;
}
.svge-cmp-note {
font-size: 13.5px;
color: var(--body);
margin-top: 12px;
font-style: italic;
}
@media(max-width:900px) {
.mainnav,
.hd-cta {
display: none;
}
.tb-left span:nth-child(n+3) {
display: none;
}
.burger {
display: grid;
}
.site-header {
padding: 12px 14px;
}
.hd {
min-height: 68px;
padding: 0 16px;
border-radius: 999px;
position: relative;
justify-content: center;
}
.site-header .brand {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
display: flex;
align-items: center;
justify-content: center;
max-width: calc(100% - 110px);
}
.site-header .brand-logo img {
max-height: 44px;
width: auto;
display: block;
}
.site-header .hd-right {
position: absolute;
right: 14px;
top: 50%;
transform: translateY(-50%);
display: flex;
align-items: center;
gap: 6px;
}
.cta-section {
margin-bottom: 0;
padding: 50px 0;
}
.about-lead-card {
grid-template-columns: 1fr;
padding: 32px 24px;
gap: 32px;
}
.about-diff-grid,
.about-mv-grid {
grid-template-columns: 1fr;
}
.diff-card-wide {
max-width: 100%;
}
.about-steps-grid {
grid-template-columns: repeat(2, 1fr);
}
.founder-card {
grid-template-columns: 1fr;
padding: 36px 24px;
text-align: center;
gap: 28px;
}
.founder-quote {
border-left: none;
border-top: 3px solid var(--accent);
padding-left: 0;
padding-top: 20px;
}
.about-cta-card {
flex-direction: column;
text-align: center;
padding: 40px 24px;
}
.acc-contact-info {
justify-content: center;
flex-direction: column;
gap: 10px;
}
.visa-stats-grid,
.visa-grid,
.v-steps-grid {
grid-template-columns: repeat(2, 1fr);
}
.v-docs-grid {
grid-template-columns: 1fr;
}
.v-cta-box {
flex-direction: column;
text-align: center;
padding: 40px 24px;
}
.cta-inner {
grid-template-columns: 1fr;
padding: 44px 32px;
gap: 28px;
}
.site-footer {
padding: 60px 0 0;
}
.quick-grid {
grid-template-columns: 1fr;
}
.quick {
margin-top: 0 !important;
padding: 50px 0 20px !important;
}
.about-media {
padding-right: 0;
padding-bottom: 0;
}
.am-badge {
left: 0;
}
.am-sub {
position: relative;
width: 100%;
right: auto;
bottom: auto;
margin-top: 16px;
border-width: 0;
}
.post-nav {
grid-template-columns: 1fr;
}
.post-nav-next {
text-align: left;
}
}
@media(max-width:700px) {
.section {
padding: 68px 0;
}
.cta-card {
border-radius: 18px;
}
.cta-inner {
padding: 32px 20px;
}
.cta-actions {
flex-direction: column;
width: 100%;
}
.cta-actions .btn {
width: 100%;
justify-content: center;
}
.counter-grid,
.ctry-grid,
.srv-grid,
.blog-grid,
.team-grid,
.proc-grid,
.visa-stats-grid,
.visa-grid,
.v-steps-grid,
.about-steps-grid,
.ab-services-grid {
grid-template-columns: 1fr;
}
.tst {
flex: 0 0 100%;
}
.svge-cmp {
padding: 24px 16px;
}
.svge-cmp-chips {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 8px;
}
.svge-chip {
padding: 8px 12px;
font-size: 13px;
justify-content: center;
}
.svge-cmp-table {
font-size: 13.5px;
}
.svge-cmp-table th,
.svge-cmp-table td {
padding: 12px 14px;
}
.svge-cmp-th-label,
.svge-cmp-td-label {
min-width: 150px;
font-size: 13px;
}
.svge-cmp-th-country,
.svge-cmp-td-val {
min-width: 180px;
}
.logos {
grid-template-columns: repeat(2, 1fr);
}
.ft-grid {
grid-template-columns: 1fr;
}
.evt {
grid-template-columns: 80px minmax(0, 1fr);
gap: 18px;
}
.evt .btn {
grid-column: 1/-1;
justify-content: center;
}
.hero-inner {
padding: 60px 0 116px;
}
.hero-banner {
--hero-h: 520px;
}
.hero-banner.h-full {
--hero-h: 88vh;
}
.hero-banner .hero-inner {
padding: 80px 0 150px;
}
.hero-arrow {
display: none;
}
.hero-foot {
padding-bottom: 66px;
}
.hero-foot-inner {
justify-content: center;
flex-direction: column;
gap: 16px;
}
.hero-trustbar {
display: none;
}
.hero-banner .hero-copy p {
font-size: 16px;
}
.topbar {
display: none;
}
.site-header {
top: 0;
}
.pst-row {
grid-template-columns: 1fr;
}
.pst-row-body {
padding: 26px;
}
.pst-row-img {
min-height: 200px;
}
.brand-txt small {
display: none;
}
.brand-txt b {
font-size: 19px;
}
.brand-mark {
width: 40px;
height: 40px;
border-radius: 11px;
}
.hd {
gap: 12px;
min-height: 72px;
}
.hd .icon-btn:not(.burger) {
display: none;
}
.dots {
display: none;
}
.about-media {
overflow: hidden;
}
.single-thumb {
margin-top: -36px;
}
.comment-list .children {
padding-left: 16px;
}
.gallery {
grid-template-columns: repeat(2, 1fr);
}
} .sss-intro-sec {
padding: 60px 0 30px;
}
.sss-main-sec {
padding: 60px 0 80px;
}
.sss-toolbar {
margin-bottom: 36px;
display: flex;
flex-direction: column;
gap: 20px;
}
.sss-search-box {
position: relative;
width: 100%;
}
.sss-search-ic {
position: absolute;
left: 20px;
top: 50%;
transform: translateY(-50%);
color: var(--accent);
display: grid;
place-items: center;
pointer-events: none;
font-size: 20px;
}
.sss-search-box input {
width: 100%;
padding: 16px 20px 16px 56px;
font-size: 16px;
border-radius: var(--r-md);
border: 1.5px solid var(--line);
background: #fff;
color: var(--navy-deep);
box-shadow: 0 6px 24px rgba(11, 26, 45, 0.05);
transition: all .25s ease;
}
.sss-search-box input:focus {
outline: none;
border-color: var(--accent);
box-shadow: 0 8px 30px rgba(255, 107, 43, 0.15);
}
.sss-cat-tabs {
display: flex;
gap: 10px;
flex-wrap: wrap;
justify-content: center;
}
.sss-tab {
padding: 10px 20px;
border-radius: 999px;
font-size: 14px;
font-weight: 600;
color: var(--text-muted);
background: var(--bg-soft);
border: 1px solid var(--line);
cursor: pointer;
transition: all .25s ease;
}
.sss-tab:hover {
color: var(--navy-deep);
border-color: var(--accent);
background: #fff;
}
.sss-tab.active {
background: var(--accent);
color: #fff;
border-color: var(--accent);
box-shadow: 0 6px 18px rgba(255, 107, 43, 0.35);
} .faq-list {
display: flex;
flex-direction: column;
gap: 14px;
}
.faq-item {
background: #ffffff;
border: 1.5px solid #e2e8f0;
border-radius: 16px;
overflow: hidden;
transition: all .25s cubic-bezier(0.16, 1, 0.3, 1);
box-shadow: 0 4px 18px rgba(11, 26, 45, 0.03);
}
.faq-item:hover {
border-color: #cbd5e1;
box-shadow: 0 6px 24px rgba(11, 26, 45, 0.06);
}
.faq-item[open] {
border-color: var(--accent);
box-shadow: 0 10px 30px rgba(255, 107, 43, 0.12);
background: #ffffff;
}
.faq-q {
display: flex;
align-items: center;
justify-content: space-between;
padding: 22px 26px;
font-size: 17px;
font-weight: 700;
color: var(--navy-deep);
cursor: pointer;
user-select: none;
list-style: none;
gap: 16px;
transition: color .2s ease;
}
.faq-q::-webkit-details-marker,
.faq-q::marker {
display: none !important;
}
.faq-q:hover {
color: var(--accent);
}
.faq-q-txt {
flex: 1;
text-align: left;
line-height: 1.45;
}
.faq-icon {
width: 36px;
height: 36px;
border-radius: 50%;
background: #f1f5f9;
border: 1px solid #e2e8f0;
display: grid;
place-items: center;
color: var(--navy);
transition: all .3s cubic-bezier(0.16, 1, 0.3, 1);
flex-shrink: 0;
}
.faq-icon svg {
width: 14px;
height: 14px;
transition: transform .3s ease;
}
.faq-item[open] .faq-icon {
transform: rotate(180deg);
background: var(--accent);
color: #ffffff;
border-color: var(--accent);
}
.faq-a {
padding: 0 26px 26px;
color: #475569;
font-size: 15.5px;
line-height: 1.8;
border-top: 1px solid transparent;
}
.faq-item[open] .faq-a {
border-top-color: #f1f5f9;
padding-top: 18px;
}
.faq-a p {
margin: 0;
}
.sss-no-results {
text-align: center;
padding: 48px 20px;
background: var(--bg-soft);
border-radius: var(--r-md);
border: 1px dashed var(--line);
}
.no-res-box .no-res-ic {
font-size: 40px;
display: block;
margin-bottom: 12px;
}
.no-res-box h4 {
font-size: 18px;
color: var(--navy-deep);
margin-bottom: 6px;
}
.no-res-box p {
color: var(--text-muted);
font-size: 14.5px;
}
.sss-help-card {
margin-top: 56px;
padding: 36px 40px;
background: linear-gradient(135deg, var(--navy-deep) 0%, var(--navy) 100%);
border-radius: var(--r-lg);
color: #fff;
display: flex;
align-items: center;
justify-content: space-between;
gap: 32px;
box-shadow: 0 20px 45px -10px rgba(11, 26, 45, 0.25);
}
.shc-copy h3 {
color: #fff;
font-size: 22px;
margin-bottom: 8px;
}
.shc-copy p {
color: #bcd0e6;
font-size: 15px;
margin: 0;
}
.shc-actions {
display: flex;
gap: 12px;
flex-shrink: 0;
}
@media(max-width: 800px) {
.sss-help-card {
flex-direction: column;
text-align: center;
padding: 32px 24px;
}
.shc-actions {
flex-direction: column;
width: 100%;
}
.shc-actions .btn {
width: 100%;
justify-content: center;
}
}  .entry-content .svge-note {
display: flex !important;
gap: 18px !important;
align-items: center !important;
padding: 22px 26px !important;
margin: 30px 0 !important;
border-radius: var(--r-md, 12px) !important;
border-left: 4px solid var(--navy-deep, #0b1a2d);
background: var(--bg-soft, #f8fafc);
}
.entry-content .svge-note + * {
margin-top: 30px !important;
}
.entry-content .svge-keys br,
.entry-content .svge-note br,
.entry-content .svge-costs br {
display: none !important;
}
.entry-content .svge-note .ni {
width: 46px !important;
height: 46px !important;
min-width: 46px !important;
min-height: 46px !important;
flex: 0 0 46px !important;
border-radius: 12px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
background: #ffffff !important;
color: var(--navy-deep, #0b1a2d) !important;
box-shadow: 0 4px 12px rgba(11, 26, 45, 0.08) !important;
}
.entry-content .svge-note .ni svg {
width: 22px !important;
height: 22px !important;
display: block !important;
stroke: currentColor !important;
fill: none !important;
stroke-width: 2.2 !important;
margin: 0 !important;
padding: 0 !important;
}
.entry-content .svge-note .nb {
min-width: 0 !important;
flex: 1 1 auto !important;
}
.entry-content .svge-note h4 {
margin: 0 0 6px !important;
font-size: 16.5px !important;
color: var(--navy-deep, #0b1a2d) !important;
font-weight: 800 !important;
line-height: 1.3 !important;
}
.entry-content .svge-note p {
margin: 0 !important;
padding: 0 !important;
font-size: 15px !important;
line-height: 1.65 !important;
color: #475569 !important;
}
.entry-content .svge-note p + p {
margin-top: 8px !important;
} .entry-content .svge-note.is-warn {
border-left: 4px solid #ff6b2b !important;
background: rgba(255, 107, 43, 0.09) !important;
}
.entry-content .svge-note.is-warn .ni {
color: #ff6b2b !important;
}
.entry-content .svge-note.is-warn .ni svg {
stroke: #ff6b2b !important;
color: #ff6b2b !important;
}
.entry-content .svge-note.is-warn .ni:empty::before {
content: "";
width: 22px;
height: 22px;
display: block;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10Z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10Z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E") no-repeat center / contain;
} .entry-content .svge-note.is-good {
border-left: 4px solid #0284c7 !important;
background: rgba(2, 132, 199, 0.09) !important;
}
.entry-content .svge-note.is-good .ni {
color: #0284c7 !important;
}
.entry-content .svge-note.is-good .ni svg {
stroke: #0284c7 !important;
color: #0284c7 !important;
}
.entry-content .svge-note.is-good .ni:empty::before {
content: "";
width: 22px;
height: 22px;
display: block;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='9' r='6'/%3E%3Cpath d='m8.2 14.3-1.4 7L12 18l5.2 3.3-1.4-7'/%3E%3C/svg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='9' r='6'/%3E%3Cpath d='m8.2 14.3-1.4 7L12 18l5.2 3.3-1.4-7'/%3E%3C/svg%3E") no-repeat center / contain;
} .entry-content .svge-note.is-info,
.entry-content .svge-note {
border-left: 4px solid #0b1a2d !important;
background: #f8fafc !important;
}
.entry-content .svge-note.is-info .ni,
.entry-content .svge-note .ni {
color: #0b1a2d !important;
}
.entry-content .svge-note.is-info .ni svg,
.entry-content .svge-note .ni svg {
stroke: #0b1a2d !important;
color: #0b1a2d !important;
}
.entry-content .svge-note.is-info .ni:empty::before,
.entry-content .svge-note .ni:empty::before {
content: "";
width: 22px;
height: 22px;
display: block;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5A2.5 2.5 0 0 1 6.5 17H20'/%3E%3Cpath d='M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2Z'/%3E%3C/svg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5A2.5 2.5 0 0 1 6.5 17H20'/%3E%3Cpath d='M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2Z'/%3E%3C/svg%3E") no-repeat center / contain;
} .entry-content .svge-costs {
margin: 30px 0;
border: 1px solid #e2e8f0;
border-radius: var(--r-md, 12px);
overflow-x: auto;
-webkit-overflow-scrolling: touch;
box-shadow: 0 4px 15px rgba(11, 26, 45, 0.03);
width: 100%;
}
.entry-content .svge-costs table {
width: 100%;
border-collapse: collapse;
margin: 0;
font-size: 15px;
}
.entry-content .svge-costs th,
.entry-content .svge-costs td {
border: none;
border-bottom: 1px solid #e2e8f0;
padding: 14px 20px;
text-align: left;
vertical-align: middle;
}
.entry-content .svge-costs thead th {
background: var(--navy-deep, #0b1a2d);
color: #ffffff;
font-size: 13px;
font-weight: 700;
letter-spacing: .06em;
text-transform: uppercase;
}
.entry-content .svge-costs tbody tr:last-child th,
.entry-content .svge-costs tbody tr:last-child td {
border-bottom: none;
}
.entry-content .svge-costs tbody tr:nth-child(even) {
background: var(--bg-soft, #f8fafc);
}
.entry-content .svge-costs tbody th {
font-weight: 600;
color: var(--navy-deep, #0b1a2d);
background: none;
}
.entry-content .svge-costs td.num {
font-weight: 800;
color: var(--navy-deep, #0b1a2d);
white-space: nowrap;
}
.entry-content .svge-costs caption {
caption-side: bottom;
padding: 12px 20px;
font-size: 13px;
color: #64748b;
text-align: left;
background: var(--bg-soft, #f8fafc);
border-top: 1px solid #e2e8f0;
} .entry-content .svge-post-inline-img {
margin: 36px 0;
border-radius: var(--r-md, 14px);
overflow: hidden;
box-shadow: 0 10px 30px rgba(11, 26, 45, 0.06);
background: var(--bg-soft, #f8fafc);
border: 1px solid #e2e8f0;
}
.entry-content .svge-post-inline-img img {
width: 100%;
max-height: 420px;
object-fit: cover;
display: block;
}
.entry-content .svge-post-inline-img figcaption {
padding: 10px 18px;
font-size: 13.5px;
color: #64748b;
background: #ffffff;
border-top: 1px solid #f1f5f9;
font-style: italic;
text-align: center;
} .entry-content .svge-keys {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 16px;
margin: 30px 0;
padding-left: 0;
}
.entry-content .svge-keys li {
list-style: none;
margin: 0;
}
.entry-content .svge-key {
background: #ffffff;
border: 1px solid #e2e8f0;
border-radius: var(--r-md, 12px);
padding: 20px;
height: 100%;
box-shadow: 0 4px 15px rgba(11, 26, 45, 0.03);
}
.entry-content .svge-key b {
display: block;
font-weight: 800;
font-size: 25px;
color: var(--navy-deep, #0b1a2d);
line-height: 1.1;
letter-spacing: -.02em;
}
.entry-content .svge-key span {
display: block;
margin-top: 6px;
font-size: 13.5px;
color: #64748b;
line-height: 1.5;
}
@media(max-width: 700px) {
.entry-content .svge-keys {
grid-template-columns: 1fr;
}
.entry-content .svge-note {
flex-direction: column;
gap: 12px;
padding: 18px 20px;
}
.entry-content .svge-costs {
overflow-x: auto;
}
.entry-content .svge-costs th,
.entry-content .svge-costs td {
padding: 12px 14px;
}
} .contact-page-sec {
padding: 60px 0 90px;
}
.contact-info-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 24px;
margin-bottom: 50px;
}
.contact-info-card {
background: #ffffff;
border: 1.5px solid #e2e8f0;
border-radius: 18px;
padding: 28px 24px;
display: flex;
flex-direction: column;
gap: 16px;
transition: all .3s cubic-bezier(0.16, 1, 0.3, 1);
box-shadow: 0 4px 20px rgba(11, 26, 45, 0.03);
}
.contact-info-card:hover {
transform: translateY(-4px);
border-color: var(--accent);
box-shadow: 0 12px 30px rgba(255, 107, 43, 0.12);
}
.cic-icon {
width: 48px;
height: 48px;
border-radius: 12px;
background: rgba(255, 107, 43, 0.1);
color: var(--accent);
display: grid;
place-items: center;
font-size: 22px;
flex-shrink: 0;
}
.cic-icon svg {
width: 22px;
height: 22px;
}
.cic-body {
display: flex;
flex-direction: column;
flex: 1;
}
.cic-title {
font-size: 17px;
font-weight: 700;
color: var(--navy-deep);
margin-bottom: 8px;
}
.cic-text {
font-size: 14.5px;
line-height: 1.6;
color: var(--text-muted);
margin-bottom: 12px;
flex: 1;
}
.cic-link {
font-size: 14px;
font-weight: 700;
color: var(--accent);
display: inline-flex;
align-items: center;
gap: 6px;
transition: gap .2s ease, color .2s ease;
margin-top: auto;
}
.cic-link:hover {
color: var(--navy-deep);
gap: 10px;
}
.contact-main-grid {
display: grid;
grid-template-columns: 1.15fr 1fr;
gap: 36px;
align-items: stretch;
}
.contact-form-card {
background: #ffffff;
border: 1.5px solid #e2e8f0;
border-radius: 20px;
padding: 40px;
box-shadow: 0 10px 40px rgba(11, 26, 45, 0.05);
}
.cfc-head {
margin-bottom: 28px;
}
.cfc-head h2 {
font-size: 24px;
font-weight: 800;
color: var(--navy-deep);
margin-bottom: 8px;
}
.cfc-head p {
color: var(--text-muted);
font-size: 15px;
line-height: 1.6;
margin: 0;
}
.contact-form .form-row-2 {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
}
.contact-form .form-group {
margin-bottom: 18px;
display: flex;
flex-direction: column;
gap: 6px;
}
.contact-form label {
font-size: 13.5px;
font-weight: 700;
color: var(--navy);
}
.contact-form input[type="text"],
.contact-form input[type="tel"],
.contact-form input[type="email"],
.contact-form select,
.contact-form textarea {
width: 100%;
padding: 13px 16px;
font-size: 15px;
border: 1.5px solid #e2e8f0;
border-radius: 10px;
background: #f8fafc;
color: var(--navy-deep);
transition: all .2s ease;
font-family: inherit;
}
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
outline: none;
background: #ffffff;
border-color: var(--accent);
box-shadow: 0 0 0 3px rgba(255, 107, 43, 0.15);
}
.contact-form .btn-block {
width: 100%;
padding: 15px;
font-size: 16px;
font-weight: 700;
justify-content: center;
margin-top: 10px;
}
.form-privacy-note {
font-size: 12.5px;
color: #94a3b8;
text-align: center;
margin-top: 14px;
margin-bottom: 0;
}
.contact-side-col {
display: flex;
flex-direction: column;
height: 100%;
}
.contact-map-wrapper {
background: #ffffff;
border: 1.5px solid #e2e8f0;
border-radius: 20px;
overflow: hidden;
box-shadow: 0 10px 40px rgba(11, 26, 45, 0.05);
display: flex;
flex-direction: column;
height: 100%;
min-height: 540px;
}
.cmw-head {
padding: 20px 24px;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #e2e8f0;
flex: none;
}
.cmw-head h3 {
font-size: 17px;
font-weight: 700;
color: var(--navy-deep);
margin: 0;
}
.cmw-head .btn-text-sm {
font-size: 13.5px;
font-weight: 700;
color: var(--accent);
display: inline-flex;
align-items: center;
gap: 4px;
}
.map-container {
position: relative;
width: 100%;
flex: 1;
min-height: 460px;
background: #f1f5f9;
}
.map-container iframe {
width: 100% !important;
height: 100% !important;
min-height: 100%;
border: 0;
display: block;
}
.contact-wa-card {
background: linear-gradient(135deg, #0b1a2d 0%, #152942 100%);
border-radius: 20px;
padding: 28px 30px;
color: #ffffff;
display: flex;
gap: 20px;
align-items: flex-start;
box-shadow: 0 10px 30px rgba(11, 26, 45, 0.15);
}
.cwc-icon {
width: 48px;
height: 48px;
border-radius: 12px;
background: #25d366;
color: #ffffff;
display: grid;
place-items: center;
font-size: 24px;
flex-shrink: 0;
}
.cwc-icon svg {
width: 24px;
height: 24px;
}
.cwc-body h4 {
font-size: 18px;
font-weight: 700;
color: #ffffff;
margin-bottom: 6px;
}
.cwc-body p {
font-size: 14px;
color: #94a3b8;
line-height: 1.5;
margin-bottom: 16px;
}
.btn-wa {
background: #25d366;
color: #ffffff;
font-weight: 700;
font-size: 14.5px;
padding: 10px 20px;
border-radius: 999px;
display: inline-flex;
align-items: center;
gap: 8px;
transition: all .25s ease;
}
.btn-wa:hover {
background: #1ebc59;
color: #ffffff;
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(37, 211, 102, 0.4);
}
@media(max-width: 1024px) {
.contact-info-grid {
grid-template-columns: repeat(2, 1fr);
}
.contact-main-grid {
grid-template-columns: 1fr;
}
.srv-detail-grid {
grid-template-columns: 1fr;
gap: 32px;
}
.srv-sidebar {
position: static;
}
.srv-main-card {
padding: 32px 24px;
}
}
@media(max-width: 600px) {
.contact-info-grid {
grid-template-columns: 1fr;
}
.contact-form .form-row-2 {
grid-template-columns: 1fr;
}
.contact-form-card {
padding: 24px 18px;
}
} .svge-reveal {
opacity: 0;
transform: translateY(28px);
transition: opacity .7s cubic-bezier(0.16, 1, 0.3, 1), transform .7s cubic-bezier(0.16, 1, 0.3, 1);
will-change: opacity, transform;
}
.svge-reveal.is-revealed {
opacity: 1;
transform: translateY(0);
} .page-hero-bg img,
.hero-bg img {
transition: transform 0.08s ease-out;
will-change: transform;
} .srv,
.country-card,
.post-card,
.about-feature-card,
.about-team-card,
.quick-card,
.step {
transition: transform .35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .35s cubic-bezier(0.16, 1, 0.3, 1), border-color .25s ease !important;
}
.srv:hover,
.country-card:hover,
.post-card:hover,
.about-feature-card:hover,
.about-team-card:hover,
.quick-card:hover {
transform: translateY(-6px) !important;
box-shadow: 0 20px 40px -10px rgba(6, 28, 54, 0.14) !important;
} .srv-more .svgi,
.post-more .svgi,
.btn .svgi:last-child {
transition: transform .25s cubic-bezier(0.16, 1, 0.3, 1);
}
.srv:hover .srv-more .svgi,
.post-card:hover .post-more .svgi,
.btn:hover .svgi:last-child {
transform: translateX(4px);
}
@media(prefers-reduced-motion:reduce) {
*,
*::before,
*::after {
animation-duration: .01ms !important;
animation-iteration-count: 1 !important;
transition-duration: .01ms !important;
}
html {
scroll-behavior: auto;
}
} .hc-consent {
display: flex;
flex-direction: column;
gap: 10px;
margin: 12px 0 16px;
text-align: left;
}
.hc-check {
display: flex;
align-items: flex-start;
gap: 10px;
cursor: pointer;
user-select: none;
}
.hc-check input[type="checkbox"] {
width: 18px;
height: 18px;
margin: 2px 0 0;
accent-color: var(--accent);
cursor: pointer;
flex: none;
}
.hc-check input[type="checkbox"]:focus-visible {
outline: 2px solid var(--accent);
outline-offset: 2px;
}
.hc-check span {
font-size: 13px;
line-height: 1.55;
color: var(--body);
}
.hc-check a,
.hc-check .svge-legal-link {
color: var(--accent) !important;
text-decoration: underline !important;
font-weight: 700;
cursor: pointer;
position: relative;
z-index: 2;
transition: opacity 0.15s ease;
}
.hc-check a:hover,
.hc-check .svge-legal-link:hover {
opacity: 0.8;
color: var(--accent-dark) !important;
} .page-body-sec {
padding: 60px 0 80px;
margin-top: 0;
}
.page-card {
background: #ffffff;
border-radius: var(--r-xl);
border: 1px solid var(--line);
box-shadow: var(--shadow-sm);
padding: 48px;
max-width: 1080px;
margin: 0 auto;
}
.page-card .entry-content > *:first-child {
margin-top: 0;
}
.page-card .entry-content h2 {
font-size: 24px;
font-weight: 800;
color: var(--navy-deep);
margin-top: 38px;
margin-bottom: 18px;
padding-bottom: 10px;
border-bottom: 1px solid var(--line);
position: relative;
}
.page-card .entry-content h2::after {
content: '';
position: absolute;
bottom: -1px;
left: 0;
width: 44px;
height: 2px;
background: var(--accent);
}
.page-card .entry-content p {
font-size: 15.5px;
line-height: 1.75;
color: var(--body);
margin-bottom: 20px;
}
.page-card .svge-costs {
margin: 20px 0 26px;
overflow-x: auto;
}
.page-card .svge-costs table {
width: 100%;
border-collapse: separate;
border-spacing: 0;
border: 1px solid var(--line);
border-radius: 12px;
overflow: hidden;
font-size: 14.5px;
}
.page-card .svge-costs th,
.page-card .svge-costs td {
padding: 14px 18px;
border-bottom: 1px solid var(--line);
line-height: 1.6;
}
.page-card .svge-costs tr:last-child th,
.page-card .svge-costs tr:last-child td {
border-bottom: none;
}
.page-card .svge-costs th {
background: #f8fafc;
color: var(--navy-deep);
font-weight: 700;
text-align: left;
width: 220px;
border-right: 1px solid var(--line);
}
.page-card .svge-costs td {
background: #ffffff;
color: var(--ink);
}
.page-card .svge-costs thead th {
background: var(--navy);
color: #ffffff;
border-right: 1px solid rgba(255, 255, 255, 0.1);
font-size: 14px;
}
.page-card .svge-costs thead th:last-child {
border-right: none;
}
.page-card .svge-costs caption {
caption-side: bottom;
font-size: 13px;
color: var(--body);
margin-top: 10px;
font-style: italic;
text-align: left;
}
.page-card .check-list {
list-style: none;
padding: 0;
margin: 20px 0 26px;
display: grid;
gap: 12px;
}
.page-card .check-list li {
display: flex;
align-items: flex-start;
gap: 12px;
font-size: 15px;
line-height: 1.6;
color: var(--ink);
background: #f8fafc;
border: 1px solid var(--line);
border-radius: 10px;
padding: 12px 16px;
}
.page-card .check-list .ck {
width: 24px;
height: 24px;
border-radius: 6px;
background: rgba(22, 163, 74, 0.12);
color: #16a34a;
display: grid;
place-items: center;
flex: none;
margin-top: 1px;
}
@media(max-width: 768px) {
.page-body-sec {
margin-top: -35px;
}
.page-card {
padding: 30px 20px;
border-radius: 16px;
}
.page-card .svge-costs th {
width: auto;
}
}   .btn .btn-roll{
position:relative; display:inline;
}
.btn .btn-roll i{
display:inline; font-style:normal;
transform:none !important; transition:none !important;
}
.btn .btn-roll i[aria-hidden="true"]{ display:none !important; }
.btn:hover .btn-roll i{ transform:none !important; } .btn .btn-ico{
position:relative; width:18px; height:18px; overflow:hidden;
display:inline-flex; flex:none;
}
.btn .btn-ico .svgi{
position:absolute; inset:0; font-size:17px;
transition:transform .34s cubic-bezier(.4,0,.2,1), opacity .2s;
}
.btn .btn-ico .svgi:last-child{ transform:translateX(-140%); opacity:0; }
.btn:hover .btn-ico .svgi:first-child{ transform:translateX(140%); opacity:0; }
.btn:hover .btn-ico .svgi:last-child{ transform:translateX(0); opacity:1; } .btn{ position:relative; overflow:hidden; isolation:isolate; }
.btn::before{
content:""; position:absolute; inset:0 auto 0 -160%; width:160%;
left: -160%;
transform:skewX(-20deg); z-index:-1; pointer-events:none;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.36),transparent);
transition:left .55s cubic-bezier(.4,0,.2,1);
}
.btn:hover::before{
left: 160%;
} [data-anim]{
opacity:0; will-change:transform,opacity;
transition:opacity .7s cubic-bezier(.22,1,.36,1),
transform .7s cubic-bezier(.22,1,.36,1),
clip-path .8s cubic-bezier(.22,1,.36,1);
transition-delay:var(--d,0s);
}
[data-anim="up"]     { transform:translateY(34px); }
[data-anim="down"]   { transform:translateY(-28px); }
[data-anim="left"]   { transform:translateX(-34px); }
[data-anim="right"]  { transform:translateX(34px); }
[data-anim="zoom"]   { transform:scale(.94); }
[data-anim="reveal"] { clip-path:inset(0 100% 0 0); opacity:1; transform:translateX(2%); }
[data-anim].is-in{
opacity:1; transform:none; clip-path:none;
} html:not(.svge-js) [data-anim]{
opacity:1 !important; transform:none !important;
clip-path:none !important; transition:none !important;
}
@media (prefers-reduced-motion:reduce){
[data-anim]{ opacity:1 !important; transform:none !important;
clip-path:none !important; transition:none !important; }
.btn:hover::before{ animation:none; }
.btn .btn-roll i, .btn .btn-ico .svgi{ transition:none; }
}    .ft-col ul a{
display:inline-flex; align-items:center; gap:8px;
transition:color .25s, gap .25s;
}
.ft-col ul a .svgi{
opacity:.45; transition:transform .28s cubic-bezier(.4,0,.2,1), opacity .25s;
}
.ft-col ul a:hover{ color:#fff; gap:12px; }
.ft-col ul a:hover .svgi{ transform:translateX(3px); opacity:1; } .sec-head .sec-eyebrow{ position:relative; display:inline-flex; align-items:center; gap:10px; }
.sec-head .sec-eyebrow::after{
content:""; width:0; height:2px; background:var(--accent);
transition:width .6s cubic-bezier(.22,1,.36,1) .15s;
}
.sec-head.is-in .sec-eyebrow::after{ width:38px; }  .tw{
display:inline-block; overflow:hidden; vertical-align:bottom;
padding-bottom:.14em; margin-bottom:-.14em; }
.tw > i{
display:inline-block; font-style:normal;
transform:translateY(115%);
transition:transform .72s cubic-bezier(.22,1,.36,1);
transition-delay:var(--wd,0s);
}
[data-split].is-in .tw > i{ transform:translateY(0); }
html:not(.svge-js) .tw > i{ transform:none; }  .odo *{
font-family:inherit !important; font-size:inherit !important;
font-weight:inherit !important; letter-spacing:inherit !important;
color:inherit !important; text-transform:none !important;
margin:0 !important; padding:0 !important;
border:0 !important; background:none !important;
opacity:1 !important; visibility:visible !important;
text-align:inherit !important;
}
.odo{ display:inline-flex; align-items:flex-end; line-height:1; }
.odo .odo-d{
display:inline-block !important; overflow:hidden !important;
height:1em; line-height:1em !important;
}
.odo .odo-d > b{
display:block !important; height:auto;
transform:translateY(0);
transition:transform 1.5s cubic-bezier(.22,1,.36,1);
transition-delay:var(--dd,0s);
}
.odo .odo-d > b > span{ display:block !important; height:1em; line-height:1em !important; }
.odo .odo-s{ display:inline-block !important; line-height:1em !important; } .svge-marquee{
overflow:hidden; background:var(--navy); color:#fff;
padding:16px 0; position:relative;
}
.svge-marquee .mq-track{
display:flex; width:max-content; align-items:center;
animation:svge-mq 34s linear infinite;
}
.svge-marquee:hover .mq-track{ animation-play-state:paused; }
.svge-marquee .mq-item{
display:inline-flex; align-items:center; gap:16px;
padding:0 26px; white-space:nowrap;
font-family:var(--head); font-weight:800; font-size:17px;
letter-spacing:-.01em;
}
.svge-marquee .mq-item .svgi{ font-size:15px; color:var(--accent); }
.svge-marquee.is-accent{ background:var(--accent); }
.svge-marquee.is-accent .mq-item .svgi{ color:#fff; opacity:.65; }
.svge-marquee.is-outline .mq-item{
color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.45);
}
@keyframes svge-mq{ to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){
.svge-marquee .mq-track{ animation:none; }
.tw > i{ transform:none !important; transition:none; }
.odo .odo-d > b{ transition:none; }
}   .btn.fx-fill{ position:relative; z-index:1; overflow:hidden; }
.btn.fx-fill::before,
.btn.fx-fill::after{
content:""; position:absolute; top:0; bottom:0; width:20%; z-index:-1;
background:var(--accent); opacity:0;
transition:width .5s ease-in-out, opacity .5s ease-in-out;
}
.btn.fx-fill::before{ left:0; }
.btn.fx-fill::after{ right:0; }
.btn.fx-fill:hover::before,
.btn.fx-fill:hover::after{ width:100%; opacity:1; }
.btn.fx-fill:hover{ color:#fff; }
.btn.fx-fill:hover::before{ animation:none; } .srv.v-c{ z-index:1; overflow:hidden; }
.srv.v-c::after{ display:none; }
.srv.v-c::before{
content:""; position:absolute; z-index:-1;
top:0; right:100%; width:0; height:100%;
background:var(--accent);
transition:right .45s cubic-bezier(.4,0,.2,1), width .45s cubic-bezier(.4,0,.2,1);
}
.srv.v-c:hover{ border-color:transparent; transform:none; box-shadow:var(--shadow-lg); }
.srv.v-c:hover::before{ right:0; width:100%; }
.srv.v-c .srv-ic{ transition:background .4s, color .4s; }
.srv.v-c:hover .srv-ic{ background:#fff; color:var(--accent); transform:none; }
.srv.v-c h3 a,
.srv.v-c p,
.srv.v-c .srv-more{ transition:color .4s; }
.srv.v-c:hover h3 a,
.srv.v-c:hover p,
.srv.v-c:hover .srv-more{ color:#fff; } .fx-img{ position:relative; overflow:hidden; border-radius:var(--r-md); }
.fx-img img{
display:block; width:100%; height:100%; object-fit:cover;
transition:transform .55s cubic-bezier(.22,1,.36,1), filter .45s;
}
.fx-img:hover img{ transform:scale(1.08); filter:brightness(78%); } .fx-img .fx-play{
position:absolute; top:18px; right:18px; z-index:2;
width:54px; height:54px; border-radius:50%;
display:grid; place-items:center;
background:var(--accent); color:#fff; font-size:18px;
opacity:0; transform:scale(.6);
transition:opacity .4s, transform .4s cubic-bezier(.34,1.56,.64,1);
}
.fx-img:hover .fx-play{ opacity:1; transform:scale(1); } .fx-play.fx-ripple::before,
.fx-play.fx-ripple::after{
content:""; position:absolute; inset:0; border-radius:50%;
border:2px solid var(--accent);
animation:svge-ripple 2.4s ease-in-out infinite;
}
.fx-play.fx-ripple::after{ animation-delay:1.2s; }
@keyframes svge-ripple{
0%  { transform:scale(1);   opacity:0; }
30% { opacity:.85; }
100%{ transform:scale(2.1); opacity:0; }
} .fx-line{
position:relative; height:1px; width:90px; margin:14px auto 18px;
background:var(--line);
}
.fx-line::before{
content:""; position:absolute; top:0; left:50%; width:0; height:1px;
background:var(--accent);
transition:left .55s cubic-bezier(.22,1,.36,1), width .55s cubic-bezier(.22,1,.36,1);
}
.fx-line.is-in::before,
:hover > .fx-line::before,
.srv:hover .fx-line::before{ left:0; width:100%; } .fx-shape{
position:absolute; z-index:0; pointer-events:none;
opacity:.5;
}
.fx-bob   { animation:svge-bob 3.4s ease-in-out infinite; }
.fx-bob-2 { animation:svge-bob 4.6s ease-in-out infinite .6s; }
.fx-drift { animation:svge-drift 26s linear infinite; }
@keyframes svge-bob{
0%,100%{ transform:translateY(-14px); }
50%    { transform:translateY(10px); }
}
@keyframes svge-drift{
0%  { transform:translate(0,0) rotate(0deg); }
50% { transform:translate(26px,-18px) rotate(180deg); }
100%{ transform:translate(0,0) rotate(360deg); }
} .svge-totop .fx-ring{
position:absolute; inset:0; pointer-events:none;
transform:rotate(-90deg);
width:100%; height:100%;
}
.svge-totop .fx-ring circle{
fill:none; stroke:var(--accent); stroke-width:3;
stroke-linecap:round;
stroke-dasharray:var(--len,132);
stroke-dashoffset:var(--off,132);
transition:stroke-dashoffset .12s linear;
} .main-nav .submenu{
opacity:0; visibility:hidden;
transform:translateY(14px);
transition:opacity .3s cubic-bezier(.22,1,.36,1),
transform .3s cubic-bezier(.22,1,.36,1),
visibility .3s;
}
.main-nav li:hover > .submenu,
.main-nav li:focus-within > .submenu{
opacity:1; visibility:visible; transform:translateY(0);
}
.main-nav .submenu li{
opacity:0; transform:translateX(-8px);
transition:opacity .3s, transform .3s;
}
.main-nav li:hover > .submenu li,
.main-nav li:focus-within > .submenu li{ opacity:1; transform:none; }
.main-nav .submenu li:nth-child(1){ transition-delay:.04s; }
.main-nav .submenu li:nth-child(2){ transition-delay:.08s; }
.main-nav .submenu li:nth-child(3){ transition-delay:.12s; }
.main-nav .submenu li:nth-child(4){ transition-delay:.16s; }
.main-nav .submenu li:nth-child(5){ transition-delay:.20s; }
@media (prefers-reduced-motion:reduce){
.fx-bob,.fx-bob-2,.fx-drift,.fx-play.fx-ripple::before,.fx-play.fx-ripple::after{ animation:none; }
}  .srv.v-b{
text-align:center; z-index:1; overflow:hidden;
transition:border-color .4s;
}
.srv.v-b::after{ display:none; } .srv.v-b::before{
content:""; position:absolute; z-index:-1;
top:0; left:50%; width:0; height:100%;
background:var(--navy);
transition:left .45s cubic-bezier(.4,0,.2,1), width .45s cubic-bezier(.4,0,.2,1);
}
.srv.v-b:hover{ border-color:transparent; transform:none; box-shadow:var(--shadow-lg); }
.srv.v-b:hover::before{ left:0; width:100%; }
.srv.v-b .srv-ic{
margin:0 auto 22px; border-radius:50%;
background:var(--bg-soft); color:var(--navy);
border:1px solid var(--line);
transition:background .4s, color .4s, border-color .4s;
}
.srv.v-b:hover .srv-ic{
background:transparent; border-color:var(--accent); color:#fff;
transform:none;
}
.srv.v-b .srv-line{
position:relative; height:1px; width:90px; margin:0 auto 18px;
background:var(--line);
}
.srv.v-b .srv-line::before{
content:""; position:absolute; top:0; left:50%; width:0; height:1px;
background:var(--accent); transition:width .45s cubic-bezier(.4,0,.2,1), left .45s cubic-bezier(.4,0,.2,1);
}
.srv.v-b:hover .srv-line::before{ left:0; width:100%; }
.srv.v-b h3 a{ transition:color .4s; }
.srv.v-b:hover h3 a{ color:#fff; }
.srv.v-b p{ transition:color .4s; }
.srv.v-b:hover p{ color:#b8cbe0; }
.srv.v-b .srv-more{ margin-left:auto; margin-right:auto; }
.srv.v-b:hover .srv-more{ color:var(--accent); } .alert {
display: flex;
align-items: flex-start;
gap: 14px;
padding: 16px 20px;
border-radius: 14px;
margin-bottom: 24px;
font-size: 14.5px;
line-height: 1.5;
transition: opacity 0.6s ease, transform 0.6s ease, max-height 0.6s ease, margin 0.6s ease, padding 0.6s ease;
}
.alert-success {
background: #ecfdf5 !important;
border: 1.5px solid #6ee7b7 !important;
color: #065f46 !important;
box-shadow: 0 4px 16px rgba(16, 185, 129, 0.12) !important;
}
.alert-success .alert-ic {
display: flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
background: #10b981;
color: #fff;
border-radius: 50%;
flex-shrink: 0;
margin-top: 1px;
}
.alert-success .alert-ic .svgi {
width: 16px;
height: 16px;
stroke: #ffffff;
stroke-width: 2.5;
}
.alert-success strong {
display: block;
font-size: 15.5px;
font-weight: 700;
color: #064e3b !important;
margin-bottom: 3px;
}
.alert-success p {
margin: 0;
color: #047857 !important;
font-size: 14px;
}
.alert.alert-fade-out {
opacity: 0 !important;
transform: translateY(-10px) !important;
max-height: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
margin-bottom: 0 !important;
overflow: hidden !important;
} .site-footer {
background-color: var(--navy-deep, #061c36);
color: #cbd5e1;
position: relative;
overflow: hidden;
padding: 80px 0 0;
border-top: 1px solid rgba(255, 255, 255, 0.10); background-image: radial-gradient(ellipse 70% 45% at 20% 100%, rgba(255, 107, 44, 0.15) 0%, rgba(255, 107, 44, 0.05) 45%, transparent 75%), radial-gradient(ellipse 75% 55% at 85% 90%, rgba(0, 168, 200, 0.22) 0%, rgba(18, 58, 102, 0.20) 50%, transparent 80%), linear-gradient(180deg, #0a2a4e 0%, #061c36 100%);
}
.site-footer::before {
content: '';
position: absolute;
top: 0; left: 0; right: 0; height: 1.5px;
background: linear-gradient(90deg, transparent, #00a8c8, #ff6b2c, #00a8c8, transparent);
box-shadow: 0 0 16px rgba(0, 168, 200, 0.35);
z-index: 5;
} .footer-planet-arc {
position: absolute;
right: -100px;
bottom: -110px;
width: 940px;
height: 580px;
max-width: 62vw;
background-image: url(//svgegitim.com/wp-content/themes/svgegitim/assets/img/globe-arc.jpg);
background-size: cover;
background-position: right bottom;
mix-blend-mode: screen;
opacity: 0.35;
pointer-events: none;
z-index: 1;
filter: contrast(1.15) brightness(1.15);
mask-image: radial-gradient(ellipse at 85% 85%, black 45%, transparent 82%);
-webkit-mask-image: radial-gradient(ellipse at 85% 85%, black 45%, transparent 82%);
transition: all 0.5s ease;
}
.site-footer .wrap {
position: relative;
z-index: 3;
}
.site-footer .ft-grid {
display: grid;
grid-template-columns: 1.4fr 1fr 1fr 1.35fr;
gap: 48px;
margin-bottom: 50px;
} .site-footer .brand-logo img {
max-height: 68px;
width: auto;
display: block;
}
.site-footer .ft-brand {
display: flex;
flex-direction: column;
gap: 16px;
}
.site-footer .ft-about {
font-size: 14px;
line-height: 1.7;
color: #94a3b8;
max-width: 320px;
}
.site-footer .ft-social {
display: flex;
gap: 10px;
margin-top: 6px;
}
.site-footer .ft-social a {
width: 38px;
height: 38px;
border-radius: 10px;
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.14);
display: flex;
align-items: center;
justify-content: center;
color: #cbd5e1;
font-size: 14px;
transition: all 0.25s ease;
}
.site-footer .ft-social a:hover {
background: var(--accent, #ff6b2c);
border-color: var(--accent, #ff6b2c);
color: #fff;
transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(255, 107, 44, 0.35);
} .site-footer .ft-col h5 {
font-family: var(--font-heading, 'Outfit', sans-serif);
font-size: 16px;
font-weight: 700;
color: #fff;
margin-bottom: 22px;
position: relative;
padding-bottom: 10px;
}
.site-footer .ft-col h5::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 28px;
height: 2px;
background: var(--accent, #ff6b2c);
border-radius: 2px;
}
.site-footer .ft-col ul {
list-style: none;
padding: 0;
margin: 0;
}
.site-footer .ft-col ul li {
margin-bottom: 12px;
}
.site-footer .ft-col ul li a {
color: #94a3b8;
text-decoration: none;
font-size: 14px;
transition: all 0.2s ease;
display: inline-flex;
align-items: center;
gap: 6px;
}
.site-footer .ft-col ul li a:hover {
color: #fff;
transform: translateX(4px);
}
.site-footer .ft-col ul li a svg,
.site-footer .ft-col ul li a .icon {
color: var(--accent, #ff6b2c);
width: 14px;
height: 14px;
} .site-footer .ft-contact {
list-style: none;
padding: 0;
margin: 0 0 24px;
}
.site-footer .ft-contact li {
display: flex;
align-items: flex-start;
gap: 12px;
margin-bottom: 16px;
font-size: 13.5px;
line-height: 1.5;
}
.site-footer .ft-contact .fi {
width: 34px;
height: 34px;
border-radius: 8px;
background: rgba(255, 107, 44, 0.12);
border: 1px solid rgba(255, 107, 44, 0.25);
color: var(--accent, #ff6b2c);
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
flex-shrink: 0;
}
.site-footer .ft-contact .fi svg {
width: 16px;
height: 16px;
}
.site-footer .ft-contact b {
display: block;
color: #fff;
font-weight: 600;
margin-bottom: 2px;
}
.site-footer .ft-contact span,
.site-footer .ft-contact div {
color: #cbd5e1;
}
.site-footer .ft-contact a {
color: #cbd5e1;
text-decoration: none;
}
.site-footer .ft-contact a:hover {
color: #38bdf8;
} .site-footer .newsletter {
position: relative;
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.14);
border-radius: 12px;
padding: 4px;
display: flex;
max-width: 340px;
}
.site-footer .newsletter input {
background: transparent;
border: none;
padding: 10px 14px;
color: #fff;
font-size: 13px;
flex: 1;
outline: none;
font-family: inherit;
}
.site-footer .newsletter input::placeholder {
color: #94a3b8;
}
.site-footer .newsletter button {
background: linear-gradient(135deg, #ff6b2c, #ff8c42);
border: none;
color: #fff;
padding: 10px 16px;
border-radius: 8px;
font-weight: 700;
font-size: 13px;
cursor: pointer;
transition: all 0.2s ease;
}
.site-footer .newsletter button:hover {
background: linear-gradient(135deg, #f05a18, #ff7a2f);
transform: scale(1.02);
} .site-footer .ft-badges-wrap {
border-top: 1px solid rgba(255, 255, 255, 0.10);
border-bottom: 1px solid rgba(255, 255, 255, 0.10);
padding: 22px 0;
margin-bottom: 24px;
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 20px;
}
.site-footer .ft-badges-title {
display: flex;
align-items: center;
gap: 10px;
font-size: 15px;
font-weight: 600;
color: #cbd5e1;
}
.site-footer .ft-badges-check {
color: #22c55e;
font-size: 19px;
font-weight: 800;
}
.site-footer .ft-badges-list {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 16px;
}
.site-footer .ft-badge-card {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 16px;
padding: 12px 20px;
height: 90px;
min-width: 100px;
display: inline-flex;
align-items: center;
justify-content: center;
text-decoration: none;
transition: all 0.25s ease;
}
.site-footer .ft-badge-card:hover {
background: rgba(255, 255, 255, 0.12);
border-color: rgba(255, 255, 255, 0.30);
transform: translateY(-3px);
}
.site-footer .ft-badge-card img {
height: 68px;
width: auto;
max-width: 130px;
object-fit: contain;
display: block;
} .site-footer .ft-bottom {
border-top: none !important;
padding-top: 0 !important;
padding-bottom: 40px;
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 16px;
font-size: 13px;
color: #94a3b8;
}
.site-footer .fb-links {
display: flex;
gap: 20px;
list-style: none;
padding: 0;
margin: 0;
}
.site-footer .fb-links a {
color: #94a3b8;
text-decoration: none;
transition: color 0.2s ease;
}
.site-footer .fb-links a:hover {
color: #fff;
}
@media (max-width: 991px) {
.site-footer .ft-grid {
grid-template-columns: 1fr 1fr;
gap: 36px;
}
.site-footer .footer-planet-arc {
opacity: 0.28;
right: -160px;
}
.site-footer .ft-badges-wrap {
flex-direction: column;
align-items: stretch;
gap: 16px;
}
.site-footer .ft-badges-list {
width: 100%;
justify-content: flex-start;
}
}
@media (max-width: 600px) {
.site-footer .ft-grid {
grid-template-columns: 1fr;
}
.site-footer .footer-planet-arc {
display: none;
}
.site-footer .ft-badges-wrap {
padding: 18px 0;
margin-bottom: 20px;
gap: 14px;
}
.site-footer .ft-badges-title {
font-size: 14px;
line-height: 1.4;
}
.site-footer .ft-badges-list {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 10px;
width: 100%;
}
.site-footer .ft-badge-card {
height: 74px;
min-width: 0;
padding: 8px 12px;
border-radius: 12px;
width: 100%;
box-sizing: border-box;
}
.site-footer .ft-badge-card img {
height: 52px;
width: auto;
max-width: 100%;
object-fit: contain;
}
.site-footer .ft-bottom {
flex-direction: column;
text-align: center;
}
.site-footer .fb-links {
justify-content: center;
flex-wrap: wrap;
}
} html {
scrollbar-width: thin;
scrollbar-color: #ff6b2c #061c36;
}
::-webkit-scrollbar {
width: 10px;
height: 10px;
}
::-webkit-scrollbar-track {
background: #061c36;
border-left: 1px solid rgba(255, 255, 255, 0.06);
}
::-webkit-scrollbar-thumb {
background: linear-gradient(180deg, #ff6b2c 0%, #ff8c42 50%, #00a8c8 100%);
border-radius: 20px;
border: 2px solid #061c36;
box-shadow: inset 0 0 4px rgba(255, 255, 255, 0.3);
transition: all 0.3s ease;
}
::-webkit-scrollbar-thumb:hover {
background: linear-gradient(180deg, #ff8548 0%, #ffa366 50%, #38bdf8 100%);
box-shadow: 0 0 12px rgba(255, 107, 44, 0.5);
}
::-webkit-scrollbar-thumb:active {
background: linear-gradient(180deg, #e85618 0%, #ff6b2c 50%, #008ba5 100%);
}