:root {
	--bg:#171819;
	--bg2:#171819;
	--bg3:#171819;
	--text:#f3f5f3;
	--muted:#b9c4c1;
	--line:rgba(255,255,255,.22);
	--soft:rgba(255,255,255,.08);
	--max:1200px;
}
* {
	box-sizing:border-box
}
html {
	scroll-behavior:smooth
}
body {
	margin:0;
	background:var(--bg);
	color:var(--text);
	font-family:Arial,Helvetica,sans-serif;
	overflow-x:hidden
}
a {
	color:inherit;
	text-decoration:none
}
img {
	display:block;
	max-width:100%
}
button,input {
	font:inherit
}
.shell {
	width:min(var(--max),calc(100% - 8vw));
	margin:0 auto;
	position:relative;
	z-index:2
}
.section-dark {
	background:var(--bg);
	position:relative
}
.site-header {
	height:76px;
	background:rgba(23,24,25,.97);
	position:fixed;
	top:0;
	left:0;
	right:0;
	z-index:50;
	border-bottom: 1px solid rgb(255 255 255 / 7%);
}
.header-inner {
	width:min(1300px,calc(100% - 7vw));
	height:76px;
	margin:0 auto;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:30px
}
.brand {
	width:188px;
	height:54px;
	display:flex;
	align-items:center
}
.brand img {
	width:146px;
	filter:brightness(1.35) contrast(1.05)
}
.main-nav {
	display:flex;
	align-items:center;
	gap:42px;
	font-size:14px;
	font-weight:600;
	letter-spacing:.01em
}
.main-nav a {
	position:relative;
	opacity:.96;
	white-space:nowrap
}
.main-nav a:after {
	content:"";
	position:absolute;
	left:0;
	right:100%;
	bottom:-7px;
	height:1px;
	background:#fff;
	transition:.25s
}
.main-nav a:hover:after {
	right:0
}

