@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600;700;800&family=Inter:wght@400;500;600;700&display=swap');

:root { --ink:#15161a; --blue:#2527bc; --line:#e6e7eb; --soft:#f5f6f8; --muted:#667085; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); font-family:Inter,Arial,sans-serif; }
.display { font-family:'Barlow Condensed',Impact,sans-serif; letter-spacing:-.025em; }
.site-header { height:76px; background:#fff; position:sticky; top:0; z-index:40; border-bottom:1px solid #eeeeef; }
.nav-wrap { max-width:1250px; height:100%; margin:auto; padding:0 24px; display:flex; align-items:center; gap:clamp(24px,3vw,40px); }
.brand { flex:0 0 176px; width:176px; height:62px; overflow:hidden; display:block; background:#08265d; }
.brand img { position:relative; top:50%; width:176px; height:117px; max-width:none; display:block; transform:translateY(-50%); }
.nav-links { flex:1; min-width:0; display:flex; align-items:center; justify-content:flex-start; gap:clamp(18px,2.4vw,32px); font-family:'Barlow Condensed',sans-serif; font-size:18px; font-weight:600; }
.nav-links a { text-decoration:none; color:var(--ink); padding:26px 0 23px; border-bottom:3px solid transparent; white-space:nowrap; }
.nav-links a:hover,.nav-links a.active { color:var(--blue); border-bottom-color:var(--blue); }
.header-tools { display:flex; align-items:center; gap:14px; color:#7e8190; }
.locale { border:1px solid #d6d8df; padding:6px 10px; background:white; font-size:11px; color:#4b5563; }
.menu-button { display:none; background:none;border:0;font-size:26px;color:var(--ink); }
.hero { min-height:630px; position:relative; color:#fff; overflow:hidden; background:#111; }
.hero-slide { position:absolute; inset:0; display:flex; align-items:center; opacity:0; transform:scale(1.03); transition:opacity .8s ease,transform 6s linear; pointer-events:none; background:center/cover no-repeat; }
.hero-slide.active { opacity:1; transform:scale(1); pointer-events:auto; }
.hero-content { position:relative; z-index:1; width:min(1250px,100%); margin:auto; padding:80px 24px; }
.hero h1 { font-size:clamp(48px,6.1vw,88px); line-height:.9; text-transform:uppercase; max-width:680px; margin:0 0 26px; }
.hero p { font-size:20px; max-width:500px; margin:0 0 30px; line-height:1.5; }
.hero-controls { position:absolute; z-index:4; bottom:30px; left:50%; translate:-50%; display:flex; gap:10px; align-items:center; }
.hero-dot { width:36px; height:3px; border:0; padding:0; background:rgba(255,255,255,.45); cursor:pointer; }
.hero-dot.active { background:#fff; }
.hero-arrow { position:absolute; z-index:4; top:50%; translate:0 -50%; color:#fff; border:0; background:rgba(0,0,0,.18); width:55px; height:76px; font-size:48px; font-weight:200; cursor:pointer; }
.hero-arrow:hover { background:rgba(37,39,188,.8); }.hero-arrow.prev { left:0; }.hero-arrow.next { right:0; }
.button { display:inline-flex; align-items:center; gap:11px; background:var(--blue); color:#fff; padding:13px 24px; font:600 18px 'Barlow Condensed',sans-serif; text-decoration:none; border:0; cursor:pointer; transition:.2s; }
.button:hover { background:#151793; transform:translateY(-2px); }
.button.outline { background:transparent; border:1px solid #fff; }
.split-feature { display:grid; grid-template-columns:1fr 1fr; gap:4px; background:#fff; }
.feature-card { height:530px; position:relative; color:#fff; overflow:hidden; background-size:cover; background-position:center; }
.feature-card::after,.banner::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.56)); }
.feature-card .content,.banner .content { position:absolute; inset:0; z-index:1; display:flex; flex-direction:column; justify-content:flex-start; align-items:center; text-align:center; padding:58px 24px; }
.feature-card h2 { font-size:clamp(34px,4vw,58px); margin:0; text-transform:uppercase; }
.feature-card p { margin:7px 0 19px; font:400 25px 'Barlow Condensed',sans-serif; }
.banner { height:540px; position:relative; background:url('assets/xc.jpg') center/cover; color:#fff; }
.banner .content { width:min(1250px,100%); margin:auto; align-items:flex-start; text-align:left; justify-content:center; }
.banner h2 { font-size:clamp(48px,6vw,86px); line-height:.88; margin:8px 0 26px; text-transform:uppercase; }
.eyebrow { letter-spacing:.16em; font-size:11px; text-transform:uppercase; font-weight:700; color:var(--blue); }
.section { padding:92px 24px; }
.section.narrow { max-width:1020px; margin:auto; }
.section-head { max-width:740px; margin:0 auto 48px; text-align:center; }
.section-head h2 { font-size:54px; line-height:.9; text-transform:uppercase; margin:12px 0 16px; }
.section-head p { color:var(--muted); line-height:1.7; margin:0; }
.discover { min-height:400px; background:linear-gradient(#fff 0%,#fafafa 100%); display:grid; place-items:center; text-align:center; }
.discover h2 { font-size:62px; margin:4px 0 4px; text-transform:uppercase; }
.discover p { color:#6d727c; font:400 24px 'Barlow Condensed',sans-serif; margin:0; }
.discover-links { max-width:1120px; margin:0 auto; padding:0 24px 92px; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.discover-link { position:relative; min-height:270px; padding:30px; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; color:#fff; text-decoration:none; background:#21242c center/cover; }
.discover-link::before { content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(7,10,16,.05),rgba(7,10,16,.72)); transition:.2s; }.discover-link:hover::before { background:linear-gradient(180deg,rgba(37,39,188,.22),rgba(7,10,16,.78)); }
.discover-link > * { position:relative; z-index:1; }.discover-link h3 { margin:5px 0 4px; font-size:40px; text-transform:uppercase; }.discover-link p { margin:0; font-size:13px; }
.page-hero { height:325px; color:#fff; display:grid; place-items:center; position:relative; background:#20212b center/cover; }
.page-hero::after { content:''; position:absolute; inset:0; background:rgba(8,12,18,.5); }
.contact-hero { background:#20212b; }
.contact-hero::after { display:none; }
.page-hero > * { position:relative; z-index:1; text-align:center; }
.page-hero h1 { text-transform:uppercase; font-size:66px; margin:0; }
.page-hero p { font-size:16px; margin:8px 0 0; }
.finder { max-width:1120px; margin:-38px auto 0; position:relative; z-index:2; padding:24px; background:white; box-shadow:0 12px 36px rgba(25,30,45,.12); }
.finder h2 { margin:0 0 17px; font-size:28px; text-transform:uppercase; }
.filter-row { display:grid; grid-template-columns:repeat(4,1fr) auto; gap:10px; }
.filter-row select,.contact-form input,.contact-form textarea { width:100%; padding:11px 12px; border:1px solid #dfe1e6; background:#fff; color:#4b5563; font:13px Inter,sans-serif; }
.filter-button { padding:0 22px; border:0; background:var(--blue); color:white; font:600 16px 'Barlow Condensed',sans-serif; cursor:pointer; }
.catalog { max-width:1240px; margin:auto; padding:76px 24px; }
.catalog-title { border-left:6px solid var(--blue); padding-left:14px; margin:0 0 22px; font-size:34px; text-transform:uppercase; }
.product-group { margin-bottom:58px; }
.catalog-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.product-card { border:1px solid #e3e5ea; background:#fff; display:flex; flex-direction:column; min-height:408px; transition:box-shadow .2s,transform .2s; }
.product-card:hover { transform:translateY(-4px); box-shadow:0 12px 28px rgba(18,20,32,.11); }
.product-card img { width:100%; height:184px; object-fit:contain; padding:16px; background:linear-gradient(145deg,#fff,#f5f6f8); }
.product-card .info { display:flex; flex-direction:column; flex:1; padding:14px 15px 15px; }
.product-card h3 { font-size:22px; line-height:1; margin:0 0 12px; min-height:44px; }
.product-card .stats { font-size:11px; color:#737783; line-height:1.6; margin-bottom:12px; }
.product-card .stats b { color:#333842; font-weight:700; }
.card-actions { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-top:auto; }
.card-actions a,.card-actions button { border:0; padding:8px 4px; text-align:center; color:#fff; text-decoration:none; background:var(--blue); font:600 13px 'Barlow Condensed',sans-serif; cursor:pointer; }
.card-actions button { background:#272936; }
.card-actions button.selected { background:#16834b; }
.industry-grid { max-width:1040px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.industry-card { height:195px; position:relative; overflow:hidden; color:#fff; background:#444 center/cover; text-decoration:none; }
.industry-card::after { content:''; position:absolute; inset:0; background:rgba(9,14,24,.45); transition:.2s; }
.industry-card:hover::after { background:rgba(37,39,188,.52); }
.industry-card span { position:absolute; z-index:1; inset:0; display:grid; place-items:center; text-align:center; font:600 26px 'Barlow Condensed',sans-serif; }
.cta { padding:100px 24px; text-align:center; background:#fff; }
.cta h2 { font-size:48px; text-transform:uppercase; margin:0 0 8px; }
.cta p { color:#6e7280; font:22px 'Barlow Condensed',sans-serif; margin:0 0 26px; }
.info-grid { max-width:1120px; margin:auto; display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.info-card { padding:34px 28px; border-top:4px solid var(--blue); background:#fff; box-shadow:0 6px 25px rgba(17,24,39,.08); }
.info-card h3 { margin:7px 0 9px; font-size:30px; text-transform:uppercase; }
.info-card p { margin:0; color:#667085; line-height:1.65; font-size:14px; }
.contact-layout { max-width:1100px; margin:auto; display:grid; grid-template-columns:.82fr 1.18fr; gap:54px; }
.contact-layout h2 { font-size:42px; line-height:.95; margin:10px 0 20px; text-transform:uppercase; }
.contact-layout p { color:#667085; font-size:14px; line-height:1.7; }
.contact-details { margin-top:28px; padding-top:22px; border-top:1px solid var(--line); font-size:14px; line-height:2; }
.contact-form { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.contact-form .full { grid-column:1 / -1; }
.contact-form textarea { height:130px; resize:vertical; }
.form-success { display:none; grid-column:1/-1; background:#e8fff0; color:#126b36; padding:12px; font-size:13px; }
.article-grid { max-width:1120px; margin:auto; display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.article-card { border:1px solid var(--line); background:#fff; }
.article-card .date { color:var(--blue); font-size:12px; font-weight:700; }
.article-card .copy { padding:23px; }
.article-card h3 { font-size:28px; line-height:1; margin:9px 0 12px; }
.article-card p { color:#667085; font-size:13px; line-height:1.6; }
.quick-links { background:#f5f6f7; }
.quick-inner { max-width:900px; margin:auto; min-height:88px; display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:center; text-align:center; }
.quick-inner a { color:#25262b; text-decoration:none; font:600 20px 'Barlow Condensed',sans-serif; }
.quick-inner a span { color:var(--blue); margin-right:9px; }
.footer { background:#222327; color:#fff; padding:58px 24px 18px; }
.footer-inner { max-width:1120px; margin:auto; display:grid; grid-template-columns:1.05fr 1.05fr .9fr .95fr 1.35fr; gap:26px; }
.footer h3 { margin:0 0 12px; font-size:20px; }
.footer a,.footer p { display:block; text-decoration:none; color:#c1c4cb; font-size:11px; line-height:1.65; margin:0; }
.footer .newsletter { display:flex; margin:12px 0; }
.footer input { min-width:0; padding:9px; border:0; flex:1; font-size:11px; }
.footer button { background:var(--blue); color:#fff; border:0; padding:0 13px; font-size:18px; }
.legal { max-width:1120px; margin:34px auto 0; padding-top:14px; border-top:1px solid #5d5e62; color:#aeb1b7; font-size:10px; display:flex; justify-content:space-between; }
.backtop { position:fixed; right:18px; bottom:18px; width:42px; height:42px; display:grid; place-items:center; background:var(--blue); color:#fff; border:0; opacity:0; pointer-events:none; transition:.2s; z-index:20; }
.backtop.show { opacity:1; pointer-events:auto; }
.floating-contact { position:fixed; left:20px; bottom:20px; z-index:50; display:flex; flex-direction:column-reverse; align-items:flex-start; gap:10px; }
.floating-contact-actions { display:flex; flex-direction:column; align-items:center; gap:10px; }
.floating-contact-toggle,.floating-contact-action { display:grid; place-items:center; width:54px; height:54px; border:0; border-radius:50%; color:#fff; box-shadow:0 5px 18px rgba(15,23,42,.24); cursor:pointer; }
.floating-contact-toggle { position:relative; background:#2527bc; transition:transform .2s,background .2s; }
.floating-contact-toggle:hover { background:#151793; transform:scale(1.06); }
.floating-contact-toggle svg { width:28px; height:28px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.floating-contact-toggle .message-icon { fill:currentColor; stroke:none; }
.floating-contact-toggle .message-dot { fill:#2527bc; }
.floating-contact-action { width:48px; height:48px; opacity:0; visibility:hidden; transform:translateX(-8px) scale(.8); transition:opacity .22s,transform .22s,visibility .22s; }
.floating-contact-action svg { width:25px; height:25px; fill:currentColor; }
.floating-contact-action.whatsapp { background:#25d366; }
.floating-contact-action.phone { background:#16834b; }
.floating-contact.open .floating-contact-action { opacity:1; visibility:visible; transform:translateX(0) scale(1); }
.floating-contact.open .floating-contact-action.whatsapp { transition-delay:.04s; }
.floating-contact.open .floating-contact-action.phone { transition-delay:.09s; }
.floating-contact-toggle .message-icon,.floating-contact-toggle .close-icon { position:absolute; transition:opacity .2s,transform .2s; }
.floating-contact-toggle .message-icon { opacity:1; transform:rotate(0) scale(1); }
.floating-contact-toggle .close-icon { opacity:0; transform:rotate(-90deg) scale(.6); fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
.floating-contact.open .floating-contact-toggle .message-icon { opacity:0; transform:rotate(90deg) scale(.6); }
.floating-contact.open .floating-contact-toggle .close-icon { opacity:1; transform:rotate(0) scale(1); }
@media (prefers-reduced-motion:reduce) { .floating-contact-toggle,.floating-contact-action { transition:none; } }
.modal { position:fixed; inset:0; z-index:60; padding:20px; display:none; background:rgba(5,8,15,.68); place-items:center; }
.modal.open { display:grid; }
.modal-box { max-width:700px; width:100%; background:#fff; padding:30px; position:relative; }
.modal-box button.close { position:absolute; top:10px; right:14px; border:0; background:transparent; font-size:26px; }
.compare-list { margin:18px 0 0; padding:0; list-style:none; }
.compare-list li { padding:11px 0; border-bottom:1px solid var(--line); font-size:13px; display:flex; justify-content:space-between; gap:20px; }
.remove-compare { border:0; background:transparent; color:#a11717; cursor:pointer; font-size:20px; line-height:1; }
.compare-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:22px; }
.compare-product { position:relative; padding:14px; border:1px solid var(--line); background:#fff; }
.compare-product>img { display:block; width:100%; height:145px; object-fit:contain; background:#f6f7f9; margin-bottom:14px; }
.compare-product h3 { margin:6px 0 16px; min-height:55px; font-size:23px; line-height:.96; }
.compare-product .remove-compare { position:absolute; top:8px; right:8px; z-index:1; width:26px; height:26px; border-radius:50%; background:#fff; box-shadow:0 2px 7px rgba(0,0,0,.13); }
.compare-product dl { margin:0 0 16px; border-top:1px solid var(--line); }.compare-product dl div { display:flex; justify-content:space-between; gap:8px; padding:9px 0; border-bottom:1px solid var(--line); }.compare-product dt { color:#707583; font-size:10px; text-transform:uppercase; }.compare-product dd { margin:0; color:#20212a; font-size:11px; font-weight:700; text-align:right; }.compare-product .button { width:100%; justify-content:center; padding:9px 6px; font-size:14px; }.compare-empty { grid-column:1/-1; padding:28px 0; text-align:center; color:#6b7280; }.modal-box { max-width:1040px; }
.compare-tray { position:fixed; z-index:35; right:22px; bottom:22px; width:min(350px,calc(100vw - 32px)); display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px 14px 14px 18px; color:#fff; background:#20212b; border-radius:14px; box-shadow:0 14px 35px rgba(15,23,42,.25); transform:translateY(115px); opacity:0; transition:.25s; pointer-events:none; }
.compare-tray.show { transform:translateY(0); opacity:1; pointer-events:auto; }.compare-tray p { margin:0; font-size:12px; color:#d5d7de; }.compare-tray b { display:block; font:600 21px 'Barlow Condensed',sans-serif; }.compare-tray button { border:0; background:var(--blue); color:#fff; padding:9px 13px; font:600 15px 'Barlow Condensed',sans-serif; cursor:pointer; }
@media (max-width:900px){ .brand{flex-basis:148px;width:148px;height:54px}.brand img{width:148px;height:99px}.nav-wrap{gap:24px}.nav-links{gap:14px;font-size:16px}.catalog-grid{grid-template-columns:repeat(3,1fr)}.footer-inner{grid-template-columns:repeat(3,1fr)} }
@media (max-width:700px){
  .site-header{height:68px;box-shadow:0 2px 12px rgba(15,23,42,.07)}.nav-wrap{padding:0 18px;gap:0}.brand{flex:0 0 140px;width:140px;height:48px}.brand img{width:140px;height:93px}.menu-button{display:grid;place-items:center;width:38px;height:38px;margin-left:auto;border-radius:50%;background:#f1f2f6;color:var(--blue);font-size:20px;line-height:1}.nav-links{display:none;position:absolute;top:78px;left:12px;right:12px;flex:none;padding:11px 18px 14px;background:rgba(255,255,255,.97);border:1px solid rgba(255,255,255,.72);border-radius:18px;box-shadow:0 18px 40px rgba(15,23,42,.18);backdrop-filter:blur(14px);flex-direction:column;align-items:stretch;gap:0}.nav-links.open{display:flex;animation:mobileMenu .2s ease-out}.nav-links a{width:100%;padding:14px 3px 12px;border:0!important;border-bottom:1px solid #eceef3!important;font:600 20px 'Barlow Condensed',sans-serif;letter-spacing:.01em}.nav-links a:last-child{border-bottom:0!important}.nav-links a.active{color:var(--blue);padding-left:11px;box-shadow:inset 3px 0 0 var(--blue)}.header-tools{display:none}
  .hero{min-height:0;height:auto;aspect-ratio:16/9;background:#111}.hero-slide{background-size:contain;background-color:#111}.hero-controls{bottom:12px;gap:6px}.hero-dot{width:24px;height:2px}.hero-arrow{display:none}.split-feature{grid-template-columns:1fr}.feature-card{height:380px}.banner{height:480px}.section{padding:65px 20px}.section-head h2,.page-hero h1,.cta h2{font-size:44px}.discover{min-height:290px}.discover h2{font-size:48px}.discover-links{grid-template-columns:1fr;padding-bottom:65px}.filter-row{grid-template-columns:1fr 1fr}.filter-button{height:39px}.catalog{padding:55px 16px}.catalog-grid{grid-template-columns:repeat(2,1fr);gap:10px}.product-card{min-height:375px}.product-card img{height:140px;padding:10px}.product-card h3{font-size:18px}.industry-grid{grid-template-columns:1fr 1fr;gap:10px}.industry-card{height:145px}.industry-card span{font-size:21px}.contact-layout{grid-template-columns:1fr;gap:24px}.article-grid,.info-grid{grid-template-columns:1fr}.footer-inner{grid-template-columns:1fr 1fr}.legal{display:block;line-height:1.7}.page-hero{height:250px}.finder{margin:-20px 14px 0;padding:18px}.quick-inner{grid-template-columns:1fr;gap:0;padding:17px}.quick-inner a{padding:8px}.contact-form{grid-template-columns:1fr}
}
@keyframes mobileMenu{from{opacity:0;transform:translateY(-10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media (max-width:700px){.compare-grid{grid-template-columns:1fr}.compare-product>img{height:190px}.compare-product h3{min-height:0}.modal{padding:10px}.modal-box{padding:24px 18px;max-height:92vh;overflow:auto}}

/* Product detail page */
.detail-layout{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center;max-width:72rem;margin:0 auto}
.detail-image-wrap{background:#f5f6f8;min-height:370px;display:flex;align-items:center;justify-content:center;padding:2rem}
.detail-image-wrap img{max-width:100%;max-height:350px;object-fit:contain}
.detail-title{font-size:clamp(2.5rem,6vw,4.5rem);line-height:.9;text-transform:uppercase;margin:1rem 0 1.5rem}
.detail-desc{color:#475569;line-height:1.75;margin-bottom:1.75rem}
.detail-specs{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;border-top:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0;padding:1.25rem 0;margin-bottom:1.75rem}
.detail-overview-section{background:#f5f6f8;padding-top:1rem}
@media(max-width:768px){.detail-layout{grid-template-columns:1fr}.detail-image-wrap{min-height:260px}}
