XTK

Desarrollada para dominar los senderos con velocidad, precisión y confianza. XTK combina un cuadro de fibra de carbono con una plataforma moderna de montaña, ofreciendo una conducción ágil, eficiente y preparada para afrontar los desafíos del trail y el cross-country.

Equipada con transmisión Shimano Deore de 12 velocidades, suspensión de aire SR Suntour con bloqueo remoto y dropper post, XTK ofrece el equilibrio ideal entre rendimiento, control y capacidad para llevar cada rodada al siguiente nivel.

/* ===== Especificaciones XTK — sin marcos, fondos transparentes ===== */
.xtk{
–xtk-line:#e3e8e6; –xtk-head:rgba(4,120,87,.07); –xtk-sub:#111614;
–xtk-txt:#111827; –xtk-mut:#6b7280;
–xtk-accent:#047857; /* esmeralda */
–xtk-accent-soft:rgba(4,120,87,.09);
–xtk-black:#111614; /* negro del cuadro */
all:initial;
display:block; container-type:inline-size;
box-sizing:border-box; width:100%; max-width:650px;
font-family:-apple-system,BlinkMacSystemFont,”Segoe UI”,Roboto,Helvetica,Arial,sans-serif;
color:var(–xtk-txt); line-height:1.45; text-align:left;
background:transparent;
}
.xtk *,.xtk *::before,.xtk *::after{box-sizing:border-box}

.xtk .xtk-title{
margin:0 0 4px; padding:0; font-size:19px; font-weight:700;
letter-spacing:.02em; line-height:1.25; text-transform:none;
}
.xtk .xtk-badge{
font-size:11px; font-weight:700; color:var(–xtk-accent);
letter-spacing:.08em; margin-left:8px; vertical-align:2px; white-space:nowrap;
}
.xtk .xtk-sub{margin:0 0 16px; padding:0; font-size:13px; color:var(–xtk-mut)}

.xtk .xtk-switch{
display:flex; width:100%; flex-wrap:nowrap; gap:4px; padding:3px; margin:0 0 16px;
border:1px solid var(–xtk-line); border-radius:9px; background:transparent;
max-width:100%;
}
.xtk .xtk-switch button{
appearance:none; -webkit-appearance:none; margin:0;
border:1px solid var(–xtk-line);
background:rgba(0,0,0,.02); cursor:pointer; font-family:inherit; font-size:13px;
font-weight:600; color:var(–xtk-mut); letter-spacing:.04em; line-height:1;
padding:9px 0; border-radius:7px;
transition:background .16s,color .16s,border-color .16s;
text-transform:none; white-space:nowrap; min-width:0; flex:1 1 0;
}
.xtk .xtk-switch button:hover{
color:var(–xtk-txt); background:rgba(0,0,0,.05); border-color:#c9ccd2;
}
.xtk .xtk-switch button:focus-visible{outline:2px solid var(–xtk-accent); outline-offset:2px}
.xtk .xtk-switch button[aria-selected=”true”]{
background:var(–xtk-accent);
color:#fff;
border-color:var(–xtk-accent);
font-weight:700;
}
@media (prefers-reduced-motion: reduce){
.xtk .xtk-switch button{transition:none}
}

.xtk .xtk-scroll{width:100%; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch}