/* WordPress dynamic-menu current item indicator. */
.main-nav a.current-menu-link:after,
.main-nav .current-menu-ancestor > a:after {
  right:0;
}
.header-actions {
	display:flex;
	align-items:center;
	gap:19px
}
.icon-btn {
	width:26px;
	height:26px;
	padding:0;
	border:0;
	background:transparent;
	color:#fff;
	cursor:pointer
}
.icon-btn svg {
	width:18px;
	height:18px;
	fill:none;
	stroke:currentColor;
	stroke-width:1.4
}
.lang-pill {
	width:78px;
	height:23px;
	background:#efede5;
	border:0;
	border-radius:5px;
	cursor:pointer
}
.menu-toggle {
	display:none;
	background:none;
	border:0;
	width:34px;
	padding:4px;
	cursor:pointer
}
.menu-toggle span {
	display:block;
	height:2px;
	background:#fff;
	margin:5px 0
}
.search-panel {
	display:none;
	position:absolute;
	top:76px;
	left:0;
	right:0;
	background:rgba(23,24,25,.98);
	padding:18px 4vw;
	border-top:1px solid rgba(255,255,255,.07)
}
.search-box {
	max-width:900px;
	margin:auto;
	display:flex
}
.search-box input {
	flex:1;
	padding:13px 16px;
	border:1px solid var(--line);
	border-right:0;
	background:rgba(255,255,255,.04);
	color:#fff;
	outline:0
}
.search-box button {
	border:1px solid #fff;
	background:#fff;
	color:#171819;
	padding:0 24px;
	font-weight:700
}
.hero {
	height:640px;
	margin-top:76px;
	position:relative;
	overflow:hidden;
	background:#171819
}
.hero-swiper {
	position:absolute!important;
	inset:0;
	width:100%;
	height:100%;
	z-index:0;
	overflow:hidden
}
.hero-swiper .swiper-wrapper,.hero-swiper .swiper-slide {
	width:100%;
	height:100%
}
.hero-slide {
	position:relative;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center;
	overflow:hidden
}
.hero-slide::before {
	content:"";
	position:absolute;
	inset:-3%;
	z-index:0;
	pointer-events:none;
	background:inherit;
	background-size:cover;
	background-position:inherit;
	filter:saturate(.72) contrast(.96) brightness(.76);
	transform:scale(1.04);
	will-change:transform
}
.hero-slide {
	background-position:center right
}
.hero-swiper .swiper-slide-active::before {
	animation:heroKenBurns 5s ease-out both
}
@keyframes heroKenBurns {
	from {
	transform:scale(1.09)
}
to {
	transform:scale(1.035)
}
}
.hero-slide-shade {
	position:absolute;
	inset:0;
	z-index:1;
	pointer-events:none;
	background:linear-gradient(90deg,#17181996,rgba(23,24,25,.64) 38%,rgba(23,24,25,.44) 70%,rgba(23,24,25,.54) 100%)
}
.hero-slide-inner {
	height:100%;
	display:flex;
	align-items:center;
	position:relative;
	z-index:2
}
.hero-copy {
	margin-top:-20px;
	max-width:800px;
	opacity:0;
	transform:translate3d(0,26px,0);
	position:relative;
	z-index:4;
	pointer-events:auto
}
.hero h1 {
	font-size:59px;
	line-height:1.01;
	letter-spacing:-1.7px;
	margin:0 0 22px;
	font-weight:800
}
.hero-kicker {
	margin:0 0 4px;
	font-size:17px;
	font-weight:800;
	letter-spacing:.04em
}
.hero-sub {
	margin:0;
	color:#d4ddda;
	font-size:14px;
	letter-spacing:.04em
}
.hero .outline-btn {
	display:inline-flex;
	margin-top:48px;
	padding:16px 24px;
	border:1px solid rgba(255,255,255,.9);
	border-radius:6px;
	font-size:16px;
	font-weight:700;
	transition:background .25s,color .25s,transform .25s;
	position:relative;
	z-index:6;
	pointer-events:auto;
	cursor:pointer
}
.hero .outline-btn:hover {
	background:#fff;
	color:#171819;
	transform:translateY(-2px)
}
.hero-swiper .swiper-slide-active .hero-copy {
	animation:heroCopyIn .78s .18s cubic-bezier(.22,.61,.36,1) both
}
.hero-swiper .swiper-slide-active .hero-kicker {
	animation:heroTextIn .72s .28s both
}
.hero-swiper .swiper-slide-active .hero-sub {
	animation:heroTextIn .72s .38s both
}
.hero-swiper .swiper-slide-active .outline-btn {
	animation:heroTextIn .72s .48s both
}
@keyframes heroCopyIn {
	from {
	opacity:0;
	transform:translate3d(0,28px,0)
}
to {
	opacity:1;
	transform:translate3d(0,0,0)
}
}
@keyframes heroTextIn {
	from {
	opacity:0;
	transform:translate3d(0,16px,0)
}
to {
	opacity:1;
	transform:translate3d(0,0,0)
}
}
.about {
	min-height:610px;
	padding:106px 0 60px;
	overflow:hidden
}
.about-watermark {
	position:absolute;
	left:50%;
	top:85px;
	transform:translateX(-50%);
	width:min(920px,80vw);
	height:350px;
	background:url('../assets/images/about-bg.png') center/cover no-repeat;	
	filter:grayscale(1);
	mask-image:linear-gradient(to bottom,transparent 0,#000 24%,#000 73%,transparent 100%)
}
.section-title {
	font-weight:400;
	letter-spacing:.075em;
	font-size:40px;
	margin:0 0 35px
}
.centered {
	text-align:center
}
.about-text {
	text-align:center;
	color:#d0d8d5;
	font-size:14px;
	line-height:1.9;
	letter-spacing:.075em
}
.about-text p {
	margin:0 0 11px
}
.about-features {
	display:flex;
	justify-content:center;
	gap:41px;
	margin-top:38px
}
.feature {
	text-align:center
}
.feature-icon {
	display:flex;
	width:44px;
	height:44px;
	align-items:center;
	justify-content:center;
	font-size:22px;
	margin:0 auto 9px
}
.feature small {
	font-size:14px;
	letter-spacing:.05em
}
.about-mark {
	max-width: 220px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin: 44px auto 0;
}

.about-mark b,.footer-logo b {
	display:block;
	font-size:16px;
	letter-spacing:.03em
}
.about-mark small,.footer-logo small {
	font-size:14px;
	color:#c5d0cd;
	display:block
}
.service {
	padding:82px 0 100px;
	overflow:hidden
}
.section-heading {
	margin-bottom:58px
}
.section-heading h2 {
	font-size:49px;
	line-height:.9;
	letter-spacing:.07em;
	margin:0;
	font-weight:500
}
.section-heading span {
	display:block;
	font-size:24px;
	letter-spacing:.14em;
	margin-top:7px
}
.service-swiper {
	width:100%;
	padding:0 0 34px;
	overflow:hidden
}
.service-card {
	height:260px;
	position:relative
}
.service-card img {
	width:100%;
	height:230px;
	object-fit:cover;
	filter:saturate(.78) contrast(.98)
}
.service-card em {
	position:absolute;
	left:12px;
	bottom:2px;
	font-size:14px;
	color:#fff;
	letter-spacing:.04em
}
.service-swiper .swiper-button-prev,.service-swiper .swiper-button-next {
	color:#fff!important;
	width:46px!important;
	height:46px!important;
	margin-top:-34px!important;
	z-index:8;
	text-shadow:0 1px 7px rgba(0,0,0,.45)
}
.service-swiper .swiper-button-prev {
	left:15px!important
}
.service-swiper .swiper-button-next {
	right:15px!important
}
.service-swiper .swiper-button-prev:after,.service-swiper .swiper-button-next:after {
	font-size:28px!important;
	font-weight:200!important
}
.service-progress-wrap,.apps-progress-wrap {
	position:relative;
	height:20px;
	margin-top:7px
}
.service-pagination,.applications-pagination {
	position:absolute!important;
	left:0!important;
	right:0!important;
	top:8px!important;
	bottom:auto!important;
	width:100%!important;
	height:1px!important;
	background:rgba(255,255,255,.16)!important
}
.service-pagination .swiper-pagination-progressbar-fill,.applications-pagination .swiper-pagination-progressbar-fill {
	background:#fff!important;
	height:1px!important;
	transform-origin:left center!important
}
.stats {
	height:430px;
	display:flex;
	align-items:center;
	overflow:hidden
}
.stats-bg {
	position:absolute;
	inset:0;
	pointer-events:none;
	background:url('../assets/images/stats-bg.png') center/cover no-repeat;
	filter:saturate(.7)
}
.stats:after {
	content:"";
	position:absolute;
	inset:0;
	background:linear-gradient(to bottom,var(--bg) 0%,rgba(23,24,25,.05) 24%,rgba(23,24,25,.22) 74%,var(--bg) 100%);
	pointer-events:none
}
.stats-panel {
	width:min(1200px,100%);
	margin:auto;
	border:1px solid rgba(255,255,255,.08);
	background:linear-gradient(90deg,rgba(255,255,255,.05),rgba(148,108,83,.23),rgba(255,255,255,.05));
	border-radius:18px;
	padding:50px 0;
	display:grid;
	grid-template-columns:repeat(4,1fr);
	backdrop-filter:blur(5px)
}
.stat {
	text-align:center;
	border-right:1px solid rgba(255,255,255,.12)
}
.stat:last-child {
	border-right:0
}
.stat strong {
	font-size:55px;
	display:block;
	letter-spacing:.015em
}
.stat small {
	font-size:14px;
	color:#d7dedc;
	letter-spacing:.05em
}
.applications {
	padding:100px 0 110px;
	overflow:hidden
}
.applications-title {
	text-align:center;
	font-size:38px;
	letter-spacing:.08em;
	margin:0 0 65px
}
.application-swiper {
	width:100%;
	overflow:hidden
}
.app-card {
	height:315px;
	border-radius:18px;
	overflow:hidden
}
.app-card img {
	width:100%;
	height:100%;
	object-fit:cover;
	filter:saturate(.75) brightness(.82)
}
.apps-progress-wrap {
	margin-top:86px
}
.blog {
	min-height:800px;
	padding:10px 0 90px;
	overflow:hidden
}
.blog-bg {
	position: absolute;
    inset: 150px 0 0;
    pointer-events:none;
    background: url(../assets/images/blog-bg.jpg) center no-repeat;
    background-size: 100% auto;
    filter: saturate(.76);
}
.blog:after {
	content:"";
	position:absolute;
	inset:0;
	background:linear-gradient(to bottom,var(--bg) 0%,rgba(23,24,25,.26) 40%,rgba(23,24,25,.72) 100%);
	pointer-events:none
}
.blog-inner {
	z-index:2
}
.blog-logo {
	margin-bottom:30px
}
.blog-logo img {
	max-width: 200px;
	margin-bottom: 15px;
}
.blog-logo small {
	font-size:31px;
	font-weight:700;
	display:block;
	margin-top:-4px
}
.featured-blog {
	height:410px;
	border:1px solid rgba(255,255,255,.55);
	border-radius:28px;
	display:grid;
	grid-template-columns:1.25fr .9fr;
	gap:30px;
	padding:65px 55px;
	position:relative;
	background:rgba(35,45,42,.34);
	backdrop-filter:blur(2px)
}
.featured-copy h3 {
	font-size:30px;
	line-height:1.05;
	margin:0 0 33px
}
.featured-copy h3 a{
	color:inherit
}
.featured-copy h3 a:hover{
	color:var(--teal,#28b7a5)
}
.featured-image-slide a{
	display:block;
	height:100%
}
.featured-copy p {
	font-size:14px;
	line-height:1.35;
	letter-spacing:.07em;
	color:#d4ddda
}
.featured-image-swiper {
	border-radius:25px;
	overflow:hidden;
	height:270px;
	align-self:center;
	width:100%
}
.featured-image-slide {
	height:270px
}
.featured-image-slide img {
	width:100%;
	height:100%;
	object-fit:cover
}
.featured-blog-pagination {
	position:absolute!important;
	left:0!important;
	right:0!important;
	bottom:14px!important;
	z-index:5
}
.featured-blog-pagination .swiper-pagination-bullet {
	width:7px;
	height:7px;
	border-radius:0;
	background:rgba(255,255,255,.62);
	opacity:1;
	margin:0 7px!important
}
.featured-blog-pagination .swiper-pagination-bullet-active {
	background:#fff
}
.blog-timeline {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:26px 70px;
	padding:73px 48px 0;
	position:relative
}
.timeline-line {
	position:absolute;
	left:5px;
	top:45px;
	bottom:0;
	width:1px;
	background:rgba(255,255,255,.35)
}
.timeline-line i {
	position:absolute;
	width:7px;
	height:7px;
	border-radius:50%;
	background:#fff;
	left:-3px;
	top:38px
}
.blog-timeline article {
	display:grid;
	grid-template-columns:92px 1fr;
	gap:18px;
	color:#fff
}
.blog-timeline time {
	display:flex;
	gap:7px;
	align-items:flex-start
}
.blog-timeline time b {
	font-size:18px;
	font-weight:400
}
.blog-timeline time small {
	font-size:14px;
	margin-top:5px
}
.blog-timeline span {
	font-size:14px;
	opacity:.72
}
.blog-timeline h4 {
	font-size:14px;
	margin:5px 0
}
.blog-timeline h4 a{
	color:inherit
}
.blog-timeline h4 a:hover{
	color:var(--teal,#28b7a5)
}
.blog-timeline p {
	font-size:14px;
	line-height:1.35;
	color:#c7d2cf;
	margin:0
}
.footer {
	padding:70px 0 95px;
	border-top:1px solid rgba(255,255,255,.035)
}
.footer-grid {
	display:grid;
	grid-template-columns:1.5fr repeat(3,1fr) 1.65fr;
	gap:55px
}
.footer-grid h5 {
	font-size:14px;
	margin:4px 0 17px
}
.footer-grid a,.footer-grid p {
	display:block;
	font-size:14px;
	color:#d0d9d6;
	margin:0 0 10px;
	line-height:1.45
}
.footer-logo {
	display:flex;
	align-items:center;
	gap:8px
}
.footer-brand>p {
	font-size:14px;
	letter-spacing:.05em;
	margin-top:14px;
	max-width:180px
}
.socials {
	display:flex;
	gap:18px;
	margin-top:16px
}
.socials a {
	font-size:14px;
	font-weight:700
}
.socials a img {
	max-width: 20px;
}
.footer-brand .loop-mark {
	font-size:44px
}
.back-top {
	position:fixed;
	right:28px;
	bottom:28px;
	width:42px;
	height:42px;
	border:1px solid rgba(255,255,255,.4);
	background:rgba(23,24,25,.90);
	color:#fff;
	border-radius:50%;
	z-index:30;
	display:none;
	cursor:pointer
}
@media (max-width:1100px) {
	.main-nav {
	gap:22px
}
.hero h1 {
	font-size:50px
}
.featured-copy h3 {
	font-size:24px
}
.footer-grid {
	gap:25px
}
}
@media (max-width:820px) {
.site-header {
	border-bottom: 1px solid rgb(255 255 255 / 37%);
}
.site-header,.header-inner {
height:64px
}
.header-inner {
	width:calc(100% - 34px)
}
.brand {
	width:135px
}
.brand img {
	width:124px
}
.main-nav {
	display:none;
	position:absolute;
	left:0;
	right:0;
	top:64px;
	background:rgba(17,18,19,.98);
	padding:28px 28px 40px;
	flex-direction:column;
	align-items:flex-start;
	gap:0;
	min-height:min(72vh,560px);
	border-bottom:1px solid rgba(255,255,255,.1);
	box-shadow:0 18px 40px rgba(0,0,0,.45);
	z-index:2
}
.main-nav.open {
	display:flex
}
.main-nav > a,
.main-nav > .nav-product-item > a{
	display:block;
	width:100%;
	padding:14px 0;
	font-size:16px;
	letter-spacing:.04em;
	border-bottom:1px solid rgba(255,255,255,.08)
}
.main-nav a:after{display:none}
.nav-overlay{
	display:none;
	position:fixed;
	inset:64px 0 0;
	background:rgba(0,0,0,.62);
	backdrop-filter:blur(2px);
	-webkit-backdrop-filter:blur(2px);
	z-index:40
}
.nav-overlay.show{display:block}
body.nav-open{overflow:hidden}
.menu-toggle {
	display:block
}
.lang-pill {
	display:none
}
.search-panel {
	top:64px
}
.hero {
	margin-top:64px;
	height:580px
}
.hero-slide-1 {
	background-position:62% center
}
.hero-slide-shade {
	background:linear-gradient(90deg,rgba(23,24,25,.92),rgba(23,24,25,.62))
}
.hero h1 {
	font-size:42px
}
.hero-kicker {
	font-size:14px
}
.hero-sub {
	font-size:14px
}
.outline-btn {
	margin-top:35px
}
.section-title {
	font-size:32px
}
.about-features {
	gap:18px
}
.feature-icon {
	width:38px;
	height:38px
}
.section-heading h2 {
	font-size:40px
}
.stats {
	height:auto;
	padding:80px 0
}
.stats-panel {
	grid-template-columns:1fr 1fr;
	gap:30px
}
.stat:nth-child(2) {
	border-right:0
}
.stat strong {
	font-size:45px
}
.featured-blog {
	height:auto;
	grid-template-columns:1fr;
	padding:35px
}
.featured-image-swiper,.featured-image-slide {
	height:240px
}
.blog-timeline {
	grid-template-columns:1fr
}
.footer-grid {
	grid-template-columns:1fr 1fr 1fr
}
.footer-brand {
	grid-column:1/-1
}
.footer-grid>div:last-child {
	grid-column:2/4
}
}
@media (max-width:560px) {
	.shell {
	width:calc(100% - 36px)
}
.header-actions {
	gap:8px
}
.icon-btn {
	display:none
}
.hero {
	height:530px
}
.hero h1 {
	font-size:34px;
	line-height:1.03
}
.desktop-break {
	display:none
}
.about {
	padding-top:75px
}
.about-text {
	font-size:14px
}
.about-features {
	display:grid;
	grid-template-columns:1fr 1fr;
	max-width:240px;
	margin-left:auto;
	margin-right:auto
}
.service {
	padding-top:55px
}
.service-swiper,.application-swiper {
	width:100%;
	margin-left:0;
	padding-left:0
}
.service-card {
	height:220px
}
.service-card img {
	height:190px
}
.stats-panel {
	grid-template-columns:1fr
}
.stat {
	border-right:0;
	border-bottom:1px solid rgba(255,255,255,.11);
	padding-bottom:25px
}
.stat:last-child {
	border-bottom:0
}
.applications {
	padding-top:70px
}
.app-card {
	height:255px
}
.blog {
	padding-top:75px
}
.blog-logo span {
	font-size:45px
}
.featured-copy h3 {
	font-size:20px
}
.featured-blog {
	padding:25px 22px
}
.blog-timeline {
	padding-left:20px;
	padding-right:0
}
.blog-timeline article {
	grid-template-columns:75px 1fr
}
.footer-grid {
	grid-template-columns:1fr 1fr
}
.footer-brand,.footer-grid>div:last-child {
	grid-column:1/-1
}
}
/* V2 slider framing: 0.5 + 3 + 0.5 cards visible on desktop*/
	@media (min-width:821px) {
	.service-swiper,.application-swiper {
	overflow:hidden
}
.service-swiper .swiper-slide,.application-swiper .swiper-slide {
	transition:opacity .35s ease,transform .35s ease
}
}
@media (max-width:820px) {
	.service-swiper .swiper-button-prev {
	left:8px!important
}
.service-swiper .swiper-button-next {
	right:8px!important
}
.service-progress-wrap,.apps-progress-wrap {
	width:calc(100% - 36px)
}
}
/* V3 segmented pagination: 1px gray baseline + N equal segments, active segment is a 2px white line.*/
	.service-pagination.segment-pagination,
.applications-pagination.segment-pagination {
	position:absolute!important;
	left:0!important;
	right:0!important;
	top:7px!important;
	bottom:auto!important;
	width:100%!important;
	height:12px!important;
	background:transparent!important;
	display:flex!important;
	align-items:flex-start;
	overflow:visible;
}
.service-pagination.segment-pagination::before,
.applications-pagination.segment-pagination::before {
	content:"";
	position:absolute;
	z-index:0;
	left:0;
	right:0;
	top:5px;
	height:1px;
	background:rgba(255,255,255,.24);
}
.slider-segment {
	appearance:none;
	-webkit-appearance:none;
	position:relative;
	z-index:1;
	flex:1 1 0;
	min-width:0;
	height:12px;
	margin:0;
	padding:0;
	border:0;
	background:transparent;
	cursor:pointer;
}
.slider-segment::after {
	content:"";
	position:absolute;
	left:0;
	right:0;
	top:4px;
	height:2px;
	background:#fff;
	opacity:0;
	transform:scaleX(0);
	transform-origin:center;
	transition:transform .28s ease,opacity .28s ease;
}
.slider-segment.is-active::after {
	opacity:1;
	transform:scaleX(1);
}
/* Disable the old progressbar rendering if Swiper CSS injected any remnants.*/
	.service-pagination .swiper-pagination-progressbar-fill,
.applications-pagination .swiper-pagination-progressbar-fill {
	display:none!important
}
/* V4 deterministic infinite carousel track. Service / Applications no longer use Swiper's loop calculation;
	their wrappers are positioned by js/main.js so both edges are always buffered.*/
	.service-swiper,
.application-swiper {
	position:relative;
	overflow:hidden!important;
}
.service-swiper .swiper-wrapper,
.application-swiper .swiper-wrapper {
	box-sizing:border-box;
	display:flex!important;
	align-items:stretch;
	width:max-content!important;
	will-change:transform;
	touch-action:pan-y;
}
.service-swiper .swiper-slide,
.application-swiper .swiper-slide {
	flex-shrink:0!important;
	box-sizing:border-box;
}
.service-swiper .swiper-button-prev,
.service-swiper .swiper-button-next {
	display:flex!important;
	pointer-events:auto!important;
	opacity:1!important;
}
.service-swiper .swiper-button-disabled {
	opacity:1!important;
	pointer-events:auto!important;
}

/* Product navigation dropdown. It is invisible in the normal header state, so
   the header composition stays identical while both new product pages remain
   directly reachable from Products. */
.nav-product-item{
  position:relative;
  display:flex;
  align-items:center;
}
.nav-product-menu{
  position:absolute;
  top:calc(100% + 15px);
  left:50%;
  min-width:172px;
  padding:10px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:9px;
  background:rgba(16,17,18,.98);
  box-shadow:0 14px 34px rgba(0,0,0,.32);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate(-50%,7px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease;
}
.nav-product-menu::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-17px;
  height:18px;
}
.nav-product-menu a{
  display:block;
  padding:8px 10px;
  border-radius:6px;
  font-size:14px;
  font-weight:500;
  color:#d9dddc;
  white-space:nowrap;
}
.nav-product-menu a::after{display:none!important}
.nav-product-menu a:hover{background:rgba(255,255,255,.07);color:#fff}
.nav-product-item:hover .nav-product-menu,
.nav-product-item:focus-within .nav-product-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translate(-50%,0);
}
@media(max-width:820px){
  .nav-product-item{display:block;width:100%;border-bottom:1px solid rgba(255,255,255,.08)}
  .nav-product-item > a{padding:14px 0;font-size:16px;letter-spacing:.04em}
  .nav-product-menu{
    position:static;
    min-width:0;
    padding:0 0 12px 16px;
    border:0;
    background:transparent;
    box-shadow:none;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
    display:flex;
    flex-direction:column;
    gap:0;
  }
  .nav-product-menu a{padding:10px 0;font-size:14px;color:#aeb7b4;border:0}
  .nav-product-menu a:after{display:none!important}
}


/* ================================================================
   WordPress classic-theme document scroll isolation (v0.3)
   The original static site scrolls on the root document. WordPress core,
   plugins or generated global styles can otherwise change the root/body
   overflow model. Keep this static-migration theme on the same model.
   ================================================================ */
html {
  width:100% !important;
  min-height:100% !important;
  height:auto !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
}
body {
  width:100% !important;
  min-height:100% !important;
  height:auto !important;
  max-height:none !important;
  overflow-x:hidden !important;
  overflow-y:visible !important;
}
main {
  display:block !important;
  position:relative;
  min-height:0 !important;
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
}
/* The only intentional page scroll lock is an OPEN mobile menu. */
@media (max-width:820px) {
  body.nav-open { overflow-y:hidden !important; }
}
@media (min-width:821px) {
  body.nav-open { overflow-y:visible !important; }
}

/* V1.1 global contact links */
.footer-grid .footer-contact-link{display:inline;color:inherit;margin:0;font-size:inherit;line-height:inherit}
.footer-grid .footer-contact-link:hover{color:#35c9b4}

/* V1.4 dynamic homepage Service Gallery / Applications cards. */
.home-module-card-link{
  display:block;
  width:100%;
  height:100%;
  color:inherit;
  text-decoration:none;
}

/* V1.5 legal footer links */
.footer-legal{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding-top:24px;
  padding-bottom:28px;
  margin-top:28px;
  border-top:1px solid rgba(255,255,255,.10);
  color:#8f9693;
  font-size:14px;
  letter-spacing:.03em;
}
.footer-legal nav{display:flex;flex-wrap:wrap;gap:18px}
.footer-legal a{color:#aeb5b2;text-decoration:none}
.footer-legal a:hover{color:#35c9b4}
@media(max-width:620px){.footer-legal{align-items:flex-start;flex-direction:column;gap:12px}.footer-legal nav{gap:14px}}

/* ================================================================
   V1.6 Cookie Consent / privacy preferences
   ================================================================ */
.tanso-consent[hidden],.tanso-consent-modal[hidden]{display:none!important}
.tanso-consent{
  position:fixed;
  left:0;right:0;bottom:0;
  z-index:99990;
  padding:18px;
  pointer-events:none;
}
.tanso-consent-card{
  width:min(1180px,calc(100vw - 36px));
  margin:0 auto;
  padding:22px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  background:rgba(18,21,20,.98);
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  box-shadow:0 16px 52px rgba(0,0,0,.45);
  color:#f5f7f6;
  pointer-events:auto;
  backdrop-filter:blur(14px);
}
.tanso-consent-copy{max-width:720px}
.tanso-consent-copy h2,.tanso-consent-panel h2{margin:0 0 8px;font-size:20px;line-height:1.25;color:#fff;font-weight:700}
.tanso-consent-copy p,.tanso-consent-panel>p{margin:0;color:#b8c0bd;font-size:14px;line-height:1.7}
.tanso-consent-links{display:flex;gap:8px;align-items:center;margin-top:8px!important}
.tanso-consent-links a{color:#62dbc9;text-decoration:none}
.tanso-consent-links a:hover{text-decoration:underline}
.tanso-consent-actions,.tanso-consent-modal-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.tanso-consent-btn{
  appearance:none;
  border-radius:999px;
  min-height:40px;
  padding:9px 18px;
  border:1px solid rgba(255,255,255,.22);
  background:transparent;
  color:#fff;
  font-size:14px;
  font-weight:700;
  letter-spacing:.02em;
  cursor:pointer;
  transition:.2s ease;
}
.tanso-consent-btn:hover{transform:translateY(-1px);border-color:#35c9b4}
.tanso-consent-btn-primary{background:#169f8e;border-color:#169f8e;color:#fff}
.tanso-consent-btn-primary:hover{background:#21b9a5}
.tanso-consent-btn-secondary{background:rgba(255,255,255,.04)}
.tanso-consent-modal{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:24px}
.tanso-consent-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.68);backdrop-filter:blur(4px)}
.tanso-consent-panel{
  position:relative;
  z-index:1;
  width:min(640px,100%);
  max-height:min(760px,calc(100vh - 48px));
  overflow:auto;
  padding:28px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  background:#151817;
  color:#fff;
  box-shadow:0 22px 80px rgba(0,0,0,.55);
}
.tanso-consent-close{position:absolute;right:16px;top:12px;border:0;background:transparent;color:#b8c0bd;font-size:28px;line-height:1;cursor:pointer;padding:6px}
.tanso-consent-close:hover{color:#fff}
.tanso-consent-row{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 0;border-top:1px solid rgba(255,255,255,.10)}
.tanso-consent-row:first-of-type{margin-top:20px}
.tanso-consent-row strong{display:block;margin-bottom:4px;font-size:14px;color:#fff}
.tanso-consent-row p{margin:0;color:#9da6a3;font-size:14px;line-height:1.55}
.tanso-consent-always{flex:0 0 auto;color:#62dbc9;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.tanso-switch{position:relative;flex:0 0 auto;width:46px;height:26px}
.tanso-switch input{position:absolute;opacity:0;pointer-events:none}
.tanso-switch span{display:block;width:46px;height:26px;border-radius:999px;background:#444a48;cursor:pointer;transition:.2s ease;position:relative}
.tanso-switch span:after{content:"";position:absolute;width:20px;height:20px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.2s ease}
.tanso-switch input:checked+span{background:#169f8e}
.tanso-switch input:checked+span:after{transform:translateX(20px)}
.tanso-switch input:focus-visible+span{outline:2px solid #62dbc9;outline-offset:3px}
.tanso-consent-modal-actions{padding-top:20px;border-top:1px solid rgba(255,255,255,.10)}
html.tanso-consent-open body{overflow:hidden!important}
.footer-cookie-settings{appearance:none;border:0;background:transparent;padding:0;color:#aeb5b2;font:inherit;font-size:inherit;letter-spacing:inherit;cursor:pointer}
.footer-cookie-settings:hover{color:#35c9b4}
@media(max-width:820px){
  .tanso-consent{padding:12px}
  .tanso-consent-card{width:100%;padding:18px;align-items:stretch;flex-direction:column;gap:16px;border-radius:14px}
  .tanso-consent-actions{justify-content:stretch}
  .tanso-consent-actions .tanso-consent-btn{flex:1 1 140px}
  .tanso-consent-modal{padding:12px}
  .tanso-consent-panel{padding:22px 18px}
  .tanso-consent-row{gap:14px}
  .tanso-consent-modal-actions{justify-content:stretch}
  .tanso-consent-modal-actions .tanso-consent-btn{flex:1 1 160px}
}

/* V1.10: Fade slides share the same coordinates. PHP marks the first rendered
   slide hero-interactive before JS starts, then Swiper/JS moves that class to
   the current slide. This avoids both invisible-slide click interception and
   the first-paint dead-click window before swiper-slide-active is established. */
.hero-swiper .swiper-slide {
  pointer-events:none;
  z-index:0;
}
.hero-swiper .swiper-slide.hero-interactive,
.hero-swiper .swiper-slide.swiper-slide-active {
  pointer-events:auto;
  z-index:3;
}
.hero-swiper .swiper-slide:not(.hero-interactive):not(.swiper-slide-active) .outline-btn {
  pointer-events:none!important;
}
