:root {
  --xm-crimson: #C8402C;
  --xm-crimson-deep: #A33225;
  --xm-ink: #1C1A17;
  --xm-muted: #6B655C;
  --xm-hairline: rgba(28, 26, 23, 0.12);
  --xm-container-w: 1200px;
  --xm-navh: 80px;
  --xm-ease: cubic-bezier(0.215, 0.61, 0.355, 1);
  --xm-paper: #F7F4EF;
  --xm-cream: #FFFFFF;
}
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-font-smoothing: antialiased; }
body { font-family: Arial, 'ReemKufiFun', sans-serif; color: var(--xm-ink); line-height: 1.6; overflow-x: hidden; }
.xm-container { max-width: var(--xm-container-w); margin: 0 auto; padding: 0; width: 100%; position: relative; }
.xm-section-padding { padding: 70px 0; }
.xm-title-group { margin-bottom: 60px; position: relative; padding-left: 0; text-align: center; }
.xm-title-group::before { display: none; }
.xm-section-title { font-size: 2.5rem; font-weight: 700; letter-spacing: -1px; color: #111; display: inline-block; }
.xm-section-subtitle { font-size: 0.85rem; color: var(--xm-crimson); text-transform: uppercase; letter-spacing: 0; font-weight: 700; margin-bottom: 5px; display: block; opacity: 0.8; }
.xm-btn-primary { display: inline-flex; align-items: center; gap: 10px; padding: 15px 40px; background: var(--xm-crimson); color: white; text-decoration: none; border-radius: 50px; font-weight: 500; transition: all 0.3s var(--xm-ease); border: 1px solid transparent; }
.xm-btn-primary:hover { background: transparent; border-color: var(--xm-crimson); box-shadow: 0 0 20px rgba(200, 64, 44, 0.3); }
header { position: fixed; top: 0; width: 100%; z-index: 1000; transition: all 0.4s ease; background: rgba(10, 11, 14, 0.0); border-bottom: 1px solid rgba(255,255,255,0); }
header:hover { background: rgba(230, 230, 230, 0.96); border-bottom-color: rgba(255,255,255,0.08); }
.xm-menu-toggle { display: none; }
header.scrolled { background: #E6E6E6; backdrop-filter: blur(12px); border-bottom: 1px solid var(--xm-hairline); height: 70px; }
.xm-nav-container { display: flex; justify-content: space-between; align-items: center; height: var(--xm-navh); transition: height 0.3s ease; position: static !important; }
header.scrolled .xm-nav-container { height: 70px; }
header.scrolled .xm-nav-link, header:hover .xm-nav-link { color: #2A2A2A; }
header.scrolled .xm-nav-link.active, header:hover .xm-nav-link.active { color: var(--xm-crimson); }
.xm-logo img { height: 40px; width: auto; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.18)); }
.xm-nav-menu { display: flex; gap: 55px; list-style: none; height: 100%; align-items: center; margin-left: auto; margin-right: 0px; }
.xm-nav-cell { height: 100%; display: flex; align-items: center; position: static; }
.xm-nav-link { display: block; color: #ffffff; text-decoration: none; font-size: 15px; font-weight: 500; position: relative; padding: 10px 0; transition: color 0.3s; cursor: pointer; }
.xm-nav-link i { display: none; }
.xm-nav-link::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background: var(--xm-crimson-deep); transition: width 0.3s var(--xm-ease); }
.xm-nav-cell:hover .xm-nav-link { color: #2A2A2A; }
.xm-nav-cell:hover .xm-nav-link::after { width: 100%; }
.xm-header-socials { display: flex; gap: 15px; margin-left: 30px; align-items: center; }
.xm-social-link { color: rgba(255,255,255,0.7); font-size: 20px; transition: all 0.3s; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; text-decoration: none !important; border: none !important; background: rgba(255,255,255,0.05); }
.xm-social-link:hover { color: var(--xm-crimson-deep); background: rgba(255,255,255,0.15); transform: translateY(-2px); }
.xm-lang-switch { position: relative; }
.xm-lang-switch .xm-mega-menu.lang-menu { top: 100%; transform: translateY(10px); width: 120px; left: 50%; right: auto; margin-left: -60px; padding: 10px; min-width: auto; }
.xm-lang-switch:hover .xm-mega-menu.lang-menu { transform: translateY(0); }
.xm-mega-menu { position: absolute; top: 100%; left: 0; width: 100%; background: rgba(10, 11, 14, 0.95); backdrop-filter: blur(20px); border-top: 1px solid rgba(255,255,255,0.1); border-bottom: 1px solid rgba(255,255,255,0.05); padding: 40px 0; opacity: 0; visibility: hidden; transform: translateY(10px); transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94); z-index: 900; box-shadow: 0 20px 40px rgba(0,0,0,0.5); }
.xm-nav-cell:hover .xm-mega-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.xm-mega-content { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; }
.xm-mega-col h4 { color: white; font-size: 1.1rem; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,0.1); }
.xm-mega-col a { display: block; color: #8F9BB3; text-decoration: none; margin-bottom: 12px; font-size: 0.95rem; transition: all 0.2s; }
.xm-mega-col a:hover { color: var(--xm-crimson-deep); transform: translateX(5px); }
.xm-mega-img { background: transparent; border-radius: 8px; height: 85%; display: flex; align-items: flex-end; padding: 20px; position: relative; overflow: hidden; }
.xm-mega-img::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../../assets/img/xm-texture.png'); background-size: cover; mix-blend-mode: normal; opacity: 1; }
.xm-nav-promo-box span { font-size: 3rem; font-weight: 800; color: white; line-height: 1; display: block; }
.xm-nav-promo-box p { color: rgba(255,255,255,0.9); margin-top: 5px; font-size: 0.9rem; }
.xm-hero { height: 100vh; min-height: 700px; display: flex; align-items: center; position: relative; overflow: hidden !important; background-color: #0a0b0e; z-index: 999; margin-bottom: 0px; }
.xm-section-spacer { display: block !important; height: 50px; width: 100vw; clear: both; background: #ffffff; position: relative; z-index: 20; }
#about { background-color: #ffffff; color: #111; position: relative; overflow: hidden; clear: both; margin-top: 50px; z-index: 10; padding-top: 50px; }
#hero-particles { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; opacity: 0.8; }
.xm-hero::after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100px; background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.4)); z-index: 3; pointer-events: none; }
.xm-hero-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url('../../assets/img/xm-texture.png'); background-size: cover; background-position: center; z-index: 0; }
.xm-hero-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(10,11,14,0.9) 0%, rgba(10,11,14,0.0) 30%); z-index: 1; }
.xm-hero-content { position: relative; z-index: 4; height: 100%; display: flex; align-items: center; }
.xm-hero-main-img { position: absolute; left: 0; bottom: 0; width: 350px; height: 850px; object-fit: contain; object-position: bottom center; z-index: 1; }
.xm-hero-text-wrapper { margin-left: 0px; position: relative; z-index: 2; max-width: 800px; }
.xm-hero h1 { font-size: 3.5rem; line-height: 1.1; font-weight: 800; margin-bottom: 24px; color: #FFFFFF !important; filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.9)); letter-spacing: -2px; }
.xm-hero p { font-size: 1.5rem; color: #C8402C !important; font-weight: 500; margin-bottom: 40px; border-left: none; padding-left: 0; text-shadow: 0 1px 2px rgba(0,0,0,0.5); }
.xm-hero .xm-btn-primary { opacity: 1 !important; visibility: visible !important; display: inline-flex !important; }
.xm-scroll-down { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); z-index: 10; color: var(--xm-crimson); font-size: 24px; animation: bounce 2s infinite; opacity: 1; filter: drop-shadow(0 0 2px rgba(255,255,255,0.5)); }
@keyframes bounce { 0%, 20%, 50%, 80%, 100% {transform:translateY(0) translateX(-50%);} 40% {transform:translateY(-10px) translateX(-50%);} 60% {transform:translateY(-5px) translateX(-50%);} }
#about { background-color: #ffffff; color: #111; position: relative; overflow: hidden; clear: both; margin-top: 0; z-index: 10; padding-top: 80px; }
#about::before { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; background-image: url('../../assets/img/xm-texture.png'); background-position: center; background-repeat: no-repeat; background-size: auto 155px; opacity: 0.05; pointer-events: none; z-index: 10; }
#about .xm-container { position: relative; z-index: 2; }
#about .xm-section-title { background: none; -webkit-text-fill-color: initial; color: #111; }
#about .xm-title-group::before { background: var(--xm-crimson); }
.xm-about-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.xm-about-text p { font-size: 1.125rem; color: #555; margin-bottom: 2rem; text-align: justify; }
.xm-stats-grid { display: flex; gap: 40px; }
.xm-stat-cell h4 { font-size: 2.5rem; color: var(--xm-crimson); font-weight: 700; }
.xm-stat-cell span { font-size: 0.9rem; color: #666; text-transform: uppercase; letter-spacing: 1px; }
.xm-about-visual { position: relative; height: 400px; background: radial-gradient(circle at 30% 30%, #f0f4f8 0%, #e1e6eb 70%); border-radius: 20px; overflow: hidden; border: 1px solid #eee; }
.xm-tech-ring { position: absolute; border: 1px solid rgba(0,0,0,0.1); border-radius: 50%; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.xm-products-bg { background: #ffffff; color: #111; border-top: 1px solid #eeeeee; }
#products .xm-section-title { background: none; -webkit-text-fill-color: initial; color: #111; }
#products .xm-title-group::before { background: var(--xm-crimson); }
.xm-products-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; width: 100%; }
.xm-product-card { background: #ffffff; border: 1px solid var(--xm-hairline); border-radius: 16px; padding: 10px; position: relative; transition: all 0.4s var(--xm-ease); overflow: hidden; }
.xm-card-image-block { height: 240px; border-radius: 12px; background: transparent; position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.xm-badge-hot { position: absolute; top: 16px; left: 16px; padding: 4px 10px; border-radius: 999px; background-color: var(--xm-crimson); color: #ffffff; font-size: 0.75rem; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; }
.xm-products-hot .xm-card-image-block, .xm-products-general .xm-card-image-block { border-radius: 0; aspect-ratio: 1 / 1; height: auto; }
.xm-abstract-shape { width: 100px; height: 100px; background: linear-gradient(45deg, var(--xm-crimson), #E2917E); border-radius: 20px; transform: rotate(45deg); opacity: 0.8; filter: blur(20px); transition: all 0.5s ease; }
.xm-product-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0,0,0,0.4); border-color: rgba(0, 102, 255, 0.3); }
.xm-product-card:hover .xm-abstract-shape { transform: rotate(0deg) scale(1.2); filter: blur(10px); }
.xm-card-content { padding: 30px 20px; min-height: 180px; display: flex; flex-direction: column; justify-content: space-between; }
.xm-card-content h3 { font-size: 1.5rem; margin-bottom: 10px; color: white; }
.xm-card-content p { color: var(--xm-muted); font-size: 0.95rem; margin-bottom: 20px; }
.xm-card-link { color: var(--xm-crimson-deep); text-decoration: none; font-weight: 600; display: flex; align-items: center; gap: 5px; }
.xm-global-section { background: #f2f2f2; color: #111; overflow: hidden; position: relative; padding: 120px 0; }
.xm-global-section .xm-section-title { background: none; -webkit-text-fill-color: initial; color: #111; }
.xm-map-bg { position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); background-image: url('../../assets/img/xm-texture.png'); background-repeat: no-repeat; background-position: center; background-size: 80%; opacity: 0.18; mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent); -webkit-mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent); pointer-events: none; z-index: 0; }
.xm-locations-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; position: relative; z-index: 2; }
.xm-loc-card { background: #ffffff; backdrop-filter: none; border: 1px solid #e0e0e0; padding: 30px; border-radius: 8px; position: relative; transition: background 0.3s; }
.xm-loc-card::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 2px; background: var(--xm-crimson); transform: scaleX(0); transform-origin: left; transition: transform 0.4s ease; }
.xm-loc-card:hover { background: #f8f8f8; }
.xm-loc-card:hover::before { transform: scaleX(1); }
.xm-loc-year { font-size: 3rem; font-weight: 800; color: rgba(0,0,0,0.06); position: absolute; top: 10px; right: 20px; line-height: 1; }
.xm-loc-city { font-size: 1.5rem; font-weight: 700; margin-bottom: 20px; position: relative; color: var(--xm-crimson); }
.xm-loc-data { display: flex; flex-direction: column; gap: 8px; }
.xm-data-row { display: flex; justify-content: space-between; font-size: 0.9rem; color: #555; border-bottom: 1px solid #e6e6e6; padding-bottom: 5px; }
.xm-ad-banner { height: 800px; background: url('../../assets/img/xm-texture.png') no-repeat center center; background-size: cover; position: relative; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.xm-ad-banner::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); z-index: 1; }
.xm-ad-lines { position: absolute; width: 200%; height: 100%; background: repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(200, 64, 44,0.05) 10px, rgba(200, 64, 44,0.05) 20px); animation: slide 20s linear infinite; z-index: 1; }
@keyframes slide { from {transform: translateX(-50%);} to {transform: translateX(0);} }
.xm-ad-text { z-index: 2; text-align: center; padding: 60px 100px; background: rgba(0, 0, 0, 0.1); position: relative; overflow: hidden; border: 1px solid rgba(200, 64, 44, 0.5); box-shadow: 0 0 30px rgba(0,0,0,0.8); transition: 0.5s; backdrop-filter: blur(5px); }
.xm-ad-text h2 { font-size: 2.5rem; margin-bottom: 5px; }
.xm-ad-text span { position: absolute; display: block; }
.xm-ad-text span:nth-child(1) { top: 0; left: -100%; width: 100%; height: 3px; background: linear-gradient(90deg, transparent, #C8402C); animation: btn-anim1 3s linear infinite; }
@keyframes btn-anim1 { 0% { left: -100%; } 50%, 100% { left: 100%; } }
.xm-ad-text span:nth-child(2) { top: -100%; right: 0; width: 3px; height: 100%; background: linear-gradient(180deg, transparent, #C8402C); animation: btn-anim2 3s linear infinite; animation-delay: 0.75s; }
@keyframes btn-anim2 { 0% { top: -100%; } 50%, 100% { top: 100%; } }
.xm-ad-text span:nth-child(3) { bottom: 0; right: -100%; width: 100%; height: 3px; background: linear-gradient(270deg, transparent, #C8402C); animation: btn-anim3 3s linear infinite; animation-delay: 1.5s; }
@keyframes btn-anim3 { 0% { right: -100%; } 50%, 100% { right: 100%; } }
.xm-ad-text span:nth-child(4) { bottom: -100%; left: 0; width: 3px; height: 100%; background: linear-gradient(360deg, transparent, #C8402C); animation: btn-anim4 3s linear infinite; animation-delay: 2.25s; }
@keyframes btn-anim4 { 0% { bottom: -100%; } 50%, 100% { bottom: 100%; } }
.xm-news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.xm-news-card { background: #ffffff; border: 1px solid var(--xm-hairline); border-radius: 12px; overflow: hidden; transition: all 0.3s; height: 100%; display: flex; flex-direction: column; opacity: 1 !important; visibility: visible !important; transform: none !important; }
.xm-news-img-box { height: 200px; width: 100%; background: #222; position: relative; overflow: hidden; }
.xm-news-placeholder { width: 100%; height: 100%; background: linear-gradient(45deg, #1a2a6c, #b21f1f, #fdbb2d); background-size: 200% 200%; animation: gradientMove 5s ease infinite; }
@keyframes gradientMove { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
.xm-news-content { padding: 25px; flex: 1; display: flex; flex-direction: column; }
.xm-news-card:hover { transform: translateY(-5px); box-shadow: 0 10px 30px rgba(0,0,0,0.3); border-color: var(--xm-crimson); }
.xm-news-meta { font-size: 0.8rem; color: var(--xm-crimson-deep); margin-bottom: 15px; display: block; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; }
.xm-news-card h3 { font-size: 1.25rem; line-height: 1.4; margin-bottom: 15px; color: white; transition: color 0.3s; }
.xm-news-card p { color: var(--xm-muted); font-size: 0.95rem; margin-bottom: 20px; flex-grow: 1; }
.xm-read-more-btn { font-size: 0.9rem; color: white; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; margin-top: auto; font-weight: 500; }
.xm-news-section { background-color: #ffffff; color: #111; }
.xm-news-section .xm-section-title { background: none; -webkit-text-fill-color: initial; color: #111; }
.xm-news-section .xm-news-card { background: #f7f7f9; border-color: #e1e4ea; }
.xm-news-section .xm-news-card h3 { color: #111; }
.xm-news-section .xm-news-card p { color: #555; }
.xm-news-section .xm-news-meta { color: var(--xm-crimson); }
.xm-partners-section { background-color: #ffffff; color: #111; }
.xm-partners-section .xm-section-title { background: none; -webkit-text-fill-color: initial; color: #111; }
.xm-partners-logos { display: flex; flex-wrap: wrap; gap: 30px; justify-content: center; opacity: 0.85; }
.xm-partners-logos i { font-size: 40px; color: #4b5563; transition: color 0.3s ease, transform 0.3s ease; }
.xm-partners-logos i:hover { color: var(--xm-crimson); transform: translateY(-2px); }
.xm-products-hero { background: url('../../assets/img/xm-texture.png') no-repeat center center; background-size: cover; padding-top: 160px; padding-bottom: 140px; }
.xm-products-hero-inner { display: flex; align-items: center; justify-content: center; min-height: 340px; text-align: center; }
.xm-products-hero-text h1 { font-size: 3rem; font-weight: 700; margin-bottom: 20px; }
.xm-products-hero-text p { max-width: 520px; color: var(--xm-muted); margin-bottom: 30px; }
.xm-products-hot { background-color: #f7f7f9; }
.xm-products-hot .xm-section-title { background: none; -webkit-text-fill-color: initial; color: #111; }
.xm-products-hot-intro { max-width: 800px; margin: 0 auto 50px auto; text-align: center; color: #666; font-size: 0.98rem; }
.xm-products-scenarios { background-color: #ffffff; }
.xm-products-scenarios .xm-section-title { background: none; -webkit-text-fill-color: initial; color: #111; }
.xm-scenario-row { display: grid; grid-template-columns: 1.1fr 1fr; gap: 0; align-items: stretch; margin-bottom: 30px; background-color: #f5f5f7; overflow: hidden; }
.xm-scenario-text h3 { font-size: 1.5rem; margin-bottom: 25px; margin-top:15px; color: #111; }
.xm-scenario-text p { color: #4b5563; }
.xm-scenario-text { padding: 24px 28px; }
.xm-scenario-image { width: 650px; max-width: 100%; min-height: 400px; height: auto; border-radius: 0; overflow: hidden; }
.xm-scenario-meta { margin-top: 12px; list-style: none; padding: 0; }
.xm-scenario-meta li { font-size: 0.8rem; color: #9ca3af; line-height: 1.6; }
.xm-products-general { background-color: #f7f7f9; }
.xm-products-general .xm-section-title { background: none; -webkit-text-fill-color: initial; color: #111; }
.xm-products-hot .xm-product-card, .xm-products-general .xm-product-card { background: #ffffff; border: none; box-shadow: none; transform: none; border-radius: 0; }
.xm-products-hot .xm-product-card:hover, .xm-products-general .xm-product-card:hover { transform: translateY(-4px); box-shadow: 0 10px 25px rgba(15,23,42,0.12); }
.xm-products-hot .xm-card-content h3, .xm-products-general .xm-card-content h3 { color: #111; }
.xm-products-hot .xm-card-content p, .xm-products-general .xm-card-content p { color: #4b5563; }
.xm-products-hot .xm-card-link, .xm-products-general .xm-card-link { color: var(--xm-crimson); }
.xm-read-more-btn i { transition: transform 0.3s; }
.xm-news-card:hover .xm-read-more-btn i { transform: translateX(5px); }
.xm-news-card:hover h3 { color: var(--xm-crimson-deep); }
footer { background: #E6E6E6; border-top: 1px solid rgba(0, 0, 0, 0.08); padding: 80px 0 30px; color: #666666; }
.xm-footer-top { display: grid; grid-template-columns: minmax(220px, 300px) minmax(0, 1fr); gap: 40px 60px; align-items: start; margin-bottom: 60px; }
.xm-footer-brand { max-width: 300px; }
.xm-footer-nav { display: grid; grid-template-columns: repeat(3, minmax(140px, 1fr)); gap: 40px 80px; align-items: start; }
.xm-footer-col h5 { color: #222222; margin-bottom: 25px; font-size: 1.1rem; }
.xm-footer-col ul { list-style: none; }
.xm-footer-col li { margin-bottom: 12px; }
.xm-footer-col a { color: #555555; text-decoration: none; transition: color 0.2s; font-size: 0.95rem; }
.xm-footer-col a:hover { color: var(--xm-crimson); }
.xm-footer-btm { text-align: center; border-top: 1px solid rgba(255,255,255,0.05); padding-top: 30px; font-size: 0.85rem; }
.xm-page-banner { position: relative; height: 500px; min-height: 500px; overflow: hidden; }
.xm-about-banner-img { width: 100%; height: 100%; object-fit: cover; }
.xm-custom-banner-img { object-fit: contain; background-color: #000; max-width: 1980px; margin: 0 auto; display: block; position: relative; height: auto; }
.xm-page-banner.custom-banner-bg { background-color: #000; display: flex; justify-content: center; align-items: center; height: auto !important; min-height: 500px; padding: 0; }
.xm-page-banner.custom-banner-bg .xm-custom-banner-img { position: relative; width: auto; max-width: 100%; height: auto; top: auto; left: auto; transform: none; }
.xm-page-banner::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 50%, rgba(0,0,0,0.1) 100%); z-index: 1; }
.xm-page-banner-content { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; color: white; z-index: 2; }
.xm-page-banner-content h1 { font-size: 3rem; font-weight: bold; margin-bottom: 20px; text-shadow: 2px 2px 4px rgba(0,0,0,0.5); }
.xm-page-banner-content p { font-size: 1.2rem; opacity: 0.8; text-shadow: 1px 1px 2px rgba(0,0,0,0.5); }
.xm-page-banner-content p { font-size: 1.2rem; opacity: 0.9; text-shadow: 1px 1px 2px rgba(0,0,0,0.5); }
.xm-sub-nav { background: #ffffff; border-bottom: 1px solid #eee; padding: 15px 0; top: 80px; z-index: 99; box-shadow: 0 4px 20px rgba(0,0,0,0.03); }
.xm-sub-nav-list { display: flex; justify-content: center; gap: 15px; list-style: none; flex-wrap: wrap; }
.xm-sub-nav-btn { display: inline-flex; align-items: center; padding: 8px 24px; border-radius: 50px; background: transparent; color: #555; text-decoration: none; font-weight: 500; font-size: 0.95rem; transition: all 0.3s ease; border: 1px solid transparent; }
.xm-sub-nav-btn:hover, .xm-sub-nav-btn.active { background: var(--xm-crimson); color: white; box-shadow: 0 4px 12px rgba(200, 64, 44, 0.25); }
.xm-partners-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 30px; align-items: center; margin-top: 40px; }
.xm-partner-logo { background: white; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; border: 1px solid #eee; transition: all 0.3s; font-size: 2rem; color: #ccc; }
.xm-partner-logo:hover { border-color: var(--xm-crimson); transform: translateY(-5px); box-shadow: 0 5px 15px rgba(0,0,0,0.05); color: var(--xm-crimson); }
.xm-service-process { display: flex; justify-content: space-between; position: relative; margin-bottom: 60px; }
.xm-service-process::before { content: ''; position: absolute; top: 25px; left: 0; width: 100%; height: 2px; background: #eee; z-index: 0; }
.xm-sp-step { position: relative; z-index: 1; text-align: center; background: white; padding: 0 10px; }
.xm-sp-icon { width: 50px; height: 50px; background: var(--xm-crimson); color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; font-size: 20px; }
.xm-service-form-wrapper { background: white; padding: 40px; border-radius: 20px; box-shadow: 0 10px 40px rgba(0,0,0,0.05); }
.xm-sub-nav + section { scroll-margin-top: 140px; }
.xm-pro-card { background: #ffffff; border-radius: 20px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04); border: 1px solid rgba(0, 0, 0, 0.03); transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); overflow: hidden; }
.xm-pro-card:hover { transform: translateY(-5px); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08); }
.xm-pro-section-bg { background-color: #f9fafb; }
.xm-pro-btn { background: var(--xm-crimson); color: white; border-radius: 12px; padding: 12px 28px; font-weight: 600; transition: all 0.3s ease; border: none; cursor: pointer; box-shadow: 0 4px 14px rgba(200, 64, 44, 0.25); display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.xm-pro-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(200, 64, 44, 0.35); background-color: #00c060; }
.xm-back-to-top { position: fixed; bottom: 30px; right: 30px; width: 50px; height: 50px; background-color: var(--xm-crimson); color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 24px; text-decoration: none; z-index: 1000; opacity: 0; visibility: hidden; transform: translateY(20px); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 5px 15px rgba(200, 64, 44, 0.4); }
.xm-back-to-top.visible { opacity: 1; visibility: visible; transform: translateY(0); }
.xm-back-to-top:hover { background-color: var(--xm-crimson-deep); transform: translateY(-5px); box-shadow: 0 8px 25px rgba(200, 64, 44, 0.6); color: #0A0B0E; }
.xm-banner-section { position: relative; width: 100%; overflow: hidden; background: #ffffff; aspect-ratio: 1987/1118; height: auto; min-height: 0; }
.xm-banner-slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1s ease-in-out; z-index: 1; display: flex; align-items: center; justify-content: center; }
.xm-banner-slide.active { opacity: 1; z-index: 2; }
.xm-banner-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center center; z-index: -2; }
.xm-banner-overlay { position: absolute; inset: 0; z-index: -1; }
.xm-banner-content { position: relative; z-index: 3; text-align: left; color: white; width: 100%; max-width: 1200px; padding: 0 20px; margin: 0 auto; }
.xm-banner-title { font-size: 4rem; margin-bottom: 18px; letter-spacing: -2px; text-shadow: 0 2px 10px rgba(0,0,0,0.3); }
.xm-banner-subtitle { font-size: 22px; margin-bottom: 0; color:#ffffff!important; font-weight:600; text-shadow: 0 1px 5px rgba(0,0,0,0.3); }
.xm-banner-controls { position: absolute; bottom: 50px; left: 0; width: 100%; z-index: 10; display: flex; justify-content: center; align-items: center; gap: 20px; }
.xm-banner-arrow { background: rgba(255,255,255,0.2); border: 1px solid rgba(255,255,255,0.4); color: white; width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.3s; }
.xm-banner-arrow:hover { background: white; color: #333; }
.xm-banner-dots { display: flex; gap: 10px; }
.xm-banner-dot { width: 12px; height: 12px; border-radius: 50%; background: rgba(255,255,255,0.4); cursor: pointer; transition: all 0.3s; }
.xm-banner-dot.active { background: white; transform: scale(1.2); }
.xm-about-grid { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 36px; align-items: stretch; margin-top: 42px; }
.xm-about-copy { background: white; border-radius: 24px; padding: 38px; box-shadow: 0 15px 45px rgba(0,0,0,0.06); }
.xm-about-copy p { color: #555; line-height: 1.9; margin: 0; }
.xm-about-media { border-radius: 24px; overflow: hidden; min-height: 360px; box-shadow: 0 15px 45px rgba(0,0,0,0.08); }
.xm-about-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.xm-services-section { background: linear-gradient(180deg, #faf6f3 0%, #ffffff 100%); }
.xm-services-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; margin-top: 42px; }
.xm-service-card { background: white; border-radius: 22px; overflow: hidden; box-shadow: 0 15px 35px rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.04); display: flex; flex-direction: column; }
.xm-service-image { height: 210px; background: linear-gradient(135deg, #f5e6e2, #fdf6f4); }
.xm-service-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.xm-service-body { padding: 24px; display:flex; flex-direction:column; gap:12px; flex:1; }
.xm-service-body h3 { margin: 0; color: #111; font-size: 1.2rem; }
.xm-service-body p { margin: 0; color: #666; line-height: 1.8; }
.xm-service-link { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; color: #C8402C; text-decoration: none; font-weight: 600; }
.xm-partners-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; margin-top: 42px; align-items: stretch; }
.xm-partner-card { width: 100%; min-height: 88px; background: white; border: 1px solid #edf1ee; border-radius: 12px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; box-shadow: 0 10px 28px rgba(0, 0, 0, 0.05); overflow: hidden; }
.xm-partner-logo { width: 100%; min-height: 88px; border-radius: 12px; background: #f4f7f5; display:flex; align-items:center; justify-content:center; overflow:hidden; box-sizing: border-box; padding: 5px 2px; }
.xm-partner-logo img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.xm-partner-placeholder { color: #C8402C; font-size: 1rem; font-weight: 700; padding: 0 10px; line-height: 1.4; }
.xm-partner-name { color: #1f2933; line-height: 1.5; font-size: 0.88rem; padding: 0 10px 12px; }
.xm-partner-name:empty { display: none; }
.xm-news-card { background: white; border-radius: 16px; overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,0.05); transition: transform 0.3s; }
.xm-news-card:hover { transform: translateY(-5px); }
.xm-news-img-box { height: 240px; overflow: hidden; background: transparent; }
.xm-news-img-box img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
.xm-news-card:hover .xm-news-img-box img { transform: scale(1.08); }
.xm-news-content { padding: 25px; }
.xm-news-meta { font-size: 0.85rem; color: #888; margin-bottom: 10px; display: block; }
.xm-news-content h3 { font-size: 1.1rem; line-height: 1.6; margin-bottom: 0; color: #333; }
.xm-team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; }
.xm-team-card { text-align: center; background: white; padding: 30px 20px; border-radius: 16px; box-shadow: 0 10px 30px rgba(0,0,0,0.03); transition: transform 0.3s; }
.xm-team-card:hover { transform: translateY(-5px); }
.xm-team-avatar { width: 120px; height: 120px; border-radius: 50%; margin: 0 auto 20px; background-color: #f0f0f0; overflow: hidden; border: 5px solid #fff; box-shadow: 0 0 10px rgba(0,0,0,0.1); }
.xm-team-avatar img { width: 100%; height: 100%; object-fit: cover; }
.xm-colored-icon { width: 20px; height: 20px; background-color: #8F9BB3; -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; margin-right: 10px; flex-shrink: 0; }
.xm-footer-social { position: relative; display: flex; gap: 15px; justify-content: center; margin-top: 20px; }
.xm-social-icon { position: relative; width: 46px; height: 46px; background: #ffffff; border: 1px solid #d9dfdb; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #C8402C; font-size: 22px; transition: all 0.3s ease; text-decoration: none; box-shadow: 0 6px 16px rgba(0,0,0,0.08); }
.xm-social-icon:hover { background: #fff5f2; border-color: #C8402C; transform: translateY(-3px); }
.xm-social-icon.wechat:hover { color: #07c160; border-color: #07c160; }
.xm-social-icon.tiktok:hover { color: #111111; border-color: #111111; }
.xm-social-glyph { width: 22px; height: 22px; display: block; background-repeat: no-repeat; background-position: center; background-size: contain; }
.xm-social-glyph-wechat { background-image: url('/static/phosphor-icons/PNGs/regular/wechat-logo.png'); }
.xm-social-glyph-tiktok { background-image: url('/static/phosphor-icons/PNGs/regular/tiktok-logo.png'); }
.xm-qr-container { position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%); z-index: 1000; display: none; background: white; border-radius: 10px; padding: 15px; box-shadow: 0 5px 20px rgba(0,0,0,0.15); min-width: 160px; }
.xm-social-icon:hover .xm-qr-container, .xm-social-icon.active .xm-qr-container { display: block; }
.xm-qr-image { width: 120px; height: 120px; display: block; margin: 0 auto; }
.xm-qr-title { text-align: center; font-size: 12px; color: #333; margin-top: 8px; font-weight: bold; }
.xm-qr-container::after { content: ''; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); border: 10px solid transparent; border-top-color: white; }
.xm-no-qr { padding: 20px; text-align: center; color: #666; font-size: 12px; min-width: 120px; }
.xm-timeline { position: relative; max-width: 800px; margin: 0 auto; }
.xm-timeline::after { content: ''; position: absolute; width: 2px; background-color: #eee; top: 0; bottom: 0; left: 50%; margin-left: -1px; }
.xm-timeline-item { padding: 10px 40px; position: relative; background-color: inherit; width: 50%; }
.xm-timeline-item::after { content: ''; position: absolute; width: 16px; height: 16px; right: -8px; background-color: white; border: 4px solid var(--xm-crimson); top: 24px; border-radius: 50%; z-index: 1; }
.xm-left { left: 0; }
.xm-right { left: 50%; }
.xm-left::before { content: " "; height: 0; position: absolute; top: 22px; width: 0; z-index: 1; right: 30px; border: medium solid white; border-width: 10px 0 10px 10px; border-color: transparent transparent transparent white; }
.xm-right::before { content: " "; height: 0; position: absolute; top: 22px; width: 0; z-index: 1; left: 30px; border: medium solid white; border-width: 10px 10px 10px 0; border-color: transparent white transparent transparent; }
.xm-right::after { left: -8px; }
.xm-timeline-content { padding: 20px 30px; background-color: white; position: relative; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); color:#666; }
.xm-culture-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.xm-cap-nav-section { background: white; border-bottom: 1px solid #eee; position: sticky; top: 0; z-index: 10; }
.xm-cap-nav-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.xm-cap-nav-list { display: flex; justify-content: center; gap: 24px; overflow-x: auto; white-space: nowrap; }
.xm-cap-nav-item { display: block; padding: 18px 0; text-decoration: none; color: #666; font-weight: 500; border-bottom: 3px solid transparent; }
.xm-cap-nav-item:hover { color: var(--xm-crimson, #C8402C); border-bottom-color: var(--xm-crimson, #C8402C); }
.xm-case-section { padding: 56px 0; border-bottom: 1px solid #edf0ef; }
.xm-case-heading { margin-bottom: 28px; }
.xm-case-heading h2 { margin: 0 0 8px; color: #111; }
.xm-case-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; }
.xm-case-card { background: white; border-radius: 20px; overflow: hidden; box-shadow: 0 12px 32px rgba(0,0,0,0.06); }
.xm-case-image { height: 260px; background: linear-gradient(135deg, #f5e6e2, #fdf6f4); display:flex; align-items:center; justify-content:center; }
.xm-case-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.xm-case-placeholder { color: #C8402C; font-weight: 700; font-size: 1.05rem; padding: 0 20px; text-align: center; line-height: 1.6; }
.xm-case-body { padding: 24px; }
.xm-case-body h3 { margin: 0 0 10px; color: #111; }
.xm-case-body p { margin: 0; color: #666; line-height: 1.8; }
.xm-why-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-top: 30px; }
.xm-why-card { background:white; border-radius:20px; padding:28px; box-shadow:0 14px 36px rgba(0,0,0,0.06); }
.xm-why-card h3 { margin:0 0 10px; color:#111; }
.xm-why-card p { margin:0; color:#666; line-height:1.8; }
.xm-careers-main { display:grid; grid-template-columns: 1.05fr 0.95fr; gap: 28px; margin-top: 40px; }
.xm-careers-copy, .xm-jobs-panel { background:white; border-radius:22px; padding:34px; box-shadow:0 14px 36px rgba(0,0,0,0.06); }
.xm-careers-copy p { color:#555; line-height:1.9; }
.xm-careers-cta { margin-top: 28px; background: linear-gradient(135deg, #0f8a53, #11b86c); color:white; border-radius:22px; padding:28px; }
.xm-careers-cta h3 { margin:0 0 10px; }
.xm-careers-cta p { margin:0 0 16px; color:rgba(255,255,255,0.92); }
.xm-job-card { padding: 22px 0; border-bottom: 1px solid #edf0ef; }
.xm-job-card:last-child { border-bottom: none; padding-bottom: 0; }
.xm-job-card h3 { margin: 0 0 8px; color:#111; }
.xm-job-card .xm-meta { color:#8a8f98; font-size: 0.92rem; margin-bottom: 10px; }
.xm-job-card .xm-desc { color:#666; line-height:1.8; }
.xm-contact-info-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-top: 34px; }
.xm-contact-card { background:white; border-radius:20px; padding:28px; box-shadow:0 14px 36px rgba(0,0,0,0.06); }
.xm-contact-card h3 { margin:14px 0 8px; color:#111; }
.xm-contact-card p { margin:0; color:#666; line-height:1.8; }
.xm-contact-card i { font-size: 28px; color: var(--xm-crimson); }
.xm-contact-card-phone-icon { width: 28px; height: 28px; display: inline-block; background-color: var(--xm-crimson); -webkit-mask-image: url('/static/phosphor-icons/PNGs/regular/phone-call.png'); mask-image: url('/static/phosphor-icons/PNGs/regular/phone-call.png'); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; font-size: 0; line-height: 0; }
.xm-contact-container { display: grid; grid-template-columns: 0.95fr 1.05fr; gap: 32px; margin-top: 42px; }
.xm-contact-info-card { background: var(--xm-crimson); color: white; padding: 36px; border-radius: 22px; box-shadow: 0 20px 40px rgba(200, 64, 44, 0.2); }
.xm-contact-form-card { padding: 36px; }
.xm-info-item { display: flex; align-items: flex-start; gap: 15px; margin-bottom: 24px; }
.xm-info-item i { font-size: 22px; opacity: 0.9; }
.xm-form-group { margin-bottom: 20px; }
.xm-form-group label { display: block; margin-bottom: 8px; color: #555; font-weight: 500; }
.xm-form-control { width: 100%; padding: 12px 15px; border: 1px solid #eee; border-radius: 8px; background: #f9f9f9; transition: all 0.3s; }
.xm-form-control:focus { outline: none; border-color: var(--xm-crimson); background: white; box-shadow: 0 0 0 3px rgba(200, 64, 44, 0.1); }
.xm-page-copy { margin-top: 18px; color: rgba(255,255,255,0.9); line-height: 1.8; }
.xm-team-avatar { width: 120px; height: 120px; border-radius: 50%; margin: 0 auto 20px; background-color: #f0f0f0; overflow: hidden; }
.xm-news-hero { background: #f8f9fa; padding-top: 140px; padding-bottom: 60px; text-align: center; }
.xm-news-grid-page { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-bottom: 60px; }
.xm-page-container { display: flex; justify-content: center; margin-top: 40px; }
.xm-page { display: flex; gap: 10px; }
.xm-page a, .xm-page span { padding: 8px 16px; border: 1px solid #ddd; background: white; color: #333; text-decoration: none; border-radius: 4px; transition: all 0.3s; }
.xm-page a:hover, .xm-page span.current { background: var(--xm-crimson); color: white; border-color: var(--xm-crimson); }
.xm-detail-hero { background: #f8f9fa; padding-top: 40px; padding-bottom: 40px; }
.xm-breadcrumb { color: #888; font-size: 0.9rem; margin-bottom: 20px; }
.xm-breadcrumb a { color: #888; text-decoration: none; transition: color 0.2s; }
.xm-breadcrumb a:hover { color: var(--xm-crimson); }
.xm-product-main { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; margin-bottom: 60px; }
.xm-product-gallery { border-radius: 20px; overflow: hidden; background: white; border: 1px solid #eee; }
.xm-main-image { width: 100%; height: 400px; object-fit: contain; padding: 20px; }
.xm-thumbs { display: flex; gap: 10px; padding: 10px; border-top: 1px solid #eee; overflow-x: auto; }
.xm-thumb { width: 80px; height: 80px; border-radius: 8px; cursor: pointer; border: 1px solid transparent; object-fit: cover; flex-shrink: 0; }
.xm-thumb.active { border-color: var(--xm-crimson); }
.xm-product-info h1 { font-size: 2.2rem; margin-bottom: 15px; color: #111; }
.xm-product-tag { display: inline-block; background: rgba(200, 64, 44, 0.1); color: var(--xm-crimson); padding: 4px 12px; border-radius: 4px; font-size: 0.85rem; font-weight: 600; margin-bottom: 20px; }
.xm-product-desc { color: #555; line-height: 1.8; margin-bottom: 20px; font-size:14px; }
.xm-specs-list { list-style: none; margin-bottom: 30px; padding: 0; }
.xm-specs-list li { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid #eee; color: #666; font-size: 0.95rem; }
.xm-specs-list li span:first-child { font-weight: 600; color: #333; }
.xm-pro-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 24px; background: var(--xm-crimson); color: white; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; transition: all 0.3s; text-decoration: none; }
.xm-pro-btn:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(200, 64, 44, 0.2); }
.xm-nav-link.active { color: var(--xm-crimson, #C8402C); }
.xm-pagination { margin-top: 40px; text-align: center; }
.xm-page-btn { display: inline-block; padding: 8px 16px; margin: 0 5px; background: #f5f5f5; color: #333; text-decoration: none; border-radius: 4px; transition: all 0.3s ease; border: 1px solid #ddd; }
.xm-page-btn:hover { background: var(--xm-crimson, #C8402C); color: white; border-color: var(--xm-crimson, #C8402C); }
.xm-page-btn.active { background: var(--xm-crimson, #C8402C); color: white; border-color: var(--xm-crimson, #C8402C); }
.xm-products-hot { background: #f8f9fa; }
.xm-products-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-top: 40px; }
.xm-product-card { background: white; border-radius: 12px; overflow: hidden; transition: transform 0.3s; box-shadow: 0 4px 20px rgba(0,0,0,0.04); }
.xm-product-card:hover { transform: translateY(-5px); }
.xm-card-image-block { height: 220px; background: #eee; }
.xm-card-content { padding: 25px; }
.xm-card-link { color: var(--xm-crimson); text-decoration: none; display: inline-flex; align-items: center; margin-top: 15px; font-weight: 600; }
.xm-scenario-row { display: flex; align-items: center; gap: 60px; margin-bottom: 80px; }
.xm-scenario-row:nth-child(even) { flex-direction: row-reverse; }
.xm-scenario-text { flex: 1; }
.xm-scenario-image { flex: 1; height: 400px; overflow: hidden; box-shadow: 0 20px 40px rgba(0,0,0,0.1); }
.xm-scenario-meta { list-style: none; display: flex; flex-wrap: wrap; gap: 15px; margin-top: 20px; }
.xm-scenario-meta li { padding: 5px 15px; background: rgba(200, 64, 44, 0.1); color: var(--xm-crimson); border-radius: 20px; font-size: 0.9rem; }
.xm-solution-hero { background: #f8f9fa; padding-top: 40px; padding-bottom: 60px; text-align: center; }
.xm-advantage-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; margin-bottom: 60px; }
.xm-advantage-card { background: white; padding: 30px 20px; border-radius: 16px; text-align: center; box-shadow: 0 4px 20px rgba(0,0,0,0.03); transition: transform 0.3s; }
.xm-advantage-card:hover { transform: translateY(-5px); }
.xm-adv-icon { font-size: 40px; color: #C8402C; margin-bottom: 15px; }
.xm-scenario-banner { width: 100%; height: 500px; background: #eee; margin-bottom: 60px; position: relative; overflow: hidden; border-radius: 20px; }
.xm-scenario-banner img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; z-index: 1; }
.xm-scenario-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.4); z-index: 2; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; color: white; }
.xm-scenario-overlay h2 { font-size: 2.5rem; margin-bottom: 10px; color: white; }
.xm-scenario-overlay p { font-size: 1.2rem; opacity: 0.9; }
.xm-application-intro { display: block; max-width: 1200px; margin: 0 auto 60px; }
.xm-product-card { background: white; border-radius: 12px; overflow: hidden; transition: transform 0.3s; box-shadow: 0 4px 20px rgba(0,0,0,0.04); display: flex; flex-direction: column; border: 1px solid transparent; }
.xm-product-card:hover { transform: translateY(-5px); border-color: #C8402C; }
.xm-card-image-block { height: 220px; background: #eee; position: relative; }
.xm-card-content { padding: 25px; flex: 1; display: flex; flex-direction: column; }
.xm-card-content h3 { margin-top: 0; margin-bottom: 10px; font-size: 1.2rem; color:#666 }
.xm-card-content p { color: #666; font-size: 0.95rem; line-height: 1.6; margin-bottom: 20px; flex: 1; }
.xm-card-link { color: var(--xm-crimson); text-decoration: none; display: inline-flex; align-items: center; font-weight: 600; margin-top: auto; }
.xm-card-link i { margin-left: 8px; transition: transform 0.3s; }
.xm-card-link:hover i { transform: translateX(5px); }