/* Tabla sin marcos: solo separadores horizontales */
.xtk table{
width:100%; max-width:100%; table-layout:fixed;
border-collapse:collapse; border-spacing:0; border:0;
font-size:12.5px; background:transparent; margin:0;
}
.xtk thead th{
background:var(–xtk-head); text-align:left; padding:10px;
font-weight:600; font-size:12.5px; color:var(–xtk-txt);
border:0; border-bottom:2px solid var(–xtk-accent);
text-transform:none; letter-spacing:0;
}
.xtk th.xtk-c1,.xtk td.xtk-c1{width:36%}
.xtk td{
padding:9px 10px; border:0; border-bottom:1px solid var(–xtk-line);
vertical-align:top; background:transparent; color:var(–xtk-txt); font-size:12.5px;
overflow-wrap:anywhere; word-break:normal; hyphens:auto;
}
.xtk td.xtk-c1{font-weight:600}
.xtk tr.xtk-group td{
background:var(–xtk-black); color:#f3f6f5; font-weight:700;
font-size:11.5px; letter-spacing:.09em; padding:10px;
border:0; border-left:3px solid var(–xtk-accent);
}
.xtk tbody tr:not(.xtk-group):hover td{background:var(–xtk-accent-soft); transition:background .16s}
.xtk td.xtk-c1{color:#0b3f31}

/* ===== Modo apilado (tarjetas) ===== */
@container (max-width: 400px){
.xtk .xtk-scroll{overflow-x:visible}
.xtk table{table-layout:auto; border:0; display:block; width:100%}
.xtk thead{display:none}
.xtk tbody{display:block; width:100%}
.xtk tbody tr{display:block; width:100%; margin:0}

.xtk tbody tr:not(.xtk-group){
border:0; border-bottom:1px solid var(–xtk-line); padding:2px 0;
}
.xtk td{
display:block; width:100%; max-width:100%; min-width:0;
border:0; padding:7px 2px; white-space:normal;
overflow-wrap:break-word; word-break:break-word;
}
.xtk td.xtk-c1{
width:auto; font-size:10.5px; font-weight:700; letter-spacing:.06em;
color:var(–xtk-mut); padding-bottom:0; line-height:1.35;
}
.xtk td:not(.xtk-c1){padding-top:3px; padding-bottom:12px; line-height:1.5}

.xtk tbody tr.xtk-group{border:0; padding:0; margin:0}
.xtk tr.xtk-group td{
padding:10px 12px; line-height:1.3;
border:0; border-left:3px solid var(–xtk-accent);
}
.xtk tbody tr.xtk-group:not(:first-child) td{
border-top:14px solid transparent; background-clip:padding-box;
}

.xtk .xtk-title{font-size:17px; line-height:1.3}
.xtk .xtk-badge{display:inline-block; margin-left:0; margin-top:4px; vertical-align:baseline}
.xtk .xtk-sub{font-size:12.5px}
.xtk .xtk-switch{gap:6px}
.xtk .xtk-switch button{padding:10px 6px; font-size:12.5px; letter-spacing:.03em; text-align:center}
}

@supports not (container-type: inline-size){
@media (max-width: 420px){
.xtk .xtk-scroll{overflow-x:visible}
.xtk table{table-layout:auto; border:0; display:block; width:100%}
.xtk thead{display:none}
.xtk tbody{display:block; width:100%}
.xtk tbody tr{display:block; width:100%; margin:0}
.xtk tbody tr:not(.xtk-group){border:0; border-bottom:1px solid var(–xtk-line); padding:2px 0}
.xtk td{
display:block; width:100%; max-width:100%; min-width:0;
border:0; padding:7px 2px; white-space:normal;
overflow-wrap:break-word; word-break:break-word;
}
.xtk td.xtk-c1{
width:auto; font-size:10.5px; font-weight:700; letter-spacing:.06em;
color:var(–xtk-mut); padding-bottom:0; line-height:1.35;
}
.xtk td:not(.xtk-c1){padding-top:3px; padding-bottom:12px; line-height:1.5}
.xtk tbody tr.xtk-group{border:0; padding:0; margin:0}
.xtk tr.xtk-group td{padding:10px 12px; line-height:1.3; border:0; border-left:3px solid var(–xtk-accent)}
.xtk tbody tr.xtk-group:not(:first-child) td{
border-top:14px solid transparent; background-clip:padding-box;
}
.xtk .xtk-title{font-size:17px; line-height:1.3}
.xtk .xtk-badge{display:inline-block; margin-left:0; margin-top:4px; vertical-align:baseline}
.xtk .xtk-sub{font-size:12.5px}
.xtk .xtk-switch{gap:6px}
.xtk .xtk-switch button{padding:10px 6px; font-size:12.5px; letter-spacing:.03em; text-align:center}
}
}

@media print{
.xtk .xtk-switch{display:none}
.xtk td,.xtk th{font-size:10px}
}